@almadar/ui 5.16.4 → 5.17.1

package/dist/components/templates/GameTemplate.d.ts

@@ -11,6 +11,12 @@ interface GameEntity {
     id: string;
     title?: string;
 }
+export interface GameControls {
+    onPlay?: () => void;
+    onPause?: () => void;
+    onReset?: () => void;
+    isPlaying?: boolean;
+}
 export interface GameTemplateProps extends TemplateProps<GameEntity> {
     /** Title of the game */
     title?: string;
@@ -23,12 +29,7 @@ export interface GameTemplateProps extends TemplateProps<GameEntity> {
     /** Whether the debug panel is visible */
     showDebugPanel?: boolean;
     /** Game controls */
-    controls?: {
-        onPlay?: () => void;
-        onPause?: () => void;
-        onReset?: () => void;
-        isPlaying?: boolean;
-    };
+    controls?: GameControls;
     /** Additional class name */
     className?: string;
 }

package/dist/components/templates/GenericAppTemplate.d.ts

@@ -7,12 +7,7 @@
  */
 import React from "react";
 import type { TemplateProps } from "./types";
-interface GenericAppEntity {
-    id: string;
-    title?: string;
-    subtitle?: string;
-}
-export interface GenericAppTemplateProps extends TemplateProps<GenericAppEntity> {
+export interface GenericAppTemplateProps extends TemplateProps {
     /** Page title */
     title: string;
     /** Subtitle or description */
@@ -27,4 +22,3 @@ export interface GenericAppTemplateProps extends TemplateProps<GenericAppEntity>
     className?: string;
 }
 export declare const GenericAppTemplate: React.FC<GenericAppTemplateProps>;
-export {};

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

@@ -9,19 +9,27 @@
  *
  * @see docs/Almadar_Templates.md
  */
-/** Base props for all templates — enforces entity-only data flow. */
+import type { EntityRow } from "@almadar/core";
+/** Base props for all templates — enforces entity-only data flow.
+ *
+ * The constraint is `{ id?: string }` (optional id) so the canonical
+ * `EntityRow` from `@almadar/core` — whose `id` is optional — satisfies it. */
 export interface TemplateProps<E extends {
-    id: string;
-} = {
-    id: string;
-}> {
+    id?: string;
+} = EntityRow> {
     /**
      * Entity data — single object or array (pre-resolved by the compiler
      * from `@payload.data` on the calling trait). The legacy `string`
      * entity-name branch was removed in V2 Phase 6 along with the
      * EntityStore resolver.
+     *
+     * The inlet always also accepts the canonical `EntityRow` (and arrays of
+     * it), because the compiler binds the generic data-store row regardless of
+     * a template's curated read-shape `E`. A template that reads specific
+     * fields narrows `entity` to `E` internally (a valid union-narrow) — no
+     * `as unknown` cast and no per-template inlet widening required.
      */
-    entity?: E | readonly E[];
+    entity?: E | EntityRow | readonly (E | EntityRow)[];
     /** External styling override */
     className?: string;
 }

package/dist/docs/index.cjs

@@ -3,7 +3,7 @@
 var React7 = require('react');
 var logger = require('@almadar/logger');
 var jsxRuntime = require('react/jsx-runtime');
-var LucideIcons = require('lucide-react');
+var LucideIcons2 = require('lucide-react');
 var PhosphorIcons = require('@phosphor-icons/react');
 var TablerIcons = require('@tabler/icons-react');
 var FaIcons = require('react-icons/fa');
@@ -29,7 +29,7 @@ function _interopNamespace(e) {
 }
 
 var React7__default = /*#__PURE__*/_interopDefault(React7);
-var LucideIcons__namespace = /*#__PURE__*/_interopNamespace(LucideIcons);
+var LucideIcons2__namespace = /*#__PURE__*/_interopNamespace(LucideIcons2);
 var PhosphorIcons__namespace = /*#__PURE__*/_interopNamespace(PhosphorIcons);
 var TablerIcons__namespace = /*#__PURE__*/_interopNamespace(TablerIcons);
 var FaIcons__namespace = /*#__PURE__*/_interopNamespace(FaIcons);
@@ -3067,26 +3067,26 @@ function kebabToPascal(name) {
   }).join("");
 }
 var lucideAliases = {
-  close: LucideIcons__namespace.X,
-  trash: LucideIcons__namespace.Trash2,
-  loader: LucideIcons__namespace.Loader2,
-  stop: LucideIcons__namespace.Square,
-  volume: LucideIcons__namespace.Volume2,
-  "volume-off": LucideIcons__namespace.VolumeX,
-  refresh: LucideIcons__namespace.RefreshCw,
-  share: LucideIcons__namespace.Share2,
-  "sort-asc": LucideIcons__namespace.ArrowUpNarrowWide,
-  "sort-desc": LucideIcons__namespace.ArrowDownNarrowWide
+  close: LucideIcons2__namespace.X,
+  trash: LucideIcons2__namespace.Trash2,
+  loader: LucideIcons2__namespace.Loader2,
+  stop: LucideIcons2__namespace.Square,
+  volume: LucideIcons2__namespace.Volume2,
+  "volume-off": LucideIcons2__namespace.VolumeX,
+  refresh: LucideIcons2__namespace.RefreshCw,
+  share: LucideIcons2__namespace.Share2,
+  "sort-asc": LucideIcons2__namespace.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons2__namespace.ArrowDownNarrowWide
 };
 function resolveLucide(name) {
   if (lucideAliases[name]) return lucideAliases[name];
   const pascal = kebabToPascal(name);
-  const lucideMap = LucideIcons__namespace;
+  const lucideMap = LucideIcons2__namespace;
   const direct = lucideMap[pascal];
   if (direct && typeof direct === "object") return direct;
   const asIs = lucideMap[name];
   if (asIs && typeof asIs === "object") return asIs;
-  return LucideIcons__namespace.HelpCircle;
+  return LucideIcons2__namespace.HelpCircle;
 }
 var phosphorAliases = {
   // lucide name → phosphor PascalCase name
@@ -3679,6 +3679,41 @@ function resolveIconForFamily(name, family) {
     }
   }
 }
+var iconAliases = {
+  "close": LucideIcons2__namespace.X,
+  "trash": LucideIcons2__namespace.Trash2,
+  "loader": LucideIcons2__namespace.Loader2,
+  "stop": LucideIcons2__namespace.Square,
+  "volume": LucideIcons2__namespace.Volume2,
+  "volume-off": LucideIcons2__namespace.VolumeX,
+  "refresh": LucideIcons2__namespace.RefreshCw,
+  "share": LucideIcons2__namespace.Share2,
+  "sort-asc": LucideIcons2__namespace.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons2__namespace.ArrowDownNarrowWide
+};
+function kebabToPascal2(name) {
+  return name.split("-").map((part) => {
+    if (/^\d+$/.test(part)) return part;
+    return part.charAt(0).toUpperCase() + part.slice(1);
+  }).join("");
+}
+var resolvedCache = /* @__PURE__ */ new Map();
+function resolveIcon(name) {
+  const cached = resolvedCache.get(name);
+  if (cached) return cached;
+  const resolved = doResolve(name);
+  resolvedCache.set(name, resolved);
+  return resolved;
+}
+function doResolve(name) {
+  if (iconAliases[name]) return iconAliases[name];
+  const pascalName = kebabToPascal2(name);
+  const directLookup = LucideIcons2__namespace[pascalName];
+  if (directLookup && typeof directLookup === "object") return directLookup;
+  const asIs = LucideIcons2__namespace[name];
+  if (asIs && typeof asIs === "object") return asIs;
+  return LucideIcons2__namespace.HelpCircle;
+}
 var sizeClasses = {
   xs: "w-3 h-3",
   sm: "w-4 h-4",
@@ -3701,11 +3736,13 @@ var Icon = ({
   strokeWidth,
   style
 }) => {
+  const directIcon = typeof icon === "string" ? void 0 : icon;
+  const effectiveName = typeof icon === "string" ? icon : name;
   const family = useIconFamily();
   const RenderedComponent = React7__default.default.useMemo(() => {
-    if (icon) return null;
-    return name ? resolveIconForFamily(name, family) : null;
-  }, [icon, name, family]);
+    if (directIcon) return null;
+    return effectiveName ? resolveIconForFamily(effectiveName, family) : null;
+  }, [directIcon, effectiveName, family]);
   const effectiveStrokeWidth = strokeWidth ?? void 0;
   const inlineStyle = {
     ...effectiveStrokeWidth === void 0 ? { strokeWidth: "var(--icon-stroke-width, 2)" } : {},
@@ -3717,8 +3754,8 @@ var Icon = ({
     color ? color : "text-current",
     className
   );
-  if (icon) {
-    const Direct = icon;
+  if (directIcon) {
+    const Direct = directIcon;
     return /* @__PURE__ */ jsxRuntime.jsx(
       Direct,
       {
@@ -3738,7 +3775,7 @@ var Icon = ({
       }
     );
   }
-  const Fallback = LucideIcons__namespace.HelpCircle;
+  const Fallback = LucideIcons2__namespace.HelpCircle;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Fallback,
     {
@@ -3877,7 +3914,7 @@ var Button = React7__default.default.forwardRef(
         ...props,
         "data-testid": props["data-testid"] ?? (action ? `action-${action}` : void 0),
         children: [
-          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Loader2, { className: "h-icon-default w-icon-default animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
+          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.Loader2, { className: "h-icon-default w-icon-default animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
           children || label,
           resolvedRightIcon && !isLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedRightIcon })
         ]
@@ -4083,7 +4120,7 @@ var Input = React7__default.default.forwardRef(
     error,
     leftIcon,
     rightIcon,
-    icon: IconComponent,
+    icon: iconProp,
     clearable,
     onClear,
     value,
@@ -4093,6 +4130,7 @@ var Input = React7__default.default.forwardRef(
     ...props
   }, ref) => {
     const type = inputType || htmlType || "text";
+    const IconComponent = typeof iconProp === "string" ? resolveIcon(iconProp) : iconProp;
     const resolvedLeftIcon = leftIcon || IconComponent && /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { className: "h-icon-default w-icon-default" });
     const showClearButton = clearable && value && String(value).length > 0;
     const isMultiline = type === "textarea";

package/dist/docs/index.d.cts

@@ -212,8 +212,12 @@ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAtt
 type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 type IconAnimation = 'spin' | 'pulse' | 'none';
 interface IconProps {
-    /** Lucide icon component (preferred for type-safe usage) */
-    icon?: LucideIcon;
+    /**
+     * Lucide icon component (preferred for type-safe usage), OR a canonical
+     * kebab-case icon name string — a string is treated exactly like `name` so
+     * trait/factory authors can pass an icon by name through the `icon` prop.
+     */
+    icon?: LucideIcon | string;
     /** Icon name as string (resolved from iconMap) */
     name?: string;
     /** Size of the icon */
@@ -305,8 +309,9 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "
     error?: string;
     leftIcon?: React.ReactNode;
     rightIcon?: React.ReactNode;
-    /** Lucide icon component for left side (convenience prop) */
-    icon?: LucideIcon;
+    /** Lucide icon component for left side (convenience prop), or a canonical
+     *  kebab-case icon name string (resolved via `resolveIcon`). */
+    icon?: LucideIcon | string;
     /** Show clear button when input has value */
     clearable?: boolean;
     /** Callback when clear button is clicked */

package/dist/docs/index.js

@@ -1,7 +1,7 @@
 import React7, { createContext, useCallback, useContext, useMemo, useSyncExternalStore, useState, useRef, useEffect } from 'react';
 import { createLogger } from '@almadar/logger';
 import { jsxs, jsx } from 'react/jsx-runtime';
-import * as LucideIcons from 'lucide-react';
+import * as LucideIcons2 from 'lucide-react';
 import { Loader2 } from 'lucide-react';
 import * as PhosphorIcons from '@phosphor-icons/react';
 import * as TablerIcons from '@tabler/icons-react';
@@ -3040,26 +3040,26 @@ function kebabToPascal(name) {
   }).join("");
 }
 var lucideAliases = {
-  close: LucideIcons.X,
-  trash: LucideIcons.Trash2,
-  loader: LucideIcons.Loader2,
-  stop: LucideIcons.Square,
-  volume: LucideIcons.Volume2,
-  "volume-off": LucideIcons.VolumeX,
-  refresh: LucideIcons.RefreshCw,
-  share: LucideIcons.Share2,
-  "sort-asc": LucideIcons.ArrowUpNarrowWide,
-  "sort-desc": LucideIcons.ArrowDownNarrowWide
+  close: LucideIcons2.X,
+  trash: LucideIcons2.Trash2,
+  loader: LucideIcons2.Loader2,
+  stop: LucideIcons2.Square,
+  volume: LucideIcons2.Volume2,
+  "volume-off": LucideIcons2.VolumeX,
+  refresh: LucideIcons2.RefreshCw,
+  share: LucideIcons2.Share2,
+  "sort-asc": LucideIcons2.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons2.ArrowDownNarrowWide
 };
 function resolveLucide(name) {
   if (lucideAliases[name]) return lucideAliases[name];
   const pascal = kebabToPascal(name);
-  const lucideMap = LucideIcons;
+  const lucideMap = LucideIcons2;
   const direct = lucideMap[pascal];
   if (direct && typeof direct === "object") return direct;
   const asIs = lucideMap[name];
   if (asIs && typeof asIs === "object") return asIs;
-  return LucideIcons.HelpCircle;
+  return LucideIcons2.HelpCircle;
 }
 var phosphorAliases = {
   // lucide name → phosphor PascalCase name
@@ -3652,6 +3652,41 @@ function resolveIconForFamily(name, family) {
     }
   }
 }
+var iconAliases = {
+  "close": LucideIcons2.X,
+  "trash": LucideIcons2.Trash2,
+  "loader": LucideIcons2.Loader2,
+  "stop": LucideIcons2.Square,
+  "volume": LucideIcons2.Volume2,
+  "volume-off": LucideIcons2.VolumeX,
+  "refresh": LucideIcons2.RefreshCw,
+  "share": LucideIcons2.Share2,
+  "sort-asc": LucideIcons2.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons2.ArrowDownNarrowWide
+};
+function kebabToPascal2(name) {
+  return name.split("-").map((part) => {
+    if (/^\d+$/.test(part)) return part;
+    return part.charAt(0).toUpperCase() + part.slice(1);
+  }).join("");
+}
+var resolvedCache = /* @__PURE__ */ new Map();
+function resolveIcon(name) {
+  const cached = resolvedCache.get(name);
+  if (cached) return cached;
+  const resolved = doResolve(name);
+  resolvedCache.set(name, resolved);
+  return resolved;
+}
+function doResolve(name) {
+  if (iconAliases[name]) return iconAliases[name];
+  const pascalName = kebabToPascal2(name);
+  const directLookup = LucideIcons2[pascalName];
+  if (directLookup && typeof directLookup === "object") return directLookup;
+  const asIs = LucideIcons2[name];
+  if (asIs && typeof asIs === "object") return asIs;
+  return LucideIcons2.HelpCircle;
+}
 var sizeClasses = {
   xs: "w-3 h-3",
   sm: "w-4 h-4",
@@ -3674,11 +3709,13 @@ var Icon = ({
   strokeWidth,
   style
 }) => {
+  const directIcon = typeof icon === "string" ? void 0 : icon;
+  const effectiveName = typeof icon === "string" ? icon : name;
   const family = useIconFamily();
   const RenderedComponent = React7.useMemo(() => {
-    if (icon) return null;
-    return name ? resolveIconForFamily(name, family) : null;
-  }, [icon, name, family]);
+    if (directIcon) return null;
+    return effectiveName ? resolveIconForFamily(effectiveName, family) : null;
+  }, [directIcon, effectiveName, family]);
   const effectiveStrokeWidth = strokeWidth ?? void 0;
   const inlineStyle = {
     ...effectiveStrokeWidth === void 0 ? { strokeWidth: "var(--icon-stroke-width, 2)" } : {},
@@ -3690,8 +3727,8 @@ var Icon = ({
     color ? color : "text-current",
     className
   );
-  if (icon) {
-    const Direct = icon;
+  if (directIcon) {
+    const Direct = directIcon;
     return /* @__PURE__ */ jsx(
       Direct,
       {
@@ -3711,7 +3748,7 @@ var Icon = ({
       }
     );
   }
-  const Fallback = LucideIcons.HelpCircle;
+  const Fallback = LucideIcons2.HelpCircle;
   return /* @__PURE__ */ jsx(
     Fallback,
     {
@@ -4056,7 +4093,7 @@ var Input = React7.forwardRef(
     error,
     leftIcon,
     rightIcon,
-    icon: IconComponent,
+    icon: iconProp,
     clearable,
     onClear,
     value,
@@ -4066,6 +4103,7 @@ var Input = React7.forwardRef(
     ...props
   }, ref) => {
     const type = inputType || htmlType || "text";
+    const IconComponent = typeof iconProp === "string" ? resolveIcon(iconProp) : iconProp;
     const resolvedLeftIcon = leftIcon || IconComponent && /* @__PURE__ */ jsx(IconComponent, { className: "h-icon-default w-icon-default" });
     const showClearButton = clearable && value && String(value).length > 0;
     const isMultiline = type === "textarea";

package/dist/marketing/index.cjs

@@ -3,7 +3,7 @@
 var React8 = require('react');
 var logger = require('@almadar/logger');
 var jsxRuntime = require('react/jsx-runtime');
-var LucideIcons = require('lucide-react');
+var LucideIcons2 = require('lucide-react');
 var PhosphorIcons = require('@phosphor-icons/react');
 var TablerIcons = require('@tabler/icons-react');
 var FaIcons = require('react-icons/fa');
@@ -29,7 +29,7 @@ function _interopNamespace(e) {
 }
 
 var React8__default = /*#__PURE__*/_interopDefault(React8);
-var LucideIcons__namespace = /*#__PURE__*/_interopNamespace(LucideIcons);
+var LucideIcons2__namespace = /*#__PURE__*/_interopNamespace(LucideIcons2);
 var PhosphorIcons__namespace = /*#__PURE__*/_interopNamespace(PhosphorIcons);
 var TablerIcons__namespace = /*#__PURE__*/_interopNamespace(TablerIcons);
 var FaIcons__namespace = /*#__PURE__*/_interopNamespace(FaIcons);
@@ -3067,26 +3067,26 @@ function kebabToPascal(name) {
   }).join("");
 }
 var lucideAliases = {
-  close: LucideIcons__namespace.X,
-  trash: LucideIcons__namespace.Trash2,
-  loader: LucideIcons__namespace.Loader2,
-  stop: LucideIcons__namespace.Square,
-  volume: LucideIcons__namespace.Volume2,
-  "volume-off": LucideIcons__namespace.VolumeX,
-  refresh: LucideIcons__namespace.RefreshCw,
-  share: LucideIcons__namespace.Share2,
-  "sort-asc": LucideIcons__namespace.ArrowUpNarrowWide,
-  "sort-desc": LucideIcons__namespace.ArrowDownNarrowWide
+  close: LucideIcons2__namespace.X,
+  trash: LucideIcons2__namespace.Trash2,
+  loader: LucideIcons2__namespace.Loader2,
+  stop: LucideIcons2__namespace.Square,
+  volume: LucideIcons2__namespace.Volume2,
+  "volume-off": LucideIcons2__namespace.VolumeX,
+  refresh: LucideIcons2__namespace.RefreshCw,
+  share: LucideIcons2__namespace.Share2,
+  "sort-asc": LucideIcons2__namespace.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons2__namespace.ArrowDownNarrowWide
 };
 function resolveLucide(name) {
   if (lucideAliases[name]) return lucideAliases[name];
   const pascal = kebabToPascal(name);
-  const lucideMap = LucideIcons__namespace;
+  const lucideMap = LucideIcons2__namespace;
   const direct = lucideMap[pascal];
   if (direct && typeof direct === "object") return direct;
   const asIs = lucideMap[name];
   if (asIs && typeof asIs === "object") return asIs;
-  return LucideIcons__namespace.HelpCircle;
+  return LucideIcons2__namespace.HelpCircle;
 }
 var phosphorAliases = {
   // lucide name → phosphor PascalCase name
@@ -3679,6 +3679,41 @@ function resolveIconForFamily(name, family) {
     }
   }
 }
+var iconAliases = {
+  "close": LucideIcons2__namespace.X,
+  "trash": LucideIcons2__namespace.Trash2,
+  "loader": LucideIcons2__namespace.Loader2,
+  "stop": LucideIcons2__namespace.Square,
+  "volume": LucideIcons2__namespace.Volume2,
+  "volume-off": LucideIcons2__namespace.VolumeX,
+  "refresh": LucideIcons2__namespace.RefreshCw,
+  "share": LucideIcons2__namespace.Share2,
+  "sort-asc": LucideIcons2__namespace.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons2__namespace.ArrowDownNarrowWide
+};
+function kebabToPascal2(name) {
+  return name.split("-").map((part) => {
+    if (/^\d+$/.test(part)) return part;
+    return part.charAt(0).toUpperCase() + part.slice(1);
+  }).join("");
+}
+var resolvedCache = /* @__PURE__ */ new Map();
+function resolveIcon(name) {
+  const cached = resolvedCache.get(name);
+  if (cached) return cached;
+  const resolved = doResolve(name);
+  resolvedCache.set(name, resolved);
+  return resolved;
+}
+function doResolve(name) {
+  if (iconAliases[name]) return iconAliases[name];
+  const pascalName = kebabToPascal2(name);
+  const directLookup = LucideIcons2__namespace[pascalName];
+  if (directLookup && typeof directLookup === "object") return directLookup;
+  const asIs = LucideIcons2__namespace[name];
+  if (asIs && typeof asIs === "object") return asIs;
+  return LucideIcons2__namespace.HelpCircle;
+}
 var sizeClasses = {
   xs: "w-3 h-3",
   sm: "w-4 h-4",
@@ -3701,11 +3736,13 @@ var Icon = ({
   strokeWidth,
   style
 }) => {
+  const directIcon = typeof icon === "string" ? void 0 : icon;
+  const effectiveName = typeof icon === "string" ? icon : name;
   const family = useIconFamily();
   const RenderedComponent = React8__default.default.useMemo(() => {
-    if (icon) return null;
-    return name ? resolveIconForFamily(name, family) : null;
-  }, [icon, name, family]);
+    if (directIcon) return null;
+    return effectiveName ? resolveIconForFamily(effectiveName, family) : null;
+  }, [directIcon, effectiveName, family]);
   const effectiveStrokeWidth = strokeWidth ?? void 0;
   const inlineStyle = {
     ...effectiveStrokeWidth === void 0 ? { strokeWidth: "var(--icon-stroke-width, 2)" } : {},
@@ -3717,8 +3754,8 @@ var Icon = ({
     color ? color : "text-current",
     className
   );
-  if (icon) {
-    const Direct = icon;
+  if (directIcon) {
+    const Direct = directIcon;
     return /* @__PURE__ */ jsxRuntime.jsx(
       Direct,
       {
@@ -3738,7 +3775,7 @@ var Icon = ({
       }
     );
   }
-  const Fallback = LucideIcons__namespace.HelpCircle;
+  const Fallback = LucideIcons2__namespace.HelpCircle;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Fallback,
     {
@@ -3877,7 +3914,7 @@ var Button = React8__default.default.forwardRef(
         ...props,
         "data-testid": props["data-testid"] ?? (action ? `action-${action}` : void 0),
         children: [
-          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Loader2, { className: "h-icon-default w-icon-default animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
+          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.Loader2, { className: "h-icon-default w-icon-default animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
           children || label,
           resolvedRightIcon && !isLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedRightIcon })
         ]
@@ -3961,7 +3998,7 @@ var Badge = React8__default.default.forwardRef(
                 "transition-colors",
                 size === "sm" ? "w-4 h-4 ml-0.5" : size === "md" ? "w-5 h-5 ml-1" : "w-6 h-6 ml-1"
               ),
-              children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { className: iconSizes[size] })
+              children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.X, { className: iconSizes[size] })
             }
           ) : null
         ]
@@ -5042,7 +5079,7 @@ var Avatar = ({
   alt,
   name,
   initials: providedInitials,
-  icon: IconComponent,
+  icon: iconProp,
   size = "md",
   status,
   badge,
@@ -5053,6 +5090,7 @@ var Avatar = ({
 }) => {
   const eventBus = useEventBus();
   const initials = providedInitials ?? (name ? generateInitials(name) : void 0);
+  const IconComponent = typeof iconProp === "string" ? resolveIcon(iconProp) : iconProp;
   const hasImage = !!src;
   const hasInitials = !!initials;
   const hasIcon = !!IconComponent;