@a.izzuddin/ai-chat 0.2.3 → 0.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/README.md +166 -215
  2. package/README.npm.md +3 -3
  3. package/custom-elements.json +212 -0
  4. package/dist/index.d.mts +65 -1
  5. package/dist/index.d.ts +65 -1
  6. package/dist/index.js +417 -66
  7. package/dist/index.js.map +1 -1
  8. package/dist/index.mjs +417 -66
  9. package/dist/index.mjs.map +1 -1
  10. package/package.json +6 -1
package/custom-elements.json CHANGED
@@ -74,6 +74,11 @@
74
74
  "kind": "variable",
75
75
  "name": "faqs",
76
76
  "default": "void 0"
77
+ },
78
+ {
79
+ "kind": "variable",
80
+ "name": "suggestedQuestions",
81
+ "default": "void 0"
77
82
  }
78
83
  ],
79
84
  "exports": []
@@ -216,21 +221,59 @@
216
221
  "name": "Message",
217
222
  "module": "./components/ai-chat"
218
223
  }
224
+ },
225
+ {
226
+ "kind": "js",
227
+ "name": "FAQ",
228
+ "declaration": {
229
+ "name": "FAQ",
230
+ "module": "./components/ai-chat"
231
+ }
219
232
  }
220
233
  ]
221
234
  },
235
+ {
236
+ "kind": "javascript-module",
237
+ "path": "tests/cdn-examples.spec.ts",
238
+ "declarations": [],
239
+ "exports": []
240
+ },
222
241
  {
223
242
  "kind": "javascript-module",
224
243
  "path": "tests/chat.spec.ts",
225
244
  "declarations": [],
226
245
  "exports": []
227
246
  },
247
+ {
248
+ "kind": "javascript-module",
249
+ "path": "tests/check-widget.spec.ts",
250
+ "declarations": [],
251
+ "exports": []
252
+ },
253
+ {
254
+ "kind": "javascript-module",
255
+ "path": "tests/final-widget-test.spec.ts",
256
+ "declarations": [],
257
+ "exports": []
258
+ },
259
+ {
260
+ "kind": "javascript-module",
261
+ "path": "tests/live-server-test.spec.ts",
262
+ "declarations": [],
263
+ "exports": []
264
+ },
228
265
  {
229
266
  "kind": "javascript-module",
230
267
  "path": "tests/web-component.spec.ts",
231
268
  "declarations": [],
232
269
  "exports": []
233
270
  },
271
+ {
272
+ "kind": "javascript-module",
273
+ "path": "tests/widget-visibility.spec.ts",
274
+ "declarations": [],
275
+ "exports": []
276
+ },
234
277
  {
235
278
  "kind": "javascript-module",
236
279
  "path": "components/ui/avatar.tsx",
@@ -561,6 +604,86 @@
561
604
  "default": "[]",
562
605
  "attribute": "initialMessages"
563
606
  },
607
+ {
608
+ "kind": "field",
609
+ "name": "botAvatarUrl",
610
+ "privacy": "public",
611
+ "type": {
612
+ "text": "string"
613
+ },
614
+ "default": "''",
615
+ "attribute": "bot-avatar-url"
616
+ },
617
+ {
618
+ "kind": "field",
619
+ "name": "backgroundImageUrl",
620
+ "privacy": "public",
621
+ "type": {
622
+ "text": "string"
623
+ },
624
+ "default": "''",
625
+ "attribute": "background-image-url"
626
+ },
627
+ {
628
+ "kind": "field",
629
+ "name": "widgetWidth",
630
+ "privacy": "public",
631
+ "type": {
632
+ "text": "string"
633
+ },
634
+ "default": "'380px'",
635
+ "attribute": "widget-width"
636
+ },
637
+ {
638
+ "kind": "field",
639
+ "name": "widgetHeight",
640
+ "privacy": "public",
641
+ "type": {
642
+ "text": "string"
643
+ },
644
+ "default": "'600px'",
645
+ "attribute": "widget-height"
646
+ },
647
+ {
648
+ "kind": "field",
649
+ "name": "primaryColor",
650
+ "privacy": "public",
651
+ "type": {
652
+ "text": "string"
653
+ },
654
+ "default": "'#3681D3'",
655
+ "attribute": "primary-color"
656
+ },
657
+ {
658
+ "kind": "field",
659
+ "name": "primaryColorHover",
660
+ "privacy": "public",
661
+ "type": {
662
+ "text": "string"
663
+ },
664
+ "default": "'#3457C7'",
665
+ "attribute": "primary-color-hover"
666
+ },
667
+ {
668
+ "kind": "field",
669
+ "name": "userMessageBg",
670
+ "privacy": "public",
671
+ "type": {
672
+ "text": "string"
673
+ },
674
+ "default": "'#D6E4FF'",
675
+ "attribute": "user-message-bg"
676
+ },
677
+ {
678
+ "kind": "field",
679
+ "name": "botMessageBg",
680
+ "privacy": "public",
681
+ "type": {
682
+ "text": "string"
683
+ },
684
+ "default": "'#F5F5F5'",
685
+ "attribute": "bot-message-bg"
686
+ },
564
687
  {
565
688
  "kind": "field",
566
689
  "name": "messages",
@@ -610,6 +733,31 @@
610
733
  "name": "toggleWidget",
611
734
  "privacy": "private"
612
735
  },
736
+ {
737
+ "kind": "method",
738
+ "name": "lightenColor",
739
+ "privacy": "private",
740
+ "return": {
741
+ "type": {
742
+ "text": "string"
743
+ }
744
+ },
745
+ "parameters": [
746
+ {
747
+ "name": "hex",
748
+ "type": {
749
+ "text": "string"
750
+ }
751
+ },
752
+ {
753
+ "name": "percent",
754
+ "default": "15",
755
+ "type": {
756
+ "text": "number"
757
+ }
758
+ }
759
+ ]
760
+ },
613
761
  {
614
762
  "kind": "method",
615
763
  "name": "scrollToBottom",
@@ -731,6 +879,70 @@
731
879
  },
732
880
  "default": "[]",
733
881
  "fieldName": "initialMessages"
882
+ },
883
+ {
884
+ "name": "bot-avatar-url",
885
+ "type": {
886
+ "text": "string"
887
+ },
888
+ "default": "''",
889
+ "fieldName": "botAvatarUrl"
890
+ },
891
+ {
892
+ "name": "background-image-url",
893
+ "type": {
894
+ "text": "string"
895
+ },
896
+ "default": "''",
897
+ "fieldName": "backgroundImageUrl"
898
+ },
899
+ {
900
+ "name": "widget-width",
901
+ "type": {
902
+ "text": "string"
903
+ },
904
+ "default": "'380px'",
905
+ "fieldName": "widgetWidth"
906
+ },
907
+ {
908
+ "name": "widget-height",
909
+ "type": {
910
+ "text": "string"
911
+ },
912
+ "default": "'600px'",
913
+ "fieldName": "widgetHeight"
914
+ },
915
+ {
916
+ "name": "primary-color",
917
+ "type": {
918
+ "text": "string"
919
+ },
920
+ "default": "'#3681D3'",
921
+ "fieldName": "primaryColor"
922
+ },
923
+ {
924
+ "name": "primary-color-hover",
925
+ "type": {
926
+ "text": "string"
927
+ },
928
+ "default": "'#3457C7'",
929
+ "fieldName": "primaryColorHover"
930
+ },
931
+ {
932
+ "name": "user-message-bg",
933
+ "type": {
934
+ "text": "string"
935
+ },
936
+ "default": "'#D6E4FF'",
937
+ "fieldName": "userMessageBg"
938
+ },
939
+ {
940
+ "name": "bot-message-bg",
941
+ "type": {
942
+ "text": "string"
943
+ },
944
+ "default": "'#F5F5F5'",
945
+ "fieldName": "botMessageBg"
734
946
  }
735
947
  ],
736
948
  "superclass": {
package/dist/index.d.mts CHANGED
@@ -11,6 +11,7 @@ interface Message {
11
11
  role: 'user' | 'assistant';
12
12
  content: string;
13
13
  faqs?: FAQ[];
14
+ suggestedQuestions?: string[];
14
15
  }
15
16
  /**
16
17
  * AI Chat Web Component
@@ -21,11 +22,33 @@ interface Message {
21
22
  *
22
23
  * @example
23
24
  * ```html
25
+ * <!-- Basic usage -->
24
26
  * <ai-chat
25
27
  * api-url="https://api.example.com"
26
28
  * session-id="user-123"
27
29
  * title="My AI Assistant">
28
30
  * </ai-chat>
31
+ *
32
+ * <!-- Widget mode with custom size -->
33
+ * <ai-chat
34
+ * api-url="https://api.example.com"
35
+ * session-id="user-123"
36
+ * title="My AI Assistant"
37
+ * mode="widget"
38
+ * widget-width="400px"
39
+ * widget-height="650px">
40
+ * </ai-chat>
41
+ *
42
+ * <!-- Custom theme colors -->
43
+ * <ai-chat
44
+ * api-url="https://api.example.com"
45
+ * session-id="user-123"
46
+ * title="My AI Assistant"
47
+ * primary-color="#10B981"
48
+ * primary-color-hover="#059669"
49
+ * user-message-bg="#D1FAE5"
50
+ * bot-message-bg="#F3F4F6">
51
+ * </ai-chat>
29
52
  * ```
30
53
  */
31
54
  declare class AIChat extends LitElement {
@@ -36,6 +59,14 @@ declare class AIChat extends LitElement {
36
59
  theme: 'light' | 'dark';
37
60
  mode: 'fullscreen' | 'widget';
38
61
  initialMessages: Message[];
62
+ botAvatarUrl: string;
63
+ backgroundImageUrl: string;
64
+ widgetWidth: string;
65
+ widgetHeight: string;
66
+ primaryColor: string;
67
+ primaryColorHover: string;
68
+ userMessageBg: string;
69
+ botMessageBg: string;
39
70
  private messages;
40
71
  private input;
41
72
  private isLoading;
@@ -64,9 +95,42 @@ declare class AIChat extends LitElement {
64
95
  initialMessages: {
65
96
  type: ArrayConstructor;
66
97
  };
98
+ botAvatarUrl: {
99
+ type: StringConstructor;
100
+ attribute: string;
101
+ };
102
+ backgroundImageUrl: {
103
+ type: StringConstructor;
104
+ attribute: string;
105
+ };
106
+ widgetWidth: {
107
+ type: StringConstructor;
108
+ attribute: string;
109
+ };
110
+ widgetHeight: {
111
+ type: StringConstructor;
112
+ attribute: string;
113
+ };
114
+ primaryColor: {
115
+ type: StringConstructor;
116
+ attribute: string;
117
+ };
118
+ primaryColorHover: {
119
+ type: StringConstructor;
120
+ attribute: string;
121
+ };
122
+ userMessageBg: {
123
+ type: StringConstructor;
124
+ attribute: string;
125
+ };
126
+ botMessageBg: {
127
+ type: StringConstructor;
128
+ attribute: string;
129
+ };
67
130
  };
68
131
  constructor();
69
132
  private toggleWidget;
133
+ private lightenColor;
70
134
  connectedCallback(): void;
71
135
  updated(changedProperties: PropertyValues): void;
72
136
  private scrollToBottom;
@@ -82,4 +146,4 @@ declare global {
82
146
  }
83
147
  }
84
148
 
85
- export { AIChat, type Message };
149
+ export { AIChat, type FAQ, type Message };
package/dist/index.d.ts CHANGED
@@ -11,6 +11,7 @@ interface Message {
11
11
  role: 'user' | 'assistant';
12
12
  content: string;
13
13
  faqs?: FAQ[];
14
+ suggestedQuestions?: string[];
14
15
  }
15
16
  /**
16
17
  * AI Chat Web Component
@@ -21,11 +22,33 @@ interface Message {
21
22
  *
22
23
  * @example
23
24
  * ```html
25
+ * <!-- Basic usage -->
24
26
  * <ai-chat
25
27
  * api-url="https://api.example.com"
26
28
  * session-id="user-123"
27
29
  * title="My AI Assistant">
28
30
  * </ai-chat>
31
+ *
32
+ * <!-- Widget mode with custom size -->
33
+ * <ai-chat
34
+ * api-url="https://api.example.com"
35
+ * session-id="user-123"
36
+ * title="My AI Assistant"
37
+ * mode="widget"
38
+ * widget-width="400px"
39
+ * widget-height="650px">
40
+ * </ai-chat>
41
+ *
42
+ * <!-- Custom theme colors -->
43
+ * <ai-chat
44
+ * api-url="https://api.example.com"
45
+ * session-id="user-123"
46
+ * title="My AI Assistant"
47
+ * primary-color="#10B981"
48
+ * primary-color-hover="#059669"
49
+ * user-message-bg="#D1FAE5"
50
+ * bot-message-bg="#F3F4F6">
51
+ * </ai-chat>
29
52
  * ```
30
53
  */
31
54
  declare class AIChat extends LitElement {
@@ -36,6 +59,14 @@ declare class AIChat extends LitElement {
36
59
  theme: 'light' | 'dark';
37
60
  mode: 'fullscreen' | 'widget';
38
61
  initialMessages: Message[];
62
+ botAvatarUrl: string;
63
+ backgroundImageUrl: string;
64
+ widgetWidth: string;
65
+ widgetHeight: string;
66
+ primaryColor: string;
67
+ primaryColorHover: string;
68
+ userMessageBg: string;
69
+ botMessageBg: string;
39
70
  private messages;
40
71
  private input;
41
72
  private isLoading;
@@ -64,9 +95,42 @@ declare class AIChat extends LitElement {
64
95
  initialMessages: {
65
96
  type: ArrayConstructor;
66
97
  };
98
+ botAvatarUrl: {
99
+ type: StringConstructor;
100
+ attribute: string;
101
+ };
102
+ backgroundImageUrl: {
103
+ type: StringConstructor;
104
+ attribute: string;
105
+ };
106
+ widgetWidth: {
107
+ type: StringConstructor;
108
+ attribute: string;
109
+ };
110
+ widgetHeight: {
111
+ type: StringConstructor;
112
+ attribute: string;
113
+ };
114
+ primaryColor: {
115
+ type: StringConstructor;
116
+ attribute: string;
117
+ };
118
+ primaryColorHover: {
119
+ type: StringConstructor;
120
+ attribute: string;
121
+ };
122
+ userMessageBg: {
123
+ type: StringConstructor;
124
+ attribute: string;
125
+ };
126
+ botMessageBg: {
127
+ type: StringConstructor;
128
+ attribute: string;
129
+ };
67
130
  };
68
131
  constructor();
69
132
  private toggleWidget;
133
+ private lightenColor;
70
134
  connectedCallback(): void;
71
135
  updated(changedProperties: PropertyValues): void;
72
136
  private scrollToBottom;
@@ -82,4 +146,4 @@ declare global {
82
146
  }
83
147
  }
84
148
 
85
- export { AIChat, type Message };
149
+ export { AIChat, type FAQ, type Message };