@webskill/chatbot 0.3.0 → 0.4.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/chatbot.css CHANGED
@@ -3,8 +3,10 @@
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
5
5
  :root, :host {
6
- --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
7
- --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
6
+ --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Microsoft YaHei',
7
+ 'PingFang SC', 'Hiragino Sans GB', 'Noto Sans CJK SC', 'Source Han Sans SC', 'WenQuanYi Micro Hei', sans-serif;
8
+ --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Microsoft YaHei', 'PingFang SC',
9
+ 'Noto Sans Mono CJK SC', monospace;
8
10
  --spacing: 0.25rem;
9
11
  --container-sm: 24rem;
10
12
  --container-md: 28rem;
@@ -30,8 +32,10 @@
30
32
  --aspect-video: 16 / 9;
31
33
  --default-transition-duration: 150ms;
32
34
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
33
- --default-font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
34
- --default-mono-font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
35
+ --default-font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Microsoft YaHei',
36
+ 'PingFang SC', 'Hiragino Sans GB', 'Noto Sans CJK SC', 'Source Han Sans SC', 'WenQuanYi Micro Hei', sans-serif;
37
+ --default-mono-font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Microsoft YaHei', 'PingFang SC',
38
+ 'Noto Sans Mono CJK SC', monospace;
35
39
  --color-background: var(--background);
36
40
  --color-foreground: var(--foreground);
37
41
  --color-card: var(--card);
@@ -44,6 +48,8 @@
44
48
  --color-ring: var(--ring);
45
49
  --color-destructive: var(--destructive);
46
50
  --color-success: var(--success);
51
+ --color-warning: var(--warning);
52
+ --color-info: var(--info);
47
53
  --color-surface: var(--card);
48
54
  --color-subtle: var(--accent);
49
55
  --color-ink: var(--foreground);
@@ -280,6 +286,9 @@
280
286
  .right-4 {
281
287
  right: calc(var(--spacing) * 4);
282
288
  }
289
+ .right-full {
290
+ right: 100%;
291
+ }
283
292
  .-bottom-7 {
284
293
  bottom: calc(var(--spacing) * -7);
285
294
  }
@@ -298,6 +307,9 @@
298
307
  .left-2\.5 {
299
308
  left: calc(var(--spacing) * 2.5);
300
309
  }
310
+ .left-full {
311
+ left: 100%;
312
+ }
301
313
  .z-20 {
302
314
  z-index: 20;
303
315
  }
@@ -352,6 +364,9 @@
352
364
  .ms-auto {
353
365
  margin-inline-start: auto;
354
366
  }
367
+ .-mt-2 {
368
+ margin-top: calc(var(--spacing) * -2);
369
+ }
355
370
  .mt-0\.5 {
356
371
  margin-top: calc(var(--spacing) * 0.5);
357
372
  }
@@ -376,6 +391,9 @@
376
391
  .block {
377
392
  display: block;
378
393
  }
394
+ .contents {
395
+ display: contents;
396
+ }
379
397
  .flex {
380
398
  display: flex;
381
399
  }
@@ -495,6 +513,9 @@
495
513
  .min-h-0 {
496
514
  min-height: 0px;
497
515
  }
516
+ .min-h-16 {
517
+ min-height: calc(var(--spacing) * 16);
518
+ }
498
519
  .min-h-20 {
499
520
  min-height: calc(var(--spacing) * 20);
500
521
  }
@@ -531,18 +552,9 @@
531
552
  .w-72 {
532
553
  width: calc(var(--spacing) * 72);
533
554
  }
534
- .w-\[44rem\] {
535
- width: 44rem;
536
- }
537
- .w-\[min\(22rem\,calc\(100vw-2rem\)\)\] {
538
- width: min(22rem, calc(100vw - 2rem));
539
- }
540
555
  .w-\[min\(36rem\,calc\(100vw-2rem\)\)\] {
541
556
  width: min(36rem, calc(100vw - 2rem));
542
557
  }
543
- .w-\[min\(100\%-2rem\,32rem\)\] {
544
- width: min(100% - 2rem, 32rem);
545
- }
546
558
  .w-auto {
547
559
  width: auto;
548
560
  }
@@ -555,6 +567,9 @@
555
567
  .w-px {
556
568
  width: 1px;
557
569
  }
570
+ .w-screen {
571
+ width: 100vw;
572
+ }
558
573
  .max-w-2xl {
559
574
  max-width: var(--container-2xl);
560
575
  }
@@ -567,9 +582,6 @@
567
582
  .max-w-72 {
568
583
  max-width: calc(var(--spacing) * 72);
569
584
  }
570
- .max-w-\[calc\(100vw-2rem\)\] {
571
- max-width: calc(100vw - 2rem);
572
- }
573
585
  .max-w-full {
574
586
  max-width: 100%;
575
587
  }
@@ -647,6 +659,9 @@
647
659
  .cursor-col-resize {
648
660
  cursor: col-resize;
649
661
  }
662
+ .cursor-default {
663
+ cursor: default;
664
+ }
650
665
  .cursor-not-allowed {
651
666
  cursor: not-allowed;
652
667
  }
@@ -680,9 +695,6 @@
680
695
  .grid-cols-2 {
681
696
  grid-template-columns: repeat(2, minmax(0, 1fr));
682
697
  }
683
- .grid-cols-\[1fr_auto\] {
684
- grid-template-columns: 1fr auto;
685
- }
686
698
  .flex-col {
687
699
  flex-direction: column;
688
700
  }
@@ -736,9 +748,6 @@
736
748
  margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
737
749
  margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
738
750
  }
739
- .gap-x-4 {
740
- column-gap: calc(var(--spacing) * 4);
741
- }
742
751
  :where(.divide-y > :not(:last-child)) {
743
752
  --tw-divide-y-reverse: 0;
744
753
  border-bottom-style: var(--tw-border-style);
@@ -778,6 +787,9 @@
778
787
  .overflow-y-auto {
779
788
  overflow-y: auto;
780
789
  }
790
+ .rounded {
791
+ border-radius: 0.25rem;
792
+ }
781
793
  .rounded-\[2px\] {
782
794
  border-radius: 2px;
783
795
  }
@@ -986,12 +998,6 @@
986
998
  .bg-warning-soft {
987
999
  background-color: var(--warning-soft);
988
1000
  }
989
- .bg-warning\/15 {
990
- background-color: var(--warning);
991
- @supports (color: color-mix(in lab, red, red)) {
992
- background-color: color-mix(in oklab, var(--warning) 15%, transparent);
993
- }
994
- }
995
1001
  .fill-current {
996
1002
  fill: currentcolor;
997
1003
  }
@@ -1128,10 +1134,12 @@
1128
1134
  font-family: var(--font-sans);
1129
1135
  }
1130
1136
  .font-mono {
1131
- font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
1137
+ font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Microsoft YaHei', 'PingFang SC',
1138
+ 'Noto Sans Mono CJK SC', monospace;
1132
1139
  }
1133
1140
  .font-sans {
1134
- font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
1141
+ font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Microsoft YaHei',
1142
+ 'PingFang SC', 'Hiragino Sans GB', 'Noto Sans CJK SC', 'Source Han Sans SC', 'WenQuanYi Micro Hei', sans-serif;
1135
1143
  }
1136
1144
  .text-2xl {
1137
1145
  font-size: var(--text-2xl);
@@ -1156,12 +1164,6 @@
1156
1164
  .text-\[0\.85em\] {
1157
1165
  font-size: 0.85em;
1158
1166
  }
1159
- .text-\[10px\] {
1160
- font-size: 10px;
1161
- }
1162
- .text-\[11px\] {
1163
- font-size: 11px;
1164
- }
1165
1167
  .leading-6 {
1166
1168
  --tw-leading: calc(var(--spacing) * 6);
1167
1169
  line-height: calc(var(--spacing) * 6);
@@ -1252,9 +1254,6 @@
1252
1254
  .uppercase {
1253
1255
  text-transform: uppercase;
1254
1256
  }
1255
- .italic {
1256
- font-style: italic;
1257
- }
1258
1257
  .tabular-nums {
1259
1258
  --tw-numeric-spacing: tabular-nums;
1260
1259
  font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
@@ -1482,19 +1481,6 @@
1482
1481
  .empty\:hidden:empty {
1483
1482
  display: none;
1484
1483
  }
1485
- .focus-within\:border-ring:focus-within {
1486
- border-color: var(--ring);
1487
- }
1488
- .focus-within\:ring-2:focus-within {
1489
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1490
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1491
- }
1492
- .focus-within\:ring-ring\/20:focus-within {
1493
- --tw-ring-color: var(--ring);
1494
- @supports (color: color-mix(in lab, red, red)) {
1495
- --tw-ring-color: color-mix(in oklab, var(--ring) 20%, transparent);
1496
- }
1497
- }
1498
1484
  @media (hover: hover) {
1499
1485
  .hover\:border-ring:hover {
1500
1486
  border-color: var(--ring);
@@ -1548,6 +1534,9 @@
1548
1534
  .hover\:opacity-85:hover {
1549
1535
  opacity: 85%;
1550
1536
  }
1537
+ .hover\:opacity-90:hover {
1538
+ opacity: 90%;
1539
+ }
1551
1540
  }
1552
1541
  .focus\:border-ring:focus {
1553
1542
  border-color: var(--ring);
@@ -1853,7 +1842,58 @@
1853
1842
  flex-shrink: 0;
1854
1843
  }
1855
1844
  }
1856
- :root {
1845
+ :where(.dark, .light, [data-theme]) {
1846
+ --color-background: var(--background);
1847
+ --color-foreground: var(--foreground);
1848
+ --color-card: var(--card);
1849
+ --color-card-foreground: var(--card-foreground);
1850
+ --color-popover: var(--popover);
1851
+ --color-popover-foreground: var(--popover-foreground);
1852
+ --color-primary: var(--primary);
1853
+ --color-primary-foreground: var(--primary-foreground);
1854
+ --color-secondary: var(--secondary);
1855
+ --color-secondary-foreground: var(--secondary-foreground);
1856
+ --color-muted: var(--muted-foreground);
1857
+ --color-muted-foreground: var(--muted-foreground);
1858
+ --color-accent: var(--accent);
1859
+ --color-accent-foreground: var(--accent-foreground);
1860
+ --color-border: var(--border);
1861
+ --color-input: var(--input);
1862
+ --color-ring: var(--ring);
1863
+ --color-destructive: var(--destructive);
1864
+ --color-destructive-foreground: var(--destructive-foreground);
1865
+ --color-destructive-soft: var(--destructive-soft);
1866
+ --color-success: var(--success);
1867
+ --color-success-foreground: var(--success-foreground);
1868
+ --color-success-soft: var(--success-soft);
1869
+ --color-warning: var(--warning);
1870
+ --color-warning-foreground: var(--warning-foreground);
1871
+ --color-warning-soft: var(--warning-soft);
1872
+ --color-info: var(--info);
1873
+ --color-info-foreground: var(--info-foreground);
1874
+ --color-info-soft: var(--info-soft);
1875
+ --color-sidebar: var(--sidebar);
1876
+ --color-sidebar-foreground: var(--sidebar-foreground);
1877
+ --color-sidebar-primary: var(--sidebar-primary);
1878
+ --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
1879
+ --color-sidebar-accent: var(--sidebar-accent);
1880
+ --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
1881
+ --color-sidebar-border: var(--sidebar-border);
1882
+ --color-sidebar-ring: var(--sidebar-ring);
1883
+ --color-brand: var(--brand);
1884
+ --color-brand-foreground: var(--brand-foreground);
1885
+ --color-canvas: var(--background);
1886
+ --color-surface: var(--card);
1887
+ --color-subtle: var(--accent);
1888
+ --color-ink: var(--foreground);
1889
+ --color-danger: var(--destructive);
1890
+ --color-danger-soft: var(--destructive-soft);
1891
+ --color-sidebar-canvas: var(--sidebar);
1892
+ --color-sidebar-surface: var(--card);
1893
+ --color-sidebar-ink: var(--sidebar-foreground);
1894
+ --color-sidebar-muted: var(--muted-foreground);
1895
+ }
1896
+ :root, :where(.light, [data-theme='light']) {
1857
1897
  --radius: 0.625rem;
1858
1898
  --background: oklch(1 0 0);
1859
1899
  --foreground: oklch(0.145 0 0);
@@ -1911,6 +1951,7 @@
1911
1951
  --sidebar-ring: oklch(0.708 0 0);
1912
1952
  --brand: oklch(0.55 0.16 275);
1913
1953
  --brand-foreground: oklch(0.985 0 0);
1954
+ --text-min: 0.75rem;
1914
1955
  }
1915
1956
  :where(.dark, [data-theme='dark']) {
1916
1957
  --background: oklch(0.145 0 0);
@@ -2034,6 +2075,29 @@
2034
2075
  [data-webskill-theme='dark'] {
2035
2076
  color-scheme: dark;
2036
2077
  }
2078
+ @layer components {
2079
+ .webskill-sheet-content {
2080
+ width: var(--webskill-sheet-width, min(22rem, calc(100vw - 2rem)));
2081
+ }
2082
+ .webskill-dialog-content {
2083
+ width: var(--webskill-dialog-width, min(100% - 2rem, 32rem));
2084
+ }
2085
+ .webskill-toast-root {
2086
+ width: 100%;
2087
+ max-width: var(--webskill-toast-width, 24rem);
2088
+ }
2089
+ .webskill-input {
2090
+ width: 100%;
2091
+ height: 2.25rem;
2092
+ padding-inline: 0.75rem;
2093
+ }
2094
+ .webskill-resizable-panel {
2095
+ min-height: 0;
2096
+ }
2097
+ .webskill-dropdown-content {
2098
+ min-width: 10rem;
2099
+ }
2100
+ }
2037
2101
  .webskill-surface-list {
2038
2102
  display: flex;
2039
2103
  flex-direction: column;