@iress-oss/ids-components 5.20.2 → 6.0.0-alpha.1

package/dist/Provider-BXQiO7Gp.js

@@ -0,0 +1,64 @@
+import { jsxs as $, jsx as t } from "react/jsx-runtime";
+import "./components/Modal/Modal.styles.js";
+import "react";
+import "./Button-D6AL0bia.js";
+import "./components/Button/CloseButton/CloseButton.js";
+import "./components/Modal/hooks/useModal.js";
+import { IressModalProvider as a } from "./components/Modal/ModalProvider.js";
+import { IressToasterProvider as m } from "./components/Toaster/ToasterProvider.js";
+import "./components/Toaster/hooks/useToaster.js";
+import "./components/Toaster/Toaster.styles.js";
+import "./components/Toaster/components/Toast/Toast.styles.js";
+import "./components/Slideout/Slideout.styles.js";
+import "./index-CvOVcYUc.js";
+import "./components/Slideout/hooks/useSlideout.js";
+import { IressSlideoutProvider as d } from "./components/Slideout/SlideoutProvider.js";
+import { createPortal as y } from "react-dom";
+var o = /* @__PURE__ */ ((e) => (e.Color = "color", e.Dimension = "dimension", e.FontFamily = "fontFamily", e.FontSize = "fontSize", e.Background = "background", e.Border = "border", e.Radius = "radius", e.Shadow = "shadow", e.Typography = "typography", e))(o || {});
+o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color, o.Color;
+o.Shadow, o.Border, o.Shadow, o.Border, o.Shadow, o.Border, o.Shadow, o.Shadow, o.Color;
+o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Radius, o.Radius, o.Radius, o.Radius;
+o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension, o.Dimension;
+const h = [
+  "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap"
+];
+o.FontSize, o.FontFamily, o.FontFamily, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography, o.Typography;
+const z = ({
+  children: e,
+  container: r,
+  noDefaultFont: i,
+  noIcons: s,
+  position: l,
+  ...n
+}) => /* @__PURE__ */ $(a, { container: r, children: [
+  /* @__PURE__ */ t(m, { container: r, position: l, children: /* @__PURE__ */ t(d, { container: r, ...n, children: e }) }),
+  !i && y(
+    h.map((p) => /* @__PURE__ */ t(
+      "link",
+      {
+        rel: "stylesheet",
+        href: p,
+        "data-iress-design-system-font": !0
+      },
+      p
+    )),
+    document.head,
+    "design-system-font"
+  ),
+  !s && y(
+    /* @__PURE__ */ t(
+      "link",
+      {
+        rel: "stylesheet",
+        href: "https://cdn.iress.com/icons/5.15.4/css/combined.min.css",
+        "data-iress-design-system-icons": !0
+      }
+    ),
+    document.head,
+    "design-system-icons"
+  )
+] });
+export {
+  z as I,
+  h as n
+};

package/dist/TableProvider-_4Whj6P5.js

@@ -0,0 +1,91 @@
+import { jsx as f } from "react/jsx-runtime";
+import * as s from "react";
+import { createContext as g, useMemo as c } from "react";
+import { c as d, a as p, g as b, b as C } from "./composeTableColumnDefs-Hmd6yfdj.js";
+import { composeTableInitialSorting as m } from "./components/Table/helpers/composeTableInitialSorting.js";
+/**
+   * react-table
+   *
+   * Copyright (c) TanStack
+   *
+   * This source code is licensed under the MIT license found in the
+   * LICENSE.md file in the root directory of this source tree.
+   *
+   * @license MIT
+   */
+function P(t, e) {
+  return t ? y(t) ? /* @__PURE__ */ s.createElement(t, e) : t : null;
+}
+function y(t) {
+  return S(t) || typeof t == "function" || R(t);
+}
+function S(t) {
+  return typeof t == "function" && (() => {
+    const e = Object.getPrototypeOf(t);
+    return e.prototype && e.prototype.isReactComponent;
+  })();
+}
+function R(t) {
+  return typeof t == "object" && typeof t.$$typeof == "symbol" && ["react.memo", "react.forward_ref"].includes(t.$$typeof.description);
+}
+function x(t) {
+  const e = {
+    state: {},
+    // Dummy state
+    onStateChange: () => {
+    },
+    // noop
+    renderFallbackValue: null,
+    ...t
+  }, [o] = s.useState(() => ({
+    current: d(e)
+  })), [a, n] = s.useState(() => o.current.initialState);
+  return o.current.setOptions((i) => ({
+    ...i,
+    ...t,
+    state: {
+      ...a,
+      ...t.state
+    },
+    // Similarly, we'll maintain both our internal state and any user-provided
+    // state.
+    onStateChange: (r) => {
+      n(r), t.onStateChange == null || t.onStateChange(r);
+    }
+  })), o.current;
+}
+function T() {
+  return g(void 0);
+}
+function v() {
+  return M;
+}
+const M = T(), k = ({
+  children: t,
+  columns: e,
+  rows: o
+}) => {
+  const a = c(() => p(o, e), [e, o]), n = x({
+    columns: a,
+    data: o,
+    getCoreRowModel: C(),
+    getSortedRowModel: b(),
+    initialState: {
+      sorting: m(e)
+    }
+  }), i = c(
+    () => ({
+      api: n,
+      getColumnByKey: (l) => e?.find((u) => u.key === l)
+    }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- only update when columns and rows change
+    [o, e, n.getState().sorting]
+  ), { Provider: r } = v();
+  return /* @__PURE__ */ f(r, { value: i, children: t });
+};
+export {
+  k as T,
+  M as a,
+  P as f,
+  v as g
+};

package/dist/components/Alert/Alert.js

@@ -1,11 +1,109 @@
-import "react/jsx-runtime";
-import "../../index-cbHCAGLB.js";
-import "./Alert.types.js";
-import "../../enums.js";
-import { I as a } from "../../LoadingSuspense-BtzikVZk.js";
-import "../Text/Text.js";
-import "../../helpers/utility/propagateTestid.js";
-import "../HeadingWithDeprecatedFallback/HeadingWithDeprecatedFallback.js";
+import { jsx as t, jsxs as i } from "react/jsx-runtime";
+import { useMemo as k, createElement as y } from "react";
+import { IressIcon as j } from "../Icon/Icon.js";
+import "../Icon/Icon.styles.js";
+import { IressText as u } from "../Text/Text.js";
+import { propagateTestid as h } from "../../helpers/utility/propagateTestid.js";
+import { alert as w } from "./Alert.styles.js";
+import { c as N } from "../../cx-DN21T1EH.js";
+import { GlobalCSSClass as B } from "../../enums.js";
+import { I as E } from "../../Button-D6AL0bia.js";
+import { IressCloseButton as V } from "../Button/CloseButton/CloseButton.js";
+import "../Inline/Inline.styles.js";
+import { IressInline as $ } from "../Inline/Inline.js";
+import { useControlledState as q } from "../../hooks/useControlledState.js";
+const F = {
+  danger: "ban",
+  info: "info-square",
+  success: "check",
+  warning: "exclamation-triangle"
+}, Y = ({
+  actions: n,
+  children: I,
+  className: x,
+  defaultDismissed: g,
+  dismissed: b,
+  footer: c,
+  heading: o,
+  icon: a,
+  onDismiss: d,
+  status: r = "info",
+  variant: m,
+  ...l
+}) => {
+  const C = !!d, e = w({ status: r, variant: m }), p = !!n?.length, A = !!c || p, { value: v, setValue: S } = q({
+    component: "IressAlert",
+    defaultValue: g,
+    propName: "dismissed",
+    value: b
+  }), f = k(() => {
+    if (a === !1)
+      return null;
+    const s = a ?? F[r];
+    return /* @__PURE__ */ t(
+      j,
+      {
+        name: s,
+        screenreaderText: `${r}: `,
+        fixedWidth: !0,
+        className: e.icon
+      }
+    );
+  }, [e.icon, a, r]);
+  return v ? null : /* @__PURE__ */ i(
+    u,
+    {
+      className: N(x, e.alert, B.Alert),
+      ...l,
+      children: [
+        m !== "sidebar" && f,
+        /* @__PURE__ */ i("div", { className: e.wrapper, children: [
+          o && /* @__PURE__ */ t(
+            "div",
+            {
+              className: e.heading,
+              "data-testid": h(l["data-testid"], "heading"),
+              children: typeof o == "string" ? /* @__PURE__ */ i(u, { element: "h2", className: e.heading, children: [
+                m === "sidebar" && f,
+                " ",
+                o
+              ] }) : o
+            }
+          ),
+          /* @__PURE__ */ t("div", { className: e.children, children: I }),
+          A && /* @__PURE__ */ i(
+            "div",
+            {
+              className: e.footer,
+              "data-testid": h(l["data-testid"], "footer"),
+              children: [
+                p && /* @__PURE__ */ t($, { gap: "sm", pb: "spacing.050", children: n?.map((s, T) => /* @__PURE__ */ y(
+                  E,
+                  {
+                    ...s,
+                    className: N(s.className, e.action),
+                    color: `colour.system.${r}.text`,
+                    key: T
+                  }
+                )) }),
+                c
+              ]
+            }
+          )
+        ] }),
+        C && /* @__PURE__ */ t(
+          V,
+          {
+            className: e.dismiss,
+            onClick: (s) => {
+              d?.(s), S(!0);
+            }
+          }
+        )
+      ]
+    }
+  );
+};
 export {
-  a as IressAlert
+  Y as IressAlert
 };

package/dist/components/Alert/Alert.styles.js

@@ -0,0 +1,211 @@
+import { s as o } from "../../sva-OmxClA9g.js";
+const e = o({
+  slots: [
+    "alert",
+    "icon",
+    "wrapper",
+    "heading",
+    "children",
+    "footer",
+    "action",
+    "dismiss"
+  ],
+  base: {
+    alert: {
+      display: "flex",
+      flexWrap: "nowrap",
+      gap: "spacing.200",
+      boxSizing: "border-box",
+      marginBottom: "spacing.400",
+      borderRadius: "radius.system.form",
+      paddingBlock: "spacing.200",
+      paddingInline: "spacing.300",
+      textStyle: "typography.body.md",
+      border: "alert",
+      height: "auto",
+      justifyContent: "flex-start",
+      alignItems: "flex-start"
+    },
+    wrapper: {
+      noGutter: !0
+    },
+    icon: {
+      lineHeight: "inherit !important"
+      // Needs important as the line-height is set inside the icon CSS file
+    },
+    heading: {
+      display: "inline-block",
+      marginRight: "spacing.100",
+      _empty: {
+        display: "none"
+      },
+      _directNestedHeadings: {
+        marginBlock: "spacing.000",
+        textStyle: "typography.body.md.strong"
+      }
+    },
+    children: {
+      marginBlock: "spacing.000",
+      "& > p": { marginBlock: "spacing.000" }
+    },
+    footer: {
+      paddingBlockStart: "spacing.100"
+    },
+    action: {
+      minHeight: "[0]",
+      py: "spacing.100",
+      _before: {
+        bg: "transparent",
+        border: "divider",
+        borderRadius: "radius.system.badge"
+      },
+      _after: {
+        transform: "translateZ(-1px)",
+        opacity: 0,
+        borderRadius: "radius.system.badge"
+      },
+      _hover: {
+        _after: {
+          opacity: 1
+        }
+      }
+    },
+    dismiss: {
+      marginLeft: "auto",
+      marginTop: "-spacing.200",
+      marginRight: "-spacing.300",
+      marginBottom: "-spacing.200"
+    }
+  },
+  variants: {
+    status: {
+      danger: {
+        alert: {
+          backgroundColor: "colour.system.danger.surface",
+          color: "colour.neutral.80",
+          borderColor: "colour.system.danger.fill"
+        },
+        heading: {
+          color: "colour.system.danger.text"
+        },
+        icon: {
+          color: "colour.system.danger.text"
+        },
+        action: {
+          color: "colour.system.danger.text",
+          _before: {
+            borderColor: "colour.system.danger.text"
+          },
+          _after: {
+            bg: "colour.system.danger.fill"
+          },
+          _hover: {
+            color: "colour.system.danger.onFill"
+          }
+        }
+      },
+      info: {
+        alert: {
+          backgroundColor: "colour.system.info.surface",
+          color: "colour.neutral.80",
+          borderColor: "colour.system.info.fill"
+        },
+        heading: {
+          color: "colour.system.info.text"
+        },
+        icon: {
+          color: "colour.system.info.text"
+        },
+        action: {
+          color: "colour.system.info.text",
+          _before: {
+            borderColor: "colour.system.info.text"
+          },
+          _after: {
+            bg: "colour.system.info.fill"
+          },
+          _hover: {
+            color: "colour.system.info.onFill"
+          }
+        }
+      },
+      success: {
+        alert: {
+          backgroundColor: "colour.system.success.surface",
+          color: "colour.neutral.80",
+          borderColor: "colour.system.success.fill"
+        },
+        heading: {
+          color: "colour.system.success.text"
+        },
+        icon: {
+          color: "colour.system.success.text"
+        },
+        action: {
+          color: "colour.system.success.text",
+          _before: {
+            borderColor: "colour.system.success.text"
+          },
+          _after: {
+            bg: "colour.system.success.fill"
+          },
+          _hover: {
+            color: "colour.system.success.onFill"
+          }
+        }
+      },
+      warning: {
+        alert: {
+          backgroundColor: "colour.system.warning.surface",
+          color: "colour.neutral.80",
+          borderColor: "colour.system.warning.fill"
+        },
+        heading: {
+          color: "colour.system.warning.text"
+        },
+        icon: {
+          color: "colour.system.warning.text"
+        },
+        action: {
+          color: "colour.system.warning.text",
+          _before: {
+            borderColor: "colour.system.warning.text"
+          },
+          _after: {
+            bg: "colour.system.warning.fill"
+          },
+          _hover: {
+            color: "colour.system.warning.onFill"
+          }
+        }
+      }
+    },
+    variant: {
+      sidebar: {
+        alert: {
+          borderTopLeftRadius: "radius.000",
+          borderBottomLeftRadius: "radius.000",
+          borderWidth: "[0]",
+          borderLeftWidth: "[2.5px]",
+          paddingBlock: "spacing.400"
+        }
+      },
+      "site-wide": {
+        alert: {
+          borderRadius: "radius.000",
+          borderWidth: "[0]",
+          borderBottomWidth: "[0.5px]"
+        },
+        heading: {
+          display: "inline"
+        },
+        children: {
+          display: "inline"
+        }
+      }
+    }
+  }
+});
+export {
+  e as alert
+};

package/dist/components/Alert/index.js

@@ -1,6 +1,6 @@
-import { ALERT_ICONS as o } from "./Alert.types.js";
-import { I as t } from "../../LoadingSuspense-BtzikVZk.js";
+import { IressAlert as o } from "./Alert.js";
+import { alert as f } from "./Alert.styles.js";
 export {
-  o as ALERT_ICONS,
-  t as IressAlert
+  o as IressAlert,
+  f as alert
 };

package/dist/components/Autocomplete/Autocomplete.js

@@ -1,45 +1,45 @@
 import "react/jsx-runtime";
-import "../../index-cbHCAGLB.js";
-import "../../AutocompleteNoResults-D_052VQ9.js";
+import "../../cx-DN21T1EH.js";
+import "./Autocomplete.styles.js";
 import "../Popover/Popover.js";
-import "react";
-import "../../PopoverProvider-DZ92QV8I.js";
+import "../Popover/Popover.styles.js";
 import "../Popover/InputPopover/InputPopover.js";
-import { a as R } from "../../LoadingSuspense-BtzikVZk.js";
+import "react";
+import "../Popover/hooks/usePopover.js";
+import "../Input/Input.js";
+import "../Input/Input.styles.js";
 import "../../hooks/useControlledState.js";
 import "../../helpers/utility/propagateTestid.js";
 import "../../helpers/formatting/toArray.js";
 import "../../helpers/form/getValueAsEvent.js";
 import "../../helpers/form/getFormControlValueAsStringIfDefined.js";
 import "./hooks/useAutocompleteSearch.js";
+import "../Icon/Icon.js";
 import "./components/AutocompleteInstructions.js";
-import "../Badge/Badge.js";
-import "../ButtonGroup/ButtonGroupProvider.js";
-import "../Card/Card.js";
-import "../CheckboxGroup/CheckboxGroup.js";
-import "../Col/Col.js";
-import "../Expander/Expander.js";
-import "../Form/FormContext.js";
+import { a as R } from "../../Autocomplete-CLvWVHp6.js";
+import "../RichSelect/SelectBody/SelectBody.styles.js";
+import "../../enums.js";
 import "../Menu/Menu.js";
-import "../Menu/MenuProvider.js";
-import "../CheckboxMark/CheckboxMark.types.js";
-import "../CheckboxMark/CheckboxMark.js";
-import "../Modal/ModalProvider.js";
-import "../Panel/Panel.js";
-import "../../SlideoutProvider-CQh140HM.js";
-import "react-dom";
-import "../RadioGroup/RadioGroup.js";
-import "../Skeleton/Skeleton.js";
-import "../SkipLink/SkipLink.js";
-import "../Stack/Stack.js";
-import "../Table/TableContext.js";
-import "../Table/TableProvider.js";
-import "../TabSet/Tab/Tab.js";
-import "../TabSet/TabSet.js";
-import "../Text/Text.js";
-import "../Toggle/Toggle.js";
-import "../Tooltip/Tooltip.js";
-import "../ValidationMessage/ValidationMessage.js";
+import "../Menu/Menu.styles.js";
+import "../Divider/Divider.styles.js";
+import "../Menu/MenuItem/MenuItem.js";
+import "../Icon/Icon.styles.js";
+import "../RichSelect/SelectHeading/SelectHeading.js";
+import "../RichSelect/SelectLabel/SelectLabel.styles.js";
+import "../RichSelect/SelectMenu/SelectMenu.js";
+import "../RichSelect/SelectSearch/SelectSearch.styles.js";
+import "../RichSelect/SelectSearchInput/SelectSearchInput.js";
+import "../RichSelect/SelectTags/SelectTags.styles.js";
+import "../../Button-D6AL0bia.js";
+import "../Button/CloseButton/CloseButton.js";
+import "../Tag/Tag.styles.js";
+import "../Tag/TagInput/TagInput.js";
+import "../Inline/Inline.styles.js";
+import "../Inline/Inline.js";
+import "../Readonly/Readonly.js";
+import "../Readonly/Readonly.styles.js";
+import "../Alert/Alert.js";
+import "../Alert/Alert.styles.js";
 export {
   R as IressAutocomplete
 };

package/dist/components/Autocomplete/Autocomplete.styles.js

@@ -0,0 +1,25 @@
+import { s as o } from "../../sva-OmxClA9g.js";
+const p = o({
+  slots: ["root", "popoverContent", "optionList"],
+  base: {
+    root: {},
+    popoverContent: {},
+    optionList: {
+      _empty: {
+        display: "none"
+      }
+    }
+  },
+  variants: {
+    isEmpty: {
+      true: {
+        popoverContent: {
+          display: "none"
+        }
+      }
+    }
+  }
+});
+export {
+  p as autoComplete
+};

package/dist/components/Autocomplete/components/AutocompleteInstructions.js

@@ -1,12 +1,12 @@
 import { jsx as o } from "react/jsx-runtime";
-import { IressPanel as e } from "../../Panel/Panel.js";
-const a = ({
-  minSearchLength: t,
-  styles: s
+import { IressPanel as s } from "../../Panel/Panel.js";
+import "../../Panel/Panel.styles.js";
+const i = ({
+  minSearchLength: t
 }) => {
   const r = `Type at least ${t} character${t === 1 ? "" : "s"} to search`;
-  return /* @__PURE__ */ o(e, { className: s?.instructions ?? "", children: r });
+  return /* @__PURE__ */ o(s, { children: r });
 };
 export {
-  a as AutocompleteInstructions
+  i as AutocompleteInstructions
 };