@inkeep/agents-ui 0.15.12 → 0.15.13

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 (46) hide show
  1. package/dist/index.cjs +1 -1
  2. package/dist/index.js +171 -169
  3. package/dist/primitives/atoms/combobox.cjs +1 -0
  4. package/dist/primitives/atoms/combobox.js +275 -0
  5. package/dist/primitives/components/embedded-chat/use-stream-processor.cjs +1 -1
  6. package/dist/primitives/components/embedded-chat/use-stream-processor.js +74 -87
  7. package/dist/primitives/components/embedded-chat.cjs +4 -4
  8. package/dist/primitives/components/embedded-chat.d.ts +22 -1
  9. package/dist/primitives/components/embedded-chat.js +1249 -1137
  10. package/dist/primitives/hooks/use-simple-scroll.cjs +1 -1
  11. package/dist/primitives/hooks/use-simple-scroll.d.ts +12 -1
  12. package/dist/primitives/hooks/use-simple-scroll.js +45 -12
  13. package/dist/primitives/providers/base-events-provider.cjs +1 -1
  14. package/dist/primitives/providers/base-events-provider.js +1 -1
  15. package/dist/primitives/utils/component-ids.cjs +1 -1
  16. package/dist/primitives/utils/component-ids.d.ts +24 -0
  17. package/dist/primitives/utils/component-ids.js +12 -0
  18. package/dist/primitives/utils/form.cjs +1 -1
  19. package/dist/primitives/utils/form.d.ts +1 -1
  20. package/dist/primitives/utils/form.js +3 -1
  21. package/dist/react/chat-button-modal.cjs +1 -0
  22. package/dist/react/chat-button-modal.d.ts +22 -0
  23. package/dist/react/chat-button-modal.js +41 -0
  24. package/dist/react/embedded-chat.cjs +1 -1
  25. package/dist/react/embedded-chat.js +210 -191
  26. package/dist/react/index.cjs +1 -1
  27. package/dist/react/index.d.ts +1 -0
  28. package/dist/react/index.js +171 -169
  29. package/dist/styled/components/embedded-chat.cjs +1 -1
  30. package/dist/styled/components/embedded-chat.d.ts +16 -1
  31. package/dist/styled/components/embedded-chat.js +686 -568
  32. package/dist/styled/components/message.cjs +1 -1
  33. package/dist/styled/components/message.js +191 -183
  34. package/dist/styled/components/ui/recipes/combobox.cjs +1 -0
  35. package/dist/styled/components/ui/recipes/combobox.d.ts +4 -0
  36. package/dist/styled/components/ui/recipes/combobox.js +57 -0
  37. package/dist/styled/components/ui/recipes/index.cjs +1 -1
  38. package/dist/styled/components/ui/recipes/index.d.ts +1 -0
  39. package/dist/styled/components/ui/recipes/index.js +29 -27
  40. package/dist/styled/components/ui/recipes/modal.d.ts +1 -1
  41. package/dist/styled/components/ui/recipes/scrollable.d.ts +1 -1
  42. package/dist/styled/components/ui/recipes/select.d.ts +1 -1
  43. package/dist/styled/inkeep.css.cjs +182 -2
  44. package/dist/styled/inkeep.css.js +182 -2
  45. package/dist/types/config/settings/form.d.ts +9 -1
  46. package/package.json +6 -5
@@ -837,6 +837,9 @@ video {
837
837
  width: 2.25rem;
838
838
  height: 2.25rem;
839
839
  }
840
+ .\\!h-auto {
841
+ height: auto !important;
842
+ }
840
843
  .h-0 {
841
844
  height: 0px;
842
845
  }
@@ -909,6 +912,9 @@ video {
909
912
  .max-h-\\[200px\\] {
910
913
  max-height: 200px;
911
914
  }
915
+ .max-h-\\[min\\(24rem\\2c var\\(--available-height\\)\\)\\] {
916
+ max-height: min(24rem,var(--available-height));
917
+ }
912
918
  .max-h-\\[min\\(85vh\\2c 850px\\)\\] {
913
919
  max-height: min(85vh,850px);
914
920
  }
@@ -1021,6 +1027,9 @@ video {
1021
1027
  .min-w-\\[var\\(--radix-select-trigger-width\\)\\] {
1022
1028
  min-width: var(--radix-select-trigger-width);
1023
1029
  }
1030
+ .min-w-\\[var\\(--reference-width\\2c 8rem\\)\\] {
1031
+ min-width: var(--reference-width,8rem);
1032
+ }
1024
1033
  .max-w-2xl {
1025
1034
  max-width: 42rem;
1026
1035
  }
@@ -1042,6 +1051,9 @@ video {
1042
1051
  .flex-\\[0_0_100\\%\\] {
1043
1052
  flex: 0 0 100%;
1044
1053
  }
1054
+ .flex-shrink {
1055
+ flex-shrink: 1;
1056
+ }
1045
1057
  .flex-shrink-0 {
1046
1058
  flex-shrink: 0;
1047
1059
  }
@@ -1051,6 +1063,9 @@ video {
1051
1063
  .shrink-0 {
1052
1064
  flex-shrink: 0;
1053
1065
  }
1066
+ .flex-grow-0 {
1067
+ flex-grow: 0;
1068
+ }
1054
1069
  .grow-0 {
1055
1070
  flex-grow: 0;
1056
1071
  }
@@ -1320,6 +1335,9 @@ video {
1320
1335
  .justify-self-center {
1321
1336
  justify-self: center;
1322
1337
  }
1338
+ .overflow-auto {
1339
+ overflow: auto;
1340
+ }
1323
1341
  .overflow-hidden {
1324
1342
  overflow: hidden;
1325
1343
  }
@@ -1391,6 +1409,9 @@ video {
1391
1409
  .border {
1392
1410
  border-width: 1px;
1393
1411
  }
1412
+ .border-0 {
1413
+ border-width: 0px;
1414
+ }
1394
1415
  .border-2 {
1395
1416
  border-width: 2px;
1396
1417
  }
@@ -2544,6 +2565,10 @@ slot {
2544
2565
  opacity: 1;
2545
2566
  }
2546
2567
 
2568
+ .group:disabled .group-disabled\\:opacity-60 {
2569
+ opacity: 0.6;
2570
+ }
2571
+
2547
2572
  .has-\\[\\[data-dual-pane-search-expanded\\]\\]\\:w-\\[min\\(90vw\\2c 1000px\\)\\]:has([data-dual-pane-search-expanded]) {
2548
2573
  width: min(90vw,1000px);
2549
2574
  }
@@ -2784,6 +2809,10 @@ slot {
2784
2809
  flex-direction: row;
2785
2810
  }
2786
2811
 
2812
+ .data-\\[input-type\\=checkbox\\]\\:flex-wrap[data-input-type="checkbox"] {
2813
+ flex-wrap: wrap;
2814
+ }
2815
+
2787
2816
  .data-\\[role\\=user\\]\\:items-end[data-role="user"] {
2788
2817
  align-items: flex-end;
2789
2818
  }
@@ -2833,6 +2862,10 @@ slot {
2833
2862
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
2834
2863
  }
2835
2864
 
2865
+ .data-\\[highlighted\\]\\:bg-gray-100[data-highlighted] {
2866
+ background-color: var(--ikp-color-gray-100);
2867
+ }
2868
+
2836
2869
  .data-\\[role\\=user\\]\\:bg-gray-100[data-role="user"] {
2837
2870
  background-color: var(--ikp-color-gray-100);
2838
2871
  }
@@ -2888,6 +2921,10 @@ slot {
2888
2921
  font-weight: 600;
2889
2922
  }
2890
2923
 
2924
+ .data-\\[state\\=checked\\]\\:font-medium[data-state="checked"] {
2925
+ font-weight: 500;
2926
+ }
2927
+
2891
2928
  .data-\\[active\\]\\:text-gray-600[data-active] {
2892
2929
  color: var(--ikp-color-gray-600);
2893
2930
  }
@@ -2939,6 +2976,18 @@ slot {
2939
2976
  color: var(--ikp-color-inkeep-primary-medium);
2940
2977
  }
2941
2978
 
2979
+ .data-\\[invalid\\]\\:placeholder-opacity-80[data-invalid]::-moz-placeholder {
2980
+ --tw-placeholder-opacity: 0.8;
2981
+ }
2982
+
2983
+ .data-\\[invalid\\]\\:placeholder-opacity-80[data-invalid]::placeholder {
2984
+ --tw-placeholder-opacity: 0.8;
2985
+ }
2986
+
2987
+ .data-\\[disabled\\]\\:opacity-30[data-disabled] {
2988
+ opacity: 0.3;
2989
+ }
2990
+
2942
2991
  .data-\\[disabled\\]\\:opacity-50[data-disabled] {
2943
2992
  opacity: 0.5;
2944
2993
  }
@@ -3089,6 +3138,14 @@ slot {
3089
3138
  background-image: conic-gradient(transparent,var(--ikp-color-inkeep-expanded-primary-600),transparent 30%);
3090
3139
  }
3091
3140
 
3141
+ .group[data-input-type="checkbox"] .group-data-\\[input-type\\=checkbox\\]\\:w-full {
3142
+ width: 100%;
3143
+ }
3144
+
3145
+ .group[data-input-type="checkbox"] .group-data-\\[input-type\\=checkbox\\]\\:basis-full {
3146
+ flex-basis: 100%;
3147
+ }
3148
+
3092
3149
  .group[data-expanded="true"] .group-data-\\[expanded\\=true\\]\\:rotate-180 {
3093
3150
  --tw-rotate: 180deg;
3094
3151
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -3554,6 +3611,14 @@ slot {
3554
3611
  color: var(--ikp-color-gray-dark-200);
3555
3612
  }
3556
3613
 
3614
+ .dark\\:placeholder\\:text-gray-dark-500:is([data-theme="dark"] *)::-moz-placeholder {
3615
+ color: var(--ikp-color-gray-dark-500);
3616
+ }
3617
+
3618
+ .dark\\:placeholder\\:text-gray-dark-500:is([data-theme="dark"] *)::placeholder {
3619
+ color: var(--ikp-color-gray-dark-500);
3620
+ }
3621
+
3557
3622
  .dark\\:before\\:bg-gray-dark-950:is([data-theme="dark"] *)::before {
3558
3623
  content: var(--tw-content);
3559
3624
  background-color: var(--ikp-color-gray-dark-950);
@@ -3621,8 +3686,9 @@ slot {
3621
3686
  background-color: var(--ikp-color-white-alpha-400);
3622
3687
  }
3623
3688
 
3624
- .dark\\:disabled\\:text-white-alpha-200:disabled:is([data-theme="dark"] *) {
3625
- color: var(--ikp-color-white-alpha-200);
3689
+ .dark\\:disabled\\:text-white:disabled:is([data-theme="dark"] *) {
3690
+ --tw-text-opacity: 1;
3691
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
3626
3692
  }
3627
3693
 
3628
3694
  .group:hover .dark\\:group-hover\\:text-white-alpha-600:is([data-theme="dark"] *) {
@@ -3641,6 +3707,10 @@ slot {
3641
3707
  background-color: var(--ikp-color-gray-dark-700);
3642
3708
  }
3643
3709
 
3710
+ .dark\\:data-\\[highlighted\\]\\:bg-gray-dark-800[data-highlighted]:is([data-theme="dark"] *) {
3711
+ background-color: var(--ikp-color-gray-dark-800);
3712
+ }
3713
+
3644
3714
  .dark\\:data-\\[state\\=active\\]\\:bg-white-alpha-100[data-state="active"]:is([data-theme="dark"] *) {
3645
3715
  background-color: var(--ikp-color-white-alpha-100);
3646
3716
  }
@@ -3712,6 +3782,10 @@ slot {
3712
3782
  color: var(--ikp-color-gray-dark-950);
3713
3783
  }
3714
3784
 
3785
+ .dark\\:data-\\[required\\]\\:after\\:\\[content\\:\\"\\*\\"\\][data-required]:is([data-theme="dark"] *)::after {
3786
+ content: "*";
3787
+ }
3788
+
3715
3789
  .dark\\:data-\\[highlight\\]\\:first\\:before\\:\\[background-image\\:conic-gradient\\(transparent\\2c theme\\(colors\\.inkeep-expanded-primary\\.300\\)\\2c transparent_30\\%\\)\\]:first-child[data-highlight]:is([data-theme="dark"] *)::before {
3716
3790
  content: var(--tw-content);
3717
3791
  background-image: conic-gradient(transparent,var(--ikp-color-inkeep-expanded-primary-300),transparent 30%);
@@ -4078,6 +4152,112 @@ slot {
4078
4152
  margin-bottom: 0px;
4079
4153
  }
4080
4154
 
4155
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\:hover\\]\\:bg-gray-200 [data-part=tag-clear]:hover {
4156
+ background-color: var(--ikp-color-gray-200);
4157
+ }
4158
+
4159
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\:hover\\]\\:dark\\:bg-gray-dark-600:is([data-theme="dark"] *) [data-part=tag-clear]:hover {
4160
+ background-color: var(--ikp-color-gray-dark-600);
4161
+ }
4162
+
4163
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:flex [data-part=tag-clear] {
4164
+ display: flex;
4165
+ }
4166
+
4167
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:h-5 [data-part=tag-clear] {
4168
+ height: 1.25rem;
4169
+ }
4170
+
4171
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:w-5 [data-part=tag-clear] {
4172
+ width: 1.25rem;
4173
+ }
4174
+
4175
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:shrink-0 [data-part=tag-clear] {
4176
+ flex-shrink: 0;
4177
+ }
4178
+
4179
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:cursor-pointer [data-part=tag-clear] {
4180
+ cursor: pointer;
4181
+ }
4182
+
4183
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:items-center [data-part=tag-clear] {
4184
+ align-items: center;
4185
+ }
4186
+
4187
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:justify-center [data-part=tag-clear] {
4188
+ justify-content: center;
4189
+ }
4190
+
4191
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:rounded-md [data-part=tag-clear] {
4192
+ border-radius: 0.375rem;
4193
+ }
4194
+
4195
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:text-current [data-part=tag-clear] {
4196
+ color: currentColor;
4197
+ }
4198
+
4199
+ .\\[\\&_\\[data-part\\=tag-clear\\]\\]\\:outline-none [data-part=tag-clear] {
4200
+ outline: 2px solid transparent;
4201
+ outline-offset: 2px;
4202
+ }
4203
+
4204
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:inline-flex [data-part=tag] {
4205
+ display: inline-flex;
4206
+ }
4207
+
4208
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:flex-shrink-0 [data-part=tag] {
4209
+ flex-shrink: 0;
4210
+ }
4211
+
4212
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:items-center [data-part=tag] {
4213
+ align-items: center;
4214
+ }
4215
+
4216
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:gap-1 [data-part=tag] {
4217
+ gap: 0.25rem;
4218
+ }
4219
+
4220
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:whitespace-nowrap [data-part=tag] {
4221
+ white-space: nowrap;
4222
+ }
4223
+
4224
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:rounded-md [data-part=tag] {
4225
+ border-radius: 0.375rem;
4226
+ }
4227
+
4228
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:bg-gray-100 [data-part=tag] {
4229
+ background-color: var(--ikp-color-gray-100);
4230
+ }
4231
+
4232
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:py-0\\.5 [data-part=tag] {
4233
+ padding-top: 0.125rem;
4234
+ padding-bottom: 0.125rem;
4235
+ }
4236
+
4237
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:pl-2 [data-part=tag] {
4238
+ padding-left: 0.5rem;
4239
+ }
4240
+
4241
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:pr-1 [data-part=tag] {
4242
+ padding-right: 0.25rem;
4243
+ }
4244
+
4245
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:text-sm [data-part=tag] {
4246
+ font-size: var(--ikp-font-size-sm);
4247
+ }
4248
+
4249
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:text-gray-800 [data-part=tag] {
4250
+ color: var(--ikp-color-gray-800);
4251
+ }
4252
+
4253
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:dark\\:bg-gray-dark-800:is([data-theme="dark"] *) [data-part=tag] {
4254
+ background-color: var(--ikp-color-gray-dark-800);
4255
+ }
4256
+
4257
+ .\\[\\&_\\[data-part\\=tag\\]\\]\\:dark\\:text-gray-dark-50:is([data-theme="dark"] *) [data-part=tag] {
4258
+ color: var(--ikp-color-gray-dark-50);
4259
+ }
4260
+
4081
4261
  .\\[\\&_a\\]\\:inline a {
4082
4262
  display: inline;
4083
4263
  }
@@ -36,7 +36,7 @@ interface AIChatFormSuccessView {
36
36
  message: string;
37
37
  doneButton: AIChatFormDoneButton;
38
38
  }
39
- export type FormField = CheckboxField | FileField | SelectField | TextField | IncludeChatSessionField;
39
+ export type FormField = CheckboxField | ComboboxField | FileField | SelectField | TextField | IncludeChatSessionField;
40
40
  export type FormInputType = NonNullable<FormField['inputType']>;
41
41
  export interface BaseFormField {
42
42
  name: string;
@@ -62,6 +62,14 @@ interface SelectField extends BaseFormField {
62
62
  defaultValue?: string;
63
63
  placeholder?: string;
64
64
  }
65
+ interface ComboboxField extends BaseFormField {
66
+ inputType: 'combobox';
67
+ items: SelectItem[];
68
+ /** Value is always an array; single selection = array with one value. */
69
+ defaultValue?: string[];
70
+ placeholder?: string;
71
+ multiple?: boolean;
72
+ }
65
73
  interface TextField extends BaseFormField {
66
74
  inputType: 'email' | 'text' | 'textarea';
67
75
  defaultValue?: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@inkeep/agents-ui",
3
- "version": "0.15.12",
3
+ "version": "0.15.13",
4
4
  "description": "",
5
5
  "homepage": "",
6
6
  "repository": {
@@ -65,10 +65,11 @@
65
65
  "@radix-ui/react-use-callback-ref": "^1.1.0",
66
66
  "@radix-ui/react-use-controllable-state": "^1.1.0",
67
67
  "@radix-ui/react-use-layout-effect": "^1.1.1",
68
- "@zag-js/focus-trap": "^1.7.0",
69
- "@zag-js/presence": "^1.13.1",
70
- "@zag-js/react": "^1.13.1",
71
- "@zag-js/remove-scroll": "^1.26.2",
68
+ "@zag-js/combobox": "^1.33.1",
69
+ "@zag-js/focus-trap": "^1.33.1",
70
+ "@zag-js/presence": "^1.33.1",
71
+ "@zag-js/react": "^1.33.1",
72
+ "@zag-js/remove-scroll": "^1.33.1",
72
73
  "ai": "6.0.44",
73
74
  "altcha-lib": "^1.2.0",
74
75
  "aria-hidden": "^1.2.4",