@appquality/unguess-design-system 4.0.39 → 4.0.41

package/CHANGELOG.md

@@ -1,3 +1,29 @@
+# v4.0.41 (Thu Jun 19 2025)
+
+#### 🐛 Bug Fix
+
+- Add disabled to multiselect [#530](https://github.com/AppQuality/unguess-design-system/pull/530) ([@sinatragianpaolo](https://github.com/sinatragianpaolo) [@d-beezee](https://github.com/d-beezee))
+- feat: Implement disabled state for MultiSelect component to prevent interactions [#529](https://github.com/AppQuality/unguess-design-system/pull/529) ([@sinatragianpaolo](https://github.com/sinatragianpaolo))
+
+#### Authors: 2
+
+- [@d-beezee](https://github.com/d-beezee)
+- Gianpaolo Sinatra ([@sinatragianpaolo](https://github.com/sinatragianpaolo))
+
+---
+
+# v4.0.40 (Tue Jun 17 2025)
+
+#### 🐛 Bug Fix
+
+- feat: Add listboxAppendToNode prop to MultiSelect for enhanced flexib… [#527](https://github.com/AppQuality/unguess-design-system/pull/527) ([@d-beezee](https://github.com/d-beezee))
+
+#### Authors: 1
+
+- [@d-beezee](https://github.com/d-beezee)
+
+---
+
 # v4.0.39 (Wed May 21 2025)
 
 #### 🐛 Bug Fix

package/build/index.d.ts

@@ -5419,11 +5419,12 @@ export declare const ModalFullScreen: {
     FooterItem: ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & RefAttributes<HTMLSpanElement>>;
 };
 
-export declare const MultiSelect: ({ options, onChange, creatable, i18n, maxItems, size, menuHeight, }: MultiSelectProps) => JSX_2.Element;
+export declare const MultiSelect: ({ options, onChange, creatable, i18n, maxItems, size, menuHeight, listboxAppendToNode, disabled }: MultiSelectProps) => JSX_2.Element;
 
 declare type MultiSelectProps = {
     maxItems?: number;
     options: Item_2[];
+    listboxAppendToNode?: Element | DocumentFragment;
     selectedItems?: Item_2[];
     onChange?: (selectedItems: Item_2[], newItem?: string) => Promise<void>;
     creatable?: boolean;
@@ -5436,6 +5437,7 @@ declare type MultiSelectProps = {
         addNew?: (value: string) => string;
         showMore?: (value: number) => string;
     };
+    disabled?: boolean;
 };
 
 /**

package/build/index.js

@@ -76351,74 +76351,80 @@ const ntt = (e) => /* @__PURE__ */ W.createElement("svg", { width: 16, height: 1
   i18n: r,
   maxItems: i,
   size: o,
-  menuHeight: a
+  menuHeight: a,
+  listboxAppendToNode: s,
+  disabled: l
 }) => {
-  const [s, l] = Ue(""), [d, h] = Ue(e);
+  const [d, h] = Ue(""), [m, y] = Ue(e);
   return Ye(() => {
-    const m = e.filter(
-      (y) => y.label.trim().toLowerCase().indexOf(s.trim().toLowerCase()) !== -1
+    const w = e.filter(
+      (C) => C.label.trim().toLowerCase().indexOf(d.trim().toLowerCase()) !== -1
     );
-    h(m);
-  }, [s, e]), /* @__PURE__ */ M.jsxs(ef, { children: [
+    y(w);
+  }, [d, e]), /* @__PURE__ */ M.jsxs(ef, { children: [
     /* @__PURE__ */ M.jsx(Wp, { hidden: !0, children: (r == null ? void 0 : r.label) ?? "Multiselect" }),
     /* @__PURE__ */ M.jsxs(
       ps,
       {
-        renderValue: ({ selection: m }) => {
-          if (!m || Array.isArray(m) && m.length === 0)
+        isDisabled: l,
+        renderValue: ({ selection: w }) => {
+          if (!w || Array.isArray(w) && w.length === 0)
             return /* @__PURE__ */ M.jsx("div", { style: { color: Ie.palette.grey[400] }, children: (r == null ? void 0 : r.placeholder) ?? "Select items..." });
         },
-        renderExpandTags: r != null && r.showMore ? (m) => r.showMore ? r.showMore(m) : "" : void 0,
+        renderExpandTags: r != null && r.showMore ? (w) => r.showMore ? r.showMore(w) : "" : void 0,
+        listboxAppendToNode: s,
         maxHeight: "auto",
         isCompact: o !== "medium",
         isMultiselectable: !0,
         maxTags: i,
-        inputValue: s,
-        selectionValue: e.filter((m) => m.selected).map((m) => m.id.toString()),
+        inputValue: d,
+        selectionValue: e.filter((w) => w.selected).map((w) => w.id.toString()),
         listboxMaxHeight: a ?? "200px",
         isAutocomplete: !0,
-        onChange: ({ type: m, inputValue: y, selectionValue: w }) => {
-          var C;
-          if (m === "input:change") {
-            l(y || "");
-            return;
-          }
-          if (t && (m === "fn:setSelectionValue" || m === "option:click" || m === "input:keyDown:Enter") && Array.isArray(w)) {
-            const E = w.map((k) => {
-              const R = e.find((_) => _.id === parseInt(k));
-              return R ? {
-                ...R,
-                selected: !0
-              } : {
-                id: void 0,
-                label: k,
-                selected: !0
-              };
-            }), I = E.filter((k) => k.id), L = (C = E.find((k) => !k.id)) == null ? void 0 : C.label;
-            t(
-              e.map((k) => ({
-                ...k,
-                selected: I.some((R) => R.id === k.id)
-              })),
-              L || void 0
-            ).then(() => l(""));
+        onChange: ({ type: w, inputValue: C, selectionValue: E }) => {
+          var I;
+          if (!l) {
+            if (w === "input:change") {
+              h(C || "");
+              return;
+            }
+            if (t && (w === "fn:setSelectionValue" || w === "option:click" || w === "input:keyDown:Enter") && Array.isArray(E)) {
+              const L = E.map((_) => {
+                const $ = e.find((F) => F.id === parseInt(_));
+                return $ ? {
+                  ...$,
+                  selected: !0
+                } : {
+                  id: void 0,
+                  label: _,
+                  selected: !0
+                };
+              }), k = L.filter((_) => _.id), R = (I = L.find((_) => !_.id)) == null ? void 0 : I.label;
+              t(
+                e.map((_) => ({
+                  ..._,
+                  selected: k.some(($) => $.id === _.id)
+                })),
+                R || void 0
+              ).then(() => h(""));
+            }
           }
         },
         children: [
-          e.map((m) => /* @__PURE__ */ M.jsx(
+          e.map((w) => /* @__PURE__ */ M.jsx(
             ho,
             {
-              isHidden: !d.some((y) => y.id === m.id),
-              value: m.id.toString(),
-              label: m.label,
-              isSelected: m.selected,
+              isHidden: !m.some((C) => C.id === w.id),
+              value: w.id.toString(),
+              label: w.label,
+              isSelected: w.selected,
               tagProps: {
                 isPill: !0
               }
             },
-            m.id
+            w.id
           )),
-          d.length === 0 && !n && /* @__PURE__ */ M.jsx(
+          m.length === 0 && !n && /* @__PURE__ */ M.jsx(
             ho,
             {
               isDisabled: !0,
@@ -76426,17 +76432,17 @@ const ntt = (e) => /* @__PURE__ */ W.createElement("svg", { width: 16, height: 1
               label: (r == null ? void 0 : r.noMatches) ?? "No matches found"
             }
           ),
-          n && s.length > 0 && !d.find(
-            (m) => m.label.toLowerCase() === s.toLowerCase()
+          n && d.length > 0 && !m.find(
+            (w) => w.label.toLowerCase() === d.toLowerCase()
           ) ? /* @__PURE__ */ M.jsxs(M.Fragment, { children: [
             /* @__PURE__ */ M.jsx(Oc, {}),
             /* @__PURE__ */ M.jsx(
               ho,
               {
                 tagProps: { isPill: !0 },
-                value: s,
+                value: d,
                 icon: /* @__PURE__ */ M.jsx(ntt, {}),
-                label: r != null && r.addNew ? r.addNew(s) : `Want to add "${s}"?`
+                label: r != null && r.addNew ? r.addNew(d) : `Want to add "${d}"?`
               }
             )
           ] }) : null

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "4.0.39",
+  "version": "4.0.41",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",