You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP
Socket
Book a DemoInstallSign in
Socket

@fluentui/react-dialog

Package Overview
Dependencies
Maintainers
10
Versions
875
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@fluentui/react-dialog - npm Package Compare versions

Comparing version

to
0.0.0-nightly-20250704-0407.1

9

lib-commonjs/components/DialogBody/useDialogBodyStyles.styles.js

@@ -25,9 +25,10 @@ "use strict";

* Styles for the root slot
*/ const useResetStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r1h3qql9", null, {
*/ const useResetStyles = /*#__PURE__*/ (0, _react.__resetStyles)("rzfgfes", null, {
r: [
".r1h3qql9{overflow:unset;gap:8px;display:grid;max-height:calc(100vh - 2 * 24px);box-sizing:border-box;grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr auto;}"
".rzfgfes{overflow:unset;gap:8px;display:grid;max-height:calc(100vh - 2 * 24px);box-sizing:border-box;grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr auto;}"
],
s: [
"@media screen and (max-width: 480px){.r1h3qql9{max-width:100vw;grid-template-rows:auto 1fr auto;}}",
"@media screen and (max-height: 359px){.r1h3qql9{max-height:unset;}}"
"@supports (height: 1dvh){.rzfgfes{max-height:calc(100dvh - 2 * 24px);}}",
"@media screen and (max-width: 480px){.rzfgfes{max-width:100vw;grid-template-rows:auto 1fr auto;}}",
"@media screen and (max-height: 359px){.rzfgfes{max-height:unset;}}"
]

@@ -34,0 +35,0 @@ });

@@ -26,22 +26,24 @@ "use strict";

* Styles for the root slot
*/ const useRootBaseStyle = /*#__PURE__*/ (0, _react.__resetStyles)("rsmdyd3", "rup8wml", {
*/ const useRootBaseStyle = /*#__PURE__*/ (0, _react.__resetStyles)("r5905w0", "ru9dzwv", {
r: [
".rsmdyd3{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}",
".rsmdyd3:focus{outline-style:none;}",
".rsmdyd3:focus-visible{outline-style:none;}",
".rsmdyd3[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
".rsmdyd3[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
".rup8wml{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}",
".rup8wml:focus{outline-style:none;}",
".rup8wml:focus-visible{outline-style:none;}",
".rup8wml[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
".rup8wml[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
".r5905w0{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}",
".r5905w0:focus{outline-style:none;}",
".r5905w0:focus-visible{outline-style:none;}",
".r5905w0[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
".r5905w0[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
".ru9dzwv{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}",
".ru9dzwv:focus{outline-style:none;}",
".ru9dzwv:focus-visible{outline-style:none;}",
".ru9dzwv[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
".ru9dzwv[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
],
s: [
"@media (forced-colors: active){.rsmdyd3[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
"@media screen and (max-width: 480px){.rsmdyd3{max-width:100vw;}}",
"@media screen and (max-height: 359px){.rsmdyd3{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}",
"@media (forced-colors: active){.rup8wml[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}",
"@media screen and (max-width: 480px){.rup8wml{max-width:100vw;}}",
"@media screen and (max-height: 359px){.rup8wml{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}"
"@media (forced-colors: active){.r5905w0[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
"@supports (height: 1dvh){.r5905w0{max-height:100dvh;}}",
"@media screen and (max-width: 480px){.r5905w0{max-width:100vw;}}",
"@media screen and (max-height: 359px){.r5905w0{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}",
"@media (forced-colors: active){.ru9dzwv[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}",
"@supports (height: 1dvh){.ru9dzwv{max-height:100dvh;}}",
"@media screen and (max-width: 480px){.ru9dzwv{max-width:100vw;}}",
"@media screen and (max-height: 359px){.ru9dzwv{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}"
]

@@ -52,3 +54,3 @@ });

]);
const useBackdropStyles = /*#__PURE__*/ (0, _react.__styles)({
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
nestedDialogBackdrop: {

@@ -67,8 +69,8 @@ De3pzq: "f1c21dwh"

const backdropBaseStyle = useBackdropBaseStyle();
const backdropStyles = useBackdropStyles();
const styles = useStyles();
root.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.root, rootBaseStyle, root.className);
if (backdrop) {
backdrop.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && backdropStyles.nestedDialogBackdrop, backdrop.className);
backdrop.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && styles.nestedDialogBackdrop, backdrop.className);
}
return state;
};

@@ -9,5 +9,5 @@ import { __resetStyles, mergeClasses } from '@griffel/react';

*/
const useResetStyles = /*#__PURE__*/__resetStyles("r1h3qql9", null, {
r: [".r1h3qql9{overflow:unset;gap:8px;display:grid;max-height:calc(100vh - 2 * 24px);box-sizing:border-box;grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr auto;}"],
s: ["@media screen and (max-width: 480px){.r1h3qql9{max-width:100vw;grid-template-rows:auto 1fr auto;}}", "@media screen and (max-height: 359px){.r1h3qql9{max-height:unset;}}"]
const useResetStyles = /*#__PURE__*/__resetStyles("rzfgfes", null, {
r: [".rzfgfes{overflow:unset;gap:8px;display:grid;max-height:calc(100vh - 2 * 24px);box-sizing:border-box;grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr auto;}"],
s: ["@supports (height: 1dvh){.rzfgfes{max-height:calc(100dvh - 2 * 24px);}}", "@media screen and (max-width: 480px){.rzfgfes{max-width:100vw;grid-template-rows:auto 1fr auto;}}", "@media screen and (max-height: 359px){.rzfgfes{max-height:unset;}}"]
});

@@ -14,0 +14,0 @@ /**

@@ -12,8 +12,8 @@ import { __resetStyles, __styles, mergeClasses } from '@griffel/react';

*/
const useRootBaseStyle = /*#__PURE__*/__resetStyles("rsmdyd3", "rup8wml", {
r: [".rsmdyd3{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}", ".rsmdyd3:focus{outline-style:none;}", ".rsmdyd3:focus-visible{outline-style:none;}", ".rsmdyd3[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".rsmdyd3[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".rup8wml{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}", ".rup8wml:focus{outline-style:none;}", ".rup8wml:focus-visible{outline-style:none;}", ".rup8wml[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".rup8wml[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
s: ["@media (forced-colors: active){.rsmdyd3[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@media screen and (max-width: 480px){.rsmdyd3{max-width:100vw;}}", "@media screen and (max-height: 359px){.rsmdyd3{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}", "@media (forced-colors: active){.rup8wml[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}", "@media screen and (max-width: 480px){.rup8wml{max-width:100vw;}}", "@media screen and (max-height: 359px){.rup8wml{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}"]
const useRootBaseStyle = /*#__PURE__*/__resetStyles("r5905w0", "ru9dzwv", {
r: [".r5905w0{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}", ".r5905w0:focus{outline-style:none;}", ".r5905w0:focus-visible{outline-style:none;}", ".r5905w0[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".r5905w0[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".ru9dzwv{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);box-shadow:var(--shadow64);}", ".ru9dzwv:focus{outline-style:none;}", ".ru9dzwv:focus-visible{outline-style:none;}", ".ru9dzwv[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".ru9dzwv[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
s: ["@media (forced-colors: active){.r5905w0[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@supports (height: 1dvh){.r5905w0{max-height:100dvh;}}", "@media screen and (max-width: 480px){.r5905w0{max-width:100vw;}}", "@media screen and (max-height: 359px){.r5905w0{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}", "@media (forced-colors: active){.ru9dzwv[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}", "@supports (height: 1dvh){.ru9dzwv{max-height:100dvh;}}", "@media screen and (max-width: 480px){.ru9dzwv{max-width:100vw;}}", "@media screen and (max-height: 359px){.ru9dzwv{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}"]
});
const useBackdropBaseStyle = /*#__PURE__*/__resetStyles("r1e18s3l", null, [".r1e18s3l{inset:0px;background-color:var(--colorBackgroundOverlay);position:fixed;}"]);
const useBackdropStyles = /*#__PURE__*/__styles({
const useStyles = /*#__PURE__*/__styles({
nestedDialogBackdrop: {

@@ -38,8 +38,8 @@ De3pzq: "f1c21dwh"

const backdropBaseStyle = useBackdropBaseStyle();
const backdropStyles = useBackdropStyles();
const styles = useStyles();
root.className = mergeClasses(dialogSurfaceClassNames.root, rootBaseStyle, root.className);
if (backdrop) {
backdrop.className = mergeClasses(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && backdropStyles.nestedDialogBackdrop, backdrop.className);
backdrop.className = mergeClasses(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && styles.nestedDialogBackdrop, backdrop.className);
}
return state;
};
{
"name": "@fluentui/react-dialog",
"version": "0.0.0-nightly-20250703-1103.1",
"version": "0.0.0-nightly-20250704-0407.1",
"description": "Dialog component for Fluent UI React",

@@ -15,10 +15,10 @@ "main": "lib-commonjs/index.js",

"devDependencies": {
"@fluentui/react-provider": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-popover": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-tooltip": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-button": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-menu": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-provider": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-popover": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-tooltip": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-button": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-menu": "0.0.0-nightly-20250704-0407.1",
"@fluentui/eslint-plugin": "*",
"@fluentui/react-conformance": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-conformance": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20250704-0407.1",
"@fluentui/scripts-api-extractor": "*",

@@ -28,14 +28,14 @@ "@fluentui/scripts-cypress": "*"

"dependencies": {
"@fluentui/react-utilities": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-jsx-runtime": "0.0.0-nightly-20250703-1103.1",
"@fluentui/keyboard-keys": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-context-selector": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-motion": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-motion-components-preview": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-shared-contexts": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-aria": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-utilities": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-jsx-runtime": "0.0.0-nightly-20250704-0407.1",
"@fluentui/keyboard-keys": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-context-selector": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-motion": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-motion-components-preview": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-shared-contexts": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-aria": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-icons": "^2.0.245",
"@fluentui/react-tabster": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-theme": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-portal": "0.0.0-nightly-20250703-1103.1",
"@fluentui/react-tabster": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-theme": "0.0.0-nightly-20250704-0407.1",
"@fluentui/react-portal": "0.0.0-nightly-20250704-0407.1",
"@griffel/react": "^1.5.22",

@@ -42,0 +42,0 @@ "@swc/helpers": "^0.5.1"

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet