@keboola/design 11.0.0 → 11.0.1

package/dist/rolldown-runtime-Bdc48AWt.js

@@ -0,0 +1,33 @@
+//#region \0rolldown/runtime.js
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule || !__hasOwnProp.call(mod, "default") ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+//#endregion
+export { __commonJSMin, __exportAll, __toESM };

package/dist/styles-DSUP_-9Z.js

@@ -0,0 +1,158 @@
+import { cva } from "class-variance-authority";
+//#region src/components/OverlayTrigger/styles.ts
+/**
+* Chrome for a control that looks like an input but opens an overlay on click. Shared by
+* `SelectTrigger` and `DateRangePicker`'s trigger so both sit at the same height and colour when
+* they stand next to each other in a filter row.
+*/
+const overlayTriggerVariants = cva([
+	"tailwindcss-preflight",
+	"tw:group",
+	"tw:box-border",
+	"tw:inline-flex",
+	"tw:items-center",
+	"tw:justify-between",
+	"tw:gap-2",
+	"tw:w-full",
+	"tw:text-left",
+	"tw:rounded",
+	"tw:border",
+	"tw:border-solid",
+	"tw:border-neutral-200",
+	"tw:text-neutral-800",
+	"tw:transition-[color,background-color,border-color,box-shadow]",
+	"tw:!outline-hidden",
+	"tw:focus:ring-4",
+	"tw:data-[state=open]:ring-4",
+	"tw:disabled:cursor-not-allowed",
+	"tw:aria-disabled:cursor-not-allowed",
+	"tw:data-[placeholder]:text-muted-foreground",
+	"tw:[&_svg]:shrink-0",
+	"tw:[&_svg]:pointer-events-none"
+], {
+	defaultVariants: {
+		variant: "primary",
+		state: "default",
+		sizing: "medium"
+	},
+	compoundVariants: [
+		{
+			variant: "secondary",
+			state: "error",
+			className: ["tw:bg-error-100"]
+		},
+		{
+			variant: "secondary",
+			state: "warning",
+			className: ["tw:bg-warning-100"]
+		},
+		{
+			variant: "argo",
+			state: "default",
+			className: [
+				"tw:focus:border-primary",
+				"tw:focus:ring-ring/50",
+				"tw:data-[state=open]:border-primary",
+				"tw:data-[state=open]:ring-ring/50"
+			]
+		},
+		{
+			variant: "argo",
+			state: "error",
+			className: [
+				"tw:border-destructive",
+				"tw:focus:border-destructive",
+				"tw:focus:ring-destructive/20",
+				"tw:data-[state=open]:border-destructive",
+				"tw:data-[state=open]:ring-destructive/20"
+			]
+		}
+	],
+	variants: {
+		variant: {
+			primary: [
+				"tw:bg-white",
+				"tw:disabled:opacity-40",
+				"tw:aria-disabled:opacity-40",
+				"tw:aria-[invalid=true]:border-error-500",
+				"tw:aria-[invalid=true]:focus:border-error-500",
+				"tw:aria-[invalid=true]:focus:ring-error-200",
+				"tw:aria-[invalid=true]:data-[state=open]:border-error-500",
+				"tw:aria-[invalid=true]:data-[state=open]:ring-error-200"
+			],
+			secondary: [
+				"tw:bg-neutral-100",
+				"tw:border-neutral-100",
+				"tw:disabled:opacity-40",
+				"tw:aria-disabled:opacity-40",
+				"tw:aria-[invalid=true]:border-error-500",
+				"tw:aria-[invalid=true]:focus:border-error-500",
+				"tw:aria-[invalid=true]:focus:ring-error-200",
+				"tw:aria-[invalid=true]:data-[state=open]:border-error-500",
+				"tw:aria-[invalid=true]:data-[state=open]:ring-error-200"
+			],
+			argo: [
+				"tw:bg-muted",
+				"tw:border-input",
+				"tw:rounded-[var(--radius-lg,0.25rem)]",
+				"tw:text-foreground",
+				"tw:disabled:opacity-50",
+				"tw:aria-disabled:opacity-50",
+				"tw:aria-[invalid=true]:border-destructive",
+				"tw:aria-[invalid=true]:focus:border-destructive",
+				"tw:aria-[invalid=true]:focus:ring-destructive/20",
+				"tw:aria-[invalid=true]:data-[state=open]:border-destructive",
+				"tw:aria-[invalid=true]:data-[state=open]:ring-destructive/20"
+			]
+		},
+		sizing: {
+			default: [
+				"tw:px-4",
+				"tw:py-2.5",
+				"tw:text-sm/[18px]",
+				"tw:h-10",
+				"tw:min-h-10"
+			],
+			medium: [
+				"tw:px-4",
+				"tw:py-2",
+				"tw:text-sm/[18px]",
+				"tw:h-9",
+				"tw:min-h-9"
+			],
+			small: [
+				"tw:px-4",
+				"tw:py-2",
+				"tw:text-sm/[16px]",
+				"tw:h-8",
+				"tw:min-h-8"
+			]
+		},
+		state: {
+			default: [
+				"tw:focus:border-ring",
+				"tw:focus:ring-ring/30",
+				"tw:data-[state=open]:border-ring",
+				"tw:data-[state=open]:ring-ring/30"
+			],
+			error: [
+				"tw:border-error-500",
+				"tw:focus:border-error-500",
+				"tw:focus:ring-error-200",
+				"tw:data-[state=open]:border-error-500",
+				"tw:data-[state=open]:ring-error-200"
+			],
+			warning: [
+				"tw:border-warning-500",
+				"tw:focus:border-warning-500",
+				"tw:focus:ring-warning-200",
+				"tw:data-[state=open]:border-warning-500",
+				"tw:data-[state=open]:ring-warning-200"
+			]
+		}
+	}
+});
+//#endregion
+export { overlayTriggerVariants };
+
+//# sourceMappingURL=styles-DSUP_-9Z.js.map

package/dist/styles-DSUP_-9Z.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles-DSUP_-9Z.js","names":[],"sources":["../src/components/OverlayTrigger/styles.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/**\n * Chrome for a control that looks like an input but opens an overlay on click. Shared by\n * `SelectTrigger` and `DateRangePicker`'s trigger so both sit at the same height and colour when\n * they stand next to each other in a filter row.\n */\nexport const overlayTriggerVariants = cva(\n  [\n    'tailwindcss-preflight',\n    'tw:group',\n    'tw:box-border',\n\n    // layout\n    'tw:inline-flex',\n    'tw:items-center',\n    'tw:justify-between',\n    'tw:gap-2',\n    'tw:w-full',\n    'tw:text-left',\n\n    // base appearance\n    'tw:rounded',\n    'tw:border',\n    'tw:border-solid',\n    'tw:border-neutral-200',\n    'tw:text-neutral-800',\n    // Scoped transition (no `outline`) — prevents the UA focus-outline color\n    // from interpolating through its dark default during state changes.\n    'tw:transition-[color,background-color,border-color,box-shadow]',\n\n    // focus base — ring width here, color comes from state variant\n    'tw:!outline-hidden',\n    'tw:focus:ring-4',\n    'tw:data-[state=open]:ring-4',\n\n    // disabled\n    'tw:disabled:cursor-not-allowed',\n    'tw:aria-disabled:cursor-not-allowed',\n\n    // placeholder (Radix sets data-placeholder on the trigger when no value)\n    'tw:data-[placeholder]:text-muted-foreground',\n\n    // child svg defaults\n    'tw:[&_svg]:shrink-0',\n    'tw:[&_svg]:pointer-events-none',\n  ],\n  {\n    defaultVariants: {\n      variant: 'primary',\n      state: 'default',\n      sizing: 'medium',\n    },\n    compoundVariants: [\n      {\n        variant: 'secondary',\n        state: 'error',\n        className: ['tw:bg-error-100'],\n      },\n      {\n        variant: 'secondary',\n        state: 'warning',\n        className: ['tw:bg-warning-100'],\n      },\n      // --- argo ---\n      {\n        variant: 'argo',\n        state: 'default',\n        className: [\n          'tw:focus:border-primary',\n          'tw:focus:ring-ring/50',\n          'tw:data-[state=open]:border-primary',\n          'tw:data-[state=open]:ring-ring/50',\n        ],\n      },\n      {\n        variant: 'argo',\n        state: 'error',\n        className: [\n          'tw:border-destructive',\n          'tw:focus:border-destructive',\n          'tw:focus:ring-destructive/20',\n          'tw:data-[state=open]:border-destructive',\n          'tw:data-[state=open]:ring-destructive/20',\n        ],\n      },\n    ],\n    variants: {\n      variant: {\n        primary: [\n          'tw:bg-white',\n          'tw:disabled:opacity-40',\n          'tw:aria-disabled:opacity-40',\n          // aria-invalid on the trigger surfaces the error chrome without a `state` prop — the\n          // accessible path (mirrors the `state=\"error\"` legacy tokens). The extra attribute\n          // selector outranks the default focus/open state, so it wins without `!important`.\n          'tw:aria-[invalid=true]:border-error-500',\n          'tw:aria-[invalid=true]:focus:border-error-500',\n          'tw:aria-[invalid=true]:focus:ring-error-200',\n          'tw:aria-[invalid=true]:data-[state=open]:border-error-500',\n          'tw:aria-[invalid=true]:data-[state=open]:ring-error-200',\n        ],\n        secondary: [\n          'tw:bg-neutral-100',\n          'tw:border-neutral-100',\n          'tw:disabled:opacity-40',\n          'tw:aria-disabled:opacity-40',\n          'tw:aria-[invalid=true]:border-error-500',\n          'tw:aria-[invalid=true]:focus:border-error-500',\n          'tw:aria-[invalid=true]:focus:ring-error-200',\n          'tw:aria-[invalid=true]:data-[state=open]:border-error-500',\n          'tw:aria-[invalid=true]:data-[state=open]:ring-error-200',\n        ],\n        argo: [\n          // muted filled input surface — gray, distinct from white containers; not the app-background token\n          'tw:bg-muted',\n          'tw:border-input',\n          // token-driven radius so the trigger tracks --radius-lg like sibling inputs (InputGroup/Combobox/Button)\n          'tw:rounded-[var(--radius-lg,0.25rem)]',\n          'tw:text-foreground',\n          'tw:disabled:opacity-50',\n          'tw:aria-disabled:opacity-50',\n          // aria-invalid on the trigger surfaces the error chrome without a `state` prop — the\n          // accessible path (uses the themeable `destructive` status token).\n          'tw:aria-[invalid=true]:border-destructive',\n          'tw:aria-[invalid=true]:focus:border-destructive',\n          'tw:aria-[invalid=true]:focus:ring-destructive/20',\n          'tw:aria-[invalid=true]:data-[state=open]:border-destructive',\n          'tw:aria-[invalid=true]:data-[state=open]:ring-destructive/20',\n        ],\n      },\n      sizing: {\n        // border-inclusive heights: 40 / 36 / 32 px (small matches Button small)\n        default: ['tw:px-4', 'tw:py-2.5', 'tw:text-sm/[18px]', 'tw:h-10', 'tw:min-h-10'],\n        medium: ['tw:px-4', 'tw:py-2', 'tw:text-sm/[18px]', 'tw:h-9', 'tw:min-h-9'],\n        small: ['tw:px-4', 'tw:py-2', 'tw:text-sm/[16px]', 'tw:h-8', 'tw:min-h-8'],\n      },\n      state: {\n        default: [\n          'tw:focus:border-ring',\n          'tw:focus:ring-ring/30',\n          'tw:data-[state=open]:border-ring',\n          'tw:data-[state=open]:ring-ring/30',\n        ],\n        error: [\n          'tw:border-error-500',\n          'tw:focus:border-error-500',\n          'tw:focus:ring-error-200',\n          'tw:data-[state=open]:border-error-500',\n          'tw:data-[state=open]:ring-error-200',\n        ],\n        warning: [\n          'tw:border-warning-500',\n          'tw:focus:border-warning-500',\n          'tw:focus:ring-warning-200',\n          'tw:data-[state=open]:border-warning-500',\n          'tw:data-[state=open]:ring-warning-200',\n        ],\n      },\n    },\n  },\n);\n"],"mappings":";;;;;;;AAOA,MAAa,yBAAyB,IACpC;CACE;CACA;CACA;CAGA;CACA;CACA;CACA;CACA;CACA;CAGA;CACA;CACA;CACA;CACA;CAGA;CAGA;CACA;CACA;CAGA;CACA;CAGA;CAGA;CACA;AACF,GACA;CACE,iBAAiB;EACf,SAAS;EACT,OAAO;EACP,QAAQ;CACV;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,WAAW,CAAC,iBAAiB;EAC/B;EACA;GACE,SAAS;GACT,OAAO;GACP,WAAW,CAAC,mBAAmB;EACjC;EAEA;GACE,SAAS;GACT,OAAO;GACP,WAAW;IACT;IACA;IACA;IACA;GACF;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,WAAW;IACT;IACA;IACA;IACA;IACA;GACF;EACF;CACF;CACA,UAAU;EACR,SAAS;GACP,SAAS;IACP;IACA;IACA;IAIA;IACA;IACA;IACA;IACA;GACF;GACA,WAAW;IACT;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IAEJ;IACA;IAEA;IACA;IACA;IACA;IAGA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,QAAQ;GAEN,SAAS;IAAC;IAAW;IAAa;IAAqB;IAAW;GAAa;GAC/E,QAAQ;IAAC;IAAW;IAAW;IAAqB;IAAU;GAAY;GAC1E,OAAO;IAAC;IAAW;IAAW;IAAqB;IAAU;GAAY;EAC3E;EACA,OAAO;GACL,SAAS;IACP;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;GACF;GACA,SAAS;IACP;IACA;IACA;IACA;IACA;GACF;EACF;CACF;AACF,CACF"}

package/dist/testing.d.ts

@@ -1,10 +1,10 @@
-import { ReactElement } from 'react';
-import { RenderOptions, RenderResult } from '@testing-library/react';
-import { Brand } from '@keboola/brand-registry';
-
+import { ReactElement } from "react";
+import { Brand } from "@keboola/brand-registry";
+import { RenderOptions, RenderResult } from "@testing-library/react";
+//#region src/testing/renderWithTheme.d.ts
 type Options = Omit<RenderOptions, 'wrapper'> & {
-    /** Brand to drive the wrapping `<ThemeProvider>`. Defaults to `keboola`. */
-    brand?: Brand;
+  /** Brand to drive the wrapping `<ThemeProvider>`. Defaults to `keboola`. */
+  brand?: Brand;
 };
 /**
  * `@testing-library/react` `render` wrapped in a `<ThemeProvider brand={...}>`.
@@ -21,5 +21,6 @@ type Options = Omit<RenderOptions, 'wrapper'> & {
  * working through a single `brand` option.
  */
 declare const renderWithTheme: (ui: ReactElement, options?: Options) => RenderResult;
-
+//#endregion
 export { renderWithTheme };
+//# sourceMappingURL=testing.d.ts.map

package/dist/testing.js

@@ -1,24 +1,39 @@
-import { ThemeProvider } from './chunk-KTTLLKGQ.js';
-import './chunk-KR7NXXHC.js';
-import './chunk-SWQFYNYG.js';
-import './chunk-3W27OLK5.js';
-import './chunk-MODE4QIA.js';
-import { keboolaLegacyIds, ArgoDesignContext } from './chunk-WETKNYZX.js';
-import './chunk-LXLIQ2D6.js';
-import './chunk-G3PMV62Z.js';
-import { render } from '@testing-library/react';
-import { keboola } from '@keboola/brand-registry';
-import { jsx } from 'react/jsx-runtime';
-
-var renderWithTheme = (ui, options = {}) => {
-  const { brand = keboola, ...rest } = options;
-  const isArgo = !keboolaLegacyIds.includes(brand.id);
-  return render(ui, {
-    ...rest,
-    wrapper: ({ children }) => /* @__PURE__ */ jsx(ThemeProvider, { brands: [brand], brandId: brand.id, children: /* @__PURE__ */ jsx(ArgoDesignContext, { value: isArgo, children }) })
-  });
+import { ArgoDesignContext, keboolaLegacyIds } from "./context-KxxeMHbR.js";
+import { ThemeProvider } from "./ThemeProvider-QncUrfJn.js";
+import { keboola } from "@keboola/brand-registry";
+import { jsx } from "react/jsx-runtime";
+import { render } from "@testing-library/react";
+//#region src/testing/renderWithTheme.tsx
+/**
+* `@testing-library/react` `render` wrapped in a `<ThemeProvider brand={...}>`.
+*
+* Use in unit tests for any component that calls `useTheme()` or relies on
+* the brand-driven CSS variables. Defaults to the canonical Keboola brand so
+* callers can opt into a specific brand only when they need to assert
+* brand-dependent behaviour (e.g. chrome re-skins under `keboola-legacy`).
+*
+* `ThemeProvider` no longer drives the argo/legacy design language (that is
+* kbc-ui-specific), so this helper also provides `ArgoDesignContext` derived
+* from the brand — a legacy brand renders legacy chrome, any other renders
+* argo — matching how kbc-ui wires it, so brand-dependent chrome tests keep
+* working through a single `brand` option.
+*/
+const renderWithTheme = (ui, options = {}) => {
+	const { brand = keboola, ...rest } = options;
+	const isArgo = !keboolaLegacyIds.includes(brand.id);
+	return render(ui, {
+		...rest,
+		wrapper: ({ children }) => /* @__PURE__ */ jsx(ThemeProvider, {
+			brands: [brand],
+			brandId: brand.id,
+			children: /* @__PURE__ */ jsx(ArgoDesignContext, {
+				value: isArgo,
+				children
+			})
+		})
+	});
 };
-
+//#endregion
 export { renderWithTheme };
-//# sourceMappingURL=testing.js.map
+
 //# sourceMappingURL=testing.js.map

package/dist/testing.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/testing/renderWithTheme.tsx"],"names":[],"mappings":";;;;;;;;;;;;AA2BO,IAAM,eAAA,GAAkB,CAAC,EAAA,EAAkB,OAAA,GAAmB,EAAC,KAAoB;AACxF,EAAA,MAAM,EAAE,KAAA,GAAQ,OAAA,EAAS,GAAG,MAAK,GAAI,OAAA;AACrC,EAAA,MAAM,MAAA,GAAS,CAAC,gBAAA,CAAiB,QAAA,CAAS,MAAM,EAAE,CAAA;AAClD,EAAA,OAAO,OAAO,EAAA,EAAI;AAAA,IAChB,GAAG,IAAA;AAAA,IACH,SAAS,CAAC,EAAE,UAAS,qBACnB,GAAA,CAAC,iBAAc,MAAA,EAAQ,CAAC,KAAK,CAAA,EAAG,OAAA,EAAS,MAAM,EAAA,EAC7C,QAAA,kBAAA,GAAA,CAAC,qBAAkB,KAAA,EAAO,MAAA,EAAS,UAAS,CAAA,EAC9C;AAAA,GAEH,CAAA;AACH","file":"testing.js","sourcesContent":["import type { ReactElement } from 'react';\nimport { render, type RenderOptions, type RenderResult } from '@testing-library/react';\n\nimport { type Brand, keboola } from '@keboola/brand-registry';\n\nimport { ArgoDesignContext, ThemeProvider } from '../components/ThemeProvider';\nimport { keboolaLegacyIds } from '../components/ThemeProvider/defaults';\n\ntype Options = Omit<RenderOptions, 'wrapper'> & {\n  /** Brand to drive the wrapping `<ThemeProvider>`. Defaults to `keboola`. */\n  brand?: Brand;\n};\n\n/**\n * `@testing-library/react` `render` wrapped in a `<ThemeProvider brand={...}>`.\n *\n * Use in unit tests for any component that calls `useTheme()` or relies on\n * the brand-driven CSS variables. Defaults to the canonical Keboola brand so\n * callers can opt into a specific brand only when they need to assert\n * brand-dependent behaviour (e.g. chrome re-skins under `keboola-legacy`).\n *\n * `ThemeProvider` no longer drives the argo/legacy design language (that is\n * kbc-ui-specific), so this helper also provides `ArgoDesignContext` derived\n * from the brand — a legacy brand renders legacy chrome, any other renders\n * argo — matching how kbc-ui wires it, so brand-dependent chrome tests keep\n * working through a single `brand` option.\n */\nexport const renderWithTheme = (ui: ReactElement, options: Options = {}): RenderResult => {\n  const { brand = keboola, ...rest } = options;\n  const isArgo = !keboolaLegacyIds.includes(brand.id);\n  return render(ui, {\n    ...rest,\n    wrapper: ({ children }) => (\n      <ThemeProvider brands={[brand]} brandId={brand.id}>\n        <ArgoDesignContext value={isArgo}>{children}</ArgoDesignContext>\n      </ThemeProvider>\n    ),\n  });\n};\n"]}
+{"version":3,"file":"testing.js","names":[],"sources":["../src/testing/renderWithTheme.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { render, type RenderOptions, type RenderResult } from '@testing-library/react';\n\nimport { type Brand, keboola } from '@keboola/brand-registry';\n\nimport { ArgoDesignContext, ThemeProvider } from '../components/ThemeProvider';\nimport { keboolaLegacyIds } from '../components/ThemeProvider/defaults';\n\ntype Options = Omit<RenderOptions, 'wrapper'> & {\n  /** Brand to drive the wrapping `<ThemeProvider>`. Defaults to `keboola`. */\n  brand?: Brand;\n};\n\n/**\n * `@testing-library/react` `render` wrapped in a `<ThemeProvider brand={...}>`.\n *\n * Use in unit tests for any component that calls `useTheme()` or relies on\n * the brand-driven CSS variables. Defaults to the canonical Keboola brand so\n * callers can opt into a specific brand only when they need to assert\n * brand-dependent behaviour (e.g. chrome re-skins under `keboola-legacy`).\n *\n * `ThemeProvider` no longer drives the argo/legacy design language (that is\n * kbc-ui-specific), so this helper also provides `ArgoDesignContext` derived\n * from the brand — a legacy brand renders legacy chrome, any other renders\n * argo — matching how kbc-ui wires it, so brand-dependent chrome tests keep\n * working through a single `brand` option.\n */\nexport const renderWithTheme = (ui: ReactElement, options: Options = {}): RenderResult => {\n  const { brand = keboola, ...rest } = options;\n  const isArgo = !keboolaLegacyIds.includes(brand.id);\n  return render(ui, {\n    ...rest,\n    wrapper: ({ children }) => (\n      <ThemeProvider brands={[brand]} brandId={brand.id}>\n        <ArgoDesignContext value={isArgo}>{children}</ArgoDesignContext>\n      </ThemeProvider>\n    ),\n  });\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA2BA,MAAa,mBAAmB,IAAkB,UAAmB,CAAC,MAAoB;CACxF,MAAM,EAAE,QAAQ,SAAS,GAAG,SAAS;CACrC,MAAM,SAAS,CAAC,iBAAiB,SAAS,MAAM,EAAE;CAClD,OAAO,OAAO,IAAI;EAChB,GAAG;EACH,UAAU,EAAE,eACV,oBAAC,eAAD;GAAe,QAAQ,CAAC,KAAK;GAAG,SAAS,MAAM;GAC7C,UAAA,oBAAC,mBAAD;IAAmB,OAAO;IAAS;GAA4B,CAAA;EAClD,CAAA;CAEnB,CAAC;AACH"}

package/dist/themeTokens-BNg98Mu9.js

@@ -0,0 +1,85 @@
+import { DEFAULT_BRAND_ID, DEFAULT_COLOR_SCHEME } from "./context-KxxeMHbR.js";
+import { BRAND_ATTRIBUTE, THEME_ATTRIBUTE } from "./useColorSchemeState-CYqcUfSH.js";
+import { useSyncExternalStore } from "react";
+//#region src/components/ThemeProvider/useThemeAttributes.ts
+const DEFAULT_ATTRIBUTES = {
+	cacheKey: `${DEFAULT_COLOR_SCHEME}:${DEFAULT_BRAND_ID}`,
+	scheme: DEFAULT_COLOR_SCHEME,
+	brandId: DEFAULT_BRAND_ID
+};
+let snapshot = DEFAULT_ATTRIBUTES;
+const readThemeAttributes = () => {
+	if (typeof document === "undefined") return DEFAULT_ATTRIBUTES;
+	const root = document.documentElement;
+	const theme = root.getAttribute(THEME_ATTRIBUTE);
+	const scheme = theme === "dark" || theme === "light" ? theme : DEFAULT_COLOR_SCHEME;
+	const brandId = root.getAttribute("data-brand") ?? "design-system";
+	const cacheKey = `${scheme}:${brandId}`;
+	if (cacheKey !== snapshot.cacheKey) snapshot = {
+		cacheKey,
+		scheme,
+		brandId
+	};
+	return snapshot;
+};
+const subscribe = (onChange) => {
+	if (typeof document === "undefined") return () => {};
+	const observer = new MutationObserver(onChange);
+	observer.observe(document.documentElement, {
+		attributes: true,
+		attributeFilter: [THEME_ATTRIBUTE, BRAND_ATTRIBUTE]
+	});
+	return () => observer.disconnect();
+};
+const getServerSnapshot = () => DEFAULT_ATTRIBUTES;
+/**
+* The colour scheme and brand currently applied to `<html>`, plus a key that
+* changes whenever they do — for memoizing anything built from `resolveToken`.
+*
+* Read from the DOM rather than `useTheme()` on purpose: `ThemeProvider` writes
+* both attributes from passive effects, so during the render after a scheme
+* change the context already says `dark` while `<html>` — and therefore every
+* computed `--*` value — is still light. Keying off the attributes keeps the
+* values and the key that stands for them in lockstep, and works in a subtree
+* with no `ThemeProvider` above it.
+*
+* Returning `scheme` from the same read is what makes that safe by construction:
+* a caller cannot pick up the new key and the old scheme.
+*/
+const useThemeAttributes = () => useSyncExternalStore(subscribe, readThemeAttributes, getServerSnapshot);
+//#endregion
+//#region src/utils/themeTokens.ts
+/**
+* Live access to the semantic `--*` design tokens for consumers that cannot use
+* a Tailwind class — a CodeMirror theme object, a mermaid `themeVariables` map,
+* an SVG serialized for export. Those all need a concrete color string at build
+* time, so we resolve the value the browser currently computes for `<html>` and
+* hand the resulting `rgb(...)` to the library.
+*
+* SSR/no-document falls back to a literal; so does a token the stylesheet has
+* not defined (which is what unit tests see, since they load no CSS).
+*/
+const format = (channels, alpha) => alpha === void 0 ? `rgb(${channels})` : `rgb(${channels} / ${alpha})`;
+const resolveToken = (token, fallbackChannels, alpha) => {
+	const channels = typeof document === "undefined" ? fallbackChannels : getComputedStyle(document.documentElement).getPropertyValue(`--${token}`).trim() || fallbackChannels;
+	return format(channels, alpha);
+};
+/**
+* A {@link resolveToken} bound to a single `getComputedStyle` snapshot.
+*
+* Reach for this when building a whole palette at once: `resolveToken` reads the
+* computed style per call, so a config with dozens of token lookups forces dozens
+* of style resolutions for one render. Take a snapshot, read every token off it,
+* throw it away.
+*
+* Snapshot per palette build, never module-level — the values change whenever the
+* scheme or brand does, and a cached resolver would keep serving the old ones.
+*/
+const createTokenResolver = () => {
+	const computed = typeof document === "undefined" ? null : getComputedStyle(document.documentElement);
+	return (token, fallbackChannels, alpha) => format(computed?.getPropertyValue(`--${token}`).trim() || fallbackChannels, alpha);
+};
+//#endregion
+export { createTokenResolver, resolveToken, useThemeAttributes };
+
+//# sourceMappingURL=themeTokens-BNg98Mu9.js.map

package/dist/themeTokens-BNg98Mu9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeTokens-BNg98Mu9.js","names":[],"sources":["../src/components/ThemeProvider/useThemeAttributes.ts","../src/utils/themeTokens.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\n\nimport { DEFAULT_BRAND_ID, DEFAULT_COLOR_SCHEME } from './defaults';\nimport type { BrandId, ResolvedColorScheme } from './types';\nimport { BRAND_ATTRIBUTE } from './useBrandState';\nimport { THEME_ATTRIBUTE } from './useColorSchemeState';\n\nexport type ThemeAttributes = {\n  /** Changes whenever `scheme` or `brandId` does — the memo key for anything built from live `--*` values. */\n  cacheKey: string;\n  scheme: ResolvedColorScheme;\n  brandId: BrandId;\n};\n\n// No attribute set means the stylesheet's own `:root` block is painting, which is\n// the default scheme — not a third \"unknown\" state. Same value on the server, so\n// the SSR snapshot and the client's first render agree.\nconst DEFAULT_ATTRIBUTES: ThemeAttributes = {\n  cacheKey: `${DEFAULT_COLOR_SCHEME}:${DEFAULT_BRAND_ID}`,\n  scheme: DEFAULT_COLOR_SCHEME,\n  brandId: DEFAULT_BRAND_ID,\n};\n\n// `useSyncExternalStore` re-renders forever on a snapshot whose reference changes\n// on every read, so the object is rebuilt only when the key it stands for moves.\nlet snapshot = DEFAULT_ATTRIBUTES;\n\nconst readThemeAttributes = (): ThemeAttributes => {\n  if (typeof document === 'undefined') return DEFAULT_ATTRIBUTES;\n\n  const root = document.documentElement;\n  const theme = root.getAttribute(THEME_ATTRIBUTE);\n  const scheme: ResolvedColorScheme =\n    theme === 'dark' || theme === 'light' ? theme : DEFAULT_COLOR_SCHEME;\n  const brandId = root.getAttribute(BRAND_ATTRIBUTE) ?? DEFAULT_BRAND_ID;\n  const cacheKey = `${scheme}:${brandId}`;\n\n  if (cacheKey !== snapshot.cacheKey) snapshot = { cacheKey, scheme, brandId };\n\n  return snapshot;\n};\n\nconst subscribe = (onChange: () => void): (() => void) => {\n  if (typeof document === 'undefined') return () => {};\n\n  const observer = new MutationObserver(onChange);\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: [THEME_ATTRIBUTE, BRAND_ATTRIBUTE],\n  });\n\n  return () => observer.disconnect();\n};\n\nconst getServerSnapshot = (): ThemeAttributes => DEFAULT_ATTRIBUTES;\n\n/**\n * The colour scheme and brand currently applied to `<html>`, plus a key that\n * changes whenever they do — for memoizing anything built from `resolveToken`.\n *\n * Read from the DOM rather than `useTheme()` on purpose: `ThemeProvider` writes\n * both attributes from passive effects, so during the render after a scheme\n * change the context already says `dark` while `<html>` — and therefore every\n * computed `--*` value — is still light. Keying off the attributes keeps the\n * values and the key that stands for them in lockstep, and works in a subtree\n * with no `ThemeProvider` above it.\n *\n * Returning `scheme` from the same read is what makes that safe by construction:\n * a caller cannot pick up the new key and the old scheme.\n */\nexport const useThemeAttributes = (): ThemeAttributes =>\n  useSyncExternalStore(subscribe, readThemeAttributes, getServerSnapshot);\n","/**\n * Live access to the semantic `--*` design tokens for consumers that cannot use\n * a Tailwind class — a CodeMirror theme object, a mermaid `themeVariables` map,\n * an SVG serialized for export. Those all need a concrete color string at build\n * time, so we resolve the value the browser currently computes for `<html>` and\n * hand the resulting `rgb(...)` to the library.\n *\n * SSR/no-document falls back to a literal; so does a token the stylesheet has\n * not defined (which is what unit tests see, since they load no CSS).\n */\nconst format = (channels: string, alpha?: number): string =>\n  alpha === undefined ? `rgb(${channels})` : `rgb(${channels} / ${alpha})`;\n\nexport const resolveToken = (token: string, fallbackChannels: string, alpha?: number): string => {\n  const channels =\n    typeof document === 'undefined'\n      ? fallbackChannels\n      : getComputedStyle(document.documentElement).getPropertyValue(`--${token}`).trim() ||\n        fallbackChannels;\n  return format(channels, alpha);\n};\n\n/**\n * A {@link resolveToken} bound to a single `getComputedStyle` snapshot.\n *\n * Reach for this when building a whole palette at once: `resolveToken` reads the\n * computed style per call, so a config with dozens of token lookups forces dozens\n * of style resolutions for one render. Take a snapshot, read every token off it,\n * throw it away.\n *\n * Snapshot per palette build, never module-level — the values change whenever the\n * scheme or brand does, and a cached resolver would keep serving the old ones.\n */\nexport const createTokenResolver = () => {\n  const computed =\n    typeof document === 'undefined' ? null : getComputedStyle(document.documentElement);\n\n  return (token: string, fallbackChannels: string, alpha?: number): string =>\n    format(computed?.getPropertyValue(`--${token}`).trim() || fallbackChannels, alpha);\n};\n"],"mappings":";;;;AAiBA,MAAM,qBAAsC;CAC1C,UAAU,GAAG,qBAAqB,GAAG;CACrC,QAAQ;CACR,SAAS;AACX;AAIA,IAAI,WAAW;AAEf,MAAM,4BAA6C;CACjD,IAAI,OAAO,aAAa,aAAa,OAAO;CAE5C,MAAM,OAAO,SAAS;CACtB,MAAM,QAAQ,KAAK,aAAa,eAAe;CAC/C,MAAM,SACJ,UAAU,UAAU,UAAU,UAAU,QAAQ;CAClD,MAAM,UAAU,KAAK,aAAA,YAA4B,KAAA;CACjD,MAAM,WAAW,GAAG,OAAO,GAAG;CAE9B,IAAI,aAAa,SAAS,UAAU,WAAW;EAAE;EAAU;EAAQ;CAAQ;CAE3E,OAAO;AACT;AAEA,MAAM,aAAa,aAAuC;CACxD,IAAI,OAAO,aAAa,aAAa,aAAa,CAAC;CAEnD,MAAM,WAAW,IAAI,iBAAiB,QAAQ;CAC9C,SAAS,QAAQ,SAAS,iBAAiB;EACzC,YAAY;EACZ,iBAAiB,CAAC,iBAAiB,eAAe;CACpD,CAAC;CAED,aAAa,SAAS,WAAW;AACnC;AAEA,MAAM,0BAA2C;;;;;;;;;;;;;;;AAgBjD,MAAa,2BACX,qBAAqB,WAAW,qBAAqB,iBAAiB;;;;;;;;;;;;;AC7DxE,MAAM,UAAU,UAAkB,UAChC,UAAU,KAAA,IAAY,OAAO,SAAS,KAAK,OAAO,SAAS,KAAK,MAAM;AAExE,MAAa,gBAAgB,OAAe,kBAA0B,UAA2B;CAC/F,MAAM,WACJ,OAAO,aAAa,cAChB,mBACA,iBAAiB,SAAS,eAAe,CAAC,CAAC,iBAAiB,KAAK,OAAO,CAAC,CAAC,KAAK,KAC/E;CACN,OAAO,OAAO,UAAU,KAAK;AAC/B;;;;;;;;;;;;AAaA,MAAa,4BAA4B;CACvC,MAAM,WACJ,OAAO,aAAa,cAAc,OAAO,iBAAiB,SAAS,eAAe;CAEpF,QAAQ,OAAe,kBAA0B,UAC/C,OAAO,UAAU,iBAAiB,KAAK,OAAO,CAAC,CAAC,KAAK,KAAK,kBAAkB,KAAK;AACrF"}

package/dist/toast-CjkURw0M.js

@@ -0,0 +1,184 @@
+import { cn } from "./classNames-BzrkDnOD.js";
+import { useArgoDesign } from "./context-KxxeMHbR.js";
+import { AlertCircle, AlertTriangle, CircleCheck, Info, Loader2, X } from "./icons-Cek151jC.js";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { toast } from "sonner";
+//#region src/components/Toast/ToastAction.tsx
+const ToastAction = ({ ref, className, ...rest }) => /* @__PURE__ */ jsx("button", {
+	...rest,
+	ref,
+	"data-slot": "toast-action",
+	type: "button",
+	className: cn("tw:col-start-3", "tw:row-start-1", "tw:flex", "tw:items-center", "tw:justify-center", "tw:text-xs", "tw:font-medium", "tw:text-primary", "tw:px-2", "tw:h-6", "tw:bg-primary-foreground", "tw:rounded", className)
+});
+//#endregion
+//#region src/components/Toast/ToastDescription.tsx
+const ToastDescription = ({ ref, className, children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-slot": "toast-description",
+	className: cn("tw:col-start-2", "tw:font-normal", "tw:break-words", "tw:text-white", "tw:group-data-[variant=default]/toast:text-muted-foreground", className),
+	...rest,
+	children
+});
+//#endregion
+//#region src/components/Toast/ToastDismiss.tsx
+const ToastDismiss = ({ ref, className, ...rest }) => /* @__PURE__ */ jsxs("button", {
+	ref,
+	"data-slot": "toast-dismiss",
+	className: cn("tw:flex", "tw:justify-center", "tw:col-start-4", "tw:row-start-1", "tailwindcss-preflight", "tw:[&_svg]:aspect-square", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-4", "tw:[&_svg]:m-1", "tw:text-white", "tw:group-data-[variant=default]/toast:[&_svg]:text-popover-foreground", "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:[&_svg]:text-foreground", className),
+	type: "button",
+	...rest,
+	children: [/* @__PURE__ */ jsx(X, {}), /* @__PURE__ */ jsx("span", {
+		className: "tw:sr-only",
+		children: "Dismiss"
+	})]
+});
+//#endregion
+//#region src/components/Toast/ToastDuration.tsx
+const ToastDuration = ({ ref, duration, className, style, ...rest }) => /* @__PURE__ */ jsx("span", {
+	...rest,
+	ref,
+	className: cn("tw:bg-white/30", "tw:group-data-[variant=default]/toast:bg-popover-foreground/20", "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:bg-foreground/20", "tw:rounded-bl-lg", "tw:mx-px", "tw:absolute", "tw:bottom-0", "tw:left-0", "tw:h-1", "tw:animate-toast-progress", "tw:group-hover/toast:[animation-play-state:paused]", className),
+	style: {
+		animationDuration: `${duration}ms`,
+		...style
+	}
+});
+//#endregion
+//#region src/components/Toast/ToastTitle.tsx
+const ToastTitle = ({ ref, className, children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-slot": "toast-title",
+	className: cn("tw:col-start-2", "tw:text-sm", "tw:leading-6", "tw:min-h-6", "tw:self-center", "tw:text-white", "tw:group-data-[variant=default]/toast:text-popover-foreground", "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:text-foreground", "tw:break-words", "tw:font-medium", className),
+	...rest,
+	children
+});
+//#endregion
+//#region src/components/Toast/ToastRoot.tsx
+const variants = cva([
+	"tailwindcss-preflight",
+	"tw:group/toast",
+	"tw:relative",
+	"tw:grid",
+	"tw:grid-cols-[0_1fr_auto_auto]",
+	"tw:items-start",
+	"tw:has-[[data-slot=toast-description]]:grid-rows-[auto_auto]",
+	"tw:has-[[data-slot=toast-icon]]:grid-cols-[auto_1fr_auto_auto]",
+	"tw:[&_[data-slot=toast-icon]]:mr-2",
+	"tw:[&_[data-slot=toast-title]]:mr-2.5",
+	"tw:[&_[data-slot=toast-description]]:mr-2.5",
+	"tw:[&_[data-slot=toast-action]]:mr-2",
+	"tw:[&_[data-slot=toast-description]]:col-end-3",
+	"tw:gap-y-0",
+	"tw:p-4",
+	"tw:rounded-lg",
+	"tw:shadow-md"
+], {
+	defaultVariants: { variant: "info" },
+	variants: { variant: {
+		default: "tw:border tw:border-border tw:bg-popover",
+		error: "tw:bg-error-550",
+		info: "tw:bg-blue-600",
+		success: "tw:bg-green-700",
+		warning: "tw:bg-warning-550"
+	} }
+});
+const DEFAULT_VARIANT_ICON = {
+	error: /* @__PURE__ */ jsx(AlertTriangle, {}),
+	info: /* @__PURE__ */ jsx(Info, {}),
+	success: /* @__PURE__ */ jsx(CircleCheck, {}),
+	warning: /* @__PURE__ */ jsx(AlertCircle, {})
+};
+const ToastRoot = ({ id, title, description, action, duration = Infinity, variant = "info", loading = false, icon: iconProp }) => {
+	const renderArgo = useArgoDesign();
+	const icon = (() => {
+		if (loading) return /* @__PURE__ */ jsx(Loader2, { className: "tw:animate-spin" });
+		if (iconProp) return iconProp;
+		if (variant === "default" || variant === null) return null;
+		return DEFAULT_VARIANT_ICON[variant];
+	})();
+	const handleActionClick = (event) => {
+		toast.dismiss(id);
+		action?.onClick(event);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		"data-variant": variant,
+		"data-argo": renderArgo,
+		className: cn(variants({ variant }), "tw:data-[variant=default]:data-[argo=true]:bg-background"),
+		children: [
+			icon && /* @__PURE__ */ jsx("span", {
+				"data-slot": "toast-icon",
+				className: cn("tw:inline-flex", "tw:items-center", "tw:justify-center", "tw:self-center", "tw:aspect-square", "tw:size-5", "tw:shrink-0", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-5", "tw:text-white", "tw:group-data-[variant=default]/toast:text-popover-foreground", "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:text-foreground"),
+				children: icon
+			}),
+			/* @__PURE__ */ jsx(ToastTitle, { children: title }),
+			description && /* @__PURE__ */ jsx(ToastDescription, { children: description }),
+			action && /* @__PURE__ */ jsx(ToastAction, {
+				style: action?.actionButtonStyle,
+				onClick: handleActionClick,
+				children: action.label
+			}),
+			/* @__PURE__ */ jsx(ToastDismiss, { onClick: () => toast.dismiss(id) }),
+			duration !== Infinity && /* @__PURE__ */ jsx(ToastDuration, { duration })
+		]
+	});
+};
+//#endregion
+//#region src/components/Toast/toast.tsx
+const toast$1 = ({ onAutoClose, onDismiss, testId, toasterId, dismissible = true, position, title: titleProp, ...toast$2 }) => {
+	const duration = (() => {
+		if (typeof toast$2.duration === "number") return toast$2.duration;
+		if (toast$2.variant === "error" || toast$2.variant === "warning") return Infinity;
+		return toast$2.duration ?? 5e3;
+	})();
+	const renderCustomToast = (id) => {
+		const title = typeof titleProp === "function" ? titleProp({ dismiss: () => toast.dismiss(id) }) : titleProp;
+		return /* @__PURE__ */ jsx(ToastRoot, {
+			...toast$2,
+			id,
+			title,
+			duration
+		});
+	};
+	return toast.custom(renderCustomToast, {
+		...toast$2.id != null ? { id: toast$2.id } : {},
+		unstyled: true,
+		position,
+		onAutoClose,
+		onDismiss,
+		testId,
+		toasterId,
+		dismissible,
+		duration,
+		className: cn("tw:rounded-lg", "tw:focus-visible:!ring-4", "tw:focus-visible:!ring-ring/50")
+	});
+};
+toast$1.success = (title, options) => toast$1({
+	...options,
+	title,
+	variant: "success"
+});
+toast$1.error = (title, options) => toast$1({
+	...options,
+	title,
+	variant: "error",
+	duration: options?.duration ?? Infinity
+});
+toast$1.warning = (title, options) => toast$1({
+	...options,
+	title,
+	variant: "warning",
+	duration: options?.duration ?? Infinity
+});
+toast$1.info = (title, options) => toast$1({
+	...options,
+	title,
+	variant: "info"
+});
+toast$1.dismiss = (toastId) => toast.dismiss(toastId);
+toast$1.dismissAll = () => toast.dismiss();
+//#endregion
+export { toast$1 as toast };
+
+//# sourceMappingURL=toast-CjkURw0M.js.map

package/dist/toast-CjkURw0M.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-CjkURw0M.js","names":["sonnerToast","toast","sonnerToast"],"sources":["../src/components/Toast/ToastAction.tsx","../src/components/Toast/ToastDescription.tsx","../src/components/Toast/ToastDismiss.tsx","../src/components/Toast/ToastDuration.tsx","../src/components/Toast/ToastTitle.tsx","../src/components/Toast/ToastRoot.tsx","../src/components/Toast/toast.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'>;\n\nexport const ToastAction = ({ ref, className, ...rest }: Props) => (\n  <button\n    {...rest}\n    ref={ref}\n    data-slot=\"toast-action\"\n    type=\"button\"\n    className={cn(\n      // layout\n      'tw:col-start-3',\n      'tw:row-start-1',\n      'tw:flex',\n      'tw:items-center',\n      'tw:justify-center',\n\n      // font\n      'tw:text-xs',\n      'tw:font-medium',\n      'tw:text-primary',\n\n      // sizing\n      'tw:px-2',\n      'tw:h-6',\n\n      // styles\n      'tw:bg-primary-foreground',\n      'tw:rounded',\n      className,\n    )}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const ToastDescription = ({ ref, className, children, ...rest }: Props) => (\n  <div\n    ref={ref}\n    data-slot=\"toast-description\"\n    className={cn(\n      'tw:col-start-2',\n      'tw:font-normal',\n      'tw:break-words',\n      'tw:text-white',\n      'tw:group-data-[variant=default]/toast:text-muted-foreground',\n      className,\n    )}\n    {...rest}\n  >\n    {children}\n  </div>\n);\n","import type { ComponentProps } from 'react';\n\nimport { X } from '../../icons';\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'>;\n\nexport const ToastDismiss = ({ ref, className, ...rest }: Props) => (\n  <button\n    ref={ref}\n    data-slot=\"toast-dismiss\"\n    className={cn(\n      'tw:flex',\n      'tw:justify-center',\n      'tw:col-start-4',\n      'tw:row-start-1',\n      'tailwindcss-preflight',\n      'tw:[&_svg]:aspect-square',\n      'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4',\n      'tw:[&_svg]:m-1',\n\n      'tw:text-white',\n      'tw:group-data-[variant=default]/toast:[&_svg]:text-popover-foreground',\n      'tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:[&_svg]:text-foreground',\n      className,\n    )}\n    type=\"button\"\n    {...rest}\n  >\n    <X />\n    <span className=\"tw:sr-only\">Dismiss</span>\n  </button>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype ToastDurationProps = ComponentProps<'span'> & {\n  duration: number;\n};\n\nexport const ToastDuration = ({ ref, duration, className, style, ...rest }: ToastDurationProps) => (\n  <span\n    {...rest}\n    ref={ref}\n    className={cn(\n      'tw:bg-white/30',\n      'tw:group-data-[variant=default]/toast:bg-popover-foreground/20',\n      'tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:bg-foreground/20',\n      'tw:rounded-bl-lg',\n      'tw:mx-px',\n\n      // positioning\n      'tw:absolute',\n      'tw:bottom-0',\n      'tw:left-0',\n\n      // sizing\n      'tw:h-1',\n\n      // animation\n      'tw:animate-toast-progress',\n      'tw:group-hover/toast:[animation-play-state:paused]',\n      className,\n    )}\n    style={{\n      animationDuration: `${duration}ms`,\n      ...style,\n    }}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const ToastTitle = ({ ref, className, children, ...rest }: Props) => (\n  <div\n    ref={ref}\n    data-slot=\"toast-title\"\n    className={cn(\n      'tw:col-start-2',\n      'tw:text-sm',\n      'tw:leading-6',\n      'tw:min-h-6',\n      'tw:self-center',\n      'tw:text-white',\n      'tw:group-data-[variant=default]/toast:text-popover-foreground',\n      'tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:text-foreground',\n\n      'tw:break-words',\n      'tw:font-medium',\n      className,\n    )}\n    {...rest}\n  >\n    {children}\n  </div>\n);\n","import type { MouseEventHandler, ReactNode } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\nimport { type Action, toast as sonnerToast } from 'sonner';\n\nimport { AlertCircle, AlertTriangle, CircleCheck, Info, Loader2 } from '../../icons';\nimport { cn } from '../../utils';\nimport { useArgoDesign } from '../ThemeProvider/context';\n\nimport { ToastAction } from './ToastAction';\nimport { ToastDescription } from './ToastDescription';\nimport { ToastDismiss } from './ToastDismiss';\nimport { ToastDuration } from './ToastDuration';\nimport { ToastTitle } from './ToastTitle';\n\nconst variants = cva(\n  [\n    'tailwindcss-preflight',\n    'tw:group/toast',\n    'tw:relative',\n\n    // layout\n    'tw:grid',\n    'tw:grid-cols-[0_1fr_auto_auto]',\n    'tw:items-start',\n    'tw:has-[[data-slot=toast-description]]:grid-rows-[auto_auto]',\n    'tw:has-[[data-slot=toast-icon]]:grid-cols-[auto_1fr_auto_auto]',\n    'tw:[&_[data-slot=toast-icon]]:mr-2',\n    'tw:[&_[data-slot=toast-title]]:mr-2.5',\n    'tw:[&_[data-slot=toast-description]]:mr-2.5',\n    'tw:[&_[data-slot=toast-action]]:mr-2',\n    'tw:[&_[data-slot=toast-description]]:col-end-3',\n    'tw:gap-y-0',\n\n    // styles\n    'tw:p-4',\n    'tw:rounded-lg',\n    'tw:shadow-md',\n  ],\n  {\n    defaultVariants: {\n      variant: 'info',\n    },\n    variants: {\n      variant: {\n        default: 'tw:border tw:border-border tw:bg-popover',\n        error: 'tw:bg-error-550',\n        info: 'tw:bg-blue-600',\n        success: 'tw:bg-green-700',\n        warning: 'tw:bg-warning-550',\n      },\n    },\n  },\n);\n\ntype Variants = VariantProps<typeof variants>;\ntype Variant = NonNullable<Variants['variant']>;\ntype VariantIcon = Exclude<Variant, 'default'>;\n\ntype Props = {\n  id: string | number;\n  title: ReactNode;\n  icon?: ReactNode;\n  description?: ReactNode;\n  action?: Action;\n  loading?: boolean;\n  duration?: number;\n  // offset?: number;\n} & Variants;\n\nconst DEFAULT_VARIANT_ICON: Record<VariantIcon, ReactNode> = {\n  error: <AlertTriangle />,\n  info: <Info />,\n  success: <CircleCheck />,\n  warning: <AlertCircle />,\n};\n\nexport const ToastRoot = ({\n  id,\n  title,\n  description,\n  action,\n  duration = Infinity,\n  variant = 'info',\n  loading = false,\n  icon: iconProp,\n}: Props) => {\n  const renderArgo = useArgoDesign();\n\n  const icon: ReactNode = (() => {\n    if (loading) return <Loader2 className=\"tw:animate-spin\" />;\n    if (iconProp) return iconProp;\n    if (variant === 'default' || variant === null) return null;\n    return DEFAULT_VARIANT_ICON[variant];\n  })();\n\n  const handleActionClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n    sonnerToast.dismiss(id);\n    action?.onClick(event);\n  };\n\n  return (\n    <div\n      data-variant={variant}\n      data-argo={renderArgo}\n      className={cn(\n        variants({ variant }),\n        'tw:data-[variant=default]:data-[argo=true]:bg-background',\n      )}\n    >\n      {icon && (\n        <span\n          data-slot=\"toast-icon\"\n          className={cn(\n            'tw:inline-flex',\n            'tw:items-center',\n            'tw:justify-center',\n            'tw:self-center',\n            'tw:aspect-square',\n            'tw:size-5',\n            'tw:shrink-0',\n            'tw:[&_svg:not([class*=\"tw:size-\"])]:size-5',\n            'tw:text-white',\n            'tw:group-data-[variant=default]/toast:text-popover-foreground',\n            'tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:text-foreground',\n          )}\n        >\n          {icon}\n        </span>\n      )}\n\n      <ToastTitle>{title}</ToastTitle>\n      {description && <ToastDescription>{description}</ToastDescription>}\n      {action && (\n        <ToastAction style={action?.actionButtonStyle} onClick={handleActionClick}>\n          {action.label}\n        </ToastAction>\n      )}\n      <ToastDismiss onClick={() => sonnerToast.dismiss(id)} />\n      {duration !== Infinity && <ToastDuration duration={duration} />}\n    </div>\n  );\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { type ExternalToast, toast as sonnerToast } from 'sonner';\n\nimport { cn } from '../../utils';\n\nimport { ToastRoot } from './ToastRoot';\n\ntype ToastProps = ComponentProps<typeof ToastRoot>;\ntype Title = ToastProps['title'] | ((opts: { dismiss: () => void }) => ReactNode);\n\nexport type ToastOptions = { id?: string | number; title: Title } & Omit<\n  ToastProps,\n  'id' | 'title'\n> &\n  Pick<\n    ExternalToast,\n    'onAutoClose' | 'onDismiss' | 'testId' | 'toasterId' | 'dismissible' | 'position'\n  >;\ntype DerivedToastOptions = Omit<ToastOptions, 'title' | 'variant'>;\n\nexport const toast = ({\n  onAutoClose,\n  onDismiss,\n  testId,\n  toasterId,\n  dismissible = true,\n  position,\n  title: titleProp,\n  ...toast\n}: ToastOptions) => {\n  const duration = (() => {\n    if (typeof toast.duration === 'number') return toast.duration;\n    if (toast.variant === 'error' || toast.variant === 'warning') return Infinity;\n    return toast.duration ?? 5000;\n  })();\n\n  const renderCustomToast: Parameters<typeof sonnerToast.custom>[0] = (id) => {\n    const title =\n      typeof titleProp === 'function'\n        ? titleProp({ dismiss: () => sonnerToast.dismiss(id) })\n        : titleProp;\n\n    return <ToastRoot {...toast} id={id} title={title} duration={duration} />;\n  };\n\n  return sonnerToast.custom(renderCustomToast, {\n    // toast generated by sonner will always have an id, but we want to allow users to specify their own id if they want to\n    // can not pass undefined, as it will break dismiss\n    ...(toast.id != null ? { id: toast.id } : {}),\n    unstyled: true,\n    position,\n    onAutoClose,\n    onDismiss,\n    testId,\n    toasterId,\n    dismissible,\n    duration,\n    // override default focus-visible styles to match our design\n    className: cn('tw:rounded-lg', 'tw:focus-visible:!ring-4', 'tw:focus-visible:!ring-ring/50'),\n  });\n};\n\ntoast.success = (title: Title, options?: DerivedToastOptions) =>\n  toast({\n    ...options,\n    title,\n    variant: 'success',\n  });\n\ntoast.error = (title: Title, options?: DerivedToastOptions) =>\n  toast({\n    ...options,\n    title,\n    variant: 'error',\n    duration: options?.duration ?? Infinity,\n  });\n\ntoast.warning = (title: Title, options?: DerivedToastOptions) =>\n  toast({\n    ...options,\n    title,\n    variant: 'warning',\n    duration: options?.duration ?? Infinity,\n  });\n\ntoast.info = (title: Title, options?: DerivedToastOptions) =>\n  toast({\n    ...options,\n    title,\n    variant: 'info',\n  });\n\ntoast.dismiss = (toastId?: ToastOptions['id']) => sonnerToast.dismiss(toastId);\ntoast.dismissAll = () => sonnerToast.dismiss();\n"],"mappings":";;;;;;;AAMA,MAAa,eAAe,EAAE,KAAK,WAAW,GAAG,WAC/C,oBAAC,UAAD;CACE,GAAI;CACC;CACL,aAAU;CACV,MAAK;CACL,WAAW,GAET,kBACA,kBACA,WACA,mBACA,qBAGA,cACA,kBACA,mBAGA,WACA,UAGA,4BACA,cACA,SACF;AACD,CAAA;;;AC5BH,MAAa,oBAAoB,EAAE,KAAK,WAAW,UAAU,GAAG,WAC9D,oBAAC,OAAD;CACO;CACL,aAAU;CACV,WAAW,GACT,kBACA,kBACA,kBACA,iBACA,+DACA,SACF;CACA,GAAI;CAEH;AACE,CAAA;;;ACdP,MAAa,gBAAgB,EAAE,KAAK,WAAW,GAAG,WAChD,qBAAC,UAAD;CACO;CACL,aAAU;CACV,WAAW,GACT,WACA,qBACA,kBACA,kBACA,yBACA,4BACA,gDACA,kBAEA,iBACA,yEACA,8FACA,SACF;CACA,MAAK;CACL,GAAI;CAnBN,UAAA,CAqBE,oBAAC,GAAD,CAAI,CAAA,GACJ,oBAAC,QAAD;EAAM,WAAU;EAAa,UAAA;CAAa,CAAA,CACpC;;;;ACvBV,MAAa,iBAAiB,EAAE,KAAK,UAAU,WAAW,OAAO,GAAG,WAClE,oBAAC,QAAD;CACE,GAAI;CACC;CACL,WAAW,GACT,kBACA,kEACA,uFACA,oBACA,YAGA,eACA,eACA,aAGA,UAGA,6BACA,sDACA,SACF;CACA,OAAO;EACL,mBAAmB,GAAG,SAAS;EAC/B,GAAG;CACL;AACD,CAAA;;;AC9BH,MAAa,cAAc,EAAE,KAAK,WAAW,UAAU,GAAG,WACxD,oBAAC,OAAD;CACO;CACL,aAAU;CACV,WAAW,GACT,kBACA,cACA,gBACA,cACA,kBACA,iBACA,iEACA,sFAEA,kBACA,kBACA,SACF;CACA,GAAI;CAEH;AACE,CAAA;;;ACZP,MAAM,WAAW,IACf;CACE;CACA;CACA;CAGA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAGA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EACf,SAAS,OACX;CACA,UAAU,EACR,SAAS;EACP,SAAS;EACT,OAAO;EACP,MAAM;EACN,SAAS;EACT,SAAS;CACX,EACF;AACF,CACF;AAiBA,MAAM,uBAAuD;CAC3D,OAAO,oBAAC,eAAD,CAAgB,CAAA;CACvB,MAAM,oBAAC,MAAD,CAAO,CAAA;CACb,SAAS,oBAAC,aAAD,CAAc,CAAA;CACvB,SAAS,oBAAC,aAAD,CAAc,CAAA;AACzB;AAEA,MAAa,aAAa,EACxB,IACA,OACA,aACA,QACA,WAAW,UACX,UAAU,QACV,UAAU,OACV,MAAM,eACK;CACX,MAAM,aAAa,cAAc;CAEjC,MAAM,cAAyB;EAC7B,IAAI,SAAS,OAAO,oBAAC,SAAD,EAAS,WAAU,kBAAmB,CAAA;EAC1D,IAAI,UAAU,OAAO;EACrB,IAAI,YAAY,aAAa,YAAY,MAAM,OAAO;EACtD,OAAO,qBAAqB;CAC9B,EAAA,CAAG;CAEH,MAAM,qBAA2D,UAAU;EACzE,MAAY,QAAQ,EAAE;EACtB,QAAQ,QAAQ,KAAK;CACvB;CAEA,OACE,qBAAC,OAAD;EACE,gBAAc;EACd,aAAW;EACX,WAAW,GACT,SAAS,EAAE,QAAQ,CAAC,GACpB,0DACF;EANF,UAAA;GAQG,QACC,oBAAC,QAAD;IACE,aAAU;IACV,WAAW,GACT,kBACA,mBACA,qBACA,kBACA,oBACA,aACA,eACA,gDACA,iBACA,iEACA,oFACF;IAEC,UAAA;GACG,CAAA;GAGR,oBAAC,YAAD,EAAA,UAAa,MAAkB,CAAA;GAC9B,eAAe,oBAAC,kBAAD,EAAA,UAAmB,YAA8B,CAAA;GAChE,UACC,oBAAC,aAAD;IAAa,OAAO,QAAQ;IAAmB,SAAS;IACrD,UAAA,OAAO;GACG,CAAA;GAEf,oBAAC,cAAD,EAAc,eAAeA,MAAY,QAAQ,EAAE,EAAI,CAAA;GACtD,aAAa,YAAY,oBAAC,eAAD,EAAyB,SAAW,CAAA;EAC3D;;AAET;;;AC1HA,MAAaC,WAAS,EACpB,aACA,WACA,QACA,WACA,cAAc,MACd,UACA,OAAO,WACP,GAAGA,cACe;CAClB,MAAM,kBAAkB;EACtB,IAAI,OAAOA,QAAM,aAAa,UAAU,OAAOA,QAAM;EACrD,IAAIA,QAAM,YAAY,WAAWA,QAAM,YAAY,WAAW,OAAO;EACrE,OAAOA,QAAM,YAAY;CAC3B,EAAA,CAAG;CAEH,MAAM,qBAA+D,OAAO;EAC1E,MAAM,QACJ,OAAO,cAAc,aACjB,UAAU,EAAE,eAAeC,MAAY,QAAQ,EAAE,EAAE,CAAC,IACpD;EAEN,OAAO,oBAAC,WAAD;GAAW,GAAID;GAAW;GAAW;GAAiB;EAAW,CAAA;CAC1E;CAEA,OAAOC,MAAY,OAAO,mBAAmB;EAG3C,GAAID,QAAM,MAAM,OAAO,EAAE,IAAIA,QAAM,GAAG,IAAI,CAAC;EAC3C,UAAU;EACV;EACA;EACA;EACA;EACA;EACA;EACA;EAEA,WAAW,GAAG,iBAAiB,4BAA4B,gCAAgC;CAC7F,CAAC;AACH;AAEA,QAAM,WAAW,OAAc,YAC7BA,QAAM;CACJ,GAAG;CACH;CACA,SAAS;AACX,CAAC;AAEH,QAAM,SAAS,OAAc,YAC3BA,QAAM;CACJ,GAAG;CACH;CACA,SAAS;CACT,UAAU,SAAS,YAAY;AACjC,CAAC;AAEH,QAAM,WAAW,OAAc,YAC7BA,QAAM;CACJ,GAAG;CACH;CACA,SAAS;CACT,UAAU,SAAS,YAAY;AACjC,CAAC;AAEH,QAAM,QAAQ,OAAc,YAC1BA,QAAM;CACJ,GAAG;CACH;CACA,SAAS;AACX,CAAC;AAEH,QAAM,WAAW,YAAiCC,MAAY,QAAQ,OAAO;AAC7E,QAAM,mBAAmBA,MAAY,QAAQ"}