@keboola/design 10.1.0 → 11.0.1

package/dist/Table-CvYuTuNU.js

@@ -0,0 +1,104 @@
+import { cn } from "./classNames-BzrkDnOD.js";
+import { ChevronDown, ChevronUp, ChevronsUpDown } from "./icons-Cek151jC.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Table/TableBody.tsx
+const TableBody = ({ withBorderSeparator = true, className, ...props }) => {
+	return /* @__PURE__ */ jsx("tbody", {
+		className: cn({ "tw:[&_tr]:border-0 tw:[&_tr]:border-b-border tw:[&_tr]:border-b tw:[&_tr]:border-solid tw:[&_tr:last-child]:border-0": withBorderSeparator }, className),
+		...props
+	});
+};
+//#endregion
+//#region src/components/Table/TableCell.tsx
+const TableCell = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("td", {
+		className: cn("tw:px-3 tw:py-2", className),
+		...props
+	});
+};
+//#endregion
+//#region src/components/Table/TableFooter.tsx
+const TableFooter = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("tfoot", {
+		className: cn("tw:bg-muted/50 tw:border-t tw:border-border tw:font-medium tw:[&>tr]:last:border-b-0", className),
+		...props
+	});
+};
+//#endregion
+//#region src/components/Table/TableHead.tsx
+const TableHead = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("th", {
+		className: cn("tw:px-3 tw:py-2 tw:text-left tw:font-medium tw:whitespace-nowrap tw:[&:has([role=checkbox])]:pr-0 tw:[&>[role=checkbox]]:translate-y-[2px] tw:focus-within:ring-2 tw:focus-within:ring-ring/50", className),
+		...props
+	});
+};
+//#endregion
+//#region src/components/Table/TableHeader.tsx
+const TableHeader = ({ withShadow = false, className, ...props }) => {
+	return /* @__PURE__ */ jsx("thead", {
+		className: cn("tw:sticky tw:top-0 tw:z-10 tw:[&_tr]:bg-table-header tw:[&_tr]:hover:bg-table-header tw:[&_tr]:border-b tw:[&_tr]:border-border", { "tw:shadow-table": withShadow }, className),
+		...props
+	});
+};
+//#endregion
+//#region src/components/Table/TableRow.tsx
+const TableRow = ({ ref, className, ...props }) => /* @__PURE__ */ jsx("tr", {
+	ref,
+	className: cn("tw:hover:bg-muted/50 tw:aria-selected:bg-accent tw:aria-selected:hover:bg-accent", className),
+	...props
+});
+//#endregion
+//#region src/components/Table/TableSortHeader.tsx
+/** Maps a sort direction to the `aria-sort` value for the enclosing `Table.Head`. */
+const tableAriaSort = (sorted) => sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : "none";
+/**
+* Clickable column-header label with a sort-direction chevron, for use inside `Table.Head`.
+*
+* Presentational only — it owns no sort state. Pair it with your sort model (a `useState`
+* key/direction pair, or `@tanstack/react-table`'s `getToggleSortingHandler()` / `getIsSorted()`)
+* and set `aria-sort` on the enclosing `Table.Head` via {@link tableAriaSort}.
+*/
+const TableSortHeader = ({ sorted, children, className, ...props }) => {
+	const Icon = sorted === false ? ChevronsUpDown : sorted === "asc" ? ChevronUp : ChevronDown;
+	return /* @__PURE__ */ jsxs("button", {
+		className: cn("tw:group tw:flex tw:cursor-pointer tw:items-center tw:gap-1 tw:border-0 tw:bg-transparent tw:p-0 tw:font-medium tw:text-inherit", className),
+		...props,
+		type: "button",
+		children: [children, /* @__PURE__ */ jsx(Icon, { className: "tw:size-3 tw:text-muted-foreground" })]
+	});
+};
+//#endregion
+//#region src/components/Table/Table.tsx
+/**
+* Tabular data surface with header / body / row / cell compound parts.
+*
+* **When to use:** tabular data with named columns — entity lists with shared schema (jobs, buckets,
+* tables), sortable rows, row-level actions. Compose `Table.Header` + `Table.Body` + `Table.Row` +
+* `Table.Head` / `Table.Cell`.
+* **When NOT to use:** for heterogeneous lists where each row has its own shape use a `Card` list;
+* for tree / hierarchy layouts use a custom recursive list with `Table` per level.
+* **Composition:** wrap in `PageLayout.Content`. For sortable / filterable behaviour bring your own
+* state library (TanStack Table is a common pairing); this component is presentational.
+*
+* @see RECIPES.md#list-detail — for a list-table + row-click-to-detail pattern
+*/
+const Table = ({ borderCollapsed = true, bordered = false, containerClassName, className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("tw:relative tw:w-full", bordered && "tw:overflow-auto tw:rounded-[10px] tw:border tw:border-solid tw:border-border", containerClassName),
+		children: /* @__PURE__ */ jsx("table", {
+			className: cn("tw:w-full tw:caption-bottom tw:text-sm tw:text-foreground", borderCollapsed ? "tw:border-collapse" : "tw:border-separate tw:border-spacing-y-1", className),
+			...props
+		})
+	});
+};
+Table.Header = TableHeader;
+Table.Head = TableHead;
+Table.Body = TableBody;
+Table.Row = TableRow;
+Table.Cell = TableCell;
+Table.Footer = TableFooter;
+Table.SortHeader = TableSortHeader;
+//#endregion
+export { Table, TableSortHeader, tableAriaSort };
+
+//# sourceMappingURL=Table-CvYuTuNU.js.map

package/dist/Table-CvYuTuNU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table-CvYuTuNU.js","names":[],"sources":["../src/components/Table/TableBody.tsx","../src/components/Table/TableCell.tsx","../src/components/Table/TableFooter.tsx","../src/components/Table/TableHead.tsx","../src/components/Table/TableHeader.tsx","../src/components/Table/TableRow.tsx","../src/components/Table/TableSortHeader.tsx","../src/components/Table/Table.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nexport const TableBody = ({\n  withBorderSeparator = true,\n  className,\n  ...props\n}: { withBorderSeparator?: boolean } & ComponentProps<'tbody'>) => {\n  return (\n    <tbody\n      className={cn(\n        {\n          'tw:[&_tr]:border-0 tw:[&_tr]:border-b-border tw:[&_tr]:border-b tw:[&_tr]:border-solid tw:[&_tr:last-child]:border-0':\n            withBorderSeparator,\n        },\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nexport const TableCell = ({ className, ...props }: ComponentProps<'td'>) => {\n  return <td className={cn('tw:px-3 tw:py-2', className)} {...props} />;\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nexport const TableFooter = ({ className, ...props }: ComponentProps<'tfoot'>) => {\n  return (\n    <tfoot\n      className={cn(\n        'tw:bg-muted/50 tw:border-t tw:border-border tw:font-medium tw:[&>tr]:last:border-b-0',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nexport const TableHead = ({ className, ...props }: ComponentProps<'th'>) => {\n  return (\n    <th\n      className={cn(\n        'tw:px-3 tw:py-2 tw:text-left tw:font-medium tw:whitespace-nowrap tw:[&:has([role=checkbox])]:pr-0 tw:[&>[role=checkbox]]:translate-y-[2px] tw:focus-within:ring-2 tw:focus-within:ring-ring/50',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nexport const TableHeader = ({\n  withShadow = false,\n  className,\n  ...props\n}: { withShadow?: boolean } & ComponentProps<'thead'>) => {\n  return (\n    <thead\n      className={cn(\n        // `[&_tr]:hover:` (0,2,1) outranks `TableRow`'s own `hover:bg-muted/50` (0,2,0), so the\n        // header row keeps its background instead of flashing muted — a header is not hoverable.\n        'tw:sticky tw:top-0 tw:z-10 tw:[&_tr]:bg-table-header tw:[&_tr]:hover:bg-table-header tw:[&_tr]:border-b tw:[&_tr]:border-border',\n        { 'tw:shadow-table': withShadow },\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nexport const TableRow = ({ ref, className, ...props }: ComponentProps<'tr'>) => (\n  <tr\n    ref={ref}\n    className={cn(\n      'tw:hover:bg-muted/50 tw:aria-selected:bg-accent tw:aria-selected:hover:bg-accent',\n      className,\n    )}\n    {...props}\n  />\n);\n","import type { ComponentProps, ReactNode } from 'react';\n\nimport { ChevronDown, ChevronsUpDown, ChevronUp } from '../../icons';\nimport { cn } from '../../utils';\n\nexport type TableSortDirection = 'asc' | 'desc' | false;\n\n/** Maps a sort direction to the `aria-sort` value for the enclosing `Table.Head`. */\nexport const tableAriaSort = (sorted: TableSortDirection): ComponentProps<'th'>['aria-sort'] =>\n  sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : 'none';\n\ntype Props = {\n  /** Current sort state for this column: `'asc'`, `'desc'`, or `false` when unsorted. */\n  sorted: TableSortDirection;\n  children: ReactNode;\n} & Omit<ComponentProps<'button'>, 'children' | 'type'>;\n\n/**\n * Clickable column-header label with a sort-direction chevron, for use inside `Table.Head`.\n *\n * Presentational only — it owns no sort state. Pair it with your sort model (a `useState`\n * key/direction pair, or `@tanstack/react-table`'s `getToggleSortingHandler()` / `getIsSorted()`)\n * and set `aria-sort` on the enclosing `Table.Head` via {@link tableAriaSort}.\n */\nexport const TableSortHeader = ({ sorted, children, className, ...props }: Props) => {\n  const Icon = sorted === false ? ChevronsUpDown : sorted === 'asc' ? ChevronUp : ChevronDown;\n  return (\n    <button\n      className={cn(\n        'tw:group tw:flex tw:cursor-pointer tw:items-center tw:gap-1 tw:border-0 tw:bg-transparent tw:p-0 tw:font-medium tw:text-inherit',\n        className,\n      )}\n      {...props}\n      type=\"button\"\n    >\n      {children}\n      <Icon className=\"tw:size-3 tw:text-muted-foreground\" />\n    </button>\n  );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { TableBody } from './TableBody';\nimport { TableCell } from './TableCell';\nimport { TableFooter } from './TableFooter';\nimport { TableHead } from './TableHead';\nimport { TableHeader } from './TableHeader';\nimport { TableRow } from './TableRow';\nimport { TableSortHeader } from './TableSortHeader';\n\n/**\n * Props for `Table`. `borderCollapsed` toggles standard collapsed borders vs separate row spacing;\n * `bordered` wraps the table in a rounded bordered container with overflow scrolling.\n */\ntype Props = {\n  borderCollapsed?: boolean;\n  bordered?: boolean;\n  containerClassName?: string;\n} & ComponentProps<'table'>;\n\n/**\n * Tabular data surface with header / body / row / cell compound parts.\n *\n * **When to use:** tabular data with named columns — entity lists with shared schema (jobs, buckets,\n * tables), sortable rows, row-level actions. Compose `Table.Header` + `Table.Body` + `Table.Row` +\n * `Table.Head` / `Table.Cell`.\n * **When NOT to use:** for heterogeneous lists where each row has its own shape use a `Card` list;\n * for tree / hierarchy layouts use a custom recursive list with `Table` per level.\n * **Composition:** wrap in `PageLayout.Content`. For sortable / filterable behaviour bring your own\n * state library (TanStack Table is a common pairing); this component is presentational.\n *\n * @see RECIPES.md#list-detail — for a list-table + row-click-to-detail pattern\n */\nexport const Table = ({\n  borderCollapsed = true,\n  bordered = false,\n  containerClassName,\n  className,\n  ...props\n}: Props) => {\n  return (\n    <div\n      className={cn(\n        'tw:relative tw:w-full',\n        bordered && 'tw:overflow-auto tw:rounded-[10px] tw:border tw:border-solid tw:border-border',\n        containerClassName,\n      )}\n    >\n      <table\n        className={cn(\n          // `tw:text-foreground` (a semantic token) so header + cell text flips\n          // under `[data-theme='dark']` instead of inheriting a fixed dark color.\n          'tw:w-full tw:caption-bottom tw:text-sm tw:text-foreground',\n          borderCollapsed ? 'tw:border-collapse' : 'tw:border-separate tw:border-spacing-y-1',\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n};\n\nTable.Header = TableHeader;\nTable.Head = TableHead;\nTable.Body = TableBody;\nTable.Row = TableRow;\nTable.Cell = TableCell;\nTable.Footer = TableFooter;\nTable.SortHeader = TableSortHeader;\n"],"mappings":";;;;AAIA,MAAa,aAAa,EACxB,sBAAsB,MACtB,WACA,GAAG,YAC8D;CACjE,OACE,oBAAC,SAAD;EACE,WAAW,GACT,EACE,wHACE,oBACJ,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;ACjBA,MAAa,aAAa,EAAE,WAAW,GAAG,YAAkC;CAC1E,OAAO,oBAAC,MAAD;EAAI,WAAW,GAAG,mBAAmB,SAAS;EAAG,GAAI;CAAQ,CAAA;AACtE;;;ACFA,MAAa,eAAe,EAAE,WAAW,GAAG,YAAqC;CAC/E,OACE,oBAAC,SAAD;EACE,WAAW,GACT,wFACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;ACVA,MAAa,aAAa,EAAE,WAAW,GAAG,YAAkC;CAC1E,OACE,oBAAC,MAAD;EACE,WAAW,GACT,kMACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;ACVA,MAAa,eAAe,EAC1B,aAAa,OACb,WACA,GAAG,YACqD;CACxD,OACE,oBAAC,SAAD;EACE,WAAW,GAGT,mIACA,EAAE,mBAAmB,WAAW,GAChC,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;ACjBA,MAAa,YAAY,EAAE,KAAK,WAAW,GAAG,YAC5C,oBAAC,MAAD;CACO;CACL,WAAW,GACT,oFACA,SACF;CACA,GAAI;AACL,CAAA;;;;ACJH,MAAa,iBAAiB,WAC5B,WAAW,QAAQ,cAAc,WAAW,SAAS,eAAe;;;;;;;;AAetE,MAAa,mBAAmB,EAAE,QAAQ,UAAU,WAAW,GAAG,YAAmB;CACnF,MAAM,OAAO,WAAW,QAAQ,iBAAiB,WAAW,QAAQ,YAAY;CAChF,OACE,qBAAC,UAAD;EACE,WAAW,GACT,mIACA,SACF;EACA,GAAI;EACJ,MAAK;EANP,UAAA,CAQG,UACD,oBAAC,MAAD,EAAM,WAAU,qCAAsC,CAAA,CAChD;;AAEZ;;;;;;;;;;;;;;;;ACJA,MAAa,SAAS,EACpB,kBAAkB,MAClB,WAAW,OACX,oBACA,WACA,GAAG,YACQ;CACX,OACE,oBAAC,OAAD;EACE,WAAW,GACT,yBACA,YAAY,iFACZ,kBACF;EAEA,UAAA,oBAAC,SAAD;GACE,WAAW,GAGT,6DACA,kBAAkB,uBAAuB,4CACzC,SACF;GACA,GAAI;EACL,CAAA;CACE,CAAA;AAET;AAEA,MAAM,SAAS;AACf,MAAM,OAAO;AACb,MAAM,OAAO;AACb,MAAM,MAAM;AACZ,MAAM,OAAO;AACb,MAAM,SAAS;AACf,MAAM,aAAa"}

package/dist/Tabs-EAihyqCt.js

@@ -0,0 +1,74 @@
+import { cn } from "./classNames-BzrkDnOD.js";
+import { X } from "./icons-Cek151jC.js";
+import { Button } from "./Button-nzmDNS2q.js";
+import { ScrollArea } from "./internal/components/ScrollArea.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as RadixTabs from "@radix-ui/react-tabs";
+//#region src/components/Tabs/styles.ts
+const tabsListWrapperClass = "tw:shrink-0 tw:border-t-0 tw:border-x-0 tw:border-b tw:border-solid tw:border-border";
+const tabsListClass = "tw:flex tw:gap-8 tw:shrink-0 tw:w-max";
+const tabsTriggerGroupClass = "tw:group/tab-trigger-group tw:flex tw:shrink-0 tw:items-center";
+const tabsTriggerClass = "tw:focus-visible:outline-hidden tw:focus-visible:ring-2 tw:focus-visible:ring-inset tw:focus-visible:ring-ring tw:flex tw:justify-center tw:items-center tw:gap-1.5 tw:bg-transparent tw:shrink-0 tw:border-t-0 tw:border-x-0 tw:border-b-[3px] tw:border-solid tw:border-transparent tw:pt-2.5 tw:pb-5 tw:px-0 tw:m-0 tw:font-medium tw:leading-5 tw:text-muted-foreground tw:text-base tw:data-[state=active]:text-primary tw:data-[state=active]:border-primary tw:data-[disabled]:text-muted-foreground tw:data-[disabled]:opacity-50 tw:data-[disabled]:cursor-not-allowed tw:group-hover/tab-trigger-group:enabled:text-primary tw:group-hover/tab-trigger-group:enabled:border-primary tw:group-hover/tab-trigger-group:enabled:cursor-pointer";
+//#endregion
+//#region src/components/Tabs/TabsList.tsx
+const TabsList = ({ className, children, ...rest }) => /* @__PURE__ */ jsx(ScrollArea, {
+	orientation: "horizontal",
+	className: tabsListWrapperClass,
+	children: /* @__PURE__ */ jsx(RadixTabs.List, {
+		...rest,
+		"data-slot": "tabs-list",
+		className: cn(tabsListClass, className),
+		children
+	})
+});
+//#endregion
+//#region src/components/Tabs/TabsTrigger.tsx
+const TabsTrigger = ({ className, compact = false, ...rest }) => /* @__PURE__ */ jsx(RadixTabs.Trigger, {
+	"data-slot": "tabs-trigger",
+	...rest,
+	className: cn(tabsTriggerClass, compact && "tw:text-sm tw:pb-4", className)
+});
+//#endregion
+//#region src/components/Tabs/Tabs.tsx
+const Tabs = ({ triggers, compact = false, children, defaultValue, onValueChange, rootClassName, listClassName, triggerClassName, triggerGroupClassName, ...rest }) => /* @__PURE__ */ jsxs(RadixTabs.Root, {
+	...rest,
+	"data-slot": "tabs-root",
+	className: cn("tw:flex tw:flex-col tw:gap-6", rootClassName),
+	defaultValue: defaultValue ?? triggers[0]?.value,
+	onValueChange,
+	children: [/* @__PURE__ */ jsx(TabsList, {
+		className: listClassName,
+		children: triggers.map(({ value, title, onClose, className: callerClassName, ...triggerRest }) => /* @__PURE__ */ jsxs("div", {
+			className: cn(tabsTriggerGroupClass, triggerGroupClassName),
+			"data-slot": "tabs-trigger-group",
+			children: [/* @__PURE__ */ jsx(TabsTrigger, {
+				value,
+				compact,
+				...triggerRest,
+				className: cn(triggerClassName, callerClassName),
+				children: title
+			}), onClose && /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "inline",
+				size: "icon-3xs",
+				disabled: triggerRest.disabled,
+				onClick: () => onClose(value),
+				onMouseDown: (e) => e.preventDefault(),
+				className: "tw:!size-8 tw:opacity-0 tw:duration-200 tw:focus-visible:opacity-100 tw:group-focus-within/tab-trigger-group:opacity-100 tw:group-hover/tab-trigger-group:opacity-100",
+				"aria-label": typeof title === "string" ? `Close ${title}` : "Close tab",
+				children: /* @__PURE__ */ jsx(X, { className: "tw:size-4" })
+			})]
+		}, value))
+	}), children]
+});
+//#endregion
+//#region src/components/Tabs/TabsContent.tsx
+const TabsContent = (props) => /* @__PURE__ */ jsx(RadixTabs.Content, {
+	"data-slot": "tabs-content",
+	tabIndex: -1,
+	...props
+});
+//#endregion
+export { Tabs, TabsContent };
+
+//# sourceMappingURL=Tabs-EAihyqCt.js.map

package/dist/Tabs-EAihyqCt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs-EAihyqCt.js","names":[],"sources":["../src/components/Tabs/styles.ts","../src/components/Tabs/TabsList.tsx","../src/components/Tabs/TabsTrigger.tsx","../src/components/Tabs/Tabs.tsx","../src/components/Tabs/TabsContent.tsx"],"sourcesContent":["// Directional resets (border-t-0/border-x-0), NOT border-0: under Tailwind v4 a\n// consumer app's `border-0` utility can land after design's compiled bottom-border in\n// the shared `utilities` layer and zero its width (same layer + specificity → source\n// order wins), dropping the line. With directional resets, only the bottom-border\n// utility (`border-b` on the wrapper, `border-b-[3px]` on the trigger) sets the bottom.\nexport const tabsListWrapperClass =\n  'tw:shrink-0 tw:border-t-0 tw:border-x-0 tw:border-b tw:border-solid tw:border-border';\n\nexport const tabsListClass = 'tw:flex tw:gap-8 tw:shrink-0 tw:w-max';\n\nexport const tabsTriggerGroupClass =\n  'tw:group/tab-trigger-group tw:flex tw:shrink-0 tw:items-center';\n\n// The focus ring is **inset**, not an outline. `TabsList` wraps the row in a horizontal\n// `ScrollArea`, whose viewport is `overflow-y: hidden`, and a trigger is exactly as tall as that\n// viewport — so there is 0px of slack for anything painted outside the border box, and a focus\n// outline (the browser's, or a host app's global rule) gets cropped on the top and bottom edges,\n// plus the left edge on the first trigger. Painting inside the box cannot be clipped by any\n// ancestor. Owning the affordance here is also what stops the consumer's global rule applying.\nexport const tabsTriggerClass =\n  'tw:focus-visible:outline-hidden tw:focus-visible:ring-2 tw:focus-visible:ring-inset tw:focus-visible:ring-ring tw:flex tw:justify-center tw:items-center tw:gap-1.5 tw:bg-transparent tw:shrink-0 tw:border-t-0 tw:border-x-0 tw:border-b-[3px] tw:border-solid tw:border-transparent tw:pt-2.5 tw:pb-5 tw:px-0 tw:m-0 tw:font-medium tw:leading-5 tw:text-muted-foreground tw:text-base tw:data-[state=active]:text-primary tw:data-[state=active]:border-primary tw:data-[disabled]:text-muted-foreground tw:data-[disabled]:opacity-50 tw:data-[disabled]:cursor-not-allowed tw:group-hover/tab-trigger-group:enabled:text-primary tw:group-hover/tab-trigger-group:enabled:border-primary tw:group-hover/tab-trigger-group:enabled:cursor-pointer';\n\nexport const tabsTriggerCompactClass = 'tw:text-sm tw:pb-4';\n","import * as RadixTabs from '@radix-ui/react-tabs';\n\nimport { cn } from '../../utils';\nimport { ScrollArea } from '../ScrollArea';\n\nimport { tabsListClass, tabsListWrapperClass } from './styles';\n\ntype Props = Omit<RadixTabs.TabsListProps, 'asChild'>;\n\nexport const TabsList = ({ className, children, ...rest }: Props) => (\n  <ScrollArea orientation=\"horizontal\" className={tabsListWrapperClass}>\n    <RadixTabs.List {...rest} data-slot=\"tabs-list\" className={cn(tabsListClass, className)}>\n      {children}\n    </RadixTabs.List>\n  </ScrollArea>\n);\n","import * as RadixTabs from '@radix-ui/react-tabs';\n\nimport { cn } from '../../utils';\n\nimport { tabsTriggerClass, tabsTriggerCompactClass } from './styles';\n\ntype Props = Omit<RadixTabs.TabsTriggerProps, 'asChild'> & {\n  compact?: boolean;\n};\n\nexport const TabsTrigger = ({ className, compact = false, ...rest }: Props) => (\n  <RadixTabs.Trigger\n    data-slot=\"tabs-trigger\"\n    {...rest}\n    className={cn(tabsTriggerClass, compact && tabsTriggerCompactClass, className)}\n  />\n);\n","import type { ReactNode } from 'react';\nimport * as RadixTabs from '@radix-ui/react-tabs';\n\nimport { X } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\n\nimport { tabsTriggerGroupClass } from './styles';\nimport { TabsList } from './TabsList';\nimport { TabsTrigger } from './TabsTrigger';\n\nexport type Trigger<T extends string> = {\n  value: T;\n  title: ReactNode;\n  onClose?: (value: T) => void;\n} & Omit<RadixTabs.TabsTriggerProps, 'title' | 'asChild'>;\n\ntype Props<T extends string> = {\n  triggers: readonly Trigger<T>[];\n  compact?: boolean;\n  children: ReactNode;\n  defaultValue?: string;\n  onValueChange?: (value: T) => void;\n  rootClassName?: string;\n  listClassName?: string;\n  triggerClassName?: string;\n  triggerGroupClassName?: string;\n} & Omit<RadixTabs.TabsProps, 'onValueChange'>;\n\nexport const Tabs = <T extends string>({\n  triggers,\n  compact = false,\n  children,\n  defaultValue,\n  onValueChange,\n  rootClassName,\n  listClassName,\n  triggerClassName,\n  triggerGroupClassName,\n  ...rest\n}: Props<T>) => (\n  <RadixTabs.Root\n    {...rest}\n    data-slot=\"tabs-root\"\n    className={cn('tw:flex tw:flex-col tw:gap-6', rootClassName)}\n    defaultValue={defaultValue ?? triggers[0]?.value}\n    onValueChange={onValueChange as (value: string) => void}\n  >\n    <TabsList className={listClassName}>\n      {triggers.map(({ value, title, onClose, className: callerClassName, ...triggerRest }) => (\n        <div\n          key={value}\n          className={cn(tabsTriggerGroupClass, triggerGroupClassName)}\n          data-slot=\"tabs-trigger-group\"\n        >\n          <TabsTrigger\n            value={value}\n            compact={compact}\n            {...triggerRest}\n            className={cn(triggerClassName, callerClassName)}\n          >\n            {title}\n          </TabsTrigger>\n          {onClose && (\n            <Button\n              type=\"button\"\n              variant=\"inline\"\n              size=\"icon-3xs\"\n              disabled={triggerRest.disabled}\n              onClick={() => onClose(value)}\n              onMouseDown={(e) => e.preventDefault()}\n              className=\"tw:!size-8 tw:opacity-0 tw:duration-200 tw:focus-visible:opacity-100 tw:group-focus-within/tab-trigger-group:opacity-100 tw:group-hover/tab-trigger-group:opacity-100\"\n              aria-label={typeof title === 'string' ? `Close ${title}` : 'Close tab'}\n            >\n              <X className=\"tw:size-4\" />\n            </Button>\n          )}\n        </div>\n      ))}\n    </TabsList>\n    {children}\n  </RadixTabs.Root>\n);\n","import * as RadixTabs from '@radix-ui/react-tabs';\n\nexport const TabsContent = (props: RadixTabs.TabsContentProps) => (\n  <RadixTabs.Content data-slot=\"tabs-content\" tabIndex={-1} {...props} />\n);\n"],"mappings":";;;;;;;AAKA,MAAa,uBACX;AAEF,MAAa,gBAAgB;AAE7B,MAAa,wBACX;AAQF,MAAa,mBACX;;;ACXF,MAAa,YAAY,EAAE,WAAW,UAAU,GAAG,WACjD,oBAAC,YAAD;CAAY,aAAY;CAAa,WAAW;CAC9C,UAAA,oBAAC,UAAU,MAAX;EAAgB,GAAI;EAAM,aAAU;EAAY,WAAW,GAAG,eAAe,SAAS;EACnF;CACa,CAAA;AACN,CAAA;;;ACJd,MAAa,eAAe,EAAE,WAAW,UAAU,OAAO,GAAG,WAC3D,oBAAC,UAAU,SAAX;CACE,aAAU;CACV,GAAI;CACJ,WAAW,GAAG,kBAAkB,WAAA,sBAAoC,SAAS;AAC9E,CAAA;;;ACcH,MAAa,QAA0B,EACrC,UACA,UAAU,OACV,UACA,cACA,eACA,eACA,eACA,kBACA,uBACA,GAAG,WAEH,qBAAC,UAAU,MAAX;CACE,GAAI;CACJ,aAAU;CACV,WAAW,GAAG,gCAAgC,aAAa;CAC3D,cAAc,gBAAgB,SAAS,EAAE,EAAE;CAC5B;CALjB,UAAA,CAOE,oBAAC,UAAD;EAAU,WAAW;EAClB,UAAA,SAAS,KAAK,EAAE,OAAO,OAAO,SAAS,WAAW,iBAAiB,GAAG,kBACrE,qBAAC,OAAD;GAEE,WAAW,GAAG,uBAAuB,qBAAqB;GAC1D,aAAU;GAHZ,UAAA,CAKE,oBAAC,aAAD;IACS;IACE;IACT,GAAI;IACJ,WAAW,GAAG,kBAAkB,eAAe;IAE9C,UAAA;GACU,CAAA,GACZ,WACC,oBAAC,QAAD;IACE,MAAK;IACL,SAAQ;IACR,MAAK;IACL,UAAU,YAAY;IACtB,eAAe,QAAQ,KAAK;IAC5B,cAAc,MAAM,EAAE,eAAe;IACrC,WAAU;IACV,cAAY,OAAO,UAAU,WAAW,SAAS,UAAU;IAE3D,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;GACpB,CAAA,CAEP;EA1BE,GAAA,KA0BF,CACN;CACO,CAAA,GACT,QACa;;;;AC/ElB,MAAa,eAAe,UAC1B,oBAAC,UAAU,SAAX;CAAmB,aAAU;CAAe,UAAU;CAAI,GAAI;AAAQ,CAAA"}

package/dist/TextInput-BGed-V13.js

@@ -0,0 +1,110 @@
+import { cn } from "./classNames-BzrkDnOD.js";
+import { createChangeInputEvent, createPrefixedString } from "./utils-D0c5VAyF.js";
+import { mergeRefs } from "./internal/utils/mergeRefs.js";
+import { X } from "./icons-Cek151jC.js";
+import { InputGroup } from "./InputGroup-BJWsI35s.js";
+import { useControllableState } from "./useControllableState-M6494mCT.js";
+import { useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/blocks/TextInput/utils.ts
+const genInputTestId = (prefix = "") => {
+	const ps = createPrefixedString(prefix);
+	return {
+		toString: () => prefix,
+		inputWrapper: ps`input-wrapper`,
+		input: ps`input`,
+		clearButton: ps`clear-button`
+	};
+};
+//#endregion
+//#region src/blocks/TextInput/TextInput.tsx
+const sanitizeTextInputValue = (value) => {
+	if (typeof value === "string" && value.trim() === "") return "";
+	return value;
+};
+/**
+* Standard text input with a string-only API, built on `InputGroup` chrome — addons, clear button,
+* sizing, focus variants. The default choice for a bare text input.
+*
+* **When to use:** any plain text / email / password / date-input field outside `useAppForm`. Pair with
+* `onValueChange` instead of unwrapping `event.target.value` from `onChange`.
+* **When NOT to use:** for fields inside a labelled group use `FormGroup.TextInput`; for forms with
+* validation use `useAppForm` + `field.TextField`; for search use `SearchInput`.
+* **Composition:** wrap in a `FormGroup` for shared error / help-text state, or render directly inside
+* page layouts. Chrome resolves from the active brand automatically: a modern brand always renders argo
+* (any `variant` is ignored), while `variant` only tunes the legacy-brand chrome.
+*/
+const TextInput = ({ ref: forwardedRef, state = "default", sizing = "default", className, prefix = null, rightSuffix = null, rightSuffixVariant = "default", leftSuffix = null, allowClear = false, onClear, disabled = false, testId: prefixTestId = "", autoFocus = false, id, name, variant, readOnly, type = "text", focusVariant = "default", onChange, onBlur, onValueChange, onValueBlur, value: valueProp, defaultValue, ...inputProps }) => {
+	const inputRef = useRef(null);
+	const [value, setValue] = useControllableState({
+		prop: valueProp === void 0 ? void 0 : sanitizeTextInputValue(valueProp) ?? "",
+		defaultProp: sanitizeTextInputValue(defaultValue) ?? "",
+		onChange: onValueChange
+	});
+	const testId = genInputTestId(prefixTestId);
+	const isClearButtonVisible = !!value && !disabled && !readOnly || !!onClear;
+	const handleChange = (event) => {
+		setValue(event.target.value);
+		onChange?.(event);
+	};
+	const handleBlur = (event) => {
+		onValueBlur?.(event.target.value);
+		onBlur?.(event);
+	};
+	const handleClear = () => {
+		if (inputRef.current === null) return;
+		inputRef.current.value = "";
+		inputRef.current.focus();
+		onClear?.();
+		handleChange(createChangeInputEvent(inputRef.current));
+	};
+	return /* @__PURE__ */ jsxs(InputGroup, {
+		state,
+		variant,
+		sizing,
+		focusVariant,
+		className,
+		"data-testid": testId.inputWrapper,
+		children: [
+			prefix && /* @__PURE__ */ jsx(InputGroup.Addon, {
+				align: "inline-start",
+				children: prefix
+			}),
+			/* @__PURE__ */ jsx(InputGroup.Input, {
+				...inputProps,
+				value,
+				autoFocus,
+				type,
+				onChange: handleChange,
+				onBlur: handleBlur,
+				ref: mergeRefs(forwardedRef ?? null, inputRef),
+				disabled,
+				id,
+				name,
+				readOnly,
+				"data-testid": testId.input
+			}),
+			(leftSuffix || allowClear || rightSuffix) && /* @__PURE__ */ jsxs(InputGroup.Addon, {
+				align: "inline-end",
+				children: [
+					leftSuffix,
+					allowClear && isClearButtonVisible && /* @__PURE__ */ jsx(InputGroup.Button, {
+						"aria-label": "Clear",
+						onMouseDown: (e) => e.preventDefault(),
+						onClick: handleClear,
+						"data-testid": testId.clearButton,
+						children: /* @__PURE__ */ jsx(X, { className: "tw:size-4" })
+					}),
+					rightSuffix && /* @__PURE__ */ jsx("div", {
+						className: cn({ "tw:whitespace-nowrap tw:bg-muted tw:px-4 tw:-mr-4 tw:py-2.5": rightSuffixVariant === "addon" }),
+						children: rightSuffix
+					})
+				]
+			})
+		]
+	});
+};
+//#endregion
+export { TextInput };
+
+//# sourceMappingURL=TextInput-BGed-V13.js.map

package/dist/TextInput-BGed-V13.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextInput-BGed-V13.js","names":[],"sources":["../src/blocks/TextInput/utils.ts","../src/blocks/TextInput/TextInput.tsx"],"sourcesContent":["import { createPrefixedString } from '../../utils';\n\nexport const genInputTestId = (prefix: string = '') => {\n  const ps = createPrefixedString(prefix);\n  return {\n    toString: () => prefix,\n    inputWrapper: ps`input-wrapper`,\n    input: ps`input`,\n    clearButton: ps`clear-button`,\n  };\n};\n","import { useRef } from 'react';\nimport type {\n  ChangeEventHandler,\n  ComponentProps,\n  ComponentRef,\n  FocusEventHandler,\n  MouseEventHandler,\n  ReactNode,\n} from 'react';\n\nimport { InputGroup } from '../../components/InputGroup';\nimport { useControllableState } from '../../hooks/useControllableState';\nimport { X } from '../../icons';\nimport { cn, createChangeInputEvent, mergeRefs } from '../../utils';\n\nimport { genInputTestId } from './utils';\n\ntype InputGroupProps = Pick<\n  ComponentProps<typeof InputGroup>,\n  'variant' | 'focusVariant' | 'sizing' | 'state'\n>;\n\ntype OwnProps = {\n  prefix?: ReactNode;\n  rightSuffix?: ReactNode;\n  rightSuffixVariant?: 'addon' | 'default';\n  leftSuffix?: ReactNode;\n  allowClear?: boolean;\n  onClear?: () => void;\n  testId?: string;\n  value?: string | null;\n  defaultValue?: string | null;\n  /** Called with the unwrapped string value on every change. For the raw event use `onChange`. */\n  onValueChange?: (value: string) => void;\n  /** Called with the unwrapped string value on blur. For the raw event use `onBlur`. */\n  onValueBlur?: (value: string) => void;\n  type?: 'text' | 'email' | 'password' | 'datetime-local' | 'date';\n};\n\n/**\n * Props for `TextInput`. Combines `InputGroup` chrome (variant / sizing / state / focusVariant) with\n * input-specific slots (`prefix`, `leftSuffix`, `rightSuffix`, `allowClear`) and a string-typed\n * `value` / `defaultValue` plus convenience `onValueChange` / `onValueBlur` callbacks. `null` /\n * `undefined` are coerced to empty strings.\n */\nexport type Props = InputGroupProps &\n  OwnProps &\n  Omit<ComponentProps<'input'>, 'prefix' | 'value' | 'defaultValue' | 'type' | 'accept' | 'step'>;\n\nconst sanitizeTextInputValue = (value: string | null | undefined) => {\n  if (typeof value === 'string' && value.trim() === '') return '';\n  return value;\n};\n\n/**\n * Standard text input with a string-only API, built on `InputGroup` chrome — addons, clear button,\n * sizing, focus variants. The default choice for a bare text input.\n *\n * **When to use:** any plain text / email / password / date-input field outside `useAppForm`. Pair with\n * `onValueChange` instead of unwrapping `event.target.value` from `onChange`.\n * **When NOT to use:** for fields inside a labelled group use `FormGroup.TextInput`; for forms with\n * validation use `useAppForm` + `field.TextField`; for search use `SearchInput`.\n * **Composition:** wrap in a `FormGroup` for shared error / help-text state, or render directly inside\n * page layouts. Chrome resolves from the active brand automatically: a modern brand always renders argo\n * (any `variant` is ignored), while `variant` only tunes the legacy-brand chrome.\n */\nexport const TextInput = ({\n  ref: forwardedRef,\n  state = 'default',\n  sizing = 'default',\n  className,\n  prefix = null,\n  rightSuffix = null,\n  rightSuffixVariant = 'default',\n  leftSuffix = null,\n  allowClear = false,\n  onClear,\n  disabled = false,\n  testId: prefixTestId = '',\n  autoFocus = false,\n  id,\n  name,\n  variant,\n  readOnly,\n  type = 'text',\n  focusVariant = 'default',\n  onChange,\n  onBlur,\n  onValueChange,\n  onValueBlur,\n  value: valueProp,\n  defaultValue,\n  ...inputProps\n}: Props) => {\n  const inputRef = useRef<ComponentRef<'input'>>(null);\n\n  const [value, setValue] = useControllableState<string>({\n    // `undefined` stays uncontrolled; any provided value (incl. `null`) is controlled and coerced\n    // to a string. Whitespace-only input collapses to '' via `sanitizeTextInputValue`.\n    prop: valueProp === undefined ? undefined : (sanitizeTextInputValue(valueProp) ?? ''),\n    defaultProp: sanitizeTextInputValue(defaultValue) ?? '',\n    onChange: onValueChange,\n  });\n\n  const testId = genInputTestId(prefixTestId);\n  const isClearButtonVisible = (!!value && !disabled && !readOnly) || !!onClear;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    setValue(event.target.value);\n    onChange?.(event);\n  };\n\n  const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n    onValueBlur?.(event.target.value);\n    onBlur?.(event);\n  };\n\n  const handleClear: MouseEventHandler<HTMLButtonElement> = () => {\n    if (inputRef.current === null) return;\n    inputRef.current.value = ''; // keep the DOM node in sync before firing the synthetic change\n    inputRef.current.focus();\n    onClear?.();\n    handleChange(createChangeInputEvent(inputRef.current));\n  };\n\n  return (\n    <InputGroup\n      state={state}\n      variant={variant}\n      sizing={sizing}\n      focusVariant={focusVariant}\n      className={className}\n      data-testid={testId.inputWrapper}\n    >\n      {prefix && <InputGroup.Addon align=\"inline-start\">{prefix}</InputGroup.Addon>}\n\n      <InputGroup.Input\n        {...inputProps}\n        value={value}\n        autoFocus={autoFocus}\n        type={type}\n        onChange={handleChange}\n        onBlur={handleBlur}\n        ref={mergeRefs(forwardedRef ?? null, inputRef)}\n        disabled={disabled}\n        id={id}\n        name={name}\n        readOnly={readOnly}\n        data-testid={testId.input}\n      />\n\n      {(leftSuffix || allowClear || rightSuffix) && (\n        <InputGroup.Addon align=\"inline-end\">\n          {leftSuffix}\n          {allowClear && isClearButtonVisible && (\n            <InputGroup.Button\n              aria-label=\"Clear\"\n              onMouseDown={(e) => e.preventDefault()}\n              onClick={handleClear}\n              data-testid={testId.clearButton}\n            >\n              <X className=\"tw:size-4\" />\n            </InputGroup.Button>\n          )}\n          {rightSuffix && (\n            <div\n              className={cn({\n                'tw:whitespace-nowrap tw:bg-muted tw:px-4 tw:-mr-4 tw:py-2.5':\n                  rightSuffixVariant === 'addon',\n              })}\n            >\n              {rightSuffix}\n            </div>\n          )}\n        </InputGroup.Addon>\n      )}\n    </InputGroup>\n  );\n};\n"],"mappings":";;;;;;;;;AAEA,MAAa,kBAAkB,SAAiB,OAAO;CACrD,MAAM,KAAK,qBAAqB,MAAM;CACtC,OAAO;EACL,gBAAgB;EAChB,cAAc,EAAE;EAChB,OAAO,EAAE;EACT,aAAa,EAAE;CACjB;AACF;;;ACuCA,MAAM,0BAA0B,UAAqC;CACnE,IAAI,OAAO,UAAU,YAAY,MAAM,KAAK,MAAM,IAAI,OAAO;CAC7D,OAAO;AACT;;;;;;;;;;;;;AAcA,MAAa,aAAa,EACxB,KAAK,cACL,QAAQ,WACR,SAAS,WACT,WACA,SAAS,MACT,cAAc,MACd,qBAAqB,WACrB,aAAa,MACb,aAAa,OACb,SACA,WAAW,OACX,QAAQ,eAAe,IACvB,YAAY,OACZ,IACA,MACA,SACA,UACA,OAAO,QACP,eAAe,WACf,UACA,QACA,eACA,aACA,OAAO,WACP,cACA,GAAG,iBACQ;CACX,MAAM,WAAW,OAA8B,IAAI;CAEnD,MAAM,CAAC,OAAO,YAAY,qBAA6B;EAGrD,MAAM,cAAc,KAAA,IAAY,KAAA,IAAa,uBAAuB,SAAS,KAAK;EAClF,aAAa,uBAAuB,YAAY,KAAK;EACrD,UAAU;CACZ,CAAC;CAED,MAAM,SAAS,eAAe,YAAY;CAC1C,MAAM,uBAAwB,CAAC,CAAC,SAAS,CAAC,YAAY,CAAC,YAAa,CAAC,CAAC;CAEtE,MAAM,gBAAsD,UAAU;EACpE,SAAS,MAAM,OAAO,KAAK;EAC3B,WAAW,KAAK;CAClB;CAEA,MAAM,cAAmD,UAAU;EACjE,cAAc,MAAM,OAAO,KAAK;EAChC,SAAS,KAAK;CAChB;CAEA,MAAM,oBAA0D;EAC9D,IAAI,SAAS,YAAY,MAAM;EAC/B,SAAS,QAAQ,QAAQ;EACzB,SAAS,QAAQ,MAAM;EACvB,UAAU;EACV,aAAa,uBAAuB,SAAS,OAAO,CAAC;CACvD;CAEA,OACE,qBAAC,YAAD;EACS;EACE;EACD;EACM;EACH;EACX,eAAa,OAAO;EANtB,UAAA;GAQG,UAAU,oBAAC,WAAW,OAAZ;IAAkB,OAAM;IAAgB,UAAA;GAAyB,CAAA;GAE5E,oBAAC,WAAW,OAAZ;IACE,GAAI;IACG;IACI;IACL;IACN,UAAU;IACV,QAAQ;IACR,KAAK,UAAU,gBAAgB,MAAM,QAAQ;IACnC;IACN;IACE;IACI;IACV,eAAa,OAAO;GACrB,CAAA;IAEC,cAAc,cAAc,gBAC5B,qBAAC,WAAW,OAAZ;IAAkB,OAAM;IAAxB,UAAA;KACG;KACA,cAAc,wBACb,oBAAC,WAAW,QAAZ;MACE,cAAW;MACX,cAAc,MAAM,EAAE,eAAe;MACrC,SAAS;MACT,eAAa,OAAO;MAEpB,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;KACT,CAAA;KAEpB,eACC,oBAAC,OAAD;MACE,WAAW,GAAG,EACZ,+DACE,uBAAuB,QAC3B,CAAC;MAEA,UAAA;KACE,CAAA;IAES;;EAEV;;AAEhB"}

package/dist/ThemeProvider-QncUrfJn.js

@@ -0,0 +1,203 @@
+import { TooltipProvider } from "./utils-D0c5VAyF.js";
+import { DEFAULT_BRANDS, ThemeContext, createCssVars, createTheme, defaultBrand } from "./context-KxxeMHbR.js";
+import { useBrandState, useColorSchemeState } from "./useColorSchemeState-CYqcUfSH.js";
+import { useInsertionEffect, useMemo } from "react";
+import { brandSchema, exampleCustomer, keboola as keboola$1, keboolaLegacySidebar as keboolaLegacySidebar$1, keboolaLegacyTopnav as keboolaLegacyTopnav$1 } from "@keboola/brand-registry";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/ThemeProvider/AIGradientSvg.tsx
+const AIGradientsSvg = () => /* @__PURE__ */ jsx("svg", {
+	width: "0",
+	height: "0",
+	style: {
+		position: "absolute",
+		visibility: "hidden"
+	},
+	children: /* @__PURE__ */ jsxs("defs", { children: [/* @__PURE__ */ jsxs("linearGradient", {
+		id: "aigradient-600",
+		x1: "0%",
+		y1: "0%",
+		x2: "100%",
+		y2: "100%",
+		children: [
+			/* @__PURE__ */ jsx("stop", {
+				offset: "0%",
+				stopColor: "#61E4FF"
+			}),
+			/* @__PURE__ */ jsx("stop", {
+				offset: "50%",
+				stopColor: "#1F8FFF"
+			}),
+			/* @__PURE__ */ jsx("stop", {
+				offset: "100%",
+				stopColor: "#7C5CFF"
+			})
+		]
+	}), /* @__PURE__ */ jsxs("linearGradient", {
+		id: "aigradient-700",
+		x1: "0%",
+		y1: "0%",
+		x2: "100%",
+		y2: "100%",
+		children: [/* @__PURE__ */ jsx("stop", {
+			offset: "0%",
+			stopColor: "#075fb8"
+		}), /* @__PURE__ */ jsx("stop", {
+			offset: "100%",
+			stopColor: "#5b2cb8"
+		})]
+	})] })
+});
+//#endregion
+//#region src/components/ThemeProvider/useThemeTokens.ts
+const brandThemeToTokens = (theme, scheme) => ({
+	colors: scheme === "dark" ? theme.colorsDark : theme.colors,
+	typography: theme.typography,
+	radii: theme.radii,
+	shadows: theme.shadows,
+	spacing: theme.spacing,
+	motion: theme.motion,
+	gradient: theme.gradient
+});
+const tokensToCssVars = ({ colors, typography, radii, shadows, spacing, motion, gradient }) => {
+	const vars = createCssVars();
+	vars.set("--background", colors?.background);
+	vars.set("--foreground", colors?.foreground);
+	vars.set("--muted", colors?.muted);
+	vars.set("--muted-foreground", colors?.mutedForeground);
+	vars.set("--border", colors?.border);
+	vars.set("--input", colors?.input);
+	vars.set("--input-background", colors?.inputBackground);
+	vars.set("--ring", colors?.ring);
+	vars.set("--ring-offset", colors?.ringOffset);
+	vars.set("--primary", colors?.primary);
+	vars.set("--primary-foreground", colors?.primaryForeground);
+	vars.set("--secondary", colors?.secondary);
+	vars.set("--secondary-foreground", colors?.secondaryForeground);
+	vars.set("--accent", colors?.accent);
+	vars.set("--accent-foreground", colors?.accentForeground);
+	vars.set("--card", colors?.card);
+	vars.set("--card-foreground", colors?.cardForeground);
+	vars.set("--popover", colors?.popover);
+	vars.set("--popover-foreground", colors?.popoverForeground);
+	vars.set("--destructive", colors?.destructive);
+	vars.set("--destructive-foreground", colors?.destructiveForeground);
+	vars.set("--success", colors?.success);
+	vars.set("--success-foreground", colors?.successForeground);
+	vars.set("--warning", colors?.warning);
+	vars.set("--warning-foreground", colors?.warningForeground);
+	vars.set("--info", colors?.info);
+	vars.set("--info-foreground", colors?.infoForeground);
+	vars.set("--chart-1", colors?.chart?.chart1);
+	vars.set("--chart-2", colors?.chart?.chart2);
+	vars.set("--chart-3", colors?.chart?.chart3);
+	vars.set("--chart-4", colors?.chart?.chart4);
+	vars.set("--chart-5", colors?.chart?.chart5);
+	vars.set("--sidebar", colors?.sidebar?.sidebar);
+	vars.set("--sidebar-foreground", colors?.sidebar?.sidebarForeground);
+	vars.set("--sidebar-primary", colors?.sidebar?.sidebarPrimary);
+	vars.set("--sidebar-primary-foreground", colors?.sidebar?.sidebarPrimaryForeground);
+	vars.set("--sidebar-accent", colors?.sidebar?.sidebarAccent);
+	vars.set("--sidebar-accent-foreground", colors?.sidebar?.sidebarAccentForeground);
+	vars.set("--sidebar-border", colors?.sidebar?.sidebarBorder);
+	vars.set("--sidebar-ring", colors?.sidebar?.sidebarRing);
+	/**
+	* TYPOGRAPHY
+	*/
+	vars.set("--font-sans", typography?.fontFamily?.trim() || void 0);
+	vars.set("--font-display", typography?.fontDisplay?.trim() || void 0);
+	vars.set("--font-mono", typography?.fontMono?.trim() || void 0);
+	vars.set("--font-weight-normal", typography?.weight?.normal);
+	vars.set("--font-weight-medium", typography?.weight?.medium);
+	vars.set("--font-weight-semibold", typography?.weight?.semibold);
+	vars.set("--font-weight-bold", typography?.weight?.bold);
+	vars.set("--letter-spacing-chrome", typography?.letterSpacing?.chrome);
+	vars.set("--type-display-size", typography?.typeScale?.display?.size);
+	vars.set("--type-display-weight", typography?.typeScale?.display?.weight);
+	vars.set("--type-display-leading", typography?.typeScale?.display?.leading);
+	vars.set("--type-display-tracking", typography?.typeScale?.display?.tracking);
+	vars.set("--type-heading-size", typography?.typeScale?.heading?.size);
+	vars.set("--type-heading-weight", typography?.typeScale?.heading?.weight);
+	vars.set("--type-heading-leading", typography?.typeScale?.heading?.leading);
+	vars.set("--type-heading-tracking", typography?.typeScale?.heading?.tracking);
+	vars.set("--type-body-size", typography?.typeScale?.body?.size);
+	vars.set("--type-body-weight", typography?.typeScale?.body?.weight);
+	vars.set("--type-body-leading", typography?.typeScale?.body?.leading);
+	vars.set("--type-body-tracking", typography?.typeScale?.body?.tracking);
+	vars.set("--radius-sm", radii?.sm);
+	vars.set("--radius-md", radii?.md);
+	vars.set("--radius-lg", radii?.lg);
+	/**
+	* ELEVATION / DENSITY / MOTION / GRADIENT
+	*/
+	vars.set("--shadow-sm", shadows?.sm);
+	vars.set("--shadow-md", shadows?.md);
+	vars.set("--shadow-lg", shadows?.lg);
+	vars.set("--shadow-lift", shadows?.lift);
+	vars.set("--space-gutter", spacing?.gutter);
+	vars.set("--space-inset", spacing?.inset);
+	vars.set("--motion-duration", motion?.duration);
+	vars.set("--motion-easing", motion?.easing);
+	vars.set("--gradient-brand", gradient?.brand);
+	return vars.expose();
+};
+const setTokens = (node, vars) => {
+	for (const [name, value] of Object.entries(vars)) node.style.setProperty(name, value);
+};
+const removeTokens = (node, vars) => {
+	for (const name of Object.keys(vars)) node.style.removeProperty(name);
+};
+const useThemeTokens = (tokens) => {
+	useInsertionEffect(() => {
+		if (typeof document === "undefined") return;
+		const root = document.documentElement;
+		const vars = tokensToCssVars(tokens);
+		setTokens(root, vars);
+		return () => removeTokens(root, vars);
+	}, [tokens]);
+};
+//#endregion
+//#region src/components/ThemeProvider/ThemeProvider.tsx
+const ThemeProvider = ({ defaultScheme, scheme, onSchemeChange, defaultBrandId, brandId, onBrandIdChange, brands = DEFAULT_BRANDS, children }) => {
+	const colorSchemeState = useColorSchemeState({
+		defaultScheme,
+		scheme,
+		onSchemeChange
+	});
+	const brandState = useBrandState({
+		defaultBrandId,
+		brandId,
+		onBrandIdChange
+	});
+	const brand = useMemo(() => brands.find((item) => item.id === brandState.brandId) ?? defaultBrand, [brands, brandState.brandId]);
+	const themes = useMemo(() => brands.map(createTheme), [brands]);
+	const currentTheme = useMemo(() => createTheme(brand), [brand]);
+	const themeTokens = useMemo(() => brandThemeToTokens(brand.theme, colorSchemeState.resolvedScheme), [brand, colorSchemeState.resolvedScheme]);
+	useThemeTokens(themeTokens);
+	const { scheme: activeScheme, resolvedScheme, setScheme } = colorSchemeState;
+	const { brandId: activeBrandId, setBrand } = brandState;
+	const context = useMemo(() => ({
+		scheme: activeScheme,
+		resolvedScheme,
+		setScheme,
+		brandId: activeBrandId,
+		setBrand,
+		themes,
+		currentTheme
+	}), [
+		activeScheme,
+		resolvedScheme,
+		setScheme,
+		activeBrandId,
+		setBrand,
+		themes,
+		currentTheme
+	]);
+	return /* @__PURE__ */ jsxs(ThemeContext, {
+		value: context,
+		children: [/* @__PURE__ */ jsx(AIGradientsSvg, {}), /* @__PURE__ */ jsx(TooltipProvider, { children })]
+	});
+};
+//#endregion
+export { ThemeProvider, brandSchema, exampleCustomer, keboola$1 as keboola, keboolaLegacySidebar$1 as keboolaLegacySidebar, keboolaLegacyTopnav$1 as keboolaLegacyTopnav };
+
+//# sourceMappingURL=ThemeProvider-QncUrfJn.js.map

package/dist/ThemeProvider-QncUrfJn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider-QncUrfJn.js","names":[],"sources":["../src/components/ThemeProvider/AIGradientSvg.tsx","../src/components/ThemeProvider/useThemeTokens.ts","../src/components/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["export const AIGradientsSvg = () => (\n  <svg width=\"0\" height=\"0\" style={{ position: 'absolute', visibility: 'hidden' }}>\n    <defs>\n      {/*aigradient-600*/}\n      <linearGradient id=\"aigradient-600\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n        <stop offset=\"0%\" stopColor=\"#61E4FF\" />\n        <stop offset=\"50%\" stopColor=\"#1F8FFF\" />\n        <stop offset=\"100%\" stopColor=\"#7C5CFF\" />\n      </linearGradient>\n\n      {/*aigradient-700*/}\n      <linearGradient id=\"aigradient-700\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n        <stop offset=\"0%\" stopColor=\"#075fb8\" />\n        <stop offset=\"100%\" stopColor=\"#5b2cb8\" />\n      </linearGradient>\n    </defs>\n  </svg>\n);\n","import { useInsertionEffect } from 'react';\n\nimport type {\n  BrandTheme,\n  Colors,\n  Gradient,\n  Motion,\n  Radii,\n  Shadows,\n  Spacing,\n  Typography,\n} from '@keboola/brand-registry';\n\nimport type { ResolvedColorScheme } from './types';\nimport { createCssVars } from './utils';\n\nexport type ThemeTokens = {\n  colors?: Colors;\n  typography?: Typography;\n  radii?: Radii;\n  shadows?: Shadows;\n  spacing?: Spacing;\n  motion?: Motion;\n  gradient?: Gradient;\n};\n\nexport const brandThemeToTokens = (\n  theme: BrandTheme,\n  scheme: ResolvedColorScheme,\n): ThemeTokens => ({\n  colors: scheme === 'dark' ? theme.colorsDark : theme.colors,\n  typography: theme.typography,\n  radii: theme.radii,\n  // Scheme-independent — the same values apply in light and dark.\n  shadows: theme.shadows,\n  spacing: theme.spacing,\n  motion: theme.motion,\n  gradient: theme.gradient,\n});\n\nexport const tokensToCssVars = ({\n  colors,\n  typography,\n  radii,\n  shadows,\n  spacing,\n  motion,\n  gradient,\n}: ThemeTokens): Record<string, string> => {\n  const vars = createCssVars();\n\n  vars.set('--background', colors?.background);\n  vars.set('--foreground', colors?.foreground);\n  vars.set('--muted', colors?.muted);\n  vars.set('--muted-foreground', colors?.mutedForeground);\n  vars.set('--border', colors?.border);\n  vars.set('--input', colors?.input);\n  vars.set('--input-background', colors?.inputBackground);\n  vars.set('--ring', colors?.ring);\n  vars.set('--ring-offset', colors?.ringOffset);\n  vars.set('--primary', colors?.primary);\n  vars.set('--primary-foreground', colors?.primaryForeground);\n  vars.set('--secondary', colors?.secondary);\n  vars.set('--secondary-foreground', colors?.secondaryForeground);\n  vars.set('--accent', colors?.accent);\n  vars.set('--accent-foreground', colors?.accentForeground);\n  vars.set('--card', colors?.card);\n  vars.set('--card-foreground', colors?.cardForeground);\n  vars.set('--popover', colors?.popover);\n  vars.set('--popover-foreground', colors?.popoverForeground);\n  vars.set('--destructive', colors?.destructive);\n  vars.set('--destructive-foreground', colors?.destructiveForeground);\n  vars.set('--success', colors?.success);\n  vars.set('--success-foreground', colors?.successForeground);\n  vars.set('--warning', colors?.warning);\n  vars.set('--warning-foreground', colors?.warningForeground);\n  vars.set('--info', colors?.info);\n  vars.set('--info-foreground', colors?.infoForeground);\n\n  vars.set('--chart-1', colors?.chart?.chart1);\n  vars.set('--chart-2', colors?.chart?.chart2);\n  vars.set('--chart-3', colors?.chart?.chart3);\n  vars.set('--chart-4', colors?.chart?.chart4);\n  vars.set('--chart-5', colors?.chart?.chart5);\n\n  vars.set('--sidebar', colors?.sidebar?.sidebar);\n  vars.set('--sidebar-foreground', colors?.sidebar?.sidebarForeground);\n  vars.set('--sidebar-primary', colors?.sidebar?.sidebarPrimary);\n  vars.set('--sidebar-primary-foreground', colors?.sidebar?.sidebarPrimaryForeground);\n  vars.set('--sidebar-accent', colors?.sidebar?.sidebarAccent);\n  vars.set('--sidebar-accent-foreground', colors?.sidebar?.sidebarAccentForeground);\n  vars.set('--sidebar-border', colors?.sidebar?.sidebarBorder);\n  vars.set('--sidebar-ring', colors?.sidebar?.sidebarRing);\n\n  /**\n   * TYPOGRAPHY\n   */\n  vars.set('--font-sans', typography?.fontFamily?.trim() || undefined);\n  vars.set('--font-display', typography?.fontDisplay?.trim() || undefined);\n  vars.set('--font-mono', typography?.fontMono?.trim() || undefined);\n\n  // Chrome font-weight slots — read by Tailwind's `fontWeight` scale.\n  vars.set('--font-weight-normal', typography?.weight?.normal);\n  vars.set('--font-weight-medium', typography?.weight?.medium);\n  vars.set('--font-weight-semibold', typography?.weight?.semibold);\n  vars.set('--font-weight-bold', typography?.weight?.bold);\n\n  // Chrome tracking — behind Button/Badge `tracking-chrome`.\n  vars.set('--letter-spacing-chrome', typography?.letterSpacing?.chrome);\n\n  // Type scale — display/heading/body steps read by `text-display/heading/body`.\n  vars.set('--type-display-size', typography?.typeScale?.display?.size);\n  vars.set('--type-display-weight', typography?.typeScale?.display?.weight);\n  vars.set('--type-display-leading', typography?.typeScale?.display?.leading);\n  vars.set('--type-display-tracking', typography?.typeScale?.display?.tracking);\n  vars.set('--type-heading-size', typography?.typeScale?.heading?.size);\n  vars.set('--type-heading-weight', typography?.typeScale?.heading?.weight);\n  vars.set('--type-heading-leading', typography?.typeScale?.heading?.leading);\n  vars.set('--type-heading-tracking', typography?.typeScale?.heading?.tracking);\n  vars.set('--type-body-size', typography?.typeScale?.body?.size);\n  vars.set('--type-body-weight', typography?.typeScale?.body?.weight);\n  vars.set('--type-body-leading', typography?.typeScale?.body?.leading);\n  vars.set('--type-body-tracking', typography?.typeScale?.body?.tracking);\n\n  vars.set('--radius-sm', radii?.sm);\n  vars.set('--radius-md', radii?.md);\n  vars.set('--radius-lg', radii?.lg);\n\n  /**\n   * ELEVATION / DENSITY / MOTION / GRADIENT\n   */\n  vars.set('--shadow-sm', shadows?.sm);\n  vars.set('--shadow-md', shadows?.md);\n  vars.set('--shadow-lg', shadows?.lg);\n  vars.set('--shadow-lift', shadows?.lift);\n\n  vars.set('--space-gutter', spacing?.gutter);\n  vars.set('--space-inset', spacing?.inset);\n\n  vars.set('--motion-duration', motion?.duration);\n  vars.set('--motion-easing', motion?.easing);\n\n  vars.set('--gradient-brand', gradient?.brand);\n\n  return vars.expose();\n};\n\nconst setTokens = (node: HTMLElement, vars: Record<string, string>) => {\n  for (const [name, value] of Object.entries(vars)) {\n    node.style.setProperty(name, value);\n  }\n};\n\nconst removeTokens = (node: HTMLElement, vars: Record<string, string>) => {\n  for (const name of Object.keys(vars)) {\n    node.style.removeProperty(name);\n  }\n};\n\nexport const useThemeTokens = (tokens: ThemeTokens) => {\n  // Insertion effect: runs before the DOM mutates and before any (descendant)\n  // layout effect measures token-dependent geometry. Write-only, so it fits the\n  // hook's constraints. Only the brand's overrides are set; unset slots fall\n  // through to the stylesheet's `:root` / `[data-theme='dark']` defaults.\n  useInsertionEffect(() => {\n    if (typeof document === 'undefined') return;\n    const root = document.documentElement;\n    const vars = tokensToCssVars(tokens);\n\n    setTokens(root, vars);\n\n    return () => removeTokens(root, vars);\n  }, [tokens]);\n};\n","import { type ReactNode, useMemo } from 'react';\n\nimport type { Brand } from '@keboola/brand-registry';\n\nimport { TooltipProvider } from '../Tooltip';\n\nimport { AIGradientsSvg } from './AIGradientSvg';\nimport { ThemeContext, type ThemeContextValue } from './context';\nimport { DEFAULT_BRANDS, defaultBrand } from './defaults';\nimport { type UseBrandOptions, useBrandState } from './useBrandState';\nimport { type UseColorSchemeOptions, useColorSchemeState } from './useColorSchemeState';\nimport { brandThemeToTokens, useThemeTokens } from './useThemeTokens';\nimport { createTheme } from './utils';\n\ntype Props = UseColorSchemeOptions &\n  UseBrandOptions & {\n    /** Brands this provider knows about; the active brand id resolves against these. */\n    brands?: readonly Brand[];\n    children: ReactNode;\n  };\n\nexport const ThemeProvider = ({\n  defaultScheme,\n  scheme,\n  onSchemeChange,\n  defaultBrandId,\n  brandId,\n  onBrandIdChange,\n  brands = DEFAULT_BRANDS,\n  children,\n}: Props) => {\n  const colorSchemeState = useColorSchemeState({\n    defaultScheme,\n    scheme,\n    onSchemeChange,\n  });\n\n  const brandState = useBrandState({\n    defaultBrandId,\n    brandId,\n    onBrandIdChange,\n  });\n\n  // Resolve the active brand; an unknown id (incl. the default sentinel) falls\n  // back to `defaultBrand`, whose empty theme injects nothing so the stylesheet\n  // defaults apply.\n  const brand = useMemo(\n    () => brands.find((item) => item.id === brandState.brandId) ?? defaultBrand,\n    [brands, brandState.brandId],\n  );\n  const themes = useMemo(() => brands.map(createTheme), [brands]);\n  const currentTheme = useMemo(() => createTheme(brand), [brand]);\n\n  // Only the brand's overrides for the resolved scheme are injected; every slot\n  // it omits (including a missing dark palette) falls through to the stylesheet's\n  // `:root` / `[data-theme='dark']` defaults — so dark mode works for any brand.\n  const themeTokens = useMemo(\n    () => brandThemeToTokens(brand.theme, colorSchemeState.resolvedScheme),\n    [brand, colorSchemeState.resolvedScheme],\n  );\n\n  useThemeTokens(themeTokens);\n\n  const { scheme: activeScheme, resolvedScheme, setScheme } = colorSchemeState;\n  const { brandId: activeBrandId, setBrand } = brandState;\n  const context = useMemo<ThemeContextValue>(\n    () => ({\n      scheme: activeScheme,\n      resolvedScheme,\n      setScheme,\n      brandId: activeBrandId,\n      setBrand,\n      themes,\n      currentTheme,\n    }),\n    [activeScheme, resolvedScheme, setScheme, activeBrandId, setBrand, themes, currentTheme],\n  );\n\n  return (\n    <ThemeContext value={context}>\n      <AIGradientsSvg />\n      <TooltipProvider>{children}</TooltipProvider>\n    </ThemeContext>\n  );\n};\n"],"mappings":"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"}