@wix/web5-core 1.56.0

package/dist/esm/components/ui/SmartIcon.js

@@ -0,0 +1,91 @@
+import React, { useRef, useEffect, useState, useCallback } from 'react';
+import { useComponentDependencies } from '../../context/ComponentDependenciesContext.js';
+function sanitizeAndAdoptSvg(raw, container) {
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(raw, 'image/svg+xml');
+  const svg = doc.querySelector('svg');
+  if (!svg) {
+    return;
+  }
+  svg.querySelectorAll('script, foreignObject, iframe, object, embed').forEach(el => el.remove());
+  svg.querySelectorAll('*').forEach(el => {
+    for (const attr of [...el.attributes]) {
+      if (attr.name.startsWith('on')) {
+        el.removeAttribute(attr.name);
+      }
+    }
+  });
+  svg.style.width = '100%';
+  svg.style.height = 'auto';
+  container.replaceChildren(document.adoptNode(svg));
+}
+const SCOPED_CLASS = 'smart-icon-svg';
+const COLOR_STYLE = `.${SCOPED_CLASS} path:not([fill="none"]), .${SCOPED_CLASS} circle:not([fill="none"]), .${SCOPED_CLASS} rect:not([fill="none"]), .${SCOPED_CLASS} line:not([fill="none"]), .${SCOPED_CLASS} polygon:not([fill="none"]), .${SCOPED_CLASS} polyline:not([fill="none"]), .${SCOPED_CLASS} ellipse:not([fill="none"]) { fill: currentColor; }`;
+export const SmartIcon = _ref => {
+  let {
+    iconHint,
+    width = 24,
+    color,
+    label,
+    fallback
+  } = _ref;
+  const {
+    resolveIcons
+  } = useComponentDependencies();
+  const [svgContent, setSvgContent] = useState();
+  const containerRef = useRef(null);
+  const hintRef = useRef(iconHint);
+  hintRef.current = iconHint;
+  const resolve = useCallback(async () => {
+    if (!resolveIcons || !iconHint) {
+      return;
+    }
+    try {
+      const result = await resolveIcons([iconHint]);
+      if (hintRef.current === iconHint && result[iconHint]) {
+        setSvgContent(result[iconHint]);
+      }
+    } catch {
+      // Silently ignore resolution failures
+    }
+  }, [resolveIcons, iconHint]);
+  useEffect(() => {
+    resolve();
+  }, [resolve]);
+  useEffect(() => {
+    if (!svgContent || !containerRef.current) {
+      return;
+    }
+    sanitizeAndAdoptSvg(svgContent, containerRef.current);
+  }, [svgContent]);
+  if (!svgContent) {
+    if (fallback !== undefined) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, fallback);
+    }
+    return /*#__PURE__*/React.createElement("span", {
+      "aria-hidden": label ? undefined : true,
+      role: label ? 'img' : undefined,
+      "aria-label": label || undefined,
+      style: {
+        display: 'inline-block',
+        width,
+        height: width
+      }
+    });
+  }
+  return /*#__PURE__*/React.createElement("span", {
+    "aria-hidden": label ? undefined : true,
+    role: label ? 'img' : undefined,
+    "aria-label": label || undefined,
+    style: {
+      display: 'inline-block',
+      width,
+      height: 'auto',
+      color
+    }
+  }, /*#__PURE__*/React.createElement("style", null, COLOR_STYLE), /*#__PURE__*/React.createElement("span", {
+    ref: containerRef,
+    className: SCOPED_CLASS
+  }));
+};
+//# sourceMappingURL=SmartIcon.js.map

package/dist/esm/components/ui/SmartIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useRef","useEffect","useState","useCallback","useComponentDependencies","sanitizeAndAdoptSvg","raw","container","parser","DOMParser","doc","parseFromString","svg","querySelector","querySelectorAll","forEach","el","remove","attr","attributes","name","startsWith","removeAttribute","style","width","height","replaceChildren","document","adoptNode","SCOPED_CLASS","COLOR_STYLE","SmartIcon","_ref","iconHint","color","label","fallback","resolveIcons","svgContent","setSvgContent","containerRef","hintRef","current","resolve","result","undefined","createElement","Fragment","role","display","ref","className"],"sources":["../../../../src/components/ui/SmartIcon.tsx"],"sourcesContent":["import React, { useRef, useEffect, useState, useCallback } from 'react';\nimport { useComponentDependencies } from '../../context/ComponentDependenciesContext';\n\nexport interface SmartIconProps {\n  iconHint: string;\n  width?: number;\n  color?: string;\n  /**\n   * Accessible name for screen readers. Omit for decorative icons (the default).\n   */\n  label?: string;\n  /**\n   * Rendered in place of the icon whenever a resolved SVG is not (yet) available:\n   * no resolver in context, no `iconHint`, resolution still pending, or resolution\n   * returned nothing / errored. Lets callers guarantee a meaningful icon always\n   * shows (e.g. a bundled fallback icon) instead of a blank placeholder box.\n   */\n  fallback?: React.ReactNode;\n}\n\nfunction sanitizeAndAdoptSvg(raw: string, container: HTMLElement): void {\n  const parser = new DOMParser();\n  const doc = parser.parseFromString(raw, 'image/svg+xml');\n  const svg = doc.querySelector('svg');\n  if (!svg) {\n    return;\n  }\n\n  svg\n    .querySelectorAll('script, foreignObject, iframe, object, embed')\n    .forEach((el) => el.remove());\n  svg.querySelectorAll('*').forEach((el) => {\n    for (const attr of [...el.attributes]) {\n      if (attr.name.startsWith('on')) {\n        el.removeAttribute(attr.name);\n      }\n    }\n  });\n\n  svg.style.width = '100%';\n  svg.style.height = 'auto';\n\n  container.replaceChildren(document.adoptNode(svg));\n}\n\nconst SCOPED_CLASS = 'smart-icon-svg';\nconst COLOR_STYLE = `.${SCOPED_CLASS} path:not([fill=\"none\"]), .${SCOPED_CLASS} circle:not([fill=\"none\"]), .${SCOPED_CLASS} rect:not([fill=\"none\"]), .${SCOPED_CLASS} line:not([fill=\"none\"]), .${SCOPED_CLASS} polygon:not([fill=\"none\"]), .${SCOPED_CLASS} polyline:not([fill=\"none\"]), .${SCOPED_CLASS} ellipse:not([fill=\"none\"]) { fill: currentColor; }`;\n\nexport const SmartIcon: React.FC<SmartIconProps> = ({\n  iconHint,\n  width = 24,\n  color,\n  label,\n  fallback,\n}) => {\n  const { resolveIcons } = useComponentDependencies();\n  const [svgContent, setSvgContent] = useState<string | undefined>();\n  const containerRef = useRef<HTMLSpanElement>(null);\n  const hintRef = useRef(iconHint);\n  hintRef.current = iconHint;\n\n  const resolve = useCallback(async () => {\n    if (!resolveIcons || !iconHint) {\n      return;\n    }\n    try {\n      const result = await resolveIcons([iconHint]);\n      if (hintRef.current === iconHint && result[iconHint]) {\n        setSvgContent(result[iconHint]);\n      }\n    } catch {\n      // Silently ignore resolution failures\n    }\n  }, [resolveIcons, iconHint]);\n\n  useEffect(() => {\n    resolve();\n  }, [resolve]);\n\n  useEffect(() => {\n    if (!svgContent || !containerRef.current) {\n      return;\n    }\n    sanitizeAndAdoptSvg(svgContent, containerRef.current);\n  }, [svgContent]);\n\n  if (!svgContent) {\n    if (fallback !== undefined) {\n      return <>{fallback}</>;\n    }\n    return (\n      <span\n        aria-hidden={label ? undefined : true}\n        role={label ? 'img' : undefined}\n        aria-label={label || undefined}\n        style={{ display: 'inline-block', width, height: width }}\n      />\n    );\n  }\n\n  return (\n    <span\n      aria-hidden={label ? undefined : true}\n      role={label ? 'img' : undefined}\n      aria-label={label || undefined}\n      style={{ display: 'inline-block', width, height: 'auto', color }}\n    >\n      <style>{COLOR_STYLE}</style>\n      <span ref={containerRef} className={SCOPED_CLASS} />\n    </span>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/ui/UnifiedLink.js

@@ -0,0 +1,105 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { isWeb5AskUrl, isWeb5ActionUrl } from '../../types/link-types.js';
+import { validateLinkUrl } from '../../utils/entityLinkParser.js';
+import { cn } from '../../lib/utils.js';
+import { useWeb5Link } from '../../hooks/useWeb5Link.js';
+import { useComponentDependencies } from '../../context/ComponentDependenciesContext.js';
+import { DIAGNOSTIC_TYPES } from '../../component/diagnosticTypes.js';
+import { ArrowUpIcon } from './icons/ArrowUpIcon.js';
+import { ArrowTopRightIcon } from './icons/ArrowTopRightIcon.js';
+export let LinkType = /*#__PURE__*/function (LinkType) {
+  LinkType["ASK"] = "ask";
+  LinkType["ACTION"] = "action";
+  LinkType["NAVIGATE"] = "navigate";
+  return LinkType;
+}({});
+const ARROW_BY_TYPE = {
+  [LinkType.ASK]: ArrowUpIcon,
+  [LinkType.ACTION]: ArrowTopRightIcon,
+  [LinkType.NAVIGATE]: ArrowUpIcon
+};
+export function detectLinkType(href) {
+  if (!href) {
+    return LinkType.NAVIGATE;
+  }
+  if (isWeb5AskUrl(href)) {
+    return LinkType.ASK;
+  }
+  if (isWeb5ActionUrl(href)) {
+    return LinkType.ACTION;
+  }
+  return LinkType.NAVIGATE;
+}
+export function UnifiedLink(_ref) {
+  let {
+    href,
+    linkType: linkTypeProp,
+    variant = 'primary',
+    active = false,
+    hideArrow,
+    className,
+    children,
+    onClick,
+    ...props
+  } = _ref;
+  const {
+    handleLinkClick,
+    resolveUrl
+  } = useWeb5Link();
+  const {
+    reportDiagnostic
+  } = useComponentDependencies();
+  if (!validateLinkUrl(href)) {
+    reportDiagnostic == null || reportDiagnostic(DIAGNOSTIC_TYPES.BROKEN_WEB5_LINK, 'unifiedLink', `link rejected: "${href}"`);
+    return null;
+  }
+  const resolvedHref = resolveUrl(href) ?? href;
+  const linkType = linkTypeProp ?? detectLinkType(href);
+  const ArrowIcon = ARROW_BY_TYPE[linkType];
+  const showArrow = !hideArrow && variant !== 'inline';
+
+  // web5:// hrefs must never reach the browser — Safari iOS attempts custom-scheme
+  // navigation before JS fires, producing an "address is invalid" error.
+  const safeHref = href != null && href.startsWith('web5://') ? '#' : resolvedHref;
+  const handleClick = e => {
+    onClick == null || onClick(e);
+    if (!e.defaultPrevented && resolvedHref) {
+      handleLinkClick(e, resolvedHref);
+    }
+  };
+  if (variant === 'inline') {
+    return /*#__PURE__*/React.createElement("a", _extends({
+      href: safeHref,
+      className: cn('text-primary underline underline-offset-4 hover:text-primary/80 cursor-pointer', className),
+      onClick: handleClick
+    }, props), children);
+  }
+  if (variant === 'secondary') {
+    return /*#__PURE__*/React.createElement("a", _extends({
+      href: safeHref,
+      className: cn('inline w-fit cursor-pointer', 'text-sm leading-[18px] text-text-accent', className),
+      onClick: handleClick
+    }, props), children, showArrow && /*#__PURE__*/React.createElement("span", {
+      className: "inline whitespace-nowrap"
+    }, "\xA0", /*#__PURE__*/React.createElement(ArrowIcon, {
+      className: "ml-0.5 inline-block size-4 align-middle"
+    })));
+  }
+
+  // Primary variant — pill with arrow circle and hover overlay
+  return /*#__PURE__*/React.createElement("a", _extends({
+    href: safeHref,
+    className: cn('group relative flex md:w-fit md:max-w-[500px] items-center justify-between rounded-[80px] pl-5 pr-[3px] py-[3px] gap-2 cursor-pointer overflow-hidden', 'text-sm leading-[14px]', active ? 'bg-text-accent text-white' : 'bg-white border border-text-accent/30 text-text-accent', className),
+    onClick: handleClick
+  }, props), /*#__PURE__*/React.createElement("span", {
+    className: cn('absolute inset-[3px] rounded-[80px] pointer-events-none', 'origin-right scale-x-0 group-hover:scale-x-100', 'transition-transform duration-300 ease-out', active ? 'bg-text-accent-hover' : 'bg-text-accent/10')
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "relative z-[1] min-w-0 py-[10px] truncate"
+  }, children), showArrow && /*#__PURE__*/React.createElement("span", {
+    className: cn('relative z-[1] flex items-center justify-center rounded-full shrink-0', 'size-[34px] p-2.5', active ? 'bg-text-accent-hover' : 'bg-text-accent/10')
+  }, /*#__PURE__*/React.createElement(ArrowIcon, {
+    className: "size-4"
+  })));
+}
+//# sourceMappingURL=UnifiedLink.js.map

package/dist/esm/components/ui/UnifiedLink.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","isWeb5AskUrl","isWeb5ActionUrl","validateLinkUrl","cn","useWeb5Link","useComponentDependencies","DIAGNOSTIC_TYPES","ArrowUpIcon","ArrowTopRightIcon","LinkType","ARROW_BY_TYPE","ASK","ACTION","NAVIGATE","detectLinkType","href","UnifiedLink","_ref","linkType","linkTypeProp","variant","active","hideArrow","className","children","onClick","props","handleLinkClick","resolveUrl","reportDiagnostic","BROKEN_WEB5_LINK","resolvedHref","ArrowIcon","showArrow","safeHref","startsWith","handleClick","e","defaultPrevented","createElement","_extends"],"sources":["../../../../src/components/ui/UnifiedLink.tsx"],"sourcesContent":["import React from 'react';\nimport { isWeb5AskUrl, isWeb5ActionUrl } from '../../types/link-types';\nimport { validateLinkUrl } from '../../utils/entityLinkParser';\nimport { cn } from '../../lib/utils';\nimport { useWeb5Link } from '../../hooks/useWeb5Link';\nimport { useComponentDependencies } from '../../context/ComponentDependenciesContext';\nimport { DIAGNOSTIC_TYPES } from '../../component/diagnosticTypes';\nimport { ArrowUpIcon } from './icons/ArrowUpIcon';\nimport { ArrowTopRightIcon } from './icons/ArrowTopRightIcon';\n\nexport enum LinkType {\n  ASK = 'ask',\n  ACTION = 'action',\n  NAVIGATE = 'navigate',\n}\n\nexport type LinkVariant = 'primary' | 'secondary' | 'inline';\n\nexport interface UnifiedLinkProps\n  extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n  href?: string;\n  /** Override auto-detected link type */\n  linkType?: LinkType;\n  /** Visual variant */\n  variant?: LinkVariant;\n  /** Whether this is the first/active item (dark bg). Only applies to primary variant. */\n  active?: boolean;\n  /** Hide the arrow icon */\n  hideArrow?: boolean;\n  children: React.ReactNode;\n}\n\nconst ARROW_BY_TYPE: Record<\n  LinkType,\n  React.FC<React.SVGProps<SVGSVGElement>>\n> = {\n  [LinkType.ASK]: ArrowUpIcon,\n  [LinkType.ACTION]: ArrowTopRightIcon,\n  [LinkType.NAVIGATE]: ArrowUpIcon,\n};\n\nexport function detectLinkType(href: string | undefined): LinkType {\n  if (!href) {\n    return LinkType.NAVIGATE;\n  }\n  if (isWeb5AskUrl(href)) {\n    return LinkType.ASK;\n  }\n  if (isWeb5ActionUrl(href)) {\n    return LinkType.ACTION;\n  }\n  return LinkType.NAVIGATE;\n}\n\nexport function UnifiedLink({\n  href,\n  linkType: linkTypeProp,\n  variant = 'primary',\n  active = false,\n  hideArrow,\n  className,\n  children,\n  onClick,\n  ...props\n}: UnifiedLinkProps) {\n  const { handleLinkClick, resolveUrl } = useWeb5Link();\n  const { reportDiagnostic } = useComponentDependencies();\n\n  if (!validateLinkUrl(href)) {\n    reportDiagnostic?.(\n      DIAGNOSTIC_TYPES.BROKEN_WEB5_LINK,\n      'unifiedLink',\n      `link rejected: \"${href}\"`,\n    );\n    return null;\n  }\n\n  const resolvedHref = resolveUrl(href) ?? href;\n  const linkType = linkTypeProp ?? detectLinkType(href);\n  const ArrowIcon = ARROW_BY_TYPE[linkType];\n  const showArrow = !hideArrow && variant !== 'inline';\n\n  // web5:// hrefs must never reach the browser — Safari iOS attempts custom-scheme\n  // navigation before JS fires, producing an \"address is invalid\" error.\n  const safeHref = href?.startsWith('web5://') ? '#' : resolvedHref;\n\n  const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n    onClick?.(e);\n    if (!e.defaultPrevented && resolvedHref) {\n      handleLinkClick(e, resolvedHref);\n    }\n  };\n\n  if (variant === 'inline') {\n    return (\n      <a\n        href={safeHref}\n        className={cn(\n          'text-primary underline underline-offset-4 hover:text-primary/80 cursor-pointer',\n          className,\n        )}\n        onClick={handleClick}\n        {...props}\n      >\n        {children}\n      </a>\n    );\n  }\n\n  if (variant === 'secondary') {\n    return (\n      <a\n        href={safeHref}\n        className={cn(\n          'inline w-fit cursor-pointer',\n          'text-sm leading-[18px] text-text-accent',\n          className,\n        )}\n        onClick={handleClick}\n        {...props}\n      >\n        {children}\n        {showArrow && (\n          <span className=\"inline whitespace-nowrap\">\n            &nbsp;\n            <ArrowIcon className=\"ml-0.5 inline-block size-4 align-middle\" />\n          </span>\n        )}\n      </a>\n    );\n  }\n\n  // Primary variant — pill with arrow circle and hover overlay\n  return (\n    <a\n      href={safeHref}\n      className={cn(\n        'group relative flex md:w-fit md:max-w-[500px] items-center justify-between rounded-[80px] pl-5 pr-[3px] py-[3px] gap-2 cursor-pointer overflow-hidden',\n        'text-sm leading-[14px]',\n        active\n          ? 'bg-text-accent text-white'\n          : 'bg-white border border-text-accent/30 text-text-accent',\n        className,\n      )}\n      onClick={handleClick}\n      {...props}\n    >\n      {/* Hover overlay — expands from right (arrow) to fill pill */}\n      <span\n        className={cn(\n          'absolute inset-[3px] rounded-[80px] pointer-events-none',\n          'origin-right scale-x-0 group-hover:scale-x-100',\n          'transition-transform duration-300 ease-out',\n          active ? 'bg-text-accent-hover' : 'bg-text-accent/10',\n        )}\n      />\n      <span className=\"relative z-[1] min-w-0 py-[10px] truncate\">\n        {children}\n      </span>\n      {showArrow && (\n        <span\n          className={cn(\n            'relative z-[1] flex items-center justify-center rounded-full shrink-0',\n            'size-[34px] p-2.5',\n            active ? 'bg-text-accent-hover' : 'bg-text-accent/10',\n          )}\n        >\n          <ArrowIcon className=\"size-4\" />\n        </span>\n      )}\n    </a>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/ui/UserQuery.js

@@ -0,0 +1,167 @@
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { ShareIcon } from './icons/ShareIcon.js';
+import { CheckIcon } from './icons/CheckIcon.js';
+import { PlusIcon } from './icons/PlusIcon.js';
+import { UndoIcon } from './icons/UndoIcon.js';
+import { RedoIcon } from './icons/RedoIcon.js';
+import { CommentIcon } from './icons/CommentIcon.js';
+import { getForwardStack, pushToForwardStack, popFromForwardStack, clearForwardStack } from '../../utils/navigationStack.js';
+const DEFAULT_LOADING_MESSAGES = ['Thinking…', 'Recognizing intent…', 'Connecting the dots…', 'Synthesizing insights…', 'Formulating a response…'];
+const headerClassName = 'web5-user-query sticky top-0 z-10 flex items-center justify-between bg-white/60 backdrop-blur-sm pl-5 pr-[10px] py-[7px] sm:px-[30px] sm:py-[17px]';
+export const UserQuery = _ref => {
+  let {
+    query,
+    onNewConversation,
+    onNavigateToTriggerId,
+    predecessorTriggerId,
+    currentTriggerId,
+    onShare,
+    onToggleCommentMode,
+    commentMode = false,
+    commentCount = 0,
+    loading,
+    newConversationLabel = 'New conversation',
+    copiedLabel = 'Link Copied',
+    copiedDurationMs = 2000
+  } = _ref;
+  const forwardStack = useMemo(() => getForwardStack(), [currentTriggerId]);
+  const canGoForward = forwardStack.length > 0;
+  const canGoBack = !!predecessorTriggerId;
+  const hasNavigation = canGoBack || canGoForward;
+  const handleBack = useCallback(() => {
+    if (!predecessorTriggerId || !currentTriggerId || !onNavigateToTriggerId) {
+      return;
+    }
+    pushToForwardStack(currentTriggerId);
+    onNavigateToTriggerId(predecessorTriggerId);
+  }, [predecessorTriggerId, currentTriggerId, onNavigateToTriggerId]);
+  const handleForward = useCallback(() => {
+    if (!onNavigateToTriggerId) {
+      return;
+    }
+    const nextTid = popFromForwardStack();
+    if (!nextTid) {
+      return;
+    }
+    onNavigateToTriggerId(nextTid);
+  }, [onNavigateToTriggerId]);
+  const handleNewConversation = useCallback(() => {
+    clearForwardStack();
+    onNewConversation == null || onNewConversation();
+  }, [onNewConversation]);
+  const [shareState, setShareState] = useState('idle');
+  const handleShare = useCallback(async () => {
+    if (shareState !== 'idle') {
+      return;
+    }
+    setShareState('loading');
+    let urlToCopy = window.location.href;
+    try {
+      if (onShare && currentTriggerId) {
+        urlToCopy = await onShare(currentTriggerId);
+      }
+    } catch (err) {
+      console.warn('[share] failed, falling back to current URL:', err);
+    }
+    navigator.clipboard.writeText(urlToCopy).catch(err => console.warn('[share] clipboard write failed:', err));
+    setShareState('copied');
+    setTimeout(() => setShareState('idle'), copiedDurationMs);
+  }, [shareState, onShare, currentTriggerId, copiedDurationMs]);
+  const cyclingMessages = useMemo(() => loading != null && loading.messages && loading.messages.length > 0 ? loading.messages : DEFAULT_LOADING_MESSAGES, [loading == null ? void 0 : loading.messages]);
+  const [cycledMessage, setCycledMessage] = useState(cyclingMessages[0]);
+  useEffect(() => {
+    if (!loading || loading.progressMessage) {
+      return;
+    }
+    setCycledMessage(cyclingMessages[0]);
+    if (cyclingMessages.length <= 1) {
+      return;
+    }
+    let index = 0;
+    const interval = setInterval(() => {
+      index = (index + 1) % cyclingMessages.length;
+      setCycledMessage(cyclingMessages[index]);
+    }, 4000);
+    return () => clearInterval(interval);
+  }, [loading, cyclingMessages]);
+  if (!query && !loading) {
+    return null;
+  }
+  const isCopied = shareState === 'copied';
+  const isLoading = shareState === 'loading';
+  if (loading) {
+    const progressText = loading.progressMessage ?? cycledMessage;
+    return /*#__PURE__*/React.createElement("div", {
+      className: headerClassName,
+      role: "status",
+      "aria-busy": "true",
+      "aria-live": "polite"
+    }, /*#__PURE__*/React.createElement("p", {
+      className: "text-[14px] leading-5 text-text-body truncate min-w-0 max-w-[700px] flex-1",
+      title: `Asking: ${loading.pendingQuery}`
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "text-text-body/70"
+    }, "Asking: "), loading.pendingQuery), progressText && /*#__PURE__*/React.createElement("div", {
+      className: "hidden sm:flex items-center gap-2 ml-[10px] shrink-0 min-w-0"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "w-4 h-4 shrink-0 animate-spin inline-block border-[2px] border-current border-t-transparent text-blue-600 dark:text-blue-500 rounded-full",
+      "aria-hidden": "true"
+    }), /*#__PURE__*/React.createElement("p", {
+      className: "text-[13px] leading-5 text-text-body/70 truncate max-w-[240px]"
+    }, progressText)));
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: headerClassName
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center gap-[30px] flex-1 min-w-0"
+  }, /*#__PURE__*/React.createElement("p", {
+    className: "web5-user-query__title text-[14px] leading-5 text-text-body truncate min-w-0 max-w-[700px]",
+    title: query
+  }, query), hasNavigation && /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center gap-[9px]"
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleBack,
+    disabled: !canGoBack,
+    title: "Go to previous conversation",
+    "aria-label": "Go to previous conversation",
+    className: "w-6 h-6 flex items-center justify-center text-text-body hover:text-black transition-colors bg-transparent border-0 cursor-pointer disabled:opacity-30 disabled:cursor-default"
+  }, /*#__PURE__*/React.createElement(UndoIcon, null)), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleForward,
+    disabled: !canGoForward,
+    title: "Go to next conversation",
+    "aria-label": "Go to next conversation",
+    className: "w-6 h-6 flex items-center justify-center text-text-body hover:text-black transition-colors bg-transparent border-0 cursor-pointer disabled:opacity-30 disabled:cursor-default"
+  }, /*#__PURE__*/React.createElement(RedoIcon, null)))), /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center gap-[10px] ml-[10px] sm:ml-0 shrink-0"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "relative"
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleShare,
+    disabled: isLoading || isCopied,
+    className: `web5-user-query__share flex items-center gap-2 p-[6px] sm:px-[13px] sm:py-[5px] rounded-[30px] text-[13px] leading-5 border-0 cursor-pointer transition-colors disabled:cursor-default
+              ${isCopied ? 'is-copied bg-[#2b2b2b] text-white' : 'text-text-body bg-white hover:bg-gray-50'}`
+  }, isCopied ? /*#__PURE__*/React.createElement(CheckIcon, null) : /*#__PURE__*/React.createElement(ShareIcon, null), /*#__PURE__*/React.createElement("span", {
+    className: "hidden sm:inline"
+  }, isLoading ? 'Sharing…' : isCopied ? copiedLabel : 'Share')), isCopied && /*#__PURE__*/React.createElement("div", {
+    className: "web5-user-query__copied-toast sm:hidden absolute top-full right-0 mt-1 flex items-center gap-2 bg-[#2b2b2b] text-white text-[12px] leading-none px-3 py-2 rounded-[8px] whitespace-nowrap"
+  }, /*#__PURE__*/React.createElement(CheckIcon, null), copiedLabel)), onNewConversation && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleNewConversation,
+    className: "web5-user-query__new-conversation flex items-center gap-2 p-[6px] sm:px-[13px] sm:py-[5px] rounded-[30px] text-[13px] leading-5 text-text-body bg-white border-0 cursor-pointer hover:bg-gray-50 transition-colors"
+  }, /*#__PURE__*/React.createElement(PlusIcon, null), /*#__PURE__*/React.createElement("span", {
+    className: "hidden sm:inline"
+  }, newConversationLabel)), onToggleCommentMode && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onToggleCommentMode,
+    "aria-pressed": commentMode,
+    title: "Add a comment",
+    "aria-label": "Add a comment",
+    className: `relative flex items-center gap-2 p-[6px] sm:px-[13px] sm:py-[5px] rounded-[30px] text-[13px] leading-5 border-0 cursor-pointer transition-colors ${commentMode ? 'bg-[#2b2b2b] text-white' : 'text-text-body bg-white hover:bg-gray-50'}`
+  }, /*#__PURE__*/React.createElement(CommentIcon, null), commentCount > 0 && /*#__PURE__*/React.createElement("span", {
+    className: `absolute -top-1 -right-1 min-w-[18px] h-[18px] px-1 rounded-full text-[10px] leading-[18px] text-center font-semibold ${commentMode ? 'bg-white text-[#2b2b2b]' : 'bg-[#2b2b2b] text-white'}`
+  }, commentCount))));
+};
+//# sourceMappingURL=UserQuery.js.map

package/dist/esm/components/ui/UserQuery.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","ShareIcon","CheckIcon","PlusIcon","UndoIcon","RedoIcon","CommentIcon","getForwardStack","pushToForwardStack","popFromForwardStack","clearForwardStack","DEFAULT_LOADING_MESSAGES","headerClassName","UserQuery","_ref","query","onNewConversation","onNavigateToTriggerId","predecessorTriggerId","currentTriggerId","onShare","onToggleCommentMode","commentMode","commentCount","loading","newConversationLabel","copiedLabel","copiedDurationMs","forwardStack","canGoForward","length","canGoBack","hasNavigation","handleBack","handleForward","nextTid","handleNewConversation","shareState","setShareState","handleShare","urlToCopy","window","location","href","err","console","warn","navigator","clipboard","writeText","catch","setTimeout","cyclingMessages","messages","cycledMessage","setCycledMessage","progressMessage","index","interval","setInterval","clearInterval","isCopied","isLoading","progressText","createElement","className","role","title","pendingQuery","type","onClick","disabled"],"sources":["../../../../src/components/ui/UserQuery.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport { ShareIcon } from './icons/ShareIcon';\nimport { CheckIcon } from './icons/CheckIcon';\nimport { PlusIcon } from './icons/PlusIcon';\nimport { UndoIcon } from './icons/UndoIcon';\nimport { RedoIcon } from './icons/RedoIcon';\nimport { CommentIcon } from './icons/CommentIcon';\nimport {\n  getForwardStack,\n  pushToForwardStack,\n  popFromForwardStack,\n  clearForwardStack,\n} from '../../utils/navigationStack';\n\ntype ShareState = 'idle' | 'loading' | 'copied';\n\nconst DEFAULT_LOADING_MESSAGES = [\n  'Thinking…',\n  'Recognizing intent…',\n  'Connecting the dots…',\n  'Synthesizing insights…',\n  'Formulating a response…',\n];\n\nconst headerClassName =\n  'web5-user-query sticky top-0 z-10 flex items-center justify-between bg-white/60 backdrop-blur-sm pl-5 pr-[10px] py-[7px] sm:px-[30px] sm:py-[17px]';\n\nexport interface UserQueryLoadingState {\n  pendingQuery: string;\n  /** Static progress message. If omitted, falls back to cycling through `messages`. */\n  progressMessage?: string;\n  /** Messages cycled while loading when `progressMessage` is not set. */\n  messages?: string[];\n}\n\nexport interface UserQueryProps {\n  query: string;\n  onNewConversation?: () => void;\n  onNavigateToTriggerId?: (triggerId: string) => void;\n  predecessorTriggerId?: string;\n  currentTriggerId?: string;\n  onShare?: (triggerId: string) => Promise<string>;\n  /** Optional comment-mode toggle. When provided, render the chat-bubble\n   *  toggle button next to Share. The button reflects `commentMode` via\n   *  `is-on` styling and `aria-pressed`. */\n  onToggleCommentMode?: () => void;\n  commentMode?: boolean;\n  /** Total number of comments on this response — shown as a badge next to the\n   *  toggle when > 0. */\n  commentCount?: number;\n  loading?: UserQueryLoadingState;\n  /** Label for the \"new conversation\" action. Defaults to \"New conversation\". */\n  newConversationLabel?: string;\n  /** Label shown after the share link is copied. Defaults to \"Link Copied\". */\n  copiedLabel?: string;\n  /** How long the copied state stays visible, in ms. Defaults to 2000. */\n  copiedDurationMs?: number;\n}\n\nexport const UserQuery: FC<UserQueryProps> = ({\n  query,\n  onNewConversation,\n  onNavigateToTriggerId,\n  predecessorTriggerId,\n  currentTriggerId,\n  onShare,\n  onToggleCommentMode,\n  commentMode = false,\n  commentCount = 0,\n  loading,\n  newConversationLabel = 'New conversation',\n  copiedLabel = 'Link Copied',\n  copiedDurationMs = 2000,\n}) => {\n  const forwardStack = useMemo(() => getForwardStack(), [currentTriggerId]);\n  const canGoForward = forwardStack.length > 0;\n  const canGoBack = !!predecessorTriggerId;\n  const hasNavigation = canGoBack || canGoForward;\n\n  const handleBack = useCallback(() => {\n    if (!predecessorTriggerId || !currentTriggerId || !onNavigateToTriggerId) {\n      return;\n    }\n    pushToForwardStack(currentTriggerId);\n    onNavigateToTriggerId(predecessorTriggerId);\n  }, [predecessorTriggerId, currentTriggerId, onNavigateToTriggerId]);\n\n  const handleForward = useCallback(() => {\n    if (!onNavigateToTriggerId) {\n      return;\n    }\n    const nextTid = popFromForwardStack();\n    if (!nextTid) {\n      return;\n    }\n    onNavigateToTriggerId(nextTid);\n  }, [onNavigateToTriggerId]);\n\n  const handleNewConversation = useCallback(() => {\n    clearForwardStack();\n    onNewConversation?.();\n  }, [onNewConversation]);\n\n  const [shareState, setShareState] = useState<ShareState>('idle');\n\n  const handleShare = useCallback(async () => {\n    if (shareState !== 'idle') {\n      return;\n    }\n    setShareState('loading');\n    let urlToCopy = window.location.href;\n    try {\n      if (onShare && currentTriggerId) {\n        urlToCopy = await onShare(currentTriggerId);\n      }\n    } catch (err) {\n      console.warn('[share] failed, falling back to current URL:', err);\n    }\n    navigator.clipboard\n      .writeText(urlToCopy)\n      .catch((err) => console.warn('[share] clipboard write failed:', err));\n    setShareState('copied');\n    setTimeout(() => setShareState('idle'), copiedDurationMs);\n  }, [shareState, onShare, currentTriggerId, copiedDurationMs]);\n\n  const cyclingMessages = useMemo(\n    () =>\n      loading?.messages && loading.messages.length > 0\n        ? loading.messages\n        : DEFAULT_LOADING_MESSAGES,\n    [loading?.messages],\n  );\n  const [cycledMessage, setCycledMessage] = useState(cyclingMessages[0]);\n\n  useEffect(() => {\n    if (!loading || loading.progressMessage) {\n      return;\n    }\n    setCycledMessage(cyclingMessages[0]);\n    if (cyclingMessages.length <= 1) {\n      return;\n    }\n    let index = 0;\n    const interval = setInterval(() => {\n      index = (index + 1) % cyclingMessages.length;\n      setCycledMessage(cyclingMessages[index]);\n    }, 4000);\n    return () => clearInterval(interval);\n  }, [loading, cyclingMessages]);\n\n  if (!query && !loading) {\n    return null;\n  }\n\n  const isCopied = shareState === 'copied';\n  const isLoading = shareState === 'loading';\n\n  if (loading) {\n    const progressText = loading.progressMessage ?? cycledMessage;\n    return (\n      <div\n        className={headerClassName}\n        role=\"status\"\n        aria-busy=\"true\"\n        aria-live=\"polite\"\n      >\n        <p\n          className=\"text-[14px] leading-5 text-text-body truncate min-w-0 max-w-[700px] flex-1\"\n          title={`Asking: ${loading.pendingQuery}`}\n        >\n          <span className=\"text-text-body/70\">Asking: </span>\n          {loading.pendingQuery}\n        </p>\n        {progressText && (\n          <div className=\"hidden sm:flex items-center gap-2 ml-[10px] shrink-0 min-w-0\">\n            <div\n              className=\"w-4 h-4 shrink-0 animate-spin inline-block border-[2px] border-current border-t-transparent text-blue-600 dark:text-blue-500 rounded-full\"\n              aria-hidden=\"true\"\n            />\n            <p className=\"text-[13px] leading-5 text-text-body/70 truncate max-w-[240px]\">\n              {progressText}\n            </p>\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div className={headerClassName}>\n      <div className=\"flex items-center gap-[30px] flex-1 min-w-0\">\n        <p\n          className=\"web5-user-query__title text-[14px] leading-5 text-text-body truncate min-w-0 max-w-[700px]\"\n          title={query}\n        >\n          {query}\n        </p>\n        {hasNavigation && (\n          <div className=\"flex items-center gap-[9px]\">\n            <button\n              type=\"button\"\n              onClick={handleBack}\n              disabled={!canGoBack}\n              title=\"Go to previous conversation\"\n              aria-label=\"Go to previous conversation\"\n              className=\"w-6 h-6 flex items-center justify-center text-text-body hover:text-black transition-colors bg-transparent border-0 cursor-pointer disabled:opacity-30 disabled:cursor-default\"\n            >\n              <UndoIcon />\n            </button>\n            <button\n              type=\"button\"\n              onClick={handleForward}\n              disabled={!canGoForward}\n              title=\"Go to next conversation\"\n              aria-label=\"Go to next conversation\"\n              className=\"w-6 h-6 flex items-center justify-center text-text-body hover:text-black transition-colors bg-transparent border-0 cursor-pointer disabled:opacity-30 disabled:cursor-default\"\n            >\n              <RedoIcon />\n            </button>\n          </div>\n        )}\n      </div>\n      <div className=\"flex items-center gap-[10px] ml-[10px] sm:ml-0 shrink-0\">\n        {/* Share button — wraps button + mobile tooltip in a relative container */}\n        <div className=\"relative\">\n          <button\n            type=\"button\"\n            onClick={handleShare}\n            disabled={isLoading || isCopied}\n            className={`web5-user-query__share flex items-center gap-2 p-[6px] sm:px-[13px] sm:py-[5px] rounded-[30px] text-[13px] leading-5 border-0 cursor-pointer transition-colors disabled:cursor-default\n              ${\n                isCopied\n                  ? 'is-copied bg-[#2b2b2b] text-white'\n                  : 'text-text-body bg-white hover:bg-gray-50'\n              }`}\n          >\n            {isCopied ? <CheckIcon /> : <ShareIcon />}\n            <span className=\"hidden sm:inline\">\n              {isLoading ? 'Sharing…' : isCopied ? copiedLabel : 'Share'}\n            </span>\n          </button>\n          {/* Mobile-only tooltip: drops below the button when link is copied */}\n          {isCopied && (\n            <div className=\"web5-user-query__copied-toast sm:hidden absolute top-full right-0 mt-1 flex items-center gap-2 bg-[#2b2b2b] text-white text-[12px] leading-none px-3 py-2 rounded-[8px] whitespace-nowrap\">\n              <CheckIcon />\n              {copiedLabel}\n            </div>\n          )}\n        </div>\n        {onNewConversation && (\n          <button\n            type=\"button\"\n            onClick={handleNewConversation}\n            className=\"web5-user-query__new-conversation flex items-center gap-2 p-[6px] sm:px-[13px] sm:py-[5px] rounded-[30px] text-[13px] leading-5 text-text-body bg-white border-0 cursor-pointer hover:bg-gray-50 transition-colors\"\n          >\n            <PlusIcon />\n            <span className=\"hidden sm:inline\">{newConversationLabel}</span>\n          </button>\n        )}\n        {onToggleCommentMode && (\n          <button\n            type=\"button\"\n            onClick={onToggleCommentMode}\n            aria-pressed={commentMode}\n            title=\"Add a comment\"\n            aria-label=\"Add a comment\"\n            className={`relative flex items-center gap-2 p-[6px] sm:px-[13px] sm:py-[5px] rounded-[30px] text-[13px] leading-5 border-0 cursor-pointer transition-colors ${\n              commentMode\n                ? 'bg-[#2b2b2b] text-white'\n                : 'text-text-body bg-white hover:bg-gray-50'\n            }`}\n          >\n            <CommentIcon />\n            {commentCount > 0 && (\n              <span\n                className={`absolute -top-1 -right-1 min-w-[18px] h-[18px] px-1 rounded-full text-[10px] leading-[18px] text-center font-semibold ${\n                  commentMode ? 'bg-white text-[#2b2b2b]' : 'bg-[#2b2b2b] text-white'\n                }`}\n              >\n                {commentCount}\n              </span>\n            )}\n          </button>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/ui/icons/ArrowTopRightIcon.js

@@ -0,0 +1,17 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+export const ArrowTopRightIcon = props => /*#__PURE__*/React.createElement("svg", _extends({
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "22",
+  height: "22",
+  viewBox: "0 0 22 22",
+  fill: "none",
+  "aria-hidden": "true"
+}, props), /*#__PURE__*/React.createElement("path", {
+  d: "M6.41602 6.4165H15.5827M15.5827 6.4165V15.5832M15.5827 6.4165L6.41602 15.5832",
+  stroke: "currentColor",
+  strokeWidth: "1.3",
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+}));
+//# sourceMappingURL=ArrowTopRightIcon.js.map

package/dist/esm/components/ui/icons/ArrowTopRightIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ArrowTopRightIcon","props","createElement","_extends","xmlns","width","height","viewBox","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"sources":["../../../../../src/components/ui/icons/ArrowTopRightIcon.tsx"],"sourcesContent":["import React from 'react';\n\nexport const ArrowTopRightIcon: React.FC<React.SVGProps<SVGSVGElement>> = (\n  props,\n) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"22\"\n    height=\"22\"\n    viewBox=\"0 0 22 22\"\n    fill=\"none\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path\n      d=\"M6.41602 6.4165H15.5827M15.5827 6.4165V15.5832M15.5827 6.4165L6.41602 15.5832\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n  </svg>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,MAAMC,iBAA0D,GACrEC,KAAK,iBAELF,KAAA,CAAAG,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAC,4BAA4B;EAClCC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACX,eAAY;AAAM,GACdP,KAAK,gBAETF,KAAA,CAAAG,aAAA;EACEO,CAAC,EAAC,+EAA+E;EACjFC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC;AAAO,CACvB,CACE,CACN","ignoreList":[]}

package/dist/esm/components/ui/icons/ArrowUpIcon.js

@@ -0,0 +1,29 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+export const ArrowUpIcon = props => /*#__PURE__*/React.createElement("svg", _extends({
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16",
+  height: "16",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: "1",
+  strokeLinecap: "butt",
+  "aria-hidden": "true"
+}, props), /*#__PURE__*/React.createElement("line", {
+  x1: "12",
+  y1: "20",
+  x2: "12",
+  y2: "5"
+}), /*#__PURE__*/React.createElement("line", {
+  x1: "7",
+  y1: "10",
+  x2: "12",
+  y2: "5"
+}), /*#__PURE__*/React.createElement("line", {
+  x1: "17",
+  y1: "10",
+  x2: "12",
+  y2: "5"
+}));
+//# sourceMappingURL=ArrowUpIcon.js.map

package/dist/esm/components/ui/icons/ArrowUpIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ArrowUpIcon","props","createElement","_extends","xmlns","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","x1","y1","x2","y2"],"sources":["../../../../../src/components/ui/icons/ArrowUpIcon.tsx"],"sourcesContent":["import React from 'react';\n\nexport const ArrowUpIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"1\"\n    strokeLinecap=\"butt\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"5\" />\n    <line x1=\"7\" y1=\"10\" x2=\"12\" y2=\"5\" />\n    <line x1=\"17\" y1=\"10\" x2=\"12\" y2=\"5\" />\n  </svg>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,MAAMC,WAAoD,GAAIC,KAAK,iBACxEF,KAAA,CAAAG,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAC,4BAA4B;EAClCC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACXC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,GAAG;EACfC,aAAa,EAAC,MAAM;EACpB,eAAY;AAAM,GACdV,KAAK,gBAETF,KAAA,CAAAG,aAAA;EAAMU,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC;AAAG,CAAE,CAAC,eACvChB,KAAA,CAAAG,aAAA;EAAMU,EAAE,EAAC,GAAG;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC;AAAG,CAAE,CAAC,eACtChB,KAAA,CAAAG,aAAA;EAAMU,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC;AAAG,CAAE,CACnC,CACN","ignoreList":[]}

package/dist/esm/components/ui/icons/CheckIcon.js

@@ -0,0 +1,17 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+export const CheckIcon = props => /*#__PURE__*/React.createElement("svg", _extends({
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16",
+  height: "16",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: "2",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": "true"
+}, props), /*#__PURE__*/React.createElement("polyline", {
+  points: "20 6 9 17 4 12"
+}));
+//# sourceMappingURL=CheckIcon.js.map

package/dist/esm/components/ui/icons/CheckIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","CheckIcon","props","createElement","_extends","xmlns","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","points"],"sources":["../../../../../src/components/ui/icons/CheckIcon.tsx"],"sourcesContent":["import React from 'react';\n\nexport const CheckIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <polyline points=\"20 6 9 17 4 12\" />\n  </svg>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,MAAMC,SAAkD,GAAIC,KAAK,iBACtEF,KAAA,CAAAG,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAC,4BAA4B;EAClCC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACXC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,GAAG;EACfC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC,OAAO;EACtB,eAAY;AAAM,GACdX,KAAK,gBAETF,KAAA,CAAAG,aAAA;EAAUW,MAAM,EAAC;AAAgB,CAAE,CAChC,CACN","ignoreList":[]}

package/dist/esm/components/ui/icons/CommentIcon.js

@@ -0,0 +1,15 @@
+import React from 'react';
+export const CommentIcon = () => /*#__PURE__*/React.createElement("svg", {
+  width: "16",
+  height: "16",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": true
+}, /*#__PURE__*/React.createElement("path", {
+  d: "M21 12a8 8 0 1 1-3.2-6.4L21 4l-1 4.2A8 8 0 0 1 21 12z"
+}));
+//# sourceMappingURL=CommentIcon.js.map

package/dist/esm/components/ui/icons/CommentIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","CommentIcon","createElement","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","d"],"sources":["../../../../../src/components/ui/icons/CommentIcon.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nexport const CommentIcon: FC = () => (\n  <svg\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth={2}\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden\n  >\n    <path d=\"M21 12a8 8 0 1 1-3.2-6.4L21 4l-1 4.2A8 8 0 0 1 21 12z\" />\n  </svg>\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAc,OAAO;AAEjC,OAAO,MAAMC,WAAe,GAAGA,CAAA,kBAC7BD,KAAA,CAAAE,aAAA;EACEC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACXC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAE,CAAE;EACfC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC,OAAO;EACtB;AAAW,gBAEXV,KAAA,CAAAE,aAAA;EAAMS,CAAC,EAAC;AAAuD,CAAE,CAC9D,CACN","ignoreList":[]}

package/dist/esm/components/ui/icons/PlusIcon.js

@@ -0,0 +1,25 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+export const PlusIcon = props => /*#__PURE__*/React.createElement("svg", _extends({
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16",
+  height: "16",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: "2",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": "true"
+}, props), /*#__PURE__*/React.createElement("line", {
+  x1: "12",
+  y1: "5",
+  x2: "12",
+  y2: "19"
+}), /*#__PURE__*/React.createElement("line", {
+  x1: "5",
+  y1: "12",
+  x2: "19",
+  y2: "12"
+}));
+//# sourceMappingURL=PlusIcon.js.map

package/dist/esm/components/ui/icons/PlusIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","PlusIcon","props","createElement","_extends","xmlns","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","x1","y1","x2","y2"],"sources":["../../../../../src/components/ui/icons/PlusIcon.tsx"],"sourcesContent":["import React from 'react';\n\nexport const PlusIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\" />\n    <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n  </svg>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,MAAMC,QAAiD,GAAIC,KAAK,iBACrEF,KAAA,CAAAG,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAC,4BAA4B;EAClCC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACXC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,GAAG;EACfC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC,OAAO;EACtB,eAAY;AAAM,GACdX,KAAK,gBAETF,KAAA,CAAAG,aAAA;EAAMW,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,GAAG;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC;AAAI,CAAE,CAAC,eACvCjB,KAAA,CAAAG,aAAA;EAAMW,EAAE,EAAC,GAAG;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC,IAAI;EAACC,EAAE,EAAC;AAAI,CAAE,CACnC,CACN","ignoreList":[]}

package/dist/esm/components/ui/icons/RedoIcon.js

@@ -0,0 +1,25 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+export const RedoIcon = props => /*#__PURE__*/React.createElement("svg", _extends({
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16",
+  height: "16",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  "aria-hidden": "true"
+}, props), /*#__PURE__*/React.createElement("path", {
+  d: "M17 11l4-4-4-4",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: "1.5",
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M21 7h-8a7 7 0 0 0-7 7v1",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: "1.5",
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+}));
+//# sourceMappingURL=RedoIcon.js.map

package/dist/esm/components/ui/icons/RedoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","RedoIcon","props","createElement","_extends","xmlns","width","height","viewBox","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"sources":["../../../../../src/components/ui/icons/RedoIcon.tsx"],"sourcesContent":["import React from 'react';\n\nexport const RedoIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path\n      d=\"M17 11l4-4-4-4\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n    <path\n      d=\"M21 7h-8a7 7 0 0 0-7 7v1\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n  </svg>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,MAAMC,QAAiD,GAAIC,KAAK,iBACrEF,KAAA,CAAAG,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAC,4BAA4B;EAClCC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACX,eAAY;AAAM,GACdP,KAAK,gBAETF,KAAA,CAAAG,aAAA;EACEO,CAAC,EAAC,gBAAgB;EAClBD,IAAI,EAAC,MAAM;EACXE,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC;AAAO,CACvB,CAAC,eACFd,KAAA,CAAAG,aAAA;EACEO,CAAC,EAAC,0BAA0B;EAC5BD,IAAI,EAAC,MAAM;EACXE,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC;AAAO,CACvB,CACE,CACN","ignoreList":[]}