@semi-kit/component 1.4.9 → 1.4.11

package/lib/app-provider/index.d.ts

@@ -1,2 +1,2 @@
-import { t as _default } from "../index-C-Oqap1P.js";
+import { t as _default } from "../index-Bvg8aJV4.js";
 export { _default as default };

package/lib/{index-C-Oqap1P.d.ts → index-Bvg8aJV4.d.ts}

@@ -1,4 +1,4 @@
-import * as vue16 from "vue";
+import * as vue9 from "vue";
 import { Ref } from "vue";
 
 //#region src/app-provider/type.d.ts
@@ -20,16 +20,16 @@ interface AppProviderContext {
 }
 //#endregion
 //#region src/app-provider/index.d.ts
-declare const _default: vue16.DefineComponent<vue16.ExtractPropTypes<{
+declare const _default: vue9.DefineComponent<vue9.ExtractPropTypes<{
   readonly locale: StringConstructor;
-  readonly formRuleConfig: vue16.PropType<AppProviderFormRuleConfig>;
-  readonly theme: vue16.PropType<AppProviderTheme>;
-}>, () => vue16.VNode<vue16.RendererNode, vue16.RendererElement, {
+  readonly formRuleConfig: vue9.PropType<AppProviderFormRuleConfig>;
+  readonly theme: vue9.PropType<AppProviderTheme>;
+}>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
   [key: string]: any;
-}>[] | undefined, {}, {}, {}, vue16.ComponentOptionsMixin, vue16.ComponentOptionsMixin, {}, string, vue16.PublicProps, Readonly<vue16.ExtractPropTypes<{
+}>[] | undefined, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {}, string, vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
   readonly locale: StringConstructor;
-  readonly formRuleConfig: vue16.PropType<AppProviderFormRuleConfig>;
-  readonly theme: vue16.PropType<AppProviderTheme>;
-}>> & Readonly<{}>, {}, {}, {}, {}, string, vue16.ComponentProvideOptions, true, {}, any>;
+  readonly formRuleConfig: vue9.PropType<AppProviderFormRuleConfig>;
+  readonly theme: vue9.PropType<AppProviderTheme>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
 //#endregion
 export { AppProviderContext as n, AppProviderFormRuleConfig as r, _default as t };

package/lib/index.d.ts

@@ -1,9 +1,9 @@
-import { n as AppProviderContext, r as AppProviderFormRuleConfig, t as _default } from "./index-C-Oqap1P.js";
-import { t as _default$3 } from "./index-C5y1Tk9t.js";
-import { t as _default$2 } from "./index-HCwdt_km.js";
-import { t as _default$1 } from "./index-BkYadMq_.js";
-import { t as SemiComponentResolver } from "./resolver-BVvgCCAW.js";
-import { i as TabView } from "./index-BScreGz5.js";
+import { n as AppProviderContext, r as AppProviderFormRuleConfig, t as _default } from "./index-Bvg8aJV4.js";
+import _default$3 from "./wrapper/scroll-wrapper/index.js";
+import _default$2 from "./wrapper/flex-row-wrapper/index.js";
+import _default$1 from "./wrapper/flex-col-wrapper/index.js";
+import { SemiComponentResolver } from "./resolver.js";
+import TabView from "./tab-view/index.js";
 
 //#region src/_utils/get-provider.d.ts
 declare function getAppProvider(): AppProviderContext;

package/lib/index.js

@@ -1,9 +1,9 @@
-import { n as getAppProvider, t as tab_view_default } from "./tab-view-BktgxoMW.js";
+import { n as getAppProvider, t as tab_view_default } from "./tab-view-DN-KFQWP.js";
 import "./cssr-D9_M6jAV.js";
 import { t as scroll_wrapper_default } from "./scroll-wrapper-DVAnbCLj.js";
 import { t as flex_row_wrapper_default } from "./flex-row-wrapper-70R3tK7w.js";
 import { t as flex_col_wrapper_default } from "./flex-col-wrapper-BYnCXcY5.js";
 import { t as app_provider_default } from "./app-provider-BNtVdZn9.js";
-import { t as SemiComponentResolver } from "./resolver-DP3BDWck.js";
+import { SemiComponentResolver } from "./resolver.js";
 
 export { app_provider_default as AppProvider, flex_col_wrapper_default as FlexColWrapper, flex_row_wrapper_default as FlexRowWrapper, scroll_wrapper_default as ScrollWrapper, SemiComponentResolver, tab_view_default as TabView, getAppProvider };

package/lib/resolver.d.ts

@@ -1,2 +1,10 @@
-import { t as SemiComponentResolver } from "./resolver-BVvgCCAW.js";
+//#region src/resolver.d.ts
+declare const SemiComponentResolver: () => {
+  type: "component";
+  resolve: (name: string) => {
+    name: string;
+    from: string;
+  } | undefined;
+};
+//#endregion
 export { SemiComponentResolver };

package/lib/resolver.js

@@ -1,3 +1,19 @@
-import { t as SemiComponentResolver } from "./resolver-DP3BDWck.js";
+//#region src/resolver.ts
+const SemiComponentResolver = () => {
+	return {
+		type: "component",
+		resolve: (name) => {
+			if ([
+				"ScrollWrapper",
+				"FlexRowWrapper",
+				"FlexColWrapper"
+			].includes(name)) return {
+				name,
+				from: "@semi-kit/component"
+			};
+		}
+	};
+};
 
+//#endregion
 export { SemiComponentResolver };

package/lib/tab-view/index.d.ts

@@ -1,2 +1,41 @@
-import { i as TabView, n as SlotType, r as TabActionType, t as PropsType } from "../index-BScreGz5.js";
+import * as vue23 from "vue";
+import { VNode } from "vue";
+
+//#region src/tab-view/index.d.ts
+type TabActionType = 'closeTab' | 'closeOtherTabs' | 'closeLeftTabs' | 'closeRightTabs';
+interface PropsType<T> {
+  rowKey: (item: T) => string | number;
+  activeTab: (item: T) => boolean;
+  tabs: T[];
+  type?: 'chrome' | 'tab' | 'tag';
+  onClickItem?: (item: T) => void;
+  onMouseUpItem?: (e: MouseEvent, item: T, index: number) => void;
+  onDropdownSelect?: (key: TabActionType, index: number) => void;
+  onContextMenuItem?: (e: MouseEvent, item: T, index: number) => void;
+}
+interface SlotType<T> {
+  default?: (props: {
+    item: T;
+    index: number;
+  }) => VNode;
+  extra?: () => VNode;
+}
+declare const TabView: vue23.DefineSetupFnComponent<{
+  tabs: any;
+  rowKey: any;
+  activeTab: any;
+  type: any;
+  onClickItem: any;
+  onMouseUpItem: any;
+  onContextMenuItem: any;
+}, {}, {}, {
+  tabs: any;
+  rowKey: any;
+  activeTab: any;
+  type: any;
+  onClickItem: any;
+  onMouseUpItem: any;
+  onContextMenuItem: any;
+} & {}, vue23.PublicProps>;
+//#endregion
 export { PropsType, SlotType, TabActionType, TabView as default };

package/lib/tab-view/index.js

@@ -1,4 +1,4 @@
-import { t as tab_view_default } from "../tab-view-BktgxoMW.js";
+import { t as tab_view_default } from "../tab-view-DN-KFQWP.js";
 import "../cssr-D9_M6jAV.js";
 
 export { tab_view_default as default };

package/lib/tab-view-DN-KFQWP.js

@@ -0,0 +1,194 @@
+import { a as useStyle, i as cM, n as cB, r as cE, t as c } from "./cssr-D9_M6jAV.js";
+import { computed, createVNode, defineComponent, getCurrentInstance, inject, isVNode, nextTick, onMounted, ref } from "vue";
+import { NTag } from "naive-ui";
+import { useRouter } from "vue-router";
+import { useEventListener } from "@vueuse/core";
+
+//#region src/_utils/get-provider.ts
+let cachedProvider = null;
+function getAppProvider() {
+	if (cachedProvider) return cachedProvider;
+	if (getCurrentInstance()) {
+		const provider = inject("app-provider");
+		if (provider) {
+			cachedProvider = provider;
+			return provider;
+		}
+	}
+	throw new Error("No outer <AppProvider /> founded.");
+}
+
+//#endregion
+//#region src/tab-view/styles/index.ts
+var styles_default = c([cB("tab-view", {
+	display: "flex",
+	gap: "4px",
+	height: "42px",
+	alignItems: "center",
+	backgroundColor: "#fff"
+}, [
+	cE("tabs-wrapper", {
+		display: "flex",
+		flex: 1,
+		height: "100%",
+		overflowX: "auto",
+		padding: "0 10px",
+		whiteSpace: "nowrap",
+		"&::-webkit-scrollbar": { display: "none" },
+		scrollbarWidth: "none"
+	}),
+	cE("tab-item", {
+		cursor: "pointer",
+		display: "flex",
+		height: "100%",
+		alignItems: "center",
+		margin: "0 4px",
+		padding: "0 8px",
+		position: "relative"
+	}),
+	cM("chrome", [cE("tab-item", [c("&:hover:not(.sk-tab-view__tab-item--active)::before", {
+		content: "\"\"",
+		position: "absolute",
+		left: "1px",
+		right: 0,
+		top: "50%",
+		height: "80%",
+		transform: "translateY(-50%)",
+		background: "rgba(0, 0, 0, 0.06)",
+		borderRadius: "var(--sk-tab-radius)"
+	}), cM("active", {
+		color: "var(--sk-tab-primary-color)",
+		"&::before": {
+			content: "\"\"",
+			position: "absolute",
+			left: 0,
+			right: 0,
+			bottom: 0,
+			height: "85%",
+			backgroundColor: "var(--sk-tab-secondary-color)",
+			borderRadius: "10px 10px 0 0"
+		},
+		"&::after": {
+			content: "\"\"",
+			position: "absolute",
+			bottom: 0,
+			left: "-14px",
+			right: "-14px",
+			height: "14px",
+			background: "radial-gradient(circle at 0 0, transparent 14px, var(--sk-tab-secondary-color) 14px) left bottom / 14px 14px no-repeat, radial-gradient(circle at 100% 0, transparent 14px, var(--sk-tab-secondary-color) 14px) right bottom / 14px 14px no-repeat"
+		}
+	})])]),
+	cM("tab", [cE("tab-item", {
+		padding: "0 4px",
+		marginRight: "10px",
+		transition: "border var(--duration) ease",
+		boxSizing: "border-box",
+		borderBottom: "2px solid transparent",
+		"&:hover": {
+			borderBottom: "2px solid var(--sk-tab-primary-color)",
+			color: "var(--sk-tab-primary-color)"
+		}
+	}, [cM("active", {
+		color: "var(--sk-tab-primary-color)",
+		borderBottom: "2px solid var(--sk-tab-primary-color)"
+	})])]),
+	cM("tag", [cE("tabs-wrapper", { alignItems: "center" }), cE("tab-item", {
+		height: "75%",
+		padding: 0
+	}, [c(".n-tag", {
+		height: "100%",
+		cursor: "pointer"
+	}), c("&:hover .n-tag", {
+		color: "var(--sk-tab-primary-color)",
+		backgroundColor: "var(--sk-tab-secondary-color)"
+	}, [c("button", { color: "var(--sk-tab-primary-color)" })])])])
+])]);
+
+//#endregion
+//#region src/tab-view/index.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const TabView = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	const router = useRouter();
+	useStyle("tab-view", styles_default);
+	const provider = getAppProvider();
+	const radiusPX = computed(() => `${provider.theme?.value?.radius}px`);
+	const scrollContainer = ref();
+	const syncScroll = () => {
+		nextTick(() => {
+			const container = scrollContainer.value;
+			const activeTab = container?.querySelector(".sk-tab-view__tab-item--active");
+			if (!container || !activeTab) return;
+			const containerRect = container.getBoundingClientRect();
+			const activeRect = activeTab.getBoundingClientRect();
+			const scrollLeft = container.scrollLeft;
+			const offset = activeRect.left + activeRect.width / 2 - (containerRect.left + containerRect.width / 2);
+			container.scrollTo({
+				left: scrollLeft + offset,
+				behavior: "smooth"
+			});
+		});
+	};
+	onMounted(syncScroll);
+	router.afterEach(syncScroll);
+	useEventListener(scrollContainer, "wheel", (e) => {
+		if (e.deltaY === 0) return;
+		e.preventDefault();
+		if (scrollContainer.value) scrollContainer.value.scrollLeft += e.deltaY;
+	});
+	return () => {
+		return createVNode("div", {
+			"class": ["sk-tab-view", props.type && `sk-tab-view--${props.type}`],
+			"style": {
+				"--sk-tab-radius": radiusPX.value,
+				"--sk-tab-primary-color": provider.theme?.value?.primaryColor,
+				"--sk-tab-secondary-color": provider.theme?.value?.secondaryColor
+			}
+		}, [createVNode("div", {
+			"ref": scrollContainer,
+			"class": "sk-tab-view__tabs-wrapper"
+		}, [props.tabs?.map((item, index) => {
+			const isActive = props.activeTab(item);
+			const content = slots?.default?.({
+				item,
+				index
+			});
+			if (props.type === "tag") return createVNode("div", {
+				"class": "sk-tab-view__tab-item",
+				"key": props.rowKey(item),
+				"onClick": () => props.onClickItem?.(item),
+				"onMouseup": (e) => props.onMouseUpItem?.(e, item, index),
+				"onContextmenu": (e) => {
+					e.preventDefault();
+					props.onContextMenuItem?.(e, item, index);
+				}
+			}, [createVNode(NTag, {
+				"type": isActive ? "primary" : "default",
+				"bordered": false
+			}, _isSlot(content) ? content : { default: () => [content] })]);
+			return createVNode("div", {
+				"key": props.rowKey(item),
+				"class": ["sk-tab-view__tab-item", { "sk-tab-view__tab-item--active": isActive }],
+				"onClick": () => props.onClickItem?.(item),
+				"onMouseup": (e) => props.onMouseUpItem?.(e, item, index),
+				"onContextmenu": (e) => {
+					e.preventDefault();
+					props.onContextMenuItem?.(e, item, index);
+				}
+			}, [content]);
+		})]), slots?.extra?.()]);
+	};
+}, { props: [
+	"tabs",
+	"rowKey",
+	"activeTab",
+	"type",
+	"onClickItem",
+	"onMouseUpItem",
+	"onContextMenuItem"
+] });
+var tab_view_default = TabView;
+
+//#endregion
+export { getAppProvider as n, tab_view_default as t };

package/lib/wrapper/flex-col-wrapper/index.d.ts

@@ -1,2 +1,7 @@
-import { t as _default } from "../../index-BkYadMq_.js";
+import * as vue25 from "vue";
+import * as vue_jsx_runtime1 from "vue/jsx-runtime";
+
+//#region src/wrapper/flex-col-wrapper/index.d.ts
+declare const _default: vue25.DefineComponent<{}, () => vue_jsx_runtime1.JSX.Element, {}, {}, {}, vue25.ComponentOptionsMixin, vue25.ComponentOptionsMixin, {}, string, vue25.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue25.ComponentProvideOptions, true, {}, any>;
+//#endregion
 export { _default as default };

package/lib/wrapper/flex-row-wrapper/index.d.ts

@@ -1,2 +1,7 @@
-import { t as _default } from "../../index-HCwdt_km.js";
+import * as vue4 from "vue";
+import * as vue_jsx_runtime0 from "vue/jsx-runtime";
+
+//#region src/wrapper/flex-row-wrapper/index.d.ts
+declare const _default: vue4.DefineComponent<{}, () => vue_jsx_runtime0.JSX.Element, {}, {}, {}, vue4.ComponentOptionsMixin, vue4.ComponentOptionsMixin, {}, string, vue4.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue4.ComponentProvideOptions, true, {}, any>;
+//#endregion
 export { _default as default };

package/lib/wrapper/scroll-wrapper/index.d.ts

@@ -1,2 +1,7 @@
-import { t as _default } from "../../index-C5y1Tk9t.js";
+import * as vue0 from "vue";
+import * as vue_jsx_runtime0 from "vue/jsx-runtime";
+
+//#region src/wrapper/scroll-wrapper/index.d.ts
+declare const _default: vue0.DefineComponent<{}, () => vue_jsx_runtime0.JSX.Element, {}, {}, {}, vue0.ComponentOptionsMixin, vue0.ComponentOptionsMixin, {}, string, vue0.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue0.ComponentProvideOptions, true, {}, any>;
+//#endregion
 export { _default as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@semi-kit/component",
-  "version": "1.4.9",
+  "version": "1.4.11",
   "description": "Semi-Kit Component Library",
   "type": "module",
   "license": "MIT",

package/lib/index-BScreGz5.d.ts

@@ -1,41 +0,0 @@
-import * as vue0 from "vue";
-import { VNode } from "vue";
-
-//#region src/tab-view/index.d.ts
-type TabActionType = 'closeTab' | 'closeOtherTabs' | 'closeLeftTabs' | 'closeRightTabs';
-interface PropsType<T> {
-  rowKey: (item: T) => string | number;
-  activeTab: (item: T) => boolean;
-  tabs: T[];
-  type?: 'chrome' | 'tab';
-  onClickItem?: (item: T) => void;
-  onMouseUpItem?: (e: MouseEvent, item: T, index: number) => void;
-  onDropdownSelect?: (key: TabActionType, index: number) => void;
-  onContextMenuItem?: (e: MouseEvent, item: T, index: number) => void;
-}
-interface SlotType<T> {
-  default?: (props: {
-    item: T;
-    index: number;
-  }) => VNode;
-  extra?: () => VNode;
-}
-declare const TabView: vue0.DefineSetupFnComponent<{
-  tabs: any;
-  rowKey: any;
-  activeTab: any;
-  type: any;
-  onClickItem: any;
-  onMouseUpItem: any;
-  onContextMenuItem: any;
-}, {}, {}, {
-  tabs: any;
-  rowKey: any;
-  activeTab: any;
-  type: any;
-  onClickItem: any;
-  onMouseUpItem: any;
-  onContextMenuItem: any;
-} & {}, vue0.PublicProps>;
-//#endregion
-export { TabView as i, SlotType as n, TabActionType as r, PropsType as t };

package/lib/index-BkYadMq_.d.ts

@@ -1,7 +0,0 @@
-import * as vue6 from "vue";
-import * as vue_jsx_runtime0 from "vue/jsx-runtime";
-
-//#region src/wrapper/flex-col-wrapper/index.d.ts
-declare const _default: vue6.DefineComponent<{}, () => vue_jsx_runtime0.JSX.Element, {}, {}, {}, vue6.ComponentOptionsMixin, vue6.ComponentOptionsMixin, {}, string, vue6.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue6.ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { _default as t };

package/lib/index-C5y1Tk9t.d.ts

@@ -1,7 +0,0 @@
-import * as vue1 from "vue";
-import * as vue_jsx_runtime0 from "vue/jsx-runtime";
-
-//#region src/wrapper/scroll-wrapper/index.d.ts
-declare const _default: vue1.DefineComponent<{}, () => vue_jsx_runtime0.JSX.Element, {}, {}, {}, vue1.ComponentOptionsMixin, vue1.ComponentOptionsMixin, {}, string, vue1.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue1.ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { _default as t };

package/lib/index-HCwdt_km.d.ts

@@ -1,7 +0,0 @@
-import * as vue11 from "vue";
-import * as vue_jsx_runtime1 from "vue/jsx-runtime";
-
-//#region src/wrapper/flex-row-wrapper/index.d.ts
-declare const _default: vue11.DefineComponent<{}, () => vue_jsx_runtime1.JSX.Element, {}, {}, {}, vue11.ComponentOptionsMixin, vue11.ComponentOptionsMixin, {}, string, vue11.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue11.ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { _default as t };

package/lib/resolver-BVvgCCAW.d.ts

@@ -1,10 +0,0 @@
-//#region src/resolver.d.ts
-declare const SemiComponentResolver: () => {
-  type: "component";
-  resolve: (name: string) => {
-    name: string;
-    from: string;
-  } | undefined;
-};
-//#endregion
-export { SemiComponentResolver as t };

package/lib/resolver-DP3BDWck.js

@@ -1,19 +0,0 @@
-//#region src/resolver.ts
-const SemiComponentResolver = () => {
-	return {
-		type: "component",
-		resolve: (name) => {
-			if ([
-				"ScrollWrapper",
-				"FlexRowWrapper",
-				"FlexColWrapper"
-			].includes(name)) return {
-				name,
-				from: "@semi-kit/component"
-			};
-		}
-	};
-};
-
-//#endregion
-export { SemiComponentResolver as t };

package/lib/tab-view-BktgxoMW.js

@@ -1,168 +0,0 @@
-import { a as useStyle, i as cM, n as cB, r as cE, t as c } from "./cssr-D9_M6jAV.js";
-import { computed, createVNode, defineComponent, getCurrentInstance, inject, nextTick, onMounted, ref } from "vue";
-import { useRouter } from "vue-router";
-import { useEventListener } from "@vueuse/core";
-
-//#region src/_utils/get-provider.ts
-let cachedProvider = null;
-function getAppProvider() {
-	if (cachedProvider) return cachedProvider;
-	if (getCurrentInstance()) {
-		const provider = inject("app-provider");
-		if (provider) {
-			cachedProvider = provider;
-			return provider;
-		}
-	}
-	throw new Error("No outer <AppProvider /> founded.");
-}
-
-//#endregion
-//#region src/tab-view/styles/index.ts
-var styles_default = c([c("@keyframes fade", {
-	"0%": { opacity: 0 },
-	"100%": { opacity: 1 }
-}), cB("tab-view", {
-	backgroundColor: "#fff",
-	display: "flex",
-	gap: "4px",
-	height: "42px",
-	alignItems: "center"
-}, [cE("tabs-wrapper", {
-	display: "flex",
-	flex: 1,
-	height: "100%",
-	overflowX: "auto",
-	padding: "0 10px",
-	whiteSpace: "nowrap",
-	"&::-webkit-scrollbar": { display: "none" },
-	scrollbarWidth: "none"
-}), cE("tab-item", {
-	cursor: "pointer",
-	display: "flex",
-	height: "100%",
-	alignItems: "center",
-	margin: "0 4px",
-	padding: "0 8px",
-	position: "relative",
-	transition: "all 200ms"
-}, [cM("chrome", {}, [
-	c("&:hover:not(.sk-tab-view__tab-item--active)::before", {
-		content: "\"\"",
-		position: "absolute",
-		left: "1px",
-		right: 0,
-		top: "50%",
-		height: "80%",
-		transform: "translateY(-50%)",
-		background: "rgba(0, 0, 0, 0.06)",
-		borderRadius: "var(--sk-tab-radius)"
-	}),
-	c("&.sk-tab-view__tab-item--active", { color: "var(--sk-tab-primary-color)" }),
-	c("&.sk-tab-view__tab-item--active::before", {
-		content: "\"\"",
-		position: "absolute",
-		left: 0,
-		right: 0,
-		bottom: 0,
-		height: "85%",
-		backgroundColor: "var(--sk-tab-secondary-color)",
-		borderRadius: "10px 10px 0 0"
-	}),
-	c("&.sk-tab-view__tab-item--active::after", {
-		content: "\"\"",
-		position: "absolute",
-		bottom: 0,
-		left: "-14px",
-		right: "-14px",
-		height: "14px",
-		background: "radial-gradient(circle at 0 0, transparent 14px, var(--sk-tab-secondary-color) 14px) left bottom / 14px 14px no-repeat, radial-gradient(circle at 100% 0, transparent 14px, var(--sk-tab-secondary-color) 14px) right bottom / 14px 14px no-repeat"
-	})
-]), cM("tab", {
-	padding: "0 4px",
-	marginRight: "10px",
-	cursor: "pointer",
-	transition: "border var(--duration) ease",
-	animation: "fade var(--duration) ease",
-	boxSizing: "border-box",
-	borderBottom: "2px solid transparent"
-}, [c("&:hover", {
-	borderBottom: "2px solid var(--sk-tab-primary-color)",
-	color: "var(--sk-tab-primary-color)"
-}), c("&.sk-tab-view__tab-item--active", {
-	color: "var(--sk-tab-primary-color)",
-	borderBottom: "2px solid var(--sk-tab-primary-color)"
-})])])])]);
-
-//#endregion
-//#region src/tab-view/index.tsx
-const TabView = /* @__PURE__ */ defineComponent((props, { slots }) => {
-	const router = useRouter();
-	useStyle("tab-view", styles_default);
-	const provider = getAppProvider();
-	const radiusPX = computed(() => `${provider.theme?.value?.radius}px`);
-	const scrollContainer = ref();
-	const syncScroll = () => {
-		nextTick(() => {
-			const container = scrollContainer.value;
-			const activeTab = container?.querySelector(".sk-tab-view__tab-item--active");
-			if (!container || !activeTab) return;
-			const containerRect = container.getBoundingClientRect();
-			const activeRect = activeTab.getBoundingClientRect();
-			const scrollLeft = container.scrollLeft;
-			const offset = activeRect.left + activeRect.width / 2 - (containerRect.left + containerRect.width / 2);
-			container.scrollTo({
-				left: scrollLeft + offset,
-				behavior: "smooth"
-			});
-		});
-	};
-	onMounted(syncScroll);
-	router.afterEach(syncScroll);
-	useEventListener(scrollContainer, "wheel", (e) => {
-		if (e.deltaY === 0) return;
-		e.preventDefault();
-		if (scrollContainer.value) scrollContainer.value.scrollLeft += e.deltaY;
-	});
-	return () => {
-		return createVNode("div", {
-			"class": "sk-tab-view",
-			"style": {
-				"--sk-tab-radius": radiusPX.value,
-				"--sk-tab-primary-color": provider.theme?.value?.primaryColor,
-				"--sk-tab-secondary-color": provider.theme?.value?.secondaryColor
-			}
-		}, [createVNode("div", {
-			"ref": scrollContainer,
-			"class": "sk-tab-view__tabs-wrapper"
-		}, [props.tabs?.map((item, index) => createVNode("div", {
-			"key": props.rowKey(item),
-			"class": [
-				"sk-tab-view__tab-item",
-				{ "sk-tab-view__tab-item--active": props.activeTab(item) },
-				`sk-tab-view__tab-item--${props.type}`
-			],
-			"onClick": () => props.onClickItem?.(item),
-			"onMouseup": (e) => props.onMouseUpItem?.(e, item, index),
-			"onContextmenu": (e) => {
-				e.preventDefault();
-				props.onContextMenuItem?.(e, item, index);
-			}
-		}, [slots?.default?.({
-			item,
-			index
-		})]))]), slots?.extra?.()]);
-	};
-}, { props: [
-	"tabs",
-	"rowKey",
-	"activeTab",
-	"type",
-	"onClickItem",
-	"onMouseUpItem",
-	"onContextMenuItem"
-] });
-var tab_view_default = TabView;
-
-//#endregion
-export { getAppProvider as n, tab_view_default as t };