@wordpress/components 28.8.1-next.5368f64a9.0 → 28.8.1
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 +16 -1
- package/build/box-control/all-input-control.js +1 -2
- package/build/box-control/all-input-control.js.map +1 -1
- package/build/box-control/utils.js +1 -1
- package/build/box-control/utils.js.map +1 -1
- package/build/card/card/component.js +2 -2
- package/build/card/card/component.js.map +1 -1
- package/build/card/styles.js +18 -18
- package/build/card/styles.js.map +1 -1
- package/build/combobox-control/index.js +3 -1
- package/build/combobox-control/index.js.map +1 -1
- package/build/combobox-control/types.js.map +1 -1
- package/build/custom-select-control-v2/styles.js +9 -9
- package/build/custom-select-control-v2/styles.js.map +1 -1
- package/build/dropdown-menu-v2/styles.js +17 -17
- package/build/dropdown-menu-v2/styles.js.map +1 -1
- package/build/modal/index.js +17 -9
- package/build/modal/index.js.map +1 -1
- package/build/modal/types.js.map +1 -1
- package/build/modal/use-modal-exit-animation.js +75 -0
- package/build/modal/use-modal-exit-animation.js.map +1 -0
- package/build/range-control/styles/range-control-styles.js +28 -28
- package/build/range-control/styles/range-control-styles.js.map +1 -1
- package/build/tabs/styles.js +3 -3
- package/build/tabs/styles.js.map +1 -1
- package/build/utils/config-values.js +4 -5
- package/build/utils/config-values.js.map +1 -1
- package/build-module/box-control/all-input-control.js +2 -2
- package/build-module/box-control/all-input-control.js.map +1 -1
- package/build-module/box-control/utils.js +1 -1
- package/build-module/box-control/utils.js.map +1 -1
- package/build-module/card/card/component.js +2 -2
- package/build-module/card/card/component.js.map +1 -1
- package/build-module/card/styles.js +18 -18
- package/build-module/card/styles.js.map +1 -1
- package/build-module/combobox-control/index.js +3 -1
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/combobox-control/types.js.map +1 -1
- package/build-module/custom-select-control-v2/styles.js +9 -9
- package/build-module/custom-select-control-v2/styles.js.map +1 -1
- package/build-module/dropdown-menu-v2/styles.js +17 -17
- package/build-module/dropdown-menu-v2/styles.js.map +1 -1
- package/build-module/modal/index.js +18 -9
- package/build-module/modal/index.js.map +1 -1
- package/build-module/modal/types.js.map +1 -1
- package/build-module/modal/use-modal-exit-animation.js +68 -0
- package/build-module/modal/use-modal-exit-animation.js.map +1 -0
- package/build-module/range-control/styles/range-control-styles.js +28 -28
- package/build-module/range-control/styles/range-control-styles.js.map +1 -1
- package/build-module/tabs/styles.js +3 -3
- package/build-module/tabs/styles.js.map +1 -1
- package/build-module/utils/config-values.js +4 -5
- package/build-module/utils/config-values.js.map +1 -1
- package/build-style/style-rtl.css +51 -6
- package/build-style/style.css +51 -6
- package/build-types/box-control/all-input-control.d.ts.map +1 -1
- package/build-types/box-control/utils.d.ts +1 -1
- package/build-types/box-control/utils.d.ts.map +1 -1
- package/build-types/button-group/stories/index.story.d.ts +2 -2
- package/build-types/button-group/stories/index.story.d.ts.map +1 -1
- package/build-types/combobox-control/index.d.ts.map +1 -1
- package/build-types/combobox-control/stories/index.story.d.ts +4 -0
- package/build-types/combobox-control/stories/index.story.d.ts.map +1 -1
- package/build-types/combobox-control/types.d.ts +4 -0
- package/build-types/combobox-control/types.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/styles.d.ts.map +1 -1
- package/build-types/modal/index.d.ts.map +1 -1
- package/build-types/modal/types.d.ts +6 -10
- package/build-types/modal/types.d.ts.map +1 -1
- package/build-types/modal/use-modal-exit-animation.d.ts +9 -0
- package/build-types/modal/use-modal-exit-animation.d.ts.map +1 -0
- package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
- package/build-types/utils/config-values.d.ts +0 -1
- package/package.json +19 -19
- package/src/box-control/README.md +7 -0
- package/src/box-control/all-input-control.tsx +2 -3
- package/src/box-control/utils.ts +1 -1
- package/src/button-group/stories/index.story.tsx +10 -15
- package/src/card/card/component.tsx +1 -1
- package/src/card/styles.ts +1 -1
- package/src/card/test/__snapshots__/index.tsx.snap +54 -54
- package/src/combobox-control/README.md +7 -0
- package/src/combobox-control/index.tsx +2 -0
- package/src/combobox-control/test/index.tsx +40 -0
- package/src/combobox-control/types.ts +4 -0
- package/src/custom-select-control-v2/styles.ts +1 -0
- package/src/dropdown-menu-v2/styles.ts +1 -1
- package/src/form-toggle/style.scss +1 -0
- package/src/modal/index.tsx +27 -13
- package/src/modal/style.scss +30 -3
- package/src/modal/types.ts +6 -18
- package/src/modal/use-modal-exit-animation.ts +99 -0
- package/src/popover/style.scss +3 -2
- package/src/range-control/styles/range-control-styles.ts +1 -0
- package/src/resizable-box/style.scss +1 -1
- package/src/snackbar/style.scss +1 -1
- package/src/tabs/styles.ts +1 -1
- package/src/tooltip/style.scss +1 -0
- package/src/utils/config-values.js +4 -5
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_react2","_utils","_space","_icon","_interopRequireDefault","_truncate","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_EMOTION_STRINGIFIED_CSS_ERROR__","ANIMATION_PARAMS","SCALE_AMOUNT_OUTER","SCALE_AMOUNT_CONTENT","DURATION","IN","OUT","EASING","CONTENT_WRAPPER_PADDING","space","ITEM_PADDING_BLOCK","ITEM_PADDING_INLINE","DEFAULT_BORDER_COLOR","COLORS","theme","gray","DIVIDER_COLOR","LIGHTER_TEXT_COLOR","LIGHT_BACKGROUND_COLOR","TOOLBAR_VARIANT_BORDER_COLOR","foreground","DEFAULT_BOX_SHADOW","CONFIG","borderWidth","elevationXSmall","TOOLBAR_VARIANT_BOX_SHADOW","GRID_TEMPLATE_COLS","MenuPopoverOuterWrapper","exports","_base","process","env","NODE_ENV","target","label","ui","background","radiusMedium","props","css","variant","MenuPopoverInnerWrapper","baseItem","font","radiusSmall","textDisabled","accent","white","DropdownMenuItem","MenuItem","DropdownMenuCheckboxItem","MenuItemCheckbox","DropdownMenuRadioItem","MenuItemRadio","ItemPrefixWrapper","DropdownMenuItemContentWrapper","DropdownMenuItemChildrenWrapper","ItemSuffixWrapper","DropdownMenuGroup","MenuGroup","name","styles","map","toString","DropdownMenuGroupLabel","MenuGroupLabel","DropdownMenuSeparator","MenuSeparator","SubmenuChevronIcon","Icon","rtl","transform","DropdownMenuItemLabel","Truncate","DropdownMenuItemHelpText"],"sources":["@wordpress/components/src/dropdown-menu-v2/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, font, rtl, CONFIG } from '../utils';\nimport { space } from '../utils/space';\nimport Icon from '../icon';\nimport { Truncate } from '../truncate';\nimport type { DropdownMenuContext } from './types';\n\nconst ANIMATION_PARAMS = {\n\tSCALE_AMOUNT_OUTER: 0.82,\n\tSCALE_AMOUNT_CONTENT: 0.9,\n\tDURATION: {\n\t\tIN: '400ms',\n\t\tOUT: '200ms',\n\t},\n\tEASING: 'cubic-bezier(0.33, 0, 0, 1)',\n};\n\nconst CONTENT_WRAPPER_PADDING = space( 1 );\nconst ITEM_PADDING_BLOCK = space( 2 );\nconst ITEM_PADDING_INLINE = space( 3 );\n\n// TODO:\n// - border color and divider color are different from COLORS.theme variables\n// - lighter text color is not defined in COLORS.theme, should it be?\n// - lighter background color is not defined in COLORS.theme, should it be?\nconst DEFAULT_BORDER_COLOR = COLORS.theme.gray[ 300 ];\nconst DIVIDER_COLOR = COLORS.theme.gray[ 200 ];\nconst LIGHTER_TEXT_COLOR = COLORS.theme.gray[ 700 ];\nconst LIGHT_BACKGROUND_COLOR = COLORS.theme.gray[ 100 ];\nconst TOOLBAR_VARIANT_BORDER_COLOR = COLORS.theme.foreground;\nconst DEFAULT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ DEFAULT_BORDER_COLOR }, ${ CONFIG.elevationXSmall }`;\nconst TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ TOOLBAR_VARIANT_BORDER_COLOR }`;\n\nconst GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr';\n\nexport const MenuPopoverOuterWrapper = styled.div<\n\tPick< DropdownMenuContext, 'variant' >\n>`\n\tposition: relative;\n\n\tbackground-color: ${ COLORS.ui.background };\n\tborder-radius: ${ CONFIG.radiusMedium };\n\t${ ( props ) => css`\n\t\tbox-shadow: ${ props.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BOX_SHADOW\n\t\t\t: DEFAULT_BOX_SHADOW };\n\t` }\n\n\toverflow: hidden;\n\n\t/* Open/close animation (outer wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition-property: transform, opacity;\n\t\ttransition-timing-function: ${ ANIMATION_PARAMS.EASING };\n\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.IN };\n\t\twill-change: transform, opacity;\n\n\t\t/* Regardless of the side, fade in and out. */\n\t\topacity: 0;\n\t\t&:has( [data-enter] ) {\n\t\t\topacity: 1;\n\t\t}\n\n\t\t&:has( [data-leave] ) {\n\t\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.OUT };\n\t\t}\n\n\t\t/* For menus opening on top and bottom side, animate the scale Y too. */\n\t\t&:has( [data-side='bottom'] ),\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform: scaleY( ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } );\n\t\t}\n\t\t&:has( [data-side='bottom'] ) {\n\t\t\ttransform-origin: top;\n\t\t}\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform-origin: bottom;\n\t\t}\n\t\t&:has( [data-enter][data-side='bottom'] ),\n\t\t&:has( [data-enter][data-side='top'] ),\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&:has( [data-leave][data-side='bottom'] ),\n\t\t&:has( [data-leave][data-side='top'] ) {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nexport const MenuPopoverInnerWrapper = styled.div`\n\tposition: relative;\n\t/* Same as popover component */\n\t/* TODO: is there a way to read the sass variable? */\n\tz-index: 1000000;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\tgrid-template-rows: auto;\n\n\tbox-sizing: border-box;\n\tmin-width: 160px;\n\tmax-width: 320px;\n\tmax-height: var( --popover-available-height );\n\n\tpadding: ${ CONTENT_WRAPPER_PADDING };\n\n\toverscroll-behavior: contain;\n\toverflow: auto;\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent !important;\n\n\t/* Open/close animation (inner content wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition: inherit;\n\t\ttransform-origin: inherit;\n\n\t\t/*\n\t\t * For menus opening on top and bottom side, animate the scale Y too.\n\t\t * The content scales at a different rate than the outer container:\n\t\t * - first, counter the outer scale factor by doing \"1 / scaleAmountOuter\"\n\t\t * - then, apply the content scale factor.\n\t\t */\n\t\t&[data-side='bottom'],\n\t\t&[data-side='top'] {\n\t\t\ttransform: scaleY(\n\t\t\t\tcalc(\n\t\t\t\t\t1 / ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } *\n\t\t\t\t\t\t${ ANIMATION_PARAMS.SCALE_AMOUNT_CONTENT }\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t\t&[data-enter][data-side='bottom'],\n\t\t&[data-enter][data-side='top'],\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&[data-leave][data-side='bottom'],\n\t\t&[data-leave][data-side='top'] {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nconst baseItem = css`\n\tall: unset;\n\n\tposition: relative;\n\tmin-height: ${ space( 10 ) };\n\tbox-sizing: border-box;\n\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\talign-items: center;\n\n\t@supports ( grid-template-columns: subgrid ) {\n\t\t/*\n\t\t * Define a grid layout which inherits the same columns configuration\n\t\t * from the parent layout (ie. subgrid). This allows the menu\n\t\t * to synchronize the indentation of all its items.\n\t\t */\n\t\tgrid-template-columns: subgrid;\n\t}\n\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tfont-family: inherit;\n\tfont-weight: normal;\n\tline-height: 20px;\n\n\tcolor: ${ COLORS.theme.foreground };\n\tborder-radius: ${ CONFIG.radiusSmall };\n\n\tpadding-block: ${ ITEM_PADDING_BLOCK };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n\n\t/*\n\t * Make sure that, when an item is scrolled into view (eg. while using the\n\t * keyboard to move focus), the whole item comes into view\n\t */\n\tscroll-margin: ${ CONTENT_WRAPPER_PADDING };\n\n\tuser-select: none;\n\toutline: none;\n\n\t&[aria-disabled='true'] {\n\t\tcolor: ${ COLORS.ui.textDisabled };\n\t\tcursor: not-allowed;\n\t}\n\n\t/* Active item (including hover) */\n\t&[data-active-item]:not( [data-focus-visible] ):not(\n\t\t\t[aria-disabled='true']\n\t\t) {\n\t\tbackground-color: ${ COLORS.theme.accent };\n\t\tcolor: ${ COLORS.white };\n\t}\n\n\t/* Keyboard focus (focus-visible) */\n\t&[data-focus-visible] {\n\t\tbox-shadow: 0 0 0 1.5px ${ COLORS.theme.accent };\n\n\t\t/* Only visible in Windows High Contrast mode */\n\t\toutline: 2px solid transparent;\n\t}\n\n\t/* Active (ie. pressed, mouse down) */\n\t&:active,\n\t&[data-active] {\n\t\t/* TODO: should there be a visual active state? */\n\t}\n\n\t/* When the item is the trigger of an open submenu */\n\t${ MenuPopoverInnerWrapper }:not(:focus) &:not(:focus)[aria-expanded=\"true\"] {\n\t\tbackground-color: ${ LIGHT_BACKGROUND_COLOR };\n\t\tcolor: ${ COLORS.theme.foreground };\n\t}\n\n\tsvg {\n\t\tfill: currentColor;\n\t}\n`;\n\nexport const DropdownMenuItem = styled( Ariakit.MenuItem )`\n\t${ baseItem };\n`;\n\nexport const DropdownMenuCheckboxItem = styled( Ariakit.MenuItemCheckbox )`\n\t${ baseItem };\n`;\n\nexport const DropdownMenuRadioItem = styled( Ariakit.MenuItemRadio )`\n\t${ baseItem };\n`;\n\nexport const ItemPrefixWrapper = styled.span`\n\t/* Always occupy the first column, even when auto-collapsing */\n\tgrid-column: 1;\n\n\t/*\n\t * Even when the item is not checked, occupy the same screen space to avoid\n\t * the space collapside when no items are checked.\n\t */\n\t${ DropdownMenuCheckboxItem } > &,\n\t${ DropdownMenuRadioItem } > & {\n\t\t/* Same width as the check icons */\n\t\tmin-width: ${ space( 6 ) };\n\t}\n\n\t${ DropdownMenuCheckboxItem } > &,\n\t${ DropdownMenuRadioItem } > &,\n\t&:not( :empty ) {\n\t\tmargin-inline-end: ${ space( 2 ) };\n\t}\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t* When the parent menu item is active, except when it's a non-focused/hovered\n\t* submenu trigger (in that case, color should not be inherited)\n\t*/\n\t[data-active-item]:not( [data-focus-visible] ) > &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] > & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const DropdownMenuItemContentWrapper = styled.div`\n\t/*\n\t * Always occupy the second column, since the first column\n\t * is taken by the prefix wrapper (when displayed).\n\t */\n\tgrid-column: 2;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: ${ space( 3 ) };\n\n\tpointer-events: none;\n`;\n\nexport const DropdownMenuItemChildrenWrapper = styled.div`\n\tflex: 1;\n\n\tdisplay: inline-flex;\n\tflex-direction: column;\n\tgap: ${ space( 1 ) };\n`;\n\nexport const ItemSuffixWrapper = styled.span`\n\tflex: 0 1 fit-content;\n\tmin-width: 0;\n\twidth: fit-content;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: ${ space( 3 ) };\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t * When the parent menu item is active, except when it's a non-focused/hovered\n\t * submenu trigger (in that case, color should not be inherited)\n\t */\n\t[data-active-item]:not( [data-focus-visible] ) *:not(${ MenuPopoverInnerWrapper }) &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] *:not(${ MenuPopoverInnerWrapper }) & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const DropdownMenuGroup = styled( Ariakit.MenuGroup )`\n\t/* Ignore this element when calculating the layout. Useful for subgrid */\n\tdisplay: contents;\n`;\n\nexport const DropdownMenuGroupLabel = styled( Ariakit.MenuGroupLabel )`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tpadding-block-start: ${ space( 3 ) };\n\tpadding-block-end: ${ space( 2 ) };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n`;\n\nexport const DropdownMenuSeparator = styled( Ariakit.MenuSeparator )<\n\tPick< DropdownMenuContext, 'variant' >\n>`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tborder: none;\n\theight: ${ CONFIG.borderWidth };\n\tbackground-color: ${ ( props ) =>\n\t\tprops.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BORDER_COLOR\n\t\t\t: DIVIDER_COLOR };\n\t/* Align with menu items' content */\n\tmargin-block: ${ space( 2 ) };\n\tmargin-inline: ${ ITEM_PADDING_INLINE };\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent;\n`;\n\nexport const SubmenuChevronIcon = styled( Icon )`\n\twidth: ${ space( 1.5 ) };\n\t${ rtl(\n\t\t{\n\t\t\ttransform: `scaleX(1)`,\n\t\t},\n\t\t{\n\t\t\ttransform: `scaleX(-1)`,\n\t\t}\n\t) };\n`;\n\nexport const DropdownMenuItemLabel = styled( Truncate )`\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tline-height: 20px;\n\tcolor: inherit;\n`;\n\nexport const DropdownMenuItemHelpText = styled( Truncate )`\n\tfont-size: ${ font( 'helpText.fontSize' ) };\n\tline-height: 16px;\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\tword-break: break-all;\n\n\t[data-active-item]:not( [data-focus-visible] )\n\t\t*:not( ${ MenuPopoverInnerWrapper } )\n\t\t&,\n\t[aria-disabled='true'] *:not( ${ MenuPopoverInnerWrapper } ) & {\n\t\tcolor: inherit;\n\t}\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_react2","_utils","_space","_icon","_interopRequireDefault","_truncate","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_EMOTION_STRINGIFIED_CSS_ERROR__","ANIMATION_PARAMS","SCALE_AMOUNT_OUTER","SCALE_AMOUNT_CONTENT","DURATION","IN","OUT","EASING","CONTENT_WRAPPER_PADDING","space","ITEM_PADDING_BLOCK","ITEM_PADDING_INLINE","DEFAULT_BORDER_COLOR","COLORS","theme","gray","DIVIDER_COLOR","LIGHTER_TEXT_COLOR","LIGHT_BACKGROUND_COLOR","TOOLBAR_VARIANT_BORDER_COLOR","foreground","DEFAULT_BOX_SHADOW","CONFIG","borderWidth","elevationMedium","TOOLBAR_VARIANT_BOX_SHADOW","GRID_TEMPLATE_COLS","MenuPopoverOuterWrapper","exports","_base","process","env","NODE_ENV","target","label","ui","background","radiusMedium","props","css","variant","MenuPopoverInnerWrapper","baseItem","font","radiusSmall","textDisabled","accent","white","DropdownMenuItem","MenuItem","DropdownMenuCheckboxItem","MenuItemCheckbox","DropdownMenuRadioItem","MenuItemRadio","ItemPrefixWrapper","DropdownMenuItemContentWrapper","DropdownMenuItemChildrenWrapper","ItemSuffixWrapper","DropdownMenuGroup","MenuGroup","name","styles","map","toString","DropdownMenuGroupLabel","MenuGroupLabel","DropdownMenuSeparator","MenuSeparator","SubmenuChevronIcon","Icon","rtl","transform","DropdownMenuItemLabel","Truncate","DropdownMenuItemHelpText"],"sources":["@wordpress/components/src/dropdown-menu-v2/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, font, rtl, CONFIG } from '../utils';\nimport { space } from '../utils/space';\nimport Icon from '../icon';\nimport { Truncate } from '../truncate';\nimport type { DropdownMenuContext } from './types';\n\nconst ANIMATION_PARAMS = {\n\tSCALE_AMOUNT_OUTER: 0.82,\n\tSCALE_AMOUNT_CONTENT: 0.9,\n\tDURATION: {\n\t\tIN: '400ms',\n\t\tOUT: '200ms',\n\t},\n\tEASING: 'cubic-bezier(0.33, 0, 0, 1)',\n};\n\nconst CONTENT_WRAPPER_PADDING = space( 1 );\nconst ITEM_PADDING_BLOCK = space( 2 );\nconst ITEM_PADDING_INLINE = space( 3 );\n\n// TODO:\n// - border color and divider color are different from COLORS.theme variables\n// - lighter text color is not defined in COLORS.theme, should it be?\n// - lighter background color is not defined in COLORS.theme, should it be?\nconst DEFAULT_BORDER_COLOR = COLORS.theme.gray[ 300 ];\nconst DIVIDER_COLOR = COLORS.theme.gray[ 200 ];\nconst LIGHTER_TEXT_COLOR = COLORS.theme.gray[ 700 ];\nconst LIGHT_BACKGROUND_COLOR = COLORS.theme.gray[ 100 ];\nconst TOOLBAR_VARIANT_BORDER_COLOR = COLORS.theme.foreground;\nconst DEFAULT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ DEFAULT_BORDER_COLOR }, ${ CONFIG.elevationMedium }`;\nconst TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ TOOLBAR_VARIANT_BORDER_COLOR }`;\n\nconst GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr';\n\nexport const MenuPopoverOuterWrapper = styled.div<\n\tPick< DropdownMenuContext, 'variant' >\n>`\n\tposition: relative;\n\n\tbackground-color: ${ COLORS.ui.background };\n\tborder-radius: ${ CONFIG.radiusMedium };\n\t${ ( props ) => css`\n\t\tbox-shadow: ${ props.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BOX_SHADOW\n\t\t\t: DEFAULT_BOX_SHADOW };\n\t` }\n\n\toverflow: hidden;\n\n\t/* Open/close animation (outer wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition-property: transform, opacity;\n\t\ttransition-timing-function: ${ ANIMATION_PARAMS.EASING };\n\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.IN };\n\t\twill-change: transform, opacity;\n\n\t\t/* Regardless of the side, fade in and out. */\n\t\topacity: 0;\n\t\t&:has( [data-enter] ) {\n\t\t\topacity: 1;\n\t\t}\n\n\t\t&:has( [data-leave] ) {\n\t\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.OUT };\n\t\t}\n\n\t\t/* For menus opening on top and bottom side, animate the scale Y too. */\n\t\t&:has( [data-side='bottom'] ),\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform: scaleY( ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } );\n\t\t}\n\t\t&:has( [data-side='bottom'] ) {\n\t\t\ttransform-origin: top;\n\t\t}\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform-origin: bottom;\n\t\t}\n\t\t&:has( [data-enter][data-side='bottom'] ),\n\t\t&:has( [data-enter][data-side='top'] ),\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&:has( [data-leave][data-side='bottom'] ),\n\t\t&:has( [data-leave][data-side='top'] ) {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nexport const MenuPopoverInnerWrapper = styled.div`\n\tposition: relative;\n\t/* Same as popover component */\n\t/* TODO: is there a way to read the sass variable? */\n\tz-index: 1000000;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\tgrid-template-rows: auto;\n\n\tbox-sizing: border-box;\n\tmin-width: 160px;\n\tmax-width: 320px;\n\tmax-height: var( --popover-available-height );\n\n\tpadding: ${ CONTENT_WRAPPER_PADDING };\n\n\toverscroll-behavior: contain;\n\toverflow: auto;\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent !important;\n\n\t/* Open/close animation (inner content wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition: inherit;\n\t\ttransform-origin: inherit;\n\n\t\t/*\n\t\t * For menus opening on top and bottom side, animate the scale Y too.\n\t\t * The content scales at a different rate than the outer container:\n\t\t * - first, counter the outer scale factor by doing \"1 / scaleAmountOuter\"\n\t\t * - then, apply the content scale factor.\n\t\t */\n\t\t&[data-side='bottom'],\n\t\t&[data-side='top'] {\n\t\t\ttransform: scaleY(\n\t\t\t\tcalc(\n\t\t\t\t\t1 / ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } *\n\t\t\t\t\t\t${ ANIMATION_PARAMS.SCALE_AMOUNT_CONTENT }\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t\t&[data-enter][data-side='bottom'],\n\t\t&[data-enter][data-side='top'],\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&[data-leave][data-side='bottom'],\n\t\t&[data-leave][data-side='top'] {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nconst baseItem = css`\n\tall: unset;\n\n\tposition: relative;\n\tmin-height: ${ space( 10 ) };\n\tbox-sizing: border-box;\n\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\talign-items: center;\n\n\t@supports ( grid-template-columns: subgrid ) {\n\t\t/*\n\t\t * Define a grid layout which inherits the same columns configuration\n\t\t * from the parent layout (ie. subgrid). This allows the menu\n\t\t * to synchronize the indentation of all its items.\n\t\t */\n\t\tgrid-template-columns: subgrid;\n\t}\n\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tfont-family: inherit;\n\tfont-weight: normal;\n\tline-height: 20px;\n\n\tcolor: ${ COLORS.theme.foreground };\n\tborder-radius: ${ CONFIG.radiusSmall };\n\n\tpadding-block: ${ ITEM_PADDING_BLOCK };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n\n\t/*\n\t * Make sure that, when an item is scrolled into view (eg. while using the\n\t * keyboard to move focus), the whole item comes into view\n\t */\n\tscroll-margin: ${ CONTENT_WRAPPER_PADDING };\n\n\tuser-select: none;\n\toutline: none;\n\n\t&[aria-disabled='true'] {\n\t\tcolor: ${ COLORS.ui.textDisabled };\n\t\tcursor: not-allowed;\n\t}\n\n\t/* Active item (including hover) */\n\t&[data-active-item]:not( [data-focus-visible] ):not(\n\t\t\t[aria-disabled='true']\n\t\t) {\n\t\tbackground-color: ${ COLORS.theme.accent };\n\t\tcolor: ${ COLORS.white };\n\t}\n\n\t/* Keyboard focus (focus-visible) */\n\t&[data-focus-visible] {\n\t\tbox-shadow: 0 0 0 1.5px ${ COLORS.theme.accent };\n\n\t\t/* Only visible in Windows High Contrast mode */\n\t\toutline: 2px solid transparent;\n\t}\n\n\t/* Active (ie. pressed, mouse down) */\n\t&:active,\n\t&[data-active] {\n\t\t/* TODO: should there be a visual active state? */\n\t}\n\n\t/* When the item is the trigger of an open submenu */\n\t${ MenuPopoverInnerWrapper }:not(:focus) &:not(:focus)[aria-expanded=\"true\"] {\n\t\tbackground-color: ${ LIGHT_BACKGROUND_COLOR };\n\t\tcolor: ${ COLORS.theme.foreground };\n\t}\n\n\tsvg {\n\t\tfill: currentColor;\n\t}\n`;\n\nexport const DropdownMenuItem = styled( Ariakit.MenuItem )`\n\t${ baseItem };\n`;\n\nexport const DropdownMenuCheckboxItem = styled( Ariakit.MenuItemCheckbox )`\n\t${ baseItem };\n`;\n\nexport const DropdownMenuRadioItem = styled( Ariakit.MenuItemRadio )`\n\t${ baseItem };\n`;\n\nexport const ItemPrefixWrapper = styled.span`\n\t/* Always occupy the first column, even when auto-collapsing */\n\tgrid-column: 1;\n\n\t/*\n\t * Even when the item is not checked, occupy the same screen space to avoid\n\t * the space collapside when no items are checked.\n\t */\n\t${ DropdownMenuCheckboxItem } > &,\n\t${ DropdownMenuRadioItem } > & {\n\t\t/* Same width as the check icons */\n\t\tmin-width: ${ space( 6 ) };\n\t}\n\n\t${ DropdownMenuCheckboxItem } > &,\n\t${ DropdownMenuRadioItem } > &,\n\t&:not( :empty ) {\n\t\tmargin-inline-end: ${ space( 2 ) };\n\t}\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t* When the parent menu item is active, except when it's a non-focused/hovered\n\t* submenu trigger (in that case, color should not be inherited)\n\t*/\n\t[data-active-item]:not( [data-focus-visible] ) > &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] > & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const DropdownMenuItemContentWrapper = styled.div`\n\t/*\n\t * Always occupy the second column, since the first column\n\t * is taken by the prefix wrapper (when displayed).\n\t */\n\tgrid-column: 2;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: ${ space( 3 ) };\n\n\tpointer-events: none;\n`;\n\nexport const DropdownMenuItemChildrenWrapper = styled.div`\n\tflex: 1;\n\n\tdisplay: inline-flex;\n\tflex-direction: column;\n\tgap: ${ space( 1 ) };\n`;\n\nexport const ItemSuffixWrapper = styled.span`\n\tflex: 0 1 fit-content;\n\tmin-width: 0;\n\twidth: fit-content;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: ${ space( 3 ) };\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t * When the parent menu item is active, except when it's a non-focused/hovered\n\t * submenu trigger (in that case, color should not be inherited)\n\t */\n\t[data-active-item]:not( [data-focus-visible] ) *:not(${ MenuPopoverInnerWrapper }) &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] *:not(${ MenuPopoverInnerWrapper }) & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const DropdownMenuGroup = styled( Ariakit.MenuGroup )`\n\t/* Ignore this element when calculating the layout. Useful for subgrid */\n\tdisplay: contents;\n`;\n\nexport const DropdownMenuGroupLabel = styled( Ariakit.MenuGroupLabel )`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tpadding-block-start: ${ space( 3 ) };\n\tpadding-block-end: ${ space( 2 ) };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n`;\n\nexport const DropdownMenuSeparator = styled( Ariakit.MenuSeparator )<\n\tPick< DropdownMenuContext, 'variant' >\n>`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tborder: none;\n\theight: ${ CONFIG.borderWidth };\n\tbackground-color: ${ ( props ) =>\n\t\tprops.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BORDER_COLOR\n\t\t\t: DIVIDER_COLOR };\n\t/* Align with menu items' content */\n\tmargin-block: ${ space( 2 ) };\n\tmargin-inline: ${ ITEM_PADDING_INLINE };\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent;\n`;\n\nexport const SubmenuChevronIcon = styled( Icon )`\n\twidth: ${ space( 1.5 ) };\n\t${ rtl(\n\t\t{\n\t\t\ttransform: `scaleX(1)`,\n\t\t},\n\t\t{\n\t\t\ttransform: `scaleX(-1)`,\n\t\t}\n\t) };\n`;\n\nexport const DropdownMenuItemLabel = styled( Truncate )`\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tline-height: 20px;\n\tcolor: inherit;\n`;\n\nexport const DropdownMenuItemHelpText = styled( Truncate )`\n\tfont-size: ${ font( 'helpText.fontSize' ) };\n\tline-height: 16px;\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\tword-break: break-all;\n\n\t[data-active-item]:not( [data-focus-visible] )\n\t\t*:not( ${ MenuPopoverInnerWrapper } )\n\t\t&,\n\t[aria-disabled='true'] *:not( ${ MenuPopoverInnerWrapper } ) & {\n\t\tcolor: inherit;\n\t}\n`;\n"],"mappings":"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","ignoreList":[]}
|
package/build/modal/index.js
CHANGED
|
@@ -16,6 +16,7 @@ var _button = _interopRequireDefault(require("../button"));
|
|
|
16
16
|
var _styleProvider = _interopRequireDefault(require("../style-provider"));
|
|
17
17
|
var _withIgnoreImeEvents = require("../utils/with-ignore-ime-events");
|
|
18
18
|
var _spacer = require("../spacer");
|
|
19
|
+
var _useModalExitAnimation = require("./use-modal-exit-animation");
|
|
19
20
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
20
21
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
21
22
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
@@ -56,7 +57,7 @@ function UnforwardedModal(props, forwardedRef) {
|
|
|
56
57
|
closeButtonLabel,
|
|
57
58
|
children,
|
|
58
59
|
style,
|
|
59
|
-
overlayClassName,
|
|
60
|
+
overlayClassName: overlayClassnameProp,
|
|
60
61
|
className,
|
|
61
62
|
contentLabel,
|
|
62
63
|
onKeyDown,
|
|
@@ -160,6 +161,12 @@ function UnforwardedModal(props, forwardedRef) {
|
|
|
160
161
|
}
|
|
161
162
|
};
|
|
162
163
|
}, [bodyOpenClassName]);
|
|
164
|
+
const {
|
|
165
|
+
closeModal,
|
|
166
|
+
frameRef,
|
|
167
|
+
frameStyle,
|
|
168
|
+
overlayClassname
|
|
169
|
+
} = (0, _useModalExitAnimation.useModalExitAnimation)();
|
|
163
170
|
|
|
164
171
|
// Calls the isContentScrollable callback when the Modal children container resizes.
|
|
165
172
|
(0, _element.useLayoutEffect)(() => {
|
|
@@ -176,9 +183,7 @@ function UnforwardedModal(props, forwardedRef) {
|
|
|
176
183
|
function handleEscapeKeyDown(event) {
|
|
177
184
|
if (shouldCloseOnEsc && (event.code === 'Escape' || event.key === 'Escape') && !event.defaultPrevented) {
|
|
178
185
|
event.preventDefault();
|
|
179
|
-
|
|
180
|
-
onRequestClose(event);
|
|
181
|
-
}
|
|
186
|
+
closeModal().then(() => onRequestClose(event));
|
|
182
187
|
}
|
|
183
188
|
}
|
|
184
189
|
const onContentContainerScroll = (0, _element.useCallback)(e => {
|
|
@@ -212,7 +217,7 @@ function UnforwardedModal(props, forwardedRef) {
|
|
|
212
217
|
const isSameTarget = target === pressTarget;
|
|
213
218
|
pressTarget = null;
|
|
214
219
|
if (button === 0 && isSameTarget) {
|
|
215
|
-
onRequestClose();
|
|
220
|
+
closeModal().then(() => onRequestClose());
|
|
216
221
|
}
|
|
217
222
|
}
|
|
218
223
|
};
|
|
@@ -221,15 +226,18 @@ function UnforwardedModal(props, forwardedRef) {
|
|
|
221
226
|
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
222
227
|
(0, _jsxRuntime.jsx)("div", {
|
|
223
228
|
ref: (0, _compose.useMergeRefs)([ref, forwardedRef]),
|
|
224
|
-
className: (0, _clsx.default)('components-modal__screen-overlay',
|
|
229
|
+
className: (0, _clsx.default)('components-modal__screen-overlay', overlayClassname, overlayClassnameProp),
|
|
225
230
|
onKeyDown: (0, _withIgnoreImeEvents.withIgnoreIMEEvents)(handleEscapeKeyDown),
|
|
226
231
|
...(shouldCloseOnClickOutside ? overlayPressHandlers : {}),
|
|
227
232
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styleProvider.default, {
|
|
228
233
|
document: document,
|
|
229
234
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
230
235
|
className: (0, _clsx.default)('components-modal__frame', sizeClass, className),
|
|
231
|
-
style:
|
|
232
|
-
|
|
236
|
+
style: {
|
|
237
|
+
...frameStyle,
|
|
238
|
+
...style
|
|
239
|
+
},
|
|
240
|
+
ref: (0, _compose.useMergeRefs)([frameRef, constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),
|
|
233
241
|
role: role,
|
|
234
242
|
"aria-label": contentLabel,
|
|
235
243
|
"aria-labelledby": contentLabel ? undefined : headingId,
|
|
@@ -266,7 +274,7 @@ function UnforwardedModal(props, forwardedRef) {
|
|
|
266
274
|
marginLeft: 3
|
|
267
275
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.default, {
|
|
268
276
|
size: "small",
|
|
269
|
-
onClick: onRequestClose,
|
|
277
|
+
onClick: event => closeModal().then(() => onRequestClose(event)),
|
|
270
278
|
icon: _icons.close,
|
|
271
279
|
label: closeButtonLabel || (0, _i18n.__)('Close')
|
|
272
280
|
})]
|
package/build/modal/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_withIgnoreImeEvents","_spacer","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ModalContext","createContext","Set","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","modalize","unmodalize","onRequestCloseRef","dismissers","useContext","nestedDismissers","add","dismisser","delete","_bodyOpenClasses$get","theClass","oneMore","document","body","classList","oneLess","remove","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","onContentContainerScroll","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","jsx","useMergeRefs","clsx","withIgnoreIMEEvents","tabIndex","jsxs","onScroll","__","id","Fragment","Spacer","marginBottom","marginLeft","onClick","close","label","createPortal","Provider","value","exports","forwardRef","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef, KeyboardEvent, RefObject, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n\tcreateContext,\n\tuseContext,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { Spacer } from '../spacer';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\ntype Dismissers = Set<\n\tRefObject< ModalProps[ 'onRequestClose' ] | undefined >\n>;\nconst ModalContext = createContext< Dismissers >( new Set() );\n\n// Used to track body class names applied while modals are open.\nconst bodyOpenClasses = new Map< string, number >();\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\tsize,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's **content** when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\tlet sizeClass;\n\tif ( isFullScreen || size === 'fill' ) {\n\t\tsizeClass = 'is-full-screen';\n\t} else if ( size ) {\n\t\tsizeClass = `has-size-${ size }`;\n\t}\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\t// Accessibly isolates/unisolates the modal.\n\tuseEffect( () => {\n\t\tariaHelper.modalize( ref.current );\n\t\treturn () => ariaHelper.unmodalize();\n\t}, [] );\n\n\t// Keeps a fresh ref for the subsequent effect.\n\tconst onRequestCloseRef = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\tonRequestCloseRef.current = onRequestClose;\n\t}, [ onRequestClose ] );\n\n\t// The list of `onRequestClose` callbacks of open (non-nested) Modals. Only\n\t// one should remain open at a time and the list enables closing prior ones.\n\tconst dismissers = useContext( ModalContext );\n\t// Used for the tracking and dismissing any nested modals.\n\tconst [ nestedDismissers ] = useState< Dismissers >( () => new Set() );\n\n\t// Updates the stack tracking open modals at this level and calls\n\t// onRequestClose for any prior and/or nested modals as applicable.\n\tuseEffect( () => {\n\t\t// add this modal instance to the dismissers set\n\t\tdismissers.add( onRequestCloseRef );\n\t\t// request that all the other modals close themselves\n\t\tfor ( const dismisser of dismissers ) {\n\t\t\tif ( dismisser !== onRequestCloseRef ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\t// request that all the nested modals close themselves\n\t\t\tfor ( const dismisser of nestedDismissers ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t\t// remove this modal instance from the dismissers set\n\t\t\tdismissers.delete( onRequestCloseRef );\n\t\t};\n\t}, [ dismissers, nestedDismissers ] );\n\n\t// Adds/removes the value of bodyOpenClassName to body element.\n\tuseEffect( () => {\n\t\tconst theClass = bodyOpenClassName;\n\t\tconst oneMore = 1 + ( bodyOpenClasses.get( theClass ) ?? 0 );\n\t\tbodyOpenClasses.set( theClass, oneMore );\n\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\treturn () => {\n\t\t\tconst oneLess = bodyOpenClasses.get( theClass )! - 1;\n\t\t\tif ( oneLess === 0 ) {\n\t\t\t\tdocument.body.classList.remove( theClass );\n\t\t\t\tbodyOpenClasses.delete( theClass );\n\t\t\t} else {\n\t\t\t\tbodyOpenClasses.set( theClass, oneLess );\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver || ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\t( event.code === 'Escape' || event.key === 'Escape' ) &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\tlet pressTarget: EventTarget | null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids focus changing so that focus return works as expected.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) {\n\t\t\t\tonRequestClose();\n\t\t\t}\n\t\t},\n\t};\n\n\tconst modal = (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleEscapeKeyDown ) }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tsizeClass,\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ clsx( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\t\t\t\t\tmarginLeft={ 3 }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel ||\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Close' )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>\n\t);\n\n\treturn createPortal(\n\t\t<ModalContext.Provider value={ nestedDismissers }>\n\t\t\t{ modal }\n\t\t</ModalContext.Provider>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n *\n * return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_withIgnoreImeEvents","_spacer","_useModalExitAnimation","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ModalContext","createContext","Set","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","overlayClassnameProp","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","modalize","unmodalize","onRequestCloseRef","dismissers","useContext","nestedDismissers","add","dismisser","delete","_bodyOpenClasses$get","theClass","oneMore","document","body","classList","oneLess","remove","closeModal","frameRef","frameStyle","overlayClassname","useModalExitAnimation","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","then","onContentContainerScroll","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","jsx","useMergeRefs","clsx","withIgnoreIMEEvents","tabIndex","jsxs","onScroll","__","id","Fragment","Spacer","marginBottom","marginLeft","onClick","close","label","createPortal","Provider","value","exports","forwardRef","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n\tcreateContext,\n\tuseContext,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { Spacer } from '../spacer';\nimport { useModalExitAnimation } from './use-modal-exit-animation';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\ntype Dismissers = Set<\n\tReact.RefObject< ModalProps[ 'onRequestClose' ] | undefined >\n>;\nconst ModalContext = createContext< Dismissers >( new Set() );\n\n// Used to track body class names applied while modals are open.\nconst bodyOpenClasses = new Map< string, number >();\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName: overlayClassnameProp,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\tsize,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's **content** when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\tlet sizeClass;\n\tif ( isFullScreen || size === 'fill' ) {\n\t\tsizeClass = 'is-full-screen';\n\t} else if ( size ) {\n\t\tsizeClass = `has-size-${ size }`;\n\t}\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\t// Accessibly isolates/unisolates the modal.\n\tuseEffect( () => {\n\t\tariaHelper.modalize( ref.current );\n\t\treturn () => ariaHelper.unmodalize();\n\t}, [] );\n\n\t// Keeps a fresh ref for the subsequent effect.\n\tconst onRequestCloseRef = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\tonRequestCloseRef.current = onRequestClose;\n\t}, [ onRequestClose ] );\n\n\t// The list of `onRequestClose` callbacks of open (non-nested) Modals. Only\n\t// one should remain open at a time and the list enables closing prior ones.\n\tconst dismissers = useContext( ModalContext );\n\t// Used for the tracking and dismissing any nested modals.\n\tconst [ nestedDismissers ] = useState< Dismissers >( () => new Set() );\n\n\t// Updates the stack tracking open modals at this level and calls\n\t// onRequestClose for any prior and/or nested modals as applicable.\n\tuseEffect( () => {\n\t\t// add this modal instance to the dismissers set\n\t\tdismissers.add( onRequestCloseRef );\n\t\t// request that all the other modals close themselves\n\t\tfor ( const dismisser of dismissers ) {\n\t\t\tif ( dismisser !== onRequestCloseRef ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\t// request that all the nested modals close themselves\n\t\t\tfor ( const dismisser of nestedDismissers ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t\t// remove this modal instance from the dismissers set\n\t\t\tdismissers.delete( onRequestCloseRef );\n\t\t};\n\t}, [ dismissers, nestedDismissers ] );\n\n\t// Adds/removes the value of bodyOpenClassName to body element.\n\tuseEffect( () => {\n\t\tconst theClass = bodyOpenClassName;\n\t\tconst oneMore = 1 + ( bodyOpenClasses.get( theClass ) ?? 0 );\n\t\tbodyOpenClasses.set( theClass, oneMore );\n\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\treturn () => {\n\t\t\tconst oneLess = bodyOpenClasses.get( theClass )! - 1;\n\t\t\tif ( oneLess === 0 ) {\n\t\t\t\tdocument.body.classList.remove( theClass );\n\t\t\t\tbodyOpenClasses.delete( theClass );\n\t\t\t} else {\n\t\t\t\tbodyOpenClasses.set( theClass, oneLess );\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tconst { closeModal, frameRef, frameStyle, overlayClassname } =\n\t\tuseModalExitAnimation();\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver || ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown(\n\t\tevent: React.KeyboardEvent< HTMLDivElement >\n\t) {\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\t( event.code === 'Escape' || event.key === 'Escape' ) &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tcloseModal().then( () => onRequestClose( event ) );\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: React.UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\tlet pressTarget: EventTarget | null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids focus changing so that focus return works as expected.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) {\n\t\t\t\tcloseModal().then( () => onRequestClose() );\n\t\t\t}\n\t\t},\n\t};\n\n\tconst modal = (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassname,\n\t\t\t\toverlayClassnameProp\n\t\t\t) }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleEscapeKeyDown ) }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tsizeClass,\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t...frameStyle,\n\t\t\t\t\t\t...style,\n\t\t\t\t\t} }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tframeRef,\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ clsx( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\t\t\t\t\tmarginLeft={ 3 }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t\t) =>\n\t\t\t\t\t\t\t\t\t\t\t\tcloseModal().then( () =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tonRequestClose( event )\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel ||\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Close' )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>\n\t);\n\n\treturn createPortal(\n\t\t<ModalContext.Provider value={ nestedDismissers }>\n\t\t\t{ modal }\n\t\t</ModalContext.Provider>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n *\n * return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
|
package/build/modal/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/**\n *
|
|
1
|
+
{"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type ModalProps = {\n\taria?: {\n\t\t/**\n\t\t * If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-describedby`.\n\t\t */\n\t\tdescribedby?: string;\n\t\t/**\n\t\t * If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-labelledby`. Use this when you are rendering the title\n\t\t * yourself within the modal's content area instead of using the `title`\n\t\t * prop. This ensures the title is usable by assistive technology.\n\t\t *\n\t\t * Titles are required for accessibility reasons, see `contentLabel` and\n\t\t * `title` for other ways to provide a title.\n\t\t */\n\t\tlabelledby?: string;\n\t};\n\t/**\n\t * Class name added to the body element when the modal is open.\n\t *\n\t * @default 'modal-open'\n\t */\n\tbodyOpenClassName?: string;\n\t/**\n\t * The children elements.\n\t */\n\tchildren: React.ReactNode;\n\t/**\n\t * If this property is added, it will an additional class name to the modal\n\t * content `div`.\n\t */\n\tclassName?: string;\n\t/**\n\t * Label on the close button.\n\t *\n\t * @default `__( 'Close' )`\n\t */\n\tcloseButtonLabel?: string;\n\t/**\n\t * If this property is added, it will be added to the modal content `div` as\n\t * `aria-label`.\n\t *\n\t * Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `title` for other ways to provide a title.\n\t */\n\tcontentLabel?: string;\n\t/**\n\t * If this property is true, it will focus the first tabbable element\n\t * rendered in the modal.\n\t *\n\t * @default true\n\t */\n\tfocusOnMount?:\n\t\t| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t| 'firstContentElement';\n\t/**\n\t * Elements that are injected into the modal header to the left of the close button (if rendered).\n\t * Hidden if `__experimentalHideHeader` is `true`.\n\t *\n\t * @default null\n\t */\n\theaderActions?: React.ReactNode;\n\n\t/**\n\t * If this property is added, an icon will be added before the title.\n\t */\n\ticon?: JSX.Element;\n\t/**\n\t * If this property is set to false, the modal will not display a close icon\n\t * and cannot be dismissed.\n\t *\n\t * @default true\n\t */\n\tisDismissible?: boolean;\n\t/**\n\t * This property when set to `true` will render a full screen modal.\n\t *\n\t * @default false\n\t */\n\tisFullScreen?: boolean;\n\t/**\n\t * If this property is added it will cause the modal to render at a preset\n\t * width, or expand to fill the screen. This prop will be ignored if\n\t * `isFullScreen` is set to `true`.\n\t *\n\t * Note: `Modal`'s width can also be controlled by adjusting the width of the\n\t * modal's contents, or via CSS using the `style` prop.\n\t */\n\tsize?: 'small' | 'medium' | 'large' | 'fill';\n\t/**\n\t * Handle the key down on the modal frame `div`.\n\t */\n\tonKeyDown?: React.KeyboardEventHandler< HTMLDivElement >;\n\t/**\n\t * This function is called to indicate that the modal should be closed.\n\t */\n\tonRequestClose: (\n\t\tevent?: React.KeyboardEvent< HTMLDivElement > | React.SyntheticEvent\n\t) => void;\n\t/**\n\t * If this property is added, it will an additional class name to the modal\n\t * overlay `div`.\n\t */\n\toverlayClassName?: string;\n\t/**\n\t * If this property is added, it will override the default role of the\n\t * modal.\n\t *\n\t * @default 'dialog'\n\t */\n\trole?: React.AriaRole;\n\t/**\n\t * If this property is added, it will determine whether the modal requests\n\t * to close when a mouse click occurs outside of the modal content.\n\t *\n\t * @default true\n\t */\n\tshouldCloseOnClickOutside?: boolean;\n\t/**\n\t * If this property is added, it will determine whether the modal requests\n\t * to close when the escape key is pressed.\n\t *\n\t * @default true\n\t */\n\tshouldCloseOnEsc?: boolean;\n\t/**\n\t * If this property is added, it will be added to the modal frame `div`.\n\t */\n\tstyle?: React.CSSProperties;\n\t/**\n\t * This property is used as the modal header's title.\n\t *\n\t * Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `contentLabel` for other ways to provide a title.\n\t */\n\ttitle?: string;\n\t/**\n\t * When set to `true`, the Modal's header (including the icon, title and\n\t * close button) will not be rendered.\n\t *\n\t * _Warning_: This property is still experimental. “Experimental” means this\n\t * is an early implementation subject to drastic and breaking changes.\n\t *\n\t * @default false\n\t */\n\t__experimentalHideHeader?: boolean;\n};\n"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.useModalExitAnimation = useModalExitAnimation;
|
|
8
|
+
var _compose = require("@wordpress/compose");
|
|
9
|
+
var _element = require("@wordpress/element");
|
|
10
|
+
var _utils = require("../utils");
|
|
11
|
+
var _warning = _interopRequireDefault(require("@wordpress/warning"));
|
|
12
|
+
/**
|
|
13
|
+
* WordPress dependencies
|
|
14
|
+
*/
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* Internal dependencies
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
// Animation duration (ms) extracted to JS in order to be used on a setTimeout.
|
|
21
|
+
const FRAME_ANIMATION_DURATION = _utils.CONFIG.transitionDuration;
|
|
22
|
+
const FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(_utils.CONFIG.transitionDuration);
|
|
23
|
+
const EXIT_ANIMATION_NAME = 'components-modal__disappear-animation';
|
|
24
|
+
function useModalExitAnimation() {
|
|
25
|
+
const frameRef = (0, _element.useRef)();
|
|
26
|
+
const [isAnimatingOut, setIsAnimatingOut] = (0, _element.useState)(false);
|
|
27
|
+
const isReducedMotion = (0, _compose.useReducedMotion)();
|
|
28
|
+
const closeModal = (0, _element.useCallback)(() => new Promise(closeModalResolve => {
|
|
29
|
+
// Grab a "stable" reference of the frame element, since
|
|
30
|
+
// the value held by the react ref might change at runtime.
|
|
31
|
+
const frameEl = frameRef.current;
|
|
32
|
+
if (isReducedMotion) {
|
|
33
|
+
closeModalResolve();
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
if (!frameEl) {
|
|
37
|
+
globalThis.SCRIPT_DEBUG === true ? (0, _warning.default)("wp.components.Modal: the Modal component can't be closed with an exit animation because of a missing reference to the modal frame element.") : void 0;
|
|
38
|
+
closeModalResolve();
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
41
|
+
let handleAnimationEnd;
|
|
42
|
+
const startAnimation = () => new Promise(animationResolve => {
|
|
43
|
+
handleAnimationEnd = e => {
|
|
44
|
+
if (e.animationName === EXIT_ANIMATION_NAME) {
|
|
45
|
+
animationResolve();
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
frameEl.addEventListener('animationend', handleAnimationEnd);
|
|
49
|
+
setIsAnimatingOut(true);
|
|
50
|
+
});
|
|
51
|
+
const animationTimeout = () => new Promise(timeoutResolve => {
|
|
52
|
+
setTimeout(() => timeoutResolve(),
|
|
53
|
+
// Allow an extra 20% of the animation duration for the
|
|
54
|
+
// animationend event to fire, in case the animation frame is
|
|
55
|
+
// slightly delayes by some other events in the event loop.
|
|
56
|
+
FRAME_ANIMATION_DURATION_NUMBER * 1.2);
|
|
57
|
+
});
|
|
58
|
+
Promise.race([startAnimation(), animationTimeout()]).then(() => {
|
|
59
|
+
if (handleAnimationEnd) {
|
|
60
|
+
frameEl.removeEventListener('animationend', handleAnimationEnd);
|
|
61
|
+
}
|
|
62
|
+
setIsAnimatingOut(false);
|
|
63
|
+
closeModalResolve();
|
|
64
|
+
});
|
|
65
|
+
}), [isReducedMotion]);
|
|
66
|
+
return {
|
|
67
|
+
overlayClassname: isAnimatingOut ? 'is-animating-out' : undefined,
|
|
68
|
+
frameRef,
|
|
69
|
+
frameStyle: {
|
|
70
|
+
'--modal-frame-animation-duration': `${FRAME_ANIMATION_DURATION}`
|
|
71
|
+
},
|
|
72
|
+
closeModal
|
|
73
|
+
};
|
|
74
|
+
}
|
|
75
|
+
//# sourceMappingURL=use-modal-exit-animation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_compose","require","_element","_utils","_warning","_interopRequireDefault","FRAME_ANIMATION_DURATION","CONFIG","transitionDuration","FRAME_ANIMATION_DURATION_NUMBER","Number","parseInt","EXIT_ANIMATION_NAME","useModalExitAnimation","frameRef","useRef","isAnimatingOut","setIsAnimatingOut","useState","isReducedMotion","useReducedMotion","closeModal","useCallback","Promise","closeModalResolve","frameEl","current","globalThis","SCRIPT_DEBUG","warning","handleAnimationEnd","startAnimation","animationResolve","e","animationName","addEventListener","animationTimeout","timeoutResolve","setTimeout","race","then","removeEventListener","overlayClassname","undefined","frameStyle"],"sources":["@wordpress/components/src/modal/use-modal-exit-animation.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useCallback, useRef, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { CONFIG } from '../utils';\nimport warning from '@wordpress/warning';\n\n// Animation duration (ms) extracted to JS in order to be used on a setTimeout.\nconst FRAME_ANIMATION_DURATION = CONFIG.transitionDuration;\nconst FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(\n\tCONFIG.transitionDuration\n);\n\nconst EXIT_ANIMATION_NAME = 'components-modal__disappear-animation';\n\nexport function useModalExitAnimation() {\n\tconst frameRef = useRef< HTMLDivElement >();\n\tconst [ isAnimatingOut, setIsAnimatingOut ] = useState( false );\n\tconst isReducedMotion = useReducedMotion();\n\n\tconst closeModal = useCallback(\n\t\t() =>\n\t\t\tnew Promise< void >( ( closeModalResolve ) => {\n\t\t\t\t// Grab a \"stable\" reference of the frame element, since\n\t\t\t\t// the value held by the react ref might change at runtime.\n\t\t\t\tconst frameEl = frameRef.current;\n\n\t\t\t\tif ( isReducedMotion ) {\n\t\t\t\t\tcloseModalResolve();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( ! frameEl ) {\n\t\t\t\t\twarning(\n\t\t\t\t\t\t\"wp.components.Modal: the Modal component can't be closed with an exit animation because of a missing reference to the modal frame element.\"\n\t\t\t\t\t);\n\t\t\t\t\tcloseModalResolve();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tlet handleAnimationEnd:\n\t\t\t\t\t| undefined\n\t\t\t\t\t| ( ( e: AnimationEvent ) => void );\n\n\t\t\t\tconst startAnimation = () =>\n\t\t\t\t\tnew Promise< void >( ( animationResolve ) => {\n\t\t\t\t\t\thandleAnimationEnd = ( e: AnimationEvent ) => {\n\t\t\t\t\t\t\tif ( e.animationName === EXIT_ANIMATION_NAME ) {\n\t\t\t\t\t\t\t\tanimationResolve();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tframeEl.addEventListener(\n\t\t\t\t\t\t\t'animationend',\n\t\t\t\t\t\t\thandleAnimationEnd\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetIsAnimatingOut( true );\n\t\t\t\t\t} );\n\t\t\t\tconst animationTimeout = () =>\n\t\t\t\t\tnew Promise< void >( ( timeoutResolve ) => {\n\t\t\t\t\t\tsetTimeout(\n\t\t\t\t\t\t\t() => timeoutResolve(),\n\t\t\t\t\t\t\t// Allow an extra 20% of the animation duration for the\n\t\t\t\t\t\t\t// animationend event to fire, in case the animation frame is\n\t\t\t\t\t\t\t// slightly delayes by some other events in the event loop.\n\t\t\t\t\t\t\tFRAME_ANIMATION_DURATION_NUMBER * 1.2\n\t\t\t\t\t\t);\n\t\t\t\t\t} );\n\n\t\t\t\tPromise.race( [ startAnimation(), animationTimeout() ] ).then(\n\t\t\t\t\t() => {\n\t\t\t\t\t\tif ( handleAnimationEnd ) {\n\t\t\t\t\t\t\tframeEl.removeEventListener(\n\t\t\t\t\t\t\t\t'animationend',\n\t\t\t\t\t\t\t\thandleAnimationEnd\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsetIsAnimatingOut( false );\n\t\t\t\t\t\tcloseModalResolve();\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t} ),\n\t\t[ isReducedMotion ]\n\t);\n\n\treturn {\n\t\toverlayClassname: isAnimatingOut ? 'is-animating-out' : undefined,\n\t\tframeRef,\n\t\tframeStyle: {\n\t\t\t'--modal-frame-animation-duration': `${ FRAME_ANIMATION_DURATION }`,\n\t\t},\n\t\tcloseModal,\n\t};\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA,MAAMK,wBAAwB,GAAGC,aAAM,CAACC,kBAAkB;AAC1D,MAAMC,+BAA+B,GAAGC,MAAM,CAACC,QAAQ,CACtDJ,aAAM,CAACC,kBACR,CAAC;AAED,MAAMI,mBAAmB,GAAG,uCAAuC;AAE5D,SAASC,qBAAqBA,CAAA,EAAG;EACvC,MAAMC,QAAQ,GAAG,IAAAC,eAAM,EAAmB,CAAC;EAC3C,MAAM,CAAEC,cAAc,EAAEC,iBAAiB,CAAE,GAAG,IAAAC,iBAAQ,EAAE,KAAM,CAAC;EAC/D,MAAMC,eAAe,GAAG,IAAAC,yBAAgB,EAAC,CAAC;EAE1C,MAAMC,UAAU,GAAG,IAAAC,oBAAW,EAC7B,MACC,IAAIC,OAAO,CAAYC,iBAAiB,IAAM;IAC7C;IACA;IACA,MAAMC,OAAO,GAAGX,QAAQ,CAACY,OAAO;IAEhC,IAAKP,eAAe,EAAG;MACtBK,iBAAiB,CAAC,CAAC;MACnB;IACD;IAEA,IAAK,CAAEC,OAAO,EAAG;MAChBE,UAAA,CAAAC,YAAA,gBAAAC,gBAAO,EACN,4IACD,CAAC;MACDL,iBAAiB,CAAC,CAAC;MACnB;IACD;IAEA,IAAIM,kBAEgC;IAEpC,MAAMC,cAAc,GAAGA,CAAA,KACtB,IAAIR,OAAO,CAAYS,gBAAgB,IAAM;MAC5CF,kBAAkB,GAAKG,CAAiB,IAAM;QAC7C,IAAKA,CAAC,CAACC,aAAa,KAAKtB,mBAAmB,EAAG;UAC9CoB,gBAAgB,CAAC,CAAC;QACnB;MACD,CAAC;MAEDP,OAAO,CAACU,gBAAgB,CACvB,cAAc,EACdL,kBACD,CAAC;MACDb,iBAAiB,CAAE,IAAK,CAAC;IAC1B,CAAE,CAAC;IACJ,MAAMmB,gBAAgB,GAAGA,CAAA,KACxB,IAAIb,OAAO,CAAYc,cAAc,IAAM;MAC1CC,UAAU,CACT,MAAMD,cAAc,CAAC,CAAC;MACtB;MACA;MACA;MACA5B,+BAA+B,GAAG,GACnC,CAAC;IACF,CAAE,CAAC;IAEJc,OAAO,CAACgB,IAAI,CAAE,CAAER,cAAc,CAAC,CAAC,EAAEK,gBAAgB,CAAC,CAAC,CAAG,CAAC,CAACI,IAAI,CAC5D,MAAM;MACL,IAAKV,kBAAkB,EAAG;QACzBL,OAAO,CAACgB,mBAAmB,CAC1B,cAAc,EACdX,kBACD,CAAC;MACF;MACAb,iBAAiB,CAAE,KAAM,CAAC;MAC1BO,iBAAiB,CAAC,CAAC;IACpB,CACD,CAAC;EACF,CAAE,CAAC,EACJ,CAAEL,eAAe,CAClB,CAAC;EAED,OAAO;IACNuB,gBAAgB,EAAE1B,cAAc,GAAG,kBAAkB,GAAG2B,SAAS;IACjE7B,QAAQ;IACR8B,UAAU,EAAE;MACX,kCAAkC,EAAG,GAAGtC,wBAA0B;IACnE,CAAC;IACDe;EACD,CAAC;AACF","ignoreList":[]}
|