@eightshift/ui-components 1.0.0 → 1.0.1

package/dist/components/repeater/repeater.js

@@ -32,6 +32,7 @@ import { $ as $e72dd72e1c76a225$export$2f645645f7bca764 } from "../../useListSta
  * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  * @param {JSX.Element} [props.addButton] - If provided, overrides the default add button. `(props: { addItem: (additional: Object<string, any>?) => void, disabled: Boolean }) => JSX.Element`.
  * @param {string} [props.className] - Classes to pass to the item wrapper.
+ * @param {JSX.Element} [props.emptyState] - Allows overriding the default empty state.
  *
  * @returns {JSX.Element} The Repeater component.
  *
@@ -82,6 +83,7 @@ const Repeater = (props) => {
     minItems,
     addButton,
     className,
+    emptyState,
     hidden,
     ...rest
   } = props;
@@ -112,10 +114,10 @@ const Repeater = (props) => {
       items[index] = { ...items[index], ...newValue };
       onChange(items);
     },
-    move: (sourceKey, targetKeys) => {
+    move: (sourceKey, targetKeys, direction = "before") => {
       const sourceIndex = items.findIndex((item) => item.key === sourceKey);
       const targetIndices = [...targetKeys].map((key) => items.findIndex((item) => item.key === key));
-      onChange(arrayMoveMultiple(items, targetIndices, sourceIndex));
+      onChange(arrayMoveMultiple(items, targetIndices, sourceIndex, direction));
     },
     insert: (targetKey, ...newItems) => {
       const targetIndex = items.findIndex((item) => item.key === targetKey);
@@ -138,7 +140,7 @@ const Repeater = (props) => {
       if (e.target.dropPosition === "before") {
         list.move(e.target.key, e.keys);
       } else if (e.target.dropPosition === "after") {
-        list.move(e.target.key, e.keys);
+        list.move(e.target.key, e.keys, "after");
       }
     },
     renderDropIndicator(target) {
@@ -260,7 +262,7 @@ const Repeater = (props) => {
             setCanReorder
           })),
           dragAndDropHooks,
-          renderEmptyState: () => hideEmptyState ? null : /* @__PURE__ */ jsx("div", { className: "es-uic-rounded-md es-uic-border es-uic-border-dashed es-uic-border-gray-300 es-uic-p-2 es-uic-text-sm es-uic-text-gray-400", children: __("No items", "eightshift-ui-components") }),
+          renderEmptyState: () => hideEmptyState ? null : emptyState ?? /* @__PURE__ */ jsx("div", { className: "es-uic-rounded-md es-uic-border es-uic-border-dashed es-uic-border-gray-300 es-uic-p-2 es-uic-text-sm es-uic-text-gray-400", children: __("No items", "eightshift-ui-components") }),
           className,
           ...rest,
           children

package/dist/components/select/async-multi-select.js

@@ -5,6 +5,7 @@ import { r as restrictToParentElement } from "../../modifiers.esm-BuJQPI1X.js";
 import { CustomSelectDefaultMultiValueRemove, CustomSelectDefaultDropdownIndicator, CustomSelectDefaultClearIndicator } from "./custom-select-default-components.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { eightshiftSelectClasses } from "./styles.js";
+import { fixIds } from "./shared.js";
 import { c as components } from "../../index-a301f526.esm-BzTuHLdr.js";
 /**
  * Multi-select menu with async loading and re-ordering.
@@ -95,6 +96,7 @@ const AsyncMultiSelect = (props) => {
     const results = await loadOptions(searchText);
     return processLoadedOptions((results == null ? void 0 : results.map((item) => ({ id: item.value, ...item }))) ?? []);
   };
+  fixIds(value, onChange);
   return /* @__PURE__ */ jsx(
     BaseControl,
     {

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

@@ -3,7 +3,7 @@ import { S as StateManagedSelect$1 } from "../../react-select.esm-3tyTZmrx.js";
 import { D as DndContext, g as getDragEndHandler, S as SortableContext, a as getMultiValue, b as getMultiValueRemove } from "../../multi-select-components-nORKdJ-2.js";
 import { r as restrictToParentElement } from "../../modifiers.esm-BuJQPI1X.js";
 import { CustomSelectDefaultMultiValueRemove, CustomSelectDefaultDropdownIndicator, CustomSelectDefaultClearIndicator } from "./custom-select-default-components.js";
-import { getValue, customOnChange } from "./shared.js";
+import { fixIds, getValue, customOnChange } from "./shared.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { eightshiftSelectClasses } from "./styles.js";
 import { c as components } from "../../index-a301f526.esm-BzTuHLdr.js";
@@ -86,6 +86,7 @@ const MultiSelect = (props) => {
   if (hidden) {
     return null;
   }
+  fixIds(value, onChange);
   return /* @__PURE__ */ jsx(
     BaseControl,
     {

package/dist/components/select/shared.js

@@ -23,7 +23,7 @@ const getValue = (simpleValue, value, options) => {
  *
  * @param {boolean} simpleValue - Whether `simpleValue` is set.
  * @param {string|{label: string, value: string, metadata: Object<string, any>[]}} newValue - The new value to be set.
- * @param {Function} - onChange The `onChange` callback passed to the component.
+ * @param {Function} onChange - The `onChange` callback passed to the component.
  * @returns {void}
  *
  * @preserve
@@ -39,7 +39,32 @@ const customOnChange = (simpleValue, newValue, onChange) => {
   }
   onChange(newValue == null ? void 0 : newValue.value);
 };
+/**
+ * Handles the `onChange` callback.
+ *
+ * @param {object[]} items - Current items.
+ * @param {Function} onChange - The `onChange` callback passed to the component.
+ * @returns {void}
+ *
+ * @preserve
+ */
+const fixIds = (items, onChange) => {
+  const allIds = (items == null ? void 0 : items.map(({ id }) => id)) ?? [];
+  const hasDuplicates = (input) => {
+    var _a;
+    return ((_a = new Set(input)) == null ? void 0 : _a.size) !== (input == null ? void 0 : input.length);
+  };
+  const hasMissingIds = items == null ? void 0 : items.some(({ id }) => typeof id === "undefined" || id === null || id === "");
+  if (hasDuplicates(allIds) && (items == null ? void 0 : items.length) > 0 || hasMissingIds) {
+    const newItems = [...items].map((item, index) => ({
+      ...item,
+      id: index + 1
+    }));
+    onChange(newItems);
+  }
+};
 export {
   customOnChange,
+  fixIds,
   getValue
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@eightshift/ui-components",
-	"version": "1.0.0",
+	"version": "1.0.1",
 	"type": "module",
 	"main": "./dist/index.js",
 	"module": "./dist/index.js",