@ogcio/design-system-react 1.20.0 → 1.22.0

package/dist/summary-list/index.d.ts

@@ -0,0 +1,6 @@
+export { SummaryListRow } from './summary-list-row.js';
+export * from './summary-list-action.js';
+export * from './summary-list-value.js';
+export * from './summary-list.js';
+export * from './summary-list-header.js';
+export type * from './types.js';

package/dist/summary-list/index.js

@@ -0,0 +1,12 @@
+import { SummaryListRow as o } from "./summary-list-row.js";
+import { SummaryListAction as e } from "./summary-list-action.js";
+import { SummaryListValue as i } from "./summary-list-value.js";
+import { SummaryList as f } from "./summary-list.js";
+import { SummaryListHeader as s } from "./summary-list-header.js";
+export {
+  f as SummaryList,
+  e as SummaryListAction,
+  s as SummaryListHeader,
+  o as SummaryListRow,
+  i as SummaryListValue
+};

package/dist/summary-list/summary-list-action.d.ts

@@ -0,0 +1,5 @@
+import { SummaryListActionProps } from './types.js';
+export declare const SummaryListAction: {
+    ({ children, ...props }: SummaryListActionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/summary-list/summary-list-action.js

@@ -0,0 +1,18 @@
+"use client";
+import "@ogcio/design-system-react/browser-check";
+import { jsx as r } from "react/jsx-runtime";
+import { Link as i } from "../link/link.js";
+import { useSummaryListContext as o } from "./summary-list-context.js";
+const t = ({
+  children: e,
+  ...m
+}) => (o(), /* @__PURE__ */ r(i, { ...m, children: e }));
+t.displayName = "SummaryListAction";
+Object.defineProperty(t, "componentType", {
+  value: "SummaryListAction",
+  writable: !1,
+  enumerable: !1
+});
+export {
+  t as SummaryListAction
+};

package/dist/summary-list/summary-list-context.d.ts

@@ -0,0 +1,2 @@
+export declare function SummaryListProvider({ children }: any): import("react/jsx-runtime").JSX.Element;
+export declare function useSummaryListContext(): true;

package/dist/summary-list/summary-list-context.js

@@ -0,0 +1,20 @@
+"use client";
+import "@ogcio/design-system-react/browser-check";
+import { jsx as e } from "react/jsx-runtime";
+import { createContext as o, useContext as n } from "react";
+const r = o(null);
+function s({ children: t }) {
+  return /* @__PURE__ */ e(r.Provider, { value: !0, children: t });
+}
+function x() {
+  const t = n(r);
+  if (!t)
+    throw new Error(
+      "useSummaryListContext must be used within SummaryListProvider"
+    );
+  return t;
+}
+export {
+  s as SummaryListProvider,
+  x as useSummaryListContext
+};

package/dist/summary-list/summary-list-header.d.ts

@@ -0,0 +1,5 @@
+import { SummaryListHeaderProps } from './types.js';
+export declare const SummaryListHeader: {
+    ({ children, label, id, className, overflow, maxWidth, ...props }: SummaryListHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/summary-list/summary-list-header.js

@@ -0,0 +1,68 @@
+"use client";
+import "@ogcio/design-system-react/browser-check";
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { Children as S } from "react";
+import { cn as r } from "../cn.js";
+import { useBreakpoint as A } from "../hooks/use-breakpoint.js";
+import { useDomId as C } from "../hooks/use-dom-id.js";
+import { translate as h } from "../i18n/utility.js";
+import { getSpecialComponentType as b } from "../utilities.js";
+import { useSummaryListContext as j } from "./summary-list-context.js";
+import { ActionList as f } from "./summary-list-row.js";
+const y = ({
+  children: g,
+  label: n,
+  id: o,
+  className: N,
+  overflow: w = "wrap",
+  maxWidth: c = "gi-w-full",
+  ...L
+}) => {
+  j();
+  const { width: m } = A(), p = C(), t = S.toArray(g).filter(
+    (s) => b(s) === "SummaryListAction"
+  ), i = m != null && m <= 765, d = c ? { maxWidth: c } : void 0, u = {
+    "gi-truncate gi-block": w === "truncate"
+  };
+  return /* @__PURE__ */ l("tr", { ...L, className: r("gi-h-14", N), children: [
+    /* @__PURE__ */ l("th", { scope: "col", className: "gi-text-center gi-align-middle", children: [
+      !i && /* @__PURE__ */ e("span", { className: r(u), style: d, children: n }),
+      i ? /* @__PURE__ */ l("div", { className: r("gi-flex gi-justify-between"), children: [
+        /* @__PURE__ */ e("span", { className: r(u), style: d, children: n }),
+        /* @__PURE__ */ e("span", { className: "gi-sr-only", children: h("header.actions", {
+          defaultValue: "Actions"
+        }) }),
+        /* @__PURE__ */ e(f, { id: o, children: t.map((s, a) => /* @__PURE__ */ e(
+          "span",
+          {
+            className: r({ "gi-ml-4": a > 0 }),
+            children: s
+          },
+          `${p}-a${a}`
+        )) })
+      ] }) : null
+    ] }),
+    !i && t ? /* @__PURE__ */ l("th", { scope: "col", colSpan: 2, children: [
+      /* @__PURE__ */ e("span", { className: "gi-sr-only", children: h("header.actions", {
+        defaultValue: "Actions"
+      }) }),
+      /* @__PURE__ */ e(f, { id: o, children: t.map((s, a) => /* @__PURE__ */ e(
+        "span",
+        {
+          className: r({ "gi-ml-4": a > 0 }),
+          children: s
+        },
+        `${p}-a${a}`
+      )) })
+    ] }) : null
+  ] });
+};
+y.displayName = "SummaryListHeader";
+Object.defineProperty(y, "componentType", {
+  value: "SummaryListHeader",
+  writable: !1,
+  enumerable: !1
+});
+export {
+  y as SummaryListHeader
+};

package/dist/summary-list/summary-list-row.d.ts

@@ -0,0 +1,6 @@
+import { SummaryListActionListProps, SummaryListRowProps } from './types.js';
+export declare const SummaryListRow: {
+    ({ children, label, withBorder, className, ...props }: SummaryListRowProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const ActionList: ({ id, children }: SummaryListActionListProps) => import("react/jsx-runtime").JSX.Element;

package/dist/summary-list/summary-list-row.js

@@ -0,0 +1,63 @@
+"use client";
+import "@ogcio/design-system-react/browser-check";
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { Children as g } from "react";
+import { cn as s } from "../cn.js";
+import { useDomId as L } from "../hooks/use-dom-id.js";
+import { translate as y } from "../i18n/utility.js";
+import { getSpecialComponentType as p } from "../utilities.js";
+import { useSummaryListContext as $ } from "./summary-list-context.js";
+const f = ({
+  children: a,
+  label: l,
+  withBorder: h,
+  className: b,
+  ...S
+}) => {
+  $();
+  const n = g.toArray(a), m = n.filter(
+    (t) => p(t) === "SummaryListAction"
+  ), o = n.find(
+    (t) => p(t) === "SummaryListValue"
+  ), r = L(), c = `${r}-value`, d = `${r}-actions`;
+  return /* @__PURE__ */ i(
+    "tr",
+    {
+      ...S,
+      className: s(
+        {
+          "gi-border-b gi-border-color-border-system-neutral-muted": h
+        },
+        b
+      ),
+      children: [
+        /* @__PURE__ */ e("th", { id: r, scope: "row", children: l }),
+        o ? /* @__PURE__ */ i("td", { ...o.props, "aria-labelledby": `${r} ${c}`, children: [
+          /* @__PURE__ */ e("span", { id: c, className: "gi-sr-only", children: y("summaryList.col.value", { defaultValue: "Value" }) }),
+          o.props.children
+        ] }) : null,
+        m.length > 0 ? /* @__PURE__ */ e("td", { "aria-labelledby": `${r} ${d}`, children: /* @__PURE__ */ e(v, { id: d, children: m.map((t, u) => /* @__PURE__ */ e(
+          "span",
+          {
+            className: s({ "gi-ml-4": u > 0 }),
+            children: t
+          },
+          `${r}-a${u}`
+        )) }) }) : null
+      ]
+    }
+  );
+}, v = ({ id: a, children: l }) => /* @__PURE__ */ i("div", { className: s("gi-summary-list-action"), children: [
+  /* @__PURE__ */ e("span", { id: a, className: "gi-sr-only", children: y("summaryList.col.actions", { defaultValue: "Actions" }) }),
+  l
+] });
+f.displayName = "SummaryRow";
+Object.defineProperty(f, "componentType", {
+  value: "SummaryListRow",
+  writable: !1,
+  enumerable: !1
+});
+export {
+  v as ActionList,
+  f as SummaryListRow
+};

package/dist/summary-list/summary-list-value.d.ts

@@ -0,0 +1,5 @@
+import { SummaryListValueProps } from './types.js';
+export declare const SummaryListValue: {
+    ({ children, ...props }: SummaryListValueProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/summary-list/summary-list-value.js

@@ -0,0 +1,17 @@
+"use client";
+import "@ogcio/design-system-react/browser-check";
+import { jsx as r } from "react/jsx-runtime";
+import { useSummaryListContext as a } from "./summary-list-context.js";
+const e = ({
+  children: t,
+  ...m
+}) => (a(), /* @__PURE__ */ r("td", { ...m, children: t }));
+e.displayName = "SummaryListValue";
+Object.defineProperty(e, "componentType", {
+  value: "SummaryListValue",
+  writable: !1,
+  enumerable: !1
+});
+export {
+  e as SummaryListValue
+};

package/dist/summary-list/summary-list.d.ts

@@ -1,14 +1,5 @@
-import { SummaryListActionProps, SummaryListProps, SummaryListValueProps, SummaryListRowProps } from './types.js';
-export declare const SummaryListValue: ({ children }: SummaryListValueProps) => import("react/jsx-runtime").JSX.Element;
-export declare const SummaryListAction: {
-    ({ href, children, asChild, }: SummaryListActionProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export declare const SummaryListRow: {
-    ({ children, label, withBorder, ...props }: SummaryListRowProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+import { SummaryListProps } from './types.js';
 export declare const SummaryList: {
-    ({ children, dataTestid }: SummaryListProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, className, withBorder, ...props }: SummaryListProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/summary-list/summary-list.js

@@ -1,46 +1,40 @@
-import { jsx as t, jsxs as r } from "react/jsx-runtime";
-import { translate as i } from "../i18n/utility.js";
-import { Link as u } from "../link/link.js";
-const L = ({ children: a }) => /* @__PURE__ */ t("dd", { className: "gi-summary-list-value", children: a }), e = ({
-  href: a,
-  children: m,
-  asChild: s
-}) => /* @__PURE__ */ t("dd", { className: "gi-summary-list-actions", children: /* @__PURE__ */ t(
-  u,
-  {
-    href: a,
-    "aria-label": i("summaryList.linkAction", {
-      children: m,
-      defaultValue: `Link action: ${m}`
-    }),
-    asChild: s,
-    children: m
-  }
-) }), n = ({
+"use client";
+import "@ogcio/design-system-react/browser-check";
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
+import { Children as u } from "react";
+import { cn as p } from "../cn.js";
+import { getSpecialComponentType as o } from "../utilities.js";
+import { SummaryListProvider as y } from "./summary-list-context.js";
+const l = ({
   children: a,
-  label: m,
-  withBorder: s,
-  ...l
-}) => /* @__PURE__ */ r("dl", { "data-border": s == null ? void 0 : s.toString(), ...l, children: [
-  /* @__PURE__ */ t("dt", { children: m }),
-  a
-] }), y = ({ children: a, dataTestid: m }) => /* @__PURE__ */ t(
-  "div",
-  {
-    className: "gi-summary-list",
-    "aria-label": i("summaryList.summaryList", {
-      defaultValue: "Summary list"
-    }),
-    "data-testid": m,
-    children: a
-  }
-);
-y.displayName = "SummaryList";
-n.displayName = "SummaryRow";
-e.displayName = "SummaryListAction";
+  className: s,
+  withBorder: n,
+  ...d
+}) => {
+  const t = u.toArray(a), i = t.filter(
+    (e) => o(e) === "SummaryListHeader"
+  ), m = t.filter(
+    (e) => o(e) === "SummaryListRow"
+  );
+  return /* @__PURE__ */ r(y, { children: /* @__PURE__ */ r(
+    "div",
+    {
+      className: p("gi-summary-list", {
+        "gi-border gi-border-color-border-system-neutral-muted": n
+      }),
+      children: /* @__PURE__ */ c("table", { className: s, role: "table", ...d, children: [
+        i ? /* @__PURE__ */ r("thead", { children: i }) : null,
+        m ? /* @__PURE__ */ r("tbody", { children: m }) : null
+      ] })
+    }
+  ) });
+};
+l.displayName = "SummaryList";
+Object.defineProperty(l, "componentType", {
+  value: "SummaryList",
+  writable: !1,
+  enumerable: !1
+});
 export {
-  y as SummaryList,
-  e as SummaryListAction,
-  n as SummaryListRow,
-  L as SummaryListValue
+  l as SummaryList
 };

package/dist/summary-list/types.d.ts

@@ -1,20 +1,24 @@
+import { ComponentPropsWithoutRef, ReactNode, TdHTMLAttributes } from 'react';
 import { LinkProps } from '../link/link.js';
-import { SummaryListAction, SummaryListRow, SummaryListValue } from './summary-list.js';
 export type SummaryListItem = {
     key: string;
     value: string | string[];
     actionLink: LinkProps;
 };
-export type SummaryListValueProps = {
-    children: React.ReactNode;
+export type SummaryListValueProps = TdHTMLAttributes<HTMLTableCellElement>;
+export type SummaryListActionProps = LinkProps;
+export type SummaryListRowProps = ComponentPropsWithoutRef<'tr'> & {
+    label: ReactNode;
+    withBorder?: boolean;
 };
-export type SummaryListActionProps = Pick<LinkProps, 'children' | 'href' | 'asChild'>;
-export type SummaryListRowProps = {
-    label: string;
+export type SummaryListProps = ComponentPropsWithoutRef<'table'> & {
     withBorder?: boolean;
-    children: React.ReactElement<typeof SummaryListValue | typeof SummaryListAction> | React.ReactElement<typeof SummaryListValue | typeof SummaryListAction>[];
-} & React.AriaAttributes;
-export type SummaryListProps = {
-    children: React.ReactElement<typeof SummaryListRow>[] | React.ReactElement<typeof SummaryListRow>;
-    dataTestid?: string;
+};
+export type SummaryListHeaderProps = ComponentPropsWithoutRef<'tr'> & {
+    label?: string;
+    overflow?: 'wrap' | 'truncate';
+    maxWidth?: string;
+};
+export type SummaryListActionListProps = ComponentPropsWithoutRef<'thead'> & {
+    label?: string;
 };

package/dist/toast/ds-toast.d.ts

@@ -78,5 +78,5 @@ declare const toastVariants: import('tailwind-variants').TVReturnType<{
     dismiss: string;
     innerContainer: string;
 }, undefined, TVConfig<V, EV>, unknown, unknown, undefined>>;
-declare function Toast({ title, description, action, variant, dismissible, onClose, dataTestid, slotAction, }: ToastProps): import("react/jsx-runtime").JSX.Element;
+declare function Toast({ title, description, action, variant, showIcon, dismissible, onClose, slotAction, }: ToastProps): import("react/jsx-runtime").JSX.Element;
 export { Toast, toastVariants };

package/dist/toast/ds-toast.js

@@ -63,53 +63,42 @@ function B({
   description: s,
   action: a,
   variant: r = "info",
+  showIcon: l = !0,
   dismissible: o,
-  onClose: l,
-  dataTestid: c,
+  onClose: c,
   slotAction: t
 }) {
-  const { base: m, heading: b, container: g, innerContainer: d, dismiss: f, baseDismissible: h } = N({
+  const { base: m, heading: g, container: b, innerContainer: d, dismiss: f, baseDismissible: h } = N({
     variant: r
   });
-  return /* @__PURE__ */ n(
-    "div",
-    {
-      className: (o ? h : m)(),
-      role: "alert",
-      "aria-live": "assertive",
-      "aria-atomic": "true",
-      "aria-label": e,
-      "data-testid": c,
-      children: [
-        /* @__PURE__ */ i(
-          p,
+  return /* @__PURE__ */ n("div", { className: (o ? h : m)(), children: [
+    l ? /* @__PURE__ */ i(
+      p,
+      {
+        icon: C({ variant: r }),
+        className: "gi-toast-icon",
+        "data-variant": r
+      }
+    ) : null,
+    /* @__PURE__ */ n("div", { className: b(), children: [
+      /* @__PURE__ */ n("div", { className: d(), children: [
+        /* @__PURE__ */ i("p", { className: g(), children: e }),
+        o && /* @__PURE__ */ i("div", { className: f(), children: /* @__PURE__ */ i(
+          v,
           {
-            icon: C({ variant: r }),
-            className: "gi-toast-icon",
-            "data-variant": r
+            onClick: c,
+            size: "small",
+            appearance: "dark",
+            variant: "flat",
+            icon: { icon: "close" },
+            "aria-label": "Close toast"
           }
-        ),
-        /* @__PURE__ */ n("div", { className: g(), children: [
-          /* @__PURE__ */ n("div", { className: d(), children: [
-            /* @__PURE__ */ i("p", { className: b(), children: e }),
-            o && /* @__PURE__ */ i("div", { className: f(), children: /* @__PURE__ */ i(
-              v,
-              {
-                onClick: l,
-                size: "small",
-                appearance: "dark",
-                variant: "flat",
-                icon: { icon: "close" },
-                "aria-label": "Close toast"
-              }
-            ) })
-          ] }),
-          /* @__PURE__ */ i(k, { ariaLabel: s, children: s }),
-          (a || t) && /* @__PURE__ */ i("div", { className: "gi-toast-action", children: /* @__PURE__ */ i(w, { href: a == null ? void 0 : a.href, noColor: !0, size: "md", asChild: !!t, children: t || (a == null ? void 0 : a.label) }) })
-        ] })
-      ]
-    }
-  );
+        ) })
+      ] }),
+      /* @__PURE__ */ i(k, { ariaLabel: s, children: s }),
+      (a || t) && /* @__PURE__ */ i("div", { className: "gi-toast-action", children: /* @__PURE__ */ i(w, { href: a == null ? void 0 : a.href, noColor: !0, size: "md", asChild: !!t, children: t || (a == null ? void 0 : a.label) }) })
+    ] })
+  ] });
 }
 export {
   B as Toast,

package/dist/toast/toast.d.ts

@@ -3,4 +3,4 @@ export declare const ToastProvider: () => import("react/jsx-runtime").JSX.Elemen
 export declare const toaster: {
     create: ({ position, ...props }: ToastProps) => void;
 };
-export declare const Toast: ({ variant, title, description, action, dismissible, duration, animation, slotAction, }: ToastProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Toast: ({ variant, title, description, action, dismissible, duration, animation, showIcon, slotAction, ...props }: ToastProps) => import("react/jsx-runtime").JSX.Element | null;