yuyeon 0.3.4-beta.17 → 0.3.4-beta.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/yuyeon.js +3156 -3118
- package/dist/yuyeon.umd.cjs +3 -3
- package/lib/components/layer/YLayer.js +12 -3
- package/lib/components/layer/YLayer.js.map +1 -1
- package/lib/composables/coordinate/index.js +23 -13
- package/lib/composables/coordinate/index.js.map +1 -1
- package/lib/composables/coordinate/levitation.js +79 -50
- package/lib/composables/coordinate/levitation.js.map +1 -1
- package/package.json +1 -1
- package/types/components/dialog/YDialog.d.ts +2 -0
- package/types/components/layer/YLayer.d.ts +1 -0
- package/types/components/menu/YMenu.d.ts +2 -0
- package/types/composables/coordinate/index.d.ts +2 -3
- package/types/composables/coordinate/levitation.d.ts +4 -2
- package/types/shims.d.ts +54 -54
|
@@ -149,6 +149,7 @@ export const YLayer = defineComponent({
|
|
|
149
149
|
const maximized = toRef(props, "maximized");
|
|
150
150
|
const rendered = computed(() => !disabled.value && (lazyValue.value || active.value));
|
|
151
151
|
const {
|
|
152
|
+
coordination,
|
|
152
153
|
coordinateStyles,
|
|
153
154
|
updateCoordinate
|
|
154
155
|
} = useCoordinate(props, {
|
|
@@ -217,8 +218,14 @@ export const YLayer = defineComponent({
|
|
|
217
218
|
});
|
|
218
219
|
const computedContentClasses = computed(() => {
|
|
219
220
|
const boundClasses = bindClasses(props.contentClasses);
|
|
221
|
+
const {
|
|
222
|
+
side,
|
|
223
|
+
align
|
|
224
|
+
} = coordination.value;
|
|
220
225
|
return {
|
|
221
|
-
...boundClasses
|
|
226
|
+
...boundClasses,
|
|
227
|
+
[`y-layer--side-${side}`]: !!side,
|
|
228
|
+
[`y-layer--align-${align}`]: !!align
|
|
222
229
|
};
|
|
223
230
|
});
|
|
224
231
|
expose({
|
|
@@ -235,7 +242,8 @@ export const YLayer = defineComponent({
|
|
|
235
242
|
getActiveLayers,
|
|
236
243
|
isMe: vnode => {
|
|
237
244
|
return vnode === vm;
|
|
238
|
-
}
|
|
245
|
+
},
|
|
246
|
+
coordination
|
|
239
247
|
});
|
|
240
248
|
useRender(() => {
|
|
241
249
|
const slotBase = slots.base?.({
|
|
@@ -322,7 +330,8 @@ export const YLayer = defineComponent({
|
|
|
322
330
|
polyTransitionBindProps,
|
|
323
331
|
coordinateStyles,
|
|
324
332
|
layerGroupState,
|
|
325
|
-
getActiveLayers
|
|
333
|
+
getActiveLayers,
|
|
334
|
+
coordination
|
|
326
335
|
};
|
|
327
336
|
}
|
|
328
337
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YLayer.js","names":["computed","getCurrentInstance","mergeProps","reactive","ref","shallowRef","Teleport","Transition","toRef","Fragment","_Fragment","createVNode","_createVNode","vShow","_vShow","resolveDirective","_resolveDirective","_mergeProps","withDirectives","_withDirectives","useModelDuplex","useRender","pressCoordinateProps","useCoordinate","pressDimensionPropsOptions","useDimension","useLayerGroup","pressThemePropsOptions","useLocalTheme","useLazy","PolyTransition","pressPolyTransitionPropsOptions","usePolyTransition","ComplementClick","bindClasses","defineComponent","propsFactory","pressBasePropsOptions","useBase","pressContentPropsOptions","useContent","pressScrollStrategyProps","useScrollStrategies","noop","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"],"sources":["../../../src/components/layer/YLayer.tsx"],"sourcesContent":["import type { ComponentInternalInstance, PropType, SlotsType } from \"vue\";\nimport {\n\tcomputed,\n\tgetCurrentInstance,\n\tmergeProps,\n\treactive,\n\tref,\n\tshallowRef,\n\tTeleport,\n\tTransition,\n\ttoRef,\n} from \"vue\";\n\nimport { useModelDuplex } from \"@/composables/communication\";\nimport { useRender } from \"@/composables/component\";\nimport { pressCoordinateProps, useCoordinate } from \"@/composables/coordinate\";\nimport {\n\tpressDimensionPropsOptions,\n\tuseDimension,\n} from \"@/composables/dimension\";\nimport { useLayerGroup } from \"@/composables/layer-group\";\nimport { pressThemePropsOptions, useLocalTheme } from \"@/composables/theme\";\nimport { useLazy } from \"@/composables/timing\";\nimport {\n\tPolyTransition,\n\tpressPolyTransitionPropsOptions,\n\tusePolyTransition,\n} from \"@/composables/transition\";\nimport {\n\tComplementClick,\n\ttype ComplementClickBindingOptions,\n} from \"@/directives/complement-click\";\nimport { bindClasses, defineComponent, propsFactory } from \"@/util/component\";\n\nimport { pressBasePropsOptions, useBase } from \"./base\";\nimport { pressContentPropsOptions, useContent } from \"./content\";\nimport {\n\tpressScrollStrategyProps,\n\tuseScrollStrategies,\n} from \"./scroll-strategies\";\n\nimport \"./YLayer.scss\";\nimport type { CssProperties } from \"@/types\";\nimport { noop } from \"@/util\";\n\nexport const pressYLayerProps = propsFactory(\n\t{\n\t\tmodelValue: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tscrim: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tscrimOpacity: {\n\t\t\ttype: Number as PropType<number>,\n\t\t},\n\t\teager: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tclasses: {\n\t\t\ttype: [Array, String, Object] as PropType<\n\t\t\t\tstring[] | string | Record<string, any>\n\t\t\t>,\n\t\t},\n\t\tcontentClasses: {\n\t\t\ttype: [Array, String, Object] as PropType<\n\t\t\t\tstring[] | string | Record<string, any>\n\t\t\t>,\n\t\t},\n\t\tcloseClickScrim: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tcontentStyles: {\n\t\t\ttype: Object as PropType<CssProperties>,\n\t\t\tdefault: () => {},\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t\tdefault: false,\n\t\t},\n\t\tmaximized: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\topenOnHover: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t\tdefault: false,\n\t\t},\n\t\topenDelay: {\n\t\t\ttype: Number as PropType<number>,\n\t\t\tdefault: 200,\n\t\t},\n\t\tcloseDelay: {\n\t\t\ttype: Number as PropType<number>,\n\t\t\tdefault: 200,\n\t\t},\n\t\tzIndex: {\n\t\t\ttype: [Number, String] as PropType<number | string>,\n\t\t\tdefault: 2000,\n\t\t},\n\t\tcontained: Boolean,\n\t\tlayerGroup: [String, Object] as PropType<string | Element>,\n\t\t...pressThemePropsOptions(),\n\t\t...pressPolyTransitionPropsOptions(),\n\t\t...pressBasePropsOptions(),\n\t\t...pressContentPropsOptions(),\n\t\t...pressCoordinateProps(),\n\t\t...pressScrollStrategyProps(),\n\t\t...pressDimensionPropsOptions(),\n\t},\n\t\"YLayer\",\n);\n\nexport const YLayer = defineComponent({\n\tname: \"YLayer\",\n\tinheritAttrs: false,\n\tcomponents: {\n\t\tPolyTransition,\n\t},\n\tdirectives: {\n\t\tComplementClick,\n\t},\n\tprops: {\n\t\tmodal: Boolean as PropType<boolean>,\n\t\t...pressYLayerProps(),\n\t},\n\temits: {\n\t\t\"update:modelValue\": (value: boolean) => true,\n\t\t\"click:complement\": (mouseEvent: MouseEvent) => true,\n\t\tafterLeave: () => true,\n\t},\n\tslots: Object as SlotsType<{\n\t\tbase: any;\n\t\tdefault: any;\n\t}>,\n\tsetup(props, { emit, expose, attrs, slots }) {\n\t\tconst vm = getCurrentInstance();\n\t\tconst scrim$ = ref<HTMLElement>();\n\t\tconst content$ = ref<HTMLElement>();\n\t\tconst root$ = ref<HTMLElement>();\n\t\tconst model = useModelDuplex(props);\n\t\tconst active = computed({\n\t\t\tget: (): boolean => {\n\t\t\t\treturn !!model.value;\n\t\t\t},\n\t\t\tset: (v: boolean) => {\n\t\t\t\tif (!(v && props.disabled)) model.value = v;\n\t\t\t},\n\t\t});\n\t\t// Frags\n\t\tconst { base, base$, baseEl, baseSlot, baseFromSlotEl } = useBase(props);\n\t\tconst { contentEvents } = useContent(props, active);\n\t\tconst { themeClasses } = useLocalTheme(props);\n\t\tconst { layerGroup, layerGroupState, getActiveLayers } =\n\t\t\tuseLayerGroup(props);\n\t\tconst { polyTransitionBindProps } = usePolyTransition(props);\n\t\tconst { dimensionStyles } = useDimension(props);\n\n\t\tconst { lazyValue, onAfterUpdate } = useLazy(toRef(props, \"eager\"), active);\n\t\t// States\n\t\tconst finish = shallowRef(false);\n\t\tconst hovered = ref(false);\n\t\tconst focused = ref(false);\n\t\tconst disabled = toRef(props, \"disabled\");\n\t\tconst maximized = toRef(props, \"maximized\");\n\n\t\tconst rendered = computed<boolean>(\n\t\t\t() => !disabled.value && (lazyValue.value || active.value),\n\t\t);\n\n\t\tconst { coordinateStyles, updateCoordinate } = useCoordinate(props, {\n\t\t\tcontentEl: content$,\n\t\t\tbase,\n\t\t\tactive,\n\t\t});\n\t\tuseScrollStrategies(props, {\n\t\t\troot: root$,\n\t\t\tcontentEl: content$,\n\t\t\tactive,\n\t\t\tbaseEl: base,\n\t\t\tupdateCoordinate,\n\t\t});\n\n\t\tfunction onClickComplementLayer(mouseEvent: MouseEvent) {\n\t\t\temit(\"click:complement\", mouseEvent);\n\t\t\tif (!props.modal) {\n\t\t\t\tif (\n\t\t\t\t\tscrim$.value !== null &&\n\t\t\t\t\tscrim$.value === mouseEvent.target &&\n\t\t\t\t\tprops.closeClickScrim\n\t\t\t\t) {\n\t\t\t\t\tactive.value = false;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// TODO: shrug ani\n\t\t\t}\n\t\t}\n\n\t\tfunction closeConditional(): boolean {\n\t\t\treturn (\n\t\t\t\t(!props.openOnHover || (props.openOnHover && !hovered.value)) &&\n\t\t\t\tactive.value &&\n\t\t\t\tfinish.value\n\t\t\t); // TODO: && groupTopLevel.value;\n\t\t}\n\n\t\tconst complementClickOption = reactive<ComplementClickBindingOptions>({\n\t\t\thandler: onClickComplementLayer,\n\t\t\tdetermine: closeConditional,\n\t\t\tinclude: () => [baseEl.value],\n\t\t});\n\n\t\tfunction onAfterEnter() {\n\t\t\tfinish.value = true;\n\t\t}\n\n\t\tfunction onAfterLeave() {\n\t\t\tonAfterUpdate();\n\t\t\tfinish.value = false;\n\t\t\temit(\"afterLeave\");\n\t\t}\n\n\t\tfunction onClickScrim() {\n\t\t\tif (props.closeClickScrim) {\n\t\t\t\tactive.value = false;\n\t\t\t}\n\t\t}\n\n\t\tfunction onMouseenter(event: Event) {\n\t\t\thovered.value = true;\n\t\t}\n\n\t\tfunction onMouseleave(event: Event) {\n\t\t\thovered.value = false;\n\t\t}\n\n\t\tconst computedStyle = computed(() => {\n\t\t\treturn {\n\t\t\t\tzIndex: (props.zIndex ?? \"2000\").toString(),\n\t\t\t};\n\t\t});\n\n\t\tconst computedClass = computed<Record<string, boolean>>(() => {\n\t\t\tconst { classes } = props;\n\t\t\tconst boundClasses = bindClasses(classes);\n\t\t\treturn {\n\t\t\t\t...boundClasses,\n\t\t\t\t\"y-layer--active\": !!active.value,\n\t\t\t};\n\t\t});\n\n\t\tconst computedContentClasses = computed<Record<string, boolean>>(() => {\n\t\t\tconst boundClasses = bindClasses(props.contentClasses);\n\t\t\treturn {\n\t\t\t\t...boundClasses,\n\t\t\t};\n\t\t});\n\n\t\texpose({\n\t\t\tscrim$,\n\t\t\tbase$,\n\t\t\tcontent$: computed(() => content$.value),\n\t\t\tbaseEl,\n\t\t\tactive,\n\t\t\tonAfterUpdate,\n\t\t\tupdateCoordinate,\n\t\t\thovered,\n\t\t\tfinish,\n\t\t\tmodal: computed(() => props.modal),\n\t\t\tgetActiveLayers,\n\t\t\tisMe: (vnode: ComponentInternalInstance) => {\n\t\t\t\treturn vnode === vm;\n\t\t\t},\n\t\t});\n\n\t\tuseRender(() => {\n\t\t\tconst slotBase = slots.base?.({\n\t\t\t\tactive: active.value,\n\t\t\t\tprops: mergeProps({\n\t\t\t\t\tref: base$,\n\t\t\t\t\tclass: {\n\t\t\t\t\t\t\"y-layer-base\": true,\n\t\t\t\t\t\t\"y-layer-base--active\": active.value,\n\t\t\t\t\t},\n\t\t\t\t\t...(props.baseProps ?? {}),\n\t\t\t\t}),\n\t\t\t});\n\t\t\tbaseSlot.value = slotBase;\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{slotBase}\n\t\t\t\t\t<Teleport disabled={!layerGroup.value} to={layerGroup.value as any}>\n\t\t\t\t\t\t{rendered.value && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\"y-layer\": true,\n\t\t\t\t\t\t\t\t\t\t\"y-layer--finish\": finish.value,\n\t\t\t\t\t\t\t\t\t\t\"y-layer--contained\": props.contained,\n\t\t\t\t\t\t\t\t\t\t...computedClass.value,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\tthemeClasses.value,\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\tonMouseenter={onMouseenter}\n\t\t\t\t\t\t\t\tonMouseleave={onMouseleave}\n\t\t\t\t\t\t\t\tstyle={computedStyle.value}\n\t\t\t\t\t\t\t\tref={root$}\n\t\t\t\t\t\t\t\t{...attrs}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Transition name=\"fade\" appear>\n\t\t\t\t\t\t\t\t\t{active.value && props.scrim && (\n\t\t\t\t\t\t\t\t\t\t// biome-ignore lint/a11y/noStaticElementInteractions: <explanation>\n\t\t\t\t\t\t\t\t\t\t// biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclass=\"y-layer__scrim\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ \"--y-layer-scrim-opacity\": props.scrimOpacity }}\n\t\t\t\t\t\t\t\t\t\t\tonClick={onClickScrim}\n\t\t\t\t\t\t\t\t\t\t\tonKeydown={noop()}\n\t\t\t\t\t\t\t\t\t\t\tonKeyup={noop()}\n\t\t\t\t\t\t\t\t\t\t\tref=\"scrim$\"\n\t\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</Transition>\n\t\t\t\t\t\t\t\t<PolyTransition\n\t\t\t\t\t\t\t\t\tonAfterEnter={onAfterEnter}\n\t\t\t\t\t\t\t\t\tonAfterLeave={onAfterLeave}\n\t\t\t\t\t\t\t\t\tappear\n\t\t\t\t\t\t\t\t\t{...polyTransitionBindProps.value}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tv-show={active.value}\n\t\t\t\t\t\t\t\t\t\tv-complement-click={{ ...complementClickOption }}\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\"y-layer__content\": true,\n\t\t\t\t\t\t\t\t\t\t\t...computedContentClasses.value,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tstyle={[\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t...dimensionStyles.value,\n\t\t\t\t\t\t\t\t\t\t\t\t...coordinateStyles.value,\n\t\t\t\t\t\t\t\t\t\t\t\t...props.contentStyles,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\t\t{...contentEvents.value}\n\t\t\t\t\t\t\t\t\t\tref={content$}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{slots.default?.({ active: active.value })}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</PolyTransition>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Teleport>\n\t\t\t\t</>\n\t\t\t);\n\t\t});\n\n\t\treturn {\n\t\t\tcomplementClickOption,\n\t\t\tlayerGroup,\n\t\t\tactive,\n\t\t\tfinish,\n\t\t\trendered,\n\t\t\tlazyValue,\n\t\t\tonAfterUpdate: onAfterUpdate as () => void,\n\t\t\tscrim$,\n\t\t\tcontent$,\n\t\t\tbase$,\n\t\t\tbaseEl,\n\t\t\tbaseFromSlotEl,\n\t\t\tpolyTransitionBindProps,\n\t\t\tcoordinateStyles,\n\t\t\tlayerGroupState,\n\t\t\tgetActiveLayers,\n\t\t};\n\t},\n});\n\nexport type YLayer = InstanceType<typeof YLayer>;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"YLayer.js","names":["computed","getCurrentInstance","mergeProps","reactive","ref","shallowRef","Teleport","Transition","toRef","Fragment","_Fragment","createVNode","_createVNode","vShow","_vShow","resolveDirective","_resolveDirective","_mergeProps","withDirectives","_withDirectives","useModelDuplex","useRender","pressCoordinateProps","useCoordinate","pressDimensionPropsOptions","useDimension","useLayerGroup","pressThemePropsOptions","useLocalTheme","useLazy","PolyTransition","pressPolyTransitionPropsOptions","usePolyTransition","ComplementClick","bindClasses","defineComponent","propsFactory","pressBasePropsOptions","useBase","pressContentPropsOptions","useContent","pressScrollStrategyProps","useScrollStrategies","noop","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","coordination","coordinateStyles","updateCoordinate","contentEl","root","onClickComplementLayer","target","closeConditional","complementClickOption","handler","determine","include","onAfterEnter","onAfterLeave","onClickScrim","onMouseenter","event","onMouseleave","computedStyle","toString","computedClass","boundClasses","computedContentClasses","side","align","isMe","vnode","slotBase","class","baseProps"],"sources":["../../../src/components/layer/YLayer.tsx"],"sourcesContent":["import type { ComponentInternalInstance, PropType, SlotsType } from \"vue\";\nimport {\n\tcomputed,\n\tgetCurrentInstance,\n\tmergeProps,\n\treactive,\n\tref,\n\tshallowRef,\n\tTeleport,\n\tTransition,\n\ttoRef,\n} from \"vue\";\n\nimport { useModelDuplex } from \"@/composables/communication\";\nimport { useRender } from \"@/composables/component\";\nimport { pressCoordinateProps, useCoordinate } from \"@/composables/coordinate\";\nimport {\n\tpressDimensionPropsOptions,\n\tuseDimension,\n} from \"@/composables/dimension\";\nimport { useLayerGroup } from \"@/composables/layer-group\";\nimport { pressThemePropsOptions, useLocalTheme } from \"@/composables/theme\";\nimport { useLazy } from \"@/composables/timing\";\nimport {\n\tPolyTransition,\n\tpressPolyTransitionPropsOptions,\n\tusePolyTransition,\n} from \"@/composables/transition\";\nimport {\n\tComplementClick,\n\ttype ComplementClickBindingOptions,\n} from \"@/directives/complement-click\";\nimport { bindClasses, defineComponent, propsFactory } from \"@/util/component\";\n\nimport { pressBasePropsOptions, useBase } from \"./base\";\nimport { pressContentPropsOptions, useContent } from \"./content\";\nimport {\n\tpressScrollStrategyProps,\n\tuseScrollStrategies,\n} from \"./scroll-strategies\";\n\nimport \"./YLayer.scss\";\nimport type { CssProperties } from \"@/types\";\nimport { noop } from \"@/util\";\n\nexport const pressYLayerProps = propsFactory(\n\t{\n\t\tmodelValue: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tscrim: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tscrimOpacity: {\n\t\t\ttype: Number as PropType<number>,\n\t\t},\n\t\teager: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tclasses: {\n\t\t\ttype: [Array, String, Object] as PropType<\n\t\t\t\tstring[] | string | Record<string, any>\n\t\t\t>,\n\t\t},\n\t\tcontentClasses: {\n\t\t\ttype: [Array, String, Object] as PropType<\n\t\t\t\tstring[] | string | Record<string, any>\n\t\t\t>,\n\t\t},\n\t\tcloseClickScrim: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\tcontentStyles: {\n\t\t\ttype: Object as PropType<CssProperties>,\n\t\t\tdefault: () => {},\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t\tdefault: false,\n\t\t},\n\t\tmaximized: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t},\n\t\topenOnHover: {\n\t\t\ttype: Boolean as PropType<boolean>,\n\t\t\tdefault: false,\n\t\t},\n\t\topenDelay: {\n\t\t\ttype: Number as PropType<number>,\n\t\t\tdefault: 200,\n\t\t},\n\t\tcloseDelay: {\n\t\t\ttype: Number as PropType<number>,\n\t\t\tdefault: 200,\n\t\t},\n\t\tzIndex: {\n\t\t\ttype: [Number, String] as PropType<number | string>,\n\t\t\tdefault: 2000,\n\t\t},\n\t\tcontained: Boolean,\n\t\tlayerGroup: [String, Object] as PropType<string | Element>,\n\t\t...pressThemePropsOptions(),\n\t\t...pressPolyTransitionPropsOptions(),\n\t\t...pressBasePropsOptions(),\n\t\t...pressContentPropsOptions(),\n\t\t...pressCoordinateProps(),\n\t\t...pressScrollStrategyProps(),\n\t\t...pressDimensionPropsOptions(),\n\t},\n\t\"YLayer\",\n);\n\nexport const YLayer = defineComponent({\n\tname: \"YLayer\",\n\tinheritAttrs: false,\n\tcomponents: {\n\t\tPolyTransition,\n\t},\n\tdirectives: {\n\t\tComplementClick,\n\t},\n\tprops: {\n\t\tmodal: Boolean as PropType<boolean>,\n\t\t...pressYLayerProps(),\n\t},\n\temits: {\n\t\t\"update:modelValue\": (value: boolean) => true,\n\t\t\"click:complement\": (mouseEvent: MouseEvent) => true,\n\t\tafterLeave: () => true,\n\t},\n\tslots: Object as SlotsType<{\n\t\tbase: any;\n\t\tdefault: any;\n\t}>,\n\tsetup(props, { emit, expose, attrs, slots }) {\n\t\tconst vm = getCurrentInstance();\n\t\tconst scrim$ = ref<HTMLElement>();\n\t\tconst content$ = ref<HTMLElement>();\n\t\tconst root$ = ref<HTMLElement>();\n\t\tconst model = useModelDuplex(props);\n\t\tconst active = computed({\n\t\t\tget: (): boolean => {\n\t\t\t\treturn !!model.value;\n\t\t\t},\n\t\t\tset: (v: boolean) => {\n\t\t\t\tif (!(v && props.disabled)) model.value = v;\n\t\t\t},\n\t\t});\n\t\t// Frags\n\t\tconst { base, base$, baseEl, baseSlot, baseFromSlotEl } = useBase(props);\n\t\tconst { contentEvents } = useContent(props, active);\n\t\tconst { themeClasses } = useLocalTheme(props);\n\t\tconst { layerGroup, layerGroupState, getActiveLayers } =\n\t\t\tuseLayerGroup(props);\n\t\tconst { polyTransitionBindProps } = usePolyTransition(props);\n\t\tconst { dimensionStyles } = useDimension(props);\n\n\t\tconst { lazyValue, onAfterUpdate } = useLazy(toRef(props, \"eager\"), active);\n\t\t// States\n\t\tconst finish = shallowRef(false);\n\t\tconst hovered = ref(false);\n\t\tconst focused = ref(false);\n\t\tconst disabled = toRef(props, \"disabled\");\n\t\tconst maximized = toRef(props, \"maximized\");\n\n\t\tconst rendered = computed<boolean>(\n\t\t\t() => !disabled.value && (lazyValue.value || active.value),\n\t\t);\n\n\t\tconst { coordination, coordinateStyles, updateCoordinate } = useCoordinate(props, {\n\t\t\tcontentEl: content$,\n\t\t\tbase,\n\t\t\tactive,\n\t\t});\n\t\tuseScrollStrategies(props, {\n\t\t\troot: root$,\n\t\t\tcontentEl: content$,\n\t\t\tactive,\n\t\t\tbaseEl: base,\n\t\t\tupdateCoordinate,\n\t\t});\n\n\t\tfunction onClickComplementLayer(mouseEvent: MouseEvent) {\n\t\t\temit(\"click:complement\", mouseEvent);\n\t\t\tif (!props.modal) {\n\t\t\t\tif (\n\t\t\t\t\tscrim$.value !== null &&\n\t\t\t\t\tscrim$.value === mouseEvent.target &&\n\t\t\t\t\tprops.closeClickScrim\n\t\t\t\t) {\n\t\t\t\t\tactive.value = false;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// TODO: shrug ani\n\t\t\t}\n\t\t}\n\n\t\tfunction closeConditional(): boolean {\n\t\t\treturn (\n\t\t\t\t(!props.openOnHover || (props.openOnHover && !hovered.value)) &&\n\t\t\t\tactive.value &&\n\t\t\t\tfinish.value\n\t\t\t); // TODO: && groupTopLevel.value;\n\t\t}\n\n\t\tconst complementClickOption = reactive<ComplementClickBindingOptions>({\n\t\t\thandler: onClickComplementLayer,\n\t\t\tdetermine: closeConditional,\n\t\t\tinclude: () => [baseEl.value],\n\t\t});\n\n\t\tfunction onAfterEnter() {\n\t\t\tfinish.value = true;\n\t\t}\n\n\t\tfunction onAfterLeave() {\n\t\t\tonAfterUpdate();\n\t\t\tfinish.value = false;\n\t\t\temit(\"afterLeave\");\n\t\t}\n\n\t\tfunction onClickScrim() {\n\t\t\tif (props.closeClickScrim) {\n\t\t\t\tactive.value = false;\n\t\t\t}\n\t\t}\n\n\t\tfunction onMouseenter(event: Event) {\n\t\t\thovered.value = true;\n\t\t}\n\n\t\tfunction onMouseleave(event: Event) {\n\t\t\thovered.value = false;\n\t\t}\n\n\t\tconst computedStyle = computed(() => {\n\t\t\treturn {\n\t\t\t\tzIndex: (props.zIndex ?? \"2000\").toString(),\n\t\t\t};\n\t\t});\n\n\t\tconst computedClass = computed<Record<string, boolean>>(() => {\n\t\t\tconst { classes } = props;\n\t\t\tconst boundClasses = bindClasses(classes);\n\t\t\treturn {\n\t\t\t\t...boundClasses,\n\t\t\t\t\"y-layer--active\": !!active.value,\n\t\t\t};\n\t\t});\n\n\t\tconst computedContentClasses = computed<Record<string, boolean>>(() => {\n\t\t\tconst boundClasses = bindClasses(props.contentClasses);\n\t\t\tconst { side, align } = coordination.value;\n\t\t\treturn {\n\t\t\t\t...boundClasses,\n [`y-layer--side-${side}`]: !!side,\n [`y-layer--align-${align}`]: !!align,\n\t\t\t};\n\t\t});\n\n\t\texpose({\n\t\t\tscrim$,\n\t\t\tbase$,\n\t\t\tcontent$: computed(() => content$.value),\n\t\t\tbaseEl,\n\t\t\tactive,\n\t\t\tonAfterUpdate,\n\t\t\tupdateCoordinate,\n\t\t\thovered,\n\t\t\tfinish,\n\t\t\tmodal: computed(() => props.modal),\n\t\t\tgetActiveLayers,\n\t\t\tisMe: (vnode: ComponentInternalInstance) => {\n\t\t\t\treturn vnode === vm;\n\t\t\t},\n\t\t\tcoordination,\n\t\t});\n\n\t\tuseRender(() => {\n\t\t\tconst slotBase = slots.base?.({\n\t\t\t\tactive: active.value,\n\t\t\t\tprops: mergeProps({\n\t\t\t\t\tref: base$,\n\t\t\t\t\tclass: {\n\t\t\t\t\t\t\"y-layer-base\": true,\n\t\t\t\t\t\t\"y-layer-base--active\": active.value,\n\t\t\t\t\t},\n\t\t\t\t\t...(props.baseProps ?? {}),\n\t\t\t\t}),\n\t\t\t});\n\t\t\tbaseSlot.value = slotBase;\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{slotBase}\n\t\t\t\t\t<Teleport disabled={!layerGroup.value} to={layerGroup.value as any}>\n\t\t\t\t\t\t{rendered.value && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\"y-layer\": true,\n\t\t\t\t\t\t\t\t\t\t\"y-layer--finish\": finish.value,\n\t\t\t\t\t\t\t\t\t\t\"y-layer--contained\": props.contained,\n\t\t\t\t\t\t\t\t\t\t...computedClass.value,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\tthemeClasses.value,\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\tonMouseenter={onMouseenter}\n\t\t\t\t\t\t\t\tonMouseleave={onMouseleave}\n\t\t\t\t\t\t\t\tstyle={computedStyle.value}\n\t\t\t\t\t\t\t\tref={root$}\n\t\t\t\t\t\t\t\t{...attrs}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Transition name=\"fade\" appear>\n\t\t\t\t\t\t\t\t\t{active.value && props.scrim && (\n\t\t\t\t\t\t\t\t\t\t// biome-ignore lint/a11y/noStaticElementInteractions: <explanation>\n\t\t\t\t\t\t\t\t\t\t// biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclass=\"y-layer__scrim\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ \"--y-layer-scrim-opacity\": props.scrimOpacity }}\n\t\t\t\t\t\t\t\t\t\t\tonClick={onClickScrim}\n\t\t\t\t\t\t\t\t\t\t\tonKeydown={noop()}\n\t\t\t\t\t\t\t\t\t\t\tonKeyup={noop()}\n\t\t\t\t\t\t\t\t\t\t\tref=\"scrim$\"\n\t\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</Transition>\n\t\t\t\t\t\t\t\t<PolyTransition\n\t\t\t\t\t\t\t\t\tonAfterEnter={onAfterEnter}\n\t\t\t\t\t\t\t\t\tonAfterLeave={onAfterLeave}\n\t\t\t\t\t\t\t\t\tappear\n\t\t\t\t\t\t\t\t\t{...polyTransitionBindProps.value}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tv-show={active.value}\n\t\t\t\t\t\t\t\t\t\tv-complement-click={{ ...complementClickOption }}\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\"y-layer__content\": true,\n\t\t\t\t\t\t\t\t\t\t\t...computedContentClasses.value,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tstyle={[\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t...dimensionStyles.value,\n\t\t\t\t\t\t\t\t\t\t\t\t...coordinateStyles.value,\n\t\t\t\t\t\t\t\t\t\t\t\t...props.contentStyles,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\t\t{...contentEvents.value}\n\t\t\t\t\t\t\t\t\t\tref={content$}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{slots.default?.({ active: active.value })}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</PolyTransition>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Teleport>\n\t\t\t\t</>\n\t\t\t);\n\t\t});\n\n\t\treturn {\n\t\t\tcomplementClickOption,\n\t\t\tlayerGroup,\n\t\t\tactive,\n\t\t\tfinish,\n\t\t\trendered,\n\t\t\tlazyValue,\n\t\t\tonAfterUpdate: onAfterUpdate as () => void,\n\t\t\tscrim$,\n\t\t\tcontent$,\n\t\t\tbase$,\n\t\t\tbaseEl,\n\t\t\tbaseFromSlotEl,\n\t\t\tpolyTransitionBindProps,\n\t\t\tcoordinateStyles,\n\t\t\tlayerGroupState,\n\t\t\tgetActiveLayers,\n\t\t\tcoordination,\n\t\t};\n\t},\n});\n\nexport type YLayer = InstanceType<typeof YLayer>;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { onScopeDispose, ref, watch } from
|
|
1
|
+
import { onScopeDispose, ref, watch } from "vue";
|
|
2
2
|
import { propsFactory } from "../../util/component/index.js";
|
|
3
3
|
import { useToggleScope } from "../scope.js";
|
|
4
4
|
import { applyArrangement } from "./arrangement.js";
|
|
@@ -10,19 +10,19 @@ const coordinateStrategies = {
|
|
|
10
10
|
export const pressCoordinateProps = propsFactory({
|
|
11
11
|
coordinateStrategy: {
|
|
12
12
|
type: [String, Function],
|
|
13
|
-
default:
|
|
13
|
+
default: "arrangement"
|
|
14
14
|
},
|
|
15
15
|
position: {
|
|
16
16
|
type: String,
|
|
17
|
-
default:
|
|
17
|
+
default: "default"
|
|
18
18
|
},
|
|
19
19
|
align: {
|
|
20
20
|
type: String,
|
|
21
|
-
default:
|
|
21
|
+
default: "start"
|
|
22
22
|
},
|
|
23
23
|
origin: {
|
|
24
24
|
type: String,
|
|
25
|
-
default:
|
|
25
|
+
default: "auto"
|
|
26
26
|
},
|
|
27
27
|
offset: {
|
|
28
28
|
type: [Number, String, Array]
|
|
@@ -31,35 +31,45 @@ export const pressCoordinateProps = propsFactory({
|
|
|
31
31
|
type: [Number, String, Array],
|
|
32
32
|
default: 16
|
|
33
33
|
}
|
|
34
|
-
},
|
|
34
|
+
}, "Coordinate");
|
|
35
35
|
export function useCoordinate(props, state) {
|
|
36
36
|
const updateCoordinate = ref();
|
|
37
|
-
const
|
|
37
|
+
const coordination = ref({
|
|
38
|
+
side: '',
|
|
39
|
+
align: '',
|
|
40
|
+
offset: [0, 0],
|
|
41
|
+
rect: {
|
|
42
|
+
x: 0,
|
|
43
|
+
y: 0,
|
|
44
|
+
width: 0,
|
|
45
|
+
height: 0
|
|
46
|
+
}
|
|
47
|
+
});
|
|
38
48
|
const coordinateStyles = ref({});
|
|
39
49
|
useToggleScope(() => !!(state.active.value && props.coordinateStrategy), reset => {
|
|
40
50
|
watch(() => props.coordinateStrategy, reset);
|
|
41
51
|
onScopeDispose(() => {
|
|
42
52
|
updateCoordinate.value = undefined;
|
|
43
53
|
});
|
|
44
|
-
if (typeof props.coordinateStrategy ===
|
|
45
|
-
updateCoordinate.value = props.coordinateStrategy(props, state,
|
|
54
|
+
if (typeof props.coordinateStrategy === "function") {
|
|
55
|
+
updateCoordinate.value = props.coordinateStrategy(props, state, coordination, coordinateStyles)?.updateCoordinate;
|
|
46
56
|
} else {
|
|
47
57
|
const strategy = coordinateStrategies[props.coordinateStrategy];
|
|
48
|
-
updateCoordinate.value = strategy?.(props, state,
|
|
58
|
+
updateCoordinate.value = strategy?.(props, state, coordination, coordinateStyles)?.updateCoordinate;
|
|
49
59
|
}
|
|
50
60
|
});
|
|
51
|
-
window.addEventListener(
|
|
61
|
+
window.addEventListener("resize", onResize, {
|
|
52
62
|
passive: true
|
|
53
63
|
});
|
|
54
64
|
onScopeDispose(() => {
|
|
55
|
-
window.removeEventListener(
|
|
65
|
+
window.removeEventListener("resize", onResize);
|
|
56
66
|
updateCoordinate.value = undefined;
|
|
57
67
|
});
|
|
58
68
|
function onResize(e) {
|
|
59
69
|
updateCoordinate.value?.(e);
|
|
60
70
|
}
|
|
61
71
|
return {
|
|
62
|
-
|
|
72
|
+
coordination,
|
|
63
73
|
coordinateStyles,
|
|
64
74
|
updateCoordinate
|
|
65
75
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["onScopeDispose","ref","watch","propsFactory","useToggleScope","applyArrangement","applyLevitation","coordinateStrategies","levitation","arrangement","pressCoordinateProps","coordinateStrategy","type","String","Function","default","position","align","origin","offset","Number","Array","viewportMargin","useCoordinate","props","state","updateCoordinate","
|
|
1
|
+
{"version":3,"file":"index.js","names":["onScopeDispose","ref","watch","propsFactory","useToggleScope","applyArrangement","applyLevitation","coordinateStrategies","levitation","arrangement","pressCoordinateProps","coordinateStrategy","type","String","Function","default","position","align","origin","offset","Number","Array","viewportMargin","useCoordinate","props","state","updateCoordinate","coordination","side","rect","x","y","width","height","coordinateStyles","active","value","reset","undefined","strategy","window","addEventListener","onResize","passive","removeEventListener","e"],"sources":["../../../src/composables/coordinate/index.ts"],"sourcesContent":["import type { PropType, Ref } from \"vue\";\nimport { onScopeDispose, ref, watch } from \"vue\";\n\nimport type { CssProperties } from \"@/types\";\n\nimport { propsFactory } from \"../../util/component\";\nimport type { Rect } from \"../../util/rect\";\nimport { useToggleScope } from \"../scope\";\nimport { applyArrangement } from \"./arrangement\";\nimport { applyLevitation } from \"./levitation\";\nimport type { CoordinateState } from \"./types\";\n\nconst coordinateStrategies = {\n\tlevitation: applyLevitation,\n\tarrangement: applyArrangement,\n};\n\nexport type CoordinateStrategyFn = (\n\tprops: any,\n\tstate: CoordinateState,\n\tcoordination: Ref<any>,\n\tcoordinateStyles: Ref<CssProperties>,\n) => undefined | { updateCoordinate: (e: Event) => void };\n\nexport const pressCoordinateProps = propsFactory(\n\t{\n\t\tcoordinateStrategy: {\n\t\t\ttype: [String, Function] as PropType<\n\t\t\t\tkeyof typeof coordinateStrategies | CoordinateStrategyFn\n\t\t\t>,\n\t\t\tdefault: \"arrangement\",\n\t\t},\n\t\tposition: {\n\t\t\ttype: String as PropType<\n\t\t\t\t\"default\" | \"top\" | \"end\" | \"right\" | \"bottom\" | \"left\" | \"start\"\n\t\t\t>,\n\t\t\tdefault: \"default\",\n\t\t},\n\t\talign: {\n\t\t\ttype: String as PropType<\"start\" | \"center\" | \"end\" | \"top\" | \"bottom\">,\n\t\t\tdefault: \"start\",\n\t\t},\n\t\torigin: {\n\t\t\ttype: String,\n\t\t\tdefault: \"auto\",\n\t\t},\n\t\toffset: {\n\t\t\ttype: [Number, String, Array] as PropType<number | string | number[]>,\n\t\t},\n\t\tviewportMargin: {\n\t\t\ttype: [Number, String, Array],\n\t\t\tdefault: 16,\n\t\t},\n\t},\n\t\"Coordinate\",\n);\n\nexport function useCoordinate(props: any, state: CoordinateState) {\n\tconst updateCoordinate = ref<(e: Event) => void>();\n\tconst coordination = ref<any>({\n\t\tside: '',\n\t\talign: '',\n\t\toffset: [0, 0],\n\t\trect: {\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t\twidth: 0,\n\t\t\theight: 0\n\t\t}\n\t});\n\tconst coordinateStyles = ref<CssProperties>({});\n\n\tuseToggleScope(\n\t\t() => !!(state.active.value && props.coordinateStrategy),\n\t\t(reset) => {\n\t\t\twatch(() => props.coordinateStrategy, reset);\n\t\t\tonScopeDispose(() => {\n\t\t\t\tupdateCoordinate.value = undefined;\n\t\t\t});\n\n\t\t\tif (typeof props.coordinateStrategy === \"function\") {\n\t\t\t\tupdateCoordinate.value = props.coordinateStrategy(\n\t\t\t\t\tprops,\n\t\t\t\t\tstate,\n\t\t\t\t\tcoordination,\n\t\t\t\t\tcoordinateStyles,\n\t\t\t\t)?.updateCoordinate;\n\t\t\t} else {\n\t\t\t\tconst strategy =\n\t\t\t\t\tcoordinateStrategies[\n\t\t\t\t\t\tprops.coordinateStrategy as keyof typeof coordinateStrategies\n\t\t\t\t\t];\n\t\t\t\tupdateCoordinate.value = strategy?.(\n\t\t\t\t\tprops,\n\t\t\t\t\tstate,\n\t\t\t\t\tcoordination,\n\t\t\t\t\tcoordinateStyles,\n\t\t\t\t)?.updateCoordinate;\n\t\t\t}\n\t\t},\n\t);\n\n\twindow.addEventListener(\"resize\", onResize, { passive: true });\n\n\tonScopeDispose(() => {\n\t\twindow.removeEventListener(\"resize\", onResize);\n\t\tupdateCoordinate.value = undefined;\n\t});\n\n\tfunction onResize(e: Event) {\n\t\tupdateCoordinate.value?.(e);\n\t}\n\n\treturn {\n\t\tcoordination,\n\t\tcoordinateStyles,\n\t\tupdateCoordinate,\n\t};\n}\n"],"mappings":"AACA,SAASA,cAAc,EAAEC,GAAG,EAAEC,KAAK,QAAQ,KAAK;AAAC,SAIxCC,YAAY;AAAA,SAEZC,cAAc;AAAA,SACdC,gBAAgB;AAAA,SAChBC,eAAe;AAGxB,MAAMC,oBAAoB,GAAG;EAC5BC,UAAU,EAAEF,eAAe;EAC3BG,WAAW,EAAEJ;AACd,CAAC;AASD,OAAO,MAAMK,oBAAoB,GAAGP,YAAY,CAC/C;EACCQ,kBAAkB,EAAE;IACnBC,IAAI,EAAE,CAACC,MAAM,EAAEC,QAAQ,CAEtB;IACDC,OAAO,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACTJ,IAAI,EAAEC,MAEL;IACDE,OAAO,EAAE;EACV,CAAC;EACDE,KAAK,EAAE;IACNL,IAAI,EAAEC,MAAiE;IACvEE,OAAO,EAAE;EACV,CAAC;EACDG,MAAM,EAAE;IACPN,IAAI,EAAEC,MAAM;IACZE,OAAO,EAAE;EACV,CAAC;EACDI,MAAM,EAAE;IACPP,IAAI,EAAE,CAACQ,MAAM,EAAEP,MAAM,EAAEQ,KAAK;EAC7B,CAAC;EACDC,cAAc,EAAE;IACfV,IAAI,EAAE,CAACQ,MAAM,EAAEP,MAAM,EAAEQ,KAAK,CAAC;IAC7BN,OAAO,EAAE;EACV;AACD,CAAC,EACD,YACD,CAAC;AAED,OAAO,SAASQ,aAAaA,CAACC,KAAU,EAAEC,KAAsB,EAAE;EACjE,MAAMC,gBAAgB,GAAGzB,GAAG,CAAqB,CAAC;EAClD,MAAM0B,YAAY,GAAG1B,GAAG,CAAM;IAC7B2B,IAAI,EAAE,EAAE;IACRX,KAAK,EAAE,EAAE;IACTE,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IACdU,IAAI,EAAE;MACLC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,CAAC;MACJC,KAAK,EAAE,CAAC;MACRC,MAAM,EAAE;IACT;EACD,CAAC,CAAC;EACF,MAAMC,gBAAgB,GAAGjC,GAAG,CAAgB,CAAC,CAAC,CAAC;EAE/CG,cAAc,CACb,MAAM,CAAC,EAAEqB,KAAK,CAACU,MAAM,CAACC,KAAK,IAAIZ,KAAK,CAACb,kBAAkB,CAAC,EACvD0B,KAAK,IAAK;IACVnC,KAAK,CAAC,MAAMsB,KAAK,CAACb,kBAAkB,EAAE0B,KAAK,CAAC;IAC5CrC,cAAc,CAAC,MAAM;MACpB0B,gBAAgB,CAACU,KAAK,GAAGE,SAAS;IACnC,CAAC,CAAC;IAEF,IAAI,OAAOd,KAAK,CAACb,kBAAkB,KAAK,UAAU,EAAE;MACnDe,gBAAgB,CAACU,KAAK,GAAGZ,KAAK,CAACb,kBAAkB,CAChDa,KAAK,EACLC,KAAK,EACLE,YAAY,EACZO,gBACD,CAAC,EAAER,gBAAgB;IACpB,CAAC,MAAM;MACN,MAAMa,QAAQ,GACbhC,oBAAoB,CACnBiB,KAAK,CAACb,kBAAkB,CACxB;MACFe,gBAAgB,CAACU,KAAK,GAAGG,QAAQ,GAChCf,KAAK,EACLC,KAAK,EACLE,YAAY,EACZO,gBACD,CAAC,EAAER,gBAAgB;IACpB;EACD,CACD,CAAC;EAEDc,MAAM,CAACC,gBAAgB,CAAC,QAAQ,EAAEC,QAAQ,EAAE;IAAEC,OAAO,EAAE;EAAK,CAAC,CAAC;EAE9D3C,cAAc,CAAC,MAAM;IACpBwC,MAAM,CAACI,mBAAmB,CAAC,QAAQ,EAAEF,QAAQ,CAAC;IAC9ChB,gBAAgB,CAACU,KAAK,GAAGE,SAAS;EACnC,CAAC,CAAC;EAEF,SAASI,QAAQA,CAACG,CAAQ,EAAE;IAC3BnB,gBAAgB,CAACU,KAAK,GAAGS,CAAC,CAAC;EAC5B;EAEA,OAAO;IACNlB,YAAY;IACZO,gBAAgB;IAChBR;EACD,CAAC;AACF","ignoreList":[]}
|
|
@@ -1,38 +1,60 @@
|
|
|
1
|
-
import { computed, nextTick, onScopeDispose, ref, watch } from
|
|
1
|
+
import { computed, nextTick, onScopeDispose, ref, watch } from "vue";
|
|
2
2
|
import { flipAlign, flipCorner, flipSide, getAxis, parseAnchor } from "../../util/anchor.js";
|
|
3
3
|
import { clamp } from "../../util/common.js";
|
|
4
4
|
import { $computed } from "../../util/reactivity.js";
|
|
5
|
-
import {
|
|
5
|
+
import { getOverflow, MutableRect } from "../../util/rect.js";
|
|
6
6
|
import { getScrollParents } from "../../util/scroll.js";
|
|
7
7
|
import { getBoundingPureRect, pixelCeil, pixelRound, toStyleSizeValue } from "../../util/ui.js";
|
|
8
8
|
import { anchorToPoint, getOffset } from "./utils/point.js";
|
|
9
|
-
export function applyLevitation(props, state,
|
|
9
|
+
export function applyLevitation(props, state, coordination, coordinateStyles) {
|
|
10
10
|
const {
|
|
11
11
|
contentEl,
|
|
12
12
|
base,
|
|
13
13
|
active
|
|
14
14
|
} = state;
|
|
15
15
|
const isRtl = ref(false);
|
|
16
|
+
const isFlipped = ref([false, false]);
|
|
16
17
|
|
|
17
18
|
/* Content Limitations */
|
|
18
|
-
const [minWidth, minHeight, maxWidth, maxHeight] = [
|
|
19
|
+
const [minWidth, minHeight, maxWidth, maxHeight] = ["minWidth", "minHeight", "maxWidth", "maxHeight"].map(key => {
|
|
19
20
|
return computed(() => {
|
|
20
21
|
const val = parseFloat(props[key]);
|
|
21
22
|
return isNaN(val) ? Infinity : val;
|
|
22
23
|
});
|
|
23
24
|
});
|
|
25
|
+
const {
|
|
26
|
+
preferredAnchor,
|
|
27
|
+
preferredOrigin
|
|
28
|
+
} = $computed(() => {
|
|
29
|
+
const location = `${props.position} ${props.align}`;
|
|
30
|
+
const parsedAnchor = parseAnchor(location, false);
|
|
31
|
+
const parsedOrigin = props.origin === "overlap" ? parsedAnchor : props.origin === "auto" ? flipSide(parsedAnchor) : parseAnchor(props.origin, false);
|
|
32
|
+
|
|
33
|
+
// Some combinations of props may produce an invalid origin
|
|
34
|
+
if (parsedAnchor.side === parsedOrigin.side && parsedAnchor.align === flipAlign(parsedOrigin).align) {
|
|
35
|
+
return {
|
|
36
|
+
preferredAnchor: flipCorner(parsedAnchor),
|
|
37
|
+
preferredOrigin: flipCorner(parsedOrigin)
|
|
38
|
+
};
|
|
39
|
+
} else {
|
|
40
|
+
return {
|
|
41
|
+
preferredAnchor: parsedAnchor,
|
|
42
|
+
preferredOrigin: parsedOrigin
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
});
|
|
24
46
|
|
|
25
47
|
/* Offset */
|
|
26
48
|
const offset = computed(() => {
|
|
27
49
|
if (Array.isArray(props.offset)) {
|
|
28
50
|
return props.offset;
|
|
29
51
|
}
|
|
30
|
-
if (typeof props.offset ===
|
|
31
|
-
const offset = props.offset.split(
|
|
52
|
+
if (typeof props.offset === "string") {
|
|
53
|
+
const offset = props.offset.split(" ").map(parseFloat);
|
|
32
54
|
if (offset.length < 2) offset.push(0);
|
|
33
55
|
return offset;
|
|
34
56
|
}
|
|
35
|
-
return typeof props.offset ===
|
|
57
|
+
return typeof props.offset === "number" ? [props.offset, 0] : [0, 0];
|
|
36
58
|
});
|
|
37
59
|
|
|
38
60
|
/* Viewport Margin */
|
|
@@ -40,12 +62,12 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
40
62
|
if (Array.isArray(props.viewportMargin)) {
|
|
41
63
|
return props.viewportMargin;
|
|
42
64
|
}
|
|
43
|
-
if (typeof props.viewportMargin ===
|
|
44
|
-
const offset = props.viewportMargin.split(
|
|
65
|
+
if (typeof props.viewportMargin === "string") {
|
|
66
|
+
const offset = props.viewportMargin.split(" ").map(parseFloat);
|
|
45
67
|
if (offset.length < 2) offset.push(0);
|
|
46
68
|
return offset;
|
|
47
69
|
}
|
|
48
|
-
return typeof props.viewportMargin ===
|
|
70
|
+
return typeof props.viewportMargin === "number" ? [props.viewportMargin, 0] : [0, 0];
|
|
49
71
|
});
|
|
50
72
|
|
|
51
73
|
/* Observing Update */
|
|
@@ -68,8 +90,8 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
68
90
|
});
|
|
69
91
|
function getIgnoreInsetRect(el) {
|
|
70
92
|
const rect = getBoundingPureRect(el);
|
|
71
|
-
rect.x -= parseFloat(el.style.left ||
|
|
72
|
-
rect.y -= parseFloat(el.style.top ||
|
|
93
|
+
rect.x -= parseFloat(el.style.left || "0");
|
|
94
|
+
rect.y -= parseFloat(el.style.top || "0");
|
|
73
95
|
return rect;
|
|
74
96
|
}
|
|
75
97
|
function updateCoordinate() {
|
|
@@ -77,7 +99,9 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
77
99
|
const $base = base.value;
|
|
78
100
|
const $content = contentEl.value;
|
|
79
101
|
requestAnimationFrame(() => {
|
|
80
|
-
requestAnimationFrame(() =>
|
|
102
|
+
requestAnimationFrame(() => {
|
|
103
|
+
observe = true;
|
|
104
|
+
});
|
|
81
105
|
});
|
|
82
106
|
if (!$base || !$content) return;
|
|
83
107
|
const baseRect = Array.isArray($base) ? new MutableRect({
|
|
@@ -117,27 +141,6 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
117
141
|
viewport.y += viewportMargin.value[1];
|
|
118
142
|
viewport.width -= viewportMargin.value[0] * 2;
|
|
119
143
|
viewport.height -= viewportMargin.value[1] * 2;
|
|
120
|
-
const {
|
|
121
|
-
preferredAnchor,
|
|
122
|
-
preferredOrigin
|
|
123
|
-
} = $computed(() => {
|
|
124
|
-
const location = `${props.position} ${props.align}`;
|
|
125
|
-
const parsedAnchor = parseAnchor(location, false);
|
|
126
|
-
const parsedOrigin = props.origin === 'overlap' ? parsedAnchor : props.origin === 'auto' ? flipSide(parsedAnchor) : parseAnchor(props.origin, false);
|
|
127
|
-
|
|
128
|
-
// Some combinations of props may produce an invalid origin
|
|
129
|
-
if (parsedAnchor.side === parsedOrigin.side && parsedAnchor.align === flipAlign(parsedOrigin).align) {
|
|
130
|
-
return {
|
|
131
|
-
preferredAnchor: flipCorner(parsedAnchor),
|
|
132
|
-
preferredOrigin: flipCorner(parsedOrigin)
|
|
133
|
-
};
|
|
134
|
-
} else {
|
|
135
|
-
return {
|
|
136
|
-
preferredAnchor: parsedAnchor,
|
|
137
|
-
preferredOrigin: parsedOrigin
|
|
138
|
-
};
|
|
139
|
-
}
|
|
140
|
-
});
|
|
141
144
|
let placement = {
|
|
142
145
|
anchor: preferredAnchor.value,
|
|
143
146
|
origin: preferredOrigin.value
|
|
@@ -151,32 +154,41 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
151
154
|
y
|
|
152
155
|
} = getOffset(targetPoint, contentPoint);
|
|
153
156
|
switch (_placement.anchor.side) {
|
|
154
|
-
case
|
|
157
|
+
case "top":
|
|
155
158
|
y -= offset.value[0];
|
|
156
159
|
break;
|
|
157
|
-
case
|
|
160
|
+
case "bottom":
|
|
158
161
|
y += offset.value[0];
|
|
159
162
|
break;
|
|
160
|
-
case
|
|
163
|
+
case "left":
|
|
161
164
|
x -= offset.value[0];
|
|
162
165
|
break;
|
|
163
|
-
case
|
|
166
|
+
case "right":
|
|
164
167
|
x += offset.value[0];
|
|
165
168
|
break;
|
|
166
169
|
}
|
|
167
170
|
switch (_placement.anchor.align) {
|
|
168
|
-
case
|
|
171
|
+
case "top":
|
|
169
172
|
y -= offset.value[1];
|
|
170
173
|
break;
|
|
171
|
-
case
|
|
174
|
+
case "bottom":
|
|
172
175
|
y += offset.value[1];
|
|
173
176
|
break;
|
|
174
|
-
case
|
|
177
|
+
case "left":
|
|
175
178
|
x -= offset.value[1];
|
|
176
179
|
break;
|
|
177
|
-
case
|
|
180
|
+
case "right":
|
|
178
181
|
x += offset.value[1];
|
|
179
182
|
break;
|
|
183
|
+
case "center":
|
|
184
|
+
{
|
|
185
|
+
if (_placement.anchor.side === "top" || _placement.anchor.side === "bottom") {
|
|
186
|
+
x += offset.value[1];
|
|
187
|
+
} else {
|
|
188
|
+
y += offset.value[1];
|
|
189
|
+
}
|
|
190
|
+
break;
|
|
191
|
+
}
|
|
180
192
|
}
|
|
181
193
|
box.x += x;
|
|
182
194
|
box.y += y;
|
|
@@ -220,8 +232,8 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
220
232
|
const hasOverflowX = overflows.x.before || overflows.x.after;
|
|
221
233
|
const hasOverflowY = overflows.y.before || overflows.y.after;
|
|
222
234
|
let reset = false;
|
|
223
|
-
[
|
|
224
|
-
if (key ===
|
|
235
|
+
["x", "y"].forEach(key => {
|
|
236
|
+
if (key === "x" && hasOverflowX && !flipped.x || key === "y" && hasOverflowY && !flipped.y) {
|
|
225
237
|
const newPlacement = {
|
|
226
238
|
anchor: {
|
|
227
239
|
...placement.anchor
|
|
@@ -230,7 +242,7 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
230
242
|
...placement.origin
|
|
231
243
|
}
|
|
232
244
|
};
|
|
233
|
-
const flip = key ===
|
|
245
|
+
const flip = key === "x" ? axis === "y" ? flipAlign : flipSide : axis === "y" ? flipSide : flipAlign;
|
|
234
246
|
newPlacement.anchor = flip(newPlacement.anchor);
|
|
235
247
|
newPlacement.origin = flip(newPlacement.origin);
|
|
236
248
|
const {
|
|
@@ -276,22 +288,36 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
276
288
|
break;
|
|
277
289
|
}
|
|
278
290
|
const axis = getAxis(placement.anchor);
|
|
291
|
+
coordination.value = {
|
|
292
|
+
side: placement.anchor.side,
|
|
293
|
+
align: placement.anchor.align,
|
|
294
|
+
rect: new MutableRect({
|
|
295
|
+
x,
|
|
296
|
+
y,
|
|
297
|
+
width: contentRect.width,
|
|
298
|
+
height: contentRect.height
|
|
299
|
+
}),
|
|
300
|
+
offset: [0, 0]
|
|
301
|
+
};
|
|
279
302
|
Object.assign(coordinateStyles.value, {
|
|
280
|
-
|
|
303
|
+
"--y-levitation-anchor-origin": `${placement.anchor.side} ${placement.anchor.align}`,
|
|
281
304
|
transformOrigin: `${placement.origin.side} ${placement.origin.align}`,
|
|
282
305
|
top: toStyleSizeValue(pixelRound(y)),
|
|
283
306
|
left: isRtl.value ? undefined : toStyleSizeValue(pixelRound(x)),
|
|
284
307
|
right: isRtl.value ? toStyleSizeValue(pixelRound(-x)) : undefined,
|
|
285
|
-
minWidth: toStyleSizeValue(axis ===
|
|
308
|
+
minWidth: toStyleSizeValue(axis === "y" ? Math.min(minWidth.value, baseRect.width) : minWidth.value),
|
|
286
309
|
maxWidth: toStyleSizeValue(pixelCeil(clamp(available.x, minWidth.value === Infinity ? 0 : minWidth.value, maxWidth.value))),
|
|
287
310
|
maxHeight: toStyleSizeValue(pixelCeil(clamp(available.y, minHeight.value === Infinity ? 0 : minHeight.value, maxHeight.value)))
|
|
288
311
|
});
|
|
312
|
+
isFlipped.value = [flipped.x, flipped.y];
|
|
289
313
|
return {
|
|
290
314
|
available,
|
|
291
|
-
contentRect
|
|
315
|
+
contentRect,
|
|
316
|
+
flipped,
|
|
317
|
+
placement
|
|
292
318
|
};
|
|
293
319
|
}
|
|
294
|
-
watch(() => [props.offset, props.minWidth, props.minHeight, props.maxWidth, props.maxHeight], () => updateCoordinate());
|
|
320
|
+
watch(() => [props.offset, props.minWidth, props.minHeight, props.maxWidth, props.maxHeight, preferredAnchor.value, preferredOrigin.value], () => updateCoordinate());
|
|
295
321
|
nextTick(() => {
|
|
296
322
|
const result = updateCoordinate();
|
|
297
323
|
if (!result) return;
|
|
@@ -309,7 +335,10 @@ export function applyLevitation(props, state, coordinate, coordinateStyles) {
|
|
|
309
335
|
}
|
|
310
336
|
});
|
|
311
337
|
return {
|
|
312
|
-
updateCoordinate
|
|
338
|
+
updateCoordinate,
|
|
339
|
+
isFlipped,
|
|
340
|
+
preferredAnchor,
|
|
341
|
+
preferredOrigin
|
|
313
342
|
};
|
|
314
343
|
}
|
|
315
344
|
//# sourceMappingURL=levitation.js.map
|