@ogcio/design-system-react 1.31.0 → 1.32.0

package/dist/Heading.d.ts

@@ -0,0 +1,5 @@
+import { Props as CoreProps } from './atoms/heading';
+export type Props = CoreProps & {
+    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+};
+export default function Heading({ as, ...props }: Props): import("react/jsx-runtime").JSX.Element;

package/dist/Heading.js

@@ -0,0 +1,22 @@
+import { jsx as t } from "react/jsx-runtime";
+import p from "./atoms/heading/H1.js";
+import f from "./atoms/heading/H2.js";
+import i from "./atoms/heading/H3.js";
+import n from "./atoms/heading/H4.js";
+import h from "./atoms/heading/H5.js";
+import H from "./atoms/heading/H6.js";
+const e = {
+  h1: p,
+  h2: f,
+  h3: i,
+  h4: n,
+  h5: h,
+  h6: H
+};
+function j({ as: o = "h1", ...r }) {
+  const m = e[o];
+  return /* @__PURE__ */ t(m, { ...r });
+}
+export {
+  j as default
+};

package/dist/alert/alert.d.ts

@@ -1,3 +1,6 @@
+import { ComponentType } from 'react';
+import { IconProps } from '../atoms/icons';
 import { AlertProps } from './types.js';
+export declare const ALERT_VARIANT_ICONS: Record<string, ComponentType<IconProps>>;
 declare function Alert({ title, children, variant, showIcon, dismissible, onClose, className, ...props }: AlertProps): import("react/jsx-runtime").JSX.Element | null;
 export { Alert };

package/dist/alert/alert.js

@@ -1,85 +1,69 @@
 "use client";
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
-import { useState as v } from "react";
-import { cn as c } from "../cn.js";
-import { translate as D } from "../i18n/utility.js";
-import { Icon as w } from "../icon/icon.js";
-import { IconButton as x } from "../icon-button/icon-button.js";
-import { alertVariants as I } from "./variants.js";
-const V = ({ variant: e }) => {
-  let a;
-  switch (e) {
-    case "warning": {
-      a = "warning";
-      break;
-    }
-    case "success": {
-      a = "check_circle";
-      break;
-    }
-    case "danger": {
-      a = "error";
-      break;
-    }
-    default:
-      a = "info";
-  }
-  return a;
+import { jsx as i, jsxs as t } from "react/jsx-runtime";
+import { useState as k } from "react";
+import v from "../atoms/icons/Info.js";
+import D from "../atoms/icons/Error.js";
+import V from "../atoms/icons/Warning.js";
+import x from "../atoms/icons/CheckCircle.js";
+import { cn as n } from "../cn.js";
+import { translate as j } from "../i18n/utility.js";
+import { IconButton as E } from "../icon-button/icon-button.js";
+import { alertVariants as R } from "./variants.js";
+const S = {
+  warning: (r) => /* @__PURE__ */ i(V, { ...r }),
+  success: (r) => /* @__PURE__ */ i(x, { ...r }),
+  danger: (r) => /* @__PURE__ */ i(D, { ...r }),
+  info: (r) => /* @__PURE__ */ i(v, { ...r })
 };
-function q({
-  title: e,
-  children: a,
-  variant: r = "info",
-  showIcon: l = !0,
-  dismissible: t,
+function C({
+  title: r,
+  children: o,
+  variant: a = "info",
+  showIcon: m = !0,
+  dismissible: e,
   onClose: s,
-  className: o,
-  ...m
+  className: c,
+  ...l
 }) {
-  const [d, u] = v(!1), { base: f, heading: p, container: g, dismiss: b, baseDismissible: h } = I({
-    variant: r
-  }), k = t ? h : f;
-  return d ? null : /* @__PURE__ */ n(
+  const [f, p] = k(!1), { base: u, heading: d, container: g, dismiss: N, baseDismissible: h } = R({
+    variant: a
+  }), A = e ? h : u;
+  if (f)
+    return null;
+  const I = S[a ?? "info"];
+  return /* @__PURE__ */ t(
     "div",
     {
-      className: c(k(), o, "gi-not-prose"),
+      className: n(A(), c, "gi-not-prose"),
       role: "alert",
       "aria-live": "assertive",
-      ...m,
+      ...l,
       children: [
-        l ? /* @__PURE__ */ i(
-          w,
-          {
-            icon: V({ variant: r }),
-            ariaHidden: !0,
-            className: "gi-alert-icon",
-            "data-variant": r
-          }
-        ) : null,
-        /* @__PURE__ */ n(
+        m ? /* @__PURE__ */ i(I, { className: "gi-shrink-0 gi-block" }) : null,
+        /* @__PURE__ */ t(
           "div",
           {
-            className: c(g(), {
-              "gi-gap-1": e
+            className: n(g(), {
+              "gi-gap-1": r
             }),
             children: [
-              e && /* @__PURE__ */ i("p", { className: p(), children: e }),
-              a
+              r && /* @__PURE__ */ i("p", { className: d(), children: r }),
+              o
             ]
           }
         ),
-        t && /* @__PURE__ */ i(
-          x,
+        e && /* @__PURE__ */ i(
+          E,
           {
-            onClick: (N) => {
-              u(!0), s == null || s(N);
+            onClick: (b) => {
+              p(!0), s == null || s(b);
             },
-            className: b(),
+            className: N(),
             size: "small",
             appearance: "dark",
             variant: "flat",
             icon: { icon: "close" },
-            "aria-label": D("alert.dismissAlert", {
+            "aria-label": j("alert.dismissAlert", {
               defaultValue: "Dismiss alert"
             })
           }
@@ -89,5 +73,6 @@ function q({
   );
 }
 export {
-  q as Alert
+  S as ALERT_VARIANT_ICONS,
+  C as Alert
 };

package/dist/atoms/{DsButton.d.ts → Button.d.ts}

@@ -1,7 +1,7 @@
 /**
  * Mitosis automatically generates this file.
  * Do not edit this file directly.
- * The file source is in `packages/core/atoms/DsButton.lite.tsx`
+ * The file source is in `packages/core/atoms/Button.lite.tsx`
  */
 import * as React from 'react';
 type Props = {
@@ -190,5 +190,5 @@ export declare const styles: import('tailwind-variants').TVReturnType<{
         false: string;
     };
 }>, unknown, unknown, undefined>>;
-declare const DsButton: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<any>>;
-export default DsButton;
+declare const Button: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<any>>;
+export default Button;

package/dist/atoms/{DsButton.js → Button.js}

@@ -1,12 +1,12 @@
 "use client";
-import { jsx as n } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { c } from "../index-CB-zPpNk.js";
+import { jsx as d } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import { c as s } from "../index-CB-zPpNk.js";
 const r = {
   PRIMARY: "primary",
   SECONDARY: "secondary",
   FLAT: "flat"
-}, i = {
+}, l = {
   DEFAULT: "default",
   DARK: "dark",
   LIGHT: "light"
@@ -14,7 +14,7 @@ const r = {
   SMALL: "small",
   MEDIUM: "medium",
   LARGE: "large"
-}, g = c({
+}, c = s({
   base: [
     "gi-font-primary",
     "gi-border-solid",
@@ -269,40 +269,25 @@ const r = {
     size: "medium",
     disabled: !1
   }
-}), f = (t = r.PRIMARY) => Object.values(r).includes(t) ? t : r.PRIMARY, u = (t) => t === i.LIGHT || t === i.DARK ? t : i.DEFAULT, b = (t) => t === o.SMALL || t === o.LARGE ? t : o.MEDIUM, y = s(function(e, d) {
-  return /* @__PURE__ */ n(
+}), g = (a = r.PRIMARY) => Object.values(r).includes(a) ? a : r.PRIMARY, f = (a) => a === l.LIGHT || a === l.DARK ? a : l.DEFAULT, u = (a) => a === o.SMALL || a === o.LARGE ? a : o.MEDIUM, x = n(function(e, i) {
+  return /* @__PURE__ */ d(
     "button",
     {
-      ref: d,
+      ref: i,
       id: e.id,
-      className: g({
-        variant: f(e.variant),
-        appearance: u(e.appearance),
-        size: b(e.size),
+      className: c({
+        variant: g(e.variant),
+        appearance: f(e.appearance),
+        size: u(e.size),
         disabled: !!e.disabled,
         class: e.className
       }),
       disabled: e.disabled || void 0,
-      onClick: (l) => {
-        var a;
-        return (a = e.onClick) == null ? void 0 : a.call(e, l);
-      },
-      onFocus: (l) => {
-        var a;
-        return (a = e.onFocus) == null ? void 0 : a.call(e, l);
-      },
-      onBlur: (l) => {
-        var a;
-        return (a = e.onBlur) == null ? void 0 : a.call(e, l);
-      },
-      onKeyDown: (l) => {
-        var a;
-        return (a = e.onKeyDown) == null ? void 0 : a.call(e, l);
-      },
-      onKeyUp: (l) => {
-        var a;
-        return (a = e.onKeyUp) == null ? void 0 : a.call(e, l);
-      },
+      onClick: (t) => e.onClick && e.onClick(t),
+      onFocus: (t) => e.onFocus && e.onFocus(t),
+      onBlur: (t) => e.onBlur && e.onBlur(t),
+      onKeyDown: (t) => e.onKeyDown && e.onKeyDown(t),
+      onKeyUp: (t) => e.onKeyUp && e.onKeyUp(t),
       "aria-label": e.ariaLabel,
       "aria-labelledby": e.ariaLabelledBy,
       "aria-describedby": e.ariaDescribedBy,
@@ -322,9 +307,9 @@ const r = {
   );
 });
 export {
-  i as Appearance,
+  l as Appearance,
   o as Size,
   r as Variant,
-  y as default,
-  g as styles
+  x as default,
+  c as styles
 };

package/dist/atoms/heading/H1.d.ts

@@ -0,0 +1,3 @@
+import { Props } from './types';
+declare function H1(props: Props): import("react/jsx-runtime").JSX.Element;
+export default H1;

package/dist/atoms/heading/H1.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import i from "./styles.js";
+import { getSize as a } from "./utils.js";
+function m(e) {
+  return /* @__PURE__ */ t(
+    "h1",
+    {
+      id: e.id,
+      className: i({
+        size: a(e.size, "xl"),
+        class: e.className
+      }),
+      "data-testid": e.dataTestId,
+      children: e.children
+    }
+  );
+}
+export {
+  m as default
+};

package/dist/atoms/heading/H2.d.ts

@@ -0,0 +1,3 @@
+import { Props } from './types';
+declare function H2(props: Props): import("react/jsx-runtime").JSX.Element;
+export default H2;

package/dist/atoms/heading/H2.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import i from "./styles.js";
+import { getSize as a } from "./utils.js";
+function m(e) {
+  return /* @__PURE__ */ t(
+    "h2",
+    {
+      id: e.id,
+      className: i({
+        size: a(e.size, "lg"),
+        class: e.className
+      }),
+      "data-testid": e.dataTestId,
+      children: e.children
+    }
+  );
+}
+export {
+  m as default
+};

package/dist/atoms/heading/H3.d.ts

@@ -0,0 +1,3 @@
+import { Props } from './types';
+declare function H3(props: Props): import("react/jsx-runtime").JSX.Element;
+export default H3;

package/dist/atoms/heading/H3.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import i from "./styles.js";
+import { getSize as a } from "./utils.js";
+function l(e) {
+  return /* @__PURE__ */ t(
+    "h3",
+    {
+      id: e.id,
+      className: i({
+        size: a(e.size, "md"),
+        class: e.className
+      }),
+      "data-testid": e.dataTestId,
+      children: e.children
+    }
+  );
+}
+export {
+  l as default
+};

package/dist/atoms/heading/H4.d.ts

@@ -0,0 +1,3 @@
+import { Props } from './types';
+declare function H4(props: Props): import("react/jsx-runtime").JSX.Element;
+export default H4;

package/dist/atoms/heading/H4.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import i from "./styles.js";
+import { getSize as a } from "./utils.js";
+function l(e) {
+  return /* @__PURE__ */ t(
+    "h4",
+    {
+      id: e.id,
+      className: i({
+        size: a(e.size, "sm"),
+        class: e.className
+      }),
+      "data-testid": e.dataTestId,
+      children: e.children
+    }
+  );
+}
+export {
+  l as default
+};

package/dist/atoms/heading/H5.d.ts

@@ -0,0 +1,3 @@
+import { Props } from './types';
+declare function H5(props: Props): import("react/jsx-runtime").JSX.Element;
+export default H5;

package/dist/atoms/heading/H5.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import i from "./styles.js";
+import { getSize as a } from "./utils.js";
+function l(e) {
+  return /* @__PURE__ */ t(
+    "h5",
+    {
+      id: e.id,
+      className: i({
+        size: a(e.size, "xs"),
+        class: e.className
+      }),
+      "data-testid": e.dataTestId,
+      children: e.children
+    }
+  );
+}
+export {
+  l as default
+};

package/dist/atoms/heading/H6.d.ts

@@ -0,0 +1,3 @@
+import { Props } from './types';
+declare function H6(props: Props): import("react/jsx-runtime").JSX.Element;
+export default H6;

package/dist/atoms/heading/H6.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import i from "./styles.js";
+import { getSize as a } from "./utils.js";
+function l(e) {
+  return /* @__PURE__ */ t(
+    "h6",
+    {
+      id: e.id,
+      className: i({
+        size: a(e.size, "2xs"),
+        class: e.className
+      }),
+      "data-testid": e.dataTestId,
+      children: e.children
+    }
+  );
+}
+export {
+  l as default
+};

package/dist/atoms/heading/index.d.ts

@@ -0,0 +1,9 @@
+export { default as H1 } from './H1';
+export { default as H2 } from './H2';
+export { default as H3 } from './H3';
+export { default as H4 } from './H4';
+export { default as H5 } from './H5';
+export { default as H6 } from './H6';
+export { default as headingStyles } from './styles';
+export type { Size, Props } from './types';
+export { getSize } from './utils';

package/dist/atoms/heading/index.js

@@ -0,0 +1,18 @@
+import { default as o } from "./H1.js";
+import { default as a } from "./H2.js";
+import { default as d } from "./H3.js";
+import { default as m } from "./H4.js";
+import { default as s } from "./H5.js";
+import { default as u } from "./H6.js";
+import { default as g } from "./styles.js";
+import { getSize as S } from "./utils.js";
+export {
+  o as H1,
+  a as H2,
+  d as H3,
+  m as H4,
+  s as H5,
+  u as H6,
+  S as getSize,
+  g as headingStyles
+};

package/dist/atoms/heading/styles.d.ts

@@ -0,0 +1,65 @@
+declare const styles: import('tailwind-variants').TVReturnType<{
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}, undefined, "gi-font-bold gi-font-primary", import('tailwind-variants/dist/config.js').TVConfig<{
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}, {
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}>, {
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}, undefined, import('tailwind-variants').TVReturnType<{
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}, undefined, "gi-font-bold gi-font-primary", import('tailwind-variants/dist/config.js').TVConfig<{
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}, {
+    size: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+        xs: string;
+        '2xs': string;
+    };
+}>, unknown, unknown, undefined>>;
+export default styles;

package/dist/atoms/heading/styles.js

@@ -0,0 +1,17 @@
+import { c as t } from "../../index-CB-zPpNk.js";
+const l = t({
+  base: "gi-font-bold gi-font-primary",
+  variants: {
+    size: {
+      xl: "gi-text-4xl md:gi-text-5xl xl:gi-text-6xl",
+      lg: "gi-text-2xl md:gi-text-3xl xl:gi-text-4xl",
+      md: "gi-text-lg md:gi-text-xl xl:gi-text-2xl",
+      sm: "gi-text-lg xl:gi-text-xl",
+      xs: "gi-text-md",
+      "2xs": "gi-text-sm"
+    }
+  }
+});
+export {
+  l as default
+};

package/dist/atoms/heading/types.d.ts

@@ -0,0 +1,15 @@
+export declare const Size: {
+    readonly XL: "xl";
+    readonly LG: "lg";
+    readonly MD: "md";
+    readonly SM: "sm";
+    readonly XS: "xs";
+    readonly XXS: "2xs";
+};
+export type Props = {
+    id?: string;
+    size?: (typeof Size)[keyof typeof Size];
+    className?: string;
+    children: any;
+    dataTestId?: string;
+};

package/dist/atoms/heading/types.js

@@ -0,0 +1,11 @@
+const s = {
+  XL: "xl",
+  LG: "lg",
+  MD: "md",
+  SM: "sm",
+  XS: "xs",
+  XXS: "2xs"
+};
+export {
+  s as Size
+};

package/dist/atoms/heading/utils.d.ts

@@ -0,0 +1,2 @@
+import { Props } from './types';
+export declare const getSize: (size: Props["size"], defaultSize: Props["size"]) => Props["size"];

package/dist/atoms/heading/utils.js

@@ -0,0 +1,5 @@
+import { Size as o } from "./types.js";
+const r = (e, t) => e && Object.values(o).includes(e) ? e : t;
+export {
+  r as getSize
+};

package/dist/atoms/icons/ArrowLeft.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare function ArrowLeft(props: IconProps): import("react/jsx-runtime").JSX.Element;
+export default ArrowLeft;

package/dist/atoms/icons/ArrowLeft.js

@@ -0,0 +1,23 @@
+import { jsx as l } from "react/jsx-runtime";
+function t(e) {
+  return /* @__PURE__ */ l(
+    "svg",
+    {
+      viewBox: "0 -960 960 960",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: e.size ?? 24,
+      height: e.size ?? 24,
+      className: e.className,
+      id: e.id,
+      role: e.label ? "img" : void 0,
+      "aria-label": e.label,
+      "aria-hidden": !e.label,
+      fill: e.color ?? "currentColor",
+      "data-testid": e.dataTestId ?? "arrow_left",
+      children: /* @__PURE__ */ l("path", { d: "M400-240 160-480l240-240 56 58-142 142h486v80H314l142 142-56 58Z" })
+    }
+  );
+}
+export {
+  t as default
+};

package/dist/atoms/icons/ArrowRight.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare function ArrowRight(props: IconProps): import("react/jsx-runtime").JSX.Element;
+export default ArrowRight;

package/dist/atoms/icons/ArrowRight.js

@@ -0,0 +1,23 @@
+import { jsx as e } from "react/jsx-runtime";
+function l(a) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      viewBox: "0 -960 960 960",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: a.size ?? 24,
+      height: a.size ?? 24,
+      className: a.className,
+      id: a.id,
+      role: a.label ? "img" : void 0,
+      "aria-label": a.label,
+      "aria-hidden": !a.label,
+      fill: a.color ?? "currentColor",
+      "data-testid": a.dataTestId ?? "arrow_right",
+      children: /* @__PURE__ */ e("path", { d: "m560-240-56-58 142-142H160v-80h486L504-662l56-58 240 240-240 240Z" })
+    }
+  );
+}
+export {
+  l as default
+};

package/dist/atoms/icons/CheckCircle.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare function CheckCircle(props: IconProps): import("react/jsx-runtime").JSX.Element;
+export default CheckCircle;