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

package/dist/breadcrumb.mjs

@@ -0,0 +1,95 @@
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "./dropdown-menu.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Slot } from "@radix-ui/react-slot";
+//#region src/breadcrumb.tsx
+/** Displays the path to the current resource using a hierarchy of links. */
+const Breadcrumb = React.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("nav", {
+	ref,
+	"aria-label": "breadcrumb",
+	...props
+}));
+Breadcrumb.displayName = "Breadcrumb";
+const BreadcrumbList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("ol", {
+	ref,
+	className: cn("wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-1.5 wwc:break-words wwc:text-sm wwc:text-muted-foreground wwc:sm:gap-2.5", className),
+	...props
+}));
+BreadcrumbList.displayName = "BreadcrumbList";
+const BreadcrumbItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("li", {
+	ref,
+	className: cn("wwc:inline-flex wwc:items-center wwc:gap-1.5", className),
+	...props
+}));
+BreadcrumbItem.displayName = "BreadcrumbItem";
+const BreadcrumbLink = React.forwardRef(({ asChild, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx(asChild ? Slot : "a", {
+		ref,
+		className: cn("wwc:transition-colors wwc:hover:text-foreground", className),
+		...props
+	});
+});
+BreadcrumbLink.displayName = "BreadcrumbLink";
+const BreadcrumbPage = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("span", {
+	ref,
+	role: "link",
+	"aria-disabled": "true",
+	"aria-current": "page",
+	className: cn("wwc:font-normal wwc:text-foreground", className),
+	...props
+}));
+BreadcrumbPage.displayName = "BreadcrumbPage";
+const BreadcrumbSeparator = ({ children, className, ...props }) => /* @__PURE__ */ jsx("li", {
+	role: "presentation",
+	"aria-hidden": "true",
+	className: cn("wwc:[&>svg]:w-3.5 wwc:[&>svg]:h-3.5", className),
+	...props,
+	children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
+});
+BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
+/**
+* The "…" between breadcrumbs. Pass `items` (the collapsed middle levels) to make it an
+* interactive dropdown — clicking it opens a menu of those levels (built on the same `DropdownMenu`
+* the toolbar action menus use). Without `items` it renders a static, decorative ellipsis.
+*/
+const BreadcrumbEllipsis = ({ className, items, ...props }) => {
+	if (!items || items.length === 0) return /* @__PURE__ */ jsxs("span", {
+		role: "presentation",
+		"aria-hidden": "true",
+		className: cn("wwc:flex wwc:h-9 wwc:w-9 wwc:items-center wwc:justify-center", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(MoreHorizontal, { className: "wwc:h-4 wwc:w-4" }), /* @__PURE__ */ jsx("span", {
+			className: "wwc:sr-only",
+			children: "More"
+		})]
+	});
+	return /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsxs(DropdownMenuTrigger, {
+		"aria-label": "Show collapsed breadcrumbs",
+		className: cn("wwc:flex wwc:h-9 wwc:w-9 wwc:items-center wwc:justify-center wwc:rounded-sm wwc:transition-colors wwc:hover:text-foreground wwc:focus-visible:outline-none wwc:focus-visible:ring-1 wwc:focus-visible:ring-ring wwc:data-[state=open]:text-foreground", className),
+		children: [/* @__PURE__ */ jsx(MoreHorizontal, { className: "wwc:h-4 wwc:w-4" }), /* @__PURE__ */ jsx("span", {
+			className: "wwc:sr-only",
+			children: "More"
+		})]
+	}), /* @__PURE__ */ jsx(DropdownMenuContent, {
+		align: "start",
+		children: items.map((item, index) => item.href ? /* @__PURE__ */ jsx(DropdownMenuItem, {
+			asChild: true,
+			disabled: item.disabled,
+			children: /* @__PURE__ */ jsx("a", {
+				href: item.href,
+				children: item.label
+			})
+		}, index) : /* @__PURE__ */ jsx(DropdownMenuItem, {
+			disabled: item.disabled,
+			onSelect: item.onSelect,
+			children: item.label
+		}, index))
+	})] });
+};
+BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
+//#endregion
+export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };
+
+//# sourceMappingURL=breadcrumb.mjs.map

package/dist/breadcrumb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.mjs","names":[],"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport {Slot} from \"@radix-ui/react-slot\";\nimport {ChevronRight, MoreHorizontal} from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger} from \"./dropdown-menu\";\n\n/** Displays the path to the current resource using a hierarchy of links. */\nconst Breadcrumb = React.forwardRef<\n\tHTMLElement,\n\tReact.ComponentPropsWithoutRef<\"nav\"> & {\n\t\tseparator?: React.ReactNode;\n\t}\n>(({...props}, ref) => <nav ref={ref} aria-label=\"breadcrumb\" {...props} />);\nBreadcrumb.displayName = \"Breadcrumb\";\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<\"ol\">>(\n\t({className, ...props}, ref) => (\n\t\t<ol\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-1.5 wwc:break-words wwc:text-sm wwc:text-muted-foreground wwc:sm:gap-2.5\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nBreadcrumbList.displayName = \"BreadcrumbList\";\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<\"li\">>(\n\t({className, ...props}, ref) => (\n\t\t<li ref={ref} className={cn(\"wwc:inline-flex wwc:items-center wwc:gap-1.5\", className)} {...props} />\n\t),\n);\nBreadcrumbItem.displayName = \"BreadcrumbItem\";\n\nconst BreadcrumbLink = React.forwardRef<\n\tHTMLAnchorElement,\n\tReact.ComponentPropsWithoutRef<\"a\"> & {\n\t\tasChild?: boolean;\n\t}\n>(({asChild, className, ...props}, ref) => {\n\tconst Comp = asChild ? Slot : \"a\";\n\n\treturn <Comp ref={ref} className={cn(\"wwc:transition-colors wwc:hover:text-foreground\", className)} {...props} />;\n});\nBreadcrumbLink.displayName = \"BreadcrumbLink\";\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<\"span\">>(\n\t({className, ...props}, ref) => (\n\t\t<span\n\t\t\tref={ref}\n\t\t\trole=\"link\"\n\t\t\taria-disabled=\"true\"\n\t\t\taria-current=\"page\"\n\t\t\tclassName={cn(\"wwc:font-normal wwc:text-foreground\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nBreadcrumbPage.displayName = \"BreadcrumbPage\";\n\nconst BreadcrumbSeparator = ({children, className, ...props}: React.ComponentProps<\"li\">) => (\n\t<li\n\t\trole=\"presentation\"\n\t\taria-hidden=\"true\"\n\t\tclassName={cn(\"wwc:[&>svg]:w-3.5 wwc:[&>svg]:h-3.5\", className)}\n\t\t{...props}\n\t>\n\t\t{children ?? <ChevronRight />}\n\t</li>\n);\nBreadcrumbSeparator.displayName = \"BreadcrumbSeparator\";\n\n/** A collapsed breadcrumb level shown inside the ellipsis dropdown. */\nexport interface BreadcrumbMenuItem {\n\tlabel: React.ReactNode;\n\t/** Renders the item as a link. */\n\thref?: string;\n\t/** Called when the item is chosen (e.g. for client-side routing). */\n\tonSelect?: () => void;\n\tdisabled?: boolean;\n}\n\n/**\n * The \"…\" between breadcrumbs. Pass `items` (the collapsed middle levels) to make it an\n * interactive dropdown — clicking it opens a menu of those levels (built on the same `DropdownMenu`\n * the toolbar action menus use). Without `items` it renders a static, decorative ellipsis.\n */\nconst BreadcrumbEllipsis = ({\n\tclassName,\n\titems,\n\t...props\n}: React.ComponentProps<\"span\"> & {items?: BreadcrumbMenuItem[]}) => {\n\tif (!items || items.length === 0) {\n\t\treturn (\n\t\t\t<span\n\t\t\t\trole=\"presentation\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tclassName={cn(\"wwc:flex wwc:h-9 wwc:w-9 wwc:items-center wwc:justify-center\", className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<MoreHorizontal className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t<span className=\"wwc:sr-only\">More</span>\n\t\t\t</span>\n\t\t);\n\t}\n\n\treturn (\n\t\t<DropdownMenu>\n\t\t\t<DropdownMenuTrigger\n\t\t\t\taria-label=\"Show collapsed breadcrumbs\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:flex wwc:h-9 wwc:w-9 wwc:items-center wwc:justify-center wwc:rounded-sm wwc:transition-colors wwc:hover:text-foreground wwc:focus-visible:outline-none wwc:focus-visible:ring-1 wwc:focus-visible:ring-ring wwc:data-[state=open]:text-foreground\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<MoreHorizontal className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t<span className=\"wwc:sr-only\">More</span>\n\t\t\t</DropdownMenuTrigger>\n\t\t\t<DropdownMenuContent align=\"start\">\n\t\t\t\t{items.map((item, index) =>\n\t\t\t\t\titem.href ? (\n\t\t\t\t\t\t<DropdownMenuItem key={index} asChild disabled={item.disabled}>\n\t\t\t\t\t\t\t<a href={item.href}>{item.label}</a>\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<DropdownMenuItem key={index} disabled={item.disabled} onSelect={item.onSelect}>\n\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t),\n\t\t\t\t)}\n\t\t\t</DropdownMenuContent>\n\t\t</DropdownMenu>\n\t);\n};\nBreadcrumbEllipsis.displayName = \"BreadcrumbEllipsis\";\n\nexport {\n\tBreadcrumb,\n\tBreadcrumbList,\n\tBreadcrumbItem,\n\tBreadcrumbLink,\n\tBreadcrumbPage,\n\tBreadcrumbSeparator,\n\tBreadcrumbEllipsis,\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,aAAa,MAAM,YAKtB,EAAC,GAAG,SAAQ,QAAQ,oBAAC,OAAD;CAAU;CAAK,cAAW;CAAa,GAAI;AAAQ,CAAA,CAAC;AAC3E,WAAW,cAAc;AAEzB,MAAM,iBAAiB,MAAM,YAC3B,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,MAAD;CACM;CACL,WAAW,GACV,4HACA,SACD;CACA,GAAI;AACJ,CAAA,CAEH;AACA,eAAe,cAAc;AAE7B,MAAM,iBAAiB,MAAM,YAC3B,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,MAAD;CAAS;CAAK,WAAW,GAAG,gDAAgD,SAAS;CAAG,GAAI;AAAQ,CAAA,CAEtG;AACA,eAAe,cAAc;AAE7B,MAAM,iBAAiB,MAAM,YAK1B,EAAC,SAAS,WAAW,GAAG,SAAQ,QAAQ;CAG1C,OAAO,oBAFM,UAAU,OAAO,KAEvB;EAAW;EAAK,WAAW,GAAG,mDAAmD,SAAS;EAAG,GAAI;CAAQ,CAAA;AACjH,CAAC;AACD,eAAe,cAAc;AAE7B,MAAM,iBAAiB,MAAM,YAC3B,EAAC,WAAW,GAAG,SAAQ,QACvB,oBAAC,QAAD;CACM;CACL,MAAK;CACL,iBAAc;CACd,gBAAa;CACb,WAAW,GAAG,uCAAuC,SAAS;CAC9D,GAAI;AACJ,CAAA,CAEH;AACA,eAAe,cAAc;AAE7B,MAAM,uBAAuB,EAAC,UAAU,WAAW,GAAG,YACrD,oBAAC,MAAD;CACC,MAAK;CACL,eAAY;CACZ,WAAW,GAAG,uCAAuC,SAAS;CAC9D,GAAI;CAEH,UAAA,YAAY,oBAAC,cAAD,CAAe,CAAA;AACzB,CAAA;AAEL,oBAAoB,cAAc;;;;;;AAiBlC,MAAM,sBAAsB,EAC3B,WACA,OACA,GAAG,YACiE;CACpE,IAAI,CAAC,SAAS,MAAM,WAAW,GAC9B,OACC,qBAAC,QAAD;EACC,MAAK;EACL,eAAY;EACZ,WAAW,GAAG,gEAAgE,SAAS;EACvF,GAAI;EAJL,UAAA,CAMC,oBAAC,gBAAD,EAAgB,WAAU,kBAAmB,CAAA,GAC7C,oBAAC,QAAD;GAAM,WAAU;GAAc,UAAA;EAAU,CAAA,CACnC;;CAIR,OACC,qBAAC,cAAD,EAAA,UAAA,CACC,qBAAC,qBAAD;EACC,cAAW;EACX,WAAW,GACV,yPACA,SACD;EALD,UAAA,CAOC,oBAAC,gBAAD,EAAgB,WAAU,kBAAmB,CAAA,GAC7C,oBAAC,QAAD;GAAM,WAAU;GAAc,UAAA;EAAU,CAAA,CACpB;CACrB,CAAA,GAAA,oBAAC,qBAAD;EAAqB,OAAM;EACzB,UAAA,MAAM,KAAK,MAAM,UACjB,KAAK,OACJ,oBAAC,kBAAD;GAA8B,SAAA;GAAQ,UAAU,KAAK;GACpD,UAAA,oBAAC,KAAD;IAAG,MAAM,KAAK;IAAO,UAAA,KAAK;GAAS,CAAA;EAClB,GAFK,KAEL,IAElB,oBAAC,kBAAD;GAA8B,UAAU,KAAK;GAAU,UAAU,KAAK;GACpE,UAAA,KAAK;EACW,GAFK,KAEL,CAEpB;CACoB,CAAA,CACR,EAAA,CAAA;AAEhB;AACA,mBAAmB,cAAc"}

package/dist/breadcrumbs.d.mts

@@ -0,0 +1,2 @@
+import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbMenuItem, BreadcrumbPage, BreadcrumbSeparator } from "./breadcrumb.mjs";
+export { Breadcrumb as Breadcrumbs, BreadcrumbEllipsis as BreadcrumbsEllipsis, BreadcrumbItem as BreadcrumbsItem, BreadcrumbLink as BreadcrumbsLink, BreadcrumbList as BreadcrumbsList, type BreadcrumbMenuItem as BreadcrumbsMenuItem, BreadcrumbPage as BreadcrumbsPage, BreadcrumbSeparator as BreadcrumbsSeparator };

package/dist/breadcrumbs.mjs

@@ -0,0 +1,2 @@
+import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "./breadcrumb.mjs";
+export { Breadcrumb as Breadcrumbs, BreadcrumbEllipsis as BreadcrumbsEllipsis, BreadcrumbItem as BreadcrumbsItem, BreadcrumbLink as BreadcrumbsLink, BreadcrumbList as BreadcrumbsList, BreadcrumbPage as BreadcrumbsPage, BreadcrumbSeparator as BreadcrumbsSeparator };

package/dist/browser-tabs.d.mts

@@ -0,0 +1,40 @@
+import * as React from "react";
+//#region src/browser-tabs.d.ts
+export type BrowserTabItem = {
+  id: string;
+  label: string;
+  icon?: React.ReactNode;
+  disabled?: boolean;
+};
+export interface BrowserTabsProps extends React.HTMLAttributes<HTMLDivElement> {
+  tabs: BrowserTabItem[];
+  activeId?: string;
+  onActiveChange?: (id: string) => void;
+  onTabClose?: (id: string) => void;
+  closeable?: boolean;
+  trailing?: React.ReactNode;
+  /**
+   * Enable horizontal drag-to-reorder (browser-style). Fires with the full tab-id list in its new
+   * order every time the dragged tab crosses another. Omit to keep tabs fixed.
+   */
+  onReorder?: (orderedIds: string[]) => void;
+}
+interface BrowserTabProps {
+  tab: BrowserTabItem;
+  active: boolean;
+  closeable: boolean;
+  onSelect: () => void;
+  onClose?: () => void;
+  draggable?: boolean;
+  dragging?: boolean;
+  onDragStart?: React.DragEventHandler<HTMLDivElement>;
+  onDragEnter?: React.DragEventHandler<HTMLDivElement>;
+  onDragOver?: React.DragEventHandler<HTMLDivElement>;
+  onDrop?: React.DragEventHandler<HTMLDivElement>;
+  onDragEnd?: React.DragEventHandler<HTMLDivElement>;
+}
+declare const BrowserTab: React.ForwardRefExoticComponent<BrowserTabProps & React.RefAttributes<HTMLDivElement>>;
+declare const BrowserTabs: React.ForwardRefExoticComponent<BrowserTabsProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { BrowserTab, BrowserTabs };
+//# sourceMappingURL=browser-tabs.d.mts.map

package/dist/browser-tabs.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser-tabs.d.mts","names":[],"sources":["../src/browser-tabs.tsx"],"mappings":";;YAIY;EACX;EACA;EACA,OAAO,MAAM;EACb;;iBAGgB,yBAAyB,MAAM,eAAe;EAC9D,MAAM;EACN;EACA,kBAAkB;EAClB,cAAc;EACd;EACA,WAAW,MAAM;;;;;EAKjB,aAAa;;UAiBJ;EACT,KAAK;EACL;EACA;EACA;EACA;EACA;EACA;EACA,cAAc,MAAM,iBAAiB;EACrC,cAAc,MAAM,iBAAiB;EACrC,aAAa,MAAM,iBAAiB;EACpC,SAAS,MAAM,iBAAiB;EAChC,YAAY,MAAM,iBAAiB;;cAG9B,YAAU,MAAA,0BAAA,kBAAA,MAAA,cAAA;cAuEV,aAAW,MAAA,0BAAA,mBAAA,MAAA,cAAA"}

package/dist/browser-tabs.mjs

@@ -0,0 +1,127 @@
+import { cn } from "@corensystem/coren-utils";
+import { X } from "lucide-react";
+import * as React from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/browser-tabs.tsx
+const cornerMaskLeft = {
+	WebkitMaskImage: "radial-gradient(circle 12px at top left, transparent 12px, black 12px)",
+	maskImage: "radial-gradient(circle 12px at top left, transparent 12px, black 12px)"
+};
+const cornerMaskRight = {
+	WebkitMaskImage: "radial-gradient(circle 12px at top right, transparent 12px, black 12px)",
+	maskImage: "radial-gradient(circle 12px at top right, transparent 12px, black 12px)"
+};
+const BrowserTab = React.forwardRef(({ tab, active, closeable, onSelect, onClose, draggable, dragging, ...dragHandlers }, ref) => {
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		role: "tab",
+		"aria-selected": active,
+		"aria-disabled": tab.disabled || void 0,
+		tabIndex: tab.disabled ? -1 : 0,
+		draggable,
+		...dragHandlers,
+		className: cn("wwc:relative wwc:flex wwc:h-9 wwc:min-w-0 wwc:max-w-[240px] wwc:items-center wwc:gap-2 wwc:rounded-t-lg wwc:px-3 wwc:text-sm wwc:transition-colors wwc:select-none wwc:focus-visible:outline-none wwc:focus-visible:ring-2 wwc:focus-visible:ring-ring", active ? "wwc:z-10 wwc:bg-card wwc:text-foreground wwc:font-medium" : "wwc:bg-background/60 wwc:text-muted-foreground wwc:hover:bg-muted wwc:hover:text-foreground wwc:cursor-pointer", draggable && "wwc:cursor-grab wwc:active:cursor-grabbing", dragging && "wwc:opacity-40", tab.disabled && "wwc:opacity-50 wwc:pointer-events-none"),
+		onClick: () => {
+			if (tab.disabled || active) return;
+			onSelect();
+		},
+		onKeyDown: (e) => {
+			if (tab.disabled || active) return;
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				onSelect();
+			}
+		},
+		children: [
+			tab.icon && /* @__PURE__ */ jsx("span", {
+				className: "wwc:flex wwc:h-3.5 wwc:w-3.5 wwc:shrink-0 wwc:items-center wwc:justify-center",
+				children: tab.icon
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "wwc:truncate",
+				children: tab.label
+			}),
+			closeable && onClose && !tab.disabled && /* @__PURE__ */ jsx("button", {
+				type: "button",
+				"aria-label": `Close ${tab.label}`,
+				onClick: (e) => {
+					e.stopPropagation();
+					onClose();
+				},
+				className: "wwc:ml-1 wwc:grid wwc:shrink-0 wwc:place-items-center wwc:rounded wwc:p-0.5 wwc:text-muted-foreground wwc:hover:bg-destructive/10 wwc:hover:text-destructive wwc:focus-visible:outline-none wwc:focus-visible:ring-1 wwc:focus-visible:ring-ring",
+				children: /* @__PURE__ */ jsx(X, { className: "wwc:h-3 wwc:w-3" })
+			}),
+			active && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				className: "wwc:pointer-events-none wwc:absolute wwc:-left-3 wwc:bottom-0 wwc:h-3 wwc:w-3 wwc:bg-card",
+				style: cornerMaskLeft
+			}), /* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				className: "wwc:pointer-events-none wwc:absolute wwc:-right-3 wwc:bottom-0 wwc:h-3 wwc:w-3 wwc:bg-card",
+				style: cornerMaskRight
+			})] })
+		]
+	});
+});
+BrowserTab.displayName = "BrowserTab";
+const BrowserTabs = React.forwardRef(({ tabs, activeId, onActiveChange, onTabClose, closeable = false, trailing, onReorder, className, ...rest }, ref) => {
+	const isControlled = activeId !== void 0;
+	const [internalActive, setInternalActive] = React.useState(() => tabs[0]?.id);
+	const resolvedActive = isControlled ? activeId : internalActive;
+	const [dragId, setDragId] = React.useState(null);
+	const reorderable = typeof onReorder === "function";
+	const handleSelect = (id) => {
+		if (!isControlled) setInternalActive(id);
+		onActiveChange?.(id);
+	};
+	const handleDragStart = (event, id) => {
+		setDragId(id);
+		if (event.dataTransfer) {
+			event.dataTransfer.effectAllowed = "move";
+			try {
+				event.dataTransfer.setData("text/plain", id);
+			} catch {}
+		}
+	};
+	const handleDragOverTab = (event, overId) => {
+		if (!reorderable || dragId === null) return;
+		event.preventDefault();
+		if (event.dataTransfer) event.dataTransfer.dropEffect = "move";
+		if (overId === dragId) return;
+		const ids = tabs.map((tab) => tab.id);
+		const from = ids.indexOf(dragId);
+		const to = ids.indexOf(overId);
+		if (from === -1 || to === -1) return;
+		ids.splice(from, 1);
+		ids.splice(to, 0, dragId);
+		onReorder?.(ids);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		role: "tablist",
+		className: cn("wwc:relative wwc:flex wwc:items-end wwc:gap-1 wwc:bg-muted wwc:px-2 wwc:pt-2", className),
+		...rest,
+		children: [tabs.map((tab) => /* @__PURE__ */ jsx(BrowserTab, {
+			tab,
+			active: tab.id === resolvedActive,
+			closeable,
+			onSelect: () => handleSelect(tab.id),
+			onClose: onTabClose ? () => onTabClose(tab.id) : void 0,
+			draggable: reorderable && !tab.disabled,
+			dragging: dragId === tab.id,
+			onDragStart: reorderable ? (event) => handleDragStart(event, tab.id) : void 0,
+			onDragEnter: reorderable ? (event) => event.preventDefault() : void 0,
+			onDragOver: reorderable ? (event) => handleDragOverTab(event, tab.id) : void 0,
+			onDrop: reorderable ? (event) => event.preventDefault() : void 0,
+			onDragEnd: reorderable ? () => setDragId(null) : void 0
+		}, tab.id)), trailing && /* @__PURE__ */ jsx("div", {
+			className: "wwc:ml-auto wwc:flex wwc:shrink-0 wwc:items-center",
+			children: trailing
+		})]
+	});
+});
+BrowserTabs.displayName = "BrowserTabs";
+//#endregion
+export { BrowserTab, BrowserTabs };
+
+//# sourceMappingURL=browser-tabs.mjs.map

package/dist/browser-tabs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser-tabs.mjs","names":[],"sources":["../src/browser-tabs.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport {X} from \"lucide-react\";\nimport * as React from \"react\";\n\nexport type BrowserTabItem = {\n\tid: string;\n\tlabel: string;\n\ticon?: React.ReactNode;\n\tdisabled?: boolean;\n};\n\nexport interface BrowserTabsProps extends React.HTMLAttributes<HTMLDivElement> {\n\ttabs: BrowserTabItem[];\n\tactiveId?: string;\n\tonActiveChange?: (id: string) => void;\n\tonTabClose?: (id: string) => void;\n\tcloseable?: boolean;\n\ttrailing?: React.ReactNode;\n\t/**\n\t * Enable horizontal drag-to-reorder (browser-style). Fires with the full tab-id list in its new\n\t * order every time the dragged tab crosses another. Omit to keep tabs fixed.\n\t */\n\tonReorder?: (orderedIds: string[]) => void;\n}\n\n// Mask carves a quarter-circle out of a 12x12 square so only an L-shaped sliver of\n// `bg-background` remains, merging the active tab's bottom corner into the panel\n// below — without the inline `boxShadow` + `var(--background)` trick that fails in\n// Firefox/Safari.\nconst cornerMaskLeft: React.CSSProperties = {\n\tWebkitMaskImage: \"radial-gradient(circle 12px at top left, transparent 12px, black 12px)\",\n\tmaskImage: \"radial-gradient(circle 12px at top left, transparent 12px, black 12px)\",\n};\n\nconst cornerMaskRight: React.CSSProperties = {\n\tWebkitMaskImage: \"radial-gradient(circle 12px at top right, transparent 12px, black 12px)\",\n\tmaskImage: \"radial-gradient(circle 12px at top right, transparent 12px, black 12px)\",\n};\n\ninterface BrowserTabProps {\n\ttab: BrowserTabItem;\n\tactive: boolean;\n\tcloseable: boolean;\n\tonSelect: () => void;\n\tonClose?: () => void;\n\tdraggable?: boolean;\n\tdragging?: boolean;\n\tonDragStart?: React.DragEventHandler<HTMLDivElement>;\n\tonDragEnter?: React.DragEventHandler<HTMLDivElement>;\n\tonDragOver?: React.DragEventHandler<HTMLDivElement>;\n\tonDrop?: React.DragEventHandler<HTMLDivElement>;\n\tonDragEnd?: React.DragEventHandler<HTMLDivElement>;\n}\n\nconst BrowserTab = React.forwardRef<HTMLDivElement, BrowserTabProps>(\n\t({tab, active, closeable, onSelect, onClose, draggable, dragging, ...dragHandlers}, ref) => {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\trole=\"tab\"\n\t\t\t\taria-selected={active}\n\t\t\t\taria-disabled={tab.disabled || undefined}\n\t\t\t\ttabIndex={tab.disabled ? -1 : 0}\n\t\t\t\tdraggable={draggable}\n\t\t\t\t{...dragHandlers}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:relative wwc:flex wwc:h-9 wwc:min-w-0 wwc:max-w-[240px] wwc:items-center wwc:gap-2 wwc:rounded-t-lg wwc:px-3 wwc:text-sm wwc:transition-colors wwc:select-none wwc:focus-visible:outline-none wwc:focus-visible:ring-2 wwc:focus-visible:ring-ring\",\n\t\t\t\t\tactive\n\t\t\t\t\t\t? \"wwc:z-10 wwc:bg-card wwc:text-foreground wwc:font-medium\"\n\t\t\t\t\t\t: \"wwc:bg-background/60 wwc:text-muted-foreground wwc:hover:bg-muted wwc:hover:text-foreground wwc:cursor-pointer\",\n\t\t\t\t\tdraggable && \"wwc:cursor-grab wwc:active:cursor-grabbing\",\n\t\t\t\t\tdragging && \"wwc:opacity-40\",\n\t\t\t\t\ttab.disabled && \"wwc:opacity-50 wwc:pointer-events-none\",\n\t\t\t\t)}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (tab.disabled || active) return;\n\t\t\t\t\tonSelect();\n\t\t\t\t}}\n\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\tif (tab.disabled || active) return;\n\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tonSelect();\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{tab.icon && (\n\t\t\t\t\t<span className=\"wwc:flex wwc:h-3.5 wwc:w-3.5 wwc:shrink-0 wwc:items-center wwc:justify-center\">\n\t\t\t\t\t\t{tab.icon}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<span className=\"wwc:truncate\">{tab.label}</span>\n\t\t\t\t{closeable && onClose && !tab.disabled && (\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\taria-label={`Close ${tab.label}`}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tclassName=\"wwc:ml-1 wwc:grid wwc:shrink-0 wwc:place-items-center wwc:rounded wwc:p-0.5 wwc:text-muted-foreground wwc:hover:bg-destructive/10 wwc:hover:text-destructive wwc:focus-visible:outline-none wwc:focus-visible:ring-1 wwc:focus-visible:ring-ring\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<X className=\"wwc:h-3 wwc:w-3\" />\n\t\t\t\t\t</button>\n\t\t\t\t)}\n\t\t\t\t{active && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\tclassName=\"wwc:pointer-events-none wwc:absolute wwc:-left-3 wwc:bottom-0 wwc:h-3 wwc:w-3 wwc:bg-card\"\n\t\t\t\t\t\t\tstyle={cornerMaskLeft}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\tclassName=\"wwc:pointer-events-none wwc:absolute wwc:-right-3 wwc:bottom-0 wwc:h-3 wwc:w-3 wwc:bg-card\"\n\t\t\t\t\t\t\tstyle={cornerMaskRight}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t},\n);\nBrowserTab.displayName = \"BrowserTab\";\n\nconst BrowserTabs = React.forwardRef<HTMLDivElement, BrowserTabsProps>(\n\t({tabs, activeId, onActiveChange, onTabClose, closeable = false, trailing, onReorder, className, ...rest}, ref) => {\n\t\tconst isControlled = activeId !== undefined;\n\t\tconst [internalActive, setInternalActive] = React.useState<string | undefined>(() => tabs[0]?.id);\n\t\tconst resolvedActive = isControlled ? activeId : internalActive;\n\t\tconst [dragId, setDragId] = React.useState<string | null>(null);\n\t\tconst reorderable = typeof onReorder === \"function\";\n\n\t\tconst handleSelect = (id: string) => {\n\t\t\tif (!isControlled) setInternalActive(id);\n\t\t\tonActiveChange?.(id);\n\t\t};\n\n\t\tconst handleDragStart = (event: React.DragEvent, id: string) => {\n\t\t\tsetDragId(id);\n\t\t\tif (event.dataTransfer) {\n\t\t\t\tevent.dataTransfer.effectAllowed = \"move\";\n\t\t\t\t// Some browsers require data to be set for the drag to begin.\n\t\t\t\ttry {\n\t\t\t\t\tevent.dataTransfer.setData(\"text/plain\", id);\n\t\t\t\t} catch {\n\t\t\t\t\t/* no-op */\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\tconst handleDragOverTab = (event: React.DragEvent, overId: string) => {\n\t\t\tif (!reorderable || dragId === null) return;\n\t\t\tevent.preventDefault();\n\t\t\tif (event.dataTransfer) event.dataTransfer.dropEffect = \"move\";\n\t\t\tif (overId === dragId) return;\n\t\t\tconst ids = tabs.map((tab) => tab.id);\n\t\t\tconst from = ids.indexOf(dragId);\n\t\t\tconst to = ids.indexOf(overId);\n\t\t\tif (from === -1 || to === -1) return;\n\t\t\tids.splice(from, 1);\n\t\t\tids.splice(to, 0, dragId);\n\t\t\tonReorder?.(ids);\n\t\t};\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\trole=\"tablist\"\n\t\t\t\tclassName={cn(\"wwc:relative wwc:flex wwc:items-end wwc:gap-1 wwc:bg-muted wwc:px-2 wwc:pt-2\", className)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{tabs.map((tab) => (\n\t\t\t\t\t<BrowserTab\n\t\t\t\t\t\tkey={tab.id}\n\t\t\t\t\t\ttab={tab}\n\t\t\t\t\t\tactive={tab.id === resolvedActive}\n\t\t\t\t\t\tcloseable={closeable}\n\t\t\t\t\t\tonSelect={() => handleSelect(tab.id)}\n\t\t\t\t\t\tonClose={onTabClose ? () => onTabClose(tab.id) : undefined}\n\t\t\t\t\t\tdraggable={reorderable && !tab.disabled}\n\t\t\t\t\t\tdragging={dragId === tab.id}\n\t\t\t\t\t\tonDragStart={reorderable ? (event) => handleDragStart(event, tab.id) : undefined}\n\t\t\t\t\t\tonDragEnter={reorderable ? (event) => event.preventDefault() : undefined}\n\t\t\t\t\t\tonDragOver={reorderable ? (event) => handleDragOverTab(event, tab.id) : undefined}\n\t\t\t\t\t\tonDrop={reorderable ? (event) => event.preventDefault() : undefined}\n\t\t\t\t\t\tonDragEnd={reorderable ? () => setDragId(null) : undefined}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t\t{trailing && <div className=\"wwc:ml-auto wwc:flex wwc:shrink-0 wwc:items-center\">{trailing}</div>}\n\t\t\t</div>\n\t\t);\n\t},\n);\nBrowserTabs.displayName = \"BrowserTabs\";\n\nexport {BrowserTab, BrowserTabs};\n"],"mappings":"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"}

package/dist/building-model-placeholder.d.mts

@@ -0,0 +1,46 @@
+import * as React from "react";
+//#region src/building-model-placeholder.d.ts
+/** One floor of the building, bottom-to-top order preserved by the array (index 0 = top). */
+export interface BuildingModelFloor {
+  /** Stable id, matched against `activeId`. */
+  id: string;
+  /** Short floor label, e.g. "GF" / "RF". */
+  label: string;
+  /** Completion percentage shown on the plate label. Omit to hide it. */
+  value?: number;
+  /** When false, the plate is dashed / faded (no blueprint for that floor). Default true. */
+  hasBlueprint?: boolean;
+}
+export interface BuildingModelPlaceholderProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Floors ordered top → bottom (roof first). One extruded box is stacked per floor. */
+  floors: BuildingModelFloor[];
+  /** Id of the highlighted floor. */
+  activeId?: string;
+  /** Fires when a floor box is clicked. */
+  onFloorSelect?: (id: string) => void;
+  /** Initial camera orientation (degrees). Default `{x: 62, y: -28}`. */
+  defaultRotation?: {
+    x: number;
+    y: number;
+  };
+  /** Show the "placeholder" badge (bottom-left). Default true. */
+  showBadge?: boolean;
+  /** Badge text. Default "No 3D model — showing floor placeholder". */
+  badgeLabel?: React.ReactNode;
+  /** Plate edge length (px). Default 176. */
+  plateSize?: number;
+  /** Vertical gap between floors (px). Default 34. */
+  plateGap?: number;
+  /** Wall height of each floor box (px). Default 30. */
+  wallHeight?: number;
+}
+/**
+ * A dependency-free 3D building placeholder: one extruded box (slab + four walls) per floor, stacked
+ * along the up-axis and viewed isometrically via CSS 3D. Drag to orbit, click a floor to select it
+ * (highlighted). Meant as the fallback when a real BIM / 3D model isn't available yet — swap it for the
+ * model renderer when one exists; the surrounding chrome stays the same.
+ */
+declare const BuildingModelPlaceholder: React.ForwardRefExoticComponent<BuildingModelPlaceholderProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { BuildingModelPlaceholder };
+//# sourceMappingURL=building-model-placeholder.d.mts.map

package/dist/building-model-placeholder.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"building-model-placeholder.d.mts","names":[],"sources":["../src/building-model-placeholder.tsx"],"mappings":";;;iBAOiB;;EAEhB;;EAEA;;EAEA;;EAEA;;iBAGgB,sCAAsC,MAAM,eAAe;;EAE3E,QAAQ;;EAER;;EAEA,iBAAiB;;EAEjB;IAAmB;IAAW;;;EAE9B;;EAEA,aAAa,MAAM;;EAEnB;;EAEA;;EAEA;;;;;;;;cAuCK,0BAAwB,MAAA,0BAAA,gCAAA,MAAA,cAAA"}

package/dist/building-model-placeholder.mjs

@@ -0,0 +1,175 @@
+import { cn } from "@corensystem/coren-utils";
+import { Boxes } from "lucide-react";
+import * as React from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/building-model-placeholder.tsx
+const FLOAT_SHADOW = "wwc:shadow-[0_4px_12px_rgba(0,0,0,0.06)]";
+function wallFaces(plateSize, wallH) {
+	return [
+		{
+			key: "n",
+			w: plateSize,
+			h: wallH,
+			transform: `translateY(-${plateSize / 2}px) translateZ(${wallH / 2}px) rotateX(90deg)`
+		},
+		{
+			key: "s",
+			w: plateSize,
+			h: wallH,
+			transform: `translateY(${plateSize / 2}px) translateZ(${wallH / 2}px) rotateX(90deg)`
+		},
+		{
+			key: "e",
+			w: wallH,
+			h: plateSize,
+			transform: `translateX(${plateSize / 2}px) translateZ(${wallH / 2}px) rotateY(90deg)`
+		},
+		{
+			key: "w",
+			w: wallH,
+			h: plateSize,
+			transform: `translateX(-${plateSize / 2}px) translateZ(${wallH / 2}px) rotateY(90deg)`
+		}
+	];
+}
+/**
+* A dependency-free 3D building placeholder: one extruded box (slab + four walls) per floor, stacked
+* along the up-axis and viewed isometrically via CSS 3D. Drag to orbit, click a floor to select it
+* (highlighted). Meant as the fallback when a real BIM / 3D model isn't available yet — swap it for the
+* model renderer when one exists; the surrounding chrome stays the same.
+*/
+const BuildingModelPlaceholder = React.forwardRef(({ className, floors, activeId, onFloorSelect, defaultRotation, showBadge = true, badgeLabel = "No 3D model — showing floor placeholder", plateSize = 176, plateGap = 34, wallHeight = 30, ...props }, ref) => {
+	const n = floors.length;
+	const walls = React.useMemo(() => wallFaces(plateSize, wallHeight), [plateSize, wallHeight]);
+	const [rotation, setRotation] = React.useState(defaultRotation ?? {
+		x: 62,
+		y: -28
+	});
+	const [orbiting, setOrbiting] = React.useState(false);
+	const orbitStart = React.useRef(null);
+	const draggedRef = React.useRef(false);
+	const startOrbit = (e) => {
+		if (e.button !== 0) return;
+		orbitStart.current = {
+			px: e.clientX,
+			py: e.clientY,
+			rx: rotation.x,
+			ry: rotation.y
+		};
+		draggedRef.current = false;
+		setOrbiting(true);
+		e.currentTarget.setPointerCapture?.(e.pointerId);
+	};
+	const moveOrbit = (e) => {
+		const s = orbitStart.current;
+		if (!s) return;
+		if (Math.abs(e.clientX - s.px) + Math.abs(e.clientY - s.py) > 4) draggedRef.current = true;
+		setRotation({
+			x: Math.max(12, Math.min(86, s.rx - (e.clientY - s.py) * .3)),
+			y: s.ry + (e.clientX - s.px) * .4
+		});
+	};
+	const endOrbit = (e) => {
+		if (!orbitStart.current) return;
+		orbitStart.current = null;
+		setOrbiting(false);
+		e.currentTarget.releasePointerCapture?.(e.pointerId);
+	};
+	const clickFloor = (id) => {
+		if (draggedRef.current) return;
+		onFloorSelect?.(id);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("wwc:relative wwc:h-full wwc:w-full wwc:overflow-hidden wwc:bg-zinc-100 dark:wwc:bg-zinc-900", className),
+		...props,
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: cn("wwc:absolute wwc:inset-0 wwc:z-0", orbiting ? "wwc:cursor-grabbing" : "wwc:cursor-grab"),
+				onPointerDown: startOrbit,
+				onPointerMove: moveOrbit,
+				onPointerUp: endOrbit,
+				onPointerCancel: endOrbit
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "wwc:pointer-events-none wwc:absolute wwc:inset-0 wwc:flex wwc:items-center wwc:justify-center",
+				style: { perspective: "1400px" },
+				children: /* @__PURE__ */ jsx("div", {
+					style: {
+						width: plateSize,
+						height: plateSize,
+						transformStyle: "preserve-3d",
+						transform: `rotateX(${rotation.x}deg) rotateZ(${rotation.y}deg)`
+					},
+					children: floors.map((floor, i) => {
+						const z = (n - 1 - i - (n - 1) / 2) * plateGap;
+						const active = floor.id === activeId;
+						const hasBlueprint = floor.hasBlueprint ?? true;
+						const slab = active ? "wwc:border-primary wwc:bg-primary/30" : hasBlueprint ? "wwc:border-zinc-400/70 wwc:bg-white/80 dark:wwc:border-zinc-600 dark:wwc:bg-zinc-800/80" : "wwc:border-dashed wwc:border-zinc-400/60 wwc:bg-white/45 dark:wwc:bg-zinc-800/45";
+						const wall = active ? "wwc:border-primary wwc:bg-primary/15" : hasBlueprint ? "wwc:border-zinc-400/60 wwc:bg-white/25 dark:wwc:border-zinc-600 dark:wwc:bg-zinc-700/30" : "wwc:border-dashed wwc:border-zinc-400/50 wwc:bg-white/10 dark:wwc:bg-zinc-700/15";
+						return /* @__PURE__ */ jsxs("div", {
+							role: "button",
+							tabIndex: 0,
+							"aria-pressed": active,
+							"aria-label": floor.value != null ? `${floor.label} — ${floor.value}%` : floor.label,
+							className: cn("wwc:pointer-events-auto wwc:absolute wwc:inset-0", !active && "wwc:cursor-pointer"),
+							style: {
+								transformStyle: "preserve-3d",
+								transform: `translateZ(${z}px)`
+							},
+							onPointerDown: startOrbit,
+							onPointerMove: moveOrbit,
+							onPointerUp: endOrbit,
+							onClick: () => clickFloor(floor.id),
+							onKeyDown: (e) => {
+								if (e.key === "Enter" || e.key === " ") {
+									e.preventDefault();
+									onFloorSelect?.(floor.id);
+								}
+							},
+							children: [
+								/* @__PURE__ */ jsx("div", {
+									className: cn("wwc:absolute wwc:inset-0 wwc:rounded-sm wwc:border", slab, active && "wwc:ring-2 wwc:ring-primary"),
+									style: { boxShadow: "0 10px 18px rgba(0,0,0,0.10)" }
+								}),
+								walls.map((face) => /* @__PURE__ */ jsx("div", {
+									className: cn("wwc:absolute wwc:border", wall),
+									style: {
+										width: face.w,
+										height: face.h,
+										left: `calc(50% - ${face.w / 2}px)`,
+										top: `calc(50% - ${face.h / 2}px)`,
+										transform: face.transform
+									}
+								}, face.key)),
+								/* @__PURE__ */ jsxs("div", {
+									className: "wwc:pointer-events-none wwc:absolute wwc:left-1/2 wwc:top-1/2 wwc:flex wwc:items-center wwc:gap-1 wwc:whitespace-nowrap wwc:rounded wwc:bg-background/90 wwc:px-1.5 wwc:py-0.5 wwc:text-[10px] wwc:font-semibold wwc:shadow-sm",
+									style: { transform: `translate(-50%, -50%) translateZ(${wallHeight + 1}px) rotateZ(${-rotation.y}deg) rotateX(${-rotation.x}deg)` },
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "wwc:text-foreground",
+										children: floor.label
+									}), floor.value != null && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
+										className: "wwc:h-2.5 wwc:w-px wwc:bg-border",
+										"aria-hidden": "true"
+									}), /* @__PURE__ */ jsxs("span", {
+										className: active ? "wwc:text-primary" : "wwc:text-muted-foreground",
+										children: [floor.value, "%"]
+									})] })]
+								})
+							]
+						}, floor.id);
+					})
+				})
+			}),
+			showBadge && /* @__PURE__ */ jsxs("div", {
+				className: cn("wwc:pointer-events-none wwc:absolute wwc:bottom-3 wwc:left-3 wwc:z-10 wwc:flex wwc:items-center wwc:gap-1.5 wwc:rounded-md wwc:bg-white/90 wwc:px-2 wwc:py-1 wwc:text-[11px] wwc:font-medium wwc:text-muted-foreground dark:wwc:bg-zinc-900/90", FLOAT_SHADOW),
+				children: [/* @__PURE__ */ jsx(Boxes, { className: "wwc:size-3.5" }), badgeLabel]
+			})
+		]
+	});
+});
+BuildingModelPlaceholder.displayName = "BuildingModelPlaceholder";
+//#endregion
+export { BuildingModelPlaceholder };
+
+//# sourceMappingURL=building-model-placeholder.mjs.map

package/dist/building-model-placeholder.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"building-model-placeholder.mjs","names":[],"sources":["../src/building-model-placeholder.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport {Boxes} from \"lucide-react\";\nimport * as React from \"react\";\n\nconst FLOAT_SHADOW = \"wwc:shadow-[0_4px_12px_rgba(0,0,0,0.06)]\";\n\n/** One floor of the building, bottom-to-top order preserved by the array (index 0 = top). */\nexport interface BuildingModelFloor {\n\t/** Stable id, matched against `activeId`. */\n\tid: string;\n\t/** Short floor label, e.g. \"GF\" / \"RF\". */\n\tlabel: string;\n\t/** Completion percentage shown on the plate label. Omit to hide it. */\n\tvalue?: number;\n\t/** When false, the plate is dashed / faded (no blueprint for that floor). Default true. */\n\thasBlueprint?: boolean;\n}\n\nexport interface BuildingModelPlaceholderProps extends React.HTMLAttributes<HTMLDivElement> {\n\t/** Floors ordered top → bottom (roof first). One extruded box is stacked per floor. */\n\tfloors: BuildingModelFloor[];\n\t/** Id of the highlighted floor. */\n\tactiveId?: string;\n\t/** Fires when a floor box is clicked. */\n\tonFloorSelect?: (id: string) => void;\n\t/** Initial camera orientation (degrees). Default `{x: 62, y: -28}`. */\n\tdefaultRotation?: {x: number; y: number};\n\t/** Show the \"placeholder\" badge (bottom-left). Default true. */\n\tshowBadge?: boolean;\n\t/** Badge text. Default \"No 3D model — showing floor placeholder\". */\n\tbadgeLabel?: React.ReactNode;\n\t/** Plate edge length (px). Default 176. */\n\tplateSize?: number;\n\t/** Vertical gap between floors (px). Default 34. */\n\tplateGap?: number;\n\t/** Wall height of each floor box (px). Default 30. */\n\twallHeight?: number;\n}\n\n// The four vertical walls of a floor box, each centred on the box centre then rotated up to its edge.\nfunction wallFaces(plateSize: number, wallH: number) {\n\treturn [\n\t\t{\n\t\t\tkey: \"n\",\n\t\t\tw: plateSize,\n\t\t\th: wallH,\n\t\t\ttransform: `translateY(-${plateSize / 2}px) translateZ(${wallH / 2}px) rotateX(90deg)`,\n\t\t},\n\t\t{\n\t\t\tkey: \"s\",\n\t\t\tw: plateSize,\n\t\t\th: wallH,\n\t\t\ttransform: `translateY(${plateSize / 2}px) translateZ(${wallH / 2}px) rotateX(90deg)`,\n\t\t},\n\t\t{\n\t\t\tkey: \"e\",\n\t\t\tw: wallH,\n\t\t\th: plateSize,\n\t\t\ttransform: `translateX(${plateSize / 2}px) translateZ(${wallH / 2}px) rotateY(90deg)`,\n\t\t},\n\t\t{\n\t\t\tkey: \"w\",\n\t\t\tw: wallH,\n\t\t\th: plateSize,\n\t\t\ttransform: `translateX(-${plateSize / 2}px) translateZ(${wallH / 2}px) rotateY(90deg)`,\n\t\t},\n\t];\n}\n\n/**\n * A dependency-free 3D building placeholder: one extruded box (slab + four walls) per floor, stacked\n * along the up-axis and viewed isometrically via CSS 3D. Drag to orbit, click a floor to select it\n * (highlighted). Meant as the fallback when a real BIM / 3D model isn't available yet — swap it for the\n * model renderer when one exists; the surrounding chrome stays the same.\n */\nconst BuildingModelPlaceholder = React.forwardRef<HTMLDivElement, BuildingModelPlaceholderProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tfloors,\n\t\t\tactiveId,\n\t\t\tonFloorSelect,\n\t\t\tdefaultRotation,\n\t\t\tshowBadge = true,\n\t\t\tbadgeLabel = \"No 3D model — showing floor placeholder\",\n\t\t\tplateSize = 176,\n\t\t\tplateGap = 34,\n\t\t\twallHeight = 30,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst n = floors.length;\n\t\tconst walls = React.useMemo(() => wallFaces(plateSize, wallHeight), [plateSize, wallHeight]);\n\t\tconst [rotation, setRotation] = React.useState(defaultRotation ?? {x: 62, y: -28});\n\t\tconst [orbiting, setOrbiting] = React.useState(false);\n\t\tconst orbitStart = React.useRef<{px: number; py: number; rx: number; ry: number} | null>(null);\n\t\tconst draggedRef = React.useRef(false);\n\n\t\tconst startOrbit = (e: React.PointerEvent) => {\n\t\t\tif (e.button !== 0) return;\n\t\t\torbitStart.current = {px: e.clientX, py: e.clientY, rx: rotation.x, ry: rotation.y};\n\t\t\tdraggedRef.current = false;\n\t\t\tsetOrbiting(true);\n\t\t\t(e.currentTarget as Element).setPointerCapture?.(e.pointerId);\n\t\t};\n\t\tconst moveOrbit = (e: React.PointerEvent) => {\n\t\t\tconst s = orbitStart.current;\n\t\t\tif (!s) return;\n\t\t\tif (Math.abs(e.clientX - s.px) + Math.abs(e.clientY - s.py) > 4) draggedRef.current = true;\n\t\t\tsetRotation({\n\t\t\t\tx: Math.max(12, Math.min(86, s.rx - (e.clientY - s.py) * 0.3)),\n\t\t\t\ty: s.ry + (e.clientX - s.px) * 0.4,\n\t\t\t});\n\t\t};\n\t\tconst endOrbit = (e: React.PointerEvent) => {\n\t\t\tif (!orbitStart.current) return;\n\t\t\torbitStart.current = null;\n\t\t\tsetOrbiting(false);\n\t\t\t(e.currentTarget as Element).releasePointerCapture?.(e.pointerId);\n\t\t};\n\t\tconst clickFloor = (id: string) => {\n\t\t\tif (draggedRef.current) return;\n\t\t\tonFloorSelect?.(id);\n\t\t};\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:relative wwc:h-full wwc:w-full wwc:overflow-hidden wwc:bg-zinc-100 dark:wwc:bg-zinc-900\",\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{/* Orbit surface: drag empty backdrop to rotate. Behind the floor boxes. */}\n\t\t\t\t<div\n\t\t\t\t\tclassName={cn(\"wwc:absolute wwc:inset-0 wwc:z-0\", orbiting ? \"wwc:cursor-grabbing\" : \"wwc:cursor-grab\")}\n\t\t\t\t\tonPointerDown={startOrbit}\n\t\t\t\t\tonPointerMove={moveOrbit}\n\t\t\t\t\tonPointerUp={endOrbit}\n\t\t\t\t\tonPointerCancel={endOrbit}\n\t\t\t\t/>\n\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"wwc:pointer-events-none wwc:absolute wwc:inset-0 wwc:flex wwc:items-center wwc:justify-center\"\n\t\t\t\t\tstyle={{perspective: \"1400px\"}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twidth: plateSize,\n\t\t\t\t\t\t\theight: plateSize,\n\t\t\t\t\t\t\ttransformStyle: \"preserve-3d\",\n\t\t\t\t\t\t\ttransform: `rotateX(${rotation.x}deg) rotateZ(${rotation.y}deg)`,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{floors.map((floor, i) => {\n\t\t\t\t\t\t\tconst level = n - 1 - i; // roof (i=0) sits highest\n\t\t\t\t\t\t\tconst z = (level - (n - 1) / 2) * plateGap;\n\t\t\t\t\t\t\tconst active = floor.id === activeId;\n\t\t\t\t\t\t\tconst hasBlueprint = floor.hasBlueprint ?? true;\n\t\t\t\t\t\t\tconst slab = active\n\t\t\t\t\t\t\t\t? \"wwc:border-primary wwc:bg-primary/30\"\n\t\t\t\t\t\t\t\t: hasBlueprint\n\t\t\t\t\t\t\t\t\t? \"wwc:border-zinc-400/70 wwc:bg-white/80 dark:wwc:border-zinc-600 dark:wwc:bg-zinc-800/80\"\n\t\t\t\t\t\t\t\t\t: \"wwc:border-dashed wwc:border-zinc-400/60 wwc:bg-white/45 dark:wwc:bg-zinc-800/45\";\n\t\t\t\t\t\t\tconst wall = active\n\t\t\t\t\t\t\t\t? \"wwc:border-primary wwc:bg-primary/15\"\n\t\t\t\t\t\t\t\t: hasBlueprint\n\t\t\t\t\t\t\t\t\t? \"wwc:border-zinc-400/60 wwc:bg-white/25 dark:wwc:border-zinc-600 dark:wwc:bg-zinc-700/30\"\n\t\t\t\t\t\t\t\t\t: \"wwc:border-dashed wwc:border-zinc-400/50 wwc:bg-white/10 dark:wwc:bg-zinc-700/15\";\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={floor.id}\n\t\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\t\taria-pressed={active}\n\t\t\t\t\t\t\t\t\taria-label={floor.value != null ? `${floor.label} — ${floor.value}%` : floor.label}\n\t\t\t\t\t\t\t\t\tclassName={cn(\"wwc:pointer-events-auto wwc:absolute wwc:inset-0\", !active && \"wwc:cursor-pointer\")}\n\t\t\t\t\t\t\t\t\tstyle={{transformStyle: \"preserve-3d\", transform: `translateZ(${z}px)`}}\n\t\t\t\t\t\t\t\t\tonPointerDown={startOrbit}\n\t\t\t\t\t\t\t\t\tonPointerMove={moveOrbit}\n\t\t\t\t\t\t\t\t\tonPointerUp={endOrbit}\n\t\t\t\t\t\t\t\t\tonClick={() => clickFloor(floor.id)}\n\t\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\tonFloorSelect?.(floor.id);\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>\n\t\t\t\t\t\t\t\t\t<div\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:absolute wwc:inset-0 wwc:rounded-sm wwc:border\",\n\t\t\t\t\t\t\t\t\t\t\tslab,\n\t\t\t\t\t\t\t\t\t\t\tactive && \"wwc:ring-2 wwc:ring-primary\",\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tstyle={{boxShadow: \"0 10px 18px rgba(0,0,0,0.10)\"}}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{walls.map((face) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={face.key}\n\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"wwc:absolute wwc:border\", wall)}\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: face.w,\n\t\t\t\t\t\t\t\t\t\t\t\theight: face.h,\n\t\t\t\t\t\t\t\t\t\t\t\tleft: `calc(50% - ${face.w / 2}px)`,\n\t\t\t\t\t\t\t\t\t\t\t\ttop: `calc(50% - ${face.h / 2}px)`,\n\t\t\t\t\t\t\t\t\t\t\t\ttransform: face.transform,\n\t\t\t\t\t\t\t\t\t\t\t}}\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<div\n\t\t\t\t\t\t\t\t\t\tclassName=\"wwc:pointer-events-none wwc:absolute wwc:left-1/2 wwc:top-1/2 wwc:flex wwc:items-center wwc:gap-1 wwc:whitespace-nowrap wwc:rounded wwc:bg-background/90 wwc:px-1.5 wwc:py-0.5 wwc:text-[10px] wwc:font-semibold wwc:shadow-sm\"\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\ttransform: `translate(-50%, -50%) translateZ(${wallHeight + 1}px) rotateZ(${-rotation.y}deg) rotateX(${-rotation.x}deg)`,\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<span className=\"wwc:text-foreground\">{floor.label}</span>\n\t\t\t\t\t\t\t\t\t\t{floor.value != null && (\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<span className=\"wwc:h-2.5 wwc:w-px wwc:bg-border\" aria-hidden=\"true\" />\n\t\t\t\t\t\t\t\t\t\t\t\t<span className={active ? \"wwc:text-primary\" : \"wwc:text-muted-foreground\"}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{floor.value}%\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t{showBadge && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"wwc:pointer-events-none wwc:absolute wwc:bottom-3 wwc:left-3 wwc:z-10 wwc:flex wwc:items-center wwc:gap-1.5 wwc:rounded-md wwc:bg-white/90 wwc:px-2 wwc:py-1 wwc:text-[11px] wwc:font-medium wwc:text-muted-foreground dark:wwc:bg-zinc-900/90\",\n\t\t\t\t\t\t\tFLOAT_SHADOW,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Boxes className=\"wwc:size-3.5\" />\n\t\t\t\t\t\t{badgeLabel}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t},\n);\nBuildingModelPlaceholder.displayName = \"BuildingModelPlaceholder\";\n\nexport {BuildingModelPlaceholder};\n"],"mappings":"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"}

package/dist/building-progress.d.mts

@@ -0,0 +1,32 @@
+import * as React from "react";
+//#region src/building-progress.d.ts
+/** One floor/level row in the building progress stack. */
+export interface BuildingFloor {
+  /** Stable id, matched against `activeId` to pick the highlighted floor. */
+  id: string;
+  /** Short floor label, e.g. "GF" or "RF" (rendered uppercase). */
+  label: string;
+  /** Completion percentage, 0–100. */
+  value: number;
+}
+export interface BuildingProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {
+  /** Floors ordered top → bottom (roof first, base last), mirroring the building elevation. */
+  floors: BuildingFloor[];
+  /** Id of the highlighted (currently viewed) floor. */
+  activeId?: string;
+  /** Fires when a floor is clicked. When provided, the rows render as buttons. */
+  onFloorSelect?: (id: string) => void;
+  /** Pixels each floor widens toward the base, giving the tapered building silhouette. Default 24. */
+  taperStep?: number;
+  /** Density. `compact` shrinks the rows, bars and text. Default `default`. */
+  size?: "default" | "compact";
+}
+/**
+ * A building elevation progress stack: one row per floor (top → bottom) with a completion bar and
+ * percentage, tapering wider toward the base like a building silhouette. The `activeId` floor is
+ * highlighted; pass `onFloorSelect` to make the rows interactive.
+ */
+declare const BuildingProgress: React.ForwardRefExoticComponent<BuildingProgressProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { BuildingProgress };
+//# sourceMappingURL=building-progress.d.mts.map

package/dist/building-progress.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"building-progress.d.mts","names":[],"sources":["../src/building-progress.tsx"],"mappings":";;;iBAIiB;;EAEhB;;EAEA;;EAEA;;iBAGgB,8BAA8B,KAAK,MAAM,eAAe;;EAExE,QAAQ;;EAER;;EAEA,iBAAiB;;EAEjB;;EAEA;;;;;;;cAsCK,kBAAgB,MAAA,0BAAA,wBAAA,MAAA,cAAA"}