@veltra/desktop 1.0.0

package/dist/components/textarea/style2.css

@@ -0,0 +1,106 @@
+@charset "UTF-8";
+/** flex布局 */
+/**
+* 设置css变量
+* 参数1:变量前缀
+* 参数2: 一个由值组成的列表或者由key, value组成的map
+* css-var(height, (
+*   large: 40px
+*   default: 32px
+*   small: 24px
+* ))
+* 生成的css变量:
+* --u-height-large: 40px;
+* --u-height-default: 32px;
+* --u-height-small: 24px;
+*/
+/** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
+.u-textarea {
+  position: relative;
+  width: 100%;
+  box-shadow: inset 0 0 1px 1px var(--u-border-color);
+  transition: box-shadow 0.25s ease;
+  overflow: hidden;
+  vertical-align: middle;
+}
+.u-textarea:hover {
+  box-shadow: inset 0 0 1px 1px var(--u-color-primary);
+}
+.u-textarea--small {
+  border-radius: var(--u-radius-small);
+}
+.u-textarea--small .u-textarea__native {
+  padding: calc(var(--u-gap-small) / 2);
+  min-height: var(--u-form-component-height-small);
+  padding-right: 20px;
+}
+.u-textarea--small .u-textarea__clear {
+  font-size: var(--u-font-size-main-small);
+}
+.u-textarea--default {
+  border-radius: var(--u-radius-default);
+}
+.u-textarea--default .u-textarea__native {
+  padding: calc(var(--u-gap-default) / 2);
+  min-height: var(--u-form-component-height-default);
+  padding-right: 20px;
+}
+.u-textarea--default .u-textarea__clear {
+  font-size: var(--u-font-size-main-default);
+}
+.u-textarea--large {
+  border-radius: var(--u-radius-large);
+}
+.u-textarea--large .u-textarea__native {
+  padding: calc(var(--u-gap-large) / 2);
+  min-height: var(--u-form-component-height-large);
+  padding-right: 20px;
+}
+.u-textarea--large .u-textarea__clear {
+  font-size: var(--u-font-size-main-large);
+}
+.u-textarea__native {
+  color: var(--u-text-color-main);
+  outline: none;
+  border: none;
+  background-color: transparent;
+  font-family: var(--u-font-family);
+  font-size: 1em;
+  width: 100%;
+  display: block;
+  padding: 0;
+  resize: vertical;
+  overflow: auto;
+  line-height: 1.3;
+}
+.u-textarea__native::placeholder {
+  color: var(--u-text-color-placeholder);
+}
+.u-textarea.is-focus {
+  box-shadow: inset 0 0 1px 1px var(--u-color-primary);
+}
+.u-textarea.is-disabled {
+  background-color: var(--u-color-disabled);
+  box-shadow: inset 0 0 1px 1px var(--u-border-color);
+}
+.u-textarea.is-disabled .u-textarea__native {
+  cursor: not-allowed;
+  resize: none;
+}
+.u-textarea--count {
+  display: block;
+  position: absolute;
+  bottom: 8px;
+  right: 4px;
+  font-size: 12px;
+  background: var(--u-bg-color-middle);
+}
+.u-textarea--clear {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  right: 0;
+  cursor: pointer;
+  color: var(--u-text-color-main);
+  min-width: 20px;
+}

package/dist/components/textarea/textarea.js

@@ -0,0 +1,164 @@
+import _sfc_main$1 from "../icon/icon.js";
+import { calcTextareaHeight } from "./utils.js";
+import { Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeModels, normalizeClass, openBlock, ref, shallowRef, toDisplayString, unref, useModel, vModelText, watch, withCtx, withDirectives, withModifiers } from "vue";
+import { FORM_EMPTY_CONTENT, bem } from "@veltra/utils";
+import { useFocus, useFormComponent, useFormFallbackProps } from "@veltra/compositions";
+import { Close } from "@veltra/icons/normal";
+//#region src/components/textarea/textarea.vue
+const _hoisted_1 = [
+	"placeholder",
+	"maxlength",
+	"rows",
+	"cols",
+	"disabled",
+	"readonly"
+];
+const _hoisted_2 = {
+	key: 1,
+	style: { "white-space": "pre-wrap" }
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "Textarea",
+	__name: "textarea",
+	props: /* @__PURE__ */ mergeModels({
+		modelValue: {},
+		height: {},
+		placeholder: { default: "请输入" },
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		readonly: {
+			type: Boolean,
+			default: void 0
+		},
+		resize: {
+			type: Boolean,
+			default: true
+		},
+		rows: {},
+		cols: {},
+		maxlength: {},
+		showCount: { type: Boolean },
+		clearable: {
+			type: Boolean,
+			default: true
+		},
+		nativeReadonly: { type: Boolean },
+		autosize: {
+			type: Boolean,
+			default: false
+		},
+		tips: {},
+		span: {},
+		label: {},
+		field: {},
+		size: {}
+	}, {
+		"modelValue": {},
+		"modelModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels([
+		"update:modelValue",
+		"change",
+		"focus",
+		"blur",
+		"clear"
+	], ["update:modelValue"]),
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const cls = bem("textarea");
+		const { formProps } = useFormComponent();
+		const { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {
+			size: "default",
+			disabled: false,
+			readonly: false
+		});
+		const emit = __emit;
+		const textareaRef = ref(null);
+		const model = useModel(__props, "modelValue");
+		const hovered = shallowRef(false);
+		const { focus, handleBlur, handleFocus } = useFocus((focused) => {
+			focused ? emit("focus") : emit("blur");
+		});
+		const textareaClass = computed(() => {
+			return [
+				cls.b,
+				cls.m(size.value),
+				bem.is("resize-none", !props.resize),
+				bem.is("disabled", disabled.value),
+				bem.is("readonly", readonly.value),
+				bem.is("focus", focus.value),
+				cls.m("more")
+			];
+		});
+		const handleInput = (e) => {
+			const value = e.target.value;
+			if (value.length > props.maxlength) emit("update:modelValue", value.slice(0, props.maxlength));
+			else emit("update:modelValue", value);
+		};
+		const initNum = computed(() => {
+			if (!props.maxlength) return 0;
+			return props.maxlength - (model.value?.length ?? 0);
+		});
+		const handleClear = () => {
+			model.value = "";
+			emit("clear");
+		};
+		const handleChange = (e) => {
+			emit("change", e.target.value);
+		};
+		watch([model, textareaRef], ([model, textareaRef]) => {
+			if (!textareaRef) return;
+			if (!props.autosize) return;
+			calcTextareaHeight(textareaRef);
+		}, { immediate: true });
+		return (_ctx, _cache) => {
+			return !unref(readonly) ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				class: normalizeClass(textareaClass.value),
+				onMouseenter: _cache[3] || (_cache[3] = ($event) => hovered.value = true),
+				onMouseleave: _cache[4] || (_cache[4] = ($event) => hovered.value = false)
+			}, [
+				withDirectives(createElementVNode("textarea", {
+					class: normalizeClass(unref(cls).e("native")),
+					placeholder: __props.placeholder,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+					maxlength: __props.maxlength,
+					rows: __props.rows,
+					cols: __props.cols,
+					onInput: handleInput,
+					onFocus: _cache[1] || (_cache[1] = (...args) => unref(handleFocus) && unref(handleFocus)(...args)),
+					onBlur: _cache[2] || (_cache[2] = (...args) => unref(handleBlur) && unref(handleBlur)(...args)),
+					onChange: handleChange,
+					disabled: unref(disabled),
+					readonly: __props.nativeReadonly,
+					ref_key: "textareaRef",
+					ref: textareaRef
+				}, null, 42, _hoisted_1), [[vModelText, model.value]]),
+				props.maxlength && props.showCount ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					class: normalizeClass(unref(cls).m("count"))
+				}, toDisplayString(initNum.value) + "/" + toDisplayString(props.maxlength), 3)) : createCommentVNode("v-if", true),
+				createVNode(Transition, {
+					name: "zoom-in",
+					mode: "out-in"
+				}, {
+					default: withCtx(() => [props.clearable && model.value && hovered.value && !unref(disabled) && !unref(readonly) ? (openBlock(), createBlock(unref(_sfc_main$1), {
+						key: 0,
+						class: normalizeClass(unref(cls).m("clear")),
+						onClick: withModifiers(handleClear, ["stop"])
+					}, {
+						default: withCtx(() => [createVNode(unref(Close))]),
+						_: 1
+					}, 8, ["class"])) : createCommentVNode("v-if", true)]),
+					_: 1
+				})
+			], 34)) : (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(model.value || unref(FORM_EMPTY_CONTENT)), 1));
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=textarea.js.map

package/dist/components/textarea/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.js","names":[],"sources":["../../../src/components/textarea/textarea.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"!readonly\"\n    :class=\"textareaClass\"\n    @mouseenter=\"hovered = true\"\n    @mouseleave=\"hovered = false\"\n  >\n    <textarea\n      :class=\"cls.e('native')\"\n      :placeholder=\"placeholder\"\n      v-model=\"model\"\n      :maxlength=\"maxlength\"\n      :rows=\"rows\"\n      :cols=\"cols\"\n      @input=\"handleInput\"\n      @focus=\"handleFocus\"\n      @blur=\"handleBlur\"\n      @change=\"handleChange\"\n      :disabled=\"disabled\"\n      :readonly=\"nativeReadonly\"\n      ref=\"textareaRef\"\n    />\n    <span v-if=\"props.maxlength && props.showCount\" :class=\"cls.m('count')\">\n      {{ initNum }}/{{ props.maxlength }}\n    </span>\n    <Transition name=\"zoom-in\" mode=\"out-in\">\n      <u-icon\n        v-if=\"props.clearable && model! && hovered && !disabled && !readonly\"\n        :class=\"cls.m('clear')\"\n        @click.stop=\"handleClear\"\n      >\n        <Close />\n      </u-icon>\n    </Transition>\n  </div>\n\n  <span v-else style=\"white-space: pre-wrap\">\n    {{ model || FORM_EMPTY_CONTENT }}\n  </span>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFocus, useFormComponent, useFormFallbackProps } from '@veltra/compositions'\nimport { Close } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport { FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, ref, shallowRef, watch } from 'vue'\n\nimport type { TextareaProps, TextareaEmits, ComponentSize } from '../../types'\nimport { UIcon } from '../icon'\nimport { calcTextareaHeight } from './utils'\n\ndefineOptions({\n  name: 'Textarea'\n})\n\nconst props = withDefaults(defineProps<TextareaProps>(), {\n  placeholder: '请输入',\n  resize: true,\n  clearable: true,\n  disabled: undefined,\n  readonly: undefined,\n  autosize: false\n})\n\nconst cls = bem('textarea')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default' as ComponentSize,\n  disabled: false,\n  readonly: false\n})\n\nconst emit = defineEmits<TextareaEmits>()\n\nconst textareaRef = ref<HTMLTextAreaElement | null>(null)\n\nconst model = defineModel<string>()\n\nconst hovered = shallowRef(false)\n\nconst { focus, handleBlur, handleFocus } = useFocus((focused) => {\n  focused ? emit('focus') : emit('blur')\n})\n\nconst textareaClass = computed(() => {\n  return [\n    cls.b,\n    cls.m(size.value),\n    bem.is('resize-none', !props.resize),\n    bem.is('disabled', disabled.value),\n    bem.is('readonly', readonly.value),\n    bem.is('focus', focus.value),\n    cls.m('more')\n  ]\n})\n\nconst handleInput = (e: Event) => {\n  const value = (e.target as HTMLTextAreaElement).value\n  if (value.length > props.maxlength!) {\n    // 如果输入的字符数超过了最大长度，截取字符串到最大长度\n    const truncatedValue = value.slice(0, props.maxlength)\n    emit('update:modelValue', truncatedValue)\n  } else {\n    // 如果没有超过最大长度，则正常更新模型值\n    emit('update:modelValue', value)\n  }\n}\n\nconst initNum = computed(() => {\n  if (!props.maxlength) return 0\n  return props.maxlength - (model.value?.length ?? 0)\n})\n\nconst handleClear = () => {\n  model.value = ''\n  emit('clear')\n}\n\nconst handleChange = (e: Event) => {\n  emit('change', (e.target as HTMLTextAreaElement).value)\n}\n\nwatch(\n  [model, textareaRef],\n  ([model, textareaRef]) => {\n    if (!textareaRef) return\n    if (!props.autosize) return\n    calcTextareaHeight(textareaRef)\n  },\n  { immediate: true }\n)\n</script>\n"],"mappings":"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"}

package/dist/components/textarea/textarea.vue.d.ts

@@ -0,0 +1,35 @@
+import { TextareaProps } from "../../types/textarea.js";
+import * as _$vue from "vue";
+
+//#region src/components/textarea/textarea.vue.d.ts
+type __VLS_Props = TextareaProps;
+type __VLS_ModelProps = {
+  modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  "update:modelValue": (value: string | undefined) => any;
+} & {
+  clear: () => any;
+  "update:modelValue": (value: string) => any;
+  change: (value: string) => any;
+  focus: () => any;
+  blur: () => any;
+}, string, _$vue.PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+  onClear?: (() => any) | undefined;
+  "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+  onChange?: ((value: string) => any) | undefined;
+  onFocus?: (() => any) | undefined;
+  onBlur?: (() => any) | undefined;
+}>, {
+  readonly: boolean;
+  disabled: boolean;
+  placeholder: string;
+  clearable: boolean;
+  resize: boolean;
+  autosize: boolean;
+}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default };
+//# sourceMappingURL=textarea.vue.d.ts.map

package/dist/components/textarea/utils.js

@@ -0,0 +1,17 @@
+import { nextTick } from "vue";
+import { setStyles } from "@veltra/utils";
+//#region src/components/textarea/utils.ts
+function calcTextareaHeight(el) {
+	setStyles(el, { height: "auto" });
+	nextTick(() => {
+		const { scrollHeight } = el;
+		setStyles(el, {
+			overflow: "hidden",
+			height: scrollHeight + "px"
+		});
+	});
+}
+//#endregion
+export { calcTextareaHeight };
+
+//# sourceMappingURL=utils.js.map

package/dist/components/textarea/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/textarea/utils.ts"],"sourcesContent":["import { setStyles } from '@veltra/utils'\nimport { nextTick } from 'vue'\n\nexport function calcTextareaHeight(el: HTMLTextAreaElement): void {\n  setStyles(el, { height: 'auto' })\n  nextTick(() => {\n    const { scrollHeight } = el\n\n    setStyles(el, { overflow: 'hidden', height: scrollHeight + 'px' })\n  })\n}\n"],"mappings":";;;AAGA,SAAgB,mBAAmB,IAA+B;AAChE,WAAU,IAAI,EAAE,QAAQ,QAAQ,CAAC;AACjC,gBAAe;EACb,MAAM,EAAE,iBAAiB;AAEzB,YAAU,IAAI;GAAE,UAAU;GAAU,QAAQ,eAAe;GAAM,CAAC;GAClE"}

package/dist/components/theme/index.d.ts

@@ -0,0 +1 @@
+import { _default } from "./theme.vue.js";

package/dist/components/theme/schema.js

@@ -0,0 +1,194 @@
+//#region src/components/theme/schema.ts
+const borderStyleOptions = [
+	{
+		label: "实线",
+		value: "solid"
+	},
+	{
+		label: "虚线",
+		value: "dashed"
+	},
+	{
+		label: "点线",
+		value: "dotted"
+	},
+	{
+		label: "双线",
+		value: "double"
+	}
+];
+function paletteField(key, label, path, hint) {
+	return {
+		key,
+		label,
+		path,
+		kind: "palette",
+		hint
+	};
+}
+function inputField(key, label, path, placeholder, hint) {
+	return {
+		key,
+		label,
+		path,
+		kind: "input",
+		placeholder,
+		hint
+	};
+}
+function numberField(key, label, path, options) {
+	return {
+		key,
+		label,
+		path,
+		kind: "number",
+		min: options.min,
+		max: options.max,
+		step: options.step,
+		suffix: options.suffix,
+		hint: options.hint
+	};
+}
+function pxField(key, label, path, min, max, hint) {
+	return numberField(key, label, path, {
+		min,
+		max,
+		step: 1,
+		suffix: "px",
+		hint
+	});
+}
+function selectField(key, label, path, options, hint) {
+	return {
+		key,
+		label,
+		path,
+		kind: "select",
+		options,
+		hint
+	};
+}
+const THEME_SECTIONS = [
+	{
+		key: "color",
+		title: "综合色板",
+		description: "品牌色与语义状态色，决定按钮、标签与反馈态的主视觉。",
+		fields: [
+			paletteField("color.primary", "主要颜色", ["color", "primary"]),
+			paletteField("color.success", "成功颜色", ["color", "success"]),
+			paletteField("color.warning", "警告颜色", ["color", "warning"]),
+			paletteField("color.danger", "危险颜色", ["color", "danger"]),
+			paletteField("color.info", "信息颜色", ["color", "info"]),
+			paletteField("color.disabled", "禁用颜色", ["color", "disabled"]),
+			paletteField("color.default", "默认颜色", ["color", "default"])
+		]
+	},
+	{
+		key: "surface",
+		title: "表面层次",
+		description: "控制背景、文字、边框与阴影，决定整个界面的空气感与对比度。",
+		fields: [
+			paletteField("bg.color.top", "顶部背景", [
+				"bg",
+				"color",
+				"top"
+			]),
+			paletteField("bg.color.middle", "中部背景", [
+				"bg",
+				"color",
+				"middle"
+			]),
+			paletteField("bg.color.bottom", "底部背景", [
+				"bg",
+				"color",
+				"bottom"
+			]),
+			paletteField("bg.color.hover", "悬停背景", [
+				"bg",
+				"color",
+				"hover"
+			]),
+			paletteField("bg.color.black", "黑色背景", [
+				"bg",
+				"color",
+				"black"
+			]),
+			inputField("bg.filter.blur", "背景模糊", [
+				"bg",
+				"filter",
+				"blur"
+			], "例如：blur(16px)"),
+			inputField("bg.filter.saturate", "背景饱和度", [
+				"bg",
+				"filter",
+				"saturate"
+			], "例如：saturate(180%)"),
+			paletteField("text-color.title", "标题文字", ["text-color", "title"]),
+			paletteField("text-color.main", "主要文字", ["text-color", "main"]),
+			paletteField("text-color.placeholder", "占位文字", ["text-color", "placeholder"]),
+			paletteField("text-color.second", "次要文字", ["text-color", "second"]),
+			paletteField("text-color.assist", "辅助文字", ["text-color", "assist"]),
+			paletteField("text-color.disabled", "禁用文字", ["text-color", "disabled"]),
+			paletteField("text-color.white", "白色文字", ["text-color", "white"]),
+			paletteField("border.color", "边框颜色", ["border", "color"]),
+			pxField("border.width", "边框宽度", ["border", "width"], 0, 10),
+			selectField("border.style", "边框样式", ["border", "style"], borderStyleOptions),
+			paletteField("shadow.color", "阴影颜色", ["shadow", "color"]),
+			pxField("shadow.x", "水平偏移", ["shadow", "x"], -24, 24),
+			pxField("shadow.y", "垂直偏移", ["shadow", "y"], -24, 24),
+			pxField("shadow.blur", "模糊半径", ["shadow", "blur"], 0, 64),
+			pxField("shadow.spread", "扩散半径", ["shadow", "spread"], -12, 24)
+		]
+	},
+	{
+		key: "control",
+		title: "表单尺度",
+		description: "统一基础控件的边角、尺寸和节奏，让组件家族看起来更一致。",
+		fields: [
+			pxField("radius.small", "小圆角", ["radius", "small"], 0, 24),
+			pxField("radius.default", "默认圆角", ["radius", "default"], 0, 24),
+			pxField("radius.large", "大圆角", ["radius", "large"], 0, 32),
+			pxField("form-component-height.small", "小表单高度", ["form-component-height", "small"], 16, 40),
+			pxField("form-component-height.default", "默认表单高度", ["form-component-height", "default"], 20, 52),
+			pxField("form-component-height.large", "大表单高度", ["form-component-height", "large"], 24, 64),
+			pxField("gap.small", "小间距", ["gap", "small"], 0, 20),
+			pxField("gap.default", "默认间距", ["gap", "default"], 0, 24),
+			pxField("gap.large", "大间距", ["gap", "large"], 0, 32)
+		]
+	},
+	{
+		key: "typography",
+		title: "字体系统",
+		description: "管理字体族与标题、正文、辅助文本的层级尺寸。",
+		fields: [
+			inputField("font-family", "字体族", ["font-family"], "例如：\"IBM Plex Sans\", \"PingFang SC\", sans-serif"),
+			pxField("font-size-title.small", "小标题字号", ["font-size-title", "small"], 8, 28),
+			pxField("font-size-title.default", "默认标题字号", ["font-size-title", "default"], 8, 32),
+			pxField("font-size-title.large", "大标题字号", ["font-size-title", "large"], 10, 40),
+			pxField("font-size-main.small", "小正文字号", ["font-size-main", "small"], 8, 20),
+			pxField("font-size-main.default", "默认正文字号", ["font-size-main", "default"], 8, 24),
+			pxField("font-size-main.large", "大正文字号", ["font-size-main", "large"], 10, 28),
+			pxField("font-size-assist.small", "小辅助字号", ["font-size-assist", "small"], 8, 18),
+			pxField("font-size-assist.default", "默认辅助字号", ["font-size-assist", "default"], 8, 20),
+			pxField("font-size-assist.large", "大辅助字号", ["font-size-assist", "large"], 8, 24)
+		]
+	},
+	{
+		key: "responsive",
+		title: "响应断点",
+		description: "维护布局与响应式行为使用的断点变量。",
+		fields: [
+			pxField("breakpoint.xs", "超小屏幕", ["breakpoint", "xs"], 320, 900),
+			pxField("breakpoint.sm", "小屏幕", ["breakpoint", "sm"], 480, 1200),
+			pxField("breakpoint.md", "中屏幕", ["breakpoint", "md"], 768, 1600),
+			pxField("breakpoint.lg", "大屏幕", ["breakpoint", "lg"], 1024, 2560)
+		]
+	}
+];
+THEME_SECTIONS.reduce((count, section) => {
+	return count + section.fields.length;
+}, 0);
+//#endregion
+export { THEME_SECTIONS };
+
+//# sourceMappingURL=schema.js.map

package/dist/components/theme/schema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.js","names":[],"sources":["../../../src/components/theme/schema.ts"],"sourcesContent":["export type ThemeFieldKind = 'palette' | 'input' | 'number' | 'select'\n\nexport interface ThemeFieldOption {\n  label: string\n  value: string\n}\n\nexport interface ThemeField {\n  key: string\n  label: string\n  path: string[]\n  kind: ThemeFieldKind\n  hint?: string\n  placeholder?: string\n  min?: number\n  max?: number\n  step?: number\n  suffix?: string\n  options?: ThemeFieldOption[]\n}\n\nexport interface ThemeSection {\n  key: string\n  title: string\n  description: string\n  fields: ThemeField[]\n}\n\nconst borderStyleOptions: ThemeFieldOption[] = [\n  { label: '实线', value: 'solid' },\n  { label: '虚线', value: 'dashed' },\n  { label: '点线', value: 'dotted' },\n  { label: '双线', value: 'double' }\n]\n\nfunction paletteField(key: string, label: string, path: string[], hint?: string): ThemeField {\n  return { key, label, path, kind: 'palette', hint }\n}\n\nfunction inputField(\n  key: string,\n  label: string,\n  path: string[],\n  placeholder?: string,\n  hint?: string\n): ThemeField {\n  return { key, label, path, kind: 'input', placeholder, hint }\n}\n\nfunction numberField(\n  key: string,\n  label: string,\n  path: string[],\n  options: Pick<ThemeField, 'min' | 'max' | 'step' | 'suffix' | 'hint'>\n): ThemeField {\n  return {\n    key,\n    label,\n    path,\n    kind: 'number',\n    min: options.min,\n    max: options.max,\n    step: options.step,\n    suffix: options.suffix,\n    hint: options.hint\n  }\n}\n\nfunction pxField(\n  key: string,\n  label: string,\n  path: string[],\n  min: number,\n  max: number,\n  hint?: string\n): ThemeField {\n  return numberField(key, label, path, { min, max, step: 1, suffix: 'px', hint })\n}\n\nfunction selectField(\n  key: string,\n  label: string,\n  path: string[],\n  options: ThemeFieldOption[],\n  hint?: string\n): ThemeField {\n  return { key, label, path, kind: 'select', options, hint }\n}\n\nexport const THEME_SECTIONS: ThemeSection[] = [\n  {\n    key: 'color',\n    title: '综合色板',\n    description: '品牌色与语义状态色，决定按钮、标签与反馈态的主视觉。',\n    fields: [\n      paletteField('color.primary', '主要颜色', ['color', 'primary']),\n      paletteField('color.success', '成功颜色', ['color', 'success']),\n      paletteField('color.warning', '警告颜色', ['color', 'warning']),\n      paletteField('color.danger', '危险颜色', ['color', 'danger']),\n      paletteField('color.info', '信息颜色', ['color', 'info']),\n      paletteField('color.disabled', '禁用颜色', ['color', 'disabled']),\n      paletteField('color.default', '默认颜色', ['color', 'default'])\n    ]\n  },\n  {\n    key: 'surface',\n    title: '表面层次',\n    description: '控制背景、文字、边框与阴影，决定整个界面的空气感与对比度。',\n    fields: [\n      paletteField('bg.color.top', '顶部背景', ['bg', 'color', 'top']),\n      paletteField('bg.color.middle', '中部背景', ['bg', 'color', 'middle']),\n      paletteField('bg.color.bottom', '底部背景', ['bg', 'color', 'bottom']),\n      paletteField('bg.color.hover', '悬停背景', ['bg', 'color', 'hover']),\n      paletteField('bg.color.black', '黑色背景', ['bg', 'color', 'black']),\n      inputField('bg.filter.blur', '背景模糊', ['bg', 'filter', 'blur'], '例如：blur(16px)'),\n      inputField(\n        'bg.filter.saturate',\n        '背景饱和度',\n        ['bg', 'filter', 'saturate'],\n        '例如：saturate(180%)'\n      ),\n      paletteField('text-color.title', '标题文字', ['text-color', 'title']),\n      paletteField('text-color.main', '主要文字', ['text-color', 'main']),\n      paletteField('text-color.placeholder', '占位文字', ['text-color', 'placeholder']),\n      paletteField('text-color.second', '次要文字', ['text-color', 'second']),\n      paletteField('text-color.assist', '辅助文字', ['text-color', 'assist']),\n      paletteField('text-color.disabled', '禁用文字', ['text-color', 'disabled']),\n      paletteField('text-color.white', '白色文字', ['text-color', 'white']),\n      paletteField('border.color', '边框颜色', ['border', 'color']),\n      pxField('border.width', '边框宽度', ['border', 'width'], 0, 10),\n      selectField('border.style', '边框样式', ['border', 'style'], borderStyleOptions),\n      paletteField('shadow.color', '阴影颜色', ['shadow', 'color']),\n      pxField('shadow.x', '水平偏移', ['shadow', 'x'], -24, 24),\n      pxField('shadow.y', '垂直偏移', ['shadow', 'y'], -24, 24),\n      pxField('shadow.blur', '模糊半径', ['shadow', 'blur'], 0, 64),\n      pxField('shadow.spread', '扩散半径', ['shadow', 'spread'], -12, 24)\n    ]\n  },\n  {\n    key: 'control',\n    title: '表单尺度',\n    description: '统一基础控件的边角、尺寸和节奏，让组件家族看起来更一致。',\n    fields: [\n      pxField('radius.small', '小圆角', ['radius', 'small'], 0, 24),\n      pxField('radius.default', '默认圆角', ['radius', 'default'], 0, 24),\n      pxField('radius.large', '大圆角', ['radius', 'large'], 0, 32),\n      pxField(\n        'form-component-height.small',\n        '小表单高度',\n        ['form-component-height', 'small'],\n        16,\n        40\n      ),\n      pxField(\n        'form-component-height.default',\n        '默认表单高度',\n        ['form-component-height', 'default'],\n        20,\n        52\n      ),\n      pxField(\n        'form-component-height.large',\n        '大表单高度',\n        ['form-component-height', 'large'],\n        24,\n        64\n      ),\n      pxField('gap.small', '小间距', ['gap', 'small'], 0, 20),\n      pxField('gap.default', '默认间距', ['gap', 'default'], 0, 24),\n      pxField('gap.large', '大间距', ['gap', 'large'], 0, 32)\n    ]\n  },\n  {\n    key: 'typography',\n    title: '字体系统',\n    description: '管理字体族与标题、正文、辅助文本的层级尺寸。',\n    fields: [\n      inputField(\n        'font-family',\n        '字体族',\n        ['font-family'],\n        '例如：\"IBM Plex Sans\", \"PingFang SC\", sans-serif'\n      ),\n      pxField('font-size-title.small', '小标题字号', ['font-size-title', 'small'], 8, 28),\n      pxField('font-size-title.default', '默认标题字号', ['font-size-title', 'default'], 8, 32),\n      pxField('font-size-title.large', '大标题字号', ['font-size-title', 'large'], 10, 40),\n      pxField('font-size-main.small', '小正文字号', ['font-size-main', 'small'], 8, 20),\n      pxField('font-size-main.default', '默认正文字号', ['font-size-main', 'default'], 8, 24),\n      pxField('font-size-main.large', '大正文字号', ['font-size-main', 'large'], 10, 28),\n      pxField('font-size-assist.small', '小辅助字号', ['font-size-assist', 'small'], 8, 18),\n      pxField('font-size-assist.default', '默认辅助字号', ['font-size-assist', 'default'], 8, 20),\n      pxField('font-size-assist.large', '大辅助字号', ['font-size-assist', 'large'], 8, 24)\n    ]\n  },\n  {\n    key: 'responsive',\n    title: '响应断点',\n    description: '维护布局与响应式行为使用的断点变量。',\n    fields: [\n      pxField('breakpoint.xs', '超小屏幕', ['breakpoint', 'xs'], 320, 900),\n      pxField('breakpoint.sm', '小屏幕', ['breakpoint', 'sm'], 480, 1200),\n      pxField('breakpoint.md', '中屏幕', ['breakpoint', 'md'], 768, 1600),\n      pxField('breakpoint.lg', '大屏幕', ['breakpoint', 'lg'], 1024, 2560)\n    ]\n  }\n]\n\nexport const THEME_FIELD_COUNT = THEME_SECTIONS.reduce((count, section) => {\n  return count + section.fields.length\n}, 0)\n"],"mappings":"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"}

package/dist/components/theme/style.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/theme/style.js

@@ -0,0 +1 @@
+import "./style2.css";