@sesionario/blocks 1.4.0 → 1.4.1

package/README.md

@@ -12,6 +12,14 @@ Shared feedback patterns include `ConfirmDestructiveDialog` (confirm before dele
 pnpm add @sesionario/blocks
 ```
 
+The main entry is a Client Component boundary. Pure helpers that must run in
+React Server Components (e.g. avatar initials/colors) should be imported from
+the server-safe subpath:
+
+```ts
+import { avatarFallbackStyle, getInitials } from "@sesionario/blocks/avatar";
+```
+
 Peer dependencies (install in the consuming app as needed):
 
 - `react`, `react-dom`

package/dist/avatar.cjs

@@ -0,0 +1,89 @@
+'use strict';
+
+// src/lib/avatar.ts
+var EMPTY_COLORS = {
+  backgroundColor: "#9ca3af",
+  color: "#111111"
+};
+var AVATAR_PALETTE = [
+  "#4f6d8c",
+  // slate blue
+  "#3d7a6a",
+  // teal
+  "#6b5b8a",
+  // muted purple
+  "#8a5a4a",
+  // warm brown
+  "#4a7a8a",
+  // steel cyan
+  "#7a6b4a",
+  // olive
+  "#5a6b8a",
+  // periwinkle
+  "#8a4a5a",
+  // rose
+  "#4a8a6b",
+  // green
+  "#6b4a7a",
+  // plum
+  "#8a6b4a",
+  // amber brown
+  "#4a5a8a",
+  // indigo
+  "#7a4a6b",
+  // mauve
+  "#5a8a4a",
+  // leaf
+  "#8a5a7a",
+  // dusty pink
+  "#3d6b7a"
+  // deep teal
+];
+function hashString(input) {
+  let hash = 2166136261;
+  for (let i = 0; i < input.length; i++) {
+    hash ^= input.charCodeAt(i);
+    hash = Math.imul(hash, 16777619);
+  }
+  return hash >>> 0;
+}
+function srgbToLinear(channel) {
+  const c = channel / 255;
+  return c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+}
+function relativeLuminance(hex) {
+  const normalized = hex.replace("#", "");
+  const r = Number.parseInt(normalized.slice(0, 2), 16);
+  const g = Number.parseInt(normalized.slice(2, 4), 16);
+  const b = Number.parseInt(normalized.slice(4, 6), 16);
+  return 0.2126 * srgbToLinear(r) + 0.7152 * srgbToLinear(g) + 0.0722 * srgbToLinear(b);
+}
+function contrastingTextColor(backgroundHex) {
+  return relativeLuminance(backgroundHex) > 0.179 ? "#111111" : "#ffffff";
+}
+function getInitials(name, max = 2) {
+  const parts = name.trim().split(/\s+/).filter(Boolean);
+  if (parts.length === 0) return "?";
+  const letters = parts.slice(0, Math.max(1, max)).map((part) => part.charAt(0)).join("");
+  return letters.toUpperCase() || "?";
+}
+function getAvatarColors(name) {
+  const normalized = name.trim().toLowerCase();
+  if (!normalized) {
+    return { ...EMPTY_COLORS };
+  }
+  const backgroundColor = AVATAR_PALETTE[hashString(normalized) % AVATAR_PALETTE.length];
+  return {
+    backgroundColor,
+    color: contrastingTextColor(backgroundColor)
+  };
+}
+function avatarFallbackStyle(name) {
+  return getAvatarColors(name);
+}
+
+exports.avatarFallbackStyle = avatarFallbackStyle;
+exports.getAvatarColors = getAvatarColors;
+exports.getInitials = getInitials;
+//# sourceMappingURL=avatar.cjs.map
+//# sourceMappingURL=avatar.cjs.map

package/dist/avatar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/avatar.ts"],"names":[],"mappings":";;;AACA,IAAM,YAAA,GAAe;AAAA,EACpB,eAAA,EAAiB,SAAA;AAAA,EACjB,KAAA,EAAO;AACR,CAAA;AAMA,IAAM,cAAA,GAAiB;AAAA,EACtB,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA,SAAA;AAAA;AAAA,EACA;AAAA;AACD,CAAA;AAQA,SAAS,WAAW,KAAA,EAAuB;AAC1C,EAAA,IAAI,IAAA,GAAO,UAAA;AACX,EAAA,KAAA,IAAS,CAAA,GAAI,CAAA,EAAG,CAAA,GAAI,KAAA,CAAM,QAAQ,CAAA,EAAA,EAAK;AACtC,IAAA,IAAA,IAAQ,KAAA,CAAM,WAAW,CAAC,CAAA;AAC1B,IAAA,IAAA,GAAO,IAAA,CAAK,IAAA,CAAK,IAAA,EAAM,QAAU,CAAA;AAAA,EAClC;AACA,EAAA,OAAO,IAAA,KAAS,CAAA;AACjB;AAEA,SAAS,aAAa,OAAA,EAAyB;AAC9C,EAAA,MAAM,IAAI,OAAA,GAAU,GAAA;AACpB,EAAA,OAAO,KAAK,OAAA,GAAU,CAAA,GAAI,KAAA,GAAA,CAAA,CAAU,CAAA,GAAI,SAAS,KAAA,KAAU,GAAA;AAC5D;AAGA,SAAS,kBAAkB,GAAA,EAAqB;AAC/C,EAAA,MAAM,UAAA,GAAa,GAAA,CAAI,OAAA,CAAQ,GAAA,EAAK,EAAE,CAAA;AACtC,EAAA,MAAM,CAAA,GAAI,OAAO,QAAA,CAAS,UAAA,CAAW,MAAM,CAAA,EAAG,CAAC,GAAG,EAAE,CAAA;AACpD,EAAA,MAAM,CAAA,GAAI,OAAO,QAAA,CAAS,UAAA,CAAW,MAAM,CAAA,EAAG,CAAC,GAAG,EAAE,CAAA;AACpD,EAAA,MAAM,CAAA,GAAI,OAAO,QAAA,CAAS,UAAA,CAAW,MAAM,CAAA,EAAG,CAAC,GAAG,EAAE,CAAA;AACpD,EAAA,OACC,MAAA,GAAS,YAAA,CAAa,CAAC,CAAA,GACvB,MAAA,GAAS,aAAa,CAAC,CAAA,GACvB,MAAA,GAAS,YAAA,CAAa,CAAC,CAAA;AAEzB;AAEA,SAAS,qBAAqB,aAAA,EAA8C;AAE3E,EAAA,OAAO,iBAAA,CAAkB,aAAa,CAAA,GAAI,KAAA,GAAQ,SAAA,GAAY,SAAA;AAC/D;AAMO,SAAS,WAAA,CAAY,IAAA,EAAc,GAAA,GAAM,CAAA,EAAW;AAC1D,EAAA,MAAM,KAAA,GAAQ,KAAK,IAAA,EAAK,CAAE,MAAM,KAAK,CAAA,CAAE,OAAO,OAAO,CAAA;AACrD,EAAA,IAAI,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG,OAAO,GAAA;AAC/B,EAAA,MAAM,UAAU,KAAA,CACd,KAAA,CAAM,GAAG,IAAA,CAAK,GAAA,CAAI,GAAG,GAAG,CAAC,EACzB,GAAA,CAAI,CAAC,SAAS,IAAA,CAAK,MAAA,CAAO,CAAC,CAAC,CAAA,CAC5B,KAAK,EAAE,CAAA;AACT,EAAA,OAAO,OAAA,CAAQ,aAAY,IAAK,GAAA;AACjC;AAMO,SAAS,gBAAgB,IAAA,EAA4B;AAC3D,EAAA,MAAM,UAAA,GAAa,IAAA,CAAK,IAAA,EAAK,CAAE,WAAA,EAAY;AAC3C,EAAA,IAAI,CAAC,UAAA,EAAY;AAChB,IAAA,OAAO,EAAE,GAAG,YAAA,EAAa;AAAA,EAC1B;AACA,EAAA,MAAM,kBACL,cAAA,CAAe,UAAA,CAAW,UAAU,CAAA,GAAI,eAAe,MAAM,CAAA;AAC9D,EAAA,OAAO;AAAA,IACN,eAAA;AAAA,IACA,KAAA,EAAO,qBAAqB,eAAe;AAAA,GAC5C;AACD;AAGO,SAAS,oBACf,IAAA,EACkD;AAClD,EAAA,OAAO,gBAAgB,IAAI,CAAA;AAC5B","file":"avatar.cjs","sourcesContent":["/** Neutral fallback when the name is empty. */\nconst EMPTY_COLORS = {\n\tbackgroundColor: \"#9ca3af\",\n\tcolor: \"#111111\",\n} as const;\n\n/**\n * Curated mid-lightness palette — professional, calm hues that stay\n * distinct when hashed by name and contrast well with black or white text.\n */\nconst AVATAR_PALETTE = [\n\t\"#4f6d8c\", // slate blue\n\t\"#3d7a6a\", // teal\n\t\"#6b5b8a\", // muted purple\n\t\"#8a5a4a\", // warm brown\n\t\"#4a7a8a\", // steel cyan\n\t\"#7a6b4a\", // olive\n\t\"#5a6b8a\", // periwinkle\n\t\"#8a4a5a\", // rose\n\t\"#4a8a6b\", // green\n\t\"#6b4a7a\", // plum\n\t\"#8a6b4a\", // amber brown\n\t\"#4a5a8a\", // indigo\n\t\"#7a4a6b\", // mauve\n\t\"#5a8a4a\", // leaf\n\t\"#8a5a7a\", // dusty pink\n\t\"#3d6b7a\", // deep teal\n] as const;\n\nexport type AvatarColors = {\n\tbackgroundColor: string;\n\tcolor: string;\n};\n\n/** FNV-1a 32-bit hash — stable across runtimes for the same string. */\nfunction hashString(input: string): number {\n\tlet hash = 0x811c9dc5;\n\tfor (let i = 0; i < input.length; i++) {\n\t\thash ^= input.charCodeAt(i);\n\t\thash = Math.imul(hash, 0x01000193);\n\t}\n\treturn hash >>> 0;\n}\n\nfunction srgbToLinear(channel: number): number {\n\tconst c = channel / 255;\n\treturn c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n}\n\n/** Relative luminance (WCAG) for a hex color like `#rrggbb`. */\nfunction relativeLuminance(hex: string): number {\n\tconst normalized = hex.replace(\"#\", \"\");\n\tconst r = Number.parseInt(normalized.slice(0, 2), 16);\n\tconst g = Number.parseInt(normalized.slice(2, 4), 16);\n\tconst b = Number.parseInt(normalized.slice(4, 6), 16);\n\treturn (\n\t\t0.2126 * srgbToLinear(r) +\n\t\t0.7152 * srgbToLinear(g) +\n\t\t0.0722 * srgbToLinear(b)\n\t);\n}\n\nfunction contrastingTextColor(backgroundHex: string): \"#ffffff\" | \"#111111\" {\n\t// Threshold ~0.179 ≈ contrast preference for mid tones (WCAG-inspired).\n\treturn relativeLuminance(backgroundHex) > 0.179 ? \"#111111\" : \"#ffffff\";\n}\n\n/**\n * Word-based initials from a display name (max letters, default 2).\n * Empty / whitespace-only names yield `\"?\"`.\n */\nexport function getInitials(name: string, max = 2): string {\n\tconst parts = name.trim().split(/\\s+/).filter(Boolean);\n\tif (parts.length === 0) return \"?\";\n\tconst letters = parts\n\t\t.slice(0, Math.max(1, max))\n\t\t.map((part) => part.charAt(0))\n\t\t.join(\"\");\n\treturn letters.toUpperCase() || \"?\";\n}\n\n/**\n * Deterministic background + contrasting foreground from a full name.\n * Same name (case-insensitive) always maps to the same colors.\n */\nexport function getAvatarColors(name: string): AvatarColors {\n\tconst normalized = name.trim().toLowerCase();\n\tif (!normalized) {\n\t\treturn { ...EMPTY_COLORS };\n\t}\n\tconst backgroundColor =\n\t\tAVATAR_PALETTE[hashString(normalized) % AVATAR_PALETTE.length]!;\n\treturn {\n\t\tbackgroundColor,\n\t\tcolor: contrastingTextColor(backgroundColor),\n\t};\n}\n\n/** CSS style object for `AvatarFallback` (or any letter-avatar container). */\nexport function avatarFallbackStyle(\n\tname: string,\n): Pick<AvatarColors, \"backgroundColor\" | \"color\"> {\n\treturn getAvatarColors(name);\n}\n"]}

package/dist/avatar.d.cts

@@ -0,0 +1,18 @@
+type AvatarColors = {
+    backgroundColor: string;
+    color: string;
+};
+/**
+ * Word-based initials from a display name (max letters, default 2).
+ * Empty / whitespace-only names yield `"?"`.
+ */
+declare function getInitials(name: string, max?: number): string;
+/**
+ * Deterministic background + contrasting foreground from a full name.
+ * Same name (case-insensitive) always maps to the same colors.
+ */
+declare function getAvatarColors(name: string): AvatarColors;
+/** CSS style object for `AvatarFallback` (or any letter-avatar container). */
+declare function avatarFallbackStyle(name: string): Pick<AvatarColors, "backgroundColor" | "color">;
+
+export { type AvatarColors, avatarFallbackStyle, getAvatarColors, getInitials };

package/dist/avatar.d.ts

@@ -0,0 +1,18 @@
+type AvatarColors = {
+    backgroundColor: string;
+    color: string;
+};
+/**
+ * Word-based initials from a display name (max letters, default 2).
+ * Empty / whitespace-only names yield `"?"`.
+ */
+declare function getInitials(name: string, max?: number): string;
+/**
+ * Deterministic background + contrasting foreground from a full name.
+ * Same name (case-insensitive) always maps to the same colors.
+ */
+declare function getAvatarColors(name: string): AvatarColors;
+/** CSS style object for `AvatarFallback` (or any letter-avatar container). */
+declare function avatarFallbackStyle(name: string): Pick<AvatarColors, "backgroundColor" | "color">;
+
+export { type AvatarColors, avatarFallbackStyle, getAvatarColors, getInitials };

package/dist/avatar.js

@@ -0,0 +1,85 @@
+// src/lib/avatar.ts
+var EMPTY_COLORS = {
+  backgroundColor: "#9ca3af",
+  color: "#111111"
+};
+var AVATAR_PALETTE = [
+  "#4f6d8c",
+  // slate blue
+  "#3d7a6a",
+  // teal
+  "#6b5b8a",
+  // muted purple
+  "#8a5a4a",
+  // warm brown
+  "#4a7a8a",
+  // steel cyan
+  "#7a6b4a",
+  // olive
+  "#5a6b8a",
+  // periwinkle
+  "#8a4a5a",
+  // rose
+  "#4a8a6b",
+  // green
+  "#6b4a7a",
+  // plum
+  "#8a6b4a",
+  // amber brown
+  "#4a5a8a",
+  // indigo
+  "#7a4a6b",
+  // mauve
+  "#5a8a4a",
+  // leaf
+  "#8a5a7a",
+  // dusty pink
+  "#3d6b7a"
+  // deep teal
+];
+function hashString(input) {
+  let hash = 2166136261;
+  for (let i = 0; i < input.length; i++) {
+    hash ^= input.charCodeAt(i);
+    hash = Math.imul(hash, 16777619);
+  }
+  return hash >>> 0;
+}
+function srgbToLinear(channel) {
+  const c = channel / 255;
+  return c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+}
+function relativeLuminance(hex) {
+  const normalized = hex.replace("#", "");
+  const r = Number.parseInt(normalized.slice(0, 2), 16);
+  const g = Number.parseInt(normalized.slice(2, 4), 16);
+  const b = Number.parseInt(normalized.slice(4, 6), 16);
+  return 0.2126 * srgbToLinear(r) + 0.7152 * srgbToLinear(g) + 0.0722 * srgbToLinear(b);
+}
+function contrastingTextColor(backgroundHex) {
+  return relativeLuminance(backgroundHex) > 0.179 ? "#111111" : "#ffffff";
+}
+function getInitials(name, max = 2) {
+  const parts = name.trim().split(/\s+/).filter(Boolean);
+  if (parts.length === 0) return "?";
+  const letters = parts.slice(0, Math.max(1, max)).map((part) => part.charAt(0)).join("");
+  return letters.toUpperCase() || "?";
+}
+function getAvatarColors(name) {
+  const normalized = name.trim().toLowerCase();
+  if (!normalized) {
+    return { ...EMPTY_COLORS };
+  }
+  const backgroundColor = AVATAR_PALETTE[hashString(normalized) % AVATAR_PALETTE.length];
+  return {
+    backgroundColor,
+    color: contrastingTextColor(backgroundColor)
+  };
+}
+function avatarFallbackStyle(name) {
+  return getAvatarColors(name);
+}
+
+export { avatarFallbackStyle, getAvatarColors, getInitials };
+//# sourceMappingURL=avatar.js.map
+//# sourceMappingURL=avatar.js.map

package/dist/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/avatar.ts"],"names":[],"mappings":"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","file":"avatar.js","sourcesContent":["/** Neutral fallback when the name is empty. */\nconst EMPTY_COLORS = {\n\tbackgroundColor: \"#9ca3af\",\n\tcolor: \"#111111\",\n} as const;\n\n/**\n * Curated mid-lightness palette — professional, calm hues that stay\n * distinct when hashed by name and contrast well with black or white text.\n */\nconst AVATAR_PALETTE = [\n\t\"#4f6d8c\", // slate blue\n\t\"#3d7a6a\", // teal\n\t\"#6b5b8a\", // muted purple\n\t\"#8a5a4a\", // warm brown\n\t\"#4a7a8a\", // steel cyan\n\t\"#7a6b4a\", // olive\n\t\"#5a6b8a\", // periwinkle\n\t\"#8a4a5a\", // rose\n\t\"#4a8a6b\", // green\n\t\"#6b4a7a\", // plum\n\t\"#8a6b4a\", // amber brown\n\t\"#4a5a8a\", // indigo\n\t\"#7a4a6b\", // mauve\n\t\"#5a8a4a\", // leaf\n\t\"#8a5a7a\", // dusty pink\n\t\"#3d6b7a\", // deep teal\n] as const;\n\nexport type AvatarColors = {\n\tbackgroundColor: string;\n\tcolor: string;\n};\n\n/** FNV-1a 32-bit hash — stable across runtimes for the same string. */\nfunction hashString(input: string): number {\n\tlet hash = 0x811c9dc5;\n\tfor (let i = 0; i < input.length; i++) {\n\t\thash ^= input.charCodeAt(i);\n\t\thash = Math.imul(hash, 0x01000193);\n\t}\n\treturn hash >>> 0;\n}\n\nfunction srgbToLinear(channel: number): number {\n\tconst c = channel / 255;\n\treturn c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n}\n\n/** Relative luminance (WCAG) for a hex color like `#rrggbb`. */\nfunction relativeLuminance(hex: string): number {\n\tconst normalized = hex.replace(\"#\", \"\");\n\tconst r = Number.parseInt(normalized.slice(0, 2), 16);\n\tconst g = Number.parseInt(normalized.slice(2, 4), 16);\n\tconst b = Number.parseInt(normalized.slice(4, 6), 16);\n\treturn (\n\t\t0.2126 * srgbToLinear(r) +\n\t\t0.7152 * srgbToLinear(g) +\n\t\t0.0722 * srgbToLinear(b)\n\t);\n}\n\nfunction contrastingTextColor(backgroundHex: string): \"#ffffff\" | \"#111111\" {\n\t// Threshold ~0.179 ≈ contrast preference for mid tones (WCAG-inspired).\n\treturn relativeLuminance(backgroundHex) > 0.179 ? \"#111111\" : \"#ffffff\";\n}\n\n/**\n * Word-based initials from a display name (max letters, default 2).\n * Empty / whitespace-only names yield `\"?\"`.\n */\nexport function getInitials(name: string, max = 2): string {\n\tconst parts = name.trim().split(/\\s+/).filter(Boolean);\n\tif (parts.length === 0) return \"?\";\n\tconst letters = parts\n\t\t.slice(0, Math.max(1, max))\n\t\t.map((part) => part.charAt(0))\n\t\t.join(\"\");\n\treturn letters.toUpperCase() || \"?\";\n}\n\n/**\n * Deterministic background + contrasting foreground from a full name.\n * Same name (case-insensitive) always maps to the same colors.\n */\nexport function getAvatarColors(name: string): AvatarColors {\n\tconst normalized = name.trim().toLowerCase();\n\tif (!normalized) {\n\t\treturn { ...EMPTY_COLORS };\n\t}\n\tconst backgroundColor =\n\t\tAVATAR_PALETTE[hashString(normalized) % AVATAR_PALETTE.length]!;\n\treturn {\n\t\tbackgroundColor,\n\t\tcolor: contrastingTextColor(backgroundColor),\n\t};\n}\n\n/** CSS style object for `AvatarFallback` (or any letter-avatar container). */\nexport function avatarFallbackStyle(\n\tname: string,\n): Pick<AvatarColors, \"backgroundColor\" | \"color\"> {\n\treturn getAvatarColors(name);\n}\n"]}

package/dist/index.d.cts

@@ -9,6 +9,7 @@ import * as RPNInput from 'react-phone-number-input';
 import { MessageScroller as MessageScroller$1 } from '@shadcn/react/message-scroller';
 export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from '@shadcn/react/message-scroller';
 import { ClassValue } from 'clsx';
+export { AvatarColors, avatarFallbackStyle, getAvatarColors, getInitials } from './avatar.cjs';
 
 /**
  * Blocks Context Interfaces
@@ -808,21 +809,4 @@ declare function ChatMessageList({ messages, currentUserId, emptyTitle, emptyDes
 
 declare function cn(...inputs: ClassValue[]): string;
 
-type AvatarColors = {
-    backgroundColor: string;
-    color: string;
-};
-/**
- * Word-based initials from a display name (max letters, default 2).
- * Empty / whitespace-only names yield `"?"`.
- */
-declare function getInitials(name: string, max?: number): string;
-/**
- * Deterministic background + contrasting foreground from a full name.
- * Same name (case-insensitive) always maps to the same colors.
- */
-declare function getAvatarColors(name: string): AvatarColors;
-/** CSS style object for `AvatarFallback` (or any letter-avatar container). */
-declare function avatarFallbackStyle(name: string): Pick<AvatarColors, "backgroundColor" | "color">;
-
-export { type AutoplayState, type AvatarColors, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type DescribedPlaybackError, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, type FeatureEntry, type HlsPlayerMode, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PhoneInput, type PhoneInputProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, avatarFallbackStyle, bubbleVariants, cn, createLiveHlsConfig, createVodHlsConfig, defaultLanguages, describePlaybackError, fuzzyMatch, getAvatarColors, getInitials, insertAtCaret, markerVariants, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, usePlaybackStats, useSearchHotkey };
+export { type AutoplayState, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type DescribedPlaybackError, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, type FeatureEntry, type HlsPlayerMode, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PhoneInput, type PhoneInputProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, bubbleVariants, cn, createLiveHlsConfig, createVodHlsConfig, defaultLanguages, describePlaybackError, fuzzyMatch, insertAtCaret, markerVariants, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, usePlaybackStats, useSearchHotkey };

package/dist/index.d.ts

@@ -9,6 +9,7 @@ import * as RPNInput from 'react-phone-number-input';
 import { MessageScroller as MessageScroller$1 } from '@shadcn/react/message-scroller';
 export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from '@shadcn/react/message-scroller';
 import { ClassValue } from 'clsx';
+export { AvatarColors, avatarFallbackStyle, getAvatarColors, getInitials } from './avatar.js';
 
 /**
  * Blocks Context Interfaces
@@ -808,21 +809,4 @@ declare function ChatMessageList({ messages, currentUserId, emptyTitle, emptyDes
 
 declare function cn(...inputs: ClassValue[]): string;
 
-type AvatarColors = {
-    backgroundColor: string;
-    color: string;
-};
-/**
- * Word-based initials from a display name (max letters, default 2).
- * Empty / whitespace-only names yield `"?"`.
- */
-declare function getInitials(name: string, max?: number): string;
-/**
- * Deterministic background + contrasting foreground from a full name.
- * Same name (case-insensitive) always maps to the same colors.
- */
-declare function getAvatarColors(name: string): AvatarColors;
-/** CSS style object for `AvatarFallback` (or any letter-avatar container). */
-declare function avatarFallbackStyle(name: string): Pick<AvatarColors, "backgroundColor" | "color">;
-
-export { type AutoplayState, type AvatarColors, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type DescribedPlaybackError, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, type FeatureEntry, type HlsPlayerMode, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PhoneInput, type PhoneInputProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, avatarFallbackStyle, bubbleVariants, cn, createLiveHlsConfig, createVodHlsConfig, defaultLanguages, describePlaybackError, fuzzyMatch, getAvatarColors, getInitials, insertAtCaret, markerVariants, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, usePlaybackStats, useSearchHotkey };
+export { type AutoplayState, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type DescribedPlaybackError, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, type FeatureEntry, type HlsPlayerMode, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PhoneInput, type PhoneInputProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, bubbleVariants, cn, createLiveHlsConfig, createVodHlsConfig, defaultLanguages, describePlaybackError, fuzzyMatch, insertAtCaret, markerVariants, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, usePlaybackStats, useSearchHotkey };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@sesionario/blocks",
-	"version": "1.4.0",
+	"version": "1.4.1",
 	"description": "Shared UI components for Sesionario applications",
 	"type": "module",
 	"main": "./dist/index.cjs",
@@ -16,6 +16,16 @@
 				"types": "./dist/index.d.cts",
 				"default": "./dist/index.cjs"
 			}
+		},
+		"./avatar": {
+			"import": {
+				"types": "./dist/avatar.d.ts",
+				"default": "./dist/avatar.js"
+			},
+			"require": {
+				"types": "./dist/avatar.d.cts",
+				"default": "./dist/avatar.cjs"
+			}
 		}
 	},
 	"files": [