@wordpress/components 29.0.0 → 29.1.0

package/build/range-control/styles/range-control-styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_numberControl","_interopRequireDefault","_utils","_space","_EMOTION_STRINGIFIED_CSS_ERROR__","rangeHeightValue","railHeight","rangeHeight","css","height","minHeight","process","env","NODE_ENV","thumbSize","deprecatedHeight","__next40pxDefaultSize","Root","exports","_base","default","target","label","wrapperColor","color","COLORS","ui","borderFocus","wrapperMargin","marks","__nextHasNoMarginBottom","marginBottom","undefined","Wrapper","shouldForwardProp","prop","includes","BeforeIconWrapper","rtl","marginRight","AfterIconWrapper","marginLeft","railBackgroundColor","disabled","railColor","background","backgroundDisabled","Rail","gray","CONFIG","radiusFull","trackBackgroundColor","trackColor","Track","MarksWrapper","name","styles","map","toString","Mark","markLabelFill","isFilled","MarkLabel","left","transform","thumbColor","theme","accent","ThumbWrapper","radiusRound","thumbFocus","isFocused","Thumb","elevationXSmall","InputRange","tooltipShow","show","_ref","_ref2","tooltipPosition","position","isBottom","Tooltip","radiusSmall","InputNumber","NumberControl","space","ActionRightWrapper"],"sources":["@wordpress/components/src/range-control/styles/range-control-styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport NumberControl from '../../number-control';\nimport { COLORS, rtl, CONFIG } from '../../utils';\nimport { space } from '../../utils/space';\n\nimport type {\n\tRangeMarkProps,\n\tRailProps,\n\tThumbProps,\n\tTooltipProps,\n\tTrackProps,\n\tWrapperProps,\n\tRangeControlProps,\n} from '../types';\n\nconst rangeHeightValue = 30;\nconst railHeight = 4;\nconst rangeHeight = () =>\n\tcss( { height: rangeHeightValue, minHeight: rangeHeightValue } );\nconst thumbSize = 12;\n\nconst deprecatedHeight = ( {\n\t__next40pxDefaultSize,\n}: Pick< RangeControlProps, '__next40pxDefaultSize' > ) =>\n\t! __next40pxDefaultSize && css( { minHeight: rangeHeightValue } );\n\ntype RootProps = Pick< RangeControlProps, '__next40pxDefaultSize' >;\nexport const Root = styled.div< RootProps >`\n\t-webkit-tap-highlight-color: transparent;\n\talign-items: center;\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\tpadding: 0;\n\tposition: relative;\n\ttouch-action: none;\n\twidth: 100%;\n\tmin-height: 40px;\n\t/* TODO: remove after removing the __next40pxDefaultSize prop */\n\t${ deprecatedHeight };\n`;\n\nconst wrapperColor = ( { color = COLORS.ui.borderFocus }: WrapperProps ) =>\n\tcss( { color } );\n\nconst wrapperMargin = ( { marks, __nextHasNoMarginBottom }: WrapperProps ) => {\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\treturn css( { marginBottom: marks ? 16 : undefined } );\n\t}\n\treturn '';\n};\n\nexport const Wrapper = styled( 'div', {\n\tshouldForwardProp: ( prop: string ) =>\n\t\t! [ 'color', '__nextHasNoMarginBottom', 'marks' ].includes( prop ),\n} )< WrapperProps >`\n\tdisplay: block;\n\tflex: 1;\n\tposition: relative;\n\twidth: 100%;\n\n\t${ wrapperColor };\n\t${ rangeHeight };\n\t${ wrapperMargin };\n`;\n\nexport const BeforeIconWrapper = styled.span`\n\tdisplay: flex; // ensures the height isn't affected by line-height\n\tmargin-top: ${ railHeight }px;\n\n\t${ rtl( { marginRight: 6 } ) }\n`;\n\nexport const AfterIconWrapper = styled.span`\n\tdisplay: flex; // ensures the height isn't affected by line-height\n\tmargin-top: ${ railHeight }px;\n\n\t${ rtl( { marginLeft: 6 } ) }\n`;\n\nconst railBackgroundColor = ( { disabled, railColor }: RailProps ) => {\n\tlet background = railColor || '';\n\n\tif ( disabled ) {\n\t\tbackground = COLORS.ui.backgroundDisabled;\n\t}\n\n\treturn css( { background } );\n};\n\nexport const Rail = styled.span`\n\tbackground-color: ${ COLORS.gray[ 300 ] };\n\tleft: 0;\n\tpointer-events: none;\n\tright: 0;\n\tdisplay: block;\n\theight: ${ railHeight }px;\n\tposition: absolute;\n\tmargin-top: ${ ( rangeHeightValue - railHeight ) / 2 }px;\n\ttop: 0;\n\tborder-radius: ${ CONFIG.radiusFull };\n\n\t${ railBackgroundColor };\n`;\n\nconst trackBackgroundColor = ( { disabled, trackColor }: TrackProps ) => {\n\tlet background = trackColor || 'currentColor';\n\n\tif ( disabled ) {\n\t\tbackground = COLORS.gray[ 400 ];\n\t}\n\n\treturn css( { background } );\n};\n\nexport const Track = styled.span`\n\tbackground-color: currentColor;\n\tborder-radius: ${ CONFIG.radiusFull };\n\theight: ${ railHeight }px;\n\tpointer-events: none;\n\tdisplay: block;\n\tposition: absolute;\n\tmargin-top: ${ ( rangeHeightValue - railHeight ) / 2 }px;\n\ttop: 0;\n\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition: width ease 0.1s;\n\t}\n\n\t${ trackBackgroundColor };\n`;\n\nexport const MarksWrapper = styled.span`\n\tdisplay: block;\n\tpointer-events: none;\n\tposition: relative;\n\twidth: 100%;\n\tuser-select: none;\n\tmargin-top: 17px;\n`;\n\nexport const Mark = styled.span`\n\tposition: absolute;\n\tleft: 0;\n\ttop: -4px;\n\theight: 4px;\n\twidth: 2px;\n\ttransform: translateX( -50% );\n\tbackground-color: ${ COLORS.ui.background };\n\tz-index: 1;\n`;\n\nconst markLabelFill = ( { isFilled }: RangeMarkProps ) => {\n\treturn css( {\n\t\tcolor: isFilled ? COLORS.gray[ 700 ] : COLORS.gray[ 300 ],\n\t} );\n};\n\nexport const MarkLabel = styled.span`\n\tcolor: ${ COLORS.gray[ 300 ] };\n\tfont-size: 11px;\n\tposition: absolute;\n\ttop: 8px;\n\twhite-space: nowrap;\n\n\t${ rtl( { left: 0 } ) };\n\t${ rtl(\n\t\t{ transform: 'translateX( -50% )' },\n\t\t{ transform: 'translateX( 50% )' }\n\t) };\n\n\t${ markLabelFill };\n`;\n\nconst thumbColor = ( { disabled }: ThumbProps ) =>\n\tdisabled\n\t\t? css`\n\t\t\t\tbackground-color: ${ COLORS.gray[ 400 ] };\n\t\t  `\n\t\t: css`\n\t\t\t\tbackground-color: ${ COLORS.theme.accent };\n\t\t  `;\n\nexport const ThumbWrapper = styled.span`\n\talign-items: center;\n\tdisplay: flex;\n\theight: ${ thumbSize }px;\n\tjustify-content: center;\n\tmargin-top: ${ ( rangeHeightValue - thumbSize ) / 2 }px;\n\toutline: 0;\n\tpointer-events: none;\n\tposition: absolute;\n\ttop: 0;\n\tuser-select: none;\n\twidth: ${ thumbSize }px;\n\tborder-radius: ${ CONFIG.radiusRound };\n\tz-index: 3;\n\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition: left ease 0.1s;\n\t}\n\n\t${ thumbColor };\n\t${ rtl( { marginLeft: -10 } ) };\n\t${ rtl(\n\t\t{ transform: 'translateX( 4.5px )' },\n\t\t{ transform: 'translateX( -4.5px )' }\n\t) };\n`;\n\nconst thumbFocus = ( { isFocused }: ThumbProps ) => {\n\treturn isFocused\n\t\t? css`\n\t\t\t\t&::before {\n\t\t\t\t\tcontent: ' ';\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tbackground-color: ${ COLORS.theme.accent };\n\t\t\t\t\topacity: 0.4;\n\t\t\t\t\tborder-radius: ${ CONFIG.radiusRound };\n\t\t\t\t\theight: ${ thumbSize + 8 }px;\n\t\t\t\t\twidth: ${ thumbSize + 8 }px;\n\t\t\t\t\ttop: -4px;\n\t\t\t\t\tleft: -4px;\n\t\t\t\t}\n\t\t  `\n\t\t: '';\n};\n\nexport const Thumb = styled.span< ThumbProps >`\n\talign-items: center;\n\tborder-radius: ${ CONFIG.radiusRound };\n\theight: 100%;\n\toutline: 0;\n\tposition: absolute;\n\tuser-select: none;\n\twidth: 100%;\n\tbox-shadow: ${ CONFIG.elevationXSmall };\n\n\t${ thumbColor };\n\t${ thumbFocus };\n`;\n\nexport const InputRange = styled.input`\n\tbox-sizing: border-box;\n\tcursor: pointer;\n\tdisplay: block;\n\theight: 100%;\n\tleft: 0;\n\tmargin: 0 -${ thumbSize / 2 }px;\n\topacity: 0;\n\toutline: none;\n\tposition: absolute;\n\tright: 0;\n\ttop: 0;\n\twidth: calc( 100% + ${ thumbSize }px );\n`;\n\nconst tooltipShow = ( { show }: TooltipProps ) => {\n\treturn css`\n\t\tdisplay: ${ show ? 'inline-block' : 'none' };\n\t\topacity: ${ show ? 1 : 0 };\n\n\t\t@media not ( prefers-reduced-motion ) {\n\t\t\ttransition:\n\t\t\t\topacity 120ms ease,\n\t\t\t\tdisplay 120ms ease allow-discrete;\n\t\t}\n\n\t\t@starting-style {\n\t\t\topacity: 0;\n\t\t}\n\t`;\n};\n\nconst tooltipPosition = ( { position }: TooltipProps ) => {\n\tconst isBottom = position === 'bottom';\n\n\tif ( isBottom ) {\n\t\treturn css`\n\t\t\tbottom: -80%;\n\t\t`;\n\t}\n\n\treturn css`\n\t\ttop: -80%;\n\t`;\n};\n\nexport const Tooltip = styled.span< TooltipProps >`\n\tbackground: rgba( 0, 0, 0, 0.8 );\n\tborder-radius: ${ CONFIG.radiusSmall };\n\tcolor: white;\n\tfont-size: 12px;\n\tmin-width: 32px;\n\tpadding: 4px 8px;\n\tpointer-events: none;\n\tposition: absolute;\n\ttext-align: center;\n\tuser-select: none;\n\tline-height: 1.4;\n\n\t${ tooltipShow };\n\n\t${ tooltipPosition };\n\t${ rtl(\n\t\t{ transform: 'translateX(-50%)' },\n\t\t{ transform: 'translateX(50%)' }\n\t) }\n`;\n\n// @todo Refactor RangeControl with latest HStack configuration\n// @see: packages/components/src/h-stack\nexport const InputNumber = styled( NumberControl )`\n\tdisplay: inline-block;\n\tfont-size: 13px;\n\tmargin-top: 0;\n\n\tinput[type='number']& {\n\t\t${ rangeHeight };\n\t}\n\n\t${ rtl( { marginLeft: `${ space( 4 ) } !important` } ) }\n`;\n\nexport const ActionRightWrapper = styled.span`\n\tdisplay: block;\n\tmargin-top: 0;\n\n\tbutton,\n\tbutton.is-small {\n\t\tmargin-left: 0;\n\t\t${ rangeHeight };\n\t}\n\n\t${ rtl( { marginLeft: 8 } ) }\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","require","_numberControl","_interopRequireDefault","_utils","_space","_EMOTION_STRINGIFIED_CSS_ERROR__","rangeHeightValue","railHeight","rangeHeight","css","height","minHeight","process","env","NODE_ENV","thumbSize","deprecatedHeight","__next40pxDefaultSize","Root","exports","_base","default","target","label","wrapperColor","color","COLORS","ui","borderFocus","wrapperMargin","marks","__nextHasNoMarginBottom","marginBottom","undefined","Wrapper","shouldForwardProp","prop","includes","BeforeIconWrapper","rtl","marginRight","AfterIconWrapper","marginLeft","railBackgroundColor","disabled","railColor","background","backgroundDisabled","Rail","gray","CONFIG","radiusFull","trackBackgroundColor","trackColor","Track","MarksWrapper","name","styles","map","toString","Mark","markLabelFill","isFilled","MarkLabel","left","transform","thumbColor","theme","accent","ThumbWrapper","radiusRound","thumbFocus","isFocused","Thumb","elevationXSmall","InputRange","tooltipShow","show","_ref","_ref2","tooltipPosition","position","isBottom","Tooltip","radiusSmall","InputNumber","NumberControl","space","ActionRightWrapper"],"sources":["@wordpress/components/src/range-control/styles/range-control-styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport NumberControl from '../../number-control';\nimport { COLORS, rtl, CONFIG } from '../../utils';\nimport { space } from '../../utils/space';\n\nimport type {\n\tRangeMarkProps,\n\tRailProps,\n\tThumbProps,\n\tTooltipProps,\n\tTrackProps,\n\tWrapperProps,\n\tRangeControlProps,\n} from '../types';\n\nconst rangeHeightValue = 30;\nconst railHeight = 4;\nconst rangeHeight = () =>\n\tcss( { height: rangeHeightValue, minHeight: rangeHeightValue } );\nconst thumbSize = 12;\n\nconst deprecatedHeight = ( {\n\t__next40pxDefaultSize,\n}: Pick< RangeControlProps, '__next40pxDefaultSize' > ) =>\n\t! __next40pxDefaultSize && css( { minHeight: rangeHeightValue } );\n\ntype RootProps = Pick< RangeControlProps, '__next40pxDefaultSize' >;\nexport const Root = styled.div< RootProps >`\n\t-webkit-tap-highlight-color: transparent;\n\talign-items: center;\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\tpadding: 0;\n\tposition: relative;\n\ttouch-action: none;\n\twidth: 100%;\n\tmin-height: 40px;\n\t/* TODO: remove after removing the __next40pxDefaultSize prop */\n\t${ deprecatedHeight };\n`;\n\nconst wrapperColor = ( { color = COLORS.ui.borderFocus }: WrapperProps ) =>\n\tcss( { color } );\n\nconst wrapperMargin = ( { marks, __nextHasNoMarginBottom }: WrapperProps ) => {\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\treturn css( { marginBottom: marks ? 16 : undefined } );\n\t}\n\treturn '';\n};\n\nexport const Wrapper = styled( 'div', {\n\tshouldForwardProp: ( prop: string ) =>\n\t\t! [ 'color', '__nextHasNoMarginBottom', 'marks' ].includes( prop ),\n} )< WrapperProps >`\n\tdisplay: block;\n\tflex: 1;\n\tposition: relative;\n\twidth: 100%;\n\n\t${ wrapperColor };\n\t${ rangeHeight };\n\t${ wrapperMargin };\n`;\n\nexport const BeforeIconWrapper = styled.span`\n\tdisplay: flex; // ensures the height isn't affected by line-height\n\tmargin-top: ${ railHeight }px;\n\n\t${ rtl( { marginRight: 6 } ) }\n`;\n\nexport const AfterIconWrapper = styled.span`\n\tdisplay: flex; // ensures the height isn't affected by line-height\n\tmargin-top: ${ railHeight }px;\n\n\t${ rtl( { marginLeft: 6 } ) }\n`;\n\nconst railBackgroundColor = ( { disabled, railColor }: RailProps ) => {\n\tlet background = railColor || '';\n\n\tif ( disabled ) {\n\t\tbackground = COLORS.ui.backgroundDisabled;\n\t}\n\n\treturn css( { background } );\n};\n\nexport const Rail = styled.span`\n\tbackground-color: ${ COLORS.gray[ 300 ] };\n\tleft: 0;\n\tpointer-events: none;\n\tright: 0;\n\tdisplay: block;\n\theight: ${ railHeight }px;\n\tposition: absolute;\n\tmargin-top: ${ ( rangeHeightValue - railHeight ) / 2 }px;\n\ttop: 0;\n\tborder-radius: ${ CONFIG.radiusFull };\n\n\t${ railBackgroundColor };\n`;\n\nconst trackBackgroundColor = ( { disabled, trackColor }: TrackProps ) => {\n\tlet background = trackColor || 'currentColor';\n\n\tif ( disabled ) {\n\t\tbackground = COLORS.gray[ 400 ];\n\t}\n\n\treturn css( { background } );\n};\n\nexport const Track = styled.span`\n\tbackground-color: currentColor;\n\tborder-radius: ${ CONFIG.radiusFull };\n\theight: ${ railHeight }px;\n\tpointer-events: none;\n\tdisplay: block;\n\tposition: absolute;\n\tmargin-top: ${ ( rangeHeightValue - railHeight ) / 2 }px;\n\ttop: 0;\n\n\t.is-marked & {\n\t\t@media not ( prefers-reduced-motion ) {\n\t\t\ttransition: width ease 0.1s;\n\t\t}\n\t}\n\n\t${ trackBackgroundColor };\n`;\n\nexport const MarksWrapper = styled.span`\n\tdisplay: block;\n\tpointer-events: none;\n\tposition: relative;\n\twidth: 100%;\n\tuser-select: none;\n\tmargin-top: 17px;\n`;\n\nexport const Mark = styled.span`\n\tposition: absolute;\n\tleft: 0;\n\ttop: -4px;\n\theight: 4px;\n\twidth: 2px;\n\ttransform: translateX( -50% );\n\tbackground-color: ${ COLORS.ui.background };\n\tz-index: 1;\n`;\n\nconst markLabelFill = ( { isFilled }: RangeMarkProps ) => {\n\treturn css( {\n\t\tcolor: isFilled ? COLORS.gray[ 700 ] : COLORS.gray[ 300 ],\n\t} );\n};\n\nexport const MarkLabel = styled.span`\n\tcolor: ${ COLORS.gray[ 300 ] };\n\tfont-size: 11px;\n\tposition: absolute;\n\ttop: 8px;\n\twhite-space: nowrap;\n\n\t${ rtl( { left: 0 } ) };\n\t${ rtl(\n\t\t{ transform: 'translateX( -50% )' },\n\t\t{ transform: 'translateX( 50% )' }\n\t) };\n\n\t${ markLabelFill };\n`;\n\nconst thumbColor = ( { disabled }: ThumbProps ) =>\n\tdisabled\n\t\t? css`\n\t\t\t\tbackground-color: ${ COLORS.gray[ 400 ] };\n\t\t  `\n\t\t: css`\n\t\t\t\tbackground-color: ${ COLORS.theme.accent };\n\t\t  `;\n\nexport const ThumbWrapper = styled.span`\n\talign-items: center;\n\tdisplay: flex;\n\theight: ${ thumbSize }px;\n\tjustify-content: center;\n\tmargin-top: ${ ( rangeHeightValue - thumbSize ) / 2 }px;\n\toutline: 0;\n\tpointer-events: none;\n\tposition: absolute;\n\ttop: 0;\n\tuser-select: none;\n\twidth: ${ thumbSize }px;\n\tborder-radius: ${ CONFIG.radiusRound };\n\tz-index: 3;\n\n\t.is-marked & {\n\t\t@media not ( prefers-reduced-motion ) {\n\t\t\ttransition: left ease 0.1s;\n\t\t}\n\t}\n\n\t${ thumbColor };\n\t${ rtl( { marginLeft: -10 } ) };\n\t${ rtl(\n\t\t{ transform: 'translateX( 4.5px )' },\n\t\t{ transform: 'translateX( -4.5px )' }\n\t) };\n`;\n\nconst thumbFocus = ( { isFocused }: ThumbProps ) => {\n\treturn isFocused\n\t\t? css`\n\t\t\t\t&::before {\n\t\t\t\t\tcontent: ' ';\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tbackground-color: ${ COLORS.theme.accent };\n\t\t\t\t\topacity: 0.4;\n\t\t\t\t\tborder-radius: ${ CONFIG.radiusRound };\n\t\t\t\t\theight: ${ thumbSize + 8 }px;\n\t\t\t\t\twidth: ${ thumbSize + 8 }px;\n\t\t\t\t\ttop: -4px;\n\t\t\t\t\tleft: -4px;\n\t\t\t\t}\n\t\t  `\n\t\t: '';\n};\n\nexport const Thumb = styled.span< ThumbProps >`\n\talign-items: center;\n\tborder-radius: ${ CONFIG.radiusRound };\n\theight: 100%;\n\toutline: 0;\n\tposition: absolute;\n\tuser-select: none;\n\twidth: 100%;\n\tbox-shadow: ${ CONFIG.elevationXSmall };\n\n\t${ thumbColor };\n\t${ thumbFocus };\n`;\n\nexport const InputRange = styled.input`\n\tbox-sizing: border-box;\n\tcursor: pointer;\n\tdisplay: block;\n\theight: 100%;\n\tleft: 0;\n\tmargin: 0 -${ thumbSize / 2 }px;\n\topacity: 0;\n\toutline: none;\n\tposition: absolute;\n\tright: 0;\n\ttop: 0;\n\twidth: calc( 100% + ${ thumbSize }px );\n`;\n\nconst tooltipShow = ( { show }: TooltipProps ) => {\n\treturn css`\n\t\tdisplay: ${ show ? 'inline-block' : 'none' };\n\t\topacity: ${ show ? 1 : 0 };\n\n\t\t@media not ( prefers-reduced-motion ) {\n\t\t\ttransition:\n\t\t\t\topacity 120ms ease,\n\t\t\t\tdisplay 120ms ease allow-discrete;\n\t\t}\n\n\t\t@starting-style {\n\t\t\topacity: 0;\n\t\t}\n\t`;\n};\n\nconst tooltipPosition = ( { position }: TooltipProps ) => {\n\tconst isBottom = position === 'bottom';\n\n\tif ( isBottom ) {\n\t\treturn css`\n\t\t\tbottom: -80%;\n\t\t`;\n\t}\n\n\treturn css`\n\t\ttop: -80%;\n\t`;\n};\n\nexport const Tooltip = styled.span< TooltipProps >`\n\tbackground: rgba( 0, 0, 0, 0.8 );\n\tborder-radius: ${ CONFIG.radiusSmall };\n\tcolor: white;\n\tfont-size: 12px;\n\tmin-width: 32px;\n\tpadding: 4px 8px;\n\tpointer-events: none;\n\tposition: absolute;\n\ttext-align: center;\n\tuser-select: none;\n\tline-height: 1.4;\n\n\t${ tooltipShow };\n\n\t${ tooltipPosition };\n\t${ rtl(\n\t\t{ transform: 'translateX(-50%)' },\n\t\t{ transform: 'translateX(50%)' }\n\t) }\n`;\n\n// @todo Refactor RangeControl with latest HStack configuration\n// @see: packages/components/src/h-stack\nexport const InputNumber = styled( NumberControl )`\n\tdisplay: inline-block;\n\tfont-size: 13px;\n\tmargin-top: 0;\n\n\tinput[type='number']& {\n\t\t${ rangeHeight };\n\t}\n\n\t${ rtl( { marginLeft: `${ space( 4 ) } !important` } ) }\n`;\n\nexport const ActionRightWrapper = styled.span`\n\tdisplay: block;\n\tmargin-top: 0;\n\n\tbutton,\n\tbutton.is-small {\n\t\tmargin-left: 0;\n\t\t${ rangeHeight };\n\t}\n\n\t${ rtl( { marginLeft: 8 } ) }\n`;\n"],"mappings":"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","ignoreList":[]}

package/build/select-control/index.js

@@ -13,6 +13,7 @@ var _baseControl = _interopRequireDefault(require("../base-control"));
 var _selectControlStyles = require("./styles/select-control-styles");
 var _chevronDown = _interopRequireDefault(require("./chevron-down"));
 var _useDeprecatedProps = require("../utils/use-deprecated-props");
+var _deprecated36pxSize = require("../utils/deprecated-36px-size");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * External dependencies
@@ -68,6 +69,7 @@ function UnforwardedSelectControl(props, ref) {
     variant = 'default',
     __next40pxDefaultSize = false,
     __nextHasNoMarginBottom = false,
+    __shouldNotWarnDeprecated36pxSize,
     ...restProps
   } = (0, _useDeprecatedProps.useDeprecated36pxDefaultSizeProp)(props);
   const id = useUniqueId(idProp);
@@ -95,6 +97,12 @@ function UnforwardedSelectControl(props, ref) {
     });
   };
   const classes = (0, _clsx.default)('components-select-control', className);
+  (0, _deprecated36pxSize.maybeWarnDeprecated36pxSize)({
+    componentName: 'SelectControl',
+    __next40pxDefaultSize,
+    size,
+    __shouldNotWarnDeprecated36pxSize
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_baseControl.default, {
     help: help,
     id: id,
@@ -148,6 +156,7 @@ function UnforwardedSelectControl(props, ref) {
  *
  *   return (
  *     <SelectControl
+ *       __next40pxDefaultSize
  *       __nextHasNoMarginBottom
  *       label="Size"
  *       value={ size }

package/build/select-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_compose","_element","_baseControl","_selectControlStyles","_chevronDown","_useDeprecatedProps","_jsxRuntime","useUniqueId","idProp","instanceId","useInstanceId","SelectControl","id","SelectOptions","options","map","label","value","optionProps","index","key","jsx","children","UnforwardedSelectControl","props","ref","className","disabled","help","hideLabelFromVision","multiple","onChange","size","valueProp","labelPosition","prefix","suffix","variant","__next40pxDefaultSize","__nextHasNoMarginBottom","restProps","useDeprecated36pxDefaultSizeProp","helpId","undefined","length","handleOnChange","event","selectedOptions","Array","from","target","filter","selected","newValues","classes","clsx","default","__associatedWPComponentName","StyledInputBase","isBorderless","__unstableInputWidth","Select","selectSize","exports","forwardRef","_default"],"sources":["@wordpress/components/src/select-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport { Select, StyledInputBase } from './styles/select-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport type { SelectControlProps } from './types';\nimport SelectControlChevronDown from './chevron-down';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( SelectControl );\n\tconst id = `inspector-select-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nfunction SelectOptions( {\n\toptions,\n}: {\n\toptions: NonNullable< SelectControlProps[ 'options' ] >;\n} ) {\n\treturn options.map( ( { id, label, value, ...optionProps }, index ) => {\n\t\tconst key = id || `${ label }-${ value }-${ index }`;\n\n\t\treturn (\n\t\t\t<option key={ key } value={ value } { ...optionProps }>\n\t\t\t\t{ label }\n\t\t\t</option>\n\t\t);\n\t} );\n}\n\nfunction UnforwardedSelectControl< V extends string >(\n\tprops: WordPressComponentProps< SelectControlProps< V >, 'select', false >,\n\tref: React.ForwardedRef< HTMLSelectElement >\n) {\n\tconst {\n\t\tclassName,\n\t\tdisabled = false,\n\t\thelp,\n\t\thideLabelFromVision,\n\t\tid: idProp,\n\t\tlabel,\n\t\tmultiple = false,\n\t\tonChange,\n\t\toptions = [],\n\t\tsize = 'default',\n\t\tvalue: valueProp,\n\t\tlabelPosition = 'top',\n\t\tchildren,\n\t\tprefix,\n\t\tsuffix,\n\t\tvariant = 'default',\n\t\t__next40pxDefaultSize = false,\n\t\t__nextHasNoMarginBottom = false,\n\t\t...restProps\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\tconst id = useUniqueId( idProp );\n\tconst helpId = help ? `${ id }__help` : undefined;\n\n\t// Disable reason: A select with an onchange throws a warning.\n\tif ( ! options?.length && ! children ) {\n\t\treturn null;\n\t}\n\n\tconst handleOnChange = (\n\t\tevent: React.ChangeEvent< HTMLSelectElement >\n\t) => {\n\t\tif ( props.multiple ) {\n\t\t\tconst selectedOptions = Array.from( event.target.options ).filter(\n\t\t\t\t( { selected } ) => selected\n\t\t\t);\n\t\t\tconst newValues = selectedOptions.map(\n\t\t\t\t( { value } ) => value as V\n\t\t\t);\n\t\t\tprops.onChange?.( newValues, { event } );\n\t\t\treturn;\n\t\t}\n\n\t\tprops.onChange?.( event.target.value as V, { event } );\n\t};\n\n\tconst classes = clsx( 'components-select-control', className );\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\tid={ id }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t__associatedWPComponentName=\"SelectControl\"\n\t\t>\n\t\t\t<StyledInputBase\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tid={ id }\n\t\t\t\tisBorderless={ variant === 'minimal' }\n\t\t\t\tlabel={ label }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={\n\t\t\t\t\tsuffix || ( ! multiple && <SelectControlChevronDown /> )\n\t\t\t\t}\n\t\t\t\tprefix={ prefix }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\t__unstableInputWidth={\n\t\t\t\t\tvariant === 'minimal' ? 'auto' : undefined\n\t\t\t\t}\n\t\t\t\tvariant={ variant }\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t>\n\t\t\t\t<Select\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\taria-describedby={ helpId }\n\t\t\t\t\tclassName=\"components-select-control__input\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\tonChange={ handleOnChange }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\tvalue={ valueProp }\n\t\t\t\t\tvariant={ variant }\n\t\t\t\t>\n\t\t\t\t\t{ children || <SelectOptions options={ options } /> }\n\t\t\t\t</Select>\n\t\t\t</StyledInputBase>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `SelectControl` allows users to select from a single or multiple option menu.\n * It functions as a wrapper around the browser's native `<select>` element.\n *\n * ```jsx\n * import { SelectControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MySelectControl = () => {\n *   const [ size, setSize ] = useState( '50%' );\n *\n *   return (\n *     <SelectControl\n *       __nextHasNoMarginBottom\n *       label=\"Size\"\n *       value={ size }\n *       options={ [\n *         { label: 'Big', value: '100%' },\n *         { label: 'Medium', value: '50%' },\n *         { label: 'Small', value: '25%' },\n *       ] }\n *       onChange={ setSize }\n *     />\n *   );\n * };\n * ```\n */\nexport const SelectControl = forwardRef( UnforwardedSelectControl ) as <\n\tV extends string,\n>(\n\tprops: WordPressComponentProps<\n\t\tSelectControlProps< V >,\n\t\t'select',\n\t\tfalse\n\t> & { ref?: React.Ref< HTMLSelectElement > }\n) => React.JSX.Element | null;\n\nexport default SelectControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_compose","_element","_baseControl","_selectControlStyles","_chevronDown","_useDeprecatedProps","_deprecated36pxSize","_jsxRuntime","useUniqueId","idProp","instanceId","useInstanceId","SelectControl","id","SelectOptions","options","map","label","value","optionProps","index","key","jsx","children","UnforwardedSelectControl","props","ref","className","disabled","help","hideLabelFromVision","multiple","onChange","size","valueProp","labelPosition","prefix","suffix","variant","__next40pxDefaultSize","__nextHasNoMarginBottom","__shouldNotWarnDeprecated36pxSize","restProps","useDeprecated36pxDefaultSizeProp","helpId","undefined","length","handleOnChange","event","selectedOptions","Array","from","target","filter","selected","newValues","classes","clsx","maybeWarnDeprecated36pxSize","componentName","default","__associatedWPComponentName","StyledInputBase","isBorderless","__unstableInputWidth","Select","selectSize","exports","forwardRef","_default"],"sources":["@wordpress/components/src/select-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport { Select, StyledInputBase } from './styles/select-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport type { SelectControlProps } from './types';\nimport SelectControlChevronDown from './chevron-down';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( SelectControl );\n\tconst id = `inspector-select-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nfunction SelectOptions( {\n\toptions,\n}: {\n\toptions: NonNullable< SelectControlProps[ 'options' ] >;\n} ) {\n\treturn options.map( ( { id, label, value, ...optionProps }, index ) => {\n\t\tconst key = id || `${ label }-${ value }-${ index }`;\n\n\t\treturn (\n\t\t\t<option key={ key } value={ value } { ...optionProps }>\n\t\t\t\t{ label }\n\t\t\t</option>\n\t\t);\n\t} );\n}\n\nfunction UnforwardedSelectControl< V extends string >(\n\tprops: WordPressComponentProps< SelectControlProps< V >, 'select', false >,\n\tref: React.ForwardedRef< HTMLSelectElement >\n) {\n\tconst {\n\t\tclassName,\n\t\tdisabled = false,\n\t\thelp,\n\t\thideLabelFromVision,\n\t\tid: idProp,\n\t\tlabel,\n\t\tmultiple = false,\n\t\tonChange,\n\t\toptions = [],\n\t\tsize = 'default',\n\t\tvalue: valueProp,\n\t\tlabelPosition = 'top',\n\t\tchildren,\n\t\tprefix,\n\t\tsuffix,\n\t\tvariant = 'default',\n\t\t__next40pxDefaultSize = false,\n\t\t__nextHasNoMarginBottom = false,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\t...restProps\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\tconst id = useUniqueId( idProp );\n\tconst helpId = help ? `${ id }__help` : undefined;\n\n\t// Disable reason: A select with an onchange throws a warning.\n\tif ( ! options?.length && ! children ) {\n\t\treturn null;\n\t}\n\n\tconst handleOnChange = (\n\t\tevent: React.ChangeEvent< HTMLSelectElement >\n\t) => {\n\t\tif ( props.multiple ) {\n\t\t\tconst selectedOptions = Array.from( event.target.options ).filter(\n\t\t\t\t( { selected } ) => selected\n\t\t\t);\n\t\t\tconst newValues = selectedOptions.map(\n\t\t\t\t( { value } ) => value as V\n\t\t\t);\n\t\t\tprops.onChange?.( newValues, { event } );\n\t\t\treturn;\n\t\t}\n\n\t\tprops.onChange?.( event.target.value as V, { event } );\n\t};\n\n\tconst classes = clsx( 'components-select-control', className );\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'SelectControl',\n\t\t__next40pxDefaultSize,\n\t\tsize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t} );\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\tid={ id }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t__associatedWPComponentName=\"SelectControl\"\n\t\t>\n\t\t\t<StyledInputBase\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tid={ id }\n\t\t\t\tisBorderless={ variant === 'minimal' }\n\t\t\t\tlabel={ label }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={\n\t\t\t\t\tsuffix || ( ! multiple && <SelectControlChevronDown /> )\n\t\t\t\t}\n\t\t\t\tprefix={ prefix }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\t__unstableInputWidth={\n\t\t\t\t\tvariant === 'minimal' ? 'auto' : undefined\n\t\t\t\t}\n\t\t\t\tvariant={ variant }\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t>\n\t\t\t\t<Select\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\taria-describedby={ helpId }\n\t\t\t\t\tclassName=\"components-select-control__input\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\tonChange={ handleOnChange }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\tvalue={ valueProp }\n\t\t\t\t\tvariant={ variant }\n\t\t\t\t>\n\t\t\t\t\t{ children || <SelectOptions options={ options } /> }\n\t\t\t\t</Select>\n\t\t\t</StyledInputBase>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `SelectControl` allows users to select from a single or multiple option menu.\n * It functions as a wrapper around the browser's native `<select>` element.\n *\n * ```jsx\n * import { SelectControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MySelectControl = () => {\n *   const [ size, setSize ] = useState( '50%' );\n *\n *   return (\n *     <SelectControl\n *       __next40pxDefaultSize\n *       __nextHasNoMarginBottom\n *       label=\"Size\"\n *       value={ size }\n *       options={ [\n *         { label: 'Big', value: '100%' },\n *         { label: 'Medium', value: '50%' },\n *         { label: 'Small', value: '25%' },\n *       ] }\n *       onChange={ setSize }\n *     />\n *   );\n * };\n * ```\n */\nexport const SelectControl = forwardRef( UnforwardedSelectControl ) as <\n\tV extends string,\n>(\n\tprops: WordPressComponentProps<\n\t\tSelectControlProps< V >,\n\t\t'select',\n\t\tfalse\n\t> & { ref?: React.Ref< HTMLSelectElement > }\n) => React.JSX.Element | null;\n\nexport default SelectControl;\n"],"mappings":"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","ignoreList":[]}

package/build/select-control/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/select-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { InputBaseProps } from '../input-control/types';\nimport type { BaseControlProps } from '../base-control/types';\n\ntype SelectControlBaseProps< V extends string > = Pick<\n\tInputBaseProps,\n\t| '__next36pxDefaultSize'\n\t| '__next40pxDefaultSize'\n\t| 'disabled'\n\t| 'hideLabelFromVision'\n\t| 'label'\n\t| 'labelPosition'\n\t| 'prefix'\n\t| 'size'\n\t| 'suffix'\n> &\n\tPick< BaseControlProps, 'help' | '__nextHasNoMarginBottom' > & {\n\t\t/**\n\t\t * An array of option property objects to be rendered,\n\t\t * each with a `label` and `value` property, as well as any other\n\t\t * `<option>` attributes.\n\t\t */\n\t\toptions?: readonly ( {\n\t\t\t/**\n\t\t\t * The label to be shown to the user.\n\t\t\t */\n\t\t\tlabel: string;\n\t\t\t/**\n\t\t\t * The internal value used to choose the selected value.\n\t\t\t * This is also the value passed to `onChange` when the option is selected.\n\t\t\t */\n\t\t\tvalue: V;\n\t\t} & Omit<\n\t\t\tReact.OptionHTMLAttributes< HTMLOptionElement >,\n\t\t\t'label' | 'value'\n\t\t> )[];\n\t\t/**\n\t\t * As an alternative to the `options` prop, `optgroup`s and `options` can be\n\t\t * passed in as `children` for more customizability.\n\t\t */\n\t\tchildren?: ReactNode;\n\t\t/**\n\t\t * The style variant of the control.\n\t\t *\n\t\t * @default 'default'\n\t\t */\n\t\tvariant?: 'default' | 'minimal';\n\t};\n\nexport type SelectControlSingleSelectionProps< V extends string = string > =\n\tSelectControlBaseProps< V > & {\n\t\t/**\n\t\t * If this property is added, multiple values can be selected. The `value` passed should be an array.\n\t\t *\n\t\t * In most cases, it is preferable to use the `FormTokenField` or `CheckboxControl` components instead.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tmultiple?: false;\n\t\t/**\n\t\t * The value of the selected option.\n\t\t *\n\t\t * If `multiple` is true, the `value` should be an array with the values of the selected options.\n\t\t */\n\t\tvalue?: NoInfer< V >;\n\t\t/**\n\t\t * A function that receives the value of the new option that is being selected as input.\n\t\t *\n\t\t * If `multiple` is `true`, the value received is an array of the selected value.\n\t\t * Otherwise, the value received is a single value with the new selected value.\n\t\t */\n\t\tonChange?: (\n\t\t\tvalue: NoInfer< V >,\n\t\t\textra?: { event?: ChangeEvent< HTMLSelectElement > }\n\t\t) => void;\n\t};\n\nexport type SelectControlMultipleSelectionProps< V extends string > =\n\tSelectControlBaseProps< V > & {\n\t\t/**\n\t\t * If this property is added, multiple values can be selected. The `value` passed should be an array.\n\t\t *\n\t\t * In most cases, it is preferable to use the `FormTokenField` or `CheckboxControl` components instead.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tmultiple: true;\n\t\t/**\n\t\t * The value of the selected option.\n\t\t *\n\t\t * If `multiple` is true, the `value` should be an array with the values of the selected options.\n\t\t */\n\t\tvalue?: NoInfer< V >[];\n\t\t/**\n\t\t * A function that receives the value of the new option that is being selected as input.\n\t\t *\n\t\t * If `multiple` is `true`, the value received is an array of the selected value.\n\t\t * Otherwise, the value received is a single value with the new selected value.\n\t\t */\n\t\tonChange?: (\n\t\t\tvalue: NoInfer< V >[],\n\t\t\textra?: { event?: ChangeEvent< HTMLSelectElement > }\n\t\t) => void;\n\t};\n\nexport type SelectControlProps< V extends string = string > =\n\t| SelectControlSingleSelectionProps< V >\n\t| SelectControlMultipleSelectionProps< V >;\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/select-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { InputBaseProps } from '../input-control/types';\nimport type { BaseControlProps } from '../base-control/types';\n\ntype SelectControlBaseProps< V extends string > = Pick<\n\tInputBaseProps,\n\t| '__next36pxDefaultSize'\n\t| '__next40pxDefaultSize'\n\t| '__shouldNotWarnDeprecated36pxSize'\n\t| 'disabled'\n\t| 'hideLabelFromVision'\n\t| 'label'\n\t| 'labelPosition'\n\t| 'prefix'\n\t| 'size'\n\t| 'suffix'\n> &\n\tPick< BaseControlProps, 'help' | '__nextHasNoMarginBottom' > & {\n\t\t/**\n\t\t * An array of option property objects to be rendered,\n\t\t * each with a `label` and `value` property, as well as any other\n\t\t * `<option>` attributes.\n\t\t */\n\t\toptions?: readonly ( {\n\t\t\t/**\n\t\t\t * The label to be shown to the user.\n\t\t\t */\n\t\t\tlabel: string;\n\t\t\t/**\n\t\t\t * The internal value used to choose the selected value.\n\t\t\t * This is also the value passed to `onChange` when the option is selected.\n\t\t\t */\n\t\t\tvalue: V;\n\t\t} & Omit<\n\t\t\tReact.OptionHTMLAttributes< HTMLOptionElement >,\n\t\t\t'label' | 'value'\n\t\t> )[];\n\t\t/**\n\t\t * As an alternative to the `options` prop, `optgroup`s and `options` can be\n\t\t * passed in as `children` for more customizability.\n\t\t */\n\t\tchildren?: ReactNode;\n\t\t/**\n\t\t * The style variant of the control.\n\t\t *\n\t\t * @default 'default'\n\t\t */\n\t\tvariant?: 'default' | 'minimal';\n\t};\n\nexport type SelectControlSingleSelectionProps< V extends string = string > =\n\tSelectControlBaseProps< V > & {\n\t\t/**\n\t\t * If this property is added, multiple values can be selected. The `value` passed should be an array.\n\t\t *\n\t\t * In most cases, it is preferable to use the `FormTokenField` or `CheckboxControl` components instead.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tmultiple?: false;\n\t\t/**\n\t\t * The value of the selected option.\n\t\t *\n\t\t * If `multiple` is true, the `value` should be an array with the values of the selected options.\n\t\t */\n\t\tvalue?: NoInfer< V >;\n\t\t/**\n\t\t * A function that receives the value of the new option that is being selected as input.\n\t\t *\n\t\t * If `multiple` is `true`, the value received is an array of the selected value.\n\t\t * Otherwise, the value received is a single value with the new selected value.\n\t\t */\n\t\tonChange?: (\n\t\t\tvalue: NoInfer< V >,\n\t\t\textra?: { event?: ChangeEvent< HTMLSelectElement > }\n\t\t) => void;\n\t};\n\nexport type SelectControlMultipleSelectionProps< V extends string > =\n\tSelectControlBaseProps< V > & {\n\t\t/**\n\t\t * If this property is added, multiple values can be selected. The `value` passed should be an array.\n\t\t *\n\t\t * In most cases, it is preferable to use the `FormTokenField` or `CheckboxControl` components instead.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tmultiple: true;\n\t\t/**\n\t\t * The value of the selected option.\n\t\t *\n\t\t * If `multiple` is true, the `value` should be an array with the values of the selected options.\n\t\t */\n\t\tvalue?: NoInfer< V >[];\n\t\t/**\n\t\t * A function that receives the value of the new option that is being selected as input.\n\t\t *\n\t\t * If `multiple` is `true`, the value received is an array of the selected value.\n\t\t * Otherwise, the value received is a single value with the new selected value.\n\t\t */\n\t\tonChange?: (\n\t\t\tvalue: NoInfer< V >[],\n\t\t\textra?: { event?: ChangeEvent< HTMLSelectElement > }\n\t\t) => void;\n\t};\n\nexport type SelectControlProps< V extends string = string > =\n\t| SelectControlSingleSelectionProps< V >\n\t| SelectControlMultipleSelectionProps< V >;\n"],"mappings":"","ignoreList":[]}

package/build/slot-fill/context.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.SlotFillContext = void 0;
+var _compose = require("@wordpress/compose");
 var _element = require("@wordpress/element");
 /**
  * WordPress dependencies
@@ -14,13 +15,13 @@ var _element = require("@wordpress/element");
  */
 
 const initialValue = {
+  slots: (0, _compose.observableMap)(),
+  fills: (0, _compose.observableMap)(),
   registerSlot: () => {},
   unregisterSlot: () => {},
   registerFill: () => {},
   unregisterFill: () => {},
-  getSlot: () => undefined,
-  getFills: () => [],
-  subscribe: () => () => {}
+  updateFill: () => {}
 };
 const SlotFillContext = exports.SlotFillContext = (0, _element.createContext)(initialValue);
 var _default = exports.default = SlotFillContext;

package/build/slot-fill/context.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","initialValue","registerSlot","unregisterSlot","registerFill","unregisterFill","getSlot","undefined","getFills","subscribe","SlotFillContext","exports","createContext","_default","default"],"sources":["@wordpress/components/src/slot-fill/context.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport type { BaseSlotFillContext } from './types';\n\nconst initialValue: BaseSlotFillContext = {\n\tregisterSlot: () => {},\n\tunregisterSlot: () => {},\n\tregisterFill: () => {},\n\tunregisterFill: () => {},\n\tgetSlot: () => undefined,\n\tgetFills: () => [],\n\tsubscribe: () => () => {},\n};\nexport const SlotFillContext = createContext( initialValue );\n\nexport default SlotFillContext;\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAEA;AACA;AACA;;AAGA,MAAMC,YAAiC,GAAG;EACzCC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,cAAc,EAAEA,CAAA,KAAM,CAAC,CAAC;EACxBC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,cAAc,EAAEA,CAAA,KAAM,CAAC,CAAC;EACxBC,OAAO,EAAEA,CAAA,KAAMC,SAAS;EACxBC,QAAQ,EAAEA,CAAA,KAAM,EAAE;EAClBC,SAAS,EAAEA,CAAA,KAAM,MAAM,CAAC;AACzB,CAAC;AACM,MAAMC,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,IAAAE,sBAAa,EAAEX,YAAa,CAAC;AAAC,IAAAY,QAAA,GAAAF,OAAA,CAAAG,OAAA,GAE9CJ,eAAe","ignoreList":[]}
+{"version":3,"names":["_compose","require","_element","initialValue","slots","observableMap","fills","registerSlot","unregisterSlot","registerFill","unregisterFill","updateFill","SlotFillContext","exports","createContext","_default","default"],"sources":["@wordpress/components/src/slot-fill/context.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { observableMap } from '@wordpress/compose';\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { BaseSlotFillContext } from './types';\n\nconst initialValue: BaseSlotFillContext = {\n\tslots: observableMap(),\n\tfills: observableMap(),\n\tregisterSlot: () => {},\n\tunregisterSlot: () => {},\n\tregisterFill: () => {},\n\tunregisterFill: () => {},\n\tupdateFill: () => {},\n};\nexport const SlotFillContext = createContext( initialValue );\n\nexport default SlotFillContext;\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAJA;AACA;AACA;;AAIA;AACA;AACA;;AAGA,MAAME,YAAiC,GAAG;EACzCC,KAAK,EAAE,IAAAC,sBAAa,EAAC,CAAC;EACtBC,KAAK,EAAE,IAAAD,sBAAa,EAAC,CAAC;EACtBE,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,cAAc,EAAEA,CAAA,KAAM,CAAC,CAAC;EACxBC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,cAAc,EAAEA,CAAA,KAAM,CAAC,CAAC;EACxBC,UAAU,EAAEA,CAAA,KAAM,CAAC;AACpB,CAAC;AACM,MAAMC,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,IAAAE,sBAAa,EAAEX,YAAa,CAAC;AAAC,IAAAY,QAAA,GAAAF,OAAA,CAAAG,OAAA,GAE9CJ,eAAe","ignoreList":[]}

package/build/slot-fill/fill.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = Fill;
 var _element = require("@wordpress/element");
 var _context = _interopRequireDefault(require("./context"));
-var _useSlot = _interopRequireDefault(require("./use-slot"));
 /**
  * WordPress dependencies
  */
@@ -21,23 +20,19 @@ function Fill({
   children
 }) {
   const registry = (0, _element.useContext)(_context.default);
-  const slot = (0, _useSlot.default)(name);
-  const ref = (0, _element.useRef)({
-    name,
-    children
-  });
+  const instanceRef = (0, _element.useRef)({});
+  const childrenRef = (0, _element.useRef)(children);
+  (0, _element.useLayoutEffect)(() => {
+    childrenRef.current = children;
+  }, [children]);
   (0, _element.useLayoutEffect)(() => {
-    const refValue = ref.current;
-    refValue.name = name;
-    registry.registerFill(name, refValue);
-    return () => registry.unregisterFill(name, refValue);
+    const instance = instanceRef.current;
+    registry.registerFill(name, instance, childrenRef.current);
+    return () => registry.unregisterFill(name, instance);
   }, [registry, name]);
   (0, _element.useLayoutEffect)(() => {
-    ref.current.children = children;
-    if (slot) {
-      slot.rerender();
-    }
-  }, [slot, children]);
+    registry.updateFill(name, instanceRef.current, childrenRef.current);
+  });
   return null;
 }
 //# sourceMappingURL=fill.js.map

package/build/slot-fill/fill.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_context","_interopRequireDefault","_useSlot","Fill","name","children","registry","useContext","SlotFillContext","slot","useSlot","ref","useRef","useLayoutEffect","refValue","current","registerFill","unregisterFill","rerender"],"sources":["@wordpress/components/src/slot-fill/fill.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport useSlot from './use-slot';\nimport type { FillComponentProps } from './types';\n\nexport default function Fill( { name, children }: FillComponentProps ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst slot = useSlot( name );\n\n\tconst ref = useRef( {\n\t\tname,\n\t\tchildren,\n\t} );\n\n\tuseLayoutEffect( () => {\n\t\tconst refValue = ref.current;\n\t\trefValue.name = name;\n\t\tregistry.registerFill( name, refValue );\n\t\treturn () => registry.unregisterFill( name, refValue );\n\t}, [ registry, name ] );\n\n\tuseLayoutEffect( () => {\n\t\tref.current.children = children;\n\t\tif ( slot ) {\n\t\t\tslot.rerender();\n\t\t}\n\t}, [ slot, children ] );\n\n\treturn null;\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAD,sBAAA,CAAAF,OAAA;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAKe,SAASI,IAAIA,CAAE;EAAEC,IAAI;EAAEC;AAA6B,CAAC,EAAG;EACtE,MAAMC,QAAQ,GAAG,IAAAC,mBAAU,EAAEC,gBAAgB,CAAC;EAC9C,MAAMC,IAAI,GAAG,IAAAC,gBAAO,EAAEN,IAAK,CAAC;EAE5B,MAAMO,GAAG,GAAG,IAAAC,eAAM,EAAE;IACnBR,IAAI;IACJC;EACD,CAAE,CAAC;EAEH,IAAAQ,wBAAe,EAAE,MAAM;IACtB,MAAMC,QAAQ,GAAGH,GAAG,CAACI,OAAO;IAC5BD,QAAQ,CAACV,IAAI,GAAGA,IAAI;IACpBE,QAAQ,CAACU,YAAY,CAAEZ,IAAI,EAAEU,QAAS,CAAC;IACvC,OAAO,MAAMR,QAAQ,CAACW,cAAc,CAAEb,IAAI,EAAEU,QAAS,CAAC;EACvD,CAAC,EAAE,CAAER,QAAQ,EAAEF,IAAI,CAAG,CAAC;EAEvB,IAAAS,wBAAe,EAAE,MAAM;IACtBF,GAAG,CAACI,OAAO,CAACV,QAAQ,GAAGA,QAAQ;IAC/B,IAAKI,IAAI,EAAG;MACXA,IAAI,CAACS,QAAQ,CAAC,CAAC;IAChB;EACD,CAAC,EAAE,CAAET,IAAI,EAAEJ,QAAQ,CAAG,CAAC;EAEvB,OAAO,IAAI;AACZ","ignoreList":[]}
+{"version":3,"names":["_element","require","_context","_interopRequireDefault","Fill","name","children","registry","useContext","SlotFillContext","instanceRef","useRef","childrenRef","useLayoutEffect","current","instance","registerFill","unregisterFill","updateFill"],"sources":["@wordpress/components/src/slot-fill/fill.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport type { FillComponentProps } from './types';\n\nexport default function Fill( { name, children }: FillComponentProps ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst instanceRef = useRef( {} );\n\tconst childrenRef = useRef( children );\n\n\tuseLayoutEffect( () => {\n\t\tchildrenRef.current = children;\n\t}, [ children ] );\n\n\tuseLayoutEffect( () => {\n\t\tconst instance = instanceRef.current;\n\t\tregistry.registerFill( name, instance, childrenRef.current );\n\t\treturn () => registry.unregisterFill( name, instance );\n\t}, [ registry, name ] );\n\n\tuseLayoutEffect( () => {\n\t\tregistry.updateFill( name, instanceRef.current, childrenRef.current );\n\t} );\n\n\treturn null;\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAIe,SAASG,IAAIA,CAAE;EAAEC,IAAI;EAAEC;AAA6B,CAAC,EAAG;EACtE,MAAMC,QAAQ,GAAG,IAAAC,mBAAU,EAAEC,gBAAgB,CAAC;EAC9C,MAAMC,WAAW,GAAG,IAAAC,eAAM,EAAE,CAAC,CAAE,CAAC;EAChC,MAAMC,WAAW,GAAG,IAAAD,eAAM,EAAEL,QAAS,CAAC;EAEtC,IAAAO,wBAAe,EAAE,MAAM;IACtBD,WAAW,CAACE,OAAO,GAAGR,QAAQ;EAC/B,CAAC,EAAE,CAAEA,QAAQ,CAAG,CAAC;EAEjB,IAAAO,wBAAe,EAAE,MAAM;IACtB,MAAME,QAAQ,GAAGL,WAAW,CAACI,OAAO;IACpCP,QAAQ,CAACS,YAAY,CAAEX,IAAI,EAAEU,QAAQ,EAAEH,WAAW,CAACE,OAAQ,CAAC;IAC5D,OAAO,MAAMP,QAAQ,CAACU,cAAc,CAAEZ,IAAI,EAAEU,QAAS,CAAC;EACvD,CAAC,EAAE,CAAER,QAAQ,EAAEF,IAAI,CAAG,CAAC;EAEvB,IAAAQ,wBAAe,EAAE,MAAM;IACtBN,QAAQ,CAACW,UAAU,CAAEb,IAAI,EAAEK,WAAW,CAACI,OAAO,EAAEF,WAAW,CAACE,OAAQ,CAAC;EACtE,CAAE,CAAC;EAEH,OAAO,IAAI;AACZ","ignoreList":[]}

package/build/slot-fill/provider.js

@@ -9,6 +9,7 @@ exports.SlotFillProvider = SlotFillProvider;
 exports.default = void 0;
 var _element = require("@wordpress/element");
 var _context = _interopRequireDefault(require("./context"));
+var _compose = require("@wordpress/compose");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
@@ -19,79 +20,64 @@ var _jsxRuntime = require("react/jsx-runtime");
  */
 
 function createSlotRegistry() {
-  const slots = {};
-  const fills = {};
-  let listeners = [];
-  function registerSlot(name, slot) {
-    const previousSlot = slots[name];
-    slots[name] = slot;
-    triggerListeners();
-
-    // Sometimes the fills are registered after the initial render of slot
-    // But before the registerSlot call, we need to rerender the slot.
-    forceUpdateSlot(name);
-
-    // If a new instance of a slot is being mounted while another with the
-    // same name exists, force its update _after_ the new slot has been
-    // assigned into the instance, such that its own rendering of children
-    // will be empty (the new Slot will subsume all fills for this name).
-    if (previousSlot) {
-      previousSlot.rerender();
-    }
-  }
-  function registerFill(name, instance) {
-    fills[name] = [...(fills[name] || []), instance];
-    forceUpdateSlot(name);
+  const slots = (0, _compose.observableMap)();
+  const fills = (0, _compose.observableMap)();
+  function registerSlot(name, instance) {
+    slots.set(name, instance);
   }
   function unregisterSlot(name, instance) {
     // If a previous instance of a Slot by this name unmounts, do nothing,
     // as the slot and its fills should only be removed for the current
     // known instance.
-    if (slots[name] !== instance) {
+    if (slots.get(name) !== instance) {
       return;
     }
-    delete slots[name];
-    triggerListeners();
+    slots.delete(name);
   }
-  function unregisterFill(name, instance) {
-    var _fills$name$filter;
-    fills[name] = (_fills$name$filter = fills[name]?.filter(fill => fill !== instance)) !== null && _fills$name$filter !== void 0 ? _fills$name$filter : [];
-    forceUpdateSlot(name);
-  }
-  function getSlot(name) {
-    return slots[name];
+  function registerFill(name, instance, children) {
+    fills.set(name, [...(fills.get(name) || []), {
+      instance,
+      children
+    }]);
   }
-  function getFills(name, slotInstance) {
-    // Fills should only be returned for the current instance of the slot
-    // in which they occupy.
-    if (slots[name] !== slotInstance) {
-      return [];
+  function unregisterFill(name, instance) {
+    const fillsForName = fills.get(name);
+    if (!fillsForName) {
+      return;
     }
-    return fills[name];
+    fills.set(name, fillsForName.filter(fill => fill.instance !== instance));
   }
-  function forceUpdateSlot(name) {
-    const slot = getSlot(name);
-    if (slot) {
-      slot.rerender();
+  function updateFill(name, instance, children) {
+    const fillsForName = fills.get(name);
+    if (!fillsForName) {
+      return;
     }
-  }
-  function triggerListeners() {
-    listeners.forEach(listener => listener());
-  }
-  function subscribe(listener) {
-    listeners.push(listener);
-    return () => {
-      listeners = listeners.filter(l => l !== listener);
-    };
+    const fillForInstance = fillsForName.find(f => f.instance === instance);
+    if (!fillForInstance) {
+      return;
+    }
+    if (fillForInstance.children === children) {
+      return;
+    }
+    fills.set(name, fillsForName.map(f => {
+      if (f.instance === instance) {
+        // Replace with new record with updated `children`.
+        return {
+          instance,
+          children
+        };
+      }
+      return f;
+    }));
   }
   return {
+    slots,
+    fills,
     registerSlot,
     unregisterSlot,
     registerFill,
     unregisterFill,
-    getSlot,
-    getFills,
-    subscribe
+    updateFill
   };
 }
 function SlotFillProvider({

package/build/slot-fill/provider.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_context","_interopRequireDefault","_jsxRuntime","createSlotRegistry","slots","fills","listeners","registerSlot","name","slot","previousSlot","triggerListeners","forceUpdateSlot","rerender","registerFill","instance","unregisterSlot","unregisterFill","_fills$name$filter","filter","fill","getSlot","getFills","slotInstance","forEach","listener","subscribe","push","l","SlotFillProvider","children","contextValue","useState","jsx","default","Provider","value","_default","exports"],"sources":["@wordpress/components/src/slot-fill/provider.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport type {\n\tFillComponentProps,\n\tBaseSlotFillContext,\n\tSlotFillProviderProps,\n\tSlotKey,\n\tRerenderable,\n} from './types';\n\nfunction createSlotRegistry(): BaseSlotFillContext {\n\tconst slots: Record< SlotKey, Rerenderable > = {};\n\tconst fills: Record< SlotKey, FillComponentProps[] > = {};\n\tlet listeners: Array< () => void > = [];\n\n\tfunction registerSlot( name: SlotKey, slot: Rerenderable ) {\n\t\tconst previousSlot = slots[ name ];\n\t\tslots[ name ] = slot;\n\t\ttriggerListeners();\n\n\t\t// Sometimes the fills are registered after the initial render of slot\n\t\t// But before the registerSlot call, we need to rerender the slot.\n\t\tforceUpdateSlot( name );\n\n\t\t// If a new instance of a slot is being mounted while another with the\n\t\t// same name exists, force its update _after_ the new slot has been\n\t\t// assigned into the instance, such that its own rendering of children\n\t\t// will be empty (the new Slot will subsume all fills for this name).\n\t\tif ( previousSlot ) {\n\t\t\tpreviousSlot.rerender();\n\t\t}\n\t}\n\n\tfunction registerFill( name: SlotKey, instance: FillComponentProps ) {\n\t\tfills[ name ] = [ ...( fills[ name ] || [] ), instance ];\n\t\tforceUpdateSlot( name );\n\t}\n\n\tfunction unregisterSlot( name: SlotKey, instance: Rerenderable ) {\n\t\t// If a previous instance of a Slot by this name unmounts, do nothing,\n\t\t// as the slot and its fills should only be removed for the current\n\t\t// known instance.\n\t\tif ( slots[ name ] !== instance ) {\n\t\t\treturn;\n\t\t}\n\n\t\tdelete slots[ name ];\n\t\ttriggerListeners();\n\t}\n\n\tfunction unregisterFill( name: SlotKey, instance: FillComponentProps ) {\n\t\tfills[ name ] =\n\t\t\tfills[ name ]?.filter( ( fill ) => fill !== instance ) ?? [];\n\t\tforceUpdateSlot( name );\n\t}\n\n\tfunction getSlot( name: SlotKey ): Rerenderable | undefined {\n\t\treturn slots[ name ];\n\t}\n\n\tfunction getFills(\n\t\tname: SlotKey,\n\t\tslotInstance: Rerenderable\n\t): FillComponentProps[] {\n\t\t// Fills should only be returned for the current instance of the slot\n\t\t// in which they occupy.\n\t\tif ( slots[ name ] !== slotInstance ) {\n\t\t\treturn [];\n\t\t}\n\t\treturn fills[ name ];\n\t}\n\n\tfunction forceUpdateSlot( name: SlotKey ) {\n\t\tconst slot = getSlot( name );\n\n\t\tif ( slot ) {\n\t\t\tslot.rerender();\n\t\t}\n\t}\n\n\tfunction triggerListeners() {\n\t\tlisteners.forEach( ( listener ) => listener() );\n\t}\n\n\tfunction subscribe( listener: () => void ) {\n\t\tlisteners.push( listener );\n\n\t\treturn () => {\n\t\t\tlisteners = listeners.filter( ( l ) => l !== listener );\n\t\t};\n\t}\n\n\treturn {\n\t\tregisterSlot,\n\t\tunregisterSlot,\n\t\tregisterFill,\n\t\tunregisterFill,\n\t\tgetSlot,\n\t\tgetFills,\n\t\tsubscribe,\n\t};\n}\n\nexport function SlotFillProvider( { children }: SlotFillProviderProps ) {\n\tconst [ contextValue ] = useState( createSlotRegistry );\n\treturn (\n\t\t<SlotFillContext.Provider value={ contextValue }>\n\t\t\t{ children }\n\t\t</SlotFillContext.Provider>\n\t);\n}\n\nexport default SlotFillProvider;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_element","require","_context","_interopRequireDefault","_compose","_jsxRuntime","createSlotRegistry","slots","observableMap","fills","registerSlot","name","instance","set","unregisterSlot","get","delete","registerFill","children","unregisterFill","fillsForName","filter","fill","updateFill","fillForInstance","find","f","map","SlotFillProvider","contextValue","useState","jsx","default","Provider","value","_default","exports"],"sources":["@wordpress/components/src/slot-fill/provider.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport type {\n\tFillInstance,\n\tFillChildren,\n\tBaseSlotInstance,\n\tBaseSlotFillContext,\n\tSlotFillProviderProps,\n\tSlotKey,\n} from './types';\nimport { observableMap } from '@wordpress/compose';\n\nfunction createSlotRegistry(): BaseSlotFillContext {\n\tconst slots = observableMap< SlotKey, BaseSlotInstance >();\n\tconst fills = observableMap<\n\t\tSlotKey,\n\t\t{ instance: FillInstance; children: FillChildren }[]\n\t>();\n\n\tfunction registerSlot( name: SlotKey, instance: BaseSlotInstance ) {\n\t\tslots.set( name, instance );\n\t}\n\n\tfunction unregisterSlot( name: SlotKey, instance: BaseSlotInstance ) {\n\t\t// If a previous instance of a Slot by this name unmounts, do nothing,\n\t\t// as the slot and its fills should only be removed for the current\n\t\t// known instance.\n\t\tif ( slots.get( name ) !== instance ) {\n\t\t\treturn;\n\t\t}\n\n\t\tslots.delete( name );\n\t}\n\n\tfunction registerFill(\n\t\tname: SlotKey,\n\t\tinstance: FillInstance,\n\t\tchildren: FillChildren\n\t) {\n\t\tfills.set( name, [\n\t\t\t...( fills.get( name ) || [] ),\n\t\t\t{ instance, children },\n\t\t] );\n\t}\n\n\tfunction unregisterFill( name: SlotKey, instance: FillInstance ) {\n\t\tconst fillsForName = fills.get( name );\n\t\tif ( ! fillsForName ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfills.set(\n\t\t\tname,\n\t\t\tfillsForName.filter( ( fill ) => fill.instance !== instance )\n\t\t);\n\t}\n\n\tfunction updateFill(\n\t\tname: SlotKey,\n\t\tinstance: FillInstance,\n\t\tchildren: FillChildren\n\t) {\n\t\tconst fillsForName = fills.get( name );\n\t\tif ( ! fillsForName ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst fillForInstance = fillsForName.find(\n\t\t\t( f ) => f.instance === instance\n\t\t);\n\t\tif ( ! fillForInstance ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( fillForInstance.children === children ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfills.set(\n\t\t\tname,\n\t\t\tfillsForName.map( ( f ) => {\n\t\t\t\tif ( f.instance === instance ) {\n\t\t\t\t\t// Replace with new record with updated `children`.\n\t\t\t\t\treturn { instance, children };\n\t\t\t\t}\n\n\t\t\t\treturn f;\n\t\t\t} )\n\t\t);\n\t}\n\n\treturn {\n\t\tslots,\n\t\tfills,\n\t\tregisterSlot,\n\t\tunregisterSlot,\n\t\tregisterFill,\n\t\tunregisterFill,\n\t\tupdateFill,\n\t};\n}\n\nexport function SlotFillProvider( { children }: SlotFillProviderProps ) {\n\tconst [ contextValue ] = useState( createSlotRegistry );\n\treturn (\n\t\t<SlotFillContext.Provider value={ contextValue }>\n\t\t\t{ children }\n\t\t</SlotFillContext.Provider>\n\t);\n}\n\nexport default SlotFillProvider;\n"],"mappings":";;;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AASA,IAAAG,QAAA,GAAAH,OAAA;AAAmD,IAAAI,WAAA,GAAAJ,OAAA;AAjBnD;AACA;AACA;;AAGA;AACA;AACA;;AAYA,SAASK,kBAAkBA,CAAA,EAAwB;EAClD,MAAMC,KAAK,GAAG,IAAAC,sBAAa,EAA8B,CAAC;EAC1D,MAAMC,KAAK,GAAG,IAAAD,sBAAa,EAGzB,CAAC;EAEH,SAASE,YAAYA,CAAEC,IAAa,EAAEC,QAA0B,EAAG;IAClEL,KAAK,CAACM,GAAG,CAAEF,IAAI,EAAEC,QAAS,CAAC;EAC5B;EAEA,SAASE,cAAcA,CAAEH,IAAa,EAAEC,QAA0B,EAAG;IACpE;IACA;IACA;IACA,IAAKL,KAAK,CAACQ,GAAG,CAAEJ,IAAK,CAAC,KAAKC,QAAQ,EAAG;MACrC;IACD;IAEAL,KAAK,CAACS,MAAM,CAAEL,IAAK,CAAC;EACrB;EAEA,SAASM,YAAYA,CACpBN,IAAa,EACbC,QAAsB,EACtBM,QAAsB,EACrB;IACDT,KAAK,CAACI,GAAG,CAAEF,IAAI,EAAE,CAChB,IAAKF,KAAK,CAACM,GAAG,CAAEJ,IAAK,CAAC,IAAI,EAAE,CAAE,EAC9B;MAAEC,QAAQ;MAAEM;IAAS,CAAC,CACrB,CAAC;EACJ;EAEA,SAASC,cAAcA,CAAER,IAAa,EAAEC,QAAsB,EAAG;IAChE,MAAMQ,YAAY,GAAGX,KAAK,CAACM,GAAG,CAAEJ,IAAK,CAAC;IACtC,IAAK,CAAES,YAAY,EAAG;MACrB;IACD;IAEAX,KAAK,CAACI,GAAG,CACRF,IAAI,EACJS,YAAY,CAACC,MAAM,CAAIC,IAAI,IAAMA,IAAI,CAACV,QAAQ,KAAKA,QAAS,CAC7D,CAAC;EACF;EAEA,SAASW,UAAUA,CAClBZ,IAAa,EACbC,QAAsB,EACtBM,QAAsB,EACrB;IACD,MAAME,YAAY,GAAGX,KAAK,CAACM,GAAG,CAAEJ,IAAK,CAAC;IACtC,IAAK,CAAES,YAAY,EAAG;MACrB;IACD;IAEA,MAAMI,eAAe,GAAGJ,YAAY,CAACK,IAAI,CACtCC,CAAC,IAAMA,CAAC,CAACd,QAAQ,KAAKA,QACzB,CAAC;IACD,IAAK,CAAEY,eAAe,EAAG;MACxB;IACD;IAEA,IAAKA,eAAe,CAACN,QAAQ,KAAKA,QAAQ,EAAG;MAC5C;IACD;IAEAT,KAAK,CAACI,GAAG,CACRF,IAAI,EACJS,YAAY,CAACO,GAAG,CAAID,CAAC,IAAM;MAC1B,IAAKA,CAAC,CAACd,QAAQ,KAAKA,QAAQ,EAAG;QAC9B;QACA,OAAO;UAAEA,QAAQ;UAAEM;QAAS,CAAC;MAC9B;MAEA,OAAOQ,CAAC;IACT,CAAE,CACH,CAAC;EACF;EAEA,OAAO;IACNnB,KAAK;IACLE,KAAK;IACLC,YAAY;IACZI,cAAc;IACdG,YAAY;IACZE,cAAc;IACdI;EACD,CAAC;AACF;AAEO,SAASK,gBAAgBA,CAAE;EAAEV;AAAgC,CAAC,EAAG;EACvE,MAAM,CAAEW,YAAY,CAAE,GAAG,IAAAC,iBAAQ,EAAExB,kBAAmB,CAAC;EACvD,oBACC,IAAAD,WAAA,CAAA0B,GAAA,EAAC7B,QAAA,CAAA8B,OAAe,CAACC,QAAQ;IAACC,KAAK,EAAGL,YAAc;IAAAX,QAAA,EAC7CA;EAAQ,CACe,CAAC;AAE7B;AAAC,IAAAiB,QAAA,GAAAC,OAAA,CAAAJ,OAAA,GAEcJ,gBAAgB","ignoreList":[]}

package/build/slot-fill/slot.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _compose = require("@wordpress/compose");
 var _element = require("@wordpress/element");
 var _context = _interopRequireDefault(require("./context"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -30,44 +31,51 @@ var _jsxRuntime = require("react/jsx-runtime");
 function isFunction(maybeFunc) {
   return typeof maybeFunc === 'function';
 }
+function addKeysToChildren(children) {
+  return _element.Children.map(children, (child, childIndex) => {
+    if (!child || typeof child === 'string') {
+      return child;
+    }
+    let childKey = childIndex;
+    if (typeof child === 'object' && 'key' in child && child?.key) {
+      childKey = child.key;
+    }
+    return (0, _element.cloneElement)(child, {
+      key: childKey
+    });
+  });
+}
 function Slot(props) {
-  var _registry$getFills;
+  var _useObservableValue;
   const registry = (0, _element.useContext)(_context.default);
-  const [, rerender] = (0, _element.useReducer)(() => [], []);
-  const ref = (0, _element.useRef)({
-    rerender
-  });
+  const instanceRef = (0, _element.useRef)({});
   const {
     name,
     children,
     fillProps = {}
   } = props;
-  (0, _element.useEffect)(() => {
-    const refValue = ref.current;
-    registry.registerSlot(name, refValue);
-    return () => registry.unregisterSlot(name, refValue);
+  (0, _element.useLayoutEffect)(() => {
+    const instance = instanceRef.current;
+    registry.registerSlot(name, instance);
+    return () => registry.unregisterSlot(name, instance);
   }, [registry, name]);
-  const fills = ((_registry$getFills = registry.getFills(name, ref.current)) !== null && _registry$getFills !== void 0 ? _registry$getFills : []).map(fill => {
+  let fills = (_useObservableValue = (0, _compose.useObservableValue)(registry.fills, name)) !== null && _useObservableValue !== void 0 ? _useObservableValue : [];
+  const currentSlot = (0, _compose.useObservableValue)(registry.slots, name);
+
+  // Fills should only be rendered in the currently registered instance of the slot.
+  if (currentSlot !== instanceRef.current) {
+    fills = [];
+  }
+  const renderedFills = fills.map(fill => {
     const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children;
-    return _element.Children.map(fillChildren, (child, childIndex) => {
-      if (!child || typeof child === 'string') {
-        return child;
-      }
-      let childKey = childIndex;
-      if (typeof child === 'object' && 'key' in child && child?.key) {
-        childKey = child.key;
-      }
-      return (0, _element.cloneElement)(child, {
-        key: childKey
-      });
-    });
+    return addKeysToChildren(fillChildren);
   }).filter(
   // In some cases fills are rendered only when some conditions apply.
   // This ensures that we only use non-empty fills when rendering, i.e.,
   // it allows us to render wrappers only when the fills are actually present.
   element => !(0, _element.isEmptyElement)(element));
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: isFunction(children) ? children(fills) : fills
+    children: isFunction(children) ? children(renderedFills) : renderedFills
   });
 }
 var _default = exports.default = Slot;

package/build/slot-fill/slot.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_context","_interopRequireDefault","_jsxRuntime","isFunction","maybeFunc","Slot","props","_registry$getFills","registry","useContext","SlotFillContext","rerender","useReducer","ref","useRef","name","children","fillProps","useEffect","refValue","current","registerSlot","unregisterSlot","fills","getFills","map","fill","fillChildren","Children","child","childIndex","childKey","key","cloneElement","filter","element","isEmptyElement","jsx","Fragment","_default","exports","default"],"sources":["@wordpress/components/src/slot-fill/slot.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement, ReactNode, Key } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseReducer,\n\tuseRef,\n\tChildren,\n\tcloneElement,\n\tisEmptyElement,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport type { SlotComponentProps } from './types';\n\n/**\n * Whether the argument is a function.\n *\n * @param maybeFunc The argument to check.\n * @return True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc: any ): maybeFunc is Function {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction Slot( props: Omit< SlotComponentProps, 'bubblesVirtually' > ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst [ , rerender ] = useReducer( () => [], [] );\n\tconst ref = useRef( { rerender } );\n\n\tconst { name, children, fillProps = {} } = props;\n\n\tuseEffect( () => {\n\t\tconst refValue = ref.current;\n\t\tregistry.registerSlot( name, refValue );\n\t\treturn () => registry.unregisterSlot( name, refValue );\n\t}, [ registry, name ] );\n\n\tconst fills: ReactNode[] = ( registry.getFills( name, ref.current ) ?? [] )\n\t\t.map( ( fill ) => {\n\t\t\tconst fillChildren = isFunction( fill.children )\n\t\t\t\t? fill.children( fillProps )\n\t\t\t\t: fill.children;\n\t\t\treturn Children.map( fillChildren, ( child, childIndex ) => {\n\t\t\t\tif ( ! child || typeof child === 'string' ) {\n\t\t\t\t\treturn child;\n\t\t\t\t}\n\t\t\t\tlet childKey: Key = childIndex;\n\t\t\t\tif (\n\t\t\t\t\ttypeof child === 'object' &&\n\t\t\t\t\t'key' in child &&\n\t\t\t\t\tchild?.key\n\t\t\t\t) {\n\t\t\t\t\tchildKey = child.key;\n\t\t\t\t}\n\n\t\t\t\treturn cloneElement( child as ReactElement, {\n\t\t\t\t\tkey: childKey,\n\t\t\t\t} );\n\t\t\t} );\n\t\t} )\n\t\t.filter(\n\t\t\t// In some cases fills are rendered only when some conditions apply.\n\t\t\t// This ensures that we only use non-empty fills when rendering, i.e.,\n\t\t\t// it allows us to render wrappers only when the fills are actually present.\n\t\t\t( element ) => ! isEmptyElement( element )\n\t\t);\n\n\treturn <>{ isFunction( children ) ? children( fills ) : fills }</>;\n}\n\nexport default Slot;\n"],"mappings":";;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAaA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAwC,IAAAG,WAAA,GAAAH,OAAA;AArBxC;AACA;AACA;;AAGA;AACA;AACA;;AAWA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA,SAASI,UAAUA,CAAEC,SAAc,EAA0B;EAC5D,OAAO,OAAOA,SAAS,KAAK,UAAU;AACvC;AAEA,SAASC,IAAIA,CAAEC,KAAqD,EAAG;EAAA,IAAAC,kBAAA;EACtE,MAAMC,QAAQ,GAAG,IAAAC,mBAAU,EAAEC,gBAAgB,CAAC;EAC9C,MAAM,GAAIC,QAAQ,CAAE,GAAG,IAAAC,mBAAU,EAAE,MAAM,EAAE,EAAE,EAAG,CAAC;EACjD,MAAMC,GAAG,GAAG,IAAAC,eAAM,EAAE;IAAEH;EAAS,CAAE,CAAC;EAElC,MAAM;IAAEI,IAAI;IAAEC,QAAQ;IAAEC,SAAS,GAAG,CAAC;EAAE,CAAC,GAAGX,KAAK;EAEhD,IAAAY,kBAAS,EAAE,MAAM;IAChB,MAAMC,QAAQ,GAAGN,GAAG,CAACO,OAAO;IAC5BZ,QAAQ,CAACa,YAAY,CAAEN,IAAI,EAAEI,QAAS,CAAC;IACvC,OAAO,MAAMX,QAAQ,CAACc,cAAc,CAAEP,IAAI,EAAEI,QAAS,CAAC;EACvD,CAAC,EAAE,CAAEX,QAAQ,EAAEO,IAAI,CAAG,CAAC;EAEvB,MAAMQ,KAAkB,GAAG,EAAAhB,kBAAA,GAAEC,QAAQ,CAACgB,QAAQ,CAAET,IAAI,EAAEF,GAAG,CAACO,OAAQ,CAAC,cAAAb,kBAAA,cAAAA,kBAAA,GAAI,EAAE,EACvEkB,GAAG,CAAIC,IAAI,IAAM;IACjB,MAAMC,YAAY,GAAGxB,UAAU,CAAEuB,IAAI,CAACV,QAAS,CAAC,GAC7CU,IAAI,CAACV,QAAQ,CAAEC,SAAU,CAAC,GAC1BS,IAAI,CAACV,QAAQ;IAChB,OAAOY,iBAAQ,CAACH,GAAG,CAAEE,YAAY,EAAE,CAAEE,KAAK,EAAEC,UAAU,KAAM;MAC3D,IAAK,CAAED,KAAK,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAG;QAC3C,OAAOA,KAAK;MACb;MACA,IAAIE,QAAa,GAAGD,UAAU;MAC9B,IACC,OAAOD,KAAK,KAAK,QAAQ,IACzB,KAAK,IAAIA,KAAK,IACdA,KAAK,EAAEG,GAAG,EACT;QACDD,QAAQ,GAAGF,KAAK,CAACG,GAAG;MACrB;MAEA,OAAO,IAAAC,qBAAY,EAAEJ,KAAK,EAAkB;QAC3CG,GAAG,EAAED;MACN,CAAE,CAAC;IACJ,CAAE,CAAC;EACJ,CAAE,CAAC,CACFG,MAAM;EACN;EACA;EACA;EACEC,OAAO,IAAM,CAAE,IAAAC,uBAAc,EAAED,OAAQ,CAC1C,CAAC;EAEF,oBAAO,IAAAjC,WAAA,CAAAmC,GAAA,EAAAnC,WAAA,CAAAoC,QAAA;IAAAtB,QAAA,EAAIb,UAAU,CAAEa,QAAS,CAAC,GAAGA,QAAQ,CAAEO,KAAM,CAAC,GAAGA;EAAK,CAAI,CAAC;AACnE;AAAC,IAAAgB,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEcpC,IAAI","ignoreList":[]}
+{"version":3,"names":["_compose","require","_element","_context","_interopRequireDefault","_jsxRuntime","isFunction","maybeFunc","addKeysToChildren","children","Children","map","child","childIndex","childKey","key","cloneElement","Slot","props","_useObservableValue","registry","useContext","SlotFillContext","instanceRef","useRef","name","fillProps","useLayoutEffect","instance","current","registerSlot","unregisterSlot","fills","useObservableValue","currentSlot","slots","renderedFills","fill","fillChildren","filter","element","isEmptyElement","jsx","Fragment","_default","exports","default"],"sources":["@wordpress/components/src/slot-fill/slot.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement, ReactNode, Key } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useObservableValue } from '@wordpress/compose';\nimport {\n\tuseContext,\n\tuseLayoutEffect,\n\tuseRef,\n\tChildren,\n\tcloneElement,\n\tisEmptyElement,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport type { SlotComponentProps } from './types';\n\n/**\n * Whether the argument is a function.\n *\n * @param maybeFunc The argument to check.\n * @return True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc: any ): maybeFunc is Function {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction addKeysToChildren( children: ReactNode ) {\n\treturn Children.map( children, ( child, childIndex ) => {\n\t\tif ( ! child || typeof child === 'string' ) {\n\t\t\treturn child;\n\t\t}\n\t\tlet childKey: Key = childIndex;\n\t\tif ( typeof child === 'object' && 'key' in child && child?.key ) {\n\t\t\tchildKey = child.key;\n\t\t}\n\n\t\treturn cloneElement( child as ReactElement, {\n\t\t\tkey: childKey,\n\t\t} );\n\t} );\n}\n\nfunction Slot( props: Omit< SlotComponentProps, 'bubblesVirtually' > ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst instanceRef = useRef( {} );\n\n\tconst { name, children, fillProps = {} } = props;\n\n\tuseLayoutEffect( () => {\n\t\tconst instance = instanceRef.current;\n\t\tregistry.registerSlot( name, instance );\n\t\treturn () => registry.unregisterSlot( name, instance );\n\t}, [ registry, name ] );\n\n\tlet fills = useObservableValue( registry.fills, name ) ?? [];\n\tconst currentSlot = useObservableValue( registry.slots, name );\n\n\t// Fills should only be rendered in the currently registered instance of the slot.\n\tif ( currentSlot !== instanceRef.current ) {\n\t\tfills = [];\n\t}\n\n\tconst renderedFills = fills\n\t\t.map( ( fill ) => {\n\t\t\tconst fillChildren = isFunction( fill.children )\n\t\t\t\t? fill.children( fillProps )\n\t\t\t\t: fill.children;\n\t\t\treturn addKeysToChildren( fillChildren );\n\t\t} )\n\t\t.filter(\n\t\t\t// In some cases fills are rendered only when some conditions apply.\n\t\t\t// This ensures that we only use non-empty fills when rendering, i.e.,\n\t\t\t// it allows us to render wrappers only when the fills are actually present.\n\t\t\t( element ) => ! isEmptyElement( element )\n\t\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ isFunction( children )\n\t\t\t\t? children( renderedFills )\n\t\t\t\t: renderedFills }\n\t\t</>\n\t);\n}\n\nexport default Slot;\n"],"mappings":";;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAYA,IAAAE,QAAA,GAAAC,sBAAA,CAAAH,OAAA;AAAwC,IAAAI,WAAA,GAAAJ,OAAA;AArBxC;AACA;AACA;;AAGA;AACA;AACA;;AAWA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA,SAASK,UAAUA,CAAEC,SAAc,EAA0B;EAC5D,OAAO,OAAOA,SAAS,KAAK,UAAU;AACvC;AAEA,SAASC,iBAAiBA,CAAEC,QAAmB,EAAG;EACjD,OAAOC,iBAAQ,CAACC,GAAG,CAAEF,QAAQ,EAAE,CAAEG,KAAK,EAAEC,UAAU,KAAM;IACvD,IAAK,CAAED,KAAK,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAG;MAC3C,OAAOA,KAAK;IACb;IACA,IAAIE,QAAa,GAAGD,UAAU;IAC9B,IAAK,OAAOD,KAAK,KAAK,QAAQ,IAAI,KAAK,IAAIA,KAAK,IAAIA,KAAK,EAAEG,GAAG,EAAG;MAChED,QAAQ,GAAGF,KAAK,CAACG,GAAG;IACrB;IAEA,OAAO,IAAAC,qBAAY,EAAEJ,KAAK,EAAkB;MAC3CG,GAAG,EAAED;IACN,CAAE,CAAC;EACJ,CAAE,CAAC;AACJ;AAEA,SAASG,IAAIA,CAAEC,KAAqD,EAAG;EAAA,IAAAC,mBAAA;EACtE,MAAMC,QAAQ,GAAG,IAAAC,mBAAU,EAAEC,gBAAgB,CAAC;EAC9C,MAAMC,WAAW,GAAG,IAAAC,eAAM,EAAE,CAAC,CAAE,CAAC;EAEhC,MAAM;IAAEC,IAAI;IAAEhB,QAAQ;IAAEiB,SAAS,GAAG,CAAC;EAAE,CAAC,GAAGR,KAAK;EAEhD,IAAAS,wBAAe,EAAE,MAAM;IACtB,MAAMC,QAAQ,GAAGL,WAAW,CAACM,OAAO;IACpCT,QAAQ,CAACU,YAAY,CAAEL,IAAI,EAAEG,QAAS,CAAC;IACvC,OAAO,MAAMR,QAAQ,CAACW,cAAc,CAAEN,IAAI,EAAEG,QAAS,CAAC;EACvD,CAAC,EAAE,CAAER,QAAQ,EAAEK,IAAI,CAAG,CAAC;EAEvB,IAAIO,KAAK,IAAAb,mBAAA,GAAG,IAAAc,2BAAkB,EAAEb,QAAQ,CAACY,KAAK,EAAEP,IAAK,CAAC,cAAAN,mBAAA,cAAAA,mBAAA,GAAI,EAAE;EAC5D,MAAMe,WAAW,GAAG,IAAAD,2BAAkB,EAAEb,QAAQ,CAACe,KAAK,EAAEV,IAAK,CAAC;;EAE9D;EACA,IAAKS,WAAW,KAAKX,WAAW,CAACM,OAAO,EAAG;IAC1CG,KAAK,GAAG,EAAE;EACX;EAEA,MAAMI,aAAa,GAAGJ,KAAK,CACzBrB,GAAG,CAAI0B,IAAI,IAAM;IACjB,MAAMC,YAAY,GAAGhC,UAAU,CAAE+B,IAAI,CAAC5B,QAAS,CAAC,GAC7C4B,IAAI,CAAC5B,QAAQ,CAAEiB,SAAU,CAAC,GAC1BW,IAAI,CAAC5B,QAAQ;IAChB,OAAOD,iBAAiB,CAAE8B,YAAa,CAAC;EACzC,CAAE,CAAC,CACFC,MAAM;EACN;EACA;EACA;EACEC,OAAO,IAAM,CAAE,IAAAC,uBAAc,EAAED,OAAQ,CAC1C,CAAC;EAEF,oBACC,IAAAnC,WAAA,CAAAqC,GAAA,EAAArC,WAAA,CAAAsC,QAAA;IAAAlC,QAAA,EACGH,UAAU,CAAEG,QAAS,CAAC,GACrBA,QAAQ,CAAE2B,aAAc,CAAC,GACzBA;EAAa,CACf,CAAC;AAEL;AAAC,IAAAQ,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc7B,IAAI","ignoreList":[]}