@touchvue/ui 1.0.0-beta.5 → 1.0.0-beta.50

package/es/packages/components/timeline/src/timeline.vue.mjs

@@ -1,101 +1,144 @@
 import _sfc_main from './timeline.vue2.mjs';
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, Fragment, renderList, toDisplayString, createCommentVNode, createBlock, withCtx, createTextVNode, renderSlot } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, normalizeStyle, createCommentVNode, createElementVNode, toDisplayString, createVNode, withCtx, createTextVNode, renderSlot } from 'vue';
 import _export_sfc from '../../../../_virtual/_plugin-vue_export-helper.mjs';
 
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_to_icon = resolveComponent("to-icon");
   return openBlock(), createElementBlock("div", {
-    class: normalizeClass(["to-timeline", [_ctx.timelineClasses, _ctx.customClass]]),
-    style: normalizeStyle(_ctx.customStyle)
+    class: normalizeClass(["to-timeline", _ctx.getClass]),
+    flex: _ctx.flex ? _ctx.flex : null
   }, [
-    createElementVNode("ul", null, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.displayItems, (item, index) => {
-        return openBlock(), createElementBlock("li", {
+    (openBlock(true), createElementBlock(
+      Fragment,
+      null,
+      renderList(_ctx.displayItems, (item, index) => {
+        return openBlock(), createElementBlock("div", {
           key: index,
-          class: normalizeClass([_ctx.getItemClass(item), { "is-active": item.active }]),
+          class: "to-timeline-item",
+          style: normalizeStyle(_ctx.getItemStyle()),
           onClick: ($event) => _ctx.handleItemClick(item, index)
         }, [
+          createCommentVNode(" \u5916\u90E8\u65F6\u95F4\u663E\u793A "),
           _ctx.showTimeOutside(item) ? (openBlock(), createElementBlock("div", {
             key: 0,
             class: "to-timeline-datetime"
           }, [
-            item.date ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-              createElementVNode("div", { class: "to-timeline-date" }, toDisplayString(item.date), 1),
-              item.time ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                class: "to-timeline-time"
-              }, toDisplayString(item.time), 1)) : createCommentVNode("", true)
-            ], 64)) : item.time ? (openBlock(), createElementBlock("div", {
-              key: 1,
-              class: "to-timeline-time"
-            }, toDisplayString(item.time), 1)) : createCommentVNode("", true)
-          ])) : createCommentVNode("", true),
-          createElementVNode("div", { class: "to-timeline-node" }, [
-            item.icon || item.text ? (openBlock(), createBlock(_component_to_icon, {
+            item.date ? (openBlock(), createElementBlock("div", {
               key: 0,
-              value: item.icon,
-              color: item.color || "primary",
-              mode: _ctx.getIconMode(item),
-              class: normalizeClass(_ctx.nodeIconClass),
-              fillet: "round"
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(item.text), 1)
-              ]),
-              _: 2
-            }, 1032, ["value", "color", "mode", "class"])) : (openBlock(), createElementBlock("div", {
+              class: "to-timeline-date"
+            }, [
+              createElementVNode(
+                "div",
+                { class: "to-timeline-date-text" },
+                toDisplayString(item.date),
+                1
+                /* TEXT */
+              )
+            ])) : createCommentVNode("v-if", true),
+            item.time ? (openBlock(), createElementBlock("div", {
               key: 1,
-              class: "to-timeline-dot",
-              style: normalizeStyle(_ctx.getDotStyle(item))
-            }, null, 4))
-          ]),
-          _ctx.showItemLine(item) ? (openBlock(), createElementBlock("div", {
-            key: 1,
-            class: normalizeClass(["to-timeline-line", _ctx.lineClass]),
-            style: normalizeStyle(_ctx.getLineStyle(item))
-          }, null, 6)) : createCommentVNode("", true),
-          createElementVNode("div", {
-            class: normalizeClass(["to-timeline-main", { "has-datetime": _ctx.showTimeInside(item) }]),
-            style: normalizeStyle(_ctx.getItemStyle(item))
-          }, [
+              class: "to-timeline-time"
+            }, [
+              createElementVNode(
+                "div",
+                { class: "to-timeline-time-text" },
+                toDisplayString(item.time),
+                1
+                /* TEXT */
+              )
+            ])) : createCommentVNode("v-if", true)
+          ])) : createCommentVNode("v-if", true),
+          createCommentVNode(" \u56FE\u6807 "),
+          createVNode(_component_to_icon, {
+            class: "to-timeline-icon",
+            value: item.icon,
+            color: item.color,
+            mode: item.mode
+          }, {
+            default: withCtx(() => [
+              createTextVNode(
+                toDisplayString(item.text),
+                1
+                /* TEXT */
+              )
+            ]),
+            _: 2
+            /* DYNAMIC */
+          }, 1032, ["value", "color", "mode"]),
+          createCommentVNode(" \u4E3B\u5185\u5BB9\u533A\u57DF "),
+          createElementVNode("div", { class: "to-timeline-main" }, [
+            createCommentVNode(" \u5185\u90E8\u65F6\u95F4\u663E\u793A "),
             _ctx.showTimeInside(item) ? (openBlock(), createElementBlock("div", {
               key: 0,
               class: "to-timeline-datetime"
             }, [
-              item.date ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-                createElementVNode("div", { class: "to-timeline-date" }, toDisplayString(item.date), 1),
-                item.time ? (openBlock(), createElementBlock("div", {
-                  key: 0,
-                  class: "to-timeline-time"
-                }, toDisplayString(item.time), 1)) : createCommentVNode("", true)
-              ], 64)) : item.time ? (openBlock(), createElementBlock("div", {
+              item.date ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: "to-timeline-date"
+              }, [
+                createElementVNode(
+                  "div",
+                  { class: "to-timeline-date-text" },
+                  toDisplayString(item.date),
+                  1
+                  /* TEXT */
+                )
+              ])) : createCommentVNode("v-if", true),
+              item.time ? (openBlock(), createElementBlock("div", {
                 key: 1,
                 class: "to-timeline-time"
-              }, toDisplayString(item.time), 1)) : createCommentVNode("", true)
-            ])) : createCommentVNode("", true),
-            createElementVNode("div", {
-              class: normalizeClass(["to-timeline-content", _ctx.contentClass]),
-              style: normalizeStyle(item.style)
-            }, [
-              item.content ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-                createTextVNode(toDisplayString(item.content), 1)
-              ], 64)) : createCommentVNode("", true),
-              renderSlot(_ctx.$slots, _ctx.getSlotName(index), {
-                item,
-                index
-              }),
-              renderSlot(_ctx.$slots, "default", {
-                item,
-                index
-              })
-            ], 6)
-          ], 6)
-        ], 10, ["onClick"]);
-      }), 128))
-    ])
-  ], 6);
+              }, [
+                createElementVNode(
+                  "div",
+                  { class: "to-timeline-time-text" },
+                  toDisplayString(item.time),
+                  1
+                  /* TEXT */
+                )
+              ])) : createCommentVNode("v-if", true)
+            ])) : createCommentVNode("v-if", true),
+            createCommentVNode(" \u5185\u5BB9\u533A\u57DF "),
+            createElementVNode(
+              "div",
+              {
+                class: "to-timeline-content",
+                style: normalizeStyle(item.style)
+              },
+              [
+                item.content ? (openBlock(), createElementBlock(
+                  Fragment,
+                  { key: 0 },
+                  [
+                    createTextVNode(
+                      toDisplayString(item.content),
+                      1
+                      /* TEXT */
+                    )
+                  ],
+                  64
+                  /* STABLE_FRAGMENT */
+                )) : createCommentVNode("v-if", true),
+                renderSlot(_ctx.$slots, "default", {
+                  item,
+                  index
+                })
+              ],
+              4
+              /* STYLE */
+            )
+          ]),
+          index < _ctx.displayItems.length - 1 || _ctx.tail ? (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: "to-timeline-line"
+          })) : createCommentVNode("v-if", true)
+        ], 12, ["onClick"]);
+      }),
+      128
+      /* KEYED_FRAGMENT */
+    ))
+  ], 10, ["flex"]);
 }
-var Timeline = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+var Timeline = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "timeline.vue"]]);
 
 export { Timeline as default };
 //# sourceMappingURL=timeline.vue.mjs.map

package/es/packages/components/timeline/src/timeline.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"timeline.vue.mjs","sources":["../../../../../../packages/components/timeline/src/timeline.vue"],"sourcesContent":["<template>\n\t<div class=\"to-timeline\" :class=\"[timelineClasses, customClass]\" :style=\"customStyle\">\n\t\t<ul>\n\t\t\t<li\n\t\t\t\tv-for=\"(item, index) in displayItems\"\n\t\t\t\t:key=\"index\"\n\t\t\t\t:class=\"[getItemClass(item), { 'is-active': item.active }]\"\n\t\t\t\t@click=\"handleItemClick(item, index)\"\n\t\t\t>\n\t\t\t\t<!-- 外部时间显示 -->\n\t\t\t\t<div v-if=\"showTimeOutside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t\t<template v-if=\"item.date\">\n\t\t\t\t\t\t<div class=\"to-timeline-date\">{{ item.date }}</div>\n\t\t\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t</template>\n\t\t\t\t\t<template v-else-if=\"item.time\">\n\t\t\t\t\t\t<div class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t</template>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- 图标 -->\n\t\t\t\t<div class=\"to-timeline-node\">\n\t\t\t\t\t<to-icon\n\t\t\t\t\t\tv-if=\"item.icon || item.text\"\n\t\t\t\t\t\t:value=\"item.icon\"\n\t\t\t\t\t\t:color=\"item.color || 'primary'\"\n\t\t\t\t\t\t:mode=\"getIconMode(item)\"\n\t\t\t\t\t\t:class=\"nodeIconClass\"\n\t\t\t\t\t\tfillet=\"round\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{{ item.text }}\n\t\t\t\t\t</to-icon>\n\t\t\t\t\t<div v-else class=\"to-timeline-dot\" :style=\"getDotStyle(item)\"></div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- 连接线 -->\n\t\t\t\t<div\n\t\t\t\t\tv-if=\"showItemLine(item)\"\n\t\t\t\t\tclass=\"to-timeline-line\"\n\t\t\t\t\t:class=\"lineClass\"\n\t\t\t\t\t:style=\"getLineStyle(item)\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- 主内容区域 -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"to-timeline-main\"\n\t\t\t\t\t:class=\"{ 'has-datetime': showTimeInside(item) }\"\n\t\t\t\t\t:style=\"getItemStyle(item)\"\n\t\t\t\t>\n\t\t\t\t\t<!-- 内部时间显示 -->\n\t\t\t\t\t<div v-if=\"showTimeInside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t\t\t<template v-if=\"item.date\">\n\t\t\t\t\t\t\t<div class=\"to-timeline-date\">{{ item.date }}</div>\n\t\t\t\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template v-else-if=\"item.time\">\n\t\t\t\t\t\t\t<div class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<!-- 内容区域 -->\n\t\t\t\t\t<div class=\"to-timeline-content\" :class=\"contentClass\" :style=\"item.style\">\n\t\t\t\t\t\t<template v-if=\"item.content\">{{ item.content }}</template>\n\t\t\t\t\t\t<slot :name=\"getSlotName(index)\" :item=\"item\" :index=\"index\"></slot>\n\t\t\t\t\t\t<slot name=\"default\" :item=\"item\" :index=\"index\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, PropType, watch, onMounted, nextTick } from 'vue'\nimport { ToIcon } from '../../icon'\nimport type {\n\tTimelineItem,\n\tTimelineTimePosition,\n\tTimelineDirection,\n\tTimelineAlign,\n\tTimelineMode,\n} from './timeline'\n\nexport default defineComponent({\n\tname: 'ToTimeline',\n\tcomponents: {\n\t\tToIcon,\n\t},\n\tprops: {\n\t\tdata: {\n\t\t\ttype: Array as PropType<TimelineItem[]>,\n\t\t\tdefault: () => [],\n\t\t},\n\t\ttimePosition: {\n\t\t\ttype: String as PropType<TimelineTimePosition>,\n\t\t\tdefault: 'in',\n\t\t\tvalidator: (val: string) => ['in', 'out'].includes(val),\n\t\t},\n\t\ttype: {\n\t\t\ttype: String as PropType<TimelineDirection>,\n\t\t\tdefault: 'v',\n\t\t\tvalidator: (val: string) => ['v', 'h', ''].includes(val),\n\t\t},\n\t\tmode: {\n\t\t\ttype: String as PropType<TimelineMode>,\n\t\t\tdefault: '',\n\t\t\tvalidator: (val: string) => ['', 'plain', 'line', 'fill'].includes(val),\n\t\t},\n\t\talign: {\n\t\t\ttype: String as PropType<TimelineAlign>,\n\t\t\tdefault: 'left',\n\t\t\tvalidator: (val: string) => ['left', 'center', 'right'].includes(val),\n\t\t},\n\t\titemWidth: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: '',\n\t\t},\n\t\treverse: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\tshowLine: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t\tlineColor: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\tlineStyle: {\n\t\t\ttype: String,\n\t\t\tdefault: 'solid',\n\t\t\tvalidator: (val: string) => ['solid', 'dashed', 'dotted'].includes(val),\n\t\t},\n\t\tclassName: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\tstyle: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\t},\n\temits: ['click', 'item-rendered'],\n\tsetup(props, { emit }) {\n\t\t// 处理数据顺序\n\t\tconst displayItems = computed(() => {\n\t\t\tif (props.reverse) {\n\t\t\t\treturn [...props.data].reverse()\n\t\t\t}\n\t\t\treturn props.data\n\t\t})\n\n\t\t// 组件基础类名\n\t\tconst timelineClasses = computed(() => {\n\t\t\tconst classArray = []\n\n\t\t\t// 布局类型\n\t\t\tif (props.type === 'h') {\n\t\t\t\tclassArray.push('to-timeline-horizontal')\n\t\t\t} else {\n\t\t\t\tclassArray.push('to-timeline-vertical')\n\t\t\t}\n\n\t\t\t// 时间位置\n\t\t\tif (props.timePosition === 'out') {\n\t\t\t\tclassArray.push('to-timeline-time-position-out')\n\t\t\t}\n\n\t\t\t// 对齐方式\n\t\t\tif (props.align === 'center') {\n\t\t\t\tclassArray.push('to-timeline-align-center')\n\t\t\t} else if (props.align === 'right') {\n\t\t\t\tclassArray.push('to-timeline-align-right')\n\t\t\t}\n\n\t\t\t// 等分宽度 - 只在水平布局时应用\n\t\t\tif (props.type === 'h' && props.itemWidth === 'avg') {\n\t\t\t\tclassArray.push('to-timeline-item-width-avg')\n\t\t\t}\n\n\t\t\t// 全局模式类\n\t\t\tif (props.mode) {\n\t\t\t\tclassArray.push(`to-timeline-mode-${props.mode}`)\n\t\t\t}\n\n\t\t\t// 是否显示连接线\n\t\t\tif (!props.showLine) {\n\t\t\t\tclassArray.push('to-timeline-no-line')\n\t\t\t}\n\n\t\t\treturn classArray\n\t\t})\n\n\t\t// 自定义类名\n\t\tconst customClass = computed(() => props.className || '')\n\n\t\t// 自定义样式\n\t\tconst customStyle = computed(() => props.style || {})\n\n\t\t// 图标类名\n\t\tconst nodeIconClass = computed(() => {\n\t\t\treturn 'to-timeline-icon'\n\t\t})\n\n\t\t// 线条类名\n\t\tconst lineClass = computed(() => {\n\t\t\treturn `to-timeline-line-${props.lineStyle}`\n\t\t})\n\n\t\t// 内容类名\n\t\tconst contentClass = computed(() => {\n\t\t\treturn 'to-timeline-content-inner'\n\t\t})\n\n\t\t// 获取节点样式\n\t\tconst getItemClass = (item: TimelineItem) => {\n\t\t\tconst classArray: string[] = []\n\n\t\t\t// 小图标模式\n\t\t\tif ((!item.icon && !item.text) || Number(item.level) === 2) {\n\t\t\t\tclassArray.push('to-timeline-item-small')\n\t\t\t}\n\n\t\t\t// 用户自定义类名\n\t\t\tif (item.className) {\n\t\t\t\tclassArray.push(item.className)\n\t\t\t}\n\n\t\t\treturn classArray\n\t\t}\n\n\t\t// 获取图标模式\n\t\tconst getIconMode = (item: TimelineItem) => {\n\t\t\t// 优先使用全局模式，如果未设置则使用项目自身模式\n\t\t\tif (props.mode) {\n\t\t\t\treturn props.mode\n\t\t\t}\n\n\t\t\t// 如果未设置模式或模式无效，根据颜色决定默认模式\n\t\t\tif (!item.mode || !['plain', 'line', 'fill'].includes(item.mode)) {\n\t\t\t\t// 当使用预设主题色时，默认使用fill模式，否则使用line模式\n\t\t\t\tconst themeColors = ['primary', 'success', 'warning', 'danger', 'info']\n\t\t\t\treturn themeColors.includes(item.color || 'primary') ? 'fill' : 'line'\n\t\t\t}\n\t\t\treturn item.mode\n\t\t}\n\n\t\t// 获取线条样式\n\t\tconst getLineStyle = (item: TimelineItem) => {\n\t\t\tif (props.lineColor || (item.color && item.color !== 'primary')) {\n\t\t\t\treturn {\n\t\t\t\t\tbackgroundColor: props.lineColor || getColorValue(item.color),\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn {}\n\t\t}\n\n\t\t// 获取节点样式\n\t\tconst getDotStyle = (item: TimelineItem) => {\n\t\t\tif (item.color) {\n\t\t\t\treturn {\n\t\t\t\t\tbackgroundColor: getColorValue(item.color),\n\t\t\t\t\tboxShadow: `0 0 0 3px ${getColorValue(item.color)}1A`, // 添加10%透明度的阴影\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn {}\n\t\t}\n\n\t\t// 辅助方法：从颜色名获取颜色值\n\t\tconst getColorValue = (color: string) => {\n\t\t\tconst themeColors = {\n\t\t\t\tprimary: 'var(--color-primary)',\n\t\t\t\tsuccess: 'var(--color-success)',\n\t\t\t\twarning: 'var(--color-warning)',\n\t\t\t\tdanger: 'var(--color-danger)',\n\t\t\t\tinfo: 'var(--color-info)',\n\t\t\t}\n\t\t\treturn themeColors[color as keyof typeof themeColors] || color\n\t\t}\n\n\t\t// 获取内容样式\n\t\tconst getItemStyle = (item: TimelineItem) => {\n\t\t\tconst style: Record<string, string> = {}\n\n\t\t\t// 处理宽度设置 - 仅在水平布局时有效\n\t\t\tif (props.type === 'h' && props.itemWidth && props.itemWidth !== 'avg') {\n\t\t\t\tif (!isNaN(Number(props.itemWidth))) {\n\t\t\t\t\tstyle.width = props.itemWidth + 'em'\n\t\t\t\t} else {\n\t\t\t\t\tstyle.width = props.itemWidth.toString()\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// 合并项目自身的样式\n\t\t\tif (item.style) {\n\t\t\t\tObject.assign(style, item.style)\n\t\t\t}\n\n\t\t\treturn style\n\t\t}\n\n\t\t// 判断是否显示外部时间\n\t\tconst showTimeOutside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'out' && (item.date || item.time)\n\t\t}\n\n\t\t// 判断是否显示内部时间\n\t\tconst showTimeInside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'in' && (item.date || item.time)\n\t\t}\n\n\t\t// 判断是否显示连接线\n\t\tconst showItemLine = (item: TimelineItem) => {\n\t\t\treturn props.showLine && item.showLine !== false\n\t\t}\n\n\t\t// 获取具名插槽名称\n\t\tconst getSlotName = (index: number) => {\n\t\t\treturn `item-${index}`\n\t\t}\n\n\t\t// 点击事件处理\n\t\tconst handleItemClick = (item: TimelineItem, index: number) => {\n\t\t\temit('click', item, index)\n\t\t}\n\n\t\t// 监听数据变化\n\t\twatch(\n\t\t\t() => props.data,\n\t\t\t() => {\n\t\t\t\tnextTick(() => {\n\t\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t\t})\n\t\t\t\t})\n\t\t\t},\n\t\t\t{ immediate: false, deep: true }\n\t\t)\n\n\t\t// 初始化时触发渲染完成事件\n\t\tonMounted(() => {\n\t\t\tnextTick(() => {\n\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t})\n\t\t\t})\n\t\t})\n\n\t\treturn {\n\t\t\tdisplayItems,\n\t\t\ttimelineClasses,\n\t\t\tcustomClass,\n\t\t\tcustomStyle,\n\t\t\tnodeIconClass,\n\t\t\tlineClass,\n\t\t\tcontentClass,\n\t\t\tgetItemClass,\n\t\t\tgetIconMode,\n\t\t\tgetItemStyle,\n\t\t\tgetLineStyle,\n\t\t\tgetDotStyle,\n\t\t\tshowTimeOutside,\n\t\t\tshowTimeInside,\n\t\t\tshowItemLine,\n\t\t\tgetSlotName,\n\t\t\thandleItemClick,\n\t\t}\n\t},\n})\n</script>\n"],"names":["_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createElementVNode","_Fragment","_renderList","getItemClass","showTimeOutside","_toDisplayString","_createCommentVNode","_createBlock","getIconMode","showItemLine","getItemStyle","showTimeInside","_renderSlot"],"mappings":"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"}
+{"version":3,"file":"timeline.vue.mjs","sources":["../../../../../../packages/components/timeline/src/timeline.vue"],"sourcesContent":["<template>\n\t<div class=\"to-timeline\" :flex=\"flex ? flex : null\" :class=\"getClass\">\n\t\t<div v-for=\"(item, index) in displayItems\" :key=\"index\" class=\"to-timeline-item\" :style=\"getItemStyle()\" @click=\"handleItemClick(item, index)\">\n\t\t\t<!-- 外部时间显示 -->\n\t\t\t<div v-if=\"showTimeOutside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t<div v-if=\"item.date\" class=\"to-timeline-date\">\n\t\t\t\t\t<div class=\"to-timeline-date-text\">{{ item.date }}</div>\n\t\t\t\t</div>\n\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">\n\t\t\t\t\t<div class=\"to-timeline-time-text\">{{ item.time }}</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<!-- 图标 -->\n\t\t\t<to-icon class=\"to-timeline-icon\" :value=\"item.icon\" :color=\"item.color\" :mode=\"item.mode\">\n\t\t\t\t{{ item.text }}\n\t\t\t</to-icon>\n\n\t\t\t<!-- 主内容区域 -->\n\t\t\t<div class=\"to-timeline-main\">\n\t\t\t\t<!-- 内部时间显示 -->\n\t\t\t\t<div v-if=\"showTimeInside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t\t<div v-if=\"item.date\" class=\"to-timeline-date\">\n\t\t\t\t\t\t<div class=\"to-timeline-date-text\">{{ item.date }}</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">\n\t\t\t\t\t\t<div class=\"to-timeline-time-text\">{{ item.time }}</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- 内容区域 -->\n\t\t\t\t<div class=\"to-timeline-content\" :style=\"item.style\">\n\t\t\t\t\t<template v-if=\"item.content\">{{ item.content }}</template>\n\t\t\t\t\t<slot name=\"default\" :item=\"item\" :index=\"index\"></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div v-if=\"index < displayItems.length - 1 || tail\" class=\"to-timeline-line\"></div>\n\t\t</div>\n\t</div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, PropType, watch, onMounted, nextTick } from 'vue'\nimport { ToIcon } from '../../icon'\nimport type { TimelineItem, TimelineTimePosition, TimelineDirection, TimelineAlign, TimelineMode } from './timeline'\n\nexport default defineComponent({\n\tname: 'ToTimeline',\n\tcomponents: {\n\t\tToIcon\n\t},\n\tprops: {\n\t\tflex: Boolean,\n\t\tdata: {\n\t\t\ttype: Array as PropType<TimelineItem[]>,\n\t\t\tdefault: () => []\n\t\t},\n\t\ttimePosition: {\n\t\t\ttype: String as PropType<TimelineTimePosition>,\n\t\t\tdefault: 'in',\n\t\t\tvalidator: (val: string) => ['in', 'out'].includes(val)\n\t\t},\n\t\tdir: {\n\t\t\ttype: String as PropType<TimelineDirection>,\n\t\t\tdefault: 'v',\n\t\t\tvalidator: (val: string) => ['v', 'h', ''].includes(val)\n\t\t},\n\t\tmode: {\n\t\t\ttype: String as PropType<TimelineMode>,\n\t\t\tdefault: ''\n\t\t},\n\t\talign: {\n\t\t\ttype: String as PropType<TimelineAlign>,\n\t\t\tdefault: 'left',\n\t\t\tvalidator: (val: string) => ['left', 'center', 'right'].includes(val)\n\t\t},\n\t\titemWidth: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: ''\n\t\t},\n\t\treverse: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t\ttail: Boolean\n\t},\n\temits: ['click', 'item-rendered'],\n\tsetup(props, { emit }) {\n\t\t// 处理数据顺序\n\t\tconst displayItems = computed(() => {\n\t\t\tif (props.reverse) {\n\t\t\t\treturn [...props.data].reverse()\n\t\t\t}\n\t\t\treturn props.data\n\t\t})\n\n\t\t// 组件基础类名\n\t\tconst getClass = computed(() => {\n\t\t\tconst classArray = []\n\n\t\t\t// 布局类型\n\t\t\tif (props.dir === 'h') {\n\t\t\t\tclassArray.push('dir-h')\n\t\t\t}\n\n\t\t\t// 时间位置\n\t\t\tif (props.timePosition === 'out') {\n\t\t\t\tclassArray.push('time-position-out')\n\t\t\t}\n\n\t\t\t// 对齐方式\n\t\t\tif (props.align === 'center') {\n\t\t\t\tclassArray.push('align-center')\n\t\t\t} else if (props.align === 'right') {\n\t\t\t\tclassArray.push('align-right')\n\t\t\t}\n\n\t\t\t// 全局模式类\n\t\t\tif (props.mode) {\n\t\t\t\tclassArray.push(`mode-${props.mode}`)\n\t\t\t}\n\n\t\t\t// 是否含有 date\n\t\t\tif (props.data.some(item => item.date)) {\n\t\t\t\tclassArray.push(`has-date`)\n\t\t\t}\n\n\t\t\t// 是否含有 time\n\t\t\tif (props.data.some(item => item.time)) {\n\t\t\t\tclassArray.push(`has-time`)\n\t\t\t}\n\n\t\t\t// 是否设置 item-width\n\t\t\tif (props.itemWidth) {\n\t\t\t\tclassArray.push(`is-item-width`)\n\t\t\t}\n\n\t\t\treturn classArray\n\t\t})\n\n\t\t// 获取图标模式\n\t\tconst getIconMode = (item: TimelineItem) => {\n\t\t\t// 优先使用全局模式，如果未设置则使用项目自身模式\n\t\t\tif (props.mode) {\n\t\t\t\treturn props.mode\n\t\t\t}\n\t\t\treturn item.mode\n\t\t}\n\n\t\t// 获取内容样式\n\t\tconst getItemStyle = () => {\n\t\t\tconst style: Record<string, string> = {}\n\n\t\t\t// 处理宽度设置 - 仅在水平布局时有效\n\t\t\tif (props.dir === 'h' && props.itemWidth) {\n\t\t\t\tif (!isNaN(Number(props.itemWidth))) {\n\t\t\t\t\tstyle.width = props.itemWidth + 'em'\n\t\t\t\t} else {\n\t\t\t\t\tstyle.width = props.itemWidth.toString()\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn style\n\t\t}\n\n\t\t// 判断是否显示外部时间\n\t\tconst showTimeOutside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'out' && (item.date || item.time)\n\t\t}\n\n\t\t// 判断是否显示内部时间\n\t\tconst showTimeInside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'in' && (item.date || item.time)\n\t\t}\n\n\t\t// 点击事件处理\n\t\tconst handleItemClick = (item: TimelineItem, index: number) => {\n\t\t\temit('click', item, index)\n\t\t}\n\n\t\t// 监听数据变化\n\t\twatch(\n\t\t\t() => props.data,\n\t\t\t() => {\n\t\t\t\tnextTick(() => {\n\t\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t\t})\n\t\t\t\t})\n\t\t\t},\n\t\t\t{ immediate: false, deep: true }\n\t\t)\n\n\t\t// 初始化时触发渲染完成事件\n\t\tonMounted(() => {\n\t\t\tnextTick(() => {\n\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t})\n\t\t\t})\n\t\t})\n\n\t\treturn {\n\t\t\tdisplayItems,\n\t\t\tgetClass,\n\t\t\tgetIconMode,\n\t\t\tgetItemStyle,\n\t\t\tshowTimeOutside,\n\t\t\tshowTimeInside,\n\t\t\thandleItemClick\n\t\t}\n\t}\n})\n</script>\n"],"names":["_resolveComponent","flex","_normalizeClass","_createElementBlock","_Fragment","_renderList","_openBlock","_normalizeStyle","showTimeOutside","_createCommentVNode","_createVNode","_createElementVNode","showTimeInside","_renderSlot","displayItems"],"mappings":"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"}

package/es/packages/components/timeline/src/timeline.vue2.mjs

@@ -7,6 +7,7 @@ var _sfc_main = defineComponent({
     ToIcon
   },
   props: {
+    flex: Boolean,
     data: {
       type: Array,
       default: () => []
@@ -16,15 +17,14 @@ var _sfc_main = defineComponent({
       default: "in",
       validator: (val) => ["in", "out"].includes(val)
     },
-    type: {
+    dir: {
       type: String,
       default: "v",
       validator: (val) => ["v", "h", ""].includes(val)
     },
     mode: {
       type: String,
-      default: "",
-      validator: (val) => ["", "plain", "line", "fill"].includes(val)
+      default: ""
     },
     align: {
       type: String,
@@ -39,27 +39,7 @@ var _sfc_main = defineComponent({
       type: Boolean,
       default: false
     },
-    showLine: {
-      type: Boolean,
-      default: true
-    },
-    lineColor: {
-      type: String,
-      default: ""
-    },
-    lineStyle: {
-      type: String,
-      default: "solid",
-      validator: (val) => ["solid", "dashed", "dotted"].includes(val)
-    },
-    className: {
-      type: String,
-      default: ""
-    },
-    style: {
-      type: Object,
-      default: () => ({})
-    }
+    tail: Boolean
   },
   emits: ["click", "item-rendered"],
   setup(props, { emit }) {
@@ -69,103 +49,48 @@ var _sfc_main = defineComponent({
       }
       return props.data;
     });
-    const timelineClasses = computed(() => {
+    const getClass = computed(() => {
       const classArray = [];
-      if (props.type === "h") {
-        classArray.push("to-timeline-horizontal");
-      } else {
-        classArray.push("to-timeline-vertical");
+      if (props.dir === "h") {
+        classArray.push("dir-h");
       }
       if (props.timePosition === "out") {
-        classArray.push("to-timeline-time-position-out");
+        classArray.push("time-position-out");
       }
       if (props.align === "center") {
-        classArray.push("to-timeline-align-center");
+        classArray.push("align-center");
       } else if (props.align === "right") {
-        classArray.push("to-timeline-align-right");
-      }
-      if (props.type === "h" && props.itemWidth === "avg") {
-        classArray.push("to-timeline-item-width-avg");
+        classArray.push("align-right");
       }
       if (props.mode) {
-        classArray.push(`to-timeline-mode-${props.mode}`);
+        classArray.push(`mode-${props.mode}`);
       }
-      if (!props.showLine) {
-        classArray.push("to-timeline-no-line");
+      if (props.data.some((item) => item.date)) {
+        classArray.push(`has-date`);
       }
-      return classArray;
-    });
-    const customClass = computed(() => props.className || "");
-    const customStyle = computed(() => props.style || {});
-    const nodeIconClass = computed(() => {
-      return "to-timeline-icon";
-    });
-    const lineClass = computed(() => {
-      return `to-timeline-line-${props.lineStyle}`;
-    });
-    const contentClass = computed(() => {
-      return "to-timeline-content-inner";
-    });
-    const getItemClass = (item) => {
-      const classArray = [];
-      if (!item.icon && !item.text || Number(item.level) === 2) {
-        classArray.push("to-timeline-item-small");
+      if (props.data.some((item) => item.time)) {
+        classArray.push(`has-time`);
       }
-      if (item.className) {
-        classArray.push(item.className);
+      if (props.itemWidth) {
+        classArray.push(`is-item-width`);
       }
       return classArray;
-    };
+    });
     const getIconMode = (item) => {
       if (props.mode) {
         return props.mode;
       }
-      if (!item.mode || !["plain", "line", "fill"].includes(item.mode)) {
-        const themeColors = ["primary", "success", "warning", "danger", "info"];
-        return themeColors.includes(item.color || "primary") ? "fill" : "line";
-      }
       return item.mode;
     };
-    const getLineStyle = (item) => {
-      if (props.lineColor || item.color && item.color !== "primary") {
-        return {
-          backgroundColor: props.lineColor || getColorValue(item.color)
-        };
-      }
-      return {};
-    };
-    const getDotStyle = (item) => {
-      if (item.color) {
-        return {
-          backgroundColor: getColorValue(item.color),
-          boxShadow: `0 0 0 3px ${getColorValue(item.color)}1A`
-          // 添加10%透明度的阴影
-        };
-      }
-      return {};
-    };
-    const getColorValue = (color) => {
-      const themeColors = {
-        primary: "var(--color-primary)",
-        success: "var(--color-success)",
-        warning: "var(--color-warning)",
-        danger: "var(--color-danger)",
-        info: "var(--color-info)"
-      };
-      return themeColors[color] || color;
-    };
-    const getItemStyle = (item) => {
+    const getItemStyle = () => {
       const style = {};
-      if (props.type === "h" && props.itemWidth && props.itemWidth !== "avg") {
+      if (props.dir === "h" && props.itemWidth) {
         if (!isNaN(Number(props.itemWidth))) {
           style.width = props.itemWidth + "em";
         } else {
           style.width = props.itemWidth.toString();
         }
       }
-      if (item.style) {
-        Object.assign(style, item.style);
-      }
       return style;
     };
     const showTimeOutside = (item) => {
@@ -174,12 +99,6 @@ var _sfc_main = defineComponent({
     const showTimeInside = (item) => {
       return props.timePosition === "in" && (item.date || item.time);
     };
-    const showItemLine = (item) => {
-      return props.showLine && item.showLine !== false;
-    };
-    const getSlotName = (index) => {
-      return `item-${index}`;
-    };
     const handleItemClick = (item, index) => {
       emit("click", item, index);
     };
@@ -203,21 +122,11 @@ var _sfc_main = defineComponent({
     });
     return {
       displayItems,
-      timelineClasses,
-      customClass,
-      customStyle,
-      nodeIconClass,
-      lineClass,
-      contentClass,
-      getItemClass,
+      getClass,
       getIconMode,
       getItemStyle,
-      getLineStyle,
-      getDotStyle,
       showTimeOutside,
       showTimeInside,
-      showItemLine,
-      getSlotName,
       handleItemClick
     };
   }

package/es/packages/components/timeline/src/timeline.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"timeline.vue2.mjs","sources":["../../../../../../packages/components/timeline/src/timeline.vue"],"sourcesContent":["<template>\n\t<div class=\"to-timeline\" :class=\"[timelineClasses, customClass]\" :style=\"customStyle\">\n\t\t<ul>\n\t\t\t<li\n\t\t\t\tv-for=\"(item, index) in displayItems\"\n\t\t\t\t:key=\"index\"\n\t\t\t\t:class=\"[getItemClass(item), { 'is-active': item.active }]\"\n\t\t\t\t@click=\"handleItemClick(item, index)\"\n\t\t\t>\n\t\t\t\t<!-- 外部时间显示 -->\n\t\t\t\t<div v-if=\"showTimeOutside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t\t<template v-if=\"item.date\">\n\t\t\t\t\t\t<div class=\"to-timeline-date\">{{ item.date }}</div>\n\t\t\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t</template>\n\t\t\t\t\t<template v-else-if=\"item.time\">\n\t\t\t\t\t\t<div class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t</template>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- 图标 -->\n\t\t\t\t<div class=\"to-timeline-node\">\n\t\t\t\t\t<to-icon\n\t\t\t\t\t\tv-if=\"item.icon || item.text\"\n\t\t\t\t\t\t:value=\"item.icon\"\n\t\t\t\t\t\t:color=\"item.color || 'primary'\"\n\t\t\t\t\t\t:mode=\"getIconMode(item)\"\n\t\t\t\t\t\t:class=\"nodeIconClass\"\n\t\t\t\t\t\tfillet=\"round\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{{ item.text }}\n\t\t\t\t\t</to-icon>\n\t\t\t\t\t<div v-else class=\"to-timeline-dot\" :style=\"getDotStyle(item)\"></div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- 连接线 -->\n\t\t\t\t<div\n\t\t\t\t\tv-if=\"showItemLine(item)\"\n\t\t\t\t\tclass=\"to-timeline-line\"\n\t\t\t\t\t:class=\"lineClass\"\n\t\t\t\t\t:style=\"getLineStyle(item)\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- 主内容区域 -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"to-timeline-main\"\n\t\t\t\t\t:class=\"{ 'has-datetime': showTimeInside(item) }\"\n\t\t\t\t\t:style=\"getItemStyle(item)\"\n\t\t\t\t>\n\t\t\t\t\t<!-- 内部时间显示 -->\n\t\t\t\t\t<div v-if=\"showTimeInside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t\t\t<template v-if=\"item.date\">\n\t\t\t\t\t\t\t<div class=\"to-timeline-date\">{{ item.date }}</div>\n\t\t\t\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template v-else-if=\"item.time\">\n\t\t\t\t\t\t\t<div class=\"to-timeline-time\">{{ item.time }}</div>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<!-- 内容区域 -->\n\t\t\t\t\t<div class=\"to-timeline-content\" :class=\"contentClass\" :style=\"item.style\">\n\t\t\t\t\t\t<template v-if=\"item.content\">{{ item.content }}</template>\n\t\t\t\t\t\t<slot :name=\"getSlotName(index)\" :item=\"item\" :index=\"index\"></slot>\n\t\t\t\t\t\t<slot name=\"default\" :item=\"item\" :index=\"index\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, PropType, watch, onMounted, nextTick } from 'vue'\nimport { ToIcon } from '../../icon'\nimport type {\n\tTimelineItem,\n\tTimelineTimePosition,\n\tTimelineDirection,\n\tTimelineAlign,\n\tTimelineMode,\n} from './timeline'\n\nexport default defineComponent({\n\tname: 'ToTimeline',\n\tcomponents: {\n\t\tToIcon,\n\t},\n\tprops: {\n\t\tdata: {\n\t\t\ttype: Array as PropType<TimelineItem[]>,\n\t\t\tdefault: () => [],\n\t\t},\n\t\ttimePosition: {\n\t\t\ttype: String as PropType<TimelineTimePosition>,\n\t\t\tdefault: 'in',\n\t\t\tvalidator: (val: string) => ['in', 'out'].includes(val),\n\t\t},\n\t\ttype: {\n\t\t\ttype: String as PropType<TimelineDirection>,\n\t\t\tdefault: 'v',\n\t\t\tvalidator: (val: string) => ['v', 'h', ''].includes(val),\n\t\t},\n\t\tmode: {\n\t\t\ttype: String as PropType<TimelineMode>,\n\t\t\tdefault: '',\n\t\t\tvalidator: (val: string) => ['', 'plain', 'line', 'fill'].includes(val),\n\t\t},\n\t\talign: {\n\t\t\ttype: String as PropType<TimelineAlign>,\n\t\t\tdefault: 'left',\n\t\t\tvalidator: (val: string) => ['left', 'center', 'right'].includes(val),\n\t\t},\n\t\titemWidth: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: '',\n\t\t},\n\t\treverse: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\tshowLine: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t\tlineColor: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\tlineStyle: {\n\t\t\ttype: String,\n\t\t\tdefault: 'solid',\n\t\t\tvalidator: (val: string) => ['solid', 'dashed', 'dotted'].includes(val),\n\t\t},\n\t\tclassName: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\tstyle: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\t},\n\temits: ['click', 'item-rendered'],\n\tsetup(props, { emit }) {\n\t\t// 处理数据顺序\n\t\tconst displayItems = computed(() => {\n\t\t\tif (props.reverse) {\n\t\t\t\treturn [...props.data].reverse()\n\t\t\t}\n\t\t\treturn props.data\n\t\t})\n\n\t\t// 组件基础类名\n\t\tconst timelineClasses = computed(() => {\n\t\t\tconst classArray = []\n\n\t\t\t// 布局类型\n\t\t\tif (props.type === 'h') {\n\t\t\t\tclassArray.push('to-timeline-horizontal')\n\t\t\t} else {\n\t\t\t\tclassArray.push('to-timeline-vertical')\n\t\t\t}\n\n\t\t\t// 时间位置\n\t\t\tif (props.timePosition === 'out') {\n\t\t\t\tclassArray.push('to-timeline-time-position-out')\n\t\t\t}\n\n\t\t\t// 对齐方式\n\t\t\tif (props.align === 'center') {\n\t\t\t\tclassArray.push('to-timeline-align-center')\n\t\t\t} else if (props.align === 'right') {\n\t\t\t\tclassArray.push('to-timeline-align-right')\n\t\t\t}\n\n\t\t\t// 等分宽度 - 只在水平布局时应用\n\t\t\tif (props.type === 'h' && props.itemWidth === 'avg') {\n\t\t\t\tclassArray.push('to-timeline-item-width-avg')\n\t\t\t}\n\n\t\t\t// 全局模式类\n\t\t\tif (props.mode) {\n\t\t\t\tclassArray.push(`to-timeline-mode-${props.mode}`)\n\t\t\t}\n\n\t\t\t// 是否显示连接线\n\t\t\tif (!props.showLine) {\n\t\t\t\tclassArray.push('to-timeline-no-line')\n\t\t\t}\n\n\t\t\treturn classArray\n\t\t})\n\n\t\t// 自定义类名\n\t\tconst customClass = computed(() => props.className || '')\n\n\t\t// 自定义样式\n\t\tconst customStyle = computed(() => props.style || {})\n\n\t\t// 图标类名\n\t\tconst nodeIconClass = computed(() => {\n\t\t\treturn 'to-timeline-icon'\n\t\t})\n\n\t\t// 线条类名\n\t\tconst lineClass = computed(() => {\n\t\t\treturn `to-timeline-line-${props.lineStyle}`\n\t\t})\n\n\t\t// 内容类名\n\t\tconst contentClass = computed(() => {\n\t\t\treturn 'to-timeline-content-inner'\n\t\t})\n\n\t\t// 获取节点样式\n\t\tconst getItemClass = (item: TimelineItem) => {\n\t\t\tconst classArray: string[] = []\n\n\t\t\t// 小图标模式\n\t\t\tif ((!item.icon && !item.text) || Number(item.level) === 2) {\n\t\t\t\tclassArray.push('to-timeline-item-small')\n\t\t\t}\n\n\t\t\t// 用户自定义类名\n\t\t\tif (item.className) {\n\t\t\t\tclassArray.push(item.className)\n\t\t\t}\n\n\t\t\treturn classArray\n\t\t}\n\n\t\t// 获取图标模式\n\t\tconst getIconMode = (item: TimelineItem) => {\n\t\t\t// 优先使用全局模式，如果未设置则使用项目自身模式\n\t\t\tif (props.mode) {\n\t\t\t\treturn props.mode\n\t\t\t}\n\n\t\t\t// 如果未设置模式或模式无效，根据颜色决定默认模式\n\t\t\tif (!item.mode || !['plain', 'line', 'fill'].includes(item.mode)) {\n\t\t\t\t// 当使用预设主题色时，默认使用fill模式，否则使用line模式\n\t\t\t\tconst themeColors = ['primary', 'success', 'warning', 'danger', 'info']\n\t\t\t\treturn themeColors.includes(item.color || 'primary') ? 'fill' : 'line'\n\t\t\t}\n\t\t\treturn item.mode\n\t\t}\n\n\t\t// 获取线条样式\n\t\tconst getLineStyle = (item: TimelineItem) => {\n\t\t\tif (props.lineColor || (item.color && item.color !== 'primary')) {\n\t\t\t\treturn {\n\t\t\t\t\tbackgroundColor: props.lineColor || getColorValue(item.color),\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn {}\n\t\t}\n\n\t\t// 获取节点样式\n\t\tconst getDotStyle = (item: TimelineItem) => {\n\t\t\tif (item.color) {\n\t\t\t\treturn {\n\t\t\t\t\tbackgroundColor: getColorValue(item.color),\n\t\t\t\t\tboxShadow: `0 0 0 3px ${getColorValue(item.color)}1A`, // 添加10%透明度的阴影\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn {}\n\t\t}\n\n\t\t// 辅助方法：从颜色名获取颜色值\n\t\tconst getColorValue = (color: string) => {\n\t\t\tconst themeColors = {\n\t\t\t\tprimary: 'var(--color-primary)',\n\t\t\t\tsuccess: 'var(--color-success)',\n\t\t\t\twarning: 'var(--color-warning)',\n\t\t\t\tdanger: 'var(--color-danger)',\n\t\t\t\tinfo: 'var(--color-info)',\n\t\t\t}\n\t\t\treturn themeColors[color as keyof typeof themeColors] || color\n\t\t}\n\n\t\t// 获取内容样式\n\t\tconst getItemStyle = (item: TimelineItem) => {\n\t\t\tconst style: Record<string, string> = {}\n\n\t\t\t// 处理宽度设置 - 仅在水平布局时有效\n\t\t\tif (props.type === 'h' && props.itemWidth && props.itemWidth !== 'avg') {\n\t\t\t\tif (!isNaN(Number(props.itemWidth))) {\n\t\t\t\t\tstyle.width = props.itemWidth + 'em'\n\t\t\t\t} else {\n\t\t\t\t\tstyle.width = props.itemWidth.toString()\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// 合并项目自身的样式\n\t\t\tif (item.style) {\n\t\t\t\tObject.assign(style, item.style)\n\t\t\t}\n\n\t\t\treturn style\n\t\t}\n\n\t\t// 判断是否显示外部时间\n\t\tconst showTimeOutside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'out' && (item.date || item.time)\n\t\t}\n\n\t\t// 判断是否显示内部时间\n\t\tconst showTimeInside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'in' && (item.date || item.time)\n\t\t}\n\n\t\t// 判断是否显示连接线\n\t\tconst showItemLine = (item: TimelineItem) => {\n\t\t\treturn props.showLine && item.showLine !== false\n\t\t}\n\n\t\t// 获取具名插槽名称\n\t\tconst getSlotName = (index: number) => {\n\t\t\treturn `item-${index}`\n\t\t}\n\n\t\t// 点击事件处理\n\t\tconst handleItemClick = (item: TimelineItem, index: number) => {\n\t\t\temit('click', item, index)\n\t\t}\n\n\t\t// 监听数据变化\n\t\twatch(\n\t\t\t() => props.data,\n\t\t\t() => {\n\t\t\t\tnextTick(() => {\n\t\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t\t})\n\t\t\t\t})\n\t\t\t},\n\t\t\t{ immediate: false, deep: true }\n\t\t)\n\n\t\t// 初始化时触发渲染完成事件\n\t\tonMounted(() => {\n\t\t\tnextTick(() => {\n\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t})\n\t\t\t})\n\t\t})\n\n\t\treturn {\n\t\t\tdisplayItems,\n\t\t\ttimelineClasses,\n\t\t\tcustomClass,\n\t\t\tcustomStyle,\n\t\t\tnodeIconClass,\n\t\t\tlineClass,\n\t\t\tcontentClass,\n\t\t\tgetItemClass,\n\t\t\tgetIconMode,\n\t\t\tgetItemStyle,\n\t\t\tgetLineStyle,\n\t\t\tgetDotStyle,\n\t\t\tshowTimeOutside,\n\t\t\tshowTimeInside,\n\t\t\tshowItemLine,\n\t\t\tgetSlotName,\n\t\t\thandleItemClick,\n\t\t}\n\t},\n})\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"timeline.vue2.mjs","sources":["../../../../../../packages/components/timeline/src/timeline.vue"],"sourcesContent":["<template>\n\t<div class=\"to-timeline\" :flex=\"flex ? flex : null\" :class=\"getClass\">\n\t\t<div v-for=\"(item, index) in displayItems\" :key=\"index\" class=\"to-timeline-item\" :style=\"getItemStyle()\" @click=\"handleItemClick(item, index)\">\n\t\t\t<!-- 外部时间显示 -->\n\t\t\t<div v-if=\"showTimeOutside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t<div v-if=\"item.date\" class=\"to-timeline-date\">\n\t\t\t\t\t<div class=\"to-timeline-date-text\">{{ item.date }}</div>\n\t\t\t\t</div>\n\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">\n\t\t\t\t\t<div class=\"to-timeline-time-text\">{{ item.time }}</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<!-- 图标 -->\n\t\t\t<to-icon class=\"to-timeline-icon\" :value=\"item.icon\" :color=\"item.color\" :mode=\"item.mode\">\n\t\t\t\t{{ item.text }}\n\t\t\t</to-icon>\n\n\t\t\t<!-- 主内容区域 -->\n\t\t\t<div class=\"to-timeline-main\">\n\t\t\t\t<!-- 内部时间显示 -->\n\t\t\t\t<div v-if=\"showTimeInside(item)\" class=\"to-timeline-datetime\">\n\t\t\t\t\t<div v-if=\"item.date\" class=\"to-timeline-date\">\n\t\t\t\t\t\t<div class=\"to-timeline-date-text\">{{ item.date }}</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div v-if=\"item.time\" class=\"to-timeline-time\">\n\t\t\t\t\t\t<div class=\"to-timeline-time-text\">{{ item.time }}</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- 内容区域 -->\n\t\t\t\t<div class=\"to-timeline-content\" :style=\"item.style\">\n\t\t\t\t\t<template v-if=\"item.content\">{{ item.content }}</template>\n\t\t\t\t\t<slot name=\"default\" :item=\"item\" :index=\"index\"></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div v-if=\"index < displayItems.length - 1 || tail\" class=\"to-timeline-line\"></div>\n\t\t</div>\n\t</div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, PropType, watch, onMounted, nextTick } from 'vue'\nimport { ToIcon } from '../../icon'\nimport type { TimelineItem, TimelineTimePosition, TimelineDirection, TimelineAlign, TimelineMode } from './timeline'\n\nexport default defineComponent({\n\tname: 'ToTimeline',\n\tcomponents: {\n\t\tToIcon\n\t},\n\tprops: {\n\t\tflex: Boolean,\n\t\tdata: {\n\t\t\ttype: Array as PropType<TimelineItem[]>,\n\t\t\tdefault: () => []\n\t\t},\n\t\ttimePosition: {\n\t\t\ttype: String as PropType<TimelineTimePosition>,\n\t\t\tdefault: 'in',\n\t\t\tvalidator: (val: string) => ['in', 'out'].includes(val)\n\t\t},\n\t\tdir: {\n\t\t\ttype: String as PropType<TimelineDirection>,\n\t\t\tdefault: 'v',\n\t\t\tvalidator: (val: string) => ['v', 'h', ''].includes(val)\n\t\t},\n\t\tmode: {\n\t\t\ttype: String as PropType<TimelineMode>,\n\t\t\tdefault: ''\n\t\t},\n\t\talign: {\n\t\t\ttype: String as PropType<TimelineAlign>,\n\t\t\tdefault: 'left',\n\t\t\tvalidator: (val: string) => ['left', 'center', 'right'].includes(val)\n\t\t},\n\t\titemWidth: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: ''\n\t\t},\n\t\treverse: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t\ttail: Boolean\n\t},\n\temits: ['click', 'item-rendered'],\n\tsetup(props, { emit }) {\n\t\t// 处理数据顺序\n\t\tconst displayItems = computed(() => {\n\t\t\tif (props.reverse) {\n\t\t\t\treturn [...props.data].reverse()\n\t\t\t}\n\t\t\treturn props.data\n\t\t})\n\n\t\t// 组件基础类名\n\t\tconst getClass = computed(() => {\n\t\t\tconst classArray = []\n\n\t\t\t// 布局类型\n\t\t\tif (props.dir === 'h') {\n\t\t\t\tclassArray.push('dir-h')\n\t\t\t}\n\n\t\t\t// 时间位置\n\t\t\tif (props.timePosition === 'out') {\n\t\t\t\tclassArray.push('time-position-out')\n\t\t\t}\n\n\t\t\t// 对齐方式\n\t\t\tif (props.align === 'center') {\n\t\t\t\tclassArray.push('align-center')\n\t\t\t} else if (props.align === 'right') {\n\t\t\t\tclassArray.push('align-right')\n\t\t\t}\n\n\t\t\t// 全局模式类\n\t\t\tif (props.mode) {\n\t\t\t\tclassArray.push(`mode-${props.mode}`)\n\t\t\t}\n\n\t\t\t// 是否含有 date\n\t\t\tif (props.data.some(item => item.date)) {\n\t\t\t\tclassArray.push(`has-date`)\n\t\t\t}\n\n\t\t\t// 是否含有 time\n\t\t\tif (props.data.some(item => item.time)) {\n\t\t\t\tclassArray.push(`has-time`)\n\t\t\t}\n\n\t\t\t// 是否设置 item-width\n\t\t\tif (props.itemWidth) {\n\t\t\t\tclassArray.push(`is-item-width`)\n\t\t\t}\n\n\t\t\treturn classArray\n\t\t})\n\n\t\t// 获取图标模式\n\t\tconst getIconMode = (item: TimelineItem) => {\n\t\t\t// 优先使用全局模式，如果未设置则使用项目自身模式\n\t\t\tif (props.mode) {\n\t\t\t\treturn props.mode\n\t\t\t}\n\t\t\treturn item.mode\n\t\t}\n\n\t\t// 获取内容样式\n\t\tconst getItemStyle = () => {\n\t\t\tconst style: Record<string, string> = {}\n\n\t\t\t// 处理宽度设置 - 仅在水平布局时有效\n\t\t\tif (props.dir === 'h' && props.itemWidth) {\n\t\t\t\tif (!isNaN(Number(props.itemWidth))) {\n\t\t\t\t\tstyle.width = props.itemWidth + 'em'\n\t\t\t\t} else {\n\t\t\t\t\tstyle.width = props.itemWidth.toString()\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn style\n\t\t}\n\n\t\t// 判断是否显示外部时间\n\t\tconst showTimeOutside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'out' && (item.date || item.time)\n\t\t}\n\n\t\t// 判断是否显示内部时间\n\t\tconst showTimeInside = (item: TimelineItem) => {\n\t\t\treturn props.timePosition === 'in' && (item.date || item.time)\n\t\t}\n\n\t\t// 点击事件处理\n\t\tconst handleItemClick = (item: TimelineItem, index: number) => {\n\t\t\temit('click', item, index)\n\t\t}\n\n\t\t// 监听数据变化\n\t\twatch(\n\t\t\t() => props.data,\n\t\t\t() => {\n\t\t\t\tnextTick(() => {\n\t\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t\t})\n\t\t\t\t})\n\t\t\t},\n\t\t\t{ immediate: false, deep: true }\n\t\t)\n\n\t\t// 初始化时触发渲染完成事件\n\t\tonMounted(() => {\n\t\t\tnextTick(() => {\n\t\t\t\tprops.data.forEach((_item, _index) => {\n\t\t\t\t\temit('item-rendered', _item, _index)\n\t\t\t\t})\n\t\t\t})\n\t\t})\n\n\t\treturn {\n\t\t\tdisplayItems,\n\t\t\tgetClass,\n\t\t\tgetIconMode,\n\t\t\tgetItemStyle,\n\t\t\tshowTimeOutside,\n\t\t\tshowTimeInside,\n\t\t\thandleItemClick\n\t\t}\n\t}\n})\n</script>\n"],"names":[],"mappings":";;;AA+CA,gBAAe,eAAgB,CAAA;AAAA,EAC9B,IAAM,EAAA,YAAA;AAAA,EACN,UAAY,EAAA;AAAA,IACX,MAAA;AAAA,GACD;AAAA,EACA,KAAO,EAAA;AAAA,IACN,IAAM,EAAA,OAAA;AAAA,IACN,IAAM,EAAA;AAAA,MACL,IAAM,EAAA,KAAA;AAAA,MACN,OAAA,EAAS,MAAM,EAAC;AAAA,KACjB;AAAA,IACA,YAAc,EAAA;AAAA,MACb,IAAM,EAAA,MAAA;AAAA,MACN,OAAS,EAAA,IAAA;AAAA,MACT,SAAA,EAAW,CAAC,GAAgB,KAAA,CAAC,MAAM,KAAK,CAAA,CAAE,SAAS,GAAG,CAAA;AAAA,KACvD;AAAA,IACA,GAAK,EAAA;AAAA,MACJ,IAAM,EAAA,MAAA;AAAA,MACN,OAAS,EAAA,GAAA;AAAA,MACT,SAAA,EAAW,CAAC,GAAgB,KAAA,CAAC,KAAK,GAAK,EAAA,EAAE,CAAE,CAAA,QAAA,CAAS,GAAG,CAAA;AAAA,KACxD;AAAA,IACA,IAAM,EAAA;AAAA,MACL,IAAM,EAAA,MAAA;AAAA,MACN,OAAS,EAAA,EAAA;AAAA,KACV;AAAA,IACA,KAAO,EAAA;AAAA,MACN,IAAM,EAAA,MAAA;AAAA,MACN,OAAS,EAAA,MAAA;AAAA,MACT,SAAA,EAAW,CAAC,GAAgB,KAAA,CAAC,QAAQ,QAAU,EAAA,OAAO,CAAE,CAAA,QAAA,CAAS,GAAG,CAAA;AAAA,KACrE;AAAA,IACA,SAAW,EAAA;AAAA,MACV,IAAA,EAAM,CAAC,MAAA,EAAQ,MAAM,CAAA;AAAA,MACrB,OAAS,EAAA,EAAA;AAAA,KACV;AAAA,IACA,OAAS,EAAA;AAAA,MACR,IAAM,EAAA,OAAA;AAAA,MACN,OAAS,EAAA,KAAA;AAAA,KACV;AAAA,IACA,IAAM,EAAA,OAAA;AAAA,GACP;AAAA,EACA,KAAA,EAAO,CAAC,OAAA,EAAS,eAAe,CAAA;AAAA,EAChC,KAAM,CAAA,KAAA,EAAO,EAAE,IAAA,EAAQ,EAAA;AAEtB,IAAM,MAAA,YAAA,GAAe,SAAS,MAAM;AACnC,MAAA,IAAI,MAAM,OAAS,EAAA;AAClB,QAAA,OAAO,CAAC,GAAG,KAAM,CAAA,IAAI,EAAE,OAAQ,EAAA,CAAA;AAAA,OAChC;AACA,MAAA,OAAO,KAAM,CAAA,IAAA,CAAA;AAAA,KACb,CAAA,CAAA;AAGD,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAC/B,MAAA,MAAM,aAAa,EAAC,CAAA;AAGpB,MAAI,IAAA,KAAA,CAAM,QAAQ,GAAK,EAAA;AACtB,QAAA,UAAA,CAAW,KAAK,OAAO,CAAA,CAAA;AAAA,OACxB;AAGA,MAAI,IAAA,KAAA,CAAM,iBAAiB,KAAO,EAAA;AACjC,QAAA,UAAA,CAAW,KAAK,mBAAmB,CAAA,CAAA;AAAA,OACpC;AAGA,MAAI,IAAA,KAAA,CAAM,UAAU,QAAU,EAAA;AAC7B,QAAA,UAAA,CAAW,KAAK,cAAc,CAAA,CAAA;AAAA,OAC/B,MAAA,IAAW,KAAM,CAAA,KAAA,KAAU,OAAS,EAAA;AACnC,QAAA,UAAA,CAAW,KAAK,aAAa,CAAA,CAAA;AAAA,OAC9B;AAGA,MAAA,IAAI,MAAM,IAAM,EAAA;AACf,QAAW,UAAA,CAAA,IAAA,CAAK,CAAQ,KAAA,EAAA,KAAA,CAAM,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,OACrC;AAGA,MAAA,IAAI,MAAM,IAAK,CAAA,IAAA,CAAK,CAAQ,IAAA,KAAA,IAAA,CAAK,IAAI,CAAG,EAAA;AACvC,QAAA,UAAA,CAAW,KAAK,CAAU,QAAA,CAAA,CAAA,CAAA;AAAA,OAC3B;AAGA,MAAA,IAAI,MAAM,IAAK,CAAA,IAAA,CAAK,CAAQ,IAAA,KAAA,IAAA,CAAK,IAAI,CAAG,EAAA;AACvC,QAAA,UAAA,CAAW,KAAK,CAAU,QAAA,CAAA,CAAA,CAAA;AAAA,OAC3B;AAGA,MAAA,IAAI,MAAM,SAAW,EAAA;AACpB,QAAA,UAAA,CAAW,KAAK,CAAe,aAAA,CAAA,CAAA,CAAA;AAAA,OAChC;AAEA,MAAO,OAAA,UAAA,CAAA;AAAA,KACP,CAAA,CAAA;AAGD,IAAM,MAAA,WAAA,GAAc,CAAC,IAAuB,KAAA;AAE3C,MAAA,IAAI,MAAM,IAAM,EAAA;AACf,QAAA,OAAO,KAAM,CAAA,IAAA,CAAA;AAAA,OACd;AACA,MAAA,OAAO,IAAK,CAAA,IAAA,CAAA;AAAA,KACb,CAAA;AAGA,IAAA,MAAM,eAAe,MAAM;AAC1B,MAAA,MAAM,QAAgC,EAAC,CAAA;AAGvC,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,GAAO,IAAA,KAAA,CAAM,SAAW,EAAA;AACzC,QAAA,IAAI,CAAC,KAAM,CAAA,MAAA,CAAO,KAAM,CAAA,SAAS,CAAC,CAAG,EAAA;AACpC,UAAM,KAAA,CAAA,KAAA,GAAQ,MAAM,SAAY,GAAA,IAAA,CAAA;AAAA,SAC1B,MAAA;AACN,UAAM,KAAA,CAAA,KAAA,GAAQ,KAAM,CAAA,SAAA,CAAU,QAAS,EAAA,CAAA;AAAA,SACxC;AAAA,OACD;AAEA,MAAO,OAAA,KAAA,CAAA;AAAA,KACR,CAAA;AAGA,IAAM,MAAA,eAAA,GAAkB,CAAC,IAAuB,KAAA;AAC/C,MAAA,OAAO,KAAM,CAAA,YAAA,KAAiB,KAAU,KAAA,IAAA,CAAK,QAAQ,IAAK,CAAA,IAAA,CAAA,CAAA;AAAA,KAC3D,CAAA;AAGA,IAAM,MAAA,cAAA,GAAiB,CAAC,IAAuB,KAAA;AAC9C,MAAA,OAAO,KAAM,CAAA,YAAA,KAAiB,IAAS,KAAA,IAAA,CAAK,QAAQ,IAAK,CAAA,IAAA,CAAA,CAAA;AAAA,KAC1D,CAAA;AAGA,IAAM,MAAA,eAAA,GAAkB,CAAC,IAAA,EAAoB,KAAkB,KAAA;AAC9D,MAAK,IAAA,CAAA,OAAA,EAAS,MAAM,KAAK,CAAA,CAAA;AAAA,KAC1B,CAAA;AAGA,IAAA,KAAA;AAAA,MACC,MAAM,KAAM,CAAA,IAAA;AAAA,MACZ,MAAM;AACL,QAAA,QAAA,CAAS,MAAM;AACd,UAAA,KAAA,CAAM,IAAK,CAAA,OAAA,CAAQ,CAAC,KAAA,EAAO,MAAW,KAAA;AACrC,YAAK,IAAA,CAAA,eAAA,EAAiB,OAAO,MAAM,CAAA,CAAA;AAAA,WACnC,CAAA,CAAA;AAAA,SACD,CAAA,CAAA;AAAA,OACF;AAAA,MACA,EAAE,SAAA,EAAW,KAAO,EAAA,IAAA,EAAM,IAAK,EAAA;AAAA,KAChC,CAAA;AAGA,IAAA,SAAA,CAAU,MAAM;AACf,MAAA,QAAA,CAAS,MAAM;AACd,QAAA,KAAA,CAAM,IAAK,CAAA,OAAA,CAAQ,CAAC,KAAA,EAAO,MAAW,KAAA;AACrC,UAAK,IAAA,CAAA,eAAA,EAAiB,OAAO,MAAM,CAAA,CAAA;AAAA,SACnC,CAAA,CAAA;AAAA,OACD,CAAA,CAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAO,OAAA;AAAA,MACN,YAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,KACD,CAAA;AAAA,GACD;AACD,CAAC,CAAA;;;;"}

package/es/packages/components/tip/index.d.mjs

@@ -0,0 +1,4 @@
+var $tip$1 = $tip;
+
+export { $tip$1 as default };
+//# sourceMappingURL=index.d.mjs.map

package/es/packages/components/tip/index.d.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mjs","sources":["../../../../../packages/components/tip/index.d.ts"],"sourcesContent":["import Tip from './src/tip.vue';\nimport { SFCWithInstall } from '@touchvue/utils';\ndeclare const ToTip: SFCWithInstall<typeof Tip>;\nexport * from './src/instance';\ninterface TipOptions {\n    icon?: string;\n    content?: string;\n    color?: string;\n    opDisplay?: string;\n    mode?: string;\n    position?: string;\n    during?: string | number;\n    closable?: boolean;\n    deletable?: boolean;\n    showIcon?: boolean;\n    className?: string;\n    [key: string]: any;\n}\nexport declare const $tip: {\n    (options: TipOptions | string): Promise<boolean>;\n    success(options: TipOptions | string): Promise<boolean>;\n    error(options: TipOptions | string): Promise<boolean>;\n    info(options: TipOptions | string): Promise<boolean>;\n    warning(options: TipOptions | string): Promise<boolean>;\n    danger(options: TipOptions | string): Promise<boolean>;\n    fg(options: TipOptions | string): Promise<boolean>;\n    toast(options: TipOptions | string): Promise<boolean>;\n};\nexport default $tip;\nexport { ToTip };\n"],"names":[],"mappings":"AA4BA,aAAe,IAAA;;;;"}

package/es/packages/components/tip/index.mjs

@@ -1,15 +1,15 @@
 import { createVNode, render } from 'vue';
-import _sfc_main from './src/tip.vue2.mjs';
+import Tip from './src/tip.vue.mjs';
 import { withInstall } from '../../utils/types.mjs';
 import { generateUUID, removeElement } from '../../utils/util.mjs';
 
-const ToTip = withInstall(_sfc_main);
+const ToTip = withInstall(Tip);
 function createTipInstance(app, ...args) {
   if (args.length === 0)
     return Promise.reject("\u65E0\u6548\u7684 tip \u5185\u5BB9");
-  return new Promise((resolve, reject) => {
+  return new Promise((resolve) => {
     const defaultOptions = {
-      icon: "alarm",
+      icon: "info",
       content: "",
       color: "default",
       opDisplay: "hover",
@@ -18,7 +18,8 @@ function createTipInstance(app, ...args) {
       during: 3e3,
       closable: true,
       deletable: false,
-      className: ""
+      className: "",
+      showIcon: true
     };
     let options = { ...defaultOptions };
     if (args.length === 1) {
@@ -49,7 +50,7 @@ function createTipInstance(app, ...args) {
             break;
           }
           case "info": {
-            icon = "error";
+            icon = "info";
             break;
           }
           case "fg": {
@@ -72,19 +73,14 @@ function createTipInstance(app, ...args) {
     const container = document.createElement("div");
     container.setAttribute("id", uuid);
     body.appendChild(container);
-    const vnode = createVNode(_sfc_main, {
+    const vnode = createVNode(Tip, {
       ...options,
       onClose: () => {
         setTimeout(() => {
           render(null, container);
           removeElement(container);
-          reject(false);
+          resolve(true);
         }, 200);
-      },
-      onConfirm: () => {
-        render(null, container);
-        removeElement(container);
-        resolve(true);
       }
     });
     if (app && app._context) {