yuyeon 0.2.3-rc.2 → 0.2.3-rc.21

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

@@ -1 +1 @@
-{"version":3,"file":"YInput.mjs","names":["computed","ref","shallowRef","watch","useRender","pressFocusPropsOptions","useFocus","pressThemePropsOptions","useLocalTheme","pressValidationPropsOptions","useValidation","defineComponent","getUid","propsFactory","toStyleSizeValue","NAME","pressYInputPropsOptions","name","String","width","type","Number","height","displayTag","default","label","modelValue","Array","Object","autoSelect","Boolean","floating","floated","placeholder","required","loading","variation","outlined","filled","ceramic","extended","YInput","props","emits","slots","setup","_ref","attrs","expose","emit","UID","themeClasses","focused","isFocused","focusedClasses","whenFocus","whenBlur","isDisabled","isReadonly","isLoading","invokeValidators","isError","isSuccess","errors","errorResult","stack$","display$","inValue","lazyValue","hasMouseDown","variations","split","map","value","trim","isFloatedLabel","classes","includes","displayStyles","neo","readonly","onClick","event","onMousedown","e","onMouseup","onFocus","onBlur","onClickLeading","onChange","createLabel","show","undefined","_createVNode","_Fragment","_createTextVNode","validate","prepend","leading","error","attrId","toString","trailing","helperText","append"],"sources":["../../../src/components/input/YInput.tsx"],"sourcesContent":["import {\r\n  type PropType,\r\n  type SlotsType,\r\n  type VNode,\r\n  computed,\r\n  ref,\r\n  shallowRef,\r\n  watch,\r\n} from 'vue';\r\n\r\nimport { useRender } from '@/composables/component';\r\nimport { pressFocusPropsOptions, useFocus } from '@/composables/focus';\r\nimport { pressThemePropsOptions, useLocalTheme } from '@/composables/theme';\r\nimport {\r\n  pressValidationPropsOptions,\r\n  useValidation,\r\n} from '@/composables/validation';\r\nimport { defineComponent, getUid, propsFactory } from '@/util/component';\r\nimport { toStyleSizeValue } from '@/util/ui';\r\n\r\nimport './YInput.scss';\r\n\r\nconst NAME = 'y-input';\r\n\r\nexport const pressYInputPropsOptions = propsFactory(\r\n  {\r\n    name: String,\r\n    width: {\r\n      type: [String, Number] as PropType<string | number>,\r\n    },\r\n    height: [Number, String],\r\n    displayTag: {\r\n      type: String as PropType<string>,\r\n      default: 'div',\r\n    },\r\n    label: String as PropType<string>,\r\n    modelValue: { type: [String, Number, Array, Object] as PropType<any> },\r\n    autoSelect: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: true,\r\n    },\r\n    floating: { type: Boolean as PropType<boolean>, default: false },\r\n    floated: { type: Boolean as PropType<boolean>, default: () => false },\r\n    placeholder: String as PropType<string>,\r\n    required: Boolean as PropType<boolean>,\r\n    loading: Boolean as PropType<boolean>,\r\n    // variations\r\n    variation: String as PropType<string>,\r\n    outlined: Boolean as PropType<boolean>,\r\n    filled: Boolean as PropType<boolean>,\r\n    ceramic: Boolean as PropType<boolean>,\r\n    // validate\r\n    ...pressValidationPropsOptions(),\r\n    ...pressFocusPropsOptions(),\r\n    extended: Object as PropType<any>,\r\n  },\r\n  'YInput',\r\n);\r\n\r\nexport interface YInputDefaultSlotProps {\r\n  value: any;\r\n  loading: boolean;\r\n  attrId: string;\r\n}\r\n\r\nexport const YInput = defineComponent({\r\n  name: 'YInput',\r\n  props: {\r\n    ...pressThemePropsOptions(),\r\n    ...pressYInputPropsOptions(),\r\n  },\r\n  emits: [\r\n    'error',\r\n    'click',\r\n    'mousedown',\r\n    'mouseup',\r\n    'focus',\r\n    'blur',\r\n    'mousedown:display',\r\n    'mouseup:display',\r\n    'click:leading',\r\n    'update:modelValue',\r\n    'update:focused',\r\n  ],\r\n  slots: Object as SlotsType<{\r\n    prepend: any;\r\n    append: any;\r\n    label: any;\r\n    default: YInputDefaultSlotProps;\r\n    leading: { error: boolean };\r\n    trailing: any;\r\n    'leading-out': any;\r\n    'trailing-out': any;\r\n    'helper-text': {\r\n      error: boolean;\r\n      errorResult: string | undefined;\r\n      errors: any[];\r\n    };\r\n  }>,\r\n  setup(props, { slots, attrs, expose, emit }) {\r\n    const UID = getUid();\r\n    const { themeClasses } = useLocalTheme(props);\r\n    const {\r\n      focused: isFocused,\r\n      focusedClasses,\r\n      whenFocus,\r\n      whenBlur,\r\n    } = useFocus(props, 'y-input');\r\n\r\n    const {\r\n      isDisabled,\r\n      isReadonly,\r\n      isLoading,\r\n      invokeValidators,\r\n      isError,\r\n      isSuccess,\r\n      errors,\r\n      errorResult,\r\n    } = useValidation(props, NAME, UID);\r\n\r\n    const stack$ = ref();\r\n    const display$ = ref();\r\n\r\n    const inValue = ref();\r\n    const lazyValue = ref();\r\n    const hasMouseDown = shallowRef(false);\r\n\r\n    const variations = computed(() => {\r\n      if (props.variation) {\r\n        return props.variation.split(',').map((value) => {\r\n          return value.trim();\r\n        });\r\n      }\r\n      return [];\r\n    });\r\n\r\n    const isFloatedLabel = computed(() => {\r\n      return (\r\n        props.floated ||\r\n        !!props.placeholder ||\r\n        (!props.placeholder && isFocused.value) ||\r\n        !!inValue.value\r\n      );\r\n    });\r\n\r\n    const classes = computed(() => {\r\n      return {\r\n        // Style\r\n        [themeClasses.value as string]: true,\r\n        'y-input--ceramic': !!props.ceramic,\r\n        'y-input--outlined':\r\n          !props.ceramic &&\r\n          (variations.value.includes('outlined') || !!props.outlined),\r\n        'y-input--filled':\r\n          variations.value.includes('filled') || !!props.filled,\r\n        // Value\r\n        'y-input--loading': isLoading.value,\r\n        'y-input--has-value': !!inValue.value,\r\n        'y-input--focused': isFocused.value,\r\n        'y-input--readonly': isReadonly.value,\r\n        'y-input--disabled': isDisabled.value,\r\n        'y-input--error': isError.value,\r\n        'y-input--success': isSuccess.value,\r\n      };\r\n    });\r\n\r\n    const displayStyles = computed<Record<string, any>>(() => {\r\n      return {\r\n        width: toStyleSizeValue(props.width),\r\n        height: toStyleSizeValue(props.height),\r\n      };\r\n    });\r\n\r\n    watch(\r\n      () => props.modelValue,\r\n      (neo) => {\r\n        inValue.value = neo;\r\n      },\r\n    );\r\n\r\n    watch(\r\n      () => props.readonly,\r\n      (neo) => {\r\n        if (!neo) {\r\n          inValue.value = props.modelValue;\r\n        }\r\n      },\r\n    );\r\n\r\n    watch(inValue, (neo) => {\r\n      if (!isReadonly.value && !isLoading.value) {\r\n        emit('update:modelValue', neo);\r\n      }\r\n    });\r\n\r\n    watch(isError, (neo) => {\r\n      emit('error', neo, errors.value);\r\n    });\r\n\r\n    watch(\r\n      () => props.focused,\r\n      (neo) => {\r\n        if (!neo) {\r\n          invokeValidators();\r\n        }\r\n      },\r\n    );\r\n\r\n    function onClick(event: MouseEvent) {\r\n      emit('click', event);\r\n    }\r\n\r\n    function onMousedown(e: Event) {\r\n      hasMouseDown.value = true;\r\n      emit('mousedown:display', e);\r\n    }\r\n\r\n    function onMouseup(e: Event) {\r\n      hasMouseDown.value = false;\r\n      emit('mouseup:display', e);\r\n    }\r\n\r\n    function onFocus(event: FocusEvent) {\r\n      whenFocus();\r\n      emit('focus', event);\r\n    }\r\n\r\n    function onBlur(event: FocusEvent) {\r\n      whenBlur();\r\n      invokeValidators();\r\n      emit('blur', event);\r\n    }\r\n\r\n    function onClickLeading(event: MouseEvent) {\r\n      emit('click:leading', event);\r\n    }\r\n\r\n    function onChange(event?: Event) {\r\n      invokeValidators();\r\n    }\r\n\r\n    function createLabel(): VNode | undefined {\r\n      const show = !!props.label || !!slots.label;\r\n      if (!show) {\r\n        return undefined;\r\n      }\r\n      return (\r\n        <label\r\n          class={[\r\n            {\r\n              [`${NAME}__label`]: true,\r\n              'y-input__floating-label': props.floating,\r\n              'y-input__floating-label--floated':\r\n                props.floating && isFloatedLabel.value,\r\n            },\r\n          ]}\r\n          for={`y-input--${UID}`}\r\n        >\r\n          {slots.label ? (\r\n            slots.label()\r\n          ) : props.label ? (\r\n            <>\r\n              {props.label}\r\n              {props.required && (\r\n                <span class={'y-input__required-mark'}>*</span>\r\n              )}\r\n            </>\r\n          ) : (\r\n            props.placeholder && !inValue.value && props.placeholder\r\n          )}\r\n        </label>\r\n      );\r\n    }\r\n\r\n    expose({\r\n      ...(props.extended ?? {}),\r\n      createLabel,\r\n      invokeValidators,\r\n      validate: invokeValidators,\r\n    });\r\n\r\n    useRender(() => {\r\n      return (\r\n        <div class={[`${NAME}`, { ...classes.value }]}>\r\n          {slots.prepend && (\r\n            <div class={`${NAME}__prepend`}>{slots.prepend()}</div>\r\n          )}\r\n          <div ref={stack$} class={[`${NAME}__stack`]}>\r\n            {!props.floating && createLabel()}\r\n            {slots['leading-out'] && slots['leading-out']()}\r\n            <div\r\n              ref={display$}\r\n              class={`${NAME}__display`}\r\n              style={[{ ...displayStyles.value }]}\r\n              onClick={onClick}\r\n              onMousedown={onMousedown}\r\n              onMouseup={onMouseup}\r\n            >\r\n              <div class={`${NAME}__plate`}></div>\r\n              {slots.leading && (\r\n                <div class={'y-input__leading'} onClick={onClickLeading}>\r\n                  {slots.leading({ error: isError.value })}\r\n                </div>\r\n              )}\r\n              {slots.default ? (\r\n                slots.default({\r\n                  value: props.modelValue,\r\n                  loading: isLoading.value,\r\n                  attrId: `y-input--${UID}`,\r\n                })\r\n              ) : (\r\n                <div\r\n                  class={`${NAME}__value`}\r\n                  data-id={`y-input--${UID}`}\r\n                  tabindex={0}\r\n                  onFocus={onFocus}\r\n                  onBlur={onBlur}\r\n                >\r\n                  {props.floating && createLabel()}\r\n                  {props.modelValue?.toString()}\r\n                </div>\r\n              )}\r\n              {slots.trailing?.()}\r\n            </div>\r\n            {slots['trailing-out'] && slots['trailing-out']()}\r\n            <div class={`${NAME}__helper-text`}>\r\n              {slots['helper-text'] ? (\r\n                <span>\r\n                  {slots['helper-text']({\r\n                    error: isError.value,\r\n                    errors: errors.value,\r\n                    errorResult: errorResult.value,\r\n                  })}\r\n                </span>\r\n              ) : (\r\n                props.helperText ?? errorResult.value\r\n              )}\r\n            </div>\r\n          </div>\r\n          {slots.append && (\r\n            <div class={`${NAME}__append`}>{slots.append()}</div>\r\n          )}\r\n        </div>\r\n      );\r\n    });\r\n\r\n    return {\r\n      ...(props.extended ?? {}),\r\n      themeClasses,\r\n      isFocused,\r\n      focusedClasses,\r\n      whenFocus,\r\n      whenBlur,\r\n      createLabel,\r\n      invokeValidators,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YInput = InstanceType<typeof YInput>;\r\n"],"mappings":"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"}
+{"version":3,"file":"YInput.mjs","names":["computed","ref","shallowRef","watch","useRender","pressFocusPropsOptions","useFocus","pressThemePropsOptions","useLocalTheme","pressValidationPropsOptions","useValidation","defineComponent","getUid","propsFactory","toStyleSizeValue","NAME","pressYInputPropsOptions","name","String","width","type","Number","height","displayTag","default","label","modelValue","Array","Object","autoSelect","Boolean","floating","floated","placeholder","required","loading","variation","outlined","filled","ceramic","extended","YInput","props","emits","slots","setup","_ref","attrs","expose","emit","UID","themeClasses","focused","isFocused","focusedClasses","whenFocus","whenBlur","isDisabled","isReadonly","isLoading","invokeValidators","resetError","isError","isSuccess","errors","errorResult","stack$","display$","inValue","lazyValue","hasMouseDown","variations","split","map","value","trim","isFloatedLabel","classes","includes","displayStyles","neo","readonly","onClick","event","onMousedown","e","onMouseup","onKeydown","onFocus","onBlur","onClickLeading","onChange","createLabel","show","undefined","_createVNode","_Fragment","_createTextVNode","validate","prepend","leading","error","attrId","toString","trailing","helperText","append"],"sources":["../../../src/components/input/YInput.tsx"],"sourcesContent":["import {\r\n  type PropType,\r\n  type SlotsType,\r\n  type VNode,\r\n  computed,\r\n  ref,\r\n  shallowRef,\r\n  watch,\r\n} from 'vue';\r\n\r\nimport { useRender } from '@/composables/component';\r\nimport { pressFocusPropsOptions, useFocus } from '@/composables/focus';\r\nimport { pressThemePropsOptions, useLocalTheme } from '@/composables/theme';\r\nimport {\r\n  pressValidationPropsOptions,\r\n  useValidation,\r\n} from '@/composables/validation';\r\nimport { defineComponent, getUid, propsFactory } from '@/util/component';\r\nimport { toStyleSizeValue } from '@/util/ui';\r\n\r\nimport './YInput.scss';\r\n\r\nconst NAME = 'y-input';\r\n\r\nexport const pressYInputPropsOptions = propsFactory(\r\n  {\r\n    name: String,\r\n    width: {\r\n      type: [String, Number] as PropType<string | number>,\r\n    },\r\n    height: [Number, String],\r\n    displayTag: {\r\n      type: String as PropType<string>,\r\n      default: 'div',\r\n    },\r\n    label: String as PropType<string>,\r\n    modelValue: { type: [String, Number, Array, Object] as PropType<any> },\r\n    autoSelect: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: true,\r\n    },\r\n    floating: { type: Boolean as PropType<boolean>, default: false },\r\n    floated: { type: Boolean as PropType<boolean>, default: () => false },\r\n    placeholder: String as PropType<string>,\r\n    required: Boolean as PropType<boolean>,\r\n    loading: Boolean as PropType<boolean>,\r\n    // variations\r\n    variation: String as PropType<string>,\r\n    outlined: Boolean as PropType<boolean>,\r\n    filled: Boolean as PropType<boolean>,\r\n    ceramic: Boolean as PropType<boolean>,\r\n    // validate\r\n    ...pressValidationPropsOptions(),\r\n    ...pressFocusPropsOptions(),\r\n    extended: Object as PropType<any>,\r\n  },\r\n  'YInput',\r\n);\r\n\r\nexport interface YInputDefaultSlotProps {\r\n  value: any;\r\n  loading: boolean;\r\n  attrId: string;\r\n}\r\n\r\nexport const YInput = defineComponent({\r\n  name: 'YInput',\r\n  props: {\r\n    ...pressThemePropsOptions(),\r\n    ...pressYInputPropsOptions(),\r\n  },\r\n  emits: [\r\n    'error',\r\n    'click',\r\n    'mousedown',\r\n    'mouseup',\r\n    'focus',\r\n    'blur',\r\n    'mousedown:display',\r\n    'mouseup:display',\r\n    'keydown:display',\r\n    'click:leading',\r\n    'update:modelValue',\r\n    'update:focused',\r\n  ],\r\n  slots: Object as SlotsType<{\r\n    prepend: any;\r\n    append: any;\r\n    label: any;\r\n    default: YInputDefaultSlotProps;\r\n    leading: { error: boolean };\r\n    trailing: any;\r\n    'leading-out': any;\r\n    'trailing-out': any;\r\n    'helper-text': {\r\n      error: boolean;\r\n      errorResult: string | undefined;\r\n      errors: any[];\r\n    };\r\n  }>,\r\n  setup(props, { slots, attrs, expose, emit }) {\r\n    const UID = getUid();\r\n    const { themeClasses } = useLocalTheme(props);\r\n    const {\r\n      focused: isFocused,\r\n      focusedClasses,\r\n      whenFocus,\r\n      whenBlur,\r\n    } = useFocus(props, 'y-input');\r\n\r\n    const {\r\n      isDisabled,\r\n      isReadonly,\r\n      isLoading,\r\n      invokeValidators,\r\n      resetError,\r\n      isError,\r\n      isSuccess,\r\n      errors,\r\n      errorResult,\r\n    } = useValidation(props, NAME, UID);\r\n\r\n    const stack$ = ref();\r\n    const display$ = ref();\r\n\r\n    const inValue = ref();\r\n    const lazyValue = ref();\r\n    const hasMouseDown = shallowRef(false);\r\n\r\n    const variations = computed(() => {\r\n      if (props.variation) {\r\n        return props.variation.split(',').map((value) => {\r\n          return value.trim();\r\n        });\r\n      }\r\n      return [];\r\n    });\r\n\r\n    const isFloatedLabel = computed(() => {\r\n      return (\r\n        props.floated ||\r\n        !!props.placeholder ||\r\n        (!props.placeholder && isFocused.value) ||\r\n        !!inValue.value\r\n      );\r\n    });\r\n\r\n    const classes = computed(() => {\r\n      return {\r\n        // Style\r\n        [themeClasses.value as string]: true,\r\n        'y-input--ceramic': !!props.ceramic,\r\n        'y-input--outlined':\r\n          !props.ceramic &&\r\n          (variations.value.includes('outlined') || !!props.outlined),\r\n        'y-input--filled':\r\n          variations.value.includes('filled') || !!props.filled,\r\n        // Value\r\n        'y-input--loading': isLoading.value,\r\n        'y-input--has-value': !!inValue.value,\r\n        'y-input--focused': isFocused.value,\r\n        'y-input--readonly': isReadonly.value,\r\n        'y-input--disabled': isDisabled.value,\r\n        'y-input--error': isError.value,\r\n        'y-input--success': isSuccess.value,\r\n      };\r\n    });\r\n\r\n    const displayStyles = computed<Record<string, any>>(() => {\r\n      return {\r\n        width: toStyleSizeValue(props.width),\r\n        height: toStyleSizeValue(props.height),\r\n      };\r\n    });\r\n\r\n    watch(\r\n      () => props.modelValue,\r\n      (neo) => {\r\n        inValue.value = neo;\r\n      },\r\n    );\r\n\r\n    watch(\r\n      () => props.readonly,\r\n      (neo) => {\r\n        if (!neo) {\r\n          inValue.value = props.modelValue;\r\n        }\r\n      },\r\n    );\r\n\r\n    watch(inValue, (neo) => {\r\n      if (!isReadonly.value && !isLoading.value) {\r\n        emit('update:modelValue', neo);\r\n      }\r\n    });\r\n\r\n    watch(isError, (neo) => {\r\n      emit('error', neo, errors.value);\r\n    });\r\n\r\n    watch(\r\n      () => props.focused,\r\n      (neo) => {\r\n        if (!neo) {\r\n          invokeValidators();\r\n        }\r\n      },\r\n    );\r\n\r\n    function onClick(event: MouseEvent) {\r\n      emit('click', event);\r\n    }\r\n\r\n    function onMousedown(e: Event) {\r\n      hasMouseDown.value = true;\r\n      emit('mousedown:display', e);\r\n    }\r\n\r\n    function onMouseup(e: Event) {\r\n      hasMouseDown.value = false;\r\n      emit('mouseup:display', e);\r\n    }\r\n\r\n    function onKeydown(e: Event) {\r\n      emit('keydown:display', e);\r\n    }\r\n\r\n    function onFocus(event: FocusEvent) {\r\n      whenFocus();\r\n      emit('focus', event);\r\n    }\r\n\r\n    function onBlur(event: FocusEvent) {\r\n      whenBlur();\r\n      invokeValidators();\r\n      emit('blur', event);\r\n    }\r\n\r\n    function onClickLeading(event: MouseEvent) {\r\n      emit('click:leading', event);\r\n    }\r\n\r\n    function onChange(event?: Event) {\r\n      invokeValidators();\r\n    }\r\n\r\n    function createLabel(): VNode | undefined {\r\n      const show = !!props.label || !!slots.label;\r\n      if (!show) {\r\n        return undefined;\r\n      }\r\n      return (\r\n        <label\r\n          class={[\r\n            {\r\n              [`${NAME}__label`]: true,\r\n              'y-input__floating-label': props.floating,\r\n              'y-input__floating-label--floated':\r\n                props.floating && isFloatedLabel.value,\r\n            },\r\n          ]}\r\n          for={`y-input--${UID}`}\r\n        >\r\n          {slots.label ? (\r\n            slots.label()\r\n          ) : props.label ? (\r\n            <>\r\n              {props.label}\r\n              {props.required && (\r\n                <span class={'y-input__required-mark'}>*</span>\r\n              )}\r\n            </>\r\n          ) : (\r\n            props.placeholder && !inValue.value && props.placeholder\r\n          )}\r\n        </label>\r\n      );\r\n    }\r\n\r\n    expose({\r\n      ...(props.extended ?? {}),\r\n      createLabel,\r\n      invokeValidators,\r\n      validate: invokeValidators,\r\n      resetError,\r\n    });\r\n\r\n    useRender(() => {\r\n      return (\r\n        <div class={[`${NAME}`, { ...classes.value }]}>\r\n          {slots.prepend && (\r\n            <div class={`${NAME}__prepend`}>{slots.prepend()}</div>\r\n          )}\r\n          <div ref={stack$} class={[`${NAME}__stack`]}>\r\n            {!props.floating && createLabel()}\r\n            {slots['leading-out'] && slots['leading-out']()}\r\n            <div\r\n              ref={display$}\r\n              class={`${NAME}__display`}\r\n              style={[{ ...displayStyles.value }]}\r\n              data-base-parent={true}\r\n              onClick={onClick}\r\n              onMousedown={onMousedown}\r\n              onMouseup={onMouseup}\r\n              onKeydown={onKeydown}\r\n            >\r\n              <div class={`${NAME}__plate`}></div>\r\n              {slots.leading && (\r\n                <div class={'y-input__leading'} onClick={onClickLeading}>\r\n                  {slots.leading({ error: isError.value })}\r\n                </div>\r\n              )}\r\n              {slots.default ? (\r\n                slots.default({\r\n                  value: props.modelValue,\r\n                  loading: isLoading.value,\r\n                  attrId: `y-input--${UID}`,\r\n                })\r\n              ) : (\r\n                <div\r\n                  class={`${NAME}__value`}\r\n                  data-id={`y-input--${UID}`}\r\n                  tabindex={0}\r\n                  onFocus={onFocus}\r\n                  onBlur={onBlur}\r\n                >\r\n                  {props.floating && createLabel()}\r\n                  {props.modelValue?.toString()}\r\n                </div>\r\n              )}\r\n              {slots.trailing?.()}\r\n            </div>\r\n            {slots['trailing-out'] && slots['trailing-out']()}\r\n            <div class={`${NAME}__helper-text`}>\r\n              {slots['helper-text'] ? (\r\n                <span>\r\n                  {slots['helper-text']({\r\n                    error: isError.value,\r\n                    errors: errors.value,\r\n                    errorResult: errorResult.value,\r\n                  })}\r\n                </span>\r\n              ) : (\r\n                props.helperText ?? errorResult.value\r\n              )}\r\n            </div>\r\n          </div>\r\n          {slots.append && (\r\n            <div class={`${NAME}__append`}>{slots.append()}</div>\r\n          )}\r\n        </div>\r\n      );\r\n    });\r\n\r\n    return {\r\n      ...(props.extended ?? {}),\r\n      themeClasses,\r\n      isFocused,\r\n      focusedClasses,\r\n      whenFocus,\r\n      whenBlur,\r\n      createLabel,\r\n      invokeValidators,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YInput = InstanceType<typeof YInput>;\r\n"],"mappings":"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"}

package/lib/components/layer/YLayer.mjs

@@ -100,6 +100,16 @@ export const YLayer = defineComponent({
     const scrim$ = ref();
     const content$ = ref();
     const root$ = ref();
+    const model = useModelDuplex(props);
+    const active = computed({
+      get: () => {
+        return !!model.value;
+      },
+      set: v => {
+        if (!(v && props.disabled)) model.value = v;
+      }
+    });
+    // Frags
     const {
       base,
       base$,
@@ -107,6 +117,9 @@ export const YLayer = defineComponent({
       baseSlot,
       baseFromSlotEl
     } = useBase(props);
+    const {
+      contentEvents
+    } = useContent(props, active);
     const {
       themeClasses
     } = useLocalTheme(props);
@@ -114,32 +127,22 @@ export const YLayer = defineComponent({
       layerGroup,
       layerGroupState,
       getActiveLayers
-    } = useLayerGroup(computed(() => props.layerGroup));
+    } = useLayerGroup(props);
     const {
       polyTransitionBindProps
     } = usePolyTransition(props);
     const {
       dimensionStyles
     } = useDimension(props);
-    const model = useModelDuplex(props);
-    const active = computed({
-      get: () => {
-        return !!model.value;
-      },
-      set: v => {
-        if (!(v && props.disabled)) model.value = v;
-      }
-    });
-    const {
-      contentEvents
-    } = useContent(props, active);
-    const finish = shallowRef(false);
-    const hovered = ref(false);
-    const disabled = toRef(props, 'disabled');
     const {
       lazyValue,
       onAfterUpdate
     } = useLazy(toRef(props, 'eager'), active);
+    // States
+    const finish = shallowRef(false);
+    const hovered = ref(false);
+    const focused = ref(false);
+    const disabled = toRef(props, 'disabled');
     const rendered = computed(() => !disabled.value && (lazyValue.value || active.value));
     const {
       coordinateStyles,
@@ -239,7 +242,8 @@ export const YLayer = defineComponent({
           class: {
             'y-layer-base': true,
             'y-layer-base--active': active.value
-          }
+          },
+          ...(props.baseProps ?? {})
         })
       });
       baseSlot.value = slotBase;

package/lib/components/layer/YLayer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YLayer.mjs","names":["Teleport","Transition","computed","getCurrentInstance","mergeProps","reactive","ref","shallowRef","toRef","useModelDuplex","useRender","pressCoordinateProps","useCoordinate","pressDimensionPropsOptions","useDimension","useLayerGroup","pressThemePropsOptions","useLocalTheme","useLazy","PolyTransition","pressPolyTransitionPropsOptions","usePolyTransition","ComplementClick","bindClasses","defineComponent","propsFactory","pressBasePropsOptions","useBase","pressContentPropsOptions","useContent","pressScrollStrategyProps","useScrollStrategies","pressYLayerProps","modelValue","type","Boolean","scrim","scrimOpacity","Number","eager","classes","Array","String","Object","contentClasses","closeClickScrim","contentStyles","default","disabled","openOnHover","openDelay","closeDelay","zIndex","contained","layerGroup","YLayer","name","inheritAttrs","components","directives","props","modal","emits","value","mouseEvent","afterLeave","slots","setup","_ref","emit","expose","attrs","vm","scrim$","content$","root$","base","base$","baseEl","baseSlot","baseFromSlotEl","themeClasses","layerGroupState","getActiveLayers","polyTransitionBindProps","dimensionStyles","model","active","get","set","v","contentEvents","finish","hovered","lazyValue","onAfterUpdate","rendered","coordinateStyles","updateCoordinate","contentEl","root","onClickComplementLayer","target","closeConditional","complementClickOption","handler","determine","include","onAfterEnter","onAfterLeave","onClickScrim","onMouseenter","event","onMouseleave","computedStyle","toString","computedClass","boundClasses","computedContentClasses","isMe","vnode","slotBase","class","_createVNode","_Fragment","_mergeProps","_withDirectives","_vShow","_resolveDirective"],"sources":["../../../src/components/layer/YLayer.tsx"],"sourcesContent":["import type {\r\n  CSSProperties,\r\n  ComponentInternalInstance,\r\n  PropType,\r\n  SlotsType,\r\n} from 'vue';\r\nimport {\r\n  Teleport,\r\n  Transition,\r\n  computed,\r\n  getCurrentInstance,\r\n  mergeProps,\r\n  reactive,\r\n  ref,\r\n  shallowRef,\r\n  toRef,\r\n} from 'vue';\r\n\r\nimport { useModelDuplex } from '@/composables/communication';\r\nimport { useRender } from '@/composables/component';\r\nimport { pressCoordinateProps, useCoordinate } from '@/composables/coordinate';\r\nimport {\r\n  pressDimensionPropsOptions,\r\n  useDimension,\r\n} from '@/composables/dimension';\r\nimport { useLayerGroup } from '@/composables/layer-group';\r\nimport { pressThemePropsOptions, useLocalTheme } from '@/composables/theme';\r\nimport { useLazy } from '@/composables/timing';\r\nimport {\r\n  PolyTransition,\r\n  pressPolyTransitionPropsOptions,\r\n  usePolyTransition,\r\n} from '@/composables/transition';\r\nimport {\r\n  ComplementClick,\r\n  ComplementClickBindingOptions,\r\n} from '@/directives/complement-click';\r\nimport { bindClasses, defineComponent, propsFactory } from '@/util/component';\r\n\r\nimport { pressBasePropsOptions, useBase } from './base';\r\nimport { pressContentPropsOptions, useContent } from './content';\r\nimport {\r\n  pressScrollStrategyProps,\r\n  useScrollStrategies,\r\n} from './scroll-strategies';\r\n\r\nimport './YLayer.scss';\r\n\r\nexport const pressYLayerProps = propsFactory(\r\n  {\r\n    modelValue: {\r\n      type: Boolean as PropType<boolean>,\r\n    },\r\n    scrim: {\r\n      type: Boolean as PropType<boolean>,\r\n    },\r\n    scrimOpacity: {\r\n      type: Number as PropType<number>,\r\n    },\r\n    eager: {\r\n      type: Boolean as PropType<boolean>,\r\n    },\r\n    classes: {\r\n      type: [Array, String, Object] as PropType<\r\n        string[] | string | Record<string, any>\r\n      >,\r\n    },\r\n    contentClasses: {\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    contentStyles: {\r\n      type: Object as PropType<CSSProperties>,\r\n      default: () => {},\r\n    },\r\n    disabled: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: false,\r\n    },\r\n    openOnHover: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: false,\r\n    },\r\n    openDelay: {\r\n      type: Number as PropType<number>,\r\n      default: 200,\r\n    },\r\n    closeDelay: {\r\n      type: Number as PropType<number>,\r\n      default: 200,\r\n    },\r\n    zIndex: {\r\n      type: [Number, String] as PropType<number | string>,\r\n      default: 2000,\r\n    },\r\n    contained: Boolean,\r\n    layerGroup: [String, Object] as PropType<string | Element>,\r\n    ...pressThemePropsOptions(),\r\n    ...pressPolyTransitionPropsOptions(),\r\n    ...pressBasePropsOptions(),\r\n    ...pressContentPropsOptions(),\r\n    ...pressCoordinateProps(),\r\n    ...pressScrollStrategyProps(),\r\n    ...pressDimensionPropsOptions(),\r\n  },\r\n  'YLayer',\r\n);\r\n\r\nexport const YLayer = defineComponent({\r\n  name: 'YLayer',\r\n  inheritAttrs: false,\r\n  components: {\r\n    PolyTransition,\r\n  },\r\n  directives: {\r\n    ComplementClick,\r\n  },\r\n  props: {\r\n    modal: Boolean as PropType<boolean>,\r\n    ...pressYLayerProps(),\r\n  },\r\n  emits: {\r\n    'update:modelValue': (value: boolean) => true,\r\n    'click:complement': (mouseEvent: MouseEvent) => true,\r\n    afterLeave: () => true,\r\n  },\r\n  slots: Object as SlotsType<{\r\n    base: any;\r\n    default: any;\r\n  }>,\r\n  setup(props, { emit, expose, attrs, slots }) {\r\n    const vm = getCurrentInstance();\r\n\r\n    const scrim$ = ref<HTMLElement>();\r\n    const content$ = ref<HTMLElement>();\r\n    const root$ = ref<HTMLElement>();\r\n\r\n    const { base, base$, baseEl, baseSlot, baseFromSlotEl } = useBase(props);\r\n\r\n    const { themeClasses } = useLocalTheme(props);\r\n    const { layerGroup, layerGroupState, getActiveLayers } = useLayerGroup(\r\n      computed(() => props.layerGroup),\r\n    );\r\n    const { polyTransitionBindProps } = usePolyTransition(props);\r\n    const { dimensionStyles } = useDimension(props);\r\n    const model = useModelDuplex(props);\r\n\r\n    const active = computed({\r\n      get: (): boolean => {\r\n        return !!model.value;\r\n      },\r\n      set: (v: boolean) => {\r\n        if (!(v && props.disabled)) model.value = v;\r\n      },\r\n    });\r\n    const { contentEvents } = useContent(props, active);\r\n    const finish = shallowRef(false);\r\n    const hovered = ref(false);\r\n\r\n    const disabled = toRef(props, 'disabled');\r\n    const { lazyValue, onAfterUpdate } = useLazy(toRef(props, 'eager'), active);\r\n    const rendered = computed<boolean>(\r\n      () => !disabled.value && (lazyValue.value || active.value),\r\n    );\r\n\r\n    const { coordinateStyles, updateCoordinate } = useCoordinate(props, {\r\n      contentEl: content$,\r\n      base,\r\n      active,\r\n    });\r\n    useScrollStrategies(props, {\r\n      root: root$,\r\n      contentEl: content$,\r\n      active,\r\n      baseEl: base,\r\n      updateCoordinate,\r\n    });\r\n\r\n    function onClickComplementLayer(mouseEvent: MouseEvent) {\r\n      emit('click:complement', mouseEvent);\r\n      if (!props.modal) {\r\n        if (\r\n          scrim$.value !== null &&\r\n          scrim$.value === mouseEvent.target &&\r\n          props.closeClickScrim\r\n        ) {\r\n          active.value = false;\r\n        }\r\n      } else {\r\n        // TODO: shrug ani\r\n      }\r\n    }\r\n\r\n    function closeConditional(): boolean {\r\n      return (\r\n        (!props.openOnHover || (props.openOnHover && !hovered.value)) &&\r\n        active.value &&\r\n        finish.value\r\n      ); // TODO: && groupTopLevel.value;\r\n    }\r\n\r\n    const complementClickOption = reactive<ComplementClickBindingOptions>({\r\n      handler: onClickComplementLayer,\r\n      determine: closeConditional,\r\n      include: () => [baseEl.value],\r\n    });\r\n\r\n    function onAfterEnter() {\r\n      finish.value = true;\r\n    }\r\n\r\n    function onAfterLeave() {\r\n      onAfterUpdate();\r\n      finish.value = false;\r\n      emit('afterLeave');\r\n    }\r\n\r\n    function onClickScrim() {\r\n      if (props.closeClickScrim) {\r\n        active.value = false;\r\n      }\r\n    }\r\n\r\n    function onMouseenter(event: Event) {\r\n      hovered.value = true;\r\n    }\r\n\r\n    function onMouseleave(event: Event) {\r\n      hovered.value = false;\r\n    }\r\n\r\n    const computedStyle = computed(() => {\r\n      return {\r\n        zIndex: (props.zIndex ?? '2000').toString(),\r\n      };\r\n    });\r\n\r\n    const computedClass = computed<Record<string, boolean>>(() => {\r\n      const { classes } = props;\r\n      const boundClasses = bindClasses(classes);\r\n      return {\r\n        ...boundClasses,\r\n        'y-layer--active': !!active.value,\r\n      };\r\n    });\r\n\r\n    const computedContentClasses = computed<Record<string, boolean>>(() => {\r\n      const boundClasses = bindClasses(props.contentClasses);\r\n      return {\r\n        ...boundClasses,\r\n      };\r\n    });\r\n\r\n    expose({\r\n      scrim$,\r\n      base$,\r\n      content$: computed(() => content$.value),\r\n      baseEl,\r\n      active,\r\n      onAfterUpdate,\r\n      updateCoordinate,\r\n      hovered,\r\n      finish,\r\n      modal: computed(() => props.modal),\r\n      getActiveLayers,\r\n      isMe: (vnode: ComponentInternalInstance) => {\r\n        return vnode === vm;\r\n      },\r\n    });\r\n\r\n    useRender(() => {\r\n      const slotBase = slots.base?.({\r\n        active: active.value,\r\n        props: mergeProps({\r\n          ref: base$,\r\n          class: {\r\n            'y-layer-base': true,\r\n            'y-layer-base--active': active.value,\r\n          },\r\n        }),\r\n      });\r\n      baseSlot.value = slotBase;\r\n      return (\r\n        <>\r\n          {slotBase}\r\n          <Teleport disabled={!layerGroup.value} to={layerGroup.value as any}>\r\n            {rendered.value && (\r\n              <div\r\n                class={[\r\n                  {\r\n                    'y-layer': true,\r\n                    'y-layer--finish': finish.value,\r\n                    'y-layer--contained': props.contained,\r\n                    ...computedClass.value,\r\n                  },\r\n                  themeClasses.value,\r\n                ]}\r\n                onMouseenter={onMouseenter}\r\n                onMouseleave={onMouseleave}\r\n                style={computedStyle.value}\r\n                ref={root$}\r\n                {...attrs}\r\n              >\r\n                <Transition name=\"fade\" appear>\r\n                  {active.value && props.scrim && (\r\n                    <div\r\n                      class=\"y-layer__scrim\"\r\n                      style={{ '--y-layer-scrim-opacity': props.scrimOpacity }}\r\n                      onClick={onClickScrim}\r\n                      ref=\"scrim$\"\r\n                    ></div>\r\n                  )}\r\n                </Transition>\r\n                <PolyTransition\r\n                  onAfterEnter={onAfterEnter}\r\n                  onAfterLeave={onAfterLeave}\r\n                  appear\r\n                  {...polyTransitionBindProps.value}\r\n                >\r\n                  <div\r\n                    v-show={active.value}\r\n                    v-complement-click={{ ...complementClickOption }}\r\n                    class={{\r\n                      'y-layer__content': true,\r\n                      ...computedContentClasses.value,\r\n                    }}\r\n                    style={[\r\n                      {\r\n                        ...dimensionStyles.value,\r\n                        ...coordinateStyles.value,\r\n                        ...props.contentStyles,\r\n                      },\r\n                    ]}\r\n                    {...contentEvents.value}\r\n                    ref={content$}\r\n                  >\r\n                    {slots.default?.({ active: active.value })}\r\n                  </div>\r\n                </PolyTransition>\r\n              </div>\r\n            )}\r\n          </Teleport>\r\n        </>\r\n      );\r\n    });\r\n\r\n    return {\r\n      complementClickOption,\r\n      layerGroup,\r\n      active,\r\n      finish,\r\n      rendered,\r\n      lazyValue,\r\n      onAfterUpdate: onAfterUpdate as () => void,\r\n      scrim$,\r\n      content$,\r\n      base$,\r\n      baseEl,\r\n      baseFromSlotEl,\r\n      polyTransitionBindProps,\r\n      coordinateStyles,\r\n      layerGroupState,\r\n      getActiveLayers,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YLayer = InstanceType<typeof YLayer>;\r\n"],"mappings":"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"}
+{"version":3,"file":"YLayer.mjs","names":["Teleport","Transition","computed","getCurrentInstance","mergeProps","reactive","ref","shallowRef","toRef","useModelDuplex","useRender","pressCoordinateProps","useCoordinate","pressDimensionPropsOptions","useDimension","useLayerGroup","pressThemePropsOptions","useLocalTheme","useLazy","PolyTransition","pressPolyTransitionPropsOptions","usePolyTransition","ComplementClick","bindClasses","defineComponent","propsFactory","pressBasePropsOptions","useBase","pressContentPropsOptions","useContent","pressScrollStrategyProps","useScrollStrategies","pressYLayerProps","modelValue","type","Boolean","scrim","scrimOpacity","Number","eager","classes","Array","String","Object","contentClasses","closeClickScrim","contentStyles","default","disabled","openOnHover","openDelay","closeDelay","zIndex","contained","layerGroup","YLayer","name","inheritAttrs","components","directives","props","modal","emits","value","mouseEvent","afterLeave","slots","setup","_ref","emit","expose","attrs","vm","scrim$","content$","root$","model","active","get","set","v","base","base$","baseEl","baseSlot","baseFromSlotEl","contentEvents","themeClasses","layerGroupState","getActiveLayers","polyTransitionBindProps","dimensionStyles","lazyValue","onAfterUpdate","finish","hovered","focused","rendered","coordinateStyles","updateCoordinate","contentEl","root","onClickComplementLayer","target","closeConditional","complementClickOption","handler","determine","include","onAfterEnter","onAfterLeave","onClickScrim","onMouseenter","event","onMouseleave","computedStyle","toString","computedClass","boundClasses","computedContentClasses","isMe","vnode","slotBase","class","baseProps","_createVNode","_Fragment","_mergeProps","_withDirectives","_vShow","_resolveDirective"],"sources":["../../../src/components/layer/YLayer.tsx"],"sourcesContent":["import type {\n  CSSProperties,\n  ComponentInternalInstance,\n  PropType,\n  SlotsType,\n} from 'vue';\nimport {\n  Teleport,\n  Transition,\n  computed,\n  getCurrentInstance,\n  mergeProps,\n  reactive,\n  ref,\n  shallowRef,\n  toRef,\n} from 'vue';\n\nimport { useModelDuplex } from '@/composables/communication';\nimport { useRender } from '@/composables/component';\nimport { pressCoordinateProps, useCoordinate } from '@/composables/coordinate';\nimport {\n  pressDimensionPropsOptions,\n  useDimension,\n} from '@/composables/dimension';\nimport { useLayerGroup } from '@/composables/layer-group';\nimport { pressThemePropsOptions, useLocalTheme } from '@/composables/theme';\nimport { useLazy } from '@/composables/timing';\nimport {\n  PolyTransition,\n  pressPolyTransitionPropsOptions,\n  usePolyTransition,\n} from '@/composables/transition';\nimport {\n  ComplementClick,\n  ComplementClickBindingOptions,\n} from '@/directives/complement-click';\nimport { bindClasses, defineComponent, propsFactory } from '@/util/component';\n\nimport { pressBasePropsOptions, useBase } from './base';\nimport { pressContentPropsOptions, useContent } from './content';\nimport {\n  pressScrollStrategyProps,\n  useScrollStrategies,\n} from './scroll-strategies';\n\nimport './YLayer.scss';\n\nexport const pressYLayerProps = propsFactory(\n  {\n    modelValue: {\n      type: Boolean as PropType<boolean>,\n    },\n    scrim: {\n      type: Boolean as PropType<boolean>,\n    },\n    scrimOpacity: {\n      type: Number as PropType<number>,\n    },\n    eager: {\n      type: Boolean as PropType<boolean>,\n    },\n    classes: {\n      type: [Array, String, Object] as PropType<\n        string[] | string | Record<string, any>\n      >,\n    },\n    contentClasses: {\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    contentStyles: {\n      type: Object as PropType<CSSProperties>,\n      default: () => {},\n    },\n    disabled: {\n      type: Boolean as PropType<boolean>,\n      default: false,\n    },\n    openOnHover: {\n      type: Boolean as PropType<boolean>,\n      default: false,\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    zIndex: {\n      type: [Number, String] as PropType<number | string>,\n      default: 2000,\n    },\n    contained: Boolean,\n    layerGroup: [String, Object] as PropType<string | Element>,\n    ...pressThemePropsOptions(),\n    ...pressPolyTransitionPropsOptions(),\n    ...pressBasePropsOptions(),\n    ...pressContentPropsOptions(),\n    ...pressCoordinateProps(),\n    ...pressScrollStrategyProps(),\n    ...pressDimensionPropsOptions(),\n  },\n  'YLayer',\n);\n\nexport const YLayer = defineComponent({\n  name: 'YLayer',\n  inheritAttrs: false,\n  components: {\n    PolyTransition,\n  },\n  directives: {\n    ComplementClick,\n  },\n  props: {\n    modal: Boolean as PropType<boolean>,\n    ...pressYLayerProps(),\n  },\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n    'click:complement': (mouseEvent: MouseEvent) => true,\n    afterLeave: () => true,\n  },\n  slots: Object as SlotsType<{\n    base: any;\n    default: any;\n  }>,\n  setup(props, { emit, expose, attrs, slots }) {\n    const vm = getCurrentInstance();\n    const scrim$ = ref<HTMLElement>();\n    const content$ = ref<HTMLElement>();\n    const root$ = ref<HTMLElement>();\n    const model = useModelDuplex(props);\n    const active = computed({\n      get: (): boolean => {\n        return !!model.value;\n      },\n      set: (v: boolean) => {\n        if (!(v && props.disabled)) model.value = v;\n      },\n    });\n    // Frags\n    const { base, base$, baseEl, baseSlot, baseFromSlotEl } = useBase(props);\n    const { contentEvents } = useContent(props, active);\n    const { themeClasses } = useLocalTheme(props);\n    const { layerGroup, layerGroupState, getActiveLayers } = useLayerGroup(props);\n    const { polyTransitionBindProps } = usePolyTransition(props);\n    const { dimensionStyles } = useDimension(props);\n\n    const { lazyValue, onAfterUpdate } = useLazy(toRef(props, 'eager'), active);\n    // States\n    const finish = shallowRef(false);\n    const hovered = ref(false);\n    const focused = ref(false);\n    const disabled = toRef(props, 'disabled');\n\n\n    const rendered = computed<boolean>(\n      () => !disabled.value && (lazyValue.value || active.value),\n    );\n\n    const { coordinateStyles, updateCoordinate } = useCoordinate(props, {\n      contentEl: content$,\n      base,\n      active,\n    });\n    useScrollStrategies(props, {\n      root: root$,\n      contentEl: content$,\n      active,\n      baseEl: base,\n      updateCoordinate,\n    });\n\n    function onClickComplementLayer(mouseEvent: MouseEvent) {\n      emit('click:complement', mouseEvent);\n      if (!props.modal) {\n        if (\n          scrim$.value !== null &&\n          scrim$.value === mouseEvent.target &&\n          props.closeClickScrim\n        ) {\n          active.value = false;\n        }\n      } else {\n        // TODO: shrug ani\n      }\n    }\n\n    function closeConditional(): boolean {\n      return (\n        (!props.openOnHover || (props.openOnHover && !hovered.value)) &&\n        active.value &&\n        finish.value\n      ); // TODO: && groupTopLevel.value;\n    }\n\n    const complementClickOption = reactive<ComplementClickBindingOptions>({\n      handler: onClickComplementLayer,\n      determine: closeConditional,\n      include: () => [baseEl.value],\n    });\n\n    function onAfterEnter() {\n      finish.value = true;\n    }\n\n    function onAfterLeave() {\n      onAfterUpdate();\n      finish.value = false;\n      emit('afterLeave');\n    }\n\n    function onClickScrim() {\n      if (props.closeClickScrim) {\n        active.value = false;\n      }\n    }\n\n    function onMouseenter(event: Event) {\n      hovered.value = true;\n    }\n\n    function onMouseleave(event: Event) {\n      hovered.value = false;\n    }\n\n    const computedStyle = computed(() => {\n      return {\n        zIndex: (props.zIndex ?? '2000').toString(),\n      };\n    });\n\n    const computedClass = computed<Record<string, boolean>>(() => {\n      const { classes } = props;\n      const boundClasses = bindClasses(classes);\n      return {\n        ...boundClasses,\n        'y-layer--active': !!active.value,\n      };\n    });\n\n    const computedContentClasses = computed<Record<string, boolean>>(() => {\n      const boundClasses = bindClasses(props.contentClasses);\n      return {\n        ...boundClasses,\n      };\n    });\n\n    expose({\n      scrim$,\n      base$,\n      content$: computed(() => content$.value),\n      baseEl,\n      active,\n      onAfterUpdate,\n      updateCoordinate,\n      hovered,\n      finish,\n      modal: computed(() => props.modal),\n      getActiveLayers,\n      isMe: (vnode: ComponentInternalInstance) => {\n        return vnode === vm;\n      },\n    });\n\n    useRender(() => {\n      const slotBase = slots.base?.({\n        active: active.value,\n        props: mergeProps({\n          ref: base$,\n          class: {\n            'y-layer-base': true,\n            'y-layer-base--active': active.value,\n          },\n          ...(props.baseProps ?? {}),\n        }),\n      });\n      baseSlot.value = slotBase;\n      return (\n        <>\n          {slotBase}\n          <Teleport disabled={!layerGroup.value} to={layerGroup.value as any}>\n            {rendered.value && (\n              <div\n                class={[\n                  {\n                    'y-layer': true,\n                    'y-layer--finish': finish.value,\n                    'y-layer--contained': props.contained,\n                    ...computedClass.value,\n                  },\n                  themeClasses.value,\n                ]}\n                onMouseenter={onMouseenter}\n                onMouseleave={onMouseleave}\n                style={computedStyle.value}\n                ref={root$}\n                {...attrs}\n              >\n                <Transition name=\"fade\" appear>\n                  {active.value && props.scrim && (\n                    <div\n                      class=\"y-layer__scrim\"\n                      style={{ '--y-layer-scrim-opacity': props.scrimOpacity }}\n                      onClick={onClickScrim}\n                      ref=\"scrim$\"\n                    ></div>\n                  )}\n                </Transition>\n                <PolyTransition\n                  onAfterEnter={onAfterEnter}\n                  onAfterLeave={onAfterLeave}\n                  appear\n                  {...polyTransitionBindProps.value}\n                >\n                  <div\n                    v-show={active.value}\n                    v-complement-click={{ ...complementClickOption }}\n                    class={{\n                      'y-layer__content': true,\n                      ...computedContentClasses.value,\n                    }}\n                    style={[\n                      {\n                        ...dimensionStyles.value,\n                        ...coordinateStyles.value,\n                        ...props.contentStyles,\n                      },\n                    ]}\n                    {...contentEvents.value}\n                    ref={content$}\n                  >\n                    {slots.default?.({ active: active.value })}\n                  </div>\n                </PolyTransition>\n              </div>\n            )}\n          </Teleport>\n        </>\n      );\n    });\n\n    return {\n      complementClickOption,\n      layerGroup,\n      active,\n      finish,\n      rendered,\n      lazyValue,\n      onAfterUpdate: onAfterUpdate as () => void,\n      scrim$,\n      content$,\n      base$,\n      baseEl,\n      baseFromSlotEl,\n      polyTransitionBindProps,\n      coordinateStyles,\n      layerGroupState,\n      getActiveLayers,\n    };\n  },\n});\n\nexport type YLayer = InstanceType<typeof YLayer>;\n"],"mappings":"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"}

package/lib/components/layer/base.mjs

@@ -1,7 +1,8 @@
 import { computed, getCurrentInstance, ref, watchEffect } from 'vue';
 import { propsFactory } from "../../util/component/index.mjs";
 export const pressBasePropsOptions = propsFactory({
-  base: [String, Object, Array]
+  base: [String, Object, Array],
+  baseProps: Object
 }, 'YLayer.base');
 export function useBase(props) {
   const vm = getCurrentInstance();

package/lib/components/layer/base.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"base.mjs","names":["computed","getCurrentInstance","ref","watchEffect","propsFactory","pressBasePropsOptions","base","String","Object","Array","useBase","props","vm","base$","baseSlot","baseEl","baseFromSlotEl","el","value","nodeType","Node","ELEMENT_NODE","undefined","getBase","isArray","toEl","$el","flush","selector","ret","proxy","parentNode","parentEl","hasAttribute","document","querySelector"],"sources":["../../../src/components/layer/base.ts"],"sourcesContent":["import {\r\n  type ComponentInternalInstance,\r\n  type ComponentPublicInstance,\r\n  type PropType,\r\n  computed,\r\n  getCurrentInstance,\r\n  ref,\r\n  watchEffect,\r\n} from 'vue';\r\n\r\nimport { propsFactory } from '@/util/component';\r\n\r\nexport type BaseType =\r\n  | string\r\n  | Element\r\n  | ComponentPublicInstance\r\n  | [x: number, y: number]\r\n  | undefined;\r\n\r\nexport const pressBasePropsOptions = propsFactory(\r\n  {\r\n    base: [String, Object, Array] as PropType<BaseType>,\r\n  },\r\n  'YLayer.base',\r\n);\r\n\r\ninterface BaseProps {\r\n  base: BaseType;\r\n}\r\n\r\nexport function useBase(props: BaseProps) {\r\n  const vm = getCurrentInstance()!;\r\n\r\n  const base$ = ref();\r\n  const baseSlot = ref();\r\n  const baseEl = ref<HTMLElement>();\r\n\r\n  const baseFromSlotEl = computed(() => {\r\n    const el = baseSlot.value?.[0]?.el;\r\n    if (el && el.nodeType === Node.ELEMENT_NODE) {\r\n      return el;\r\n    }\r\n    return undefined;\r\n  });\r\n\r\n  const base = computed(() => {\r\n    if (baseEl.value && !props.base) {\r\n      return baseEl.value;\r\n    }\r\n    return getBase(props.base, vm);\r\n  });\r\n\r\n  watchEffect(\r\n    () => {\r\n      if (!base$.value) {\r\n        if (!baseFromSlotEl.value && props.base && !Array.isArray(props.base)) {\r\n          baseEl.value = base.value;\r\n          return;\r\n        }\r\n        baseEl.value = baseFromSlotEl.value;\r\n        return;\r\n      }\r\n      let toEl = base$.value;\r\n      if (toEl.baseEl) {\r\n        toEl = toEl.baseEl;\r\n      }\r\n      if (base$.value?.$el) {\r\n        if (base$.value.$el.nodeType === Node.ELEMENT_NODE) {\r\n          toEl = base$.value.$el;\r\n        }\r\n      }\r\n      if (toEl?.nodeType !== Node.ELEMENT_NODE) {\r\n        toEl = baseFromSlotEl.value;\r\n      }\r\n      baseEl.value = toEl;\r\n    },\r\n    { flush: 'post' },\r\n  );\r\n\r\n  return {\r\n    base$,\r\n    baseEl,\r\n    baseSlot,\r\n    base,\r\n    baseFromSlotEl,\r\n  };\r\n}\r\n\r\nfunction getBase(selector: BaseType, vm: ComponentInternalInstance) {\r\n  if (!selector) return;\r\n\r\n  let ret;\r\n\r\n  if (selector === 'parent') {\r\n    let el = vm?.proxy?.$el?.parentNode;\r\n    let parentEl = el;\r\n    while (el) {\r\n      if (el?.hasAttribute('data-base-parent')) {\r\n        parentEl = el;\r\n        break;\r\n      }\r\n      el = el.parentNode;\r\n    }\r\n    ret = parentEl;\r\n  }\r\n  // Selector\r\n  else if (typeof selector === 'string') {\r\n    ret = document.querySelector(selector);\r\n  }\r\n  // Component\r\n  else if ('$el' in selector) {\r\n    ret = selector.$el;\r\n  }\r\n  // HTMLElement | Element | [x, y]\r\n  else {\r\n    ret = selector;\r\n  }\r\n\r\n  return ret;\r\n}\r\n"],"mappings":"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"}
+{"version":3,"file":"base.mjs","names":["computed","getCurrentInstance","ref","watchEffect","propsFactory","pressBasePropsOptions","base","String","Object","Array","baseProps","useBase","props","vm","base$","baseSlot","baseEl","baseFromSlotEl","el","value","nodeType","Node","ELEMENT_NODE","undefined","getBase","isArray","toEl","$el","flush","selector","ret","proxy","parentNode","parentEl","hasAttribute","document","querySelector"],"sources":["../../../src/components/layer/base.ts"],"sourcesContent":["import {\r\n  type ComponentInternalInstance,\r\n  type ComponentPublicInstance,\r\n  type PropType,\r\n  computed,\r\n  getCurrentInstance,\r\n  ref,\r\n  watchEffect,\r\n} from 'vue';\r\n\r\nimport { propsFactory } from '@/util/component';\r\n\r\nexport type BaseType =\r\n  | string\r\n  | Element\r\n  | ComponentPublicInstance\r\n  | [x: number, y: number]\r\n  | undefined;\r\n\r\nexport const pressBasePropsOptions = propsFactory(\r\n  {\r\n    base: [String, Object, Array] as PropType<BaseType>,\r\n    baseProps: Object as PropType<Record<string, any>>,\r\n  },\r\n  'YLayer.base',\r\n);\r\n\r\ninterface BaseProps {\r\n  base: BaseType;\r\n  baseProps: Record<string, any> | undefined;\r\n}\r\n\r\nexport function useBase(props: BaseProps) {\r\n  const vm = getCurrentInstance()!;\r\n\r\n  const base$ = ref();\r\n  const baseSlot = ref();\r\n  const baseEl = ref<HTMLElement>();\r\n\r\n  const baseFromSlotEl = computed(() => {\r\n    const el = baseSlot.value?.[0]?.el;\r\n    if (el && el.nodeType === Node.ELEMENT_NODE) {\r\n      return el;\r\n    }\r\n    return undefined;\r\n  });\r\n\r\n  const base = computed(() => {\r\n    if (baseEl.value && !props.base) {\r\n      return baseEl.value;\r\n    }\r\n    return getBase(props.base, vm);\r\n  });\r\n\r\n  watchEffect(\r\n    () => {\r\n      if (!base$.value) {\r\n        if (!baseFromSlotEl.value && props.base && !Array.isArray(props.base)) {\r\n          baseEl.value = base.value;\r\n          return;\r\n        }\r\n        baseEl.value = baseFromSlotEl.value;\r\n        return;\r\n      }\r\n      let toEl = base$.value;\r\n      if (toEl.baseEl) {\r\n        toEl = toEl.baseEl;\r\n      }\r\n      if (base$.value?.$el) {\r\n        if (base$.value.$el.nodeType === Node.ELEMENT_NODE) {\r\n          toEl = base$.value.$el;\r\n        }\r\n      }\r\n      if (toEl?.nodeType !== Node.ELEMENT_NODE) {\r\n        toEl = baseFromSlotEl.value;\r\n      }\r\n      baseEl.value = toEl;\r\n    },\r\n    { flush: 'post' },\r\n  );\r\n\r\n  return {\r\n    base$,\r\n    baseEl,\r\n    baseSlot,\r\n    base,\r\n    baseFromSlotEl,\r\n  };\r\n}\r\n\r\nfunction getBase(selector: BaseType, vm: ComponentInternalInstance) {\r\n  if (!selector) return;\r\n\r\n  let ret;\r\n\r\n  if (selector === 'parent') {\r\n    let el = vm?.proxy?.$el?.parentNode;\r\n    let parentEl = el;\r\n    while (el) {\r\n      if (el?.hasAttribute('data-base-parent')) {\r\n        parentEl = el;\r\n        break;\r\n      }\r\n      el = el.parentNode;\r\n    }\r\n    ret = parentEl;\r\n  }\r\n  // Selector\r\n  else if (typeof selector === 'string') {\r\n    ret = document.querySelector(selector);\r\n  }\r\n  // Component\r\n  else if ('$el' in selector) {\r\n    ret = selector.$el;\r\n  }\r\n  // HTMLElement | Element | [x, y]\r\n  else {\r\n    ret = selector;\r\n  }\r\n\r\n  return ret;\r\n}\r\n"],"mappings":"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"}

package/lib/components/select/YSelect.mjs

@@ -1,4 +1,4 @@
-import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
+import { mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fragment } from "vue";
 import { computed, mergeProps, nextTick, onMounted, ref, shallowRef, vShow, watch, withDirectives } from 'vue';
 import { useModelDuplex } from "../../composables/communication.mjs";
 import { useRender } from "../../composables/component.mjs";
@@ -17,6 +17,7 @@ import { YMenu } from "../menu/index.mjs";
 import "./YSelect.scss";
 export const pressSelectPropsOptions = propsFactory({
   opened: Boolean,
+  closeOnBlur: Boolean,
   multiple: Boolean,
   itemComparator: {
     type: Function,
@@ -61,7 +62,7 @@ export const YSelect = defineComponent({
     'update:modelValue': value => true,
     'update:opened': opened => true,
     'click:item': (item, e) => true,
-    'change': value => true
+    change: value => true
   },
   slots: Object,
   setup(props, _ref) {
@@ -85,10 +86,11 @@ export const YSelect = defineComponent({
     const {
       t
     } = useI18n();
-    const model = useModelDuplex(props, 'modelValue', [], v => toRefineItems(v === null ? [null] : wrapInArray(v)), v => {
+    const setOut = v => {
       const emitValue = toEmitItems(wrapInArray(v));
       return props.multiple ? emitValue : emitValue[0] ?? null;
-    });
+    };
+    const model = useModelDuplex(props, 'modelValue', [], v => toRefineItems(v === null ? [null] : wrapInArray(v)), setOut);
     const selections = computed(() => {
       const ret = [];
       for (const v of model.value) {
@@ -118,15 +120,26 @@ export const YSelect = defineComponent({
 
     // Field
     function onMousedownDisplay(event) {
-      if (props.disabled) {
-        return;
-      }
+      if (props.disabled) return;
       opened.value = !opened.value;
     }
+    function onKeydownDisplay(event) {
+      console.log(event);
+      if (props.disabled) return;
+      if (event.key === 'Enter' || event.key === ' ') {
+        opened.value = !opened.value;
+      }
+    }
     function onBlur(event) {
-      // if (listRef.value?.$el.contains(event.relatedTarget)) {
-      //   opened.value = false;
-      // }
+      requestAnimationFrame(() => {
+        const contentEl = menuRef.value?.layer$?.content$;
+        if (contentEl?.contains(document.activeElement)) {
+          return;
+        }
+        if (opened.value && props.closeOnBlur) {
+          opened.value = false;
+        }
+      });
     }
 
     // Menu Contents
@@ -141,7 +154,7 @@ export const YSelect = defineComponent({
     }
     function onAfterLeave() {
       if (!focused.value) {
-        fieldInputRef.value?.focus();
+        // fieldInputRef.value?.focus();
       }
     }
     function closeCondition(event) {
@@ -150,21 +163,23 @@ export const YSelect = defineComponent({
       }
     }
     function select(item) {
+      let value;
       if (props.multiple) {
         const index = selections.value.findIndex(selectedItem => {
           return selectedItem.value === item.value;
         });
         if (index === -1) {
-          model.value = [...model.value, item];
+          value = [...model.value, item];
         } else {
           const neo = model.value.slice();
           neo.splice(index, 1);
-          model.value = neo;
+          value = neo;
         }
       } else {
-        model.value = [item];
+        value = [item];
       }
-      emit('change', model.value);
+      model.value = value;
+      emit('change', setOut(value));
     }
     const displayText = computed(() => {
       if (props.multiple) {
@@ -204,114 +219,105 @@ export const YSelect = defineComponent({
     useRender(() => {
       const fieldInputProps = chooseProps(props, YFieldInput.props);
       const dropdownIconProps = chooseProps(typeof props.dropdownIcon === 'object' ? props.dropdownIcon : {}, YIcon.props);
-      return _createVNode(YMenu, _mergeProps({
-        "ref": menuRef,
-        "offset": props.offset,
-        "position": props.position,
-        "align": props.align,
-        "origin": props.origin,
-        "content-classes": ['y-select__content'],
-        "maxHeight": props.maxHeight,
-        "open-on-click-base": false,
-        "onAfterLeave": onAfterLeave,
-        "open-delay": props.openDelay,
-        "close-delay": props.closeDelay,
-        "closeCondition": closeCondition
-      }, extraMenuProps.value, {
-        "modelValue": opened.value,
-        "onUpdate:modelValue": $event => opened.value = $event
+      return _createVNode(YFieldInput, _mergeProps({
+        "ref": fieldInputRef
+      }, fieldInputProps, {
+        "modelValue": model.value.map(v => v.props.value).join(', '),
+        "validationValue": model.rxValue,
+        "onMousedown:display": onMousedownDisplay,
+        "onKeydown:display": onKeydownDisplay,
+        "onBlur": onBlur,
+        "readonly": true,
+        "class": ['y-select', {
+          'y-select--opened': opened.value,
+          'y-select--selected': selected.value.length > 0
+        }]
+      }, attrs, {
+        "focused": focused.value
       }), {
-        base: function () {
+        default: () => {
+          const selectionProps = {
+            items: selections.value.map(item => item.raw),
+            displayText: displayText.value,
+            placeholder: props.placeholder,
+            internalItems: selections.value
+          };
+          return _createVNode(_Fragment, null, [_createVNode("div", {
+            "class": ['y-select__selection']
+          }, [slots.selection ? slots.selection?.(selectionProps) : selected.value.length > 0 ? displayText.value : props.placeholder]), _createVNode(YMenu, _mergeProps({
+            "ref": menuRef,
+            "offset": props.offset,
+            "position": props.position,
+            "align": props.align,
+            "origin": props.origin,
+            "content-classes": ['y-select__content'],
+            "maxHeight": props.maxHeight,
+            "open-on-click-base": false,
+            "onAfterLeave": onAfterLeave,
+            "open-delay": props.openDelay,
+            "close-delay": props.closeDelay,
+            "closeCondition": closeCondition,
+            "base": "parent"
+          }, extraMenuProps.value, {
+            "modelValue": opened.value,
+            "onUpdate:modelValue": $event => opened.value = $event
+          }), {
+            default: slots.menu ? () => slots.menu() : () => _createVNode(YCard, {
+              "ref": cardRef
+            }, {
+              default: () => [slots['menu-prepend']?.(), items.value.length > 0 ? _createVNode(YList, {
+                "ref": listRef
+              }, {
+                default: () => [items.value.map(item => {
+                  const itemProps = {
+                    item,
+                    selected: isSelected(item),
+                    select: () => {
+                      select(item);
+                    }
+                  };
+                  return withDirectives(_createVNode(YListItem, {
+                    "onClick": e => onClickItem(item, e),
+                    "class": [{
+                      'y-list-item--active': isSelected(item)
+                    }],
+                    "disabled": item.disabled
+                  }, {
+                    default: () => slots.item ? slots.item?.(itemProps) : item.text,
+                    leading: slots['item-leading'] && (() => slots['item-leading']?.(itemProps)),
+                    trailing: slots['item-trailing'] && (() => slots['item-trailing']?.(itemProps))
+                  }), [[vShow, !item.hide]]);
+                })]
+              }) : _createVNode("div", {
+                "class": "y-select__no-options"
+              }, [t('$yuyeon.noItems')]), slots['menu-append']?.()]
+            })
+          })]);
+        },
+        leading: slots.leading ? function () {
           for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
             args[_key] = arguments[_key];
           }
-          return slots.base ? slots.base?.(...args) : _createVNode(YFieldInput, _mergeProps({
-            ...fieldInputProps,
-            ...mergeProps({
-              ...args[0].props
-            }, {
-              ref: fieldInputRef
-            })
-          }, {
-            "modelValue": model.value.map(v => v.props.value).join(', '),
-            "validationValue": model.rxValue,
-            "onMousedown:display": onMousedownDisplay,
-            "onBlur": onBlur,
-            "readonly": true,
-            "class": ['y-select', {
-              'y-select--opened': opened.value,
-              'y-select--selected': selected.value.length > 0
-            }]
-          }, attrs, {
-            "focused": focused.value
-          }), {
-            default: () => {
-              const selectionProps = {
-                items: selections.value.map(item => item.raw),
-                displayText: displayText.value,
-                placeholder: props.placeholder,
-                internalItems: selections.value
-              };
-              return _createVNode("div", {
-                "class": ['y-select__selection']
-              }, [slots.selection ? slots.selection?.(selectionProps) : selected.value.length > 0 ? displayText.value : props.placeholder]);
-            },
-            leading: slots.leading ? function () {
-              for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-                args[_key2] = arguments[_key2];
-              }
-              return slots.leading?.(...args);
-            } : undefined,
-            trailing: function () {
-              return slots['dropdown-icon'] ? slots['dropdown-icon']() : _createVNode(YIcon, _mergeProps(mergeProps(dropdownIconProps), {
-                "icon": props.dropdownIcon,
-                "class": ['y-select__icon']
-              }), null);
-            },
-            label: slots.label ? function () {
-              for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-                args[_key3] = arguments[_key3];
-              }
-              return slots.label?.(...args);
-            } : undefined,
-            'helper-text': slots['helper-text'] ? function () {
-              for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
-                args[_key4] = arguments[_key4];
-              }
-              return slots['helper-text']?.(...args);
-            } : undefined
-          });
+          return slots.leading?.(...args);
+        } : undefined,
+        trailing: function () {
+          return slots['dropdown-icon'] ? slots['dropdown-icon']() : _createVNode(YIcon, _mergeProps(mergeProps(dropdownIconProps), {
+            "icon": props.dropdownIcon,
+            "class": ['y-select__icon']
+          }), null);
         },
-        default: slots.menu ? () => slots.menu() : () => _createVNode(YCard, {
-          "ref": cardRef
-        }, {
-          default: () => [slots['menu-prepend']?.(), items.value.length > 0 ? _createVNode(YList, {
-            "ref": listRef
-          }, {
-            default: () => [items.value.map(item => {
-              const itemProps = {
-                item,
-                selected: isSelected(item),
-                select: () => {
-                  select(item);
-                }
-              };
-              return withDirectives(_createVNode(YListItem, {
-                "onClick": e => onClickItem(item, e),
-                "class": [{
-                  'y-list-item--active': isSelected(item)
-                }],
-                "disabled": item.disabled
-              }, {
-                default: () => slots.item ? slots.item?.(itemProps) : item.text,
-                leading: slots['item-leading'] && (() => slots['item-leading']?.(itemProps)),
-                trailing: slots['item-trailing'] && (() => slots['item-trailing']?.(itemProps))
-              }), [[vShow, !item.hide]]);
-            })]
-          }) : _createVNode("div", {
-            "class": "y-select__no-options"
-          }, [t('$yuyeon.noItems')]), slots['menu-append']?.()]
-        })
+        label: slots.label ? function () {
+          for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+            args[_key2] = arguments[_key2];
+          }
+          return slots.label?.(...args);
+        } : undefined,
+        'helper-text': slots['helper-text'] ? function () {
+          for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+            args[_key3] = arguments[_key3];
+          }
+          return slots['helper-text']?.(...args);
+        } : undefined
       });
     });
     onMounted(() => {