@seed-design/lynx-css 0.14.1 → 1.0.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.
Files changed (107) hide show
  1. package/all.css +936 -275
  2. package/all.min.css +1 -1
  3. package/base.css +10 -0
  4. package/base.min.css +1 -1
  5. package/package.json +2 -2
  6. package/recipes/alert-dialog.css +11 -0
  7. package/recipes/alert-dialog.d.ts +1 -1
  8. package/recipes/alert-dialog.mjs +8 -0
  9. package/recipes/app-bar.css +7 -3
  10. package/recipes/attachment-input-item.css +7 -0
  11. package/recipes/attachment-input.css +2 -1
  12. package/recipes/avatar-stack.css +69 -0
  13. package/recipes/avatar-stack.d.ts +24 -0
  14. package/recipes/avatar-stack.mjs +55 -0
  15. package/recipes/avatar.css +257 -0
  16. package/recipes/avatar.d.ts +28 -0
  17. package/recipes/avatar.mjs +82 -0
  18. package/recipes/badge.css +1 -9
  19. package/recipes/badge.d.ts +0 -4
  20. package/recipes/badge.mjs +1 -14
  21. package/recipes/bottom-sheet.css +33 -2
  22. package/recipes/bottom-sheet.d.ts +5 -1
  23. package/recipes/bottom-sheet.mjs +28 -2
  24. package/recipes/callout.css +1 -8
  25. package/recipes/checkbox.css +7 -1
  26. package/recipes/checkmark.css +17 -26
  27. package/recipes/checkmark.d.ts +1 -5
  28. package/recipes/checkmark.mjs +7 -60
  29. package/recipes/content-placeholder.css +29 -0
  30. package/recipes/content-placeholder.d.ts +21 -0
  31. package/recipes/content-placeholder.mjs +44 -0
  32. package/recipes/dialog.css +4 -2
  33. package/recipes/{input-button.css → field-button.css} +49 -49
  34. package/recipes/field-button.d.ts +40 -0
  35. package/recipes/{input-button.mjs → field-button.mjs} +20 -20
  36. package/recipes/floating-action-button.css +15 -8
  37. package/recipes/image-frame-icon.css +8 -0
  38. package/recipes/image-frame-icon.d.ts +19 -0
  39. package/recipes/image-frame-icon.mjs +22 -0
  40. package/recipes/image-frame-indicator.css +17 -0
  41. package/recipes/image-frame-indicator.d.ts +21 -0
  42. package/recipes/image-frame-indicator.mjs +36 -0
  43. package/recipes/image-frame-reaction-button.css +20 -0
  44. package/recipes/image-frame-reaction-button.d.ts +21 -0
  45. package/recipes/image-frame-reaction-button.mjs +40 -0
  46. package/recipes/image-frame.css +87 -0
  47. package/recipes/image-frame.d.ts +32 -0
  48. package/recipes/image-frame.mjs +72 -0
  49. package/recipes/list-item.css +0 -4
  50. package/recipes/list-item.d.ts +1 -1
  51. package/recipes/list-item.mjs +0 -4
  52. package/recipes/menu-sheet-item.css +5 -1
  53. package/recipes/menu-sheet.css +5 -0
  54. package/recipes/menu-sheet.d.ts +1 -1
  55. package/recipes/menu-sheet.mjs +4 -0
  56. package/recipes/menu.css +1 -13
  57. package/recipes/menu.d.ts +1 -1
  58. package/recipes/menu.mjs +0 -4
  59. package/recipes/page-banner.css +4 -4
  60. package/recipes/progress-circle.css +38 -4
  61. package/recipes/progress-circle.d.ts +1 -1
  62. package/recipes/progress-circle.mjs +1 -0
  63. package/recipes/pull-to-refresh.css +14 -0
  64. package/recipes/pull-to-refresh.d.ts +21 -0
  65. package/recipes/pull-to-refresh.mjs +40 -0
  66. package/recipes/reaction-button.css +0 -6
  67. package/recipes/reaction-button.d.ts +0 -4
  68. package/recipes/reaction-button.mjs +0 -11
  69. package/recipes/scroll-fog.css +4 -17
  70. package/recipes/scroll-fog.d.ts +1 -1
  71. package/recipes/scroll-fog.mjs +0 -8
  72. package/recipes/segmented-control.css +24 -14
  73. package/recipes/segmented-control.d.ts +4 -4
  74. package/recipes/segmented-control.mjs +8 -8
  75. package/recipes/select-box-checkmark.css +4 -7
  76. package/recipes/select-box.css +10 -4
  77. package/recipes/select-item.css +13 -2
  78. package/recipes/select-item.d.ts +1 -1
  79. package/recipes/select-item.mjs +4 -0
  80. package/recipes/select-trigger.css +13 -2
  81. package/recipes/select-trigger.d.ts +1 -1
  82. package/recipes/select-trigger.mjs +4 -0
  83. package/recipes/select.css +1 -13
  84. package/recipes/select.d.ts +1 -1
  85. package/recipes/select.mjs +0 -4
  86. package/recipes/slider-marker.css +2 -2
  87. package/recipes/slider-tick.css +1 -1
  88. package/recipes/slider.css +2 -5
  89. package/recipes/tabs.css +11 -11
  90. package/recipes/wheel-picker.css +151 -0
  91. package/recipes/wheel-picker.d.ts +32 -0
  92. package/recipes/wheel-picker.mjs +90 -0
  93. package/vars/component/alert-dialog.d.ts +2 -0
  94. package/vars/component/bottom-sheet.d.ts +3 -0
  95. package/vars/component/bottom-sheet.mjs +1 -0
  96. package/vars/component/dialog.d.ts +6 -2
  97. package/vars/component/help-bubble.d.ts +2 -1
  98. package/vars/component/menu-sheet.d.ts +5 -0
  99. package/vars/component/menu-sheet.mjs +1 -0
  100. package/vars/component/menu.d.ts +2 -1
  101. package/vars/component/page-banner-close-button.d.ts +4 -4
  102. package/vars/component/page-banner-close-button.mjs +4 -4
  103. package/vars/component/popover.d.ts +4 -4
  104. package/vars/component/select.d.ts +2 -1
  105. package/vars/component/side-panel.d.ts +10 -7
  106. package/vars/component/snackbar.d.ts +1 -0
  107. package/recipes/input-button.d.ts +0 -40
package/base.css CHANGED
@@ -2,6 +2,16 @@
2
2
  font-size: 16px;
3
3
  }
4
4
 
5
+ :root, :root.seed-user-color-scheme-light, :root.seed-color-mode-light-only, .seed-color-mode-light-only {
6
+ --seed-content-placeholder-preset-light-display: flex;
7
+ --seed-content-placeholder-preset-dark-display: none;
8
+ }
9
+
10
+ :root.seed-user-color-scheme-dark, :root.seed-color-mode-dark-only, .seed-color-mode-dark-only {
11
+ --seed-content-placeholder-preset-light-display: none;
12
+ --seed-content-placeholder-preset-dark-display: flex;
13
+ }
14
+
5
15
  text {
6
16
  background-color: var(--seed-color-bg-transparent);
7
17
  }
package/base.min.css CHANGED
@@ -1 +1 @@
1
- :root{font-size:16px}text{background-color:var(--seed-color-bg-transparent)}.seed-icon,.seed-prefix-icon,.seed-suffix-icon,.seed-icon-slot,.seed-prefix-icon-slot,.seed-suffix-icon-slot{flex-shrink:0;justify-content:center;align-items:center;display:flex}.seed-icon{width:var(--seed-icon-size);height:var(--seed-icon-size);color:var(--seed-icon-color,currentColor)}.seed-prefix-icon{width:var(--seed-prefix-icon-size);height:var(--seed-prefix-icon-size);color:var(--seed-prefix-icon-color,currentColor);margin-left:var(--seed-prefix-icon-margin-left,0);margin-right:var(--seed-prefix-icon-margin-right,0);margin-top:var(--seed-prefix-icon-margin-top,0);margin-bottom:var(--seed-prefix-icon-margin-bottom,0);align-self:var(--seed-prefix-icon-align-self);justify-self:var(--seed-prefix-icon-justify-self)}.seed-suffix-icon{width:var(--seed-suffix-icon-size);height:var(--seed-suffix-icon-size);color:var(--seed-suffix-icon-color,currentColor);margin-left:var(--seed-suffix-icon-margin-left,0);margin-right:var(--seed-suffix-icon-margin-right,0);margin-top:var(--seed-suffix-icon-margin-top,0);margin-bottom:var(--seed-suffix-icon-margin-bottom,0);align-self:var(--seed-suffix-icon-align-self);justify-self:var(--seed-suffix-icon-justify-self)}:root{--seed-dimension-x0_5:2px;--seed-dimension-x1:4px;--seed-dimension-x1_5:6px;--seed-dimension-x2:8px;--seed-dimension-x2_5:10px;--seed-dimension-x3:12px;--seed-dimension-x3_5:14px;--seed-dimension-x4:16px;--seed-dimension-x4_5:18px;--seed-dimension-x5:20px;--seed-dimension-x6:24px;--seed-dimension-x7:28px;--seed-dimension-x8:32px;--seed-dimension-x9:36px;--seed-dimension-x10:40px;--seed-dimension-x12:48px;--seed-dimension-x13:52px;--seed-dimension-x14:56px;--seed-dimension-x16:64px;--seed-dimension-spacing-x-between-chips:8px;--seed-dimension-spacing-x-global-gutter:16px;--seed-dimension-spacing-y-component-default:12px;--seed-dimension-spacing-y-nav-to-title:20px;--seed-dimension-spacing-y-screen-bottom:56px;--seed-dimension-spacing-y-between-text:6px;--seed-duration-d1:50ms;--seed-duration-d2:.1s;--seed-duration-d3:.15s;--seed-duration-d4:.2s;--seed-duration-d5:.25s;--seed-duration-d6:.3s;--seed-duration-color-transition:.15s;--seed-duration-pressed-scale:.15s;--seed-font-size-t1:11sp;--seed-font-size-t2:12sp;--seed-font-size-t3:13sp;--seed-font-size-t4:14sp;--seed-font-size-t5:16sp;--seed-font-size-t6:18sp;--seed-font-size-t7:20sp;--seed-font-size-t8:22sp;--seed-font-size-t9:24sp;--seed-font-size-t10:26sp;--seed-font-size-t11:28sp;--seed-font-size-t12:32sp;--seed-font-size-t13:40sp;--seed-font-size-t14:48sp;--seed-font-size-t1-static:11px;--seed-font-size-t2-static:12px;--seed-font-size-t3-static:13px;--seed-font-size-t4-static:14px;--seed-font-size-t5-static:16px;--seed-font-size-t6-static:18px;--seed-font-size-t7-static:20px;--seed-font-size-t8-static:22px;--seed-font-size-t9-static:24px;--seed-font-size-t10-static:26px;--seed-font-size-t11-static:28px;--seed-font-size-t12-static:32px;--seed-font-size-t13-static:40px;--seed-font-size-t14-static:48px;--seed-font-weight-regular:400;--seed-font-weight-medium:500;--seed-font-weight-bold:700;--seed-line-height-t1:15sp;--seed-line-height-t2:16sp;--seed-line-height-t3:18sp;--seed-line-height-t4:19sp;--seed-line-height-t5:22sp;--seed-line-height-t6:24sp;--seed-line-height-t7:27sp;--seed-line-height-t8:30sp;--seed-line-height-t9:32sp;--seed-line-height-t10:35sp;--seed-line-height-t11:38sp;--seed-line-height-t12:42sp;--seed-line-height-t13:52sp;--seed-line-height-t14:60sp;--seed-line-height-t1-static:15px;--seed-line-height-t2-static:16px;--seed-line-height-t3-static:18px;--seed-line-height-t4-static:19px;--seed-line-height-t5-static:22px;--seed-line-height-t6-static:24px;--seed-line-height-t7-static:27px;--seed-line-height-t8-static:30px;--seed-line-height-t9-static:32px;--seed-line-height-t10-static:35px;--seed-line-height-t11-static:38px;--seed-line-height-t12-static:42px;--seed-line-height-t13-static:52px;--seed-line-height-t14-static:60px;--seed-radius-r0_5:2px;--seed-radius-r1:4px;--seed-radius-r1_5:6px;--seed-radius-r2:8px;--seed-radius-r2_5:10px;--seed-radius-r3:12px;--seed-radius-r3_5:14px;--seed-radius-r4:16px;--seed-radius-r5:20px;--seed-radius-r6:24px;--seed-radius-full:9999px;--seed-timing-function-linear:cubic-bezier(0, 0, 1, 1);--seed-timing-function-easing:cubic-bezier(.35, 0, .35, 1);--seed-timing-function-enter:cubic-bezier(0, 0, .15, 1);--seed-timing-function-exit:cubic-bezier(.35, 0, 1, 1);--seed-timing-function-enter-expressive:cubic-bezier(.03, .4, .1, 1);--seed-timing-function-exit-expressive:cubic-bezier(.35, 0, .95, .55);--seed-timing-function-pressed-scale:cubic-bezier(0, 0, .15, 1)}:root,:root.seed-user-color-scheme-light,:root.seed-color-mode-light-only,.seed-color-mode-light-only{--seed-color-palette-gray-00:#fff;--seed-color-palette-gray-100:#f7f8f9;--seed-color-palette-gray-200:#f3f4f5;--seed-color-palette-gray-300:#eeeff1;--seed-color-palette-gray-400:#dcdee3;--seed-color-palette-gray-500:#d1d3d8;--seed-color-palette-gray-600:#b0b3ba;--seed-color-palette-gray-700:#868b94;--seed-color-palette-gray-800:#555d6d;--seed-color-palette-gray-900:#2a3038;--seed-color-palette-gray-1000:#1a1c20;--seed-color-palette-carrot-100:#fff2ec;--seed-color-palette-carrot-200:#ffe8db;--seed-color-palette-carrot-300:#ffd5c0;--seed-color-palette-carrot-400:#ffb999;--seed-color-palette-carrot-500:#ff9364;--seed-color-palette-carrot-600:#f60;--seed-color-palette-carrot-700:#e14d00;--seed-color-palette-carrot-800:#b93901;--seed-color-palette-carrot-900:#862b00;--seed-color-palette-carrot-1000:#471601;--seed-color-palette-blue-100:#eff6ff;--seed-color-palette-blue-200:#e2edfc;--seed-color-palette-blue-300:#cbdffa;--seed-color-palette-blue-400:#aacefd;--seed-color-palette-blue-500:#85b8fd;--seed-color-palette-blue-600:#5e98fe;--seed-color-palette-blue-700:#217cf9;--seed-color-palette-blue-800:#135fcd;--seed-color-palette-blue-900:#0b4596;--seed-color-palette-blue-1000:#032451;--seed-color-palette-red-100:#fdf0f0;--seed-color-palette-red-200:#fde7e7;--seed-color-palette-red-300:#fed4d2;--seed-color-palette-red-400:#feb7b3;--seed-color-palette-red-500:#fe928d;--seed-color-palette-red-600:#fc6a66;--seed-color-palette-red-700:#fa342c;--seed-color-palette-red-800:#ca1d13;--seed-color-palette-red-900:#921708;--seed-color-palette-red-1000:#4a1209;--seed-color-palette-green-100:#edfaf6;--seed-color-palette-green-200:#d9f6e9;--seed-color-palette-green-300:#b9e9d2;--seed-color-palette-green-400:#7ddcb3;--seed-color-palette-green-500:#42c593;--seed-color-palette-green-600:#10ab7d;--seed-color-palette-green-700:#079171;--seed-color-palette-green-800:#00745f;--seed-color-palette-green-900:#075445;--seed-color-palette-green-1000:#0a2b24;--seed-color-palette-yellow-100:#fff7de;--seed-color-palette-yellow-200:#fdefb9;--seed-color-palette-yellow-300:#fbdc65;--seed-color-palette-yellow-400:#e9c647;--seed-color-palette-yellow-500:#d4ab28;--seed-color-palette-yellow-600:#c49725;--seed-color-palette-yellow-700:#9b7821;--seed-color-palette-yellow-800:#755b22;--seed-color-palette-yellow-900:#4f3e1f;--seed-color-palette-yellow-1000:#2c2512;--seed-color-palette-purple-100:#f5f3fe;--seed-color-palette-purple-200:#efeafe;--seed-color-palette-purple-300:#e1d8ff;--seed-color-palette-purple-400:#d0c0ff;--seed-color-palette-purple-500:#b8a1ff;--seed-color-palette-purple-600:#9f84fb;--seed-color-palette-purple-700:#8969ea;--seed-color-palette-purple-800:#6d50cb;--seed-color-palette-purple-900:#50379b;--seed-color-palette-purple-1000:#29175d;--seed-color-palette-static-black:#000;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white:#fff;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-fg-brand:#f60;--seed-color-fg-brand-contrast:#e14d00;--seed-color-fg-critical:#fa342c;--seed-color-fg-critical-contrast:#921708;--seed-color-fg-disabled:#d1d3d8;--seed-color-fg-informative:#217cf9;--seed-color-fg-informative-contrast:#0b4596;--seed-color-fg-neutral:#1a1c20;--seed-color-fg-neutral-inverted:#fff;--seed-color-fg-neutral-muted:#555d6d;--seed-color-fg-neutral-subtle:#868b94;--seed-color-fg-on-brand-solid:#fff;--seed-color-fg-on-critical-solid:#fff;--seed-color-fg-on-informative-solid:#fff;--seed-color-fg-on-neutral-solid:#fff;--seed-color-fg-on-positive-solid:#fff;--seed-color-fg-on-warning-solid:#000000d0;--seed-color-fg-placeholder:#b0b3ba;--seed-color-fg-positive:#079171;--seed-color-fg-positive-contrast:#075445;--seed-color-fg-warning:#9b7821;--seed-color-fg-warning-contrast:#4f3e1f;--seed-color-bg-brand-solid:#f60;--seed-color-bg-brand-solid-pressed:#e14d00;--seed-color-bg-brand-weak:#fff2ec;--seed-color-bg-brand-weak-pressed:#ffe8db;--seed-color-bg-critical-solid:#fa342c;--seed-color-bg-critical-solid-pressed:#ca1d13;--seed-color-bg-critical-weak:#fdf0f0;--seed-color-bg-critical-weak-pressed:#fde7e7;--seed-color-bg-disabled:#f3f4f5;--seed-color-bg-informative-solid:#217cf9;--seed-color-bg-informative-solid-pressed:#135fcd;--seed-color-bg-informative-weak:#eff6ff;--seed-color-bg-informative-weak-pressed:#e2edfc;--seed-color-bg-layer-basement:#f3f4f5;--seed-color-bg-layer-default:#fff;--seed-color-bg-layer-default-pressed:#f7f8f9;--seed-color-bg-layer-floating:#fff;--seed-color-bg-layer-floating-pressed:#f7f8f9;--seed-color-bg-magic-weak:#f9f2ee;--seed-color-bg-neutral-inverted:#2a3038;--seed-color-bg-neutral-inverted-pressed:#555d6d;--seed-color-bg-neutral-muted:#f7f8f9;--seed-color-bg-neutral-solid:#2a3038;--seed-color-bg-neutral-solid-pressed:#555d6d;--seed-color-bg-neutral-solid-muted:#555d6d;--seed-color-bg-neutral-solid-muted-pressed:#2a3038;--seed-color-bg-neutral-subtle:#fff;--seed-color-bg-neutral-weak:#f3f4f5;--seed-color-bg-neutral-weak-alpha:#0000000c;--seed-color-bg-neutral-weak-alpha-pressed:#00000010;--seed-color-bg-neutral-weak-pressed:#eeeff1;--seed-color-bg-overlay:#00000074;--seed-color-bg-overlay-muted:#0000002c;--seed-color-bg-positive-solid:#079171;--seed-color-bg-positive-solid-pressed:#00745f;--seed-color-bg-positive-weak:#edfaf6;--seed-color-bg-positive-weak-pressed:#d9f6e9;--seed-color-bg-transparent:#0000;--seed-color-bg-transparent-pressed:#00000007;--seed-color-bg-transparent-selected:#0000000c;--seed-color-bg-transparent-selected-pressed:#00000010;--seed-color-bg-warning-solid:#fbdc65;--seed-color-bg-warning-solid-pressed:#e9c647;--seed-color-bg-warning-weak:#fff7de;--seed-color-bg-warning-weak-pressed:#fdefb9;--seed-color-stroke-brand-solid:#e14d00;--seed-color-stroke-brand-weak:#ffd5c0;--seed-color-stroke-critical-solid:#fa342c;--seed-color-stroke-critical-weak:#fed4d2;--seed-color-stroke-focus-ring:#5e98fe;--seed-color-stroke-informative-solid:#217cf9;--seed-color-stroke-informative-weak:#cbdffa;--seed-color-stroke-neutral-contrast:#1a1c20;--seed-color-stroke-neutral-muted:#00000010;--seed-color-stroke-neutral-solid:#555d6d;--seed-color-stroke-neutral-subtle:#0000000c;--seed-color-stroke-neutral-weak:#dcdee3;--seed-color-stroke-positive-solid:#079171;--seed-color-stroke-positive-weak:#b9e9d2;--seed-color-stroke-warning-solid:#9b7821;--seed-color-stroke-warning-weak:#fbdc65;--seed-color-manner-temp-l1-bg:#f1f2f3;--seed-color-manner-temp-l1-text:#757b85;--seed-color-manner-temp-l10-bg:#ffebee;--seed-color-manner-temp-l10-text:#cb0123;--seed-color-manner-temp-l2-bg:#f8f4ec;--seed-color-manner-temp-l2-text:#ab863f;--seed-color-manner-temp-l3-bg:#fff5e5;--seed-color-manner-temp-l3-text:#e08a00;--seed-color-manner-temp-l4-bg:#fff3e5;--seed-color-manner-temp-l4-text:#f57e00;--seed-color-manner-temp-l5-bg:#fff1e5;--seed-color-manner-temp-l5-text:#ff7300;--seed-color-manner-temp-l6-bg:#fff0e5;--seed-color-manner-temp-l6-text:#f60;--seed-color-manner-temp-l7-bg:#ffefe5;--seed-color-manner-temp-l7-text:#ff5100;--seed-color-manner-temp-l8-bg:#ffeee5;--seed-color-manner-temp-l8-text:#f30;--seed-color-manner-temp-l9-bg:#fdeded;--seed-color-manner-temp-l9-text:#e82c45;--seed-color-banner-blue:#e1f7ff;--seed-color-banner-cool-gray:#ebf1f5;--seed-color-banner-green:#f0fbe5;--seed-color-banner-orange:#fff2e1;--seed-color-banner-pink:#ffebf1;--seed-color-banner-purple:#f5ecff;--seed-color-banner-red:#ffecee;--seed-color-banner-teal:#e6faf6;--seed-color-banner-warm-gray:#f2f0ee;--seed-color-banner-yellow:#fffae1;--seed-gradient-fade-mask:#0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;--seed-gradient-glow-magic:#fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;--seed-gradient-glow-magic-pressed:#fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;--seed-gradient-highlight-magic:#f60 20%, #d25aca 100%;--seed-gradient-highlight-magic-pressed:#e14f00 20%, #ae58bf 100%;--seed-gradient-shimmer-magic:#fff9f500 0%, #fff9f5cc 46%, #fff9f5cc 54%, #fff9f500 100%;--seed-gradient-shimmer-neutral:#fff0 0%, #ffffffab 46%, #ffffffab 54%, #fff0 100%;--seed-shadow-s1:0px 1px 4px 0px #00000014;--seed-shadow-s2:0px 2px 10px 0px #0000001a;--seed-shadow-s3:0px 4px 16px 0px #0000001f}:root.seed-user-color-scheme-dark,:root.seed-color-mode-dark-only,.seed-color-mode-dark-only{--seed-color-palette-gray-00:#000;--seed-color-palette-gray-100:#16171b;--seed-color-palette-gray-200:#1d2025;--seed-color-palette-gray-300:#2b2e35;--seed-color-palette-gray-400:#393d46;--seed-color-palette-gray-500:#5b606a;--seed-color-palette-gray-600:#868b94;--seed-color-palette-gray-700:#b0b3ba;--seed-color-palette-gray-800:#dcdee3;--seed-color-palette-gray-900:#e9eaec;--seed-color-palette-gray-1000:#f3f4f5;--seed-color-palette-carrot-100:#31241f;--seed-color-palette-carrot-200:#4b291c;--seed-color-palette-carrot-300:#6b311c;--seed-color-palette-carrot-400:#923600;--seed-color-palette-carrot-500:#bd4201;--seed-color-palette-carrot-600:#e65200;--seed-color-palette-carrot-700:#f60;--seed-color-palette-carrot-800:#ff9e65;--seed-color-palette-carrot-900:#eecebc;--seed-color-palette-carrot-1000:#f4eeea;--seed-color-palette-blue-100:#202742;--seed-color-palette-blue-200:#1e3352;--seed-color-palette-blue-300:#1a4275;--seed-color-palette-blue-400:#0f559e;--seed-color-palette-blue-500:#1964d8;--seed-color-palette-blue-600:#1e82eb;--seed-color-palette-blue-700:#41a2f9;--seed-color-palette-blue-800:#83bcf9;--seed-color-palette-blue-900:#b9d7fb;--seed-color-palette-blue-1000:#e5f0fe;--seed-color-palette-red-100:#322323;--seed-color-palette-red-200:#4f2624;--seed-color-palette-red-300:#742826;--seed-color-palette-red-400:#a12621;--seed-color-palette-red-500:#ca2319;--seed-color-palette-red-600:#f73526;--seed-color-palette-red-700:#ff6e60;--seed-color-palette-red-800:#ffa299;--seed-color-palette-red-900:#f8c5c3;--seed-color-palette-red-1000:#fdf2f2;--seed-color-palette-green-100:#202926;--seed-color-palette-green-200:#20362e;--seed-color-palette-green-300:#20493b;--seed-color-palette-green-400:#19604c;--seed-color-palette-green-500:#117956;--seed-color-palette-green-600:#1b946d;--seed-color-palette-green-700:#22b27f;--seed-color-palette-green-800:#35ce9a;--seed-color-palette-green-900:#93e5c0;--seed-color-palette-green-1000:#d4f6ef;--seed-color-palette-yellow-100:#302819;--seed-color-palette-yellow-200:#413218;--seed-color-palette-yellow-300:#543e15;--seed-color-palette-yellow-400:#714e15;--seed-color-palette-yellow-500:#91601b;--seed-color-palette-yellow-600:#b6720d;--seed-color-palette-yellow-700:#ca901c;--seed-color-palette-yellow-800:#dab156;--seed-color-palette-yellow-900:#e5d49b;--seed-color-palette-yellow-1000:#f7f0cd;--seed-color-palette-purple-100:#28213b;--seed-color-palette-purple-200:#3b2873;--seed-color-palette-purple-300:#443081;--seed-color-palette-purple-400:#5a3bb1;--seed-color-palette-purple-500:#764fd9;--seed-color-palette-purple-600:#8e6bee;--seed-color-palette-purple-700:#a78df0;--seed-color-palette-purple-800:#beadf2;--seed-color-palette-purple-900:#d9cefa;--seed-color-palette-purple-1000:#f0edfc;--seed-color-palette-static-black:#000;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white:#fff;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-fg-brand:#f60;--seed-color-fg-brand-contrast:#f60;--seed-color-fg-critical:#ff6e60;--seed-color-fg-critical-contrast:#f8c5c3;--seed-color-fg-disabled:#5b606a;--seed-color-fg-informative:#41a2f9;--seed-color-fg-informative-contrast:#b9d7fb;--seed-color-fg-neutral:#f3f4f5;--seed-color-fg-neutral-inverted:#16171b;--seed-color-fg-neutral-muted:#dcdee3;--seed-color-fg-neutral-subtle:#b0b3ba;--seed-color-fg-on-brand-solid:#fff;--seed-color-fg-on-critical-solid:#fff;--seed-color-fg-on-informative-solid:#fff;--seed-color-fg-on-neutral-solid:#16171b;--seed-color-fg-on-positive-solid:#fff;--seed-color-fg-on-warning-solid:#000000d0;--seed-color-fg-placeholder:#868b94;--seed-color-fg-positive:#22b27f;--seed-color-fg-positive-contrast:#93e5c0;--seed-color-fg-warning:#ca901c;--seed-color-fg-warning-contrast:#e5d49b;--seed-color-bg-brand-solid:#f60;--seed-color-bg-brand-solid-pressed:#ff9e65;--seed-color-bg-brand-weak:#31241f;--seed-color-bg-brand-weak-pressed:#4b291c;--seed-color-bg-critical-solid:#f73526;--seed-color-bg-critical-solid-pressed:#ff6e60;--seed-color-bg-critical-weak:#322323;--seed-color-bg-critical-weak-pressed:#4f2624;--seed-color-bg-disabled:#2b2e35;--seed-color-bg-informative-solid:#1e82eb;--seed-color-bg-informative-solid-pressed:#41a2f9;--seed-color-bg-informative-weak:#202742;--seed-color-bg-informative-weak-pressed:#1e3352;--seed-color-bg-layer-basement:#000;--seed-color-bg-layer-default:#16171b;--seed-color-bg-layer-default-pressed:#2b2e35;--seed-color-bg-layer-floating:#1d2025;--seed-color-bg-layer-floating-pressed:#2b2e35;--seed-color-bg-magic-weak:#201f1f;--seed-color-bg-neutral-inverted:#f3f4f5;--seed-color-bg-neutral-inverted-pressed:#dcdee3;--seed-color-bg-neutral-muted:#1d2025;--seed-color-bg-neutral-solid:#f3f4f5;--seed-color-bg-neutral-solid-pressed:#dcdee3;--seed-color-bg-neutral-solid-muted:#393d46;--seed-color-bg-neutral-solid-muted-pressed:#5b606a;--seed-color-bg-neutral-subtle:#16171b;--seed-color-bg-neutral-weak:#2b2e35;--seed-color-bg-neutral-weak-alpha:#ffffff20;--seed-color-bg-neutral-weak-alpha-pressed:#ffffff2e;--seed-color-bg-neutral-weak-pressed:#393d46;--seed-color-bg-overlay:#00000074;--seed-color-bg-overlay-muted:#0000002c;--seed-color-bg-positive-solid:#117956;--seed-color-bg-positive-solid-pressed:#1b946d;--seed-color-bg-positive-weak:#202926;--seed-color-bg-positive-weak-pressed:#20362e;--seed-color-bg-transparent:#fff0;--seed-color-bg-transparent-pressed:#ffffff0d;--seed-color-bg-transparent-selected:#ffffff17;--seed-color-bg-transparent-selected-pressed:#ffffff20;--seed-color-bg-warning-solid:#dab156;--seed-color-bg-warning-solid-pressed:#e5d49b;--seed-color-bg-warning-weak:#302819;--seed-color-bg-warning-weak-pressed:#413218;--seed-color-stroke-brand-solid:#f60;--seed-color-stroke-brand-weak:#6b311c;--seed-color-stroke-critical-solid:#ff6e60;--seed-color-stroke-critical-weak:#742826;--seed-color-stroke-focus-ring:#1e82eb;--seed-color-stroke-informative-solid:#41a2f9;--seed-color-stroke-informative-weak:#1a4275;--seed-color-stroke-neutral-contrast:#f3f4f5;--seed-color-stroke-neutral-muted:#ffffff17;--seed-color-stroke-neutral-solid:#dcdee3;--seed-color-stroke-neutral-subtle:#ffffff0d;--seed-color-stroke-neutral-weak:#393d46;--seed-color-stroke-positive-solid:#22b27f;--seed-color-stroke-positive-weak:#20493b;--seed-color-stroke-warning-solid:#ca901c;--seed-color-stroke-warning-weak:#543e15;--seed-color-manner-temp-l1-bg:#292929;--seed-color-manner-temp-l1-text:#b8b8b9;--seed-color-manner-temp-l10-bg:#34040a;--seed-color-manner-temp-l10-text:#fb6f82;--seed-color-manner-temp-l2-bg:#332605;--seed-color-manner-temp-l2-text:#f5db97;--seed-color-manner-temp-l3-bg:#372b01;--seed-color-manner-temp-l3-text:#fdda65;--seed-color-manner-temp-l4-bg:#372301;--seed-color-manner-temp-l4-text:#fbbe55;--seed-color-manner-temp-l5-bg:#371f01;--seed-color-manner-temp-l5-text:#faac4b;--seed-color-manner-temp-l6-bg:#351b03;--seed-color-manner-temp-l6-text:#fc9855;--seed-color-manner-temp-l7-bg:#371701;--seed-color-manner-temp-l7-text:#f97a25;--seed-color-manner-temp-l8-bg:#380f00;--seed-color-manner-temp-l8-text:#fe6a34;--seed-color-manner-temp-l9-bg:#380500;--seed-color-manner-temp-l9-text:#fe6a5d;--seed-color-banner-blue:#0d2a3a;--seed-color-banner-cool-gray:#242c33;--seed-color-banner-green:#1e361c;--seed-color-banner-orange:#42230a;--seed-color-banner-pink:#3b172c;--seed-color-banner-purple:#2e1e45;--seed-color-banner-red:#3a0f15;--seed-color-banner-teal:#143633;--seed-color-banner-warm-gray:#2f2b27;--seed-color-banner-yellow:#3e2b00;--seed-gradient-fade-mask:#0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;--seed-gradient-glow-magic:#2d252d 0%, #3a312b 80%, #333232 100%;--seed-gradient-glow-magic-pressed:#3e333e 0%, #51453e 80%, #434242 100%;--seed-gradient-highlight-magic:#f60 20%, #d25aca 100%;--seed-gradient-highlight-magic-pressed:#ff9e65 20%, #e89bee 100%;--seed-gradient-shimmer-magic:#fff9f500 0%, #fff9f51a 46%, #fff9f51a 54%, #fff9f500 100%;--seed-gradient-shimmer-neutral:#fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;--seed-shadow-s1:0px 1px 4px 0px #00000080;--seed-shadow-s2:0px 2px 10px 0px #000000ad;--seed-shadow-s3:0px 4px 16px 0px #000c}:root{--seed-scale-s95:.95;--seed-scale-s97:.97;--seed-scale-s98:.98}@keyframes seed-enter{0%{opacity:var(--seed-enter-opacity,1);transform:translate3d(var(--seed-enter-translate-x,0), var(--seed-enter-translate-y,0), 0) scale(var(--seed-enter-scale,1)) rotate(var(--seed-enter-rotate,0))}to{opacity:1;transform:translate(0,0)scale(1)rotate(0)}}@keyframes seed-exit{0%{opacity:1;transform:translate(0,0)scale(1)rotate(0)}to{opacity:var(--seed-exit-opacity,1);transform:translate3d(var(--seed-exit-translate-x,0), var(--seed-exit-translate-y,0), 0) scale(var(--seed-exit-scale,1)) rotate(var(--seed-exit-rotate,0))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slide-x{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{to{opacity:0}}@keyframes drawer-slide-from-bottom{0%{transform:translate3d(0, var(--seed-drawer-start-transform,100%), 0)}to{transform:translate3d(0, var(--snap-point-height,0), 0)}}@keyframes drawer-slide-to-bottom{to{transform:translate3d(0, var(--seed-drawer-start-transform,100%), 0)}}
1
+ :root{font-size:16px}:root,:root.seed-user-color-scheme-light,:root.seed-color-mode-light-only,.seed-color-mode-light-only{--seed-content-placeholder-preset-light-display:flex;--seed-content-placeholder-preset-dark-display:none}:root.seed-user-color-scheme-dark,:root.seed-color-mode-dark-only,.seed-color-mode-dark-only{--seed-content-placeholder-preset-light-display:none;--seed-content-placeholder-preset-dark-display:flex}text{background-color:var(--seed-color-bg-transparent)}.seed-icon,.seed-prefix-icon,.seed-suffix-icon,.seed-icon-slot,.seed-prefix-icon-slot,.seed-suffix-icon-slot{flex-shrink:0;justify-content:center;align-items:center;display:flex}.seed-icon{width:var(--seed-icon-size);height:var(--seed-icon-size);color:var(--seed-icon-color,currentColor)}.seed-prefix-icon{width:var(--seed-prefix-icon-size);height:var(--seed-prefix-icon-size);color:var(--seed-prefix-icon-color,currentColor);margin-left:var(--seed-prefix-icon-margin-left,0);margin-right:var(--seed-prefix-icon-margin-right,0);margin-top:var(--seed-prefix-icon-margin-top,0);margin-bottom:var(--seed-prefix-icon-margin-bottom,0);align-self:var(--seed-prefix-icon-align-self);justify-self:var(--seed-prefix-icon-justify-self)}.seed-suffix-icon{width:var(--seed-suffix-icon-size);height:var(--seed-suffix-icon-size);color:var(--seed-suffix-icon-color,currentColor);margin-left:var(--seed-suffix-icon-margin-left,0);margin-right:var(--seed-suffix-icon-margin-right,0);margin-top:var(--seed-suffix-icon-margin-top,0);margin-bottom:var(--seed-suffix-icon-margin-bottom,0);align-self:var(--seed-suffix-icon-align-self);justify-self:var(--seed-suffix-icon-justify-self)}:root{--seed-dimension-x0_5:2px;--seed-dimension-x1:4px;--seed-dimension-x1_5:6px;--seed-dimension-x2:8px;--seed-dimension-x2_5:10px;--seed-dimension-x3:12px;--seed-dimension-x3_5:14px;--seed-dimension-x4:16px;--seed-dimension-x4_5:18px;--seed-dimension-x5:20px;--seed-dimension-x6:24px;--seed-dimension-x7:28px;--seed-dimension-x8:32px;--seed-dimension-x9:36px;--seed-dimension-x10:40px;--seed-dimension-x12:48px;--seed-dimension-x13:52px;--seed-dimension-x14:56px;--seed-dimension-x16:64px;--seed-dimension-spacing-x-between-chips:8px;--seed-dimension-spacing-x-global-gutter:16px;--seed-dimension-spacing-y-component-default:12px;--seed-dimension-spacing-y-nav-to-title:20px;--seed-dimension-spacing-y-screen-bottom:56px;--seed-dimension-spacing-y-between-text:6px;--seed-duration-d1:50ms;--seed-duration-d2:.1s;--seed-duration-d3:.15s;--seed-duration-d4:.2s;--seed-duration-d5:.25s;--seed-duration-d6:.3s;--seed-duration-color-transition:.15s;--seed-duration-pressed-scale:.15s;--seed-font-size-t1:11sp;--seed-font-size-t2:12sp;--seed-font-size-t3:13sp;--seed-font-size-t4:14sp;--seed-font-size-t5:16sp;--seed-font-size-t6:18sp;--seed-font-size-t7:20sp;--seed-font-size-t8:22sp;--seed-font-size-t9:24sp;--seed-font-size-t10:26sp;--seed-font-size-t11:28sp;--seed-font-size-t12:32sp;--seed-font-size-t13:40sp;--seed-font-size-t14:48sp;--seed-font-size-t1-static:11px;--seed-font-size-t2-static:12px;--seed-font-size-t3-static:13px;--seed-font-size-t4-static:14px;--seed-font-size-t5-static:16px;--seed-font-size-t6-static:18px;--seed-font-size-t7-static:20px;--seed-font-size-t8-static:22px;--seed-font-size-t9-static:24px;--seed-font-size-t10-static:26px;--seed-font-size-t11-static:28px;--seed-font-size-t12-static:32px;--seed-font-size-t13-static:40px;--seed-font-size-t14-static:48px;--seed-font-weight-regular:400;--seed-font-weight-medium:500;--seed-font-weight-bold:700;--seed-line-height-t1:15sp;--seed-line-height-t2:16sp;--seed-line-height-t3:18sp;--seed-line-height-t4:19sp;--seed-line-height-t5:22sp;--seed-line-height-t6:24sp;--seed-line-height-t7:27sp;--seed-line-height-t8:30sp;--seed-line-height-t9:32sp;--seed-line-height-t10:35sp;--seed-line-height-t11:38sp;--seed-line-height-t12:42sp;--seed-line-height-t13:52sp;--seed-line-height-t14:60sp;--seed-line-height-t1-static:15px;--seed-line-height-t2-static:16px;--seed-line-height-t3-static:18px;--seed-line-height-t4-static:19px;--seed-line-height-t5-static:22px;--seed-line-height-t6-static:24px;--seed-line-height-t7-static:27px;--seed-line-height-t8-static:30px;--seed-line-height-t9-static:32px;--seed-line-height-t10-static:35px;--seed-line-height-t11-static:38px;--seed-line-height-t12-static:42px;--seed-line-height-t13-static:52px;--seed-line-height-t14-static:60px;--seed-radius-r0_5:2px;--seed-radius-r1:4px;--seed-radius-r1_5:6px;--seed-radius-r2:8px;--seed-radius-r2_5:10px;--seed-radius-r3:12px;--seed-radius-r3_5:14px;--seed-radius-r4:16px;--seed-radius-r5:20px;--seed-radius-r6:24px;--seed-radius-full:9999px;--seed-timing-function-linear:cubic-bezier(0, 0, 1, 1);--seed-timing-function-easing:cubic-bezier(.35, 0, .35, 1);--seed-timing-function-enter:cubic-bezier(0, 0, .15, 1);--seed-timing-function-exit:cubic-bezier(.35, 0, 1, 1);--seed-timing-function-enter-expressive:cubic-bezier(.03, .4, .1, 1);--seed-timing-function-exit-expressive:cubic-bezier(.35, 0, .95, .55);--seed-timing-function-pressed-scale:cubic-bezier(0, 0, .15, 1)}:root,:root.seed-user-color-scheme-light,:root.seed-color-mode-light-only,.seed-color-mode-light-only{--seed-color-palette-gray-00:#fff;--seed-color-palette-gray-100:#f7f8f9;--seed-color-palette-gray-200:#f3f4f5;--seed-color-palette-gray-300:#eeeff1;--seed-color-palette-gray-400:#dcdee3;--seed-color-palette-gray-500:#d1d3d8;--seed-color-palette-gray-600:#b0b3ba;--seed-color-palette-gray-700:#868b94;--seed-color-palette-gray-800:#555d6d;--seed-color-palette-gray-900:#2a3038;--seed-color-palette-gray-1000:#1a1c20;--seed-color-palette-carrot-100:#fff2ec;--seed-color-palette-carrot-200:#ffe8db;--seed-color-palette-carrot-300:#ffd5c0;--seed-color-palette-carrot-400:#ffb999;--seed-color-palette-carrot-500:#ff9364;--seed-color-palette-carrot-600:#f60;--seed-color-palette-carrot-700:#e14d00;--seed-color-palette-carrot-800:#b93901;--seed-color-palette-carrot-900:#862b00;--seed-color-palette-carrot-1000:#471601;--seed-color-palette-blue-100:#eff6ff;--seed-color-palette-blue-200:#e2edfc;--seed-color-palette-blue-300:#cbdffa;--seed-color-palette-blue-400:#aacefd;--seed-color-palette-blue-500:#85b8fd;--seed-color-palette-blue-600:#5e98fe;--seed-color-palette-blue-700:#217cf9;--seed-color-palette-blue-800:#135fcd;--seed-color-palette-blue-900:#0b4596;--seed-color-palette-blue-1000:#032451;--seed-color-palette-red-100:#fdf0f0;--seed-color-palette-red-200:#fde7e7;--seed-color-palette-red-300:#fed4d2;--seed-color-palette-red-400:#feb7b3;--seed-color-palette-red-500:#fe928d;--seed-color-palette-red-600:#fc6a66;--seed-color-palette-red-700:#fa342c;--seed-color-palette-red-800:#ca1d13;--seed-color-palette-red-900:#921708;--seed-color-palette-red-1000:#4a1209;--seed-color-palette-green-100:#edfaf6;--seed-color-palette-green-200:#d9f6e9;--seed-color-palette-green-300:#b9e9d2;--seed-color-palette-green-400:#7ddcb3;--seed-color-palette-green-500:#42c593;--seed-color-palette-green-600:#10ab7d;--seed-color-palette-green-700:#079171;--seed-color-palette-green-800:#00745f;--seed-color-palette-green-900:#075445;--seed-color-palette-green-1000:#0a2b24;--seed-color-palette-yellow-100:#fff7de;--seed-color-palette-yellow-200:#fdefb9;--seed-color-palette-yellow-300:#fbdc65;--seed-color-palette-yellow-400:#e9c647;--seed-color-palette-yellow-500:#d4ab28;--seed-color-palette-yellow-600:#c49725;--seed-color-palette-yellow-700:#9b7821;--seed-color-palette-yellow-800:#755b22;--seed-color-palette-yellow-900:#4f3e1f;--seed-color-palette-yellow-1000:#2c2512;--seed-color-palette-purple-100:#f5f3fe;--seed-color-palette-purple-200:#efeafe;--seed-color-palette-purple-300:#e1d8ff;--seed-color-palette-purple-400:#d0c0ff;--seed-color-palette-purple-500:#b8a1ff;--seed-color-palette-purple-600:#9f84fb;--seed-color-palette-purple-700:#8969ea;--seed-color-palette-purple-800:#6d50cb;--seed-color-palette-purple-900:#50379b;--seed-color-palette-purple-1000:#29175d;--seed-color-palette-static-black:#000;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white:#fff;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-fg-brand:#f60;--seed-color-fg-brand-contrast:#e14d00;--seed-color-fg-critical:#fa342c;--seed-color-fg-critical-contrast:#921708;--seed-color-fg-disabled:#d1d3d8;--seed-color-fg-informative:#217cf9;--seed-color-fg-informative-contrast:#0b4596;--seed-color-fg-neutral:#1a1c20;--seed-color-fg-neutral-inverted:#fff;--seed-color-fg-neutral-muted:#555d6d;--seed-color-fg-neutral-subtle:#868b94;--seed-color-fg-on-brand-solid:#fff;--seed-color-fg-on-critical-solid:#fff;--seed-color-fg-on-informative-solid:#fff;--seed-color-fg-on-neutral-solid:#fff;--seed-color-fg-on-positive-solid:#fff;--seed-color-fg-on-warning-solid:#000000d0;--seed-color-fg-placeholder:#b0b3ba;--seed-color-fg-positive:#079171;--seed-color-fg-positive-contrast:#075445;--seed-color-fg-warning:#9b7821;--seed-color-fg-warning-contrast:#4f3e1f;--seed-color-bg-brand-solid:#f60;--seed-color-bg-brand-solid-pressed:#e14d00;--seed-color-bg-brand-weak:#fff2ec;--seed-color-bg-brand-weak-pressed:#ffe8db;--seed-color-bg-critical-solid:#fa342c;--seed-color-bg-critical-solid-pressed:#ca1d13;--seed-color-bg-critical-weak:#fdf0f0;--seed-color-bg-critical-weak-pressed:#fde7e7;--seed-color-bg-disabled:#f3f4f5;--seed-color-bg-informative-solid:#217cf9;--seed-color-bg-informative-solid-pressed:#135fcd;--seed-color-bg-informative-weak:#eff6ff;--seed-color-bg-informative-weak-pressed:#e2edfc;--seed-color-bg-layer-basement:#f3f4f5;--seed-color-bg-layer-default:#fff;--seed-color-bg-layer-default-pressed:#f7f8f9;--seed-color-bg-layer-floating:#fff;--seed-color-bg-layer-floating-pressed:#f7f8f9;--seed-color-bg-magic-weak:#f9f2ee;--seed-color-bg-neutral-inverted:#2a3038;--seed-color-bg-neutral-inverted-pressed:#555d6d;--seed-color-bg-neutral-muted:#f7f8f9;--seed-color-bg-neutral-solid:#2a3038;--seed-color-bg-neutral-solid-pressed:#555d6d;--seed-color-bg-neutral-solid-muted:#555d6d;--seed-color-bg-neutral-solid-muted-pressed:#2a3038;--seed-color-bg-neutral-subtle:#fff;--seed-color-bg-neutral-weak:#f3f4f5;--seed-color-bg-neutral-weak-alpha:#0000000c;--seed-color-bg-neutral-weak-alpha-pressed:#00000010;--seed-color-bg-neutral-weak-pressed:#eeeff1;--seed-color-bg-overlay:#00000074;--seed-color-bg-overlay-muted:#0000002c;--seed-color-bg-positive-solid:#079171;--seed-color-bg-positive-solid-pressed:#00745f;--seed-color-bg-positive-weak:#edfaf6;--seed-color-bg-positive-weak-pressed:#d9f6e9;--seed-color-bg-transparent:#0000;--seed-color-bg-transparent-pressed:#00000007;--seed-color-bg-transparent-selected:#0000000c;--seed-color-bg-transparent-selected-pressed:#00000010;--seed-color-bg-warning-solid:#fbdc65;--seed-color-bg-warning-solid-pressed:#e9c647;--seed-color-bg-warning-weak:#fff7de;--seed-color-bg-warning-weak-pressed:#fdefb9;--seed-color-stroke-brand-solid:#e14d00;--seed-color-stroke-brand-weak:#ffd5c0;--seed-color-stroke-critical-solid:#fa342c;--seed-color-stroke-critical-weak:#fed4d2;--seed-color-stroke-focus-ring:#5e98fe;--seed-color-stroke-informative-solid:#217cf9;--seed-color-stroke-informative-weak:#cbdffa;--seed-color-stroke-neutral-contrast:#1a1c20;--seed-color-stroke-neutral-muted:#00000010;--seed-color-stroke-neutral-solid:#555d6d;--seed-color-stroke-neutral-subtle:#0000000c;--seed-color-stroke-neutral-weak:#dcdee3;--seed-color-stroke-positive-solid:#079171;--seed-color-stroke-positive-weak:#b9e9d2;--seed-color-stroke-warning-solid:#9b7821;--seed-color-stroke-warning-weak:#fbdc65;--seed-color-manner-temp-l1-bg:#f1f2f3;--seed-color-manner-temp-l1-text:#757b85;--seed-color-manner-temp-l10-bg:#ffebee;--seed-color-manner-temp-l10-text:#cb0123;--seed-color-manner-temp-l2-bg:#f8f4ec;--seed-color-manner-temp-l2-text:#ab863f;--seed-color-manner-temp-l3-bg:#fff5e5;--seed-color-manner-temp-l3-text:#e08a00;--seed-color-manner-temp-l4-bg:#fff3e5;--seed-color-manner-temp-l4-text:#f57e00;--seed-color-manner-temp-l5-bg:#fff1e5;--seed-color-manner-temp-l5-text:#ff7300;--seed-color-manner-temp-l6-bg:#fff0e5;--seed-color-manner-temp-l6-text:#f60;--seed-color-manner-temp-l7-bg:#ffefe5;--seed-color-manner-temp-l7-text:#ff5100;--seed-color-manner-temp-l8-bg:#ffeee5;--seed-color-manner-temp-l8-text:#f30;--seed-color-manner-temp-l9-bg:#fdeded;--seed-color-manner-temp-l9-text:#e82c45;--seed-color-banner-blue:#e1f7ff;--seed-color-banner-cool-gray:#ebf1f5;--seed-color-banner-green:#f0fbe5;--seed-color-banner-orange:#fff2e1;--seed-color-banner-pink:#ffebf1;--seed-color-banner-purple:#f5ecff;--seed-color-banner-red:#ffecee;--seed-color-banner-teal:#e6faf6;--seed-color-banner-warm-gray:#f2f0ee;--seed-color-banner-yellow:#fffae1;--seed-gradient-fade-mask:#0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;--seed-gradient-glow-magic:#fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;--seed-gradient-glow-magic-pressed:#fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;--seed-gradient-highlight-magic:#f60 20%, #d25aca 100%;--seed-gradient-highlight-magic-pressed:#e14f00 20%, #ae58bf 100%;--seed-gradient-shimmer-magic:#fff9f500 0%, #fff9f5cc 46%, #fff9f5cc 54%, #fff9f500 100%;--seed-gradient-shimmer-neutral:#fff0 0%, #ffffffab 46%, #ffffffab 54%, #fff0 100%;--seed-shadow-s1:0px 1px 4px 0px #00000014;--seed-shadow-s2:0px 2px 10px 0px #0000001a;--seed-shadow-s3:0px 4px 16px 0px #0000001f}:root.seed-user-color-scheme-dark,:root.seed-color-mode-dark-only,.seed-color-mode-dark-only{--seed-color-palette-gray-00:#000;--seed-color-palette-gray-100:#16171b;--seed-color-palette-gray-200:#1d2025;--seed-color-palette-gray-300:#2b2e35;--seed-color-palette-gray-400:#393d46;--seed-color-palette-gray-500:#5b606a;--seed-color-palette-gray-600:#868b94;--seed-color-palette-gray-700:#b0b3ba;--seed-color-palette-gray-800:#dcdee3;--seed-color-palette-gray-900:#e9eaec;--seed-color-palette-gray-1000:#f3f4f5;--seed-color-palette-carrot-100:#31241f;--seed-color-palette-carrot-200:#4b291c;--seed-color-palette-carrot-300:#6b311c;--seed-color-palette-carrot-400:#923600;--seed-color-palette-carrot-500:#bd4201;--seed-color-palette-carrot-600:#e65200;--seed-color-palette-carrot-700:#f60;--seed-color-palette-carrot-800:#ff9e65;--seed-color-palette-carrot-900:#eecebc;--seed-color-palette-carrot-1000:#f4eeea;--seed-color-palette-blue-100:#202742;--seed-color-palette-blue-200:#1e3352;--seed-color-palette-blue-300:#1a4275;--seed-color-palette-blue-400:#0f559e;--seed-color-palette-blue-500:#1964d8;--seed-color-palette-blue-600:#1e82eb;--seed-color-palette-blue-700:#41a2f9;--seed-color-palette-blue-800:#83bcf9;--seed-color-palette-blue-900:#b9d7fb;--seed-color-palette-blue-1000:#e5f0fe;--seed-color-palette-red-100:#322323;--seed-color-palette-red-200:#4f2624;--seed-color-palette-red-300:#742826;--seed-color-palette-red-400:#a12621;--seed-color-palette-red-500:#ca2319;--seed-color-palette-red-600:#f73526;--seed-color-palette-red-700:#ff6e60;--seed-color-palette-red-800:#ffa299;--seed-color-palette-red-900:#f8c5c3;--seed-color-palette-red-1000:#fdf2f2;--seed-color-palette-green-100:#202926;--seed-color-palette-green-200:#20362e;--seed-color-palette-green-300:#20493b;--seed-color-palette-green-400:#19604c;--seed-color-palette-green-500:#117956;--seed-color-palette-green-600:#1b946d;--seed-color-palette-green-700:#22b27f;--seed-color-palette-green-800:#35ce9a;--seed-color-palette-green-900:#93e5c0;--seed-color-palette-green-1000:#d4f6ef;--seed-color-palette-yellow-100:#302819;--seed-color-palette-yellow-200:#413218;--seed-color-palette-yellow-300:#543e15;--seed-color-palette-yellow-400:#714e15;--seed-color-palette-yellow-500:#91601b;--seed-color-palette-yellow-600:#b6720d;--seed-color-palette-yellow-700:#ca901c;--seed-color-palette-yellow-800:#dab156;--seed-color-palette-yellow-900:#e5d49b;--seed-color-palette-yellow-1000:#f7f0cd;--seed-color-palette-purple-100:#28213b;--seed-color-palette-purple-200:#3b2873;--seed-color-palette-purple-300:#443081;--seed-color-palette-purple-400:#5a3bb1;--seed-color-palette-purple-500:#764fd9;--seed-color-palette-purple-600:#8e6bee;--seed-color-palette-purple-700:#a78df0;--seed-color-palette-purple-800:#beadf2;--seed-color-palette-purple-900:#d9cefa;--seed-color-palette-purple-1000:#f0edfc;--seed-color-palette-static-black:#000;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white:#fff;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-fg-brand:#f60;--seed-color-fg-brand-contrast:#f60;--seed-color-fg-critical:#ff6e60;--seed-color-fg-critical-contrast:#f8c5c3;--seed-color-fg-disabled:#5b606a;--seed-color-fg-informative:#41a2f9;--seed-color-fg-informative-contrast:#b9d7fb;--seed-color-fg-neutral:#f3f4f5;--seed-color-fg-neutral-inverted:#16171b;--seed-color-fg-neutral-muted:#dcdee3;--seed-color-fg-neutral-subtle:#b0b3ba;--seed-color-fg-on-brand-solid:#fff;--seed-color-fg-on-critical-solid:#fff;--seed-color-fg-on-informative-solid:#fff;--seed-color-fg-on-neutral-solid:#16171b;--seed-color-fg-on-positive-solid:#fff;--seed-color-fg-on-warning-solid:#000000d0;--seed-color-fg-placeholder:#868b94;--seed-color-fg-positive:#22b27f;--seed-color-fg-positive-contrast:#93e5c0;--seed-color-fg-warning:#ca901c;--seed-color-fg-warning-contrast:#e5d49b;--seed-color-bg-brand-solid:#f60;--seed-color-bg-brand-solid-pressed:#ff9e65;--seed-color-bg-brand-weak:#31241f;--seed-color-bg-brand-weak-pressed:#4b291c;--seed-color-bg-critical-solid:#f73526;--seed-color-bg-critical-solid-pressed:#ff6e60;--seed-color-bg-critical-weak:#322323;--seed-color-bg-critical-weak-pressed:#4f2624;--seed-color-bg-disabled:#2b2e35;--seed-color-bg-informative-solid:#1e82eb;--seed-color-bg-informative-solid-pressed:#41a2f9;--seed-color-bg-informative-weak:#202742;--seed-color-bg-informative-weak-pressed:#1e3352;--seed-color-bg-layer-basement:#000;--seed-color-bg-layer-default:#16171b;--seed-color-bg-layer-default-pressed:#2b2e35;--seed-color-bg-layer-floating:#1d2025;--seed-color-bg-layer-floating-pressed:#2b2e35;--seed-color-bg-magic-weak:#201f1f;--seed-color-bg-neutral-inverted:#f3f4f5;--seed-color-bg-neutral-inverted-pressed:#dcdee3;--seed-color-bg-neutral-muted:#1d2025;--seed-color-bg-neutral-solid:#f3f4f5;--seed-color-bg-neutral-solid-pressed:#dcdee3;--seed-color-bg-neutral-solid-muted:#393d46;--seed-color-bg-neutral-solid-muted-pressed:#5b606a;--seed-color-bg-neutral-subtle:#16171b;--seed-color-bg-neutral-weak:#2b2e35;--seed-color-bg-neutral-weak-alpha:#ffffff20;--seed-color-bg-neutral-weak-alpha-pressed:#ffffff2e;--seed-color-bg-neutral-weak-pressed:#393d46;--seed-color-bg-overlay:#00000074;--seed-color-bg-overlay-muted:#0000002c;--seed-color-bg-positive-solid:#117956;--seed-color-bg-positive-solid-pressed:#1b946d;--seed-color-bg-positive-weak:#202926;--seed-color-bg-positive-weak-pressed:#20362e;--seed-color-bg-transparent:#fff0;--seed-color-bg-transparent-pressed:#ffffff0d;--seed-color-bg-transparent-selected:#ffffff17;--seed-color-bg-transparent-selected-pressed:#ffffff20;--seed-color-bg-warning-solid:#dab156;--seed-color-bg-warning-solid-pressed:#e5d49b;--seed-color-bg-warning-weak:#302819;--seed-color-bg-warning-weak-pressed:#413218;--seed-color-stroke-brand-solid:#f60;--seed-color-stroke-brand-weak:#6b311c;--seed-color-stroke-critical-solid:#ff6e60;--seed-color-stroke-critical-weak:#742826;--seed-color-stroke-focus-ring:#1e82eb;--seed-color-stroke-informative-solid:#41a2f9;--seed-color-stroke-informative-weak:#1a4275;--seed-color-stroke-neutral-contrast:#f3f4f5;--seed-color-stroke-neutral-muted:#ffffff17;--seed-color-stroke-neutral-solid:#dcdee3;--seed-color-stroke-neutral-subtle:#ffffff0d;--seed-color-stroke-neutral-weak:#393d46;--seed-color-stroke-positive-solid:#22b27f;--seed-color-stroke-positive-weak:#20493b;--seed-color-stroke-warning-solid:#ca901c;--seed-color-stroke-warning-weak:#543e15;--seed-color-manner-temp-l1-bg:#292929;--seed-color-manner-temp-l1-text:#b8b8b9;--seed-color-manner-temp-l10-bg:#34040a;--seed-color-manner-temp-l10-text:#fb6f82;--seed-color-manner-temp-l2-bg:#332605;--seed-color-manner-temp-l2-text:#f5db97;--seed-color-manner-temp-l3-bg:#372b01;--seed-color-manner-temp-l3-text:#fdda65;--seed-color-manner-temp-l4-bg:#372301;--seed-color-manner-temp-l4-text:#fbbe55;--seed-color-manner-temp-l5-bg:#371f01;--seed-color-manner-temp-l5-text:#faac4b;--seed-color-manner-temp-l6-bg:#351b03;--seed-color-manner-temp-l6-text:#fc9855;--seed-color-manner-temp-l7-bg:#371701;--seed-color-manner-temp-l7-text:#f97a25;--seed-color-manner-temp-l8-bg:#380f00;--seed-color-manner-temp-l8-text:#fe6a34;--seed-color-manner-temp-l9-bg:#380500;--seed-color-manner-temp-l9-text:#fe6a5d;--seed-color-banner-blue:#0d2a3a;--seed-color-banner-cool-gray:#242c33;--seed-color-banner-green:#1e361c;--seed-color-banner-orange:#42230a;--seed-color-banner-pink:#3b172c;--seed-color-banner-purple:#2e1e45;--seed-color-banner-red:#3a0f15;--seed-color-banner-teal:#143633;--seed-color-banner-warm-gray:#2f2b27;--seed-color-banner-yellow:#3e2b00;--seed-gradient-fade-mask:#0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;--seed-gradient-glow-magic:#2d252d 0%, #3a312b 80%, #333232 100%;--seed-gradient-glow-magic-pressed:#3e333e 0%, #51453e 80%, #434242 100%;--seed-gradient-highlight-magic:#f60 20%, #d25aca 100%;--seed-gradient-highlight-magic-pressed:#ff9e65 20%, #e89bee 100%;--seed-gradient-shimmer-magic:#fff9f500 0%, #fff9f51a 46%, #fff9f51a 54%, #fff9f500 100%;--seed-gradient-shimmer-neutral:#fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;--seed-shadow-s1:0px 1px 4px 0px #00000080;--seed-shadow-s2:0px 2px 10px 0px #000000ad;--seed-shadow-s3:0px 4px 16px 0px #000c}:root{--seed-scale-s95:.95;--seed-scale-s97:.97;--seed-scale-s98:.98}@keyframes seed-enter{0%{opacity:var(--seed-enter-opacity,1);transform:translate3d(var(--seed-enter-translate-x,0), var(--seed-enter-translate-y,0), 0) scale(var(--seed-enter-scale,1)) rotate(var(--seed-enter-rotate,0))}to{opacity:1;transform:translate(0,0)scale(1)rotate(0)}}@keyframes seed-exit{0%{opacity:1;transform:translate(0,0)scale(1)rotate(0)}to{opacity:var(--seed-exit-opacity,1);transform:translate3d(var(--seed-exit-translate-x,0), var(--seed-exit-translate-y,0), 0) scale(var(--seed-exit-scale,1)) rotate(var(--seed-exit-rotate,0))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slide-x{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{to{opacity:0}}@keyframes drawer-slide-from-bottom{0%{transform:translate3d(0, var(--seed-drawer-start-transform,100%), 0)}to{transform:translate3d(0, var(--snap-point-height,0), 0)}}@keyframes drawer-slide-to-bottom{to{transform:translate3d(0, var(--seed-drawer-start-transform,100%), 0)}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/lynx-css",
3
- "version": "0.14.1",
3
+ "version": "1.0.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
@@ -62,7 +62,7 @@
62
62
  "devDependencies": {
63
63
  "@seed-design/qvism-cli": "0.0.0",
64
64
  "@seed-design/lynx-qvism-preset": "0.0.0",
65
- "@seed-design/rootage-artifacts": "3.0.1"
65
+ "@seed-design/rootage-artifacts": "3.0.2"
66
66
  },
67
67
  "publishConfig": {
68
68
  "access": "public"
package/recipes/alert-dialog.css CHANGED
@@ -41,6 +41,8 @@
41
41
  z-index: calc(var(--dialog-z-index) + var(--layer-index, 0));
42
42
  background-color: var(--seed-color-bg-layer-floating);
43
43
  max-width: 272px;
44
+ max-height: 100%;
45
+ overflow: hidden;
44
46
  margin-top: var(--seed-dimension-x16);
45
47
  margin-right: var(--seed-dimension-x8);
46
48
  margin-bottom: var(--seed-dimension-x16);
@@ -65,6 +67,15 @@
65
67
  transition-duration: var(--seed-duration-d2);
66
68
  transition-timing-function: var(--seed-timing-function-exit);
67
69
  }
70
+ .seed-alert-dialog__scrollArea {
71
+ width: 100%;
72
+ flex-shrink: 1;
73
+ min-height: 0;
74
+ }
75
+ .seed-alert-dialog__scrollContent {
76
+ display: flex;
77
+ flex-direction: column;
78
+ }
68
79
  .seed-alert-dialog__header {
69
80
  display: flex;
70
81
  flex-direction: column;
package/recipes/alert-dialog.d.ts CHANGED
@@ -11,7 +11,7 @@ declare type AlertDialogVariantMap = {
11
11
 
12
12
  export declare type AlertDialogVariantProps = Partial<AlertDialogVariant>;
13
13
 
14
- export declare type AlertDialogSlotName = "positioner" | "backdrop" | "content" | "header" | "footer" | "action" | "title" | "description";
14
+ export declare type AlertDialogSlotName = "positioner" | "backdrop" | "content" | "scrollArea" | "scrollContent" | "header" | "footer" | "action" | "title" | "description";
15
15
 
16
16
  export declare const alertDialogVariantMap: AlertDialogVariantMap;
17
17
 
package/recipes/alert-dialog.mjs CHANGED
@@ -14,6 +14,14 @@ const alertDialogSlotNames = [
14
14
  "content",
15
15
  "seed-alert-dialog__content"
16
16
  ],
17
+ [
18
+ "scrollArea",
19
+ "seed-alert-dialog__scrollArea"
20
+ ],
21
+ [
22
+ "scrollContent",
23
+ "seed-alert-dialog__scrollContent"
24
+ ],
17
25
  [
18
26
  "header",
19
27
  "seed-alert-dialog__header"
package/recipes/app-bar.css CHANGED
@@ -1,6 +1,6 @@
1
1
  .seed-app-bar__root {
2
2
  position: relative;
3
- z-index: var(--z-index-app-bar);
3
+ z-index: 0;
4
4
  width: 100%;
5
5
  display: flex;
6
6
  flex-direction: row;
@@ -34,9 +34,13 @@
34
34
  align-items: center;
35
35
  justify-content: center;
36
36
  border-width: 0;
37
- background: #00000000;
38
37
  padding: 0;
39
- border-radius: var(--seed-radius-r1);
38
+ border-radius: var(--seed-radius-r2);
39
+ background-color: var(--seed-color-bg-transparent);
40
+ transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
41
+ }
42
+ .seed-app-bar__iconButton:active {
43
+ background-color: var(--seed-color-bg-transparent-pressed);
40
44
  }
41
45
  .seed-app-bar__iconButton.seed-app-bar__icon-button-edge-leading {
42
46
  margin-left: calc(-1 * (44px - 24px) / 2);
package/recipes/attachment-input-item.css CHANGED
@@ -3,6 +3,7 @@
3
3
  display: flex;
4
4
  width: 100%;
5
5
  height: 80px;
6
+ flex-shrink: 0;
6
7
  border-radius: var(--seed-radius-r3);
7
8
  background-color: transparent;
8
9
  transform: scale(1);
@@ -220,6 +221,12 @@
220
221
  .seed-attachment-input-item__size--readOnly_true {
221
222
  color: var(--seed-color-fg-disabled)
222
223
  }
224
+ .seed-attachment-input-item__removeButton--readOnly_true {
225
+ color: var(--seed-color-fg-disabled)
226
+ }
227
+ .seed-attachment-input-item__removeIcon--readOnly_true {
228
+ color: var(--seed-color-fg-disabled)
229
+ }
223
230
  .seed-attachment-input-item__root--dragging_true {
224
231
  transform: scale(var(--seed-scale-s98))
225
232
  }
package/recipes/attachment-input.css CHANGED
@@ -27,5 +27,6 @@
27
27
  gap: var(--seed-dimension-x2);
28
28
  flex-shrink: 0;
29
29
  padding: 0;
30
- margin: 0
30
+ margin: 0;
31
+ overflow: visible
31
32
  }
package/recipes/avatar-stack.css ADDED
@@ -0,0 +1,69 @@
1
+ .seed-avatar-stack__root {
2
+ display: flex;
3
+ flex-direction: row;
4
+ align-items: center
5
+ }
6
+ .seed-avatar-stack__item {
7
+ flex-shrink: 0;
8
+ border-radius: var(--seed-radius-full)
9
+ }
10
+ .seed-avatar-stack__item--size_20 {
11
+ box-shadow: 0 0 0 1px var(--seed-color-bg-layer-default)
12
+ }
13
+ .seed-avatar-stack__overlap--size_20 {
14
+ margin-left: -5px
15
+ }
16
+ .seed-avatar-stack__item--size_24 {
17
+ box-shadow: 0 0 0 1px var(--seed-color-bg-layer-default)
18
+ }
19
+ .seed-avatar-stack__overlap--size_24 {
20
+ margin-left: -6px
21
+ }
22
+ .seed-avatar-stack__item--size_36 {
23
+ box-shadow: 0 0 0 2px var(--seed-color-bg-layer-default)
24
+ }
25
+ .seed-avatar-stack__overlap--size_36 {
26
+ margin-left: -8px
27
+ }
28
+ .seed-avatar-stack__item--size_42 {
29
+ box-shadow: 0 0 0 2px var(--seed-color-bg-layer-default)
30
+ }
31
+ .seed-avatar-stack__overlap--size_42 {
32
+ margin-left: -10px
33
+ }
34
+ .seed-avatar-stack__item--size_48 {
35
+ box-shadow: 0 0 0 2px var(--seed-color-bg-layer-default)
36
+ }
37
+ .seed-avatar-stack__overlap--size_48 {
38
+ margin-left: -12px
39
+ }
40
+ .seed-avatar-stack__item--size_56 {
41
+ box-shadow: 0 0 0 3px var(--seed-color-bg-layer-default)
42
+ }
43
+ .seed-avatar-stack__overlap--size_56 {
44
+ margin-left: -13px
45
+ }
46
+ .seed-avatar-stack__item--size_64 {
47
+ box-shadow: 0 0 0 3px var(--seed-color-bg-layer-default)
48
+ }
49
+ .seed-avatar-stack__overlap--size_64 {
50
+ margin-left: -16px
51
+ }
52
+ .seed-avatar-stack__item--size_80 {
53
+ box-shadow: 0 0 0 4px var(--seed-color-bg-layer-default)
54
+ }
55
+ .seed-avatar-stack__overlap--size_80 {
56
+ margin-left: -20px
57
+ }
58
+ .seed-avatar-stack__item--size_96 {
59
+ box-shadow: 0 0 0 5px var(--seed-color-bg-layer-default)
60
+ }
61
+ .seed-avatar-stack__overlap--size_96 {
62
+ margin-left: -24px
63
+ }
64
+ .seed-avatar-stack__item--size_108 {
65
+ box-shadow: 0 0 0 5px var(--seed-color-bg-layer-default)
66
+ }
67
+ .seed-avatar-stack__overlap--size_108 {
68
+ margin-left: -27px
69
+ }
package/recipes/avatar-stack.d.ts ADDED
@@ -0,0 +1,24 @@
1
+ declare interface AvatarStackVariant {
2
+ /**
3
+ * @default 48
4
+ */
5
+ size: "20" | "24" | "36" | "42" | "48" | "56" | "64" | "80" | "96" | "108";
6
+ }
7
+
8
+ declare type AvatarStackVariantMap = {
9
+ [key in keyof AvatarStackVariant]: Array<AvatarStackVariant[key]>;
10
+ };
11
+
12
+ export declare type AvatarStackVariantProps = Partial<AvatarStackVariant>;
13
+
14
+ export declare type AvatarStackSlotName = "root" | "item" | "overlap";
15
+
16
+ export declare const avatarStackVariantMap: AvatarStackVariantMap;
17
+
18
+ export declare const avatarStack: ((
19
+ props?: AvatarStackVariantProps,
20
+ ) => Record<AvatarStackSlotName, string>) & {
21
+ splitVariantProps: <T extends AvatarStackVariantProps>(
22
+ props: T,
23
+ ) => [AvatarStackVariantProps, Omit<T, keyof AvatarStackVariantProps>];
24
+ }
package/recipes/avatar-stack.mjs ADDED
@@ -0,0 +1,55 @@
1
+ import './avatar-stack.css';
2
+ import { createClassName, mergeVariants, splitVariantProps } from "./shared.mjs";
3
+
4
+ const avatarStackSlotNames = [
5
+ [
6
+ "root",
7
+ "seed-avatar-stack__root"
8
+ ],
9
+ [
10
+ "item",
11
+ "seed-avatar-stack__item"
12
+ ],
13
+ [
14
+ "overlap",
15
+ "seed-avatar-stack__overlap"
16
+ ]
17
+ ];
18
+
19
+ const defaultVariant = {
20
+ "size": 48
21
+ };
22
+
23
+ const compoundVariants = [];
24
+
25
+ export const avatarStackVariantMap = {
26
+ "size": [
27
+ "20",
28
+ "24",
29
+ "36",
30
+ "42",
31
+ "48",
32
+ "56",
33
+ "64",
34
+ "80",
35
+ "96",
36
+ "108"
37
+ ]
38
+ };
39
+
40
+ export const avatarStackVariantKeys = Object.keys(avatarStackVariantMap);
41
+
42
+ export function avatarStack(props) {
43
+ return Object.fromEntries(
44
+ avatarStackSlotNames.map(([slot, className]) => {
45
+ return [
46
+ slot,
47
+ createClassName(className, mergeVariants(defaultVariant, props), compoundVariants),
48
+ ];
49
+ }),
50
+ );
51
+ }
52
+
53
+ Object.assign(avatarStack, { splitVariantProps: (props) => splitVariantProps(props, avatarStackVariantMap) });
54
+
55
+ // @recipe(seed): avatar-stack