npm - ll-plus - Versions diffs - 2.6.17 → 2.6.18 - Mend

ll-plus 2.6.17 → 2.6.18

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 (118) hide show

package/es/packages/components/form/src/components/form-component.vue2.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, unref, openBlock, createBlock, resolveDynamicComponent, mergeProps } from 'vue';
+import { defineComponent, reactive, ref, nextTick, unref, openBlock, createBlock, resolveDynamicComponent, mergeProps } from 'vue';
 import { omit, has } from 'lodash-es';
 import '../config/index.mjs';
 import { formComponentProps, formComponentEmits } from '../config/form-component.mjs';
@@ -9,10 +9,11 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "form-component",
   props: formComponentProps,
   emits: formComponentEmits,
-  setup(__props, { emit: __emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emits = __emit;
     const formData = reactive(props.formData);
+    const componentRef = ref();
     const getBindValue = (item) => {
       const obj = { ...item };
       return omit(obj, ["label", "onChange", "change"]);
@@ -27,13 +28,29 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
       emits("changeField", item);
     };
+    const focus = async () => {
+      await nextTick();
+      console.log(componentRef.value);
+      componentRef.value?.focus();
+    };
+    const getItem = () => {
+      return props.item;
+    };
+    __expose({
+      focus,
+      getItem
+    });
     return (_ctx, _cache) => {
       return unref(checkedType).includes(_ctx.item.type) ? (openBlock(), createBlock(resolveDynamicComponent(`ll-${_ctx.item.type}`), mergeProps({
         key: 0,
+        ref_key: "componentRef",
+        ref: componentRef,
         checked: formData[_ctx.item.key],
         "onUpdate:checked": _cache[0] || (_cache[0] = ($event) => formData[_ctx.item.key] = $event)
       }, getBindValue(_ctx.item), { onChange: handleChange }), null, 16, ["checked"])) : (openBlock(), createBlock(resolveDynamicComponent(`ll-${_ctx.item.type}`), mergeProps({
         key: 1,
+        ref_key: "componentRef",
+        ref: componentRef,
         value: formData[_ctx.item.key],
         "onUpdate:value": _cache[1] || (_cache[1] = ($event) => formData[_ctx.item.key] = $event)
       }, getBindValue(_ctx.item), { onChange: handleChange }), null, 16, ["value"]));

package/es/packages/components/form/src/components/form-component.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-component.vue2.mjs","sources":["../../../../../../../packages/components/form/src/components/form-component.vue"],"sourcesContent":["<template>\n <template v-if=\"checkedType.includes(item.type)\">\n <component\n :is=\"`ll-${item.type}`\"\n v-model:checked=\"formData[item.key]\"\n v-bind=\"getBindValue(item)\"\n @change=\"handleChange\"\n />\n </template>\n <template v-else>\n <component\n :is=\"`ll-${item.type}`\"\n v-model:value=\"formData[item.key]\"\n v-bind=\"getBindValue(item)\"\n @change=\"handleChange\"\n />\n </template>\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive } from 'vue'\nimport { omit, has } from 'lodash-es'\nimport {\n formComponentProps,\n formComponentEmits,\n checkedType,\n type FormColumn\n} from '../config'\n\nconst props = defineProps(formComponentProps)\n\nconst emits = defineEmits(formComponentEmits)\n\nconst formData = reactive(props.formData)\n\nconst getBindValue = (item: FormColumn) => {\n const obj = { ...item }\n return omit(obj, ['label', 'onChange', 'change'])\n}\n\nconst handleChange = (...arg) => {\n const item: FormColumn = props.item\n if (has(item, 'change')) {\n item.change(...arg)\n }\n if (has(item, 'onChange')) {\n item.onChange(...arg)\n }\n emits('changeField', item)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;~~AA6BA~~,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAEd,IAAM,MAAA,QAAA,GAAW,QAAS,CAAA,KAAA,CAAM,QAAQ,CAAA,CAAA;AAExC,IAAM,MAAA,YAAA,GAAe,CAAC,IAAqB,KAAA;AACzC,MAAM,MAAA,GAAA,GAAM,EAAE,GAAG,IAAK,EAAA,CAAA;AACtB,MAAA,OAAO,KAAK,GAAK,EAAA,CAAC,OAAS,EAAA,UAAA,EAAY,QAAQ,CAAC,CAAA,CAAA;AAAA,KAClD,CAAA;AAEA,IAAM,MAAA,YAAA,GAAe,IAAI,GAAQ,KAAA;AAC/B,MAAA,MAAM,OAAmB,KAAM,CAAA,IAAA,CAAA;AAC/B,MAAI,IAAA,GAAA,CAAI,IAAM,EAAA,QAAQ,CAAG,EAAA;AACvB,QAAK,IAAA,CAAA,MAAA,CAAO,GAAG,GAAG,CAAA,CAAA;AAAA,OACpB;AACA,MAAI,IAAA,GAAA,CAAI,IAAM,EAAA,UAAU,CAAG,EAAA;AACzB,QAAK,IAAA,CAAA,QAAA,CAAS,GAAG,GAAG,CAAA,CAAA;AAAA,OACtB;AACA,MAAA,KAAA,CAAM,eAAe,IAAI,CAAA,CAAA;AAAA,KAC3B,CAAA~~;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"form-component.vue2.mjs","sources":["../../../../../../../packages/components/form/src/components/form-component.vue"],"sourcesContent":["<template>\n <template v-if=\"checkedType.includes(item.type)\">\n <component\n :is=\"`ll-${item.type}`\"\n ref=\"componentRef\"\n v-model:checked=\"formData[item.key]\"\n v-bind=\"getBindValue(item)\"\n @change=\"handleChange\"\n />\n </template>\n <template v-else>\n <component\n :is=\"`ll-${item.type}`\"\n ref=\"componentRef\"\n v-model:value=\"formData[item.key]\"\n v-bind=\"getBindValue(item)\"\n @change=\"handleChange\"\n />\n </template>\n</template>\n\n<script setup lang=\"ts\">\nimport { nextTick, reactive, ref } from 'vue'\nimport { omit, has } from 'lodash-es'\nimport {\n formComponentProps,\n formComponentEmits,\n checkedType,\n type FormColumn\n} from '../config'\n\nconst props = defineProps(formComponentProps)\n\nconst emits = defineEmits(formComponentEmits)\n\nconst formData = reactive(props.formData)\n\nconst componentRef = ref()\n\nconst getBindValue = (item: FormColumn) => {\n const obj = { ...item }\n return omit(obj, ['label', 'onChange', 'change'])\n}\n\nconst handleChange = (...arg) => {\n const item: FormColumn = props.item\n if (has(item, 'change')) {\n item.change(...arg)\n }\n if (has(item, 'onChange')) {\n item.onChange(...arg)\n }\n emits('changeField', item)\n}\n// 获取焦点\nconst focus = async () => {\n await nextTick()\n console.log(componentRef.value)\n componentRef.value?.focus()\n}\n\nconst getItem = () => {\n return props.item\n}\ndefineExpose({\n focus,\n getItem\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;AA+BA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAEd,IAAM,MAAA,QAAA,GAAW,QAAS,CAAA,KAAA,CAAM,QAAQ,CAAA,CAAA;AAExC,IAAA,MAAM,eAAe,GAAI,EAAA,CAAA;AAEzB,IAAM,MAAA,YAAA,GAAe,CAAC,IAAqB,KAAA;AACzC,MAAM,MAAA,GAAA,GAAM,EAAE,GAAG,IAAK,EAAA,CAAA;AACtB,MAAA,OAAO,KAAK,GAAK,EAAA,CAAC,OAAS,EAAA,UAAA,EAAY,QAAQ,CAAC,CAAA,CAAA;AAAA,KAClD,CAAA;AAEA,IAAM,MAAA,YAAA,GAAe,IAAI,GAAQ,KAAA;AAC/B,MAAA,MAAM,OAAmB,KAAM,CAAA,IAAA,CAAA;AAC/B,MAAI,IAAA,GAAA,CAAI,IAAM,EAAA,QAAQ,CAAG,EAAA;AACvB,QAAK,IAAA,CAAA,MAAA,CAAO,GAAG,GAAG,CAAA,CAAA;AAAA,OACpB;AACA,MAAI,IAAA,GAAA,CAAI,IAAM,EAAA,UAAU,CAAG,EAAA;AACzB,QAAK,IAAA,CAAA,QAAA,CAAS,GAAG,GAAG,CAAA,CAAA;AAAA,OACtB;AACA,MAAA,KAAA,CAAM,eAAe,IAAI,CAAA,CAAA;AAAA,KAC3B,CAAA;AAEA,IAAA,MAAM,QAAQ,YAAY;AACxB,MAAA,MAAM,QAAS,EAAA,CAAA;AACf,MAAQ,OAAA,CAAA,GAAA,CAAI,aAAa,KAAK,CAAA,CAAA;AAC9B,MAAA,YAAA,CAAa,OAAO,KAAM,EAAA,CAAA;AAAA,KAC5B,CAAA;AAEA,IAAA,MAAM,UAAU,MAAM;AACpB,MAAA,OAAO,KAAM,CAAA,IAAA,CAAA;AAAA,KACf,CAAA;AACA,IAAa,QAAA,CAAA;AAAA,MACX,KAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;"}

package/es/packages/components/form/src/config/form.mjs CHANGED Viewed

@@ -41,6 +41,27 @@ const formProps = buildProps({
   loading: {
     type: Boolean,
     default: false
+  },
+  /**
+   * @description 自动聚焦
+   */
+  autoFocus: {
+    type: Boolean,
+    default: false
+  },
+  /**
+   * @description 是否全体禁用
+   */
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  /**
+   * @description 当某一规则校验不通过时，是否停止剩下的规则的校验
+   */
+  validateErrorStop: {
+    type: Boolean,
+    default: false
   }
 });
 const formEmits = {

package/es/packages/components/form/src/config/form.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.mjs","sources":["../../../../../../../packages/components/form/src/config/form.ts"],"sourcesContent":["import { buildProps, definePropType } from '@ll-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type {\n FormItemProps,\n RowProps,\n ColProps,\n FormProps as AntFormProps\n} from 'ant-design-vue'\nimport type { TooltipProps } from '@ll-plus/components'\nimport type Form from '../form.vue'\n\ntype FormType<T = any> = (\n \| 'input'\n \| 'input-number'\n \| 'cascader'\n \| 'checkbox'\n \| 'checkbox-group'\n \| 'code-editor'\n \| 'date-picker'\n \| 'time-picker'\n \| 'date-range'\n \| 'time-range'\n \| 'radio'\n \| 'radio-group'\n \| 'select'\n \| 'switch'\n \| 'textarea'\n \| 'upload-image'\n) &\n T\n\nexport interface FormChangeEvent {\n item: FormColumn\n value: any\n formData: FormData\n}\nexport interface BasicFormColumn extends FormItemProps {\n label?: string\n key: string\n spanCol?: number \| 24 // 一行几条\n colOptions?: ColProps\n tip?: string\n tipConfig?: TooltipProps\n type: FormType\n unit?: string\n change?: () => void\n rowOptions?: RowProps\n children?: FormColumn[]\n [key: string]: any\n}\n\nexport type FormColumn<T = any> = BasicFormColumn & T\n\nexport type FormData = Record<string, any>\n\nexport const formProps = buildProps({\n /*\n @description 表单项列表\n /\n formColumns: {\n type: definePropType<FormColumn[]>(Array),\n default: () => []\n },\n /\n @description 展开的行变化时触发\n /\n formOptions: {\n type: definePropType<AntFormProps>(Object),\n default: () => ({\n layout: 'horizontal'\n })\n },\n /\n @description 展开的行变化时触发\n /\n formData: {\n type: definePropType<FormData>(Object),\n default: () => ({})\n },\n /\n @description 展开的行变化时触发\n /\n rowOptions: {\n type: definePropType<RowProps>(Object),\n default: () => ({\n gutter: 16\n })\n },\n /\n @description 表单加载状态\n /\n loading: {\n type: Boolean,\n default: false\n }\n} as const)\n\nexport const formEmits = {\n /\n @description 表单项值改变时触发\n */\n change: (params: FormChangeEvent) => !!params\n}\n\n// props\nexport type FormProps = ExtractPropTypes<typeof formProps>\n\n// emits\nexport type FormEmits = typeof formEmits\n\n// instance\nexport type FormInstance = InstanceType<typeof Form>\n"],"names":[],"mappings":";;;;AAwDO,MAAM,YAAY,UAAW,CAAA;AAAA;AAAA;AAAA;AAAA,EAIlC,WAAa,EAAA;AAAA,IACX,IAAA,EAAM,eAA6B,KAAK,CAAA;AAAA,IACxC,OAAA,EAAS,MAAM,EAAC;AAAA,GAClB;AAAA;AAAA;AAAA;AAAA,EAIA,WAAa,EAAA;AAAA,IACX,IAAA,EAAM,eAA6B,MAAM,CAAA;AAAA,IACzC,SAAS,OAAO;AAAA,MACd,MAAQ,EAAA,YAAA;AAAA,KACV,CAAA;AAAA,GACF;AAAA;AAAA;AAAA;AAAA,EAIA,QAAU,EAAA;AAAA,IACR,IAAA,EAAM,eAAyB,MAAM,CAAA;AAAA,IACrC,OAAA,EAAS,OAAO,EAAC,CAAA;AAAA,GACnB;AAAA;AAAA;AAAA;AAAA,EAIA,UAAY,EAAA;AAAA,IACV,IAAA,EAAM,eAAyB,MAAM,CAAA;AAAA,IACrC,SAAS,OAAO;AAAA,MACd,MAAQ,EAAA,EAAA;AAAA,KACV,CAAA;AAAA,GACF;AAAA;AAAA;AAAA;AAAA,EAIA,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AACF,CAAU,EAAA;AAEH,MAAM,SAAY,GAAA;AAAA;AAAA;AAAA;AAAA,EAIvB,MAAQ,EAAA,CAAC,MAA4B,KAAA,CAAC,CAAC,MAAA;AACzC;;;;"}
1	+ {"version":3,"file":"form.mjs","sources":["../../../../../../../packages/components/form/src/config/form.ts"],"sourcesContent":["import { buildProps, definePropType } from '@ll-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type {\n FormItemProps,\n RowProps,\n ColProps,\n FormProps as AntFormProps\n} from 'ant-design-vue'\nimport type { TooltipProps } from '@ll-plus/components'\nimport type Form from '../form.vue'\n\ntype FormType<T = any> = (\n \| 'input'\n \| 'input-number'\n \| 'cascader'\n \| 'checkbox'\n \| 'checkbox-group'\n \| 'code-editor'\n \| 'date-picker'\n \| 'time-picker'\n \| 'date-range'\n \| 'time-range'\n \| 'radio'\n \| 'radio-group'\n \| 'select'\n \| 'switch'\n \| 'textarea'\n \| 'upload-image'\n) &\n T\n\nexport interface FormChangeEvent {\n item: FormColumn\n value: any\n formData: FormData\n}\nexport interface BasicFormColumn extends FormItemProps {\n label?: string\n key: string\n spanCol?: number \| 24 // 一行几条\n colOptions?: ColProps\n tip?: string\n tipConfig?: TooltipProps\n type: FormType\n unit?: string\n change?: () => void\n rowOptions?: RowProps\n children?: FormColumn[]\n [key: string]: any\n}\n\nexport type FormColumn<T = any> = BasicFormColumn & T\n\nexport type FormData = Record<string, any>\n\nexport const formProps = buildProps({\n /*\n @description 表单项列表\n /\n formColumns: {\n type: definePropType<FormColumn[]>(Array),\n default: () => []\n },\n /\n @description 展开的行变化时触发\n /\n formOptions: {\n type: definePropType<AntFormProps>(Object),\n default: () => ({\n layout: 'horizontal'\n })\n },\n /\n @description 展开的行变化时触发\n /\n formData: {\n type: definePropType<FormData>(Object),\n default: () => ({})\n },\n /\n @description 展开的行变化时触发\n /\n rowOptions: {\n type: definePropType<RowProps>(Object),\n default: () => ({\n gutter: 16\n })\n },\n /\n @description 表单加载状态\n /\n loading: {\n type: Boolean,\n default: false\n },\n /\n @description 自动聚焦\n /\n autoFocus: {\n type: Boolean,\n default: false\n },\n /\n @description 是否全体禁用\n /\n disabled: {\n type: Boolean,\n default: false\n },\n /\n @description 当某一规则校验不通过时，是否停止剩下的规则的校验\n /\n validateErrorStop: {\n type: Boolean,\n default: false\n }\n} as const)\n\nexport const formEmits = {\n /\n @description 表单项值改变时触发\n */\n change: (params: FormChangeEvent) => !!params\n}\n\n// props\nexport type FormProps = ExtractPropTypes<typeof formProps>\n\n// emits\nexport type FormEmits = typeof formEmits\n\n// instance\nexport type FormInstance = InstanceType<typeof Form>\n"],"names":[],"mappings":";;;;AAwDO,MAAM,YAAY,UAAW,CAAA;AAAA;AAAA;AAAA;AAAA,EAIlC,WAAa,EAAA;AAAA,IACX,IAAA,EAAM,eAA6B,KAAK,CAAA;AAAA,IACxC,OAAA,EAAS,MAAM,EAAC;AAAA,GAClB;AAAA;AAAA;AAAA;AAAA,EAIA,WAAa,EAAA;AAAA,IACX,IAAA,EAAM,eAA6B,MAAM,CAAA;AAAA,IACzC,SAAS,OAAO;AAAA,MACd,MAAQ,EAAA,YAAA;AAAA,KACV,CAAA;AAAA,GACF;AAAA;AAAA;AAAA;AAAA,EAIA,QAAU,EAAA;AAAA,IACR,IAAA,EAAM,eAAyB,MAAM,CAAA;AAAA,IACrC,OAAA,EAAS,OAAO,EAAC,CAAA;AAAA,GACnB;AAAA;AAAA;AAAA;AAAA,EAIA,UAAY,EAAA;AAAA,IACV,IAAA,EAAM,eAAyB,MAAM,CAAA;AAAA,IACrC,SAAS,OAAO;AAAA,MACd,MAAQ,EAAA,EAAA;AAAA,KACV,CAAA;AAAA,GACF;AAAA;AAAA;AAAA;AAAA,EAIA,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,SAAW,EAAA;AAAA,IACT,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,iBAAmB,EAAA;AAAA,IACjB,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AACF,CAAU,EAAA;AAEH,MAAM,SAAY,GAAA;AAAA;AAAA;AAAA;AAAA,EAIvB,MAAQ,EAAA,CAAC,MAA4B,KAAA,CAAC,CAAC,MAAA;AACzC;;;;"}

package/es/packages/components/form/src/form.vue2.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
-import { defineComponent, reactive, ref, watch, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, withCtx, mergeProps, normalizeProps, guardReactiveProps, Fragment, renderList, createBlock, renderSlot, createElementVNode, toDisplayString, createCommentVNode } from 'vue';
-import { omit, isEmpty } from 'lodash-es';
+import { defineComponent, reactive, ref, computed, watch, onMounted, nextTick, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, withCtx, mergeProps, normalizeProps, guardReactiveProps, Fragment, renderList, createBlock, renderSlot, createElementVNode, toDisplayString, createCommentVNode } from 'vue';
+import { has, omit, isEmpty } from 'lodash-es';
 import './config/index.mjs';
 import '../../../utils/index.mjs';
 import FormComponent from './components/form-component.vue.mjs';
@@ -18,9 +18,46 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     const bem = createNamespace("form");
     const formData = reactive(props.formData);
     const formRef = ref();
+    const formComponents = ref([]);
+    const computedFormColumns = computed(() => {
+      return props.formColumns.map((e) => {
+        e.disabled = has(e, "disabled") ? e.disabled : props.disabled;
+        if (e.children && e.children.length) {
+          e.children.map((a) => {
+            a.disabled = has(a, "disabled") ? a.disabled : props.disabled;
+            return a;
+          });
+        }
+        return e;
+      });
+    });
+    const validateFields = computed(() => {
+      return props.formColumns.filter((e) => e.required || has(e, "rules") && e.rules.length > 0).map((e) => {
+        return e.key;
+      });
+    });
+    const computedFormOptions = computed(() => {
+      return {
+        scrollToFirstError: !props.validateErrorStop,
+        ...props.formOptions
+      };
+    });
     const id = ref(`ll-form-${+/* @__PURE__ */ new Date()}`);
     const validate = async () => {
-      return await formRef.value.validateFields();
+      if (props.validateErrorStop) {
+        clearValidate();
+        let bool = true;
+        if (!validateFields.value.length)
+          return bool;
+        for (const i of validateFields.value) {
+          bool = await formRef.value.validateFields([i]);
+          if (!bool) {
+            return bool;
+          }
+        }
+      } else {
+        return await formRef.value.validateFields();
+      }
     };
     const resetFields = async () => {
       return await formRef.value.resetFields();
@@ -60,6 +97,18 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         immediate: true
       }
     );
+    onMounted(async () => {
+      await nextTick();
+      if (props.autoFocus) {
+        for (const element of formComponents.value) {
+          const item = element?.getItem();
+          if (["input", "textarea", "input-number"].includes(item.type)) {
+            element?.focus();
+            break;
+          }
+        }
+      }
+    });
     __expose({
       validate,
       resetFields,
@@ -83,7 +132,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             spinning: props.loading
           }, {
             default: withCtx(() => [
-              createVNode(_component_a_form, mergeProps(props.formOptions, {
+              createVNode(_component_a_form, mergeProps(computedFormOptions.value, {
                 id: id.value,
                 ref_key: "formRef",
                 ref: formRef,
@@ -98,7 +147,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                         (openBlock(true), createElementBlock(
                           Fragment,
                           null,
-                          renderList(props.formColumns, (item, index) => {
+                          renderList(computedFormColumns.value, (item, index) => {
                             return openBlock(), createBlock(_component_a_col, mergeProps({
                               key: index,
                               ref_for: true
@@ -209,6 +258,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                                           /* FULL_PROPS, DYNAMIC_SLOTS */
                                         )) : (openBlock(), createBlock(FormComponent, {
                                           key: 1,
+                                          ref_for: true,
+                                          ref: (el) => formComponents.value[index] = el,
                                           item,
                                           "form-data": formData,
                                           onChangeField: handleChangeField

package/es/packages/components/form/src/form.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.vue2.mjs","sources":["../../../../../../packages/components/form/src/form.vue"],"sourcesContent":["<template>\n <div :class=\"bem.b()\">\n <a-spin :spinning=\"props.loading\">\n <a-form\n v-bind=\"props.formOptions\"\n :id=\"id\"\n ref=\"formRef\"\n :model=\"props.formData\"\n >\n <a-row v-bind=\"props.rowOptions\">\n <a-col\n v-for=\"(item, index) in props.formColumns\"\n :key=\"index\"\n v-bind=\"item?.colOptions ?? {}\"\n :span=\"item?.spanCol ?? 24\"\n >\n <slot name=\"formItem\" :item=\"item\" :index=\"index\">\n <ll-form-item\n :name=\"item?.key ?? index\"\n :class=\"getFormItemClass(item)\"\n v-bind=\"getBindValue(item)\"\n >\n <template #label>\n <slot name=\"label\" :item=\"item\" :index=\"index\">\n <span>{{ item.label }}</span>\n <span v-if=\"item?.tip\" :class=\"bem.e('tooltip-wrapper')\">\n <ll-tooltip\n style=\"margin-left: 8px\"\n :overlay-class-name=\"bem.e('tooltip')\"\n :arrow-point-at-center=\"true\"\n :max-width=\"item?.tipConfig?.maxWidth ?? 406\"\n :placement=\"item?.tipConfig?.placement ?? 'top'\"\n :tip=\"item.tip\"\n :font-size=\"'16px'\"\n v-bind=\"item?.tipConfig\"\n />\n </span>\n </slot>\n </template>\n <slot name=\"content\" :item=\"item\" :index=\"index\">\n <template v-if=\"!isEmpty(item.children)\">\n <a-row :gutter=\"5\" v-bind=\"item.rowOptions\">\n <a-col\n v-for=\"(child, childIndex) in item.children\"\n :key=\"childIndex\"\n :style=\"{\n display: 'flex',\n 'align-items': 'center'\n }\"\n v-bind=\"item?.colOptions ?? {}\"\n >\n <slot name=\"children\" :item=\"child\" :index=\"index\">\n <form-component\n :item=\"child\"\n :form-data=\"formData\"\n @change-field=\"handleChangeField\"\n />\n </slot>\n </a-col>\n </a-row>\n </template>\n <form-component\n v-else\n :item=\"item\"\n :form-data=\"formData\"\n @change-field=\"handleChangeField\"\n />\n </slot>\n </ll-form-item>\n </slot>\n </a-col>\n </a-row>\n </a-form>\n </a-spin>\n </div>\n</template>\n<script setup lang=\"ts\">\nimport { reactive, ref, watch } from 'vue'\nimport { omit, isEmpty } from 'lodash-es'\nimport { formProps, formEmits, type FormColumn } from './config'\n\nimport type { NamePath } from 'ant-design-vue/es/form/interface'\n\nimport { createNamespace } from '@ll-plus/utils'\n\nimport formComponent from './components/form-component.vue'\n\n// 定义组件名称\ndefineOptions({ name: 'LlForm' })\n\n// Props\nconst props = defineProps(formProps)\n\nconst emits = defineEmits(formEmits)\n\nconst bem = createNamespace('form')\n\nconst formData = reactive(props.formData)\n\nconst formRef = ref()\n\nconst id = ref(`ll-form-${+new Date()}`)\n\nconst validate = async () => {\n return await formRef.value.validateFields()\n}\n\nconst resetFields = async () => {\n return await formRef.value.resetFields()\n}\n\nconst clearValidate = async (nameList?: NamePath[]) => {\n return await formRef.value.clearValidate(nameList)\n}\n\nconst scrollToField = async (name: NamePath, options?: ScrollOptions) => {\n return await formRef.value.scrollToField(name, options)\n}\n\nconst getBindValue = (item: FormColumn) => {\n const obj = { ...item }\n return omit(obj, ['label'])\n}\n\nconst getFormItemClass = (item = {} as FormColumn) => {\n if (props.formOptions.layout === 'horizontal') {\n if (item?.labelCol) {\n return item.labelCol.span && item.labelCol.span >= 24\n ? bem.is('label-top')\n : bem.is('label-left')\n } else {\n return bem.is('label-left')\n }\n }\n return bem.is('label-top')\n}\n\nconst handleChangeField = (item: FormColumn) => {\n emits('change', { item, value: formData[item.key], formData })\n}\n\n// watch(\n// () => formData,\n// val => {\n// emits('change', val)\n// },\n// {\n// deep: true\n// }\n// )\n\nwatch(\n () => props.formData,\n async val => {\n for (const i in val) {\n formData[i] = val[i]\n }\n },\n {\n deep: true,\n immediate: true\n }\n)\n\ndefineExpose({\n validate,\n resetFields,\n clearValidate,\n scrollToField\n})\n</script>\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"form.vue2.mjs","sources":["../../../../../../packages/components/form/src/form.vue"],"sourcesContent":["<template>\n <div :class=\"bem.b()\">\n <a-spin :spinning=\"props.loading\">\n <a-form\n v-bind=\"computedFormOptions\"\n :id=\"id\"\n ref=\"formRef\"\n :model=\"props.formData\"\n >\n <a-row v-bind=\"props.rowOptions\">\n <a-col\n v-for=\"(item, index) in computedFormColumns\"\n :key=\"index\"\n v-bind=\"item?.colOptions ?? {}\"\n :span=\"item?.spanCol ?? 24\"\n >\n <slot name=\"formItem\" :item=\"item\" :index=\"index\">\n <ll-form-item\n :name=\"item?.key ?? index\"\n :class=\"getFormItemClass(item)\"\n v-bind=\"getBindValue(item)\"\n >\n <template #label>\n <slot name=\"label\" :item=\"item\" :index=\"index\">\n <span>{{ item.label }}</span>\n <span v-if=\"item?.tip\" :class=\"bem.e('tooltip-wrapper')\">\n <ll-tooltip\n style=\"margin-left: 8px\"\n :overlay-class-name=\"bem.e('tooltip')\"\n :arrow-point-at-center=\"true\"\n :max-width=\"item?.tipConfig?.maxWidth ?? 406\"\n :placement=\"item?.tipConfig?.placement ?? 'top'\"\n :tip=\"item.tip\"\n :font-size=\"'16px'\"\n v-bind=\"item?.tipConfig\"\n />\n </span>\n </slot>\n </template>\n <slot name=\"content\" :item=\"item\" :index=\"index\">\n <template v-if=\"!isEmpty(item.children)\">\n <a-row :gutter=\"5\" v-bind=\"item.rowOptions\">\n <a-col\n v-for=\"(child, childIndex) in item.children\"\n :key=\"childIndex\"\n :style=\"{\n display: 'flex',\n 'align-items': 'center'\n }\"\n v-bind=\"item?.colOptions ?? {}\"\n >\n <slot name=\"children\" :item=\"child\" :index=\"index\">\n <form-component\n :item=\"child\"\n :form-data=\"formData\"\n @change-field=\"handleChangeField\"\n />\n </slot>\n </a-col>\n </a-row>\n </template>\n <form-component\n v-else\n :ref=\"el => (formComponents[index] = el)\"\n :item=\"item\"\n :form-data=\"formData\"\n @change-field=\"handleChangeField\"\n />\n </slot>\n </ll-form-item>\n </slot>\n </a-col>\n </a-row>\n </a-form>\n </a-spin>\n </div>\n</template>\n<script setup lang=\"ts\">\nimport { reactive, ref, watch, onMounted, nextTick, computed } from 'vue'\nimport { omit, isEmpty, has } from 'lodash-es'\nimport { formProps, formEmits, type FormColumn } from './config'\n\nimport type { NamePath } from 'ant-design-vue/es/form/interface'\n\nimport { createNamespace } from '@ll-plus/utils'\n\nimport formComponent from './components/form-component.vue'\n\n// 定义组件名称\ndefineOptions({ name: 'LlForm' })\n\n// Props\nconst props = defineProps(formProps)\n\nconst emits = defineEmits(formEmits)\n\nconst bem = createNamespace('form')\n\nconst formData = reactive(props.formData)\n\nconst formRef = ref()\n\nconst formComponents = ref<InstanceType<typeof formComponent>[]>([])\n\nconst computedFormColumns = computed(() => {\n return props.formColumns.map(e => {\n e.disabled = has(e, 'disabled') ? e.disabled : props.disabled\n if (e.children && e.children.length) {\n e.children.map(a => {\n a.disabled = has(a, 'disabled') ? a.disabled : props.disabled\n return a\n })\n }\n return e\n })\n})\n\nconst validateFields = computed(() => {\n return props.formColumns\n .filter(e => e.required \|\| (has(e, 'rules') && e.rules.length > 0))\n .map(e => {\n return e.key\n })\n})\n\nconst computedFormOptions = computed(() => {\n return {\n scrollToFirstError: !props.validateErrorStop,\n ...props.formOptions\n }\n})\n\nconst id = ref(`ll-form-${+new Date()}`)\n\nconst validate = async () => {\n if (props.validateErrorStop) {\n clearValidate()\n let bool = true\n if (!validateFields.value.length) return bool\n for (const i of validateFields.value) {\n bool = await formRef.value.validateFields([i])\n if (!bool) {\n return bool\n }\n }\n } else {\n return await formRef.value.validateFields()\n }\n}\n\nconst resetFields = async () => {\n return await formRef.value.resetFields()\n}\n\nconst clearValidate = async (nameList?: NamePath[]) => {\n return await formRef.value.clearValidate(nameList)\n}\n\nconst scrollToField = async (name: NamePath, options?: ScrollOptions) => {\n return await formRef.value.scrollToField(name, options)\n}\n\nconst getBindValue = (item: FormColumn) => {\n const obj = { ...item }\n return omit(obj, ['label'])\n}\n\nconst getFormItemClass = (item = {} as FormColumn) => {\n if (props.formOptions.layout === 'horizontal') {\n if (item?.labelCol) {\n return item.labelCol.span && item.labelCol.span >= 24\n ? bem.is('label-top')\n : bem.is('label-left')\n } else {\n return bem.is('label-left')\n }\n }\n return bem.is('label-top')\n}\n\nconst handleChangeField = (item: FormColumn) => {\n emits('change', { item, value: formData[item.key], formData })\n}\n\nwatch(\n () => props.formData,\n async val => {\n for (const i in val) {\n formData[i] = val[i]\n }\n },\n {\n deep: true,\n immediate: true\n }\n)\n\nonMounted(async () => {\n await nextTick()\n if (props.autoFocus) {\n for (const element of formComponents.value) {\n const item = element?.getItem()\n if (['input', 'textarea', 'input-number'].includes(item.type)) {\n element?.focus()\n break\n }\n }\n }\n})\n\ndefineExpose({\n validate,\n resetFields,\n clearValidate,\n scrollToField\n})\n</script>\n"],"names":[],"mappings":"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"}

package/es/packages/components/icon-picker/src/components/modal.vue2.mjs CHANGED Viewed

@@ -1,7 +1,9 @@
-import { defineComponent, ref, watch, resolveComponent, openBlock, createBlock, normalizeClass, unref, withCtx, createElementVNode, createVNode, createElementBlock, Fragment, renderList } from 'vue';
+import { defineComponent, ref, computed, watch, watchEffect, resolveComponent, openBlock, createBlock, normalizeClass, unref, withCtx, createElementVNode, createVNode, createElementBlock, Fragment, renderList } from 'vue';
 import '../../../../utils/index.mjs';
 import '../config/index.mjs';
+import '../../../../hooks/index.mjs';
 import { iconPickerModalProps, iconPickerModalEmits } from '../config/modal.mjs';
+import { useScroll } from '../../../../hooks/use-scroll/index.mjs';
 import { createNamespace } from '../../../../utils/create-namespace.mjs';
 "use strict";
@@ -15,10 +17,14 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
+    const { scrollPosition, isHasScrollBar, scrollRef } = useScroll();
     const searchIconValue = ref("");
     const selectIcon = ref("");
     const iconList = ref([]);
     const bem = createNamespace("icon-picker-modal");
+    const isShowContentBottomBox = computed(() => {
+      return isHasScrollBar.value && scrollPosition.value !== "bottom";
+    });
     const handleOk = () => {
       emits("changeIconValue", selectIcon.value);
       emits("update:visible");
@@ -30,13 +36,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       (newVisible) => {
         if (newVisible)
           searchIconValue.value = "";
-      }
-    );
-    watch(
-      () => props.value,
-      (newV) => {
-        if (newV)
-          selectIcon.value = newV;
+        if (newVisible && props.value)
+          selectIcon.value = props.value;
       },
       {
         immediate: true
@@ -56,97 +57,117 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         (ele) => ~ele.font_class.indexOf(searchIconValue.value)
       );
     });
+    watchEffect(() => {
+      if (props.visible) {
+        if (isHasScrollBar && scrollRef.value && !scrollRef.value.scrollTop) {
+          scrollRef.value.scrollTop = 0;
+          scrollPosition.value = "top";
+        }
+      }
+    });
     return (_ctx, _cache) => {
       const _component_ll_icon = resolveComponent("ll-icon");
       const _component_a_input = resolveComponent("a-input");
       const _component_a_form_item = resolveComponent("a-form-item");
       const _component_a_button = resolveComponent("a-button");
       const _component_a_space = resolveComponent("a-space");
-      const _component_ll_modal = resolveComponent("ll-modal");
-      return openBlock(), createBlock(_component_ll_modal, {
+      const _component_ll_new_modal = resolveComponent("ll-new-modal");
+      return openBlock(), createBlock(_component_ll_new_modal, {
         open: _ctx.visible,
         title: "\u56FE\u6807\u9009\u62E9",
         class: normalizeClass(`icon-picker-modal-wrapper ${unref(bem).b()}`),
         width: "766px",
         keyboard: false,
         "mask-closable": false,
+        "is-show-footer-shadow": isShowContentBottomBox.value,
+        "footer-shadow-placement": "outer",
         onOk: handleOk,
         onCancel: handleCancel
       }, {
-        step: withCtx(() => [
+        default: withCtx(() => [
           createElementVNode(
             "div",
             {
-              class: normalizeClass(unref(bem).e("input-container"))
+              class: normalizeClass(unref(bem).e("modal-content"))
             },
             [
-              createVNode(_component_a_form_item, { name: "h" }, {
-                default: withCtx(() => [
-                  createVNode(_component_a_input, {
-                    value: searchIconValue.value,
-                    "onUpdate:value": _cache[0] || (_cache[0] = ($event) => searchIconValue.value = $event),
-                    class: normalizeClass(unref(bem).e("input")),
-                    "allow-clear": "",
-                    placeholder: "\u641C\u7D22..."
+              createElementVNode(
+                "div",
+                {
+                  class: normalizeClass(unref(bem).e("input-container"))
+                },
+                [
+                  createVNode(_component_a_form_item, { name: "h" }, {
+                    default: withCtx(() => [
+                      createVNode(_component_a_input, {
+                        value: searchIconValue.value,
+                        "onUpdate:value": _cache[0] || (_cache[0] = ($event) => searchIconValue.value = $event),
+                        class: normalizeClass(unref(bem).e("input")),
+                        "allow-clear": "",
+                        placeholder: "\u641C\u7D22..."
+                      }, {
+                        prefix: withCtx(() => [
+                          createVNode(_component_ll_icon, { "icon-name": "icon-search" })
+                        ]),
+                        _: 1
+                        /* STABLE */
+                      }, 8, ["value", "class"])
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  })
+                ],
+                2
+                /* CLASS */
+              ),
+              createElementVNode(
+                "div",
+                {
+                  ref_key: "scrollRef",
+                  ref: scrollRef,
+                  class: normalizeClass(unref(bem).e("list"))
+                },
+                [
+                  createVNode(_component_a_space, {
+                    size: [16, 16],
+                    wrap: "",
+                    class: normalizeClass(unref(bem).e("space"))
                   }, {
-                    prefix: withCtx(() => [
-                      createVNode(_component_ll_icon, { "icon-name": "icon-search" })
+                    default: withCtx(() => [
+                      (openBlock(true), createElementBlock(
+                        Fragment,
+                        null,
+                        renderList(iconList.value, (item) => {
+                          return openBlock(), createBlock(_component_a_button, {
+                            key: item.icon_id,
+                            type: "default",
+                            class: normalizeClass([
+                              unref(bem).e("button"),
+                              selectIcon.value === item.font_class ? unref(bem).is("active") : ""
+                            ]),
+                            onClick: ($event) => handleSelectIcon(item)
+                          }, {
+                            icon: withCtx(() => [
+                              createVNode(_component_ll_icon, {
+                                "icon-name": "icon-" + item.font_class,
+                                style: { "font-size": "28px" }
+                              }, null, 8, ["icon-name"])
+                            ]),
+                            _: 2
+                            /* DYNAMIC */
+                          }, 1032, ["class", "onClick"]);
+                        }),
+                        128
+                        /* KEYED_FRAGMENT */
+                      ))
                     ]),
                     _: 1
                     /* STABLE */
-                  }, 8, ["value", "class"])
-                ]),
-                _: 1
-                /* STABLE */
-              })
-            ],
-            2
-            /* CLASS */
-          )
-        ]),
-        default: withCtx(() => [
-          createElementVNode(
-            "div",
-            {
-              class: normalizeClass(unref(bem).e("list"))
-            },
-            [
-              createVNode(_component_a_space, {
-                size: [16, 16],
-                wrap: "",
-                class: normalizeClass(unref(bem).e("space"))
-              }, {
-                default: withCtx(() => [
-                  (openBlock(true), createElementBlock(
-                    Fragment,
-                    null,
-                    renderList(iconList.value, (item) => {
-                      return openBlock(), createBlock(_component_a_button, {
-                        key: item.icon_id,
-                        type: "default",
-                        class: normalizeClass([
-                          unref(bem).e("button"),
-                          selectIcon.value === item.font_class ? unref(bem).is("active") : ""
-                        ]),
-                        onClick: ($event) => handleSelectIcon(item)
-                      }, {
-                        icon: withCtx(() => [
-                          createVNode(_component_ll_icon, {
-                            "icon-name": "icon-" + item.font_class,
-                            style: { "font-size": "28px" }
-                          }, null, 8, ["icon-name"])
-                        ]),
-                        _: 2
-                        /* DYNAMIC */
-                      }, 1032, ["class", "onClick"]);
-                    }),
-                    128
-                    /* KEYED_FRAGMENT */
-                  ))
-                ]),
-                _: 1
-                /* STABLE */
-              }, 8, ["class"])
+                  }, 8, ["class"])
+                ],
+                2
+                /* CLASS */
+              )
             ],
             2
             /* CLASS */
@@ -154,7 +175,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         ]),
         _: 1
         /* STABLE */
-      }, 8, ["open", "class"]);
+      }, 8, ["open", "class", "is-show-footer-shadow"]);
     };
   }
 });

package/es/packages/components/icon-picker/src/components/modal.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"modal.vue2.mjs","sources":["../../../../../../../packages/components/icon-picker/src/components/modal.vue"],"sourcesContent":["<template>\n <ll-modal\n :open=\"visible\"\n :title=\"'图标选择'\"\n :class=\"`icon-picker-modal-wrapper ${bem.b()}`\"\n width=\"766px\"\n :keyboard=\"false\"\n :mask-closable=\"false\"\n @ok=\"handleOk\"\n @cancel=\"handleCancel\"\n >\n <~~template~~ ~~#step~~>\n <div :class=\"bem.e('input-container')\">\n <a-form-item name=\"h\">\n <a-input\n v-model:value=\"searchIconValue\"\n :class=\"bem.e('input')\"\n allow-clear\n placeholder=\"搜索...\"\n >\n <template #prefix>\n <ll-icon icon-name=\"icon-search\" />\n </template>\n </a-input>\n </a-form-item>\n </div>\n ~~</template>\n~~ <div :class=\"bem.e('list')\">\n <a-space :size=\"[16, 16]\" wrap :class=\"bem.e('space')\">\n <a-button\n v-for=\"item in iconList\"\n :key=\"item.icon_id\"\n type=\"default\"\n :class=\"[\n bem.e('button'),\n selectIcon === item.font_class ? bem.is('active') : ''\n ]\"\n @click=\"handleSelectIcon(item)\"\n >\n <template #icon>\n <ll-icon\n :icon-name=\"'icon-' + item.font_class\"\n style=\"font-size: 28px\"\n />\n </template>\n </a-button>\n </a-space>\n </div>\n </ll-modal>\n</template>\n<script lang=\"ts\" setup>\nimport { ref, watch } from 'vue'\n\nimport { createNamespace } from '@ll-plus/utils'\nimport { iconPickerModalProps, iconPickerModalEmits } from '../config'\n\nimport type { IconPickerItem } from '../config'\n\ndefineOptions({\n name: 'LlIconPickerModal'\n})\n\nconst props = defineProps(iconPickerModalProps)\nconst emits = defineEmits(iconPickerModalEmits)\n\nconst searchIconValue = ref('')\nconst selectIcon = ref('')\nconst iconList = ref<IconPickerItem[]>([])\nconst bem = createNamespace('icon-picker-modal')\n\nconst handleOk = () => {\n emits('changeIconValue', selectIcon.value)\n emits('update:visible')\n}\nconst handleCancel = () => emits('update:visible')\nconst handleSelectIcon = (icon: IconPickerItem) =>\n (selectIcon.value = icon?.font_class as string)\n\~~n// 监听选择的icon\~~nwatch(\n () => props.visible,\n newVisible => {\n if (newVisible) searchIconValue.value = ''\n }\n~~)\nwatch~~(~~\n ()~~ => props.value~~,\n newV => {\n if (newV~~) selectIcon.value = ~~newV~~\n },\n {\n immediate: true\n }\n)\nwatch(\n () => props.data,\n newData => {\n iconList.value = [...newData]\n },\n {\n immediate: true\n }\n)\nwatch(searchIconValue, () => {\n iconList.value = props.data.filter(\n ele => ~ele.font_class!.indexOf(searchIconValue.value)\n )\n})\n</script>\n"],"names":[],"mappings":"~~;;;;;;;;;;;;;;;AA8DA~~,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAEd,IAAM,MAAA,eAAA,GAAkB,IAAI,EAAE,CAAA,CAAA;AAC9B,IAAM,MAAA,UAAA,GAAa,IAAI,EAAE,CAAA,CAAA;AACzB,IAAM,MAAA,QAAA,GAAW,GAAsB,CAAA,EAAE,CAAA,CAAA;AACzC,IAAM,MAAA,GAAA,GAAM,gBAAgB,mBAAmB,CAAA,CAAA;~~AAE~~/C,IAAA,MAAM,WAAW,MAAM;AACrB,MAAM,KAAA,CAAA,iBAAA,EAAmB,WAAW,KAAK,CAAA,CAAA;AACzC,MAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA;AAAA,KACxB,CAAA;AACA,IAAM,MAAA,YAAA,GAAe,MAAM,KAAA,CAAM,gBAAgB,CAAA,CAAA;AACjD,IAAA,MAAM,gBAAmB,GAAA,CAAC,IACvB,KAAA,UAAA,CAAW,QAAQ,IAAM,EAAA,UAAA,CAAA;~~AAG5B~~,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,OAAA;AAAA,MACZ,CAAc,UAAA,KAAA;~~AACZ~~,QAAI,IAAA,UAAA;AAAY,UAAA,eAAA,CAAgB,KAAQ,GAAA,EAAA,CAAA;~~AAAA~~,~~OAC1C;AAAA~~,~~KACF~~,~~CAAA;AACA~~,~~IAAA,KAAA;AAAA,MACE,MAAM,~~KAAM,CAAA,KAAA;~~AAAA~~,~~MACZ,CAAQ,IAAA,KAAA;AACN,QAAI,IAAA,IAAA;AAAM,~~UAAA,UAAA,CAAW,~~KAAQ~~,~~GAAA~~,~~IAAA~~,CAAA;AAAA,~~OAC/B~~;AAAA,MACA;AAAA,QACE,SAAW,EAAA,IAAA;AAAA,OACb;AAAA,KACF,CAAA;AACA,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,IAAA;AAAA,MACZ,CAAW,OAAA,KAAA;AACT,QAAS,QAAA,CAAA,KAAA,GAAQ,CAAC,GAAG,OAAO,CAAA,CAAA;AAAA,OAC9B;AAAA,MACA;AAAA,QACE,SAAW,EAAA,IAAA;AAAA,OACb;AAAA,KACF,CAAA;AACA,IAAA,KAAA,CAAM,iBAAiB,MAAM;AAC3B,MAAS,QAAA,CAAA,KAAA,GAAQ,MAAM,IAAK,CAAA,MAAA;AAAA,QAC1B,SAAO,CAAC,GAAA,CAAI,UAAY,CAAA,OAAA,CAAQ,gBAAgB,KAAK,CAAA;AAAA,OACvD,CAAA;AAAA,KACD,CAAA,CAAA~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"modal.vue2.mjs","sources":["../../../../../../../packages/components/icon-picker/src/components/modal.vue"],"sourcesContent":["<template>\n <ll-new-modal\n :open=\"visible\"\n :title=\"'图标选择'\"\n :class=\"`icon-picker-modal-wrapper ${bem.b()}`\"\n width=\"766px\"\n :keyboard=\"false\"\n :mask-closable=\"false\"\n :is-show-footer-shadow=\"isShowContentBottomBox\"\n footer-shadow-placement=\"outer\"\n @ok=\"handleOk\"\n @cancel=\"handleCancel\"\n >\n <div :class=\"bem.e('modal-content')\">\n <div :class=\"bem.e('input-container')\">\n <a-form-item name=\"h\">\n <a-input\n v-model:value=\"searchIconValue\"\n :class=\"bem.e('input')\"\n allow-clear\n placeholder=\"搜索...\"\n >\n <template #prefix>\n <ll-icon icon-name=\"icon-search\" />\n </template>\n </a-input>\n </a-form-item>\n </div>\n <div ref=\"scrollRef\" :class=\"bem.e('list')\">\n <a-space :size=\"[16, 16]\" wrap :class=\"bem.e('space')\">\n <a-button\n v-for=\"item in iconList\"\n :key=\"item.icon_id\"\n type=\"default\"\n :class=\"[\n bem.e('button'),\n selectIcon === item.font_class ? bem.is('active') : ''\n ]\"\n @click=\"handleSelectIcon(item)\"\n >\n <template #icon>\n <ll-icon\n :icon-name=\"'icon-' + item.font_class\"\n style=\"font-size: 28px\"\n />\n </template>\n </a-button>\n </a-space>\n </div>\n </div>\n </ll-new-modal>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, ref, watch, watchEffect } from 'vue'\n\nimport { createNamespace } from '@ll-plus/utils'\nimport { iconPickerModalProps, iconPickerModalEmits } from '../config'\n\nimport type { IconPickerItem } from '../config'\nimport { useScroll } from '@ll-plus/hooks'\n\ndefineOptions({\n name: 'LlIconPickerModal'\n})\n\nconst props = defineProps(iconPickerModalProps)\nconst emits = defineEmits(iconPickerModalEmits)\n\nconst { scrollPosition, isHasScrollBar, scrollRef } = useScroll()\n\nconst searchIconValue = ref('')\nconst selectIcon = ref('')\nconst iconList = ref<IconPickerItem[]>([])\nconst bem = createNamespace('icon-picker-modal')\n\n// 是否显示内容区域底部的阴影div\nconst isShowContentBottomBox = computed(() => {\n return isHasScrollBar.value && scrollPosition.value !== 'bottom'\n})\n\nconst handleOk = () => {\n emits('changeIconValue', selectIcon.value)\n emits('update:visible')\n}\nconst handleCancel = () => emits('update:visible')\nconst handleSelectIcon = (icon: IconPickerItem) =>\n (selectIcon.value = icon?.font_class as string)\n\nwatch(\n () => props.visible,\n newVisible => {\n // 清空查询值\n if (newVisible) searchIconValue.value = ''\n\n if (newVisible && props.value) selectIcon.value = props.value\n },\n {\n immediate: true\n }\n)\nwatch(\n () => props.data,\n newData => {\n iconList.value = [...newData]\n },\n {\n immediate: true\n }\n)\nwatch(searchIconValue, () => {\n iconList.value = props.data.filter(\n ele => ~ele.font_class!.indexOf(searchIconValue.value)\n )\n})\n\n// 滚动条回到顶部\nwatchEffect(() => {\n if (props.visible) {\n // 头部有步骤条回到顶部\n if (isHasScrollBar && scrollRef.value && !scrollRef.value.scrollTop) {\n scrollRef.value.scrollTop = 0\n scrollPosition.value = 'top'\n }\n }\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAiEA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAEd,IAAA,MAAM,EAAE,cAAA,EAAgB,cAAgB,EAAA,SAAA,KAAc,SAAU,EAAA,CAAA;AAEhE,IAAM,MAAA,eAAA,GAAkB,IAAI,EAAE,CAAA,CAAA;AAC9B,IAAM,MAAA,UAAA,GAAa,IAAI,EAAE,CAAA,CAAA;AACzB,IAAM,MAAA,QAAA,GAAW,GAAsB,CAAA,EAAE,CAAA,CAAA;AACzC,IAAM,MAAA,GAAA,GAAM,gBAAgB,mBAAmB,CAAA,CAAA;AAG/C,IAAM,MAAA,sBAAA,GAAyB,SAAS,MAAM;AAC5C,MAAO,OAAA,cAAA,CAAe,KAAS,IAAA,cAAA,CAAe,KAAU,KAAA,QAAA,CAAA;AAAA,KACzD,CAAA,CAAA;AAED,IAAA,MAAM,WAAW,MAAM;AACrB,MAAM,KAAA,CAAA,iBAAA,EAAmB,WAAW,KAAK,CAAA,CAAA;AACzC,MAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA;AAAA,KACxB,CAAA;AACA,IAAM,MAAA,YAAA,GAAe,MAAM,KAAA,CAAM,gBAAgB,CAAA,CAAA;AACjD,IAAA,MAAM,gBAAmB,GAAA,CAAC,IACvB,KAAA,UAAA,CAAW,QAAQ,IAAM,EAAA,UAAA,CAAA;AAE5B,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,OAAA;AAAA,MACZ,CAAc,UAAA,KAAA;AAEZ,QAAI,IAAA,UAAA;AAAY,UAAA,eAAA,CAAgB,KAAQ,GAAA,EAAA,CAAA;AAExC,QAAA,IAAI,cAAc,KAAM,CAAA,KAAA;AAAO,UAAA,UAAA,CAAW,QAAQ,KAAM,CAAA,KAAA,CAAA;AAAA,OAC1D;AAAA,MACA;AAAA,QACE,SAAW,EAAA,IAAA;AAAA,OACb;AAAA,KACF,CAAA;AACA,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,IAAA;AAAA,MACZ,CAAW,OAAA,KAAA;AACT,QAAS,QAAA,CAAA,KAAA,GAAQ,CAAC,GAAG,OAAO,CAAA,CAAA;AAAA,OAC9B;AAAA,MACA;AAAA,QACE,SAAW,EAAA,IAAA;AAAA,OACb;AAAA,KACF,CAAA;AACA,IAAA,KAAA,CAAM,iBAAiB,MAAM;AAC3B,MAAS,QAAA,CAAA,KAAA,GAAQ,MAAM,IAAK,CAAA,MAAA;AAAA,QAC1B,SAAO,CAAC,GAAA,CAAI,UAAY,CAAA,OAAA,CAAQ,gBAAgB,KAAK,CAAA;AAAA,OACvD,CAAA;AAAA,KACD,CAAA,CAAA;AAGD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,MAAM,OAAS,EAAA;AAEjB,QAAA,IAAI,kBAAkB,SAAU,CAAA,KAAA,IAAS,CAAC,SAAA,CAAU,MAAM,SAAW,EAAA;AACnE,UAAA,SAAA,CAAU,MAAM,SAAY,GAAA,CAAA,CAAA;AAC5B,UAAA,cAAA,CAAe,KAAQ,GAAA,KAAA,CAAA;AAAA,SACzB;AAAA,OACF;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/packages/components/input/src/input.vue2.mjs CHANGED Viewed

@@ -9,10 +9,11 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   ...{ name: "LlInput" },
   __name: "input",
   props: inputProps,
-  setup(__props) {
+  setup(__props, { expose: __expose }) {
     const bem = createNamespace("input");
     const props = __props;
     const innerValue = ref("");
+    const inputRef = ref();
     watchEffect(() => {
       if (props.value !== innerValue.value) {
         innerValue.value = props.value;
@@ -23,9 +24,15 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       const attrs = { ...useAttrs(), ...props };
       return attrs;
     });
+    const focus = () => {
+      inputRef.value.focus();
+    };
+    __expose({ focus });
     return (_ctx, _cache) => {
       const _component_ll_icon = resolveComponent("ll-icon");
       return openBlock(), createBlock(resolveDynamicComponent(unref(componentType)), mergeProps({
+        ref_key: "inputRef",
+        ref: inputRef,
         class: unref(bem).b()
       }, computedAttrs.value), createSlots({
         _: 2

package/es/packages/components/input/src/input.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"input.vue2.mjs","sources":["../../../../../../packages/components/input/src/input.vue"],"sourcesContent":["<template>\n <component :is=\"componentType\" :class=\"bem.b()\" v-bind=\"computedAttrs\">\n <template v-for=\"item in Object.keys($slots)\" :key=\"item\" #[item]=\"data\">\n <slot :name=\"item\" v-bind=\"data \|\| {}\"></slot>\n </template>\n <template v-if=\"prefixIcon\" #prefix>\n <ll-icon :icon-name=\"prefixIcon\" class-name=\"prefix-icon\" />\n </template>\n <template v-if=\"suffixIcon\" #suffix>\n <ll-icon :icon-name=\"suffixIcon\" class-name=\"suffix-icon\" />\n </template>\n </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, useAttrs, watchEffect } from 'vue'\nimport { Input } from 'ant-design-vue'\nimport { createNamespace } from '@ll-plus/utils'\nimport { InputValue, inputProps } from './input'\n\ndefineOptions({ name: 'LlInput' })\n\nconst bem = createNamespace('input')\n\nconst props = defineProps(inputProps)\n\nconst innerValue = ref<InputValue>('')\n\nwatchEffect(() => {\n if (props.value !== innerValue.value) {\n innerValue.value = props.value\n }\n})\n\nconst componentType = props.showPassword ? Input.Password : Input\n\nconst computedAttrs = computed(() => {\n const attrs = { ...useAttrs(), ...props }\n\n return attrs\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;~~AAsBA~~,IAAM,MAAA,GAAA,GAAM,gBAAgB,OAAO,CAAA,CAAA;AAEnC,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAM,MAAA,UAAA,GAAa,IAAgB,EAAE,CAAA,CAAA;AAErC,IAAA,WAAA,CAAY,MAAM;AAChB,MAAI,IAAA,KAAA,CAAM,KAAU,KAAA,UAAA,CAAW,KAAO,EAAA;AACpC,QAAA,UAAA,CAAW,QAAQ,KAAM,CAAA,KAAA,CAAA;AAAA,OAC3B;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,aAAgB,GAAA,KAAA,CAAM,YAAe,GAAA,KAAA,CAAM,QAAW,GAAA,KAAA,CAAA;AAE5D,IAAM,MAAA,aAAA,GAAgB,SAAS,MAAM;AACnC,MAAA,MAAM,QAAQ,EAAE,GAAG,QAAS,EAAA,EAAG,GAAG,KAAM,EAAA,CAAA;AAExC,MAAO,OAAA,KAAA,CAAA;AAAA,KACR,CAAA,CAAA~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"input.vue2.mjs","sources":["../../../../../../packages/components/input/src/input.vue"],"sourcesContent":["<template>\n <component\n :is=\"componentType\"\n ref=\"inputRef\"\n :class=\"bem.b()\"\n v-bind=\"computedAttrs\"\n >\n <template v-for=\"item in Object.keys($slots)\" :key=\"item\" #[item]=\"data\">\n <slot :name=\"item\" v-bind=\"data \|\| {}\"></slot>\n </template>\n <template v-if=\"prefixIcon\" #prefix>\n <ll-icon :icon-name=\"prefixIcon\" class-name=\"prefix-icon\" />\n </template>\n <template v-if=\"suffixIcon\" #suffix>\n <ll-icon :icon-name=\"suffixIcon\" class-name=\"suffix-icon\" />\n </template>\n </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, useAttrs, watchEffect } from 'vue'\nimport { Input } from 'ant-design-vue'\nimport { createNamespace } from '@ll-plus/utils'\nimport { InputValue, inputProps } from './input'\n\ndefineOptions({ name: 'LlInput' })\n\nconst bem = createNamespace('input')\n\nconst props = defineProps(inputProps)\n\nconst innerValue = ref<InputValue>('')\n\nconst inputRef = ref()\n\nwatchEffect(() => {\n if (props.value !== innerValue.value) {\n innerValue.value = props.value\n }\n})\n\nconst componentType = props.showPassword ? Input.Password : Input\n\nconst computedAttrs = computed(() => {\n const attrs = { ...useAttrs(), ...props }\n\n return attrs\n})\n\nconst focus = () => {\n inputRef.value.focus()\n}\n\ndefineExpose({ focus })\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;AA2BA,IAAM,MAAA,GAAA,GAAM,gBAAgB,OAAO,CAAA,CAAA;AAEnC,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAM,MAAA,UAAA,GAAa,IAAgB,EAAE,CAAA,CAAA;AAErC,IAAA,MAAM,WAAW,GAAI,EAAA,CAAA;AAErB,IAAA,WAAA,CAAY,MAAM;AAChB,MAAI,IAAA,KAAA,CAAM,KAAU,KAAA,UAAA,CAAW,KAAO,EAAA;AACpC,QAAA,UAAA,CAAW,QAAQ,KAAM,CAAA,KAAA,CAAA;AAAA,OAC3B;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,aAAgB,GAAA,KAAA,CAAM,YAAe,GAAA,KAAA,CAAM,QAAW,GAAA,KAAA,CAAA;AAE5D,IAAM,MAAA,aAAA,GAAgB,SAAS,MAAM;AACnC,MAAA,MAAM,QAAQ,EAAE,GAAG,QAAS,EAAA,EAAG,GAAG,KAAM,EAAA,CAAA;AAExC,MAAO,OAAA,KAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAA,MAAM,QAAQ,MAAM;AAClB,MAAA,QAAA,CAAS,MAAM,KAAM,EAAA,CAAA;AAAA,KACvB,CAAA;AAEA,IAAa,QAAA,CAAA,EAAE,OAAO,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/packages/components/input-number/src/input-number.vue2.mjs CHANGED Viewed

@@ -17,12 +17,13 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "input-number",
   props: inputNumberProps,
   emits: inputNumberEmits,
-  setup(__props, { emit: __emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emit = __emit;
     const bem = createNamespace("input-number");
     const attrs = useAttrs();
     const innerValue = ref("");
+    const inputRef = ref();
     const integerCongfig = computed(() => {
       let obj = {};
       if (props.integer) {
@@ -60,6 +61,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       emit("update:value", value);
       emit("change", value);
     }
+    const focus = () => {
+      inputRef.value.focus();
+    };
+    __expose({ focus });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(
         "div",
@@ -75,6 +80,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             },
             [
               createVNode(unref(InputNumber), mergeProps({
+                ref_key: "inputRef",
+                ref: inputRef,
                 value: innerValue.value,
                 "onUpdate:value": _cache[0] || (_cache[0] = ($event) => innerValue.value = $event)
               }, getBindValue.value, { onChange }), createSlots({

package/es/packages/components/input-number/src/input-number.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"input-number.vue2.mjs","sources":["../../../../../../packages/components/input-number/src/input-number.vue"],"sourcesContent":["<template>\n <div :class=\"bem.b()\">\n <div v-if=\"!detailed\" :class=\"bem.e('container')\">\n <InputNumber\n v-model:value=\"innerValue\"\n v-bind=\"getBindValue\"\n @change=\"onChange\"\n >\n <template v-for=\"item in Object.keys($slots)\" #[item]=\"data\">\n <slot :name=\"item\" v-bind=\"data \|\| {}\"></slot>\n </template>\n <template v-if=\"getBindValue.unit\" #addonAfter>\n <div :class=\"bem.e('unit')\">\n {{ getBindValue.unit }}\n </div>\n </template>\n </InputNumber>\n </div>\n\n <p\n v-if=\"detailed\"\n :class=\"bem.e('detailed')\"\n :title=\"thousands ? thousandsFormat(innerValue) : innerValue\"\n >\n <span v-if=\"$attrs.addonBefore\">{{ $attrs.addonBefore }}</span>\n {{ thousands ? thousandsFormat(innerValue) : innerValue }}\n <span v-if=\"$attrs.addonAfter\">{{ $attrs.addonAfter }}</span>\n </p>\n <p\n v-if=\"isAmountChinese && getChineseName\"\n :class=\"bem.e('amount-chinese-name')\"\n >\n {{ getChineseName }}\n </p>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch, useAttrs } from 'vue'\nimport { InputNumber } from 'ant-design-vue'\nimport { isNil } from 'lodash-es'\nimport {\n getAmountChinese,\n thousandsFormat,\n createNamespace\n} from '@ll-plus/utils'\nimport { inputNumberProps, inputNumberEmits } from './input-number'\nimport { integerDict, type Integer } from './config'\nimport type { InputNumberProps } from 'ant-design-vue'\ndefineOptions({ name: 'LlInputNumber' })\nconst props = defineProps(inputNumberProps)\nconst emit = defineEmits(inputNumberEmits)\nconst bem = createNamespace('input-number')\nconst attrs = useAttrs()\nconst innerValue = ref('')\nconst integerCongfig = computed(() => {\n let obj = {} as Integer\n if (props.integer) {\n obj = integerDict[props.integer]\n }\n return obj\n})\n\nconst getBindValue = computed(() => {\n const bindValue = {\n ...attrs,\n ...integerCongfig.value\n } as InputNumberProps & { unit: string }\n if (props.thousands) {\n bindValue.formatter = (value: string \| number) => thousandsFormat(value)\n bindValue.parser = (value: string) => value.replace(/\\$\\s?\|(,*)/g, '')\n }\n return bindValue\n})\n\nconst getChineseName = computed(() => {\n let str = ''\n str =\n !props.isAmountChinese \|\| isNil(innerValue.value)\n ? ''\n : getAmountChinese(Number(innerValue.value))\n return str\n})\n\nwatch(\n () => props.value,\n val => {\n setValue(val)\n },\n { immediate: true }\n)\n\nfunction setValue(value) {\n innerValue.value = isNil(value) \|\| isNaN(value) ? null : value\n // (!value && value !== 0) \|\| isNaN(value) ? null : Number(value)\n}\nfunction onChange(value) {\n emit('update:value', value)\n emit('change', value)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;~~AAkDA~~,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,IAAA,MAAM,IAAO,GAAA,MAAA,CAAA;AACb,IAAM,MAAA,GAAA,GAAM,gBAAgB,cAAc,CAAA,CAAA;AAC1C,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AACvB,IAAM,MAAA,UAAA,GAAa,IAAI,EAAE,CAAA,CAAA;AACzB,IAAM,MAAA,cAAA,GAAiB,SAAS,MAAM;AACpC,MAAA,IAAI,MAAM,EAAC,CAAA;AACX,MAAA,IAAI,MAAM,OAAS,EAAA;AACjB,QAAM,GAAA,GAAA,WAAA,CAAY,MAAM,OAAO,CAAA,CAAA;AAAA,OACjC;AACA,MAAO,OAAA,GAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,SAAS,MAAM;AAClC,MAAA,MAAM,SAAY,GAAA;AAAA,QAChB,GAAG,KAAA;AAAA,QACH,GAAG,cAAe,CAAA,KAAA;AAAA,OACpB,CAAA;AACA,MAAA,IAAI,MAAM,SAAW,EAAA;AACnB,QAAA,SAAA,CAAU,SAAY,GAAA,CAAC,KAA2B,KAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AACvE,QAAA,SAAA,CAAU,SAAS,CAAC,KAAA,KAAkB,KAAM,CAAA,OAAA,CAAQ,eAAe,EAAE,CAAA,CAAA;AAAA,OACvE;AACA,MAAO,OAAA,SAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,cAAA,GAAiB,SAAS,MAAM;AACpC,MAAA,IAAI,GAAM,GAAA,EAAA,CAAA;AACV,MAAA,GAAA,GACE,CAAC,KAAA,CAAM,eAAmB,IAAA,KAAA,CAAM,UAAW,CAAA,KAAK,CAC5C,GAAA,EAAA,GACA,gBAAiB,CAAA,MAAA,CAAO,UAAW,CAAA,KAAK,CAAC,CAAA,CAAA;AAC/C,MAAO,OAAA,GAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,KAAA;AAAA,MACZ,CAAO,GAAA,KAAA;AACL,QAAA,QAAA,CAAS,GAAG,CAAA,CAAA;AAAA,OACd;AAAA,MACA,EAAE,WAAW,IAAK,EAAA;AAAA,KACpB,CAAA;AAEA,IAAA,SAAS,SAAS,KAAO,EAAA;AACvB,MAAA,UAAA,CAAW,QAAQ,KAAM,CAAA,KAAK,KAAK,KAAM,CAAA,KAAK,IAAI,IAAO,GAAA,KAAA,CAAA;AAAA,KAE3D;AACA,IAAA,SAAS,SAAS,KAAO,EAAA;AACvB,MAAA,IAAA,CAAK,gBAAgB,KAAK,CAAA,CAAA;AAC1B,MAAA,IAAA,CAAK,UAAU,KAAK,CAAA,CAAA;AAAA,KACtB~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"input-number.vue2.mjs","sources":["../../../../../../packages/components/input-number/src/input-number.vue"],"sourcesContent":["<template>\n <div :class=\"bem.b()\">\n <div v-if=\"!detailed\" :class=\"bem.e('container')\">\n <InputNumber\n ref=\"inputRef\"\n v-model:value=\"innerValue\"\n v-bind=\"getBindValue\"\n @change=\"onChange\"\n >\n <template v-for=\"item in Object.keys($slots)\" #[item]=\"data\">\n <slot :name=\"item\" v-bind=\"data \|\| {}\"></slot>\n </template>\n <template v-if=\"getBindValue.unit\" #addonAfter>\n <div :class=\"bem.e('unit')\">\n {{ getBindValue.unit }}\n </div>\n </template>\n </InputNumber>\n </div>\n\n <p\n v-if=\"detailed\"\n :class=\"bem.e('detailed')\"\n :title=\"thousands ? thousandsFormat(innerValue) : innerValue\"\n >\n <span v-if=\"$attrs.addonBefore\">{{ $attrs.addonBefore }}</span>\n {{ thousands ? thousandsFormat(innerValue) : innerValue }}\n <span v-if=\"$attrs.addonAfter\">{{ $attrs.addonAfter }}</span>\n </p>\n <p\n v-if=\"isAmountChinese && getChineseName\"\n :class=\"bem.e('amount-chinese-name')\"\n >\n {{ getChineseName }}\n </p>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch, useAttrs } from 'vue'\nimport { InputNumber } from 'ant-design-vue'\nimport { isNil } from 'lodash-es'\nimport {\n getAmountChinese,\n thousandsFormat,\n createNamespace\n} from '@ll-plus/utils'\nimport { inputNumberProps, inputNumberEmits } from './input-number'\nimport { integerDict, type Integer } from './config'\nimport type { InputNumberProps } from 'ant-design-vue'\ndefineOptions({ name: 'LlInputNumber' })\nconst props = defineProps(inputNumberProps)\nconst emit = defineEmits(inputNumberEmits)\nconst bem = createNamespace('input-number')\nconst attrs = useAttrs()\nconst innerValue = ref('')\nconst inputRef = ref()\nconst integerCongfig = computed(() => {\n let obj = {} as Integer\n if (props.integer) {\n obj = integerDict[props.integer]\n }\n return obj\n})\n\nconst getBindValue = computed(() => {\n const bindValue = {\n ...attrs,\n ...integerCongfig.value\n } as InputNumberProps & { unit: string }\n if (props.thousands) {\n bindValue.formatter = (value: string \| number) => thousandsFormat(value)\n bindValue.parser = (value: string) => value.replace(/\\$\\s?\|(,*)/g, '')\n }\n return bindValue\n})\n\nconst getChineseName = computed(() => {\n let str = ''\n str =\n !props.isAmountChinese \|\| isNil(innerValue.value)\n ? ''\n : getAmountChinese(Number(innerValue.value))\n return str\n})\n\nwatch(\n () => props.value,\n val => {\n setValue(val)\n },\n { immediate: true }\n)\n\nfunction setValue(value) {\n innerValue.value = isNil(value) \|\| isNaN(value) ? null : value\n // (!value && value !== 0) \|\| isNaN(value) ? null : Number(value)\n}\nfunction onChange(value) {\n emit('update:value', value)\n emit('change', value)\n}\n\nconst focus = () => {\n inputRef.value.focus()\n}\n\ndefineExpose({ focus })\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAmDA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,IAAA,MAAM,IAAO,GAAA,MAAA,CAAA;AACb,IAAM,MAAA,GAAA,GAAM,gBAAgB,cAAc,CAAA,CAAA;AAC1C,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AACvB,IAAM,MAAA,UAAA,GAAa,IAAI,EAAE,CAAA,CAAA;AACzB,IAAA,MAAM,WAAW,GAAI,EAAA,CAAA;AACrB,IAAM,MAAA,cAAA,GAAiB,SAAS,MAAM;AACpC,MAAA,IAAI,MAAM,EAAC,CAAA;AACX,MAAA,IAAI,MAAM,OAAS,EAAA;AACjB,QAAM,GAAA,GAAA,WAAA,CAAY,MAAM,OAAO,CAAA,CAAA;AAAA,OACjC;AACA,MAAO,OAAA,GAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,SAAS,MAAM;AAClC,MAAA,MAAM,SAAY,GAAA;AAAA,QAChB,GAAG,KAAA;AAAA,QACH,GAAG,cAAe,CAAA,KAAA;AAAA,OACpB,CAAA;AACA,MAAA,IAAI,MAAM,SAAW,EAAA;AACnB,QAAA,SAAA,CAAU,SAAY,GAAA,CAAC,KAA2B,KAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AACvE,QAAA,SAAA,CAAU,SAAS,CAAC,KAAA,KAAkB,KAAM,CAAA,OAAA,CAAQ,eAAe,EAAE,CAAA,CAAA;AAAA,OACvE;AACA,MAAO,OAAA,SAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,cAAA,GAAiB,SAAS,MAAM;AACpC,MAAA,IAAI,GAAM,GAAA,EAAA,CAAA;AACV,MAAA,GAAA,GACE,CAAC,KAAA,CAAM,eAAmB,IAAA,KAAA,CAAM,UAAW,CAAA,KAAK,CAC5C,GAAA,EAAA,GACA,gBAAiB,CAAA,MAAA,CAAO,UAAW,CAAA,KAAK,CAAC,CAAA,CAAA;AAC/C,MAAO,OAAA,GAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,KAAA;AAAA,MACZ,CAAO,GAAA,KAAA;AACL,QAAA,QAAA,CAAS,GAAG,CAAA,CAAA;AAAA,OACd;AAAA,MACA,EAAE,WAAW,IAAK,EAAA;AAAA,KACpB,CAAA;AAEA,IAAA,SAAS,SAAS,KAAO,EAAA;AACvB,MAAA,UAAA,CAAW,QAAQ,KAAM,CAAA,KAAK,KAAK,KAAM,CAAA,KAAK,IAAI,IAAO,GAAA,KAAA,CAAA;AAAA,KAE3D;AACA,IAAA,SAAS,SAAS,KAAO,EAAA;AACvB,MAAA,IAAA,CAAK,gBAAgB,KAAK,CAAA,CAAA;AAC1B,MAAA,IAAA,CAAK,UAAU,KAAK,CAAA,CAAA;AAAA,KACtB;AAEA,IAAA,MAAM,QAAQ,MAAM;AAClB,MAAA,QAAA,CAAS,MAAM,KAAM,EAAA,CAAA;AAAA,KACvB,CAAA;AAEA,IAAa,QAAA,CAAA,EAAE,OAAO,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}