@alpic-ai/ui 0.0.0-staging.e366eba → 0.0.0-staging.e5ec9a3

package/dist/components/alert.d.mts

@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/components/alert.d.ts
 declare const alertVariants: (props?: ({
-  variant?: "default" | "destructive" | "warning" | "success" | null | undefined;
+  variant?: "destructive" | "default" | "success" | "warning" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {}
 declare function Alert({

package/dist/components/badge.d.mts

@@ -4,7 +4,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/components/badge.d.ts
 declare const badgeVariants: (props?: ({
-  variant?: "warning" | "success" | "secondary" | "primary" | "error" | null | undefined;
+  variant?: "primary" | "secondary" | "success" | "warning" | "error" | null | undefined;
   size?: "sm" | "md" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 interface BadgeProps extends React.ComponentProps<"span">, VariantProps<typeof badgeVariants> {}

package/dist/components/button.d.mts

@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/components/button.d.ts
 declare const buttonVariants: (props?: ({
-  variant?: "destructive" | "secondary" | "primary" | "tertiary" | "link" | "link-muted" | null | undefined;
+  variant?: "primary" | "secondary" | "tertiary" | "link" | "link-muted" | "destructive" | null | undefined;
   size?: "default" | "icon" | "icon-rounded" | "pill" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ComponentProps<"button">, VariantProps<typeof buttonVariants> {

package/dist/components/dropdown-menu.d.mts

@@ -23,7 +23,7 @@ declare function DropdownMenuGroup({
   ...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>): _$react_jsx_runtime0.JSX.Element;
 declare const dropdownMenuItemVariants: (props?: ({
-  variant?: "default" | "destructive" | null | undefined;
+  variant?: "destructive" | "default" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare function DropdownMenuItem({
   className,

package/dist/components/sidebar.d.mts

@@ -108,7 +108,7 @@ declare function SidebarMenuItem({
 }: React.ComponentProps<"li">): _$react_jsx_runtime0.JSX.Element;
 declare const sidebarMenuButtonVariants: (props?: ({
   variant?: "default" | "outline" | null | undefined;
-  size?: "default" | "sm" | "lg" | null | undefined;
+  size?: "sm" | "lg" | "default" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare function SidebarMenuButton({
   asChild,

package/dist/components/sidebar.mjs

@@ -6,7 +6,6 @@ import { Separator } from "./separator.mjs";
 import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "./sheet.mjs";
 import { useIsMobile } from "../hooks/use-mobile.mjs";
 import { Skeleton } from "./skeleton.mjs";
-import { PanelLeftClose, PanelLeftOpen } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import * as React from "react";
@@ -132,8 +131,7 @@ function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas"
 	});
 }
 function SidebarTrigger({ className, onClick, ...props }) {
-	const { state, isMobile, openMobile, toggleSidebar } = useSidebar();
-	const isOpen = isMobile ? openMobile : state === "expanded";
+	const { toggleSidebar } = useSidebar();
 	return /* @__PURE__ */ jsxs(Button, {
 		"data-sidebar": "trigger",
 		"data-slot": "sidebar-trigger",
@@ -145,12 +143,35 @@ function SidebarTrigger({ className, onClick, ...props }) {
 			toggleSidebar();
 		},
 		...props,
-		children: [isOpen ? /* @__PURE__ */ jsx(PanelLeftClose, { className: "size-4.5" }) : /* @__PURE__ */ jsx(PanelLeftOpen, { className: "size-4.5" }), /* @__PURE__ */ jsx("span", {
+		children: [/* @__PURE__ */ jsx(SidebarToggleIcon, { className: "size-4.5" }), /* @__PURE__ */ jsx("span", {
 			className: "sr-only",
 			children: "Toggle Sidebar"
 		})]
 	});
 }
+function SidebarToggleIcon({ className, ...props }) {
+	return /* @__PURE__ */ jsxs("svg", {
+		viewBox: "0 0 20 20",
+		fill: "none",
+		"aria-hidden": "true",
+		className,
+		...props,
+		children: [/* @__PURE__ */ jsx("rect", {
+			x: "2.75",
+			y: "2.75",
+			width: "14.5",
+			height: "14.5",
+			rx: "4",
+			stroke: "currentColor",
+			strokeWidth: "1.5"
+		}), /* @__PURE__ */ jsx("path", {
+			d: "M10 4.75V15.25",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round"
+		})]
+	});
+}
 function SidebarRail({ className, ...props }) {
 	const { toggleSidebar } = useSidebar();
 	return /* @__PURE__ */ jsx("button", {
@@ -187,15 +208,9 @@ function SidebarHeader({ className, icon, title, children, ...props }) {
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex h-8 items-center gap-2 px-3",
 			children: [
-				/* @__PURE__ */ jsxs("div", {
-					className: "relative shrink-0",
-					children: [/* @__PURE__ */ jsx("span", {
-						className: "transition-opacity group-data-[collapsible=icon]:group-hover:opacity-0",
-						children: icon
-					}), /* @__PURE__ */ jsx("div", {
-						className: "absolute inset-0 flex items-center justify-center opacity-0 transition-opacity group-data-[collapsible=icon]:group-hover:opacity-100",
-						children: /* @__PURE__ */ jsx(SidebarTrigger, {})
-					})]
+				/* @__PURE__ */ jsx("div", {
+					className: "shrink-0",
+					children: icon
 				}),
 				/* @__PURE__ */ jsx("span", {
 					className: "text-foreground text-md min-w-0 truncate font-medium group-data-[collapsible=icon]:hidden",

package/dist/components/spinner.d.mts

@@ -4,7 +4,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/components/spinner.d.ts
 declare const spinnerVariants: (props?: ({
-  variant?: "secondary" | "primary" | null | undefined;
+  variant?: "primary" | "secondary" | null | undefined;
   size?: "sm" | "md" | "lg" | "xl" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 interface SpinnerProps extends Omit<React.ComponentProps<"svg">, "children">, VariantProps<typeof spinnerVariants> {}

package/dist/components/status-dot.d.mts

@@ -4,7 +4,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/components/status-dot.d.ts
 declare const statusDotVariants: (props?: ({
-  variant?: "destructive" | "warning" | "success" | "muted" | null | undefined;
+  variant?: "destructive" | "success" | "warning" | "muted" | null | undefined;
   pulse?: boolean | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 interface StatusDotProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof statusDotVariants> {}

package/dist/components/toggle-group.d.mts

@@ -7,7 +7,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 //#region src/components/toggle-group.d.ts
 declare const toggleGroupItemVariants: (props?: ({
   variant?: "default" | "outline" | null | undefined;
-  size?: "default" | "sm" | null | undefined;
+  size?: "sm" | "default" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type ToggleGroupContextValue = VariantProps<typeof toggleGroupItemVariants>;
 declare function ToggleGroup({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alpic-ai/ui",
-  "version": "0.0.0-staging.e366eba",
+  "version": "0.0.0-staging.e5ec9a3",
   "description": "Alpic design system — shared UI components",
   "type": "module",
   "exports": {
@@ -64,9 +64,9 @@
     "shx": "^0.4.0",
     "sonner": "^2.0.7",
     "tailwindcss": "^4.2.2",
-    "tsdown": "^0.21.7",
+    "tsdown": "^0.21.9",
     "tw-animate-css": "^1.4.0",
-    "typescript": "^6.0.2"
+    "typescript": "^6.0.3"
   },
   "scripts": {
     "build": "shx rm -rf dist && tsdown",

package/src/components/sidebar.tsx

@@ -2,7 +2,6 @@
 
 import { Slot } from "@radix-ui/react-slot";
 import { cva, type VariantProps } from "class-variance-authority";
-import { PanelLeftClose, PanelLeftOpen } from "lucide-react";
 import * as React from "react";
 
 import { useIsMobile } from "../hooks/use-mobile";
@@ -231,9 +230,7 @@ function Sidebar({
 }
 
 function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>) {
-  const { state, isMobile, openMobile, toggleSidebar } = useSidebar();
-
-  const isOpen = isMobile ? openMobile : state === "expanded";
+  const { toggleSidebar } = useSidebar();
 
   return (
     <Button
@@ -248,12 +245,21 @@ function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<t
       }}
       {...props}
     >
-      {isOpen ? <PanelLeftClose className="size-4.5" /> : <PanelLeftOpen className="size-4.5" />}
+      <SidebarToggleIcon className="size-4.5" />
       <span className="sr-only">Toggle Sidebar</span>
     </Button>
   );
 }
 
+function SidebarToggleIcon({ className, ...props }: React.ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 20 20" fill="none" aria-hidden="true" className={className} {...props}>
+      <rect x="2.75" y="2.75" width="14.5" height="14.5" rx="4" stroke="currentColor" strokeWidth="1.5" />
+      <path d="M10 4.75V15.25" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" />
+    </svg>
+  );
+}
+
 function SidebarRail({ className, ...props }: React.ComponentProps<"button">) {
   const { toggleSidebar } = useSidebar();
 
@@ -320,12 +326,7 @@ function SidebarHeader({ className, icon, title, children, ...props }: SidebarHe
       {...props}
     >
       <div className="flex h-8 items-center gap-2 px-3">
-        <div className="relative shrink-0">
-          <span className="transition-opacity group-data-[collapsible=icon]:group-hover:opacity-0">{icon}</span>
-          <div className="absolute inset-0 flex items-center justify-center opacity-0 transition-opacity group-data-[collapsible=icon]:group-hover:opacity-100">
-            <SidebarTrigger />
-          </div>
-        </div>
+        <div className="shrink-0">{icon}</div>
         <span className="text-foreground text-md min-w-0 truncate font-medium group-data-[collapsible=icon]:hidden">
           {title}
         </span>