rothzerg-ui 0.1.0

package/dist/blocks/chat/Chat.cjs

@@ -0,0 +1,176 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+;/* empty css           */
+function getInitials(name) {
+  return name.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase();
+}
+function SendIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
+    /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
+  ] });
+}
+function PhoneIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 13a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 9.91a16 16 0 0 0 6.08 6.08l1.08-.91a2 2 0 0 1 2.1-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z" }) });
+}
+function VideoIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: "23 7 16 12 23 17 23 7" }),
+    /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "1", y: "5", width: "15", height: "14", rx: "2", ry: "2" })
+  ] });
+}
+function MoreIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "5", r: "1" }),
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "1" }),
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "19", r: "1" })
+  ] });
+}
+function AttachIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
+}
+function EmojiIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 14s1.5 2 4 2 4-2 4-2" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "9", y1: "9", x2: "9.01", y2: "9" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "15", y1: "9", x2: "15.01", y2: "9" })
+  ] });
+}
+function Chat({
+  currentUserId,
+  participant,
+  messages,
+  onSend,
+  placeholder = "Type a message…",
+  showTyping = false,
+  height = 600,
+  className = ""
+}) {
+  const [draft, setDraft] = React.useState("");
+  const messagesEndRef = React.useRef(null);
+  const textareaRef = React.useRef(null);
+  React.useEffect(() => {
+    var _a;
+    (_a = messagesEndRef.current) == null ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
+  }, [messages, showTyping]);
+  const handleSend = () => {
+    const text = draft.trim();
+    if (!text) return;
+    onSend == null ? void 0 : onSend(text);
+    setDraft("");
+    if (textareaRef.current) {
+      textareaRef.current.style.height = "auto";
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSend();
+    }
+  };
+  const handleInputChange = (e) => {
+    setDraft(e.target.value);
+    const el = e.target;
+    el.style.height = "auto";
+    el.style.height = Math.min(el.scrollHeight, 120) + "px";
+  };
+  const statusLabel = {
+    online: "Online",
+    away: "Away",
+    busy: "Busy",
+    offline: "Offline"
+  };
+  const heightVal = typeof height === "number" ? `${height}px` : height;
+  const rendered = [];
+  let lastDate = "";
+  for (const msg of messages) {
+    if (msg.date && msg.date !== lastDate) {
+      rendered.push({ type: "divider", date: msg.date });
+      lastDate = msg.date;
+    }
+    rendered.push({ type: "message", msg, isSelf: msg.senderId === currentUserId });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `rz-chat ${className}`, style: { height: heightVal }, children: [
+    participant && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__header", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-chat__header-avatar", children: participant.avatar ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: participant.avatar, alt: participant.name }) : participant.initials ?? getInitials(participant.name) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__header-info", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-chat__header-name", children: participant.name }),
+        participant.status && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__header-status", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: `rz-chat__status-dot rz-chat__status-dot--${participant.status}` }),
+          statusLabel[participant.status]
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__header-actions", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("button", { className: "rz-chat__action-btn", "aria-label": "Voice call", type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(PhoneIcon, {}) }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { className: "rz-chat__action-btn", "aria-label": "Video call", type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(VideoIcon, {}) }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { className: "rz-chat__action-btn", "aria-label": "More options", type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(MoreIcon, {}) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__messages", role: "log", "aria-live": "polite", children: [
+      rendered.map((item, i) => {
+        if (item.type === "divider") {
+          return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-chat__date-divider", children: item.date }, `d-${i}`);
+        }
+        const { msg, isSelf } = item;
+        const senderName = isSelf ? "You" : (participant == null ? void 0 : participant.name) ?? msg.senderId;
+        const senderInitials = isSelf ? "Me" : (participant == null ? void 0 : participant.initials) ?? getInitials((participant == null ? void 0 : participant.name) ?? msg.senderId);
+        return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `rz-chat__group${isSelf ? " rz-chat__group--self" : ""}`, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-chat__group-avatar", "aria-hidden": "true", children: isSelf ? senderInitials : (participant == null ? void 0 : participant.avatar) ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: participant.avatar, alt: senderName }) : senderInitials }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__group-content", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: `rz-chat__bubble${isSelf ? " rz-chat__bubble--self" : " rz-chat__bubble--other"}`,
+                "aria-label": `${senderName}: ${msg.text}`,
+                children: msg.text
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("time", { className: "rz-chat__bubble-time", children: msg.timestamp })
+          ] })
+        ] }, msg.id);
+      }),
+      showTyping && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__group", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-chat__group-avatar", "aria-hidden": "true", children: (participant == null ? void 0 : participant.initials) ?? getInitials((participant == null ? void 0 : participant.name) ?? "?") }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__typing", "aria-label": "Typing", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rz-chat__typing-dot" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rz-chat__typing-dot" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rz-chat__typing-dot" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { ref: messagesEndRef })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-chat__compose", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("button", { className: "rz-chat__compose-btn", "aria-label": "Attach file", type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(AttachIcon, {}) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-chat__compose-input-wrap", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          ref: textareaRef,
+          className: "rz-chat__compose-input",
+          placeholder,
+          value: draft,
+          onChange: handleInputChange,
+          onKeyDown: handleKeyDown,
+          rows: 1,
+          "aria-label": "Message"
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx("button", { className: "rz-chat__compose-btn", "aria-label": "Emoji", type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(EmojiIcon, {}) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          className: "rz-chat__send-btn",
+          onClick: handleSend,
+          disabled: !draft.trim(),
+          "aria-label": "Send message",
+          type: "button",
+          children: /* @__PURE__ */ jsxRuntime.jsx(SendIcon, {})
+        }
+      )
+    ] })
+  ] });
+}
+exports.Chat = Chat;
+//# sourceMappingURL=Chat.cjs.map

package/dist/blocks/chat/Chat.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chat.cjs","sources":["../../../src/blocks/chat/Chat.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport './chat.css';\n\nexport type ChatStatus = 'online' | 'away' | 'busy' | 'offline';\n\nexport interface ChatParticipant {\n  id: string;\n  name: string;\n  avatar?: string;\n  initials?: string;\n  status?: ChatStatus;\n}\n\nexport interface ChatMessage {\n  id: string;\n  senderId: string;\n  text: string;\n  timestamp: string;\n  date?: string; // for date dividers e.g. \"Today\"\n}\n\nexport interface ChatProps {\n  currentUserId: string;\n  participant?: ChatParticipant;\n  messages: ChatMessage[];\n  onSend?: (text: string) => void;\n  placeholder?: string;\n  showTyping?: boolean;\n  height?: number | string;\n  className?: string;\n}\n\nfunction getInitials(name: string) {\n  return name.split(' ').map((w) => w[0]).join('').slice(0, 2).toUpperCase();\n}\n\nfunction SendIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\" />\n      <polygon points=\"22 2 15 22 11 13 2 9 22 2\" />\n    </svg>\n  );\n}\n\nfunction PhoneIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 13a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 9.91a16 16 0 0 0 6.08 6.08l1.08-.91a2 2 0 0 1 2.1-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"/>\n    </svg>\n  );\n}\n\nfunction VideoIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <polygon points=\"23 7 16 12 23 17 23 7\"/><rect x=\"1\" y=\"5\" width=\"15\" height=\"14\" rx=\"2\" ry=\"2\"/>\n    </svg>\n  );\n}\n\nfunction MoreIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\">\n      <circle cx=\"12\" cy=\"5\" r=\"1\"/><circle cx=\"12\" cy=\"12\" r=\"1\"/><circle cx=\"12\" cy=\"19\" r=\"1\"/>\n    </svg>\n  );\n}\n\nfunction AttachIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\"/>\n    </svg>\n  );\n}\n\nfunction EmojiIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M8 14s1.5 2 4 2 4-2 4-2\"/><line x1=\"9\" y1=\"9\" x2=\"9.01\" y2=\"9\"/><line x1=\"15\" y1=\"9\" x2=\"15.01\" y2=\"9\"/>\n    </svg>\n  );\n}\n\nexport function Chat({\n  currentUserId,\n  participant,\n  messages,\n  onSend,\n  placeholder = 'Type a message…',\n  showTyping = false,\n  height = 600,\n  className = '',\n}: ChatProps) {\n  const [draft, setDraft] = useState('');\n  const messagesEndRef = useRef<HTMLDivElement>(null);\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n  useEffect(() => {\n    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });\n  }, [messages, showTyping]);\n\n  const handleSend = () => {\n    const text = draft.trim();\n    if (!text) return;\n    onSend?.(text);\n    setDraft('');\n    if (textareaRef.current) {\n      textareaRef.current.style.height = 'auto';\n    }\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === 'Enter' && !e.shiftKey) {\n      e.preventDefault();\n      handleSend();\n    }\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setDraft(e.target.value);\n    // auto-resize\n    const el = e.target;\n    el.style.height = 'auto';\n    el.style.height = Math.min(el.scrollHeight, 120) + 'px';\n  };\n\n  const statusLabel: Record<ChatStatus, string> = {\n    online: 'Online',\n    away: 'Away',\n    busy: 'Busy',\n    offline: 'Offline',\n  };\n\n  const heightVal = typeof height === 'number' ? `${height}px` : height;\n\n  // Group messages with date dividers\n  const rendered: Array<{ type: 'divider'; date: string } | { type: 'message'; msg: ChatMessage; isSelf: boolean }> = [];\n  let lastDate = '';\n  for (const msg of messages) {\n    if (msg.date && msg.date !== lastDate) {\n      rendered.push({ type: 'divider', date: msg.date });\n      lastDate = msg.date;\n    }\n    rendered.push({ type: 'message', msg, isSelf: msg.senderId === currentUserId });\n  }\n\n  return (\n    <div className={`rz-chat ${className}`} style={{ height: heightVal }}>\n      {/* Header */}\n      {participant && (\n        <div className=\"rz-chat__header\">\n          <div className=\"rz-chat__header-avatar\">\n            {participant.avatar\n              ? <img src={participant.avatar} alt={participant.name} />\n              : (participant.initials ?? getInitials(participant.name))\n            }\n          </div>\n          <div className=\"rz-chat__header-info\">\n            <div className=\"rz-chat__header-name\">{participant.name}</div>\n            {participant.status && (\n              <div className=\"rz-chat__header-status\">\n                <span className={`rz-chat__status-dot rz-chat__status-dot--${participant.status}`} />\n                {statusLabel[participant.status]}\n              </div>\n            )}\n          </div>\n          <div className=\"rz-chat__header-actions\">\n            <button className=\"rz-chat__action-btn\" aria-label=\"Voice call\" type=\"button\"><PhoneIcon /></button>\n            <button className=\"rz-chat__action-btn\" aria-label=\"Video call\" type=\"button\"><VideoIcon /></button>\n            <button className=\"rz-chat__action-btn\" aria-label=\"More options\" type=\"button\"><MoreIcon /></button>\n          </div>\n        </div>\n      )}\n\n      {/* Messages */}\n      <div className=\"rz-chat__messages\" role=\"log\" aria-live=\"polite\">\n        {rendered.map((item, i) => {\n          if (item.type === 'divider') {\n            return (\n              <div key={`d-${i}`} className=\"rz-chat__date-divider\">\n                {item.date}\n              </div>\n            );\n          }\n\n          const { msg, isSelf } = item;\n          const senderName = isSelf\n            ? 'You'\n            : (participant?.name ?? msg.senderId);\n          const senderInitials = isSelf\n            ? 'Me'\n            : (participant?.initials ?? getInitials(participant?.name ?? msg.senderId));\n\n          return (\n            <div key={msg.id} className={`rz-chat__group${isSelf ? ' rz-chat__group--self' : ''}`}>\n              <div className=\"rz-chat__group-avatar\" aria-hidden=\"true\">\n                {isSelf ? senderInitials : (\n                  participant?.avatar\n                    ? <img src={participant.avatar} alt={senderName} />\n                    : senderInitials\n                )}\n              </div>\n              <div className=\"rz-chat__group-content\">\n                <div\n                  className={`rz-chat__bubble${isSelf ? ' rz-chat__bubble--self' : ' rz-chat__bubble--other'}`}\n                  aria-label={`${senderName}: ${msg.text}`}\n                >\n                  {msg.text}\n                </div>\n                <time className=\"rz-chat__bubble-time\">{msg.timestamp}</time>\n              </div>\n            </div>\n          );\n        })}\n\n        {showTyping && (\n          <div className=\"rz-chat__group\">\n            <div className=\"rz-chat__group-avatar\" aria-hidden=\"true\">\n              {participant?.initials ?? getInitials(participant?.name ?? '?')}\n            </div>\n            <div className=\"rz-chat__typing\" aria-label=\"Typing\">\n              <span className=\"rz-chat__typing-dot\" />\n              <span className=\"rz-chat__typing-dot\" />\n              <span className=\"rz-chat__typing-dot\" />\n            </div>\n          </div>\n        )}\n\n        <div ref={messagesEndRef} />\n      </div>\n\n      {/* Compose */}\n      <div className=\"rz-chat__compose\">\n        <button className=\"rz-chat__compose-btn\" aria-label=\"Attach file\" type=\"button\"><AttachIcon /></button>\n        <div className=\"rz-chat__compose-input-wrap\">\n          <textarea\n            ref={textareaRef}\n            className=\"rz-chat__compose-input\"\n            placeholder={placeholder}\n            value={draft}\n            onChange={handleInputChange}\n            onKeyDown={handleKeyDown}\n            rows={1}\n            aria-label=\"Message\"\n          />\n        </div>\n        <button className=\"rz-chat__compose-btn\" aria-label=\"Emoji\" type=\"button\"><EmojiIcon /></button>\n        <button\n          className=\"rz-chat__send-btn\"\n          onClick={handleSend}\n          disabled={!draft.trim()}\n          aria-label=\"Send message\"\n          type=\"button\"\n        >\n          <SendIcon />\n        </button>\n      </div>\n    </div>\n  );\n}\n"],"names":["jsx","jsxs","useState","useRef","useEffect"],"mappings":"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"}

package/dist/blocks/chat/Chat.d.ts

@@ -0,0 +1,27 @@
+export type ChatStatus = 'online' | 'away' | 'busy' | 'offline';
+export interface ChatParticipant {
+    id: string;
+    name: string;
+    avatar?: string;
+    initials?: string;
+    status?: ChatStatus;
+}
+export interface ChatMessage {
+    id: string;
+    senderId: string;
+    text: string;
+    timestamp: string;
+    date?: string;
+}
+export interface ChatProps {
+    currentUserId: string;
+    participant?: ChatParticipant;
+    messages: ChatMessage[];
+    onSend?: (text: string) => void;
+    placeholder?: string;
+    showTyping?: boolean;
+    height?: number | string;
+    className?: string;
+}
+export declare function Chat({ currentUserId, participant, messages, onSend, placeholder, showTyping, height, className, }: ChatProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Chat.d.ts.map

package/dist/blocks/chat/Chat.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chat.d.ts","sourceRoot":"","sources":["../../../src/blocks/chat/Chat.tsx"],"names":[],"mappings":"AACA,OAAO,YAAY,CAAC;AAEpB,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;AAEhE,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB;AAED,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,SAAS;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuDD,wBAAgB,IAAI,CAAC,EACnB,aAAa,EACb,WAAW,EACX,QAAQ,EACR,MAAM,EACN,WAA+B,EAC/B,UAAkB,EAClB,MAAY,EACZ,SAAc,GACf,EAAE,SAAS,2CAuKX"}

package/dist/blocks/chat/Chat.js

@@ -0,0 +1,176 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+/* empty css         */
+function getInitials(name) {
+  return name.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase();
+}
+function SendIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
+    /* @__PURE__ */ jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
+  ] });
+}
+function PhoneIcon() {
+  return /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 13a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 9.91a16 16 0 0 0 6.08 6.08l1.08-.91a2 2 0 0 1 2.1-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z" }) });
+}
+function VideoIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsx("polygon", { points: "23 7 16 12 23 17 23 7" }),
+    /* @__PURE__ */ jsx("rect", { x: "1", y: "5", width: "15", height: "14", rx: "2", ry: "2" })
+  ] });
+}
+function MoreIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "5", r: "1" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "1" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "19", r: "1" })
+  ] });
+}
+function AttachIcon() {
+  return /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
+}
+function EmojiIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 14s1.5 2 4 2 4-2 4-2" }),
+    /* @__PURE__ */ jsx("line", { x1: "9", y1: "9", x2: "9.01", y2: "9" }),
+    /* @__PURE__ */ jsx("line", { x1: "15", y1: "9", x2: "15.01", y2: "9" })
+  ] });
+}
+function Chat({
+  currentUserId,
+  participant,
+  messages,
+  onSend,
+  placeholder = "Type a message…",
+  showTyping = false,
+  height = 600,
+  className = ""
+}) {
+  const [draft, setDraft] = useState("");
+  const messagesEndRef = useRef(null);
+  const textareaRef = useRef(null);
+  useEffect(() => {
+    var _a;
+    (_a = messagesEndRef.current) == null ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
+  }, [messages, showTyping]);
+  const handleSend = () => {
+    const text = draft.trim();
+    if (!text) return;
+    onSend == null ? void 0 : onSend(text);
+    setDraft("");
+    if (textareaRef.current) {
+      textareaRef.current.style.height = "auto";
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSend();
+    }
+  };
+  const handleInputChange = (e) => {
+    setDraft(e.target.value);
+    const el = e.target;
+    el.style.height = "auto";
+    el.style.height = Math.min(el.scrollHeight, 120) + "px";
+  };
+  const statusLabel = {
+    online: "Online",
+    away: "Away",
+    busy: "Busy",
+    offline: "Offline"
+  };
+  const heightVal = typeof height === "number" ? `${height}px` : height;
+  const rendered = [];
+  let lastDate = "";
+  for (const msg of messages) {
+    if (msg.date && msg.date !== lastDate) {
+      rendered.push({ type: "divider", date: msg.date });
+      lastDate = msg.date;
+    }
+    rendered.push({ type: "message", msg, isSelf: msg.senderId === currentUserId });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `rz-chat ${className}`, style: { height: heightVal }, children: [
+    participant && /* @__PURE__ */ jsxs("div", { className: "rz-chat__header", children: [
+      /* @__PURE__ */ jsx("div", { className: "rz-chat__header-avatar", children: participant.avatar ? /* @__PURE__ */ jsx("img", { src: participant.avatar, alt: participant.name }) : participant.initials ?? getInitials(participant.name) }),
+      /* @__PURE__ */ jsxs("div", { className: "rz-chat__header-info", children: [
+        /* @__PURE__ */ jsx("div", { className: "rz-chat__header-name", children: participant.name }),
+        participant.status && /* @__PURE__ */ jsxs("div", { className: "rz-chat__header-status", children: [
+          /* @__PURE__ */ jsx("span", { className: `rz-chat__status-dot rz-chat__status-dot--${participant.status}` }),
+          statusLabel[participant.status]
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "rz-chat__header-actions", children: [
+        /* @__PURE__ */ jsx("button", { className: "rz-chat__action-btn", "aria-label": "Voice call", type: "button", children: /* @__PURE__ */ jsx(PhoneIcon, {}) }),
+        /* @__PURE__ */ jsx("button", { className: "rz-chat__action-btn", "aria-label": "Video call", type: "button", children: /* @__PURE__ */ jsx(VideoIcon, {}) }),
+        /* @__PURE__ */ jsx("button", { className: "rz-chat__action-btn", "aria-label": "More options", type: "button", children: /* @__PURE__ */ jsx(MoreIcon, {}) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "rz-chat__messages", role: "log", "aria-live": "polite", children: [
+      rendered.map((item, i) => {
+        if (item.type === "divider") {
+          return /* @__PURE__ */ jsx("div", { className: "rz-chat__date-divider", children: item.date }, `d-${i}`);
+        }
+        const { msg, isSelf } = item;
+        const senderName = isSelf ? "You" : (participant == null ? void 0 : participant.name) ?? msg.senderId;
+        const senderInitials = isSelf ? "Me" : (participant == null ? void 0 : participant.initials) ?? getInitials((participant == null ? void 0 : participant.name) ?? msg.senderId);
+        return /* @__PURE__ */ jsxs("div", { className: `rz-chat__group${isSelf ? " rz-chat__group--self" : ""}`, children: [
+          /* @__PURE__ */ jsx("div", { className: "rz-chat__group-avatar", "aria-hidden": "true", children: isSelf ? senderInitials : (participant == null ? void 0 : participant.avatar) ? /* @__PURE__ */ jsx("img", { src: participant.avatar, alt: senderName }) : senderInitials }),
+          /* @__PURE__ */ jsxs("div", { className: "rz-chat__group-content", children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `rz-chat__bubble${isSelf ? " rz-chat__bubble--self" : " rz-chat__bubble--other"}`,
+                "aria-label": `${senderName}: ${msg.text}`,
+                children: msg.text
+              }
+            ),
+            /* @__PURE__ */ jsx("time", { className: "rz-chat__bubble-time", children: msg.timestamp })
+          ] })
+        ] }, msg.id);
+      }),
+      showTyping && /* @__PURE__ */ jsxs("div", { className: "rz-chat__group", children: [
+        /* @__PURE__ */ jsx("div", { className: "rz-chat__group-avatar", "aria-hidden": "true", children: (participant == null ? void 0 : participant.initials) ?? getInitials((participant == null ? void 0 : participant.name) ?? "?") }),
+        /* @__PURE__ */ jsxs("div", { className: "rz-chat__typing", "aria-label": "Typing", children: [
+          /* @__PURE__ */ jsx("span", { className: "rz-chat__typing-dot" }),
+          /* @__PURE__ */ jsx("span", { className: "rz-chat__typing-dot" }),
+          /* @__PURE__ */ jsx("span", { className: "rz-chat__typing-dot" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { ref: messagesEndRef })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "rz-chat__compose", children: [
+      /* @__PURE__ */ jsx("button", { className: "rz-chat__compose-btn", "aria-label": "Attach file", type: "button", children: /* @__PURE__ */ jsx(AttachIcon, {}) }),
+      /* @__PURE__ */ jsx("div", { className: "rz-chat__compose-input-wrap", children: /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          ref: textareaRef,
+          className: "rz-chat__compose-input",
+          placeholder,
+          value: draft,
+          onChange: handleInputChange,
+          onKeyDown: handleKeyDown,
+          rows: 1,
+          "aria-label": "Message"
+        }
+      ) }),
+      /* @__PURE__ */ jsx("button", { className: "rz-chat__compose-btn", "aria-label": "Emoji", type: "button", children: /* @__PURE__ */ jsx(EmojiIcon, {}) }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "rz-chat__send-btn",
+          onClick: handleSend,
+          disabled: !draft.trim(),
+          "aria-label": "Send message",
+          type: "button",
+          children: /* @__PURE__ */ jsx(SendIcon, {})
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  Chat
+};
+//# sourceMappingURL=Chat.js.map

package/dist/blocks/chat/Chat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chat.js","sources":["../../../src/blocks/chat/Chat.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport './chat.css';\n\nexport type ChatStatus = 'online' | 'away' | 'busy' | 'offline';\n\nexport interface ChatParticipant {\n  id: string;\n  name: string;\n  avatar?: string;\n  initials?: string;\n  status?: ChatStatus;\n}\n\nexport interface ChatMessage {\n  id: string;\n  senderId: string;\n  text: string;\n  timestamp: string;\n  date?: string; // for date dividers e.g. \"Today\"\n}\n\nexport interface ChatProps {\n  currentUserId: string;\n  participant?: ChatParticipant;\n  messages: ChatMessage[];\n  onSend?: (text: string) => void;\n  placeholder?: string;\n  showTyping?: boolean;\n  height?: number | string;\n  className?: string;\n}\n\nfunction getInitials(name: string) {\n  return name.split(' ').map((w) => w[0]).join('').slice(0, 2).toUpperCase();\n}\n\nfunction SendIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\" />\n      <polygon points=\"22 2 15 22 11 13 2 9 22 2\" />\n    </svg>\n  );\n}\n\nfunction PhoneIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 13a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 9.91a16 16 0 0 0 6.08 6.08l1.08-.91a2 2 0 0 1 2.1-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"/>\n    </svg>\n  );\n}\n\nfunction VideoIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <polygon points=\"23 7 16 12 23 17 23 7\"/><rect x=\"1\" y=\"5\" width=\"15\" height=\"14\" rx=\"2\" ry=\"2\"/>\n    </svg>\n  );\n}\n\nfunction MoreIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\">\n      <circle cx=\"12\" cy=\"5\" r=\"1\"/><circle cx=\"12\" cy=\"12\" r=\"1\"/><circle cx=\"12\" cy=\"19\" r=\"1\"/>\n    </svg>\n  );\n}\n\nfunction AttachIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\"/>\n    </svg>\n  );\n}\n\nfunction EmojiIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M8 14s1.5 2 4 2 4-2 4-2\"/><line x1=\"9\" y1=\"9\" x2=\"9.01\" y2=\"9\"/><line x1=\"15\" y1=\"9\" x2=\"15.01\" y2=\"9\"/>\n    </svg>\n  );\n}\n\nexport function Chat({\n  currentUserId,\n  participant,\n  messages,\n  onSend,\n  placeholder = 'Type a message…',\n  showTyping = false,\n  height = 600,\n  className = '',\n}: ChatProps) {\n  const [draft, setDraft] = useState('');\n  const messagesEndRef = useRef<HTMLDivElement>(null);\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n  useEffect(() => {\n    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });\n  }, [messages, showTyping]);\n\n  const handleSend = () => {\n    const text = draft.trim();\n    if (!text) return;\n    onSend?.(text);\n    setDraft('');\n    if (textareaRef.current) {\n      textareaRef.current.style.height = 'auto';\n    }\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === 'Enter' && !e.shiftKey) {\n      e.preventDefault();\n      handleSend();\n    }\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setDraft(e.target.value);\n    // auto-resize\n    const el = e.target;\n    el.style.height = 'auto';\n    el.style.height = Math.min(el.scrollHeight, 120) + 'px';\n  };\n\n  const statusLabel: Record<ChatStatus, string> = {\n    online: 'Online',\n    away: 'Away',\n    busy: 'Busy',\n    offline: 'Offline',\n  };\n\n  const heightVal = typeof height === 'number' ? `${height}px` : height;\n\n  // Group messages with date dividers\n  const rendered: Array<{ type: 'divider'; date: string } | { type: 'message'; msg: ChatMessage; isSelf: boolean }> = [];\n  let lastDate = '';\n  for (const msg of messages) {\n    if (msg.date && msg.date !== lastDate) {\n      rendered.push({ type: 'divider', date: msg.date });\n      lastDate = msg.date;\n    }\n    rendered.push({ type: 'message', msg, isSelf: msg.senderId === currentUserId });\n  }\n\n  return (\n    <div className={`rz-chat ${className}`} style={{ height: heightVal }}>\n      {/* Header */}\n      {participant && (\n        <div className=\"rz-chat__header\">\n          <div className=\"rz-chat__header-avatar\">\n            {participant.avatar\n              ? <img src={participant.avatar} alt={participant.name} />\n              : (participant.initials ?? getInitials(participant.name))\n            }\n          </div>\n          <div className=\"rz-chat__header-info\">\n            <div className=\"rz-chat__header-name\">{participant.name}</div>\n            {participant.status && (\n              <div className=\"rz-chat__header-status\">\n                <span className={`rz-chat__status-dot rz-chat__status-dot--${participant.status}`} />\n                {statusLabel[participant.status]}\n              </div>\n            )}\n          </div>\n          <div className=\"rz-chat__header-actions\">\n            <button className=\"rz-chat__action-btn\" aria-label=\"Voice call\" type=\"button\"><PhoneIcon /></button>\n            <button className=\"rz-chat__action-btn\" aria-label=\"Video call\" type=\"button\"><VideoIcon /></button>\n            <button className=\"rz-chat__action-btn\" aria-label=\"More options\" type=\"button\"><MoreIcon /></button>\n          </div>\n        </div>\n      )}\n\n      {/* Messages */}\n      <div className=\"rz-chat__messages\" role=\"log\" aria-live=\"polite\">\n        {rendered.map((item, i) => {\n          if (item.type === 'divider') {\n            return (\n              <div key={`d-${i}`} className=\"rz-chat__date-divider\">\n                {item.date}\n              </div>\n            );\n          }\n\n          const { msg, isSelf } = item;\n          const senderName = isSelf\n            ? 'You'\n            : (participant?.name ?? msg.senderId);\n          const senderInitials = isSelf\n            ? 'Me'\n            : (participant?.initials ?? getInitials(participant?.name ?? msg.senderId));\n\n          return (\n            <div key={msg.id} className={`rz-chat__group${isSelf ? ' rz-chat__group--self' : ''}`}>\n              <div className=\"rz-chat__group-avatar\" aria-hidden=\"true\">\n                {isSelf ? senderInitials : (\n                  participant?.avatar\n                    ? <img src={participant.avatar} alt={senderName} />\n                    : senderInitials\n                )}\n              </div>\n              <div className=\"rz-chat__group-content\">\n                <div\n                  className={`rz-chat__bubble${isSelf ? ' rz-chat__bubble--self' : ' rz-chat__bubble--other'}`}\n                  aria-label={`${senderName}: ${msg.text}`}\n                >\n                  {msg.text}\n                </div>\n                <time className=\"rz-chat__bubble-time\">{msg.timestamp}</time>\n              </div>\n            </div>\n          );\n        })}\n\n        {showTyping && (\n          <div className=\"rz-chat__group\">\n            <div className=\"rz-chat__group-avatar\" aria-hidden=\"true\">\n              {participant?.initials ?? getInitials(participant?.name ?? '?')}\n            </div>\n            <div className=\"rz-chat__typing\" aria-label=\"Typing\">\n              <span className=\"rz-chat__typing-dot\" />\n              <span className=\"rz-chat__typing-dot\" />\n              <span className=\"rz-chat__typing-dot\" />\n            </div>\n          </div>\n        )}\n\n        <div ref={messagesEndRef} />\n      </div>\n\n      {/* Compose */}\n      <div className=\"rz-chat__compose\">\n        <button className=\"rz-chat__compose-btn\" aria-label=\"Attach file\" type=\"button\"><AttachIcon /></button>\n        <div className=\"rz-chat__compose-input-wrap\">\n          <textarea\n            ref={textareaRef}\n            className=\"rz-chat__compose-input\"\n            placeholder={placeholder}\n            value={draft}\n            onChange={handleInputChange}\n            onKeyDown={handleKeyDown}\n            rows={1}\n            aria-label=\"Message\"\n          />\n        </div>\n        <button className=\"rz-chat__compose-btn\" aria-label=\"Emoji\" type=\"button\"><EmojiIcon /></button>\n        <button\n          className=\"rz-chat__send-btn\"\n          onClick={handleSend}\n          disabled={!draft.trim()}\n          aria-label=\"Send message\"\n          type=\"button\"\n        >\n          <SendIcon />\n        </button>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/blocks/chat/index.d.ts

@@ -0,0 +1,3 @@
+export { Chat } from './Chat';
+export type { ChatProps, ChatMessage, ChatParticipant, ChatStatus } from './Chat';
+//# sourceMappingURL=index.d.ts.map

package/dist/blocks/chat/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/chat/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC"}

package/dist/blocks/coming-soon/ComingSoon.cjs

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const cn = require("../../utils/cn.cjs");
+;/* empty css                  */
+const Button = require("../../components/button/Button.cjs");
+function useCountdown(target) {
+  const calc = () => {
+    if (!target) return { days: 0, hours: 0, minutes: 0, seconds: 0 };
+    const diff = Math.max(0, target.getTime() - Date.now());
+    return {
+      days: Math.floor(diff / 864e5),
+      hours: Math.floor(diff % 864e5 / 36e5),
+      minutes: Math.floor(diff % 36e5 / 6e4),
+      seconds: Math.floor(diff % 6e4 / 1e3)
+    };
+  };
+  const [time, setTime] = React.useState(calc);
+  React.useEffect(() => {
+    if (!target) return;
+    const id = setInterval(() => setTime(calc()), 1e3);
+    return () => clearInterval(id);
+  }, [target == null ? void 0 : target.getTime()]);
+  return time;
+}
+function pad(n) {
+  return String(n).padStart(2, "0");
+}
+function ComingSoon({
+  logo = "⚡ Rothzerg",
+  badge = "Coming soon",
+  title = "Something awesome\nis on the way",
+  description = "We're working hard to bring you something amazing. Leave your email and we'll let you know when we launch.",
+  targetDate,
+  showNotify = true,
+  onNotify,
+  socials,
+  className
+}) {
+  const { days, hours, minutes, seconds } = useCountdown(targetDate);
+  const [email, setEmail] = React.useState("");
+  const [submitted, setSubmitted] = React.useState(false);
+  async function handleNotify(e) {
+    e.preventDefault();
+    if (!email) return;
+    await (onNotify == null ? void 0 : onNotify(email));
+    setSubmitted(true);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn.cn("rz-coming-soon", className), children: [
+    logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-coming-soon__logo", children: logo }),
+    badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rz-coming-soon__badge", children: badge }),
+    /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "rz-coming-soon__title", style: { whiteSpace: "pre-line" }, children: title }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "rz-coming-soon__description", children: description }),
+    targetDate && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-coming-soon__countdown", "aria-label": "Countdown", children: [{ v: days, l: "Days" }, { v: hours, l: "Hours" }, { v: minutes, l: "Minutes" }, { v: seconds, l: "Seconds" }].map(({ v, l }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rz-coming-soon__unit", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rz-coming-soon__value", children: pad(v) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rz-coming-soon__label", children: l })
+    ] }, l)) }),
+    showNotify && (submitted ? /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: "#10b981", fontWeight: 500, marginBottom: "2rem" }, children: "✓ You're on the list!" }) : /* @__PURE__ */ jsxRuntime.jsxs("form", { className: "rz-coming-soon__notify", onSubmit: handleNotify, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "email",
+          className: "rz-coming-soon__email",
+          placeholder: "Enter your email",
+          value: email,
+          onChange: (e) => setEmail(e.target.value),
+          required: true,
+          "aria-label": "Email address"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { type: "submit", children: "Notify me" })
+    ] })),
+    socials && socials.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rz-coming-soon__social", children: socials.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx("a", { href: s.href, className: "rz-coming-soon__social-link", "aria-label": s.label, target: "_blank", rel: "noopener noreferrer", children: s.icon }, i)) })
+  ] });
+}
+exports.ComingSoon = ComingSoon;
+//# sourceMappingURL=ComingSoon.cjs.map

package/dist/blocks/coming-soon/ComingSoon.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComingSoon.cjs","sources":["../../../src/blocks/coming-soon/ComingSoon.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../../components/button';\nimport './coming-soon.css';\n\nexport interface ComingSoonSocial {\n  icon: React.ReactNode;\n  href: string;\n  label: string;\n}\n\nexport interface ComingSoonProps {\n  logo?: React.ReactNode;\n  badge?: string;\n  title?: string;\n  description?: string;\n  /** Target date for countdown */\n  targetDate?: Date;\n  showNotify?: boolean;\n  onNotify?: (email: string) => void;\n  socials?: ComingSoonSocial[];\n  className?: string;\n}\n\nfunction useCountdown(target?: Date) {\n  const calc = () => {\n    if (!target) return { days: 0, hours: 0, minutes: 0, seconds: 0 };\n    const diff = Math.max(0, target.getTime() - Date.now());\n    return {\n      days: Math.floor(diff / 86400000),\n      hours: Math.floor((diff % 86400000) / 3600000),\n      minutes: Math.floor((diff % 3600000) / 60000),\n      seconds: Math.floor((diff % 60000) / 1000),\n    };\n  };\n\n  const [time, setTime] = React.useState(calc);\n  React.useEffect(() => {\n    if (!target) return;\n    const id = setInterval(() => setTime(calc()), 1000);\n    return () => clearInterval(id);\n  }, [target?.getTime()]);\n  return time;\n}\n\nfunction pad(n: number) { return String(n).padStart(2, '0'); }\n\nexport function ComingSoon({\n  logo = '⚡ Rothzerg',\n  badge = 'Coming soon',\n  title = 'Something awesome\\nis on the way',\n  description = \"We're working hard to bring you something amazing. Leave your email and we'll let you know when we launch.\",\n  targetDate,\n  showNotify = true,\n  onNotify,\n  socials,\n  className,\n}: ComingSoonProps) {\n  const { days, hours, minutes, seconds } = useCountdown(targetDate);\n  const [email, setEmail] = React.useState('');\n  const [submitted, setSubmitted] = React.useState(false);\n\n  async function handleNotify(e: React.FormEvent) {\n    e.preventDefault();\n    if (!email) return;\n    await onNotify?.(email);\n    setSubmitted(true);\n  }\n\n  return (\n    <div className={cn('rz-coming-soon', className)}>\n      {logo && <div className=\"rz-coming-soon__logo\">{logo}</div>}\n      {badge && <span className=\"rz-coming-soon__badge\">{badge}</span>}\n      <h1 className=\"rz-coming-soon__title\" style={{ whiteSpace: 'pre-line' }}>{title}</h1>\n      <p className=\"rz-coming-soon__description\">{description}</p>\n\n      {/* Countdown */}\n      {targetDate && (\n        <div className=\"rz-coming-soon__countdown\" aria-label=\"Countdown\">\n          {[{ v: days, l: 'Days' }, { v: hours, l: 'Hours' }, { v: minutes, l: 'Minutes' }, { v: seconds, l: 'Seconds' }].map(({ v, l }) => (\n            <div key={l} className=\"rz-coming-soon__unit\">\n              <span className=\"rz-coming-soon__value\">{pad(v)}</span>\n              <span className=\"rz-coming-soon__label\">{l}</span>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* Email notify */}\n      {showNotify && (\n        submitted ? (\n          <p style={{ color: '#10b981', fontWeight: 500, marginBottom: '2rem' }}>✓ You're on the list!</p>\n        ) : (\n          <form className=\"rz-coming-soon__notify\" onSubmit={handleNotify}>\n            <input\n              type=\"email\"\n              className=\"rz-coming-soon__email\"\n              placeholder=\"Enter your email\"\n              value={email}\n              onChange={(e) => setEmail(e.target.value)}\n              required\n              aria-label=\"Email address\"\n            />\n            <Button type=\"submit\">Notify me</Button>\n          </form>\n        )\n      )}\n\n      {/* Socials */}\n      {socials && socials.length > 0 && (\n        <div className=\"rz-coming-soon__social\">\n          {socials.map((s, i) => (\n            <a key={i} href={s.href} className=\"rz-coming-soon__social-link\" aria-label={s.label} target=\"_blank\" rel=\"noopener noreferrer\">\n              {s.icon}\n            </a>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["cn","jsx","jsxs","Button"],"mappings":"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"}

package/dist/blocks/coming-soon/ComingSoon.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+export interface ComingSoonSocial {
+    icon: React.ReactNode;
+    href: string;
+    label: string;
+}
+export interface ComingSoonProps {
+    logo?: React.ReactNode;
+    badge?: string;
+    title?: string;
+    description?: string;
+    /** Target date for countdown */
+    targetDate?: Date;
+    showNotify?: boolean;
+    onNotify?: (email: string) => void;
+    socials?: ComingSoonSocial[];
+    className?: string;
+}
+export declare function ComingSoon({ logo, badge, title, description, targetDate, showNotify, onNotify, socials, className, }: ComingSoonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ComingSoon.d.ts.map

package/dist/blocks/coming-soon/ComingSoon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComingSoon.d.ts","sourceRoot":"","sources":["../../../src/blocks/coming-soon/ComingSoon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,mBAAmB,CAAC;AAE3B,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gCAAgC;IAChC,UAAU,CAAC,EAAE,IAAI,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyBD,wBAAgB,UAAU,CAAC,EACzB,IAAmB,EACnB,KAAqB,EACrB,KAA0C,EAC1C,WAA0H,EAC1H,UAAU,EACV,UAAiB,EACjB,QAAQ,EACR,OAAO,EACP,SAAS,GACV,EAAE,eAAe,2CA+DjB"}