@eightshift/ui-components 1.6.0 → 1.7.0

package/dist/components/number-picker/number-picker.js

@@ -1,17 +1,17 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import React__default, { forwardRef, useRef, createContext, useState, cloneElement } from "react";
-import { _ as __ } from "../../default-i18n-BqWys-1G.js";
-import { $ as $a049562f99e7db0e$export$f9c6924e160136d1, a as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4 } from "../../Group-ubPTwji_.js";
-import { $ as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-BoNEjaXM.js";
-import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BqW0M3HN.js";
-import { $ as $d2b4bc8c273e7be6$export$24d547caef80ccd1 } from "../../Button-CYX0D6At.js";
-import { a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, h as $64fa3d84918910a7$export$ef03459518577ad4, b as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a } from "../../utils-Du2x3YVu.js";
-import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-ClB3-XvF.js";
+import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
+import { $ as $a049562f99e7db0e$export$f9c6924e160136d1, a as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4 } from "../../Group-XzWUooix.js";
+import { $ as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-CV1qVS6t.js";
+import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BwqMVkuV.js";
+import { $ as $d2b4bc8c273e7be6$export$24d547caef80ccd1 } from "../../Button-VbCAu4hd.js";
+import { a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, h as $64fa3d84918910a7$export$ef03459518577ad4, b as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a } from "../../utils-BCJajCwh.js";
+import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-BttM1Nxd.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
-import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-CdwRBXol.js";
+import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-BVIXT8qq.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
-import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-kCEA3M_y.js";
-import { $ as $de67e98908f0c6ee$export$7f629e9dc1ecf37c, a as $81397a9303501bda$export$23f548e970bdf099 } from "../../useNumberFieldState-CpmU88xz.js";
+import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-Cs-ZD1nu.js";
+import { $ as $de67e98908f0c6ee$export$7f629e9dc1ecf37c, a as $81397a9303501bda$export$23f548e970bdf099 } from "../../useNumberField-DMMUTZ-h.js";
 import { Button } from "../button/button.js";
 import { icons } from "../../icons/icons.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";

package/dist/components/option-select/option-select.js

@@ -7,7 +7,7 @@ import { Menu, MenuSeparator, MenuItem } from "../menu/menu.js";
 import { RadioButtonGroup, RadioButton } from "../radio/radio.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { ToggleButton } from "../toggle-button/toggle-button.js";
-import { _ as __ } from "../../default-i18n-BqWys-1G.js";
+import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
 /**
  * A component that allows the user to select an option from a list of options.
  *

package/dist/components/options-panel/options-panel.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { RichLabel } from "../rich-label/rich-label.js";
-import { $ as $5cb03073d3f54797$export$a8a3e93435678ff9 } from "../../Heading-DGnF6JDc.js";
+import { $ as $5cb03073d3f54797$export$a8a3e93435678ff9 } from "../../Heading-DZelepHV.js";
 /**
  * Component that provides a container panel for options, with an optional title.
  * Best used within the Gutenberg sidebar, instead of the default `PanelBody` component.
@@ -14,6 +14,7 @@ import { $ as $5cb03073d3f54797$export$a8a3e93435678ff9 } from "../../Heading-DG
  * @param {JSX.Element} [props.icon] - Icon to display on the top of the panel.
  * @param {string} [props.subtitle] - Subtitle to display on the top of the panel.
  * @param {string} [props.help] - Help text to show below the panel.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The OptionsPanel component.
  *
@@ -25,7 +26,10 @@ import { $ as $5cb03073d3f54797$export$a8a3e93435678ff9 } from "../../Heading-DG
  * @preserve
  */
 const OptionsPanel = (props) => {
-  const { children, className, title, icon, subtitle, help } = props;
+  const { children, className, title, icon, subtitle, help, hidden } = props;
+  if (hidden) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs("div", { className: clsx("es-uic-max-w-md", className), children: [
     title && /* @__PURE__ */ jsx(
       RichLabel,
@@ -46,6 +50,7 @@ const OptionsPanel = (props) => {
  * @component
  * @param {Object} props - Component props.
  * @param {string} [props.className] - Classes to pass to the container.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The OptionsPanelSection component.
  *
@@ -56,7 +61,10 @@ const OptionsPanel = (props) => {
  *
  * @preserve
  */
-const OptionsPanelSection = ({ children, className }) => {
+const OptionsPanelSection = ({ children, className, hidden }) => {
+  if (hidden) {
+    return null;
+  }
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -78,6 +86,7 @@ const OptionsPanelSection = ({ children, className }) => {
  * @param {Number} [props.level=2] - Heading level of the title.
  * @param {string} [props.className] - Classes to pass to the container.
  * @param {JSX.Element|JSX.Element[]} [props.actions] - Controls to show on the right side of the header.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The OptionsPanelHeader component.
  *
@@ -88,13 +97,16 @@ const OptionsPanelSection = ({ children, className }) => {
  *
  * @preserve
  */
-const OptionsPanelHeader = ({ children, sticky, title, className, actions, level = 2 }) => {
+const OptionsPanelHeader = ({ children, sticky, title, className, actions, level = 2, hidden }) => {
+  if (hidden) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs("div", { className: clsx("es-uic-max-w-md es-uic-space-y-2.5", sticky && "es-uic-sticky es-uic-top-0 es-uic-z-10", className), children: [
     /* @__PURE__ */ jsxs("div", { className: "es-uic-flex es-uic-flex-wrap es-uic-items-center es-uic-justify-between es-uic-gap-x-8 es-uic-gap-y-4", children: [
       /* @__PURE__ */ jsx(
         $5cb03073d3f54797$export$a8a3e93435678ff9,
         {
-          className: "es-uic-text-3xl es-uic-font-medium es-uic-tracking-tighter",
+          className: "es-uic-text-2xl es-uic-font-medium es-uic-tracking-tight",
           level,
           children: title
         }

package/dist/components/placeholders/file-placeholder.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { _ as __ } from "../../default-i18n-BqWys-1G.js";
+import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
 import { icons } from "../../icons/icons.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";

package/dist/components/placeholders/media-placeholder.js

@@ -24,13 +24,13 @@ import { icons } from "../../icons/icons.js";
  * @preserve
  */
 const MediaPlaceholder = (props) => {
-  const { style = "default", size = "default", className, icon, helpText, hidden } = props;
+  const { style = "default", size = "default", className, icon, helpText, children, hidden } = props;
   if (hidden) {
     return null;
   }
   const styleClassName = {
-    default: "es-uic-rounded-lg es-uic-border es-uic-border-gray-300 es-uic-bg-gray-50 es-uic-text-gray-300 es-uic-shadow",
-    simple: "es-uic-rounded-lg es-uic-border es-uic-border-gray-300 es-uic-border-dashed es-uic-text-gray-300"
+    default: "es-uic-rounded-lg es-uic-border es-uic-border-gray-300 es-uic-bg-gray-50 es-uic-text-gray-400 es-uic-shadow",
+    simple: "es-uic-rounded-lg es-uic-border es-uic-border-gray-300 es-uic-border-dashed es-uic-text-gray-400"
   };
   const sizeClassName = {
     auto: "",
@@ -45,14 +45,15 @@ const MediaPlaceholder = (props) => {
     "div",
     {
       className: clsx(
-        "es-uic-flex es-uic-flex-col es-uic-items-center es-uic-justify-center es-uic-gap-2 es-uic-overflow-hidden",
+        "es-uic-flex es-uic-flex-col es-uic-items-center es-uic-justify-center es-uic-gap-2 es-uic-overflow-hidden es-uic-p-2",
         styleClassName[style] ?? (styleClassName == null ? void 0 : styleClassName.default),
         sizeClassName[size] ?? (sizeClassName == null ? void 0 : sizeClassName.default),
         className
       ),
       children: [
         /* @__PURE__ */ jsx("div", { className: "[&>svg]:es-uic-size-7", children: icon ?? icons.image }),
-        helpText && /* @__PURE__ */ jsx("div", { className: "es-uic-text-sm es-uic-text-gray-400", children: helpText })
+        helpText && /* @__PURE__ */ jsx("div", { className: "es-uic-text-sm es-uic-text-gray-500", children: helpText }),
+        children && /* @__PURE__ */ jsx("div", { className: "es-uic-mt-2 es-uic-flex es-uic-items-center es-uic-gap-x-2 es-uic-gap-y-2.5 es-uic-text-sm", children })
       ]
     }
   );

package/dist/components/popover/popover.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d, a as $de32f1b87079253c$export$3ddf2d174ce01153, b as $de32f1b87079253c$export$2e1e1122cf0cba88 } from "../../Dialog-BdtBguys.js";
+import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d, a as $de32f1b87079253c$export$3ddf2d174ce01153, b as $de32f1b87079253c$export$2e1e1122cf0cba88 } from "../../Dialog-BN5EE7UH.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
-import { _ as __ } from "../../default-i18n-BqWys-1G.js";
+import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
 import { Button } from "../button/button.js";
 /**
  * A popover component.

package/dist/components/radio/radio.js

@@ -1,20 +1,20 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BqW0M3HN.js";
-import { c as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, b as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, h as $64fa3d84918910a7$export$ef03459518577ad4 } from "../../utils-Du2x3YVu.js";
-import { a as $2baaea4c71418dea$export$294aa081a6c6f55d, $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-ClB3-XvF.js";
+import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BwqMVkuV.js";
+import { c as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, b as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, h as $64fa3d84918910a7$export$ef03459518577ad4 } from "../../utils-BCJajCwh.js";
+import { a as $2baaea4c71418dea$export$294aa081a6c6f55d, $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-BttM1Nxd.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
-import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-CdwRBXol.js";
+import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-BVIXT8qq.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
 import React__default, { useMemo, useState, forwardRef, createContext, cloneElement } from "react";
-import { a as $e93e671b31057976$export$b8473d3665f3a75a, $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10 } from "../../useFormValidationState-DAan_XbC.js";
-import { d as $9ab94262bd0047c7$export$420e68273165f4ec, e as $458b0a5536c1a7cf$export$40bfa8c7b0832715, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-xMzk3syC.js";
-import { b as $9bf71ea28793e738$export$2d6ec8fc375ceafa } from "../../FocusScope-B5L3qI3N.js";
-import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-kCEA3M_y.js";
-import { $ as $99facab73266f662$export$5add1d006293d136 } from "../../useFormReset-fUHUaaR6.js";
-import { $ as $e6afbd83fe6ebbd2$export$4c014de7c8940b4c } from "../../useFocusable-Bu2Ovohk.js";
-import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-Cs8K7gKw.js";
-import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-rz8eyzby.js";
-import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-DsMLX-RC.js";
+import { a as $e93e671b31057976$export$b8473d3665f3a75a, $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10 } from "../../useFormValidationState-BjMhz_VI.js";
+import { d as $9ab94262bd0047c7$export$420e68273165f4ec, e as $458b0a5536c1a7cf$export$40bfa8c7b0832715, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-CgFLw4FA.js";
+import { b as $9bf71ea28793e738$export$2d6ec8fc375ceafa } from "../../FocusScope-CtCX0OGo.js";
+import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-Cs-ZD1nu.js";
+import { $ as $99facab73266f662$export$5add1d006293d136 } from "../../useFormReset-B8m1uz1J.js";
+import { $ as $e6afbd83fe6ebbd2$export$4c014de7c8940b4c } from "../../useFocusable-ByyKSVQv.js";
+import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-D8nPoIQm.js";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-BMOTWmOx.js";
+import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-WhC7vZaL.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { AnimatedVisibility } from "../animated-visibility/animated-visibility.js";
 import { RichLabel } from "../rich-label/rich-label.js";

package/dist/components/repeater/repeater-item.js

@@ -5,7 +5,7 @@ import { icons } from "../../icons/icons.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { useContext } from "react";
 import { Expandable } from "../expandable/expandable.js";
-import { _ as __ } from "../../default-i18n-BqWys-1G.js";
+import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
 import { RepeaterContext } from "./repeater-context.js";
 /**
  * A Repeater item.

package/dist/components/repeater/repeater.js

@@ -1,5 +1,5 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { _ as __ } from "../../default-i18n-BqWys-1G.js";
+import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
 import { Button } from "../button/button.js";
 import { icons } from "../../icons/icons.js";
 import { useId } from "react";
@@ -9,7 +9,7 @@ import { RepeaterContext } from "./repeater-context.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { L as List, a as arrayRemove, b as arrayMove } from "../../List-Bx2anbX-.js";
 const fixIds = (items, itemIdBase) => {
-  return items.map((item, i) => ({
+  return items == null ? void 0 : items.map((item, i) => ({
     ...item,
     id: (item == null ? void 0 : item.id) ?? `${itemIdBase}-${i}`
   }));
@@ -90,7 +90,10 @@ const Repeater = (props) => {
     emptyState,
     hidden
   } = props;
-  const items = fixIds(rawItems, itemIdBase);
+  if (typeof rawItems === "undefined" || rawItems === null || !Array.isArray(rawItems)) {
+    console.warn(__("Repeater: 'items' are not an array or are undefined!", "eightshift-ui-components"));
+  }
+  const items = fixIds(rawItems ?? [], itemIdBase);
   const canDelete = items.length > (minItems ?? 0);
   const canAdd = items.length < (maxItems ?? Number.MAX_SAFE_INTEGER);
   if (hidden) {