@beydesign/storybook 0.0.81 → 0.0.82

package/dist/stories/Agent/AgentCard.js

@@ -8,7 +8,7 @@ import { Badge, ProgressIndicator, ProgressIndicatorMode, BadgeColor, BadgeSize,
 import { MainButton, ButtonHierarchy, ButtonSize } from '../Buttons';
 import { ArrowsClockwise, Warning } from '@phosphor-icons/react';
 import { getIconComponent } from '../../utils';
-export const AgentCard = ({ title, description = '', date = '', showDate = false, badges = [], showBadges = false, showTimeBadge = false, showDescription = false, showMenu = false, menuItems = [], active = false, showActiveToggle = false, onActiveToggleChange, activeToggleDisabled = false, agentImage, time, onPreview, agentState, previewButtonText = 'Preview', showStatusBadge = false, statusBadgeText = '', showProgressIndicator = false, progressValue = 50, processingText = 'Creation in progress', agentId = '', }) => {
+export const AgentCard = ({ title, description = '', date = '', showDate = false, badges = [], showBadges = false, showTimeBadge = false, showDescription = false, showMenu = false, menuItems = [], active = false, showActiveToggle = false, onActiveToggleChange, activeToggleDisabled = false, agentImage, time, onPreview, agentState, previewButtonText = 'Preview', showStatusBadge = false, statusBadgeText = '', showProgressIndicator = false, progressValue = 50, processingText = 'Creation in progress', agentId = '', onClickAgentId, }) => {
     const [hovered, setHovered] = useState(false);
     const [imageError, setImageError] = useState(false);
     const [isLoading, setIsLoading] = useState(!!agentImage);
@@ -41,9 +41,6 @@ export const AgentCard = ({ title, description = '', date = '', showDate = false
             img.onerror = null;
         };
     }, [agentImage]);
-    const copyToClipboard = (text) => {
-        navigator.clipboard.writeText(text);
-    };
     // Render loading state or placeholder
     const renderImageContent = () => {
         if (isLoading) {
@@ -91,12 +88,13 @@ export const AgentCard = ({ title, description = '', date = '', showDate = false
                                     overflow: 'hidden',
                                     whiteSpace: 'nowrap',
                                     textOverflow: 'ellipsis',
-                                }, title: agentId, children: ["ID ", agentId] }), getIconComponent('Copy', {
-                                width: '20px',
-                                height: '20px',
-                                weight: 'bold',
-                                color: 'var(--colors-light-text-text-accent)',
-                                style: { cursor: 'pointer' },
-                                onClick: () => copyToClipboard(agentId),
-                            })] }))] }), (showDate || showActiveToggle) && (_jsxs(Box, { display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', children: [showDate && (_jsx(Typography, { size: TypographySize.TextS, weight: TypographyWeight.Regular, color: 'var(--colors-light-text-text-subtle)', children: date })), showActiveToggle && (_jsx(Toggle, { checked: active, onChange: (checked) => onActiveToggleChange?.(checked), disabled: activeToggleDisabled, text: "Active", togglePosition: TogglePosition.Right, style: { flex: 1 } }))] })), showBadges && (_jsx(Box, { display: 'flex', flexDirection: 'row', flexWrap: 'wrap', alignItems: 'center', gap: 'var(--spacing-tokens-size-in-px-spacing-spacing-lg)', children: badges.map((badge, index) => (_jsx(Badge, { text: badge, size: BadgeSize.lg, fill: true }, `badge-${index}-${badge}`))) })), showDescription && (_jsx(Typography, { size: TypographySize.TextS, weight: TypographyWeight.Regular, color: 'var(--colors-light-text-text-paragraph)', children: description }))] }));
+                                }, title: agentId, children: ["ID ", agentId] }), onClickAgentId &&
+                                getIconComponent('Copy', {
+                                    width: '20px',
+                                    height: '20px',
+                                    weight: 'bold',
+                                    color: 'var(--colors-light-text-text-accent)',
+                                    style: { cursor: 'pointer' },
+                                    onClick: () => onClickAgentId(agentId),
+                                })] }))] }), (showDate || showActiveToggle) && (_jsxs(Box, { display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', children: [showDate && (_jsx(Typography, { size: TypographySize.TextS, weight: TypographyWeight.Regular, color: 'var(--colors-light-text-text-subtle)', children: date })), showActiveToggle && (_jsx(Toggle, { checked: active, onChange: (checked) => onActiveToggleChange?.(checked), disabled: activeToggleDisabled, text: "Active", togglePosition: TogglePosition.Right, style: { flex: 1 } }))] })), showBadges && (_jsx(Box, { display: 'flex', flexDirection: 'row', flexWrap: 'wrap', alignItems: 'center', gap: 'var(--spacing-tokens-size-in-px-spacing-spacing-lg)', children: badges.map((badge, index) => (_jsx(Badge, { text: badge, size: BadgeSize.lg, fill: true }, `badge-${index}-${badge}`))) })), showDescription && (_jsx(Typography, { size: TypographySize.TextS, weight: TypographyWeight.Regular, color: 'var(--colors-light-text-text-paragraph)', children: description }))] }));
 };

package/dist/stories/Agent/AgentCard.stories.js

@@ -197,6 +197,7 @@ export const Placeholder = {
         showStatusBadge: true,
         statusBadgeText: 'Active',
         agentId: '112657154',
+        onClickAgentId: () => { },
     },
 };
 export const CustomPreviewText = {

package/dist/stories/Agent/types.d.ts

@@ -10,7 +10,9 @@ export declare enum AgentState {
  */
 export type AgentCardProps = {
     /** Agent id */
-    agentId: string;
+    agentId?: string;
+    /** On click agent id */
+    onClickAgentId?: (agentId: string) => void;
     /** Agent image */
     agentImage?: string;
     /** Show date */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@beydesign/storybook",
   "private": false,
-  "version": "0.0.81",
+  "version": "0.0.82",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",