@ucdjs-internal/shared-ui 0.1.0

package/dist/ui/sheet.mjs

@@ -0,0 +1,318 @@
+import { cn } from "../lib/utils.mjs";
+import { Button } from "./button.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c } from "react/compiler-runtime";
+import { X } from "lucide-react";
+import { Dialog } from "@base-ui/react/dialog";
+
+//#region src/ui/sheet.tsx
+function Sheet(t0) {
+	const $ = c(4);
+	let props;
+	if ($[0] !== t0) {
+		({...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+	} else props = $[1];
+	let t1;
+	if ($[2] !== props) {
+		t1 = /* @__PURE__ */ jsx(Dialog.Root, {
+			"data-slot": "sheet",
+			...props
+		});
+		$[2] = props;
+		$[3] = t1;
+	} else t1 = $[3];
+	return t1;
+}
+function SheetTrigger(t0) {
+	const $ = c(4);
+	let props;
+	if ($[0] !== t0) {
+		({...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+	} else props = $[1];
+	let t1;
+	if ($[2] !== props) {
+		t1 = /* @__PURE__ */ jsx(Dialog.Trigger, {
+			"data-slot": "sheet-trigger",
+			...props
+		});
+		$[2] = props;
+		$[3] = t1;
+	} else t1 = $[3];
+	return t1;
+}
+function SheetClose(t0) {
+	const $ = c(4);
+	let props;
+	if ($[0] !== t0) {
+		({...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+	} else props = $[1];
+	let t1;
+	if ($[2] !== props) {
+		t1 = /* @__PURE__ */ jsx(Dialog.Close, {
+			"data-slot": "sheet-close",
+			...props
+		});
+		$[2] = props;
+		$[3] = t1;
+	} else t1 = $[3];
+	return t1;
+}
+function SheetPortal(t0) {
+	const $ = c(4);
+	let props;
+	if ($[0] !== t0) {
+		({...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+	} else props = $[1];
+	let t1;
+	if ($[2] !== props) {
+		t1 = /* @__PURE__ */ jsx(Dialog.Portal, {
+			"data-slot": "sheet-portal",
+			...props
+		});
+		$[2] = props;
+		$[3] = t1;
+	} else t1 = $[3];
+	return t1;
+}
+function SheetOverlay(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("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Dialog.Backdrop, {
+			"data-slot": "sheet-overlay",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function SheetContent(t0) {
+	const $ = c(17);
+	let children;
+	let className;
+	let props;
+	let t1;
+	let t2;
+	if ($[0] !== t0) {
+		({className, children, side: t1, showCloseButton: t2, ...props} = t0);
+		$[0] = t0;
+		$[1] = children;
+		$[2] = className;
+		$[3] = props;
+		$[4] = t1;
+		$[5] = t2;
+	} else {
+		children = $[1];
+		className = $[2];
+		props = $[3];
+		t1 = $[4];
+		t2 = $[5];
+	}
+	const side = t1 === void 0 ? "right" : t1;
+	const showCloseButton = t2 === void 0 ? true : t2;
+	let t3;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx(SheetOverlay, {});
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== className) {
+		t4 = cn("bg-background data-open:animate-in data-closed:animate-out data-[side=right]:data-closed:slide-out-to-right-10 data-[side=right]:data-open:slide-in-from-right-10 data-[side=left]:data-closed:slide-out-to-left-10 data-[side=left]:data-open:slide-in-from-left-10 data-[side=top]:data-closed:slide-out-to-top-10 data-[side=top]:data-open:slide-in-from-top-10 data-closed:fade-out-0 data-open:fade-in-0 data-[side=bottom]:data-closed:slide-out-to-bottom-10 data-[side=bottom]:data-open:slide-in-from-bottom-10 fixed z-50 flex flex-col gap-4 bg-clip-padding text-sm shadow-lg transition duration-200 ease-in-out data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", className);
+		$[7] = className;
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== showCloseButton) {
+		t5 = showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, {
+			"data-slot": "sheet-close",
+			render: /* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				className: "absolute top-3 right-3",
+				size: "icon-sm"
+			}),
+			children: [/* @__PURE__ */ jsx(X, {}), /* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				children: "Close"
+			})]
+		});
+		$[9] = showCloseButton;
+		$[10] = t5;
+	} else t5 = $[10];
+	let t6;
+	if ($[11] !== children || $[12] !== props || $[13] !== side || $[14] !== t4 || $[15] !== t5) {
+		t6 = /* @__PURE__ */ jsxs(SheetPortal, { children: [t3, /* @__PURE__ */ jsxs(Dialog.Popup, {
+			"data-slot": "sheet-content",
+			"data-side": side,
+			className: t4,
+			...props,
+			children: [children, t5]
+		})] });
+		$[11] = children;
+		$[12] = props;
+		$[13] = side;
+		$[14] = t4;
+		$[15] = t5;
+		$[16] = t6;
+	} else t6 = $[16];
+	return t6;
+}
+function SheetHeader(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-0.5 p-4 flex flex-col", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "sheet-header",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function SheetFooter(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-2 p-4 mt-auto flex flex-col", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			"data-slot": "sheet-footer",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function SheetTitle(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 text-base font-medium", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Dialog.Title, {
+			"data-slot": "sheet-title",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+function SheetDescription(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(Dialog.Description, {
+			"data-slot": "sheet-description",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+
+//#endregion
+export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };

package/dist/ui/sidebar.d.mts

@@ -0,0 +1,160 @@
+import { Button } from "./button.mjs";
+import { Input } from "./input.mjs";
+import { Separator } from "./separator.mjs";
+import { TooltipContent } from "./tooltip.mjs";
+import * as React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import { useRender } from "@base-ui/react/use-render";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/ui/sidebar.d.ts
+interface SidebarContextProps {
+  state: "expanded" | "collapsed";
+  open: boolean;
+  setOpen: (open: boolean) => void;
+  openMobile: boolean;
+  setOpenMobile: (open: boolean) => void;
+  isMobile: boolean;
+  toggleSidebar: () => void;
+}
+declare function useSidebar(): SidebarContextProps;
+declare function SidebarProvider({
+  defaultOpen,
+  open: openProp,
+  onOpenChange: setOpenProp,
+  className,
+  style,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  defaultOpen?: boolean;
+  open?: boolean;
+  onOpenChange?: (open: boolean) => void;
+}): react_jsx_runtime0.JSX.Element;
+declare function Sidebar({
+  side,
+  variant,
+  collapsible,
+  className,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  side?: "left" | "right";
+  variant?: "sidebar" | "floating" | "inset";
+  collapsible?: "offExamples" | "icon" | "none";
+}): react_jsx_runtime0.JSX.Element;
+declare function SidebarTrigger({
+  className,
+  onClick,
+  ...props
+}: React.ComponentProps<typeof Button>): react_jsx_runtime0.JSX.Element;
+declare function SidebarRail({
+  className,
+  ...props
+}: React.ComponentProps<"button">): react_jsx_runtime0.JSX.Element;
+declare function SidebarInset({
+  className,
+  ...props
+}: React.ComponentProps<"main">): react_jsx_runtime0.JSX.Element;
+declare function SidebarInput({
+  className,
+  ...props
+}: React.ComponentProps<typeof Input>): react_jsx_runtime0.JSX.Element;
+declare function SidebarHeader({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function SidebarFooter({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function SidebarSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof Separator>): react_jsx_runtime0.JSX.Element;
+declare function SidebarContent({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function SidebarGroup({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function SidebarGroupLabel({
+  className,
+  render,
+  ...props
+}: useRender.ComponentProps<"div"> & React.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function SidebarGroupAction({
+  className,
+  render,
+  ...props
+}: useRender.ComponentProps<"button"> & React.ComponentProps<"button">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function SidebarGroupContent({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenu({
+  className,
+  ...props
+}: React.ComponentProps<"ul">): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenuItem({
+  className,
+  ...props
+}: React.ComponentProps<"li">): react_jsx_runtime0.JSX.Element;
+declare const sidebarMenuButtonVariants: (props?: ({
+  variant?: "default" | "outline" | null | undefined;
+  size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function SidebarMenuButton({
+  render,
+  isActive,
+  variant,
+  size,
+  tooltip,
+  className,
+  ...props
+}: useRender.ComponentProps<"button"> & React.ComponentProps<"button"> & {
+  isActive?: boolean;
+  tooltip?: string | React.ComponentProps<typeof TooltipContent>;
+} & VariantProps<typeof sidebarMenuButtonVariants>): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenuAction({
+  className,
+  render,
+  showOnHover,
+  ...props
+}: useRender.ComponentProps<"button"> & React.ComponentProps<"button"> & {
+  showOnHover?: boolean;
+}): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function SidebarMenuBadge({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenuSkeleton({
+  className,
+  showIcon,
+  ...props
+}: React.ComponentProps<"div"> & {
+  showIcon?: boolean;
+}): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenuSub({
+  className,
+  ...props
+}: React.ComponentProps<"ul">): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenuSubItem({
+  className,
+  ...props
+}: React.ComponentProps<"li">): react_jsx_runtime0.JSX.Element;
+declare function SidebarMenuSubButton({
+  render,
+  size,
+  isActive,
+  className,
+  ...props
+}: useRender.ComponentProps<"a"> & React.ComponentProps<"a"> & {
+  size?: "sm" | "md";
+  isActive?: boolean;
+}): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+//#endregion
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar };