light-chain-open-ui 1.0.0

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "light-chain-open-ui",
+  "version": "1.0.0",
+  "description": "",
+  "type": "module",
+  "main": "./dist/lightchain-ui.cjs",
+  "module": "./dist/lightchain-ui.mjs",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/lightchain-ui.mjs",
+      "require": "./dist/lightchain-ui.cjs"
+    },
+    "./react": {
+      "types": "./dist/types/react/index.d.ts",
+      "import": "./dist/react.mjs",
+      "require": "./dist/react.cjs"
+    }
+  },
+  "files": [
+    "dist",
+    "src/styles"
+  ],
+  "scripts": {
+    "clean": "node -e \"fs.rmSync('dist',{recursive:true,force:true})\"",
+    "build": "npm run clean && tsc && vite build",
+    "typecheck:stories": "tsc -p tsconfig.stories.json",
+    "test": "vitest",
+    "test:run": "vitest run",
+    "storybook": "storybook dev -p 6006",
+    "build:storybook": "storybook build"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@lit/react": "^1.0.8",
+    "lit": "^3.3.3"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^5.2.1",
+    "@storybook/addon-a11y": "^10.4.0",
+    "@storybook/addon-docs": "^10.4.0",
+    "@storybook/addon-vitest": "^10.4.0",
+    "@storybook/web-components-vite": "^10.4.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitest/browser-playwright": "^4.1.6",
+    "@vitest/coverage-v8": "^4.1.6",
+    "fetch-mock": "^12.6.0",
+    "jsdom": "^29.1.1",
+    "playwright": "^1.60.0",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
+    "storybook": "^10.4.0",
+    "typescript": "^6.0.3",
+    "vite": "^8.0.13",
+    "vitest": "^4.1.6"
+  }
+}

package/src/styles/reset.css

@@ -0,0 +1,2 @@
+*, *::before, *::after { box-sizing: border-box; }
+:host { display: block; font-family: var(--lc-font-family); line-height: var(--lc-line-height); color: var(--lc-color-text); }

package/src/styles/themes/dark.css

@@ -0,0 +1,14 @@
+:root {
+  --lc-color-primary: var(--lc-color-blue-500);
+  --lc-color-primary-hover: var(--lc-color-blue-600);
+  --lc-color-primary-light: #1E3A5F;
+  --lc-color-bg: #1F2937;
+  --lc-color-bg-secondary: #374151;
+  --lc-color-border: #4B5563;
+  --lc-color-text: #F9FAFB;
+  --lc-color-text-secondary: #9CA3AF;
+  --lc-color-text-placeholder: #6B7280;
+  --lc-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
+  --lc-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
+  --lc-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.5);
+}

package/src/styles/themes/default.css

@@ -0,0 +1,2 @@
+/* 默认主题 - 所有语义 Token 已在 tokens.css 的 :root 中定义 */
+/* 用户可通过覆盖此文件自定义主题 */

package/src/styles/tokens.css

@@ -0,0 +1,68 @@
+/* ========== 全局 Token ========== */
+:root {
+  /* Colors - Brand */
+  --lc-color-blue-50: #EFF6FF;
+  --lc-color-blue-100: #DBEAFE;
+  --lc-color-blue-500: #3B82F6;
+  --lc-color-blue-600: #2563EB;
+  --lc-color-blue-700: #1D4ED8;
+
+  /* Colors - Neutral */
+  --lc-color-gray-50: #F9FAFB;
+  --lc-color-gray-100: #F3F4F6;
+  --lc-color-gray-200: #E5E7EB;
+  --lc-color-gray-300: #D1D5DB;
+  --lc-color-gray-500: #6B7280;
+  --lc-color-gray-700: #374151;
+  --lc-color-gray-900: #111827;
+
+  /* Colors - Status */
+  --lc-color-success: #10B981;
+  --lc-color-warning: #F59E0B;
+  --lc-color-error: #EF4444;
+
+  /* Spacing */
+  --lc-spacing-1: 4px;
+  --lc-spacing-2: 8px;
+  --lc-spacing-3: 12px;
+  --lc-spacing-4: 16px;
+  --lc-spacing-5: 20px;
+  --lc-spacing-6: 24px;
+
+  /* Typography */
+  --lc-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  --lc-font-size-xs: 12px;
+  --lc-font-size-sm: 14px;
+  --lc-font-size-base: 16px;
+  --lc-font-size-lg: 18px;
+  --lc-font-size-xl: 20px;
+  --lc-line-height: 1.5;
+
+  /* Border Radius */
+  --lc-radius-sm: 4px;
+  --lc-radius-md: 8px;
+  --lc-radius-lg: 12px;
+  --lc-radius-full: 9999px;
+
+  /* Shadows */
+  --lc-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
+  --lc-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
+  --lc-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
+
+  /* Transitions */
+  --lc-transition-fast: 150ms ease;
+  --lc-transition-normal: 200ms ease;
+
+  /* ========== 语义 Token ========== */
+  --lc-color-primary: var(--lc-color-blue-600);
+  --lc-color-primary-hover: var(--lc-color-blue-700);
+  --lc-color-primary-light: var(--lc-color-blue-50);
+  --lc-color-bg: #FFFFFF;
+  --lc-color-bg-secondary: var(--lc-color-gray-50);
+  --lc-color-border: var(--lc-color-gray-200);
+  --lc-color-text: var(--lc-color-gray-900);
+  --lc-color-text-secondary: var(--lc-color-gray-500);
+  --lc-color-text-placeholder: var(--lc-color-gray-300);
+  --lc-radius-component: var(--lc-radius-md);
+  --lc-spacing-component: var(--lc-spacing-4);
+}