yuyeon 0.0.35 → 0.0.37

package/lib/components/menu/YMenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YMenu.mjs","names":["computed","defineComponent","ref","toRef","watch","useModelDuplex","useRender","polyTransitionPropOptions","toKebabCase","bindClasses","chooseProps","YLayer","pressYLayerProps","useDelay","useActiveStack","hasElementMouseEvent","NAME","CLASS_NAME","YMenuPropOptions","menuClasses","type","Array","String","Object","openOnClickBase","Boolean","default","closeCondition","Function","undefined","preventClip","coordinateStrategy","preventCloseBubble","YMenu","name","props","transition","emits","setup","_ref","slots","emit","expose","el$","classes","boundClasses","model","active","get","value","set","v","disabled","hovered","children","parent","startOpenDelay","startCloseDelay","changeActive","openOnHover","length","onMouseenter","e","onMouseleave","onClick","stopPropagation","currentActive","onComplementClick","parentContent","$el","content$","clear","bindHover","el","addEventListener","unbindHover","removeEventListener","baseEl","neo","old","computedContentClasses","contentClasses","_createVNode","_Fragment","_mergeProps","onAfterLeave","scrim","$event","_len","arguments","args","_key","base","_len2","_key2"],"sources":["../../../src/components/menu/YMenu.tsx"],"sourcesContent":["import type { PropType } from 'vue';\r\nimport {computed, defineComponent, ref, toRef, watch} from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { pressCoordinateProps } from '../../composables/coordinate';\r\nimport { polyTransitionPropOptions } from '../../composables/transition';\r\nimport { toKebabCase } from '../../util/string';\r\nimport { bindClasses, chooseProps } from '../../util/vue-component';\r\nimport { YLayer, pressYLayerProps } from '../layer';\r\nimport { useDelay } from '../layer/active-delay';\r\n\r\nimport './YMenu.scss';\r\nimport {useActiveStack} from \"../layer/active-stack\";\r\nimport {hasElementMouseEvent} from \"../../util/dom\";\r\n\r\nconst NAME = 'YMenu';\r\nconst CLASS_NAME = toKebabCase(NAME);\r\n\r\nexport const YMenuPropOptions = {\r\n  menuClasses: {\r\n    type: [Array, String, Object] as PropType<\r\n      string[] | string | Record<string, any>\r\n    >,\r\n  },\r\n  openOnClickBase: {\r\n    type: Boolean as PropType<boolean>,\r\n    default: true,\r\n  },\r\n  closeCondition: {\r\n    type: [Boolean, Function],\r\n    default: undefined,\r\n  },\r\n  preventClip: {\r\n    type: Boolean as PropType<boolean>,\r\n    default: true,\r\n  },\r\n  ...pressYLayerProps({\r\n    coordinateStrategy: 'levitation',\r\n  }),\r\n  preventCloseBubble: Boolean as PropType<boolean>,\r\n};\r\n\r\n/**\r\n * #  Component\r\n */\r\nexport const YMenu = defineComponent({\r\n  name: NAME,\r\n  props: {\r\n    ...YMenuPropOptions,\r\n    transition: {\r\n      ...polyTransitionPropOptions.transition,\r\n      default: 'fade',\r\n    },\r\n  },\r\n  emits: ['update:modelValue', 'afterLeave'],\r\n  setup(props, { slots, emit, expose }) {\r\n    const el$ = ref<typeof YLayer>();\r\n\r\n    const classes = computed(() => {\r\n      const boundClasses = bindClasses(props.menuClasses);\r\n      return {\r\n        ...boundClasses,\r\n        'y-menu': true,\r\n      };\r\n    });\r\n\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\r\n    const hovered = computed(() => !!el$.value?.hovered);\r\n    const { children, parent } = useActiveStack(el$, active, toRef(props, 'preventCloseBubble'));\r\n    const { startOpenDelay, startCloseDelay } = useDelay(\r\n      props,\r\n      (changeActive) => {\r\n        if (!changeActive && props.openOnHover && !hovered.value && children.value.length === 0) {\r\n          active.value = false;\r\n        } else if (changeActive) {\r\n          active.value = true;\r\n        }\r\n      },\r\n    );\r\n\r\n    function onMouseenter(e: MouseEvent) {\r\n      if (props.openOnHover) {\r\n        startOpenDelay();\r\n      }\r\n    }\r\n\r\n    function onMouseleave(e: MouseEvent) {\r\n      if (props.openOnHover) {\r\n        startCloseDelay();\r\n      }\r\n    }\r\n\r\n    watch(hovered, (value) => {\r\n      if (!value) {\r\n        startCloseDelay();\r\n      }\r\n    });\r\n\r\n    function onClick(e: MouseEvent) {\r\n      e.stopPropagation();\r\n      if (!props.openOnClickBase) {\r\n        return;\r\n      }\r\n      const currentActive = active.value;\r\n      if (!props.disabled) {\r\n        active.value = !currentActive;\r\n      }\r\n    }\r\n\r\n    function onComplementClick(e: Event) {\r\n      if (props.closeCondition === false) {\r\n        return;\r\n      }\r\n      if (typeof props.closeCondition === 'function') {\r\n        if (props.closeCondition(e) === false) {\r\n          active.value = false;\r\n        }\r\n        return;\r\n      }\r\n      if (active.value) {\r\n        const parentContent = parent?.$el.value?.content$;\r\n        active.value = false;\r\n        if (!(parentContent && !hasElementMouseEvent(e, parentContent))) {\r\n          parent?.clear();\r\n        }\r\n      }\r\n    }\r\n\r\n    function bindHover(el: HTMLElement) {\r\n      el.addEventListener('mouseenter', onMouseenter);\r\n      el.addEventListener('mouseleave', onMouseleave);\r\n    }\r\n\r\n    function unbindHover(el: HTMLElement) {\r\n      el.removeEventListener('mouseenter', onMouseenter);\r\n      el.removeEventListener('mouseleave', onMouseleave);\r\n    }\r\n\r\n    watch(\r\n      () => el$.value?.baseEl,\r\n      (neo, old) => {\r\n        if (neo) {\r\n          bindHover(neo);\r\n          neo.addEventListener('click', onClick);\r\n        } else if (old) {\r\n          unbindHover(old);\r\n          old.removeEventListener('click', onClick);\r\n        }\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    useRender(() => {\r\n      return (\r\n        <>\r\n          <YLayer\r\n            ref={el$}\r\n            transition={props.transition}\r\n            onClick:complement={onComplementClick}\r\n            onAfterLeave={() => emit('afterLeave')}\r\n            {...{\r\n              ...chooseProps(props, YLayer.props),\r\n              classes: classes.value,\r\n              scrim: false,\r\n              contentClasses: {\r\n                'y-menu__content': true,\r\n                ...computedContentClasses.value,\r\n              },\r\n            }}\r\n            v-model={active.value}\r\n          >\r\n            {{\r\n              default: (...args: any) => {\r\n                return <>{slots.default?.(...args) ?? ''}</>;\r\n              },\r\n              base: (...args: any[]) => slots.base?.(...args),\r\n            }}\r\n          </YLayer>\r\n        </>\r\n      );\r\n    });\r\n\r\n    return {\r\n      el$,\r\n      classes,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YMenu = InstanceType<typeof YMenu>;\r\n"],"mappings":"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"}
+{"version":3,"file":"YMenu.mjs","names":["computed","defineComponent","ref","toRef","watch","useModelDuplex","useRender","polyTransitionPropOptions","toKebabCase","bindClasses","chooseProps","YLayer","pressYLayerProps","useDelay","useActiveStack","hasElementMouseEvent","NAME","CLASS_NAME","YMenuPropOptions","menuClasses","type","Array","String","Object","openOnClickBase","Boolean","default","closeCondition","Function","undefined","preventClip","coordinateStrategy","preventCloseBubble","YMenu","name","props","transition","emits","setup","_ref","slots","emit","expose","layer$","classes","boundClasses","model","active","get","value","set","v","disabled","hovered","children","parent","startOpenDelay","startCloseDelay","changeActive","openOnHover","length","onMouseenter","e","onMouseleave","onClick","stopPropagation","currentActive","onComplementClick","parentContent","$el","content$","parentModal","modal","clear","bindHover","el","addEventListener","unbindHover","removeEventListener","baseEl","neo","old","computedContentClasses","contentClasses","_createVNode","_Fragment","_mergeProps","onAfterLeave","scrim","$event","_len","arguments","args","_key","base","_len2","_key2","el$"],"sources":["../../../src/components/menu/YMenu.tsx"],"sourcesContent":["import type { PropType } from 'vue';\r\nimport {computed, defineComponent, ref, toRef, watch} from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { pressCoordinateProps } from '../../composables/coordinate';\r\nimport { polyTransitionPropOptions } from '../../composables/transition';\r\nimport { toKebabCase } from '../../util/string';\r\nimport { bindClasses, chooseProps } from '../../util/vue-component';\r\nimport { YLayer, pressYLayerProps } from '../layer';\r\nimport { useDelay } from '../layer/active-delay';\r\n\r\nimport './YMenu.scss';\r\nimport {useActiveStack} from \"../layer/active-stack\";\r\nimport {hasElementMouseEvent} from \"../../util/dom\";\r\n\r\nconst NAME = 'YMenu';\r\nconst CLASS_NAME = toKebabCase(NAME);\r\n\r\nexport const YMenuPropOptions = {\r\n  menuClasses: {\r\n    type: [Array, String, Object] as PropType<\r\n      string[] | string | Record<string, any>\r\n    >,\r\n  },\r\n  openOnClickBase: {\r\n    type: Boolean as PropType<boolean>,\r\n    default: true,\r\n  },\r\n  closeCondition: {\r\n    type: [Boolean, Function],\r\n    default: undefined,\r\n  },\r\n  preventClip: {\r\n    type: Boolean as PropType<boolean>,\r\n    default: true,\r\n  },\r\n  ...pressYLayerProps({\r\n    coordinateStrategy: 'levitation',\r\n  }),\r\n  preventCloseBubble: Boolean as PropType<boolean>,\r\n};\r\n\r\n/**\r\n * #  Component\r\n */\r\nexport const YMenu = defineComponent({\r\n  name: NAME,\r\n  props: {\r\n    ...YMenuPropOptions,\r\n    transition: {\r\n      ...polyTransitionPropOptions.transition,\r\n      default: 'fade',\r\n    },\r\n  },\r\n  emits: ['update:modelValue', 'afterLeave'],\r\n  setup(props, { slots, emit, expose }) {\r\n    const layer$ = ref<typeof YLayer>();\r\n\r\n    const classes = computed(() => {\r\n      const boundClasses = bindClasses(props.menuClasses);\r\n      return {\r\n        ...boundClasses,\r\n        'y-menu': true,\r\n      };\r\n    });\r\n\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\r\n    const hovered = computed(() => !!layer$.value?.hovered);\r\n    const { children, parent } = useActiveStack(layer$, active, toRef(props, 'preventCloseBubble'));\r\n    const { startOpenDelay, startCloseDelay } = useDelay(\r\n      props,\r\n      (changeActive) => {\r\n        if (!changeActive && props.openOnHover && !hovered.value && children.value.length === 0) {\r\n          active.value = false;\r\n        } else if (changeActive) {\r\n          active.value = true;\r\n        }\r\n      },\r\n    );\r\n\r\n    function onMouseenter(e: MouseEvent) {\r\n      if (props.openOnHover) {\r\n        startOpenDelay();\r\n      }\r\n    }\r\n\r\n    function onMouseleave(e: MouseEvent) {\r\n      if (props.openOnHover) {\r\n        startCloseDelay();\r\n      }\r\n    }\r\n\r\n    watch(hovered, (value) => {\r\n      if (!value) {\r\n        startCloseDelay();\r\n      }\r\n    });\r\n\r\n    function onClick(e: MouseEvent) {\r\n      e.stopPropagation();\r\n      if (!props.openOnClickBase) {\r\n        return;\r\n      }\r\n      const currentActive = active.value;\r\n      if (!props.disabled) {\r\n        active.value = !currentActive;\r\n      }\r\n    }\r\n\r\n    function onComplementClick(e: Event) {\r\n      if (props.closeCondition === false) {\r\n        return;\r\n      }\r\n      if (typeof props.closeCondition === 'function') {\r\n        if (props.closeCondition(e) === false) {\r\n          active.value = false;\r\n        }\r\n        return;\r\n      }\r\n      if (active.value) {\r\n        const parentContent = parent?.$el.value?.content$;\r\n        const parentModal = parent?.$el.value?.modal;\r\n        active.value = false;\r\n        if (!(parentContent && !hasElementMouseEvent(e, parentContent)) && !parentModal) {\r\n          parent?.clear();\r\n        }\r\n      }\r\n    }\r\n\r\n    function bindHover(el: HTMLElement) {\r\n      el.addEventListener('mouseenter', onMouseenter);\r\n      el.addEventListener('mouseleave', onMouseleave);\r\n    }\r\n\r\n    function unbindHover(el: HTMLElement) {\r\n      el.removeEventListener('mouseenter', onMouseenter);\r\n      el.removeEventListener('mouseleave', onMouseleave);\r\n    }\r\n\r\n    watch(\r\n      () => layer$.value?.baseEl,\r\n      (neo, old) => {\r\n        if (neo) {\r\n          bindHover(neo);\r\n          neo.addEventListener('click', onClick);\r\n        } else if (old) {\r\n          unbindHover(old);\r\n          old.removeEventListener('click', onClick);\r\n        }\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    useRender(() => {\r\n      return (\r\n        <>\r\n          <YLayer\r\n            ref={layer$}\r\n            transition={props.transition}\r\n            onClick:complement={onComplementClick}\r\n            onAfterLeave={() => emit('afterLeave')}\r\n            {...{\r\n              ...chooseProps(props, YLayer.props),\r\n              classes: classes.value,\r\n              scrim: false,\r\n              contentClasses: {\r\n                'y-menu__content': true,\r\n                ...computedContentClasses.value,\r\n              },\r\n            }}\r\n            v-model={active.value}\r\n          >\r\n            {{\r\n              default: (...args: any) => {\r\n                return <>{slots.default?.(...args) ?? ''}</>;\r\n              },\r\n              base: (...args: any[]) => slots.base?.(...args),\r\n            }}\r\n          </YLayer>\r\n        </>\r\n      );\r\n    });\r\n\r\n    return {\r\n      el$: layer$,\r\n      classes,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YMenu = InstanceType<typeof YMenu>;\r\n"],"mappings":"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"}

package/lib/components/select/YSelect.mjs

@@ -74,7 +74,7 @@ export const YSelect = defineComponent({
     });
     const selections = computed(() => {
       return model.value.map(v => {
-        return items.value.filter(item => {
+        return items.value.find(item => {
           return props.valueEquals(item.value, v.value);
         });
       });

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

@@ -1 +1 @@
-{"version":3,"file":"YSelect.mjs","names":["shallowRef","computed","defineComponent","mergeProps","ref","useModelDuplex","useRender","pressCoordinateProps","pressListItemsPropsOptions","useItems","wrapInArray","deepEqual","getObjectValueByPath","omit","chooseProps","propsFactory","YCard","YFieldInput","pressYFieldInputPropsOptions","YIconDropdown","YList","YListItem","YMenu","returnItemEquals","optionsItem","valueItem","valueKey","arguments","length","undefined","valueItemType","itemValue","pressSelectPropsOptions","opened","Boolean","multiple","weakEquals","valueEquals","type","Function","default","defaultSelect","pressYSelectPropsOptions","maxHeight","Number","String","expandIcon","Object","position","YSelect","name","props","emits","value","setup","_ref","slots","fieldInputRef","menuRef","listRef","focused","items","toRefineItems","toEmitItems","model","v","emitValue","selections","map","filter","item","selected","selection","isSelected","find","selectedItem","onMousedownDisplay","event","disabled","onBlur","$el","contains","relatedTarget","onClickItem","select","onAfterLeave","focus","index","findIndex","neo","slice","splice","displayText","text","join","fieldInputProps","_createVNode","$event","offset","origin","base","_len","args","Array","_key","_mergeProps","leading","_len2","_key2","trailing","menu","e","_createTextVNode"],"sources":["../../../src/components/select/YSelect.tsx"],"sourcesContent":["import { shallowRef } from '@vue/runtime-core';\r\nimport type { PropType } from 'vue';\r\nimport { computed, defineComponent, mergeProps, ref } from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { pressCoordinateProps } from '../../composables/coordinate';\r\nimport {\r\n  ListItem,\r\n  pressListItemsPropsOptions,\r\n  useItems,\r\n} from '../../composables/list-items';\r\nimport { wrapInArray } from '../../util/array';\r\nimport {deepEqual, getObjectValueByPath, getPropertyFromItem, omit} from '../../util/common';\r\nimport { chooseProps, propsFactory } from '../../util/vue-component';\r\nimport { YCard } from '../card';\r\nimport { YFieldInput, pressYFieldInputPropsOptions } from '../field-input';\r\nimport { YIconDropdown } from '../icons/YIconDropdown';\r\nimport { YList, YListItem } from '../list';\r\nimport { YMenu } from '../menu';\r\n\r\nimport './YSelect.scss';\r\n\r\nexport type SelectEquals = (\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey?: string,\r\n) => boolean;\r\n\r\nexport function returnItemEquals(\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey = 'value',\r\n) {\r\n  const valueItemType = typeof valueItem;\r\n  const itemValue =\r\n    valueItemType === 'string' || valueItemType === 'number'\r\n      ? getObjectValueByPath(optionsItem, valueKey)\r\n      : optionsItem;\r\n  return deepEqual(itemValue, valueItem);\r\n}\r\n\r\nexport const pressSelectPropsOptions = propsFactory(\r\n  {\r\n    opened: Boolean as PropType<boolean>,\r\n    multiple: Boolean,\r\n    weakEquals: Boolean,\r\n    valueEquals: {\r\n      type: Function as PropType<SelectEquals>,\r\n      default: deepEqual,\r\n    },\r\n    defaultSelect: Boolean,\r\n    ...pressListItemsPropsOptions(),\r\n  },\r\n  'Select',\r\n);\r\n\r\nexport const pressYSelectPropsOptions = propsFactory(\r\n  {\r\n    maxHeight: {\r\n      type: [Number, String],\r\n      default: 310,\r\n    },\r\n    expandIcon: {\r\n      type: Object,\r\n    },\r\n    ...pressSelectPropsOptions(),\r\n    ...pressYFieldInputPropsOptions(),\r\n    ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\r\n      'coordinateStrategy',\r\n    ]),\r\n  },\r\n  'YSelect',\r\n);\r\n\r\nexport const YSelect = defineComponent({\r\n  name: 'YSelect',\r\n  props: {\r\n    ...pressYSelectPropsOptions(),\r\n  },\r\n  emits: {\r\n    'update:modelValue': (value: any) => true,\r\n    'update:opened': (opened: boolean) => true,\r\n  },\r\n  setup(props, { slots }) {\r\n    const fieldInputRef = ref();\r\n    const menuRef = ref();\r\n    const listRef = ref<InstanceType<typeof YList>>();\r\n\r\n    const opened = useModelDuplex(props, 'opened');\r\n    const focused = shallowRef(false);\r\n\r\n    const { items, toRefineItems, toEmitItems } = useItems(props);\r\n    const model = useModelDuplex(\r\n      props,\r\n      'modelValue',\r\n      [],\r\n      (v) => toRefineItems(v === null ? [null] : wrapInArray(v)),\r\n      (v) => {\r\n        const emitValue = toEmitItems(wrapInArray(v));\r\n        return props.multiple ? emitValue : emitValue[0] ?? null;\r\n      },\r\n    );\r\n\r\n    const selections = computed<ListItem[]>(() => {\r\n      return model.value.map((v: any) => {\r\n        return items.value.filter((item) => {\r\n          return props.valueEquals(item.value, v.value);\r\n        });\r\n      });\r\n    });\r\n\r\n    const selected = computed(() => {\r\n      return selections.value.map((selection) => selection.props.value);\r\n    });\r\n\r\n    function isSelected(item: ListItem) {\r\n      return !!selections.value.find((selectedItem) => {\r\n        return selectedItem.value === item.value;\r\n      });\r\n    }\r\n\r\n    // Field\r\n    function onMousedownDisplay(event: MouseEvent) {\r\n      if (props.disabled) {\r\n        return;\r\n      }\r\n      opened.value = !opened.value;\r\n    }\r\n\r\n    function onBlur(event: FocusEvent) {\r\n      if (listRef.value?.$el.contains(event.relatedTarget)) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    // Menu Contents\r\n    function onClickItem(item: ListItem) {\r\n      select(item);\r\n      if (!props.multiple) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    function onAfterLeave() {\r\n      if (focused.value) {\r\n        fieldInputRef.value?.focus();\r\n      }\r\n    }\r\n\r\n    function select(item: ListItem) {\r\n      if (props.multiple) {\r\n        const index = selections.value.findIndex((selectedItem) => {\r\n          return selectedItem.value === item.value;\r\n        });\r\n        if (index === -1) {\r\n          model.value = [...model.value, item];\r\n        } else {\r\n          const neo = model.value.slice();\r\n          neo.splice(index, 1);\r\n          model.value = neo;\r\n        }\r\n      } else {\r\n        model.value = [item];\r\n      }\r\n    }\r\n\r\n    const displayText = computed(() => {\r\n      if (props.multiple) {\r\n        return selections.value.map((item) => item.text).join(', ');\r\n      }\r\n      return selections.value?.[0]?.text ?? '';\r\n    });\r\n\r\n    useRender(() => {\r\n      const fieldInputProps = chooseProps(props, YFieldInput.props);\r\n      return (\r\n        <YMenu\r\n          v-model={opened.value}\r\n          ref={menuRef}\r\n          offset={props.offset}\r\n          position={props.position}\r\n          origin={props.origin}\r\n          content-classes={['y-select__content']}\r\n          maxHeight={props.maxHeight}\r\n          open-on-click-base={false}\r\n          onAfterLeave={onAfterLeave}\r\n        >\r\n          {{\r\n            base: (...args: any[]) =>\r\n              slots.base ? (\r\n                slots.base?.(...args)\r\n              ) : (\r\n                <YFieldInput\r\n                  {...{\r\n                    ...fieldInputProps,\r\n                    ...mergeProps({ ...args[0].props }, { ref: fieldInputRef }),\r\n                  }}\r\n                  onMousedown:display={onMousedownDisplay}\r\n                  onBlur={onBlur}\r\n                  readonly\r\n                  class={['y-select', { 'y-select--opened': opened.value }]}\r\n                  v-model:focused={focused.value}\r\n                >\r\n                  {{\r\n                    default: () => {\r\n                      return (\r\n                        <div class={['y-select__selection']}>\r\n                          {slots.selection\r\n                            ? slots.selection?.()\r\n                            : displayText.value}\r\n                        </div>\r\n                      );\r\n                    },\r\n                    leading: slots.leading\r\n                      ? (...args: any[]) => slots.leading?.(...args)\r\n                      : undefined,\r\n                    trailing: (...args: any[]) => {\r\n                      return slots['expand-icon'] ? (\r\n                        slots['expand-icon']()\r\n                      ) : (\r\n                        <i class=\"y-select__icon\">\r\n                          <YIconDropdown></YIconDropdown>\r\n                        </i>\r\n                      );\r\n                    },\r\n                    'helper-text': slots['helper-text']\r\n                      ? slots['helper-text']?.()\r\n                      : undefined,\r\n                  }}\r\n                </YFieldInput>\r\n              ),\r\n            default: () =>\r\n              slots.menu ? (\r\n                slots.menu()\r\n              ) : (\r\n                <YCard>\r\n                  {items.value.length > 0 ? (\r\n                    <YList ref={listRef}>\r\n                      {items.value.map((item) => {\r\n                        return (\r\n                          <YListItem\r\n                            onClick={(e) => onClickItem(item)}\r\n                            class={{ 'y-list-item--active': isSelected(item) }}\r\n                          >\r\n                            {item.text}\r\n                          </YListItem>\r\n                        );\r\n                      })}\r\n                    </YList>\r\n                  ) : (\r\n                    <div class=\"y-select__no-options\">항목이 없습니다.</div>\r\n                  )}\r\n                </YCard>\r\n              ),\r\n          }}\r\n        </YMenu>\r\n      );\r\n    });\r\n\r\n    return {\r\n      fieldInputRef,\r\n      model,\r\n      selections,\r\n      selected,\r\n    };\r\n  },\r\n});\r\n"],"mappings":"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"}
+{"version":3,"file":"YSelect.mjs","names":["shallowRef","computed","defineComponent","mergeProps","ref","useModelDuplex","useRender","pressCoordinateProps","pressListItemsPropsOptions","useItems","wrapInArray","deepEqual","getObjectValueByPath","omit","chooseProps","propsFactory","YCard","YFieldInput","pressYFieldInputPropsOptions","YIconDropdown","YList","YListItem","YMenu","returnItemEquals","optionsItem","valueItem","valueKey","arguments","length","undefined","valueItemType","itemValue","pressSelectPropsOptions","opened","Boolean","multiple","weakEquals","valueEquals","type","Function","default","defaultSelect","pressYSelectPropsOptions","maxHeight","Number","String","expandIcon","Object","position","YSelect","name","props","emits","value","setup","_ref","slots","fieldInputRef","menuRef","listRef","focused","items","toRefineItems","toEmitItems","model","v","emitValue","selections","map","find","item","selected","selection","isSelected","selectedItem","onMousedownDisplay","event","disabled","onBlur","$el","contains","relatedTarget","onClickItem","select","onAfterLeave","focus","index","findIndex","neo","slice","splice","displayText","text","join","fieldInputProps","_createVNode","$event","offset","origin","base","_len","args","Array","_key","_mergeProps","leading","_len2","_key2","trailing","menu","e","_createTextVNode"],"sources":["../../../src/components/select/YSelect.tsx"],"sourcesContent":["import { shallowRef } from '@vue/runtime-core';\r\nimport type { PropType } from 'vue';\r\nimport { computed, defineComponent, mergeProps, ref } from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { pressCoordinateProps } from '../../composables/coordinate';\r\nimport {\r\n  ListItem,\r\n  pressListItemsPropsOptions,\r\n  useItems,\r\n} from '../../composables/list-items';\r\nimport { wrapInArray } from '../../util/array';\r\nimport {deepEqual, getObjectValueByPath, getPropertyFromItem, omit} from '../../util/common';\r\nimport { chooseProps, propsFactory } from '../../util/vue-component';\r\nimport { YCard } from '../card';\r\nimport { YFieldInput, pressYFieldInputPropsOptions } from '../field-input';\r\nimport { YIconDropdown } from '../icons/YIconDropdown';\r\nimport { YList, YListItem } from '../list';\r\nimport { YMenu } from '../menu';\r\n\r\nimport './YSelect.scss';\r\n\r\nexport type SelectEquals = (\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey?: string,\r\n) => boolean;\r\n\r\nexport function returnItemEquals(\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey = 'value',\r\n) {\r\n  const valueItemType = typeof valueItem;\r\n  const itemValue =\r\n    valueItemType === 'string' || valueItemType === 'number'\r\n      ? getObjectValueByPath(optionsItem, valueKey)\r\n      : optionsItem;\r\n  return deepEqual(itemValue, valueItem);\r\n}\r\n\r\nexport const pressSelectPropsOptions = propsFactory(\r\n  {\r\n    opened: Boolean as PropType<boolean>,\r\n    multiple: Boolean,\r\n    weakEquals: Boolean,\r\n    valueEquals: {\r\n      type: Function as PropType<SelectEquals>,\r\n      default: deepEqual,\r\n    },\r\n    defaultSelect: Boolean,\r\n    ...pressListItemsPropsOptions(),\r\n  },\r\n  'Select',\r\n);\r\n\r\nexport const pressYSelectPropsOptions = propsFactory(\r\n  {\r\n    maxHeight: {\r\n      type: [Number, String],\r\n      default: 310,\r\n    },\r\n    expandIcon: {\r\n      type: Object,\r\n    },\r\n    ...pressSelectPropsOptions(),\r\n    ...pressYFieldInputPropsOptions(),\r\n    ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\r\n      'coordinateStrategy',\r\n    ]),\r\n  },\r\n  'YSelect',\r\n);\r\n\r\nexport const YSelect = defineComponent({\r\n  name: 'YSelect',\r\n  props: {\r\n    ...pressYSelectPropsOptions(),\r\n  },\r\n  emits: {\r\n    'update:modelValue': (value: any) => true,\r\n    'update:opened': (opened: boolean) => true,\r\n  },\r\n  setup(props, { slots }) {\r\n    const fieldInputRef = ref();\r\n    const menuRef = ref();\r\n    const listRef = ref<InstanceType<typeof YList>>();\r\n\r\n    const opened = useModelDuplex(props, 'opened');\r\n    const focused = shallowRef(false);\r\n\r\n    const { items, toRefineItems, toEmitItems } = useItems(props);\r\n    const model = useModelDuplex(\r\n      props,\r\n      'modelValue',\r\n      [],\r\n      (v) => toRefineItems(v === null ? [null] : wrapInArray(v)),\r\n      (v) => {\r\n        const emitValue = toEmitItems(wrapInArray(v));\r\n        return props.multiple ? emitValue : emitValue[0] ?? null;\r\n      },\r\n    );\r\n\r\n    const selections = computed<ListItem[]>(() => {\r\n      return model.value.map((v: any) => {\r\n        return items.value.find((item) => {\r\n          return props.valueEquals(item.value, v.value);\r\n        });\r\n      });\r\n    });\r\n\r\n    const selected = computed(() => {\r\n      return selections.value.map((selection) => selection.props.value);\r\n    });\r\n\r\n    function isSelected(item: ListItem) {\r\n      return !!selections.value.find((selectedItem) => {\r\n        return selectedItem.value === item.value;\r\n      });\r\n    }\r\n\r\n    // Field\r\n    function onMousedownDisplay(event: MouseEvent) {\r\n      if (props.disabled) {\r\n        return;\r\n      }\r\n      opened.value = !opened.value;\r\n    }\r\n\r\n    function onBlur(event: FocusEvent) {\r\n      if (listRef.value?.$el.contains(event.relatedTarget)) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    // Menu Contents\r\n    function onClickItem(item: ListItem) {\r\n      select(item);\r\n      if (!props.multiple) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    function onAfterLeave() {\r\n      if (focused.value) {\r\n        fieldInputRef.value?.focus();\r\n      }\r\n    }\r\n\r\n    function select(item: ListItem) {\r\n      if (props.multiple) {\r\n        const index = selections.value.findIndex((selectedItem) => {\r\n          return selectedItem.value === item.value;\r\n        });\r\n        if (index === -1) {\r\n          model.value = [...model.value, item];\r\n        } else {\r\n          const neo = model.value.slice();\r\n          neo.splice(index, 1);\r\n          model.value = neo;\r\n        }\r\n      } else {\r\n        model.value = [item];\r\n      }\r\n    }\r\n\r\n    const displayText = computed(() => {\r\n      if (props.multiple) {\r\n        return selections.value.map((item) => item.text).join(', ');\r\n      }\r\n      return selections.value?.[0]?.text ?? '';\r\n    });\r\n\r\n    useRender(() => {\r\n      const fieldInputProps = chooseProps(props, YFieldInput.props);\r\n      return (\r\n        <YMenu\r\n          v-model={opened.value}\r\n          ref={menuRef}\r\n          offset={props.offset}\r\n          position={props.position}\r\n          origin={props.origin}\r\n          content-classes={['y-select__content']}\r\n          maxHeight={props.maxHeight}\r\n          open-on-click-base={false}\r\n          onAfterLeave={onAfterLeave}\r\n        >\r\n          {{\r\n            base: (...args: any[]) =>\r\n              slots.base ? (\r\n                slots.base?.(...args)\r\n              ) : (\r\n                <YFieldInput\r\n                  {...{\r\n                    ...fieldInputProps,\r\n                    ...mergeProps({ ...args[0].props }, { ref: fieldInputRef }),\r\n                  }}\r\n                  onMousedown:display={onMousedownDisplay}\r\n                  onBlur={onBlur}\r\n                  readonly\r\n                  class={['y-select', { 'y-select--opened': opened.value }]}\r\n                  v-model:focused={focused.value}\r\n                >\r\n                  {{\r\n                    default: () => {\r\n                      return (\r\n                        <div class={['y-select__selection']}>\r\n                          {slots.selection\r\n                            ? slots.selection?.()\r\n                            : displayText.value}\r\n                        </div>\r\n                      );\r\n                    },\r\n                    leading: slots.leading\r\n                      ? (...args: any[]) => slots.leading?.(...args)\r\n                      : undefined,\r\n                    trailing: (...args: any[]) => {\r\n                      return slots['expand-icon'] ? (\r\n                        slots['expand-icon']()\r\n                      ) : (\r\n                        <i class=\"y-select__icon\">\r\n                          <YIconDropdown></YIconDropdown>\r\n                        </i>\r\n                      );\r\n                    },\r\n                    'helper-text': slots['helper-text']\r\n                      ? slots['helper-text']?.()\r\n                      : undefined,\r\n                  }}\r\n                </YFieldInput>\r\n              ),\r\n            default: () =>\r\n              slots.menu ? (\r\n                slots.menu()\r\n              ) : (\r\n                <YCard>\r\n                  {items.value.length > 0 ? (\r\n                    <YList ref={listRef}>\r\n                      {items.value.map((item) => {\r\n                        return (\r\n                          <YListItem\r\n                            onClick={(e) => onClickItem(item)}\r\n                            class={{ 'y-list-item--active': isSelected(item) }}\r\n                          >\r\n                            {item.text}\r\n                          </YListItem>\r\n                        );\r\n                      })}\r\n                    </YList>\r\n                  ) : (\r\n                    <div class=\"y-select__no-options\">항목이 없습니다.</div>\r\n                  )}\r\n                </YCard>\r\n              ),\r\n          }}\r\n        </YMenu>\r\n      );\r\n    });\r\n\r\n    return {\r\n      fieldInputRef,\r\n      model,\r\n      selections,\r\n      selected,\r\n    };\r\n  },\r\n});\r\n"],"mappings":"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"}

package/lib/composables/layer-group.mjs

@@ -1,5 +1,6 @@
-import { computed, getCurrentInstance } from 'vue';
+import { computed, getCurrentInstance, watch } from 'vue';
 export const Y_LAYER_GROUP_CLASS_NAME = 'y-layer-group';
+const layerGroupState = new WeakMap();
 export function useLayerGroup(target) {
   const vm = getCurrentInstance();
   const layerGroup = computed(() => {
@@ -27,8 +28,30 @@ export function useLayerGroup(target) {
     }
     return layerEl;
   });
+  watch(layerGroup, (neo, old) => {
+    if (old && layerGroupState.has(old)) {
+      layerGroupState.get(old)?.delete(vm);
+    }
+    if (!(layerGroupState.has(neo) && layerGroupState.get(neo))) {
+      layerGroupState.set(neo, new Set());
+    }
+    layerGroupState.get(neo)?.add(vm);
+  }, {
+    immediate: true
+  });
+  function getActiveLayers() {
+    const activeLayers = [];
+    layerGroupState.get(layerGroup.value)?.forEach(value => {
+      if (value?.ctx?.active) {
+        activeLayers.push(value);
+      }
+    });
+    return activeLayers;
+  }
   return {
-    layerGroup
+    layerGroup,
+    layerGroupState,
+    getActiveLayers
   };
 }
 //# sourceMappingURL=layer-group.mjs.map

package/lib/composables/layer-group.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"layer-group.mjs","names":["computed","getCurrentInstance","Y_LAYER_GROUP_CLASS_NAME","useLayerGroup","target","vm","layerGroup","refTarget","value","targetEl","document","body","rootEl","root","vnode","el","parentElement","querySelector","nodeType","layerEl","createElement","className","appendChild"],"sources":["../../src/composables/layer-group.ts"],"sourcesContent":["import {computed, getCurrentInstance} from 'vue';\r\nimport type { Ref } from 'vue';\r\n\r\nexport const Y_LAYER_GROUP_CLASS_NAME = 'y-layer-group';\r\n\r\nexport function useLayerGroup(target?: Ref<string | Element>) {\r\n  const vm = getCurrentInstance()!;\r\n\r\n  const layerGroup = computed<string | HTMLElement>(() => {\r\n    const refTarget = target?.value;\r\n    let targetEl: Element = document.body;\r\n\r\n    const rootEl = vm.root.vnode.el?.parentElement as HTMLElement;\r\n    if (rootEl) {\r\n      targetEl = rootEl;\r\n    }\r\n\r\n    if (typeof refTarget === 'string') {\r\n      const el = document.querySelector(refTarget);\r\n      if (el) {\r\n        targetEl = el;\r\n      }\r\n    }\r\n    if (refTarget && (refTarget as Element).nodeType === 1) {\r\n      targetEl = refTarget as Element;\r\n    }\r\n    //\r\n    let layerEl = targetEl.querySelector(`.${Y_LAYER_GROUP_CLASS_NAME}`);\r\n    if (!layerEl) {\r\n      layerEl = document.createElement('div');\r\n      layerEl.className = Y_LAYER_GROUP_CLASS_NAME;\r\n      targetEl.appendChild(layerEl);\r\n    }\r\n    return layerEl as HTMLElement;\r\n  });\r\n\r\n  return { layerGroup };\r\n}\r\n"],"mappings":"AAAA,SAAQA,QAAQ,EAAEC,kBAAkB,QAAO,KAAK;AAGhD,OAAO,MAAMC,wBAAwB,GAAG,eAAe;AAEvD,OAAO,SAASC,aAAaA,CAACC,MAA8B,EAAE;EAC5D,MAAMC,EAAE,GAAGJ,kBAAkB,CAAC,CAAE;EAEhC,MAAMK,UAAU,GAAGN,QAAQ,CAAuB,MAAM;IACtD,MAAMO,SAAS,GAAGH,MAAM,EAAEI,KAAK;IAC/B,IAAIC,QAAiB,GAAGC,QAAQ,CAACC,IAAI;IAErC,MAAMC,MAAM,GAAGP,EAAE,CAACQ,IAAI,CAACC,KAAK,CAACC,EAAE,EAAEC,aAA4B;IAC7D,IAAIJ,MAAM,EAAE;MACVH,QAAQ,GAAGG,MAAM;IACnB;IAEA,IAAI,OAAOL,SAAS,KAAK,QAAQ,EAAE;MACjC,MAAMQ,EAAE,GAAGL,QAAQ,CAACO,aAAa,CAACV,SAAS,CAAC;MAC5C,IAAIQ,EAAE,EAAE;QACNN,QAAQ,GAAGM,EAAE;MACf;IACF;IACA,IAAIR,SAAS,IAAKA,SAAS,CAAaW,QAAQ,KAAK,CAAC,EAAE;MACtDT,QAAQ,GAAGF,SAAoB;IACjC;IACA;IACA,IAAIY,OAAO,GAAGV,QAAQ,CAACQ,aAAa,CAAE,IAAGf,wBAAyB,EAAC,CAAC;IACpE,IAAI,CAACiB,OAAO,EAAE;MACZA,OAAO,GAAGT,QAAQ,CAACU,aAAa,CAAC,KAAK,CAAC;MACvCD,OAAO,CAACE,SAAS,GAAGnB,wBAAwB;MAC5CO,QAAQ,CAACa,WAAW,CAACH,OAAO,CAAC;IAC/B;IACA,OAAOA,OAAO;EAChB,CAAC,CAAC;EAEF,OAAO;IAAEb;EAAW,CAAC;AACvB"}
+{"version":3,"file":"layer-group.mjs","names":["computed","getCurrentInstance","watch","Y_LAYER_GROUP_CLASS_NAME","layerGroupState","WeakMap","useLayerGroup","target","vm","layerGroup","refTarget","value","targetEl","document","body","rootEl","root","vnode","el","parentElement","querySelector","nodeType","layerEl","createElement","className","appendChild","neo","old","has","get","delete","set","Set","add","immediate","getActiveLayers","activeLayers","forEach","ctx","active","push"],"sources":["../../src/composables/layer-group.ts"],"sourcesContent":["import { computed, getCurrentInstance, watch } from 'vue';\nimport type { Ref, ComponentInternalInstance } from 'vue';\n\nexport const Y_LAYER_GROUP_CLASS_NAME = 'y-layer-group';\n\nconst layerGroupState = new WeakMap<HTMLElement, Set<any>>();\n\nexport function useLayerGroup(target?: Ref<string | Element>) {\n  const vm = getCurrentInstance()!;\n\n  const layerGroup = computed<HTMLElement>(() => {\n    const refTarget = target?.value;\n    let targetEl: Element = document.body;\n\n    const rootEl = vm.root.vnode.el?.parentElement as HTMLElement;\n    if (rootEl) {\n      targetEl = rootEl;\n    }\n\n    if (typeof refTarget === 'string') {\n      const el = document.querySelector(refTarget);\n      if (el) {\n        targetEl = el;\n      }\n    }\n    if (refTarget && (refTarget as Element).nodeType === 1) {\n      targetEl = refTarget as Element;\n    }\n    //\n    let layerEl = targetEl.querySelector(`.${Y_LAYER_GROUP_CLASS_NAME}`);\n    if (!layerEl) {\n      layerEl = document.createElement('div');\n      layerEl.className = Y_LAYER_GROUP_CLASS_NAME;\n      targetEl.appendChild(layerEl);\n    }\n    return layerEl as HTMLElement;\n  });\n\n  watch(\n    layerGroup,\n    (neo, old) => {\n      if (old && layerGroupState.has(old)) {\n        layerGroupState.get(old)?.delete(vm);\n      }\n      if (!(layerGroupState.has(neo) && layerGroupState.get(neo))) {\n        layerGroupState.set(neo, new Set());\n      }\n      layerGroupState.get(neo)?.add(vm);\n    },\n    { immediate: true },\n  );\n\n  function getActiveLayers() {\n    const activeLayers: ComponentInternalInstance[] = [];\n    layerGroupState.get(layerGroup.value)?.forEach((value) => {\n      if (value?.ctx?.active) {\n        activeLayers.push(value);\n      }\n    });\n    return activeLayers;\n  }\n\n  return { layerGroup, layerGroupState, getActiveLayers };\n}\n"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,kBAAkB,EAAEC,KAAK,QAAQ,KAAK;AAGzD,OAAO,MAAMC,wBAAwB,GAAG,eAAe;AAEvD,MAAMC,eAAe,GAAG,IAAIC,OAAO,CAAwB,CAAC;AAE5D,OAAO,SAASC,aAAaA,CAACC,MAA8B,EAAE;EAC5D,MAAMC,EAAE,GAAGP,kBAAkB,CAAC,CAAE;EAEhC,MAAMQ,UAAU,GAAGT,QAAQ,CAAc,MAAM;IAC7C,MAAMU,SAAS,GAAGH,MAAM,EAAEI,KAAK;IAC/B,IAAIC,QAAiB,GAAGC,QAAQ,CAACC,IAAI;IAErC,MAAMC,MAAM,GAAGP,EAAE,CAACQ,IAAI,CAACC,KAAK,CAACC,EAAE,EAAEC,aAA4B;IAC7D,IAAIJ,MAAM,EAAE;MACVH,QAAQ,GAAGG,MAAM;IACnB;IAEA,IAAI,OAAOL,SAAS,KAAK,QAAQ,EAAE;MACjC,MAAMQ,EAAE,GAAGL,QAAQ,CAACO,aAAa,CAACV,SAAS,CAAC;MAC5C,IAAIQ,EAAE,EAAE;QACNN,QAAQ,GAAGM,EAAE;MACf;IACF;IACA,IAAIR,SAAS,IAAKA,SAAS,CAAaW,QAAQ,KAAK,CAAC,EAAE;MACtDT,QAAQ,GAAGF,SAAoB;IACjC;IACA;IACA,IAAIY,OAAO,GAAGV,QAAQ,CAACQ,aAAa,CAAE,IAAGjB,wBAAyB,EAAC,CAAC;IACpE,IAAI,CAACmB,OAAO,EAAE;MACZA,OAAO,GAAGT,QAAQ,CAACU,aAAa,CAAC,KAAK,CAAC;MACvCD,OAAO,CAACE,SAAS,GAAGrB,wBAAwB;MAC5CS,QAAQ,CAACa,WAAW,CAACH,OAAO,CAAC;IAC/B;IACA,OAAOA,OAAO;EAChB,CAAC,CAAC;EAEFpB,KAAK,CACHO,UAAU,EACV,CAACiB,GAAG,EAAEC,GAAG,KAAK;IACZ,IAAIA,GAAG,IAAIvB,eAAe,CAACwB,GAAG,CAACD,GAAG,CAAC,EAAE;MACnCvB,eAAe,CAACyB,GAAG,CAACF,GAAG,CAAC,EAAEG,MAAM,CAACtB,EAAE,CAAC;IACtC;IACA,IAAI,EAAEJ,eAAe,CAACwB,GAAG,CAACF,GAAG,CAAC,IAAItB,eAAe,CAACyB,GAAG,CAACH,GAAG,CAAC,CAAC,EAAE;MAC3DtB,eAAe,CAAC2B,GAAG,CAACL,GAAG,EAAE,IAAIM,GAAG,CAAC,CAAC,CAAC;IACrC;IACA5B,eAAe,CAACyB,GAAG,CAACH,GAAG,CAAC,EAAEO,GAAG,CAACzB,EAAE,CAAC;EACnC,CAAC,EACD;IAAE0B,SAAS,EAAE;EAAK,CACpB,CAAC;EAED,SAASC,eAAeA,CAAA,EAAG;IACzB,MAAMC,YAAyC,GAAG,EAAE;IACpDhC,eAAe,CAACyB,GAAG,CAACpB,UAAU,CAACE,KAAK,CAAC,EAAE0B,OAAO,CAAE1B,KAAK,IAAK;MACxD,IAAIA,KAAK,EAAE2B,GAAG,EAAEC,MAAM,EAAE;QACtBH,YAAY,CAACI,IAAI,CAAC7B,KAAK,CAAC;MAC1B;IACF,CAAC,CAAC;IACF,OAAOyB,YAAY;EACrB;EAEA,OAAO;IAAE3B,UAAU;IAAEL,eAAe;IAAE+B;EAAgB,CAAC;AACzD"}

package/lib/index.mjs

@@ -49,9 +49,7 @@ export function init() {
   };
   return {
     install
-    // theme: themeModule,
   };
 }
-
 export { useTheme };
 //# sourceMappingURL=index.mjs.map

package/lib/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["components","YUYEON_LOGO","nextTick","reactive","YUYEON_THEME_KEY","createThemeModule","useTheme","PlateWave","defaultOptions","credit","init","options","arguments","length","undefined","themeModule","theme","install","app","yuyeon","root","instance","Object","keys","forEach","componentName","comp","component","directive","provide","config","globalProperties","$yuyeon","_instance","_container","Error","$el","classList","add","setAttribute","console","log","unmount","scope","stop"],"sources":["../src/index.ts"],"sourcesContent":["import * as components from './components';\nimport { YUYEON_LOGO } from './etc';\nimport { Component, ComponentInternalInstance } from '@vue/runtime-core';\nimport type { App } from 'vue';\nimport { nextTick, reactive } from 'vue';\n\nimport {\n  YUYEON_THEME_KEY,\n  createThemeModule,\n  useTheme,\n} from './composables/theme';\nimport PlateWave from './directives/plate-wave';\n\n//\nimport './styles/base.scss';\n\nconst defaultOptions = {\n  credit: true,\n};\n\ndeclare module 'vue' {\n  interface ComponentCustomProperties {\n    $yuyeon: any;\n  }\n}\n\nexport function init(options: any = defaultOptions) {\n  const themeModule = createThemeModule(options?.theme);\n\n  const install = (app: App): any => {\n    themeModule.install(app);\n\n    const yuyeon = reactive({\n      app: null as ComponentInternalInstance | null,\n      root: null as HTMLElement | null,\n      theme: themeModule.instance,\n    });\n\n    Object.keys(components).forEach((componentName) => {\n      const comp = components[componentName as keyof typeof components];\n      app.component(componentName, comp as Component);\n    });\n\n    app.directive('plate-wave', PlateWave);\n\n    app.provide(YUYEON_THEME_KEY, yuyeon.theme);\n\n    app.config.globalProperties.$yuyeon = yuyeon;\n\n    nextTick(() => {\n      yuyeon.app = app._instance as any;\n      yuyeon.root = app._container;\n      if (!yuyeon.root) {\n        throw new Error(`yuyeon: Can't found instance`);\n      }\n      const $el = yuyeon.root;\n      $el.classList.add('y-root');\n      $el.setAttribute('data-y-root', '');\n      themeModule.init(yuyeon);\n    });\n    if (options?.credit) {\n      console.log(YUYEON_LOGO);\n    }\n    const { unmount } = app;\n    app.unmount = () => {\n      unmount();\n      themeModule.scope.stop();\n      app.unmount = unmount;\n    };\n  };\n\n  return {\n    install,\n    // theme: themeModule,\n  };\n}\n\nexport { useTheme };\n"],"mappings":"OAAO,KAAKA,UAAU;AAAA,SACbC,WAAW;AAGpB,SAASC,QAAQ,EAAEC,QAAQ,QAAQ,KAAK;AAAC,SAGvCC,gBAAgB,EAChBC,iBAAiB,EACjBC,QAAQ;AAAA,OAEHC,SAAS,2CAEhB;AACA;AAEA,MAAMC,cAAc,GAAG;EACrBC,MAAM,EAAE;AACV,CAAC;AAQD,OAAO,SAASC,IAAIA,CAAA,EAAgC;EAAA,IAA/BC,OAAY,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGJ,cAAc;EAChD,MAAMO,WAAW,GAAGV,iBAAiB,CAACM,OAAO,EAAEK,KAAK,CAAC;EAErD,MAAMC,OAAO,GAAIC,GAAQ,IAAU;IACjCH,WAAW,CAACE,OAAO,CAACC,GAAG,CAAC;IAExB,MAAMC,MAAM,GAAGhB,QAAQ,CAAC;MACtBe,GAAG,EAAE,IAAwC;MAC7CE,IAAI,EAAE,IAA0B;MAChCJ,KAAK,EAAED,WAAW,CAACM;IACrB,CAAC,CAAC;IAEFC,MAAM,CAACC,IAAI,CAACvB,UAAU,CAAC,CAACwB,OAAO,CAAEC,aAAa,IAAK;MACjD,MAAMC,IAAI,GAAG1B,UAAU,CAACyB,aAAa,CAA4B;MACjEP,GAAG,CAACS,SAAS,CAACF,aAAa,EAAEC,IAAiB,CAAC;IACjD,CAAC,CAAC;IAEFR,GAAG,CAACU,SAAS,CAAC,YAAY,EAAErB,SAAS,CAAC;IAEtCW,GAAG,CAACW,OAAO,CAACzB,gBAAgB,EAAEe,MAAM,CAACH,KAAK,CAAC;IAE3CE,GAAG,CAACY,MAAM,CAACC,gBAAgB,CAACC,OAAO,GAAGb,MAAM;IAE5CjB,QAAQ,CAAC,MAAM;MACbiB,MAAM,CAACD,GAAG,GAAGA,GAAG,CAACe,SAAgB;MACjCd,MAAM,CAACC,IAAI,GAAGF,GAAG,CAACgB,UAAU;MAC5B,IAAI,CAACf,MAAM,CAACC,IAAI,EAAE;QAChB,MAAM,IAAIe,KAAK,CAAE,8BAA6B,CAAC;MACjD;MACA,MAAMC,GAAG,GAAGjB,MAAM,CAACC,IAAI;MACvBgB,GAAG,CAACC,SAAS,CAACC,GAAG,CAAC,QAAQ,CAAC;MAC3BF,GAAG,CAACG,YAAY,CAAC,aAAa,EAAE,EAAE,CAAC;MACnCxB,WAAW,CAACL,IAAI,CAACS,MAAM,CAAC;IAC1B,CAAC,CAAC;IACF,IAAIR,OAAO,EAAEF,MAAM,EAAE;MACnB+B,OAAO,CAACC,GAAG,CAACxC,WAAW,CAAC;IAC1B;IACA,MAAM;MAAEyC;IAAQ,CAAC,GAAGxB,GAAG;IACvBA,GAAG,CAACwB,OAAO,GAAG,MAAM;MAClBA,OAAO,CAAC,CAAC;MACT3B,WAAW,CAAC4B,KAAK,CAACC,IAAI,CAAC,CAAC;MACxB1B,GAAG,CAACwB,OAAO,GAAGA,OAAO;IACvB,CAAC;EACH,CAAC;EAED,OAAO;IACLzB;IACA;EACF,CAAC;AACH;;AAEA,SAASX,QAAQ"}
+{"version":3,"file":"index.mjs","names":["components","YUYEON_LOGO","nextTick","reactive","YUYEON_THEME_KEY","createThemeModule","useTheme","PlateWave","defaultOptions","credit","init","options","arguments","length","undefined","themeModule","theme","install","app","yuyeon","root","instance","Object","keys","forEach","componentName","comp","component","directive","provide","config","globalProperties","$yuyeon","_instance","_container","Error","$el","classList","add","setAttribute","console","log","unmount","scope","stop"],"sources":["../src/index.ts"],"sourcesContent":["import * as components from './components';\nimport { YUYEON_LOGO } from './etc';\nimport { Component, ComponentInternalInstance } from '@vue/runtime-core';\nimport type { App } from 'vue';\nimport { nextTick, reactive } from 'vue';\n\nimport {\n  YUYEON_THEME_KEY,\n  createThemeModule,\n  useTheme,\n} from './composables/theme';\nimport PlateWave from './directives/plate-wave';\n\n//\nimport './styles/base.scss';\n\nconst defaultOptions = {\n  credit: true,\n};\n\ndeclare module 'vue' {\n  interface ComponentCustomProperties {\n    $yuyeon: any;\n  }\n}\n\nexport function init(options: any = defaultOptions) {\n  const themeModule = createThemeModule(options?.theme);\n\n  const install = (app: App): any => {\n    themeModule.install(app);\n\n    const yuyeon = reactive({\n      app: null as ComponentInternalInstance | null,\n      root: null as HTMLElement | null,\n      theme: themeModule.instance,\n    });\n\n    Object.keys(components).forEach((componentName) => {\n      const comp = components[componentName as keyof typeof components];\n      app.component(componentName, comp as Component);\n    });\n\n    app.directive('plate-wave', PlateWave);\n\n    app.provide(YUYEON_THEME_KEY, yuyeon.theme);\n\n    app.config.globalProperties.$yuyeon = yuyeon;\n\n    nextTick(() => {\n      yuyeon.app = app._instance as any;\n      yuyeon.root = app._container;\n      if (!yuyeon.root) {\n        throw new Error(`yuyeon: Can't found instance`);\n      }\n      const $el = yuyeon.root;\n      $el.classList.add('y-root');\n      $el.setAttribute('data-y-root', '');\n      themeModule.init(yuyeon);\n    });\n    if (options?.credit) {\n      console.log(YUYEON_LOGO);\n    }\n    const { unmount } = app;\n    app.unmount = () => {\n      unmount();\n      themeModule.scope.stop();\n      app.unmount = unmount;\n    };\n  };\n\n  return {\n    install,\n  };\n}\n\nexport { useTheme };\n"],"mappings":"OAAO,KAAKA,UAAU;AAAA,SACbC,WAAW;AAGpB,SAASC,QAAQ,EAAEC,QAAQ,QAAQ,KAAK;AAAC,SAGvCC,gBAAgB,EAChBC,iBAAiB,EACjBC,QAAQ;AAAA,OAEHC,SAAS,2CAEhB;AACA;AAEA,MAAMC,cAAc,GAAG;EACrBC,MAAM,EAAE;AACV,CAAC;AAQD,OAAO,SAASC,IAAIA,CAAA,EAAgC;EAAA,IAA/BC,OAAY,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGJ,cAAc;EAChD,MAAMO,WAAW,GAAGV,iBAAiB,CAACM,OAAO,EAAEK,KAAK,CAAC;EAErD,MAAMC,OAAO,GAAIC,GAAQ,IAAU;IACjCH,WAAW,CAACE,OAAO,CAACC,GAAG,CAAC;IAExB,MAAMC,MAAM,GAAGhB,QAAQ,CAAC;MACtBe,GAAG,EAAE,IAAwC;MAC7CE,IAAI,EAAE,IAA0B;MAChCJ,KAAK,EAAED,WAAW,CAACM;IACrB,CAAC,CAAC;IAEFC,MAAM,CAACC,IAAI,CAACvB,UAAU,CAAC,CAACwB,OAAO,CAAEC,aAAa,IAAK;MACjD,MAAMC,IAAI,GAAG1B,UAAU,CAACyB,aAAa,CAA4B;MACjEP,GAAG,CAACS,SAAS,CAACF,aAAa,EAAEC,IAAiB,CAAC;IACjD,CAAC,CAAC;IAEFR,GAAG,CAACU,SAAS,CAAC,YAAY,EAAErB,SAAS,CAAC;IAEtCW,GAAG,CAACW,OAAO,CAACzB,gBAAgB,EAAEe,MAAM,CAACH,KAAK,CAAC;IAE3CE,GAAG,CAACY,MAAM,CAACC,gBAAgB,CAACC,OAAO,GAAGb,MAAM;IAE5CjB,QAAQ,CAAC,MAAM;MACbiB,MAAM,CAACD,GAAG,GAAGA,GAAG,CAACe,SAAgB;MACjCd,MAAM,CAACC,IAAI,GAAGF,GAAG,CAACgB,UAAU;MAC5B,IAAI,CAACf,MAAM,CAACC,IAAI,EAAE;QAChB,MAAM,IAAIe,KAAK,CAAE,8BAA6B,CAAC;MACjD;MACA,MAAMC,GAAG,GAAGjB,MAAM,CAACC,IAAI;MACvBgB,GAAG,CAACC,SAAS,CAACC,GAAG,CAAC,QAAQ,CAAC;MAC3BF,GAAG,CAACG,YAAY,CAAC,aAAa,EAAE,EAAE,CAAC;MACnCxB,WAAW,CAACL,IAAI,CAACS,MAAM,CAAC;IAC1B,CAAC,CAAC;IACF,IAAIR,OAAO,EAAEF,MAAM,EAAE;MACnB+B,OAAO,CAACC,GAAG,CAACxC,WAAW,CAAC;IAC1B;IACA,MAAM;MAAEyC;IAAQ,CAAC,GAAGxB,GAAG;IACvBA,GAAG,CAACwB,OAAO,GAAG,MAAM;MAClBA,OAAO,CAAC,CAAC;MACT3B,WAAW,CAAC4B,KAAK,CAACC,IAAI,CAAC,CAAC;MACxB1B,GAAG,CAACwB,OAAO,GAAGA,OAAO;IACvB,CAAC;EACH,CAAC;EAED,OAAO;IACLzB;EACF,CAAC;AACH;AAEA,SAASX,QAAQ"}

package/lib/styles/base.scss

@@ -117,6 +117,14 @@
   color: var(--y-theme-error);
 }
 
+.d-flex {
+  display: flex;
+}
+
 .flex-wrap {
   flex-wrap: wrap;
 }
+
+.flex-spacer {
+  flex: 1 1;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yuyeon",
-  "version": "0.0.35",
+  "version": "0.0.37",
   "keywords": [
     "UI Library",
     "Vue"

package/types/components/dialog/YDialog.d.ts

@@ -3,13 +3,25 @@ export declare const YDialog: import("vue").DefineComponent<{
     modelValue: {
         type: PropType<boolean>;
     };
-    modal: {
-        type: BooleanConstructor;
+    persistent: {
+        type: PropType<boolean>;
+        default: boolean;
     };
     dialogClasses: {
         type: PropType<string | string[] | Record<string, any>>;
     };
-    disabled: BooleanConstructor;
+    closeClickScrim: {
+        type: PropType<boolean>;
+    };
+    disabled: PropType<boolean>;
+    maximized: PropType<boolean>;
+    scrim: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    offset: {
+        type: PropType<string>;
+    };
 }, {
     active: import("vue").WritableComputedRef<any>;
     layer: import("vue").Ref<import("vue").DefineComponent<{
@@ -55,6 +67,9 @@ export declare const YDialog: import("vue").DefineComponent<{
         scrim: {
             type: PropType<boolean>;
         };
+        scrimOpacity: {
+            type: PropType<number>;
+        };
         eager: {
             type: PropType<boolean>;
         };
@@ -67,7 +82,6 @@ export declare const YDialog: import("vue").DefineComponent<{
         closeClickScrim: {
             type: PropType<boolean>;
         };
-        modal: PropType<boolean>;
         contentStyles: {
             type: PropType<import("vue").CSSProperties>;
             default: () => void;
@@ -88,13 +102,14 @@ export declare const YDialog: import("vue").DefineComponent<{
             type: PropType<number>;
             default: number;
         };
+        modal: PropType<boolean>;
     }, {
         complementClickOption: {
             handler: (mouseEvent: MouseEvent) => void;
             determine?: ((event: Event) => boolean) | undefined;
             include?: (() => (HTMLElement | undefined)[]) | undefined;
         };
-        layerGroup: import("vue").ComputedRef<string | HTMLElement>;
+        layerGroup: import("vue").ComputedRef<HTMLElement>;
         active: import("vue").WritableComputedRef<boolean>;
         rendered: import("vue").ComputedRef<boolean>;
         lazyValue: import("vue").ComputedRef<any>;
@@ -1667,6 +1682,8 @@ export declare const YDialog: import("vue").DefineComponent<{
             "text-anchor"?: import("csstype").Property.TextAnchor | undefined;
             "vector-effect"?: import("csstype").Property.VectorEffect | undefined;
         }>;
+        layerGroupState: WeakMap<HTMLElement, Set<any>>;
+        getActiveLayers: () => import("vue").ComponentInternalInstance[];
     }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
         'update:modelValue': (value: boolean) => true;
         'click:complement': (mouseEvent: MouseEvent) => true;
@@ -1714,6 +1731,9 @@ export declare const YDialog: import("vue").DefineComponent<{
         scrim: {
             type: PropType<boolean>;
         };
+        scrimOpacity: {
+            type: PropType<number>;
+        };
         eager: {
             type: PropType<boolean>;
         };
@@ -1726,7 +1746,6 @@ export declare const YDialog: import("vue").DefineComponent<{
         closeClickScrim: {
             type: PropType<boolean>;
         };
-        modal: PropType<boolean>;
         contentStyles: {
             type: PropType<import("vue").CSSProperties>;
             default: () => void;
@@ -1747,6 +1766,7 @@ export declare const YDialog: import("vue").DefineComponent<{
             type: PropType<number>;
             default: number;
         };
+        modal: PropType<boolean>;
     }>> & {
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         onAfterLeave?: (() => any) | undefined;
@@ -1768,21 +1788,34 @@ export declare const YDialog: import("vue").DefineComponent<{
     }, {}> | undefined>;
     classes: import("vue").ComputedRef<{
         'y-dialog': boolean;
+        'y-dialog--maximized': boolean | undefined;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
         type: PropType<boolean>;
     };
-    modal: {
-        type: BooleanConstructor;
+    persistent: {
+        type: PropType<boolean>;
+        default: boolean;
     };
     dialogClasses: {
         type: PropType<string | string[] | Record<string, any>>;
     };
-    disabled: BooleanConstructor;
+    closeClickScrim: {
+        type: PropType<boolean>;
+    };
+    disabled: PropType<boolean>;
+    maximized: PropType<boolean>;
+    scrim: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    offset: {
+        type: PropType<string>;
+    };
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    disabled: boolean;
-    modal: boolean;
+    scrim: boolean;
+    persistent: boolean;
 }, {}>;

package/types/components/layer/YLayer.d.ts

@@ -1,4 +1,4 @@
-import type { CSSProperties, PropType } from 'vue';
+import type { CSSProperties, PropType, ComponentInternalInstance } from 'vue';
 export declare const pressYLayerProps: <Defaults extends {
     minWidth?: unknown;
     width?: unknown;
@@ -16,11 +16,11 @@ export declare const pressYLayerProps: <Defaults extends {
     theme?: unknown;
     modelValue?: unknown;
     scrim?: unknown;
+    scrimOpacity?: unknown;
     eager?: unknown;
     classes?: unknown;
     contentClasses?: unknown;
     closeClickScrim?: unknown;
-    modal?: unknown;
     contentStyles?: unknown;
     disabled?: unknown;
     openOnHover?: unknown;
@@ -151,6 +151,14 @@ export declare const pressYLayerProps: <Defaults extends {
         type: PropType<unknown extends Defaults["scrim"] ? boolean : boolean | Defaults["scrim"]>;
         default: unknown extends Defaults["scrim"] ? boolean : boolean | Defaults["scrim"];
     };
+    scrimOpacity: unknown extends Defaults["scrimOpacity"] ? {
+        type: PropType<number>;
+    } : Omit<{
+        type: PropType<number>;
+    }, "default" | "type"> & {
+        type: PropType<unknown extends Defaults["scrimOpacity"] ? number : number | Defaults["scrimOpacity"]>;
+        default: unknown extends Defaults["scrimOpacity"] ? number : number | Defaults["scrimOpacity"];
+    };
     eager: unknown extends Defaults["eager"] ? {
         type: PropType<boolean>;
     } : Omit<{
@@ -183,10 +191,6 @@ export declare const pressYLayerProps: <Defaults extends {
         type: PropType<unknown extends Defaults["closeClickScrim"] ? boolean : boolean | Defaults["closeClickScrim"]>;
         default: unknown extends Defaults["closeClickScrim"] ? boolean : boolean | Defaults["closeClickScrim"];
     };
-    modal: unknown extends Defaults["modal"] ? PropType<boolean> : {
-        type: PropType<unknown extends Defaults["modal"] ? boolean : boolean | Defaults["modal"]>;
-        default: unknown extends Defaults["modal"] ? boolean : boolean | Defaults["modal"];
-    };
     contentStyles: unknown extends Defaults["contentStyles"] ? {
         type: PropType<CSSProperties>;
         default: () => void;
@@ -281,6 +285,9 @@ export declare const YLayer: import("vue").DefineComponent<{
     scrim: {
         type: PropType<boolean>;
     };
+    scrimOpacity: {
+        type: PropType<number>;
+    };
     eager: {
         type: PropType<boolean>;
     };
@@ -293,7 +300,6 @@ export declare const YLayer: import("vue").DefineComponent<{
     closeClickScrim: {
         type: PropType<boolean>;
     };
-    modal: PropType<boolean>;
     contentStyles: {
         type: PropType<CSSProperties>;
         default: () => void;
@@ -314,13 +320,14 @@ export declare const YLayer: import("vue").DefineComponent<{
         type: PropType<number>;
         default: number;
     };
+    modal: PropType<boolean>;
 }, {
     complementClickOption: {
         handler: (mouseEvent: MouseEvent) => void;
         determine?: ((event: Event) => boolean) | undefined;
         include?: (() => (HTMLElement | undefined)[]) | undefined;
     };
-    layerGroup: import("vue").ComputedRef<string | HTMLElement>;
+    layerGroup: import("vue").ComputedRef<HTMLElement>;
     active: import("vue").WritableComputedRef<boolean>;
     rendered: import("vue").ComputedRef<boolean>;
     lazyValue: import("vue").ComputedRef<any>;
@@ -1893,6 +1900,8 @@ export declare const YLayer: import("vue").DefineComponent<{
         "text-anchor"?: import("csstype").Property.TextAnchor | undefined;
         "vector-effect"?: import("csstype").Property.VectorEffect | undefined;
     }>;
+    layerGroupState: WeakMap<HTMLElement, Set<any>>;
+    getActiveLayers: () => ComponentInternalInstance[];
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     'update:modelValue': (value: boolean) => true;
     'click:complement': (mouseEvent: MouseEvent) => true;
@@ -1940,6 +1949,9 @@ export declare const YLayer: import("vue").DefineComponent<{
     scrim: {
         type: PropType<boolean>;
     };
+    scrimOpacity: {
+        type: PropType<number>;
+    };
     eager: {
         type: PropType<boolean>;
     };
@@ -1952,7 +1964,6 @@ export declare const YLayer: import("vue").DefineComponent<{
     closeClickScrim: {
         type: PropType<boolean>;
     };
-    modal: PropType<boolean>;
     contentStyles: {
         type: PropType<CSSProperties>;
         default: () => void;
@@ -1973,6 +1984,7 @@ export declare const YLayer: import("vue").DefineComponent<{
         type: PropType<number>;
         default: number;
     };
+    modal: PropType<boolean>;
 }>> & {
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onAfterLeave?: (() => any) | undefined;