@wordpress/components 29.0.0 → 29.1.0

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

@@ -1 +1 @@
-{"version":3,"names":["css","NumberControl","COLORS","rtl","CONFIG","space","rangeHeightValue","railHeight","rangeHeight","height","minHeight","process","env","NODE_ENV","thumbSize","deprecatedHeight","__next40pxDefaultSize","Root","_styled","target","label","wrapperColor","color","ui","borderFocus","wrapperMargin","marks","__nextHasNoMarginBottom","marginBottom","undefined","Wrapper","shouldForwardProp","prop","includes","BeforeIconWrapper","marginRight","AfterIconWrapper","marginLeft","railBackgroundColor","disabled","railColor","background","backgroundDisabled","Rail","gray","radiusFull","trackBackgroundColor","trackColor","Track","MarksWrapper","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","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","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":";;AAAA;AACA;AACA;AACA,SAASA,GAAG,QAAQ,gBAAgB;AAGpC;AACA;AACA;AACA,OAAOC,aAAa,MAAM,sBAAsB;AAChD,SAASC,MAAM,EAAEC,GAAG,EAAEC,MAAM,QAAQ,aAAa;AACjD,SAASC,KAAK,QAAQ,mBAAmB;AAYzC,MAAMC,gBAAgB,GAAG,EAAE;AAC3B,MAAMC,UAAU,GAAG,CAAC;AACpB,MAAMC,WAAW,GAAGA,CAAA,kBACnBR,GAAG,CAAE;EAAES,MAAM,EAAEH,gBAAgB;EAAEI,SAAS,EAAEJ;AAAiB,CAAC,EAAAK,OAAA,CAAAC,GAAA,CAAAC,QAAA,gDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;AACjE,MAAMC,SAAS,GAAG,EAAE;AAEpB,MAAMC,gBAAgB,GAAGA,CAAE;EAC1BC;AACmD,CAAC,KACpD,CAAEA,qBAAqB,iBAAIhB,GAAG,CAAE;EAAEU,SAAS,EAAEJ;AAAiB,CAAC,EAAAK,OAAA,CAAAC,GAAA,CAAAC,QAAA,qDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;AAGlE,OAAO,MAAMI,IAAI,gBAAAC,OAAA,QAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,mLAWbL,gBAAgB,SAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACnB;AAED,MAAMQ,YAAY,GAAGA,CAAE;EAAEC,KAAK,GAAGpB,MAAM,CAACqB,EAAE,CAACC;AAA0B,CAAC,kBACrExB,GAAG,CAAE;EAAEsB;AAAM,CAAC,EAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,iDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;AAEjB,MAAMY,aAAa,GAAGA,CAAE;EAAEC,KAAK;EAAEC;AAAsC,CAAC,KAAM;EAC7E,IAAK,CAAEA,uBAAuB,EAAG;IAChC,oBAAO3B,GAAG,CAAE;MAAE4B,YAAY,EAAEF,KAAK,GAAG,EAAE,GAAGG;IAAU,CAAC,EAAAlB,OAAA,CAAAC,GAAA,CAAAC,QAAA,kDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;EACvD;EACA,OAAO,EAAE;AACV,CAAC;AAED,OAAO,MAAMiB,OAAO,gBAAGZ,OAAA,CAAQ,KAAK,EAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EACnCkB,iBAAiB,EAAIC,IAAY,IAChC,CAAE,CAAE,OAAO,EAAE,yBAAyB,EAAE,OAAO,CAAE,CAACC,QAAQ,CAAED,IAAK,CAAC;EAAAb,MAAA;AAAA;EADnEY,iBAAiB,EAAIC,IAAY,IAChC,CAAE,CAAE,OAAO,EAAE,yBAAyB,EAAE,OAAO,CAAE,CAACC,QAAQ,CAAED,IAAK,CAAC;EAAAb,MAAA;EAAAC,KAAA;AAAA,CAClE,CAAC,uDAMCC,YAAY,OACZb,WAAW,OACXiB,aAAa,SAAAd,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAChB;AAED,OAAO,MAAMqB,iBAAiB,gBAAAhB,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,+BAEdb,UAAU,SAEtBJ,GAAG,CAAE;EAAEgC,WAAW,EAAE;AAAE,CAAE,CAAC,SAAAxB,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAC5B;AAED,OAAO,MAAMuB,gBAAgB,gBAAAlB,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,+BAEbb,UAAU,SAEtBJ,GAAG,CAAE;EAAEkC,UAAU,EAAE;AAAE,CAAE,CAAC,SAAA1B,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAC3B;AAED,MAAMyB,mBAAmB,GAAGA,CAAE;EAAEC,QAAQ;EAAEC;AAAqB,CAAC,KAAM;EACrE,IAAIC,UAAU,GAAGD,SAAS,IAAI,EAAE;EAEhC,IAAKD,QAAQ,EAAG;IACfE,UAAU,GAAGvC,MAAM,CAACqB,EAAE,CAACmB,kBAAkB;EAC1C;EAEA,oBAAO1C,GAAG,CAAE;IAAEyC;EAAW,CAAC,EAAA9B,OAAA,CAAAC,GAAA,CAAAC,QAAA,wDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;AAC7B,CAAC;AAED,OAAO,MAAM8B,IAAI,gBAAAzB,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,wBACKlB,MAAM,CAAC0C,IAAI,CAAE,GAAG,CAAE,+DAK5BrC,UAAU,sCAEN,CAAED,gBAAgB,GAAGC,UAAU,IAAK,CAAC,6BAElCH,MAAM,CAACyC,UAAU,OAEhCP,mBAAmB,SAAA3B,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACtB;AAED,MAAMiC,oBAAoB,GAAGA,CAAE;EAAEP,QAAQ;EAAEQ;AAAuB,CAAC,KAAM;EACxE,IAAIN,UAAU,GAAGM,UAAU,IAAI,cAAc;EAE7C,IAAKR,QAAQ,EAAG;IACfE,UAAU,GAAGvC,MAAM,CAAC0C,IAAI,CAAE,GAAG,CAAE;EAChC;EAEA,oBAAO5C,GAAG,CAAE;IAAEyC;EAAW,CAAC,EAAA9B,OAAA,CAAAC,GAAA,CAAAC,QAAA,yDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;AAC7B,CAAC;AAED,OAAO,MAAMmC,KAAK,gBAAA9B,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,mDAEChB,MAAM,CAACyC,UAAU,cACxBtC,UAAU,wEAIN,CAAED,gBAAgB,GAAGC,UAAU,IAAK,CAAC,iFAOjDuC,oBAAoB,SAAAnC,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACvB;AAED,OAAO,MAAMoC,YAAY,gBAAA/B,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAT,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAqC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAOxB;AAED,OAAO,MAAMC,IAAI,gBAAArC,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,4GAOKlB,MAAM,CAACqB,EAAE,CAACkB,UAAU,mBAAA9B,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAEzC;AAED,MAAM2C,aAAa,GAAGA,CAAE;EAAEC;AAAyB,CAAC,KAAM;EACzD,oBAAOzD,GAAG,CAAE;IACXsB,KAAK,EAAEmC,QAAQ,GAAGvD,MAAM,CAAC0C,IAAI,CAAE,GAAG,CAAE,GAAG1C,MAAM,CAAC0C,IAAI,CAAE,GAAG;EACxD,CAAC,EAAAjC,OAAA,CAAAC,GAAA,CAAAC,QAAA,kDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8oVAAC,CAAC;AACJ,CAAC;AAED,OAAO,MAAM6C,SAAS,gBAAAxC,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,aACXlB,MAAM,CAAC0C,IAAI,CAAE,GAAG,CAAE,mEAMzBzC,GAAG,CAAE;EAAEwD,IAAI,EAAE;AAAE,CAAE,CAAC,OAClBxD,GAAG,CACL;EAAEyD,SAAS,EAAE;AAAqB,CAAC,EACnC;EAAEA,SAAS,EAAE;AAAoB,CAClC,CAAC,OAEEJ,aAAa,SAAA7C,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAChB;AAED,MAAMgD,UAAU,GAAGA,CAAE;EAAEtB;AAAqB,CAAC,KAC5CA,QAAQ,gBACLvC,GAAG,sBACkBE,MAAM,CAAC0C,IAAI,CAAE,GAAG,CAAE,SAAAjC,OAAA,CAAAC,GAAA,CAAAC,QAAA,gDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,+pVAEvCb,GAAG,sBACkBE,MAAM,CAAC4D,KAAK,CAACC,MAAM,SAAApD,OAAA,CAAAC,GAAA,CAAAC,QAAA,gDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,+oVACvC;AAEL,OAAO,MAAMmD,YAAY,gBAAA9C,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,8CAGbN,SAAS,2CAEL,CAAER,gBAAgB,GAAGQ,SAAS,IAAK,CAAC,sFAMzCA,SAAS,uBACDV,MAAM,CAAC6D,WAAW,kFAOjCJ,UAAU,OACV1D,GAAG,CAAE;EAAEkC,UAAU,EAAE,CAAC;AAAG,CAAE,CAAC,OAC1BlC,GAAG,CACL;EAAEyD,SAAS,EAAE;AAAsB,CAAC,EACpC;EAAEA,SAAS,EAAE;AAAuB,CACrC,CAAC,SAAAjD,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACD;AAED,MAAMqD,UAAU,GAAGA,CAAE;EAAEC;AAAsB,CAAC,KAAM;EACnD,OAAOA,SAAS,gBACbnE,GAAG,8DAImBE,MAAM,CAAC4D,KAAK,CAACC,MAAM,iCAEtB3D,MAAM,CAAC6D,WAAW,cACzBnD,SAAS,GAAG,CAAC,eACdA,SAAS,GAAG,CAAC,+BAAAH,OAAA,CAAAC,GAAA,CAAAC,QAAA,gDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,kpVAKxB,EAAE;AACN,CAAC;AAED,OAAO,MAAMuD,KAAK,gBAAAlD,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,wCAEChB,MAAM,CAAC6D,WAAW,sFAMrB7D,MAAM,CAACiE,eAAe,OAElCR,UAAU,OACVK,UAAU,SAAAvD,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACb;AAED,OAAO,MAAMyD,UAAU,gBAAApD,OAAA,UAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,uFAMRN,SAAS,GAAG,CAAC,mFAMJA,SAAS,aAAAH,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAChC;AAED,MAAM0D,WAAW,GAAGA,CAAE;EAAEC;AAAmB,CAAC,KAAM;EACjD,oBAAOxE,GAAG,aACGwE,IAAI,GAAG,cAAc,GAAG,MAAM,eAC9BA,IAAI,GAAG,CAAC,GAAG,CAAC,2IAAA7D,OAAA,CAAAC,GAAA,CAAAC,QAAA,iDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA;AAY1B,CAAC;AAAC,IAAA4D,IAAA,GAAA9D,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAqC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA;AAAA,IAAAoB,KAAA,GAAA/D,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAqC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA;AAEF,MAAMqB,eAAe,GAAGA,CAAE;EAAEC;AAAuB,CAAC,KAAM;EACzD,MAAMC,QAAQ,GAAGD,QAAQ,KAAK,QAAQ;EAEtC,IAAKC,QAAQ,EAAG;IACf,OAAAH,KAAA;EAGD;EAEA,OAAAD,IAAA;AAGD,CAAC;AAED,OAAO,MAAMK,OAAO,gBAAA5D,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,qDAEDhB,MAAM,CAAC2E,WAAW,0JAWjCR,WAAW,OAEXI,eAAe,OACfxE,GAAG,CACL;EAAEyD,SAAS,EAAE;AAAmB,CAAC,EACjC;EAAEA,SAAS,EAAE;AAAkB,CAChC,CAAC,SAAAjD,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACD;;AAED;AACA;AACA,OAAO,MAAMmE,WAAW,gBAAG9D,OAAA,CAAQjB,aAAa,EAAAU,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,4EAM7CZ,WAAW,QAGZL,GAAG,CAAE;EAAEkC,UAAU,EAAE,GAAIhC,KAAK,CAAE,CAAE,CAAC;AAAe,CAAE,CAAC,SAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVACtD;AAED,OAAO,MAAMoE,kBAAkB,gBAAA/D,OAAA,SAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,uEAO1BZ,WAAW,QAGZL,GAAG,CAAE;EAAEkC,UAAU,EAAE;AAAE,CAAE,CAAC,SAAA1B,OAAA,CAAAC,GAAA,CAAAC,QAAA,gpVAC3B","ignoreList":[]}
+{"version":3,"names":["css","NumberControl","COLORS","rtl","CONFIG","space","rangeHeightValue","railHeight","rangeHeight","height","minHeight","process","env","NODE_ENV","thumbSize","deprecatedHeight","__next40pxDefaultSize","Root","_styled","target","label","wrapperColor","color","ui","borderFocus","wrapperMargin","marks","__nextHasNoMarginBottom","marginBottom","undefined","Wrapper","shouldForwardProp","prop","includes","BeforeIconWrapper","marginRight","AfterIconWrapper","marginLeft","railBackgroundColor","disabled","railColor","background","backgroundDisabled","Rail","gray","radiusFull","trackBackgroundColor","trackColor","Track","MarksWrapper","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","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","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-module/select-control/index.js

@@ -17,6 +17,7 @@ import BaseControl from '../base-control';
 import { Select, StyledInputBase } from './styles/select-control-styles';
 import SelectControlChevronDown from './chevron-down';
 import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
+import { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';
 import { jsx as _jsx } from "react/jsx-runtime";
 function useUniqueId(idProp) {
   const instanceId = useInstanceId(SelectControl);
@@ -60,6 +61,7 @@ function UnforwardedSelectControl(props, ref) {
     variant = 'default',
     __next40pxDefaultSize = false,
     __nextHasNoMarginBottom = false,
+    __shouldNotWarnDeprecated36pxSize,
     ...restProps
   } = useDeprecated36pxDefaultSizeProp(props);
   const id = useUniqueId(idProp);
@@ -87,6 +89,12 @@ function UnforwardedSelectControl(props, ref) {
     });
   };
   const classes = clsx('components-select-control', className);
+  maybeWarnDeprecated36pxSize({
+    componentName: 'SelectControl',
+    __next40pxDefaultSize,
+    size,
+    __shouldNotWarnDeprecated36pxSize
+  });
   return /*#__PURE__*/_jsx(BaseControl, {
     help: help,
     id: id,
@@ -140,6 +148,7 @@ function UnforwardedSelectControl(props, ref) {
  *
  *   return (
  *     <SelectControl
+ *       __next40pxDefaultSize
  *       __nextHasNoMarginBottom
  *       label="Size"
  *       value={ size }

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

@@ -1 +1 @@
-{"version":3,"names":["clsx","useInstanceId","forwardRef","BaseControl","Select","StyledInputBase","SelectControlChevronDown","useDeprecated36pxDefaultSizeProp","jsx","_jsx","useUniqueId","idProp","instanceId","SelectControl","id","SelectOptions","options","map","label","value","optionProps","index","key","children","UnforwardedSelectControl","props","ref","className","disabled","help","hideLabelFromVision","multiple","onChange","size","valueProp","labelPosition","prefix","suffix","variant","__next40pxDefaultSize","__nextHasNoMarginBottom","restProps","helpId","undefined","length","handleOnChange","event","selectedOptions","Array","from","target","filter","selected","newValues","classes","__associatedWPComponentName","isBorderless","__unstableInputWidth","selectSize"],"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":";AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,WAAW,MAAM,iBAAiB;AACzC,SAASC,MAAM,EAAEC,eAAe,QAAQ,gCAAgC;AAGxE,OAAOC,wBAAwB,MAAM,gBAAgB;AACrD,SAASC,gCAAgC,QAAQ,+BAA+B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEjF,SAASC,WAAWA,CAAEC,MAAe,EAAG;EACvC,MAAMC,UAAU,GAAGX,aAAa,CAAEY,aAAc,CAAC;EACjD,MAAMC,EAAE,GAAG,4BAA6BF,UAAU,EAAG;EAErD,OAAOD,MAAM,IAAIG,EAAE;AACpB;AAEA,SAASC,aAAaA,CAAE;EACvBC;AAGD,CAAC,EAAG;EACH,OAAOA,OAAO,CAACC,GAAG,CAAE,CAAE;IAAEH,EAAE;IAAEI,KAAK;IAAEC,KAAK;IAAE,GAAGC;EAAY,CAAC,EAAEC,KAAK,KAAM;IACtE,MAAMC,GAAG,GAAGR,EAAE,IAAI,GAAII,KAAK,IAAMC,KAAK,IAAME,KAAK,EAAG;IAEpD,oBACCZ,IAAA;MAAoBU,KAAK,EAAGA,KAAO;MAAA,GAAMC,WAAW;MAAAG,QAAA,EACjDL;IAAK,GADMI,GAEN,CAAC;EAEX,CAAE,CAAC;AACJ;AAEA,SAASE,wBAAwBA,CAChCC,KAA0E,EAC1EC,GAA4C,EAC3C;EACD,MAAM;IACLC,SAAS;IACTC,QAAQ,GAAG,KAAK;IAChBC,IAAI;IACJC,mBAAmB;IACnBhB,EAAE,EAAEH,MAAM;IACVO,KAAK;IACLa,QAAQ,GAAG,KAAK;IAChBC,QAAQ;IACRhB,OAAO,GAAG,EAAE;IACZiB,IAAI,GAAG,SAAS;IAChBd,KAAK,EAAEe,SAAS;IAChBC,aAAa,GAAG,KAAK;IACrBZ,QAAQ;IACRa,MAAM;IACNC,MAAM;IACNC,OAAO,GAAG,SAAS;IACnBC,qBAAqB,GAAG,KAAK;IAC7BC,uBAAuB,GAAG,KAAK;IAC/B,GAAGC;EACJ,CAAC,GAAGlC,gCAAgC,CAAEkB,KAAM,CAAC;EAC7C,MAAMX,EAAE,GAAGJ,WAAW,CAAEC,MAAO,CAAC;EAChC,MAAM+B,MAAM,GAAGb,IAAI,GAAG,GAAIf,EAAE,QAAS,GAAG6B,SAAS;;EAEjD;EACA,IAAK,CAAE3B,OAAO,EAAE4B,MAAM,IAAI,CAAErB,QAAQ,EAAG;IACtC,OAAO,IAAI;EACZ;EAEA,MAAMsB,cAAc,GACnBC,KAA6C,IACzC;IACJ,IAAKrB,KAAK,CAACM,QAAQ,EAAG;MACrB,MAAMgB,eAAe,GAAGC,KAAK,CAACC,IAAI,CAAEH,KAAK,CAACI,MAAM,CAAClC,OAAQ,CAAC,CAACmC,MAAM,CAChE,CAAE;QAAEC;MAAS,CAAC,KAAMA,QACrB,CAAC;MACD,MAAMC,SAAS,GAAGN,eAAe,CAAC9B,GAAG,CACpC,CAAE;QAAEE;MAAM,CAAC,KAAMA,KAClB,CAAC;MACDM,KAAK,CAACO,QAAQ,GAAIqB,SAAS,EAAE;QAAEP;MAAM,CAAE,CAAC;MACxC;IACD;IAEArB,KAAK,CAACO,QAAQ,GAAIc,KAAK,CAACI,MAAM,CAAC/B,KAAK,EAAO;MAAE2B;IAAM,CAAE,CAAC;EACvD,CAAC;EAED,MAAMQ,OAAO,GAAGtD,IAAI,CAAE,2BAA2B,EAAE2B,SAAU,CAAC;EAE9D,oBACClB,IAAA,CAACN,WAAW;IACX0B,IAAI,EAAGA,IAAM;IACbf,EAAE,EAAGA,EAAI;IACT0B,uBAAuB,EAAGA,uBAAyB;IACnDe,2BAA2B,EAAC,eAAe;IAAAhC,QAAA,eAE3Cd,IAAA,CAACJ,eAAe;MACfsB,SAAS,EAAG2B,OAAS;MACrB1B,QAAQ,EAAGA,QAAU;MACrBE,mBAAmB,EAAGA,mBAAqB;MAC3ChB,EAAE,EAAGA,EAAI;MACT0C,YAAY,EAAGlB,OAAO,KAAK,SAAW;MACtCpB,KAAK,EAAGA,KAAO;MACfe,IAAI,EAAGA,IAAM;MACbI,MAAM,EACLA,MAAM,IAAM,CAAEN,QAAQ,iBAAItB,IAAA,CAACH,wBAAwB,IAAE,CACrD;MACD8B,MAAM,EAAGA,MAAQ;MACjBD,aAAa,EAAGA,aAAe;MAC/BsB,oBAAoB,EACnBnB,OAAO,KAAK,SAAS,GAAG,MAAM,GAAGK,SACjC;MACDL,OAAO,EAAGA,OAAS;MACnBC,qBAAqB,EAAGA,qBAAuB;MAAAhB,QAAA,eAE/Cd,IAAA,CAACL,MAAM;QAAA,GACDqC,SAAS;QACdF,qBAAqB,EAAGA,qBAAuB;QAC/C,oBAAmBG,MAAQ;QAC3Bf,SAAS,EAAC,kCAAkC;QAC5CC,QAAQ,EAAGA,QAAU;QACrBd,EAAE,EAAGA,EAAI;QACTiB,QAAQ,EAAGA,QAAU;QACrBC,QAAQ,EAAGa,cAAgB;QAC3BnB,GAAG,EAAGA,GAAK;QACXgC,UAAU,EAAGzB,IAAM;QACnBd,KAAK,EAAGe,SAAW;QACnBI,OAAO,EAAGA,OAAS;QAAAf,QAAA,EAEjBA,QAAQ,iBAAId,IAAA,CAACM,aAAa;UAACC,OAAO,EAAGA;QAAS,CAAE;MAAC,CAC5C;IAAC,CACO;EAAC,CACN,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMH,aAAa,GAAGX,UAAU,CAAEsB,wBAAyB,CAQrC;AAE7B,eAAeX,aAAa","ignoreList":[]}
+{"version":3,"names":["clsx","useInstanceId","forwardRef","BaseControl","Select","StyledInputBase","SelectControlChevronDown","useDeprecated36pxDefaultSizeProp","maybeWarnDeprecated36pxSize","jsx","_jsx","useUniqueId","idProp","instanceId","SelectControl","id","SelectOptions","options","map","label","value","optionProps","index","key","children","UnforwardedSelectControl","props","ref","className","disabled","help","hideLabelFromVision","multiple","onChange","size","valueProp","labelPosition","prefix","suffix","variant","__next40pxDefaultSize","__nextHasNoMarginBottom","__shouldNotWarnDeprecated36pxSize","restProps","helpId","undefined","length","handleOnChange","event","selectedOptions","Array","from","target","filter","selected","newValues","classes","componentName","__associatedWPComponentName","isBorderless","__unstableInputWidth","selectSize"],"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-module/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-module/slot-fill/context.js

@@ -1,19 +1,21 @@
 /**
  * WordPress dependencies
  */
+import { observableMap } from '@wordpress/compose';
 import { createContext } from '@wordpress/element';
+
 /**
  * Internal dependencies
  */
 
 const initialValue = {
+  slots: observableMap(),
+  fills: observableMap(),
   registerSlot: () => {},
   unregisterSlot: () => {},
   registerFill: () => {},
   unregisterFill: () => {},
-  getSlot: () => undefined,
-  getFills: () => [],
-  subscribe: () => () => {}
+  updateFill: () => {}
 };
 export const SlotFillContext = createContext(initialValue);
 export default SlotFillContext;

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

@@ -1 +1 @@
-{"version":3,"names":["createContext","initialValue","registerSlot","unregisterSlot","registerFill","unregisterFill","getSlot","undefined","getFills","subscribe","SlotFillContext"],"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":"AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,oBAAoB;AAClD;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;AACD,OAAO,MAAMC,eAAe,GAAGV,aAAa,CAAEC,YAAa,CAAC;AAE5D,eAAeS,eAAe","ignoreList":[]}
+{"version":3,"names":["observableMap","createContext","initialValue","slots","fills","registerSlot","unregisterSlot","registerFill","unregisterFill","updateFill","SlotFillContext"],"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":"AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,oBAAoB;AAClD,SAASC,aAAa,QAAQ,oBAAoB;;AAElD;AACA;AACA;;AAGA,MAAMC,YAAiC,GAAG;EACzCC,KAAK,EAAEH,aAAa,CAAC,CAAC;EACtBI,KAAK,EAAEJ,aAAa,CAAC,CAAC;EACtBK,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;AACD,OAAO,MAAMC,eAAe,GAAGT,aAAa,CAAEC,YAAa,CAAC;AAE5D,eAAeQ,eAAe","ignoreList":[]}

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

@@ -7,29 +7,24 @@ import { useContext, useLayoutEffect, useRef } from '@wordpress/element';
  * Internal dependencies
  */
 import SlotFillContext from './context';
-import useSlot from './use-slot';
 export default function Fill({
   name,
   children
 }) {
   const registry = useContext(SlotFillContext);
-  const slot = useSlot(name);
-  const ref = useRef({
-    name,
-    children
-  });
+  const instanceRef = useRef({});
+  const childrenRef = useRef(children);
+  useLayoutEffect(() => {
+    childrenRef.current = children;
+  }, [children]);
   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]);
   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-module/slot-fill/fill.js.map

@@ -1 +1 @@
-{"version":3,"names":["useContext","useLayoutEffect","useRef","SlotFillContext","useSlot","Fill","name","children","registry","slot","ref","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":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,eAAe,EAAEC,MAAM,QAAQ,oBAAoB;;AAExE;AACA;AACA;AACA,OAAOC,eAAe,MAAM,WAAW;AACvC,OAAOC,OAAO,MAAM,YAAY;AAGhC,eAAe,SAASC,IAAIA,CAAE;EAAEC,IAAI;EAAEC;AAA6B,CAAC,EAAG;EACtE,MAAMC,QAAQ,GAAGR,UAAU,CAAEG,eAAgB,CAAC;EAC9C,MAAMM,IAAI,GAAGL,OAAO,CAAEE,IAAK,CAAC;EAE5B,MAAMI,GAAG,GAAGR,MAAM,CAAE;IACnBI,IAAI;IACJC;EACD,CAAE,CAAC;EAEHN,eAAe,CAAE,MAAM;IACtB,MAAMU,QAAQ,GAAGD,GAAG,CAACE,OAAO;IAC5BD,QAAQ,CAACL,IAAI,GAAGA,IAAI;IACpBE,QAAQ,CAACK,YAAY,CAAEP,IAAI,EAAEK,QAAS,CAAC;IACvC,OAAO,MAAMH,QAAQ,CAACM,cAAc,CAAER,IAAI,EAAEK,QAAS,CAAC;EACvD,CAAC,EAAE,CAAEH,QAAQ,EAAEF,IAAI,CAAG,CAAC;EAEvBL,eAAe,CAAE,MAAM;IACtBS,GAAG,CAACE,OAAO,CAACL,QAAQ,GAAGA,QAAQ;IAC/B,IAAKE,IAAI,EAAG;MACXA,IAAI,CAACM,QAAQ,CAAC,CAAC;IAChB;EACD,CAAC,EAAE,CAAEN,IAAI,EAAEF,QAAQ,CAAG,CAAC;EAEvB,OAAO,IAAI;AACZ","ignoreList":[]}
+{"version":3,"names":["useContext","useLayoutEffect","useRef","SlotFillContext","Fill","name","children","registry","instanceRef","childrenRef","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":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,eAAe,EAAEC,MAAM,QAAQ,oBAAoB;;AAExE;AACA;AACA;AACA,OAAOC,eAAe,MAAM,WAAW;AAGvC,eAAe,SAASC,IAAIA,CAAE;EAAEC,IAAI;EAAEC;AAA6B,CAAC,EAAG;EACtE,MAAMC,QAAQ,GAAGP,UAAU,CAAEG,eAAgB,CAAC;EAC9C,MAAMK,WAAW,GAAGN,MAAM,CAAE,CAAC,CAAE,CAAC;EAChC,MAAMO,WAAW,GAAGP,MAAM,CAAEI,QAAS,CAAC;EAEtCL,eAAe,CAAE,MAAM;IACtBQ,WAAW,CAACC,OAAO,GAAGJ,QAAQ;EAC/B,CAAC,EAAE,CAAEA,QAAQ,CAAG,CAAC;EAEjBL,eAAe,CAAE,MAAM;IACtB,MAAMU,QAAQ,GAAGH,WAAW,CAACE,OAAO;IACpCH,QAAQ,CAACK,YAAY,CAAEP,IAAI,EAAEM,QAAQ,EAAEF,WAAW,CAACC,OAAQ,CAAC;IAC5D,OAAO,MAAMH,QAAQ,CAACM,cAAc,CAAER,IAAI,EAAEM,QAAS,CAAC;EACvD,CAAC,EAAE,CAAEJ,QAAQ,EAAEF,IAAI,CAAG,CAAC;EAEvBJ,eAAe,CAAE,MAAM;IACtBM,QAAQ,CAACO,UAAU,CAAET,IAAI,EAAEG,WAAW,CAACE,OAAO,EAAED,WAAW,CAACC,OAAQ,CAAC;EACtE,CAAE,CAAC;EAEH,OAAO,IAAI;AACZ","ignoreList":[]}

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

@@ -8,81 +8,67 @@ import { useState } from '@wordpress/element';
  * Internal dependencies
  */
 import SlotFillContext from './context';
+import { observableMap } from '@wordpress/compose';
 import { jsx as _jsx } from "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 = observableMap();
+  const fills = 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
   };
 }
 export function SlotFillProvider({

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

@@ -1 +1 @@
-{"version":3,"names":["useState","SlotFillContext","jsx","_jsx","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","Provider","value"],"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":["useState","SlotFillContext","observableMap","jsx","_jsx","createSlotRegistry","slots","fills","registerSlot","name","instance","set","unregisterSlot","get","delete","registerFill","children","unregisterFill","fillsForName","filter","fill","updateFill","fillForInstance","find","f","map","SlotFillProvider","contextValue","Provider","value"],"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":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,QAAQ,oBAAoB;;AAE7C;AACA;AACA;AACA,OAAOC,eAAe,MAAM,WAAW;AASvC,SAASC,aAAa,QAAQ,oBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEnD,SAASC,kBAAkBA,CAAA,EAAwB;EAClD,MAAMC,KAAK,GAAGJ,aAAa,CAA8B,CAAC;EAC1D,MAAMK,KAAK,GAAGL,aAAa,CAGzB,CAAC;EAEH,SAASM,YAAYA,CAAEC,IAAa,EAAEC,QAA0B,EAAG;IAClEJ,KAAK,CAACK,GAAG,CAAEF,IAAI,EAAEC,QAAS,CAAC;EAC5B;EAEA,SAASE,cAAcA,CAAEH,IAAa,EAAEC,QAA0B,EAAG;IACpE;IACA;IACA;IACA,IAAKJ,KAAK,CAACO,GAAG,CAAEJ,IAAK,CAAC,KAAKC,QAAQ,EAAG;MACrC;IACD;IAEAJ,KAAK,CAACQ,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;IACNlB,KAAK;IACLC,KAAK;IACLC,YAAY;IACZI,cAAc;IACdG,YAAY;IACZE,cAAc;IACdI;EACD,CAAC;AACF;AAEA,OAAO,SAASK,gBAAgBA,CAAE;EAAEV;AAAgC,CAAC,EAAG;EACvE,MAAM,CAAEW,YAAY,CAAE,GAAG3B,QAAQ,CAAEK,kBAAmB,CAAC;EACvD,oBACCD,IAAA,CAACH,eAAe,CAAC2B,QAAQ;IAACC,KAAK,EAAGF,YAAc;IAAAX,QAAA,EAC7CA;EAAQ,CACe,CAAC;AAE7B;AAEA,eAAeU,gBAAgB","ignoreList":[]}

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

@@ -6,7 +6,8 @@
 /**
  * WordPress dependencies
  */
-import { useContext, useEffect, useReducer, useRef, Children, cloneElement, isEmptyElement } from '@wordpress/element';
+import { useObservableValue } from '@wordpress/compose';
+import { useContext, useLayoutEffect, useRef, Children, cloneElement, isEmptyElement } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -22,44 +23,51 @@ import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 function isFunction(maybeFunc) {
   return typeof maybeFunc === 'function';
 }
+function addKeysToChildren(children) {
+  return 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 cloneElement(child, {
+      key: childKey
+    });
+  });
+}
 function Slot(props) {
-  var _registry$getFills;
+  var _useObservableValue;
   const registry = useContext(SlotFillContext);
-  const [, rerender] = useReducer(() => [], []);
-  const ref = useRef({
-    rerender
-  });
+  const instanceRef = useRef({});
   const {
     name,
     children,
     fillProps = {}
   } = props;
-  useEffect(() => {
-    const refValue = ref.current;
-    registry.registerSlot(name, refValue);
-    return () => registry.unregisterSlot(name, refValue);
+  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 = useObservableValue(registry.fills, name)) !== null && _useObservableValue !== void 0 ? _useObservableValue : [];
+  const currentSlot = 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 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 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 => !isEmptyElement(element));
   return /*#__PURE__*/_jsx(_Fragment, {
-    children: isFunction(children) ? children(fills) : fills
+    children: isFunction(children) ? children(renderedFills) : renderedFills
   });
 }
 export default Slot;

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

@@ -1 +1 @@
-{"version":3,"names":["useContext","useEffect","useReducer","useRef","Children","cloneElement","isEmptyElement","SlotFillContext","Fragment","_Fragment","jsx","_jsx","isFunction","maybeFunc","Slot","props","_registry$getFills","registry","rerender","ref","name","children","fillProps","refValue","current","registerSlot","unregisterSlot","fills","getFills","map","fill","fillChildren","child","childIndex","childKey","key","filter","element"],"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":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,UAAU,EACVC,SAAS,EACTC,UAAU,EACVC,MAAM,EACNC,QAAQ,EACRC,YAAY,EACZC,cAAc,QACR,oBAAoB;;AAE3B;AACA;AACA;AACA,OAAOC,eAAe,MAAM,WAAW;AAAC,SAAAC,QAAA,IAAAC,SAAA,EAAAC,GAAA,IAAAC,IAAA;AAGxC;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,UAAUA,CAAEC,SAAc,EAA0B;EAC5D,OAAO,OAAOA,SAAS,KAAK,UAAU;AACvC;AAEA,SAASC,IAAIA,CAAEC,KAAqD,EAAG;EAAA,IAAAC,kBAAA;EACtE,MAAMC,QAAQ,GAAGjB,UAAU,CAAEO,eAAgB,CAAC;EAC9C,MAAM,GAAIW,QAAQ,CAAE,GAAGhB,UAAU,CAAE,MAAM,EAAE,EAAE,EAAG,CAAC;EACjD,MAAMiB,GAAG,GAAGhB,MAAM,CAAE;IAAEe;EAAS,CAAE,CAAC;EAElC,MAAM;IAAEE,IAAI;IAAEC,QAAQ;IAAEC,SAAS,GAAG,CAAC;EAAE,CAAC,GAAGP,KAAK;EAEhDd,SAAS,CAAE,MAAM;IAChB,MAAMsB,QAAQ,GAAGJ,GAAG,CAACK,OAAO;IAC5BP,QAAQ,CAACQ,YAAY,CAAEL,IAAI,EAAEG,QAAS,CAAC;IACvC,OAAO,MAAMN,QAAQ,CAACS,cAAc,CAAEN,IAAI,EAAEG,QAAS,CAAC;EACvD,CAAC,EAAE,CAAEN,QAAQ,EAAEG,IAAI,CAAG,CAAC;EAEvB,MAAMO,KAAkB,GAAG,EAAAX,kBAAA,GAAEC,QAAQ,CAACW,QAAQ,CAAER,IAAI,EAAED,GAAG,CAACK,OAAQ,CAAC,cAAAR,kBAAA,cAAAA,kBAAA,GAAI,EAAE,EACvEa,GAAG,CAAIC,IAAI,IAAM;IACjB,MAAMC,YAAY,GAAGnB,UAAU,CAAEkB,IAAI,CAACT,QAAS,CAAC,GAC7CS,IAAI,CAACT,QAAQ,CAAEC,SAAU,CAAC,GAC1BQ,IAAI,CAACT,QAAQ;IAChB,OAAOjB,QAAQ,CAACyB,GAAG,CAAEE,YAAY,EAAE,CAAEC,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,OAAO9B,YAAY,CAAE2B,KAAK,EAAkB;QAC3CG,GAAG,EAAED;MACN,CAAE,CAAC;IACJ,CAAE,CAAC;EACJ,CAAE,CAAC,CACFE,MAAM;EACN;EACA;EACA;EACEC,OAAO,IAAM,CAAE/B,cAAc,CAAE+B,OAAQ,CAC1C,CAAC;EAEF,oBAAO1B,IAAA,CAAAF,SAAA;IAAAY,QAAA,EAAIT,UAAU,CAAES,QAAS,CAAC,GAAGA,QAAQ,CAAEM,KAAM,CAAC,GAAGA;EAAK,CAAI,CAAC;AACnE;AAEA,eAAeb,IAAI","ignoreList":[]}
+{"version":3,"names":["useObservableValue","useContext","useLayoutEffect","useRef","Children","cloneElement","isEmptyElement","SlotFillContext","Fragment","_Fragment","jsx","_jsx","isFunction","maybeFunc","addKeysToChildren","children","map","child","childIndex","childKey","key","Slot","props","_useObservableValue","registry","instanceRef","name","fillProps","instance","current","registerSlot","unregisterSlot","fills","currentSlot","slots","renderedFills","fill","fillChildren","filter","element"],"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":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,oBAAoB;AACvD,SACCC,UAAU,EACVC,eAAe,EACfC,MAAM,EACNC,QAAQ,EACRC,YAAY,EACZC,cAAc,QACR,oBAAoB;;AAE3B;AACA;AACA;AACA,OAAOC,eAAe,MAAM,WAAW;AAAC,SAAAC,QAAA,IAAAC,SAAA,EAAAC,GAAA,IAAAC,IAAA;AAGxC;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,UAAUA,CAAEC,SAAc,EAA0B;EAC5D,OAAO,OAAOA,SAAS,KAAK,UAAU;AACvC;AAEA,SAASC,iBAAiBA,CAAEC,QAAmB,EAAG;EACjD,OAAOX,QAAQ,CAACY,GAAG,CAAED,QAAQ,EAAE,CAAEE,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,OAAOf,YAAY,CAAEY,KAAK,EAAkB;MAC3CG,GAAG,EAAED;IACN,CAAE,CAAC;EACJ,CAAE,CAAC;AACJ;AAEA,SAASE,IAAIA,CAAEC,KAAqD,EAAG;EAAA,IAAAC,mBAAA;EACtE,MAAMC,QAAQ,GAAGvB,UAAU,CAAEM,eAAgB,CAAC;EAC9C,MAAMkB,WAAW,GAAGtB,MAAM,CAAE,CAAC,CAAE,CAAC;EAEhC,MAAM;IAAEuB,IAAI;IAAEX,QAAQ;IAAEY,SAAS,GAAG,CAAC;EAAE,CAAC,GAAGL,KAAK;EAEhDpB,eAAe,CAAE,MAAM;IACtB,MAAM0B,QAAQ,GAAGH,WAAW,CAACI,OAAO;IACpCL,QAAQ,CAACM,YAAY,CAAEJ,IAAI,EAAEE,QAAS,CAAC;IACvC,OAAO,MAAMJ,QAAQ,CAACO,cAAc,CAAEL,IAAI,EAAEE,QAAS,CAAC;EACvD,CAAC,EAAE,CAAEJ,QAAQ,EAAEE,IAAI,CAAG,CAAC;EAEvB,IAAIM,KAAK,IAAAT,mBAAA,GAAGvB,kBAAkB,CAAEwB,QAAQ,CAACQ,KAAK,EAAEN,IAAK,CAAC,cAAAH,mBAAA,cAAAA,mBAAA,GAAI,EAAE;EAC5D,MAAMU,WAAW,GAAGjC,kBAAkB,CAAEwB,QAAQ,CAACU,KAAK,EAAER,IAAK,CAAC;;EAE9D;EACA,IAAKO,WAAW,KAAKR,WAAW,CAACI,OAAO,EAAG;IAC1CG,KAAK,GAAG,EAAE;EACX;EAEA,MAAMG,aAAa,GAAGH,KAAK,CACzBhB,GAAG,CAAIoB,IAAI,IAAM;IACjB,MAAMC,YAAY,GAAGzB,UAAU,CAAEwB,IAAI,CAACrB,QAAS,CAAC,GAC7CqB,IAAI,CAACrB,QAAQ,CAAEY,SAAU,CAAC,GAC1BS,IAAI,CAACrB,QAAQ;IAChB,OAAOD,iBAAiB,CAAEuB,YAAa,CAAC;EACzC,CAAE,CAAC,CACFC,MAAM;EACN;EACA;EACA;EACEC,OAAO,IAAM,CAAEjC,cAAc,CAAEiC,OAAQ,CAC1C,CAAC;EAEF,oBACC5B,IAAA,CAAAF,SAAA;IAAAM,QAAA,EACGH,UAAU,CAAEG,QAAS,CAAC,GACrBA,QAAQ,CAAEoB,aAAc,CAAC,GACzBA;EAAa,CACf,CAAC;AAEL;AAEA,eAAed,IAAI","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/slot-fill/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type { ObservableMap } from '@wordpress/compose';\n\nexport type DistributiveOmit< T, K extends keyof any > = T extends any\n\t? Omit< T, K >\n\t: never;\n\nexport type SlotKey = string | symbol;\n\nexport type FillProps = Record< string, any >;\n\ntype SlotPropBase = {\n\t/**\n\t * Slot name.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * props to pass from `Slot` to `Fill`.\n\t *\n\t * @default {}\n\t */\n\tfillProps?: FillProps;\n};\n\nexport type SlotComponentProps =\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually: true;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: never;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: string;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: React.CSSProperties;\n\t  } )\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually?: false;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: ( fills: ReactNode ) => ReactNode;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: never;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: never;\n\t  } );\n\nexport type FillComponentProps = {\n\t/**\n\t * The name of the slot to fill into.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * Children elements or render function.\n\t */\n\tchildren?: ReactNode | ( ( fillProps: FillProps ) => ReactNode );\n};\n\nexport type SlotFillProviderProps = {\n\t/**\n\t * The children elements.\n\t */\n\tchildren: ReactNode;\n\n\t/**\n\t * Whether to pass slots to the parent provider if existent.\n\t */\n\tpassthrough?: boolean;\n};\n\nexport type SlotRef = RefObject< HTMLElement >;\nexport type Rerenderable = { rerender: () => void };\nexport type FillInstance = {};\n\nexport type SlotFillBubblesVirtuallyContext = {\n\tslots: ObservableMap< SlotKey, { ref: SlotRef; fillProps: FillProps } >;\n\tfills: ObservableMap< SlotKey, FillInstance[] >;\n\tregisterSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tunregisterSlot: ( name: SlotKey, ref: SlotRef ) => void;\n\tupdateSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\n\t/**\n\t * This helps the provider know if it's using the default context value or not.\n\t */\n\tisDefault?: boolean;\n};\n\nexport type BaseSlotFillContext = {\n\tregisterSlot: ( name: SlotKey, slot: Rerenderable ) => void;\n\tunregisterSlot: ( name: SlotKey, slot: Rerenderable ) => void;\n\tregisterFill: ( name: SlotKey, instance: FillComponentProps ) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillComponentProps ) => void;\n\tgetSlot: ( name: SlotKey ) => Rerenderable | undefined;\n\tgetFills: (\n\t\tname: SlotKey,\n\t\tslotInstance: Rerenderable\n\t) => FillComponentProps[];\n\tsubscribe: ( listener: () => void ) => () => void;\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/slot-fill/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type { ObservableMap } from '@wordpress/compose';\n\nexport type DistributiveOmit< T, K extends keyof any > = T extends any\n\t? Omit< T, K >\n\t: never;\n\nexport type SlotKey = string | symbol;\n\nexport type FillProps = Record< string, any >;\n\ntype SlotPropBase = {\n\t/**\n\t * Slot name.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * props to pass from `Slot` to `Fill`.\n\t *\n\t * @default {}\n\t */\n\tfillProps?: FillProps;\n};\n\nexport type SlotComponentProps =\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually: true;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: never;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: string;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: React.CSSProperties;\n\t  } )\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually?: false;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: ( fills: ReactNode ) => ReactNode;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: never;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: never;\n\t  } );\n\nexport type FillChildren =\n\t| ReactNode\n\t| ( ( fillProps: FillProps ) => ReactNode );\n\nexport type FillComponentProps = {\n\t/**\n\t * The name of the slot to fill into.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * Children elements or render function.\n\t */\n\tchildren?: FillChildren;\n};\n\nexport type SlotFillProviderProps = {\n\t/**\n\t * The children elements.\n\t */\n\tchildren: ReactNode;\n\n\t/**\n\t * Whether to pass slots to the parent provider if existent.\n\t */\n\tpassthrough?: boolean;\n};\n\nexport type SlotRef = RefObject< HTMLElement >;\nexport type FillInstance = {};\nexport type BaseSlotInstance = {};\n\nexport type SlotFillBubblesVirtuallyContext = {\n\tslots: ObservableMap< SlotKey, { ref: SlotRef; fillProps: FillProps } >;\n\tfills: ObservableMap< SlotKey, FillInstance[] >;\n\tregisterSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tunregisterSlot: ( name: SlotKey, ref: SlotRef ) => void;\n\tupdateSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\n\t/**\n\t * This helps the provider know if it's using the default context value or not.\n\t */\n\tisDefault?: boolean;\n};\n\nexport type BaseSlotFillContext = {\n\tslots: ObservableMap< SlotKey, BaseSlotInstance >;\n\tfills: ObservableMap<\n\t\tSlotKey,\n\t\t{ instance: FillInstance; children: FillChildren }[]\n\t>;\n\tregisterSlot: ( name: SlotKey, slot: BaseSlotInstance ) => void;\n\tunregisterSlot: ( name: SlotKey, slot: BaseSlotInstance ) => void;\n\tregisterFill: (\n\t\tname: SlotKey,\n\t\tinstance: FillInstance,\n\t\tchildren: FillChildren\n\t) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\tupdateFill: (\n\t\tname: SlotKey,\n\t\tinstance: FillInstance,\n\t\tchildren: FillChildren\n\t) => void;\n};\n"],"mappings":"","ignoreList":[]}