[stdf]更新 stfd 版本至 1.1.1，优化 Avatar、NoticeBar 和 Stepper 组件的样式，添加 Stepper 组件的宽度属性，并在示例中展示固定宽度的用法。

packages/stdf/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "stdf",
-	"version": "1.1.0",
+	"version": "1.1.1",
 	"description": "Mobile web component library based on Svelte and Tailwind",
 	"author": "any-tdf",
 	"funding": "https://stdf.design?fund",

packages/stdf/src/lib/components/avatar/Avatar.svelte

@@ -61,8 +61,9 @@
 </script>
 
 <button
-	class="bg-primary-200 dark:bg-dark-200 flex justify-center overflow-hidden relative{lineObj[line] || ''} {sizeObj[size] ||
-		sizeObj.md} {radiusObj[radius] || radiusObj.sm} {injClass}"
+	class="bg-primary-200 dark:bg-dark-200 flex flex-col items-center justify-center overflow-hidden relative{lineObj[line] || ''} {sizeObj[
+		size
+	] || sizeObj.md} {radiusObj[radius] || radiusObj.sm} {injClass}"
 	onclick={() => onclick && onclick()}
 >
 	{#if image === '' && alt === ''}

packages/stdf/src/lib/components/noticeBar/NoticeBar.svelte

@@ -7,7 +7,6 @@
 		textList = [],
 		leftIcon = 'volume',
 		rightIcon = 'close',
-		fontSize = 'sm',
 		space = 100,
 		speed = 30,
 		vertical = false,
@@ -31,10 +30,6 @@
 		console.error('[STDF NoticeBar error]textList must not be empty.');
 	}
 
-	// 字体大小样式
-	// Font size style
-	const fontSizeClass = { xs: ' text-xs', sm: ' text-sm', base: ' text-base', lg: ' text-lg' };
-
 	// 动画时长样式
 	// Animation duration style
 	const durationClass = {
@@ -121,10 +116,9 @@
 
 {#if isShowClose}
 	<div
-		class="bg-primary/10 text-primary dark:bg-dark/10 flex justify-between dark:text-dark{fontSizeClass[fontSize] ||
-			fontSizeClass['sm']} p-2{!rightIcon ? ' pr-2' : ' pr-0'} transition-all duration-300{isShow ? '' : ' scale-0'}{injClass === ''
-			? ''
-			: ` ${injClass}`}"
+		class="bg-primary/10 text-primary dark:bg-dark/10 dark:text-dark flex justify-between text-sm p-2{!rightIcon
+			? ' pr-2'
+			: ' pr-0'} transition-all duration-300{isShow ? '' : ' scale-0'}{injClass === '' ? '' : ` ${injClass}`}"
 	>
 		<div class={leftIcon ? 'mr-1' : ''}>
 			{#if leftChild}

packages/stdf/src/lib/components/stepper/Stepper.svelte

@@ -16,6 +16,7 @@
 		asyncLoading = false,
 		loading = {},
 		padding = true,
+		width = 0,
 		injClassOut = '',
 		injClassBtn = '',
 		injClassNum = '',
@@ -75,7 +76,7 @@
 				viewBox="0 0 24 24"
 				width="24"
 				height="24"
-				class={theme && (numberHighlight ? false : true) ? 'fill-primary dark:fill-dark' : ''}
+				class={theme && (numberHighlight ? false : true) ? 'fill-primary dark:fill-dark' : 'fill-black dark:fill-white'}
 			>
 				<path d="M5 11V13H19V11H5Z"></path>
 			</svg>
@@ -93,6 +94,7 @@
 					? ' bg-primary/5 text-primary dark:bg-dark/10 dark:text-dark'
 					: ' bg-white dark:bg-black'
 				: ''}"
+			style={width ? `width: ${width}px;` : ''}
 		>
 			{value.toFixed(decimal)}
 		</div>
@@ -115,7 +117,7 @@
 				viewBox="0 0 24 24"
 				width="24"
 				height="24"
-				class={theme && (numberHighlight ? false : true) ? 'fill-primary dark:fill-dark' : ''}
+				class={theme && (numberHighlight ? false : true) ? 'fill-primary dark:fill-dark' : 'fill-black dark:fill-white'}
 			>
 				<path d="M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z"></path>
 			</svg>

packages/stdf/src/lib/types/index.ts

@@ -411,7 +411,6 @@ export type NoticeBarProps = {
 	textList: string[];
 	leftIcon?: IconProps | null | 'volume';
 	rightIcon?: 'close' | 'arrow' | null;
-	fontSize?: 'xs' | 'sm' | 'base' | 'lg';
 	space?: number;
 	speed?: number;
 	vertical?: boolean;
@@ -641,6 +640,7 @@ export type StepperProps = {
 	asyncLoading?: boolean;
 	loading?: LoadingProps;
 	padding?: boolean;
+	width?: number;
 	injClassOut?: string;
 	injClassBtn?: string;
 	injClassNum?: string;

packages/stdf/src/routes/stepper/en_US/+page.svelte

@@ -76,6 +76,12 @@
 	<Stepper radius="xl" vertical />
 </div>
 
+<div class="mx-4 mt-8 text-lg font-bold">Fixed Width</div>
+<div class="space-x-8 px-2 py-4">
+	<Stepper width={160} />
+	<Stepper width={80} vertical />
+</div>
+
 <div class="mx-4 mt-8 text-lg font-bold">Format Display Numbers</div>
 <div class="px-4 py-4">
 	<div class="mb-2 text-sm">Keep one decimal place</div>

packages/stdf/src/routes/stepper/zh_CN/+page.svelte

@@ -76,6 +76,12 @@
 	<Stepper radius="xl" vertical />
 </div>
 
+<div class="mx-4 mt-8 text-lg font-bold">固定宽度</div>
+<div class="space-x-8 px-2 py-4">
+	<Stepper width={160} />
+	<Stepper width={80} vertical />
+</div>
+
 <div class="mx-4 mt-8 text-lg font-bold">格式化显示数字</div>
 <div class="px-4 py-4">
 	<div class="mb-2 text-sm">保留一位小数</div>