@thisispamela/react 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -6
- package/dist/CallButton.d.ts +1 -1
- package/dist/CallButton.d.ts.map +1 -1
- package/dist/CallHistory.d.ts.map +1 -1
- package/dist/CallStatus.d.ts.map +1 -1
- package/dist/PamelaProvider.d.ts.map +1 -1
- package/dist/TranscriptViewer.d.ts.map +1 -1
- package/dist/index.d.ts +4 -2
- package/dist/index.esm.js +117 -101
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +116 -100
- package/dist/index.js.map +1 -1
- package/dist/types.d.ts +3 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +14 -4
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/PamelaProvider.tsx","../src/CallButton.tsx","../src/TranscriptViewer.tsx","../src/CallStatus.tsx","../src/CallHistory.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React, { createContext, useContext, ReactNode } from 'react';\nimport { PamelaClient, PamelaClientConfig } from '@thisispamela/sdk';\nimport { PamelaConfig } from './types';\n\ninterface PamelaContextValue {\n client: PamelaClient;\n}\n\nconst PamelaContext = createContext<PamelaContextValue | null>(null);\n\nexport interface PamelaProviderProps {\n config: PamelaConfig;\n children: ReactNode;\n}\n\nexport function PamelaProvider({ config, children }: PamelaProviderProps) {\n const client = new PamelaClient({\n apiKey: config.apiKey,\n baseUrl: config.baseUrl,\n });\n\n return (\n <PamelaContext.Provider value={{ client }}>\n {children}\n </PamelaContext.Provider>\n );\n}\n\nexport function usePamela(): PamelaContextValue {\n const context = useContext(PamelaContext);\n if (!context) {\n throw new Error('usePamela must be used within a PamelaProvider');\n }\n return context;\n}\n\n","import React, { useState } from 'react';\nimport { usePamela } from './PamelaProvider';\nimport { CallButtonProps } from './types';\n\nexport function CallButton({\n to,\n task,\n country,\n locale,\n instructions,\n end_user_id,\n metadata,\n onCallStart,\n onCallComplete,\n onError,\n disabled = false,\n className = '',\n children,\n}: CallButtonProps) {\n const { client } = usePamela();\n const [loading, setLoading] = useState(false);\n const [callId, setCallId] = useState<string | null>(null);\n\n const handleClick = async () => {\n if (loading || disabled) return;\n\n setLoading(true);\n try {\n const call = await client.createCall({\n to,\n task,\n country,\n locale,\n instructions,\n end_user_id,\n metadata,\n });\n\n setCallId(call.id);\n onCallStart?.(call.id);\n\n // Poll for call completion\n const pollInterval = setInterval(async () => {\n try {\n const status = await client.getCall(call.id);\n if (status.status === 'completed' || status.status === 'failed' || status.status === 'cancelled') {\n clearInterval(pollInterval);\n setLoading(false);\n onCallComplete?.(status);\n }\n } catch (error) {\n clearInterval(pollInterval);\n setLoading(false);\n onError?.(error as Error);\n }\n }, 2000);\n\n // Timeout after 5 minutes\n setTimeout(() => {\n clearInterval(pollInterval);\n setLoading(false);\n }, 5 * 60 * 1000);\n } catch (error) {\n setLoading(false);\n onError?.(error as Error);\n }\n };\n\n return (\n <button\n onClick={handleClick}\n disabled={loading || disabled}\n className={`pamela-call-button ${className}`}\n style={{\n padding: '10px 20px',\n background: loading \n ? 'linear-gradient(to right, #ccc, #aaa)' \n : 'linear-gradient(to right, #FA931C, #fd8b74)',\n color: 'white',\n border: 'none',\n borderRadius: '0.5rem',\n cursor: loading || disabled ? 'not-allowed' : 'pointer',\n fontSize: '16px',\n fontWeight: '600',\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n transition: 'opacity 0.2s',\n opacity: loading || disabled ? 0.7 : 1,\n boxShadow: loading || disabled ? 'none' : '0 2px 4px rgba(250, 147, 28, 0.2)',\n }}\n >\n {loading ? 'Calling...' : children || 'Call Now'}\n </button>\n );\n}\n\n","import React from 'react';\nimport { TranscriptViewerProps } from './types';\n\nexport function TranscriptViewer({ transcript, className = '' }: TranscriptViewerProps) {\n const getMessageStyle = (speaker: string) => {\n if (speaker === 'pamela' || speaker === 'agent') {\n // Pamela messages: white background with beige border\n return {\n backgroundColor: '#ffffff',\n border: '1px solid rgba(231, 171, 132, 0.3)',\n color: '#1f2937',\n };\n } else if (speaker === 'user' || speaker === 'caller') {\n // User messages: orange background\n return {\n backgroundColor: '#FA931C',\n border: 'none',\n color: '#ffffff',\n };\n } else {\n // Call recipient: blue background\n return {\n backgroundColor: '#4b4bea',\n border: 'none',\n color: '#ffffff',\n };\n }\n };\n\n return (\n <div\n className={`pamela-transcript-viewer ${className}`}\n style={{\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n }}\n >\n <h3\n style={{\n marginBottom: '16px',\n fontSize: '18px',\n fontWeight: '600',\n color: '#1f2937',\n }}\n >\n Transcript\n </h3>\n <div\n style={{\n maxHeight: '400px',\n overflowY: 'auto',\n borderRadius: '0.5rem',\n padding: '16px',\n backgroundColor: '#F7F4ED',\n }}\n >\n {transcript.map((entry, index) => {\n const style = getMessageStyle(entry.speaker);\n return (\n <div\n key={index}\n style={{\n marginBottom: '12px',\n padding: '12px 16px',\n ...style,\n borderRadius: '0.75rem',\n maxWidth: '75%',\n marginLeft: entry.speaker === 'pamela' || entry.speaker === 'agent' ? '0' : 'auto',\n marginRight: entry.speaker === 'pamela' || entry.speaker === 'agent' ? 'auto' : '0',\n }}\n >\n <div\n style={{\n fontSize: '12px',\n fontWeight: '600',\n color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.9)' : '#6b7280',\n marginBottom: '6px',\n textTransform: 'capitalize',\n }}\n >\n {entry.speaker === 'pamela' || entry.speaker === 'agent'\n ? 'Pamela'\n : entry.speaker === 'user' || entry.speaker === 'caller'\n ? 'You'\n : 'Call Recipient'}\n </div>\n <div\n style={{\n fontSize: '14px',\n lineHeight: '1.6',\n color: style.color,\n whiteSpace: 'pre-wrap',\n wordBreak: 'break-word',\n }}\n >\n {entry.text}\n </div>\n {entry.timestamp && (\n <div\n style={{\n fontSize: '11px',\n color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.7)' : '#9ca3af',\n marginTop: '6px',\n }}\n >\n {new Date(entry.timestamp).toLocaleTimeString()}\n </div>\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n}\n\n","import React, { useState, useEffect } from 'react';\nimport { usePamela } from './PamelaProvider';\nimport { CallStatusProps } from './types';\nimport { CallStatus as CallStatusType } from '@thisispamela/sdk';\nimport { TranscriptViewer } from './TranscriptViewer';\n\n// Status indicator component matching your 3-color system\nfunction StatusIndicator({ status }: { status: string }) {\n const getStatusConfig = () => {\n switch (status) {\n case 'ringing':\n return {\n dots: [\n { color: '#10b981', pulse: true }, // green-500 (first dot)\n { color: '#eab308', pulse: true }, // yellow-500 (second dot)\n { color: '#d1d5db', pulse: false }, // gray-300 (third dot)\n { color: '#d1d5db', pulse: false }, // gray-300 (fourth dot)\n ],\n text: 'Ringing...',\n textColor: '#eab308', // yellow-600\n };\n case 'in_progress':\n case 'in-progress':\n return {\n dots: [\n { color: '#10b981', pulse: false }, // green-500\n { color: '#10b981', pulse: false },\n { color: '#10b981', pulse: true }, // third dot pulses\n { color: '#d1d5db', pulse: false }, // gray-300\n ],\n text: 'In progress',\n textColor: '#10b981', // green-600\n };\n case 'completed':\n return {\n dots: [\n { color: '#10b981', pulse: false },\n { color: '#10b981', pulse: false },\n { color: '#10b981', pulse: false },\n { color: '#10b981', pulse: false, icon: true },\n ],\n text: 'Completed',\n textColor: '#10b981',\n };\n case 'failed':\n return {\n dots: [],\n text: 'Failed',\n textColor: '#ef4444', // red-500\n };\n default:\n return {\n dots: [],\n text: status,\n textColor: '#6b7280', // gray-500\n };\n }\n };\n\n const config = getStatusConfig();\n\n return (\n <div style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>\n {config.dots.length > 0 && (\n <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>\n {config.dots.map((dot, idx) => (\n <div key={idx}>\n {dot.icon ? (\n <svg\n style={{ width: '12px', height: '12px', color: dot.color }}\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n clipRule=\"evenodd\"\n />\n </svg>\n ) : (\n <div\n style={{\n width: '8px',\n height: '8px',\n borderRadius: '50%',\n backgroundColor: dot.color,\n animation: dot.pulse ? 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite' : 'none',\n }}\n />\n )}\n </div>\n ))}\n </div>\n )}\n <span\n style={{\n fontSize: '12px',\n fontWeight: '500',\n color: config.textColor,\n fontFamily: 'Poppins, Inter, sans-serif',\n }}\n >\n {config.text}\n </span>\n </div>\n );\n}\n\nexport function CallStatus({\n callId,\n pollInterval = 5000,\n onStatusChange,\n showTranscript = true,\n className = '',\n}: CallStatusProps) {\n const { client } = usePamela();\n const [status, setStatus] = useState<CallStatusType | null>(null);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState<Error | null>(null);\n\n useEffect(() => {\n if (!callId) return;\n\n const fetchStatus = async () => {\n try {\n const callStatus = await client.getCall(callId);\n setStatus(callStatus);\n setLoading(false);\n onStatusChange?.(callStatus);\n } catch (err) {\n setError(err as Error);\n setLoading(false);\n }\n };\n\n fetchStatus();\n\n const interval = setInterval(fetchStatus, pollInterval);\n return () => clearInterval(interval);\n }, [callId, pollInterval, client, onStatusChange]);\n\n if (loading) {\n return (\n <div className={`pamela-call-status ${className}`}>\n <div style={{ color: '#6b7280', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Loading call status...\n </div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className={`pamela-call-status ${className}`}>\n <div style={{ color: '#ef4444', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Error: {error.message}\n </div>\n </div>\n );\n }\n\n if (!status) {\n return (\n <div className={`pamela-call-status ${className}`}>\n <div style={{ color: '#6b7280', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Call not found\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`pamela-call-status ${className}`}\n style={{\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n }}\n >\n <div\n style={{\n marginBottom: '16px',\n padding: '16px',\n backgroundColor: '#ffffff',\n borderRadius: '0.75rem',\n border: '1px solid rgba(231, 171, 132, 0.3)',\n boxShadow: '0 1px 3px 0 rgba(0, 0, 0, 0.1)',\n }}\n >\n <div style={{ marginBottom: '12px' }}>\n <StatusIndicator status={status.status} />\n </div>\n <div style={{ fontSize: '14px', color: '#1f2937', lineHeight: '1.6' }}>\n <div style={{ marginBottom: '8px' }}>\n <span style={{ fontWeight: '600', color: '#6b7280' }}>To:</span>{' '}\n <span style={{ color: '#1f2937' }}>{status.to}</span>\n </div>\n <div style={{ marginBottom: '8px' }}>\n <span style={{ fontWeight: '600', color: '#6b7280' }}>From:</span>{' '}\n <span style={{ color: '#1f2937' }}>{status.from_}</span>\n </div>\n {status.duration_seconds && (\n <div style={{ marginBottom: '8px' }}>\n <span style={{ fontWeight: '600', color: '#6b7280' }}>Duration:</span>{' '}\n <span style={{ color: '#1f2937' }}>{status.duration_seconds}s</span>\n </div>\n )}\n </div>\n {status.summary && (\n <div\n style={{\n marginTop: '16px',\n padding: '16px',\n background: 'linear-gradient(to right, rgba(250, 147, 28, 0.1), rgba(253, 139, 116, 0.1))',\n border: '1px solid rgba(250, 147, 28, 0.3)',\n borderRadius: '0.75rem',\n }}\n >\n <div\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: '8px',\n marginBottom: '8px',\n }}\n >\n <svg\n style={{ width: '20px', height: '20px', color: '#FA931C' }}\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"\n />\n </svg>\n <h4 style={{ fontWeight: '600', color: '#1f2937', fontSize: '14px' }}>\n Call Summary\n </h4>\n </div>\n <p style={{ fontSize: '14px', color: '#1f2937', lineHeight: '1.6' }}>\n {status.summary}\n </p>\n </div>\n )}\n </div>\n {showTranscript && status.transcript && status.transcript.length > 0 && (\n <TranscriptViewer transcript={status.transcript as Array<{ speaker: string; text: string; timestamp: string }>} />\n )}\n <style>{`\n @keyframes pulse {\n 0%, 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.5;\n }\n }\n `}</style>\n </div>\n );\n}\n\n","import React, { useState, useEffect } from 'react';\nimport { usePamela } from './PamelaProvider';\nimport { CallHistoryProps } from './types';\nimport { CallStatus } from '@thisispamela/sdk';\n\nexport function CallHistory({\n limit = 10,\n onCallSelect,\n className = '',\n}: CallHistoryProps) {\n const { client } = usePamela();\n const [calls, setCalls] = useState<CallStatus[]>([]);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState<Error | null>(null);\n\n // Note: This requires a list endpoint in the API\n // For now, this is a placeholder that shows the structure\n useEffect(() => {\n // TODO: Implement when /api/b2b/v1/calls list endpoint is available\n setLoading(false);\n }, [client]);\n\n if (loading) {\n return (\n <div className={`pamela-call-history ${className}`}>\n <div style={{ color: '#6b7280', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Loading call history...\n </div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className={`pamela-call-history ${className}`}>\n <div style={{ color: '#ef4444', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Error: {error.message}\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`pamela-call-history ${className}`}\n style={{\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n }}\n >\n <h3\n style={{\n marginBottom: '16px',\n fontSize: '18px',\n fontWeight: '600',\n color: '#1f2937',\n }}\n >\n Call History\n </h3>\n {calls.length === 0 ? (\n <div style={{ color: '#6b7280', fontSize: '14px' }}>No calls yet</div>\n ) : (\n <div>\n {calls.map((call) => (\n <div\n key={call.id}\n onClick={() => onCallSelect?.(call.id)}\n style={{\n padding: '12px',\n marginBottom: '8px',\n border: '1px solid rgba(231, 171, 132, 0.3)',\n borderRadius: '0.5rem',\n cursor: onCallSelect ? 'pointer' : 'default',\n backgroundColor: '#ffffff',\n transition: 'background-color 0.2s',\n ...(onCallSelect && {\n ':hover': {\n backgroundColor: '#F7F4ED',\n },\n }),\n }}\n onMouseEnter={(e) => {\n if (onCallSelect) {\n e.currentTarget.style.backgroundColor = '#F7F4ED';\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = '#ffffff';\n }}\n >\n <div style={{ fontWeight: '600', color: '#1f2937', marginBottom: '4px' }}>\n {call.to}\n </div>\n <div style={{ fontSize: '14px', color: '#6b7280' }}>\n {call.status} • {new Date(call.created_at).toLocaleString()}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n );\n}\n"],"names":[],"mappings":";;;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;AACjC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ,CAAC;AAC9B;AACA,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO,EAAE;AAC1D;AACA,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AACvE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AAC9C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;AAC1B;AACA,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;AAChD,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC9B,KAAK;AACL,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC5B,GAAG;AACH;AACA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG,CAAC;AACnC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;AACpD,GAAG;AACH;;;;;ACjBA,MAAM,aAAa,GAAG,aAAa,CAA4B,IAAI,CAAC,CAAC;SAOrD,cAAc,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAuB,EAAA;AACtE,IAAA,MAAM,MAAM,GAAG,IAAI,YAAY,CAAC;QAC9B,MAAM,EAAE,MAAM,CAAC,MAAM;QACrB,OAAO,EAAE,MAAM,CAAC,OAAO;AACxB,KAAA,CAAC,CAAC;AAEH,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,aAAa,CAAC,QAAQ,EAAC,EAAA,KAAK,EAAE,EAAE,MAAM,EAAE,EAAA,EACtC,QAAQ,CACc,EACzB;AACJ,CAAC;SAEe,SAAS,GAAA;AACvB,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IAC1C,IAAI,CAAC,OAAO,EAAE;AACZ,QAAA,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;KACnE;AACD,IAAA,OAAO,OAAO,CAAC;AACjB;;AC9BgB,SAAA,UAAU,CAAC,EACzB,EAAE,EACF,IAAI,EACJ,OAAO,EACP,MAAM,EACN,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,WAAW,EACX,cAAc,EACd,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,EAAE,EACd,QAAQ,GACQ,EAAA;AAChB,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;IAC/B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;AAE1D,IAAA,MAAM,WAAW,GAAG,YAAW;QAC7B,IAAI,OAAO,IAAI,QAAQ;YAAE,OAAO;QAEhC,UAAU,CAAC,IAAI,CAAC,CAAC;AACjB,QAAA,IAAI;AACF,YAAA,MAAM,IAAI,GAAG,MAAM,MAAM,CAAC,UAAU,CAAC;gBACnC,EAAE;gBACF,IAAI;gBACJ,OAAO;gBACP,MAAM;gBACN,YAAY;gBACZ,WAAW;gBACX,QAAQ;AACT,aAAA,CAAC,CAAC;AAEH,YAAA,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACnB,YAAA,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;;AAGvB,YAAA,MAAM,YAAY,GAAG,WAAW,CAAC,YAAW;AAC1C,gBAAA,IAAI;oBACF,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,oBAAA,IAAI,MAAM,CAAC,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,MAAM,KAAK,QAAQ,IAAI,MAAM,CAAC,MAAM,KAAK,WAAW,EAAE;wBAChG,aAAa,CAAC,YAAY,CAAC,CAAC;wBAC5B,UAAU,CAAC,KAAK,CAAC,CAAC;AAClB,wBAAA,cAAc,GAAG,MAAM,CAAC,CAAC;qBAC1B;iBACF;gBAAC,OAAO,KAAK,EAAE;oBACd,aAAa,CAAC,YAAY,CAAC,CAAC;oBAC5B,UAAU,CAAC,KAAK,CAAC,CAAC;AAClB,oBAAA,OAAO,GAAG,KAAc,CAAC,CAAC;iBAC3B;aACF,EAAE,IAAI,CAAC,CAAC;;YAGT,UAAU,CAAC,MAAK;gBACd,aAAa,CAAC,YAAY,CAAC,CAAC;gBAC5B,UAAU,CAAC,KAAK,CAAC,CAAC;AACpB,aAAC,EAAE,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,CAAC;SACnB;QAAC,OAAO,KAAK,EAAE;YACd,UAAU,CAAC,KAAK,CAAC,CAAC;AAClB,YAAA,OAAO,GAAG,KAAc,CAAC,CAAC;SAC3B;AACH,KAAC,CAAC;AAEF,IAAA,QACE,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,OAAO,IAAI,QAAQ,EAC7B,SAAS,EAAE,CAAA,mBAAA,EAAsB,SAAS,CAAE,CAAA,EAC5C,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,UAAU,EAAE,OAAO;AACjB,kBAAE,uCAAuC;AACzC,kBAAE,6CAA6C;AACjD,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,YAAY,EAAE,QAAQ;YACtB,MAAM,EAAE,OAAO,IAAI,QAAQ,GAAG,aAAa,GAAG,SAAS;AACvD,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,UAAU,EAAE,KAAK;AACjB,YAAA,UAAU,EAAE,+DAA+D;AAC3E,YAAA,UAAU,EAAE,cAAc;YAC1B,OAAO,EAAE,OAAO,IAAI,QAAQ,GAAG,GAAG,GAAG,CAAC;YACtC,SAAS,EAAE,OAAO,IAAI,QAAQ,GAAG,MAAM,GAAG,mCAAmC;AAC9E,SAAA,EAAA,EAEA,OAAO,GAAG,YAAY,GAAG,QAAQ,IAAI,UAAU,CACzC,EACT;AACJ;;AC1FM,SAAU,gBAAgB,CAAC,EAAE,UAAU,EAAE,SAAS,GAAG,EAAE,EAAyB,EAAA;AACpF,IAAA,MAAM,eAAe,GAAG,CAAC,OAAe,KAAI;QAC1C,IAAI,OAAO,KAAK,QAAQ,IAAI,OAAO,KAAK,OAAO,EAAE;;YAE/C,OAAO;AACL,gBAAA,eAAe,EAAE,SAAS;AAC1B,gBAAA,MAAM,EAAE,oCAAoC;AAC5C,gBAAA,KAAK,EAAE,SAAS;aACjB,CAAC;SACH;aAAM,IAAI,OAAO,KAAK,MAAM,IAAI,OAAO,KAAK,QAAQ,EAAE;;YAErD,OAAO;AACL,gBAAA,eAAe,EAAE,SAAS;AAC1B,gBAAA,MAAM,EAAE,MAAM;AACd,gBAAA,KAAK,EAAE,SAAS;aACjB,CAAC;SACH;aAAM;;YAEL,OAAO;AACL,gBAAA,eAAe,EAAE,SAAS;AAC1B,gBAAA,MAAM,EAAE,MAAM;AACd,gBAAA,KAAK,EAAE,SAAS;aACjB,CAAC;SACH;AACH,KAAC,CAAC;IAEF,QACE,6BACE,SAAS,EAAE,4BAA4B,SAAS,CAAA,CAAE,EAClD,KAAK,EAAE;AACL,YAAA,UAAU,EAAE,+DAA+D;AAC5E,SAAA,EAAA;AAED,QAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,YAAY,EAAE,MAAM;AACpB,gBAAA,QAAQ,EAAE,MAAM;AAChB,gBAAA,UAAU,EAAE,KAAK;AACjB,gBAAA,KAAK,EAAE,SAAS;aACjB,EAGE,EAAA,YAAA,CAAA;AACL,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,SAAS,EAAE,OAAO;AAClB,gBAAA,SAAS,EAAE,MAAM;AACjB,gBAAA,YAAY,EAAE,QAAQ;AACtB,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,eAAe,EAAE,SAAS;aAC3B,EAEA,EAAA,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAAI;YAC/B,MAAM,KAAK,GAAG,eAAe,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAC7C,YAAA,QACE,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,KAAK,EACV,KAAK,EAAE;AACL,oBAAA,YAAY,EAAE,MAAM;AACpB,oBAAA,OAAO,EAAE,WAAW;AACpB,oBAAA,GAAG,KAAK;AACR,oBAAA,YAAY,EAAE,SAAS;AACvB,oBAAA,QAAQ,EAAE,KAAK;AACf,oBAAA,UAAU,EAAE,KAAK,CAAC,OAAO,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,GAAG,GAAG,GAAG,MAAM;AAClF,oBAAA,WAAW,EAAE,KAAK,CAAC,OAAO,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,GAAG,MAAM,GAAG,GAAG;AACpF,iBAAA,EAAA;AAED,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,wBAAA,QAAQ,EAAE,MAAM;AAChB,wBAAA,UAAU,EAAE,KAAK;AACjB,wBAAA,KAAK,EAAE,KAAK,CAAC,KAAK,KAAK,SAAS,GAAG,0BAA0B,GAAG,SAAS;AACzE,wBAAA,YAAY,EAAE,KAAK;AACnB,wBAAA,aAAa,EAAE,YAAY;qBAC5B,EAEA,EAAA,KAAK,CAAC,OAAO,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO;AACtD,sBAAE,QAAQ;sBACR,KAAK,CAAC,OAAO,KAAK,MAAM,IAAI,KAAK,CAAC,OAAO,KAAK,QAAQ;AACxD,0BAAE,KAAK;0BACL,gBAAgB,CAChB;AACN,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,wBAAA,QAAQ,EAAE,MAAM;AAChB,wBAAA,UAAU,EAAE,KAAK;wBACjB,KAAK,EAAE,KAAK,CAAC,KAAK;AAClB,wBAAA,UAAU,EAAE,UAAU;AACtB,wBAAA,SAAS,EAAE,YAAY;qBACxB,EAEA,EAAA,KAAK,CAAC,IAAI,CACP;AACL,gBAAA,KAAK,CAAC,SAAS,KACd,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,wBAAA,QAAQ,EAAE,MAAM;AAChB,wBAAA,KAAK,EAAE,KAAK,CAAC,KAAK,KAAK,SAAS,GAAG,0BAA0B,GAAG,SAAS;AACzE,wBAAA,SAAS,EAAE,KAAK;AACjB,qBAAA,EAAA,EAEA,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,kBAAkB,EAAE,CAC3C,CACP,CACG,EACN;AACJ,SAAC,CAAC,CACE,CACF,EACN;AACJ;;AC3GA;AACA,SAAS,eAAe,CAAC,EAAE,MAAM,EAAsB,EAAA;IACrD,MAAM,eAAe,GAAG,MAAK;QAC3B,QAAQ,MAAM;AACZ,YAAA,KAAK,SAAS;gBACZ,OAAO;AACL,oBAAA,IAAI,EAAE;wBACJ,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE;wBACjC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE;wBACjC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;wBAClC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;AACnC,qBAAA;AACD,oBAAA,IAAI,EAAE,YAAY;oBAClB,SAAS,EAAE,SAAS;iBACrB,CAAC;AACJ,YAAA,KAAK,aAAa,CAAC;AACnB,YAAA,KAAK,aAAa;gBAChB,OAAO;AACL,oBAAA,IAAI,EAAE;wBACJ,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;AAClC,wBAAA,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;wBAClC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE;wBACjC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;AACnC,qBAAA;AACD,oBAAA,IAAI,EAAE,aAAa;oBACnB,SAAS,EAAE,SAAS;iBACrB,CAAC;AACJ,YAAA,KAAK,WAAW;gBACd,OAAO;AACL,oBAAA,IAAI,EAAE;AACJ,wBAAA,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;AAClC,wBAAA,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;AAClC,wBAAA,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;wBAClC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE;AAC/C,qBAAA;AACD,oBAAA,IAAI,EAAE,WAAW;AACjB,oBAAA,SAAS,EAAE,SAAS;iBACrB,CAAC;AACJ,YAAA,KAAK,QAAQ;gBACX,OAAO;AACL,oBAAA,IAAI,EAAE,EAAE;AACR,oBAAA,IAAI,EAAE,QAAQ;oBACd,SAAS,EAAE,SAAS;iBACrB,CAAC;AACJ,YAAA;gBACE,OAAO;AACL,oBAAA,IAAI,EAAE,EAAE;AACR,oBAAA,IAAI,EAAE,MAAM;oBACZ,SAAS,EAAE,SAAS;iBACrB,CAAC;SACL;AACH,KAAC,CAAC;AAEF,IAAA,MAAM,MAAM,GAAG,eAAe,EAAE,CAAC;AAEjC,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,EAAA;AAC9D,QAAA,MAAM,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,KACrB,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,EAAA,EAC9D,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,MACxB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EACV,EAAA,GAAG,CAAC,IAAI,IACP,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,EAC1D,IAAI,EAAC,cAAc,EACnB,OAAO,EAAC,WAAW,EAAA;YAEnB,KACE,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,oHAAoH,EACtH,QAAQ,EAAC,SAAS,EAClB,CAAA,CACE,KAEN,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,KAAK;AACZ,gBAAA,MAAM,EAAE,KAAK;AACb,gBAAA,YAAY,EAAE,KAAK;gBACnB,eAAe,EAAE,GAAG,CAAC,KAAK;gBAC1B,SAAS,EAAE,GAAG,CAAC,KAAK,GAAG,gDAAgD,GAAG,MAAM;AACjF,aAAA,EAAA,CACD,CACH,CACG,CACP,CAAC,CACE,CACP;AACD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,MAAM;AAChB,gBAAA,UAAU,EAAE,KAAK;gBACjB,KAAK,EAAE,MAAM,CAAC,SAAS;AACvB,gBAAA,UAAU,EAAE,4BAA4B;AACzC,aAAA,EAAA,EAEA,MAAM,CAAC,IAAI,CACP,CACH,EACN;AACJ,CAAC;SAEe,UAAU,CAAC,EACzB,MAAM,EACN,YAAY,GAAG,IAAI,EACnB,cAAc,EACd,cAAc,GAAG,IAAI,EACrB,SAAS,GAAG,EAAE,GACE,EAAA;AAChB,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;IAC/B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC,CAAC;IAClE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAe,IAAI,CAAC,CAAC;IAEvD,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,MAAM;YAAE,OAAO;AAEpB,QAAA,MAAM,WAAW,GAAG,YAAW;AAC7B,YAAA,IAAI;gBACF,MAAM,UAAU,GAAG,MAAM,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;gBAChD,SAAS,CAAC,UAAU,CAAC,CAAC;gBACtB,UAAU,CAAC,KAAK,CAAC,CAAC;AAClB,gBAAA,cAAc,GAAG,UAAU,CAAC,CAAC;aAC9B;YAAC,OAAO,GAAG,EAAE;gBACZ,QAAQ,CAAC,GAAY,CAAC,CAAC;gBACvB,UAAU,CAAC,KAAK,CAAC,CAAC;aACnB;AACH,SAAC,CAAC;AAEF,QAAA,WAAW,EAAE,CAAC;QAEd,MAAM,QAAQ,GAAG,WAAW,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;AACxD,QAAA,OAAO,MAAM,aAAa,CAAC,QAAQ,CAAC,CAAC;KACtC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;IAEnD,IAAI,OAAO,EAAE;AACX,QAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAA,mBAAA,EAAsB,SAAS,CAAE,CAAA,EAAA;AAC/C,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,4BAA4B,EAAE,EAEpE,EAAA,wBAAA,CAAA,CACF,EACN;KACH;IAED,IAAI,KAAK,EAAE;AACT,QAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAA,mBAAA,EAAsB,SAAS,CAAE,CAAA,EAAA;YAC/C,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,4BAA4B,EAAE,EAAA;;AAChE,gBAAA,KAAK,CAAC,OAAO,CACjB,CACF,EACN;KACH;IAED,IAAI,CAAC,MAAM,EAAE;AACX,QAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAA,mBAAA,EAAsB,SAAS,CAAE,CAAA,EAAA;AAC/C,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,4BAA4B,EAAE,EAEpE,EAAA,gBAAA,CAAA,CACF,EACN;KACH;IAED,QACE,6BACE,SAAS,EAAE,sBAAsB,SAAS,CAAA,CAAE,EAC5C,KAAK,EAAE;AACL,YAAA,UAAU,EAAE,+DAA+D;AAC5E,SAAA,EAAA;AAED,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,YAAY,EAAE,MAAM;AACpB,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,eAAe,EAAE,SAAS;AAC1B,gBAAA,YAAY,EAAE,SAAS;AACvB,gBAAA,MAAM,EAAE,oCAAoC;AAC5C,gBAAA,SAAS,EAAE,gCAAgC;AAC5C,aAAA,EAAA;AAED,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,EAAA;gBAClC,KAAC,CAAA,aAAA,CAAA,eAAe,IAAC,MAAM,EAAE,MAAM,CAAC,MAAM,GAAI,CACtC;AACN,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,EAAA;AACnE,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,EAAA;oBACjC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAY,EAAA,KAAA,CAAA;oBAAC,GAAG;AACpE,oBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAA,EAAG,MAAM,CAAC,EAAE,CAAQ,CACjD;AACN,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,EAAA;oBACjC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAc,EAAA,OAAA,CAAA;oBAAC,GAAG;AACtE,oBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAA,EAAG,MAAM,CAAC,KAAK,CAAQ,CACpD;gBACL,MAAM,CAAC,gBAAgB,KACtB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,EAAA;oBACjC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAkB,EAAA,WAAA,CAAA;oBAAC,GAAG;AAC1E,oBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAA;AAAG,wBAAA,MAAM,CAAC,gBAAgB;AAAS,wBAAA,GAAA,CAAA,CAChE,CACP,CACG;AACL,YAAA,MAAM,CAAC,OAAO,KACb,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,oBAAA,SAAS,EAAE,MAAM;AACjB,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,UAAU,EAAE,8EAA8E;AAC1F,oBAAA,MAAM,EAAE,mCAAmC;AAC3C,oBAAA,YAAY,EAAE,SAAS;AACxB,iBAAA,EAAA;AAED,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,wBAAA,OAAO,EAAE,MAAM;AACf,wBAAA,UAAU,EAAE,QAAQ;AACpB,wBAAA,GAAG,EAAE,KAAK;AACV,wBAAA,YAAY,EAAE,KAAK;AACpB,qBAAA,EAAA;oBAED,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,EAC1D,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,OAAO,EAAC,WAAW,EAAA;AAEnB,wBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAE,CAAC,EACd,CAAC,EAAC,sHAAsH,GACxH,CACE;AACN,oBAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,mBAE/D,CACD;gBACN,KAAG,CAAA,aAAA,CAAA,GAAA,EAAA,EAAA,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,EAChE,EAAA,MAAM,CAAC,OAAO,CACb,CACA,CACP,CACG;QACL,cAAc,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,KAClE,KAAC,CAAA,aAAA,CAAA,gBAAgB,EAAC,EAAA,UAAU,EAAE,MAAM,CAAC,UAAyE,EAAA,CAAI,CACnH;QACD,KAAQ,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EAAA,CAAA;;;;;;;;;OASP,CAAS,CACN,EACN;AACJ;;AClQgB,SAAA,WAAW,CAAC,EAC1B,KAAK,GAAG,EAAE,EACV,YAAY,EACZ,SAAS,GAAG,EAAE,GACG,EAAA;AACjB,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;IAC/B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAe,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAe,IAAI,CAAC,CAAC;;;IAIvD,SAAS,CAAC,MAAK;;QAEb,UAAU,CAAC,KAAK,CAAC,CAAC;AACpB,KAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,IAAI,OAAO,EAAE;AACX,QAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAA,oBAAA,EAAuB,SAAS,CAAE,CAAA,EAAA;AAChD,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,4BAA4B,EAAE,EAEpE,EAAA,yBAAA,CAAA,CACF,EACN;KACH;IAED,IAAI,KAAK,EAAE;AACT,QAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAA,oBAAA,EAAuB,SAAS,CAAE,CAAA,EAAA;YAChD,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,4BAA4B,EAAE,EAAA;;AAChE,gBAAA,KAAK,CAAC,OAAO,CACjB,CACF,EACN;KACH;IAED,QACE,6BACE,SAAS,EAAE,uBAAuB,SAAS,CAAA,CAAE,EAC7C,KAAK,EAAE;AACL,YAAA,UAAU,EAAE,+DAA+D;AAC5E,SAAA,EAAA;AAED,QAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,YAAY,EAAE,MAAM;AACpB,gBAAA,QAAQ,EAAE,MAAM;AAChB,gBAAA,UAAU,EAAE,KAAK;AACjB,gBAAA,KAAK,EAAE,SAAS;aACjB,EAGE,EAAA,cAAA,CAAA;QACJ,KAAK,CAAC,MAAM,KAAK,CAAC,IACjB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAA,EAAA,cAAA,CAAoB,KAEtE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA,EACG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,MACd,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,OAAO,EAAE,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,EACtC,KAAK,EAAE;AACL,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,YAAY,EAAE,KAAK;AACnB,gBAAA,MAAM,EAAE,oCAAoC;AAC5C,gBAAA,YAAY,EAAE,QAAQ;gBACtB,MAAM,EAAE,YAAY,GAAG,SAAS,GAAG,SAAS;AAC5C,gBAAA,eAAe,EAAE,SAAS;AAC1B,gBAAA,UAAU,EAAE,uBAAuB;gBACnC,IAAI,YAAY,IAAI;AAClB,oBAAA,QAAQ,EAAE;AACR,wBAAA,eAAe,EAAE,SAAS;AAC3B,qBAAA;iBACF,CAAC;AACH,aAAA,EACD,YAAY,EAAE,CAAC,CAAC,KAAI;gBAClB,IAAI,YAAY,EAAE;oBAChB,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,eAAe,GAAG,SAAS,CAAC;iBACnD;AACH,aAAC,EACD,YAAY,EAAE,CAAC,CAAC,KAAI;gBAClB,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,eAAe,GAAG,SAAS,CAAC;aACnD,EAAA;AAED,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,IACrE,IAAI,CAAC,EAAE,CACJ;YACN,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,EAAA;AAC/C,gBAAA,IAAI,CAAC,MAAM;;AAAK,gBAAA,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,cAAc,EAAE,CACvD,CACF,CACP,CAAC,CACE,CACP,CACG,EACN;AACJ;;;;","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/PamelaProvider.tsx","../src/CallButton.tsx","../src/TranscriptViewer.tsx","../src/CallStatus.tsx","../src/CallHistory.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React, { createContext, useContext, ReactNode, useMemo } from 'react';\nimport { PamelaClient, PamelaClientConfig } from '@thisispamela/sdk';\nimport { PamelaConfig } from './types';\n\ninterface PamelaContextValue {\n client: PamelaClient;\n}\n\nconst PamelaContext = createContext<PamelaContextValue | null>(null);\n\nexport interface PamelaProviderProps {\n config: PamelaConfig;\n children: ReactNode;\n}\n\nexport function PamelaProvider({ config, children }: PamelaProviderProps) {\n const client = useMemo(\n () =>\n new PamelaClient({\n apiKey: config.apiKey,\n baseUrl: config.baseUrl,\n }),\n [config.apiKey, config.baseUrl]\n );\n\n return (\n <PamelaContext.Provider value={{ client }}>\n {children}\n </PamelaContext.Provider>\n );\n}\n\nexport function usePamela(): PamelaContextValue {\n const context = useContext(PamelaContext);\n if (!context) {\n throw new Error('usePamela must be used within a PamelaProvider');\n }\n return context;\n}\n\n","import React, { useState } from 'react';\nimport { usePamela } from './PamelaProvider';\nimport { CallButtonProps } from './types';\n\nexport function CallButton({\n to,\n task,\n country,\n locale,\n instructions,\n end_user_id,\n metadata,\n tools,\n webhooks,\n onCallStart,\n onCallComplete,\n onError,\n disabled = false,\n className = '',\n children,\n}: CallButtonProps) {\n const { client } = usePamela();\n const [loading, setLoading] = useState(false);\n const [callId, setCallId] = useState<string | null>(null);\n\n const handleClick = async () => {\n if (loading || disabled) return;\n\n setLoading(true);\n try {\n const call = await client.createCall({\n to,\n task,\n country,\n locale,\n instructions,\n end_user_id,\n metadata,\n tools,\n webhooks,\n });\n\n setCallId(call.id);\n onCallStart?.(call.id);\n\n // Poll for call completion\n const pollInterval = setInterval(async () => {\n try {\n const status = await client.getCall(call.id);\n if (status.status === 'completed' || status.status === 'failed' || status.status === 'cancelled') {\n clearInterval(pollInterval);\n setLoading(false);\n onCallComplete?.(status);\n }\n } catch (error) {\n clearInterval(pollInterval);\n setLoading(false);\n onError?.(error as Error);\n }\n }, 2000);\n\n // Timeout after 5 minutes\n setTimeout(() => {\n clearInterval(pollInterval);\n setLoading(false);\n }, 5 * 60 * 1000);\n } catch (error) {\n setLoading(false);\n onError?.(error as Error);\n }\n };\n\n return (\n <button\n onClick={handleClick}\n disabled={loading || disabled}\n className={`pamela-call-button ${className}`}\n >\n {loading ? 'Calling...' : children || 'Call Now'}\n </button>\n );\n}\n\n","import React from 'react';\nimport { TranscriptViewerProps } from './types';\n\nexport function TranscriptViewer({ transcript, className = '' }: TranscriptViewerProps) {\n const getMessageStyle = (speaker: string) => {\n if (speaker === 'pamela' || speaker === 'agent') {\n // Pamela messages: white background with beige border\n return {\n backgroundColor: 'var(--bubble-pamela, #ffffff)',\n border: '1px solid var(--bubble-border, rgba(231, 171, 132, 0.3))',\n color: 'var(--text-primary, #1f2937)',\n className: 'pamela-transcript-bubble pamela-transcript-bubble--pamela',\n };\n } else if (speaker === 'user' || speaker === 'caller') {\n // User messages: orange background\n return {\n backgroundColor: 'var(--bubble-user, #FA931C)',\n border: 'none',\n color: '#ffffff',\n className: 'pamela-transcript-bubble pamela-transcript-bubble--user',\n };\n } else {\n // Call recipient: blue background\n return {\n backgroundColor: 'var(--bubble-recipient, #4b4bea)',\n border: 'none',\n color: '#ffffff',\n className: 'pamela-transcript-bubble pamela-transcript-bubble--recipient',\n };\n }\n };\n\n return (\n <div\n className={`pamela-transcript-viewer ${className}`}\n style={{\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n }}\n >\n <h3\n style={{\n marginBottom: '16px',\n fontSize: '18px',\n fontWeight: '600',\n color: 'var(--text-primary, #1f2937)',\n }}\n >\n Transcript\n </h3>\n <div\n className=\"pamela-transcript-container\"\n style={{\n maxHeight: '400px',\n overflowY: 'auto',\n borderRadius: 'var(--radius-sm, 0.5rem)',\n padding: '16px',\n background: 'var(--surface, #F7F4ED)',\n }}\n >\n {transcript.map((entry, index) => {\n const style = getMessageStyle(entry.speaker);\n const { className: bubbleClassName, ...bubbleStyle } = style;\n return (\n <div\n key={index}\n className={bubbleClassName}\n style={{\n marginBottom: '12px',\n ...bubbleStyle,\n borderRadius: 'var(--radius-md, 0.75rem)',\n maxWidth: '75%',\n marginLeft: entry.speaker === 'pamela' || entry.speaker === 'agent' ? '0' : 'auto',\n marginRight: entry.speaker === 'pamela' || entry.speaker === 'agent' ? 'auto' : '0',\n }}\n >\n <div\n style={{\n fontSize: '12px',\n fontWeight: '600',\n color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.9)' : 'var(--text-muted, #6b7280)',\n marginBottom: '6px',\n textTransform: 'capitalize',\n }}\n >\n {entry.speaker === 'pamela' || entry.speaker === 'agent'\n ? 'Pamela'\n : entry.speaker === 'user' || entry.speaker === 'caller'\n ? 'You'\n : 'Call Recipient'}\n </div>\n <div\n style={{\n fontSize: '14px',\n lineHeight: '1.6',\n color: style.color,\n whiteSpace: 'pre-wrap',\n wordBreak: 'break-word',\n }}\n >\n {entry.text}\n </div>\n {entry.timestamp && (\n <div\n style={{\n fontSize: '11px',\n color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.7)' : 'var(--text-muted, #9ca3af)',\n marginTop: '6px',\n }}\n >\n {new Date(entry.timestamp).toLocaleTimeString()}\n </div>\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n}\n\n","import React, { useState, useEffect } from 'react';\nimport { usePamela } from './PamelaProvider';\nimport { CallStatusProps } from './types';\nimport { CallStatus as CallStatusType } from '@thisispamela/sdk';\nimport { TranscriptViewer } from './TranscriptViewer';\n\n// Status indicator component matching your 3-color system\nfunction StatusIndicator({ status }: { status: string }) {\n const getStatusConfig = () => {\n switch (status) {\n case 'queued':\n case 'initiating':\n return {\n dots: [\n { color: 'var(--status-warning, #eab308)', pulse: true },\n { color: 'var(--status-muted, #d1d5db)', pulse: false },\n { color: 'var(--status-muted, #d1d5db)', pulse: false },\n { color: 'var(--status-muted, #d1d5db)', pulse: false },\n ],\n text: 'Queued...',\n textColor: 'var(--status-warning, #eab308)',\n };\n case 'ringing':\n return {\n dots: [\n { color: 'var(--status-success, #10b981)', pulse: true },\n { color: 'var(--status-warning, #eab308)', pulse: true },\n { color: 'var(--status-muted, #d1d5db)', pulse: false },\n { color: 'var(--status-muted, #d1d5db)', pulse: false },\n ],\n text: 'Ringing...',\n textColor: 'var(--status-warning, #eab308)',\n };\n case 'in_progress':\n case 'in-progress':\n return {\n dots: [\n { color: 'var(--status-success, #10b981)', pulse: false },\n { color: 'var(--status-success, #10b981)', pulse: false },\n { color: 'var(--status-success, #10b981)', pulse: true },\n { color: 'var(--status-muted, #d1d5db)', pulse: false },\n ],\n text: 'In progress',\n textColor: 'var(--status-success, #10b981)',\n };\n case 'completed':\n return {\n dots: [\n { color: 'var(--status-success, #10b981)', pulse: false },\n { color: 'var(--status-success, #10b981)', pulse: false },\n { color: 'var(--status-success, #10b981)', pulse: false },\n { color: 'var(--status-success, #10b981)', pulse: false, icon: true },\n ],\n text: 'Completed',\n textColor: 'var(--status-success, #10b981)',\n };\n case 'failed':\n return {\n dots: [],\n text: 'Failed',\n textColor: 'var(--status-error, #ef4444)',\n };\n case 'cancelled':\n return {\n dots: [],\n text: 'Cancelled',\n textColor: 'var(--status-error, #ef4444)',\n };\n default:\n return {\n dots: [],\n text: status,\n textColor: '#6b7280', // gray-500\n };\n }\n };\n\n const config = getStatusConfig();\n\n return (\n <div style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>\n {config.dots.length > 0 && (\n <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>\n {config.dots.map((dot, idx) => (\n <div key={idx}>\n {dot.icon ? (\n <svg\n style={{ width: '12px', height: '12px', color: dot.color }}\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n clipRule=\"evenodd\"\n />\n </svg>\n ) : (\n <div\n style={{\n width: '8px',\n height: '8px',\n borderRadius: '50%',\n backgroundColor: dot.color,\n animation: dot.pulse ? 'pamela-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite' : 'none',\n }}\n />\n )}\n </div>\n ))}\n </div>\n )}\n <span\n style={{\n fontSize: '12px',\n fontWeight: '500',\n color: config.textColor,\n fontFamily: 'Poppins, Inter, sans-serif',\n }}\n >\n {config.text}\n </span>\n </div>\n );\n}\n\nexport function CallStatus({\n callId,\n pollInterval = 5000,\n onStatusChange,\n showTranscript = true,\n className = '',\n}: CallStatusProps) {\n const { client } = usePamela();\n const [status, setStatus] = useState<CallStatusType | null>(null);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState<Error | null>(null);\n\n useEffect(() => {\n if (!callId) return;\n\n const fetchStatus = async () => {\n try {\n const callStatus = await client.getCall(callId);\n setStatus(callStatus);\n setLoading(false);\n onStatusChange?.(callStatus);\n } catch (err) {\n setError(err as Error);\n setLoading(false);\n }\n };\n\n fetchStatus();\n\n const interval = setInterval(fetchStatus, pollInterval);\n return () => clearInterval(interval);\n }, [callId, pollInterval, client, onStatusChange]);\n\n if (loading) {\n return (\n <div className={`pamela-call-status ${className}`}>\n <div style={{ color: 'var(--text-muted, #6b7280)', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Loading call status...\n </div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className={`pamela-call-status ${className}`}>\n <div style={{ color: 'var(--status-error, #ef4444)', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Error: {error.message}\n </div>\n </div>\n );\n }\n\n if (!status) {\n return (\n <div className={`pamela-call-status ${className}`}>\n <div style={{ color: 'var(--text-muted, #6b7280)', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Call not found\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`pamela-call-status ${className}`}\n style={{\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n }}\n >\n <div\n style={{\n marginBottom: '16px',\n padding: '16px',\n background: 'var(--surface-liquid-strong, #ffffff)',\n borderRadius: 'var(--radius-md, 0.75rem)',\n border: '1px solid var(--surface-border-strong, rgba(231, 171, 132, 0.3))',\n boxShadow: 'var(--shadow-soft, 0 1px 3px rgba(0, 0, 0, 0.1))',\n }}\n >\n <div style={{ marginBottom: '12px' }}>\n <StatusIndicator status={status.status} />\n </div>\n <div style={{ fontSize: '14px', color: 'var(--text-primary, #1f2937)', lineHeight: '1.6' }}>\n <div style={{ marginBottom: '8px' }}>\n <span style={{ fontWeight: '600', color: 'var(--text-secondary, #6b7280)' }}>To:</span>{' '}\n <span style={{ color: 'var(--text-primary, #1f2937)' }}>{status.to}</span>\n </div>\n <div style={{ marginBottom: '8px' }}>\n <span style={{ fontWeight: '600', color: 'var(--text-secondary, #6b7280)' }}>From:</span>{' '}\n <span style={{ color: 'var(--text-primary, #1f2937)' }}>{status.from_}</span>\n </div>\n {status.duration_seconds && (\n <div style={{ marginBottom: '8px' }}>\n <span style={{ fontWeight: '600', color: 'var(--text-secondary, #6b7280)' }}>Duration:</span>{' '}\n <span style={{ color: 'var(--text-primary, #1f2937)' }}>{status.duration_seconds}s</span>\n </div>\n )}\n </div>\n {status.summary && (\n <div\n style={{\n marginTop: '16px',\n padding: '16px',\n background: 'var(--cta-bg, linear-gradient(to right, rgba(250, 147, 28, 0.1), rgba(253, 139, 116, 0.1)))',\n border: 'var(--cta-border, 1px solid rgba(250, 147, 28, 0.3))',\n borderRadius: 'var(--radius-md, 0.75rem)',\n }}\n >\n <div\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: '8px',\n marginBottom: '8px',\n }}\n >\n <svg\n style={{ width: '20px', height: '20px', color: 'var(--accent, #FA931C)' }}\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"\n />\n </svg>\n <h4 style={{ fontWeight: '600', color: 'var(--text-primary, #1f2937)', fontSize: '14px' }}>\n Call Summary\n </h4>\n </div>\n <p style={{ fontSize: '14px', color: 'var(--text-primary, #1f2937)', lineHeight: '1.6' }}>\n {status.summary}\n </p>\n </div>\n )}\n </div>\n {showTranscript && status.transcript && status.transcript.length > 0 && (\n <TranscriptViewer transcript={status.transcript as Array<{ speaker: string; text: string; timestamp: string }>} />\n )}\n </div>\n );\n}\n\n","import React, { useState, useEffect } from 'react';\nimport { usePamela } from './PamelaProvider';\nimport { CallHistoryProps } from './types';\nimport { CallStatus } from '@thisispamela/sdk';\n\nexport function CallHistory({\n limit = 10,\n onCallSelect,\n className = '',\n}: CallHistoryProps) {\n const { client } = usePamela();\n const [calls, setCalls] = useState<CallStatus[]>([]);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState<Error | null>(null);\n\n useEffect(() => {\n let isMounted = true;\n const fetchCalls = async () => {\n try {\n const response = await client.listCalls({ limit });\n if (!isMounted) {\n return;\n }\n setCalls(response.items || []);\n setLoading(false);\n } catch (err) {\n if (!isMounted) {\n return;\n }\n setError(err as Error);\n setLoading(false);\n }\n };\n\n fetchCalls();\n\n return () => {\n isMounted = false;\n };\n }, [client, limit]);\n\n if (loading) {\n return (\n <div className={`pamela-call-history ${className}`}>\n <div style={{ color: 'var(--text-muted, #6b7280)', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Loading call history...\n </div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className={`pamela-call-history ${className}`}>\n <div style={{ color: 'var(--status-error, #ef4444)', fontFamily: 'Poppins, Inter, sans-serif' }}>\n Error: {error.message}\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`pamela-call-history ${className}`}\n style={{\n fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n }}\n >\n <h3\n style={{\n marginBottom: '16px',\n fontSize: '18px',\n fontWeight: '600',\n color: 'var(--text-primary, #1f2937)',\n }}\n >\n Call History\n </h3>\n {calls.length === 0 ? (\n <div style={{ color: 'var(--text-muted, #6b7280)', fontSize: '14px' }}>No calls yet</div>\n ) : (\n <div>\n {calls.map((call) => (\n <div\n key={call.id}\n onClick={() => onCallSelect?.(call.id)}\n style={{\n padding: '12px',\n marginBottom: '8px',\n border: '1px solid var(--surface-border-strong, rgba(231, 171, 132, 0.3))',\n borderRadius: 'var(--radius-sm, 0.5rem)',\n cursor: onCallSelect ? 'pointer' : 'default',\n background: 'var(--surface-liquid-strong, #ffffff)',\n transition: 'background-color 0.2s',\n ...(onCallSelect && {\n ':hover': {\n backgroundColor: 'var(--surface, #F7F4ED)',\n },\n }),\n }}\n onMouseEnter={(e) => {\n if (onCallSelect) {\n e.currentTarget.style.backgroundColor = 'var(--surface, #F7F4ED)';\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'var(--surface-liquid-strong, #ffffff)';\n }}\n >\n <div style={{ fontWeight: '600', color: 'var(--text-primary, #1f2937)', marginBottom: '4px' }}>\n {call.to}\n </div>\n <div style={{ fontSize: '14px', color: 'var(--text-secondary, #6b7280)' }}>\n {call.status} • {new Date(call.created_at).toLocaleString()}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n );\n}\n"],"names":[],"mappings":"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","x_google_ignoreList":[0]}
|
package/dist/index.js
CHANGED
|
@@ -30,15 +30,15 @@ function styleInject(css, ref) {
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
var css_248z = "/**\n * Pamela
|
|
33
|
+
var css_248z = "/**\n * Pamela Enterprise React Component Library - Default Styles\n *\n * These styles align with the Pamela app design schema.\n * If the host app already defines these CSS variables, its values will win.\n */\n\n:root {\n --accent: #F27A1A;\n --accent-2: #F06C4F;\n --accent-3: #F3A84C;\n --accent-gradient: linear-gradient(90deg, var(--accent), var(--accent-2));\n --bg-gradient: linear-gradient(135deg, #F5F0E8 0%, #F3EEE8 45%, #EFE8DF 100%);\n --bg-glow: radial-gradient(1200px circle at 10% 20%, rgba(250, 147, 28, 0.1), transparent 58%),\n radial-gradient(900px circle at 80% 10%, rgba(253, 139, 116, 0.1), transparent 62%),\n radial-gradient(800px circle at 70% 80%, rgba(251, 193, 107, 0.08), transparent 60%);\n --surface: rgba(255, 255, 255, 0.5);\n --surface-strong: rgba(255, 255, 255, 0.78);\n --surface-border: rgba(231, 171, 132, 0.24);\n --surface-border-strong: rgba(255, 255, 255, 0.75);\n --surface-highlight: rgba(255, 255, 255, 0.68);\n --surface-liquid: linear-gradient(135deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.38));\n --surface-liquid-strong: linear-gradient(140deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.5));\n --liquid-shadow: 0 18px 42px rgba(28, 25, 17, 0.14);\n --liquid-glow: 0 0 32px rgba(250, 147, 28, 0.2);\n --shadow-soft: 0 12px 26px rgba(28, 25, 17, 0.1);\n --shadow-hover: 0 24px 44px rgba(28, 25, 17, 0.18);\n --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.7);\n --cta-bg: linear-gradient(120deg, rgba(255, 255, 255, 0.7), rgba(250, 147, 28, 0.32));\n --cta-border: 1px solid rgba(250, 147, 28, 0.4);\n --cta-glow: 0 0 18px rgba(250, 147, 28, 0.28);\n --cta-glow-hover: 0 0 22px rgba(250, 147, 28, 0.36);\n --danger-bg: linear-gradient(120deg, rgba(255, 255, 255, 0.6), rgba(239, 68, 68, 0.3));\n --danger-border: 1px solid rgba(239, 68, 68, 0.45);\n --danger-glow: 0 0 16px rgba(239, 68, 68, 0.3);\n --danger-glow-hover: 0 0 20px rgba(239, 68, 68, 0.4);\n --radius-sm: 0.5rem;\n --radius-md: 0.75rem;\n --radius-lg: 1rem;\n --radius-xl: 1.5rem;\n --text-primary: #1C1917;\n --text-secondary: rgba(28, 25, 17, 0.78);\n --text-muted: rgba(28, 25, 17, 0.55);\n --status-success: #10b981;\n --status-warning: #eab308;\n --status-muted: #d1d5db;\n --status-error: #ef4444;\n --bubble-user: #FA931C;\n --bubble-pamela: #ffffff;\n --bubble-recipient: #4b4bea;\n --bubble-border: rgba(231, 171, 132, 0.3);\n}\n\n.dark {\n --bg-gradient: linear-gradient(135deg, #171513 0%, #14110f 45%, #0f0d0b 100%);\n --bg-glow: radial-gradient(1100px circle at 20% 10%, rgba(250, 147, 28, 0.18), transparent 60%),\n radial-gradient(900px circle at 80% 20%, rgba(253, 139, 116, 0.16), transparent 60%),\n radial-gradient(700px circle at 60% 80%, rgba(251, 193, 107, 0.12), transparent 55%);\n --surface: rgba(255, 255, 255, 0.08);\n --surface-strong: rgba(255, 255, 255, 0.16);\n --surface-border: rgba(255, 255, 255, 0.18);\n --surface-border-strong: rgba(255, 255, 255, 0.36);\n --surface-highlight: rgba(255, 255, 255, 0.2);\n --surface-liquid: linear-gradient(150deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.05));\n --surface-liquid-strong: linear-gradient(150deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.08));\n --liquid-shadow: 0 22px 48px rgba(0, 0, 0, 0.55);\n --liquid-glow: 0 0 30px rgba(250, 147, 28, 0.24);\n --shadow-soft: 0 16px 32px rgba(0, 0, 0, 0.5);\n --shadow-hover: 0 26px 44px rgba(0, 0, 0, 0.7);\n --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.12);\n --cta-bg: linear-gradient(120deg, rgba(255, 255, 255, 0.22), rgba(250, 147, 28, 0.34));\n --cta-border: 1px solid rgba(250, 147, 28, 0.5);\n --cta-glow: 0 0 16px rgba(250, 147, 28, 0.26);\n --cta-glow-hover: 0 0 20px rgba(250, 147, 28, 0.32);\n --danger-bg: linear-gradient(120deg, rgba(255, 255, 255, 0.18), rgba(239, 68, 68, 0.32));\n --danger-border: 1px solid rgba(248, 113, 113, 0.55);\n --danger-glow: 0 0 18px rgba(239, 68, 68, 0.32);\n --danger-glow-hover: 0 0 22px rgba(239, 68, 68, 0.4);\n --text-primary: rgba(255, 255, 255, 0.95);\n --text-secondary: rgba(255, 255, 255, 0.72);\n --text-muted: rgba(255, 255, 255, 0.5);\n --bubble-pamela: rgba(255, 255, 255, 0.12);\n --bubble-border: rgba(255, 255, 255, 0.2);\n}\n\n/* Pulse animation for status indicators */\n@keyframes pamela-pulse {\n 0%, 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.5;\n }\n}\n\n/* Call Button - matches your gradient style */\n.pamela-call-button {\n font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;\n background: var(--accent-gradient);\n color: var(--text-primary);\n border: var(--cta-border);\n border-radius: var(--radius-md);\n font-weight: 600;\n transition: opacity 0.2s;\n box-shadow: var(--shadow-soft), var(--cta-glow);\n padding: 10px 20px;\n font-size: 16px;\n cursor: pointer;\n}\n\n.pamela-call-button:hover:not(:disabled) {\n opacity: 0.9;\n}\n\n.pamela-call-button:disabled {\n opacity: 0.7;\n cursor: not-allowed;\n background: linear-gradient(to right, #cfcfcf, #b6b6b6);\n border: 1px solid rgba(0, 0, 0, 0.08);\n box-shadow: none;\n}\n\n/* Call Status - matches your card style */\n.pamela-call-status {\n font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n}\n\n/* Transcript Viewer - matches your message bubble style */\n.pamela-transcript-viewer {\n font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n}\n\n.pamela-card {\n background: var(--surface-liquid-strong);\n border: 1px solid var(--surface-border-strong);\n border-radius: var(--radius-lg);\n box-shadow: var(--shadow-soft), var(--liquid-glow);\n}\n\n.pamela-panel {\n background: var(--surface-liquid);\n border: 1px solid var(--surface-border-strong);\n border-radius: var(--radius-xl);\n box-shadow: var(--liquid-shadow), var(--liquid-glow);\n}\n\n.pamela-chip {\n background: var(--surface-liquid);\n border: 1px solid var(--surface-border-strong);\n border-radius: 999px;\n padding: 0.25rem 0.6rem;\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--text-secondary);\n box-shadow: var(--shadow-inset);\n}\n\n.pamela-transcript-container {\n background: var(--surface);\n border-radius: var(--radius-md);\n padding: 16px;\n}\n\n.pamela-transcript-bubble {\n border-radius: var(--radius-md);\n padding: 12px 16px;\n}\n\n.pamela-transcript-bubble--pamela {\n background: var(--bubble-pamela);\n border: 1px solid var(--bubble-border);\n color: var(--text-primary);\n}\n\n.pamela-transcript-bubble--user {\n background: var(--bubble-user);\n color: #ffffff;\n}\n\n.pamela-transcript-bubble--recipient {\n background: var(--bubble-recipient);\n color: #ffffff;\n}\n\n/* Dark mode support */\n@media (prefers-color-scheme: dark) {\n .pamela-call-status {\n color: #ffffff;\n }\n \n .pamela-transcript-viewer {\n color: #ffffff;\n }\n}\n\n";
|
|
34
34
|
styleInject(css_248z);
|
|
35
35
|
|
|
36
36
|
const PamelaContext = React.createContext(null);
|
|
37
37
|
function PamelaProvider({ config, children }) {
|
|
38
|
-
const client = new sdk.PamelaClient({
|
|
38
|
+
const client = React.useMemo(() => new sdk.PamelaClient({
|
|
39
39
|
apiKey: config.apiKey,
|
|
40
40
|
baseUrl: config.baseUrl,
|
|
41
|
-
});
|
|
41
|
+
}), [config.apiKey, config.baseUrl]);
|
|
42
42
|
return (React.createElement(PamelaContext.Provider, { value: { client } }, children));
|
|
43
43
|
}
|
|
44
44
|
function usePamela() {
|
|
@@ -49,7 +49,7 @@ function usePamela() {
|
|
|
49
49
|
return context;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
function CallButton({ to, task, country, locale, instructions, end_user_id, metadata, onCallStart, onCallComplete, onError, disabled = false, className = '', children, }) {
|
|
52
|
+
function CallButton({ to, task, country, locale, instructions, end_user_id, metadata, tools, webhooks, onCallStart, onCallComplete, onError, disabled = false, className = '', children, }) {
|
|
53
53
|
const { client } = usePamela();
|
|
54
54
|
const [loading, setLoading] = React.useState(false);
|
|
55
55
|
const [callId, setCallId] = React.useState(null);
|
|
@@ -66,6 +66,8 @@ function CallButton({ to, task, country, locale, instructions, end_user_id, meta
|
|
|
66
66
|
instructions,
|
|
67
67
|
end_user_id,
|
|
68
68
|
metadata,
|
|
69
|
+
tools,
|
|
70
|
+
webhooks,
|
|
69
71
|
});
|
|
70
72
|
setCallId(call.id);
|
|
71
73
|
onCallStart?.(call.id);
|
|
@@ -96,22 +98,7 @@ function CallButton({ to, task, country, locale, instructions, end_user_id, meta
|
|
|
96
98
|
onError?.(error);
|
|
97
99
|
}
|
|
98
100
|
};
|
|
99
|
-
return (React.createElement("button", { onClick: handleClick, disabled: loading || disabled, className: `pamela-call-button ${className}
|
|
100
|
-
padding: '10px 20px',
|
|
101
|
-
background: loading
|
|
102
|
-
? 'linear-gradient(to right, #ccc, #aaa)'
|
|
103
|
-
: 'linear-gradient(to right, #FA931C, #fd8b74)',
|
|
104
|
-
color: 'white',
|
|
105
|
-
border: 'none',
|
|
106
|
-
borderRadius: '0.5rem',
|
|
107
|
-
cursor: loading || disabled ? 'not-allowed' : 'pointer',
|
|
108
|
-
fontSize: '16px',
|
|
109
|
-
fontWeight: '600',
|
|
110
|
-
fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',
|
|
111
|
-
transition: 'opacity 0.2s',
|
|
112
|
-
opacity: loading || disabled ? 0.7 : 1,
|
|
113
|
-
boxShadow: loading || disabled ? 'none' : '0 2px 4px rgba(250, 147, 28, 0.2)',
|
|
114
|
-
} }, loading ? 'Calling...' : children || 'Call Now'));
|
|
101
|
+
return (React.createElement("button", { onClick: handleClick, disabled: loading || disabled, className: `pamela-call-button ${className}` }, loading ? 'Calling...' : children || 'Call Now'));
|
|
115
102
|
}
|
|
116
103
|
|
|
117
104
|
function TranscriptViewer({ transcript, className = '' }) {
|
|
@@ -119,25 +106,28 @@ function TranscriptViewer({ transcript, className = '' }) {
|
|
|
119
106
|
if (speaker === 'pamela' || speaker === 'agent') {
|
|
120
107
|
// Pamela messages: white background with beige border
|
|
121
108
|
return {
|
|
122
|
-
backgroundColor: '#ffffff',
|
|
123
|
-
border: '1px solid rgba(231, 171, 132, 0.3)',
|
|
124
|
-
color: '#1f2937',
|
|
109
|
+
backgroundColor: 'var(--bubble-pamela, #ffffff)',
|
|
110
|
+
border: '1px solid var(--bubble-border, rgba(231, 171, 132, 0.3))',
|
|
111
|
+
color: 'var(--text-primary, #1f2937)',
|
|
112
|
+
className: 'pamela-transcript-bubble pamela-transcript-bubble--pamela',
|
|
125
113
|
};
|
|
126
114
|
}
|
|
127
115
|
else if (speaker === 'user' || speaker === 'caller') {
|
|
128
116
|
// User messages: orange background
|
|
129
117
|
return {
|
|
130
|
-
backgroundColor: '#FA931C',
|
|
118
|
+
backgroundColor: 'var(--bubble-user, #FA931C)',
|
|
131
119
|
border: 'none',
|
|
132
120
|
color: '#ffffff',
|
|
121
|
+
className: 'pamela-transcript-bubble pamela-transcript-bubble--user',
|
|
133
122
|
};
|
|
134
123
|
}
|
|
135
124
|
else {
|
|
136
125
|
// Call recipient: blue background
|
|
137
126
|
return {
|
|
138
|
-
backgroundColor: '#4b4bea',
|
|
127
|
+
backgroundColor: 'var(--bubble-recipient, #4b4bea)',
|
|
139
128
|
border: 'none',
|
|
140
129
|
color: '#ffffff',
|
|
130
|
+
className: 'pamela-transcript-bubble pamela-transcript-bubble--recipient',
|
|
141
131
|
};
|
|
142
132
|
}
|
|
143
133
|
};
|
|
@@ -148,21 +138,21 @@ function TranscriptViewer({ transcript, className = '' }) {
|
|
|
148
138
|
marginBottom: '16px',
|
|
149
139
|
fontSize: '18px',
|
|
150
140
|
fontWeight: '600',
|
|
151
|
-
color: '#1f2937',
|
|
141
|
+
color: 'var(--text-primary, #1f2937)',
|
|
152
142
|
} }, "Transcript"),
|
|
153
|
-
React.createElement("div", { style: {
|
|
143
|
+
React.createElement("div", { className: "pamela-transcript-container", style: {
|
|
154
144
|
maxHeight: '400px',
|
|
155
145
|
overflowY: 'auto',
|
|
156
|
-
borderRadius: '0.5rem',
|
|
146
|
+
borderRadius: 'var(--radius-sm, 0.5rem)',
|
|
157
147
|
padding: '16px',
|
|
158
|
-
|
|
148
|
+
background: 'var(--surface, #F7F4ED)',
|
|
159
149
|
} }, transcript.map((entry, index) => {
|
|
160
150
|
const style = getMessageStyle(entry.speaker);
|
|
161
|
-
|
|
151
|
+
const { className: bubbleClassName, ...bubbleStyle } = style;
|
|
152
|
+
return (React.createElement("div", { key: index, className: bubbleClassName, style: {
|
|
162
153
|
marginBottom: '12px',
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
borderRadius: '0.75rem',
|
|
154
|
+
...bubbleStyle,
|
|
155
|
+
borderRadius: 'var(--radius-md, 0.75rem)',
|
|
166
156
|
maxWidth: '75%',
|
|
167
157
|
marginLeft: entry.speaker === 'pamela' || entry.speaker === 'agent' ? '0' : 'auto',
|
|
168
158
|
marginRight: entry.speaker === 'pamela' || entry.speaker === 'agent' ? 'auto' : '0',
|
|
@@ -170,7 +160,7 @@ function TranscriptViewer({ transcript, className = '' }) {
|
|
|
170
160
|
React.createElement("div", { style: {
|
|
171
161
|
fontSize: '12px',
|
|
172
162
|
fontWeight: '600',
|
|
173
|
-
color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.9)' : '#6b7280',
|
|
163
|
+
color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.9)' : 'var(--text-muted, #6b7280)',
|
|
174
164
|
marginBottom: '6px',
|
|
175
165
|
textTransform: 'capitalize',
|
|
176
166
|
} }, entry.speaker === 'pamela' || entry.speaker === 'agent'
|
|
@@ -187,7 +177,7 @@ function TranscriptViewer({ transcript, className = '' }) {
|
|
|
187
177
|
} }, entry.text),
|
|
188
178
|
entry.timestamp && (React.createElement("div", { style: {
|
|
189
179
|
fontSize: '11px',
|
|
190
|
-
color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.7)' : '#9ca3af',
|
|
180
|
+
color: style.color === '#ffffff' ? 'rgba(255, 255, 255, 0.7)' : 'var(--text-muted, #9ca3af)',
|
|
191
181
|
marginTop: '6px',
|
|
192
182
|
} }, new Date(entry.timestamp).toLocaleTimeString()))));
|
|
193
183
|
}))));
|
|
@@ -197,45 +187,63 @@ function TranscriptViewer({ transcript, className = '' }) {
|
|
|
197
187
|
function StatusIndicator({ status }) {
|
|
198
188
|
const getStatusConfig = () => {
|
|
199
189
|
switch (status) {
|
|
190
|
+
case 'queued':
|
|
191
|
+
case 'initiating':
|
|
192
|
+
return {
|
|
193
|
+
dots: [
|
|
194
|
+
{ color: 'var(--status-warning, #eab308)', pulse: true },
|
|
195
|
+
{ color: 'var(--status-muted, #d1d5db)', pulse: false },
|
|
196
|
+
{ color: 'var(--status-muted, #d1d5db)', pulse: false },
|
|
197
|
+
{ color: 'var(--status-muted, #d1d5db)', pulse: false },
|
|
198
|
+
],
|
|
199
|
+
text: 'Queued...',
|
|
200
|
+
textColor: 'var(--status-warning, #eab308)',
|
|
201
|
+
};
|
|
200
202
|
case 'ringing':
|
|
201
203
|
return {
|
|
202
204
|
dots: [
|
|
203
|
-
{ color: '#10b981', pulse: true },
|
|
204
|
-
{ color: '#eab308', pulse: true },
|
|
205
|
-
{ color: '#d1d5db', pulse: false },
|
|
206
|
-
{ color: '#d1d5db', pulse: false },
|
|
205
|
+
{ color: 'var(--status-success, #10b981)', pulse: true },
|
|
206
|
+
{ color: 'var(--status-warning, #eab308)', pulse: true },
|
|
207
|
+
{ color: 'var(--status-muted, #d1d5db)', pulse: false },
|
|
208
|
+
{ color: 'var(--status-muted, #d1d5db)', pulse: false },
|
|
207
209
|
],
|
|
208
210
|
text: 'Ringing...',
|
|
209
|
-
textColor: '#eab308',
|
|
211
|
+
textColor: 'var(--status-warning, #eab308)',
|
|
210
212
|
};
|
|
211
213
|
case 'in_progress':
|
|
212
214
|
case 'in-progress':
|
|
213
215
|
return {
|
|
214
216
|
dots: [
|
|
215
|
-
{ color: '#10b981', pulse: false },
|
|
216
|
-
{ color: '#10b981', pulse: false },
|
|
217
|
-
{ color: '#10b981', pulse: true },
|
|
218
|
-
{ color: '#d1d5db', pulse: false },
|
|
217
|
+
{ color: 'var(--status-success, #10b981)', pulse: false },
|
|
218
|
+
{ color: 'var(--status-success, #10b981)', pulse: false },
|
|
219
|
+
{ color: 'var(--status-success, #10b981)', pulse: true },
|
|
220
|
+
{ color: 'var(--status-muted, #d1d5db)', pulse: false },
|
|
219
221
|
],
|
|
220
222
|
text: 'In progress',
|
|
221
|
-
textColor: '#10b981',
|
|
223
|
+
textColor: 'var(--status-success, #10b981)',
|
|
222
224
|
};
|
|
223
225
|
case 'completed':
|
|
224
226
|
return {
|
|
225
227
|
dots: [
|
|
226
|
-
{ color: '#10b981', pulse: false },
|
|
227
|
-
{ color: '#10b981', pulse: false },
|
|
228
|
-
{ color: '#10b981', pulse: false },
|
|
229
|
-
{ color: '#10b981', pulse: false, icon: true },
|
|
228
|
+
{ color: 'var(--status-success, #10b981)', pulse: false },
|
|
229
|
+
{ color: 'var(--status-success, #10b981)', pulse: false },
|
|
230
|
+
{ color: 'var(--status-success, #10b981)', pulse: false },
|
|
231
|
+
{ color: 'var(--status-success, #10b981)', pulse: false, icon: true },
|
|
230
232
|
],
|
|
231
233
|
text: 'Completed',
|
|
232
|
-
textColor: '#10b981',
|
|
234
|
+
textColor: 'var(--status-success, #10b981)',
|
|
233
235
|
};
|
|
234
236
|
case 'failed':
|
|
235
237
|
return {
|
|
236
238
|
dots: [],
|
|
237
239
|
text: 'Failed',
|
|
238
|
-
textColor: '#ef4444',
|
|
240
|
+
textColor: 'var(--status-error, #ef4444)',
|
|
241
|
+
};
|
|
242
|
+
case 'cancelled':
|
|
243
|
+
return {
|
|
244
|
+
dots: [],
|
|
245
|
+
text: 'Cancelled',
|
|
246
|
+
textColor: 'var(--status-error, #ef4444)',
|
|
239
247
|
};
|
|
240
248
|
default:
|
|
241
249
|
return {
|
|
@@ -253,7 +261,7 @@ function StatusIndicator({ status }) {
|
|
|
253
261
|
height: '8px',
|
|
254
262
|
borderRadius: '50%',
|
|
255
263
|
backgroundColor: dot.color,
|
|
256
|
-
animation: dot.pulse ? 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite' : 'none',
|
|
264
|
+
animation: dot.pulse ? 'pamela-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite' : 'none',
|
|
257
265
|
} }))))))),
|
|
258
266
|
React.createElement("span", { style: {
|
|
259
267
|
fontSize: '12px',
|
|
@@ -288,17 +296,17 @@ function CallStatus({ callId, pollInterval = 5000, onStatusChange, showTranscrip
|
|
|
288
296
|
}, [callId, pollInterval, client, onStatusChange]);
|
|
289
297
|
if (loading) {
|
|
290
298
|
return (React.createElement("div", { className: `pamela-call-status ${className}` },
|
|
291
|
-
React.createElement("div", { style: { color: '#6b7280', fontFamily: 'Poppins, Inter, sans-serif' } }, "Loading call status...")));
|
|
299
|
+
React.createElement("div", { style: { color: 'var(--text-muted, #6b7280)', fontFamily: 'Poppins, Inter, sans-serif' } }, "Loading call status...")));
|
|
292
300
|
}
|
|
293
301
|
if (error) {
|
|
294
302
|
return (React.createElement("div", { className: `pamela-call-status ${className}` },
|
|
295
|
-
React.createElement("div", { style: { color: '#ef4444', fontFamily: 'Poppins, Inter, sans-serif' } },
|
|
303
|
+
React.createElement("div", { style: { color: 'var(--status-error, #ef4444)', fontFamily: 'Poppins, Inter, sans-serif' } },
|
|
296
304
|
"Error: ",
|
|
297
305
|
error.message)));
|
|
298
306
|
}
|
|
299
307
|
if (!status) {
|
|
300
308
|
return (React.createElement("div", { className: `pamela-call-status ${className}` },
|
|
301
|
-
React.createElement("div", { style: { color: '#6b7280', fontFamily: 'Poppins, Inter, sans-serif' } }, "Call not found")));
|
|
309
|
+
React.createElement("div", { style: { color: 'var(--text-muted, #6b7280)', fontFamily: 'Poppins, Inter, sans-serif' } }, "Call not found")));
|
|
302
310
|
}
|
|
303
311
|
return (React.createElement("div", { className: `pamela-call-status ${className}`, style: {
|
|
304
312
|
fontFamily: 'Poppins, Inter, -apple-system, BlinkMacSystemFont, sans-serif',
|
|
@@ -306,34 +314,34 @@ function CallStatus({ callId, pollInterval = 5000, onStatusChange, showTranscrip
|
|
|
306
314
|
React.createElement("div", { style: {
|
|
307
315
|
marginBottom: '16px',
|
|
308
316
|
padding: '16px',
|
|
309
|
-
|
|
310
|
-
borderRadius: '0.75rem',
|
|
311
|
-
border: '1px solid rgba(231, 171, 132, 0.3)',
|
|
312
|
-
boxShadow: '0 1px 3px
|
|
317
|
+
background: 'var(--surface-liquid-strong, #ffffff)',
|
|
318
|
+
borderRadius: 'var(--radius-md, 0.75rem)',
|
|
319
|
+
border: '1px solid var(--surface-border-strong, rgba(231, 171, 132, 0.3))',
|
|
320
|
+
boxShadow: 'var(--shadow-soft, 0 1px 3px rgba(0, 0, 0, 0.1))',
|
|
313
321
|
} },
|
|
314
322
|
React.createElement("div", { style: { marginBottom: '12px' } },
|
|
315
323
|
React.createElement(StatusIndicator, { status: status.status })),
|
|
316
|
-
React.createElement("div", { style: { fontSize: '14px', color: '#1f2937', lineHeight: '1.6' } },
|
|
324
|
+
React.createElement("div", { style: { fontSize: '14px', color: 'var(--text-primary, #1f2937)', lineHeight: '1.6' } },
|
|
317
325
|
React.createElement("div", { style: { marginBottom: '8px' } },
|
|
318
|
-
React.createElement("span", { style: { fontWeight: '600', color: '#6b7280' } }, "To:"),
|
|
326
|
+
React.createElement("span", { style: { fontWeight: '600', color: 'var(--text-secondary, #6b7280)' } }, "To:"),
|
|
319
327
|
' ',
|
|
320
|
-
React.createElement("span", { style: { color: '#1f2937' } }, status.to)),
|
|
328
|
+
React.createElement("span", { style: { color: 'var(--text-primary, #1f2937)' } }, status.to)),
|
|
321
329
|
React.createElement("div", { style: { marginBottom: '8px' } },
|
|
322
|
-
React.createElement("span", { style: { fontWeight: '600', color: '#6b7280' } }, "From:"),
|
|
330
|
+
React.createElement("span", { style: { fontWeight: '600', color: 'var(--text-secondary, #6b7280)' } }, "From:"),
|
|
323
331
|
' ',
|
|
324
|
-
React.createElement("span", { style: { color: '#1f2937' } }, status.from_)),
|
|
332
|
+
React.createElement("span", { style: { color: 'var(--text-primary, #1f2937)' } }, status.from_)),
|
|
325
333
|
status.duration_seconds && (React.createElement("div", { style: { marginBottom: '8px' } },
|
|
326
|
-
React.createElement("span", { style: { fontWeight: '600', color: '#6b7280' } }, "Duration:"),
|
|
334
|
+
React.createElement("span", { style: { fontWeight: '600', color: 'var(--text-secondary, #6b7280)' } }, "Duration:"),
|
|
327
335
|
' ',
|
|
328
|
-
React.createElement("span", { style: { color: '#1f2937' } },
|
|
336
|
+
React.createElement("span", { style: { color: 'var(--text-primary, #1f2937)' } },
|
|
329
337
|
status.duration_seconds,
|
|
330
338
|
"s")))),
|
|
331
339
|
status.summary && (React.createElement("div", { style: {
|
|
332
340
|
marginTop: '16px',
|
|
333
341
|
padding: '16px',
|
|
334
|
-
background: 'linear-gradient(to right, rgba(250, 147, 28, 0.1), rgba(253, 139, 116, 0.1))',
|
|
335
|
-
border: '1px solid rgba(250, 147, 28, 0.3)',
|
|
336
|
-
borderRadius: '0.75rem',
|
|
342
|
+
background: 'var(--cta-bg, linear-gradient(to right, rgba(250, 147, 28, 0.1), rgba(253, 139, 116, 0.1)))',
|
|
343
|
+
border: 'var(--cta-border, 1px solid rgba(250, 147, 28, 0.3))',
|
|
344
|
+
borderRadius: 'var(--radius-md, 0.75rem)',
|
|
337
345
|
} },
|
|
338
346
|
React.createElement("div", { style: {
|
|
339
347
|
display: 'flex',
|
|
@@ -341,21 +349,11 @@ function CallStatus({ callId, pollInterval = 5000, onStatusChange, showTranscrip
|
|
|
341
349
|
gap: '8px',
|
|
342
350
|
marginBottom: '8px',
|
|
343
351
|
} },
|
|
344
|
-
React.createElement("svg", { style: { width: '20px', height: '20px', color: '#FA931C' }, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
|
|
352
|
+
React.createElement("svg", { style: { width: '20px', height: '20px', color: 'var(--accent, #FA931C)' }, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
|
|
345
353
|
React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" })),
|
|
346
|
-
React.createElement("h4", { style: { fontWeight: '600', color: '#1f2937', fontSize: '14px' } }, "Call Summary")),
|
|
347
|
-
React.createElement("p", { style: { fontSize: '14px', color: '#1f2937', lineHeight: '1.6' } }, status.summary)))),
|
|
348
|
-
showTranscript && status.transcript && status.transcript.length > 0 && (React.createElement(TranscriptViewer, { transcript: status.transcript }))
|
|
349
|
-
React.createElement("style", null, `
|
|
350
|
-
@keyframes pulse {
|
|
351
|
-
0%, 100% {
|
|
352
|
-
opacity: 1;
|
|
353
|
-
}
|
|
354
|
-
50% {
|
|
355
|
-
opacity: 0.5;
|
|
356
|
-
}
|
|
357
|
-
}
|
|
358
|
-
`)));
|
|
354
|
+
React.createElement("h4", { style: { fontWeight: '600', color: 'var(--text-primary, #1f2937)', fontSize: '14px' } }, "Call Summary")),
|
|
355
|
+
React.createElement("p", { style: { fontSize: '14px', color: 'var(--text-primary, #1f2937)', lineHeight: '1.6' } }, status.summary)))),
|
|
356
|
+
showTranscript && status.transcript && status.transcript.length > 0 && (React.createElement(TranscriptViewer, { transcript: status.transcript }))));
|
|
359
357
|
}
|
|
360
358
|
|
|
361
359
|
function CallHistory({ limit = 10, onCallSelect, className = '', }) {
|
|
@@ -363,19 +361,37 @@ function CallHistory({ limit = 10, onCallSelect, className = '', }) {
|
|
|
363
361
|
const [calls, setCalls] = React.useState([]);
|
|
364
362
|
const [loading, setLoading] = React.useState(true);
|
|
365
363
|
const [error, setError] = React.useState(null);
|
|
366
|
-
// Note: This requires a list endpoint in the API
|
|
367
|
-
// For now, this is a placeholder that shows the structure
|
|
368
364
|
React.useEffect(() => {
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
365
|
+
let isMounted = true;
|
|
366
|
+
const fetchCalls = async () => {
|
|
367
|
+
try {
|
|
368
|
+
const response = await client.listCalls({ limit });
|
|
369
|
+
if (!isMounted) {
|
|
370
|
+
return;
|
|
371
|
+
}
|
|
372
|
+
setCalls(response.items || []);
|
|
373
|
+
setLoading(false);
|
|
374
|
+
}
|
|
375
|
+
catch (err) {
|
|
376
|
+
if (!isMounted) {
|
|
377
|
+
return;
|
|
378
|
+
}
|
|
379
|
+
setError(err);
|
|
380
|
+
setLoading(false);
|
|
381
|
+
}
|
|
382
|
+
};
|
|
383
|
+
fetchCalls();
|
|
384
|
+
return () => {
|
|
385
|
+
isMounted = false;
|
|
386
|
+
};
|
|
387
|
+
}, [client, limit]);
|
|
372
388
|
if (loading) {
|
|
373
389
|
return (React.createElement("div", { className: `pamela-call-history ${className}` },
|
|
374
|
-
React.createElement("div", { style: { color: '#6b7280', fontFamily: 'Poppins, Inter, sans-serif' } }, "Loading call history...")));
|
|
390
|
+
React.createElement("div", { style: { color: 'var(--text-muted, #6b7280)', fontFamily: 'Poppins, Inter, sans-serif' } }, "Loading call history...")));
|
|
375
391
|
}
|
|
376
392
|
if (error) {
|
|
377
393
|
return (React.createElement("div", { className: `pamela-call-history ${className}` },
|
|
378
|
-
React.createElement("div", { style: { color: '#ef4444', fontFamily: 'Poppins, Inter, sans-serif' } },
|
|
394
|
+
React.createElement("div", { style: { color: 'var(--status-error, #ef4444)', fontFamily: 'Poppins, Inter, sans-serif' } },
|
|
379
395
|
"Error: ",
|
|
380
396
|
error.message)));
|
|
381
397
|
}
|
|
@@ -386,30 +402,30 @@ function CallHistory({ limit = 10, onCallSelect, className = '', }) {
|
|
|
386
402
|
marginBottom: '16px',
|
|
387
403
|
fontSize: '18px',
|
|
388
404
|
fontWeight: '600',
|
|
389
|
-
color: '#1f2937',
|
|
405
|
+
color: 'var(--text-primary, #1f2937)',
|
|
390
406
|
} }, "Call History"),
|
|
391
|
-
calls.length === 0 ? (React.createElement("div", { style: { color: '#6b7280', fontSize: '14px' } }, "No calls yet")) : (React.createElement("div", null, calls.map((call) => (React.createElement("div", { key: call.id, onClick: () => onCallSelect?.(call.id), style: {
|
|
407
|
+
calls.length === 0 ? (React.createElement("div", { style: { color: 'var(--text-muted, #6b7280)', fontSize: '14px' } }, "No calls yet")) : (React.createElement("div", null, calls.map((call) => (React.createElement("div", { key: call.id, onClick: () => onCallSelect?.(call.id), style: {
|
|
392
408
|
padding: '12px',
|
|
393
409
|
marginBottom: '8px',
|
|
394
|
-
border: '1px solid rgba(231, 171, 132, 0.3)',
|
|
395
|
-
borderRadius: '0.5rem',
|
|
410
|
+
border: '1px solid var(--surface-border-strong, rgba(231, 171, 132, 0.3))',
|
|
411
|
+
borderRadius: 'var(--radius-sm, 0.5rem)',
|
|
396
412
|
cursor: onCallSelect ? 'pointer' : 'default',
|
|
397
|
-
|
|
413
|
+
background: 'var(--surface-liquid-strong, #ffffff)',
|
|
398
414
|
transition: 'background-color 0.2s',
|
|
399
415
|
...(onCallSelect && {
|
|
400
416
|
':hover': {
|
|
401
|
-
backgroundColor: '#F7F4ED',
|
|
417
|
+
backgroundColor: 'var(--surface, #F7F4ED)',
|
|
402
418
|
},
|
|
403
419
|
}),
|
|
404
420
|
}, onMouseEnter: (e) => {
|
|
405
421
|
if (onCallSelect) {
|
|
406
|
-
e.currentTarget.style.backgroundColor = '#F7F4ED';
|
|
422
|
+
e.currentTarget.style.backgroundColor = 'var(--surface, #F7F4ED)';
|
|
407
423
|
}
|
|
408
424
|
}, onMouseLeave: (e) => {
|
|
409
|
-
e.currentTarget.style.backgroundColor = '#ffffff';
|
|
425
|
+
e.currentTarget.style.backgroundColor = 'var(--surface-liquid-strong, #ffffff)';
|
|
410
426
|
} },
|
|
411
|
-
React.createElement("div", { style: { fontWeight: '600', color: '#1f2937', marginBottom: '4px' } }, call.to),
|
|
412
|
-
React.createElement("div", { style: { fontSize: '14px', color: '#6b7280' } },
|
|
427
|
+
React.createElement("div", { style: { fontWeight: '600', color: 'var(--text-primary, #1f2937)', marginBottom: '4px' } }, call.to),
|
|
428
|
+
React.createElement("div", { style: { fontSize: '14px', color: 'var(--text-secondary, #6b7280)' } },
|
|
413
429
|
call.status,
|
|
414
430
|
" \u2022 ",
|
|
415
431
|
new Date(call.created_at).toLocaleString()))))))));
|