@silver-formily/element-plus 2.2.0 → 2.3.0

package/esm/form-layout/form-layout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"form-layout.mjs","sources":["../../src/form-layout/form-layout.vue"],"sourcesContent":["<script lang=\"ts\" setup>\r\nimport type { FormContext } from 'element-plus'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isEmpty, isValid } from '@formily/shared'\r\nimport { formContextKey, useId } from 'element-plus'\r\nimport { computed, provide, reactive, ref, toRef, watch } from 'vue'\r\nimport { stylePrefix, useCleanAttrs, useThrottleFn } from '../__builtins__'\r\nimport { filterValidFormLayoutProps, formLayoutDeepContext, formLayoutIdContext, formLayoutShallowContext, useFormDeepLayout, useResponsiveFormLayout } from './utils'\r\n\r\ndefineOptions({\r\n  name: 'FFormLayout',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst props = withDefaults(defineProps<IFormLayoutProps>(), {\r\n  tag: 'form',\r\n  colon: undefined,\r\n  labelWrap: undefined,\r\n  fullness: undefined,\r\n  size: 'default',\r\n  layout: 'horizontal',\r\n  shallow: true,\r\n  statusIcon: true,\r\n  asterisk: undefined,\r\n})\r\nconst formPrefixCls = `${stylePrefix}-form`\r\nconst { props: attrs } = useCleanAttrs()\r\nconst rootHTMLRef = ref<HTMLElement>()\r\nconst isFormTag = props.tag === 'form'\r\nconst formLayoutBaseId = useId()\r\nconst formLayoutId = computed(() => attrs.value.id ?? `formily-${formLayoutBaseId.value}`)\r\nconst formLayoutDomId = computed(() => (isFormTag ? formLayoutId.value : attrs.value.id))\r\nif (isFormTag) {\r\n  provide(formLayoutIdContext, formLayoutId)\r\n}\r\n\r\nconst formLayoutDeepConfig = useFormDeepLayout()\r\nconst { props: responsiveProps } = useResponsiveFormLayout(props, rootHTMLRef)\r\n\r\nconst deepLayout = ref({\r\n  ...formLayoutDeepConfig.value,\r\n  ...(props.shallow\r\n    ? {\r\n        size: props.size,\r\n        ...(isValid(props.colon) && { colon: props.colon }),\r\n      }\r\n    : filterValidFormLayoutProps(props)),\r\n})\r\nprovide(formLayoutDeepContext, deepLayout)\r\n\r\nconst shallowLayout = ref(props.shallow ? filterValidFormLayoutProps(props) : {})\r\nprovide(formLayoutShallowContext, shallowLayout)\r\n\r\nconst updateLayout = useThrottleFn(() => {\r\n  if (!isEmpty(responsiveProps.value)) {\r\n    const _responsiveProps = filterValidFormLayoutProps(responsiveProps.value)\r\n    shallowLayout.value = filterValidFormLayoutProps({ ...props, ..._responsiveProps })\r\n  }\r\n}, 200, true)\r\n\r\nwatch(() => [props, responsiveProps], updateLayout, {\r\n  deep: true,\r\n  immediate: true,\r\n})\r\n\r\nconst formContext = reactive({\r\n  size: toRef(props, 'size'),\r\n  statusIcon: toRef(props, 'statusIcon'),\r\n  hideRequiredAsterisk: toRef(props, 'hideRequiredAsterisk'),\r\n  requireAsteriskPosition: toRef(props, 'requireAsteriskPosition'),\r\n})\r\nprovide(formContextKey, formContext as FormContext)\r\n</script>\r\n\r\n<template>\r\n  <component\r\n    :is=\"props.tag\"\r\n    :id=\"formLayoutDomId\"\r\n    ref=\"rootHTMLRef\"\r\n    :class=\"formPrefixCls\"\r\n    v-bind=\"attrs\"\r\n    @submit.prevent.stop\r\n  >\r\n    <slot />\r\n  </component>\r\n</template>\r\n"],"names":["props","__props","formPrefixCls","stylePrefix","attrs","useCleanAttrs","rootHTMLRef","ref","isFormTag","formLayoutBaseId","useId","formLayoutId","computed","formLayoutDomId","provide","formLayoutIdContext","formLayoutDeepConfig","useFormDeepLayout","responsiveProps","useResponsiveFormLayout","deepLayout","isValid","filterValidFormLayoutProps","formLayoutDeepContext","shallowLayout","formLayoutShallowContext","updateLayout","useThrottleFn","isEmpty","_responsiveProps","watch","formContext","reactive","toRef","formContextKey","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_unref","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,UAAMA,IAAQC,GAWRC,IAAgB,GAAGC,CAAW,SAC9B,EAAE,OAAOC,EAAA,IAAUC,EAAA,GACnBC,IAAcC,EAAA,GACdC,IAAYR,EAAM,QAAQ,QAC1BS,IAAmBC,EAAA,GACnBC,IAAeC,EAAS,MAAMR,EAAM,MAAM,MAAM,WAAWK,EAAiB,KAAK,EAAE,GACnFI,IAAkBD,EAAS,MAAOJ,IAAYG,EAAa,QAAQP,EAAM,MAAM,EAAG;AACxF,IAAII,KACFM,EAAQC,GAAqBJ,CAAY;AAG3C,UAAMK,IAAuBC,EAAA,GACvB,EAAE,OAAOC,EAAA,IAAoBC,EAAwBnB,GAAOM,CAAW,GAEvEc,IAAab,EAAI;AAAA,MACrB,GAAGS,EAAqB;AAAA,MACxB,GAAIhB,EAAM,UACN;AAAA,QACE,MAAMA,EAAM;AAAA,QACZ,GAAIqB,EAAQrB,EAAM,KAAK,KAAK,EAAE,OAAOA,EAAM,MAAA;AAAA,MAAM,IAEnDsB,EAA2BtB,CAAK;AAAA,IAAA,CACrC;AACD,IAAAc,EAAQS,GAAuBH,CAAU;AAEzC,UAAMI,IAAgBjB,EAAIP,EAAM,UAAUsB,EAA2BtB,CAAK,IAAI,EAAE;AAChF,IAAAc,EAAQW,GAA0BD,CAAa;AAE/C,UAAME,IAAeC,EAAc,MAAM;AACvC,UAAI,CAACC,EAAQV,EAAgB,KAAK,GAAG;AACnC,cAAMW,IAAmBP,EAA2BJ,EAAgB,KAAK;AACzE,QAAAM,EAAc,QAAQF,EAA2B,EAAE,GAAGtB,GAAO,GAAG6B,GAAkB;AAAA,MACpF;AAAA,IACF,GAAG,KAAK,EAAI;AAEZ,IAAAC,EAAM,MAAM,CAAC9B,GAAOkB,CAAe,GAAGQ,GAAc;AAAA,MAClD,MAAM;AAAA,MACN,WAAW;AAAA,IAAA,CACZ;AAED,UAAMK,IAAcC,EAAS;AAAA,MAC3B,MAAMC,EAAMjC,GAAO,MAAM;AAAA,MACzB,YAAYiC,EAAMjC,GAAO,YAAY;AAAA,MACrC,sBAAsBiC,EAAMjC,GAAO,sBAAsB;AAAA,MACzD,yBAAyBiC,EAAMjC,GAAO,yBAAyB;AAAA,IAAA,CAChE;AACD,WAAAc,EAAQoB,GAAgBH,CAA0B,cAIhDI,KAAAC,EASYC,EARLrC,EAAM,GAAG,GADhBsC,EASY;AAAA,MAPT,IAAIzB,EAAA;AAAA,eACD;AAAA,MAAJ,KAAIP;AAAA,MACH,OAAOJ;AAAA,IAAA,GACAqC,EAAAnC,CAAA,GAAK;AAAA,MACZ,4BAAD,MAAA;AAAA,MAAA,GAAoB,CAAA,WAAA,MAAA,CAAA;AAAA,IAAA;iBAEpB,MAAQ;AAAA,QAARoC,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}
+{"version":3,"file":"form-layout.mjs","sources":["../../src/form-layout/form-layout.vue"],"sourcesContent":["<script lang=\"ts\" setup>\r\nimport type { FormContext } from 'element-plus'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isEmpty, isValid } from '@formily/shared'\r\nimport { useThrottleFn } from '@vueuse/core'\r\nimport { formContextKey, useId } from 'element-plus'\r\nimport { computed, provide, reactive, ref, toRef, watch } from 'vue'\r\nimport { stylePrefix, useCleanAttrs } from '../__builtins__'\r\nimport { filterValidFormLayoutProps, formLayoutDeepContext, formLayoutIdContext, formLayoutShallowContext, useFormDeepLayout, useResponsiveFormLayout } from './utils'\r\n\r\ndefineOptions({\r\n  name: 'FFormLayout',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst props = withDefaults(defineProps<IFormLayoutProps>(), {\r\n  tag: 'form',\r\n  colon: undefined,\r\n  labelWrap: undefined,\r\n  fullness: undefined,\r\n  size: 'default',\r\n  layout: 'horizontal',\r\n  shallow: true,\r\n  statusIcon: true,\r\n  asterisk: undefined,\r\n})\r\nconst formPrefixCls = `${stylePrefix}-form`\r\nconst { props: attrs } = useCleanAttrs()\r\nconst rootHTMLRef = ref<HTMLElement>()\r\nconst isFormTag = props.tag === 'form'\r\nconst formLayoutBaseId = useId()\r\nconst formLayoutId = computed(() => attrs.value.id ?? `formily-${formLayoutBaseId.value}`)\r\nconst formLayoutDomId = computed(() => (isFormTag ? formLayoutId.value : attrs.value.id))\r\nif (isFormTag) {\r\n  provide(formLayoutIdContext, formLayoutId)\r\n}\r\n\r\nconst formLayoutDeepConfig = useFormDeepLayout()\r\nconst { props: responsiveProps } = useResponsiveFormLayout(props, rootHTMLRef)\r\n\r\nconst deepLayout = ref({\r\n  ...formLayoutDeepConfig.value,\r\n  ...(props.shallow\r\n    ? {\r\n        size: props.size,\r\n        ...(isValid(props.colon) && { colon: props.colon }),\r\n      }\r\n    : filterValidFormLayoutProps(props)),\r\n})\r\nprovide(formLayoutDeepContext, deepLayout)\r\n\r\nconst shallowLayout = ref(props.shallow ? filterValidFormLayoutProps(props) : {})\r\nprovide(formLayoutShallowContext, shallowLayout)\r\n\r\nconst updateLayout = useThrottleFn(() => {\r\n  if (!isEmpty(responsiveProps.value)) {\r\n    const _responsiveProps = filterValidFormLayoutProps(responsiveProps.value)\r\n    shallowLayout.value = filterValidFormLayoutProps({ ...props, ..._responsiveProps })\r\n  }\r\n}, 200, true)\r\n\r\nwatch(() => [props, responsiveProps], updateLayout, {\r\n  deep: true,\r\n  immediate: true,\r\n})\r\n\r\nconst formContext = reactive({\r\n  size: toRef(props, 'size'),\r\n  statusIcon: toRef(props, 'statusIcon'),\r\n  hideRequiredAsterisk: toRef(props, 'hideRequiredAsterisk'),\r\n  requireAsteriskPosition: toRef(props, 'requireAsteriskPosition'),\r\n})\r\nprovide(formContextKey, formContext as FormContext)\r\n</script>\r\n\r\n<template>\r\n  <component\r\n    :is=\"props.tag\"\r\n    :id=\"formLayoutDomId\"\r\n    ref=\"rootHTMLRef\"\r\n    :class=\"formPrefixCls\"\r\n    v-bind=\"attrs\"\r\n    @submit.prevent.stop\r\n  >\r\n    <slot />\r\n  </component>\r\n</template>\r\n"],"names":["props","__props","formPrefixCls","stylePrefix","attrs","useCleanAttrs","rootHTMLRef","ref","isFormTag","formLayoutBaseId","useId","formLayoutId","computed","formLayoutDomId","provide","formLayoutIdContext","formLayoutDeepConfig","useFormDeepLayout","responsiveProps","useResponsiveFormLayout","deepLayout","isValid","filterValidFormLayoutProps","formLayoutDeepContext","shallowLayout","formLayoutShallowContext","updateLayout","useThrottleFn","isEmpty","_responsiveProps","watch","formContext","reactive","toRef","formContextKey","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_unref","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,UAAMA,IAAQC,GAWRC,IAAgB,GAAGC,CAAW,SAC9B,EAAE,OAAOC,EAAA,IAAUC,EAAA,GACnBC,IAAcC,EAAA,GACdC,IAAYR,EAAM,QAAQ,QAC1BS,IAAmBC,EAAA,GACnBC,IAAeC,EAAS,MAAMR,EAAM,MAAM,MAAM,WAAWK,EAAiB,KAAK,EAAE,GACnFI,IAAkBD,EAAS,MAAOJ,IAAYG,EAAa,QAAQP,EAAM,MAAM,EAAG;AACxF,IAAII,KACFM,EAAQC,GAAqBJ,CAAY;AAG3C,UAAMK,IAAuBC,EAAA,GACvB,EAAE,OAAOC,EAAA,IAAoBC,EAAwBnB,GAAOM,CAAW,GAEvEc,IAAab,EAAI;AAAA,MACrB,GAAGS,EAAqB;AAAA,MACxB,GAAIhB,EAAM,UACN;AAAA,QACE,MAAMA,EAAM;AAAA,QACZ,GAAIqB,EAAQrB,EAAM,KAAK,KAAK,EAAE,OAAOA,EAAM,MAAA;AAAA,MAAM,IAEnDsB,EAA2BtB,CAAK;AAAA,IAAA,CACrC;AACD,IAAAc,EAAQS,GAAuBH,CAAU;AAEzC,UAAMI,IAAgBjB,EAAIP,EAAM,UAAUsB,EAA2BtB,CAAK,IAAI,EAAE;AAChF,IAAAc,EAAQW,GAA0BD,CAAa;AAE/C,UAAME,IAAeC,EAAc,MAAM;AACvC,UAAI,CAACC,EAAQV,EAAgB,KAAK,GAAG;AACnC,cAAMW,IAAmBP,EAA2BJ,EAAgB,KAAK;AACzE,QAAAM,EAAc,QAAQF,EAA2B,EAAE,GAAGtB,GAAO,GAAG6B,GAAkB;AAAA,MACpF;AAAA,IACF,GAAG,KAAK,EAAI;AAEZ,IAAAC,EAAM,MAAM,CAAC9B,GAAOkB,CAAe,GAAGQ,GAAc;AAAA,MAClD,MAAM;AAAA,MACN,WAAW;AAAA,IAAA,CACZ;AAED,UAAMK,IAAcC,EAAS;AAAA,MAC3B,MAAMC,EAAMjC,GAAO,MAAM;AAAA,MACzB,YAAYiC,EAAMjC,GAAO,YAAY;AAAA,MACrC,sBAAsBiC,EAAMjC,GAAO,sBAAsB;AAAA,MACzD,yBAAyBiC,EAAMjC,GAAO,yBAAyB;AAAA,IAAA,CAChE;AACD,WAAAc,EAAQoB,GAAgBH,CAA0B,cAIhDI,KAAAC,EASYC,EARLrC,EAAM,GAAG,GADhBsC,EASY;AAAA,MAPT,IAAIzB,EAAA;AAAA,eACD;AAAA,MAAJ,KAAIP;AAAA,MACH,OAAOJ;AAAA,IAAA,GACAqC,EAAAnC,CAAA,GAAK;AAAA,MACZ,4BAAD,MAAA;AAAA,MAAA,GAAoB,CAAA,WAAA,MAAA,CAAA;AAAA,IAAA;iBAEpB,MAAQ;AAAA,QAARoC,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}

package/esm/form-layout/utils.mjs

@@ -1,6 +1,6 @@
 import { isArr as d, isValid as u } from "@formily/shared";
+import { useResizeObserver as h } from "@vueuse/core";
 import { inject as l, ref as i, computed as s } from "vue";
-import { useResizeObserver as h } from "../__builtins__/shared/hooks.mjs";
 function A(t, o) {
   for (const [r, e] of t.entries())
     if (o <= e)

package/esm/form-layout/utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.mjs","sources":["../../src/form-layout/utils.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref } from 'vue'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isArr, isValid } from '@formily/shared'\r\nimport { computed, inject, ref } from 'vue'\r\nimport { useResizeObserver } from '../__builtins__'\r\n\r\nexport function calcBreakpointIndex(breakpoints: number[], width: number): number {\r\n  for (const [i, breakpoint] of breakpoints.entries()) {\r\n    if (width <= breakpoint) {\r\n      return i\r\n    }\r\n  }\r\n  return -1\r\n}\r\n\r\nexport function calcFactor<T>(value: T | readonly T[], breakpointIndex: number): T {\r\n  if (!Array.isArray(value) || value.length === 0) {\r\n    return value as T\r\n  }\r\n  const safeIndex = Math.max(-1, Math.min(breakpointIndex, value.length - 1))\r\n  return value.at(safeIndex)\r\n}\r\n\r\nexport function factor<T>(value: T | T[], breakpointIndex: number): T {\r\n  return isValid(value) ? calcFactor<T>(value, breakpointIndex) : value as T\r\n}\r\n\r\nexport function calculateProps(target: Element, props: IFormLayoutProps): IFormLayoutProps {\r\n  const { clientWidth } = target\r\n  const {\r\n    breakpoints,\r\n    layout,\r\n    labelAlign,\r\n    wrapperAlign,\r\n    labelCol,\r\n    wrapperCol,\r\n    ...otherProps\r\n  } = props\r\n  const breakpointIndex = calcBreakpointIndex(\r\n    breakpoints as number[],\r\n    clientWidth,\r\n  )\r\n\r\n  return {\r\n    layout: factor(layout, breakpointIndex),\r\n    labelAlign: factor(labelAlign, breakpointIndex),\r\n    wrapperAlign: factor(wrapperAlign, breakpointIndex),\r\n    labelCol: factor(labelCol, breakpointIndex),\r\n    wrapperCol: factor(wrapperCol, breakpointIndex),\r\n    ...otherProps,\r\n  }\r\n}\r\n\r\nexport function useResponsiveFormLayout(props: IFormLayoutProps, root: Ref<HTMLElement | null>) {\r\n  const { breakpoints } = props\r\n  if (!isArr(breakpoints)) {\r\n    return {\r\n      props: ref(props),\r\n    }\r\n  }\r\n\r\n  const layoutProps = ref<IFormLayoutProps>({})\r\n\r\n  useResizeObserver(root, () => {\r\n    layoutProps.value = calculateProps(root.value, props)\r\n  })\r\n\r\n  return {\r\n    props: layoutProps,\r\n  }\r\n}\r\n\r\nexport const formLayoutDeepContext: InjectionKey<Ref<IFormLayoutProps>> = Symbol(\r\n  'formLayoutDeepContext',\r\n)\r\n\r\nexport const formLayoutShallowContext: InjectionKey<Ref<IFormLayoutProps>>\r\n  = Symbol('formLayoutShallowContext')\r\n\r\nexport const formLayoutIdContext: InjectionKey<ComputedRef<string>>\r\n  = Symbol('formLayoutIdContext')\r\n\r\nexport function useFormDeepLayout(): Ref<IFormLayoutProps> {\r\n  return inject(formLayoutDeepContext, ref({}))\r\n}\r\n\r\nexport function useFormLayout(): Ref<IFormLayoutProps> {\r\n  const shallowLayout = inject(formLayoutShallowContext, ref({}))\r\n  const deepLayout = inject(formLayoutDeepContext, ref({}))\r\n\r\n  const formLayout = computed(() => {\r\n    return {\r\n      ...deepLayout.value,\r\n      ...shallowLayout.value,\r\n    }\r\n  })\r\n\r\n  return formLayout\r\n}\r\n\r\nexport function useFormLayoutId(): ComputedRef<string> {\r\n  return inject(formLayoutIdContext, computed(() => ''))\r\n}\r\n\r\nexport const FORM_LAYOUT_PROPS_KEYS: ReadonlyArray<keyof IFormLayoutProps> = [\r\n  'colon',\r\n  'labelAlign',\r\n  'wrapperAlign',\r\n  'labelWrap',\r\n  'labelWidth',\r\n  'wrapperWidth',\r\n  'labelCol',\r\n  'wrapperCol',\r\n  'fullness',\r\n  'size',\r\n  'layout',\r\n  'feedbackLayout',\r\n  'tooltipLayout',\r\n  'breakpoints',\r\n  'hideRequiredAsterisk',\r\n  'statusIcon',\r\n  'requireAsteriskPosition',\r\n] as const\r\n\r\nexport function filterValidFormLayoutProps(props: IFormLayoutProps): IFormLayoutProps {\r\n  return Object.fromEntries(\r\n    Object.entries(props)\r\n      .filter(([_, value]) => isValid(value)),\r\n  )\r\n}\r\n"],"names":["calcBreakpointIndex","breakpoints","width","i","breakpoint","calcFactor","value","breakpointIndex","safeIndex","factor","isValid","calculateProps","target","props","clientWidth","layout","labelAlign","wrapperAlign","labelCol","wrapperCol","otherProps","useResponsiveFormLayout","root","isArr","ref","layoutProps","useResizeObserver","formLayoutDeepContext","formLayoutShallowContext","formLayoutIdContext","useFormDeepLayout","inject","useFormLayout","shallowLayout","deepLayout","computed","useFormLayoutId","FORM_LAYOUT_PROPS_KEYS","filterValidFormLayoutProps","_"],"mappings":";;;AAMO,SAASA,EAAoBC,GAAuBC,GAAuB;AAChF,aAAW,CAACC,GAAGC,CAAU,KAAKH,EAAY;AACxC,QAAIC,KAASE;AACX,aAAOD;AAGX,SAAO;AACT;AAEO,SAASE,EAAcC,GAAyBC,GAA4B;AACjF,MAAI,CAAC,MAAM,QAAQD,CAAK,KAAKA,EAAM,WAAW;AAC5C,WAAOA;AAET,QAAME,IAAY,KAAK,IAAI,IAAI,KAAK,IAAID,GAAiBD,EAAM,SAAS,CAAC,CAAC;AAC1E,SAAOA,EAAM,GAAGE,CAAS;AAC3B;AAEO,SAASC,EAAUH,GAAgBC,GAA4B;AACpE,SAAOG,EAAQJ,CAAK,IAAID,EAAcC,GAAOC,CAAe,IAAID;AAClE;AAEO,SAASK,EAAeC,GAAiBC,GAA2C;AACzF,QAAM,EAAE,aAAAC,MAAgBF,GAClB;AAAA,IACJ,aAAAX;AAAA,IACA,QAAAc;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDP,GACEN,IAAkBP;AAAA,IACtBC;AAAA,IACAa;AAAA,EAAA;AAGF,SAAO;AAAA,IACL,QAAQL,EAAOM,GAAQR,CAAe;AAAA,IACtC,YAAYE,EAAOO,GAAYT,CAAe;AAAA,IAC9C,cAAcE,EAAOQ,GAAcV,CAAe;AAAA,IAClD,UAAUE,EAAOS,GAAUX,CAAe;AAAA,IAC1C,YAAYE,EAAOU,GAAYZ,CAAe;AAAA,IAC9C,GAAGa;AAAA,EAAA;AAEP;AAEO,SAASC,EAAwBR,GAAyBS,GAA+B;AAC9F,QAAM,EAAE,aAAArB,MAAgBY;AACxB,MAAI,CAACU,EAAMtB,CAAW;AACpB,WAAO;AAAA,MACL,OAAOuB,EAAIX,CAAK;AAAA,IAAA;AAIpB,QAAMY,IAAcD,EAAsB,EAAE;AAE5C,SAAAE,EAAkBJ,GAAM,MAAM;AAC5B,IAAAG,EAAY,QAAQd,EAAeW,EAAK,OAAOT,CAAK;AAAA,EACtD,CAAC,GAEM;AAAA,IACL,OAAOY;AAAA,EAAA;AAEX;AAEO,MAAME,IAA6D;AAAA,EACxE;AACF,GAEaC,IACT,OAAO,0BAA0B,GAExBC,IACT,OAAO,qBAAqB;AAEzB,SAASC,IAA2C;AACzD,SAAOC,EAAOJ,GAAuBH,EAAI,CAAA,CAAE,CAAC;AAC9C;AAEO,SAASQ,IAAuC;AACrD,QAAMC,IAAgBF,EAAOH,GAA0BJ,EAAI,CAAA,CAAE,CAAC,GACxDU,IAAaH,EAAOJ,GAAuBH,EAAI,CAAA,CAAE,CAAC;AASxD,SAPmBW,EAAS,OACnB;AAAA,IACL,GAAGD,EAAW;AAAA,IACd,GAAGD,EAAc;AAAA,EAAA,EAEpB;AAGH;AAEO,SAASG,IAAuC;AACrD,SAAOL,EAAOF,GAAqBM,EAAS,MAAM,EAAE,CAAC;AACvD;AAEO,MAAME,IAAgE;AAAA,EAC3E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAASC,EAA2BzB,GAA2C;AACpF,SAAO,OAAO;AAAA,IACZ,OAAO,QAAQA,CAAK,EACjB,OAAO,CAAC,CAAC0B,GAAGjC,CAAK,MAAMI,EAAQJ,CAAK,CAAC;AAAA,EAAA;AAE5C;"}
+{"version":3,"file":"utils.mjs","sources":["../../src/form-layout/utils.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref } from 'vue'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isArr, isValid } from '@formily/shared'\r\nimport { useResizeObserver } from '@vueuse/core'\r\nimport { computed, inject, ref } from 'vue'\r\n\r\nexport function calcBreakpointIndex(breakpoints: number[], width: number): number {\r\n  for (const [i, breakpoint] of breakpoints.entries()) {\r\n    if (width <= breakpoint) {\r\n      return i\r\n    }\r\n  }\r\n  return -1\r\n}\r\n\r\nexport function calcFactor<T>(value: T | readonly T[], breakpointIndex: number): T {\r\n  if (!Array.isArray(value) || value.length === 0) {\r\n    return value as T\r\n  }\r\n  const safeIndex = Math.max(-1, Math.min(breakpointIndex, value.length - 1))\r\n  return value.at(safeIndex)\r\n}\r\n\r\nexport function factor<T>(value: T | T[], breakpointIndex: number): T {\r\n  return isValid(value) ? calcFactor<T>(value, breakpointIndex) : value as T\r\n}\r\n\r\nexport function calculateProps(target: Element, props: IFormLayoutProps): IFormLayoutProps {\r\n  const { clientWidth } = target\r\n  const {\r\n    breakpoints,\r\n    layout,\r\n    labelAlign,\r\n    wrapperAlign,\r\n    labelCol,\r\n    wrapperCol,\r\n    ...otherProps\r\n  } = props\r\n  const breakpointIndex = calcBreakpointIndex(\r\n    breakpoints as number[],\r\n    clientWidth,\r\n  )\r\n\r\n  return {\r\n    layout: factor(layout, breakpointIndex),\r\n    labelAlign: factor(labelAlign, breakpointIndex),\r\n    wrapperAlign: factor(wrapperAlign, breakpointIndex),\r\n    labelCol: factor(labelCol, breakpointIndex),\r\n    wrapperCol: factor(wrapperCol, breakpointIndex),\r\n    ...otherProps,\r\n  }\r\n}\r\n\r\nexport function useResponsiveFormLayout(props: IFormLayoutProps, root: Ref<HTMLElement | null>) {\r\n  const { breakpoints } = props\r\n  if (!isArr(breakpoints)) {\r\n    return {\r\n      props: ref(props),\r\n    }\r\n  }\r\n\r\n  const layoutProps = ref<IFormLayoutProps>({})\r\n\r\n  useResizeObserver(root, () => {\r\n    layoutProps.value = calculateProps(root.value, props)\r\n  })\r\n\r\n  return {\r\n    props: layoutProps,\r\n  }\r\n}\r\n\r\nexport const formLayoutDeepContext: InjectionKey<Ref<IFormLayoutProps>> = Symbol(\r\n  'formLayoutDeepContext',\r\n)\r\n\r\nexport const formLayoutShallowContext: InjectionKey<Ref<IFormLayoutProps>>\r\n  = Symbol('formLayoutShallowContext')\r\n\r\nexport const formLayoutIdContext: InjectionKey<ComputedRef<string>>\r\n  = Symbol('formLayoutIdContext')\r\n\r\nexport function useFormDeepLayout(): Ref<IFormLayoutProps> {\r\n  return inject(formLayoutDeepContext, ref({}))\r\n}\r\n\r\nexport function useFormLayout(): Ref<IFormLayoutProps> {\r\n  const shallowLayout = inject(formLayoutShallowContext, ref({}))\r\n  const deepLayout = inject(formLayoutDeepContext, ref({}))\r\n\r\n  const formLayout = computed(() => {\r\n    return {\r\n      ...deepLayout.value,\r\n      ...shallowLayout.value,\r\n    }\r\n  })\r\n\r\n  return formLayout\r\n}\r\n\r\nexport function useFormLayoutId(): ComputedRef<string> {\r\n  return inject(formLayoutIdContext, computed(() => ''))\r\n}\r\n\r\nexport const FORM_LAYOUT_PROPS_KEYS: ReadonlyArray<keyof IFormLayoutProps> = [\r\n  'colon',\r\n  'labelAlign',\r\n  'wrapperAlign',\r\n  'labelWrap',\r\n  'labelWidth',\r\n  'wrapperWidth',\r\n  'labelCol',\r\n  'wrapperCol',\r\n  'fullness',\r\n  'size',\r\n  'layout',\r\n  'feedbackLayout',\r\n  'tooltipLayout',\r\n  'breakpoints',\r\n  'hideRequiredAsterisk',\r\n  'statusIcon',\r\n  'requireAsteriskPosition',\r\n] as const\r\n\r\nexport function filterValidFormLayoutProps(props: IFormLayoutProps): IFormLayoutProps {\r\n  return Object.fromEntries(\r\n    Object.entries(props)\r\n      .filter(([_, value]) => isValid(value)),\r\n  )\r\n}\r\n"],"names":["calcBreakpointIndex","breakpoints","width","i","breakpoint","calcFactor","value","breakpointIndex","safeIndex","factor","isValid","calculateProps","target","props","clientWidth","layout","labelAlign","wrapperAlign","labelCol","wrapperCol","otherProps","useResponsiveFormLayout","root","isArr","ref","layoutProps","useResizeObserver","formLayoutDeepContext","formLayoutShallowContext","formLayoutIdContext","useFormDeepLayout","inject","useFormLayout","shallowLayout","deepLayout","computed","useFormLayoutId","FORM_LAYOUT_PROPS_KEYS","filterValidFormLayoutProps","_"],"mappings":";;;AAMO,SAASA,EAAoBC,GAAuBC,GAAuB;AAChF,aAAW,CAACC,GAAGC,CAAU,KAAKH,EAAY;AACxC,QAAIC,KAASE;AACX,aAAOD;AAGX,SAAO;AACT;AAEO,SAASE,EAAcC,GAAyBC,GAA4B;AACjF,MAAI,CAAC,MAAM,QAAQD,CAAK,KAAKA,EAAM,WAAW;AAC5C,WAAOA;AAET,QAAME,IAAY,KAAK,IAAI,IAAI,KAAK,IAAID,GAAiBD,EAAM,SAAS,CAAC,CAAC;AAC1E,SAAOA,EAAM,GAAGE,CAAS;AAC3B;AAEO,SAASC,EAAUH,GAAgBC,GAA4B;AACpE,SAAOG,EAAQJ,CAAK,IAAID,EAAcC,GAAOC,CAAe,IAAID;AAClE;AAEO,SAASK,EAAeC,GAAiBC,GAA2C;AACzF,QAAM,EAAE,aAAAC,MAAgBF,GAClB;AAAA,IACJ,aAAAX;AAAA,IACA,QAAAc;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDP,GACEN,IAAkBP;AAAA,IACtBC;AAAA,IACAa;AAAA,EAAA;AAGF,SAAO;AAAA,IACL,QAAQL,EAAOM,GAAQR,CAAe;AAAA,IACtC,YAAYE,EAAOO,GAAYT,CAAe;AAAA,IAC9C,cAAcE,EAAOQ,GAAcV,CAAe;AAAA,IAClD,UAAUE,EAAOS,GAAUX,CAAe;AAAA,IAC1C,YAAYE,EAAOU,GAAYZ,CAAe;AAAA,IAC9C,GAAGa;AAAA,EAAA;AAEP;AAEO,SAASC,EAAwBR,GAAyBS,GAA+B;AAC9F,QAAM,EAAE,aAAArB,MAAgBY;AACxB,MAAI,CAACU,EAAMtB,CAAW;AACpB,WAAO;AAAA,MACL,OAAOuB,EAAIX,CAAK;AAAA,IAAA;AAIpB,QAAMY,IAAcD,EAAsB,EAAE;AAE5C,SAAAE,EAAkBJ,GAAM,MAAM;AAC5B,IAAAG,EAAY,QAAQd,EAAeW,EAAK,OAAOT,CAAK;AAAA,EACtD,CAAC,GAEM;AAAA,IACL,OAAOY;AAAA,EAAA;AAEX;AAEO,MAAME,IAA6D;AAAA,EACxE;AACF,GAEaC,IACT,OAAO,0BAA0B,GAExBC,IACT,OAAO,qBAAqB;AAEzB,SAASC,IAA2C;AACzD,SAAOC,EAAOJ,GAAuBH,EAAI,CAAA,CAAE,CAAC;AAC9C;AAEO,SAASQ,IAAuC;AACrD,QAAMC,IAAgBF,EAAOH,GAA0BJ,EAAI,CAAA,CAAE,CAAC,GACxDU,IAAaH,EAAOJ,GAAuBH,EAAI,CAAA,CAAE,CAAC;AASxD,SAPmBW,EAAS,OACnB;AAAA,IACL,GAAGD,EAAW;AAAA,IACd,GAAGD,EAAc;AAAA,EAAA,EAEpB;AAGH;AAEO,SAASG,IAAuC;AACrD,SAAOL,EAAOF,GAAqBM,EAAS,MAAM,EAAE,CAAC;AACvD;AAEO,MAAME,IAAgE;AAAA,EAC3E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAASC,EAA2BzB,GAA2C;AACpF,SAAO,OAAO;AAAA,IACZ,OAAO,QAAQA,CAAK,EACjB,OAAO,CAAC,CAAC0B,GAAGjC,CAAK,MAAMI,EAAQJ,CAAK,CAAC;AAAA,EAAA;AAE5C;"}

package/esm/index.d.ts

@@ -4,9 +4,13 @@ export * from './array-items';
 export * from './array-list-tabs';
 export * from './array-table';
 export * from './array-tabs';
+export * from './autocomplete';
 export * from './cascader';
 export * from './checkbox';
+export * from './color-picker';
+export * from './color-picker-panel';
 export * from './date-picker';
+export * from './date-picker-panel';
 export * from './editable';
 export * from './form';
 export * from './form-button-group';
@@ -20,6 +24,8 @@ export * from './form-step';
 export * from './form-tab';
 export * from './input';
 export * from './input-number';
+export * from './input-tag';
+export * from './mention';
 export * from './password';
 export * from './preview-text';
 export * from './radio';

package/esm/index.mjs

@@ -1,87 +1,99 @@
 import { ArrayCards as e } from "./array-cards/index.mjs";
-import { ArrayCollapse as t } from "./array-collapse/index.mjs";
+import { ArrayCollapse as m } from "./array-collapse/index.mjs";
 import { ArrayItems as f } from "./array-items/index.mjs";
 import { ArrayListTabs as a } from "./array-list-tabs/index.mjs";
-import { ArrayTable as l } from "./array-table/index.mjs";
-import { ArrayTabs as c } from "./array-tabs/index.mjs";
-import { Cascader as T } from "./cascader/index.mjs";
-import { Checkbox as d } from "./checkbox/index.mjs";
-import { DatePicker as u } from "./date-picker/index.mjs";
-import { Editable as A } from "./editable/index.mjs";
-import { FormButtonGroup as I } from "./form-button-group/index.mjs";
-import { FormCollapse as k, FormCollapseItem as w } from "./form-collapse/index.mjs";
-import { FormDialog as D } from "./form-dialog/index.mjs";
-import { FormDrawer as g } from "./form-drawer/index.mjs";
-import { FormGrid as B } from "./form-grid/index.mjs";
-import { FormBaseItem as G, FormItem as L, fieldFeedbackMapper as _ } from "./form-item/index.mjs";
-import { FormStep as M } from "./form-step/index.mjs";
-import { composeFormTab as U, composeFormTab as j } from "./form-tab/index.mjs";
-import { Input as z } from "./input/index.mjs";
-import { InputNumber as J } from "./input-number/index.mjs";
-import { Password as O } from "./password/index.mjs";
-import { PreviewText as V } from "./preview-text/index.mjs";
-import { Radio as X } from "./radio/index.mjs";
-import { Rate as Z } from "./rate/index.mjs";
-import { Reset as rr } from "./reset/index.mjs";
-import { Segmented as er } from "./segmented/index.mjs";
-import { Select as tr } from "./select/index.mjs";
-import { SelectTable as fr } from "./select-table/index.mjs";
-import { Slider as ar } from "./slider/index.mjs";
-import { Submit as lr } from "./submit/index.mjs";
-import { Switch as cr } from "./switch/index.mjs";
-import { TimePicker as Tr } from "./time-picker/index.mjs";
-import { TimeSelect as dr } from "./time-select/index.mjs";
-import { Transfer as ur } from "./transfer/index.mjs";
-import { Tree as Ar } from "./tree/index.mjs";
-import { TreeSelect as Ir } from "./tree-select/index.mjs";
-import { Upload as kr } from "./upload/index.mjs";
-import { _ as Pr } from "./form/form.mjs";
-import { _ as Rr } from "./form-layout/form-layout.mjs";
-import { ElSpace as hr } from "element-plus";
+import { ArrayTable as s } from "./array-table/index.mjs";
+import { ArrayTabs as i } from "./array-tabs/index.mjs";
+import { Autocomplete as T } from "./autocomplete/index.mjs";
+import { Cascader as d } from "./cascader/index.mjs";
+import { Checkbox as n } from "./checkbox/index.mjs";
+import { ColorPicker as P } from "./color-picker/index.mjs";
+import { ColorPickerPanel as k } from "./color-picker-panel/index.mjs";
+import { DatePicker as A } from "./date-picker/index.mjs";
+import { DatePickerPanel as w } from "./date-picker-panel/index.mjs";
+import { Editable as g } from "./editable/index.mjs";
+import { FormButtonGroup as h } from "./form-button-group/index.mjs";
+import { FormCollapse as E, FormCollapseItem as G } from "./form-collapse/index.mjs";
+import { FormDialog as M } from "./form-dialog/index.mjs";
+import { FormDrawer as v } from "./form-drawer/index.mjs";
+import { FormGrid as U } from "./form-grid/index.mjs";
+import { FormBaseItem as q, FormItem as z, fieldFeedbackMapper as H } from "./form-item/index.mjs";
+import { FormStep as K } from "./form-step/index.mjs";
+import { composeFormTab as Q, composeFormTab as V } from "./form-tab/index.mjs";
+import { Input as X } from "./input/index.mjs";
+import { InputNumber as Z } from "./input-number/index.mjs";
+import { InputTag as rr } from "./input-tag/index.mjs";
+import { Mention as er } from "./mention/index.mjs";
+import { Password as mr } from "./password/index.mjs";
+import { PreviewText as fr } from "./preview-text/index.mjs";
+import { Radio as ar } from "./radio/index.mjs";
+import { Rate as sr } from "./rate/index.mjs";
+import { Reset as ir } from "./reset/index.mjs";
+import { Segmented as Tr } from "./segmented/index.mjs";
+import { Select as dr } from "./select/index.mjs";
+import { SelectTable as nr } from "./select-table/index.mjs";
+import { Slider as Pr } from "./slider/index.mjs";
+import { Submit as kr } from "./submit/index.mjs";
+import { Switch as Ar } from "./switch/index.mjs";
+import { TimePicker as wr } from "./time-picker/index.mjs";
+import { TimeSelect as gr } from "./time-select/index.mjs";
+import { Transfer as hr } from "./transfer/index.mjs";
+import { Tree as Er } from "./tree/index.mjs";
+import { TreeSelect as Lr } from "./tree-select/index.mjs";
+import { Upload as _r } from "./upload/index.mjs";
+import { _ as Nr } from "./form/form.mjs";
+import { _ as jr } from "./form-layout/form-layout.mjs";
+import { ElSpace as zr } from "element-plus";
 export {
   e as ArrayCards,
-  t as ArrayCollapse,
+  m as ArrayCollapse,
   f as ArrayItems,
   a as ArrayListTabs,
-  l as ArrayTable,
-  c as ArrayTabs,
-  T as Cascader,
-  d as Checkbox,
-  u as DatePicker,
-  A as Editable,
-  Pr as Form,
-  G as FormBaseItem,
-  I as FormButtonGroup,
-  k as FormCollapse,
-  w as FormCollapseItem,
-  D as FormDialog,
-  g as FormDrawer,
-  B as FormGrid,
-  L as FormItem,
-  Rr as FormLayout,
-  M as FormStep,
-  U as FormTab,
-  z as Input,
-  J as InputNumber,
-  O as Password,
-  V as PreviewText,
-  X as Radio,
-  Z as Rate,
-  rr as Reset,
-  er as Segmented,
-  tr as Select,
-  fr as SelectTable,
-  ar as Slider,
-  hr as Space,
-  lr as Submit,
-  cr as Switch,
-  Tr as TimePicker,
-  dr as TimeSelect,
-  ur as Transfer,
-  Ar as Tree,
-  Ir as TreeSelect,
-  kr as Upload,
-  j as composeFormTab,
-  _ as fieldFeedbackMapper
+  s as ArrayTable,
+  i as ArrayTabs,
+  T as Autocomplete,
+  d as Cascader,
+  n as Checkbox,
+  P as ColorPicker,
+  k as ColorPickerPanel,
+  A as DatePicker,
+  w as DatePickerPanel,
+  g as Editable,
+  Nr as Form,
+  q as FormBaseItem,
+  h as FormButtonGroup,
+  E as FormCollapse,
+  G as FormCollapseItem,
+  M as FormDialog,
+  v as FormDrawer,
+  U as FormGrid,
+  z as FormItem,
+  jr as FormLayout,
+  K as FormStep,
+  Q as FormTab,
+  X as Input,
+  Z as InputNumber,
+  rr as InputTag,
+  er as Mention,
+  mr as Password,
+  fr as PreviewText,
+  ar as Radio,
+  sr as Rate,
+  ir as Reset,
+  Tr as Segmented,
+  dr as Select,
+  nr as SelectTable,
+  Pr as Slider,
+  zr as Space,
+  kr as Submit,
+  Ar as Switch,
+  wr as TimePicker,
+  gr as TimeSelect,
+  hr as Transfer,
+  Er as Tree,
+  Lr as TreeSelect,
+  _r as Upload,
+  V as composeFormTab,
+  H as fieldFeedbackMapper
 };
 //# sourceMappingURL=index.mjs.map

package/esm/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/esm/input-number/index.d.ts

@@ -9,13 +9,17 @@ export declare const InputNumber: import('element-plus/es/utils/index.mjs').SFCW
         size: {
             type: import('vue').PropType<"" | "small" | "default" | "large">;
         };
-        max: {
-            type: import('vue').PropType<number>;
-            default: number;
+        align: {
+            type: import('vue').PropType<"center" | "left" | "right">;
+            default: string;
         };
         name: {
             type: import('vue').PropType<string>;
         };
+        max: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: undefined;
@@ -30,10 +34,6 @@ export declare const InputNumber: import('element-plus/es/utils/index.mjs').SFCW
         modelValue: {
             type: import('vue').PropType<number>;
         };
-        align: {
-            type: import('vue').PropType<"center" | "left" | "right">;
-            default: string;
-        };
         ariaLabel: {
             type: import('vue').PropType<string>;
         };
@@ -119,13 +119,17 @@ export declare const InputNumber: import('element-plus/es/utils/index.mjs').SFCW
         size: {
             type: import('vue').PropType<"" | "small" | "default" | "large">;
         };
-        max: {
-            type: import('vue').PropType<number>;
-            default: number;
+        align: {
+            type: import('vue').PropType<"center" | "left" | "right">;
+            default: string;
         };
         name: {
             type: import('vue').PropType<string>;
         };
+        max: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: undefined;
@@ -140,10 +144,6 @@ export declare const InputNumber: import('element-plus/es/utils/index.mjs').SFCW
         modelValue: {
             type: import('vue').PropType<number>;
         };
-        align: {
-            type: import('vue').PropType<"center" | "left" | "right">;
-            default: string;
-        };
         ariaLabel: {
             type: import('vue').PropType<string>;
         };
@@ -220,13 +220,17 @@ export declare const InputNumber: import('element-plus/es/utils/index.mjs').SFCW
     size: {
         type: import('vue').PropType<"" | "small" | "default" | "large">;
     };
-    max: {
-        type: import('vue').PropType<number>;
-        default: number;
+    align: {
+        type: import('vue').PropType<"center" | "left" | "right">;
+        default: string;
     };
     name: {
         type: import('vue').PropType<string>;
     };
+    max: {
+        type: import('vue').PropType<number>;
+        default: number;
+    };
     disabled: {
         type: import('vue').PropType<boolean>;
         default: undefined;
@@ -241,10 +245,6 @@ export declare const InputNumber: import('element-plus/es/utils/index.mjs').SFCW
     modelValue: {
         type: import('vue').PropType<number>;
     };
-    align: {
-        type: import('vue').PropType<"center" | "left" | "right">;
-        default: string;
-    };
     ariaLabel: {
         type: import('vue').PropType<string>;
     };

package/esm/input-tag/index.d.ts

@@ -0,0 +1,32 @@
+export declare const InputTag: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Readonly<{
+        tag?: (scope: {
+            value: string;
+            index: number;
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        prefix?: () => any;
+        suffix?: () => any;
+    }> & {
+        tag?: (scope: {
+            value: string;
+            index: number;
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        prefix?: () => any;
+        suffix?: () => any;
+    };
+});
+export default InputTag;

package/esm/input-tag/index.mjs

@@ -0,0 +1,46 @@
+import { useField as l, connect as m, mapProps as u } from "@silver-formily/vue";
+import { PreviewText as d } from "../preview-text/index.mjs";
+import { defineComponent as c, useSlots as g, createBlock as x, openBlock as y, unref as o, normalizeProps as s, guardReactiveProps as a, createSlots as P, withCtx as r, renderSlot as n } from "vue";
+import { ElInputTag as _ } from "element-plus";
+import { useCleanAttrs as k } from "../__builtins__/shared/utils.mjs";
+import { mapReadPretty as v } from "../__builtins__/shared/transform-component.mjs";
+const T = /* @__PURE__ */ c({
+  name: "FInputTag",
+  inheritAttrs: !1,
+  __name: "input-tag",
+  setup(S) {
+    const e = g(), { props: i } = k(), p = l();
+    return (t, h) => (y(), x(o(_), s(a(o(i))), P({ _: 2 }, [
+      e.tag ? {
+        name: "tag",
+        fn: r((f) => [
+          n(t.$slots, "tag", s(a({ ...f, field: o(p) })))
+        ]),
+        key: "0"
+      } : void 0,
+      e.prefix ? {
+        name: "prefix",
+        fn: r(() => [
+          n(t.$slots, "prefix")
+        ]),
+        key: "1"
+      } : void 0,
+      e.suffix ? {
+        name: "suffix",
+        fn: r(() => [
+          n(t.$slots, "suffix")
+        ]),
+        key: "2"
+      } : void 0
+    ]), 1040));
+  }
+}), B = m(
+  T,
+  u({ readOnly: "readonly", disabled: !0 }),
+  v(d.Select, { multiple: !0 })
+);
+export {
+  B as InputTag,
+  B as default
+};
+//# sourceMappingURL=index.mjs.map

package/esm/input-tag/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/input-tag/input-tag.vue","../../src/input-tag/index.ts"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { Field } from '@formily/core'\r\nimport { useField } from '@silver-formily/vue'\r\nimport { ElInputTag } from 'element-plus'\r\nimport { useCleanAttrs } from '../__builtins__'\r\n\r\ndefineOptions({\r\n  name: 'FInputTag',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst slots = defineSlots<{\r\n  tag?: (scope: { value: string, index: number, field: Field | undefined }) => any\r\n  prefix?: () => any\r\n  suffix?: () => any\r\n}>()\r\n\r\nconst { props: inputTagProps } = useCleanAttrs()\r\nconst fieldRef = useField<Field>()\r\n</script>\r\n\r\n<template>\r\n  <ElInputTag v-bind=\"inputTagProps\">\r\n    <template v-if=\"slots.tag\" #tag=\"slotProps\">\r\n      <slot name=\"tag\" v-bind=\"{ ...slotProps, field: fieldRef }\" />\r\n    </template>\r\n    <template v-if=\"slots.prefix\" #prefix>\r\n      <slot name=\"prefix\" />\r\n    </template>\r\n    <template v-if=\"slots.suffix\" #suffix>\r\n      <slot name=\"suffix\" />\r\n    </template>\r\n  </ElInputTag>\r\n</template>\r\n","import { connect, mapProps } from '@silver-formily/vue'\r\nimport { mapReadPretty } from '../__builtins__'\r\nimport { PreviewText } from '../preview-text'\r\nimport FInputTag from './input-tag.vue'\r\n\r\nexport const InputTag = connect<typeof FInputTag>(\r\n  FInputTag,\r\n  mapProps({ readOnly: 'readonly', disabled: true }),\r\n  mapReadPretty(PreviewText.Select, { multiple: true }),\r\n)\r\n\r\nexport default InputTag\r\n"],"names":["slots","_useSlots","inputTagProps","useCleanAttrs","fieldRef","useField","_openBlock","_createBlock","_unref","_createSlots","_withCtx","slotProps","_renderSlot","_ctx","_normalizeProps","_guardReactiveProps","InputTag","connect","FInputTag","mapProps","mapReadPretty","PreviewText"],"mappings":";;;;;;;;;;;AAWA,UAAMA,IAAQC,EAAA,GAMR,EAAE,OAAOC,EAAA,IAAkBC,EAAA,GAC3BC,IAAWC,EAAA;sBAIfC,KAAAC,EAUaC,UAVOA,EAAAN,CAAA,CAAa,CAAA,GAAAO,EAAA,EAAA,GAAA,KAAA;AAAA,MACfT,EAAM;cAAM;AAAA,QAC1B,IAAAU,EAAA,CAD+BC,MAAS;AAAA,UACxCC,EAA8DC,EAAA,QAAA,OAAAC,EAAAC,EAAA,EAAA,GAAhCJ,GAAS,OAASH,EAAAJ,CAAA,EAAA,CAAQ,CAAA,CAAA;AAAA,QAAA;;;MAE1CJ,EAAM;cAAS;AAAA,cAC7B,MAAsB;AAAA,UAAtBY,EAAsBC,EAAA,QAAA,QAAA;AAAA,QAAA;;;MAERb,EAAM;cAAS;AAAA,cAC7B,MAAsB;AAAA,UAAtBY,EAAsBC,EAAA,QAAA,QAAA;AAAA,QAAA;;;;;ICzBfG,IAAWC;AAAA,EACtBC;AAAAA,EACAC,EAAS,EAAE,UAAU,YAAY,UAAU,IAAM;AAAA,EACjDC,EAAcC,EAAY,QAAQ,EAAE,UAAU,IAAM;AACtD;"}

package/esm/input-tag/input-tag.d.ts

@@ -0,0 +1,32 @@
+import { Field } from '@formily/core';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        tag?: (scope: {
+            value: string;
+            index: number;
+            field: Field | undefined;
+        }) => any;
+        prefix?: () => any;
+        suffix?: () => any;
+    }> & {
+        tag?: (scope: {
+            value: string;
+            index: number;
+            field: Field | undefined;
+        }) => any;
+        prefix?: () => any;
+        suffix?: () => any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/esm/mention/index.d.ts

@@ -0,0 +1,50 @@
+export declare const Mention: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Readonly<{
+        label?: (scope: {
+            item: import('element-plus').MentionOption;
+            index: number;
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        header?: (scope: {
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        footer?: (scope: {
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        loading?: () => any;
+        prefix?: () => any;
+        suffix?: () => any;
+        prepend?: () => any;
+        append?: () => any;
+    }> & {
+        label?: (scope: {
+            item: import('element-plus').MentionOption;
+            index: number;
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        header?: (scope: {
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        footer?: (scope: {
+            field: import('@formily/core').Field | undefined;
+        }) => any;
+        loading?: () => any;
+        prefix?: () => any;
+        suffix?: () => any;
+        prepend?: () => any;
+        append?: () => any;
+    };
+});
+export default Mention;

package/esm/mention/index.mjs

@@ -0,0 +1,93 @@
+import { useField as u, connect as c, mapProps as v } from "@silver-formily/vue";
+import { PreviewText as y } from "../preview-text/index.mjs";
+import { defineComponent as k, useSlots as h, computed as $, createBlock as P, openBlock as S, unref as s, normalizeProps as p, guardReactiveProps as l, createSlots as g, withCtx as n, renderSlot as r } from "vue";
+import { ElMention as b } from "element-plus";
+import { useCleanAttrs as M } from "../__builtins__/shared/utils.mjs";
+import { mapReadPretty as w } from "../__builtins__/shared/transform-component.mjs";
+const C = /* @__PURE__ */ k({
+  name: "FMention",
+  inheritAttrs: !1,
+  __name: "mention",
+  setup(R) {
+    const o = h(), { props: d } = M(), t = u(), f = $(() => {
+      const e = d.value, { onSearch: a } = e;
+      return a ? {
+        ...e,
+        onSearch(i, m) {
+          return a(
+            i,
+            m,
+            t.value
+          );
+        }
+      } : e;
+    });
+    return (e, a) => (S(), P(s(b), p(l(f.value)), g({ _: 2 }, [
+      o.prefix ? {
+        name: "prefix",
+        fn: n(() => [
+          r(e.$slots, "prefix")
+        ]),
+        key: "0"
+      } : void 0,
+      o.suffix ? {
+        name: "suffix",
+        fn: n(() => [
+          r(e.$slots, "suffix")
+        ]),
+        key: "1"
+      } : void 0,
+      o.prepend ? {
+        name: "prepend",
+        fn: n(() => [
+          r(e.$slots, "prepend")
+        ]),
+        key: "2"
+      } : void 0,
+      o.append ? {
+        name: "append",
+        fn: n(() => [
+          r(e.$slots, "append")
+        ]),
+        key: "3"
+      } : void 0,
+      o.header ? {
+        name: "header",
+        fn: n(() => [
+          r(e.$slots, "header", { field: s(t) })
+        ]),
+        key: "4"
+      } : void 0,
+      o.footer ? {
+        name: "footer",
+        fn: n(() => [
+          r(e.$slots, "footer", { field: s(t) })
+        ]),
+        key: "5"
+      } : void 0,
+      o.label ? {
+        name: "label",
+        fn: n((i) => [
+          r(e.$slots, "label", p(l({ ...i, field: s(t) })))
+        ]),
+        key: "6"
+      } : void 0,
+      o.loading ? {
+        name: "loading",
+        fn: n(() => [
+          r(e.$slots, "loading")
+        ]),
+        key: "7"
+      } : void 0
+    ]), 1040));
+  }
+}), I = c(
+  C,
+  v({ dataSource: "options", readOnly: "readonly", loading: !0, disabled: !0 }),
+  w(y.Input)
+);
+export {
+  I as Mention,
+  I as default
+};
+//# sourceMappingURL=index.mjs.map