@kushagradhawan/kookie-ui 0.1.57 → 0.1.59

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 (57) hide show
  1. package/components.css +33 -33
  2. package/dist/cjs/components/_internal/shell-bottom.d.ts.map +1 -1
  3. package/dist/cjs/components/_internal/shell-bottom.js +1 -1
  4. package/dist/cjs/components/_internal/shell-bottom.js.map +3 -3
  5. package/dist/cjs/components/_internal/shell-inspector.d.ts.map +1 -1
  6. package/dist/cjs/components/_internal/shell-inspector.js +1 -1
  7. package/dist/cjs/components/_internal/shell-inspector.js.map +3 -3
  8. package/dist/cjs/components/_internal/shell-sidebar.js +1 -1
  9. package/dist/cjs/components/_internal/shell-sidebar.js.map +3 -3
  10. package/dist/cjs/components/chatbar.d.ts.map +1 -1
  11. package/dist/cjs/components/chatbar.js.map +2 -2
  12. package/dist/cjs/components/icons.d.ts +1 -1
  13. package/dist/cjs/components/icons.d.ts.map +1 -1
  14. package/dist/cjs/components/icons.js.map +2 -2
  15. package/dist/cjs/components/schemas/shell.schema.d.ts +2 -2
  16. package/dist/cjs/components/schemas/shell.schema.d.ts.map +1 -1
  17. package/dist/cjs/components/schemas/shell.schema.js +1 -1
  18. package/dist/cjs/components/schemas/shell.schema.js.map +3 -3
  19. package/dist/cjs/components/shell.d.ts.map +1 -1
  20. package/dist/cjs/components/shell.js +1 -1
  21. package/dist/cjs/components/shell.js.map +3 -3
  22. package/dist/esm/components/_internal/shell-bottom.d.ts.map +1 -1
  23. package/dist/esm/components/_internal/shell-bottom.js +1 -1
  24. package/dist/esm/components/_internal/shell-bottom.js.map +3 -3
  25. package/dist/esm/components/_internal/shell-inspector.d.ts.map +1 -1
  26. package/dist/esm/components/_internal/shell-inspector.js +1 -1
  27. package/dist/esm/components/_internal/shell-inspector.js.map +3 -3
  28. package/dist/esm/components/_internal/shell-sidebar.js +1 -1
  29. package/dist/esm/components/_internal/shell-sidebar.js.map +3 -3
  30. package/dist/esm/components/chatbar.d.ts.map +1 -1
  31. package/dist/esm/components/chatbar.js.map +2 -2
  32. package/dist/esm/components/icons.d.ts +1 -1
  33. package/dist/esm/components/icons.d.ts.map +1 -1
  34. package/dist/esm/components/icons.js.map +2 -2
  35. package/dist/esm/components/schemas/shell.schema.d.ts +2 -2
  36. package/dist/esm/components/schemas/shell.schema.d.ts.map +1 -1
  37. package/dist/esm/components/schemas/shell.schema.js.map +3 -3
  38. package/dist/esm/components/shell.d.ts.map +1 -1
  39. package/dist/esm/components/shell.js +1 -1
  40. package/dist/esm/components/shell.js.map +3 -3
  41. package/package.json +1 -1
  42. package/schemas/base-button.json +1 -1
  43. package/schemas/button.json +1 -1
  44. package/schemas/icon-button.json +1 -1
  45. package/schemas/index.json +6 -6
  46. package/schemas/toggle-button.json +1 -1
  47. package/schemas/toggle-icon-button.json +1 -1
  48. package/src/components/_internal/shell-bottom.tsx +14 -13
  49. package/src/components/_internal/shell-inspector.tsx +13 -11
  50. package/src/components/_internal/shell-sidebar.tsx +12 -12
  51. package/src/components/callout.css +5 -5
  52. package/src/components/chatbar.css +3 -3
  53. package/src/components/chatbar.tsx +0 -1
  54. package/src/components/icons.tsx +19 -87
  55. package/src/components/schemas/shell.schema.ts +10 -33
  56. package/src/components/shell.tsx +32 -24
  57. package/styles.css +33 -33
@@ -309,18 +309,24 @@ const Root = React.forwardRef<HTMLDivElement, ShellRootProps>(({ className, chil
309
309
  }
310
310
  dispatchPane({ type: 'TOGGLE_PANE', target });
311
311
  },
312
- [paneState.sidebarMode],
312
+ [paneState.sidebarMode, setSidebarMode],
313
313
  );
314
314
 
315
- const expandPane = React.useCallback((target: PaneTarget) => {
316
- if (target === 'sidebar') return setSidebarMode('expanded');
317
- dispatchPane({ type: 'EXPAND_PANE', target });
318
- }, []);
315
+ const expandPane = React.useCallback(
316
+ (target: PaneTarget) => {
317
+ if (target === 'sidebar') return setSidebarMode('expanded');
318
+ dispatchPane({ type: 'EXPAND_PANE', target });
319
+ },
320
+ [setSidebarMode],
321
+ );
319
322
 
320
- const collapsePane = React.useCallback((target: PaneTarget) => {
321
- if (target === 'sidebar') return setSidebarMode('collapsed');
322
- dispatchPane({ type: 'COLLAPSE_PANE', target });
323
- }, []);
323
+ const collapsePane = React.useCallback(
324
+ (target: PaneTarget) => {
325
+ if (target === 'sidebar') return setSidebarMode('collapsed');
326
+ dispatchPane({ type: 'COLLAPSE_PANE', target });
327
+ },
328
+ [setSidebarMode],
329
+ );
324
330
 
325
331
  const baseContextValue = React.useMemo(
326
332
  () => ({
@@ -351,10 +357,15 @@ const Root = React.forwardRef<HTMLDivElement, ShellRootProps>(({ className, chil
351
357
  }),
352
358
  [
353
359
  paneState.leftMode,
360
+ setLeftMode,
354
361
  paneState.panelMode,
362
+ setPanelMode,
355
363
  paneState.sidebarMode,
364
+ setSidebarMode,
356
365
  paneState.inspectorMode,
366
+ setInspectorMode,
357
367
  paneState.bottomMode,
368
+ setBottomMode,
358
369
  hasLeft,
359
370
  hasSidebar,
360
371
  currentBreakpoint,
@@ -388,7 +399,7 @@ const Root = React.forwardRef<HTMLDivElement, ShellRootProps>(({ className, chil
388
399
  if (typeof firstRailOpen === 'undefined') return;
389
400
  const shouldOpen = Boolean(firstRailOpen);
390
401
  setLeftMode(shouldOpen ? 'expanded' : 'collapsed');
391
- }, [firstRailOpen]);
402
+ }, [firstRailOpen, setLeftMode]);
392
403
 
393
404
  const heightStyle = React.useMemo(() => {
394
405
  if (height === 'full') return { height: '100vh' };
@@ -588,25 +599,27 @@ const Left = React.forwardRef<HTMLDivElement, LeftProps>(
588
599
 
589
600
  // Initialize from responsive defaultOpen once when uncontrolled and breakpoint ready
590
601
  const didInitFromDefaultOpenRef = React.useRef(false);
602
+ const propsOpen = (props as any).open;
603
+ const propsDefaultOpen = (props as any).defaultOpen;
591
604
  React.useEffect(() => {
592
605
  if (didInitFromDefaultOpenRef.current) return;
593
606
  if (!shell.currentBreakpointReady) return;
594
- if (typeof (props as any).open !== 'undefined') return; // controlled
595
- if (typeof (props as any).defaultOpen === 'undefined') return;
607
+ if (typeof propsOpen !== 'undefined') return; // controlled
608
+ if (typeof propsDefaultOpen === 'undefined') return;
596
609
  didInitFromDefaultOpenRef.current = true;
597
610
  const initial = Boolean(resolvedDefaultOpen);
598
611
  shell.setLeftMode(initial ? 'expanded' : 'collapsed');
599
612
  (props as any).onOpenChange?.(initial, { reason: 'init' });
600
- }, [shell.currentBreakpointReady, (props as any).open, (props as any).defaultOpen, resolvedDefaultOpen]);
613
+ }, [shell, propsOpen, propsDefaultOpen, resolvedDefaultOpen, props]);
601
614
  React.useEffect(() => {
602
615
  // Controlled Left via Rail.open
603
- if (typeof (props as any).open !== 'undefined') {
604
- const shouldOpen = Boolean((props as any).open);
616
+ if (typeof propsOpen !== 'undefined') {
617
+ const shouldOpen = Boolean(propsOpen);
605
618
  shell.setLeftMode(shouldOpen ? 'expanded' : 'collapsed');
606
619
  return;
607
620
  }
608
621
  // defaultOpen is applied in Rail; Left no longer follows responsive defaults
609
- }, [shell, (props as any).open]);
622
+ }, [shell, propsOpen]);
610
623
 
611
624
  // Sync controlled mode
612
625
  // removed mode sync
@@ -622,7 +635,7 @@ const Left = React.forwardRef<HTMLDivElement, LeftProps>(
622
635
  (props as any).onOpenChange?.(shell.leftMode === 'expanded', { reason: 'toggle' });
623
636
  }
624
637
  lastLeftModeRef.current = shell.leftMode;
625
- }, [shell.leftMode, resolvedDefaultOpen]);
638
+ }, [shell, resolvedDefaultOpen, props]);
626
639
 
627
640
  // Emit expand/collapse events
628
641
  React.useEffect(() => {
@@ -739,7 +752,6 @@ const Rail = React.forwardRef<HTMLDivElement, RailProps>(({ className, presentat
739
752
  const wasControlledRef = React.useRef<boolean | null>(null);
740
753
  if (process.env.NODE_ENV !== 'production') {
741
754
  if (typeof props.open !== 'undefined' && typeof props.defaultOpen !== 'undefined') {
742
- // eslint-disable-next-line no-console
743
755
  console.error('Shell.Rail: Do not pass both `open` and `defaultOpen`. Choose one.');
744
756
  }
745
757
  }
@@ -752,7 +764,6 @@ const Rail = React.forwardRef<HTMLDivElement, RailProps>(({ className, presentat
752
764
  return;
753
765
  }
754
766
  if (wasControlledRef.current !== isControlled) {
755
- // eslint-disable-next-line no-console
756
767
  console.warn('Shell.Rail: Switching between controlled and uncontrolled `open` is not supported.');
757
768
  wasControlledRef.current = isControlled;
758
769
  }
@@ -891,11 +902,9 @@ const Panel = React.forwardRef<HTMLDivElement, PanelPublicProps>(
891
902
  // Dev-only runtime guard
892
903
  if (process.env.NODE_ENV !== 'production') {
893
904
  if (typeof open !== 'undefined' && typeof defaultOpen !== 'undefined') {
894
- // eslint-disable-next-line no-console
895
905
  console.error('Shell.Panel: Do not pass both `open` and `defaultOpen`. Choose one.');
896
906
  }
897
907
  if (typeof size !== 'undefined' && typeof defaultSize !== 'undefined') {
898
- // eslint-disable-next-line no-console
899
908
  console.error('Shell.Panel: Do not pass both `size` and `defaultSize`. Choose one.');
900
909
  }
901
910
  }
@@ -924,14 +933,13 @@ const Panel = React.forwardRef<HTMLDivElement, PanelPublicProps>(
924
933
  } else {
925
934
  if (shell.panelMode !== 'collapsed') shell.setPanelMode('collapsed');
926
935
  }
927
- }, [open, shell.leftMode, shell.panelMode]);
936
+ }, [shell, open]);
928
937
 
929
938
  // Dev-only warning if switching controlled/uncontrolled between renders
930
939
  React.useEffect(() => {
931
940
  const isControlled = typeof open !== 'undefined';
932
941
  (Panel as any)._wasControlled = (Panel as any)._wasControlled ?? isControlled;
933
942
  if ((Panel as any)._wasControlled !== isControlled) {
934
- // eslint-disable-next-line no-console
935
943
  console.warn('Shell.Panel: Switching between controlled and uncontrolled `open` is not supported.');
936
944
  (Panel as any)._wasControlled = isControlled;
937
945
  }
@@ -1057,7 +1065,7 @@ const Panel = React.forwardRef<HTMLDivElement, PanelPublicProps>(
1057
1065
  localRef.current.style.setProperty('--panel-size', `${clamped}px`);
1058
1066
  emitSizeChange(clamped, { reason: 'controlled' });
1059
1067
  }
1060
- }, [size, minSize, maxSize, normalizeToPx]);
1068
+ }, [size, minSize, maxSize, normalizeToPx, emitSizeChange]);
1061
1069
 
1062
1070
  // Ensure Left container width is auto whenever Panel is expanded in fixed presentation
1063
1071
  React.useEffect(() => {
package/styles.css CHANGED
@@ -9671,7 +9671,7 @@
9671
9671
  -moz-column-gap: var(--space-2);
9672
9672
  column-gap: var(--space-2);
9673
9673
  padding: var(--space-3);
9674
- --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
9674
+ --callout-border-radius: max(var(--radius-1), var(--radius-full));
9675
9675
  --callout-icon-height: var(--line-height-1);
9676
9676
  --callout-icon-size: var(--content-icon-size-1);
9677
9677
  }
@@ -9680,7 +9680,7 @@
9680
9680
  -moz-column-gap: var(--space-3);
9681
9681
  column-gap: var(--space-3);
9682
9682
  padding: var(--space-4);
9683
- --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
9683
+ --callout-border-radius: max(var(--radius-2), var(--radius-full));
9684
9684
  --callout-icon-height: var(--line-height-2);
9685
9685
  --callout-icon-size: var(--content-icon-size-2);
9686
9686
  }
@@ -9689,7 +9689,7 @@
9689
9689
  -moz-column-gap: var(--space-4);
9690
9690
  column-gap: var(--space-4);
9691
9691
  padding: var(--space-5);
9692
- --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
9692
+ --callout-border-radius: max(var(--radius-3), var(--radius-full));
9693
9693
  --callout-icon-height: var(--line-height-3);
9694
9694
  --callout-icon-size: var(--content-icon-size-3);
9695
9695
  }
@@ -9698,7 +9698,7 @@
9698
9698
  -moz-column-gap: var(--space-5);
9699
9699
  column-gap: var(--space-5);
9700
9700
  padding: var(--space-6);
9701
- --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
9701
+ --callout-border-radius: max(var(--radius-4), var(--radius-full));
9702
9702
  --callout-icon-height: var(--line-height-4);
9703
9703
  --callout-icon-size: var(--content-icon-size-4);
9704
9704
  }
@@ -9707,7 +9707,7 @@
9707
9707
  -moz-column-gap: var(--space-6);
9708
9708
  column-gap: var(--space-6);
9709
9709
  padding: var(--space-7);
9710
- --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
9710
+ --callout-border-radius: max(var(--radius-5), var(--radius-full));
9711
9711
  --callout-icon-height: var(--line-height-5);
9712
9712
  --callout-icon-size: var(--content-icon-size-5);
9713
9713
  }
@@ -9717,7 +9717,7 @@
9717
9717
  -moz-column-gap: var(--space-2);
9718
9718
  column-gap: var(--space-2);
9719
9719
  padding: var(--space-3);
9720
- --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
9720
+ --callout-border-radius: max(var(--radius-1), var(--radius-full));
9721
9721
  --callout-icon-height: var(--line-height-1);
9722
9722
  --callout-icon-size: var(--content-icon-size-1);
9723
9723
  }
@@ -9726,7 +9726,7 @@
9726
9726
  -moz-column-gap: var(--space-3);
9727
9727
  column-gap: var(--space-3);
9728
9728
  padding: var(--space-4);
9729
- --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
9729
+ --callout-border-radius: max(var(--radius-2), var(--radius-full));
9730
9730
  --callout-icon-height: var(--line-height-2);
9731
9731
  --callout-icon-size: var(--content-icon-size-2);
9732
9732
  }
@@ -9735,7 +9735,7 @@
9735
9735
  -moz-column-gap: var(--space-4);
9736
9736
  column-gap: var(--space-4);
9737
9737
  padding: var(--space-5);
9738
- --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
9738
+ --callout-border-radius: max(var(--radius-3), var(--radius-full));
9739
9739
  --callout-icon-height: var(--line-height-3);
9740
9740
  --callout-icon-size: var(--content-icon-size-3);
9741
9741
  }
@@ -9744,7 +9744,7 @@
9744
9744
  -moz-column-gap: var(--space-5);
9745
9745
  column-gap: var(--space-5);
9746
9746
  padding: var(--space-6);
9747
- --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
9747
+ --callout-border-radius: max(var(--radius-4), var(--radius-full));
9748
9748
  --callout-icon-height: var(--line-height-4);
9749
9749
  --callout-icon-size: var(--content-icon-size-4);
9750
9750
  }
@@ -9753,7 +9753,7 @@
9753
9753
  -moz-column-gap: var(--space-6);
9754
9754
  column-gap: var(--space-6);
9755
9755
  padding: var(--space-7);
9756
- --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
9756
+ --callout-border-radius: max(var(--radius-5), var(--radius-full));
9757
9757
  --callout-icon-height: var(--line-height-5);
9758
9758
  --callout-icon-size: var(--content-icon-size-5);
9759
9759
  }
@@ -9764,7 +9764,7 @@
9764
9764
  -moz-column-gap: var(--space-2);
9765
9765
  column-gap: var(--space-2);
9766
9766
  padding: var(--space-3);
9767
- --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
9767
+ --callout-border-radius: max(var(--radius-1), var(--radius-full));
9768
9768
  --callout-icon-height: var(--line-height-1);
9769
9769
  --callout-icon-size: var(--content-icon-size-1);
9770
9770
  }
@@ -9773,7 +9773,7 @@
9773
9773
  -moz-column-gap: var(--space-3);
9774
9774
  column-gap: var(--space-3);
9775
9775
  padding: var(--space-4);
9776
- --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
9776
+ --callout-border-radius: max(var(--radius-2), var(--radius-full));
9777
9777
  --callout-icon-height: var(--line-height-2);
9778
9778
  --callout-icon-size: var(--content-icon-size-2);
9779
9779
  }
@@ -9782,7 +9782,7 @@
9782
9782
  -moz-column-gap: var(--space-4);
9783
9783
  column-gap: var(--space-4);
9784
9784
  padding: var(--space-5);
9785
- --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
9785
+ --callout-border-radius: max(var(--radius-3), var(--radius-full));
9786
9786
  --callout-icon-height: var(--line-height-3);
9787
9787
  --callout-icon-size: var(--content-icon-size-3);
9788
9788
  }
@@ -9791,7 +9791,7 @@
9791
9791
  -moz-column-gap: var(--space-5);
9792
9792
  column-gap: var(--space-5);
9793
9793
  padding: var(--space-6);
9794
- --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
9794
+ --callout-border-radius: max(var(--radius-4), var(--radius-full));
9795
9795
  --callout-icon-height: var(--line-height-4);
9796
9796
  --callout-icon-size: var(--content-icon-size-4);
9797
9797
  }
@@ -9800,7 +9800,7 @@
9800
9800
  -moz-column-gap: var(--space-6);
9801
9801
  column-gap: var(--space-6);
9802
9802
  padding: var(--space-7);
9803
- --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
9803
+ --callout-border-radius: max(var(--radius-5), var(--radius-full));
9804
9804
  --callout-icon-height: var(--line-height-5);
9805
9805
  --callout-icon-size: var(--content-icon-size-5);
9806
9806
  }
@@ -9811,7 +9811,7 @@
9811
9811
  -moz-column-gap: var(--space-2);
9812
9812
  column-gap: var(--space-2);
9813
9813
  padding: var(--space-3);
9814
- --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
9814
+ --callout-border-radius: max(var(--radius-1), var(--radius-full));
9815
9815
  --callout-icon-height: var(--line-height-1);
9816
9816
  --callout-icon-size: var(--content-icon-size-1);
9817
9817
  }
@@ -9820,7 +9820,7 @@
9820
9820
  -moz-column-gap: var(--space-3);
9821
9821
  column-gap: var(--space-3);
9822
9822
  padding: var(--space-4);
9823
- --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
9823
+ --callout-border-radius: max(var(--radius-2), var(--radius-full));
9824
9824
  --callout-icon-height: var(--line-height-2);
9825
9825
  --callout-icon-size: var(--content-icon-size-2);
9826
9826
  }
@@ -9829,7 +9829,7 @@
9829
9829
  -moz-column-gap: var(--space-4);
9830
9830
  column-gap: var(--space-4);
9831
9831
  padding: var(--space-5);
9832
- --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
9832
+ --callout-border-radius: max(var(--radius-3), var(--radius-full));
9833
9833
  --callout-icon-height: var(--line-height-3);
9834
9834
  --callout-icon-size: var(--content-icon-size-3);
9835
9835
  }
@@ -9838,7 +9838,7 @@
9838
9838
  -moz-column-gap: var(--space-5);
9839
9839
  column-gap: var(--space-5);
9840
9840
  padding: var(--space-6);
9841
- --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
9841
+ --callout-border-radius: max(var(--radius-4), var(--radius-full));
9842
9842
  --callout-icon-height: var(--line-height-4);
9843
9843
  --callout-icon-size: var(--content-icon-size-4);
9844
9844
  }
@@ -9847,7 +9847,7 @@
9847
9847
  -moz-column-gap: var(--space-6);
9848
9848
  column-gap: var(--space-6);
9849
9849
  padding: var(--space-7);
9850
- --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
9850
+ --callout-border-radius: max(var(--radius-5), var(--radius-full));
9851
9851
  --callout-icon-height: var(--line-height-5);
9852
9852
  --callout-icon-size: var(--content-icon-size-5);
9853
9853
  }
@@ -9858,7 +9858,7 @@
9858
9858
  -moz-column-gap: var(--space-2);
9859
9859
  column-gap: var(--space-2);
9860
9860
  padding: var(--space-3);
9861
- --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
9861
+ --callout-border-radius: max(var(--radius-1), var(--radius-full));
9862
9862
  --callout-icon-height: var(--line-height-1);
9863
9863
  --callout-icon-size: var(--content-icon-size-1);
9864
9864
  }
@@ -9867,7 +9867,7 @@
9867
9867
  -moz-column-gap: var(--space-3);
9868
9868
  column-gap: var(--space-3);
9869
9869
  padding: var(--space-4);
9870
- --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
9870
+ --callout-border-radius: max(var(--radius-2), var(--radius-full));
9871
9871
  --callout-icon-height: var(--line-height-2);
9872
9872
  --callout-icon-size: var(--content-icon-size-2);
9873
9873
  }
@@ -9876,7 +9876,7 @@
9876
9876
  -moz-column-gap: var(--space-4);
9877
9877
  column-gap: var(--space-4);
9878
9878
  padding: var(--space-5);
9879
- --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
9879
+ --callout-border-radius: max(var(--radius-3), var(--radius-full));
9880
9880
  --callout-icon-height: var(--line-height-3);
9881
9881
  --callout-icon-size: var(--content-icon-size-3);
9882
9882
  }
@@ -9885,7 +9885,7 @@
9885
9885
  -moz-column-gap: var(--space-5);
9886
9886
  column-gap: var(--space-5);
9887
9887
  padding: var(--space-6);
9888
- --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
9888
+ --callout-border-radius: max(var(--radius-4), var(--radius-full));
9889
9889
  --callout-icon-height: var(--line-height-4);
9890
9890
  --callout-icon-size: var(--content-icon-size-4);
9891
9891
  }
@@ -9894,7 +9894,7 @@
9894
9894
  -moz-column-gap: var(--space-6);
9895
9895
  column-gap: var(--space-6);
9896
9896
  padding: var(--space-7);
9897
- --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
9897
+ --callout-border-radius: max(var(--radius-5), var(--radius-full));
9898
9898
  --callout-icon-height: var(--line-height-5);
9899
9899
  --callout-icon-size: var(--content-icon-size-5);
9900
9900
  }
@@ -9905,7 +9905,7 @@
9905
9905
  -moz-column-gap: var(--space-2);
9906
9906
  column-gap: var(--space-2);
9907
9907
  padding: var(--space-3);
9908
- --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
9908
+ --callout-border-radius: max(var(--radius-1), var(--radius-full));
9909
9909
  --callout-icon-height: var(--line-height-1);
9910
9910
  --callout-icon-size: var(--content-icon-size-1);
9911
9911
  }
@@ -9914,7 +9914,7 @@
9914
9914
  -moz-column-gap: var(--space-3);
9915
9915
  column-gap: var(--space-3);
9916
9916
  padding: var(--space-4);
9917
- --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
9917
+ --callout-border-radius: max(var(--radius-2), var(--radius-full));
9918
9918
  --callout-icon-height: var(--line-height-2);
9919
9919
  --callout-icon-size: var(--content-icon-size-2);
9920
9920
  }
@@ -9923,7 +9923,7 @@
9923
9923
  -moz-column-gap: var(--space-4);
9924
9924
  column-gap: var(--space-4);
9925
9925
  padding: var(--space-5);
9926
- --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
9926
+ --callout-border-radius: max(var(--radius-3), var(--radius-full));
9927
9927
  --callout-icon-height: var(--line-height-3);
9928
9928
  --callout-icon-size: var(--content-icon-size-3);
9929
9929
  }
@@ -9932,7 +9932,7 @@
9932
9932
  -moz-column-gap: var(--space-5);
9933
9933
  column-gap: var(--space-5);
9934
9934
  padding: var(--space-6);
9935
- --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
9935
+ --callout-border-radius: max(var(--radius-4), var(--radius-full));
9936
9936
  --callout-icon-height: var(--line-height-4);
9937
9937
  --callout-icon-size: var(--content-icon-size-4);
9938
9938
  }
@@ -9941,7 +9941,7 @@
9941
9941
  -moz-column-gap: var(--space-6);
9942
9942
  column-gap: var(--space-6);
9943
9943
  padding: var(--space-7);
9944
- --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
9944
+ --callout-border-radius: max(var(--radius-5), var(--radius-full));
9945
9945
  --callout-icon-height: var(--line-height-5);
9946
9946
  --callout-icon-size: var(--content-icon-size-5);
9947
9947
  }
@@ -25002,7 +25002,7 @@
25002
25002
  }
25003
25003
  .rt-ChatbarBox:where(.rt-variant-outline){
25004
25004
  --text-area-selection-color: var(--focus-a5);
25005
- --text-area-focus-color: var(--focus-8);
25005
+ --text-area-focus-color: var(--focus-9);
25006
25006
  --text-area-border-width: 1px;
25007
25007
  box-shadow: inset 0 0 0 1px var(--accent-6);
25008
25008
  transition: var(--transition-background-blur);
@@ -25028,7 +25028,7 @@
25028
25028
  }
25029
25029
  .rt-ChatbarBox:where(.rt-variant-classic){
25030
25030
  --text-area-selection-color: var(--focus-a5);
25031
- --text-area-focus-color: var(--focus-8);
25031
+ --text-area-focus-color: var(--focus-9);
25032
25032
  --text-area-border-width: 0px;
25033
25033
  background-color: var(--color-surface-solid);
25034
25034
  box-shadow: var(--shadow-2);
@@ -25044,7 +25044,7 @@
25044
25044
  }
25045
25045
  }
25046
25046
  .rt-ChatbarBox:where(.rt-variant-classic):where(:focus-within){
25047
- box-shadow: var(--shadow-2), 0 0 0 2px var(--focus-8);
25047
+ box-shadow: var(--shadow-2), 0 0 0 2px var(--focus-9);
25048
25048
  }
25049
25049
  .rt-ChatbarBox:where(.rt-variant-soft){
25050
25050
  --text-area-selection-color: var(--accent-a5);