@stll/ui 0.0.1-placeholder.0 → 0.3.0

package/dist/components/select.js

@@ -0,0 +1,196 @@
+"use client";
+import { cn } from "../lib/utils.js";
+import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
+import { ChevronDownIcon, ChevronUpIcon, ChevronsUpDownIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React$1 from "react";
+import { Select as Select$1 } from "@base-ui/react/select";
+//#region src/components/select.tsx
+const SelectItemDisplaysContext = React$1.createContext(/* @__PURE__ */ new Map());
+const renderSelectedDisplay = (displays, placeholder) => (value) => {
+	if (!displays.has(value)) return placeholder ?? null;
+	return displays.get(value) ?? null;
+};
+const Select = ({ children, itemToStringLabel, ...props }) => {
+	const itemLabels = collectSelectItemLabels(children);
+	const itemDisplays = collectSelectItemDisplays(children);
+	const root = itemToStringLabel || itemLabels.size === 0 ? /* @__PURE__ */ jsx(Select$1.Root, {
+		itemToStringLabel,
+		...props,
+		children
+	}) : /* @__PURE__ */ jsx(Select$1.Root, {
+		itemToStringLabel: (value) => {
+			const stringValue = String(value);
+			return itemLabels.get(value) ?? stringValue;
+		},
+		...props,
+		children
+	});
+	return /* @__PURE__ */ jsx(SelectItemDisplaysContext, {
+		value: itemDisplays,
+		children: root
+	});
+};
+const SelectTrigger = ({ className, size = "default", children, ...props }) => /* @__PURE__ */ jsxs(Select$1.Trigger, {
+	className: cn("border-input bg-background text-foreground ring-ring/24 focus-visible:border-ring aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/16 dark:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex min-h-9 w-full min-w-36 items-center justify-center gap-2 rounded-lg border px-[calc(--spacing(3)-1px)] text-start text-base shadow-xs/5 transition-shadow outline-none select-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-data-disabled:not-focus-visible:not-aria-invalid:not-data-pressed:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-[3px] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-8 sm:text-sm dark:not-data-disabled:not-focus-visible:not-aria-invalid:not-data-pressed:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:after:absolute pointer-coarse:after:size-full pointer-coarse:after:min-h-11 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [[data-disabled],:focus-visible,[aria-invalid],[data-pressed]]:shadow-none", size === "sm" && "min-h-8 gap-1.5 px-[calc(--spacing(2.5)-1px)] sm:min-h-7", size === "lg" && "min-h-10 sm:min-h-9", className),
+	"data-slot": "select-trigger",
+	...props,
+	children: [children, /* @__PURE__ */ jsx(Select$1.Icon, {
+		"data-slot": "select-icon",
+		children: /* @__PURE__ */ jsx(ChevronsUpDownIcon, { className: "-me-1 size-4.5 opacity-80 sm:size-4" })
+	})]
+});
+const SelectValue = ({ className, children, placeholder, ...props }) => {
+	const displays = React$1.use(SelectItemDisplaysContext);
+	if (children !== void 0 || displays.size === 0) return /* @__PURE__ */ jsx(Select$1.Value, {
+		className: cn("data-placeholder:text-muted-foreground flex-1 truncate", className),
+		"data-slot": "select-value",
+		placeholder,
+		...props,
+		children
+	});
+	return /* @__PURE__ */ jsx(Select$1.Value, {
+		className: cn("data-placeholder:text-muted-foreground flex flex-1 items-center gap-2 truncate", className),
+		"data-slot": "select-value",
+		placeholder,
+		...props,
+		children: renderSelectedDisplay(displays, placeholder)
+	});
+};
+const DEFAULT_COLLISION_AVOIDANCE = {
+	align: "shift",
+	fallbackAxisSide: "none",
+	side: "none"
+};
+const SelectPopup = ({ className, children, side = "bottom", sideOffset = 4, align = "start", alignOffset = 0, alignItemWithTrigger = true, collisionAvoidance = DEFAULT_COLLISION_AVOIDANCE, ...props }) => /* @__PURE__ */ jsx(Select$1.Portal, { children: /* @__PURE__ */ jsx(Select$1.Positioner, {
+	align,
+	alignItemWithTrigger,
+	alignOffset,
+	className: cn(OVERLAY_LAYER_CLASS_NAMES.popup, "select-none"),
+	collisionAvoidance,
+	"data-slot": "select-positioner",
+	side,
+	sideOffset,
+	children: /* @__PURE__ */ jsxs(Select$1.Popup, {
+		className: "text-foreground origin-(--transform-origin)",
+		"data-slot": "select-popup",
+		...props,
+		children: [
+			/* @__PURE__ */ jsx(Select$1.ScrollUpArrow, {
+				className: "before:from-popover top-0 z-50 flex h-6 w-full cursor-default items-center justify-center before:pointer-events-none before:absolute before:inset-x-px before:top-px before:h-[200%] before:rounded-t-[calc(var(--radius-lg)-1px)] before:bg-linear-to-b before:from-50%",
+				"data-slot": "select-scroll-up-arrow",
+				children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: "relative size-4.5 sm:size-4" })
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "bg-popover relative h-full min-w-(--anchor-width) rounded-lg border shadow-lg/5 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] dark:before:shadow-[0_-1px_--theme(--color-white/6%)]",
+				children: /* @__PURE__ */ jsx(Select$1.List, {
+					className: cn("max-h-(--available-height) overflow-y-auto p-1", className),
+					"data-slot": "select-list",
+					children
+				})
+			}),
+			/* @__PURE__ */ jsx(Select$1.ScrollDownArrow, {
+				className: "before:from-popover bottom-0 z-50 flex h-6 w-full cursor-default items-center justify-center before:pointer-events-none before:absolute before:inset-x-px before:bottom-px before:h-[200%] before:rounded-b-[calc(var(--radius-lg)-1px)] before:bg-linear-to-t before:from-50%",
+				"data-slot": "select-scroll-down-arrow",
+				children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "relative size-4.5 sm:size-4" })
+			})
+		]
+	})
+}) });
+const SelectItem = ({ className, children, label: _label, ...props }) => /* @__PURE__ */ jsxs(Select$1.Item, {
+	className: cn("data-highlighted:bg-accent data-highlighted:text-accent-foreground grid min-h-8 cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", className),
+	"data-slot": "select-item",
+	...props,
+	children: [/* @__PURE__ */ jsx(Select$1.ItemIndicator, {
+		className: "col-start-1",
+		children: /* @__PURE__ */ jsxs("svg", {
+			fill: "none",
+			height: "24",
+			stroke: "currentColor",
+			strokeLinecap: "round",
+			strokeLinejoin: "round",
+			strokeWidth: "2",
+			viewBox: "0 0 24 24",
+			width: "24",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: [/* @__PURE__ */ jsx("title", { children: "Selected" }), /* @__PURE__ */ jsx("path", { d: "M5.252 12.7 10.2 18.63 18.748 5.37" })]
+		})
+	}), /* @__PURE__ */ jsx(Select$1.ItemText, {
+		className: "col-start-2 flex min-w-0 items-center gap-2",
+		children
+	})]
+});
+function collectSelectItemLabels(children) {
+	const labels = /* @__PURE__ */ new Map();
+	React$1.Children.forEach(children, (child) => {
+		collectSelectItemLabel(child, labels);
+	});
+	return labels;
+}
+function collectSelectItemDisplays(children) {
+	const displays = /* @__PURE__ */ new Map();
+	React$1.Children.forEach(children, (child) => {
+		collectSelectItemDisplay(child, displays);
+	});
+	return displays;
+}
+function collectSelectItemDisplay(child, displays) {
+	if (!isElementWithChildren(child)) return;
+	if (isSelectItemElement(child)) {
+		const value = child.props.value;
+		displays.set(value, child.props.children);
+		return;
+	}
+	React$1.Children.forEach(child.props.children, (nestedChild) => {
+		collectSelectItemDisplay(nestedChild, displays);
+	});
+}
+function collectSelectItemLabel(child, labels) {
+	if (!isElementWithChildren(child)) return;
+	if (isSelectItemElement(child)) {
+		const value = child.props.value;
+		const label = child.props.label ?? getTextLabel(child.props.children);
+		if (label) labels.set(value, label);
+	}
+	React$1.Children.forEach(child.props.children, (nestedChild) => {
+		collectSelectItemLabel(nestedChild, labels);
+	});
+}
+function isElementWithChildren(node) {
+	return React$1.isValidElement(node);
+}
+function isSelectItemElement(node) {
+	return React$1.isValidElement(node) && node.type === SelectItem;
+}
+function isReactNodeArray(node) {
+	return Array.isArray(node);
+}
+function getTextLabel(node) {
+	if (typeof node === "string" || typeof node === "number") return String(node);
+	if (isReactNodeArray(node)) {
+		const parts = [];
+		React$1.Children.forEach(node, (child) => {
+			const text = getTextLabel(child);
+			if (text) parts.push(text);
+		});
+		return parts.length > 0 ? parts.join("") : null;
+	}
+	if (isElementWithChildren(node)) return getTextLabel(node.props.children);
+	return null;
+}
+const SelectSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx(Select$1.Separator, {
+	className: cn("bg-border mx-2 my-1 h-px", className),
+	"data-slot": "select-separator",
+	...props
+});
+const SelectGroup = (props) => /* @__PURE__ */ jsx(Select$1.Group, {
+	"data-slot": "select-group",
+	...props
+});
+const SelectGroupLabel = (props) => /* @__PURE__ */ jsx(Select$1.GroupLabel, {
+	className: "text-muted-foreground px-2 py-1.5 text-xs font-medium",
+	"data-slot": "select-group-label",
+	...props
+});
+//#endregion
+export { Select, SelectPopup as SelectContent, SelectPopup, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue };

package/dist/components/separator.d.ts

@@ -0,0 +1,16 @@
+import { PropsWithChildren } from "react";
+import { Separator as Separator$1 } from "@base-ui/react/separator";
+//#region src/components/separator.d.ts
+declare const Separator: ({ className, orientation, ...props }: Separator$1.Props) => import("react").JSX.Element;
+type TextSeparatorProps = PropsWithChildren<{
+  /** Container overrides, e.g. gap or vertical padding. */
+  className?: string;
+  /** Label overrides, e.g. casing or size. */
+  labelClassName?: string;
+}>;
+/** Horizontal rule with a centered label — the "or sign in with email" /
+ *  "or build a new one" divider that frames an either/or choice. The label
+ *  names the alternative; flanking hairlines split the two options. */
+declare const TextSeparator: ({ children, className, labelClassName }: TextSeparatorProps) => import("react").JSX.Element;
+//#endregion
+export { Separator, TextSeparator };

package/dist/components/separator.js

@@ -0,0 +1,26 @@
+import { cn } from "../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Separator as Separator$1 } from "@base-ui/react/separator";
+//#region src/components/separator.tsx
+const Separator = ({ className, orientation = "horizontal", ...props }) => /* @__PURE__ */ jsx(Separator$1, {
+	className: cn("bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:not-[[class^='h-']]:not-[[class*='_h-']]:self-stretch", className),
+	"data-slot": "separator",
+	orientation,
+	...props
+});
+/** Horizontal rule with a centered label — the "or sign in with email" /
+*  "or build a new one" divider that frames an either/or choice. The label
+*  names the alternative; flanking hairlines split the two options. */
+const TextSeparator = ({ children, className, labelClassName }) => /* @__PURE__ */ jsxs("div", {
+	className: cn("flex items-center gap-3", className),
+	children: [
+		/* @__PURE__ */ jsx("span", { className: "bg-border h-px flex-1" }),
+		/* @__PURE__ */ jsx("span", {
+			className: cn("text-muted-foreground text-xs", labelClassName),
+			children
+		}),
+		/* @__PURE__ */ jsx("span", { className: "bg-border h-px flex-1" })
+	]
+});
+//#endregion
+export { Separator, TextSeparator };

package/dist/components/sheet.d.ts

@@ -0,0 +1,29 @@
+import * as React$1 from "react";
+import { Dialog } from "@base-ui/react/dialog";
+//#region src/components/sheet.d.ts
+declare const Sheet: typeof Dialog.Root;
+declare const SheetPortal: React$1.ForwardRefExoticComponent<Omit<import("@base-ui/react").AlertDialogPortalProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type SheetSide = "inline-start" | "inline-end" | "block-start" | "block-end";
+declare function SheetTrigger({ tooltip, ...props }: Dialog.Trigger.Props & {
+  tooltip?: React$1.ReactNode;
+}): React$1.JSX.Element;
+declare function SheetClose({ tooltip, ...props }: Dialog.Close.Props & {
+  tooltip?: React$1.ReactNode;
+}): React$1.JSX.Element;
+declare const SheetBackdrop: ({ className, ...props }: Dialog.Backdrop.Props) => React$1.JSX.Element;
+declare const SheetPopup: ({ className, children, showCloseButton, side, variant, ...props }: Dialog.Popup.Props & {
+  showCloseButton?: boolean;
+  side?: SheetSide;
+  variant?: "default" | "inset";
+}) => React$1.JSX.Element;
+declare const SheetHeader: ({ className, ...props }: React$1.ComponentProps<"div">) => React$1.JSX.Element;
+declare const SheetFooter: ({ className, variant, ...props }: React$1.ComponentProps<"div"> & {
+  variant?: "default" | "bare";
+}) => React$1.JSX.Element;
+declare const SheetTitle: ({ className, ...props }: Dialog.Title.Props) => React$1.JSX.Element;
+declare const SheetDescription: ({ className, ...props }: Dialog.Description.Props) => React$1.JSX.Element;
+declare const SheetPanel: ({ className, scrollFade, ...props }: React$1.ComponentProps<"div"> & {
+  scrollFade?: boolean;
+}) => React$1.JSX.Element;
+//#endregion
+export { Sheet, SheetBackdrop, SheetBackdrop as SheetOverlay, SheetClose, SheetPopup as SheetContent, SheetPopup, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetPortal, type SheetSide, SheetTitle, SheetTrigger };

package/dist/components/sheet.js

@@ -0,0 +1,87 @@
+"use client";
+import { cn } from "../lib/utils.js";
+import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
+import { Button } from "./button.js";
+import { ScrollArea } from "./scroll-area.js";
+import { XIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Dialog } from "@base-ui/react/dialog";
+//#region src/components/sheet.tsx
+const Sheet = Dialog.Root;
+const SheetPortal = Dialog.Portal;
+function SheetTrigger({ tooltip, ...props }) {
+	return renderTooltipTrigger({
+		tooltip: tooltip ?? props["aria-label"] ?? props.title,
+		trigger: /* @__PURE__ */ jsx(Dialog.Trigger, {
+			"data-slot": "sheet-trigger",
+			...props
+		})
+	});
+}
+function SheetClose({ tooltip, ...props }) {
+	return renderTooltipTrigger({
+		tooltip: tooltip ?? props["aria-label"] ?? props.title,
+		trigger: /* @__PURE__ */ jsx(Dialog.Close, {
+			"data-slot": "sheet-close",
+			...props
+		})
+	});
+}
+const SheetBackdrop = ({ className, ...props }) => /* @__PURE__ */ jsx(Dialog.Backdrop, {
+	className: cn("fixed inset-0 z-50 bg-black/32 backdrop-blur-sm transition-opacity duration-200 data-ending-style:opacity-0 data-starting-style:opacity-0", className),
+	"data-slot": "sheet-backdrop",
+	...props
+});
+const SheetViewport = ({ className: _className, side, variant = "default", ...props }) => /* @__PURE__ */ jsx(Dialog.Viewport, {
+	className: cn("fixed inset-0 z-50", side === "block-end" && "grid grid-rows-[1fr_auto] pt-12", side === "block-start" && "grid grid-rows-[auto_1fr] pb-12", side === "inline-start" && "flex justify-start", side === "inline-end" && "flex justify-end", variant === "inset" && "sm:p-4"),
+	"data-slot": "sheet-viewport",
+	...props
+});
+const SheetPopup = ({ className, children, showCloseButton = true, side = "inline-end", variant = "default", ...props }) => /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetBackdrop, {}), /* @__PURE__ */ jsx(SheetViewport, {
+	side,
+	variant,
+	children: /* @__PURE__ */ jsxs(Dialog.Popup, {
+		className: cn("bg-popover text-popover-foreground relative flex max-h-full min-h-0 w-full min-w-0 flex-col shadow-lg/5 transition-[opacity,translate] duration-200 ease-in-out will-change-transform not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:shadow-[0_1px_--theme(--color-black/4%)] data-ending-style:opacity-0 data-starting-style:opacity-0 max-sm:before:hidden dark:before:shadow-[0_-1px_--theme(--color-white/6%)]", side === "block-end" && "row-start-2 border-t data-ending-style:translate-y-8 data-starting-style:translate-y-8", side === "block-start" && "border-b data-ending-style:-translate-y-8 data-starting-style:-translate-y-8", side === "inline-start" && "w-[calc(100%-(--spacing(12)))] max-w-md border-e data-ending-style:-translate-x-8 data-starting-style:-translate-x-8 rtl:data-ending-style:translate-x-8 rtl:data-starting-style:translate-x-8", side === "inline-end" && "w-[calc(100%-(--spacing(12)))] max-w-md border-s data-ending-style:translate-x-8 data-starting-style:translate-x-8 rtl:data-ending-style:-translate-x-8 rtl:data-starting-style:-translate-x-8", variant === "inset" && "before:hidden sm:rounded-2xl sm:border sm:before:rounded-[calc(var(--radius-2xl)-1px)] sm:**:data-[slot=sheet-footer]:rounded-b-[calc(var(--radius-2xl)-1px)]", className),
+		"data-slot": "sheet-popup",
+		...props,
+		children: [children, showCloseButton && /* @__PURE__ */ jsx(Dialog.Close, {
+			"aria-label": "Close",
+			className: "absolute end-2 top-2",
+			render: /* @__PURE__ */ jsx(Button, {
+				size: "icon",
+				variant: "ghost"
+			}),
+			children: /* @__PURE__ */ jsx(XIcon, {})
+		})]
+	})
+})] });
+const SheetHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("flex flex-col gap-2 p-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-panel])]:pb-3 max-sm:pb-4", className),
+	"data-slot": "sheet-header",
+	...props
+});
+const SheetFooter = ({ className, variant = "default", ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("flex flex-col-reverse gap-2 px-6 sm:flex-row sm:justify-end", variant === "default" && "bg-muted/72 border-t py-4", variant === "bare" && "pt-4 pb-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-panel])]:pt-3", className),
+	"data-slot": "sheet-footer",
+	...props
+});
+const SheetTitle = ({ className, ...props }) => /* @__PURE__ */ jsx(Dialog.Title, {
+	className: cn("font-heading text-xl leading-none font-semibold", className),
+	"data-slot": "sheet-title",
+	...props
+});
+const SheetDescription = ({ className, ...props }) => /* @__PURE__ */ jsx(Dialog.Description, {
+	className: cn("text-muted-foreground text-sm", className),
+	"data-slot": "sheet-description",
+	...props
+});
+const SheetPanel = ({ className, scrollFade = true, ...props }) => /* @__PURE__ */ jsx(ScrollArea, {
+	scrollFade,
+	children: /* @__PURE__ */ jsx("div", {
+		className: cn("p-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-footer]:not(.border-t))]:pb-1 in-[[data-slot=sheet-popup]:has([data-slot=sheet-header])]:pt-1", className),
+		"data-slot": "sheet-panel",
+		...props
+	})
+});
+//#endregion
+export { Sheet, SheetBackdrop, SheetBackdrop as SheetOverlay, SheetClose, SheetPopup as SheetContent, SheetPopup, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetPortal, SheetTitle, SheetTrigger };

package/dist/components/skeleton.d.ts

@@ -0,0 +1,4 @@
+//#region src/components/skeleton.d.ts
+declare const Skeleton: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
+//#endregion
+export { Skeleton };

package/dist/components/skeleton.js

@@ -0,0 +1,10 @@
+import { cn } from "../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/skeleton.tsx
+const Skeleton = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("animate-skeleton rounded-sm [--skeleton-highlight:--alpha(var(--color-white)/64%)] [background:linear-gradient(120deg,transparent_40%,var(--skeleton-highlight),transparent_60%)_var(--color-muted)_0_0/200%_100%_fixed] dark:[--skeleton-highlight:--alpha(var(--color-white)/4%)]", className),
+	"data-slot": "skeleton",
+	...props
+});
+//#endregion
+export { Skeleton };

package/dist/components/stella-mark.d.ts

@@ -0,0 +1,5 @@
+import { SVGProps } from "react";
+//#region src/components/stella-mark.d.ts
+declare const StellaMark: (props: SVGProps<SVGSVGElement>) => import("react").JSX.Element;
+//#endregion
+export { StellaMark };

package/dist/components/stella-mark.js

@@ -0,0 +1,12 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/stella-mark.tsx
+const StellaMark = (props) => /* @__PURE__ */ jsxs("svg", {
+	"aria-hidden": "true",
+	fill: "currentColor",
+	viewBox: "0 0 40 41",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M6.58 11.3 16.69 5.05a5.9 5.9 0 0 1 6.62.01l14.68 9.07V9.26L25.52 1.55A11.8 11.8 0 0 0 20 0c-1.97 0-3.88.54-5.53 1.56L4.37 7.81A9.3 9.3 0 0 0 0 15.61a9.3 9.3 0 0 0 4.37 7.8l3.26 2.02-.01.01 11.15 6.9c.14.09.27.16.39.2.68.26 1.42.19 2.03-.19l9.59-5.93.1-.07 2.07-1.28-2.82-1.72-1.1-.69-9.02 5.56-.41-.24-13.01-8.05a5.57 5.57 0 0 1-2.41-4.31c0-1.79.88-3.36 2.41-4.3Z" }), /* @__PURE__ */ jsx("path", { d: "M33.34 29.25 23.24 35.5a5.9 5.9 0 0 1-6.63-.01L1.94 26.43v4.86l12.47 7.71a11.8 11.8 0 0 0 5.52 1.55c1.97 0 3.88-.54 5.53-1.56l10.1-6.25a9.3 9.3 0 0 0 4.37-7.8 9.3 9.3 0 0 0-4.37-7.8l-3.26-2.02.01-.01-11.15-6.9a1.6 1.6 0 0 0-.39-.2 1.64 1.64 0 0 0-2.03.19l-9.59 5.93-.1.07-2.07 1.28 2.82 1.72 1.1.69 9.02-5.56.41.24 13.01 8.05a5.57 5.57 0 0 1 2.41 4.31c0 1.79-.88 3.36-2.41 4.3Z" })]
+});
+//#endregion
+export { StellaMark };

package/dist/components/stella-wordmark.d.ts

@@ -0,0 +1,5 @@
+import { SVGProps } from "react";
+//#region src/components/stella-wordmark.d.ts
+declare const StellaWordmarkLatin: (props: SVGProps<SVGSVGElement>) => import("react").JSX.Element;
+//#endregion
+export { StellaWordmarkLatin };

package/dist/components/stella-wordmark.js

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/stella-wordmark.tsx
+const StellaWordmarkLatin = (props) => /* @__PURE__ */ jsxs("svg", {
+	"aria-hidden": "true",
+	fill: "currentColor",
+	viewBox: "0 0 573 151",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M23.54 44.93L59.65 22.32C63.19 20.1 67.28 18.94 71.49 18.94C75.7 18.94 79.79 20.1 83.32 22.32L135.77 55.14V37.56L91.2 9.63C85.32 5.96 78.5 3.99 71.49 3.99C64.48 3.99 57.63 5.93 51.74 9.63L15.63 32.24C5.85 38.39 0 48.96 0 60.52C0 72.08 5.85 82.65 15.63 88.77L27.27 96.05L67.11 121.04C67.63 121.36 68.08 121.59 68.5 121.75C70.94 122.68 73.58 122.42 75.77 121.07L110.05 99.62C110.05 99.62 110.3 99.46 110.4 99.36L117.8 94.72L107.73 88.48L103.78 86L71.55 106.13L70.07 105.26L23.57 76.11C18.11 72.66 14.95 66.99 14.95 60.52C14.95 54.05 18.11 48.38 23.57 44.93H23.54Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M119.18 109.86L83.07 132.47C79.53 134.7 75.44 135.85 71.23 135.85C67.02 135.85 62.93 134.7 59.4 132.47L6.91 99.65V117.24L51.49 145.13C57.37 148.8 64.19 150.77 71.2 150.77C78.21 150.77 85.06 148.84 90.94 145.13L127.06 122.52C136.83 116.4 142.69 105.84 142.69 94.27C142.69 82.71 136.83 72.15 127.06 66.03L115.42 58.75L75.57 33.75C75.06 33.43 74.61 33.21 74.19 33.05C71.75 32.11 69.11 32.37 66.92 33.72L32.64 55.17C32.64 55.17 32.38 55.33 32.29 55.43L24.89 60.07L34.96 66.32L38.91 68.8L71.13 48.67L72.61 49.54L119.12 78.69C124.58 82.13 127.73 87.8 127.73 94.27C127.73 100.75 124.58 106.42 119.12 109.86H119.18Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M230.38 123.02C212.11 123.02 195.46 115.06 189.49 98.78L200.89 89.91C203.96 99.87 213.55 109.82 230.92 109.82C241.23 109.82 248.11 105.84 248.11 98.06C248.11 90.1 240.15 87.56 229.83 85.21L218.26 82.5C205.77 79.6 192.2 73.63 192.2 57.53C192.2 41.61 204.51 31.84 223.5 31.84C241.96 31.84 254.8 41.61 259.69 53.19L247.75 62.05C243.4 51.74 235.08 45.23 222.6 45.23C213.55 45.23 207.04 49.21 207.04 56.63C207.04 64.41 212.83 67.12 224.77 70.01L235.99 72.91C255.71 77.61 262.22 85.75 262.22 97.88C262.22 115.24 247.38 123.02 230.38 123.02Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M304.21 123.2C289.92 123.2 279.79 113.8 279.79 98.78V45.95H265.67V33.65H279.79V22.43L295.52 10.85V33.65H324.29V45.95H295.52V94.08C295.52 105.29 300.77 108.01 307.65 108.01C315.43 108.01 320.85 101.49 323.21 96.07L328.45 111.63C324.65 117.6 316.33 123.2 304.21 123.2Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M371.45 123.02C346.66 123.02 329.48 105.29 329.48 77.43C329.48 49.75 346.48 31.84 370.54 31.84C395.33 31.84 410.34 48.3 410.34 73.99C410.34 76.71 409.98 79.42 409.62 81.05H344.67C345.58 99.5 355.89 110 371.45 110C389 110 396.05 100.41 399.49 92.81L409.08 103.66C402.57 114.16 390.44 123.02 371.45 123.02ZM370.54 45.05C356.43 45.05 347.02 53.37 345.03 69.65H396.23C394.6 53.55 385.2 45.05 370.54 45.05Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M442.77 121.21H427.03V0H442.77V121.21Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M478.55 121.21H462.81V0H478.55V121.21Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M516.68 123.02C501.84 123.02 493.52 114.52 493.52 102.94C493.52 91.18 502.39 83.76 514.87 78.16L546.53 64.04C545.99 53.73 541.1 46.13 527.35 46.13C514.87 46.13 506.55 53.37 502.02 62.96L491.35 51.92C496.6 42.88 509.62 31.84 529.16 31.84C550.69 31.84 562.27 44.69 562.27 65.49V101.49C562.27 105.66 563.9 106.92 567.15 106.92H572.76V121.21H562.63C553.58 121.21 547.07 116.87 547.07 104.57V98.42C544.18 110 534.77 123.02 516.68 123.02ZM509.44 100.41C509.44 106.38 513.6 110 521.74 110C536.58 110 547.07 100.23 547.07 87.56V75.44L521.56 87.38C513.24 91.36 509.44 94.98 509.44 100.41Z" })
+	]
+});
+//#endregion
+export { StellaWordmarkLatin };

package/dist/components/table.d.ts

@@ -0,0 +1,20 @@
+import * as React$1 from "react";
+//#region src/components/table.d.ts
+declare const Table: ({ className, ...props }: React$1.ComponentProps<"table">) => React$1.JSX.Element;
+declare const TableHeader: ({ className, ...props }: React$1.ComponentProps<"thead">) => React$1.JSX.Element;
+declare const TableBody: ({ className, ...props }: React$1.ComponentProps<"tbody">) => React$1.JSX.Element;
+declare const TableFooter: ({ className, ...props }: React$1.ComponentProps<"tfoot">) => React$1.JSX.Element;
+declare const TableRow: ({ className, ...props }: React$1.ComponentProps<"tr">) => React$1.JSX.Element;
+declare const TableHead: ({ className, ...props }: React$1.ComponentProps<"th">) => React$1.JSX.Element;
+declare const TableCell: ({ className, ...props }: React$1.ComponentProps<"td">) => React$1.JSX.Element;
+type SortDirection = "asc" | "desc" | null;
+type SortableHeadProps = Omit<React$1.ComponentProps<"th">, "onClick"> & {
+  sortDirection?: SortDirection;
+  onSort: () => void;
+  /** Rendered next to the sort button inside the same cell (e.g. filter icon). */
+  trailing?: React$1.ReactNode;
+};
+declare const SortableHead: ({ children, sortDirection, onSort, trailing, className, ...props }: SortableHeadProps) => React$1.JSX.Element;
+declare const TableCaption: ({ className, ...props }: React$1.ComponentProps<"caption">) => React$1.JSX.Element;
+//#endregion
+export { type SortDirection, SortableHead, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };

package/dist/components/table.js

@@ -0,0 +1,80 @@
+import { cn } from "../lib/utils.js";
+import { ArrowDownIcon, ArrowUpIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/table.tsx
+const Table = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: "relative w-full overflow-x-auto",
+	"data-slot": "table-container",
+	children: /* @__PURE__ */ jsx("table", {
+		className: cn("w-full caption-bottom text-sm in-data-[slot=frame]:border-separate in-data-[slot=frame]:border-spacing-0", className),
+		"data-slot": "table",
+		...props
+	})
+});
+const TableHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("thead", {
+	className: cn("[&_tr]:border-b in-data-[slot=frame]:**:[th]:h-9 in-data-[slot=frame]:*:[tr]:border-none in-data-[slot=frame]:*:[tr]:hover:bg-transparent", className),
+	"data-slot": "table-header",
+	...props
+});
+const TableBody = ({ className, ...props }) => /* @__PURE__ */ jsx("tbody", {
+	className: cn("in-data-[slot=frame]:*:[tr]:*:[td]:bg-background in-data-[slot=frame]:*:[tr]:data-[state=selected]:*:[td]:bg-muted/72 relative before:pointer-events-none before:absolute before:inset-px before:rounded-[calc(var(--radius-xl)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] not-in-data-[slot=frame]:before:hidden in-data-[slot=frame]:rounded-xl in-data-[slot=frame]:shadow-xs/5 dark:before:shadow-[0_-1px_--theme(--color-white/8%)] [&_tr:last-child]:border-0 in-data-[slot=frame]:*:[tr]:border-0 in-data-[slot=frame]:*:[tr]:*:[td]:border-b in-data-[slot=frame]:*:[tr]:*:[td]:bg-clip-padding in-data-[slot=frame]:*:[tr]:first:*:[td]:first:rounded-ss-xl in-data-[slot=frame]:*:[tr]:*:[td]:first:border-s in-data-[slot=frame]:*:[tr]:first:*:[td]:border-t in-data-[slot=frame]:*:[tr]:last:*:[td]:last:rounded-ee-xl in-data-[slot=frame]:*:[tr]:*:[td]:last:border-e in-data-[slot=frame]:*:[tr]:first:*:[td]:last:rounded-se-xl in-data-[slot=frame]:*:[tr]:last:*:[td]:first:rounded-es-xl in-data-[slot=frame]:*:[tr]:hover:*:[td]:bg-transparent", className),
+	"data-slot": "table-body",
+	...props
+});
+const TableFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("tfoot", {
+	className: cn("bg-muted/72 border-t font-medium in-data-[slot=frame]:border-none in-data-[slot=frame]:bg-transparent in-data-[slot=frame]:*:[tr]:hover:bg-transparent [&>tr]:last:border-b-0", className),
+	"data-slot": "table-footer",
+	...props
+});
+const TableRow = ({ className, ...props }) => /* @__PURE__ */ jsx("tr", {
+	className: cn("hover:bg-muted/72 data-[state=selected]:bg-muted/72 border-b transition-colors in-data-[slot=frame]:hover:bg-transparent in-data-[slot=frame]:data-[state=selected]:bg-transparent", className),
+	"data-slot": "table-row",
+	...props
+});
+const TableHead = ({ className, ...props }) => /* @__PURE__ */ jsx("th", {
+	className: cn("text-muted-foreground h-10 px-2.5 text-start align-middle leading-none font-medium whitespace-nowrap has-[[role=checkbox]]:w-px has-[[role=checkbox]]:pe-0", className),
+	"data-slot": "table-head",
+	...props
+});
+const TableCell = ({ className, ...props }) => /* @__PURE__ */ jsx("td", {
+	className: cn("p-2.5 align-middle leading-none whitespace-nowrap in-data-[slot=frame]:first:p-[calc(--spacing(2.5)-1px)] in-data-[slot=frame]:last:p-[calc(--spacing(2.5)-1px)] has-[[role=checkbox]]:pe-0", className),
+	"data-slot": "table-cell",
+	...props
+});
+const SortableHead = ({ children, sortDirection = null, onSort, trailing, className, ...props }) => {
+	let ariaSort = "none";
+	if (sortDirection === "asc") ariaSort = "ascending";
+	else if (sortDirection === "desc") ariaSort = "descending";
+	let sortIcon = null;
+	if (sortDirection === "asc") sortIcon = /* @__PURE__ */ jsx(ArrowUpIcon, { className: "size-3" });
+	else if (sortDirection === "desc") sortIcon = /* @__PURE__ */ jsx(ArrowDownIcon, { className: "size-3" });
+	return /* @__PURE__ */ jsx(TableHead, {
+		"aria-sort": ariaSort,
+		className,
+		...props,
+		onClick: void 0,
+		children: /* @__PURE__ */ jsxs("span", {
+			className: "inline-flex items-center gap-1",
+			children: [/* @__PURE__ */ jsxs("button", {
+				className: "text-muted-foreground hover:text-foreground inline-flex cursor-pointer items-center gap-1 font-medium select-none",
+				onClick: onSort,
+				type: "button",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "truncate",
+					children
+				}), /* @__PURE__ */ jsx("span", {
+					"aria-hidden": true,
+					className: "inline-flex w-3 shrink-0 justify-center",
+					children: sortIcon
+				})]
+			}), trailing]
+		})
+	});
+};
+const TableCaption = ({ className, ...props }) => /* @__PURE__ */ jsx("caption", {
+	className: cn("text-muted-foreground mt-4 text-sm in-data-[slot=frame]:my-4", className),
+	"data-slot": "table-caption",
+	...props
+});
+//#endregion
+export { SortableHead, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };

package/dist/components/tabs.d.ts

@@ -0,0 +1,11 @@
+import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
+//#region src/components/tabs.d.ts
+type TabsVariant = "default" | "underline";
+declare const Tabs: ({ className, ...props }: Tabs$1.Root.Props) => import("react").JSX.Element;
+declare const TabsList: ({ variant, className, children, ref, ...props }: Tabs$1.List.Props & {
+  variant?: TabsVariant;
+}) => import("react").JSX.Element;
+declare const TabsTab: ({ className, ...props }: Tabs$1.Tab.Props) => import("react").JSX.Element;
+declare const TabsPanel: ({ className, ...props }: Tabs$1.Panel.Props) => import("react").JSX.Element;
+//#endregion
+export { Tabs, TabsPanel as TabsContent, TabsPanel, TabsList, TabsTab, TabsTab as TabsTrigger };

package/dist/components/tabs.js

@@ -0,0 +1,46 @@
+"use client";
+import { cn, composeRefs } from "../lib/utils.js";
+import { hasTabOrderChanged } from "../lib/tab-order.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
+//#region src/components/tabs.tsx
+const useIsoLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
+const Tabs = ({ className, ...props }) => /* @__PURE__ */ jsx(Tabs$1.Root, {
+	className: cn("flex flex-col gap-2 data-[orientation=vertical]:flex-row", className),
+	"data-slot": "tabs",
+	...props
+});
+const TabsList = ({ variant = "default", className, children, ref, ...props }) => {
+	const listRef = useRef(null);
+	const tabOrderRef = useRef([]);
+	const [, setRemeasureToken] = useState(0);
+	useIsoLayoutEffect(() => {
+		const tabs = listRef.current ? [...listRef.current.children] : [];
+		const previousTabs = tabOrderRef.current;
+		tabOrderRef.current = tabs;
+		if (hasTabOrderChanged(previousTabs, tabs)) setRemeasureToken((token) => token + 1);
+	});
+	return /* @__PURE__ */ jsxs(Tabs$1.List, {
+		className: cn("text-muted-foreground relative z-0 flex w-fit max-w-full items-center justify-center-safe gap-x-0.5", "scrollbar-none overflow-auto data-[orientation=horizontal]:overscroll-x-contain data-[orientation=vertical]:overscroll-y-contain [&::-webkit-scrollbar]:hidden", "data-[orientation=vertical]:flex-col", variant === "default" ? "bg-muted text-foreground-label rounded-lg p-0.5" : "*:data-[slot=tabs-tab]:hover:bg-accent data-[orientation=horizontal]:py-1 data-[orientation=vertical]:px-1", className),
+		"data-slot": "tabs-list",
+		ref: composeRefs(listRef, ref),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(Tabs$1.Indicator, {
+			className: cn("absolute bottom-0 left-0 h-(--active-tab-height) w-(--active-tab-width) translate-x-(--active-tab-left) -translate-y-(--active-tab-bottom) transition-[width,translate] duration-200 ease-in-out", variant === "underline" ? "bg-primary z-10 data-[orientation=horizontal]:h-0.5 data-[orientation=vertical]:w-0.5 data-[orientation=vertical]:-translate-x-px" : "bg-background dark:bg-input -z-1 rounded-md shadow-sm/5"),
+			"data-slot": "tab-indicator"
+		})]
+	});
+};
+const TabsTab = ({ className, ...props }) => /* @__PURE__ */ jsx(Tabs$1.Tab, {
+	className: cn("hover:text-foreground focus-visible:ring-ring data-active:text-foreground relative flex h-9 shrink-0 grow cursor-pointer items-center justify-center gap-1.5 rounded-md border border-transparent px-[calc(--spacing(2.5)-1px)] text-base font-medium whitespace-nowrap transition-[color,background-color,box-shadow] outline-none focus-visible:ring-2 focus-visible:ring-inset data-disabled:pointer-events-none data-disabled:opacity-64 data-[orientation=vertical]:w-full data-[orientation=vertical]:justify-start sm:h-8 sm:text-sm [&_svg]:pointer-events-none [&_svg]:-mx-0.5 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", className),
+	"data-slot": "tabs-tab",
+	...props
+});
+const TabsPanel = ({ className, ...props }) => /* @__PURE__ */ jsx(Tabs$1.Panel, {
+	className: cn("flex-1 outline-none", className),
+	"data-slot": "tabs-content",
+	...props
+});
+//#endregion
+export { Tabs, TabsPanel as TabsContent, TabsPanel, TabsList, TabsTab, TabsTab as TabsTrigger };

package/dist/components/textarea.d.ts

@@ -0,0 +1,9 @@
+import * as React$1 from "react";
+//#region src/components/textarea.d.ts
+type TextareaProps = React$1.ComponentProps<"textarea"> & {
+  size?: "sm" | "default" | "lg" | number;
+  unstyled?: boolean;
+};
+declare const Textarea: ({ className, size, unstyled, dir, onChange, ...props }: TextareaProps) => React$1.JSX.Element;
+//#endregion
+export { Textarea, type TextareaProps };