@wordpress/components 30.5.1-next.f56bd8138.0 → 30.6.1-next.b8c8708f3.0

package/build-module/select-control/chevron-down.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["chevronDown","Icon","chevronIconSize","DownArrowWrapper","InputControlSuffixWrapperWithClickThrough","jsx","_jsx","SelectControlChevronDown","children","icon","size"],"sources":["@wordpress/components/src/select-control/chevron-down.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { chevronDown, Icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport {\n\tchevronIconSize,\n\tDownArrowWrapper,\n\tInputControlSuffixWrapperWithClickThrough,\n} from './styles/select-control-styles';\n\nconst SelectControlChevronDown = () => {\n\treturn (\n\t\t<InputControlSuffixWrapperWithClickThrough>\n\t\t\t<DownArrowWrapper>\n\t\t\t\t<Icon icon={ chevronDown } size={ chevronIconSize } />\n\t\t\t</DownArrowWrapper>\n\t\t</InputControlSuffixWrapperWithClickThrough>\n\t);\n};\n\nexport default SelectControlChevronDown;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAW,EAAEC,IAAI,QAAQ,kBAAkB;;AAEpD;AACA;AACA;AACA,SACCC,eAAe,EACfC,gBAAgB,EAChBC,yCAAyC,QACnC,gCAAgC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAExC,MAAMC,wBAAwB,GAAGA,CAAA,KAAM;EACtC,oBACCD,IAAA,CAACF,yCAAyC;IAAAI,QAAA,eACzCF,IAAA,CAACH,gBAAgB;MAAAK,QAAA,eAChBF,IAAA,CAACL,IAAI;QAACQ,IAAI,EAAGT,WAAa;QAACU,IAAI,EAAGR;MAAiB,CAAE;IAAC,CACrC;EAAC,CACuB,CAAC;AAE9C,CAAC;AAED,eAAeK,wBAAwB","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/select-control/chevron-down.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { chevronDown, Icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { chevronIconSize, DownArrowWrapper, InputControlSuffixWrapperWithClickThrough } from './styles/select-control-styles';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst SelectControlChevronDown = () => {\n  return /*#__PURE__*/_jsx(InputControlSuffixWrapperWithClickThrough, {\n    children: /*#__PURE__*/_jsx(DownArrowWrapper, {\n      children: /*#__PURE__*/_jsx(Icon, {\n        icon: chevronDown,\n        size: chevronIconSize\n      })\n    })\n  });\n};\nexport default SelectControlChevronDown;"],
+  "mappings": "AAGA,SAAS,aAAa,YAAY;AAKlC,SAAS,iBAAiB,kBAAkB,iDAAiD;AAC7F,SAAS,OAAO,YAAY;AAC5B,MAAM,2BAA2B,MAAM;AACrC,SAAoB,qBAAK,2CAA2C;AAAA,IAClE,UAAuB,qBAAK,kBAAkB;AAAA,MAC5C,UAAuB,qBAAK,MAAM;AAAA,QAChC,MAAM;AAAA,QACN,MAAM;AAAA,MACR,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;AACA,IAAO,uBAAQ;",
+  "names": []
+}

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

@@ -1,22 +1,11 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
-/**
- * WordPress dependencies
- */
-import { useInstanceId } from '@wordpress/compose';
-import { forwardRef } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import BaseControl from '../base-control';
-import { Select, StyledInputBase } from './styles/select-control-styles';
-import SelectControlChevronDown from './chevron-down';
-import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
-import { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';
+import clsx from "clsx";
+import { useInstanceId } from "@wordpress/compose";
+import { forwardRef } from "@wordpress/element";
+import BaseControl from "../base-control";
+import { Select, StyledInputBase } from "./styles/select-control-styles";
+import SelectControlChevronDown from "./chevron-down";
+import { useDeprecated36pxDefaultSizeProp } from "../utils/use-deprecated-props";
+import { maybeWarnDeprecated36pxSize } from "../utils/deprecated-36px-size";
 import { jsx as _jsx } from "react/jsx-runtime";
 function useUniqueId(idProp) {
   const instanceId = useInstanceId(SelectControl);
@@ -33,8 +22,8 @@ function SelectOptions({
     ...optionProps
   }, index) => {
     const key = id || `${label}-${value}-${index}`;
-    return /*#__PURE__*/_jsx("option", {
-      value: value,
+    return /* @__PURE__ */ _jsx("option", {
+      value,
       ...optionProps,
       children: label
     }, key);
@@ -51,26 +40,24 @@ function UnforwardedSelectControl(props, ref) {
     multiple = false,
     onChange,
     options = [],
-    size = 'default',
+    size = "default",
     value: valueProp,
-    labelPosition = 'top',
+    labelPosition = "top",
     children,
     prefix,
     suffix,
-    variant = 'default',
+    variant = "default",
     __next40pxDefaultSize = false,
     __nextHasNoMarginBottom = false,
     __shouldNotWarnDeprecated36pxSize,
     ...restProps
   } = useDeprecated36pxDefaultSizeProp(props);
   const id = useUniqueId(idProp);
-  const helpId = help ? `${id}__help` : undefined;
-
-  // Disable reason: A select with an onchange throws a warning.
+  const helpId = help ? `${id}__help` : void 0;
   if (!options?.length && !children) {
     return null;
   }
-  const handleOnChange = event => {
+  const handleOnChange = (event) => {
     if (props.multiple) {
       const selectedOptions = Array.from(event.target.options).filter(({
         selected
@@ -87,81 +74,56 @@ function UnforwardedSelectControl(props, ref) {
       event
     });
   };
-  const classes = clsx('components-select-control', className);
+  const classes = clsx("components-select-control", className);
   maybeWarnDeprecated36pxSize({
-    componentName: 'SelectControl',
+    componentName: "SelectControl",
     __next40pxDefaultSize,
     size,
     __shouldNotWarnDeprecated36pxSize
   });
-  return /*#__PURE__*/_jsx(BaseControl, {
-    help: help,
-    id: id,
+  return /* @__PURE__ */ _jsx(BaseControl, {
+    help,
+    id,
     className: classes,
-    __nextHasNoMarginBottom: __nextHasNoMarginBottom,
+    __nextHasNoMarginBottom,
     __associatedWPComponentName: "SelectControl",
-    children: /*#__PURE__*/_jsx(StyledInputBase, {
-      disabled: disabled,
-      hideLabelFromVision: hideLabelFromVision,
-      id: id,
-      isBorderless: variant === 'minimal',
-      label: label,
-      size: size,
-      suffix: suffix || !multiple && /*#__PURE__*/_jsx(SelectControlChevronDown, {}),
-      prefix: prefix,
-      labelPosition: labelPosition,
-      __unstableInputWidth: variant === 'minimal' ? 'auto' : undefined,
-      variant: variant,
-      __next40pxDefaultSize: __next40pxDefaultSize,
-      children: /*#__PURE__*/_jsx(Select, {
+    children: /* @__PURE__ */ _jsx(StyledInputBase, {
+      disabled,
+      hideLabelFromVision,
+      id,
+      isBorderless: variant === "minimal",
+      label,
+      size,
+      suffix: suffix || !multiple && /* @__PURE__ */ _jsx(SelectControlChevronDown, {}),
+      prefix,
+      labelPosition,
+      __unstableInputWidth: variant === "minimal" ? "auto" : void 0,
+      variant,
+      __next40pxDefaultSize,
+      children: /* @__PURE__ */ _jsx(Select, {
         ...restProps,
-        __next40pxDefaultSize: __next40pxDefaultSize,
+        __next40pxDefaultSize,
         "aria-describedby": helpId,
         className: "components-select-control__input",
-        disabled: disabled,
-        id: id,
-        multiple: multiple,
+        disabled,
+        id,
+        multiple,
         onChange: handleOnChange,
-        ref: ref,
+        ref,
         selectSize: size,
         value: valueProp,
-        variant: variant,
-        children: children || /*#__PURE__*/_jsx(SelectOptions, {
-          options: options
+        variant,
+        children: children || /* @__PURE__ */ _jsx(SelectOptions, {
+          options
         })
       })
     })
   });
 }
-
-/**
- * `SelectControl` allows users to select from a single or multiple option menu.
- * It functions as a wrapper around the browser's native `<select>` element.
- *
- * ```jsx
- * import { SelectControl } from '@wordpress/components';
- * import { useState } from '@wordpress/element';
- *
- * const MySelectControl = () => {
- *   const [ size, setSize ] = useState( '50%' );
- *
- *   return (
- *     <SelectControl
- *       __next40pxDefaultSize
- *       __nextHasNoMarginBottom
- *       label="Size"
- *       value={ size }
- *       options={ [
- *         { label: 'Big', value: '100%' },
- *         { label: 'Medium', value: '50%' },
- *         { label: 'Small', value: '25%' },
- *       ] }
- *       onChange={ setSize }
- *     />
- *   );
- * };
- * ```
- */
-export const SelectControl = forwardRef(UnforwardedSelectControl);
-export default SelectControl;
-//# sourceMappingURL=index.js.map
+const SelectControl = forwardRef(UnforwardedSelectControl);
+var select_control_default = SelectControl;
+export {
+  SelectControl,
+  select_control_default as default
+};
+//# sourceMappingURL=index.js.map

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

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