@nuraly/lumenui 0.1.0 → 0.2.2

package/dist/src/components/canvas/canvas.constants.d.ts

@@ -24,7 +24,7 @@ export declare const TABLE_MIN_HEIGHT = 120;
 export declare const VIEWPORT_ADD_NODE_OFFSET_X = 400;
 export declare const VIEWPORT_ADD_NODE_OFFSET_Y = 200;
 export declare const TRIGGER_POLL_INTERVAL_MS = 10000;
-export declare const PERSISTENT_TRIGGER_TYPE_NAMES: readonly ["TELEGRAM_BOT", "SLACK_SOCKET", "DISCORD_BOT", "WHATSAPP_WEBHOOK", "CUSTOM_WEBSOCKET"];
+export declare const PERSISTENT_TRIGGER_TYPE_NAMES: readonly ["TELEGRAM_BOT", "SLACK_SOCKET", "DISCORD_BOT", "WHATSAPP_WEBHOOK", "CUSTOM_WEBSOCKET", "RABBITMQ_TRIGGER", "CALENDLY_TRIGGER", "KAFKA_TRIGGER"];
 export declare const FILL_COLOR_PRESETS: readonly ["#fef08a", "#bbf7d0", "#bfdbfe", "#fecaca", "#e9d5ff", "#fed7aa", "#ffffff", "#f3f4f6"];
 export declare const BORDER_COLOR_PRESETS: readonly ["#8b5cf6", "#3b82f6", "#ef4444", "#22c55e", "#f59e0b", "#6b7280", "#1a1a1a", "#e5e7eb"];
 export declare const TEXT_COLOR_PRESETS: readonly ["#1a1a1a", "#374151", "#713f12", "#1e3a5f", "#7f1d1d", "#4c1d95", "#ffffff"];

package/dist/src/components/canvas/canvas.constants.js

@@ -30,7 +30,7 @@ export const VIEWPORT_ADD_NODE_OFFSET_Y = 200;
 // ==================== Trigger Polling ====================
 export const TRIGGER_POLL_INTERVAL_MS = 10000;
 export const PERSISTENT_TRIGGER_TYPE_NAMES = [
-    'TELEGRAM_BOT', 'SLACK_SOCKET', 'DISCORD_BOT', 'WHATSAPP_WEBHOOK', 'CUSTOM_WEBSOCKET',
+    'TELEGRAM_BOT', 'SLACK_SOCKET', 'DISCORD_BOT', 'WHATSAPP_WEBHOOK', 'CUSTOM_WEBSOCKET', 'RABBITMQ_TRIGGER', 'CALENDLY_TRIGGER', 'KAFKA_TRIGGER',
 ];
 // ==================== Color Presets ====================
 export const FILL_COLOR_PRESETS = [

package/dist/src/components/canvas/chatbot-panel.style.js

@@ -22,61 +22,67 @@ export const chatbotPanelStyles = css `
     z-index: 999;
     display: flex;
     flex-direction: column;
-    background: var(--nuraly-color-layer-01, #ffffff);
-    border-left: 1px solid var(--nuraly-color-border-subtle, #e0e0e0);
-    box-shadow: var(--nuraly-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.15));
-    animation: chatbot-panel-slide-in 0.2s ease-out;
+    background: #fff;
+    border-left: 1px solid #e0e0e8;
+    border-radius: 14px 0 0 14px;
+    box-shadow: -8px 0 32px rgba(0,0,0,0.10);
+    animation: chatbot-panel-slide-in 0.18s ease-out;
     /* Override canvas touch-action:none so inputs/scrolling work on mobile */
     touch-action: auto;
+    overflow: hidden;
   }
 
   @keyframes chatbot-panel-slide-in {
-    from { transform: translateX(100%); }
-    to { transform: translateX(0); }
+    from { transform: translateX(100%); opacity: 0; }
+    to { transform: translateX(0); opacity: 1; }
   }
 
   .chatbot-panel-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: var(--nuraly-spacing-2, 8px) var(--nuraly-spacing-3, 12px);
-    border-bottom: 1px solid var(--nuraly-color-border-subtle, #e0e0e0);
-    background: var(--nuraly-color-layer-02, #f8f8f8);
+    padding: 10px 12px;
+    border-bottom: 1px solid #e0e0e8;
+    background: #fff;
     flex-shrink: 0;
+    gap: 8px;
   }
 
   .chatbot-panel-title {
     display: flex;
     align-items: center;
-    gap: var(--nuraly-spacing-2, 8px);
-    font-family: var(--nuraly-font-family);
-    font-size: var(--nuraly-font-size-sm, 13px);
-    font-weight: var(--nuraly-font-weight-semibold, 600);
-    color: var(--nuraly-color-text-primary, #161616);
+    gap: 8px;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+    font-size: 13px;
+    font-weight: 600;
+    color: #0f0f3c;
   }
 
   .chatbot-panel-title nr-icon {
-    color: var(--nuraly-color-interactive, #3b82f6);
+    color: #7c3aed;
   }
 
   .chatbot-panel-close {
-    background: none;
+    width: 22px;
+    height: 22px;
+    padding: 0;
+    box-sizing: border-box;
+    border-radius: 50%;
     border: none;
-    color: var(--nuraly-color-text-secondary, #888);
+    background: #f5f5f8;
     cursor: pointer;
-    padding: var(--nuraly-spacing-1, 4px);
-    min-width: 44px;
-    min-height: 44px;
     display: flex;
     align-items: center;
     justify-content: center;
-    border-radius: var(--nuraly-border-radius-small, 4px);
-    transition: all var(--nuraly-transition-fast, 0.15s) ease;
+    color: #8c8ca8;
+    flex-shrink: 0;
+    transition: background 150ms;
+    line-height: 0;
   }
 
   .chatbot-panel-close:hover {
-    color: var(--nuraly-color-text-primary, #161616);
-    background: var(--nuraly-color-layer-hover-01, rgba(0, 0, 0, 0.05));
+    background: #e0e0e8;
+    color: #0f0f3c;
   }
 
   .chatbot-panel-content {
@@ -97,13 +103,14 @@ export const chatbotPanelStyles = css `
     --chatbot-min-height: 100%;
     --nuraly-size-chatbot-min-width: 0;
     --nuraly-size-chatbot-container-min-width: 0;
-    --nuraly-size-chatbot-input-min-width: 0;
-    --nuraly-size-chatbot-actions-min-width: 0;
-    --nuraly-spacing-05: 6px;
-    --nuraly-spacing-06: 8px;
-    --nuraly-border-radius-md: 8px;
-    --nuraly-border-width-chatbot-input: 1px;
-    --nuraly-color-chatbot-border: transparent;
+    --chatbot-radius: 12px;
+  }
+
+  .chatbot-panel-content nr-chatbot::part(input-container) {
+    border-radius: 20px;
+    border: 1px solid #e0e0e8;
+    background: #f5f5f8;
+    box-shadow: none;
   }
 
   .toolbar-btn {
@@ -117,7 +124,7 @@ export const chatbotPanelStyles = css `
     width: 16px;
     height: 16px;
     border-radius: 50%;
-    background: var(--nuraly-color-support-error, #da1e28);
+    background: #da1e28;
     color: #fff;
     font-size: 10px;
     font-weight: 600;
@@ -127,56 +134,40 @@ export const chatbotPanelStyles = css `
     line-height: 1;
   }
 
-  /* Light theme for chatbot panel */
-  .chatbot-panel[data-theme="light"],
-  .chatbot-panel[data-theme="carbon-light"],
-  .chatbot-panel[data-theme="default-light"],
-  .chatbot-panel[data-theme="default"] {
-    background: var(--nuraly-color-layer-01, #ffffff);
-    border-color: var(--nuraly-color-border-subtle, #e0e0e0);
-  }
-
-  .chatbot-panel[data-theme="light"] .chatbot-panel-header,
-  .chatbot-panel[data-theme="carbon-light"] .chatbot-panel-header,
-  .chatbot-panel[data-theme="default-light"] .chatbot-panel-header,
-  .chatbot-panel[data-theme="default"] .chatbot-panel-header {
-    background: var(--nuraly-color-layer-02, #f4f4f4);
-    border-color: var(--nuraly-color-border-subtle, #e0e0e0);
-  }
-
-  .chatbot-panel[data-theme="light"] .chatbot-panel-title,
-  .chatbot-panel[data-theme="carbon-light"] .chatbot-panel-title,
-  .chatbot-panel[data-theme="default-light"] .chatbot-panel-title,
-  .chatbot-panel[data-theme="default"] .chatbot-panel-title {
-    color: var(--nuraly-color-text-primary, #161616);
-  }
-
   /* Dark theme for chatbot panel */
   .chatbot-panel[data-theme="dark"],
   .chatbot-panel[data-theme="carbon-dark"],
   .chatbot-panel[data-theme="default-dark"] {
-    background: var(--nuraly-color-layer-01, #262626);
-    border-color: var(--nuraly-color-border-subtle, #393939);
+    background: #1a1a2e;
+    border-color: #2d2d4a;
+    box-shadow: -8px 0 32px rgba(0,0,0,0.30);
   }
 
   .chatbot-panel[data-theme="dark"] .chatbot-panel-header,
   .chatbot-panel[data-theme="carbon-dark"] .chatbot-panel-header,
   .chatbot-panel[data-theme="default-dark"] .chatbot-panel-header {
-    background: var(--nuraly-color-layer-02, #333333);
-    border-color: var(--nuraly-color-border-subtle, #393939);
+    background: #1a1a2e;
+    border-color: #2d2d4a;
   }
 
   .chatbot-panel[data-theme="dark"] .chatbot-panel-title,
   .chatbot-panel[data-theme="carbon-dark"] .chatbot-panel-title,
   .chatbot-panel[data-theme="default-dark"] .chatbot-panel-title {
-    color: var(--nuraly-color-text-primary, #e5e5e5);
+    color: #f0f0ff;
+  }
+
+  .chatbot-panel[data-theme="dark"] .chatbot-panel-close,
+  .chatbot-panel[data-theme="carbon-dark"] .chatbot-panel-close,
+  .chatbot-panel[data-theme="default-dark"] .chatbot-panel-close {
+    background: #2d2d4a;
+    color: #8c8ca8;
   }
 
   .chatbot-panel[data-theme="dark"] .chatbot-panel-close:hover,
   .chatbot-panel[data-theme="carbon-dark"] .chatbot-panel-close:hover,
   .chatbot-panel[data-theme="default-dark"] .chatbot-panel-close:hover {
-    color: var(--nuraly-color-text-primary, #e5e5e5);
-    background: var(--nuraly-color-layer-hover-01, rgba(255, 255, 255, 0.1));
+    background: #3d3d5a;
+    color: #f0f0ff;
   }
 
   /* Mobile: chatbot panel full-screen */

package/dist/src/components/canvas/chatbot-trigger/chatbot-trigger-fields.component.d.ts

@@ -0,0 +1,115 @@
+/**
+ * @license
+ * Copyright 2024 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { LitElement } from 'lit';
+import { ChatbotTriggerEvent, SuggestionConfig, ChatbotTriggerSize, ChatbotTriggerVariant, ChatbotTriggerLoadingType } from './chatbot-trigger.types.js';
+declare const TriggerEventSelectComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Trigger Event Selector Component
+ * Multi-select for choosing trigger events
+ */
+export declare class TriggerEventSelectComponent extends TriggerEventSelectComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    requiredComponents: string[];
+    value: ChatbotTriggerEvent[];
+    disabled: boolean;
+    label: string;
+    description: string;
+    private toggleEvent;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare const ChatbotSizeSelectComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Chatbot Size Selector Component
+ */
+export declare class ChatbotSizeSelectComponent extends ChatbotSizeSelectComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    requiredComponents: string[];
+    value: ChatbotTriggerSize;
+    disabled: boolean;
+    label: string;
+    private sizes;
+    private selectSize;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare const ChatbotVariantSelectComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Chatbot Variant Selector Component
+ */
+export declare class ChatbotVariantSelectComponent extends ChatbotVariantSelectComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    requiredComponents: string[];
+    value: ChatbotTriggerVariant;
+    disabled: boolean;
+    label: string;
+    private variants;
+    private selectVariant;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare const FeatureToggleComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Feature Toggle Component
+ */
+export declare class FeatureToggleComponent extends FeatureToggleComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    value: boolean;
+    disabled: boolean;
+    label: string;
+    description: string;
+    private toggle;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare const SuggestionListComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Suggestion List Component
+ */
+export declare class SuggestionListComponent extends SuggestionListComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    requiredComponents: string[];
+    value: SuggestionConfig[];
+    disabled: boolean;
+    label: string;
+    description: string;
+    private updateValue;
+    private addSuggestion;
+    private removeSuggestion;
+    private updateSuggestion;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare const ChatbotPreviewComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Chatbot Preview Component
+ */
+export declare class ChatbotPreviewComponent extends ChatbotPreviewComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    requiredComponents: string[];
+    size: ChatbotTriggerSize;
+    variant: ChatbotTriggerVariant;
+    placeholder: string;
+    triggerEvents: ChatbotTriggerEvent[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare const LoadingTypeSelectComponent_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
+/**
+ * Loading Indicator Selector Component
+ */
+export declare class LoadingTypeSelectComponent extends LoadingTypeSelectComponent_base {
+    static useShadowDom: boolean;
+    static styles: import("lit").CSSResult;
+    requiredComponents: string[];
+    value: ChatbotTriggerLoadingType;
+    disabled: boolean;
+    label: string;
+    private handleChange;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};
+//# sourceMappingURL=chatbot-trigger-fields.component.d.ts.map