{"_id":"@aitianyu.cn/ts-theme","name":"@aitianyu.cn/ts-theme","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@aitianyu.cn/ts-theme","version":"1.0.0","description":"Tianyu UI theme system — CSS variables for colors, control styles and base layout","type":"commonjs","main":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.js","default":"./dist/index.js"}},"scripts":{"before-build":"rimraf ./dist","build":"npm run before-build && tsc -p tsconfig.build.json","prepublishOnly":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/aitianyu-cn/ts-theme.git"},"keywords":["tianyu","theme","css","design-system"],"author":{"name":"dev@aitianyu.cn"},"license":"Apache-2.0","bugs":{"url":"https://github.com/aitianyu-cn/ts-theme/issues"},"homepage":"https://github.com/aitianyu-cn/ts-theme#readme","devDependencies":{"@types/node":"^26.1.2","rimraf":"^3.0.2","typescript":"^5.4.0"},"_id":"@aitianyu.cn/ts-theme@1.0.0","gitHead":"c6e3d5afc6d6d5baa85d2cb74a18257e3c288b4b","_nodeVersion":"20.19.5","_npmVersion":"10.8.2","dist":{"integrity":"sha512-GKhRJtE9PItvHXqwtEZrPKdmMdV8OLE4W5kvtRhRlpZcWhtkP/il2ADs2iFN5XrJL07gsTuYw09/yrQ5NcUfsg==","shasum":"00e54b39dd24785ddd6a2a5a622564e790516ec0","tarball":"https://registry.npmjs.org/@aitianyu.cn/ts-theme/-/ts-theme-1.0.0.tgz","fileCount":23,"unpackedSize":54593,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIH4LNouhnEbdGFIANpW0/T+yrGe3urMCXPHar20cXBfpAiEA0xZ1NRX+mseIY2YNR2fAGpag+NhLnw9T6RlBiosjaNQ="}]},"_npmUser":{"name":"aitianyu.cn","email":"product@aitianyu.cn"},"directories":{},"maintainers":[{"name":"aitianyu.cn","email":"product@aitianyu.cn"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ts-theme_1.0.0_1785308301282_0.5395725469597674"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-29T06:58:21.166Z","1.0.0":"2026-07-29T06:58:21.438Z","modified":"2026-07-29T06:58:21.606Z"},"maintainers":[{"name":"aitianyu.cn","email":"product@aitianyu.cn"}],"description":"Tianyu UI theme system — CSS variables for colors, control styles and base layout","homepage":"https://github.com/aitianyu-cn/ts-theme#readme","keywords":["tianyu","theme","css","design-system"],"repository":{"type":"git","url":"git+https://github.com/aitianyu-cn/ts-theme.git"},"author":{"name":"dev@aitianyu.cn"},"bugs":{"url":"https://github.com/aitianyu-cn/ts-theme/issues"},"license":"Apache-2.0","readme":"# @aitianyu.cn/ts-theme\n\nTianyu UI theme system — CSS variables for colors, control styles, and base layout.\n\n## Installation\n\n```bash\nnpm install @aitianyu.cn/ts-theme\n```\n\n## What's inside\n\n| Layer | Files | Purpose |\n|---|---|---|\n| **Color themes** | `content/colors/<name>-<mode>/base.css` | CSS custom properties for the full color palette |\n| **Control styles** | `content/styles/simple.css`, `scifi.css` | Shape, shadow, spacing, and motion tokens |\n| **Component reset** | `content/styles/component.css` | Box-model normalization and `.ts-ctrl` / `.ts-input` base classes |\n| **Basic theme** | `content/basic-theme/core_ui.css`, `dialog.css`, `dialog.animation.css` | z-index scale, full-viewport layout, and dialog primitives |\n\n### Color themes\n\nFive palettes, each in light and dark mode:\n\n| ID | Name | Primary |\n|---|---|---|\n| `simple` | Mono | Neutral grey |\n| `sky` | Sky (天空) | Blue `#2196f3` |\n| `dusk` | Dusk | Purple |\n| `meadow` | Meadow | Green |\n| `vivid` | Vivid | Red |\n\n### Control styles\n\n| ID | Character |\n|---|---|\n| `simple` | Flat, minimal, no shadows |\n| `scifi` | Volumetric glow, cinematic shadows |\n\n## TypeScript API\n\n```ts\nimport {\n  themeColors,       // readonly tuple of all color IDs\n  resolveTheme,      // map legacy name → ThemeColor | null\n  getThemePath,      // absolute path to a color CSS file\n  getLegacyThemePath,// resolve old name then return path\n  getStylePath,      // absolute path to a control-style CSS file\n  getComponentBasePath, // absolute path to component.css\n  getBasicThemePath, // absolute path to a basic-theme CSS file\n  getContentRoot,    // absolute path to the content/ directory\n  listThemes,        // all 10 theme combinations as ThemeMeta[]\n} from \"@aitianyu.cn/ts-theme\";\n```\n\n### Types\n\n```ts\ntype ThemeColor   = \"simple\" | \"sky\" | \"dusk\" | \"meadow\" | \"vivid\";\ntype ThemeMode    = \"light\" | \"dark\";\ntype ControlStyle = \"simple\" | \"scifi\";\n\ninterface ThemeMeta {\n  color:   ThemeColor;\n  mode:    ThemeMode;\n  cssPath: string;\n}\n```\n\n### Examples\n\n```ts\nimport { getThemePath, getStylePath, getComponentBasePath } from \"@aitianyu.cn/ts-theme\";\n\n// Resolve file paths and inject them into your bundler / SSR layer\nconst colorCss    = getThemePath(\"sky\", \"dark\");\nconst styleCss    = getStylePath(\"scifi\");\nconst componentCss = getComponentBasePath();\n```\n\n```ts\nimport { resolveTheme, getThemePath } from \"@aitianyu.cn/ts-theme\";\n\n// Accept a legacy name from user config\nconst color = resolveTheme(\"tianyu-default\"); // → \"sky\"\nif (color) {\n  const cssPath = getThemePath(color, \"light\");\n}\n```\n\n```ts\nimport { listThemes } from \"@aitianyu.cn/ts-theme\";\n\n// Enumerate all themes (e.g. to build a picker UI)\nfor (const { color, mode, cssPath } of listThemes()) {\n  console.log(`${color}-${mode}`, cssPath);\n}\n```\n\n### Legacy name map\n\nOld theme names from earlier Tianyu UI versions are still accepted by `resolveTheme` and `getLegacyThemePath`:\n\n| Legacy name | Resolves to |\n|---|---|\n| `tianyu-default` | `sky` |\n| `tianyu-green` | `meadow` |\n| `tianyu-mono` | `simple` |\n| `tianyu-purple` | `dusk` |\n| `tianyu-red` | `vivid` |\n\n## CSS variables reference\n\n### Color tokens (defined per theme)\n\n| Variable | Role |\n|---|---|\n| `--ts_ui_bgc` | Page background |\n| `--ts_ui_content_bgc` | Content area background |\n| `--ts_ui_blk_1` … `--ts_ui_blk_8` | Main color scale (dark → light in light mode) |\n| `--ts_ui_blk_11` … `--ts_ui_blk_18` | Fine-grained mid-range scale |\n| `--ts_ctrl_primary` / `--ts_ctrl_secondary` | Control accent colors |\n| `--ts_ctrl_surface` / `--ts_ctrl_border` | Control surface and border |\n| `--ts_ctrl_text` / `--ts_ctrl_text_secondary` | Control text |\n| `--ts_ui_fatal_*` / `--ts_ui_error_*` / `--ts_ui_warning_*` / `--ts_ui_success_*` | Semantic status colors (bg / border / front) |\n\n### Style tokens (defined per control style)\n\n| Variable | Role |\n|---|---|\n| `--ts_ctrl_radius` / `_sm` / `_lg` | Border radius scale |\n| `--ts_ctrl_shadow` / `_hover` / `_focus` | Box shadow |\n| `--ts_ctrl_glow` / `_focus` | Glow effect (scifi only) |\n| `--ts_ctrl_border_width` / `_style` | Border dimensions |\n| `--ts_ctrl_transition` / `_fast` | Transition timing |\n| `--ts_ctrl_font_size` / `_sm` / `_lg` | Font size scale |\n| `--ts_ctrl_padding_x/y` / `_sm` / `_lg` | Padding scale |\n\n### z-index scale (core_ui.css)\n\n| Variable | Value |\n|---|---|\n| `--ts_ui_background_zindex` | `0` |\n| `--ts_ui_major_base_zindex` | `100` |\n| `--ts_ui_major_hover_zindex` | `8000` |\n| `--ts_ui_msg_zindex` | `9000` |\n| `--ts_ui_dialog_zindex` | `99999` |\n\n## License\n\n[Apache-2.0](LICENSE)\n","readmeFilename":"README.md","_rev":"1-cbf2cee03fb95d7611a3641463056e31"}