@veltra/desktop 1.0.0

package/dist/components/list/list.js

@@ -0,0 +1,35 @@
+import _sfc_main$1 from "../scroll/scroll.js";
+import { Fragment, createBlock, createElementBlock, defineComponent, mergeProps, normalizeClass, openBlock, renderList, renderSlot, unref, withCtx } from "vue";
+import { bem } from "@veltra/utils";
+import { useFallbackProps } from "@veltra/compositions";
+//#region src/components/list/list.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "List",
+	__name: "list",
+	props: {
+		size: {},
+		data: {}
+	},
+	setup(__props) {
+		const { size } = useFallbackProps([__props], { size: "default" });
+		const cls = bem("list");
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(_sfc_main$1), {
+				tag: "ul",
+				class: normalizeClass([unref(cls).b, unref(cls).m(unref(size))])
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.data, (item, index) => {
+					return renderSlot(_ctx.$slots, "default", mergeProps({ ref_for: true }, {
+						item,
+						index
+					}));
+				}), 256))]),
+				_: 3
+			}, 8, ["class"]);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=list.js.map

package/dist/components/list/list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.js","names":[],"sources":["../../../src/components/list/list.vue"],"sourcesContent":["<template>\n  <u-scroll tag=\"ul\" :class=\"[cls.b, cls.m(size)]\">\n    <slot v-for=\"(item, index) of data\" v-bind=\"{ item, index }\" />\n  </u-scroll>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\n\nimport type { ListProps } from '../../types'\nimport type { ComponentSize } from '../../types'\nimport { UScroll } from '../scroll'\n\ndefineOptions({\n  name: 'List'\n})\n\nconst props = withDefaults(defineProps<ListProps>(), {})\n\nconst { size } = useFallbackProps([props], {\n  size: 'default' as ComponentSize\n})\n\nconst cls = bem('list')\n</script>\n"],"mappings":";;;;;;;;;;;;;EAoBA,MAAM,EAAE,SAAS,iBAAiB,CAFpB,QAE2B,EAAE,EACzC,MAAM,WACP,CAAA;EAED,MAAM,MAAM,IAAI,OAAM;;uBAvBpB,YAEW,MAAA,YAAA,EAAA;IAFD,KAAI;IAAM,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,GAAG,MAAA,IAAG,CAAC,EAAE,MAAA,KAAI,CAAA,CAAA,CAAA;;2BACR,EAAA,UAAA,KAAA,EAAnC,mBAA+D,UAAA,MAAA,WAAjC,QAAA,OAAhB,MAAM,UAAK;YAAzB,WAA+D,KAAA,QAAA,WAA/D,WAA+D,EAAA,SAAA,MAAA,EAAA;MAAjB;MAAM;MAAK,CAAA,CAAA"}

package/dist/components/list/list.vue.d.ts

@@ -0,0 +1,22 @@
+import { ListProps } from "../../types/list.js";
+import * as _$vue from "vue";
+
+//#region src/components/list/list.vue.d.ts
+declare var __VLS_8: {
+  item: Record<string, any>;
+  index: number;
+};
+type __VLS_Slots = {} & {
+  default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: _$vue.DefineComponent<ListProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<ListProps> & Readonly<{}>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+type __VLS_WithSlots<T, S> = T & {
+  new (): {
+    $slots: S;
+  };
+};
+//#endregion
+export { _default };
+//# sourceMappingURL=list.vue.d.ts.map

package/dist/components/list/style.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/list/style.js

@@ -0,0 +1 @@
+import "./style2.css";

package/dist/components/list/style2.css

@@ -0,0 +1,35 @@
+@charset "UTF-8";
+/** flex布局 */
+/**
+* 设置css变量
+* 参数1:变量前缀
+* 参数2: 一个由值组成的列表或者由key, value组成的map
+* css-var(height, (
+*   large: 40px
+*   default: 32px
+*   small: 24px
+* ))
+* 生成的css变量:
+* --u-height-large: 40px;
+* --u-height-default: 32px;
+* --u-height-small: 24px;
+*/
+/** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
+.u-list--small .u-list-item {
+  padding: 0 var(--u-gap-small);
+  border-radius: var(--u-radius-small);
+  height: var(--u-form-component-height-small);
+  line-height: var(--u-form-component-height-small);
+}
+.u-list--default .u-list-item {
+  padding: 0 var(--u-gap-default);
+  border-radius: var(--u-radius-default);
+  height: var(--u-form-component-height-default);
+  line-height: var(--u-form-component-height-default);
+}
+.u-list--large .u-list-item {
+  padding: 0 var(--u-gap-large);
+  border-radius: var(--u-radius-large);
+  height: var(--u-form-component-height-large);
+  line-height: var(--u-form-component-height-large);
+}

package/dist/components/loading/directive.d.ts

@@ -0,0 +1,7 @@
+import { ObjectDirective } from "vue";
+
+//#region src/components/loading/directive.d.ts
+declare const vLoading: ObjectDirective<HTMLElement>;
+//#endregion
+export { vLoading };
+//# sourceMappingURL=directive.d.ts.map

package/dist/components/loading/directive.js

@@ -0,0 +1,28 @@
+import _sfc_main from "./loading.js";
+import { createVNode, render } from "vue";
+import { bem } from "@veltra/utils";
+//#region src/components/loading/directive.ts
+const loadingContainerCls = bem("loading").e("container");
+function renderLoading(el, binding) {
+	el.classList.add(loadingContainerCls);
+	render(createVNode(_sfc_main, { type: binding.arg }), el);
+}
+function removeLoading(el) {
+	render(null, el);
+	el.classList.remove(loadingContainerCls);
+}
+const vLoading = {
+	mounted(el, binding) {
+		binding.value && renderLoading(el, binding);
+	},
+	updated(el, binding) {
+		binding.value ? renderLoading(el, binding) : removeLoading(el);
+	},
+	unmounted(el) {
+		removeLoading(el);
+	}
+};
+//#endregion
+export { vLoading };
+
+//# sourceMappingURL=directive.js.map

package/dist/components/loading/directive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"directive.js","names":["LoadingComponent"],"sources":["../../../src/components/loading/directive.ts"],"sourcesContent":["import { bem } from '@veltra/utils'\nimport { createVNode, render, type DirectiveBinding, type ObjectDirective } from 'vue'\n\nimport type { LoadingType } from '../../types'\nimport LoadingComponent from './loading.vue'\n\nconst loadingCls = bem('loading')\nconst loadingContainerCls = loadingCls.e('container')\n\nfunction renderLoading(el: HTMLElement, binding: DirectiveBinding) {\n  el.classList.add(loadingContainerCls)\n\n  const node = createVNode(LoadingComponent, { type: binding.arg as LoadingType })\n\n  render(node, el)\n}\n\nfunction removeLoading(el: HTMLElement) {\n  render(null, el)\n  el.classList.remove(loadingContainerCls)\n}\nexport const vLoading: ObjectDirective<HTMLElement> = {\n  mounted(el, binding) {\n    binding.value && renderLoading(el, binding)\n  },\n\n  updated(el, binding) {\n    binding.value ? renderLoading(el, binding) : removeLoading(el)\n  },\n\n  unmounted(el) {\n    removeLoading(el)\n  }\n}\n"],"mappings":";;;;AAOA,MAAM,sBADa,IAAI,UAAU,CACM,EAAE,YAAY;AAErD,SAAS,cAAc,IAAiB,SAA2B;AACjE,IAAG,UAAU,IAAI,oBAAoB;AAIrC,QAFa,YAAYA,WAAkB,EAAE,MAAM,QAAQ,KAAoB,CAAC,EAEnE,GAAG;;AAGlB,SAAS,cAAc,IAAiB;AACtC,QAAO,MAAM,GAAG;AAChB,IAAG,UAAU,OAAO,oBAAoB;;AAE1C,MAAa,WAAyC;CACpD,QAAQ,IAAI,SAAS;AACnB,UAAQ,SAAS,cAAc,IAAI,QAAQ;;CAG7C,QAAQ,IAAI,SAAS;AACnB,UAAQ,QAAQ,cAAc,IAAI,QAAQ,GAAG,cAAc,GAAG;;CAGhE,UAAU,IAAI;AACZ,gBAAc,GAAG;;CAEpB"}

package/dist/components/loading/index.d.ts

@@ -0,0 +1,2 @@
+import { _default } from "./loading.vue.js";
+import { vLoading } from "./directive.js";

package/dist/components/loading/loading.js

@@ -0,0 +1,37 @@
+import { Transition, computed, createBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, unref, withCtx } from "vue";
+import { bem, zIndex } from "@veltra/utils";
+import { useFallbackProps } from "@veltra/compositions";
+//#region src/components/loading/loading.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "Loading",
+	__name: "loading",
+	props: { type: { default: "spinner" } },
+	setup(__props) {
+		const props = __props;
+		const { size } = useFallbackProps([props], { size: "default" });
+		const cls = bem("loading");
+		const className = computed(() => {
+			return [
+				cls.b,
+				cls.m(size.value),
+				cls.e(props.type)
+			];
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Transition, {
+				name: "fade",
+				appear: ""
+			}, {
+				default: withCtx(() => [createElementVNode("div", {
+					class: normalizeClass(className.value),
+					style: normalizeStyle({ zIndex: unref(zIndex)() })
+				}, [createElementVNode("div", { class: normalizeClass(unref(cls).e("loader")) }, null, 2)], 6)]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=loading.js.map

package/dist/components/loading/loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading.js","names":[],"sources":["../../../src/components/loading/loading.vue"],"sourcesContent":["<template>\n  <transition name=\"fade\" appear>\n    <div :class=\"className\" :style=\"{ zIndex: zIndex() }\">\n      <div :class=\"cls.e('loader')\"></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFallbackProps } from '@veltra/compositions'\nimport { bem, zIndex } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { LoadingProps, ComponentSize } from '../../types'\n\ndefineOptions({\n  name: 'Loading'\n})\n\nconst props = withDefaults(defineProps<LoadingProps>(), {\n  type: 'spinner'\n})\n\nconst { size } = useFallbackProps([props], {\n  size: 'default' as ComponentSize\n})\n\nconst cls = bem('loading')\n\nconst className = computed(() => {\n  return [cls.b, cls.m(size.value), cls.e(props.type)]\n})\n</script>\n"],"mappings":";;;;;;;;;EAmBA,MAAM,QAAQ;EAId,MAAM,EAAE,SAAS,iBAAiB,CAAC,MAAM,EAAE,EACzC,MAAM,WACP,CAAA;EAED,MAAM,MAAM,IAAI,UAAS;EAEzB,MAAM,YAAY,eAAe;AAC/B,UAAO;IAAC,IAAI;IAAG,IAAI,EAAE,KAAK,MAAM;IAAE,IAAI,EAAE,MAAM,KAAK;IAAA;IACpD;;uBA9BC,YAIa,YAAA;IAJD,MAAK;IAAO,QAAA;;2BAGhB,CAFN,mBAEM,OAAA;KAFA,OAAK,eAAE,UAAA,MAAS;KAAG,OAAK,eAAA,EAAA,QAAY,MAAA,OAAM,EAAA,EAAA,CAAA;QAC9C,mBAAoC,OAAA,EAA9B,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,SAAA,CAAA,EAAA,EAAA,MAAA,EAAA,CAAA,EAAA,EAAA,CAAA,CAAA"}

package/dist/components/loading/loading.vue.d.ts

@@ -0,0 +1,11 @@
+import { LoadingProps, LoadingType } from "../../types/loading.js";
+import * as _$vue from "vue";
+
+//#region src/components/loading/loading.vue.d.ts
+declare const __VLS_export: _$vue.DefineComponent<LoadingProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<LoadingProps> & Readonly<{}>, {
+  type: LoadingType;
+}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default };
+//# sourceMappingURL=loading.vue.d.ts.map

package/dist/components/loading/style.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/loading/style.js

@@ -0,0 +1,2 @@
+import "./style2.css";
+import "@veltra/styles/anime/fade.scss";

package/dist/components/loading/style2.css

@@ -0,0 +1,228 @@
+@charset "UTF-8";
+/** flex布局 */
+/**
+* 设置css变量
+* 参数1:变量前缀
+* 参数2: 一个由值组成的列表或者由key, value组成的map
+* css-var(height, (
+*   large: 40px
+*   default: 32px
+*   small: 24px
+* ))
+* 生成的css变量:
+* --u-height-large: 40px;
+* --u-height-default: 32px;
+* --u-height-small: 24px;
+*/
+/** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
+.u-loading {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  background-color: var(--u-bg-color-top-alpha);
+  color: var(--u-text-color-main);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: nowrap;
+}
+.u-loading__container {
+  position: relative;
+}
+.u-loading__line .u-loading__loader {
+  width: 40px;
+  aspect-ratio: 1;
+  display: grid;
+}
+.u-loading__line .u-loading__loader::before, .u-loading__line .u-loading__loader::after {
+  content: "";
+  grid-area: 1/1;
+  --c: no-repeat linear-gradient(var(--u-text-color-main) 0 0);
+  background: var(--c) 0 0, var(--c) 100% 0, var(--c) 100% 100%, var(--c) 0 100%;
+  animation: line-1 2s infinite linear, line-2 2s infinite linear;
+}
+.u-loading__line .u-loading__loader::after {
+  margin: 25%;
+  transform: scale(-1);
+}
+.u-loading__spinner .u-loading__loader {
+  width: 50px;
+  aspect-ratio: 1;
+  display: grid;
+}
+.u-loading__spinner .u-loading__loader::before, .u-loading__spinner .u-loading__loader::after {
+  content: "";
+  grid-area: 1/1;
+  --c: no-repeat radial-gradient(farthest-side, var(--u-text-color-main) 92%, #0000);
+  background: var(--c) 50% 0, var(--c) 50% 100%, var(--c) 100% 50%, var(--c) 0 50%;
+  background-size: 12px 12px;
+  animation: spinner 1s infinite;
+}
+.u-loading__spinner .u-loading__loader::before {
+  margin: 4px;
+  filter: hue-rotate(45deg);
+  background-size: 8px 8px;
+  animation-timing-function: linear;
+}
+.u-loading__dot .u-loading__loader {
+  width: 40px;
+  height: 20px;
+  --c: no-repeat radial-gradient(farthest-side, var(--u-text-color-main) 93%, #0000);
+  background: var(--c) 0 0, var(--c) 50% 0;
+  background-size: 8px 8px;
+  position: relative;
+  clip-path: inset(-200% -100% 0 0);
+  animation: dot-0 1.5s linear infinite;
+}
+.u-loading__dot .u-loading__loader:before {
+  content: "";
+  position: absolute;
+  width: 8px;
+  height: 12px;
+  background: var(--u-text-color-main);
+  left: -16px;
+  top: 0;
+  animation: dot-1 1.5s linear infinite, dot-2 0.5s cubic-bezier(0, 200, 0.8, 200) infinite;
+}
+.u-loading__dot .u-loading__loader:after {
+  content: "";
+  position: absolute;
+  inset: 0 0 auto auto;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--u-text-color-main);
+  animation: dot-3 1.5s linear infinite;
+}
+.u-loading__classic .u-loading__loader {
+  --w: 6ch;
+  font-size: var(--u-font-size-title-default);
+  line-height: 1.4em;
+  letter-spacing: var(--w);
+  width: var(--w);
+  overflow: hidden;
+  white-space: nowrap;
+  color: rgba(0, 0, 0, 0);
+  text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  animation: classic 2s infinite linear;
+}
+.u-loading__classic .u-loading__loader::before {
+  content: "加载中...";
+}
+
+@keyframes line-1 {
+  0% {
+    background-size: 0 4px, 4px 0, 0 4px, 4px 0;
+  }
+  12.5% {
+    background-size: 100% 4px, 4px 0, 0 4px, 4px 0;
+  }
+  25% {
+    background-size: 100% 4px, 4px 100%, 0 4px, 4px 0;
+  }
+  37.5% {
+    background-size: 100% 4px, 4px 100%, 100% 4px, 4px 0;
+  }
+  45%, 55% {
+    background-size: 100% 4px, 4px 100%, 100% 4px, 4px 100%;
+  }
+  62.5% {
+    background-size: 0 4px, 4px 100%, 100% 4px, 4px 100%;
+  }
+  75% {
+    background-size: 0 4px, 4px 0, 100% 4px, 4px 100%;
+  }
+  87.5% {
+    background-size: 0 4px, 4px 0, 0 4px, 4px 100%;
+  }
+  100% {
+    background-size: 0 4px, 4px 0, 0 4px, 4px 0;
+  }
+}
+@keyframes line-2 {
+  0%, 49.9% {
+    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
+  }
+  50%, 100% {
+    background-position: 100% 0, 100% 100%, 0 100%, 0 0;
+  }
+}
+@keyframes spinner {
+  100% {
+    transform: rotate(0.5turn);
+  }
+}
+@keyframes classic {
+  9.09% {
+    text-shadow: calc(0 * var(--w)) -10px var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  18.18% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) -10px var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  27.27% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) -10px var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  36.36% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) -10px var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  45.45% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) -10px var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  54.54% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) -10px var(--u-text-color-main);
+  }
+  63.63% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  72.72% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  81.81% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+  90.90% {
+    text-shadow: calc(0 * var(--w)) 0 var(--u-text-color-main), calc(-1 * var(--w)) 0 var(--u-text-color-main), calc(-2 * var(--w)) 0 var(--u-text-color-main), calc(-3 * var(--w)) 0 var(--u-text-color-main), calc(-4 * var(--w)) 0 var(--u-text-color-main), calc(-5 * var(--w)) 0 var(--u-text-color-main);
+  }
+}
+@keyframes dot-0 {
+  0%, 30% {
+    background-position: 0 0, 50% 0;
+  }
+  33% {
+    background-position: 0 100%, 50% 0;
+  }
+  41%, 63% {
+    background-position: 0 0, 50% 0;
+  }
+  66% {
+    background-position: 0 0, 50% 100%;
+  }
+  74%, 100% {
+    background-position: 0 0, 50% 0;
+  }
+}
+@keyframes dot-1 {
+  90% {
+    transform: translateY(0);
+  }
+  95% {
+    transform: translateY(15px);
+  }
+  100% {
+    transform: translateY(15px);
+    left: calc(100% - 8px);
+  }
+}
+@keyframes dot-2 {
+  100% {
+    top: -0.1px;
+  }
+}
+@keyframes dot-3 {
+  0%, 80%, 100% {
+    transform: translate(0);
+  }
+  90% {
+    transform: translate(26px);
+  }
+}

package/dist/components/menu/di.js

@@ -0,0 +1,6 @@
+//#region src/components/menu/di.ts
+const MenuDIKey = Symbol("MenuDIKey");
+//#endregion
+export { MenuDIKey };
+
+//# sourceMappingURL=di.js.map

package/dist/components/menu/di.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"di.js","names":[],"sources":["../../../src/components/menu/di.ts"],"sourcesContent":["import type { BEM } from '@veltra/utils'\nimport type { ComputedRef, InjectionKey } from 'vue'\n\nimport type { MenuProps, MenuEmits } from '../../types'\nimport type { ComponentSize } from '../../types'\n\nexport interface MenuContext {\n  cls: BEM<'menu', 'u-'>\n  collapsedCls: BEM<'collapsed-menu', 'u-'>\n  menuProps: MenuProps\n  menuEmit: MenuEmits\n  expandedPath: Set<string>\n  size: ComputedRef<ComponentSize>\n}\n\nexport const MenuDIKey: InjectionKey<MenuContext> = Symbol('MenuDIKey')\n"],"mappings":";AAeA,MAAa,YAAuC,OAAO,YAAY"}

package/dist/components/menu/helper.js

@@ -0,0 +1,8 @@
+//#region src/components/menu/helper.ts
+function getKey(index, parentKey) {
+	return `${parentKey}-${index}`;
+}
+//#endregion
+export { getKey };
+
+//# sourceMappingURL=helper.js.map

package/dist/components/menu/helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.js","names":[],"sources":["../../../src/components/menu/helper.ts"],"sourcesContent":["export function getKey(index: number, parentKey: string): string {\n  return `${parentKey}-${index}`\n}\n"],"mappings":";AAAA,SAAgB,OAAO,OAAe,WAA2B;AAC/D,QAAO,GAAG,UAAU,GAAG"}

package/dist/components/menu/index.d.ts

@@ -0,0 +1,3 @@
+import { _default } from "./menu.vue.js";
+import { _default as _default$1 } from "./menu-sub.vue.js";
+import { _default as _default$2 } from "./menu-item.vue.js";

package/dist/components/menu/menu-icon.js

@@ -0,0 +1,25 @@
+import _sfc_main$1 from "../icon/icon.js";
+import { createBlock, createElementBlock, defineComponent, openBlock, resolveDynamicComponent, unref, withCtx } from "vue";
+//#region src/components/menu/menu-icon.vue
+const _hoisted_1 = ["src"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "MenuIcon",
+	__name: "menu-icon",
+	props: { icon: {} },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return typeof __props.icon !== "string" ? (openBlock(), createBlock(unref(_sfc_main$1), { key: 0 }, {
+				default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(__props.icon)))]),
+				_: 1
+			})) : (openBlock(), createElementBlock("img", {
+				key: 1,
+				src: __props.icon,
+				alt: "icon"
+			}, null, 8, _hoisted_1));
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=menu-icon.js.map

package/dist/components/menu/menu-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-icon.js","names":[],"sources":["../../../src/components/menu/menu-icon.vue"],"sourcesContent":["<template>\n  <u-icon v-if=\"typeof icon !== 'string'\">\n    <component :is=\"icon\" />\n  </u-icon>\n\n  <img :src=\"icon\" v-else alt=\"icon\" />\n</template>\n\n<script lang=\"ts\" setup>\nimport type { DefineComponent } from 'vue'\n\nimport { UIcon } from '../icon'\n\ndefineOptions({\n  name: 'MenuIcon'\n})\n\ndefineProps<{\n  icon: string | DefineComponent\n}>()\n</script>\n"],"mappings":";;;;;;;;;;iBACuB,QAAA,SAAI,YAAA,WAAA,EAAzB,YAES,MAAA,YAAA,EAAA,EAAA,KAAA,GAAA,EAAA;2BADiB,EAAA,WAAA,EAAxB,YAAwB,wBAAR,QAAA,KAAI,CAAA,EAAA,CAAA;;uBAGtB,mBAAqC,OAAA;;IAA/B,KAAK,QAAA;IAAa,KAAI"}

package/dist/components/menu/menu-item-collapsed.js

@@ -0,0 +1,73 @@
+import _sfc_main$1 from "../tip/tip.js";
+import _sfc_main$2 from "./menu-icon.js";
+import { useMenuItem } from "./use-menu-item.js";
+import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, useTemplateRef, withCtx } from "vue";
+import { bem } from "@veltra/utils";
+//#region src/components/menu/menu-item-collapsed.vue
+const _hoisted_1 = { key: 1 };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "MenuItemCollapsed",
+	__name: "menu-item-collapsed",
+	props: {
+		menu: {},
+		depth: {}
+	},
+	emits: ["click"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const itemRef = useTemplateRef("item");
+		const emit = __emit;
+		const { collapsedCls, active, handleClickMenu } = useMenuItem({
+			itemProps: props,
+			itemRef
+		});
+		function _handleClickMenu() {
+			handleClickMenu();
+			emit("click");
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createCommentVNode(" 一级菜单 "), __props.depth === 0 ? (openBlock(), createBlock(unref(_sfc_main$1), {
+				key: 0,
+				direction: "right",
+				"hide-arrow": ""
+			}, {
+				content: withCtx(() => [createTextVNode(toDisplayString(__props.menu.title), 1)]),
+				default: withCtx(() => [createElementVNode("li", {
+					class: normalizeClass([
+						unref(collapsedCls).e("item"),
+						unref(bem).is("active", unref(active)),
+						unref(bem).is("first-level"),
+						unref(bem).is("disabled", __props.menu.disabled ?? false)
+					]),
+					ref: "item",
+					onClick: _cache[0] || (_cache[0] = (...args) => unref(handleClickMenu) && unref(handleClickMenu)(...args))
+				}, [__props.menu.icon ? (openBlock(), createBlock(_sfc_main$2, {
+					key: 0,
+					icon: __props.menu.icon,
+					class: normalizeClass(unref(collapsedCls).e("icon"))
+				}, null, 8, ["icon", "class"])) : (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(__props.menu.title[0]), 1))], 2)]),
+				_: 1
+			})) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createCommentVNode(" 二级以及二级以下菜单 "), createElementVNode("li", {
+				class: normalizeClass([
+					unref(collapsedCls).e("item"),
+					unref(bem).is("active", unref(active)),
+					unref(bem).is("disabled", __props.menu.disabled ?? false)
+				]),
+				ref: "item",
+				onClick: _handleClickMenu
+			}, [
+				__props.menu.icon ? (openBlock(), createBlock(_sfc_main$2, {
+					key: 0,
+					icon: __props.menu.icon,
+					class: normalizeClass(unref(collapsedCls).e("icon"))
+				}, null, 8, ["icon", "class"])) : createCommentVNode("v-if", true),
+				createCommentVNode(" 文本 "),
+				createElementVNode("span", { class: normalizeClass(unref(collapsedCls).e("item-title")) }, toDisplayString(__props.menu.title), 3)
+			], 2)], 2112))], 2112);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=menu-item-collapsed.js.map

package/dist/components/menu/menu-item-collapsed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item-collapsed.js","names":[],"sources":["../../../src/components/menu/menu-item-collapsed.vue"],"sourcesContent":["<template>\n  <!-- 一级菜单 -->\n  <u-tip v-if=\"depth === 0\" direction=\"right\" hide-arrow>\n    <li\n      :class=\"[\n        collapsedCls.e('item'),\n        bem.is('active', active),\n        bem.is('first-level'),\n        bem.is('disabled', menu.disabled ?? false)\n      ]\"\n      ref=\"item\"\n      @click=\"handleClickMenu\"\n    >\n      <UMenuIcon v-if=\"menu.icon\" :icon=\"menu.icon\" :class=\"collapsedCls.e('icon')\" />\n      <span v-else>{{ menu.title[0] }}</span>\n    </li>\n\n    <template #content>\n      {{ menu.title }}\n    </template>\n  </u-tip>\n\n  <!-- 二级以及二级以下菜单 -->\n  <li\n    v-else\n    :class=\"[\n      collapsedCls.e('item'),\n      bem.is('active', active),\n      bem.is('disabled', menu.disabled ?? false)\n    ]\"\n    ref=\"item\"\n    @click=\"_handleClickMenu\"\n  >\n    <UMenuIcon v-if=\"menu.icon\" :icon=\"menu.icon\" :class=\"collapsedCls.e('icon')\" />\n\n    <!-- 文本 -->\n    <span :class=\"collapsedCls.e('item-title')\">\n      {{ menu.title }}\n    </span>\n  </li>\n</template>\n\n<script setup lang=\"ts\">\nimport { bem } from '@veltra/utils'\nimport { useTemplateRef } from 'vue'\n\nimport type { MenuItem } from '../../types'\nimport { UTip } from '../tip'\nimport UMenuIcon from './menu-icon.vue'\nimport { useMenuItem } from './use-menu-item'\n\ndefineOptions({ name: 'MenuItemCollapsed' })\n\nconst props = defineProps<{ menu: MenuItem; depth: number }>()\n\nconst itemRef = useTemplateRef('item')\n\nconst emit = defineEmits(['click'])\n\nconst { collapsedCls, active, handleClickMenu } = useMenuItem({ itemProps: props, itemRef })\n\nfunction _handleClickMenu() {\n  handleClickMenu()\n  emit('click')\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;EAqDA,MAAM,QAAQ;EAEd,MAAM,UAAU,eAAe,OAAM;EAErC,MAAM,OAAO;EAEb,MAAM,EAAE,cAAc,QAAQ,oBAAoB,YAAY;GAAE,WAAW;GAAO;GAAS,CAAA;EAE3F,SAAS,mBAAmB;AAC1B,oBAAgB;AAChB,QAAK,QAAO;;;2DA9DZ,mBAAA,SAAa,EACA,QAAA,UAAK,KAAA,WAAA,EAAlB,YAkBQ,MAAA,YAAA,EAAA;;IAlBkB,WAAU;IAAQ,cAAA;;IAe/B,SAAO,cACA,CAAA,gBAAA,gBAAb,QAAA,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;2BAHV,CAZL,mBAYK,MAAA;KAXF,OAAK,eAAA;MAAY,MAAA,aAAY,CAAC,EAAC,OAAA;MAAkB,MAAA,IAAG,CAAC,GAAE,UAAW,MAAA,OAAM,CAAA;MAAW,MAAA,IAAG,CAAC,GAAE,cAAA;MAAyB,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,KAAK,YAAQ,MAAA;;KAMnJ,KAAI;KACH,SAAK,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,MAAA,gBAAA,IAAA,MAAA,gBAAA,CAAA,GAAA,KAAe;QAEN,QAAA,KAAK,QAAA,WAAA,EAAtB,YAAgF,aAAA;;KAAnD,MAAM,QAAA,KAAK;KAAO,OAAK,eAAE,MAAA,aAAY,CAAC,EAAC,OAAA,CAAA;oDACpE,mBAAuC,QAAA,YAAA,gBAAvB,QAAA,KAAK,MAAK,GAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;uBAS9B,mBAgBK,UAAA,EAAA,KAAA,GAAA,EAAA,CAjBL,mBAAA,eAAmB,EACnB,mBAgBK,MAAA;IAdF,OAAK,eAAA;KAAU,MAAA,aAAY,CAAC,EAAC,OAAA;KAAgB,MAAA,IAAG,CAAC,GAAE,UAAW,MAAA,OAAM,CAAA;KAAS,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,KAAK,YAAQ,MAAA;;IAK9G,KAAI;IACH,SAAO;;IAES,QAAA,KAAK,QAAA,WAAA,EAAtB,YAAgF,aAAA;;KAAnD,MAAM,QAAA,KAAK;KAAO,OAAK,eAAE,MAAA,aAAY,CAAC,EAAC,OAAA,CAAA;;IAEpE,mBAAA,OAAW;IACX,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,aAAY,CAAC,EAAC,aAAA,CAAA,EAAA,EAAA,gBACvB,QAAA,KAAK,MAAK,EAAA,EAAA"}

package/dist/components/menu/menu-item.js

@@ -0,0 +1,43 @@
+import _sfc_main$1 from "./menu-icon.js";
+import { useMenuItem } from "./use-menu-item.js";
+import { createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, useTemplateRef } from "vue";
+import { bem } from "@veltra/utils";
+//#region src/components/menu/menu-item.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "MenuItem",
+	__name: "menu-item",
+	props: {
+		menu: {},
+		depth: {}
+	},
+	setup(__props) {
+		const { cls, active, handleClickMenu } = useMenuItem({
+			itemProps: __props,
+			itemRef: useTemplateRef("item")
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("li", {
+				class: normalizeClass([
+					unref(cls).e("item"),
+					unref(bem).is("first-level", __props.depth === 0),
+					unref(bem).is("active", unref(active)),
+					unref(bem).is("disabled", __props.menu.disabled ?? false)
+				]),
+				ref: "item",
+				onClick: _cache[0] || (_cache[0] = (...args) => unref(handleClickMenu) && unref(handleClickMenu)(...args))
+			}, [
+				__props.menu.icon ? (openBlock(), createBlock(_sfc_main$1, {
+					key: 0,
+					icon: __props.menu.icon,
+					class: normalizeClass(unref(cls).e("icon"))
+				}, null, 8, ["icon", "class"])) : createCommentVNode("v-if", true),
+				createCommentVNode(" 文本 "),
+				createElementVNode("span", { class: normalizeClass(unref(cls).e("item-title")) }, toDisplayString(__props.menu.title), 3)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=menu-item.js.map

package/dist/components/menu/menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.js","names":[],"sources":["../../../src/components/menu/menu-item.vue"],"sourcesContent":["<template>\n  <li\n    :class=\"[\n      cls.e('item'),\n      bem.is('first-level', depth === 0),\n      bem.is('active', active),\n      bem.is('disabled', menu.disabled ?? false)\n    ]\"\n    ref=\"item\"\n    @click=\"handleClickMenu\"\n  >\n    <MenuIcon v-if=\"menu.icon\" :icon=\"menu.icon\" :class=\"cls.e('icon')\" />\n\n    <!-- 文本 -->\n    <span :class=\"cls.e('item-title')\">\n      {{ menu.title }}\n    </span>\n  </li>\n</template>\n\n<script setup lang=\"ts\">\nimport { bem } from '@veltra/utils'\nimport { useTemplateRef } from 'vue'\n\nimport type { MenuItem } from '../../types'\nimport MenuIcon from './menu-icon.vue'\nimport { useMenuItem } from './use-menu-item'\n\ndefineOptions({ name: 'MenuItem' })\n\nconst props = defineProps<{ menu: MenuItem; depth: number }>()\n\nconst itemRef = useTemplateRef('item')\n\nconst { cls, active, handleClickMenu } = useMenuItem({ itemProps: props, itemRef })\n</script>\n"],"mappings":";;;;;;;;;;;;;EAkCA,MAAM,EAAE,KAAK,QAAQ,oBAAoB,YAAY;GAAE,WAJzC;GAI2D,SAFzD,eAAe,OAAM;GAE6C,CAAA;;uBAjChF,mBAgBK,MAAA;IAfF,OAAK,eAAA;KAAU,MAAA,IAAG,CAAC,EAAC,OAAA;KAAgB,MAAA,IAAG,CAAC,GAAE,eAAgB,QAAA,UAAK,EAAA;KAAe,MAAA,IAAG,CAAC,GAAE,UAAW,MAAA,OAAM,CAAA;KAAS,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,KAAK,YAAQ,MAAA;;IAM/I,KAAI;IACH,SAAK,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,MAAA,gBAAA,IAAA,MAAA,gBAAA,CAAA,GAAA,KAAe;;IAEP,QAAA,KAAK,QAAA,WAAA,EAArB,YAAsE,aAAA;;KAA1C,MAAM,QAAA,KAAK;KAAO,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;;IAE1D,mBAAA,OAAW;IACX,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,aAAA,CAAA,EAAA,EAAA,gBACd,QAAA,KAAK,MAAK,EAAA,EAAA"}

package/dist/components/menu/menu-item.vue.d.ts

@@ -0,0 +1,13 @@
+import { MenuItem } from "../../types/menu.js";
+import * as _$vue from "vue";
+
+//#region src/components/menu/menu-item.vue.d.ts
+type __VLS_Props = {
+  menu: MenuItem;
+  depth: number;
+};
+declare const __VLS_export: _$vue.DefineComponent<__VLS_Props, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default };
+//# sourceMappingURL=menu-item.vue.d.ts.map