@lumiastream/ui 0.0.6 → 0.1.0-beta.1

package/dist/index.d.ts

@@ -123,4 +123,109 @@ declare const codeMirrorlinterOptions: (type: "overlay" | "code", language?: "js
     };
 };
 
-export { LSButton, type LSButtonProps, codeMirrorlinterOptions, variableCompletionOptions };
+declare const MEDIA_PREVIEW_USER_LEVEL_VALUES: readonly ["streamer", "moderators", "vips", "tier3", "tier2", "subscribers", "regular", "follower", "anyone"];
+type MediaPreviewUserLevel = (typeof MEDIA_PREVIEW_USER_LEVEL_VALUES)[number];
+type ChatboxMediaPreviewKind = 'image' | 'video' | 'audio' | 'youtube' | 'youtubeShort' | 'spotify';
+type ChatboxMediaPreview = {
+    kind: ChatboxMediaPreviewKind;
+    src: string;
+    title?: string;
+};
+type MessageLinkPart = {
+    text: string;
+    url?: string;
+};
+type ChatMessageToken = {
+    type: 'text';
+    text: string;
+} | {
+    type: 'link';
+    text: string;
+    url: string;
+} | {
+    type: 'media';
+    text: string;
+    url: string;
+    media: ChatboxMediaPreview;
+};
+type MediaPreviewRoleSettings = {
+    previewMediaForViewers: boolean;
+    previewMediaForSubscribers: boolean;
+    previewMediaForVips: boolean;
+    previewMediaForModerators: boolean;
+    previewMediaForStreamer: boolean;
+    previewMediaForTier3: boolean;
+    previewMediaForTier2: boolean;
+    previewMediaForRegular: boolean;
+    previewMediaForFollower: boolean;
+    previewMediaForAnyone: boolean;
+};
+type MediaPreviewRoleSettingsInput = Partial<Record<keyof MediaPreviewRoleSettings, unknown>> & {
+    previewMediaUserLevels?: unknown;
+};
+type ChatMessageTokenizationOptions = {
+    hyperClickableLinks?: boolean;
+    previewMediaInChat?: boolean;
+};
+type ChatterProfileUrlInput = {
+    platform?: unknown;
+    username?: unknown;
+    displayname?: unknown;
+    userId?: unknown;
+};
+type ChatMessageEmoteStore = {
+    ffz?: Record<string, string>;
+    bttv?: Record<string, string>;
+    seventv?: Record<string, string>;
+};
+type ChatMessageContentItem = string | {
+    id: string;
+    urls: string[];
+    key: string;
+} | {
+    id: string;
+    type: 'cheer';
+    roundedAmount: number;
+    cheerAmount: number;
+    bitColor: string;
+    key: string;
+};
+type BuildChatMessageContentOptions = {
+    message?: string;
+    replaceWord?: string;
+    filteredWordsRegex?: RegExp;
+    emotesRaw?: string;
+    emotesPack?: Record<string, any> | any[];
+    origin?: string;
+    emoteParserType?: string;
+    isCheer?: boolean;
+    storeEmotes?: ChatMessageEmoteStore;
+    youtubeEmotes?: Record<string, string>;
+    allowParserTypes?: string[];
+};
+type ChatterProfileResolverPayload = {
+    username?: string;
+    displayname?: string;
+    userId?: string;
+    platform?: string;
+    extraSettings?: Record<string, any>;
+};
+type ChatterProfileResolver = (payload: ChatterProfileResolverPayload) => Promise<unknown> | unknown;
+type ResolveChatterProfileUrlWithResolversInput = ChatterProfileUrlInput & {
+    extraSettings?: Record<string, any>;
+    resolvers?: Array<ChatterProfileResolver | null | undefined>;
+};
+declare const parseMessageLinks: (value: string) => MessageLinkPart[];
+declare const tokenizeChatMessage: (value: string, options?: ChatMessageTokenizationOptions) => ChatMessageToken[];
+declare const buildChatMessageContent: ({ message, replaceWord, filteredWordsRegex, emotesRaw, emotesPack, origin, emoteParserType, isCheer, storeEmotes, youtubeEmotes, allowParserTypes, }: BuildChatMessageContentOptions) => ChatMessageContentItem[];
+declare const resolveMediaPreviewSetting: (value: unknown, fallback: boolean) => boolean;
+declare const normalizeMediaPreviewUserLevels: (value: unknown) => MediaPreviewUserLevel[];
+declare const resolveMediaPreviewRoleSettings: (settings: MediaPreviewRoleSettingsInput) => MediaPreviewRoleSettings;
+declare const getNormalizedUserLevels: (value: unknown) => Record<string, boolean>;
+declare const isMediaPreviewAllowedForUser: (userLevelsRaw: unknown, roleSettings: MediaPreviewRoleSettings) => boolean;
+declare const getMediaPreviewFromUrl: (url: string) => ChatboxMediaPreview | null;
+declare const resolvePlatformChatterProfileUrl: ({ platform, username, displayname, userId }: ChatterProfileUrlInput) => string | null;
+declare const normalizeHttpUrl: (value: unknown) => string | null;
+declare const resolveChatterProfileUrlWithResolvers: ({ platform, username, displayname, userId, extraSettings, resolvers, }: ResolveChatterProfileUrlWithResolversInput) => Promise<string | null>;
+
+export { type BuildChatMessageContentOptions, type ChatMessageContentItem, type ChatMessageEmoteStore, type ChatMessageToken, type ChatMessageTokenizationOptions, type ChatboxMediaPreview, type ChatboxMediaPreviewKind, type ChatterProfileResolver, type ChatterProfileResolverPayload, type ChatterProfileUrlInput, LSButton, type LSButtonProps, MEDIA_PREVIEW_USER_LEVEL_VALUES, type MediaPreviewRoleSettings, type MediaPreviewRoleSettingsInput, type MediaPreviewUserLevel, type MessageLinkPart, type ResolveChatterProfileUrlWithResolversInput, buildChatMessageContent, codeMirrorlinterOptions, getMediaPreviewFromUrl, getNormalizedUserLevels, isMediaPreviewAllowedForUser, normalizeHttpUrl, normalizeMediaPreviewUserLevels, parseMessageLinks, resolveChatterProfileUrlWithResolvers, resolveMediaPreviewRoleSettings, resolveMediaPreviewSetting, resolvePlatformChatterProfileUrl, tokenizeChatMessage, variableCompletionOptions };

package/dist/index.js

@@ -21,7 +21,7 @@ function styleInject(css, { insertAt } = {}) {
 }
 
 // src/tailwind.css
-styleInject('/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer theme, base, components, utilities;\n@layer theme {\n  :root,\n  :host {\n    --font-sans:\n      ui-sans-serif,\n      system-ui,\n      sans-serif,\n      "Apple Color Emoji",\n      "Segoe UI Emoji",\n      "Segoe UI Symbol",\n      "Noto Color Emoji";\n    --font-mono:\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      Consolas,\n      "Liberation Mono",\n      "Courier New",\n      monospace;\n    --color-blue-500: oklch(62.3% 0.214 259.815);\n    --color-gray-500: oklch(55.1% 0.027 264.364);\n    --spacing: 0.25rem;\n    --text-sm: 0.875rem;\n    --text-sm--line-height: calc(1.25 / 0.875);\n    --text-base: 1rem;\n    --text-base--line-height: calc(1.5 / 1);\n    --text-lg: 1.125rem;\n    --text-lg--line-height: calc(1.75 / 1.125);\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *,\n  ::after,\n  ::before,\n  ::backdrop,\n  ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html,\n  :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b,\n  strong {\n    font-weight: bolder;\n  }\n  code,\n  kbd,\n  samp,\n  pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub,\n  sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol,\n  ul,\n  menu {\n    list-style: none;\n  }\n  img,\n  svg,\n  video,\n  canvas,\n  audio,\n  iframe,\n  embed,\n  object {\n    display: block;\n    vertical-align: middle;\n  }\n  img,\n  video {\n    max-width: 100%;\n    height: auto;\n  }\n  button,\n  input,\n  select,\n  optgroup,\n  textarea,\n  ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: currentcolor;\n      @supports (color: color-mix(in lab, red, red)) {\n        color: color-mix(in oklab, currentcolor 50%, transparent);\n      }\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-webkit-datetime-edit,\n  ::-webkit-datetime-edit-year-field,\n  ::-webkit-datetime-edit-month-field,\n  ::-webkit-datetime-edit-day-field,\n  ::-webkit-datetime-edit-hour-field,\n  ::-webkit-datetime-edit-minute-field,\n  ::-webkit-datetime-edit-second-field,\n  ::-webkit-datetime-edit-millisecond-field,\n  ::-webkit-datetime-edit-meridiem-field {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button,\n  input:where([type=button], [type=reset], [type=submit]),\n  ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button,\n  ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=until-found])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .static {\n    position: static;\n  }\n  .contents {\n    display: contents;\n  }\n  .bg-blue-500 {\n    background-color: var(--color-blue-500);\n  }\n  .bg-gray-500 {\n    background-color: var(--color-gray-500);\n  }\n  .px-3 {\n    padding-inline: calc(var(--spacing) * 3);\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .px-6 {\n    padding-inline: calc(var(--spacing) * 6);\n  }\n  .py-1 {\n    padding-block: calc(var(--spacing) * 1);\n  }\n  .py-2 {\n    padding-block: calc(var(--spacing) * 2);\n  }\n  .py-3 {\n    padding-block: calc(var(--spacing) * 3);\n  }\n  .text-base {\n    font-size: var(--text-base);\n    line-height: var(--tw-leading, var(--text-base--line-height));\n  }\n  .text-lg {\n    font-size: var(--text-lg);\n    line-height: var(--tw-leading, var(--text-lg--line-height));\n  }\n  .text-sm {\n    font-size: var(--text-sm);\n    line-height: var(--tw-leading, var(--text-sm--line-height));\n  }\n}\n');
+styleInject('/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer theme, base, components, utilities;\n@layer theme {\n  :root,\n  :host {\n    --font-sans:\n      ui-sans-serif,\n      system-ui,\n      sans-serif,\n      "Apple Color Emoji",\n      "Segoe UI Emoji",\n      "Segoe UI Symbol",\n      "Noto Color Emoji";\n    --font-mono:\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      Consolas,\n      "Liberation Mono",\n      "Courier New",\n      monospace;\n    --color-blue-500: oklch(62.3% 0.214 259.815);\n    --color-gray-500: oklch(55.1% 0.027 264.364);\n    --spacing: 0.25rem;\n    --text-sm: 0.875rem;\n    --text-sm--line-height: calc(1.25 / 0.875);\n    --text-base: 1rem;\n    --text-base--line-height: calc(1.5 / 1);\n    --text-lg: 1.125rem;\n    --text-lg--line-height: calc(1.75 / 1.125);\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *,\n  ::after,\n  ::before,\n  ::backdrop,\n  ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html,\n  :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b,\n  strong {\n    font-weight: bolder;\n  }\n  code,\n  kbd,\n  samp,\n  pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub,\n  sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol,\n  ul,\n  menu {\n    list-style: none;\n  }\n  img,\n  svg,\n  video,\n  canvas,\n  audio,\n  iframe,\n  embed,\n  object {\n    display: block;\n    vertical-align: middle;\n  }\n  img,\n  video {\n    max-width: 100%;\n    height: auto;\n  }\n  button,\n  input,\n  select,\n  optgroup,\n  textarea,\n  ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: currentcolor;\n      @supports (color: color-mix(in lab, red, red)) {\n        color: color-mix(in oklab, currentcolor 50%, transparent);\n      }\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-webkit-datetime-edit,\n  ::-webkit-datetime-edit-year-field,\n  ::-webkit-datetime-edit-month-field,\n  ::-webkit-datetime-edit-day-field,\n  ::-webkit-datetime-edit-hour-field,\n  ::-webkit-datetime-edit-minute-field,\n  ::-webkit-datetime-edit-second-field,\n  ::-webkit-datetime-edit-millisecond-field,\n  ::-webkit-datetime-edit-meridiem-field {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button,\n  input:where([type=button], [type=reset], [type=submit]),\n  ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button,\n  ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=until-found])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .static {\n    position: static;\n  }\n  .block {\n    display: block;\n  }\n  .contents {\n    display: contents;\n  }\n  .bg-blue-500 {\n    background-color: var(--color-blue-500);\n  }\n  .bg-gray-500 {\n    background-color: var(--color-gray-500);\n  }\n  .px-3 {\n    padding-inline: calc(var(--spacing) * 3);\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .px-6 {\n    padding-inline: calc(var(--spacing) * 6);\n  }\n  .py-1 {\n    padding-block: calc(var(--spacing) * 1);\n  }\n  .py-2 {\n    padding-block: calc(var(--spacing) * 2);\n  }\n  .py-3 {\n    padding-block: calc(var(--spacing) * 3);\n  }\n  .text-base {\n    font-size: var(--text-base);\n    line-height: var(--tw-leading, var(--text-base--line-height));\n  }\n  .text-lg {\n    font-size: var(--text-lg);\n    line-height: var(--tw-leading, var(--text-lg--line-height));\n  }\n  .text-sm {\n    font-size: var(--text-sm);\n    line-height: var(--tw-leading, var(--text-sm--line-height));\n  }\n}\n');
 
 // src/components/LSButton/LSButton.tsx
 import { jsx } from "react/jsx-runtime";
@@ -265,8 +265,618 @@ var codeMirrorlinterOptions = (type, language = "js") => {
   }
   return jsOptions;
 };
+
+// src/utils/chatMedia.ts
+var URL_TOKEN_REGEX = /(?:https?:\/\/|www\.)[^\s<]+/gi;
+var TRAILING_LINK_PUNCTUATION_REGEX = /[),.!?;:'"]+$/;
+var MEDIA_IMAGE_REGEX = /\.(gif|png|jpe?g|webp|bmp|avif)(?:[?#].*)?$/i;
+var MEDIA_VIDEO_REGEX = /\.(mp4|webm|mov|m4v)(?:[?#].*)?$/i;
+var MEDIA_AUDIO_REGEX = /\.(mp3|wav|ogg|oga|aac|m4a|flac|opus)(?:[?#].*)?$/i;
+var YOUTUBE_ID_REGEX = /^[a-zA-Z0-9_-]{6,}$/;
+var SPOTIFY_EMBED_TYPES = /* @__PURE__ */ new Set(["track", "album", "playlist", "episode", "show", "artist"]);
+var MEDIA_PREVIEW_USER_LEVEL_VALUES = ["streamer", "moderators", "vips", "tier3", "tier2", "subscribers", "regular", "follower", "anyone"];
+var parseMessageLinks = (value) => {
+  if (!value) {
+    return [{ text: "" }];
+  }
+  const parts = [];
+  let cursor = 0;
+  for (const match of value.matchAll(URL_TOKEN_REGEX)) {
+    const rawToken = match[0];
+    if (!rawToken) {
+      continue;
+    }
+    const start = match.index ?? 0;
+    const end = start + rawToken.length;
+    if (start > cursor) {
+      parts.push({ text: value.slice(cursor, start) });
+    }
+    const trailing = rawToken.match(TRAILING_LINK_PUNCTUATION_REGEX)?.[0] ?? "";
+    const cleaned = trailing ? rawToken.slice(0, -trailing.length) : rawToken;
+    if (cleaned) {
+      const href = cleaned.startsWith("http://") || cleaned.startsWith("https://") ? cleaned : `https://${cleaned}`;
+      parts.push({ text: cleaned, url: href });
+    } else {
+      parts.push({ text: rawToken });
+    }
+    if (trailing) {
+      parts.push({ text: trailing });
+    }
+    cursor = end;
+  }
+  if (cursor < value.length) {
+    parts.push({ text: value.slice(cursor) });
+  }
+  return parts.length ? parts : [{ text: value }];
+};
+var tokenizeChatMessage = (value, options) => {
+  const hyperClickableLinks = options?.hyperClickableLinks !== false;
+  const previewMediaInChat = options?.previewMediaInChat !== false;
+  if (!value) {
+    return [{ type: "text", text: "" }];
+  }
+  if (!hyperClickableLinks && !previewMediaInChat) {
+    return [{ type: "text", text: value }];
+  }
+  const parts = parseMessageLinks(value);
+  const tokens = [];
+  for (const part of parts) {
+    if (!part.url) {
+      tokens.push({ type: "text", text: part.text });
+      continue;
+    }
+    const media = previewMediaInChat ? getMediaPreviewFromUrl(part.url) : null;
+    if (media) {
+      tokens.push({
+        type: "media",
+        text: part.text,
+        url: part.url,
+        media
+      });
+      continue;
+    }
+    if (hyperClickableLinks) {
+      tokens.push({
+        type: "link",
+        text: part.text,
+        url: part.url
+      });
+      continue;
+    }
+    tokens.push({ type: "text", text: part.text });
+  }
+  return tokens.length ? tokens : [{ type: "text", text: value }];
+};
+var buildChatMessageContent = ({
+  message,
+  replaceWord,
+  filteredWordsRegex,
+  emotesRaw,
+  emotesPack,
+  origin,
+  emoteParserType,
+  isCheer,
+  storeEmotes,
+  youtubeEmotes,
+  allowParserTypes
+}) => {
+  let normalizedMessage = message ?? "";
+  if (filteredWordsRegex && typeof replaceWord === "string") {
+    normalizedMessage = normalizedMessage.replaceAll(filteredWordsRegex, replaceWord);
+  }
+  const arrFromMsg = Array.from(normalizedMessage);
+  const parserType = emoteParserType || origin;
+  const allowParserType = !allowParserTypes || allowParserTypes.includes(parserType ?? "");
+  const emotes = [];
+  const parsePluginEmotesRaw = (raw) => {
+    const text = raw?.trim?.();
+    if (!text || text[0] !== "[" && text[0] !== "{") {
+      return [];
+    }
+    let parsed;
+    try {
+      parsed = JSON.parse(text);
+    } catch {
+      return [];
+    }
+    const items = Array.isArray(parsed) ? parsed : Array.isArray(parsed?.emotes) ? parsed.emotes : [];
+    if (!items.length) {
+      return [];
+    }
+    return items.map((item) => {
+      const rawStart = Number(item?.start);
+      const rawEnd = Number(item?.end);
+      const directUrls = Array.isArray(item?.urls) ? item.urls.filter((url2) => typeof url2 === "string" && url2) : [];
+      const url = typeof item?.url === "string" ? item.url : "";
+      const urls = directUrls.length ? directUrls : url ? [url] : [];
+      if (!urls.length || !Number.isFinite(rawStart) || !Number.isFinite(rawEnd)) {
+        return null;
+      }
+      let start = Math.max(0, Math.floor(rawStart));
+      let end = Math.min(Math.floor(rawEnd) + 1, arrFromMsg.length);
+      if (start > 0 && arrFromMsg[start - 1] === ":") {
+        start -= 1;
+      }
+      if (end < arrFromMsg.length && arrFromMsg[end] === ":") {
+        end += 1;
+      }
+      if (end <= start) {
+        return null;
+      }
+      return {
+        id: item?.id || `${start}-${end}`,
+        urls,
+        start,
+        end
+      };
+    }).filter(Boolean);
+  };
+  const pluginRawEmotes = emotesRaw ? parsePluginEmotesRaw(emotesRaw) : [];
+  if (pluginRawEmotes.length) {
+    emotes.push(...pluginRawEmotes);
+  }
+  if (allowParserType && emotesRaw && !pluginRawEmotes.length && parserType === "twitch") {
+    for (const emote of emotesRaw.split("/")) {
+      if (!emote) continue;
+      const [emoteId, indicies] = emote.split(":");
+      if (!emoteId || !indicies) continue;
+      for (const indexSet of indicies.split(",")) {
+        const [start, end] = indexSet.split("-");
+        if (start === void 0 || end === void 0) continue;
+        emotes.push({
+          id: emoteId,
+          urls: [
+            `https://static-cdn.jtvnw.net/emoticons/v2/${emoteId}/default/dark/1.0`,
+            `https://static-cdn.jtvnw.net/emoticons/v2/${emoteId}/default/dark/2.0`,
+            `https://static-cdn.jtvnw.net/emoticons/v2/${emoteId}/default/dark/3.0`
+          ],
+          start: Math.max(+start, 0),
+          end: Math.min(+end + 1, normalizedMessage.length)
+        });
+      }
+    }
+  } else if (allowParserType && emotesPack && parserType === "kick") {
+    const emotesPackRecord = emotesPack;
+    Object.keys(emotesPackRecord).forEach((emoteId) => {
+      emotesPackRecord[emoteId]?.locations?.forEach((location) => {
+        const [start, end] = location.split("-");
+        if (start === void 0 || end === void 0) return;
+        let url;
+        if (emotesPackRecord[emoteId]?.type === "emote") {
+          url = `https://files.kick.com/emotes/${emoteId}/fullsize`;
+        } else {
+          url = `https://dbxmjjzl5pc1g.cloudfront.net/1065f255-473b-4a4d-a383-1282aa1ab9d5/images/emojis/${emoteId}.png`;
+        }
+        if (url) {
+          emotes.push({
+            id: emoteId,
+            urls: [url],
+            start: Math.max(+start, 0),
+            end: Math.min(+end + 1, normalizedMessage.length)
+          });
+        }
+      });
+    });
+  } else if (allowParserType && emotesPack && parserType === "discord") {
+    const emotesPackRecord = emotesPack;
+    Object.keys(emotesPackRecord).forEach((emoteId) => {
+      emotesPackRecord[emoteId]?.locations?.forEach((location) => {
+        const [start, end] = location.split("-");
+        if (start === void 0 || end === void 0) return;
+        const url = `https://cdn.discordapp.com/emojis/${emoteId}`;
+        emotes.push({
+          id: emoteId,
+          urls: [url],
+          start: Math.max(+start, 0),
+          end: Math.min(+end + 1, normalizedMessage.length)
+        });
+      });
+    });
+  }
+  let idx = -1;
+  let nextIdx = 0;
+  const separator = origin === "youtube" ? ":" : " ";
+  do {
+    nextIdx = arrFromMsg.indexOf(separator, idx + 1);
+    if (nextIdx === -1) {
+      nextIdx = arrFromMsg.length;
+    }
+    const emote = arrFromMsg.slice(idx + 1, nextIdx).join("");
+    const start = idx + 1;
+    const end = nextIdx;
+    if (emote) {
+      if (storeEmotes?.ffz?.[emote]) {
+        emotes.push({
+          id: emote,
+          urls: [storeEmotes.ffz[emote]],
+          start,
+          end
+        });
+      } else if (storeEmotes?.bttv?.[emote]) {
+        emotes.push({
+          id: emote,
+          urls: [storeEmotes.bttv[emote]],
+          start,
+          end
+        });
+      } else if (storeEmotes?.seventv?.[emote]) {
+        emotes.push({
+          id: emote,
+          urls: [storeEmotes.seventv[emote]],
+          start,
+          end
+        });
+      } else if (youtubeEmotes?.[emote]) {
+        emotes.push({
+          id: emote,
+          urls: [youtubeEmotes[emote]],
+          start,
+          end
+        });
+      } else if (isCheer && /[a-z]+\d+/gi.exec(emote)) {
+        const cheerAmount = parseInt(emote.replace(/^\D+/g, ""));
+        let roundedAmount = 1;
+        let bitColor = "#979797";
+        if (cheerAmount >= 1e4) {
+          roundedAmount = 1e4;
+          bitColor = "#f43021";
+        } else if (cheerAmount >= 5e3) {
+          roundedAmount = 5e3;
+          bitColor = "#0099fe";
+        } else if (cheerAmount >= 1e3) {
+          roundedAmount = 1e3;
+          bitColor = "#1db2a5";
+        } else if (cheerAmount >= 100) {
+          roundedAmount = 100;
+          bitColor = "#9c3ee8";
+        }
+        emotes.push({
+          id: emote,
+          type: "cheer",
+          roundedAmount,
+          cheerAmount,
+          bitColor,
+          start,
+          end
+        });
+      }
+    }
+  } while ((idx = arrFromMsg.indexOf(separator, nextIdx)) !== -1);
+  emotes.sort((x, y) => x.start - y.start);
+  let index = 0;
+  const content = [];
+  for (const emote of emotes) {
+    const slicedMsg = arrFromMsg.slice(index, emote.start).join("");
+    content.push(origin === "youtube" ? slicedMsg?.replaceAll(":", "") : slicedMsg);
+    if ("type" in emote && emote.type === "cheer") {
+      content.push({
+        id: emote.id,
+        type: "cheer",
+        roundedAmount: emote.roundedAmount,
+        cheerAmount: emote.cheerAmount,
+        bitColor: emote.bitColor,
+        key: `${emote.start}-${emote.end}`
+      });
+    } else if ("urls" in emote) {
+      content.push({
+        id: emote.id,
+        urls: emote.urls,
+        key: `${emote.start}-${emote.end}`
+      });
+    }
+    index = emote.end;
+  }
+  const subStrMsg = arrFromMsg.slice(index, arrFromMsg.length).join("");
+  content.push(origin === "youtube" ? subStrMsg?.replaceAll(":", "") : subStrMsg);
+  return content;
+};
+var resolveMediaPreviewSetting = (value, fallback) => {
+  return typeof value === "boolean" ? value : fallback;
+};
+var normalizeMediaPreviewUserLevels = (value) => {
+  if (Array.isArray(value)) {
+    const normalized = value.map((level) => String(level).trim().toLowerCase()).filter((level) => MEDIA_PREVIEW_USER_LEVEL_VALUES.includes(level));
+    return [...new Set(normalized)];
+  }
+  if (typeof value === "string") {
+    const normalized = value.split(",").map((level) => level.trim().toLowerCase()).filter((level) => MEDIA_PREVIEW_USER_LEVEL_VALUES.includes(level));
+    return [...new Set(normalized)];
+  }
+  return [];
+};
+var resolveMediaPreviewRoleSettings = (settings) => {
+  if (Array.isArray(settings.previewMediaUserLevels) || typeof settings.previewMediaUserLevels === "string") {
+    const selected = new Set(normalizeMediaPreviewUserLevels(settings.previewMediaUserLevels));
+    return {
+      previewMediaForViewers: selected.has("regular") || selected.has("follower") || selected.has("anyone"),
+      previewMediaForSubscribers: selected.has("subscribers"),
+      previewMediaForVips: selected.has("vips"),
+      previewMediaForModerators: selected.has("moderators"),
+      previewMediaForStreamer: selected.has("streamer"),
+      previewMediaForTier3: selected.has("tier3"),
+      previewMediaForTier2: selected.has("tier2"),
+      previewMediaForRegular: selected.has("regular"),
+      previewMediaForFollower: selected.has("follower"),
+      previewMediaForAnyone: selected.has("anyone")
+    };
+  }
+  const previewMediaForViewers = resolveMediaPreviewSetting(settings.previewMediaForViewers, true);
+  const previewMediaForSubscribers = resolveMediaPreviewSetting(settings.previewMediaForSubscribers, true);
+  return {
+    previewMediaForViewers,
+    previewMediaForSubscribers,
+    previewMediaForVips: resolveMediaPreviewSetting(settings.previewMediaForVips, true),
+    previewMediaForModerators: resolveMediaPreviewSetting(settings.previewMediaForModerators, true),
+    previewMediaForStreamer: resolveMediaPreviewSetting(settings.previewMediaForStreamer, true),
+    previewMediaForTier3: resolveMediaPreviewSetting(settings.previewMediaForTier3, previewMediaForSubscribers),
+    previewMediaForTier2: resolveMediaPreviewSetting(settings.previewMediaForTier2, previewMediaForSubscribers),
+    previewMediaForRegular: resolveMediaPreviewSetting(settings.previewMediaForRegular, previewMediaForViewers),
+    previewMediaForFollower: resolveMediaPreviewSetting(settings.previewMediaForFollower, previewMediaForViewers),
+    previewMediaForAnyone: resolveMediaPreviewSetting(settings.previewMediaForAnyone, previewMediaForViewers)
+  };
+};
+var getNormalizedUserLevels = (value) => {
+  if (!value || typeof value !== "object" || Array.isArray(value)) {
+    return {};
+  }
+  const normalized = {};
+  for (const [key, levelValue] of Object.entries(value)) {
+    normalized[key.toLowerCase()] = Boolean(levelValue);
+  }
+  return normalized;
+};
+var isMediaPreviewAllowedForUser = (userLevelsRaw, roleSettings) => {
+  const levels = getNormalizedUserLevels(userLevelsRaw);
+  const isStreamer = levels.isself || levels.self || levels.streamer || levels.broadcaster || levels.owner;
+  const isModerator = levels.mod || levels.moderator;
+  const isVip = levels.vip || levels.vips;
+  const isTier3 = levels.tier3 || levels.tier_3;
+  const isTier2 = levels.tier2 || levels.tier_2;
+  const isSubscriber = levels.subscriber || levels.sub || levels.member || levels.members || levels.tier1 || levels.tier_1;
+  const isRegular = levels.regular;
+  const isFollower = levels.follower || levels.followers;
+  return isStreamer && roleSettings.previewMediaForStreamer || isModerator && roleSettings.previewMediaForModerators || isVip && roleSettings.previewMediaForVips || isTier3 && roleSettings.previewMediaForTier3 || isTier2 && roleSettings.previewMediaForTier2 || isSubscriber && roleSettings.previewMediaForSubscribers || isRegular && roleSettings.previewMediaForRegular || isFollower && roleSettings.previewMediaForFollower || roleSettings.previewMediaForAnyone;
+};
+var parseExternalUrl = (url) => {
+  try {
+    return new URL(url);
+  } catch {
+    return null;
+  }
+};
+var decodeURIComponentSafe = (value) => {
+  try {
+    return decodeURIComponent(value);
+  } catch {
+    return value;
+  }
+};
+var sanitizeMediaTitle = (value) => {
+  return decodeURIComponentSafe(value.replace(/\+/g, " ")).replace(/\.[^./?#]+$/, "").replace(/[_-]+/g, " ").replace(/\s+/g, " ").trim();
+};
+var tryExtractFilename = (value) => {
+  const trimmed = value.trim();
+  if (!trimmed) {
+    return "";
+  }
+  const normalizedUrl = /^https?:\/\//i.test(trimmed) ? trimmed : trimmed.startsWith("www.") ? `https://${trimmed}` : "";
+  if (normalizedUrl) {
+    const parsed = parseExternalUrl(normalizedUrl);
+    if (parsed) {
+      const segment2 = parsed.pathname.split("/").filter(Boolean).pop() ?? "";
+      const decoded = decodeURIComponentSafe(segment2).trim();
+      if (decoded) {
+        return decoded;
+      }
+    }
+  }
+  const withoutQueryAndHash = trimmed.split(/[?#]/)[0] ?? "";
+  const segment = withoutQueryAndHash.split("/").filter(Boolean).pop() ?? "";
+  return decodeURIComponentSafe(segment).trim();
+};
+var getAudioTitleFromUrl = (url) => {
+  const parsed = parseExternalUrl(url);
+  if (!parsed) {
+    return "Audio";
+  }
+  for (const queryKey of ["title", "name", "filename", "file"]) {
+    const rawValue = parsed.searchParams.get(queryKey);
+    const filename = rawValue ? tryExtractFilename(rawValue) : "";
+    if (filename) {
+      return filename;
+    }
+  }
+  const pathFilename = tryExtractFilename(parsed.pathname);
+  if (pathFilename) {
+    return pathFilename;
+  }
+  for (const queryKey of ["title", "name", "filename", "file"]) {
+    const rawValue = parsed.searchParams.get(queryKey);
+    const normalized = rawValue ? sanitizeMediaTitle(rawValue) : "";
+    if (normalized) {
+      return normalized;
+    }
+  }
+  const pathSegment = parsed.pathname.split("/").filter(Boolean).pop() ?? "";
+  const normalizedPathTitle = sanitizeMediaTitle(pathSegment);
+  return normalizedPathTitle || "Audio";
+};
+var extractYoutubeEmbedInfo = (url) => {
+  const parsed = parseExternalUrl(url);
+  if (!parsed) {
+    return null;
+  }
+  const hostname = parsed.hostname.replace(/^www\./i, "").toLowerCase();
+  let videoId = "";
+  let isShort = false;
+  if (hostname === "youtu.be") {
+    videoId = parsed.pathname.split("/").filter(Boolean)[0] ?? "";
+  } else if (hostname.endsWith("youtube.com") || hostname === "youtube-nocookie.com") {
+    const segments = parsed.pathname.split("/").filter(Boolean);
+    if (segments[0] === "watch") {
+      videoId = parsed.searchParams.get("v") ?? "";
+    } else if (segments[0] === "shorts") {
+      videoId = segments[1] ?? "";
+      isShort = true;
+    } else if (["embed", "live", "v"].includes(segments[0] ?? "")) {
+      videoId = segments[1] ?? "";
+    }
+  }
+  const cleaned = videoId.trim();
+  return YOUTUBE_ID_REGEX.test(cleaned) ? { id: cleaned, isShort } : null;
+};
+var extractSpotifyEmbedUrl = (url) => {
+  const parsed = parseExternalUrl(url);
+  if (!parsed) {
+    return null;
+  }
+  const hostname = parsed.hostname.replace(/^www\./i, "").toLowerCase();
+  if (hostname !== "open.spotify.com" && hostname !== "play.spotify.com") {
+    return null;
+  }
+  const segments = parsed.pathname.split("/").filter(Boolean);
+  let type = segments[0] ?? "";
+  let id = segments[1] ?? "";
+  if (type === "intl" && segments.length >= 4) {
+    type = segments[2] ?? "";
+    id = segments[3] ?? "";
+  }
+  if (!SPOTIFY_EMBED_TYPES.has(type) || !id) {
+    return null;
+  }
+  return `https://open.spotify.com/embed/${type}/${id}`;
+};
+var getMediaPreviewFromUrl = (url) => {
+  if (MEDIA_IMAGE_REGEX.test(url)) {
+    return { kind: "image", src: url };
+  }
+  if (MEDIA_AUDIO_REGEX.test(url)) {
+    return { kind: "audio", src: url, title: getAudioTitleFromUrl(url) };
+  }
+  if (MEDIA_VIDEO_REGEX.test(url)) {
+    return { kind: "video", src: url };
+  }
+  const youtube = extractYoutubeEmbedInfo(url);
+  if (youtube) {
+    return { kind: youtube.isShort ? "youtubeShort" : "youtube", src: `https://www.youtube.com/embed/${youtube.id}` };
+  }
+  const spotifyEmbed = extractSpotifyEmbedUrl(url);
+  if (spotifyEmbed) {
+    return { kind: "spotify", src: spotifyEmbed };
+  }
+  return null;
+};
+var normalizeProfilePlatform = (value) => {
+  if (value === null || value === void 0) {
+    return "";
+  }
+  return String(value).trim().toLowerCase();
+};
+var normalizeProfileHandle = (value) => {
+  const text = typeof value === "string" || typeof value === "number" ? String(value).trim() : "";
+  return text.replace(/^@+/, "");
+};
+var resolvePlatformChatterProfileUrl = ({ platform, username, displayname, userId }) => {
+  const normalizedPlatform = normalizeProfilePlatform(platform);
+  if (!normalizedPlatform) {
+    return null;
+  }
+  const normalizedUsername = normalizeProfileHandle(username) || normalizeProfileHandle(displayname);
+  const normalizedUserId = typeof userId === "string" || typeof userId === "number" ? String(userId).trim() : "";
+  switch (normalizedPlatform) {
+    case "twitch":
+      return normalizedUsername ? `https://www.twitch.tv/${encodeURIComponent(normalizedUsername)}` : null;
+    case "youtube":
+    case "youtubegaming":
+      if (/^UC[\w-]+$/i.test(normalizedUserId)) {
+        return `https://www.youtube.com/channel/${encodeURIComponent(normalizedUserId)}`;
+      }
+      if (normalizedUsername) {
+        return `https://www.youtube.com/@${encodeURIComponent(normalizedUsername)}`;
+      }
+      return normalizedUserId ? `https://www.youtube.com/channel/${encodeURIComponent(normalizedUserId)}` : null;
+    case "facebook":
+      if (normalizedUserId) {
+        return `https://www.facebook.com/${encodeURIComponent(normalizedUserId)}`;
+      }
+      return normalizedUsername ? `https://www.facebook.com/${encodeURIComponent(normalizedUsername)}` : null;
+    case "tiktok":
+      return normalizedUsername ? `https://www.tiktok.com/@${encodeURIComponent(normalizedUsername)}` : null;
+    case "kick":
+      return normalizedUsername ? `https://kick.com/${encodeURIComponent(normalizedUsername)}` : null;
+    case "discord":
+      return normalizedUserId ? `https://discord.com/users/${encodeURIComponent(normalizedUserId)}` : null;
+    case "trovo":
+      return normalizedUsername ? `https://trovo.live/${encodeURIComponent(normalizedUsername)}` : null;
+    default:
+      return null;
+  }
+};
+var normalizeHttpUrl = (value) => {
+  const candidate = typeof value === "string" ? value.trim() : "";
+  if (!candidate) {
+    return null;
+  }
+  const normalized = candidate.startsWith("http://") || candidate.startsWith("https://") ? candidate : candidate.startsWith("www.") ? `https://${candidate}` : candidate;
+  const parsed = parseExternalUrl(normalized);
+  if (!parsed || !/^https?:$/i.test(parsed.protocol)) {
+    return null;
+  }
+  return normalized;
+};
+var resolveChatterProfileUrlWithResolvers = async ({
+  platform,
+  username,
+  displayname,
+  userId,
+  extraSettings,
+  resolvers
+}) => {
+  const normalizedPlatform = normalizeProfilePlatform(platform);
+  const normalizedUsername = normalizeProfileHandle(username);
+  const normalizedDisplayName = normalizeProfileHandle(displayname);
+  const normalizedUserId = typeof userId === "string" || typeof userId === "number" ? String(userId).trim() : "";
+  const payload = {
+    username: normalizedUsername || void 0,
+    displayname: normalizedDisplayName || void 0,
+    userId: normalizedUserId || void 0,
+    platform: normalizedPlatform || void 0,
+    extraSettings
+  };
+  for (const resolver of resolvers ?? []) {
+    if (typeof resolver !== "function") {
+      continue;
+    }
+    try {
+      const resolved = await resolver(payload);
+      const normalizedResolvedUrl = normalizeHttpUrl(resolved);
+      if (normalizedResolvedUrl) {
+        return normalizedResolvedUrl;
+      }
+    } catch {
+    }
+  }
+  return resolvePlatformChatterProfileUrl({
+    platform: normalizedPlatform || platform,
+    username: normalizedUsername || normalizedDisplayName,
+    userId: normalizedUserId || void 0
+  });
+};
 export {
   LSButton,
+  MEDIA_PREVIEW_USER_LEVEL_VALUES,
+  buildChatMessageContent,
   codeMirrorlinterOptions,
+  getMediaPreviewFromUrl,
+  getNormalizedUserLevels,
+  isMediaPreviewAllowedForUser,
+  normalizeHttpUrl,
+  normalizeMediaPreviewUserLevels,
+  parseMessageLinks,
+  resolveChatterProfileUrlWithResolvers,
+  resolveMediaPreviewRoleSettings,
+  resolveMediaPreviewSetting,
+  resolvePlatformChatterProfileUrl,
+  tokenizeChatMessage,
   variableCompletionOptions
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lumiastream/ui",
-	"version": "0.0.6",
+	"version": "0.1.0-beta.1",
 	"author": "Lumia Stream",
 	"license": "ISC",
 	"description": "Lumia UI Kit",
@@ -8,12 +8,13 @@
 	"type": "module",
 	"main": "dist/index.js",
 	"module": "dist/index.js",
-	"types": "dist/types/index.d.ts",
+	"types": "dist/index.d.ts",
 	"files": [
 		"dist"
 	],
 	"exports": {
 		".": {
+			"types": "./dist/index.d.ts",
 			"import": "./dist/index.js"
 		}
 	},