@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/dropdown-menu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-menu.mjs","names":[],"sources":["../src/dropdown-menu.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport {Check, ChevronRight, Circle} from \"lucide-react\";\nimport * as React from \"react\";\n\n/** Displays a menu of actions triggered by a button. */\nfunction DropdownMenu(props: React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>) {\n\treturn <DropdownMenuPrimitive.Root {...props} />;\n}\nconst DropdownMenuTrigger: typeof DropdownMenuPrimitive.Trigger = DropdownMenuPrimitive.Trigger;\nconst DropdownMenuGroup: typeof DropdownMenuPrimitive.Group = DropdownMenuPrimitive.Group;\nconst DropdownMenuPortal: typeof DropdownMenuPrimitive.Portal = DropdownMenuPrimitive.Portal;\nconst DropdownMenuSub: typeof DropdownMenuPrimitive.Sub = DropdownMenuPrimitive.Sub;\nconst DropdownMenuRadioGroup: typeof DropdownMenuPrimitive.RadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {inset?: boolean}\n>(({className, inset, children, ...props}, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t// Matches DropdownMenuItem: gap-2 owns icon/label spacing (the chevron is pushed by ml-auto).\n\t\t\t\"wwc:flex wwc:cursor-pointer wwc:data-[disabled]:cursor-default wwc:select-none wwc:items-center wwc:gap-2 wwc:rounded-sm wwc:px-2 wwc:py-1.5 wwc:text-sm wwc:outline-none wwc:focus:bg-menu-highlight wwc:data-[state=open]:bg-menu-highlight\",\n\t\t\tinset && \"wwc:pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<ChevronRight className=\"wwc:ml-auto wwc:h-4 wwc:w-4\" />\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nDropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;\n\nconst DropdownMenuSubContent = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({className, ...props}, ref) => (\n\t<DropdownMenuPrimitive.SubContent\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"wwc:z-50 wwc:min-w-[8rem] wwc:overflow-hidden wwc:rounded-md wwc:border wwc:bg-popover wwc:p-1 wwc:text-popover-foreground wwc:shadow-lg wwc:data-[state=open]:animate-in wwc:data-[state=closed]:animate-out wwc:data-[state=closed]:fade-out-0 wwc:data-[state=open]:fade-in-0 wwc:data-[state=closed]:zoom-out-95 wwc:data-[state=open]:zoom-in-95 wwc:data-[side=bottom]:slide-in-from-top-2 wwc:data-[side=left]:slide-in-from-right-2 wwc:data-[side=right]:slide-in-from-left-2 wwc:data-[side=top]:slide-in-from-bottom-2\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;\n\nconst DropdownMenuContent = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Content>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({className, sideOffset = 4, align = \"start\", ...props}, ref) => (\n\t<DropdownMenuPrimitive.Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tsideOffset={sideOffset}\n\t\t\talign={align}\n\t\t\tclassName={cn(\n\t\t\t\t\"wwc:z-50 wwc:min-w-[8rem] wwc:overflow-hidden wwc:rounded-md wwc:border wwc:bg-popover wwc:p-1 wwc:text-popover-foreground wwc:shadow-md wwc:data-[state=open]:animate-in wwc:data-[state=closed]:animate-out wwc:data-[state=closed]:fade-out-0 wwc:data-[state=open]:fade-in-0 wwc:data-[state=closed]:zoom-out-95 wwc:data-[state=open]:zoom-in-95 wwc:data-[side=bottom]:slide-in-from-top-2 wwc:data-[side=left]:slide-in-from-right-2 wwc:data-[side=right]:slide-in-from-left-2 wwc:data-[side=top]:slide-in-from-bottom-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t</DropdownMenuPrimitive.Portal>\n));\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\nconst DropdownMenuItem = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Item>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {inset?: boolean}\n>(({className, inset, ...props}, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t// gap-2 owns the icon/label spacing so call sites never need `mr-2` on the leading icon.\n\t\t\t\"wwc:relative wwc:flex wwc:cursor-pointer wwc:select-none wwc:items-center wwc:gap-2 wwc:rounded-sm wwc:px-2 wwc:py-1.5 wwc:text-sm wwc:outline-none wwc:transition-colors wwc:focus:bg-menu-highlight wwc:focus:text-menu-highlight-foreground wwc:data-[disabled]:pointer-events-none wwc:data-[disabled]:opacity-50 wwc:[&_svg]:pointer-events-none wwc:[&_svg]:size-4 wwc:[&_svg]:shrink-0\",\n\t\t\tinset && \"wwc:pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownMenuCheckboxItem = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({className, children, checked, ...props}, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"wwc:relative wwc:flex wwc:cursor-pointer wwc:select-none wwc:items-center wwc:rounded-sm wwc:py-1.5 wwc:pl-8 wwc:pr-2 wwc:text-sm wwc:outline-none wwc:transition-colors wwc:focus:bg-menu-highlight wwc:focus:text-menu-highlight-foreground wwc:data-[disabled]:pointer-events-none wwc:data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"wwc:absolute wwc:left-2 wwc:flex wwc:h-3.5 wwc:w-3.5 wwc:items-center wwc:justify-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Check className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuRadioItem = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({className, children, ...props}, ref) => (\n\t<DropdownMenuPrimitive.RadioItem\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"wwc:relative wwc:flex wwc:cursor-pointer wwc:select-none wwc:items-center wwc:rounded-sm wwc:py-1.5 wwc:pl-8 wwc:pr-2 wwc:text-sm wwc:outline-none wwc:transition-colors wwc:focus:bg-menu-highlight wwc:focus:text-menu-highlight-foreground wwc:data-[disabled]:pointer-events-none wwc:data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<span className=\"wwc:absolute wwc:left-2 wwc:flex wwc:h-3.5 wwc:w-3.5 wwc:items-center wwc:justify-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Circle className=\"wwc:h-2 wwc:w-2 wwc:fill-current\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;\n\nconst DropdownMenuLabel = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Label>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {inset?: boolean}\n>(({className, inset, ...props}, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\"wwc:px-2 wwc:py-1.5 wwc:text-sm wwc:font-semibold\", inset && \"wwc:pl-8\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({className, ...props}, ref) => (\n\t<DropdownMenuPrimitive.Separator\n\t\tref={ref}\n\t\tclassName={cn(\"wwc:-mx-1 wwc:my-1 wwc:h-px wwc:bg-muted\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({className, ...props}: React.HTMLAttributes<HTMLSpanElement>) => (\n\t<span className={cn(\"wwc:ml-auto wwc:text-xs wwc:tracking-widest wwc:opacity-60\", className)} {...props} />\n);\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nexport {\n\tDropdownMenu,\n\tDropdownMenuTrigger,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuCheckboxItem,\n\tDropdownMenuRadioItem,\n\tDropdownMenuLabel,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuGroup,\n\tDropdownMenuPortal,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuRadioGroup,\n};\n"],"mappings":"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"}

package/dist/empty.d.mts

@@ -0,0 +1,34 @@
+import * as React from "react";
+//#region src/empty.d.ts
+export interface EmptyProps extends React.HTMLAttributes<HTMLDivElement> {
+  icon?: React.ReactNode;
+  title?: string;
+  description?: string;
+  action?: React.ReactNode;
+}
+/** Empty state component for when there is no data to display. */
+declare const Empty: React.ForwardRefExoticComponent<EmptyProps & React.RefAttributes<HTMLDivElement>>;
+declare const EmptyIcon: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const EmptyTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLHeadingElement>>;
+declare const EmptyDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+export type EmptySelectionShortcut = {
+  /** Keys rendered as <Kbd> chips, in order (e.g. ["N"], ["⌘", "K"]). */
+  keys: React.ReactNode[];
+  label: string;
+};
+export interface EmptySelectionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+  /** Singular noun used in the default copy and shortcut labels. Defaults to "item". */
+  itemNoun?: string;
+  /** Override the shortcut legend. Defaults to the list+viewer bindings; `[]` hides it. */
+  shortcuts?: EmptySelectionShortcut[];
+  /** Heading above the shortcut legend. Defaults to "Keyboard shortcuts". */
+  shortcutsTitle?: React.ReactNode;
+  /** Defaults to "No <itemNoun> selected". */
+  title?: React.ReactNode;
+  /** Defaults to "Select a <itemNoun> from the list to view details". */
+  description?: React.ReactNode;
+}
+declare const EmptySelection: React.ForwardRefExoticComponent<EmptySelectionProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { Empty, EmptyDescription, EmptyIcon, EmptySelection, EmptyTitle };
+//# sourceMappingURL=empty.d.mts.map

package/dist/empty.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty.d.mts","names":[],"sources":["../src/empty.tsx"],"mappings":";;iBAKiB,mBAAmB,MAAM,eAAe;EACxD,OAAO,MAAM;EACb;EACA;EACA,SAAS,MAAM;;;cAIV,OAAK,MAAA,0BAAA,aAAA,MAAA,cAAA;cA6BL,WAAS,MAAA,0BAAA,MAAA,eAAA,kBAAA,MAAA,cAAA;cAcT,YAAU,MAAA,0BAAA,MAAA,eAAA,sBAAA,MAAA,cAAA;cAOV,kBAAgB,MAAA,0BAAA,MAAA,eAAA,wBAAA,MAAA,cAAA;YAoBV;;EAEX,MAAM,MAAM;EACZ;;iBAIgB,4BAA4B,KAAK,MAAM,eAAe;;EAEtE;;EAEA,YAAY;;EAEZ,iBAAiB,MAAM;;EAEvB,QAAQ,MAAM;;EAEd,cAAc,MAAM;;cA2Bf,gBAAc,MAAA,0BAAA,sBAAA,MAAA,cAAA"}

package/dist/empty.mjs

@@ -0,0 +1,119 @@
+import { Kbd } from "./kbd.mjs";
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/empty.tsx
+/** Empty state component for when there is no data to display. */
+const Empty = React.forwardRef(({ className, icon, title, description, action, children, ...props }, ref) => /* @__PURE__ */ jsxs("div", {
+	ref,
+	className: cn("wwc:flex wwc:min-h-[400px] wwc:flex-col wwc:items-center wwc:justify-center wwc:p-8 wwc:text-center wwc:animate-in wwc:fade-in-50", className),
+	...props,
+	children: [
+		icon && /* @__PURE__ */ jsx("div", {
+			className: "wwc:flex wwc:h-20 wwc:w-20 wwc:items-center wwc:justify-center wwc:rounded-full wwc:bg-muted wwc:text-muted-foreground",
+			children: icon
+		}),
+		title && /* @__PURE__ */ jsx("h3", {
+			className: "wwc:mt-4 wwc:text-lg wwc:font-semibold",
+			children: title
+		}),
+		description && /* @__PURE__ */ jsx("p", {
+			className: "wwc:mb-4 wwc:mt-2 wwc:text-sm wwc:text-muted-foreground wwc:max-w-md",
+			children: description
+		}),
+		action && /* @__PURE__ */ jsx("div", {
+			className: "wwc:mt-2",
+			children: action
+		}),
+		children
+	]
+}));
+Empty.displayName = "Empty";
+const EmptyIcon = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:flex wwc:h-20 wwc:w-20 wwc:items-center wwc:justify-center wwc:rounded-full wwc:bg-muted", className),
+	...props
+}));
+EmptyIcon.displayName = "EmptyIcon";
+const EmptyTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h3", {
+	ref,
+	className: cn("wwc:mt-4 wwc:text-lg wwc:font-semibold", className),
+	...props
+}));
+EmptyTitle.displayName = "EmptyTitle";
+const EmptyDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", {
+	ref,
+	className: cn("wwc:mb-4 wwc:mt-2 wwc:text-sm wwc:text-muted-foreground", className),
+	...props
+}));
+EmptyDescription.displayName = "EmptyDescription";
+function ShortcutRow({ keys, label }) {
+	return /* @__PURE__ */ jsxs("li", {
+		className: "wwc:flex wwc:items-center wwc:gap-3",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "wwc:flex wwc:w-12 wwc:justify-end wwc:gap-1",
+			children: keys.map((k, i) => /* @__PURE__ */ jsx(Kbd, { children: k }, i))
+		}), /* @__PURE__ */ jsx("span", { children: label })]
+	});
+}
+/** Default bindings — mirrors TaskMonitor's built-in keyboard shortcuts. */
+function defaultShortcuts(itemNoun) {
+	return [
+		{
+			keys: ["N"],
+			label: `Next ${itemNoun}`
+		},
+		{
+			keys: ["P"],
+			label: `Previous ${itemNoun}`
+		},
+		{
+			keys: ["←"],
+			label: "Previous tab"
+		},
+		{
+			keys: ["→"],
+			label: "Next tab"
+		},
+		{
+			keys: ["Esc"],
+			label: "Close tab"
+		}
+	];
+}
+const EmptySelection = React.forwardRef(({ className, itemNoun = "item", shortcuts, shortcutsTitle = "Keyboard shortcuts", title, description, ...props }, ref) => {
+	const article = /^[aeiou]/i.test(itemNoun) ? "an" : "a";
+	const rows = shortcuts ?? defaultShortcuts(itemNoun);
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("wwc:flex wwc:h-full wwc:flex-col wwc:items-center wwc:justify-center wwc:gap-8 wwc:bg-background wwc:p-6", className),
+		...props,
+		children: [rows.length > 0 && /* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:flex-col wwc:gap-2.5",
+			children: [/* @__PURE__ */ jsx("h4", {
+				className: "wwc:text-center wwc:text-sm wwc:font-semibold wwc:text-foreground",
+				children: shortcutsTitle
+			}), /* @__PURE__ */ jsx("ul", {
+				className: "wwc:flex wwc:flex-col wwc:gap-1.5 wwc:text-sm wwc:text-muted-foreground",
+				children: rows.map((row) => /* @__PURE__ */ jsx(ShortcutRow, {
+					keys: row.keys,
+					label: row.label
+				}, row.label))
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:flex-col wwc:items-center wwc:gap-1 wwc:text-center",
+			children: [/* @__PURE__ */ jsx("h3", {
+				className: "wwc:text-base wwc:font-semibold wwc:text-foreground",
+				children: title ?? `No ${itemNoun} selected`
+			}), /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-sm wwc:text-muted-foreground",
+				children: description ?? `Select ${article} ${itemNoun} from the list to view details`
+			})]
+		})]
+	});
+});
+EmptySelection.displayName = "EmptySelection";
+//#endregion
+export { Empty, EmptyDescription, EmptyIcon, EmptySelection, EmptyTitle };
+
+//# sourceMappingURL=empty.mjs.map

package/dist/empty.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty.mjs","names":[],"sources":["../src/empty.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\nimport {Kbd} from \"./kbd\";\n\nexport interface EmptyProps extends React.HTMLAttributes<HTMLDivElement> {\n\ticon?: React.ReactNode;\n\ttitle?: string;\n\tdescription?: string;\n\taction?: React.ReactNode;\n}\n\n/** Empty state component for when there is no data to display. */\nconst Empty = React.forwardRef<HTMLDivElement, EmptyProps>(\n\t({className, icon, title, description, action, children, ...props}, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t// Borderless by design — the empty state is centred content in its pane, not a boxed\n\t\t\t\t// placeholder. Matches EmptySelection below. Never re-add a dashed border here, and do\n\t\t\t\t// not wrap this in a bordered container at the call site: that reads as a double frame.\n\t\t\t\t\"wwc:flex wwc:min-h-[400px] wwc:flex-col wwc:items-center wwc:justify-center wwc:p-8 wwc:text-center wwc:animate-in wwc:fade-in-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{icon && (\n\t\t\t\t<div className=\"wwc:flex wwc:h-20 wwc:w-20 wwc:items-center wwc:justify-center wwc:rounded-full wwc:bg-muted wwc:text-muted-foreground\">\n\t\t\t\t\t{icon}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{title && <h3 className=\"wwc:mt-4 wwc:text-lg wwc:font-semibold\">{title}</h3>}\n\t\t\t{description && (\n\t\t\t\t<p className=\"wwc:mb-4 wwc:mt-2 wwc:text-sm wwc:text-muted-foreground wwc:max-w-md\">{description}</p>\n\t\t\t)}\n\t\t\t{action && <div className=\"wwc:mt-2\">{action}</div>}\n\t\t\t{children}\n\t\t</div>\n\t),\n);\nEmpty.displayName = \"Empty\";\n\nconst EmptyIcon = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n\t({className, ...props}, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"wwc:flex wwc:h-20 wwc:w-20 wwc:items-center wwc:justify-center wwc:rounded-full wwc:bg-muted\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nEmptyIcon.displayName = \"EmptyIcon\";\n\nconst EmptyTitle = React.forwardRef<HTMLHeadingElement, React.HTMLAttributes<HTMLHeadingElement>>(\n\t({className, ...props}, ref) => (\n\t\t<h3 ref={ref} className={cn(\"wwc:mt-4 wwc:text-lg wwc:font-semibold\", className)} {...props} />\n\t),\n);\nEmptyTitle.displayName = \"EmptyTitle\";\n\nconst EmptyDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n\t({className, ...props}, ref) => (\n\t\t<p ref={ref} className={cn(\"wwc:mb-4 wwc:mt-2 wwc:text-sm wwc:text-muted-foreground\", className)} {...props} />\n\t),\n);\nEmptyDescription.displayName = \"EmptyDescription\";\n\n/* -----------------------------------------------------------------------------\n * EmptySelection — the empty-state variant for a viewer pane with nothing selected.\n *\n * A keyboard-shortcut legend above a \"No <noun> selected\" message, both centred\n * in the pane. Unlike <Empty> (no data at all) this is for data that exists but\n * nothing is picked yet, so it is borderless and fills its pane in the body\n * color — master/detail surfaces (task monitors, inboxes, list+viewer layouts)\n * all show the same empty viewer.\n *\n * The shortcut list defaults to TaskMonitor's built-in bindings; pass\n * `shortcuts` to describe a different set, or `[]` to drop the legend entirely.\n * -------------------------------------------------------------------------- */\n\nexport type EmptySelectionShortcut = {\n\t/** Keys rendered as <Kbd> chips, in order (e.g. [\"N\"], [\"⌘\", \"K\"]). */\n\tkeys: React.ReactNode[];\n\tlabel: string;\n};\n\n// `title`/`description` are widened to ReactNode, so the DOM `title` attribute is dropped.\nexport interface EmptySelectionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n\t/** Singular noun used in the default copy and shortcut labels. Defaults to \"item\". */\n\titemNoun?: string;\n\t/** Override the shortcut legend. Defaults to the list+viewer bindings; `[]` hides it. */\n\tshortcuts?: EmptySelectionShortcut[];\n\t/** Heading above the shortcut legend. Defaults to \"Keyboard shortcuts\". */\n\tshortcutsTitle?: React.ReactNode;\n\t/** Defaults to \"No <itemNoun> selected\". */\n\ttitle?: React.ReactNode;\n\t/** Defaults to \"Select a <itemNoun> from the list to view details\". */\n\tdescription?: React.ReactNode;\n}\n\nfunction ShortcutRow({keys, label}: EmptySelectionShortcut) {\n\treturn (\n\t\t<li className=\"wwc:flex wwc:items-center wwc:gap-3\">\n\t\t\t<span className=\"wwc:flex wwc:w-12 wwc:justify-end wwc:gap-1\">\n\t\t\t\t{keys.map((k, i) => (\n\t\t\t\t\t<Kbd key={i}>{k}</Kbd>\n\t\t\t\t))}\n\t\t\t</span>\n\t\t\t<span>{label}</span>\n\t\t</li>\n\t);\n}\n\n/** Default bindings — mirrors TaskMonitor's built-in keyboard shortcuts. */\nfunction defaultShortcuts(itemNoun: string): EmptySelectionShortcut[] {\n\treturn [\n\t\t{keys: [\"N\"], label: `Next ${itemNoun}`},\n\t\t{keys: [\"P\"], label: `Previous ${itemNoun}`},\n\t\t{keys: [\"←\"], label: \"Previous tab\"},\n\t\t{keys: [\"→\"], label: \"Next tab\"},\n\t\t{keys: [\"Esc\"], label: \"Close tab\"},\n\t];\n}\n\nconst EmptySelection = React.forwardRef<HTMLDivElement, EmptySelectionProps>(\n\t(\n\t\t{className, itemNoun = \"item\", shortcuts, shortcutsTitle = \"Keyboard shortcuts\", title, description, ...props},\n\t\tref,\n\t) => {\n\t\tconst article = /^[aeiou]/i.test(itemNoun) ? \"an\" : \"a\";\n\t\tconst rows = shortcuts ?? defaultShortcuts(itemNoun);\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:flex wwc:h-full wwc:flex-col wwc:items-center wwc:justify-center wwc:gap-8 wwc:bg-background wwc:p-6\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{rows.length > 0 && (\n\t\t\t\t\t<div className=\"wwc:flex wwc:flex-col wwc:gap-2.5\">\n\t\t\t\t\t\t<h4 className=\"wwc:text-center wwc:text-sm wwc:font-semibold wwc:text-foreground\">{shortcutsTitle}</h4>\n\t\t\t\t\t\t<ul className=\"wwc:flex wwc:flex-col wwc:gap-1.5 wwc:text-sm wwc:text-muted-foreground\">\n\t\t\t\t\t\t\t{rows.map((row) => (\n\t\t\t\t\t\t\t\t<ShortcutRow key={row.label} keys={row.keys} label={row.label} />\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div className=\"wwc:flex wwc:flex-col wwc:items-center wwc:gap-1 wwc:text-center\">\n\t\t\t\t\t<h3 className=\"wwc:text-base wwc:font-semibold wwc:text-foreground\">{title ?? `No ${itemNoun} selected`}</h3>\n\t\t\t\t\t<p className=\"wwc:text-sm wwc:text-muted-foreground\">\n\t\t\t\t\t\t{description ?? `Select ${article} ${itemNoun} from the list to view details`}\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t},\n);\nEmptySelection.displayName = \"EmptySelection\";\n\nexport {Empty, EmptyIcon, EmptyTitle, EmptyDescription, EmptySelection};\n"],"mappings":";;;;;;AAaA,MAAM,QAAQ,MAAM,YAClB,EAAC,WAAW,MAAM,OAAO,aAAa,QAAQ,UAAU,GAAG,SAAQ,QACnE,qBAAC,OAAD;CACM;CACL,WAAW,GAIV,qIACA,SACD;CACA,GAAI;CATL,UAAA;EAWE,QACA,oBAAC,OAAD;GAAK,WAAU;GACb,UAAA;EACG,CAAA;EAEL,SAAS,oBAAC,MAAD;GAAI,WAAU;GAA0C,UAAA;EAAU,CAAA;EAC3E,eACA,oBAAC,KAAD;GAAG,WAAU;GAAwE,UAAA;EAAe,CAAA;EAEpG,UAAU,oBAAC,OAAD;GAAK,WAAU;GAAY,UAAA;EAAY,CAAA;EACjD;CACG;AAEP,CAAA,CAAA;AACA,MAAM,cAAc;AAEpB,MAAM,YAAY,MAAM,YACtB,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,OAAD;CACM;CACL,WAAW,GACV,gGACA,SACD;CACA,GAAI;AACJ,CAAA,CAEH;AACA,UAAU,cAAc;AAExB,MAAM,aAAa,MAAM,YACvB,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,MAAD;CAAS;CAAK,WAAW,GAAG,0CAA0C,SAAS;CAAG,GAAI;AAAQ,CAAA,CAEhG;AACA,WAAW,cAAc;AAEzB,MAAM,mBAAmB,MAAM,YAC7B,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,KAAD;CAAQ;CAAK,WAAW,GAAG,2DAA2D,SAAS;CAAG,GAAI;AAAQ,CAAA,CAEhH;AACA,iBAAiB,cAAc;AAmC/B,SAAS,YAAY,EAAC,MAAM,SAAgC;CAC3D,OACC,qBAAC,MAAD;EAAI,WAAU;EAAd,UAAA,CACC,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,KAAK,KAAK,GAAG,MACb,oBAAC,KAAD,EAAA,UAAc,EAAO,GAAX,CAAW,CACrB;EACI,CAAA,GACN,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA,CAChB;;AAEN;;AAGA,SAAS,iBAAiB,UAA4C;CACrE,OAAO;EACN;GAAC,MAAM,CAAC,GAAG;GAAG,OAAO,QAAQ;EAAU;EACvC;GAAC,MAAM,CAAC,GAAG;GAAG,OAAO,YAAY;EAAU;EAC3C;GAAC,MAAM,CAAC,GAAG;GAAG,OAAO;EAAc;EACnC;GAAC,MAAM,CAAC,GAAG;GAAG,OAAO;EAAU;EAC/B;GAAC,MAAM,CAAC,KAAK;GAAG,OAAO;EAAW;CACnC;AACD;AAEA,MAAM,iBAAiB,MAAM,YAE3B,EAAC,WAAW,WAAW,QAAQ,WAAW,iBAAiB,sBAAsB,OAAO,aAAa,GAAG,SACxG,QACI;CACJ,MAAM,UAAU,YAAY,KAAK,QAAQ,IAAI,OAAO;CACpD,MAAM,OAAO,aAAa,iBAAiB,QAAQ;CAEnD,OACC,qBAAC,OAAD;EACM;EACL,WAAW,GACV,4GACA,SACD;EACA,GAAI;EANL,UAAA,CAQE,KAAK,SAAS,KACd,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACC,oBAAC,MAAD;IAAI,WAAU;IAAqE,UAAA;GAAmB,CAAA,GACtG,oBAAC,MAAD;IAAI,WAAU;IACZ,UAAA,KAAK,KAAK,QACV,oBAAC,aAAD;KAA6B,MAAM,IAAI;KAAM,OAAO,IAAI;IAAQ,GAA9C,IAAI,KAA0C,CAChE;GACE,CAAA,CACA;EAEN,CAAA,GAAA,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACC,oBAAC,MAAD;IAAI,WAAU;IAAuD,UAAA,SAAS,MAAM,SAAS;GAAe,CAAA,GAC5G,oBAAC,KAAD;IAAG,WAAU;IACX,UAAA,eAAe,UAAU,QAAQ,GAAG,SAAS;GAC5C,CAAA,CACC;EACD,CAAA,CAAA;;AAEP,CACD;AACA,eAAe,cAAc"}

package/dist/error-page.d.mts

@@ -0,0 +1,20 @@
+import * as React from "react";
+//#region src/error-page.d.ts
+type ErrorType = "404" | "401" | "403" | "500" | "503" | "generic";
+export interface ErrorPageProps extends React.HTMLAttributes<HTMLDivElement> {
+  type?: ErrorType;
+  code?: string;
+  title?: string;
+  description?: string;
+  action?: React.ReactNode;
+  showCode?: boolean;
+}
+/** Full-page error display with predefined configs for common HTTP errors. */
+declare const ErrorPage: React.ForwardRefExoticComponent<ErrorPageProps & React.RefAttributes<HTMLDivElement>>;
+declare const ErrorPageCode: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const ErrorPageTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLHeadingElement>>;
+declare const ErrorPageDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const ErrorPageAction: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { ErrorPage, ErrorPageAction, ErrorPageCode, ErrorPageDescription, ErrorPageTitle };
+//# sourceMappingURL=error-page.d.mts.map

package/dist/error-page.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-page.d.mts","names":[],"sources":["../src/error-page.tsx"],"mappings":";;KAGK;iBAyCY,uBAAuB,MAAM,eAAe;EAC5D,OAAO;EACP;EACA;EACA;EACA,SAAS,MAAM;EACf;;;cAIK,WAAS,MAAA,0BAAA,iBAAA,MAAA,cAAA;cA+BT,eAAa,MAAA,0BAAA,MAAA,eAAA,wBAAA,MAAA,cAAA;cAWb,gBAAc,MAAA,0BAAA,MAAA,eAAA,sBAAA,MAAA,cAAA;cAOd,sBAAoB,MAAA,0BAAA,MAAA,eAAA,wBAAA,MAAA,cAAA;cAOpB,iBAAe,MAAA,0BAAA,MAAA,eAAA,kBAAA,MAAA,cAAA"}

package/dist/error-page.mjs

@@ -0,0 +1,96 @@
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/error-page.tsx
+const errorConfigs = {
+	"404": {
+		code: "404",
+		title: "Page Not Found",
+		description: "The page you're looking for doesn't exist or has been moved."
+	},
+	"401": {
+		code: "401",
+		title: "Unauthorized",
+		description: "You need to be authenticated to access this page."
+	},
+	"403": {
+		code: "403",
+		title: "Forbidden",
+		description: "You don't have permission to access this resource."
+	},
+	"500": {
+		code: "500",
+		title: "Server Error",
+		description: "Something went wrong on our end. Please try again later."
+	},
+	"503": {
+		code: "503",
+		title: "Service Unavailable",
+		description: "The service is temporarily unavailable. Please try again later."
+	},
+	generic: {
+		code: "Error",
+		title: "Something Went Wrong",
+		description: "An unexpected error occurred. Please try again."
+	}
+};
+/** Full-page error display with predefined configs for common HTTP errors. */
+const ErrorPage = React.forwardRef(({ className, type = "generic", code, title, description, action, showCode = true, children, ...props }, ref) => {
+	const config = errorConfigs[type];
+	const displayCode = code ?? config.code;
+	const displayTitle = title ?? config.title;
+	const displayDescription = description ?? config.description;
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("wwc:flex wwc:min-h-[400px] wwc:flex-col wwc:items-center wwc:justify-center wwc:p-8 wwc:text-center", className),
+		...props,
+		children: [
+			showCode && /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-6xl wwc:font-semibold wwc:tracking-tight wwc:text-foreground",
+				children: displayCode
+			}),
+			/* @__PURE__ */ jsx("h1", {
+				className: "wwc:mt-3 wwc:text-lg wwc:font-medium wwc:text-foreground",
+				children: displayTitle
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "wwc:mt-1 wwc:max-w-sm wwc:text-sm wwc:text-muted-foreground",
+				children: displayDescription
+			}),
+			action && /* @__PURE__ */ jsx("div", {
+				className: "wwc:mt-6",
+				children: action
+			}),
+			children
+		]
+	});
+});
+ErrorPage.displayName = "ErrorPage";
+const ErrorPageCode = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", {
+	ref,
+	className: cn("wwc:text-6xl wwc:font-semibold wwc:tracking-tight wwc:text-foreground", className),
+	...props
+}));
+ErrorPageCode.displayName = "ErrorPageCode";
+const ErrorPageTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h1", {
+	ref,
+	className: cn("wwc:mt-3 wwc:text-lg wwc:font-medium wwc:text-foreground", className),
+	...props
+}));
+ErrorPageTitle.displayName = "ErrorPageTitle";
+const ErrorPageDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", {
+	ref,
+	className: cn("wwc:mt-1 wwc:max-w-sm wwc:text-sm wwc:text-muted-foreground", className),
+	...props
+}));
+ErrorPageDescription.displayName = "ErrorPageDescription";
+const ErrorPageAction = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:mt-6 wwc:flex wwc:gap-2", className),
+	...props
+}));
+ErrorPageAction.displayName = "ErrorPageAction";
+//#endregion
+export { ErrorPage, ErrorPageAction, ErrorPageCode, ErrorPageDescription, ErrorPageTitle };
+
+//# sourceMappingURL=error-page.mjs.map

package/dist/error-page.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-page.mjs","names":[],"sources":["../src/error-page.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\ntype ErrorType = \"404\" | \"401\" | \"403\" | \"500\" | \"503\" | \"generic\";\n\ninterface ErrorConfig {\n\tcode: string;\n\ttitle: string;\n\tdescription: string;\n}\n\nconst errorConfigs: Record<ErrorType, ErrorConfig> = {\n\t\"404\": {\n\t\tcode: \"404\",\n\t\ttitle: \"Page Not Found\",\n\t\tdescription: \"The page you're looking for doesn't exist or has been moved.\",\n\t},\n\t\"401\": {\n\t\tcode: \"401\",\n\t\ttitle: \"Unauthorized\",\n\t\tdescription: \"You need to be authenticated to access this page.\",\n\t},\n\t\"403\": {\n\t\tcode: \"403\",\n\t\ttitle: \"Forbidden\",\n\t\tdescription: \"You don't have permission to access this resource.\",\n\t},\n\t\"500\": {\n\t\tcode: \"500\",\n\t\ttitle: \"Server Error\",\n\t\tdescription: \"Something went wrong on our end. Please try again later.\",\n\t},\n\t\"503\": {\n\t\tcode: \"503\",\n\t\ttitle: \"Service Unavailable\",\n\t\tdescription: \"The service is temporarily unavailable. Please try again later.\",\n\t},\n\tgeneric: {\n\t\tcode: \"Error\",\n\t\ttitle: \"Something Went Wrong\",\n\t\tdescription: \"An unexpected error occurred. Please try again.\",\n\t},\n};\n\nexport interface ErrorPageProps extends React.HTMLAttributes<HTMLDivElement> {\n\ttype?: ErrorType;\n\tcode?: string;\n\ttitle?: string;\n\tdescription?: string;\n\taction?: React.ReactNode;\n\tshowCode?: boolean;\n}\n\n/** Full-page error display with predefined configs for common HTTP errors. */\nconst ErrorPage = React.forwardRef<HTMLDivElement, ErrorPageProps>(\n\t({className, type = \"generic\", code, title, description, action, showCode = true, children, ...props}, ref) => {\n\t\tconst config = errorConfigs[type];\n\t\tconst displayCode = code ?? config.code;\n\t\tconst displayTitle = title ?? config.title;\n\t\tconst displayDescription = description ?? config.description;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:flex wwc:min-h-[400px] wwc:flex-col wwc:items-center wwc:justify-center wwc:p-8 wwc:text-center\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{showCode && (\n\t\t\t\t\t<p className=\"wwc:text-6xl wwc:font-semibold wwc:tracking-tight wwc:text-foreground\">{displayCode}</p>\n\t\t\t\t)}\n\t\t\t\t<h1 className=\"wwc:mt-3 wwc:text-lg wwc:font-medium wwc:text-foreground\">{displayTitle}</h1>\n\t\t\t\t<p className=\"wwc:mt-1 wwc:max-w-sm wwc:text-sm wwc:text-muted-foreground\">{displayDescription}</p>\n\t\t\t\t{action && <div className=\"wwc:mt-6\">{action}</div>}\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t);\n\t},\n);\nErrorPage.displayName = \"ErrorPage\";\n\n// Compound components for custom composition\n\nconst ErrorPageCode = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n\t({className, ...props}, ref) => (\n\t\t<p\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"wwc:text-6xl wwc:font-semibold wwc:tracking-tight wwc:text-foreground\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nErrorPageCode.displayName = \"ErrorPageCode\";\n\nconst ErrorPageTitle = React.forwardRef<HTMLHeadingElement, React.HTMLAttributes<HTMLHeadingElement>>(\n\t({className, ...props}, ref) => (\n\t\t<h1 ref={ref} className={cn(\"wwc:mt-3 wwc:text-lg wwc:font-medium wwc:text-foreground\", className)} {...props} />\n\t),\n);\nErrorPageTitle.displayName = \"ErrorPageTitle\";\n\nconst ErrorPageDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n\t({className, ...props}, ref) => (\n\t\t<p ref={ref} className={cn(\"wwc:mt-1 wwc:max-w-sm wwc:text-sm wwc:text-muted-foreground\", className)} {...props} />\n\t),\n);\nErrorPageDescription.displayName = \"ErrorPageDescription\";\n\nconst ErrorPageAction = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n\t({className, ...props}, ref) => <div ref={ref} className={cn(\"wwc:mt-6 wwc:flex wwc:gap-2\", className)} {...props} />,\n);\nErrorPageAction.displayName = \"ErrorPageAction\";\n\nexport {ErrorPage, ErrorPageCode, ErrorPageTitle, ErrorPageDescription, ErrorPageAction};\n"],"mappings":";;;;AAWA,MAAM,eAA+C;CACpD,OAAO;EACN,MAAM;EACN,OAAO;EACP,aAAa;CACd;CACA,OAAO;EACN,MAAM;EACN,OAAO;EACP,aAAa;CACd;CACA,OAAO;EACN,MAAM;EACN,OAAO;EACP,aAAa;CACd;CACA,OAAO;EACN,MAAM;EACN,OAAO;EACP,aAAa;CACd;CACA,OAAO;EACN,MAAM;EACN,OAAO;EACP,aAAa;CACd;CACA,SAAS;EACR,MAAM;EACN,OAAO;EACP,aAAa;CACd;AACD;;AAYA,MAAM,YAAY,MAAM,YACtB,EAAC,WAAW,OAAO,WAAW,MAAM,OAAO,aAAa,QAAQ,WAAW,MAAM,UAAU,GAAG,SAAQ,QAAQ;CAC9G,MAAM,SAAS,aAAa;CAC5B,MAAM,cAAc,QAAQ,OAAO;CACnC,MAAM,eAAe,SAAS,OAAO;CACrC,MAAM,qBAAqB,eAAe,OAAO;CAEjD,OACC,qBAAC,OAAD;EACM;EACL,WAAW,GACV,uGACA,SACD;EACA,GAAI;EANL,UAAA;GAQE,YACA,oBAAC,KAAD;IAAG,WAAU;IAAyE,UAAA;GAAe,CAAA;GAEtG,oBAAC,MAAD;IAAI,WAAU;IAA4D,UAAA;GAAiB,CAAA;GAC3F,oBAAC,KAAD;IAAG,WAAU;IAA+D,UAAA;GAAsB,CAAA;GACjG,UAAU,oBAAC,OAAD;IAAK,WAAU;IAAY,UAAA;GAAY,CAAA;GACjD;EACG;;AAEP,CACD;AACA,UAAU,cAAc;AAIxB,MAAM,gBAAgB,MAAM,YAC1B,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,KAAD;CACM;CACL,WAAW,GAAG,yEAAyE,SAAS;CAChG,GAAI;AACJ,CAAA,CAEH;AACA,cAAc,cAAc;AAE5B,MAAM,iBAAiB,MAAM,YAC3B,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,MAAD;CAAS;CAAK,WAAW,GAAG,4DAA4D,SAAS;CAAG,GAAI;AAAQ,CAAA,CAElH;AACA,eAAe,cAAc;AAE7B,MAAM,uBAAuB,MAAM,YACjC,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,KAAD;CAAQ;CAAK,WAAW,GAAG,+DAA+D,SAAS;CAAG,GAAI;AAAQ,CAAA,CAEpH;AACA,qBAAqB,cAAc;AAEnC,MAAM,kBAAkB,MAAM,YAC5B,EAAC,WAAW,GAAG,SAAQ,QAAQ,oBAAC,OAAD;CAAU;CAAK,WAAW,GAAG,+BAA+B,SAAS;CAAG,GAAI;AAAQ,CAAA,CACrH;AACA,gBAAgB,cAAc"}

package/dist/export-dialog.d.mts

@@ -0,0 +1,58 @@
+import * as React from "react";
+//#region src/export-dialog.d.ts
+export type ExportFileType = "pdf" | "excel";
+export type ExportTemplateOption = {
+  id: string;
+  label: string;
+  /** Optional hint shown under the template select. */
+  description?: string;
+  /** The file type this template produces. Defaults to "pdf". */
+  fileType?: ExportFileType;
+  /** Whether this template exports the filtered view. Defaults to true. */
+  includeFilters?: boolean;
+};
+export type ExportDateRange = {
+  from: Date | undefined;
+  to: Date | undefined;
+};
+export type ExportSubmission = {
+  /** Resolved file type — from the template when one is selected. */
+  fileType: ExportFileType;
+  /** Resolved scope — from the template when one is selected. */
+  includeFilters: boolean;
+  /** Set when an existing template was chosen. */
+  templateId?: string;
+  /** Period the export covers. `from`/`to` are undefined when the user left it empty. */
+  dateRange: ExportDateRange;
+};
+export interface ExportDialogProps {
+  /** Controlled open state. Omit to let the dialog manage its own. */
+  open?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  /** Element that opens the dialog. Omit when driving `open` yourself. */
+  trigger?: React.ReactNode;
+  /** Saved templates to pick from. Empty/omitted leaves only the one-off export. */
+  templates?: ExportTemplateOption[];
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  defaultFileType?: ExportFileType;
+  defaultIncludeFilters?: boolean;
+  /** Shown beside the scope toggle so the user knows what "current filters" means. */
+  activeFilterCount?: number;
+  /** Seeds the date range each time the dialog opens — e.g. the range already applied to the list. */
+  defaultDateRange?: ExportDateRange;
+  /** When provided, a "New template" action renders bottom-left and hands off to the template flow. */
+  onCreateTemplate?: () => void;
+  newTemplateLabel?: React.ReactNode;
+  /** Fires on Export with the resolved selection. The dialog closes afterwards. */
+  onExport?: (submission: ExportSubmission) => void;
+  exportLabel?: React.ReactNode;
+  className?: string;
+}
+declare function ExportDialog({ open, onOpenChange, trigger, templates, title, description, defaultFileType, defaultIncludeFilters, activeFilterCount, defaultDateRange, onCreateTemplate, newTemplateLabel, onExport, exportLabel, className }: ExportDialogProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ExportDialog {
+  var displayName: string;
+}
+//#endregion
+export { ExportDialog };
+//# sourceMappingURL=export-dialog.d.mts.map

package/dist/export-dialog.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"export-dialog.d.mts","names":[],"sources":["../src/export-dialog.tsx"],"mappings":";;YAgDY;YAEA;EACX;EACA;;EAEA;;EAEA,WAAW;;EAEX;;YAGW;EAAmB,MAAM;EAAkB,IAAI;;YAE/C;;EAEX,UAAU;;EAEV;;EAEA;;EAEA,WAAW;;iBAGK;;EAEhB;EACA,gBAAgB;;EAEhB,UAAU,MAAM;;EAEhB,YAAY;EACZ,QAAQ,MAAM;EACd,cAAc,MAAM;EACpB,kBAAkB;EAClB;;EAEA;;EAEA,mBAAmB;;EAEnB;EACA,mBAAmB,MAAM;;EAEzB,YAAY,YAAY;EACxB,cAAc,MAAM;EACpB;;iBAgCQ,eACR,MACA,cACA,SACA,WACA,OACA,aACA,iBACA,uBACA,mBACA,kBACA,kBACA,kBACA,UACA,aACA,aACE,gDAAiB,IAAA;kBAhBX;MAAA"}

package/dist/export-dialog.mjs

@@ -0,0 +1,248 @@
+import { Button } from "./button.mjs";
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "./dialog.mjs";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./select.mjs";
+import { Label } from "./label.mjs";
+import { Switch } from "./switch.mjs";
+import { DateRangeTimePicker } from "./date-picker.mjs";
+import { Chip } from "./chip.mjs";
+import { RadioGroup, RadioGroupItem } from "./radio-group.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { FileSpreadsheet, FileText, Plus } from "lucide-react";
+import * as React from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/export-dialog.tsx
+const FILE_TYPES = [{
+	value: "pdf",
+	label: "PDF",
+	icon: /* @__PURE__ */ jsx(FileText, { className: "wwc:h-3.5 wwc:w-3.5" })
+}, {
+	value: "excel",
+	label: "Excel",
+	icon: /* @__PURE__ */ jsx(FileSpreadsheet, { className: "wwc:h-3.5 wwc:w-3.5" })
+}];
+const fileTypeLabel = (value) => FILE_TYPES.find((t) => t.value === value)?.label ?? value;
+/** Section wrapper — each block is separated by a rule, not just whitespace. */
+function Section({ title, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:border-b wwc:px-4 wwc:py-3 wwc:last:border-b-0",
+		children: [/* @__PURE__ */ jsx("p", {
+			className: "wwc:mb-2.5 wwc:text-xs wwc:font-semibold wwc:uppercase wwc:tracking-wider wwc:text-muted-foreground",
+			children: title
+		}), children]
+	});
+}
+/** Read-only "this is what the template produces" row. */
+function SummaryRow({ label, value }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-3 wwc:py-1",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "wwc:text-xs wwc:text-muted-foreground",
+			children: label
+		}), /* @__PURE__ */ jsx("span", {
+			className: "wwc:text-xs wwc:font-medium wwc:text-foreground",
+			children: value
+		})]
+	});
+}
+function ExportDialog({ open, onOpenChange, trigger, templates = [], title = "Export", description, defaultFileType = "pdf", defaultIncludeFilters = true, activeFilterCount, defaultDateRange, onCreateTemplate, newTemplateLabel = "New template", onExport, exportLabel = "Export", className }) {
+	const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);
+	const isControlled = open !== void 0;
+	const isOpen = isControlled ? open : uncontrolledOpen;
+	const hasTemplates = templates.length > 0;
+	const [mode, setMode] = React.useState(hasTemplates ? "saved" : "new");
+	const [templateId, setTemplateId] = React.useState(templates[0]?.id);
+	const [showErrors, setShowErrors] = React.useState(false);
+	const [fileType, setFileType] = React.useState(defaultFileType);
+	const [includeFilters, setIncludeFilters] = React.useState(defaultIncludeFilters);
+	const [dateRange, setDateRange] = React.useState(defaultDateRange ?? {
+		from: void 0,
+		to: void 0
+	});
+	const setOpenState = React.useCallback((next) => {
+		if (next) {
+			setMode(hasTemplates ? "saved" : "new");
+			setTemplateId(templates[0]?.id);
+			setFileType(defaultFileType);
+			setIncludeFilters(defaultIncludeFilters);
+			setDateRange(defaultDateRange ?? {
+				from: void 0,
+				to: void 0
+			});
+		}
+		if (!isControlled) setUncontrolledOpen(next);
+		onOpenChange?.(next);
+	}, [
+		defaultDateRange,
+		defaultFileType,
+		defaultIncludeFilters,
+		hasTemplates,
+		isControlled,
+		onOpenChange,
+		templates
+	]);
+	const selectedTemplate = templates.find((t) => t.id === templateId);
+	const usingTemplate = mode === "saved" && hasTemplates;
+	const resolvedFileType = usingTemplate ? selectedTemplate?.fileType ?? "pdf" : fileType;
+	const resolvedIncludeFilters = usingTemplate ? selectedTemplate?.includeFilters ?? true : includeFilters;
+	const templateError = usingTemplate && templateId === void 0 ? "Select a template to export." : void 0;
+	const scopeText = (on) => on ? activeFilterCount !== void 0 ? `Filtered view · ${activeFilterCount} active filter${activeFilterCount === 1 ? "" : "s"}` : "Filtered view" : "All records";
+	const handleExport = () => {
+		if (templateError) {
+			setShowErrors(true);
+			return;
+		}
+		onExport?.({
+			fileType: resolvedFileType,
+			includeFilters: resolvedIncludeFilters,
+			templateId: usingTemplate ? templateId : void 0,
+			dateRange
+		});
+		setOpenState(false);
+	};
+	const dateSection = /* @__PURE__ */ jsx(Section, {
+		title: "Date range",
+		children: /* @__PURE__ */ jsx(DateRangeTimePicker, {
+			dateRange,
+			onDateRangeChange: setDateRange,
+			placeholder: "Select a date range",
+			className: "wwc:h-8 wwc:w-full wwc:text-[13px]"
+		})
+	});
+	return /* @__PURE__ */ jsxs(Dialog, {
+		open: isOpen,
+		onOpenChange: setOpenState,
+		children: [trigger && /* @__PURE__ */ jsx(DialogTrigger, {
+			asChild: true,
+			children: trigger
+		}), /* @__PURE__ */ jsxs(DialogContent, {
+			className: cn("wwc:gap-0 wwc:p-0 wwc:sm:max-w-[560px]", className),
+			children: [
+				/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: title }), description && /* @__PURE__ */ jsx(DialogDescription, {
+					className: "wwc:text-xs",
+					children: description
+				})] }),
+				hasTemplates && /* @__PURE__ */ jsx(Section, {
+					title: "Export using",
+					children: /* @__PURE__ */ jsx(RadioGroup, {
+						value: mode,
+						onValueChange: (v) => setMode(v),
+						className: "wwc:grid-cols-2 wwc:gap-2",
+						children: [{
+							value: "saved",
+							label: "Saved template"
+						}, {
+							value: "new",
+							label: "New export"
+						}].map((option) => /* @__PURE__ */ jsxs(Label, {
+							htmlFor: `export-mode-${option.value}`,
+							className: cn("wwc:flex wwc:cursor-pointer wwc:items-center wwc:gap-2 wwc:rounded-md wwc:border wwc:px-3 wwc:py-2 wwc:text-[13px] wwc:font-normal", mode === option.value ? "wwc:border-primary wwc:bg-accent" : "wwc:border-border"),
+							children: [/* @__PURE__ */ jsx(RadioGroupItem, {
+								id: `export-mode-${option.value}`,
+								value: option.value
+							}), option.label]
+						}, option.value))
+					})
+				}),
+				usingTemplate ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Section, {
+					title: "Template",
+					children: [
+						/* @__PURE__ */ jsxs(Select, {
+							value: templateId,
+							onValueChange: setTemplateId,
+							children: [/* @__PURE__ */ jsx(SelectTrigger, {
+								className: "wwc:h-8 wwc:text-[13px]",
+								children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select a template" })
+							}), /* @__PURE__ */ jsx(SelectContent, { children: templates.map((template) => /* @__PURE__ */ jsx(SelectItem, {
+								value: template.id,
+								className: "wwc:text-[13px]",
+								children: template.label
+							}, template.id)) })]
+						}),
+						showErrors && templateError && /* @__PURE__ */ jsx("p", {
+							className: "wwc:mt-1.5 wwc:text-xs wwc:text-destructive",
+							children: templateError
+						}),
+						selectedTemplate?.description && /* @__PURE__ */ jsx("p", {
+							className: "wwc:mt-1.5 wwc:text-xs wwc:text-muted-foreground",
+							children: selectedTemplate.description
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "wwc:mt-3 wwc:rounded-md wwc:border wwc:bg-muted/40 wwc:px-3 wwc:py-2",
+							children: [/* @__PURE__ */ jsx(SummaryRow, {
+								label: "File type",
+								value: fileTypeLabel(resolvedFileType)
+							}), /* @__PURE__ */ jsx(SummaryRow, {
+								label: "Scope",
+								value: scopeText(resolvedIncludeFilters)
+							})]
+						})
+					]
+				}), dateSection] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					/* @__PURE__ */ jsx(Section, {
+						title: "File type",
+						children: /* @__PURE__ */ jsx("div", {
+							className: "wwc:flex wwc:flex-wrap wwc:gap-1.5",
+							children: FILE_TYPES.map((type) => /* @__PURE__ */ jsx(Chip, {
+								size: "sm",
+								pressed: fileType === type.value,
+								onPressedChange: (next) => next && setFileType(type.value),
+								children: /* @__PURE__ */ jsxs("span", {
+									className: "wwc:flex wwc:items-center wwc:gap-1.5",
+									children: [type.icon, type.label]
+								})
+							}, type.value))
+						})
+					}),
+					/* @__PURE__ */ jsx(Section, {
+						title: "Scope",
+						children: /* @__PURE__ */ jsxs("div", {
+							className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-3",
+							children: [/* @__PURE__ */ jsxs(Label, {
+								htmlFor: "export-include-filters",
+								className: "wwc:cursor-pointer wwc:font-normal",
+								children: [/* @__PURE__ */ jsx("span", {
+									className: "wwc:block wwc:text-[13px]",
+									children: "Apply current filters"
+								}), /* @__PURE__ */ jsx("span", {
+									className: "wwc:block wwc:text-xs wwc:text-muted-foreground",
+									children: scopeText(includeFilters)
+								})]
+							}), /* @__PURE__ */ jsx(Switch, {
+								id: "export-include-filters",
+								checked: includeFilters,
+								onCheckedChange: setIncludeFilters
+							})]
+						})
+					}),
+					dateSection
+				] }),
+				/* @__PURE__ */ jsxs(DialogFooter, {
+					className: "wwc:border-t wwc:border-border wwc:px-4 wwc:py-2 wwc:sm:justify-between",
+					children: [onCreateTemplate ? /* @__PURE__ */ jsxs(Button, {
+						variant: "outline",
+						size: "sm",
+						onClick: onCreateTemplate,
+						children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-3.5 wwc:w-3.5" }), newTemplateLabel]
+					}) : /* @__PURE__ */ jsx("span", {}), /* @__PURE__ */ jsxs("div", {
+						className: "wwc:flex wwc:items-center wwc:gap-2",
+						children: [/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							size: "sm",
+							onClick: () => setOpenState(false),
+							children: "Cancel"
+						}), /* @__PURE__ */ jsx(Button, {
+							size: "sm",
+							onClick: handleExport,
+							children: exportLabel
+						})]
+					})]
+				})
+			]
+		})]
+	});
+}
+ExportDialog.displayName = "ExportDialog";
+//#endregion
+export { ExportDialog };
+
+//# sourceMappingURL=export-dialog.mjs.map