sard 1.0.11 → 1.0.13

package/components/sidebar/index.css

@@ -1 +1 @@
-:root{--s-sidebar-bg:var(--s-fill-color-tertiary);--s-sidebar-width:92px;--s-sidebar-item-padding-x:20px;--s-sidebar-item-padding-y:14px;--s-sidebar-item-font-size:var(--s-font-size-sm);--s-sidebar-item-color:var(--s-text-color-secondary);--s-sidebar-item-bg-active:var(--s-bg-color-extreme);--s-sidebar-item-color-active:var(--s-text-color-emphasis);--s-sidebar-item-font-weight-active:var(--s-font-weight-normal);--s-sidebar-line-width:3px;--s-sidebar-line-height:12px;--s-sidebar-line-bg:var(--s-color-primary);--s-sidebar-round-size:var(--s-border-radius)}.s-sidebar{overflow-x:hidden;overflow-y:auto;width:var(--s-sidebar-width);background:var(--s-sidebar-bg)}.s-sidebar-item{position:relative;padding:var(--s-sidebar-item-padding-y) var(--s-sidebar-item-padding-x);cursor:pointer;font-size:var(--s-sidebar-item-font-size);line-height:var(--s-line-height-snug);color:var(--s-sidebar-item-color);text-align:center}.s-sidebar-item:is(.is-current){font-weight:var(--s-sidebar-item-font-weight-active);color:var(--s-sidebar-item-color-active);background:var(--s-sidebar-item-bg-active)}.s-sidebar-item:is(.is-disabled){color:var(--s-text-color-disabled);cursor:var(--s-cursor-disabled)}.s-sidebar-item__title{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2}.s-sidebar-item__line{position:absolute;top:50%;inset-inline-start:0;width:var(--s-sidebar-line-width);height:var(--s-sidebar-line-height);transform:translateY(-50%);background:var(--s-sidebar-line-bg)}.s-sidebar-item__round-top,.s-sidebar-item__round-bottom{position:absolute;inset-inline-end:0;width:var(--s-sidebar-round-size);height:var(--s-sidebar-round-size);background:var(--s-sidebar-item-bg-active);pointer-events:none}.s-sidebar-item__round-top::before,.s-sidebar-item__round-bottom::before{content:"";display:flex;width:100%;height:100%;background:var(--s-sidebar-bg)}.s-sidebar-item__round-top{bottom:100%}:root:not([dir=rtl]) .s-sidebar-item__round-top::before{border-bottom-right-radius:100%}:root[dir=rtl] .s-sidebar-item__round-top::before{border-bottom-left-radius:100%}.s-sidebar-item__round-bottom{top:100%}:root:not([dir=rtl]) .s-sidebar-item__round-bottom::before{border-top-right-radius:100%}:root[dir=rtl] .s-sidebar-item__round-bottom::before{border-top-left-radius:100%}
+:root{--s-sidebar-bg:var(--s-fill-color-tertiary);--s-sidebar-width:92px;--s-sidebar-item-padding-x:20px;--s-sidebar-item-padding-y:14px;--s-sidebar-item-font-size:var(--s-font-size-sm);--s-sidebar-item-color:var(--s-text-color-secondary);--s-sidebar-item-bg-active:var(--s-bg-color-extreme);--s-sidebar-item-color-active:var(--s-text-color-emphasis);--s-sidebar-item-font-weight-active:var(--s-font-weight-normal);--s-sidebar-line-width:3px;--s-sidebar-line-height:12px;--s-sidebar-line-bg:var(--s-color-primary);--s-sidebar-round-size:var(--s-border-radius)}.s-sidebar{overflow-x:hidden;overflow-y:auto;width:var(--s-sidebar-width);background:var(--s-sidebar-bg)}.s-sidebar-item{position:relative;padding:var(--s-sidebar-item-padding-y) var(--s-sidebar-item-padding-x);cursor:pointer;font-size:var(--s-sidebar-item-font-size);line-height:var(--s-line-height-snug);color:var(--s-sidebar-item-color);text-align:center}.s-sidebar-item:is(.is-active){font-weight:var(--s-sidebar-item-font-weight-active);color:var(--s-sidebar-item-color-active);background:var(--s-sidebar-item-bg-active)}.s-sidebar-item:is(.is-disabled){color:var(--s-text-color-disabled);cursor:var(--s-cursor-disabled)}.s-sidebar-item__label{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2}.s-sidebar-item__line{position:absolute;top:50%;inset-inline-start:0;width:var(--s-sidebar-line-width);height:var(--s-sidebar-line-height);transform:translateY(-50%);background:var(--s-sidebar-line-bg)}.s-sidebar-item__round-top,.s-sidebar-item__round-bottom{position:absolute;inset-inline-end:0;width:var(--s-sidebar-round-size);height:var(--s-sidebar-round-size);background:var(--s-sidebar-item-bg-active);pointer-events:none}.s-sidebar-item__round-top::before,.s-sidebar-item__round-bottom::before{content:"";display:flex;width:100%;height:100%;background:var(--s-sidebar-bg)}.s-sidebar-item__round-top{bottom:100%}:root:not([dir=rtl]) .s-sidebar-item__round-top::before{border-bottom-right-radius:100%}:root[dir=rtl] .s-sidebar-item__round-top::before{border-bottom-left-radius:100%}.s-sidebar-item__round-bottom{top:100%}:root:not([dir=rtl]) .s-sidebar-item__round-bottom::before{border-top-right-radius:100%}:root[dir=rtl] .s-sidebar-item__round-bottom::before{border-top-left-radius:100%}

package/components/sidebar/sidebar-item.vue.js

@@ -5,11 +5,11 @@ import { computed, createCommentVNode, createElementBlock, createElementVNode, d
 var sidebar_item_default = /*@__PURE__*/ defineComponent({
 	__name: "sidebar-item",
 	props: {
-		title: {
+		label: {
 			type: String,
 			required: false
 		},
-		name: {
+		value: {
 			type: [String, Number],
 			required: true
 		},
@@ -26,11 +26,11 @@ var sidebar_item_default = /*@__PURE__*/ defineComponent({
 		const context = inject(sidebarContextKey);
 		if (!context) throw new Error("SidebarItem must be included in Sidebar.");
 		const isCurrent = computed(() => {
-			return context.current === props.name;
+			return context.value === props.value;
 		});
 		const member = reactive({
 			el: useTemplateRef("item"),
-			name: toRef(() => props.name)
+			value: toRef(() => props.value)
 		});
 		const select = () => {
 			context.select(member);
@@ -51,7 +51,7 @@ var sidebar_item_default = /*@__PURE__*/ defineComponent({
 		const sidebarItemClass = computed(() => {
 			return [
 				bem.b(),
-				bem.is("current", isCurrent.value),
+				bem.is("active", isCurrent.value),
 				bem.is("disabled", props.disabled)
 			];
 		});
@@ -70,7 +70,7 @@ var sidebar_item_default = /*@__PURE__*/ defineComponent({
 					key: 1,
 					class: normalizeClass(unref(bem).e("line"))
 				}, null, 2)) : createCommentVNode("v-if", true),
-				renderSlot(_ctx.$slots, "default", {}, () => [createElementVNode("div", { class: normalizeClass(unref(bem).e("title")) }, toDisplayString(__props.title), 3)]),
+				renderSlot(_ctx.$slots, "default", {}, () => [createElementVNode("div", { class: normalizeClass(unref(bem).e("label")) }, toDisplayString(__props.label), 3)]),
 				isCurrent.value && unref(context).round ? (openBlock(), createElementBlock("div", {
 					key: 2,
 					class: normalizeClass(unref(bem).e("round-bottom"))

package/components/sidebar/sidebar.vue.js

@@ -29,11 +29,11 @@ var sidebar_default = /*@__PURE__*/ defineComponent({
 		const props = __props;
 		const emit = __emit;
 		const bem = createBem("sidebar");
-		const innerCurrent = ref(props.modelValue);
+		const innerValue = ref(props.modelValue);
 		const members = reactive([]);
 		const scrollRef = useTemplateRef("scroll");
-		const scrollIntoView = (name) => {
-			const member = members.find((member) => member.name === name);
+		const scrollIntoView = (value) => {
+			const member = members.find((member) => member.value === value);
 			if (!member) return;
 			scrollToTarget(scrollRef.value, member.el, {
 				...props.scrollIntoViewOptions,
@@ -41,13 +41,13 @@ var sidebar_default = /*@__PURE__*/ defineComponent({
 			});
 		};
 		watch(() => props.modelValue, () => {
-			if (!isNullish(props.modelValue) && props.modelValue !== innerCurrent.value) {
-				innerCurrent.value = props.modelValue;
+			if (!isNullish(props.modelValue) && props.modelValue !== innerValue.value) {
+				innerValue.value = props.modelValue;
 				scrollIntoView(props.modelValue);
 			}
 		});
 		provide(sidebarContextKey, reactive({
-			current: innerCurrent,
+			value: innerValue,
 			round: toRef(() => props.round),
 			line: toRef(() => props.line),
 			addMember(member) {
@@ -58,11 +58,11 @@ var sidebar_default = /*@__PURE__*/ defineComponent({
 				if (index !== -1) members.splice(index, 1);
 			},
 			select(member) {
-				const name = member.name;
-				if (name !== innerCurrent.value) {
-					innerCurrent.value = name;
-					emit("update:modelValue", name);
-					emit("change", name);
+				const value = member.value;
+				if (value !== innerValue.value) {
+					innerValue.value = value;
+					emit("update:modelValue", value);
+					emit("change", value);
 				}
 			}
 		}));

package/components/tabbar/common.d.ts

@@ -1,7 +1,7 @@
 import type { InjectionKey } from 'vue';
 import { type DefaultProps } from '../config';
 export interface TabbarProps {
-    current?: number | string;
+    modelValue?: number | string;
     color?: string;
     activeColor?: string;
     bordered?: boolean;
@@ -13,12 +13,12 @@ export interface TabbarSlots {
     default?(props: Record<string, never>): any;
 }
 export interface TabbarEmits {
-    (e: 'update:current', current: number | string): void;
-    (e: 'change', current: number | string): void;
+    (e: 'update:modelValue', value: number | string): void;
+    (e: 'change', value: number | string): void;
 }
 export interface TabbarItemProps {
-    name?: string | number;
-    text?: string;
+    value?: string | number;
+    label?: string;
 }
 export interface TabbarItemSlots {
     default?(props: Record<string, never>): any;
@@ -32,7 +32,7 @@ export interface TabbarItemEmits {
 export interface TabbarContext {
     color: TabbarProps['color'];
     activeColor: TabbarProps['activeColor'];
-    current: any;
-    select: (name: string | number) => void;
+    value: any;
+    select: (value: string | number) => void;
 }
 export declare const tabbarContextKey: InjectionKey<TabbarContext>;

package/components/tabbar/index.css

@@ -1 +1 @@
-:root{--s-tabbar-z-index:var(--s-z-index-secondary);--s-tabbar-height:50px;--s-tabbar-border-color:var(--s-border-color);--s-tabbar-bg:var(--s-bg-color-container);--s-tabbar-color:var(--s-text-color-secondary);--s-tabbar-item-color-active:var(--s-color-primary);--s-tabbar-item-icon-margin-bottom:var(--s-size-2xs);--s-tabbar-item-icon-font-size:var(--s-size-lg);--s-tabbar-item-text-font-size:var(--s-font-size-sm)}.s-tabbar{display:flex;align-items:stretch;height:var(--s-tabbar-height);color:var(--s-tabbar-color);background:var(--s-tabbar-bg)}.s-tabbar--fixed{position:fixed;bottom:0;left:0;width:100%;z-index:var(--s-tabbar-z-index)}.s-tabbar--safe{height:calc(var(--s-tabbar-height) + var(--s-safe-bottom));padding-bottom:var(--s-safe-bottom)}.s-tabbar--bordered::before{position:absolute;z-index:1;pointer-events:none;touch-action:none;opacity:1;content:"";left:0;right:0;transform:scaleY(0.5);top:0;border-top:var(--s-border-width) var(--s-border-style) var(--s-tabbar-border-color);transform-origin:top center}.s-tabbar__item{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;font-size:var(--s-tabbar-item-text-font-size);line-height:var(--s-line-height-tight);color:var(--s-tabbar-color);cursor:pointer}.s-tabbar__item--current{color:var(--s-tabbar-item-color-active)}.s-tabbar__icon{margin-bottom:var(--s-tabbar-item-icon-margin-bottom);font-size:var(--s-tabbar-item-icon-font-size);line-height:var(--s-line-height-none)}
+:root{--s-tabbar-z-index:var(--s-z-index-secondary);--s-tabbar-height:50px;--s-tabbar-border-color:var(--s-border-color);--s-tabbar-bg:var(--s-bg-color-container);--s-tabbar-color:var(--s-text-color-secondary);--s-tabbar-item-color-active:var(--s-color-primary);--s-tabbar-item-icon-margin-bottom:var(--s-size-2xs);--s-tabbar-item-icon-font-size:var(--s-size-lg);--s-tabbar-item-label-font-size:var(--s-font-size-sm)}.s-tabbar{display:flex;align-items:stretch;height:var(--s-tabbar-height);color:var(--s-tabbar-color);background:var(--s-tabbar-bg)}.s-tabbar--fixed{position:fixed;bottom:0;left:0;width:100%;z-index:var(--s-tabbar-z-index)}.s-tabbar--safe{height:calc(var(--s-tabbar-height) + var(--s-safe-bottom));padding-bottom:var(--s-safe-bottom)}.s-tabbar--bordered::before{position:absolute;z-index:1;pointer-events:none;touch-action:none;opacity:1;content:"";left:0;right:0;transform:scaleY(0.5);top:0;border-top:var(--s-border-width) var(--s-border-style) var(--s-tabbar-border-color);transform-origin:top center}.s-tabbar__item{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;font-size:var(--s-tabbar-item-label-font-size);line-height:var(--s-line-height-tight);color:var(--s-tabbar-color);cursor:pointer}.s-tabbar__item--active{color:var(--s-tabbar-item-color-active)}.s-tabbar__icon{margin-bottom:var(--s-tabbar-item-icon-margin-bottom);font-size:var(--s-tabbar-item-icon-font-size);line-height:var(--s-line-height-none)}

package/components/tabbar/tabbar-item.vue.js

@@ -5,11 +5,11 @@ import { computed, createElementBlock, createElementVNode, defineComponent, inje
 var tabbar_item_default = /*@__PURE__*/ defineComponent({
 	__name: "tabbar-item",
 	props: {
-		name: {
+		value: {
 			type: [String, Number],
 			required: false
 		},
-		text: {
+		label: {
 			type: String,
 			required: false
 		}
@@ -21,25 +21,25 @@ var tabbar_item_default = /*@__PURE__*/ defineComponent({
 		const bem = createBem("tabbar");
 		const context = inject(tabbarContextKey);
 		if (!context) throw new Error("TabbarItem must be included in Tabbar.");
-		const isCurrent = computed(() => {
-			return context.current === props.name;
+		const isActive = computed(() => {
+			return context.value === props.value;
 		});
 		const onClick = (event) => {
-			if (props.name !== void 0) context.select(props.name);
+			if (props.value !== void 0) context.select(props.value);
 			emit("click", event);
 		};
 		const tabbarItemClass = computed(() => {
-			return [bem.e("item"), bem.em("item", "current", isCurrent.value)];
+			return [bem.e("item"), bem.em("item", "active", isActive.value)];
 		});
 		const tabbarItemStyle = computed(() => {
-			return { color: isCurrent.value ? context.activeColor : context.color };
+			return { color: isActive.value ? context.activeColor : context.color };
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				class: normalizeClass(tabbarItemClass.value),
 				style: normalizeStyle(tabbarItemStyle.value),
 				onClick
-			}, [renderSlot(_ctx.$slots, "default", {}, () => [createElementVNode("div", { class: normalizeClass(unref(bem).e("icon")) }, [renderSlot(_ctx.$slots, "icon", { active: isCurrent.value })], 2), createElementVNode("div", { class: normalizeClass(unref(bem).e("text")) }, toDisplayString(__props.text), 3)])], 6);
+			}, [renderSlot(_ctx.$slots, "default", {}, () => [createElementVNode("div", { class: normalizeClass(unref(bem).e("icon")) }, [renderSlot(_ctx.$slots, "icon", { active: isActive.value })], 2), createElementVNode("div", { class: normalizeClass(unref(bem).e("label")) }, toDisplayString(__props.label), 3)])], 6);
 		};
 	}
 });

package/components/tabbar/tabbar.vue.d.ts

@@ -1,17 +1,17 @@
 import { type TabbarProps, type TabbarSlots } from './common';
 type __VLS_Slots = TabbarSlots;
 declare const __VLS_base: import("vue").DefineComponent<TabbarProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    change: (current: string | number) => any;
-    "update:current": (current: string | number) => any;
+    change: (value: string | number) => any;
+    "update:modelValue": (value: string | number) => any;
 }, string, import("vue").PublicProps, Readonly<TabbarProps> & Readonly<{
-    onChange?: ((current: string | number) => any) | undefined;
-    "onUpdate:current"?: ((current: string | number) => any) | undefined;
+    onChange?: ((value: string | number) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
     fixed: boolean;
+    modelValue: number | string;
     color: string;
     bordered: boolean;
     safeAreaInsetBottom: boolean;
-    current: number | string;
     activeColor: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/components/tabbar/tabbar.vue.js

@@ -5,7 +5,7 @@ import { computed, createElementBlock, defineComponent, mergeDefaults, normalize
 var tabbar_default = /*@__PURE__*/ defineComponent({
 	__name: "tabbar",
 	props: /*@__PURE__*/ mergeDefaults({
-		current: {
+		modelValue: {
 			type: [Number, String],
 			required: false
 		},
@@ -30,24 +30,26 @@ var tabbar_default = /*@__PURE__*/ defineComponent({
 			required: false
 		}
 	}, defaultTabbarProps),
-	emits: ["update:current", "change"],
+	emits: ["update:modelValue", "change"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
 		const bem = createBem("tabbar");
-		const innerCurrent = ref(props.current);
-		watch(() => props.current, () => {
-			if (props.current !== innerCurrent.value) innerCurrent.value = props.current;
+		const innerValue = ref(props.modelValue);
+		watch(() => props.modelValue, () => {
+			if (props.modelValue !== innerValue.value) innerValue.value = props.modelValue;
 		});
-		const select = (name) => {
-			innerCurrent.value = name;
-			emit("update:current", name);
-			emit("change", name);
+		const select = (value) => {
+			if (value !== innerValue.value) {
+				innerValue.value = value;
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		};
 		provide(tabbarContextKey, reactive({
 			color: toRef(() => props.color),
 			activeColor: toRef(() => props.activeColor),
-			current: innerCurrent,
+			value: innerValue,
 			select
 		}));
 		const tabbarClass = computed(() => {