npm - @veltra/desktop - Versions diffs - 1.1.0 → 1.1.2 - Mend

@veltra/desktop 1.1.0 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (168) hide show

package/dist/components/collapse/collapse.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { CollapseDIKey } from "./di.js";
 import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, provide, renderSlot } from "vue";
-import { bem } from "@veltra/utils";
+import { ExpandTransition, bem } from "@veltra/utils";
 import { useFormFallbackProps, useModel as useModel$1 } from "@veltra/compositions";
 //#region src/components/collapse/collapse.vue
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -25,6 +25,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const props = __props;
 		const emit = __emit;
 		const cls = bem("collapse");
+		const expandTransition = new ExpandTransition({ transition: "height 0.24s cubic-bezier(0.4, 0, 0.2, 1)" });
 		const { size } = useFormFallbackProps([props], { size: "default" });
 		const iconPosition = computed(() => props.iconPosition ?? "right");
 		const expandIcon = computed(() => props.expandIcon);
@@ -91,7 +92,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			iconPosition,
 			expandIcon,
 			activeValues,
-			toggle
+			toggle,
+			expandTransition
 		});
 		__expose({
 			toggle,

package/dist/components/collapse/collapse.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"collapse.js","names":[],"sources":["../../../src/components/collapse/collapse.vue"],"sourcesContent":["<template>\n <div :class=\"classList\" role=\"region\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps, useModel } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, provide } from 'vue'\n\nimport type {\n CollapseEmits,\n CollapseModelValue,\n CollapseProps,\n CollapseValue,\n _CollapseExposed\n} from '../../types'\nimport { CollapseDIKey } from './di'\n\ndefineOptions({\n name: 'Collapse'\n})\n\nconst props = withDefaults(defineProps<CollapseProps>(), {\n accordion: false,\n bordered: true,\n iconPosition: 'right'\n})\nconst emit = defineEmits<CollapseEmits>()\n\nconst cls = bem('collapse')\n\nconst { size } = useFormFallbackProps([props], { size: 'default' })\n\nconst iconPosition = computed(() => props.iconPosition ?? 'right')\nconst expandIcon = computed(() => props.expandIcon)\n\nconst classList = computed(() => [\n cls.b,\n cls.m(size.value),\n cls.m(`icon-${iconPosition.value}`),\n bem.is('bordered', props.bordered)\n])\n\nconst modelValue = useModel<CollapseProps, 'modelValue'>({\n props,\n emit,\n propName: 'modelValue'\n})\n\nconst activeValues = computed<CollapseValue[]>(() => {\n const v = modelValue.value\n if (v === undefined \|\| v === null) return []\n return Array.isArray(v) ? v : [v]\n})\n\nconst update = (next: CollapseModelValue) => {\n modelValue.value = next\n emit('change', next)\n}\n\nconst toggle = (value: CollapseValue) => {\n if (props.accordion) {\n update(activeValues.value[0] === value ? [] : value)\n return\n }\n\n const values = activeValues.value.slice()\n const index = values.indexOf(value)\n if (index > -1) values.splice(index, 1)\n else values.push(value)\n update(values)\n}\n\nconst expand = (value: CollapseValue) => {\n if (activeValues.value.includes(value)) return\n if (props.accordion) {\n update(value)\n return\n }\n update([...activeValues.value, value])\n}\n\nconst collapse = (value: CollapseValue) => {\n if (!activeValues.value.includes(value)) return\n if (props.accordion) {\n update([])\n return\n }\n update(activeValues.value.filter((v) => v !== value))\n}\n\nconst expandAll = (values: CollapseValue[]) => {\n if (props.accordion) {\n update(values[0] ?? [])\n return\n }\n update([...values])\n}\n\nconst collapseAll = () => {\n update([])\n}\n\nprovide(CollapseDIKey, {\n cls,\n size,\n iconPosition,\n expandIcon,\n activeValues,\n toggle\n})\n\ndefineExpose<_CollapseExposed>({\n toggle,\n expand,\n collapse,\n expandAll,\n collapseAll\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,WAAU;EAE1B,MAAM,EAAE,SAAS,qBAAqB,CAAC,MAAM,EAAE,EAAE,MAAM,WAAW,CAAA;EAElE,MAAM,eAAe,eAAe,MAAM,gBAAgB,QAAO;EACjE,MAAM,aAAa,eAAe,MAAM,WAAU;EAElD,MAAM,YAAY,eAAe;GAC/B,IAAI;GACJ,IAAI,EAAE,KAAK,MAAM;GACjB,IAAI,EAAE,QAAQ,aAAa,QAAQ;GACnC,IAAI,GAAG,YAAY,MAAM,SAAQ;GAClC,CAAA;EAED,MAAM,aAAa,WAAsC;GACvD;GACA;GACA,UAAU;GACX,CAAA;EAED,MAAM,eAAe,eAAgC;GACnD,MAAM,IAAI,WAAW;AACrB,OAAI,MAAM,KAAA,KAAa,MAAM,KAAM,QAAO,EAAC;AAC3C,UAAO,MAAM,QAAQ,EAAE,GAAG,IAAI,CAAC,EAAC;IACjC;EAED,MAAM,UAAU,SAA6B;AAC3C,cAAW,QAAQ;AACnB,QAAK,UAAU,KAAI;;EAGrB,MAAM,UAAU,UAAyB;AACvC,OAAI,MAAM,WAAW;AACnB,WAAO,aAAa,MAAM,OAAO,QAAQ,EAAE,GAAG,MAAK;AACnD;;GAGF,MAAM,SAAS,aAAa,MAAM,OAAM;GACxC,MAAM,QAAQ,OAAO,QAAQ,MAAK;AAClC,OAAI,QAAQ,GAAI,QAAO,OAAO,OAAO,EAAC;OACjC,QAAO,KAAK,MAAK;AACtB,UAAO,OAAM;;EAGf,MAAM,UAAU,UAAyB;AACvC,OAAI,aAAa,MAAM,SAAS,MAAM,CAAE;AACxC,OAAI,MAAM,WAAW;AACnB,WAAO,MAAK;AACZ;;AAEF,UAAO,CAAC,GAAG,aAAa,OAAO,MAAM,CAAA;;EAGvC,MAAM,YAAY,UAAyB;AACzC,OAAI,CAAC,aAAa,MAAM,SAAS,MAAM,CAAE;AACzC,OAAI,MAAM,WAAW;AACnB,WAAO,EAAE,CAAA;AACT;;AAEF,UAAO,aAAa,MAAM,QAAQ,MAAM,MAAM,MAAM,CAAA;;EAGtD,MAAM,aAAa,WAA4B;AAC7C,OAAI,MAAM,WAAW;AACnB,WAAO,OAAO,MAAM,EAAE,CAAA;AACtB;;AAEF,UAAO,CAAC,GAAG,OAAO,CAAA;;EAGpB,MAAM,oBAAoB;AACxB,UAAO,EAAE,CAAA;;AAGX,UAAQ,eAAe;GACrB;GACA;GACA;GACA;GACA;GACA;GACD,CAAA;AAED,WAA+B;GAC7B;GACA;GACA;GACA;GACA;GACD,CAAA;;~~uBAvHC~~,mBAEM,OAAA;IAFA,OAAK,eAAE,UAAA,MAAS;IAAE,MAAK;OAC3B,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}
1	+ {"version":3,"file":"collapse.js","names":[],"sources":["../../../src/components/collapse/collapse.vue"],"sourcesContent":["<template>\n <div :class=\"classList\" role=\"region\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps, useModel } from '@veltra/compositions'\nimport { bem, ExpandTransition } from '@veltra/utils'\nimport { computed, provide } from 'vue'\n\nimport type {\n CollapseEmits,\n CollapseModelValue,\n CollapseProps,\n CollapseValue,\n _CollapseExposed\n} from '../../types'\nimport { CollapseDIKey } from './di'\n\ndefineOptions({\n name: 'Collapse'\n})\n\nconst props = withDefaults(defineProps<CollapseProps>(), {\n accordion: false,\n bordered: true,\n iconPosition: 'right'\n})\nconst emit = defineEmits<CollapseEmits>()\n\nconst cls = bem('collapse')\n\nconst expandTransition = new ExpandTransition({\n transition: 'height 0.24s cubic-bezier(0.4, 0, 0.2, 1)'\n})\n\nconst { size } = useFormFallbackProps([props], { size: 'default' })\n\nconst iconPosition = computed(() => props.iconPosition ?? 'right')\nconst expandIcon = computed(() => props.expandIcon)\n\nconst classList = computed(() => [\n cls.b,\n cls.m(size.value),\n cls.m(`icon-${iconPosition.value}`),\n bem.is('bordered', props.bordered)\n])\n\nconst modelValue = useModel<CollapseProps, 'modelValue'>({\n props,\n emit,\n propName: 'modelValue'\n})\n\nconst activeValues = computed<CollapseValue[]>(() => {\n const v = modelValue.value\n if (v === undefined \|\| v === null) return []\n return Array.isArray(v) ? v : [v]\n})\n\nconst update = (next: CollapseModelValue) => {\n modelValue.value = next\n emit('change', next)\n}\n\nconst toggle = (value: CollapseValue) => {\n if (props.accordion) {\n update(activeValues.value[0] === value ? [] : value)\n return\n }\n\n const values = activeValues.value.slice()\n const index = values.indexOf(value)\n if (index > -1) values.splice(index, 1)\n else values.push(value)\n update(values)\n}\n\nconst expand = (value: CollapseValue) => {\n if (activeValues.value.includes(value)) return\n if (props.accordion) {\n update(value)\n return\n }\n update([...activeValues.value, value])\n}\n\nconst collapse = (value: CollapseValue) => {\n if (!activeValues.value.includes(value)) return\n if (props.accordion) {\n update([])\n return\n }\n update(activeValues.value.filter((v) => v !== value))\n}\n\nconst expandAll = (values: CollapseValue[]) => {\n if (props.accordion) {\n update(values[0] ?? [])\n return\n }\n update([...values])\n}\n\nconst collapseAll = () => {\n update([])\n}\n\nprovide(CollapseDIKey, {\n cls,\n size,\n iconPosition,\n expandIcon,\n activeValues,\n toggle,\n expandTransition\n})\n\ndefineExpose<_CollapseExposed>({\n toggle,\n expand,\n collapse,\n expandAll,\n collapseAll\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,WAAU;EAE1B,MAAM,mBAAmB,IAAI,iBAAiB,EAC5C,YAAY,6CACb,CAAA;EAED,MAAM,EAAE,SAAS,qBAAqB,CAAC,MAAM,EAAE,EAAE,MAAM,WAAW,CAAA;EAElE,MAAM,eAAe,eAAe,MAAM,gBAAgB,QAAO;EACjE,MAAM,aAAa,eAAe,MAAM,WAAU;EAElD,MAAM,YAAY,eAAe;GAC/B,IAAI;GACJ,IAAI,EAAE,KAAK,MAAM;GACjB,IAAI,EAAE,QAAQ,aAAa,QAAQ;GACnC,IAAI,GAAG,YAAY,MAAM,SAAQ;GAClC,CAAA;EAED,MAAM,aAAa,WAAsC;GACvD;GACA;GACA,UAAU;GACX,CAAA;EAED,MAAM,eAAe,eAAgC;GACnD,MAAM,IAAI,WAAW;AACrB,OAAI,MAAM,KAAA,KAAa,MAAM,KAAM,QAAO,EAAC;AAC3C,UAAO,MAAM,QAAQ,EAAE,GAAG,IAAI,CAAC,EAAC;IACjC;EAED,MAAM,UAAU,SAA6B;AAC3C,cAAW,QAAQ;AACnB,QAAK,UAAU,KAAI;;EAGrB,MAAM,UAAU,UAAyB;AACvC,OAAI,MAAM,WAAW;AACnB,WAAO,aAAa,MAAM,OAAO,QAAQ,EAAE,GAAG,MAAK;AACnD;;GAGF,MAAM,SAAS,aAAa,MAAM,OAAM;GACxC,MAAM,QAAQ,OAAO,QAAQ,MAAK;AAClC,OAAI,QAAQ,GAAI,QAAO,OAAO,OAAO,EAAC;OACjC,QAAO,KAAK,MAAK;AACtB,UAAO,OAAM;;EAGf,MAAM,UAAU,UAAyB;AACvC,OAAI,aAAa,MAAM,SAAS,MAAM,CAAE;AACxC,OAAI,MAAM,WAAW;AACnB,WAAO,MAAK;AACZ;;AAEF,UAAO,CAAC,GAAG,aAAa,OAAO,MAAM,CAAA;;EAGvC,MAAM,YAAY,UAAyB;AACzC,OAAI,CAAC,aAAa,MAAM,SAAS,MAAM,CAAE;AACzC,OAAI,MAAM,WAAW;AACnB,WAAO,EAAE,CAAA;AACT;;AAEF,UAAO,aAAa,MAAM,QAAQ,MAAM,MAAM,MAAM,CAAA;;EAGtD,MAAM,aAAa,WAA4B;AAC7C,OAAI,MAAM,WAAW;AACnB,WAAO,OAAO,MAAM,EAAE,CAAA;AACtB;;AAEF,UAAO,CAAC,GAAG,OAAO,CAAA;;EAGpB,MAAM,oBAAoB;AACxB,UAAO,EAAE,CAAA;;AAGX,UAAQ,eAAe;GACrB;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAA;AAED,WAA+B;GAC7B;GACA;GACA;GACA;GACA;GACD,CAAA;;uBA5HC,mBAEM,OAAA;IAFA,OAAK,eAAE,UAAA,MAAS;IAAE,MAAK;OAC3B,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}

package/dist/components/collapse/collapse.vue.d.ts CHANGED Viewed

@@ -13,9 +13,9 @@ declare const __VLS_base: _$vue.DefineComponent<CollapseProps, _CollapseExposed,
   "onUpdate:modelValue"?: ((value: CollapseModelValue) => any) | undefined;
   onChange?: ((value: CollapseModelValue) => any) | undefined;
 }>, {
-  iconPosition: CollapseIconPosition;
   accordion: boolean;
   bordered: boolean;
+  iconPosition: CollapseIconPosition;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/collapse/di.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import "@veltra/utils";
 //#region src/components/collapse/di.ts
 const CollapseDIKey = Symbol("Collapse");
 //#endregion

package/dist/components/collapse/di.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"di.js","names":[],"sources":["../../../src/components/collapse/di.ts"],"sourcesContent":["import type { BEM, ComponentSize } from '@veltra/utils'\nimport type { Component, ComputedRef, InjectionKey } from 'vue'\n\nimport type { CollapseIconPosition, CollapseValue } from '../../types'\n\nexport interface CollapseContext {\n cls: BEM<'collapse'>\n size: ComputedRef<ComponentSize>\n iconPosition: ComputedRef<CollapseIconPosition>\n expandIcon: ComputedRef<Component \| undefined>\n activeValues: ComputedRef<CollapseValue[]>\n toggle: (value: CollapseValue) => void\n}\n\nexport const CollapseDIKey: InjectionKey<CollapseContext> = Symbol('Collapse')\n"],"mappings":"~~;AAcA~~,MAAa,gBAA+C,OAAO,WAAW"}
1	+ {"version":3,"file":"di.js","names":[],"sources":["../../../src/components/collapse/di.ts"],"sourcesContent":["import { type BEM, type ComponentSize, ExpandTransition } from '@veltra/utils'\nimport type { Component, ComputedRef, InjectionKey } from 'vue'\n\nimport type { CollapseIconPosition, CollapseValue } from '../../types'\n\nexport interface CollapseContext {\n cls: BEM<'collapse'>\n size: ComputedRef<ComponentSize>\n iconPosition: ComputedRef<CollapseIconPosition>\n expandIcon: ComputedRef<Component \| undefined>\n activeValues: ComputedRef<CollapseValue[]>\n toggle: (value: CollapseValue) => void\n expandTransition: ExpandTransition\n}\n\nexport const CollapseDIKey: InjectionKey<CollapseContext> = Symbol('Collapse')\n"],"mappings":";;AAeA,MAAa,gBAA+C,OAAO,WAAW"}

package/dist/components/date-panel/date-panel.vue.d.ts CHANGED Viewed

@@ -11,8 +11,8 @@ declare const __VLS_export: _$vue.DefineComponent<DatePanelProps, {}, {}, {}, {}
   "onSelect:range-date"?: ((rangeDate?: [_$_cat_kit_core0.Dater, _$_cat_kit_core0.Dater] | undefined) => any) | undefined;
   "onSelect:date"?: ((date: _$_cat_kit_core0.Dater) => any) | undefined;
 }>, {
-  type: "date" | "month" | "year";
   size: _$_veltra_utils0.ComponentSize;
+  type: "date" | "month" | "year";
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 //#endregion

package/dist/components/date-picker/date-picker.js CHANGED Viewed

@@ -1,10 +1,11 @@
 import _sfc_main$1 from "../icon/icon.js";
+import { injectFormContext } from "../../utils/form-context.js";
 import _sfc_main$2 from "../dropdown/dropdown.js";
 import input_default from "../input/input.js";
 import _sfc_main$3 from "../date-panel/date-panel.js";
 import { Fragment, computed, createBlock, createElementBlock, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, shallowRef, toDisplayString, unref, watch, withCtx } from "vue";
 import { FORM_EMPTY_CONTENT, bem } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps, useUserAction } from "@veltra/compositions";
+import { useFormFallbackProps, useUserAction } from "@veltra/compositions";
 import { date } from "@cat-kit/core";
 import { Calendar } from "@veltra/icons/normal";
 //#region src/components/date-picker/date-picker.vue
@@ -41,7 +42,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const props = __props;
 		const emit = __emit;
 		const cls = bem("date-picker");
-		const { formProps } = useFormComponent();
+		const { formProps } = injectFormContext();
 		const { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {
 			size: "default",
 			disabled: false,

package/dist/components/date-picker/date-picker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"date-picker.js","names":[],"sources":["../../../src/components/date-picker/date-picker.vue"],"sourcesContent":["<template>\n <u-dropdown\n :class=\"className\"\n trigger=\"click\"\n width=\"auto\"\n ref=\"dropdownRef\"\n @update:visible=\"\"\n :disabled=\"disabled\"\n v-if=\"!readonly\"\n >\n <template #trigger>\n <u-input\n :size=\"size\"\n native-readonly\n :clearable=\"clearable\"\n :placeholder=\"placeholder\"\n :model-value=\"displayedValue\"\n :disabled=\"disabled\"\n @clear=\"handleClear\"\n >\n <template #suffix>\n <u-icon :class=\"cls.e('icon')\"><Calendar /></u-icon>\n </template>\n </u-input>\n </template>\n\n <template #content>\n <UDatePanel :size :type :disabled-date :date=\"currentDate\" @select:date=\"handleSelectDate\" />\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ displayedValue \|\| FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { date, type Dater } from '@cat-kit/core'\nimport { ~~useFormComponent,~~ useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { Calendar } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { DatePickerEmits, DatePickerProps } from '../../types'\nimport type { DropdownExposed } from '../../types'\nimport { UDatePanel } from '../date-panel'\nimport { UDropdown } from '../dropdown'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\n\ndefineOptions({\n name: 'DatePicker'\n})\n\nconst props = withDefaults(defineProps<DatePickerProps>(), {\n placeholder: '选择日期',\n type: 'date',\n disabled: undefined,\n readonly: undefined,\n clearable: true\n})\n\nconst emit = defineEmits<DatePickerEmits>()\n\nconst cls = bem('date-picker')\n\nconst { formProps } = ~~useFormComponent~~()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value)]\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nconst formatStr = computed(() => {\n const { format, type } = props\n if (format) return format\n if (type === 'date') return 'yyyy-MM-dd'\n if (type === 'month') return 'yyyy-MM'\n if (type === 'year') return 'yyyy'\n return 'yyyy-MM-dd'\n})\n\nconst currentDate = shallowRef<Dater>()\n\nconst { userAction, isUserActive } = useUserAction()\n\nwatch(\n () => props.modelValue,\n (modelValue) => {\n if (isUserActive()) return\n currentDate.value = modelValue ? date(modelValue) : undefined\n },\n { immediate: true }\n)\n\nconst displayedValue = computed(() => {\n return currentDate.value?.format(formatStr.value) ?? ''\n})\n\nconst commitSelectedDate = userAction((date: Dater) => {\n currentDate.value = date\n emit('update:modelValue', date.format(formatStr.value))\n})\n\nasync function handleSelectDate(date: Dater) {\n await commitSelectedDate(date)\n dropdownRef.value?.close()\n}\n\nfunction handleClear() {\n currentDate.value = undefined\n emit('update:modelValue', undefined)\n}\n</script>\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDA~~,MAAM,QAAQ;EAQd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,cAAa;EAE7B,MAAM,EAAE,cAAc,~~kBAAiB~~;~~EAEvC~~,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE;GAClF,MAAM;GACN,UAAU;GACV,UAAU;GACX,CAAA;EAED,MAAM,YAAY,eAAe;AAC/B,UAAO,CAAC,IAAI,GAAG,IAAI,EAAE,KAAK,MAAM,CAAA;IACjC;EAED,MAAM,cAAc,YAA4B;EAEhD,MAAM,YAAY,eAAe;GAC/B,MAAM,EAAE,QAAQ,SAAS;AACzB,OAAI,OAAQ,QAAO;AACnB,OAAI,SAAS,OAAQ,QAAO;AAC5B,OAAI,SAAS,QAAS,QAAO;AAC7B,OAAI,SAAS,OAAQ,QAAO;AAC5B,UAAO;IACR;EAED,MAAM,cAAc,YAAkB;EAEtC,MAAM,EAAE,YAAY,iBAAiB,eAAc;AAEnD,cACQ,MAAM,aACX,eAAe;AACd,OAAI,cAAc,CAAE;AACpB,eAAY,QAAQ,aAAa,KAAK,WAAW,GAAG,KAAA;KAEtD,EAAE,WAAW,MAAK,CACpB;EAEA,MAAM,iBAAiB,eAAe;AACpC,UAAO,YAAY,OAAO,OAAO,UAAU,MAAM,IAAI;IACtD;EAED,MAAM,qBAAqB,YAAY,SAAgB;AACrD,eAAY,QAAQ;AACpB,QAAK,qBAAqB,KAAK,OAAO,UAAU,MAAM,CAAA;IACvD;EAED,eAAe,iBAAiB,MAAa;AAC3C,SAAM,mBAAmB,KAAI;AAC7B,eAAY,OAAO,OAAM;;EAG3B,SAAS,cAAc;AACrB,eAAY,QAAQ,KAAA;AACpB,QAAK,qBAAqB,KAAA,EAAS;;;~~WA9G1B~~,MAAA,SAAQ,IAAA,WAAA,EAPjB,YA4Ba,MAAA,YAAA,EAAA;;IA3BV,OAAK,eAAE,UAAA,MAAS;IACjB,SAAQ;IACR,OAAM;aACF;IAAJ,KAAI;IACH,oBAAc,OAAA,OAAA,OAAA,WAAf;IACC,UAAU,MAAA,SAAQ;;IAGR,SAAO,cAaN,CAZV,YAYU,MAAA,cAAA,EAAA;KAXP,MAAM,MAAA,KAAI;KACX,mBAAA;KACC,WAAW,QAAA;KACX,aAAa,QAAA;KACb,eAAa,eAAA;KACb,UAAU,MAAA,SAAQ;KAClB,SAAO;;KAEG,QAAM,cACqC,CAApD,YAAoD,MAAA,YAAA,EAAA,EAA3C,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA,EAAA,EAAA;6BAAsB,CAAZ,YAAY,MAAA,SAAA,CAAA,CAAA,CAAA;;;;;;;;;;;IAKtC,SAAO,cAC6E,CAA7F,YAA6F,MAAA,YAAA,EAAA;KAAhF,MAAA,MAAA,KAAI;KAAE,MAAA,QAAA;KAAM,iBAAA,QAAA;KAAe,MAAM,YAAA;KAAc,iBAAa;;;;;;;;iDAI7E,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,eAAA,SAAkB,MAAA,mBAAkB,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA"}
1	+ {"version":3,"file":"date-picker.js","names":[],"sources":["../../../src/components/date-picker/date-picker.vue"],"sourcesContent":["<template>\n <u-dropdown\n :class=\"className\"\n trigger=\"click\"\n width=\"auto\"\n ref=\"dropdownRef\"\n @update:visible=\"\"\n :disabled=\"disabled\"\n v-if=\"!readonly\"\n >\n <template #trigger>\n <u-input\n :size=\"size\"\n native-readonly\n :clearable=\"clearable\"\n :placeholder=\"placeholder\"\n :model-value=\"displayedValue\"\n :disabled=\"disabled\"\n @clear=\"handleClear\"\n >\n <template #suffix>\n <u-icon :class=\"cls.e('icon')\"><Calendar /></u-icon>\n </template>\n </u-input>\n </template>\n\n <template #content>\n <UDatePanel :size :type :disabled-date :date=\"currentDate\" @select:date=\"handleSelectDate\" />\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ displayedValue \|\| FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { date, type Dater } from '@cat-kit/core'\nimport { useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { Calendar } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { DatePickerEmits, DatePickerProps } from '../../types'\nimport type { DropdownExposed } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport { UDatePanel } from '../date-panel'\nimport { UDropdown } from '../dropdown'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\n\ndefineOptions({\n name: 'DatePicker'\n})\n\nconst props = withDefaults(defineProps<DatePickerProps>(), {\n placeholder: '选择日期',\n type: 'date',\n disabled: undefined,\n readonly: undefined,\n clearable: true\n})\n\nconst emit = defineEmits<DatePickerEmits>()\n\nconst cls = bem('date-picker')\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value)]\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nconst formatStr = computed(() => {\n const { format, type } = props\n if (format) return format\n if (type === 'date') return 'yyyy-MM-dd'\n if (type === 'month') return 'yyyy-MM'\n if (type === 'year') return 'yyyy'\n return 'yyyy-MM-dd'\n})\n\nconst currentDate = shallowRef<Dater>()\n\nconst { userAction, isUserActive } = useUserAction()\n\nwatch(\n () => props.modelValue,\n (modelValue) => {\n if (isUserActive()) return\n currentDate.value = modelValue ? date(modelValue) : undefined\n },\n { immediate: true }\n)\n\nconst displayedValue = computed(() => {\n return currentDate.value?.format(formatStr.value) ?? ''\n})\n\nconst commitSelectedDate = userAction((date: Dater) => {\n currentDate.value = date\n emit('update:modelValue', date.format(formatStr.value))\n})\n\nasync function handleSelectDate(date: Dater) {\n await commitSelectedDate(date)\n dropdownRef.value?.close()\n}\n\nfunction handleClear() {\n currentDate.value = undefined\n emit('update:modelValue', undefined)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuDA,MAAM,QAAQ;EAQd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,cAAa;EAE7B,MAAM,EAAE,cAAc,mBAAkB;EAExC,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE;GAClF,MAAM;GACN,UAAU;GACV,UAAU;GACX,CAAA;EAED,MAAM,YAAY,eAAe;AAC/B,UAAO,CAAC,IAAI,GAAG,IAAI,EAAE,KAAK,MAAM,CAAA;IACjC;EAED,MAAM,cAAc,YAA4B;EAEhD,MAAM,YAAY,eAAe;GAC/B,MAAM,EAAE,QAAQ,SAAS;AACzB,OAAI,OAAQ,QAAO;AACnB,OAAI,SAAS,OAAQ,QAAO;AAC5B,OAAI,SAAS,QAAS,QAAO;AAC7B,OAAI,SAAS,OAAQ,QAAO;AAC5B,UAAO;IACR;EAED,MAAM,cAAc,YAAkB;EAEtC,MAAM,EAAE,YAAY,iBAAiB,eAAc;AAEnD,cACQ,MAAM,aACX,eAAe;AACd,OAAI,cAAc,CAAE;AACpB,eAAY,QAAQ,aAAa,KAAK,WAAW,GAAG,KAAA;KAEtD,EAAE,WAAW,MAAK,CACpB;EAEA,MAAM,iBAAiB,eAAe;AACpC,UAAO,YAAY,OAAO,OAAO,UAAU,MAAM,IAAI;IACtD;EAED,MAAM,qBAAqB,YAAY,SAAgB;AACrD,eAAY,QAAQ;AACpB,QAAK,qBAAqB,KAAK,OAAO,UAAU,MAAM,CAAA;IACvD;EAED,eAAe,iBAAiB,MAAa;AAC3C,SAAM,mBAAmB,KAAI;AAC7B,eAAY,OAAO,OAAM;;EAG3B,SAAS,cAAc;AACrB,eAAY,QAAQ,KAAA;AACpB,QAAK,qBAAqB,KAAA,EAAS;;;WA/G1B,MAAA,SAAQ,IAAA,WAAA,EAPjB,YA4Ba,MAAA,YAAA,EAAA;;IA3BV,OAAK,eAAE,UAAA,MAAS;IACjB,SAAQ;IACR,OAAM;aACF;IAAJ,KAAI;IACH,oBAAc,OAAA,OAAA,OAAA,WAAf;IACC,UAAU,MAAA,SAAQ;;IAGR,SAAO,cAaN,CAZV,YAYU,MAAA,cAAA,EAAA;KAXP,MAAM,MAAA,KAAI;KACX,mBAAA;KACC,WAAW,QAAA;KACX,aAAa,QAAA;KACb,eAAa,eAAA;KACb,UAAU,MAAA,SAAQ;KAClB,SAAO;;KAEG,QAAM,cACqC,CAApD,YAAoD,MAAA,YAAA,EAAA,EAA3C,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA,EAAA,EAAA;6BAAsB,CAAZ,YAAY,MAAA,SAAA,CAAA,CAAA,CAAA;;;;;;;;;;;IAKtC,SAAO,cAC6E,CAA7F,YAA6F,MAAA,YAAA,EAAA;KAAhF,MAAA,MAAA,KAAI;KAAE,MAAA,QAAA;KAAM,iBAAA,QAAA;KAAe,MAAM,YAAA;KAAc,iBAAa;;;;;;;;iDAI7E,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,eAAA,SAAkB,MAAA,mBAAkB,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA"}

package/dist/components/date-range-picker/date-range-picker.js CHANGED Viewed

@@ -1,9 +1,10 @@
 import _sfc_main$1 from "../icon/icon.js";
+import { injectFormContext } from "../../utils/form-context.js";
 import _sfc_main$2 from "../dropdown/dropdown.js";
 import _sfc_main$3 from "../date-panel/date-panel.js";
 import { Fragment, Transition, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, shallowRef, toDisplayString, unref, watch, withCtx, withModifiers } from "vue";
 import { FORM_EMPTY_CONTENT, bem } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps, useUserAction } from "@veltra/compositions";
+import { useFormFallbackProps, useUserAction } from "@veltra/compositions";
 import { date } from "@cat-kit/core";
 import { Calendar, Close } from "@veltra/icons/normal";
 //#region src/components/date-range-picker/date-range-picker.vue
@@ -49,7 +50,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 				bem.is("disabled", disabled.value)
 			];
 		});
-		const { formProps } = useFormComponent();
+		const { formProps } = injectFormContext();
 		const { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {
 			size: "default",
 			disabled: false,

package/dist/components/date-range-picker/date-range-picker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"date-range-picker.js","names":[],"sources":["../../../src/components/date-range-picker/date-range-picker.vue"],"sourcesContent":["<template>\n <u-dropdown\n :class=\"className\"\n trigger=\"click\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size)]\"\n width=\"auto\"\n ref=\"dropdownRef\"\n :disabled=\"disabled\"\n @mouseenter.native=\"hovered = true\"\n @mouseleave.native=\"hovered = false\"\n v-if=\"!readonly\"\n >\n <template #trigger>\n <input\n type=\"text\"\n :class=\"cls.e('input')\"\n :value=\"displayedOfStart\"\n :placeholder=\"placeholder[0]\"\n readonly\n />\n <span :class=\"cls.e('separator')\">至</span>\n <input\n type=\"text\"\n :class=\"cls.e('input')\"\n :value=\"displayedOfEnd\"\n :placeholder=\"placeholder[1]\"\n readonly\n />\n\n <Transition name=\"zoom-in\" mode=\"out-in\">\n <UIcon\n v-if=\"clearable && modelValue && hovered && !disabled\"\n :class=\"[cls.e('icon'), cls.e('clear')]\"\n title=\"清除\"\n @click.stop=\"handleClear\"\n >\n <Close />\n </UIcon>\n\n <u-icon :class=\"cls.e('icon')\" v-else><Calendar /></u-icon>\n </Transition>\n </template>\n\n <template #content>\n <UDatePanel\n range\n :type\n :disabled-date\n :size\n :range-date=\"currentRangeDate\"\n @select:range-date=\"handleSelect\"\n />\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ displayedOfStart \|\| FORM_EMPTY_CONTENT }} 至\n {{ displayedOfEnd \|\| FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { date, type Dater } from '@cat-kit/core'\nimport { ~~useFormComponent,~~ useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { Calendar, Close } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { DateRangePickerEmits, DateRangePickerProps, DropdownExposed } from '../../types'\nimport { UDatePanel } from '../date-panel'\nimport { UDropdown } from '../dropdown'\nimport { UIcon } from '../icon'\n\ndefineOptions({\n name: 'DateRangePicker'\n})\n\nconst props = withDefaults(defineProps<DateRangePickerProps>(), {\n placeholder: () => ['起始日期', '结束日期'],\n type: 'date',\n disabled: undefined,\n readonly: undefined,\n clearable: true\n})\n\nconst emit = defineEmits<DateRangePickerEmits>()\n\nconst cls = bem('date-range-picker')\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value), bem.is('disabled', disabled.value)]\n})\n\nconst { formProps } = ~~useFormComponent~~()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nconst { userAction, isUserActive } = useUserAction()\n\nconst currentRangeDate = shallowRef<[Dater, Dater]>()\n\nconst displayedOfStart = computed(() => {\n return props.modelValue?.[0]\n})\n\nconst displayedOfEnd = computed(() => {\n return props.modelValue?.[1]\n})\n\nconst formatStr = computed(() => {\n const { format, type } = props\n if (format) return format\n if (type === 'date') return 'yyyy-MM-dd'\n if (type === 'month') return 'yyyy-MM'\n if (type === 'year') return 'yyyy'\n return 'yyyy-MM-dd'\n})\n\nwatch(\n () => props.modelValue,\n (val) => {\n if (isUserActive()) return\n if (val?.length === 2) {\n currentRangeDate.value = [date(val[0]), date(val[1])]\n }\n },\n { immediate: true }\n)\n\nconst commitSelectedRange = userAction((rangeDate: [Dater, Dater] \| undefined) => {\n currentRangeDate.value = rangeDate\n emit('update:modelValue', rangeDate?.map((d) => d.format(formatStr.value)) as [string, string])\n})\n\nasync function handleSelect(rangeDate: [Dater, Dater] \| undefined) {\n await commitSelectedRange(rangeDate)\n dropdownRef.value?.close()\n}\n\nconst hovered = shallowRef(false)\n\nfunction handleClear() {\n currentRangeDate.value = undefined\n emit('update:modelValue', undefined)\n}\n</script>\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6EA~~,MAAM,QAAQ;EAQd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,oBAAmB;EAEnC,MAAM,YAAY,eAAe;AAC/B,UAAO;IAAC,IAAI;IAAG,IAAI,EAAE,KAAK,MAAM;IAAE,IAAI,GAAG,YAAY,SAAS,MAAM;IAAA;IACrE;EAED,MAAM,EAAE,cAAc,~~kBAAiB~~;~~EAEvC~~,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE;GAClF,MAAM;GACN,UAAU;GACV,UAAU;GACX,CAAA;EAED,MAAM,cAAc,YAA4B;EAEhD,MAAM,EAAE,YAAY,iBAAiB,eAAc;EAEnD,MAAM,mBAAmB,YAA2B;EAEpD,MAAM,mBAAmB,eAAe;AACtC,UAAO,MAAM,aAAa;IAC3B;EAED,MAAM,iBAAiB,eAAe;AACpC,UAAO,MAAM,aAAa;IAC3B;EAED,MAAM,YAAY,eAAe;GAC/B,MAAM,EAAE,QAAQ,SAAS;AACzB,OAAI,OAAQ,QAAO;AACnB,OAAI,SAAS,OAAQ,QAAO;AAC5B,OAAI,SAAS,QAAS,QAAO;AAC7B,OAAI,SAAS,OAAQ,QAAO;AAC5B,UAAO;IACR;AAED,cACQ,MAAM,aACX,QAAQ;AACP,OAAI,cAAc,CAAE;AACpB,OAAI,KAAK,WAAW,EAClB,kBAAiB,QAAQ,CAAC,KAAK,IAAI,GAAG,EAAE,KAAK,IAAI,GAAG,CAAA;KAGxD,EAAE,WAAW,MAAK,CACpB;EAEA,MAAM,sBAAsB,YAAY,cAA0C;AAChF,oBAAiB,QAAQ;AACzB,QAAK,qBAAqB,WAAW,KAAK,MAAM,EAAE,OAAO,UAAU,MAAM,CAAC,CAAoB;IAC/F;EAED,eAAe,aAAa,WAAuC;AACjE,SAAM,oBAAoB,UAAS;AACnC,eAAY,OAAO,OAAM;;EAG3B,MAAM,UAAU,WAAW,MAAK;EAEhC,SAAS,cAAc;AACrB,oBAAiB,QAAQ,KAAA;AACzB,QAAK,qBAAqB,KAAA,EAAS;;;~~WA3I1B~~,MAAA,SAAQ,IAAA,WAAA,EATjB,YAoDa,MAAA,YAAA,EAAA;;IAnDV,OAAK,eAAE,UAAA,MAAS;IACjB,SAAQ;IACP,iBAAa,CAAG,MAAA,IAAG,CAAC,EAAC,QAAA,EAAW,MAAA,IAAG,CAAC,GAAE,SAAU,MAAA,KAAI,CAAA,CAAA;IACrD,OAAM;aACF;IAAJ,KAAI;IACH,UAAU,MAAA,SAAQ;IAClB,cAAU,OAAA,OAAA,OAAA,MAAA,WAAS,QAAA,QAAO;IAC1B,cAAU,OAAA,OAAA,OAAA,MAAA,WAAS,QAAA,QAAO;;IAGhB,SAAO,cAOd;KANF,mBAME,SAAA;MALA,MAAK;MACJ,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;MACZ,OAAO,iBAAA;MACP,aAAa,QAAA,YAAW;MACzB,UAAA;;KAEF,mBAA0C,QAAA,EAAnC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,YAAA,CAAA,EAAA,EAAe,KAAC,EAAA;KACnC,mBAME,SAAA;MALA,MAAK;MACJ,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;MACZ,OAAO,eAAA;MACP,aAAa,QAAA,YAAW;MACzB,UAAA;;KAGF,YAWa,YAAA;MAXD,MAAK;MAAU,MAAK;;6BAQtB,CANA,QAAA,aAAa,QAAA,cAAc,QAAA,SAAO,CAAK,MAAA,SAAQ,IAAA,WAAA,EADvD,YAOQ,MAAA,YAAA,EAAA;;OALL,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,EAAC,OAAA,EAAU,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA,CAAA;OAC7B,OAAM;OACL,SAAK,cAAO,aAAW,CAAA,OAAA,CAAA;;8BAEf,CAAT,YAAS,MAAA,MAAA,CAAA,CAAA,CAAA;;wCAGX,YAA2D,MAAA,YAAA,EAAA;;OAAlD,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;;8BAA6B,CAAZ,YAAY,MAAA,SAAA,CAAA,CAAA,CAAA;;;;;;IAI3C,SAAO,cAQd,CAPF,YAOE,MAAA,YAAA,EAAA;KANA,OAAA;KACC,MAAA,QAAA;KACA,iBAAA,QAAA;KACA,MAAA,MAAA,KAAI;KACJ,cAAY,iBAAA;KACZ,sBAAmB;;;;;;;;;;;;uBAK1B,mBAGW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBAFN,iBAAA,SAAoB,MAAA,mBAAkB,CAAA,GAAG,QAC5C,gBAAG,eAAA,SAAkB,MAAA,mBAAkB,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA"}
1	+ {"version":3,"file":"date-range-picker.js","names":[],"sources":["../../../src/components/date-range-picker/date-range-picker.vue"],"sourcesContent":["<template>\n <u-dropdown\n :class=\"className\"\n trigger=\"click\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size)]\"\n width=\"auto\"\n ref=\"dropdownRef\"\n :disabled=\"disabled\"\n @mouseenter.native=\"hovered = true\"\n @mouseleave.native=\"hovered = false\"\n v-if=\"!readonly\"\n >\n <template #trigger>\n <input\n type=\"text\"\n :class=\"cls.e('input')\"\n :value=\"displayedOfStart\"\n :placeholder=\"placeholder[0]\"\n readonly\n />\n <span :class=\"cls.e('separator')\">至</span>\n <input\n type=\"text\"\n :class=\"cls.e('input')\"\n :value=\"displayedOfEnd\"\n :placeholder=\"placeholder[1]\"\n readonly\n />\n\n <Transition name=\"zoom-in\" mode=\"out-in\">\n <UIcon\n v-if=\"clearable && modelValue && hovered && !disabled\"\n :class=\"[cls.e('icon'), cls.e('clear')]\"\n title=\"清除\"\n @click.stop=\"handleClear\"\n >\n <Close />\n </UIcon>\n\n <u-icon :class=\"cls.e('icon')\" v-else><Calendar /></u-icon>\n </Transition>\n </template>\n\n <template #content>\n <UDatePanel\n range\n :type\n :disabled-date\n :size\n :range-date=\"currentRangeDate\"\n @select:range-date=\"handleSelect\"\n />\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ displayedOfStart \|\| FORM_EMPTY_CONTENT }} 至\n {{ displayedOfEnd \|\| FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { date, type Dater } from '@cat-kit/core'\nimport { useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { Calendar, Close } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { DateRangePickerEmits, DateRangePickerProps, DropdownExposed } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport { UDatePanel } from '../date-panel'\nimport { UDropdown } from '../dropdown'\nimport { UIcon } from '../icon'\n\ndefineOptions({\n name: 'DateRangePicker'\n})\n\nconst props = withDefaults(defineProps<DateRangePickerProps>(), {\n placeholder: () => ['起始日期', '结束日期'],\n type: 'date',\n disabled: undefined,\n readonly: undefined,\n clearable: true\n})\n\nconst emit = defineEmits<DateRangePickerEmits>()\n\nconst cls = bem('date-range-picker')\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value), bem.is('disabled', disabled.value)]\n})\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nconst { userAction, isUserActive } = useUserAction()\n\nconst currentRangeDate = shallowRef<[Dater, Dater]>()\n\nconst displayedOfStart = computed(() => {\n return props.modelValue?.[0]\n})\n\nconst displayedOfEnd = computed(() => {\n return props.modelValue?.[1]\n})\n\nconst formatStr = computed(() => {\n const { format, type } = props\n if (format) return format\n if (type === 'date') return 'yyyy-MM-dd'\n if (type === 'month') return 'yyyy-MM'\n if (type === 'year') return 'yyyy'\n return 'yyyy-MM-dd'\n})\n\nwatch(\n () => props.modelValue,\n (val) => {\n if (isUserActive()) return\n if (val?.length === 2) {\n currentRangeDate.value = [date(val[0]), date(val[1])]\n }\n },\n { immediate: true }\n)\n\nconst commitSelectedRange = userAction((rangeDate: [Dater, Dater] \| undefined) => {\n currentRangeDate.value = rangeDate\n emit('update:modelValue', rangeDate?.map((d) => d.format(formatStr.value)) as [string, string])\n})\n\nasync function handleSelect(rangeDate: [Dater, Dater] \| undefined) {\n await commitSelectedRange(rangeDate)\n dropdownRef.value?.close()\n}\n\nconst hovered = shallowRef(false)\n\nfunction handleClear() {\n currentRangeDate.value = undefined\n emit('update:modelValue', undefined)\n}\n</script>\n"],"mappings":"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"}

package/dist/components/date-range-picker/style2.css CHANGED Viewed

@@ -19,7 +19,7 @@
   width: 100%;
   vertical-align: middle;
   line-height: 1;
-  border: var(--u-border);
+  border: var(--u-border-muted);
   box-shadow: var(--u-shadow-emboss);
   transition: border-color 0.25s ease, box-shadow 0.25s ease;
   overflow: hidden;

package/dist/components/expression-editor/expression-editor.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import { injectFormContext } from "../../utils/form-context.js";
 import _sfc_main$1 from "./components/variable-picker.js";
 import { parse } from "./core/model.js";
 import { createEditor } from "./core/editor.js";
@@ -5,7 +6,7 @@ import { createMention } from "./core/mention.js";
 import { createVariableMap } from "./di.js";
 import { computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, nextTick, normalizeClass, onBeforeUnmount, onMounted, openBlock, shallowRef, toDisplayString, unref, useTemplateRef, watch } from "vue";
 import { bem } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps } from "@veltra/compositions";
+import { useFormFallbackProps } from "@veltra/compositions";
 //#region src/components/expression-editor/expression-editor.vue
 const _hoisted_1 = [
 	"contenteditable",
@@ -33,7 +34,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const props = __props;
 		const emit = __emit;
 		const cls = bem("expression-editor");
-		const { formProps } = useFormComponent();
+		const { formProps } = injectFormContext();
 		const { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props]);
 		const containerRef = useTemplateRef("container");
 		const pickerRef = useTemplateRef("pickerRef");

package/dist/components/expression-editor/expression-editor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"expression-editor.js","names":[],"sources":["../../../src/components/expression-editor/expression-editor.vue"],"sourcesContent":["<template>\n <div :class=\"className\">\n <div\n ref=\"container\"\n :class=\"cls.e('container')\"\n :contenteditable=\"!readonly && !disabled\"\n :data-empty=\"isEmpty \|\| undefined\"\n :data-placeholder=\"props.placeholder\"\n @keydown=\"onKeydown\"\n @blur=\"onBlur\"\n ></div>\n\n <div v-if=\"showPlaceholder\" :class=\"cls.e('placeholder')\">\n {{ props.placeholder }}\n </div>\n\n <VariablePicker\n ref=\"pickerRef\"\n :visible=\"pickerVisible\"\n :trigger-dom=\"pickerTriggerDom\"\n :variables=\"props.variables\"\n :filter=\"pickerFilter\"\n :selectable-levels=\"props.selectableLevels ?? 'leaf'\"\n @select=\"onPickerSelect\"\n @dismiss=\"onPickerDismiss\"\n @update:visible=\"onPickerVisibleChange\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormComponent, useFormFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport {\n computed,\n nextTick,\n onBeforeUnmount,\n onMounted,\n shallowRef,\n useTemplateRef,\n watch\n} from 'vue'\n\nimport type { ExpressionEditorProps, VariableItem } from '../../types'\nimport VariablePicker from './components/variable-picker.vue'\nimport { createEditor, type EditorAPI } from './core/editor'\nimport { createMention, type MentionAPI } from './core/mention'\nimport { parse, type Doc } from './core/model'\nimport { createVariableMap } from './di'\n\ndefineOptions({\n name: 'ExpressionEditor'\n})\n\nconst props = withDefaults(defineProps<ExpressionEditorProps>(), {\n placeholder: '请输入表达式，输入 @ 可插入变量',\n selectableLevels: 'leaf'\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: string): void\n}>()\n\nconst cls = bem('expression-editor')\nconst { formProps } = useFormComponent()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst containerRef = useTemplateRef<HTMLDivElement>('container')\nconst pickerRef = useTemplateRef<{ handleKeydown: (e: KeyboardEvent) => boolean }>('pickerRef')\n\nconst className = computed(() => [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('readonly', readonly.value)\n])\n\nconst variableMap = computed(() => createVariableMap(props.variables))\n\nconst editorRef = shallowRef<EditorAPI \| null>(null)\nconst mention: MentionAPI = createMention()\n\nconst currentDoc = shallowRef<Doc>([])\nconst isEmpty = computed(() => currentDoc.value.length === 0)\nconst showPlaceholder = computed(() => isEmpty.value && !disabled.value)\n\nconst pickerMode = shallowRef<'mention' \| 'reselect' \| null>(null)\nconst pickerTriggerDom = shallowRef<HTMLElement \| undefined>(undefined)\nconst reselectingSegIdx = shallowRef<number \| null>(null)\nconst pickerFilter = shallowRef('')\n\nconst pickerVisible = computed(() => pickerMode.value !== null)\n\nfunction syncMention() {\n const editor = editorRef.value\n if (!editor) return\n if (pickerMode.value === 'reselect') return\n const caret = editor.getCaretOffset()\n const state = mention.update(currentDoc.value, caret)\n if (state) {\n pickerMode.value = 'mention'\n pickerFilter.value = state.filter\n pickerTriggerDom.value = containerRef.value ?? undefined\n } else if (pickerMode.value === 'mention') {\n closePicker()\n }\n}\n\nfunction closePicker() {\n pickerMode.value = null\n reselectingSegIdx.value = null\n pickerFilter.value = ''\n}\n\nonMounted(() => {\n if (!containerRef.value) return\n const initialDoc = parse(props.modelValue ?? '', variableMap.value)\n currentDoc.value = initialDoc\n\n const editor = createEditor({\n container: containerRef.value,\n cls,\n initialDoc,\n getVariableMap: () => variableMap.value,\n onChange: (doc) => {\n currentDoc.value = doc\n const value = serializeFromDoc(doc)\n if (value !== (props.modelValue ?? '')) emit('update:modelValue', value)\n syncMention()\n },\n onSelectionChange: () => {\n syncMention()\n },\n onChipReselect: ({ chipEl, segIndex }) => {\n if (disabled.value \|\| readonly.value) return\n mention.commit()\n pickerMode.value = 'reselect'\n pickerFilter.value = ''\n pickerTriggerDom.value = chipEl\n reselectingSegIdx.value = segIndex\n },\n onChipRemove: ({ segIndex }) => {\n if (disabled.value \|\| readonly.value) return\n editor.removeVarAt(segIndex)\n }\n })\n editorRef.value = editor\n})\n\nonBeforeUnmount(() => {\n editorRef.value?.dispose()\n})\n\nfunction serializeFromDoc(doc: Doc): string {\n let s = ''\n for (const seg of doc) s += seg.kind === 'text' ? seg.value : `{${seg.value}}`\n return s\n}\n\nwatch(\n () => props.modelValue,\n (v) => {\n const editor = editorRef.value\n if (!editor) return\n if (v === editor.getValue()) return\n editor.setValue(v ?? '')\n }\n)\n\nwatch(variableMap, () => {\n // variables 变化：重渲染以刷新 chip label / type\n const editor = editorRef.value\n if (!editor) return\n editor.setValue(editor.getValue())\n})\n\nfunction onKeydown(e: KeyboardEvent) {\n if (disabled.value \|\| readonly.value) return\n // mention / reselect 激活时，优先把箭头键 / Enter / Esc 转给 picker\n if (pickerMode.value !== null) {\n const handledByPicker = pickerRef.value?.handleKeydown(e)\n if (handledByPicker) {\n e.preventDefault()\n return\n }\n }\n\n if (pickerMode.value === 'mention') {\n // 这些键导致 mention 退出（保留 @filter 文本，光标继续移动）\n if (e.key === ' ' \|\| e.key === 'ArrowLeft' \|\| e.key === 'ArrowRight') {\n mention.dismiss()\n closePicker()\n }\n }\n}\n\nfunction onBlur() {\n if (pickerMode.value === 'mention') {\n mention.dismiss()\n // 下一帧再关闭，避免和 picker 内 click 冲突\n void nextTick(() => closePicker())\n }\n}\n\nfunction onPickerSelect(item: VariableItem) {\n const editor = editorRef.value\n if (!editor) return\n\n if (pickerMode.value === 'mention') {\n const state = mention.getState()\n if (!state) return\n const anchor = state.anchorOffset\n const caret = editor.getCaretOffset() ?? anchor + state.filter.length + 1\n editor.replaceRangeWithVar(anchor, caret, {\n value: item.value,\n label: item.label,\n ...(item.type ? { type: item.type } : {})\n })\n mention.commit()\n } else if (pickerMode.value === 'reselect') {\n const idx = reselectingSegIdx.value\n if (idx !== null) {\n editor.replaceVarAt(idx, {\n value: item.value,\n label: item.label,\n ...(item.type ? { type: item.type } : {})\n })\n }\n }\n closePicker()\n}\n\nfunction onPickerDismiss() {\n if (pickerMode.value === 'mention') mention.dismiss()\n closePicker()\n}\n\nfunction onPickerVisibleChange(v: boolean) {\n if (!v && pickerMode.value !== null) {\n if (pickerMode.value === 'mention') mention.dismiss()\n closePicker()\n }\n}\n</script>\n"],"mappings":"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"}
1	+ {"version":3,"file":"expression-editor.js","names":[],"sources":["../../../src/components/expression-editor/expression-editor.vue"],"sourcesContent":["<template>\n <div :class=\"className\">\n <div\n ref=\"container\"\n :class=\"cls.e('container')\"\n :contenteditable=\"!readonly && !disabled\"\n :data-empty=\"isEmpty \|\| undefined\"\n :data-placeholder=\"props.placeholder\"\n @keydown=\"onKeydown\"\n @blur=\"onBlur\"\n ></div>\n\n <div v-if=\"showPlaceholder\" :class=\"cls.e('placeholder')\">\n {{ props.placeholder }}\n </div>\n\n <VariablePicker\n ref=\"pickerRef\"\n :visible=\"pickerVisible\"\n :trigger-dom=\"pickerTriggerDom\"\n :variables=\"props.variables\"\n :filter=\"pickerFilter\"\n :selectable-levels=\"props.selectableLevels ?? 'leaf'\"\n @select=\"onPickerSelect\"\n @dismiss=\"onPickerDismiss\"\n @update:visible=\"onPickerVisibleChange\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport {\n computed,\n nextTick,\n onBeforeUnmount,\n onMounted,\n shallowRef,\n useTemplateRef,\n watch\n} from 'vue'\n\nimport type { ExpressionEditorProps, VariableItem } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport VariablePicker from './components/variable-picker.vue'\nimport { createEditor, type EditorAPI } from './core/editor'\nimport { createMention, type MentionAPI } from './core/mention'\nimport { parse, type Doc } from './core/model'\nimport { createVariableMap } from './di'\n\ndefineOptions({\n name: 'ExpressionEditor'\n})\n\nconst props = withDefaults(defineProps<ExpressionEditorProps>(), {\n placeholder: '请输入表达式，输入 @ 可插入变量',\n selectableLevels: 'leaf'\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: string): void\n}>()\n\nconst cls = bem('expression-editor')\nconst { formProps } = injectFormContext()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst containerRef = useTemplateRef<HTMLDivElement>('container')\nconst pickerRef = useTemplateRef<{ handleKeydown: (e: KeyboardEvent) => boolean }>('pickerRef')\n\nconst className = computed(() => [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('readonly', readonly.value)\n])\n\nconst variableMap = computed(() => createVariableMap(props.variables))\n\nconst editorRef = shallowRef<EditorAPI \| null>(null)\nconst mention: MentionAPI = createMention()\n\nconst currentDoc = shallowRef<Doc>([])\nconst isEmpty = computed(() => currentDoc.value.length === 0)\nconst showPlaceholder = computed(() => isEmpty.value && !disabled.value)\n\nconst pickerMode = shallowRef<'mention' \| 'reselect' \| null>(null)\nconst pickerTriggerDom = shallowRef<HTMLElement \| undefined>(undefined)\nconst reselectingSegIdx = shallowRef<number \| null>(null)\nconst pickerFilter = shallowRef('')\n\nconst pickerVisible = computed(() => pickerMode.value !== null)\n\nfunction syncMention() {\n const editor = editorRef.value\n if (!editor) return\n if (pickerMode.value === 'reselect') return\n const caret = editor.getCaretOffset()\n const state = mention.update(currentDoc.value, caret)\n if (state) {\n pickerMode.value = 'mention'\n pickerFilter.value = state.filter\n pickerTriggerDom.value = containerRef.value ?? undefined\n } else if (pickerMode.value === 'mention') {\n closePicker()\n }\n}\n\nfunction closePicker() {\n pickerMode.value = null\n reselectingSegIdx.value = null\n pickerFilter.value = ''\n}\n\nonMounted(() => {\n if (!containerRef.value) return\n const initialDoc = parse(props.modelValue ?? '', variableMap.value)\n currentDoc.value = initialDoc\n\n const editor = createEditor({\n container: containerRef.value,\n cls,\n initialDoc,\n getVariableMap: () => variableMap.value,\n onChange: (doc) => {\n currentDoc.value = doc\n const value = serializeFromDoc(doc)\n if (value !== (props.modelValue ?? '')) emit('update:modelValue', value)\n syncMention()\n },\n onSelectionChange: () => {\n syncMention()\n },\n onChipReselect: ({ chipEl, segIndex }) => {\n if (disabled.value \|\| readonly.value) return\n mention.commit()\n pickerMode.value = 'reselect'\n pickerFilter.value = ''\n pickerTriggerDom.value = chipEl\n reselectingSegIdx.value = segIndex\n },\n onChipRemove: ({ segIndex }) => {\n if (disabled.value \|\| readonly.value) return\n editor.removeVarAt(segIndex)\n }\n })\n editorRef.value = editor\n})\n\nonBeforeUnmount(() => {\n editorRef.value?.dispose()\n})\n\nfunction serializeFromDoc(doc: Doc): string {\n let s = ''\n for (const seg of doc) s += seg.kind === 'text' ? seg.value : `{${seg.value}}`\n return s\n}\n\nwatch(\n () => props.modelValue,\n (v) => {\n const editor = editorRef.value\n if (!editor) return\n if (v === editor.getValue()) return\n editor.setValue(v ?? '')\n }\n)\n\nwatch(variableMap, () => {\n // variables 变化：重渲染以刷新 chip label / type\n const editor = editorRef.value\n if (!editor) return\n editor.setValue(editor.getValue())\n})\n\nfunction onKeydown(e: KeyboardEvent) {\n if (disabled.value \|\| readonly.value) return\n // mention / reselect 激活时，优先把箭头键 / Enter / Esc 转给 picker\n if (pickerMode.value !== null) {\n const handledByPicker = pickerRef.value?.handleKeydown(e)\n if (handledByPicker) {\n e.preventDefault()\n return\n }\n }\n\n if (pickerMode.value === 'mention') {\n // 这些键导致 mention 退出（保留 @filter 文本，光标继续移动）\n if (e.key === ' ' \|\| e.key === 'ArrowLeft' \|\| e.key === 'ArrowRight') {\n mention.dismiss()\n closePicker()\n }\n }\n}\n\nfunction onBlur() {\n if (pickerMode.value === 'mention') {\n mention.dismiss()\n // 下一帧再关闭，避免和 picker 内 click 冲突\n void nextTick(() => closePicker())\n }\n}\n\nfunction onPickerSelect(item: VariableItem) {\n const editor = editorRef.value\n if (!editor) return\n\n if (pickerMode.value === 'mention') {\n const state = mention.getState()\n if (!state) return\n const anchor = state.anchorOffset\n const caret = editor.getCaretOffset() ?? anchor + state.filter.length + 1\n editor.replaceRangeWithVar(anchor, caret, {\n value: item.value,\n label: item.label,\n ...(item.type ? { type: item.type } : {})\n })\n mention.commit()\n } else if (pickerMode.value === 'reselect') {\n const idx = reselectingSegIdx.value\n if (idx !== null) {\n editor.replaceVarAt(idx, {\n value: item.value,\n label: item.label,\n ...(item.type ? { type: item.type } : {})\n })\n }\n }\n closePicker()\n}\n\nfunction onPickerDismiss() {\n if (pickerMode.value === 'mention') mention.dismiss()\n closePicker()\n}\n\nfunction onPickerVisibleChange(v: boolean) {\n if (!v && pickerMode.value !== null) {\n if (pickerMode.value === 'mention') mention.dismiss()\n closePicker()\n }\n}\n</script>\n"],"mappings":"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"}

package/dist/components/expression-editor/style2.css CHANGED Viewed

@@ -20,7 +20,7 @@
   background-color: var(--u-bg-color-top);
   border-width: var(--u-border-width);
   border-style: var(--u-border-style);
-  border-color: var(--u-border-color);
+  border-color: var(--u-border-muted-color);
   border-radius: var(--u-radius-default);
 }
 .u-expression-editor:not(.is-disabled):not(.is-readonly):hover {
@@ -33,19 +33,19 @@
 .u-expression-editor.is-disabled {
   background-color: var(--u-color-disabled);
   cursor: not-allowed;
-  border-color: var(--u-border-color);
+  border-color: var(--u-border-muted-color);
 }
 .u-expression-editor.is-disabled:hover {
-  border-color: var(--u-border-color);
+  border-color: var(--u-border-muted-color);
 }
 .u-expression-editor.is-readonly {
   background-color: var(--u-bg-color-middle);
   cursor: default;
-  border-color: var(--u-border-color);
+  border-color: var(--u-border-muted-color);
   user-select: text;
 }
 .u-expression-editor.is-readonly:hover {
-  border-color: var(--u-border-color);
+  border-color: var(--u-border-muted-color);
 }
 .u-expression-editor__placeholder {
   position: absolute;

package/dist/components/form/form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.js","names":[],"sources":["../../../src/components/form/form.vue"],"sourcesContent":["<template>\n <u-grid\n tag=\"form\"\n ref=\"gridRef\"\n @submit.prevent\n :cols=\"cols \|\| breakpointCols\"\n :class=\"[cls.b, bem.is('readonly', readonly)]\"\n >\n <template\n v-for=\"{ node, isFormItem, formItemProps, field, modelValue } of getSlotsNodes()\"\n :key=\"node.key\"\n >\n <component v-if=\"isFormItem \|\| !field\" :is=\"node\" />\n\n <u-form-item v-else v-bind=\"formItemProps\">\n <component\n :is=\"node\"\n :model-value=\"modelValue ?? o(model?.data ?? {}).get(field)\"\n @update:model-value=\"handleUpdateValue(field, $event)\"\n />\n\n <div :class=\"cls.e('data-before')\" v-if=\"showInitialNode(field)\">\n <i :class=\"cls.e('changed-tag')\">变更前：</i>\n\n <component :is=\"node\" readonly :model-value=\"o(model?.initialData ?? {}).get(field)\" />\n </div>\n </u-form-item>\n </template>\n </u-grid>\n</template>\n\n<script lang=\"tsx\" setup generic=\"Model extends FormModel \| DynamicFormModel\">\nimport { o } from '@cat-kit/core'\nimport { ~~useFormComponent } from '@veltra/compositions'\nimport {~~ bem } from '@veltra/utils'\nimport { shallowRef, toRef } from 'vue'\n\nimport type { BreakCols, GridExposed, FormProps, _FormExposed } from '../../types'\nimport { UFormItem } from '../form-item'\nimport { UGrid } from '../grid'\nimport type { DynamicFormModel } from './dynamic-form-model'\nimport type { FormModel } from './form-model'\nimport { useNodeInterceptor } from './use-node-interceptor'\n\ndefineOptions({\n name: 'Form'\n})\n\nconst props = defineProps<FormProps<Model>>()\n\ndefineSlots<{\n default(props: {\n /** 表单数据 /\n data: Model['data']\n /* 表单模型 */\n model: Model\n }): any\n}>()\n\nconst cls = bem('form')\n\nconst breakpointCols: BreakCols = {\n xs: 1,\n md: 2,\n lg: 3,\n xl: 4,\n default: 4\n}\n\~~nuseFormComponent~~(props)\n\nconst { getSlotsNodes } = useNodeInterceptor({ props })\n\nfunction handleUpdateValue(field: string, value: any) {\n const { model } = props\n if (!model) return\n o(model.data).set(field, value)\n}\n\nfunction showInitialNode(field: string) {\n const { data, initialData } = props.model \|\| {}\n\n const currentValue = o(data ?? {}).get(field)\n const initialValue = o(initialData ?? {}).get(field)\n const notEqual = !(initialValue === currentValue \|\| (!initialValue && !currentValue))\n\n return props.showInitialData && notEqual\n}\n\nconst gridRef = shallowRef<GridExposed>()\n\ndefineExpose<_FormExposed>({\n el: toRef(() => gridRef.value?.el)\n})\n</script>\n"],"mappings":""}
1	+ {"version":3,"file":"form.js","names":[],"sources":["../../../src/components/form/form.vue"],"sourcesContent":["<template>\n <u-grid\n tag=\"form\"\n ref=\"gridRef\"\n @submit.prevent\n :cols=\"cols \|\| breakpointCols\"\n :class=\"[cls.b, bem.is('readonly', readonly)]\"\n >\n <template\n v-for=\"{ node, isFormItem, formItemProps, field, modelValue } of getSlotsNodes()\"\n :key=\"node.key\"\n >\n <component v-if=\"isFormItem \|\| !field\" :is=\"node\" />\n\n <u-form-item v-else v-bind=\"formItemProps\">\n <component\n :is=\"node\"\n :model-value=\"modelValue ?? o(model?.data ?? {}).get(field)\"\n @update:model-value=\"handleUpdateValue(field, $event)\"\n />\n\n <div :class=\"cls.e('data-before')\" v-if=\"showInitialNode(field)\">\n <i :class=\"cls.e('changed-tag')\">变更前：</i>\n\n <component :is=\"node\" readonly :model-value=\"o(model?.initialData ?? {}).get(field)\" />\n </div>\n </u-form-item>\n </template>\n </u-grid>\n</template>\n\n<script lang=\"tsx\" setup generic=\"Model extends FormModel \| DynamicFormModel\">\nimport { o } from '@cat-kit/core'\nimport { bem } from '@veltra/utils'\nimport { shallowRef, toRef } from 'vue'\n\nimport type { BreakCols, GridExposed, FormProps, _FormExposed } from '../../types'\nimport { provideFormContext } from '../../utils/form-context'\nimport { UFormItem } from '../form-item'\nimport { UGrid } from '../grid'\nimport type { DynamicFormModel } from './dynamic-form-model'\nimport type { FormModel } from './form-model'\nimport { useNodeInterceptor } from './use-node-interceptor'\n\ndefineOptions({\n name: 'Form'\n})\n\nconst props = defineProps<FormProps<Model>>()\n\ndefineSlots<{\n default(props: {\n /** 表单数据 /\n data: Model['data']\n /* 表单模型 */\n model: Model\n }): any\n}>()\n\nconst cls = bem('form')\n\nconst breakpointCols: BreakCols = {\n xs: 1,\n md: 2,\n lg: 3,\n xl: 4,\n default: 4\n}\n\nprovideFormContext(props)\n\nconst { getSlotsNodes } = useNodeInterceptor({ props })\n\nfunction handleUpdateValue(field: string, value: any) {\n const { model } = props\n if (!model) return\n o(model.data).set(field, value)\n}\n\nfunction showInitialNode(field: string) {\n const { data, initialData } = props.model \|\| {}\n\n const currentValue = o(data ?? {}).get(field)\n const initialValue = o(initialData ?? {}).get(field)\n const notEqual = !(initialValue === currentValue \|\| (!initialValue && !currentValue))\n\n return props.showInitialData && notEqual\n}\n\nconst gridRef = shallowRef<GridExposed>()\n\ndefineExpose<_FormExposed>({\n el: toRef(() => gridRef.value?.el)\n})\n</script>\n"],"mappings":""}

package/dist/components/form/form.vue_vue_type_script_setup_true_lang.js CHANGED Viewed

@@ -1,9 +1,9 @@
+import { provideFormContext } from "../../utils/form-context.js";
 import _sfc_main from "../grid/grid.js";
 import form_item_default from "../form-item/form-item.js";
 import { useNodeInterceptor } from "./use-node-interceptor.js";
 import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderList, resolveDynamicComponent, shallowRef, toRef, unref, withCtx, withModifiers } from "vue";
 import { bem } from "@veltra/utils";
-import { useFormComponent } from "@veltra/compositions";
 import { o } from "@cat-kit/core";
 //#region src/components/form/form.vue?vue&type=script&setup=true&lang.tsx
 var form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -29,7 +29,7 @@ var form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 			xl: 4,
 			default: 4
 		};
-		useFormComponent(props);
+		provideFormContext(props);
 		const { getSlotsNodes } = useNodeInterceptor({ props });
 		function handleUpdateValue(field, value) {
 			const { model } = props;

package/dist/components/form/form.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/form/form.vue"],"sourcesContent":["<template>\n <u-grid\n tag=\"form\"\n ref=\"gridRef\"\n @submit.prevent\n :cols=\"cols \|\| breakpointCols\"\n :class=\"[cls.b, bem.is('readonly', readonly)]\"\n >\n <template\n v-for=\"{ node, isFormItem, formItemProps, field, modelValue } of getSlotsNodes()\"\n :key=\"node.key\"\n >\n <component v-if=\"isFormItem \|\| !field\" :is=\"node\" />\n\n <u-form-item v-else v-bind=\"formItemProps\">\n <component\n :is=\"node\"\n :model-value=\"modelValue ?? o(model?.data ?? {}).get(field)\"\n @update:model-value=\"handleUpdateValue(field, $event)\"\n />\n\n <div :class=\"cls.e('data-before')\" v-if=\"showInitialNode(field)\">\n <i :class=\"cls.e('changed-tag')\">变更前：</i>\n\n <component :is=\"node\" readonly :model-value=\"o(model?.initialData ?? {}).get(field)\" />\n </div>\n </u-form-item>\n </template>\n </u-grid>\n</template>\n\n<script lang=\"tsx\" setup generic=\"Model extends FormModel \| DynamicFormModel\">\nimport { o } from '@cat-kit/core'\nimport { ~~useFormComponent } from '@veltra/compositions'\nimport {~~ bem } from '@veltra/utils'\nimport { shallowRef, toRef } from 'vue'\n\nimport type { BreakCols, GridExposed, FormProps, _FormExposed } from '../../types'\nimport { UFormItem } from '../form-item'\nimport { UGrid } from '../grid'\nimport type { DynamicFormModel } from './dynamic-form-model'\nimport type { FormModel } from './form-model'\nimport { useNodeInterceptor } from './use-node-interceptor'\n\ndefineOptions({\n name: 'Form'\n})\n\nconst props = defineProps<FormProps<Model>>()\n\ndefineSlots<{\n default(props: {\n /** 表单数据 /\n data: Model['data']\n /* 表单模型 */\n model: Model\n }): any\n}>()\n\nconst cls = bem('form')\n\nconst breakpointCols: BreakCols = {\n xs: 1,\n md: 2,\n lg: 3,\n xl: 4,\n default: 4\n}\n\~~nuseFormComponent~~(props)\n\nconst { getSlotsNodes } = useNodeInterceptor({ props })\n\nfunction handleUpdateValue(field: string, value: any) {\n const { model } = props\n if (!model) return\n o(model.data).set(field, value)\n}\n\nfunction showInitialNode(field: string) {\n const { data, initialData } = props.model \|\| {}\n\n const currentValue = o(data ?? {}).get(field)\n const initialValue = o(initialData ?? {}).get(field)\n const notEqual = !(initialValue === currentValue \|\| (!initialValue && !currentValue))\n\n return props.showInitialData && notEqual\n}\n\nconst gridRef = shallowRef<GridExposed>()\n\ndefineExpose<_FormExposed>({\n el: toRef(() => gridRef.value?.el)\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAgDA,MAAM,QAAQ;EAWd,MAAM,MAAM,IAAI,OAAM;EAEtB,MAAM,iBAA4B;GAChC,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,SAAS;GACX;AAEA,~~mBAAiB~~,MAAK;~~EAEtB~~,MAAM,EAAE,kBAAkB,mBAAmB,EAAE,OAAO,CAAA;EAEtD,SAAS,kBAAkB,OAAe,OAAY;GACpD,MAAM,EAAE,UAAU;AAClB,OAAI,CAAC,MAAO;AACZ,KAAE,MAAM,KAAK,CAAC,IAAI,OAAO,MAAK;;EAGhC,SAAS,gBAAgB,OAAe;GACtC,MAAM,EAAE,MAAM,gBAAgB,MAAM,SAAS,EAAC;GAE9C,MAAM,eAAe,EAAE,QAAQ,EAAE,CAAC,CAAC,IAAI,MAAK;GAC5C,MAAM,eAAe,EAAE,eAAe,EAAE,CAAC,CAAC,IAAI,MAAK;GACnD,MAAM,WAAW,EAAE,iBAAiB,gBAAiB,CAAC,gBAAgB,CAAC;AAEvE,UAAO,MAAM,mBAAmB;;EAGlC,MAAM,UAAU,YAAwB;AAExC,WAA2B,EACzB,IAAI,YAAY,QAAQ,OAAO,GAAE,EAClC,CAAA;;uBA5FC,YA2BS,MAAA,UAAA,EAAA;IA1BP,KAAI;aACA;IAAJ,KAAI;IACH,UAAM,OAAA,OAAA,OAAA,KAAA,oBAAP,IAAe,CAAA,UAAA,CAAA;IACd,MAAM,QAAA,QAAQ;IACd,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,GAAG,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,SAAQ,CAAA,CAAA;;2BAGwC,EAAA,UAAA,KAAA,EADnF,mBAmBW,UAAA,MAAA,WAlBwD,MAAA,cAAa,EAAA,GAAA,EAArE,MAAM,YAAY,eAAe,OAAO,iBAAU;6DACrD,KAAK,KAAA,EAAA,CAEM,cAAU,CAAK,SAAA,WAAA,EAAhC,YAAoD,wBAAR,KAAI,EAAA,EAAA,KAAA,GAAA,CAAA,KAAA,WAAA,EAEhD,YAYc,MAAA,kBAAA,EAZd,WAYc;;;QAZc,cAAa,EAAA;6BAKrC,EAAA,WAAA,EAJF,YAIE,wBAHK,KAAI,EAAA;OACR,eAAa,cAAc,MAAA,EAAC,CAAC,QAAA,OAAO,QAAI,EAAA,CAAA,CAAQ,IAAI,MAAK;OACzD,wBAAkB,WAAE,kBAAkB,OAAO,OAAM;4DAGb,gBAAgB,MAAK,IAAA,WAAA,EAA9D,mBAIM,OAAA;;OAJA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA;UAChB,mBAAyC,KAAA,EAArC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA,EAAA,EAAiB,QAAI,EAAA,GAAA,WAAA,EAErC,YAAuF,wBAAvE,KAAI,EAAA;OAAE,UAAA;OAAU,eAAa,MAAA,EAAC,CAAC,QAAA,OAAO,eAAW,EAAA,CAAA,CAAQ,IAAI,MAAK"}
1	+ {"version":3,"file":"form.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/form/form.vue"],"sourcesContent":["<template>\n <u-grid\n tag=\"form\"\n ref=\"gridRef\"\n @submit.prevent\n :cols=\"cols \|\| breakpointCols\"\n :class=\"[cls.b, bem.is('readonly', readonly)]\"\n >\n <template\n v-for=\"{ node, isFormItem, formItemProps, field, modelValue } of getSlotsNodes()\"\n :key=\"node.key\"\n >\n <component v-if=\"isFormItem \|\| !field\" :is=\"node\" />\n\n <u-form-item v-else v-bind=\"formItemProps\">\n <component\n :is=\"node\"\n :model-value=\"modelValue ?? o(model?.data ?? {}).get(field)\"\n @update:model-value=\"handleUpdateValue(field, $event)\"\n />\n\n <div :class=\"cls.e('data-before')\" v-if=\"showInitialNode(field)\">\n <i :class=\"cls.e('changed-tag')\">变更前：</i>\n\n <component :is=\"node\" readonly :model-value=\"o(model?.initialData ?? {}).get(field)\" />\n </div>\n </u-form-item>\n </template>\n </u-grid>\n</template>\n\n<script lang=\"tsx\" setup generic=\"Model extends FormModel \| DynamicFormModel\">\nimport { o } from '@cat-kit/core'\nimport { bem } from '@veltra/utils'\nimport { shallowRef, toRef } from 'vue'\n\nimport type { BreakCols, GridExposed, FormProps, _FormExposed } from '../../types'\nimport { provideFormContext } from '../../utils/form-context'\nimport { UFormItem } from '../form-item'\nimport { UGrid } from '../grid'\nimport type { DynamicFormModel } from './dynamic-form-model'\nimport type { FormModel } from './form-model'\nimport { useNodeInterceptor } from './use-node-interceptor'\n\ndefineOptions({\n name: 'Form'\n})\n\nconst props = defineProps<FormProps<Model>>()\n\ndefineSlots<{\n default(props: {\n /** 表单数据 /\n data: Model['data']\n /* 表单模型 */\n model: Model\n }): any\n}>()\n\nconst cls = bem('form')\n\nconst breakpointCols: BreakCols = {\n xs: 1,\n md: 2,\n lg: 3,\n xl: 4,\n default: 4\n}\n\nprovideFormContext(props)\n\nconst { getSlotsNodes } = useNodeInterceptor({ props })\n\nfunction handleUpdateValue(field: string, value: any) {\n const { model } = props\n if (!model) return\n o(model.data).set(field, value)\n}\n\nfunction showInitialNode(field: string) {\n const { data, initialData } = props.model \|\| {}\n\n const currentValue = o(data ?? {}).get(field)\n const initialValue = o(initialData ?? {}).get(field)\n const notEqual = !(initialValue === currentValue \|\| (!initialValue && !currentValue))\n\n return props.showInitialData && notEqual\n}\n\nconst gridRef = shallowRef<GridExposed>()\n\ndefineExpose<_FormExposed>({\n el: toRef(() => gridRef.value?.el)\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAgDA,MAAM,QAAQ;EAWd,MAAM,MAAM,IAAI,OAAM;EAEtB,MAAM,iBAA4B;GAChC,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,SAAS;GACX;AAEA,qBAAmB,MAAK;EAExB,MAAM,EAAE,kBAAkB,mBAAmB,EAAE,OAAO,CAAA;EAEtD,SAAS,kBAAkB,OAAe,OAAY;GACpD,MAAM,EAAE,UAAU;AAClB,OAAI,CAAC,MAAO;AACZ,KAAE,MAAM,KAAK,CAAC,IAAI,OAAO,MAAK;;EAGhC,SAAS,gBAAgB,OAAe;GACtC,MAAM,EAAE,MAAM,gBAAgB,MAAM,SAAS,EAAC;GAE9C,MAAM,eAAe,EAAE,QAAQ,EAAE,CAAC,CAAC,IAAI,MAAK;GAC5C,MAAM,eAAe,EAAE,eAAe,EAAE,CAAC,CAAC,IAAI,MAAK;GACnD,MAAM,WAAW,EAAE,iBAAiB,gBAAiB,CAAC,gBAAgB,CAAC;AAEvE,UAAO,MAAM,mBAAmB;;EAGlC,MAAM,UAAU,YAAwB;AAExC,WAA2B,EACzB,IAAI,YAAY,QAAQ,OAAO,GAAE,EAClC,CAAA;;uBA5FC,YA2BS,MAAA,UAAA,EAAA;IA1BP,KAAI;aACA;IAAJ,KAAI;IACH,UAAM,OAAA,OAAA,OAAA,KAAA,oBAAP,IAAe,CAAA,UAAA,CAAA;IACd,MAAM,QAAA,QAAQ;IACd,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,GAAG,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,SAAQ,CAAA,CAAA;;2BAGwC,EAAA,UAAA,KAAA,EADnF,mBAmBW,UAAA,MAAA,WAlBwD,MAAA,cAAa,EAAA,GAAA,EAArE,MAAM,YAAY,eAAe,OAAO,iBAAU;6DACrD,KAAK,KAAA,EAAA,CAEM,cAAU,CAAK,SAAA,WAAA,EAAhC,YAAoD,wBAAR,KAAI,EAAA,EAAA,KAAA,GAAA,CAAA,KAAA,WAAA,EAEhD,YAYc,MAAA,kBAAA,EAZd,WAYc;;;QAZc,cAAa,EAAA;6BAKrC,EAAA,WAAA,EAJF,YAIE,wBAHK,KAAI,EAAA;OACR,eAAa,cAAc,MAAA,EAAC,CAAC,QAAA,OAAO,QAAI,EAAA,CAAA,CAAQ,IAAI,MAAK;OACzD,wBAAkB,WAAE,kBAAkB,OAAO,OAAM;4DAGb,gBAAgB,MAAK,IAAA,WAAA,EAA9D,mBAIM,OAAA;;OAJA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA;UAChB,mBAAyC,KAAA,EAArC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA,EAAA,EAAiB,QAAI,EAAA,GAAA,WAAA,EAErC,YAAuF,wBAAvE,KAAI,EAAA;OAAE,UAAA;OAAU,eAAa,MAAA,EAAC,CAAC,QAAA,OAAO,eAAW,EAAA,CAAA,CAAQ,IAAI,MAAK"}

package/dist/components/form-item/form-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-item.js","names":[],"sources":["../../../src/components/form-item/form-item.vue"],"sourcesContent":["<template>\n <u-grid-item :span=\"span\" :class=\"className\">\n <label\n v-if=\"props.label \|\| $slots.label\"\n :class=\"[cls.e('label'), bem.is('required', fieldRequired)]\"\n :style=\"labelStyles\"\n >\n <u-tip v-if=\"tips\" :content=\"tips\" :class=\"cls.e('tips')\">\n <span :class=\"cls.e('tip-label')\">\n <slot name=\"label\">{{ label }}:</slot>\n </span>\n </u-tip>\n <template v-else>\n <slot name=\"label\">{{ label }}:</slot>\n </template>\n </label>\n\n <section :class=\"cls.e('wrapper')\">\n <div :class=\"cls.e('content')\">\n <slot></slot>\n </div>\n\n <!-- 只有表单控件处于非只读状态时，才显示错误提示 -->\n <section :class=\"cls.e('error')\" v-if=\"!formProps?.readonly && !formProps?.noTips\">\n <transition name=\"form-item-tips\" mode=\"out-in\">\n <span :class=\"cls.e('error-text')\" v-if=\"!!errorTips\">\n {{ errorTips }}\n </span>\n </transition>\n </section>\n </section>\n </u-grid-item>\n</template>\n\n<script lang=\"tsx\" setup>\nimport { useConfig, useFallbackProps, ~~useFormComponent~~ } from '@veltra/compositions'\nimport { bem, withUnit } from '@veltra/utils'\nimport { type CSSProperties, computed } from 'vue'\n\nimport type { FormItemProps, ComponentSize } from '../../types'\nimport { UGridItem } from '../grid'\nimport { UTip } from '../tip'\nimport { formItemCls as cls } from './helper'\n\ndefineOptions({\n name: 'FormItem'\n})\n\nconst props = withDefaults(defineProps<FormItemProps>(), {\n readonly: undefined\n})\n\ndefineSlots<{\n /** 标签插槽 /\n label?: () => any\n default?: () => any\n}>()\n\n/* 表单组件上下文 /\nconst { formProps } = ~~useFormComponent~~()\n\nconst { config } = useConfig()\n\nconst { size, readonly } = useFallbackProps([formProps ?? {}, props], {\n size: 'default' as ComponentSize,\n readonly: false\n})\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value), bem.is('error', !!errorTips.value)].join(' ')\n})\n\n/* label样式 /\nconst labelStyles = computed<CSSProperties>(() => {\n return {\n width: withUnit(props.labelWidth ?? formProps?.labelWidth ?? config.form.labelWidth, 'px')\n }\n})\n\n/* 错误提示 /\nconst errorTips = computed<string \| undefined>(() => {\n if (props.field) {\n return formProps?.model.errors.get(props.field)?.[0]\n }\n})\n\n/* 字段是否必须 */\nconst fieldRequired = computed<boolean>(() => {\n const { field } = props\n if (!field \|\| readonly.value) return false\n const required = formProps?.model?.fields[field]?.required\n return Boolean(required)\n})\n</script>\n"],"mappings":""}
1	+ {"version":3,"file":"form-item.js","names":[],"sources":["../../../src/components/form-item/form-item.vue"],"sourcesContent":["<template>\n <u-grid-item :span=\"span\" :class=\"className\">\n <label\n v-if=\"props.label \|\| $slots.label\"\n :class=\"[cls.e('label'), bem.is('required', fieldRequired)]\"\n :style=\"labelStyles\"\n >\n <u-tip v-if=\"tips\" :content=\"tips\" :class=\"cls.e('tips')\">\n <span :class=\"cls.e('tip-label')\">\n <slot name=\"label\">{{ label }}:</slot>\n </span>\n </u-tip>\n <template v-else>\n <slot name=\"label\">{{ label }}:</slot>\n </template>\n </label>\n\n <section :class=\"cls.e('wrapper')\">\n <div :class=\"cls.e('content')\">\n <slot></slot>\n </div>\n\n <!-- 只有表单控件处于非只读状态时，才显示错误提示 -->\n <section :class=\"cls.e('error')\" v-if=\"!formProps?.readonly && !formProps?.noTips\">\n <transition name=\"form-item-tips\" mode=\"out-in\">\n <span :class=\"cls.e('error-text')\" v-if=\"!!errorTips\">\n {{ errorTips }}\n </span>\n </transition>\n </section>\n </section>\n </u-grid-item>\n</template>\n\n<script lang=\"tsx\" setup>\nimport { useConfig, useFallbackProps } from '@veltra/compositions'\nimport { bem, withUnit } from '@veltra/utils'\nimport { type CSSProperties, computed } from 'vue'\n\nimport type { FormItemProps, ComponentSize } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport { UGridItem } from '../grid'\nimport { UTip } from '../tip'\nimport { formItemCls as cls } from './helper'\n\ndefineOptions({\n name: 'FormItem'\n})\n\nconst props = withDefaults(defineProps<FormItemProps>(), {\n readonly: undefined\n})\n\ndefineSlots<{\n /** 标签插槽 /\n label?: () => any\n default?: () => any\n}>()\n\n/* 表单组件上下文 /\nconst { formProps } = injectFormContext()\n\nconst { config } = useConfig()\n\nconst { size, readonly } = useFallbackProps([formProps ?? {}, props], {\n size: 'default' as ComponentSize,\n readonly: false\n})\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value), bem.is('error', !!errorTips.value)].join(' ')\n})\n\n/* label样式 /\nconst labelStyles = computed<CSSProperties>(() => {\n return {\n width: withUnit(props.labelWidth ?? formProps?.labelWidth ?? config.form.labelWidth, 'px')\n }\n})\n\n/* 错误提示 /\nconst errorTips = computed<string \| undefined>(() => {\n if (props.field) {\n return formProps?.model.errors.get(props.field)?.[0]\n }\n})\n\n/* 字段是否必须 */\nconst fieldRequired = computed<boolean>(() => {\n const { field } = props\n if (!field \|\| readonly.value) return false\n const required = formProps?.model?.fields[field]?.required\n return Boolean(required)\n})\n</script>\n"],"mappings":""}

package/dist/components/form-item/form-item.vue_vue_type_script_setup_true_lang.js CHANGED Viewed

@@ -1,9 +1,10 @@
+import { injectFormContext } from "../../utils/form-context.js";
 import _sfc_main from "../grid/grid-item.js";
 import _sfc_main$1 from "../tip/tip.js";
 import { formItemCls } from "./helper.js";
 import { Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, renderSlot, toDisplayString, unref, withCtx } from "vue";
 import { bem, withUnit } from "@veltra/utils";
-import { useConfig, useFallbackProps, useFormComponent } from "@veltra/compositions";
+import { useConfig, useFallbackProps } from "@veltra/compositions";
 //#region src/components/form-item/form-item.vue?vue&type=script&setup=true&lang.tsx
 var form_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	name: "FormItem",
@@ -24,7 +25,7 @@ var form_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 	setup(__props) {
 		const props = __props;
 		/** 表单组件上下文 */
-		const { formProps } = useFormComponent();
+		const { formProps } = injectFormContext();
 		const { config } = useConfig();
 		const { size, readonly } = useFallbackProps([formProps ?? {}, props], {
 			size: "default",

package/dist/components/form-item/form-item.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-item.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/form-item/form-item.vue"],"sourcesContent":["<template>\n <u-grid-item :span=\"span\" :class=\"className\">\n <label\n v-if=\"props.label \|\| $slots.label\"\n :class=\"[cls.e('label'), bem.is('required', fieldRequired)]\"\n :style=\"labelStyles\"\n >\n <u-tip v-if=\"tips\" :content=\"tips\" :class=\"cls.e('tips')\">\n <span :class=\"cls.e('tip-label')\">\n <slot name=\"label\">{{ label }}:</slot>\n </span>\n </u-tip>\n <template v-else>\n <slot name=\"label\">{{ label }}:</slot>\n </template>\n </label>\n\n <section :class=\"cls.e('wrapper')\">\n <div :class=\"cls.e('content')\">\n <slot></slot>\n </div>\n\n <!-- 只有表单控件处于非只读状态时，才显示错误提示 -->\n <section :class=\"cls.e('error')\" v-if=\"!formProps?.readonly && !formProps?.noTips\">\n <transition name=\"form-item-tips\" mode=\"out-in\">\n <span :class=\"cls.e('error-text')\" v-if=\"!!errorTips\">\n {{ errorTips }}\n </span>\n </transition>\n </section>\n </section>\n </u-grid-item>\n</template>\n\n<script lang=\"tsx\" setup>\nimport { useConfig, useFallbackProps, ~~useFormComponent~~ } from '@veltra/compositions'\nimport { bem, withUnit } from '@veltra/utils'\nimport { type CSSProperties, computed } from 'vue'\n\nimport type { FormItemProps, ComponentSize } from '../../types'\nimport { UGridItem } from '../grid'\nimport { UTip } from '../tip'\nimport { formItemCls as cls } from './helper'\n\ndefineOptions({\n name: 'FormItem'\n})\n\nconst props = withDefaults(defineProps<FormItemProps>(), {\n readonly: undefined\n})\n\ndefineSlots<{\n /** 标签插槽 /\n label?: () => any\n default?: () => any\n}>()\n\n/* 表单组件上下文 /\nconst { formProps } = ~~useFormComponent~~()\n\nconst { config } = useConfig()\n\nconst { size, readonly } = useFallbackProps([formProps ?? {}, props], {\n size: 'default' as ComponentSize,\n readonly: false\n})\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value), bem.is('error', !!errorTips.value)].join(' ')\n})\n\n/* label样式 /\nconst labelStyles = computed<CSSProperties>(() => {\n return {\n width: withUnit(props.labelWidth ?? formProps?.labelWidth ?? config.form.labelWidth, 'px')\n }\n})\n\n/* 错误提示 /\nconst errorTips = computed<string \| undefined>(() => {\n if (props.field) {\n return formProps?.model.errors.get(props.field)?.[0]\n }\n})\n\n/* 字段是否必须 */\nconst fieldRequired = computed<boolean>(() => {\n const { field } = props\n if (!field \|\| readonly.value) return false\n const required = formProps?.model?.fields[field]?.required\n return Boolean(required)\n})\n</script>\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;EAgDA~~,MAAM,QAAQ;;EAWd,MAAM,EAAE,cAAc,~~kBAAiB~~;~~EAEvC~~,MAAM,EAAE,WAAW,WAAU;EAE7B,MAAM,EAAE,MAAM,aAAa,iBAAiB,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE;GACpE,MAAM;GACN,UAAU;GACX,CAAA;EAED,MAAM,YAAY,eAAe;AAC/B,UAAO;IAAC,YAAI;IAAG,YAAI,EAAE,KAAK,MAAM;IAAE,IAAI,GAAG,SAAS,CAAC,CAAC,UAAU,MAAM;IAAC,CAAC,KAAK,IAAG;IAC/E;;EAGD,MAAM,cAAc,eAA8B;AAChD,UAAO,EACL,OAAO,SAAS,MAAM,cAAc,WAAW,cAAc,OAAO,KAAK,YAAY,KAAI,EAC3F;IACD;;EAGD,MAAM,YAAY,eAAmC;AACnD,OAAI,MAAM,MACR,QAAO,WAAW,MAAM,OAAO,IAAI,MAAM,MAAM,GAAG;IAErD;;EAGD,MAAM,gBAAgB,eAAwB;GAC5C,MAAM,EAAE,UAAU;AAClB,OAAI,CAAC,SAAS,SAAS,MAAO,QAAO;GACrC,MAAM,WAAW,WAAW,OAAO,OAAO,QAAQ;AAClD,UAAO,QAAQ,SAAQ;IACxB;;~~uBA3FC~~,YA8Bc,MAAA,UAAA,EAAA;IA9BA,MAAM,QAAA;IAAO,OAAK,eAAE,UAAA,MAAS;;2BAcjC,CAZA,MAAM,SAASA,KAAAA,OAAO,SAAA,WAAA,EAD9B,mBAaQ,SAAA;;KAXL,OAAK,eAAA,CAAG,MAAA,YAAG,CAAC,EAAC,QAAA,EAAW,MAAA,IAAG,CAAC,GAAE,YAAa,cAAA,MAAa,CAAA,CAAA;KACxD,OAAK,eAAE,YAAA,MAAW;QAEN,QAAA,QAAA,WAAA,EAAb,YAIQ,MAAA,YAAA,EAAA;;KAJY,SAAS,QAAA;KAAO,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,OAAA,CAAA;;4BAGvC,CAFP,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,YAAA,CAAA,EAAA,EAAA,CACjB,WAAsC,KAAA,QAAA,SAAA,EAAA,QAAA,CAAA,gBAAA,gBAAhB,QAAA,MAAK,GAAG,KAAC,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA,CAAA,CAAA;;mCAIjC,WAAsC,KAAA,QAAA,SAAA,EAAA,KAAA,GAAA,QAAA,CAAA,gBAAA,gBAAhB,QAAA,MAAK,GAAG,KAAC,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,QAAA,KAAA,EAInC,mBAaU,WAAA,EAbA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,UAAA,CAAA,EAAA,EAAA;KACpB,mBAEM,OAAA,EAFA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,UAAA,CAAA,EAAA,EAAA,CAChB,WAAa,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA;KAGf,mBAAA,2BAA+B;MACS,MAAA,UAAS,EAAE,YAAQ,CAAK,MAAA,UAAS,EAAE,UAAA,WAAA,EAA3E,mBAMU,WAAA;;MANA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,QAAA,CAAA;SACpB,YAIa,YAAA;MAJD,MAAK;MAAiB,MAAK;;6BAG9B,CAAA,CAAA,CAFoC,UAAA,SAAA,WAAA,EAA3C,mBAEO,QAAA;;OAFA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,aAAA,CAAA;yBACd,UAAA,MAAS,EAAA,EAAA,IAAA,mBAAA,QAAA,KAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"form-item.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/form-item/form-item.vue"],"sourcesContent":["<template>\n <u-grid-item :span=\"span\" :class=\"className\">\n <label\n v-if=\"props.label \|\| $slots.label\"\n :class=\"[cls.e('label'), bem.is('required', fieldRequired)]\"\n :style=\"labelStyles\"\n >\n <u-tip v-if=\"tips\" :content=\"tips\" :class=\"cls.e('tips')\">\n <span :class=\"cls.e('tip-label')\">\n <slot name=\"label\">{{ label }}:</slot>\n </span>\n </u-tip>\n <template v-else>\n <slot name=\"label\">{{ label }}:</slot>\n </template>\n </label>\n\n <section :class=\"cls.e('wrapper')\">\n <div :class=\"cls.e('content')\">\n <slot></slot>\n </div>\n\n <!-- 只有表单控件处于非只读状态时，才显示错误提示 -->\n <section :class=\"cls.e('error')\" v-if=\"!formProps?.readonly && !formProps?.noTips\">\n <transition name=\"form-item-tips\" mode=\"out-in\">\n <span :class=\"cls.e('error-text')\" v-if=\"!!errorTips\">\n {{ errorTips }}\n </span>\n </transition>\n </section>\n </section>\n </u-grid-item>\n</template>\n\n<script lang=\"tsx\" setup>\nimport { useConfig, useFallbackProps } from '@veltra/compositions'\nimport { bem, withUnit } from '@veltra/utils'\nimport { type CSSProperties, computed } from 'vue'\n\nimport type { FormItemProps, ComponentSize } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport { UGridItem } from '../grid'\nimport { UTip } from '../tip'\nimport { formItemCls as cls } from './helper'\n\ndefineOptions({\n name: 'FormItem'\n})\n\nconst props = withDefaults(defineProps<FormItemProps>(), {\n readonly: undefined\n})\n\ndefineSlots<{\n /** 标签插槽 /\n label?: () => any\n default?: () => any\n}>()\n\n/* 表单组件上下文 /\nconst { formProps } = injectFormContext()\n\nconst { config } = useConfig()\n\nconst { size, readonly } = useFallbackProps([formProps ?? {}, props], {\n size: 'default' as ComponentSize,\n readonly: false\n})\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value), bem.is('error', !!errorTips.value)].join(' ')\n})\n\n/* label样式 /\nconst labelStyles = computed<CSSProperties>(() => {\n return {\n width: withUnit(props.labelWidth ?? formProps?.labelWidth ?? config.form.labelWidth, 'px')\n }\n})\n\n/* 错误提示 /\nconst errorTips = computed<string \| undefined>(() => {\n if (props.field) {\n return formProps?.model.errors.get(props.field)?.[0]\n }\n})\n\n/* 字段是否必须 */\nconst fieldRequired = computed<boolean>(() => {\n const { field } = props\n if (!field \|\| readonly.value) return false\n const required = formProps?.model?.fields[field]?.required\n return Boolean(required)\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAiDA,MAAM,QAAQ;;EAWd,MAAM,EAAE,cAAc,mBAAkB;EAExC,MAAM,EAAE,WAAW,WAAU;EAE7B,MAAM,EAAE,MAAM,aAAa,iBAAiB,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE;GACpE,MAAM;GACN,UAAU;GACX,CAAA;EAED,MAAM,YAAY,eAAe;AAC/B,UAAO;IAAC,YAAI;IAAG,YAAI,EAAE,KAAK,MAAM;IAAE,IAAI,GAAG,SAAS,CAAC,CAAC,UAAU,MAAM;IAAC,CAAC,KAAK,IAAG;IAC/E;;EAGD,MAAM,cAAc,eAA8B;AAChD,UAAO,EACL,OAAO,SAAS,MAAM,cAAc,WAAW,cAAc,OAAO,KAAK,YAAY,KAAI,EAC3F;IACD;;EAGD,MAAM,YAAY,eAAmC;AACnD,OAAI,MAAM,MACR,QAAO,WAAW,MAAM,OAAO,IAAI,MAAM,MAAM,GAAG;IAErD;;EAGD,MAAM,gBAAgB,eAAwB;GAC5C,MAAM,EAAE,UAAU;AAClB,OAAI,CAAC,SAAS,SAAS,MAAO,QAAO;GACrC,MAAM,WAAW,WAAW,OAAO,OAAO,QAAQ;AAClD,UAAO,QAAQ,SAAQ;IACxB;;uBA5FC,YA8Bc,MAAA,UAAA,EAAA;IA9BA,MAAM,QAAA;IAAO,OAAK,eAAE,UAAA,MAAS;;2BAcjC,CAZA,MAAM,SAASA,KAAAA,OAAO,SAAA,WAAA,EAD9B,mBAaQ,SAAA;;KAXL,OAAK,eAAA,CAAG,MAAA,YAAG,CAAC,EAAC,QAAA,EAAW,MAAA,IAAG,CAAC,GAAE,YAAa,cAAA,MAAa,CAAA,CAAA;KACxD,OAAK,eAAE,YAAA,MAAW;QAEN,QAAA,QAAA,WAAA,EAAb,YAIQ,MAAA,YAAA,EAAA;;KAJY,SAAS,QAAA;KAAO,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,OAAA,CAAA;;4BAGvC,CAFP,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,YAAA,CAAA,EAAA,EAAA,CACjB,WAAsC,KAAA,QAAA,SAAA,EAAA,QAAA,CAAA,gBAAA,gBAAhB,QAAA,MAAK,GAAG,KAAC,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA,CAAA,CAAA;;mCAIjC,WAAsC,KAAA,QAAA,SAAA,EAAA,KAAA,GAAA,QAAA,CAAA,gBAAA,gBAAhB,QAAA,MAAK,GAAG,KAAC,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,QAAA,KAAA,EAInC,mBAaU,WAAA,EAbA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,UAAA,CAAA,EAAA,EAAA;KACpB,mBAEM,OAAA,EAFA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,UAAA,CAAA,EAAA,EAAA,CAChB,WAAa,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA;KAGf,mBAAA,2BAA+B;MACS,MAAA,UAAS,EAAE,YAAQ,CAAK,MAAA,UAAS,EAAE,UAAA,WAAA,EAA3E,mBAMU,WAAA;;MANA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,QAAA,CAAA;SACpB,YAIa,YAAA;MAJD,MAAK;MAAiB,MAAK;;6BAG9B,CAAA,CAAA,CAFoC,UAAA,SAAA,WAAA,EAA3C,mBAEO,QAAA;;OAFA,OAAK,eAAE,MAAA,YAAG,CAAC,EAAC,aAAA,CAAA;yBACd,UAAA,MAAS,EAAA,EAAA,IAAA,mBAAA,QAAA,KAAA,CAAA,CAAA"}

package/dist/components/form-item/style2.css CHANGED Viewed

@@ -87,7 +87,6 @@
 .u-form-item__content {
   flex-grow: 1;
   word-break: break-all;
-  overflow: hidden;
   display: flex;
   justify-content: flex-start;
   align-items: center;

package/dist/components/grid-input/style2.css CHANGED Viewed

@@ -19,7 +19,7 @@
   width: var(--u-form-component-height-small);
   height: var(--u-form-component-height-small);
   line-height: var(--u-form-component-height-small);
-  border: var(--u-border);
+  border: var(--u-border-muted);
   border-radius: var(--u-gap-small);
   outline: none;
   text-align: center;
@@ -60,7 +60,7 @@
   width: var(--u-form-component-height-default);
   height: var(--u-form-component-height-default);
   line-height: var(--u-form-component-height-default);
-  border: var(--u-border);
+  border: var(--u-border-muted);
   border-radius: var(--u-gap-default);
   outline: none;
   text-align: center;
@@ -101,7 +101,7 @@
   width: var(--u-form-component-height-large);
   height: var(--u-form-component-height-large);
   line-height: var(--u-form-component-height-large);
-  border: var(--u-border);
+  border: var(--u-border-muted);
   border-radius: var(--u-gap-large);
   outline: none;
   text-align: center;

package/dist/components/group-input/group-input.js CHANGED Viewed

@@ -1,8 +1,9 @@
+import { injectFormContext } from "../../utils/form-context.js";
 import _sfc_main$1 from "../button/button.js";
 import { useGroupItems } from "./use-group-items.js";
 import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, openBlock, renderList, renderSlot, toDisplayString, unref, withCtx } from "vue";
 import { FORM_EMPTY_CONTENT, bem } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps } from "@veltra/compositions";
+import { useFormFallbackProps } from "@veltra/compositions";
 import { Minus, Plus } from "@veltra/icons/normal";
 //#region src/components/group-input/group-input.vue
 const _hoisted_1 = { key: 0 };
@@ -43,7 +44,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const props = __props;
 		const emit = __emit;
 		const cls = bem("group-input");
-		const { formProps } = useFormComponent();
+		const { formProps } = injectFormContext();
 		const { disabled, size, readonly } = useFormFallbackProps([formProps ?? {}, props], {
 			size: "default",
 			disabled: false,

package/dist/components/group-input/group-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"group-input.js","names":[],"sources":["../../../src/components/group-input/group-input.vue"],"sourcesContent":["<template>\n <ul :class=\"[cls.b, cls.m(size)]\" v-if=\"!readonly\">\n <li v-if=\"isEmpty && creatable\">\n <u-button style=\"width: 100%\" :icon=\"Plus\" @click=\"handleAdd(0)\" :size=\"size\">\n 新增\n </u-button>\n </li>\n <li v-for=\"(item, index) of items\" :key=\"item.id\" :class=\"cls.e('item')\" :style=\"itemStyle\">\n <slot v-bind=\"{ item: item.data, index }\" />\n <span :class=\"cls.e('actions')\">\n <u-button\n :icon=\"Minus\"\n circle\n :disabled=\"disabled\"\n :size=\"size\"\n @click=\"handleRemove(index)\"\n />\n <u-button :icon=\"Plus\" circle :disabled=\"disabled\" :size=\"size\" @click=\"handleAdd(index)\" />\n </span>\n </li>\n </ul>\n\n <template v-else-if=\"items?.length\">\n <ul :class=\"[cls.b, cls.m(size)]\">\n <li v-for=\"item of items\" :key=\"item.id\" :class=\"cls.e('item')\">\n <span v-for=\"v in item.data\">{{ v }}</span>\n </li>\n </ul>\n </template>\n\n <template v-else>\n {{ FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup generic=\"GroupItem extends Record<string, any>\">\nimport { ~~useFormComponent,~~ useFormFallbackProps } from '@veltra/compositions'\nimport { Minus, Plus } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { GroupInputEmits, GroupInputProps } from '../../types'\nimport { UButton } from '../button'\nimport { useGroupItems } from './use-group-items'\n\ndefineOptions({\n name: 'GroupInput'\n})\n\nconst props = withDefaults(defineProps<GroupInputProps<GroupItem>>(), {\n modelValue: () => [],\n disabled: undefined,\n readonly: undefined,\n creatable: true\n})\n\nconst emit = defineEmits<GroupInputEmits>()\n\nconst cls = bem('group-input')\n\nconst { formProps } = ~~useFormComponent~~()\nconst { disabled, size, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst { items, createItem, runByEvent } = useGroupItems({\n props,\n emit\n})\n\nconst isEmpty = computed(() => {\n return !items.value.length\n})\n\nfunction handleAdd(index: number) {\n runByEvent(() => {\n items.value = [\n ...items.value.slice(0, index + 1),\n createItem({}),\n ...items.value.slice(index + 1)\n ]\n })\n}\n\nfunction handleRemove(index: number) {\n runByEvent(() => {\n items.value = [...items.value.slice(0, index), ...items.value.slice(index + 1)]\n })\n}\n</script>\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiDA~~,MAAM,QAAQ;EAOd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,cAAa;EAE7B,MAAM,EAAE,cAAc,~~kBAAiB~~;~~EACvC~~,MAAM,EAAE,UAAU,MAAM,aAAa,qBAAqB,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE;GAClF,MAAM;GACN,UAAU;GACV,UAAU;GACX,CAAA;EAED,MAAM,EAAE,OAAO,YAAY,eAAe,cAAc;GACtD;GACA;GACD,CAAA;EAED,MAAM,UAAU,eAAe;AAC7B,UAAO,CAAC,MAAM,MAAM;IACrB;EAED,SAAS,UAAU,OAAe;AAChC,oBAAiB;AACf,UAAM,QAAQ;KACZ,GAAG,MAAM,MAAM,MAAM,GAAG,QAAQ,EAAE;KAClC,WAAW,EAAE,CAAC;KACd,GAAG,MAAM,MAAM,MAAM,QAAQ,EAAC;KAChC;KACD;;EAGH,SAAS,aAAa,OAAe;AACnC,oBAAiB;AACf,UAAM,QAAQ,CAAC,GAAG,MAAM,MAAM,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,MAAM,MAAM,QAAQ,EAAE,CAAA;KAC/E;;;~~WAxFwC~~,MAAA,SAAQ,IAAA,WAAA,EAAjD,mBAmBK,MAAA;;IAnBA,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,GAAG,MAAA,IAAG,CAAC,EAAE,MAAA,KAAI,CAAA,CAAA,CAAA;OAClB,QAAA,SAAW,QAAA,aAAA,WAAA,EAArB,mBAIK,MAAA,YAAA,CAHH,YAEW,MAAA,YAAA,EAAA;IAFD,OAAA,EAAA,SAAA,QAAmB;IAAE,MAAM,MAAA,KAAI;IAAG,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,UAAS,EAAA;IAAM,MAAM,MAAA,KAAI;;2BAE5E,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAF8E,QAE9E,GAAA,CAAA,EAAA,CAAA;;oFAEF,mBAYK,UAAA,MAAA,WAZuB,MAAA,MAAK,GAArB,MAAM,UAAK;wBAAvB,mBAYK,MAAA;KAZ+B,KAAK,KAAK;KAAK,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;KAAW,OAAK,eAAE,QAAA,UAAS;QACxF,WAA4C,KAAA,QAAA,WAA5C,WAA4C,EAAA,SAAA,MAAA,EAAA;KAAA,MAAtB,KAAK;KAAM;KAAK,CAAA,CAAA,EACtC,mBASO,QAAA,EATA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,UAAA,CAAA,EAAA,EAAA,CACjB,YAME,MAAA,YAAA,EAAA;KALC,MAAM,MAAA,MAAK;KACZ,QAAA;KACC,UAAU,MAAA,SAAQ;KAClB,MAAM,MAAA,KAAI;KACV,UAAK,WAAE,aAAa,MAAK;;;;;;QAE5B,YAA4F,MAAA,YAAA,EAAA;KAAjF,MAAM,MAAA,KAAI;KAAE,QAAA;KAAQ,UAAU,MAAA,SAAQ;KAAG,MAAM,MAAA,KAAI;KAAG,UAAK,WAAE,UAAU,MAAK;;;;;;;qBAKxE,MAAA,MAAK,EAAE,UAAA,WAAA,EAC1B,mBAIK,MAAA;;IAJA,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,GAAG,MAAA,IAAG,CAAC,EAAE,MAAA,KAAI,CAAA,CAAA,CAAA;yBAC5B,mBAEK,UAAA,MAAA,WAFc,MAAA,MAAK,GAAb,SAAI;wBAAf,mBAEK,MAAA;KAFsB,KAAK,KAAK;KAAK,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;0BACpD,mBAA2C,UAAA,MAAA,WAAzB,KAAK,OAAV,MAAC;yBAAd,mBAA2C,QAAA,MAAA,gBAAX,EAAC,EAAA,EAAA;;mCAKvC,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,MAAA,mBAAkB,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA"}
1	+ {"version":3,"file":"group-input.js","names":[],"sources":["../../../src/components/group-input/group-input.vue"],"sourcesContent":["<template>\n <ul :class=\"[cls.b, cls.m(size)]\" v-if=\"!readonly\">\n <li v-if=\"isEmpty && creatable\">\n <u-button style=\"width: 100%\" :icon=\"Plus\" @click=\"handleAdd(0)\" :size=\"size\">\n 新增\n </u-button>\n </li>\n <li v-for=\"(item, index) of items\" :key=\"item.id\" :class=\"cls.e('item')\" :style=\"itemStyle\">\n <slot v-bind=\"{ item: item.data, index }\" />\n <span :class=\"cls.e('actions')\">\n <u-button\n :icon=\"Minus\"\n circle\n :disabled=\"disabled\"\n :size=\"size\"\n @click=\"handleRemove(index)\"\n />\n <u-button :icon=\"Plus\" circle :disabled=\"disabled\" :size=\"size\" @click=\"handleAdd(index)\" />\n </span>\n </li>\n </ul>\n\n <template v-else-if=\"items?.length\">\n <ul :class=\"[cls.b, cls.m(size)]\">\n <li v-for=\"item of items\" :key=\"item.id\" :class=\"cls.e('item')\">\n <span v-for=\"v in item.data\">{{ v }}</span>\n </li>\n </ul>\n </template>\n\n <template v-else>\n {{ FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup generic=\"GroupItem extends Record<string, any>\">\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { Minus, Plus } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { GroupInputEmits, GroupInputProps } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport { UButton } from '../button'\nimport { useGroupItems } from './use-group-items'\n\ndefineOptions({\n name: 'GroupInput'\n})\n\nconst props = withDefaults(defineProps<GroupInputProps<GroupItem>>(), {\n modelValue: () => [],\n disabled: undefined,\n readonly: undefined,\n creatable: true\n})\n\nconst emit = defineEmits<GroupInputEmits>()\n\nconst cls = bem('group-input')\n\nconst { formProps } = injectFormContext()\nconst { disabled, size, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst { items, createItem, runByEvent } = useGroupItems({\n props,\n emit\n})\n\nconst isEmpty = computed(() => {\n return !items.value.length\n})\n\nfunction handleAdd(index: number) {\n runByEvent(() => {\n items.value = [\n ...items.value.slice(0, index + 1),\n createItem({}),\n ...items.value.slice(index + 1)\n ]\n })\n}\n\nfunction handleRemove(index: number) {\n runByEvent(() => {\n items.value = [...items.value.slice(0, index), ...items.value.slice(index + 1)]\n })\n}\n</script>\n"],"mappings":"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"}

package/dist/components/input/input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"input.js","names":[],"sources":["../../../src/components/input/input.vue"],"sourcesContent":["<template>\n <div\n :class=\"inputClass\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n v-if=\"!readonly\"\n >\n <span v-if=\"$slots.prefix \|\| prefix\" :class=\"prefixClass\" @click=\"handlePrefixClick\">\n {{ prefix }}\n <slot name=\"prefix\"></slot>\n </span>\n\n <input\n :class=\"cls.e('native')\"\n :placeholder=\"props.placeholder\"\n type=\"text\"\n :value=\"model\"\n @input=\"handleInput\"\n @change=\"handleChange\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n @compositionstart=\"handleCompositionStart\"\n @compositionend=\"handleCompositionEnd\"\n autocomplete=\"off\"\n ref=\"el\"\n :disabled=\"disabled\"\n :readonly=\"nativeReadonly\"\n />\n\n <span :class=\"suffixClass\" v-if=\"hasSuffix\">\n <Transition name=\"zoom-in\" mode=\"out-in\">\n <UIcon\n v-if=\"showClear\"\n :class=\"cls.e('clear')\"\n title=\"清除\"\n @click.stop=\"clearModelValue\"\n key=\"clear\"\n >\n <Close />\n </UIcon>\n\n <span v-else :class=\"cls.e('suffix-content')\" @click=\"handleSuffixClick\" key=\"suffix\">\n {{ suffix }}\n <slot name=\"suffix\"></slot>\n </span>\n </Transition>\n </span>\n </div>\n\n <template v-else>\n {{ generateModel \|\| FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"tsx\" setup>\nimport { useFocus, ~~useFormComponent,~~ useFormFallbackProps } from '@veltra/compositions'\nimport { Close } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, getCurrentInstance, ref, shallowRef, nextTick } from 'vue'\n\nimport type { InputEmits, InputProps, _InputExposed } from '../../types'\nimport { UIcon } from '../icon'\n\ndefineOptions({\n name: 'Input'\n})\n\nconst props = withDefaults(defineProps<InputProps>(), {\n placeholder: '请输入',\n clearable: true,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<InputEmits>()\n\nconst model = defineModel<string>()\n\nconst inst = getCurrentInstance()\n\nconst cls = bem('input')\n\nconst { formProps } = ~~useFormComponent~~()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst { focus, handleBlur, handleFocus } = useFocus((focused) => {\n if (focused) {\n emit('focus')\n } else {\n emit('blur')\n }\n})\n\nconst inputClass = computed(() => {\n return [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('readonly', readonly.value),\n bem.is('focus', focus.value)\n ]\n})\n\nconst prefixClass = [cls.e('prefix'), bem.is('clickable', !!inst?.vnode.props?.['onPrefix:click'])]\n\nconst suffixClass = [cls.e('suffix'), bem.is('clickable', !!inst?.vnode.props?.['onSuffix:click'])]\n\nlet isComposing = false\n\nfunction handleCompositionStart() {\n isComposing = true\n}\n\nfunction handleCompositionEnd(e: Event) {\n isComposing = false\n handleInput(e)\n}\n\nconst handleInput = (e: Event) => {\n if (isComposing) return\n\n const inputVal = (e.target as HTMLInputElement).value\n emit('native:input', e)\n\n const valid = props.pattern?.test(inputVal) ?? true\n\n if (!valid) return\n model.value = inputVal\n}\n\nconst handlePrefixClick = () => {\n emit('prefix:click', model.value)\n}\n\nconst handleSuffixClick = () => {\n emit('suffix:click', model.value)\n}\n\nconst clearModelValue = () => {\n model.value = ''\n emit('clear')\n}\n\nconst hovered = ref(false)\nconst handleMouseEnter = () => {\n hovered.value = true\n}\n\nconst handleMouseLeave = () => {\n hovered.value = false\n}\n\nconst showClear = computed(() => {\n return props.clearable && !disabled.value && !!model.value && hovered.value\n})\n\nconst hasSuffixContent = computed(() => {\n return !!inst?.slots.suffix \|\| !!props.suffix\n})\n\nconst hasSuffix = computed(() => {\n return hasSuffixContent.value \|\| showClear.value\n})\n\nconst handleChange = (e: Event) => {\n const target = e.target as HTMLInputElement\n\n const valid = props.pattern?.test(target.value) ?? true\n\n if (valid) {\n emit('change', target.value)\n } else {\n nextTick(() => {\n target.value = model.value ?? ''\n })\n }\n}\n\nconst el = shallowRef<HTMLInputElement>()\n\nconst generateModel = computed(() => {\n if (!model.value) return ''\n\n return `${props.prefix ?? ''}${model.value}${props.suffix ?? ''}`\n})\n\ndefineExpose<_InputExposed>({\n el\n})\n</script>\n"],"mappings":""}
1	+ {"version":3,"file":"input.js","names":[],"sources":["../../../src/components/input/input.vue"],"sourcesContent":["<template>\n <div\n :class=\"inputClass\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n v-if=\"!readonly\"\n >\n <span v-if=\"$slots.prefix \|\| prefix\" :class=\"prefixClass\" @click=\"handlePrefixClick\">\n {{ prefix }}\n <slot name=\"prefix\"></slot>\n </span>\n\n <input\n :class=\"cls.e('native')\"\n :placeholder=\"props.placeholder\"\n type=\"text\"\n :value=\"model\"\n @input=\"handleInput\"\n @change=\"handleChange\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n @compositionstart=\"handleCompositionStart\"\n @compositionend=\"handleCompositionEnd\"\n autocomplete=\"off\"\n ref=\"el\"\n :disabled=\"disabled\"\n :readonly=\"nativeReadonly\"\n />\n\n <span :class=\"suffixClass\" v-if=\"hasSuffix\">\n <Transition name=\"zoom-in\" mode=\"out-in\">\n <UIcon\n v-if=\"showClear\"\n :class=\"cls.e('clear')\"\n title=\"清除\"\n @click.stop=\"clearModelValue\"\n key=\"clear\"\n >\n <Close />\n </UIcon>\n\n <span v-else :class=\"cls.e('suffix-content')\" @click=\"handleSuffixClick\" key=\"suffix\">\n {{ suffix }}\n <slot name=\"suffix\"></slot>\n </span>\n </Transition>\n </span>\n </div>\n\n <template v-else>\n {{ generateModel \|\| FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"tsx\" setup>\nimport { useFocus, useFormFallbackProps } from '@veltra/compositions'\nimport { Close } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, getCurrentInstance, ref, shallowRef, nextTick } from 'vue'\n\nimport type { InputEmits, InputProps, _InputExposed } from '../../types'\nimport { injectFormContext } from '../../utils/form-context'\nimport { UIcon } from '../icon'\n\ndefineOptions({\n name: 'Input'\n})\n\nconst props = withDefaults(defineProps<InputProps>(), {\n placeholder: '请输入',\n clearable: true,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<InputEmits>()\n\nconst model = defineModel<string>()\n\nconst inst = getCurrentInstance()\n\nconst cls = bem('input')\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst { focus, handleBlur, handleFocus } = useFocus((focused) => {\n if (focused) {\n emit('focus')\n } else {\n emit('blur')\n }\n})\n\nconst inputClass = computed(() => {\n return [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('readonly', readonly.value),\n bem.is('focus', focus.value)\n ]\n})\n\nconst prefixClass = [cls.e('prefix'), bem.is('clickable', !!inst?.vnode.props?.['onPrefix:click'])]\n\nconst suffixClass = [cls.e('suffix'), bem.is('clickable', !!inst?.vnode.props?.['onSuffix:click'])]\n\nlet isComposing = false\n\nfunction handleCompositionStart() {\n isComposing = true\n}\n\nfunction handleCompositionEnd(e: Event) {\n isComposing = false\n handleInput(e)\n}\n\nconst handleInput = (e: Event) => {\n if (isComposing) return\n\n const inputVal = (e.target as HTMLInputElement).value\n emit('native:input', e)\n\n const valid = props.pattern?.test(inputVal) ?? true\n\n if (!valid) return\n model.value = inputVal\n}\n\nconst handlePrefixClick = () => {\n emit('prefix:click', model.value)\n}\n\nconst handleSuffixClick = () => {\n emit('suffix:click', model.value)\n}\n\nconst clearModelValue = () => {\n model.value = ''\n emit('clear')\n}\n\nconst hovered = ref(false)\nconst handleMouseEnter = () => {\n hovered.value = true\n}\n\nconst handleMouseLeave = () => {\n hovered.value = false\n}\n\nconst showClear = computed(() => {\n return props.clearable && !disabled.value && !!model.value && hovered.value\n})\n\nconst hasSuffixContent = computed(() => {\n return !!inst?.slots.suffix \|\| !!props.suffix\n})\n\nconst hasSuffix = computed(() => {\n return hasSuffixContent.value \|\| showClear.value\n})\n\nconst handleChange = (e: Event) => {\n const target = e.target as HTMLInputElement\n\n const valid = props.pattern?.test(target.value) ?? true\n\n if (valid) {\n emit('change', target.value)\n } else {\n nextTick(() => {\n target.value = model.value ?? ''\n })\n }\n}\n\nconst el = shallowRef<HTMLInputElement>()\n\nconst generateModel = computed(() => {\n if (!model.value) return ''\n\n return `${props.prefix ?? ''}${model.value}${props.suffix ?? ''}`\n})\n\ndefineExpose<_InputExposed>({\n el\n})\n</script>\n"],"mappings":""}