@agentiffai/design 0.1.10 → 0.1.12

package/dist/index.d.cts

@@ -1,11 +1,12 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { AriaTextFieldProps } from '@react-aria/textfield';
-import React__default from 'react';
+import * as React from 'react';
+import React__default, { ReactNode } from 'react';
 export { ActionButtons, ActionButtonsProps, BrandType, CategoryItem, CategoryNav, CategoryNavProps, CategorySubItem, Icon, IconName, IconNames, IconProps, Layout, LayoutProps, NavHorizontal, NavHorizontalProps, NavVertical, NavVerticalProps, OAuthConnectionData, PaneMenus, PaneMenusProps, PaneSectionHeader, PaneSectionHeaderProps, ServiceBrand, ServiceIcon, ServiceIconProps, WorkflowStatusCard, WorkflowStatusCardProps } from './layout/index.cjs';
 import { AriaButtonProps } from '@react-aria/button';
 export { GlobalStyle, darkTheme, lightTheme, tokens } from './theme/index.cjs';
-export { A as Action, c as ActionVariant, d as Actions, a as ActionsLayout, b as ActionsProps, f as AgentState, e as AgentStateProps, q as AssistantMessage, m as AssistantMessageProps, i as Button, B as ButtonProps, g as ButtonSize, h as ButtonVariant, w as CopilotUserMessage, U as CopilotUserMessageProps, r as FileAttachment, n as FileAttachmentProps, j as Footer, F as FooterProps, k as Header, H as HeaderProps, l as Input, I as InputProps, M as Message, s as Messages, t as MessagesList, u as MessagesListContainer, v as MessagesListContent, o as MessagesListProps, p as MessagesProps, x as Response, R as ResponseProps, y as StreamErrorMessage, S as StreamErrorMessageProps, E as StreamStatusIndicator, D as StreamStatusIndicatorProps, C as StreamingText, z as StreamingTextProps, J as Suggestions, G as SuggestionsProps, K as Window, W as WindowProps } from './Window-CF5y1_Og.cjs';
-export { FacebookIcon, FacebookIconProps, FacebookIconVariant, GmailIcon, GmailIconProps, GmailIconVariant, InstagramIcon, InstagramIconProps, InstagramVariant, LinkedInIcon, LinkedInIconProps, LinkedInIconVariant, RedditIcon, RedditIconProps, RedditIconVariant, SlackIcon, SlackIconProps, SlackIconVariant, TelegramIcon, TelegramIconProps, TelegramIconVariant, WhatsAppIcon, WhatsAppIconProps, WhatsAppIconVariant, XIcon, XIconProps, XIconVariant, YouTubeIcon, YouTubeIconProps, YouTubeIconVariant } from './icons/index.cjs';
+export { A as Action, c as ActionVariant, d as Actions, a as ActionsLayout, b as ActionsProps, f as AgentState, e as AgentStateProps, q as AssistantMessage, m as AssistantMessageProps, i as Button, B as ButtonProps, g as ButtonSize, h as ButtonVariant, w as CopilotUserMessage, U as CopilotUserMessageProps, r as FileAttachment, n as FileAttachmentProps, j as Footer, F as FooterProps, k as Header, H as HeaderProps, l as Input, I as InputProps, M as Message, s as Messages, t as MessagesList, u as MessagesListContainer, v as MessagesListContent, o as MessagesListProps, p as MessagesProps, x as Response, R as ResponseProps, y as StreamErrorMessage, S as StreamErrorMessageProps, E as StreamStatusIndicator, D as StreamStatusIndicatorProps, C as StreamingText, z as StreamingTextProps, J as Suggestions, G as SuggestionsProps, K as Window, W as WindowProps } from './Window-BcTRumpc.cjs';
+export { FacebookIcon, FacebookIconProps, FacebookIconVariant, GmailIcon, GmailIconProps, GmailIconVariant, InstagramIcon, InstagramIconProps, InstagramVariant, LinkedInIcon, LinkedInIconProps, LinkedInIconVariant, PostizIcon, PostizIconProps, PostizIconVariant, RedditIcon, RedditIconProps, RedditIconVariant, SlackIcon, SlackIconProps, SlackIconVariant, TelegramIcon, TelegramIconProps, TelegramIconVariant, WhatsAppIcon, WhatsAppIconProps, WhatsAppIconVariant, XIcon, XIconProps, XIconVariant, YouTubeIcon, YouTubeIconProps, YouTubeIconVariant } from './icons/index.cjs';
 export { WorkflowCard, WorkflowCardProps, WorkflowErrorAlert, WorkflowErrorAlertProps, WorkflowIntegration, WorkflowProgressBar, WorkflowProgressBarProps, WorkflowResultPanel, WorkflowResultPanelProps, WorkflowStatusBadge, WorkflowStatusBadgeProps } from './workflow/index.cjs';
 import '@react-types/button';
 import 'styled-components';
@@ -58,7 +59,8 @@ interface ChatInputProps extends Omit<AriaTextFieldProps, 'onChange'> {
  *
  * Features:
  * - Horizontal pill-shaped suggestion buttons with minimal design
- * - Single-line input with submit button
+ * - Auto-expanding multiline input (up to ~6 lines, then scrolls)
+ * - Enter to submit, Shift+Enter for new line
  * - React ARIA for accessibility
  * - Keyboard navigation support
  * - Clean, modern design matching vendor image
@@ -163,7 +165,7 @@ interface UserMessageProps extends AriaButtonProps {
     /**
      * The message text to display
      */
-    children: React.ReactNode;
+    children: ReactNode;
     /**
      * Additional CSS class name
      */
@@ -184,6 +186,8 @@ interface UserMessageProps extends AriaButtonProps {
  * pill-shaped design with fully rounded ends, and white text. It uses React ARIA
  * for accessibility and supports keyboard navigation.
  *
+ * Memoized to prevent unnecessary re-renders during parent updates.
+ *
  * @example
  * ```tsx
  * <UserMessage onPress={() => console.log('clicked')}>
@@ -191,10 +195,8 @@ interface UserMessageProps extends AriaButtonProps {
  * </UserMessage>
  * ```
  */
-declare function UserMessage({ children, className, isPressed, onPress, ...ariaProps }: UserMessageProps): react_jsx_runtime.JSX.Element;
-declare namespace UserMessage {
-    var displayName: string;
-}
+declare function UserMessageBase({ children, className, isPressed, onPress, ...ariaProps }: UserMessageProps): react_jsx_runtime.JSX.Element;
+declare const UserMessage: React.MemoExoticComponent<typeof UserMessageBase>;
 
 /**
  * ConnectionStatusBadge Component
@@ -475,6 +477,10 @@ interface PlatformGridProps {
     onEditContentChange?: (content: string) => void;
     /** Whether content is being loaded/generated */
     isLoading?: boolean;
+    /** Currently active/selected post index */
+    activeIndex?: number;
+    /** Callback when a post is clicked/selected */
+    onActiveChange?: (index: number) => void;
 }
 /**
  * PlatformGrid displays all proposed posts in a responsive grid layout.
@@ -504,7 +510,7 @@ interface SocialMediaCanvasProps {
     emptyTitle?: string;
     /** Empty state description */
     emptyDescription?: string;
-    /** Callback when active post changes in carousel mode */
+    /** Callback when active post changes */
     onActiveChange?: (index: number) => void;
     /** Whether to show the view mode toggle */
     showViewToggle?: boolean;
@@ -516,6 +522,8 @@ interface SocialMediaCanvasProps {
     onEditContentChange?: (content: string) => void;
     /** Whether content is being loaded/generated */
     isLoading?: boolean;
+    /** Currently active post index (for grid mode) */
+    activeIndex?: number;
 }
 /**
  * SocialMediaCanvas displays social media post previews in carousel or grid mode.

package/dist/index.d.ts

@@ -1,11 +1,12 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { AriaTextFieldProps } from '@react-aria/textfield';
-import React__default from 'react';
+import * as React from 'react';
+import React__default, { ReactNode } from 'react';
 export { ActionButtons, ActionButtonsProps, BrandType, CategoryItem, CategoryNav, CategoryNavProps, CategorySubItem, Icon, IconName, IconNames, IconProps, Layout, LayoutProps, NavHorizontal, NavHorizontalProps, NavVertical, NavVerticalProps, OAuthConnectionData, PaneMenus, PaneMenusProps, PaneSectionHeader, PaneSectionHeaderProps, ServiceBrand, ServiceIcon, ServiceIconProps, WorkflowStatusCard, WorkflowStatusCardProps } from './layout/index.js';
 import { AriaButtonProps } from '@react-aria/button';
 export { GlobalStyle, darkTheme, lightTheme, tokens } from './theme/index.js';
-export { A as Action, c as ActionVariant, d as Actions, a as ActionsLayout, b as ActionsProps, f as AgentState, e as AgentStateProps, q as AssistantMessage, m as AssistantMessageProps, i as Button, B as ButtonProps, g as ButtonSize, h as ButtonVariant, w as CopilotUserMessage, U as CopilotUserMessageProps, r as FileAttachment, n as FileAttachmentProps, j as Footer, F as FooterProps, k as Header, H as HeaderProps, l as Input, I as InputProps, M as Message, s as Messages, t as MessagesList, u as MessagesListContainer, v as MessagesListContent, o as MessagesListProps, p as MessagesProps, x as Response, R as ResponseProps, y as StreamErrorMessage, S as StreamErrorMessageProps, E as StreamStatusIndicator, D as StreamStatusIndicatorProps, C as StreamingText, z as StreamingTextProps, J as Suggestions, G as SuggestionsProps, K as Window, W as WindowProps } from './Window-CF5y1_Og.js';
-export { FacebookIcon, FacebookIconProps, FacebookIconVariant, GmailIcon, GmailIconProps, GmailIconVariant, InstagramIcon, InstagramIconProps, InstagramVariant, LinkedInIcon, LinkedInIconProps, LinkedInIconVariant, RedditIcon, RedditIconProps, RedditIconVariant, SlackIcon, SlackIconProps, SlackIconVariant, TelegramIcon, TelegramIconProps, TelegramIconVariant, WhatsAppIcon, WhatsAppIconProps, WhatsAppIconVariant, XIcon, XIconProps, XIconVariant, YouTubeIcon, YouTubeIconProps, YouTubeIconVariant } from './icons/index.js';
+export { A as Action, c as ActionVariant, d as Actions, a as ActionsLayout, b as ActionsProps, f as AgentState, e as AgentStateProps, q as AssistantMessage, m as AssistantMessageProps, i as Button, B as ButtonProps, g as ButtonSize, h as ButtonVariant, w as CopilotUserMessage, U as CopilotUserMessageProps, r as FileAttachment, n as FileAttachmentProps, j as Footer, F as FooterProps, k as Header, H as HeaderProps, l as Input, I as InputProps, M as Message, s as Messages, t as MessagesList, u as MessagesListContainer, v as MessagesListContent, o as MessagesListProps, p as MessagesProps, x as Response, R as ResponseProps, y as StreamErrorMessage, S as StreamErrorMessageProps, E as StreamStatusIndicator, D as StreamStatusIndicatorProps, C as StreamingText, z as StreamingTextProps, J as Suggestions, G as SuggestionsProps, K as Window, W as WindowProps } from './Window-BcTRumpc.js';
+export { FacebookIcon, FacebookIconProps, FacebookIconVariant, GmailIcon, GmailIconProps, GmailIconVariant, InstagramIcon, InstagramIconProps, InstagramVariant, LinkedInIcon, LinkedInIconProps, LinkedInIconVariant, PostizIcon, PostizIconProps, PostizIconVariant, RedditIcon, RedditIconProps, RedditIconVariant, SlackIcon, SlackIconProps, SlackIconVariant, TelegramIcon, TelegramIconProps, TelegramIconVariant, WhatsAppIcon, WhatsAppIconProps, WhatsAppIconVariant, XIcon, XIconProps, XIconVariant, YouTubeIcon, YouTubeIconProps, YouTubeIconVariant } from './icons/index.js';
 export { WorkflowCard, WorkflowCardProps, WorkflowErrorAlert, WorkflowErrorAlertProps, WorkflowIntegration, WorkflowProgressBar, WorkflowProgressBarProps, WorkflowResultPanel, WorkflowResultPanelProps, WorkflowStatusBadge, WorkflowStatusBadgeProps } from './workflow/index.js';
 import '@react-types/button';
 import 'styled-components';
@@ -58,7 +59,8 @@ interface ChatInputProps extends Omit<AriaTextFieldProps, 'onChange'> {
  *
  * Features:
  * - Horizontal pill-shaped suggestion buttons with minimal design
- * - Single-line input with submit button
+ * - Auto-expanding multiline input (up to ~6 lines, then scrolls)
+ * - Enter to submit, Shift+Enter for new line
  * - React ARIA for accessibility
  * - Keyboard navigation support
  * - Clean, modern design matching vendor image
@@ -163,7 +165,7 @@ interface UserMessageProps extends AriaButtonProps {
     /**
      * The message text to display
      */
-    children: React.ReactNode;
+    children: ReactNode;
     /**
      * Additional CSS class name
      */
@@ -184,6 +186,8 @@ interface UserMessageProps extends AriaButtonProps {
  * pill-shaped design with fully rounded ends, and white text. It uses React ARIA
  * for accessibility and supports keyboard navigation.
  *
+ * Memoized to prevent unnecessary re-renders during parent updates.
+ *
  * @example
  * ```tsx
  * <UserMessage onPress={() => console.log('clicked')}>
@@ -191,10 +195,8 @@ interface UserMessageProps extends AriaButtonProps {
  * </UserMessage>
  * ```
  */
-declare function UserMessage({ children, className, isPressed, onPress, ...ariaProps }: UserMessageProps): react_jsx_runtime.JSX.Element;
-declare namespace UserMessage {
-    var displayName: string;
-}
+declare function UserMessageBase({ children, className, isPressed, onPress, ...ariaProps }: UserMessageProps): react_jsx_runtime.JSX.Element;
+declare const UserMessage: React.MemoExoticComponent<typeof UserMessageBase>;
 
 /**
  * ConnectionStatusBadge Component
@@ -475,6 +477,10 @@ interface PlatformGridProps {
     onEditContentChange?: (content: string) => void;
     /** Whether content is being loaded/generated */
     isLoading?: boolean;
+    /** Currently active/selected post index */
+    activeIndex?: number;
+    /** Callback when a post is clicked/selected */
+    onActiveChange?: (index: number) => void;
 }
 /**
  * PlatformGrid displays all proposed posts in a responsive grid layout.
@@ -504,7 +510,7 @@ interface SocialMediaCanvasProps {
     emptyTitle?: string;
     /** Empty state description */
     emptyDescription?: string;
-    /** Callback when active post changes in carousel mode */
+    /** Callback when active post changes */
     onActiveChange?: (index: number) => void;
     /** Whether to show the view mode toggle */
     showViewToggle?: boolean;
@@ -516,6 +522,8 @@ interface SocialMediaCanvasProps {
     onEditContentChange?: (content: string) => void;
     /** Whether content is being loaded/generated */
     isLoading?: boolean;
+    /** Currently active post index (for grid mode) */
+    activeIndex?: number;
 }
 /**
  * SocialMediaCanvas displays social media post previews in carousel or grid mode.