@keboola/design 10.1.0 → 11.0.1

package/dist/internal/blocks/AIKit.js

@@ -0,0 +1,2 @@
+import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing } from "../../AIKit-Dre37SJr.js";
+export { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing };

package/dist/internal/blocks/AppShell.js

@@ -0,0 +1,2 @@
+import { AppShell } from "../../AppShell-B5GQN6Zs.js";
+export { AppShell };

package/dist/internal/blocks/AutoSaveTextarea.js

@@ -0,0 +1,2 @@
+import { AutoSaveTextarea } from "../../AutoSaveTextarea-BeuWuszr.js";
+export { AutoSaveTextarea };

package/dist/internal/blocks/BrandEditor.js

@@ -0,0 +1,2 @@
+import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "../../BrandEditor-B8o9zdZO.js";
+export { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel };

package/dist/internal/blocks/ChartPanel.js

@@ -0,0 +1,46 @@
+import { cn } from "../../classNames-BzrkDnOD.js";
+import { Card } from "../../Card-BAoZ35CV.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/blocks/ChartPanel/ChartPanel.tsx
+/**
+* Signature chart panel — a `Card` shell with a title/description header, an optional toolbar,
+* a chart body, and an optional footer. Pass a `@keboola/design/charts` chart (`LineChart`,
+* `BarChart`, `AreaChart`, `PieChart`) as children; the panel owns the chrome, the chart owns
+* its own responsive container and themed palette.
+*
+* **When to use:** any framed data-viz block on a dashboard.
+* **When NOT to use:** for a KPI number use `StatCard`; for a raw unframed chart drop the chart
+* component directly. Charts follow the active brand's chart palette — never hardcode colours.
+*/
+const ChartPanel = ({ title, description, titleAs = "h3", toolbar, footer, className, bordered = true, children, ...rest }) => /* @__PURE__ */ jsxs(Card, {
+	bordered,
+	className: cn("tw:gap-4", className),
+	...rest,
+	children: [
+		/* @__PURE__ */ jsxs(Card.Header, {
+			className: "tw:flex tw:items-start tw:justify-between tw:gap-4",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "tw:flex tw:flex-col tw:gap-1",
+				children: [/* @__PURE__ */ jsx(Card.Title, {
+					as: titleAs,
+					children: title
+				}), description ? /* @__PURE__ */ jsx("p", {
+					className: "tw:m-0 tw:text-sm tw:text-muted-foreground",
+					children: description
+				}) : null]
+			}), toolbar ? /* @__PURE__ */ jsx("div", {
+				className: "tw:flex tw:shrink-0 tw:items-center tw:gap-2",
+				children: toolbar
+			}) : null]
+		}),
+		/* @__PURE__ */ jsx(Card.Content, { children }),
+		footer ? /* @__PURE__ */ jsx("div", {
+			className: "tw:border-0 tw:border-t tw:border-solid tw:border-border tw:pt-3 tw:text-sm tw:text-muted-foreground",
+			children: footer
+		}) : null
+	]
+});
+//#endregion
+export { ChartPanel };
+
+//# sourceMappingURL=ChartPanel.js.map

package/dist/internal/blocks/ChartPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartPanel.js","names":[],"sources":["../../../src/blocks/ChartPanel/ChartPanel.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport { Card } from '../../components/Card';\nimport { cn } from '../../utils';\n\ntype RootProps = Omit<ComponentProps<typeof Card>, 'title'> & {\n  /** Panel heading. */\n  title: ReactNode;\n  /** Optional supporting line under the title. */\n  description?: ReactNode;\n  /** Heading level for the title — defaults to `h3`. Set to sit correctly under a page `h1`/`h2`. */\n  titleAs?: ComponentProps<typeof Card.Title>['as'];\n  /** Right-aligned header slot — range picker, legend toggle, menu, etc. */\n  toolbar?: ReactNode;\n  /** Optional footer row (e.g. a source note or an inline legend). */\n  footer?: ReactNode;\n};\n\n/**\n * Signature chart panel — a `Card` shell with a title/description header, an optional toolbar,\n * a chart body, and an optional footer. Pass a `@keboola/design/charts` chart (`LineChart`,\n * `BarChart`, `AreaChart`, `PieChart`) as children; the panel owns the chrome, the chart owns\n * its own responsive container and themed palette.\n *\n * **When to use:** any framed data-viz block on a dashboard.\n * **When NOT to use:** for a KPI number use `StatCard`; for a raw unframed chart drop the chart\n * component directly. Charts follow the active brand's chart palette — never hardcode colours.\n */\nexport const ChartPanel = ({\n  title,\n  description,\n  titleAs = 'h3',\n  toolbar,\n  footer,\n  className,\n  bordered = true,\n  children,\n  ...rest\n}: RootProps) => (\n  <Card bordered={bordered} className={cn('tw:gap-4', className)} {...rest}>\n    <Card.Header className=\"tw:flex tw:items-start tw:justify-between tw:gap-4\">\n      <div className=\"tw:flex tw:flex-col tw:gap-1\">\n        <Card.Title as={titleAs}>{title}</Card.Title>\n        {description ? (\n          <p className=\"tw:m-0 tw:text-sm tw:text-muted-foreground\">{description}</p>\n        ) : null}\n      </div>\n      {toolbar ? (\n        <div className=\"tw:flex tw:shrink-0 tw:items-center tw:gap-2\">{toolbar}</div>\n      ) : null}\n    </Card.Header>\n    <Card.Content>{children}</Card.Content>\n    {footer ? (\n      <div className=\"tw:border-0 tw:border-t tw:border-solid tw:border-border tw:pt-3 tw:text-sm tw:text-muted-foreground\">\n        {footer}\n      </div>\n    ) : null}\n  </Card>\n);\n\nexport type { RootProps as ChartPanelProps };\n"],"mappings":";;;;;;;;;;;;;;AA4BA,MAAa,cAAc,EACzB,OACA,aACA,UAAU,MACV,SACA,QACA,WACA,WAAW,MACX,UACA,GAAG,WAEH,qBAAC,MAAD;CAAgB;CAAU,WAAW,GAAG,YAAY,SAAS;CAAG,GAAI;CAApE,UAAA;EACE,qBAAC,KAAK,QAAN;GAAa,WAAU;GAAvB,UAAA,CACE,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,oBAAC,KAAK,OAAN;KAAY,IAAI;KAAU,UAAA;IAAkB,CAAA,GAC3C,cACC,oBAAC,KAAD;KAAG,WAAU;KAA8C,UAAA;IAAe,CAAA,IACxE,IACD;GACJ,CAAA,GAAA,UACC,oBAAC,OAAD;IAAK,WAAU;IAAgD,UAAA;GAAa,CAAA,IAC1E,IACO;;EACb,oBAAC,KAAK,SAAN,EAAe,SAAuB,CAAA;EACrC,SACC,oBAAC,OAAD;GAAK,WAAU;GACZ,UAAA;EACE,CAAA,IACH;CACA"}

package/dist/internal/blocks/ClipboardButton.js

@@ -0,0 +1,2 @@
+import { ClipboardButton, ClipboardInline } from "../../ClipboardButton-ez5V3fkk.js";
+export { ClipboardButton, ClipboardInline };

package/dist/internal/blocks/ColorInput.js

@@ -0,0 +1,2 @@
+import { ColorInput } from "../../ColorInput-Dx8Dsv7Y.js";
+export { ColorInput };

package/dist/internal/blocks/ColorModeSwitch.js

@@ -0,0 +1,2 @@
+import { ColorModeSwitch } from "../../ColorModeSwitch-CCqj7tjE.js";
+export { ColorModeSwitch };

package/dist/internal/blocks/Command.js

@@ -0,0 +1,2 @@
+import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "../../Command-CQ_bQsJp.js";
+export { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState };

package/dist/internal/blocks/CopyField.js

@@ -0,0 +1,2 @@
+import { CopyField } from "../../CopyField-BJ96zvXs.js";
+export { CopyField };

package/dist/internal/blocks/DashboardHero.js

@@ -0,0 +1,59 @@
+import { cn } from "../../classNames-BzrkDnOD.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/blocks/DashboardHero/DashboardHero.tsx
+/**
+* Signature dashboard hero banner — the opinionated top-of-page welcome/summary surface
+* (daily-brief header, project overview, greeting + primary CTA).
+*
+* **When to use:** the first block on a landing or dashboard page, above the KPI strip and
+* chart panels. It sets tone with an eyebrow, a large title, a lead paragraph, and an actions row.
+* **When NOT to use:** for an in-app page title use `PageHeader.Index`; for an empty page use
+* `EmptyState`. **Composition:** `DashboardHero.Eyebrow`, `.Title`, `.Description`, `.Actions`,
+* and an optional `.Aside` that floats to the right on wide screens. Reads semantic tokens only.
+*/
+const DashboardHeroRoot = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("section", {
+	className: cn("tw:flex tw:flex-col tw:gap-6 tw:rounded-lg tw:border tw:border-solid tw:border-border tw:bg-card tw:p-8 tw:text-card-foreground", "tw:md:flex-row tw:md:items-center tw:md:justify-between", className),
+	...rest,
+	children
+});
+const DashboardHeroBody = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	className: cn("tw:flex tw:flex-col tw:gap-3", className),
+	...rest,
+	children
+});
+const DashboardHeroEyebrow = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("p", {
+	className: cn("tw:m-0 tw:text-sm tw:font-semibold tw:uppercase tw:tracking-wide tw:text-primary", className),
+	...rest,
+	children
+});
+const DashboardHeroTitle = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("h1", {
+	className: cn("tw:m-0 tw:text-3xl tw:font-semibold tw:leading-tight tw:tracking-tight tw:text-foreground", className),
+	...rest,
+	children
+});
+const DashboardHeroDescription = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("p", {
+	className: cn("tw:m-0 tw:max-w-prose tw:text-base tw:text-muted-foreground", className),
+	...rest,
+	children
+});
+const DashboardHeroActions = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	className: cn("tw:mt-2 tw:flex tw:flex-wrap tw:items-center tw:gap-3", className),
+	...rest,
+	children
+});
+const DashboardHeroAside = ({ className, children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	className: cn("tw:flex tw:shrink-0 tw:flex-col tw:gap-2", className),
+	...rest,
+	children
+});
+const DashboardHero = DashboardHeroRoot;
+DashboardHero.Body = DashboardHeroBody;
+DashboardHero.Eyebrow = DashboardHeroEyebrow;
+DashboardHero.Title = DashboardHeroTitle;
+DashboardHero.Description = DashboardHeroDescription;
+DashboardHero.Actions = DashboardHeroActions;
+DashboardHero.Aside = DashboardHeroAside;
+//#endregion
+export { DashboardHero };
+
+//# sourceMappingURL=DashboardHero.js.map

package/dist/internal/blocks/DashboardHero.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardHero.js","names":[],"sources":["../../../src/blocks/DashboardHero/DashboardHero.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype RootProps = ComponentProps<'section'>;\n\n/**\n * Signature dashboard hero banner — the opinionated top-of-page welcome/summary surface\n * (daily-brief header, project overview, greeting + primary CTA).\n *\n * **When to use:** the first block on a landing or dashboard page, above the KPI strip and\n * chart panels. It sets tone with an eyebrow, a large title, a lead paragraph, and an actions row.\n * **When NOT to use:** for an in-app page title use `PageHeader.Index`; for an empty page use\n * `EmptyState`. **Composition:** `DashboardHero.Eyebrow`, `.Title`, `.Description`, `.Actions`,\n * and an optional `.Aside` that floats to the right on wide screens. Reads semantic tokens only.\n */\nconst DashboardHeroRoot = ({ className, children, ...rest }: RootProps) => (\n  <section\n    className={cn(\n      'tw:flex tw:flex-col tw:gap-6 tw:rounded-lg tw:border tw:border-solid tw:border-border tw:bg-card tw:p-8 tw:text-card-foreground',\n      'tw:md:flex-row tw:md:items-center tw:md:justify-between',\n      className,\n    )}\n    {...rest}\n  >\n    {children}\n  </section>\n);\n\ntype BodyProps = ComponentProps<'div'>;\n\nconst DashboardHeroBody = ({ className, children, ...rest }: BodyProps) => (\n  <div className={cn('tw:flex tw:flex-col tw:gap-3', className)} {...rest}>\n    {children}\n  </div>\n);\n\ntype EyebrowProps = ComponentProps<'p'>;\n\nconst DashboardHeroEyebrow = ({ className, children, ...rest }: EyebrowProps) => (\n  <p\n    className={cn(\n      'tw:m-0 tw:text-sm tw:font-semibold tw:uppercase tw:tracking-wide tw:text-primary',\n      className,\n    )}\n    {...rest}\n  >\n    {children}\n  </p>\n);\n\ntype TitleProps = ComponentProps<'h1'>;\n\nconst DashboardHeroTitle = ({ className, children, ...rest }: TitleProps) => (\n  <h1\n    className={cn(\n      'tw:m-0 tw:text-3xl tw:font-semibold tw:leading-tight tw:tracking-tight tw:text-foreground',\n      className,\n    )}\n    {...rest}\n  >\n    {children}\n  </h1>\n);\n\ntype DescriptionProps = ComponentProps<'p'>;\n\nconst DashboardHeroDescription = ({ className, children, ...rest }: DescriptionProps) => (\n  <p\n    className={cn('tw:m-0 tw:max-w-prose tw:text-base tw:text-muted-foreground', className)}\n    {...rest}\n  >\n    {children}\n  </p>\n);\n\ntype ActionsProps = ComponentProps<'div'>;\n\nconst DashboardHeroActions = ({ className, children, ...rest }: ActionsProps) => (\n  <div className={cn('tw:mt-2 tw:flex tw:flex-wrap tw:items-center tw:gap-3', className)} {...rest}>\n    {children}\n  </div>\n);\n\ntype AsideProps = ComponentProps<'div'>;\n\nconst DashboardHeroAside = ({ className, children, ...rest }: AsideProps) => (\n  <div className={cn('tw:flex tw:shrink-0 tw:flex-col tw:gap-2', className)} {...rest}>\n    {children}\n  </div>\n);\n\nexport const DashboardHero = DashboardHeroRoot as typeof DashboardHeroRoot & {\n  Body: typeof DashboardHeroBody;\n  Eyebrow: typeof DashboardHeroEyebrow;\n  Title: typeof DashboardHeroTitle;\n  Description: typeof DashboardHeroDescription;\n  Actions: typeof DashboardHeroActions;\n  Aside: typeof DashboardHeroAside;\n};\n\nDashboardHero.Body = DashboardHeroBody;\nDashboardHero.Eyebrow = DashboardHeroEyebrow;\nDashboardHero.Title = DashboardHeroTitle;\nDashboardHero.Description = DashboardHeroDescription;\nDashboardHero.Actions = DashboardHeroActions;\nDashboardHero.Aside = DashboardHeroAside;\n\nexport type { RootProps as DashboardHeroProps };\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,qBAAqB,EAAE,WAAW,UAAU,GAAG,WACnD,oBAAC,WAAD;CACE,WAAW,GACT,mIACA,2DACA,SACF;CACA,GAAI;CAEH;AACM,CAAA;AAKX,MAAM,qBAAqB,EAAE,WAAW,UAAU,GAAG,WACnD,oBAAC,OAAD;CAAK,WAAW,GAAG,gCAAgC,SAAS;CAAG,GAAI;CAChE;AACE,CAAA;AAKP,MAAM,wBAAwB,EAAE,WAAW,UAAU,GAAG,WACtD,oBAAC,KAAD;CACE,WAAW,GACT,oFACA,SACF;CACA,GAAI;CAEH;AACA,CAAA;AAKL,MAAM,sBAAsB,EAAE,WAAW,UAAU,GAAG,WACpD,oBAAC,MAAD;CACE,WAAW,GACT,6FACA,SACF;CACA,GAAI;CAEH;AACC,CAAA;AAKN,MAAM,4BAA4B,EAAE,WAAW,UAAU,GAAG,WAC1D,oBAAC,KAAD;CACE,WAAW,GAAG,+DAA+D,SAAS;CACtF,GAAI;CAEH;AACA,CAAA;AAKL,MAAM,wBAAwB,EAAE,WAAW,UAAU,GAAG,WACtD,oBAAC,OAAD;CAAK,WAAW,GAAG,yDAAyD,SAAS;CAAG,GAAI;CACzF;AACE,CAAA;AAKP,MAAM,sBAAsB,EAAE,WAAW,UAAU,GAAG,WACpD,oBAAC,OAAD;CAAK,WAAW,GAAG,4CAA4C,SAAS;CAAG,GAAI;CAC5E;AACE,CAAA;AAGP,MAAa,gBAAgB;AAS7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,UAAU;AACxB,cAAc,QAAQ"}

package/dist/internal/blocks/DateInput.js

@@ -0,0 +1,2 @@
+import { DateInput } from "../../DateInput-CMD3dY-T.js";
+export { DateInput };

package/dist/internal/blocks/DateRangeInput.js

@@ -0,0 +1,2 @@
+import { DateRangeInput } from "../../DateRangeInput-D3BhiKyk.js";
+export { DateRangeInput };

package/dist/internal/blocks/EmptyConfigurationActionCard.js

@@ -0,0 +1,16 @@
+import { Card } from "../../Card-BAoZ35CV.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/blocks/EmptyConfigurationActionCard/EmptyConfigurationActionCard.tsx
+const EmptyConfigurationActionCard = ({ title, children, className }) => {
+	return /* @__PURE__ */ jsxs(Card, {
+		className,
+		children: [/* @__PURE__ */ jsx(Card.Header, { children: /* @__PURE__ */ jsx(Card.Title, { children: title }) }), /* @__PURE__ */ jsx(Card.Content, {
+			className: "tw:flex tw:flex-col tw:items-center",
+			children
+		})]
+	});
+};
+//#endregion
+export { EmptyConfigurationActionCard };
+
+//# sourceMappingURL=EmptyConfigurationActionCard.js.map

package/dist/internal/blocks/EmptyConfigurationActionCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyConfigurationActionCard.js","names":[],"sources":["../../../src/blocks/EmptyConfigurationActionCard/EmptyConfigurationActionCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Card } from '../../components/Card';\n\ntype Props = {\n  title: string;\n  children: ReactNode;\n  className?: string;\n};\n\nexport const EmptyConfigurationActionCard = ({ title, children, className }: Props) => {\n  return (\n    <Card className={className}>\n      <Card.Header>\n        <Card.Title>{title}</Card.Title>\n      </Card.Header>\n      <Card.Content className=\"tw:flex tw:flex-col tw:items-center\">{children}</Card.Content>\n    </Card>\n  );\n};\n"],"mappings":";;;AAUA,MAAa,gCAAgC,EAAE,OAAO,UAAU,gBAAuB;CACrF,OACE,qBAAC,MAAD;EAAiB;EAAjB,UAAA,CACE,oBAAC,KAAK,QAAN,EAAA,UACE,oBAAC,KAAK,OAAN,EAAA,UAAa,MAAkB,CAAA,EACpB,CAAA,GACb,oBAAC,KAAK,SAAN;GAAc,WAAU;GAAuC;EAAuB,CAAA,CAClF;;AAEV"}

package/dist/internal/blocks/EmptyState.js

@@ -0,0 +1,142 @@
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+//#region src/blocks/EmptyState/EmptyState.tsx
+const emptyStateClassnames = cva([
+	"tw:flex",
+	"tw:flex-col",
+	"tw:items-center",
+	"tw:text-center"
+], {
+	variants: { variant: {
+		default: [
+			"tw:py-16",
+			"tw:px-8",
+			"tw:gap-4"
+		],
+		compact: [
+			"tw:py-8",
+			"tw:px-4",
+			"tw:gap-2"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const emptyStateIconClassnames = cva([
+	"tw:flex",
+	"tw:items-center",
+	"tw:justify-center",
+	"tw:text-muted-foreground"
+], {
+	variants: { variant: {
+		default: [
+			"tw:size-16",
+			"tw:text-4xl",
+			"tw:[&_svg:not([class*=\"tw:size-\"])]:size-10"
+		],
+		compact: [
+			"tw:size-10",
+			"tw:text-2xl",
+			"tw:[&_svg:not([class*=\"tw:size-\"])]:size-6"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const emptyStateTitleClassnames = cva([
+	"tw:m-0",
+	"tw:font-semibold",
+	"tw:text-foreground"
+], {
+	variants: { variant: {
+		default: ["tw:text-lg", "tw:leading-7"],
+		compact: ["tw:text-base", "tw:leading-6"]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const emptyStateDescriptionClassnames = cva(["tw:m-0", "tw:text-muted-foreground"], {
+	variants: { variant: {
+		default: [
+			"tw:text-sm",
+			"tw:leading-5",
+			"tw:max-w-sm"
+		],
+		compact: [
+			"tw:text-xs",
+			"tw:leading-4",
+			"tw:max-w-xs"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const emptyStateActionsClassnames = cva([
+	"tw:flex",
+	"tw:items-center",
+	"tw:flex-wrap"
+], {
+	variants: { variant: {
+		default: ["tw:gap-3", "tw:mt-2"],
+		compact: ["tw:gap-2", "tw:mt-1"]
+	} },
+	defaultVariants: { variant: "default" }
+});
+/**
+* Friendly "nothing here yet" placeholder with icon, title, description, and actions slots.
+*
+* **When to use:** the user reached a page or surface that is intentionally empty (no items created
+* yet, an empty list after filtering, an empty inbox). The goal is to guide the user to the next action.
+* **When NOT to use:** for an error or failure state use `ErrorState`; for inline loading placeholders
+* use `Skeleton`; for "no matches found after search" inside a search/combobox use `EmptySearchContent`.
+* **Composition:** nest `EmptyState.Icon`, `EmptyState.Title`, `EmptyState.Description`, and
+* `EmptyState.Actions` (with one or two `Button`s). Use `variant="compact"` inside a `Card`.
+*
+* @see RECIPES.md#card-with-empty-state — for the empty-card pattern
+*/
+const EmptyStateRoot = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	role: "status",
+	className: emptyStateClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const EmptyStateIcon = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	className: emptyStateIconClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const EmptyStateTitle = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("h3", {
+	className: emptyStateTitleClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const EmptyStateDescription = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("p", {
+	className: emptyStateDescriptionClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const EmptyStateActions = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	className: emptyStateActionsClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const EmptyState = EmptyStateRoot;
+EmptyState.Icon = EmptyStateIcon;
+EmptyState.Title = EmptyStateTitle;
+EmptyState.Description = EmptyStateDescription;
+EmptyState.Actions = EmptyStateActions;
+//#endregion
+export { EmptyState };
+
+//# sourceMappingURL=EmptyState.js.map

package/dist/internal/blocks/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","names":[],"sources":["../../../src/blocks/EmptyState/EmptyState.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nconst emptyStateClassnames = cva(['tw:flex', 'tw:flex-col', 'tw:items-center', 'tw:text-center'], {\n  variants: {\n    variant: {\n      default: ['tw:py-16', 'tw:px-8', 'tw:gap-4'],\n      compact: ['tw:py-8', 'tw:px-4', 'tw:gap-2'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst emptyStateIconClassnames = cva(\n  ['tw:flex', 'tw:items-center', 'tw:justify-center', 'tw:text-muted-foreground'],\n  {\n    variants: {\n      variant: {\n        default: ['tw:size-16', 'tw:text-4xl', 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-10'],\n        compact: ['tw:size-10', 'tw:text-2xl', 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-6'],\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nconst emptyStateTitleClassnames = cva(['tw:m-0', 'tw:font-semibold', 'tw:text-foreground'], {\n  variants: {\n    variant: {\n      default: ['tw:text-lg', 'tw:leading-7'],\n      compact: ['tw:text-base', 'tw:leading-6'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst emptyStateDescriptionClassnames = cva(['tw:m-0', 'tw:text-muted-foreground'], {\n  variants: {\n    variant: {\n      default: ['tw:text-sm', 'tw:leading-5', 'tw:max-w-sm'],\n      compact: ['tw:text-xs', 'tw:leading-4', 'tw:max-w-xs'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst emptyStateActionsClassnames = cva(['tw:flex', 'tw:items-center', 'tw:flex-wrap'], {\n  variants: {\n    variant: {\n      default: ['tw:gap-3', 'tw:mt-2'],\n      compact: ['tw:gap-2', 'tw:mt-1'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\ntype Variant = VariantProps<typeof emptyStateClassnames>['variant'];\n\n/**\n * Props for `EmptyState`. `variant` chooses spacing — `\"default\"` for full-page empty states,\n * `\"compact\"` for inside cards / small surfaces.\n */\ntype RootProps = ComponentProps<'div'> &\n  VariantProps<typeof emptyStateClassnames> & {\n    variant?: Variant;\n  };\n\n/**\n * Friendly \"nothing here yet\" placeholder with icon, title, description, and actions slots.\n *\n * **When to use:** the user reached a page or surface that is intentionally empty (no items created\n * yet, an empty list after filtering, an empty inbox). The goal is to guide the user to the next action.\n * **When NOT to use:** for an error or failure state use `ErrorState`; for inline loading placeholders\n * use `Skeleton`; for \"no matches found after search\" inside a search/combobox use `EmptySearchContent`.\n * **Composition:** nest `EmptyState.Icon`, `EmptyState.Title`, `EmptyState.Description`, and\n * `EmptyState.Actions` (with one or two `Button`s). Use `variant=\"compact\"` inside a `Card`.\n *\n * @see RECIPES.md#card-with-empty-state — for the empty-card pattern\n */\nconst EmptyStateRoot = ({ className, variant = 'default', children, ...rest }: RootProps) => (\n  <div role=\"status\" className={emptyStateClassnames({ className, variant })} {...rest}>\n    {children}\n  </div>\n);\n\ntype SlotProps = ComponentProps<'div'> & { variant?: Variant };\n\nconst EmptyStateIcon = ({ className, variant = 'default', children, ...rest }: SlotProps) => (\n  <div className={emptyStateIconClassnames({ className, variant })} {...rest}>\n    {children}\n  </div>\n);\n\ntype TitleProps = ComponentProps<'h3'> & { variant?: Variant };\n\nconst EmptyStateTitle = ({ className, variant = 'default', children, ...rest }: TitleProps) => (\n  <h3 className={emptyStateTitleClassnames({ className, variant })} {...rest}>\n    {children}\n  </h3>\n);\n\ntype DescriptionProps = ComponentProps<'p'> & { variant?: Variant };\n\nconst EmptyStateDescription = ({\n  className,\n  variant = 'default',\n  children,\n  ...rest\n}: DescriptionProps) => (\n  <p className={emptyStateDescriptionClassnames({ className, variant })} {...rest}>\n    {children}\n  </p>\n);\n\ntype ActionsProps = ComponentProps<'div'> & { variant?: Variant };\n\nconst EmptyStateActions = ({ className, variant = 'default', children, ...rest }: ActionsProps) => (\n  <div className={emptyStateActionsClassnames({ className, variant })} {...rest}>\n    {children}\n  </div>\n);\n\nexport const EmptyState = EmptyStateRoot as typeof EmptyStateRoot & {\n  Icon: typeof EmptyStateIcon;\n  Title: typeof EmptyStateTitle;\n  Description: typeof EmptyStateDescription;\n  Actions: typeof EmptyStateActions;\n};\n\nEmptyState.Icon = EmptyStateIcon;\nEmptyState.Title = EmptyStateTitle;\nEmptyState.Description = EmptyStateDescription;\nEmptyState.Actions = EmptyStateActions;\n\nexport type { RootProps as EmptyStateProps, Variant as EmptyStateVariant };\n"],"mappings":";;;AAIA,MAAM,uBAAuB,IAAI;CAAC;CAAW;CAAe;CAAmB;AAAgB,GAAG;CAChG,UAAU,EACR,SAAS;EACP,SAAS;GAAC;GAAY;GAAW;EAAU;EAC3C,SAAS;GAAC;GAAW;GAAW;EAAU;CAC5C,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,2BAA2B,IAC/B;CAAC;CAAW;CAAmB;CAAqB;AAA0B,GAC9E;CACE,UAAU,EACR,SAAS;EACP,SAAS;GAAC;GAAc;GAAe;EAA6C;EACpF,SAAS;GAAC;GAAc;GAAe;EAA4C;CACrF,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAEA,MAAM,4BAA4B,IAAI;CAAC;CAAU;CAAoB;AAAoB,GAAG;CAC1F,UAAU,EACR,SAAS;EACP,SAAS,CAAC,cAAc,cAAc;EACtC,SAAS,CAAC,gBAAgB,cAAc;CAC1C,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,kCAAkC,IAAI,CAAC,UAAU,0BAA0B,GAAG;CAClF,UAAU,EACR,SAAS;EACP,SAAS;GAAC;GAAc;GAAgB;EAAa;EACrD,SAAS;GAAC;GAAc;GAAgB;EAAa;CACvD,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,8BAA8B,IAAI;CAAC;CAAW;CAAmB;AAAc,GAAG;CACtF,UAAU,EACR,SAAS;EACP,SAAS,CAAC,YAAY,SAAS;EAC/B,SAAS,CAAC,YAAY,SAAS;CACjC,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;;;;;;;;;;;;;AAyBD,MAAM,kBAAkB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WACrE,oBAAC,OAAD;CAAK,MAAK;CAAS,WAAW,qBAAqB;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CAC7E;AACE,CAAA;AAKP,MAAM,kBAAkB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WACrE,oBAAC,OAAD;CAAK,WAAW,yBAAyB;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CACnE;AACE,CAAA;AAKP,MAAM,mBAAmB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WACtE,oBAAC,MAAD;CAAI,WAAW,0BAA0B;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CACnE;AACC,CAAA;AAKN,MAAM,yBAAyB,EAC7B,WACA,UAAU,WACV,UACA,GAAG,WAEH,oBAAC,KAAD;CAAG,WAAW,gCAAgC;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CACxE;AACA,CAAA;AAKL,MAAM,qBAAqB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WACxE,oBAAC,OAAD;CAAK,WAAW,4BAA4B;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CACtE;AACE,CAAA;AAGP,MAAa,aAAa;AAO1B,WAAW,OAAO;AAClB,WAAW,QAAQ;AACnB,WAAW,cAAc;AACzB,WAAW,UAAU"}

package/dist/internal/blocks/ErrorState.js

@@ -0,0 +1,179 @@
+import { useArgoDesign } from "../../context-KxxeMHbR.js";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+//#region src/blocks/ErrorState/ErrorState.tsx
+const errorStateClassnames = cva([
+	"tw:flex",
+	"tw:flex-col",
+	"tw:items-center",
+	"tw:text-center"
+], {
+	variants: { variant: {
+		default: [
+			"tw:py-16",
+			"tw:px-8",
+			"tw:gap-4"
+		],
+		compact: [
+			"tw:py-8",
+			"tw:px-4",
+			"tw:gap-2"
+		],
+		destructive: [
+			"tw:py-16",
+			"tw:px-8",
+			"tw:gap-4"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const errorStateIconClassnames = cva([
+	"tw:flex",
+	"tw:items-center",
+	"tw:justify-center"
+], {
+	variants: { variant: {
+		default: [
+			"tw:size-16",
+			"tw:text-4xl",
+			"tw:[&_svg:not([class*=\"tw:size-\"])]:size-10",
+			"tw:text-warning"
+		],
+		compact: [
+			"tw:size-10",
+			"tw:text-2xl",
+			"tw:[&_svg:not([class*=\"tw:size-\"])]:size-6",
+			"tw:text-warning"
+		],
+		destructive: [
+			"tw:size-16",
+			"tw:text-4xl",
+			"tw:[&_svg:not([class*=\"tw:size-\"])]:size-10",
+			"tw:data-[argo=false]:text-error-500",
+			"tw:data-[argo=true]:text-destructive"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const errorStateTitleClassnames = cva(["tw:m-0", "tw:font-semibold"], {
+	variants: { variant: {
+		default: [
+			"tw:text-lg",
+			"tw:leading-7",
+			"tw:text-foreground"
+		],
+		compact: [
+			"tw:text-base",
+			"tw:leading-6",
+			"tw:text-foreground"
+		],
+		destructive: [
+			"tw:text-lg",
+			"tw:leading-7",
+			"tw:data-[argo=false]:text-error-700",
+			"tw:data-[argo=true]:text-destructive"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const errorStateDescriptionClassnames = cva(["tw:m-0", "tw:text-muted-foreground"], {
+	variants: { variant: {
+		default: [
+			"tw:text-sm",
+			"tw:leading-5",
+			"tw:max-w-sm"
+		],
+		compact: [
+			"tw:text-xs",
+			"tw:leading-4",
+			"tw:max-w-xs"
+		],
+		destructive: [
+			"tw:text-sm",
+			"tw:leading-5",
+			"tw:max-w-sm"
+		]
+	} },
+	defaultVariants: { variant: "default" }
+});
+const errorStateActionsClassnames = cva([
+	"tw:flex",
+	"tw:items-center",
+	"tw:flex-wrap"
+], {
+	variants: { variant: {
+		default: ["tw:gap-3", "tw:mt-2"],
+		compact: ["tw:gap-2", "tw:mt-1"],
+		destructive: ["tw:gap-3", "tw:mt-2"]
+	} },
+	defaultVariants: { variant: "default" }
+});
+/**
+* Page-level error placeholder with icon, title, description, and recovery-action slots.
+*
+* **When to use:** the page can't render its content because a request failed, the user lacks permission,
+* or the entity doesn't exist. Show a recovery action (retry, go back, request access) in
+* `ErrorState.Actions`.
+* **When NOT to use:** for transient operation failures use `toast()`; for inline form validation use
+* `FormGroup state="error"`; for contextual warning banners use `Alert variant="error"`.
+* **Composition:** nest `ErrorState.Icon`, `ErrorState.Title`, `ErrorState.Description`, and
+* `ErrorState.Actions`. Use `variant="destructive"` for full-page critical failures.
+*/
+const ErrorStateRoot = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	role: "alert",
+	className: errorStateClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const ErrorStateIcon = ({ className, variant = "default", children, ...rest }) => {
+	const renderArgo = useArgoDesign();
+	return /* @__PURE__ */ jsx("div", {
+		"data-argo": renderArgo,
+		className: errorStateIconClassnames({
+			className,
+			variant
+		}),
+		...rest,
+		children
+	});
+};
+const ErrorStateTitle = ({ className, variant = "default", as: Tag = "h3", children, ...rest }) => {
+	const renderArgo = useArgoDesign();
+	return /* @__PURE__ */ jsx(Tag, {
+		"data-argo": renderArgo,
+		className: errorStateTitleClassnames({
+			className,
+			variant
+		}),
+		...rest,
+		children
+	});
+};
+const ErrorStateDescription = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("p", {
+	className: errorStateDescriptionClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const ErrorStateActions = ({ className, variant = "default", children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	className: errorStateActionsClassnames({
+		className,
+		variant
+	}),
+	...rest,
+	children
+});
+const ErrorState = ErrorStateRoot;
+ErrorState.Icon = ErrorStateIcon;
+ErrorState.Title = ErrorStateTitle;
+ErrorState.Description = ErrorStateDescription;
+ErrorState.Actions = ErrorStateActions;
+//#endregion
+export { ErrorState };
+
+//# sourceMappingURL=ErrorState.js.map

package/dist/internal/blocks/ErrorState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorState.js","names":[],"sources":["../../../src/blocks/ErrorState/ErrorState.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { useArgoDesign } from '../../components/ThemeProvider/context';\n\nconst errorStateClassnames = cva(['tw:flex', 'tw:flex-col', 'tw:items-center', 'tw:text-center'], {\n  variants: {\n    variant: {\n      default: ['tw:py-16', 'tw:px-8', 'tw:gap-4'],\n      compact: ['tw:py-8', 'tw:px-4', 'tw:gap-2'],\n      destructive: ['tw:py-16', 'tw:px-8', 'tw:gap-4'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst errorStateIconClassnames = cva(['tw:flex', 'tw:items-center', 'tw:justify-center'], {\n  variants: {\n    variant: {\n      default: [\n        'tw:size-16',\n        'tw:text-4xl',\n        'tw:[&_svg:not([class*=\"tw:size-\"])]:size-10',\n        'tw:text-warning',\n      ],\n      compact: [\n        'tw:size-10',\n        'tw:text-2xl',\n        'tw:[&_svg:not([class*=\"tw:size-\"])]:size-6',\n        'tw:text-warning',\n      ],\n      // Legacy keeps the fixed error scale; argo uses the themeable destructive token.\n      destructive: [\n        'tw:size-16',\n        'tw:text-4xl',\n        'tw:[&_svg:not([class*=\"tw:size-\"])]:size-10',\n        'tw:data-[argo=false]:text-error-500',\n        'tw:data-[argo=true]:text-destructive',\n      ],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst errorStateTitleClassnames = cva(['tw:m-0', 'tw:font-semibold'], {\n  variants: {\n    variant: {\n      default: ['tw:text-lg', 'tw:leading-7', 'tw:text-foreground'],\n      compact: ['tw:text-base', 'tw:leading-6', 'tw:text-foreground'],\n      destructive: [\n        'tw:text-lg',\n        'tw:leading-7',\n        'tw:data-[argo=false]:text-error-700',\n        'tw:data-[argo=true]:text-destructive',\n      ],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst errorStateDescriptionClassnames = cva(['tw:m-0', 'tw:text-muted-foreground'], {\n  variants: {\n    variant: {\n      default: ['tw:text-sm', 'tw:leading-5', 'tw:max-w-sm'],\n      compact: ['tw:text-xs', 'tw:leading-4', 'tw:max-w-xs'],\n      destructive: ['tw:text-sm', 'tw:leading-5', 'tw:max-w-sm'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst errorStateActionsClassnames = cva(['tw:flex', 'tw:items-center', 'tw:flex-wrap'], {\n  variants: {\n    variant: {\n      default: ['tw:gap-3', 'tw:mt-2'],\n      compact: ['tw:gap-2', 'tw:mt-1'],\n      destructive: ['tw:gap-3', 'tw:mt-2'],\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\ntype Variant = VariantProps<typeof errorStateClassnames>['variant'];\n\n/**\n * Props for `ErrorState`. `variant` chooses look — `\"default\"` for non-blocking errors, `\"compact\"` for\n * inside cards, `\"destructive\"` for blocking failures (red title + icon).\n */\ntype RootProps = ComponentProps<'div'> &\n  VariantProps<typeof errorStateClassnames> & {\n    variant?: Variant;\n  };\n\n/**\n * Page-level error placeholder with icon, title, description, and recovery-action slots.\n *\n * **When to use:** the page can't render its content because a request failed, the user lacks permission,\n * or the entity doesn't exist. Show a recovery action (retry, go back, request access) in\n * `ErrorState.Actions`.\n * **When NOT to use:** for transient operation failures use `toast()`; for inline form validation use\n * `FormGroup state=\"error\"`; for contextual warning banners use `Alert variant=\"error\"`.\n * **Composition:** nest `ErrorState.Icon`, `ErrorState.Title`, `ErrorState.Description`, and\n * `ErrorState.Actions`. Use `variant=\"destructive\"` for full-page critical failures.\n */\nconst ErrorStateRoot = ({ className, variant = 'default', children, ...rest }: RootProps) => (\n  <div role=\"alert\" className={errorStateClassnames({ className, variant })} {...rest}>\n    {children}\n  </div>\n);\n\ntype SlotProps = ComponentProps<'div'> & { variant?: Variant };\n\nconst ErrorStateIcon = ({ className, variant = 'default', children, ...rest }: SlotProps) => {\n  const renderArgo = useArgoDesign();\n  return (\n    <div\n      data-argo={renderArgo}\n      className={errorStateIconClassnames({ className, variant })}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n};\n\ntype HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\ntype TitleProps = ComponentProps<'h3'> & {\n  variant?: Variant;\n  /** Heading tag to render. Defaults to `h3`; set explicitly to avoid a heading-order skip\n   *  (e.g. `as=\"h2\"` when the error state sits directly under a page's `h1`). */\n  as?: HeadingLevel;\n};\n\nconst ErrorStateTitle = ({\n  className,\n  variant = 'default',\n  as: Tag = 'h3',\n  children,\n  ...rest\n}: TitleProps) => {\n  const renderArgo = useArgoDesign();\n  return (\n    <Tag\n      data-argo={renderArgo}\n      className={errorStateTitleClassnames({ className, variant })}\n      {...rest}\n    >\n      {children}\n    </Tag>\n  );\n};\n\ntype DescriptionProps = ComponentProps<'p'> & { variant?: Variant };\n\nconst ErrorStateDescription = ({\n  className,\n  variant = 'default',\n  children,\n  ...rest\n}: DescriptionProps) => (\n  <p className={errorStateDescriptionClassnames({ className, variant })} {...rest}>\n    {children}\n  </p>\n);\n\ntype ActionsProps = ComponentProps<'div'> & { variant?: Variant };\n\nconst ErrorStateActions = ({ className, variant = 'default', children, ...rest }: ActionsProps) => (\n  <div className={errorStateActionsClassnames({ className, variant })} {...rest}>\n    {children}\n  </div>\n);\n\nexport const ErrorState = ErrorStateRoot as typeof ErrorStateRoot & {\n  Icon: typeof ErrorStateIcon;\n  Title: typeof ErrorStateTitle;\n  Description: typeof ErrorStateDescription;\n  Actions: typeof ErrorStateActions;\n};\n\nErrorState.Icon = ErrorStateIcon;\nErrorState.Title = ErrorStateTitle;\nErrorState.Description = ErrorStateDescription;\nErrorState.Actions = ErrorStateActions;\n\nexport type { RootProps as ErrorStateProps, Variant as ErrorStateVariant };\n"],"mappings":";;;;AAMA,MAAM,uBAAuB,IAAI;CAAC;CAAW;CAAe;CAAmB;AAAgB,GAAG;CAChG,UAAU,EACR,SAAS;EACP,SAAS;GAAC;GAAY;GAAW;EAAU;EAC3C,SAAS;GAAC;GAAW;GAAW;EAAU;EAC1C,aAAa;GAAC;GAAY;GAAW;EAAU;CACjD,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,2BAA2B,IAAI;CAAC;CAAW;CAAmB;AAAmB,GAAG;CACxF,UAAU,EACR,SAAS;EACP,SAAS;GACP;GACA;GACA;GACA;EACF;EACA,SAAS;GACP;GACA;GACA;GACA;EACF;EAEA,aAAa;GACX;GACA;GACA;GACA;GACA;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,4BAA4B,IAAI,CAAC,UAAU,kBAAkB,GAAG;CACpE,UAAU,EACR,SAAS;EACP,SAAS;GAAC;GAAc;GAAgB;EAAoB;EAC5D,SAAS;GAAC;GAAgB;GAAgB;EAAoB;EAC9D,aAAa;GACX;GACA;GACA;GACA;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,kCAAkC,IAAI,CAAC,UAAU,0BAA0B,GAAG;CAClF,UAAU,EACR,SAAS;EACP,SAAS;GAAC;GAAc;GAAgB;EAAa;EACrD,SAAS;GAAC;GAAc;GAAgB;EAAa;EACrD,aAAa;GAAC;GAAc;GAAgB;EAAa;CAC3D,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,MAAM,8BAA8B,IAAI;CAAC;CAAW;CAAmB;AAAc,GAAG;CACtF,UAAU,EACR,SAAS;EACP,SAAS,CAAC,YAAY,SAAS;EAC/B,SAAS,CAAC,YAAY,SAAS;EAC/B,aAAa,CAAC,YAAY,SAAS;CACrC,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;;;;;;;;;;;;AAwBD,MAAM,kBAAkB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WACrE,oBAAC,OAAD;CAAK,MAAK;CAAQ,WAAW,qBAAqB;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CAC5E;AACE,CAAA;AAKP,MAAM,kBAAkB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WAAsB;CAC3F,MAAM,aAAa,cAAc;CACjC,OACE,oBAAC,OAAD;EACE,aAAW;EACX,WAAW,yBAAyB;GAAE;GAAW;EAAQ,CAAC;EAC1D,GAAI;EAEH;CACE,CAAA;AAET;AAWA,MAAM,mBAAmB,EACvB,WACA,UAAU,WACV,IAAI,MAAM,MACV,UACA,GAAG,WACa;CAChB,MAAM,aAAa,cAAc;CACjC,OACE,oBAAC,KAAD;EACE,aAAW;EACX,WAAW,0BAA0B;GAAE;GAAW;EAAQ,CAAC;EAC3D,GAAI;EAEH;CACE,CAAA;AAET;AAIA,MAAM,yBAAyB,EAC7B,WACA,UAAU,WACV,UACA,GAAG,WAEH,oBAAC,KAAD;CAAG,WAAW,gCAAgC;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CACxE;AACA,CAAA;AAKL,MAAM,qBAAqB,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,WACxE,oBAAC,OAAD;CAAK,WAAW,4BAA4B;EAAE;EAAW;CAAQ,CAAC;CAAG,GAAI;CACtE;AACE,CAAA;AAGP,MAAa,aAAa;AAO1B,WAAW,OAAO;AAClB,WAAW,QAAQ;AACnB,WAAW,cAAc;AACzB,WAAW,UAAU"}

package/dist/internal/blocks/ExportMenu.js

@@ -0,0 +1,41 @@
+import { Tooltip } from "../../utils-D0c5VAyF.js";
+import { Download } from "../../icons-Cek151jC.js";
+import { Button } from "../../Button-nzmDNS2q.js";
+import { DropdownMenu } from "../../DropdownMenu-B6ZbYvaM.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/blocks/ExportMenu/ExportMenu.tsx
+/**
+* Download-icon trigger with a menu of export formats.
+*
+* Lives in the root barrel rather than inside `ZoomableSvg` on purpose: that
+* component ships behind the lazy `@keboola/design/mermaid` boundary, and Radix's
+* menu is not in that chunk closure — importing it there would pull ~11 kB
+* brotlied of chunk-mates (`DropdownMenu` travels with `ButtonGroup` and `toast`,
+* which in turn pulls `ScrollArea`) plus two more external deps behind the lazy
+* boundary. Callers already paying for the barrel inject this instead.
+*/
+const ExportMenu = ({ items, label, size = "icon-sm" }) => /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(Tooltip, {
+	tooltip: label,
+	placement: "top",
+	triggerAsChild: true,
+	children: /* @__PURE__ */ jsx(DropdownMenu.Trigger, {
+		asChild: true,
+		children: /* @__PURE__ */ jsx(Button, {
+			size,
+			variant: "outline",
+			"aria-label": label,
+			className: "tw:data-[state=open]:!bg-primary/10 tw:data-[state=open]:!text-primary",
+			children: /* @__PURE__ */ jsx(Download, { className: "tw:size-4" })
+		})
+	})
+}), /* @__PURE__ */ jsx(DropdownMenu.Content, {
+	align: "end",
+	children: items.map((item, index) => /* @__PURE__ */ jsx(DropdownMenu.Item, {
+		onSelect: item.onSelect,
+		children: item.label
+	}, index))
+})] });
+//#endregion
+export { ExportMenu };
+
+//# sourceMappingURL=ExportMenu.js.map

package/dist/internal/blocks/ExportMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExportMenu.js","names":[],"sources":["../../../src/blocks/ExportMenu/ExportMenu.tsx"],"sourcesContent":["import { Button } from '../../components/Button';\nimport { DropdownMenu } from '../../components/DropdownMenu';\nimport { Tooltip } from '../../components/Tooltip';\nimport { Download } from '../../icons';\n\nexport type ExportMenuItem = {\n  /** Menu label, e.g. \"Download as CSV\". */\n  label: string;\n  onSelect: () => void;\n};\n\ntype Props = {\n  items: ExportMenuItem[];\n  /** Accessible name + tooltip for the trigger, e.g. \"Export table\". */\n  label: string;\n  size?: 'icon-xs' | 'icon-sm';\n};\n\n/**\n * Download-icon trigger with a menu of export formats.\n *\n * Lives in the root barrel rather than inside `ZoomableSvg` on purpose: that\n * component ships behind the lazy `@keboola/design/mermaid` boundary, and Radix's\n * menu is not in that chunk closure — importing it there would pull ~11 kB\n * brotlied of chunk-mates (`DropdownMenu` travels with `ButtonGroup` and `toast`,\n * which in turn pulls `ScrollArea`) plus two more external deps behind the lazy\n * boundary. Callers already paying for the barrel inject this instead.\n */\nexport const ExportMenu = ({ items, label, size = 'icon-sm' }: Props) => (\n  <DropdownMenu>\n    <Tooltip tooltip={label} placement=\"top\" triggerAsChild>\n      <DropdownMenu.Trigger asChild>\n        <Button\n          size={size}\n          variant=\"outline\"\n          aria-label={label}\n          // A menu trigger reads as active while its menu is open, and the argo\n          // `outline` variant resets to the plain background when active\n          // (`tw:hover:active:bg-background`). Re-assert the tint so an open\n          // trigger stays highlighted instead of dropping back to plain.\n          className=\"tw:data-[state=open]:!bg-primary/10 tw:data-[state=open]:!text-primary\"\n        >\n          <Download className=\"tw:size-4\" />\n        </Button>\n      </DropdownMenu.Trigger>\n    </Tooltip>\n    <DropdownMenu.Content align=\"end\">\n      {/* Keyed by index, not label: labels aren't guaranteed unique on a public\n          export (localized or dynamic text), and a duplicate key trips React's\n          duplicate-key warning. */}\n      {items.map((item, index) => (\n        <DropdownMenu.Item key={index} onSelect={item.onSelect}>\n          {item.label}\n        </DropdownMenu.Item>\n      ))}\n    </DropdownMenu.Content>\n  </DropdownMenu>\n);\n"],"mappings":";;;;;;;;;;;;;;;;AA4BA,MAAa,cAAc,EAAE,OAAO,OAAO,OAAO,gBAChD,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,SAAD;CAAS,SAAS;CAAO,WAAU;CAAM,gBAAA;CACvC,UAAA,oBAAC,aAAa,SAAd;EAAsB,SAAA;EACpB,UAAA,oBAAC,QAAD;GACQ;GACN,SAAQ;GACR,cAAY;GAKZ,WAAU;GAEV,UAAA,oBAAC,UAAD,EAAU,WAAU,YAAa,CAAA;EAC3B,CAAA;CACY,CAAA;AACf,CAAA,GACT,oBAAC,aAAa,SAAd;CAAsB,OAAM;CAIzB,UAAA,MAAM,KAAK,MAAM,UAChB,oBAAC,aAAa,MAAd;EAA+B,UAAU,KAAK;EAC3C,UAAA,KAAK;CACW,GAFK,KAEL,CACpB;AACmB,CAAA,CACV,EAAA,CAAA"}

package/dist/internal/blocks/Form.js

@@ -0,0 +1,2 @@
+import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "../../Form-BDCef6O9.js";
+export { setServerFieldErrors, setSubmitError, useAppForm, withForm };

package/dist/internal/blocks/FormGroup.js

@@ -0,0 +1,2 @@
+import { FormGroup } from "../../FormGroup-S9mPNHKH.js";
+export { FormGroup };