@ucdjs-internal/shared-ui 0.1.0

package/dist/ui/breadcrumb.d.mts

@@ -0,0 +1,37 @@
+import * as React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/ui/breadcrumb.d.ts
+declare function Breadcrumb({
+  className,
+  ...props
+}: React.ComponentProps<"nav">): react_jsx_runtime0.JSX.Element;
+declare function BreadcrumbList({
+  className,
+  ...props
+}: React.ComponentProps<"ol">): react_jsx_runtime0.JSX.Element;
+declare function BreadcrumbItem({
+  className,
+  ...props
+}: React.ComponentProps<"li">): react_jsx_runtime0.JSX.Element;
+declare function BreadcrumbLink({
+  className,
+  render,
+  ...props
+}: useRender.ComponentProps<"a">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function BreadcrumbPage({
+  className,
+  ...props
+}: React.ComponentProps<"span">): react_jsx_runtime0.JSX.Element;
+declare function BreadcrumbSeparator({
+  children,
+  className,
+  ...props
+}: React.ComponentProps<"li">): react_jsx_runtime0.JSX.Element;
+declare function BreadcrumbEllipsis({
+  className,
+  ...props
+}: React.ComponentProps<"span">): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };

package/dist/ui/breadcrumb.mjs

@@ -0,0 +1,281 @@
+import { cn } from "../lib/utils.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c } from "react/compiler-runtime";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/ui/breadcrumb.tsx
+function Breadcrumb(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn(className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("nav", {
+			"aria-label": "breadcrumb",
+			"data-slot": "breadcrumb",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function BreadcrumbList(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("text-muted-foreground gap-1.5 text-sm flex flex-wrap items-center wrap-break-word", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("ol", {
+			"data-slot": "breadcrumb-list",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function BreadcrumbItem(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("gap-1 inline-flex items-center", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("li", {
+			"data-slot": "breadcrumb-item",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function BreadcrumbLink(t0) {
+	const $ = c(10);
+	let render;
+	let t1;
+	let t2;
+	let t3;
+	if ($[0] !== t0) {
+		const { className, render: t4, ...props } = t0;
+		render = t4;
+		t3 = useRender;
+		t1 = "a";
+		t2 = mergeProps({ className: cn("hover:text-foreground transition-colors", className) }, props);
+		$[0] = t0;
+		$[1] = render;
+		$[2] = t1;
+		$[3] = t2;
+		$[4] = t3;
+	} else {
+		render = $[1];
+		t1 = $[2];
+		t2 = $[3];
+		t3 = $[4];
+	}
+	let t4;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = { slot: "breadcrumb-link" };
+		$[5] = t4;
+	} else t4 = $[5];
+	let t5;
+	if ($[6] !== render || $[7] !== t1 || $[8] !== t2) {
+		t5 = {
+			defaultTagName: t1,
+			props: t2,
+			render,
+			state: t4
+		};
+		$[6] = render;
+		$[7] = t1;
+		$[8] = t2;
+		$[9] = t5;
+	} else t5 = $[9];
+	return t3(t5);
+}
+function BreadcrumbPage(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("text-foreground font-normal", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("span", {
+			"data-slot": "breadcrumb-page",
+			role: "link",
+			"aria-disabled": "true",
+			"aria-current": "page",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function BreadcrumbSeparator(t0) {
+	const $ = c(12);
+	let children;
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({children, className, ...props} = t0);
+		$[0] = t0;
+		$[1] = children;
+		$[2] = className;
+		$[3] = props;
+	} else {
+		children = $[1];
+		className = $[2];
+		props = $[3];
+	}
+	let t1;
+	if ($[4] !== className) {
+		t1 = cn("[&>svg]:size-3.5", className);
+		$[4] = className;
+		$[5] = t1;
+	} else t1 = $[5];
+	let t2;
+	if ($[6] !== children) {
+		t2 = children ?? /* @__PURE__ */ jsx(ChevronRight, { className: "[&>svg]:size-3.5" });
+		$[6] = children;
+		$[7] = t2;
+	} else t2 = $[7];
+	let t3;
+	if ($[8] !== props || $[9] !== t1 || $[10] !== t2) {
+		t3 = /* @__PURE__ */ jsx("li", {
+			"data-slot": "breadcrumb-separator",
+			role: "presentation",
+			"aria-hidden": "true",
+			className: t1,
+			...props,
+			children: t2
+		});
+		$[8] = props;
+		$[9] = t1;
+		$[10] = t2;
+		$[11] = t3;
+	} else t3 = $[11];
+	return t3;
+}
+function BreadcrumbEllipsis(t0) {
+	const $ = c(10);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("size-5 [&>svg]:size-4 flex items-center justify-center", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	let t3;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(MoreHorizontal, {});
+		t3 = /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "More"
+		});
+		$[5] = t2;
+		$[6] = t3;
+	} else {
+		t2 = $[5];
+		t3 = $[6];
+	}
+	let t4;
+	if ($[7] !== props || $[8] !== t1) {
+		t4 = /* @__PURE__ */ jsxs("span", {
+			"data-slot": "breadcrumb-ellipsis",
+			role: "presentation",
+			"aria-hidden": "true",
+			className: t1,
+			...props,
+			children: [t2, t3]
+		});
+		$[7] = props;
+		$[8] = t1;
+		$[9] = t4;
+	} else t4 = $[9];
+	return t4;
+}
+
+//#endregion
+export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };

package/dist/ui/button.d.mts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { Button as Button$1 } from "@base-ui/react/button";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/ui/button.d.ts
+declare const buttonVariants: (props?: ({
+  variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
+  size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function Button({
+  className,
+  variant,
+  size,
+  ...props
+}: Button$1.Props & VariantProps<typeof buttonVariants>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Button, buttonVariants };

package/dist/ui/button.mjs

@@ -0,0 +1,82 @@
+import { cn } from "../lib/utils.mjs";
+import { jsx } from "react/jsx-runtime";
+import { c } from "react/compiler-runtime";
+import { Button as Button$1 } from "@base-ui/react/button";
+import { cva } from "class-variance-authority";
+
+//#region src/ui/button.tsx
+const buttonVariants = cva("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none", {
+	variants: {
+		variant: {
+			default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+			outline: "border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground",
+			secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+			ghost: "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground",
+			destructive: "bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30",
+			link: "text-primary underline-offset-4 hover:underline"
+		},
+		size: {
+			"default": "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+			"xs": "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+			"sm": "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+			"lg": "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",
+			"icon": "size-8",
+			"icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+			"icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+			"icon-lg": "size-9"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function Button(t0) {
+	const $ = c(12);
+	let className;
+	let props;
+	let t1;
+	let t2;
+	if ($[0] !== t0) {
+		({className, variant: t1, size: t2, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+		$[3] = t1;
+		$[4] = t2;
+	} else {
+		className = $[1];
+		props = $[2];
+		t1 = $[3];
+		t2 = $[4];
+	}
+	const variant = t1 === void 0 ? "default" : t1;
+	const size = t2 === void 0 ? "default" : t2;
+	let t3;
+	if ($[5] !== className || $[6] !== size || $[7] !== variant) {
+		t3 = cn(buttonVariants({
+			variant,
+			size,
+			className
+		}));
+		$[5] = className;
+		$[6] = size;
+		$[7] = variant;
+		$[8] = t3;
+	} else t3 = $[8];
+	let t4;
+	if ($[9] !== props || $[10] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Button$1, {
+			"data-slot": "button",
+			className: t3,
+			...props
+		});
+		$[9] = props;
+		$[10] = t3;
+		$[11] = t4;
+	} else t4 = $[11];
+	return t4;
+}
+
+//#endregion
+export { Button, buttonVariants };

package/dist/ui/card.d.mts

@@ -0,0 +1,37 @@
+import * as React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/ui/card.d.ts
+declare function Card({
+  className,
+  size,
+  ...props
+}: React.ComponentProps<"div"> & {
+  size?: "default" | "sm";
+}): react_jsx_runtime0.JSX.Element;
+declare function CardHeader({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function CardTitle({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function CardDescription({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function CardAction({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function CardContent({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function CardFooter({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/ui/card.mjs

@@ -0,0 +1,239 @@
+import { cn } from "../lib/utils.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { c } from "react/compiler-runtime";
+
+//#region src/ui/card.tsx
+function Card(t0) {
+	const $ = c(10);
+	let className;
+	let props;
+	let t1;
+	if ($[0] !== t0) {
+		({className, size: t1, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+		$[3] = t1;
+	} else {
+		className = $[1];
+		props = $[2];
+		t1 = $[3];
+	}
+	const size = t1 === void 0 ? "default" : t1;
+	let t2;
+	if ($[4] !== className) {
+		t2 = cn("ring-foreground/10 bg-card text-card-foreground gap-4 overflow-hidden rounded-xl py-4 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col", className);
+		$[4] = className;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== props || $[7] !== size || $[8] !== t2) {
+		t3 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card",
+			"data-size": size,
+			className: t2,
+			...props
+		});
+		$[6] = props;
+		$[7] = size;
+		$[8] = t2;
+		$[9] = t3;
+	} else t3 = $[9];
+	return t3;
+}
+function CardHeader(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3 group/card-header @container/card-header grid auto-rows-min items-start has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card-header",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function CardTitle(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("text-base leading-snug font-medium group-data-[size=sm]/card:text-sm", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card-title",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function CardDescription(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("text-muted-foreground text-sm", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card-description",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function CardAction(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card-action",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function CardContent(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("px-4 group-data-[size=sm]/card:px-3", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card-content",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function CardFooter(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("bg-muted/50 rounded-b-xl border-t p-4 group-data-[size=sm]/card:p-3 flex items-center", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "card-footer",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+
+//#endregion
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/ui/checkbox.d.mts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
+
+//#region src/ui/checkbox.d.ts
+declare function Checkbox({
+  className,
+  ...props
+}: Checkbox$1.Root.Props): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Checkbox };