@salmexio/ui 1.2.1 → 1.3.1

package/dist/primitives/Tooltip/Tooltip.svelte

@@ -147,7 +147,13 @@ function positionTooltip() {
 $effect(() => {
 	if (tooltipEl && visible) {
 		document.body.appendChild(tooltipEl);
-		tick().then(() => positionTooltip());
+		// Position only after the node is in body and laid out (showcase-style behavior)
+		const run = () => {
+			tick().then(() => {
+				positionTooltip();
+			});
+		};
+		requestAnimationFrame(run);
 		return () => {
 			if (tooltipEl?.parentNode === document.body) {
 				document.body.removeChild(tooltipEl);

package/dist/primitives/Tooltip/Tooltip.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.svelte.d.ts","sourceRoot":"","sources":["../../../src/primitives/Tooltip/Tooltip.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAMtC,KAAK,SAAS,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAErD,UAAU,KAAK;IACd,4BAA4B;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,2DAA2D;IAC3D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,QAAQ,EAAE,OAAO,CAAC;IAClB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAgKD;;;;;;;;;;;;;;GAcG;AACH,QAAA,MAAM,OAAO,2CAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Tooltip.svelte.d.ts","sourceRoot":"","sources":["../../../src/primitives/Tooltip/Tooltip.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAMtC,KAAK,SAAS,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAErD,UAAU,KAAK;IACd,4BAA4B;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,2DAA2D;IAC3D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,QAAQ,EAAE,OAAO,CAAC;IAClB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAsKD;;;;;;;;;;;;;;GAcG;AACH,QAAA,MAAM,OAAO,2CAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}

package/dist/styles/tokens.css

@@ -17,42 +17,42 @@
 	   Raw palette — never use directly in components
 	   ======================================== */
 
-	--sx-gray-950: #08080C;
-	--sx-gray-900: #0F0F14;
+	--sx-gray-950: #08080c;
+	--sx-gray-900: #0f0f14;
 	--sx-gray-800: #171720;
-	--sx-gray-700: #1F1F2A;
-	--sx-gray-600: #2D2D3A;
+	--sx-gray-700: #1f1f2a;
+	--sx-gray-600: #2d2d3a;
 	--sx-gray-500: #505060;
-	--sx-gray-400: #7A7A88;
-	--sx-gray-300: #A0A0AB;
-	--sx-gray-200: #C5C5CC;
-	--sx-gray-100: #E8E6E1;
-	--sx-white: #F0EEE8;
+	--sx-gray-400: #7a7a88;
+	--sx-gray-300: #a0a0ab;
+	--sx-gray-200: #c5c5cc;
+	--sx-gray-100: #e8e6e1;
+	--sx-white: #f0eee8;
 
 	/* Accents — Vermilion (forge heat) */
-	--sx-vermilion-500: #FF6B35;
-	--sx-vermilion-400: #FF8C5A;
-	--sx-vermilion-600: #E05520;
+	--sx-vermilion-500: #ff6b35;
+	--sx-vermilion-400: #ff8c5a;
+	--sx-vermilion-600: #e05520;
 
 	/* Accents — Brass (earned authority) */
-	--sx-brass-500: #C8A84E;
-	--sx-brass-400: #D4B86A;
-	--sx-brass-600: #A68B3A;
+	--sx-brass-500: #c8a84e;
+	--sx-brass-400: #d4b86a;
+	--sx-brass-600: #a68b3a;
 
 	/* Accents — Danger */
-	--sx-red-500: #DC2626;
-	--sx-red-400: #EF4444;
-	--sx-red-600: #B91C1C;
+	--sx-red-500: #dc2626;
+	--sx-red-400: #ef4444;
+	--sx-red-600: #b91c1c;
 
 	/* Accents — Phosphor (operational green) */
-	--sx-green-500: #4ADE80;
-	--sx-green-400: #6EE7A0;
-	--sx-green-600: #22C55E;
+	--sx-green-500: #4ade80;
+	--sx-green-400: #6ee7a0;
+	--sx-green-600: #22c55e;
 
 	/* Accents — Teal (encrypted channel) */
-	--sx-teal-500: #3D8B8B;
-	--sx-teal-400: #5AABAB;
-	--sx-teal-600: #2D6B6B;
+	--sx-teal-500: #3d8b8b;
+	--sx-teal-400: #5aabab;
+	--sx-teal-600: #2d6b6b;
 
 	/* ========================================
 	   SEMANTIC COLORS
@@ -112,7 +112,7 @@
 	--sx-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
 	--sx-shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.6);
 	--sx-shadow-glow-primary: 0 0 20px rgba(255, 107, 53, 0.18);
-	--sx-shadow-glow-primary-strong: 0 0 30px rgba(255, 107, 53, 0.30);
+	--sx-shadow-glow-primary-strong: 0 0 30px rgba(255, 107, 53, 0.3);
 	--sx-shadow-glow-brass: 0 0 20px rgba(200, 168, 78, 0.15);
 	--sx-shadow-glow-red: 0 0 20px rgba(220, 38, 38, 0.15);
 	--sx-shadow-glow-green: 0 0 20px rgba(74, 222, 128, 0.15);
@@ -164,9 +164,9 @@
 	   TYPOGRAPHY
 	   ======================================== */
 
-	--sx-font-body: 'TT Fors', system-ui, -apple-system, sans-serif;
-	--sx-font-display: 'TT Quaris', Georgia, 'Times New Roman', serif;
-	--sx-font-mono: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
+	--sx-font-body: "TT Fors", system-ui, -apple-system, sans-serif;
+	--sx-font-display: "TT Quaris", Georgia, "Times New Roman", serif;
+	--sx-font-mono: "JetBrains Mono", "Consolas", "Courier New", monospace;
 
 	--sx-text-xs: 0.75rem;
 	--sx-text-sm: 0.875rem;
@@ -251,7 +251,7 @@
 	   ======================================== */
 
 	--sx-z-base: 1;
-	--sx-z-dropdown: 1000;
+	--sx-z-dropdown: 1055;
 	--sx-z-sticky: 1020;
 	--sx-z-fixed: 1030;
 	--sx-z-modal-backdrop: 1040;
@@ -316,9 +316,11 @@
 
 body {
 	background-color: var(--sx-color-base);
-	background-image:
-		radial-gradient(ellipse at 15% 50%, rgba(255, 107, 53, 0.02) 0%, transparent 50%),
-		radial-gradient(ellipse at 85% 20%, rgba(200, 168, 78, 0.015) 0%, transparent 50%),
+	background-image: radial-gradient(
+			ellipse at 15% 50%,
+			rgba(255, 107, 53, 0.02) 0%,
+			transparent 50%
+		), radial-gradient(ellipse at 85% 20%, rgba(200, 168, 78, 0.015) 0%, transparent 50%),
 		radial-gradient(ellipse at 50% 85%, rgba(61, 139, 139, 0.015) 0%, transparent 50%);
 	background-size: 200% 200%;
 	animation: sx-ambient-drift 25s ease-in-out infinite;
@@ -359,23 +361,47 @@ body {
 }
 
 @keyframes sx-ambient-drift {
-	0%   { background-position: 0% 50%; }
-	50%  { background-position: 100% 50%; }
-	100% { background-position: 0% 50%; }
+	0% {
+		background-position: 0% 50%;
+	}
+	50% {
+		background-position: 100% 50%;
+	}
+	100% {
+		background-position: 0% 50%;
+	}
 }
 
 @keyframes sx-focus-breathe {
-	0%, 100% { box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.12); }
-	50%      { box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.28); }
+	0%,
+	100% {
+		box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.12);
+	}
+	50% {
+		box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.28);
+	}
 }
 
 @keyframes sx-error-shake {
-	0%, 100% { transform: translateX(0); }
-	15%      { transform: translateX(-4px); }
-	30%      { transform: translateX(4px); }
-	45%      { transform: translateX(-3px); }
-	60%      { transform: translateX(2px); }
-	75%      { transform: translateX(-1px); }
+	0%,
+	100% {
+		transform: translateX(0);
+	}
+	15% {
+		transform: translateX(-4px);
+	}
+	30% {
+		transform: translateX(4px);
+	}
+	45% {
+		transform: translateX(-3px);
+	}
+	60% {
+		transform: translateX(2px);
+	}
+	75% {
+		transform: translateX(-1px);
+	}
 }
 
 @keyframes sx-check-in {
@@ -390,9 +416,15 @@ body {
 }
 
 @keyframes sx-badge-pop {
-	0%   { transform: scale(1); }
-	40%  { transform: scale(1.15); }
-	100% { transform: scale(1); }
+	0% {
+		transform: scale(1);
+	}
+	40% {
+		transform: scale(1.15);
+	}
+	100% {
+		transform: scale(1);
+	}
 }
 
 @keyframes sx-alert-in {

package/dist/utils/accessibility.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Accessibility utilities for WCAG 2.1 AA compliance.
+ * Focus management, screen reader announcements, media query helpers.
+ */
+/** Check whether an element can receive focus. */
+export declare function isElementFocusable(el: HTMLElement): boolean;
+/** Get all focusable elements within a container, in DOM order. */
+export declare function getFocusableElements(container: HTMLElement): HTMLElement[];
+/**
+ * Announce a message to screen readers via an ARIA live region.
+ * Creates the region lazily and reuses it across calls.
+ */
+export declare function announce(message: string, priority?: 'polite' | 'assertive'): void;
+/** Check if the user prefers reduced motion. */
+export declare function prefersReducedMotion(): boolean;
+//# sourceMappingURL=accessibility.d.ts.map

package/dist/utils/accessibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accessibility.d.ts","sourceRoot":"","sources":["../../src/utils/accessibility.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAcH,kDAAkD;AAClD,wBAAgB,kBAAkB,CAAC,EAAE,EAAE,WAAW,GAAG,OAAO,CAe3D;AAED,mEAAmE;AACnE,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,WAAW,GAAG,WAAW,EAAE,CAI1E;AAED;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,GAAE,QAAQ,GAAG,WAAsB,GAAG,IAAI,CAgC3F;AAED,gDAAgD;AAChD,wBAAgB,oBAAoB,IAAI,OAAO,CAG9C"}

package/dist/utils/accessibility.js

@@ -0,0 +1,80 @@
+/**
+ * Accessibility utilities for WCAG 2.1 AA compliance.
+ * Focus management, screen reader announcements, media query helpers.
+ */
+const FOCUSABLE_SELECTORS = [
+    'a[href]:not([tabindex="-1"])',
+    'button:not([disabled]):not([tabindex="-1"])',
+    'input:not([disabled]):not([tabindex="-1"]):not([type="hidden"])',
+    'select:not([disabled]):not([tabindex="-1"])',
+    'textarea:not([disabled]):not([tabindex="-1"])',
+    '[tabindex]:not([tabindex="-1"])',
+    '[contenteditable]:not([tabindex="-1"])'
+];
+const FOCUSABLE_SELECTOR = FOCUSABLE_SELECTORS.join(', ');
+/** Check whether an element can receive focus. */
+export function isElementFocusable(el) {
+    if (el.hasAttribute('disabled') || el.disabled)
+        return false;
+    if (el.getAttribute('tabindex') === '-1')
+        return false;
+    if (el.hasAttribute('hidden'))
+        return false;
+    const style = getComputedStyle(el);
+    if (style.display === 'none' || style.visibility === 'hidden')
+        return false;
+    const tag = el.tagName.toLowerCase();
+    if (['input', 'select', 'textarea', 'button'].includes(tag)) {
+        return !el.disabled;
+    }
+    if (tag === 'a')
+        return el.hasAttribute('href');
+    if (el.hasAttribute('tabindex') || el.hasAttribute('contenteditable'))
+        return true;
+    return false;
+}
+/** Get all focusable elements within a container, in DOM order. */
+export function getFocusableElements(container) {
+    return Array.from(container.querySelectorAll(FOCUSABLE_SELECTOR)).filter(isElementFocusable);
+}
+/**
+ * Announce a message to screen readers via an ARIA live region.
+ * Creates the region lazily and reuses it across calls.
+ */
+export function announce(message, priority = 'polite') {
+    if (typeof document === 'undefined')
+        return;
+    const id = `sx-announce-${priority}`;
+    let region = document.getElementById(id);
+    if (!region) {
+        region = document.createElement('div');
+        region.id = id;
+        region.setAttribute('role', 'log');
+        region.setAttribute('aria-live', priority);
+        region.setAttribute('aria-relevant', 'additions');
+        region.setAttribute('aria-atomic', 'true');
+        Object.assign(region.style, {
+            position: 'absolute',
+            width: '1px',
+            height: '1px',
+            padding: '0',
+            margin: '-1px',
+            overflow: 'hidden',
+            clip: 'rect(0, 0, 0, 0)',
+            whiteSpace: 'nowrap',
+            border: '0'
+        });
+        document.body.appendChild(region);
+    }
+    // Clear then re-set to trigger announcement
+    region.textContent = '';
+    requestAnimationFrame(() => {
+        region.textContent = message;
+    });
+}
+/** Check if the user prefers reduced motion. */
+export function prefersReducedMotion() {
+    if (typeof window === 'undefined')
+        return false;
+    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+}

package/dist/utils/index.d.ts

@@ -1,4 +1,5 @@
 export { cn } from './cn.js';
-export { createFocusTrap, generateId, Keys } from './keyboard.js';
+export { createFocusTrap, generateId, Keys, isKey, isActivationKey, isNavigationKey } from './keyboard.js';
 export type { FocusTrap, Key } from './keyboard.js';
+export { isElementFocusable, getFocusableElements, announce, prefersReducedMotion } from './accessibility.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,YAAY,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EACN,eAAe,EACf,UAAU,EACV,IAAI,EACJ,KAAK,EACL,eAAe,EACf,eAAe,EACf,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EACN,kBAAkB,EAClB,oBAAoB,EACpB,QAAQ,EACR,oBAAoB,EACpB,MAAM,oBAAoB,CAAC"}

package/dist/utils/index.js

@@ -1,2 +1,3 @@
 export { cn } from './cn.js';
-export { createFocusTrap, generateId, Keys } from './keyboard.js';
+export { createFocusTrap, generateId, Keys, isKey, isActivationKey, isNavigationKey } from './keyboard.js';
+export { isElementFocusable, getFocusableElements, announce, prefersReducedMotion } from './accessibility.js';

package/dist/utils/keyboard.d.ts

@@ -23,6 +23,12 @@ export interface FocusTrap {
  * Trap focus within a container (e.g. modal). Tab cycles inside; restores focus on deactivate.
  */
 export declare function createFocusTrap(container: HTMLElement): FocusTrap;
+/** Check if the key matches one of the provided keys. */
+export declare function isKey(event: KeyboardEvent, ...keys: Key[]): boolean;
+/** Check if the key is an activation key (Enter or Space). */
+export declare function isActivationKey(event: KeyboardEvent): boolean;
+/** Check if the key is a navigation key (arrows, Home, End). */
+export declare function isNavigationKey(event: KeyboardEvent): boolean;
 /** Unique ID for aria attributes (per-instance safe). */
 export declare function generateId(prefix?: string): string;
 //# sourceMappingURL=keyboard.d.ts.map

package/dist/utils/keyboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard.d.ts","sourceRoot":"","sources":["../../src/utils/keyboard.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,eAAO,MAAM,IAAI;;;;;;;;;;;CAWP,CAAC;AAEX,MAAM,MAAM,GAAG,GAAG,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,OAAO,IAAI,CAAC,CAAC;AAEnD,MAAM,WAAW,SAAS;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;CACvB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,WAAW,GAAG,SAAS,CA4CjE;AAED,yDAAyD;AACzD,wBAAgB,UAAU,CAAC,MAAM,SAAW,GAAG,MAAM,CAEpD"}
+{"version":3,"file":"keyboard.d.ts","sourceRoot":"","sources":["../../src/utils/keyboard.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,eAAO,MAAM,IAAI;;;;;;;;;;;CAWP,CAAC;AAEX,MAAM,MAAM,GAAG,GAAG,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,OAAO,IAAI,CAAC,CAAC;AAEnD,MAAM,WAAW,SAAS;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;CACvB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,WAAW,GAAG,SAAS,CAoCjE;AAED,yDAAyD;AACzD,wBAAgB,KAAK,CAAC,KAAK,EAAE,aAAa,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,OAAO,CAEnE;AAED,8DAA8D;AAC9D,wBAAgB,eAAe,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAE7D;AAED,gEAAgE;AAChE,wBAAgB,eAAe,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAU7D;AAED,yDAAyD;AACzD,wBAAgB,UAAU,CAAC,MAAM,SAAW,GAAG,MAAM,CAEpD"}

package/dist/utils/keyboard.js

@@ -2,6 +2,7 @@
  * Keyboard and focus utilities for accessible components.
  * WCAG 2.1 / WAI-ARIA aligned; used by Modal and other dialogs.
  */
+import { getFocusableElements } from './accessibility.js';
 export const Keys = {
     Enter: 'Enter',
     Space: ' ',
@@ -19,16 +20,9 @@ export const Keys = {
  */
 export function createFocusTrap(container) {
     let previouslyFocused = null;
-    const focusableSelector = [
-        'button:not([disabled]):not([tabindex="-1"])',
-        '[href]:not([tabindex="-1"])',
-        'input:not([disabled]):not([tabindex="-1"])',
-        'select:not([disabled]):not([tabindex="-1"])',
-        'textarea:not([disabled]):not([tabindex="-1"])',
-        '[tabindex]:not([tabindex="-1"])'
-    ].join(', ');
     function getFocusable() {
-        return Array.from(container.querySelectorAll(focusableSelector));
+        // Use shared implementation that filters invisible/disabled elements
+        return getFocusableElements(container);
     }
     function onKeyDown(e) {
         if (e.key !== Keys.Tab)
@@ -61,6 +55,18 @@ export function createFocusTrap(container) {
         }
     };
 }
+/** Check if the key matches one of the provided keys. */
+export function isKey(event, ...keys) {
+    return keys.includes(event.key);
+}
+/** Check if the key is an activation key (Enter or Space). */
+export function isActivationKey(event) {
+    return isKey(event, Keys.Enter, Keys.Space);
+}
+/** Check if the key is a navigation key (arrows, Home, End). */
+export function isNavigationKey(event) {
+    return isKey(event, Keys.ArrowUp, Keys.ArrowDown, Keys.ArrowLeft, Keys.ArrowRight, Keys.Home, Keys.End);
+}
 /** Unique ID for aria attributes (per-instance safe). */
 export function generateId(prefix = 'salmex') {
     return `${prefix}-${Math.random().toString(36).slice(2, 11)}`;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@salmexio/ui",
-	"version": "1.2.1",
+	"version": "1.3.1",
 	"description": "Salmex I/O Design System — INFRARED component library for Salmex products",
 	"type": "module",
 	"license": "UNLICENSED",
@@ -39,6 +39,26 @@
 			"svelte": "./dist/navigation/index.js",
 			"default": "./dist/navigation/index.js"
 		},
+		"./forms": {
+			"types": "./dist/forms/index.d.ts",
+			"svelte": "./dist/forms/index.js",
+			"default": "./dist/forms/index.js"
+		},
+		"./layout": {
+			"types": "./dist/layout/index.d.ts",
+			"svelte": "./dist/layout/index.js",
+			"default": "./dist/layout/index.js"
+		},
+		"./feedback": {
+			"types": "./dist/feedback/index.d.ts",
+			"svelte": "./dist/feedback/index.js",
+			"default": "./dist/feedback/index.js"
+		},
+		"./dialogs": {
+			"types": "./dist/dialogs/index.d.ts",
+			"svelte": "./dist/dialogs/index.js",
+			"default": "./dist/dialogs/index.js"
+		},
 		"./utils": {
 			"types": "./dist/utils/index.d.ts",
 			"default": "./dist/utils/index.js"