npm - @bikdotai/bik-component-library - Versions diffs - 0.0.841-beta.0 → 0.0.841 - Mend

@bikdotai/bik-component-library 0.0.841-beta.0 → 0.0.841

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 (147) hide show

package/dist/cjs/components/agent-builder/utils/mentionSerialization.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mentionSerialization.js","sources":["../../../../../src/components/agent-builder/utils/mentionSerialization.ts"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth';\nimport { MentionItem } from '@src/editor';\nimport {\n\tAgentTool,\n\tConfigToolConfig,\n\tRestApiToolConfig,\n\tSubAgentRef,\n} from '../AgentBuilder.model';\nimport { TOOL_SOURCE_LABELS, ToolSource } from '../constants/tools';\n\n/*\n Serialization helpers between the BikEditor document and the firebase\n * `instructions` string.\n \n Firebase stores `instructions` as PLAIN TEXT with inline reference tokens:\n * - `{{subagent:<agentId>}}` — hand-off to another agent\n * - `{{tool:<tool_id>}}` — an action the agent can call\n * - `{{<variableName>}}` — a template variable\n \n In the editor those references are inserted via the `@` mention menu (which we\n * populate with BOTH tools and sub-agents). Mention nodes keep their `id` in the\n * ProseMirror doc JSON (the rendered HTML drops it), so we serialize from the doc\n * JSON — not from HTML.\n /\n\nexport interface MentionKindMeta {\n\t/* Distinguishes a tool reference from a sub-agent reference. /\n\tkind: 'tool' \| 'subagent';\n\t/* Plain item name (no prefix) shown in the picker dropdown rows. /\n\tplainLabel?: string;\n\t/* For tools: the source bucket (manifest / shopify / …) the picker groups by. /\n\tsource?: string;\n}\n\n// Source labels moved to constants/tools.ts; re-exported for existing importers.\nexport { TOOL_SOURCE_LABELS };\n\n/* Human label for a tool source; falls back to the host-app label, then the raw key. /\nexport const toolSourceLabel = (\n\tsource: string \| undefined,\n\tfallback = 'Manifest',\n): string => {\n\tif (!source) {\n\t\treturn fallback;\n\t}\n\treturn TOOL_SOURCE_LABELS[source as ToolSource] ?? source;\n};\n\n/* Human label for the host application, used as the tool-chip prefix. /\nexport const appTypeLabel = (applicationType?: ApplicationType): string => {\n\tconst key = applicationType ? String(applicationType) : '';\n\tif (key === 'BIK') {\n\t\treturn 'BIK';\n\t}\n\tif (key === 'BSP') {\n\t\treturn 'BSP';\n\t}\n\treturn 'Manifest';\n};\n\n/\n Build the combined `@` mention list from the available tools + sub-agents.\n \n The `label` is the CHIP text shown once inserted — tools read\n * `\"<App> : <tool name>\"` (e.g. \"Manifest : Look up order\"), sub-agents read\n * `\"sub-agent: <name>\"`. `meta.plainLabel` is the un-prefixed name for the\n * picker rows, and `meta.kind` drives the `{{tool}}` / `{{subagent}}` colour.\n /\nexport const buildAgentMentionItems = (\n\ttools: AgentTool[],\n\tsubAgents: SubAgentRef[],\n\tappLabel = 'Manifest',\n): MentionItem[] => [\n\t...tools.map(\n\t\t(t): MentionItem => ({\n\t\t\tid: t.tool_id,\n\t\t\tlabel: `${toolSourceLabel(t.source, appLabel)} : ${t.display_name}`,\n\t\t\tmeta: {\n\t\t\t\tkind: 'tool',\n\t\t\t\tplainLabel: t.display_name,\n\t\t\t\tsource: t.source,\n\t\t\t},\n\t\t}),\n\t),\n\t...subAgents.map(\n\t\t(s): MentionItem => ({\n\t\t\tid: s.id,\n\t\t\tlabel: `sub-agent: ${s.name}`,\n\t\t\tmeta: { kind: 'subagent', plainLabel: s.name },\n\t\t}),\n\t),\n];\n\n/* Display name for a shared config tool: first recipient / channel, else generic. /\nexport const configToolName = (t: ConfigToolConfig): string => {\n\tif (t.tool_key === 'send_slack_message') {\n\t\treturn (\n\t\t\tString(t.params['channelId']?.value ?? '').trim() \|\| 'Send Slack message'\n\t\t);\n\t}\n\treturn (\n\t\tString(t.params['sendTo']?.value ?? '')\n\t\t\t.split(',')\n\t\t\t.map((s) => s.trim())\n\t\t\t.filter(Boolean)[0] \|\| 'Handover to email'\n\t);\n};\n\n/* Display name for a Rest API tool row / chip. /\nexport const restApiToolName = (t: RestApiToolConfig): string =>\n\tt.name \|\| 'Rest API';\n\n/* The `@`-mention chip item for a Rest API tool (kind 'tool', restapi source). /\nexport const restApiMentionItem = (t: RestApiToolConfig): MentionItem => {\n\tconst name = restApiToolName(t);\n\treturn {\n\t\tid: t.id,\n\t\tlabel: `${TOOL_SOURCE_LABELS[ToolSource.RestApi]} : ${name}`,\n\t\tmeta: { kind: 'tool', plainLabel: name, source: ToolSource.RestApi },\n\t};\n};\n\n/* The `@`-mention chip item for a shared config tool (email / Slack). /\nexport const configToolMentionItem = (t: ConfigToolConfig): MentionItem => {\n\tconst source =\n\t\tt.tool_key === 'send_slack_message'\n\t\t\t? ToolSource.Slack\n\t\t\t: ToolSource.EmailHandover;\n\tconst name = configToolName(t);\n\treturn {\n\t\tid: t.id,\n\t\tlabel: `${TOOL_SOURCE_LABELS[source]} : ${name}`,\n\t\tmeta: { kind: 'tool', plainLabel: name, source },\n\t};\n};\n\n/\n Mention items for the inline-configured custom tools (Rest API + email / Slack)\n * so their `{{tool:<id>}}` tokens rehydrate as chips — they live on the agent\n * value, not in the catalog `availableTools`. Merge alongside\n * {@link buildAgentMentionItems} in the editor's mention list.\n /\nexport const buildCustomToolMentionItems = (\n\tconfigTools: ConfigToolConfig[] = [],\n\trestApiTools: RestApiToolConfig[] = [],\n): MentionItem[] => [\n\t...restApiTools.map(restApiMentionItem),\n\t...configTools.map(configToolMentionItem),\n];\n\nconst escapeHtml = (raw: string): string =>\n\traw.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');\n\nconst escapeAttr = (raw: string): string =>\n\tescapeHtml(raw).replace(/\"/g, '"');\n\n/\n The HTML for a single mention chip. Must round-trip through the TipTap mention\n * extension's `parseHTML` (`span[data-type=\"mentionAgent\"]`, reading\n * `data-id`/`data-label`/`data-kind`) — see MentionExtension.ts. `normalizeHtml`\n * is taught to keep `data-type=\"mention…\"` spans so this survives to the parser.\n /\nconst mentionSpanHtml = (id: string, label: string, kind: string): string =>\n\t`<span data-type=\"mentionAgent\" class=\"bik-mention bik-mention--agent\"` +\n\t` data-id=\"${escapeAttr(id)}\" data-label=\"${escapeAttr(label)}\"` +\n\t` data-kind=\"${escapeAttr(kind)}\">${escapeHtml(label)}</span>`;\n\n/\n Public: HTML for one mention chip, for inserting at the cursor (e.g. when a\n * tool / sub-agent is added from the Step-3 side panel). Round-trips through the\n * same parser path as the rehydrated chips.\n /\nexport const buildMentionHtml = (\n\tid: string,\n\tlabel: string,\n\tkind: 'tool' \| 'subagent',\n): string => mentionSpanHtml(id, label, kind);\n\n/* `{{tool:<id>}}` / `{{subagent:<id>}}` → the mention item that produced them. /\nconst buildTokenLookup = (\n\tmentionItems: MentionItem[],\n): Map<string, MentionItem> => {\n\tconst byToken = new Map<string, MentionItem>();\n\tfor (const item of mentionItems) {\n\t\tconst meta = item.meta as unknown as MentionKindMeta \| undefined;\n\t\t// Both tools and sub-agents are keyed by their id (a tool's id is its tool_id).\n\t\tif (meta?.kind === 'tool') {\n\t\t\tbyToken.set(`tool:${String(item.id)}`, item);\n\t\t} else if (meta?.kind === 'subagent') {\n\t\t\tbyToken.set(`subagent:${String(item.id)}`, item);\n\t\t}\n\t}\n\treturn byToken;\n};\n\n// Matches the reference tokens we render as chips. Other `{{var}}` tokens fall\n// through untouched (left as literal text for the variable decoration).\nconst REFERENCE_TOKEN = /\\{\\{(tool:[^}]+\|subagent:[^}]+)\\}\\}/g;\n\n/* Escape plain text, swapping recognised reference tokens for mention spans. /\nconst inlineToHtml = (\n\tsegment: string,\n\tbyToken: Map<string, MentionItem>,\n): string => {\n\tlet out = '';\n\tlet lastIndex = 0;\n\tREFERENCE_TOKEN.lastIndex = 0;\n\tlet match: RegExpExecArray \| null;\n\twhile ((match = REFERENCE_TOKEN.exec(segment)) !== null) {\n\t\tout += escapeHtml(segment.slice(lastIndex, match.index));\n\t\tconst item = byToken.get(match[1]);\n\t\tif (item) {\n\t\t\tconst kind = (item.meta as unknown as MentionKindMeta).kind;\n\t\t\tout += mentionSpanHtml(String(item.id), item.label, kind);\n\t\t} else {\n\t\t\t// Tool/sub-agent no longer in the available list → keep the raw token.\n\t\t\tout += escapeHtml(match[0]);\n\t\t}\n\t\tlastIndex = REFERENCE_TOKEN.lastIndex;\n\t}\n\tout += escapeHtml(segment.slice(lastIndex));\n\treturn out.replace(/\\n/g, '<br>');\n};\n\n/\n Convert the stored instructions string into HTML for `BikEditor.initialContent`.\n * `{{tool:KEY}}` / `{{subagent:ID}}` tokens are rehydrated into mention chips\n * (resolved via `mentionItems`); any other `{{…}}` token is left as literal text\n * for the editor's variable decoration. Newlines become paragraph / line breaks.\n /\nexport const instructionsToEditorHtml = (\n\ttext: string,\n\tmentionItems: MentionItem[] = [],\n): string => {\n\tif (!text) {\n\t\treturn '';\n\t}\n\tconst byToken = buildTokenLookup(mentionItems);\n\treturn text\n\t\t.split(/\\n{2,}/)\n\t\t.map((para) => `<p>${inlineToHtml(para, byToken)}</p>`)\n\t\t.join('');\n};\n\ninterface ProseMirrorNode {\n\ttype: string;\n\ttext?: string;\n\tattrs?: Record<string, unknown>;\n\tcontent?: ProseMirrorNode[];\n}\n\n/\n The token for a mention node. Both tools and sub-agents store their id in the\n * node, so the token value is just that id — the kind only picks the prefix. The\n * node's `kind` attr is authoritative; `toolIds` is a fallback for older content\n * saved before the kind attr existed.\n /\nconst resolveMentionToken = (\n\tid: string,\n\tkind: string \| null,\n\ttoolIds: Set<string>,\n): string => {\n\tconst resolved = kind ?? (toolIds.has(id) ? 'tool' : 'subagent');\n\treturn resolved === 'tool' ? `{{tool:${id}}}` : `{{subagent:${id}}}`;\n};\n\nconst nodeToText = (node: ProseMirrorNode, toolIds: Set<string>): string => {\n\tswitch (node.type) {\n\t\tcase 'text':\n\t\t\treturn node.text ?? '';\n\t\tcase 'mentionAgent':\n\t\tcase 'mentionTeam': {\n\t\t\tconst id = node.attrs?.['id'];\n\t\t\tif (id == null) {\n\t\t\t\treturn '';\n\t\t\t}\n\t\t\tconst kind = node.attrs?.['kind'];\n\t\t\treturn resolveMentionToken(\n\t\t\t\tString(id),\n\t\t\t\tkind == null ? null : String(kind),\n\t\t\t\ttoolIds,\n\t\t\t);\n\t\t}\n\t\tcase 'variable':\n\t\t\treturn `{{${String(node.attrs?.['variableName'] ?? '')}}}`;\n\t\tcase 'hardBreak':\n\t\t\treturn '\\n';\n\t\tdefault: {\n\t\t\tconst inner = (node.content ?? [])\n\t\t\t\t.map((child) => nodeToText(child, toolIds))\n\t\t\t\t.join('');\n\t\t\t// Block nodes terminate with a newline so paragraphs stay separated.\n\t\t\tconst BLOCK_NODES = ['paragraph', 'heading', 'listItem', 'blockquote'];\n\t\t\treturn BLOCK_NODES.includes(node.type) ? `${inner}\\n` : inner;\n\t\t}\n\t}\n};\n\n/\n Convert a BikEditor document (from `ref.getJSON()`) into the firebase\n * instructions string, replacing mention nodes with `{{subagent:<id>}}` /\n * `{{tool:<tool_id>}}` tokens.\n */\nexport const editorDocToInstructions = (\n\tdoc: Record<string, unknown> \| null,\n\ttools: AgentTool[],\n): string => {\n\tif (!doc) {\n\t\treturn '';\n\t}\n\tconst toolIds = new Set(tools.map((t) => t.tool_id));\n\treturn nodeToText(doc as unknown as ProseMirrorNode, toolIds).replace(\n\t\t/\\n+$/,\n\t\t'',\n\t);\n};\n"],"names":["toolSourceLabel","source","fallback","TOOL_SOURCE_LABELS","appTypeLabel","applicationType","key","buildAgentMentionItems","tools","subAgents","appLabel","t","s","configToolName","restApiToolName","restApiMentionItem","name","ToolSource","configToolMentionItem","buildCustomToolMentionItems","configTools","restApiTools","escapeHtml","raw","escapeAttr","mentionSpanHtml","id","label","kind","buildMentionHtml","buildTokenLookup","mentionItems","byToken","item","meta","REFERENCE_TOKEN","inlineToHtml","segment","out","lastIndex","match","instructionsToEditorHtml","text","para","resolveMentionToken","toolIds","nodeToText","node","inner","child","editorDocToInstructions","doc"],"mappings":"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"}
1	+ {"version":3,"file":"mentionSerialization.js","sources":["../../../../../src/components/agent-builder/utils/mentionSerialization.ts"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth';\nimport { MentionItem } from '@src/editor';\nimport {\n\tAgentTool,\n\tConfigToolConfig,\n\tRestApiToolConfig,\n\tSubAgentRef,\n} from '../AgentBuilder.model';\nimport { TOOL_SOURCE_LABELS, ToolSource } from '../constants/tools';\n\n/*\n Serialization helpers between the BikEditor document and the firebase\n * `instructions` string.\n \n Firebase stores `instructions` as PLAIN TEXT with inline reference tokens:\n * - `{{subagent:<agentId>}}` — hand-off to another agent\n * - `{{tool:<tool_id>}}` — an action the agent can call\n * - `{{<variableName>}}` — a template variable\n \n In the editor those references are inserted via the `@` mention menu (which we\n * populate with BOTH tools and sub-agents). Mention nodes keep their `id` in the\n * ProseMirror doc JSON (the rendered HTML drops it), so we serialize from the doc\n * JSON — not from HTML.\n /\n\nexport interface MentionKindMeta {\n\t/* Distinguishes a tool reference from a sub-agent reference. /\n\tkind: 'tool' \| 'subagent';\n\t/* Plain item name (no prefix) shown in the picker dropdown rows. /\n\tplainLabel?: string;\n\t/* For tools: the source bucket (manifest / shopify / …) the picker groups by. /\n\tsource?: string;\n}\n\n// Source labels moved to constants/tools.ts; re-exported for existing importers.\nexport { TOOL_SOURCE_LABELS };\n\n/* Human label for a tool source; falls back to the host-app label, then the raw key. /\nexport const toolSourceLabel = (\n\tsource: string \| undefined,\n\tfallback = 'Manifest',\n): string => {\n\tif (!source) {\n\t\treturn fallback;\n\t}\n\treturn TOOL_SOURCE_LABELS[source as ToolSource] ?? source;\n};\n\n/* Human label for the host application, used as the tool-chip prefix. /\nexport const appTypeLabel = (applicationType?: ApplicationType): string => {\n\tconst key = applicationType ? String(applicationType) : '';\n\tif (key === 'BIK') {\n\t\treturn 'BIK';\n\t}\n\tif (key === 'BSP') {\n\t\treturn 'BSP';\n\t}\n\treturn 'Manifest';\n};\n\n/\n Build the combined `@` mention list from the available tools + sub-agents.\n \n The `label` is the CHIP text shown once inserted — tools read\n * `\"<App> : <tool name>\"` (e.g. \"Manifest : Look up order\"), sub-agents read\n * `\"sub-agent: <name>\"`. `meta.plainLabel` is the un-prefixed name for the\n * picker rows, and `meta.kind` drives the `{{tool}}` / `{{subagent}}` colour.\n /\nexport const buildAgentMentionItems = (\n\ttools: AgentTool[],\n\tsubAgents: SubAgentRef[],\n\tappLabel = 'Manifest',\n): MentionItem[] => [\n\t...tools.map(\n\t\t(t): MentionItem => ({\n\t\t\tid: t.tool_id,\n\t\t\tlabel: `${toolSourceLabel(t.source, appLabel)} : ${t.display_name}`,\n\t\t\tmeta: {\n\t\t\t\tkind: 'tool',\n\t\t\t\tplainLabel: t.display_name,\n\t\t\t\tsource: t.source,\n\t\t\t},\n\t\t}),\n\t),\n\t...subAgents.map(\n\t\t(s): MentionItem => ({\n\t\t\tid: s.id,\n\t\t\tlabel: `sub-agent: ${s.name}`,\n\t\t\tmeta: { kind: 'subagent', plainLabel: s.name },\n\t\t}),\n\t),\n];\n\n/* Display name for a shared config tool: first recipient / channel, else generic. /\nexport const configToolName = (t: ConfigToolConfig): string => {\n\tif (t.tool_key === 'send_slack_message') {\n\t\treturn (\n\t\t\tString(t.params['channelId']?.value ?? '').trim() \|\| 'Send Slack message'\n\t\t);\n\t}\n\treturn (\n\t\tString(t.params['sendTo']?.value ?? '')\n\t\t\t.split(',')\n\t\t\t.map((s) => s.trim())\n\t\t\t.filter(Boolean)[0] \|\| 'Send Email'\n\t);\n};\n\n/* Display name for a Rest API tool row / chip. /\nexport const restApiToolName = (t: RestApiToolConfig): string =>\n\tt.name \|\| 'Rest API';\n\n/* The `@`-mention chip item for a Rest API tool (kind 'tool', restapi source). /\nexport const restApiMentionItem = (t: RestApiToolConfig): MentionItem => {\n\tconst name = restApiToolName(t);\n\treturn {\n\t\tid: t.id,\n\t\tlabel: `${TOOL_SOURCE_LABELS[ToolSource.RestApi]} : ${name}`,\n\t\tmeta: { kind: 'tool', plainLabel: name, source: ToolSource.RestApi },\n\t};\n};\n\n/* The `@`-mention chip item for a shared config tool (email / Slack). /\nexport const configToolMentionItem = (t: ConfigToolConfig): MentionItem => {\n\tconst source =\n\t\tt.tool_key === 'send_slack_message'\n\t\t\t? ToolSource.Slack\n\t\t\t: ToolSource.EmailHandover;\n\tconst name = configToolName(t);\n\treturn {\n\t\tid: t.id,\n\t\tlabel: `${TOOL_SOURCE_LABELS[source]} : ${name}`,\n\t\tmeta: { kind: 'tool', plainLabel: name, source },\n\t};\n};\n\n/\n Mention items for the inline-configured custom tools (Rest API + email / Slack)\n * so their `{{tool:<id>}}` tokens rehydrate as chips — they live on the agent\n * value, not in the catalog `availableTools`. Merge alongside\n * {@link buildAgentMentionItems} in the editor's mention list.\n /\nexport const buildCustomToolMentionItems = (\n\tconfigTools: ConfigToolConfig[] = [],\n\trestApiTools: RestApiToolConfig[] = [],\n): MentionItem[] => [\n\t...restApiTools.map(restApiMentionItem),\n\t...configTools.map(configToolMentionItem),\n];\n\nconst escapeHtml = (raw: string): string =>\n\traw.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');\n\nconst escapeAttr = (raw: string): string =>\n\tescapeHtml(raw).replace(/\"/g, '"');\n\n/\n The HTML for a single mention chip. Must round-trip through the TipTap mention\n * extension's `parseHTML` (`span[data-type=\"mentionAgent\"]`, reading\n * `data-id`/`data-label`/`data-kind`) — see MentionExtension.ts. `normalizeHtml`\n * is taught to keep `data-type=\"mention…\"` spans so this survives to the parser.\n /\nconst mentionSpanHtml = (id: string, label: string, kind: string): string =>\n\t`<span data-type=\"mentionAgent\" class=\"bik-mention bik-mention--agent\"` +\n\t` data-id=\"${escapeAttr(id)}\" data-label=\"${escapeAttr(label)}\"` +\n\t` data-kind=\"${escapeAttr(kind)}\">${escapeHtml(label)}</span>`;\n\n/\n Public: HTML for one mention chip, for inserting at the cursor (e.g. when a\n * tool / sub-agent is added from the Step-3 side panel). Round-trips through the\n * same parser path as the rehydrated chips.\n /\nexport const buildMentionHtml = (\n\tid: string,\n\tlabel: string,\n\tkind: 'tool' \| 'subagent',\n): string => mentionSpanHtml(id, label, kind);\n\n/* `{{tool:<id>}}` / `{{subagent:<id>}}` → the mention item that produced them. /\nconst buildTokenLookup = (\n\tmentionItems: MentionItem[],\n): Map<string, MentionItem> => {\n\tconst byToken = new Map<string, MentionItem>();\n\tfor (const item of mentionItems) {\n\t\tconst meta = item.meta as unknown as MentionKindMeta \| undefined;\n\t\t// Both tools and sub-agents are keyed by their id (a tool's id is its tool_id).\n\t\tif (meta?.kind === 'tool') {\n\t\t\tbyToken.set(`tool:${String(item.id)}`, item);\n\t\t} else if (meta?.kind === 'subagent') {\n\t\t\tbyToken.set(`subagent:${String(item.id)}`, item);\n\t\t}\n\t}\n\treturn byToken;\n};\n\n// Matches the reference tokens we render as chips. Other `{{var}}` tokens fall\n// through untouched (left as literal text for the variable decoration).\nconst REFERENCE_TOKEN = /\\{\\{(tool:[^}]+\|subagent:[^}]+)\\}\\}/g;\n\n/* Escape plain text, swapping recognised reference tokens for mention spans. /\nconst inlineToHtml = (\n\tsegment: string,\n\tbyToken: Map<string, MentionItem>,\n): string => {\n\tlet out = '';\n\tlet lastIndex = 0;\n\tREFERENCE_TOKEN.lastIndex = 0;\n\tlet match: RegExpExecArray \| null;\n\twhile ((match = REFERENCE_TOKEN.exec(segment)) !== null) {\n\t\tout += escapeHtml(segment.slice(lastIndex, match.index));\n\t\tconst item = byToken.get(match[1]);\n\t\tif (item) {\n\t\t\tconst kind = (item.meta as unknown as MentionKindMeta).kind;\n\t\t\tout += mentionSpanHtml(String(item.id), item.label, kind);\n\t\t} else {\n\t\t\t// Tool/sub-agent no longer in the available list → keep the raw token.\n\t\t\tout += escapeHtml(match[0]);\n\t\t}\n\t\tlastIndex = REFERENCE_TOKEN.lastIndex;\n\t}\n\tout += escapeHtml(segment.slice(lastIndex));\n\treturn out.replace(/\\n/g, '<br>');\n};\n\n/\n Convert the stored instructions string into HTML for `BikEditor.initialContent`.\n * `{{tool:KEY}}` / `{{subagent:ID}}` tokens are rehydrated into mention chips\n * (resolved via `mentionItems`); any other `{{…}}` token is left as literal text\n * for the editor's variable decoration. Newlines become paragraph / line breaks.\n /\nexport const instructionsToEditorHtml = (\n\ttext: string,\n\tmentionItems: MentionItem[] = [],\n): string => {\n\tif (!text) {\n\t\treturn '';\n\t}\n\tconst byToken = buildTokenLookup(mentionItems);\n\treturn text\n\t\t.split(/\\n{2,}/)\n\t\t.map((para) => `<p>${inlineToHtml(para, byToken)}</p>`)\n\t\t.join('');\n};\n\ninterface ProseMirrorNode {\n\ttype: string;\n\ttext?: string;\n\tattrs?: Record<string, unknown>;\n\tcontent?: ProseMirrorNode[];\n}\n\n/\n The token for a mention node. Both tools and sub-agents store their id in the\n * node, so the token value is just that id — the kind only picks the prefix. The\n * node's `kind` attr is authoritative; `toolIds` is a fallback for older content\n * saved before the kind attr existed.\n /\nconst resolveMentionToken = (\n\tid: string,\n\tkind: string \| null,\n\ttoolIds: Set<string>,\n): string => {\n\tconst resolved = kind ?? (toolIds.has(id) ? 'tool' : 'subagent');\n\treturn resolved === 'tool' ? `{{tool:${id}}}` : `{{subagent:${id}}}`;\n};\n\nconst nodeToText = (node: ProseMirrorNode, toolIds: Set<string>): string => {\n\tswitch (node.type) {\n\t\tcase 'text':\n\t\t\treturn node.text ?? '';\n\t\tcase 'mentionAgent':\n\t\tcase 'mentionTeam': {\n\t\t\tconst id = node.attrs?.['id'];\n\t\t\tif (id == null) {\n\t\t\t\treturn '';\n\t\t\t}\n\t\t\tconst kind = node.attrs?.['kind'];\n\t\t\treturn resolveMentionToken(\n\t\t\t\tString(id),\n\t\t\t\tkind == null ? null : String(kind),\n\t\t\t\ttoolIds,\n\t\t\t);\n\t\t}\n\t\tcase 'variable':\n\t\t\treturn `{{${String(node.attrs?.['variableName'] ?? '')}}}`;\n\t\tcase 'hardBreak':\n\t\t\treturn '\\n';\n\t\tcase 'orderedList':\n\t\tcase 'bulletList': {\n\t\t\t// Flattening to plain text otherwise drops the list markers, so a\n\t\t\t// numbered / bulleted list looks \"removed\" after publish. Emit an\n\t\t\t// ordinal (\"1. \") / bullet (\"- \") prefix per item to preserve it.\n\t\t\tconst ordered = node.type === 'orderedList';\n\t\t\treturn (\n\t\t\t\t(node.content ?? [])\n\t\t\t\t\t.map(\n\t\t\t\t\t\t(item, i) =>\n\t\t\t\t\t\t\t`${ordered ? `${i + 1}.` : '-'} ${nodeToText(\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\ttoolIds,\n\t\t\t\t\t\t\t).replace(/\\n+$/, '')}`,\n\t\t\t\t\t)\n\t\t\t\t\t.join('\\n') + '\\n'\n\t\t\t);\n\t\t}\n\t\tdefault: {\n\t\t\tconst inner = (node.content ?? [])\n\t\t\t\t.map((child) => nodeToText(child, toolIds))\n\t\t\t\t.join('');\n\t\t\t// Block nodes terminate with a newline so paragraphs stay separated.\n\t\t\tconst BLOCK_NODES = ['paragraph', 'heading', 'listItem', 'blockquote'];\n\t\t\treturn BLOCK_NODES.includes(node.type) ? `${inner}\\n` : inner;\n\t\t}\n\t}\n};\n\n/\n Convert a BikEditor document (from `ref.getJSON()`) into the firebase\n * instructions string, replacing mention nodes with `{{subagent:<id>}}` /\n * `{{tool:<tool_id>}}` tokens.\n */\nexport const editorDocToInstructions = (\n\tdoc: Record<string, unknown> \| null,\n\ttools: AgentTool[],\n): string => {\n\tif (!doc) {\n\t\treturn '';\n\t}\n\tconst toolIds = new Set(tools.map((t) => t.tool_id));\n\treturn nodeToText(doc as unknown as ProseMirrorNode, toolIds).replace(\n\t\t/\\n+$/,\n\t\t'',\n\t);\n};\n"],"names":["toolSourceLabel","source","fallback","TOOL_SOURCE_LABELS","appTypeLabel","applicationType","key","buildAgentMentionItems","tools","subAgents","appLabel","t","s","configToolName","restApiToolName","restApiMentionItem","name","ToolSource","configToolMentionItem","buildCustomToolMentionItems","configTools","restApiTools","escapeHtml","raw","escapeAttr","mentionSpanHtml","id","label","kind","buildMentionHtml","buildTokenLookup","mentionItems","byToken","item","meta","REFERENCE_TOKEN","inlineToHtml","segment","out","lastIndex","match","instructionsToEditorHtml","text","para","resolveMentionToken","toolIds","nodeToText","node","ordered","i","inner","child","editorDocToInstructions","doc"],"mappings":"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"}

package/dist/cjs/components/agent-listing/AgentListing.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),n=require("react"),K=require("../TablePagination/TablePagination.js"),Q=require("../zeroState/ZeroState.js"),C=require("./AgentListing.styled.js"),U=require("./AgentListingFilters.js"),W=require("./AgentListingHeader.js"),X=require("./AgentTable.js"),Y=require("./DeleteAgentModal.js"),ee=require("../dropdown/utils.js"),w=({config:x,onSearchChange:p,onSearchSubmit:r,onFilterChange:g,onSortChange:c,onNewAgent:m,onBrowseTemplates:u,onRunAgent:S,onEditAgent:y,onDeleteAgent:l,onRowClick:d,...q})=>{const[i,h]=n.useState(null),[k,N]=n.useState(!1),{agents:P,isLoading:b,searchValue:L,searchPlaceholder:T="Search",filterOptions:R,filterPlaceholder:D="Filters",sortOptions:v,selectedSort:z,title:F="AI Agents",headerActions:O,pagination:s,emptyState:A,debugLog:f}=x,B=!b&&P.length===0,t=n.useCallback((e,...o)=>{f&&console.log(`[AgentListing] ${e}`,...o)},[f]),E=n.useCallback(e=>{t("onSearchChange",e),p(e)},[t,p]),I=n.useCallback(e=>{t("onSearchSubmit",e),r?.(e)},[t,r]),H=n.useCallback(e=>{t("onFilterChange",e),g?.(e)},[t,g]),M=n.useCallback(e=>{t("onSortChange",e),c?.(e)},[t,c]),j=n.useCallback(()=>{t("onNewAgent"),m()},[t,m]),V=n.useCallback(()=>{t("onBrowseTemplates"),u?.()},[t,u]),Z=n.useCallback(e=>{t("onRunAgent",e.id),S(e)},[t,S]),_=n.useCallback(e=>{t("onEditAgent",e.id),y(e)},[t,y]),$=n.useCallback(e=>{t("onRowClick",e.id),d?.(e)},[t,d]),G=n.useCallback(e=>{t("onDeleteAgent",e.id),h(e)},[t]),J=n.useCallback(async()=>{if(!(!i||!l)){N(!0);try{await l(i),h(null)}finally{N(!1)}}},[i,l]);return a.jsxs(C.Page,{"data-test":q["data-test"]??"agent-listing",children:[a.jsx(W.AgentListingHeader,{title:F,onNewAgent:j,onBrowseTemplates:u?V:void 0,headerActions:O}),a.jsx(U.AgentListingFilters,{searchValue:L,onSearchChange:E,onSearchSubmit:r?I:void 0,searchPlaceholder:T,filterOptions:R,onFilterChange:g?H:void 0,filterPlaceholder:D,sortOptions:v,selectedSort:z,onSortChange:c?M:void 0}),a.jsx(C.Body,{children:b||B?a.jsx(C.EmptyHolder,{children:a.jsx(Q.ZeroState,{isLoading:b,title:A?.title??"No agents yet",subTitle:A?.subTitle??"Create your first AI agent to start automating conversations.",actionButton:A?.actionButton??{buttonText:"New AI agent",buttonType:"primary",size:"small",onClick:j}})}):a.jsxs(a.Fragment,{children:[a.jsx(X.AgentTable,{agents:P,onRunAgent:Z,onEditAgent:_,onDeleteAgent:l?G:void 0,onRowClick:d?$:void 0}),s&&s.totalRows>0&&a.jsx(K.TablePagination,{pageNumber:s.pageNumber,pageSize:s.pageSize,totalRows:s.totalRows,hidePageSizeOptions:s.hidePageSizeOptions,updatePageNumber:s.onPageChange,updatePageSize:e=>{const o=Number(ee.unwrapDropdownValue(e));Number.isNaN(o)||s.onPageSizeChange(o)}})]})}),i&&a.jsx(Y.DeleteAgentModal,{agentName:i.name,isDeleting:k,onClose:()=>k?void 0:h(null),onConfirm:J})]})};w.displayName="AgentListing";exports.AgentListing=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),n=require("react"),K=require("../TablePagination/TablePagination.js"),Q=require("../zeroState/ZeroState.js"),m=require("./AgentListing.styled.js"),U=require("./AgentListingFilters.js"),W=require("./AgentListingHeader.js"),X=require("./AgentTable.js"),Y=require("./AgentTableShimmer.js"),ee=require("./DeleteAgentModal.js"),te=require("../dropdown/utils.js"),P=({config:f,onSearchChange:A,onSearchSubmit:r,onFilterChange:g,onSortChange:c,onNewAgent:C,onBrowseTemplates:u,onRunAgent:p,onEditAgent:S,onDeleteAgent:l,onRowClick:d,...q})=>{const[i,h]=n.useState(null),[y,k]=n.useState(!1),{agents:j,isLoading:w,searchValue:T,searchPlaceholder:L="Search",filterOptions:R,filterPlaceholder:z="Filters",sortOptions:D,selectedSort:v,title:F="AI Agents",headerActions:O,pagination:s,emptyState:b,debugLog:x}=f,B=!w&&j.length===0,t=n.useCallback((e,...o)=>{x&&console.log(`[AgentListing] ${e}`,...o)},[x]),E=n.useCallback(e=>{t("onSearchChange",e),A(e)},[t,A]),I=n.useCallback(e=>{t("onSearchSubmit",e),r?.(e)},[t,r]),M=n.useCallback(e=>{t("onFilterChange",e),g?.(e)},[t,g]),H=n.useCallback(e=>{t("onSortChange",e),c?.(e)},[t,c]),N=n.useCallback(()=>{t("onNewAgent"),C()},[t,C]),V=n.useCallback(()=>{t("onBrowseTemplates"),u?.()},[t,u]),Z=n.useCallback(e=>{t("onRunAgent",e.id),p(e)},[t,p]),_=n.useCallback(e=>{t("onEditAgent",e.id),S(e)},[t,S]),$=n.useCallback(e=>{t("onRowClick",e.id),d?.(e)},[t,d]),G=n.useCallback(e=>{t("onDeleteAgent",e.id),h(e)},[t]),J=n.useCallback(async()=>{if(!(!i||!l)){k(!0);try{await l(i),h(null)}finally{k(!1)}}},[i,l]);return a.jsxs(m.Page,{"data-test":q["data-test"]??"agent-listing",children:[a.jsx(W.AgentListingHeader,{title:F,onNewAgent:N,onBrowseTemplates:u?V:void 0,headerActions:O}),a.jsx(U.AgentListingFilters,{searchValue:T,onSearchChange:E,onSearchSubmit:r?I:void 0,searchPlaceholder:L,filterOptions:R,onFilterChange:g?M:void 0,filterPlaceholder:z,sortOptions:D,selectedSort:v,onSortChange:c?H:void 0}),a.jsx(m.Body,{children:w?a.jsx(Y.AgentTableShimmer,{rows:Math.min(s?.pageSize??5,10)}):B?a.jsx(m.EmptyHolder,{children:a.jsx(Q.ZeroState,{title:b?.title??"No agents yet",subTitle:b?.subTitle??"Create your first AI agent to start automating conversations.",actionButton:b?.actionButton??{buttonText:"New AI agent",buttonType:"primary",size:"small",onClick:N}})}):a.jsxs(a.Fragment,{children:[a.jsx(X.AgentTable,{agents:j,onRunAgent:Z,onEditAgent:_,onDeleteAgent:l?G:void 0,onRowClick:d?$:void 0}),s&&s.totalRows>0&&a.jsx(K.TablePagination,{pageNumber:s.pageNumber,pageSize:s.pageSize,totalRows:s.totalRows,hidePageSizeOptions:s.hidePageSizeOptions,updatePageNumber:s.onPageChange,updatePageSize:e=>{const o=Number(te.unwrapDropdownValue(e));Number.isNaN(o)||s.onPageSizeChange(o)}})]})}),i&&a.jsx(ee.DeleteAgentModal,{agentName:i.name,isDeleting:y,onClose:()=>y?void 0:h(null),onConfirm:J})]})};P.displayName="AgentListing";exports.AgentListing=P;
 //# sourceMappingURL=AgentListing.js.map

package/dist/cjs/components/agent-listing/AgentListing.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AgentListing.js","sources":["../../../../src/components/agent-listing/AgentListing.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { unwrapDropdownValue } from '@src/components/dropdown';\nimport { DropdownOption } from '@src/components/dropdown/type';\nimport { TablePagination } from '@src/components/TablePagination/TablePagination';\nimport { ZeroState } from '@src/components/zeroState/ZeroState';\nimport { AgentListingProps, AgentListItem } from './AgentListing.model';\nimport { Body, EmptyHolder, Page } from './AgentListing.styled';\nimport { AgentListingFilters } from './AgentListingFilters';\nimport { AgentListingHeader } from './AgentListingHeader';\nimport { AgentTable } from './AgentTable';\nimport { DeleteAgentModal } from './DeleteAgentModal';\n\n/*\n Full body of the \"AI Agents\" listing screen (header + filters + table).\n * Presentational and fully controlled — the consumer owns data, search, sort,\n * pagination and routing. Render it inside your app shell (next to the sidebar).\n \n @example\n * <AgentListing\n * agents={rows}\n * searchValue={search}\n * onSearchChange={setSearch}\n * onNewAgent={() => router.push('/agents/new')}\n * onRunAgent={runAgent}\n * onEditAgent={(a) => router.push(`/agents/${a.id}`)}\n * />\n */\nexport const AgentListing: React.FC<AgentListingProps> = ({\n\tconfig,\n\tonSearchChange,\n\tonSearchSubmit,\n\tonFilterChange,\n\tonSortChange,\n\tonNewAgent,\n\tonBrowseTemplates,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n\t...rest\n}) => {\n\t// Agent pending delete-confirmation (null = dialog closed).\n\tconst [pendingDelete, setPendingDelete] = useState<AgentListItem \| null>(\n\t\tnull,\n\t);\n\tconst [isDeleting, setIsDeleting] = useState(false);\n\tconst {\n\t\tagents,\n\t\tisLoading,\n\t\tsearchValue,\n\t\tsearchPlaceholder = 'Search',\n\t\tfilterOptions,\n\t\tfilterPlaceholder = 'Filters',\n\t\tsortOptions,\n\t\tselectedSort,\n\t\ttitle = 'AI Agents',\n\t\theaderActions,\n\t\tpagination,\n\t\temptyState,\n\t\tdebugLog,\n\t} = config;\n\n\tconst showEmpty = !isLoading && agents.length === 0;\n\n\t// Gated debug logging: each handler logs at its start only when `debugLog`.\n\tconst logAction = useCallback(\n\t\t(action: string, ...args: unknown[]) => {\n\t\t\tif (debugLog) {\n\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\tconsole.log(`[AgentListing] ${action}`, ...args);\n\t\t\t}\n\t\t},\n\t\t[debugLog],\n\t);\n\n\tconst handleSearchChange = useCallback(\n\t\t(v: string) => {\n\t\t\tlogAction('onSearchChange', v);\n\t\t\tonSearchChange(v);\n\t\t},\n\t\t[logAction, onSearchChange],\n\t);\n\tconst handleSearchSubmit = useCallback(\n\t\t(v: string) => {\n\t\t\tlogAction('onSearchSubmit', v);\n\t\t\tonSearchSubmit?.(v);\n\t\t},\n\t\t[logAction, onSearchSubmit],\n\t);\n\tconst handleFilterChange = useCallback(\n\t\t(selected: DropdownOption \| DropdownOption[]) => {\n\t\t\tlogAction('onFilterChange', selected);\n\t\t\tonFilterChange?.(selected);\n\t\t},\n\t\t[logAction, onFilterChange],\n\t);\n\tconst handleSortChange = useCallback(\n\t\t(v: string) => {\n\t\t\tlogAction('onSortChange', v);\n\t\t\tonSortChange?.(v);\n\t\t},\n\t\t[logAction, onSortChange],\n\t);\n\tconst handleNewAgent = useCallback(() => {\n\t\tlogAction('onNewAgent');\n\t\tonNewAgent();\n\t}, [logAction, onNewAgent]);\n\tconst handleBrowseTemplates = useCallback(() => {\n\t\tlogAction('onBrowseTemplates');\n\t\tonBrowseTemplates?.();\n\t}, [logAction, onBrowseTemplates]);\n\tconst handleRunAgent = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onRunAgent', agent.id);\n\t\t\tonRunAgent(agent);\n\t\t},\n\t\t[logAction, onRunAgent],\n\t);\n\tconst handleEditAgent = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onEditAgent', agent.id);\n\t\t\tonEditAgent(agent);\n\t\t},\n\t\t[logAction, onEditAgent],\n\t);\n\tconst handleRowClick = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onRowClick', agent.id);\n\t\t\tonRowClick?.(agent);\n\t\t},\n\t\t[logAction, onRowClick],\n\t);\n\t// Row delete just opens the confirm dialog; the actual delete runs on confirm.\n\tconst handleDeleteRequest = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onDeleteAgent', agent.id);\n\t\t\tsetPendingDelete(agent);\n\t\t},\n\t\t[logAction],\n\t);\n\tconst handleConfirmDelete = useCallback(async () => {\n\t\tif (!pendingDelete \|\| !onDeleteAgent) {\n\t\t\treturn;\n\t\t}\n\t\tsetIsDeleting(true);\n\t\ttry {\n\t\t\tawait onDeleteAgent(pendingDelete);\n\t\t\tsetPendingDelete(null);\n\t\t} finally {\n\t\t\tsetIsDeleting(false);\n\t\t}\n\t}, [pendingDelete, onDeleteAgent]);\n\n\treturn (\n\t\t<Page data-test={rest['data-test'] ?? 'agent-listing'}>\n\t\t\t<AgentListingHeader\n\t\t\t\ttitle={title}\n\t\t\t\tonNewAgent={handleNewAgent}\n\t\t\t\tonBrowseTemplates={\n\t\t\t\t\tonBrowseTemplates ? handleBrowseTemplates : undefined\n\t\t\t\t}\n\t\t\t\theaderActions={headerActions}\n\t\t\t/>\n\n\t\t\t<AgentListingFilters\n\t\t\t\tsearchValue={searchValue}\n\t\t\t\tonSearchChange={handleSearchChange}\n\t\t\t\tonSearchSubmit={onSearchSubmit ? handleSearchSubmit : undefined}\n\t\t\t\tsearchPlaceholder={searchPlaceholder}\n\t\t\t\tfilterOptions={filterOptions}\n\t\t\t\tonFilterChange={onFilterChange ? handleFilterChange : undefined}\n\t\t\t\tfilterPlaceholder={filterPlaceholder}\n\t\t\t\tsortOptions={sortOptions}\n\t\t\t\tselectedSort={selectedSort}\n\t\t\t\tonSortChange={onSortChange ? handleSortChange : undefined}\n\t\t\t/>\n\n\t\t\t<Body>\n\t\t\t\t{isLoading \|\| showEmpty ? (\n\t\t\t\t\t<EmptyHolder>\n\t\t\t\t\t\t<ZeroState\n\t\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t\t\ttitle={emptyState?.title ?? 'No agents yet'}\n\t\t\t\t\t\t\tsubTitle={\n\t\t\t\t\t\t\t\temptyState?.subTitle ??\n\t\t\t\t\t\t\t\t'Create your first AI agent to start automating conversations.'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tactionButton={\n\t\t\t\t\t\t\t\temptyState?.actionButton ?? {\n\t\t\t\t\t\t\t\t\tbuttonText: 'New AI agent',\n\t\t\t\t\t\t\t\t\tbuttonType: 'primary',\n\t\t\t\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\t\t\t\tonClick: handleNewAgent,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</EmptyHolder>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<AgentTable\n\t\t\t\t\t\t\tagents={agents}\n\t\t\t\t\t\t\tonRunAgent={handleRunAgent}\n\t\t\t\t\t\t\tonEditAgent={handleEditAgent}\n\t\t\t\t\t\t\tonDeleteAgent={onDeleteAgent ? handleDeleteRequest : undefined}\n\t\t\t\t\t\t\tonRowClick={onRowClick ? handleRowClick : undefined}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{pagination && pagination.totalRows > 0 && (\n\t\t\t\t\t\t\t<TablePagination\n\t\t\t\t\t\t\t\tpageNumber={pagination.pageNumber}\n\t\t\t\t\t\t\t\tpageSize={pagination.pageSize}\n\t\t\t\t\t\t\t\ttotalRows={pagination.totalRows}\n\t\t\t\t\t\t\t\thidePageSizeOptions={pagination.hidePageSizeOptions}\n\t\t\t\t\t\t\t\tupdatePageNumber={pagination.onPageChange}\n\t\t\t\t\t\t\t\tupdatePageSize={(opt) => {\n\t\t\t\t\t\t\t\t\tconst value = Number(unwrapDropdownValue(opt));\n\t\t\t\t\t\t\t\t\tif (!Number.isNaN(value)) {\n\t\t\t\t\t\t\t\t\t\tpagination.onPageSizeChange(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</Body>\n\n\t\t\t{pendingDelete && (\n\t\t\t\t<DeleteAgentModal\n\t\t\t\t\tagentName={pendingDelete.name}\n\t\t\t\t\tisDeleting={isDeleting}\n\t\t\t\t\tonClose={() => (isDeleting ? undefined : setPendingDelete(null))}\n\t\t\t\t\tonConfirm={handleConfirmDelete}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Page>\n\t);\n};\n\nAgentListing.displayName = 'AgentListing';\n"],"names":["AgentListing","config","onSearchChange","onSearchSubmit","onFilterChange","onSortChange","onNewAgent","onBrowseTemplates","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","rest","pendingDelete","setPendingDelete","useState","isDeleting","setIsDeleting","agents","isLoading","searchValue","searchPlaceholder","filterOptions","filterPlaceholder","sortOptions","selectedSort","title","headerActions","pagination","emptyState","debugLog","showEmpty","logAction","useCallback","action","args","handleSearchChange","v","handleSearchSubmit","handleFilterChange","selected","handleSortChange","handleNewAgent","handleBrowseTemplates","handleRunAgent","agent","handleEditAgent","handleRowClick","handleDeleteRequest","handleConfirmDelete","Page","jsx","AgentListingHeader","AgentListingFilters","Body","EmptyHolder","ZeroState","jsxs","Fragment","AgentTable","TablePagination","opt","value","unwrapDropdownValue","DeleteAgentModal"],"mappings":"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"}
1	+ {"version":3,"file":"AgentListing.js","sources":["../../../../src/components/agent-listing/AgentListing.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { unwrapDropdownValue } from '@src/components/dropdown';\nimport { DropdownOption } from '@src/components/dropdown/type';\nimport { TablePagination } from '@src/components/TablePagination/TablePagination';\nimport { ZeroState } from '@src/components/zeroState/ZeroState';\nimport { AgentListingProps, AgentListItem } from './AgentListing.model';\nimport { Body, EmptyHolder, Page } from './AgentListing.styled';\nimport { AgentListingFilters } from './AgentListingFilters';\nimport { AgentListingHeader } from './AgentListingHeader';\nimport { AgentTable } from './AgentTable';\nimport { AgentTableShimmer } from './AgentTableShimmer';\nimport { DeleteAgentModal } from './DeleteAgentModal';\n\n/*\n Full body of the \"AI Agents\" listing screen (header + filters + table).\n * Presentational and fully controlled — the consumer owns data, search, sort,\n * pagination and routing. Render it inside your app shell (next to the sidebar).\n \n @example\n * <AgentListing\n * agents={rows}\n * searchValue={search}\n * onSearchChange={setSearch}\n * onNewAgent={() => router.push('/agents/new')}\n * onRunAgent={runAgent}\n * onEditAgent={(a) => router.push(`/agents/${a.id}`)}\n * />\n */\nexport const AgentListing: React.FC<AgentListingProps> = ({\n\tconfig,\n\tonSearchChange,\n\tonSearchSubmit,\n\tonFilterChange,\n\tonSortChange,\n\tonNewAgent,\n\tonBrowseTemplates,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n\t...rest\n}) => {\n\t// Agent pending delete-confirmation (null = dialog closed).\n\tconst [pendingDelete, setPendingDelete] = useState<AgentListItem \| null>(\n\t\tnull,\n\t);\n\tconst [isDeleting, setIsDeleting] = useState(false);\n\tconst {\n\t\tagents,\n\t\tisLoading,\n\t\tsearchValue,\n\t\tsearchPlaceholder = 'Search',\n\t\tfilterOptions,\n\t\tfilterPlaceholder = 'Filters',\n\t\tsortOptions,\n\t\tselectedSort,\n\t\ttitle = 'AI Agents',\n\t\theaderActions,\n\t\tpagination,\n\t\temptyState,\n\t\tdebugLog,\n\t} = config;\n\n\tconst showEmpty = !isLoading && agents.length === 0;\n\n\t// Gated debug logging: each handler logs at its start only when `debugLog`.\n\tconst logAction = useCallback(\n\t\t(action: string, ...args: unknown[]) => {\n\t\t\tif (debugLog) {\n\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\tconsole.log(`[AgentListing] ${action}`, ...args);\n\t\t\t}\n\t\t},\n\t\t[debugLog],\n\t);\n\n\tconst handleSearchChange = useCallback(\n\t\t(v: string) => {\n\t\t\tlogAction('onSearchChange', v);\n\t\t\tonSearchChange(v);\n\t\t},\n\t\t[logAction, onSearchChange],\n\t);\n\tconst handleSearchSubmit = useCallback(\n\t\t(v: string) => {\n\t\t\tlogAction('onSearchSubmit', v);\n\t\t\tonSearchSubmit?.(v);\n\t\t},\n\t\t[logAction, onSearchSubmit],\n\t);\n\tconst handleFilterChange = useCallback(\n\t\t(selected: DropdownOption \| DropdownOption[]) => {\n\t\t\tlogAction('onFilterChange', selected);\n\t\t\tonFilterChange?.(selected);\n\t\t},\n\t\t[logAction, onFilterChange],\n\t);\n\tconst handleSortChange = useCallback(\n\t\t(v: string) => {\n\t\t\tlogAction('onSortChange', v);\n\t\t\tonSortChange?.(v);\n\t\t},\n\t\t[logAction, onSortChange],\n\t);\n\tconst handleNewAgent = useCallback(() => {\n\t\tlogAction('onNewAgent');\n\t\tonNewAgent();\n\t}, [logAction, onNewAgent]);\n\tconst handleBrowseTemplates = useCallback(() => {\n\t\tlogAction('onBrowseTemplates');\n\t\tonBrowseTemplates?.();\n\t}, [logAction, onBrowseTemplates]);\n\tconst handleRunAgent = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onRunAgent', agent.id);\n\t\t\tonRunAgent(agent);\n\t\t},\n\t\t[logAction, onRunAgent],\n\t);\n\tconst handleEditAgent = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onEditAgent', agent.id);\n\t\t\tonEditAgent(agent);\n\t\t},\n\t\t[logAction, onEditAgent],\n\t);\n\tconst handleRowClick = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onRowClick', agent.id);\n\t\t\tonRowClick?.(agent);\n\t\t},\n\t\t[logAction, onRowClick],\n\t);\n\t// Row delete just opens the confirm dialog; the actual delete runs on confirm.\n\tconst handleDeleteRequest = useCallback(\n\t\t(agent: AgentListItem) => {\n\t\t\tlogAction('onDeleteAgent', agent.id);\n\t\t\tsetPendingDelete(agent);\n\t\t},\n\t\t[logAction],\n\t);\n\tconst handleConfirmDelete = useCallback(async () => {\n\t\tif (!pendingDelete \|\| !onDeleteAgent) {\n\t\t\treturn;\n\t\t}\n\t\tsetIsDeleting(true);\n\t\ttry {\n\t\t\tawait onDeleteAgent(pendingDelete);\n\t\t\tsetPendingDelete(null);\n\t\t} finally {\n\t\t\tsetIsDeleting(false);\n\t\t}\n\t}, [pendingDelete, onDeleteAgent]);\n\n\treturn (\n\t\t<Page data-test={rest['data-test'] ?? 'agent-listing'}>\n\t\t\t<AgentListingHeader\n\t\t\t\ttitle={title}\n\t\t\t\tonNewAgent={handleNewAgent}\n\t\t\t\tonBrowseTemplates={\n\t\t\t\t\tonBrowseTemplates ? handleBrowseTemplates : undefined\n\t\t\t\t}\n\t\t\t\theaderActions={headerActions}\n\t\t\t/>\n\n\t\t\t<AgentListingFilters\n\t\t\t\tsearchValue={searchValue}\n\t\t\t\tonSearchChange={handleSearchChange}\n\t\t\t\tonSearchSubmit={onSearchSubmit ? handleSearchSubmit : undefined}\n\t\t\t\tsearchPlaceholder={searchPlaceholder}\n\t\t\t\tfilterOptions={filterOptions}\n\t\t\t\tonFilterChange={onFilterChange ? handleFilterChange : undefined}\n\t\t\t\tfilterPlaceholder={filterPlaceholder}\n\t\t\t\tsortOptions={sortOptions}\n\t\t\t\tselectedSort={selectedSort}\n\t\t\t\tonSortChange={onSortChange ? handleSortChange : undefined}\n\t\t\t/>\n\n\t\t\t<Body>\n\t\t\t\t{isLoading ? (\n\t\t\t\t\t<AgentTableShimmer rows={Math.min(pagination?.pageSize ?? 5, 10)} />\n\t\t\t\t) : showEmpty ? (\n\t\t\t\t\t<EmptyHolder>\n\t\t\t\t\t\t<ZeroState\n\t\t\t\t\t\t\ttitle={emptyState?.title ?? 'No agents yet'}\n\t\t\t\t\t\t\tsubTitle={\n\t\t\t\t\t\t\t\temptyState?.subTitle ??\n\t\t\t\t\t\t\t\t'Create your first AI agent to start automating conversations.'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tactionButton={\n\t\t\t\t\t\t\t\temptyState?.actionButton ?? {\n\t\t\t\t\t\t\t\t\tbuttonText: 'New AI agent',\n\t\t\t\t\t\t\t\t\tbuttonType: 'primary',\n\t\t\t\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\t\t\t\tonClick: handleNewAgent,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</EmptyHolder>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<AgentTable\n\t\t\t\t\t\t\tagents={agents}\n\t\t\t\t\t\t\tonRunAgent={handleRunAgent}\n\t\t\t\t\t\t\tonEditAgent={handleEditAgent}\n\t\t\t\t\t\t\tonDeleteAgent={onDeleteAgent ? handleDeleteRequest : undefined}\n\t\t\t\t\t\t\tonRowClick={onRowClick ? handleRowClick : undefined}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{pagination && pagination.totalRows > 0 && (\n\t\t\t\t\t\t\t<TablePagination\n\t\t\t\t\t\t\t\tpageNumber={pagination.pageNumber}\n\t\t\t\t\t\t\t\tpageSize={pagination.pageSize}\n\t\t\t\t\t\t\t\ttotalRows={pagination.totalRows}\n\t\t\t\t\t\t\t\thidePageSizeOptions={pagination.hidePageSizeOptions}\n\t\t\t\t\t\t\t\tupdatePageNumber={pagination.onPageChange}\n\t\t\t\t\t\t\t\tupdatePageSize={(opt) => {\n\t\t\t\t\t\t\t\t\tconst value = Number(unwrapDropdownValue(opt));\n\t\t\t\t\t\t\t\t\tif (!Number.isNaN(value)) {\n\t\t\t\t\t\t\t\t\t\tpagination.onPageSizeChange(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</Body>\n\n\t\t\t{pendingDelete && (\n\t\t\t\t<DeleteAgentModal\n\t\t\t\t\tagentName={pendingDelete.name}\n\t\t\t\t\tisDeleting={isDeleting}\n\t\t\t\t\tonClose={() => (isDeleting ? undefined : setPendingDelete(null))}\n\t\t\t\t\tonConfirm={handleConfirmDelete}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Page>\n\t);\n};\n\nAgentListing.displayName = 'AgentListing';\n"],"names":["AgentListing","config","onSearchChange","onSearchSubmit","onFilterChange","onSortChange","onNewAgent","onBrowseTemplates","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","rest","pendingDelete","setPendingDelete","useState","isDeleting","setIsDeleting","agents","isLoading","searchValue","searchPlaceholder","filterOptions","filterPlaceholder","sortOptions","selectedSort","title","headerActions","pagination","emptyState","debugLog","showEmpty","logAction","useCallback","action","args","handleSearchChange","v","handleSearchSubmit","handleFilterChange","selected","handleSortChange","handleNewAgent","handleBrowseTemplates","handleRunAgent","agent","handleEditAgent","handleRowClick","handleDeleteRequest","handleConfirmDelete","Page","jsx","AgentListingHeader","AgentListingFilters","Body","AgentTableShimmer","EmptyHolder","ZeroState","jsxs","Fragment","AgentTable","TablePagination","opt","value","unwrapDropdownValue","DeleteAgentModal"],"mappings":"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"}

package/dist/cjs/components/agent-listing/AgentTable.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),r=require("./AgentListing.styled.js"),j=require("./AgentTableRow.js"),l=({children:n})=>e.jsx(a.TitleSmall,{color:o.COLORS.content.primary,children:n}),g=({agents:n,onRunAgent:s,onEditAgent:t,onDeleteAgent:c,onRowClick:d})=>e.jsx(r.TableCard,{children:e.jsxs(r.TableScroll,{children:[e.jsxs(r.HeaderGridRow,{children:[e.jsx(r.HeaderCell,{children:e.jsx(l,{children:"Agent name"})}),e.jsx(r.HeaderCell,{children:e.jsx(l,{children:"Trigger"})}),e.jsx(r.HeaderCell,{align:"right",children:e.jsx(l,{children:"Trigger count"})}),e.jsx(r.HeaderCell,{children:e.jsx(l,{children:"Status"})}),e.jsx(r.HeaderCell,{align:"center",children:e.jsx(l,{children:"Actions"})})]}),n.map(i=>e.jsx(j.AgentTableRow,{agent:i,onRunAgent:s,onEditAgent:t,onDeleteAgent:c,onRowClick:d},i.id))]})});exports.AgentTable=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../TypographyStyle.js"),g=require("../../constants/Theme.js"),r=require("./AgentListing.styled.js"),j=require("./AgentTableRow.js"),l=({children:n})=>e.jsx(o.TitleSmall,{color:g.COLORS.content.primary,children:n}),t=()=>e.jsxs(r.HeaderGridRow,{children:[e.jsx(r.HeaderCell,{children:e.jsx(l,{children:"Agent name"})}),e.jsx(r.HeaderCell,{children:e.jsx(l,{children:"Trigger"})}),e.jsx(r.HeaderCell,{align:"right",children:e.jsx(l,{children:"Trigger count"})}),e.jsx(r.HeaderCell,{children:e.jsx(l,{children:"Status"})}),e.jsx(r.HeaderCell,{align:"center",children:e.jsx(l,{children:"Actions"})})]}),x=({agents:n,onRunAgent:s,onEditAgent:c,onDeleteAgent:a,onRowClick:d})=>e.jsx(r.TableCard,{children:e.jsxs(r.TableScroll,{children:[e.jsx(t,{}),n.map(i=>e.jsx(j.AgentTableRow,{agent:i,onRunAgent:s,onEditAgent:c,onDeleteAgent:a,onRowClick:d},i.id))]})});exports.AgentTable=x;exports.AgentTableHeader=t;
 //# sourceMappingURL=AgentTable.js.map

package/dist/cjs/components/agent-listing/AgentTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AgentTable.js","sources":["../../../../src/components/agent-listing/AgentTable.tsx"],"sourcesContent":["import React from 'react';\nimport { TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentListItem } from './AgentListing.model';\nimport {\n\tHeaderCell,\n\tHeaderGridRow,\n\tTableCard,\n\tTableScroll,\n} from './AgentListing.styled';\nimport { AgentTableRow } from './AgentTableRow';\n\ninterface AgentTableProps {\n\tagents: AgentListItem[];\n\tonRunAgent: (agent: AgentListItem) => void;\n\tonEditAgent: (agent: AgentListItem) => void;\n\tonDeleteAgent?: (agent: AgentListItem) => void;\n\tonRowClick?: (agent: AgentListItem) => void;\n}\n\nconst HeaderLabel: React.FC<{ children: React.ReactNode }> = ({ children }) => (\n\t<TitleSmall color={COLORS.content.primary}>{children}</TitleSmall>\n);\n\nexport const ~~AgentTable~~: React.FC~~<AgentTableProps>~~ = (~~{\n\tagents,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n}~~) => (\n\t<~~TableCard>\n\t\t<TableScroll>\n\t\t\t<~~HeaderGridRow>\n\t\t~~\t\t~~<HeaderCell>\n\t\t\t~~\t\t~~<HeaderLabel>Agent name</HeaderLabel>\n\t\t~~\t\t~~</HeaderCell>\n\t\t~~\t\t~~<HeaderCell>\n\t\t\t~~\t\t~~<HeaderLabel>Trigger</HeaderLabel>\n\t\t~~\t\t~~</HeaderCell>\n\t\t~~\t\t~~<HeaderCell align=\"right\">\n\t\t\t~~\t\t~~<HeaderLabel>Trigger count</HeaderLabel>\n\t\t~~\t\t~~</HeaderCell>\n\t\t~~\t\t~~<HeaderCell>\n\t\t\t~~\t\t~~<HeaderLabel>Status</HeaderLabel>\n\t\t~~\t\t~~</HeaderCell>\n\t\t~~\t\t~~<HeaderCell align=\"center\">\n\t\t\t~~\t\t~~<HeaderLabel>Actions</HeaderLabel>\n\t\t\t\t</~~HeaderCell~~>\n\t\t\t~~</HeaderGridRow~~>\n\n\t\t\t{agents.map((agent) => (\n\t\t\t\t<AgentTableRow\n\t\t\t\t\tkey={agent.id}\n\t\t\t\t\tagent={agent}\n\t\t\t\t\tonRunAgent={onRunAgent}\n\t\t\t\t\tonEditAgent={onEditAgent}\n\t\t\t\t\tonDeleteAgent={onDeleteAgent}\n\t\t\t\t\tonRowClick={onRowClick}\n\t\t\t\t/>\n\t\t\t))}\n\t\t</TableScroll>\n\t</TableCard>\n);\n"],"names":["HeaderLabel","children","jsx","TitleSmall","COLORS","~~AgentTable~~","~~agents~~","~~onRunAgent~~","~~onEditAgent~~","~~onDeleteAgent~~","~~onRowClick~~","~~TableCard~~","~~jsxs~~","~~TableScroll~~","~~HeaderGridRow~~","~~HeaderCell~~","agent","AgentTableRow"],"mappings":"oQAoBMA,EAAuD,CAAC,CAAE,SAAAC,CAAA,IAC/DC,EAAAA,IAACC,EAAAA,WAAA,CAAW,MAAOC,SAAO,QAAQ,QAAU,SAAAH,CAAA,CAAS,~~EAGzCI~~,~~EAAwC~~,~~CAAC~~,~~CACrD,OAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,CACD,IACCR,~~EAAAA,~~IAACS,EAAAA,UAAA,CACA,SAAAC,EAAAA,~~KAACC,EAAAA,~~YAAA,CACA,SAAA,CAAAD,OAACE,EAAAA,~~cAAA,CACA,SAAA,~~CAAAZ~~,~~MAACa~~,EAAAA,WAAA,CACA,~~SAAAb~~,EAAAA,IAACF,EAAA,CAAY,SAAA,YAAA,CAAU,EACxB,EACAE,~~MAACa~~,EAAAA,WAAA,CACA,~~SAAAb~~,EAAAA,IAACF,EAAA,CAAY,mBAAO,EACrB,~~QACCe~~,EAAAA,WAAA,CAAW,MAAM,QACjB,~~SAAAb~~,MAACF,EAAA,CAAY,yBAAa,CAAA,CAC3B,EACAE,~~MAACa~~,EAAAA,WAAA,CACA,~~SAAAb~~,EAAAA,IAACF,EAAA,CAAY,kBAAM,EACpB,~~QACCe~~,EAAAA,WAAA,CAAW,MAAM,SACjB,~~SAAAb~~,EAAAA,IAACF,EAAA,CAAY,mBAAO,CAAA,CACrB,CAAA,~~EACD~~,~~EAECM~~,EAAO,~~IAAKU~~,~~GACZd~~,EAAAA,~~IAACe~~,EAAAA,cAAA,CAEA,MAAAD,EACA,~~WAAAT~~,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,CAAA,~~EALKM~~,EAAM,EAAA,CAOZ,CAAA,CAAA,CACF,CAAA,CACD"}
1	+ {"version":3,"file":"AgentTable.js","sources":["../../../../src/components/agent-listing/AgentTable.tsx"],"sourcesContent":["import React from 'react';\nimport { TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentListItem } from './AgentListing.model';\nimport {\n\tHeaderCell,\n\tHeaderGridRow,\n\tTableCard,\n\tTableScroll,\n} from './AgentListing.styled';\nimport { AgentTableRow } from './AgentTableRow';\n\ninterface AgentTableProps {\n\tagents: AgentListItem[];\n\tonRunAgent: (agent: AgentListItem) => void;\n\tonEditAgent: (agent: AgentListItem) => void;\n\tonDeleteAgent?: (agent: AgentListItem) => void;\n\tonRowClick?: (agent: AgentListItem) => void;\n}\n\nconst HeaderLabel: React.FC<{ children: React.ReactNode }> = ({ children }) => (\n\t<TitleSmall color={COLORS.content.primary}>{children}</TitleSmall>\n);\n\n/** Column header row — shared with the loading shimmer so the two can't drift. */\nexport const AgentTableHeader: React.FC = () => (\n\t<HeaderGridRow>\n\t\t<HeaderCell>\n\t\t\t<HeaderLabel>Agent name</HeaderLabel>\n\t\t</HeaderCell>\n\t\t<HeaderCell>\n\t\t\t<HeaderLabel>Trigger</HeaderLabel>\n\t\t</HeaderCell>\n\t\t<HeaderCell align=\"right\">\n\t\t\t<HeaderLabel>Trigger count</HeaderLabel>\n\t\t</HeaderCell>\n\t\t<HeaderCell>\n\t\t\t<HeaderLabel>Status</HeaderLabel>\n\t\t</HeaderCell>\n\t\t<HeaderCell align=\"center\">\n\t\t\t<HeaderLabel>Actions</HeaderLabel>\n\t\t</HeaderCell>\n\t</HeaderGridRow>\n);\n\nexport const AgentTable: React.FC<AgentTableProps> = ({\n\tagents,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n}) => (\n\t<TableCard>\n\t\t<TableScroll>\n\t\t\t<AgentTableHeader />\n\n\t\t\t{agents.map((agent) => (\n\t\t\t\t<AgentTableRow\n\t\t\t\t\tkey={agent.id}\n\t\t\t\t\tagent={agent}\n\t\t\t\t\tonRunAgent={onRunAgent}\n\t\t\t\t\tonEditAgent={onEditAgent}\n\t\t\t\t\tonDeleteAgent={onDeleteAgent}\n\t\t\t\t\tonRowClick={onRowClick}\n\t\t\t\t/>\n\t\t\t))}\n\t\t</TableScroll>\n\t</TableCard>\n);\n"],"names":["HeaderLabel","children","jsx","TitleSmall","COLORS","AgentTableHeader","jsxs","HeaderGridRow","HeaderCell","AgentTable","agents","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","TableCard","TableScroll","agent","AgentTableRow"],"mappings":"oQAoBMA,EAAuD,CAAC,CAAE,SAAAC,CAAA,IAC/DC,EAAAA,IAACC,EAAAA,WAAA,CAAW,MAAOC,SAAO,QAAQ,QAAU,SAAAH,CAAA,CAAS,EAIzCI,EAA6B,IACzCC,EAAAA,KAACC,EAAAA,cAAA,CACA,SAAA,CAAAL,MAACM,EAAAA,WAAA,CACA,SAAAN,EAAAA,IAACF,EAAA,CAAY,SAAA,YAAA,CAAU,EACxB,EACAE,MAACM,EAAAA,WAAA,CACA,SAAAN,EAAAA,IAACF,EAAA,CAAY,mBAAO,EACrB,QACCQ,EAAAA,WAAA,CAAW,MAAM,QACjB,SAAAN,MAACF,EAAA,CAAY,yBAAa,CAAA,CAC3B,EACAE,MAACM,EAAAA,WAAA,CACA,SAAAN,EAAAA,IAACF,EAAA,CAAY,kBAAM,EACpB,QACCQ,EAAAA,WAAA,CAAW,MAAM,SACjB,SAAAN,EAAAA,IAACF,EAAA,CAAY,mBAAO,CAAA,CACrB,CAAA,CAAA,CACD,EAGYS,EAAwC,CAAC,CACrD,OAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,CACD,IACCZ,EAAAA,IAACa,EAAAA,UAAA,CACA,SAAAT,EAAAA,KAACU,EAAAA,YAAA,CACA,SAAA,CAAAd,EAAAA,IAACG,EAAA,EAAiB,EAEjBK,EAAO,IAAKO,GACZf,EAAAA,IAACgB,EAAAA,cAAA,CAEA,MAAAD,EACA,WAAAN,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,CAAA,EALKG,EAAM,EAAA,CAOZ,CAAA,CAAA,CACF,CAAA,CACD"}

package/dist/cjs/components/agent-listing/AgentTableRow.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),y=require("../../assets/icons/delete.svg.js"),j=require("../../assets/icons/edit.svg.js"),m=require("../../assets/icons/playOutline.svg.js"),b=require("../../assets/icons/vertical_dots.svg.js"),O=require("../dropdown/DropdownPopover/index.js"),r=require("../TypographyStyle.js"),i=require("../../constants/Theme.js"),n=require("./AgentListing.styled.js"),C=require("../tag/Tag.js"),f=require("../tooltips/Tooltip.js"),L=require("../dropdown/utils.js"),R=e=>{switch(e.kind){case"topic":return`Topic: ${e.label??""}`;case"phrases":return`Phrases: ${(e.items??[]).join(", ")}`;default:return e.label??""}},S=({agent:e,onRunAgent:d,onEditAgent:u,onDeleteAgent:s,onRowClick:l})=>{const c=e.status==="live",p=o=>{o.stopPropagation(),!e.isRunDisabled&&d(e)},h=[{label:"Edit",value:"edit",leadingIcon:t.jsx(j.default,{width:16,height:16,color:i.COLORS.content.secondary})},...s?[{label:"Delete",value:"delete",customComponent:t.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,color:i.COLORS.content.negative,fontFamily:"Inter",fontSize:14},children:[t.jsx(y.default,{width:16,height:16,color:i.COLORS.content.negative}),"Delete"]})}]:[]],x=o=>{o==="edit"?u(e):o==="delete"&&s?.(e)},a=t.jsx(n.ActionButton,{"data-test":`agent-row-run-${e.id}`,disabled:e.isRunDisabled,onClick:p,"aria-label":"Run agent",children:t.jsx(m.default,{width:20,height:20,color:i.COLORS.content.secondary})});return t.jsxs(n.BodyGridRow,{"data-test":`agent-row-${e.id}`,clickable:!!l,onClick:l?()=>l(e):void 0,children:[t.jsxs(n.Cell,{children:[t.jsx(r.TitleSmall,{numberOfLines:1,color:i.COLORS.content.primary,children:e.name}),t.jsxs(r.BodyCaption,{numberOfLines:1,color:i.COLORS.content.secondary,children:["Created: ",e.createdAtLabel]})]}),t.jsx(n.Cell,{children:t.jsx(r.BodyPrimary,{numberOfLines:2,color:i.COLORS.content.primary,children:R(e.trigger)})}),t.jsx(n.Cell,{align:"right",children:t.jsx(r.BodyPrimary,{color:i.COLORS.content.primary,children:e.triggerCount})}),t.jsx(n.Cell,{children:t.jsx(C.Tag,{tagText:c?"Live":"Draft",type:c?"positive":"neutral",variant:"regular"})}),t.jsx(n.Cell,{align:"center",children:t.jsxs(n.ActionGroup,{children:[e.isRunDisabled&&e.runDisabledTooltip?t.jsx(f.Tooltip,{body:e.runDisabledTooltip,placement:"top",children:t.jsx("span",{style:{display:"flex"},children:a})}):a,t.jsx("span",{style:{display:"flex"},onClick:o=>o.stopPropagation(),children:t.jsx(O.DropdownPopover,{"data-test":`agent-row-menu-${e.id}`,options:h,placement:"bottom-end",width:"160px",onSelect:o=>x(L.unwrapDropdownValue(o)),children:t.jsx(n.ActionButton,{"data-test":`agent-row-menu-button-${e.id}`,"aria-label":"More actions",children:t.jsx(b.default,{width:20,height:20,color:i.COLORS.content.secondary})})})})]})})]})};exports.AgentTableRow=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),y=require("../../assets/icons/delete.svg.js"),j=require("../../assets/icons/edit.svg.js"),b=require("../../assets/icons/playOutline.svg.js"),m=require("../../assets/icons/vertical_dots.svg.js"),O=require("../dropdown/DropdownPopover/index.js"),l=require("../TypographyStyle.js"),n=require("../../constants/Theme.js"),i=require("./AgentListing.styled.js"),C=require("../tag/Tag.js"),f=require("../tooltips/Tooltip.js"),S=require("../dropdown/utils.js"),L=e=>{switch(e.kind){case"topic":return`Topic: ${(e.label??"").replace(/_/g," ")}`;case"phrases":return e.items?.length?`Phrases: ${e.items.join(", ")}`:"Phrases";default:return e.label??""}},R=({agent:e,onRunAgent:d,onEditAgent:u,onDeleteAgent:s,onRowClick:r})=>{const c=e.status==="live",h=o=>{o.stopPropagation(),!e.isRunDisabled&&d(e)},p=[{label:"Edit",value:"edit",leadingIcon:t.jsx(j.default,{width:16,height:16,color:n.COLORS.content.secondary})},...s?[{label:"Delete",value:"delete",customComponent:t.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,color:n.COLORS.content.negative,fontFamily:"Inter",fontSize:14},children:[t.jsx(y.default,{width:16,height:16,color:n.COLORS.content.negative}),"Delete"]})}]:[]],x=o=>{o==="edit"?u(e):o==="delete"&&s?.(e)},a=t.jsx(i.ActionButton,{"data-test":`agent-row-run-${e.id}`,disabled:e.isRunDisabled,onClick:h,"aria-label":"Run agent",children:t.jsx(b.default,{width:20,height:20,color:n.COLORS.content.secondary})});return t.jsxs(i.BodyGridRow,{"data-test":`agent-row-${e.id}`,clickable:!!r,onClick:r?()=>r(e):void 0,children:[t.jsxs(i.Cell,{children:[t.jsx(l.TitleSmall,{numberOfLines:1,color:n.COLORS.content.primary,children:e.name}),t.jsxs(l.BodyCaption,{numberOfLines:1,color:n.COLORS.content.secondary,children:["Created: ",e.createdAtLabel]})]}),t.jsx(i.Cell,{children:t.jsx(l.BodySecondary,{numberOfLines:2,color:n.COLORS.content.primary,children:L(e.trigger)})}),t.jsx(i.Cell,{align:"right",children:t.jsx(l.BodySecondary,{color:n.COLORS.content.primary,children:e.triggerCount})}),t.jsx(i.Cell,{children:t.jsx(C.Tag,{tagText:c?"Live":"Draft",type:c?"positive":"neutral",variant:"regular"})}),t.jsx(i.Cell,{align:"center",children:t.jsxs(i.ActionGroup,{children:[e.isRunDisabled&&e.runDisabledTooltip?t.jsx(f.Tooltip,{body:e.runDisabledTooltip,placement:"top",children:t.jsx("span",{style:{display:"flex"},children:a})}):a,t.jsx("span",{style:{display:"flex"},onClick:o=>o.stopPropagation(),children:t.jsx(O.DropdownPopover,{"data-test":`agent-row-menu-${e.id}`,options:p,placement:"bottom-end",width:"160px",onSelect:o=>x(S.unwrapDropdownValue(o)),children:t.jsx(i.ActionButton,{"data-test":`agent-row-menu-button-${e.id}`,"aria-label":"More actions",children:t.jsx(m.default,{width:20,height:20,color:n.COLORS.content.secondary})})})})]})})]})};exports.AgentTableRow=R;
 //# sourceMappingURL=AgentTableRow.js.map

package/dist/cjs/components/agent-listing/AgentTableRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AgentTableRow.js","sources":["../../../../src/components/agent-listing/AgentTableRow.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlayOutlineIcon from '@src/assets/icons/playOutline.svg';\nimport MoreIcon from '@src/assets/icons/vertical_dots.svg';\nimport React from 'react';\nimport { unwrapDropdownValue } from '@src/components/dropdown';\nimport { DropdownPopover } from '@src/components/dropdown/DropdownPopover';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Tag } from '@src/components/tag';\nimport { Tooltip } from '@src/components/tooltips';\nimport {\n\tBodyCaption,\n\~~tBodyPrimary~~,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentListItem, AgentTriggerSummary } from './AgentListing.model';\nimport {\n\tActionButton,\n\tActionGroup,\n\tBodyGridRow,\n\tCell,\n} from './AgentListing.styled';\n\nconst triggerToText = (trigger: AgentTriggerSummary): string => {\n\tswitch (trigger.kind) {\n\t\tcase 'topic':\n\t\t\treturn `Topic: ${trigger.label ?? ''}`;\n\t\tcase 'phrases':\n\t\t\treturn `Phrases: ${(trigger.items ~~?? [])~~.join(', ')}~~`;\~~n\t\tcase 'custom':\n\t\tdefault:\n\t\t\treturn trigger.label ?? '';\n\t}\n};\n\ninterface AgentTableRowProps {\n\tagent: AgentListItem;\n\tonRunAgent: (agent: AgentListItem) => void;\n\tonEditAgent: (agent: AgentListItem) => void;\n\t/** When set, render a delete action (the listing handles confirmation). /\n\tonDeleteAgent?: (agent: AgentListItem) => void;\n\tonRowClick?: (agent: AgentListItem) => void;\n}\n\nexport const AgentTableRow: React.FC<AgentTableRowProps> = ({\n\tagent,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n}) => {\n\tconst isLive = agent.status === 'live';\n\n\tconst handleRun = (e: React.MouseEvent) => {\n\t\te.stopPropagation();\n\t\tif (agent.isRunDisabled) {\n\t\t\treturn;\n\t\t}\n\t\tonRunAgent(agent);\n\t};\n\n\t// Edit + Delete live in the \"⋮\" menu beside the run button.\n\tconst menuOptions: SingleOption[] = [\n\t\t{\n\t\t\tlabel: 'Edit',\n\t\t\tvalue: 'edit',\n\t\t\tleadingIcon: (\n\t\t\t\t<EditIcon width={16} height={16} color={COLORS.content.secondary} />\n\t\t\t),\n\t\t},\n\t\t...(onDeleteAgent\n\t\t\t? [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: 'Delete',\n\t\t\t\t\t\tvalue: 'delete',\n\t\t\t\t\t\t// Rendered red (icon + label) via customComponent.\n\t\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.negative,\n\t\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\tDelete\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t ]\n\t\t\t: []),\n\t];\n\n\tconst handleMenuSelect = (value: string \| undefined) => {\n\t\tif (value === 'edit') {\n\t\t\tonEditAgent(agent);\n\t\t} else if (value === 'delete') {\n\t\t\tonDeleteAgent?.(agent);\n\t\t}\n\t};\n\n\tconst playButton = (\n\t\t<ActionButton\n\t\t\tdata-test={`agent-row-run-${agent.id}`}\n\t\t\tdisabled={agent.isRunDisabled}\n\t\t\tonClick={handleRun}\n\t\t\taria-label=\"Run agent\"\n\t\t>\n\t\t\t<PlayOutlineIcon\n\t\t\t\twidth={20}\n\t\t\t\theight={20}\n\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t/>\n\t\t</ActionButton>\n\t);\n\n\treturn (\n\t\t<BodyGridRow\n\t\t\tdata-test={`agent-row-${agent.id}`}\n\t\t\tclickable={!!onRowClick}\n\t\t\tonClick={onRowClick ? () => onRowClick(agent) : undefined}\n\t\t>\n\t\t\t<Cell>\n\t\t\t\t<TitleSmall numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t{agent.name}\n\t\t\t\t</TitleSmall>\n\t\t\t\t<BodyCaption numberOfLines={1} color={COLORS.content.secondary}>\n\t\t\t\t\tCreated: {agent.createdAtLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t<~~BodyPrimary~~ numberOfLines={2} color={COLORS.content.primary}>\n\t\t\t\t\t{triggerToText(agent.trigger)}\n\t\t\t\t</~~BodyPrimary~~>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"right\">\n\t\t\t\t<~~BodyPrimary~~ color={COLORS.content.primary}>\n\t\t\t\t\t{agent.triggerCount}\n\t\t\t\t</~~BodyPrimary~~>\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t<Tag\n\t\t\t\t\ttagText={isLive ? 'Live' : 'Draft'}\n\t\t\t\t\ttype={isLive ? 'positive' : 'neutral'}\n\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t/>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"center\">\n\t\t\t\t<ActionGroup>\n\t\t\t\t\t{agent.isRunDisabled && agent.runDisabledTooltip ? (\n\t\t\t\t\t\t<Tooltip body={agent.runDisabledTooltip} placement=\"top\">\n\t\t\t\t\t\t\t<span style={{ display: 'flex' }}>{playButton}</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tplayButton\n\t\t\t\t\t)}\n\t\t\t\t\t{/ Stop the row's onClick from firing when interacting with the menu. */}\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={{ display: 'flex' }}\n\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\t\tdata-test={`agent-row-menu-${agent.id}`}\n\t\t\t\t\t\t\toptions={menuOptions}\n\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\twidth=\"160px\"\n\t\t\t\t\t\t\tonSelect={(opt) => handleMenuSelect(unwrapDropdownValue(opt))}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ActionButton\n\t\t\t\t\t\t\t\tdata-test={`agent-row-menu-button-${agent.id}`}\n\t\t\t\t\t\t\t\taria-label=\"More actions\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<MoreIcon\n\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ActionButton>\n\t\t\t\t\t\t</DropdownPopover>\n\t\t\t\t\t</span>\n\t\t\t\t</ActionGroup>\n\t\t\t</Cell>\n\t\t</BodyGridRow>\n\t);\n};\n"],"names":["triggerToText","trigger","AgentTableRow","agent","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","isLive","handleRun","e","menuOptions","jsx","EditIcon","COLORS","jsxs","DeleteIcon","handleMenuSelect","value","playButton","ActionButton","PlayOutlineIcon","BodyGridRow","Cell","TitleSmall","BodyCaption","~~BodyPrimary~~","Tag","ActionGroup","Tooltip","DropdownPopover","opt","unwrapDropdownValue","MoreIcon"],"mappings":"yjBAwBMA,EAAiBC,GAAyC,CAC/D,OAAQA,EAAQ,KAAA,CACf,IAAK,~~QACJ~~,MAAO,~~UAAUA~~,EAAQ,OAAS,~~EAAE~~,~~GACrC~~,IAAK,~~UACJ~~,~~MAAO~~,~~aAAaA,~~EAAQ,~~OAAS~~,~~CAAA~~,~~GAAI~~,KAAK,IAAI,CAAC,~~GAEpD~~,QACC,OAAOA,EAAQ,OAAS,EAAA,CAE3B,EAWaC,EAA8C,CAAC,CAC3D,MAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,CACD,IAAM,CACL,MAAMC,EAASL,EAAM,SAAW,OAE1BM,EAAaC,GAAwB,CAC1CA,EAAE,gBAAA,EACE,CAAAP,EAAM,eAGVC,EAAWD,CAAK,CACjB,EAGMQ,EAA8B,CACnC,CACC,MAAO,OACP,MAAO,OACP,YACCC,EAAAA,IAACC,UAAA,CAAS,MAAO,GAAI,OAAQ,GAAI,MAAOC,SAAO,QAAQ,SAAA,CAAW,CAAA,EAGpE,GAAIR,EACD,CACA,CACC,MAAO,SACP,MAAO,SAEP,gBACCS,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,SACZ,IAAK,EACL,MAAOD,EAAAA,OAAO,QAAQ,SACtB,WAAY,QACZ,SAAU,EAAA,EAGX,SAAA,CAAAF,EAAAA,IAACI,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOF,EAAAA,OAAO,QAAQ,QAAA,CAAA,EACrB,QAAA,CAAA,CAAA,CAEH,CAEF,EAEA,CAAA,CAAC,EAGCG,EAAoBC,GAA8B,CACnDA,IAAU,OACbb,EAAYF,CAAK,EACPe,IAAU,UACpBZ,IAAgBH,CAAK,CAEvB,EAEMgB,EACLP,EAAAA,IAACQ,EAAAA,aAAA,CACA,YAAW,iBAAiBjB,EAAM,EAAE,GACpC,SAAUA,EAAM,cAChB,QAASM,EACT,aAAW,YAEX,SAAAG,EAAAA,IAACS,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOP,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,EAIF,OACCC,EAAAA,KAACO,EAAAA,YAAA,CACA,YAAW,aAAanB,EAAM,EAAE,GAChC,UAAW,CAAC,CAACI,EACb,QAASA,EAAa,IAAMA,EAAWJ,CAAK,EAAI,OAEhD,SAAA,CAAAY,OAACQ,EAAAA,KAAA,CACA,SAAA,CAAAX,EAAAA,IAACY,EAAAA,WAAA,CAAW,cAAe,EAAG,MAAOV,SAAO,QAAQ,QAClD,WAAM,IAAA,CACR,SACCW,EAAAA,YAAA,CAAY,cAAe,EAAG,MAAOX,SAAO,QAAQ,UAAW,SAAA,CAAA,YACrDX,EAAM,cAAA,CAAA,CACjB,CAAA,EACD,EAEAS,EAAAA,IAACW,EAAAA,KAAA,CACA,SAAAX,EAAAA,IAACc,~~cAAA~~,~~CAAY~~,cAAe,EAAG,MAAOZ,EAAAA,OAAO,QAAQ,~~QACnD~~,SAAAd,EAAcG,EAAM,OAAO,EAC7B,EACD,EAEAS,EAAAA,IAACW,EAAAA,KAAA,CAAK,MAAM,QACX,SAAAX,EAAAA,IAACc,~~cAAA~~,~~CAAY~~,MAAOZ,EAAAA,OAAO,QAAQ,~~QACjC~~,SAAAX,EAAM,YAAA,CACR,EACD,QAECoB,EAAAA,KAAA,CACA,SAAAX,EAAAA,IAACe,EAAAA,IAAA,CACA,QAASnB,EAAS,OAAS,QAC3B,KAAMA,EAAS,WAAa,UAC5B,QAAQ,SAAA,CAAA,EAEV,EAEAI,MAACW,EAAAA,KAAA,CAAK,MAAM,SACX,gBAACK,cAAA,CACC,SAAA,CAAAzB,EAAM,eAAiBA,EAAM,yBAC5B0B,UAAA,CAAQ,KAAM1B,EAAM,mBAAoB,UAAU,MAClD,SAAAS,EAAAA,IAAC,OAAA,CAAK,MAAO,CAAE,QAAS,QAAW,SAAAO,EAAW,EAC/C,EAEAA,EAGDP,EAAAA,IAAC,OAAA,CACA,MAAO,CAAE,QAAS,MAAA,EAClB,QAAUF,GAAMA,EAAE,gBAAA,EAElB,SAAAE,EAAAA,IAACkB,EAAAA,gBAAA,CACA,YAAW,kBAAkB3B,EAAM,EAAE,GACrC,QAASQ,EACT,UAAU,aACV,MAAM,QACN,SAAWoB,GAAQd,EAAiBe,EAAAA,oBAAoBD,CAAG,CAAC,EAE5D,SAAAnB,EAAAA,IAACQ,EAAAA,aAAA,CACA,YAAW,yBAAyBjB,EAAM,EAAE,GAC5C,aAAW,eAEX,SAAAS,EAAAA,IAACqB,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOnB,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,CACD,CAAA,CACD,CAAA,CACD,CAAA,CACD,CAAA,CACD,CAAA,CAAA,CAAA,CAGH"}
1	+ {"version":3,"file":"AgentTableRow.js","sources":["../../../../src/components/agent-listing/AgentTableRow.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlayOutlineIcon from '@src/assets/icons/playOutline.svg';\nimport MoreIcon from '@src/assets/icons/vertical_dots.svg';\nimport React from 'react';\nimport { unwrapDropdownValue } from '@src/components/dropdown';\nimport { DropdownPopover } from '@src/components/dropdown/DropdownPopover';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Tag } from '@src/components/tag';\nimport { Tooltip } from '@src/components/tooltips';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentListItem, AgentTriggerSummary } from './AgentListing.model';\nimport {\n\tActionButton,\n\tActionGroup,\n\tBodyGridRow,\n\tCell,\n} from './AgentListing.styled';\n\nconst triggerToText = (trigger: AgentTriggerSummary): string => {\n\tswitch (trigger.kind) {\n\t\tcase 'topic':\n\t\t\t// Intent keys arrive snake_cased (e.g. \"order_cancellation\"); show them\n\t\t\t// space-separated so the trigger reads as words, not a raw key.\n\t\t\treturn `Topic: ${(trigger.label ?? '').replace(/_/g, ' ')}`;\n\t\tcase 'phrases':\n\t\t\t// No enumerable phrase list (free-text trigger) → just the word.\n\t\t\treturn trigger.items?.length\n\t\t\t\t? `Phrases: ${trigger.items.join(', ')}`\n\t\t\t\t: 'Phrases';\n\t\tcase 'custom':\n\t\tdefault:\n\t\t\treturn trigger.label ?? '';\n\t}\n};\n\ninterface AgentTableRowProps {\n\tagent: AgentListItem;\n\tonRunAgent: (agent: AgentListItem) => void;\n\tonEditAgent: (agent: AgentListItem) => void;\n\t/** When set, render a delete action (the listing handles confirmation). /\n\tonDeleteAgent?: (agent: AgentListItem) => void;\n\tonRowClick?: (agent: AgentListItem) => void;\n}\n\nexport const AgentTableRow: React.FC<AgentTableRowProps> = ({\n\tagent,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n}) => {\n\tconst isLive = agent.status === 'live';\n\n\tconst handleRun = (e: React.MouseEvent) => {\n\t\te.stopPropagation();\n\t\tif (agent.isRunDisabled) {\n\t\t\treturn;\n\t\t}\n\t\tonRunAgent(agent);\n\t};\n\n\t// Edit + Delete live in the \"⋮\" menu beside the run button.\n\tconst menuOptions: SingleOption[] = [\n\t\t{\n\t\t\tlabel: 'Edit',\n\t\t\tvalue: 'edit',\n\t\t\tleadingIcon: (\n\t\t\t\t<EditIcon width={16} height={16} color={COLORS.content.secondary} />\n\t\t\t),\n\t\t},\n\t\t...(onDeleteAgent\n\t\t\t? [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: 'Delete',\n\t\t\t\t\t\tvalue: 'delete',\n\t\t\t\t\t\t// Rendered red (icon + label) via customComponent.\n\t\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.negative,\n\t\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\tDelete\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t ]\n\t\t\t: []),\n\t];\n\n\tconst handleMenuSelect = (value: string \| undefined) => {\n\t\tif (value === 'edit') {\n\t\t\tonEditAgent(agent);\n\t\t} else if (value === 'delete') {\n\t\t\tonDeleteAgent?.(agent);\n\t\t}\n\t};\n\n\tconst playButton = (\n\t\t<ActionButton\n\t\t\tdata-test={`agent-row-run-${agent.id}`}\n\t\t\tdisabled={agent.isRunDisabled}\n\t\t\tonClick={handleRun}\n\t\t\taria-label=\"Run agent\"\n\t\t>\n\t\t\t<PlayOutlineIcon\n\t\t\t\twidth={20}\n\t\t\t\theight={20}\n\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t/>\n\t\t</ActionButton>\n\t);\n\n\treturn (\n\t\t<BodyGridRow\n\t\t\tdata-test={`agent-row-${agent.id}`}\n\t\t\tclickable={!!onRowClick}\n\t\t\tonClick={onRowClick ? () => onRowClick(agent) : undefined}\n\t\t>\n\t\t\t<Cell>\n\t\t\t\t<TitleSmall numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t{agent.name}\n\t\t\t\t</TitleSmall>\n\t\t\t\t<BodyCaption numberOfLines={1} color={COLORS.content.secondary}>\n\t\t\t\t\tCreated: {agent.createdAtLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t<BodySecondary numberOfLines={2} color={COLORS.content.primary}>\n\t\t\t\t\t{triggerToText(agent.trigger)}\n\t\t\t\t</BodySecondary>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"right\">\n\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t{agent.triggerCount}\n\t\t\t\t</BodySecondary>\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t<Tag\n\t\t\t\t\ttagText={isLive ? 'Live' : 'Draft'}\n\t\t\t\t\ttype={isLive ? 'positive' : 'neutral'}\n\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t/>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"center\">\n\t\t\t\t<ActionGroup>\n\t\t\t\t\t{agent.isRunDisabled && agent.runDisabledTooltip ? (\n\t\t\t\t\t\t<Tooltip body={agent.runDisabledTooltip} placement=\"top\">\n\t\t\t\t\t\t\t<span style={{ display: 'flex' }}>{playButton}</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tplayButton\n\t\t\t\t\t)}\n\t\t\t\t\t{/ Stop the row's onClick from firing when interacting with the menu. */}\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={{ display: 'flex' }}\n\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\t\tdata-test={`agent-row-menu-${agent.id}`}\n\t\t\t\t\t\t\toptions={menuOptions}\n\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\twidth=\"160px\"\n\t\t\t\t\t\t\tonSelect={(opt) => handleMenuSelect(unwrapDropdownValue(opt))}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ActionButton\n\t\t\t\t\t\t\t\tdata-test={`agent-row-menu-button-${agent.id}`}\n\t\t\t\t\t\t\t\taria-label=\"More actions\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<MoreIcon\n\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ActionButton>\n\t\t\t\t\t\t</DropdownPopover>\n\t\t\t\t\t</span>\n\t\t\t\t</ActionGroup>\n\t\t\t</Cell>\n\t\t</BodyGridRow>\n\t);\n};\n"],"names":["triggerToText","trigger","AgentTableRow","agent","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","isLive","handleRun","e","menuOptions","jsx","EditIcon","COLORS","jsxs","DeleteIcon","handleMenuSelect","value","playButton","ActionButton","PlayOutlineIcon","BodyGridRow","Cell","TitleSmall","BodyCaption","BodySecondary","Tag","ActionGroup","Tooltip","DropdownPopover","opt","unwrapDropdownValue","MoreIcon"],"mappings":"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"}

package/dist/cjs/components/agent-listing/AgentTableShimmer.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../shimmer/ShimmerComponent/BikShimmer.js"),r=require("./AgentListing.styled.js"),x=require("./AgentTable.js"),l=(i,t="16px",n="4px")=>e.jsx(s.BikShimmer,{boxes:[{width:i,height:t,borderRadius:n,marginTop:"0"}]}),a=({rows:i=5})=>e.jsx(r.TableCard,{"data-test":"agent-table-shimmer",children:e.jsxs(r.TableScroll,{children:[e.jsx(x.AgentTableHeader,{}),Array.from({length:i},(t,n)=>e.jsxs(r.BodyGridRow,{children:[e.jsx(r.Cell,{children:l("60%")}),e.jsx(r.Cell,{children:l("70%")}),e.jsx(r.Cell,{align:"right",children:l("48px")}),e.jsx(r.Cell,{children:l("64px","24px","999px")}),e.jsx(r.Cell,{align:"center",children:l("72px","24px")})]},n))]})});exports.AgentTableShimmer=a;
2	+ //# sourceMappingURL=AgentTableShimmer.js.map

package/dist/cjs/components/agent-listing/AgentTableShimmer.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"AgentTableShimmer.js","sources":["../../../../src/components/agent-listing/AgentTableShimmer.tsx"],"sourcesContent":["import React from 'react';\nimport BikShimmer from '@src/components/shimmer/ShimmerComponent/BikShimmer';\nimport {\n\tBodyGridRow,\n\tCell,\n\tTableCard,\n\tTableScroll,\n} from './AgentListing.styled';\nimport { AgentTableHeader } from './AgentTable';\n\ninterface AgentTableShimmerProps {\n\t/** Shimmer row count — pass the page size so the refetch keeps the page height. */\n\trows?: number;\n}\n\nconst box = (width: string, height = '16px', borderRadius = '4px') => (\n\t<BikShimmer boxes={[{ width, height, borderRadius, marginTop: '0' }]} />\n);\n\n/**\n * Table-shaped loading state: the real column header + shimmer rows matching the\n * listing grid, so a refetch (page/page-size/sort/search change) shimmers in place\n * instead of collapsing to the initial full-page loader.\n */\nexport const AgentTableShimmer: React.FC<AgentTableShimmerProps> = ({\n\trows = 5,\n}) => (\n\t<TableCard data-test=\"agent-table-shimmer\">\n\t\t<TableScroll>\n\t\t\t<AgentTableHeader />\n\n\t\t\t{Array.from({ length: rows }, (_, i) => (\n\t\t\t\t<BodyGridRow key={i}>\n\t\t\t\t\t<Cell>{box('60%')}</Cell>\n\t\t\t\t\t<Cell>{box('70%')}</Cell>\n\t\t\t\t\t<Cell align=\"right\">{box('48px')}</Cell>\n\t\t\t\t\t<Cell>{box('64px', '24px', '999px')}</Cell>\n\t\t\t\t\t<Cell align=\"center\">{box('72px', '24px')}</Cell>\n\t\t\t\t</BodyGridRow>\n\t\t\t))}\n\t\t</TableScroll>\n\t</TableCard>\n);\n"],"names":["box","width","height","borderRadius","jsx","BikShimmer","AgentTableShimmer","rows","TableCard","TableScroll","AgentTableHeader","_","i","jsxs","BodyGridRow","Cell"],"mappings":"+OAeMA,EAAM,CAACC,EAAeC,EAAS,OAAQC,EAAe,QAC3DC,EAAAA,IAACC,EAAAA,WAAA,CAAW,MAAO,CAAC,CAAE,MAAAJ,EAAO,OAAAC,EAAQ,aAAAC,EAAc,UAAW,GAAA,CAAK,EAAG,EAQ1DG,EAAsD,CAAC,CACnE,KAAAC,EAAO,CACR,IACCH,EAAAA,IAACI,YAAA,CAAU,YAAU,sBACpB,gBAACC,cAAA,CACA,SAAA,CAAAL,EAAAA,IAACM,EAAAA,iBAAA,EAAiB,EAEjB,MAAM,KAAK,CAAE,OAAQH,CAAA,EAAQ,CAACI,EAAGC,IACjCC,EAAAA,KAACC,EAAAA,YAAA,CACA,SAAA,CAAAV,EAAAA,IAACW,EAAAA,KAAA,CAAM,SAAAf,EAAI,KAAK,CAAA,CAAE,EAClBI,EAAAA,IAACW,EAAAA,KAAA,CAAM,SAAAf,EAAI,KAAK,CAAA,CAAE,QACjBe,EAAAA,KAAA,CAAK,MAAM,QAAS,SAAAf,EAAI,MAAM,EAAE,QAChCe,EAAAA,KAAA,CAAM,SAAAf,EAAI,OAAQ,OAAQ,OAAO,EAAE,QACnCe,EAAAA,KAAA,CAAK,MAAM,SAAU,SAAAf,EAAI,OAAQ,MAAM,CAAA,CAAE,CAAA,CAAA,EALzBY,CAMlB,CACA,CAAA,CAAA,CACF,CAAA,CACD"}

package/dist/cjs/components/agent-listing/DeleteAgentModal.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../TypographyStyle.js"),l=require("../../constants/Theme.js"),s=require("../modals/styledModal.js"),i=require("../button/Button.js"),r=({agentName:a,onClose:t,onConfirm:d,isDeleting:o})=>e.jsx(s.StyledModal,{"data-test":"agent-delete-modal",open:!0,onClose:t,width:"530px",children:e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:12,padding:24,alignItems:"flex-start",textAlign:"left"},children:[e.jsxs(n.TitleRegular,{color:l.COLORS.content.primary,children:["Delete “",a,"”?"]}),e.jsx(n.BodySecondary,{color:l.COLORS.content.secondary,children:"This permanently deletes the agent and its sub-agents. This can’t be undone."}),e.jsxs("div",{style:{display:"flex",gap:12,width:"100%",marginTop:4},children:[e.jsx(i.Button,{"data-test":"agent-delete-cancel",buttonType:"secondary",size:"medium",matchParentWidth:!0,buttonText:"Cancel",onClick:t}),e.jsx(i.Button,{"data-test":"agent-delete-confirm",buttonType:"destructive",size:"medium",matchParentWidth:!0,buttonText:"Delete",isLoading:o,onClick:d})]})]})});exports.DeleteAgentModal=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../TypographyStyle.js"),i=require("../../constants/Theme.js"),o=require("../modals/styledModal.js"),l=require("../button/Button.js"),r=({agentName:a,onClose:t,onConfirm:d,isDeleting:s})=>e.jsx(o.StyledModal,{"data-test":"agent-delete-modal",open:!0,onClose:t,width:"530px",children:e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:12,padding:24,alignItems:"flex-start",textAlign:"left"},children:[e.jsxs(n.TitleMedium,{color:i.COLORS.content.primary,children:["Delete “",a,"”?"]}),e.jsx(n.BodyPrimary,{color:i.COLORS.content.secondary,children:"This permanently deletes the agent and its sub-agents. This can’t be undone."}),e.jsxs("div",{style:{display:"flex",gap:12,width:"100%",marginTop:4},children:[e.jsx(l.Button,{"data-test":"agent-delete-cancel",buttonType:"secondary",size:"medium",matchParentWidth:!0,buttonText:"Cancel",onClick:t}),e.jsx(l.Button,{"data-test":"agent-delete-confirm",buttonType:"destructive",size:"medium",matchParentWidth:!0,buttonText:"Delete",isLoading:s,onClick:d})]})]})});exports.DeleteAgentModal=r;
 //# sourceMappingURL=DeleteAgentModal.js.map

package/dist/cjs/components/agent-listing/DeleteAgentModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DeleteAgentModal.js","sources":["../../../../src/components/agent-listing/DeleteAgentModal.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from '@src/components/button';\nimport { StyledModal } from '@src/components/modals';\nimport { ~~BodySecondary~~, ~~TitleRegular~~ } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\ninterface DeleteAgentModalProps {\n\t/** Name of the agent being deleted (for the body copy). /\n\tagentName: string;\n\t/* Dismiss without deleting (X / outside click / Cancel). /\n\tonClose: () => void;\n\t/* Confirm deletion. /\n\tonConfirm: () => void;\n\tisDeleting?: boolean;\n}\n\n/\n \"Delete agent?\" confirmation for the listing. Deleting an entry agent also\n * removes its sub-agents (the backend cascades), so the copy warns about it.\n */\nexport const DeleteAgentModal: React.FC<DeleteAgentModalProps> = ({\n\tagentName,\n\tonClose,\n\tonConfirm,\n\tisDeleting,\n}) => (\n\t<StyledModal\n\t\tdata-test=\"agent-delete-modal\"\n\t\topen\n\t\tonClose={onClose}\n\t\twidth=\"530px\"\n\t>\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tflexDirection: 'column',\n\t\t\t\tgap: 12,\n\t\t\t\tpadding: 24,\n\t\t\t\talignItems: 'flex-start',\n\t\t\t\ttextAlign: 'left',\n\t\t\t}}\n\t\t>\n\t\t\t<~~TitleRegular~~ color={COLORS.content.primary}>\n\t\t\t\tDelete “{agentName}”?\n\t\t\t</~~TitleRegular~~>\n\t\t\t<~~BodySecondary~~ color={COLORS.content.secondary}>\n\t\t\t\tThis permanently deletes the agent and its sub-agents. This can’t be\n\t\t\t\tundone.\n\t\t\t</~~BodySecondary~~>\n\n\t\t\t<div style={{ display: 'flex', gap: 12, width: '100%', marginTop: 4 }}>\n\t\t\t\t<Button\n\t\t\t\t\tdata-test=\"agent-delete-cancel\"\n\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\tmatchParentWidth\n\t\t\t\t\tbuttonText=\"Cancel\"\n\t\t\t\t\tonClick={onClose}\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\tdata-test=\"agent-delete-confirm\"\n\t\t\t\t\tbuttonType=\"destructive\"\n\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\tmatchParentWidth\n\t\t\t\t\tbuttonText=\"Delete\"\n\t\t\t\t\tisLoading={isDeleting}\n\t\t\t\t\tonClick={onConfirm}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t</StyledModal>\n);\n"],"names":["DeleteAgentModal","agentName","onClose","onConfirm","isDeleting","jsx","StyledModal","jsxs","~~TitleRegular~~","COLORS","~~BodySecondary~~","Button"],"mappings":"qQAoBaA,EAAoD,CAAC,CACjE,UAAAC,EACA,QAAAC,EACA,UAAAC,EACA,WAAAC,CACD,IACCC,EAAAA,IAACC,EAAAA,YAAA,CACA,YAAU,qBACV,KAAI,GACJ,QAAAJ,EACA,MAAM,QAEN,SAAAK,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,SACf,IAAK,GACL,QAAS,GACT,WAAY,aACZ,UAAW,MAAA,EAGZ,SAAA,CAAAA,EAAAA,KAACC,EAAAA,~~aAAA~~,~~CAAa~~,MAAOC,EAAAA,OAAO,QAAQ,QAAS,SAAA,CAAA,~~WACnCR~~,EAAU,IAAA,EACpB,QACCS,EAAAA,~~cAAA~~,~~CAAc~~,MAAOD,EAAAA,OAAO,QAAQ,UAAW,SAAA,+~~EAGhD~~,EAEAF,EAAAA,KAAC,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,IAAK,GAAI,MAAO,OAAQ,UAAW,CAAA,EACjE,SAAA,CAAAF,EAAAA,IAACM,EAAAA,OAAA,CACA,YAAU,sBACV,WAAW,YACX,KAAK,SACL,iBAAgB,GAChB,WAAW,SACX,QAAST,CAAA,CAAA,EAEVG,EAAAA,IAACM,EAAAA,OAAA,CACA,YAAU,uBACV,WAAW,cACX,KAAK,SACL,iBAAgB,GAChB,WAAW,SACX,UAAWP,EACX,QAASD,CAAA,CAAA,CACV,CAAA,CACD,CAAA,CAAA,CAAA,CACD,CACD"}
1	+ {"version":3,"file":"DeleteAgentModal.js","sources":["../../../../src/components/agent-listing/DeleteAgentModal.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from '@src/components/button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyPrimary, TitleMedium } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\ninterface DeleteAgentModalProps {\n\t/** Name of the agent being deleted (for the body copy). /\n\tagentName: string;\n\t/* Dismiss without deleting (X / outside click / Cancel). /\n\tonClose: () => void;\n\t/* Confirm deletion. /\n\tonConfirm: () => void;\n\tisDeleting?: boolean;\n}\n\n/\n \"Delete agent?\" confirmation for the listing. Deleting an entry agent also\n * removes its sub-agents (the backend cascades), so the copy warns about it.\n */\nexport const DeleteAgentModal: React.FC<DeleteAgentModalProps> = ({\n\tagentName,\n\tonClose,\n\tonConfirm,\n\tisDeleting,\n}) => (\n\t<StyledModal\n\t\tdata-test=\"agent-delete-modal\"\n\t\topen\n\t\tonClose={onClose}\n\t\twidth=\"530px\"\n\t>\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tflexDirection: 'column',\n\t\t\t\tgap: 12,\n\t\t\t\tpadding: 24,\n\t\t\t\talignItems: 'flex-start',\n\t\t\t\ttextAlign: 'left',\n\t\t\t}}\n\t\t>\n\t\t\t<TitleMedium color={COLORS.content.primary}>\n\t\t\t\tDelete “{agentName}”?\n\t\t\t</TitleMedium>\n\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\tThis permanently deletes the agent and its sub-agents. This can’t be\n\t\t\t\tundone.\n\t\t\t</BodyPrimary>\n\n\t\t\t<div style={{ display: 'flex', gap: 12, width: '100%', marginTop: 4 }}>\n\t\t\t\t<Button\n\t\t\t\t\tdata-test=\"agent-delete-cancel\"\n\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\tmatchParentWidth\n\t\t\t\t\tbuttonText=\"Cancel\"\n\t\t\t\t\tonClick={onClose}\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\tdata-test=\"agent-delete-confirm\"\n\t\t\t\t\tbuttonType=\"destructive\"\n\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\tmatchParentWidth\n\t\t\t\t\tbuttonText=\"Delete\"\n\t\t\t\t\tisLoading={isDeleting}\n\t\t\t\t\tonClick={onConfirm}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t</StyledModal>\n);\n"],"names":["DeleteAgentModal","agentName","onClose","onConfirm","isDeleting","jsx","StyledModal","jsxs","TitleMedium","COLORS","BodyPrimary","Button"],"mappings":"qQAoBaA,EAAoD,CAAC,CACjE,UAAAC,EACA,QAAAC,EACA,UAAAC,EACA,WAAAC,CACD,IACCC,EAAAA,IAACC,EAAAA,YAAA,CACA,YAAU,qBACV,KAAI,GACJ,QAAAJ,EACA,MAAM,QAEN,SAAAK,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,SACf,IAAK,GACL,QAAS,GACT,WAAY,aACZ,UAAW,MAAA,EAGZ,SAAA,CAAAA,EAAAA,KAACC,EAAAA,YAAA,CAAY,MAAOC,EAAAA,OAAO,QAAQ,QAAS,SAAA,CAAA,WAClCR,EAAU,IAAA,EACpB,QACCS,EAAAA,YAAA,CAAY,MAAOD,EAAAA,OAAO,QAAQ,UAAW,SAAA,+EAG9C,EAEAF,EAAAA,KAAC,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,IAAK,GAAI,MAAO,OAAQ,UAAW,CAAA,EACjE,SAAA,CAAAF,EAAAA,IAACM,EAAAA,OAAA,CACA,YAAU,sBACV,WAAW,YACX,KAAK,SACL,iBAAgB,GAChB,WAAW,SACX,QAAST,CAAA,CAAA,EAEVG,EAAAA,IAACM,EAAAA,OAAA,CACA,YAAU,uBACV,WAAW,cACX,KAAK,SACL,iBAAgB,GAChB,WAAW,SACX,UAAWP,EACX,QAASD,CAAA,CAAA,CACV,CAAA,CACD,CAAA,CAAA,CAAA,CACD,CACD"}

package/dist/cjs/components/avatar/Avatar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("react"),c=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),y=require("../../assets/icons/bik_livechat.svg.js"),u=require("../../assets/icons/email-channel.svg.js"),d=require("../../assets/icons/facebook_channel.svg.js"),f=require("../../assets/icons/gmail.svg.js"),j=require("../../assets/icons/instagram-channel.svg.js"),_=require("../../assets/icons/task.svg.js"),S=require("../../assets/icons/whatsapp_color.svg.js"),A=require("./Avatar.styled.js"),i=require("./AvatarHelper.js"),C=require("../../icons/Informational/Communication/Phone.js"),n={[i.SIZE.EXTRA_SMALL]:10,[i.SIZE.SMALL]:16,[i.SIZE.MEDIUM]:20,[i.SIZE.LARGE]:32},o={[i.AVATAR_BACKGROUND.LIGHT]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.WHITE]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.DARK]:a.COLORS.surface.standard,[i.AVATAR_BACKGROUND.BRAND]:a.COLORS.background.inverseLight};var g=(e=>(e.INSTAGRAM="instagram",e.MESSENGER="messenger",e.WHATSAPP="whatsapp",e.GMAIL="gmail",e.LIVECHAT="livechat",e.GOOGLE_BUSINESS_CHAT="gbm",e.SHOPIFY="shopify",e.FACEBOOK="facebook",e.EMAIL="email",e.SMTP="smtp",e.FACEBOOK_CATALOG="facebook-catalog",e.TASKS="tasks",e.BIK_LIVECHAT="livechat",e.VOICE="voice",e))(g||{});const v=e=>{const[l,R]=m.useState(!1),h=()=>{const r=(e.name||"").split(".").join(" ").split(" ").map(x=>x.charAt(0).toUpperCase()).slice(0,2).join(""),s=o[e.background];return e.size===i.SIZE.LARGE?t.jsx(c.TitleMedium,{style:{color:s},children:r}):e.size===i.SIZE.MEDIUM?t.jsx(c.TitleSmall,{style:{color:s},children:r}):e.size===i.SIZE.SMALL?t.jsx(c.SubHeading,{style:{color:s},children:r}):t.jsx(c.BodyTiny,{style:{color:s,fontSize:"6.667px",lineHeight:"8px"},children:r})},I=()=>e.useNameFallback&&(!e.photoUrl||l)&&e.name?t.jsx("div",{children:h()}):e.useNameFallback&&e.photoUrl&&!l?t.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[e.size],height:i.AVATAR_SIZE_MAP[e.size],style:{borderRadius:e?.borderRadius||"50%",objectFit:"contain"},src:e.photoUrl,onError:()=>{R(!0)}}):t.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[e.size],height:i.AVATAR_SIZE_MAP[e.size],style:{borderRadius:e?.borderRadius||"50%",objectFit:"contain"},src:e.photoUrl}),O=()=>{switch(e.channelName){case"email":return t.jsx(u.default,{width:11,height:11});case"smtp":return t.jsx(u.default,{width:11,height:11});case"facebook":return t.jsx(d.default,{width:11,height:11});case"facebook-catalog":return t.jsx(d.default,{width:11,height:11});case"messenger":return t.jsx(d.default,{width:11,height:11});case"instagram":return t.jsx(j.default,{width:11,height:11});case"whatsapp":return t.jsx(S.default,{width:11,height:11});case"gmail":return t.jsx(f.default,{width:11,height:11});case"tasks":return t.jsx(_.default,{width:11,height:11});case"livechat":return t.jsx(y.default,{width:11,height:11});case"voice":return t.jsx(A.PhoneIconWrapper,{children:t.jsx(C.default,{width:8,height:8,color:a.COLORS.content.secondaryInverse})})}},T=()=>e.status?t.jsx("div",{style:{backgroundColor:e.status==="ONLINE"?a.COLORS.special.whatsapp.brand:a.COLORS.content.inactive,width:"8px",height:"8px",borderRadius:"50%"}}):null,b=()=>e.type===i.AVATAR_TYPES.IMAGE&&(l||!e.photoUrl)&&e.useNameFallback&&e.name?i.AVATAR_TYPES.INITIALS:e.type;return t.jsxs("div",{style:{position:"relative"},children:[t.jsxs(A.AvatarStyle,{type:b(),size:e.size,background:e.background,children:[e.type===i.AVATAR_TYPES.IMAGE&&I(),e.type===i.AVATAR_TYPES.INITIALS&&t.jsx("div",{children:h()}),e.type===i.AVATAR_TYPES.ICON&&e.icon&&t.jsx(e.icon,{width:n[e.size],height:n[e.size],color:o[e.background]})]}),e.inboxSettings&&t.jsx("div",{"data-test":"avatar-inbox-badge",style:{position:"absolute",left:n[e.size]+"px",top:n[e.size]+"px",width:14,height:14,borderRadius:e?.borderRadius||"50%",display:"flex",justifyContent:"center",backgroundColor:e.inboxSettings.isSelected?e.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.background.brandLight:e.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.surface.standard,alignItems:"center"},children:O()}),e.status&&t.jsx("div",{"data-test":"avatar-status-indicator",style:{position:"absolute",left:n[e.size]+"px",top:n[e.size]+"px",width:11,height:11,borderRadius:"50%",display:"flex",justifyContent:"center",backgroundColor:a.COLORS.surface.standard,alignItems:"center"},children:T()})]})};exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=n;exports.Avatar=v;exports.BACKGROUND_VS_TEXT_COLOR_MAP=o;exports.MESSAGE_CHANNELS=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("react"),c=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),x=require("../../assets/icons/bik_livechat.svg.js"),o=require("../../assets/icons/email-channel.svg.js"),d=require("../../assets/icons/facebook_channel.svg.js"),y=require("../../assets/icons/gmail.svg.js"),f=require("../../assets/icons/instagram-channel.svg.js"),_=require("../../assets/icons/task.svg.js"),j=require("../../assets/icons/whatsapp_color.svg.js"),S=require("./Avatar.styled.js"),i=require("./AvatarHelper.js"),n={[i.SIZE.EXTRA_SMALL]:10,[i.SIZE.SMALL]:16,[i.SIZE.MEDIUM]:20,[i.SIZE.LARGE]:32},u={[i.AVATAR_BACKGROUND.LIGHT]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.WHITE]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.DARK]:a.COLORS.surface.standard,[i.AVATAR_BACKGROUND.BRAND]:a.COLORS.background.inverseLight};var A=(e=>(e.INSTAGRAM="instagram",e.MESSENGER="messenger",e.WHATSAPP="whatsapp",e.GMAIL="gmail",e.LIVECHAT="livechat",e.GOOGLE_BUSINESS_CHAT="gbm",e.SHOPIFY="shopify",e.FACEBOOK="facebook",e.EMAIL="email",e.SMTP="smtp",e.FACEBOOK_CATALOG="facebook-catalog",e.TASKS="tasks",e.BIK_LIVECHAT="livechat",e))(A||{});const C=e=>{const[l,g]=m.useState(!1),h=()=>{const s=(e.name||"").split(".").join(" ").split(" ").map(b=>b.charAt(0).toUpperCase()).slice(0,2).join(""),r=u[e.background];return e.size===i.SIZE.LARGE?t.jsx(c.TitleMedium,{style:{color:r},children:s}):e.size===i.SIZE.MEDIUM?t.jsx(c.TitleSmall,{style:{color:r},children:s}):e.size===i.SIZE.SMALL?t.jsx(c.SubHeading,{style:{color:r},children:s}):t.jsx(c.BodyTiny,{style:{color:r,fontSize:"6.667px",lineHeight:"8px"},children:s})},R=()=>e.useNameFallback&&(!e.photoUrl||l)&&e.name?t.jsx("div",{children:h()}):e.useNameFallback&&e.photoUrl&&!l?t.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[e.size],height:i.AVATAR_SIZE_MAP[e.size],style:{borderRadius:e?.borderRadius||"50%",objectFit:"contain"},src:e.photoUrl,onError:()=>{g(!0)}}):t.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[e.size],height:i.AVATAR_SIZE_MAP[e.size],style:{borderRadius:e?.borderRadius||"50%",objectFit:"contain"},src:e.photoUrl}),I=()=>{switch(e.channelName){case"email":return t.jsx(o.default,{width:11,height:11});case"smtp":return t.jsx(o.default,{width:11,height:11});case"facebook":return t.jsx(d.default,{width:11,height:11});case"facebook-catalog":return t.jsx(d.default,{width:11,height:11});case"messenger":return t.jsx(d.default,{width:11,height:11});case"instagram":return t.jsx(f.default,{width:11,height:11});case"whatsapp":return t.jsx(j.default,{width:11,height:11});case"gmail":return t.jsx(y.default,{width:11,height:11});case"tasks":return t.jsx(_.default,{width:11,height:11});case"livechat":return t.jsx(x.default,{width:11,height:11})}},O=()=>e.status?t.jsx("div",{style:{backgroundColor:e.status==="ONLINE"?a.COLORS.special.whatsapp.brand:a.COLORS.content.inactive,width:"8px",height:"8px",borderRadius:"50%"}}):null,T=()=>e.type===i.AVATAR_TYPES.IMAGE&&(l||!e.photoUrl)&&e.useNameFallback&&e.name?i.AVATAR_TYPES.INITIALS:e.type;return t.jsxs("div",{style:{position:"relative"},children:[t.jsxs(S.AvatarStyle,{type:T(),size:e.size,background:e.background,children:[e.type===i.AVATAR_TYPES.IMAGE&&R(),e.type===i.AVATAR_TYPES.INITIALS&&t.jsx("div",{children:h()}),e.type===i.AVATAR_TYPES.ICON&&e.icon&&t.jsx(e.icon,{width:n[e.size],height:n[e.size],color:u[e.background]})]}),e.inboxSettings&&t.jsx("div",{"data-test":"avatar-inbox-badge",style:{position:"absolute",left:n[e.size]+"px",top:n[e.size]+"px",width:14,height:14,borderRadius:e?.borderRadius||"50%",display:"flex",justifyContent:"center",backgroundColor:e.inboxSettings.isSelected?e.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.background.brandLight:e.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.surface.standard,alignItems:"center"},children:I()}),e.status&&t.jsx("div",{"data-test":"avatar-status-indicator",style:{position:"absolute",left:n[e.size]+"px",top:n[e.size]+"px",width:11,height:11,borderRadius:"50%",display:"flex",justifyContent:"center",backgroundColor:a.COLORS.surface.standard,alignItems:"center"},children:O()})]})};exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=n;exports.Avatar=C;exports.BACKGROUND_VS_TEXT_COLOR_MAP=u;exports.MESSAGE_CHANNELS=A;
 //# sourceMappingURL=Avatar.js.map

package/dist/cjs/components/avatar/Avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sources":["../../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Phone as PhoneIcon } from '@src/icons';\nimport {\n\tBodyTiny,\n\tSubHeading,\n\tTitleMedium,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport BikLivechatIcon from '../../assets/icons/bik_livechat.svg';\nimport EmailIcon from '../../assets/icons/email-channel.svg';\nimport FacebookIcon from '../../assets/icons/facebook_channel.svg';\nimport GmailIcon from '../../assets/icons/gmail.svg';\nimport InstagramIcon from '../../assets/icons/instagram-channel.svg';\nimport TaskIcon from '../../assets/icons/task.svg';\nimport WhatsappIcon from '../../assets/icons/whatsapp_color.svg';\nimport { AvatarStyle, PhoneIconWrapper } from './Avatar.styled';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from './AvatarHelper';\n\nexport const AVATAR_SIZE_VS_ICON_SIZE_MAP = {\n\t[SIZE.EXTRA_SMALL]: 10,\n\t[SIZE.SMALL]: 16,\n\t[SIZE.MEDIUM]: 20,\n\t[SIZE.LARGE]: 32,\n};\n\nexport const BACKGROUND_VS_TEXT_COLOR_MAP = {\n\t[AVATAR_BACKGROUND.LIGHT]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.WHITE]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.DARK]: COLORS.surface.standard,\n\t[AVATAR_BACKGROUND.BRAND]: COLORS.background.inverseLight,\n};\n\nexport type AvatarProps = {\n\ttype: AVATAR_TYPES;\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\tname?: string;\n\tphotoUrl?: string;\n\ticon?: React.FC<{ width: number; height: number; color: string }>;\n\tuseNameFallback?: boolean;\n\tchannelName?: MESSAGE_CHANNELS;\n\tborderRadius?: string;\n\tinboxSettings?: {\n\t\tisSelected: boolean;\n\t\tisComments: boolean;\n\t};\n\tstatus?: 'ONLINE' \| 'OFFLINE' \| 'AWAY';\n};\n\nexport const enum MESSAGE_CHANNELS {\n\tINSTAGRAM = 'instagram',\n\tMESSENGER = 'messenger',\n\tWHATSAPP = 'whatsapp',\n\tGMAIL = 'gmail',\n\tLIVECHAT = 'livechat',\n\tGOOGLE_BUSINESS_CHAT = 'gbm',\n\tSHOPIFY = 'shopify',\n\tFACEBOOK = 'facebook',\n\tEMAIL = 'email',\n\tSMTP = 'smtp',\n\tFACEBOOK_CATALOG = 'facebook-catalog',\n\tTASKS = 'tasks',\n\tBIK_LIVECHAT = 'livechat',\n\tVOICE = 'voice',\n}\n\nexport const Avatar: React.FC<AvatarProps> = (props) => {\n\tconst [imgError, setImgError] = useState<boolean>(false);\n\n\tconst getInitials = () => {\n\t\tconst initials = (props.name \|\| '')\n\t\t\t.split('.')\n\t\t\t.join(' ')\n\t\t\t.split(' ')\n\t\t\t.map((e) => e.charAt(0).toUpperCase())\n\t\t\t.slice(0, 2)\n\t\t\t.join('');\n\n\t\tconst color = BACKGROUND_VS_TEXT_COLOR_MAP[props.background];\n\n\t\tif (props.size === SIZE.LARGE) {\n\t\t\treturn <TitleMedium style={{ color }}>{initials}</TitleMedium>;\n\t\t}\n\t\tif (props.size === SIZE.MEDIUM) {\n\t\t\treturn <TitleSmall style={{ color }}>{initials}</TitleSmall>;\n\t\t}\n\t\tif (props.size === SIZE.SMALL) {\n\t\t\treturn <SubHeading style={{ color }}>{initials}</SubHeading>;\n\t\t}\n\t\t// EXTRA_SMALL: 6.667px / 8px per Figma. BodyTiny's 10px/12px is too large\n\t\t// for the 16px circle (leaves 2px padding instead of the intended 4px).\n\t\treturn (\n\t\t\t<BodyTiny style={{ color, fontSize: '6.667px', lineHeight: '8px' }}>\n\t\t\t\t{initials}\n\t\t\t</BodyTiny>\n\t\t);\n\t};\n\n\tconst getImageBlock = () => {\n\t\tif (props.useNameFallback && (!props.photoUrl \|\| imgError) && props.name) {\n\t\t\treturn <div>{getInitials()}</div>;\n\t\t}\n\t\tif (props.useNameFallback && props.photoUrl && !imgError) {\n\t\t\treturn (\n\t\t\t\t<img\n\t\t\t\t\talt=\"\"\n\t\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t\t}}\n\t\t\t\t\tsrc={props.photoUrl}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<img\n\t\t\t\talt=\"\"\n\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\tstyle={{\n\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t}}\n\t\t\t\tsrc={props.photoUrl}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getChannelIcon = () => {\n\t\tswitch (props.channelName) {\n\t\t\tcase MESSAGE_CHANNELS.EMAIL:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.SMTP:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK_CATALOG:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.MESSENGER:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.INSTAGRAM:\n\t\t\t\treturn <InstagramIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.WHATSAPP:\n\t\t\t\treturn <WhatsappIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.GMAIL:\n\t\t\t\treturn <GmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.TASKS:\n\t\t\t\treturn <TaskIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.BIK_LIVECHAT:\n\t\t\t\treturn <BikLivechatIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.VOICE:\n\t\t\t\treturn (\n\t\t\t\t\t<PhoneIconWrapper>\n\t\t\t\t\t\t<PhoneIcon\n\t\t\t\t\t\t\twidth={8}\n\t\t\t\t\t\t\theight={8}\n\t\t\t\t\t\t\tcolor={COLORS.content.secondaryInverse}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PhoneIconWrapper>\n\t\t\t\t);\n\t\t}\n\t};\n\n\tconst getOnlineStatusIcon = () => {\n\t\treturn props.status ? (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tprops.status === 'ONLINE'\n\t\t\t\t\t\t\t? COLORS.special.whatsapp.brand\n\t\t\t\t\t\t\t: COLORS.content.inactive,\n\t\t\t\t\twidth: '8px',\n\t\t\t\t\theight: '8px',\n\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t}}\n\t\t\t></div>\n\t\t) : null;\n\t};\n\n\tconst getPropsType = () => {\n\t\tif (\n\t\t\tprops.type === AVATAR_TYPES.IMAGE &&\n\t\t\t(imgError \|\| !props.photoUrl) &&\n\t\t\tprops.useNameFallback &&\n\t\t\tprops.name\n\t\t) {\n\t\t\treturn AVATAR_TYPES.INITIALS;\n\t\t}\n\n\t\treturn props.type;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'relative',\n\t\t\t}}\n\t\t>\n\t\t\t<AvatarStyle\n\t\t\t\ttype={getPropsType()}\n\t\t\t\tsize={props.size}\n\t\t\t\tbackground={props.background}\n\t\t\t>\n\t\t\t\t{props.type === AVATAR_TYPES.IMAGE && getImageBlock()}\n\t\t\t\t{props.type === AVATAR_TYPES.INITIALS && <div>{getInitials()}</div>}\n\t\t\t\t{props.type === AVATAR_TYPES.ICON && props.icon && (\n\t\t\t\t\t<props.icon\n\t\t\t\t\t\twidth={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\theight={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\tcolor={BACKGROUND_VS_TEXT_COLOR_MAP[props.background]}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</AvatarStyle>\n\t\t\t{props.inboxSettings && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-inbox-badge\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 14,\n\t\t\t\t\t\theight: 14,\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: props.inboxSettings.isSelected\n\t\t\t\t\t\t\t? props.inboxSettings.isComments\n\t\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t: props.inboxSettings.isComments\n\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getChannelIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.status && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-status-indicator\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 11,\n\t\t\t\t\t\theight: 11,\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getOnlineStatusIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["AVATAR_SIZE_VS_ICON_SIZE_MAP","SIZE","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","COLORS","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","e","color","TitleMedium","TitleSmall","SubHeading","jsx","BodyTiny","getImageBlock","AVATAR_SIZE_MAP","getChannelIcon","EmailIcon","FacebookIcon","InstagramIcon","WhatsappIcon","GmailIcon","TaskIcon","BikLivechatIcon","PhoneIconWrapper","PhoneIcon","getOnlineStatusIcon","getPropsType","AVATAR_TYPES","jsxs","AvatarStyle"],"mappings":"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"}
1	+ {"version":3,"file":"Avatar.js","sources":["../../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n\tBodyTiny,\n\tSubHeading,\n\tTitleMedium,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport BikLivechatIcon from '../../assets/icons/bik_livechat.svg';\nimport EmailIcon from '../../assets/icons/email-channel.svg';\nimport FacebookIcon from '../../assets/icons/facebook_channel.svg';\nimport GmailIcon from '../../assets/icons/gmail.svg';\nimport InstagramIcon from '../../assets/icons/instagram-channel.svg';\nimport TaskIcon from '../../assets/icons/task.svg';\nimport WhatsappIcon from '../../assets/icons/whatsapp_color.svg';\nimport { AvatarStyle } from './Avatar.styled';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from './AvatarHelper';\n\nexport const AVATAR_SIZE_VS_ICON_SIZE_MAP = {\n\t[SIZE.EXTRA_SMALL]: 10,\n\t[SIZE.SMALL]: 16,\n\t[SIZE.MEDIUM]: 20,\n\t[SIZE.LARGE]: 32,\n};\n\nexport const BACKGROUND_VS_TEXT_COLOR_MAP = {\n\t[AVATAR_BACKGROUND.LIGHT]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.WHITE]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.DARK]: COLORS.surface.standard,\n\t[AVATAR_BACKGROUND.BRAND]: COLORS.background.inverseLight,\n};\n\nexport type AvatarProps = {\n\ttype: AVATAR_TYPES;\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\tname?: string;\n\tphotoUrl?: string;\n\ticon?: React.FC<{ width: number; height: number; color: string }>;\n\tuseNameFallback?: boolean;\n\tchannelName?: MESSAGE_CHANNELS;\n\tborderRadius?: string;\n\tinboxSettings?: {\n\t\tisSelected: boolean;\n\t\tisComments: boolean;\n\t};\n\tstatus?: 'ONLINE' \| 'OFFLINE' \| 'AWAY';\n};\n\nexport const enum MESSAGE_CHANNELS {\n\tINSTAGRAM = 'instagram',\n\tMESSENGER = 'messenger',\n\tWHATSAPP = 'whatsapp',\n\tGMAIL = 'gmail',\n\tLIVECHAT = 'livechat',\n\tGOOGLE_BUSINESS_CHAT = 'gbm',\n\tSHOPIFY = 'shopify',\n\tFACEBOOK = 'facebook',\n\tEMAIL = 'email',\n\tSMTP = 'smtp',\n\tFACEBOOK_CATALOG = 'facebook-catalog',\n\tTASKS = 'tasks',\n\tBIK_LIVECHAT = 'livechat',\n}\n\nexport const Avatar: React.FC<AvatarProps> = (props) => {\n\tconst [imgError, setImgError] = useState<boolean>(false);\n\n\tconst getInitials = () => {\n\t\tconst initials = (props.name \|\| '')\n\t\t\t.split('.')\n\t\t\t.join(' ')\n\t\t\t.split(' ')\n\t\t\t.map((e) => e.charAt(0).toUpperCase())\n\t\t\t.slice(0, 2)\n\t\t\t.join('');\n\n\t\tconst color = BACKGROUND_VS_TEXT_COLOR_MAP[props.background];\n\n\t\tif (props.size === SIZE.LARGE) {\n\t\t\treturn <TitleMedium style={{ color }}>{initials}</TitleMedium>;\n\t\t}\n\t\tif (props.size === SIZE.MEDIUM) {\n\t\t\treturn <TitleSmall style={{ color }}>{initials}</TitleSmall>;\n\t\t}\n\t\tif (props.size === SIZE.SMALL) {\n\t\t\treturn <SubHeading style={{ color }}>{initials}</SubHeading>;\n\t\t}\n\t\t// EXTRA_SMALL: 6.667px / 8px per Figma. BodyTiny's 10px/12px is too large\n\t\t// for the 16px circle (leaves 2px padding instead of the intended 4px).\n\t\treturn (\n\t\t\t<BodyTiny style={{ color, fontSize: '6.667px', lineHeight: '8px' }}>\n\t\t\t\t{initials}\n\t\t\t</BodyTiny>\n\t\t);\n\t};\n\n\tconst getImageBlock = () => {\n\t\tif (props.useNameFallback && (!props.photoUrl \|\| imgError) && props.name) {\n\t\t\treturn <div>{getInitials()}</div>;\n\t\t}\n\t\tif (props.useNameFallback && props.photoUrl && !imgError) {\n\t\t\treturn (\n\t\t\t\t<img\n\t\t\t\t\talt=\"\"\n\t\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t\t}}\n\t\t\t\t\tsrc={props.photoUrl}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<img\n\t\t\t\talt=\"\"\n\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\tstyle={{\n\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t}}\n\t\t\t\tsrc={props.photoUrl}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getChannelIcon = () => {\n\t\tswitch (props.channelName) {\n\t\t\tcase MESSAGE_CHANNELS.EMAIL:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.SMTP:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK_CATALOG:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.MESSENGER:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.INSTAGRAM:\n\t\t\t\treturn <InstagramIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.WHATSAPP:\n\t\t\t\treturn <WhatsappIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.GMAIL:\n\t\t\t\treturn <GmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.TASKS:\n\t\t\t\treturn <TaskIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.BIK_LIVECHAT:\n\t\t\t\treturn <BikLivechatIcon width={11} height={11} />;\n\t\t}\n\t};\n\n\tconst getOnlineStatusIcon = () => {\n\t\treturn props.status ? (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tprops.status === 'ONLINE'\n\t\t\t\t\t\t\t? COLORS.special.whatsapp.brand\n\t\t\t\t\t\t\t: COLORS.content.inactive,\n\t\t\t\t\twidth: '8px',\n\t\t\t\t\theight: '8px',\n\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t}}\n\t\t\t></div>\n\t\t) : null;\n\t};\n\n\tconst getPropsType = () => {\n\t\tif (\n\t\t\tprops.type === AVATAR_TYPES.IMAGE &&\n\t\t\t(imgError \|\| !props.photoUrl) &&\n\t\t\tprops.useNameFallback &&\n\t\t\tprops.name\n\t\t) {\n\t\t\treturn AVATAR_TYPES.INITIALS;\n\t\t}\n\n\t\treturn props.type;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'relative',\n\t\t\t}}\n\t\t>\n\t\t\t<AvatarStyle\n\t\t\t\ttype={getPropsType()}\n\t\t\t\tsize={props.size}\n\t\t\t\tbackground={props.background}\n\t\t\t>\n\t\t\t\t{props.type === AVATAR_TYPES.IMAGE && getImageBlock()}\n\t\t\t\t{props.type === AVATAR_TYPES.INITIALS && <div>{getInitials()}</div>}\n\t\t\t\t{props.type === AVATAR_TYPES.ICON && props.icon && (\n\t\t\t\t\t<props.icon\n\t\t\t\t\t\twidth={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\theight={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\tcolor={BACKGROUND_VS_TEXT_COLOR_MAP[props.background]}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</AvatarStyle>\n\t\t\t{props.inboxSettings && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-inbox-badge\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 14,\n\t\t\t\t\t\theight: 14,\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: props.inboxSettings.isSelected\n\t\t\t\t\t\t\t? props.inboxSettings.isComments\n\t\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t: props.inboxSettings.isComments\n\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getChannelIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.status && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-status-indicator\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 11,\n\t\t\t\t\t\theight: 11,\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getOnlineStatusIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["AVATAR_SIZE_VS_ICON_SIZE_MAP","SIZE","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","COLORS","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","e","color","TitleMedium","TitleSmall","SubHeading","jsx","BodyTiny","getImageBlock","AVATAR_SIZE_MAP","getChannelIcon","EmailIcon","FacebookIcon","InstagramIcon","WhatsappIcon","GmailIcon","TaskIcon","BikLivechatIcon","getOnlineStatusIcon","getPropsType","AVATAR_TYPES","jsxs","AvatarStyle"],"mappings":"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"}

package/dist/cjs/components/avatar/Avatar.styled.js CHANGED Viewed

@@ -1,19 +1,11 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),t=require("./AvatarHelper.js"),r=require("../../constants/Theme.js"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=o(a),A=n.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),t=require("./AvatarHelper.js"),A=require("../../constants/Theme.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=a(r),d=n.default.div`
 	width: ${e=>t.AVATAR_SIZE_MAP[e.size]+"px"};
 	height: ${e=>t.AVATAR_SIZE_MAP[e.size]+"px"};
 	display: flex;
 	justify-content: center;
 	align-items: center;
-	background-color: ${e=>e.type===t.AVATAR_TYPES.IMAGE?"null":e.background===t.AVATAR_BACKGROUND.LIGHT?r.COLORS.background.base:e.background===t.AVATAR_BACKGROUND.WHITE?r.COLORS.surface.standard:e.background===t.AVATAR_BACKGROUND.BRAND?r.COLORS.background.brandLight:r.COLORS.background.inverse};
-	border: ${e=>e.background===t.AVATAR_BACKGROUND.LIGHT||e.background===t.AVATAR_BACKGROUND.WHITE?"1px solid "+r.COLORS.stroke.primary:0};
+	background-color: ${e=>e.type===t.AVATAR_TYPES.IMAGE?"null":e.background===t.AVATAR_BACKGROUND.LIGHT?A.COLORS.background.base:e.background===t.AVATAR_BACKGROUND.WHITE?A.COLORS.surface.standard:e.background===t.AVATAR_BACKGROUND.BRAND?A.COLORS.background.brandLight:A.COLORS.background.inverse};
+	border: ${e=>e.background===t.AVATAR_BACKGROUND.LIGHT||e.background===t.AVATAR_BACKGROUND.WHITE?"1px solid "+A.COLORS.stroke.primary:0};
 	border-radius: 50%;
-`,d=n.default.div`
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 11px;
-	height: 11px;
-	border-radius: 4px;
-	background-color: ${r.COLORS.content.secondary};
-`;exports.AvatarStyle=A;exports.PhoneIconWrapper=d;
+`;exports.AvatarStyle=d;
 //# sourceMappingURL=Avatar.styled.js.map

package/dist/cjs/components/avatar/Avatar.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: props.background === AVATAR_BACKGROUND.BRAND\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT \|\|\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n\nexport const PhoneIconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 11px;\n\theight: 11px;\n\tborder-radius: 4px;\n\tbackground-color: ${COLORS.content.secondary};\n`;\n"],"names":["AvatarStyle","styled","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"~~,"PhoneIconWrapper"~~],"mappings":"yPASaA,EAAcC,EAAAA,QAAO;AAAA,UAKvBC,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA,WAC3CA,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAIlCA,GACpBA,EAAM,OAASE,EAAAA,aAAa,MACzB,OACAF,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,KAClBJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,QAAQ,SACfJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,WAClBA,EAAAA,OAAO,WAAW,OAAO;AAAA,WAClBJ,GACVA,EAAM,aAAeG,EAAAA,kBAAkB,OACvCH,EAAM,aAAeG,EAAAA,kBAAkB,MACpC,aAAeC,EAAAA,OAAO,OAAO,QAC7B,CAAC;AAAA;AAAA~~,EAIOC,EAAmBN,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOlBK,EAAAA,OAAO,QAAQ,SAAS;AAAA~~"}
1	+ {"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: props.background === AVATAR_BACKGROUND.BRAND\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT \|\|\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n"],"names":["AvatarStyle","styled","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"],"mappings":"yPASaA,EAAcC,EAAAA,QAAO;AAAA,UAKvBC,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA,WAC3CA,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAIlCA,GACpBA,EAAM,OAASE,EAAAA,aAAa,MACzB,OACAF,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,KAClBJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,QAAQ,SACfJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,WAClBA,EAAAA,OAAO,WAAW,OAAO;AAAA,WAClBJ,GACVA,EAAM,aAAeG,EAAAA,kBAAkB,OACvCH,EAAM,aAAeG,EAAAA,kBAAkB,MACpC,aAAeC,EAAAA,OAAO,OAAO,QAC7B,CAAC;AAAA;AAAA"}

package/dist/cjs/components/button/Button.styled.js CHANGED Viewed

@@ -105,6 +105,7 @@
 			cursor: not-allowed;
 			padding: 0;
 		${e.getLoadingBorder(t.buttonType,t.size,t.inverse)}
+		${e.getLoadingBackground(t.buttonType,t.size,t.inverse,t.buttonColor)}
 		.button-container {
 			display: flex;

package/dist/cjs/components/button/Button.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.styled.js","sources":["../../../../src/components/button/Button.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { Size, Type } from './model';\nimport {\n\tgenerateDisabledStyling,\n\tgenerateInverseHoverBackground,\n\tgetBackgroundColor,\n\tgetBorder,\n\tgetClickEffect,\n\tgetColor,\n\tgetDashedBorderStyling,\n\tgetDisabledTextColor,\n\tgetHoverButtonBackground,\n\tgetHoverButtonBackgroundCustom,\n\tgetHoverButtonTextDecorationStyle,\n\tgetLoadingBackground,\n\tgetLoadingBorder,\n\tgetLoadingButtonBackgroundCustom,\n\tgetPadding,\n} from './themes';\n\nexport const Button = styled.button<{\n\tsize: Size;\n\tbuttonType: Type;\n\tisLoading?: boolean;\n\tinverse?: boolean;\n\tdisabled?: boolean;\n\tmatchParentWidth?: boolean;\n\tversion?: '1.0' \| '2.0' \| '3.0';\n\tdarkMode?: boolean;\n\tactivated?: boolean;\n\terror?: boolean;\n\tbuttonColor?: string;\n}>`\n\tall: unset;\n\toutline: none;\n\tcursor: pointer;\n\tdisplay: flex;\n\tgap: 8.83px;\n\tborder-radius: ${(props) => (props.buttonType == 'text' ? '0' : '4px')};\n\toverflow: hidden;\n\t${(props) => (props.matchParentWidth ? `flex-grow: 1;` : '')}\n\tbackground-color: ${(props) =>\n\t\tgetBackgroundColor(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.inverse,\n\t\t\tprops.darkMode,\n\t\t\tprops.buttonColor,\n\t\t)};\n\n\t${(props) =>\n\t\tprops.buttonType.startsWith('dash')\n\t\t\t? `.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t}`\n\t\t\t: `padding: ${getPadding(props.buttonType, props.size)};\n\t${getBorder(\n\t\tprops.version ?? '1.0',\n\t\tprops.buttonType,\n\t\tprops.size,\n\t\tprops.inverse,\n\t\tprops.error,\n\t)}`}\n\n\t.icon-component {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t.icon-trailing {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t.text {\n\t\tcolor: ${(props) =>\n\t\t\tgetColor(props.buttonType, props.size, props.inverse, props.darkMode)};\n\t}\n\n\t.icon-leading {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t${(props) =>\n\t\tgetDashedBorderStyling(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.isLoading\n\t\t\t\t? COLORS.stroke.brandLightAlt\n\t\t\t\t: props.error\n\t\t\t\t? COLORS.stroke.negative.vibrant\n\t\t\t\t: undefined,\n\t\t)}\n\n\t.overlay-container {\n\t\tdisplay: none;\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\tprops.activated &&\n\t\t(props.buttonType == 'dashBold' \|\| props.buttonType == 'dashRegular') &&\n\t\t`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t${`.text {\n\t\t\tcolor: ${COLORS.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${COLORS.background.brand};\n\t\t}\n\t\t`}\n\t}\n\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t`}\n\n\t:disabled {\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\tcursor: ${(props) =>\n\t\t\tprops.buttonType === 'text' ? 'auto' : 'not-allowed'};\n\t\t${(props) =>\n\t\t\tgenerateDisabledStyling(props.buttonType, props.size, props.inverse)}\n\t\t.text {\n\t\t\tcolor: ${(props) => getDisabledTextColor(props.inverse)} !important;\n\t\t}\n\t\t${(props) =>\n\t\t\tgetDashedBorderStyling(\n\t\t\t\tprops.buttonType,\n\t\t\t\tprops.size,\n\t\t\t\tCOLORS.stroke.primary,\n\t\t\t)}\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\t`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${\n\t\t\t\t\t\tprops.size === 'chip' &&\n\t\t\t\t\t\t`.text {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\t}\n\t\t\t\t}\n\n\n\t\t\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t\t\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t\t}`}\n\n\t${(props) =>\n\t\t// do not load hover styles for loading state and also active state\n\t\t!props.isLoading\n\t\t\t? `:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t{${\n\t\t\t\t\tprops.buttonColor\n\t\t\t\t\t\t? `background-color: ${getHoverButtonBackgroundCustom(\n\t\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t\t15,\n\t\t\t\t\t\t )}`\n\t\t\t\t\t\t: ''\n\t\t\t\t}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${getHoverButtonBackground(props.buttonType, props.inverse)}\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.size === 'chip' && props.buttonType !== 'text'\n\t\t\t\t\t\t? props.darkMode\n\t\t\t\t\t\t\t? `background-color: ${COLORS.stroke.primary};`\n\t\t\t\t\t\t\t: `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'special'\n\t\t\t\t\t\t? `background-color: ${COLORS.background.brandLight};`\n\t\t\t\t\t\t: props.buttonType === 'secondaryGray'\n\t\t\t\t\t\t? `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'primary' &&\n\t\t\t\t\tprops.size !== 'chip' &&\n\t\t\t\t\tprops.size !== 'xs' &&\n\t\t\t\t\t!props.inverse &&\n\t\t\t\t\t!props.buttonColor\n\t\t\t\t\t\t? `background-color: ${COLORS.background.inverse};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonType === 'text'\n\t\t\t\t\t? getHoverButtonTextDecorationStyle(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.inverse\n\t\t\t\t\t? generateInverseHoverBackground(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t}`\n\t\t\t: `\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${getLoadingBorder(props.buttonType, props.size, props.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t.icon-leading,\n\t\t\t.icon-component,\n\t\t\t.icon-trailing {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonColor\n\t\t\t\t\t? `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t15,\n\t\t\t\t\t )};`\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${getLoadingBackground(\n\t\t\t\t\tprops.buttonType,\n\t\t\t\t\tprops.size,\n\t\t\t\t\tprops.inverse,\n\t\t\t\t\tprops.buttonColor,\n\t\t\t\t)}\n\t\t\t\t.spinner {\n\t\t\t\t\tline-height: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}`}\n\n\t\t.button-container {\n\t\tdisplay: flex;\n\t\tgap: 8.33px;\n\t\t${(props) => (props.matchParentWidth ? 'margin: auto;' : '')}\n\t}\n`;\n\nexport const ButtonCustomDashedBorder = () => {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"line-top\"></div>\n\t\t\t<div className=\"line-left\"></div>\n\t\t\t<div className=\"line-bottom\"></div>\n\t\t\t<div className=\"line-right\"></div>\n\t\t</>\n\t);\n};\n"],"names":["Button","styled","props","getBackgroundColor","getPadding","getBorder","getColor","getDashedBorderStyling","COLORS","getClickEffect","generateDisabledStyling","getDisabledTextColor","getLoadingBorder","getLoadingButtonBackgroundCustom","getLoadingBackground","getHoverButtonBackgroundCustom","getHoverButtonBackground","getHoverButtonTextDecorationStyle","generateInverseHoverBackground","ButtonCustomDashedBorder","jsxs","Fragment","jsx"],"mappings":"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"}
1	+ {"version":3,"file":"Button.styled.js","sources":["../../../../src/components/button/Button.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { Size, Type } from './model';\nimport {\n\tgenerateDisabledStyling,\n\tgenerateInverseHoverBackground,\n\tgetBackgroundColor,\n\tgetBorder,\n\tgetClickEffect,\n\tgetColor,\n\tgetDashedBorderStyling,\n\tgetDisabledTextColor,\n\tgetHoverButtonBackground,\n\tgetHoverButtonBackgroundCustom,\n\tgetHoverButtonTextDecorationStyle,\n\tgetLoadingBackground,\n\tgetLoadingBorder,\n\tgetLoadingButtonBackgroundCustom,\n\tgetPadding,\n} from './themes';\n\nexport const Button = styled.button<{\n\tsize: Size;\n\tbuttonType: Type;\n\tisLoading?: boolean;\n\tinverse?: boolean;\n\tdisabled?: boolean;\n\tmatchParentWidth?: boolean;\n\tversion?: '1.0' \| '2.0' \| '3.0';\n\tdarkMode?: boolean;\n\tactivated?: boolean;\n\terror?: boolean;\n\tbuttonColor?: string;\n}>`\n\tall: unset;\n\toutline: none;\n\tcursor: pointer;\n\tdisplay: flex;\n\tgap: 8.83px;\n\tborder-radius: ${(props) => (props.buttonType == 'text' ? '0' : '4px')};\n\toverflow: hidden;\n\t${(props) => (props.matchParentWidth ? `flex-grow: 1;` : '')}\n\tbackground-color: ${(props) =>\n\t\tgetBackgroundColor(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.inverse,\n\t\t\tprops.darkMode,\n\t\t\tprops.buttonColor,\n\t\t)};\n\n\t${(props) =>\n\t\tprops.buttonType.startsWith('dash')\n\t\t\t? `.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t}`\n\t\t\t: `padding: ${getPadding(props.buttonType, props.size)};\n\t${getBorder(\n\t\tprops.version ?? '1.0',\n\t\tprops.buttonType,\n\t\tprops.size,\n\t\tprops.inverse,\n\t\tprops.error,\n\t)}`}\n\n\t.icon-component {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t.icon-trailing {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t.text {\n\t\tcolor: ${(props) =>\n\t\t\tgetColor(props.buttonType, props.size, props.inverse, props.darkMode)};\n\t}\n\n\t.icon-leading {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' \|\| props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t${(props) =>\n\t\tgetDashedBorderStyling(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.isLoading\n\t\t\t\t? COLORS.stroke.brandLightAlt\n\t\t\t\t: props.error\n\t\t\t\t? COLORS.stroke.negative.vibrant\n\t\t\t\t: undefined,\n\t\t)}\n\n\t.overlay-container {\n\t\tdisplay: none;\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\tprops.activated &&\n\t\t(props.buttonType == 'dashBold' \|\| props.buttonType == 'dashRegular') &&\n\t\t`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t${`.text {\n\t\t\tcolor: ${COLORS.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${COLORS.background.brand};\n\t\t}\n\t\t`}\n\t}\n\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t`}\n\n\t:disabled {\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\tcursor: ${(props) =>\n\t\t\tprops.buttonType === 'text' ? 'auto' : 'not-allowed'};\n\t\t${(props) =>\n\t\t\tgenerateDisabledStyling(props.buttonType, props.size, props.inverse)}\n\t\t.text {\n\t\t\tcolor: ${(props) => getDisabledTextColor(props.inverse)} !important;\n\t\t}\n\t\t${(props) =>\n\t\t\tgetDashedBorderStyling(\n\t\t\t\tprops.buttonType,\n\t\t\t\tprops.size,\n\t\t\t\tCOLORS.stroke.primary,\n\t\t\t)}\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\t`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${\n\t\t\t\t\t\tprops.size === 'chip' &&\n\t\t\t\t\t\t`.text {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\t}\n\t\t\t\t}\n\n\n\t\t\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t\t\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t\t}`}\n\n\t${(props) =>\n\t\t// do not load hover styles for loading state and also active state\n\t\t!props.isLoading\n\t\t\t? `:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t{${\n\t\t\t\t\tprops.buttonColor\n\t\t\t\t\t\t? `background-color: ${getHoverButtonBackgroundCustom(\n\t\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t\t15,\n\t\t\t\t\t\t )}`\n\t\t\t\t\t\t: ''\n\t\t\t\t}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${getHoverButtonBackground(props.buttonType, props.inverse)}\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.size === 'chip' && props.buttonType !== 'text'\n\t\t\t\t\t\t? props.darkMode\n\t\t\t\t\t\t\t? `background-color: ${COLORS.stroke.primary};`\n\t\t\t\t\t\t\t: `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'special'\n\t\t\t\t\t\t? `background-color: ${COLORS.background.brandLight};`\n\t\t\t\t\t\t: props.buttonType === 'secondaryGray'\n\t\t\t\t\t\t? `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'primary' &&\n\t\t\t\t\tprops.size !== 'chip' &&\n\t\t\t\t\tprops.size !== 'xs' &&\n\t\t\t\t\t!props.inverse &&\n\t\t\t\t\t!props.buttonColor\n\t\t\t\t\t\t? `background-color: ${COLORS.background.inverse};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonType === 'text'\n\t\t\t\t\t? getHoverButtonTextDecorationStyle(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.inverse\n\t\t\t\t\t? generateInverseHoverBackground(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t}`\n\t\t\t: `\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${getLoadingBorder(props.buttonType, props.size, props.inverse)}\n\t\t${getLoadingBackground(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.inverse,\n\t\t\tprops.buttonColor,\n\t\t)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t.icon-leading,\n\t\t\t.icon-component,\n\t\t\t.icon-trailing {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonColor\n\t\t\t\t\t? `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t15,\n\t\t\t\t\t )};`\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${getLoadingBackground(\n\t\t\t\t\tprops.buttonType,\n\t\t\t\t\tprops.size,\n\t\t\t\t\tprops.inverse,\n\t\t\t\t\tprops.buttonColor,\n\t\t\t\t)}\n\t\t\t\t.spinner {\n\t\t\t\t\tline-height: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}`}\n\n\t\t.button-container {\n\t\tdisplay: flex;\n\t\tgap: 8.33px;\n\t\t${(props) => (props.matchParentWidth ? 'margin: auto;' : '')}\n\t}\n`;\n\nexport const ButtonCustomDashedBorder = () => {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"line-top\"></div>\n\t\t\t<div className=\"line-left\"></div>\n\t\t\t<div className=\"line-bottom\"></div>\n\t\t\t<div className=\"line-right\"></div>\n\t\t</>\n\t);\n};\n"],"names":["Button","styled","props","getBackgroundColor","getPadding","getBorder","getColor","getDashedBorderStyling","COLORS","getClickEffect","generateDisabledStyling","getDisabledTextColor","getLoadingBorder","getLoadingBackground","getLoadingButtonBackgroundCustom","getHoverButtonBackgroundCustom","getHoverButtonBackground","getHoverButtonTextDecorationStyle","generateInverseHoverBackground","ButtonCustomDashedBorder","jsxs","Fragment","jsx"],"mappings":"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"}

package/dist/cjs/components/dropdown/Dropdown.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("react"),s=require("../../constants/Theme.js"),U=require("../../assets/icons/chevronDown.svg.js"),_=require("../input/context/InputStyleProvider.js"),G=require("./ChipInput.js"),J=require("./DropdownPopover/index.js"),K=require("./OpenedDropdown/utils/iterationOnOptions.js"),Q=require("../input/Input.js");function I(){}const R=({placeHolder:c,size:j,onSelect:b,defaultOptions:l,disabled:v,noErrorHint:q,placeHolderHeight:S,showPlaceholderWhenSelected:L=!1,inputStyle:W={},inputType:O="default",onDeleteChip:E,truncatedText:M,showLeadingIconInPlaceholder:T=!1,showTrailingIconPlaceholder:w=!1,showLabelsOnMoreHover:k=!1,value:o,showSelected:h=!1,onDropdownVisbilityChange:A,...e})=>{const[f,F]=r.useState(!1),[m,y]=r.useState(!1),n=j??"default",V=r.useRef(),[a,d]=r.useState(l??[]);function p(t){Array.isArray(t)?d([...t]):d([t]),b?.(t)}r.useEffect(()=>{const t=[];e?.options?.forEach(u=>{u.options?u.options.forEach(g=>{g.selected&&t.push({...g,label:g.label})}):u.selected&&t.push(u)}),d([...t])},[e.options]),r.useEffect(()=>{l&&d([...l])},[l]);const z=K.getSelectedOptionsAsText(a),B=L?c:z??c??"Select an option",x=e.buttonWidth,C=x??e.width??"100%",N=e.dropdownWidth??C;return i.jsx(i.Fragment,{children:i.jsx(_.InputStyleContext.Provider,{value:{InputWrapper:{height:S||(n==="x-small"?24:n==="small"?32:48),width:C,...x?{maxWidth:x}:{},zIndex:1,cursor:"pointer",padding:n==="x-small"?"4px 8px":"6px 8px",backgroundColor:e.version==="3.0"?f||m?s.COLORS.surface.hovered:s.COLORS.surface.standard:h&&o!==void 0?s.BASE_COLORS.positive[100]:m?s.COLORS.background.inactive:s.COLORS.surface.standard,transition:"background-color 0.3s ease",...W},input:{minHeight:"100%",maxWidth:"100%",color:h&&o!==void 0?s.COLORS.content.positive:"inherit"}},children:i.jsx("div",{onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),style:e.width?{width:e.width}:void 0,children:i.jsxs(J.DropdownPopover,{"data-test":e["data-test"],ref:V,onSelect:p,disabled:v,...e,onDropdownVisbilityChange:t=>{F(t),A?.(t)},width:N,children:[O=="default"&&i.jsx(Q.Input,{version:e.version,noErrorHint:q,state:v?"disabled":"none",value:o===void 0?B:o,errorMessage:e.error,variant:n,placeholder:c??"Select an option",onChangeText:I,leftIcon:T&&a[0]?.leadingIcon?{icon:()=>i.jsx(i.Fragment,{children:a[0]?.leadingIcon})}:void 0,rightIcon:{icon:()=>i.jsxs("div",{style:{display:"flex"},children:[w&&a[0]?.trailingIcon,i.jsx(U.default,{style:{transform:f?"rotate(180deg)":"rotate(0deg)"},onClick:I,width:n==="x-small"?16:n==="small"?20:24,height:n==="x-small"?16:n==="small"?20:24,color:h?s.COLORS.content.positive:s.COLORS.content.primary})]})},truncateText:M??!0}),O=="chip"&&i.jsx(G.default,{placeholder:c??"Select options",chips:a,onDeleteChip:t=>{E?.(t)},errorMessage:e.error,isDropdownOpened:f,sizeToUse:n,containerStyle:{width:e.width??"100%",cursor:"pointer"},showLabelsOnMoreHover:k})]})})})})};R.displayName="Dropdown";exports.Dropdown=R;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("react"),s=require("../../constants/Theme.js"),U=require("../../assets/icons/chevronDown.svg.js"),_=require("../input/context/InputStyleProvider.js"),G=require("./ChipInput.js"),J=require("./DropdownPopover/index.js"),K=require("./OpenedDropdown/utils/iterationOnOptions.js"),Q=require("../input/Input.js");function I(){}const R=({placeHolder:c,size:j,onSelect:b,defaultOptions:l,disabled:v,noErrorHint:q,placeHolderHeight:S,showPlaceholderWhenSelected:L=!1,inputStyle:W={},inputType:O="default",onDeleteChip:E,truncatedText:M,showLeadingIconInPlaceholder:T=!1,showTrailingIconPlaceholder:w=!1,showLabelsOnMoreHover:k=!1,value:o,showSelected:f=!1,onDropdownVisbilityChange:A,...e})=>{const[d,F]=r.useState(!1),[m,y]=r.useState(!1),n=j??"default",V=r.useRef(),[a,u]=r.useState(l??[]);function p(t){Array.isArray(t)?u([...t]):u([t]),b?.(t)}r.useEffect(()=>{const t=[];e?.options?.forEach(h=>{h.options?h.options.forEach(g=>{g.selected&&t.push({...g,label:g.label})}):h.selected&&t.push(h)}),u([...t])},[e.options]),r.useEffect(()=>{l&&u([...l])},[l]);const z=K.getSelectedOptionsAsText(a),B=L?c:z??c??"Select an option",x=e.buttonWidth,C=x??e.width??"100%",N=e.dropdownWidth??C;return i.jsx(i.Fragment,{children:i.jsx(_.InputStyleContext.Provider,{value:{InputWrapper:{height:S||(n==="x-small"?24:n==="small"?32:48),width:C,...x?{maxWidth:x}:{},zIndex:1,cursor:"pointer",padding:n==="x-small"?"4px 8px":"6px 8px",backgroundColor:e.version==="3.0"?d||m?s.COLORS.surface.hovered:s.COLORS.surface.standard:f&&o!==void 0?s.BASE_COLORS.positive[100]:m&&!d?s.COLORS.background.inactive:s.COLORS.surface.standard,transition:"background-color 0.3s ease",...W},input:{minHeight:"100%",maxWidth:"100%",color:f&&o!==void 0?s.COLORS.content.positive:"inherit"}},children:i.jsx("div",{onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),style:e.width?{width:e.width}:void 0,children:i.jsxs(J.DropdownPopover,{"data-test":e["data-test"],ref:V,onSelect:p,disabled:v,...e,onDropdownVisbilityChange:t=>{F(t),A?.(t)},width:N,children:[O=="default"&&i.jsx(Q.Input,{version:e.version,noErrorHint:q,state:v?"disabled":"none",value:o===void 0?B:o,errorMessage:e.error,variant:n,placeholder:c??"Select an option",onChangeText:I,leftIcon:T&&a[0]?.leadingIcon?{icon:()=>i.jsx(i.Fragment,{children:a[0]?.leadingIcon})}:void 0,rightIcon:{icon:()=>i.jsxs("div",{style:{display:"flex"},children:[w&&a[0]?.trailingIcon,i.jsx(U.default,{style:{transform:d?"rotate(180deg)":"rotate(0deg)"},onClick:I,width:n==="x-small"?16:n==="small"?20:24,height:n==="x-small"?16:n==="small"?20:24,color:f?s.COLORS.content.positive:s.COLORS.content.primary})]})},truncateText:M??!0}),O=="chip"&&i.jsx(G.default,{placeholder:c??"Select options",chips:a,onDeleteChip:t=>{E?.(t)},errorMessage:e.error,isDropdownOpened:d,sizeToUse:n,containerStyle:{width:e.width??"100%",cursor:"pointer"},showLabelsOnMoreHover:k})]})})})})};R.displayName="Dropdown";exports.Dropdown=R;
 //# sourceMappingURL=Dropdown.js.map