@keboola/design 13.1.3 → 13.2.0

package/dist/{BrandEditor-P8OZX2hi.js → BrandEditor-Dq168RJc.js}

@@ -1,13 +1,13 @@
-import { Button } from "./Button-B21oVcPU.js";
-import { ToggleGroup } from "./ToggleGroup-Cy_10Mvu.js";
+import { Button } from "./Button-D2JqBAq7.js";
+import { ToggleGroup } from "./ToggleGroup-BOz1yyz6.js";
 import { Label } from "./internal/components/Label.js";
-import { TextInput } from "./TextInput-BWYXbfs4.js";
-import { Slider } from "./Slider-B0ou9r0B.js";
-import { Select } from "./Select-B4uK0QVm.js";
-import { Badge } from "./Badge-Dz0cj6rj.js";
-import { ColorInput } from "./ColorInput-B3gBZ8Ya.js";
+import { TextInput } from "./TextInput-B5TDDOty.js";
+import { Slider } from "./Slider-Rcc2qVct.js";
+import { Select } from "./Select-CjQgU_6K.js";
+import { Badge } from "./Badge-Ba3epgcI.js";
+import { ColorInput } from "./ColorInput-D1nC0X6i.js";
 import { Textarea } from "./internal/blocks/Textarea.js";
-import { Collapsible } from "./Collapsible-BQXWEOBC.js";
+import { Collapsible } from "./Collapsible-DD4xTL75.js";
 import { useId, useMemo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { keboola } from "@keboola/brand-registry";
@@ -197,6 +197,23 @@ const COLOR_LABELS = {
 	info: "Info",
 	infoForeground: "Info foreground"
 };
+const STATE_COLOR_LABELS = {
+	hover: "Hover",
+	hoverForeground: "Hover foreground",
+	pressed: "Pressed",
+	selected: "Selected",
+	selectedForeground: "Selected foreground",
+	scrim: "Scrim (modal backdrop)"
+};
+const STATE_COLOR_DEFAULTS = {
+	hover: "Follows accent (menus, table rows: their own tint)",
+	hoverForeground: "Follows accent foreground",
+	pressed: "Reserved: no component reads it yet",
+	selected: "Follows accent",
+	selectedForeground: "Follows accent foreground",
+	scrim: "rgb(0 0 0 / 0.5)"
+};
+const DEFAULT_DISABLED_OPACITY = "0.5";
 const SIDEBAR_LABELS = {
 	sidebar: "Sidebar",
 	sidebarForeground: "Foreground",
@@ -207,6 +224,12 @@ const SIDEBAR_LABELS = {
 	sidebarBorder: "Border",
 	sidebarRing: "Ring"
 };
+const SIDEBAR_STATE_LABELS = {
+	sidebarHover: "Hover",
+	sidebarHoverForeground: "Hover foreground",
+	sidebarSelected: "Selected (current page)",
+	sidebarSelectedForeground: "Selected foreground"
+};
 const CHART_LABELS = {
 	chart1: "Chart 1",
 	chart2: "Chart 2",
@@ -235,6 +258,8 @@ const MOTION_LABELS = {
 	easing: "Easing"
 };
 const COLOR_SLOTS = Object.keys(COLOR_LABELS);
+const STATE_COLOR_SLOTS = Object.keys(STATE_COLOR_LABELS);
+const SIDEBAR_STATE_SLOTS = Object.keys(SIDEBAR_STATE_LABELS);
 const SIDEBAR_SLOTS = Object.keys(SIDEBAR_LABELS);
 const CHART_SLOTS = Object.keys(CHART_LABELS);
 const WEIGHT_SLOTS = Object.keys(WEIGHT_LABELS);
@@ -244,7 +269,12 @@ const MOTION_SLOTS = Object.keys(MOTION_LABELS);
 const RADIUS_SIZES = [
 	"sm",
 	"md",
-	"lg"
+	"lg",
+	"card",
+	"popover",
+	"modal",
+	"sheet",
+	"toast"
 ];
 const A11Y_PAIRS = [
 	{
@@ -300,6 +330,11 @@ const DEFAULT_RADII = {
 	md: "0.375rem",
 	lg: "0.5rem"
 };
+const surfaceRadiusFallback = (size, radii) => {
+	if (size === "popover") return "1rem";
+	if (size === "modal") return "1.5rem";
+	return radii.lg;
+};
 const DEFAULT_CHART = {
 	light: {
 		chart1: "31 143 255",
@@ -420,6 +455,42 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 			}
 		});
 	};
+	const setStateColor = (slot, color) => {
+		const next = color.trim() || void 0;
+		if (colorScheme === "light") {
+			onChange({
+				...value,
+				theme: {
+					...theme,
+					colors: {
+						...theme.colors,
+						[slot]: next
+					}
+				}
+			});
+			return;
+		}
+		onChange({
+			...value,
+			theme: {
+				...theme,
+				colorsDark: {
+					...theme.colorsDark,
+					[slot]: next
+				}
+			}
+		});
+	};
+	const setDisabledOpacity = (disabled) => onChange({
+		...value,
+		theme: {
+			...theme,
+			opacity: {
+				...theme.opacity,
+				disabled
+			}
+		}
+	});
 	const setSidebarColor = (slot, channels) => {
 		if (colorScheme === "light") {
 			const base = theme.colors?.sidebar ?? DEFAULT_SIDEBAR.light;
@@ -453,6 +524,24 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 			}
 		});
 	};
+	const setSidebarState = (slot, color) => {
+		const next = color.trim() || void 0;
+		const palette = colorScheme === "light" ? "colors" : "colorsDark";
+		const sidebar = {
+			...theme[palette]?.sidebar ?? DEFAULT_SIDEBAR[colorScheme],
+			[slot]: next
+		};
+		onChange({
+			...value,
+			theme: {
+				...theme,
+				[palette]: {
+					...theme[palette],
+					sidebar
+				}
+			}
+		});
+	};
 	const setChart = (slot, channels) => {
 		const chart = {
 			...chartColors ?? DEFAULT_CHART[colorScheme],
@@ -623,6 +712,49 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 					})
 				})]
 			}),
+			/* @__PURE__ */ jsxs(ControlSection, {
+				title: "Interaction states",
+				children: [
+					/* @__PURE__ */ jsxs("p", {
+						className: "tw:m-0 tw:text-xs tw:text-muted-foreground",
+						children: [
+							"Hover, pressed, selected and backdrop colours for the ",
+							colorScheme,
+							" palette, as any CSS colour so a wash can be translucent. Empty follows the default."
+						]
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "tw:flex tw:flex-col tw:gap-2",
+						children: STATE_COLOR_SLOTS.map((slot) => /* @__PURE__ */ jsx(TextField, {
+							id: `${baseId}state-${colorScheme}-${slot}`,
+							label: STATE_COLOR_LABELS[slot],
+							value: coreColors?.[slot] ?? "",
+							placeholder: STATE_COLOR_DEFAULTS[slot],
+							onChange: (next) => setStateColor(slot, next)
+						}, slot))
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "tw:flex tw:flex-col tw:gap-1",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "tw:flex tw:items-center tw:justify-between",
+							children: [/* @__PURE__ */ jsx(Label, {
+								className: "tw:text-xs tw:font-normal tw:text-foreground",
+								children: "Disabled opacity"
+							}), /* @__PURE__ */ jsx("span", {
+								className: "tw:text-xs tw:tabular-nums tw:text-muted-foreground",
+								children: theme.opacity?.disabled ?? DEFAULT_DISABLED_OPACITY
+							})]
+						}), /* @__PURE__ */ jsx(Slider, {
+							"aria-label": "Disabled opacity",
+							min: .2,
+							max: .8,
+							step: .05,
+							value: [Number(theme.opacity?.disabled ?? DEFAULT_DISABLED_OPACITY)],
+							onValueChange: (values) => setDisabledOpacity((values[0] ?? .5).toFixed(2))
+						})]
+					})
+				]
+			}),
 			/* @__PURE__ */ jsx(ControlSection, {
 				title: "Sidebar colors",
 				children: /* @__PURE__ */ jsxs(Collapsible, {
@@ -639,14 +771,20 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 								")"
 							]
 						})
-					}), /* @__PURE__ */ jsx(Collapsible.Content, {
+					}), /* @__PURE__ */ jsxs(Collapsible.Content, {
 						className: "tw:flex tw:flex-col tw:gap-2",
-						children: SIDEBAR_SLOTS.map((slot) => /* @__PURE__ */ jsx(ColorField, {
+						children: [SIDEBAR_SLOTS.map((slot) => /* @__PURE__ */ jsx(ColorField, {
 							id: `${baseId}sidebar-${colorScheme}-${slot}`,
 							label: SIDEBAR_LABELS[slot],
 							channels: sidebarColors?.[slot] ?? DEFAULT_SIDEBAR[colorScheme][slot],
 							onChange: (channels) => setSidebarColor(slot, channels)
-						}, slot))
+						}, slot)), SIDEBAR_STATE_SLOTS.map((slot) => /* @__PURE__ */ jsx(TextField, {
+							id: `${baseId}sidebar-state-${colorScheme}-${slot}`,
+							label: `Sidebar ${SIDEBAR_STATE_LABELS[slot].toLowerCase()}`,
+							value: sidebarColors?.[slot] ?? "",
+							placeholder: "Follows sidebar accent",
+							onChange: (next) => setSidebarState(slot, next)
+						}, slot))]
 					})]
 				})
 			}),
@@ -672,7 +810,7 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 			/* @__PURE__ */ jsx(ControlSection, {
 				title: "Radius",
 				children: RADIUS_SIZES.map((size) => {
-					const current = radii[size];
+					const current = radii[size] ?? surfaceRadiusFallback(size, radii);
 					const px = lengthToPx(current);
 					return /* @__PURE__ */ jsxs("div", {
 						className: "tw:flex tw:flex-col tw:gap-1",
@@ -683,11 +821,11 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 								children: size
 							}), /* @__PURE__ */ jsx("span", {
 								className: "tw:text-xs tw:tabular-nums tw:text-muted-foreground",
-								children: radii[size]
+								children: current
 							})]
 						}), /* @__PURE__ */ jsx(Slider, {
 							min: 0,
-							max: 24,
+							max: 32,
 							step: 1,
 							value: [px],
 							onValueChange: (values) => setRadius(size, pxToLength(values[0] ?? 0, current))
@@ -900,4 +1038,4 @@ const BrandEditor = ({ value, onChange, colorScheme = "light", onColorSchemeChan
 //#endregion
 export { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel };
 
-//# sourceMappingURL=BrandEditor-P8OZX2hi.js.map
+//# sourceMappingURL=BrandEditor-Dq168RJc.js.map

package/dist/BrandEditor-Dq168RJc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandEditor-Dq168RJc.js","names":[],"sources":["../src/blocks/BrandEditor/color.ts","../src/blocks/BrandEditor/ColorField.tsx","../src/blocks/BrandEditor/contrast.ts","../src/blocks/BrandEditor/ControlSection.tsx","../src/blocks/BrandEditor/LogoField.tsx","../src/blocks/BrandEditor/TextField.tsx","../src/blocks/BrandEditor/BrandEditor.tsx"],"sourcesContent":["// Brand colours are stored as space-separated \"R G B\" channel strings (see\n// `rgbChannelsSchema` in @keboola/brand-registry); `ColorInput` speaks hex.\n// These helpers convert at that boundary.\n\nexport const hexToChannels = (hex: string): string => {\n  let h = hex.trim().replace(/^#/, '');\n  // Expand 3/4-digit shorthand and drop alpha (4- and 8-digit `#rgba`/`#rrggbbaa`) — brand\n  // channels carry no alpha. Anything else is malformed → fall back to black.\n  if (h.length === 3 || h.length === 4) {\n    h = h\n      .slice(0, 3)\n      .split('')\n      .map((c) => c + c)\n      .join('');\n  } else if (h.length === 8) {\n    h = h.slice(0, 6);\n  }\n  if (!/^[0-9a-fA-F]{6}$/.test(h)) return '0 0 0';\n  const n = parseInt(h, 16);\n  return `${(n >> 16) & 255} ${(n >> 8) & 255} ${n & 255}`;\n};\n\nexport const channelsToHex = (channels: string): string => {\n  const [r = 0, g = 0, b = 0] = channels\n    .trim()\n    .split(/\\s+/)\n    .map((n) => Number(n) || 0);\n  const to2 = (v: number) => Math.max(0, Math.min(255, v)).toString(16).padStart(2, '0');\n  return `#${to2(r)}${to2(g)}${to2(b)}`;\n};\n","import { Label } from '../../components/Label';\nimport { ColorInput } from '../ColorInput';\n\nimport { channelsToHex, hexToChannels } from './color';\n\ntype Props = {\n  id: string;\n  label: string;\n  /** Current value as an \"R G B\" channel string. */\n  channels: string;\n  /** Called with a new \"R G B\" channel string when a valid colour is picked. */\n  onChange: (channels: string) => void;\n};\n\n// ColorInput fires `onValueChange` on every keystroke (it only coerces on blur), so commit a\n// channel value only for a COMPLETE 3-, 4-, 6-, or 8-digit hex — otherwise a partial \"#1\"/\"#\"\n// would write unintended channels. Alpha (4-/8-digit) is truncated to RGB, since brand tokens\n// carry no alpha.\nconst COMPLETE_HEX = /^([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;\n\n/** A labelled hex colour picker bound to a brand token (stored as RGB channels). */\nexport const ColorField = ({ id, label, channels, onChange }: Props) => {\n  const hex = channelsToHex(channels);\n\n  return (\n    <div className=\"tw:flex tw:items-center tw:justify-between tw:gap-2\">\n      <Label htmlFor={id} className=\"tw:text-xs tw:font-normal tw:text-foreground\">\n        {label}\n      </Label>\n      <ColorInput\n        id={id}\n        sizing=\"medium\"\n        value={hex}\n        className=\"tw:w-36\"\n        onValueChange={(next) => {\n          const clean = next.trim().replace(/^#/, '');\n          // Commit only complete hex (hexToChannels handles the 3/6/8-digit shapes + alpha drop).\n          if (COMPLETE_HEX.test(clean)) onChange(hexToChannels(`#${clean}`));\n        }}\n      />\n    </div>\n  );\n};\n","// WCAG contrast helpers over `\"R G B\"` channel strings (the brand token format).\n\n// Coerce non-numeric/blank channels to 0 and clamp to the valid 0–255 range, so a malformed\n// token (e.g. \"999 999 999\") can neither NaN-out nor push luminance past WCAG's expected bounds.\nconst clampChannel = (n: number): number =>\n  Number.isFinite(n) ? Math.min(255, Math.max(0, n)) : 0;\n\nconst parseChannels = (channels: string): [number, number, number] => {\n  const [r = 0, g = 0, b = 0] = channels\n    .trim()\n    .split(/\\s+/)\n    .map((n) => clampChannel(Number(n)));\n  return [r, g, b];\n};\n\nconst relativeLuminance = (channels: string): number => {\n  // Destructure with defaults (not an `as` assertion) so `r`/`g`/`b` are `number` under\n  // `noUncheckedIndexedAccess` without a production-code type cast.\n  const [r = 0, g = 0, b = 0] = parseChannels(channels).map((c) => {\n    const s = c / 255;\n    return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;\n  });\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\n/** WCAG contrast ratio (1–21) between two `\"R G B\"` colours. */\nexport const contrastRatio = (fg: string, bg: string): number => {\n  const l1 = relativeLuminance(fg);\n  const l2 = relativeLuminance(bg);\n  const [lighter, darker] = l1 >= l2 ? [l1, l2] : [l2, l1];\n  return (lighter + 0.05) / (darker + 0.05);\n};\n\n/** WCAG level for normal-size text at a given ratio. */\nexport const wcagLevel = (ratio: number): 'AAA' | 'AA' | 'fail' =>\n  ratio >= 7 ? 'AAA' : ratio >= 4.5 ? 'AA' : 'fail';\n","import type { ReactNode } from 'react';\n\ntype Props = {\n  title: string;\n  children: ReactNode;\n};\n\n/** A titled block inside `BrandEditor`. */\nexport const ControlSection = ({ title, children }: Props) => (\n  <section className=\"tw:flex tw:flex-col tw:gap-3 tw:border-b tw:border-border tw:p-4\">\n    <h3 className=\"tw:m-0 tw:text-xs tw:font-semibold tw:uppercase tw:tracking-wide tw:text-muted-foreground\">\n      {title}\n    </h3>\n    {children}\n  </section>\n);\n","import { Label } from '../../components/Label';\nimport { Textarea } from '../Textarea';\n\ntype Props = {\n  id: string;\n  label: string;\n  /** Current logo source: SVG markup, a `data:` URI, or an `http(s)` URL. */\n  value: string;\n  /** Called with the new source (empty string clears the slot). */\n  onChange: (value: string) => void;\n};\n\n/** A labelled multi-line field for a brand logo source. */\nexport const LogoField = ({ id, label, value, onChange }: Props) => (\n  <div className=\"tw:flex tw:flex-col tw:gap-1\">\n    <Label htmlFor={id} className=\"tw:text-xs tw:font-normal tw:text-foreground\">\n      {label}\n    </Label>\n    <Textarea\n      id={id}\n      value={value}\n      onValueChange={onChange}\n      maxRows={4}\n      placeholder=\"<svg…>, a data: URI, or an https:// URL\"\n      className=\"tw:font-mono tw:text-xs\"\n    />\n  </div>\n);\n","import { Label } from '../../components/Label';\nimport { TextInput } from '../TextInput';\n\ntype Props = {\n  id: string;\n  label: string;\n  /** Current CSS value (empty clears the token, falling back to the stylesheet default). */\n  value: string;\n  /** Called with the new CSS value on change. */\n  onChange: (value: string) => void;\n  /** The inherited default, shown as placeholder when the field is empty. */\n  placeholder?: string;\n};\n\n/** A labelled single-line field for a free-form CSS-value token (shadow, motion, gradient). */\nexport const TextField = ({ id, label, value, onChange, placeholder }: Props) => (\n  <div className=\"tw:flex tw:flex-col tw:gap-1\">\n    <Label htmlFor={id} className=\"tw:text-xs tw:font-normal tw:text-foreground\">\n      {label}\n    </Label>\n    <TextInput\n      id={id}\n      sizing=\"small\"\n      value={value}\n      onValueChange={onChange}\n      placeholder={placeholder}\n      className=\"tw:font-mono tw:text-xs\"\n    />\n  </div>\n);\n","import { useId, useMemo } from 'react';\nimport DOMPurify from 'dompurify';\n\nimport type { Brand } from '@keboola/brand-registry';\nimport { keboola } from '@keboola/brand-registry';\n\nimport { Badge } from '../../components/Badge';\nimport { Button } from '../../components/Button';\nimport { Collapsible } from '../../components/Collapsible';\nimport { Label } from '../../components/Label';\nimport { Select } from '../../components/Select';\nimport { Slider } from '../../components/Slider';\nimport { ToggleGroup } from '../../components/ToggleGroup';\n\nimport { ColorField } from './ColorField';\nimport { contrastRatio, wcagLevel } from './contrast';\nimport { ControlSection } from './ControlSection';\nimport { LogoField } from './LogoField';\nimport { TextField } from './TextField';\n\ntype Colors = NonNullable<Brand['theme']['colors']>;\n/** Colour tokens written as full CSS values rather than `R G B` channels. */\nexport type StateColorSlot = keyof Pick<\n  Colors,\n  'hover' | 'hoverForeground' | 'pressed' | 'selected' | 'selectedForeground' | 'scrim'\n>;\nexport type ColorSlot = keyof Omit<Colors, 'sidebar' | 'chart' | StateColorSlot>;\ntype SidebarColors = NonNullable<Colors['sidebar']>;\n/** Sidebar tokens written as full CSS values rather than `R G B` channels. */\nexport type SidebarStateSlot = keyof Pick<\n  SidebarColors,\n  'sidebarHover' | 'sidebarHoverForeground' | 'sidebarSelected' | 'sidebarSelectedForeground'\n>;\nexport type SidebarSlot = keyof Omit<SidebarColors, SidebarStateSlot>;\nexport type ChartSlot = keyof NonNullable<NonNullable<Brand['theme']['colors']>['chart']>;\nexport type RadiusSize = keyof NonNullable<Brand['theme']['radii']>;\n\ntype Typography = NonNullable<Brand['theme']['typography']>;\ntype FontFace = 'fontFamily' | 'fontDisplay' | 'fontMono';\ntype FontWeightSlot = keyof NonNullable<Typography['weight']>;\ntype ShadowSlot = keyof NonNullable<Brand['theme']['shadows']>;\ntype SpacingSlot = keyof NonNullable<Brand['theme']['spacing']>;\ntype MotionSlot = keyof NonNullable<Brand['theme']['motion']>;\n\nexport const DEFAULT_FALLBACK_FONT = \"'Inter', system-ui, sans-serif\";\n\nexport const DEFAULT_FONT_OPTIONS: { value: string; label: string }[] = [\n  { value: DEFAULT_FALLBACK_FONT, label: 'Inter (default)' },\n  { value: \"'Space Grotesk', system-ui, sans-serif\", label: 'Space Grotesk' },\n  { value: \"'Poppins', system-ui, sans-serif\", label: 'Poppins' },\n  { value: \"'Manrope', system-ui, sans-serif\", label: 'Manrope' },\n  { value: \"'Quicksand', system-ui, sans-serif\", label: 'Quicksand' },\n  { value: \"'Baloo 2', system-ui, sans-serif\", label: 'Baloo 2' },\n  { value: \"'Fraunces', Georgia, serif\", label: 'Fraunces (serif)' },\n  { value: \"Georgia, 'Times New Roman', serif\", label: 'Georgia (serif)' },\n  { value: \"'JetBrains Mono', ui-monospace, monospace\", label: 'JetBrains Mono' },\n  { value: 'system-ui, sans-serif', label: 'System UI' },\n];\n\n// Label maps double as a compile-time exhaustiveness guard: typed as\n// `Record<ColorSlot, string>` / `Record<SidebarSlot, string>`, a new token added\n// to the upstream `Brand` schema fails to compile here until it gets a control,\n// so it can't silently drift out of the editor. Insertion order is display order.\nconst COLOR_LABELS: Record<ColorSlot, string> = {\n  primary: 'Primary',\n  primaryForeground: 'Primary foreground',\n  background: 'Background',\n  foreground: 'Foreground',\n  card: 'Card',\n  cardForeground: 'Card foreground',\n  popover: 'Popover',\n  popoverForeground: 'Popover foreground',\n  secondary: 'Secondary',\n  secondaryForeground: 'Secondary foreground',\n  muted: 'Muted',\n  mutedForeground: 'Muted foreground',\n  accent: 'Accent',\n  accentForeground: 'Accent foreground',\n  border: 'Border',\n  input: 'Input border',\n  inputBackground: 'Input background',\n  ring: 'Ring',\n  ringOffset: 'Ring offset',\n  destructive: 'Destructive',\n  destructiveForeground: 'Destructive foreground',\n  success: 'Success',\n  successForeground: 'Success foreground',\n  warning: 'Warning',\n  warningForeground: 'Warning foreground',\n  info: 'Info',\n  infoForeground: 'Info foreground',\n};\n\nconst STATE_COLOR_LABELS: Record<StateColorSlot, string> = {\n  hover: 'Hover',\n  hoverForeground: 'Hover foreground',\n  pressed: 'Pressed',\n  selected: 'Selected',\n  selectedForeground: 'Selected foreground',\n  scrim: 'Scrim (modal backdrop)',\n};\n\n// What an unset state token resolves to, shown as the field's placeholder.\nconst STATE_COLOR_DEFAULTS: Record<StateColorSlot, string> = {\n  hover: 'Follows accent (menus, table rows: their own tint)',\n  hoverForeground: 'Follows accent foreground',\n  pressed: 'Reserved: no component reads it yet',\n  selected: 'Follows accent',\n  selectedForeground: 'Follows accent foreground',\n  scrim: 'rgb(0 0 0 / 0.5)',\n};\n\nconst DEFAULT_DISABLED_OPACITY = '0.5';\n\nconst SIDEBAR_LABELS: Record<SidebarSlot, string> = {\n  sidebar: 'Sidebar',\n  sidebarForeground: 'Foreground',\n  sidebarPrimary: 'Primary',\n  sidebarPrimaryForeground: 'Primary foreground',\n  sidebarAccent: 'Accent',\n  sidebarAccentForeground: 'Accent foreground',\n  sidebarBorder: 'Border',\n  sidebarRing: 'Ring',\n};\n\nconst SIDEBAR_STATE_LABELS: Record<SidebarStateSlot, string> = {\n  sidebarHover: 'Hover',\n  sidebarHoverForeground: 'Hover foreground',\n  sidebarSelected: 'Selected (current page)',\n  sidebarSelectedForeground: 'Selected foreground',\n};\n\nconst CHART_LABELS: Record<ChartSlot, string> = {\n  chart1: 'Chart 1',\n  chart2: 'Chart 2',\n  chart3: 'Chart 3',\n  chart4: 'Chart 4',\n  chart5: 'Chart 5',\n};\n\nconst WEIGHT_LABELS: Record<FontWeightSlot, string> = {\n  normal: 'Normal',\n  medium: 'Medium',\n  semibold: 'Semibold',\n  bold: 'Bold',\n};\n\nconst SHADOW_LABELS: Record<ShadowSlot, string> = {\n  sm: 'Small',\n  md: 'Medium',\n  lg: 'Large',\n  lift: 'Lift (raised)',\n};\n\nconst SPACING_LABELS: Record<SpacingSlot, string> = {\n  gutter: 'Gutter (between sections)',\n  inset: 'Inset (in-container)',\n};\n\nconst MOTION_LABELS: Record<MotionSlot, string> = {\n  duration: 'Duration',\n  easing: 'Easing',\n};\n\nconst COLOR_SLOTS = Object.keys(COLOR_LABELS) as ColorSlot[];\nconst STATE_COLOR_SLOTS = Object.keys(STATE_COLOR_LABELS) as StateColorSlot[];\nconst SIDEBAR_STATE_SLOTS = Object.keys(SIDEBAR_STATE_LABELS) as SidebarStateSlot[];\nconst SIDEBAR_SLOTS = Object.keys(SIDEBAR_LABELS) as SidebarSlot[];\nconst CHART_SLOTS = Object.keys(CHART_LABELS) as ChartSlot[];\nconst WEIGHT_SLOTS = Object.keys(WEIGHT_LABELS) as FontWeightSlot[];\nconst SHADOW_SLOTS = Object.keys(SHADOW_LABELS) as ShadowSlot[];\nconst SPACING_SLOTS = Object.keys(SPACING_LABELS) as SpacingSlot[];\nconst MOTION_SLOTS = Object.keys(MOTION_LABELS) as MotionSlot[];\nconst RADIUS_SIZES: RadiusSize[] = ['sm', 'md', 'lg', 'card', 'popover', 'modal', 'sheet', 'toast'];\n\n// Foreground/background pairs whose contrast decides everyday legibility.\nconst A11Y_PAIRS: { label: string; fg: ColorSlot; bg: ColorSlot }[] = [\n  { label: 'Text on background', fg: 'foreground', bg: 'background' },\n  { label: 'Text on card', fg: 'cardForeground', bg: 'card' },\n  { label: 'Primary button', fg: 'primaryForeground', bg: 'primary' },\n  { label: 'Muted text', fg: 'mutedForeground', bg: 'muted' },\n  { label: 'Accent', fg: 'accentForeground', bg: 'accent' },\n];\n\n// Fallback sidebar palette — the `keboola` brand doesn't set `colors.sidebar` /\n// `colorsDark.sidebar`, so a slot needs a value to seed from when a user starts\n// editing sidebar tokens on a brand that leaves them unset.\nconst DEFAULT_SIDEBAR: Record<'light' | 'dark', Record<SidebarSlot, string>> = {\n  light: {\n    sidebar: '255 255 255',\n    sidebarForeground: '30 41 59',\n    sidebarPrimary: '31 143 255',\n    sidebarPrimaryForeground: '255 255 255',\n    sidebarAccent: '219 234 254',\n    sidebarAccentForeground: '30 41 59',\n    sidebarBorder: '229 231 235',\n    sidebarRing: '31 143 255',\n  },\n  dark: {\n    sidebar: '14 14 18',\n    sidebarForeground: '229 230 236',\n    sidebarPrimary: '31 143 255',\n    sidebarPrimaryForeground: '255 255 255',\n    sidebarAccent: '38 38 45',\n    sidebarAccentForeground: '229 230 236',\n    sidebarBorder: '48 49 57',\n    sidebarRing: '31 143 255',\n  },\n};\n\nconst DEFAULT_RADII: NonNullable<Brand['theme']['radii']> = {\n  sm: '0.25rem',\n  md: '0.375rem',\n  lg: '0.5rem',\n};\n\n// What an unset surface radius resolves to on its component.\nconst surfaceRadiusFallback = (\n  size: RadiusSize,\n  radii: NonNullable<Brand['theme']['radii']>,\n): string => {\n  if (size === 'popover') return '1rem';\n  if (size === 'modal') return '1.5rem';\n  return radii.lg;\n};\n\n// The `@keboola/design/styles` categorical chart palette — seeds the chart\n// pickers when a brand leaves `colors.chart` / `colorsDark.chart` unset.\nconst DEFAULT_CHART: Record<'light' | 'dark', Record<ChartSlot, string>> = {\n  light: {\n    chart1: '31 143 255',\n    chart2: '0 194 135',\n    chart3: '146 92 255',\n    chart4: '245 147 0',\n    chart5: '237 94 223',\n  },\n  dark: {\n    chart1: '92 173 255',\n    chart2: '0 230 161',\n    chart3: '173 133 255',\n    chart4: '255 190 92',\n    chart5: '242 140 232',\n  },\n};\n\n// Chrome font-weight defaults (the Tailwind scale `@keboola/design` falls back to\n// when `typography.weight` is unset) — seed values for the weight sliders.\nconst DEFAULT_FONT_WEIGHTS: Record<FontWeightSlot, string> = {\n  normal: '400',\n  medium: '500',\n  semibold: '600',\n  bold: '700',\n};\n\n// Chrome tracking default (behind the hardcoded `tw:tracking-[1px]`).\nconst DEFAULT_LETTER_SPACING = '1px';\n\n// The monospace stack the mono-face Select falls back to when `fontMono` is unset\n// (matches the `DEFAULT_FONT_OPTIONS` JetBrains Mono entry).\nconst MONO_FALLBACK = \"'JetBrains Mono', ui-monospace, monospace\";\n\n// `@keboola/design/styles` defaults for the advanced token groups, shown as\n// placeholders so an unset field reveals the value it inherits.\nconst DEFAULT_SHADOWS: Record<ShadowSlot, string> = {\n  sm: '0 1px 2px 0 rgb(0 0 0 / 0.05)',\n  md: '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',\n  lg: '0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)',\n  lift: '0 10px 30px -12px rgb(0 0 0 / 0.28), 0 2px 6px rgb(0 0 0 / 0.06)',\n};\n\nconst DEFAULT_SPACING: Record<SpacingSlot, string> = {\n  gutter: '1.5rem',\n  inset: '1.5rem',\n};\n\nconst DEFAULT_MOTION: Record<MotionSlot, string> = {\n  duration: '200ms',\n  easing: 'cubic-bezier(0.2, 0.7, 0.2, 1)',\n};\n\nconst DEFAULT_GRADIENT =\n  'linear-gradient(135deg, rgb(var(--primary)), rgb(var(--accent, var(--primary))))';\n\n// Leading numeric value of a token string (font-weight \"500\").\nconst numOf = (value: string, fallback: number): number => {\n  const n = Number.parseFloat(value);\n  return Number.isFinite(n) ? n : fallback;\n};\n\n// Letter-spacing may be px or em. Drive the slider in px (treating `em` as ×16,\n// like the radius slider treats `rem`) and write back in the value's original\n// unit, so an `em`-authored brand (e.g. `0.02em`) stays `em` instead of being\n// silently rewritten to `px`.\nconst letterSpacingToPx = (value: string): number => {\n  const n = Number.parseFloat(value);\n  if (!Number.isFinite(n)) return 0;\n  return value.trim().endsWith('em') ? n * 16 : n;\n};\n\nconst pxToLetterSpacing = (px: number, currentValue: string): string =>\n  currentValue.trim().endsWith('em') ? `${Number((px / 16).toFixed(3))}em` : `${px}px`;\n\n// The Brand schema allows any CSS length for radii (`rem`, `px`, unitless). Convert to px for\n// the slider treating `rem` as ×16 and everything else as already-px, and write back preserving\n// the slot's original unit so `8px` stays `8px`, `0.5rem` stays `0.5rem`, and a unitless `8` stays `8`.\nconst lengthToPx = (value: string): number => {\n  const n = Number.parseFloat(value);\n  if (!Number.isFinite(n)) return 0;\n  return Math.round(value.trim().endsWith('rem') ? n * 16 : n);\n};\n\nconst pxToLength = (px: number, currentValue: string): string => {\n  const trimmed = currentValue.trim();\n  if (trimmed.endsWith('rem')) return `${px / 16}rem`;\n  // Preserve a unitless token (the schema allows it) rather than forcing `px` onto it.\n  if (/^-?\\d*\\.?\\d+$/.test(trimmed)) return `${px}`;\n  return `${px}px`;\n};\n\nexport type BrandEditorProps = {\n  value: Brand;\n  onChange: (next: Brand) => void;\n  /** Palette being edited. Controlled. Default 'light'. */\n  colorScheme?: 'light' | 'dark';\n  /** If provided, the editor shows a light/dark toggle that calls this. If omitted, no toggle. */\n  onColorSchemeChange?: (scheme: 'light' | 'dark') => void;\n  /** Font choices for the typography Select. Defaults to DEFAULT_FONT_OPTIONS. */\n  fontOptions?: { value: string; label: string }[];\n};\n\n// Match `BrandLogo`'s sniffing: any string starting with `<` is inline markup (covers\n// `<?xml …?><svg>` / `<!doctype …>` prefixes); only `data:` / `http(s)://` are image URLs.\nconst isSvgMarkup = (source: string) => source.trimStart().startsWith('<');\nconst isImageSource = (source: string) => /^(data:|https?:\\/\\/)/.test(source.trim());\n\n/** Renders a logo source (SVG markup, `data:` URI, or `http(s)` URL) from the raw string. */\nconst LogoPreviewImage = ({ source, className }: { source: string; className?: string }) => {\n  const safeSvg = useMemo(\n    () =>\n      isSvgMarkup(source)\n        ? DOMPurify.sanitize(source, { USE_PROFILES: { svg: true, svgFilters: true } })\n        : null,\n    [source],\n  );\n\n  if (safeSvg !== null) {\n    // Decorative preview of what the caller is editing — the textarea holds the real value, so\n    // hide the injected graphic from assistive tech (parity with the `alt=\"\"` image branch below).\n    return <span aria-hidden className={className} dangerouslySetInnerHTML={{ __html: safeSvg }} />;\n  }\n  if (isImageSource(source)) {\n    return <img src={source} alt=\"\" className={className} />;\n  }\n  return null;\n};\n\n/**\n * Controlled brand-editing block — colors (light/dark), sidebar colors, WCAG contrast readout,\n * corner radius, typography, and logo. Reads/writes a `Brand` (`@keboola/brand-registry`) via\n * `value` / `onChange`; owns no state of its own, so the caller decides where the brand and the\n * active color scheme live (Kai build-mode preview, theme-generator, …).\n */\nexport const BrandEditor = ({\n  value,\n  onChange,\n  colorScheme = 'light',\n  onColorSchemeChange,\n  fontOptions = DEFAULT_FONT_OPTIONS,\n}: BrandEditorProps) => {\n  // Prefix every control id so multiple BrandEditors on one page don't collide (broken label↔control).\n  const baseId = useId();\n  const { theme } = value;\n  const coreColors = colorScheme === 'light' ? theme.colors : theme.colorsDark;\n  const sidebarColors = colorScheme === 'light' ? theme.colors?.sidebar : theme.colorsDark?.sidebar;\n  const chartColors = colorScheme === 'light' ? theme.colors?.chart : theme.colorsDark?.chart;\n  // Fall back to the keboola default of the SAME scheme — never light values while editing dark.\n  const defaultColors = colorScheme === 'light' ? keboola.theme.colors : keboola.theme.colorsDark;\n  const radii = theme.radii ?? DEFAULT_RADII;\n  const typography = theme.typography;\n\n  const setColor = (slot: ColorSlot, channels: string) => {\n    if (colorScheme === 'light') {\n      onChange({ ...value, theme: { ...theme, colors: { ...theme.colors, [slot]: channels } } });\n      return;\n    }\n    // Keep colorsDark sparse (mirrors the light path) so an unset dark palette inherits the\n    // design-system defaults instead of baking in a full keboola palette on the first edit.\n    onChange({\n      ...value,\n      theme: { ...theme, colorsDark: { ...theme.colorsDark, [slot]: channels } },\n    });\n  };\n\n  const setStateColor = (slot: StateColorSlot, color: string) => {\n    const next = color.trim() || undefined;\n    if (colorScheme === 'light') {\n      onChange({ ...value, theme: { ...theme, colors: { ...theme.colors, [slot]: next } } });\n      return;\n    }\n    onChange({ ...value, theme: { ...theme, colorsDark: { ...theme.colorsDark, [slot]: next } } });\n  };\n\n  const setDisabledOpacity = (disabled: string) =>\n    onChange({ ...value, theme: { ...theme, opacity: { ...theme.opacity, disabled } } });\n\n  const setSidebarColor = (slot: SidebarSlot, channels: string) => {\n    if (colorScheme === 'light') {\n      const base = theme.colors?.sidebar ?? DEFAULT_SIDEBAR.light;\n      onChange({\n        ...value,\n        theme: { ...theme, colors: { ...theme.colors, sidebar: { ...base, [slot]: channels } } },\n      });\n      return;\n    }\n    // Spread the existing (possibly-empty) colorsDark so setting a sidebar token doesn't seed the\n    // whole core dark palette; only the sidebar sub-object is seeded, since it has no default to inherit.\n    const sidebarBase = theme.colorsDark?.sidebar ?? DEFAULT_SIDEBAR.dark;\n    onChange({\n      ...value,\n      theme: {\n        ...theme,\n        colorsDark: { ...theme.colorsDark, sidebar: { ...sidebarBase, [slot]: channels } },\n      },\n    });\n  };\n\n  const setSidebarState = (slot: SidebarStateSlot, color: string) => {\n    const next = color.trim() || undefined;\n    const palette = colorScheme === 'light' ? 'colors' : 'colorsDark';\n    const sidebar = { ...(theme[palette]?.sidebar ?? DEFAULT_SIDEBAR[colorScheme]), [slot]: next };\n    onChange({ ...value, theme: { ...theme, [palette]: { ...theme[palette], sidebar } } });\n  };\n\n  const setChart = (slot: ChartSlot, channels: string) => {\n    const base = chartColors ?? DEFAULT_CHART[colorScheme];\n    const chart = { ...base, [slot]: channels };\n    if (colorScheme === 'light') {\n      onChange({ ...value, theme: { ...theme, colors: { ...theme.colors, chart } } });\n      return;\n    }\n    onChange({ ...value, theme: { ...theme, colorsDark: { ...theme.colorsDark, chart } } });\n  };\n\n  const setRadius = (size: RadiusSize, radius: string) =>\n    onChange({\n      ...value,\n      theme: { ...theme, radii: { ...(theme.radii ?? DEFAULT_RADII), [size]: radius } },\n    });\n\n  // Merge a typography patch, keeping sibling faces / weight / letterSpacing.\n  const patchTypography = (patch: Partial<Typography>) =>\n    onChange({ ...value, theme: { ...theme, typography: { ...theme.typography, ...patch } } });\n\n  const setFontFace = (face: FontFace, font: string) =>\n    patchTypography({ [face]: font.trim() || undefined });\n\n  const setFontWeight = (slot: FontWeightSlot, weight: string) =>\n    patchTypography({ weight: { ...theme.typography?.weight, [slot]: weight || undefined } });\n\n  const setLetterSpacing = (chrome: string) =>\n    patchTypography({ letterSpacing: { chrome: chrome.trim() || undefined } });\n\n  const setShadow = (slot: ShadowSlot, shadow: string) =>\n    onChange({\n      ...value,\n      theme: { ...theme, shadows: { ...theme.shadows, [slot]: shadow.trim() || undefined } },\n    });\n\n  const setSpacing = (slot: SpacingSlot, length: string) =>\n    onChange({\n      ...value,\n      theme: { ...theme, spacing: { ...theme.spacing, [slot]: length.trim() || undefined } },\n    });\n\n  const setMotion = (slot: MotionSlot, token: string) =>\n    onChange({\n      ...value,\n      theme: { ...theme, motion: { ...theme.motion, [slot]: token.trim() || undefined } },\n    });\n\n  const setGradient = (gradient: string) =>\n    onChange({\n      ...value,\n      theme: { ...theme, gradient: { brand: gradient.trim() || undefined } },\n    });\n\n  const setLogo = (slot: keyof NonNullable<Brand['logo']>, source: string) => {\n    const trimmed = source.trim();\n    const nextLogo: NonNullable<Brand['logo']> = { ...value.logo };\n    if (trimmed) nextLogo[slot] = trimmed;\n    else delete nextLogo[slot];\n    const { logo: _drop, ...rest } = value;\n    onChange(Object.keys(nextLogo).length > 0 ? { ...value, logo: nextLogo } : rest);\n  };\n\n  return (\n    <div className=\"tw:flex tw:flex-col\">\n      <ControlSection title=\"Colors\">\n        {onColorSchemeChange ? (\n          <ToggleGroup\n            type=\"single\"\n            value={colorScheme}\n            onValueChange={(next) => {\n              if (next === 'light' || next === 'dark') onColorSchemeChange(next);\n            }}\n            aria-label=\"Color scheme\"\n            className=\"tw:w-full\"\n          >\n            <ToggleGroup.Item value=\"light\" className=\"tw:flex-1\">\n              Light\n            </ToggleGroup.Item>\n            <ToggleGroup.Item value=\"dark\" className=\"tw:flex-1\">\n              Dark\n            </ToggleGroup.Item>\n          </ToggleGroup>\n        ) : null}\n        <div className=\"tw:flex tw:flex-col tw:gap-2\">\n          {COLOR_SLOTS.map((slot) => (\n            <ColorField\n              key={slot}\n              id={`${baseId}color-${colorScheme}-${slot}`}\n              label={COLOR_LABELS[slot]}\n              channels={coreColors?.[slot] ?? defaultColors?.[slot] ?? '0 0 0'}\n              onChange={(channels) => setColor(slot, channels)}\n            />\n          ))}\n        </div>\n      </ControlSection>\n\n      <ControlSection title=\"Accessibility\">\n        <p className=\"tw:m-0 tw:text-xs tw:text-muted-foreground\">\n          WCAG contrast for the {colorScheme} palette (AA needs 4.5:1).\n        </p>\n        <div className=\"tw:flex tw:flex-col tw:gap-1.5\">\n          {A11Y_PAIRS.map((pair) => {\n            const fg = coreColors?.[pair.fg] ?? defaultColors?.[pair.fg] ?? '0 0 0';\n            const bg = coreColors?.[pair.bg] ?? defaultColors?.[pair.bg] ?? '255 255 255';\n            const ratio = contrastRatio(fg, bg);\n            const level = wcagLevel(ratio);\n            return (\n              <div key={pair.label} className=\"tw:flex tw:items-center tw:justify-between tw:gap-2\">\n                <span className=\"tw:text-xs tw:text-foreground\">{pair.label}</span>\n                <span className=\"tw:flex tw:items-center tw:gap-1.5\">\n                  <span className=\"tw:text-xs tw:tabular-nums tw:text-muted-foreground\">\n                    {ratio.toFixed(1)}:1\n                  </span>\n                  <Badge color={level === 'fail' ? 'red' : 'green'}>\n                    {level === 'fail' ? 'Fail' : level}\n                  </Badge>\n                </span>\n              </div>\n            );\n          })}\n        </div>\n      </ControlSection>\n\n      <ControlSection title=\"Interaction states\">\n        <p className=\"tw:m-0 tw:text-xs tw:text-muted-foreground\">\n          Hover, pressed, selected and backdrop colours for the {colorScheme} palette, as any CSS\n          colour so a wash can be translucent. Empty follows the default.\n        </p>\n        <div className=\"tw:flex tw:flex-col tw:gap-2\">\n          {STATE_COLOR_SLOTS.map((slot) => (\n            <TextField\n              key={slot}\n              id={`${baseId}state-${colorScheme}-${slot}`}\n              label={STATE_COLOR_LABELS[slot]}\n              value={coreColors?.[slot] ?? ''}\n              placeholder={STATE_COLOR_DEFAULTS[slot]}\n              onChange={(next) => setStateColor(slot, next)}\n            />\n          ))}\n        </div>\n        <div className=\"tw:flex tw:flex-col tw:gap-1\">\n          <div className=\"tw:flex tw:items-center tw:justify-between\">\n            <Label className=\"tw:text-xs tw:font-normal tw:text-foreground\">Disabled opacity</Label>\n            <span className=\"tw:text-xs tw:tabular-nums tw:text-muted-foreground\">\n              {theme.opacity?.disabled ?? DEFAULT_DISABLED_OPACITY}\n            </span>\n          </div>\n          <Slider\n            aria-label=\"Disabled opacity\"\n            min={0.2}\n            max={0.8}\n            step={0.05}\n            value={[Number(theme.opacity?.disabled ?? DEFAULT_DISABLED_OPACITY)]}\n            onValueChange={(values) => setDisabledOpacity((values[0] ?? 0.5).toFixed(2))}\n          />\n        </div>\n      </ControlSection>\n\n      <ControlSection title=\"Sidebar colors\">\n        <Collapsible className=\"tw:flex tw:flex-col tw:gap-2\">\n          <Collapsible.Trigger asChild>\n            <Button variant=\"outline\" size=\"small\" className=\"tw:w-full\">\n              Toggle sidebar tokens ({colorScheme})\n            </Button>\n          </Collapsible.Trigger>\n          <Collapsible.Content className=\"tw:flex tw:flex-col tw:gap-2\">\n            {SIDEBAR_SLOTS.map((slot) => (\n              <ColorField\n                key={slot}\n                id={`${baseId}sidebar-${colorScheme}-${slot}`}\n                label={SIDEBAR_LABELS[slot]}\n                channels={sidebarColors?.[slot] ?? DEFAULT_SIDEBAR[colorScheme][slot]}\n                onChange={(channels) => setSidebarColor(slot, channels)}\n              />\n            ))}\n            {SIDEBAR_STATE_SLOTS.map((slot) => (\n              <TextField\n                key={slot}\n                id={`${baseId}sidebar-state-${colorScheme}-${slot}`}\n                label={`Sidebar ${SIDEBAR_STATE_LABELS[slot].toLowerCase()}`}\n                value={sidebarColors?.[slot] ?? ''}\n                placeholder=\"Follows sidebar accent\"\n                onChange={(next) => setSidebarState(slot, next)}\n              />\n            ))}\n          </Collapsible.Content>\n        </Collapsible>\n      </ControlSection>\n\n      <ControlSection title=\"Chart palette\">\n        <p className=\"tw:m-0 tw:text-xs tw:text-muted-foreground\">\n          Categorical series colours for the {colorScheme} palette (`--chart-1…5`).\n        </p>\n        <div className=\"tw:flex tw:flex-col tw:gap-2\">\n          {CHART_SLOTS.map((slot) => (\n            <ColorField\n              key={slot}\n              id={`${baseId}chart-${colorScheme}-${slot}`}\n              label={CHART_LABELS[slot]}\n              channels={chartColors?.[slot] ?? DEFAULT_CHART[colorScheme][slot]}\n              onChange={(channels) => setChart(slot, channels)}\n            />\n          ))}\n        </div>\n      </ControlSection>\n\n      <ControlSection title=\"Radius\">\n        {RADIUS_SIZES.map((size) => {\n          const current = radii[size] ?? surfaceRadiusFallback(size, radii);\n          const px = lengthToPx(current);\n          return (\n            <div key={size} className=\"tw:flex tw:flex-col tw:gap-1\">\n              <div className=\"tw:flex tw:items-center tw:justify-between\">\n                <Label className=\"tw:text-xs tw:font-normal tw:uppercase tw:text-foreground\">\n                  {size}\n                </Label>\n                <span className=\"tw:text-xs tw:tabular-nums tw:text-muted-foreground\">\n                  {current}\n                </span>\n              </div>\n              <Slider\n                min={0}\n                max={32}\n                step={1}\n                value={[px]}\n                onValueChange={(values) => setRadius(size, pxToLength(values[0] ?? 0, current))}\n              />\n            </div>\n          );\n        })}\n      </ControlSection>\n\n      <ControlSection title=\"Typography\">\n        <div className=\"tw:flex tw:flex-col tw:gap-1\">\n          <Label\n            htmlFor={`${baseId}font-family`}\n            className=\"tw:text-xs tw:font-normal tw:text-foreground\"\n          >\n            Font family\n          </Label>\n          <Select\n            id={`${baseId}font-family`}\n            value={typography?.fontFamily ?? DEFAULT_FALLBACK_FONT}\n            onValueChange={(font) => setFontFace('fontFamily', font)}\n            items={fontOptions}\n          />\n        </div>\n        <div className=\"tw:flex tw:flex-col tw:gap-1\">\n          <Label\n            htmlFor={`${baseId}font-display`}\n            className=\"tw:text-xs tw:font-normal tw:text-foreground\"\n          >\n            Display font (headings)\n          </Label>\n          <Select\n            id={`${baseId}font-display`}\n            value={typography?.fontDisplay ?? typography?.fontFamily ?? DEFAULT_FALLBACK_FONT}\n            onValueChange={(font) => setFontFace('fontDisplay', font)}\n            items={fontOptions}\n          />\n        </div>\n        <div className=\"tw:flex tw:flex-col tw:gap-1\">\n          <Label\n            htmlFor={`${baseId}font-mono`}\n            className=\"tw:text-xs tw:font-normal tw:text-foreground\"\n          >\n            Monospace font\n          </Label>\n          <Select\n            id={`${baseId}font-mono`}\n            value={typography?.fontMono ?? MONO_FALLBACK}\n            onValueChange={(font) => setFontFace('fontMono', font)}\n            items={fontOptions}\n          />\n        </div>\n\n        <span className=\"tw:text-xs tw:text-muted-foreground\">Chrome font weights</span>\n        {WEIGHT_SLOTS.map((slot) => {\n          const current = typography?.weight?.[slot] ?? DEFAULT_FONT_WEIGHTS[slot];\n          return (\n            <div key={slot} className=\"tw:flex tw:flex-col tw:gap-1\">\n              <div className=\"tw:flex tw:items-center tw:justify-between\">\n                <Label className=\"tw:text-xs tw:font-normal tw:text-foreground\">\n                  {WEIGHT_LABELS[slot]}\n                </Label>\n                <span className=\"tw:text-xs tw:tabular-nums tw:text-muted-foreground\">\n                  {current}\n                </span>\n              </div>\n              <Slider\n                min={100}\n                max={900}\n                step={25}\n                value={[numOf(current, 400)]}\n                onValueChange={(values) => setFontWeight(slot, String(values[0] ?? 400))}\n              />\n            </div>\n          );\n        })}\n\n        <div className=\"tw:flex tw:flex-col tw:gap-1\">\n          <div className=\"tw:flex tw:items-center tw:justify-between\">\n            <Label className=\"tw:text-xs tw:font-normal tw:text-foreground\">\n              Chrome letter spacing\n            </Label>\n            <span className=\"tw:text-xs tw:tabular-nums tw:text-muted-foreground\">\n              {typography?.letterSpacing?.chrome ?? DEFAULT_LETTER_SPACING}\n            </span>\n          </div>\n          <Slider\n            min={-2}\n            max={4}\n            step={0.25}\n            value={[letterSpacingToPx(typography?.letterSpacing?.chrome ?? DEFAULT_LETTER_SPACING)]}\n            onValueChange={(values) =>\n              setLetterSpacing(\n                pxToLetterSpacing(\n                  values[0] ?? 0,\n                  typography?.letterSpacing?.chrome ?? DEFAULT_LETTER_SPACING,\n                ),\n              )\n            }\n          />\n        </div>\n      </ControlSection>\n\n      <ControlSection title=\"Elevation\">\n        <p className=\"tw:m-0 tw:text-xs tw:text-muted-foreground\">\n          Box-shadow scale (`--shadow-*`), shared across light & dark. Empty inherits the default.\n        </p>\n        {SHADOW_SLOTS.map((slot) => (\n          <TextField\n            key={slot}\n            id={`${baseId}shadow-${slot}`}\n            label={SHADOW_LABELS[slot]}\n            value={theme.shadows?.[slot] ?? ''}\n            placeholder={DEFAULT_SHADOWS[slot]}\n            onChange={(next) => setShadow(slot, next)}\n          />\n        ))}\n      </ControlSection>\n\n      <ControlSection title=\"Density\">\n        <p className=\"tw:m-0 tw:text-xs tw:text-muted-foreground\">\n          Semantic spacing (`--space-*`), as CSS lengths.\n        </p>\n        {SPACING_SLOTS.map((slot) => (\n          <TextField\n            key={slot}\n            id={`${baseId}spacing-${slot}`}\n            label={SPACING_LABELS[slot]}\n            value={theme.spacing?.[slot] ?? ''}\n            placeholder={DEFAULT_SPACING[slot]}\n            onChange={(next) => setSpacing(slot, next)}\n          />\n        ))}\n      </ControlSection>\n\n      <ControlSection title=\"Motion\">\n        <p className=\"tw:m-0 tw:text-xs tw:text-muted-foreground\">\n          Base transition `duration` + `easing` (`--motion-*`).\n        </p>\n        {MOTION_SLOTS.map((slot) => (\n          <TextField\n            key={slot}\n            id={`${baseId}motion-${slot}`}\n            label={MOTION_LABELS[slot]}\n            value={theme.motion?.[slot] ?? ''}\n            placeholder={DEFAULT_MOTION[slot]}\n            onChange={(next) => setMotion(slot, next)}\n          />\n        ))}\n      </ControlSection>\n\n      <ControlSection title=\"Gradient\">\n        <TextField\n          id={`${baseId}gradient-brand`}\n          label=\"Brand gradient\"\n          value={theme.gradient?.brand ?? ''}\n          placeholder={DEFAULT_GRADIENT}\n          onChange={setGradient}\n        />\n      </ControlSection>\n\n      <ControlSection title=\"Logo\">\n        <LogoField\n          id={`${baseId}logo-mark`}\n          label=\"Mark (icon)\"\n          value={value.logo?.mark ?? ''}\n          onChange={(source) => setLogo('mark', source)}\n        />\n        <LogoField\n          id={`${baseId}logo-wordmark`}\n          label=\"Wordmark (full)\"\n          value={value.logo?.wordmark ?? ''}\n          onChange={(source) => setLogo('wordmark', source)}\n        />\n        <Collapsible className=\"tw:flex tw:flex-col tw:gap-2\">\n          <Collapsible.Trigger asChild>\n            <Button variant=\"outline\" size=\"small\" className=\"tw:w-full\">\n              Toggle dark-mode logos\n            </Button>\n          </Collapsible.Trigger>\n          <Collapsible.Content className=\"tw:flex tw:flex-col tw:gap-2\">\n            <LogoField\n              id={`${baseId}logo-mark-dark`}\n              label=\"Mark (dark)\"\n              value={value.logo?.markDark ?? ''}\n              onChange={(source) => setLogo('markDark', source)}\n            />\n            <LogoField\n              id={`${baseId}logo-wordmark-dark`}\n              label=\"Wordmark (dark)\"\n              value={value.logo?.wordmarkDark ?? ''}\n              onChange={(source) => setLogo('wordmarkDark', source)}\n            />\n          </Collapsible.Content>\n        </Collapsible>\n        <div className=\"tw:flex tw:flex-col tw:gap-1\">\n          <span className=\"tw:text-xs tw:text-muted-foreground\">Preview</span>\n          <div className=\"tw:flex tw:min-h-12 tw:items-center tw:gap-4 tw:rounded-md tw:border tw:border-border tw:bg-background tw:p-3\">\n            {value.logo?.mark || value.logo?.wordmark ? (\n              <>\n                {value.logo.mark ? (\n                  <LogoPreviewImage source={value.logo.mark} className=\"tw:h-8\" />\n                ) : null}\n                {value.logo.wordmark ? (\n                  <LogoPreviewImage source={value.logo.wordmark} className=\"tw:h-8\" />\n                ) : null}\n              </>\n            ) : (\n              <span className=\"tw:text-xs tw:text-muted-foreground\">No logo set</span>\n            )}\n          </div>\n        </div>\n      </ControlSection>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAIA,MAAa,iBAAiB,QAAwB;CACpD,IAAI,IAAI,IAAI,KAAK,CAAC,CAAC,QAAQ,MAAM,EAAE;CAGnC,IAAI,EAAE,WAAW,KAAK,EAAE,WAAW,GACjC,IAAI,EACD,MAAM,GAAG,CAAC,CAAC,CACX,MAAM,EAAE,CAAC,CACT,KAAK,MAAM,IAAI,CAAC,CAAC,CACjB,KAAK,EAAE;MACL,IAAI,EAAE,WAAW,GACtB,IAAI,EAAE,MAAM,GAAG,CAAC;CAElB,IAAI,CAAC,mBAAmB,KAAK,CAAC,GAAG,OAAO;CACxC,MAAM,IAAI,SAAS,GAAG,EAAE;CACxB,OAAO,GAAI,KAAK,KAAM,IAAI,GAAI,KAAK,IAAK,IAAI,GAAG,IAAI;AACrD;AAEA,MAAa,iBAAiB,aAA6B;CACzD,MAAM,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,KAAK,SAC3B,KAAK,CAAC,CACN,MAAM,KAAK,CAAC,CACZ,KAAK,MAAM,OAAO,CAAC,KAAK,CAAC;CAC5B,MAAM,OAAO,MAAc,KAAK,IAAI,GAAG,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,SAAS,GAAG,GAAG;CACrF,OAAO,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC;AACpC;;;ACXA,MAAM,eAAe;;AAGrB,MAAa,cAAc,EAAE,IAAI,OAAO,UAAU,eAAsB;CACtE,MAAM,MAAM,cAAc,QAAQ;CAElC,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,oBAAC,OAAD;GAAO,SAAS;GAAI,WAAU;GAC3B,UAAA;EACI,CAAA,GACP,oBAAC,YAAD;GACM;GACJ,QAAO;GACP,OAAO;GACP,WAAU;GACV,gBAAgB,SAAS;IACvB,MAAM,QAAQ,KAAK,KAAK,CAAC,CAAC,QAAQ,MAAM,EAAE;IAE1C,IAAI,aAAa,KAAK,KAAK,GAAG,SAAS,cAAc,IAAI,OAAO,CAAC;GACnE;EACD,CAAA,CACE;;AAET;;;ACtCA,MAAM,gBAAgB,MACpB,OAAO,SAAS,CAAC,IAAI,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,CAAC,CAAC,IAAI;AAEvD,MAAM,iBAAiB,aAA+C;CACpE,MAAM,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,KAAK,SAC3B,KAAK,CAAC,CACN,MAAM,KAAK,CAAC,CACZ,KAAK,MAAM,aAAa,OAAO,CAAC,CAAC,CAAC;CACrC,OAAO;EAAC;EAAG;EAAG;CAAC;AACjB;AAEA,MAAM,qBAAqB,aAA6B;CAGtD,MAAM,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,KAAK,cAAc,QAAQ,CAAC,CAAC,KAAK,MAAM;EAC/D,MAAM,IAAI,IAAI;EACd,OAAO,KAAK,SAAU,IAAI,UAAU,IAAI,QAAS,UAAU;CAC7D,CAAC;CACD,OAAO,QAAS,IAAI,QAAS,IAAI,QAAS;AAC5C;;AAGA,MAAa,iBAAiB,IAAY,OAAuB;CAC/D,MAAM,KAAK,kBAAkB,EAAE;CAC/B,MAAM,KAAK,kBAAkB,EAAE;CAC/B,MAAM,CAAC,SAAS,UAAU,MAAM,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;CACvD,QAAQ,UAAU,QAAS,SAAS;AACtC;;AAGA,MAAa,aAAa,UACxB,SAAS,IAAI,QAAQ,SAAS,MAAM,OAAO;;;;AC3B7C,MAAa,kBAAkB,EAAE,OAAO,eACtC,qBAAC,WAAD;CAAS,WAAU;CAAnB,UAAA,CACE,oBAAC,MAAD;EAAI,WAAU;EACX,UAAA;CACC,CAAA,GACH,QACM;;;;;ACDX,MAAa,aAAa,EAAE,IAAI,OAAO,OAAO,eAC5C,qBAAC,OAAD;CAAK,WAAU;CAAf,UAAA,CACE,oBAAC,OAAD;EAAO,SAAS;EAAI,WAAU;EAC3B,UAAA;CACI,CAAA,GACP,oBAAC,UAAD;EACM;EACG;EACP,eAAe;EACf,SAAS;EACT,aAAY;EACZ,WAAU;CACX,CAAA,CACE;;;;;ACXP,MAAa,aAAa,EAAE,IAAI,OAAO,OAAO,UAAU,kBACtD,qBAAC,OAAD;CAAK,WAAU;CAAf,UAAA,CACE,oBAAC,OAAD;EAAO,SAAS;EAAI,WAAU;EAC3B,UAAA;CACI,CAAA,GACP,oBAAC,WAAD;EACM;EACJ,QAAO;EACA;EACP,eAAe;EACF;EACb,WAAU;CACX,CAAA,CACE;;;;ACgBP,MAAa,wBAAwB;AAErC,MAAa,uBAA2D;CACtE;EAAE,OAAO;EAAuB,OAAO;CAAkB;CACzD;EAAE,OAAO;EAA0C,OAAO;CAAgB;CAC1E;EAAE,OAAO;EAAoC,OAAO;CAAU;CAC9D;EAAE,OAAO;EAAoC,OAAO;CAAU;CAC9D;EAAE,OAAO;EAAsC,OAAO;CAAY;CAClE;EAAE,OAAO;EAAoC,OAAO;CAAU;CAC9D;EAAE,OAAO;EAA8B,OAAO;CAAmB;CACjE;EAAE,OAAO;EAAqC,OAAO;CAAkB;CACvE;EAAE,OAAO;EAA6C,OAAO;CAAiB;CAC9E;EAAE,OAAO;EAAyB,OAAO;CAAY;AACvD;AAMA,MAAM,eAA0C;CAC9C,SAAS;CACT,mBAAmB;CACnB,YAAY;CACZ,YAAY;CACZ,MAAM;CACN,gBAAgB;CAChB,SAAS;CACT,mBAAmB;CACnB,WAAW;CACX,qBAAqB;CACrB,OAAO;CACP,iBAAiB;CACjB,QAAQ;CACR,kBAAkB;CAClB,QAAQ;CACR,OAAO;CACP,iBAAiB;CACjB,MAAM;CACN,YAAY;CACZ,aAAa;CACb,uBAAuB;CACvB,SAAS;CACT,mBAAmB;CACnB,SAAS;CACT,mBAAmB;CACnB,MAAM;CACN,gBAAgB;AAClB;AAEA,MAAM,qBAAqD;CACzD,OAAO;CACP,iBAAiB;CACjB,SAAS;CACT,UAAU;CACV,oBAAoB;CACpB,OAAO;AACT;AAGA,MAAM,uBAAuD;CAC3D,OAAO;CACP,iBAAiB;CACjB,SAAS;CACT,UAAU;CACV,oBAAoB;CACpB,OAAO;AACT;AAEA,MAAM,2BAA2B;AAEjC,MAAM,iBAA8C;CAClD,SAAS;CACT,mBAAmB;CACnB,gBAAgB;CAChB,0BAA0B;CAC1B,eAAe;CACf,yBAAyB;CACzB,eAAe;CACf,aAAa;AACf;AAEA,MAAM,uBAAyD;CAC7D,cAAc;CACd,wBAAwB;CACxB,iBAAiB;CACjB,2BAA2B;AAC7B;AAEA,MAAM,eAA0C;CAC9C,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;AACV;AAEA,MAAM,gBAAgD;CACpD,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,MAAM;AACR;AAEA,MAAM,gBAA4C;CAChD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,MAAM;AACR;AAEA,MAAM,iBAA8C;CAClD,QAAQ;CACR,OAAO;AACT;AAEA,MAAM,gBAA4C;CAChD,UAAU;CACV,QAAQ;AACV;AAEA,MAAM,cAAc,OAAO,KAAK,YAAY;AAC5C,MAAM,oBAAoB,OAAO,KAAK,kBAAkB;AACxD,MAAM,sBAAsB,OAAO,KAAK,oBAAoB;AAC5D,MAAM,gBAAgB,OAAO,KAAK,cAAc;AAChD,MAAM,cAAc,OAAO,KAAK,YAAY;AAC5C,MAAM,eAAe,OAAO,KAAK,aAAa;AAC9C,MAAM,eAAe,OAAO,KAAK,aAAa;AAC9C,MAAM,gBAAgB,OAAO,KAAK,cAAc;AAChD,MAAM,eAAe,OAAO,KAAK,aAAa;AAC9C,MAAM,eAA6B;CAAC;CAAM;CAAM;CAAM;CAAQ;CAAW;CAAS;CAAS;AAAO;AAGlG,MAAM,aAAgE;CACpE;EAAE,OAAO;EAAsB,IAAI;EAAc,IAAI;CAAa;CAClE;EAAE,OAAO;EAAgB,IAAI;EAAkB,IAAI;CAAO;CAC1D;EAAE,OAAO;EAAkB,IAAI;EAAqB,IAAI;CAAU;CAClE;EAAE,OAAO;EAAc,IAAI;EAAmB,IAAI;CAAQ;CAC1D;EAAE,OAAO;EAAU,IAAI;EAAoB,IAAI;CAAS;AAC1D;AAKA,MAAM,kBAAyE;CAC7E,OAAO;EACL,SAAS;EACT,mBAAmB;EACnB,gBAAgB;EAChB,0BAA0B;EAC1B,eAAe;EACf,yBAAyB;EACzB,eAAe;EACf,aAAa;CACf;CACA,MAAM;EACJ,SAAS;EACT,mBAAmB;EACnB,gBAAgB;EAChB,0BAA0B;EAC1B,eAAe;EACf,yBAAyB;EACzB,eAAe;EACf,aAAa;CACf;AACF;AAEA,MAAM,gBAAsD;CAC1D,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAGA,MAAM,yBACJ,MACA,UACW;CACX,IAAI,SAAS,WAAW,OAAO;CAC/B,IAAI,SAAS,SAAS,OAAO;CAC7B,OAAO,MAAM;AACf;AAIA,MAAM,gBAAqE;CACzE,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;CACV;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;CACV;AACF;AAIA,MAAM,uBAAuD;CAC3D,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,MAAM;AACR;AAGA,MAAM,yBAAyB;AAI/B,MAAM,gBAAgB;AAItB,MAAM,kBAA8C;CAClD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,MAAM;AACR;AAEA,MAAM,kBAA+C;CACnD,QAAQ;CACR,OAAO;AACT;AAEA,MAAM,iBAA6C;CACjD,UAAU;CACV,QAAQ;AACV;AAEA,MAAM,mBACJ;AAGF,MAAM,SAAS,OAAe,aAA6B;CACzD,MAAM,IAAI,OAAO,WAAW,KAAK;CACjC,OAAO,OAAO,SAAS,CAAC,IAAI,IAAI;AAClC;AAMA,MAAM,qBAAqB,UAA0B;CACnD,MAAM,IAAI,OAAO,WAAW,KAAK;CACjC,IAAI,CAAC,OAAO,SAAS,CAAC,GAAG,OAAO;CAChC,OAAO,MAAM,KAAK,CAAC,CAAC,SAAS,IAAI,IAAI,IAAI,KAAK;AAChD;AAEA,MAAM,qBAAqB,IAAY,iBACrC,aAAa,KAAK,CAAC,CAAC,SAAS,IAAI,IAAI,GAAG,QAAQ,KAAK,GAAA,CAAI,QAAQ,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG;AAKnF,MAAM,cAAc,UAA0B;CAC5C,MAAM,IAAI,OAAO,WAAW,KAAK;CACjC,IAAI,CAAC,OAAO,SAAS,CAAC,GAAG,OAAO;CAChC,OAAO,KAAK,MAAM,MAAM,KAAK,CAAC,CAAC,SAAS,KAAK,IAAI,IAAI,KAAK,CAAC;AAC7D;AAEA,MAAM,cAAc,IAAY,iBAAiC;CAC/D,MAAM,UAAU,aAAa,KAAK;CAClC,IAAI,QAAQ,SAAS,KAAK,GAAG,OAAO,GAAG,KAAK,GAAG;CAE/C,IAAI,gBAAgB,KAAK,OAAO,GAAG,OAAO,GAAG;CAC7C,OAAO,GAAG,GAAG;AACf;AAeA,MAAM,eAAe,WAAmB,OAAO,UAAU,CAAC,CAAC,WAAW,GAAG;AACzE,MAAM,iBAAiB,WAAmB,uBAAuB,KAAK,OAAO,KAAK,CAAC;;AAGnF,MAAM,oBAAoB,EAAE,QAAQ,gBAAwD;CAC1F,MAAM,UAAU,cAEZ,YAAY,MAAM,IACd,UAAU,SAAS,QAAQ,EAAE,cAAc;EAAE,KAAK;EAAM,YAAY;CAAK,EAAE,CAAC,IAC5E,MACN,CAAC,MAAM,CACT;CAEA,IAAI,YAAY,MAGd,OAAO,oBAAC,QAAD;EAAM,eAAA;EAAuB;EAAW,yBAAyB,EAAE,QAAQ,QAAQ;CAAI,CAAA;CAEhG,IAAI,cAAc,MAAM,GACtB,OAAO,oBAAC,OAAD;EAAK,KAAK;EAAQ,KAAI;EAAc;CAAY,CAAA;CAEzD,OAAO;AACT;;;;;;;AAQA,MAAa,eAAe,EAC1B,OACA,UACA,cAAc,SACd,qBACA,cAAc,2BACQ;CAEtB,MAAM,SAAS,MAAM;CACrB,MAAM,EAAE,UAAU;CAClB,MAAM,aAAa,gBAAgB,UAAU,MAAM,SAAS,MAAM;CAClE,MAAM,gBAAgB,gBAAgB,UAAU,MAAM,QAAQ,UAAU,MAAM,YAAY;CAC1F,MAAM,cAAc,gBAAgB,UAAU,MAAM,QAAQ,QAAQ,MAAM,YAAY;CAEtF,MAAM,gBAAgB,gBAAgB,UAAU,QAAQ,MAAM,SAAS,QAAQ,MAAM;CACrF,MAAM,QAAQ,MAAM,SAAS;CAC7B,MAAM,aAAa,MAAM;CAEzB,MAAM,YAAY,MAAiB,aAAqB;EACtD,IAAI,gBAAgB,SAAS;GAC3B,SAAS;IAAE,GAAG;IAAO,OAAO;KAAE,GAAG;KAAO,QAAQ;MAAE,GAAG,MAAM;OAAS,OAAO;KAAS;IAAE;GAAE,CAAC;GACzF;EACF;EAGA,SAAS;GACP,GAAG;GACH,OAAO;IAAE,GAAG;IAAO,YAAY;KAAE,GAAG,MAAM;MAAa,OAAO;IAAS;GAAE;EAC3E,CAAC;CACH;CAEA,MAAM,iBAAiB,MAAsB,UAAkB;EAC7D,MAAM,OAAO,MAAM,KAAK,KAAK,KAAA;EAC7B,IAAI,gBAAgB,SAAS;GAC3B,SAAS;IAAE,GAAG;IAAO,OAAO;KAAE,GAAG;KAAO,QAAQ;MAAE,GAAG,MAAM;OAAS,OAAO;KAAK;IAAE;GAAE,CAAC;GACrF;EACF;EACA,SAAS;GAAE,GAAG;GAAO,OAAO;IAAE,GAAG;IAAO,YAAY;KAAE,GAAG,MAAM;MAAa,OAAO;IAAK;GAAE;EAAE,CAAC;CAC/F;CAEA,MAAM,sBAAsB,aAC1B,SAAS;EAAE,GAAG;EAAO,OAAO;GAAE,GAAG;GAAO,SAAS;IAAE,GAAG,MAAM;IAAS;GAAS;EAAE;CAAE,CAAC;CAErF,MAAM,mBAAmB,MAAmB,aAAqB;EAC/D,IAAI,gBAAgB,SAAS;GAC3B,MAAM,OAAO,MAAM,QAAQ,WAAW,gBAAgB;GACtD,SAAS;IACP,GAAG;IACH,OAAO;KAAE,GAAG;KAAO,QAAQ;MAAE,GAAG,MAAM;MAAQ,SAAS;OAAE,GAAG;QAAO,OAAO;MAAS;KAAE;IAAE;GACzF,CAAC;GACD;EACF;EAGA,MAAM,cAAc,MAAM,YAAY,WAAW,gBAAgB;EACjE,SAAS;GACP,GAAG;GACH,OAAO;IACL,GAAG;IACH,YAAY;KAAE,GAAG,MAAM;KAAY,SAAS;MAAE,GAAG;OAAc,OAAO;KAAS;IAAE;GACnF;EACF,CAAC;CACH;CAEA,MAAM,mBAAmB,MAAwB,UAAkB;EACjE,MAAM,OAAO,MAAM,KAAK,KAAK,KAAA;EAC7B,MAAM,UAAU,gBAAgB,UAAU,WAAW;EACrD,MAAM,UAAU;GAAE,GAAI,MAAM,QAAQ,EAAE,WAAW,gBAAgB;IAAgB,OAAO;EAAK;EAC7F,SAAS;GAAE,GAAG;GAAO,OAAO;IAAE,GAAG;KAAQ,UAAU;KAAE,GAAG,MAAM;KAAU;IAAQ;GAAE;EAAE,CAAC;CACvF;CAEA,MAAM,YAAY,MAAiB,aAAqB;EAEtD,MAAM,QAAQ;GAAE,GADH,eAAe,cAAc;IAChB,OAAO;EAAS;EAC1C,IAAI,gBAAgB,SAAS;GAC3B,SAAS;IAAE,GAAG;IAAO,OAAO;KAAE,GAAG;KAAO,QAAQ;MAAE,GAAG,MAAM;MAAQ;KAAM;IAAE;GAAE,CAAC;GAC9E;EACF;EACA,SAAS;GAAE,GAAG;GAAO,OAAO;IAAE,GAAG;IAAO,YAAY;KAAE,GAAG,MAAM;KAAY;IAAM;GAAE;EAAE,CAAC;CACxF;CAEA,MAAM,aAAa,MAAkB,WACnC,SAAS;EACP,GAAG;EACH,OAAO;GAAE,GAAG;GAAO,OAAO;IAAE,GAAI,MAAM,SAAS;KAAiB,OAAO;GAAO;EAAE;CAClF,CAAC;CAGH,MAAM,mBAAmB,UACvB,SAAS;EAAE,GAAG;EAAO,OAAO;GAAE,GAAG;GAAO,YAAY;IAAE,GAAG,MAAM;IAAY,GAAG;GAAM;EAAE;CAAE,CAAC;CAE3F,MAAM,eAAe,MAAgB,SACnC,gBAAgB,GAAG,OAAO,KAAK,KAAK,KAAK,KAAA,EAAU,CAAC;CAEtD,MAAM,iBAAiB,MAAsB,WAC3C,gBAAgB,EAAE,QAAQ;EAAE,GAAG,MAAM,YAAY;GAAS,OAAO,UAAU,KAAA;CAAU,EAAE,CAAC;CAE1F,MAAM,oBAAoB,WACxB,gBAAgB,EAAE,eAAe,EAAE,QAAQ,OAAO,KAAK,KAAK,KAAA,EAAU,EAAE,CAAC;CAE3E,MAAM,aAAa,MAAkB,WACnC,SAAS;EACP,GAAG;EACH,OAAO;GAAE,GAAG;GAAO,SAAS;IAAE,GAAG,MAAM;KAAU,OAAO,OAAO,KAAK,KAAK,KAAA;GAAU;EAAE;CACvF,CAAC;CAEH,MAAM,cAAc,MAAmB,WACrC,SAAS;EACP,GAAG;EACH,OAAO;GAAE,GAAG;GAAO,SAAS;IAAE,GAAG,MAAM;KAAU,OAAO,OAAO,KAAK,KAAK,KAAA;GAAU;EAAE;CACvF,CAAC;CAEH,MAAM,aAAa,MAAkB,UACnC,SAAS;EACP,GAAG;EACH,OAAO;GAAE,GAAG;GAAO,QAAQ;IAAE,GAAG,MAAM;KAAS,OAAO,MAAM,KAAK,KAAK,KAAA;GAAU;EAAE;CACpF,CAAC;CAEH,MAAM,eAAe,aACnB,SAAS;EACP,GAAG;EACH,OAAO;GAAE,GAAG;GAAO,UAAU,EAAE,OAAO,SAAS,KAAK,KAAK,KAAA,EAAU;EAAE;CACvE,CAAC;CAEH,MAAM,WAAW,MAAwC,WAAmB;EAC1E,MAAM,UAAU,OAAO,KAAK;EAC5B,MAAM,WAAuC,EAAE,GAAG,MAAM,KAAK;EAC7D,IAAI,SAAS,SAAS,QAAQ;OACzB,OAAO,SAAS;EACrB,MAAM,EAAE,MAAM,OAAO,GAAG,SAAS;EACjC,SAAS,OAAO,KAAK,QAAQ,CAAC,CAAC,SAAS,IAAI;GAAE,GAAG;GAAO,MAAM;EAAS,IAAI,IAAI;CACjF;CAEA,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACE,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA,CACG,sBACC,qBAAC,aAAD;KACE,MAAK;KACL,OAAO;KACP,gBAAgB,SAAS;MACvB,IAAI,SAAS,WAAW,SAAS,QAAQ,oBAAoB,IAAI;KACnE;KACA,cAAW;KACX,WAAU;KAPZ,UAAA,CASE,oBAAC,YAAY,MAAb;MAAkB,OAAM;MAAQ,WAAU;MAAY,UAAA;KAEpC,CAAA,GAClB,oBAAC,YAAY,MAAb;MAAkB,OAAM;MAAO,WAAU;MAAY,UAAA;KAEnC,CAAA,CACP;IACX,CAAA,IAAA,MACJ,oBAAC,OAAD;KAAK,WAAU;KACZ,UAAA,YAAY,KAAK,SAChB,oBAAC,YAAD;MAEE,IAAI,GAAG,OAAO,QAAQ,YAAY,GAAG;MACrC,OAAO,aAAa;MACpB,UAAU,aAAa,SAAS,gBAAgB,SAAS;MACzD,WAAW,aAAa,SAAS,MAAM,QAAQ;KAChD,GALM,IAKN,CACF;IACE,CAAA,CACS;;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA,CACE,qBAAC,KAAD;KAAG,WAAU;KAAb,UAAA;MAA0D;MACjC;MAAY;KAClC;IACH,CAAA,GAAA,oBAAC,OAAD;KAAK,WAAU;KACZ,UAAA,WAAW,KAAK,SAAS;MACxB,MAAM,KAAK,aAAa,KAAK,OAAO,gBAAgB,KAAK,OAAO;MAChE,MAAM,KAAK,aAAa,KAAK,OAAO,gBAAgB,KAAK,OAAO;MAChE,MAAM,QAAQ,cAAc,IAAI,EAAE;MAClC,MAAM,QAAQ,UAAU,KAAK;MAC7B,OACE,qBAAC,OAAD;OAAsB,WAAU;OAAhC,UAAA,CACE,oBAAC,QAAD;QAAM,WAAU;QAAiC,UAAA,KAAK;OAAY,CAAA,GAClE,qBAAC,QAAD;QAAM,WAAU;QAAhB,UAAA,CACE,qBAAC,QAAD;SAAM,WAAU;SAAhB,UAAA,CACG,MAAM,QAAQ,CAAC,GAAE,IACd;QACN,CAAA,GAAA,oBAAC,OAAD;SAAO,OAAO,UAAU,SAAS,QAAQ;SACtC,UAAA,UAAU,SAAS,SAAS;QACxB,CAAA,CACH;OACH,CAAA,CAAA;MAVK,GAAA,KAAK,KAUV;KAET,CAAC;IACE,CAAA,CACS;;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA;KACE,qBAAC,KAAD;MAAG,WAAU;MAAb,UAAA;OAA0D;OACD;OAAY;MAElE;;KACH,oBAAC,OAAD;MAAK,WAAU;MACZ,UAAA,kBAAkB,KAAK,SACtB,oBAAC,WAAD;OAEE,IAAI,GAAG,OAAO,QAAQ,YAAY,GAAG;OACrC,OAAO,mBAAmB;OAC1B,OAAO,aAAa,SAAS;OAC7B,aAAa,qBAAqB;OAClC,WAAW,SAAS,cAAc,MAAM,IAAI;MAC7C,GANM,IAMN,CACF;KACE,CAAA;KACL,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,qBAAC,OAAD;OAAK,WAAU;OAAf,UAAA,CACE,oBAAC,OAAD;QAAO,WAAU;QAA+C,UAAA;OAAuB,CAAA,GACvF,oBAAC,QAAD;QAAM,WAAU;QACb,UAAA,MAAM,SAAS,YAAY;OACxB,CAAA,CACH;MACL,CAAA,GAAA,oBAAC,QAAD;OACE,cAAW;OACX,KAAK;OACL,KAAK;OACL,MAAM;OACN,OAAO,CAAC,OAAO,MAAM,SAAS,YAAY,wBAAwB,CAAC;OACnE,gBAAgB,WAAW,oBAAoB,OAAO,MAAM,GAAA,CAAK,QAAQ,CAAC,CAAC;MAC5E,CAAA,CACE;;IACS;;GAEhB,oBAAC,gBAAD;IAAgB,OAAM;IACpB,UAAA,qBAAC,aAAD;KAAa,WAAU;KAAvB,UAAA,CACE,oBAAC,YAAY,SAAb;MAAqB,SAAA;MACnB,UAAA,qBAAC,QAAD;OAAQ,SAAQ;OAAU,MAAK;OAAQ,WAAU;OAAjD,UAAA;QAA6D;QACnC;QAAY;OAC9B;;KACW,CAAA,GACrB,qBAAC,YAAY,SAAb;MAAqB,WAAU;MAA/B,UAAA,CACG,cAAc,KAAK,SAClB,oBAAC,YAAD;OAEE,IAAI,GAAG,OAAO,UAAU,YAAY,GAAG;OACvC,OAAO,eAAe;OACtB,UAAU,gBAAgB,SAAS,gBAAgB,YAAY,CAAC;OAChE,WAAW,aAAa,gBAAgB,MAAM,QAAQ;MACvD,GALM,IAKN,CACF,GACA,oBAAoB,KAAK,SACxB,oBAAC,WAAD;OAEE,IAAI,GAAG,OAAO,gBAAgB,YAAY,GAAG;OAC7C,OAAO,WAAW,qBAAqB,KAAK,CAAC,YAAY;OACzD,OAAO,gBAAgB,SAAS;OAChC,aAAY;OACZ,WAAW,SAAS,gBAAgB,MAAM,IAAI;MAC/C,GANM,IAMN,CACF,CACkB;KACV,CAAA,CAAA;;GACC,CAAA;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA,CACE,qBAAC,KAAD;KAAG,WAAU;KAAb,UAAA;MAA0D;MACpB;MAAY;KAC/C;IACH,CAAA,GAAA,oBAAC,OAAD;KAAK,WAAU;KACZ,UAAA,YAAY,KAAK,SAChB,oBAAC,YAAD;MAEE,IAAI,GAAG,OAAO,QAAQ,YAAY,GAAG;MACrC,OAAO,aAAa;MACpB,UAAU,cAAc,SAAS,cAAc,YAAY,CAAC;MAC5D,WAAW,aAAa,SAAS,MAAM,QAAQ;KAChD,GALM,IAKN,CACF;IACE,CAAA,CACS;;GAEhB,oBAAC,gBAAD;IAAgB,OAAM;IACnB,UAAA,aAAa,KAAK,SAAS;KAC1B,MAAM,UAAU,MAAM,SAAS,sBAAsB,MAAM,KAAK;KAChE,MAAM,KAAK,WAAW,OAAO;KAC7B,OACE,qBAAC,OAAD;MAAgB,WAAU;MAA1B,UAAA,CACE,qBAAC,OAAD;OAAK,WAAU;OAAf,UAAA,CACE,oBAAC,OAAD;QAAO,WAAU;QACd,UAAA;OACI,CAAA,GACP,oBAAC,QAAD;QAAM,WAAU;QACb,UAAA;OACG,CAAA,CACH;MACL,CAAA,GAAA,oBAAC,QAAD;OACE,KAAK;OACL,KAAK;OACL,MAAM;OACN,OAAO,CAAC,EAAE;OACV,gBAAgB,WAAW,UAAU,MAAM,WAAW,OAAO,MAAM,GAAG,OAAO,CAAC;MAC/E,CAAA,CACE;KAhBK,GAAA,IAgBL;IAET,CAAC;GACa,CAAA;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA;KACE,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,oBAAC,OAAD;OACE,SAAS,GAAG,OAAO;OACnB,WAAU;OACX,UAAA;MAEM,CAAA,GACP,oBAAC,QAAD;OACE,IAAI,GAAG,OAAO;OACd,OAAO,YAAY,cAAA;OACnB,gBAAgB,SAAS,YAAY,cAAc,IAAI;OACvD,OAAO;MACR,CAAA,CACE;;KACL,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,oBAAC,OAAD;OACE,SAAS,GAAG,OAAO;OACnB,WAAU;OACX,UAAA;MAEM,CAAA,GACP,oBAAC,QAAD;OACE,IAAI,GAAG,OAAO;OACd,OAAO,YAAY,eAAe,YAAY,cAAA;OAC9C,gBAAgB,SAAS,YAAY,eAAe,IAAI;OACxD,OAAO;MACR,CAAA,CACE;;KACL,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,oBAAC,OAAD;OACE,SAAS,GAAG,OAAO;OACnB,WAAU;OACX,UAAA;MAEM,CAAA,GACP,oBAAC,QAAD;OACE,IAAI,GAAG,OAAO;OACd,OAAO,YAAY,YAAY;OAC/B,gBAAgB,SAAS,YAAY,YAAY,IAAI;OACrD,OAAO;MACR,CAAA,CACE;;KAEL,oBAAC,QAAD;MAAM,WAAU;MAAsC,UAAA;KAAyB,CAAA;KAC9E,aAAa,KAAK,SAAS;MAC1B,MAAM,UAAU,YAAY,SAAS,SAAS,qBAAqB;MACnE,OACE,qBAAC,OAAD;OAAgB,WAAU;OAA1B,UAAA,CACE,qBAAC,OAAD;QAAK,WAAU;QAAf,UAAA,CACE,oBAAC,OAAD;SAAO,WAAU;SACd,UAAA,cAAc;QACV,CAAA,GACP,oBAAC,QAAD;SAAM,WAAU;SACb,UAAA;QACG,CAAA,CACH;OACL,CAAA,GAAA,oBAAC,QAAD;QACE,KAAK;QACL,KAAK;QACL,MAAM;QACN,OAAO,CAAC,MAAM,SAAS,GAAG,CAAC;QAC3B,gBAAgB,WAAW,cAAc,MAAM,OAAO,OAAO,MAAM,GAAG,CAAC;OACxE,CAAA,CACE;MAhBK,GAAA,IAgBL;KAET,CAAC;KAED,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,qBAAC,OAAD;OAAK,WAAU;OAAf,UAAA,CACE,oBAAC,OAAD;QAAO,WAAU;QAA+C,UAAA;OAEzD,CAAA,GACP,oBAAC,QAAD;QAAM,WAAU;QACb,UAAA,YAAY,eAAe,UAAU;OAClC,CAAA,CACH;MACL,CAAA,GAAA,oBAAC,QAAD;OACE,KAAK;OACL,KAAK;OACL,MAAM;OACN,OAAO,CAAC,kBAAkB,YAAY,eAAe,UAAU,sBAAsB,CAAC;OACtF,gBAAgB,WACd,iBACE,kBACE,OAAO,MAAM,GACb,YAAY,eAAe,UAAU,sBACvC,CACF;MAEH,CAAA,CACE;;IACS;;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA,CACE,oBAAC,KAAD;KAAG,WAAU;KAA6C,UAAA;IAEvD,CAAA,GACF,aAAa,KAAK,SACjB,oBAAC,WAAD;KAEE,IAAI,GAAG,OAAO,SAAS;KACvB,OAAO,cAAc;KACrB,OAAO,MAAM,UAAU,SAAS;KAChC,aAAa,gBAAgB;KAC7B,WAAW,SAAS,UAAU,MAAM,IAAI;IACzC,GANM,IAMN,CACF,CACa;;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA,CACE,oBAAC,KAAD;KAAG,WAAU;KAA6C,UAAA;IAEvD,CAAA,GACF,cAAc,KAAK,SAClB,oBAAC,WAAD;KAEE,IAAI,GAAG,OAAO,UAAU;KACxB,OAAO,eAAe;KACtB,OAAO,MAAM,UAAU,SAAS;KAChC,aAAa,gBAAgB;KAC7B,WAAW,SAAS,WAAW,MAAM,IAAI;IAC1C,GANM,IAMN,CACF,CACa;;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA,CACE,oBAAC,KAAD;KAAG,WAAU;KAA6C,UAAA;IAEvD,CAAA,GACF,aAAa,KAAK,SACjB,oBAAC,WAAD;KAEE,IAAI,GAAG,OAAO,SAAS;KACvB,OAAO,cAAc;KACrB,OAAO,MAAM,SAAS,SAAS;KAC/B,aAAa,eAAe;KAC5B,WAAW,SAAS,UAAU,MAAM,IAAI;IACzC,GANM,IAMN,CACF,CACa;;GAEhB,oBAAC,gBAAD;IAAgB,OAAM;IACpB,UAAA,oBAAC,WAAD;KACE,IAAI,GAAG,OAAO;KACd,OAAM;KACN,OAAO,MAAM,UAAU,SAAS;KAChC,aAAa;KACb,UAAU;IACX,CAAA;GACa,CAAA;GAEhB,qBAAC,gBAAD;IAAgB,OAAM;IAAtB,UAAA;KACE,oBAAC,WAAD;MACE,IAAI,GAAG,OAAO;MACd,OAAM;MACN,OAAO,MAAM,MAAM,QAAQ;MAC3B,WAAW,WAAW,QAAQ,QAAQ,MAAM;KAC7C,CAAA;KACD,oBAAC,WAAD;MACE,IAAI,GAAG,OAAO;MACd,OAAM;MACN,OAAO,MAAM,MAAM,YAAY;MAC/B,WAAW,WAAW,QAAQ,YAAY,MAAM;KACjD,CAAA;KACD,qBAAC,aAAD;MAAa,WAAU;MAAvB,UAAA,CACE,oBAAC,YAAY,SAAb;OAAqB,SAAA;OACnB,UAAA,oBAAC,QAAD;QAAQ,SAAQ;QAAU,MAAK;QAAQ,WAAU;QAAY,UAAA;OAErD,CAAA;MACW,CAAA,GACrB,qBAAC,YAAY,SAAb;OAAqB,WAAU;OAA/B,UAAA,CACE,oBAAC,WAAD;QACE,IAAI,GAAG,OAAO;QACd,OAAM;QACN,OAAO,MAAM,MAAM,YAAY;QAC/B,WAAW,WAAW,QAAQ,YAAY,MAAM;OACjD,CAAA,GACD,oBAAC,WAAD;QACE,IAAI,GAAG,OAAO;QACd,OAAM;QACN,OAAO,MAAM,MAAM,gBAAgB;QACnC,WAAW,WAAW,QAAQ,gBAAgB,MAAM;OACrD,CAAA,CACkB;MACV,CAAA,CAAA;;KACb,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,oBAAC,QAAD;OAAM,WAAU;OAAsC,UAAA;MAAa,CAAA,GACnE,oBAAC,OAAD;OAAK,WAAU;OACZ,UAAA,MAAM,MAAM,QAAQ,MAAM,MAAM,WAC/B,qBAAA,YAAA,EAAA,UAAA,CACG,MAAM,KAAK,OACV,oBAAC,kBAAD;QAAkB,QAAQ,MAAM,KAAK;QAAM,WAAU;OAAU,CAAA,IAC7D,MACH,MAAM,KAAK,WACV,oBAAC,kBAAD;QAAkB,QAAQ,MAAM,KAAK;QAAU,WAAU;OAAU,CAAA,IACjE,IACJ,EAAA,CAAA,IAEF,oBAAC,QAAD;QAAM,WAAU;QAAsC,UAAA;OAAiB,CAAA;MAEtE,CAAA,CACF;;IACS;;EACb;;AAET"}

package/dist/{BrandLogo-CKpVSZb6.js → BrandLogo-BfITD0im.js}

@@ -1,4 +1,4 @@
-import { cn } from "./classNames-BzrkDnOD.js";
+import { cn } from "./classNames-DcGnTh2N.js";
 import { useTheme } from "./context-U293r3v-.js";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -43,4 +43,4 @@ const BrandLogo = ({ variant = "wordmark", className, label }) => {
 //#endregion
 export { BrandLogo };
 
-//# sourceMappingURL=BrandLogo-CKpVSZb6.js.map
+//# sourceMappingURL=BrandLogo-BfITD0im.js.map

package/dist/{BrandLogo-CKpVSZb6.js.map → BrandLogo-BfITD0im.js.map}

@@ -1 +1 @@
-{"version":3,"file":"BrandLogo-CKpVSZb6.js","names":[],"sources":["../src/components/BrandLogo/BrandLogo.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport DOMPurify from 'dompurify';\n\nimport type { Brand } from '@keboola/brand-registry';\n\nimport { cn } from '../../utils';\nimport { type ResolvedColorScheme, useTheme } from '../ThemeProvider';\n\ntype Props = {\n  /** `wordmark` (default, full logo) or `mark` (square icon); each falls back to the other. */\n  variant?: 'mark' | 'wordmark';\n  /** Sets the logo height; aspect ratio is preserved (e.g. `tw:h-7`). */\n  className?: string;\n  /**\n   * Accessible name; defaults to the brand's picker `name`, suffixes included (`Keboola (V2)`).\n   * Pass the product name where the logo names something, e.g. a link.\n   */\n  label?: string;\n};\n\nconst isInlineSvg = (source: string) => source.trimStart().startsWith('<');\n\n// Resolved mode wins, then the other mode, then the other variant.\nconst resolveLogoSource = (\n  logo: Brand['logo'],\n  variant: 'mark' | 'wordmark',\n  mode: ResolvedColorScheme,\n): string | undefined => {\n  if (!logo) return undefined;\n  const forMode = (light?: string, dark?: string) =>\n    mode === 'dark' ? (dark ?? light) : (light ?? dark);\n  const mark = forMode(logo.mark, logo.markDark);\n  const wordmark = forMode(logo.wordmark, logo.wordmarkDark);\n  return variant === 'mark' ? (mark ?? wordmark) : (wordmark ?? mark);\n};\n\n// Reference SVGs omit width/height; without a default height they render ~150px tall.\nconst wrapperClass = 'tw:inline-flex tw:h-6 tw:items-center tw:[&>svg]:h-full tw:[&>svg]:w-auto';\n\n/**\n * The active brand's logo from the nearest `<ThemeProvider>`, or `null` if it ships none.\n * Inline SVG inherits `currentColor`; URLs use `<img>`.\n */\nexport const BrandLogo = ({ variant = 'wordmark', className, label }: Props) => {\n  const { currentTheme, resolvedScheme } = useTheme();\n  const source = resolveLogoSource(currentTheme.logo, variant, resolvedScheme);\n\n  // Brands can come from customer config or a paste field, so the SVG is untrusted.\n  const safeSvg = useMemo(\n    () =>\n      source && isInlineSvg(source)\n        ? DOMPurify.sanitize(source, { USE_PROFILES: { svg: true, svgFilters: true } })\n        : null,\n    [source],\n  );\n\n  if (!source) return null;\n\n  if (safeSvg !== null) {\n    return (\n      <span\n        role=\"img\"\n        aria-label={label ?? currentTheme.name}\n        className={cn(wrapperClass, className)}\n        dangerouslySetInnerHTML={{ __html: safeSvg }}\n      />\n    );\n  }\n\n  return (\n    <span className={cn(wrapperClass, className)}>\n      <img src={source} alt={label ?? currentTheme.name} className=\"tw:h-full tw:w-auto\" />\n    </span>\n  );\n};\n"],"mappings":";;;;;;AAoBA,MAAM,eAAe,WAAmB,OAAO,UAAU,CAAC,CAAC,WAAW,GAAG;AAGzE,MAAM,qBACJ,MACA,SACA,SACuB;CACvB,IAAI,CAAC,MAAM,OAAO,KAAA;CAClB,MAAM,WAAW,OAAgB,SAC/B,SAAS,SAAU,QAAQ,QAAU,SAAS;CAChD,MAAM,OAAO,QAAQ,KAAK,MAAM,KAAK,QAAQ;CAC7C,MAAM,WAAW,QAAQ,KAAK,UAAU,KAAK,YAAY;CACzD,OAAO,YAAY,SAAU,QAAQ,WAAa,YAAY;AAChE;AAGA,MAAM,eAAe;;;;;AAMrB,MAAa,aAAa,EAAE,UAAU,YAAY,WAAW,YAAmB;CAC9E,MAAM,EAAE,cAAc,mBAAmB,SAAS;CAClD,MAAM,SAAS,kBAAkB,aAAa,MAAM,SAAS,cAAc;CAG3E,MAAM,UAAU,cAEZ,UAAU,YAAY,MAAM,IACxB,UAAU,SAAS,QAAQ,EAAE,cAAc;EAAE,KAAK;EAAM,YAAY;CAAK,EAAE,CAAC,IAC5E,MACN,CAAC,MAAM,CACT;CAEA,IAAI,CAAC,QAAQ,OAAO;CAEpB,IAAI,YAAY,MACd,OACE,oBAAC,QAAD;EACE,MAAK;EACL,cAAY,SAAS,aAAa;EAClC,WAAW,GAAG,cAAc,SAAS;EACrC,yBAAyB,EAAE,QAAQ,QAAQ;CAC5C,CAAA;CAIL,OACE,oBAAC,QAAD;EAAM,WAAW,GAAG,cAAc,SAAS;EACzC,UAAA,oBAAC,OAAD;GAAK,KAAK;GAAQ,KAAK,SAAS,aAAa;GAAM,WAAU;EAAuB,CAAA;CAChF,CAAA;AAEV"}
+{"version":3,"file":"BrandLogo-BfITD0im.js","names":[],"sources":["../src/components/BrandLogo/BrandLogo.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport DOMPurify from 'dompurify';\n\nimport type { Brand } from '@keboola/brand-registry';\n\nimport { cn } from '../../utils';\nimport { type ResolvedColorScheme, useTheme } from '../ThemeProvider';\n\ntype Props = {\n  /** `wordmark` (default, full logo) or `mark` (square icon); each falls back to the other. */\n  variant?: 'mark' | 'wordmark';\n  /** Sets the logo height; aspect ratio is preserved (e.g. `tw:h-7`). */\n  className?: string;\n  /**\n   * Accessible name; defaults to the brand's picker `name`, suffixes included (`Keboola (V2)`).\n   * Pass the product name where the logo names something, e.g. a link.\n   */\n  label?: string;\n};\n\nconst isInlineSvg = (source: string) => source.trimStart().startsWith('<');\n\n// Resolved mode wins, then the other mode, then the other variant.\nconst resolveLogoSource = (\n  logo: Brand['logo'],\n  variant: 'mark' | 'wordmark',\n  mode: ResolvedColorScheme,\n): string | undefined => {\n  if (!logo) return undefined;\n  const forMode = (light?: string, dark?: string) =>\n    mode === 'dark' ? (dark ?? light) : (light ?? dark);\n  const mark = forMode(logo.mark, logo.markDark);\n  const wordmark = forMode(logo.wordmark, logo.wordmarkDark);\n  return variant === 'mark' ? (mark ?? wordmark) : (wordmark ?? mark);\n};\n\n// Reference SVGs omit width/height; without a default height they render ~150px tall.\nconst wrapperClass = 'tw:inline-flex tw:h-6 tw:items-center tw:[&>svg]:h-full tw:[&>svg]:w-auto';\n\n/**\n * The active brand's logo from the nearest `<ThemeProvider>`, or `null` if it ships none.\n * Inline SVG inherits `currentColor`; URLs use `<img>`.\n */\nexport const BrandLogo = ({ variant = 'wordmark', className, label }: Props) => {\n  const { currentTheme, resolvedScheme } = useTheme();\n  const source = resolveLogoSource(currentTheme.logo, variant, resolvedScheme);\n\n  // Brands can come from customer config or a paste field, so the SVG is untrusted.\n  const safeSvg = useMemo(\n    () =>\n      source && isInlineSvg(source)\n        ? DOMPurify.sanitize(source, { USE_PROFILES: { svg: true, svgFilters: true } })\n        : null,\n    [source],\n  );\n\n  if (!source) return null;\n\n  if (safeSvg !== null) {\n    return (\n      <span\n        role=\"img\"\n        aria-label={label ?? currentTheme.name}\n        className={cn(wrapperClass, className)}\n        dangerouslySetInnerHTML={{ __html: safeSvg }}\n      />\n    );\n  }\n\n  return (\n    <span className={cn(wrapperClass, className)}>\n      <img src={source} alt={label ?? currentTheme.name} className=\"tw:h-full tw:w-auto\" />\n    </span>\n  );\n};\n"],"mappings":";;;;;;AAoBA,MAAM,eAAe,WAAmB,OAAO,UAAU,CAAC,CAAC,WAAW,GAAG;AAGzE,MAAM,qBACJ,MACA,SACA,SACuB;CACvB,IAAI,CAAC,MAAM,OAAO,KAAA;CAClB,MAAM,WAAW,OAAgB,SAC/B,SAAS,SAAU,QAAQ,QAAU,SAAS;CAChD,MAAM,OAAO,QAAQ,KAAK,MAAM,KAAK,QAAQ;CAC7C,MAAM,WAAW,QAAQ,KAAK,UAAU,KAAK,YAAY;CACzD,OAAO,YAAY,SAAU,QAAQ,WAAa,YAAY;AAChE;AAGA,MAAM,eAAe;;;;;AAMrB,MAAa,aAAa,EAAE,UAAU,YAAY,WAAW,YAAmB;CAC9E,MAAM,EAAE,cAAc,mBAAmB,SAAS;CAClD,MAAM,SAAS,kBAAkB,aAAa,MAAM,SAAS,cAAc;CAG3E,MAAM,UAAU,cAEZ,UAAU,YAAY,MAAM,IACxB,UAAU,SAAS,QAAQ,EAAE,cAAc;EAAE,KAAK;EAAM,YAAY;CAAK,EAAE,CAAC,IAC5E,MACN,CAAC,MAAM,CACT;CAEA,IAAI,CAAC,QAAQ,OAAO;CAEpB,IAAI,YAAY,MACd,OACE,oBAAC,QAAD;EACE,MAAK;EACL,cAAY,SAAS,aAAa;EAClC,WAAW,GAAG,cAAc,SAAS;EACrC,yBAAyB,EAAE,QAAQ,QAAQ;CAC5C,CAAA;CAIL,OACE,oBAAC,QAAD;EAAM,WAAW,GAAG,cAAc,SAAS;EACzC,UAAA,oBAAC,OAAD;GAAK,KAAK;GAAQ,KAAK,SAAS,aAAa;GAAM,WAAU;EAAuB,CAAA;CAChF,CAAA;AAEV"}

package/dist/{Breadcrumb-BUoAZyhO.js → Breadcrumb-CUyYu5Bi.js}

@@ -1,9 +1,9 @@
-import { cn } from "./classNames-BzrkDnOD.js";
-import { ChevronDown, ChevronRight, Ellipsis } from "./icons-wcA70iQx.js";
-import { Popover } from "./Popover-CEk915I1.js";
-import { SearchInput } from "./SearchInput-D3qMkHaW.js";
-import { Slot } from "@radix-ui/react-slot";
+import { cn } from "./classNames-DcGnTh2N.js";
+import { ChevronDown, ChevronRight, Ellipsis } from "./icons-ZIeZXXS7.js";
+import { Popover } from "./Popover-BU7nGOv-.js";
+import { SearchInput } from "./SearchInput-BnU6YHgT.js";
 import { Children, createContext, isValidElement, use, useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
+import { Slot } from "@radix-ui/react-slot";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Breadcrumb/BreadcrumbDropdownContext.ts
 const BreadcrumbDropdownContext = createContext(null);
@@ -40,7 +40,7 @@ const useMatchRegistry = () => {
 //#endregion
 //#region src/components/Breadcrumb/BreadcrumbDropdownGroup.tsx
 const headerClass = cn("tw:flex", "tw:w-full", "tw:items-center", "tw:gap-2", "tw:box-border", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:px-2", "tw:py-1.5", "tw:text-left", "tw:text-sm", "tw:font-medium", "tw:text-foreground", "tw:min-w-0", "tw:overflow-hidden", "tw:[&_svg:not([class*='tw:size-'])]:size-4", "tw:[&_svg]:shrink-0");
-const collapsibleHeaderClass = cn("tw:cursor-pointer", "tw:hover:bg-accent", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50");
+const collapsibleHeaderClass = cn("tw:cursor-pointer", "tw:hover:bg-hover", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50");
 /**
 * A labelled group of `Breadcrumb.Dropdown.Item`s (e.g. one bucket with its tables). The group
 * hides itself when neither its label nor any child matches the filter query; an active query
@@ -115,7 +115,7 @@ const BreadcrumbDropdownGroup = ({ label, textValue, collapsible = false, defaul
 };
 //#endregion
 //#region src/components/Breadcrumb/BreadcrumbDropdownItem.tsx
-const itemClass = cn("tw:flex", "tw:w-full", "tw:items-center", "tw:gap-2", "tw:box-border", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:px-2", "tw:py-1.5", "tw:cursor-pointer", "tw:text-left", "tw:text-sm", "tw:font-normal", "tw:text-foreground", "tw:no-underline", "tw:min-w-0", "tw:overflow-hidden", "tw:hover:bg-accent", "tw:data-[active]:bg-accent", "tw:data-[active]:font-medium", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50", "tw:[&_svg:not([class*='tw:size-'])]:size-4", "tw:[&_svg]:shrink-0");
+const itemClass = cn("tw:flex", "tw:w-full", "tw:items-center", "tw:gap-2", "tw:box-border", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:px-2", "tw:py-1.5", "tw:cursor-pointer", "tw:text-left", "tw:text-sm", "tw:font-normal", "tw:text-foreground", "tw:no-underline", "tw:min-w-0", "tw:overflow-hidden", "tw:hover:bg-hover", "tw:data-[active]:bg-selected", "tw:data-[active]:font-medium", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50", "tw:[&_svg:not([class*='tw:size-'])]:size-4", "tw:[&_svg]:shrink-0");
 /**
 * One selectable entity row inside `Breadcrumb.Dropdown`. Self-hides when it doesn't match the
 * panel's filter query and closes the panel on select. Use `asChild` to render a router link.
@@ -157,7 +157,7 @@ const BreadcrumbLink = ({ ref, asChild = false, className, ...props }) => {
 };
 //#endregion
 //#region src/components/Breadcrumb/BreadcrumbDropdown.tsx
-const chevronButtonClass = cn("tw:flex", "tw:items-center", "tw:justify-center", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:cursor-pointer", "tw:size-5", "tw:text-muted-foreground", "tw:transition-colors", "tw:hover:bg-accent", "tw:hover:text-foreground", "tw:data-[state=open]:bg-accent", "tw:data-[state=open]:text-foreground", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50", "tw:[&_svg]:transition-transform", "tw:[&[data-state=open]_svg]:rotate-180");
+const chevronButtonClass = cn("tw:flex", "tw:items-center", "tw:justify-center", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:cursor-pointer", "tw:size-5", "tw:text-muted-foreground", "tw:transition-colors", "tw:hover:bg-hover", "tw:hover:text-foreground", "tw:data-[state=open]:bg-hover", "tw:data-[state=open]:text-foreground", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50", "tw:[&_svg]:transition-transform", "tw:[&[data-state=open]_svg]:rotate-180");
 const plainLabelClass = cn("tw:flex", "tw:items-center", "tw:gap-1.5", "tw:text-muted-foreground", "tw:font-normal", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-3.5");
 const PANEL_BASE = "tw:max-h-[min(640px,var(--radix-popover-content-available-height))]";
 const PANEL_WIDTH = {
@@ -263,7 +263,7 @@ BreadcrumbDropdown.Group = BreadcrumbDropdownGroup;
 const BreadcrumbEllipsis = ({ ref, className, ...props }) => /* @__PURE__ */ jsxs("button", {
 	ref,
 	type: "button",
-	className: cn("tw:flex", "tw:items-center", "tw:justify-center", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:cursor-pointer", "tw:text-muted-foreground", "tw:transition-colors", "tw:hover:bg-accent", "tw:hover:text-foreground", "tw:data-[state=open]:bg-accent", "tw:data-[state=open]:text-foreground", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50", "tw:p-1", className),
+	className: cn("tw:flex", "tw:items-center", "tw:justify-center", "tw:rounded-md", "tw:border-none", "tw:bg-transparent", "tw:cursor-pointer", "tw:text-muted-foreground", "tw:transition-colors", "tw:hover:bg-hover", "tw:hover:text-foreground", "tw:data-[state=open]:bg-hover", "tw:data-[state=open]:text-foreground", "tw:focus-visible:outline-hidden", "tw:focus-visible:ring-2", "tw:focus-visible:ring-ring/50", "tw:p-1", className),
 	...props,
 	children: [/* @__PURE__ */ jsx(Ellipsis, { className: "tw:size-4" }), /* @__PURE__ */ jsx("span", {
 		className: "tw:sr-only",
@@ -321,4 +321,4 @@ Breadcrumb.Dropdown = BreadcrumbDropdown;
 //#endregion
 export { Breadcrumb };
 
-//# sourceMappingURL=Breadcrumb-BUoAZyhO.js.map
+//# sourceMappingURL=Breadcrumb-CUyYu5Bi.js.map

package/dist/Breadcrumb-CUyYu5Bi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb-CUyYu5Bi.js","names":[],"sources":["../src/components/Breadcrumb/BreadcrumbDropdownContext.ts","../src/components/Breadcrumb/BreadcrumbDropdownGroup.tsx","../src/components/Breadcrumb/BreadcrumbDropdownItem.tsx","../src/components/Breadcrumb/BreadcrumbLink.tsx","../src/components/Breadcrumb/BreadcrumbDropdown.tsx","../src/components/Breadcrumb/BreadcrumbEllipsis.tsx","../src/components/Breadcrumb/BreadcrumbItem.tsx","../src/components/Breadcrumb/BreadcrumbList.tsx","../src/components/Breadcrumb/BreadcrumbPage.tsx","../src/components/Breadcrumb/BreadcrumbSeparator.tsx","../src/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import { createContext, isValidElement, useCallback, useMemo, useState } from 'react';\nimport type { ReactNode } from 'react';\n\nexport type BreadcrumbDropdownContextValue = {\n  /** Current (trimmed, lowercased) filter query. Empty string = no filtering. */\n  query: string;\n  /** An ancestor group's label matched the query — descendants render regardless of their own match. */\n  forceVisible: boolean;\n  /** Filtering is off (`filter={false}` or `shouldFilter={false}`) — items never self-hide. */\n  filterDisabled: boolean;\n  /** Report this node's visibility to the parent scope. Returns the unregister cleanup. */\n  register: (id: string, visible: boolean) => () => void;\n  /** Close the panel (fired by items on select). */\n  close: () => void;\n};\n\nexport const BreadcrumbDropdownContext = createContext<BreadcrumbDropdownContextValue | null>(null);\n\nexport const matchesQuery = (text: string, query: string) => text.toLowerCase().includes(query);\n\n/** Text content of a React tree — the default filter text when no `textValue` is given. */\nexport const getNodeText = (node: ReactNode): string => {\n  if (typeof node === 'string' || typeof node === 'number') return String(node);\n  if (Array.isArray(node)) return node.map(getNodeText).join('');\n  if (isValidElement<{ children?: ReactNode }>(node)) return getNodeText(node.props.children);\n  return '';\n};\n\nexport const normalizeQuery = (query: string) => query.trim().toLowerCase();\n\n/**\n * Visibility registry for one filtering scope (the panel root, or one group). Items and groups\n * report their visibility here; `anyVisible` drives the group header / empty-state rendering.\n */\nexport const useMatchRegistry = () => {\n  const [matches, setMatches] = useState<ReadonlyMap<string, boolean>>(new Map());\n\n  const register = useCallback((id: string, visible: boolean) => {\n    setMatches((prev) => (prev.get(id) === visible ? prev : new Map(prev).set(id, visible)));\n    return () => {\n      setMatches((prev) => {\n        if (!prev.has(id)) return prev;\n        const next = new Map(prev);\n        next.delete(id);\n        return next;\n      });\n    };\n  }, []);\n\n  const anyVisible = useMemo(() => [...matches.values()].some(Boolean), [matches]);\n\n  return { register, anyVisible };\n};\n","import { Children, use, useEffect, useId, useMemo, useState } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { ChevronDown, ChevronRight } from '../../icons';\nimport { cn } from '../../utils';\n\nimport {\n  BreadcrumbDropdownContext,\n  getNodeText,\n  matchesQuery,\n  useMatchRegistry,\n} from './BreadcrumbDropdownContext';\n\nconst headerClass = cn(\n  // layout\n  'tw:flex',\n  'tw:w-full',\n  'tw:items-center',\n  'tw:gap-2',\n  'tw:box-border',\n\n  'tw:rounded-md',\n  'tw:border-none',\n  'tw:bg-transparent',\n  'tw:px-2',\n  'tw:py-1.5',\n  'tw:text-left',\n\n  // font — single line; wrap the label in `Truncated` (design system) for ellipsis + tooltip\n  'tw:text-sm',\n  'tw:font-medium',\n  'tw:text-foreground',\n  'tw:min-w-0',\n  'tw:overflow-hidden',\n\n  // icons\n  \"tw:[&_svg:not([class*='tw:size-'])]:size-4\",\n  'tw:[&_svg]:shrink-0',\n);\n\nconst collapsibleHeaderClass = cn(\n  'tw:cursor-pointer',\n  'tw:hover:bg-hover',\n  'tw:focus-visible:outline-hidden',\n  'tw:focus-visible:ring-2',\n  'tw:focus-visible:ring-ring/50',\n);\n\ntype BreadcrumbDropdownGroupProps = {\n  /** Group header (e.g. bucket name + stage badge). */\n  label: ReactNode;\n  /**\n   * Text the built-in filter matches against. When the group label matches, all its items stay\n   * visible. Defaults to the label's rendered text content.\n   */\n  textValue?: string;\n  /** Render the header as a toggle that expands / collapses the group's items. Default `false`. */\n  collapsible?: boolean;\n  /** Initial expanded state for `collapsible` groups. Default `true`. */\n  defaultExpanded?: boolean;\n  className?: string;\n  children: ReactNode;\n};\n\n/**\n * A labelled group of `Breadcrumb.Dropdown.Item`s (e.g. one bucket with its tables). The group\n * hides itself when neither its label nor any child matches the filter query; an active query\n * force-expands collapsible groups. Non-empty `collapsible` groups toggle their items behind the\n * header with an animated expand / collapse; a `collapsible` group with no items renders a\n * non-interactive, greyed header that can't toggle.\n */\nexport const BreadcrumbDropdownGroup = ({\n  label,\n  textValue,\n  collapsible = false,\n  defaultExpanded = true,\n  className,\n  children,\n}: BreadcrumbDropdownGroupProps) => {\n  const parent = use(BreadcrumbDropdownContext);\n  if (!parent) {\n    throw new Error('Breadcrumb.Dropdown.Group must be rendered inside Breadcrumb.Dropdown');\n  }\n  const id = useId();\n  const { register: registerChild, anyVisible } = useMatchRegistry();\n  const [expanded, setExpanded] = useState(defaultExpanded);\n\n  const text = textValue ?? getNodeText(label);\n  const filtering = !parent.filterDisabled && !!parent.query;\n  const labelMatched = filtering && matchesQuery(text, parent.query);\n  const visible = !filtering || parent.forceVisible || labelMatched || anyVisible;\n\n  useEffect(() => parent.register(id, visible), [parent, id, visible]);\n\n  const childContext = useMemo(\n    () => ({\n      query: parent.query,\n      forceVisible: parent.forceVisible || labelMatched,\n      filterDisabled: parent.filterDisabled,\n      register: registerChild,\n      close: parent.close,\n    }),\n    [parent, labelMatched, registerChild],\n  );\n\n  // An active query force-expands the group so matches are never hidden behind a collapsed header.\n  const isExpanded = !collapsible || expanded || filtering;\n  // A collapsible group with no items has nothing to toggle — render a non-interactive header.\n  // oxlint-disable-next-line react-x/no-children-count -- emptiness check, no child transformation\n  const isEmpty = Children.count(children) === 0;\n\n  return (\n    <div\n      className={cn('tw:flex tw:flex-col', className)}\n      style={visible ? undefined : { display: 'none' }}\n    >\n      {collapsible && isEmpty ? (\n        <span\n          aria-disabled\n          className={cn(\n            headerClass,\n            'tw:text-muted-foreground',\n            // Fade just the leading chevron lighter than the label text.\n            'tw:[&>svg:first-child]:opacity-50',\n          )}\n        >\n          <ChevronRight />\n          {label}\n        </span>\n      ) : collapsible && !isEmpty ? (\n        <button\n          type=\"button\"\n          aria-expanded={isExpanded}\n          className={cn(headerClass, collapsibleHeaderClass)}\n          onClick={() => setExpanded((prev) => !prev)}\n        >\n          {isExpanded ? <ChevronDown /> : <ChevronRight />}\n          {label}\n        </button>\n      ) : (\n        <span className={headerClass}>{label}</span>\n      )}\n      <BreadcrumbDropdownContext value={childContext}>\n        {collapsible && !isEmpty ? (\n          // Animated expand / collapse via a CSS grid-rows transition (0fr ↔ 1fr). The children stay\n          // mounted while collapsed so the filter registry keeps receiving their visibility; `inert`\n          // + `aria-hidden` take the collapsed content out of the a11y tree and tab order. An active\n          // filter query force-expands (`isExpanded` includes `filtering`).\n          <div\n            className={cn(\n              'tw:grid tw:transition-[grid-template-rows] tw:duration-200 tw:ease-out',\n              'tw:motion-reduce:transition-none',\n              isExpanded ? 'tw:grid-rows-[1fr]' : 'tw:grid-rows-[0fr]',\n            )}\n          >\n            <div\n              className=\"tw:overflow-hidden\"\n              inert={!isExpanded}\n              aria-hidden={isExpanded ? undefined : true}\n            >\n              <div className=\"tw:flex tw:flex-col tw:pl-6\">{children}</div>\n            </div>\n          </div>\n        ) : (\n          <div\n            className=\"tw:flex tw:flex-col tw:pl-6\"\n            style={isExpanded ? undefined : { display: 'none' }}\n          >\n            {children}\n          </div>\n        )}\n      </BreadcrumbDropdownContext>\n    </div>\n  );\n};\n","import { use, useEffect, useId } from 'react';\nimport type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\n\nimport { BreadcrumbDropdownContext, getNodeText, matchesQuery } from './BreadcrumbDropdownContext';\n\nconst itemClass = cn(\n  // layout\n  'tw:flex',\n  'tw:w-full',\n  'tw:items-center',\n  'tw:gap-2',\n  'tw:box-border',\n\n  'tw:rounded-md',\n  'tw:border-none',\n  'tw:bg-transparent',\n  'tw:px-2',\n  'tw:py-1.5',\n  'tw:cursor-pointer',\n  'tw:text-left',\n\n  // font — single line; wrap the label in `Truncated` (design system) for ellipsis + tooltip\n  'tw:text-sm',\n  'tw:font-normal',\n  'tw:text-foreground',\n  'tw:no-underline',\n  'tw:min-w-0',\n  'tw:overflow-hidden',\n\n  // hover / active entity\n  'tw:hover:bg-hover',\n  'tw:data-[active]:bg-selected',\n  'tw:data-[active]:font-medium',\n\n  // focus\n  'tw:focus-visible:outline-hidden',\n  'tw:focus-visible:ring-2',\n  'tw:focus-visible:ring-ring/50',\n\n  // icons\n  \"tw:[&_svg:not([class*='tw:size-'])]:size-4\",\n  'tw:[&_svg]:shrink-0',\n);\n\ntype BreadcrumbDropdownItemProps = ComponentProps<'button'> & {\n  /** Render the consumer's element (typically a router link) instead of a `button`. */\n  asChild?: boolean;\n  /**\n   * Text the built-in filter matches against. Defaults to the item's rendered text content\n   * (extracted recursively, so `asChild` links with icons work out of the box).\n   */\n  textValue?: string;\n  /** Marks the currently open entity (highlight + `aria-current`). */\n  active?: boolean;\n  /** Close the panel when the item is selected. Default `true`. */\n  closeOnSelect?: boolean;\n};\n\n/**\n * One selectable entity row inside `Breadcrumb.Dropdown`. Self-hides when it doesn't match the\n * panel's filter query and closes the panel on select. Use `asChild` to render a router link.\n */\nexport const BreadcrumbDropdownItem = ({\n  ref,\n  asChild = false,\n  textValue,\n  active = false,\n  closeOnSelect = true,\n  className,\n  children,\n  onClick,\n  ...props\n}: BreadcrumbDropdownItemProps) => {\n  const context = use(BreadcrumbDropdownContext);\n  if (!context) {\n    throw new Error('Breadcrumb.Dropdown.Item must be rendered inside Breadcrumb.Dropdown');\n  }\n  const id = useId();\n\n  const text = textValue ?? getNodeText(children);\n  const visible =\n    context.filterDisabled ||\n    !context.query ||\n    context.forceVisible ||\n    matchesQuery(text, context.query);\n\n  useEffect(() => context.register(id, visible), [context, id, visible]);\n\n  if (!visible) return null;\n\n  const Comp = asChild ? Slot : 'button';\n  return (\n    <Comp\n      ref={ref}\n      {...(asChild ? {} : { type: 'button' as const })}\n      data-active={active || undefined}\n      aria-current={active || undefined}\n      className={cn(itemClass, className)}\n      onClick={(event) => {\n        onClick?.(event);\n        if (closeOnSelect && !event.defaultPrevented) {\n          context.close();\n        }\n      }}\n      {...props}\n    >\n      {children}\n    </Comp>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'a'> & {\n  asChild?: boolean;\n};\n\nexport const BreadcrumbLink = ({ ref, asChild = false, className, ...props }: Props) => {\n  const Comp = asChild ? Slot : 'a';\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        'tw:flex',\n        'tw:items-center',\n        'tw:gap-1.5',\n        // font\n        'tw:text-muted-foreground',\n        'tw:font-normal',\n        'tw:no-underline',\n\n        // hover\n        'tw:hover:text-foreground',\n\n        // focus\n        'tw:focus-visible:outline-hidden',\n        'tw:focus-visible:ring-2',\n        'tw:focus-visible:ring-ring/50',\n        'tw:focus-visible:rounded-sm',\n\n        // Icon\n        'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3.5',\n\n        // transition\n        'tw:transition-colors',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n","import { useCallback, useMemo, useRef, useState } from 'react';\nimport type { ComponentRef, ReactNode } from 'react';\n\nimport { SearchInput } from '../../blocks/SearchInput';\nimport { ChevronDown } from '../../icons';\nimport { cn } from '../../utils';\nimport { Popover } from '../Popover';\n\nimport {\n  BreadcrumbDropdownContext,\n  normalizeQuery,\n  useMatchRegistry,\n} from './BreadcrumbDropdownContext';\nimport { BreadcrumbDropdownGroup } from './BreadcrumbDropdownGroup';\nimport { BreadcrumbDropdownItem } from './BreadcrumbDropdownItem';\nimport { BreadcrumbLink } from './BreadcrumbLink';\n\n// Chevron trigger, the only button in the crumb; no outline, only a hover / open background.\nconst chevronButtonClass = cn(\n  'tw:flex',\n  'tw:items-center',\n  'tw:justify-center',\n\n  'tw:rounded-md',\n  'tw:border-none',\n  'tw:bg-transparent',\n  'tw:cursor-pointer',\n  'tw:size-5',\n  'tw:text-muted-foreground',\n  'tw:transition-colors',\n  'tw:hover:bg-hover',\n  'tw:hover:text-foreground',\n  'tw:data-[state=open]:bg-hover',\n  'tw:data-[state=open]:text-foreground',\n\n  'tw:focus-visible:outline-hidden',\n  'tw:focus-visible:ring-2',\n  'tw:focus-visible:ring-ring/50',\n\n  'tw:[&_svg]:transition-transform',\n  'tw:[&[data-state=open]_svg]:rotate-180',\n);\n\n// Plain label: `BreadcrumbLink` typography without hover / focus, as it isn't interactive.\nconst plainLabelClass = cn(\n  'tw:flex',\n  'tw:items-center',\n  'tw:gap-1.5',\n  'tw:text-muted-foreground',\n  'tw:font-normal',\n  'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3.5',\n);\n\n// Fixed width per `size`, clamped to the viewport; long names truncate instead of widening it.\nconst PANEL_BASE = 'tw:max-h-[min(640px,var(--radix-popover-content-available-height))]';\n\nconst PANEL_WIDTH = {\n  small: 'tw:w-[min(360px,var(--radix-popover-content-available-width))]',\n  medium: 'tw:w-[min(440px,var(--radix-popover-content-available-width))]',\n  large: 'tw:w-[min(560px,var(--radix-popover-content-available-width))]',\n} as const;\n\ntype PanelSize = keyof typeof PANEL_WIDTH;\n\ntype BreadcrumbDropdownProps = {\n  /** Never the trigger. With `splitTrigger`, pass an anchor-like element so it navigates. */\n  label: ReactNode;\n  /** Renders `label` through `Breadcrumb.Link asChild`; default `false` (plain text). */\n  splitTrigger?: boolean;\n  /** Chevron's accessible name; defaults to `\"${label} menu\"`, or `\"Open menu\"` for a node label. */\n  triggerLabel?: string;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  /** Panel width: `small` 360px, `medium` 440px (default), `large` 560px. */\n  size?: PanelSize;\n  /**\n   * Pinned filter input, focused on open; default on. Non-matching items / groups hide\n   * (by `textValue` / string content).\n   */\n  filter?: boolean;\n  /** `false` keeps the input but disables built-in matching; the consumer filters. */\n  shouldFilter?: boolean;\n  /** Controlled filter value. */\n  searchValue?: string;\n  onSearchChange?: (value: string) => void;\n  searchPlaceholder?: string;\n  /** Rendered when the built-in filter hides everything. Default `\"No results.\"`. */\n  emptyMessage?: ReactNode;\n  /** `Breadcrumb.Dropdown.Group` / `Breadcrumb.Dropdown.Item` elements. */\n  children: ReactNode;\n};\n\n/**\n * Breadcrumb segment opening a filterable switcher of sibling entities.\n *\n * - Use on the leftmost segment with siblings worth switching between; at most one per breadcrumb.\n * - Not for row actions (`PageHeader.Detail` `overflowActions`) or a collapsed middle (`Ellipsis`).\n * - Render inside `Breadcrumb.Item` in place of `Breadcrumb.Link`.\n */\nexport const BreadcrumbDropdown = ({\n  label,\n  splitTrigger = false,\n  triggerLabel,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  size = 'medium',\n  filter = true,\n  shouldFilter = true,\n  searchValue,\n  onSearchChange,\n  searchPlaceholder = 'Search…',\n  emptyMessage = 'No results.',\n  children,\n}: BreadcrumbDropdownProps) => {\n  const searchRef = useRef<ComponentRef<'input'>>(null);\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const [internalQuery, setInternalQuery] = useState('');\n  const { register, anyVisible } = useMatchRegistry();\n\n  const isOpen = open ?? internalOpen;\n  const handleOpenChange = useCallback(\n    (nextOpen: boolean) => {\n      setInternalOpen(nextOpen);\n      if (!nextOpen) setInternalQuery('');\n      onOpenChange?.(nextOpen);\n    },\n    [onOpenChange],\n  );\n  const close = useCallback(() => handleOpenChange(false), [handleOpenChange]);\n\n  const effectiveTriggerLabel =\n    triggerLabel ?? (typeof label === 'string' ? `${label} menu` : 'Open menu');\n\n  const rawQuery = searchValue ?? internalQuery;\n  const filterDisabled = !filter || !shouldFilter;\n  const query = filterDisabled ? '' : normalizeQuery(rawQuery);\n\n  const contextValue = useMemo(\n    () => ({ query, forceVisible: false, filterDisabled, register, close }),\n    [query, filterDisabled, register, close],\n  );\n\n  return (\n    <Popover open={isOpen} onOpenChange={handleOpenChange}>\n      <span className=\"tw:flex tw:items-center tw:gap-0.5\">\n        {splitTrigger ? (\n          <BreadcrumbLink asChild>{label}</BreadcrumbLink>\n        ) : (\n          <span className={plainLabelClass}>{label}</span>\n        )}\n        <Popover.Trigger asChild>\n          <button type=\"button\" aria-label={effectiveTriggerLabel} className={chevronButtonClass}>\n            <ChevronDown className=\"tw:size-3.5\" />\n          </button>\n        </Popover.Trigger>\n      </span>\n      <Popover.Content\n        align=\"start\"\n        sideOffset={8}\n        collisionPadding={16}\n        data-size={size}\n        className={cn('tw:overflow-hidden tw:p-0', PANEL_BASE, PANEL_WIDTH[size])}\n        onOpenAutoFocus={\n          filter\n            ? (event) => {\n                event.preventDefault();\n                searchRef.current?.focus();\n              }\n            : undefined\n        }\n      >\n        {filter && (\n          <div className=\"tw:shrink-0 tw:border-0 tw:border-b tw:border-solid tw:border-border tw:p-2\">\n            <SearchInput\n              ref={searchRef}\n              value={rawQuery}\n              onValueChange={(value) => {\n                setInternalQuery(value);\n                onSearchChange?.(value);\n              }}\n              placeholder={searchPlaceholder}\n              allowClear\n              // Debounce only when the consumer filters itself (e.g. server-side).\n              disableDebounce={shouldFilter}\n            />\n          </div>\n        )}\n        <div className=\"tw:flex tw:flex-1 tw:flex-col tw:overflow-y-auto tw:p-2\">\n          <BreadcrumbDropdownContext value={contextValue}>{children}</BreadcrumbDropdownContext>\n          {!filterDisabled && !!query && !anyVisible && (\n            <span className=\"tw:px-2 tw:py-1.5 tw:text-sm tw:text-muted-foreground\">\n              {emptyMessage}\n            </span>\n          )}\n        </div>\n      </Popover.Content>\n    </Popover>\n  );\n};\n\nBreadcrumbDropdown.Item = BreadcrumbDropdownItem;\nBreadcrumbDropdown.Group = BreadcrumbDropdownGroup;\n","import type { ComponentProps } from 'react';\n\nimport { Ellipsis } from '../../icons';\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'>;\n\nexport const BreadcrumbEllipsis = ({ ref, className, ...props }: Props) => (\n  <button\n    ref={ref}\n    type=\"button\"\n    className={cn(\n      // layout\n      'tw:flex',\n      'tw:items-center',\n      'tw:justify-center',\n\n      'tw:rounded-md',\n      'tw:border-none',\n      'tw:bg-transparent',\n      'tw:cursor-pointer',\n      'tw:text-muted-foreground',\n      'tw:transition-colors',\n      // Match the Breadcrumb.Dropdown chevron trigger: background + colour lift on hover / while the\n      // menu is open, so the two interactive breadcrumb affordances read consistently.\n      'tw:hover:bg-hover',\n      'tw:hover:text-foreground',\n      'tw:data-[state=open]:bg-hover',\n      'tw:data-[state=open]:text-foreground',\n\n      // focus\n      'tw:focus-visible:outline-hidden',\n      'tw:focus-visible:ring-2',\n      'tw:focus-visible:ring-ring/50',\n\n      'tw:p-1',\n      className,\n    )}\n    {...props}\n  >\n    <Ellipsis className=\"tw:size-4\" />\n    <span className=\"tw:sr-only\">More</span>\n  </button>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'li'>;\n\nexport const BreadcrumbItem = ({ className, ...props }: Props) => (\n  <li className={cn('tw:inline-flex', 'tw:items-center', className)} {...props} />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'ol'>;\n\nexport const BreadcrumbList = ({ className, ...props }: Props) => (\n  <ol\n    className={cn(\n      // layout\n      'tw:flex',\n      'tw:flex-wrap',\n      'tw:items-center',\n      'tw:gap-2',\n      'tw:m-0',\n      'tw:p-0',\n\n      // font\n      'tw:break-words',\n      'tw:text-sm',\n      'tw:text-muted-foreground',\n      className,\n    )}\n    {...props}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'>;\n\nexport const BreadcrumbPage = ({ ref, className, ...props }: Props) => (\n  <span\n    ref={ref}\n    // Do not use the anchor, as this item is not clickable\n    // oxlint-disable-next-line jsx_a11y/prefer-tag-over-role\n    role=\"link\"\n    aria-disabled=\"true\"\n    aria-current=\"page\"\n    className={cn('tw:font-medium', 'tw:text-foreground', className)}\n    {...props}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'li'>;\n\nexport const BreadcrumbSeparator = ({ children, className, ...props }: Props) => (\n  <li\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn(\n      // layout\n      'tw:flex',\n      'tw:items-center',\n      'tw:justify-center',\n\n      'tw:aspect-square',\n      'tw:size-[15px]',\n      'tw:[&_svg:not([class*=\"tw:size-\"])]:size-2.5',\n      'tw:text-muted-foreground',\n      className,\n    )}\n    {...props}\n  >\n    {children ?? <span className=\"tw:select-none tw:text-sm tw:text-muted-foreground/50\">/</span>}\n  </li>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { BreadcrumbDropdown } from './BreadcrumbDropdown';\nimport { BreadcrumbEllipsis } from './BreadcrumbEllipsis';\nimport { BreadcrumbItem } from './BreadcrumbItem';\nimport { BreadcrumbLink } from './BreadcrumbLink';\nimport { BreadcrumbList } from './BreadcrumbList';\nimport { BreadcrumbPage } from './BreadcrumbPage';\nimport { BreadcrumbSeparator } from './BreadcrumbSeparator';\n\ntype Props = ComponentProps<'nav'>;\n\nexport const Breadcrumb = ({ className, ...props }: Props) => (\n  <nav aria-label=\"breadcrumb\" className={cn('tailwindcss-preflight', className)} {...props} />\n);\n\nBreadcrumb.List = BreadcrumbList;\nBreadcrumb.Item = BreadcrumbItem;\nBreadcrumb.Link = BreadcrumbLink;\nBreadcrumb.Page = BreadcrumbPage;\nBreadcrumb.Separator = BreadcrumbSeparator;\nBreadcrumb.Ellipsis = BreadcrumbEllipsis;\nBreadcrumb.Dropdown = BreadcrumbDropdown;\n"],"mappings":"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"}