yuyeon 0.0.42-rc16 → 0.0.42-rc18

package/lib/components/dialog/YDialog.mjs

@@ -105,7 +105,7 @@ export const YDialog = defineComponent({
         const filtered = activeLayers?.filter(layer => {
           return layer.ctx.modal;
         });
-        if (filtered && !filtered.length) {
+        if (filtered && !filtered.length || !root$.classList.contains('y-dialog--virtual-scroll')) {
           const scrollTop = document.documentElement.scrollTop;
           const scrollLeft = document.documentElement.scrollLeft;
           tempScrollTop.value = scrollTop;

package/lib/components/dialog/YDialog.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YDialog.mjs","names":["computed","defineComponent","getCurrentInstance","ref","shallowRef","watch","useModelDuplex","useRender","toStyleSizeValue","bindClasses","YCard","YLayer","useActiveStack","YDialog","name","components","props","modelValue","type","Boolean","persistent","default","dialogClasses","Array","String","Object","closeClickScrim","disabled","maximized","scrim","offset","emits","setup","_ref","emit","slots","vm","$yuyeon","appContext","config","globalProperties","active","classes","boundClasses","computedOffset","paddingTop","styles","value","layer$","children","onFocusin","e","prevTarget","relatedTarget","target","testChildrenContains","layers","some","layer","content$","contains","document","includes","focusableSelector","focusables","querySelectorAll","filter","el","hasAttribute","matches","length","firstChild","lastChild","focus","installFocusTrap","addEventListener","dismantleFocusTrap","removeEventListener","tempScrollTop","tempScrollLeft","preventInteractionBackground","toggle","root$","root","activeLayers","getActiveLayers","filtered","ctx","modal","scrollTop","documentElement","scrollLeft","classList","add","style","top","left","isMe","remove","onUpdate","v","onClick","currentActive","baseEl","neo","old","immediate","_createVNode","_Fragment","$event","_len","arguments","args","_key","base"],"sources":["../../../src/components/dialog/YDialog.tsx"],"sourcesContent":["import type { PropType } from 'vue';\r\nimport {\r\n  computed,\r\n  defineComponent,\r\n  getCurrentInstance,\r\n  ref,\r\n  shallowRef,\r\n  watch,\r\n} from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { toStyleSizeValue } from '../../util';\r\nimport { bindClasses } from '../../util/vue-component';\r\nimport { YCard } from '../card';\r\nimport { YLayer } from '../layer';\r\nimport { useActiveStack } from '../layer/active-stack';\r\n\r\nimport './YDialog.scss';\r\n\r\nexport const YDialog = defineComponent({\r\n  name: 'YDialog',\r\n  components: {\r\n    YLayer,\r\n    YCard,\r\n  },\r\n  props: {\r\n    modelValue: {\r\n      type: Boolean as PropType<boolean>,\r\n    },\r\n    persistent: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: true,\r\n    },\r\n    dialogClasses: {\r\n      type: [Array, String, Object] as PropType<\r\n        string[] | string | Record<string, any>\r\n      >,\r\n    },\r\n    closeClickScrim: {\r\n      type: Boolean as PropType<boolean>,\r\n    },\r\n    disabled: Boolean as PropType<boolean>,\r\n    maximized: Boolean as PropType<boolean>,\r\n    scrim: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: true,\r\n    },\r\n    offset: {\r\n      type: String as PropType<string>,\r\n    },\r\n  },\r\n  emits: ['update:modelValue'],\r\n  setup(props, { emit, slots }) {\r\n    const vm = getCurrentInstance();\r\n    const $yuyeon = vm?.appContext.config.globalProperties.$yuyeon;\r\n    const active = useModelDuplex(props);\r\n\r\n    const classes = computed(() => {\r\n      const boundClasses = bindClasses(props.dialogClasses);\r\n      return {\r\n        ...boundClasses,\r\n        'y-dialog': true,\r\n        'y-dialog--maximized': props.maximized,\r\n      };\r\n    });\r\n\r\n    const computedOffset = computed(() => {\r\n      return {\r\n        paddingTop: toStyleSizeValue(props.offset),\r\n      };\r\n    });\r\n\r\n    const styles = computed(() => {\r\n      return {\r\n        ...computedOffset.value,\r\n      };\r\n    });\r\n\r\n    const layer$ = ref<typeof YLayer>();\r\n    const { children } = useActiveStack(layer$, active, shallowRef(true));\r\n    function onFocusin(e: FocusEvent) {\r\n      const prevTarget = e.relatedTarget as HTMLElement | null;\r\n      const target = e.target as HTMLElement | null;\r\n\r\n      function testChildrenContains(layers: YLayer[]) {\r\n        return layers.some((layer) => {\r\n          return !layer.content$?.contains(target);\r\n        });\r\n      }\r\n\r\n      if (\r\n        prevTarget !== target &&\r\n        layer$.value?.content$ &&\r\n        ![document, layer$.value?.content$].includes(target) &&\r\n        !layer$.value?.content$.contains(target) &&\r\n        !testChildrenContains(children.value)\r\n      ) {\r\n        const focusableSelector =\r\n          'button, [href], input:not([type=\"hidden\"]), select, textarea, [tabindex]:not([tabindex=\"-1\"])';\r\n        const focusables = [\r\n          ...layer$.value.content$.querySelectorAll(focusableSelector),\r\n        ].filter(\r\n          (el) =>\r\n            !el.hasAttribute('disabled') && !el.matches('[tabindex=\"-1\"]'),\r\n        ) as HTMLElement[];\r\n        if (!focusables.length) return;\r\n        const firstChild = focusables[0];\r\n        const lastChild = focusables[focusables.length - 1];\r\n        if (firstChild === lastChild) {\r\n          lastChild.focus();\r\n        } else {\r\n          firstChild.focus();\r\n        }\r\n      }\r\n    }\r\n\r\n    function installFocusTrap() {\r\n      document.addEventListener('focusin', onFocusin);\r\n    }\r\n\r\n    function dismantleFocusTrap() {\r\n      document.removeEventListener('focusin', onFocusin);\r\n    }\r\n\r\n    const tempScrollTop = ref(0);\r\n    const tempScrollLeft = ref(0);\r\n\r\n    function preventInteractionBackground(toggle: boolean) {\r\n      const root$ = $yuyeon.root as HTMLElement;\r\n      const activeLayers = layer$.value?.getActiveLayers();\r\n      if (toggle) {\r\n        const filtered = activeLayers?.filter((layer: any) => {\r\n          return layer.ctx.modal;\r\n        });\r\n        if (filtered && !filtered.length) {\r\n          const scrollTop = document.documentElement.scrollTop;\r\n          const scrollLeft = document.documentElement.scrollLeft;\r\n          tempScrollTop.value = scrollTop;\r\n          tempScrollLeft.value = scrollLeft;\r\n          document.documentElement.classList.add('y-dialog--prevent-scroll');\r\n          root$.classList.add('y-dialog--virtual-scroll');\r\n          root$.style.top = toStyleSizeValue(-1 * scrollTop) || '';\r\n          root$.style.left = toStyleSizeValue(-1 * scrollLeft) || '';\r\n        }\r\n      } else {\r\n        const filtered = activeLayers?.filter((layer: any) => {\r\n          return !layer$.value?.isMe(layer) && layer.ctx.modal;\r\n        });\r\n        if (filtered && !filtered.length) {\r\n          root$.classList.remove('y-dialog--virtual-scroll');\r\n          document.documentElement.classList.remove('y-dialog--prevent-scroll');\r\n          root$.style.top = '';\r\n          root$.style.left = '';\r\n          document.documentElement.scrollTop = tempScrollTop.value;\r\n          document.documentElement.scrollLeft = tempScrollLeft.value;\r\n        }\r\n      }\r\n    }\r\n\r\n    function onUpdate(v: boolean) {\r\n      active.value = v;\r\n    }\r\n\r\n    function onClick(e: MouseEvent) {\r\n      const currentActive = active.value;\r\n      if (!props.disabled) {\r\n        active.value = !currentActive;\r\n      }\r\n    }\r\n\r\n    watch(\r\n      () => layer$.value?.baseEl,\r\n      (neo, old) => {\r\n        if (neo) {\r\n          neo.addEventListener('click', onClick);\r\n        } else if (old) {\r\n          old.removeEventListener('click', onClick);\r\n        }\r\n      },\r\n    );\r\n\r\n    watch(\r\n      () => active.value,\r\n      (neo) => {\r\n        neo ? installFocusTrap() : dismantleFocusTrap();\r\n        preventInteractionBackground(neo);\r\n      },\r\n      { immediate: true },\r\n    );\r\n\r\n    useRender(() => {\r\n      return (\r\n        <>\r\n          <YLayer\r\n            v-model={active.value}\r\n            classes={classes.value}\r\n            content-styles={styles.value}\r\n            scrim={props.scrim}\r\n            modal\r\n            close-click-scrim={props.closeClickScrim}\r\n            ref={layer$}\r\n          >\r\n            {{\r\n              default: (...args: any[]) => slots.default?.(...args),\r\n              base: slots.base,\r\n            }}\r\n          </YLayer>\r\n        </>\r\n      );\r\n    });\r\n\r\n    return {\r\n      active,\r\n      layer: layer$,\r\n      classes,\r\n    };\r\n  },\r\n});\r\n"],"mappings":"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"}
+{"version":3,"file":"YDialog.mjs","names":["computed","defineComponent","getCurrentInstance","ref","shallowRef","watch","useModelDuplex","useRender","toStyleSizeValue","bindClasses","YCard","YLayer","useActiveStack","YDialog","name","components","props","modelValue","type","Boolean","persistent","default","dialogClasses","Array","String","Object","closeClickScrim","disabled","maximized","scrim","offset","emits","setup","_ref","emit","slots","vm","$yuyeon","appContext","config","globalProperties","active","classes","boundClasses","computedOffset","paddingTop","styles","value","layer$","children","onFocusin","e","prevTarget","relatedTarget","target","testChildrenContains","layers","some","layer","content$","contains","document","includes","focusableSelector","focusables","querySelectorAll","filter","el","hasAttribute","matches","length","firstChild","lastChild","focus","installFocusTrap","addEventListener","dismantleFocusTrap","removeEventListener","tempScrollTop","tempScrollLeft","preventInteractionBackground","toggle","root$","root","activeLayers","getActiveLayers","filtered","ctx","modal","classList","scrollTop","documentElement","scrollLeft","add","style","top","left","isMe","remove","onUpdate","v","onClick","currentActive","baseEl","neo","old","immediate","_createVNode","_Fragment","$event","_len","arguments","args","_key","base"],"sources":["../../../src/components/dialog/YDialog.tsx"],"sourcesContent":["import type { PropType } from 'vue';\nimport { computed, defineComponent, getCurrentInstance, nextTick, ref, shallowRef, watch } from 'vue';\n\n\n\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { toStyleSizeValue } from '../../util';\nimport { bindClasses } from '../../util/vue-component';\nimport { YCard } from '../card';\nimport { YLayer } from '../layer';\nimport { useActiveStack } from '../layer/active-stack';\n\n\n\nimport './YDialog.scss';\n\n\nexport const YDialog = defineComponent({\n  name: 'YDialog',\n  components: {\n    YLayer,\n    YCard,\n  },\n  props: {\n    modelValue: {\n      type: Boolean as PropType<boolean>,\n    },\n    persistent: {\n      type: Boolean as PropType<boolean>,\n      default: true,\n    },\n    dialogClasses: {\n      type: [Array, String, Object] as PropType<\n        string[] | string | Record<string, any>\n      >,\n    },\n    closeClickScrim: {\n      type: Boolean as PropType<boolean>,\n    },\n    disabled: Boolean as PropType<boolean>,\n    maximized: Boolean as PropType<boolean>,\n    scrim: {\n      type: Boolean as PropType<boolean>,\n      default: true,\n    },\n    offset: {\n      type: String as PropType<string>,\n    },\n  },\n  emits: ['update:modelValue'],\n  setup(props, { emit, slots }) {\n    const vm = getCurrentInstance();\n    const $yuyeon = vm?.appContext.config.globalProperties.$yuyeon;\n    const active = useModelDuplex(props);\n\n    const classes = computed(() => {\n      const boundClasses = bindClasses(props.dialogClasses);\n      return {\n        ...boundClasses,\n        'y-dialog': true,\n        'y-dialog--maximized': props.maximized,\n      };\n    });\n\n    const computedOffset = computed(() => {\n      return {\n        paddingTop: toStyleSizeValue(props.offset),\n      };\n    });\n\n    const styles = computed(() => {\n      return {\n        ...computedOffset.value,\n      };\n    });\n\n    const layer$ = ref<typeof YLayer>();\n    const { children } = useActiveStack(layer$, active, shallowRef(true));\n    function onFocusin(e: FocusEvent) {\n      const prevTarget = e.relatedTarget as HTMLElement | null;\n      const target = e.target as HTMLElement | null;\n\n      function testChildrenContains(layers: YLayer[]) {\n        return layers.some((layer) => {\n          return !layer.content$?.contains(target);\n        });\n      }\n\n      if (\n        prevTarget !== target &&\n        layer$.value?.content$ &&\n        ![document, layer$.value?.content$].includes(target) &&\n        !layer$.value?.content$.contains(target) &&\n        !testChildrenContains(children.value)\n      ) {\n        const focusableSelector =\n          'button, [href], input:not([type=\"hidden\"]), select, textarea, [tabindex]:not([tabindex=\"-1\"])';\n        const focusables = [\n          ...layer$.value.content$.querySelectorAll(focusableSelector),\n        ].filter(\n          (el) =>\n            !el.hasAttribute('disabled') && !el.matches('[tabindex=\"-1\"]'),\n        ) as HTMLElement[];\n        if (!focusables.length) return;\n        const firstChild = focusables[0];\n        const lastChild = focusables[focusables.length - 1];\n        if (firstChild === lastChild) {\n          lastChild.focus();\n        } else {\n          firstChild.focus();\n        }\n      }\n    }\n\n    function installFocusTrap() {\n      document.addEventListener('focusin', onFocusin);\n    }\n\n    function dismantleFocusTrap() {\n      document.removeEventListener('focusin', onFocusin);\n    }\n\n    const tempScrollTop = ref(0);\n    const tempScrollLeft = ref(0);\n\n    function preventInteractionBackground(toggle: boolean) {\n      const root$ = $yuyeon.root as HTMLElement;\n      const activeLayers = layer$.value?.getActiveLayers();\n      if (toggle) {\n        const filtered = activeLayers?.filter((layer: any) => {\n          return layer.ctx.modal;\n        });\n        if (\n          (filtered && !filtered.length) ||\n          !root$.classList.contains('y-dialog--virtual-scroll')\n        ) {\n          const scrollTop = document.documentElement.scrollTop;\n          const scrollLeft = document.documentElement.scrollLeft;\n          tempScrollTop.value = scrollTop;\n          tempScrollLeft.value = scrollLeft;\n          document.documentElement.classList.add('y-dialog--prevent-scroll');\n          root$.classList.add('y-dialog--virtual-scroll');\n          root$.style.top = toStyleSizeValue(-1 * scrollTop) || '';\n          root$.style.left = toStyleSizeValue(-1 * scrollLeft) || '';\n        }\n      } else {\n        const filtered = activeLayers?.filter((layer: any) => {\n          return !layer$.value?.isMe(layer) && layer.ctx.modal;\n        });\n        if (filtered && !filtered.length) {\n          root$.classList.remove('y-dialog--virtual-scroll');\n          document.documentElement.classList.remove('y-dialog--prevent-scroll');\n          root$.style.top = '';\n          root$.style.left = '';\n          document.documentElement.scrollTop = tempScrollTop.value;\n          document.documentElement.scrollLeft = tempScrollLeft.value;\n        }\n      }\n    }\n\n    function onUpdate(v: boolean) {\n      active.value = v;\n    }\n\n    function onClick(e: MouseEvent) {\n      const currentActive = active.value;\n      if (!props.disabled) {\n        active.value = !currentActive;\n      }\n    }\n\n    watch(\n      () => layer$.value?.baseEl,\n      (neo, old) => {\n        if (neo) {\n          neo.addEventListener('click', onClick);\n        } else if (old) {\n          old.removeEventListener('click', onClick);\n        }\n      },\n    );\n\n    watch(\n      () => active.value,\n      (neo) => {\n        neo ? installFocusTrap() : dismantleFocusTrap();\n        preventInteractionBackground(neo);\n      },\n      { immediate: true },\n    );\n\n    useRender(() => {\n      return (\n        <>\n          <YLayer\n            v-model={active.value}\n            classes={classes.value}\n            content-styles={styles.value}\n            scrim={props.scrim}\n            modal\n            close-click-scrim={props.closeClickScrim}\n            ref={layer$}\n          >\n            {{\n              default: (...args: any[]) => slots.default?.(...args),\n              base: slots.base,\n            }}\n          </YLayer>\n        </>\n      );\n    });\n\n    return {\n      active,\n      layer: layer$,\n      classes,\n    };\n  },\n});\n"],"mappings":"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"}

package/lib/components/dialog/YDialog.scss

@@ -46,4 +46,6 @@
 }
 .y-dialog--virtual-scroll {
   position: fixed !important;
+  width: 100%;
+  height: 100%;
 }

package/lib/components/input/YInput.mjs

@@ -186,7 +186,8 @@ export const YInput = defineComponent({
       }, [_createTextVNode("*")])]) : props.placeholder && !inValue.value && props.placeholder]);
     }
     expose({
-      createLabel
+      createLabel,
+      invokeValidators
     });
     useRender(() => {
       return _createVNode("div", {
@@ -229,7 +230,7 @@ export const YInput = defineComponent({
       }, [slots['helper-text'] ? _createVNode("span", null, [slots['helper-text']({
         error: isError.value,
         errorResult: errorResult.value
-      })]) : errorResult.value])]), slots.append ? () => _createVNode("div", {
+      })]) : props.helperText ?? errorResult.value])]), slots.append ? () => _createVNode("div", {
         "class": `${NAME}__append`
       }, [_createTextVNode("slots.append()")]) : undefined]);
     });
@@ -239,7 +240,8 @@ export const YInput = defineComponent({
       focusedClasses,
       whenFocus,
       whenBlur,
-      createLabel
+      createLabel,
+      invokeValidators
     };
   }
 });

package/lib/components/input/YInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YInput.mjs","names":["computed","defineComponent","ref","shallowRef","watch","useRender","pressFocusPropsOptions","useFocus","pressThemePropsOptions","useLocalTheme","pressValidationPropsOptions","useValidation","getUid","toStyleSizeValue","propsFactory","NAME","uidCounter","pressYInputPropsOptions","name","String","width","type","Number","height","displayTag","default","label","modelValue","Array","Object","autoSelect","Boolean","floating","floated","placeholder","required","loading","variation","outlined","filled","ceramic","YInput","props","emits","slots","setup","_ref","attrs","expose","emit","UID","themeClasses","focused","isFocused","focusedClasses","whenFocus","whenBlur","invokeValidators","isError","isSuccess","errorResult","stack$","display$","inValue","lazyValue","hasMouseDown","variations","split","map","value","trim","isFloatedLabel","classes","includes","readonly","disabled","displayStyles","formLoading","neo","onClick","event","onMousedown","e","onMouseup","onFocus","onBlur","onClickLeading","onChange","createLabel","show","undefined","_createVNode","_Fragment","_createTextVNode","prepend","leading","error","attrId","toString","trailing","append"],"sources":["../../../src/components/input/YInput.tsx"],"sourcesContent":["import {\n  PropType,\n  SlotsType,\n  VNode,\n  computed,\n  defineComponent,\n  ref,\n  shallowRef,\n  watch,\n} from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { pressFocusPropsOptions, useFocus } from '../../composables/focus';\nimport { pressThemePropsOptions, useLocalTheme } from '../../composables/theme';\nimport {\n  pressValidationPropsOptions,\n  useValidation,\n} from '../../composables/validation';\nimport { getUid, toStyleSizeValue } from '../../util';\nimport { propsFactory } from '../../util/vue-component';\n\nimport './YInput.scss';\n\nconst NAME = 'y-input';\nlet uidCounter = 0;\n\nexport const pressYInputPropsOptions = propsFactory(\n  {\n    name: String,\n    width: {\n      type: [String, Number] as PropType<string | number>,\n    },\n    height: [Number, String],\n    displayTag: {\n      type: String as PropType<string>,\n      default: 'div',\n    },\n    label: String as PropType<string>,\n    modelValue: { type: [String, Number, Array, Object] as PropType<any> },\n    autoSelect: {\n      type: Boolean as PropType<boolean>,\n      default: true,\n    },\n    floating: { type: Boolean as PropType<boolean>, default: false },\n    floated: { type: Boolean as PropType<boolean>, default: () => false },\n    placeholder: String as PropType<string>,\n    required: Boolean as PropType<boolean>,\n    loading: Boolean as PropType<boolean>,\n    // variations\n    variation: String as PropType<string>,\n    outlined: Boolean as PropType<boolean>,\n    filled: Boolean as PropType<boolean>,\n    ceramic: Boolean as PropType<boolean>,\n    // validate\n    ...pressValidationPropsOptions(),\n    ...pressFocusPropsOptions(),\n  },\n  'YInput',\n);\n\nexport const YInput = defineComponent({\n  name: 'YInput',\n  props: {\n    ...pressThemePropsOptions(),\n    ...pressYInputPropsOptions(),\n  },\n  emits: [\n    'error',\n    'click',\n    'mousedown',\n    'mouseup',\n    'focus',\n    'blur',\n    'mousedown:display',\n    'mouseup:display',\n    'click:leading',\n    'update:modelValue',\n    'update:focused',\n  ],\n  slots: Object as SlotsType<{\n    prepend: any;\n    append: any;\n    label: any;\n    default: { value: any; formLoading: boolean; attrId: string };\n    leading: { error: boolean };\n    trailing: any;\n    'helper-text': { error: boolean; errorResult: string | undefined };\n  }>,\n  setup(props, { slots, attrs, expose, emit }) {\n    const UID = getUid();\n    const { themeClasses } = useLocalTheme(props);\n    const {\n      focused: isFocused,\n      focusedClasses,\n      whenFocus,\n      whenBlur,\n    } = useFocus(props, 'y-input');\n\n    const { invokeValidators, isError, isSuccess, errorResult } = useValidation(\n      props,\n      NAME,\n      UID,\n    );\n\n    const stack$ = ref();\n    const display$ = ref();\n\n    const inValue = ref();\n    const lazyValue = ref();\n    const hasMouseDown = shallowRef(false);\n\n    const variations = computed(() => {\n      if (props.variation) {\n        return props.variation.split(',').map((value) => {\n          return value.trim();\n        });\n      }\n      return [];\n    });\n\n    const isFloatedLabel = computed(() => {\n      return (\n        props.floated ||\n        !!props.placeholder ||\n        (!props.placeholder && isFocused.value) ||\n        !!inValue.value\n      );\n    });\n\n    const classes = computed(() => {\n      return {\n        'y-input--ceramic': !!props.ceramic,\n        'y-input--outlined':\n          !props.ceramic &&\n          (variations.value.includes('outlined') || !!props.outlined),\n        'y-input--filled':\n          variations.value.includes('filled') || !!props.filled,\n        'y-input--focused': isFocused.value,\n        'y-input--readonly': !!props.readonly,\n        'y-input--has-value': !!inValue.value,\n        'y-input--disabled': !!props.disabled,\n        'y-input--error': isError.value,\n        'y-input--success': isSuccess.value,\n        [themeClasses.value as string]: true,\n      };\n    });\n\n    const displayStyles = computed<Record<string, any>>(() => {\n      return {\n        width: toStyleSizeValue(props.width),\n        height: toStyleSizeValue(props.height),\n      };\n    });\n\n    const formLoading = computed(() => {\n      // TODO: composable `form` binding\n      // const form$ = (this as any)?.form$ as any;\n      // if (form$) {\n      //   return form$.loading;\n      // }\n      return false;\n    });\n\n    watch(\n      () => props.modelValue,\n      (neo) => {\n        inValue.value = neo;\n      },\n    );\n\n    watch(\n      () => props.readonly,\n      (neo) => {\n        if (!neo) {\n          inValue.value = props.modelValue;\n        }\n      },\n    );\n\n    watch(inValue, (neo) => {\n      if (!props.readonly) {\n        emit('update:modelValue', neo);\n      }\n    });\n\n    watch(isError, (neo) => {\n      emit('error', neo);\n    });\n\n    watch(\n      () => props.focused,\n      (neo) => {\n        if (!neo) {\n          invokeValidators();\n        }\n      },\n    );\n\n    function onClick(event: MouseEvent) {\n      emit('click', event);\n    }\n\n    function onMousedown(e: Event) {\n      hasMouseDown.value = true;\n      emit('mousedown:display', e);\n    }\n\n    function onMouseup(e: Event) {\n      hasMouseDown.value = false;\n      emit('mouseup:display', e);\n    }\n\n    function onFocus(event: FocusEvent) {\n      whenFocus();\n      emit('focus', event);\n    }\n\n    function onBlur(event: FocusEvent) {\n      whenBlur();\n      invokeValidators();\n      emit('blur', event);\n    }\n\n    function onClickLeading(event: MouseEvent) {\n      emit('click:leading', event);\n    }\n\n    function onChange(event?: Event) {\n      invokeValidators();\n    }\n\n    function createLabel(): VNode | undefined {\n      const show = !!props.label || !!slots.label;\n      if (!show) {\n        return undefined;\n      }\n      return (\n        <label\n          class={[\n            {\n              [`${NAME}__label`]: true,\n              'y-input__floating-label': props.floating,\n              'y-input__floating-label--floated':\n                props.floating && isFloatedLabel.value,\n            },\n          ]}\n          for={`y-input--${UID}`}\n        >\n          {slots.label ? (\n            slots.label()\n          ) : props.label ? (\n            <>\n              {props.label}\n              {props.required && (\n                <span class={'y-input__required-mark'}>*</span>\n              )}\n            </>\n          ) : (\n            props.placeholder && !inValue.value && props.placeholder\n          )}\n        </label>\n      );\n    }\n\n    expose({\n      createLabel,\n    });\n\n    useRender(() => {\n      return (\n        <div class={[`${NAME}`, { ...classes.value }]}>\n          {slots.prepend\n            ? () => <div class={`${NAME}__prepend`}>slots.prepend()</div>\n            : undefined}\n          <div ref={stack$} class={[`${NAME}__stack`]}>\n            {!props.floating && createLabel()}\n            <div\n              ref={display$}\n              class={`${NAME}__display`}\n              style={[{ ...displayStyles.value }]}\n              onClick={onClick}\n              onMousedown={onMousedown}\n              onMouseup={onMouseup}\n            >\n              <div class={`${NAME}__plate`}></div>\n              {slots.leading && (\n                <div class={'y-input__leading'} onClick={onClickLeading}>\n                  {slots.leading({ error: isError.value })}\n                </div>\n              )}\n              {slots.default ? (\n                slots.default({\n                  value: props.modelValue,\n                  formLoading: formLoading.value,\n                  attrId: `y-input--${UID}`,\n                })\n              ) : (\n                <div\n                  class={`${NAME}__value`}\n                  data-id={`y-input--${UID}`}\n                  tabindex={0}\n                  onFocus={onFocus}\n                  onBlur={onBlur}\n                >\n                  {props.floating && createLabel()}\n                  {props.modelValue?.toString()}\n                </div>\n              )}\n              {slots.trailing?.()}\n            </div>\n            <div class={`${NAME}__helper-text`}>\n              {slots['helper-text'] ? (\n                <span>\n                  {slots['helper-text']({\n                    error: isError.value,\n                    errorResult: errorResult.value,\n                  })}\n                </span>\n              ) : (\n                errorResult.value\n              )}\n            </div>\n          </div>\n          {slots.append\n            ? () => <div class={`${NAME}__append`}>slots.append()</div>\n            : undefined}\n        </div>\n      );\n    });\n\n    return {\n      themeClasses,\n      isFocused,\n      focusedClasses,\n      whenFocus,\n      whenBlur,\n      createLabel,\n    };\n  },\n});\n\nexport type YInput = InstanceType<typeof YInput>;\n"],"mappings":"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"}
+{"version":3,"file":"YInput.mjs","names":["computed","defineComponent","ref","shallowRef","watch","useRender","pressFocusPropsOptions","useFocus","pressThemePropsOptions","useLocalTheme","pressValidationPropsOptions","useValidation","getUid","toStyleSizeValue","propsFactory","NAME","uidCounter","pressYInputPropsOptions","name","String","width","type","Number","height","displayTag","default","label","modelValue","Array","Object","autoSelect","Boolean","floating","floated","placeholder","required","loading","variation","outlined","filled","ceramic","YInput","props","emits","slots","setup","_ref","attrs","expose","emit","UID","themeClasses","focused","isFocused","focusedClasses","whenFocus","whenBlur","invokeValidators","isError","isSuccess","errorResult","stack$","display$","inValue","lazyValue","hasMouseDown","variations","split","map","value","trim","isFloatedLabel","classes","includes","readonly","disabled","displayStyles","formLoading","neo","onClick","event","onMousedown","e","onMouseup","onFocus","onBlur","onClickLeading","onChange","createLabel","show","undefined","_createVNode","_Fragment","_createTextVNode","prepend","leading","error","attrId","toString","trailing","helperText","append"],"sources":["../../../src/components/input/YInput.tsx"],"sourcesContent":["import {\n  PropType,\n  SlotsType,\n  VNode,\n  computed,\n  defineComponent,\n  ref,\n  shallowRef,\n  watch,\n} from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { pressFocusPropsOptions, useFocus } from '../../composables/focus';\nimport { pressThemePropsOptions, useLocalTheme } from '../../composables/theme';\nimport {\n  pressValidationPropsOptions,\n  useValidation,\n} from '../../composables/validation';\nimport { getUid, toStyleSizeValue } from '../../util';\nimport { propsFactory } from '../../util/vue-component';\n\nimport './YInput.scss';\n\nconst NAME = 'y-input';\nlet uidCounter = 0;\n\nexport const pressYInputPropsOptions = propsFactory(\n  {\n    name: String,\n    width: {\n      type: [String, Number] as PropType<string | number>,\n    },\n    height: [Number, String],\n    displayTag: {\n      type: String as PropType<string>,\n      default: 'div',\n    },\n    label: String as PropType<string>,\n    modelValue: { type: [String, Number, Array, Object] as PropType<any> },\n    autoSelect: {\n      type: Boolean as PropType<boolean>,\n      default: true,\n    },\n    floating: { type: Boolean as PropType<boolean>, default: false },\n    floated: { type: Boolean as PropType<boolean>, default: () => false },\n    placeholder: String as PropType<string>,\n    required: Boolean as PropType<boolean>,\n    loading: Boolean as PropType<boolean>,\n    // variations\n    variation: String as PropType<string>,\n    outlined: Boolean as PropType<boolean>,\n    filled: Boolean as PropType<boolean>,\n    ceramic: Boolean as PropType<boolean>,\n    // validate\n    ...pressValidationPropsOptions(),\n    ...pressFocusPropsOptions(),\n  },\n  'YInput',\n);\n\nexport const YInput = defineComponent({\n  name: 'YInput',\n  props: {\n    ...pressThemePropsOptions(),\n    ...pressYInputPropsOptions(),\n  },\n  emits: [\n    'error',\n    'click',\n    'mousedown',\n    'mouseup',\n    'focus',\n    'blur',\n    'mousedown:display',\n    'mouseup:display',\n    'click:leading',\n    'update:modelValue',\n    'update:focused',\n  ],\n  slots: Object as SlotsType<{\n    prepend: any;\n    append: any;\n    label: any;\n    default: { value: any; formLoading: boolean; attrId: string };\n    leading: { error: boolean };\n    trailing: any;\n    'helper-text': { error: boolean; errorResult: string | undefined };\n  }>,\n  setup(props, { slots, attrs, expose, emit }) {\n    const UID = getUid();\n    const { themeClasses } = useLocalTheme(props);\n    const {\n      focused: isFocused,\n      focusedClasses,\n      whenFocus,\n      whenBlur,\n    } = useFocus(props, 'y-input');\n\n    const { invokeValidators, isError, isSuccess, errorResult } = useValidation(\n      props,\n      NAME,\n      UID,\n    );\n\n    const stack$ = ref();\n    const display$ = ref();\n\n    const inValue = ref();\n    const lazyValue = ref();\n    const hasMouseDown = shallowRef(false);\n\n    const variations = computed(() => {\n      if (props.variation) {\n        return props.variation.split(',').map((value) => {\n          return value.trim();\n        });\n      }\n      return [];\n    });\n\n    const isFloatedLabel = computed(() => {\n      return (\n        props.floated ||\n        !!props.placeholder ||\n        (!props.placeholder && isFocused.value) ||\n        !!inValue.value\n      );\n    });\n\n    const classes = computed(() => {\n      return {\n        'y-input--ceramic': !!props.ceramic,\n        'y-input--outlined':\n          !props.ceramic &&\n          (variations.value.includes('outlined') || !!props.outlined),\n        'y-input--filled':\n          variations.value.includes('filled') || !!props.filled,\n        'y-input--focused': isFocused.value,\n        'y-input--readonly': !!props.readonly,\n        'y-input--has-value': !!inValue.value,\n        'y-input--disabled': !!props.disabled,\n        'y-input--error': isError.value,\n        'y-input--success': isSuccess.value,\n        [themeClasses.value as string]: true,\n      };\n    });\n\n    const displayStyles = computed<Record<string, any>>(() => {\n      return {\n        width: toStyleSizeValue(props.width),\n        height: toStyleSizeValue(props.height),\n      };\n    });\n\n    const formLoading = computed(() => {\n      // TODO: composable `form` binding\n      // const form$ = (this as any)?.form$ as any;\n      // if (form$) {\n      //   return form$.loading;\n      // }\n      return false;\n    });\n\n    watch(\n      () => props.modelValue,\n      (neo) => {\n        inValue.value = neo;\n      },\n    );\n\n    watch(\n      () => props.readonly,\n      (neo) => {\n        if (!neo) {\n          inValue.value = props.modelValue;\n        }\n      },\n    );\n\n    watch(inValue, (neo) => {\n      if (!props.readonly) {\n        emit('update:modelValue', neo);\n      }\n    });\n\n    watch(isError, (neo) => {\n      emit('error', neo);\n    });\n\n    watch(\n      () => props.focused,\n      (neo) => {\n        if (!neo) {\n          invokeValidators();\n        }\n      },\n    );\n\n    function onClick(event: MouseEvent) {\n      emit('click', event);\n    }\n\n    function onMousedown(e: Event) {\n      hasMouseDown.value = true;\n      emit('mousedown:display', e);\n    }\n\n    function onMouseup(e: Event) {\n      hasMouseDown.value = false;\n      emit('mouseup:display', e);\n    }\n\n    function onFocus(event: FocusEvent) {\n      whenFocus();\n      emit('focus', event);\n    }\n\n    function onBlur(event: FocusEvent) {\n      whenBlur();\n      invokeValidators();\n      emit('blur', event);\n    }\n\n    function onClickLeading(event: MouseEvent) {\n      emit('click:leading', event);\n    }\n\n    function onChange(event?: Event) {\n      invokeValidators();\n    }\n\n    function createLabel(): VNode | undefined {\n      const show = !!props.label || !!slots.label;\n      if (!show) {\n        return undefined;\n      }\n      return (\n        <label\n          class={[\n            {\n              [`${NAME}__label`]: true,\n              'y-input__floating-label': props.floating,\n              'y-input__floating-label--floated':\n                props.floating && isFloatedLabel.value,\n            },\n          ]}\n          for={`y-input--${UID}`}\n        >\n          {slots.label ? (\n            slots.label()\n          ) : props.label ? (\n            <>\n              {props.label}\n              {props.required && (\n                <span class={'y-input__required-mark'}>*</span>\n              )}\n            </>\n          ) : (\n            props.placeholder && !inValue.value && props.placeholder\n          )}\n        </label>\n      );\n    }\n\n    expose({\n      createLabel,\n      invokeValidators,\n    });\n\n    useRender(() => {\n      return (\n        <div class={[`${NAME}`, { ...classes.value }]}>\n          {slots.prepend\n            ? () => <div class={`${NAME}__prepend`}>slots.prepend()</div>\n            : undefined}\n          <div ref={stack$} class={[`${NAME}__stack`]}>\n            {!props.floating && createLabel()}\n            <div\n              ref={display$}\n              class={`${NAME}__display`}\n              style={[{ ...displayStyles.value }]}\n              onClick={onClick}\n              onMousedown={onMousedown}\n              onMouseup={onMouseup}\n            >\n              <div class={`${NAME}__plate`}></div>\n              {slots.leading && (\n                <div class={'y-input__leading'} onClick={onClickLeading}>\n                  {slots.leading({ error: isError.value })}\n                </div>\n              )}\n              {slots.default ? (\n                slots.default({\n                  value: props.modelValue,\n                  formLoading: formLoading.value,\n                  attrId: `y-input--${UID}`,\n                })\n              ) : (\n                <div\n                  class={`${NAME}__value`}\n                  data-id={`y-input--${UID}`}\n                  tabindex={0}\n                  onFocus={onFocus}\n                  onBlur={onBlur}\n                >\n                  {props.floating && createLabel()}\n                  {props.modelValue?.toString()}\n                </div>\n              )}\n              {slots.trailing?.()}\n            </div>\n            <div class={`${NAME}__helper-text`}>\n              {slots['helper-text'] ? (\n                <span>\n                  {slots['helper-text']({\n                    error: isError.value,\n                    errorResult: errorResult.value,\n                  })}\n                </span>\n              ) : (\n                props.helperText ?? errorResult.value\n              )}\n            </div>\n          </div>\n          {slots.append\n            ? () => <div class={`${NAME}__append`}>slots.append()</div>\n            : undefined}\n        </div>\n      );\n    });\n\n    return {\n      themeClasses,\n      isFocused,\n      focusedClasses,\n      whenFocus,\n      whenBlur,\n      createLabel,\n      invokeValidators,\n    };\n  },\n});\n\nexport type YInput = InstanceType<typeof YInput>;\n"],"mappings":";AAAA,SAIEA,QAAQ,EACRC,eAAe,EACfC,GAAG,EACHC,UAAU,EACVC,KAAK,QACA,KAAK;AAAC,SAEJC,SAAS;AAAA,SACTC,sBAAsB,EAAEC,QAAQ;AAAA,SAChCC,sBAAsB,EAAEC,aAAa;AAAA,SAE5CC,2BAA2B,EAC3BC,aAAa;AAAA,SAENC,MAAM,EAAEC,gBAAgB;AAAA,SACxBC,YAAY;AAErB;AAEA,MAAMC,IAAI,GAAG,SAAS;AACtB,IAAIC,UAAU,GAAG,CAAC;AAElB,OAAO,MAAMC,uBAAuB,GAAGH,YAAY,CACjD;EACEI,IAAI,EAAEC,MAAM;EACZC,KAAK,EAAE;IACLC,IAAI,EAAE,CAACF,MAAM,EAAEG,MAAM;EACvB,CAAC;EACDC,MAAM,EAAE,CAACD,MAAM,EAAEH,MAAM,CAAC;EACxBK,UAAU,EAAE;IACVH,IAAI,EAAEF,MAA0B;IAChCM,OAAO,EAAE;EACX,CAAC;EACDC,KAAK,EAAEP,MAA0B;EACjCQ,UAAU,EAAE;IAAEN,IAAI,EAAE,CAACF,MAAM,EAAEG,MAAM,EAAEM,KAAK,EAAEC,MAAM;EAAmB,CAAC;EACtEC,UAAU,EAAE;IACVT,IAAI,EAAEU,OAA4B;IAClCN,OAAO,EAAE;EACX,CAAC;EACDO,QAAQ,EAAE;IAAEX,IAAI,EAAEU,OAA4B;IAAEN,OAAO,EAAE;EAAM,CAAC;EAChEQ,OAAO,EAAE;IAAEZ,IAAI,EAAEU,OAA4B;IAAEN,OAAO,EAAEA,CAAA,KAAM;EAAM,CAAC;EACrES,WAAW,EAAEf,MAA0B;EACvCgB,QAAQ,EAAEJ,OAA4B;EACtCK,OAAO,EAAEL,OAA4B;EACrC;EACAM,SAAS,EAAElB,MAA0B;EACrCmB,QAAQ,EAAEP,OAA4B;EACtCQ,MAAM,EAAER,OAA4B;EACpCS,OAAO,EAAET,OAA4B;EACrC;EACA,GAAGrB,2BAA2B,CAAC,CAAC;EAChC,GAAGJ,sBAAsB,CAAC;AAC5B,CAAC,EACD,QACF,CAAC;AAED,OAAO,MAAMmC,MAAM,GAAGxC,eAAe,CAAC;EACpCiB,IAAI,EAAE,QAAQ;EACdwB,KAAK,EAAE;IACL,GAAGlC,sBAAsB,CAAC,CAAC;IAC3B,GAAGS,uBAAuB,CAAC;EAC7B,CAAC;EACD0B,KAAK,EAAE,CACL,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,gBAAgB,CACjB;EACDC,KAAK,EAAEf,MAQL;EACFgB,KAAKA,CAACH,KAAK,EAAAI,IAAA,EAAkC;IAAA,IAAhC;MAAEF,KAAK;MAAEG,KAAK;MAAEC,MAAM;MAAEC;IAAK,CAAC,GAAAH,IAAA;IACzC,MAAMI,GAAG,GAAGtC,MAAM,CAAC,CAAC;IACpB,MAAM;MAAEuC;IAAa,CAAC,GAAG1C,aAAa,CAACiC,KAAK,CAAC;IAC7C,MAAM;MACJU,OAAO,EAAEC,SAAS;MAClBC,cAAc;MACdC,SAAS;MACTC;IACF,CAAC,GAAGjD,QAAQ,CAACmC,KAAK,EAAE,SAAS,CAAC;IAE9B,MAAM;MAAEe,gBAAgB;MAAEC,OAAO;MAAEC,SAAS;MAAEC;IAAY,CAAC,GAAGjD,aAAa,CACzE+B,KAAK,EACL3B,IAAI,EACJmC,GACF,CAAC;IAED,MAAMW,MAAM,GAAG3D,GAAG,CAAC,CAAC;IACpB,MAAM4D,QAAQ,GAAG5D,GAAG,CAAC,CAAC;IAEtB,MAAM6D,OAAO,GAAG7D,GAAG,CAAC,CAAC;IACrB,MAAM8D,SAAS,GAAG9D,GAAG,CAAC,CAAC;IACvB,MAAM+D,YAAY,GAAG9D,UAAU,CAAC,KAAK,CAAC;IAEtC,MAAM+D,UAAU,GAAGlE,QAAQ,CAAC,MAAM;MAChC,IAAI0C,KAAK,CAACL,SAAS,EAAE;QACnB,OAAOK,KAAK,CAACL,SAAS,CAAC8B,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAEC,KAAK,IAAK;UAC/C,OAAOA,KAAK,CAACC,IAAI,CAAC,CAAC;QACrB,CAAC,CAAC;MACJ;MACA,OAAO,EAAE;IACX,CAAC,CAAC;IAEF,MAAMC,cAAc,GAAGvE,QAAQ,CAAC,MAAM;MACpC,OACE0C,KAAK,CAACT,OAAO,IACb,CAAC,CAACS,KAAK,CAACR,WAAW,IAClB,CAACQ,KAAK,CAACR,WAAW,IAAImB,SAAS,CAACgB,KAAM,IACvC,CAAC,CAACN,OAAO,CAACM,KAAK;IAEnB,CAAC,CAAC;IAEF,MAAMG,OAAO,GAAGxE,QAAQ,CAAC,MAAM;MAC7B,OAAO;QACL,kBAAkB,EAAE,CAAC,CAAC0C,KAAK,CAACF,OAAO;QACnC,mBAAmB,EACjB,CAACE,KAAK,CAACF,OAAO,KACb0B,UAAU,CAACG,KAAK,CAACI,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC/B,KAAK,CAACJ,QAAQ,CAAC;QAC7D,iBAAiB,EACf4B,UAAU,CAACG,KAAK,CAACI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC/B,KAAK,CAACH,MAAM;QACvD,kBAAkB,EAAEc,SAAS,CAACgB,KAAK;QACnC,mBAAmB,EAAE,CAAC,CAAC3B,KAAK,CAACgC,QAAQ;QACrC,oBAAoB,EAAE,CAAC,CAACX,OAAO,CAACM,KAAK;QACrC,mBAAmB,EAAE,CAAC,CAAC3B,KAAK,CAACiC,QAAQ;QACrC,gBAAgB,EAAEjB,OAAO,CAACW,KAAK;QAC/B,kBAAkB,EAAEV,SAAS,CAACU,KAAK;QACnC,CAAClB,YAAY,CAACkB,KAAK,GAAa;MAClC,CAAC;IACH,CAAC,CAAC;IAEF,MAAMO,aAAa,GAAG5E,QAAQ,CAAsB,MAAM;MACxD,OAAO;QACLoB,KAAK,EAAEP,gBAAgB,CAAC6B,KAAK,CAACtB,KAAK,CAAC;QACpCG,MAAM,EAAEV,gBAAgB,CAAC6B,KAAK,CAACnB,MAAM;MACvC,CAAC;IACH,CAAC,CAAC;IAEF,MAAMsD,WAAW,GAAG7E,QAAQ,CAAC,MAAM;MACjC;MACA;MACA;MACA;MACA;MACA,OAAO,KAAK;IACd,CAAC,CAAC;IAEFI,KAAK,CACH,MAAMsC,KAAK,CAACf,UAAU,EACrBmD,GAAG,IAAK;MACPf,OAAO,CAACM,KAAK,GAAGS,GAAG;IACrB,CACF,CAAC;IAED1E,KAAK,CACH,MAAMsC,KAAK,CAACgC,QAAQ,EACnBI,GAAG,IAAK;MACP,IAAI,CAACA,GAAG,EAAE;QACRf,OAAO,CAACM,KAAK,GAAG3B,KAAK,CAACf,UAAU;MAClC;IACF,CACF,CAAC;IAEDvB,KAAK,CAAC2D,OAAO,EAAGe,GAAG,IAAK;MACtB,IAAI,CAACpC,KAAK,CAACgC,QAAQ,EAAE;QACnBzB,IAAI,CAAC,mBAAmB,EAAE6B,GAAG,CAAC;MAChC;IACF,CAAC,CAAC;IAEF1E,KAAK,CAACsD,OAAO,EAAGoB,GAAG,IAAK;MACtB7B,IAAI,CAAC,OAAO,EAAE6B,GAAG,CAAC;IACpB,CAAC,CAAC;IAEF1E,KAAK,CACH,MAAMsC,KAAK,CAACU,OAAO,EAClB0B,GAAG,IAAK;MACP,IAAI,CAACA,GAAG,EAAE;QACRrB,gBAAgB,CAAC,CAAC;MACpB;IACF,CACF,CAAC;IAED,SAASsB,OAAOA,CAACC,KAAiB,EAAE;MAClC/B,IAAI,CAAC,OAAO,EAAE+B,KAAK,CAAC;IACtB;IAEA,SAASC,WAAWA,CAACC,CAAQ,EAAE;MAC7BjB,YAAY,CAACI,KAAK,GAAG,IAAI;MACzBpB,IAAI,CAAC,mBAAmB,EAAEiC,CAAC,CAAC;IAC9B;IAEA,SAASC,SAASA,CAACD,CAAQ,EAAE;MAC3BjB,YAAY,CAACI,KAAK,GAAG,KAAK;MAC1BpB,IAAI,CAAC,iBAAiB,EAAEiC,CAAC,CAAC;IAC5B;IAEA,SAASE,OAAOA,CAACJ,KAAiB,EAAE;MAClCzB,SAAS,CAAC,CAAC;MACXN,IAAI,CAAC,OAAO,EAAE+B,KAAK,CAAC;IACtB;IAEA,SAASK,MAAMA,CAACL,KAAiB,EAAE;MACjCxB,QAAQ,CAAC,CAAC;MACVC,gBAAgB,CAAC,CAAC;MAClBR,IAAI,CAAC,MAAM,EAAE+B,KAAK,CAAC;IACrB;IAEA,SAASM,cAAcA,CAACN,KAAiB,EAAE;MACzC/B,IAAI,CAAC,eAAe,EAAE+B,KAAK,CAAC;IAC9B;IAEA,SAASO,QAAQA,CAACP,KAAa,EAAE;MAC/BvB,gBAAgB,CAAC,CAAC;IACpB;IAEA,SAAS+B,WAAWA,CAAA,EAAsB;MACxC,MAAMC,IAAI,GAAG,CAAC,CAAC/C,KAAK,CAAChB,KAAK,IAAI,CAAC,CAACkB,KAAK,CAAClB,KAAK;MAC3C,IAAI,CAAC+D,IAAI,EAAE;QACT,OAAOC,SAAS;MAClB;MACA,OAAAC,YAAA;QAAA,SAEW,CACL;UACE,CAAE,GAAE5E,IAAK,SAAQ,GAAG,IAAI;UACxB,yBAAyB,EAAE2B,KAAK,CAACV,QAAQ;UACzC,kCAAkC,EAChCU,KAAK,CAACV,QAAQ,IAAIuC,cAAc,CAACF;QACrC,CAAC,CACF;QAAA,OACK,YAAWnB,GAAI;MAAC,IAErBN,KAAK,CAAClB,KAAK,GACVkB,KAAK,CAAClB,KAAK,CAAC,CAAC,GACXgB,KAAK,CAAChB,KAAK,GAAAiE,YAAA,CAAAC,SAAA,SAEVlD,KAAK,CAAChB,KAAK,EACXgB,KAAK,CAACP,QAAQ,IAAAwD,YAAA;QAAA,SACA;MAAwB,IAAAE,gBAAA,OACtC,KAGHnD,KAAK,CAACR,WAAW,IAAI,CAAC6B,OAAO,CAACM,KAAK,IAAI3B,KAAK,CAACR,WAC9C;IAGP;IAEAc,MAAM,CAAC;MACLwC,WAAW;MACX/B;IACF,CAAC,CAAC;IAEFpD,SAAS,CAAC,MAAM;MACd,OAAAsF,YAAA;QAAA,SACc,CAAE,GAAE5E,IAAK,EAAC,EAAE;UAAE,GAAGyD,OAAO,CAACH;QAAM,CAAC;MAAC,IAC1CzB,KAAK,CAACkD,OAAO,GACV,MAAAH,YAAA;QAAA,SAAmB,GAAE5E,IAAK;MAAU,IAAA8E,gBAAA,qBAAuB,GAC3DH,SAAS,EAAAC,YAAA;QAAA,OACH9B,MAAM;QAAA,SAAS,CAAE,GAAE9C,IAAK,SAAQ;MAAC,IACxC,CAAC2B,KAAK,CAACV,QAAQ,IAAIwD,WAAW,CAAC,CAAC,EAAAG,YAAA;QAAA,OAE1B7B,QAAQ;QAAA,SACL,GAAE/C,IAAK,WAAU;QAAA,SAClB,CAAC;UAAE,GAAG6D,aAAa,CAACP;QAAM,CAAC,CAAC;QAAA,WAC1BU,OAAO;QAAA,eACHE,WAAW;QAAA,aACbE;MAAS,IAAAQ,YAAA;QAAA,SAEP,GAAE5E,IAAK;MAAQ,UAC3B6B,KAAK,CAACmD,OAAO,IAAAJ,YAAA;QAAA,SACA,kBAAkB;QAAA,WAAWL;MAAc,IACpD1C,KAAK,CAACmD,OAAO,CAAC;QAAEC,KAAK,EAAEtC,OAAO,CAACW;MAAM,CAAC,CAAC,EAE3C,EACAzB,KAAK,CAACnB,OAAO,GACZmB,KAAK,CAACnB,OAAO,CAAC;QACZ4C,KAAK,EAAE3B,KAAK,CAACf,UAAU;QACvBkD,WAAW,EAAEA,WAAW,CAACR,KAAK;QAC9B4B,MAAM,EAAG,YAAW/C,GAAI;MAC1B,CAAC,CAAC,GAAAyC,YAAA;QAAA,SAGQ,GAAE5E,IAAK,SAAQ;QAAA,WACb,YAAWmC,GAAI,EAAC;QAAA,YAChB,CAAC;QAAA,WACFkC,OAAO;QAAA,UACRC;MAAM,IAEb3C,KAAK,CAACV,QAAQ,IAAIwD,WAAW,CAAC,CAAC,EAC/B9C,KAAK,CAACf,UAAU,EAAEuE,QAAQ,CAAC,CAAC,EAEhC,EACAtD,KAAK,CAACuD,QAAQ,GAAG,CAAC,IAAAR,YAAA;QAAA,SAER,GAAE5E,IAAK;MAAc,IAC/B6B,KAAK,CAAC,aAAa,CAAC,GAAA+C,YAAA,gBAEhB/C,KAAK,CAAC,aAAa,CAAC,CAAC;QACpBoD,KAAK,EAAEtC,OAAO,CAACW,KAAK;QACpBT,WAAW,EAAEA,WAAW,CAACS;MAC3B,CAAC,CAAC,KAGJ3B,KAAK,CAAC0D,UAAU,IAAIxC,WAAW,CAACS,KACjC,MAGJzB,KAAK,CAACyD,MAAM,GACT,MAAAV,YAAA;QAAA,SAAmB,GAAE5E,IAAK;MAAS,IAAA8E,gBAAA,oBAAsB,GACzDH,SAAS;IAGnB,CAAC,CAAC;IAEF,OAAO;MACLvC,YAAY;MACZE,SAAS;MACTC,cAAc;MACdC,SAAS;MACTC,QAAQ;MACRgC,WAAW;MACX/B;IACF,CAAC;EACH;AACF,CAAC,CAAC"}

package/lib/components/select/YSelect.mjs

@@ -199,6 +199,7 @@ export const YSelect = defineComponent({
               ref: fieldInputRef
             })
           }, {
+            "modelValue": model.value.map(v => v.props.value).join(', '),
             "validationValue": model.rxValue,
             "onMousedown:display": onMousedownDisplay,
             "onBlur": onBlur,

package/lib/components/select/YSelect.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YSelect.mjs","names":["shallowRef","nextTick","computed","defineComponent","mergeProps","onMounted","ref","useModelDuplex","useRender","pressCoordinateProps","pressListItemsPropsOptions","useItems","wrapInArray","deepEqual","getObjectValueByPath","omit","chooseProps","propsFactory","YCard","YFieldInput","pressYFieldInputPropsOptions","YIcon","YList","YListItem","YMenu","returnItemEquals","optionsItem","valueItem","valueKey","arguments","length","undefined","valueItemType","itemValue","pressSelectPropsOptions","opened","Boolean","multiple","weakEquals","valueEquals","type","Function","default","defaultSelect","menuProps","Object","pressYSelectPropsOptions","maxHeight","Number","String","dropdownIcon","Array","openDelay","closeDelay","position","YSelect","name","inheritAttrs","props","emits","value","click:item","item","e","slots","setup","_ref","attrs","expose","fieldInputRef","menuRef","listRef","focused","items","toRefineItems","toEmitItems","model","v","emitValue","selections","map","find","selected","selection","extraMenuProps","isSelected","selectedItem","onMousedownDisplay","event","disabled","onBlur","onClickItem","select","onAfterLeave","focus","closeCondition","target","layer$","content$","contains","index","findIndex","neo","slice","splice","displayText","text","join","baseEl","fieldInputProps","dropdownIconProps","_createVNode","_mergeProps","$event","offset","align","origin","base","_len","args","_key","rxValue","leading","_len2","_key2","trailing","menu","_createTextVNode","modelValue","isArray"],"sources":["../../../src/components/select/YSelect.tsx"],"sourcesContent":["import { shallowRef } from '@vue/runtime-core';\nimport { PropType, SlotsType, nextTick } from 'vue';\nimport { computed, defineComponent, mergeProps, onMounted, ref } from 'vue';\n\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { pressCoordinateProps } from '../../composables/coordinate';\nimport {\n  ListItem,\n  pressListItemsPropsOptions,\n  useItems,\n} from '../../composables/list-items';\nimport { wrapInArray } from '../../util/array';\nimport { deepEqual, getObjectValueByPath, omit } from '../../util/common';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YCard } from '../card';\nimport { YFieldInput, pressYFieldInputPropsOptions } from '../field-input';\nimport { YIcon, YIconIconProp } from '../icon';\nimport { YIconDropdown } from '../icons/YIconDropdown';\nimport { YList, YListItem } from '../list';\nimport { YMenu } from '../menu';\n\nimport './YSelect.scss';\n\nexport type SelectEquals = (\n  optionsItem: any,\n  valueItem: any,\n  valueKey?: string,\n) => boolean;\n\nexport function returnItemEquals(\n  optionsItem: any,\n  valueItem: any,\n  valueKey = 'value',\n) {\n  const valueItemType = typeof valueItem;\n  const itemValue =\n    valueItemType === 'string' || valueItemType === 'number'\n      ? getObjectValueByPath(optionsItem, valueKey)\n      : optionsItem;\n  return deepEqual(itemValue, valueItem);\n}\n\nexport const pressSelectPropsOptions = propsFactory(\n  {\n    opened: Boolean as PropType<boolean>,\n    multiple: Boolean,\n    weakEquals: Boolean,\n    valueEquals: {\n      type: Function as PropType<SelectEquals>,\n      default: deepEqual,\n    },\n    defaultSelect: Boolean,\n    menuProps: {\n      type: Object as PropType<YMenu['$props']>,\n    },\n    ...pressListItemsPropsOptions(),\n  },\n  'Select',\n);\n\nexport const pressYSelectPropsOptions = propsFactory(\n  {\n    maxHeight: {\n      type: [Number, String],\n      default: 310,\n    },\n    dropdownIcon: {\n      type: [String, Array, Object] as PropType<YIconIconProp>,\n      default: '$dropdown',\n    },\n    openDelay: {\n      type: Number as PropType<number>,\n      default: 200,\n    },\n    closeDelay: {\n      type: Number as PropType<number>,\n      default: 200,\n    },\n    ...pressSelectPropsOptions(),\n    ...pressYFieldInputPropsOptions(),\n    ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\n      'coordinateStrategy',\n    ]),\n  },\n  'YSelect',\n);\n\nexport const YSelect = defineComponent({\n  name: 'YSelect',\n  inheritAttrs: false,\n  props: {\n    ...pressYSelectPropsOptions(),\n  },\n  emits: {\n    'update:modelValue': (value: any) => true,\n    'update:opened': (opened: boolean) => true,\n    'click:item': (item: any, e: MouseEvent) => true,\n  },\n  slots: Object as SlotsType<{\n    base: any;\n    selection: any;\n    leading: any;\n    'helper-text': any;\n    menu: any;\n    'menu-prepend': any;\n    'menu-append': any;\n    'dropdown-icon': any;\n    item: { item: any; selected: boolean; select: () => void };\n  }>,\n  setup(props, { slots, attrs, expose }) {\n    const fieldInputRef = ref();\n    const menuRef = ref<InstanceType<typeof YMenu>>();\n    const listRef = ref<InstanceType<typeof YList>>();\n\n    const opened = useModelDuplex(props, 'opened');\n    const focused = shallowRef(false);\n\n    const { items, toRefineItems, toEmitItems } = useItems(props);\n    const model = useModelDuplex(\n      props,\n      'modelValue',\n      [],\n      (v) => toRefineItems(v === null ? [null] : wrapInArray(v)),\n      (v) => {\n        const emitValue = toEmitItems(wrapInArray(v));\n        return props.multiple ? emitValue : emitValue[0] ?? null;\n      },\n    );\n\n    const selections = computed<ListItem[]>(() => {\n      return model.value.map((v: any) => {\n        return items.value.find((item) => {\n          return props.valueEquals(item.value, v.value);\n        });\n      });\n    });\n\n    const selected = computed(() => {\n      return selections.value.map((selection) => selection.props.value);\n    });\n\n    const extraMenuProps = computed(() => {\n      return { ...props.menuProps };\n    });\n\n    function isSelected(item: ListItem) {\n      return !!selections.value.find((selectedItem) => {\n        return selectedItem?.value === item.value;\n      });\n    }\n\n    // Field\n    function onMousedownDisplay(event: MouseEvent) {\n      if (props.disabled) {\n        return;\n      }\n      opened.value = !opened.value;\n    }\n\n    function onBlur(event: FocusEvent) {\n      // if (listRef.value?.$el.contains(event.relatedTarget)) {\n      //   opened.value = false;\n      // }\n    }\n\n    // Menu Contents\n    function onClickItem(item: ListItem, e: MouseEvent) {\n      select(item);\n      if (!props.multiple) {\n        nextTick(() => {\n          opened.value = false;\n        });\n      }\n    }\n\n    function onAfterLeave() {\n      if (!focused.value) {\n        fieldInputRef.value?.focus();\n      }\n    }\n\n    function closeCondition(event: MouseEvent) {\n      if (event.target && (menuRef.value as any)?.layer$?.content$.value) {\n        return (event.target as HTMLElement)?.contains(\n          (menuRef.value as any)?.layer$?.content$.value,\n        );\n      }\n    }\n\n    function select(item: ListItem) {\n      if (props.multiple) {\n        const index = selections.value.findIndex((selectedItem) => {\n          return selectedItem.value === item.value;\n        });\n        if (index === -1) {\n          model.value = [...model.value, item];\n        } else {\n          const neo = model.value.slice();\n          neo.splice(index, 1);\n          model.value = neo;\n        }\n      } else {\n        model.value = [item];\n      }\n    }\n\n    const displayText = computed(() => {\n      if (props.multiple) {\n        return selections.value.map((item) => item.text).join(', ');\n      }\n      return selections.value?.[0]?.text ?? '';\n    });\n\n    const baseEl = computed(() => {\n      return menuRef.value?.baseEl;\n    });\n\n    useRender(() => {\n      const fieldInputProps = chooseProps(props, YFieldInput.props);\n      const dropdownIconProps = chooseProps(\n        typeof props.dropdownIcon === 'object' ? props.dropdownIcon : {},\n        YIcon.props,\n      );\n      return (\n        <YMenu\n          v-model={opened.value}\n          ref={menuRef}\n          offset={props.offset}\n          position={props.position}\n          align={props.align}\n          origin={props.origin}\n          content-classes={['y-select__content']}\n          maxHeight={props.maxHeight}\n          open-on-click-base={false}\n          onAfterLeave={onAfterLeave}\n          open-delay={props.openDelay}\n          close-delay={props.closeDelay}\n          closeCondition={closeCondition}\n          {...extraMenuProps.value}\n        >\n          {{\n            base: (...args: any[]) =>\n              slots.base ? (\n                slots.base?.(...args)\n              ) : (\n                <YFieldInput\n                  {...{\n                    ...fieldInputProps,\n                    ...mergeProps({ ...args[0].props }, { ref: fieldInputRef }),\n                  }}\n                  validationValue={model.rxValue}\n                  onMousedown:display={onMousedownDisplay}\n                  onBlur={onBlur}\n                  readonly\n                  class={['y-select', { 'y-select--opened': opened.value }]}\n                  {...attrs}\n                  focused={focused.value}\n                >\n                  {{\n                    default: () => {\n                      return (\n                        <div class={['y-select__selection']}>\n                          {slots.selection\n                            ? slots.selection?.()\n                            : displayText.value}\n                        </div>\n                      );\n                    },\n                    leading: slots.leading\n                      ? (...args: any[]) => slots.leading?.(...args)\n                      : undefined,\n                    trailing: (...args: any[]) => {\n                      return slots['dropdown-icon'] ? (\n                        slots['dropdown-icon']()\n                      ) : (\n                        <YIcon\n                          {...mergeProps(dropdownIconProps)}\n                          icon={props.dropdownIcon}\n                          class={['y-select__icon']}\n                        ></YIcon>\n                      );\n                    },\n                    'helper-text': slots['helper-text']\n                      ? slots['helper-text']?.()\n                      : undefined,\n                  }}\n                </YFieldInput>\n              ),\n            default: slots.menu\n              ? () => slots.menu()\n              : () => (\n                  <YCard>\n                    {slots['menu-prepend']?.()}\n                    {items.value.length > 0 ? (\n                      <YList ref={listRef}>\n                        {items.value.map((item) => {\n                          return (\n                            <YListItem\n                              onClick={(e) => onClickItem(item, e)}\n                              class={{\n                                'y-list-item--active': isSelected(item),\n                              }}\n                            >\n                              {slots.item\n                                ? slots.item({\n                                    item,\n                                    selected: isSelected(item),\n                                    select: () => {\n                                      select(item);\n                                    },\n                                  })\n                                : item.text}\n                            </YListItem>\n                          );\n                        })}\n                      </YList>\n                    ) : (\n                      <div class=\"y-select__no-options\">항목이 없습니다.</div>\n                    )}\n                    {slots['menu-append']?.()}\n                  </YCard>\n                ),\n          }}\n        </YMenu>\n      );\n    });\n\n    onMounted(() => {\n      if (\n        props.defaultSelect &&\n        (props.modelValue === undefined ||\n          (Array.isArray(props.modelValue) && props.modelValue.length === 0)) &&\n        items.value?.length\n      ) {\n        select(items.value[0]);\n      }\n    });\n\n    expose({\n      fieldInputRef,\n      baseEl,\n    });\n\n    return {\n      fieldInputRef,\n      model,\n      selections,\n      selected,\n      menuRef,\n      baseEl,\n    };\n  },\n});\n"],"mappings":";AAAA,SAASA,UAAU,QAAQ,mBAAmB;AAC9C,SAA8BC,QAAQ,QAAQ,KAAK;AACnD,SAASC,QAAQ,EAAEC,eAAe,EAAEC,UAAU,EAAEC,SAAS,EAAEC,GAAG,QAAQ,KAAK;AAAC,SAEnEC,cAAc;AAAA,SACdC,SAAS;AAAA,SACTC,oBAAoB;AAAA,SAG3BC,0BAA0B,EAC1BC,QAAQ;AAAA,SAEDC,WAAW;AAAA,SACXC,SAAS,EAAEC,oBAAoB,EAAEC,IAAI;AAAA,SACrCC,WAAW,EAAEC,YAAY;AAAA,SACzBC,KAAK;AAAA,SACLC,WAAW,EAAEC,4BAA4B;AAAA,SACzCC,KAAK;AAAA,SAELC,KAAK,EAAEC,SAAS;AAAA,SAChBC,KAAK;AAEd;AAQA,OAAO,SAASC,gBAAgBA,CAC9BC,WAAgB,EAChBC,SAAc,EAEd;EAAA,IADAC,QAAQ,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,OAAO;EAElB,MAAMG,aAAa,GAAG,OAAOL,SAAS;EACtC,MAAMM,SAAS,GACbD,aAAa,KAAK,QAAQ,IAAIA,aAAa,KAAK,QAAQ,GACpDlB,oBAAoB,CAACY,WAAW,EAAEE,QAAQ,CAAC,GAC3CF,WAAW;EACjB,OAAOb,SAAS,CAACoB,SAAS,EAAEN,SAAS,CAAC;AACxC;AAEA,OAAO,MAAMO,uBAAuB,GAAGjB,YAAY,CACjD;EACEkB,MAAM,EAAEC,OAA4B;EACpCC,QAAQ,EAAED,OAAO;EACjBE,UAAU,EAAEF,OAAO;EACnBG,WAAW,EAAE;IACXC,IAAI,EAAEC,QAAkC;IACxCC,OAAO,EAAE7B;EACX,CAAC;EACD8B,aAAa,EAAEP,OAAO;EACtBQ,SAAS,EAAE;IACTJ,IAAI,EAAEK;EACR,CAAC;EACD,GAAGnC,0BAA0B,CAAC;AAChC,CAAC,EACD,QACF,CAAC;AAED,OAAO,MAAMoC,wBAAwB,GAAG7B,YAAY,CAClD;EACE8B,SAAS,EAAE;IACTP,IAAI,EAAE,CAACQ,MAAM,EAAEC,MAAM,CAAC;IACtBP,OAAO,EAAE;EACX,CAAC;EACDQ,YAAY,EAAE;IACZV,IAAI,EAAE,CAACS,MAAM,EAAEE,KAAK,EAAEN,MAAM,CAA4B;IACxDH,OAAO,EAAE;EACX,CAAC;EACDU,SAAS,EAAE;IACTZ,IAAI,EAAEQ,MAA0B;IAChCN,OAAO,EAAE;EACX,CAAC;EACDW,UAAU,EAAE;IACVb,IAAI,EAAEQ,MAA0B;IAChCN,OAAO,EAAE;EACX,CAAC;EACD,GAAGR,uBAAuB,CAAC,CAAC;EAC5B,GAAGd,4BAA4B,CAAC,CAAC;EACjC,GAAGL,IAAI,CAACN,oBAAoB,CAAC;IAAE6C,QAAQ,EAAE;EAAqB,CAAC,CAAC,EAAE,CAChE,oBAAoB,CACrB;AACH,CAAC,EACD,SACF,CAAC;AAED,OAAO,MAAMC,OAAO,GAAGpD,eAAe,CAAC;EACrCqD,IAAI,EAAE,SAAS;EACfC,YAAY,EAAE,KAAK;EACnBC,KAAK,EAAE;IACL,GAAGZ,wBAAwB,CAAC;EAC9B,CAAC;EACDa,KAAK,EAAE;IACL,mBAAmB,EAAGC,KAAU,IAAK,IAAI;IACzC,eAAe,EAAGzB,MAAe,IAAK,IAAI;IAC1C,YAAY,EAAE0B,CAACC,IAAS,EAAEC,CAAa,KAAK;EAC9C,CAAC;EACDC,KAAK,EAAEnB,MAUL;EACFoB,KAAKA,CAACP,KAAK,EAAAQ,IAAA,EAA4B;IAAA,IAA1B;MAAEF,KAAK;MAAEG,KAAK;MAAEC;IAAO,CAAC,GAAAF,IAAA;IACnC,MAAMG,aAAa,GAAG/D,GAAG,CAAC,CAAC;IAC3B,MAAMgE,OAAO,GAAGhE,GAAG,CAA6B,CAAC;IACjD,MAAMiE,OAAO,GAAGjE,GAAG,CAA6B,CAAC;IAEjD,MAAM6B,MAAM,GAAG5B,cAAc,CAACmD,KAAK,EAAE,QAAQ,CAAC;IAC9C,MAAMc,OAAO,GAAGxE,UAAU,CAAC,KAAK,CAAC;IAEjC,MAAM;MAAEyE,KAAK;MAAEC,aAAa;MAAEC;IAAY,CAAC,GAAGhE,QAAQ,CAAC+C,KAAK,CAAC;IAC7D,MAAMkB,KAAK,GAAGrE,cAAc,CAC1BmD,KAAK,EACL,YAAY,EACZ,EAAE,EACDmB,CAAC,IAAKH,aAAa,CAACG,CAAC,KAAK,IAAI,GAAG,CAAC,IAAI,CAAC,GAAGjE,WAAW,CAACiE,CAAC,CAAC,CAAC,EACzDA,CAAC,IAAK;MACL,MAAMC,SAAS,GAAGH,WAAW,CAAC/D,WAAW,CAACiE,CAAC,CAAC,CAAC;MAC7C,OAAOnB,KAAK,CAACrB,QAAQ,GAAGyC,SAAS,GAAGA,SAAS,CAAC,CAAC,CAAC,IAAI,IAAI;IAC1D,CACF,CAAC;IAED,MAAMC,UAAU,GAAG7E,QAAQ,CAAa,MAAM;MAC5C,OAAO0E,KAAK,CAAChB,KAAK,CAACoB,GAAG,CAAEH,CAAM,IAAK;QACjC,OAAOJ,KAAK,CAACb,KAAK,CAACqB,IAAI,CAAEnB,IAAI,IAAK;UAChC,OAAOJ,KAAK,CAACnB,WAAW,CAACuB,IAAI,CAACF,KAAK,EAAEiB,CAAC,CAACjB,KAAK,CAAC;QAC/C,CAAC,CAAC;MACJ,CAAC,CAAC;IACJ,CAAC,CAAC;IAEF,MAAMsB,QAAQ,GAAGhF,QAAQ,CAAC,MAAM;MAC9B,OAAO6E,UAAU,CAACnB,KAAK,CAACoB,GAAG,CAAEG,SAAS,IAAKA,SAAS,CAACzB,KAAK,CAACE,KAAK,CAAC;IACnE,CAAC,CAAC;IAEF,MAAMwB,cAAc,GAAGlF,QAAQ,CAAC,MAAM;MACpC,OAAO;QAAE,GAAGwD,KAAK,CAACd;MAAU,CAAC;IAC/B,CAAC,CAAC;IAEF,SAASyC,UAAUA,CAACvB,IAAc,EAAE;MAClC,OAAO,CAAC,CAACiB,UAAU,CAACnB,KAAK,CAACqB,IAAI,CAAEK,YAAY,IAAK;QAC/C,OAAOA,YAAY,EAAE1B,KAAK,KAAKE,IAAI,CAACF,KAAK;MAC3C,CAAC,CAAC;IACJ;;IAEA;IACA,SAAS2B,kBAAkBA,CAACC,KAAiB,EAAE;MAC7C,IAAI9B,KAAK,CAAC+B,QAAQ,EAAE;QAClB;MACF;MACAtD,MAAM,CAACyB,KAAK,GAAG,CAACzB,MAAM,CAACyB,KAAK;IAC9B;IAEA,SAAS8B,MAAMA,CAACF,KAAiB,EAAE;MACjC;MACA;MACA;IAAA;;IAGF;IACA,SAASG,WAAWA,CAAC7B,IAAc,EAAEC,CAAa,EAAE;MAClD6B,MAAM,CAAC9B,IAAI,CAAC;MACZ,IAAI,CAACJ,KAAK,CAACrB,QAAQ,EAAE;QACnBpC,QAAQ,CAAC,MAAM;UACbkC,MAAM,CAACyB,KAAK,GAAG,KAAK;QACtB,CAAC,CAAC;MACJ;IACF;IAEA,SAASiC,YAAYA,CAAA,EAAG;MACtB,IAAI,CAACrB,OAAO,CAACZ,KAAK,EAAE;QAClBS,aAAa,CAACT,KAAK,EAAEkC,KAAK,CAAC,CAAC;MAC9B;IACF;IAEA,SAASC,cAAcA,CAACP,KAAiB,EAAE;MACzC,IAAIA,KAAK,CAACQ,MAAM,IAAK1B,OAAO,CAACV,KAAK,EAAUqC,MAAM,EAAEC,QAAQ,CAACtC,KAAK,EAAE;QAClE,OAAQ4B,KAAK,CAACQ,MAAM,EAAkBG,QAAQ,CAC3C7B,OAAO,CAACV,KAAK,EAAUqC,MAAM,EAAEC,QAAQ,CAACtC,KAC3C,CAAC;MACH;IACF;IAEA,SAASgC,MAAMA,CAAC9B,IAAc,EAAE;MAC9B,IAAIJ,KAAK,CAACrB,QAAQ,EAAE;QAClB,MAAM+D,KAAK,GAAGrB,UAAU,CAACnB,KAAK,CAACyC,SAAS,CAAEf,YAAY,IAAK;UACzD,OAAOA,YAAY,CAAC1B,KAAK,KAAKE,IAAI,CAACF,KAAK;QAC1C,CAAC,CAAC;QACF,IAAIwC,KAAK,KAAK,CAAC,CAAC,EAAE;UAChBxB,KAAK,CAAChB,KAAK,GAAG,CAAC,GAAGgB,KAAK,CAAChB,KAAK,EAAEE,IAAI,CAAC;QACtC,CAAC,MAAM;UACL,MAAMwC,GAAG,GAAG1B,KAAK,CAAChB,KAAK,CAAC2C,KAAK,CAAC,CAAC;UAC/BD,GAAG,CAACE,MAAM,CAACJ,KAAK,EAAE,CAAC,CAAC;UACpBxB,KAAK,CAAChB,KAAK,GAAG0C,GAAG;QACnB;MACF,CAAC,MAAM;QACL1B,KAAK,CAAChB,KAAK,GAAG,CAACE,IAAI,CAAC;MACtB;IACF;IAEA,MAAM2C,WAAW,GAAGvG,QAAQ,CAAC,MAAM;MACjC,IAAIwD,KAAK,CAACrB,QAAQ,EAAE;QAClB,OAAO0C,UAAU,CAACnB,KAAK,CAACoB,GAAG,CAAElB,IAAI,IAAKA,IAAI,CAAC4C,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC;MAC7D;MACA,OAAO5B,UAAU,CAACnB,KAAK,GAAG,CAAC,CAAC,EAAE8C,IAAI,IAAI,EAAE;IAC1C,CAAC,CAAC;IAEF,MAAME,MAAM,GAAG1G,QAAQ,CAAC,MAAM;MAC5B,OAAOoE,OAAO,CAACV,KAAK,EAAEgD,MAAM;IAC9B,CAAC,CAAC;IAEFpG,SAAS,CAAC,MAAM;MACd,MAAMqG,eAAe,GAAG7F,WAAW,CAAC0C,KAAK,EAAEvC,WAAW,CAACuC,KAAK,CAAC;MAC7D,MAAMoD,iBAAiB,GAAG9F,WAAW,CACnC,OAAO0C,KAAK,CAACR,YAAY,KAAK,QAAQ,GAAGQ,KAAK,CAACR,YAAY,GAAG,CAAC,CAAC,EAChE7B,KAAK,CAACqC,KACR,CAAC;MACD,OAAAqD,YAAA,CAAAvF,KAAA,EAAAwF,WAAA;QAAA,cAEa7E,MAAM,CAACyB,KAAK;QAAA,uBAAAqD,MAAA,IAAZ9E,MAAM,CAACyB,KAAK,GAAAqD,MAAA;QAAA,OAChB3C,OAAO;QAAA,UACJZ,KAAK,CAACwD,MAAM;QAAA,YACVxD,KAAK,CAACJ,QAAQ;QAAA,SACjBI,KAAK,CAACyD,KAAK;QAAA,UACVzD,KAAK,CAAC0D,MAAM;QAAA,mBACH,CAAC,mBAAmB,CAAC;QAAA,aAC3B1D,KAAK,CAACX,SAAS;QAAA,sBACN,KAAK;QAAA,gBACX8C,YAAY;QAAA,cACdnC,KAAK,CAACN,SAAS;QAAA,eACdM,KAAK,CAACL,UAAU;QAAA,kBACb0C;MAAc,GAC1BX,cAAc,CAACxB,KAAK;QAGtByD,IAAI,EAAE,SAAAA,CAAA;UAAA,SAAAC,IAAA,GAAAzF,SAAA,CAAAC,MAAA,EAAIyF,IAAI,OAAApE,KAAA,CAAAmE,IAAA,GAAAE,IAAA,MAAAA,IAAA,GAAAF,IAAA,EAAAE,IAAA;YAAJD,IAAI,CAAAC,IAAA,IAAA3F,SAAA,CAAA2F,IAAA;UAAA;UAAA,OACZxD,KAAK,CAACqD,IAAI,GACRrD,KAAK,CAACqD,IAAI,GAAG,GAAGE,IAAI,CAAC,GAAAR,YAAA,CAAA5F,WAAA,EAAA6F,WAAA;YAIjB,GAAGH,eAAe;YAClB,GAAGzG,UAAU,CAAC;cAAE,GAAGmH,IAAI,CAAC,CAAC,CAAC,CAAC7D;YAAM,CAAC,EAAE;cAAEpD,GAAG,EAAE+D;YAAc,CAAC;UAAC;YAAA,mBAE5CO,KAAK,CAAC6C,OAAO;YAAA,uBACTlC,kBAAkB;YAAA,UAC/BG,MAAM;YAAA;YAAA,SAEP,CAAC,UAAU,EAAE;cAAE,kBAAkB,EAAEvD,MAAM,CAACyB;YAAM,CAAC;UAAC,GACrDO,KAAK;YAAA,WACAK,OAAO,CAACZ;UAAK;YAGpBlB,OAAO,EAAEA,CAAA,KAAM;cACb,OAAAqE,YAAA;gBAAA,SACc,CAAC,qBAAqB;cAAC,IAChC/C,KAAK,CAACmB,SAAS,GACZnB,KAAK,CAACmB,SAAS,GAAG,CAAC,GACnBsB,WAAW,CAAC7C,KAAK;YAG3B,CAAC;YACD8D,OAAO,EAAE1D,KAAK,CAAC0D,OAAO,GAClB;cAAA,SAAAC,KAAA,GAAA9F,SAAA,CAAAC,MAAA,EAAIyF,IAAI,OAAApE,KAAA,CAAAwE,KAAA,GAAAC,KAAA,MAAAA,KAAA,GAAAD,KAAA,EAAAC,KAAA;gBAAJL,IAAI,CAAAK,KAAA,IAAA/F,SAAA,CAAA+F,KAAA;cAAA;cAAA,OAAY5D,KAAK,CAAC0D,OAAO,GAAG,GAAGH,IAAI,CAAC;YAAA,IAC5CxF,SAAS;YACb8F,QAAQ,EAAE,SAAAA,CAAA,EAAoB;cAC5B,OAAO7D,KAAK,CAAC,eAAe,CAAC,GAC3BA,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAA+C,YAAA,CAAA1F,KAAA,EAAA2F,WAAA,CAGlB5G,UAAU,CAAC0G,iBAAiB,CAAC;gBAAA,QAC3BpD,KAAK,CAACR,YAAY;gBAAA,SACjB,CAAC,gBAAgB;cAAC,SAE5B;YACH,CAAC;YACD,aAAa,EAAEc,KAAK,CAAC,aAAa,CAAC,GAC/BA,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GACxBjC;UAAS,EAGlB;QAAA;QACHW,OAAO,EAAEsB,KAAK,CAAC8D,IAAI,GACf,MAAM9D,KAAK,CAAC8D,IAAI,CAAC,CAAC,GAClB,MAAAf,YAAA,CAAA7F,KAAA;UAAAwB,OAAA,EAAAA,CAAA,MAEKsB,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,EACzBS,KAAK,CAACb,KAAK,CAAC9B,MAAM,GAAG,CAAC,GAAAiF,YAAA,CAAAzF,KAAA;YAAA,OACTiD;UAAO;YAAA7B,OAAA,EAAAA,CAAA,MAChB+B,KAAK,CAACb,KAAK,CAACoB,GAAG,CAAElB,IAAI,IAAK;cACzB,OAAAiD,YAAA,CAAAxF,SAAA;gBAAA,WAEcwC,CAAC,IAAK4B,WAAW,CAAC7B,IAAI,EAAEC,CAAC,CAAC;gBAAA,SAC7B;kBACL,qBAAqB,EAAEsB,UAAU,CAACvB,IAAI;gBACxC;cAAC;gBAAApB,OAAA,EAAAA,CAAA,MAEAsB,KAAK,CAACF,IAAI,GACPE,KAAK,CAACF,IAAI,CAAC;kBACTA,IAAI;kBACJoB,QAAQ,EAAEG,UAAU,CAACvB,IAAI,CAAC;kBAC1B8B,MAAM,EAAEA,CAAA,KAAM;oBACZA,MAAM,CAAC9B,IAAI,CAAC;kBACd;gBACF,CAAC,CAAC,GACFA,IAAI,CAAC4C,IAAI;cAAA;YAGnB,CAAC,CAAC;UAAA,KAAAK,YAAA;YAAA,SAGO;UAAsB,IAAAgB,gBAAA,kDAClC,EACA/D,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC;QAAA;MAE5B;IAIb,CAAC,CAAC;IAEF3D,SAAS,CAAC,MAAM;MACd,IACEqD,KAAK,CAACf,aAAa,KAClBe,KAAK,CAACsE,UAAU,KAAKjG,SAAS,IAC5BoB,KAAK,CAAC8E,OAAO,CAACvE,KAAK,CAACsE,UAAU,CAAC,IAAItE,KAAK,CAACsE,UAAU,CAAClG,MAAM,KAAK,CAAE,CAAC,IACrE2C,KAAK,CAACb,KAAK,EAAE9B,MAAM,EACnB;QACA8D,MAAM,CAACnB,KAAK,CAACb,KAAK,CAAC,CAAC,CAAC,CAAC;MACxB;IACF,CAAC,CAAC;IAEFQ,MAAM,CAAC;MACLC,aAAa;MACbuC;IACF,CAAC,CAAC;IAEF,OAAO;MACLvC,aAAa;MACbO,KAAK;MACLG,UAAU;MACVG,QAAQ;MACRZ,OAAO;MACPsC;IACF,CAAC;EACH;AACF,CAAC,CAAC"}
+{"version":3,"file":"YSelect.mjs","names":["shallowRef","nextTick","computed","defineComponent","mergeProps","onMounted","ref","useModelDuplex","useRender","pressCoordinateProps","pressListItemsPropsOptions","useItems","wrapInArray","deepEqual","getObjectValueByPath","omit","chooseProps","propsFactory","YCard","YFieldInput","pressYFieldInputPropsOptions","YIcon","YList","YListItem","YMenu","returnItemEquals","optionsItem","valueItem","valueKey","arguments","length","undefined","valueItemType","itemValue","pressSelectPropsOptions","opened","Boolean","multiple","weakEquals","valueEquals","type","Function","default","defaultSelect","menuProps","Object","pressYSelectPropsOptions","maxHeight","Number","String","dropdownIcon","Array","openDelay","closeDelay","position","YSelect","name","inheritAttrs","props","emits","value","click:item","item","e","slots","setup","_ref","attrs","expose","fieldInputRef","menuRef","listRef","focused","items","toRefineItems","toEmitItems","model","v","emitValue","selections","map","find","selected","selection","extraMenuProps","isSelected","selectedItem","onMousedownDisplay","event","disabled","onBlur","onClickItem","select","onAfterLeave","focus","closeCondition","target","layer$","content$","contains","index","findIndex","neo","slice","splice","displayText","text","join","baseEl","fieldInputProps","dropdownIconProps","_createVNode","_mergeProps","$event","offset","align","origin","base","_len","args","_key","rxValue","leading","_len2","_key2","trailing","menu","_createTextVNode","modelValue","isArray"],"sources":["../../../src/components/select/YSelect.tsx"],"sourcesContent":["import { shallowRef } from '@vue/runtime-core';\nimport { PropType, SlotsType, nextTick } from 'vue';\nimport { computed, defineComponent, mergeProps, onMounted, ref } from 'vue';\n\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { pressCoordinateProps } from '../../composables/coordinate';\nimport {\n  ListItem,\n  pressListItemsPropsOptions,\n  useItems,\n} from '../../composables/list-items';\nimport { wrapInArray } from '../../util/array';\nimport { deepEqual, getObjectValueByPath, omit } from '../../util/common';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YCard } from '../card';\nimport { YFieldInput, pressYFieldInputPropsOptions } from '../field-input';\nimport { YIcon, YIconIconProp } from '../icon';\nimport { YIconDropdown } from '../icons/YIconDropdown';\nimport { YList, YListItem } from '../list';\nimport { YMenu } from '../menu';\n\nimport './YSelect.scss';\n\nexport type SelectEquals = (\n  optionsItem: any,\n  valueItem: any,\n  valueKey?: string,\n) => boolean;\n\nexport function returnItemEquals(\n  optionsItem: any,\n  valueItem: any,\n  valueKey = 'value',\n) {\n  const valueItemType = typeof valueItem;\n  const itemValue =\n    valueItemType === 'string' || valueItemType === 'number'\n      ? getObjectValueByPath(optionsItem, valueKey)\n      : optionsItem;\n  return deepEqual(itemValue, valueItem);\n}\n\nexport const pressSelectPropsOptions = propsFactory(\n  {\n    opened: Boolean as PropType<boolean>,\n    multiple: Boolean,\n    weakEquals: Boolean,\n    valueEquals: {\n      type: Function as PropType<SelectEquals>,\n      default: deepEqual,\n    },\n    defaultSelect: Boolean,\n    menuProps: {\n      type: Object as PropType<YMenu['$props']>,\n    },\n    ...pressListItemsPropsOptions(),\n  },\n  'Select',\n);\n\nexport const pressYSelectPropsOptions = propsFactory(\n  {\n    maxHeight: {\n      type: [Number, String],\n      default: 310,\n    },\n    dropdownIcon: {\n      type: [String, Array, Object] as PropType<YIconIconProp>,\n      default: '$dropdown',\n    },\n    openDelay: {\n      type: Number as PropType<number>,\n      default: 200,\n    },\n    closeDelay: {\n      type: Number as PropType<number>,\n      default: 200,\n    },\n    ...pressSelectPropsOptions(),\n    ...pressYFieldInputPropsOptions(),\n    ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\n      'coordinateStrategy',\n    ]),\n  },\n  'YSelect',\n);\n\nexport const YSelect = defineComponent({\n  name: 'YSelect',\n  inheritAttrs: false,\n  props: {\n    ...pressYSelectPropsOptions(),\n  },\n  emits: {\n    'update:modelValue': (value: any) => true,\n    'update:opened': (opened: boolean) => true,\n    'click:item': (item: any, e: MouseEvent) => true,\n  },\n  slots: Object as SlotsType<{\n    base: any;\n    selection: any;\n    leading: any;\n    'helper-text': any;\n    menu: any;\n    'menu-prepend': any;\n    'menu-append': any;\n    'dropdown-icon': any;\n    item: { item: any; selected: boolean; select: () => void };\n  }>,\n  setup(props, { slots, attrs, expose }) {\n    const fieldInputRef = ref();\n    const menuRef = ref<InstanceType<typeof YMenu>>();\n    const listRef = ref<InstanceType<typeof YList>>();\n\n    const opened = useModelDuplex(props, 'opened');\n    const focused = shallowRef(false);\n\n    const { items, toRefineItems, toEmitItems } = useItems(props);\n    const model = useModelDuplex(\n      props,\n      'modelValue',\n      [],\n      (v) => toRefineItems(v === null ? [null] : wrapInArray(v)),\n      (v) => {\n        const emitValue = toEmitItems(wrapInArray(v));\n        return props.multiple ? emitValue : emitValue[0] ?? null;\n      },\n    );\n\n    const selections = computed<ListItem[]>(() => {\n      return model.value.map((v: any) => {\n        return items.value.find((item) => {\n          return props.valueEquals(item.value, v.value);\n        });\n      });\n    });\n\n    const selected = computed(() => {\n      return selections.value.map((selection) => selection.props.value);\n    });\n\n    const extraMenuProps = computed(() => {\n      return { ...props.menuProps };\n    });\n\n    function isSelected(item: ListItem) {\n      return !!selections.value.find((selectedItem) => {\n        return selectedItem?.value === item.value;\n      });\n    }\n\n    // Field\n    function onMousedownDisplay(event: MouseEvent) {\n      if (props.disabled) {\n        return;\n      }\n      opened.value = !opened.value;\n    }\n\n    function onBlur(event: FocusEvent) {\n      // if (listRef.value?.$el.contains(event.relatedTarget)) {\n      //   opened.value = false;\n      // }\n    }\n\n    // Menu Contents\n    function onClickItem(item: ListItem, e: MouseEvent) {\n      select(item);\n      if (!props.multiple) {\n        nextTick(() => {\n          opened.value = false;\n        });\n      }\n    }\n\n    function onAfterLeave() {\n      if (!focused.value) {\n        fieldInputRef.value?.focus();\n      }\n    }\n\n    function closeCondition(event: MouseEvent) {\n      if (event.target && (menuRef.value as any)?.layer$?.content$.value) {\n        return (event.target as HTMLElement)?.contains(\n          (menuRef.value as any)?.layer$?.content$.value,\n        );\n      }\n    }\n\n    function select(item: ListItem) {\n      if (props.multiple) {\n        const index = selections.value.findIndex((selectedItem) => {\n          return selectedItem.value === item.value;\n        });\n        if (index === -1) {\n          model.value = [...model.value, item];\n        } else {\n          const neo = model.value.slice();\n          neo.splice(index, 1);\n          model.value = neo;\n        }\n      } else {\n        model.value = [item];\n      }\n    }\n\n    const displayText = computed(() => {\n      if (props.multiple) {\n        return selections.value.map((item) => item.text).join(', ');\n      }\n      return selections.value?.[0]?.text ?? '';\n    });\n\n    const baseEl = computed(() => {\n      return menuRef.value?.baseEl;\n    });\n\n    useRender(() => {\n      const fieldInputProps = chooseProps(props, YFieldInput.props);\n      const dropdownIconProps = chooseProps(\n        typeof props.dropdownIcon === 'object' ? props.dropdownIcon : {},\n        YIcon.props,\n      );\n      return (\n        <YMenu\n          v-model={opened.value}\n          ref={menuRef}\n          offset={props.offset}\n          position={props.position}\n          align={props.align}\n          origin={props.origin}\n          content-classes={['y-select__content']}\n          maxHeight={props.maxHeight}\n          open-on-click-base={false}\n          onAfterLeave={onAfterLeave}\n          open-delay={props.openDelay}\n          close-delay={props.closeDelay}\n          closeCondition={closeCondition}\n          {...extraMenuProps.value}\n        >\n          {{\n            base: (...args: any[]) =>\n              slots.base ? (\n                slots.base?.(...args)\n              ) : (\n                <YFieldInput\n                  {...{\n                    ...fieldInputProps,\n                    ...mergeProps({ ...args[0].props }, { ref: fieldInputRef }),\n                  }}\n                  modelValue={model.value\n                    .map((v: any) => v.props.value)\n                    .join(', ')}\n                  validationValue={model.rxValue}\n                  onMousedown:display={onMousedownDisplay}\n                  onBlur={onBlur}\n                  readonly\n                  class={['y-select', { 'y-select--opened': opened.value }]}\n                  {...attrs}\n                  focused={focused.value}\n                >\n                  {{\n                    default: () => {\n                      return (\n                        <div class={['y-select__selection']}>\n                          {slots.selection\n                            ? slots.selection?.()\n                            : displayText.value}\n                        </div>\n                      );\n                    },\n                    leading: slots.leading\n                      ? (...args: any[]) => slots.leading?.(...args)\n                      : undefined,\n                    trailing: (...args: any[]) => {\n                      return slots['dropdown-icon'] ? (\n                        slots['dropdown-icon']()\n                      ) : (\n                        <YIcon\n                          {...mergeProps(dropdownIconProps)}\n                          icon={props.dropdownIcon}\n                          class={['y-select__icon']}\n                        ></YIcon>\n                      );\n                    },\n                    'helper-text': slots['helper-text']\n                      ? slots['helper-text']?.()\n                      : undefined,\n                  }}\n                </YFieldInput>\n              ),\n            default: slots.menu\n              ? () => slots.menu()\n              : () => (\n                  <YCard>\n                    {slots['menu-prepend']?.()}\n                    {items.value.length > 0 ? (\n                      <YList ref={listRef}>\n                        {items.value.map((item) => {\n                          return (\n                            <YListItem\n                              onClick={(e) => onClickItem(item, e)}\n                              class={{\n                                'y-list-item--active': isSelected(item),\n                              }}\n                            >\n                              {slots.item\n                                ? slots.item({\n                                    item,\n                                    selected: isSelected(item),\n                                    select: () => {\n                                      select(item);\n                                    },\n                                  })\n                                : item.text}\n                            </YListItem>\n                          );\n                        })}\n                      </YList>\n                    ) : (\n                      <div class=\"y-select__no-options\">항목이 없습니다.</div>\n                    )}\n                    {slots['menu-append']?.()}\n                  </YCard>\n                ),\n          }}\n        </YMenu>\n      );\n    });\n\n    onMounted(() => {\n      if (\n        props.defaultSelect &&\n        (props.modelValue === undefined ||\n          (Array.isArray(props.modelValue) && props.modelValue.length === 0)) &&\n        items.value?.length\n      ) {\n        select(items.value[0]);\n      }\n    });\n\n    expose({\n      fieldInputRef,\n      baseEl,\n    });\n\n    return {\n      fieldInputRef,\n      model,\n      selections,\n      selected,\n      menuRef,\n      baseEl,\n    };\n  },\n});\n"],"mappings":"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"}

package/lib/composables/validation.mjs

@@ -11,6 +11,7 @@ export const pressValidationPropsOptions = propsFactory({
       return ['success', 'warning', 'error'].includes(value);
     }
   },
+  helperText: String,
   validators: Array,
   validateOn: {
     type: String

package/lib/composables/validation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"validation.mjs","names":["computed","ref","watch","getUid","propsFactory","useModelDuplex","useToggleScope","pressValidationPropsOptions","readonly","Boolean","disabled","status","type","String","validator","value","includes","validators","Array","validateOn","validationValue","maxErrors","Number","default","useValidation","props","name","uid","arguments","length","undefined","model","validationModel","validating","onSet","Set","split","blur","has","input","lazy","submit","errorResult","errors","isError","isSuccess","invokeValidators","focused","unwatch","val","results","isArray","handler","result","console","warn","push","resetError"],"sources":["../../src/composables/validation.ts"],"sourcesContent":["import { PropType, computed, ref, watch } from 'vue';\n\nimport { getUid, propsFactory } from '../util';\nimport { useModelDuplex } from './communication';\nimport { useToggleScope } from './scope';\n\nexport const pressValidationPropsOptions = propsFactory(\n  {\n    readonly: Boolean as PropType<boolean>,\n    disabled: Boolean as PropType<boolean>,\n    status: {\n      type: String as PropType<'success' | 'warning' | 'error' | undefined>,\n      validator(value: string) {\n        return ['success', 'warning', 'error'].includes(value);\n      },\n    },\n    validators: Array as PropType<((v: any) => boolean | string)[] | string[]>,\n    validateOn: {\n      type: String as PropType<string>,\n    },\n    validationValue: null,\n    maxErrors: {\n      type: [Number, String] as PropType<number | string>,\n      default: 1,\n    },\n  },\n  'validation',\n);\n\nexport function useValidation(props: any, name: string, uid = getUid()) {\n  const model = useModelDuplex(props, 'modelValue');\n  const validationModel = computed(() =>\n    props.validationValue === undefined ? model.value : props.validationValue,\n  );\n\n  const validating = ref(false);\n  const validateOn = computed(() => {\n    let value = props.validateOn || 'input';\n    if (value === 'lazy') value = 'input,lazy';\n    const onSet = new Set(value?.split(',') ?? []);\n\n    return {\n      blur: onSet.has('blur') || onSet.has('input'),\n      input: onSet.has('input'),\n      lazy: onSet.has('lazy'),\n      submit: onSet.has('submit'),\n    };\n  });\n\n  const errorResult = ref();\n  const errors = ref<any[]>([]);\n\n  const isError = computed(() => {\n    return props.status === 'error' || errors.value.length > 0;\n  });\n\n  const isSuccess = computed(() => {\n    return !isError.value && props.status === 'success';\n  });\n\n  useToggleScope(\n    () => validateOn.value.input,\n    () => {\n      watch(validationModel, () => {\n        if (validationModel.value != null) {\n          invokeValidators();\n        } else if (props.focused) {\n          const unwatch = watch(\n            () => props.focused,\n            (val) => {\n              if (!val) invokeValidators();\n\n              unwatch();\n            },\n          );\n        }\n      });\n    },\n  );\n\n  async function invokeValidators() {\n    const results: any[] = [];\n    validating.value = true;\n\n    if (Array.isArray(props.validators)) {\n      for (const validator of props.validators) {\n        if (results.length >= +(props.maxErrors ?? 1)) {\n          break;\n        }\n\n        const handler =\n          typeof validator === 'function' ? validator : () => validator;\n        const result = await handler(validationModel.value);\n\n        if (result === true) {\n          continue;\n        }\n\n        if (result !== false && typeof result !== 'string') {\n          console.warn('Wrong validator return type');\n          continue;\n        }\n        results.push(result || '');\n      }\n    }\n    validating.value = false;\n    errors.value = results;\n    errorResult.value = results?.[0];\n\n    return results;\n  }\n\n  function resetError() {\n    errors.value = [];\n    errorResult.value = undefined;\n  }\n\n  return {\n    invokeValidators,\n    resetError,\n    validating,\n    validateOn,\n    errorResult,\n    errors,\n    isError,\n    isSuccess,\n  };\n}\n"],"mappings":"AAAA,SAAmBA,QAAQ,EAAEC,GAAG,EAAEC,KAAK,QAAQ,KAAK;AAAC,SAE5CC,MAAM,EAAEC,YAAY;AAAA,SACpBC,cAAc;AAAA,SACdC,cAAc;AAEvB,OAAO,MAAMC,2BAA2B,GAAGH,YAAY,CACrD;EACEI,QAAQ,EAAEC,OAA4B;EACtCC,QAAQ,EAAED,OAA4B;EACtCE,MAAM,EAAE;IACNC,IAAI,EAAEC,MAA+D;IACrEC,SAASA,CAACC,KAAa,EAAE;MACvB,OAAO,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,CAACC,QAAQ,CAACD,KAAK,CAAC;IACxD;EACF,CAAC;EACDE,UAAU,EAAEC,KAA8D;EAC1EC,UAAU,EAAE;IACVP,IAAI,EAAEC;EACR,CAAC;EACDO,eAAe,EAAE,IAAI;EACrBC,SAAS,EAAE;IACTT,IAAI,EAAE,CAACU,MAAM,EAAET,MAAM,CAA8B;IACnDU,OAAO,EAAE;EACX;AACF,CAAC,EACD,YACF,CAAC;AAED,OAAO,SAASC,aAAaA,CAACC,KAAU,EAAEC,IAAY,EAAkB;EAAA,IAAhBC,GAAG,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGzB,MAAM,CAAC,CAAC;EACpE,MAAM4B,KAAK,GAAG1B,cAAc,CAACoB,KAAK,EAAE,YAAY,CAAC;EACjD,MAAMO,eAAe,GAAGhC,QAAQ,CAAC,MAC/ByB,KAAK,CAACL,eAAe,KAAKU,SAAS,GAAGC,KAAK,CAAChB,KAAK,GAAGU,KAAK,CAACL,eAC5D,CAAC;EAED,MAAMa,UAAU,GAAGhC,GAAG,CAAC,KAAK,CAAC;EAC7B,MAAMkB,UAAU,GAAGnB,QAAQ,CAAC,MAAM;IAChC,IAAIe,KAAK,GAAGU,KAAK,CAACN,UAAU,IAAI,OAAO;IACvC,IAAIJ,KAAK,KAAK,MAAM,EAAEA,KAAK,GAAG,YAAY;IAC1C,MAAMmB,KAAK,GAAG,IAAIC,GAAG,CAACpB,KAAK,EAAEqB,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;IAE9C,OAAO;MACLC,IAAI,EAAEH,KAAK,CAACI,GAAG,CAAC,MAAM,CAAC,IAAIJ,KAAK,CAACI,GAAG,CAAC,OAAO,CAAC;MAC7CC,KAAK,EAAEL,KAAK,CAACI,GAAG,CAAC,OAAO,CAAC;MACzBE,IAAI,EAAEN,KAAK,CAACI,GAAG,CAAC,MAAM,CAAC;MACvBG,MAAM,EAAEP,KAAK,CAACI,GAAG,CAAC,QAAQ;IAC5B,CAAC;EACH,CAAC,CAAC;EAEF,MAAMI,WAAW,GAAGzC,GAAG,CAAC,CAAC;EACzB,MAAM0C,MAAM,GAAG1C,GAAG,CAAQ,EAAE,CAAC;EAE7B,MAAM2C,OAAO,GAAG5C,QAAQ,CAAC,MAAM;IAC7B,OAAOyB,KAAK,CAACd,MAAM,KAAK,OAAO,IAAIgC,MAAM,CAAC5B,KAAK,CAACc,MAAM,GAAG,CAAC;EAC5D,CAAC,CAAC;EAEF,MAAMgB,SAAS,GAAG7C,QAAQ,CAAC,MAAM;IAC/B,OAAO,CAAC4C,OAAO,CAAC7B,KAAK,IAAIU,KAAK,CAACd,MAAM,KAAK,SAAS;EACrD,CAAC,CAAC;EAEFL,cAAc,CACZ,MAAMa,UAAU,CAACJ,KAAK,CAACwB,KAAK,EAC5B,MAAM;IACJrC,KAAK,CAAC8B,eAAe,EAAE,MAAM;MAC3B,IAAIA,eAAe,CAACjB,KAAK,IAAI,IAAI,EAAE;QACjC+B,gBAAgB,CAAC,CAAC;MACpB,CAAC,MAAM,IAAIrB,KAAK,CAACsB,OAAO,EAAE;QACxB,MAAMC,OAAO,GAAG9C,KAAK,CACnB,MAAMuB,KAAK,CAACsB,OAAO,EAClBE,GAAG,IAAK;UACP,IAAI,CAACA,GAAG,EAAEH,gBAAgB,CAAC,CAAC;UAE5BE,OAAO,CAAC,CAAC;QACX,CACF,CAAC;MACH;IACF,CAAC,CAAC;EACJ,CACF,CAAC;EAED,eAAeF,gBAAgBA,CAAA,EAAG;IAChC,MAAMI,OAAc,GAAG,EAAE;IACzBjB,UAAU,CAAClB,KAAK,GAAG,IAAI;IAEvB,IAAIG,KAAK,CAACiC,OAAO,CAAC1B,KAAK,CAACR,UAAU,CAAC,EAAE;MACnC,KAAK,MAAMH,SAAS,IAAIW,KAAK,CAACR,UAAU,EAAE;QACxC,IAAIiC,OAAO,CAACrB,MAAM,IAAI,EAAEJ,KAAK,CAACJ,SAAS,IAAI,CAAC,CAAC,EAAE;UAC7C;QACF;QAEA,MAAM+B,OAAO,GACX,OAAOtC,SAAS,KAAK,UAAU,GAAGA,SAAS,GAAG,MAAMA,SAAS;QAC/D,MAAMuC,MAAM,GAAG,MAAMD,OAAO,CAACpB,eAAe,CAACjB,KAAK,CAAC;QAEnD,IAAIsC,MAAM,KAAK,IAAI,EAAE;UACnB;QACF;QAEA,IAAIA,MAAM,KAAK,KAAK,IAAI,OAAOA,MAAM,KAAK,QAAQ,EAAE;UAClDC,OAAO,CAACC,IAAI,CAAC,6BAA6B,CAAC;UAC3C;QACF;QACAL,OAAO,CAACM,IAAI,CAACH,MAAM,IAAI,EAAE,CAAC;MAC5B;IACF;IACApB,UAAU,CAAClB,KAAK,GAAG,KAAK;IACxB4B,MAAM,CAAC5B,KAAK,GAAGmC,OAAO;IACtBR,WAAW,CAAC3B,KAAK,GAAGmC,OAAO,GAAG,CAAC,CAAC;IAEhC,OAAOA,OAAO;EAChB;EAEA,SAASO,UAAUA,CAAA,EAAG;IACpBd,MAAM,CAAC5B,KAAK,GAAG,EAAE;IACjB2B,WAAW,CAAC3B,KAAK,GAAGe,SAAS;EAC/B;EAEA,OAAO;IACLgB,gBAAgB;IAChBW,UAAU;IACVxB,UAAU;IACVd,UAAU;IACVuB,WAAW;IACXC,MAAM;IACNC,OAAO;IACPC;EACF,CAAC;AACH"}
+{"version":3,"file":"validation.mjs","names":["computed","ref","watch","getUid","propsFactory","useModelDuplex","useToggleScope","pressValidationPropsOptions","readonly","Boolean","disabled","status","type","String","validator","value","includes","helperText","validators","Array","validateOn","validationValue","maxErrors","Number","default","useValidation","props","name","uid","arguments","length","undefined","model","validationModel","validating","onSet","Set","split","blur","has","input","lazy","submit","errorResult","errors","isError","isSuccess","invokeValidators","focused","unwatch","val","results","isArray","handler","result","console","warn","push","resetError"],"sources":["../../src/composables/validation.ts"],"sourcesContent":["import { PropType, computed, ref, watch } from 'vue';\n\nimport { getUid, propsFactory } from '../util';\nimport { useModelDuplex } from './communication';\nimport { useToggleScope } from './scope';\n\nexport const pressValidationPropsOptions = propsFactory(\n  {\n    readonly: Boolean as PropType<boolean>,\n    disabled: Boolean as PropType<boolean>,\n    status: {\n      type: String as PropType<'success' | 'warning' | 'error' | undefined>,\n      validator(value: string) {\n        return ['success', 'warning', 'error'].includes(value);\n      },\n    },\n    helperText: String,\n    validators: Array as PropType<((v: any) => boolean | string)[] | string[]>,\n    validateOn: {\n      type: String as PropType<string>,\n    },\n    validationValue: null,\n    maxErrors: {\n      type: [Number, String] as PropType<number | string>,\n      default: 1,\n    },\n  },\n  'validation',\n);\n\nexport function useValidation(props: any, name: string, uid = getUid()) {\n  const model = useModelDuplex(props, 'modelValue');\n  const validationModel = computed(() =>\n    props.validationValue === undefined ? model.value : props.validationValue,\n  );\n\n  const validating = ref(false);\n  const validateOn = computed(() => {\n    let value = props.validateOn || 'input';\n    if (value === 'lazy') value = 'input,lazy';\n    const onSet = new Set(value?.split(',') ?? []);\n\n    return {\n      blur: onSet.has('blur') || onSet.has('input'),\n      input: onSet.has('input'),\n      lazy: onSet.has('lazy'),\n      submit: onSet.has('submit'),\n    };\n  });\n\n  const errorResult = ref();\n  const errors = ref<any[]>([]);\n\n  const isError = computed(() => {\n    return props.status === 'error' || errors.value.length > 0;\n  });\n\n  const isSuccess = computed(() => {\n    return !isError.value && props.status === 'success';\n  });\n\n  useToggleScope(\n    () => validateOn.value.input,\n    () => {\n      watch(validationModel, () => {\n        if (validationModel.value != null) {\n          invokeValidators();\n        } else if (props.focused) {\n          const unwatch = watch(\n            () => props.focused,\n            (val) => {\n              if (!val) invokeValidators();\n\n              unwatch();\n            },\n          );\n        }\n      });\n    },\n  );\n\n  async function invokeValidators() {\n    const results: any[] = [];\n    validating.value = true;\n\n    if (Array.isArray(props.validators)) {\n      for (const validator of props.validators) {\n        if (results.length >= +(props.maxErrors ?? 1)) {\n          break;\n        }\n\n        const handler =\n          typeof validator === 'function' ? validator : () => validator;\n        const result = await handler(validationModel.value);\n\n        if (result === true) {\n          continue;\n        }\n\n        if (result !== false && typeof result !== 'string') {\n          console.warn('Wrong validator return type');\n          continue;\n        }\n        results.push(result || '');\n      }\n    }\n    validating.value = false;\n    errors.value = results;\n    errorResult.value = results?.[0];\n\n    return results;\n  }\n\n  function resetError() {\n    errors.value = [];\n    errorResult.value = undefined;\n  }\n\n  return {\n    invokeValidators,\n    resetError,\n    validating,\n    validateOn,\n    errorResult,\n    errors,\n    isError,\n    isSuccess,\n  };\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yuyeon",
-  "version": "0.0.42-rc16",
+  "version": "0.0.42-rc18",
   "keywords": [
     "UI Library",
     "Vue"

package/types/components/field-input/YFieldInput.d.ts

@@ -5,6 +5,7 @@ export declare const pressYFieldInputPropsOptions: <Defaults extends {
     readonly?: unknown;
     disabled?: unknown;
     status?: unknown;
+    helperText?: unknown;
     validators?: unknown;
     validateOn?: unknown;
     validationValue?: unknown;
@@ -58,6 +59,10 @@ export declare const pressYFieldInputPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"]>;
         default: unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"];
     };
+    helperText: unknown extends Defaults["helperText"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"]>;
+        default: unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"];
+    };
     validators: unknown extends Defaults["validators"] ? PropType<string[] | ((v: any) => string | boolean)[]> : {
         type: PropType<unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"]>;
         default: unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"];
@@ -232,6 +237,7 @@ export declare const YFieldInput: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;
@@ -302,6 +308,7 @@ export declare const YFieldInput: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;

package/types/components/input/YInput.d.ts

@@ -5,6 +5,7 @@ export declare const pressYInputPropsOptions: <Defaults extends {
     readonly?: unknown;
     disabled?: unknown;
     status?: unknown;
+    helperText?: unknown;
     validators?: unknown;
     validateOn?: unknown;
     validationValue?: unknown;
@@ -52,6 +53,10 @@ export declare const pressYInputPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"]>;
         default: unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"];
     };
+    helperText: unknown extends Defaults["helperText"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"]>;
+        default: unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"];
+    };
     validators: unknown extends Defaults["validators"] ? PropType<string[] | ((v: any) => string | boolean)[]> : {
         type: PropType<unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"]>;
         default: unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"];
@@ -184,6 +189,7 @@ export declare const YInput: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;
@@ -237,6 +243,7 @@ export declare const YInput: import("vue").DefineComponent<{
     whenFocus: () => void;
     whenBlur: () => void;
     createLabel: () => VNode | undefined;
+    invokeValidators: () => Promise<any[]>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "focus" | "click" | "mousedown" | "mouseup" | "blur" | "mousedown:display" | "mouseup:display" | "click:leading" | "update:modelValue" | "update:focused")[], "error" | "focus" | "click" | "mousedown" | "mouseup" | "blur" | "mousedown:display" | "mouseup:display" | "click:leading" | "update:modelValue" | "update:focused", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     focused: BooleanConstructor;
     'onUpdate:focused': PropType<(v: boolean) => void>;
@@ -246,6 +253,7 @@ export declare const YInput: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;

package/types/components/select/YSelect.d.ts

@@ -599,6 +599,7 @@ export declare const pressYSelectPropsOptions: <Defaults extends {
     readonly?: unknown;
     disabled?: unknown;
     status?: unknown;
+    helperText?: unknown;
     validators?: unknown;
     validateOn?: unknown;
     validationValue?: unknown;
@@ -721,6 +722,10 @@ export declare const pressYSelectPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"]>;
         default: unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"];
     };
+    helperText: unknown extends Defaults["helperText"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"]>;
+        default: unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"];
+    };
     validators: unknown extends Defaults["validators"] ? PropType<string[] | ((v: any) => string | boolean)[]> : {
         type: PropType<unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"]>;
         default: unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"];
@@ -1527,6 +1532,7 @@ export declare const YSelect: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;
@@ -5643,6 +5649,7 @@ export declare const YSelect: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;

package/types/components/textarea/YTextarea.d.ts

@@ -6,6 +6,7 @@ export declare const pressYTextareaPropsOptions: <Defaults extends {
     readonly?: unknown;
     disabled?: unknown;
     status?: unknown;
+    helperText?: unknown;
     validators?: unknown;
     validateOn?: unknown;
     validationValue?: unknown;
@@ -55,6 +56,10 @@ export declare const pressYTextareaPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"]>;
         default: unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : NonNullable<"success" | "warning" | "error" | undefined> | Defaults["status"];
     };
+    helperText: unknown extends Defaults["helperText"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"]>;
+        default: unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"];
+    };
     validators: unknown extends Defaults["validators"] ? PropType<string[] | ((v: any) => string | boolean)[]> : {
         type: PropType<unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"]>;
         default: unknown extends Defaults["validators"] ? string[] | ((v: any) => string | boolean)[] : NonNullable<string[] | ((v: any) => string | boolean)[]> | Defaults["validators"];
@@ -201,6 +206,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;
@@ -271,6 +277,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
             readonly height?: string | number | undefined;
             readonly modelValue?: any;
             readonly status?: "success" | "warning" | "error" | undefined;
+            readonly helperText?: string | undefined;
             readonly validateOn?: string | undefined;
             readonly validationValue?: any;
             readonly readonly?: boolean | undefined;
@@ -370,6 +377,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
                 type: PropType<"success" | "warning" | "error" | undefined>;
                 validator(value: string): boolean;
             };
+            helperText: StringConstructor;
             validators: PropType<string[] | ((v: any) => string | boolean)[]>;
             validateOn: {
                 type: PropType<string>;
@@ -437,6 +445,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
             createLabel: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
             }> | undefined;
+            invokeValidators: () => Promise<any[]>;
         }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "focus" | "click" | "mousedown" | "mouseup" | "blur" | "mousedown:display" | "mouseup:display" | "click:leading" | "update:modelValue" | "update:focused")[], string, {
             displayTag: string;
             autoSelect: boolean;
@@ -490,6 +499,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
             type: PropType<"success" | "warning" | "error" | undefined>;
             validator(value: string): boolean;
         };
+        helperText: StringConstructor;
         validators: PropType<string[] | ((v: any) => string | boolean)[]>;
         validateOn: {
             type: PropType<string>;
@@ -557,6 +567,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
         createLabel: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
             [key: string]: any;
         }> | undefined;
+        invokeValidators: () => Promise<any[]>;
     }> & {} & import("vue").ComponentCustomProperties & {}) | undefined>;
     input$: import("vue").Ref<any>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -579,6 +590,7 @@ export declare const YTextarea: import("vue").DefineComponent<{
         type: PropType<"success" | "warning" | "error" | undefined>;
         validator(value: string): boolean;
     };
+    helperText: StringConstructor;
     validators: PropType<string[] | ((v: any) => string | boolean)[]>;
     validateOn: {
         type: PropType<string>;

package/types/composables/validation.d.ts

@@ -3,6 +3,7 @@ export declare const pressValidationPropsOptions: <Defaults extends {
     readonly?: unknown;
     disabled?: unknown;
     status?: unknown;
+    helperText?: unknown;
     validators?: unknown;
     validateOn?: unknown;
     validationValue?: unknown;
@@ -26,6 +27,10 @@ export declare const pressValidationPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : Defaults["status"] | NonNullable<"success" | "warning" | "error" | undefined>>;
         default: unknown extends Defaults["status"] ? "success" | "warning" | "error" | undefined : Defaults["status"] | NonNullable<"success" | "warning" | "error" | undefined>;
     };
+    helperText: unknown extends Defaults["helperText"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"]>;
+        default: unknown extends Defaults["helperText"] ? string : string | Defaults["helperText"];
+    };
     validators: unknown extends Defaults["validators"] ? PropType<string[] | ((v: any) => boolean | string)[]> : {
         type: PropType<unknown extends Defaults["validators"] ? string[] | ((v: any) => boolean | string)[] : Defaults["validators"] | NonNullable<string[] | ((v: any) => boolean | string)[]>>;
         default: unknown extends Defaults["validators"] ? string[] | ((v: any) => boolean | string)[] : Defaults["validators"] | NonNullable<string[] | ((v: any) => boolean | string)[]>;