@wordpress/components 25.0.0 → 25.1.1

package/build/ui/shortcut/component.js

@@ -1,7 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _context = require("../context");
 
 var _view = require("../../view");
@@ -44,12 +40,13 @@ function Shortcut(props, forwardedRef) {
     ariaLabel = shortcut.ariaLabel;
   }
 
-  return (0, _element.createElement)(_view.View, (0, _extends2.default)({
+  return (0, _element.createElement)(_view.View, {
     as: asProp,
     className: className,
     "aria-label": ariaLabel,
-    ref: forwardedRef
-  }, otherProps), displayText);
+    ref: forwardedRef,
+    ...otherProps
+  }, displayText);
 }
 
 const ConnectedShortcut = (0, _context.contextConnect)(Shortcut, 'Shortcut');

package/build/ui/shortcut/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/shortcut/component.tsx"],"names":["Shortcut","props","forwardedRef","as","asProp","shortcut","className","otherProps","displayText","ariaLabel","display","ConnectedShortcut"],"mappings":";;;;;;;;;;;;;AAQA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;AAkBA,SAASA,QAAT,CACCC,KADD,EAECC,YAFD,EAGsB;AACrB,QAAM;AACLC,IAAAA,EAAE,EAAEC,MAAM,GAAG,MADR;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAIL,OAAGC;AAJE,MAKF,+BAAkBN,KAAlB,EAAyB,UAAzB,CALJ;;AAMA,MAAK,CAAEI,QAAP,EAAkB;AACjB,WAAO,IAAP;AACA;;AAED,MAAIG,WAAJ;AACA,MAAIC,SAAJ;;AAEA,MAAK,OAAOJ,QAAP,KAAoB,QAAzB,EAAoC;AACnCG,IAAAA,WAAW,GAAGH,QAAd;AACA,GAFD,MAEO;AACNG,IAAAA,WAAW,GAAGH,QAAQ,CAACK,OAAvB;AACAD,IAAAA,SAAS,GAAGJ,QAAQ,CAACI,SAArB;AACA;;AAED,SACC,4BAAC,UAAD;AACC,IAAA,EAAE,EAAGL,MADN;AAEC,IAAA,SAAS,EAAGE,SAFb;AAGC,kBAAaG,SAHd;AAIC,IAAA,GAAG,EAAGP;AAJP,KAKMK,UALN,GAOGC,WAPH,CADD;AAWA;;AAED,MAAMG,iBAAiB,GAAG,6BAAgBX,QAAhB,EAA0B,UAA1B,CAA1B;eAEeW,iB","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../context';\nimport { View } from '../../view';\n\nexport interface ShortcutDescription {\n\tdisplay: string;\n\tariaLabel: string;\n}\n\nexport interface Props {\n\tshortcut?: ShortcutDescription | string;\n\tclassName?: string;\n}\n\nfunction Shortcut(\n\tprops: WordPressComponentProps< Props, 'span' >,\n\tforwardedRef: ForwardedRef< any >\n): JSX.Element | null {\n\tconst {\n\t\tas: asProp = 'span',\n\t\tshortcut,\n\t\tclassName,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Shortcut' );\n\tif ( ! shortcut ) {\n\t\treturn null;\n\t}\n\n\tlet displayText: string;\n\tlet ariaLabel: string | undefined;\n\n\tif ( typeof shortcut === 'string' ) {\n\t\tdisplayText = shortcut;\n\t} else {\n\t\tdisplayText = shortcut.display;\n\t\tariaLabel = shortcut.ariaLabel;\n\t}\n\n\treturn (\n\t\t<View\n\t\t\tas={ asProp }\n\t\t\tclassName={ className }\n\t\t\taria-label={ ariaLabel }\n\t\t\tref={ forwardedRef }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t{ displayText }\n\t\t</View>\n\t);\n}\n\nconst ConnectedShortcut = contextConnect( Shortcut, 'Shortcut' );\n\nexport default ConnectedShortcut;\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/shortcut/component.tsx"],"names":["Shortcut","props","forwardedRef","as","asProp","shortcut","className","otherProps","displayText","ariaLabel","display","ConnectedShortcut"],"mappings":";;;;;;;;;AAQA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;AAkBA,SAASA,QAAT,CACCC,KADD,EAECC,YAFD,EAGsB;AACrB,QAAM;AACLC,IAAAA,EAAE,EAAEC,MAAM,GAAG,MADR;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAIL,OAAGC;AAJE,MAKF,+BAAkBN,KAAlB,EAAyB,UAAzB,CALJ;;AAMA,MAAK,CAAEI,QAAP,EAAkB;AACjB,WAAO,IAAP;AACA;;AAED,MAAIG,WAAJ;AACA,MAAIC,SAAJ;;AAEA,MAAK,OAAOJ,QAAP,KAAoB,QAAzB,EAAoC;AACnCG,IAAAA,WAAW,GAAGH,QAAd;AACA,GAFD,MAEO;AACNG,IAAAA,WAAW,GAAGH,QAAQ,CAACK,OAAvB;AACAD,IAAAA,SAAS,GAAGJ,QAAQ,CAACI,SAArB;AACA;;AAED,SACC,4BAAC,UAAD;AACC,IAAA,EAAE,EAAGL,MADN;AAEC,IAAA,SAAS,EAAGE,SAFb;AAGC,kBAAaG,SAHd;AAIC,IAAA,GAAG,EAAGP,YAJP;AAAA,OAKMK;AALN,KAOGC,WAPH,CADD;AAWA;;AAED,MAAMG,iBAAiB,GAAG,6BAAgBX,QAAhB,EAA0B,UAA1B,CAA1B;eAEeW,iB","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../context';\nimport { View } from '../../view';\n\nexport interface ShortcutDescription {\n\tdisplay: string;\n\tariaLabel: string;\n}\n\nexport interface Props {\n\tshortcut?: ShortcutDescription | string;\n\tclassName?: string;\n}\n\nfunction Shortcut(\n\tprops: WordPressComponentProps< Props, 'span' >,\n\tforwardedRef: ForwardedRef< any >\n): JSX.Element | null {\n\tconst {\n\t\tas: asProp = 'span',\n\t\tshortcut,\n\t\tclassName,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Shortcut' );\n\tif ( ! shortcut ) {\n\t\treturn null;\n\t}\n\n\tlet displayText: string;\n\tlet ariaLabel: string | undefined;\n\n\tif ( typeof shortcut === 'string' ) {\n\t\tdisplayText = shortcut;\n\t} else {\n\t\tdisplayText = shortcut.display;\n\t\tariaLabel = shortcut.ariaLabel;\n\t}\n\n\treturn (\n\t\t<View\n\t\t\tas={ asProp }\n\t\t\tclassName={ className }\n\t\t\taria-label={ ariaLabel }\n\t\t\tref={ forwardedRef }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t{ displayText }\n\t\t</View>\n\t);\n}\n\nconst ConnectedShortcut = contextConnect( Shortcut, 'Shortcut' );\n\nexport default ConnectedShortcut;\n"]}

package/build/ui/spinner/component.js

@@ -1,7 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _styles = require("./styles");
 
 var _utils = require("./utils");
@@ -50,14 +46,14 @@ function Spinner(props, forwardedRef) {
   const styles = {
     transform
   };
-  return (0, _element.createElement)(_styles.ContainerView, (0, _extends2.default)({}, otherProps, {
+  return (0, _element.createElement)(_styles.ContainerView, { ...otherProps,
     "aria-busy": true,
     ref: forwardedRef,
     style: {
       height: size,
       width: size
     }
-  }), (0, _element.createElement)(_styles.BarsWrapperView, {
+  }, (0, _element.createElement)(_styles.BarsWrapperView, {
     "aria-hidden": true,
     style: styles
   }, (0, _element.createElement)(_styles.BarsView, {

package/build/ui/spinner/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/spinner/component.js"],"names":["Spinner","props","forwardedRef","color","COLORS","gray","size","BASE_SIZE","otherProps","ratio","scale","WRAPPER_SIZE","transform","styles","height","width"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AANA;AACA;AACA;;AAMA;;AACA;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,SAASA,OAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAwC;AACvC,QAAM;AACLC,IAAAA,KAAK,GAAGC,qBAAOC,IAAP,CAAa,GAAb,CADH;AAELC,IAAAA,IAAI,GAAGC,gBAFF;AAGL,OAAGC;AAHE,MAIF,+BAAkBP,KAAlB,EAAyB,SAAzB,CAJJ;AAKA,QAAMQ,KAAK,GAAGH,IAAI,GAAGC,gBAArB;AACA,QAAMG,KAAK,GAAKD,KAAK,GAAGF,gBAAV,GAAwBI,mBAAtC;AACA,QAAMC,SAAS,GAAI,SAASF,KAAO,GAAnC;AAEA,QAAMG,MAAM,GAAG;AAAED,IAAAA;AAAF,GAAf;AAEA,SACC,4BAAC,qBAAD,6BACMJ,UADN;AAEC,iBAAY,IAFb;AAGC,IAAA,GAAG,EAAGN,YAHP;AAIC,IAAA,KAAK,EAAG;AAAEY,MAAAA,MAAM,EAAER,IAAV;AAAgBS,MAAAA,KAAK,EAAET;AAAvB;AAJT,MAMC,4BAAC,uBAAD;AAAiB,mBAAc,IAA/B;AAAsC,IAAA,KAAK,EAAGO;AAA9C,KACC,4BAAC,gBAAD;AAAU,IAAA,KAAK,EAAG;AAAEV,MAAAA;AAAF;AAAlB,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,IADD,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,IAFD,EAGC;AAAK,IAAA,SAAS,EAAC;AAAf,IAHD,EAIC;AAAK,IAAA,SAAS,EAAC;AAAf,IAJD,EAKC;AAAK,IAAA,SAAS,EAAC;AAAf,IALD,EAMC;AAAK,IAAA,SAAS,EAAC;AAAf,IAND,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,IAPD,EAQC;AAAK,IAAA,SAAS,EAAC;AAAf,IARD,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,IATD,EAUC;AAAK,IAAA,SAAS,EAAC;AAAf,IAVD,EAWC;AAAK,IAAA,SAAS,EAAC;AAAf,IAXD,EAYC;AAAK,IAAA,SAAS,EAAC;AAAf,IAZD,CADD,CAND,CADD;AAyBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;eACe,6BAAgBH,OAAhB,EAAyB,SAAzB,C","sourcesContent":["/**\n * Internal dependencies\n */\nimport { BarsView, BarsWrapperView, ContainerView } from './styles';\nimport { BASE_SIZE, WRAPPER_SIZE } from './utils';\nimport { contextConnect, useContextSystem } from '../context';\nimport { COLORS } from '../../utils/colors-values';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @typedef Props\n * @property {import('react').CSSProperties['color']} [color]   Color of `Spinner`.\n * @property {number}                                 [size=16] Size of `Spinner`.\n */\n/* eslint-enable jsdoc/valid-types */\n\n/**\n *\n * @param {import('../context').WordPressComponentProps<Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                          forwardedRef\n */\nfunction Spinner( props, forwardedRef ) {\n\tconst {\n\t\tcolor = COLORS.gray[ 900 ],\n\t\tsize = BASE_SIZE,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Spinner' );\n\tconst ratio = size / BASE_SIZE;\n\tconst scale = ( ratio * BASE_SIZE ) / WRAPPER_SIZE;\n\tconst transform = `scale(${ scale })`;\n\n\tconst styles = { transform };\n\n\treturn (\n\t\t<ContainerView\n\t\t\t{ ...otherProps }\n\t\t\taria-busy={ true }\n\t\t\tref={ forwardedRef }\n\t\t\tstyle={ { height: size, width: size } }\n\t\t>\n\t\t\t<BarsWrapperView aria-hidden={ true } style={ styles }>\n\t\t\t\t<BarsView style={ { color } }>\n\t\t\t\t\t<div className=\"InnerBar1\" />\n\t\t\t\t\t<div className=\"InnerBar2\" />\n\t\t\t\t\t<div className=\"InnerBar3\" />\n\t\t\t\t\t<div className=\"InnerBar4\" />\n\t\t\t\t\t<div className=\"InnerBar5\" />\n\t\t\t\t\t<div className=\"InnerBar6\" />\n\t\t\t\t\t<div className=\"InnerBar7\" />\n\t\t\t\t\t<div className=\"InnerBar8\" />\n\t\t\t\t\t<div className=\"InnerBar9\" />\n\t\t\t\t\t<div className=\"InnerBar10\" />\n\t\t\t\t\t<div className=\"InnerBar11\" />\n\t\t\t\t\t<div className=\"InnerBar12\" />\n\t\t\t\t</BarsView>\n\t\t\t</BarsWrapperView>\n\t\t</ContainerView>\n\t);\n}\n\n/**\n * `Spinner` is a component that notify users that their action is being processed.\n *\n * @example\n * ```jsx\n * import { Spinner } from `@wordpress/components/ui`;\n *\n * function Example() {\n * \treturn (\n * \t\t<Spinner />\n * \t);\n * }\n * ```\n */\nexport default contextConnect( Spinner, 'Spinner' );\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/spinner/component.js"],"names":["Spinner","props","forwardedRef","color","COLORS","gray","size","BASE_SIZE","otherProps","ratio","scale","WRAPPER_SIZE","transform","styles","height","width"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AANA;AACA;AACA;;AAMA;;AACA;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,SAASA,OAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAwC;AACvC,QAAM;AACLC,IAAAA,KAAK,GAAGC,qBAAOC,IAAP,CAAa,GAAb,CADH;AAELC,IAAAA,IAAI,GAAGC,gBAFF;AAGL,OAAGC;AAHE,MAIF,+BAAkBP,KAAlB,EAAyB,SAAzB,CAJJ;AAKA,QAAMQ,KAAK,GAAGH,IAAI,GAAGC,gBAArB;AACA,QAAMG,KAAK,GAAKD,KAAK,GAAGF,gBAAV,GAAwBI,mBAAtC;AACA,QAAMC,SAAS,GAAI,SAASF,KAAO,GAAnC;AAEA,QAAMG,MAAM,GAAG;AAAED,IAAAA;AAAF,GAAf;AAEA,SACC,4BAAC,qBAAD,OACMJ,UADN;AAEC,iBAAY,IAFb;AAGC,IAAA,GAAG,EAAGN,YAHP;AAIC,IAAA,KAAK,EAAG;AAAEY,MAAAA,MAAM,EAAER,IAAV;AAAgBS,MAAAA,KAAK,EAAET;AAAvB;AAJT,KAMC,4BAAC,uBAAD;AAAiB,mBAAc,IAA/B;AAAsC,IAAA,KAAK,EAAGO;AAA9C,KACC,4BAAC,gBAAD;AAAU,IAAA,KAAK,EAAG;AAAEV,MAAAA;AAAF;AAAlB,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,IADD,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,IAFD,EAGC;AAAK,IAAA,SAAS,EAAC;AAAf,IAHD,EAIC;AAAK,IAAA,SAAS,EAAC;AAAf,IAJD,EAKC;AAAK,IAAA,SAAS,EAAC;AAAf,IALD,EAMC;AAAK,IAAA,SAAS,EAAC;AAAf,IAND,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,IAPD,EAQC;AAAK,IAAA,SAAS,EAAC;AAAf,IARD,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,IATD,EAUC;AAAK,IAAA,SAAS,EAAC;AAAf,IAVD,EAWC;AAAK,IAAA,SAAS,EAAC;AAAf,IAXD,EAYC;AAAK,IAAA,SAAS,EAAC;AAAf,IAZD,CADD,CAND,CADD;AAyBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;eACe,6BAAgBH,OAAhB,EAAyB,SAAzB,C","sourcesContent":["/**\n * Internal dependencies\n */\nimport { BarsView, BarsWrapperView, ContainerView } from './styles';\nimport { BASE_SIZE, WRAPPER_SIZE } from './utils';\nimport { contextConnect, useContextSystem } from '../context';\nimport { COLORS } from '../../utils/colors-values';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @typedef Props\n * @property {import('react').CSSProperties['color']} [color]   Color of `Spinner`.\n * @property {number}                                 [size=16] Size of `Spinner`.\n */\n/* eslint-enable jsdoc/valid-types */\n\n/**\n *\n * @param {import('../context').WordPressComponentProps<Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                          forwardedRef\n */\nfunction Spinner( props, forwardedRef ) {\n\tconst {\n\t\tcolor = COLORS.gray[ 900 ],\n\t\tsize = BASE_SIZE,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Spinner' );\n\tconst ratio = size / BASE_SIZE;\n\tconst scale = ( ratio * BASE_SIZE ) / WRAPPER_SIZE;\n\tconst transform = `scale(${ scale })`;\n\n\tconst styles = { transform };\n\n\treturn (\n\t\t<ContainerView\n\t\t\t{ ...otherProps }\n\t\t\taria-busy={ true }\n\t\t\tref={ forwardedRef }\n\t\t\tstyle={ { height: size, width: size } }\n\t\t>\n\t\t\t<BarsWrapperView aria-hidden={ true } style={ styles }>\n\t\t\t\t<BarsView style={ { color } }>\n\t\t\t\t\t<div className=\"InnerBar1\" />\n\t\t\t\t\t<div className=\"InnerBar2\" />\n\t\t\t\t\t<div className=\"InnerBar3\" />\n\t\t\t\t\t<div className=\"InnerBar4\" />\n\t\t\t\t\t<div className=\"InnerBar5\" />\n\t\t\t\t\t<div className=\"InnerBar6\" />\n\t\t\t\t\t<div className=\"InnerBar7\" />\n\t\t\t\t\t<div className=\"InnerBar8\" />\n\t\t\t\t\t<div className=\"InnerBar9\" />\n\t\t\t\t\t<div className=\"InnerBar10\" />\n\t\t\t\t\t<div className=\"InnerBar11\" />\n\t\t\t\t\t<div className=\"InnerBar12\" />\n\t\t\t\t</BarsView>\n\t\t\t</BarsWrapperView>\n\t\t</ContainerView>\n\t);\n}\n\n/**\n * `Spinner` is a component that notify users that their action is being processed.\n *\n * @example\n * ```jsx\n * import { Spinner } from `@wordpress/components/ui`;\n *\n * function Example() {\n * \treturn (\n * \t\t<Spinner />\n * \t);\n * }\n * ```\n */\nexport default contextConnect( Spinner, 'Spinner' );\n"]}

package/build/ui/tooltip/component.js

@@ -9,8 +9,6 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _reakit = require("reakit");
 
 var _context = require("../context");
@@ -72,10 +70,11 @@ function Tooltip(props, forwardedRef) {
     ref: forwardedRef
   }, content, shortcut && (0, _element.createElement)(_styles.TooltipShortcut, {
     shortcut: shortcut
-  })), children && (0, _element.createElement)(_reakit.TooltipReference, (0, _extends2.default)({}, tooltip, children.props, {
+  })), children && (0, _element.createElement)(_reakit.TooltipReference, { ...tooltip,
+    ...children.props,
     // @ts-ignore If ref doesn't exist that's fine with us, it'll just be undefined, but it can exist on ReactElement and there's no reason to try to scope this (it'll just overcomplicate things)
-    ref: children === null || children === void 0 ? void 0 : children.ref
-  }), referenceProps => {
+    ref: children?.ref
+  }, referenceProps => {
     if (!focusable) {
       referenceProps.tabIndex = undefined;
     }

package/build/ui/tooltip/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/tooltip/component.js"],"names":["Tooltip","props","forwardedRef","animated","animationDuration","baseId","children","content","focusable","gutter","id","modal","placement","visible","shortcut","otherProps","tooltip","undefined","contextProps","ref","referenceProps","tabIndex","ConnectedTooltip"],"mappings":";;;;;;;;;AASA;;;;AALA;;AAUA;;AACA;;AACA;;AACA;;AAjBA;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACA;AACA,SAASA,OAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAwC;AACvC,QAAM;AACLC,IAAAA,QAAQ,GAAG,IADN;AAELC,IAAAA,iBAAiB,GAAG,GAFf;AAGLC,IAAAA,MAHK;AAILC,IAAAA,QAJK;AAKLC,IAAAA,OALK;AAMLC,IAAAA,SAAS,GAAG,IANP;AAOLC,IAAAA,MAAM,GAAG,CAPJ;AAQLC,IAAAA,EARK;AASLC,IAAAA,KAAK,GAAG,IATH;AAULC,IAAAA,SAVK;AAWLC,IAAAA,OAAO,GAAG,KAXL;AAYLC,IAAAA,QAZK;AAaL,OAAGC;AAbE,MAcF,+BAAkBd,KAAlB,EAAyB,SAAzB,CAdJ;AAgBA,QAAMe,OAAO,GAAG,6BAAiB;AAChCb,IAAAA,QAAQ,EAAEA,QAAQ,GAAGC,iBAAH,GAAuBa,SADT;AAEhCZ,IAAAA,MAAM,EAAEA,MAAM,IAAIK,EAFc;AAGhCD,IAAAA,MAHgC;AAIhCG,IAAAA,SAJgC;AAKhCC,IAAAA,OALgC;AAMhC,OAAGE;AAN6B,GAAjB,CAAhB;AASA,QAAMG,YAAY,GAAG,sBACpB,OAAQ;AACPF,IAAAA;AADO,GAAR,CADoB,EAIpB,CAAEA,OAAF,CAJoB,CAArB;AAOA,SACC,4BAAC,wBAAD,CAAgB,QAAhB;AAAyB,IAAA,KAAK,EAAGE;AAAjC,KACGX,OAAO,IACR,4BAAC,gBAAD;AAAgB,IAAA,eAAe,EAAGI,KAAlC;AAA0C,IAAA,GAAG,EAAGT;AAAhD,KACGK,OADH,EAEGO,QAAQ,IAAI,4BAAC,uBAAD;AAAiB,IAAA,QAAQ,EAAGA;AAA5B,IAFf,CAFF,EAOGR,QAAQ,IACT,4BAAC,wBAAD,6BACMU,OADN,EAEMV,QAAQ,CAACL,KAFf;AAGC;AACA,IAAA,GAAG,EAAGK,QAAH,aAAGA,QAAH,uBAAGA,QAAQ,CAAEa;AAJjB,MAMKC,cAAF,IAAsB;AACvB,QAAK,CAAEZ,SAAP,EAAmB;AAClBY,MAAAA,cAAc,CAACC,QAAf,GAA0BJ,SAA1B;AACA;;AACD,WAAO,2BAAcX,QAAd,EAAwBc,cAAxB,CAAP;AACA,GAXF,CARF,CADD;AAyBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,gBAAgB,GAAG,6BAAgBtB,OAAhB,EAAyB,SAAzB,CAAzB;eAEesB,gB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport { TooltipReference, useTooltipState } from 'reakit';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, cloneElement } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../context';\nimport { TooltipContext } from './context';\nimport TooltipContent from './content';\nimport { TooltipShortcut } from './styles';\n\n/**\n * @param {import('../context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                                            forwardedRef\n */\nfunction Tooltip( props, forwardedRef ) {\n\tconst {\n\t\tanimated = true,\n\t\tanimationDuration = 160,\n\t\tbaseId,\n\t\tchildren,\n\t\tcontent,\n\t\tfocusable = true,\n\t\tgutter = 4,\n\t\tid,\n\t\tmodal = true,\n\t\tplacement,\n\t\tvisible = false,\n\t\tshortcut,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Tooltip' );\n\n\tconst tooltip = useTooltipState( {\n\t\tanimated: animated ? animationDuration : undefined,\n\t\tbaseId: baseId || id,\n\t\tgutter,\n\t\tplacement,\n\t\tvisible,\n\t\t...otherProps,\n\t} );\n\n\tconst contextProps = useMemo(\n\t\t() => ( {\n\t\t\ttooltip,\n\t\t} ),\n\t\t[ tooltip ]\n\t);\n\n\treturn (\n\t\t<TooltipContext.Provider value={ contextProps }>\n\t\t\t{ content && (\n\t\t\t\t<TooltipContent unstable_portal={ modal } ref={ forwardedRef }>\n\t\t\t\t\t{ content }\n\t\t\t\t\t{ shortcut && <TooltipShortcut shortcut={ shortcut } /> }\n\t\t\t\t</TooltipContent>\n\t\t\t) }\n\t\t\t{ children && (\n\t\t\t\t<TooltipReference\n\t\t\t\t\t{ ...tooltip }\n\t\t\t\t\t{ ...children.props }\n\t\t\t\t\t// @ts-ignore If ref doesn't exist that's fine with us, it'll just be undefined, but it can exist on ReactElement and there's no reason to try to scope this (it'll just overcomplicate things)\n\t\t\t\t\tref={ children?.ref }\n\t\t\t\t>\n\t\t\t\t\t{ ( referenceProps ) => {\n\t\t\t\t\t\tif ( ! focusable ) {\n\t\t\t\t\t\t\treferenceProps.tabIndex = undefined;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn cloneElement( children, referenceProps );\n\t\t\t\t\t} }\n\t\t\t\t</TooltipReference>\n\t\t\t) }\n\t\t</TooltipContext.Provider>\n\t);\n}\n\n/**\n * `Tooltip` is a component that provides context for a user interface element.\n *\n * @example\n * ```jsx\n * import { Tooltip, Text } from `@wordpress/components/ui`;\n *\n * function Example() {\n * \treturn (\n * \t\t<Tooltip content=\"Code is Poetry\">\n * \t\t\t<Text>WordPress.org</Text>\n * \t\t</Tooltip>\n * \t)\n * }\n * ```\n */\nconst ConnectedTooltip = contextConnect( Tooltip, 'Tooltip' );\n\nexport default ConnectedTooltip;\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/tooltip/component.js"],"names":["Tooltip","props","forwardedRef","animated","animationDuration","baseId","children","content","focusable","gutter","id","modal","placement","visible","shortcut","otherProps","tooltip","undefined","contextProps","ref","referenceProps","tabIndex","ConnectedTooltip"],"mappings":";;;;;;;;;AASA;;AALA;;AAUA;;AACA;;AACA;;AACA;;AAjBA;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACA;AACA,SAASA,OAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAwC;AACvC,QAAM;AACLC,IAAAA,QAAQ,GAAG,IADN;AAELC,IAAAA,iBAAiB,GAAG,GAFf;AAGLC,IAAAA,MAHK;AAILC,IAAAA,QAJK;AAKLC,IAAAA,OALK;AAMLC,IAAAA,SAAS,GAAG,IANP;AAOLC,IAAAA,MAAM,GAAG,CAPJ;AAQLC,IAAAA,EARK;AASLC,IAAAA,KAAK,GAAG,IATH;AAULC,IAAAA,SAVK;AAWLC,IAAAA,OAAO,GAAG,KAXL;AAYLC,IAAAA,QAZK;AAaL,OAAGC;AAbE,MAcF,+BAAkBd,KAAlB,EAAyB,SAAzB,CAdJ;AAgBA,QAAMe,OAAO,GAAG,6BAAiB;AAChCb,IAAAA,QAAQ,EAAEA,QAAQ,GAAGC,iBAAH,GAAuBa,SADT;AAEhCZ,IAAAA,MAAM,EAAEA,MAAM,IAAIK,EAFc;AAGhCD,IAAAA,MAHgC;AAIhCG,IAAAA,SAJgC;AAKhCC,IAAAA,OALgC;AAMhC,OAAGE;AAN6B,GAAjB,CAAhB;AASA,QAAMG,YAAY,GAAG,sBACpB,OAAQ;AACPF,IAAAA;AADO,GAAR,CADoB,EAIpB,CAAEA,OAAF,CAJoB,CAArB;AAOA,SACC,4BAAC,wBAAD,CAAgB,QAAhB;AAAyB,IAAA,KAAK,EAAGE;AAAjC,KACGX,OAAO,IACR,4BAAC,gBAAD;AAAgB,IAAA,eAAe,EAAGI,KAAlC;AAA0C,IAAA,GAAG,EAAGT;AAAhD,KACGK,OADH,EAEGO,QAAQ,IAAI,4BAAC,uBAAD;AAAiB,IAAA,QAAQ,EAAGA;AAA5B,IAFf,CAFF,EAOGR,QAAQ,IACT,4BAAC,wBAAD,OACMU,OADN;AAAA,OAEMV,QAAQ,CAACL,KAFf;AAGC;AACA,IAAA,GAAG,EAAGK,QAAQ,EAAEa;AAJjB,KAMKC,cAAF,IAAsB;AACvB,QAAK,CAAEZ,SAAP,EAAmB;AAClBY,MAAAA,cAAc,CAACC,QAAf,GAA0BJ,SAA1B;AACA;;AACD,WAAO,2BAAcX,QAAd,EAAwBc,cAAxB,CAAP;AACA,GAXF,CARF,CADD;AAyBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,gBAAgB,GAAG,6BAAgBtB,OAAhB,EAAyB,SAAzB,CAAzB;eAEesB,gB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport { TooltipReference, useTooltipState } from 'reakit';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, cloneElement } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../context';\nimport { TooltipContext } from './context';\nimport TooltipContent from './content';\nimport { TooltipShortcut } from './styles';\n\n/**\n * @param {import('../context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                                            forwardedRef\n */\nfunction Tooltip( props, forwardedRef ) {\n\tconst {\n\t\tanimated = true,\n\t\tanimationDuration = 160,\n\t\tbaseId,\n\t\tchildren,\n\t\tcontent,\n\t\tfocusable = true,\n\t\tgutter = 4,\n\t\tid,\n\t\tmodal = true,\n\t\tplacement,\n\t\tvisible = false,\n\t\tshortcut,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Tooltip' );\n\n\tconst tooltip = useTooltipState( {\n\t\tanimated: animated ? animationDuration : undefined,\n\t\tbaseId: baseId || id,\n\t\tgutter,\n\t\tplacement,\n\t\tvisible,\n\t\t...otherProps,\n\t} );\n\n\tconst contextProps = useMemo(\n\t\t() => ( {\n\t\t\ttooltip,\n\t\t} ),\n\t\t[ tooltip ]\n\t);\n\n\treturn (\n\t\t<TooltipContext.Provider value={ contextProps }>\n\t\t\t{ content && (\n\t\t\t\t<TooltipContent unstable_portal={ modal } ref={ forwardedRef }>\n\t\t\t\t\t{ content }\n\t\t\t\t\t{ shortcut && <TooltipShortcut shortcut={ shortcut } /> }\n\t\t\t\t</TooltipContent>\n\t\t\t) }\n\t\t\t{ children && (\n\t\t\t\t<TooltipReference\n\t\t\t\t\t{ ...tooltip }\n\t\t\t\t\t{ ...children.props }\n\t\t\t\t\t// @ts-ignore If ref doesn't exist that's fine with us, it'll just be undefined, but it can exist on ReactElement and there's no reason to try to scope this (it'll just overcomplicate things)\n\t\t\t\t\tref={ children?.ref }\n\t\t\t\t>\n\t\t\t\t\t{ ( referenceProps ) => {\n\t\t\t\t\t\tif ( ! focusable ) {\n\t\t\t\t\t\t\treferenceProps.tabIndex = undefined;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn cloneElement( children, referenceProps );\n\t\t\t\t\t} }\n\t\t\t\t</TooltipReference>\n\t\t\t) }\n\t\t</TooltipContext.Provider>\n\t);\n}\n\n/**\n * `Tooltip` is a component that provides context for a user interface element.\n *\n * @example\n * ```jsx\n * import { Tooltip, Text } from `@wordpress/components/ui`;\n *\n * function Example() {\n * \treturn (\n * \t\t<Tooltip content=\"Code is Poetry\">\n * \t\t\t<Text>WordPress.org</Text>\n * \t\t</Tooltip>\n * \t)\n * }\n * ```\n */\nconst ConnectedTooltip = contextConnect( Tooltip, 'Tooltip' );\n\nexport default ConnectedTooltip;\n"]}

package/build/ui/tooltip/content.js

@@ -1,7 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _reakit = require("reakit");
 
 var _context = require("../context");
@@ -55,12 +51,13 @@ function TooltipContent(props, forwardedRef) {
   } = (0, _context2.useTooltipContext)();
   const cx = (0, _useCx.useCx)();
   const classes = cx(styles.TooltipContent, className);
-  return (0, _element.createElement)(_reakit.Tooltip, (0, _extends2.default)({
-    as: _view.View
-  }, otherProps, tooltip, {
+  return (0, _element.createElement)(_reakit.Tooltip, {
+    as: _view.View,
+    ...otherProps,
+    ...tooltip,
     className: classes,
     ref: forwardedRef
-  }), (0, _element.createElement)(TooltipPopoverView, null, children));
+  }, (0, _element.createElement)(TooltipPopoverView, null, children));
 }
 
 var _default = (0, _context.contextConnect)(TooltipContent, 'TooltipContent');

package/build/ui/tooltip/content.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/tooltip/content.js"],"names":["TooltipPopoverView","styles","TooltipContent","props","forwardedRef","children","className","otherProps","tooltip","cx","classes","View"],"mappings":";;;;;;;;;;;;;AAIA;;AAKA;;AACA;;AACA;;AACA;;AACA;;;;;;AAbA;AACA;AACA;AACA;;AAGA;AACA;AACA;AAOA,MAAM;AAAEA,EAAAA;AAAF,IAAyBC,MAA/B;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,KAAzB,EAAgCC,YAAhC,EAA+C;AAC9C,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,SAAZ;AAAuB,OAAGC;AAA1B,MAAyC,+BAC9CJ,KAD8C,EAE9C,gBAF8C,CAA/C;AAIA,QAAM;AAAEK,IAAAA;AAAF,MAAc,kCAApB;AACA,QAAMC,EAAE,GAAG,mBAAX;AACA,QAAMC,OAAO,GAAGD,EAAE,CAAER,MAAM,CAACC,cAAT,EAAyBI,SAAzB,CAAlB;AAEA,SACC,4BAAC,eAAD;AACC,IAAA,EAAE,EAAGK;AADN,KAEMJ,UAFN,EAGMC,OAHN;AAIC,IAAA,SAAS,EAAGE,OAJb;AAKC,IAAA,GAAG,EAAGN;AALP,MAOC,4BAAC,kBAAD,QAAsBC,QAAtB,CAPD,CADD;AAWA;;eAEc,6BAAgBH,cAAhB,EAAgC,gBAAhC,C","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport { Tooltip as ReakitTooltip } from 'reakit';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../context';\nimport { View } from '../../view';\nimport { useTooltipContext } from './context';\nimport * as styles from './styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nconst { TooltipPopoverView } = styles;\n\n/**\n *\n * @param {import('../context').WordPressComponentProps<import('./types').ContentProps, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                                                   forwardedRef\n */\nfunction TooltipContent( props, forwardedRef ) {\n\tconst { children, className, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'TooltipContent'\n\t);\n\tconst { tooltip } = useTooltipContext();\n\tconst cx = useCx();\n\tconst classes = cx( styles.TooltipContent, className );\n\n\treturn (\n\t\t<ReakitTooltip\n\t\t\tas={ View }\n\t\t\t{ ...otherProps }\n\t\t\t{ ...tooltip }\n\t\t\tclassName={ classes }\n\t\t\tref={ forwardedRef }\n\t\t>\n\t\t\t<TooltipPopoverView>{ children }</TooltipPopoverView>\n\t\t</ReakitTooltip>\n\t);\n}\n\nexport default contextConnect( TooltipContent, 'TooltipContent' );\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/tooltip/content.js"],"names":["TooltipPopoverView","styles","TooltipContent","props","forwardedRef","children","className","otherProps","tooltip","cx","classes","View"],"mappings":";;;;;;;;;AAIA;;AAKA;;AACA;;AACA;;AACA;;AACA;;;;;;AAbA;AACA;AACA;AACA;;AAGA;AACA;AACA;AAOA,MAAM;AAAEA,EAAAA;AAAF,IAAyBC,MAA/B;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,KAAzB,EAAgCC,YAAhC,EAA+C;AAC9C,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,SAAZ;AAAuB,OAAGC;AAA1B,MAAyC,+BAC9CJ,KAD8C,EAE9C,gBAF8C,CAA/C;AAIA,QAAM;AAAEK,IAAAA;AAAF,MAAc,kCAApB;AACA,QAAMC,EAAE,GAAG,mBAAX;AACA,QAAMC,OAAO,GAAGD,EAAE,CAAER,MAAM,CAACC,cAAT,EAAyBI,SAAzB,CAAlB;AAEA,SACC,4BAAC,eAAD;AACC,IAAA,EAAE,EAAGK,UADN;AAAA,OAEMJ,UAFN;AAAA,OAGMC,OAHN;AAIC,IAAA,SAAS,EAAGE,OAJb;AAKC,IAAA,GAAG,EAAGN;AALP,KAOC,4BAAC,kBAAD,QAAsBC,QAAtB,CAPD,CADD;AAWA;;eAEc,6BAAgBH,cAAhB,EAAgC,gBAAhC,C","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport { Tooltip as ReakitTooltip } from 'reakit';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../context';\nimport { View } from '../../view';\nimport { useTooltipContext } from './context';\nimport * as styles from './styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nconst { TooltipPopoverView } = styles;\n\n/**\n *\n * @param {import('../context').WordPressComponentProps<import('./types').ContentProps, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                                                   forwardedRef\n */\nfunction TooltipContent( props, forwardedRef ) {\n\tconst { children, className, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'TooltipContent'\n\t);\n\tconst { tooltip } = useTooltipContext();\n\tconst cx = useCx();\n\tconst classes = cx( styles.TooltipContent, className );\n\n\treturn (\n\t\t<ReakitTooltip\n\t\t\tas={ View }\n\t\t\t{ ...otherProps }\n\t\t\t{ ...tooltip }\n\t\t\tclassName={ classes }\n\t\t\tref={ forwardedRef }\n\t\t>\n\t\t\t<TooltipPopoverView>{ children }</TooltipPopoverView>\n\t\t</ReakitTooltip>\n\t);\n}\n\nexport default contextConnect( TooltipContent, 'TooltipContent' );\n"]}

package/build/ui/utils/colors.js

@@ -62,8 +62,6 @@ function isColor(value) {
 
 
 function _getComputedBackgroundColor(backgroundColor) {
-  var _window;
-
   if (typeof backgroundColor !== 'string') return '';
   if (isColor(backgroundColor)) return backgroundColor;
   if (!backgroundColor.includes('var(')) return '';
@@ -73,7 +71,7 @@ function _getComputedBackgroundColor(backgroundColor) {
   if (!el) return '';
   el.style.background = backgroundColor; // Grab the style.
 
-  const computedColor = (_window = window) === null || _window === void 0 ? void 0 : _window.getComputedStyle(el).background; // Reset.
+  const computedColor = window?.getComputedStyle(el).background; // Reset.
 
   el.style.background = '';
   return computedColor || '';

package/build/ui/utils/colors.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/colors.js"],"names":["colorComputationNode","namesPlugin","getColorComputationNode","document","el","createElement","setAttribute","body","appendChild","isColor","value","test","isValid","_getComputedBackgroundColor","backgroundColor","includes","style","background","computedColor","window","getComputedStyle","getComputedBackgroundColor","getOptimalTextColor","isLight","getOptimalTextShade","result"],"mappings":";;;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;;AAKA;AACA,IAAIA,oBAAJ;AAEA,oBAAQ,CAAEC,cAAF,CAAR;AAEA;AACA;AACA;;AACA,SAASC,uBAAT,GAAmC;AAClC,MAAK,OAAOC,QAAP,KAAoB,WAAzB,EAAuC;;AAEvC,MAAK,CAAEH,oBAAP,EAA8B;AAC7B;AACA,UAAMI,EAAE,GAAGD,QAAQ,CAACE,aAAT,CAAwB,KAAxB,CAAX;AACAD,IAAAA,EAAE,CAACE,YAAH,CAAiB,gCAAjB,EAAmD,EAAnD,EAH6B,CAI7B;;AACAH,IAAAA,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA2BJ,EAA3B;AACAJ,IAAAA,oBAAoB,GAAGI,EAAvB;AACA;;AAED,SAAOJ,oBAAP;AACA;AAED;AACA;AACA;AACA;AACA;;;AACA,SAASS,OAAT,CAAkBC,KAAlB,EAA0B;AACzB,MAAK,OAAOA,KAAP,KAAiB,QAAtB,EAAiC,OAAO,KAAP;AACjC,QAAMC,IAAI,GAAG,oBAAQD,KAAR,CAAb;AAEA,SAAOC,IAAI,CAACC,OAAL,EAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASC,2BAAT,CAAsCC,eAAtC,EAAwD;AAAA;;AACvD,MAAK,OAAOA,eAAP,KAA2B,QAAhC,EAA2C,OAAO,EAAP;AAE3C,MAAKL,OAAO,CAAEK,eAAF,CAAZ,EAAkC,OAAOA,eAAP;AAElC,MAAK,CAAEA,eAAe,CAACC,QAAhB,CAA0B,MAA1B,CAAP,EAA4C,OAAO,EAAP;AAC5C,MAAK,OAAOZ,QAAP,KAAoB,WAAzB,EAAuC,OAAO,EAAP,CANgB,CAQvD;;AACA,QAAMC,EAAE,GAAGF,uBAAuB,EAAlC;AACA,MAAK,CAAEE,EAAP,EAAY,OAAO,EAAP;AAEZA,EAAAA,EAAE,CAACY,KAAH,CAASC,UAAT,GAAsBH,eAAtB,CAZuD,CAavD;;AACA,QAAMI,aAAa,cAAGC,MAAH,4CAAG,QAAQC,gBAAR,CAA0BhB,EAA1B,EAA+Ba,UAArD,CAduD,CAevD;;AACAb,EAAAA,EAAE,CAACY,KAAH,CAASC,UAAT,GAAsB,EAAtB;AAEA,SAAOC,aAAa,IAAI,EAAxB;AACA;;AAED,MAAMG,0BAA0B,GAAG,qBAASR,2BAAT,CAAnC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASS,mBAAT,CAA8BR,eAA9B,EAAgD;AACtD,QAAMG,UAAU,GAAGI,0BAA0B,CAAEP,eAAF,CAA7C;AAEA,SAAO,oBAAQG,UAAR,EAAqBM,OAArB,KAAiC,SAAjC,GAA6C,SAApD;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,mBAAT,CAA8BV,eAA9B,EAAgD;AACtD,QAAMW,MAAM,GAAGH,mBAAmB,CAAER,eAAF,CAAlC;AAEA,SAAOW,MAAM,KAAK,SAAX,GAAuB,MAAvB,GAAgC,OAAvC;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport memoize from 'memize';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/** @type {HTMLDivElement} */\nlet colorComputationNode;\n\nextend( [ namesPlugin ] );\n\n/**\n * @return {HTMLDivElement | undefined} The HTML element for color computation.\n */\nfunction getColorComputationNode() {\n\tif ( typeof document === 'undefined' ) return;\n\n\tif ( ! colorComputationNode ) {\n\t\t// Create a temporary element for style computation.\n\t\tconst el = document.createElement( 'div' );\n\t\tel.setAttribute( 'data-g2-color-computation-node', '' );\n\t\t// Inject for window computed style.\n\t\tdocument.body.appendChild( el );\n\t\tcolorComputationNode = el;\n\t}\n\n\treturn colorComputationNode;\n}\n\n/**\n * @param {string | unknown} value\n *\n * @return {boolean} Whether the value is a valid color.\n */\nfunction isColor( value ) {\n\tif ( typeof value !== 'string' ) return false;\n\tconst test = colord( value );\n\n\treturn test.isValid();\n}\n\n/**\n * Retrieves the computed background color. This is useful for getting the\n * value of a CSS variable color.\n *\n * @param {string | unknown} backgroundColor The background color to compute.\n *\n * @return {string} The computed background color.\n */\nfunction _getComputedBackgroundColor( backgroundColor ) {\n\tif ( typeof backgroundColor !== 'string' ) return '';\n\n\tif ( isColor( backgroundColor ) ) return backgroundColor;\n\n\tif ( ! backgroundColor.includes( 'var(' ) ) return '';\n\tif ( typeof document === 'undefined' ) return '';\n\n\t// Attempts to gracefully handle CSS variables color values.\n\tconst el = getColorComputationNode();\n\tif ( ! el ) return '';\n\n\tel.style.background = backgroundColor;\n\t// Grab the style.\n\tconst computedColor = window?.getComputedStyle( el ).background;\n\t// Reset.\n\tel.style.background = '';\n\n\treturn computedColor || '';\n}\n\nconst getComputedBackgroundColor = memoize( _getComputedBackgroundColor );\n\n/**\n * Get the text shade optimized for readability, based on a background color.\n *\n * @param {string | unknown} backgroundColor The background color.\n *\n * @return {string} The optimized text color (black or white).\n */\nexport function getOptimalTextColor( backgroundColor ) {\n\tconst background = getComputedBackgroundColor( backgroundColor );\n\n\treturn colord( background ).isLight() ? '#000000' : '#ffffff';\n}\n\n/**\n * Get the text shade optimized for readability, based on a background color.\n *\n * @param {string | unknown} backgroundColor The background color.\n *\n * @return {string} The optimized text shade (dark or light).\n */\nexport function getOptimalTextShade( backgroundColor ) {\n\tconst result = getOptimalTextColor( backgroundColor );\n\n\treturn result === '#000000' ? 'dark' : 'light';\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/colors.js"],"names":["colorComputationNode","namesPlugin","getColorComputationNode","document","el","createElement","setAttribute","body","appendChild","isColor","value","test","isValid","_getComputedBackgroundColor","backgroundColor","includes","style","background","computedColor","window","getComputedStyle","getComputedBackgroundColor","getOptimalTextColor","isLight","getOptimalTextShade","result"],"mappings":";;;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;;AAKA;AACA,IAAIA,oBAAJ;AAEA,oBAAQ,CAAEC,cAAF,CAAR;AAEA;AACA;AACA;;AACA,SAASC,uBAAT,GAAmC;AAClC,MAAK,OAAOC,QAAP,KAAoB,WAAzB,EAAuC;;AAEvC,MAAK,CAAEH,oBAAP,EAA8B;AAC7B;AACA,UAAMI,EAAE,GAAGD,QAAQ,CAACE,aAAT,CAAwB,KAAxB,CAAX;AACAD,IAAAA,EAAE,CAACE,YAAH,CAAiB,gCAAjB,EAAmD,EAAnD,EAH6B,CAI7B;;AACAH,IAAAA,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA2BJ,EAA3B;AACAJ,IAAAA,oBAAoB,GAAGI,EAAvB;AACA;;AAED,SAAOJ,oBAAP;AACA;AAED;AACA;AACA;AACA;AACA;;;AACA,SAASS,OAAT,CAAkBC,KAAlB,EAA0B;AACzB,MAAK,OAAOA,KAAP,KAAiB,QAAtB,EAAiC,OAAO,KAAP;AACjC,QAAMC,IAAI,GAAG,oBAAQD,KAAR,CAAb;AAEA,SAAOC,IAAI,CAACC,OAAL,EAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASC,2BAAT,CAAsCC,eAAtC,EAAwD;AACvD,MAAK,OAAOA,eAAP,KAA2B,QAAhC,EAA2C,OAAO,EAAP;AAE3C,MAAKL,OAAO,CAAEK,eAAF,CAAZ,EAAkC,OAAOA,eAAP;AAElC,MAAK,CAAEA,eAAe,CAACC,QAAhB,CAA0B,MAA1B,CAAP,EAA4C,OAAO,EAAP;AAC5C,MAAK,OAAOZ,QAAP,KAAoB,WAAzB,EAAuC,OAAO,EAAP,CANgB,CAQvD;;AACA,QAAMC,EAAE,GAAGF,uBAAuB,EAAlC;AACA,MAAK,CAAEE,EAAP,EAAY,OAAO,EAAP;AAEZA,EAAAA,EAAE,CAACY,KAAH,CAASC,UAAT,GAAsBH,eAAtB,CAZuD,CAavD;;AACA,QAAMI,aAAa,GAAGC,MAAM,EAAEC,gBAAR,CAA0BhB,EAA1B,EAA+Ba,UAArD,CAduD,CAevD;;AACAb,EAAAA,EAAE,CAACY,KAAH,CAASC,UAAT,GAAsB,EAAtB;AAEA,SAAOC,aAAa,IAAI,EAAxB;AACA;;AAED,MAAMG,0BAA0B,GAAG,qBAASR,2BAAT,CAAnC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASS,mBAAT,CAA8BR,eAA9B,EAAgD;AACtD,QAAMG,UAAU,GAAGI,0BAA0B,CAAEP,eAAF,CAA7C;AAEA,SAAO,oBAAQG,UAAR,EAAqBM,OAArB,KAAiC,SAAjC,GAA6C,SAApD;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,mBAAT,CAA8BV,eAA9B,EAAgD;AACtD,QAAMW,MAAM,GAAGH,mBAAmB,CAAER,eAAF,CAAlC;AAEA,SAAOW,MAAM,KAAK,SAAX,GAAuB,MAAvB,GAAgC,OAAvC;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport memoize from 'memize';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/** @type {HTMLDivElement} */\nlet colorComputationNode;\n\nextend( [ namesPlugin ] );\n\n/**\n * @return {HTMLDivElement | undefined} The HTML element for color computation.\n */\nfunction getColorComputationNode() {\n\tif ( typeof document === 'undefined' ) return;\n\n\tif ( ! colorComputationNode ) {\n\t\t// Create a temporary element for style computation.\n\t\tconst el = document.createElement( 'div' );\n\t\tel.setAttribute( 'data-g2-color-computation-node', '' );\n\t\t// Inject for window computed style.\n\t\tdocument.body.appendChild( el );\n\t\tcolorComputationNode = el;\n\t}\n\n\treturn colorComputationNode;\n}\n\n/**\n * @param {string | unknown} value\n *\n * @return {boolean} Whether the value is a valid color.\n */\nfunction isColor( value ) {\n\tif ( typeof value !== 'string' ) return false;\n\tconst test = colord( value );\n\n\treturn test.isValid();\n}\n\n/**\n * Retrieves the computed background color. This is useful for getting the\n * value of a CSS variable color.\n *\n * @param {string | unknown} backgroundColor The background color to compute.\n *\n * @return {string} The computed background color.\n */\nfunction _getComputedBackgroundColor( backgroundColor ) {\n\tif ( typeof backgroundColor !== 'string' ) return '';\n\n\tif ( isColor( backgroundColor ) ) return backgroundColor;\n\n\tif ( ! backgroundColor.includes( 'var(' ) ) return '';\n\tif ( typeof document === 'undefined' ) return '';\n\n\t// Attempts to gracefully handle CSS variables color values.\n\tconst el = getColorComputationNode();\n\tif ( ! el ) return '';\n\n\tel.style.background = backgroundColor;\n\t// Grab the style.\n\tconst computedColor = window?.getComputedStyle( el ).background;\n\t// Reset.\n\tel.style.background = '';\n\n\treturn computedColor || '';\n}\n\nconst getComputedBackgroundColor = memoize( _getComputedBackgroundColor );\n\n/**\n * Get the text shade optimized for readability, based on a background color.\n *\n * @param {string | unknown} backgroundColor The background color.\n *\n * @return {string} The optimized text color (black or white).\n */\nexport function getOptimalTextColor( backgroundColor ) {\n\tconst background = getComputedBackgroundColor( backgroundColor );\n\n\treturn colord( background ).isLight() ? '#000000' : '#ffffff';\n}\n\n/**\n * Get the text shade optimized for readability, based on a background color.\n *\n * @param {string | unknown} backgroundColor The background color.\n *\n * @return {string} The optimized text shade (dark or light).\n */\nexport function getOptimalTextShade( backgroundColor ) {\n\tconst result = getOptimalTextColor( backgroundColor );\n\n\treturn result === '#000000' ? 'dark' : 'light';\n}\n"]}

package/build/ui/utils/font-size.js

@@ -32,9 +32,7 @@ exports.PRESET_FONT_SIZES = PRESET_FONT_SIZES;
 const HEADING_FONT_SIZES = [1, 2, 3, 4, 5, 6].flatMap(n => [n, n.toString()]);
 exports.HEADING_FONT_SIZES = HEADING_FONT_SIZES;
 
-function getFontSize() {
-  let size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : BASE_FONT_SIZE;
-
+function getFontSize(size = BASE_FONT_SIZE) {
   if (size in PRESET_FONT_SIZES) {
     return getFontSize(PRESET_FONT_SIZES[size]);
   }
@@ -49,9 +47,7 @@ function getFontSize() {
   return `calc(${ratio} * ${_configValues.default.fontSize})`;
 }
 
-function getHeadingFontSize() {
-  let size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 3;
-
+function getHeadingFontSize(size = 3) {
   if (!HEADING_FONT_SIZES.includes(size)) {
     return getFontSize(size);
   }

package/build/ui/utils/font-size.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/font-size.ts"],"names":["BASE_FONT_SIZE","PRESET_FONT_SIZES","body","caption","footnote","largeTitle","subheadline","title","HEADING_FONT_SIZES","flatMap","n","toString","getFontSize","size","parsed","parseFloat","Number","isNaN","ratio","CONFIG","fontSize","getHeadingFontSize","includes","headingSize"],"mappings":";;;;;;;;;;;AAQA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAiBO,MAAMA,cAAc,GAAG,EAAvB;;AAEA,MAAMC,iBAAiB,GAAG;AAChCC,EAAAA,IAAI,EAAEF,cAD0B;AAEhCG,EAAAA,OAAO,EAAE,EAFuB;AAGhCC,EAAAA,QAAQ,EAAE,EAHsB;AAIhCC,EAAAA,UAAU,EAAE,EAJoB;AAKhCC,EAAAA,WAAW,EAAE,EALmB;AAMhCC,EAAAA,KAAK,EAAE;AANyB,CAA1B;;AASA,MAAMC,kBAAkB,GAAG,CAAE,CAAF,EAAK,CAAL,EAAQ,CAAR,EAAW,CAAX,EAAc,CAAd,EAAiB,CAAjB,EAAqBC,OAArB,CAAgCC,CAAF,IAAS,CACxEA,CADwE,EAExEA,CAAC,CAACC,QAAF,EAFwE,CAAvC,CAA3B;;;AAKA,SAASC,WAAT,GAIG;AAAA,MAHTC,IAGS,uEAD2Bb,cAC3B;;AACT,MAAKa,IAAI,IAAIZ,iBAAb,EAAiC;AAChC,WAAOW,WAAW,CACjBX,iBAAiB,CAAEY,IAAF,CADA,CAAlB;AAGA;;AAED,MAAK,OAAOA,IAAP,KAAgB,QAArB,EAAgC;AAC/B,UAAMC,MAAM,GAAGC,UAAU,CAAEF,IAAF,CAAzB;AACA,QAAKG,MAAM,CAACC,KAAP,CAAcH,MAAd,CAAL,EAA8B,OAAOD,IAAP;AAC9BA,IAAAA,IAAI,GAAGC,MAAP;AACA;;AAED,QAAMI,KAAK,GAAI,IAAIL,IAAM,MAAMb,cAAgB,GAA/C;AACA,SAAQ,QAAQkB,KAAO,MAAMC,sBAAOC,QAAU,GAA9C;AACA;;AAEM,SAASC,kBAAT,GAA2D;AAAA,MAA9BR,IAA8B,uEAAZ,CAAY;;AACjE,MAAK,CAAEL,kBAAkB,CAACc,QAAnB,CAA6BT,IAA7B,CAAP,EAA4D;AAC3D,WAAOD,WAAW,CAAEC,IAAF,CAAlB;AACA;;AAED,QAAMU,WAAW,GAAI,YAAYV,IAAM,EAAvC;AACA,SAAOM,sBAAQI,WAAR,CAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties, ReactText } from 'react';\n\n/**\n * Internal dependencies\n */\nimport CONFIG from '../../utils/config-values';\n\nexport type HeadingSize =\n\t| 1\n\t| 2\n\t| 3\n\t| 4\n\t| 5\n\t| 6\n\t| '1'\n\t| '2'\n\t| '3'\n\t| '4'\n\t| '5'\n\t| '6';\n\nexport const BASE_FONT_SIZE = 13;\n\nexport const PRESET_FONT_SIZES = {\n\tbody: BASE_FONT_SIZE,\n\tcaption: 10,\n\tfootnote: 11,\n\tlargeTitle: 28,\n\tsubheadline: 12,\n\ttitle: 20,\n};\n\nexport const HEADING_FONT_SIZES = [ 1, 2, 3, 4, 5, 6 ].flatMap( ( n ) => [\n\tn as HeadingSize,\n\tn.toString() as HeadingSize,\n] );\n\nexport function getFontSize(\n\tsize:\n\t\t| CSSProperties[ 'fontSize' ]\n\t\t| keyof typeof PRESET_FONT_SIZES = BASE_FONT_SIZE\n): string {\n\tif ( size in PRESET_FONT_SIZES ) {\n\t\treturn getFontSize(\n\t\t\tPRESET_FONT_SIZES[ size as keyof typeof PRESET_FONT_SIZES ]\n\t\t);\n\t}\n\n\tif ( typeof size !== 'number' ) {\n\t\tconst parsed = parseFloat( size );\n\t\tif ( Number.isNaN( parsed ) ) return size;\n\t\tsize = parsed;\n\t}\n\n\tconst ratio = `(${ size } / ${ BASE_FONT_SIZE })`;\n\treturn `calc(${ ratio } * ${ CONFIG.fontSize })`;\n}\n\nexport function getHeadingFontSize( size: ReactText = 3 ): string {\n\tif ( ! HEADING_FONT_SIZES.includes( size as HeadingSize ) ) {\n\t\treturn getFontSize( size );\n\t}\n\n\tconst headingSize = `fontSizeH${ size }` as `fontSizeH${ HeadingSize }`;\n\treturn CONFIG[ headingSize ];\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/font-size.ts"],"names":["BASE_FONT_SIZE","PRESET_FONT_SIZES","body","caption","footnote","largeTitle","subheadline","title","HEADING_FONT_SIZES","flatMap","n","toString","getFontSize","size","parsed","parseFloat","Number","isNaN","ratio","CONFIG","fontSize","getHeadingFontSize","includes","headingSize"],"mappings":";;;;;;;;;;;AAQA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAiBO,MAAMA,cAAc,GAAG,EAAvB;;AAEA,MAAMC,iBAAiB,GAAG;AAChCC,EAAAA,IAAI,EAAEF,cAD0B;AAEhCG,EAAAA,OAAO,EAAE,EAFuB;AAGhCC,EAAAA,QAAQ,EAAE,EAHsB;AAIhCC,EAAAA,UAAU,EAAE,EAJoB;AAKhCC,EAAAA,WAAW,EAAE,EALmB;AAMhCC,EAAAA,KAAK,EAAE;AANyB,CAA1B;;AASA,MAAMC,kBAAkB,GAAG,CAAE,CAAF,EAAK,CAAL,EAAQ,CAAR,EAAW,CAAX,EAAc,CAAd,EAAiB,CAAjB,EAAqBC,OAArB,CAAgCC,CAAF,IAAS,CACxEA,CADwE,EAExEA,CAAC,CAACC,QAAF,EAFwE,CAAvC,CAA3B;;;AAKA,SAASC,WAAT,CACNC,IAEiC,GAAGb,cAH9B,EAIG;AACT,MAAKa,IAAI,IAAIZ,iBAAb,EAAiC;AAChC,WAAOW,WAAW,CACjBX,iBAAiB,CAAEY,IAAF,CADA,CAAlB;AAGA;;AAED,MAAK,OAAOA,IAAP,KAAgB,QAArB,EAAgC;AAC/B,UAAMC,MAAM,GAAGC,UAAU,CAAEF,IAAF,CAAzB;AACA,QAAKG,MAAM,CAACC,KAAP,CAAcH,MAAd,CAAL,EAA8B,OAAOD,IAAP;AAC9BA,IAAAA,IAAI,GAAGC,MAAP;AACA;;AAED,QAAMI,KAAK,GAAI,IAAIL,IAAM,MAAMb,cAAgB,GAA/C;AACA,SAAQ,QAAQkB,KAAO,MAAMC,sBAAOC,QAAU,GAA9C;AACA;;AAEM,SAASC,kBAAT,CAA6BR,IAAe,GAAG,CAA/C,EAA2D;AACjE,MAAK,CAAEL,kBAAkB,CAACc,QAAnB,CAA6BT,IAA7B,CAAP,EAA4D;AAC3D,WAAOD,WAAW,CAAEC,IAAF,CAAlB;AACA;;AAED,QAAMU,WAAW,GAAI,YAAYV,IAAM,EAAvC;AACA,SAAOM,sBAAQI,WAAR,CAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties, ReactText } from 'react';\n\n/**\n * Internal dependencies\n */\nimport CONFIG from '../../utils/config-values';\n\nexport type HeadingSize =\n\t| 1\n\t| 2\n\t| 3\n\t| 4\n\t| 5\n\t| 6\n\t| '1'\n\t| '2'\n\t| '3'\n\t| '4'\n\t| '5'\n\t| '6';\n\nexport const BASE_FONT_SIZE = 13;\n\nexport const PRESET_FONT_SIZES = {\n\tbody: BASE_FONT_SIZE,\n\tcaption: 10,\n\tfootnote: 11,\n\tlargeTitle: 28,\n\tsubheadline: 12,\n\ttitle: 20,\n};\n\nexport const HEADING_FONT_SIZES = [ 1, 2, 3, 4, 5, 6 ].flatMap( ( n ) => [\n\tn as HeadingSize,\n\tn.toString() as HeadingSize,\n] );\n\nexport function getFontSize(\n\tsize:\n\t\t| CSSProperties[ 'fontSize' ]\n\t\t| keyof typeof PRESET_FONT_SIZES = BASE_FONT_SIZE\n): string {\n\tif ( size in PRESET_FONT_SIZES ) {\n\t\treturn getFontSize(\n\t\t\tPRESET_FONT_SIZES[ size as keyof typeof PRESET_FONT_SIZES ]\n\t\t);\n\t}\n\n\tif ( typeof size !== 'number' ) {\n\t\tconst parsed = parseFloat( size );\n\t\tif ( Number.isNaN( parsed ) ) return size;\n\t\tsize = parsed;\n\t}\n\n\tconst ratio = `(${ size } / ${ BASE_FONT_SIZE })`;\n\treturn `calc(${ ratio } * ${ CONFIG.fontSize })`;\n}\n\nexport function getHeadingFontSize( size: ReactText = 3 ): string {\n\tif ( ! HEADING_FONT_SIZES.includes( size as HeadingSize ) ) {\n\t\treturn getFontSize( size );\n\t}\n\n\tconst headingSize = `fontSizeH${ size }` as `fontSizeH${ HeadingSize }`;\n\treturn CONFIG[ headingSize ];\n}\n"]}

package/build/ui/utils/get-high-dpi.js

@@ -10,11 +10,7 @@ var _react = require("@emotion/react");
 /**
  * External dependencies
  */
-function getHighDpi(strings) {
-  for (var _len = arguments.length, interpolations = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-    interpolations[_key - 1] = arguments[_key];
-  }
-
+function getHighDpi(strings, ...interpolations) {
   const interpolatedStyles = /*#__PURE__*/(0, _react.css)(strings, ...interpolations);
   return /*#__PURE__*/(0, _react.css)("@media ( -webkit-min-device-pixel-ratio: 1.25 ),( min-resolution: 120dpi ){", interpolatedStyles, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getHighDpi;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdWkvdXRpbHMvZ2V0LWhpZ2gtZHBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWFXIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdWkvdXRpbHMvZ2V0LWhpZ2gtZHBpLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIG5vLXJlc3RyaWN0ZWQtaW1wb3J0c1xuaW1wb3J0IHR5cGUgeyBDU1NJbnRlcnBvbGF0aW9uIH0gZnJvbSAnQGVtb3Rpb24vY3NzJztcblxuZXhwb3J0IGZ1bmN0aW9uIGdldEhpZ2hEcGkoXG5cdHN0cmluZ3M6IFRlbXBsYXRlU3RyaW5nc0FycmF5LFxuXHQuLi5pbnRlcnBvbGF0aW9uczogQ1NTSW50ZXJwb2xhdGlvbltdXG4pIHtcblx0Y29uc3QgaW50ZXJwb2xhdGVkU3R5bGVzID0gY3NzKCBzdHJpbmdzLCAuLi5pbnRlcnBvbGF0aW9ucyApO1xuXG5cdHJldHVybiBjc3NgXG5cdFx0QG1lZGlhICggLXdlYmtpdC1taW4tZGV2aWNlLXBpeGVsLXJhdGlvOiAxLjI1ICksXG5cdFx0XHQoIG1pbi1yZXNvbHV0aW9uOiAxMjBkcGkgKSB7XG5cdFx0XHQkeyBpbnRlcnBvbGF0ZWRTdHlsZXMgfVxuXHRcdH1cblx0YDtcbn1cbiJdfQ== */");
 }

package/build/ui/utils/get-high-dpi.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/get-high-dpi.ts"],"names":["getHighDpi","strings","interpolations","interpolatedStyles","css"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAKO,SAASA,UAAT,CACNC,OADM,EAGL;AAAA,oCADEC,cACF;AADEA,IAAAA,cACF;AAAA;;AACD,QAAMC,kBAAkB,gBAAG,gBAAKF,OAAL,EAAc,GAAGC,cAAjB,CAA3B;AAEA,0BAAOE,UAAP,iFAGKD,kBAHL;AAMA","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n// eslint-disable-next-line no-restricted-imports\nimport type { CSSInterpolation } from '@emotion/css';\n\nexport function getHighDpi(\n\tstrings: TemplateStringsArray,\n\t...interpolations: CSSInterpolation[]\n) {\n\tconst interpolatedStyles = css( strings, ...interpolations );\n\n\treturn css`\n\t\t@media ( -webkit-min-device-pixel-ratio: 1.25 ),\n\t\t\t( min-resolution: 120dpi ) {\n\t\t\t${ interpolatedStyles }\n\t\t}\n\t`;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/get-high-dpi.ts"],"names":["getHighDpi","strings","interpolations","interpolatedStyles","css"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAKO,SAASA,UAAT,CACNC,OADM,EAEN,GAAGC,cAFG,EAGL;AACD,QAAMC,kBAAkB,gBAAG,gBAAKF,OAAL,EAAc,GAAGC,cAAjB,CAA3B;AAEA,0BAAOE,UAAP,iFAGKD,kBAHL;AAMA","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n// eslint-disable-next-line no-restricted-imports\nimport type { CSSInterpolation } from '@emotion/css';\n\nexport function getHighDpi(\n\tstrings: TemplateStringsArray,\n\t...interpolations: CSSInterpolation[]\n) {\n\tconst interpolatedStyles = css( strings, ...interpolations );\n\n\treturn css`\n\t\t@media ( -webkit-min-device-pixel-ratio: 1.25 ),\n\t\t\t( min-resolution: 120dpi ) {\n\t\t\t${ interpolatedStyles }\n\t\t}\n\t`;\n}\n"]}

package/build/ui/utils/space.js

@@ -28,8 +28,6 @@ const GRID_BASE = '4px';
  */
 
 function space(value) {
-  var _window$CSS, _window$CSS$supports;
-
   if (typeof value === 'undefined') {
     return undefined;
   } // Handle empty strings, if it's the number 0 this still works.
@@ -41,7 +39,7 @@ function space(value) {
 
   const asInt = typeof value === 'number' ? value : Number(value); // Test if the input has a unit, was NaN, or was one of the named CSS values (like `auto`), in which case just use that value.
 
-  if (typeof window !== 'undefined' && (_window$CSS = window.CSS) !== null && _window$CSS !== void 0 && (_window$CSS$supports = _window$CSS.supports) !== null && _window$CSS$supports !== void 0 && _window$CSS$supports.call(_window$CSS, 'margin', value.toString()) || Number.isNaN(asInt)) {
+  if (typeof window !== 'undefined' && window.CSS?.supports?.('margin', value.toString()) || Number.isNaN(asInt)) {
     return value.toString();
   }
 

package/build/ui/utils/space.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/space.ts"],"names":["GRID_BASE","space","value","undefined","asInt","Number","window","CSS","supports","toString","isNaN"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAMA,SAAS,GAAG,KAAlB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,KAAT,CAAgBC,KAAhB,EAAyD;AAAA;;AAC/D,MAAK,OAAOA,KAAP,KAAiB,WAAtB,EAAoC;AACnC,WAAOC,SAAP;AACA,GAH8D,CAK/D;;;AACA,MAAK,CAAED,KAAP,EAAe;AACd,WAAO,GAAP;AACA;;AAED,QAAME,KAAK,GAAG,OAAOF,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCG,MAAM,CAAEH,KAAF,CAAxD,CAV+D,CAY/D;;AACA,MACG,OAAOI,MAAP,KAAkB,WAAlB,mBACDA,MAAM,CAACC,GADN,gEACD,YAAYC,QADX,iDACD,uCAAwB,QAAxB,EAAkCN,KAAK,CAACO,QAAN,EAAlC,CADD,IAEAJ,MAAM,CAACK,KAAP,CAAcN,KAAd,CAHD,EAIE;AACD,WAAOF,KAAK,CAACO,QAAN,EAAP;AACA;;AAED,SAAQ,QAAQT,SAAW,MAAME,KAAO,GAAxC;AACA","sourcesContent":["/**\n * The argument value for the `space()` utility function.\n *\n * When this is a number or a numeric string, it will be interpreted as a\n * multiplier for the grid base value (4px). For example, `space( 2 )` will be 8px.\n *\n * Otherwise, it will be interpreted as a literal CSS length value. For example,\n * `space( 'auto' )` will be 'auto', and `space( '2px' )` will be 2px.\n */\nexport type SpaceInput = number | string;\n\nconst GRID_BASE = '4px';\n\n/**\n * A function that handles numbers, numeric strings, and unit values.\n *\n * When given a number or a numeric string, it will return the grid-based\n * value as a factor of GRID_BASE, defined above.\n *\n * When given a unit value or one of the named CSS values like `auto`,\n * it will simply return the value back.\n *\n * @param value A number, numeric string, or a unit value.\n */\nexport function space( value?: SpaceInput ): string | undefined {\n\tif ( typeof value === 'undefined' ) {\n\t\treturn undefined;\n\t}\n\n\t// Handle empty strings, if it's the number 0 this still works.\n\tif ( ! value ) {\n\t\treturn '0';\n\t}\n\n\tconst asInt = typeof value === 'number' ? value : Number( value );\n\n\t// Test if the input has a unit, was NaN, or was one of the named CSS values (like `auto`), in which case just use that value.\n\tif (\n\t\t( typeof window !== 'undefined' &&\n\t\t\twindow.CSS?.supports?.( 'margin', value.toString() ) ) ||\n\t\tNumber.isNaN( asInt )\n\t) {\n\t\treturn value.toString();\n\t}\n\n\treturn `calc(${ GRID_BASE } * ${ value })`;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/space.ts"],"names":["GRID_BASE","space","value","undefined","asInt","Number","window","CSS","supports","toString","isNaN"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAMA,SAAS,GAAG,KAAlB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,KAAT,CAAgBC,KAAhB,EAAyD;AAC/D,MAAK,OAAOA,KAAP,KAAiB,WAAtB,EAAoC;AACnC,WAAOC,SAAP;AACA,GAH8D,CAK/D;;;AACA,MAAK,CAAED,KAAP,EAAe;AACd,WAAO,GAAP;AACA;;AAED,QAAME,KAAK,GAAG,OAAOF,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCG,MAAM,CAAEH,KAAF,CAAxD,CAV+D,CAY/D;;AACA,MACG,OAAOI,MAAP,KAAkB,WAAlB,IACDA,MAAM,CAACC,GAAP,EAAYC,QAAZ,GAAwB,QAAxB,EAAkCN,KAAK,CAACO,QAAN,EAAlC,CADD,IAEAJ,MAAM,CAACK,KAAP,CAAcN,KAAd,CAHD,EAIE;AACD,WAAOF,KAAK,CAACO,QAAN,EAAP;AACA;;AAED,SAAQ,QAAQT,SAAW,MAAME,KAAO,GAAxC;AACA","sourcesContent":["/**\n * The argument value for the `space()` utility function.\n *\n * When this is a number or a numeric string, it will be interpreted as a\n * multiplier for the grid base value (4px). For example, `space( 2 )` will be 8px.\n *\n * Otherwise, it will be interpreted as a literal CSS length value. For example,\n * `space( 'auto' )` will be 'auto', and `space( '2px' )` will be 2px.\n */\nexport type SpaceInput = number | string;\n\nconst GRID_BASE = '4px';\n\n/**\n * A function that handles numbers, numeric strings, and unit values.\n *\n * When given a number or a numeric string, it will return the grid-based\n * value as a factor of GRID_BASE, defined above.\n *\n * When given a unit value or one of the named CSS values like `auto`,\n * it will simply return the value back.\n *\n * @param value A number, numeric string, or a unit value.\n */\nexport function space( value?: SpaceInput ): string | undefined {\n\tif ( typeof value === 'undefined' ) {\n\t\treturn undefined;\n\t}\n\n\t// Handle empty strings, if it's the number 0 this still works.\n\tif ( ! value ) {\n\t\treturn '0';\n\t}\n\n\tconst asInt = typeof value === 'number' ? value : Number( value );\n\n\t// Test if the input has a unit, was NaN, or was one of the named CSS values (like `auto`), in which case just use that value.\n\tif (\n\t\t( typeof window !== 'undefined' &&\n\t\t\twindow.CSS?.supports?.( 'margin', value.toString() ) ) ||\n\t\tNumber.isNaN( asInt )\n\t) {\n\t\treturn value.toString();\n\t}\n\n\treturn `calc(${ GRID_BASE } * ${ value })`;\n}\n"]}

package/build/ui/utils/use-responsive-value.js

@@ -13,8 +13,7 @@ var _element = require("@wordpress/element");
  */
 const breakpoints = ['40em', '52em', '64em'];
 
-const useBreakpointIndex = function () {
-  let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+const useBreakpointIndex = (options = {}) => {
   const {
     defaultIndex = 0
   } = options;
@@ -56,8 +55,7 @@ const useBreakpointIndex = function () {
 
 exports.useBreakpointIndex = useBreakpointIndex;
 
-function useResponsiveValue(values) {
-  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+function useResponsiveValue(values, options = {}) {
   const index = useBreakpointIndex(options); // Allow calling the function with a "normal" value without having to check on the outside.
 
   if (!Array.isArray(values) && typeof values !== 'function') return values;

package/build/ui/utils/use-responsive-value.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/use-responsive-value.ts"],"names":["breakpoints","useBreakpointIndex","options","defaultIndex","TypeError","length","RangeError","value","setValue","getIndex","filter","bp","window","matchMedia","matches","onResize","newValue","addEventListener","removeEventListener","useResponsiveValue","values","index","Array","isArray","array"],"mappings":";;;;;;;;AAGA;;AAHA;AACA;AACA;AAGA,MAAMA,WAAW,GAAG,CAAE,MAAF,EAAU,MAAV,EAAkB,MAAlB,CAApB;;AAEO,MAAMC,kBAAkB,GAAG,YAE7B;AAAA,MADJC,OACI,uEADiC,EACjC;AACJ,QAAM;AAAEC,IAAAA,YAAY,GAAG;AAAjB,MAAuBD,OAA7B;;AAEA,MAAK,OAAOC,YAAP,KAAwB,QAA7B,EAAwC;AACvC,UAAM,IAAIC,SAAJ,CACJ,qDAAqDD,YAAc,KAAK,OAAOA,YAAc,EADzF,CAAN;AAGA,GAJD,MAIO,IAAKA,YAAY,GAAG,CAAf,IAAoBA,YAAY,GAAGH,WAAW,CAACK,MAAZ,GAAqB,CAA7D,EAAiE;AACvE,UAAM,IAAIC,UAAJ,CACJ,oDAAoDN,WAAW,CAACK,MAAQ,2BAA2BF,YAAc,EAD7G,CAAN;AAGA;;AAED,QAAM,CAAEI,KAAF,EAASC,QAAT,IAAsB,uBAAUL,YAAV,CAA5B;AAEA,0BAAW,MAAM;AAChB,UAAMM,QAAQ,GAAG,MAChBT,WAAW,CAACU,MAAZ,CAAsBC,EAAF,IAAU;AAC7B,aAAO,OAAOC,MAAP,KAAkB,WAAlB,GACJA,MAAM,CAACC,UAAP,CAAoB,0BAA0BF,EAAI,GAAlD,EACCG,OAFG,GAGJ,KAHH;AAIA,KALD,EAKIT,MANL;;AAQA,UAAMU,QAAQ,GAAG,MAAM;AACtB,YAAMC,QAAQ,GAAGP,QAAQ,EAAzB;;AACA,UAAKF,KAAK,KAAKS,QAAf,EAA0B;AACzBR,QAAAA,QAAQ,CAAEQ,QAAF,CAAR;AACA;AACD,KALD;;AAOAD,IAAAA,QAAQ;;AAER,QAAK,OAAOH,MAAP,KAAkB,WAAvB,EAAqC;AACpCA,MAAAA,MAAM,CAACK,gBAAP,CAAyB,QAAzB,EAAmCF,QAAnC;AACA;;AACD,WAAO,MAAM;AACZ,UAAK,OAAOH,MAAP,KAAkB,WAAvB,EAAqC;AACpCA,QAAAA,MAAM,CAACM,mBAAP,CAA4B,QAA5B,EAAsCH,QAAtC;AACA;AACD,KAJD;AAKA,GA1BD,EA0BG,CAAER,KAAF,CA1BH;AA4BA,SAAOA,KAAP;AACA,CA9CM;;;;AAgDA,SAASY,kBAAT,CACNC,MADM,EAGU;AAAA,MADhBlB,OACgB,uEADwC,EACxC;AAChB,QAAMmB,KAAK,GAAGpB,kBAAkB,CAAEC,OAAF,CAAhC,CADgB,CAGhB;;AACA,MAAK,CAAEoB,KAAK,CAACC,OAAN,CAAeH,MAAf,CAAF,IAA6B,OAAOA,MAAP,KAAkB,UAApD,EACC,OAAOA,MAAP;AAED,QAAMI,KAAK,GAAGJ,MAAM,IAAI,EAAxB;AAEA;;AACA;AAAO;AAAmBI,IAAAA,KAAK;AAC9B;AACAH,IAAAA,KAAK,IAAIG,KAAK,CAACnB,MAAf,GAAwBmB,KAAK,CAACnB,MAAN,GAAe,CAAvC,GAA2CgB,KAFb;AAA/B;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\n\nconst breakpoints = [ '40em', '52em', '64em' ];\n\nexport const useBreakpointIndex = (\n\toptions: { defaultIndex?: number } = {}\n) => {\n\tconst { defaultIndex = 0 } = options;\n\n\tif ( typeof defaultIndex !== 'number' ) {\n\t\tthrow new TypeError(\n\t\t\t`Default breakpoint index should be a number. Got: ${ defaultIndex }, ${ typeof defaultIndex }`\n\t\t);\n\t} else if ( defaultIndex < 0 || defaultIndex > breakpoints.length - 1 ) {\n\t\tthrow new RangeError(\n\t\t\t`Default breakpoint index out of range. Theme has ${ breakpoints.length } breakpoints, got index ${ defaultIndex }`\n\t\t);\n\t}\n\n\tconst [ value, setValue ] = useState( defaultIndex );\n\n\tuseEffect( () => {\n\t\tconst getIndex = () =>\n\t\t\tbreakpoints.filter( ( bp ) => {\n\t\t\t\treturn typeof window !== 'undefined'\n\t\t\t\t\t? window.matchMedia( `screen and (min-width: ${ bp })` )\n\t\t\t\t\t\t\t.matches\n\t\t\t\t\t: false;\n\t\t\t} ).length;\n\n\t\tconst onResize = () => {\n\t\t\tconst newValue = getIndex();\n\t\t\tif ( value !== newValue ) {\n\t\t\t\tsetValue( newValue );\n\t\t\t}\n\t\t};\n\n\t\tonResize();\n\n\t\tif ( typeof window !== 'undefined' ) {\n\t\t\twindow.addEventListener( 'resize', onResize );\n\t\t}\n\t\treturn () => {\n\t\t\tif ( typeof window !== 'undefined' ) {\n\t\t\t\twindow.removeEventListener( 'resize', onResize );\n\t\t\t}\n\t\t};\n\t}, [ value ] );\n\n\treturn value;\n};\n\nexport function useResponsiveValue< T >(\n\tvalues: ( T | undefined )[],\n\toptions: Parameters< typeof useBreakpointIndex >[ 0 ] = {}\n): T | undefined {\n\tconst index = useBreakpointIndex( options );\n\n\t// Allow calling the function with a \"normal\" value without having to check on the outside.\n\tif ( ! Array.isArray( values ) && typeof values !== 'function' )\n\t\treturn values;\n\n\tconst array = values || [];\n\n\t/* eslint-disable jsdoc/no-undefined-types */\n\treturn /** @type {T[]} */ array[\n\t\t/* eslint-enable jsdoc/no-undefined-types */\n\t\tindex >= array.length ? array.length - 1 : index\n\t];\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/use-responsive-value.ts"],"names":["breakpoints","useBreakpointIndex","options","defaultIndex","TypeError","length","RangeError","value","setValue","getIndex","filter","bp","window","matchMedia","matches","onResize","newValue","addEventListener","removeEventListener","useResponsiveValue","values","index","Array","isArray","array"],"mappings":";;;;;;;;AAGA;;AAHA;AACA;AACA;AAGA,MAAMA,WAAW,GAAG,CAAE,MAAF,EAAU,MAAV,EAAkB,MAAlB,CAApB;;AAEO,MAAMC,kBAAkB,GAAG,CACjCC,OAAkC,GAAG,EADJ,KAE7B;AACJ,QAAM;AAAEC,IAAAA,YAAY,GAAG;AAAjB,MAAuBD,OAA7B;;AAEA,MAAK,OAAOC,YAAP,KAAwB,QAA7B,EAAwC;AACvC,UAAM,IAAIC,SAAJ,CACJ,qDAAqDD,YAAc,KAAK,OAAOA,YAAc,EADzF,CAAN;AAGA,GAJD,MAIO,IAAKA,YAAY,GAAG,CAAf,IAAoBA,YAAY,GAAGH,WAAW,CAACK,MAAZ,GAAqB,CAA7D,EAAiE;AACvE,UAAM,IAAIC,UAAJ,CACJ,oDAAoDN,WAAW,CAACK,MAAQ,2BAA2BF,YAAc,EAD7G,CAAN;AAGA;;AAED,QAAM,CAAEI,KAAF,EAASC,QAAT,IAAsB,uBAAUL,YAAV,CAA5B;AAEA,0BAAW,MAAM;AAChB,UAAMM,QAAQ,GAAG,MAChBT,WAAW,CAACU,MAAZ,CAAsBC,EAAF,IAAU;AAC7B,aAAO,OAAOC,MAAP,KAAkB,WAAlB,GACJA,MAAM,CAACC,UAAP,CAAoB,0BAA0BF,EAAI,GAAlD,EACCG,OAFG,GAGJ,KAHH;AAIA,KALD,EAKIT,MANL;;AAQA,UAAMU,QAAQ,GAAG,MAAM;AACtB,YAAMC,QAAQ,GAAGP,QAAQ,EAAzB;;AACA,UAAKF,KAAK,KAAKS,QAAf,EAA0B;AACzBR,QAAAA,QAAQ,CAAEQ,QAAF,CAAR;AACA;AACD,KALD;;AAOAD,IAAAA,QAAQ;;AAER,QAAK,OAAOH,MAAP,KAAkB,WAAvB,EAAqC;AACpCA,MAAAA,MAAM,CAACK,gBAAP,CAAyB,QAAzB,EAAmCF,QAAnC;AACA;;AACD,WAAO,MAAM;AACZ,UAAK,OAAOH,MAAP,KAAkB,WAAvB,EAAqC;AACpCA,QAAAA,MAAM,CAACM,mBAAP,CAA4B,QAA5B,EAAsCH,QAAtC;AACA;AACD,KAJD;AAKA,GA1BD,EA0BG,CAAER,KAAF,CA1BH;AA4BA,SAAOA,KAAP;AACA,CA9CM;;;;AAgDA,SAASY,kBAAT,CACNC,MADM,EAENlB,OAAqD,GAAG,EAFlD,EAGU;AAChB,QAAMmB,KAAK,GAAGpB,kBAAkB,CAAEC,OAAF,CAAhC,CADgB,CAGhB;;AACA,MAAK,CAAEoB,KAAK,CAACC,OAAN,CAAeH,MAAf,CAAF,IAA6B,OAAOA,MAAP,KAAkB,UAApD,EACC,OAAOA,MAAP;AAED,QAAMI,KAAK,GAAGJ,MAAM,IAAI,EAAxB;AAEA;;AACA;AAAO;AAAmBI,IAAAA,KAAK;AAC9B;AACAH,IAAAA,KAAK,IAAIG,KAAK,CAACnB,MAAf,GAAwBmB,KAAK,CAACnB,MAAN,GAAe,CAAvC,GAA2CgB,KAFb;AAA/B;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\n\nconst breakpoints = [ '40em', '52em', '64em' ];\n\nexport const useBreakpointIndex = (\n\toptions: { defaultIndex?: number } = {}\n) => {\n\tconst { defaultIndex = 0 } = options;\n\n\tif ( typeof defaultIndex !== 'number' ) {\n\t\tthrow new TypeError(\n\t\t\t`Default breakpoint index should be a number. Got: ${ defaultIndex }, ${ typeof defaultIndex }`\n\t\t);\n\t} else if ( defaultIndex < 0 || defaultIndex > breakpoints.length - 1 ) {\n\t\tthrow new RangeError(\n\t\t\t`Default breakpoint index out of range. Theme has ${ breakpoints.length } breakpoints, got index ${ defaultIndex }`\n\t\t);\n\t}\n\n\tconst [ value, setValue ] = useState( defaultIndex );\n\n\tuseEffect( () => {\n\t\tconst getIndex = () =>\n\t\t\tbreakpoints.filter( ( bp ) => {\n\t\t\t\treturn typeof window !== 'undefined'\n\t\t\t\t\t? window.matchMedia( `screen and (min-width: ${ bp })` )\n\t\t\t\t\t\t\t.matches\n\t\t\t\t\t: false;\n\t\t\t} ).length;\n\n\t\tconst onResize = () => {\n\t\t\tconst newValue = getIndex();\n\t\t\tif ( value !== newValue ) {\n\t\t\t\tsetValue( newValue );\n\t\t\t}\n\t\t};\n\n\t\tonResize();\n\n\t\tif ( typeof window !== 'undefined' ) {\n\t\t\twindow.addEventListener( 'resize', onResize );\n\t\t}\n\t\treturn () => {\n\t\t\tif ( typeof window !== 'undefined' ) {\n\t\t\t\twindow.removeEventListener( 'resize', onResize );\n\t\t\t}\n\t\t};\n\t}, [ value ] );\n\n\treturn value;\n};\n\nexport function useResponsiveValue< T >(\n\tvalues: ( T | undefined )[],\n\toptions: Parameters< typeof useBreakpointIndex >[ 0 ] = {}\n): T | undefined {\n\tconst index = useBreakpointIndex( options );\n\n\t// Allow calling the function with a \"normal\" value without having to check on the outside.\n\tif ( ! Array.isArray( values ) && typeof values !== 'function' )\n\t\treturn values;\n\n\tconst array = values || [];\n\n\t/* eslint-disable jsdoc/no-undefined-types */\n\treturn /** @type {T[]} */ array[\n\t\t/* eslint-enable jsdoc/no-undefined-types */\n\t\tindex >= array.length ? array.length - 1 : index\n\t];\n}\n"]}