@ai12z/react 3.3.1-alpha.0 → 3.3.1-alpha.2

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 (19) hide show
  1. package/dist/components/stencil-generated/index.js +3 -0
  2. package/dist/global.css +20 -13
  3. package/dist/themes/theme-amber.css +45 -0
  4. package/dist/themes/theme-blue.css +45 -0
  5. package/dist/themes/theme-brown.css +45 -0
  6. package/dist/themes/theme-cyan.css +45 -0
  7. package/dist/themes/theme-default.css +45 -0
  8. package/dist/themes/theme-indigo.css +45 -0
  9. package/dist/themes/theme-lime.css +45 -0
  10. package/dist/themes/theme-orange.css +45 -0
  11. package/dist/themes/theme-pink.css +45 -0
  12. package/dist/themes/theme-purple.css +45 -0
  13. package/dist/themes/theme-red.css +45 -0
  14. package/dist/themes/theme-rose.css +45 -0
  15. package/dist/themes/theme-sky.css +45 -0
  16. package/dist/themes/theme-slate.css +45 -0
  17. package/dist/themes/theme-yellow.css +45 -0
  18. package/dist/types/components/stencil-generated/index.d.ts +3 -0
  19. package/package.json +3 -3
package/dist/components/stencil-generated/index.js CHANGED
@@ -14,11 +14,14 @@ export const Ai12zSearchPanel = createReactComponent('ai12z-search-panel');
14
14
  export const Ai12zSpinner = createReactComponent('ai12z-spinner');
15
15
  export const AudioRecorder = createReactComponent('audio-recorder');
16
16
  export const BotPopover = createReactComponent('bot-popover');
17
+ export const ChatAvatar = createReactComponent('chat-avatar');
17
18
  export const ChatbotHistory = createReactComponent('chatbot-history');
18
19
  export const ChatbotWelcome = createReactComponent('chatbot-welcome');
19
20
  export const DynamicForm = createReactComponent('dynamic-form');
20
21
  export const ImageUploader = createReactComponent('image-uploader');
21
22
  export const ItemList = createReactComponent('item-list');
22
23
  export const ListData = createReactComponent('list-data');
24
+ export const LiveAgentChat = createReactComponent('live-agent-chat');
23
25
  export const PrivacyModal = createReactComponent('privacy-modal');
24
26
  export const SearchResultsPage = createReactComponent('search-results-page');
27
+ export const TypingIndicator = createReactComponent('typing-indicator');
package/dist/global.css CHANGED
@@ -84,29 +84,32 @@
84
84
  --ai12z-bot-followup-color: rgb(107 114 128);
85
85
  --ai12z-bot-privacy-color: #64748b;
86
86
 
87
+ /* --ai12zBot-v2-primary-color: #2095ae;
88
+ --ai12zBot-v2-secondary-color: #fff;
89
+
87
90
  --ai12zBot-v2-privacy-text-color: #000;
88
91
  --ai12zBot-v2-privacy-text-font-size: 16px;
89
92
  --ai12zBot-v2-privacy-link-color: #fff;
90
93
  --ai12zBot-v2-privacy-link-font-size: 16px;
91
94
 
92
- --ai12zBot-v2-back-button-color: #2095ae;
93
- --ai12zBot-v2-title-color: #2095ae;
95
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
96
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
94
97
  --ai12zBot-v2-title-font-size: 20px;
95
98
  --ai12zBot-v2-bot-name-color: #fff;
96
99
  --ai12zBot-v2-bot-name-font-weight: 500;
97
- --ai12zBot-v2-link-color: #2095ae;
98
- --ai12zBot-v2-link-hover-color: #2095ae;
99
- --ai12zBot-v2-toolbar-icon-color: #2095ae;
100
- --ai12zBot-v2-dropdown-bgcolor: #2095ae;
100
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
101
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
102
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
103
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
101
104
  --ai12zBot-v2-dropdown-font-color: #fff;
102
- --ai12zBot-v2-searchbar-border-color: #2095ae;
103
- --ai12zBot-v2-searchbar-submit-bgcolor: #2095ae;
105
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
106
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
104
107
  --ai12zBot-v2-searchbar-submit-color: #fff;
105
- --ai12zBot-v2-searchbar-mic-color: #2095ae;
106
- --ai12zBot-v2-searchbar-plus-icon-color: #2095ae;
107
- --ai12zBot-v2-default-avatar-color: #2095ae;
108
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
109
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
110
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
108
111
  --ai12zBot-v2-content-background: linear-gradient(190.82deg, #00ffd8 -69.57%, #2fd0b7 95.11%);
109
- --ai12zBot-v2-user-bubble-background: #2095ae;
112
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
110
113
  --ai12zBot-v2-user-bubble-font-color: #fff;
111
114
  --ai12zBot-v2-timestamp-font-color: #888;
112
115
  --ai12zBot-v2-timestamp-font-size: 12px;
@@ -119,5 +122,9 @@
119
122
  rgb(255, 255, 255) 28.3%,
120
123
  rgb(230, 247, 251) 89.69%,
121
124
  rgb(192, 225, 235) 101.94%
122
- );
125
+ ); */
123
126
  }
127
+ /* .theme-brown {
128
+ --ai12zBot-v2-primary-color: #8b5e3c;
129
+ --ai12zBot-v2-secondary-color: #f3e8dc;
130
+ } */
package/dist/themes/theme-amber.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #f59e0b;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #e4c28b -69.57%, #f3d7a7 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #eed3ae);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.86 0.1 78.64));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(218 190 96) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(230 210 147) 89.69%,
43
+ rgb(250 234 201 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-blue.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #4a90e2;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #0095ff -69.57%, #2f85d0 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #b8cff2);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(67.455% 0.13448 246.326));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(94 111 176) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(197 205 222) 89.69%,
43
+ rgb(132 135 173) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-brown.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #8b5e3c;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #dca54c -69.57%, #e6b479 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #e3cba7);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.82 0.06 75.53));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(191 142 89) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(226 191 148) 89.69%,
43
+ rgb(231 191 137 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-cyan.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: cyan;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #a8e6df -69.57%, #73e0e8 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #c0ecf3);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.9 0.09 199.66));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(122 217 222) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(137 199 209) 89.69%,
43
+ rgb(179 222 215 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-default.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #2095ae;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #00ffd8 -69.57%, #2fd0b7 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.85 0.09 202.36));
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.64 0.11 202.5));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(32, 149, 174) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(230, 247, 251) 89.69%,
43
+ rgb(192, 225, 235) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-indigo.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: indigo;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #b977d4 -69.57%, #8f4ab1 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #af7dcf);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.69 0.17 309.48));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(115 10 165) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(193 137 209) 89.69%,
43
+ rgb(226 140 251 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-lime.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #84cc16;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #7df694 -69.57%, #c2f3cc 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #d8eea3);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.88 0.15 136.36));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(178 251 167) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(203 238 201) 89.69%,
43
+ rgb(181 226 198 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-orange.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #e2a84a;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #df8e2a -69.57%, #d79752 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #e5cfb0);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.83 0.11 91.15));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(218 172 108) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(235 215 196) 89.69%,
43
+ rgb(228 194 146) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-pink.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #c472d6;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #ef79d0 -69.57%, #f29bee 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #eebeee);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.75 0.09 310.93));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(210 159 216) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(228 174 244) 89.69%,
43
+ rgb(231 187 244 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-purple.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #7276e5;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #cd92ea -69.57%, #b090e2 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #d8beee);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.75 0.09 310.93));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(152 125 220) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(216 201 236) 89.69%,
43
+ rgb(221 214 231 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-red.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #f86a6f;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #f26993 -69.57%, #dd5555 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #edc2c2);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.75 0.15 19.47));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(176 94 119) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(222 197 206) 89.69%,
43
+ rgb(173 132 132) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-rose.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #f43f5e;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #e46565 -69.57%, #f79595 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #f7a5b0);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.79 0.1 18.1));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(235 134 155) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(219 186 192) 89.69%,
43
+ rgb(243 225 228 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-sky.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #0ea5e9;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #8dc2e3 -69.57%, #a7cde7 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #bdeffb);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.85 0.08 222.96));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(148 224 247) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(156 209 222) 89.69%,
43
+ rgb(196 235 244 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-slate.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #64748b;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #9ba8d4 -69.57%, #abc6e0 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #a199b1);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.79 0.04 259.8));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(108 123 168) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(183 197 232) 89.69%,
43
+ rgb(208 198 242 / 78%) 101.94%
44
+ );
45
+ }
package/dist/themes/theme-yellow.css ADDED
@@ -0,0 +1,45 @@
1
+ :root {
2
+ --ai12zBot-v2-primary-color: #dde572;
3
+ --ai12zBot-v2-secondary-color: #fff;
4
+ --ai12zBot-v2-font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
5
+ --ai12zBot-v2-font-size: 1rem;
6
+
7
+ --ai12zBot-v2-privacy-text-color: #000;
8
+ --ai12zBot-v2-privacy-text-font-size: 16px;
9
+ --ai12zBot-v2-privacy-link-color: var(--ai12zBot-v2-secondary-color);
10
+ --ai12zBot-v2-privacy-link-font-size: 16px;
11
+
12
+ --ai12zBot-v2-back-button-color: var(--ai12zBot-v2-primary-color);
13
+ --ai12zBot-v2-title-color: var(--ai12zBot-v2-primary-color);
14
+ --ai12zBot-v2-title-font-size: 20px;
15
+ --ai12zBot-v2-bot-name-color: var(--ai12zBot-v2-secondary-color);
16
+ --ai12zBot-v2-bot-name-font-weight: 500;
17
+ --ai12zBot-v2-link-color: var(--ai12zBot-v2-primary-color);
18
+ --ai12zBot-v2-link-hover-color: var(--ai12zBot-v2-primary-color);
19
+ --ai12zBot-v2-toolbar-icon-color: var(--ai12zBot-v2-primary-color);
20
+ --ai12zBot-v2-dropdown-bgcolor: var(--ai12zBot-v2-primary-color);
21
+ --ai12zBot-v2-dropdown-font-color: var(--ai12zBot-v2-secondary-color);
22
+ --ai12zBot-v2-searchbar-border-color: var(--ai12zBot-v2-primary-color);
23
+ --ai12zBot-v2-searchbar-submit-bgcolor: var(--ai12zBot-v2-primary-color);
24
+ --ai12zBot-v2-searchbar-submit-color: var(--ai12zBot-v2-secondary-color);
25
+ --ai12zBot-v2-searchbar-mic-color: var(--ai12zBot-v2-primary-color);
26
+ --ai12zBot-v2-searchbar-plus-icon-color: var(--ai12zBot-v2-primary-color);
27
+ --ai12zBot-v2-default-avatar-color: var(--ai12zBot-v2-primary-color);
28
+ --ai12zBot-v2-content-background: linear-gradient(190.82deg, #bec045 -69.57%, #c9c34b 95.11%);
29
+ --ai12zBot-v2-user-bubble-background: var(--ai12zBot-v2-primary-color);
30
+ --ai12zBot-v2-user-bubble-font-color: var(--ai12zBot-v2-secondary-color);
31
+ --ai12zBot-v2-button-background: var(--ai12zBot-v2-primary-color);
32
+ --ai12zBot-v2-button-font-color: var(--ai12zBot-v2-secondary-color);
33
+ --ai12zBot-v2-timestamp-font-color: #888;
34
+ --ai12zBot-v2-timestamp-font-size: 12px;
35
+ --ai12zBot-v2-searchbar-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), #eee4be);
36
+ --ai12zBot-v2-fab-button-background: linear-gradient(to right, var(--ai12zBot-v2-primary-color), oklch(0.87 0.15 111.39));
37
+ --ai12zBot-v2-modal-backgroundImage: linear-gradient(
38
+ 248.35deg,
39
+ rgb(208 214 78) -11.3%,
40
+ rgb(244, 244, 254) 16.44%,
41
+ rgb(255, 255, 255) 28.3%,
42
+ rgb(223 232 164) 89.69%,
43
+ rgb(196 199 117) 101.94%
44
+ );
45
+ }
package/dist/types/components/stencil-generated/index.d.ts CHANGED
@@ -12,11 +12,14 @@ export declare const Ai12zSearchPanel: import("react").ForwardRefExoticComponent
12
12
  export declare const Ai12zSpinner: import("react").ForwardRefExoticComponent<JSX.Ai12zSpinner & Omit<import("react").HTMLAttributes<HTMLAi12zSpinnerElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLAi12zSpinnerElement>>;
13
13
  export declare const AudioRecorder: import("react").ForwardRefExoticComponent<JSX.AudioRecorder & Omit<import("react").HTMLAttributes<HTMLAudioRecorderElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLAudioRecorderElement>>;
14
14
  export declare const BotPopover: import("react").ForwardRefExoticComponent<JSX.BotPopover & Omit<import("react").HTMLAttributes<HTMLBotPopoverElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLBotPopoverElement>>;
15
+ export declare const ChatAvatar: import("react").ForwardRefExoticComponent<JSX.ChatAvatar & Omit<import("react").HTMLAttributes<HTMLChatAvatarElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLChatAvatarElement>>;
15
16
  export declare const ChatbotHistory: import("react").ForwardRefExoticComponent<JSX.ChatbotHistory & Omit<import("react").HTMLAttributes<HTMLChatbotHistoryElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLChatbotHistoryElement>>;
16
17
  export declare const ChatbotWelcome: import("react").ForwardRefExoticComponent<JSX.ChatbotWelcome & Omit<import("react").HTMLAttributes<HTMLChatbotWelcomeElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLChatbotWelcomeElement>>;
17
18
  export declare const DynamicForm: import("react").ForwardRefExoticComponent<JSX.DynamicForm & Omit<import("react").HTMLAttributes<HTMLDynamicFormElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLDynamicFormElement>>;
18
19
  export declare const ImageUploader: import("react").ForwardRefExoticComponent<JSX.ImageUploader & Omit<import("react").HTMLAttributes<HTMLImageUploaderElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLImageUploaderElement>>;
19
20
  export declare const ItemList: import("react").ForwardRefExoticComponent<JSX.ItemList & Omit<import("react").HTMLAttributes<HTMLItemListElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLItemListElement>>;
20
21
  export declare const ListData: import("react").ForwardRefExoticComponent<JSX.ListData & Omit<import("react").HTMLAttributes<HTMLListDataElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLListDataElement>>;
22
+ export declare const LiveAgentChat: import("react").ForwardRefExoticComponent<JSX.LiveAgentChat & Omit<import("react").HTMLAttributes<HTMLLiveAgentChatElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLLiveAgentChatElement>>;
21
23
  export declare const PrivacyModal: import("react").ForwardRefExoticComponent<JSX.PrivacyModal & Omit<import("react").HTMLAttributes<HTMLPrivacyModalElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLPrivacyModalElement>>;
22
24
  export declare const SearchResultsPage: import("react").ForwardRefExoticComponent<JSX.SearchResultsPage & Omit<import("react").HTMLAttributes<HTMLSearchResultsPageElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLSearchResultsPageElement>>;
25
+ export declare const TypingIndicator: import("react").ForwardRefExoticComponent<JSX.TypingIndicator & Omit<import("react").HTMLAttributes<HTMLTypingIndicatorElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLTypingIndicatorElement>>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ai12z/react",
3
- "version": "3.3.1-alpha.0",
3
+ "version": "3.3.1-alpha.2",
4
4
  "description": "ai12z React Library",
5
5
  "author": "Alpesh Patel <alpesh@ai12z.com>",
6
6
  "homepage": "",
@@ -20,7 +20,7 @@
20
20
  "tsc": "tsc -p . --outDir ./dist"
21
21
  },
22
22
  "dependencies": {
23
- "ai12z": "^3.3.1-alpha.0"
23
+ "ai12z": "^3.3.1-alpha.2"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@types/react": "^18.2.55",
@@ -31,5 +31,5 @@
31
31
  "publishConfig": {
32
32
  "access": "public"
33
33
  },
34
- "gitHead": "d86cbefba42d0fc6ea4b1e7748ebfc6aca9aa3ed"
34
+ "gitHead": "ffdba6cdf7ecc7db7bcd17226da1c684b75fc3b5"
35
35
  }