@eightshift/ui-components 5.0.10 → 5.1.0

package/dist/components/slider/column-config-slider.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { _ as __ } from "../../default-i18n-CT_oS1Fy.js";
+import { _ as __ } from "../../default-i18n-OFa3zAyB.js";
 import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-JS_ob-kh.js";
 import { $ as $6f909507e6374d18$export$472062a354075cee, a as $6f909507e6374d18$export$105594979f116971, b as $6f909507e6374d18$export$2c1b491743890dec, c as $6f909507e6374d18$export$a590f758a961cb5b } from "../../Slider-uOPcIpqS.js";
 import { BaseControl } from "../base-control/base-control.js";
@@ -155,7 +155,7 @@ const ColumnConfigSlider = (props) => {
                     $6f909507e6374d18$export$2c1b491743890dec,
                     {
                       index: i,
-                      "aria-label": thumbLabels == null ? void 0 : thumbLabels[i],
+                      "aria-label": thumbLabels?.[i],
                       isDisabled: i === 0 && disableOffset || i === 1 && disableWidth,
                       className: clsx(
                         "es:static! es:row-span-1 es:row-start-1 es:h-6 es:w-1.5 es:rounded-full es:border es:transition es:duration-300",

package/dist/components/slider/slider.js

@@ -103,7 +103,7 @@ const Slider = (props) => {
       step,
       isDisabled: disabled,
       orientation: vertical ? "vertical" : "horizontal",
-      className: clsx("es:w-full", (markerEntries == null ? void 0 : markerEntries.some(([_, value2]) => (value2 == null ? void 0 : value2.length) > 0)) && "es:pb-3.5"),
+      className: clsx("es:w-full", markerEntries?.some(([_, value2]) => value2?.length > 0) && "es:pb-3.5"),
       onChangeEnd,
       ...other,
       children: /* @__PURE__ */ jsx(
@@ -280,7 +280,7 @@ const Slider = (props) => {
                   $6f909507e6374d18$export$2c1b491743890dec,
                   {
                     index: i,
-                    "aria-label": thumbLabels == null ? void 0 : thumbLabels[i],
+                    "aria-label": thumbLabels?.[i],
                     className: clsx(
                       "es:absolute es:size-3.5 es:rounded-full es:border es:transition es:duration-300",
                       vertical ? "es:translate-x-1/2!" : "es:translate-y-1/2!",

package/dist/components/slider/utils.js

@@ -1,4 +1,4 @@
-import { _ as __, s as sprintf, a as _n } from "../../default-i18n-CT_oS1Fy.js";
+import { _ as __, s as sprintf, a as _n } from "../../default-i18n-OFa3zAyB.js";
 /**
  * Generates an array of markers based on the provided minimum and maximum values and step.
  * If the step is less than 10, only markers divisible by 5 and 10 are included.

package/dist/components/tabs/tabs.js

@@ -1,9 +1,9 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { c as $880e95eb8b93ba9a$export$ecf600387e221c37, i as $ae20dd8cbca75726$export$d6daf82dcd84e87c, d as $e1995378a142960e$export$18af5c7a9e9b3664, f as $e1995378a142960e$export$fb8073518f34e6ec, g as $7135fc7d473fd974$export$4feb769f8ddf26c5, j as $7135fc7d473fd974$export$a164736487e3f0ae, e as $e1995378a142960e$export$bf788dd355e3a401, k as $7135fc7d473fd974$export$90e00781bc59d8f9 } from "../../Collection-uTAXq9Br.js";
+import { c as $880e95eb8b93ba9a$export$ecf600387e221c37, i as $ae20dd8cbca75726$export$d6daf82dcd84e87c, d as $e1995378a142960e$export$18af5c7a9e9b3664, f as $e1995378a142960e$export$fb8073518f34e6ec, g as $7135fc7d473fd974$export$4feb769f8ddf26c5, j as $7135fc7d473fd974$export$a164736487e3f0ae, e as $e1995378a142960e$export$bf788dd355e3a401, k as $7135fc7d473fd974$export$90e00781bc59d8f9 } from "../../Collection-BRJOMbOa.js";
 import { k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, d as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, l as $df56164dff5785e2$export$4338b53315abf666, b as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e } from "../../utils-CZt7LCbO.js";
 import { $ as $f39a9eba43920ace$export$86427a43e3e48ebb } from "../../Hidden-rE6uR-lr.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
-import { b as $cdc5a6778b766db2$export$a9d04c5684123369 } from "../../useListState-9Hq_FiRF.js";
+import { b as $cdc5a6778b766db2$export$a9d04c5684123369 } from "../../useListState-BrZ2XvDS.js";
 import React__default, { useState, useMemo, useRef, useEffect, forwardRef, useContext, createContext, isValidElement, useId, cloneElement } from "react";
 import { a as $ea8dcbcb9ea1b556$export$7e924b3091a3bd18 } from "../../usePress-DWBuejBp.js";
 import { a as $f645667febf57a63$export$4c014de7c8940b4c, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-C2SkI1Fn.js";
@@ -11,8 +11,8 @@ import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-
 import { a as $9bf71ea28793e738$export$2d6ec8fc375ceafa } from "../../FocusScope-BEPI2m7u.js";
 import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BbYZoHvX.js";
 import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Bv0UJQl8.js";
-import { $ as $a0d645289fe9b86b$export$e7f05e985daf4b5f } from "../../useSingleSelectListState-DqhemUIh.js";
-import { _ as __, s as sprintf } from "../../default-i18n-CT_oS1Fy.js";
+import { $ as $a0d645289fe9b86b$export$e7f05e985daf4b5f } from "../../useSingleSelectListState-Bh46cRXs.js";
+import { _ as __, s as sprintf } from "../../default-i18n-OFa3zAyB.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { c as cva } from "../../index-BljRBEr_.js";
 import { Notice } from "../notice/notice.js";
@@ -467,10 +467,9 @@ const Tabs2 = (props) => {
   let tabCounter = 1;
   const preparedChildren = Array.isArray(children) ? children : [children];
   const childrenWithIds = preparedChildren.reduce((acc, child, index) => {
-    var _a, _b, _c;
     if (child.type.displayName === "TabList") {
-      const childItems = Array.isArray((_a = child == null ? void 0 : child.props) == null ? void 0 : _a.children) ? (_b = child == null ? void 0 : child.props) == null ? void 0 : _b.children : [(_c = child == null ? void 0 : child.props) == null ? void 0 : _c.children].filter(Boolean);
-      tabCounter = ((childItems == null ? void 0 : childItems.length) ?? 0) + 1;
+      const childItems = Array.isArray(child?.props?.children) ? child?.props?.children : [child?.props?.children].filter(Boolean);
+      tabCounter = (childItems?.length ?? 0) + 1;
       if (childItems.length < 1) {
         return acc;
       }
@@ -482,7 +481,7 @@ const Tabs2 = (props) => {
             key: index,
             type
           },
-          childItems == null ? void 0 : childItems.map(
+          childItems?.map(
             (innerChild, i) => cloneElement(innerChild, {
               id: `tab-${baseId}-${i + 1}`,
               key: i,

package/dist/components/toggle/switch.js

@@ -127,7 +127,7 @@ const Switch2 = (props) => {
               "es:group-focus-visible:ring-2 es:group-focus-visible:ring-accent-500/50 es:group-focus-visible:border-accent-600",
               !checked && !disabled && "es:border-secondary-400 es:inset-ring-secondary-100 es:from-white es:to-secondary-100",
               checked && !disabled && "es:border-accent-700/75 es:inset-ring-accent-500 es:to-accent-500 es:from-accent-600 es:shadow-accent-600/30",
-              disabled && "es:cursor-default es:border-secondary-300 es:from-white es:to-secondary-50 es:inset-ring-secondary-200/30 es:inset-shadow-secondary-100",
+              disabled && "es:cursor-default es:border-secondary-300 es:from-white es:to-secondary-50 es:inset-ring-0 es:inset-shadow-secondary-100",
               !disabled && "es:shadow-sm"
             ),
             children: /* @__PURE__ */ jsx(
@@ -135,12 +135,13 @@ const Switch2 = (props) => {
               {
                 className: clsx(
                   "es:block es:size-3 es:rounded-full es:border es:will-change-transform es:bg-radial",
-                  "es:transition es:motion-ease-spring-snappy es:ease-[var(--motion-spring-snappy)]",
+                  "es:transition es:motion-ease-spring-bouncy es:ease-[var(--motion-spring-bouncy)] es:duration-200",
                   !checked && "es:scale-95",
                   !checked && !disabled && "es:border-secondary-500 es:from-secondary-500 es:to-secondary-600",
                   checked && "es:translate-x-4",
                   checked && !disabled && "es:border-accent-600/20 es:from-white es:to-accent-500/30 es:from-40% es:bg-white es:shadow-sm es:shadow-accent-900/60",
-                  disabled && "es:border-secondary-400 es:bg-secondary-100",
+                  disabled && "es:border-secondary-300",
+                  checked && disabled && "es:bg-secondary-200",
                   isIndeterminate && "es:translate-x-2 es:scale-100"
                 )
               }

package/dist/components/toggle-button/toggle-button.js

@@ -302,7 +302,7 @@ const ToggleButton2 = (props) => {
     }
   );
   let tooltip = rawTooltip;
-  if (rawTooltip === true && (ariaLabel == null ? void 0 : ariaLabel.length) > 0) {
+  if (rawTooltip === true && ariaLabel?.length > 0) {
     tooltip = ariaLabel;
   }
   const component = /* @__PURE__ */ jsxs(

package/dist/{default-i18n-CT_oS1Fy.js → default-i18n-OFa3zAyB.js}

@@ -501,14 +501,13 @@ const createI18n = (initialData, initialDomain, hooks) => {
   };
   const getLocaleData = (domain = "default") => tannin.data[domain];
   const doSetLocaleData = (data, domain = "default") => {
-    var _a;
     tannin.data[domain] = {
       ...tannin.data[domain],
       ...data
     };
     tannin.data[domain][""] = {
       ...DEFAULT_LOCALE_DATA[""],
-      ...(_a = tannin.data[domain]) == null ? void 0 : _a[""]
+      ...tannin.data[domain]?.[""]
     };
     delete tannin.pluralForms[domain];
   };
@@ -517,7 +516,6 @@ const createI18n = (initialData, initialDomain, hooks) => {
     notifyListeners();
   };
   const addLocaleData = (data, domain = "default") => {
-    var _a;
     tannin.data[domain] = {
       ...tannin.data[domain],
       ...data,
@@ -525,8 +523,8 @@ const createI18n = (initialData, initialDomain, hooks) => {
       // a plural forms expression).
       "": {
         ...DEFAULT_LOCALE_DATA[""],
-        ...(_a = tannin.data[domain]) == null ? void 0 : _a[""],
-        ...data == null ? void 0 : data[""]
+        ...tannin.data[domain]?.[""],
+        ...data?.[""]
       }
     };
     delete tannin.pluralForms[domain];
@@ -604,9 +602,8 @@ const createI18n = (initialData, initialDomain, hooks) => {
     return "rtl" === _x("ltr", "text direction");
   };
   const hasTranslation = (single, context, domain) => {
-    var _a, _b;
     const key = context ? context + "" + single : single;
-    let result = !!((_b = (_a = tannin.data) == null ? void 0 : _a[domain !== null && domain !== void 0 ? domain : "default"]) == null ? void 0 : _b[key]);
+    let result = !!tannin.data?.[domain !== null && domain !== void 0 ? domain : "default"]?.[key];
     if (hooks) {
       result = /** @type { boolean } */
       /** @type {*} */
@@ -827,11 +824,10 @@ function createRunHook(hooks, storeKey, returnFirstArg, async) {
 }
 function createCurrentHook(hooks, storeKey) {
   return function currentHook() {
-    var _a;
     var _currentArray$at$name;
     const hooksStore = hooks[storeKey];
     const currentArray = Array.from(hooksStore.__current);
-    return (_currentArray$at$name = (_a = currentArray.at(-1)) == null ? void 0 : _a.name) !== null && _currentArray$at$name !== void 0 ? _currentArray$at$name : null;
+    return (_currentArray$at$name = currentArray.at(-1)?.name) !== null && _currentArray$at$name !== void 0 ? _currentArray$at$name : null;
   };
 }
 function createDoingHook(hooks, storeKey) {

package/dist/icons/jsx-svg.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { s as svgToJsxString, a as source_default } from "../react-jsx-parser.min-DZCiis5V.js";
+import { s as svgToJsxString, a as source_default } from "../react-jsx-parser.min-LF707GK8.js";
 /**
  * Renders SVG string as JSX SVGs.
  *
@@ -24,13 +24,12 @@ import { s as svgToJsxString, a as source_default } from "../react-jsx-parser.mi
  * @preserve
  */
 const JsxSvg = (props) => {
-  var _a;
   const { svg, className, customProps, customPropBindings, "aria-hidden": ariaHiddenProp, ariaHidden, noIdRandomization, idRandomizationPrefix = "icon", ...rest } = props;
   if (!svg || typeof svg !== "string") {
     return null;
   }
   let jsxString = svgToJsxString(svg);
-  if ((className == null ? void 0 : className.length) > 0) {
+  if (className?.length > 0) {
     jsxString = jsxString.replace("<svg ", `<svg className="${className}" `);
   }
   if (ariaHiddenProp || ariaHidden) {
@@ -40,7 +39,7 @@ const JsxSvg = (props) => {
     jsxString = jsxString.replace("<svg ", `<svg ${customProps} `);
   }
   if (!noIdRandomization) {
-    const matches = (_a = Array.from(jsxString == null ? void 0 : jsxString.matchAll(/id=[\'"]([a-zA-Z0-9\-\_]*)[\'"]/g), (m) => m == null ? void 0 : m[1])) == null ? void 0 : _a.filter(Boolean);
+    const matches = Array.from(jsxString?.matchAll(/id=[\'"]([a-zA-Z0-9\-\_]*)[\'"]/g), (m) => m?.[1])?.filter(Boolean);
     matches.forEach((match) => {
       const newId = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
       jsxString = jsxString.replaceAll(match, `${idRandomizationPrefix}-${newId}`);

package/dist/index.js

@@ -38,8 +38,8 @@ import { ResponsiveLegacy } from "./components/responsive/responsive-legacy.js";
 import { ResponsivePreview } from "./components/responsive-preview/responsive-preview.js";
 import { AsyncMultiSelect } from "./components/select/async-multi-select.js";
 import { AsyncSelect } from "./components/select/async-single-select.js";
-import { __ExperimentalAsyncSelect } from "./components/select/v2/async-select.js";
-import { __ExperimentalSelect } from "./components/select/v2/single-select.js";
+import { AsyncSelectNext } from "./components/select/v2/async-select.js";
+import { SelectNext } from "./components/select/v2/single-select.js";
 import { Modal } from "./components/modal/modal.js";
 import { MultiSelect } from "./components/select/multi-select.js";
 import { RSClearIndicator, RSDropdownIndicator, RSMultiValue, RSMultiValueContainer, RSMultiValueLabel, RSMultiValueRemove, RSOption, RSSingleValue } from "./components/select/react-select-component-wrappers.js";
@@ -60,6 +60,7 @@ export {
   AnimatedVisibility,
   AsyncMultiSelect,
   AsyncSelect,
+  AsyncSelectNext,
   BaseControl,
   BreakpointPreview,
   Button,
@@ -121,6 +122,7 @@ export {
   ResponsivePreview,
   RichLabel,
   Select,
+  SelectNext,
   Slider,
   SolidColorPicker,
   Spacer,
@@ -135,7 +137,5 @@ export {
   Tooltip,
   TriggeredPopover,
   VStack,
-  __ExperimentalAsyncSelect,
-  __ExperimentalSelect,
   getColumnConfigOutputText
 };

package/dist/{multi-select-components-Sp-JEFEX.js → multi-select-components-BcKzA24f.js}

@@ -3676,10 +3676,10 @@ const getDragEndHandler = (onChange, items) => {
     if (!active || !over) {
       return;
     }
-    if ((active == null ? void 0 : active.id) !== (over == null ? void 0 : over.id) && items) {
+    if (active?.id !== over?.id && items) {
       const mappedItems = items.map(({ id }) => id);
-      const oldIndex = (mappedItems == null ? void 0 : mappedItems.indexOf(active.id)) ?? -1;
-      const newIndex = (mappedItems == null ? void 0 : mappedItems.indexOf(over.id)) ?? -1;
+      const oldIndex = mappedItems?.indexOf(active.id) ?? -1;
+      const newIndex = mappedItems?.indexOf(over.id) ?? -1;
       onChange(arrayMove([...items], oldIndex, newIndex));
     }
   };