@conciv/ui-kit-system 0.0.1

package/package.json

@@ -0,0 +1,79 @@
+{
+  "name": "@conciv/ui-kit-system",
+  "version": "0.0.1",
+  "description": "The conciv design system: SolidJS primitives (Button + Ark-UI-based Collapsible, HoverCard, ScrollArea, Combobox, Progress) styled with the shared UnoCSS preset, so every surface looks and behaves identically. Each component is viewable in Storybook.",
+  "keywords": [
+    "ark-ui",
+    "conciv",
+    "design-system",
+    "solid-js",
+    "ui-kit"
+  ],
+  "homepage": "https://github.com/conciv-dev/conciv/tree/main/packages/ui-kit-system#readme",
+  "bugs": "https://github.com/conciv-dev/conciv/issues",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/conciv-dev/conciv.git",
+    "directory": "packages/ui-kit-system"
+  },
+  "files": [
+    "dist",
+    "src/tokens.css"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./tokens": {
+      "types": "./dist/tokens.d.ts",
+      "import": "./dist/tokens.js"
+    },
+    "./tokens.css": "./src/tokens.css"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@ark-ui/solid": "^5.37.1",
+    "lucide-solid": "^1.18.0"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^5.2.1",
+    "@storybook/addon-a11y": "^10.4.4",
+    "@storybook/addon-docs": "^10.4.4",
+    "@storybook/addon-vitest": "^10.4.4",
+    "@types/node": "^22.19.21",
+    "@unocss/postcss": "^66.7.2",
+    "@unocss/reset": "^66.7.2",
+    "@vitest/browser-playwright": "4.1.8",
+    "@vitest/coverage-v8": "4.1.8",
+    "playwright": "^1.60.0",
+    "postcss": "^8.5.6",
+    "solid-js": "^1.9.13",
+    "storybook": "^10.4.4",
+    "storybook-solidjs-vite": "^10.3.0",
+    "typescript": "^6.0.3",
+    "unocss": "^66.7.2",
+    "vite": "^8.0.16",
+    "vite-plugin-solid": "^2.11.12",
+    "vitest": "^4.1.8",
+    "@conciv/uno-preset": "0.0.1"
+  },
+  "peerDependencies": {
+    "solid-js": "^1.9.13"
+  },
+  "scripts": {
+    "gen:tokens": "node scripts/gen-tokens.ts",
+    "build": "pnpm gen:tokens && vite build && tsc -p tsconfig.build.json",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "lint": "oxlint",
+    "test": "vitest run --passWithNoTests",
+    "storybook": "storybook dev -p 6008",
+    "build-storybook": "storybook build",
+    "publint": "publint",
+    "attw": "attw --pack . --profile esm-only --exclude-entrypoints tokens.css"
+  }
+}

package/src/tokens.css

@@ -0,0 +1,42 @@
+:host,
+:root {
+  --pw-hue: 328;
+  --pw-accent: #ff40e0;
+  --pw-accent-hi: color-mix(in oklch, var(--pw-accent), white 14%);
+  --pw-accent-link: color-mix(in oklch, var(--pw-accent), white 34%);
+  --pw-accent-08: color-mix(in oklch, var(--pw-accent) 10%, transparent);
+  --pw-accent-20: color-mix(in oklch, var(--pw-accent) 22%, transparent);
+  --pw-accent-line: color-mix(in oklch, var(--pw-accent) 42%, transparent);
+  --pw-panel: oklch(0.2 0.012 var(--pw-hue));
+  --pw-panel-sunk: oklch(0.16 0.012 var(--pw-hue));
+  --pw-glass: oklch(0.21 0.014 var(--pw-hue) / 0.97);
+  --pw-fill: oklch(1 0 0 / 0.05);
+  --pw-fill-soft: oklch(1 0 0 / 0.04);
+  --pw-fill-strong: oklch(1 0 0 / 0.1);
+  --pw-sunken: oklch(0.12 0.01 var(--pw-hue) / 0.5);
+  --pw-text: oklch(0.93 0.006 var(--pw-hue));
+  --pw-text-hi: oklch(0.98 0.008 var(--pw-hue));
+  --pw-text-2: oklch(0.74 0.012 var(--pw-hue));
+  --pw-text-3: oklch(0.64 0.012 var(--pw-hue));
+  --pw-on-accent: oklch(0.22 0.03 var(--pw-hue));
+  --pw-agent: oklch(0.79 0.13 188);
+  --pw-danger: oklch(0.72 0.15 25);
+  --pw-danger-line: oklch(0.72 0.15 25 / 0.42);
+  --pw-success: oklch(0.82 0.16 162);
+  --pw-warn: oklch(0.81 0.12 95);
+  --pw-dim: oklch(0.5 0.02 var(--pw-hue));
+  --pw-line: oklch(1 0 0 / 0.1);
+  --pw-line-2: oklch(1 0 0 / 0.18);
+  --pw-line-soft: oklch(1 0 0 / 0.06);
+  --pw-r-sm: 8px;
+  --pw-r-md: 12px;
+  --pw-r-lg: 18px;
+  --pw-r-pill: 999px;
+  --pw-shadow: 0 8px 28px oklch(0.12 0.02 var(--pw-hue) / 0.45);
+  --pw-shadow-lg: 0 16px 44px oklch(0.1 0.03 var(--pw-hue) / 0.55);
+  --pw-shadow-hover: 0 14px 34px oklch(0.1 0.03 var(--pw-hue) / 0.6);
+  --pw-ease: cubic-bezier(0.22, 1, 0.36, 1);
+  --pw-ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
+  --pw-font: system-ui, -apple-system, sans-serif;
+  --pw-mono: ui-monospace, monospace;
+}