@shapesos/clay 0.3.1 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/dist/chat.cjs +84 -354
  2. package/dist/chat.cjs.map +1 -1
  3. package/dist/chat.d.cts +13 -24
  4. package/dist/chat.d.ts +13 -24
  5. package/dist/chat.js +10 -4
  6. package/dist/chunk-72TJUKMV.js +1 -0
  7. package/dist/{chunk-P7NISN4V.js → chunk-AEXYOY5H.js} +11 -11
  8. package/dist/chunk-AEXYOY5H.js.map +1 -0
  9. package/dist/{chunk-UKM5VQKW.js → chunk-BIATJTD4.js} +5 -5
  10. package/dist/chunk-BIATJTD4.js.map +1 -0
  11. package/dist/chunk-EPS4LOOW.js +339 -0
  12. package/dist/chunk-EPS4LOOW.js.map +1 -0
  13. package/dist/icon.cjs +12 -12
  14. package/dist/icon.cjs.map +1 -1
  15. package/dist/icon.js +2 -2
  16. package/dist/index.cjs +165 -365
  17. package/dist/index.cjs.map +1 -1
  18. package/dist/index.d.cts +20 -2
  19. package/dist/index.d.ts +20 -2
  20. package/dist/index.js +80 -7
  21. package/dist/index.js.map +1 -1
  22. package/dist/lottie.cjs +5 -5
  23. package/dist/lottie.cjs.map +1 -1
  24. package/dist/lottie.js +1 -1
  25. package/package.json +1 -1
  26. package/dist/chunk-2GFOESHR.js +0 -613
  27. package/dist/chunk-2GFOESHR.js.map +0 -1
  28. package/dist/chunk-7AJSQJQ5.js +0 -1
  29. package/dist/chunk-P7NISN4V.js.map +0 -1
  30. package/dist/chunk-UKM5VQKW.js.map +0 -1
  31. /package/dist/{chunk-7AJSQJQ5.js.map → chunk-72TJUKMV.js.map} +0 -0
package/dist/chunk-2GFOESHR.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/chat/chat-root/chat-root.tsx","../src/chat/chat-context/chat-context.ts","../src/chat/chat-root/chat-root-styles.ts","../src/chat/chat-message-content/chat-message-content.tsx","../src/chat/chat-message-content/chat-message-content-styles.ts","../src/chat/chat-message-actions/chat-message-actions.tsx","../node_modules/@tabler/icons-react/src/defaultAttributes.ts","../node_modules/@tabler/icons-react/src/createReactComponent.ts","../node_modules/@tabler/icons-react/src/icons/IconArrowUp.ts","../node_modules/@tabler/icons-react/src/icons/IconCheck.ts","../node_modules/@tabler/icons-react/src/icons/IconCopy.ts","../node_modules/@tabler/icons-react/src/icons/IconThumbDown.ts","../node_modules/@tabler/icons-react/src/icons/IconThumbUp.ts","../node_modules/@tabler/icons-react/src/icons/IconPlayerStopFilled.ts","../src/chat/hooks/use-copy-to-clipboard.ts","../src/utils/clipboard.ts","../src/chat/chat-message-actions/chat-message-actions-styles.ts","../src/chat/chat-message/chat-message-styles.ts","../src/chat/chat-message/chat-message.tsx","../src/chat/hooks/use-auto-scroll.ts","../src/chat/chat-message-list/chat-message-list-styles.ts","../src/chat/chat-message-list/chat-message-list.tsx","../src/chat/chat-composer/chat-composer.tsx","../src/chat/chat-composer/chat-composer-styles.ts","../src/chat/chat-namespace.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport type { ReactNode } from \"react\";\n\nimport type { ChatMessage, ChatContextValue } from \"../types\";\nimport { ChatContext } from \"../chat-context/chat-context\";\nimport { RootContainer } from \"./chat-root-styles\";\n\nexport interface ChatRootProps {\n messages: ChatMessage[];\n onSendMessage: (content: string) => void;\n isLoading?: boolean;\n onStop?: () => void;\n onCopyMessage?: (messageId: string) => void;\n onThumbUpClick?: (messageId: string, isHelpful: boolean | null) => void;\n onThumbDownClick?: (messageId: string, isHelpful: boolean | null) => void;\n children: ReactNode;\n}\n\nexport function ChatRoot({\n messages,\n onSendMessage,\n isLoading = false,\n onStop,\n onCopyMessage,\n onThumbUpClick,\n onThumbDownClick,\n children,\n}: ChatRootProps) {\n const contextValue = useMemo<ChatContextValue>(\n () => ({ messages, onSendMessage, isLoading, onStop, onCopyMessage, onThumbUpClick, onThumbDownClick }),\n [messages, onSendMessage, isLoading, onStop, onCopyMessage, onThumbUpClick, onThumbDownClick]\n );\n\n return (\n <ChatContext.Provider value={contextValue}>\n <RootContainer>{children}</RootContainer>\n </ChatContext.Provider>\n );\n}\n","import { createContext, useContext } from \"react\";\nimport type { ChatContextValue } from \"../types\";\n\nexport const ChatContext = createContext<ChatContextValue | null>(null);\n\nexport function useChatContext(): ChatContextValue {\n const context = useContext(ChatContext);\n if (!context) {\n throw new Error(\"useChatContext must be used within a Chat.Root component\");\n }\n return context;\n}\n","import styled from \"styled-components\";\n\nexport const RootContainer = styled.div`\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n`;\n","import ReactMarkdown from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\n\nimport { ContentWrapper } from \"./chat-message-content-styles\";\n\ninterface ChatMessageContentProps {\n content: string;\n}\n\nexport function ChatMessageContent({ content }: ChatMessageContentProps) {\n return (\n <ContentWrapper>\n <ReactMarkdown remarkPlugins={[remarkGfm]}>{content}</ReactMarkdown>\n </ContentWrapper>\n );\n}\n","import styled from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { typographyMixin, typographyTypes } from \"../../tokens/typography\";\n\nexport const ContentWrapper = styled.div`\n ${typographyMixin(typographyTypes.GEIST_BODY_XS_MEDIUM)};\n color: ${colors[\"brown-100\"]};\n word-break: break-word;\n\n & p {\n margin: 0;\n }\n\n & p + p {\n margin-top: 8px;\n }\n\n & ul,\n & ol {\n margin: 4px 0;\n padding-left: 20px;\n }\n\n & a {\n color: ${colors[\"brown-100\"]};\n text-decoration: underline;\n }\n\n & pre {\n overflow-x: auto;\n padding: 8px;\n margin: 4px 0;\n background: ${colors[\"brown-10\"]};\n border: 1px solid ${colors[\"brown-alpha-12\"]};\n border-radius: 8px;\n }\n\n & pre code {\n padding: 0;\n background: none;\n border-radius: 0;\n }\n\n & code {\n padding: 2px 4px;\n background: ${colors[\"brown-10\"]};\n border-radius: 4px;\n }\n\n & table {\n border-collapse: collapse;\n margin: 8px 0;\n width: 100%;\n }\n\n & th,\n & td {\n border: 1px solid ${colors[\"brown-alpha-12\"]};\n padding: 6px 12px;\n text-align: left;\n }\n\n & th {\n background: ${colors[\"brown-10\"]};\n font-weight: 600;\n }\n\n & blockquote {\n margin: 4px 0;\n padding-left: 12px;\n border-left: 3px solid ${colors[\"brown-30\"]};\n color: ${colors[\"brown-70\"]};\n }\n`;\n","import { useCallback } from \"react\";\nimport { IconCopy, IconCheck, IconThumbUp, IconThumbDown } from \"@tabler/icons-react\";\n\nimport { IconButton } from \"../../icon-button/icon-button\";\nimport { useChatContext } from \"../chat-context/chat-context\";\nimport { useCopyToClipboard } from \"../hooks/use-copy-to-clipboard\";\nimport type { MessageRole } from \"../types\";\nimport { ActionsContainer } from \"./chat-message-actions-styles\";\n\ninterface ChatMessageActionsProps {\n messageId: string;\n content: string;\n role: MessageRole;\n isHelpful?: boolean | null;\n}\n\nexport function ChatMessageActions({ messageId, content, role, isHelpful }: ChatMessageActionsProps) {\n const { onCopyMessage, onThumbUpClick, onThumbDownClick } = useChatContext();\n const { isCopied, copy } = useCopyToClipboard();\n\n const handleCopy = useCallback(() => {\n copy(content);\n onCopyMessage?.(messageId);\n }, [content, messageId, copy, onCopyMessage]);\n\n const handleThumbUp = useCallback(() => {\n onThumbUpClick?.(messageId, isHelpful === true ? null : true);\n }, [messageId, isHelpful, onThumbUpClick]);\n\n const handleThumbDown = useCallback(() => {\n onThumbDownClick?.(messageId, isHelpful === false ? null : false);\n }, [messageId, isHelpful, onThumbDownClick]);\n\n const isAssistant = role === \"assistant\";\n const hasFeedback = isAssistant && (onThumbUpClick || onThumbDownClick);\n\n return (\n <ActionsContainer>\n <IconButton\n icon={isCopied ? IconCheck : IconCopy}\n onClick={handleCopy}\n aria-label={isCopied ? \"Copied\" : \"Copy message\"}\n />\n\n {hasFeedback && (\n <IconButton\n icon={IconThumbUp}\n onClick={handleThumbUp}\n isSelected={isHelpful === true}\n aria-label=\"Good response\"\n />\n )}\n\n {hasFeedback && (\n <IconButton\n icon={IconThumbDown}\n onClick={handleThumbDown}\n isSelected={isHelpful === false}\n aria-label=\"Bad response\"\n />\n )}\n </ActionsContainer>\n );\n}\n","export default {\n outline: {\n xmlns: 'http://www.w3.org/2000/svg',\n width: 24,\n height: 24,\n viewBox: '0 0 24 24',\n fill: 'none',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n },\n filled: {\n xmlns: 'http://www.w3.org/2000/svg',\n width: 24,\n height: 24,\n viewBox: '0 0 24 24',\n fill: 'currentColor',\n stroke: 'none',\n },\n};\n","import { forwardRef, createElement } from 'react';\nimport defaultAttributes from './defaultAttributes';\nimport type { IconNode, IconProps, Icon } from './types';\n\nconst createReactComponent = (\n type: 'outline' | 'filled',\n iconName: string,\n iconNamePascal: string,\n iconNode: IconNode,\n) => {\n const Component = forwardRef<SVGSVGElement, IconProps>(\n (\n { color = 'currentColor', size = 24, stroke = 2, title, className, children, ...rest }: IconProps,\n ref,\n ) =>\n createElement(\n 'svg',\n {\n ref,\n ...defaultAttributes[type],\n width: size,\n height: size,\n className: [`tabler-icon`, `tabler-icon-${iconName}`, className].join(' '),\n ...(type === 'filled'\n ? {\n fill: color,\n }\n : {\n strokeWidth: stroke,\n stroke: color,\n }),\n ...rest,\n },\n [\n title && createElement('title', { key: 'svg-title' }, title),\n ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...(Array.isArray(children) ? children : [children]),\n ],\n ),\n );\n\n Component.displayName = `${iconNamePascal}`;\n\n return Component;\n};\n\nexport default createReactComponent;\n","import createReactComponent from '../createReactComponent';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [[\"path\",{\"d\":\"M12 5l0 14\",\"key\":\"svg-0\"}],[\"path\",{\"d\":\"M18 11l-6 -6\",\"key\":\"svg-1\"}],[\"path\",{\"d\":\"M6 11l6 -6\",\"key\":\"svg-2\"}]]\n\nconst IconArrowUp = createReactComponent('outline', 'arrow-up', 'ArrowUp', __iconNode);\n\nexport default IconArrowUp;","import createReactComponent from '../createReactComponent';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [[\"path\",{\"d\":\"M5 12l5 5l10 -10\",\"key\":\"svg-0\"}]]\n\nconst IconCheck = createReactComponent('outline', 'check', 'Check', __iconNode);\n\nexport default IconCheck;","import createReactComponent from '../createReactComponent';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [[\"path\",{\"d\":\"M7 9.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667l0 -8.666\",\"key\":\"svg-0\"}],[\"path\",{\"d\":\"M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1\",\"key\":\"svg-1\"}]]\n\nconst IconCopy = createReactComponent('outline', 'copy', 'Copy', __iconNode);\n\nexport default IconCopy;","import createReactComponent from '../createReactComponent';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [[\"path\",{\"d\":\"M7 13v-8a1 1 0 0 0 -1 -1h-2a1 1 0 0 0 -1 1v7a1 1 0 0 0 1 1h3a4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2 -2l-1 -5a2 3 0 0 0 -2 -2h-7a3 3 0 0 0 -3 3\",\"key\":\"svg-0\"}]]\n\nconst IconThumbDown = createReactComponent('outline', 'thumb-down', 'ThumbDown', __iconNode);\n\nexport default IconThumbDown;","import createReactComponent from '../createReactComponent';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [[\"path\",{\"d\":\"M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3\",\"key\":\"svg-0\"}]]\n\nconst IconThumbUp = createReactComponent('outline', 'thumb-up', 'ThumbUp', __iconNode);\n\nexport default IconThumbUp;","import createReactComponent from '../createReactComponent';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [[\"path\",{\"d\":\"M17 4h-10a3 3 0 0 0 -3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3 -3v-10a3 3 0 0 0 -3 -3z\",\"key\":\"svg-0\"}]]\n\nconst IconPlayerStopFilled = createReactComponent('filled', 'player-stop-filled', 'PlayerStopFilled', __iconNode);\n\nexport default IconPlayerStopFilled;","import { useState, useCallback, useRef, useEffect } from \"react\";\n\nimport { copyToClipboard } from \"../../utils/clipboard\";\n\nconst RESET_DELAY_MS = 2000;\n\ninterface UseCopyToClipboardResult {\n isCopied: boolean;\n copy: (text: string) => void;\n}\n\nexport function useCopyToClipboard(): UseCopyToClipboardResult {\n const [isCopied, setIsCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n return () => {\n if (timeoutRef.current) clearTimeout(timeoutRef.current);\n };\n }, []);\n\n const copy = useCallback((text: string) => {\n copyToClipboard(text, {\n onSuccess: () => {\n setIsCopied(true);\n if (timeoutRef.current) clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => {\n setIsCopied(false);\n timeoutRef.current = null;\n }, RESET_DELAY_MS);\n },\n });\n }, []);\n\n return { isCopied, copy };\n}\n","interface CopyToClipboardOptions {\n onSuccess?: () => void;\n onFailure?: (error: unknown) => void;\n}\n\nexport function copyToClipboard(text: string, options?: CopyToClipboardOptions): void {\n navigator.clipboard.writeText(text).then(\n () => options?.onSuccess?.(),\n (error) => options?.onFailure?.(error)\n );\n}\n","import styled from \"styled-components\";\n\nexport const ActionsContainer = styled.div`\n display: flex;\n gap: 2px;\n margin-top: 4px;\n opacity: 0;\n pointer-events: none;\n transition: opacity 150ms ease;\n`;\n","import styled from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { typographyMixin, typographyTypes } from \"../../tokens/typography\";\nimport { ActionsContainer } from \"../chat-message-actions/chat-message-actions-styles\";\nimport type { MessageRole } from \"../types\";\n\nexport const MessageRow = styled.div<{ $role: MessageRole }>`\n display: flex;\n justify-content: ${({ $role }) => ($role === \"user\" ? \"flex-end\" : \"flex-start\")};\n`;\n\nexport const MessageContainer = styled.div<{ $role: MessageRole }>`\n display: flex;\n flex-direction: column;\n align-items: ${({ $role }) => ($role === \"user\" ? \"flex-end\" : \"flex-start\")};\n max-width: 90%;\n\n &:hover ${ActionsContainer} {\n opacity: 1;\n pointer-events: auto;\n }\n`;\n\nexport const MessageBubble = styled.div<{ $role: MessageRole }>`\n ${typographyMixin(typographyTypes.GEIST_BODY_XS_MEDIUM)};\n color: ${colors[\"brown-100\"]};\n background: ${({ $role }) => ($role === \"user\" ? colors.white : \"transparent\")};\n padding: ${({ $role }) => ($role === \"user\" ? \"12px 16px\" : \"0\")};\n border-radius: ${({ $role }) => ($role === \"user\" ? \"16px\" : \"0\")};\n`;\n","import type { ChatMessage as ChatMessageType } from \"../types\";\nimport { ChatMessageContent } from \"../chat-message-content/chat-message-content\";\nimport { ChatMessageActions } from \"../chat-message-actions/chat-message-actions\";\nimport { MessageRow, MessageBubble, MessageContainer } from \"./chat-message-styles\";\n\ninterface ChatMessageProps {\n message: ChatMessageType;\n}\n\nexport function ChatMessage({ message }: ChatMessageProps) {\n return (\n <MessageRow $role={message.role}>\n <MessageContainer $role={message.role}>\n <MessageBubble $role={message.role}>\n <ChatMessageContent content={message.content} />\n </MessageBubble>\n <ChatMessageActions\n messageId={message.id}\n content={message.content}\n role={message.role}\n isHelpful={message.isHelpful}\n />\n </MessageContainer>\n </MessageRow>\n );\n}\n","import { useRef, useState, useEffect, useLayoutEffect, useCallback } from \"react\";\n\ninterface UseAutoScrollResult {\n scrollContainerRef: React.RefObject<HTMLDivElement | null>;\n sentinelRef: React.RefObject<HTMLDivElement | null>;\n isAtBottom: boolean;\n scrollToBottom: () => void;\n}\n\nexport function useAutoScroll(messageCount: number): UseAutoScrollResult {\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const sentinelRef = useRef<HTMLDivElement>(null);\n const [isAtBottom, setIsAtBottom] = useState(true);\n const prevMessageCountRef = useRef(messageCount);\n const hasInitializedRef = useRef(false);\n\n // Phase 1: snap before paint — gets close but styled-components CSS\n // for the sentinel may not be injected yet, so scrollHeight can be short.\n useLayoutEffect(() => {\n const el = scrollContainerRef.current;\n if (el) {\n el.scrollTop = el.scrollHeight;\n }\n }, []);\n\n // Phase 2: snap after paint + rAF — styles are fully computed,\n // scrollHeight now includes the sentinel's height.\n useEffect(() => {\n if (!hasInitializedRef.current) {\n hasInitializedRef.current = true;\n requestAnimationFrame(() => {\n const el = scrollContainerRef.current;\n if (el) {\n el.scrollTop = el.scrollHeight;\n }\n });\n }\n }, []);\n\n // Track sentinel visibility for isAtBottom state\n useEffect(() => {\n const sentinel = sentinelRef.current;\n const scrollContainer = scrollContainerRef.current;\n if (!sentinel || !scrollContainer) return;\n\n const observer = new IntersectionObserver(\n ([entry]) => {\n setIsAtBottom(entry.isIntersecting);\n },\n { root: scrollContainer, threshold: 0 }\n );\n\n observer.observe(sentinel);\n return () => observer.disconnect();\n }, []);\n\n // Smooth scroll to bottom when new messages are added\n useEffect(() => {\n if (!hasInitializedRef.current) return;\n\n if (messageCount > prevMessageCountRef.current) {\n requestAnimationFrame(() => {\n const el = scrollContainerRef.current;\n if (el) {\n el.scrollTo({ top: el.scrollHeight, behavior: \"smooth\" });\n }\n });\n }\n prevMessageCountRef.current = messageCount;\n }, [messageCount]);\n\n const scrollToBottom = useCallback(() => {\n const el = scrollContainerRef.current;\n if (el) {\n el.scrollTo({ top: el.scrollHeight, behavior: \"smooth\" });\n }\n }, []);\n\n return { scrollContainerRef, sentinelRef, isAtBottom, scrollToBottom };\n}\n","import styled from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\n\nexport const ListContainer = styled.div`\n display: flex;\n flex-direction: column;\n flex: 1;\n overflow-y: auto;\n\n &::-webkit-scrollbar {\n width: 6px;\n }\n\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &::-webkit-scrollbar-thumb {\n background: ${colors[\"brown-30\"]};\n border-radius: 3px;\n }\n`;\n\nexport const MessagesList = styled.div`\n display: flex;\n flex-direction: column;\n gap: 40px;\n padding: 0 16px 32px 16px;\n`;\n\nexport const ScrollSentinel = styled.div`\n flex-shrink: 0;\n height: 16px;\n`;\n","import { useChatContext } from \"../chat-context/chat-context\";\nimport { ChatMessage } from \"../chat-message/chat-message\";\nimport { useAutoScroll } from \"../hooks/use-auto-scroll\";\nimport { ListContainer, MessagesList, ScrollSentinel } from \"./chat-message-list-styles\";\n\nexport function ChatMessageList() {\n const { messages } = useChatContext();\n const { scrollContainerRef, sentinelRef } = useAutoScroll(messages.length);\n\n return (\n <ListContainer ref={scrollContainerRef} data-testid=\"chat-list-container\">\n <MessagesList>\n {messages.map((message) => (\n <ChatMessage key={message.id} message={message} />\n ))}\n </MessagesList>\n <ScrollSentinel ref={sentinelRef} data-testid=\"chat-scroll-sentinel\" />\n </ListContainer>\n );\n}\n","import { useState, useCallback, useRef, useEffect } from \"react\";\nimport type { KeyboardEvent, ChangeEvent } from \"react\";\nimport { IconArrowUp, IconPlayerStopFilled } from \"@tabler/icons-react\";\n\nimport { Icon } from \"../../icon/icon\";\nimport { useChatContext } from \"../chat-context/chat-context\";\nimport { ComposerContainer, TextArea, SendButton } from \"./chat-composer-styles\";\n\nexport interface ChatComposerProps {\n placeholder?: string;\n}\n\nexport function ChatComposer({ placeholder = \"Type a message...\" }: ChatComposerProps) {\n const { onSendMessage, isLoading, onStop } = useChatContext();\n const [value, setValue] = useState(\"\");\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const isEmpty = value.trim().length === 0;\n\n const resizeTextArea = useCallback(() => {\n const el = textAreaRef.current;\n if (!el) return;\n el.style.height = \"auto\";\n el.style.height = `${el.scrollHeight}px`;\n }, []);\n\n useEffect(() => {\n resizeTextArea();\n }, [value, resizeTextArea]);\n\n useEffect(() => {\n textAreaRef.current?.focus();\n }, []);\n\n const handleSend = useCallback(() => {\n const trimmed = value.trim();\n if (!trimmed) return;\n onSendMessage(trimmed);\n setValue(\"\");\n requestAnimationFrame(() => textAreaRef.current?.focus());\n }, [value, onSendMessage]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n handleSend();\n }\n },\n [handleSend]\n );\n\n const handleChange = useCallback((e: ChangeEvent<HTMLTextAreaElement>) => {\n setValue(e.target.value);\n }, []);\n\n const handleButtonClick = useCallback(() => {\n if (isLoading && onStop) {\n onStop();\n } else {\n handleSend();\n }\n }, [isLoading, onStop, handleSend]);\n\n return (\n <ComposerContainer>\n <TextArea\n ref={textAreaRef}\n value={value}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n rows={1}\n />\n <SendButton\n onClick={handleButtonClick}\n disabled={!isLoading && isEmpty}\n aria-label={isLoading ? \"Stop generating\" : \"Send message\"}\n >\n {isLoading ? <Icon icon={IconPlayerStopFilled} size={16} /> : <Icon icon={IconArrowUp} size={16} />}\n </SendButton>\n </ComposerContainer>\n );\n}\n","import styled from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { typographyMixin, typographyTypes } from \"../../tokens/typography\";\n\nexport const ComposerContainer = styled.div`\n position: relative;\n background: ${colors.white};\n border-radius: 12px;\n box-shadow: 0 0 4px 0 ${colors[\"brown-alpha-12\"]};\n padding: 8px 0;\n`;\n\nexport const TextArea = styled.textarea`\n display: block;\n width: 100%;\n resize: none;\n border: none;\n background: transparent;\n ${typographyMixin(typographyTypes.GEIST_BODY_XS_MEDIUM)};\n color: ${colors[\"brown-90\"]};\n padding: 4px 46px 4px 16px;\n min-height: 20px;\n max-height: 200px;\n overflow-y: auto;\n box-sizing: border-box;\n\n &::placeholder {\n color: ${colors[\"brown-60\"]};\n }\n\n &:focus {\n outline: none;\n }\n`;\n\nexport const SendButton = styled.button`\n position: absolute;\n bottom: 8px;\n right: 8px;\n width: 30px;\n height: 30px;\n border: none;\n border-radius: 12px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n background: ${colors[\"brown-100\"]};\n color: ${colors.white};\n transition: background-color 75ms;\n padding: 0;\n\n &:disabled {\n background: ${colors[\"brown-50\"]};\n cursor: default;\n }\n`;\n","import { ChatRoot } from \"./chat-root/chat-root\";\nimport { ChatMessageList } from \"./chat-message-list/chat-message-list\";\nimport { ChatComposer } from \"./chat-composer/chat-composer\";\n\nexport const Chat = {\n Root: ChatRoot,\n MessageList: ChatMessageList,\n Composer: ChatComposer,\n};\n"],"mappings":"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","names":["styled","styled","jsx","useCallback","__iconNode","__iconNode","__iconNode","__iconNode","__iconNode","styled","jsx","useCallback","styled","styled","jsx","jsxs","useRef","useState","useEffect","useCallback","styled","styled","jsx","jsxs","useState","useCallback","useRef","useEffect","styled","styled","jsx","jsxs","useState","useRef","useCallback","useEffect"]}
package/dist/chunk-7AJSQJQ5.js DELETED
@@ -1 +0,0 @@
1
- //# sourceMappingURL=chunk-7AJSQJQ5.js.map
package/dist/chunk-P7NISN4V.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/icon/icon.tsx","../src/icon/icon-styles.ts","../src/icon-button/icon-button.tsx","../src/icon-button/icon-button-styles.ts"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { IconWrapper, getStrokeWidth } from \"./icon-styles\";\nimport type { IconProps } from \"./types\";\n\nconst DEFAULT_SIZE = 16;\n\nexport const Icon = forwardRef<HTMLSpanElement, IconProps>(function Icon(\n { icon: IconComponent, size = DEFAULT_SIZE, color, className, \"aria-label\": ariaLabel },\n ref\n) {\n return (\n <IconWrapper\n ref={ref}\n className={className}\n $color={color}\n aria-label={ariaLabel}\n role={ariaLabel ? \"img\" : undefined}\n >\n <IconComponent width={size} height={size} strokeWidth={getStrokeWidth(size)} />\n </IconWrapper>\n );\n});\n","import styled from \"styled-components\";\n\nexport const STROKE_WIDTH_BY_SIZE: Record<number, number> = {\n 12: 1.2,\n 14: 1.2,\n 16: 1.8,\n 18: 1.8,\n 20: 1.8,\n 24: 1.8,\n};\n\nexport const DEFAULT_STROKE_WIDTH = 1.8;\n\nexport function getStrokeWidth(size: number): number {\n return STROKE_WIDTH_BY_SIZE[size] ?? DEFAULT_STROKE_WIDTH;\n}\n\nexport const IconWrapper = styled.span<{ $color?: string }>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: ${({ $color }) => $color ?? \"currentColor\"};\n flex-shrink: 0;\n`;\n","import { forwardRef } from \"react\";\n\nimport { Icon } from \"../icon/icon\";\nimport { Button } from \"./icon-button-styles\";\nimport type { IconButtonProps, IconButtonSize } from \"./types\";\n\nconst ICON_SIZE_BY_BUTTON_SIZE: Record<IconButtonSize, number> = {\n small: 14,\n medium: 16,\n};\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(function IconButton(\n { icon, size = \"small\", isSelected = false, disabled = false, onClick, className, \"aria-label\": ariaLabel },\n ref\n) {\n return (\n <Button\n ref={ref}\n className={className}\n $size={size}\n $isSelected={isSelected}\n disabled={disabled}\n onClick={disabled ? undefined : onClick}\n aria-label={ariaLabel}\n >\n <Icon icon={icon} size={ICON_SIZE_BY_BUTTON_SIZE[size]} />\n </Button>\n );\n});\n","import styled from \"styled-components\";\n\nimport { colors } from \"../tokens/colors\";\nimport type { IconButtonSize } from \"./types\";\n\nconst DIMENSIONS: Record<IconButtonSize, number> = {\n small: 28,\n medium: 32,\n};\n\nconst BORDER_RADIUS: Record<IconButtonSize, number> = {\n small: 6,\n medium: 10,\n};\n\nexport const Button = styled.button<{\n $size: IconButtonSize;\n $isSelected: boolean;\n}>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: ${({ $size }) => DIMENSIONS[$size]}px;\n height: ${({ $size }) => DIMENSIONS[$size]}px;\n padding: 0;\n border: none;\n border-radius: ${({ $size }) => BORDER_RADIUS[$size]}px;\n background: ${({ $isSelected }) => ($isSelected ? colors[\"brown-40\"] : \"transparent\")};\n color: ${colors[\"brown-100\"]};\n cursor: pointer;\n transition: background-color 100ms ease;\n\n &:hover {\n background: ${({ $isSelected }) => ($isSelected ? colors[\"brown-40\"] : colors[\"brown-20\"])};\n }\n\n &:active {\n background: ${colors[\"brown-40\"]};\n }\n\n &:disabled {\n color: ${colors[\"brown-50\"]};\n background: transparent;\n cursor: not-allowed;\n }\n`;\n"],"mappings":";;;;;AAAA,SAAS,kBAAkB;;;ACA3B,OAAO,YAAY;AAEZ,IAAM,uBAA+C;AAAA,EAC1D,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,IAAM,uBAAuB;AAE7B,SAAS,eAAe,MAAsB;AACnD,SAAO,qBAAqB,IAAI,KAAK;AACvC;AAEO,IAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA,WAIvB,CAAC,EAAE,OAAO,MAAM,UAAU,cAAc;AAAA;AAAA;;;ADF7C;AAdN,IAAM,eAAe;AAEd,IAAM,OAAO,WAAuC,SAASA,MAClE,EAAE,MAAM,eAAe,OAAO,cAAc,OAAO,WAAW,cAAc,UAAU,GACtF,KACA;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,cAAY;AAAA,MACZ,MAAM,YAAY,QAAQ;AAAA,MAE1B,8BAAC,iBAAc,OAAO,MAAM,QAAQ,MAAM,aAAa,eAAe,IAAI,GAAG;AAAA;AAAA,EAC/E;AAEJ,CAAC;;;AEtBD,SAAS,cAAAC,mBAAkB;;;ACA3B,OAAOC,aAAY;AAKnB,IAAM,aAA6C;AAAA,EACjD,OAAO;AAAA,EACP,QAAQ;AACV;AAEA,IAAM,gBAAgD;AAAA,EACpD,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,IAAM,SAASC,QAAO;AAAA;AAAA;AAAA;AAAA,WAOlB,CAAC,EAAE,MAAM,MAAM,WAAW,KAAK,CAAC;AAAA,YAC/B,CAAC,EAAE,MAAM,MAAM,WAAW,KAAK,CAAC;AAAA;AAAA;AAAA,mBAGzB,CAAC,EAAE,MAAM,MAAM,cAAc,KAAK,CAAC;AAAA,gBACtC,CAAC,EAAE,YAAY,MAAO,cAAc,OAAO,UAAU,IAAI,aAAc;AAAA,WAC5E,OAAO,WAAW,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKZ,CAAC,EAAE,YAAY,MAAO,cAAc,OAAO,UAAU,IAAI,OAAO,UAAU,CAAE;AAAA;AAAA;AAAA;AAAA,kBAI5E,OAAO,UAAU,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvB,OAAO,UAAU,CAAC;AAAA;AAAA;AAAA;AAAA;;;ADhBzB,gBAAAC,YAAA;AAnBN,IAAM,2BAA2D;AAAA,EAC/D,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,IAAM,aAAaC,YAA+C,SAASC,YAChF,EAAE,MAAM,OAAO,SAAS,aAAa,OAAO,WAAW,OAAO,SAAS,WAAW,cAAc,UAAU,GAC1G,KACA;AACA,SACE,gBAAAF;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,aAAa;AAAA,MACb;AAAA,MACA,SAAS,WAAW,SAAY;AAAA,MAChC,cAAY;AAAA,MAEZ,0BAAAA,KAAC,QAAK,MAAY,MAAM,yBAAyB,IAAI,GAAG;AAAA;AAAA,EAC1D;AAEJ,CAAC;","names":["Icon","forwardRef","styled","styled","jsx","forwardRef","IconButton"]}