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

package/dist/side-menu.d.mts

@@ -0,0 +1,61 @@
+import { ComponentType, ReactNode } from "react";
+//#region src/side-menu.d.ts
+export interface SideMenuItem {
+  id: string;
+  label: string;
+  /** Optional leading icon (a lucide-style icon component taking `className`). */
+  icon?: ComponentType<{
+    className?: string;
+  }>;
+  /** Optional trailing count pill (e.g. how many records the item holds). */
+  count?: number;
+}
+export interface SideMenuGroup {
+  /** Optional uppercase section label shown above the group (e.g. "CATEGORIES"). */
+  label?: string;
+  /**
+   * Draw a rule above this group, separating it from the one before.
+   *
+   * For a rail whose groups are unlabelled: without a label there is nothing but a 2px gap between
+   * two groups, so they read as one list. Ignored on the first group, which has nothing to separate
+   * from.
+   */
+  divider?: boolean;
+  items: SideMenuItem[];
+}
+export interface SideMenuProps {
+  /** Panel title shown in the header. */
+  title: string;
+  /** Optional leading icon shown before the title. */
+  icon?: ReactNode;
+  /** When provided, a back button is rendered before the title and calls this on click. */
+  onBack?: () => void;
+  /** Accessible label for the back button. Defaults to "Back". */
+  backLabel?: string;
+  /** Show the search field. Defaults to `true`. */
+  showSearch?: boolean;
+  searchPlaceholder?: string;
+  /** Controlled search value; pair with `onSearchChange`. Uncontrolled when omitted. */
+  searchValue?: string;
+  onSearchChange?: (value: string) => void;
+  /** Grouped navigation entries. */
+  groups: SideMenuGroup[];
+  /** Currently active item id — highlighted. */
+  activeItemId?: string;
+  onItemSelect?: (id: string) => void;
+  /** Extra classes on the panel container (e.g. width override). */
+  className?: string;
+}
+/**
+ * Navigation panel for a content-area sub-surface (settings, integrations, filters). Owns its own
+ * header (optional back button + icon + title), optional search, and grouped items with an active
+ * state. Place it as the left column of a content region, not as the app shell sidebar (use
+ * CoreAppSidebar for that).
+ *
+ * Responsive: on desktop it's the vertical left column; below `md` the column is hidden and the items
+ * collapse into a full-width bar with a dropdown picker (selecting an item opens it). For the mobile
+ * bar to sit above the content rather than beside it, give the surrounding row `flex-col md:flex-row`.
+ */
+export declare function SideMenu({ title, icon, onBack, backLabel, showSearch, searchPlaceholder, searchValue, onSearchChange, groups, activeItemId, onItemSelect, className }: SideMenuProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+//# sourceMappingURL=side-menu.d.mts.map

package/dist/side-menu.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"side-menu.d.mts","names":[],"sources":["../src/side-menu.tsx"],"mappings":";;iBAgBiB;EAChB;EACA;;EAEA,OAAO;IAAe;;;EAEtB;;iBAGgB;;EAEhB;;;;;;;;EAQA;EACA,OAAO;;iBAGS;;EAEhB;;EAEA,OAAO;;EAEP;;EAEA;;EAEA;EACA;;EAEA;EACA,kBAAkB;;EAElB,QAAQ;;EAER;EACA,gBAAgB;;EAEhB;;;;;;;;;;;;wBAae,WACf,OACA,MACA,QACA,WACA,YACA,mBACA,aACA,gBACA,QACA,cACA,cACA,aACE,4CAAa,IAAA"}

package/dist/side-menu.mjs

@@ -0,0 +1,160 @@
+import { Badge } from "./badge.mjs";
+import { Button } from "./button.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuTrigger } from "./dropdown-menu.mjs";
+import { Input } from "./input.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { ArrowLeft, Check, ChevronDown, Search } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/side-menu.tsx
+/**
+* Navigation panel for a content-area sub-surface (settings, integrations, filters). Owns its own
+* header (optional back button + icon + title), optional search, and grouped items with an active
+* state. Place it as the left column of a content region, not as the app shell sidebar (use
+* CoreAppSidebar for that).
+*
+* Responsive: on desktop it's the vertical left column; below `md` the column is hidden and the items
+* collapse into a full-width bar with a dropdown picker (selecting an item opens it). For the mobile
+* bar to sit above the content rather than beside it, give the surrounding row `flex-col md:flex-row`.
+*/
+function SideMenu({ title, icon, onBack, backLabel = "Back", showSearch = true, searchPlaceholder = "Search...", searchValue, onSearchChange, groups, activeItemId, onItemSelect, className }) {
+	const activeItem = groups.flatMap((group) => group.items).find((item) => item.id === activeItemId);
+	const ActiveIcon = activeItem?.icon;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
+		className: "wwc:flex wwc:items-center wwc:gap-2 wwc:border-b wwc:border-border wwc:bg-card wwc:px-3 wwc:py-2 wwc:md:hidden",
+		children: [
+			onBack ? /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "ghost",
+				size: "sm",
+				icon: true,
+				"aria-label": backLabel,
+				onClick: onBack,
+				className: "wwc:shrink-0",
+				children: /* @__PURE__ */ jsx(ArrowLeft, {})
+			}) : null,
+			icon ? /* @__PURE__ */ jsx("span", {
+				className: "wwc:flex wwc:shrink-0 wwc:items-center wwc:text-foreground",
+				children: icon
+			}) : null,
+			/* @__PURE__ */ jsx("h2", {
+				className: "wwc:truncate wwc:text-base wwc:font-semibold wwc:text-foreground",
+				children: title
+			}),
+			/* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
+				asChild: true,
+				children: /* @__PURE__ */ jsxs(Button, {
+					variant: "outline",
+					size: "sm",
+					className: "wwc:ml-auto wwc:min-w-0 wwc:max-w-[60%] wwc:gap-2",
+					children: [
+						ActiveIcon ? /* @__PURE__ */ jsx(ActiveIcon, { className: "wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:text-muted-foreground" }) : null,
+						/* @__PURE__ */ jsx("span", {
+							className: "wwc:truncate",
+							children: activeItem?.label ?? "Select"
+						}),
+						/* @__PURE__ */ jsx(ChevronDown, { className: "wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:opacity-60" })
+					]
+				})
+			}), /* @__PURE__ */ jsx(DropdownMenuContent, {
+				align: "end",
+				className: "wwc:max-h-[60vh] wwc:min-w-[13rem] wwc:overflow-y-auto",
+				children: groups.map((group, groupIndex) => /* @__PURE__ */ jsxs("div", { children: [group.label ? /* @__PURE__ */ jsx(DropdownMenuLabel, { children: group.label }) : null, group.items.map((item) => {
+					const Icon = item.icon;
+					return /* @__PURE__ */ jsxs(DropdownMenuItem, {
+						onSelect: () => onItemSelect?.(item.id),
+						className: "wwc:gap-2",
+						children: [
+							Icon ? /* @__PURE__ */ jsx(Icon, { className: "wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:text-muted-foreground" }) : null,
+							/* @__PURE__ */ jsx("span", {
+								className: "wwc:flex-1 wwc:truncate",
+								children: item.label
+							}),
+							typeof item.count === "number" ? /* @__PURE__ */ jsx(Badge, {
+								variant: "secondary",
+								className: "wwc:h-auto wwc:shrink-0 wwc:rounded-full wwc:px-1.5 wwc:py-0.5 wwc:text-[10px] wwc:leading-none wwc:tabular-nums",
+								children: item.count
+							}) : null,
+							item.id === activeItemId ? /* @__PURE__ */ jsx(Check, { className: "wwc:h-4 wwc:w-4 wwc:shrink-0" }) : null
+						]
+					}, item.id);
+				})] }, group.label ?? `group-${groupIndex}`))
+			})] })
+		]
+	}), /* @__PURE__ */ jsxs("div", {
+		"data-core-artifact": "side-menu",
+		className: cn("wwc:hidden wwc:h-full wwc:min-h-0 wwc:w-64 wwc:shrink-0 wwc:flex-col wwc:border-r wwc:border-border wwc:bg-card wwc:md:flex", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:items-center wwc:gap-2 wwc:px-3 wwc:py-3",
+				children: [
+					onBack ? /* @__PURE__ */ jsx(Button, {
+						type: "button",
+						variant: "ghost",
+						size: "sm",
+						icon: true,
+						"aria-label": backLabel,
+						onClick: onBack,
+						className: "wwc:shrink-0",
+						children: /* @__PURE__ */ jsx(ArrowLeft, {})
+					}) : null,
+					icon ? /* @__PURE__ */ jsx("span", {
+						className: "wwc:flex wwc:shrink-0 wwc:items-center wwc:text-foreground",
+						children: icon
+					}) : null,
+					/* @__PURE__ */ jsx("h2", {
+						className: "wwc:truncate wwc:text-base wwc:font-semibold wwc:text-foreground",
+						children: title
+					})
+				]
+			}),
+			showSearch ? /* @__PURE__ */ jsx("div", {
+				className: "wwc:px-3 wwc:pb-2",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "wwc:relative",
+					children: [/* @__PURE__ */ jsx(Search, { className: "wwc:pointer-events-none wwc:absolute wwc:top-1/2 wwc:left-2.5 wwc:h-4 wwc:w-4 wwc:-translate-y-1/2 wwc:text-muted-foreground" }), /* @__PURE__ */ jsx(Input, {
+						type: "search",
+						placeholder: searchPlaceholder,
+						value: searchValue,
+						onChange: (event) => onSearchChange?.(event.target.value),
+						className: "wwc:h-9 wwc:pl-8"
+					})]
+				})
+			}) : null,
+			/* @__PURE__ */ jsx("nav", {
+				className: "wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col wwc:gap-0.5 wwc:overflow-y-auto wwc:px-2 wwc:pb-3",
+				children: groups.map((group, groupIndex) => /* @__PURE__ */ jsxs("div", {
+					className: cn("wwc:flex wwc:flex-col wwc:gap-0.5", group.divider && groupIndex > 0 && "wwc:mt-2 wwc:border-t wwc:border-border wwc:pt-2"),
+					children: [group.label ? /* @__PURE__ */ jsx("div", {
+						className: "wwc:px-3 wwc:pt-3 wwc:pb-1 wwc:text-[10px] wwc:font-medium wwc:tracking-wide wwc:text-muted-foreground wwc:uppercase",
+						children: group.label
+					}) : null, group.items.map((item) => {
+						const isActive = item.id === activeItemId;
+						const Icon = item.icon;
+						return /* @__PURE__ */ jsxs("button", {
+							type: "button",
+							onClick: () => onItemSelect?.(item.id),
+							"aria-current": isActive ? "page" : void 0,
+							className: cn("wwc:group wwc:flex wwc:w-full wwc:items-center wwc:gap-3 wwc:rounded-lg wwc:px-3 wwc:py-[7px] wwc:text-[13px] wwc:transition-colors", isActive ? "wwc:bg-muted wwc:font-medium wwc:text-foreground" : "wwc:text-foreground/80 wwc:hover:bg-muted/50 wwc:hover:text-foreground"),
+							children: [
+								Icon ? /* @__PURE__ */ jsx(Icon, { className: "wwc:h-[15px] wwc:w-[15px] wwc:shrink-0 wwc:text-muted-foreground wwc:group-hover:text-foreground" }) : null,
+								/* @__PURE__ */ jsx("span", {
+									className: "wwc:truncate",
+									children: item.label
+								}),
+								typeof item.count === "number" ? /* @__PURE__ */ jsx(Badge, {
+									variant: "secondary",
+									className: "wwc:ml-auto wwc:h-auto wwc:shrink-0 wwc:rounded-full wwc:px-1.5 wwc:py-0.5 wwc:text-[10px] wwc:leading-none wwc:tabular-nums",
+									children: item.count
+								}) : null
+							]
+						}, item.id);
+					})]
+				}, group.label ?? `group-${groupIndex}`))
+			})
+		]
+	})] });
+}
+//#endregion
+export { SideMenu };
+
+//# sourceMappingURL=side-menu.mjs.map

package/dist/side-menu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"side-menu.mjs","names":[],"sources":["../src/side-menu.tsx"],"sourcesContent":["import type {ComponentType, ReactNode} from \"react\";\n\nimport {cn} from \"@corensystem/coren-utils\";\nimport {ArrowLeft, Check, ChevronDown, Search} from \"lucide-react\";\n\nimport {Badge} from \"./badge\";\nimport {Button} from \"./button\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuLabel,\n\tDropdownMenuTrigger,\n} from \"./dropdown-menu\";\nimport {Input} from \"./input\";\n\nexport interface SideMenuItem {\n\tid: string;\n\tlabel: string;\n\t/** Optional leading icon (a lucide-style icon component taking `className`). */\n\ticon?: ComponentType<{className?: string}>;\n\t/** Optional trailing count pill (e.g. how many records the item holds). */\n\tcount?: number;\n}\n\nexport interface SideMenuGroup {\n\t/** Optional uppercase section label shown above the group (e.g. \"CATEGORIES\"). */\n\tlabel?: string;\n\t/**\n\t * Draw a rule above this group, separating it from the one before.\n\t *\n\t * For a rail whose groups are unlabelled: without a label there is nothing but a 2px gap between\n\t * two groups, so they read as one list. Ignored on the first group, which has nothing to separate\n\t * from.\n\t */\n\tdivider?: boolean;\n\titems: SideMenuItem[];\n}\n\nexport interface SideMenuProps {\n\t/** Panel title shown in the header. */\n\ttitle: string;\n\t/** Optional leading icon shown before the title. */\n\ticon?: ReactNode;\n\t/** When provided, a back button is rendered before the title and calls this on click. */\n\tonBack?: () => void;\n\t/** Accessible label for the back button. Defaults to \"Back\". */\n\tbackLabel?: string;\n\t/** Show the search field. Defaults to `true`. */\n\tshowSearch?: boolean;\n\tsearchPlaceholder?: string;\n\t/** Controlled search value; pair with `onSearchChange`. Uncontrolled when omitted. */\n\tsearchValue?: string;\n\tonSearchChange?: (value: string) => void;\n\t/** Grouped navigation entries. */\n\tgroups: SideMenuGroup[];\n\t/** Currently active item id — highlighted. */\n\tactiveItemId?: string;\n\tonItemSelect?: (id: string) => void;\n\t/** Extra classes on the panel container (e.g. width override). */\n\tclassName?: string;\n}\n\n/**\n * Navigation panel for a content-area sub-surface (settings, integrations, filters). Owns its own\n * header (optional back button + icon + title), optional search, and grouped items with an active\n * state. Place it as the left column of a content region, not as the app shell sidebar (use\n * CoreAppSidebar for that).\n *\n * Responsive: on desktop it's the vertical left column; below `md` the column is hidden and the items\n * collapse into a full-width bar with a dropdown picker (selecting an item opens it). For the mobile\n * bar to sit above the content rather than beside it, give the surrounding row `flex-col md:flex-row`.\n */\nexport function SideMenu({\n\ttitle,\n\ticon,\n\tonBack,\n\tbackLabel = \"Back\",\n\tshowSearch = true,\n\tsearchPlaceholder = \"Search...\",\n\tsearchValue,\n\tonSearchChange,\n\tgroups,\n\tactiveItemId,\n\tonItemSelect,\n\tclassName,\n}: SideMenuProps) {\n\tconst items = groups.flatMap((group) => group.items);\n\tconst activeItem = items.find((item) => item.id === activeItemId);\n\tconst ActiveIcon = activeItem?.icon;\n\n\treturn (\n\t\t<>\n\t\t\t{/* Mobile: a compact bar with the panel title and a dropdown of the items. */}\n\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-2 wwc:border-b wwc:border-border wwc:bg-card wwc:px-3 wwc:py-2 wwc:md:hidden\">\n\t\t\t\t{onBack ? (\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\ticon\n\t\t\t\t\t\taria-label={backLabel}\n\t\t\t\t\t\tonClick={onBack}\n\t\t\t\t\t\tclassName=\"wwc:shrink-0\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeft />\n\t\t\t\t\t</Button>\n\t\t\t\t) : null}\n\t\t\t\t{icon ? <span className=\"wwc:flex wwc:shrink-0 wwc:items-center wwc:text-foreground\">{icon}</span> : null}\n\t\t\t\t<h2 className=\"wwc:truncate wwc:text-base wwc:font-semibold wwc:text-foreground\">{title}</h2>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"outline\" size=\"sm\" className=\"wwc:ml-auto wwc:min-w-0 wwc:max-w-[60%] wwc:gap-2\">\n\t\t\t\t\t\t\t{ActiveIcon ? <ActiveIcon className=\"wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:text-muted-foreground\" /> : null}\n\t\t\t\t\t\t\t<span className=\"wwc:truncate\">{activeItem?.label ?? \"Select\"}</span>\n\t\t\t\t\t\t\t<ChevronDown className=\"wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:opacity-60\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\" className=\"wwc:max-h-[60vh] wwc:min-w-[13rem] wwc:overflow-y-auto\">\n\t\t\t\t\t\t{groups.map((group, groupIndex) => (\n\t\t\t\t\t\t\t<div key={group.label ?? `group-${groupIndex}`}>\n\t\t\t\t\t\t\t\t{group.label ? <DropdownMenuLabel>{group.label}</DropdownMenuLabel> : null}\n\t\t\t\t\t\t\t\t{group.items.map((item) => {\n\t\t\t\t\t\t\t\t\tconst Icon = item.icon;\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<DropdownMenuItem key={item.id} onSelect={() => onItemSelect?.(item.id)} className=\"wwc:gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t{Icon ? <Icon className=\"wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:text-muted-foreground\" /> : null}\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"wwc:flex-1 wwc:truncate\">{item.label}</span>\n\t\t\t\t\t\t\t\t\t\t\t{typeof item.count === \"number\" ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"wwc:h-auto wwc:shrink-0 wwc:rounded-full wwc:px-1.5 wwc:py-0.5 wwc:text-[10px] wwc:leading-none wwc:tabular-nums\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{item.count}\n\t\t\t\t\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t\t\t{item.id === activeItemId ? <Check className=\"wwc:h-4 wwc:w-4 wwc:shrink-0\" /> : null}\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\n\t\t\t{/* Desktop: the vertical left column. */}\n\t\t\t<div\n\t\t\t\tdata-core-artifact=\"side-menu\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:hidden wwc:h-full wwc:min-h-0 wwc:w-64 wwc:shrink-0 wwc:flex-col wwc:border-r wwc:border-border wwc:bg-card wwc:md:flex\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-2 wwc:px-3 wwc:py-3\">\n\t\t\t\t\t{onBack ? (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\ticon\n\t\t\t\t\t\t\taria-label={backLabel}\n\t\t\t\t\t\t\tonClick={onBack}\n\t\t\t\t\t\t\tclassName=\"wwc:shrink-0\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ArrowLeft />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{icon ? <span className=\"wwc:flex wwc:shrink-0 wwc:items-center wwc:text-foreground\">{icon}</span> : null}\n\t\t\t\t\t<h2 className=\"wwc:truncate wwc:text-base wwc:font-semibold wwc:text-foreground\">{title}</h2>\n\t\t\t\t</div>\n\n\t\t\t\t{showSearch ? (\n\t\t\t\t\t<div className=\"wwc:px-3 wwc:pb-2\">\n\t\t\t\t\t\t<div className=\"wwc:relative\">\n\t\t\t\t\t\t\t<Search className=\"wwc:pointer-events-none wwc:absolute wwc:top-1/2 wwc:left-2.5 wwc:h-4 wwc:w-4 wwc:-translate-y-1/2 wwc:text-muted-foreground\" />\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\ttype=\"search\"\n\t\t\t\t\t\t\t\tplaceholder={searchPlaceholder}\n\t\t\t\t\t\t\t\tvalue={searchValue}\n\t\t\t\t\t\t\t\tonChange={(event) => onSearchChange?.(event.target.value)}\n\t\t\t\t\t\t\t\tclassName=\"wwc:h-9 wwc:pl-8\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\n\t\t\t\t<nav className=\"wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col wwc:gap-0.5 wwc:overflow-y-auto wwc:px-2 wwc:pb-3\">\n\t\t\t\t\t{groups.map((group, groupIndex) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={group.label ?? `group-${groupIndex}`}\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"wwc:flex wwc:flex-col wwc:gap-0.5\",\n\t\t\t\t\t\t\t\tgroup.divider && groupIndex > 0 && \"wwc:mt-2 wwc:border-t wwc:border-border wwc:pt-2\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{group.label ? (\n\t\t\t\t\t\t\t\t<div className=\"wwc:px-3 wwc:pt-3 wwc:pb-1 wwc:text-[10px] wwc:font-medium wwc:tracking-wide wwc:text-muted-foreground wwc:uppercase\">\n\t\t\t\t\t\t\t\t\t{group.label}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t{group.items.map((item) => {\n\t\t\t\t\t\t\t\tconst isActive = item.id === activeItemId;\n\t\t\t\t\t\t\t\tconst Icon = item.icon;\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => onItemSelect?.(item.id)}\n\t\t\t\t\t\t\t\t\t\taria-current={isActive ? \"page\" : undefined}\n\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\"wwc:group wwc:flex wwc:w-full wwc:items-center wwc:gap-3 wwc:rounded-lg wwc:px-3 wwc:py-[7px] wwc:text-[13px] wwc:transition-colors\",\n\t\t\t\t\t\t\t\t\t\t\tisActive\n\t\t\t\t\t\t\t\t\t\t\t\t? \"wwc:bg-muted wwc:font-medium wwc:text-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t\t: \"wwc:text-foreground/80 wwc:hover:bg-muted/50 wwc:hover:text-foreground\",\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{Icon ? (\n\t\t\t\t\t\t\t\t\t\t\t<Icon className=\"wwc:h-[15px] wwc:w-[15px] wwc:shrink-0 wwc:text-muted-foreground wwc:group-hover:text-foreground\" />\n\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t\t<span className=\"wwc:truncate\">{item.label}</span>\n\t\t\t\t\t\t\t\t\t\t{typeof item.count === \"number\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"wwc:ml-auto wwc:h-auto wwc:shrink-0 wwc:rounded-full wwc:px-1.5 wwc:py-0.5 wwc:text-[10px] wwc:leading-none wwc:tabular-nums\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{item.count}\n\t\t\t\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</nav>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],"mappings":"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"}

package/dist/sidebar.d.mts

@@ -0,0 +1,36 @@
+import { ButtonProps } from "./button.mjs";
+import * as React from "react";
+//#region src/sidebar.d.ts
+type SidebarContext = {
+  open: boolean;
+  setOpen: (open: boolean) => void;
+  openMobile: boolean;
+  setOpenMobile: (open: boolean) => void;
+  isMobile: boolean;
+  toggleSidebar: () => void;
+};
+declare const SidebarContext: React.Context<SidebarContext | null>;
+declare function useSidebar(): SidebarContext;
+declare const SidebarProvider: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+  defaultOpen?: boolean;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** Collapsible sidebar with menu groups, sub-menus, and responsive behavior. */
+declare const Sidebar: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+  side?: "left" | "right";
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarTrigger: React.ForwardRefExoticComponent<Omit<ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SidebarHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarFooter: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroup: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroupLabel: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroupContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarMenu: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & React.RefAttributes<HTMLUListElement>>;
+declare const SidebarMenuItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
+declare const SidebarMenuButton: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
+  isActive?: boolean;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SidebarSeparator: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-separator").SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem, SidebarProvider, SidebarSeparator, SidebarTrigger, useSidebar };
+//# sourceMappingURL=sidebar.d.mts.map

package/dist/sidebar.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.d.mts","names":[],"sources":["../src/sidebar.tsx"],"mappings":";;;KAYK;EACJ;EACA,UAAU;EACV;EACA,gBAAgB;EAChB;EACA;;cAGK,gBAAc,MAAA,QAAA;iBAEX,cAAU;cAQb,iBAAe,MAAA,0BAAA,KAAA,MAAA,gBAAA,kBAAA,MAAA,eAAA;EAGL;YAgDd,MAAA,cAAA;;cAII,SAAO,MAAA,0BAAA,KAAA,MAAA,gBAAA,kBAAA,MAAA,eAAA;EAGJ;YA6BP,MAAA,cAAA;cAGI,gBAAc,MAAA,0BAAA,KAAA,cAAA,MAAA,cAAA,6BAAA,MAAA,cAAA;cAcd,eAAa,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,iBAAA,0BAAA,MAAA,cAAA;cAKb,eAAa,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,iBAAA,0BAAA,MAAA,cAAA;cAKb,gBAAc,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,iBAAA,0BAAA,MAAA,cAAA;cASd,cAAY,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,iBAAA,0BAAA,MAAA,cAAA;cAKZ,mBAAiB,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,iBAAA,0BAAA,MAAA,cAAA;cAcjB,qBAAmB,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,iBAAA,0BAAA,MAAA,cAAA;cAKnB,aAAW,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,eAAA,mBAAA,4BAAA,MAAA,cAAA;cAKX,iBAAe,MAAA,0BAAA,KAAA,MAAA,kBAAA,MAAA,iBAAA,gBAAA,yBAAA,MAAA,cAAA;cAKf,mBAAiB,MAAA,0BAAA,KAAA,MAAA,gBAAA,qBAAA,MAAA,qBAAA;EAGV;YAcX,MAAA,cAAA;cAGI,kBAAgB,MAAA,0BAAA,KAAA,yCAAA,iBAAA,MAAA,cAAA,0BAAA,MAAA,cAAA,0BAAA,MAAA,cAAA"}

package/dist/sidebar.mjs

@@ -0,0 +1,159 @@
+import { Button } from "./button.mjs";
+import { ScrollArea } from "./scroll-area.mjs";
+import { Sheet, SheetContent } from "./sheet.mjs";
+import { Separator } from "./separator.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { PanelLeft } from "lucide-react";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/sidebar.tsx
+const SIDEBAR_WIDTH = "16rem";
+const SIDEBAR_WIDTH_MOBILE = "18rem";
+const SidebarContext = React.createContext(null);
+function useSidebar() {
+	const context = React.useContext(SidebarContext);
+	if (!context) throw new Error("useSidebar must be used within a SidebarProvider.");
+	return context;
+}
+const SidebarProvider = React.forwardRef(({ defaultOpen = true, className, children, ...props }, ref) => {
+	const [open, setOpen] = React.useState(defaultOpen);
+	const [openMobile, setOpenMobile] = React.useState(false);
+	const [isMobile, setIsMobile] = React.useState(false);
+	React.useEffect(() => {
+		const checkMobile = () => setIsMobile(window.innerWidth < 768);
+		checkMobile();
+		window.addEventListener("resize", checkMobile);
+		return () => window.removeEventListener("resize", checkMobile);
+	}, []);
+	const toggleSidebar = React.useCallback(() => {
+		if (isMobile) setOpenMobile((prev) => !prev);
+		else setOpen((prev) => !prev);
+	}, [isMobile]);
+	return /* @__PURE__ */ jsx(SidebarContext.Provider, {
+		value: {
+			open,
+			setOpen,
+			openMobile,
+			setOpenMobile,
+			isMobile,
+			toggleSidebar
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			ref,
+			className: cn("wwc:flex wwc:min-h-svh wwc:w-full", className),
+			style: {
+				"--sidebar-width": SIDEBAR_WIDTH,
+				"--sidebar-width-mobile": SIDEBAR_WIDTH_MOBILE
+			},
+			...props,
+			children
+		})
+	});
+});
+SidebarProvider.displayName = "SidebarProvider";
+/** Collapsible sidebar with menu groups, sub-menus, and responsive behavior. */
+const Sidebar = React.forwardRef(({ side = "left", className, children, ...props }, ref) => {
+	const { isMobile, open, openMobile, setOpenMobile } = useSidebar();
+	if (isMobile) return /* @__PURE__ */ jsx(Sheet, {
+		open: openMobile,
+		onOpenChange: setOpenMobile,
+		children: /* @__PURE__ */ jsx(SheetContent, {
+			side,
+			className: "wwc:w-[var(--sidebar-width-mobile)] wwc:p-0",
+			children: /* @__PURE__ */ jsx("div", {
+				className: "wwc:flex wwc:h-full wwc:w-full wwc:flex-col",
+				children
+			})
+		})
+	});
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cn("wwc:group/sidebar wwc:flex wwc:h-full wwc:flex-col wwc:border-r wwc:bg-sidebar wwc:transition-all wwc:duration-200", open ? "wwc:w-[var(--sidebar-width)]" : "wwc:w-0 wwc:overflow-hidden", side === "right" && "wwc:border-l wwc:border-r-0", className),
+		...props,
+		children
+	});
+});
+Sidebar.displayName = "Sidebar";
+const SidebarTrigger = React.forwardRef(({ className, ...props }, ref) => {
+	const { toggleSidebar } = useSidebar();
+	return /* @__PURE__ */ jsxs(Button, {
+		ref,
+		variant: "ghost",
+		icon: true,
+		className,
+		onClick: toggleSidebar,
+		...props,
+		children: [/* @__PURE__ */ jsx(PanelLeft, { className: "wwc:h-4 wwc:w-4" }), /* @__PURE__ */ jsx("span", {
+			className: "wwc:sr-only",
+			children: "Toggle Sidebar"
+		})]
+	});
+});
+SidebarTrigger.displayName = "SidebarTrigger";
+const SidebarHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:flex wwc:h-14 wwc:items-center wwc:border-b wwc:px-4", className),
+	...props
+}));
+SidebarHeader.displayName = "SidebarHeader";
+const SidebarFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:mt-auto wwc:border-t wwc:p-4", className),
+	...props
+}));
+SidebarFooter.displayName = "SidebarFooter";
+const SidebarContent = React.forwardRef(({ className, children }, ref) => /* @__PURE__ */ jsx(ScrollArea, {
+	className: cn("wwc:flex-1", className),
+	children: /* @__PURE__ */ jsx("div", {
+		ref,
+		className: "wwc:p-4",
+		children
+	})
+}));
+SidebarContent.displayName = "SidebarContent";
+const SidebarGroup = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:space-y-4", className),
+	...props
+}));
+SidebarGroup.displayName = "SidebarGroup";
+const SidebarGroupLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:px-2 wwc:text-xs wwc:font-semibold wwc:uppercase wwc:tracking-wider wwc:text-muted-foreground", className),
+	...props
+}));
+SidebarGroupLabel.displayName = "SidebarGroupLabel";
+const SidebarGroupContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:space-y-1", className),
+	...props
+}));
+SidebarGroupContent.displayName = "SidebarGroupContent";
+const SidebarMenu = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("ul", {
+	ref,
+	className: cn("wwc:space-y-1", className),
+	...props
+}));
+SidebarMenu.displayName = "SidebarMenu";
+const SidebarMenuItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("li", {
+	ref,
+	className: cn("", className),
+	...props
+}));
+SidebarMenuItem.displayName = "SidebarMenuItem";
+const SidebarMenuButton = React.forwardRef(({ className, isActive, ...props }, ref) => /* @__PURE__ */ jsx("button", {
+	ref,
+	className: cn("wwc:flex wwc:w-full wwc:items-center wwc:gap-3 wwc:rounded-lg wwc:px-3 wwc:py-2 wwc:text-sm wwc:transition-colors", isActive ? "wwc:bg-sidebar-accent wwc:text-sidebar-accent-foreground" : "wwc:text-sidebar-foreground wwc:hover:bg-sidebar-accent wwc:hover:text-sidebar-accent-foreground", className),
+	...props
+}));
+SidebarMenuButton.displayName = "SidebarMenuButton";
+const SidebarSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Separator, {
+	ref,
+	className: cn("wwc:my-4", className),
+	...props
+}));
+SidebarSeparator.displayName = "SidebarSeparator";
+//#endregion
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem, SidebarProvider, SidebarSeparator, SidebarTrigger, useSidebar };
+
+//# sourceMappingURL=sidebar.mjs.map

package/dist/sidebar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.mjs","names":[],"sources":["../src/sidebar.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport {PanelLeft} from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {Button} from \"./button\";\nimport {ScrollArea} from \"./scroll-area\";\nimport {Separator} from \"./separator\";\nimport {Sheet, SheetContent} from \"./sheet\";\n\nconst SIDEBAR_WIDTH = \"16rem\";\nconst SIDEBAR_WIDTH_MOBILE = \"18rem\";\n\ntype SidebarContext = {\n\topen: boolean;\n\tsetOpen: (open: boolean) => void;\n\topenMobile: boolean;\n\tsetOpenMobile: (open: boolean) => void;\n\tisMobile: boolean;\n\ttoggleSidebar: () => void;\n};\n\nconst SidebarContext = React.createContext<SidebarContext | null>(null);\n\nfunction useSidebar() {\n\tconst context = React.useContext(SidebarContext);\n\tif (!context) {\n\t\tthrow new Error(\"useSidebar must be used within a SidebarProvider.\");\n\t}\n\treturn context;\n}\n\nconst SidebarProvider = React.forwardRef<\n\tHTMLDivElement,\n\tReact.ComponentProps<\"div\"> & {\n\t\tdefaultOpen?: boolean;\n\t}\n>(({defaultOpen = true, className, children, ...props}, ref) => {\n\tconst [open, setOpen] = React.useState(defaultOpen);\n\tconst [openMobile, setOpenMobile] = React.useState(false);\n\tconst [isMobile, setIsMobile] = React.useState(false);\n\n\tReact.useEffect(() => {\n\t\tconst checkMobile = () => setIsMobile(window.innerWidth < 768);\n\t\tcheckMobile();\n\t\twindow.addEventListener(\"resize\", checkMobile);\n\t\treturn () => window.removeEventListener(\"resize\", checkMobile);\n\t}, []);\n\n\tconst toggleSidebar = React.useCallback(() => {\n\t\tif (isMobile) {\n\t\t\tsetOpenMobile((prev) => !prev);\n\t\t} else {\n\t\t\tsetOpen((prev) => !prev);\n\t\t}\n\t}, [isMobile]);\n\n\treturn (\n\t\t<SidebarContext.Provider\n\t\t\tvalue={{\n\t\t\t\topen,\n\t\t\t\tsetOpen,\n\t\t\t\topenMobile,\n\t\t\t\tsetOpenMobile,\n\t\t\t\tisMobile,\n\t\t\t\ttoggleSidebar,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\"wwc:flex wwc:min-h-svh wwc:w-full\", className)}\n\t\t\t\tstyle={\n\t\t\t\t\t{\n\t\t\t\t\t\t\"--sidebar-width\": SIDEBAR_WIDTH,\n\t\t\t\t\t\t\"--sidebar-width-mobile\": SIDEBAR_WIDTH_MOBILE,\n\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</SidebarContext.Provider>\n\t);\n});\nSidebarProvider.displayName = \"SidebarProvider\";\n\n/** Collapsible sidebar with menu groups, sub-menus, and responsive behavior. */\nconst Sidebar = React.forwardRef<\n\tHTMLDivElement,\n\tReact.ComponentProps<\"div\"> & {\n\t\tside?: \"left\" | \"right\";\n\t}\n>(({side = \"left\", className, children, ...props}, ref) => {\n\tconst {isMobile, open, openMobile, setOpenMobile} = useSidebar();\n\n\tif (isMobile) {\n\t\treturn (\n\t\t\t<Sheet open={openMobile} onOpenChange={setOpenMobile}>\n\t\t\t\t<SheetContent side={side} className=\"wwc:w-[var(--sidebar-width-mobile)] wwc:p-0\">\n\t\t\t\t\t<div className=\"wwc:flex wwc:h-full wwc:w-full wwc:flex-col\">{children}</div>\n\t\t\t\t</SheetContent>\n\t\t\t</Sheet>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"wwc:group/sidebar wwc:flex wwc:h-full wwc:flex-col wwc:border-r wwc:bg-sidebar wwc:transition-all wwc:duration-200\",\n\t\t\t\topen ? \"wwc:w-[var(--sidebar-width)]\" : \"wwc:w-0 wwc:overflow-hidden\",\n\t\t\t\tside === \"right\" && \"wwc:border-l wwc:border-r-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n});\nSidebar.displayName = \"Sidebar\";\n\nconst SidebarTrigger = React.forwardRef<React.ElementRef<typeof Button>, React.ComponentProps<typeof Button>>(\n\t({className, ...props}, ref) => {\n\t\tconst {toggleSidebar} = useSidebar();\n\n\t\treturn (\n\t\t\t<Button ref={ref} variant=\"ghost\" icon className={className} onClick={toggleSidebar} {...props}>\n\t\t\t\t<PanelLeft className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t<span className=\"wwc:sr-only\">Toggle Sidebar</span>\n\t\t\t</Button>\n\t\t);\n\t},\n);\nSidebarTrigger.displayName = \"SidebarTrigger\";\n\nconst SidebarHeader = React.forwardRef<HTMLDivElement, React.ComponentProps<\"div\">>(({className, ...props}, ref) => (\n\t<div ref={ref} className={cn(\"wwc:flex wwc:h-14 wwc:items-center wwc:border-b wwc:px-4\", className)} {...props} />\n));\nSidebarHeader.displayName = \"SidebarHeader\";\n\nconst SidebarFooter = React.forwardRef<HTMLDivElement, React.ComponentProps<\"div\">>(({className, ...props}, ref) => (\n\t<div ref={ref} className={cn(\"wwc:mt-auto wwc:border-t wwc:p-4\", className)} {...props} />\n));\nSidebarFooter.displayName = \"SidebarFooter\";\n\nconst SidebarContent = React.forwardRef<HTMLDivElement, React.ComponentProps<\"div\">>(({className, children}, ref) => (\n\t<ScrollArea className={cn(\"wwc:flex-1\", className)}>\n\t\t<div ref={ref} className=\"wwc:p-4\">\n\t\t\t{children}\n\t\t</div>\n\t</ScrollArea>\n));\nSidebarContent.displayName = \"SidebarContent\";\n\nconst SidebarGroup = React.forwardRef<HTMLDivElement, React.ComponentProps<\"div\">>(({className, ...props}, ref) => (\n\t<div ref={ref} className={cn(\"wwc:space-y-4\", className)} {...props} />\n));\nSidebarGroup.displayName = \"SidebarGroup\";\n\nconst SidebarGroupLabel = React.forwardRef<HTMLDivElement, React.ComponentProps<\"div\">>(\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:px-2 wwc:text-xs wwc:font-semibold wwc:uppercase wwc:tracking-wider wwc:text-muted-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nSidebarGroupLabel.displayName = \"SidebarGroupLabel\";\n\nconst SidebarGroupContent = React.forwardRef<HTMLDivElement, React.ComponentProps<\"div\">>(\n\t({className, ...props}, ref) => <div ref={ref} className={cn(\"wwc:space-y-1\", className)} {...props} />,\n);\nSidebarGroupContent.displayName = \"SidebarGroupContent\";\n\nconst SidebarMenu = React.forwardRef<HTMLUListElement, React.ComponentProps<\"ul\">>(({className, ...props}, ref) => (\n\t<ul ref={ref} className={cn(\"wwc:space-y-1\", className)} {...props} />\n));\nSidebarMenu.displayName = \"SidebarMenu\";\n\nconst SidebarMenuItem = React.forwardRef<HTMLLIElement, React.ComponentProps<\"li\">>(({className, ...props}, ref) => (\n\t<li ref={ref} className={cn(\"\", className)} {...props} />\n));\nSidebarMenuItem.displayName = \"SidebarMenuItem\";\n\nconst SidebarMenuButton = React.forwardRef<\n\tHTMLButtonElement,\n\tReact.ComponentProps<\"button\"> & {\n\t\tisActive?: boolean;\n\t}\n>(({className, isActive, ...props}, ref) => (\n\t<button\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"wwc:flex wwc:w-full wwc:items-center wwc:gap-3 wwc:rounded-lg wwc:px-3 wwc:py-2 wwc:text-sm wwc:transition-colors\",\n\t\t\tisActive\n\t\t\t\t? \"wwc:bg-sidebar-accent wwc:text-sidebar-accent-foreground\"\n\t\t\t\t: \"wwc:text-sidebar-foreground wwc:hover:bg-sidebar-accent wwc:hover:text-sidebar-accent-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nSidebarMenuButton.displayName = \"SidebarMenuButton\";\n\nconst SidebarSeparator = React.forwardRef<React.ElementRef<typeof Separator>, React.ComponentProps<typeof Separator>>(\n\t({className, ...props}, ref) => <Separator ref={ref} className={cn(\"wwc:my-4\", className)} {...props} />,\n);\nSidebarSeparator.displayName = \"SidebarSeparator\";\n\nexport {\n\tSidebar,\n\tSidebarContent,\n\tSidebarFooter,\n\tSidebarGroup,\n\tSidebarGroupContent,\n\tSidebarGroupLabel,\n\tSidebarHeader,\n\tSidebarMenu,\n\tSidebarMenuButton,\n\tSidebarMenuItem,\n\tSidebarProvider,\n\tSidebarSeparator,\n\tSidebarTrigger,\n\tuseSidebar,\n};\n"],"mappings":"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"}

package/dist/single-house-view.d.mts

@@ -0,0 +1,13 @@
+import * as React from "react";
+//#region src/single-house-view.d.ts
+export interface SingleHouseViewProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Floor id to isolate on first render (e.g. "l01"); `null` shows the whole building. */
+  initialFloorId?: string | null;
+  /** Fired once the streaming loading veil settles and the model is ready. */
+  onSettled?: () => void;
+}
+/** Single-building fragment viewer: an isolatable 3D house model stage beside a floor rail of levels with status and progress. */
+declare const SingleHouseView: React.ForwardRefExoticComponent<SingleHouseViewProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { SingleHouseView };
+//# sourceMappingURL=single-house-view.d.mts.map

package/dist/single-house-view.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"single-house-view.d.mts","names":[],"sources":["../src/single-house-view.tsx"],"mappings":";;iBAkYiB,6BAA6B,MAAM,eAAe;;EAElE;;EAEA;;;cAIK,iBAAe,MAAA,0BAAA,uBAAA,MAAA,cAAA"}