@trading-game/design-intelligence-layer 0.8.5 → 0.8.7

package/dist/index.d.cts

@@ -574,9 +574,12 @@ declare function TableCaption({ className, ...props }: React$1.ComponentProps<"c
 declare function Tabs({ className, orientation, ...props }: React$1.ComponentProps<typeof Tabs$1.Root>): react_jsx_runtime.JSX.Element;
 declare const tabsListVariants: (props?: ({
     variant?: "line" | "default" | null | undefined;
+    size?: "lg" | "md" | "sm" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function TabsList({ className, variant, ...props }: React$1.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
-declare function TabsTrigger({ className, ...props }: React$1.ComponentProps<typeof Tabs$1.Trigger>): react_jsx_runtime.JSX.Element;
+declare function TabsList({ className, variant, size, ...props }: React$1.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
+declare function TabsTrigger({ className, iconPosition, ...props }: React$1.ComponentProps<typeof Tabs$1.Trigger> & {
+    iconPosition?: "inline" | "top";
+}): react_jsx_runtime.JSX.Element;
 declare function TabsContent({ className, ...props }: React$1.ComponentProps<typeof Tabs$1.Content>): react_jsx_runtime.JSX.Element;
 
 declare function Textarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;

package/dist/index.d.ts

@@ -574,9 +574,12 @@ declare function TableCaption({ className, ...props }: React$1.ComponentProps<"c
 declare function Tabs({ className, orientation, ...props }: React$1.ComponentProps<typeof Tabs$1.Root>): react_jsx_runtime.JSX.Element;
 declare const tabsListVariants: (props?: ({
     variant?: "line" | "default" | null | undefined;
+    size?: "lg" | "md" | "sm" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function TabsList({ className, variant, ...props }: React$1.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
-declare function TabsTrigger({ className, ...props }: React$1.ComponentProps<typeof Tabs$1.Trigger>): react_jsx_runtime.JSX.Element;
+declare function TabsList({ className, variant, size, ...props }: React$1.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
+declare function TabsTrigger({ className, iconPosition, ...props }: React$1.ComponentProps<typeof Tabs$1.Trigger> & {
+    iconPosition?: "inline" | "top";
+}): react_jsx_runtime.JSX.Element;
 declare function TabsContent({ className, ...props }: React$1.ComponentProps<typeof Tabs$1.Content>): react_jsx_runtime.JSX.Element;
 
 declare function Textarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;

package/dist/index.js

@@ -280,7 +280,7 @@ function AlertDialogContent(_a) {
         "data-slot": "alert-dialog-content",
         "data-size": size,
         className: cn(
-          "group/alert-dialog-content fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-border-subtle bg-background p-6 shadow-lg duration-200 data-[size=sm]:max-w-xs data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[size=default]:sm:max-w-lg",
+          "group/alert-dialog-content fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-border-subtle bg-background p-6 shadow-lg duration-base data-[size=sm]:max-w-xs data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[size=default]:sm:max-w-lg",
           className
         )
       }, props)
@@ -379,11 +379,10 @@ function AlertDialogAction(_a) {
     "variant",
     "size"
   ]);
-  return /* @__PURE__ */ jsx4(Button, { variant, size, asChild: true, children: /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx4(Button, { variant, size, asChild: true, className: cn("group-data-[size=sm]/alert-dialog-content:w-full", className), children: /* @__PURE__ */ jsx4(
     AlertDialogPrimitive.Action,
     __spreadValues({
-      "data-slot": "alert-dialog-action",
-      className: cn(className)
+      "data-slot": "alert-dialog-action"
     }, props)
   ) });
 }
@@ -397,11 +396,10 @@ function AlertDialogCancel(_a) {
     "variant",
     "size"
   ]);
-  return /* @__PURE__ */ jsx4(Button, { variant, size, asChild: true, children: /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx4(Button, { variant, size, asChild: true, className: cn("group-data-[size=sm]/alert-dialog-content:w-full", className), children: /* @__PURE__ */ jsx4(
     AlertDialogPrimitive.Cancel,
     __spreadValues({
-      "data-slot": "alert-dialog-cancel",
-      className: cn(className)
+      "data-slot": "alert-dialog-cancel"
     }, props)
   ) });
 }
@@ -2015,7 +2013,7 @@ function DialogContent(_a) {
       __spreadProps(__spreadValues({
         "data-slot": "dialog-content",
         className: cn(
-          "fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-border-subtle bg-background p-6 shadow-lg duration-200 outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
+          "fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-border-subtle bg-background p-6 shadow-lg duration-base outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
           className
         )
       }, props), {
@@ -2588,7 +2586,7 @@ function DrawerFooter(_a) {
     "div",
     __spreadValues({
       "data-slot": "drawer-footer",
-      className: cn("mt-auto flex flex-col gap-2 p-4", className)
+      className: cn("mt-auto flex flex-col gap-2 p-4 [&>*]:w-full", className)
     }, props)
   );
 }
@@ -3471,7 +3469,7 @@ function ItemSeparator(_a) {
   );
 }
 var itemVariants = cva7(
-  "group/item flex flex-wrap items-center rounded-md border border-transparent text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors [a]:hover:bg-secondary-hover",
+  "group/item flex flex-wrap items-center rounded-md border border-transparent text-sm transition-colors duration-instant outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors [a]:hover:bg-secondary-hover",
   {
     variants: {
       variant: {
@@ -3659,7 +3657,7 @@ var linkVariants = cva8(
   {
     variants: {
       size: {
-        lg: "text-sm [&_svg:not([class*='size-'])]:size-4",
+        lg: "text-base [&_svg:not([class*='size-'])]:size-4",
         md: "text-sm [&_svg:not([class*='size-'])]:size-4",
         sm: "text-xs [&_svg:not([class*='size-'])]:size-[14px]"
       }
@@ -4090,7 +4088,7 @@ function NavigationMenuTrigger(_a) {
         /* @__PURE__ */ jsx37(
           ChevronDownIcon5,
           {
-            className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
+            className: "relative top-[1px] ml-1 size-3 transition duration-slow group-data-[state=open]:rotate-180",
             "aria-hidden": "true"
           }
         )
@@ -4110,7 +4108,7 @@ function NavigationMenuContent(_a) {
       "data-slot": "navigation-menu-content",
       className: cn(
         "top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto",
-        "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-border-subtle group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95",
+        "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-border-subtle group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-base **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95",
         className
       )
     }, props)
@@ -4774,7 +4772,7 @@ function SheetContent(_a) {
       __spreadProps(__spreadValues({
         "data-slot": "sheet-content",
         className: cn(
-          "fixed z-50 flex flex-col gap-4 bg-background shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500",
+          "fixed z-50 flex flex-col gap-4 bg-background shadow-lg transition ease-standard data-[state=closed]:animate-out data-[state=closed]:duration-slow data-[state=open]:animate-in data-[state=open]:duration-open",
           side === "right" && "inset-y-0 right-0 h-full w-3/4 border-l border-border-subtle data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
           side === "left" && "inset-y-0 left-0 h-full w-3/4 border-r border-border-subtle data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
           side === "top" && "inset-x-0 top-0 h-auto border-b border-border-subtle data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
@@ -5088,7 +5086,7 @@ function Sidebar(_a) {
           {
             "data-slot": "sidebar-gap",
             className: cn(
-              "relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
+              "relative w-(--sidebar-width) bg-transparent transition-[width] duration-base ease-linear",
               "group-data-[collapsible=offcanvas]:w-0",
               "group-data-[side=right]:rotate-180",
               variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
@@ -5100,7 +5098,7 @@ function Sidebar(_a) {
           __spreadProps(__spreadValues({
             "data-slot": "sidebar-container",
             className: cn(
-              "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
+              "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-base ease-linear md:flex",
               side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
               // Adjust the padding for floating and inset variants.
               variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
@@ -5881,51 +5879,68 @@ function Tabs(_a) {
   );
 }
 var tabsListVariants = cva11(
-  "group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-on-subtle group-data-[orientation=horizontal]/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none",
+  "group/tabs-list inline-flex w-fit items-center justify-center text-on-subtle group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none has-[[data-icon-position=top]]:h-auto",
   {
     variants: {
       variant: {
         default: "bg-subtle",
         line: "gap-1 bg-transparent"
+      },
+      size: {
+        sm: "h-8 rounded-md p-[2px]",
+        md: "h-10 rounded-lg p-1",
+        lg: "h-12 rounded-xl p-1.5"
       }
     },
     defaultVariants: {
-      variant: "default"
+      variant: "default",
+      size: "md"
     }
   }
 );
 function TabsList(_a) {
   var _b = _a, {
     className,
-    variant = "default"
+    variant = "default",
+    size = "md"
   } = _b, props = __objRest(_b, [
     "className",
-    "variant"
+    "variant",
+    "size"
   ]);
   return /* @__PURE__ */ jsx54(
     TabsPrimitive.List,
     __spreadValues({
       "data-slot": "tabs-list",
       "data-variant": variant,
-      className: cn(tabsListVariants({ variant }), className)
+      "data-size": size,
+      className: cn(tabsListVariants({ variant, size }), className)
     }, props)
   );
 }
 function TabsTrigger(_a) {
   var _b = _a, {
-    className
+    className,
+    iconPosition = "inline"
   } = _b, props = __objRest(_b, [
-    "className"
+    "className",
+    "iconPosition"
   ]);
   return /* @__PURE__ */ jsx54(
     TabsPrimitive.Trigger,
     __spreadValues({
       "data-slot": "tabs-trigger",
+      "data-icon-position": iconPosition,
       className: cn(
-        "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-normal whitespace-nowrap text-on-prominent/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:bg-secondary-hover hover:text-on-prominent focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent",
+        "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-3 py-1 text-sm font-normal whitespace-nowrap text-on-prominent/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:bg-secondary-hover hover:text-on-prominent focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "group-data-[size=sm]/tabs-list:gap-1 group-data-[size=sm]/tabs-list:rounded-sm group-data-[size=sm]/tabs-list:px-2 group-data-[size=sm]/tabs-list:text-xs",
+        "group-data-[size=lg]/tabs-list:gap-2 group-data-[size=lg]/tabs-list:rounded-lg group-data-[size=lg]/tabs-list:px-4 group-data-[size=lg]/tabs-list:text-base",
+        "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:hover:bg-transparent group-data-[variant=line]/tabs-list:hover:text-primary group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent",
         "data-[state=active]:bg-background data-[state=active]:border-transparent data-[state=active]:text-primary data-[state=active]:font-semibold",
         "after:absolute after:bg-primary after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100",
+        iconPosition === "top" && "h-auto flex-col gap-1 py-2",
+        iconPosition === "top" && "group-data-[size=sm]/tabs-list:gap-0.5 group-data-[size=sm]/tabs-list:py-1.5",
+        iconPosition === "top" && "group-data-[size=lg]/tabs-list:gap-1.5 group-data-[size=lg]/tabs-list:py-2.5",
         className
       )
     }, props)