@fluentui/react-drawer 9.8.5 → 9.8.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +21 -2
- package/lib/components/OverlayDrawer/useOverlayDrawer.js +2 -1
- package/lib/components/OverlayDrawer/useOverlayDrawer.js.map +1 -1
- package/lib/e2e/DrawerShared.js.map +1 -1
- package/lib-commonjs/components/OverlayDrawer/useOverlayDrawer.js +2 -1
- package/lib-commonjs/components/OverlayDrawer/useOverlayDrawer.js.map +1 -1
- package/lib-commonjs/e2e/DrawerShared.js.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,31 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-drawer
|
|
2
2
|
|
|
3
|
-
This log was last generated on Fri,
|
|
3
|
+
This log was last generated on Fri, 11 Jul 2025 15:56:58 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.8.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.8.7)
|
|
8
|
+
|
|
9
|
+
Fri, 11 Jul 2025 15:56:58 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.8.6..@fluentui/react-drawer_v9.8.7)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- Bump @fluentui/react-dialog to v9.13.7 ([PR #34807](https://github.com/microsoft/fluentui/pull/34807) by beachball)
|
|
15
|
+
|
|
16
|
+
## [9.8.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.8.6)
|
|
17
|
+
|
|
18
|
+
Fri, 04 Jul 2025 10:02:43 GMT
|
|
19
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.8.5..@fluentui/react-drawer_v9.8.6)
|
|
20
|
+
|
|
21
|
+
### Patches
|
|
22
|
+
|
|
23
|
+
- Bump @fluentui/react-dialog to v9.13.6 ([PR #34457](https://github.com/microsoft/fluentui/pull/34457) by beachball)
|
|
24
|
+
- Bump @fluentui/react-portal to v9.6.4 ([PR #34457](https://github.com/microsoft/fluentui/pull/34457) by beachball)
|
|
25
|
+
|
|
7
26
|
## [9.8.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.8.5)
|
|
8
27
|
|
|
9
|
-
Fri, 27 Jun 2025 13:
|
|
28
|
+
Fri, 27 Jun 2025 13:39:41 GMT
|
|
10
29
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.8.4..@fluentui/react-drawer_v9.8.5)
|
|
11
30
|
|
|
12
31
|
### Patches
|
|
@@ -57,7 +57,8 @@ const STATIC_MOTION = {
|
|
|
57
57
|
/**
|
|
58
58
|
* children is not needed here because we construct the children in the render function,
|
|
59
59
|
* but it's required by DialogProps
|
|
60
|
-
*/
|
|
60
|
+
*/ // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
61
|
+
children: null
|
|
61
62
|
}, {
|
|
62
63
|
elementType: Dialog
|
|
63
64
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/OverlayDrawer/useOverlayDrawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog } from '@fluentui/react-dialog';\nimport { slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { toMountNodeProps } from '@fluentui/react-portal';\n\nimport { OverlayDrawerMotion, OverlaySurfaceBackdropMotion } from '../../shared/drawerMotions';\nimport { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';\nimport type { OverlayDrawerProps, OverlayDrawerState } from './OverlayDrawer.types';\nimport { OverlayDrawerSurface } from './OverlayDrawerSurface';\nimport { mergePresenceSlots } from '../../shared/drawerMotionUtils';\n\nconst STATIC_MOTION = {\n active: true,\n canRender: true,\n ref: React.createRef<HTMLDivElement>(),\n type: 'idle' as const,\n};\n\n/**\n * Create the state required to render OverlayDrawer.\n *\n * The returned state can be modified with hooks such as useOverlayDrawerStyles_unstable,\n * before being passed to renderOverlayDrawer_unstable.\n *\n * @param props - props from this instance of OverlayDrawer\n * @param ref - reference to root HTMLElement of OverlayDrawer\n */\nexport const useOverlayDrawer_unstable = (\n props: OverlayDrawerProps,\n ref: React.Ref<HTMLElement>,\n): OverlayDrawerState => {\n const { open, size, position } = useDrawerDefaultProps(props);\n const { backdropMotion, modalType = 'modal', inertTrapFocus, onOpenChange, surfaceMotion, mountNode } = props;\n const { dir, targetDocument } = useFluent();\n const { element: mountNodeElement } = toMountNodeProps(mountNode);\n const hasMountNodeElement = Boolean(mountNodeElement && targetDocument?.body !== mountNodeElement);\n\n const backdropProps = slot.resolveShorthand(props.backdrop);\n const hasCustomBackdrop = modalType !== 'non-modal' && backdropProps !== null;\n\n const root = slot.always(\n {\n ...props,\n ref,\n backdrop: hasCustomBackdrop ? { ...backdropProps } : null,\n backdropMotion: mergePresenceSlots(backdropMotion, OverlaySurfaceBackdropMotion, { size }),\n },\n {\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 elementType: OverlayDrawerSurface as unknown as 'div',\n },\n );\n\n const dialog = slot.always(\n {\n open,\n onOpenChange,\n inertTrapFocus,\n modalType,\n surfaceMotion: mergePresenceSlots(surfaceMotion, OverlayDrawerMotion, { position, size, dir }),\n /**\n * children is not needed here because we construct the children in the render function,\n * but it's required by DialogProps\n */\n children: null as unknown as JSX.Element,\n },\n {\n elementType: Dialog,\n },\n );\n\n return {\n components: {\n root: OverlayDrawerSurface,\n dialog: Dialog,\n },\n\n root,\n dialog,\n\n open,\n size,\n position,\n hasMountNodeElement,\n\n // Deprecated props\n mountNode,\n motion: STATIC_MOTION,\n };\n};\n"],"names":["React","Dialog","slot","useFluent_unstable","useFluent","toMountNodeProps","OverlayDrawerMotion","OverlaySurfaceBackdropMotion","useDrawerDefaultProps","OverlayDrawerSurface","mergePresenceSlots","STATIC_MOTION","active","canRender","ref","createRef","type","useOverlayDrawer_unstable","props","open","size","position","backdropMotion","modalType","inertTrapFocus","onOpenChange","surfaceMotion","mountNode","dir","targetDocument","element","mountNodeElement","hasMountNodeElement","Boolean","body","backdropProps","resolveShorthand","backdrop","hasCustomBackdrop","root","always","elementType","dialog","children","components","motion"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["../src/components/OverlayDrawer/useOverlayDrawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog } from '@fluentui/react-dialog';\nimport { slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { toMountNodeProps } from '@fluentui/react-portal';\n\nimport { OverlayDrawerMotion, OverlaySurfaceBackdropMotion } from '../../shared/drawerMotions';\nimport { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';\nimport type { OverlayDrawerProps, OverlayDrawerState } from './OverlayDrawer.types';\nimport { OverlayDrawerSurface } from './OverlayDrawerSurface';\nimport { mergePresenceSlots } from '../../shared/drawerMotionUtils';\n\nconst STATIC_MOTION = {\n active: true,\n canRender: true,\n ref: React.createRef<HTMLDivElement>(),\n type: 'idle' as const,\n};\n\n/**\n * Create the state required to render OverlayDrawer.\n *\n * The returned state can be modified with hooks such as useOverlayDrawerStyles_unstable,\n * before being passed to renderOverlayDrawer_unstable.\n *\n * @param props - props from this instance of OverlayDrawer\n * @param ref - reference to root HTMLElement of OverlayDrawer\n */\nexport const useOverlayDrawer_unstable = (\n props: OverlayDrawerProps,\n ref: React.Ref<HTMLElement>,\n): OverlayDrawerState => {\n const { open, size, position } = useDrawerDefaultProps(props);\n const { backdropMotion, modalType = 'modal', inertTrapFocus, onOpenChange, surfaceMotion, mountNode } = props;\n const { dir, targetDocument } = useFluent();\n const { element: mountNodeElement } = toMountNodeProps(mountNode);\n const hasMountNodeElement = Boolean(mountNodeElement && targetDocument?.body !== mountNodeElement);\n\n const backdropProps = slot.resolveShorthand(props.backdrop);\n const hasCustomBackdrop = modalType !== 'non-modal' && backdropProps !== null;\n\n const root = slot.always(\n {\n ...props,\n ref,\n backdrop: hasCustomBackdrop ? { ...backdropProps } : null,\n backdropMotion: mergePresenceSlots(backdropMotion, OverlaySurfaceBackdropMotion, { size }),\n },\n {\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 elementType: OverlayDrawerSurface as unknown as 'div',\n },\n );\n\n const dialog = slot.always(\n {\n open,\n onOpenChange,\n inertTrapFocus,\n modalType,\n surfaceMotion: mergePresenceSlots(surfaceMotion, OverlayDrawerMotion, { position, size, dir }),\n /**\n * children is not needed here because we construct the children in the render function,\n * but it's required by DialogProps\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n children: null as unknown as JSX.Element,\n },\n {\n elementType: Dialog,\n },\n );\n\n return {\n components: {\n root: OverlayDrawerSurface,\n dialog: Dialog,\n },\n\n root,\n dialog,\n\n open,\n size,\n position,\n hasMountNodeElement,\n\n // Deprecated props\n mountNode,\n motion: STATIC_MOTION,\n };\n};\n"],"names":["React","Dialog","slot","useFluent_unstable","useFluent","toMountNodeProps","OverlayDrawerMotion","OverlaySurfaceBackdropMotion","useDrawerDefaultProps","OverlayDrawerSurface","mergePresenceSlots","STATIC_MOTION","active","canRender","ref","createRef","type","useOverlayDrawer_unstable","props","open","size","position","backdropMotion","modalType","inertTrapFocus","onOpenChange","surfaceMotion","mountNode","dir","targetDocument","element","mountNodeElement","hasMountNodeElement","Boolean","body","backdropProps","resolveShorthand","backdrop","hasCustomBackdrop","root","always","elementType","dialog","children","components","motion"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,MAAM,QAAQ,yBAAyB;AAChD,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,gBAAgB,QAAQ,yBAAyB;AAE1D,SAASC,mBAAmB,EAAEC,4BAA4B,QAAQ,6BAA6B;AAC/F,SAASC,qBAAqB,QAAQ,qCAAqC;AAE3E,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE,MAAMC,gBAAgB;IACpBC,QAAQ;IACRC,WAAW;IACXC,mBAAKd,MAAMe,SAAS;IACpBC,MAAM;AACR;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAJ;IAEA,MAAM,EAAEK,IAAI,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGb,sBAAsBU;IACvD,MAAM,EAAEI,cAAc,EAAEC,YAAY,OAAO,EAAEC,cAAc,EAAEC,YAAY,EAAEC,aAAa,EAAEC,SAAS,EAAE,GAAGT;IACxG,MAAM,EAAEU,GAAG,EAAEC,cAAc,EAAE,GAAGzB;IAChC,MAAM,EAAE0B,SAASC,gBAAgB,EAAE,GAAG1B,iBAAiBsB;IACvD,MAAMK,sBAAsBC,QAAQF,oBAAoBF,CAAAA,2BAAAA,qCAAAA,eAAgBK,IAAI,MAAKH;IAEjF,MAAMI,gBAAgBjC,KAAKkC,gBAAgB,CAAClB,MAAMmB,QAAQ;IAC1D,MAAMC,oBAAoBf,cAAc,eAAeY,kBAAkB;IAEzE,MAAMI,OAAOrC,KAAKsC,MAAM,CACtB;QACE,GAAGtB,KAAK;QACRJ;QACAuB,UAAUC,oBAAoB;YAAE,GAAGH,aAAa;QAAC,IAAI;QACrDb,gBAAgBZ,mBAAmBY,gBAAgBf,8BAA8B;YAAEa;QAAK;IAC1F,GACA;QACE;;;OAGC,GACDqB,aAAahC;IACf;IAGF,MAAMiC,SAASxC,KAAKsC,MAAM,CACxB;QACErB;QACAM;QACAD;QACAD;QACAG,eAAehB,mBAAmBgB,eAAepB,qBAAqB;YAAEe;YAAUD;YAAMQ;QAAI;QAC5F;;;OAGC,GACD,4DAA4D;QAC5De,UAAU;IACZ,GACA;QACEF,aAAaxC;IACf;IAGF,OAAO;QACL2C,YAAY;YACVL,MAAM9B;YACNiC,QAAQzC;QACV;QAEAsC;QACAG;QAEAvB;QACAC;QACAC;QACAW;QAEA,mBAAmB;QACnBL;QACAkB,QAAQlC;IACV;AACF,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/e2e/DrawerShared.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mount } from '@cypress/react';\nimport { FluentProvider } from '@fluentui/react-provider';\nimport { webLightTheme } from '@fluentui/react-theme';\n\nimport { InlineDrawer } from '../components/InlineDrawer';\nimport { OverlayDrawer } from '../components/OverlayDrawer';\nimport { Drawer, DrawerProps } from '../Drawer';\n\nconst mountFluent = (element: JSX.Element) => {\n mount(<FluentProvider theme={webLightTheme}>{element}</FluentProvider>);\n};\n\nexport function testDrawerBaseScenarios(Component: typeof Drawer | typeof OverlayDrawer | typeof InlineDrawer) {\n describe('basic functionality', () => {\n it('should not render any element when closed', () => {\n mountFluent(<Component id=\"drawer\" />);\n\n cy.get('#drawer').should('not.exist');\n });\n\n it('should render an element when opened', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.get('#drawer').should('exist');\n });\n\n it('should render children content', () => {\n const content = 'Test the renderization';\n mountFluent(\n <Component id=\"drawer\" open>\n {content}\n </Component>,\n );\n\n cy.get('#drawer').contains(content);\n });\n\n it('should toggle visibility on open prop change', () => {\n const ExampleDrawer = () => {\n const [open, setOpen] = React.useState(false);\n\n return (\n <>\n <Component id=\"drawer\" open={open} />\n <button id=\"button\" onClick={() => setOpen(true)}>\n Open\n </button>\n </>\n );\n };\n\n mountFluent(<ExampleDrawer />);\n\n cy.get('#drawer').should('not.exist');\n cy.get('#button').click();\n cy.get('#drawer').should('exist');\n });\n });\n\n describe('size prop', () => {\n const sizes = {\n small: 320,\n medium: 592,\n large: 940,\n full: 1000,\n };\n\n Object.entries(sizes).forEach(([size, width]) => {\n const sizeProp = size as DrawerProps['size'];\n\n it(`should have correct size when size is ${size}`, () => {\n mountFluent(<Component size={sizeProp} id=\"drawer\" open />);\n\n cy.viewport(1000, 1000);\n cy.get('#drawer').should('have.css', 'width', width + 'px');\n cy.get('#drawer').invoke('outerWidth').should('equal', width);\n });\n });\n\n it('width should not be bigger than viewport', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.viewport(319, 319);\n cy.get('#drawer').should('have.css', 'width', '319px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 319);\n });\n\n it('should have custom size', () => {\n mountFluent(<Component id=\"drawer\" open style={{ width: '200px' }} />);\n\n cy.get('#drawer').should('have.css', 'width', '200px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 200);\n });\n });\n\n describe('position prop', () => {\n const positions = {\n start: 'left',\n end: 'right',\n bottom: 'bottom',\n };\n\n Object.entries(positions).forEach(([position, side]) => {\n const positionProp = position as DrawerProps['position'];\n\n it(`should have correct position when position is ${position}`, () => {\n mountFluent(<Component position={positionProp} id=\"drawer\" open />);\n\n cy.get('#drawer').should('have.css', side, '0px');\n });\n });\n });\n}\n"],"names":["React","mount","FluentProvider","webLightTheme","mountFluent","element","theme","testDrawerBaseScenarios","Component","describe","it","id","cy","get","should","open","content","contains","ExampleDrawer","setOpen","useState","button","onClick","click","sizes","small","medium","large","full","Object","entries","forEach","size","width","sizeProp","viewport","invoke","style","positions","start","end","bottom","position","side","positionProp"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,iBAAiB;AACvC,SAASC,cAAc,QAAQ,2BAA2B;AAC1D,SAASC,aAAa,QAAQ,wBAAwB;AAMtD,MAAMC,cAAc,
|
|
1
|
+
{"version":3,"sources":["../src/e2e/DrawerShared.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mount } from '@cypress/react';\nimport { FluentProvider } from '@fluentui/react-provider';\nimport { webLightTheme } from '@fluentui/react-theme';\n\nimport { InlineDrawer } from '../components/InlineDrawer';\nimport { OverlayDrawer } from '../components/OverlayDrawer';\nimport { Drawer, DrawerProps } from '../Drawer';\n\nconst mountFluent = (\n element: // eslint-disable-next-line @typescript-eslint/no-deprecated\n JSX.Element,\n) => {\n mount(<FluentProvider theme={webLightTheme}>{element}</FluentProvider>);\n};\n\nexport function testDrawerBaseScenarios(Component: typeof Drawer | typeof OverlayDrawer | typeof InlineDrawer) {\n describe('basic functionality', () => {\n it('should not render any element when closed', () => {\n mountFluent(<Component id=\"drawer\" />);\n\n cy.get('#drawer').should('not.exist');\n });\n\n it('should render an element when opened', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.get('#drawer').should('exist');\n });\n\n it('should render children content', () => {\n const content = 'Test the renderization';\n mountFluent(\n <Component id=\"drawer\" open>\n {content}\n </Component>,\n );\n\n cy.get('#drawer').contains(content);\n });\n\n it('should toggle visibility on open prop change', () => {\n const ExampleDrawer = () => {\n const [open, setOpen] = React.useState(false);\n\n return (\n <>\n <Component id=\"drawer\" open={open} />\n <button id=\"button\" onClick={() => setOpen(true)}>\n Open\n </button>\n </>\n );\n };\n\n mountFluent(<ExampleDrawer />);\n\n cy.get('#drawer').should('not.exist');\n cy.get('#button').click();\n cy.get('#drawer').should('exist');\n });\n });\n\n describe('size prop', () => {\n const sizes = {\n small: 320,\n medium: 592,\n large: 940,\n full: 1000,\n };\n\n Object.entries(sizes).forEach(([size, width]) => {\n const sizeProp = size as DrawerProps['size'];\n\n it(`should have correct size when size is ${size}`, () => {\n mountFluent(<Component size={sizeProp} id=\"drawer\" open />);\n\n cy.viewport(1000, 1000);\n cy.get('#drawer').should('have.css', 'width', width + 'px');\n cy.get('#drawer').invoke('outerWidth').should('equal', width);\n });\n });\n\n it('width should not be bigger than viewport', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.viewport(319, 319);\n cy.get('#drawer').should('have.css', 'width', '319px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 319);\n });\n\n it('should have custom size', () => {\n mountFluent(<Component id=\"drawer\" open style={{ width: '200px' }} />);\n\n cy.get('#drawer').should('have.css', 'width', '200px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 200);\n });\n });\n\n describe('position prop', () => {\n const positions = {\n start: 'left',\n end: 'right',\n bottom: 'bottom',\n };\n\n Object.entries(positions).forEach(([position, side]) => {\n const positionProp = position as DrawerProps['position'];\n\n it(`should have correct position when position is ${position}`, () => {\n mountFluent(<Component position={positionProp} id=\"drawer\" open />);\n\n cy.get('#drawer').should('have.css', side, '0px');\n });\n });\n });\n}\n"],"names":["React","mount","FluentProvider","webLightTheme","mountFluent","element","theme","testDrawerBaseScenarios","Component","describe","it","id","cy","get","should","open","content","contains","ExampleDrawer","setOpen","useState","button","onClick","click","sizes","small","medium","large","full","Object","entries","forEach","size","width","sizeProp","viewport","invoke","style","positions","start","end","bottom","position","side","positionProp"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -60,7 +60,8 @@ const useOverlayDrawer_unstable = (props, ref)=>{
|
|
|
60
60
|
/**
|
|
61
61
|
* children is not needed here because we construct the children in the render function,
|
|
62
62
|
* but it's required by DialogProps
|
|
63
|
-
*/
|
|
63
|
+
*/ // eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
64
|
+
children: null
|
|
64
65
|
}, {
|
|
65
66
|
elementType: _reactdialog.Dialog
|
|
66
67
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/OverlayDrawer/useOverlayDrawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog } from '@fluentui/react-dialog';\nimport { slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { toMountNodeProps } from '@fluentui/react-portal';\n\nimport { OverlayDrawerMotion, OverlaySurfaceBackdropMotion } from '../../shared/drawerMotions';\nimport { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';\nimport type { OverlayDrawerProps, OverlayDrawerState } from './OverlayDrawer.types';\nimport { OverlayDrawerSurface } from './OverlayDrawerSurface';\nimport { mergePresenceSlots } from '../../shared/drawerMotionUtils';\n\nconst STATIC_MOTION = {\n active: true,\n canRender: true,\n ref: React.createRef<HTMLDivElement>(),\n type: 'idle' as const,\n};\n\n/**\n * Create the state required to render OverlayDrawer.\n *\n * The returned state can be modified with hooks such as useOverlayDrawerStyles_unstable,\n * before being passed to renderOverlayDrawer_unstable.\n *\n * @param props - props from this instance of OverlayDrawer\n * @param ref - reference to root HTMLElement of OverlayDrawer\n */\nexport const useOverlayDrawer_unstable = (\n props: OverlayDrawerProps,\n ref: React.Ref<HTMLElement>,\n): OverlayDrawerState => {\n const { open, size, position } = useDrawerDefaultProps(props);\n const { backdropMotion, modalType = 'modal', inertTrapFocus, onOpenChange, surfaceMotion, mountNode } = props;\n const { dir, targetDocument } = useFluent();\n const { element: mountNodeElement } = toMountNodeProps(mountNode);\n const hasMountNodeElement = Boolean(mountNodeElement && targetDocument?.body !== mountNodeElement);\n\n const backdropProps = slot.resolveShorthand(props.backdrop);\n const hasCustomBackdrop = modalType !== 'non-modal' && backdropProps !== null;\n\n const root = slot.always(\n {\n ...props,\n ref,\n backdrop: hasCustomBackdrop ? { ...backdropProps } : null,\n backdropMotion: mergePresenceSlots(backdropMotion, OverlaySurfaceBackdropMotion, { size }),\n },\n {\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 elementType: OverlayDrawerSurface as unknown as 'div',\n },\n );\n\n const dialog = slot.always(\n {\n open,\n onOpenChange,\n inertTrapFocus,\n modalType,\n surfaceMotion: mergePresenceSlots(surfaceMotion, OverlayDrawerMotion, { position, size, dir }),\n /**\n * children is not needed here because we construct the children in the render function,\n * but it's required by DialogProps\n */\n children: null as unknown as JSX.Element,\n },\n {\n elementType: Dialog,\n },\n );\n\n return {\n components: {\n root: OverlayDrawerSurface,\n dialog: Dialog,\n },\n\n root,\n dialog,\n\n open,\n size,\n position,\n hasMountNodeElement,\n\n // Deprecated props\n mountNode,\n motion: STATIC_MOTION,\n };\n};\n"],"names":["useOverlayDrawer_unstable","STATIC_MOTION","active","canRender","ref","React","createRef","type","props","open","size","position","useDrawerDefaultProps","backdropMotion","modalType","inertTrapFocus","onOpenChange","surfaceMotion","mountNode","dir","targetDocument","useFluent","element","mountNodeElement","toMountNodeProps","hasMountNodeElement","Boolean","body","backdropProps","slot","resolveShorthand","backdrop","hasCustomBackdrop","root","always","mergePresenceSlots","OverlaySurfaceBackdropMotion","elementType","OverlayDrawerSurface","dialog","OverlayDrawerMotion","children","Dialog","components","motion"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["../src/components/OverlayDrawer/useOverlayDrawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog } from '@fluentui/react-dialog';\nimport { slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { toMountNodeProps } from '@fluentui/react-portal';\n\nimport { OverlayDrawerMotion, OverlaySurfaceBackdropMotion } from '../../shared/drawerMotions';\nimport { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';\nimport type { OverlayDrawerProps, OverlayDrawerState } from './OverlayDrawer.types';\nimport { OverlayDrawerSurface } from './OverlayDrawerSurface';\nimport { mergePresenceSlots } from '../../shared/drawerMotionUtils';\n\nconst STATIC_MOTION = {\n active: true,\n canRender: true,\n ref: React.createRef<HTMLDivElement>(),\n type: 'idle' as const,\n};\n\n/**\n * Create the state required to render OverlayDrawer.\n *\n * The returned state can be modified with hooks such as useOverlayDrawerStyles_unstable,\n * before being passed to renderOverlayDrawer_unstable.\n *\n * @param props - props from this instance of OverlayDrawer\n * @param ref - reference to root HTMLElement of OverlayDrawer\n */\nexport const useOverlayDrawer_unstable = (\n props: OverlayDrawerProps,\n ref: React.Ref<HTMLElement>,\n): OverlayDrawerState => {\n const { open, size, position } = useDrawerDefaultProps(props);\n const { backdropMotion, modalType = 'modal', inertTrapFocus, onOpenChange, surfaceMotion, mountNode } = props;\n const { dir, targetDocument } = useFluent();\n const { element: mountNodeElement } = toMountNodeProps(mountNode);\n const hasMountNodeElement = Boolean(mountNodeElement && targetDocument?.body !== mountNodeElement);\n\n const backdropProps = slot.resolveShorthand(props.backdrop);\n const hasCustomBackdrop = modalType !== 'non-modal' && backdropProps !== null;\n\n const root = slot.always(\n {\n ...props,\n ref,\n backdrop: hasCustomBackdrop ? { ...backdropProps } : null,\n backdropMotion: mergePresenceSlots(backdropMotion, OverlaySurfaceBackdropMotion, { size }),\n },\n {\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 elementType: OverlayDrawerSurface as unknown as 'div',\n },\n );\n\n const dialog = slot.always(\n {\n open,\n onOpenChange,\n inertTrapFocus,\n modalType,\n surfaceMotion: mergePresenceSlots(surfaceMotion, OverlayDrawerMotion, { position, size, dir }),\n /**\n * children is not needed here because we construct the children in the render function,\n * but it's required by DialogProps\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n children: null as unknown as JSX.Element,\n },\n {\n elementType: Dialog,\n },\n );\n\n return {\n components: {\n root: OverlayDrawerSurface,\n dialog: Dialog,\n },\n\n root,\n dialog,\n\n open,\n size,\n position,\n hasMountNodeElement,\n\n // Deprecated props\n mountNode,\n motion: STATIC_MOTION,\n };\n};\n"],"names":["useOverlayDrawer_unstable","STATIC_MOTION","active","canRender","ref","React","createRef","type","props","open","size","position","useDrawerDefaultProps","backdropMotion","modalType","inertTrapFocus","onOpenChange","surfaceMotion","mountNode","dir","targetDocument","useFluent","element","mountNodeElement","toMountNodeProps","hasMountNodeElement","Boolean","body","backdropProps","slot","resolveShorthand","backdrop","hasCustomBackdrop","root","always","mergePresenceSlots","OverlaySurfaceBackdropMotion","elementType","OverlayDrawerSurface","dialog","OverlayDrawerMotion","children","Dialog","components","motion"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BA4BaA;;;eAAAA;;;;iEA5BU;6BACA;gCACF;qCAC2B;6BACf;+BAEiC;uCAC5B;sCAED;mCACF;AAEnC,MAAMC,gBAAgB;IACpBC,QAAQ;IACRC,WAAW;IACXC,KAAAA,WAAAA,GAAKC,OAAMC,SAAS;IACpBC,MAAM;AACR;AAWO,MAAMP,4BAA4B,CACvCQ,OACAJ;IAEA,MAAM,EAAEK,IAAI,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGC,IAAAA,4CAAAA,EAAsBJ;IACvD,MAAM,EAAEK,cAAc,EAAEC,YAAY,OAAO,EAAEC,cAAc,EAAEC,YAAY,EAAEC,aAAa,EAAEC,SAAS,EAAE,GAAGV;IACxG,MAAM,EAAEW,GAAG,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAAA;IAChC,MAAM,EAAEC,SAASC,gBAAgB,EAAE,GAAGC,IAAAA,6BAAAA,EAAiBN;IACvD,MAAMO,sBAAsBC,QAAQH,oBAAoBH,CAAAA,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBO,IAAI,AAAJA,MAASJ;IAEjF,MAAMK,gBAAgBC,oBAAAA,CAAKC,gBAAgB,CAACtB,MAAMuB,QAAQ;IAC1D,MAAMC,oBAAoBlB,cAAc,eAAec,kBAAkB;IAEzE,MAAMK,OAAOJ,oBAAAA,CAAKK,MAAM,CACtB;QACE,GAAG1B,KAAK;QACRJ;QACA2B,UAAUC,oBAAoB;YAAE,GAAGJ,aAAa;QAAC,IAAI;QACrDf,gBAAgBsB,IAAAA,qCAAAA,EAAmBtB,gBAAgBuB,2CAAAA,EAA8B;YAAE1B;QAAK;IAC1F,GACA;QACE;;;OAGC,GACD2B,aAAaC,0CAAAA;IACf;IAGF,MAAMC,SAASV,oBAAAA,CAAKK,MAAM,CACxB;QACEzB;QACAO;QACAD;QACAD;QACAG,eAAekB,IAAAA,qCAAAA,EAAmBlB,eAAeuB,kCAAAA,EAAqB;YAAE7B;YAAUD;YAAMS;QAAI;QAC5F;;;OAGC,GACD,4DAA4D;QAC5DsB,UAAU;IACZ,GACA;QACEJ,aAAaK,mBAAAA;IACf;IAGF,OAAO;QACLC,YAAY;YACVV,MAAMK,0CAAAA;YACNC,QAAQG,mBAAAA;QACV;QAEAT;QACAM;QAEA9B;QACAC;QACAC;QACAc;QAEA,mBAAmB;QACnBP;QACA0B,QAAQ3C;IACV;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/e2e/DrawerShared.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mount } from '@cypress/react';\nimport { FluentProvider } from '@fluentui/react-provider';\nimport { webLightTheme } from '@fluentui/react-theme';\n\nimport { InlineDrawer } from '../components/InlineDrawer';\nimport { OverlayDrawer } from '../components/OverlayDrawer';\nimport { Drawer, DrawerProps } from '../Drawer';\n\nconst mountFluent = (element: JSX.Element) => {\n mount(<FluentProvider theme={webLightTheme}>{element}</FluentProvider>);\n};\n\nexport function testDrawerBaseScenarios(Component: typeof Drawer | typeof OverlayDrawer | typeof InlineDrawer) {\n describe('basic functionality', () => {\n it('should not render any element when closed', () => {\n mountFluent(<Component id=\"drawer\" />);\n\n cy.get('#drawer').should('not.exist');\n });\n\n it('should render an element when opened', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.get('#drawer').should('exist');\n });\n\n it('should render children content', () => {\n const content = 'Test the renderization';\n mountFluent(\n <Component id=\"drawer\" open>\n {content}\n </Component>,\n );\n\n cy.get('#drawer').contains(content);\n });\n\n it('should toggle visibility on open prop change', () => {\n const ExampleDrawer = () => {\n const [open, setOpen] = React.useState(false);\n\n return (\n <>\n <Component id=\"drawer\" open={open} />\n <button id=\"button\" onClick={() => setOpen(true)}>\n Open\n </button>\n </>\n );\n };\n\n mountFluent(<ExampleDrawer />);\n\n cy.get('#drawer').should('not.exist');\n cy.get('#button').click();\n cy.get('#drawer').should('exist');\n });\n });\n\n describe('size prop', () => {\n const sizes = {\n small: 320,\n medium: 592,\n large: 940,\n full: 1000,\n };\n\n Object.entries(sizes).forEach(([size, width]) => {\n const sizeProp = size as DrawerProps['size'];\n\n it(`should have correct size when size is ${size}`, () => {\n mountFluent(<Component size={sizeProp} id=\"drawer\" open />);\n\n cy.viewport(1000, 1000);\n cy.get('#drawer').should('have.css', 'width', width + 'px');\n cy.get('#drawer').invoke('outerWidth').should('equal', width);\n });\n });\n\n it('width should not be bigger than viewport', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.viewport(319, 319);\n cy.get('#drawer').should('have.css', 'width', '319px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 319);\n });\n\n it('should have custom size', () => {\n mountFluent(<Component id=\"drawer\" open style={{ width: '200px' }} />);\n\n cy.get('#drawer').should('have.css', 'width', '200px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 200);\n });\n });\n\n describe('position prop', () => {\n const positions = {\n start: 'left',\n end: 'right',\n bottom: 'bottom',\n };\n\n Object.entries(positions).forEach(([position, side]) => {\n const positionProp = position as DrawerProps['position'];\n\n it(`should have correct position when position is ${position}`, () => {\n mountFluent(<Component position={positionProp} id=\"drawer\" open />);\n\n cy.get('#drawer').should('have.css', side, '0px');\n });\n });\n });\n}\n"],"names":["testDrawerBaseScenarios","mountFluent","element","mount","React","createElement","FluentProvider","theme","webLightTheme","Component","describe","it","id","cy","get","should","open","content","contains","ExampleDrawer","setOpen","useState","Fragment","button","onClick","click","sizes","small","medium","large","full","Object","entries","forEach","size","width","sizeProp","viewport","invoke","style","positions","start","end","bottom","position","side","positionProp"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+
|
|
1
|
+
{"version":3,"sources":["../src/e2e/DrawerShared.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mount } from '@cypress/react';\nimport { FluentProvider } from '@fluentui/react-provider';\nimport { webLightTheme } from '@fluentui/react-theme';\n\nimport { InlineDrawer } from '../components/InlineDrawer';\nimport { OverlayDrawer } from '../components/OverlayDrawer';\nimport { Drawer, DrawerProps } from '../Drawer';\n\nconst mountFluent = (\n element: // eslint-disable-next-line @typescript-eslint/no-deprecated\n JSX.Element,\n) => {\n mount(<FluentProvider theme={webLightTheme}>{element}</FluentProvider>);\n};\n\nexport function testDrawerBaseScenarios(Component: typeof Drawer | typeof OverlayDrawer | typeof InlineDrawer) {\n describe('basic functionality', () => {\n it('should not render any element when closed', () => {\n mountFluent(<Component id=\"drawer\" />);\n\n cy.get('#drawer').should('not.exist');\n });\n\n it('should render an element when opened', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.get('#drawer').should('exist');\n });\n\n it('should render children content', () => {\n const content = 'Test the renderization';\n mountFluent(\n <Component id=\"drawer\" open>\n {content}\n </Component>,\n );\n\n cy.get('#drawer').contains(content);\n });\n\n it('should toggle visibility on open prop change', () => {\n const ExampleDrawer = () => {\n const [open, setOpen] = React.useState(false);\n\n return (\n <>\n <Component id=\"drawer\" open={open} />\n <button id=\"button\" onClick={() => setOpen(true)}>\n Open\n </button>\n </>\n );\n };\n\n mountFluent(<ExampleDrawer />);\n\n cy.get('#drawer').should('not.exist');\n cy.get('#button').click();\n cy.get('#drawer').should('exist');\n });\n });\n\n describe('size prop', () => {\n const sizes = {\n small: 320,\n medium: 592,\n large: 940,\n full: 1000,\n };\n\n Object.entries(sizes).forEach(([size, width]) => {\n const sizeProp = size as DrawerProps['size'];\n\n it(`should have correct size when size is ${size}`, () => {\n mountFluent(<Component size={sizeProp} id=\"drawer\" open />);\n\n cy.viewport(1000, 1000);\n cy.get('#drawer').should('have.css', 'width', width + 'px');\n cy.get('#drawer').invoke('outerWidth').should('equal', width);\n });\n });\n\n it('width should not be bigger than viewport', () => {\n mountFluent(<Component id=\"drawer\" open />);\n\n cy.viewport(319, 319);\n cy.get('#drawer').should('have.css', 'width', '319px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 319);\n });\n\n it('should have custom size', () => {\n mountFluent(<Component id=\"drawer\" open style={{ width: '200px' }} />);\n\n cy.get('#drawer').should('have.css', 'width', '200px');\n cy.get('#drawer').invoke('outerWidth').should('equal', 200);\n });\n });\n\n describe('position prop', () => {\n const positions = {\n start: 'left',\n end: 'right',\n bottom: 'bottom',\n };\n\n Object.entries(positions).forEach(([position, side]) => {\n const positionProp = position as DrawerProps['position'];\n\n it(`should have correct position when position is ${position}`, () => {\n mountFluent(<Component position={positionProp} id=\"drawer\" open />);\n\n cy.get('#drawer').should('have.css', side, '0px');\n });\n });\n });\n}\n"],"names":["testDrawerBaseScenarios","mountFluent","element","mount","React","createElement","FluentProvider","theme","webLightTheme","Component","describe","it","id","cy","get","should","open","content","contains","ExampleDrawer","setOpen","useState","Fragment","button","onClick","click","sizes","small","medium","large","full","Object","entries","forEach","size","width","sizeProp","viewport","invoke","style","positions","start","end","bottom","position","side","positionProp"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-drawer",
|
|
3
|
-
"version": "9.8.
|
|
3
|
+
"version": "9.8.7",
|
|
4
4
|
"description": "Drawer components for Fluent UI React",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -20,10 +20,10 @@
|
|
|
20
20
|
"@fluentui/scripts-cypress": "*"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@fluentui/react-dialog": "^9.13.
|
|
23
|
+
"@fluentui/react-dialog": "^9.13.7",
|
|
24
24
|
"@fluentui/react-jsx-runtime": "^9.1.2",
|
|
25
25
|
"@fluentui/react-motion": "^9.9.0",
|
|
26
|
-
"@fluentui/react-portal": "^9.6.
|
|
26
|
+
"@fluentui/react-portal": "^9.6.4",
|
|
27
27
|
"@fluentui/react-shared-contexts": "^9.24.0",
|
|
28
28
|
"@fluentui/react-tabster": "^9.25.3",
|
|
29
29
|
"@fluentui/react-theme": "^9.1.24",
|