@wordpress/components 30.9.1-next.8b30e05b0.0 → 31.0.1-next.738bb1424.0

package/build/form-token-field/styles.cjs

@@ -0,0 +1,55 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/form-token-field/styles.ts
+var styles_exports = {};
+__export(styles_exports, {
+  TokensAndInputWrapperFlex: () => TokensAndInputWrapperFlex
+});
+module.exports = __toCommonJS(styles_exports);
+var import_base = __toESM(require("@emotion/styled/base"), 1);
+var import_react = require("@emotion/react");
+var import_flex = require("../flex/index.cjs");
+var import_space = require("../utils/space.cjs");
+var import_utils = require("../utils/index.cjs");
+var deprecatedPaddings = ({
+  __next40pxDefaultSize,
+  hasTokens
+}) => !__next40pxDefaultSize && /* @__PURE__ */ (0, import_react.css)("padding-top:", (0, import_space.space)(hasTokens ? 1 : 0.5), ";padding-bottom:", (0, import_space.space)(hasTokens ? 1 : 0.5), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:deprecatedPaddings;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QkkiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vZmxleCc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcbmltcG9ydCB7IGJveFNpemluZ1Jlc2V0IH0gZnJvbSAnLi4vdXRpbHMnO1xuXG50eXBlIFRva2Vuc0FuZElucHV0V3JhcHBlclByb3BzID0ge1xuXHRfX25leHQ0MHB4RGVmYXVsdFNpemU6IGJvb2xlYW47XG5cdGhhc1Rva2VuczogYm9vbGVhbjtcbn07XG5cbmNvbnN0IGRlcHJlY2F0ZWRQYWRkaW5ncyA9ICgge1xuXHRfX25leHQ0MHB4RGVmYXVsdFNpemUsXG5cdGhhc1Rva2Vucyxcbn06IFRva2Vuc0FuZElucHV0V3JhcHBlclByb3BzICkgPT5cblx0ISBfX25leHQ0MHB4RGVmYXVsdFNpemUgJiZcblx0Y3NzYFxuXHRcdHBhZGRpbmctdG9wOiAkeyBzcGFjZSggaGFzVG9rZW5zID8gMSA6IDAuNSApIH07XG5cdFx0cGFkZGluZy1ib3R0b206ICR7IHNwYWNlKCBoYXNUb2tlbnMgPyAxIDogMC41ICkgfTtcblx0YDtcblxuZXhwb3J0IGNvbnN0IFRva2Vuc0FuZElucHV0V3JhcHBlckZsZXggPSBzdHlsZWQoIEZsZXggKWBcblx0cGFkZGluZzogN3B4O1xuXHQkeyBib3hTaXppbmdSZXNldCB9XG5cblx0JHsgZGVwcmVjYXRlZFBhZGRpbmdzIH1cbmA7XG4iXX0= */");
+var TokensAndInputWrapperFlex = /* @__PURE__ */ (0, import_base.default)(import_flex.Flex, process.env.NODE_ENV === "production" ? {
+  target: "ehq8nmi0"
+} : {
+  target: "ehq8nmi0",
+  label: "TokensAndInputWrapperFlex"
+})("padding:7px;", import_utils.boxSizingReset, " ", deprecatedPaddings, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QnVEIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uL2ZsZXgnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgeyBib3hTaXppbmdSZXNldCB9IGZyb20gJy4uL3V0aWxzJztcblxudHlwZSBUb2tlbnNBbmRJbnB1dFdyYXBwZXJQcm9wcyA9IHtcblx0X19uZXh0NDBweERlZmF1bHRTaXplOiBib29sZWFuO1xuXHRoYXNUb2tlbnM6IGJvb2xlYW47XG59O1xuXG5jb25zdCBkZXByZWNhdGVkUGFkZGluZ3MgPSAoIHtcblx0X19uZXh0NDBweERlZmF1bHRTaXplLFxuXHRoYXNUb2tlbnMsXG59OiBUb2tlbnNBbmRJbnB1dFdyYXBwZXJQcm9wcyApID0+XG5cdCEgX19uZXh0NDBweERlZmF1bHRTaXplICYmXG5cdGNzc2Bcblx0XHRwYWRkaW5nLXRvcDogJHsgc3BhY2UoIGhhc1Rva2VucyA/IDEgOiAwLjUgKSB9O1xuXHRcdHBhZGRpbmctYm90dG9tOiAkeyBzcGFjZSggaGFzVG9rZW5zID8gMSA6IDAuNSApIH07XG5cdGA7XG5cbmV4cG9ydCBjb25zdCBUb2tlbnNBbmRJbnB1dFdyYXBwZXJGbGV4ID0gc3R5bGVkKCBGbGV4IClgXG5cdHBhZGRpbmc6IDdweDtcblx0JHsgYm94U2l6aW5nUmVzZXQgfVxuXG5cdCR7IGRlcHJlY2F0ZWRQYWRkaW5ncyB9XG5gO1xuIl19 */"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TokensAndInputWrapperFlex
+});
+//# sourceMappingURL=styles.cjs.map

package/build/form-token-field/suggestions-list.cjs

@@ -0,0 +1,138 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/form-token-field/suggestions-list.tsx
+var suggestions_list_exports = {};
+__export(suggestions_list_exports, {
+  SuggestionsList: () => SuggestionsList,
+  default: () => suggestions_list_default
+});
+module.exports = __toCommonJS(suggestions_list_exports);
+var import_clsx = __toESM(require("clsx"), 1);
+var import_compose = require("@wordpress/compose");
+var import_i18n = require("@wordpress/i18n");
+var import_jsx_runtime = require("react/jsx-runtime");
+var handleMouseDown = (e) => {
+  e.preventDefault();
+};
+function SuggestionsList({
+  selectedIndex,
+  scrollIntoView,
+  match,
+  onHover,
+  onSelect,
+  suggestions = [],
+  displayTransform,
+  instanceId,
+  __experimentalRenderItem
+}) {
+  const listRef = (0, import_compose.useRefEffect)((listNode) => {
+    if (selectedIndex > -1 && scrollIntoView && listNode.children[selectedIndex]) {
+      listNode.children[selectedIndex].scrollIntoView({
+        behavior: "instant",
+        block: "nearest",
+        inline: "nearest"
+      });
+    }
+  }, [selectedIndex, scrollIntoView]);
+  const handleHover = (suggestion) => {
+    return () => {
+      onHover?.(suggestion);
+    };
+  };
+  const handleClick = (suggestion) => {
+    return () => {
+      onSelect?.(suggestion);
+    };
+  };
+  const computeSuggestionMatch = (suggestion) => {
+    const matchText = displayTransform(match).normalize("NFKC").toLocaleLowerCase();
+    if (matchText.length === 0) {
+      return null;
+    }
+    const transformedSuggestion = displayTransform(suggestion);
+    const indexOfMatch = transformedSuggestion.normalize("NFKC").toLocaleLowerCase().indexOf(matchText);
+    return {
+      suggestionBeforeMatch: transformedSuggestion.substring(0, indexOfMatch),
+      suggestionMatch: transformedSuggestion.substring(indexOfMatch, indexOfMatch + matchText.length),
+      suggestionAfterMatch: transformedSuggestion.substring(indexOfMatch + matchText.length)
+    };
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("ul", {
+    ref: listRef,
+    className: "components-form-token-field__suggestions-list",
+    id: `components-form-token-suggestions-${instanceId}`,
+    role: "listbox",
+    children: [suggestions.map((suggestion, index) => {
+      const matchText = computeSuggestionMatch(suggestion);
+      const isSelected = index === selectedIndex;
+      const isDisabled = typeof suggestion === "object" && suggestion?.disabled;
+      const key = typeof suggestion === "object" && "value" in suggestion ? suggestion?.value : displayTransform(suggestion);
+      const className = (0, import_clsx.default)("components-form-token-field__suggestion", {
+        "is-selected": isSelected
+      });
+      let output;
+      if (typeof __experimentalRenderItem === "function") {
+        output = __experimentalRenderItem({
+          item: suggestion
+        });
+      } else if (matchText) {
+        output = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+          "aria-label": displayTransform(suggestion),
+          children: [matchText.suggestionBeforeMatch, /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", {
+            className: "components-form-token-field__suggestion-match",
+            children: matchText.suggestionMatch
+          }), matchText.suggestionAfterMatch]
+        });
+      } else {
+        output = displayTransform(suggestion);
+      }
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", {
+        id: `components-form-token-suggestions-${instanceId}-${index}`,
+        role: "option",
+        className,
+        onMouseDown: handleMouseDown,
+        onClick: handleClick(suggestion),
+        onMouseEnter: handleHover(suggestion),
+        "aria-selected": index === selectedIndex,
+        "aria-disabled": isDisabled,
+        children: output
+      }, key);
+    }), suggestions.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", {
+      className: "components-form-token-field__suggestion is-empty",
+      children: (0, import_i18n.__)("No items found")
+    })]
+  });
+}
+var suggestions_list_default = SuggestionsList;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SuggestionsList
+});
+//# sourceMappingURL=suggestions-list.cjs.map

package/build/form-token-field/token-input.cjs

@@ -0,0 +1,103 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/form-token-field/token-input.tsx
+var token_input_exports = {};
+__export(token_input_exports, {
+  TokenInput: () => TokenInput,
+  UnForwardedTokenInput: () => UnForwardedTokenInput,
+  default: () => token_input_default
+});
+module.exports = __toCommonJS(token_input_exports);
+var import_clsx = __toESM(require("clsx"), 1);
+var import_element = require("@wordpress/element");
+var import_jsx_runtime = require("react/jsx-runtime");
+function UnForwardedTokenInput(props, ref) {
+  const {
+    value,
+    isExpanded,
+    instanceId,
+    selectedSuggestionIndex,
+    className,
+    onChange,
+    onFocus,
+    onBlur,
+    ...restProps
+  } = props;
+  const [hasFocus, setHasFocus] = (0, import_element.useState)(false);
+  const size = value ? value.length + 1 : 0;
+  const onChangeHandler = (event) => {
+    if (onChange) {
+      onChange({
+        value: event.target.value
+      });
+    }
+  };
+  const onFocusHandler = (e) => {
+    setHasFocus(true);
+    onFocus?.(e);
+  };
+  const onBlurHandler = (e) => {
+    setHasFocus(false);
+    onBlur?.(e);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
+    ref,
+    id: `components-form-token-input-${instanceId}`,
+    type: "text",
+    ...restProps,
+    value: value || "",
+    onChange: onChangeHandler,
+    onFocus: onFocusHandler,
+    onBlur: onBlurHandler,
+    size,
+    className: (0, import_clsx.default)(className, "components-form-token-field__input"),
+    autoComplete: "off",
+    role: "combobox",
+    "aria-expanded": isExpanded,
+    "aria-autocomplete": "list",
+    "aria-owns": isExpanded ? `components-form-token-suggestions-${instanceId}` : void 0,
+    "aria-activedescendant": (
+      // Only add the `aria-activedescendant` attribute when:
+      // - the user is actively interacting with the input (`hasFocus`)
+      // - there is a selected suggestion (`selectedSuggestionIndex !== -1`)
+      // - the list of suggestions are rendered in the DOM (`isExpanded`)
+      hasFocus && selectedSuggestionIndex !== -1 && isExpanded ? `components-form-token-suggestions-${instanceId}-${selectedSuggestionIndex}` : void 0
+    ),
+    "aria-describedby": `components-form-token-suggestions-howto-${instanceId}`
+  });
+}
+var TokenInput = (0, import_element.forwardRef)(UnForwardedTokenInput);
+var token_input_default = TokenInput;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TokenInput,
+  UnForwardedTokenInput
+});
+//# sourceMappingURL=token-input.cjs.map

package/build/form-token-field/token.cjs

@@ -0,0 +1,104 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/form-token-field/token.tsx
+var token_exports = {};
+__export(token_exports, {
+  default: () => Token
+});
+module.exports = __toCommonJS(token_exports);
+var import_clsx = __toESM(require("clsx"), 1);
+var import_compose = require("@wordpress/compose");
+var import_i18n = require("@wordpress/i18n");
+var import_icons = require("@wordpress/icons");
+var import_button = __toESM(require("../button/index.cjs"), 1);
+var import_visually_hidden = require("../visually-hidden/index.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+var noop = () => {
+};
+function Token({
+  value,
+  status,
+  title,
+  displayTransform,
+  isBorderless = false,
+  disabled = false,
+  onClickRemove = noop,
+  onMouseEnter,
+  onMouseLeave,
+  messages,
+  termPosition,
+  termsCount
+}) {
+  const instanceId = (0, import_compose.useInstanceId)(Token);
+  const tokenClasses = (0, import_clsx.default)("components-form-token-field__token", {
+    "is-error": "error" === status,
+    "is-success": "success" === status,
+    "is-validating": "validating" === status,
+    "is-borderless": isBorderless,
+    "is-disabled": disabled
+  });
+  const onClick = () => onClickRemove({
+    value
+  });
+  const transformedValue = displayTransform(value);
+  const termPositionAndCount = (0, import_i18n.sprintf)(
+    /* translators: 1: term name, 2: term position in a set of terms, 3: total term set count. */
+    (0, import_i18n.__)("%1$s (%2$d of %3$d)"),
+    transformedValue,
+    termPosition,
+    termsCount
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+    className: tokenClasses,
+    onMouseEnter,
+    onMouseLeave,
+    title,
+    children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+      className: "components-form-token-field__token-text",
+      id: `components-form-token-field__token-text-${instanceId}`,
+      children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_visually_hidden.VisuallyHidden, {
+        as: "span",
+        children: termPositionAndCount
+      }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+        "aria-hidden": "true",
+        children: transformedValue
+      })]
+    }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.default, {
+      className: "components-form-token-field__remove-token",
+      size: "small",
+      icon: import_icons.closeSmall,
+      onClick: !disabled ? onClick : void 0,
+      disabled,
+      label: messages.remove,
+      "aria-describedby": `components-form-token-field__token-text-${instanceId}`
+    })]
+  });
+}
+//# sourceMappingURL=token.cjs.map

package/build/form-token-field/types.cjs

@@ -0,0 +1,19 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/form-token-field/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.cjs.map

package/build/gradient-picker/index.cjs

@@ -0,0 +1,190 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/gradient-picker/index.tsx
+var gradient_picker_exports = {};
+__export(gradient_picker_exports, {
+  GradientPicker: () => GradientPicker,
+  default: () => gradient_picker_default
+});
+module.exports = __toCommonJS(gradient_picker_exports);
+var import_i18n = require("@wordpress/i18n");
+var import_compose = require("@wordpress/compose");
+var import_element = require("@wordpress/element");
+var import_circular_option_picker = __toESM(require("../circular-option-picker/index.cjs"), 1);
+var import_custom_gradient_picker = __toESM(require("../custom-gradient-picker/index.cjs"), 1);
+var import_v_stack = require("../v-stack/index.cjs");
+var import_styles = require("../color-palette/styles.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+var isMultipleOriginObject = (obj) => Array.isArray(obj.gradients) && !("gradient" in obj);
+var isMultipleOriginArray = (arr) => {
+  return arr.length > 0 && arr.every((gradientObj) => isMultipleOriginObject(gradientObj));
+};
+function SingleOrigin({
+  className,
+  clearGradient,
+  gradients,
+  onChange,
+  value,
+  ...additionalProps
+}) {
+  const gradientOptions = (0, import_element.useMemo)(() => {
+    return gradients.map(({
+      gradient,
+      name,
+      slug
+    }, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_circular_option_picker.default.Option, {
+      value: gradient,
+      isSelected: value === gradient,
+      tooltipText: name || // translators: %s: gradient code e.g: "linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);".
+      (0, import_i18n.sprintf)((0, import_i18n.__)("Gradient code: %s"), gradient),
+      style: {
+        color: "rgba( 0,0,0,0 )",
+        background: gradient
+      },
+      onClick: value === gradient ? clearGradient : () => onChange(gradient, index),
+      "aria-label": name ? (
+        // translators: %s: The name of the gradient e.g: "Angular red to blue".
+        (0, import_i18n.sprintf)((0, import_i18n.__)("Gradient: %s"), name)
+      ) : (
+        // translators: %s: gradient code e.g: "linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);".
+        (0, import_i18n.sprintf)((0, import_i18n.__)("Gradient code: %s"), gradient)
+      )
+    }, slug));
+  }, [gradients, value, onChange, clearGradient]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_circular_option_picker.default.OptionGroup, {
+    className,
+    options: gradientOptions,
+    ...additionalProps
+  });
+}
+function MultipleOrigin({
+  className,
+  clearGradient,
+  gradients,
+  onChange,
+  value,
+  headingLevel
+}) {
+  const instanceId = (0, import_compose.useInstanceId)(MultipleOrigin);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_v_stack.VStack, {
+    spacing: 3,
+    className,
+    children: gradients.map(({
+      name,
+      gradients: gradientSet
+    }, index) => {
+      const id = `color-palette-${instanceId}-${index}`;
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_v_stack.VStack, {
+        spacing: 2,
+        children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.ColorHeading, {
+          level: headingLevel,
+          id,
+          children: name
+        }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SingleOrigin, {
+          clearGradient,
+          gradients: gradientSet,
+          onChange: (gradient) => onChange(gradient, index),
+          value,
+          "aria-labelledby": id
+        })]
+      }, index);
+    })
+  });
+}
+function Component(props) {
+  const {
+    asButtons,
+    loop,
+    actions,
+    headingLevel,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledby,
+    ...additionalProps
+  } = props;
+  const options = isMultipleOriginArray(props.gradients) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MultipleOrigin, {
+    headingLevel,
+    ...additionalProps
+  }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SingleOrigin, {
+    ...additionalProps
+  });
+  const {
+    metaProps,
+    labelProps
+  } = (0, import_circular_option_picker.getComputeCircularOptionPickerCommonProps)(asButtons, loop, ariaLabel, ariaLabelledby);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_circular_option_picker.default, {
+    ...metaProps,
+    ...labelProps,
+    actions,
+    options
+  });
+}
+function GradientPicker({
+  className,
+  gradients = [],
+  onChange,
+  value,
+  clearable = true,
+  enableAlpha = true,
+  disableCustomGradients = false,
+  __experimentalIsRenderedInSidebar,
+  headingLevel = 2,
+  ...additionalProps
+}) {
+  const clearGradient = (0, import_element.useCallback)(() => onChange(void 0), [onChange]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_v_stack.VStack, {
+    spacing: gradients.length ? 4 : 0,
+    children: [!disableCustomGradients && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_custom_gradient_picker.default, {
+      __experimentalIsRenderedInSidebar,
+      enableAlpha,
+      value,
+      onChange
+    }), (gradients.length > 0 || clearable) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {
+      ...additionalProps,
+      className,
+      clearGradient,
+      gradients,
+      onChange,
+      value,
+      actions: clearable && !disableCustomGradients && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_circular_option_picker.default.ButtonAction, {
+        onClick: clearGradient,
+        accessibleWhenDisabled: true,
+        disabled: !value,
+        children: (0, import_i18n.__)("Clear")
+      }),
+      headingLevel
+    })]
+  });
+}
+var gradient_picker_default = GradientPicker;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GradientPicker
+});
+//# sourceMappingURL=index.cjs.map

package/build/gradient-picker/types.cjs

@@ -0,0 +1,19 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/components/src/gradient-picker/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.cjs.map