yuyeon 0.0.23 → 0.0.25

package/lib/components/input/YInput.scss

@@ -1,245 +1,256 @@
-
-@use '../../styles/palette';
-@use '../../styles/variables';
-
-$input-border-radius: variables.$border-radius-root !default;
-
-.y-input {
-  font-size: 14px;
-  flex: 1 1 auto;
-  display: flex;
-  align-items: flex-start;
-  letter-spacing: normal;
-  text-align: left;
-
-  --y-input-focused-color: var(--y-theme-primary);
-
-  &__prepend,
-  &__append {
-    height: 100%;
-  }
-
-  &__stack {
-    display: flex;
-    flex-direction: column;
-    height: 100%; // auto
-    flex: 1;
-    flex-wrap: wrap;
-    min-width: 0;
-    width: 100%;
-  }
-
-  &__display {
-    display: flex;
-    position: relative;
-    cursor: text;
-    flex: 1 1 auto;
-    border-radius: $input-border-radius;
-  }
-
-  &__plate {
-    position: absolute;
-    inset: 0;
-    border-bottom: 1px solid transparent;
-    contain: paint;
-    border-radius: $input-border-radius;
-    outline: 0 solid rgba(0, 0, 0, 0);
-    transition: 140ms ease;
-  }
-
-  &__value {
-    position: relative;
-    flex: 1 0 auto;
-    padding: 0.5rem 0.875rem;
-    display: flex;
-    align-items: center;
-    line-height: 1em;
-  }
-
-  &__helper-text {
-    font-size: 14px;
-    font-weight: 320;
-    color: #444;
-  }
-
-  @keyframes label-float {
-    0% {
-      opacity: 0;
-    }
-    100% {
-      opacity: 1;
-      transform: translateY(-26px) scale(0.74);
-    }
-  }
-
-  @keyframes label-sink {
-    0% {
-      opacity: 1;
-      transform: translateY(-26px) scale(0.74);
-    }
-    30% {
-      opacity: 0;
-    }
-    80% {
-      opacity: 0;
-      transform: translateY(-8px) scale(1);
-    }
-    100% {
-      opacity: 1;
-      transform: translateY(0) scale(1);
-    }
-  }
-
-  &__label {
-    position: absolute;
-    color: #5e5e5e;
-    max-width: 90%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    pointer-events: none;
-    left: 0;
-    top: 6px;
-    transform-origin: left center;
-
-    &--floated {
-      animation: label-float 200ms ease-in-out forwards;
-    }
-
-    &:not(&--floated) {
-      animation: label-sink 200ms linear;
-    }
-  }
-
-  &__leading {
-    position: relative;
-    display: inline-flex;
-    margin-top: 10px;
-    padding-right: 4px;
-    align-self: flex-start;
-
-    > * {
-      width: 24px;
-      height: 24px;
-      user-select: none;
-    }
-  }
-
-  &__trailing {
-    position: relative;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-  }
-
-  &--labeled {
-    padding-top: 12px;
-    margin-top: 4px;
-  }
-
-  &--filled {
-    --y-input-default-filled: 242, 242, 242;
-    --y-input-filled-opacity: 0.04;
-    --y-input-filled-opacity-hover: 0.08;
-
-    .y-input {
-      &__prepend {
-        padding-left: 12px;
-      }
-      //
-      &__plate {
-        background: rgba(var(--y-theme-on-surface-rgb, var(--y-input-default-filled)), var(--y-input-filled-opacity));
-      }
-
-      &__display:hover {
-        --y-input-filled-opacity: var(--y-input-filled-opacity-hover);
-      }
-    }
-  }
-
-  &--outlined {
-    --y-input-outlined-opacity: 0.64;
-    --y-input-outlined-opacity-hover: 0.87;
-
-    .y-input {
-      &__plate {
-        border: 1px solid rgba(var(--y-theme-outline-rgb), var(--y-input-outlined-opacity));
-        box-sizing: border-box;
-        inset: 0;
-
-        &:before {
-          top: 0;
-          height: 100%;
-          background: transparent;
-          border-radius: inherit;
-        }
-      }
-
-      &__display:hover {
-        --y-input-outlined-opacity: var(--y-input-outlined-opacity-hover);
-      }
-    }
-  }
-
-  &--ceramic {
-    .y-input__plate {
-      border: 1px solid #e4e4e4;
-      box-sizing: border-box;
-      inset: 0;
-      border-top-color: transparent;
-      border-left-width: 0;
-      border-right-width: 0;
-      box-shadow: 1px 2px 8px -1px rgb(0 0 0 / 12%), -1px -1px 2px 1px rgba(0, 0, 0, 0.04),
-        inset 1px 1px 8px -4px rgb(0 0 0 / 11%);
-      outline: 0 solid rgba(0, 0, 0, 0);
-    }
-
-    .y-input__plate:before {
-      inset: -1px;
-      height: 100%;
-      background: transparent;
-      border-radius: inherit;
-    }
-  }
-
-  &--focused {
-    .y-input__value {
-      outline: none;
-    }
-
-    .y-input__plate {
-      outline: 1px solid rgba(var(--y-theme-primary, #4f97dc), 0.1);
-      border-color: var(--y-input-focused-color);
-    }
-
-    .y-input__leading {
-      color: currentColor;
-    }
-
-    &.y-input--outlined {
-      //
-    }
-  }
-
-  &--error {
-    &.y-input--outlined {
-      .y-input__plate {
-        border-color: var(--y-palette-negative) !important;
-      }
-    }
-    .y-input__helper-text {
-      color: var(--y-palette-negative);
-    }
-  }
-
-  &--success {
-    &.y-input--outlined {
-      .y-input__plate {
-        border-color: var(--y-palette-positive) !important;
-      }
-    }
-    .y-input__helper-text {
-      color: var(--y-palette-positive);
-    }
-  }
-}
+
+@use '../../styles/palette';
+@use '../../styles/variables';
+
+$input-border-radius: variables.$border-radius-root !default;
+
+.y-input {
+  font-size: 14px;
+  flex: 1 1 auto;
+  display: flex;
+  align-items: flex-start;
+  letter-spacing: normal;
+  text-align: left;
+
+  --y-input-focused-color: var(--y-theme-primary);
+  --y-input-label-color: var(--y-theme-on-surface-variant);
+
+  &__prepend,
+  &__append {
+    height: 100%;
+  }
+
+  &__stack {
+    display: flex;
+    flex-direction: column;
+    height: 100%; // auto
+    flex: 1;
+    flex-wrap: wrap;
+    min-width: 0;
+    width: 100%;
+  }
+
+  &__display {
+    display: flex;
+    position: relative;
+    cursor: text;
+    flex: 1 1 auto;
+    border-radius: $input-border-radius;
+  }
+
+  &__plate {
+    position: absolute;
+    inset: 0;
+    border-bottom: 1px solid transparent;
+    contain: paint;
+    border-radius: $input-border-radius;
+    outline: 0 solid rgba(0, 0, 0, 0);
+    transition: 140ms ease;
+  }
+
+  &__value {
+    position: relative;
+    flex: 1 0 auto;
+    padding: 0.5rem 0.875rem;
+    display: flex;
+    align-items: center;
+    line-height: 1em;
+  }
+
+  &__helper-text {
+    font-size: 14px;
+    font-weight: 320;
+    color: #444;
+  }
+
+  @keyframes label-float {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+      transform: translateY(-26px) scale(0.94);
+    }
+  }
+
+  @keyframes label-sink {
+    0% {
+      opacity: 1;
+      transform: translateY(-26px) scale(0.74);
+    }
+    30% {
+      opacity: 0;
+    }
+    80% {
+      opacity: 0;
+      transform: translateY(-8px) scale(1);
+    }
+    100% {
+      opacity: 1;
+      transform: translateY(0) scale(1);
+    }
+  }
+
+  &__label {
+    color: var(--y-input-label-color);
+    padding-bottom: 4px;
+    font-weight: 500;
+  }
+
+  &__floating-label {
+    position: absolute;
+    max-width: 90%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    pointer-events: none;
+    padding-bottom: unset;
+    left: 0;
+    top: 6px;
+    transform-origin: left center;
+
+    &--floated {
+      animation: label-float 200ms ease-in-out forwards;
+    }
+
+    &:not(&--floated) {
+      animation: label-sink 200ms linear;
+    }
+  }
+
+  &__leading {
+    position: relative;
+    display: inline-flex;
+    margin-top: 10px;
+    padding-right: 4px;
+    align-self: flex-start;
+
+    > * {
+      width: 24px;
+      height: 24px;
+      user-select: none;
+    }
+  }
+
+  &__required-mark {
+    color: var(--y-theme-error);
+  }
+
+  &__trailing {
+    position: relative;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  &--labeled {
+    padding-top: 12px;
+    margin-top: 4px;
+  }
+
+  &--filled {
+    --y-input-default-filled: 242, 242, 242;
+    --y-input-filled-opacity: 0.04;
+    --y-input-filled-opacity-hover: 0.08;
+
+    .y-input {
+      &__prepend {
+        padding-left: 12px;
+      }
+      //
+      &__plate {
+        background: rgba(var(--y-theme-on-surface-rgb, var(--y-input-default-filled)), var(--y-input-filled-opacity));
+      }
+
+      &__display:hover {
+        --y-input-filled-opacity: var(--y-input-filled-opacity-hover);
+      }
+    }
+  }
+
+  &--outlined {
+    --y-input-outlined-opacity: 0.64;
+    --y-input-outlined-opacity-hover: 0.87;
+
+    .y-input {
+      &__plate {
+        border: 1px solid rgba(var(--y-theme-outline-rgb), var(--y-input-outlined-opacity));
+        box-sizing: border-box;
+        inset: 0;
+
+        &:before {
+          top: 0;
+          height: 100%;
+          background: transparent;
+          border-radius: inherit;
+        }
+      }
+
+      &__display:hover {
+        --y-input-outlined-opacity: var(--y-input-outlined-opacity-hover);
+      }
+    }
+  }
+
+  &--ceramic {
+    .y-input__plate {
+      border: 1px solid #e4e4e4;
+      box-sizing: border-box;
+      inset: 0;
+      border-top-color: transparent;
+      border-left-width: 0;
+      border-right-width: 0;
+      box-shadow: 1px 2px 8px -1px rgb(0 0 0 / 12%), -1px -1px 2px 1px rgba(0, 0, 0, 0.04),
+        inset 1px 1px 8px -4px rgb(0 0 0 / 11%);
+      outline: 0 solid rgba(0, 0, 0, 0);
+    }
+
+    .y-input__plate:before {
+      inset: -1px;
+      height: 100%;
+      background: transparent;
+      border-radius: inherit;
+    }
+  }
+
+  &--focused {
+    .y-input__value {
+      outline: none;
+    }
+
+    .y-input__plate {
+      outline: 1px solid rgba(var(--y-theme-primary, #4f97dc), 0.1);
+      border-color: var(--y-input-focused-color);
+    }
+
+    .y-input__leading {
+      color: currentColor;
+    }
+
+    &.y-input--outlined {
+      //
+    }
+  }
+
+  &--error {
+    &.y-input--outlined {
+      .y-input__plate {
+        border-color: var(--y-palette-negative) !important;
+      }
+    }
+    .y-input__helper-text {
+      color: var(--y-palette-negative);
+    }
+  }
+
+  &--success {
+    &.y-input--outlined {
+      .y-input__plate {
+        border-color: var(--y-palette-positive) !important;
+      }
+    }
+    .y-input__helper-text {
+      color: var(--y-palette-positive);
+    }
+  }
+}

package/lib/components/layer/YLayer.mjs

@@ -109,7 +109,7 @@ export const YLayer = defineComponent({
     const {
       lazyValue,
       onAfterUpdate
-    } = useLazy(!!toRef(props, 'eager'), active);
+    } = useLazy(toRef(props, 'eager'), active);
     const rendered = computed(() => !disabled.value && (lazyValue.value || active.value));
     const {
       coordinate,

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

@@ -1 +1 @@
-{"version":3,"file":"YLayer.mjs","names":["Teleport","Transition","computed","defineComponent","mergeProps","reactive","ref","shallowRef","toRef","watchEffect","useRender","pressCoordinateProps","useCoordinate","pressDimensionPropsOptions","useDimension","useLayerGroup","pressThemePropsOptions","useLocalTheme","useLazy","PolyTransition","polyTransitionPropOptions","usePolyTransition","ComplementClick","bindClasses","propsFactory","pressYLayerProps","modelValue","type","Boolean","scrim","eager","classes","Array","String","Object","contentClasses","closeClickScrim","modal","contentStyles","default","disabled","openOnHover","openDelay","Number","closeDelay","YLayer","name","inheritAttrs","components","directives","props","emits","value","mouseEvent","afterLeave","setup","_ref","emit","expose","attrs","slots","base$","scrim$","content$","baseSlot","baseEl","themeClasses","layerGroup","polyTransitionBindProps","dimensionStyles","active","get","set","v","finish","lazyValue","onAfterUpdate","rendered","coordinate","coordinateStyles","updateCoordinate","contentEl","onClickComplementLayer","target","closeConditional","hovered","complementClickOption","handler","determine","include","onAfterEnter","onAfterLeave","onClickScrim","baseFromSlotEl","el","base","$el","computedStyle","zIndex","computedClass","boundClasses","computedContentClasses","onMouseenter","event","onMouseleave","slotBase","class","_createVNode","_Fragment","_mergeProps","_withDirectives","_vShow","_resolveDirective"],"sources":["../../../src/components/layer/YLayer.tsx"],"sourcesContent":["import type { CSSProperties, PropType } from 'vue';\r\nimport {\r\n  Teleport,\r\n  Transition,\r\n  computed,\r\n  defineComponent,\r\n  mergeProps,\r\n  reactive,\r\n  ref,\r\n  shallowRef,\r\n  toRef,\r\n  watchEffect,\r\n} from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport {\r\n  pressCoordinateProps,\r\n  useCoordinate,\r\n} 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  polyTransitionPropOptions,\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, propsFactory } from '../../util/vue-component';\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    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    modal: Boolean as PropType<boolean>,\r\n    contentStyles: {\r\n      type: Object as PropType<CSSProperties>,\r\n      default: () => {},\r\n    },\r\n    disabled: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: false,\r\n    },\r\n    openOnHover: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: false,\r\n    },\r\n    openDelay: {\r\n      type: Number as PropType<number>,\r\n      default: 200,\r\n    },\r\n    closeDelay: {\r\n      type: Number as PropType<number>,\r\n      default: 200,\r\n    },\r\n    ...pressThemePropsOptions(),\r\n    ...polyTransitionPropOptions,\r\n    ...pressCoordinateProps(),\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    ...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  setup(props, { emit, expose, attrs, slots }) {\r\n    const base$ = ref();\r\n    const scrim$ = ref<HTMLElement>();\r\n    const content$ = ref<HTMLElement>();\r\n    const baseSlot = ref();\r\n    const baseEl = ref<HTMLElement>();\r\n\r\n    const { themeClasses } = useLocalTheme(props);\r\n    const { layerGroup } = useLayerGroup();\r\n    const { polyTransitionBindProps } = usePolyTransition(props);\r\n    const { dimensionStyles } = useDimension(props);\r\n    const active = computed<boolean>({\r\n      get: (): boolean => {\r\n        return !!props.modelValue;\r\n      },\r\n      set: (v: boolean) => {\r\n        emit('update:modelValue', v);\r\n      },\r\n    });\r\n    const finish = shallowRef(false);\r\n\r\n    const disabled = toRef(props, 'disabled');\r\n    const { lazyValue, onAfterUpdate } = useLazy(\r\n      !!toRef(props, 'eager'),\r\n      active,\r\n    );\r\n    const rendered = computed<boolean>(\r\n      () => !disabled.value && (lazyValue.value || active.value),\r\n    );\r\n\r\n    const { coordinate, coordinateStyles, updateCoordinate } = useCoordinate(\r\n      props,\r\n      { contentEl: content$, baseEl, active },\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      ); // 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    const baseFromSlotEl = computed(() => {\r\n      return baseSlot.value?.[0]?.el;\r\n    });\r\n\r\n    watchEffect(() => {\r\n      if (!base$.value) {\r\n        baseEl.value = baseFromSlotEl.value;\r\n        return;\r\n      }\r\n      const base = base$.value;\r\n      baseEl.value = base$.value?.$el ? base$.value?.$el : base;\r\n    });\r\n\r\n    const computedStyle = computed(() => {\r\n      return {\r\n        zIndex: '2000',\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    const hovered = ref(false);\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    expose({\r\n      scrim$,\r\n      base$,\r\n      content$,\r\n      baseEl,\r\n      active,\r\n      onAfterUpdate,\r\n      updateCoordinate,\r\n      hovered,\r\n    });\r\n\r\n    useRender(() => {\r\n      const slotBase = slots.base?.({\r\n        active: active.value,\r\n        props: mergeProps({\r\n          ref: base$,\r\n          class: {\r\n            'y-layer-base': true,\r\n            'y-layer-base--active': active.value,\r\n          },\r\n        }),\r\n      });\r\n      baseSlot.value = slotBase;\r\n      return (\r\n        <>\r\n          {slotBase}\r\n          <Teleport disabled={!layerGroup.value} to={layerGroup.value as any}>\r\n            {rendered.value && (\r\n              <div\r\n                class={{\r\n                  'y-layer': true,\r\n                  'y-layer--finish': finish.value,\r\n                  ...computedClass.value,\r\n                  [themeClasses.value ?? '']: true,\r\n                }}\r\n                onMouseenter={onMouseenter}\r\n                onMouseleave={onMouseleave}\r\n                style={computedStyle.value}\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                      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                    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      rendered,\r\n      lazyValue,\r\n      onAfterUpdate: onAfterUpdate as () => void,\r\n      scrim$,\r\n      content$,\r\n      baseEl,\r\n      polyTransitionBindProps,\r\n      coordinateStyles,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YLayer = InstanceType<typeof YLayer>;\r\n"],"mappings":"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"}
+{"version":3,"file":"YLayer.mjs","names":["Teleport","Transition","computed","defineComponent","mergeProps","reactive","ref","shallowRef","toRef","watchEffect","useRender","pressCoordinateProps","useCoordinate","pressDimensionPropsOptions","useDimension","useLayerGroup","pressThemePropsOptions","useLocalTheme","useLazy","PolyTransition","polyTransitionPropOptions","usePolyTransition","ComplementClick","bindClasses","propsFactory","pressYLayerProps","modelValue","type","Boolean","scrim","eager","classes","Array","String","Object","contentClasses","closeClickScrim","modal","contentStyles","default","disabled","openOnHover","openDelay","Number","closeDelay","YLayer","name","inheritAttrs","components","directives","props","emits","value","mouseEvent","afterLeave","setup","_ref","emit","expose","attrs","slots","base$","scrim$","content$","baseSlot","baseEl","themeClasses","layerGroup","polyTransitionBindProps","dimensionStyles","active","get","set","v","finish","lazyValue","onAfterUpdate","rendered","coordinate","coordinateStyles","updateCoordinate","contentEl","onClickComplementLayer","target","closeConditional","hovered","complementClickOption","handler","determine","include","onAfterEnter","onAfterLeave","onClickScrim","baseFromSlotEl","el","base","$el","computedStyle","zIndex","computedClass","boundClasses","computedContentClasses","onMouseenter","event","onMouseleave","slotBase","class","_createVNode","_Fragment","_mergeProps","_withDirectives","_vShow","_resolveDirective"],"sources":["../../../src/components/layer/YLayer.tsx"],"sourcesContent":["import type { CSSProperties, PropType } from 'vue';\r\nimport {\r\n  Teleport,\r\n  Transition,\r\n  computed,\r\n  defineComponent,\r\n  mergeProps,\r\n  reactive,\r\n  ref,\r\n  shallowRef,\r\n  toRef,\r\n  watchEffect, watch,\r\n} from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport {\r\n  pressCoordinateProps,\r\n  useCoordinate,\r\n} 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  polyTransitionPropOptions,\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, propsFactory } from '../../util/vue-component';\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    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    modal: Boolean as PropType<boolean>,\r\n    contentStyles: {\r\n      type: Object as PropType<CSSProperties>,\r\n      default: () => {},\r\n    },\r\n    disabled: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: false,\r\n    },\r\n    openOnHover: {\r\n      type: Boolean as PropType<boolean>,\r\n      default: false,\r\n    },\r\n    openDelay: {\r\n      type: Number as PropType<number>,\r\n      default: 200,\r\n    },\r\n    closeDelay: {\r\n      type: Number as PropType<number>,\r\n      default: 200,\r\n    },\r\n    ...pressThemePropsOptions(),\r\n    ...polyTransitionPropOptions,\r\n    ...pressCoordinateProps(),\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    ...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  setup(props, { emit, expose, attrs, slots }) {\r\n    const base$ = ref();\r\n    const scrim$ = ref<HTMLElement>();\r\n    const content$ = ref<HTMLElement>();\r\n    const baseSlot = ref();\r\n    const baseEl = ref<HTMLElement>();\r\n\r\n    const { themeClasses } = useLocalTheme(props);\r\n    const { layerGroup } = useLayerGroup();\r\n    const { polyTransitionBindProps } = usePolyTransition(props);\r\n    const { dimensionStyles } = useDimension(props);\r\n    const active = computed<boolean>({\r\n      get: (): boolean => {\r\n        return !!props.modelValue;\r\n      },\r\n      set: (v: boolean) => {\r\n        emit('update:modelValue', v);\r\n      },\r\n    });\r\n    const finish = shallowRef(false);\r\n\r\n    const disabled = toRef(props, 'disabled');\r\n    const { lazyValue, onAfterUpdate } = useLazy(\r\n      toRef(props, 'eager'),\r\n      active,\r\n    );\r\n    const rendered = computed<boolean>(\r\n      () => !disabled.value && (lazyValue.value || active.value),\r\n    );\r\n\r\n    const { coordinate, coordinateStyles, updateCoordinate } = useCoordinate(\r\n      props,\r\n      { contentEl: content$, baseEl, active },\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      ); // 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    const baseFromSlotEl = computed(() => {\r\n      return baseSlot.value?.[0]?.el;\r\n    });\r\n\r\n    watchEffect(() => {\r\n      if (!base$.value) {\r\n        baseEl.value = baseFromSlotEl.value;\r\n        return;\r\n      }\r\n      const base = base$.value;\r\n      baseEl.value = base$.value?.$el ? base$.value?.$el : base;\r\n    });\r\n\r\n    const computedStyle = computed(() => {\r\n      return {\r\n        zIndex: '2000',\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    const hovered = ref(false);\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    expose({\r\n      scrim$,\r\n      base$,\r\n      content$,\r\n      baseEl,\r\n      active,\r\n      onAfterUpdate,\r\n      updateCoordinate,\r\n      hovered,\r\n    });\r\n\r\n    useRender(() => {\r\n      const slotBase = slots.base?.({\r\n        active: active.value,\r\n        props: mergeProps({\r\n          ref: base$,\r\n          class: {\r\n            'y-layer-base': true,\r\n            'y-layer-base--active': active.value,\r\n          },\r\n        }),\r\n      });\r\n      baseSlot.value = slotBase;\r\n      return (\r\n        <>\r\n          {slotBase}\r\n          <Teleport disabled={!layerGroup.value} to={layerGroup.value as any}>\r\n            {rendered.value && (\r\n              <div\r\n                class={{\r\n                  'y-layer': true,\r\n                  'y-layer--finish': finish.value,\r\n                  ...computedClass.value,\r\n                  [themeClasses.value ?? '']: true,\r\n                }}\r\n                onMouseenter={onMouseenter}\r\n                onMouseleave={onMouseleave}\r\n                style={computedStyle.value}\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                      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                    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      rendered,\r\n      lazyValue,\r\n      onAfterUpdate: onAfterUpdate as () => void,\r\n      scrim$,\r\n      content$,\r\n      baseEl,\r\n      polyTransitionBindProps,\r\n      coordinateStyles,\r\n    };\r\n  },\r\n});\r\n\r\nexport type YLayer = InstanceType<typeof YLayer>;\r\n"],"mappings":"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"}