@keboola/design 11.4.0 → 11.6.0

package/dist/index.js

@@ -1,5 +1,5 @@
 import { cn } from "./classNames-BzrkDnOD.js";
-import { Tooltip, TooltipProvider, copyToClipboard, isMac } from "./utils-B5Z52hYs.js";
+import { Tooltip, TooltipProvider, copyToClipboard, isMac } from "./utils-DSvrhU8E.js";
 import { DEFAULT_BRAND_ID, DEFAULT_COLOR_SCHEME } from "./defaults-i_xG2F_1.js";
 import { ArgoDesignContext, useArgoDesign, useTheme } from "./context-D7X470dy.js";
 import { findLiteralMatches, hasLiteralMatch } from "./findLiteralMatches-BGBw8Vbl.js";
@@ -9,13 +9,13 @@ import { ButtonGroup } from "./internal/components/ButtonGroup.js";
 import { DropdownMenu } from "./DropdownMenu-CASr-jgl.js";
 import { ScrollArea, ScrollBar } from "./internal/components/ScrollArea.js";
 import { SplitButton } from "./internal/blocks/SplitButton.js";
-import { MultiActionButtonGroup } from "./MultiActionButtonGroup-CxWH7yWK.js";
+import { MultiActionButtonGroup } from "./MultiActionButtonGroup-DokHbPgM.js";
 import { Toggle } from "./internal/components/Toggle.js";
 import { ToggleGroup } from "./ToggleGroup-Cy_10Mvu.js";
-import { Clipboard } from "./Clipboard-ChPdiUy3.js";
-import { ClipboardButton, ClipboardInline } from "./ClipboardButton-D9pDjgkB.js";
+import { Clipboard } from "./Clipboard-BTW6C-b_.js";
+import { ClipboardButton, ClipboardInline } from "./ClipboardButton-CwZJdRaz.js";
 import { ExportMenu } from "./internal/blocks/ExportMenu.js";
-import { CopyField } from "./CopyField-BO_sh-HO.js";
+import { CopyField } from "./CopyField-DpT0Ngz1.js";
 import { Label } from "./internal/components/Label.js";
 import { MicrosoftButton } from "./internal/blocks/MicrosoftButton.js";
 import { GoogleButton } from "./internal/blocks/GoogleButton.js";
@@ -23,52 +23,53 @@ import { Link } from "./internal/components/Link.js";
 import { AlertModal } from "./AlertModal-BGJdaRRj.js";
 import { Modal } from "./Modal-Coj-H02o.js";
 import { Separator } from "./internal/components/Separator.js";
-import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "./FullScreenModal-BvPuYibe.js";
+import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "./FullScreenModal-CN9nAs72.js";
 import { Truncated } from "./internal/components/Truncated.js";
 import { Sheet } from "./Sheet-Chf0kX1E.js";
+import { useStableCallback } from "./internal/hooks/useStableCallback.js";
 import { Popover } from "./Popover-BEbQrC_P.js";
-import { Popconfirm } from "./Popconfirm-CILjmzKI.js";
+import { Popconfirm } from "./Popconfirm-5pBzT_HQ.js";
 import { HoverCard } from "./HoverCard-B9ZMJxjn.js";
-import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "./Command-B7ML9YMv.js";
-import { InputGroup } from "./InputGroup-BnLHY0eq.js";
-import { TextInput } from "./TextInput-DHM6dHmn.js";
+import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "./Command-Bfa1kpbt.js";
+import { InputGroup } from "./InputGroup-DcZRlVnN.js";
+import { TextInput } from "./TextInput-DH5SkbsE.js";
 import { SpotlightBackdrop, useTargetRect } from "./internal/components/SpotlightBackdrop.js";
 import { Calendar } from "./Calendar-cG5NIJ4O.js";
 import { DatePicker } from "./DatePicker-nA8YdE84.js";
 import { TimePicker } from "./TimePicker-BGeqc-Ed.js";
 import { DateRangePicker } from "./DateRangePicker-DjSUFjh4.js";
-import { Switch } from "./Switch-ChfPKcTE.js";
-import { RadioGroup } from "./RadioGroup-XFzFd1ti.js";
-import { Slider } from "./Slider-pPC_3gz9.js";
-import { Search, SearchForm } from "./Search-4Bxtt8hS.js";
-import { Select } from "./Select-DpcgKqKB.js";
-import { Checkbox } from "./Checkbox-fC0BuO2B.js";
-import { Badge } from "./Badge-Ch26CXoP.js";
-import { Combobox } from "./Combobox-Cs_1pj2q.js";
+import { Switch } from "./Switch-B0WdGSjz.js";
+import { RadioGroup } from "./RadioGroup-DXPbSj8P.js";
+import { Slider } from "./Slider-CRf-bB4y.js";
+import { Search, SearchForm } from "./Search-5uQAiNIP.js";
+import { Select } from "./Select-DV3Hak_l.js";
+import { Checkbox } from "./Checkbox-CUIn2jap.js";
+import { Combobox, filterByWords, matchByWords, namedLabel, withBlankValues } from "./Combobox-BfIfaVMA.js";
+import { Badge } from "./Badge-D0pXdekt.js";
 import { MultiCombobox } from "./internal/blocks/MultiCombobox.js";
-import { FormGroup } from "./FormGroup-DbcDtrgU.js";
-import { ColorInput } from "./ColorInput-Bxj-1eLT.js";
+import { FormGroup } from "./FormGroup-DHvTFdno.js";
+import { ColorInput } from "./ColorInput-BZV-u_94.js";
 import { HelpBlock } from "./internal/components/HelpBlock.js";
 import { NumberInput } from "./internal/blocks/NumberInput.js";
 import { Textarea } from "./internal/blocks/Textarea.js";
 import { MultiComboboxField } from "./internal/blocks/Form/connectors/MultiComboboxField.js";
 import { AutoSaveTextarea } from "./AutoSaveTextarea-BeuWuszr.js";
 import { ColorModeSwitch } from "./ColorModeSwitch-CsWLiTBX.js";
-import { DateInput } from "./DateInput-ZdaMQo5i.js";
+import { DateInput } from "./DateInput-DiEd5uCL.js";
 import { PasswordInput } from "./internal/blocks/PasswordInput.js";
 import { TimeInput } from "./internal/blocks/TimeInput.js";
-import { DateRangeInput } from "./DateRangeInput-DkvNh_sT.js";
+import { DateRangeInput } from "./DateRangeInput-DPfVYchl.js";
 import { OtpInput, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS } from "./OtpInput-CbbymqYs.js";
-import { SearchInput } from "./SearchInput-f_oY9T4Z.js";
+import { SearchInput } from "./SearchInput-D4UgAXJK.js";
 import { SearchInputWithNavigation } from "./internal/blocks/SearchInputWithNavigation.js";
 import { FileUpload, useFileDropTarget, useFileUploadRejections } from "./FileUpload-ABThVZyg.js";
-import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageStats, UsageStatsRing } from "./AIKit-DDg5DBCG.js";
+import { AnswerActions, AnswerSummary, CollapsibleStepHeader, DIAGRAM_LANGUAGES, InlineStepDetail, InlineStepLabel, Markdown, MarkdownTable, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageStats, UsageStatsRing, clampPercentage, formatPercentage } from "./AIKit-BExvt9pt.js";
 import { Table, tableAriaSort } from "./Table-CvYuTuNU.js";
 import { Skeleton } from "./internal/components/Skeleton/Skeleton.js";
 import { DiagramSkeleton } from "./internal/blocks/DiagramShared/DiagramSkeleton.js";
 import { Progress } from "./internal/components/Progress.js";
 import { Collapsible } from "./Collapsible-BQXWEOBC.js";
-import { Alert } from "./Alert-DHJFrWnS.js";
+import { Alert } from "./Alert-Ba5b2YPq.js";
 import { toast } from "./toast-DIC0iNRf.js";
 import { Toaster, useNotification } from "./Toast-Dr6Uw7ao.js";
 import { EmptySearchContent } from "./internal/components/EmptySearchContent.js";
@@ -80,25 +81,26 @@ import { SkeletonList } from "./internal/components/Skeleton/SkeletonList.js";
 import { DotsLoader } from "./internal/components/DotsLoader.js";
 import { CollapsiblePanel } from "./internal/components/CollapsiblePanel.js";
 import { PanelWithDetails } from "./internal/components/PanelWithDetails.js";
-import { ThemeProvider, ThemeScope, brandSchema, exampleCustomer, keboola, keboolaLegacySidebar, keboolaLegacyTopnav, useThemeScopeContainer } from "./ThemeProvider-DrQJtzpd.js";
+import { ThemeProvider, ThemeScope, brandSchema, exampleCustomer, keboola, keboolaLegacySidebar, keboolaLegacyTopnav, useThemeScopeContainer } from "./ThemeProvider-2RMdVGxO.js";
 import { AppShell, appShellSlotSelector } from "./AppShell-DRgJxpXW.js";
+import { BrandLogo } from "./BrandLogo-CoKBk4MI.js";
+import { AuthLayout } from "./internal/blocks/AuthLayout.js";
 import { PageLayout } from "./PageLayout-DSVM-ASz.js";
 import { PageHeader } from "./PageHeader-Q3IpCnQd.js";
-import { PageToolbar } from "./PageToolbar-DnbFt14Q.js";
-import { SectionNav } from "./SectionNav-BpJlisbT.js";
-import { BrandLogo } from "./BrandLogo-Dmi7jo21.js";
+import { PageToolbar } from "./PageToolbar-DExqEYGl.js";
+import { SectionNav } from "./SectionNav-OkKCjSA-.js";
 import { ResizableHandle, ResizablePanel, ResizablePanelGroup, useDefaultLayout } from "./Resizable-D3vYToZH.js";
-import { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar } from "./Sidebar-Cm6I4dE1.js";
+import { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar } from "./Sidebar-D3cY1kha.js";
 import { useScrollbarPosition } from "./internal/hooks/useScrollbarPosition.js";
-import { Navbar } from "./Navbar-B2UsolVU.js";
-import { DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Workbench, useWorkbench } from "./Workbench-BzE-Vvd9.js";
-import { Breadcrumb } from "./Breadcrumb-uEkM6adI.js";
+import { Navbar } from "./Navbar-Liy1TPI7.js";
+import { DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Workbench, useWorkbench } from "./Workbench-UR2FBC7I.js";
+import { Breadcrumb } from "./Breadcrumb-g_xn_-Nf.js";
 import { Tabs, TabsContent } from "./Tabs-eB974xJf.js";
 import { Stepper } from "./Stepper-C8sm9ZFM.js";
-import { Timeline } from "./Timeline-6btyJl4D.js";
+import { Timeline } from "./Timeline-BG5Xogxh.js";
 import { Avatar } from "./internal/components/Avatar.js";
 import { MarkedText } from "./MarkedText-DNGEUVWc.js";
-import { Kbd, kbdVariants, keys } from "./Kbd-CvSM3D3-.js";
+import { Kbd, kbdVariants, keys } from "./Kbd-Cvvt91Q8.js";
 import { Pagination } from "./Pagination-C_b7Xhey.js";
 import { DiffType, DiffView, computeDiffRows, computeLineInformation } from "./DiffView-ppTIzh2h.js";
 import { PaneHeader } from "./internal/components/MergeEditor/PaneHeader.js";
@@ -107,10 +109,9 @@ import { useMergeDiff } from "./useMergeDiff-CvowEXJ1.js";
 import { DashboardHero } from "./internal/blocks/DashboardHero.js";
 import { StatCard, StatCardGrid } from "./internal/blocks/StatCard.js";
 import { ChartPanel } from "./internal/blocks/ChartPanel.js";
-import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "./Form-k6PH-em3.js";
+import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "./Form-CsttTHn4.js";
 import { useAutosizeInput } from "./internal/hooks/useAutosizeInput.js";
-import { useStableCallback } from "./internal/hooks/useStableCallback.js";
-import { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "./ZoomableSvg-BWnDkR61.js";
-import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "./BrandEditor-Go7w8Zj2.js";
+import { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "./ZoomableSvg-pooPb1Cu.js";
+import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "./BrandEditor-CSANsxUz.js";
 import { Slot } from "@radix-ui/react-slot";
-export { Alert, AlertModal, AnswerSummary, AppShell, ArgoDesignContext, AutoSaveTextarea, Avatar, Badge, BrandEditor, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, Calendar, Card, ChartPanel, Checkbox, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, Combobox, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DashboardHero, DateInput, DatePicker, DateRangeInput, DateRangePicker, DiagramSkeleton, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, ErrorState, ExportMenu, FileUpload, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HelpBlock, HoverCard, InlineStepDetail, InlineStepLabel, InputGroup, Kbd, Label, Link, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkedText, MessageBubble, MicrosoftButton, Modal, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, Navbar, NumberInput, OtpInput, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, PanelWithDetails, PasswordInput, PlanApproval, PlanRewritingIndicator, Popconfirm, Popover, Progress, PromptInput, Question, QuestionBlock, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, Select, Separator, Sheet, Sidebar, SidebarProvider, Skeleton, SkeletonList, Slider, Slot, SplitButton, SpotlightBackdrop, StatCard, StatCardGrid, Stepper, SuggestedPrompt, Switch, Table, Tabs, TabsContent, TextInput, Textarea, ThemeProvider, ThemeScope, ThinkingIndicator, TimeInput, TimePicker, Timeline, Toaster, Toggle, ToggleGroup, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, Tooltip, TooltipProvider, Truncated, UsageStats, UsageStatsRing, Workbench, ZoomableSvg, appShellSlotSelector, argoVariants, brandSchema, channelsToHex, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, exampleCustomer, findLiteralMatches, hasLiteralMatch, hexToChannels, isMac, kbdVariants, keboola, keboolaLegacySidebar, keboolaLegacyTopnav, keys, mergeRefs, setServerFieldErrors, setSubmitError, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAppForm, useArgoDesign, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useThemeScopeContainer, useWorkbench, wcagLevel, withForm };
+export { Alert, AlertModal, AnswerActions, AnswerSummary, AppShell, ArgoDesignContext, AuthLayout, AutoSaveTextarea, Avatar, Badge, BrandEditor, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, Calendar, Card, ChartPanel, Checkbox, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, Combobox, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DIAGRAM_LANGUAGES, DashboardHero, DateInput, DatePicker, DateRangeInput, DateRangePicker, DiagramSkeleton, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, ErrorState, ExportMenu, FileUpload, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HelpBlock, HoverCard, InlineStepDetail, InlineStepLabel, InputGroup, Kbd, Label, Link, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkdownTable, MarkedText, MessageBubble, MicrosoftButton, Modal, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, Navbar, NumberInput, OtpInput, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, PanelWithDetails, PasswordInput, PlanApproval, PlanRewritingIndicator, Popconfirm, Popover, Progress, PromptInput, Question, QuestionBlock, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, Select, Separator, Sheet, Sidebar, SidebarProvider, Skeleton, SkeletonList, Slider, Slot, SplitButton, SpotlightBackdrop, StatCard, StatCardGrid, Stepper, SuggestedPrompt, Switch, Table, Tabs, TabsContent, TextInput, Textarea, ThemeProvider, ThemeScope, ThinkingIndicator, TimeInput, TimePicker, Timeline, Toaster, Toggle, ToggleGroup, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, Tooltip, TooltipProvider, Truncated, UsageStats, UsageStatsRing, Workbench, ZoomableSvg, appShellSlotSelector, argoVariants, brandSchema, channelsToHex, clampPercentage, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, exampleCustomer, filterByWords, findLiteralMatches, formatPercentage, hasLiteralMatch, hexToChannels, isMac, kbdVariants, keboola, keboolaLegacySidebar, keboolaLegacyTopnav, keys, matchByWords, mergeRefs, namedLabel, setServerFieldErrors, setSubmitError, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAppForm, useArgoDesign, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useThemeScopeContainer, useWorkbench, wcagLevel, withBlankValues, withForm };

package/dist/internal/blocks/AIKit.js

@@ -1,2 +1,2 @@
-import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageStats, UsageStatsRing } from "../../AIKit-DDg5DBCG.js";
-export { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageStats, UsageStatsRing };
+import { AnswerActions, AnswerSummary, CollapsibleStepHeader, DIAGRAM_LANGUAGES, InlineStepDetail, InlineStepLabel, Markdown, MarkdownTable, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageStats, UsageStatsRing, clampPercentage, formatPercentage } from "../../AIKit-BExvt9pt.js";
+export { AnswerActions, AnswerSummary, CollapsibleStepHeader, DIAGRAM_LANGUAGES, InlineStepDetail, InlineStepLabel, Markdown, MarkdownTable, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageStats, UsageStatsRing, clampPercentage, formatPercentage };

package/dist/internal/blocks/AuthLayout.js

@@ -0,0 +1,118 @@
+import { cn } from "../../classNames-BzrkDnOD.js";
+import { BrandLogo } from "../../BrandLogo-CoKBk4MI.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/blocks/AuthLayout/AuthLayout.tsx
+const widthClass = {
+	form: "tw:max-w-md",
+	wide: "tw:max-w-[34rem]"
+};
+/**
+* Column tracks of the split geometry: the form track carries a floor, the aside takes the rest.
+*
+* - The floor is the column's own width plus `SURFACE`'s gutters (`2rem` a side from `sm` up).
+* - A bare `1fr` makes the track a share of the viewport instead — `1fr` of `1fr 2fr` is a third of
+*   it — so the floor binds up to 1536px for `form` and 1824px for `wide`. Below that a bare `1fr`
+*   hands the column less than `widthClass` asks for and a two-field row collapses to ~180px each.
+* - `2fr` keeps the aside the wider half once the floor is met.
+*/
+const splitClass = {
+	form: {
+		end: "tw:lg:grid-cols-[minmax(32rem,1fr)_2fr]",
+		start: "tw:lg:grid-cols-[2fr_minmax(32rem,1fr)]"
+	},
+	wide: {
+		end: "tw:lg:grid-cols-[minmax(38rem,1fr)_2fr]",
+		start: "tw:lg:grid-cols-[2fr_minmax(38rem,1fr)]"
+	}
+};
+const SCREEN = "tw:min-h-svh";
+const SURFACE = "tw:flex tw:justify-center tw:px-4 tw:py-12 tw:sm:px-8";
+const COLUMN = "tw:flex tw:w-full tw:flex-col tw:items-center tw:gap-6";
+const Root = ({ ref, className, width = "form", aside, asideSide = "end", asideCollapse = "hide", children, ...props }) => {
+	const column = /* @__PURE__ */ jsx("div", {
+		className: cn(COLUMN, widthClass[width]),
+		children
+	});
+	if (!aside) return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cn(SURFACE, SCREEN, "tw:items-center tw:bg-muted", className),
+		...props,
+		children: column
+	});
+	const panel = /* @__PURE__ */ jsx("aside", {
+		className: cn("tw:bg-muted", asideCollapse === "stack" ? "tw:flex" : "tw:hidden tw:lg:flex"),
+		children: aside
+	});
+	const form = /* @__PURE__ */ jsx("div", {
+		className: cn(SURFACE, "tw:bg-background"),
+		children: column
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("tw:grid", SCREEN, splitClass[width][asideSide], className),
+		...props,
+		children: [asideSide === "start" ? panel : form, asideSide === "start" ? form : panel]
+	});
+};
+const Header = ({ ref, className, actions, productName, children, ...props }) => /* @__PURE__ */ jsxs("header", {
+	ref,
+	className: cn("tw:flex tw:items-center tw:gap-4", actions && "tw:w-full tw:justify-between", className),
+	...props,
+	children: [children ?? /* @__PURE__ */ jsxs("span", {
+		className: "tw:flex tw:items-center tw:gap-3",
+		children: [/* @__PURE__ */ jsx(BrandLogo, {
+			variant: "mark",
+			className: "tw:h-8 tw:text-primary"
+		}), /* @__PURE__ */ jsx("span", {
+			className: "tw:text-lg tw:font-semibold",
+			children: productName
+		})]
+	}), actions && /* @__PURE__ */ jsx("div", {
+		className: "tw:flex tw:items-center tw:gap-1",
+		children: actions
+	})]
+});
+const Content = ({ ref, className, children, ...props }) => /* @__PURE__ */ jsx("main", {
+	ref,
+	className: cn("tw:flex tw:min-h-0 tw:w-full tw:flex-1 tw:flex-col tw:gap-6", className),
+	...props,
+	children
+});
+const Footer = ({ ref, className, children, ...props }) => /* @__PURE__ */ jsx("footer", {
+	ref,
+	className: cn("tw:mt-auto tw:w-full tw:text-xs tw:text-muted-foreground", className),
+	...props,
+	children
+});
+/**
+* The signed-out page frame — sign-in, sign-up, password reset, MFA, project picker, stack picker.
+*
+* - Third member of the page-chrome family: `AppShell` frames the signed-in app, `PageLayout` its
+*   content column, `AuthLayout` the pages a visitor reaches without a session.
+* - Owns the landmarks. `Header` / `Content` / `Footer` are `header` / `main` / `footer`, so every
+*   element on the page sits inside one — the thing each hand-built copy got wrong differently.
+* - Owns the lockup. `Header` pairs the active brand's mark with the `productName` it is given, so
+*   the page re-skins and still names the product when the brand ships no logo; pass children
+*   instead to replace the pair with an app-specific lockup.
+* - Does **not** own the card. Two of the pages it frames deliberately have none (the form column
+*   *is* the surface), so `Content` is a plain column — wrap the body in `Card` at the call site.
+* - The tinted surface is whatever is not the form: without an `aside` the page is `bg-muted` and the
+*   card supplies the contrast; with one the form column is `bg-background` and the panel `bg-muted`.
+* - Below `lg` the split collapses to one column and the `aside` is dropped. A page whose pitch has
+*   to survive that — an acquisition funnel — passes `asideCollapse="stack"` to keep it.
+*
+* **When NOT to use:** a signed-out page that is *navigational* rather than an auth step — a public
+* catalog, a shared authorization link — is a document, not a form. Use `AppShell` + `PageLayout`.
+*/
+const AuthLayout = Object.assign(Root, {
+	/** Lockup row: `productName` beside the brand's mark, or your own children. `actions` sit opposite. */
+	Header,
+	/** The form column. Wrap the body in `Card` here if the page wants one. */
+	Content,
+	/** Legal copy, a way back out, social proof. Pinned to the bottom of the column in the split geometry. */
+	Footer
+});
+//#endregion
+export { AuthLayout };
+
+//# sourceMappingURL=AuthLayout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AuthLayout.js","names":[],"sources":["../../../src/blocks/AuthLayout/AuthLayout.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport { BrandLogo } from '../../components/BrandLogo';\nimport { cn } from '../../utils';\n\n/**\n * Content-column width.\n *\n * - `form` (28rem) — one field per row: sign-in, MFA, password reset, project picker.\n * - `wide` (34rem) — multi-field or two-column forms: registration.\n */\ntype Width = 'form' | 'wide';\n\nconst widthClass = {\n  form: 'tw:max-w-md',\n  wide: 'tw:max-w-[34rem]',\n} as const satisfies Record<Width, string>;\n\n/**\n * Column tracks of the split geometry: the form track carries a floor, the aside takes the rest.\n *\n * - The floor is the column's own width plus `SURFACE`'s gutters (`2rem` a side from `sm` up).\n * - A bare `1fr` makes the track a share of the viewport instead — `1fr` of `1fr 2fr` is a third of\n *   it — so the floor binds up to 1536px for `form` and 1824px for `wide`. Below that a bare `1fr`\n *   hands the column less than `widthClass` asks for and a two-field row collapses to ~180px each.\n * - `2fr` keeps the aside the wider half once the floor is met.\n */\nconst splitClass = {\n  form: {\n    end: 'tw:lg:grid-cols-[minmax(32rem,1fr)_2fr]',\n    start: 'tw:lg:grid-cols-[2fr_minmax(32rem,1fr)]',\n  },\n  wide: {\n    end: 'tw:lg:grid-cols-[minmax(38rem,1fr)_2fr]',\n    start: 'tw:lg:grid-cols-[2fr_minmax(38rem,1fr)]',\n  },\n} as const satisfies Record<Width, Record<'start' | 'end', string>>;\n\n// `svh` rather than `vh`: the page is one screen tall by design, and `vh` on mobile reserves height\n// for browser chrome that is not there, leaving the column scrollable by the height of the toolbar.\nconst SCREEN = 'tw:min-h-svh';\n\n// Padding and horizontal centring of the form column — the screen height is deliberately not here.\n// In the split geometry the grid root carries it and its rows stretch to fill, so the column is\n// full-height anyway; its own `min-h-svh` would instead reserve a whole screen *under* a stacked\n// aside, leaving a short card with an empty viewport below it.\nconst SURFACE = 'tw:flex tw:justify-center tw:px-4 tw:py-12 tw:sm:px-8';\n\nconst COLUMN = 'tw:flex tw:w-full tw:flex-col tw:items-center tw:gap-6';\n\ntype RootProps = ComponentProps<'div'> & {\n  width?: Width;\n  /** Marketing / illustration panel. Its presence switches the page to the split geometry. */\n  aside?: ReactNode;\n  /** Which side the `aside` takes on wide screens. */\n  asideSide?: 'start' | 'end';\n  /**\n   * What the `aside` does below `lg`, where the split collapses to one column.\n   *\n   * - `hide` (default) — the panel is dropped. Right for a page a signed-out *user* asked for: they\n   *   came to sign in, and the pitch is not why they are here.\n   * - `stack` — the panel keeps its `asideSide` order relative to the form and renders above or\n   *   below it. Right for a page that has to sell: an acquisition funnel loses its social proof\n   *   otherwise, on the devices most of it arrives on.\n   */\n  asideCollapse?: 'hide' | 'stack';\n};\n\nconst Root = ({\n  ref,\n  className,\n  width = 'form',\n  aside,\n  asideSide = 'end',\n  asideCollapse = 'hide',\n  children,\n  ...props\n}: RootProps) => {\n  const column = <div className={cn(COLUMN, widthClass[width])}>{children}</div>;\n\n  if (!aside) {\n    return (\n      <div\n        ref={ref}\n        className={cn(SURFACE, SCREEN, 'tw:items-center tw:bg-muted', className)}\n        {...props}\n      >\n        {column}\n      </div>\n    );\n  }\n\n  // The form column is always the floored track and the aside the `2fr` one, whichever side it takes —\n  // so DOM order, not an `order` utility, decides the side and the reading order matches the visual one.\n  const panel = (\n    <aside\n      className={cn('tw:bg-muted', asideCollapse === 'stack' ? 'tw:flex' : 'tw:hidden tw:lg:flex')}\n    >\n      {aside}\n    </aside>\n  );\n  const form = <div className={cn(SURFACE, 'tw:bg-background')}>{column}</div>;\n\n  return (\n    <div\n      ref={ref}\n      className={cn('tw:grid', SCREEN, splitClass[width][asideSide], className)}\n      {...props}\n    >\n      {asideSide === 'start' ? panel : form}\n      {asideSide === 'start' ? form : panel}\n    </div>\n  );\n};\n\n/**\n * The lockup: either the page's own, or the brand's mark beside the product name.\n *\n * - Exactly one of the two is required. A logo-only default cannot be trusted to name the product:\n *   `BrandLogo` returns `null` for a brand that ships no logo, and falls back to the mark for one\n *   that ships no wordmark — an auth page has no bar around it, so what is left names nothing.\n * - `productName` is text, not part of the image, for the same reason.\n */\ntype Lockup =\n  | { children: ReactNode; productName?: never }\n  | { children?: never; productName: ReactNode };\n\ntype HeaderProps = Omit<ComponentProps<'header'>, 'children'> & {\n  actions?: ReactNode;\n} & Lockup;\n\nconst Header = ({ ref, className, actions, productName, children, ...props }: HeaderProps) => (\n  <header\n    ref={ref}\n    className={cn(\n      'tw:flex tw:items-center tw:gap-4',\n      // Controls need somewhere to sit apart from the mark; without them the mark centres instead.\n      actions && 'tw:w-full tw:justify-between',\n      className,\n    )}\n    {...props}\n  >\n    {children ?? (\n      <span className=\"tw:flex tw:items-center tw:gap-3\">\n        {/* `variant=\"mark\"`: a wordmark already spells the brand, so pairing it with the product\n            name states the brand twice. `h-8`, not the bar's `h-6` — with no chrome around it the\n            lockup is the only thing naming the product. */}\n        <BrandLogo variant=\"mark\" className=\"tw:h-8 tw:text-primary\" />\n        <span className=\"tw:text-lg tw:font-semibold\">{productName}</span>\n      </span>\n    )}\n    {actions && <div className=\"tw:flex tw:items-center tw:gap-1\">{actions}</div>}\n  </header>\n);\n\nconst Content = ({ ref, className, children, ...props }: ComponentProps<'main'>) => (\n  <main\n    ref={ref}\n    className={cn('tw:flex tw:min-h-0 tw:w-full tw:flex-1 tw:flex-col tw:gap-6', className)}\n    {...props}\n  >\n    {children}\n  </main>\n);\n\nconst Footer = ({ ref, className, children, ...props }: ComponentProps<'footer'>) => (\n  <footer\n    ref={ref}\n    className={cn('tw:mt-auto tw:w-full tw:text-xs tw:text-muted-foreground', className)}\n    {...props}\n  >\n    {children}\n  </footer>\n);\n\n/**\n * The signed-out page frame — sign-in, sign-up, password reset, MFA, project picker, stack picker.\n *\n * - Third member of the page-chrome family: `AppShell` frames the signed-in app, `PageLayout` its\n *   content column, `AuthLayout` the pages a visitor reaches without a session.\n * - Owns the landmarks. `Header` / `Content` / `Footer` are `header` / `main` / `footer`, so every\n *   element on the page sits inside one — the thing each hand-built copy got wrong differently.\n * - Owns the lockup. `Header` pairs the active brand's mark with the `productName` it is given, so\n *   the page re-skins and still names the product when the brand ships no logo; pass children\n *   instead to replace the pair with an app-specific lockup.\n * - Does **not** own the card. Two of the pages it frames deliberately have none (the form column\n *   *is* the surface), so `Content` is a plain column — wrap the body in `Card` at the call site.\n * - The tinted surface is whatever is not the form: without an `aside` the page is `bg-muted` and the\n *   card supplies the contrast; with one the form column is `bg-background` and the panel `bg-muted`.\n * - Below `lg` the split collapses to one column and the `aside` is dropped. A page whose pitch has\n *   to survive that — an acquisition funnel — passes `asideCollapse=\"stack\"` to keep it.\n *\n * **When NOT to use:** a signed-out page that is *navigational* rather than an auth step — a public\n * catalog, a shared authorization link — is a document, not a form. Use `AppShell` + `PageLayout`.\n */\nexport const AuthLayout = Object.assign(Root, {\n  /** Lockup row: `productName` beside the brand's mark, or your own children. `actions` sit opposite. */\n  Header,\n  /** The form column. Wrap the body in `Card` here if the page wants one. */\n  Content,\n  /** Legal copy, a way back out, social proof. Pinned to the bottom of the column in the split geometry. */\n  Footer,\n});\n\nexport type { RootProps as AuthLayoutProps };\n"],"mappings":";;;;AAaA,MAAM,aAAa;CACjB,MAAM;CACN,MAAM;AACR;;;;;;;;;;AAWA,MAAM,aAAa;CACjB,MAAM;EACJ,KAAK;EACL,OAAO;CACT;CACA,MAAM;EACJ,KAAK;EACL,OAAO;CACT;AACF;AAIA,MAAM,SAAS;AAMf,MAAM,UAAU;AAEhB,MAAM,SAAS;AAoBf,MAAM,QAAQ,EACZ,KACA,WACA,QAAQ,QACR,OACA,YAAY,OACZ,gBAAgB,QAChB,UACA,GAAG,YACY;CACf,MAAM,SAAS,oBAAC,OAAD;EAAK,WAAW,GAAG,QAAQ,WAAW,MAAM;EAAI;CAAc,CAAA;CAE7E,IAAI,CAAC,OACH,OACE,oBAAC,OAAD;EACO;EACL,WAAW,GAAG,SAAS,QAAQ,+BAA+B,SAAS;EACvE,GAAI;EAEH,UAAA;CACE,CAAA;CAMT,MAAM,QACJ,oBAAC,SAAD;EACE,WAAW,GAAG,eAAe,kBAAkB,UAAU,YAAY,sBAAsB;EAE1F,UAAA;CACI,CAAA;CAET,MAAM,OAAO,oBAAC,OAAD;EAAK,WAAW,GAAG,SAAS,kBAAkB;EAAI,UAAA;CAAY,CAAA;CAE3E,OACE,qBAAC,OAAD;EACO;EACL,WAAW,GAAG,WAAW,QAAQ,WAAW,MAAM,CAAC,YAAY,SAAS;EACxE,GAAI;EAHN,UAAA,CAKG,cAAc,UAAU,QAAQ,MAChC,cAAc,UAAU,OAAO,KAC7B;;AAET;AAkBA,MAAM,UAAU,EAAE,KAAK,WAAW,SAAS,aAAa,UAAU,GAAG,YACnE,qBAAC,UAAD;CACO;CACL,WAAW,GACT,oCAEA,WAAW,gCACX,SACF;CACA,GAAI;CARN,UAAA,CAUG,YACC,qBAAC,QAAD;EAAM,WAAU;EAAhB,UAAA,CAIE,oBAAC,WAAD;GAAW,SAAQ;GAAO,WAAU;EAA0B,CAAA,GAC9D,oBAAC,QAAD;GAAM,WAAU;GAA+B,UAAA;EAAkB,CAAA,CAC7D;CAEP,CAAA,GAAA,WAAW,oBAAC,OAAD;EAAK,WAAU;EAAoC,UAAA;CAAa,CAAA,CACtE;;AAGV,MAAM,WAAW,EAAE,KAAK,WAAW,UAAU,GAAG,YAC9C,oBAAC,QAAD;CACO;CACL,WAAW,GAAG,+DAA+D,SAAS;CACtF,GAAI;CAEH;AACG,CAAA;AAGR,MAAM,UAAU,EAAE,KAAK,WAAW,UAAU,GAAG,YAC7C,oBAAC,UAAD;CACO;CACL,WAAW,GAAG,4DAA4D,SAAS;CACnF,GAAI;CAEH;AACK,CAAA;;;;;;;;;;;;;;;;;;;;;AAuBV,MAAa,aAAa,OAAO,OAAO,MAAM;;CAE5C;;CAEA;;CAEA;AACF,CAAC"}

package/dist/internal/blocks/BrandEditor.js

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

package/dist/internal/blocks/ClipboardButton.js

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

package/dist/internal/blocks/ColorInput.js

@@ -1,2 +1,2 @@
-import { ColorInput } from "../../ColorInput-Bxj-1eLT.js";
+import { ColorInput } from "../../ColorInput-BZV-u_94.js";
 export { ColorInput };

package/dist/internal/blocks/Command.js

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

package/dist/internal/blocks/CopyField.js

@@ -1,2 +1,2 @@
-import { CopyField } from "../../CopyField-BO_sh-HO.js";
+import { CopyField } from "../../CopyField-DpT0Ngz1.js";
 export { CopyField };

package/dist/internal/blocks/DateInput.js

@@ -1,2 +1,2 @@
-import { DateInput } from "../../DateInput-ZdaMQo5i.js";
+import { DateInput } from "../../DateInput-DiEd5uCL.js";
 export { DateInput };

package/dist/internal/blocks/DateRangeInput.js

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

package/dist/internal/blocks/ExportMenu.js

@@ -1,4 +1,4 @@
-import { Tooltip } from "../../utils-B5Z52hYs.js";
+import { Tooltip } from "../../utils-DSvrhU8E.js";
 import { Download } from "../../icons-Cek151jC.js";
 import { Button } from "../../Button-DsRrU5F1.js";
 import { DropdownMenu } from "../../DropdownMenu-CASr-jgl.js";

package/dist/internal/blocks/Form/connectors/MultiComboboxField.js

@@ -1,5 +1,5 @@
 import { MultiCombobox } from "../../MultiCombobox.js";
-import { FieldItem, useFieldContext } from "../../../../FieldItem-CCd9-xnp.js";
+import { FieldItem, useFieldContext } from "../../../../FieldItem-B7XMmZSz.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/blocks/Form/connectors/MultiComboboxField.tsx
 /**

package/dist/internal/blocks/Form.js

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

package/dist/internal/blocks/FormGroup.js

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

package/dist/internal/blocks/MultiActionButtonGroup.js

@@ -1,2 +1,2 @@
-import { MultiActionButtonGroup } from "../../MultiActionButtonGroup-CxWH7yWK.js";
+import { MultiActionButtonGroup } from "../../MultiActionButtonGroup-DokHbPgM.js";
 export { MultiActionButtonGroup };