@webless/agent 0.13.1 → 0.14.0

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.
package/dist/embed.css CHANGED
@@ -9,7 +9,7 @@
9
9
  --as-surface-muted: #f4f6fb;
10
10
  --as-text: #171b2a;
11
11
  --as-text-muted: #5a6378;
12
- --as-text-subtle: #8a94a8;
12
+ --as-text-subtle: #6b7280;
13
13
  --as-border: rgb(42 51 70 / 0.1);
14
14
  --as-visitor-bubble: #6f16ff;
15
15
  --as-visitor-text: #ffffff;
@@ -676,142 +676,6 @@ summary.agent-transcript__activity-heading::before {
676
676
  }
677
677
  }
678
678
 
679
- /* src/react/components/LearnMore/LearnMore.css */
680
- .learn-more {
681
- width: 100%;
682
- min-width: 0;
683
- }
684
- .learn-more__heading {
685
- margin: 0;
686
- font-size: 12.5px;
687
- font-weight: 650;
688
- line-height: 1.5;
689
- }
690
- .learn-more__toggle {
691
- appearance: none;
692
- display: inline-flex;
693
- align-items: center;
694
- justify-content: flex-start;
695
- gap: 4px;
696
- min-height: 44px;
697
- margin: 0;
698
- padding: 10px 16px;
699
- border: 0;
700
- border-radius: 8px;
701
- background: transparent;
702
- color: var(--as-text-muted);
703
- font: inherit;
704
- font-size: 12.5px;
705
- font-weight: 650;
706
- text-align: left;
707
- cursor: pointer;
708
- transition: background 150ms ease, color 150ms ease;
709
- }
710
- .learn-more .learn-more__toggle {
711
- width: auto;
712
- background: transparent;
713
- }
714
- .learn-more .learn-more__toggle:hover {
715
- color: var(--as-brand);
716
- background: var(--as-brand-soft);
717
- }
718
- .learn-more__toggle:focus-visible {
719
- outline: 2px solid var(--as-brand);
720
- outline-offset: 2px;
721
- }
722
- .learn-more__chevron {
723
- width: 14px;
724
- height: 14px;
725
- transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
726
- }
727
- .learn-more__toggle[aria-expanded=true] .learn-more__chevron {
728
- transform: rotate(180deg);
729
- }
730
- .learn-more__panel {
731
- display: grid;
732
- grid-template-rows: 0fr;
733
- visibility: hidden;
734
- transition: grid-template-rows 220ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 220ms;
735
- }
736
- .learn-more__panel--open {
737
- grid-template-rows: 1fr;
738
- visibility: visible;
739
- transition: grid-template-rows 220ms cubic-bezier(0.22, 1, 0.36, 1);
740
- }
741
- .learn-more__panel-inner {
742
- min-height: 0;
743
- overflow: hidden;
744
- }
745
- .learn-more__questions {
746
- margin: 0;
747
- padding: 0 0 4px;
748
- list-style: none;
749
- }
750
- .learn-more__questions li {
751
- border-bottom: 1px solid var(--as-border);
752
- }
753
- .learn-more__questions li:last-child {
754
- border-bottom: 0;
755
- }
756
- .learn-more__questions button {
757
- appearance: none;
758
- display: flex;
759
- align-items: center;
760
- gap: var(--as-discovery-row-gap);
761
- width: 100%;
762
- min-height: var(--as-discovery-row-min-height);
763
- padding: var(--as-discovery-row-padding);
764
- border: 0;
765
- border-radius: 6px;
766
- background: transparent;
767
- color: var(--as-text);
768
- text-align: left;
769
- font: inherit;
770
- font-size: var(--as-discovery-row-font-size);
771
- font-weight: var(--as-discovery-row-font-weight);
772
- line-height: var(--as-discovery-row-line-height);
773
- cursor: pointer;
774
- }
775
- .learn-more__question-icon {
776
- display: inline-flex;
777
- flex: 0 0 18px;
778
- color: var(--as-text-muted);
779
- }
780
- .learn-more__question-text {
781
- min-width: 0;
782
- flex: 1;
783
- overflow-wrap: anywhere;
784
- }
785
- .learn-more__question-arrow {
786
- width: 18px;
787
- height: 18px;
788
- flex-shrink: 0;
789
- color: var(--as-text-muted);
790
- }
791
- .learn-more .learn-more__questions button:hover:not(:disabled) {
792
- background: var(--as-brand-soft);
793
- color: var(--as-brand);
794
- }
795
- .learn-more .learn-more__questions button:hover:not(:disabled) .learn-more__question-arrow {
796
- color: var(--as-brand);
797
- }
798
- .learn-more__questions button:focus-visible {
799
- outline: none;
800
- box-shadow: var(--as-focus-inset-ring);
801
- }
802
- .learn-more__questions button:disabled {
803
- opacity: 0.5;
804
- cursor: default;
805
- }
806
- @media (prefers-reduced-motion: reduce) {
807
- .learn-more__panel {
808
- transition: none;
809
- }
810
- .learn-more__chevron {
811
- transition: none;
812
- }
813
- }
814
-
815
679
  /* src/react/components/SearchReferences/SearchReferences.css */
816
680
  .search-references {
817
681
  display: grid;
@@ -837,15 +701,13 @@ summary.agent-transcript__activity-heading::before {
837
701
  }
838
702
  .search-references__list {
839
703
  display: grid;
704
+ gap: 0;
840
705
  margin: 0;
841
706
  padding: 0;
842
707
  list-style: none;
843
708
  }
844
- .search-references__list > li {
845
- border-bottom: 1px solid var(--as-border);
846
- }
847
- .search-references__list > li:last-child {
848
- border-bottom: 0;
709
+ .search-references__list > li + li {
710
+ border-top: 1px solid color-mix(in srgb, var(--as-text) 6%, transparent);
849
711
  }
850
712
  .search-references__source {
851
713
  display: flex;
@@ -933,6 +795,94 @@ summary.agent-transcript__activity-heading::before {
933
795
  color: var(--as-text-muted);
934
796
  }
935
797
 
798
+ /* src/react/components/ExploreMore/ExploreMore.css */
799
+ .explore-more {
800
+ display: grid;
801
+ width: 100%;
802
+ min-width: 0;
803
+ gap: 16px;
804
+ }
805
+ .explore-more__section {
806
+ display: grid;
807
+ min-width: 0;
808
+ gap: 2px;
809
+ }
810
+ .explore-more__section .search-references {
811
+ margin-top: 0;
812
+ }
813
+ .explore-more__label {
814
+ margin: 0;
815
+ padding: 0 16px 2px;
816
+ color: var(--as-text-muted);
817
+ font-size: 13px;
818
+ font-weight: 700;
819
+ line-height: 1.4;
820
+ }
821
+ .explore-more__section .search-references__list > li:first-child > .search-references__source,
822
+ .explore-more__section .explore-more__questions > li:first-child > button {
823
+ padding-top: 6px;
824
+ }
825
+ .explore-more__questions {
826
+ display: grid;
827
+ gap: 0;
828
+ margin: 0;
829
+ padding: 0;
830
+ list-style: none;
831
+ }
832
+ .explore-more__questions > li + li {
833
+ border-top: 1px solid color-mix(in srgb, var(--as-text) 6%, transparent);
834
+ }
835
+ .explore-more__questions button {
836
+ appearance: none;
837
+ display: flex;
838
+ align-items: center;
839
+ gap: var(--as-discovery-row-gap);
840
+ width: 100%;
841
+ min-height: var(--as-discovery-row-min-height);
842
+ padding: var(--as-discovery-row-padding);
843
+ border: 0;
844
+ border-radius: 6px;
845
+ background: transparent;
846
+ color: var(--as-text);
847
+ text-align: left;
848
+ font: inherit;
849
+ font-size: var(--as-discovery-row-font-size);
850
+ font-weight: var(--as-discovery-row-font-weight);
851
+ line-height: var(--as-discovery-row-line-height);
852
+ cursor: pointer;
853
+ }
854
+ .explore-more__question-icon {
855
+ display: inline-flex;
856
+ flex: 0 0 18px;
857
+ color: var(--as-text-muted);
858
+ }
859
+ .explore-more__question-text {
860
+ min-width: 0;
861
+ flex: 1;
862
+ overflow-wrap: anywhere;
863
+ }
864
+ .explore-more__question-arrow {
865
+ width: 18px;
866
+ height: 18px;
867
+ flex-shrink: 0;
868
+ color: var(--as-text-muted);
869
+ }
870
+ .explore-more .explore-more__questions button:hover:not(:disabled) {
871
+ background: var(--as-brand-soft);
872
+ color: var(--as-brand);
873
+ }
874
+ .explore-more .explore-more__questions button:hover:not(:disabled) .explore-more__question-arrow {
875
+ color: var(--as-brand);
876
+ }
877
+ .explore-more__questions button:focus-visible {
878
+ outline: none;
879
+ box-shadow: var(--as-focus-inset-ring);
880
+ }
881
+ .explore-more__questions button:disabled {
882
+ opacity: 0.5;
883
+ cursor: default;
884
+ }
885
+
936
886
  /* src/react/components/AnswerReceiptDialog/AnswerReceiptDialog.css */
937
887
  .agent-receipt-dialog {
938
888
  position: absolute;
@@ -1350,48 +1300,55 @@ summary.agent-transcript__activity-heading::before {
1350
1300
  transition: none;
1351
1301
  }
1352
1302
  }
1353
- .composer__resume {
1303
+ .composer__actions {
1354
1304
  display: flex;
1355
1305
  align-items: center;
1356
- justify-content: space-between;
1357
- flex-wrap: nowrap;
1358
- gap: 8px 10px;
1306
+ flex-wrap: wrap;
1307
+ gap: 8px;
1359
1308
  padding: 0 2px;
1360
- color: var(--as-text-muted);
1361
- font-size: 11px;
1362
- line-height: 1.25;
1363
1309
  }
1364
- .composer__resume > span {
1365
- min-width: 0;
1366
- flex: 1 1 auto;
1367
- overflow: hidden;
1368
- text-overflow: ellipsis;
1369
- white-space: nowrap;
1370
- }
1371
- .composer__resume button {
1372
- border: none;
1373
- border-radius: 4px;
1374
- background: transparent;
1310
+ .composer__action-badge {
1311
+ appearance: none;
1312
+ display: inline-flex;
1313
+ align-items: center;
1314
+ gap: 5px;
1315
+ max-width: 100%;
1316
+ min-height: 26px;
1317
+ box-sizing: border-box;
1318
+ padding: 2px 10px;
1319
+ border: 1px solid var(--as-border);
1320
+ border-radius: 999px;
1321
+ background: var(--as-surface);
1375
1322
  color: var(--as-text);
1376
- flex-shrink: 0;
1377
- padding: 4px 0;
1378
1323
  font: inherit;
1379
- font-size: 11px;
1324
+ font-size: 11.5px;
1380
1325
  font-weight: 600;
1381
- line-height: 1.25;
1382
- text-decoration: underline;
1383
- text-underline-offset: 3px;
1384
- white-space: nowrap;
1326
+ line-height: 1.4;
1327
+ overflow-wrap: anywhere;
1328
+ text-decoration: none;
1385
1329
  cursor: pointer;
1330
+ transition:
1331
+ border-color 150ms ease,
1332
+ background 150ms ease,
1333
+ color 150ms ease;
1386
1334
  }
1387
- .composer__resume button:disabled {
1388
- opacity: 0.45;
1389
- cursor: not-allowed;
1335
+ .composer__actions .composer__action-badge {
1336
+ width: auto;
1337
+ background: var(--as-surface);
1338
+ }
1339
+ .composer__actions .composer__action-badge:hover:not(:disabled) {
1340
+ border-color: color-mix(in srgb, var(--as-brand) 32%, var(--as-border));
1341
+ background: var(--as-brand-soft);
1342
+ color: var(--as-brand);
1390
1343
  }
1391
- .composer__resume button:focus-visible {
1344
+ .composer__action-badge:focus-visible {
1392
1345
  outline: 2px solid var(--as-brand);
1393
1346
  outline-offset: 2px;
1394
1347
  }
1348
+ .composer__action-badge:disabled {
1349
+ opacity: 0.5;
1350
+ cursor: default;
1351
+ }
1395
1352
 
1396
1353
  /* src/react/components/FollowUpChips/FollowUpChips.css */
1397
1354
  .followups {
@@ -1950,6 +1907,12 @@ summary.agent-transcript__activity-heading::before {
1950
1907
  .message-bubble__markdown ul {
1951
1908
  list-style: disc outside;
1952
1909
  }
1910
+ .message-bubble__text .message-bubble__markdown :is(ol, ul) li::marker {
1911
+ color: var(--as-text-muted);
1912
+ font-size: 1em;
1913
+ font-style: normal;
1914
+ font-weight: 650;
1915
+ }
1953
1916
  .message-bubble__markdown [data-streamdown=strong] {
1954
1917
  font-weight: 650;
1955
1918
  }
@@ -3109,9 +3072,6 @@ summary.agent-transcript__activity-heading::before {
3109
3072
  border-top: 1px solid var(--as-hairline);
3110
3073
  background: var(--as-surface);
3111
3074
  }
3112
- .agent-rail__composer-wrap:has(.composer__resume) {
3113
- padding-inline: 12px;
3114
- }
3115
3075
  .agent-rail__overlay {
3116
3076
  position: absolute;
3117
3077
  inset: 0;
@@ -3180,8 +3140,7 @@ summary.agent-transcript__activity-heading::before {
3180
3140
  }
3181
3141
  .agent-rail__disclaimer {
3182
3142
  flex-shrink: 0;
3183
- padding: 8px 16px 6px;
3184
- background: var(--as-surface);
3143
+ margin-top: 8px;
3185
3144
  }
3186
3145
  .agent-rail__disclaimer p {
3187
3146
  margin: 0;
@@ -3386,7 +3345,6 @@ summary.agent-transcript__activity-heading::before {
3386
3345
  color: var(--as-text);
3387
3346
  font-weight: 650;
3388
3347
  }
3389
- .agent-rail__handoff-cta,
3390
3348
  .agent-rail__handoff-action {
3391
3349
  appearance: none;
3392
3350
  flex: 0 0 auto;
@@ -3402,17 +3360,14 @@ summary.agent-transcript__activity-heading::before {
3402
3360
  cursor: pointer;
3403
3361
  transition: border-color 150ms ease, background 150ms ease;
3404
3362
  }
3405
- .agent-rail__handoff-cta:hover:not(:disabled),
3406
3363
  .agent-rail__handoff-action:hover:not(:disabled) {
3407
3364
  border-color: color-mix(in srgb, var(--as-brand) 40%, var(--as-border));
3408
3365
  background: var(--as-surface-muted);
3409
3366
  }
3410
- .agent-rail__handoff-cta:focus-visible,
3411
3367
  .agent-rail__handoff-action:focus-visible {
3412
3368
  outline: 2px solid var(--as-brand);
3413
3369
  outline-offset: 2px;
3414
3370
  }
3415
- .agent-rail__handoff-cta:disabled,
3416
3371
  .agent-rail__handoff-action:disabled {
3417
3372
  opacity: 0.55;
3418
3373
  cursor: default;
@@ -3445,16 +3400,17 @@ summary.agent-transcript__activity-heading::before {
3445
3400
  display: inline-flex;
3446
3401
  align-items: center;
3447
3402
  justify-content: flex-start;
3448
- gap: 3px;
3403
+ gap: 4px;
3449
3404
  margin-left: auto;
3450
- min-height: 44px;
3451
- padding: 10px 16px;
3405
+ min-height: 28px;
3406
+ box-sizing: border-box;
3407
+ padding: 4px 8px;
3452
3408
  border: 0;
3453
3409
  border-radius: 8px;
3454
3410
  background: transparent;
3455
- color: var(--as-text-muted);
3411
+ color: var(--as-text-subtle);
3456
3412
  font: inherit;
3457
- font-size: 12.5px;
3413
+ font-size: 12px;
3458
3414
  font-weight: 650;
3459
3415
  cursor: pointer;
3460
3416
  transition: background 150ms ease, color 150ms ease;
@@ -3464,8 +3420,8 @@ summary.agent-transcript__activity-heading::before {
3464
3420
  background: transparent;
3465
3421
  }
3466
3422
  .agent-rail__answer-actions .agent-rail__sources-button:hover {
3467
- color: var(--as-brand);
3468
- background: var(--as-brand-soft);
3423
+ color: var(--as-text);
3424
+ background: var(--as-surface-muted);
3469
3425
  }
3470
3426
  .agent-rail__sources-button:focus-visible {
3471
3427
  outline: 2px solid var(--as-brand);
@@ -3476,8 +3432,8 @@ summary.agent-transcript__activity-heading::before {
3476
3432
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
3477
3433
  }
3478
3434
  .agent-rail__sources-button-chevron svg {
3479
- width: 14px;
3480
- height: 14px;
3435
+ width: 13px;
3436
+ height: 13px;
3481
3437
  }
3482
3438
  .agent-rail__sources-button[aria-expanded=true] .agent-rail__sources-button-chevron {
3483
3439
  transform: rotate(180deg);
@@ -3498,17 +3454,8 @@ summary.agent-transcript__activity-heading::before {
3498
3454
  min-height: 0;
3499
3455
  overflow: hidden;
3500
3456
  }
3501
- .agent-rail__sources-panel-inner > .search-references {
3502
- margin-top: 2px;
3503
- }
3504
- .agent-rail .learn-more .learn-more__toggle {
3505
- width: auto;
3506
- background: transparent;
3507
- padding-left: 0;
3508
- }
3509
- .agent-rail .learn-more .learn-more__toggle:hover {
3510
- color: var(--as-brand);
3511
- background: var(--as-brand-soft);
3457
+ .agent-rail__sources-panel-inner > .explore-more {
3458
+ margin-top: 14px;
3512
3459
  }
3513
3460
 
3514
3461
  /* src/react/components/AssistEdgeTab/AssistEdgeTab.css */