@shtabapp/ui-kit 1.26.0 → 1.28.0

package/dist/useLink-1LLWpdDZ.cjs

@@ -0,0 +1 @@
+let e=require("vue");var t=e=>e?typeof e==`string`?{mode:`href`,rootTag:`a`,linkBindings:{href:e}}:{mode:`route`,rootTag:`router-link`,linkBindings:{to:e}}:{mode:`none`},n=e=>t(e).mode!==`none`,r=(e,t)=>{if(e.mode===`none`)return{};if(e.mode===`route`){let n={...e.linkBindings};return t?.replace&&(n.replace=!0),n}return e.linkBindings},i=(e,t)=>{let n=Object.keys(e),r=Object.keys(t);if(n.length!==r.length)return!1;for(let r of n){let n=e[r],i=t[r];if(String(n??``)!==String(i??``))return!1}return!0},a=(n,r)=>(0,e.computed)(()=>{let i=t((0,e.toValue)(n));return i.mode===`route`&&!r?{mode:`none`}:i}),o=t=>({linkPresentation:a(t,!1),isLink:(0,e.computed)(()=>n((0,e.toValue)(t))),isRouterLink:(0,e.computed)(()=>!1),isActive:(0,e.computed)(()=>!1),navigate:()=>Promise.reject(Error(`[@shtabapp/ui-kit] useLink.navigate() requires an active vue-router instance. Install and register vue-router in the app, or use an href link.`))}),s=e=>typeof e==`object`&&!!e&&`useLink`in e,c=(t,r,o,s,c)=>{let l=a(o,!0),u=(0,e.computed)(()=>n((0,e.toValue)(o))),d=(0,e.computed)(()=>l.value.mode===`route`),f=(0,e.computed)(()=>{let e=l.value;return e.mode===`route`?e.linkBindings.to:``}),p=r.useLink({to:(0,e.toRef)(()=>f.value),replace:(0,e.toRef)(()=>(0,e.toValue)(c)??!1)});return{linkPresentation:l,isLink:u,isRouterLink:d,isActive:(0,e.computed)(()=>d.value?(0,e.toValue)(s)??!1?p.isExactActive.value?i(p.route.value.query,t.currentRoute.value.query):!1:p.isActive.value:!1),navigate:e=>d.value?p.navigate(e):Promise.resolve()}},l=(t,n,r)=>{let i=(0,e.getCurrentInstance)()?.proxy?.$router,a=i?(0,e.resolveDynamicComponent)(`RouterLink`):void 0;return!i||!s(a)?o(t):c(i,a,t,n,r)};Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return l}});

package/dist/useLink-Com5VhOk.js

@@ -0,0 +1,55 @@
+import { computed as e, getCurrentInstance as t, resolveDynamicComponent as n, toRef as r, toValue as i } from "vue";
+//#region src/utils/vueRouterLinkPresentation.ts
+var a = (e) => e ? typeof e == "string" ? {
+	mode: "href",
+	rootTag: "a",
+	linkBindings: { href: e }
+} : {
+	mode: "route",
+	rootTag: "router-link",
+	linkBindings: { to: e }
+} : { mode: "none" }, o = (e) => a(e).mode !== "none", s = (e, t) => {
+	if (e.mode === "none") return {};
+	if (e.mode === "route") {
+		let n = { ...e.linkBindings };
+		return t?.replace && (n.replace = !0), n;
+	}
+	return e.linkBindings;
+}, c = (e, t) => {
+	let n = Object.keys(e), r = Object.keys(t);
+	if (n.length !== r.length) return !1;
+	for (let r of n) {
+		let n = e[r], i = t[r];
+		if (String(n ?? "") !== String(i ?? "")) return !1;
+	}
+	return !0;
+}, l = (t, n) => e(() => {
+	let e = a(i(t));
+	return e.mode === "route" && !n ? { mode: "none" } : e;
+}), u = (t) => ({
+	linkPresentation: l(t, !1),
+	isLink: e(() => o(i(t))),
+	isRouterLink: e(() => !1),
+	isActive: e(() => !1),
+	navigate: () => Promise.reject(/* @__PURE__ */ Error("[@shtabapp/ui-kit] useLink.navigate() requires an active vue-router instance. Install and register vue-router in the app, or use an href link."))
+}), d = (e) => typeof e == "object" && !!e && "useLink" in e, f = (t, n, a, s, u) => {
+	let d = l(a, !0), f = e(() => o(i(a))), p = e(() => d.value.mode === "route"), m = e(() => {
+		let e = d.value;
+		return e.mode === "route" ? e.linkBindings.to : "";
+	}), h = n.useLink({
+		to: r(() => m.value),
+		replace: r(() => i(u) ?? !1)
+	});
+	return {
+		linkPresentation: d,
+		isLink: f,
+		isRouterLink: p,
+		isActive: e(() => p.value ? i(s) ?? !1 ? h.isExactActive.value ? c(h.route.value.query, t.currentRoute.value.query) : !1 : h.isActive.value : !1),
+		navigate: (e) => p.value ? h.navigate(e) : Promise.resolve()
+	};
+}, p = (e, r, i) => {
+	let a = t()?.proxy?.$router, o = a ? n("RouterLink") : void 0;
+	return !a || !d(o) ? u(e) : f(a, o, e, r, i);
+};
+//#endregion
+export { s as n, o as r, p as t };

package/package.json

@@ -1,12 +1,19 @@
 {
   "name": "@shtabapp/ui-kit",
-  "version": "1.26.0",
-  "description": "Compose-ready Vue 3 components for Shtab UI Kit",
+  "version": "1.28.0",
+  "description": "Vue 3 component library by Shtab — 30+ typed components, design tokens, light/dark themes",
   "keywords": [
     "shtab",
     "vue",
-    "components"
+    "vue3",
+    "components",
+    "component-library",
+    "ui-kit",
+    "design-system",
+    "design-tokens",
+    "typescript"
   ],
+  "homepage": "https://ui.shtab.app",
   "license": "MIT",
   "type": "module",
   "publishConfig": {
@@ -211,8 +218,8 @@
   },
   "dependencies": {
     "chart.js": "^4.5.0",
-    "@shtabapp/ui-kit-tokens": "^1.13.0",
-    "@shtabapp/ui-kit-primitives": "^1.11.0"
+    "@shtabapp/ui-kit-primitives": "^1.14.0",
+    "@shtabapp/ui-kit-tokens": "^1.14.0"
   },
   "devDependencies": {
     "@storybook/vue3-vite": "^10.4.1",

package/dist/SAvatar-C9YzCOKj.cjs

@@ -1 +0,0 @@
-let e=require("vue");var t=function(e){return e.SIZE_80=`80`,e.SIZE_40=`40`,e.SIZE_32=`32`,e.SIZE_24=`24`,e.SIZE_20=`20`,e.SIZE_16=`16`,e}({}),n=function(e){return e.CIRCLE=`circle`,e.SQUARE=`square`,e}({}),r=function(e){return e.TEAL=`teal`,e.CYAN=`cyan`,e.INDIGO=`indigo`,e.VIOLET=`violet`,e.PINK=`pink`,e.SURFACE=`surface`,e}({}),i=e=>e.startsWith(`#`),a=e=>i(e)?`s-ui-avatar--color-custom`:`s-ui-avatar--color-${e}`,o=e=>({"--s-ui-avatar-background":e}),s=[`aria-disabled`],c={class:`s-ui-avatar__content`},l=[`src`,`alt`],u=[`role`,`aria-label`],d={key:0,class:`s-ui-avatar__name`},f=(0,e.defineComponent)({inheritAttrs:!1,__name:`SAvatar`,props:{alt:{},color:{default:()=>r.TEAL},disabled:{type:Boolean,default:!1},initialLength:{default:1},name:{},shape:{default:()=>n.CIRCLE},showName:{type:Boolean,default:!0},size:{default:()=>t.SIZE_40},src:{}},setup(n){let r=(0,e.useAttrs)(),f=(0,e.ref)(!1),p=e=>typeof e==`number`||typeof e==`string`,m=(0,e.computed)(()=>{if(p(r.tabindex))return r.tabindex;if(p(r.tabIndex))return r.tabIndex}),h=(0,e.computed)(()=>p(r.tabindex)||p(r.tabIndex)),g=(0,e.computed)(()=>n.disabled?-1:h.value?m.value:0),_=(0,e.computed)(()=>({...r,tabindex:g.value})),v=(0,e.computed)(()=>[`s-ui-avatar--size-${n.size}`,`s-ui-avatar--shape-${n.shape}`,a(n.color),{"s-ui-avatar--disabled":n.disabled,"s-ui-avatar--photo":n.src&&!f.value}]),y=(0,e.computed)(()=>{if(i(n.color))return o(n.color)}),b=e=>{let t=e.split(/\s+/).filter(Boolean);if(t.length===1){let e=t[0];if(e)return e}return t.map(e=>e.slice(0,1)).join(``)},x=(0,e.computed)(()=>n.name?b(n.name):``),S=(0,e.computed)(()=>n.alt?n.alt:n.name?n.name:x.value),C=(0,e.computed)(()=>x.value.slice(0,Math.max(n.initialLength,0))),w={[t.SIZE_80]:`s-ui-typography-label-16-medium`,[t.SIZE_40]:`s-ui-typography-label-14-medium`,[t.SIZE_32]:`s-ui-typography-label-12-medium`,[t.SIZE_24]:`s-ui-typography-label-12-medium`,[t.SIZE_20]:`s-ui-typography-label-12-medium`,[t.SIZE_16]:`s-ui-typography-label-10-medium`},T=(0,e.computed)(()=>w[n.size]),E=()=>{f.value=!0};return(0,e.watch)(()=>n.src,()=>{f.value=!1}),(t,r)=>((0,e.openBlock)(),(0,e.createElementBlock)(`span`,(0,e.mergeProps)(_.value,{class:[`s-ui-avatar`,v.value],style:y.value,"aria-disabled":n.disabled||void 0}),[(0,e.createElementVNode)(`span`,c,[n.src&&!f.value?((0,e.openBlock)(),(0,e.createElementBlock)(`img`,{key:0,class:`s-ui-avatar__image`,src:n.src,alt:S.value,onError:E},null,40,l)):((0,e.openBlock)(),(0,e.createElementBlock)(`span`,{key:1,class:(0,e.normalizeClass)([`s-ui-avatar__initials`,T.value]),role:n.alt?`img`:void 0,"aria-label":n.alt},(0,e.toDisplayString)(C.value),11,u))]),n.showName&&n.name?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,d,(0,e.toDisplayString)(n.name),1)):(0,e.createCommentVNode)(``,!0)],16,s))}});Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return f}});

package/dist/SAvatar-CGxQaW36.js

@@ -1,87 +0,0 @@
-import { computed as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, defineComponent as i, mergeProps as a, normalizeClass as o, openBlock as s, ref as c, toDisplayString as l, useAttrs as u, watch as d } from "vue";
-//#region src/components/SAvatar/SAvatar.types.ts
-var f = /* @__PURE__ */ function(e) {
-	return e.SIZE_80 = "80", e.SIZE_40 = "40", e.SIZE_32 = "32", e.SIZE_24 = "24", e.SIZE_20 = "20", e.SIZE_16 = "16", e;
-}({}), p = /* @__PURE__ */ function(e) {
-	return e.CIRCLE = "circle", e.SQUARE = "square", e;
-}({}), m = /* @__PURE__ */ function(e) {
-	return e.TEAL = "teal", e.CYAN = "cyan", e.INDIGO = "indigo", e.VIOLET = "violet", e.PINK = "pink", e.SURFACE = "surface", e;
-}({}), h = (e) => e.startsWith("#"), g = (e) => h(e) ? "s-ui-avatar--color-custom" : `s-ui-avatar--color-${e}`, _ = (e) => ({ "--s-ui-avatar-background": e }), v = ["aria-disabled"], y = { class: "s-ui-avatar__content" }, b = ["src", "alt"], x = ["role", "aria-label"], S = {
-	key: 0,
-	class: "s-ui-avatar__name"
-}, C = /* @__PURE__ */ i({
-	inheritAttrs: !1,
-	__name: "SAvatar",
-	props: {
-		alt: {},
-		color: { default: () => m.TEAL },
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		initialLength: { default: 1 },
-		name: {},
-		shape: { default: () => p.CIRCLE },
-		showName: {
-			type: Boolean,
-			default: !0
-		},
-		size: { default: () => f.SIZE_40 },
-		src: {}
-	},
-	setup(i) {
-		let p = u(), m = c(!1), C = (e) => typeof e == "number" || typeof e == "string", w = e(() => {
-			if (C(p.tabindex)) return p.tabindex;
-			if (C(p.tabIndex)) return p.tabIndex;
-		}), T = e(() => C(p.tabindex) || C(p.tabIndex)), E = e(() => i.disabled ? -1 : T.value ? w.value : 0), D = e(() => ({
-			...p,
-			tabindex: E.value
-		})), O = e(() => [
-			`s-ui-avatar--size-${i.size}`,
-			`s-ui-avatar--shape-${i.shape}`,
-			g(i.color),
-			{
-				"s-ui-avatar--disabled": i.disabled,
-				"s-ui-avatar--photo": i.src && !m.value
-			}
-		]), k = e(() => {
-			if (h(i.color)) return _(i.color);
-		}), A = (e) => {
-			let t = e.split(/\s+/).filter(Boolean);
-			if (t.length === 1) {
-				let e = t[0];
-				if (e) return e;
-			}
-			return t.map((e) => e.slice(0, 1)).join("");
-		}, j = e(() => i.name ? A(i.name) : ""), M = e(() => i.alt ? i.alt : i.name ? i.name : j.value), N = e(() => j.value.slice(0, Math.max(i.initialLength, 0))), P = {
-			[f.SIZE_80]: "s-ui-typography-label-16-medium",
-			[f.SIZE_40]: "s-ui-typography-label-14-medium",
-			[f.SIZE_32]: "s-ui-typography-label-12-medium",
-			[f.SIZE_24]: "s-ui-typography-label-12-medium",
-			[f.SIZE_20]: "s-ui-typography-label-12-medium",
-			[f.SIZE_16]: "s-ui-typography-label-10-medium"
-		}, F = e(() => P[i.size]), I = () => {
-			m.value = !0;
-		};
-		return d(() => i.src, () => {
-			m.value = !1;
-		}), (e, c) => (s(), n("span", a(D.value, {
-			class: ["s-ui-avatar", O.value],
-			style: k.value,
-			"aria-disabled": i.disabled || void 0
-		}), [r("span", y, [i.src && !m.value ? (s(), n("img", {
-			key: 0,
-			class: "s-ui-avatar__image",
-			src: i.src,
-			alt: M.value,
-			onError: I
-		}, null, 40, b)) : (s(), n("span", {
-			key: 1,
-			class: o(["s-ui-avatar__initials", F.value]),
-			role: i.alt ? "img" : void 0,
-			"aria-label": i.alt
-		}, l(N.value), 11, x))]), i.showName && i.name ? (s(), n("span", S, l(i.name), 1)) : t("", !0)], 16, v));
-	}
-});
-//#endregion
-export { f as i, m as n, p as r, C as t };

package/dist/useLink-CvN7IK0Z.cjs

@@ -1 +0,0 @@
-let e=require("vue"),t=require("vue-router");var n=e=>e?typeof e==`string`?{mode:`href`,rootTag:`a`,linkBindings:{href:e}}:{mode:`route`,rootTag:`router-link`,linkBindings:{to:e}}:{mode:`none`},r=e=>n(e).mode!==`none`,i=(e,t)=>{if(e.mode===`none`)return{};if(e.mode===`route`){let n={...e.linkBindings};return t?.replace&&(n.replace=!0),n}return e.linkBindings},a=(e,t)=>{let n=Object.keys(e),r=Object.keys(t);if(n.length!==r.length)return!1;for(let r of n){let n=e[r],i=t[r];if(String(n??``)!==String(i??``))return!1}return!0},o=(t,r)=>(0,e.computed)(()=>{let i=n((0,e.toValue)(t));return i.mode===`route`&&!r?{mode:`none`}:i}),s=t=>({linkPresentation:o(t,!1),isLink:(0,e.computed)(()=>r((0,e.toValue)(t))),isRouterLink:(0,e.computed)(()=>!1),isActive:(0,e.computed)(()=>!1),navigate:()=>Promise.reject(Error(`[@shtabapp/ui-kit] useLink.navigate() requires an active vue-router instance. Install and register vue-router in the app, or use an href link.`))}),c=(n,i,s)=>{let c=(0,e.inject)(t.routeLocationKey,null),l=o(n,!0),u=(0,e.computed)(()=>r((0,e.toValue)(n))),d=(0,e.computed)(()=>l.value.mode===`route`),f=(0,e.computed)(()=>{let e=l.value;return e.mode===`route`?e.linkBindings.to:``}),p=t.RouterLink.useLink({to:(0,e.toRef)(()=>f.value),replace:(0,e.toRef)(()=>(0,e.toValue)(s)??!1)});return{linkPresentation:l,isLink:u,isRouterLink:d,isActive:(0,e.computed)(()=>d.value?(0,e.toValue)(i)??!1?p.isExactActive.value?c?a(p.route.value.query,c.query):p.isExactActive.value:!1:p.isActive.value:!1),navigate:e=>d.value?p.navigate(e):Promise.resolve()}},l=(n,r,i)=>(0,e.inject)(t.routerKey,null)?c(n,r,i):s(n);Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return l}});

package/dist/useLink-Zo9A_RCf.js

@@ -1,53 +0,0 @@
-import { computed as e, inject as t, toRef as n, toValue as r } from "vue";
-import { RouterLink as i, routeLocationKey as a, routerKey as o } from "vue-router";
-//#region src/utils/vueRouterLinkPresentation.ts
-var s = (e) => e ? typeof e == "string" ? {
-	mode: "href",
-	rootTag: "a",
-	linkBindings: { href: e }
-} : {
-	mode: "route",
-	rootTag: "router-link",
-	linkBindings: { to: e }
-} : { mode: "none" }, c = (e) => s(e).mode !== "none", l = (e, t) => {
-	if (e.mode === "none") return {};
-	if (e.mode === "route") {
-		let n = { ...e.linkBindings };
-		return t?.replace && (n.replace = !0), n;
-	}
-	return e.linkBindings;
-}, u = (e, t) => {
-	let n = Object.keys(e), r = Object.keys(t);
-	if (n.length !== r.length) return !1;
-	for (let r of n) {
-		let n = e[r], i = t[r];
-		if (String(n ?? "") !== String(i ?? "")) return !1;
-	}
-	return !0;
-}, d = (t, n) => e(() => {
-	let e = s(r(t));
-	return e.mode === "route" && !n ? { mode: "none" } : e;
-}), f = (t) => ({
-	linkPresentation: d(t, !1),
-	isLink: e(() => c(r(t))),
-	isRouterLink: e(() => !1),
-	isActive: e(() => !1),
-	navigate: () => Promise.reject(/* @__PURE__ */ Error("[@shtabapp/ui-kit] useLink.navigate() requires an active vue-router instance. Install and register vue-router in the app, or use an href link."))
-}), p = (o, s, l) => {
-	let f = t(a, null), p = d(o, !0), m = e(() => c(r(o))), h = e(() => p.value.mode === "route"), g = e(() => {
-		let e = p.value;
-		return e.mode === "route" ? e.linkBindings.to : "";
-	}), _ = i.useLink({
-		to: n(() => g.value),
-		replace: n(() => r(l) ?? !1)
-	});
-	return {
-		linkPresentation: p,
-		isLink: m,
-		isRouterLink: h,
-		isActive: e(() => h.value ? r(s) ?? !1 ? _.isExactActive.value ? f ? u(_.route.value.query, f.query) : _.isExactActive.value : !1 : _.isActive.value : !1),
-		navigate: (e) => h.value ? _.navigate(e) : Promise.resolve()
-	};
-}, m = (e, n, r) => t(o, null) ? p(e, n, r) : f(e);
-//#endregion
-export { l as n, c as r, m as t };