@ithinkdt/ui 4.0.0-110 → 4.0.0-120

package/dist/{components-BdbuJNhZ.js → components-DFllLyV9.js}

@@ -653,11 +653,11 @@ const DataForm = /* @__PURE__ */ defineComponent({
 					}),
 					b.showResetBtn === !1 ? void 0 : createVNode(NButton, {
 						attrType: "reset",
-						disabled: b.disabled || x,
+						disabled: b.disabled || x || G,
 						type: b.showCancelBtn ? "primary" : "default",
 						secondary: b.showCancelBtn
 					}, { default: () => [b.resetText || C("common.page.form.resetText")] }),
-					b.showCancelBtn === !1 ? void 0 : createVNode(NButton, {
+					b.showCancelBtn === !1 && !G ? void 0 : createVNode(NButton, {
 						attrType: "button",
 						disabled: b.disabled || x,
 						onClick: D

package/dist/components.js

@@ -1,5 +1,5 @@
 import "./use-i18n-Dx7V4KrY.js";
 import "./directives-DUuJW647.js";
 import "./use-style-DcT-1dj4.js";
-import { a as NRadios, c as DataSelection, d as useLocaleEdit, f as DataFilter, g as NCheckboxes, h as DataActions, i as renderUsers, l as DataPagination, m as DataCustom, n as DtUserDept, o as DataTable, p as DataForm, r as DtUserRender, s as useDataTableDrag, t as DtDeptRender, u as DataLocaleInput } from "./components-BdbuJNhZ.js";
+import { a as NRadios, c as DataSelection, d as useLocaleEdit, f as DataFilter, g as NCheckboxes, h as DataActions, i as renderUsers, l as DataPagination, m as DataCustom, n as DtUserDept, o as DataTable, p as DataForm, r as DtUserRender, s as useDataTableDrag, t as DtDeptRender, u as DataLocaleInput } from "./components-DFllLyV9.js";
 export { DataActions, DataCustom, DataFilter, DataForm, DataLocaleInput, DataPagination, DataSelection, DataTable, DtDeptRender, DtUserDept, DtUserRender, NCheckboxes, NRadios, renderUsers, useDataTableDrag, useLocaleEdit };

package/dist/page.js

@@ -1,7 +1,7 @@
 import { n as useI18n } from "./use-i18n-Dx7V4KrY.js";
 import "./directives-DUuJW647.js";
 import "./use-style-DcT-1dj4.js";
-import { a as NRadios, g as NCheckboxes, n as DtUserDept, p as DataForm, r as DtUserRender, t as DtDeptRender } from "./components-BdbuJNhZ.js";
+import { a as NRadios, g as NCheckboxes, n as DtUserDept, p as DataForm, r as DtUserRender, t as DtDeptRender } from "./components-DFllLyV9.js";
 import { computed, createVNode, defineComponent, h, isVNode, mergeProps, ref, shallowRef, unref } from "vue";
 import { until } from "@vueuse/core";
 import { NButton, NCheckbox, NColorPicker, NDatePicker, NDrawer, NDrawerContent, NFlex, NInput, NInputNumber, NModal, NScrollbar, NSelect, NText, NUpload, useMessage } from "ithinkdt-ui";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ithinkdt/ui",
-  "version": "4.0.0-110",
+  "version": "4.0.0-120",
   "type": "module",
   "license": "MIT",
   "description": "iThinkDT UI",
@@ -64,7 +64,7 @@
     "sortablejs": "^1.15.6",
     "@types/sortablejs": "^1.15.9",
     "nanoid": "^5.1.6",
-    "@ithinkdt/common": "^4.0.0-50"
+    "@ithinkdt/common": "^4.0.0-101"
   },
   "peerDependencies": {
     "@ithinkdt/page": ">=4.0",
@@ -85,11 +85,11 @@
     "@vitejs/plugin-vue-jsx": "^5.1.1",
     "ithinkdt-ui": "^1.8.0",
     "typescript": "~5.9.3",
-    "unocss": ">=66.5.4",
-    "vite": "npm:rolldown-vite@^7.1.20",
-    "vue": "^3.5.22",
+    "unocss": ">=66.5.5",
+    "vite": "npm:rolldown-vite@^7.2.2",
+    "vue": "^3.5.24",
     "vue-router": "^4.6.3",
-    "@ithinkdt/page": "^4.0.0-50"
+    "@ithinkdt/page": "^4.0.0-100"
   },
   "scripts": {
     "dev": "vite build --watch",

package/unocss-preset.d.ts

@@ -1,5 +1,5 @@
-import { PresetFactory, PresetUnoTheme } from 'unocss'
+import { Preset, PresetWind4Theme } from 'unocss'
 
-declare const ithinkdt: PresetFactory<PresetUnoTheme, {}>
+declare const ithinkdt: (options?: { namespace?: string | undefined }) => Preset<PresetWind4Theme>[]
 
 export default ithinkdt

package/unocss-preset.js

@@ -1,31 +1,96 @@
-const ithinkdt = () => {
-    return {
+import { presetWind4, transformerDirectives, transformerVariantGroup } from 'unocss'
+
+const ithinkdt = (options = {}) => {
+    const { namespace: ns } = options
+
+    let wind4, postprocess
+    if (ns) {
+        wind4 = () => {
+            const plugin = presetWind4({
+                variablePrefix: `${ns}-`,
+                preflights: {
+                    reset: false,
+                    property: {
+                        selector: `.${ns} :where(*, ::before, ::after)`,
+                    },
+                },
+            })
+
+            return {
+                ...plugin,
+                preflights: plugin.preflights?.map((preflight) => {
+                    if (preflight.layer === 'theme') {
+                        return {
+                            ...preflight,
+                            async getCSS(ctx) {
+                                let result = await preflight.getCSS?.(ctx)
+                                if (result) {
+                                    result = result.replace(':root, :host', `.${ns}`)
+                                }
+                                return result
+                            },
+                        }
+                    } else if (preflight.layer === 'properties') {
+                        return {
+                            ...preflight,
+                            async getCSS(ctx) {
+                                let result = await preflight.getCSS?.(ctx)
+                                if (result) {
+                                    result = result
+                                        .replaceAll('--un-', `--${ns}-`)
+                                }
+                                return result
+                            },
+                        }
+                    }
+                    return preflight
+                }),
+            }
+        }
+        postprocess = [
+            (p) => {
+                if (p.selector.includes('--un-')) {
+                    p.selector = p.selector.replaceAll('--un-', `--${ns}-`)
+                } else if (p.selector.endsWith(String.raw`.\-`)) {
+                    if (p.selector.startsWith('.dark ')) {
+                        p.selector = `.dark & ${p.selector.slice(6)}`
+                    }
+                } else {
+                    p.selector = p.selector.startsWith('.dark ') ? `.dark .${ns} ${p.selector.slice(6)}` : `.${ns} ${p.selector}`
+                }
+            },
+        ]
+    } else { wind4 = presetWind4 }
+
+    const alphas = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
+    const ithinkdt = {
         name: 'preset-ithinkdt',
+        options,
         theme: {
             colors: {
                 ...Object.fromEntries(
                     ['primary', 'success', 'warning', 'danger'].map(name => [
                         name,
                         {
-                            DEFAULT: `rgb(var(--color-${name}-rgb) / <alpha-value>)`,
+                            DEFAULT: `var(--color-${name})`,
+                            ...Object.fromEntries(alphas.map(alpha => [`${alpha}`, `color-mix(in oklab, var(--color-${name}) ${alpha / 10}%, #fff ${(1000 - alpha) / 10}%)`])),
                             ...Object.fromEntries(
-                                ['hover', 'active'].map(level => [
-                                    level,
-                                    `rgb(var(--color-${name}-${level}-rgb) / <alpha-value>)`,
+                                ['hover', 'active'].flatMap(level => [
+                                    [level, `var(--color-${name}-${level})`],
+                                    ...alphas.map(alpha => [`${level}-${alpha}`, `color-mix(in oklab, var(--color-${name}-${level}) ${alpha / 10}%, #fff ${(1000 - alpha) / 10}%)`]),
                                 ]),
                             ),
                         },
                     ]),
                 ),
                 text: {
-                    DEFAULT: `rgb(var(--color-text-rgb))`,
-                },
-                base: {
-                    DEFAULT: `rgb(var(--color-base-rgb))`,
+                    DEFAULT: `var(--color-text)`,
+                    ...Object.fromEntries(alphas.map(alpha => [`${alpha}`, `color-mix(in oklab, var(--color-text) ${alpha / 10}%, #fff ${(1000 - alpha) / 10}%)`])),
                 },
+                base: { DEFAULT: `var(--color-base)` },
             },
-            borderRadius: Object.fromEntries(
-                ['tiny', 'small', 'medium', 'large'].map(size => [size, `var(--rounded-${size})`]),
+            radius: Object.fromEntries(
+                ['xs', 'sm', 'md', 'lg'].map(size => [size, `var(--rounded-${size})`]),
             ),
         },
         variants: [
@@ -70,25 +135,29 @@ const ithinkdt = () => {
             [
                 /^card-(.*)$/,
                 ([_, size]) => {
-                    const i = ['none', 'small', 'medium', 'large'].indexOf(size)
+                    const i = ['none', 'sm', 'md', 'lg'].indexOf(size)
                     if (i === -1) return
                     const p = [0, 2, 4, 5][i]
                     return `rounded-${size} px-${p + 1} py-${p} bg-white dark:bg-dark ease-in-out transition-shadow 
                        hover:shadow-[0_1px_2px_0_rgba(0_0_0_/_0.03),0_1px_6px_-1px_rgba(0_0_0_/_0.02),0_2px_4px_0_rgba(0_0_0_/_0.02)]`
                 },
-                { autocomplete: ['card-none', 'card-small', 'card-medium', 'card-large'] },
+                { autocomplete: ['card-none', 'card-sm', 'card-md', 'card-lg'] },
             ],
             {
                 'ell': 'truncate',
                 'ell-2': 'line-clamp-2',
                 'ell-3': 'line-clamp-3',
-                'flex-x-center': 'flex items-center',
-                'flex-y-center': 'flex justify-center',
                 'flex-center': 'flex justify-center items-center',
-                'card': `card-medium`,
+                'card': `card-md`,
             },
         ],
+        transformers: [transformerDirectives(), transformerVariantGroup()],
+        postprocess: postprocess,
     }
+    return [
+        wind4(),
+        ithinkdt,
+    ]
 }
 
 export default ithinkdt