@agentiffai/design 0.1.2 → 0.1.4

package/dist/chunk-OPWUJP7J.cjs

@@ -1,2116 +0,0 @@
-'use strict';
-
-var react = require('react');
-var styled7 = require('styled-components');
-var jsxRuntime = require('react/jsx-runtime');
-var button = require('@react-aria/button');
-var textfield = require('@react-aria/textfield');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var styled7__default = /*#__PURE__*/_interopDefault(styled7);
-
-// src/components/AssistantThinking/AssistantThinking.tsx
-var dotPulse = styled7.keyframes`
-  0%, 100% {
-    opacity: 0.3;
-    transform: scale(0.8);
-  }
-  50% {
-    opacity: 1;
-    transform: scale(1);
-  }
-`;
-var Container = styled7__default.default.div`
-  display: inline-flex;
-  align-items: center;
-  gap: 12px;
-  padding: 12px 16px;
-  background-color: #2c2c2e;
-  border-radius: 16px;
-  box-shadow: none;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  max-width: fit-content;
-  margin: 0 auto;
-`;
-var Avatar = styled7__default.default.div`
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  box-shadow: 0 2px 8px rgba(139, 92, 246, 0.3);
-`;
-var HeadphonesIcon = styled7__default.default.svg`
-  width: 20px;
-  height: 20px;
-  color: #FFFFFF;
-`;
-var Content = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 8px;
-`;
-var LoadingDots = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 0 4px;
-`;
-var Dot = styled7__default.default.span`
-  width: 6px;
-  height: 6px;
-  border-radius: 50%;
-  background-color: #8e8e93;
-  animation: ${dotPulse} 1.4s ease-in-out infinite;
-`;
-var Message = styled7__default.default.span`
-  font-size: 14px;
-  color: #e5e5e7;
-  font-weight: 400;
-  line-height: 1.5;
-  white-space: nowrap;
-`;
-function AssistantThinking({
-  message = "Analyzing data, please wait...",
-  className,
-  ariaLabel = "Assistant is thinking"
-}) {
-  const containerRef = react.useRef(null);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    Container,
-    {
-      ref: containerRef,
-      className,
-      role: "status",
-      "aria-live": "polite",
-      "aria-label": ariaLabel,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Avatar, { "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(HeadphonesIcon, { viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 13a4 4 0 0 1 0 8c-2.142 0-4-1.79-4-4h-2a4 4 0 1 1-.535-2h3.07A4 4 0 0 1 17 13M2 12v-2h2V7a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v3h2v2z" }) }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs(Content, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(LoadingDots, { "aria-hidden": "true", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Dot, { style: { animationDelay: "0ms" } }),
-            /* @__PURE__ */ jsxRuntime.jsx(Dot, { style: { animationDelay: "150ms" } }),
-            /* @__PURE__ */ jsxRuntime.jsx(Dot, { style: { animationDelay: "300ms" } })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(Message, { children: message })
-        ] })
-      ]
-    }
-  );
-}
-AssistantThinking.displayName = "AssistantThinking";
-var ChatInputContainer = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  padding: 8px;
-  background: transparent;
-  border-radius: 0;
-  box-shadow: none;
-  box-sizing: border-box;
-
-  @media (min-width: 640px) {
-    padding: 12px;
-  }
-`;
-var SuggestionsWrapper = styled7__default.default.div`
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  gap: 8px;
-  margin-bottom: 12px;
-  width: 100%;
-  box-sizing: border-box;
-`;
-var SuggestionButton = styled7__default.default.button`
-  padding: 8px 16px;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  font-size: 13px;
-  font-weight: 400;
-  text-align: center;
-  border: 1px solid #3a3a3c;
-  border-radius: 20px;
-  cursor: pointer;
-  transition: all 0.15s ease;
-  white-space: nowrap;
-
-  /* Dark theme colors */
-  background-color: #2c2c2e;
-  color: #e5e5e7;
-
-  /* Hover state */
-  &:hover:not(:disabled) {
-    background-color: #3a3a3c;
-    border-color: #48484a;
-  }
-
-  /* Active state */
-  &:active:not(:disabled) {
-    background-color: #48484a;
-  }
-
-  /* Focus state */
-  &:focus-visible {
-    outline: 2px solid #5B9FFF;
-    outline-offset: 2px;
-  }
-
-  /* Disabled state */
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.4;
-  }
-`;
-var InputWrapper = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  padding: 10px 14px;
-  background-color: #2c2c2e;
-  border: 1px solid #3a3a3c;
-  border-radius: 12px;
-  transition: all 0.2s ease;
-  width: 100%;
-  box-sizing: border-box;
-
-  &:focus-within {
-    border-color: #5B9FFF;
-    background-color: #323234;
-  }
-`;
-var InputField = styled7__default.default.input`
-  flex: 1;
-  border: none;
-  outline: none;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  font-size: 14px;
-  color: #e5e5e7;
-  background: transparent;
-
-  &::placeholder {
-    color: #6e6e73;
-  }
-
-  &:disabled {
-    color: #6e6e73;
-    cursor: not-allowed;
-  }
-`;
-var SubmitButton = styled7__default.default.button`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  padding: 0;
-  border: none;
-  border-radius: 50%;
-  background-color: ${(props) => props.disabled ? "#3a3a3c" : "#5B9FFF"};
-  color: ${(props) => props.disabled ? "#6e6e73" : "#ffffff"};
-  cursor: ${(props) => props.disabled ? "not-allowed" : "pointer"};
-  transition: all 0.2s ease;
-  flex-shrink: 0;
-
-  &:hover:not(:disabled) {
-    background-color: #4A8FEF;
-    transform: scale(1.05);
-  }
-
-  &:active:not(:disabled) {
-    transform: scale(0.98);
-  }
-
-  &:focus-visible {
-    outline: 2px solid #5B9FFF;
-    outline-offset: 2px;
-  }
-
-  svg {
-    width: 18px;
-    height: 18px;
-  }
-`;
-var ChatInput = ({
-  suggestions = [],
-  onSuggestionSelect,
-  value = "",
-  onChange,
-  onSubmit,
-  placeholder = "Ask, write or search for anything...",
-  isDisabled = false,
-  isReadOnly = false,
-  autoFocus = false,
-  className,
-  "aria-label": ariaLabel = "Chat message input",
-  ...ariaProps
-}) => {
-  const [internalValue, setInternalValue] = react.useState(value);
-  const inputRef = react.useRef(null);
-  const currentValue = value !== void 0 ? value : internalValue;
-  const setValue = onChange || setInternalValue;
-  const { inputProps } = textfield.useTextField(
-    {
-      ...ariaProps,
-      "aria-label": ariaLabel,
-      value: currentValue,
-      onChange: (newValue) => {
-        setValue(newValue);
-      },
-      isDisabled,
-      isReadOnly
-    },
-    inputRef
-  );
-  const handleKeyDown = (e) => {
-    if (e.key === "Enter") {
-      e.preventDefault();
-      handleSubmit();
-    }
-  };
-  const handleSubmit = () => {
-    if (currentValue.trim() && onSubmit && !isDisabled && !isReadOnly) {
-      onSubmit(currentValue.trim());
-      setValue("");
-      inputRef.current?.focus();
-    }
-  };
-  const handleSuggestionClick = (suggestionText) => {
-    if (onSuggestionSelect && !isDisabled && !isReadOnly) {
-      onSuggestionSelect(suggestionText);
-      setValue(suggestionText);
-      inputRef.current?.focus();
-    }
-  };
-  const canSubmit = currentValue.trim().length > 0 && !isDisabled && !isReadOnly;
-  return /* @__PURE__ */ jsxRuntime.jsxs(ChatInputContainer, { className, children: [
-    suggestions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(SuggestionsWrapper, { role: "list", "aria-label": "Suggested prompts", children: suggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
-      SuggestionButtonComponent,
-      {
-        suggestion,
-        onSelect: handleSuggestionClick,
-        isDisabled: isDisabled || isReadOnly
-      },
-      `${suggestion.text}-${index}`
-    )) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(InputWrapper, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        InputField,
-        {
-          ...inputProps,
-          ref: inputRef,
-          type: "text",
-          placeholder,
-          onKeyDown: handleKeyDown,
-          autoFocus,
-          disabled: isDisabled,
-          readOnly: isReadOnly
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        SubmitButtonComponent,
-        {
-          onPress: handleSubmit,
-          isDisabled: !canSubmit,
-          ariaLabel: "Send message"
-        }
-      )
-    ] })
-  ] });
-};
-var SuggestionButtonComponent = ({
-  suggestion,
-  onSelect,
-  isDisabled = false
-}) => {
-  const ref = react.useRef(null);
-  const { buttonProps } = button.useButton(
-    {
-      onPress: () => onSelect(suggestion.text),
-      isDisabled,
-      "aria-label": `Select suggestion: ${suggestion.text}`
-    },
-    ref
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(SuggestionButton, { ...buttonProps, ref, role: "listitem", children: suggestion.text });
-};
-var SubmitButtonComponent = ({
-  onPress,
-  isDisabled = false,
-  ariaLabel = "Send message"
-}) => {
-  const ref = react.useRef(null);
-  const { buttonProps } = button.useButton(
-    {
-      onPress,
-      isDisabled,
-      "aria-label": ariaLabel
-    },
-    ref
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(SubmitButton, { ...buttonProps, ref, disabled: isDisabled, title: ariaLabel, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    "svg",
-    {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 20 20",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      role: "img",
-      "aria-hidden": "true",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("title", { children: "Arrow Right Icon" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "path",
-          {
-            d: "M4 10H16M16 10L10 4M16 10L10 16",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        )
-      ]
-    }
-  ) });
-};
-ChatInput.displayName = "ChatInput";
-var StyledUserMessage = styled7__default.default.button`
-  /* Base styles */
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: 12px 20px;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 1.4;
-  color: #ffffff;
-  border: none;
-  cursor: default;
-  user-select: none;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-  position: relative;
-  text-align: left;
-
-  /* Pill shape - fully rounded ends */
-  border-radius: 999px;
-
-  /* Purple to blue gradient (left to right) */
-  background: linear-gradient(90deg, #8B5CF6 0%, #5B8DEF 100%);
-
-  /* Subtle shadow and glow effect */
-  box-shadow:
-    0 2px 8px rgba(91, 141, 239, 0.25),
-    0 1px 3px rgba(139, 92, 246, 0.15);
-
-  /* Smooth transitions */
-  transition: all 0.2s ease-in-out;
-
-  /* Speech bubble tail */
-  &::after {
-    content: '';
-    position: absolute;
-    bottom: -4px;
-    right: -6px;
-    width: 18px;
-    height: 18px;
-    background: #5B8DEF;
-    transform: rotate(45deg);
-    border-radius: 0 0 16px 0;
-    box-shadow:
-      2px 2px 4px rgba(91, 141, 239, 0.15);
-    transition: all 0.2s ease-in-out;
-  }
-
-  /* Hover state - only for button elements */
-  &[role="button"]:hover:not(:disabled) {
-    transform: translateY(-1px);
-    cursor: pointer;
-    box-shadow:
-      0 4px 12px rgba(91, 141, 239, 0.35),
-      0 2px 6px rgba(139, 92, 246, 0.25);
-
-    &::after {
-      box-shadow:
-        3px 3px 6px rgba(91, 141, 239, 0.2);
-    }
-  }
-
-  /* Active/Pressed state - only for button elements */
-  &[role="button"]:active:not(:disabled) {
-    transform: translateY(0);
-    box-shadow:
-      0 1px 4px rgba(91, 141, 239, 0.2),
-      0 1px 2px rgba(139, 92, 246, 0.1);
-
-    &::after {
-      box-shadow:
-        1px 1px 2px rgba(91, 141, 239, 0.1);
-    }
-  }
-
-  ${({ $isPressed }) => $isPressed && styled7.css`
-      transform: translateY(0) scale(0.98);
-      box-shadow:
-        0 1px 4px rgba(91, 141, 239, 0.2),
-        0 1px 2px rgba(139, 92, 246, 0.1);
-
-      &::after {
-        box-shadow:
-          1px 1px 2px rgba(91, 141, 239, 0.1);
-      }
-    `}
-
-  /* Focus state for accessibility */
-  &:focus {
-    outline: none;
-  }
-
-  &:focus-visible {
-    outline: 2px solid #5B8DEF;
-    outline-offset: 3px;
-    box-shadow:
-      0 4px 12px rgba(91, 141, 239, 0.35),
-      0 2px 6px rgba(139, 92, 246, 0.25),
-      0 0 0 3px rgba(91, 141, 239, 0.1);
-  }
-
-  /* Disabled state */
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-    transform: none;
-    box-shadow: none;
-
-    &::after {
-      opacity: 0.5;
-      box-shadow: none;
-    }
-  }
-`;
-function UserMessage({
-  children,
-  className,
-  isPressed = false,
-  onPress,
-  ...ariaProps
-}) {
-  const ref = react.useRef(null);
-  if (!onPress) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      StyledUserMessage,
-      {
-        as: "div",
-        className,
-        $isPressed: isPressed,
-        role: "presentation",
-        children
-      }
-    );
-  }
-  const { buttonProps, isPressed: ariaPressedState } = button.useButton(
-    {
-      ...ariaProps,
-      onPress
-    },
-    ref
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    StyledUserMessage,
-    {
-      ...buttonProps,
-      ref,
-      className,
-      $isPressed: isPressed || ariaPressedState,
-      role: "button",
-      tabIndex: 0,
-      children
-    }
-  );
-}
-UserMessage.displayName = "UserMessage";
-var variantStyles = {
-  primary: styled7.css`
-    background-color: ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-    color: white;
-    border: none;
-
-    &:hover:not(:disabled) {
-      opacity: 0.9;
-      transform: translateY(-1px);
-    }
-
-    &:active:not(:disabled) {
-      opacity: 0.8;
-      transform: translateY(0);
-    }
-
-    &:focus-visible {
-      outline: 2px solid ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-      outline-offset: 2px;
-    }
-  `,
-  secondary: styled7.css`
-    background-color: transparent;
-    color: ${({ theme }) => theme?.colors?.text ?? "#000000"};
-    border: 1px solid ${({ theme }) => theme?.colors?.border ?? "#E0E0E0"};
-
-    &:hover:not(:disabled) {
-      background-color: ${({ theme }) => theme?.colors?.surface ?? "#ffffff"};
-      border-color: ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-    }
-
-    &:active:not(:disabled) {
-      background-color: ${({ theme }) => theme?.colors?.border ?? "#E0E0E0"};
-    }
-
-    &:focus-visible {
-      outline: 2px solid ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-      outline-offset: 2px;
-    }
-  `,
-  icon: styled7.css`
-    background-color: transparent;
-    color: ${({ theme }) => theme?.colors?.text ?? "#000000"};
-    border: none;
-    padding: ${({ theme }) => theme?.spacing?.sm ?? "8px"};
-    min-width: auto;
-
-    &:hover:not(:disabled) {
-      background-color: ${({ theme }) => theme?.colors?.border ?? "#E0E0E0"};
-      opacity: 0.8;
-    }
-
-    &:active:not(:disabled) {
-      opacity: 0.6;
-    }
-
-    &:focus-visible {
-      outline: 2px solid ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-      outline-offset: 2px;
-    }
-  `
-};
-var sizeStyles = {
-  small: styled7.css`
-    padding: ${({ theme }) => theme?.spacing?.xs ?? "4px"} ${({ theme }) => theme?.spacing?.sm ?? "8px"};
-    font-size: 0.875rem;
-    min-width: 60px;
-    height: 28px;
-  `,
-  medium: styled7.css`
-    padding: ${({ theme }) => theme?.spacing?.sm ?? "8px"} ${({ theme }) => theme?.spacing?.md ?? "16px"};
-    font-size: 1rem;
-    min-width: 80px;
-    height: 36px;
-  `,
-  large: styled7.css`
-    padding: ${({ theme }) => theme?.spacing?.md ?? "16px"} ${({ theme }) => theme?.spacing?.lg ?? "24px"};
-    font-size: 1.125rem;
-    min-width: 100px;
-    height: 44px;
-  `
-};
-var StyledButton = styled7__default.default.button`
-  /* Base styles */
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: ${({ theme }) => theme?.spacing?.xs ?? "4px"};
-  font-family: ${({ theme }) => theme?.fonts?.body ?? "system-ui, sans-serif"};
-  font-weight: 500;
-  border-radius: ${({ theme }) => theme?.radii?.md ?? "8px"};
-  cursor: pointer;
-  transition: all 0.2s ease-in-out;
-  white-space: nowrap;
-  user-select: none;
-
-  /* Variant styles */
-  ${({ $variant }) => variantStyles[$variant]}
-
-  /* Size styles */
-  ${({ $size, $variant }) => $variant !== "icon" && sizeStyles[$size]}
-
-  /* Icon variant size overrides */
-  ${({ $variant, $size }) => $variant === "icon" && styled7.css`
-      width: ${$size === "small" ? "28px" : $size === "large" ? "44px" : "36px"};
-      height: ${$size === "small" ? "28px" : $size === "large" ? "44px" : "36px"};
-      border-radius: ${({ theme }) => theme?.radii?.sm ?? "4px"};
-    `}
-
-  /* Pressed state */
-  ${({ $isPressed }) => $isPressed && styled7.css`
-      transform: scale(0.98);
-    `}
-
-  /* Loading state */
-  ${({ $isLoading }) => $isLoading && styled7.css`
-      cursor: wait;
-      opacity: 0.7;
-    `}
-
-  /* Disabled state */
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-    transform: none;
-  }
-
-  /* Remove default focus outline, using focus-visible instead */
-  &:focus {
-    outline: none;
-  }
-`;
-function Button({
-  variant = "primary",
-  size = "medium",
-  children,
-  className,
-  disabled = false,
-  isLoading = false,
-  ...ariaProps
-}) {
-  const ref = react.useRef(null);
-  const { buttonProps, isPressed } = button.useButton(
-    {
-      ...ariaProps,
-      isDisabled: disabled || isLoading
-    },
-    ref
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    StyledButton,
-    {
-      ...buttonProps,
-      ref,
-      className,
-      $variant: variant,
-      $size: size,
-      $isPressed: isPressed,
-      $isLoading: isLoading,
-      disabled: disabled || isLoading,
-      children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-live": "polite", "aria-busy": "true", children: "Loading..." }) : children
-    }
-  );
-}
-Button.displayName = "Button";
-var ActionsContainer = styled7__default.default.div`
-  display: flex;
-  gap: ${({ theme }) => theme?.spacing?.sm ?? "8px"};
-  align-items: center;
-
-  ${({ $layout }) => $layout === "horizontal" ? styled7.css`
-          flex-direction: row;
-          flex-wrap: wrap;
-        ` : styled7.css`
-          flex-direction: column;
-          align-items: stretch;
-
-          button {
-            width: 100%;
-          }
-        `}
-`;
-function Actions({ actions, layout = "horizontal", className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(ActionsContainer, { $layout: layout, className, children: actions.map((action) => /* @__PURE__ */ jsxRuntime.jsxs(
-    Button,
-    {
-      variant: action.variant || "secondary",
-      onPress: action.onClick,
-      isDisabled: action.disabled,
-      "aria-label": action.label,
-      children: [
-        action.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: action.icon }),
-        action.variant !== "icon" && action.label
-      ]
-    },
-    action.id
-  )) });
-}
-Actions.displayName = "Actions";
-var dotPulse2 = styled7.keyframes`
-  0%, 100% {
-    opacity: 0.3;
-    transform: scale(0.8);
-  }
-  50% {
-    opacity: 1;
-    transform: scale(1);
-  }
-`;
-var fadeIn = styled7.keyframes`
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-`;
-var blink = styled7.keyframes`
-  0%, 49% {
-    opacity: 1;
-  }
-  50%, 100% {
-    opacity: 0;
-  }
-`;
-var ResponseContainer = styled7__default.default.div`
-  display: inline-flex;
-  align-items: center;
-  gap: 12px;
-  padding: 12px 16px;
-  background-color: #2c2c2e;
-  border-radius: 16px;
-  box-shadow: none;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  max-width: fit-content;
-  margin: 0 auto;
-`;
-var LoadingDots2 = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 0 4px;
-`;
-var Dot2 = styled7__default.default.span`
-  width: 6px;
-  height: 6px;
-  border-radius: 50%;
-  background-color: #8e8e93;
-  animation: ${dotPulse2} 1.4s ease-in-out infinite;
-  animation-delay: ${(props) => props.delay}s;
-`;
-var TypingIndicator = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 0 4px;
-
-  ${Dot2} {
-    width: 6px;
-    height: 6px;
-    background-color: #8e8e93;
-    animation: ${dotPulse2} 1.4s ease-in-out infinite;
-  }
-`;
-var Message2 = styled7__default.default.span`
-  font-size: 14px;
-  color: #e5e5e7;
-  font-weight: 400;
-  line-height: 1.5;
-  white-space: nowrap;
-`;
-var StreamingText = styled7__default.default.div`
-  font-size: 14px;
-  line-height: 1.5;
-  color: #e5e5e7;
-  animation: ${fadeIn} 0.3s ease-in;
-  position: relative;
-  font-weight: 400;
-  white-space: nowrap;
-
-  /* Blinking cursor effect */
-  &::after {
-    content: '|';
-    margin-left: 0.125rem;
-    animation: ${blink} 1s infinite;
-    color: #8e8e93;
-    font-weight: 400;
-  }
-`;
-var Response = ({
-  isLoading = false,
-  isTyping = false,
-  isStreaming = false,
-  streamingContent = "",
-  message = "Thinking...",
-  className
-}) => {
-  if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(ResponseContainer, { className, "data-testid": "response-loading", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(LoadingDots2, { "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Dot2, { delay: 0 }),
-        /* @__PURE__ */ jsxRuntime.jsx(Dot2, { delay: 0.15 }),
-        /* @__PURE__ */ jsxRuntime.jsx(Dot2, { delay: 0.3 })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(Message2, { children: message })
-    ] });
-  }
-  if (isTyping) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(ResponseContainer, { className, "data-testid": "response-typing", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(TypingIndicator, { "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Dot2, { delay: 0 }),
-        /* @__PURE__ */ jsxRuntime.jsx(Dot2, { delay: 0.15 }),
-        /* @__PURE__ */ jsxRuntime.jsx(Dot2, { delay: 0.3 })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(Message2, { children: message })
-    ] });
-  }
-  if (isStreaming && streamingContent) {
-    return /* @__PURE__ */ jsxRuntime.jsx(ResponseContainer, { className, "data-testid": "response-streaming", children: /* @__PURE__ */ jsxRuntime.jsx(StreamingText, { children: streamingContent }) });
-  }
-  return null;
-};
-var dotPulse3 = styled7.keyframes`
-  0%, 100% {
-    opacity: 0.3;
-    transform: scale(0.8);
-  }
-  50% {
-    opacity: 1;
-    transform: scale(1);
-  }
-`;
-var shake = styled7.keyframes`
-  0%, 100% {
-    transform: translateX(0);
-  }
-  25% {
-    transform: translateX(-5px);
-  }
-  75% {
-    transform: translateX(5px);
-  }
-`;
-var AgentStateContainer = styled7__default.default.div`
-  display: inline-flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 12px;
-  padding: 12px 16px;
-  background-color: ${(props) => props.isError ? "#3a1f1f" : "#2c2c2e"};
-  border-radius: 16px;
-  border: ${(props) => props.isError ? "1px solid #7f1d1d" : "none"};
-  box-shadow: none;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  max-width: fit-content;
-  margin: 0 auto;
-`;
-var StateContent = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  align-items: center;
-  width: 100%;
-`;
-var IdleIndicator = styled7__default.default.div`
-  width: 6px;
-  height: 6px;
-  background-color: #8e8e93;
-  border-radius: 50%;
-  animation: ${dotPulse3} 2s infinite ease-in-out;
-`;
-var ErrorIndicator = styled7__default.default.div`
-  width: 6px;
-  height: 6px;
-  background-color: #ff6b6b;
-  border-radius: 50%;
-  animation: ${shake} 0.5s ease-in-out;
-`;
-var StateLabel = styled7__default.default.span`
-  font-size: 14px;
-  font-weight: 400;
-  color: #e5e5e7;
-  line-height: 1.5;
-  white-space: nowrap;
-`;
-styled7__default.default.p`
-  font-size: 14px;
-  color: #8e8e93;
-  line-height: 1.5;
-  margin: 0;
-  text-align: center;
-  white-space: nowrap;
-`;
-var ProgressBar = styled7__default.default.div`
-  width: 100%;
-  height: 4px;
-  background-color: #3a3a3c;
-  border-radius: 2px;
-  overflow: hidden;
-  margin-top: 4px;
-`;
-var ProgressBarFill = styled7__default.default.div`
-  height: 100%;
-  width: ${(props) => Math.min(Math.max(props.progress, 0), 100)}%;
-  background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
-  border-radius: 2px;
-  transition: width 0.3s ease-in-out;
-`;
-var AgentState = ({ state, message, progress, className }) => {
-  if (state === "idle") {
-    return /* @__PURE__ */ jsxRuntime.jsx(AgentStateContainer, { className, "data-testid": "agent-state-idle", children: /* @__PURE__ */ jsxRuntime.jsxs(StateContent, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(IdleIndicator, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(StateLabel, { children: message || "Agent is idle" }),
-      progress !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(ProgressBar, { children: /* @__PURE__ */ jsxRuntime.jsx(ProgressBarFill, { progress }) })
-    ] }) });
-  }
-  if (state === "error") {
-    return /* @__PURE__ */ jsxRuntime.jsx(AgentStateContainer, { className, "data-testid": "agent-state-error", isError: true, children: /* @__PURE__ */ jsxRuntime.jsxs(StateContent, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ErrorIndicator, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(StateLabel, { children: message || "Error occurred" })
-    ] }) });
-  }
-  if (state === "thinking") {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Response,
-      {
-        isLoading: true,
-        message: message || "Agent is thinking...",
-        className
-      }
-    );
-  }
-  if (state === "responding") {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Response,
-      {
-        isTyping: true,
-        message: message || "Agent is responding...",
-        className
-      }
-    );
-  }
-  return null;
-};
-var FooterContainer = styled7__default.default.footer`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: ${({ theme }) => theme?.spacing?.sm ?? "8px"} ${({ theme }) => theme?.spacing?.md ?? "16px"};
-  background-color: ${({ theme }) => theme?.colors?.surface ?? "#ffffff"};
-  border-top: 1px solid ${({ theme }) => theme?.colors?.border ?? "#E0E0E0"};
-  min-height: 44px;
-`;
-var FooterContent = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: ${({ theme }) => theme?.spacing?.md ?? "16px"};
-  width: 100%;
-  max-width: 100%;
-  font-size: 0.75rem;
-  color: ${({ theme }) => theme?.colors?.text ?? "#000000"};
-  opacity: 0.6;
-  font-family: ${({ theme }) => theme?.fonts?.body ?? "system-ui, sans-serif"};
-  line-height: 1.4;
-`;
-var FooterBranding = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: ${({ theme }) => theme?.spacing?.xs ?? "4px"};
-  flex-shrink: 0;
-`;
-var FooterStatus = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: ${({ theme }) => theme?.spacing?.xs ?? "4px"};
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-size: 0.75rem;
-  opacity: 0.8;
-`;
-var FooterLink = styled7__default.default.a`
-  color: ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-  text-decoration: none;
-  transition: opacity 150ms ease;
-  cursor: pointer;
-
-  &:hover {
-    opacity: 0.8;
-    text-decoration: underline;
-  }
-
-  &:focus-visible {
-    outline: 2px solid ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-    outline-offset: 2px;
-    border-radius: ${({ theme }) => theme?.radii?.sm ?? "4px"};
-  }
-`;
-var Footer = ({
-  branding,
-  status,
-  brandingUrl,
-  onBrandingClick,
-  className
-}) => {
-  if (!branding && !status) {
-    return null;
-  }
-  const handleBrandingClick = (e) => {
-    if (onBrandingClick) {
-      e.preventDefault();
-      onBrandingClick();
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(FooterContainer, { className, children: /* @__PURE__ */ jsxRuntime.jsxs(FooterContent, { children: [
-    branding && /* @__PURE__ */ jsxRuntime.jsx(FooterBranding, { children: brandingUrl ? /* @__PURE__ */ jsxRuntime.jsx(
-      FooterLink,
-      {
-        href: brandingUrl,
-        onClick: handleBrandingClick,
-        target: "_blank",
-        rel: "noopener noreferrer",
-        children: branding
-      }
-    ) : branding }),
-    status && /* @__PURE__ */ jsxRuntime.jsx(FooterStatus, { children: status })
-  ] }) });
-};
-Footer.displayName = "Footer";
-var HeaderContainer = styled7__default.default.header`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 8px;
-  background-color: #2c2c2e;
-  border-bottom: 1px solid #3a3a3c;
-  min-height: 60px;
-  box-sizing: border-box;
-
-  @media (min-width: 640px) {
-    padding: 12px;
-  }
-`;
-var HeaderContent = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  gap: ${({ theme }) => theme?.spacing?.xs ?? "4px"};
-  flex: 1;
-  min-width: 0;
-`;
-var HeaderTitle = styled7__default.default.h1`
-  margin: 0;
-  font-size: 1rem;
-  font-weight: 600;
-  color: #e5e5e7;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  line-height: 1.5;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-var HeaderSubtitle = styled7__default.default.p`
-  margin: 0;
-  font-size: 0.875rem;
-  color: #8e8e93;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  line-height: 1.4;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-var HeaderActions = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: ${({ theme }) => theme?.spacing?.xs ?? "4px"};
-  margin-left: ${({ theme }) => theme?.spacing?.md ?? "16px"};
-`;
-var ActionButton = styled7__default.default.button`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  padding: 0;
-  background-color: transparent;
-  border: none;
-  border-radius: 6px;
-  color: #e5e5e7;
-  cursor: pointer;
-  transition: all 150ms ease;
-
-  &:hover:not(:disabled) {
-    background-color: #3a3a3c;
-  }
-
-  &:active:not(:disabled) {
-    transform: scale(0.95);
-    background-color: #48484a;
-  }
-
-  &:focus-visible {
-    outline: 2px solid #5B9FFF;
-    outline-offset: 2px;
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.3;
-  }
-
-  svg {
-    width: 16px;
-    height: 16px;
-    display: block;
-  }
-`;
-var Header = ({
-  title,
-  subtitle,
-  onClose,
-  onMinimize,
-  className
-}) => {
-  const minimizeRef = react.useRef(null);
-  const closeRef = react.useRef(null);
-  const { buttonProps: minimizeProps } = button.useButton(
-    {
-      onPress: onMinimize,
-      "aria-label": "Minimize",
-      isDisabled: !onMinimize
-    },
-    minimizeRef
-  );
-  const { buttonProps: closeProps } = button.useButton(
-    {
-      onPress: onClose,
-      "aria-label": "Close",
-      isDisabled: !onClose
-    },
-    closeRef
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxs(HeaderContainer, { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(HeaderContent, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(HeaderTitle, { children: title }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx(HeaderSubtitle, { children: subtitle })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(HeaderActions, { children: [
-      onMinimize && /* @__PURE__ */ jsxRuntime.jsx(ActionButton, { ref: minimizeRef, ...minimizeProps, "data-action": "minimize", children: /* @__PURE__ */ jsxRuntime.jsxs(
-        "svg",
-        {
-          width: "16",
-          height: "16",
-          viewBox: "0 0 16 16",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          "aria-hidden": "true",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("title", { children: "Minimize" }),
-            /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "8", x2: "13", y2: "8", stroke: "currentColor", strokeWidth: "2" })
-          ]
-        }
-      ) }),
-      onClose && /* @__PURE__ */ jsxRuntime.jsx(ActionButton, { ref: closeRef, ...closeProps, "data-action": "close", children: /* @__PURE__ */ jsxRuntime.jsxs(
-        "svg",
-        {
-          width: "16",
-          height: "16",
-          viewBox: "0 0 16 16",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          "aria-hidden": "true",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("title", { children: "Close" }),
-            /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "4", y1: "4", x2: "12", y2: "12", stroke: "currentColor", strokeWidth: "2" }),
-            /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "4", x2: "4", y2: "12", stroke: "currentColor", strokeWidth: "2" })
-          ]
-        }
-      ) })
-    ] })
-  ] });
-};
-Header.displayName = "Header";
-var InputContainer = styled7__default.default.div`
-	display: flex;
-	flex-direction: column;
-	width: 100%;
-	position: relative;
-`;
-var InputWrapper2 = styled7__default.default.div`
-	display: flex;
-	align-items: flex-end;
-	gap: 8px;
-	padding: 12px;
-	background-color: #ffffff;
-	border: 1px solid #e5e7eb;
-	border-radius: 12px;
-	transition: all 0.2s ease;
-
-	&:focus-within {
-		border-color: #3b82f6;
-		box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
-	}
-
-	&:hover:not(:focus-within) {
-		border-color: #d1d5db;
-	}
-`;
-var TextArea = styled7__default.default.textarea`
-	flex: 1;
-	min-height: 24px;
-	max-height: ${(props) => `${(props.$maxRows || 5) * 24}px`};
-	padding: 0;
-	border: none;
-	outline: none;
-	resize: none;
-	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-		'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-	font-size: 14px;
-	line-height: 24px;
-	color: #111827;
-	background: transparent;
-	overflow-y: auto;
-
-	&::placeholder {
-		color: #9ca3af;
-	}
-
-	&:disabled {
-		color: #9ca3af;
-		cursor: not-allowed;
-	}
-
-	&:read-only {
-		cursor: default;
-	}
-
-	/* Custom scrollbar */
-	&::-webkit-scrollbar {
-		width: 6px;
-	}
-
-	&::-webkit-scrollbar-track {
-		background: transparent;
-	}
-
-	&::-webkit-scrollbar-thumb {
-		background: #d1d5db;
-		border-radius: 3px;
-	}
-
-	&::-webkit-scrollbar-thumb:hover {
-		background: #9ca3af;
-	}
-`;
-var SendButton = styled7__default.default.button`
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 36px;
-	height: 36px;
-	padding: 0;
-	border: none;
-	border-radius: 8px;
-	background-color: ${(props) => props.disabled ? "#e5e7eb" : "#3b82f6"};
-	color: ${(props) => props.disabled ? "#9ca3af" : "#ffffff"};
-	cursor: ${(props) => props.disabled ? "not-allowed" : "pointer"};
-	transition: all 0.2s ease;
-	flex-shrink: 0;
-
-	&:hover:not(:disabled) {
-		background-color: #2563eb;
-		transform: translateY(-1px);
-	}
-
-	&:active:not(:disabled) {
-		transform: translateY(0);
-	}
-
-	&:focus-visible {
-		outline: 2px solid #3b82f6;
-		outline-offset: 2px;
-	}
-
-	svg {
-		width: 20px;
-		height: 20px;
-	}
-`;
-var Input = ({
-  value = "",
-  onChange,
-  onSubmit,
-  placeholder = "Type a message...",
-  isDisabled = false,
-  isReadOnly = false,
-  maxRows = 5,
-  autoFocus = false,
-  className,
-  "aria-label": ariaLabel = "Message input",
-  ...ariaProps
-}) => {
-  const textareaRef = react.useRef(null);
-  const { inputProps } = textfield.useTextField(
-    {
-      ...ariaProps,
-      "aria-label": ariaLabel,
-      value,
-      onChange: (newValue) => {
-        onChange?.(newValue);
-      },
-      isDisabled,
-      isReadOnly,
-      inputElementType: "textarea"
-    },
-    textareaRef
-  );
-  const handleKeyDown = (e) => {
-    if (e.key === "Enter" && !e.shiftKey) {
-      e.preventDefault();
-      if (value.trim() && onSubmit && !isDisabled && !isReadOnly) {
-        onSubmit(value.trim());
-        onChange?.("");
-      }
-    }
-  };
-  const handleSend = () => {
-    if (value.trim() && onSubmit && !isDisabled && !isReadOnly) {
-      onSubmit(value.trim());
-      onChange?.("");
-      textareaRef.current?.focus();
-    }
-  };
-  const canSend = value.trim().length > 0 && !isDisabled && !isReadOnly;
-  return /* @__PURE__ */ jsxRuntime.jsx(InputContainer, { className, children: /* @__PURE__ */ jsxRuntime.jsxs(InputWrapper2, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      TextArea,
-      {
-        ...inputProps,
-        ref: textareaRef,
-        placeholder,
-        onKeyDown: handleKeyDown,
-        $maxRows: maxRows,
-        autoFocus,
-        disabled: isDisabled,
-        readOnly: isReadOnly
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      SendButton,
-      {
-        type: "button",
-        onClick: handleSend,
-        disabled: !canSend,
-        "aria-label": "Send message",
-        title: "Send message (Enter)",
-        children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "svg",
-          {
-            width: "20",
-            height: "20",
-            viewBox: "0 0 20 20",
-            fill: "none",
-            xmlns: "http://www.w3.org/2000/svg",
-            role: "img",
-            "aria-hidden": "true",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx("title", { children: "Send Icon" }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "path",
-                {
-                  d: "M2.5 10L17.5 3.75L11.25 18.75L10 12.5L2.5 10Z",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round"
-                }
-              )
-            ]
-          }
-        )
-      }
-    )
-  ] }) });
-};
-var FileAttachmentContainer = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 12px;
-  background-color: #3a3a3c;
-  border: 1px solid #48484a;
-  border-radius: 8px;
-  max-width: 320px;
-  cursor: ${(props) => props.$isInteractive ? "pointer" : "default"};
-  transition: border-color 0.15s ease;
-
-  /* Remove default button styles when used as button */
-  ${(props) => props.$isInteractive && `
-    font: inherit;
-    color: inherit;
-    text-align: left;
-    appearance: none;
-    -webkit-appearance: none;
-
-    &:hover {
-      border-color: #5a5a5c;
-      background-color: #48484a;
-    }
-
-    &:focus-visible {
-      outline: 2px solid #5B9FFF;
-      outline-offset: 2px;
-      border-color: #5B9FFF;
-    }
-
-    &:active {
-      border-color: #6a6a6c;
-    }
-  `}
-`;
-var FileIconContainer = styled7__default.default.div`
-  flex-shrink: 0;
-  width: 32px;
-  height: 32px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 24px;
-  line-height: 1;
-`;
-var FileInfo = styled7__default.default.div`
-  flex: 1;
-  min-width: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-`;
-var FileTitle = styled7__default.default.div`
-  font-size: 14px;
-  font-weight: 500;
-  color: #e5e5e7;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  line-height: 1.4;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-var FileMetadata = styled7__default.default.div`
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  font-size: 12px;
-  color: #8e8e93;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  line-height: 1.4;
-  overflow: hidden;
-`;
-var FileSubtitle = styled7__default.default.span`
-  color: #8e8e93;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-
-  &:last-child {
-    flex-shrink: 0;
-  }
-`;
-var FileAttachment = ({
-  title,
-  subtitle,
-  size,
-  icon = "\u{1F4C4}",
-  onClick,
-  onPress,
-  className,
-  ...ariaProps
-}) => {
-  const ref = react.useRef(null);
-  const isInteractive = !!(onClick || onPress);
-  const handlePress = (e) => {
-    if (onClick) onClick();
-    if (onPress) onPress(e);
-  };
-  const { buttonProps } = button.useButton(
-    {
-      ...ariaProps,
-      onPress: isInteractive ? handlePress : void 0,
-      isDisabled: !isInteractive
-    },
-    ref
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    FileAttachmentContainer,
-    {
-      ...isInteractive ? buttonProps : {},
-      ref: isInteractive ? ref : void 0,
-      className,
-      $isInteractive: isInteractive,
-      as: isInteractive ? "button" : "div",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(FileIconContainer, { children: icon }),
-        /* @__PURE__ */ jsxRuntime.jsxs(FileInfo, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(FileTitle, { children: title }),
-          /* @__PURE__ */ jsxRuntime.jsxs(FileMetadata, { children: [
-            subtitle && /* @__PURE__ */ jsxRuntime.jsx(FileSubtitle, { children: subtitle }),
-            size && subtitle && /* @__PURE__ */ jsxRuntime.jsx(FileSubtitle, { "aria-hidden": "true", children: " \u2022 " }),
-            size && /* @__PURE__ */ jsxRuntime.jsx(FileSubtitle, { children: size })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-var MessageContainer = styled7__default.default.div`
-  display: flex;
-  gap: 12px;
-  align-items: flex-start;
-  padding: 8px 0;
-  max-width: 100%;
-`;
-var AvatarContainer = styled7__default.default.div`
-  flex-shrink: 0;
-`;
-var Avatar2 = styled7__default.default.img`
-  width: 32px;
-  height: 32px;
-  border-radius: 50%;
-  object-fit: cover;
-  background-color: #e5e7eb;
-`;
-var AvatarInitials = styled7__default.default.div`
-  width: 32px;
-  height: 32px;
-  border-radius: 50%;
-  background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
-  color: white;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 12px;
-  font-weight: 600;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-
-  svg {
-    width: 18px;
-    height: 18px;
-  }
-`;
-var ContentContainer = styled7__default.default.div`
-  flex: 1;
-  min-width: 0;
-`;
-var MessageContent = styled7__default.default.div`
-  background-color: #2c2c2e;
-  padding: 12px 16px;
-  border-radius: 16px;
-  border-top-left-radius: 4px;
-  color: #e5e5e7;
-  font-size: 14px;
-  line-height: 1.5;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  word-wrap: break-word;
-  white-space: pre-wrap;
-`;
-var LoadingDots3 = styled7__default.default.div`
-  display: flex;
-  gap: 6px;
-  padding: 12px 16px;
-  background-color: #2c2c2e;
-  border-radius: 16px;
-  border-top-left-radius: 4px;
-  width: fit-content;
-`;
-var bounce = styled7.keyframes`
-  0%, 60%, 100% {
-    transform: translateY(0);
-  }
-  30% {
-    transform: translateY(-8px);
-  }
-`;
-var LoadingDot = styled7__default.default.div`
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  background-color: #8e8e93;
-  animation: ${bounce} 1.4s ease-in-out infinite;
-  animation-delay: ${(props) => props.delay}s;
-`;
-var AttachmentsContainer = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  margin-top: 12px;
-`;
-var AssistantMessage = ({
-  content = "",
-  avatarUrl,
-  avatarInitials: _avatarInitials = "AI",
-  isLoading = false,
-  className,
-  attachments = [],
-  enableMarkdown: _enableMarkdown = false
-}) => {
-  const renderContent = () => {
-    if (isLoading) {
-      return /* @__PURE__ */ jsxRuntime.jsxs(LoadingDots3, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(LoadingDot, { delay: 0 }),
-        /* @__PURE__ */ jsxRuntime.jsx(LoadingDot, { delay: 0.2 }),
-        /* @__PURE__ */ jsxRuntime.jsx(LoadingDot, { delay: 0.4 })
-      ] });
-    }
-    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      content && /* @__PURE__ */ jsxRuntime.jsx(MessageContent, { children: content }),
-      attachments.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(AttachmentsContainer, { children: attachments.map((attachment, index) => /* @__PURE__ */ jsxRuntime.jsx(FileAttachment, { ...attachment }, `${attachment.title}-${index}`)) })
-    ] });
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(MessageContainer, { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(AvatarContainer, { children: avatarUrl ? /* @__PURE__ */ jsxRuntime.jsx(Avatar2, { src: avatarUrl, alt: "Assistant avatar" }) : /* @__PURE__ */ jsxRuntime.jsx(AvatarInitials, { children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 13a4 4 0 0 1 0 8c-2.142 0-4-1.79-4-4h-2a4 4 0 1 1-.535-2h3.07A4 4 0 0 1 17 13M2 12v-2h2V7a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v3h2v2z" }) }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(ContentContainer, { children: renderContent() })
-  ] });
-};
-var MessagesContainer = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  overflow: hidden;
-  background-color: #1c1c1e;
-  padding: 8px;
-  gap: 12px;
-  box-sizing: border-box;
-
-  /* Ensure proper scrolling behavior for child components */
-  position: relative;
-  min-height: 0;
-
-  /* Desktop padding */
-  @media (min-width: 640px) {
-    padding: 12px;
-  }
-`;
-var Messages = ({
-  children,
-  className,
-  ariaLabel = "Messages"
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(MessagesContainer, { className, role: "region", "aria-label": ariaLabel, children });
-};
-Messages.displayName = "Messages";
-var MessagesListContainer = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  max-height: ${(props) => props.$maxHeight};
-  overflow-y: auto;
-  overflow-x: hidden;
-  position: relative;
-  background: #ffffff;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
-  scroll-behavior: smooth;
-
-  /* Custom scrollbar styling */
-  &::-webkit-scrollbar {
-    width: 8px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: #f1f5f9;
-    border-radius: 4px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: #cbd5e1;
-    border-radius: 4px;
-    transition: background 0.2s ease;
-  }
-
-  &::-webkit-scrollbar-thumb:hover {
-    background: #94a3b8;
-  }
-
-  /* Firefox scrollbar styling */
-  scrollbar-width: thin;
-  scrollbar-color: #cbd5e1 #f1f5f9;
-
-  /* Ensure proper rendering on mobile */
-  -webkit-overflow-scrolling: touch;
-`;
-var MessagesListContent = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  padding: 16px;
-  min-height: min-content;
-
-  /* Message styling */
-  .message {
-    display: flex;
-    flex-direction: column;
-    gap: 4px;
-    padding: 12px 16px;
-    border-radius: 8px;
-    max-width: 85%;
-    word-wrap: break-word;
-    animation: messageSlideIn 0.2s ease-out;
-  }
-
-  @keyframes messageSlideIn {
-    from {
-      opacity: 0;
-      transform: translateY(8px);
-    }
-    to {
-      opacity: 1;
-      transform: translateY(0);
-    }
-  }
-
-  /* Role-specific message styling */
-  .message--user {
-    align-self: flex-end;
-    background: #3b82f6;
-    color: #ffffff;
-    border-bottom-right-radius: 4px;
-  }
-
-  .message--assistant {
-    align-self: flex-start;
-    background: #f1f5f9;
-    color: #1e293b;
-    border-bottom-left-radius: 4px;
-  }
-
-  .message--system {
-    align-self: center;
-    background: #fef3c7;
-    color: #92400e;
-    font-size: 0.875rem;
-    font-style: italic;
-    max-width: 100%;
-    text-align: center;
-  }
-`;
-var MessagesList = ({
-  messages,
-  autoScroll = true,
-  className,
-  renderMessage,
-  onScrollTop,
-  maxHeight = "600px"
-}) => {
-  const containerRef = react.useRef(null);
-  const contentRef = react.useRef(null);
-  const isUserScrollingRef = react.useRef(false);
-  const scrollTimeoutRef = react.useRef(null);
-  react.useEffect(() => {
-    if (autoScroll && !isUserScrollingRef.current && containerRef.current) {
-      const container = containerRef.current;
-      container.scrollTop = container.scrollHeight;
-    }
-  }, [messages.length, autoScroll]);
-  const handleScroll = () => {
-    if (!containerRef.current) return;
-    const container = containerRef.current;
-    const isAtBottom = container.scrollHeight - container.scrollTop - container.clientHeight < 10;
-    isUserScrollingRef.current = !isAtBottom;
-    if (scrollTimeoutRef.current) {
-      clearTimeout(scrollTimeoutRef.current);
-    }
-    scrollTimeoutRef.current = setTimeout(() => {
-      isUserScrollingRef.current = false;
-    }, 1e3);
-    if (container.scrollTop === 0 && onScrollTop) {
-      onScrollTop();
-    }
-  };
-  react.useEffect(() => {
-    return () => {
-      if (scrollTimeoutRef.current) {
-        clearTimeout(scrollTimeoutRef.current);
-      }
-    };
-  }, []);
-  const defaultRenderMessage = (message) => /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `message message--${message.role}`,
-      "data-message-id": message.id,
-      "data-role": message.role,
-      children: message.content
-    },
-    message.id
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    MessagesListContainer,
-    {
-      ref: containerRef,
-      onScroll: handleScroll,
-      className,
-      $maxHeight: maxHeight,
-      children: /* @__PURE__ */ jsxRuntime.jsx(MessagesListContent, { ref: contentRef, children: messages.map(renderMessage || defaultRenderMessage) })
-    }
-  );
-};
-var StyledUserMessage2 = styled7__default.default.div`
-  display: flex;
-  justify-content: flex-end;
-  align-items: flex-start;
-  margin: 8px 0;
-  padding: 0 16px;
-  width: 100%;
-`;
-var MessageBubble = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  max-width: 70%;
-  padding: 12px 16px;
-  border-radius: 18px 18px 4px 18px;
-
-  /* User message colors - distinct from assistant messages */
-  background-color: #007AFF;
-  color: #FFFFFF;
-
-  /* Box shadow for depth */
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-
-  /* Smooth transitions */
-  transition: all 0.2s ease-in-out;
-
-  &:hover {
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
-  }
-
-  /* Username styling */
-  strong {
-    font-size: 12px;
-    font-weight: 600;
-    margin-bottom: 4px;
-    opacity: 0.9;
-  }
-`;
-var MessageContent2 = styled7__default.default.p`
-  margin: 0;
-  font-size: 14px;
-  line-height: 1.5;
-  word-wrap: break-word;
-  white-space: pre-wrap;
-`;
-var MessageTime = styled7__default.default.time`
-  font-size: 11px;
-  opacity: 0.7;
-  margin-top: 4px;
-  text-align: right;
-`;
-var UserMessage2 = ({
-  content,
-  timestamp,
-  className,
-  avatarUrl,
-  username
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(StyledUserMessage2, { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(MessageBubble, { children: [
-      username && /* @__PURE__ */ jsxRuntime.jsx("strong", { children: username }),
-      /* @__PURE__ */ jsxRuntime.jsx(MessageContent2, { children: content }),
-      timestamp && /* @__PURE__ */ jsxRuntime.jsx(MessageTime, { children: timestamp })
-    ] }),
-    avatarUrl && /* @__PURE__ */ jsxRuntime.jsx(
-      "img",
-      {
-        src: avatarUrl,
-        alt: username || "User",
-        style: { width: "32px", height: "32px", borderRadius: "50%", marginLeft: "8px" }
-      }
-    )
-  ] });
-};
-var SuggestionsContainer = styled7__default.default.div`
-  display: flex;
-  flex-wrap: wrap;
-  gap: ${({ theme }) => theme?.spacing?.sm ?? "8px"};
-  padding: ${({ theme }) => theme?.spacing?.md ?? "16px"} 0;
-`;
-var StyledSuggestion = styled7__default.default.button`
-  /* Base styles */
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: ${({ theme }) => theme?.spacing?.sm ?? "8px"} ${({ theme }) => theme?.spacing?.md ?? "16px"};
-  font-family: ${({ theme }) => theme?.fonts?.body ?? "system-ui, sans-serif"};
-  font-size: 0.875rem;
-  font-weight: 500;
-  color: ${({ theme }) => theme?.colors?.text ?? "#000000"};
-  background-color: ${({ theme }) => theme?.colors?.surface ?? "#ffffff"};
-  border: 1px solid ${({ theme }) => theme?.colors?.border ?? "#E0E0E0"};
-  border-radius: ${({ theme }) => theme?.radii?.lg ?? "12px"};
-  cursor: pointer;
-  transition: all 0.2s ease-in-out;
-  white-space: nowrap;
-  user-select: none;
-
-  /* Hover state */
-  &:hover:not(:disabled) {
-    background-color: ${({ theme }) => theme?.colors?.border ?? "#E0E0E0"};
-    border-color: ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-    transform: translateY(-1px);
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-  }
-
-  /* Active/Pressed state */
-  &:active:not(:disabled) {
-    transform: translateY(0);
-    box-shadow: none;
-  }
-
-  ${({ $isPressed }) => $isPressed && styled7.css`
-      transform: scale(0.98);
-    `}
-
-  /* Focus state */
-  &:focus-visible {
-    outline: 2px solid ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-    outline-offset: 2px;
-  }
-
-  /* Remove default focus outline */
-  &:focus {
-    outline: none;
-  }
-
-  /* Disabled state */
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-    transform: none;
-  }
-`;
-function Suggestions({ suggestions, onSelect, className }) {
-  if (suggestions.length === 0) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(SuggestionsContainer, { className, role: "list", "aria-label": "Suggested prompts", children: suggestions.map((suggestion) => /* @__PURE__ */ jsxRuntime.jsx(SuggestionChip, { suggestion, onSelect }, suggestion)) });
-}
-function SuggestionChip({ suggestion, onSelect }) {
-  const ref = react.useRef(null);
-  const { buttonProps, isPressed } = button.useButton(
-    {
-      onPress: () => onSelect(suggestion),
-      "aria-label": `Select suggestion: ${suggestion}`
-    },
-    ref
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(StyledSuggestion, { ...buttonProps, ref, $isPressed: isPressed, role: "listitem", children: suggestion });
-}
-Suggestions.displayName = "Suggestions";
-var WindowContainer = styled7__default.default.div`
-  display: flex;
-  flex-direction: column;
-  background-color: #1c1c1e;
-  border-radius: 0;
-  box-shadow: none;
-  overflow: hidden;
-  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
-  position: relative;
-
-  /* Default dimensions */
-  width: ${({ $width }) => $width};
-  height: ${({ $height }) => $height};
-
-  /* Fullscreen state */
-  ${({ $isFullscreen }) => $isFullscreen && styled7.css`
-      width: 100vw;
-      height: 100vh;
-      border-radius: 0;
-      box-shadow: none;
-      position: fixed;
-      top: 0;
-      left: 0;
-      z-index: 1000;
-    `}
-
-  /* Minimized state */
-  ${({ $isMinimized }) => $isMinimized && styled7.css`
-      height: 60px;
-      width: 300px;
-      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-      cursor: pointer;
-
-      /* Hide all content except header when minimized */
-      > *:not(:first-child) {
-        display: none;
-      }
-
-      /* Keep header visible but adjust styling */
-      > *:first-child {
-        border-bottom: none;
-      }
-    `}
-
-  /* Responsive behavior for smaller screens */
-  @media (max-width: 768px) {
-    ${({ $isFullscreen, $isMinimized }) => !$isFullscreen && !$isMinimized && styled7.css`
-        width: 100vw;
-        height: 100vh;
-        border-radius: 0;
-        max-width: 100%;
-        max-height: 100%;
-      `}
-  }
-
-  /* Focus states for accessibility */
-  &:focus-visible {
-    outline: 2px solid ${({ theme }) => theme?.colors?.primary ?? "#0066FF"};
-    outline-offset: 2px;
-  }
-
-  /* Ensure proper stacking context */
-  z-index: ${({ $isFullscreen }) => $isFullscreen ? 1e3 : 100};
-`;
-var Window = ({
-  isMinimized = false,
-  isFullscreen = false,
-  width = "400px",
-  height = "600px",
-  children,
-  className,
-  ariaLabel = "Chat window"
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    WindowContainer,
-    {
-      className,
-      $isMinimized: isMinimized,
-      $isFullscreen: isFullscreen,
-      $width: width,
-      $height: height,
-      role: "dialog",
-      "aria-label": ariaLabel,
-      "aria-modal": "false",
-      children
-    }
-  );
-};
-Window.displayName = "Window";
-
-exports.Actions = Actions;
-exports.AgentState = AgentState;
-exports.AssistantMessage = AssistantMessage;
-exports.AssistantThinking = AssistantThinking;
-exports.Button = Button;
-exports.ChatInput = ChatInput;
-exports.FileAttachment = FileAttachment;
-exports.Footer = Footer;
-exports.Header = Header;
-exports.Input = Input;
-exports.Messages = Messages;
-exports.MessagesList = MessagesList;
-exports.MessagesListContainer = MessagesListContainer;
-exports.MessagesListContent = MessagesListContent;
-exports.Response = Response;
-exports.Suggestions = Suggestions;
-exports.UserMessage = UserMessage;
-exports.UserMessage2 = UserMessage2;
-exports.Window = Window;
-//# sourceMappingURL=chunk-OPWUJP7J.cjs.map
-//# sourceMappingURL=chunk-OPWUJP7J.cjs.map