@skeletonlabs/skeleton-svelte 1.3.0 → 1.4.0

package/dist/components/Avatar/Avatar.svelte

@@ -7,6 +7,7 @@
 		src,
 		srcset,
 		name,
+		initials = [0, -1],
 		// Root
 		base = 'overflow-hidden isolate',
 		background = 'bg-surface-400-600',
@@ -38,11 +39,9 @@
 	const api = $derived(avatar.connect(service, normalizeProps));
 
 	// Generate Initials
-	function getInitials(name: string) {
-		return name
-			.split(' ')
-			.map((word) => word[0])
-			.join('');
+	function getInitials() {
+		const lettersArr = initials.map((index) => name.split(' ').at(index)?.charAt(0).toUpperCase());
+		return lettersArr.join('');
 	}
 </script>
 
@@ -59,7 +58,7 @@
 		{#if children}
 			{@render children()}
 		{:else}
-			{getInitials(name)}
+			{getInitials()}
 		{/if}
 	</span>
 	<!-- Image -->

package/dist/components/Avatar/types.d.ts

@@ -8,6 +8,8 @@ export interface AvatarProps extends Omit<avatar.Props, 'id'>, Pick<HTMLAttribut
     srcset?: string;
     /** Provide a name or username for the avatar. */
     name: string;
+    /** Initials will be generated based on the name and this index array. */
+    initials?: number[];
     /** Set base styles. */
     base?: string;
     /** Set background styles. */

package/dist/components/Toast/Toast.svelte

@@ -40,8 +40,12 @@
 	</div>
 	{#if api.closable}
 		<!-- Dismiss Button -->
-		<button class="{props.btnDismissBase} {props.btnDismissClasses}" {...api.getCloseTriggerProps()} data-testid="toast-dismiss"
-			>&times;</button
+		<button
+			class="{props.btnDismissBase} {props.btnDismissClasses}"
+			title={props.btnDismissTitle}
+			aria-label={props.btnDismissAriaLabel}
+			{...api.getCloseTriggerProps()}
+			data-testid="toast-dismiss">&times;</button
 		>
 	{/if}
 </div>

package/dist/components/Toast/Toaster.svelte

@@ -25,6 +25,8 @@
 		// Dismiss Button
 		btnDismissBase = 'btn-icon hover:preset-tonal',
 		btnDismissClasses = '',
+		btnDismissTitle = 'Dismiss',
+		btnDismissAriaLabel = 'Dismiss',
 		// State
 		stateInfo = 'preset-outlined-surface-200-800 preset-filled-surface-50-950',
 		stateSuccess = 'preset-filled-success-500',
@@ -56,6 +58,8 @@
 			{descriptionClasses}
 			{btnDismissBase}
 			{btnDismissClasses}
+			{btnDismissTitle}
+			{btnDismissAriaLabel}
 			{stateInfo}
 			{stateError}
 			{stateWarning}

package/dist/components/Toast/types.d.ts

@@ -27,6 +27,10 @@ export interface ToasterProps extends toast.StoreProps {
     btnDismissBase?: string;
     /** Provide arbitrary classes for the dismiss button. */
     btnDismissClasses?: string;
+    /** Provide the title attribute for the dismiss button. */
+    btnDismissTitle?: string;
+    /** Provide the aria-label attribute for the dismiss button. */
+    btnDismissAriaLabel?: string;
     /** Provide base classes for info toasts. */
     stateInfo?: string;
     /** Provide base classes for success toasts. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skeletonlabs/skeleton-svelte",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "The Svelte package for Skeleton.",
   "author": "endigo9740 <chris@skeletonlabs.dev>",
   "types": "./dist/index.d.ts",
@@ -16,46 +16,46 @@
     "!dist/**/*.test.*"
   ],
   "dependencies": {
-    "@zag-js/accordion": "^1.7.0",
-    "@zag-js/avatar": "^1.7.0",
-    "@zag-js/combobox": "^1.7.0",
-    "@zag-js/dialog": "^1.7.0",
-    "@zag-js/file-upload": "^1.7.0",
-    "@zag-js/pagination": "^1.7.0",
-    "@zag-js/popover": "^1.7.0",
-    "@zag-js/progress": "^1.7.0",
-    "@zag-js/radio-group": "^1.7.0",
-    "@zag-js/rating-group": "^1.7.0",
-    "@zag-js/slider": "^1.7.0",
-    "@zag-js/svelte": "^1.7.0",
-    "@zag-js/switch": "^1.7.0",
-    "@zag-js/tabs": "^1.7.0",
-    "@zag-js/tags-input": "^1.7.0",
-    "@zag-js/toast": "^1.7.0",
-    "@zag-js/tooltip": "^1.7.0"
+    "@zag-js/accordion": "^1.18.3",
+    "@zag-js/avatar": "^1.18.3",
+    "@zag-js/combobox": "^1.18.3",
+    "@zag-js/dialog": "^1.18.3",
+    "@zag-js/file-upload": "^1.18.3",
+    "@zag-js/pagination": "^1.18.3",
+    "@zag-js/popover": "^1.18.3",
+    "@zag-js/progress": "^1.18.3",
+    "@zag-js/radio-group": "^1.18.3",
+    "@zag-js/rating-group": "^1.18.3",
+    "@zag-js/slider": "^1.18.3",
+    "@zag-js/svelte": "^1.18.3",
+    "@zag-js/switch": "^1.18.3",
+    "@zag-js/tabs": "^1.18.3",
+    "@zag-js/tags-input": "^1.18.3",
+    "@zag-js/toast": "^1.18.3",
+    "@zag-js/tooltip": "^1.18.3"
   },
   "peerDependencies": {
     "svelte": "^5.20.0"
   },
   "devDependencies": {
-    "@sveltejs/adapter-auto": "^5.0.0",
-    "@sveltejs/kit": "^2.20.2",
-    "@sveltejs/package": "^2.3.10",
-    "@sveltejs/vite-plugin-svelte": "^5.0.3",
+    "@sveltejs/adapter-auto": "^6.0.1",
+    "@sveltejs/kit": "^2.24.0",
+    "@sveltejs/package": "^2.4.0",
+    "@sveltejs/vite-plugin-svelte": "^6.1.0",
     "@tailwindcss/forms": "^0.5.10",
-    "@tailwindcss/vite": "^4.0.17",
+    "@tailwindcss/vite": "^4.1.11",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/svelte": "^5.2.7",
-    "jsdom": "^26.0.0",
-    "publint": "^0.3.9",
-    "svelte": "^5.25.3",
-    "svelte-check": "^4.1.5",
-    "tailwindcss": "^4.0.17",
+    "@testing-library/svelte": "^5.2.8",
+    "jsdom": "^26.1.0",
+    "publint": "^0.3.12",
+    "svelte": "^5.36.1",
+    "svelte-check": "^4.2.2",
+    "tailwindcss": "^4.1.11",
     "tslib": "^2.8.1",
-    "typescript": "^5.8.2",
-    "vite": "^6.2.5",
-    "vitest": "3.1.1",
-    "@skeletonlabs/skeleton": "3.1.5"
+    "typescript": "^5.8.3",
+    "vite": "^7.0.4",
+    "vitest": "3.2.4",
+    "@skeletonlabs/skeleton": "3.1.8"
   },
   "type": "module",
   "scripts": {