feat: add theme

components/theme/index.ts

@@ -0,0 +1,30 @@
+import { createTheme, useCacheToken } from '@antd-tiny-vue/cssinjs'
+import { computed } from 'vue'
+
+export interface ThemeToken {
+  primaryColor: string
+}
+
+export const defaultTheme: ThemeToken = {
+  primaryColor: '#1890ff'
+}
+
+function derivative(theme: ThemeToken) {
+  return {
+    ...theme
+  }
+}
+
+const theme = createTheme(derivative)
+
+export const useToken = () => {
+  const mergedTheme = computed(() => theme)
+  const cacheToken = useCacheToken(
+    mergedTheme,
+    computed(() => [defaultTheme]),
+    computed(() => ({
+      salt: 'true'
+    }))
+  )
+  return [mergedTheme, computed(() => cacheToken.value[0]), computed(() => cacheToken.value[1])]
+}

package.json

@@ -14,6 +14,7 @@
     "preview": "vitepress preview site"
   },
   "dependencies": {
+    "@antd-tiny-vue/cssinjs": "^0.0.4",
     "vue": "^3.2.0"
   },
   "devDependencies": {

pnpm-lock.yaml

@@ -1,6 +1,7 @@
 lockfileVersion: 5.4
 
 specifiers:
+  '@antd-tiny-vue/cssinjs': ^0.0.4
   '@commitlint/cli': ^17.4.3
   '@commitlint/config-conventional': ^17.4.3
   '@mistjs/eslint-config-vue-jsx': ^0.0.3
@@ -20,6 +21,7 @@ specifiers:
   vue: ^3.2.0
 
 dependencies:
+  '@antd-tiny-vue/cssinjs': 0.0.4_vue@3.2.47
   vue: 3.2.47
 
 devDependencies:
@@ -163,6 +165,18 @@ packages:
       '@jridgewell/trace-mapping': 0.3.9
     dev: true
 
+  /@antd-tiny-vue/cssinjs/0.0.4_vue@3.2.47:
+    resolution: {integrity: sha512-o6eU9IN+nfzaeCLHaQ94FqgvZV7eHeyY/Qw0p7ETMOyEQup13LBb4feOQKHGtBKLRkeoTugpY6EhAuMhn10SYw==}
+    peerDependencies:
+      vue: ^3.2.0
+    dependencies:
+      '@emotion/hash': 0.9.0
+      '@emotion/unitless': 0.8.0
+      csstype: 3.1.1
+      stylis: 4.1.3
+      vue: 3.2.47
+    dev: false
+
   /@babel/code-frame/7.18.6:
     resolution: {integrity: sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==}
     engines: {node: '>=6.9.0'}
@@ -666,6 +680,14 @@ packages:
       - '@algolia/client-search'
     dev: true
 
+  /@emotion/hash/0.9.0:
+    resolution: {integrity: sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==}
+    dev: false
+
+  /@emotion/unitless/0.8.0:
+    resolution: {integrity: sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw==}
+    dev: false
+
   /@esbuild/android-arm/0.16.17:
     resolution: {integrity: sha512-N9x1CMXVhtWEAMS7pNNONyA14f71VPQN9Cnavj1XQh6T7bskqiLLrSca4O0Vr8Wdcga943eThxnVp3JLnBMYtw==}
     engines: {node: '>=12'}
@@ -1949,6 +1971,10 @@ packages:
   /csstype/2.6.21:
     resolution: {integrity: sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w==}
 
+  /csstype/3.1.1:
+    resolution: {integrity: sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==}
+    dev: false
+
   /dargs/7.0.0:
     resolution: {integrity: sha512-2iy1EkLdlBzQGvbweYRFxmFath8+K7+AKB0TlhHWkNuH+TmovaMH/Wp7V7R4u7f4SnX3OgLsU9t1NI9ioDnUpg==}
     engines: {node: '>=8'}
@@ -4359,6 +4385,10 @@ packages:
       acorn: 8.8.2
     dev: true
 
+  /stylis/4.1.3:
+    resolution: {integrity: sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA==}
+    dev: false
+
   /supports-color/5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
     engines: {node: '>=4'}