@smwb/ui-solid 0.2.2 → 0.4.0

package/dist/headless/source/components/dataDisplay/chat/chatIconButton.jsx

@@ -0,0 +1,38 @@
+import { Show, mergeProps, splitProps } from "solid-js";
+import cn from "clsx";
+import { Ripple } from "../../base/ripple";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function ChatIconButton(props) {
+  const merged = mergeProps({ color: "default" }, props);
+  const [local, rest] = splitProps(merged, ["class", "children", "disabled", "edge", "color", "ref"]);
+  let rippleActions;
+  const onPointerDown = (event) => {
+    if (!local.disabled) rippleActions?.onRipple(event);
+  };
+  return <button
+    {...rest}
+    ref={mergeRefs(local.ref)}
+    type="button"
+    class={cn(
+      "smwb-chat-icon-button",
+      local.edge === "start" && "smwb-chat-icon-button_edge-start",
+      local.edge === "end" && "smwb-chat-icon-button_edge-end",
+      local.color === "primary" && "smwb-chat-icon-button_primary",
+      local.disabled && "smwb-chat-icon-button_disabled",
+      local.class
+    )}
+    disabled={local.disabled}
+    onPointerDown={onPointerDown}
+  >
+      {local.children}
+      <Show when={!local.disabled}>
+        <Ripple actionRef={(actions) => rippleActions = actions} center />
+      </Show>
+    </button>;
+}
+var chatIconButton_default = ChatIconButton;
+export {
+  ChatIconButton,
+  chatIconButton_default as default
+};
+//# sourceMappingURL=chatIconButton.js.map

package/dist/headless/source/components/dataDisplay/chat/chatIconButton.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatIconButton.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ChatIconButtonProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {\n  edge?: \"start\" | \"end\" | undefined;\n  color?: \"default\" | \"primary\" | undefined;\n  ref?: Ref<HTMLButtonElement>;\n}\n\nexport function ChatIconButton(props: ParentProps<ChatIconButtonProps>): JSX.Element {\n  const merged = mergeProps({ color: \"default\" as const }, props);\n  const [local, rest] = splitProps(merged, [\"class\", \"children\", \"disabled\", \"edge\", \"color\", \"ref\"]);\n\n  let rippleActions: RippleActionsRef | undefined;\n\n  const onPointerDown = (event: PointerEvent): void => {\n    if (!local.disabled) rippleActions?.onRipple(event);\n  };\n\n  return (\n    <button\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      type=\"button\"\n      class={cn(\n        \"smwb-chat-icon-button\",\n        local.edge === \"start\" && \"smwb-chat-icon-button_edge-start\",\n        local.edge === \"end\" && \"smwb-chat-icon-button_edge-end\",\n        local.color === \"primary\" && \"smwb-chat-icon-button_primary\",\n        local.disabled && \"smwb-chat-icon-button_disabled\",\n        local.class\n      )}\n      disabled={local.disabled}\n      onPointerDown={onPointerDown}\n    >\n      {local.children}\n      <Show when={!local.disabled}>\n        <Ripple actionRef={(actions) => (rippleActions = actions)} center />\n      </Show>\n    </button>\n  );\n}\n\nexport default ChatIconButton;\n"],"mappings":"AAAA,SAAqC,MAAM,YAAY,kBAAkB;AACzE,OAAO,QAAQ;AACf,SAAS,cAAqC;AAC9C,SAAS,iBAA2B;AAQ7B,SAAS,eAAe,OAAsD;AACnF,QAAM,SAAS,WAAW,EAAE,OAAO,UAAmB,GAAG,KAAK;AAC9D,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ,CAAC,SAAS,YAAY,YAAY,QAAQ,SAAS,KAAK,CAAC;AAElG,MAAI;AAEJ,QAAM,gBAAgB,CAAC,UAA8B;AACnD,QAAI,CAAC,MAAM,SAAU,gBAAe,SAAS,KAAK;AAAA,EACpD;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,KAAK;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA,MAAM,SAAS,WAAW;AAAA,MAC1B,MAAM,SAAS,SAAS;AAAA,MACxB,MAAM,UAAU,aAAa;AAAA,MAC7B,MAAM,YAAY;AAAA,MAClB,MAAM;AAAA,IACR;AAAA,IACA,UAAU,MAAM;AAAA,IAChB,eAAe;AAAA,GAChB;AAAA,OACE,MAAM,SAAS;AAAA,MAChB,CAAC,KAAK,MAAM,CAAC,MAAM,UAAU;AAAA,QAC3B,CAAC,OAAO,WAAW,CAAC,YAAa,gBAAgB,SAAU,OAAO,EAAE;AAAA,MACtE,EAFC,KAEM;AAAA,IACT,EAnBC;AAqBL;AAEA,IAAO,yBAAQ;","names":[],"file":"chatIconButton.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatLayout.jsx

@@ -0,0 +1,121 @@
+import { Show, createEffect, mergeProps, splitProps } from "solid-js";
+import cn from "clsx";
+import { Icon } from "../../base/icon";
+import { ChatIconButton } from "./chatIconButton";
+import { createControllableState } from "../../../primitives/createControllableState";
+import { Chat } from "./chat";
+const len = (value) => typeof value === "number" ? `${value}px` : value;
+const floatingAnchorForSide = (side) => side === "left" ? "bottom-left" : "bottom-right";
+function ChatLayout(props) {
+  const merged = mergeProps(
+    {
+      side: "right",
+      chatWidth: 400,
+      defaultCollapsed: false,
+      collapseAriaLabel: "Collapse chat panel",
+      expandAriaLabel: "Expand chat panel"
+    },
+    props
+  );
+  const [local, rest] = splitProps(merged, [
+    "class",
+    "contentClass",
+    "chatClass",
+    "side",
+    "chatWidth",
+    "collapsed",
+    "defaultCollapsed",
+    "onCollapsedChange",
+    "collapseAriaLabel",
+    "expandAriaLabel",
+    "floatingAnchor",
+    "chat",
+    "children",
+    "style"
+  ]);
+  const [collapsed, setCollapsed] = createControllableState({
+    value: () => local.collapsed,
+    defaultValue: local.defaultCollapsed,
+    onChange: local.onCollapsedChange
+  });
+  const [floatingOpen, setFloatingOpen] = createControllableState({ defaultValue: false });
+  createEffect(() => {
+    if (!collapsed()) {
+      setFloatingOpen(false);
+    }
+  });
+  const anchor = () => local.floatingAnchor ?? floatingAnchorForSide(local.side);
+  const dockIcon = () => local.side === "left" ? "dock_to_left" : "dock_to_right";
+  const collapseIcon = () => local.side === "left" ? "left_panel_close" : "right_panel_close";
+  const collapseButton = () => <ChatIconButton aria-label={local.collapseAriaLabel} data-testid="chat-layout-collapse" onClick={() => setCollapsed(true)}>
+      <Icon name={collapseIcon()} size={18} />
+    </ChatIconButton>;
+  const expandButton = () => <ChatIconButton aria-label={local.expandAriaLabel} data-testid="chat-layout-expand" onClick={() => setCollapsed(false)}>
+      <Icon name={dockIcon()} size={18} />
+    </ChatIconButton>;
+  const dockedHeaderActions = () => <>
+      {local.chat.headerActions}
+      {collapseButton()}
+    </>;
+  const floatingHeaderActions = () => <>
+      {local.chat.headerActions}
+      {expandButton()}
+    </>;
+  const rootStyle = () => ({
+    "--smwb-chat-layout-w": len(local.chatWidth),
+    ...typeof local.style === "object" && local.style ? local.style : {}
+  });
+  return <Show
+    when={collapsed()}
+    fallback={<div
+      {...rest}
+      class={cn("smwb-chat-layout", `smwb-chat-layout_${local.side}`, local.class)}
+      style={rootStyle()}
+      data-testid="chat-layout"
+      data-collapsed="false"
+    >
+          <Show when={local.side === "left"}>
+            <aside class="smwb-chat-layout__panel" data-testid="chat-layout-panel">
+              <Chat {...local.chat} class={local.chatClass} embedded allowedLayouts={[]} headerActions={dockedHeaderActions()} />
+            </aside>
+          </Show>
+          <div class={cn("smwb-chat-layout__content", local.contentClass)} data-testid="chat-layout-content">
+            {local.children}
+          </div>
+          <Show when={local.side === "right"}>
+            <aside class="smwb-chat-layout__panel" data-testid="chat-layout-panel">
+              <Chat {...local.chat} class={local.chatClass} embedded allowedLayouts={[]} headerActions={dockedHeaderActions()} />
+            </aside>
+          </Show>
+        </div>}
+  >
+      <div
+    {...rest}
+    class={cn("smwb-chat-layout", "smwb-chat-layout_collapsed", local.class)}
+    style={rootStyle()}
+    data-testid="chat-layout"
+    data-collapsed="true"
+  >
+        <div class={cn("smwb-chat-layout__content", local.contentClass)} data-testid="chat-layout-content">
+          {local.children}
+        </div>
+        <Chat
+    {...local.chat}
+    class={local.chatClass}
+    floatingTrigger
+    anchor={anchor()}
+    allowedLayouts={["floating"]}
+    layout="floating"
+    open={floatingOpen()}
+    onOpenChange={setFloatingOpen}
+    headerActions={floatingHeaderActions()}
+  />
+      </div>
+    </Show>;
+}
+var chatLayout_default = ChatLayout;
+export {
+  ChatLayout,
+  chatLayout_default as default
+};
+//# sourceMappingURL=chatLayout.js.map

package/dist/headless/source/components/dataDisplay/chat/chatLayout.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatLayout.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createEffect, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { ChatIconButton } from \"./chatIconButton\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { Chat, type ChatProps } from \"./chat\";\nimport type { ChatAnchor, ChatLayoutSide } from \"./types\";\n\nconst len = (value: number | string): string => (typeof value === \"number\" ? `${value}px` : value);\n\nconst floatingAnchorForSide = (side: ChatLayoutSide): ChatAnchor => (side === \"left\" ? \"bottom-left\" : \"bottom-right\");\n\nexport type ChatLayoutChatProps = Omit<\n  ChatProps,\n  | \"class\"\n  | \"embedded\"\n  | \"floatingTrigger\"\n  | \"anchor\"\n  | \"allowedLayouts\"\n  | \"layout\"\n  | \"defaultLayout\"\n  | \"open\"\n  | \"defaultOpen\"\n  | \"onOpenChange\"\n  | \"onLayoutChange\"\n>;\n\nexport interface ChatLayoutProps extends ParentProps, JSX.HTMLAttributes<HTMLDivElement> {\n  contentClass?: string | undefined;\n  chatClass?: string | undefined;\n  side?: ChatLayoutSide | undefined;\n  chatWidth?: number | string | undefined;\n  collapsed?: boolean | undefined;\n  defaultCollapsed?: boolean | undefined;\n  onCollapsedChange?: ((collapsed: boolean) => void) | undefined;\n  collapseAriaLabel?: string | undefined;\n  expandAriaLabel?: string | undefined;\n  floatingAnchor?: ChatAnchor | undefined;\n  chat: ChatLayoutChatProps;\n}\n\nexport function ChatLayout(props: ChatLayoutProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      side: \"right\" as const,\n      chatWidth: 400 as number | string,\n      defaultCollapsed: false,\n      collapseAriaLabel: \"Collapse chat panel\",\n      expandAriaLabel: \"Expand chat panel\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"contentClass\",\n    \"chatClass\",\n    \"side\",\n    \"chatWidth\",\n    \"collapsed\",\n    \"defaultCollapsed\",\n    \"onCollapsedChange\",\n    \"collapseAriaLabel\",\n    \"expandAriaLabel\",\n    \"floatingAnchor\",\n    \"chat\",\n    \"children\",\n    \"style\",\n  ]);\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.collapsed,\n    defaultValue: local.defaultCollapsed,\n    onChange: local.onCollapsedChange,\n  });\n\n  const [floatingOpen, setFloatingOpen] = createControllableState<boolean>({ defaultValue: false });\n\n  createEffect(() => {\n    if (!collapsed()) {\n      setFloatingOpen(false);\n    }\n  });\n\n  const anchor = (): ChatAnchor => local.floatingAnchor ?? floatingAnchorForSide(local.side);\n  const dockIcon = (): string => (local.side === \"left\" ? \"dock_to_left\" : \"dock_to_right\");\n  const collapseIcon = (): string => (local.side === \"left\" ? \"left_panel_close\" : \"right_panel_close\");\n\n  const collapseButton = (): JSX.Element => (\n    <ChatIconButton aria-label={local.collapseAriaLabel} data-testid=\"chat-layout-collapse\" onClick={() => setCollapsed(true)}>\n      <Icon name={collapseIcon()} size={18} />\n    </ChatIconButton>\n  );\n\n  const expandButton = (): JSX.Element => (\n    <ChatIconButton aria-label={local.expandAriaLabel} data-testid=\"chat-layout-expand\" onClick={() => setCollapsed(false)}>\n      <Icon name={dockIcon()} size={18} />\n    </ChatIconButton>\n  );\n\n  const dockedHeaderActions = (): JSX.Element => (\n    <>\n      {local.chat.headerActions}\n      {collapseButton()}\n    </>\n  );\n\n  const floatingHeaderActions = (): JSX.Element => (\n    <>\n      {local.chat.headerActions}\n      {expandButton()}\n    </>\n  );\n\n  const rootStyle = (): JSX.CSSProperties => ({\n    \"--smwb-chat-layout-w\": len(local.chatWidth),\n    ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n  });\n\n  return (\n    <Show\n      when={collapsed()}\n      fallback={\n        <div\n          {...rest}\n          class={cn(\"smwb-chat-layout\", `smwb-chat-layout_${local.side}`, local.class)}\n          style={rootStyle()}\n          data-testid=\"chat-layout\"\n          data-collapsed=\"false\"\n        >\n          <Show when={local.side === \"left\"}>\n            <aside class=\"smwb-chat-layout__panel\" data-testid=\"chat-layout-panel\">\n              <Chat {...local.chat} class={local.chatClass} embedded allowedLayouts={[]} headerActions={dockedHeaderActions()} />\n            </aside>\n          </Show>\n          <div class={cn(\"smwb-chat-layout__content\", local.contentClass)} data-testid=\"chat-layout-content\">\n            {local.children}\n          </div>\n          <Show when={local.side === \"right\"}>\n            <aside class=\"smwb-chat-layout__panel\" data-testid=\"chat-layout-panel\">\n              <Chat {...local.chat} class={local.chatClass} embedded allowedLayouts={[]} headerActions={dockedHeaderActions()} />\n            </aside>\n          </Show>\n        </div>\n      }\n    >\n      <div\n        {...rest}\n        class={cn(\"smwb-chat-layout\", \"smwb-chat-layout_collapsed\", local.class)}\n        style={rootStyle()}\n        data-testid=\"chat-layout\"\n        data-collapsed=\"true\"\n      >\n        <div class={cn(\"smwb-chat-layout__content\", local.contentClass)} data-testid=\"chat-layout-content\">\n          {local.children}\n        </div>\n        <Chat\n          {...local.chat}\n          class={local.chatClass}\n          floatingTrigger\n          anchor={anchor()}\n          allowedLayouts={[\"floating\"]}\n          layout=\"floating\"\n          open={floatingOpen()}\n          onOpenChange={setFloatingOpen}\n          headerActions={floatingHeaderActions()}\n        />\n      </div>\n    </Show>\n  );\n}\n\nexport default ChatLayout;\n"],"mappings":"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","names":[],"file":"chatLayout.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageAvatar.jsx

@@ -0,0 +1,19 @@
+import { Show } from "solid-js";
+import cn from "clsx";
+import { Avatar } from "../avatar";
+function ChatMessageAvatar(props) {
+  const enabled = () => props.enabled ?? true;
+  return <Show when={enabled()}>
+      <div class={cn("smwb-chat-message__avatar", props.class)} data-testid="chat-message-avatar">
+        <Avatar src={props.author?.avatarSrc} alt={props.author?.avatarAlt ?? props.author?.name} size="small">
+          {props.author?.name?.slice(0, 1)}
+        </Avatar>
+      </div>
+    </Show>;
+}
+var chatMessageAvatar_default = ChatMessageAvatar;
+export {
+  ChatMessageAvatar,
+  chatMessageAvatar_default as default
+};
+//# sourceMappingURL=chatMessageAvatar.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageAvatar.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageAvatar.tsx"],"sourcesContent":["import { type JSX, Show } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Avatar } from \"../avatar\";\nimport type { ChatAuthor } from \"./types\";\n\nexport interface ChatMessageAvatarProps {\n  author?: ChatAuthor | undefined;\n  enabled?: boolean | undefined;\n  class?: string | undefined;\n}\n\nexport function ChatMessageAvatar(props: ChatMessageAvatarProps): JSX.Element {\n  const enabled = (): boolean => props.enabled ?? true;\n\n  return (\n    <Show when={enabled()}>\n      <div class={cn(\"smwb-chat-message__avatar\", props.class)} data-testid=\"chat-message-avatar\">\n        <Avatar src={props.author?.avatarSrc} alt={props.author?.avatarAlt ?? props.author?.name} size=\"small\">\n          {props.author?.name?.slice(0, 1)}\n        </Avatar>\n      </div>\n    </Show>\n  );\n}\n\nexport default ChatMessageAvatar;\n"],"mappings":"AAAA,SAAmB,YAAY;AAC/B,OAAO,QAAQ;AACf,SAAS,cAAc;AAShB,SAAS,kBAAkB,OAA4C;AAC5E,QAAM,UAAU,MAAe,MAAM,WAAW;AAEhD,SACE,CAAC,KAAK,MAAM,QAAQ,GAAG;AAAA,MACrB,CAAC,IAAI,OAAO,GAAG,6BAA6B,MAAM,KAAK,GAAG,YAAY,sBAAsB;AAAA,QAC1F,CAAC,OAAO,KAAK,MAAM,QAAQ,WAAW,KAAK,MAAM,QAAQ,aAAa,MAAM,QAAQ,MAAM,KAAK,QAAQ;AAAA,WACpG,MAAM,QAAQ,MAAM,MAAM,GAAG,CAAC,EAAE;AAAA,QACnC,EAFC,OAEQ;AAAA,MACX,EAJC,IAIK;AAAA,IACR,EANC;AAQL;AAEA,IAAO,4BAAQ;","names":[],"file":"chatMessageAvatar.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageBubble.jsx

@@ -0,0 +1,56 @@
+import { Show } from "solid-js";
+import cn from "clsx";
+import { Typography } from "../typography";
+import { ChatAttachments } from "./chatAttachments";
+import { ChatMessageAvatar } from "./chatMessageAvatar";
+import { ChatMessageStatus } from "./chatMessageStatus";
+import { formatChatTimestamp } from "./utils";
+function ChatMessageBubble(props) {
+  const time = () => formatChatTimestamp(props.timestamp);
+  const deliveryStatus = () => props.status ?? props.message.status;
+  const statusToShow = () => props.showStatus && props.align === "end" ? deliveryStatus() : void 0;
+  return <div class={cn("smwb-chat-message", `smwb-chat-message_${props.align}`, props.class)} data-testid={`chat-message-${props.align}`}>
+      <Show when={props.align === "start"}>
+        <ChatMessageAvatar author={props.author} enabled={props.showAvatars} />
+      </Show>
+      <div class="smwb-chat-message__content">
+        <Show when={props.author?.name}>
+          <Typography variant="caption" class="smwb-chat-message__author">
+            {props.author?.name}
+          </Typography>
+        </Show>
+        <div class={cn("smwb-chat-message__bubble", props.bubbleClass)}>
+          <Show when={props.text}>
+            <div class="smwb-chat-message__text">{props.text}</div>
+          </Show>
+          <ChatAttachments attachments={props.attachments} enabled={props.showAttachments} />
+        </div>
+        <Show when={time() || statusToShow()}>
+          <div class="smwb-chat-message__meta" data-testid="chat-message-meta">
+            <Show when={time()}>
+              <Typography variant="caption" class="smwb-chat-message__time">
+                {time()}
+              </Typography>
+            </Show>
+            <Show when={statusToShow()}>
+              {(status) => <ChatMessageStatus
+    message={props.message}
+    status={status()}
+    statusIcons={props.statusIcons}
+    renderStatus={props.renderStatus}
+  />}
+            </Show>
+          </div>
+        </Show>
+      </div>
+      <Show when={props.align === "end"}>
+        <ChatMessageAvatar author={props.author} enabled={props.showAvatars} />
+      </Show>
+    </div>;
+}
+var chatMessageBubble_default = ChatMessageBubble;
+export {
+  ChatMessageBubble,
+  chatMessageBubble_default as default
+};
+//# sourceMappingURL=chatMessageBubble.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageBubble.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageBubble.tsx"],"sourcesContent":["import { type JSX, Show } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Typography } from \"../typography\";\nimport { ChatAttachments } from \"./chatAttachments\";\nimport { ChatMessageAvatar } from \"./chatMessageAvatar\";\nimport { ChatMessageStatus } from \"./chatMessageStatus\";\nimport type {\n  ChatAttachment,\n  ChatAuthor,\n  ChatMessage,\n  ChatMessageStatusIcons,\n  ChatMessageStatusRenderContext,\n  ChatMessageStatus as ChatMessageStatusValue,\n} from \"./types\";\nimport { formatChatTimestamp } from \"./utils\";\n\nexport interface ChatMessageBubbleProps {\n  class?: string | undefined;\n  align: \"start\" | \"end\";\n  message: ChatMessage;\n  author?: ChatAuthor | undefined;\n  text?: JSX.Element;\n  attachments?: ChatAttachment[] | undefined;\n  timestamp?: string | Date | undefined;\n  status?: ChatMessageStatusValue | undefined;\n  showAvatars?: boolean | undefined;\n  showAttachments?: boolean | undefined;\n  showStatus?: boolean | undefined;\n  statusIcons?: (ChatMessageStatusIcons & Record<string, string | undefined>) | undefined;\n  renderStatus?: ((ctx: ChatMessageStatusRenderContext) => JSX.Element) | undefined;\n  bubbleClass?: string | undefined;\n}\n\nexport function ChatMessageBubble(props: ChatMessageBubbleProps): JSX.Element {\n  const time = (): string => formatChatTimestamp(props.timestamp);\n  const deliveryStatus = (): ChatMessageStatusValue | undefined => props.status ?? props.message.status;\n  const statusToShow = (): ChatMessageStatusValue | undefined =>\n    props.showStatus && props.align === \"end\" ? deliveryStatus() : undefined;\n\n  return (\n    <div class={cn(\"smwb-chat-message\", `smwb-chat-message_${props.align}`, props.class)} data-testid={`chat-message-${props.align}`}>\n      <Show when={props.align === \"start\"}>\n        <ChatMessageAvatar author={props.author} enabled={props.showAvatars} />\n      </Show>\n      <div class=\"smwb-chat-message__content\">\n        <Show when={props.author?.name}>\n          <Typography variant=\"caption\" class=\"smwb-chat-message__author\">\n            {props.author?.name}\n          </Typography>\n        </Show>\n        <div class={cn(\"smwb-chat-message__bubble\", props.bubbleClass)}>\n          <Show when={props.text}>\n            <div class=\"smwb-chat-message__text\">{props.text}</div>\n          </Show>\n          <ChatAttachments attachments={props.attachments} enabled={props.showAttachments} />\n        </div>\n        <Show when={time() || statusToShow()}>\n          <div class=\"smwb-chat-message__meta\" data-testid=\"chat-message-meta\">\n            <Show when={time()}>\n              <Typography variant=\"caption\" class=\"smwb-chat-message__time\">\n                {time()}\n              </Typography>\n            </Show>\n            <Show when={statusToShow()}>\n              {(status) => (\n                <ChatMessageStatus\n                  message={props.message}\n                  status={status()}\n                  statusIcons={props.statusIcons}\n                  renderStatus={props.renderStatus}\n                />\n              )}\n            </Show>\n          </div>\n        </Show>\n      </div>\n      <Show when={props.align === \"end\"}>\n        <ChatMessageAvatar author={props.author} enabled={props.showAvatars} />\n      </Show>\n    </div>\n  );\n}\n\nexport default ChatMessageBubble;\n"],"mappings":"AAAA,SAAmB,YAAY;AAC/B,OAAO,QAAQ;AACf,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AASlC,SAAS,2BAA2B;AAmB7B,SAAS,kBAAkB,OAA4C;AAC5E,QAAM,OAAO,MAAc,oBAAoB,MAAM,SAAS;AAC9D,QAAM,iBAAiB,MAA0C,MAAM,UAAU,MAAM,QAAQ;AAC/F,QAAM,eAAe,MACnB,MAAM,cAAc,MAAM,UAAU,QAAQ,eAAe,IAAI;AAEjE,SACE,CAAC,IAAI,OAAO,GAAG,qBAAqB,qBAAqB,MAAM,KAAK,IAAI,MAAM,KAAK,GAAG,aAAa,gBAAgB,MAAM,KAAK,IAAI;AAAA,MAChI,CAAC,KAAK,MAAM,MAAM,UAAU,SAAS;AAAA,QACnC,CAAC,kBAAkB,QAAQ,MAAM,QAAQ,SAAS,MAAM,aAAa,EAAE;AAAA,MACzE,EAFC,KAEM;AAAA,MACP,CAAC,IAAI,MAAM,6BAA6B;AAAA,QACtC,CAAC,KAAK,MAAM,MAAM,QAAQ,MAAM;AAAA,UAC9B,CAAC,WAAW,QAAQ,UAAU,MAAM,4BAA4B;AAAA,aAC7D,MAAM,QAAQ,KAAK;AAAA,UACtB,EAFC,WAEY;AAAA,QACf,EAJC,KAIM;AAAA,QACP,CAAC,IAAI,OAAO,GAAG,6BAA6B,MAAM,WAAW,GAAG;AAAA,UAC9D,CAAC,KAAK,MAAM,MAAM,MAAM;AAAA,YACtB,CAAC,IAAI,MAAM,2BAA2B,MAAM,KAAK,EAAhD,IAAsD;AAAA,UACzD,EAFC,KAEM;AAAA,UACP,CAAC,gBAAgB,aAAa,MAAM,aAAa,SAAS,MAAM,iBAAiB,EAAE;AAAA,QACrF,EALC,IAKK;AAAA,QACN,CAAC,KAAK,MAAM,KAAK,KAAK,aAAa,GAAG;AAAA,UACpC,CAAC,IAAI,MAAM,0BAA0B,YAAY,oBAAoB;AAAA,YACnE,CAAC,KAAK,MAAM,KAAK,GAAG;AAAA,cAClB,CAAC,WAAW,QAAQ,UAAU,MAAM,0BAA0B;AAAA,iBAC3D,KAAK,EAAE;AAAA,cACV,EAFC,WAEY;AAAA,YACf,EAJC,KAIM;AAAA,YACP,CAAC,KAAK,MAAM,aAAa,GAAG;AAAA,eACzB,CAAC,WACA,CAAC;AAAA,IACC,SAAS,MAAM;AAAA,IACf,QAAQ,OAAO;AAAA,IACf,aAAa,MAAM;AAAA,IACnB,cAAc,MAAM;AAAA,EACtB,GACA;AAAA,YACJ,EATC,KASM;AAAA,UACT,EAhBC,IAgBK;AAAA,QACR,EAlBC,KAkBM;AAAA,MACT,EA/BC,IA+BK;AAAA,MACN,CAAC,KAAK,MAAM,MAAM,UAAU,OAAO;AAAA,QACjC,CAAC,kBAAkB,QAAQ,MAAM,QAAQ,SAAS,MAAM,aAAa,EAAE;AAAA,MACzE,EAFC,KAEM;AAAA,IACT,EAvCC;AAyCL;AAEA,IAAO,4BAAQ;","names":[],"file":"chatMessageBubble.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageIncoming.jsx

@@ -0,0 +1,21 @@
+import { ChatMessageBubble } from "./chatMessageBubble";
+function ChatMessageIncoming(props) {
+  return <ChatMessageBubble
+    class={props.class}
+    align="start"
+    message={props.message}
+    author={props.message.author}
+    text={props.message.text}
+    attachments={props.message.attachments}
+    timestamp={props.message.timestamp}
+    showAvatars={props.showAvatars}
+    showAttachments={props.showAttachments}
+    bubbleClass="smwb-chat-message__bubble_incoming"
+  />;
+}
+var chatMessageIncoming_default = ChatMessageIncoming;
+export {
+  ChatMessageIncoming,
+  chatMessageIncoming_default as default
+};
+//# sourceMappingURL=chatMessageIncoming.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageIncoming.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageIncoming.tsx"],"sourcesContent":["import { type JSX } from \"solid-js\";\nimport { ChatMessageBubble } from \"./chatMessageBubble\";\nimport type { ChatMessage, ChatMessageRenderContext } from \"./types\";\n\nexport interface ChatMessageIncomingProps extends ChatMessageRenderContext {\n  message: ChatMessage;\n  class?: string | undefined;\n}\n\nexport function ChatMessageIncoming(props: ChatMessageIncomingProps): JSX.Element {\n  return (\n    <ChatMessageBubble\n      class={props.class}\n      align=\"start\"\n      message={props.message}\n      author={props.message.author}\n      text={props.message.text}\n      attachments={props.message.attachments}\n      timestamp={props.message.timestamp}\n      showAvatars={props.showAvatars}\n      showAttachments={props.showAttachments}\n      bubbleClass=\"smwb-chat-message__bubble_incoming\"\n    />\n  );\n}\n\nexport default ChatMessageIncoming;\n"],"mappings":"AACA,SAAS,yBAAyB;AAQ3B,SAAS,oBAAoB,OAA8C;AAChF,SACE,CAAC;AAAA,IACC,OAAO,MAAM;AAAA,IACb,MAAM;AAAA,IACN,SAAS,MAAM;AAAA,IACf,QAAQ,MAAM,QAAQ;AAAA,IACtB,MAAM,MAAM,QAAQ;AAAA,IACpB,aAAa,MAAM,QAAQ;AAAA,IAC3B,WAAW,MAAM,QAAQ;AAAA,IACzB,aAAa,MAAM;AAAA,IACnB,iBAAiB,MAAM;AAAA,IACvB,YAAY;AAAA,EACd;AAEJ;AAEA,IAAO,8BAAQ;","names":[],"file":"chatMessageIncoming.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageItem.jsx

@@ -0,0 +1,56 @@
+import { Match, Show, Switch } from "solid-js";
+import cn from "clsx";
+import { ChatMessageIncoming } from "./chatMessageIncoming";
+import { ChatMessageOutgoing } from "./chatMessageOutgoing";
+import { ChatMessageSystem } from "./chatMessageSystem";
+function ChatMessageItem(props) {
+  const ctx = () => ({
+    showAvatars: props.showAvatars,
+    showAttachments: props.showAttachments,
+    showStatus: props.showStatus,
+    statusIcons: props.statusIcons,
+    renderStatus: props.renderStatus
+  });
+  return <Show
+    when={props.renderMessage}
+    fallback={<Switch
+      fallback={<ChatMessageIncoming
+        message={props.message}
+        showAvatars={props.showAvatars}
+        showAttachments={props.showAttachments}
+        class={props.class}
+      />}
+    >
+          <Match when={props.message.variant === "outgoing"}>
+            <ChatMessageOutgoing
+      message={props.message}
+      showAvatars={props.showAvatars}
+      showAttachments={props.showAttachments}
+      showStatus={props.showStatus}
+      statusIcons={props.statusIcons}
+      renderStatus={props.renderStatus}
+      class={props.class}
+    />
+          </Match>
+          <Match when={props.message.variant === "system"}>
+            <ChatMessageSystem message={props.message} class={props.class} />
+          </Match>
+          <Match when={props.message.variant === "custom"}>
+            <div
+      class={cn("smwb-chat-message-item", "smwb-chat-message-item_custom", props.class)}
+      data-testid="chat-message-custom"
+    >
+              {props.message.content ?? props.message.text}
+            </div>
+          </Match>
+        </Switch>}
+  >
+      {(render) => <div class={cn("smwb-chat-message-item", props.class)}>{render()(props.message, ctx())}</div>}
+    </Show>;
+}
+var chatMessageItem_default = ChatMessageItem;
+export {
+  ChatMessageItem,
+  chatMessageItem_default as default
+};
+//# sourceMappingURL=chatMessageItem.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageItem.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageItem.tsx"],"sourcesContent":["import { type JSX, Match, Show, Switch } from \"solid-js\";\nimport cn from \"clsx\";\nimport { ChatMessageIncoming } from \"./chatMessageIncoming\";\nimport { ChatMessageOutgoing } from \"./chatMessageOutgoing\";\nimport { ChatMessageSystem } from \"./chatMessageSystem\";\nimport type { ChatMessage, ChatMessageRenderContext } from \"./types\";\n\nexport interface ChatMessageItemProps extends ChatMessageRenderContext {\n  message: ChatMessage;\n  class?: string | undefined;\n  renderMessage?: ((message: ChatMessage, ctx: ChatMessageRenderContext) => JSX.Element) | undefined;\n}\n\nexport function ChatMessageItem(props: ChatMessageItemProps): JSX.Element {\n  const ctx = (): ChatMessageRenderContext => ({\n    showAvatars: props.showAvatars,\n    showAttachments: props.showAttachments,\n    showStatus: props.showStatus,\n    statusIcons: props.statusIcons,\n    renderStatus: props.renderStatus,\n  });\n\n  return (\n    <Show\n      when={props.renderMessage}\n      fallback={\n        <Switch\n          fallback={\n            <ChatMessageIncoming\n              message={props.message}\n              showAvatars={props.showAvatars}\n              showAttachments={props.showAttachments}\n              class={props.class}\n            />\n          }\n        >\n          <Match when={props.message.variant === \"outgoing\"}>\n            <ChatMessageOutgoing\n              message={props.message}\n              showAvatars={props.showAvatars}\n              showAttachments={props.showAttachments}\n              showStatus={props.showStatus}\n              statusIcons={props.statusIcons}\n              renderStatus={props.renderStatus}\n              class={props.class}\n            />\n          </Match>\n          <Match when={props.message.variant === \"system\"}>\n            <ChatMessageSystem message={props.message} class={props.class} />\n          </Match>\n          <Match when={props.message.variant === \"custom\"}>\n            <div\n              class={cn(\"smwb-chat-message-item\", \"smwb-chat-message-item_custom\", props.class)}\n              data-testid=\"chat-message-custom\"\n            >\n              {props.message.content ?? props.message.text}\n            </div>\n          </Match>\n        </Switch>\n      }\n    >\n      {(render) => <div class={cn(\"smwb-chat-message-item\", props.class)}>{render()(props.message, ctx())}</div>}\n    </Show>\n  );\n}\n\nexport default ChatMessageItem;\n"],"mappings":"AAAA,SAAmB,OAAO,MAAM,cAAc;AAC9C,OAAO,QAAQ;AACf,SAAS,2BAA2B;AACpC,SAAS,2BAA2B;AACpC,SAAS,yBAAyB;AAS3B,SAAS,gBAAgB,OAA0C;AACxE,QAAM,MAAM,OAAiC;AAAA,IAC3C,aAAa,MAAM;AAAA,IACnB,iBAAiB,MAAM;AAAA,IACvB,YAAY,MAAM;AAAA,IAClB,aAAa,MAAM;AAAA,IACnB,cAAc,MAAM;AAAA,EACtB;AAEA,SACE,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,UACE,CAAC;AAAA,MACC,UACE,CAAC;AAAA,QACC,SAAS,MAAM;AAAA,QACf,aAAa,MAAM;AAAA,QACnB,iBAAiB,MAAM;AAAA,QACvB,OAAO,MAAM;AAAA,MACf;AAAA,KAEH;AAAA,UACC,CAAC,MAAM,MAAM,MAAM,QAAQ,YAAY,YAAY;AAAA,YACjD,CAAC;AAAA,MACC,SAAS,MAAM;AAAA,MACf,aAAa,MAAM;AAAA,MACnB,iBAAiB,MAAM;AAAA,MACvB,YAAY,MAAM;AAAA,MAClB,aAAa,MAAM;AAAA,MACnB,cAAc,MAAM;AAAA,MACpB,OAAO,MAAM;AAAA,IACf,EAAE;AAAA,UACJ,EAVC,MAUO;AAAA,UACR,CAAC,MAAM,MAAM,MAAM,QAAQ,YAAY,UAAU;AAAA,YAC/C,CAAC,kBAAkB,SAAS,MAAM,SAAS,OAAO,MAAM,OAAO,EAAE;AAAA,UACnE,EAFC,MAEO;AAAA,UACR,CAAC,MAAM,MAAM,MAAM,QAAQ,YAAY,UAAU;AAAA,YAC/C,CAAC;AAAA,MACC,OAAO,GAAG,0BAA0B,iCAAiC,MAAM,KAAK;AAAA,MAChF,YAAY;AAAA,KACb;AAAA,eACE,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAAA,YAC/C,EALC,IAKK;AAAA,UACR,EAPC,MAOO;AAAA,QACV,EAhCC;AAAA,GAkCJ;AAAA,OACE,CAAC,WAAW,CAAC,IAAI,OAAO,GAAG,0BAA0B,MAAM,KAAK,IAAI,OAAO,EAAE,MAAM,SAAS,IAAI,CAAC,EAAE,EAAtF,KAA6F;AAAA,IAC7G,EAvCC;AAyCL;AAEA,IAAO,0BAAQ;","names":[],"file":"chatMessageItem.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageOutgoing.jsx

@@ -0,0 +1,25 @@
+import { ChatMessageBubble } from "./chatMessageBubble";
+function ChatMessageOutgoing(props) {
+  return <ChatMessageBubble
+    class={props.class}
+    align="end"
+    message={props.message}
+    author={props.message.author}
+    text={props.message.text}
+    attachments={props.message.attachments}
+    timestamp={props.message.timestamp}
+    status={props.message.status}
+    showAvatars={props.showAvatars}
+    showAttachments={props.showAttachments}
+    showStatus={props.showStatus}
+    statusIcons={props.statusIcons}
+    renderStatus={props.renderStatus}
+    bubbleClass="smwb-chat-message__bubble_outgoing"
+  />;
+}
+var chatMessageOutgoing_default = ChatMessageOutgoing;
+export {
+  ChatMessageOutgoing,
+  chatMessageOutgoing_default as default
+};
+//# sourceMappingURL=chatMessageOutgoing.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageOutgoing.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageOutgoing.tsx"],"sourcesContent":["import { type JSX } from \"solid-js\";\nimport { ChatMessageBubble } from \"./chatMessageBubble\";\nimport type { ChatMessage, ChatMessageRenderContext } from \"./types\";\n\nexport interface ChatMessageOutgoingProps extends ChatMessageRenderContext {\n  message: ChatMessage;\n  class?: string | undefined;\n}\n\nexport function ChatMessageOutgoing(props: ChatMessageOutgoingProps): JSX.Element {\n  return (\n    <ChatMessageBubble\n      class={props.class}\n      align=\"end\"\n      message={props.message}\n      author={props.message.author}\n      text={props.message.text}\n      attachments={props.message.attachments}\n      timestamp={props.message.timestamp}\n      status={props.message.status}\n      showAvatars={props.showAvatars}\n      showAttachments={props.showAttachments}\n      showStatus={props.showStatus}\n      statusIcons={props.statusIcons}\n      renderStatus={props.renderStatus}\n      bubbleClass=\"smwb-chat-message__bubble_outgoing\"\n    />\n  );\n}\n\nexport default ChatMessageOutgoing;\n"],"mappings":"AACA,SAAS,yBAAyB;AAQ3B,SAAS,oBAAoB,OAA8C;AAChF,SACE,CAAC;AAAA,IACC,OAAO,MAAM;AAAA,IACb,MAAM;AAAA,IACN,SAAS,MAAM;AAAA,IACf,QAAQ,MAAM,QAAQ;AAAA,IACtB,MAAM,MAAM,QAAQ;AAAA,IACpB,aAAa,MAAM,QAAQ;AAAA,IAC3B,WAAW,MAAM,QAAQ;AAAA,IACzB,QAAQ,MAAM,QAAQ;AAAA,IACtB,aAAa,MAAM;AAAA,IACnB,iBAAiB,MAAM;AAAA,IACvB,YAAY,MAAM;AAAA,IAClB,aAAa,MAAM;AAAA,IACnB,cAAc,MAAM;AAAA,IACpB,YAAY;AAAA,EACd;AAEJ;AAEA,IAAO,8BAAQ;","names":[],"file":"chatMessageOutgoing.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageSkeleton.jsx

@@ -0,0 +1,33 @@
+import { Show, mergeProps } from "solid-js";
+import cn from "clsx";
+import { Skeleton } from "../../feedBack/skeleton";
+function ChatMessageSkeleton(props) {
+  const merged = mergeProps({ align: "start", showAvatar: false, lines: 2 }, props);
+  const bubbleWidth = () => merged.align === "start" ? "72%" : "64%";
+  return <div
+    class={cn("smwb-chat-message", `smwb-chat-message_${merged.align}`, "smwb-chat-message-skeleton", merged.class)}
+    data-testid="chat-message-skeleton"
+    aria-hidden="true"
+  >
+      <Show when={merged.align === "start" && merged.showAvatar}>
+        <Skeleton variant="circular" width={32} height={32} />
+      </Show>
+      <div class="smwb-chat-message__content">
+        <div class="smwb-chat-message-skeleton__bubble">
+          <Skeleton variant="rounded" width={bubbleWidth()} height={14} />
+          <Show when={merged.lines > 1}>
+            <Skeleton variant="rounded" width="48%" height={14} />
+          </Show>
+        </div>
+      </div>
+      <Show when={merged.align === "end" && merged.showAvatar}>
+        <Skeleton variant="circular" width={32} height={32} />
+      </Show>
+    </div>;
+}
+var chatMessageSkeleton_default = ChatMessageSkeleton;
+export {
+  ChatMessageSkeleton,
+  chatMessageSkeleton_default as default
+};
+//# sourceMappingURL=chatMessageSkeleton.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageSkeleton.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageSkeleton.tsx"],"sourcesContent":["import { type JSX, Show, mergeProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Skeleton } from \"../../feedBack/skeleton\";\n\nexport interface ChatMessageSkeletonProps {\n  class?: string | undefined;\n  align?: \"start\" | \"end\" | undefined;\n  showAvatar?: boolean | undefined;\n  lines?: number | undefined;\n}\n\nexport function ChatMessageSkeleton(props: ChatMessageSkeletonProps): JSX.Element {\n  const merged = mergeProps({ align: \"start\" as const, showAvatar: false, lines: 2 }, props);\n  const bubbleWidth = (): string => (merged.align === \"start\" ? \"72%\" : \"64%\");\n\n  return (\n    <div\n      class={cn(\"smwb-chat-message\", `smwb-chat-message_${merged.align}`, \"smwb-chat-message-skeleton\", merged.class)}\n      data-testid=\"chat-message-skeleton\"\n      aria-hidden=\"true\"\n    >\n      <Show when={merged.align === \"start\" && merged.showAvatar}>\n        <Skeleton variant=\"circular\" width={32} height={32} />\n      </Show>\n      <div class=\"smwb-chat-message__content\">\n        <div class=\"smwb-chat-message-skeleton__bubble\">\n          <Skeleton variant=\"rounded\" width={bubbleWidth()} height={14} />\n          <Show when={merged.lines > 1}>\n            <Skeleton variant=\"rounded\" width=\"48%\" height={14} />\n          </Show>\n        </div>\n      </div>\n      <Show when={merged.align === \"end\" && merged.showAvatar}>\n        <Skeleton variant=\"circular\" width={32} height={32} />\n      </Show>\n    </div>\n  );\n}\n\nexport default ChatMessageSkeleton;\n"],"mappings":"AAAA,SAAmB,MAAM,kBAAkB;AAC3C,OAAO,QAAQ;AACf,SAAS,gBAAgB;AASlB,SAAS,oBAAoB,OAA8C;AAChF,QAAM,SAAS,WAAW,EAAE,OAAO,SAAkB,YAAY,OAAO,OAAO,EAAE,GAAG,KAAK;AACzF,QAAM,cAAc,MAAe,OAAO,UAAU,UAAU,QAAQ;AAEtE,SACE,CAAC;AAAA,IACC,OAAO,GAAG,qBAAqB,qBAAqB,OAAO,KAAK,IAAI,8BAA8B,OAAO,KAAK;AAAA,IAC9G,YAAY;AAAA,IACZ,YAAY;AAAA,GACb;AAAA,MACC,CAAC,KAAK,MAAM,OAAO,UAAU,WAAW,OAAO,YAAY;AAAA,QACzD,CAAC,SAAS,QAAQ,WAAW,OAAO,IAAI,QAAQ,IAAI,EAAE;AAAA,MACxD,EAFC,KAEM;AAAA,MACP,CAAC,IAAI,MAAM,6BAA6B;AAAA,QACtC,CAAC,IAAI,MAAM,qCAAqC;AAAA,UAC9C,CAAC,SAAS,QAAQ,UAAU,OAAO,YAAY,GAAG,QAAQ,IAAI,EAAE;AAAA,UAChE,CAAC,KAAK,MAAM,OAAO,QAAQ,GAAG;AAAA,YAC5B,CAAC,SAAS,QAAQ,UAAU,MAAM,MAAM,QAAQ,IAAI,EAAE;AAAA,UACxD,EAFC,KAEM;AAAA,QACT,EALC,IAKK;AAAA,MACR,EAPC,IAOK;AAAA,MACN,CAAC,KAAK,MAAM,OAAO,UAAU,SAAS,OAAO,YAAY;AAAA,QACvD,CAAC,SAAS,QAAQ,WAAW,OAAO,IAAI,QAAQ,IAAI,EAAE;AAAA,MACxD,EAFC,KAEM;AAAA,IACT,EAnBC;AAqBL;AAEA,IAAO,8BAAQ;","names":[],"file":"chatMessageSkeleton.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageStatus.jsx

@@ -0,0 +1,35 @@
+import { Show, createMemo } from "solid-js";
+import cn from "clsx";
+import { Icon } from "../../base/icon";
+import { resolveChatMessageStatusIcon, resolveChatMessageStatusLabel } from "./utils";
+function ChatMessageStatus(props) {
+  const custom = createMemo(
+    () => props.renderStatus ? props.renderStatus({ message: props.message, status: props.status }) : void 0
+  );
+  const iconName = () => resolveChatMessageStatusIcon(props.status, props.statusIcons);
+  const label = () => resolveChatMessageStatusLabel(props.status);
+  const filled = () => props.status === "read";
+  return <Show when={custom() != null} fallback={<Show when={iconName()}>
+        {(name) => <span
+    class={cn("smwb-chat-message__status", `smwb-chat-message__status_${props.status}`, props.class)}
+    data-testid="chat-message-status"
+    aria-label={label()}
+    title={label()}
+  >
+            <Icon name={name()} size={14} fill={filled() ? 1 : 0} />
+          </span>}
+      </Show>}>
+      <span
+    class={cn("smwb-chat-message__status", `smwb-chat-message__status_${props.status}`, props.class)}
+    data-testid="chat-message-status"
+  >
+        {custom()}
+      </span>
+    </Show>;
+}
+var chatMessageStatus_default = ChatMessageStatus;
+export {
+  ChatMessageStatus,
+  chatMessageStatus_default as default
+};
+//# sourceMappingURL=chatMessageStatus.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageStatus.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageStatus.tsx"],"sourcesContent":["import { type JSX, Show, createMemo } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport type {\n  ChatMessage,\n  ChatMessageStatus as ChatMessageStatusValue,\n  ChatMessageStatusIcons,\n  ChatMessageStatusRenderContext,\n} from \"./types\";\nimport { resolveChatMessageStatusIcon, resolveChatMessageStatusLabel } from \"./utils\";\n\nexport interface ChatMessageStatusProps {\n  class?: string | undefined;\n  message: ChatMessage;\n  status: ChatMessageStatusValue;\n  statusIcons?: (ChatMessageStatusIcons & Record<string, string | undefined>) | undefined;\n  renderStatus?: ((ctx: ChatMessageStatusRenderContext) => JSX.Element) | undefined;\n}\n\nexport function ChatMessageStatus(props: ChatMessageStatusProps): JSX.Element {\n  const custom = createMemo(() =>\n    props.renderStatus ? props.renderStatus({ message: props.message, status: props.status }) : undefined\n  );\n\n  const iconName = (): string | undefined => resolveChatMessageStatusIcon(props.status, props.statusIcons);\n  const label = (): string => resolveChatMessageStatusLabel(props.status);\n  const filled = (): boolean => props.status === \"read\";\n\n  return (\n    <Show when={custom() != null} fallback={\n      <Show when={iconName()}>\n        {(name) => (\n          <span\n            class={cn(\"smwb-chat-message__status\", `smwb-chat-message__status_${props.status}`, props.class)}\n            data-testid=\"chat-message-status\"\n            aria-label={label()}\n            title={label()}\n          >\n            <Icon name={name()} size={14} fill={filled() ? 1 : 0} />\n          </span>\n        )}\n      </Show>\n    }>\n      <span\n        class={cn(\"smwb-chat-message__status\", `smwb-chat-message__status_${props.status}`, props.class)}\n        data-testid=\"chat-message-status\"\n      >\n        {custom()}\n      </span>\n    </Show>\n  );\n}\n\nexport default ChatMessageStatus;\n"],"mappings":"AAAA,SAAmB,MAAM,kBAAkB;AAC3C,OAAO,QAAQ;AACf,SAAS,YAAY;AAOrB,SAAS,8BAA8B,qCAAqC;AAUrE,SAAS,kBAAkB,OAA4C;AAC5E,QAAM,SAAS;AAAA,IAAW,MACxB,MAAM,eAAe,MAAM,aAAa,EAAE,SAAS,MAAM,SAAS,QAAQ,MAAM,OAAO,CAAC,IAAI;AAAA,EAC9F;AAEA,QAAM,WAAW,MAA0B,6BAA6B,MAAM,QAAQ,MAAM,WAAW;AACvG,QAAM,QAAQ,MAAc,8BAA8B,MAAM,MAAM;AACtE,QAAM,SAAS,MAAe,MAAM,WAAW;AAE/C,SACE,CAAC,KAAK,MAAM,OAAO,KAAK,MAAM,UAC5B,CAAC,KAAK,MAAM,SAAS,GAAG;AAAA,SACrB,CAAC,SACA,CAAC;AAAA,IACC,OAAO,GAAG,6BAA6B,6BAA6B,MAAM,MAAM,IAAI,MAAM,KAAK;AAAA,IAC/F,YAAY;AAAA,IACZ,YAAY,MAAM;AAAA,IAClB,OAAO,MAAM;AAAA,GACd;AAAA,YACC,CAAC,KAAK,MAAM,KAAK,GAAG,MAAM,IAAI,MAAM,OAAO,IAAI,IAAI,GAAG,EAAE;AAAA,UAC1D,EAPC,MAQD;AAAA,MACJ,EAXC,OAYD;AAAA,MACA,CAAC;AAAA,IACC,OAAO,GAAG,6BAA6B,6BAA6B,MAAM,MAAM,IAAI,MAAM,KAAK;AAAA,IAC/F,YAAY;AAAA,GACb;AAAA,SACE,OAAO,EAAE;AAAA,MACZ,EALC,KAKM;AAAA,IACT,EApBC;AAsBL;AAEA,IAAO,4BAAQ;","names":[],"file":"chatMessageStatus.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessageSystem.jsx

@@ -0,0 +1,17 @@
+import { Show } from "solid-js";
+import cn from "clsx";
+import { Typography } from "../typography";
+function ChatMessageSystem(props) {
+  const content = () => props.message.content ?? props.message.text;
+  return <Show when={content()}>
+      <div class={cn("smwb-chat-message-system", props.class)} data-testid="chat-message-system">
+        <Typography variant="caption">{content()}</Typography>
+      </div>
+    </Show>;
+}
+var chatMessageSystem_default = ChatMessageSystem;
+export {
+  ChatMessageSystem,
+  chatMessageSystem_default as default
+};
+//# sourceMappingURL=chatMessageSystem.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessageSystem.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessageSystem.tsx"],"sourcesContent":["import { type JSX, Show } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Typography } from \"../typography\";\nimport type { ChatMessage } from \"./types\";\n\nexport interface ChatMessageSystemProps {\n  message: ChatMessage;\n  class?: string | undefined;\n}\n\nexport function ChatMessageSystem(props: ChatMessageSystemProps): JSX.Element {\n  const content = (): JSX.Element => props.message.content ?? props.message.text;\n\n  return (\n    <Show when={content()}>\n      <div class={cn(\"smwb-chat-message-system\", props.class)} data-testid=\"chat-message-system\">\n        <Typography variant=\"caption\">{content()}</Typography>\n      </div>\n    </Show>\n  );\n}\n\nexport default ChatMessageSystem;\n"],"mappings":"AAAA,SAAmB,YAAY;AAC/B,OAAO,QAAQ;AACf,SAAS,kBAAkB;AAQpB,SAAS,kBAAkB,OAA4C;AAC5E,QAAM,UAAU,MAAmB,MAAM,QAAQ,WAAW,MAAM,QAAQ;AAE1E,SACE,CAAC,KAAK,MAAM,QAAQ,GAAG;AAAA,MACrB,CAAC,IAAI,OAAO,GAAG,4BAA4B,MAAM,KAAK,GAAG,YAAY,sBAAsB;AAAA,QACzF,CAAC,WAAW,QAAQ,WAAW,QAAQ,EAAE,EAAxC,WAAqD;AAAA,MACxD,EAFC,IAEK;AAAA,IACR,EAJC;AAML;AAEA,IAAO,4BAAQ;","names":[],"file":"chatMessageSystem.jsx"}

package/dist/headless/source/components/dataDisplay/chat/chatMessages.jsx

@@ -0,0 +1,63 @@
+import { For, Show, createSignal, mergeProps } from "solid-js";
+import cn from "clsx";
+import { ChatMessageItem } from "./chatMessageItem";
+import { ChatMessageSkeleton } from "./chatMessageSkeleton";
+import { createChatInfiniteScroll } from "./useChatInfiniteScroll";
+import { createChatStickToBottom } from "./useChatStickToBottom";
+function ChatMessages(props) {
+  const merged = mergeProps({ hasMore: false, loading: false, loadingMore: false, loadingSkeletonCount: 3 }, props);
+  const [containerEl, setContainerEl] = createSignal();
+  const [sentinelEl, setSentinelEl] = createSignal();
+  createChatInfiniteScroll({
+    container: containerEl,
+    sentinel: sentinelEl,
+    onLoadMore: merged.onLoadMore,
+    hasMore: () => merged.hasMore,
+    loading: () => merged.loadingMore || merged.loading
+  });
+  createChatStickToBottom({
+    container: containerEl,
+    messages: () => merged.messages
+  });
+  const showSkeletons = () => merged.loading || merged.loadingMore;
+  const skeletonAlign = (index) => index % 2 === 0 ? "start" : "end";
+  const skeletonIndexes = () => Array.from({ length: merged.loadingSkeletonCount }, (_, index) => index);
+  return <div ref={setContainerEl} class={cn("smwb-chat-messages", merged.class)} data-testid="chat-messages">
+      <div ref={setSentinelEl} class="smwb-chat-messages__sentinel" data-testid="chat-messages-sentinel" />
+      <Show when={showSkeletons()}>
+        <div
+    class="smwb-chat-messages__skeletons"
+    data-testid="chat-messages-skeletons"
+    aria-busy="true"
+    aria-label="Loading messages"
+  >
+          <For each={skeletonIndexes()}>
+            {(index) => <ChatMessageSkeleton
+    align={skeletonAlign(index)}
+    showAvatar={merged.showAvatars}
+    lines={index % 2 === 0 ? 2 : 1}
+  />}
+          </For>
+        </div>
+      </Show>
+      <Show when={!merged.loading}>
+        <For each={merged.messages}>
+          {(message) => <ChatMessageItem
+    message={message}
+    showAvatars={merged.showAvatars}
+    showAttachments={merged.showAttachments}
+    showStatus={merged.showStatus}
+    statusIcons={merged.statusIcons}
+    renderStatus={merged.renderStatus}
+    renderMessage={merged.renderMessage}
+  />}
+        </For>
+      </Show>
+    </div>;
+}
+var chatMessages_default = ChatMessages;
+export {
+  ChatMessages,
+  chatMessages_default as default
+};
+//# sourceMappingURL=chatMessages.js.map

package/dist/headless/source/components/dataDisplay/chat/chatMessages.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/chat/chatMessages.tsx"],"sourcesContent":["import { type JSX, For, Show, createSignal, mergeProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { ChatMessageItem } from \"./chatMessageItem\";\nimport { ChatMessageSkeleton } from \"./chatMessageSkeleton\";\nimport { createChatInfiniteScroll } from \"./useChatInfiniteScroll\";\nimport { createChatStickToBottom } from \"./useChatStickToBottom\";\nimport type { ChatMessage, ChatMessageRenderContext } from \"./types\";\n\nexport interface ChatMessagesProps extends ChatMessageRenderContext {\n  class?: string | undefined;\n  messages: ChatMessage[];\n  onLoadMore?: (() => void | Promise<void>) | undefined;\n  hasMore?: boolean | undefined;\n  loading?: boolean | undefined;\n  loadingMore?: boolean | undefined;\n  loadingSkeletonCount?: number | undefined;\n  renderMessage?: ((message: ChatMessage, ctx: ChatMessageRenderContext) => JSX.Element) | undefined;\n}\n\nexport function ChatMessages(props: ChatMessagesProps): JSX.Element {\n  const merged = mergeProps({ hasMore: false, loading: false, loadingMore: false, loadingSkeletonCount: 3 }, props);\n\n  const [containerEl, setContainerEl] = createSignal<HTMLDivElement>();\n  const [sentinelEl, setSentinelEl] = createSignal<HTMLDivElement>();\n\n  createChatInfiniteScroll({\n    container: containerEl,\n    sentinel: sentinelEl,\n    onLoadMore: merged.onLoadMore,\n    hasMore: () => merged.hasMore,\n    loading: () => merged.loadingMore || merged.loading,\n  });\n\n  createChatStickToBottom({\n    container: containerEl,\n    messages: () => merged.messages,\n  });\n\n  const showSkeletons = (): boolean => merged.loading || merged.loadingMore;\n  const skeletonAlign = (index: number): \"start\" | \"end\" => (index % 2 === 0 ? \"start\" : \"end\");\n  const skeletonIndexes = (): number[] => Array.from({ length: merged.loadingSkeletonCount }, (_, index) => index);\n\n  return (\n    <div ref={setContainerEl} class={cn(\"smwb-chat-messages\", merged.class)} data-testid=\"chat-messages\">\n      <div ref={setSentinelEl} class=\"smwb-chat-messages__sentinel\" data-testid=\"chat-messages-sentinel\" />\n      <Show when={showSkeletons()}>\n        <div\n          class=\"smwb-chat-messages__skeletons\"\n          data-testid=\"chat-messages-skeletons\"\n          aria-busy=\"true\"\n          aria-label=\"Loading messages\"\n        >\n          <For each={skeletonIndexes()}>\n            {(index) => (\n              <ChatMessageSkeleton\n                align={skeletonAlign(index)}\n                showAvatar={merged.showAvatars}\n                lines={index % 2 === 0 ? 2 : 1}\n              />\n            )}\n          </For>\n        </div>\n      </Show>\n      <Show when={!merged.loading}>\n        <For each={merged.messages}>\n          {(message) => (\n            <ChatMessageItem\n              message={message}\n              showAvatars={merged.showAvatars}\n              showAttachments={merged.showAttachments}\n              showStatus={merged.showStatus}\n              statusIcons={merged.statusIcons}\n              renderStatus={merged.renderStatus}\n              renderMessage={merged.renderMessage}\n            />\n          )}\n        </For>\n      </Show>\n    </div>\n  );\n}\n\nexport default ChatMessages;\n"],"mappings":"AAAA,SAAmB,KAAK,MAAM,cAAc,kBAAkB;AAC9D,OAAO,QAAQ;AACf,SAAS,uBAAuB;AAChC,SAAS,2BAA2B;AACpC,SAAS,gCAAgC;AACzC,SAAS,+BAA+B;AAcjC,SAAS,aAAa,OAAuC;AAClE,QAAM,SAAS,WAAW,EAAE,SAAS,OAAO,SAAS,OAAO,aAAa,OAAO,sBAAsB,EAAE,GAAG,KAAK;AAEhH,QAAM,CAAC,aAAa,cAAc,IAAI,aAA6B;AACnE,QAAM,CAAC,YAAY,aAAa,IAAI,aAA6B;AAEjE,2BAAyB;AAAA,IACvB,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY,OAAO;AAAA,IACnB,SAAS,MAAM,OAAO;AAAA,IACtB,SAAS,MAAM,OAAO,eAAe,OAAO;AAAA,EAC9C,CAAC;AAED,0BAAwB;AAAA,IACtB,WAAW;AAAA,IACX,UAAU,MAAM,OAAO;AAAA,EACzB,CAAC;AAED,QAAM,gBAAgB,MAAe,OAAO,WAAW,OAAO;AAC9D,QAAM,gBAAgB,CAAC,UAAoC,QAAQ,MAAM,IAAI,UAAU;AACvF,QAAM,kBAAkB,MAAgB,MAAM,KAAK,EAAE,QAAQ,OAAO,qBAAqB,GAAG,CAAC,GAAG,UAAU,KAAK;AAE/G,SACE,CAAC,IAAI,KAAK,gBAAgB,OAAO,GAAG,sBAAsB,OAAO,KAAK,GAAG,YAAY,gBAAgB;AAAA,MACnG,CAAC,IAAI,KAAK,eAAe,MAAM,+BAA+B,YAAY,yBAAyB,EAAE;AAAA,MACrG,CAAC,KAAK,MAAM,cAAc,GAAG;AAAA,QAC3B,CAAC;AAAA,IACC,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,GACZ;AAAA,UACC,CAAC,IAAI,MAAM,gBAAgB,GAAG;AAAA,aAC3B,CAAC,UACA,CAAC;AAAA,IACC,OAAO,cAAc,KAAK;AAAA,IAC1B,YAAY,OAAO;AAAA,IACnB,OAAO,QAAQ,MAAM,IAAI,IAAI;AAAA,EAC/B,GACA;AAAA,UACJ,EARC,IAQK;AAAA,QACR,EAfC,IAeK;AAAA,MACR,EAjBC,KAiBM;AAAA,MACP,CAAC,KAAK,MAAM,CAAC,OAAO,SAAS;AAAA,QAC3B,CAAC,IAAI,MAAM,OAAO,UAAU;AAAA,WACzB,CAAC,YACA,CAAC;AAAA,IACC,SAAS;AAAA,IACT,aAAa,OAAO;AAAA,IACpB,iBAAiB,OAAO;AAAA,IACxB,YAAY,OAAO;AAAA,IACnB,aAAa,OAAO;AAAA,IACpB,cAAc,OAAO;AAAA,IACrB,eAAe,OAAO;AAAA,EACxB,GACA;AAAA,QACJ,EAZC,IAYK;AAAA,MACR,EAdC,KAcM;AAAA,IACT,EAnCC;AAqCL;AAEA,IAAO,uBAAQ;","names":[],"file":"chatMessages.jsx"}