@epilot/spark-ui 0.20.1 → 0.21.0

package/dist/lib/input-box-variants.cjs

@@ -1,26 +1,26 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/lib/input-box-variants.ts
 const GHOST_UNDERLINE = "h-10 rounded-none border-0 border-b-2 px-0 py-2 text-base focus:border-b-input-active focus-visible:border-b-input-active user-valid:border-b-input-active user-invalid:border-b-input-invalid user-invalid:text-error user-invalid:focus:border-b-red-a8! user-invalid:focus-visible:border-b-red-a8! aria-invalid:border-b-input-invalid aria-invalid:text-error aria-invalid:focus:border-b-red-a8! aria-invalid:focus-visible:border-b-red-a8! group-data-[invalid=true]/field:border-b-input-invalid! group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus:border-b-red-a8! group-data-[invalid=true]/field:focus-visible:border-b-red-a8! disabled:border-b-input-disabled";
 const SOFT_BASE = "user-invalid:bg-base-error-soft user-invalid:text-error user-invalid:not-disabled:hover:bg-red-a4 focus-visible:ring-2 focus-visible:ring-offset-2 user-invalid:focus-visible:ring-red-a8 disabled:bg-base-gray-soft disabled:opacity-50 aria-invalid:bg-base-error-soft aria-invalid:text-error aria-invalid:not-disabled:hover:bg-red-a4 aria-invalid:focus-visible:ring-red-a8 group-data-[invalid=true]/field:bg-base-error-soft group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:not-disabled:hover:bg-red-a4 group-data-[invalid=true]/field:focus-visible:ring-red-a8";
 const BORDERED = "border user-invalid:border-input-invalid user-invalid:text-error focus-visible:ring-1 user-invalid:focus-visible:border-input-invalid! user-invalid:focus-visible:ring-red-a4! disabled:border-input-disabled disabled:opacity-50 aria-invalid:border-input-invalid aria-invalid:text-error aria-invalid:focus-visible:border-input-invalid! aria-invalid:focus-visible:ring-red-a4! group-data-[invalid=true]/field:border-input-invalid group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus-visible:border-input-invalid! group-data-[invalid=true]/field:focus-visible:ring-red-a4!";
 const boxChrome = {
 	soft: {
-		brand: (0, cnfast.cn)(SOFT_BASE, "bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active"),
-		gray: (0, cnfast.cn)(SOFT_BASE, "bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8")
+		brand: (0, cn.cn)(SOFT_BASE, "bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active"),
+		gray: (0, cn.cn)(SOFT_BASE, "bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8")
 	},
 	surface: {
-		brand: (0, cnfast.cn)(BORDERED, "border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4"),
-		gray: (0, cnfast.cn)(BORDERED, "border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4")
+		brand: (0, cn.cn)(BORDERED, "border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4"),
+		gray: (0, cn.cn)(BORDERED, "border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4")
 	},
 	outlined: {
-		brand: (0, cnfast.cn)(BORDERED, "border-input focus-visible:border-input-active focus-visible:ring-spark-a4"),
-		gray: (0, cnfast.cn)(BORDERED, "border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4")
+		brand: (0, cn.cn)(BORDERED, "border-input focus-visible:border-input-active focus-visible:ring-spark-a4"),
+		gray: (0, cn.cn)(BORDERED, "border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4")
 	},
 	ghost: {
-		brand: (0, cnfast.cn)(GHOST_UNDERLINE, "border-b-input"),
-		gray: (0, cnfast.cn)(GHOST_UNDERLINE, "border-b-input-gray")
+		brand: (0, cn.cn)(GHOST_UNDERLINE, "border-b-input"),
+		gray: (0, cn.cn)(GHOST_UNDERLINE, "border-b-input-gray")
 	}
 };
 //#endregion

package/dist/lib/input-box-variants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-box-variants.cjs","names":[],"sources":["../../src/lib/input-box-variants.ts"],"sourcesContent":["import { cn } from '../utils/cn'\nimport type { SparkInputColor, SparkInputStyle } from './theme-types'\n\nexport const GHOST_UNDERLINE =\n  'h-10 rounded-none border-0 border-b-2 px-0 py-2 text-base focus:border-b-input-active focus-visible:border-b-input-active user-valid:border-b-input-active user-invalid:border-b-input-invalid user-invalid:text-error user-invalid:focus:border-b-red-a8! user-invalid:focus-visible:border-b-red-a8! aria-invalid:border-b-input-invalid aria-invalid:text-error aria-invalid:focus:border-b-red-a8! aria-invalid:focus-visible:border-b-red-a8! group-data-[invalid=true]/field:border-b-input-invalid! group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus:border-b-red-a8! group-data-[invalid=true]/field:focus-visible:border-b-red-a8! disabled:border-b-input-disabled'\n\nconst SOFT_BASE =\n  'user-invalid:bg-base-error-soft user-invalid:text-error user-invalid:not-disabled:hover:bg-red-a4 focus-visible:ring-2 focus-visible:ring-offset-2 user-invalid:focus-visible:ring-red-a8 disabled:bg-base-gray-soft disabled:opacity-50 aria-invalid:bg-base-error-soft aria-invalid:text-error aria-invalid:not-disabled:hover:bg-red-a4 aria-invalid:focus-visible:ring-red-a8 group-data-[invalid=true]/field:bg-base-error-soft group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:not-disabled:hover:bg-red-a4 group-data-[invalid=true]/field:focus-visible:ring-red-a8'\n\nconst BORDERED =\n  'border user-invalid:border-input-invalid user-invalid:text-error focus-visible:ring-1 user-invalid:focus-visible:border-input-invalid! user-invalid:focus-visible:ring-red-a4! disabled:border-input-disabled disabled:opacity-50 aria-invalid:border-input-invalid aria-invalid:text-error aria-invalid:focus-visible:border-input-invalid! aria-invalid:focus-visible:ring-red-a4! group-data-[invalid=true]/field:border-input-invalid group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus-visible:border-input-invalid! group-data-[invalid=true]/field:focus-visible:ring-red-a4!'\nexport const boxChrome: Record<\n  SparkInputStyle,\n  Record<SparkInputColor, string>\n> = {\n  soft: {\n    brand: cn(\n      SOFT_BASE,\n      'bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active',\n    ),\n    gray: cn(\n      SOFT_BASE,\n      'bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8',\n    ),\n  },\n  surface: {\n    brand: cn(\n      BORDERED,\n      'border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4',\n    ),\n    gray: cn(\n      BORDERED,\n      'border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n    ),\n  },\n  outlined: {\n    brand: cn(\n      BORDERED,\n      'border-input focus-visible:border-input-active focus-visible:ring-spark-a4',\n    ),\n    gray: cn(\n      BORDERED,\n      'border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n    ),\n  },\n  ghost: {\n    brand: cn(GHOST_UNDERLINE, 'border-b-input'),\n    gray: cn(GHOST_UNDERLINE, 'border-b-input-gray'),\n  },\n}\n"],"mappings":";;;;AAGA,MAAa,kBACX;AAEF,MAAM,YACJ;AAEF,MAAM,WACJ;AACF,MAAa,YAGT;CACF,MAAM;EACJ,QAAA,GAAA,OAAA,IACE,WACA,sFACF;EACA,OAAA,GAAA,OAAA,IACE,WACA,4EACF;CACF;CACA,SAAS;EACP,QAAA,GAAA,OAAA,IACE,UACA,mGACF;EACA,OAAA,GAAA,OAAA,IACE,UACA,gGACF;CACF;CACA,UAAU;EACR,QAAA,GAAA,OAAA,IACE,UACA,4EACF;EACA,OAAA,GAAA,OAAA,IACE,UACA,2EACF;CACF;CACA,OAAO;EACL,QAAA,GAAA,OAAA,IAAU,iBAAiB,gBAAgB;EAC3C,OAAA,GAAA,OAAA,IAAS,iBAAiB,qBAAqB;CACjD;AACF"}
+{"version":3,"file":"input-box-variants.cjs","names":[],"sources":["../../src/lib/input-box-variants.ts"],"sourcesContent":["import { cn } from '../utils/cn'\nimport type { SparkInputColor, SparkInputStyle } from './theme-types'\n\nexport const GHOST_UNDERLINE =\n  'h-10 rounded-none border-0 border-b-2 px-0 py-2 text-base focus:border-b-input-active focus-visible:border-b-input-active user-valid:border-b-input-active user-invalid:border-b-input-invalid user-invalid:text-error user-invalid:focus:border-b-red-a8! user-invalid:focus-visible:border-b-red-a8! aria-invalid:border-b-input-invalid aria-invalid:text-error aria-invalid:focus:border-b-red-a8! aria-invalid:focus-visible:border-b-red-a8! group-data-[invalid=true]/field:border-b-input-invalid! group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus:border-b-red-a8! group-data-[invalid=true]/field:focus-visible:border-b-red-a8! disabled:border-b-input-disabled'\n\nconst SOFT_BASE =\n  'user-invalid:bg-base-error-soft user-invalid:text-error user-invalid:not-disabled:hover:bg-red-a4 focus-visible:ring-2 focus-visible:ring-offset-2 user-invalid:focus-visible:ring-red-a8 disabled:bg-base-gray-soft disabled:opacity-50 aria-invalid:bg-base-error-soft aria-invalid:text-error aria-invalid:not-disabled:hover:bg-red-a4 aria-invalid:focus-visible:ring-red-a8 group-data-[invalid=true]/field:bg-base-error-soft group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:not-disabled:hover:bg-red-a4 group-data-[invalid=true]/field:focus-visible:ring-red-a8'\n\nconst BORDERED =\n  'border user-invalid:border-input-invalid user-invalid:text-error focus-visible:ring-1 user-invalid:focus-visible:border-input-invalid! user-invalid:focus-visible:ring-red-a4! disabled:border-input-disabled disabled:opacity-50 aria-invalid:border-input-invalid aria-invalid:text-error aria-invalid:focus-visible:border-input-invalid! aria-invalid:focus-visible:ring-red-a4! group-data-[invalid=true]/field:border-input-invalid group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus-visible:border-input-invalid! group-data-[invalid=true]/field:focus-visible:ring-red-a4!'\nexport const boxChrome: Record<\n  SparkInputStyle,\n  Record<SparkInputColor, string>\n> = {\n  soft: {\n    brand: cn(\n      SOFT_BASE,\n      'bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active',\n    ),\n    gray: cn(\n      SOFT_BASE,\n      'bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8',\n    ),\n  },\n  surface: {\n    brand: cn(\n      BORDERED,\n      'border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4',\n    ),\n    gray: cn(\n      BORDERED,\n      'border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n    ),\n  },\n  outlined: {\n    brand: cn(\n      BORDERED,\n      'border-input focus-visible:border-input-active focus-visible:ring-spark-a4',\n    ),\n    gray: cn(\n      BORDERED,\n      'border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n    ),\n  },\n  ghost: {\n    brand: cn(GHOST_UNDERLINE, 'border-b-input'),\n    gray: cn(GHOST_UNDERLINE, 'border-b-input-gray'),\n  },\n}\n"],"mappings":";;;;AAGA,MAAa,kBACX;AAEF,MAAM,YACJ;AAEF,MAAM,WACJ;AACF,MAAa,YAGT;CACF,MAAM;EACJ,QAAA,GAAA,GAAA,IACE,WACA,sFACF;EACA,OAAA,GAAA,GAAA,IACE,WACA,4EACF;CACF;CACA,SAAS;EACP,QAAA,GAAA,GAAA,IACE,UACA,mGACF;EACA,OAAA,GAAA,GAAA,IACE,UACA,gGACF;CACF;CACA,UAAU;EACR,QAAA,GAAA,GAAA,IACE,UACA,4EACF;EACA,OAAA,GAAA,GAAA,IACE,UACA,2EACF;CACF;CACA,OAAO;EACL,QAAA,GAAA,GAAA,IAAU,iBAAiB,gBAAgB;EAC3C,OAAA,GAAA,GAAA,IAAS,iBAAiB,qBAAqB;CACjD;AACF"}

package/dist/styles/spark-default.css

@@ -876,6 +876,17 @@
     --spark-card-c-contrast: var(--spark-contrast);
   }
 
+  /* An explicit neutral card opts out of an inherited accent card colour: initial drops each slot to its neutral fallback. */
+  [data-card-color='neutral'],
+  :where([data-card-color='neutral'] .spark-theme) {
+    --spark-card-c-soft: initial;
+    --spark-card-c-soft-hover: initial;
+    --spark-card-c-surface: initial;
+    --spark-card-c-border: initial;
+    --spark-card-c-solid: initial;
+    --spark-card-c-contrast: initial;
+  }
+
   [data-card-variant='soft'],
   :where([data-card-variant='soft'] .spark-theme),
   :where([data-card-variant='soft'] [data-card-color]) {

package/dist/utils/cn.cjs

@@ -1,9 +1,9 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-let cnfast = require("cnfast");
+let cn = require("cn");
 Object.defineProperty(exports, "cn", {
 	enumerable: true,
 	get: function() {
-		return cnfast.cn;
+		return cn.cn;
 	}
 });

package/dist/utils/cn.d.cts

@@ -1,4 +1,4 @@
 "use client";
 
-import { cn } from "cnfast";
+import { cn } from "cn";
 export { cn };

package/dist/utils/cn.d.ts

@@ -1,4 +1,4 @@
 "use client";
 
-import { cn } from "cnfast";
+import { cn } from "cn";
 export { cn };

package/dist/utils/cn.js

@@ -1,3 +1,3 @@
 "use client";
-import { cn } from "cnfast";
+import { cn } from "cn";
 export { cn };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epilot/spark-ui",
-  "version": "0.20.1",
+  "version": "0.21.0",
   "description": "React UI component library from Spark SDK",
   "homepage": "https://spark-ui.epilot.io/docs/ui",
   "license": "Apache-2.0",
@@ -79,7 +79,7 @@
     "@visx/vendor": "^4.0.0-alpha.11",
     "bezier-easing": "^2.1.0",
     "class-variance-authority": "^0.7.1",
-    "cnfast": "^0.0.8",
+    "cn": "^0.4.0",
     "colorjs.io": "^0.5.2",
     "ictus": "^0.1.2",
     "vaul": "^1.1.2",