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

package/dist/Button-BXzmntRi.js

@@ -0,0 +1,355 @@
+import { jsxs as R, Fragment as E, jsx as u } from "react/jsx-runtime";
+import { forwardRef as M, useId as N, useContext as W, useRef as A, useMemo as l, useCallback as K, useImperativeHandle as O } from "react";
+import { IressSpinner as D } from "./components/Spinner/Spinner.js";
+import "./components/Spinner/Spinner.styles.js";
+import { GlobalCSSClass as x } from "./enums.js";
+import "./components/ButtonGroup/ButtonGroup.styles.js";
+import { m as L, b as T, s as q, j as z, c as J } from "./cva-B2x59Dph.js";
+import { c as Q } from "./cx-DN21T1EH.js";
+import { s as U } from "./is-valid-prop-DFFvE05x.js";
+import "./components/ButtonGroup/ButtonGroupProvider.js";
+import { useButtonGroupItem as X } from "./components/ButtonGroup/hooks/useButtonGroupItem.js";
+import { c as Y } from "./create-recipe-BqEnhJ30.js";
+import { PopoverContext as Z } from "./components/Popover/hooks/usePopover.js";
+const F = {}, $ = [
+  {
+    mode: "primary",
+    status: "danger",
+    css: {
+      root: {
+        color: "colour.system.danger.onFill",
+        _before: {
+          content: "''",
+          bg: "colour.system.danger.fill"
+        },
+        _after: {
+          content: "''",
+          bg: "colour.system.danger.fillHover"
+        },
+        _active: {
+          _after: {
+            boxShadow: "color-mix(in srgb, {colors.colour.system.danger.fill}, transparent 80%) 0px 0px 0px 3px"
+          }
+        }
+      },
+      spinner: {
+        color: "colour.system.danger.onFill"
+      }
+    }
+  },
+  {
+    mode: "secondary",
+    status: "danger",
+    css: {
+      root: {
+        color: "colour.system.danger.text",
+        _before: {
+          content: "''",
+          bg: "colour.system.danger.surface"
+        },
+        _after: {
+          content: "''",
+          bg: "colour.system.danger.surfaceHover"
+        },
+        _active: {
+          _after: {
+            boxShadow: "color-mix(in srgb, {colors.colour.system.danger.surface}, transparent 60%) 0px 0px 0px 3px"
+          }
+        }
+      },
+      spinner: {
+        color: "colour.system.danger.text"
+      }
+    }
+  },
+  {
+    mode: "tertiary",
+    status: "danger",
+    css: {
+      root: {
+        color: "colour.system.danger.text",
+        _after: {
+          content: "''",
+          bg: "colour.system.danger.surfaceHover"
+        },
+        _active: {
+          _after: {
+            boxShadow: "color-mix(in srgb, {colors.colour.system.danger.surface}, transparent 60%) 0px 0px 0px 3px"
+          }
+        }
+      },
+      spinner: {
+        color: "colour.system.danger.text"
+      }
+    }
+  },
+  {
+    mode: "primary",
+    status: "success",
+    css: {
+      root: {
+        color: "colour.system.success.onFill",
+        _before: {
+          content: "''",
+          bg: "colour.system.success.fill"
+        },
+        _after: {
+          content: "''",
+          bg: "colour.system.success.fillHover"
+        },
+        _active: {
+          _after: {
+            boxShadow: "color-mix(in srgb, {colors.colour.system.success.fill}, transparent 80%) 0px 0px 0px 3px"
+          }
+        }
+      },
+      spinner: {
+        color: "colour.system.success.onFill"
+      }
+    }
+  },
+  {
+    mode: "secondary",
+    status: "success",
+    css: {
+      root: {
+        color: "colour.system.success.text",
+        _before: {
+          content: "''",
+          bg: "colour.system.success.surface"
+        },
+        _after: {
+          content: "''",
+          bg: "colour.system.success.surfaceHover"
+        },
+        _active: {
+          _after: {
+            boxShadow: "color-mix(in srgb, {colors.colour.system.success.surface}, transparent 60%) 0px 0px 0px 3px"
+          }
+        }
+      },
+      spinner: {
+        color: "colour.system.success.text"
+      }
+    }
+  },
+  {
+    mode: "tertiary",
+    status: "success",
+    css: {
+      root: {
+        color: "colour.system.success.text",
+        _after: {
+          content: "''",
+          bg: "colour.system.success.surfaceHover"
+        },
+        _active: {
+          _after: {
+            boxShadow: "color-mix(in srgb, {colors.colour.system.success.surface}, transparent 60%) 0px 0px 0px 3px"
+          }
+        }
+      },
+      spinner: {
+        color: "colour.system.success.text"
+      }
+    }
+  },
+  {
+    mode: "primary",
+    loading: !0,
+    css: {
+      root: {
+        bg: "colour.primary.fill"
+      }
+    }
+  },
+  {
+    mode: "secondary",
+    loading: !0,
+    css: {
+      root: {
+        bg: "colour.primary.surface"
+      }
+    }
+  },
+  {
+    mode: "primary",
+    inButtonGroup: !0,
+    css: {
+      root: {
+        boxShadow: "none"
+      }
+    }
+  },
+  {
+    mode: "tertiary",
+    inButtonGroup: !0,
+    css: {
+      root: {
+        color: "colour.neutral.80",
+        _after: {
+          bg: "colour.primary.surfaceHover"
+        }
+      }
+    }
+  }
+], k = [
+  [
+    "root",
+    "button__root"
+  ],
+  [
+    "prepend",
+    "button__prepend"
+  ],
+  [
+    "append",
+    "button__append"
+  ],
+  [
+    "spinner",
+    "button__spinner"
+  ]
+], oo = /* @__PURE__ */ k.map(([o, n]) => [o, Y(n, F, z($, o))]), ro = L((o = {}) => Object.fromEntries(oo.map(([n, t]) => [n, t.recipeFn(o)]))), h = [
+  "active",
+  "fluid",
+  "inButtonGroup",
+  "loading",
+  "mode",
+  "noWrap",
+  "status"
+], so = (o) => ({ ...F, ...T(o) }), to = /* @__PURE__ */ Object.assign(ro, {
+  __recipe__: !1,
+  __name__: "button",
+  raw: (o) => o,
+  variantKeys: h,
+  variantMap: {
+    active: [
+      "true"
+    ],
+    fluid: [
+      "true",
+      "xs",
+      "sm",
+      "md",
+      "lg",
+      "xl",
+      "xxl"
+    ],
+    inButtonGroup: [
+      "true"
+    ],
+    loading: [
+      "true"
+    ],
+    mode: [
+      "primary",
+      "secondary",
+      "tertiary"
+    ],
+    noWrap: [
+      "true"
+    ],
+    status: [
+      "success",
+      "danger"
+    ]
+  },
+  splitVariantProps(o) {
+    return q(o, h);
+  },
+  getVariantProps: so
+}), eo = ({
+  active: o,
+  append: n,
+  children: t,
+  className: y,
+  element: p,
+  fluid: b,
+  loading: s = !1,
+  mode: g = "secondary",
+  prepend: i,
+  noWrap: w = !1,
+  onClick: c,
+  status: B,
+  value: H,
+  ..._
+}, P) => {
+  const m = N(), C = H ?? (typeof t == "string" || typeof t == "number" || typeof t == "boolean" ? t : void 0), f = W(Z), d = A(null), r = X({ value: C }), V = l(() => r ? r.active ? "primary" : "tertiary" : g, [r, g]), e = to({
+    active: o ?? (f == null ? void 0 : f.isActiveActivator(d.current)),
+    fluid: b === !0 ? "true" : b,
+    inButtonGroup: !!r,
+    mode: V,
+    loading: !!s,
+    noWrap: w,
+    status: B
+  }), [v, a] = l(
+    () => U(_),
+    [_]
+  ), S = K(
+    (G) => {
+      s || (c == null || c(G), r == null || r.toggle());
+    },
+    [r, s, c]
+  ), j = l(
+    () => ({
+      children: /* @__PURE__ */ R(E, { children: [
+        i && !s && /* @__PURE__ */ u("span", { className: e.prepend, children: i }),
+        !!s && /* @__PURE__ */ u(
+          D,
+          {
+            className: e.spinner,
+            fixedWidth: !0,
+            id: m,
+            screenreaderText: s === !0 ? "Loading" : s
+          }
+        ),
+        t,
+        n && /* @__PURE__ */ u("span", { className: e.append, children: n })
+      ] }),
+      className: Q(
+        y,
+        x.FormElement,
+        x.FormElementInner,
+        e.root,
+        J(v),
+        x.Button
+      ),
+      onClick: S
+    }),
+    [
+      n,
+      t,
+      y,
+      S,
+      s,
+      i,
+      m,
+      v,
+      e.append,
+      e.prepend,
+      e.root,
+      e.spinner
+    ]
+  );
+  O(P, () => d.current);
+  const I = l(
+    () => p ?? (a.href ? "a" : "button"),
+    [p, a.href]
+  );
+  return /* @__PURE__ */ u(
+    I,
+    {
+      "aria-describedby": s ? m : void 0,
+      type: p || !a.href ? "button" : void 0,
+      ...j,
+      ...r == null ? void 0 : r.props,
+      ...a,
+      ref: d
+    }
+  );
+}, _o = M(eo);
+export {
+  _o as I,
+  to as b
+};