@aaas-pro/library 0.0.0-stage → 0.1.0

package/dist/components/ui/select.js

@@ -0,0 +1,215 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useThemePortalContainer } from "../../theme/index.js";
+import { Root, Portal, Content, Viewport, Group, Item, ItemIndicator, ItemText, Label, ScrollDownButton, ScrollUpButton, Separator, useSelectState, Trigger, Icon, Value } from "../../primitives/select.js";
+import { CheckIcon, ChevronDownIcon, ChevronUpIcon, XIcon } from "../../icons/index.js";
+import { cn } from "../../lib/utils.js";
+function Select({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Root, { "data-slot": "select", ...props });
+}
+function SelectGroup({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Group, { "data-slot": "select-group", ...props });
+}
+function SelectValue({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Value, { "data-slot": "select-value", className: cn("flex min-w-0 items-center gap-2 truncate", className), ...props });
+}
+function SelectTrigger({
+  className,
+  size = "default",
+  children,
+  onClear,
+  ...props
+}) {
+  const selection = useSelectState();
+  const disabled = Boolean(props.disabled || selection.disabled);
+  return /* @__PURE__ */ jsxs(
+    Trigger,
+    {
+      "data-slot": "select-trigger",
+      "data-size": size,
+      className: cn(
+        "group border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/15 data-[state=open]:border-ring data-[state=open]:ring-2 data-[state=open]:ring-ring/15 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex w-fit items-center gap-2 rounded-md border bg-card px-3 py-2 text-sm whitespace-nowrap transition-[color,border-color,box-shadow] duration-150 outline-none focus-visible:ring-2 hover:not-disabled:border-primary disabled:cursor-not-allowed disabled:bg-muted disabled:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { "data-slot": "select-trigger-label", className: "flex min-w-0 flex-1 items-center gap-2 overflow-hidden text-start", children }),
+        /* @__PURE__ */ jsxs("span", { "data-slot": "select-trigger-actions", className: "ml-auto inline-flex shrink-0 items-center gap-1", children: [
+          onClear && selection.value && !disabled && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "select-clear",
+              role: "button",
+              "aria-label": "清空选择",
+              tabIndex: 0,
+              className: "pointer-events-auto grid size-5 shrink-0 cursor-pointer place-items-center rounded-full text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 group-focus-within:opacity-100 hover:bg-muted hover:text-foreground focus-visible:opacity-100 focus-visible:outline-2 focus-visible:outline-ring",
+              onPointerDown: (e) => {
+                e.stopPropagation();
+              },
+              onKeyDown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  e.stopPropagation();
+                  onClear();
+                }
+              },
+              onClick: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                onClear();
+              },
+              children: /* @__PURE__ */ jsx(XIcon, { className: "size-3 text-current" })
+            }
+          ),
+          /* @__PURE__ */ jsx(Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-3.5 text-muted-foreground transition-transform duration-150 group-data-[state=open]:rotate-180" }) })
+        ] })
+      ]
+    }
+  );
+}
+function SelectContent({
+  className,
+  children,
+  position = "popper",
+  align = "start",
+  sideOffset = 4,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Portal, { container: useThemePortalContainer(), children: /* @__PURE__ */ jsxs(
+    Content,
+    {
+      "data-slot": "select-content",
+      className: cn(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 relative z-[80] flex max-h-[min(20rem,var(--aaas-content-available-height))] max-w-[calc(100vw-16px)] min-w-[8rem] flex-col origin-(--aaas-content-transform-origin) overflow-hidden rounded-lg border border-border p-1 shadow-md",
+        className
+      ),
+      position,
+      align,
+      sideOffset,
+      style: { maxHeight: "min(20rem, var(--aaas-content-available-height))", ...style },
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsx(
+          Viewport,
+          {
+            "data-slot": "select-viewport",
+            className: cn(
+              "min-h-0 flex-1",
+              position === "popper" && "w-full scroll-my-1"
+            ),
+            children
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectScrollDownButton, {})
+      ]
+    }
+  ) });
+}
+function SelectLabel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Label,
+    {
+      "data-slot": "select-label",
+      className: cn("text-muted-foreground px-3 py-2 text-xs font-medium", className),
+      ...props
+    }
+  );
+}
+function SelectItem({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    Item,
+    {
+      "data-slot": "select-item",
+      className: cn(
+        "hover:bg-muted focus:bg-muted focus:text-foreground data-[state=checked]:bg-primary/10 data-[state=checked]:font-medium data-[state=checked]:text-primary data-[state=checked]:hover:bg-primary/15 data-[state=checked]:focus:bg-primary/15 [&_svg:not([class*='text-'])]:text-muted-foreground relative flex min-h-8 w-full cursor-pointer items-center gap-2 rounded-md py-1.5 pr-9 pl-3 text-left text-sm outline-none select-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-45 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-slot": "select-item-indicator",
+            className: "absolute right-3 flex size-3.5 items-center justify-center",
+            children: /* @__PURE__ */ jsx(ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { className: "size-3.5 text-primary" }) })
+          }
+        ),
+        /* @__PURE__ */ jsx(ItemText, { children })
+      ]
+    }
+  );
+}
+function SelectSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Separator,
+    {
+      "data-slot": "select-separator",
+      className: cn("bg-border pointer-events-none my-1 h-px", className),
+      ...props
+    }
+  );
+}
+function SelectScrollUpButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ScrollUpButton,
+    {
+      "data-slot": "select-scroll-up-button",
+      className: cn(
+        "flex h-6 w-full shrink-0 cursor-pointer items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: "size-4" })
+    }
+  );
+}
+function SelectScrollDownButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ScrollDownButton,
+    {
+      "data-slot": "select-scroll-down-button",
+      className: cn(
+        "flex h-6 w-full shrink-0 cursor-pointer items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4" })
+    }
+  );
+}
+export {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectScrollDownButton,
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue
+};

package/dist/components/ui/separator.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import * as SeparatorPrimitive from "../../primitives/separator";
+declare function Separator({ className, orientation, decorative, ...props }: React.ComponentProps<typeof SeparatorPrimitive.Root>): React.JSX.Element;
+export { Separator };

package/dist/components/ui/separator.js

@@ -0,0 +1,26 @@
+import { jsx } from "react/jsx-runtime";
+import { Root } from "../../primitives/separator.js";
+import { cn } from "../../lib/utils.js";
+function Separator({
+  className,
+  orientation = "horizontal",
+  decorative = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Root,
+    {
+      "data-slot": "separator",
+      decorative,
+      orientation,
+      className: cn(
+        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+        className
+      ),
+      ...props
+    }
+  );
+}
+export {
+  Separator
+};

package/dist/components/ui/sheet.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import * as SheetPrimitive from "../../primitives/dialog";
+declare function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>): React.JSX.Element;
+declare function SheetTrigger({ ...props }: React.ComponentProps<typeof SheetPrimitive.Trigger>): React.JSX.Element;
+declare function SheetClose({ ...props }: React.ComponentProps<typeof SheetPrimitive.Close>): React.JSX.Element;
+declare function SheetContent({ className, children, side, ...props }: React.ComponentProps<typeof SheetPrimitive.Content> & {
+    side?: "top" | "right" | "bottom" | "left";
+}): React.JSX.Element;
+declare function SheetHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function SheetFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>): React.JSX.Element;
+declare function SheetDescription({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Description>): React.JSX.Element;
+export { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, };

package/dist/components/ui/sheet.js

@@ -0,0 +1,127 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useThemePortalContainer } from "../../theme/index.js";
+import { Root, Close, Content, Description, Title, Trigger, Portal, Overlay } from "../../primitives/dialog.js";
+import { XIcon } from "../../icons/index.js";
+import { cn } from "../../lib/utils.js";
+function Sheet({ ...props }) {
+  return /* @__PURE__ */ jsx(Root, { "data-slot": "sheet", ...props });
+}
+function SheetTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Trigger, { "data-slot": "sheet-trigger", ...props });
+}
+function SheetClose({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Close, { "data-slot": "sheet-close", ...props });
+}
+function SheetPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Portal, { container: useThemePortalContainer(), "data-slot": "sheet-portal", ...props });
+}
+function SheetOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Overlay,
+    {
+      "data-slot": "sheet-overlay",
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[60] bg-[rgb(12_22_18/0.45)] backdrop-blur-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function SheetContent({
+  className,
+  children,
+  side = "right",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(SheetPortal, { children: [
+    /* @__PURE__ */ jsx(SheetOverlay, {}),
+    /* @__PURE__ */ jsxs(
+      Content,
+      {
+        "data-slot": "sheet-content",
+        className: cn(
+          "bg-card text-card-foreground data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-[60] flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+          side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
+          side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
+          side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
+          side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          /* @__PURE__ */ jsxs(Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
+            /* @__PURE__ */ jsx(XIcon, { className: "size-4" }),
+            /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function SheetHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sheet-header",
+      className: cn("flex flex-col gap-1.5 p-4", className),
+      ...props
+    }
+  );
+}
+function SheetFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sheet-footer",
+      className: cn("mt-auto flex flex-col gap-2 p-4", className),
+      ...props
+    }
+  );
+}
+function SheetTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Title,
+    {
+      "data-slot": "sheet-title",
+      className: cn("text-foreground font-semibold", className),
+      ...props
+    }
+  );
+}
+function SheetDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Description,
+    {
+      "data-slot": "sheet-description",
+      className: cn("text-muted-foreground text-sm", className),
+      ...props
+    }
+  );
+}
+export {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger
+};

package/dist/components/ui/sidebar.d.ts

@@ -0,0 +1,72 @@
+import * as React from 'react';
+import { type VariantProps } from '../../lib/variants';
+import { Button } from './button';
+import { Input } from './input';
+import { Separator } from './separator';
+import { TooltipContent } from './tooltip';
+type 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.Element;
+declare function Sidebar({ side, variant, collapsible, className, children, ...props }: React.ComponentProps<'div'> & {
+    side?: 'left' | 'right';
+    variant?: 'sidebar' | 'floating' | 'inset';
+    collapsible?: 'offcanvas' | 'icon' | 'none';
+}): React.JSX.Element;
+declare function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
+declare function SidebarRail({ className, ...props }: React.ComponentProps<'button'>): React.JSX.Element;
+declare function SidebarInset({ className, ...props }: React.ComponentProps<'main'>): React.JSX.Element;
+declare function SidebarInput({ className, ...props }: React.ComponentProps<typeof Input>): React.JSX.Element;
+declare function SidebarHeader({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare function SidebarFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare function SidebarSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): React.JSX.Element;
+declare function SidebarContent({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare function SidebarGroupLabel({ className, asChild, ...props }: React.ComponentProps<'div'> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+declare function SidebarGroupAction({ className, asChild, ...props }: React.ComponentProps<'button'> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+declare function SidebarGroupContent({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare function SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>): React.JSX.Element;
+declare function SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+declare const sidebarMenuButtonVariants: (props?: ({
+    variant?: "outline" | "default" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & {
+    class?: import("../../lib/class-names").ClassValue;
+    className?: import("../../lib/class-names").ClassValue;
+}) | undefined) => string;
+declare function SidebarMenuButton({ asChild, isActive, variant, size, tooltip, className, ...props }: React.ComponentProps<'button'> & {
+    asChild?: boolean;
+    isActive?: boolean;
+    tooltip?: string | React.ComponentProps<typeof TooltipContent>;
+} & VariantProps<typeof sidebarMenuButtonVariants>): React.JSX.Element;
+declare function SidebarMenuAction({ className, asChild, showOnHover, ...props }: React.ComponentProps<'button'> & {
+    asChild?: boolean;
+    showOnHover?: boolean;
+}): React.JSX.Element;
+declare function SidebarMenuBadge({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare function SidebarMenuSkeleton({ className, showIcon, ...props }: React.ComponentProps<'div'> & {
+    showIcon?: boolean;
+}): React.JSX.Element;
+declare function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>): React.JSX.Element;
+declare function SidebarMenuSubItem({ className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+declare function SidebarMenuSubButton({ asChild, size, isActive, className, ...props }: React.ComponentProps<'a'> & {
+    asChild?: boolean;
+    size?: 'sm' | 'md';
+    isActive?: boolean;
+}): React.JSX.Element;
+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, };