open-chat-studio-widget 0.4.1 → 0.4.3

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 (35) hide show
  1. package/README.md +78 -9
  2. package/dist/cjs/{index-b700441a.js → index-bcb28089.js} +3 -1
  3. package/dist/cjs/index-bcb28089.js.map +1 -0
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/open-chat-studio-widget.cjs.entry.js +97 -38
  6. package/dist/cjs/open-chat-studio-widget.cjs.entry.js.map +1 -1
  7. package/dist/cjs/open-chat-studio-widget.cjs.js +2 -2
  8. package/dist/collection/components/ocs-chat/ocs-chat.css +569 -386
  9. package/dist/collection/components/ocs-chat/ocs-chat.js +105 -36
  10. package/dist/collection/components/ocs-chat/ocs-chat.js.map +1 -1
  11. package/dist/collection/utils/utils.js +30 -0
  12. package/dist/collection/utils/utils.js.map +1 -0
  13. package/dist/components/open-chat-studio-widget.js +99 -37
  14. package/dist/components/open-chat-studio-widget.js.map +1 -1
  15. package/dist/esm/{index-b188b488.js → index-205c77bc.js} +3 -2
  16. package/dist/{open-chat-studio-widget/p-a0fbe1b4.js.map → esm/index-205c77bc.js.map} +1 -1
  17. package/dist/esm/loader.js +3 -3
  18. package/dist/esm/open-chat-studio-widget.entry.js +97 -38
  19. package/dist/esm/open-chat-studio-widget.entry.js.map +1 -1
  20. package/dist/esm/open-chat-studio-widget.js +3 -3
  21. package/dist/open-chat-studio-widget/open-chat-studio-widget.esm.js +1 -1
  22. package/dist/open-chat-studio-widget/open-chat-studio-widget.esm.js.map +1 -1
  23. package/dist/open-chat-studio-widget/p-6c3059b7.entry.js +3 -0
  24. package/dist/open-chat-studio-widget/p-6c3059b7.entry.js.map +1 -0
  25. package/dist/open-chat-studio-widget/p-78d09c6b.js +3 -0
  26. package/dist/open-chat-studio-widget/p-78d09c6b.js.map +1 -0
  27. package/dist/types/components/ocs-chat/ocs-chat.d.ts +14 -3
  28. package/dist/types/components.d.ts +16 -0
  29. package/dist/types/utils/utils.d.ts +7 -0
  30. package/package.json +3 -2
  31. package/dist/cjs/index-b700441a.js.map +0 -1
  32. package/dist/esm/index-b188b488.js.map +0 -1
  33. package/dist/open-chat-studio-widget/p-a0fbe1b4.js +0 -3
  34. package/dist/open-chat-studio-widget/p-eb89e6d7.entry.js +0 -3
  35. package/dist/open-chat-studio-widget/p-eb89e6d7.entry.js.map +0 -1
package/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  A chatbot component for Open Chat Studio.
4
4
 
5
- For more information, see the [Open Chat Studio documentation](https://docs.openchatstudio.com/how-to/embed/)
5
+ For more information, see the [Open Chat Studio documentation](https://docs.openchatstudio.com/chat_widget/)
6
6
 
7
7
  <!-- Auto Generated Below -->
8
8
 
@@ -21,20 +21,89 @@ For more information, see the [Open Chat Studio documentation](https://docs.open
21
21
  | `persistentSessionExpire` | `persistent-session-expire` | Minutes since the most recent message after which the session data in local storage will expire. Set this to `0` to never expire. | `number` | `60 * 24` |
22
22
  | `position` | `position` | The initial position of the chat widget on the screen. | `"center" \| "left" \| "right"` | `'right'` |
23
23
  | `starterQuestions` | `starter-questions` | Array of starter questions that users can click to send (JSON array of strings) | `string` | `undefined` |
24
+ | `userId` | `user-id` | Used to associate chat sessions with a specific user across multiple visits/sessions | `string` | `undefined` |
25
+ | `userName` | `user-name` | Display name for the user. | `string` | `undefined` |
24
26
  | `visible` | `visible` | Whether the chat widget is visible on load. | `boolean` | `false` |
25
27
  | `welcomeMessages` | `welcome-messages` | Welcome messages to display above starter questions (JSON array of strings) | `string` | `undefined` |
26
28
 
27
29
 
28
30
  ## CSS Custom Properties
29
31
 
30
- | Name | Description |
31
- | --------------------------------- | -------------------------------- |
32
- | `--button-background-color` | Button background color |
33
- | `--button-background-color-hover` | Button background color on hover |
34
- | `--button-border-color` | Button border color |
35
- | `--button-border-color-hover` | Button border color on hover |
36
- | `--button-text-color` | Button text color |
37
- | `--button-text-color-hover` | Button text color on hover |
32
+ | Name | Description |
33
+ | --------------------------------------- | -------------------------------------------------------------------------------- |
34
+ | `--button-background-color` | Button background color (#ffffff) |
35
+ | `--button-background-color-hover` | Button background color on hover (#f3f4f6) |
36
+ | `--button-border-color` | Button border color (#6b7280) |
37
+ | `--button-border-color-hover` | Button border color on hover (#374151) |
38
+ | `--button-font-size` | Button text font size (0.875em) |
39
+ | `--button-icon-height` | Button icon height (1.5em) Chat Window Variables |
40
+ | `--button-icon-width` | Button icon width (1.5em) |
41
+ | `--button-padding` | Button padding (0.75em) |
42
+ | `--button-padding-sm` | Small button padding (0.375em) |
43
+ | `--button-text-color` | Button text color (#111827) |
44
+ | `--button-text-color-hover` | Button text color on hover (#1d4ed8) |
45
+ | `--chat-window-bg-color` | Chat window background color (#ffffff) |
46
+ | `--chat-window-border-color` | Chat window border color (#d1d5db) |
47
+ | `--chat-window-font-size` | Default font size for text in the chat window (0.875em) |
48
+ | `--chat-window-font-size-sm` | Font size for small text in the chat window (0.75em) Header Variables |
49
+ | `--chat-window-fullscreen-width` | Chat window fullscreen width in pixels or percent (80%) |
50
+ | `--chat-window-height` | Chat window height in pixels or percent (60%) |
51
+ | `--chat-window-shadow-color` | Chat window shadow color (rgba(0, 0, 0, 0.1)) |
52
+ | `--chat-window-width` | Chat window width in pixels or percent (25%) |
53
+ | `--chat-z-index` | Z-index for chat widget (50) |
54
+ | `--code-bg-assistant-color` | Code background in assistant messages (--message-assistant-bg-color + 50% white) |
55
+ | `--code-bg-user-color` | Code background in user messages (--message-user-bg-color + 20% white) |
56
+ | `--code-border-assistant-color` | Code border in assistant messages (--message-assistant-bg-color + 10% black) |
57
+ | `--code-border-user-color` | Code border in user messages (--message-user-bg-color + 20% black) |
58
+ | `--code-text-assistant-color` | Code text color in assistant messages (--message-assistant-text-color) |
59
+ | `--code-text-user-color` | Code text color in user messages (--message-user-text-color) |
60
+ | `--container-padding` | General container padding (1em) Button Variables |
61
+ | `--error-message-padding` | Error message padding (0.5em) Markdown Code Variables |
62
+ | `--error-text-color` | Error text color (#ef4444) |
63
+ | `--header-bg-color` | Header background color (transparent) |
64
+ | `--header-bg-hover-color` | Header background color on hover (#f9fafb) |
65
+ | `--header-border-color` | Header border color (#f3f4f6) |
66
+ | `--header-button-bg-hover-color` | Header button background on hover (#f3f4f6) |
67
+ | `--header-button-text-color` | Header button text color (#6b7280) |
68
+ | `--header-padding` | Header padding (0.5em) Starter Question Variables |
69
+ | `--input-bg-color` | Input area background color (transparent) |
70
+ | `--input-border-color` | Input field border color (#d1d5db) |
71
+ | `--input-outline-focus-color` | Input field focus ring color (#3b82f6) |
72
+ | `--input-placeholder-color` | Input placeholder text color (#6b7280) |
73
+ | `--input-text-color` | Input text color (#111827) |
74
+ | `--input-textarea-padding-x` | Input textarea horizontal padding (0.75em) |
75
+ | `--input-textarea-padding-y` | Input textarea vertical padding (0.5em) Send Button Variables |
76
+ | `--loading-spinner-fill-color` | Loading spinner fill color (#3b82f6) |
77
+ | `--loading-spinner-size` | Loading spinner size (1.25em) Typing Indicator Variables |
78
+ | `--loading-spinner-track-color` | Loading spinner track color (#e5e7eb) |
79
+ | `--loading-text-color` | Loading text color (#6b7280) |
80
+ | `--message-assistant-bg-color` | Assistant message background color (#e5e7eb) |
81
+ | `--message-assistant-text-color` | Assistant message text color (#1f2937) |
82
+ | `--message-padding-x` | Message horizontal padding (1em) |
83
+ | `--message-padding-y` | Message vertical padding (0.5em) Input Area Variables |
84
+ | `--message-system-bg-color` | System message background color (#f3f4f6) |
85
+ | `--message-system-text-color` | System message text color (#4b5563) |
86
+ | `--message-timestamp-assistant-color` | Assistant message timestamp color (rgba(75, 85, 99, 0.7)) |
87
+ | `--message-timestamp-color` | User message timestamp color (rgba(255, 255, 255, 0.7)) |
88
+ | `--message-user-bg-color` | User message background color (#3b82f6) |
89
+ | `--message-user-text-color` | User message text color (#ffffff) |
90
+ | `--scrollbar-thumb-color` | Scrollbar thumb color (#d1d5db) |
91
+ | `--scrollbar-thumb-hover-color` | Scrollbar thumb hover color (#9ca3af) Error Variables |
92
+ | `--scrollbar-track-color` | Scrollbar track color (#f3f4f6) |
93
+ | `--send-button-bg-color` | Send button background color (#3b82f6) |
94
+ | `--send-button-bg-disabled-color` | Send button background when disabled (#d1d5db) |
95
+ | `--send-button-bg-hover-color` | Send button background on hover (#2563eb) |
96
+ | `--send-button-padding-x` | Send button horizontal padding (1em) |
97
+ | `--send-button-padding-y` | Send button vertical padding (0.5em) Loading Variables |
98
+ | `--send-button-text-color` | Send button text color (#ffffff) |
99
+ | `--send-button-text-disabled-color` | Send button text when disabled (#6b7280) |
100
+ | `--starter-question-bg-color` | Starter question background color (transparent) |
101
+ | `--starter-question-bg-hover-color` | Starter question background on hover (#eff6ff) |
102
+ | `--starter-question-border-color` | Starter question border color (#3b82f6) |
103
+ | `--starter-question-border-hover-color` | Starter question border on hover (#2563eb) |
104
+ | `--starter-question-padding` | Starter question padding (0.75em) Message Bubble Variables |
105
+ | `--starter-question-text-color` | Starter question text color (#3b82f6) |
106
+ | `--typing-progress-bg-color` | Typing progress bar background color (#ade3ff) Scrollbar Variables |
38
107
 
39
108
 
40
109
  ----------------------------------------------
@@ -341,6 +341,7 @@ var parsePropertyValue = (propValue, propType) => {
341
341
  }
342
342
  return propValue;
343
343
  };
344
+ var getElement = (ref) => getHostRef(ref).$hostElement$ ;
344
345
  var emitEvent = (elm, name, opts) => {
345
346
  const ev = plt.ce(name, opts);
346
347
  elm.dispatchEvent(ev);
@@ -1364,9 +1365,10 @@ var setNonce = (nonce) => plt.$nonce$ = nonce;
1364
1365
 
1365
1366
  exports.Host = Host;
1366
1367
  exports.bootstrapLazy = bootstrapLazy;
1368
+ exports.getElement = getElement;
1367
1369
  exports.h = h;
1368
1370
  exports.promiseResolve = promiseResolve;
1369
1371
  exports.registerInstance = registerInstance;
1370
1372
  exports.setNonce = setNonce;
1371
1373
 
1372
- //# sourceMappingURL=index-b700441a.js.map
1374
+ //# sourceMappingURL=index-bcb28089.js.map