yuyeon 0.3.1-rc.5 → 0.3.1

package/lib/components/layer/YLayer.js

@@ -0,0 +1,326 @@
+import { withDirectives as _withDirectives, mergeProps as _mergeProps, resolveDirective as _resolveDirective, vShow as _vShow, createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { Teleport, Transition, computed, getCurrentInstance, mergeProps, reactive, ref, shallowRef, toRef } from 'vue';
+import { useModelDuplex } from "../../composables/communication.js";
+import { useRender } from "../../composables/component.js";
+import { pressCoordinateProps, useCoordinate } from "../../composables/coordinate/index.js";
+import { pressDimensionPropsOptions, useDimension } from "../../composables/dimension.js";
+import { useLayerGroup } from "../../composables/layer-group.js";
+import { pressThemePropsOptions, useLocalTheme } from "../../composables/theme/index.js";
+import { useLazy } from "../../composables/timing.js";
+import { PolyTransition, pressPolyTransitionPropsOptions, usePolyTransition } from "../../composables/transition.js";
+import { ComplementClick } from "../../directives/complement-click/index.js";
+import { bindClasses, defineComponent, propsFactory } from "../../util/component/index.js";
+import { pressBasePropsOptions, useBase } from "./base.js";
+import { pressContentPropsOptions, useContent } from "./content.js";
+import { pressScrollStrategyProps, useScrollStrategies } from "./scroll-strategies.js";
+import "./YLayer.scss";
+export const pressYLayerProps = propsFactory({
+  modelValue: {
+    type: Boolean
+  },
+  scrim: {
+    type: Boolean
+  },
+  scrimOpacity: {
+    type: Number
+  },
+  eager: {
+    type: Boolean
+  },
+  classes: {
+    type: [Array, String, Object]
+  },
+  contentClasses: {
+    type: [Array, String, Object]
+  },
+  closeClickScrim: {
+    type: Boolean
+  },
+  contentStyles: {
+    type: Object,
+    default: () => {}
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  maximized: {
+    type: Boolean
+  },
+  openOnHover: {
+    type: Boolean,
+    default: false
+  },
+  openDelay: {
+    type: Number,
+    default: 200
+  },
+  closeDelay: {
+    type: Number,
+    default: 200
+  },
+  zIndex: {
+    type: [Number, String],
+    default: 2000
+  },
+  contained: Boolean,
+  layerGroup: [String, Object],
+  ...pressThemePropsOptions(),
+  ...pressPolyTransitionPropsOptions(),
+  ...pressBasePropsOptions(),
+  ...pressContentPropsOptions(),
+  ...pressCoordinateProps(),
+  ...pressScrollStrategyProps(),
+  ...pressDimensionPropsOptions()
+}, 'YLayer');
+export const YLayer = defineComponent({
+  name: 'YLayer',
+  inheritAttrs: false,
+  components: {
+    PolyTransition
+  },
+  directives: {
+    ComplementClick
+  },
+  props: {
+    modal: Boolean,
+    ...pressYLayerProps()
+  },
+  emits: {
+    'update:modelValue': value => true,
+    'click:complement': mouseEvent => true,
+    afterLeave: () => true
+  },
+  slots: Object,
+  setup(props, _ref) {
+    let {
+      emit,
+      expose,
+      attrs,
+      slots
+    } = _ref;
+    const vm = getCurrentInstance();
+    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$,
+      baseEl,
+      baseSlot,
+      baseFromSlotEl
+    } = useBase(props);
+    const {
+      contentEvents
+    } = useContent(props, active);
+    const {
+      themeClasses
+    } = useLocalTheme(props);
+    const {
+      layerGroup,
+      layerGroupState,
+      getActiveLayers
+    } = useLayerGroup(props);
+    const {
+      polyTransitionBindProps
+    } = usePolyTransition(props);
+    const {
+      dimensionStyles
+    } = useDimension(props);
+    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 maximized = toRef(props, 'maximized');
+    const rendered = computed(() => !disabled.value && (lazyValue.value || active.value));
+    const {
+      coordinateStyles,
+      updateCoordinate
+    } = useCoordinate(props, {
+      contentEl: content$,
+      base,
+      active
+    });
+    useScrollStrategies(props, {
+      root: root$,
+      contentEl: content$,
+      active,
+      baseEl: base,
+      updateCoordinate
+    });
+    function onClickComplementLayer(mouseEvent) {
+      emit('click:complement', mouseEvent);
+      if (!props.modal) {
+        if (scrim$.value !== null && scrim$.value === mouseEvent.target && props.closeClickScrim) {
+          active.value = false;
+        }
+      } else {
+        // TODO: shrug ani
+      }
+    }
+    function closeConditional() {
+      return (!props.openOnHover || props.openOnHover && !hovered.value) && active.value && finish.value; // TODO: && groupTopLevel.value;
+    }
+
+    const complementClickOption = reactive({
+      handler: onClickComplementLayer,
+      determine: closeConditional,
+      include: () => [baseEl.value]
+    });
+    function onAfterEnter() {
+      finish.value = true;
+    }
+    function onAfterLeave() {
+      onAfterUpdate();
+      finish.value = false;
+      emit('afterLeave');
+    }
+    function onClickScrim() {
+      if (props.closeClickScrim) {
+        active.value = false;
+      }
+    }
+    function onMouseenter(event) {
+      hovered.value = true;
+    }
+    function onMouseleave(event) {
+      hovered.value = false;
+    }
+    const computedStyle = computed(() => {
+      return {
+        zIndex: (props.zIndex ?? '2000').toString()
+      };
+    });
+    const computedClass = computed(() => {
+      const {
+        classes
+      } = props;
+      const boundClasses = bindClasses(classes);
+      return {
+        ...boundClasses,
+        'y-layer--active': !!active.value
+      };
+    });
+    const computedContentClasses = computed(() => {
+      const boundClasses = bindClasses(props.contentClasses);
+      return {
+        ...boundClasses
+      };
+    });
+    expose({
+      scrim$,
+      base$,
+      content$: computed(() => content$.value),
+      baseEl,
+      active,
+      onAfterUpdate,
+      updateCoordinate,
+      hovered,
+      finish,
+      modal: computed(() => props.modal),
+      getActiveLayers,
+      isMe: vnode => {
+        return vnode === vm;
+      }
+    });
+    useRender(() => {
+      const slotBase = slots.base?.({
+        active: active.value,
+        props: mergeProps({
+          ref: base$,
+          class: {
+            'y-layer-base': true,
+            'y-layer-base--active': active.value
+          },
+          ...(props.baseProps ?? {})
+        })
+      });
+      baseSlot.value = slotBase;
+      return _createVNode(_Fragment, null, [slotBase, _createVNode(Teleport, {
+        "disabled": !layerGroup.value,
+        "to": layerGroup.value
+      }, {
+        default: () => [rendered.value && _createVNode("div", _mergeProps({
+          "class": [{
+            'y-layer': true,
+            'y-layer--finish': finish.value,
+            'y-layer--contained': props.contained,
+            ...computedClass.value
+          }, themeClasses.value],
+          "onMouseenter": onMouseenter,
+          "onMouseleave": onMouseleave,
+          "style": computedStyle.value,
+          "ref": root$
+        }, attrs), [_createVNode(Transition, {
+          "name": "fade",
+          "appear": true
+        }, {
+          default: () => [active.value && props.scrim && _createVNode("div", {
+            "class": "y-layer__scrim",
+            "style": {
+              '--y-layer-scrim-opacity': props.scrimOpacity
+            },
+            "onClick": onClickScrim,
+            "ref": "scrim$"
+          }, null)]
+        }), _createVNode(PolyTransition, _mergeProps({
+          "onAfterEnter": onAfterEnter,
+          "onAfterLeave": onAfterLeave,
+          "appear": true
+        }, polyTransitionBindProps.value), {
+          default: () => [_withDirectives(_createVNode("div", _mergeProps({
+            "class": {
+              'y-layer__content': true,
+              ...computedContentClasses.value
+            },
+            "style": [{
+              ...dimensionStyles.value,
+              ...coordinateStyles.value,
+              ...props.contentStyles
+            }]
+          }, contentEvents.value, {
+            "ref": content$
+          }), [slots.default?.({
+            active: active.value
+          })]), [[_vShow, active.value], [_resolveDirective("complement-click"), {
+            ...complementClickOption
+          }]])]
+        })])]
+      })]);
+    });
+    return {
+      complementClickOption,
+      layerGroup,
+      active,
+      finish,
+      rendered,
+      lazyValue,
+      onAfterUpdate: onAfterUpdate,
+      scrim$,
+      content$,
+      base$,
+      baseEl,
+      baseFromSlotEl,
+      polyTransitionBindProps,
+      coordinateStyles,
+      layerGroupState,
+      getActiveLayers
+    };
+  }
+});
+//# sourceMappingURL=YLayer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"YLayer.js","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","maximized","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 {\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    maximized: {\r\n      type: Boolean as PropType<boolean>,\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    const scrim$ = ref<HTMLElement>();\r\n    const content$ = ref<HTMLElement>();\r\n    const root$ = ref<HTMLElement>();\r\n    const model = useModelDuplex(props);\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    // Frags\r\n    const { base, base$, baseEl, baseSlot, baseFromSlotEl } = useBase(props);\r\n    const { contentEvents } = useContent(props, active);\r\n    const { themeClasses } = useLocalTheme(props);\r\n    const { layerGroup, layerGroupState, getActiveLayers } = useLayerGroup(props);\r\n    const { polyTransitionBindProps } = usePolyTransition(props);\r\n    const { dimensionStyles } = useDimension(props);\r\n\r\n    const { lazyValue, onAfterUpdate } = useLazy(toRef(props, 'eager'), active);\r\n    // States\r\n    const finish = shallowRef(false);\r\n    const hovered = ref(false);\r\n    const focused = ref(false);\r\n    const disabled = toRef(props, 'disabled');\r\n    const maximized = toRef(props, 'maximized');\r\n\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          ...(props.baseProps ?? {}),\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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"}

package/lib/components/layer/active-delay.js

@@ -0,0 +1,28 @@
+export function useDelay(props, callback) {
+  const state = {};
+  function clearDelay(propKey) {
+    state[propKey] && window.clearTimeout(state[propKey]);
+    delete state[propKey];
+  }
+  function setDelay(propKey, timeout, resolve) {
+    state[propKey] = window.setTimeout(() => {
+      const active = propKey === 'openDelay';
+      callback?.(active);
+      resolve(active);
+    }, timeout);
+  }
+  const generateDelay = propKey => () => {
+    clearDelay('openDelay');
+    clearDelay('closeDelay');
+    const delayTime = props[propKey] ?? 0;
+    return new Promise(resolve => {
+      const delay = parseInt(String(delayTime), 10);
+      setDelay(propKey, delay, resolve);
+    });
+  };
+  return {
+    startOpenDelay: generateDelay('openDelay'),
+    startCloseDelay: generateDelay('closeDelay')
+  };
+}
+//# sourceMappingURL=active-delay.js.map

package/lib/components/layer/active-delay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"active-delay.js","names":["useDelay","props","callback","state","clearDelay","propKey","window","clearTimeout","setDelay","timeout","resolve","setTimeout","active","generateDelay","delayTime","Promise","delay","parseInt","String","startOpenDelay","startCloseDelay"],"sources":["../../../src/components/layer/active-delay.ts"],"sourcesContent":["type DelayType = 'closeDelay' | 'openDelay';\n\nexport function useDelay(props: any, callback?: (active: boolean) => void) {\n  const state: Partial<Record<DelayType, number>> = {};\n\n  function clearDelay(propKey: DelayType) {\n    state[propKey] && window.clearTimeout(state[propKey]);\n    delete state[propKey];\n  }\n\n  function setDelay(propKey: DelayType, timeout: number, resolve: any) {\n    state[propKey] = window.setTimeout(() => {\n      const active = propKey === 'openDelay';\n      callback?.(active);\n      resolve(active);\n    }, timeout);\n  }\n\n  const generateDelay = (propKey: DelayType) => () => {\n    clearDelay('openDelay');\n    clearDelay('closeDelay');\n    const delayTime = props[propKey] ?? 0;\n    return new Promise<boolean>((resolve) => {\n      const delay = parseInt(String(delayTime), 10);\n      setDelay(propKey, delay, resolve);\n    });\n  };\n\n  return {\n    startOpenDelay: generateDelay('openDelay'),\n    startCloseDelay: generateDelay('closeDelay'),\n  };\n}\n"],"mappings":"AAEA,OAAO,SAASA,QAAQA,CAACC,KAAU,EAAEC,QAAoC,EAAE;EACzE,MAAMC,KAAyC,GAAG,CAAC,CAAC;EAEpD,SAASC,UAAUA,CAACC,OAAkB,EAAE;IACtCF,KAAK,CAACE,OAAO,CAAC,IAAIC,MAAM,CAACC,YAAY,CAACJ,KAAK,CAACE,OAAO,CAAC,CAAC;IACrD,OAAOF,KAAK,CAACE,OAAO,CAAC;EACvB;EAEA,SAASG,QAAQA,CAACH,OAAkB,EAAEI,OAAe,EAAEC,OAAY,EAAE;IACnEP,KAAK,CAACE,OAAO,CAAC,GAAGC,MAAM,CAACK,UAAU,CAAC,MAAM;MACvC,MAAMC,MAAM,GAAGP,OAAO,KAAK,WAAW;MACtCH,QAAQ,GAAGU,MAAM,CAAC;MAClBF,OAAO,CAACE,MAAM,CAAC;IACjB,CAAC,EAAEH,OAAO,CAAC;EACb;EAEA,MAAMI,aAAa,GAAIR,OAAkB,IAAK,MAAM;IAClDD,UAAU,CAAC,WAAW,CAAC;IACvBA,UAAU,CAAC,YAAY,CAAC;IACxB,MAAMU,SAAS,GAAGb,KAAK,CAACI,OAAO,CAAC,IAAI,CAAC;IACrC,OAAO,IAAIU,OAAO,CAAWL,OAAO,IAAK;MACvC,MAAMM,KAAK,GAAGC,QAAQ,CAACC,MAAM,CAACJ,SAAS,CAAC,EAAE,EAAE,CAAC;MAC7CN,QAAQ,CAACH,OAAO,EAAEW,KAAK,EAAEN,OAAO,CAAC;IACnC,CAAC,CAAC;EACJ,CAAC;EAED,OAAO;IACLS,cAAc,EAAEN,aAAa,CAAC,WAAW,CAAC;IAC1CO,eAAe,EAAEP,aAAa,CAAC,YAAY;EAC7C,CAAC;AACH"}

package/lib/components/layer/active-stack.js

@@ -0,0 +1,52 @@
+import { getCurrentInstance, inject, provide, shallowRef, watch, watchPostEffect } from 'vue';
+export const YUYEON_ACTIVE_STACK_KEY = Symbol.for('yuyeon.active-stack');
+export function useActiveStack($el, active, sequential) {
+  const parent = inject(YUYEON_ACTIVE_STACK_KEY, null);
+  const children = shallowRef([]);
+  const vm = getCurrentInstance();
+  function push(instance) {
+    children.value.push(instance);
+  }
+  function pop(instance) {
+    if (instance) {
+      const index = children.value.findIndex(child => child === instance);
+      if (index > -1) {
+        children.value.splice(index, 1);
+        return;
+      }
+    }
+    children.value.pop();
+  }
+  function clear() {
+    if ($el.value?.modal) return;
+    active.value = false;
+    const bubble = () => {
+      if (children.value.length === 0) {
+        parent?.clear();
+      }
+    };
+    if (!sequential?.value) {
+      watchPostEffect(bubble);
+    }
+  }
+  watch(active, neo => {
+    if (neo) {
+      parent?.push(vm);
+    } else {
+      parent?.pop(vm);
+    }
+  });
+  provide(YUYEON_ACTIVE_STACK_KEY, {
+    push,
+    pop,
+    clear,
+    $el
+  });
+  return {
+    push,
+    pop,
+    parent,
+    children
+  };
+}
+//# sourceMappingURL=active-stack.js.map

package/lib/components/layer/active-stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"active-stack.js","names":["getCurrentInstance","inject","provide","shallowRef","watch","watchPostEffect","YUYEON_ACTIVE_STACK_KEY","Symbol","for","useActiveStack","$el","active","sequential","parent","children","vm","push","instance","value","pop","index","findIndex","child","splice","clear","modal","bubble","length","neo"],"sources":["../../../src/components/layer/active-stack.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue';\r\nimport {\r\n  getCurrentInstance,\r\n  inject,\r\n  provide,\r\n  shallowRef,\r\n  watch,\r\n  watchPostEffect,\r\n} from 'vue';\r\n\r\nimport { YLayer } from './YLayer';\r\n\r\nexport interface ActiveStackProvide {\r\n  push: (instance: any) => void;\r\n  pop: (instance?: any) => void;\r\n  clear: () => void;\r\n  $el: Ref<typeof YLayer | undefined>;\r\n}\r\n\r\nexport const YUYEON_ACTIVE_STACK_KEY: InjectionKey<ActiveStackProvide> =\r\n  Symbol.for('yuyeon.active-stack');\r\n\r\nexport function useActiveStack(\r\n  $el: Ref<typeof YLayer | undefined>,\r\n  active: Ref<boolean>,\r\n  sequential?: Ref<boolean | undefined>,\r\n) {\r\n  const parent = inject(YUYEON_ACTIVE_STACK_KEY, null);\r\n  const children = shallowRef<any[]>([]);\r\n  const vm = getCurrentInstance();\r\n\r\n  function push(instance: any) {\r\n    children.value.push(instance);\r\n  }\r\n\r\n  function pop(instance?: any) {\r\n    if (instance) {\r\n      const index = children.value.findIndex((child) => child === instance);\r\n      if (index > -1) {\r\n        children.value.splice(index, 1);\r\n        return;\r\n      }\r\n    }\r\n    children.value.pop();\r\n  }\r\n\r\n  function clear() {\r\n    if ($el.value?.modal) return;\r\n    active.value = false;\r\n    const bubble = () => {\r\n      if (children.value.length === 0) {\r\n        parent?.clear();\r\n      }\r\n    };\r\n    if (!sequential?.value) {\r\n      watchPostEffect(bubble);\r\n    }\r\n  }\r\n\r\n  watch(active, (neo) => {\r\n    if (neo) {\r\n      parent?.push(vm);\r\n    } else {\r\n      parent?.pop(vm);\r\n    }\r\n  });\r\n\r\n  provide(YUYEON_ACTIVE_STACK_KEY, {\r\n    push,\r\n    pop,\r\n    clear,\r\n    $el,\r\n  });\r\n\r\n  return {\r\n    push,\r\n    pop,\r\n    parent,\r\n    children,\r\n  };\r\n}\r\n"],"mappings":"AACA,SACEA,kBAAkB,EAClBC,MAAM,EACNC,OAAO,EACPC,UAAU,EACVC,KAAK,EACLC,eAAe,QACV,KAAK;AAWZ,OAAO,MAAMC,uBAAyD,GACpEC,MAAM,CAACC,GAAG,CAAC,qBAAqB,CAAC;AAEnC,OAAO,SAASC,cAAcA,CAC5BC,GAAmC,EACnCC,MAAoB,EACpBC,UAAqC,EACrC;EACA,MAAMC,MAAM,GAAGZ,MAAM,CAACK,uBAAuB,EAAE,IAAI,CAAC;EACpD,MAAMQ,QAAQ,GAAGX,UAAU,CAAQ,EAAE,CAAC;EACtC,MAAMY,EAAE,GAAGf,kBAAkB,CAAC,CAAC;EAE/B,SAASgB,IAAIA,CAACC,QAAa,EAAE;IAC3BH,QAAQ,CAACI,KAAK,CAACF,IAAI,CAACC,QAAQ,CAAC;EAC/B;EAEA,SAASE,GAAGA,CAACF,QAAc,EAAE;IAC3B,IAAIA,QAAQ,EAAE;MACZ,MAAMG,KAAK,GAAGN,QAAQ,CAACI,KAAK,CAACG,SAAS,CAAEC,KAAK,IAAKA,KAAK,KAAKL,QAAQ,CAAC;MACrE,IAAIG,KAAK,GAAG,CAAC,CAAC,EAAE;QACdN,QAAQ,CAACI,KAAK,CAACK,MAAM,CAACH,KAAK,EAAE,CAAC,CAAC;QAC/B;MACF;IACF;IACAN,QAAQ,CAACI,KAAK,CAACC,GAAG,CAAC,CAAC;EACtB;EAEA,SAASK,KAAKA,CAAA,EAAG;IACf,IAAId,GAAG,CAACQ,KAAK,EAAEO,KAAK,EAAE;IACtBd,MAAM,CAACO,KAAK,GAAG,KAAK;IACpB,MAAMQ,MAAM,GAAGA,CAAA,KAAM;MACnB,IAAIZ,QAAQ,CAACI,KAAK,CAACS,MAAM,KAAK,CAAC,EAAE;QAC/Bd,MAAM,EAAEW,KAAK,CAAC,CAAC;MACjB;IACF,CAAC;IACD,IAAI,CAACZ,UAAU,EAAEM,KAAK,EAAE;MACtBb,eAAe,CAACqB,MAAM,CAAC;IACzB;EACF;EAEAtB,KAAK,CAACO,MAAM,EAAGiB,GAAG,IAAK;IACrB,IAAIA,GAAG,EAAE;MACPf,MAAM,EAAEG,IAAI,CAACD,EAAE,CAAC;IAClB,CAAC,MAAM;MACLF,MAAM,EAAEM,GAAG,CAACJ,EAAE,CAAC;IACjB;EACF,CAAC,CAAC;EAEFb,OAAO,CAACI,uBAAuB,EAAE;IAC/BU,IAAI;IACJG,GAAG;IACHK,KAAK;IACLd;EACF,CAAC,CAAC;EAEF,OAAO;IACLM,IAAI;IACJG,GAAG;IACHN,MAAM;IACNC;EACF,CAAC;AACH"}

package/lib/components/layer/base.js

@@ -0,0 +1,87 @@
+import { computed, getCurrentInstance, ref, watchEffect } from 'vue';
+import { propsFactory } from "../../util/component/index.js";
+export const pressBasePropsOptions = propsFactory({
+  base: [String, Object, Array],
+  baseProps: Object
+}, 'YLayer.base');
+export function useBase(props) {
+  const vm = getCurrentInstance();
+  const base$ = ref();
+  const baseSlot = ref();
+  const baseEl = ref();
+  const baseFromSlotEl = computed(() => {
+    const el = baseSlot.value?.[0]?.el;
+    if (el && el.nodeType === Node.ELEMENT_NODE) {
+      return el;
+    }
+    return undefined;
+  });
+  const base = computed(() => {
+    if (baseEl.value && !props.base) {
+      return baseEl.value;
+    }
+    return getBase(props.base, vm);
+  });
+  watchEffect(() => {
+    if (!base$.value) {
+      if (!baseFromSlotEl.value && props.base && !Array.isArray(props.base)) {
+        baseEl.value = base.value;
+        return;
+      }
+      baseEl.value = baseFromSlotEl.value;
+      return;
+    }
+    let toEl = base$.value;
+    if (toEl.baseEl) {
+      toEl = toEl.baseEl;
+    }
+    if (base$.value?.$el) {
+      if (base$.value.$el.nodeType === Node.ELEMENT_NODE) {
+        toEl = base$.value.$el;
+      }
+    }
+    if (toEl?.nodeType !== Node.ELEMENT_NODE) {
+      toEl = baseFromSlotEl.value;
+    }
+    baseEl.value = toEl;
+  }, {
+    flush: 'post'
+  });
+  return {
+    base$,
+    baseEl,
+    baseSlot,
+    base,
+    baseFromSlotEl
+  };
+}
+function getBase(selector, vm) {
+  if (!selector) return;
+  let ret;
+  if (selector === 'parent') {
+    let el = vm?.proxy?.$el?.parentNode;
+    let parentEl = el;
+    while (el) {
+      if (el?.hasAttribute('data-base-parent')) {
+        parentEl = el;
+        break;
+      }
+      el = el.parentNode;
+    }
+    ret = parentEl;
+  }
+  // Selector
+  else if (typeof selector === 'string') {
+    ret = document.querySelector(selector);
+  }
+  // Component
+  else if ('$el' in selector) {
+    ret = selector.$el;
+  }
+  // HTMLElement | Element | [x, y]
+  else {
+    ret = selector;
+  }
+  return ret;
+}
+//# sourceMappingURL=base.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","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/layer/content.js

@@ -0,0 +1,22 @@
+import { computed } from 'vue';
+import { propsFactory } from "../../util/component/index.js";
+export const pressContentPropsOptions = propsFactory({
+  closeClickContent: {
+    type: Boolean
+  }
+}, 'YLayer.content');
+export function useContent(props, active) {
+  const contentEvents = computed(() => {
+    const events = {};
+    if (props.closeClickContent) {
+      events.onClick = e => {
+        active.value = false;
+      };
+    }
+    return events;
+  });
+  return {
+    contentEvents
+  };
+}
+//# sourceMappingURL=content.js.map

package/lib/components/layer/content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content.js","names":["computed","propsFactory","pressContentPropsOptions","closeClickContent","type","Boolean","useContent","props","active","contentEvents","events","onClick","e","value"],"sources":["../../../src/components/layer/content.ts"],"sourcesContent":["import { type PropType, type Ref, computed } from 'vue';\r\n\r\nimport { propsFactory } from '@/util/component';\r\n\r\nexport const pressContentPropsOptions = propsFactory(\r\n  {\r\n    closeClickContent: {\r\n      type: Boolean as PropType<boolean>,\r\n    },\r\n  },\r\n  'YLayer.content',\r\n);\r\n\r\ninterface ContentProps {\r\n  closeClickContent: boolean | undefined;\r\n}\r\n\r\nexport function useContent(props: ContentProps, active: Ref<boolean>) {\r\n  const contentEvents = computed(() => {\r\n    const events: Record<string, EventListener> = {};\r\n\r\n    if (props.closeClickContent) {\r\n      events.onClick = (e: Event) => {\r\n        active.value = false;\r\n      };\r\n    }\r\n\r\n    return events;\r\n  });\r\n\r\n  return {\r\n    contentEvents,\r\n  };\r\n}\r\n"],"mappings":"AAAA,SAAkCA,QAAQ,QAAQ,KAAK;AAAC,SAE/CC,YAAY;AAErB,OAAO,MAAMC,wBAAwB,GAAGD,YAAY,CAClD;EACEE,iBAAiB,EAAE;IACjBC,IAAI,EAAEC;EACR;AACF,CAAC,EACD,gBACF,CAAC;AAMD,OAAO,SAASC,UAAUA,CAACC,KAAmB,EAAEC,MAAoB,EAAE;EACpE,MAAMC,aAAa,GAAGT,QAAQ,CAAC,MAAM;IACnC,MAAMU,MAAqC,GAAG,CAAC,CAAC;IAEhD,IAAIH,KAAK,CAACJ,iBAAiB,EAAE;MAC3BO,MAAM,CAACC,OAAO,GAAIC,CAAQ,IAAK;QAC7BJ,MAAM,CAACK,KAAK,GAAG,KAAK;MACtB,CAAC;IACH;IAEA,OAAOH,MAAM;EACf,CAAC,CAAC;EAEF,OAAO;IACLD;EACF,CAAC;AACH"}

package/lib/components/layer/index.js

@@ -0,0 +1,2 @@
+export * from "./YLayer.js";
+//# sourceMappingURL=index.js.map

package/lib/components/layer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/layer/index.ts"],"sourcesContent":["export * from './YLayer';\n"],"mappings":""}