@iress-oss/ids-components 6.0.0-alpha.0 → 6.0.0-alpha.2

package/dist/components/Link/Link.js

@@ -1,54 +1,53 @@
-import { jsxs as N, Fragment as S, jsx as e } from "react/jsx-runtime";
-import { forwardRef as P, useId as j, useMemo as i, useCallback as k } from "react";
+import { jsxs as L, Fragment as N, jsx as o } from "react/jsx-runtime";
+import { forwardRef as S, useId as P, useMemo as a, useCallback as j } from "react";
 import { IressSpinner as v } from "../Spinner/Spinner.js";
 import "../Spinner/Spinner.styles.js";
-import { s as C } from "../../is-valid-prop-DFFvE05x.js";
-import { c as G } from "../../cva-B2x59Dph.js";
-import { c as w } from "../../cx-DN21T1EH.js";
+import { s as w } from "../../is-valid-prop-Ce0wiweq.js";
+import { c as e } from "../../css-fGu_jDvv.js";
+import { c as G } from "../../cx-DN21T1EH.js";
 import { link as F } from "./Link.styles.js";
 import { GlobalCSSClass as b } from "../../enums.js";
 const M = ({
-  active: l,
+  active: k,
   append: n,
-  children: p,
+  children: c,
   className: f,
-  element: m,
-  loading: r = !1,
-  onClick: t,
-  prepend: a,
+  element: p,
+  loading: s = !1,
+  onClick: l,
+  prepend: i,
   ...u
 }, x) => {
-  const c = j(), s = F({
-    active: l,
-    loading: !!r
-  }), [d, o] = i(
-    () => C(u),
+  const m = P(), r = F.raw({
+    active: k,
+    loading: !!s
+  }), [d, t] = a(
+    () => w(u),
     [u]
-  ), h = k(
-    (L) => {
-      r || t == null || t(L);
+  ), h = j(
+    (I) => {
+      s || l?.(I);
     },
-    [r, t]
-  ), y = i(
+    [s, l]
+  ), C = a(
     () => ({
-      children: /* @__PURE__ */ N(S, { children: [
-        a && !r && /* @__PURE__ */ e("span", { className: s.prepend, children: a }),
-        !!r && /* @__PURE__ */ e(
+      children: /* @__PURE__ */ L(N, { children: [
+        i && !s && /* @__PURE__ */ o("span", { className: e(r.prepend), children: i }),
+        !!s && /* @__PURE__ */ o(
           v,
           {
-            className: s.spinner,
+            className: e(r.spinner),
             fixedWidth: !0,
-            id: c,
-            screenreaderText: r === !0 ? "Loading" : r
+            id: m,
+            screenreaderText: s === !0 ? "Loading" : s
           }
         ),
-        p && /* @__PURE__ */ e("span", { className: s.content, children: p }),
-        n && /* @__PURE__ */ e("span", { className: s.append, children: n })
+        c && /* @__PURE__ */ o("span", { className: e(r.content), children: c }),
+        n && /* @__PURE__ */ o("span", { className: e(r.append), children: n })
       ] }),
-      className: w(
+      className: G(
         f,
-        G(d),
-        s.root,
+        e(r.root, d),
         b.Group,
         b.Link
       ),
@@ -56,34 +55,34 @@ const M = ({
     }),
     [
       n,
-      p,
+      c,
       f,
       h,
-      r,
-      a,
-      c,
+      s,
+      i,
+      m,
       d,
-      s.append,
-      s.content,
-      s.prepend,
-      s.root,
-      s.spinner
+      r.append,
+      r.content,
+      r.prepend,
+      r.root,
+      r.spinner
     ]
-  ), I = i(
-    () => m ?? (o.href ? "a" : "button"),
-    [m, o.href]
+  ), y = a(
+    () => p ?? (t.href ? "a" : "button"),
+    [p, t.href]
   );
-  return /* @__PURE__ */ e(
-    I,
+  return /* @__PURE__ */ o(
+    y,
     {
-      "aria-describedby": r ? c : void 0,
-      type: m || !o.href ? "button" : void 0,
-      ...y,
-      ...o,
+      "aria-describedby": s ? m : void 0,
+      type: p || !t.href ? "button" : void 0,
+      ...C,
+      ...t,
       ref: x
     }
   );
-}, H = P(M);
+}, H = S(M);
 export {
   H as IressLink
 };

package/dist/components/Link/Link.styles.js

@@ -1,4 +1,4 @@
-import { s as o } from "../../sva-TRyehFkb.js";
+import { s as o } from "../../sva-OmxClA9g.js";
 const e = ["root", "content", "prepend", "append", "spinner"], n = o({
   slots: e,
   base: {
@@ -6,6 +6,7 @@ const e = ["root", "content", "prepend", "append", "spinner"], n = o({
       display: "contents"
     },
     content: {
+      cursor: "pointer",
       textDecoration: "underline",
       _groupHover: {
         textDecoration: "none"
@@ -17,9 +18,9 @@ const e = ["root", "content", "prepend", "append", "spinner"], n = o({
       cursor: "pointer",
       display: "inline-flex",
       fontKerning: "none",
-      gap: "spacing.100",
+      gap: "spacing.1",
       pointerEvents: "auto",
-      textStyle: "typography.body.md",
+      textStyle: "typography.body.md.medium",
       whiteSpace: "normal",
       width: "auto",
       color: "colour.primary.text",

package/dist/components/Menu/Menu.js

@@ -1,95 +1,95 @@
-import { jsx as u } from "react/jsx-runtime";
-import { useContext as w, useMemo as s, useCallback as z, useEffect as E, createContext as G } from "react";
+import { jsx as p } from "react/jsx-runtime";
+import { createContext as w, useContext as z, useMemo as s, useCallback as E, useEffect as G } from "react";
 import { useControlledState as H } from "../../hooks/useControlledState.js";
 import { useIdIfNeeded as K } from "../../hooks/useIdIfNeeded.js";
-import { C as R } from "../../floating-ui.react-CPN4oQCc.js";
-import { s as b } from "../../factory-DHLOr79I.js";
+import { C as R } from "../../floating-ui.react-BetVZ099.js";
+import { s as v } from "../../factory-oPXoMw9H.js";
 import { toArray as q } from "../../helpers/formatting/toArray.js";
 import { menu as B } from "./Menu.styles.js";
 import { c as D } from "../../cx-DN21T1EH.js";
 import { PopoverContext as F } from "../Popover/hooks/usePopover.js";
 import { GlobalCSSClass as J } from "../../enums.js";
 function L() {
-  return G(void 0);
+  return w(void 0);
 }
 function O() {
   return Q;
 }
-const Q = L(), et = ({
-  changeOnBlur: m,
-  className: M,
-  defaultSelected: A,
-  fluid: v,
+const Q = L(), to = ({
+  changeOnBlur: f,
+  className: b,
+  defaultSelected: M,
+  fluid: A,
   id: I,
   layout: n = "stack",
-  multiSelect: e,
-  noWrap: l,
+  multiSelect: t,
+  noWrap: u,
   onChange: N,
-  role: C = "list",
+  role: m = "list",
   selected: h,
   ...k
 }) => {
-  const r = K({ id: I }), t = w(F), o = s(() => (t == null ? void 0 : t.type) === "listbox" || (t == null ? void 0 : t.type) === "menu" ? (t.setHasInnerRole(!0), t.type) : e ? "listbox" : C, [e, t, C]), P = s(() => ({
-    "aria-multiselectable": o === "listbox" && e ? !0 : void 0,
-    "aria-orientation": o === "menu" ? n === "stack" ? "vertical" : "horizontal" : void 0
-  }), [n, e, o]), i = s(
-    () => o && ["menu", "listbox"].includes(o),
-    [o]
-  ), d = s(
-    () => !t && i,
-    [t, i]
+  const r = K({ id: I }), o = z(F), e = s(() => o?.type === "listbox" || o?.type === "menu" ? (o.setHasInnerRole(!0), o.type) : t ? "listbox" : m, [t, o, m]), P = s(() => ({
+    "aria-multiselectable": e === "listbox" && t ? !0 : void 0,
+    "aria-orientation": e === "menu" ? n === "stack" ? "vertical" : "horizontal" : void 0
+  }), [n, t, e]), i = s(
+    () => e && ["menu", "listbox"].includes(e),
+    [e]
+  ), l = s(
+    () => !o && i,
+    [o, i]
   ), a = s(
-    () => o === "listbox" || !!e,
-    [o, e]
-  ), { toggleValue: x, value: f } = H({
+    () => e === "listbox" || !!t,
+    [e, t]
+  ), { toggleValue: C, value: d } = H({
     component: "IressMenu",
-    defaultValue: A,
-    multiple: e,
+    defaultValue: M,
+    multiple: t,
     onChange: N,
     propName: "selected",
     value: h
-  }), g = z(
-    (c) => !a || c === void 0 ? !1 : e ? q(f).includes(c) : f === c,
-    [e, f, a]
+  }), x = E(
+    (c) => !a || c === void 0 ? !1 : t ? q(d).includes(c) : d === c,
+    [t, d, a]
   ), y = s(
     () => ({
-      changeOnBlur: m && o === "listbox",
+      changeOnBlur: f && e === "listbox",
       hasArrowKeyNav: i,
-      isComposite: d,
-      isSelected: g,
+      isComposite: l,
+      isSelected: x,
       layout: n,
-      multiSelect: e,
-      noWrap: l,
-      role: o,
+      multiSelect: t,
+      noWrap: u,
+      role: e,
       supportsSelection: a,
-      toggle: x
+      toggle: C
     }),
     [
-      m,
+      f,
       i,
-      d,
-      g,
+      l,
+      x,
       n,
+      t,
+      u,
       e,
-      l,
-      o,
       a,
-      x
+      C
     ]
   );
-  E(() => (t != null && t.toggleAriaControls && r && t.toggleAriaControls(r, !0), () => {
-    t != null && t.toggleAriaControls && r && t.toggleAriaControls(r, !1);
-  }), [r, t]);
-  const V = B({ fluid: v, layout: n, noWrap: l, insidePopover: !!t }), p = {
+  G(() => (o?.toggleAriaControls && r && o.toggleAriaControls(r, !0), () => {
+    o?.toggleAriaControls && r && o.toggleAriaControls(r, !1);
+  }), [r, o]);
+  const V = B({ fluid: A, layout: n, noWrap: u, insidePopover: !!o }), g = {
     ...k,
     ...P,
-    className: D(M, V.root, J.Menu),
+    className: D(b, V.root, J.Menu),
     id: r,
-    role: o
+    role: e
   }, { Provider: j } = O();
-  return /* @__PURE__ */ u(j, { value: y, children: d ? /* @__PURE__ */ u(R, { loop: o === "menu", render: /* @__PURE__ */ u(b.div, { ...p }) }) : /* @__PURE__ */ u(b.div, { ...p }) });
+  return /* @__PURE__ */ p(j, { value: y, children: l ? /* @__PURE__ */ p(R, { loop: e === "menu", render: /* @__PURE__ */ p(v.div, { ...g }) }) : /* @__PURE__ */ p(v.div, { ...g }) });
 };
 export {
-  et as IressMenu,
+  to as IressMenu,
   Q as MenuContext
 };

package/dist/components/Menu/Menu.styles.js

@@ -1,4 +1,4 @@
-import { s as e } from "../../sva-TRyehFkb.js";
+import { s as e } from "../../sva-OmxClA9g.js";
 const o = e({
   slots: ["root", "item", "checkboxMark", "append", "contents", "text"],
   base: {
@@ -77,8 +77,8 @@ const o = e({
     insidePopover: {
       true: {
         root: {
-          my: "spacing.200",
-          px: "spacing.200"
+          my: "spacing.2",
+          px: "spacing.2"
         }
       }
     },
@@ -96,13 +96,13 @@ const o = e({
           display: "inline-flex",
           flexWrap: "wrap",
           flexDirection: "column",
-          rowGap: "spacing.100"
+          rowGap: "spacing.1"
         }
       },
       inline: {
         root: {
           display: "inline-flex",
-          columnGap: "spacing.100",
+          columnGap: "spacing.1",
           flexWrap: "wrap"
         },
         item: {
@@ -115,7 +115,7 @@ const o = e({
         root: {
           display: "flex",
           flexDirection: "row",
-          columnGap: "spacing.100",
+          columnGap: "spacing.1",
           "& > :not(hr)": {
             flex: "1",
             textAlign: "center"
@@ -173,9 +173,9 @@ const o = e({
           _after: {
             content: '""',
             position: "absolute",
-            top: "spacing.000",
-            left: "spacing.000",
-            bottom: "spacing.000",
+            top: "spacing.0",
+            left: "spacing.0",
+            bottom: "spacing.0",
             width: "[{radii.radius.025}]",
             bg: "colour.primary.fill",
             borderRadius: "radius.system.badge"
@@ -192,9 +192,9 @@ const o = e({
           _after: {
             content: '""',
             position: "absolute",
-            left: "spacing.000",
-            right: "spacing.000",
-            bottom: "spacing.000",
+            left: "spacing.0",
+            right: "spacing.0",
+            bottom: "spacing.0",
             height: "[{radii.radius.025}]",
             bg: "colour.primary.fill",
             borderRadius: "radius.system.badge"

package/dist/components/Menu/MenuDivider/MenuDivider.js

@@ -1,22 +1,22 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
 import { useContext as i } from "react";
-import { MenuContext as s } from "../Menu.js";
-import { IressDivider as m } from "../../Divider/Divider.js";
+import { MenuContext as m } from "../Menu.js";
+import { IressDivider as s } from "../../Divider/Divider.js";
 import "../../Divider/Divider.styles.js";
-import { c as a } from "../../../cx-DN21T1EH.js";
-import { GlobalCSSClass as l } from "../../../enums.js";
+import { c as n } from "../../../cx-DN21T1EH.js";
+import { GlobalCSSClass as a } from "../../../enums.js";
 const d = ({
   className: r,
-  ...t
+  ...e
 }) => {
-  const o = i(s);
-  return /* @__PURE__ */ e(
-    m,
+  const o = i(m);
+  return /* @__PURE__ */ t(
+    s,
     {
-      ...t,
-      className: a(r, l.MenuDivider),
-      role: (o == null ? void 0 : o.role) === "menu" ? void 0 : "presentation",
-      vertical: (o == null ? void 0 : o.layout) && o.layout !== "stack"
+      ...e,
+      className: n(r, a.MenuDivider),
+      role: o?.role === "menu" ? void 0 : "presentation",
+      vertical: o?.layout && o.layout !== "stack"
     }
   );
 };