@iress-oss/ids-components 6.0.0-alpha.7 → 6.0.0-alpha.9

package/dist/components/RichSelect/SelectLabel/SelectLabel.js

@@ -1,36 +1,36 @@
-import { jsxs as u, jsx as o } from "react/jsx-runtime";
+import { jsxs as u, jsx as s } from "react/jsx-runtime";
 import { useMemo as f } from "react";
 import { toArray as b } from "../../../helpers/formatting/toArray.js";
 import { composeLabelValueDescriptor as d } from "../../../helpers/label-value/composeLabelValueDescriptor.js";
 import { selectLabel as S } from "./SelectLabel.styles.js";
-import { IressText as C } from "../../Text/Text.js";
-import { GlobalCSSClass as a } from "../../../enums.js";
+import { IressText as L } from "../../Text/Text.js";
+import { GlobalCSSClass as n } from "../../../enums.js";
 import { c as m } from "../../../cx-DN21T1EH.js";
-const j = ({
+const C = ({
   append: t,
   className: c,
-  placeholder: s,
-  prepend: l,
-  selected: h,
-  selectedOptionsText: n = "{{numOptions}} selected",
-  ...i
+  placeholder: l,
+  prepend: o,
+  selected: i,
+  selectedOptionsText: a = "{{numOptions}} selected",
+  ...h
 }) => {
-  const e = b(h), r = S({ showDefaultChevron: !t }), p = f(() => e.length ? e.length === 1 ? e[0].label : d(e, n) : s, [s, e, n]);
+  const e = b(i), r = S({ showDefaultChevron: !t }), p = f(() => e.length ? e.length === 1 ? e[0].label : d(e, a) : l, [l, e, a]);
   return /* @__PURE__ */ u(
     "button",
     {
-      ...i,
+      ...h,
       type: "button",
       className: m(
         c,
         r.selectLabel,
-        a.FormElementInner,
-        a.RichSelectLabel
+        n.FormElementInner,
+        n.RichSelectLabel
       ),
       children: [
-        l && /* @__PURE__ */ o("span", { className: r.prepend, children: l }),
-        /* @__PURE__ */ o(
-          C,
+        o && /* @__PURE__ */ s("span", { className: r.prepend, children: o }),
+        /* @__PURE__ */ s(
+          L,
           {
             className: m(
               r.contents,
@@ -40,11 +40,12 @@ const j = ({
             children: p
           }
         ),
-        /* @__PURE__ */ o("span", { className: r.append, children: t })
+        /* @__PURE__ */ s("span", { className: r.append, children: t })
       ]
     }
   );
 };
+C.displayName = "IressSelectLabel";
 export {
-  j as IressSelectLabel
+  C as IressSelectLabel
 };

package/dist/components/RichSelect/SelectLabel/SelectLabel.styles.js

@@ -1,4 +1,4 @@
-import { s as e } from "../../../sva-OmxClA9g.js";
+import { s as e } from "../../../sva-wwkEhoyo.js";
 const o = e({
   slots: ["selectLabel", "contents", "placeholder", "prepend", "append"],
   base: {

package/dist/{src/components → components}/RichSelect/SelectMenu/SelectMenu.d.ts

@@ -49,4 +49,7 @@ export interface IressSelectMenuItemProps extends Omit<IressMenuItemProps<'butto
      */
     hiddenOnMobile?: boolean;
 }
-export declare const IressSelectMenu: <TMultiple extends boolean = false>({ heading, hideSelectedItems, items, limitDesktop, limitMobile, multiSelect, noResults, onChange, role, selected, selectedFirst, ...restProps }: IressSelectMenuProps<TMultiple>) => import("react/jsx-runtime").JSX.Element;
+export declare const IressSelectMenu: {
+    <TMultiple extends boolean = false>({ heading, hideSelectedItems, items, limitDesktop, limitMobile, multiSelect, noResults, onChange, role, selected, selectedFirst, ...restProps }: IressSelectMenuProps<TMultiple>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/RichSelect/SelectMenu/SelectMenu.js

@@ -2,59 +2,59 @@ import { jsxs as A, jsx as M } from "react/jsx-runtime";
 import { useMemo as y, useCallback as C, createElement as N } from "react";
 import { IressMenu as F } from "../../Menu/Menu.js";
 import "../../Menu/Menu.styles.js";
-import { c as T } from "../../../cx-DN21T1EH.js";
-import "../../Divider/Divider.styles.js";
-import { GlobalCSSClass as V } from "../../../enums.js";
+import "../../Menu/MenuDivider/MenuDivider.js";
 import "../../Menu/MenuItem/MenuItem.js";
-import { IressMenuHeading as L, IressMenuText as $ } from "../../Menu/MenuText/MenuText.js";
-import { propagateTestid as j } from "../../../helpers/utility/propagateTestid.js";
+import { IressMenuHeading as T, IressMenuText as V } from "../../Menu/MenuText/MenuText.js";
+import { propagateTestid as L } from "../../../helpers/utility/propagateTestid.js";
 import { toArray as u } from "../../../helpers/formatting/toArray.js";
-import { getFormControlValueAsStringIfDefined as O } from "../../../helpers/form/getFormControlValueAsStringIfDefined.js";
-import { getFormControlValueAsString as k } from "../../../helpers/form/getFormControlValueAsString.js";
-import { getValueFromLabelValues as E } from "../../../helpers/label-value/getValueFromLabelValues.js";
-import { IressSelectMenuItem as G } from "./SelectMenuItem.js";
-import { useIdIfNeeded as H } from "../../../hooks/useIdIfNeeded.js";
-import { selectMenu as q } from "./SelectMenu.styles.js";
-const se = ({
-  heading: r,
+import { getFormControlValueAsStringIfDefined as $ } from "../../../helpers/form/getFormControlValueAsStringIfDefined.js";
+import { getFormControlValueAsString as j } from "../../../helpers/form/getFormControlValueAsString.js";
+import { getValueFromLabelValues as O } from "../../../helpers/label-value/getValueFromLabelValues.js";
+import { IressSelectMenuItem as k } from "./SelectMenuItem.js";
+import { useIdIfNeeded as E } from "../../../hooks/useIdIfNeeded.js";
+import { selectMenu as G } from "./SelectMenu.styles.js";
+import { GlobalCSSClass as H } from "../../../enums.js";
+import { c as q } from "../../../cx-DN21T1EH.js";
+const w = ({
+  heading: o,
   hideSelectedItems: n,
-  items: o = [],
+  items: r = [],
   limitDesktop: t,
   limitMobile: e,
   multiSelect: a,
   noResults: s,
   onChange: f,
-  role: h = "listbox",
+  role: I = "listbox",
   selected: c,
   selectedFirst: p,
   ...i
 }) => {
-  const b = `${H({ id: i.id })}--label`, m = y(
-    () => E(c, a),
+  const b = `${E({ id: i.id })}--label`, m = y(
+    () => O(c, a),
     [a, c]
   ), g = y(() => {
-    let l = p ? w(o, c, m) : o;
+    let l = p ? z(r, c, m) : r;
     if (n) {
       const d = u(m);
       l = l.filter(
         (v) => !d.includes(
-          O(v.value) ?? v.label
+          $(v.value) ?? v.label
         )
       );
     }
-    return z(l, t, e);
+    return B(l, t, e);
   }, [
     n,
-    o,
+    r,
     t,
     e,
     m,
     c,
     p
-  ]), I = g.length === 0, S = C(
+  ]), S = g.length === 0, h = C(
     (l) => {
-      const d = B(
-        o,
+      const d = D(
+        r,
         c,
         l ?? void 0
       );
@@ -62,54 +62,56 @@ const se = ({
         a ? d : d[0]
       );
     },
-    [o, a, f, c]
-  ), x = q();
+    [r, a, f, c]
+  ), x = G();
   return /* @__PURE__ */ A(
     F,
     {
       ...i,
-      "aria-labelledby": typeof r == "string" ? b : i["aria-labelledby"],
+      "aria-labelledby": typeof o == "string" ? b : i["aria-labelledby"],
       multiSelect: a,
-      onChange: S,
-      role: h,
+      onChange: h,
+      role: I,
       selected: m,
-      className: T(
+      className: q(
         x.root,
-        V.RichSelectMenu,
+        H.RichSelectMenu,
         i.className
       ),
       children: [
-        typeof r == "string" ? /* @__PURE__ */ M(L, { id: b, children: r }) : r,
+        typeof o == "string" ? /* @__PURE__ */ M(T, { id: b, children: o }) : o,
         g.map((l, d) => /* @__PURE__ */ N(
-          G,
+          k,
           {
             ...l,
-            "data-testid": j(i?.["data-testid"], "menu-item"),
-            key: `${k(
+            "data-testid": L(i?.["data-testid"], "menu-item"),
+            key: `${j(
               l.value ?? l.label
             )}-${d}`
           }
         )),
-        I && (typeof s == "string" ? /* @__PURE__ */ M($, { children: s }) : s)
+        S && (typeof s == "string" ? /* @__PURE__ */ M(V, { children: s }) : s)
       ]
     }
   );
-}, w = (r, n, o) => {
-  const t = u(n), e = u(o), a = r.filter(
+};
+w.displayName = "IressSelectMenu";
+const z = (o, n, r) => {
+  const t = u(n), e = u(r), a = o.filter(
     (s) => !e.includes(s.value ?? s.label)
   );
   return t.length && a.length ? t.concat([{ label: "", value: "", divider: !0 }]).concat(a) : t.concat(a);
-}, z = (r, n, o) => r.map((t, e) => ({
+}, B = (o, n, r) => o.map((t, e) => ({
   ...t,
-  hiddenOnMobile: o ? e > o - 1 : !1
-})).slice(0, n ?? r.length), B = (r, n, o) => {
+  hiddenOnMobile: r ? e > r - 1 : !1
+})).slice(0, n ?? o.length), D = (o, n, r) => {
   const t = u(n);
-  return u(o).map((e) => D(r, t, e)).filter((e) => e !== void 0);
-}, D = (r, n, o) => r?.find(
-  (e) => e.value === o || e.value === void 0 && e.label === o
+  return u(r).map((e) => J(o, t, e)).filter((e) => e !== void 0);
+}, J = (o, n, r) => o?.find(
+  (e) => e.value === r || e.value === void 0 && e.label === r
 ) ?? n.find(
-  (e) => e.value === o || e.value === void 0 && e.label === o
+  (e) => e.value === r || e.value === void 0 && e.label === r
 );
 export {
-  se as IressSelectMenu
+  w as IressSelectMenu
 };

package/dist/components/RichSelect/SelectMenu/SelectMenu.styles.js

@@ -1,4 +1,4 @@
-import { s as t } from "../../../sva-OmxClA9g.js";
+import { s as t } from "../../../sva-wwkEhoyo.js";
 const o = t({
   slots: ["root"],
   base: {

package/dist/components/RichSelect/SelectMenu/SelectMenuItem.d.ts

@@ -0,0 +1,5 @@
+import { IressSelectMenuItemProps } from './SelectMenu';
+export declare const IressSelectMenuItem: {
+    ({ className, divider, formattedLabel, formattedMeta, hiddenOnMobile, label, meta, value, append, canToggle, onClick, onKeyDown, prepend, role, selected, "data-testid": dataTestId, "aria-describedby": ariaDescribedBy, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, id, }: IressSelectMenuItemProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/RichSelect/SelectMenu/SelectMenuItem.js

@@ -3,18 +3,17 @@ import { GlobalCSSClass as j } from "../../../enums.js";
 import "../../Menu/Menu.js";
 import "../../Menu/Menu.styles.js";
 import { IressMenuDivider as C } from "../../Menu/MenuDivider/MenuDivider.js";
-import { IressMenuItem as g } from "../../Menu/MenuItem/MenuItem.js";
-import "react";
-import "../../Popover/hooks/usePopover.js";
+import { IressMenuItem as N } from "../../Menu/MenuItem/MenuItem.js";
+import "../../Menu/MenuText/MenuText.js";
+import { c as g } from "../../../cx-DN21T1EH.js";
 import { IressText as D } from "../../Text/Text.js";
-import { c as G } from "../../../cx-DN21T1EH.js";
-const E = ({
+const G = ({
   className: a,
   divider: i,
-  formattedLabel: o,
-  formattedMeta: s,
+  formattedLabel: s,
+  formattedMeta: o,
   hiddenOnMobile: l,
-  label: r,
+  label: e,
   meta: m,
   value: d,
   append: c,
@@ -23,8 +22,8 @@ const E = ({
   onKeyDown: b,
   prepend: u,
   role: y,
-  selected: f,
-  "data-testid": I,
+  selected: I,
+  "data-testid": f,
   "aria-describedby": x,
   "aria-label": M,
   "aria-labelledby": S,
@@ -33,32 +32,33 @@ const E = ({
 }) => {
   if (i)
     return /* @__PURE__ */ t(C, {});
-  const e = s ?? m;
+  const r = o ?? m;
   return /* @__PURE__ */ v(
-    g,
+    N,
     {
       append: c,
       canToggle: p,
-      className: G(a, j.RichSelectMenuItem),
+      className: g(a, j.RichSelectMenuItem),
       srOnly: l ? !0 : void 0,
       onClick: n,
       onKeyDown: b,
       prepend: u,
       role: y,
-      selected: f,
-      value: d ?? r,
-      "data-testid": I,
+      selected: I,
+      value: d ?? e,
+      "data-testid": f,
       "aria-describedby": x,
       "aria-label": M,
       "aria-labelledby": S,
       id: h,
       children: [
-        o ?? r,
-        e && /* @__PURE__ */ t(D, { textStyle: "typography.body.sm", color: "colour.neutral.70", children: e })
+        s ?? e,
+        r && /* @__PURE__ */ t(D, { textStyle: "typography.body.sm", color: "colour.neutral.70", children: r })
       ]
     }
   );
 };
+G.displayName = "IressSelectMenuItem";
 export {
-  E as IressSelectMenuItem
+  G as IressSelectMenuItem
 };

package/dist/components/RichSelect/SelectSearch/SelectSearch.d.ts

@@ -0,0 +1,6 @@
+import { IressInputPopoverProps } from '../../Popover';
+export type IressSelectSearchProps = Omit<IressInputPopoverProps, 'disabledAutoToggle' | 'displayMode' | 'show' | 'width'>;
+export declare const IressSelectSearch: {
+    ({ className, contentClassName, contentStyle, onKeyDown, ...restProps }: IressSelectSearchProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/RichSelect/SelectSearch/SelectSearch.js

@@ -1,47 +1,49 @@
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as l } from "react/jsx-runtime";
 import { c as s } from "../../../cx-DN21T1EH.js";
-import { selectSearch as l } from "./SelectSearch.styles.js";
-import { handlePopoverTabKey as f } from "../../Popover/helpers/handlePopoverTabKey.js";
-import { useContext as h } from "react";
-import { PopoverContext as S } from "../../Popover/hooks/usePopover.js";
-import { GlobalCSSClass as m } from "../../../enums.js";
+import { selectSearch as n } from "./SelectSearch.styles.js";
+import { handlePopoverTabKey as S } from "../../Popover/helpers/handlePopoverTabKey.js";
+import { GlobalCSSClass as a } from "../../../enums.js";
 import "../../Popover/Popover.js";
 import "../../Popover/Popover.styles.js";
-import { IressInputPopover as C } from "../../Popover/InputPopover/InputPopover.js";
-const K = ({
+import { IressInputPopover as h } from "../../Popover/InputPopover/InputPopover.js";
+import { usePopover as f } from "../../Popover/hooks/usePopover.js";
+import "react";
+import "../../Popover/hooks/useFloatingPopover.js";
+const d = ({
   className: c,
-  contentClassName: a,
+  contentClassName: m,
   contentStyle: o,
   onKeyDown: p,
   ...i
 }) => {
-  const e = h(S), r = l();
-  return /* @__PURE__ */ n(
-    C,
+  const e = f(), r = n();
+  return /* @__PURE__ */ l(
+    h,
     {
       ...i,
       className: s(
         r.root,
         c,
-        m.RichSelectSearch
+        a.RichSelectSearch
       ),
       contentStyle: {
         ...o,
         className: s(
           r.content,
-          a,
-          m.RichSelectSearchContent,
+          m,
+          a.RichSelectSearchContent,
           o?.className
         )
       },
       displayMode: "inline",
       onKeyDown: (t) => {
-        p?.(t), e && f(e, t);
+        p?.(t), e && S(e, t);
       },
       show: !0
     }
   );
 };
+d.displayName = "IressSelectSearch";
 export {
-  K as IressSelectSearch
+  d as IressSelectSearch
 };

package/dist/components/RichSelect/SelectSearch/SelectSearch.styles.js

@@ -1,4 +1,4 @@
-import { s as e } from "../../../sva-OmxClA9g.js";
+import { s as e } from "../../../sva-wwkEhoyo.js";
 const t = e({
   slots: ["root", "content"],
   base: {

package/dist/components/RichSelect/SelectSearchInput/SelectSearchInput.styles.js

@@ -1,4 +1,4 @@
-import { s as o } from "../../../sva-OmxClA9g.js";
+import { s as o } from "../../../sva-wwkEhoyo.js";
 const t = o({
   slots: ["root"],
   base: {

package/dist/{src/components → components}/RichSelect/SelectTags/SelectTags.d.ts

@@ -29,4 +29,7 @@ export interface IressSelectTagsProps extends Omit<IressSelectActivatorProps, 'w
      */
     limit?: number;
 }
-export declare const IressSelectTags: ({ append, className, "data-testid": dataTestId, id, limit, onDelete, onDeleteAll, onToggleActions, placeholder, prepend, selected, selectedOptionsText, ...restProps }: IressSelectTagsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const IressSelectTags: {
+    ({ append, className, "data-testid": dataTestId, id, limit, onDelete, onDeleteAll, onToggleActions, placeholder, prepend, selected, selectedOptionsText, ...restProps }: IressSelectTagsProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/RichSelect/SelectTags/SelectTags.js

@@ -1,73 +1,75 @@
 import { jsxs as N, jsx as o } from "react/jsx-runtime";
-import { propagateTestid as b } from "../../../helpers/utility/propagateTestid.js";
+import { propagateTestid as I } from "../../../helpers/utility/propagateTestid.js";
 import { toArray as k } from "../../../helpers/formatting/toArray.js";
 import { composeLabelValueDescriptor as w } from "../../../helpers/label-value/composeLabelValueDescriptor.js";
 import { getFormControlValueAsStringIfDefined as E } from "../../../helpers/form/getFormControlValueAsStringIfDefined.js";
-import { useMemo as M, useState as j, useContext as A, useCallback as I } from "react";
+import { useMemo as M, useState as j, useCallback as x } from "react";
 import { focusableElements as B } from "../../../helpers/dom/focusableElements.js";
-import { PopoverContext as O } from "../../Popover/hooks/usePopover.js";
 import { IressText as v } from "../../Text/Text.js";
-import { c as L } from "../../../cx-DN21T1EH.js";
+import { c as O } from "../../../cx-DN21T1EH.js";
 import { selectTags as F } from "./SelectTags.styles.js";
 import { IressTag as T } from "../../Tag/Tag.js";
 import "../../Tag/Tag.styles.js";
 import "../../Tag/TagInput/TagInput.js";
-import { IressMenu as V } from "../../Menu/Menu.js";
+import { IressMenu as A } from "../../Menu/Menu.js";
 import "../../Menu/Menu.styles.js";
-import "../../Divider/Divider.styles.js";
-import { GlobalCSSClass as C } from "../../../enums.js";
+import "../../Menu/MenuDivider/MenuDivider.js";
 import { IressMenuItem as D } from "../../Menu/MenuItem/MenuItem.js";
-import { IressPopover as G } from "../../Popover/Popover.js";
+import "../../Menu/MenuText/MenuText.js";
+import { IressPopover as L } from "../../Popover/Popover.js";
 import "../../Popover/Popover.styles.js";
 import "../../Popover/InputPopover/InputPopover.js";
-import { I as R } from "../../../Button-B4nt3P1v.js";
+import { usePopover as V } from "../../Popover/hooks/usePopover.js";
+import "../../Popover/hooks/useFloatingPopover.js";
+import { I as G } from "../../../Button-BkufphWK.js";
 import "../../Button/CloseButton/CloseButton.js";
-import { IressIcon as W } from "../../Icon/Icon.js";
+import { IressIcon as R } from "../../Icon/Icon.js";
 import "../../Icon/Icon.styles.js";
+import { GlobalCSSClass as S } from "../../../enums.js";
 import "../../Inline/Inline.styles.js";
-import { IressInline as $ } from "../../Inline/Inline.js";
-const S = (r, s) => {
+import { IressInline as W } from "../../Inline/Inline.js";
+const C = (r, s) => {
   if (!r?.api.elements.reference || !s)
     return;
-  const a = r.getFocusableActivator(), n = B(
+  const a = r.getFocusableActivator(), l = B(
     r.api.elements.reference
-  ).filter((l) => l !== a);
-  if (n.length < 1)
+  ).filter((n) => n !== a);
+  if (l.length < 1)
     a?.focus();
   else {
-    const l = n.indexOf(s.currentTarget), t = n.filter(
+    const n = l.indexOf(s.currentTarget), t = l.filter(
       (m) => m !== s.currentTarget
-    ), i = Math.max(l - 1, 0);
-    !t[i] && t[0] ? t[0].focus() : t[0] ? t[i].focus() : a?.focus();
+    ), c = Math.max(n - 1, 0);
+    !t[c] && t[0] ? t[0].focus() : t[0] ? t[c].focus() : a?.focus();
   }
-}, q = ({
+}, $ = ({
   "data-testid": r,
   limit: s = 5,
   onDelete: a,
-  onDeleteAll: n,
-  onToggleActions: l,
+  onDeleteAll: l,
+  onToggleActions: n,
   selectedArray: t,
-  selectedOptionsText: i
+  selectedOptionsText: c
 }) => {
-  const [m, u] = j(!1), c = A(O), p = F(), h = I(
+  const [m, u] = j(!1), i = V(), p = F(), h = x(
     (e, f) => {
       a?.(
-        t.find((x) => x.label === e),
+        t.find((b) => b.label === e),
         f
-      ), f.stopPropagation(), S(c, f);
+      ), f.stopPropagation(), C(i, f);
     },
-    [a, c, t]
-  ), g = I(
+    [a, i, t]
+  ), g = x(
     (e) => {
-      n?.(e), c?.getFocusableActivator()?.focus();
+      l?.(e), i?.getFocusableActivator()?.focus();
     },
-    [n, c]
+    [l, i]
   );
-  return m || !s || t.length <= s ? t.map((e) => /* @__PURE__ */ o(
+  return m && t.length || !s || t.length <= s ? t.map((e) => /* @__PURE__ */ o(
     T,
     {
       className: p.tag,
-      "data-testid": b(r, "tag"),
+      "data-testid": I(r, "tag"),
       deleteButtonText: `Delete ${e.label}`,
       onDelete: h,
       children: e.label
@@ -77,69 +79,69 @@ const S = (r, s) => {
     T,
     {
       className: p.tag,
-      "data-testid": b(r, "tag"),
+      "data-testid": I(r, "tag"),
       deleteButton: /* @__PURE__ */ o(
-        G,
+        L,
         {
-          activator: /* @__PURE__ */ o(R, { mode: "tertiary", children: /* @__PURE__ */ o(
-            W,
+          activator: /* @__PURE__ */ o(G, { mode: "tertiary", children: /* @__PURE__ */ o(
+            R,
             {
               name: "chevron-circle-down",
               screenreaderText: "Actions"
             }
           ) }),
-          onActivated: () => l?.(!0),
+          onActivated: () => n?.(!0),
           onClick: (e) => {
-            e.stopPropagation(), S(c, e);
+            e.stopPropagation(), C(i, e);
           },
-          onDeactivated: () => l?.(!1),
-          children: /* @__PURE__ */ N(V, { children: [
+          onDeactivated: () => n?.(!1),
+          children: /* @__PURE__ */ N(A, { children: [
             /* @__PURE__ */ o(D, { onClick: () => u(!0), children: "Expand all" }),
             /* @__PURE__ */ o(D, { onClick: g, children: "Delete all" })
           ] })
         }
       ),
-      children: w(t, i)
+      children: w(t, c)
     }
   );
-}, xe = ({
+}, q = ({
   append: r = "",
   className: s,
   "data-testid": a,
-  id: n,
-  limit: l = 5,
+  id: l,
+  limit: n = 5,
   onDelete: t,
-  onDeleteAll: i,
+  onDeleteAll: c,
   onToggleActions: m,
   placeholder: u,
-  prepend: c,
+  prepend: i,
   selected: p,
   selectedOptionsText: h = "{{numOptions}} selected",
   ...g
 }) => {
-  const e = M(() => k(p), [p]), f = !e.length && u, x = !!e.length, P = r == null || r === "" || !r, d = F({ showDefaultChevron: P });
+  const e = M(() => k(p), [p]), f = !e.length && u, b = !!e.length, P = r == null || r === "" || !r, d = F({ showDefaultChevron: P });
   return /* @__PURE__ */ N(
     v,
     {
       ...g,
-      id: n,
+      id: l,
       tabIndex: 0,
-      className: L(
+      className: O(
         s,
         d.root,
-        C.FormElementInner,
-        C.RichSelectTags
+        S.FormElementInner,
+        S.RichSelectTags
       ),
       children: [
-        c && /* @__PURE__ */ o("span", { className: d.prepend, children: c }),
+        i && /* @__PURE__ */ o("span", { className: d.prepend, children: i }),
         f && /* @__PURE__ */ o(v, { className: d.placeholder, children: u }),
-        x && /* @__PURE__ */ o($, { gap: "sm", className: d.tagsList, children: /* @__PURE__ */ o(
-          q,
+        b && /* @__PURE__ */ o(W, { gap: "sm", className: d.tagsList, children: /* @__PURE__ */ o(
+          $,
           {
             "data-testid": a,
-            limit: l,
+            limit: n,
             onDelete: t,
-            onDeleteAll: i,
+            onDeleteAll: c,
             onToggleActions: m,
             selectedArray: e,
             selectedOptionsText: h
@@ -158,6 +160,7 @@ const S = (r, s) => {
     }
   );
 };
+q.displayName = "IressSelectTags";
 export {
-  xe as IressSelectTags
+  q as IressSelectTags
 };