@iress-oss/ids-components 0.0.1-dev.9 → 5.13.1

package/dist/components/Slideout/Slideout.js

@@ -0,0 +1,16 @@
+import "react/jsx-runtime";
+import "../../index-Cu0xwYjD.js";
+import "./Slideout.types.js";
+import { F } from "../../Loading-CZ64hUvP.js";
+import "react";
+import "../../floating-ui.react-D_ysmiM3.js";
+import "../../helpers/transition/timeStringToNumber.js";
+import "../../enums.js";
+import "../../helpers/utility/idsLogger.js";
+import "../../helpers/utility/propagateTestid.js";
+import "../../hooks/useIdIfNeeded.js";
+import "../Text/Text.js";
+import "./hooks/useIDSProvidedSlideout.js";
+export {
+  F as IressSlideout
+};

package/dist/components/Slideout/Slideout.types.js

@@ -0,0 +1,14 @@
+var t = /* @__PURE__ */ ((r) => (r.Overlay = "overlay", r.Push = "push", r))(t || {});
+const a = ["overlay", "push"];
+var s = /* @__PURE__ */ ((r) => (r.Right = "right", r.Left = "left", r))(s || {});
+const g = ["right", "left"];
+var O = /* @__PURE__ */ ((r) => (r.Sm = "sm", r.Md = "md", r.Lg = "lg", r))(O || {});
+const h = ["sm", "md", "lg"];
+export {
+  a as SLIDEOUT_MODES,
+  g as SLIDEOUT_POSITIONS,
+  h as SLIDEOUT_SIZES,
+  t as SlideoutMode,
+  s as SlideoutPosition,
+  O as SlideoutSize
+};

package/dist/components/Slideout/SlideoutProvider.js

@@ -0,0 +1,91 @@
+import { jsx as h } from "react/jsx-runtime";
+import { createContext as c, useState as f, useCallback as i, useMemo as g, useInsertionEffect as w } from "react";
+import { CSS_IDS_VERSION as x } from "../../constants.js";
+const y = `.ids-slideout-push-element-\\:version\\: {
+  --iress-transition-duration: var(--iress-slideout-transition-duration, var(--iress-g-animation-duration, var(--iress-default-animation-duration, 0.3s)));
+  --iress-transition-type: var(--iress-slideout-transition-timing-function, var(--iress-g-animation-type, var(--iress-default-animation-type, ease-out)));
+  --iress-transition: var(--iress-slideout-transition, all var(--iress-transition-duration) var(--iress-transition-type));
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .ids-slideout-push-element-\\:version\\: {
+    transition: var(--iress-transition);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ids-slideout-push-element-\\:version\\: {
+    transition: all 0.01ms ease-in-out calc(var(--iress-transition-duration) / 2) !important;
+  }
+}
+
+@media only screen and (min-width: 1200px) {
+  .ids-slideout-push-element--right-\\:version\\: {
+    margin-inline-end: inherit;
+  }
+
+  .ids-slideout-push-element--left-\\:version\\: {
+    margin-inline-start: inherit;
+  }
+
+  .ids-slideout-push-element--open-\\:version\\:.ids-slideout-push-element--right-\\:version\\:.ids-slideout-push-element--size--sm-\\:version\\: {
+    margin-inline-end: var(--iress-slideout-sm-width, var(--iress-default-width--sm, 375px));
+  }
+
+  .ids-slideout-push-element--open-\\:version\\:.ids-slideout-push-element--left-\\:version\\:.ids-slideout-push-element--size--sm-\\:version\\: {
+    margin-inline-start: var(--iress-slideout-sm-width, var(--iress-default-width--sm, 375px));
+  }
+
+  .ids-slideout-push-element--open-\\:version\\:.ids-slideout-push-element--right-\\:version\\:.ids-slideout-push-element--size--md-\\:version\\: {
+    margin-inline-end: var(--iress-slideout-md-width, var(--iress-default-width--md, 768px));
+  }
+
+  .ids-slideout-push-element--open-\\:version\\:.ids-slideout-push-element--left-\\:version\\:.ids-slideout-push-element--size--md-\\:version\\: {
+    margin-inline-start: var(--iress-slideout-md-width, var(--iress-default-width--md, 768px));
+  }
+
+  .ids-slideout-push-element--open-\\:version\\:.ids-slideout-push-element--right-\\:version\\:.ids-slideout-push-element--size--lg-\\:version\\: {
+    margin-inline-end: var(--iress-slideout-lg-width, var(--iress-default-width--md, 1200px));
+  }
+
+  .ids-slideout-push-element--open-\\:version\\:.ids-slideout-push-element--left-\\:version\\:.ids-slideout-push-element--size--lg-\\:version\\: {
+    margin-inline-start: var(--iress-slideout-lg-width, var(--iress-default-width--md, 1200px));
+  }
+}`, S = c(void 0);
+let a = !1;
+const E = ({
+  children: m,
+  container: n,
+  injectPushStyles: t
+}) => {
+  const [r, o] = f([]), d = i((e) => {
+    o((s) => s.includes(e) ? [...s] : [...s, e]);
+  }, []), l = i((e) => {
+    o(
+      (s) => s.includes(e) ? s.filter((v) => v !== e) : [...s]
+    );
+  }, []), u = i(
+    (e, s = !0) => {
+      if (s) return d(e);
+      l(e);
+    },
+    [l, d]
+  ), p = g(
+    () => ({
+      container: n,
+      opened: r,
+      showSlideout: u
+    }),
+    [n, r, u]
+  );
+  return w(() => {
+    if (!a && t) {
+      const e = document.createElement("style");
+      e.innerHTML = y.replace(/\\:version\\:/g, x), e.setAttribute("data-push-element-styles", "true"), document.head.appendChild(e), a = !0;
+    }
+  }, [t]), /* @__PURE__ */ h(S.Provider, { value: p, children: m });
+};
+export {
+  S as IressSlideoutContext,
+  E as IressSlideoutProvider
+};

package/dist/components/Slideout/components/SlideoutInner.js

@@ -0,0 +1,7 @@
+import "react/jsx-runtime";
+import "../../../index-Cu0xwYjD.js";
+import "../../../helpers/utility/propagateTestid.js";
+import { a8 as p } from "../../../Loading-CZ64hUvP.js";
+export {
+  p as SlideoutInner
+};

package/dist/components/Slideout/hooks/useIDSProvidedSlideout.js

@@ -0,0 +1,13 @@
+import { useContext as n } from "react";
+import { IressSlideoutContext as s } from "../SlideoutProvider.js";
+function l(o) {
+  const t = n(s);
+  return {
+    container: t == null ? void 0 : t.container,
+    opened: o && (t == null ? void 0 : t.opened.includes(o)),
+    show: (e) => o && (t == null ? void 0 : t.showSlideout(o, e))
+  };
+}
+export {
+  l as useIDSProvidedSlideout
+};

package/dist/components/Slideout/hooks/useSlideout.js

@@ -0,0 +1,17 @@
+import { useContext as r } from "react";
+import { IressSlideoutContext as s } from "../SlideoutProvider.js";
+const d = () => {
+  const o = r(s);
+  return {
+    showSlideout: (t, e = !0) => {
+      if (o === void 0)
+        throw new Error(
+          "IressSlideout: showSlideout must be used within a IressSlideoutProvider"
+        );
+      o.showSlideout(t, e);
+    }
+  };
+};
+export {
+  d as useSlideout
+};

package/dist/components/Slideout/index.js

@@ -0,0 +1,16 @@
+import { SLIDEOUT_MODES as S, SLIDEOUT_POSITIONS as t, SLIDEOUT_SIZES as r, SlideoutMode as i, SlideoutPosition as d, SlideoutSize as s } from "./Slideout.types.js";
+import { F as u } from "../../Loading-CZ64hUvP.js";
+import { IressSlideoutContext as O, IressSlideoutProvider as x } from "./SlideoutProvider.js";
+import { useSlideout as f } from "./hooks/useSlideout.js";
+export {
+  u as IressSlideout,
+  O as IressSlideoutContext,
+  x as IressSlideoutProvider,
+  S as SLIDEOUT_MODES,
+  t as SLIDEOUT_POSITIONS,
+  r as SLIDEOUT_SIZES,
+  i as SlideoutMode,
+  d as SlideoutPosition,
+  s as SlideoutSize,
+  f as useSlideout
+};

package/dist/components/Slider/Slider.js

@@ -0,0 +1,12 @@
+import "react/jsx-runtime";
+import "../../index-Cu0xwYjD.js";
+import "../../SliderTicks-B6vu-MUH.js";
+import "react";
+import "../../helpers/utility/propagateTestid.js";
+import "../../hooks/useControlledState.js";
+import "../../hooks/useIdIfNeeded.js";
+import { G as f } from "../../Loading-CZ64hUvP.js";
+import "../Form/hooks/useNoDefaultValueInForms.js";
+export {
+  f as IressSlider
+};

package/dist/components/Slider/Slider.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/components/SliderTicks.js

@@ -0,0 +1,10 @@
+import "react/jsx-runtime";
+import { S } from "../../../SliderTicks-B6vu-MUH.js";
+import "../../../index-Cu0xwYjD.js";
+import "react";
+import "../../../enums.js";
+import "../../../helpers/utility/propagateTestid.js";
+import "../../../constants.js";
+export {
+  S as SliderTicks
+};

package/dist/components/Slider/index.js

@@ -0,0 +1,4 @@
+import { G as s } from "../../Loading-CZ64hUvP.js";
+export {
+  s as IressSlider
+};

package/dist/components/Spinner/Spinner.js

@@ -0,0 +1,6 @@
+import "react/jsx-runtime";
+import "../../index-Cu0xwYjD.js";
+import { H as i } from "../../Loading-CZ64hUvP.js";
+export {
+  i as IressSpinner
+};

package/dist/components/Spinner/Spinner.types.js

@@ -0,0 +1 @@
+

package/dist/components/Spinner/index.js

@@ -0,0 +1,4 @@
+import { H as s } from "../../Loading-CZ64hUvP.js";
+export {
+  s as IressSpinner
+};

package/dist/components/Stack/Stack.js

@@ -0,0 +1,26 @@
+import { jsx as m } from "react/jsx-runtime";
+import { c as a } from "../../index-Cu0xwYjD.js";
+import { StackCssClass as s } from "./Stack.types.js";
+import { getResponsiveLayoutModifiers as i } from "../../helpers/responsive/getResponsiveLayoutModifiers.js";
+import { GutterSize as p } from "../../enums.js";
+const c = ({
+  children: o,
+  className: t,
+  gutter: r = "none",
+  ...e
+}) => /* @__PURE__ */ m(
+  "div",
+  {
+    className: a(
+      t,
+      s.Base,
+      i(s.Gutter, r, "none")
+    ),
+    ...e,
+    children: o
+  }
+);
+c.Gutter = p;
+export {
+  c as IressStack
+};

package/dist/components/Stack/Stack.types.js

@@ -0,0 +1,4 @@
+var e = /* @__PURE__ */ ((r) => (r.Base = "iress-u-stack", r.Gutter = "iress--gutter", r))(e || {});
+export {
+  e as StackCssClass
+};

package/dist/components/Stack/index.js

@@ -0,0 +1,6 @@
+import { StackCssClass as o } from "./Stack.types.js";
+import { IressStack as a } from "./Stack.js";
+export {
+  a as IressStack,
+  o as StackCssClass
+};

package/dist/components/TabSet/Tab/Tab.js

@@ -0,0 +1,88 @@
+import { jsx as n, jsxs as u } from "react/jsx-runtime";
+import { c as m } from "../../../index-Cu0xwYjD.js";
+import { forwardRef as v, useEffect as N } from "react";
+import { useIdIfNeeded as T } from "../../../hooks/useIdIfNeeded.js";
+import { useTabSetItems as h } from "../hooks/useTabSetItems.js";
+import { TabSetItem as I } from "../components/TabSetItem.js";
+import { createPortal as $ } from "react-dom";
+const j = "ids-tab-v5130", w = "ids-tab--active-v5130", l = {
+  tab: j,
+  active: w
+}, p = v(
+  ({ className: r, type: a = "button", ...i }, s) => /* @__PURE__ */ n(
+    "button",
+    {
+      className: m(r, l.tab),
+      ...i,
+      type: a,
+      ref: s
+    }
+  )
+), y = ({
+  active: r,
+  children: a,
+  className: i,
+  "data-testid": s,
+  label: b,
+  value: o,
+  ...d
+}, f) => {
+  const e = T(d), t = h();
+  N(() => {
+    t == null || t.register({
+      id: e,
+      value: o
+    });
+  }, [e, t, o]);
+  const c = t ? t.isActive(e, o) : r;
+  if (t) {
+    const x = a && c;
+    return /* @__PURE__ */ u(
+      I,
+      {
+        index: t.indexOf(e, o),
+        handleSelection: t.activate,
+        selected: c,
+        value: o,
+        children: [
+          /* @__PURE__ */ n(
+            p,
+            {
+              className: m(i, {
+                [l.active]: c
+              }),
+              "aria-controls": a ? `${e}--panel` : void 0,
+              role: "tab",
+              "data-testid": s,
+              ...d,
+              id: e,
+              ref: f,
+              children: b
+            }
+          ),
+          x && t.panel && $(
+            /* @__PURE__ */ n("div", { "aria-labelledby": e, id: `${e}--panel`, role: "tabpanel", children: a }),
+            t.panel,
+            `${e}--panel`
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ n(
+    p,
+    {
+      className: m(i, {
+        [l.active]: c
+      }),
+      "data-testid": s,
+      ...d,
+      id: e,
+      ref: f,
+      children: b
+    }
+  );
+}, k = v(y);
+export {
+  k as IressTab
+};

package/dist/components/TabSet/Tab/Tab.types.js

@@ -0,0 +1 @@
+

package/dist/components/TabSet/TabSet.js

@@ -0,0 +1,59 @@
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+import { c as n } from "../../index-Cu0xwYjD.js";
+import { s as e } from "../../TabSet.module-Bje9oAao.js";
+import { C as c } from "../../floating-ui.react-D_ysmiM3.js";
+import { propagateTestid as b } from "../../helpers/utility/propagateTestid.js";
+import { TabSetLayout as u } from "./TabSet.types.js";
+import { TabSetProvider as S } from "./TabSetProvider.js";
+import { useState as v } from "react";
+const N = ({
+  children: o,
+  className: s,
+  defaultSelected: i,
+  layout: m = "top-left",
+  onChange: l,
+  selected: r,
+  ...t
+}) => {
+  const [p, f] = v(null);
+  return /* @__PURE__ */ a(
+    S,
+    {
+      onChange: l,
+      defaultSelected: i,
+      panel: p,
+      selected: r,
+      children: /* @__PURE__ */ d(
+        "div",
+        {
+          className: n(s, e.tabSet, {
+            [e[`layout--${m}`]]: !!m
+          }),
+          ...t,
+          children: [
+            o && /* @__PURE__ */ a(
+              c,
+              {
+                render: /* @__PURE__ */ a("div", { className: e.list, role: "tablist" }),
+                loop: !1,
+                children: o
+              }
+            ),
+            o && /* @__PURE__ */ a(
+              "div",
+              {
+                className: e.panel,
+                "data-testid": b(t == null ? void 0 : t["data-testid"], "panel"),
+                ref: f
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+N.Layout = u;
+export {
+  N as IressTabSet
+};

package/dist/components/TabSet/TabSet.types.js

@@ -0,0 +1,6 @@
+var p = /* @__PURE__ */ ((t) => (t.TopLeft = "top-left", t.TopCenter = "top-center", t.TopRight = "top-right", t))(p || {});
+const e = ["top-left", "top-center", "top-right"];
+export {
+  e as TAB_SET_LAYOUTS,
+  p as TabSetLayout
+};

package/dist/components/TabSet/TabSetProvider.js

@@ -0,0 +1,50 @@
+import { jsx as h } from "react/jsx-runtime";
+import { createContext as S, useState as a, useEffect as T, useCallback as y, useMemo as I } from "react";
+import { idsLogger as j } from "../../helpers/utility/idsLogger.js";
+const k = S(
+  void 0
+), L = ({
+  children: m,
+  onChange: i,
+  defaultSelected: l,
+  panel: c,
+  selected: n
+}) => {
+  const [d, p] = a([]), [x, u] = a(l), f = n ?? x, t = d.find(
+    (e, o) => e.value === f || o === f
+  );
+  T(() => {
+    n !== void 0 && l !== void 0 && j(
+      "IressTabSet: Please use either the defaultSelected prop for uncontrolled components, or the selected prop for controlled components, rather than both. If you use both, the selected tab may become unpredictable.",
+      "warn"
+    );
+  }, [n, l]);
+  const v = y((e) => {
+    p((o) => {
+      if (o.some(
+        (s) => s.id === e.id || s.value === e.value
+      ))
+        return o;
+      const r = o.length;
+      return u((s) => s !== void 0 ? s : e.value ?? r), [...o, { ...e, index: r, value: e.value ?? r }];
+    });
+  }, []), b = I(
+    () => ({
+      items: d,
+      active: t,
+      panel: c,
+      register: v,
+      indexOf: (e, o) => d.findIndex((r) => r.id === e || r.value === o),
+      isActive: (e, o) => (t == null ? void 0 : t.id) === e || (t == null ? void 0 : t.value) === o,
+      activate(e, o) {
+        i == null || i({ index: e, value: o }), u(o ?? e);
+      }
+    }),
+    [d, t, c, v, i]
+  );
+  return /* @__PURE__ */ h(k.Provider, { value: b, children: m });
+};
+export {
+  k as TabSetItemsContext,
+  L as TabSetProvider
+};

package/dist/components/TabSet/components/TabSetItem.js

@@ -0,0 +1,45 @@
+import { jsx as u } from "react/jsx-runtime";
+import { s as A } from "../../../TabSet.module-Bje9oAao.js";
+import { a as d } from "../../../floating-ui.react-D_ysmiM3.js";
+import { focusableElements as f } from "../../../helpers/dom/focusableElements.js";
+const m = (i, t, e, a) => {
+  var o;
+  const r = i.querySelector("[id]"), b = r == null ? void 0 : r.getAttribute("id");
+  r == null || r.removeAttribute("id"), i.removeAttribute("tabindex"), i.removeAttribute("data-active"), i.removeAttribute("aria-selected"), (o = e.ref) == null || o.call(e, t), t.tabIndex = a ? 0 : -1, a ? t.setAttribute("data-active", "") : t.removeAttribute("data-active"), b && t.setAttribute("id", b), t.setAttribute("aria-selected", String(a));
+}, x = ({
+  children: i,
+  handleSelection: t,
+  index: e,
+  selected: a,
+  value: r,
+  ...b
+}) => /* @__PURE__ */ u(
+  d,
+  {
+    render: (o) => /* @__PURE__ */ u(
+      "div",
+      {
+        ...b,
+        ...o,
+        "aria-selected": a,
+        className: A.listItem,
+        onClick: () => t(e, r),
+        onKeyDown: (s) => ["Space", "Enter"].includes(s.key) && t(e, r),
+        ref: (s) => {
+          if (!s) return;
+          const c = f(s)[0];
+          c && m(
+            s,
+            c,
+            o,
+            a
+          );
+        },
+        children: i
+      }
+    )
+  }
+);
+export {
+  x as TabSetItem
+};

package/dist/components/TabSet/helpers/mapTabs.js

@@ -0,0 +1,33 @@
+import { jsx as a } from "react/jsx-runtime";
+import { idsLogger as s } from "../../../helpers/utility/idsLogger.js";
+import { LoggerLevels as t } from "../../../enums.js";
+import { IressTab as c } from "../Tab/Tab.js";
+import "../TabSet.js";
+const y = (r) => (s(
+  "IressTabs: mapTabs has been deprecated and will be removed in a future version of IDS, please map and render the items array directly in your application instead.",
+  t.Warn
+), r != null && r.length ? r.map(
+  ({
+    tabName: e,
+    active: d,
+    tabButtonText: m,
+    tabButtonTestId: n,
+    tabButtonOnClick: p,
+    tabPanelContent: i,
+    tabPanelTestId: o
+  }, l) => /* @__PURE__ */ a(
+    c,
+    {
+      value: e,
+      active: d,
+      "data-testid": n,
+      onClick: p,
+      label: m,
+      children: o ? /* @__PURE__ */ a("div", { "data-testid": o, children: i }) : i
+    },
+    e || l
+  )
+) : null);
+export {
+  y as mapTabs
+};

package/dist/components/TabSet/hooks/useTabSetItems.js

@@ -0,0 +1,6 @@
+import { useContext as t } from "react";
+import { TabSetItemsContext as e } from "../TabSetProvider.js";
+const r = () => t(e);
+export {
+  r as useTabSetItems
+};

package/dist/components/TabSet/index.js

@@ -0,0 +1,11 @@
+import { IressTab as e } from "./Tab/Tab.js";
+import { TAB_SET_LAYOUTS as T, TabSetLayout as a } from "./TabSet.types.js";
+import { IressTabSet as p } from "./TabSet.js";
+import { mapTabs as b } from "./helpers/mapTabs.js";
+export {
+  e as IressTab,
+  p as IressTabSet,
+  T as TAB_SET_LAYOUTS,
+  a as TabSetLayout,
+  b as mapTabs
+};

package/dist/components/Table/Table.js

@@ -0,0 +1,17 @@
+import "react/jsx-runtime";
+import "../../index-Cu0xwYjD.js";
+import "./Table.types.js";
+import "../../Table.module-CSNtX5ab.js";
+import "react";
+import "../../helpers/utility/idsLogger.js";
+import "../../hooks/useIdIfNeeded.js";
+import "./components/TableEmpty.js";
+import "../../enums.js";
+import "../../helpers/utility/propagateTestid.js";
+import { J as T } from "../../Loading-CZ64hUvP.js";
+import "./TableProvider.js";
+import "./helpers/hasColumns.js";
+import "./components/TableRows.js";
+export {
+  T as IressTable
+};

package/dist/components/Table/Table.types.js

@@ -0,0 +1,23 @@
+var t = /* @__PURE__ */ ((r) => (r.Row = "row", r.Col = "col", r))(t || {});
+const c = ["row", "col"];
+var e = /* @__PURE__ */ ((r) => (r.Left = "left", r.Right = "right", r.Center = "center", r))(e || {});
+const i = ["left", "right", "center"];
+var n = /* @__PURE__ */ ((r) => (r.String = "string", r.Number = "number", r.Date = "date", r.Currency = "currency", r.Percent = "percent", r))(n || {});
+const L = [
+  "string",
+  "number",
+  "date",
+  "shortDate",
+  "isoDateTime",
+  "relativeTime",
+  "currency",
+  "percent"
+];
+export {
+  L as TABLE_CELL_FORMATS,
+  i as TABLE_COLUMN_ALIGN,
+  c as TABLE_SCOPES,
+  n as TableCellFormat,
+  e as TableColumnAlign,
+  t as TableScope
+};