@wordpress/components 28.6.0 → 28.8.1-next.1f6eadc42.0

package/build-module/alignment-matrix-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","useStoreState","__","isRTL","useInstanceId","Cell","Composite","useCompositeStore","Root","Row","AlignmentMatrixControlIcon","GRID","getItemId","getItemValue","jsx","_jsx","AlignmentMatrixControl","className","id","label","defaultValue","value","onChange","width","props","baseId","compositeStore","defaultActiveId","activeId","setActiveId","nextActiveId","nextValue","rtl","classes","store","render","role","size","children","map","cells","index","cell","cellId","isActive","Icon"],"sources":["@wordpress/components/src/alignment-matrix-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { useStoreState } from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Cell from './cell';\nimport { Composite, useCompositeStore } from '../composite';\nimport { Root, Row } from './styles/alignment-matrix-control-styles';\nimport AlignmentMatrixControlIcon from './icon';\nimport { GRID, getItemId, getItemValue } from './utils';\nimport type { WordPressComponentProps } from '../context';\nimport type { AlignmentMatrixControlProps } from './types';\n\n/**\n *\n * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.\n *\n * ```jsx\n * import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * \tconst [ alignment, setAlignment ] = useState( 'center center' );\n *\n * \treturn (\n * \t\t<AlignmentMatrixControl\n * \t\t\tvalue={ alignment }\n * \t\t\tonChange={ setAlignment }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport function AlignmentMatrixControl( {\n\tclassName,\n\tid,\n\tlabel = __( 'Alignment Matrix Control' ),\n\tdefaultValue = 'center center',\n\tvalue,\n\tonChange,\n\twidth = 92,\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlProps, 'div', false > ) {\n\tconst baseId = useInstanceId(\n\t\tAlignmentMatrixControl,\n\t\t'alignment-matrix-control',\n\t\tid\n\t);\n\n\tconst compositeStore = useCompositeStore( {\n\t\tdefaultActiveId: getItemId( baseId, defaultValue ),\n\t\tactiveId: getItemId( baseId, value ),\n\t\tsetActiveId: ( nextActiveId ) => {\n\t\t\tconst nextValue = getItemValue( baseId, nextActiveId );\n\t\t\tif ( nextValue ) {\n\t\t\t\tonChange?.( nextValue );\n\t\t\t}\n\t\t},\n\t\trtl: isRTL(),\n\t} );\n\n\tconst activeId = useStoreState( compositeStore, 'activeId' );\n\n\tconst classes = clsx( 'component-alignment-matrix-control', className );\n\n\treturn (\n\t\t<Composite\n\t\t\tstore={ compositeStore }\n\t\t\trender={\n\t\t\t\t<Root\n\t\t\t\t\t{ ...props }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\tid={ baseId }\n\t\t\t\t\trole=\"grid\"\n\t\t\t\t\tsize={ width }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t{ GRID.map( ( cells, index ) => (\n\t\t\t\t<Composite.Row render={ <Row role=\"row\" /> } key={ index }>\n\t\t\t\t\t{ cells.map( ( cell ) => {\n\t\t\t\t\t\tconst cellId = getItemId( baseId, cell );\n\t\t\t\t\t\tconst isActive = cellId === activeId;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Cell\n\t\t\t\t\t\t\t\tid={ cellId }\n\t\t\t\t\t\t\t\tisActive={ isActive }\n\t\t\t\t\t\t\t\tkey={ cell }\n\t\t\t\t\t\t\t\tvalue={ cell }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Composite.Row>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nAlignmentMatrixControl.Icon = AlignmentMatrixControlIcon;\n\nexport default AlignmentMatrixControl;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AACvB,SAASC,aAAa,QAAQ,gBAAgB;;AAE9C;AACA;AACA;AACA,SAASC,EAAE,EAAEC,KAAK,QAAQ,iBAAiB;AAC3C,SAASC,aAAa,QAAQ,oBAAoB;;AAElD;AACA;AACA;AACA,OAAOC,IAAI,MAAM,QAAQ;AACzB,SAASC,SAAS,EAAEC,iBAAiB,QAAQ,cAAc;AAC3D,SAASC,IAAI,EAAEC,GAAG,QAAQ,0CAA0C;AACpE,OAAOC,0BAA0B,MAAM,QAAQ;AAC/C,SAASC,IAAI,EAAEC,SAAS,EAAEC,YAAY,QAAQ,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIxD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,sBAAsBA,CAAE;EACvCC,SAAS;EACTC,EAAE;EACFC,KAAK,GAAGjB,EAAE,CAAE,0BAA2B,CAAC;EACxCkB,YAAY,GAAG,eAAe;EAC9BC,KAAK;EACLC,QAAQ;EACRC,KAAK,GAAG,EAAE;EACV,GAAGC;AACkE,CAAC,EAAG;EACzE,MAAMC,MAAM,GAAGrB,aAAa,CAC3BY,sBAAsB,EACtB,0BAA0B,EAC1BE,EACD,CAAC;EAED,MAAMQ,cAAc,GAAGnB,iBAAiB,CAAE;IACzCoB,eAAe,EAAEf,SAAS,CAAEa,MAAM,EAAEL,YAAa,CAAC;IAClDQ,QAAQ,EAAEhB,SAAS,CAAEa,MAAM,EAAEJ,KAAM,CAAC;IACpCQ,WAAW,EAAIC,YAAY,IAAM;MAChC,MAAMC,SAAS,GAAGlB,YAAY,CAAEY,MAAM,EAAEK,YAAa,CAAC;MACtD,IAAKC,SAAS,EAAG;QAChBT,QAAQ,GAAIS,SAAU,CAAC;MACxB;IACD,CAAC;IACDC,GAAG,EAAE7B,KAAK,CAAC;EACZ,CAAE,CAAC;EAEH,MAAMyB,QAAQ,GAAG3B,aAAa,CAAEyB,cAAc,EAAE,UAAW,CAAC;EAE5D,MAAMO,OAAO,GAAGjC,IAAI,CAAE,oCAAoC,EAAEiB,SAAU,CAAC;EAEvE,oBACCF,IAAA,CAACT,SAAS;IACT4B,KAAK,EAAGR,cAAgB;IACxBS,MAAM,eACLpB,IAAA,CAACP,IAAI;MAAA,GACCgB,KAAK;MACV,cAAaL,KAAO;MACpBF,SAAS,EAAGgB,OAAS;MACrBf,EAAE,EAAGO,MAAQ;MACbW,IAAI,EAAC,MAAM;MACXC,IAAI,EAAGd;IAAO,CACd,CACD;IAAAe,QAAA,EAEC3B,IAAI,CAAC4B,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,kBACzB1B,IAAA,CAACT,SAAS,CAACG,GAAG;MAAC0B,MAAM,eAAGpB,IAAA,CAACN,GAAG;QAAC2B,IAAI,EAAC;MAAK,CAAE,CAAG;MAAAE,QAAA,EACzCE,KAAK,CAACD,GAAG,CAAIG,IAAI,IAAM;QACxB,MAAMC,MAAM,GAAG/B,SAAS,CAAEa,MAAM,EAAEiB,IAAK,CAAC;QACxC,MAAME,QAAQ,GAAGD,MAAM,KAAKf,QAAQ;QAEpC,oBACCb,IAAA,CAACV,IAAI;UACJa,EAAE,EAAGyB,MAAQ;UACbC,QAAQ,EAAGA,QAAU;UAErBvB,KAAK,EAAGqB;QAAM,GADRA,IAEN,CAAC;MAEJ,CAAE;IAAC,GAb+CD,KAcpC,CACd;EAAC,CACO,CAAC;AAEd;AAEAzB,sBAAsB,CAAC6B,IAAI,GAAGnC,0BAA0B;AAExD,eAAeM,sBAAsB","ignoreList":[]}
+{"version":3,"names":["clsx","__","isRTL","useInstanceId","useCallback","Cell","Composite","GridContainer","GridRow","AlignmentMatrixControlIcon","GRID","getItemId","getItemValue","jsx","_jsx","UnforwardedAlignmentMatrixControl","className","id","label","defaultValue","value","onChange","width","props","baseId","setActiveId","nextActiveId","nextValue","classes","defaultActiveId","activeId","rtl","render","role","size","children","map","cells","index","Row","cell","AlignmentMatrixControl","Object","assign","Icon","displayName"],"sources":["@wordpress/components/src/alignment-matrix-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Cell from './cell';\nimport { Composite } from '../composite';\nimport { GridContainer, GridRow } from './styles';\nimport AlignmentMatrixControlIcon from './icon';\nimport { GRID, getItemId, getItemValue } from './utils';\nimport type { WordPressComponentProps } from '../context';\nimport type { AlignmentMatrixControlProps } from './types';\n\nfunction UnforwardedAlignmentMatrixControl( {\n\tclassName,\n\tid,\n\tlabel = __( 'Alignment Matrix Control' ),\n\tdefaultValue = 'center center',\n\tvalue,\n\tonChange,\n\twidth = 92,\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlProps, 'div', false > ) {\n\tconst baseId = useInstanceId(\n\t\tUnforwardedAlignmentMatrixControl,\n\t\t'alignment-matrix-control',\n\t\tid\n\t);\n\n\tconst setActiveId = useCallback<\n\t\tNonNullable< React.ComponentProps< typeof Composite >[ 'setActiveId' ] >\n\t>(\n\t\t( nextActiveId ) => {\n\t\t\tconst nextValue = getItemValue( baseId, nextActiveId );\n\t\t\tif ( nextValue ) {\n\t\t\t\tonChange?.( nextValue );\n\t\t\t}\n\t\t},\n\t\t[ baseId, onChange ]\n\t);\n\n\tconst classes = clsx( 'component-alignment-matrix-control', className );\n\n\treturn (\n\t\t<Composite\n\t\t\tdefaultActiveId={ getItemId( baseId, defaultValue ) }\n\t\t\tactiveId={ getItemId( baseId, value ) }\n\t\t\tsetActiveId={ setActiveId }\n\t\t\trtl={ isRTL() }\n\t\t\trender={\n\t\t\t\t<GridContainer\n\t\t\t\t\t{ ...props }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\tid={ baseId }\n\t\t\t\t\trole=\"grid\"\n\t\t\t\t\tsize={ width }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t{ GRID.map( ( cells, index ) => (\n\t\t\t\t<Composite.Row render={ <GridRow role=\"row\" /> } key={ index }>\n\t\t\t\t\t{ cells.map( ( cell ) => (\n\t\t\t\t\t\t<Cell\n\t\t\t\t\t\t\tid={ getItemId( baseId, cell ) }\n\t\t\t\t\t\t\tkey={ cell }\n\t\t\t\t\t\t\tvalue={ cell }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</Composite.Row>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\n/**\n * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.\n *\n * ```jsx\n * import { AlignmentMatrixControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * \tconst [ alignment, setAlignment ] = useState( 'center center' );\n *\n * \treturn (\n * \t\t<AlignmentMatrixControl\n * \t\t\tvalue={ alignment }\n * \t\t\tonChange={ setAlignment }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const AlignmentMatrixControl = Object.assign(\n\tUnforwardedAlignmentMatrixControl,\n\t{\n\t\t/**\n\t\t * Render an alignment matrix as an icon.\n\t\t *\n\t\t * ```jsx\n\t\t * import { AlignmentMatrixControl } from '@wordpress/components';\n\t\t *\n\t\t * <Icon icon={<AlignmentMatrixControl.Icon value=\"top left\" />} />\n\t\t * ```\n\t\t */\n\t\tIcon: Object.assign( AlignmentMatrixControlIcon, {\n\t\t\tdisplayName: 'AlignmentMatrixControl.Icon',\n\t\t} ),\n\t}\n);\n\nexport default AlignmentMatrixControl;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,EAAE,EAAEC,KAAK,QAAQ,iBAAiB;AAC3C,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,WAAW,QAAQ,oBAAoB;;AAEhD;AACA;AACA;AACA,OAAOC,IAAI,MAAM,QAAQ;AACzB,SAASC,SAAS,QAAQ,cAAc;AACxC,SAASC,aAAa,EAAEC,OAAO,QAAQ,UAAU;AACjD,OAAOC,0BAA0B,MAAM,QAAQ;AAC/C,SAASC,IAAI,EAAEC,SAAS,EAAEC,YAAY,QAAQ,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIxD,SAASC,iCAAiCA,CAAE;EAC3CC,SAAS;EACTC,EAAE;EACFC,KAAK,GAAGjB,EAAE,CAAE,0BAA2B,CAAC;EACxCkB,YAAY,GAAG,eAAe;EAC9BC,KAAK;EACLC,QAAQ;EACRC,KAAK,GAAG,EAAE;EACV,GAAGC;AACkE,CAAC,EAAG;EACzE,MAAMC,MAAM,GAAGrB,aAAa,CAC3BY,iCAAiC,EACjC,0BAA0B,EAC1BE,EACD,CAAC;EAED,MAAMQ,WAAW,GAAGrB,WAAW,CAG5BsB,YAAY,IAAM;IACnB,MAAMC,SAAS,GAAGf,YAAY,CAAEY,MAAM,EAAEE,YAAa,CAAC;IACtD,IAAKC,SAAS,EAAG;MAChBN,QAAQ,GAAIM,SAAU,CAAC;IACxB;EACD,CAAC,EACD,CAAEH,MAAM,EAAEH,QAAQ,CACnB,CAAC;EAED,MAAMO,OAAO,GAAG5B,IAAI,CAAE,oCAAoC,EAAEgB,SAAU,CAAC;EAEvE,oBACCF,IAAA,CAACR,SAAS;IACTuB,eAAe,EAAGlB,SAAS,CAAEa,MAAM,EAAEL,YAAa,CAAG;IACrDW,QAAQ,EAAGnB,SAAS,CAAEa,MAAM,EAAEJ,KAAM,CAAG;IACvCK,WAAW,EAAGA,WAAa;IAC3BM,GAAG,EAAG7B,KAAK,CAAC,CAAG;IACf8B,MAAM,eACLlB,IAAA,CAACP,aAAa;MAAA,GACRgB,KAAK;MACV,cAAaL,KAAO;MACpBF,SAAS,EAAGY,OAAS;MACrBX,EAAE,EAAGO,MAAQ;MACbS,IAAI,EAAC,MAAM;MACXC,IAAI,EAAGZ;IAAO,CACd,CACD;IAAAa,QAAA,EAECzB,IAAI,CAAC0B,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,kBACzBxB,IAAA,CAACR,SAAS,CAACiC,GAAG;MAACP,MAAM,eAAGlB,IAAA,CAACN,OAAO;QAACyB,IAAI,EAAC;MAAK,CAAE,CAAG;MAAAE,QAAA,EAC7CE,KAAK,CAACD,GAAG,CAAII,IAAI,iBAClB1B,IAAA,CAACT,IAAI;QACJY,EAAE,EAAGN,SAAS,CAAEa,MAAM,EAAEgB,IAAK,CAAG;QAEhCpB,KAAK,EAAGoB;MAAM,GADRA,IAEN,CACA;IAAC,GAPmDF,KAQxC,CACd;EAAC,CACO,CAAC;AAEd;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMG,sBAAsB,GAAGC,MAAM,CAACC,MAAM,CAClD5B,iCAAiC,EACjC;EACC;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACE6B,IAAI,EAAEF,MAAM,CAACC,MAAM,CAAElC,0BAA0B,EAAE;IAChDoC,WAAW,EAAE;EACd,CAAE;AACH,CACD,CAAC;AAED,eAAeJ,sBAAsB","ignoreList":[]}

package/build-module/alignment-matrix-control/styles.js

@@ -0,0 +1,70 @@
+import _styled from "@emotion/styled/base";
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+/**
+ * External dependencies
+ */
+
+import { css } from '@emotion/react';
+
+/**
+ * Internal dependencies
+ */
+import { COLORS, CONFIG } from '../utils';
+// Grid structure
+
+const rootBase = ({
+  size = 92
+}) => /*#__PURE__*/css("direction:ltr;display:grid;grid-template-columns:repeat( 3, 1fr );grid-template-rows:repeat( 3, 1fr );box-sizing:border-box;width:", size, "px;aspect-ratio:1;border-radius:", CONFIG.radiusMedium, ";outline:none;" + (process.env.NODE_ENV === "production" ? "" : ";label:rootBase;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQnlDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgQ09MT1JTLCBDT05GSUcgfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgdHlwZSB7XG5cdEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wcyxcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wcyxcbn0gZnJvbSAnLi90eXBlcyc7XG5cbi8vIEdyaWQgc3RydWN0dXJlXG5cbmNvbnN0IHJvb3RCYXNlID0gKCB7IHNpemUgPSA5MiB9ICkgPT4gY3NzYFxuXHRkaXJlY3Rpb246IGx0cjtcblxuXHRkaXNwbGF5OiBncmlkO1xuXHRncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCggMywgMWZyICk7XG5cdGdyaWQtdGVtcGxhdGUtcm93czogcmVwZWF0KCAzLCAxZnIgKTtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgc2l6ZSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRib3JkZXItcmFkaXVzOiAkeyBDT05GSUcucmFkaXVzTWVkaXVtIH07XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8IHtcblx0c2l6ZT86IEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wc1sgJ3dpZHRoJyBdO1xuXHRkaXNhYmxlUG9pbnRlckV2ZW50cz86IEFsaWdubWVudE1hdHJpeENvbnRyb2xJY29uUHJvcHNbICdkaXNhYmxlUG9pbnRlckV2ZW50cycgXTtcbn0gPmBcblx0JHsgcm9vdEJhc2UgfVxuXG5cdGJvcmRlcjogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmRpc2FibGVQb2ludGVyRXZlbnRzXG5cdFx0XHQ/IGNzc2BgXG5cdFx0XHQ6IGNzc2Bcblx0XHRcdFx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0XHQgIGAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEdyaWRSb3cgPSBzdHlsZWQuZGl2YFxuXHRncmlkLWNvbHVtbjogMSAvIC0xO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcbmA7XG5cbi8vIENlbGxcbmV4cG9ydCBjb25zdCBDZWxsID0gc3R5bGVkLnNwYW5gXG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuXHRkaXNwbGF5OiBmbGV4O1xuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRtYXJnaW46IDA7XG5cdHBhZGRpbmc6IDA7XG5cblx0YXBwZWFyYW5jZTogbm9uZTtcblx0Ym9yZGVyOiBub25lO1xuXHRvdXRsaW5lOiBub25lO1xuYDtcblxuY29uc3QgUE9JTlRfU0laRSA9IDY7XG5leHBvcnQgY29uc3QgUG9pbnQgPSBzdHlsZWQuc3BhbmBcblx0ZGlzcGxheTogYmxvY2s7XG5cdGNvbnRhaW46IHN0cmljdDtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgUE9JTlRfU0laRSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRtYXJnaW46IGF1dG87XG5cblx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5ncmF5WyA0MDAgXSB9O1xuXG5cdC8qIFVzZSBib3JkZXIgaW5zdGVhZCBvZiBiYWNrZ3JvdW5kIGNvbG9yIHNvIHRoYXQgdGhlIHBvaW50IHNob3dzXG5cdGluIFdpbmRvd3MgSGlnaCBDb250cmFzdCBNb2RlICovXG5cdGJvcmRlcjogJHsgUE9JTlRfU0laRSAvIDIgfXB4IHNvbGlkIGN1cnJlbnRDb2xvcjtcblxuXHQvKiBIaWdobGlnaHQgYWN0aXZlIGl0ZW0gKi9cblx0JHsgQ2VsbCB9W2RhdGEtYWN0aXZlLWl0ZW1dICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0XHR0cmFuc2Zvcm06IHNjYWxlKCBjYWxjKCA1IC8gMyApICk7XG5cdH1cblxuXHQvKiBIb3ZlciBzdHlsZXMgZm9yIG5vbi1hY3RpdmUgaXRlbXMgKi9cblx0JHsgQ2VsbCB9Om5vdChbZGF0YS1hY3RpdmUtaXRlbV0pOmhvdmVyICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdH1cblxuXHQvKiBTaG93IGFuIG91dGxpbmUgb25seSB3aGVuIGludGVyYWN0aW5nIHdpdGgga2V5Ym9hcmQgKi9cblx0JHsgQ2VsbCB9W2RhdGEtZm9jdXMtdmlzaWJsZV0gJiB7XG5cdFx0b3V0bGluZTogMXB4IHNvbGlkICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0XHRvdXRsaW5lLW9mZnNldDogMXB4O1xuXHR9XG5cblx0QG1lZGlhIG5vdCAoIHByZWZlcnMtcmVkdWNlZC1tb3Rpb24gKSB7XG5cdFx0dHJhbnNpdGlvbi1wcm9wZXJ0eTogY29sb3IsIHRyYW5zZm9ybTtcblx0XHR0cmFuc2l0aW9uLWR1cmF0aW9uOiAxMjBtcztcblx0XHR0cmFuc2l0aW9uLXRpbWluZy1mdW5jdGlvbjogbGluZWFyO1xuXHR9XG5gO1xuIl19 */");
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "e0dnmk",
+  styles: "cursor:pointer"
+} : {
+  name: "1h7pcau-GridContainer",
+  styles: "cursor:pointer;label:GridContainer;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQ1EiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9hbGlnbm1lbnQtbWF0cml4LWNvbnRyb2wvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHtcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbFByb3BzLFxuXHRBbGlnbm1lbnRNYXRyaXhDb250cm9sSWNvblByb3BzLFxufSBmcm9tICcuL3R5cGVzJztcblxuLy8gR3JpZCBzdHJ1Y3R1cmVcblxuY29uc3Qgcm9vdEJhc2UgPSAoIHsgc2l6ZSA9IDkyIH0gKSA9PiBjc3NgXG5cdGRpcmVjdGlvbjogbHRyO1xuXG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcblx0Z3JpZC10ZW1wbGF0ZS1yb3dzOiByZXBlYXQoIDMsIDFmciApO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHdpZHRoOiAkeyBzaXplIH1weDtcblx0YXNwZWN0LXJhdGlvOiAxO1xuXG5cdGJvcmRlci1yYWRpdXM6ICR7IENPTkZJRy5yYWRpdXNNZWRpdW0gfTtcblx0b3V0bGluZTogbm9uZTtcbmA7XG5cbmV4cG9ydCBjb25zdCBHcmlkQ29udGFpbmVyID0gc3R5bGVkLmRpdjwge1xuXHRzaXplPzogQWxpZ25tZW50TWF0cml4Q29udHJvbFByb3BzWyAnd2lkdGgnIF07XG5cdGRpc2FibGVQb2ludGVyRXZlbnRzPzogQWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wc1sgJ2Rpc2FibGVQb2ludGVyRXZlbnRzJyBdO1xufSA+YFxuXHQkeyByb290QmFzZSB9XG5cblx0Ym9yZGVyOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG5cblx0JHsgKCBwcm9wcyApID0+XG5cdFx0cHJvcHMuZGlzYWJsZVBvaW50ZXJFdmVudHNcblx0XHRcdD8gY3NzYGBcblx0XHRcdDogY3NzYFxuXHRcdFx0XHRcdGN1cnNvcjogcG9pbnRlcjtcblx0XHRcdCAgYCB9XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZFJvdyA9IHN0eWxlZC5kaXZgXG5cdGdyaWQtY29sdW1uOiAxIC8gLTE7XG5cblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0ZGlzcGxheTogZ3JpZDtcblx0Z3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoIDMsIDFmciApO1xuYDtcblxuLy8gQ2VsbFxuZXhwb3J0IGNvbnN0IENlbGwgPSBzdHlsZWQuc3BhbmBcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdG1hcmdpbjogMDtcblx0cGFkZGluZzogMDtcblxuXHRhcHBlYXJhbmNlOiBub25lO1xuXHRib3JkZXI6IG5vbmU7XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5jb25zdCBQT0lOVF9TSVpFID0gNjtcbmV4cG9ydCBjb25zdCBQb2ludCA9IHN0eWxlZC5zcGFuYFxuXHRkaXNwbGF5OiBibG9jaztcblx0Y29udGFpbjogc3RyaWN0O1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHdpZHRoOiAkeyBQT0lOVF9TSVpFIH1weDtcblx0YXNwZWN0LXJhdGlvOiAxO1xuXG5cdG1hcmdpbjogYXV0bztcblxuXHRjb2xvcjogJHsgQ09MT1JTLnRoZW1lLmdyYXlbIDQwMCBdIH07XG5cblx0LyogVXNlIGJvcmRlciBpbnN0ZWFkIG9mIGJhY2tncm91bmQgY29sb3Igc28gdGhhdCB0aGUgcG9pbnQgc2hvd3Ncblx0aW4gV2luZG93cyBIaWdoIENvbnRyYXN0IE1vZGUgKi9cblx0Ym9yZGVyOiAkeyBQT0lOVF9TSVpFIC8gMiB9cHggc29saWQgY3VycmVudENvbG9yO1xuXG5cdC8qIEhpZ2hsaWdodCBhY3RpdmUgaXRlbSAqL1xuXHQkeyBDZWxsIH1bZGF0YS1hY3RpdmUtaXRlbV0gJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA5MDAgXSB9O1xuXHRcdHRyYW5zZm9ybTogc2NhbGUoIGNhbGMoIDUgLyAzICkgKTtcblx0fVxuXG5cdC8qIEhvdmVyIHN0eWxlcyBmb3Igbm9uLWFjdGl2ZSBpdGVtcyAqL1xuXHQkeyBDZWxsIH06bm90KFtkYXRhLWFjdGl2ZS1pdGVtXSk6aG92ZXIgJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0fVxuXG5cdC8qIFNob3cgYW4gb3V0bGluZSBvbmx5IHdoZW4gaW50ZXJhY3Rpbmcgd2l0aCBrZXlib2FyZCAqL1xuXHQkeyBDZWxsIH1bZGF0YS1mb2N1cy12aXNpYmxlXSAmIHtcblx0XHRvdXRsaW5lOiAxcHggc29saWQgJHsgQ09MT1JTLnRoZW1lLmFjY2VudCB9O1xuXHRcdG91dGxpbmUtb2Zmc2V0OiAxcHg7XG5cdH1cblxuXHRAbWVkaWEgbm90ICggcHJlZmVycy1yZWR1Y2VkLW1vdGlvbiApIHtcblx0XHR0cmFuc2l0aW9uLXByb3BlcnR5OiBjb2xvciwgdHJhbnNmb3JtO1xuXHRcdHRyYW5zaXRpb24tZHVyYXRpb246IDEyMG1zO1xuXHRcdHRyYW5zaXRpb24tdGltaW5nLWZ1bmN0aW9uOiBsaW5lYXI7XG5cdH1cbmA7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+export const GridContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "e1r95csn3"
+} : {
+  target: "e1r95csn3",
+  label: "GridContainer"
+})(rootBase, " border:1px solid transparent;", props => props.disablePointerEvents ? /*#__PURE__*/css(process.env.NODE_ENV === "production" ? "" : ";label:GridContainer;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQ1EiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9hbGlnbm1lbnQtbWF0cml4LWNvbnRyb2wvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHtcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbFByb3BzLFxuXHRBbGlnbm1lbnRNYXRyaXhDb250cm9sSWNvblByb3BzLFxufSBmcm9tICcuL3R5cGVzJztcblxuLy8gR3JpZCBzdHJ1Y3R1cmVcblxuY29uc3Qgcm9vdEJhc2UgPSAoIHsgc2l6ZSA9IDkyIH0gKSA9PiBjc3NgXG5cdGRpcmVjdGlvbjogbHRyO1xuXG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcblx0Z3JpZC10ZW1wbGF0ZS1yb3dzOiByZXBlYXQoIDMsIDFmciApO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHdpZHRoOiAkeyBzaXplIH1weDtcblx0YXNwZWN0LXJhdGlvOiAxO1xuXG5cdGJvcmRlci1yYWRpdXM6ICR7IENPTkZJRy5yYWRpdXNNZWRpdW0gfTtcblx0b3V0bGluZTogbm9uZTtcbmA7XG5cbmV4cG9ydCBjb25zdCBHcmlkQ29udGFpbmVyID0gc3R5bGVkLmRpdjwge1xuXHRzaXplPzogQWxpZ25tZW50TWF0cml4Q29udHJvbFByb3BzWyAnd2lkdGgnIF07XG5cdGRpc2FibGVQb2ludGVyRXZlbnRzPzogQWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wc1sgJ2Rpc2FibGVQb2ludGVyRXZlbnRzJyBdO1xufSA+YFxuXHQkeyByb290QmFzZSB9XG5cblx0Ym9yZGVyOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG5cblx0JHsgKCBwcm9wcyApID0+XG5cdFx0cHJvcHMuZGlzYWJsZVBvaW50ZXJFdmVudHNcblx0XHRcdD8gY3NzYGBcblx0XHRcdDogY3NzYFxuXHRcdFx0XHRcdGN1cnNvcjogcG9pbnRlcjtcblx0XHRcdCAgYCB9XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZFJvdyA9IHN0eWxlZC5kaXZgXG5cdGdyaWQtY29sdW1uOiAxIC8gLTE7XG5cblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0ZGlzcGxheTogZ3JpZDtcblx0Z3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoIDMsIDFmciApO1xuYDtcblxuLy8gQ2VsbFxuZXhwb3J0IGNvbnN0IENlbGwgPSBzdHlsZWQuc3BhbmBcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdG1hcmdpbjogMDtcblx0cGFkZGluZzogMDtcblxuXHRhcHBlYXJhbmNlOiBub25lO1xuXHRib3JkZXI6IG5vbmU7XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5jb25zdCBQT0lOVF9TSVpFID0gNjtcbmV4cG9ydCBjb25zdCBQb2ludCA9IHN0eWxlZC5zcGFuYFxuXHRkaXNwbGF5OiBibG9jaztcblx0Y29udGFpbjogc3RyaWN0O1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHdpZHRoOiAkeyBQT0lOVF9TSVpFIH1weDtcblx0YXNwZWN0LXJhdGlvOiAxO1xuXG5cdG1hcmdpbjogYXV0bztcblxuXHRjb2xvcjogJHsgQ09MT1JTLnRoZW1lLmdyYXlbIDQwMCBdIH07XG5cblx0LyogVXNlIGJvcmRlciBpbnN0ZWFkIG9mIGJhY2tncm91bmQgY29sb3Igc28gdGhhdCB0aGUgcG9pbnQgc2hvd3Ncblx0aW4gV2luZG93cyBIaWdoIENvbnRyYXN0IE1vZGUgKi9cblx0Ym9yZGVyOiAkeyBQT0lOVF9TSVpFIC8gMiB9cHggc29saWQgY3VycmVudENvbG9yO1xuXG5cdC8qIEhpZ2hsaWdodCBhY3RpdmUgaXRlbSAqL1xuXHQkeyBDZWxsIH1bZGF0YS1hY3RpdmUtaXRlbV0gJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA5MDAgXSB9O1xuXHRcdHRyYW5zZm9ybTogc2NhbGUoIGNhbGMoIDUgLyAzICkgKTtcblx0fVxuXG5cdC8qIEhvdmVyIHN0eWxlcyBmb3Igbm9uLWFjdGl2ZSBpdGVtcyAqL1xuXHQkeyBDZWxsIH06bm90KFtkYXRhLWFjdGl2ZS1pdGVtXSk6aG92ZXIgJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0fVxuXG5cdC8qIFNob3cgYW4gb3V0bGluZSBvbmx5IHdoZW4gaW50ZXJhY3Rpbmcgd2l0aCBrZXlib2FyZCAqL1xuXHQkeyBDZWxsIH1bZGF0YS1mb2N1cy12aXNpYmxlXSAmIHtcblx0XHRvdXRsaW5lOiAxcHggc29saWQgJHsgQ09MT1JTLnRoZW1lLmFjY2VudCB9O1xuXHRcdG91dGxpbmUtb2Zmc2V0OiAxcHg7XG5cdH1cblxuXHRAbWVkaWEgbm90ICggcHJlZmVycy1yZWR1Y2VkLW1vdGlvbiApIHtcblx0XHR0cmFuc2l0aW9uLXByb3BlcnR5OiBjb2xvciwgdHJhbnNmb3JtO1xuXHRcdHRyYW5zaXRpb24tZHVyYXRpb246IDEyMG1zO1xuXHRcdHRyYW5zaXRpb24tdGltaW5nLWZ1bmN0aW9uOiBsaW5lYXI7XG5cdH1cbmA7XG4iXX0= */") : _ref, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQ0ciLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9hbGlnbm1lbnQtbWF0cml4LWNvbnRyb2wvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHtcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbFByb3BzLFxuXHRBbGlnbm1lbnRNYXRyaXhDb250cm9sSWNvblByb3BzLFxufSBmcm9tICcuL3R5cGVzJztcblxuLy8gR3JpZCBzdHJ1Y3R1cmVcblxuY29uc3Qgcm9vdEJhc2UgPSAoIHsgc2l6ZSA9IDkyIH0gKSA9PiBjc3NgXG5cdGRpcmVjdGlvbjogbHRyO1xuXG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcblx0Z3JpZC10ZW1wbGF0ZS1yb3dzOiByZXBlYXQoIDMsIDFmciApO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHdpZHRoOiAkeyBzaXplIH1weDtcblx0YXNwZWN0LXJhdGlvOiAxO1xuXG5cdGJvcmRlci1yYWRpdXM6ICR7IENPTkZJRy5yYWRpdXNNZWRpdW0gfTtcblx0b3V0bGluZTogbm9uZTtcbmA7XG5cbmV4cG9ydCBjb25zdCBHcmlkQ29udGFpbmVyID0gc3R5bGVkLmRpdjwge1xuXHRzaXplPzogQWxpZ25tZW50TWF0cml4Q29udHJvbFByb3BzWyAnd2lkdGgnIF07XG5cdGRpc2FibGVQb2ludGVyRXZlbnRzPzogQWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wc1sgJ2Rpc2FibGVQb2ludGVyRXZlbnRzJyBdO1xufSA+YFxuXHQkeyByb290QmFzZSB9XG5cblx0Ym9yZGVyOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG5cblx0JHsgKCBwcm9wcyApID0+XG5cdFx0cHJvcHMuZGlzYWJsZVBvaW50ZXJFdmVudHNcblx0XHRcdD8gY3NzYGBcblx0XHRcdDogY3NzYFxuXHRcdFx0XHRcdGN1cnNvcjogcG9pbnRlcjtcblx0XHRcdCAgYCB9XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZFJvdyA9IHN0eWxlZC5kaXZgXG5cdGdyaWQtY29sdW1uOiAxIC8gLTE7XG5cblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0ZGlzcGxheTogZ3JpZDtcblx0Z3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoIDMsIDFmciApO1xuYDtcblxuLy8gQ2VsbFxuZXhwb3J0IGNvbnN0IENlbGwgPSBzdHlsZWQuc3BhbmBcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdG1hcmdpbjogMDtcblx0cGFkZGluZzogMDtcblxuXHRhcHBlYXJhbmNlOiBub25lO1xuXHRib3JkZXI6IG5vbmU7XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5jb25zdCBQT0lOVF9TSVpFID0gNjtcbmV4cG9ydCBjb25zdCBQb2ludCA9IHN0eWxlZC5zcGFuYFxuXHRkaXNwbGF5OiBibG9jaztcblx0Y29udGFpbjogc3RyaWN0O1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHdpZHRoOiAkeyBQT0lOVF9TSVpFIH1weDtcblx0YXNwZWN0LXJhdGlvOiAxO1xuXG5cdG1hcmdpbjogYXV0bztcblxuXHRjb2xvcjogJHsgQ09MT1JTLnRoZW1lLmdyYXlbIDQwMCBdIH07XG5cblx0LyogVXNlIGJvcmRlciBpbnN0ZWFkIG9mIGJhY2tncm91bmQgY29sb3Igc28gdGhhdCB0aGUgcG9pbnQgc2hvd3Ncblx0aW4gV2luZG93cyBIaWdoIENvbnRyYXN0IE1vZGUgKi9cblx0Ym9yZGVyOiAkeyBQT0lOVF9TSVpFIC8gMiB9cHggc29saWQgY3VycmVudENvbG9yO1xuXG5cdC8qIEhpZ2hsaWdodCBhY3RpdmUgaXRlbSAqL1xuXHQkeyBDZWxsIH1bZGF0YS1hY3RpdmUtaXRlbV0gJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA5MDAgXSB9O1xuXHRcdHRyYW5zZm9ybTogc2NhbGUoIGNhbGMoIDUgLyAzICkgKTtcblx0fVxuXG5cdC8qIEhvdmVyIHN0eWxlcyBmb3Igbm9uLWFjdGl2ZSBpdGVtcyAqL1xuXHQkeyBDZWxsIH06bm90KFtkYXRhLWFjdGl2ZS1pdGVtXSk6aG92ZXIgJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0fVxuXG5cdC8qIFNob3cgYW4gb3V0bGluZSBvbmx5IHdoZW4gaW50ZXJhY3Rpbmcgd2l0aCBrZXlib2FyZCAqL1xuXHQkeyBDZWxsIH1bZGF0YS1mb2N1cy12aXNpYmxlXSAmIHtcblx0XHRvdXRsaW5lOiAxcHggc29saWQgJHsgQ09MT1JTLnRoZW1lLmFjY2VudCB9O1xuXHRcdG91dGxpbmUtb2Zmc2V0OiAxcHg7XG5cdH1cblxuXHRAbWVkaWEgbm90ICggcHJlZmVycy1yZWR1Y2VkLW1vdGlvbiApIHtcblx0XHR0cmFuc2l0aW9uLXByb3BlcnR5OiBjb2xvciwgdHJhbnNmb3JtO1xuXHRcdHRyYW5zaXRpb24tZHVyYXRpb246IDEyMG1zO1xuXHRcdHRyYW5zaXRpb24tdGltaW5nLWZ1bmN0aW9uOiBsaW5lYXI7XG5cdH1cbmA7XG4iXX0= */"));
+export const GridRow = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "e1r95csn2"
+} : {
+  target: "e1r95csn2",
+  label: "GridRow"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1fbxn64",
+  styles: "grid-column:1/-1;box-sizing:border-box;display:grid;grid-template-columns:repeat( 3, 1fr )"
+} : {
+  name: "1fbxn64",
+  styles: "grid-column:1/-1;box-sizing:border-box;display:grid;grid-template-columns:repeat( 3, 1fr )",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRGlDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgQ09MT1JTLCBDT05GSUcgfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgdHlwZSB7XG5cdEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wcyxcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wcyxcbn0gZnJvbSAnLi90eXBlcyc7XG5cbi8vIEdyaWQgc3RydWN0dXJlXG5cbmNvbnN0IHJvb3RCYXNlID0gKCB7IHNpemUgPSA5MiB9ICkgPT4gY3NzYFxuXHRkaXJlY3Rpb246IGx0cjtcblxuXHRkaXNwbGF5OiBncmlkO1xuXHRncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCggMywgMWZyICk7XG5cdGdyaWQtdGVtcGxhdGUtcm93czogcmVwZWF0KCAzLCAxZnIgKTtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgc2l6ZSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRib3JkZXItcmFkaXVzOiAkeyBDT05GSUcucmFkaXVzTWVkaXVtIH07XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8IHtcblx0c2l6ZT86IEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wc1sgJ3dpZHRoJyBdO1xuXHRkaXNhYmxlUG9pbnRlckV2ZW50cz86IEFsaWdubWVudE1hdHJpeENvbnRyb2xJY29uUHJvcHNbICdkaXNhYmxlUG9pbnRlckV2ZW50cycgXTtcbn0gPmBcblx0JHsgcm9vdEJhc2UgfVxuXG5cdGJvcmRlcjogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmRpc2FibGVQb2ludGVyRXZlbnRzXG5cdFx0XHQ/IGNzc2BgXG5cdFx0XHQ6IGNzc2Bcblx0XHRcdFx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0XHQgIGAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEdyaWRSb3cgPSBzdHlsZWQuZGl2YFxuXHRncmlkLWNvbHVtbjogMSAvIC0xO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcbmA7XG5cbi8vIENlbGxcbmV4cG9ydCBjb25zdCBDZWxsID0gc3R5bGVkLnNwYW5gXG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuXHRkaXNwbGF5OiBmbGV4O1xuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRtYXJnaW46IDA7XG5cdHBhZGRpbmc6IDA7XG5cblx0YXBwZWFyYW5jZTogbm9uZTtcblx0Ym9yZGVyOiBub25lO1xuXHRvdXRsaW5lOiBub25lO1xuYDtcblxuY29uc3QgUE9JTlRfU0laRSA9IDY7XG5leHBvcnQgY29uc3QgUG9pbnQgPSBzdHlsZWQuc3BhbmBcblx0ZGlzcGxheTogYmxvY2s7XG5cdGNvbnRhaW46IHN0cmljdDtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgUE9JTlRfU0laRSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRtYXJnaW46IGF1dG87XG5cblx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5ncmF5WyA0MDAgXSB9O1xuXG5cdC8qIFVzZSBib3JkZXIgaW5zdGVhZCBvZiBiYWNrZ3JvdW5kIGNvbG9yIHNvIHRoYXQgdGhlIHBvaW50IHNob3dzXG5cdGluIFdpbmRvd3MgSGlnaCBDb250cmFzdCBNb2RlICovXG5cdGJvcmRlcjogJHsgUE9JTlRfU0laRSAvIDIgfXB4IHNvbGlkIGN1cnJlbnRDb2xvcjtcblxuXHQvKiBIaWdobGlnaHQgYWN0aXZlIGl0ZW0gKi9cblx0JHsgQ2VsbCB9W2RhdGEtYWN0aXZlLWl0ZW1dICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0XHR0cmFuc2Zvcm06IHNjYWxlKCBjYWxjKCA1IC8gMyApICk7XG5cdH1cblxuXHQvKiBIb3ZlciBzdHlsZXMgZm9yIG5vbi1hY3RpdmUgaXRlbXMgKi9cblx0JHsgQ2VsbCB9Om5vdChbZGF0YS1hY3RpdmUtaXRlbV0pOmhvdmVyICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdH1cblxuXHQvKiBTaG93IGFuIG91dGxpbmUgb25seSB3aGVuIGludGVyYWN0aW5nIHdpdGgga2V5Ym9hcmQgKi9cblx0JHsgQ2VsbCB9W2RhdGEtZm9jdXMtdmlzaWJsZV0gJiB7XG5cdFx0b3V0bGluZTogMXB4IHNvbGlkICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0XHRvdXRsaW5lLW9mZnNldDogMXB4O1xuXHR9XG5cblx0QG1lZGlhIG5vdCAoIHByZWZlcnMtcmVkdWNlZC1tb3Rpb24gKSB7XG5cdFx0dHJhbnNpdGlvbi1wcm9wZXJ0eTogY29sb3IsIHRyYW5zZm9ybTtcblx0XHR0cmFuc2l0aW9uLWR1cmF0aW9uOiAxMjBtcztcblx0XHR0cmFuc2l0aW9uLXRpbWluZy1mdW5jdGlvbjogbGluZWFyO1xuXHR9XG5gO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+// Cell
+export const Cell = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "production" ? {
+  target: "e1r95csn1"
+} : {
+  target: "e1r95csn1",
+  label: "Cell"
+})(process.env.NODE_ENV === "production" ? {
+  name: "e2kws5",
+  styles: "position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0;padding:0;appearance:none;border:none;outline:none"
+} : {
+  name: "e2kws5",
+  styles: "position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0;padding:0;appearance:none;border:none;outline:none",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5RCtCIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgQ09MT1JTLCBDT05GSUcgfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgdHlwZSB7XG5cdEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wcyxcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wcyxcbn0gZnJvbSAnLi90eXBlcyc7XG5cbi8vIEdyaWQgc3RydWN0dXJlXG5cbmNvbnN0IHJvb3RCYXNlID0gKCB7IHNpemUgPSA5MiB9ICkgPT4gY3NzYFxuXHRkaXJlY3Rpb246IGx0cjtcblxuXHRkaXNwbGF5OiBncmlkO1xuXHRncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCggMywgMWZyICk7XG5cdGdyaWQtdGVtcGxhdGUtcm93czogcmVwZWF0KCAzLCAxZnIgKTtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgc2l6ZSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRib3JkZXItcmFkaXVzOiAkeyBDT05GSUcucmFkaXVzTWVkaXVtIH07XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8IHtcblx0c2l6ZT86IEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wc1sgJ3dpZHRoJyBdO1xuXHRkaXNhYmxlUG9pbnRlckV2ZW50cz86IEFsaWdubWVudE1hdHJpeENvbnRyb2xJY29uUHJvcHNbICdkaXNhYmxlUG9pbnRlckV2ZW50cycgXTtcbn0gPmBcblx0JHsgcm9vdEJhc2UgfVxuXG5cdGJvcmRlcjogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmRpc2FibGVQb2ludGVyRXZlbnRzXG5cdFx0XHQ/IGNzc2BgXG5cdFx0XHQ6IGNzc2Bcblx0XHRcdFx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0XHQgIGAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEdyaWRSb3cgPSBzdHlsZWQuZGl2YFxuXHRncmlkLWNvbHVtbjogMSAvIC0xO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcbmA7XG5cbi8vIENlbGxcbmV4cG9ydCBjb25zdCBDZWxsID0gc3R5bGVkLnNwYW5gXG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuXHRkaXNwbGF5OiBmbGV4O1xuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRtYXJnaW46IDA7XG5cdHBhZGRpbmc6IDA7XG5cblx0YXBwZWFyYW5jZTogbm9uZTtcblx0Ym9yZGVyOiBub25lO1xuXHRvdXRsaW5lOiBub25lO1xuYDtcblxuY29uc3QgUE9JTlRfU0laRSA9IDY7XG5leHBvcnQgY29uc3QgUG9pbnQgPSBzdHlsZWQuc3BhbmBcblx0ZGlzcGxheTogYmxvY2s7XG5cdGNvbnRhaW46IHN0cmljdDtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgUE9JTlRfU0laRSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRtYXJnaW46IGF1dG87XG5cblx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5ncmF5WyA0MDAgXSB9O1xuXG5cdC8qIFVzZSBib3JkZXIgaW5zdGVhZCBvZiBiYWNrZ3JvdW5kIGNvbG9yIHNvIHRoYXQgdGhlIHBvaW50IHNob3dzXG5cdGluIFdpbmRvd3MgSGlnaCBDb250cmFzdCBNb2RlICovXG5cdGJvcmRlcjogJHsgUE9JTlRfU0laRSAvIDIgfXB4IHNvbGlkIGN1cnJlbnRDb2xvcjtcblxuXHQvKiBIaWdobGlnaHQgYWN0aXZlIGl0ZW0gKi9cblx0JHsgQ2VsbCB9W2RhdGEtYWN0aXZlLWl0ZW1dICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0XHR0cmFuc2Zvcm06IHNjYWxlKCBjYWxjKCA1IC8gMyApICk7XG5cdH1cblxuXHQvKiBIb3ZlciBzdHlsZXMgZm9yIG5vbi1hY3RpdmUgaXRlbXMgKi9cblx0JHsgQ2VsbCB9Om5vdChbZGF0YS1hY3RpdmUtaXRlbV0pOmhvdmVyICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdH1cblxuXHQvKiBTaG93IGFuIG91dGxpbmUgb25seSB3aGVuIGludGVyYWN0aW5nIHdpdGgga2V5Ym9hcmQgKi9cblx0JHsgQ2VsbCB9W2RhdGEtZm9jdXMtdmlzaWJsZV0gJiB7XG5cdFx0b3V0bGluZTogMXB4IHNvbGlkICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0XHRvdXRsaW5lLW9mZnNldDogMXB4O1xuXHR9XG5cblx0QG1lZGlhIG5vdCAoIHByZWZlcnMtcmVkdWNlZC1tb3Rpb24gKSB7XG5cdFx0dHJhbnNpdGlvbi1wcm9wZXJ0eTogY29sb3IsIHRyYW5zZm9ybTtcblx0XHR0cmFuc2l0aW9uLWR1cmF0aW9uOiAxMjBtcztcblx0XHR0cmFuc2l0aW9uLXRpbWluZy1mdW5jdGlvbjogbGluZWFyO1xuXHR9XG5gO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const POINT_SIZE = 6;
+export const Point = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "production" ? {
+  target: "e1r95csn0"
+} : {
+  target: "e1r95csn0",
+  label: "Point"
+})("display:block;contain:strict;box-sizing:border-box;width:", POINT_SIZE, "px;aspect-ratio:1;margin:auto;color:", COLORS.theme.gray[400], ";border:", POINT_SIZE / 2, "px solid currentColor;", Cell, "[data-active-item] &{color:", COLORS.gray[900], ";transform:scale( calc( 5 / 3 ) );}", Cell, ":not([data-active-item]):hover &{color:", COLORS.theme.accent, ";}", Cell, "[data-focus-visible] &{outline:1px solid ", COLORS.theme.accent, ";outline-offset:1px;}@media not ( prefers-reduced-motion ){transition-property:color,transform;transition-duration:120ms;transition-timing-function:linear;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwRWdDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYWxpZ25tZW50LW1hdHJpeC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgQ09MT1JTLCBDT05GSUcgfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgdHlwZSB7XG5cdEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wcyxcblx0QWxpZ25tZW50TWF0cml4Q29udHJvbEljb25Qcm9wcyxcbn0gZnJvbSAnLi90eXBlcyc7XG5cbi8vIEdyaWQgc3RydWN0dXJlXG5cbmNvbnN0IHJvb3RCYXNlID0gKCB7IHNpemUgPSA5MiB9ICkgPT4gY3NzYFxuXHRkaXJlY3Rpb246IGx0cjtcblxuXHRkaXNwbGF5OiBncmlkO1xuXHRncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCggMywgMWZyICk7XG5cdGdyaWQtdGVtcGxhdGUtcm93czogcmVwZWF0KCAzLCAxZnIgKTtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgc2l6ZSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRib3JkZXItcmFkaXVzOiAkeyBDT05GSUcucmFkaXVzTWVkaXVtIH07XG5cdG91dGxpbmU6IG5vbmU7XG5gO1xuXG5leHBvcnQgY29uc3QgR3JpZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8IHtcblx0c2l6ZT86IEFsaWdubWVudE1hdHJpeENvbnRyb2xQcm9wc1sgJ3dpZHRoJyBdO1xuXHRkaXNhYmxlUG9pbnRlckV2ZW50cz86IEFsaWdubWVudE1hdHJpeENvbnRyb2xJY29uUHJvcHNbICdkaXNhYmxlUG9pbnRlckV2ZW50cycgXTtcbn0gPmBcblx0JHsgcm9vdEJhc2UgfVxuXG5cdGJvcmRlcjogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmRpc2FibGVQb2ludGVyRXZlbnRzXG5cdFx0XHQ/IGNzc2BgXG5cdFx0XHQ6IGNzc2Bcblx0XHRcdFx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0XHQgIGAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEdyaWRSb3cgPSBzdHlsZWQuZGl2YFxuXHRncmlkLWNvbHVtbjogMSAvIC0xO1xuXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGdyaWQ7XG5cdGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KCAzLCAxZnIgKTtcbmA7XG5cbi8vIENlbGxcbmV4cG9ydCBjb25zdCBDZWxsID0gc3R5bGVkLnNwYW5gXG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuXHRkaXNwbGF5OiBmbGV4O1xuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRtYXJnaW46IDA7XG5cdHBhZGRpbmc6IDA7XG5cblx0YXBwZWFyYW5jZTogbm9uZTtcblx0Ym9yZGVyOiBub25lO1xuXHRvdXRsaW5lOiBub25lO1xuYDtcblxuY29uc3QgUE9JTlRfU0laRSA9IDY7XG5leHBvcnQgY29uc3QgUG9pbnQgPSBzdHlsZWQuc3BhbmBcblx0ZGlzcGxheTogYmxvY2s7XG5cdGNvbnRhaW46IHN0cmljdDtcblxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHR3aWR0aDogJHsgUE9JTlRfU0laRSB9cHg7XG5cdGFzcGVjdC1yYXRpbzogMTtcblxuXHRtYXJnaW46IGF1dG87XG5cblx0Y29sb3I6ICR7IENPTE9SUy50aGVtZS5ncmF5WyA0MDAgXSB9O1xuXG5cdC8qIFVzZSBib3JkZXIgaW5zdGVhZCBvZiBiYWNrZ3JvdW5kIGNvbG9yIHNvIHRoYXQgdGhlIHBvaW50IHNob3dzXG5cdGluIFdpbmRvd3MgSGlnaCBDb250cmFzdCBNb2RlICovXG5cdGJvcmRlcjogJHsgUE9JTlRfU0laRSAvIDIgfXB4IHNvbGlkIGN1cnJlbnRDb2xvcjtcblxuXHQvKiBIaWdobGlnaHQgYWN0aXZlIGl0ZW0gKi9cblx0JHsgQ2VsbCB9W2RhdGEtYWN0aXZlLWl0ZW1dICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0XHR0cmFuc2Zvcm06IHNjYWxlKCBjYWxjKCA1IC8gMyApICk7XG5cdH1cblxuXHQvKiBIb3ZlciBzdHlsZXMgZm9yIG5vbi1hY3RpdmUgaXRlbXMgKi9cblx0JHsgQ2VsbCB9Om5vdChbZGF0YS1hY3RpdmUtaXRlbV0pOmhvdmVyICYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdH1cblxuXHQvKiBTaG93IGFuIG91dGxpbmUgb25seSB3aGVuIGludGVyYWN0aW5nIHdpdGgga2V5Ym9hcmQgKi9cblx0JHsgQ2VsbCB9W2RhdGEtZm9jdXMtdmlzaWJsZV0gJiB7XG5cdFx0b3V0bGluZTogMXB4IHNvbGlkICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0XHRvdXRsaW5lLW9mZnNldDogMXB4O1xuXHR9XG5cblx0QG1lZGlhIG5vdCAoIHByZWZlcnMtcmVkdWNlZC1tb3Rpb24gKSB7XG5cdFx0dHJhbnNpdGlvbi1wcm9wZXJ0eTogY29sb3IsIHRyYW5zZm9ybTtcblx0XHR0cmFuc2l0aW9uLWR1cmF0aW9uOiAxMjBtcztcblx0XHR0cmFuc2l0aW9uLXRpbWluZy1mdW5jdGlvbjogbGluZWFyO1xuXHR9XG5gO1xuIl19 */"));
+//# sourceMappingURL=styles.js.map

package/build-module/alignment-matrix-control/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["css","COLORS","CONFIG","rootBase","size","radiusMedium","process","env","NODE_ENV","_ref","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","GridContainer","_styled","target","label","props","disablePointerEvents","GridRow","Cell","POINT_SIZE","Point","theme","gray","accent"],"sources":["@wordpress/components/src/alignment-matrix-control/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG } from '../utils';\nimport type {\n\tAlignmentMatrixControlProps,\n\tAlignmentMatrixControlIconProps,\n} from './types';\n\n// Grid structure\n\nconst rootBase = ( { size = 92 } ) => css`\n\tdirection: ltr;\n\n\tdisplay: grid;\n\tgrid-template-columns: repeat( 3, 1fr );\n\tgrid-template-rows: repeat( 3, 1fr );\n\n\tbox-sizing: border-box;\n\twidth: ${ size }px;\n\taspect-ratio: 1;\n\n\tborder-radius: ${ CONFIG.radiusMedium };\n\toutline: none;\n`;\n\nexport const GridContainer = styled.div< {\n\tsize?: AlignmentMatrixControlProps[ 'width' ];\n\tdisablePointerEvents?: AlignmentMatrixControlIconProps[ 'disablePointerEvents' ];\n} >`\n\t${ rootBase }\n\n\tborder: 1px solid transparent;\n\n\t${ ( props ) =>\n\t\tprops.disablePointerEvents\n\t\t\t? css``\n\t\t\t: css`\n\t\t\t\t\tcursor: pointer;\n\t\t\t  ` }\n`;\n\nexport const GridRow = styled.div`\n\tgrid-column: 1 / -1;\n\n\tbox-sizing: border-box;\n\tdisplay: grid;\n\tgrid-template-columns: repeat( 3, 1fr );\n`;\n\n// Cell\nexport const Cell = styled.span`\n\tposition: relative;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tpadding: 0;\n\n\tappearance: none;\n\tborder: none;\n\toutline: none;\n`;\n\nconst POINT_SIZE = 6;\nexport const Point = styled.span`\n\tdisplay: block;\n\tcontain: strict;\n\n\tbox-sizing: border-box;\n\twidth: ${ POINT_SIZE }px;\n\taspect-ratio: 1;\n\n\tmargin: auto;\n\n\tcolor: ${ COLORS.theme.gray[ 400 ] };\n\n\t/* Use border instead of background color so that the point shows\n\tin Windows High Contrast Mode */\n\tborder: ${ POINT_SIZE / 2 }px solid currentColor;\n\n\t/* Highlight active item */\n\t${ Cell }[data-active-item] & {\n\t\tcolor: ${ COLORS.gray[ 900 ] };\n\t\ttransform: scale( calc( 5 / 3 ) );\n\t}\n\n\t/* Hover styles for non-active items */\n\t${ Cell }:not([data-active-item]):hover & {\n\t\tcolor: ${ COLORS.theme.accent };\n\t}\n\n\t/* Show an outline only when interacting with keyboard */\n\t${ Cell }[data-focus-visible] & {\n\t\toutline: 1px solid ${ COLORS.theme.accent };\n\t\toutline-offset: 1px;\n\t}\n\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition-property: color, transform;\n\t\ttransition-duration: 120ms;\n\t\ttransition-timing-function: linear;\n\t}\n`;\n"],"mappings":";;AAAA;AACA;AACA;;AAEA,SAASA,GAAG,QAAQ,gBAAgB;;AAEpC;AACA;AACA;AACA,SAASC,MAAM,EAAEC,MAAM,QAAQ,UAAU;AAMzC;;AAEA,MAAMC,QAAQ,GAAGA,CAAE;EAAEC,IAAI,GAAG;AAAG,CAAC,kBAAMJ,GAAG,uIAQ9BI,IAAI,sCAGIF,MAAM,CAACG,YAAY,sBAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,8CAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,2jHAErC;AAAC,IAAAC,IAAA,GAAAH,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAE,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA;AAEF,OAAO,MAAMC,aAAa,gBAAAC,OAAA,QAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAS,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAItBf,QAAQ,oCAINgB,KAAK,IACTA,KAAK,CAACC,oBAAoB,gBACvBpB,GAAG,CAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA,kDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,8jHAAAC,IAGF,SAAAH,OAAA,CAAAC,GAAA,CAAAC,QAAA,4jHACL;AAED,OAAO,MAAMa,OAAO,gBAAAL,OAAA,QAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAS,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAZ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAE,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAMnB;;AAED;AACA,OAAO,MAAMQ,IAAI,gBAAAN,OAAA,SAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAS,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAZ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAE,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAchB;AAED,MAAMS,UAAU,GAAG,CAAC;AACpB,OAAO,MAAMC,KAAK,gBAAAR,OAAA,SAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAS,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,gEAKPK,UAAU,0CAKVtB,MAAM,CAACwB,KAAK,CAACC,IAAI,CAAE,GAAG,CAAE,cAIvBH,UAAU,GAAG,CAAC,4BAGtBD,IAAI,iCACIrB,MAAM,CAACyB,IAAI,CAAE,GAAG,CAAE,yCAK1BJ,IAAI,6CACIrB,MAAM,CAACwB,KAAK,CAACE,MAAM,QAI3BL,IAAI,+CACgBrB,MAAM,CAACwB,KAAK,CAACE,MAAM,oKAAArB,OAAA,CAAAC,GAAA,CAAAC,QAAA,4jHAS1C","ignoreList":[]}

package/build-module/alignment-matrix-control/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/alignment-matrix-control/types.ts"],"sourcesContent":["export type AlignmentMatrixControlValue =\n\t| 'top left'\n\t| 'top center'\n\t| 'top right'\n\t| 'center left'\n\t| 'center'\n\t| 'center center'\n\t| 'center right'\n\t| 'bottom left'\n\t| 'bottom center'\n\t| 'bottom right';\n\nexport type AlignmentMatrixControlProps = {\n\t/**\n\t * Accessible label. If provided, sets the `aria-label` attribute of the\n\t * underlying `grid` widget.\n\t *\n\t * @default 'Alignment Matrix Control'\n\t */\n\tlabel?: string;\n\t/**\n\t * If provided, sets the default alignment value.\n\t *\n\t * @default 'center center'\n\t */\n\tdefaultValue?: AlignmentMatrixControlValue;\n\t/**\n\t * The current alignment value.\n\t */\n\tvalue?: AlignmentMatrixControlValue;\n\t/**\n\t * A function that receives the updated alignment value.\n\t */\n\tonChange?: ( newValue: AlignmentMatrixControlValue ) => void;\n\t/**\n\t * If provided, sets the width of the control.\n\t *\n\t * @default 92\n\t */\n\twidth?: number;\n};\n\nexport type AlignmentMatrixControlIconProps = Pick<\n\tAlignmentMatrixControlProps,\n\t'value'\n> & {\n\tdisablePointerEvents?: boolean;\n\tsize?: number;\n};\n\nexport type AlignmentMatrixControlCellProps = {\n\tisActive?: boolean;\n\tvalue: NonNullable< AlignmentMatrixControlProps[ 'value' ] >;\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/alignment-matrix-control/types.ts"],"sourcesContent":["export type AlignmentMatrixControlValue =\n\t| 'top left'\n\t| 'top center'\n\t| 'top right'\n\t| 'center left'\n\t| 'center'\n\t| 'center center'\n\t| 'center right'\n\t| 'bottom left'\n\t| 'bottom center'\n\t| 'bottom right';\n\nexport type AlignmentMatrixControlProps = {\n\t/**\n\t * Accessible label. If provided, sets the `aria-label` attribute of the\n\t * underlying `grid` widget.\n\t *\n\t * @default 'Alignment Matrix Control'\n\t */\n\tlabel?: string;\n\t/**\n\t * If provided, sets the default alignment value.\n\t *\n\t * @default 'center center'\n\t */\n\tdefaultValue?: AlignmentMatrixControlValue;\n\t/**\n\t * The current alignment value.\n\t */\n\tvalue?: AlignmentMatrixControlValue;\n\t/**\n\t * A function that receives the updated alignment value.\n\t */\n\tonChange?: ( newValue: AlignmentMatrixControlValue ) => void;\n\t/**\n\t * If provided, sets the width of the control.\n\t *\n\t * @default 92\n\t */\n\twidth?: number;\n};\n\nexport type AlignmentMatrixControlIconProps = Pick<\n\tAlignmentMatrixControlProps,\n\t'value'\n> & {\n\t/**\n\t * If `true`, disables pointer events on the icon.\n\t * @default true\n\t */\n\tdisablePointerEvents?: boolean;\n\t/**\n\t * _Note: this prop is deprecated. Use the `size` prop on the parent `Icon`\n\t * component instead_\n\t *\n\t * The size of the icon.\n\t * @ignore\n\t * @default 24\n\t */\n\tsize?: number;\n};\n\nexport type AlignmentMatrixControlCellProps = {\n\tvalue: NonNullable< AlignmentMatrixControlProps[ 'value' ] >;\n};\n"],"mappings":"","ignoreList":[]}

package/build-module/angle-picker-control/angle-circle.js

@@ -15,14 +15,14 @@ function AngleCircle({
   ...props
 }) {
   const angleCircleRef = useRef(null);
-  const angleCircleCenter = useRef();
-  const previousCursorValue = useRef();
+  const angleCircleCenterRef = useRef();
+  const previousCursorValueRef = useRef();
   const setAngleCircleCenter = () => {
     if (angleCircleRef.current === null) {
       return;
     }
     const rect = angleCircleRef.current.getBoundingClientRect();
-    angleCircleCenter.current = {
+    angleCircleCenterRef.current = {
       x: rect.x + rect.width / 2,
       y: rect.y + rect.height / 2
     };
@@ -37,11 +37,11 @@ function AngleCircle({
     event.preventDefault();
     // Input control needs to lose focus and by preventDefault above, it doesn't.
     event.target?.focus();
-    if (angleCircleCenter.current !== undefined && onChange !== undefined) {
+    if (angleCircleCenterRef.current !== undefined && onChange !== undefined) {
       const {
         x: centerX,
         y: centerY
-      } = angleCircleCenter.current;
+      } = angleCircleCenterRef.current;
       onChange(getAngle(centerX, centerY, event.clientX, event.clientY));
     }
   };
@@ -58,13 +58,13 @@ function AngleCircle({
   });
   useEffect(() => {
     if (isDragging) {
-      if (previousCursorValue.current === undefined) {
-        previousCursorValue.current = document.body.style.cursor;
+      if (previousCursorValueRef.current === undefined) {
+        previousCursorValueRef.current = document.body.style.cursor;
       }
       document.body.style.cursor = 'grabbing';
     } else {
-      document.body.style.cursor = previousCursorValue.current || '';
-      previousCursorValue.current = undefined;
+      document.body.style.cursor = previousCursorValueRef.current || '';
+      previousCursorValueRef.current = undefined;
     }
   }, [isDragging]);
   return /*#__PURE__*/_jsx(CircleRoot, {

package/build-module/angle-picker-control/angle-circle.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useRef","__experimentalUseDragging","useDragging","CircleRoot","CircleIndicatorWrapper","CircleIndicator","jsx","_jsx","AngleCircle","value","onChange","props","angleCircleRef","angleCircleCenter","previousCursorValue","setAngleCircleCenter","current","rect","getBoundingClientRect","x","width","y","height","changeAngleToPosition","event","undefined","preventDefault","target","focus","centerX","centerY","getAngle","clientX","clientY","startDrag","isDragging","onDragStart","onDragMove","onDragEnd","document","body","style","cursor","ref","onMouseDown","className","children","transform","tabIndex","pointX","pointY","angleInRadians","Math","atan2","angleInDeg","round","PI"],"sources":["@wordpress/components/src/angle-picker-control/angle-circle.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { __experimentalUseDragging as useDragging } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tCircleRoot,\n\tCircleIndicatorWrapper,\n\tCircleIndicator,\n} from './styles/angle-picker-control-styles';\n\nimport type { WordPressComponentProps } from '../context';\nimport type { AngleCircleProps } from './types';\n\ntype UseDraggingArgumentType = Parameters< typeof useDragging >[ 0 ];\ntype UseDraggingCallbackEvent =\n\t| Parameters< UseDraggingArgumentType[ 'onDragStart' ] >[ 0 ]\n\t| Parameters< UseDraggingArgumentType[ 'onDragMove' ] >[ 0 ]\n\t| Parameters< UseDraggingArgumentType[ 'onDragEnd' ] >[ 0 ];\n\nfunction AngleCircle( {\n\tvalue,\n\tonChange,\n\t...props\n}: WordPressComponentProps< AngleCircleProps, 'div' > ) {\n\tconst angleCircleRef = useRef< HTMLDivElement | null >( null );\n\tconst angleCircleCenter = useRef< { x: number; y: number } | undefined >();\n\tconst previousCursorValue = useRef< CSSStyleDeclaration[ 'cursor' ] >();\n\n\tconst setAngleCircleCenter = () => {\n\t\tif ( angleCircleRef.current === null ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst rect = angleCircleRef.current.getBoundingClientRect();\n\t\tangleCircleCenter.current = {\n\t\t\tx: rect.x + rect.width / 2,\n\t\t\ty: rect.y + rect.height / 2,\n\t\t};\n\t};\n\n\tconst changeAngleToPosition = ( event: UseDraggingCallbackEvent ) => {\n\t\tif ( event === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Prevent (drag) mouse events from selecting and accidentally\n\t\t// triggering actions from other elements.\n\t\tevent.preventDefault();\n\t\t// Input control needs to lose focus and by preventDefault above, it doesn't.\n\t\t( event.target as HTMLDivElement | null )?.focus();\n\n\t\tif (\n\t\t\tangleCircleCenter.current !== undefined &&\n\t\t\tonChange !== undefined\n\t\t) {\n\t\t\tconst { x: centerX, y: centerY } = angleCircleCenter.current;\n\t\t\tonChange(\n\t\t\t\tgetAngle( centerX, centerY, event.clientX, event.clientY )\n\t\t\t);\n\t\t}\n\t};\n\n\tconst { startDrag, isDragging } = useDragging( {\n\t\tonDragStart: ( event ) => {\n\t\t\tsetAngleCircleCenter();\n\t\t\tchangeAngleToPosition( event );\n\t\t},\n\t\tonDragMove: changeAngleToPosition,\n\t\tonDragEnd: changeAngleToPosition,\n\t} );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tif ( previousCursorValue.current === undefined ) {\n\t\t\t\tpreviousCursorValue.current = document.body.style.cursor;\n\t\t\t}\n\t\t\tdocument.body.style.cursor = 'grabbing';\n\t\t} else {\n\t\t\tdocument.body.style.cursor = previousCursorValue.current || '';\n\t\t\tpreviousCursorValue.current = undefined;\n\t\t}\n\t}, [ isDragging ] );\n\n\treturn (\n\t\t<CircleRoot\n\t\t\tref={ angleCircleRef }\n\t\t\tonMouseDown={ startDrag }\n\t\t\tclassName=\"components-angle-picker-control__angle-circle\"\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<CircleIndicatorWrapper\n\t\t\t\tstyle={\n\t\t\t\t\tvalue ? { transform: `rotate(${ value }deg)` } : undefined\n\t\t\t\t}\n\t\t\t\tclassName=\"components-angle-picker-control__angle-circle-indicator-wrapper\"\n\t\t\t\ttabIndex={ -1 }\n\t\t\t>\n\t\t\t\t<CircleIndicator className=\"components-angle-picker-control__angle-circle-indicator\" />\n\t\t\t</CircleIndicatorWrapper>\n\t\t</CircleRoot>\n\t);\n}\n\nfunction getAngle(\n\tcenterX: number,\n\tcenterY: number,\n\tpointX: number,\n\tpointY: number\n) {\n\tconst y = pointY - centerY;\n\tconst x = pointX - centerX;\n\n\tconst angleInRadians = Math.atan2( y, x );\n\tconst angleInDeg = Math.round( angleInRadians * ( 180 / Math.PI ) ) + 90;\n\tif ( angleInDeg < 0 ) {\n\t\treturn 360 + angleInDeg;\n\t}\n\treturn angleInDeg;\n}\n\nexport default AngleCircle;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useEffect","useRef","__experimentalUseDragging","useDragging","CircleRoot","CircleIndicatorWrapper","CircleIndicator","jsx","_jsx","AngleCircle","value","onChange","props","angleCircleRef","angleCircleCenterRef","previousCursorValueRef","setAngleCircleCenter","current","rect","getBoundingClientRect","x","width","y","height","changeAngleToPosition","event","undefined","preventDefault","target","focus","centerX","centerY","getAngle","clientX","clientY","startDrag","isDragging","onDragStart","onDragMove","onDragEnd","document","body","style","cursor","ref","onMouseDown","className","children","transform","tabIndex","pointX","pointY","angleInRadians","Math","atan2","angleInDeg","round","PI"],"sources":["@wordpress/components/src/angle-picker-control/angle-circle.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { __experimentalUseDragging as useDragging } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tCircleRoot,\n\tCircleIndicatorWrapper,\n\tCircleIndicator,\n} from './styles/angle-picker-control-styles';\n\nimport type { WordPressComponentProps } from '../context';\nimport type { AngleCircleProps } from './types';\n\ntype UseDraggingArgumentType = Parameters< typeof useDragging >[ 0 ];\ntype UseDraggingCallbackEvent =\n\t| Parameters< UseDraggingArgumentType[ 'onDragStart' ] >[ 0 ]\n\t| Parameters< UseDraggingArgumentType[ 'onDragMove' ] >[ 0 ]\n\t| Parameters< UseDraggingArgumentType[ 'onDragEnd' ] >[ 0 ];\n\nfunction AngleCircle( {\n\tvalue,\n\tonChange,\n\t...props\n}: WordPressComponentProps< AngleCircleProps, 'div' > ) {\n\tconst angleCircleRef = useRef< HTMLDivElement | null >( null );\n\tconst angleCircleCenterRef = useRef<\n\t\t{ x: number; y: number } | undefined\n\t>();\n\tconst previousCursorValueRef = useRef< CSSStyleDeclaration[ 'cursor' ] >();\n\n\tconst setAngleCircleCenter = () => {\n\t\tif ( angleCircleRef.current === null ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst rect = angleCircleRef.current.getBoundingClientRect();\n\t\tangleCircleCenterRef.current = {\n\t\t\tx: rect.x + rect.width / 2,\n\t\t\ty: rect.y + rect.height / 2,\n\t\t};\n\t};\n\n\tconst changeAngleToPosition = ( event: UseDraggingCallbackEvent ) => {\n\t\tif ( event === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Prevent (drag) mouse events from selecting and accidentally\n\t\t// triggering actions from other elements.\n\t\tevent.preventDefault();\n\t\t// Input control needs to lose focus and by preventDefault above, it doesn't.\n\t\t( event.target as HTMLDivElement | null )?.focus();\n\n\t\tif (\n\t\t\tangleCircleCenterRef.current !== undefined &&\n\t\t\tonChange !== undefined\n\t\t) {\n\t\t\tconst { x: centerX, y: centerY } = angleCircleCenterRef.current;\n\t\t\tonChange(\n\t\t\t\tgetAngle( centerX, centerY, event.clientX, event.clientY )\n\t\t\t);\n\t\t}\n\t};\n\n\tconst { startDrag, isDragging } = useDragging( {\n\t\tonDragStart: ( event ) => {\n\t\t\tsetAngleCircleCenter();\n\t\t\tchangeAngleToPosition( event );\n\t\t},\n\t\tonDragMove: changeAngleToPosition,\n\t\tonDragEnd: changeAngleToPosition,\n\t} );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tif ( previousCursorValueRef.current === undefined ) {\n\t\t\t\tpreviousCursorValueRef.current = document.body.style.cursor;\n\t\t\t}\n\t\t\tdocument.body.style.cursor = 'grabbing';\n\t\t} else {\n\t\t\tdocument.body.style.cursor = previousCursorValueRef.current || '';\n\t\t\tpreviousCursorValueRef.current = undefined;\n\t\t}\n\t}, [ isDragging ] );\n\n\treturn (\n\t\t<CircleRoot\n\t\t\tref={ angleCircleRef }\n\t\t\tonMouseDown={ startDrag }\n\t\t\tclassName=\"components-angle-picker-control__angle-circle\"\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<CircleIndicatorWrapper\n\t\t\t\tstyle={\n\t\t\t\t\tvalue ? { transform: `rotate(${ value }deg)` } : undefined\n\t\t\t\t}\n\t\t\t\tclassName=\"components-angle-picker-control__angle-circle-indicator-wrapper\"\n\t\t\t\ttabIndex={ -1 }\n\t\t\t>\n\t\t\t\t<CircleIndicator className=\"components-angle-picker-control__angle-circle-indicator\" />\n\t\t\t</CircleIndicatorWrapper>\n\t\t</CircleRoot>\n\t);\n}\n\nfunction getAngle(\n\tcenterX: number,\n\tcenterY: number,\n\tpointX: number,\n\tpointY: number\n) {\n\tconst y = pointY - centerY;\n\tconst x = pointX - centerX;\n\n\tconst angleInRadians = Math.atan2( y, x );\n\tconst angleInDeg = Math.round( angleInRadians * ( 180 / Math.PI ) ) + 90;\n\tif ( angleInDeg < 0 ) {\n\t\treturn 360 + angleInDeg;\n\t}\n\treturn angleInDeg;\n}\n\nexport default AngleCircle;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AACtD,SAASC,yBAAyB,IAAIC,WAAW,QAAQ,oBAAoB;;AAE7E;AACA;AACA;AACA,SACCC,UAAU,EACVC,sBAAsB,EACtBC,eAAe,QACT,sCAAsC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAW9C,SAASC,WAAWA,CAAE;EACrBC,KAAK;EACLC,QAAQ;EACR,GAAGC;AACgD,CAAC,EAAG;EACvD,MAAMC,cAAc,GAAGZ,MAAM,CAA2B,IAAK,CAAC;EAC9D,MAAMa,oBAAoB,GAAGb,MAAM,CAEjC,CAAC;EACH,MAAMc,sBAAsB,GAAGd,MAAM,CAAoC,CAAC;EAE1E,MAAMe,oBAAoB,GAAGA,CAAA,KAAM;IAClC,IAAKH,cAAc,CAACI,OAAO,KAAK,IAAI,EAAG;MACtC;IACD;IAEA,MAAMC,IAAI,GAAGL,cAAc,CAACI,OAAO,CAACE,qBAAqB,CAAC,CAAC;IAC3DL,oBAAoB,CAACG,OAAO,GAAG;MAC9BG,CAAC,EAAEF,IAAI,CAACE,CAAC,GAAGF,IAAI,CAACG,KAAK,GAAG,CAAC;MAC1BC,CAAC,EAAEJ,IAAI,CAACI,CAAC,GAAGJ,IAAI,CAACK,MAAM,GAAG;IAC3B,CAAC;EACF,CAAC;EAED,MAAMC,qBAAqB,GAAKC,KAA+B,IAAM;IACpE,IAAKA,KAAK,KAAKC,SAAS,EAAG;MAC1B;IACD;;IAEA;IACA;IACAD,KAAK,CAACE,cAAc,CAAC,CAAC;IACtB;IACEF,KAAK,CAACG,MAAM,EAA6BC,KAAK,CAAC,CAAC;IAElD,IACCf,oBAAoB,CAACG,OAAO,KAAKS,SAAS,IAC1Cf,QAAQ,KAAKe,SAAS,EACrB;MACD,MAAM;QAAEN,CAAC,EAAEU,OAAO;QAAER,CAAC,EAAES;MAAQ,CAAC,GAAGjB,oBAAoB,CAACG,OAAO;MAC/DN,QAAQ,CACPqB,QAAQ,CAAEF,OAAO,EAAEC,OAAO,EAAEN,KAAK,CAACQ,OAAO,EAAER,KAAK,CAACS,OAAQ,CAC1D,CAAC;IACF;EACD,CAAC;EAED,MAAM;IAAEC,SAAS;IAAEC;EAAW,CAAC,GAAGjC,WAAW,CAAE;IAC9CkC,WAAW,EAAIZ,KAAK,IAAM;MACzBT,oBAAoB,CAAC,CAAC;MACtBQ,qBAAqB,CAAEC,KAAM,CAAC;IAC/B,CAAC;IACDa,UAAU,EAAEd,qBAAqB;IACjCe,SAAS,EAAEf;EACZ,CAAE,CAAC;EAEHxB,SAAS,CAAE,MAAM;IAChB,IAAKoC,UAAU,EAAG;MACjB,IAAKrB,sBAAsB,CAACE,OAAO,KAAKS,SAAS,EAAG;QACnDX,sBAAsB,CAACE,OAAO,GAAGuB,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,MAAM;MAC5D;MACAH,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG,UAAU;IACxC,CAAC,MAAM;MACNH,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG5B,sBAAsB,CAACE,OAAO,IAAI,EAAE;MACjEF,sBAAsB,CAACE,OAAO,GAAGS,SAAS;IAC3C;EACD,CAAC,EAAE,CAAEU,UAAU,CAAG,CAAC;EAEnB,oBACC5B,IAAA,CAACJ,UAAU;IACVwC,GAAG,EAAG/B,cAAgB;IACtBgC,WAAW,EAAGV,SAAW;IACzBW,SAAS,EAAC,+CAA+C;IAAA,GACpDlC,KAAK;IAAAmC,QAAA,eAEVvC,IAAA,CAACH,sBAAsB;MACtBqC,KAAK,EACJhC,KAAK,GAAG;QAAEsC,SAAS,EAAG,UAAUtC,KAAO;MAAM,CAAC,GAAGgB,SACjD;MACDoB,SAAS,EAAC,iEAAiE;MAC3EG,QAAQ,EAAG,CAAC,CAAG;MAAAF,QAAA,eAEfvC,IAAA,CAACF,eAAe;QAACwC,SAAS,EAAC;MAAyD,CAAE;IAAC,CAChE;EAAC,CACd,CAAC;AAEf;AAEA,SAASd,QAAQA,CAChBF,OAAe,EACfC,OAAe,EACfmB,MAAc,EACdC,MAAc,EACb;EACD,MAAM7B,CAAC,GAAG6B,MAAM,GAAGpB,OAAO;EAC1B,MAAMX,CAAC,GAAG8B,MAAM,GAAGpB,OAAO;EAE1B,MAAMsB,cAAc,GAAGC,IAAI,CAACC,KAAK,CAAEhC,CAAC,EAAEF,CAAE,CAAC;EACzC,MAAMmC,UAAU,GAAGF,IAAI,CAACG,KAAK,CAAEJ,cAAc,IAAK,GAAG,GAAGC,IAAI,CAACI,EAAE,CAAG,CAAC,GAAG,EAAE;EACxE,IAAKF,UAAU,GAAG,CAAC,EAAG;IACrB,OAAO,GAAG,GAAGA,UAAU;EACxB;EACA,OAAOA,UAAU;AAClB;AAEA,eAAe9C,WAAW","ignoreList":[]}

package/build-module/border-control/border-control/component.js

@@ -15,6 +15,7 @@ import { View } from '../../view';
 import { VisuallyHidden } from '../../visually-hidden';
 import { contextConnect } from '../../context';
 import { useBorderControl } from './hook';
+import { Spacer } from '../../spacer';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const BorderLabel = props => {
@@ -73,19 +74,23 @@ const UnconnectedBorderControl = (props, forwardedRef) => {
       spacing: 4,
       className: innerWrapperClassName,
       children: [/*#__PURE__*/_jsx(UnitControl, {
-        prefix: /*#__PURE__*/_jsx(BorderControlDropdown, {
-          border: border,
-          colors: colors,
-          __unstablePopoverProps: __unstablePopoverProps,
-          disableCustomColors: disableCustomColors,
-          enableAlpha: enableAlpha,
-          enableStyle: enableStyle,
-          isStyleSettable: isStyleSettable,
-          onChange: onBorderChange,
-          previousStyleSelection: previousStyleSelection,
-          showDropdownHeader: showDropdownHeader,
-          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
-          size: size
+        prefix: /*#__PURE__*/_jsx(Spacer, {
+          marginRight: 1,
+          marginBottom: 0,
+          children: /*#__PURE__*/_jsx(BorderControlDropdown, {
+            border: border,
+            colors: colors,
+            __unstablePopoverProps: __unstablePopoverProps,
+            disableCustomColors: disableCustomColors,
+            enableAlpha: enableAlpha,
+            enableStyle: enableStyle,
+            isStyleSettable: isStyleSettable,
+            onChange: onBorderChange,
+            previousStyleSelection: previousStyleSelection,
+            showDropdownHeader: showDropdownHeader,
+            __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
+            size: size
+          })
         }),
         label: __('Border width'),
         hideLabelFromVision: true,

package/build-module/border-control/border-control/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","BorderControlDropdown","UnitControl","RangeControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderControl","jsx","_jsx","jsxs","_jsxs","BorderLabel","props","label","hideLabelFromVision","as","children","UnconnectedBorderControl","forwardedRef","__next40pxDefaultSize","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","innerWrapperClassName","inputWidth","isStyleSettable","onBorderChange","onSliderChange","onWidthChange","placeholder","__unstablePopoverProps","previousStyleSelection","showDropdownHeader","size","sliderClassName","value","border","widthUnit","widthValue","withSlider","__experimentalIsRenderedInSidebar","otherProps","ref","spacing","className","prefix","onChange","min","width","__unstableInputWidth","__nextHasNoMarginBottom","initialPosition","max","step","includes","undefined","withInputField","BorderControl"],"sources":["@wordpress/components/src/border-control/border-control/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlDropdown from '../border-control-dropdown';\nimport UnitControl from '../../unit-control';\nimport RangeControl from '../../range-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControl } from './hook';\n\nimport type { BorderControlProps, LabelProps } from '../types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"legend\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel as=\"legend\">{ label }</StyledLabel>\n\t);\n};\n\nconst UnconnectedBorderControl = (\n\tprops: WordPressComponentProps< BorderControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thideLabelFromVision,\n\t\tinnerWrapperClassName,\n\t\tinputWidth,\n\t\tisStyleSettable,\n\t\tlabel,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tplaceholder,\n\t\t__unstablePopoverProps,\n\t\tpreviousStyleSelection,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\twithSlider,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderControl( props );\n\n\treturn (\n\t\t<View as=\"fieldset\" { ...otherProps } ref={ forwardedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack spacing={ 4 } className={ innerWrapperClassName }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tprefix={\n\t\t\t\t\t\t<BorderControlDropdown\n\t\t\t\t\t\t\tborder={ border }\n\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t__unstablePopoverProps={ __unstablePopoverProps }\n\t\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\t\tisStyleSettable={ isStyleSettable }\n\t\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\t\tpreviousStyleSelection={ previousStyleSelection }\n\t\t\t\t\t\t\tshowDropdownHeader={ showDropdownHeader }\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ onWidthChange }\n\t\t\t\t\tvalue={ border?.width || '' }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t__unstableInputWidth={ inputWidth }\n\t\t\t\t\tsize={ size }\n\t\t\t\t/>\n\t\t\t\t{ withSlider && (\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tclassName={ sliderClassName }\n\t\t\t\t\t\tinitialPosition={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ onSliderChange }\n\t\t\t\t\t\tstep={ [ 'px', '%' ].includes( widthUnit ) ? 1 : 0.1 }\n\t\t\t\t\t\tvalue={ widthValue || undefined }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderControl` brings together internal sub-components which allow users to\n * set the various properties of a border. The first sub-component, a\n * `BorderDropdown` contains options representing border color and style. The\n * border width is controlled via a `UnitControl` and an optional `RangeControl`.\n *\n * Border radius is not covered by this control as it may be desired separate to\n * color, style, and width. For example, the border radius may be absorbed under\n * a \"shape\" abstraction.\n *\n * ```jsx\n * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderControl = () => {\n * \tconst [ border, setBorder ] = useState();\n * \tconst onChange = ( newBorder ) => setBorder( newBorder );\n *\n * \treturn (\n * \t\t<BorderControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Border' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ border }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderControl = contextConnect(\n\tUnconnectedBorderControl,\n\t'BorderControl'\n);\n\nexport default BorderControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__","BorderControlDropdown","UnitControl","RangeControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderControl","Spacer","jsx","_jsx","jsxs","_jsxs","BorderLabel","props","label","hideLabelFromVision","as","children","UnconnectedBorderControl","forwardedRef","__next40pxDefaultSize","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","innerWrapperClassName","inputWidth","isStyleSettable","onBorderChange","onSliderChange","onWidthChange","placeholder","__unstablePopoverProps","previousStyleSelection","showDropdownHeader","size","sliderClassName","value","border","widthUnit","widthValue","withSlider","__experimentalIsRenderedInSidebar","otherProps","ref","spacing","className","prefix","marginRight","marginBottom","onChange","min","width","__unstableInputWidth","__nextHasNoMarginBottom","initialPosition","max","step","includes","undefined","withInputField","BorderControl"],"sources":["@wordpress/components/src/border-control/border-control/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlDropdown from '../border-control-dropdown';\nimport UnitControl from '../../unit-control';\nimport RangeControl from '../../range-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControl } from './hook';\n\nimport type { BorderControlProps, LabelProps } from '../types';\nimport { Spacer } from '../../spacer';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"legend\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel as=\"legend\">{ label }</StyledLabel>\n\t);\n};\n\nconst UnconnectedBorderControl = (\n\tprops: WordPressComponentProps< BorderControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thideLabelFromVision,\n\t\tinnerWrapperClassName,\n\t\tinputWidth,\n\t\tisStyleSettable,\n\t\tlabel,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tplaceholder,\n\t\t__unstablePopoverProps,\n\t\tpreviousStyleSelection,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\twithSlider,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderControl( props );\n\n\treturn (\n\t\t<View as=\"fieldset\" { ...otherProps } ref={ forwardedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack spacing={ 4 } className={ innerWrapperClassName }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tprefix={\n\t\t\t\t\t\t<Spacer marginRight={ 1 } marginBottom={ 0 }>\n\t\t\t\t\t\t\t<BorderControlDropdown\n\t\t\t\t\t\t\t\tborder={ border }\n\t\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t\t__unstablePopoverProps={\n\t\t\t\t\t\t\t\t\t__unstablePopoverProps\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\t\t\tisStyleSettable={ isStyleSettable }\n\t\t\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\t\t\tpreviousStyleSelection={\n\t\t\t\t\t\t\t\t\tpreviousStyleSelection\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowDropdownHeader={ showDropdownHeader }\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ onWidthChange }\n\t\t\t\t\tvalue={ border?.width || '' }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t__unstableInputWidth={ inputWidth }\n\t\t\t\t\tsize={ size }\n\t\t\t\t/>\n\t\t\t\t{ withSlider && (\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tclassName={ sliderClassName }\n\t\t\t\t\t\tinitialPosition={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ onSliderChange }\n\t\t\t\t\t\tstep={ [ 'px', '%' ].includes( widthUnit ) ? 1 : 0.1 }\n\t\t\t\t\t\tvalue={ widthValue || undefined }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderControl` brings together internal sub-components which allow users to\n * set the various properties of a border. The first sub-component, a\n * `BorderDropdown` contains options representing border color and style. The\n * border width is controlled via a `UnitControl` and an optional `RangeControl`.\n *\n * Border radius is not covered by this control as it may be desired separate to\n * color, style, and width. For example, the border radius may be absorbed under\n * a \"shape\" abstraction.\n *\n * ```jsx\n * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderControl = () => {\n * \tconst [ border, setBorder ] = useState();\n * \tconst onChange = ( newBorder ) => setBorder( newBorder );\n *\n * \treturn (\n * \t\t<BorderControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Border' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ border }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderControl = contextConnect(\n\tUnconnectedBorderControl,\n\t'BorderControl'\n);\n\nexport default BorderControl;\n"],"mappings":"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","ignoreList":[]}

package/build-module/box-control/utils.js

@@ -227,7 +227,7 @@ export function isValuesMixed(values = {}, selectedUnits, sides = ALL_SIDES) {
  * @return  Whether values are mixed.
  */
 export function isValuesDefined(values) {
-  return values !== undefined && Object.values(values).filter(
+  return values && Object.values(values).filter(
   // Switching units when input is empty causes values only
   // containing units. This gives false positive on mixed values
   // unless filtered.

package/build-module/box-control/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","parseQuantityAndUnitFromRawValue","CUSTOM_VALUE_SETTINGS","px","max","step","vw","vh","em","rm","svw","lvw","dvw","svh","lvh","dvh","vi","svi","lvi","dvi","vb","svb","lvb","dvb","vmin","svmin","lvmin","dvmin","vmax","svmax","lvmax","dvmax","LABELS","all","top","bottom","left","right","mixed","vertical","horizontal","DEFAULT_VALUES","undefined","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllValue","values","selectedUnits","availableSides","sides","normalizeSides","parsedQuantitiesAndUnits","map","side","allParsedQuantities","value","_value$","allParsedUnits","commonQuantity","every","commonUnit","_getAllUnitFallback","getAllUnitFallback","join","filteredUnits","Object","Boolean","isValuesMixed","allValue","isMixed","isNaN","parseFloat","isValuesDefined","test","getInitialSide","isLinked","splitOnAxis","initialSide","filteredSides","includes","push","newSides","applyValueToSides","currentValues","newValue","newValues","forEach"],"sources":["@wordpress/components/src/box-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport type {\n\tBoxControlProps,\n\tBoxControlValue,\n\tCustomValueUnits,\n} from './types';\n\nexport const CUSTOM_VALUE_SETTINGS: CustomValueUnits = {\n\tpx: { max: 300, step: 1 },\n\t'%': { max: 100, step: 1 },\n\tvw: { max: 100, step: 1 },\n\tvh: { max: 100, step: 1 },\n\tem: { max: 10, step: 0.1 },\n\trm: { max: 10, step: 0.1 },\n\tsvw: { max: 100, step: 1 },\n\tlvw: { max: 100, step: 1 },\n\tdvw: { max: 100, step: 1 },\n\tsvh: { max: 100, step: 1 },\n\tlvh: { max: 100, step: 1 },\n\tdvh: { max: 100, step: 1 },\n\tvi: { max: 100, step: 1 },\n\tsvi: { max: 100, step: 1 },\n\tlvi: { max: 100, step: 1 },\n\tdvi: { max: 100, step: 1 },\n\tvb: { max: 100, step: 1 },\n\tsvb: { max: 100, step: 1 },\n\tlvb: { max: 100, step: 1 },\n\tdvb: { max: 100, step: 1 },\n\tvmin: { max: 100, step: 1 },\n\tsvmin: { max: 100, step: 1 },\n\tlvmin: { max: 100, step: 1 },\n\tdvmin: { max: 100, step: 1 },\n\tvmax: { max: 100, step: 1 },\n\tsvmax: { max: 100, step: 1 },\n\tlvmax: { max: 100, step: 1 },\n\tdvmax: { max: 100, step: 1 },\n};\n\nexport const LABELS = {\n\tall: __( 'All sides' ),\n\ttop: __( 'Top side' ),\n\tbottom: __( 'Bottom side' ),\n\tleft: __( 'Left side' ),\n\tright: __( 'Right side' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Top and bottom sides' ),\n\thorizontal: __( 'Left and right sides' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ] as const;\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param arr Array of items to check.\n * @return The item with the most occurrences.\n */\nfunction mode< T >( arr: T[] ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value and unit from values data.\n *\n * @param values         Box values.\n * @param selectedUnits  Box units.\n * @param availableSides Available box sides to evaluate.\n *\n * @return A value + unit for the 'all' input.\n */\nexport function getAllValue(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tavailableSides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst sides = normalizeSides( availableSides );\n\tconst parsedQuantitiesAndUnits = sides.map( ( side ) =>\n\t\tparseQuantityAndUnitFromRawValue( values[ side ] )\n\t);\n\tconst allParsedQuantities = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 0 ] ?? ''\n\t);\n\tconst allParsedUnits = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 1 ]\n\t);\n\n\tconst commonQuantity = allParsedQuantities.every(\n\t\t( v ) => v === allParsedQuantities[ 0 ]\n\t)\n\t\t? allParsedQuantities[ 0 ]\n\t\t: '';\n\n\t/**\n\t * The typeof === 'number' check is important. On reset actions, the incoming value\n\t * may be null or an empty string.\n\t *\n\t * Also, the value may also be zero (0), which is considered a valid unit value.\n\t *\n\t * typeof === 'number' is more specific for these cases, rather than relying on a\n\t * simple truthy check.\n\t */\n\tlet commonUnit;\n\tif ( typeof commonQuantity === 'number' ) {\n\t\tcommonUnit = mode( allParsedUnits );\n\t} else {\n\t\t// Set meaningful unit selection if no commonQuantity and user has previously\n\t\t// selected units without assigning values while controls were unlinked.\n\t\tcommonUnit =\n\t\t\tgetAllUnitFallback( selectedUnits ) ?? mode( allParsedUnits );\n\t}\n\n\treturn [ commonQuantity, commonUnit ].join( '' );\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param selectedUnits Current unit selections for individual sides.\n * @return  Most common unit selection.\n */\nexport function getAllUnitFallback( selectedUnits?: BoxControlValue ) {\n\tif ( ! selectedUnits || typeof selectedUnits !== 'object' ) {\n\t\treturn undefined;\n\t}\n\n\tconst filteredUnits = Object.values( selectedUnits ).filter( Boolean );\n\n\treturn mode( filteredUnits );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param values        Box values.\n * @param selectedUnits Box units.\n * @param sides         Available box sides to evaluate.\n *\n * @return Whether values are mixed.\n */\nexport function isValuesMixed(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tsides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst allValue = getAllValue( values, selectedUnits, sides );\n\tconst isMixed = isNaN( parseFloat( allValue ) );\n\n\treturn isMixed;\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param values Box values.\n *\n * @return  Whether values are mixed.\n */\nexport function isValuesDefined( values?: BoxControlValue ) {\n\treturn (\n\t\tvalues !== undefined &&\n\t\tObject.values( values ).filter(\n\t\t\t// Switching units when input is empty causes values only\n\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t// unless filtered.\n\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t).length > 0\n\t);\n}\n\n/**\n * Get initial selected side, factoring in whether the sides are linked,\n * and whether the vertical / horizontal directions are grouped via splitOnAxis.\n *\n * @param isLinked    Whether the box control's fields are linked.\n * @param splitOnAxis Whether splitting by horizontal or vertical axis.\n * @return The initial side.\n */\nexport function getInitialSide( isLinked: boolean, splitOnAxis: boolean ) {\n\tlet initialSide: keyof typeof LABELS = 'all';\n\n\tif ( ! isLinked ) {\n\t\tinitialSide = splitOnAxis ? 'vertical' : 'top';\n\t}\n\n\treturn initialSide;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param sides Available sides for box control.\n * @return Normalized sides configuration.\n */\nexport function normalizeSides( sides: BoxControlProps[ 'sides' ] ) {\n\tconst filteredSides: ( keyof BoxControlValue )[] = [];\n\n\tif ( ! sides?.length ) {\n\t\treturn ALL_SIDES;\n\t}\n\n\tif ( sides.includes( 'vertical' ) ) {\n\t\tfilteredSides.push( ...( [ 'top', 'bottom' ] as const ) );\n\t} else if ( sides.includes( 'horizontal' ) ) {\n\t\tfilteredSides.push( ...( [ 'left', 'right' ] as const ) );\n\t} else {\n\t\tconst newSides = ALL_SIDES.filter( ( side ) => sides.includes( side ) );\n\t\tfilteredSides.push( ...newSides );\n\t}\n\n\treturn filteredSides;\n}\n\n/**\n * Applies a value to an object representing top, right, bottom and left sides\n * while taking into account any custom side configuration.\n *\n * @param currentValues The current values for each side.\n * @param newValue      The value to apply to the sides object.\n * @param sides         Array defining valid sides.\n *\n * @return Object containing the updated values for each side.\n */\nexport function applyValueToSides(\n\tcurrentValues: BoxControlValue,\n\tnewValue?: string,\n\tsides?: BoxControlProps[ 'sides' ]\n): BoxControlValue {\n\tconst newValues = { ...currentValues };\n\n\tif ( sides?.length ) {\n\t\tsides.forEach( ( side ) => {\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewValues.top = newValue;\n\t\t\t\tnewValues.bottom = newValue;\n\t\t\t} else if ( side === 'horizontal' ) {\n\t\t\t\tnewValues.left = newValue;\n\t\t\t\tnewValues.right = newValue;\n\t\t\t} else {\n\t\t\t\tnewValues[ side ] = newValue;\n\t\t\t}\n\t\t} );\n\t} else {\n\t\tALL_SIDES.forEach( ( side ) => ( newValues[ side ] = newValue ) );\n\t}\n\n\treturn newValues;\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__","parseQuantityAndUnitFromRawValue","CUSTOM_VALUE_SETTINGS","px","max","step","vw","vh","em","rm","svw","lvw","dvw","svh","lvh","dvh","vi","svi","lvi","dvi","vb","svb","lvb","dvb","vmin","svmin","lvmin","dvmin","vmax","svmax","lvmax","dvmax","LABELS","all","top","bottom","left","right","mixed","vertical","horizontal","DEFAULT_VALUES","undefined","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllValue","values","selectedUnits","availableSides","sides","normalizeSides","parsedQuantitiesAndUnits","map","side","allParsedQuantities","value","_value$","allParsedUnits","commonQuantity","every","commonUnit","_getAllUnitFallback","getAllUnitFallback","join","filteredUnits","Object","Boolean","isValuesMixed","allValue","isMixed","isNaN","parseFloat","isValuesDefined","test","getInitialSide","isLinked","splitOnAxis","initialSide","filteredSides","includes","push","newSides","applyValueToSides","currentValues","newValue","newValues","forEach"],"sources":["@wordpress/components/src/box-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport type {\n\tBoxControlProps,\n\tBoxControlValue,\n\tCustomValueUnits,\n} from './types';\n\nexport const CUSTOM_VALUE_SETTINGS: CustomValueUnits = {\n\tpx: { max: 300, step: 1 },\n\t'%': { max: 100, step: 1 },\n\tvw: { max: 100, step: 1 },\n\tvh: { max: 100, step: 1 },\n\tem: { max: 10, step: 0.1 },\n\trm: { max: 10, step: 0.1 },\n\tsvw: { max: 100, step: 1 },\n\tlvw: { max: 100, step: 1 },\n\tdvw: { max: 100, step: 1 },\n\tsvh: { max: 100, step: 1 },\n\tlvh: { max: 100, step: 1 },\n\tdvh: { max: 100, step: 1 },\n\tvi: { max: 100, step: 1 },\n\tsvi: { max: 100, step: 1 },\n\tlvi: { max: 100, step: 1 },\n\tdvi: { max: 100, step: 1 },\n\tvb: { max: 100, step: 1 },\n\tsvb: { max: 100, step: 1 },\n\tlvb: { max: 100, step: 1 },\n\tdvb: { max: 100, step: 1 },\n\tvmin: { max: 100, step: 1 },\n\tsvmin: { max: 100, step: 1 },\n\tlvmin: { max: 100, step: 1 },\n\tdvmin: { max: 100, step: 1 },\n\tvmax: { max: 100, step: 1 },\n\tsvmax: { max: 100, step: 1 },\n\tlvmax: { max: 100, step: 1 },\n\tdvmax: { max: 100, step: 1 },\n};\n\nexport const LABELS = {\n\tall: __( 'All sides' ),\n\ttop: __( 'Top side' ),\n\tbottom: __( 'Bottom side' ),\n\tleft: __( 'Left side' ),\n\tright: __( 'Right side' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Top and bottom sides' ),\n\thorizontal: __( 'Left and right sides' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ] as const;\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param arr Array of items to check.\n * @return The item with the most occurrences.\n */\nfunction mode< T >( arr: T[] ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value and unit from values data.\n *\n * @param values         Box values.\n * @param selectedUnits  Box units.\n * @param availableSides Available box sides to evaluate.\n *\n * @return A value + unit for the 'all' input.\n */\nexport function getAllValue(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tavailableSides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst sides = normalizeSides( availableSides );\n\tconst parsedQuantitiesAndUnits = sides.map( ( side ) =>\n\t\tparseQuantityAndUnitFromRawValue( values[ side ] )\n\t);\n\tconst allParsedQuantities = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 0 ] ?? ''\n\t);\n\tconst allParsedUnits = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 1 ]\n\t);\n\n\tconst commonQuantity = allParsedQuantities.every(\n\t\t( v ) => v === allParsedQuantities[ 0 ]\n\t)\n\t\t? allParsedQuantities[ 0 ]\n\t\t: '';\n\n\t/**\n\t * The typeof === 'number' check is important. On reset actions, the incoming value\n\t * may be null or an empty string.\n\t *\n\t * Also, the value may also be zero (0), which is considered a valid unit value.\n\t *\n\t * typeof === 'number' is more specific for these cases, rather than relying on a\n\t * simple truthy check.\n\t */\n\tlet commonUnit;\n\tif ( typeof commonQuantity === 'number' ) {\n\t\tcommonUnit = mode( allParsedUnits );\n\t} else {\n\t\t// Set meaningful unit selection if no commonQuantity and user has previously\n\t\t// selected units without assigning values while controls were unlinked.\n\t\tcommonUnit =\n\t\t\tgetAllUnitFallback( selectedUnits ) ?? mode( allParsedUnits );\n\t}\n\n\treturn [ commonQuantity, commonUnit ].join( '' );\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param selectedUnits Current unit selections for individual sides.\n * @return  Most common unit selection.\n */\nexport function getAllUnitFallback( selectedUnits?: BoxControlValue ) {\n\tif ( ! selectedUnits || typeof selectedUnits !== 'object' ) {\n\t\treturn undefined;\n\t}\n\n\tconst filteredUnits = Object.values( selectedUnits ).filter( Boolean );\n\n\treturn mode( filteredUnits );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param values        Box values.\n * @param selectedUnits Box units.\n * @param sides         Available box sides to evaluate.\n *\n * @return Whether values are mixed.\n */\nexport function isValuesMixed(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tsides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst allValue = getAllValue( values, selectedUnits, sides );\n\tconst isMixed = isNaN( parseFloat( allValue ) );\n\n\treturn isMixed;\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param values Box values.\n *\n * @return  Whether values are mixed.\n */\nexport function isValuesDefined( values?: BoxControlValue ) {\n\treturn (\n\t\tvalues &&\n\t\tObject.values( values ).filter(\n\t\t\t// Switching units when input is empty causes values only\n\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t// unless filtered.\n\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t).length > 0\n\t);\n}\n\n/**\n * Get initial selected side, factoring in whether the sides are linked,\n * and whether the vertical / horizontal directions are grouped via splitOnAxis.\n *\n * @param isLinked    Whether the box control's fields are linked.\n * @param splitOnAxis Whether splitting by horizontal or vertical axis.\n * @return The initial side.\n */\nexport function getInitialSide( isLinked: boolean, splitOnAxis: boolean ) {\n\tlet initialSide: keyof typeof LABELS = 'all';\n\n\tif ( ! isLinked ) {\n\t\tinitialSide = splitOnAxis ? 'vertical' : 'top';\n\t}\n\n\treturn initialSide;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param sides Available sides for box control.\n * @return Normalized sides configuration.\n */\nexport function normalizeSides( sides: BoxControlProps[ 'sides' ] ) {\n\tconst filteredSides: ( keyof BoxControlValue )[] = [];\n\n\tif ( ! sides?.length ) {\n\t\treturn ALL_SIDES;\n\t}\n\n\tif ( sides.includes( 'vertical' ) ) {\n\t\tfilteredSides.push( ...( [ 'top', 'bottom' ] as const ) );\n\t} else if ( sides.includes( 'horizontal' ) ) {\n\t\tfilteredSides.push( ...( [ 'left', 'right' ] as const ) );\n\t} else {\n\t\tconst newSides = ALL_SIDES.filter( ( side ) => sides.includes( side ) );\n\t\tfilteredSides.push( ...newSides );\n\t}\n\n\treturn filteredSides;\n}\n\n/**\n * Applies a value to an object representing top, right, bottom and left sides\n * while taking into account any custom side configuration.\n *\n * @param currentValues The current values for each side.\n * @param newValue      The value to apply to the sides object.\n * @param sides         Array defining valid sides.\n *\n * @return Object containing the updated values for each side.\n */\nexport function applyValueToSides(\n\tcurrentValues: BoxControlValue,\n\tnewValue?: string,\n\tsides?: BoxControlProps[ 'sides' ]\n): BoxControlValue {\n\tconst newValues = { ...currentValues };\n\n\tif ( sides?.length ) {\n\t\tsides.forEach( ( side ) => {\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewValues.top = newValue;\n\t\t\t\tnewValues.bottom = newValue;\n\t\t\t} else if ( side === 'horizontal' ) {\n\t\t\t\tnewValues.left = newValue;\n\t\t\t\tnewValues.right = newValue;\n\t\t\t} else {\n\t\t\t\tnewValues[ side ] = newValue;\n\t\t\t}\n\t\t} );\n\t} else {\n\t\tALL_SIDES.forEach( ( side ) => ( newValues[ side ] = newValue ) );\n\t}\n\n\treturn newValues;\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/circular-option-picker/circular-option-picker-option.js

@@ -2,12 +2,11 @@
  * External dependencies
  */
 import clsx from 'clsx';
-import { useStoreState } from '@ariakit/react';
 /**
  * WordPress dependencies
  */
 import { useInstanceId } from '@wordpress/compose';
-import { forwardRef, useContext } from '@wordpress/element';
+import { forwardRef, useContext, useEffect } from '@wordpress/element';
 import { Icon, check } from '@wordpress/icons';
 
 /**
@@ -35,13 +34,20 @@ function UnforwardedOptionAsOption(props, forwardedRef) {
   const {
     id,
     isSelected,
-    compositeStore,
     ...additionalProps
   } = props;
-  const activeId = useStoreState(compositeStore, 'activeId');
-  if (isSelected && !activeId) {
-    compositeStore.setActiveId(id);
-  }
+  const {
+    setActiveId,
+    activeId
+  } = useContext(CircularOptionPickerContext);
+  useEffect(() => {
+    if (isSelected && !activeId) {
+      // The setTimeout call is necessary to make sure that this update
+      // doesn't get overridden by `Composite`'s internal logic, which picks
+      // an initial active item if one is not specifically set.
+      window.setTimeout(() => setActiveId?.(id), 0);
+    }
+  }, [isSelected, setActiveId, activeId, id]);
   return /*#__PURE__*/_jsx(Composite.Item, {
     render: /*#__PURE__*/_jsx(Button, {
       ...additionalProps,
@@ -62,7 +68,7 @@ export function Option({
 }) {
   const {
     baseId,
-    compositeStore
+    setActiveId
   } = useContext(CircularOptionPickerContext);
   const id = useInstanceId(Option, baseId || 'components-circular-option-picker__option');
   const commonProps = {
@@ -70,9 +76,9 @@ export function Option({
     className: 'components-circular-option-picker__option',
     ...additionalProps
   };
-  const optionControl = compositeStore ? /*#__PURE__*/_jsx(OptionAsOption, {
+  const isListbox = setActiveId !== undefined;
+  const optionControl = isListbox ? /*#__PURE__*/_jsx(OptionAsOption, {
     ...commonProps,
-    compositeStore: compositeStore,
     isSelected: isSelected
   }) : /*#__PURE__*/_jsx(OptionAsButton, {
     ...commonProps,

package/build-module/circular-option-picker/circular-option-picker-option.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","useStoreState","useInstanceId","forwardRef","useContext","Icon","check","CircularOptionPickerContext","Button","Composite","Tooltip","jsx","_jsx","jsxs","_jsxs","UnforwardedOptionAsButton","props","forwardedRef","isPressed","additionalProps","ref","OptionAsButton","UnforwardedOptionAsOption","id","isSelected","compositeStore","activeId","setActiveId","Item","render","role","OptionAsOption","Option","className","selectedIconProps","tooltipText","baseId","commonProps","optionControl","children","text","icon"],"sources":["@wordpress/components/src/circular-option-picker/circular-option-picker-option.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { useStoreState } from '@ariakit/react';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef, useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { CircularOptionPickerContext } from './circular-option-picker-context';\nimport Button from '../button';\nimport { Composite } from '../composite';\nimport Tooltip from '../tooltip';\nimport type { OptionProps } from './types';\n\nfunction UnforwardedOptionAsButton(\n\tprops: {\n\t\tid?: string;\n\t\tclassName?: string;\n\t\tisPressed?: boolean;\n\t},\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { isPressed, ...additionalProps } = props;\n\treturn (\n\t\t<Button\n\t\t\t{ ...additionalProps }\n\t\t\taria-pressed={ isPressed }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n}\n\nconst OptionAsButton = forwardRef( UnforwardedOptionAsButton );\n\nfunction UnforwardedOptionAsOption(\n\tprops: {\n\t\tid: string;\n\t\tclassName?: string;\n\t\tisSelected?: boolean;\n\t\tcompositeStore: NonNullable<\n\t\t\tReact.ComponentProps< typeof Composite >[ 'store' ]\n\t\t>;\n\t},\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { id, isSelected, compositeStore, ...additionalProps } = props;\n\tconst activeId = useStoreState( compositeStore, 'activeId' );\n\n\tif ( isSelected && ! activeId ) {\n\t\tcompositeStore.setActiveId( id );\n\t}\n\n\treturn (\n\t\t<Composite.Item\n\t\t\trender={\n\t\t\t\t<Button\n\t\t\t\t\t{ ...additionalProps }\n\t\t\t\t\trole=\"option\"\n\t\t\t\t\taria-selected={ !! isSelected }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t}\n\t\t\tid={ id }\n\t\t/>\n\t);\n}\n\nconst OptionAsOption = forwardRef( UnforwardedOptionAsOption );\n\nexport function Option( {\n\tclassName,\n\tisSelected,\n\tselectedIconProps = {},\n\ttooltipText,\n\t...additionalProps\n}: OptionProps ) {\n\tconst { baseId, compositeStore } = useContext(\n\t\tCircularOptionPickerContext\n\t);\n\tconst id = useInstanceId(\n\t\tOption,\n\t\tbaseId || 'components-circular-option-picker__option'\n\t);\n\n\tconst commonProps = {\n\t\tid,\n\t\tclassName: 'components-circular-option-picker__option',\n\t\t...additionalProps,\n\t};\n\n\tconst optionControl = compositeStore ? (\n\t\t<OptionAsOption\n\t\t\t{ ...commonProps }\n\t\t\tcompositeStore={ compositeStore }\n\t\t\tisSelected={ isSelected }\n\t\t/>\n\t) : (\n\t\t<OptionAsButton { ...commonProps } isPressed={ isSelected } />\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\tclassName,\n\t\t\t\t'components-circular-option-picker__option-wrapper'\n\t\t\t) }\n\t\t>\n\t\t\t{ tooltipText ? (\n\t\t\t\t<Tooltip text={ tooltipText }>{ optionControl }</Tooltip>\n\t\t\t) : (\n\t\t\t\toptionControl\n\t\t\t) }\n\t\t\t{ isSelected && <Icon icon={ check } { ...selectedIconProps } /> }\n\t\t</div>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AACvB,SAASC,aAAa,QAAQ,gBAAgB;AAG9C;AACA;AACA;AACA,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;AAC3D,SAASC,IAAI,EAAEC,KAAK,QAAQ,kBAAkB;;AAE9C;AACA;AACA;AACA,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,OAAOC,MAAM,MAAM,WAAW;AAC9B,SAASC,SAAS,QAAQ,cAAc;AACxC,OAAOC,OAAO,MAAM,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAGjC,SAASC,yBAAyBA,CACjCC,KAIC,EACDC,YAAiC,EAChC;EACD,MAAM;IAAEC,SAAS;IAAE,GAAGC;EAAgB,CAAC,GAAGH,KAAK;EAC/C,oBACCJ,IAAA,CAACJ,MAAM;IAAA,GACDW,eAAe;IACpB,gBAAeD,SAAW;IAC1BE,GAAG,EAAGH;EAAc,CACpB,CAAC;AAEJ;AAEA,MAAMI,cAAc,GAAGlB,UAAU,CAAEY,yBAA0B,CAAC;AAE9D,SAASO,yBAAyBA,CACjCN,KAOC,EACDC,YAAiC,EAChC;EACD,MAAM;IAAEM,EAAE;IAAEC,UAAU;IAAEC,cAAc;IAAE,GAAGN;EAAgB,CAAC,GAAGH,KAAK;EACpE,MAAMU,QAAQ,GAAGzB,aAAa,CAAEwB,cAAc,EAAE,UAAW,CAAC;EAE5D,IAAKD,UAAU,IAAI,CAAEE,QAAQ,EAAG;IAC/BD,cAAc,CAACE,WAAW,CAAEJ,EAAG,CAAC;EACjC;EAEA,oBACCX,IAAA,CAACH,SAAS,CAACmB,IAAI;IACdC,MAAM,eACLjB,IAAA,CAACJ,MAAM;MAAA,GACDW,eAAe;MACpBW,IAAI,EAAC,QAAQ;MACb,iBAAgB,CAAC,CAAEN,UAAY;MAC/BJ,GAAG,EAAGH;IAAc,CACpB,CACD;IACDM,EAAE,EAAGA;EAAI,CACT,CAAC;AAEJ;AAEA,MAAMQ,cAAc,GAAG5B,UAAU,CAAEmB,yBAA0B,CAAC;AAE9D,OAAO,SAASU,MAAMA,CAAE;EACvBC,SAAS;EACTT,UAAU;EACVU,iBAAiB,GAAG,CAAC,CAAC;EACtBC,WAAW;EACX,GAAGhB;AACS,CAAC,EAAG;EAChB,MAAM;IAAEiB,MAAM;IAAEX;EAAe,CAAC,GAAGrB,UAAU,CAC5CG,2BACD,CAAC;EACD,MAAMgB,EAAE,GAAGrB,aAAa,CACvB8B,MAAM,EACNI,MAAM,IAAI,2CACX,CAAC;EAED,MAAMC,WAAW,GAAG;IACnBd,EAAE;IACFU,SAAS,EAAE,2CAA2C;IACtD,GAAGd;EACJ,CAAC;EAED,MAAMmB,aAAa,GAAGb,cAAc,gBACnCb,IAAA,CAACmB,cAAc;IAAA,GACTM,WAAW;IAChBZ,cAAc,EAAGA,cAAgB;IACjCD,UAAU,EAAGA;EAAY,CACzB,CAAC,gBAEFZ,IAAA,CAACS,cAAc;IAAA,GAAMgB,WAAW;IAAGnB,SAAS,EAAGM;EAAY,CAAE,CAC7D;EAED,oBACCV,KAAA;IACCmB,SAAS,EAAGjC,IAAI,CACfiC,SAAS,EACT,mDACD,CAAG;IAAAM,QAAA,GAEDJ,WAAW,gBACZvB,IAAA,CAACF,OAAO;MAAC8B,IAAI,EAAGL,WAAa;MAAAI,QAAA,EAAGD;IAAa,CAAW,CAAC,GAEzDA,aACA,EACCd,UAAU,iBAAIZ,IAAA,CAACP,IAAI;MAACoC,IAAI,EAAGnC,KAAO;MAAA,GAAM4B;IAAiB,CAAI,CAAC;EAAA,CAC5D,CAAC;AAER","ignoreList":[]}
+{"version":3,"names":["clsx","useInstanceId","forwardRef","useContext","useEffect","Icon","check","CircularOptionPickerContext","Button","Composite","Tooltip","jsx","_jsx","jsxs","_jsxs","UnforwardedOptionAsButton","props","forwardedRef","isPressed","additionalProps","ref","OptionAsButton","UnforwardedOptionAsOption","id","isSelected","setActiveId","activeId","window","setTimeout","Item","render","role","OptionAsOption","Option","className","selectedIconProps","tooltipText","baseId","commonProps","isListbox","undefined","optionControl","children","text","icon"],"sources":["@wordpress/components/src/circular-option-picker/circular-option-picker-option.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef, useContext, useEffect } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { CircularOptionPickerContext } from './circular-option-picker-context';\nimport Button from '../button';\nimport { Composite } from '../composite';\nimport Tooltip from '../tooltip';\nimport type { OptionProps } from './types';\n\nfunction UnforwardedOptionAsButton(\n\tprops: {\n\t\tid?: string;\n\t\tclassName?: string;\n\t\tisPressed?: boolean;\n\t},\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { isPressed, ...additionalProps } = props;\n\treturn (\n\t\t<Button\n\t\t\t{ ...additionalProps }\n\t\t\taria-pressed={ isPressed }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n}\n\nconst OptionAsButton = forwardRef( UnforwardedOptionAsButton );\n\nfunction UnforwardedOptionAsOption(\n\tprops: {\n\t\tid: string;\n\t\tclassName?: string;\n\t\tisSelected?: boolean;\n\t},\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { id, isSelected, ...additionalProps } = props;\n\n\tconst { setActiveId, activeId } = useContext( CircularOptionPickerContext );\n\n\tuseEffect( () => {\n\t\tif ( isSelected && ! activeId ) {\n\t\t\t// The setTimeout call is necessary to make sure that this update\n\t\t\t// doesn't get overridden by `Composite`'s internal logic, which picks\n\t\t\t// an initial active item if one is not specifically set.\n\t\t\twindow.setTimeout( () => setActiveId?.( id ), 0 );\n\t\t}\n\t}, [ isSelected, setActiveId, activeId, id ] );\n\n\treturn (\n\t\t<Composite.Item\n\t\t\trender={\n\t\t\t\t<Button\n\t\t\t\t\t{ ...additionalProps }\n\t\t\t\t\trole=\"option\"\n\t\t\t\t\taria-selected={ !! isSelected }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t}\n\t\t\tid={ id }\n\t\t/>\n\t);\n}\n\nconst OptionAsOption = forwardRef( UnforwardedOptionAsOption );\n\nexport function Option( {\n\tclassName,\n\tisSelected,\n\tselectedIconProps = {},\n\ttooltipText,\n\t...additionalProps\n}: OptionProps ) {\n\tconst { baseId, setActiveId } = useContext( CircularOptionPickerContext );\n\tconst id = useInstanceId(\n\t\tOption,\n\t\tbaseId || 'components-circular-option-picker__option'\n\t);\n\n\tconst commonProps = {\n\t\tid,\n\t\tclassName: 'components-circular-option-picker__option',\n\t\t...additionalProps,\n\t};\n\n\tconst isListbox = setActiveId !== undefined;\n\tconst optionControl = isListbox ? (\n\t\t<OptionAsOption { ...commonProps } isSelected={ isSelected } />\n\t) : (\n\t\t<OptionAsButton { ...commonProps } isPressed={ isSelected } />\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\tclassName,\n\t\t\t\t'components-circular-option-picker__option-wrapper'\n\t\t\t) }\n\t\t>\n\t\t\t{ tooltipText ? (\n\t\t\t\t<Tooltip text={ tooltipText }>{ optionControl }</Tooltip>\n\t\t\t) : (\n\t\t\t\toptionControl\n\t\t\t) }\n\t\t\t{ isSelected && <Icon icon={ check } { ...selectedIconProps } /> }\n\t\t</div>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}