@thalamiq/ui 0.1.16 → 0.1.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -100,7 +100,7 @@ function TabsList(_a) {
100
100
  __spreadValues({
101
101
  "data-slot": "tabs-list",
102
102
  className: cn(
103
- "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
103
+ "flex items-center gap-1 border-b border-border",
104
104
  className
105
105
  )
106
106
  }, props)
@@ -117,7 +117,12 @@ function TabsTrigger(_a) {
117
117
  __spreadValues({
118
118
  "data-slot": "tabs-trigger",
119
119
  className: cn(
120
- "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground 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-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
120
+ "px-3 py-1.5 text-sm font-medium border-b-2 -mb-px transition-colors whitespace-nowrap",
121
+ "data-[state=active]:border-primary data-[state=active]:text-foreground",
122
+ "data-[state=inactive]:border-transparent data-[state=inactive]:text-muted-foreground data-[state=inactive]:hover:text-foreground",
123
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
124
+ "disabled:pointer-events-none disabled:opacity-50",
125
+ "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
121
126
  className
122
127
  )
123
128
  }, props)
@@ -1 +1 @@
1
- {"version":3,"sources":["../../lib/components/tabs.tsx","../../lib/utils/utils.ts"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\"\n\nimport { cn } from \"../utils/utils\"\n\nfunction Tabs({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n className={cn(\"flex flex-col gap-2\", className)}\n {...props}\n />\n )\n}\n\nfunction TabsList({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.List>) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n className={cn(\n \"bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsTrigger({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n return (\n <TabsPrimitive.Trigger\n data-slot=\"tabs-trigger\"\n className={cn(\n \"data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground 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-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsContent({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n return (\n <TabsPrimitive.Content\n data-slot=\"tabs-content\"\n className={cn(\"flex-1 outline-none\", className)}\n {...props}\n />\n )\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n","import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAA+B;;;ACH/B,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADOI;AALJ,SAAS,KAAK,IAGsC;AAHtC,eACZ;AAAA;AAAA,EARF,IAOc,IAET,kBAFS,IAET;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;AAEA,SAAS,SAAS,IAGkC;AAHlC,eAChB;AAAA;AAAA,EArBF,IAoBkB,IAEb,kBAFa,IAEb;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EArCF,IAoCqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EArDF,IAoDqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../lib/components/tabs.tsx","../../lib/utils/utils.ts"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\"\n\nimport { cn } from \"../utils/utils\"\n\nfunction Tabs({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n className={cn(\"flex flex-col gap-2\", className)}\n {...props}\n />\n )\n}\n\nfunction TabsList({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.List>) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n className={cn(\n \"flex items-center gap-1 border-b border-border\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsTrigger({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n return (\n <TabsPrimitive.Trigger\n data-slot=\"tabs-trigger\"\n className={cn(\n \"px-3 py-1.5 text-sm font-medium border-b-2 -mb-px transition-colors whitespace-nowrap\",\n \"data-[state=active]:border-primary data-[state=active]:text-foreground\",\n \"data-[state=inactive]:border-transparent data-[state=inactive]:text-muted-foreground data-[state=inactive]:hover:text-foreground\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsContent({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n return (\n <TabsPrimitive.Content\n data-slot=\"tabs-content\"\n className={cn(\"flex-1 outline-none\", className)}\n {...props}\n />\n )\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n","import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAA+B;;;ACH/B,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADOI;AALJ,SAAS,KAAK,IAGsC;AAHtC,eACZ;AAAA;AAAA,EARF,IAOc,IAET,kBAFS,IAET;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;AAEA,SAAS,SAAS,IAGkC;AAHlC,eAChB;AAAA;AAAA,EArBF,IAoBkB,IAEb,kBAFa,IAEb;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EArCF,IAoCqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EA1DF,IAyDqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;","names":[]}
@@ -66,7 +66,7 @@ function TabsList(_a) {
66
66
  __spreadValues({
67
67
  "data-slot": "tabs-list",
68
68
  className: cn(
69
- "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
69
+ "flex items-center gap-1 border-b border-border",
70
70
  className
71
71
  )
72
72
  }, props)
@@ -83,7 +83,12 @@ function TabsTrigger(_a) {
83
83
  __spreadValues({
84
84
  "data-slot": "tabs-trigger",
85
85
  className: cn(
86
- "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground 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-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
86
+ "px-3 py-1.5 text-sm font-medium border-b-2 -mb-px transition-colors whitespace-nowrap",
87
+ "data-[state=active]:border-primary data-[state=active]:text-foreground",
88
+ "data-[state=inactive]:border-transparent data-[state=inactive]:text-muted-foreground data-[state=inactive]:hover:text-foreground",
89
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
90
+ "disabled:pointer-events-none disabled:opacity-50",
91
+ "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
87
92
  className
88
93
  )
89
94
  }, props)
@@ -1 +1 @@
1
- {"version":3,"sources":["../../lib/components/tabs.tsx","../../lib/utils/utils.ts"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\"\n\nimport { cn } from \"../utils/utils\"\n\nfunction Tabs({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n className={cn(\"flex flex-col gap-2\", className)}\n {...props}\n />\n )\n}\n\nfunction TabsList({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.List>) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n className={cn(\n \"bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsTrigger({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n return (\n <TabsPrimitive.Trigger\n data-slot=\"tabs-trigger\"\n className={cn(\n \"data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground 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-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsContent({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n return (\n <TabsPrimitive.Content\n data-slot=\"tabs-content\"\n className={cn(\"flex-1 outline-none\", className)}\n {...props}\n />\n )\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n","import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,YAAY,mBAAmB;;;ACH/B,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADOI;AALJ,SAAS,KAAK,IAGsC;AAHtC,eACZ;AAAA;AAAA,EARF,IAOc,IAET,kBAFS,IAET;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;AAEA,SAAS,SAAS,IAGkC;AAHlC,eAChB;AAAA;AAAA,EArBF,IAoBkB,IAEb,kBAFa,IAEb;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EArCF,IAoCqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EArDF,IAoDqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../lib/components/tabs.tsx","../../lib/utils/utils.ts"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\"\n\nimport { cn } from \"../utils/utils\"\n\nfunction Tabs({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n className={cn(\"flex flex-col gap-2\", className)}\n {...props}\n />\n )\n}\n\nfunction TabsList({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.List>) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n className={cn(\n \"flex items-center gap-1 border-b border-border\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsTrigger({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n return (\n <TabsPrimitive.Trigger\n data-slot=\"tabs-trigger\"\n className={cn(\n \"px-3 py-1.5 text-sm font-medium border-b-2 -mb-px transition-colors whitespace-nowrap\",\n \"data-[state=active]:border-primary data-[state=active]:text-foreground\",\n \"data-[state=inactive]:border-transparent data-[state=inactive]:text-muted-foreground data-[state=inactive]:hover:text-foreground\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsContent({\n className,\n ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n return (\n <TabsPrimitive.Content\n data-slot=\"tabs-content\"\n className={cn(\"flex-1 outline-none\", className)}\n {...props}\n />\n )\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n","import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,YAAY,mBAAmB;;;ACH/B,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADOI;AALJ,SAAS,KAAK,IAGsC;AAHtC,eACZ;AAAA;AAAA,EARF,IAOc,IAET,kBAFS,IAET;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;AAEA,SAAS,SAAS,IAGkC;AAHlC,eAChB;AAAA;AAAA,EArBF,IAoBkB,IAEb,kBAFa,IAEb;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EArCF,IAoCqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,IAGkC;AAHlC,eACnB;AAAA;AAAA,EA1DF,IAyDqB,IAEhB,kBAFgB,IAEhB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAe;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,OAC1C;AAAA,EACN;AAEJ;","names":[]}
@@ -11,172 +11,183 @@
11
11
  ============================================================ */
12
12
 
13
13
  :root {
14
+ --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
15
+ sans-serif;
16
+ --font-mono: "Geist Mono", "SF Mono", "Cascadia Code", "Consolas", monospace;
17
+
14
18
  /* ------------------------------------------------------------
15
- Core surfaces
16
- ------------------------------------------------------------ */
19
+ Core surfaces
20
+ ------------------------------------------------------------ */
17
21
 
18
22
  /* App background (paper) */
19
- --background: oklch(0.98 0 0);
20
- --foreground: oklch(0.21 0.02 265);
23
+ --background: oklch(0.975 0.002 260);
24
+ --foreground: oklch(0.2 0.015 265);
21
25
 
22
26
  /* Elevated surfaces */
23
- --card: oklch(1 0 0);
24
- --card-foreground: oklch(0.21 0.02 265);
27
+ --card: oklch(0.995 0.001 260);
28
+ --card-foreground: oklch(0.2 0.015 265);
25
29
 
26
30
  --popover: oklch(1 0 0);
27
- --popover-foreground: oklch(0.21 0.02 265);
31
+ --popover-foreground: oklch(0.2 0.015 265);
28
32
 
29
33
  /* ------------------------------------------------------------
30
- Borders & structure
31
- ------------------------------------------------------------ */
34
+ Borders & structure
35
+ ------------------------------------------------------------ */
32
36
 
33
- --border: oklch(0.88 0.004 260);
34
- --input: oklch(1 0 0);
35
- --ring: oklch(0.5 0.1 255);
37
+ --border: oklch(0.9 0.004 260);
38
+ --input: oklch(0.99 0.001 260);
39
+ --ring: oklch(0.54 0.1 255);
36
40
 
37
41
  /* ------------------------------------------------------------
38
- Text hierarchy
39
- ------------------------------------------------------------ */
42
+ Text hierarchy
43
+ ------------------------------------------------------------ */
40
44
 
41
45
  /* Secondary / metadata text */
42
- --muted: oklch(0.97 0 0);
43
- --muted-foreground: oklch(0.55 0.014 265);
46
+ --muted: oklch(0.955 0.003 260);
47
+ --muted-foreground: oklch(0.5 0.012 265);
44
48
 
45
49
  /* ------------------------------------------------------------
46
- Action (user intent)
47
- ------------------------------------------------------------ */
50
+ Action (user intent)
51
+ ------------------------------------------------------------ */
48
52
 
49
53
  /* Buttons, links, explicit user actions */
50
- --primary: oklch(0.56 0.12 255);
54
+ --primary: oklch(0.54 0.11 255);
51
55
  --primary-foreground: oklch(1 0 0);
52
56
 
53
57
  /* Secondary actions (less prominent than primary) */
54
- --secondary: oklch(0.96 0.002 260);
55
- --secondary-foreground: oklch(0.25 0.02 265);
58
+ --secondary: oklch(0.96 0.003 260);
59
+ --secondary-foreground: oklch(0.24 0.015 265);
56
60
 
57
61
  /* Soft contextual highlights */
58
- --accent: oklch(0.93 0.004 260);
59
- --accent-foreground: oklch(0.32 0.008 260);
62
+ --accent: oklch(0.945 0.005 260);
63
+ --accent-foreground: oklch(0.28 0.01 260);
60
64
 
61
65
  /* ------------------------------------------------------------
62
- Destructive (still calm)
63
- ------------------------------------------------------------ */
66
+ Destructive (still calm)
67
+ ------------------------------------------------------------ */
64
68
 
65
- --destructive: oklch(0.55 0.18 25);
69
+ --destructive: oklch(0.54 0.17 25);
66
70
  --destructive-foreground: oklch(1 0 0);
67
71
 
68
72
  /* ------------------------------------------------------------
69
- System states
70
- ------------------------------------------------------------ */
73
+ System states
74
+ ------------------------------------------------------------ */
71
75
 
72
- --warning: oklch(0.65 0.12 90); /* amber */
73
- --warning-foreground: oklch(0.21 0.02 265);
76
+ --warning: oklch(0.7 0.12 88); /* amber */
77
+ --warning-foreground: oklch(0.24 0.02 265);
74
78
 
75
- --error: oklch(0.55 0.18 25); /* muted red */
79
+ --error: oklch(0.56 0.16 24); /* muted red */
76
80
  --error-foreground: oklch(1 0 0);
77
81
 
78
- --success: oklch(0.58 0.1 150); /* sleek green */
82
+ --success: oklch(0.64 0.1 150); /* sleek green */
79
83
  --success-foreground: oklch(1 0 0);
80
84
 
81
- --info: oklch(0.55 0.1 255); /* informational blue */
85
+ --info: oklch(0.58 0.1 255); /* informational blue */
82
86
  --info-foreground: oklch(1 0 0);
83
87
 
84
88
  /* ------------------------------------------------------------
85
- Charts (analytical, not marketing)
86
- ------------------------------------------------------------ */
89
+ Charts (analytical, not marketing)
90
+ ------------------------------------------------------------ */
87
91
 
88
- --chart-1: oklch(0.52 0.1 255); /* primary series */
89
- --chart-2: oklch(0.58 0.06 200); /* secondary series */
90
- --chart-3: oklch(0.5 0.04 265); /* neutral */
91
- --chart-4: oklch(0.62 0.08 90); /* attention */
92
- --chart-5: oklch(0.6 0.08 30); /* muted risk */
92
+ --chart-1: oklch(0.53 0.1 255); /* primary series */
93
+ --chart-2: oklch(0.56 0.075 205); /* secondary series */
94
+ --chart-3: oklch(0.5 0.03 265); /* neutral */
95
+ --chart-4: oklch(0.65 0.08 90); /* attention */
96
+ --chart-5: oklch(0.6 0.08 28); /* muted risk */
93
97
 
94
98
  /* ------------------------------------------------------------
95
- Radius
96
- ------------------------------------------------------------ */
99
+ Radius
100
+ ------------------------------------------------------------ */
97
101
 
98
- --radius: 0.3rem;
102
+ --radius: 0.5rem;
99
103
 
100
104
  /* ------------------------------------------------------------
101
- Sidebar
102
- ------------------------------------------------------------ */
105
+ Sidebar
106
+ ------------------------------------------------------------ */
103
107
 
104
- --sidebar: oklch(0.95 0.003 260);
105
- --sidebar-foreground: oklch(0.25 0.01 260);
108
+ --sidebar: oklch(0.955 0.003 260);
109
+ --sidebar-foreground: oklch(0.22 0.012 260);
106
110
 
107
111
  --sidebar-primary: var(--primary);
108
112
  --sidebar-primary-foreground: var(--primary-foreground);
109
113
 
110
- --sidebar-accent: oklch(0.90 0.006 260);
111
- --sidebar-accent-foreground: oklch(0.20 0.01 260);
114
+ --sidebar-accent: oklch(0.935 0.006 260);
115
+ --sidebar-accent-foreground: oklch(0.18 0.01 260);
112
116
 
113
117
  --sidebar-border: oklch(0.88 0.004 260);
114
118
  --sidebar-ring: var(--ring);
119
+
120
+ color-scheme: light;
115
121
  }
116
122
 
117
123
  /* ============================================================
118
- Dark Mode — “night lab”
119
- ============================================================ */
124
+ Dark Mode — “night lab”
125
+ ============================================================ */
120
126
 
121
127
  .dark {
122
- --background: oklch(0.14 0.01 265);
123
- --foreground: oklch(0.95 0 0);
128
+ --background: oklch(0.15 0.008 265);
129
+ --foreground: oklch(0.94 0.004 265);
124
130
 
125
- --card: oklch(0.18 0.01 265);
126
- --card-foreground: oklch(0.95 0 0);
131
+ --card: oklch(0.2 0.01 265);
132
+ --card-foreground: oklch(0.94 0.004 265);
127
133
 
128
- --popover: oklch(0.18 0.01 265);
129
- --popover-foreground: oklch(0.95 0 0);
134
+ --popover: oklch(0.21 0.01 265);
135
+ --popover-foreground: oklch(0.94 0.004 265);
130
136
 
131
- --border: oklch(0.26 0.006 260);
132
- --input: oklch(0.22 0.008 260);
133
- --ring: oklch(0.55 0.1 255);
137
+ --border: oklch(0.34 0.006 260);
138
+ --input: oklch(0.24 0.008 260);
139
+ --ring: oklch(0.62 0.1 255);
134
140
 
135
- --muted: oklch(0.25 0.01 265);
136
- --muted-foreground: oklch(0.65 0 0);
141
+ --muted: oklch(0.26 0.01 265);
142
+ --muted-foreground: oklch(0.72 0.004 265);
137
143
 
138
- --primary: oklch(0.62 0.14 255);
139
- --primary-foreground: oklch(0.95 0 0);
144
+ --primary: oklch(0.66 0.12 255);
145
+ --primary-foreground: oklch(0.18 0.01 265);
140
146
 
141
- --secondary: oklch(0.22 0.008 260);
142
- --secondary-foreground: oklch(0.92 0 0);
147
+ --secondary: oklch(0.25 0.008 260);
148
+ --secondary-foreground: oklch(0.91 0.004 265);
143
149
 
144
- --accent: oklch(0.25 0.02 255);
145
- --accent-foreground: oklch(0.95 0 0);
150
+ --accent: oklch(0.29 0.02 255);
151
+ --accent-foreground: oklch(0.93 0.004 265);
146
152
 
147
- --destructive: oklch(0.5 0.18 25);
148
- --destructive-foreground: oklch(0.95 0 0);
153
+ --destructive: oklch(0.58 0.16 25);
154
+ --destructive-foreground: oklch(0.17 0.01 265);
149
155
 
150
- --warning: oklch(0.72 0.14 90); /* amber */
151
- --warning-foreground: oklch(0.95 0 0);
152
- --error: oklch(0.5 0.18 25); /* muted red */
153
- --error-foreground: oklch(0.95 0 0);
154
- --success: oklch(0.65 0.12 150); /* sleek green */
155
- --success-foreground: oklch(0.95 0 0);
156
+ --warning: oklch(0.74 0.12 88); /* amber */
157
+ --warning-foreground: oklch(0.19 0.01 265);
158
+ --error: oklch(0.6 0.15 24); /* muted red */
159
+ --error-foreground: oklch(0.17 0.01 265);
160
+ --success: oklch(0.69 0.1 150); /* sleek green */
161
+ --success-foreground: oklch(0.17 0.01 265);
156
162
 
157
- --info: oklch(0.6 0.12 255); /* informational blue */
158
- --info-foreground: oklch(0.95 0 0);
163
+ --info: oklch(0.68 0.1 255); /* informational blue */
164
+ --info-foreground: oklch(0.17 0.01 265);
159
165
 
160
- --chart-1: oklch(0.58 0.14 255); /* primary series */
161
- --chart-2: oklch(0.6 0.1 200);
162
- --chart-3: oklch(0.55 0.06 265);
163
- --chart-4: oklch(0.7 0.12 90);
164
- --chart-5: oklch(0.65 0.12 30);
166
+ --chart-1: oklch(0.63 0.12 255); /* primary series */
167
+ --chart-2: oklch(0.66 0.09 205);
168
+ --chart-3: oklch(0.62 0.04 265);
169
+ --chart-4: oklch(0.74 0.1 90);
170
+ --chart-5: oklch(0.68 0.1 28);
165
171
 
166
- --sidebar: oklch(0.11 0.006 260);
167
- --sidebar-foreground: oklch(0.85 0 0);
172
+ --sidebar: oklch(0.13 0.008 260);
173
+ --sidebar-foreground: oklch(0.9 0.003 265);
168
174
 
169
175
  --sidebar-primary: var(--primary);
170
176
  --sidebar-primary-foreground: var(--primary-foreground);
171
177
 
172
- --sidebar-accent: oklch(0.18 0.008 260);
173
- --sidebar-accent-foreground: oklch(0.92 0 0);
178
+ --sidebar-accent: oklch(0.22 0.01 260);
179
+ --sidebar-accent-foreground: oklch(0.92 0.003 265);
174
180
 
175
- --sidebar-border: oklch(0.22 0.006 260);
181
+ --sidebar-border: oklch(0.28 0.008 260);
176
182
  --sidebar-ring: var(--ring);
183
+
184
+ color-scheme: dark;
177
185
  }
178
186
 
179
187
  @theme inline {
188
+ --font-sans: var(--font-sans);
189
+ --font-mono: var(--font-mono);
190
+
180
191
  --color-background: var(--background);
181
192
  --color-foreground: var(--foreground);
182
193
  --color-card: var(--card);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@thalamiq/ui",
3
- "version": "0.1.16",
3
+ "version": "0.1.18",
4
4
  "private": false,
5
5
  "publishConfig": {
6
6
  "access": "public",