Initial commit

This commit is contained in:
2025-03-07 19:22:02 +01:00
commit 4a98255d83
55743 changed files with 5280367 additions and 0 deletions
@@ -0,0 +1,26 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "OverlayDrawer", {
enumerable: true,
get: function() {
return OverlayDrawer;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _drawerContext = require("../../contexts/drawerContext");
const _useOverlayDrawer = require("./useOverlayDrawer");
const _renderOverlayDrawer = require("./renderOverlayDrawer");
const _useOverlayDrawerStylesstyles = require("./useOverlayDrawerStyles.styles");
const OverlayDrawer = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useOverlayDrawer.useOverlayDrawer_unstable)(props, ref);
const contextValue = (0, _drawerContext.useDrawerContextValue)();
(0, _useOverlayDrawerStylesstyles.useOverlayDrawerStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useDrawerOverlayStyles_unstable')(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useOverlayDrawerStyles_unstable')(state);
return (0, _renderOverlayDrawer.renderOverlayDrawer_unstable)(state, contextValue);
});
OverlayDrawer.displayName = 'OverlayDrawer';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/OverlayDrawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useDrawerContextValue } from '../../contexts/drawerContext';\n\nimport { useOverlayDrawer_unstable } from './useOverlayDrawer';\nimport { renderOverlayDrawer_unstable } from './renderOverlayDrawer';\nimport { useOverlayDrawerStyles_unstable } from './useOverlayDrawerStyles.styles';\nimport type { OverlayDrawerProps } from './OverlayDrawer.types';\n\n/**\n * OverlayDrawer contains supplementary content and are used for complex creation, edit, or management experiences.\n */\nexport const OverlayDrawer: ForwardRefComponent<OverlayDrawerProps> = React.forwardRef((props, ref) => {\n const state = useOverlayDrawer_unstable(props, ref);\n const contextValue = useDrawerContextValue();\n\n useOverlayDrawerStyles_unstable(state);\n useCustomStyleHook_unstable('useDrawerOverlayStyles_unstable')(state);\n useCustomStyleHook_unstable('useOverlayDrawerStyles_unstable')(state);\n\n return renderOverlayDrawer_unstable(state, contextValue);\n});\n\nOverlayDrawer.displayName = 'OverlayDrawer';\n"],"names":["OverlayDrawer","React","forwardRef","props","ref","state","useOverlayDrawer_unstable","contextValue","useDrawerContextValue","useOverlayDrawerStyles_unstable","useCustomStyleHook_unstable","renderOverlayDrawer_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;;iEAdU;qCAEqB;+BAEN;kCAEI;qCACG;8CACG;AAMzC,MAAMA,gBAAAA,WAAAA,GAAyDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQC,IAAAA,2CAAAA,EAA0BH,OAAOC;IAC/C,MAAMG,eAAeC,IAAAA,oCAAAA;IAErBC,IAAAA,6DAAAA,EAAgCJ;IAChCK,IAAAA,gDAAAA,EAA4B,mCAAmCL;IAC/DK,IAAAA,gDAAAA,EAA4B,mCAAmCL;IAE/D,OAAOM,IAAAA,iDAAAA,EAA6BN,OAAOE;AAC7C;AAEAP,cAAcY,WAAW,GAAG"}
@@ -0,0 +1,6 @@
/**
* State used in rendering OverlayDrawer
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/OverlayDrawer.types.ts"],"sourcesContent":["import type { DialogProps } from '@fluentui/react-dialog';\nimport type { PresenceMotionSlotProps } from '@fluentui/react-motion';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nimport type { DrawerMotionParams, OverlayDrawerSurfaceMotionParams } from '../../shared/drawerMotions';\nimport type { DrawerBaseProps, DrawerBaseState } from '../../shared/DrawerBase.types';\nimport type { OverlayDrawerSurfaceProps } from './OverlayDrawerSurface';\n\n/**\n * OverlayDrawer slots\n */\nexport type OverlayDrawerSlots = {\n /**\n * Slot for the root element.\n */\n root: Slot<OverlayDrawerSurfaceProps>;\n /**\n * For more information refer to the [Motion docs page](https://react.fluentui.dev/?path=/docs/motion-motion-slot--docs).\n *\n */\n backdropMotion?: Slot<PresenceMotionSlotProps<OverlayDrawerSurfaceMotionParams>>;\n /**\n * For more information refer to the [Motion docs page](https://react.fluentui.dev/?path=/docs/motion-motion-slot--docs).\n *\n */\n surfaceMotion?: Slot<PresenceMotionSlotProps<DrawerMotionParams>>;\n};\n\n/**\n * OverlayDrawer internal slots for when using with composition API\n */\nexport type OverlayDrawerInternalSlots = Pick<OverlayDrawerSlots, 'root'> & {\n /**\n * Slot for the dialog component that wraps the drawer.\n */\n dialog: NonNullable<Slot<DialogProps>>;\n};\n\n/**\n * OverlayDrawer Props\n */\nexport type OverlayDrawerProps = ComponentProps<OverlayDrawerSlots> &\n Pick<DialogProps, 'modalType' | 'onOpenChange' | 'inertTrapFocus'> &\n DrawerBaseProps & {\n /**\n * @deprecated OverlayDrawer can work only as a controlled component\n * and does not support uncontrolled mode i.e. defaultOpen prop\n */\n defaultOpen?: boolean;\n };\n\n/**\n * State used in rendering OverlayDrawer\n */\nexport type OverlayDrawerState = ComponentState<OverlayDrawerInternalSlots> &\n Required<DrawerBaseState> &\n Pick<OverlayDrawerProps, 'mountNode'> & {\n hasMountNodeElement: boolean;\n };\n"],"names":[],"rangeMappings":";;","mappings":"AAmDA;;CAEC"}
@@ -0,0 +1,29 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "OverlayDrawerSurface", {
enumerable: true,
get: function() {
return OverlayDrawerSurface;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactdialog = require("@fluentui/react-dialog");
const _useOverlayDrawerSurfaceStylesstyles = require("./useOverlayDrawerSurfaceStyles.styles");
const OverlayDrawerSurface = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const dialogSurfaceState = (0, _reactdialog.useDialogSurface_unstable)({
...props,
/**
* Drawer accepts a `div` or `aside` element type, but Dialog only accepts a `div` element type.
* We need to cast the ref to a `div` element type to not break Dialog's ref type.
*
* FIXME: Evaluate the possibility to remove this cast when Dialog is refactored to accept `aside` elements.
*/ as: props.as
}, ref);
const dialogSurfaceContextValues = (0, _reactdialog.useDialogSurfaceContextValues_unstable)(dialogSurfaceState);
(0, _useOverlayDrawerSurfaceStylesstyles.useOverlayDrawerSurfaceStyles_unstable)(dialogSurfaceState);
return (0, _reactdialog.renderDialogSurface_unstable)(dialogSurfaceState, dialogSurfaceContextValues);
});
OverlayDrawerSurface.displayName = 'OverlayDrawerSurface';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/OverlayDrawerSurface/OverlayDrawerSurface.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport {\n useDialogSurface_unstable,\n useDialogSurfaceContextValues_unstable,\n renderDialogSurface_unstable,\n} from '@fluentui/react-dialog';\n\nimport { useOverlayDrawerSurfaceStyles_unstable } from './useOverlayDrawerSurfaceStyles.styles';\nimport type { OverlayDrawerSurfaceProps } from './OverlayDrawerSurface.types';\n\n/**\n * @internal\n * OverlayDrawerSurface is a proxy for DialogSurface as is only meant to be used internally for Drawer.\n */\nexport const OverlayDrawerSurface: ForwardRefComponent<OverlayDrawerSurfaceProps> = React.forwardRef((props, ref) => {\n const dialogSurfaceState = useDialogSurface_unstable(\n {\n ...props,\n /**\n * Drawer accepts a `div` or `aside` element type, but Dialog only accepts a `div` element type.\n * We need to cast the ref to a `div` element type to not break Dialog's ref type.\n *\n * FIXME: Evaluate the possibility to remove this cast when Dialog is refactored to accept `aside` elements.\n */\n as: props.as as 'div',\n },\n ref,\n );\n const dialogSurfaceContextValues = useDialogSurfaceContextValues_unstable(dialogSurfaceState);\n\n useOverlayDrawerSurfaceStyles_unstable(dialogSurfaceState);\n\n return renderDialogSurface_unstable(dialogSurfaceState, dialogSurfaceContextValues);\n});\n\nOverlayDrawerSurface.displayName = 'OverlayDrawerSurface';\n"],"names":["OverlayDrawerSurface","React","forwardRef","props","ref","dialogSurfaceState","useDialogSurface_unstable","as","dialogSurfaceContextValues","useDialogSurfaceContextValues_unstable","useOverlayDrawerSurfaceStyles_unstable","renderDialogSurface_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAeaA;;;eAAAA;;;;iEAfU;6BAMhB;qDAEgD;AAOhD,MAAMA,uBAAAA,WAAAA,GAAuEC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3G,MAAMC,qBAAqBC,IAAAA,sCAAAA,EACzB;QACE,GAAGH,KAAK;QACR;;;;;OAKC,GACDI,IAAIJ,MAAMI,EAAE;IACd,GACAH;IAEF,MAAMI,6BAA6BC,IAAAA,mDAAAA,EAAuCJ;IAE1EK,IAAAA,2EAAAA,EAAuCL;IAEvC,OAAOM,IAAAA,yCAAAA,EAA6BN,oBAAoBG;AAC1D;AAEAR,qBAAqBY,WAAW,GAAG"}
@@ -0,0 +1,6 @@
/**
* OverlayDrawerSurface Props
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/OverlayDrawerSurface/OverlayDrawerSurface.types.ts"],"sourcesContent":["import type { DialogSurfaceProps, DialogSurfaceSlots } from '@fluentui/react-dialog';\nimport type { ComponentProps, Slot } from '@fluentui/react-utilities';\n\n/**\n * OverlayDrawerSurface slots\n */\nexport type OverlayDrawerSurfaceSlots = Partial<Pick<DialogSurfaceSlots, 'backdrop' | 'backdropMotion'>> & {\n root: Slot<'div', 'aside'>;\n};\n\n/**\n * OverlayDrawerSurface Props\n */\nexport type OverlayDrawerSurfaceProps = ComponentProps<OverlayDrawerSurfaceSlots> &\n Pick<DialogSurfaceProps, 'mountNode'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAUA;;CAEC"}
@@ -0,0 +1,11 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "OverlayDrawerSurface", {
enumerable: true,
get: function() {
return _OverlayDrawerSurface.OverlayDrawerSurface;
}
});
const _OverlayDrawerSurface = require("./OverlayDrawerSurface");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/OverlayDrawerSurface/index.ts"],"sourcesContent":["export { OverlayDrawerSurface } from './OverlayDrawerSurface';\nexport type { OverlayDrawerSurfaceProps, OverlayDrawerSurfaceSlots } from './OverlayDrawerSurface.types';\n"],"names":["OverlayDrawerSurface"],"rangeMappings":";;;;;;;;;;","mappings":";;;;+BAASA;;;eAAAA,0CAAoB;;;sCAAQ"}
@@ -0,0 +1,34 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useOverlayDrawerSurfaceStyles_unstable", {
enumerable: true,
get: function() {
return useOverlayDrawerSurfaceStyles_unstable;
}
});
const _react = require("@griffel/react");
/**
* Styles for the backdrop slot
*/ const useBackdropResetStyles = /*#__PURE__*/ (0, _react.__resetStyles)("rmnljus", null, [
".rmnljus{inset:0px;position:fixed;background-color:rgba(0, 0, 0, 0.4);}"
]);
const useBackdropStyles = /*#__PURE__*/ (0, _react.__styles)({
nested: {
De3pzq: "f1c21dwh"
}
}, {
d: [
".f1c21dwh{background-color:var(--colorTransparentBackground);}"
]
});
const useOverlayDrawerSurfaceStyles_unstable = (state)=>{
'use no memo';
const backdropResetStyles = useBackdropResetStyles();
const backdropStyles = useBackdropStyles();
if (state.backdrop) {
state.backdrop.className = (0, _react.mergeClasses)(backdropResetStyles, state.isNestedDialog && backdropStyles.nested, state.backdrop.className);
}
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["useOverlayDrawerSurfaceStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\n/**\n * Styles for the backdrop slot\n */ const useBackdropResetStyles = makeResetStyles({\n inset: '0px',\n position: 'fixed',\n backgroundColor: 'rgba(0, 0, 0, 0.4)'\n});\nconst useBackdropStyles = makeStyles({\n nested: {\n backgroundColor: tokens.colorTransparentBackground\n }\n});\n/**\n * Apply styling to the OverlayDrawerSurface slots based on the state\n */ export const useOverlayDrawerSurfaceStyles_unstable = (state)=>{\n 'use no memo';\n const backdropResetStyles = useBackdropResetStyles();\n const backdropStyles = useBackdropStyles();\n if (state.backdrop) {\n state.backdrop.className = mergeClasses(backdropResetStyles, state.isNestedDialog && backdropStyles.nested, state.backdrop.className);\n }\n return state;\n};\n"],"names":["useOverlayDrawerSurfaceStyles_unstable","useBackdropResetStyles","__resetStyles","useBackdropStyles","__styles","nested","De3pzq","d","state","backdropResetStyles","backdropStyles","backdrop","className","mergeClasses","isNestedDialog"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAgBiBA;;;eAAAA;;;uBAhByC;AAE1D;;CAEA,GAAI,MAAMC,yBAAsB,WAAA,GAAGC,IAAAA,oBAAA,EAAA,WAAA,MAAA;IAAA;CAIlC;AACD,MAAMC,oBAAiB,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,QAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;KAAA;AAAA;AAOf,MAAMP,yCAA0CQ,CAAAA;IACvD;IACA,MAAMC,sBAAsBR;IAC5B,MAAMS,iBAAiBP;IACvB,IAAIK,MAAMG,QAAQ,EAAE;QAChBH,MAAMG,QAAQ,CAACC,SAAS,GAAGC,IAAAA,mBAAY,EAACJ,qBAAqBD,MAAMM,cAAc,IAAIJ,eAAeL,MAAM,EAAEG,MAAMG,QAAQ,CAACC,SAAS;IACxI;IACA,OAAOJ;AACX"}
@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
OverlayDrawer: function() {
return _OverlayDrawer.OverlayDrawer;
},
overlayDrawerClassNames: function() {
return _useOverlayDrawerStylesstyles.overlayDrawerClassNames;
},
renderOverlayDrawer_unstable: function() {
return _renderOverlayDrawer.renderOverlayDrawer_unstable;
},
useOverlayDrawerStyles_unstable: function() {
return _useOverlayDrawerStylesstyles.useOverlayDrawerStyles_unstable;
},
useOverlayDrawer_unstable: function() {
return _useOverlayDrawer.useOverlayDrawer_unstable;
}
});
const _OverlayDrawer = require("./OverlayDrawer");
const _renderOverlayDrawer = require("./renderOverlayDrawer");
const _useOverlayDrawer = require("./useOverlayDrawer");
const _useOverlayDrawerStylesstyles = require("./useOverlayDrawerStyles.styles");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/index.ts"],"sourcesContent":["export { OverlayDrawer } from './OverlayDrawer';\nexport type {\n OverlayDrawerInternalSlots,\n OverlayDrawerProps,\n OverlayDrawerSlots,\n OverlayDrawerState,\n} from './OverlayDrawer.types';\nexport { renderOverlayDrawer_unstable } from './renderOverlayDrawer';\nexport { useOverlayDrawer_unstable } from './useOverlayDrawer';\nexport { overlayDrawerClassNames, useOverlayDrawerStyles_unstable } from './useOverlayDrawerStyles.styles';\n"],"names":["OverlayDrawer","overlayDrawerClassNames","renderOverlayDrawer_unstable","useOverlayDrawerStyles_unstable","useOverlayDrawer_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,aAAa;eAAbA,4BAAa;;IASbC,uBAAuB;eAAvBA,qDAAuB;;IAFvBC,4BAA4B;eAA5BA,iDAA4B;;IAEHC,+BAA+B;eAA/BA,6DAA+B;;IADxDC,yBAAyB;eAAzBA,2CAAyB;;;+BARJ;qCAOe;kCACH;8CAC+B"}
@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderOverlayDrawer_unstable", {
enumerable: true,
get: function() {
return renderOverlayDrawer_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const _drawerContext = require("../../contexts/drawerContext");
const renderOverlayDrawer_unstable = (state, contextValue)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_drawerContext.DrawerProvider, {
value: contextValue,
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.dialog, {
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {})
})
});
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/OverlayDrawer/renderOverlayDrawer.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { DrawerContextValue, DrawerProvider } from '../../contexts/drawerContext';\n\nimport type { OverlayDrawerState, OverlayDrawerInternalSlots } from './OverlayDrawer.types';\n\n/**\n * Render the final JSX of OverlayDrawer\n */\nexport const renderOverlayDrawer_unstable = (state: OverlayDrawerState, contextValue: DrawerContextValue) => {\n assertSlots<OverlayDrawerInternalSlots>(state);\n\n return (\n <DrawerProvider value={contextValue}>\n <state.dialog>\n <state.root />\n </state.dialog>\n </DrawerProvider>\n );\n};\n"],"names":["renderOverlayDrawer_unstable","state","contextValue","assertSlots","_jsx","DrawerProvider","value","dialog","root"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;4BATb;gCAC4B;+BACuB;AAO5C,MAAMA,+BAA+B,CAACC,OAA2BC;IACtEC,IAAAA,2BAAAA,EAAwCF;IAExC,OAAA,WAAA,GACEG,IAAAA,eAAA,EAACC,6BAAAA,EAAAA;QAAeC,OAAOJ;kBACrB,WAAA,GAAAE,IAAAA,eAAA,EAACH,MAAMM,MAAM,EAAA;sBACX,WAAA,GAAAH,IAAAA,eAAA,EAACH,MAAMO,IAAI,EAAA,CAAA;;;AAInB"}
@@ -0,0 +1,82 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useOverlayDrawer_unstable", {
enumerable: true,
get: function() {
return useOverlayDrawer_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactdialog = require("@fluentui/react-dialog");
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _reactportal = require("@fluentui/react-portal");
const _drawerMotions = require("../../shared/drawerMotions");
const _useDrawerDefaultProps = require("../../shared/useDrawerDefaultProps");
const _OverlayDrawerSurface = require("./OverlayDrawerSurface");
const _drawerMotionUtils = require("../../shared/drawerMotionUtils");
const STATIC_MOTION = {
active: true,
canRender: true,
ref: /*#__PURE__*/ _react.createRef(),
type: 'idle'
};
const useOverlayDrawer_unstable = (props, ref)=>{
const { open, size, position } = (0, _useDrawerDefaultProps.useDrawerDefaultProps)(props);
const { backdropMotion, modalType = 'modal', inertTrapFocus, onOpenChange, surfaceMotion, mountNode } = props;
const { dir, targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
const { element: mountNodeElement } = (0, _reactportal.toMountNodeProps)(mountNode);
const hasMountNodeElement = Boolean(mountNodeElement && (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.body) !== mountNodeElement);
const backdropProps = _reactutilities.slot.resolveShorthand(props.backdrop);
const hasCustomBackdrop = modalType !== 'non-modal' && backdropProps !== null;
const root = _reactutilities.slot.always({
...props,
ref,
backdrop: hasCustomBackdrop ? {
...backdropProps
} : null,
backdropMotion: (0, _drawerMotionUtils.mergePresenceSlots)(backdropMotion, _drawerMotions.OverlaySurfaceBackdropMotion, {
size
})
}, {
/**
* Drawer accepts a `div` or `aside` element type, but Dialog only accepts a `div` element type.
* We need to cast the ref to a `div` element type to not break Dialog's ref type.
*/ elementType: _OverlayDrawerSurface.OverlayDrawerSurface
});
const dialog = _reactutilities.slot.always({
open,
onOpenChange,
inertTrapFocus,
modalType,
surfaceMotion: (0, _drawerMotionUtils.mergePresenceSlots)(surfaceMotion, _drawerMotions.OverlayDrawerMotion, {
position,
size,
dir
}),
/**
* children is not needed here because we construct the children in the render function,
* but it's required by DialogProps
*/ children: null
}, {
elementType: _reactdialog.Dialog
});
return {
components: {
root: _OverlayDrawerSurface.OverlayDrawerSurface,
dialog: _reactdialog.Dialog
},
root,
dialog,
open,
size,
position,
hasMountNodeElement,
// Deprecated props
mountNode,
motion: STATIC_MOTION
};
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,78 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
overlayDrawerClassNames: function() {
return overlayDrawerClassNames;
},
useOverlayDrawerStyles_unstable: function() {
return useOverlayDrawerStyles_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _react1 = require("@griffel/react");
const _useDrawerBaseStylesstyles = require("../../shared/useDrawerBaseStyles.styles");
const overlayDrawerClassNames = {
root: 'fui-OverlayDrawer',
backdrop: 'fui-OverlayDrawer__backdrop'
};
/**
* Styles for the root slot
*/ const useDrawerResetStyles = /*#__PURE__*/ (0, _react1.__resetStyles)("r7dfyj8", "rmx02j7", {
r: [
".r7dfyj8{overflow:hidden;width:var(--fui-Drawer--size);max-width:100vw;height:auto;max-height:100vh;box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);position:fixed;top:0;bottom:0;}",
".r7dfyj8:focus{outline-style:none;}",
".r7dfyj8:focus-visible{outline-style:none;}",
".r7dfyj8[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
".r7dfyj8[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);}",
".rmx02j7{overflow:hidden;width:var(--fui-Drawer--size);max-width:100vw;height:auto;max-height:100vh;box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);position:fixed;top:0;bottom:0;}",
".rmx02j7:focus{outline-style:none;}",
".rmx02j7:focus-visible{outline-style:none;}",
".rmx02j7[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
".rmx02j7[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){.r7dfyj8[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
"@media (forced-colors: active){.rmx02j7[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
]
});
const useDrawerRootStyles = /*#__PURE__*/ (0, _react1.__styles)({
start: {},
end: {},
bottom: {
Bhzewxz: "f198g47y",
Bqenvij: "fub80nq",
a9b677: "fr97h3j"
},
absolute: {
qhf8xq: "f1euv43f"
}
}, {
d: [
".f198g47y{top:auto;}",
".fub80nq{height:var(--fui-Drawer--size);}",
".fr97h3j{width:100vw;}",
".f1euv43f{position:absolute;}"
]
});
const useOverlayDrawerStyles_unstable = (state)=>{
'use no memo';
const baseClassNames = (0, _useDrawerBaseStylesstyles.useDrawerBaseClassNames)(state);
const resetStyles = useDrawerResetStyles();
const rootStyles = useDrawerRootStyles();
const absoluteStyles = state.hasMountNodeElement && rootStyles.absolute;
const backdrop = state.root.backdrop;
state.root.className = (0, _react1.mergeClasses)(overlayDrawerClassNames.root, baseClassNames, resetStyles, rootStyles[state.position], absoluteStyles, state.root.className);
if (backdrop) {
backdrop.className = (0, _react1.mergeClasses)(overlayDrawerClassNames.backdrop, absoluteStyles, backdrop.className);
}
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["useOverlayDrawerStyles.styles.js"],"sourcesContent":["import * as React from 'react';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { drawerCSSVars, drawerDefaultStyles, useDrawerBaseClassNames } from '../../shared/useDrawerBaseStyles.styles';\nexport const overlayDrawerClassNames = {\n root: 'fui-OverlayDrawer',\n backdrop: 'fui-OverlayDrawer__backdrop'\n};\n/**\n * Styles for the root slot\n */ const useDrawerResetStyles = makeResetStyles({\n ...createFocusOutlineStyle(),\n ...drawerDefaultStyles,\n position: 'fixed',\n top: 0,\n bottom: 0\n});\nconst useDrawerRootStyles = makeStyles({\n /* Positioning */ start: {},\n end: {},\n bottom: {\n top: 'auto',\n height: `var(${drawerCSSVars.drawerSizeVar})`,\n width: '100vw'\n },\n absolute: {\n position: 'absolute'\n }\n});\n/**\n * Apply styling to the OverlayDrawer slots based on the state\n */ export const useOverlayDrawerStyles_unstable = (state)=>{\n 'use no memo';\n const baseClassNames = useDrawerBaseClassNames(state);\n const resetStyles = useDrawerResetStyles();\n const rootStyles = useDrawerRootStyles();\n const absoluteStyles = state.hasMountNodeElement && rootStyles.absolute;\n const backdrop = state.root.backdrop;\n state.root.className = mergeClasses(overlayDrawerClassNames.root, baseClassNames, resetStyles, rootStyles[state.position], absoluteStyles, state.root.className);\n if (backdrop) {\n backdrop.className = mergeClasses(overlayDrawerClassNames.backdrop, absoluteStyles, backdrop.className);\n }\n return state;\n};\n"],"names":["overlayDrawerClassNames","useOverlayDrawerStyles_unstable","root","backdrop","useDrawerResetStyles","__resetStyles","r","s","useDrawerRootStyles","__styles","start","end","bottom","Bhzewxz","Bqenvij","a9b677","absolute","qhf8xq","d","state","baseClassNames","useDrawerBaseClassNames","resetStyles","rootStyles","absoluteStyles","hasMountNodeElement","className","mergeClasses","position"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,uBAAuB;eAAvBA;;IA2BIC,+BAA+B;eAA/BA;;;;iEA/BM;wBACmC;2CAEkB;AACrE,MAAMD,0BAA0B;IACnCE,MAAM;IACNC,UAAU;AACd;AACA;;CAEA,GAAI,MAAMC,uBAAoB,WAAA,GAAGC,IAAAA,qBAAA,EAAA,WAAA,WAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,GAAA;QAAA;QAAA;KAAA;AAAA;AAOjC,MAAMC,sBAAmB,WAAA,GAAGC,IAAAA,gBAAA,EAAA;IAAAC,OAAA,CAAA;IAAAC,KAAA,CAAA;IAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAAC,UAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAcjB,MAAMjB,kCAAmCkB,CAAAA;IAChD;IACA,MAAMC,iBAAiBC,IAAAA,kDAAuB,EAACF;IAC/C,MAAMG,cAAclB;IACpB,MAAMmB,aAAaf;IACnB,MAAMgB,iBAAiBL,MAAMM,mBAAmB,IAAIF,WAAWP,QAAQ;IACvE,MAAMb,WAAWgB,MAAMjB,IAAI,CAACC,QAAQ;IACpCgB,MAAMjB,IAAI,CAACwB,SAAS,GAAGC,IAAAA,oBAAY,EAAC3B,wBAAwBE,IAAI,EAAEkB,gBAAgBE,aAAaC,UAAU,CAACJ,MAAMS,QAAQ,CAAC,EAAEJ,gBAAgBL,MAAMjB,IAAI,CAACwB,SAAS;IAC/J,IAAIvB,UAAU;QACVA,SAASuB,SAAS,GAAGC,IAAAA,oBAAY,EAAC3B,wBAAwBG,QAAQ,EAAEqB,gBAAgBrB,SAASuB,SAAS;IAC1G;IACA,OAAOP;AACX"}