@blenx-dev/theme 0.0.3 → 0.1.2

package/.turbo/turbo-check-types.log

@@ -0,0 +1 @@
+$ tsc --noEmit

package/CHANGELOG.md

@@ -0,0 +1,13 @@
+# @blenx-dev/theme
+
+## 0.1.2
+
+### Patch Changes
+
+- 423768f: add reset file
+
+## 0.1.0
+
+### Minor Changes
+
+- finalizing initial versions

package/package.json

@@ -1,33 +1,18 @@
 {
   "name": "@blenx-dev/theme",
-  "version": "0.0.3",
+  "version": "0.1.2",
   "type": "module",
+  "sideEffects": false,
+  "exports": {
+    "./contract": "./src/contract.css.ts",
+    "./tokens": "./src/tokens.css.ts",
+    "./light-theme": "./src/light-theme.css.ts",
+    "./reset": "./src/reset.css.ts"
+  },
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": [
-    "./theme.css"
-  ],
-  "exports": {
-    ".": {
-      "types": "./index.d.ts",
-      "import": "./index.js"
-    },
-    "./contract": {
-      "types": "./contract.css.d.ts",
-      "import": "./contract.js"
-    },
-    "./tokens": {
-      "types": "./tokens.css.d.ts",
-      "import": "./tokens.js"
-    },
-    "./light-theme": {
-      "types": "./light-theme.css.d.ts",
-      "import": "./light-theme.js"
-    },
-    "./theme.css": "./theme.css"
-  },
   "dependencies": {
     "@vanilla-extract/css": "^1.20.1"
   }
-}
+}

package/src/contract.css.ts

@@ -0,0 +1,44 @@
+import { createThemeContract } from "@vanilla-extract/css";
+
+export const themeContract = createThemeContract({
+  primary: "primary",
+  primarySubtle: "primary-subtle",
+  secondary: "secondary",
+  primaryHover: "primary-hover",
+  contentPrimary: "content-primary",
+  contentSecondary: "content-secondary",
+  contentDisabled: "content-disabled",
+  contentAccent: "content-accent",
+  contentOnPrimary: "content-on-primary",
+  surface: "surface",
+  surfaceSubtle: "surface-subtle",
+  surfaceRaised: "surface-raised",
+  surfaceHover: "surface-hover",
+  surfaceOverlay: "surface-overlay",
+  border: "border",
+  borderSubtle: "border-subtle",
+  borderStrong: "border-strong",
+  borderRadius: "border-radius",
+  background: "background",
+  backgroundSubtle: "background-subtle",
+  sentimentPositive: "sentiment-positive",
+  sentimentPositiveSubtle: "sentiment-positive-subtle",
+  sentimentPositiveHover: "sentiment-positive-hover",
+  sentimentWarning: "sentiment-warning",
+  sentimentWarningSubtle: "sentiment-warning-subtle",
+  sentimentWarningHover: "sentiment-warning-hover",
+  sentimentNegative: "sentiment-negative",
+  sentimentNegativeSubtle: "sentiment-negative-subtle",
+  sentimentNegativeHover: "sentiment-negative-hover",
+  sentimentInfo: "sentiment-info",
+  sentimentInfoSubtle: "sentiment-info-subtle",
+  sentimentInfoHover: "sentiment-info-hover",
+  focusRing: "focus-ring",
+  shadowSm: "shadow-sm",
+  shadowMd: "shadow-md",
+  shadowLg: "shadow-lg",
+  shadowXl: "shadow-xl",
+  fontSize: "font-size",
+  hoverOverlay: "hover-overlay",
+  hoverOverlaySoft: "hover-overlay-soft",
+});

package/src/index.ts

@@ -0,0 +1,3 @@
+export * from "./contract.css";
+export * from "./light-theme.css";
+export * from "./tokens.css";

package/src/light-theme.css.ts

@@ -0,0 +1,107 @@
+import { createTheme } from "@vanilla-extract/css";
+import { themeContract } from "./contract.css";
+
+export const [themeClass, themeVars] = createTheme(themeContract, {
+  primary: "#1c1917",
+  primarySubtle: "#57534e",
+  secondary: "#4f5d95",
+  focusRing: "#5b5fc7",
+
+  background: "#f5f3ef",
+  backgroundSubtle: "#edeae4",
+
+  surface: "#ffffff",
+  surfaceSubtle: "#faf9f7",
+  surfaceRaised: "#ffffff",
+  surfaceHover: "#edeae4",
+  surfaceOverlay: "rgba(28,25,23,0.35)",
+
+  border: "#e2ddd6",
+  borderSubtle: "#edeae4",
+  borderStrong: "#c8c1b5",
+
+  contentPrimary: "#1c1917",
+  contentSecondary: "#57534e",
+  contentDisabled: "#a8a29e",
+  contentAccent: "#1c1917",
+  contentOnPrimary: "#ffffff",
+
+  sentimentNegative: "#ef4444",
+  sentimentNegativeSubtle: "#fef2f2",
+  sentimentPositive: "#10b981",
+  sentimentPositiveSubtle: "#ecfdf5",
+  sentimentWarning: "#f59e0b",
+  sentimentWarningSubtle: "#fffbeb",
+  sentimentInfo: "#0ea5e9",
+  sentimentInfoSubtle: "#f0f9ff",
+
+  shadowSm: "0 1px 3px rgba(28,25,23,0.07), 0 1px 2px rgba(28,25,23,0.04)",
+  shadowMd: "0 4px 12px rgba(28,25,23,0.09), 0 2px 4px rgba(28,25,23,0.05)",
+  shadowLg: "0 8px 24px rgba(28,25,23,0.11), 0 4px 8px rgba(28,25,23,0.05)",
+  shadowXl: "0 20px 48px rgba(28,25,23,0.14), 0 8px 16px rgba(28,25,23,0.07)",
+
+  primaryHover: "#292524",
+  sentimentPositiveHover: "#059669",
+  sentimentWarningHover: "#d97706",
+  sentimentNegativeHover: "#dc2626",
+  sentimentInfoHover: "#0284c7",
+
+  hoverOverlay: "rgba(28,25,23,0.05)",
+  hoverOverlaySoft: "rgba(28,25,23,0.10)",
+
+  fontSize: "16px",
+  borderRadius: "12px",
+});
+
+export const darkThemeClass = createTheme(themeContract, {
+  primary: "#f5f3ef",
+  primarySubtle: "#d4cec5",
+  secondary: "#8ea0ff",
+
+  background: "#0f0e0c",
+  backgroundSubtle: "#1a1916",
+
+  surface: "#1a1916",
+  surfaceSubtle: "#242320",
+  surfaceRaised: "#2e2c28",
+  surfaceHover: "#2e2c28",
+  surfaceOverlay: "rgba(0,0,0,0.75)",
+
+  border: "#2e2c28",
+  borderSubtle: "#242320",
+  borderStrong: "#3c3a35",
+
+  contentPrimary: "#f5f3ef",
+  contentSecondary: "#a8a29e",
+  contentDisabled: "#57534e",
+  contentAccent: "#f5f3ef",
+  contentOnPrimary: "#0f0e0c",
+
+  focusRing: "#818cf8",
+
+  sentimentNegative: "#f87171",
+  sentimentNegativeSubtle: "#450a0a",
+  sentimentPositive: "#34d399",
+  sentimentPositiveSubtle: "#064e3b",
+  sentimentWarning: "#fbbf24",
+  sentimentWarningSubtle: "#451a03",
+  sentimentInfo: "#38bdf8",
+  sentimentInfoSubtle: "#082f49",
+
+  shadowSm: "0 1px 3px rgba(0,0,0,0.28), 0 1px 2px rgba(0,0,0,0.18)",
+  shadowMd: "0 4px 12px rgba(0,0,0,0.32), 0 2px 4px rgba(0,0,0,0.18)",
+  shadowLg: "0 8px 24px rgba(0,0,0,0.38), 0 4px 8px rgba(0,0,0,0.22)",
+  shadowXl: "0 20px 48px rgba(0,0,0,0.48), 0 8px 16px rgba(0,0,0,0.28)",
+
+  primaryHover: "#e7e3dc",
+  sentimentPositiveHover: "#6ee7b7",
+  sentimentWarningHover: "#fcd34d",
+  sentimentNegativeHover: "#fca5a5",
+  sentimentInfoHover: "#7dd3fc",
+
+  hoverOverlay: "rgba(245,243,239,0.07)",
+  hoverOverlaySoft: "rgba(245,243,239,0.13)",
+
+  fontSize: "16px",
+  borderRadius: "12px",
+});

package/src/reset.css.ts

@@ -0,0 +1,48 @@
+import { globalStyle } from "@vanilla-extract/css";
+
+globalStyle("*", {
+  margin: 0,
+  padding: 0,
+  boxSizing: "border-box",
+});
+
+globalStyle("*::before, *::after", {
+  boxSizing: "border-box",
+});
+
+globalStyle("html, body", {
+  margin: 0,
+  padding: 0,
+  minHeight: "100%",
+});
+
+globalStyle("body", {
+  lineHeight: 1.5,
+  WebkitFontSmoothing: "antialiased",
+  MozOsxFontSmoothing: "grayscale",
+});
+
+globalStyle("h1, h2, h3, h4, h5, h6", {
+  fontSize: "inherit",
+  fontWeight: "inherit",
+});
+
+globalStyle("ul, ol", {
+  margin: 0,
+  padding: 0,
+});
+
+globalStyle("img, picture, video, canvas, svg", {
+  display: "block",
+  maxWidth: "100%",
+});
+
+globalStyle("button,a,input, textarea, select", {
+  font: "inherit",
+  color: "inherit",
+  textDecoration: "none",
+});
+
+globalStyle("#root", {
+  minHeight: "100vh",
+});

package/src/tokens.css.ts

@@ -0,0 +1,159 @@
+import { style } from "@vanilla-extract/css";
+import { themeContract } from "./contract.css";
+
+export const borderRadius = {
+  xs: "2px",
+  sm: "4px",
+  md: "8px",
+  lg: "12px",
+  xl: "16px",
+  xxl: "24px",
+  full: "999px",
+} as const;
+
+export const fonts = {
+  sans: '"DM Sans", system-ui, -apple-system, sans-serif',
+  body: '"DM Sans", system-ui, sans-serif',
+  mono: '"DM Mono", ui-monospace, SFMono-Regular, monospace',
+} as const;
+
+export const fontSize = {
+  xxs: "10px",
+  xs: "12px",
+  sm: "14px",
+  md: "16px",
+  lg: "18px",
+  xl: "20px",
+  xxl: "24px",
+  xxxl: "30px",
+  display: "36px",
+  displayLg: "48px",
+  hero: "60px",
+} as const;
+
+export const fontWeight = {
+  regular: "400",
+  medium: "500",
+  semibold: "600",
+  bold: "700",
+  extrabold: "800",
+} as const;
+
+export const lineHeight = {
+  tight: "1.2",
+  snug: "1.35",
+  normal: "1.5",
+  relaxed: "1.625",
+  loose: "1.8",
+} as const;
+
+export const letterSpacing = {
+  tight: "-0.04em",
+  snug: "-0.02em",
+  normal: "0",
+  wide: "0.02em",
+  wider: "0.05em",
+  widest: "0.1em",
+} as const;
+
+export const spacing = {
+  none: "0px",
+  xxs: "4px",
+  xs: "8px",
+  sm: "12px",
+  md: "16px",
+  lg: "24px",
+  xl: "32px",
+  xxl: "48px",
+  xxxl: "64px",
+  huge: "80px",
+  massive: "96px",
+  titanic: "192px",
+  "0": "0px",
+  "0.5": "2px",
+  "1": "4px",
+  "2": "8px",
+  "3": "12px",
+  "4": "16px",
+  "5": "20px",
+  "6": "24px",
+  "7": "28px",
+  "8": "32px",
+  "9": "36px",
+  "10": "40px",
+  "12": "48px",
+  "16": "64px",
+  "20": "80px",
+  "24": "96px",
+  "32": "128px",
+  "40": "160px",
+  "48": "192px",
+} as const;
+
+export const mediaQueries = {
+  sm: "screen and (min-width: 640px)",
+  md: "screen and (min-width: 768px)",
+  lg: "screen and (min-width: 1024px)",
+  xl: "screen and (min-width: 1280px)",
+  xxl: "screen and (min-width: 1536px)",
+  dark: "(prefers-color-scheme: dark)",
+} as const;
+
+export const primitives = {
+  trigger: style({
+    appearance: "none",
+    backgroundColor: "transparent",
+    border: "none",
+    font: "inherit",
+    color: "inherit",
+    textDecoration: "none",
+    borderWidth: 0,
+    WebkitTapHighlightColor: "transparent",
+  }),
+  focusable: style({
+    outline: "none",
+    selectors: {
+      "&:focus-visible": {
+        outline: `2px solid ${themeContract.focusRing}`,
+      },
+    },
+  }),
+};
+
+export const borderWidth = {
+  hairline: "0.5px",
+  thin: "1px",
+  medium: "1.5px",
+  thick: "2px",
+  heavy: "3px",
+} as const;
+
+export const duration = {
+  instant: "50ms",
+  fast: "100ms",
+  normal: "200ms",
+  slow: "300ms",
+  slower: "500ms",
+  lazy: "700ms",
+} as const;
+
+export const easing = {
+  linear: "linear",
+  standard: "cubic-bezier(0.4, 0, 0.2, 1)",
+  enter: "cubic-bezier(0, 0, 0.2, 1)",
+  exit: "cubic-bezier(0.4, 0, 1, 1)",
+  spring: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+  bounce: "cubic-bezier(0.68, -0.55, 0.27, 1.55)",
+} as const;
+
+export const zIndex = {
+  base: 0,
+  raised: 100,
+  floating: 1000,
+  sticky: 1100,
+  overlay: 1200,
+  popover: 1300,
+  modal: 1400,
+  toast: 1500,
+  tooltip: 1600,
+} as const;

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "@blenx-dev/config/tsconfig.base.json",
+  "compilerOptions": {
+    "lib": ["ESNext", "DOM", "DOM.Iterable"],
+    "types": []
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["node_modules"]
+}

package/contract.css.d.ts

@@ -1,42 +0,0 @@
-export declare const themeContract: {
-    primary: `var(--${string})`;
-    primarySubtle: `var(--${string})`;
-    secondary: `var(--${string})`;
-    primaryHover: `var(--${string})`;
-    contentPrimary: `var(--${string})`;
-    contentSecondary: `var(--${string})`;
-    contentDisabled: `var(--${string})`;
-    contentAccent: `var(--${string})`;
-    contentOnPrimary: `var(--${string})`;
-    surface: `var(--${string})`;
-    surfaceSubtle: `var(--${string})`;
-    surfaceRaised: `var(--${string})`;
-    surfaceHover: `var(--${string})`;
-    surfaceOverlay: `var(--${string})`;
-    border: `var(--${string})`;
-    borderSubtle: `var(--${string})`;
-    borderStrong: `var(--${string})`;
-    borderRadius: `var(--${string})`;
-    background: `var(--${string})`;
-    backgroundSubtle: `var(--${string})`;
-    sentimentPositive: `var(--${string})`;
-    sentimentPositiveSubtle: `var(--${string})`;
-    sentimentPositiveHover: `var(--${string})`;
-    sentimentWarning: `var(--${string})`;
-    sentimentWarningSubtle: `var(--${string})`;
-    sentimentWarningHover: `var(--${string})`;
-    sentimentNegative: `var(--${string})`;
-    sentimentNegativeSubtle: `var(--${string})`;
-    sentimentNegativeHover: `var(--${string})`;
-    sentimentInfo: `var(--${string})`;
-    sentimentInfoSubtle: `var(--${string})`;
-    sentimentInfoHover: `var(--${string})`;
-    focusRing: `var(--${string})`;
-    shadowSm: `var(--${string})`;
-    shadowMd: `var(--${string})`;
-    shadowLg: `var(--${string})`;
-    shadowXl: `var(--${string})`;
-    fontSize: `var(--${string})`;
-    hoverOverlay: `var(--${string})`;
-    hoverOverlaySoft: `var(--${string})`;
-};

package/contract.js

@@ -1,46 +0,0 @@
-/* empty css                                 */
-//#region src/contract.css.ts
-var e = {
-	primary: "var(--_1sm466m0)",
-	primarySubtle: "var(--_1sm466m1)",
-	secondary: "var(--_1sm466m2)",
-	primaryHover: "var(--_1sm466m3)",
-	contentPrimary: "var(--_1sm466m4)",
-	contentSecondary: "var(--_1sm466m5)",
-	contentDisabled: "var(--_1sm466m6)",
-	contentAccent: "var(--_1sm466m7)",
-	contentOnPrimary: "var(--_1sm466m8)",
-	surface: "var(--_1sm466m9)",
-	surfaceSubtle: "var(--_1sm466ma)",
-	surfaceRaised: "var(--_1sm466mb)",
-	surfaceHover: "var(--_1sm466mc)",
-	surfaceOverlay: "var(--_1sm466md)",
-	border: "var(--_1sm466me)",
-	borderSubtle: "var(--_1sm466mf)",
-	borderStrong: "var(--_1sm466mg)",
-	borderRadius: "var(--_1sm466mh)",
-	background: "var(--_1sm466mi)",
-	backgroundSubtle: "var(--_1sm466mj)",
-	sentimentPositive: "var(--_1sm466mk)",
-	sentimentPositiveSubtle: "var(--_1sm466ml)",
-	sentimentPositiveHover: "var(--_1sm466mm)",
-	sentimentWarning: "var(--_1sm466mn)",
-	sentimentWarningSubtle: "var(--_1sm466mo)",
-	sentimentWarningHover: "var(--_1sm466mp)",
-	sentimentNegative: "var(--_1sm466mq)",
-	sentimentNegativeSubtle: "var(--_1sm466mr)",
-	sentimentNegativeHover: "var(--_1sm466ms)",
-	sentimentInfo: "var(--_1sm466mt)",
-	sentimentInfoSubtle: "var(--_1sm466mu)",
-	sentimentInfoHover: "var(--_1sm466mv)",
-	focusRing: "var(--_1sm466mw)",
-	shadowSm: "var(--_1sm466mx)",
-	shadowMd: "var(--_1sm466my)",
-	shadowLg: "var(--_1sm466mz)",
-	shadowXl: "var(--_1sm466m10)",
-	fontSize: "var(--_1sm466m11)",
-	hoverOverlay: "var(--_1sm466m12)",
-	hoverOverlaySoft: "var(--_1sm466m13)"
-};
-//#endregion
-export { e as themeContract };

package/index.d.ts

@@ -1,3 +0,0 @@
-export * from './contract.css';
-export * from './light-theme.css';
-export * from './tokens.css';

package/index.js

@@ -1,4 +0,0 @@
-import { themeContract as e } from "./contract.js";
-import { darkThemeClass as t, themeClass as n, themeVars as r } from "./light-theme.js";
-import { borderRadius as i, borderWidth as a, duration as o, easing as s, fontSize as c, fontWeight as l, fonts as u, letterSpacing as d, lineHeight as f, mediaQueries as p, primitives as m, spacing as h, zIndex as g } from "./tokens.js";
-export { i as borderRadius, a as borderWidth, t as darkThemeClass, o as duration, s as easing, c as fontSize, l as fontWeight, u as fonts, d as letterSpacing, f as lineHeight, p as mediaQueries, m as primitives, h as spacing, n as themeClass, e as themeContract, r as themeVars, g as zIndex };

package/light-theme.css.d.ts

@@ -1,2 +0,0 @@
-export declare const themeClass: string | undefined, themeVars: string | undefined;
-export declare const darkThemeClass: string;

package/light-theme.js

@@ -1,5 +0,0 @@
-/* empty css                                 */
-//#region src/light-theme.css.ts
-var e = "r", t = "m", n = "rmo9em1";
-//#endregion
-export { n as darkThemeClass, e as themeClass, t as themeVars };

package/theme.css

@@ -1,2 +0,0 @@
-*{box-sizing:border-box;margin:0;padding:0}:before,:after{box-sizing:border-box}html,body{min-height:100%;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}ul,ol{margin:0;padding:0}img,picture,video,canvas,svg{max-width:100%;display:block}button,a,input,textarea,select{font:inherit;color:inherit;text-decoration:none}#root{min-height:100vh}.rmo9em0{--_1sm466m0:#1c1917;--_1sm466m1:#57534e;--_1sm466m2:#4f5d95;--_1sm466mw:#5b5fc7;--_1sm466mi:#f5f3ef;--_1sm466mj:#edeae4;--_1sm466m9:#fff;--_1sm466ma:#faf9f7;--_1sm466mb:#fff;--_1sm466mc:#edeae4;--_1sm466md:#1c191759;--_1sm466me:#e2ddd6;--_1sm466mf:#edeae4;--_1sm466mg:#c8c1b5;--_1sm466m4:#1c1917;--_1sm466m5:#57534e;--_1sm466m6:#a8a29e;--_1sm466m7:#1c1917;--_1sm466m8:#fff;--_1sm466mq:#ef4444;--_1sm466mr:#fef2f2;--_1sm466mk:#10b981;--_1sm466ml:#ecfdf5;--_1sm466mn:#f59e0b;--_1sm466mo:#fffbeb;--_1sm466mt:#0ea5e9;--_1sm466mu:#f0f9ff;--_1sm466mx:0 1px 3px #1c191712, 0 1px 2px #1c19170a;--_1sm466my:0 4px 12px #1c191717, 0 2px 4px #1c19170d;--_1sm466mz:0 8px 24px #1c19171c, 0 4px 8px #1c19170d;--_1sm466m10:0 20px 48px #1c191724, 0 8px 16px #1c191712;--_1sm466m3:#292524;--_1sm466mm:#059669;--_1sm466mp:#d97706;--_1sm466ms:#dc2626;--_1sm466mv:#0284c7;--_1sm466m12:#1c19170d;--_1sm466m13:#1c19171a;--_1sm466m11:16px;--_1sm466mh:12px}.rmo9em1{--_1sm466m0:#f5f3ef;--_1sm466m1:#d4cec5;--_1sm466m2:#4f5d95;--_1sm466mw:#5b5fc7;--_1sm466mi:#1c1917;--_1sm466mj:#edeae4;--_1sm466m9:#1c1917;--_1sm466ma:#faf9f7;--_1sm466mb:#fff;--_1sm466mc:#edeae4;--_1sm466md:#1c191759;--_1sm466me:#e2ddd6;--_1sm466mf:#edeae4;--_1sm466mg:#c8c1b5;--_1sm466m4:#1c1917;--_1sm466m5:#57534e;--_1sm466m6:#a8a29e;--_1sm466m7:#1c1917;--_1sm466m8:#fff;--_1sm466mq:#ef4444;--_1sm466mr:#fef2f2;--_1sm466mk:#10b981;--_1sm466ml:#ecfdf5;--_1sm466mn:#f59e0b;--_1sm466mo:#fffbeb;--_1sm466mt:#0ea5e9;--_1sm466mu:#f0f9ff;--_1sm466mx:0 1px 3px #1c191712, 0 1px 2px #1c19170a;--_1sm466my:0 4px 12px #1c191717, 0 2px 4px #1c19170d;--_1sm466mz:0 8px 24px #1c19171c, 0 4px 8px #1c19170d;--_1sm466m10:0 20px 48px #1c191724, 0 8px 16px #1c191712;--_1sm466m3:#292524;--_1sm466mm:#059669;--_1sm466mp:#d97706;--_1sm466ms:#dc2626;--_1sm466mv:#0284c7;--_1sm466m12:#1c19170d;--_1sm466m13:#1c19171a;--_1sm466m11:16px;--_1sm466mh:12px}.ah5rrr0{appearance:none;font:inherit;color:inherit;-webkit-tap-highlight-color:transparent;background-color:#0000;border:0;text-decoration:none}.ah5rrr1{outline:none}.ah5rrr1:focus-visible{outline:2px solid var(--_1sm466mw)}
-/*$vite$:1*/

package/tokens.css.d.ts

@@ -1,131 +0,0 @@
-export declare const borderRadius: {
-    readonly xsmall: "2px";
-    readonly small: "4px";
-    readonly medium: "8px";
-    readonly large: "12px";
-    readonly xlarge: "16px";
-    readonly xxlarge: "24px";
-    readonly full: "999px";
-};
-export declare const fonts: {
-    readonly sans: "\"DM Sans\", system-ui, -apple-system, sans-serif";
-    readonly display: "\"DM Sans\", system-ui, sans-serif";
-    readonly heading: "\"DM Sans\", system-ui, sans-serif";
-    readonly body: "\"DM Sans\", system-ui, sans-serif";
-    readonly label: "\"DM Sans\", system-ui, sans-serif";
-    readonly mono: "\"DM Mono\", ui-monospace, SFMono-Regular, monospace";
-};
-export declare const fontSize: {
-    readonly xxsmall: "10px";
-    readonly xsmall: "12px";
-    readonly small: "14px";
-    readonly medium: "16px";
-    readonly large: "18px";
-    readonly xlarge: "20px";
-    readonly xxlarge: "24px";
-    readonly xxxlarge: "30px";
-    readonly display: "36px";
-    readonly displayLg: "48px";
-    readonly hero: "60px";
-};
-export declare const fontWeight: {
-    readonly regular: "400";
-    readonly medium: "500";
-    readonly semibold: "600";
-    readonly bold: "700";
-    readonly extrabold: "800";
-};
-export declare const lineHeight: {
-    readonly tight: "1.2";
-    readonly snug: "1.35";
-    readonly normal: "1.5";
-    readonly relaxed: "1.625";
-    readonly loose: "1.8";
-};
-export declare const letterSpacing: {
-    readonly tight: "-0.04em";
-    readonly snug: "-0.02em";
-    readonly normal: "0";
-    readonly wide: "0.02em";
-    readonly wider: "0.05em";
-    readonly widest: "0.1em";
-};
-export declare const spacing: {
-    readonly none: "0px";
-    readonly xxsmall: "4px";
-    readonly xsmall: "8px";
-    readonly small: "12px";
-    readonly medium: "16px";
-    readonly large: "24px";
-    readonly xlarge: "32px";
-    readonly xxlarge: "48px";
-    readonly xxxlarge: "64px";
-    readonly huge: "80px";
-    readonly massive: "96px";
-    readonly titanic: "192px";
-    readonly "0": "0px";
-    readonly "0.5": "2px";
-    readonly "1": "4px";
-    readonly "2": "8px";
-    readonly "3": "12px";
-    readonly "4": "16px";
-    readonly "5": "20px";
-    readonly "6": "24px";
-    readonly "7": "28px";
-    readonly "8": "32px";
-    readonly "9": "36px";
-    readonly "10": "40px";
-    readonly "12": "48px";
-    readonly "16": "64px";
-    readonly "20": "80px";
-    readonly "24": "96px";
-    readonly "32": "128px";
-    readonly "40": "160px";
-    readonly "48": "192px";
-};
-export declare const mediaQueries: {
-    readonly sm: "screen and (min-width: 640px)";
-    readonly md: "screen and (min-width: 768px)";
-    readonly lg: "screen and (min-width: 1024px)";
-    readonly xl: "screen and (min-width: 1280px)";
-    readonly xxl: "screen and (min-width: 1536px)";
-    readonly dark: "(prefers-color-scheme: dark)";
-};
-export declare const primitives: {
-    trigger: string;
-    focusable: string;
-};
-export declare const borderWidth: {
-    readonly hairline: "0.5px";
-    readonly thin: "1px";
-    readonly medium: "1.5px";
-    readonly thick: "2px";
-    readonly heavy: "3px";
-};
-export declare const duration: {
-    readonly instant: "50ms";
-    readonly fast: "100ms";
-    readonly normal: "200ms";
-    readonly slow: "300ms";
-    readonly slower: "500ms";
-    readonly lazy: "700ms";
-};
-export declare const easing: {
-    readonly linear: "linear";
-    readonly standard: "cubic-bezier(0.4, 0, 0.2, 1)";
-    readonly enter: "cubic-bezier(0, 0, 0.2, 1)";
-    readonly exit: "cubic-bezier(0.4, 0, 1, 1)";
-    readonly spring: "cubic-bezier(0.34, 1.56, 0.64, 1)";
-    readonly bounce: "cubic-bezier(0.68, -0.55, 0.27, 1.55)";
-};
-export declare const zIndex: {
-    readonly base: 0;
-    readonly raised: 100;
-    readonly floating: 1000;
-    readonly sticky: 1100;
-    readonly overlay: 1200;
-    readonly popover: 1300;
-    readonly modal: 1400;
-    readonly toast: 1500;
-    readonly tooltip: 1600;
-};

package/tokens.js

@@ -1,123 +0,0 @@
-/* empty css                                 */
-//#region src/tokens.css.ts
-var e = {
-	xsmall: "2px",
-	small: "4px",
-	medium: "8px",
-	large: "12px",
-	xlarge: "16px",
-	xxlarge: "24px",
-	full: "999px"
-}, t = {
-	sans: "\"DM Sans\", system-ui, -apple-system, sans-serif",
-	display: "\"DM Sans\", system-ui, sans-serif",
-	heading: "\"DM Sans\", system-ui, sans-serif",
-	body: "\"DM Sans\", system-ui, sans-serif",
-	label: "\"DM Sans\", system-ui, sans-serif",
-	mono: "\"DM Mono\", ui-monospace, SFMono-Regular, monospace"
-}, n = {
-	xxsmall: "10px",
-	xsmall: "12px",
-	small: "14px",
-	medium: "16px",
-	large: "18px",
-	xlarge: "20px",
-	xxlarge: "24px",
-	xxxlarge: "30px",
-	display: "36px",
-	displayLg: "48px",
-	hero: "60px"
-}, r = {
-	regular: "400",
-	medium: "500",
-	semibold: "600",
-	bold: "700",
-	extrabold: "800"
-}, i = {
-	tight: "1.2",
-	snug: "1.35",
-	normal: "1.5",
-	relaxed: "1.625",
-	loose: "1.8"
-}, a = {
-	tight: "-0.04em",
-	snug: "-0.02em",
-	normal: "0",
-	wide: "0.02em",
-	wider: "0.05em",
-	widest: "0.1em"
-}, o = {
-	0: "0px",
-	1: "4px",
-	2: "8px",
-	3: "12px",
-	4: "16px",
-	5: "20px",
-	6: "24px",
-	7: "28px",
-	8: "32px",
-	9: "36px",
-	10: "40px",
-	12: "48px",
-	16: "64px",
-	20: "80px",
-	24: "96px",
-	32: "128px",
-	40: "160px",
-	48: "192px",
-	none: "0px",
-	xxsmall: "4px",
-	xsmall: "8px",
-	small: "12px",
-	medium: "16px",
-	large: "24px",
-	xlarge: "32px",
-	xxlarge: "48px",
-	xxxlarge: "64px",
-	huge: "80px",
-	massive: "96px",
-	titanic: "192px",
-	"0.5": "2px"
-}, s = {
-	sm: "screen and (min-width: 640px)",
-	md: "screen and (min-width: 768px)",
-	lg: "screen and (min-width: 1024px)",
-	xl: "screen and (min-width: 1280px)",
-	xxl: "screen and (min-width: 1536px)",
-	dark: "(prefers-color-scheme: dark)"
-}, c = {
-	trigger: "ah5rrr0",
-	focusable: "ah5rrr1"
-}, l = {
-	hairline: "0.5px",
-	thin: "1px",
-	medium: "1.5px",
-	thick: "2px",
-	heavy: "3px"
-}, u = {
-	instant: "50ms",
-	fast: "100ms",
-	normal: "200ms",
-	slow: "300ms",
-	slower: "500ms",
-	lazy: "700ms"
-}, d = {
-	linear: "linear",
-	standard: "cubic-bezier(0.4, 0, 0.2, 1)",
-	enter: "cubic-bezier(0, 0, 0.2, 1)",
-	exit: "cubic-bezier(0.4, 0, 1, 1)",
-	spring: "cubic-bezier(0.34, 1.56, 0.64, 1)",
-	bounce: "cubic-bezier(0.68, -0.55, 0.27, 1.55)"
-}, f = {
-	base: 0,
-	raised: 100,
-	floating: 1e3,
-	sticky: 1100,
-	overlay: 1200,
-	popover: 1300,
-	modal: 1400,
-	toast: 1500,
-	tooltip: 1600
-};
-//#endregion
-export { e as borderRadius, l as borderWidth, u as duration, d as easing, n as fontSize, r as fontWeight, t as fonts, a as letterSpacing, i as lineHeight, s as mediaQueries, c as primitives, o as spacing, f as zIndex };