@hyvnt/hyvui 0.2.0 → 0.4.0

package/dist/tokens/tokens.js

@@ -12,14 +12,55 @@ export const tokens = {
         statusOk: '#79a6a3',
         statusPend: '#8b8476',
         statusWarn: '#c79c57',
-        statusFail: '#b66a48',
+        statusFail: '#b66a48'
     },
     font: {
         body: "'ET Book', 'Iowan Old Style', 'Palatino Linotype', serif",
-        mono: "'IBM Plex Mono', 'Menlo', 'Consolas', monospace",
+        mono: "'IBM Plex Mono', 'Menlo', 'Consolas', monospace"
     },
     transition: {
         smooth: '0.35s cubic-bezier(0.22, 1, 0.36, 1)',
-        fast: '0.16s cubic-bezier(0.4, 0, 0.2, 1)',
+        fast: '0.16s cubic-bezier(0.4, 0, 0.2, 1)'
+    }
+};
+/**
+ * Typed Tailwind class names for all hyvui token colors.
+ * Use these instead of writing class strings by hand to get full IDE autocomplete.
+ *
+ * @example
+ * import { themeClasses } from '@hyvnt/hyvui';
+ * // themeClasses.text.accent  → 'text-accent'
+ * // themeClasses.bg.elevated  → 'bg-bg-elev'
+ */
+export const themeClasses = {
+    bg: {
+        base: 'bg-bg',
+        elevated: 'bg-bg-elev'
+    },
+    text: {
+        primary: 'text-text',
+        soft: 'text-text-soft',
+        muted: 'text-muted',
+        mutedStrong: 'text-muted-strong',
+        accent: 'text-accent',
+        accentStrong: 'text-accent-strong',
+        signal: 'text-signal'
+    },
+    border: {
+        default: 'border-line',
+        strong: 'border-line-strong'
+    },
+    font: {
+        body: 'font-body',
+        mono: 'font-mono'
+    },
+    shadow: {
+        veil: 'shadow-veil'
     },
+    status: {
+        ok: 'text-status-ok',
+        pend: 'text-status-pend',
+        warn: 'text-status-warn',
+        fail: 'text-status-fail'
+    }
 };

package/dist/utils/motion.js

@@ -3,7 +3,7 @@ export const staggerIn = {
     from: { opacity: 0, transform: 'translateY(6px)' },
     to: { opacity: 1, transform: 'translateY(0)' },
     duration: 500,
-    easing: 'cubic-bezier(0.22, 1, 0.36, 1)',
+    easing: 'cubic-bezier(0.22, 1, 0.36, 1)'
 };
 /** Standard hover-lift transform. */
 export const hoverLift = 'translateY(-2px)';

package/package.json

@@ -1,60 +1,71 @@
-{
-	"name": "@hyvnt/hyvui",
-	"version": "0.2.0",
-	"publishConfig": {
-		"access": "public"
-	},
-	"scripts": {
-		"dev": "vite dev",
-		"build": "vite build && npm run prepack",
-		"preview": "vite preview",
-		"prepare": "svelte-kit sync || echo ''",
-		"prepack": "svelte-kit sync && svelte-package && publint",
-		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-		"format": "prettier --write .",
-		"lint": "prettier --check ."
-	},
-	"files": [
-		"dist",
-		"!dist/**/*.test.*",
-		"!dist/**/*.spec.*"
-	],
-	"sideEffects": [
-		"**/*.css"
-	],
-	"svelte": "./dist/index.js",
-	"types": "./dist/index.d.ts",
-	"type": "module",
-	"exports": {
-		".": {
-			"types": "./dist/index.d.ts",
-			"svelte": "./dist/index.js"
-		}
-	},
-	"peerDependencies": {
-		"svelte": "^5.0.0"
-	},
-	"devDependencies": {
-		"@sveltejs/adapter-auto": "^6.0.0",
-		"@sveltejs/kit": "^2.22.0",
-		"@sveltejs/package": "^2.0.0",
-		"@sveltejs/vite-plugin-svelte": "^6.0.0",
-		"@tailwindcss/forms": "^0.5.9",
-		"@tailwindcss/typography": "^0.5.15",
-		"@tailwindcss/vite": "^4.0.0",
-		"prettier": "^3.4.2",
-		"prettier-plugin-svelte": "^3.3.3",
-		"prettier-plugin-tailwindcss": "^0.6.11",
-		"publint": "^0.3.2",
-		"svelte": "^5.0.0",
-		"svelte-check": "^4.0.0",
-		"tailwindcss": "^4.0.0",
-		"typescript": "^5.0.0",
-		"vite": "^7.0.4",
-		"vite-plugin-devtools-json": "^1.0.0"
-	},
-	"keywords": [
-		"svelte"
-	]
-}
+{
+	"name": "@hyvnt/hyvui",
+	"version": "0.4.0",
+	"publishConfig": {
+		"access": "public"
+	},
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run prepack",
+		"preview": "vite preview",
+		"prepare": "svelte-kit sync || echo ''",
+		"prepack": "svelte-kit sync && svelte-package && publint",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"format": "prettier --write .",
+		"lint": "prettier --check .",
+		"test:e2e": "npm run build && playwright test"
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"sideEffects": [
+		"**/*.css"
+	],
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"type": "module",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		},
+		"./styles.css": "./dist/styles.css",
+		"./styles": "./dist/styles.css",
+		"./tokens/hextech.css": "./dist/tokens/hextech.css",
+		"./tokens/arcane.css": "./dist/tokens/arcane.css",
+		"./tokens/base.css": "./dist/tokens/tokens.css",
+		"./register.css": "./dist/system/register.css"
+	},
+	"peerDependencies": {
+		"svelte": "^5.0.0"
+	},
+	"dependencies": {
+		"@floating-ui/dom": "^1.6.13"
+	},
+	"devDependencies": {
+		"@playwright/test": "^1.50.0",
+		"@sveltejs/adapter-auto": "^6.0.0",
+		"@sveltejs/kit": "^2.22.0",
+		"@sveltejs/package": "^2.0.0",
+		"@sveltejs/vite-plugin-svelte": "^6.0.0",
+		"@tailwindcss/forms": "^0.5.9",
+		"@tailwindcss/typography": "^0.5.15",
+		"@tailwindcss/vite": "^4.0.0",
+		"prettier": "^3.4.2",
+		"prettier-plugin-svelte": "^3.3.3",
+		"prettier-plugin-tailwindcss": "^0.7.2",
+		"publint": "^0.3.2",
+		"svelte": "^5.0.0",
+		"svelte-check": "^4.0.0",
+		"tailwindcss": "^4.0.0",
+		"typescript": "^5.0.0",
+		"vite": "^7.0.4",
+		"vite-plugin-devtools-json": "^1.0.0"
+	},
+	"keywords": [
+		"svelte"
+	]
+}