@bytexbyte/nxtlinq-ai-agent-sdk 1.2.2 → 1.2.4

package/dist/components/types/ChatBotTypes.d.ts

@@ -0,0 +1,115 @@
+import { Message, AIT, ServicePermission, AITApi } from '../../types/ait-api';
+export interface PresetMessage {
+    text: string;
+    autoSend?: boolean;
+}
+export interface ToolUse {
+    name: string;
+    input: Record<string, any>;
+}
+export interface ToolCall {
+    toolUse: ToolUse;
+}
+export interface NovaResponse {
+    result: string;
+    reply: Array<{
+        text: string;
+    }>;
+    toolCall?: ToolCall;
+}
+export interface NovaError {
+    error: string;
+}
+export interface AITMetadata {
+    model: string;
+    permissions: string[];
+    issuedBy: string;
+}
+export interface AIModel {
+    label: string;
+    value: string;
+}
+export declare const DEFAULT_AI_MODELS: AIModel[];
+export declare const AI_MODEL_MAP: Record<string, string>;
+export interface ChatBotProps {
+    onMessage?: (message: Message) => void;
+    onError?: (error: Error) => void;
+    onToolUse?: (toolUse: ToolUse) => Promise<Message | void>;
+    presetMessages?: PresetMessage[];
+    placeholder?: string;
+    className?: string;
+    maxRetries?: number;
+    retryDelay?: number;
+    serviceId: string;
+    apiKey: string;
+    apiSecret: string;
+    onVerifyWallet?: () => Promise<{
+        token: string;
+    } | undefined>;
+    permissionGroup?: string;
+    children?: React.ReactNode;
+    availableModels?: AIModel[];
+    defaultModelIndex?: number;
+    showModelSelector?: boolean;
+    onModelChange?: (model: AIModel) => void;
+}
+export interface ChatBotContextType {
+    messages: Message[];
+    inputValue: string;
+    isLoading: boolean;
+    isOpen: boolean;
+    hitAddress: string | null;
+    ait: AIT | null;
+    permissions: string[];
+    availablePermissions: ServicePermission[];
+    showPermissionForm: boolean;
+    isPermissionFormOpen: boolean;
+    isAITLoading: boolean;
+    isDisabled: boolean;
+    walletInfo: any;
+    isWalletLoading: boolean;
+    notification: {
+        show: boolean;
+        type: 'success' | 'error' | 'warning' | 'info';
+        message: string;
+        autoHide?: boolean;
+        duration?: number;
+    };
+    availableModels: AIModel[];
+    selectedModelIndex: number;
+    showModelSelector: boolean;
+    setInputValue: (value: string) => void;
+    setIsOpen: (open: boolean) => void;
+    setShowPermissionForm: (show: boolean) => void;
+    setIsPermissionFormOpen: (open: boolean) => void;
+    setPermissions: (permissions: string[]) => void;
+    setIsDisabled: (disabled: boolean) => void;
+    setIsWalletLoading: (loading: boolean) => void;
+    setNotification: (notification: any) => void;
+    setSelectedModelIndex: (index: number) => void;
+    setShowModelSelector: (show: boolean) => void;
+    connectWallet: (autoShowSignInMessage?: boolean) => Promise<string | undefined>;
+    signInWallet: (autoShowSuccessMessage?: boolean) => Promise<void>;
+    sendMessage: (content: string, retryCount?: number) => Promise<void>;
+    handleSubmit: (e: React.FormEvent) => Promise<void>;
+    handlePresetMessage: (message: PresetMessage) => void;
+    savePermissions: () => Promise<void>;
+    handleVerifyWalletClick: () => Promise<void>;
+    showSuccess: (message: string) => void;
+    showError: (message: string) => void;
+    showWarning: (message: string) => void;
+    showInfo: (message: string) => void;
+    refreshAIT: (forceUpdatePermissions?: boolean) => Promise<void>;
+    handleModelChange: (modelIndex: number) => void;
+    getCurrentModel: () => AIModel;
+    onSave: () => Promise<void>;
+    onConnectWallet: () => Promise<string | undefined>;
+    onSignIn: () => Promise<void>;
+    isNeedSignInWithWallet: boolean;
+    onVerifyWallet: () => Promise<void>;
+    serviceId: string;
+    permissionGroup?: string;
+    props: ChatBotProps;
+    nxtlinqApi: AITApi;
+}
+//# sourceMappingURL=ChatBotTypes.d.ts.map

package/dist/components/types/ChatBotTypes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatBotTypes.d.ts","sourceRoot":"","sources":["../../../src/components/types/ChatBotTypes.ts"],"names":[],"mappings":"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"}

package/dist/components/types/ChatBotTypes.js

@@ -0,0 +1,14 @@
+export const DEFAULT_AI_MODELS = [
+    { label: 'Nova', value: 'nova' },
+    { label: 'Claude', value: 'claude' },
+    { label: 'ChatGPT', value: 'open-ai' },
+    { label: 'Llama', value: 'llama' },
+    { label: 'Gemini', value: 'gemini' },
+];
+export const AI_MODEL_MAP = {
+    nova: 'Nova',
+    claude: 'Claude',
+    'open-ai': 'ChatGPT',
+    llama: 'Llama',
+    gemini: 'Gemini',
+};

package/dist/components/ui/ChatBotUI.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const ChatBotUI: React.FC;
+//# sourceMappingURL=ChatBotUI.d.ts.map

package/dist/components/ui/ChatBotUI.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatBotUI.d.ts","sourceRoot":"","sources":["../../../src/components/ui/ChatBotUI.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAsP7B,CAAC"}

package/dist/components/ui/ChatBotUI.js

@@ -0,0 +1,147 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useChatBot } from '../context/ChatBotContext';
+import { NotificationModal } from './NotificationModal';
+import { PermissionForm } from './PermissionForm';
+import { MessageList } from './MessageList';
+import { MessageInput } from './MessageInput';
+import { PresetMessages } from './PresetMessages';
+import { ModelSelector } from './ModelSelector';
+export const ChatBotUI = () => {
+    const { isOpen, setIsOpen, showPermissionForm, setShowPermissionForm, notification, setNotification, isAITLoading, props: { className = '' } } = useChatBot();
+    // Add CSS animation for loading spinner
+    React.useEffect(() => {
+        const style = document.createElement('style');
+        style.textContent = `
+      @keyframes spin {
+        0% { transform: rotate(0deg); }
+        100% { transform: rotate(360deg); }
+      }
+    `;
+        document.head.appendChild(style);
+        return () => {
+            document.head.removeChild(style);
+        };
+    }, []);
+    const handleClose = () => {
+        setIsOpen(false);
+    };
+    const handleOpen = () => {
+        setIsOpen(true);
+    };
+    const handleCloseNotification = () => {
+        setNotification((prev) => ({ ...prev, show: false }));
+    };
+    const handleSettingsClick = () => {
+        setShowPermissionForm(true);
+    };
+    // Show floating button when chat is closed
+    if (!isOpen) {
+        return (_jsxs(_Fragment, { children: [_jsx("button", { onClick: handleOpen, style: {
+                        position: 'fixed',
+                        bottom: '20px',
+                        right: '20px',
+                        backgroundColor: '#007bff',
+                        color: 'white',
+                        border: 'none',
+                        padding: '10px 20px',
+                        borderRadius: '20px',
+                        cursor: 'pointer',
+                        boxShadow: '0 2px 5px rgba(0,0,0,0.2)',
+                        transition: 'all 0.3s ease',
+                        zIndex: 1000,
+                        fontSize: '14px',
+                        fontWeight: '500'
+                    }, onMouseOver: (e) => {
+                        e.currentTarget.style.backgroundColor = '#0056b3';
+                        e.currentTarget.style.transform = 'translateY(-2px)';
+                    }, onMouseOut: (e) => {
+                        e.currentTarget.style.backgroundColor = '#007bff';
+                        e.currentTarget.style.transform = 'translateY(0)';
+                    }, title: "Open AI Agent Chat", children: "AI Agent" }), notification.show && (_jsx(NotificationModal, { type: notification.type, title: notification.type === 'success' ? 'Success' :
+                        notification.type === 'error' ? 'Error' :
+                            notification.type === 'warning' ? 'Warning' : 'Info', message: notification.message, onClose: handleCloseNotification }))] }));
+    }
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { style: {
+                    position: 'fixed',
+                    bottom: '20px',
+                    right: '20px',
+                    width: '500px',
+                    height: '600px',
+                    backgroundColor: 'white',
+                    borderRadius: '10px',
+                    boxShadow: '0 5px 15px rgba(0,0,0,0.2)',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    zIndex: 1001,
+                    overflow: 'hidden'
+                }, className: className, children: [_jsxs("div", { style: {
+                            padding: '15px',
+                            backgroundColor: '#007bff',
+                            color: 'white',
+                            borderRadius: '10px 10px 0 0',
+                            display: 'flex',
+                            justifyContent: 'space-between',
+                            alignItems: 'center'
+                        }, children: [_jsxs("div", { style: {
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    gap: '10px'
+                                }, children: [_jsx("h3", { style: {
+                                            margin: 0,
+                                            fontSize: '16px',
+                                            fontWeight: '600'
+                                        }, children: "AI Agent" }), _jsx("div", { style: { position: 'relative' }, children: _jsx(ModelSelector, {}) }), isAITLoading && (_jsxs("div", { style: {
+                                            display: 'flex',
+                                            alignItems: 'center',
+                                            gap: '5px',
+                                            fontSize: '12px',
+                                            opacity: '0.8'
+                                        }, children: [_jsx("div", { style: {
+                                                    width: '12px',
+                                                    height: '12px',
+                                                    border: '2px solid rgba(255, 255, 255, 0.3)',
+                                                    borderTop: '2px solid white',
+                                                    borderRadius: '50%',
+                                                    animation: 'spin 1s linear infinite'
+                                                } }), "Loading..."] }))] }), _jsxs("div", { style: {
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    gap: '10px'
+                                }, children: [_jsx("button", { onClick: handleSettingsClick, style: {
+                                            background: 'none',
+                                            border: 'none',
+                                            color: 'white',
+                                            fontSize: '16px',
+                                            cursor: 'pointer',
+                                            padding: '4px',
+                                            display: 'flex',
+                                            alignItems: 'center',
+                                            justifyContent: 'center',
+                                            borderRadius: '4px',
+                                            transition: 'background-color 0.2s'
+                                        }, onMouseOver: (e) => e.currentTarget.style.backgroundColor = 'rgba(255, 255, 255, 0.2)', onMouseOut: (e) => e.currentTarget.style.backgroundColor = 'transparent', title: "AIT Settings", children: "\u2699\uFE0F" }), _jsx("button", { onClick: handleClose, style: {
+                                            background: 'none',
+                                            border: 'none',
+                                            color: 'white',
+                                            fontSize: '24px',
+                                            cursor: 'pointer',
+                                            padding: '0',
+                                            display: 'flex',
+                                            alignItems: 'center',
+                                            justifyContent: 'center'
+                                        }, children: "\u00D7" })] })] }), _jsx(MessageList, {}), _jsx(PresetMessages, {}), _jsx(MessageInput, {})] }), showPermissionForm && (_jsx("div", { style: {
+                    position: 'fixed',
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    bottom: 0,
+                    backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    zIndex: 1002
+                }, children: _jsx(PermissionForm, { onClose: () => setShowPermissionForm(false), onOpen: () => setShowPermissionForm(true) }) })), notification.show && (_jsx(NotificationModal, { type: notification.type, title: notification.type === 'success' ? 'Success' :
+                    notification.type === 'error' ? 'Error' :
+                        notification.type === 'warning' ? 'Warning' : 'Info', message: notification.message, onClose: handleCloseNotification }))] }));
+};

package/dist/components/ui/MessageInput.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const MessageInput: React.FC;
+//# sourceMappingURL=MessageInput.d.ts.map

package/dist/components/ui/MessageInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageInput.d.ts","sourceRoot":"","sources":["../../../src/components/ui/MessageInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EA0EhC,CAAC"}

package/dist/components/ui/MessageInput.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useChatBot } from '../context/ChatBotContext';
+export const MessageInput = () => {
+    const { inputValue, setInputValue, isLoading, isAITLoading, handleSubmit, props: { placeholder = 'Type a message...' } } = useChatBot();
+    const isDisabled = isLoading || isAITLoading;
+    const buttonText = isLoading ? 'Sending...' : isAITLoading ? 'Loading...' : 'Send';
+    const inputPlaceholder = isAITLoading ? 'Loading wallet configuration...' : placeholder;
+    const handleKeyPress = (e) => {
+        if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            handleSubmit(e);
+        }
+    };
+    return (_jsxs("div", { style: {
+            padding: '15px',
+            display: 'flex',
+            gap: '10px',
+            borderTop: '1px solid #eee'
+        }, children: [_jsx("input", { type: "text", value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyPress: handleKeyPress, placeholder: inputPlaceholder, disabled: isDisabled, style: {
+                    flex: 1,
+                    padding: '10px',
+                    border: '1px solid #ddd',
+                    borderRadius: '20px',
+                    outline: 'none',
+                    fontSize: '14px',
+                    backgroundColor: isDisabled ? '#f8f9fa' : '#fff'
+                } }), _jsx("button", { onClick: (e) => handleSubmit(e), disabled: isDisabled || !inputValue.trim(), style: {
+                    backgroundColor: isDisabled || !inputValue.trim() ? '#e9ecef' : '#007bff',
+                    color: isDisabled || !inputValue.trim() ? '#6c757d' : 'white',
+                    border: 'none',
+                    padding: '10px 20px',
+                    borderRadius: '20px',
+                    cursor: isDisabled || !inputValue.trim() ? 'not-allowed' : 'pointer',
+                    fontSize: '14px',
+                    fontWeight: '500',
+                    transition: 'background-color 0.3s'
+                }, onMouseOver: (e) => {
+                    if (!isDisabled && inputValue.trim()) {
+                        e.currentTarget.style.backgroundColor = '#0056b3';
+                    }
+                }, onMouseOut: (e) => {
+                    if (!isDisabled && inputValue.trim()) {
+                        e.currentTarget.style.backgroundColor = '#007bff';
+                    }
+                }, children: buttonText })] }));
+};

package/dist/components/ui/MessageList.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const MessageList: React.FC;
+//# sourceMappingURL=MessageList.d.ts.map

package/dist/components/ui/MessageList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/ui/MessageList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAyI/B,CAAC"}

package/dist/components/ui/MessageList.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useChatBot } from '../context/ChatBotContext';
+import { AI_MODEL_MAP } from '../types/ChatBotTypes';
+export const MessageList = () => {
+    const { messages, isLoading, connectWallet, signInWallet, hitAddress, ait, setShowPermissionForm, isWalletLoading } = useChatBot();
+    const messagesEndRef = React.useRef(null);
+    const scrollToBottom = () => {
+        messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+    };
+    React.useEffect(() => {
+        scrollToBottom();
+    }, [messages]);
+    const handleButtonClick = (buttonType) => {
+        if (buttonType === 'connect') {
+            connectWallet(true);
+        }
+        else if (buttonType === 'signIn') {
+            signInWallet(true);
+        }
+    };
+    const getModelDisplayName = (modelValue) => {
+        if (!modelValue)
+            return '';
+        return AI_MODEL_MAP[modelValue] || modelValue;
+    };
+    return (_jsxs("div", { style: {
+            flex: 1,
+            padding: '15px',
+            overflowY: 'auto',
+            display: 'flex',
+            flexDirection: 'column',
+            gap: '10px'
+        }, children: [messages.map((message) => (_jsxs("div", { style: {
+                    alignSelf: message.role === 'user' ? 'flex-end' : 'flex-start',
+                    maxWidth: '80%',
+                    marginBottom: '10px'
+                }, children: [_jsxs("div", { style: {
+                            backgroundColor: message.role === 'user' ? '#007bff' : '#f1f1f1',
+                            color: message.role === 'user' ? 'white' : '#333',
+                            padding: '10px 15px',
+                            borderRadius: '15px',
+                            wordWrap: 'break-word',
+                            position: 'relative'
+                        }, children: [message.content, message.button && (_jsx("div", { style: { marginTop: '10px' }, children: _jsx("button", { onClick: () => handleButtonClick(message.button), style: {
+                                        padding: '8px 16px',
+                                        backgroundColor: message.role === 'user' ? 'rgba(255, 255, 255, 0.2)' : '#007bff',
+                                        color: message.role === 'user' ? 'white' : 'white',
+                                        border: 'none',
+                                        borderRadius: '5px',
+                                        cursor: 'pointer',
+                                        fontSize: '14px'
+                                    }, children: message.button === 'connect' ? 'Connect Wallet' :
+                                        message.button === 'signIn' ? 'Sign In' : message.button }) }))] }), message.role === 'assistant' && message.metadata?.model && (_jsx("div", { style: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            marginTop: '4px',
+                            marginLeft: '8px'
+                        }, children: _jsxs("div", { style: {
+                                backgroundColor: '#e3f2fd',
+                                color: '#1976d2',
+                                padding: '2px 8px',
+                                borderRadius: '10px',
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                border: '1px solid #bbdefb',
+                                display: 'flex',
+                                alignItems: 'center',
+                                gap: '4px'
+                            }, children: [_jsx("span", { style: {
+                                        width: '6px',
+                                        height: '6px',
+                                        backgroundColor: '#1976d2',
+                                        borderRadius: '50%',
+                                        display: 'inline-block'
+                                    } }), getModelDisplayName(message.metadata.model)] }) }))] }, message.id))), isLoading && (_jsx("div", { style: {
+                    alignSelf: 'flex-start',
+                    backgroundColor: '#f1f1f1',
+                    color: '#333',
+                    padding: '10px 15px',
+                    borderRadius: '15px',
+                    maxWidth: '80%'
+                }, children: "Thinking..." })), _jsx("div", { ref: messagesEndRef })] }));
+};

package/dist/components/ui/ModelSelector.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const ModelSelector: React.FC;
+//# sourceMappingURL=ModelSelector.d.ts.map

package/dist/components/ui/ModelSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelSelector.d.ts","sourceRoot":"","sources":["../../../src/components/ui/ModelSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAkHjC,CAAC"}

package/dist/components/ui/ModelSelector.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useChatBot } from '../context/ChatBotContext';
+export const ModelSelector = () => {
+    const { availableModels, selectedModelIndex, showModelSelector, handleModelChange } = useChatBot();
+    const [anchorEl, setAnchorEl] = React.useState(null);
+    const open = Boolean(anchorEl);
+    const handleClick = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleMenuItemClick = (event, index) => {
+        handleModelChange(index);
+        setAnchorEl(null);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+    if (!showModelSelector) {
+        return null;
+    }
+    return (_jsxs("div", { style: { display: 'flex', alignItems: 'center' }, children: [_jsxs("div", { style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    cursor: 'pointer',
+                    padding: '4px 8px',
+                    borderRadius: '4px',
+                    backgroundColor: 'rgba(255, 255, 255, 0.1)',
+                    transition: 'background-color 0.2s',
+                    fontSize: '12px',
+                    fontWeight: '500'
+                }, onClick: handleClick, onMouseOver: (e) => e.currentTarget.style.backgroundColor = 'rgba(255, 255, 255, 0.2)', onMouseOut: (e) => e.currentTarget.style.backgroundColor = 'rgba(255, 255, 255, 0.1)', title: "Change AI Model", children: [_jsx("span", { style: { marginRight: '4px' }, children: availableModels[selectedModelIndex]?.label || 'Nova' }), _jsx("span", { style: { fontSize: '10px' }, children: "\u25BC" })] }), open && (_jsx("div", { style: {
+                    position: 'absolute',
+                    top: '100%',
+                    left: '0',
+                    backgroundColor: 'white',
+                    border: '1px solid #ddd',
+                    borderRadius: '4px',
+                    boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
+                    zIndex: 1000,
+                    minWidth: '120px',
+                    marginTop: '4px'
+                }, children: availableModels.map((model, index) => (_jsx("div", { style: {
+                        padding: '8px 12px',
+                        cursor: 'pointer',
+                        backgroundColor: index === selectedModelIndex ? '#f0f0f0' : 'transparent',
+                        color: index === selectedModelIndex ? '#007bff' : '#333',
+                        fontSize: '12px',
+                        borderBottom: index < availableModels.length - 1 ? '1px solid #eee' : 'none'
+                    }, onClick: (event) => handleMenuItemClick(event, index), onMouseOver: (e) => {
+                        if (index !== selectedModelIndex) {
+                            e.currentTarget.style.backgroundColor = '#f8f9fa';
+                        }
+                    }, onMouseOut: (e) => {
+                        if (index !== selectedModelIndex) {
+                            e.currentTarget.style.backgroundColor = 'transparent';
+                        }
+                    }, children: model.label }, model.value))) })), open && (_jsx("div", { style: {
+                    position: 'fixed',
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    bottom: 0,
+                    zIndex: 999
+                }, onClick: handleClose }))] }));
+};

package/dist/components/ui/NotificationModal.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+interface NotificationModalProps {
+    type: 'success' | 'error' | 'info' | 'warning';
+    title: string;
+    message: string;
+    onClose: () => void;
+    onConfirm?: () => void;
+    showConfirm?: boolean;
+    confirmText?: string;
+    cancelText?: string;
+}
+export declare const NotificationModal: React.FC<NotificationModalProps>;
+export {};
+//# sourceMappingURL=NotificationModal.d.ts.map

package/dist/components/ui/NotificationModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationModal.d.ts","sourceRoot":"","sources":["../../../src/components/ui/NotificationModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,UAAU,sBAAsB;IAC9B,IAAI,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA0H9D,CAAC"}

package/dist/components/ui/NotificationModal.js

@@ -0,0 +1,79 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createNotification, getNotificationIcon } from '../../core/utils/notificationUtils';
+export const NotificationModal = ({ type, title, message, onClose, onConfirm, showConfirm = false, confirmText = 'Confirm', cancelText = 'Cancel' }) => {
+    const icon = getNotificationIcon(type);
+    const notification = createNotification(type, message);
+    return (_jsx("div", { style: {
+            position: 'fixed',
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            zIndex: 1000
+        }, children: _jsxs("div", { style: {
+                backgroundColor: 'white',
+                padding: '24px',
+                borderRadius: '12px',
+                width: '400px',
+                maxWidth: '90%',
+                boxShadow: '0 4px 12px rgba(0, 0, 0, 0.1)',
+                textAlign: 'center'
+            }, children: [_jsx("div", { style: {
+                        fontSize: '48px',
+                        marginBottom: '16px'
+                    }, children: icon }), _jsx("h3", { style: {
+                        margin: '0 0 12px 0',
+                        fontSize: '20px',
+                        fontWeight: '600',
+                        color: '#1a1a1a'
+                    }, children: title }), _jsx("p", { style: {
+                        margin: '0 0 24px 0',
+                        fontSize: '16px',
+                        color: '#666',
+                        lineHeight: '1.5'
+                    }, children: message }), _jsxs("div", { style: {
+                        display: 'flex',
+                        justifyContent: 'center',
+                        gap: '12px'
+                    }, children: [showConfirm && onConfirm && (_jsx("button", { onClick: onConfirm, style: {
+                                padding: '10px 20px',
+                                backgroundColor: type === 'error' ? '#dc3545' : '#007bff',
+                                color: 'white',
+                                border: 'none',
+                                borderRadius: '8px',
+                                cursor: 'pointer',
+                                fontSize: '14px',
+                                fontWeight: '500',
+                                transition: 'background-color 0.2s'
+                            }, onMouseOver: (e) => e.currentTarget.style.backgroundColor = type === 'error' ? '#c82333' : '#0056b3', onMouseOut: (e) => e.currentTarget.style.backgroundColor = type === 'error' ? '#dc3545' : '#007bff', children: confirmText })), _jsx("button", { onClick: onClose, style: {
+                                padding: '10px 20px',
+                                backgroundColor: showConfirm ? '#f8f9fa' : '#007bff',
+                                color: showConfirm ? '#666' : 'white',
+                                border: showConfirm ? '1px solid #dee2e6' : 'none',
+                                borderRadius: '8px',
+                                cursor: 'pointer',
+                                fontSize: '14px',
+                                fontWeight: '500',
+                                transition: 'all 0.2s'
+                            }, onMouseOver: (e) => {
+                                if (showConfirm) {
+                                    e.currentTarget.style.backgroundColor = '#e9ecef';
+                                    e.currentTarget.style.borderColor = '#ced4da';
+                                }
+                                else {
+                                    e.currentTarget.style.backgroundColor = '#0056b3';
+                                }
+                            }, onMouseOut: (e) => {
+                                if (showConfirm) {
+                                    e.currentTarget.style.backgroundColor = '#f8f9fa';
+                                    e.currentTarget.style.borderColor = '#dee2e6';
+                                }
+                                else {
+                                    e.currentTarget.style.backgroundColor = '#007bff';
+                                }
+                            }, children: cancelText })] })] }) }));
+};

package/dist/components/ui/PermissionForm.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+interface PermissionFormProps {
+    onClose: () => void;
+    onOpen: () => void;
+}
+export declare const PermissionForm: React.FC<PermissionFormProps>;
+export {};
+//# sourceMappingURL=PermissionForm.d.ts.map

package/dist/components/ui/PermissionForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionForm.d.ts","sourceRoot":"","sources":["../../../src/components/ui/PermissionForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,UAAU,mBAAmB;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAwcxD,CAAC"}