@uipath/apollo-wind 2.31.1 → 2.32.1

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 (39) hide show
  1. package/dist/components/custom/panel-flow.cjs +3 -3
  2. package/dist/components/custom/panel-flow.d.ts +2 -0
  3. package/dist/components/custom/panel-flow.js +3 -3
  4. package/dist/components/forms/field-renderer.cjs +4 -1
  5. package/dist/components/forms/field-renderer.js +4 -1
  6. package/dist/components/ui/file-upload.cjs +22 -16
  7. package/dist/components/ui/file-upload.d.ts +19 -1
  8. package/dist/components/ui/file-upload.js +22 -16
  9. package/dist/components/ui/index.cjs +24 -24
  10. package/dist/components/ui/lockable-value-field/components/field-header.cjs +327 -0
  11. package/dist/components/ui/lockable-value-field/components/field-header.d.ts +19 -0
  12. package/dist/components/ui/lockable-value-field/components/field-header.js +293 -0
  13. package/dist/components/ui/lockable-value-field/components/lock-toggle-button.cjs +67 -0
  14. package/dist/components/ui/lockable-value-field/components/lock-toggle-button.d.ts +9 -0
  15. package/dist/components/ui/lockable-value-field/components/lock-toggle-button.js +33 -0
  16. package/dist/components/ui/lockable-value-field/components/mode-menu-item.cjs +63 -0
  17. package/dist/components/ui/lockable-value-field/components/mode-menu-item.d.ts +9 -0
  18. package/dist/components/ui/lockable-value-field/components/mode-menu-item.js +29 -0
  19. package/dist/components/ui/lockable-value-field/index.cjs +43 -0
  20. package/dist/components/ui/lockable-value-field/index.d.ts +3 -0
  21. package/dist/components/ui/lockable-value-field/index.js +3 -0
  22. package/dist/components/ui/lockable-value-field/lockable-value-field.cjs +264 -0
  23. package/dist/components/ui/lockable-value-field/lockable-value-field.d.ts +14 -0
  24. package/dist/components/ui/lockable-value-field/lockable-value-field.js +230 -0
  25. package/dist/components/ui/lockable-value-field/types.cjs +99 -0
  26. package/dist/components/ui/lockable-value-field/types.d.ts +78 -0
  27. package/dist/components/ui/lockable-value-field/types.js +62 -0
  28. package/dist/components/ui/lockable-value-field/utils.cjs +117 -0
  29. package/dist/components/ui/lockable-value-field/utils.d.ts +24 -0
  30. package/dist/components/ui/lockable-value-field/utils.js +68 -0
  31. package/dist/components/ui/multi-select.cjs +7 -3
  32. package/dist/components/ui/multi-select.d.ts +4 -0
  33. package/dist/components/ui/multi-select.js +7 -3
  34. package/dist/index.cjs +28 -18
  35. package/dist/index.d.ts +2 -0
  36. package/dist/index.js +2 -1
  37. package/dist/styles.css +665 -0
  38. package/dist/tailwind.css +1 -0
  39. package/package.json +2 -2
package/dist/styles.css CHANGED
@@ -560,6 +560,9 @@
560
560
  }
561
561
  }
562
562
  @layer utilities {
563
+ .\@container {
564
+ container-type: inline-size;
565
+ }
563
566
  .pointer-events-none {
564
567
  pointer-events: none;
565
568
  }
@@ -907,6 +910,12 @@
907
910
  -webkit-box-orient: vertical;
908
911
  -webkit-line-clamp: 1;
909
912
  }
913
+ .\!block {
914
+ display: block !important;
915
+ }
916
+ .\!hidden {
917
+ display: none !important;
918
+ }
910
919
  .block {
911
920
  display: block;
912
921
  }
@@ -955,6 +964,10 @@
955
964
  width: calc(var(--spacing) * 6);
956
965
  height: calc(var(--spacing) * 6);
957
966
  }
967
+ .size-7 {
968
+ width: calc(var(--spacing) * 7);
969
+ height: calc(var(--spacing) * 7);
970
+ }
958
971
  .size-8 {
959
972
  width: calc(var(--spacing) * 8);
960
973
  height: calc(var(--spacing) * 8);
@@ -3450,6 +3463,12 @@
3450
3463
  .p-px {
3451
3464
  padding: 1px;
3452
3465
  }
3466
+ .\!px-1\.5 {
3467
+ padding-inline: calc(var(--spacing) * 1.5) !important;
3468
+ }
3469
+ .\!px-2\.5 {
3470
+ padding-inline: calc(var(--spacing) * 2.5) !important;
3471
+ }
3453
3472
  .\[padding-inline\:var\(--mf-content-inset\,0px\)\] {
3454
3473
  padding-inline: var(--mf-content-inset,0px);
3455
3474
  }
@@ -3663,6 +3682,10 @@
3663
3682
  .font-sans {
3664
3683
  font-family: var(--font-sans);
3665
3684
  }
3685
+ .\!text-xs {
3686
+ font-size: var(--text-xs) !important;
3687
+ line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
3688
+ }
3666
3689
  .text-2xl {
3667
3690
  font-size: var(--text-2xl);
3668
3691
  line-height: var(--tw-leading, var(--text-2xl--line-height));
@@ -4196,6 +4219,9 @@
4196
4219
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
4197
4220
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4198
4221
  }
4222
+ .ring-brand {
4223
+ --tw-ring-color: var(--brand);
4224
+ }
4199
4225
  .ring-brand\/30 {
4200
4226
  --tw-ring-color: var(--brand);
4201
4227
  @supports (color: color-mix(in lab, red, red)) {
@@ -4321,6 +4347,11 @@
4321
4347
  rotate: 90deg;
4322
4348
  }
4323
4349
  }
4350
+ .group-focus-within\:opacity-100 {
4351
+ &:is(:where(.group):focus-within *) {
4352
+ opacity: 100%;
4353
+ }
4354
+ }
4324
4355
  .group-focus-within\/input\:bg-foreground-accent {
4325
4356
  &:is(:where(.group\/input):focus-within *) {
4326
4357
  background-color: var(--foreground-accent);
@@ -5412,6 +5443,11 @@
5412
5443
  }
5413
5444
  }
5414
5445
  }
5446
+ .has-\[\[aria-expanded\=true\]\]\:opacity-100 {
5447
+ &:has(*:is([aria-expanded=true])) {
5448
+ opacity: 100%;
5449
+ }
5450
+ }
5415
5451
  .has-\[\[data-slot\=input-group-control\]\:disabled\]\:cursor-not-allowed {
5416
5452
  &:has(*:is([data-slot=input-group-control]:disabled)) {
5417
5453
  cursor: not-allowed;
@@ -5723,6 +5759,11 @@
5723
5759
  translate: var(--tw-translate-x) var(--tw-translate-y);
5724
5760
  }
5725
5761
  }
5762
+ .data-\[state\=checked\]\:bg-brand {
5763
+ &[data-state="checked"] {
5764
+ background-color: var(--brand);
5765
+ }
5766
+ }
5726
5767
  .data-\[state\=checked\]\:bg-primary {
5727
5768
  &[data-state="checked"] {
5728
5769
  background-color: var(--primary);
@@ -5812,6 +5853,11 @@
5812
5853
  background-color: var(--ap-wind-border);
5813
5854
  }
5814
5855
  }
5856
+ .data-\[state\=unchecked\]\:bg-foreground-subtle {
5857
+ &[data-state="unchecked"] {
5858
+ background-color: var(--foreground-subtle);
5859
+ }
5860
+ }
5815
5861
  .data-\[variant\=default\]\:border {
5816
5862
  &[data-variant="default"] {
5817
5863
  border-style: var(--tw-border-style);
@@ -6045,6 +6091,21 @@
6045
6091
  grid-template-columns: 2fr 3fr 3fr;
6046
6092
  }
6047
6093
  }
6094
+ .\@max-\[259px\]\:block {
6095
+ @container (width < 259px) {
6096
+ display: block;
6097
+ }
6098
+ }
6099
+ .\@max-\[259px\]\:hidden {
6100
+ @container (width < 259px) {
6101
+ display: none;
6102
+ }
6103
+ }
6104
+ .\@max-\[259px\]\:px-1\.5 {
6105
+ @container (width < 259px) {
6106
+ padding-inline: calc(var(--spacing) * 1.5);
6107
+ }
6108
+ }
6048
6109
  .rtl\:rotate-180 {
6049
6110
  &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
6050
6111
  rotate: 180deg;
@@ -9044,6 +9105,610 @@ body.future-light, .future-light {
9044
9105
  --border: var(--border-future-light);
9045
9106
  color-scheme: light;
9046
9107
  }
9108
+ html[dir='ltr'], [data-sonner-toaster][dir='ltr'] {
9109
+ --toast-icon-margin-start: -3px;
9110
+ --toast-icon-margin-end: 4px;
9111
+ --toast-svg-margin-start: -1px;
9112
+ --toast-svg-margin-end: 0px;
9113
+ --toast-button-margin-start: auto;
9114
+ --toast-button-margin-end: 0;
9115
+ --toast-close-button-start: 0;
9116
+ --toast-close-button-end: unset;
9117
+ --toast-close-button-transform: translate(-35%, -35%);
9118
+ }
9119
+ html[dir='rtl'], [data-sonner-toaster][dir='rtl'] {
9120
+ --toast-icon-margin-start: 4px;
9121
+ --toast-icon-margin-end: -3px;
9122
+ --toast-svg-margin-start: 0px;
9123
+ --toast-svg-margin-end: -1px;
9124
+ --toast-button-margin-start: 0;
9125
+ --toast-button-margin-end: auto;
9126
+ --toast-close-button-start: unset;
9127
+ --toast-close-button-end: 0;
9128
+ --toast-close-button-transform: translate(35%, -35%);
9129
+ }
9130
+ [data-sonner-toaster] {
9131
+ position: fixed;
9132
+ width: var(--width);
9133
+ font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
9134
+ --gray1: hsl(0, 0%, 99%);
9135
+ --gray2: hsl(0, 0%, 97.3%);
9136
+ --gray3: hsl(0, 0%, 95.1%);
9137
+ --gray4: hsl(0, 0%, 93%);
9138
+ --gray5: hsl(0, 0%, 90.9%);
9139
+ --gray6: hsl(0, 0%, 88.7%);
9140
+ --gray7: hsl(0, 0%, 85.8%);
9141
+ --gray8: hsl(0, 0%, 78%);
9142
+ --gray9: hsl(0, 0%, 56.1%);
9143
+ --gray10: hsl(0, 0%, 52.3%);
9144
+ --gray11: hsl(0, 0%, 43.5%);
9145
+ --gray12: hsl(0, 0%, 9%);
9146
+ --border-radius: 8px;
9147
+ box-sizing: border-box;
9148
+ padding: 0;
9149
+ margin: 0;
9150
+ list-style: none;
9151
+ outline: none;
9152
+ z-index: 999999999;
9153
+ transition: transform 400ms ease;
9154
+ }
9155
+ @media (hover: none) and (pointer: coarse) {
9156
+ [data-sonner-toaster][data-lifted='true'] {
9157
+ transform: none;
9158
+ }
9159
+ }
9160
+ [data-sonner-toaster][data-x-position='right'] {
9161
+ right: var(--offset-right);
9162
+ }
9163
+ [data-sonner-toaster][data-x-position='left'] {
9164
+ left: var(--offset-left);
9165
+ }
9166
+ [data-sonner-toaster][data-x-position='center'] {
9167
+ left: 50%;
9168
+ transform: translateX(-50%);
9169
+ }
9170
+ [data-sonner-toaster][data-y-position='top'] {
9171
+ top: var(--offset-top);
9172
+ }
9173
+ [data-sonner-toaster][data-y-position='bottom'] {
9174
+ bottom: var(--offset-bottom);
9175
+ }
9176
+ [data-sonner-toast] {
9177
+ --y: translateY(100%);
9178
+ --lift-amount: calc(var(--lift) * var(--gap));
9179
+ z-index: var(--z-index);
9180
+ position: absolute;
9181
+ opacity: 0;
9182
+ transform: var(--y);
9183
+ touch-action: none;
9184
+ transition: transform 400ms, opacity 400ms, height 400ms, box-shadow 200ms;
9185
+ box-sizing: border-box;
9186
+ outline: none;
9187
+ overflow-wrap: anywhere;
9188
+ }
9189
+ [data-sonner-toast][data-styled='true'] {
9190
+ padding: 16px;
9191
+ background: var(--normal-bg);
9192
+ border: 1px solid var(--normal-border);
9193
+ color: var(--normal-text);
9194
+ border-radius: var(--border-radius);
9195
+ box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
9196
+ width: var(--width);
9197
+ font-size: 13px;
9198
+ display: flex;
9199
+ align-items: center;
9200
+ gap: 6px;
9201
+ }
9202
+ [data-sonner-toast]:focus-visible {
9203
+ box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1), 0 0 0 2px rgba(0, 0, 0, 0.2);
9204
+ }
9205
+ [data-sonner-toast][data-y-position='top'] {
9206
+ top: 0;
9207
+ --y: translateY(-100%);
9208
+ --lift: 1;
9209
+ --lift-amount: calc(1 * var(--gap));
9210
+ }
9211
+ [data-sonner-toast][data-y-position='bottom'] {
9212
+ bottom: 0;
9213
+ --y: translateY(100%);
9214
+ --lift: -1;
9215
+ --lift-amount: calc(var(--lift) * var(--gap));
9216
+ }
9217
+ [data-sonner-toast][data-styled='true'] [data-description] {
9218
+ font-weight: 400;
9219
+ line-height: 1.4;
9220
+ color: #3f3f3f;
9221
+ }
9222
+ [data-rich-colors='true'][data-sonner-toast][data-styled='true'] [data-description] {
9223
+ color: inherit;
9224
+ }
9225
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-description] {
9226
+ color: hsl(0, 0%, 91%);
9227
+ }
9228
+ [data-sonner-toast][data-styled='true'] [data-title] {
9229
+ font-weight: 500;
9230
+ line-height: 1.5;
9231
+ color: inherit;
9232
+ }
9233
+ [data-sonner-toast][data-styled='true'] [data-icon] {
9234
+ display: flex;
9235
+ height: 16px;
9236
+ width: 16px;
9237
+ position: relative;
9238
+ justify-content: flex-start;
9239
+ align-items: center;
9240
+ flex-shrink: 0;
9241
+ margin-left: var(--toast-icon-margin-start);
9242
+ margin-right: var(--toast-icon-margin-end);
9243
+ }
9244
+ [data-sonner-toast][data-promise='true'] [data-icon] > svg {
9245
+ opacity: 0;
9246
+ transform: scale(0.8);
9247
+ transform-origin: center;
9248
+ animation: sonner-fade-in 300ms ease forwards;
9249
+ }
9250
+ [data-sonner-toast][data-styled='true'] [data-icon] > * {
9251
+ flex-shrink: 0;
9252
+ }
9253
+ [data-sonner-toast][data-styled='true'] [data-icon] svg {
9254
+ margin-left: var(--toast-svg-margin-start);
9255
+ margin-right: var(--toast-svg-margin-end);
9256
+ }
9257
+ [data-sonner-toast][data-styled='true'] [data-content] {
9258
+ display: flex;
9259
+ flex-direction: column;
9260
+ gap: 2px;
9261
+ }
9262
+ [data-sonner-toast][data-styled='true'] [data-button] {
9263
+ border-radius: 4px;
9264
+ padding-left: 8px;
9265
+ padding-right: 8px;
9266
+ height: 24px;
9267
+ font-size: 12px;
9268
+ color: var(--normal-bg);
9269
+ background: var(--normal-text);
9270
+ margin-left: var(--toast-button-margin-start);
9271
+ margin-right: var(--toast-button-margin-end);
9272
+ border: none;
9273
+ font-weight: 500;
9274
+ cursor: pointer;
9275
+ outline: none;
9276
+ display: flex;
9277
+ align-items: center;
9278
+ flex-shrink: 0;
9279
+ transition: opacity 400ms, box-shadow 200ms;
9280
+ }
9281
+ [data-sonner-toast][data-styled='true'] [data-button]:focus-visible {
9282
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.4);
9283
+ }
9284
+ [data-sonner-toast][data-styled='true'] [data-button]:first-of-type {
9285
+ margin-left: var(--toast-button-margin-start);
9286
+ margin-right: var(--toast-button-margin-end);
9287
+ }
9288
+ [data-sonner-toast][data-styled='true'] [data-cancel] {
9289
+ color: var(--normal-text);
9290
+ background: rgba(0, 0, 0, 0.08);
9291
+ }
9292
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast][data-styled='true'] [data-cancel] {
9293
+ background: rgba(255, 255, 255, 0.3);
9294
+ }
9295
+ [data-sonner-toast][data-styled='true'] [data-close-button] {
9296
+ position: absolute;
9297
+ left: var(--toast-close-button-start);
9298
+ right: var(--toast-close-button-end);
9299
+ top: 0;
9300
+ height: 20px;
9301
+ width: 20px;
9302
+ display: flex;
9303
+ justify-content: center;
9304
+ align-items: center;
9305
+ padding: 0;
9306
+ color: var(--gray12);
9307
+ background: var(--normal-bg);
9308
+ border: 1px solid var(--gray4);
9309
+ transform: var(--toast-close-button-transform);
9310
+ border-radius: 50%;
9311
+ cursor: pointer;
9312
+ z-index: 1;
9313
+ transition: opacity 100ms, background 200ms, border-color 200ms;
9314
+ }
9315
+ [data-sonner-toast][data-styled='true'] [data-close-button]:focus-visible {
9316
+ box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1), 0 0 0 2px rgba(0, 0, 0, 0.2);
9317
+ }
9318
+ [data-sonner-toast][data-styled='true'] [data-disabled='true'] {
9319
+ cursor: not-allowed;
9320
+ }
9321
+ [data-sonner-toast][data-styled='true']:hover [data-close-button]:hover {
9322
+ background: var(--gray2);
9323
+ border-color: var(--gray5);
9324
+ }
9325
+ [data-sonner-toast][data-swiping='true']::before {
9326
+ content: '';
9327
+ position: absolute;
9328
+ left: -100%;
9329
+ right: -100%;
9330
+ height: 100%;
9331
+ z-index: -1;
9332
+ }
9333
+ [data-sonner-toast][data-y-position='top'][data-swiping='true']::before {
9334
+ bottom: 50%;
9335
+ transform: scaleY(3) translateY(50%);
9336
+ }
9337
+ [data-sonner-toast][data-y-position='bottom'][data-swiping='true']::before {
9338
+ top: 50%;
9339
+ transform: scaleY(3) translateY(-50%);
9340
+ }
9341
+ [data-sonner-toast][data-swiping='false'][data-removed='true']::before {
9342
+ content: '';
9343
+ position: absolute;
9344
+ inset: 0;
9345
+ transform: scaleY(2);
9346
+ }
9347
+ [data-sonner-toast][data-expanded='true']::after {
9348
+ content: '';
9349
+ position: absolute;
9350
+ left: 0;
9351
+ height: calc(var(--gap) + 1px);
9352
+ bottom: 100%;
9353
+ width: 100%;
9354
+ }
9355
+ [data-sonner-toast][data-mounted='true'] {
9356
+ --y: translateY(0);
9357
+ opacity: 1;
9358
+ }
9359
+ [data-sonner-toast][data-expanded='false'][data-front='false'] {
9360
+ --scale: var(--toasts-before) * 0.05 + 1;
9361
+ --y: translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));
9362
+ height: var(--front-toast-height);
9363
+ }
9364
+ [data-sonner-toast] > * {
9365
+ transition: opacity 400ms;
9366
+ }
9367
+ [data-sonner-toast][data-x-position='right'] {
9368
+ right: 0;
9369
+ }
9370
+ [data-sonner-toast][data-x-position='left'] {
9371
+ left: 0;
9372
+ }
9373
+ [data-sonner-toast][data-expanded='false'][data-front='false'][data-styled='true'] > * {
9374
+ opacity: 0;
9375
+ }
9376
+ [data-sonner-toast][data-visible='false'] {
9377
+ opacity: 0;
9378
+ pointer-events: none;
9379
+ }
9380
+ [data-sonner-toast][data-mounted='true'][data-expanded='true'] {
9381
+ --y: translateY(calc(var(--lift) * var(--offset)));
9382
+ height: var(--initial-height);
9383
+ }
9384
+ [data-sonner-toast][data-removed='true'][data-front='true'][data-swipe-out='false'] {
9385
+ --y: translateY(calc(var(--lift) * -100%));
9386
+ opacity: 0;
9387
+ }
9388
+ [data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='true'] {
9389
+ --y: translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));
9390
+ opacity: 0;
9391
+ }
9392
+ [data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='false'] {
9393
+ --y: translateY(40%);
9394
+ opacity: 0;
9395
+ transition: transform 500ms, opacity 200ms;
9396
+ }
9397
+ [data-sonner-toast][data-removed='true'][data-front='false']::before {
9398
+ height: calc(var(--initial-height) + 20%);
9399
+ }
9400
+ [data-sonner-toast][data-swiping='true'] {
9401
+ transform: var(--y) translateY(var(--swipe-amount-y, 0px)) translateX(var(--swipe-amount-x, 0px));
9402
+ transition: none;
9403
+ }
9404
+ [data-sonner-toast][data-swiped='true'] {
9405
+ user-select: none;
9406
+ }
9407
+ [data-sonner-toast][data-swipe-out='true'][data-y-position='bottom'], [data-sonner-toast][data-swipe-out='true'][data-y-position='top'] {
9408
+ animation-duration: 200ms;
9409
+ animation-timing-function: ease-out;
9410
+ animation-fill-mode: forwards;
9411
+ }
9412
+ [data-sonner-toast][data-swipe-out='true'][data-swipe-direction='left'] {
9413
+ animation-name: swipe-out-left;
9414
+ }
9415
+ [data-sonner-toast][data-swipe-out='true'][data-swipe-direction='right'] {
9416
+ animation-name: swipe-out-right;
9417
+ }
9418
+ [data-sonner-toast][data-swipe-out='true'][data-swipe-direction='up'] {
9419
+ animation-name: swipe-out-up;
9420
+ }
9421
+ [data-sonner-toast][data-swipe-out='true'][data-swipe-direction='down'] {
9422
+ animation-name: swipe-out-down;
9423
+ }
9424
+ @keyframes swipe-out-left {
9425
+ from {
9426
+ transform: var(--y) translateX(var(--swipe-amount-x));
9427
+ opacity: 1;
9428
+ }
9429
+ to {
9430
+ transform: var(--y) translateX(calc(var(--swipe-amount-x) - 100%));
9431
+ opacity: 0;
9432
+ }
9433
+ }
9434
+ @keyframes swipe-out-right {
9435
+ from {
9436
+ transform: var(--y) translateX(var(--swipe-amount-x));
9437
+ opacity: 1;
9438
+ }
9439
+ to {
9440
+ transform: var(--y) translateX(calc(var(--swipe-amount-x) + 100%));
9441
+ opacity: 0;
9442
+ }
9443
+ }
9444
+ @keyframes swipe-out-up {
9445
+ from {
9446
+ transform: var(--y) translateY(var(--swipe-amount-y));
9447
+ opacity: 1;
9448
+ }
9449
+ to {
9450
+ transform: var(--y) translateY(calc(var(--swipe-amount-y) - 100%));
9451
+ opacity: 0;
9452
+ }
9453
+ }
9454
+ @keyframes swipe-out-down {
9455
+ from {
9456
+ transform: var(--y) translateY(var(--swipe-amount-y));
9457
+ opacity: 1;
9458
+ }
9459
+ to {
9460
+ transform: var(--y) translateY(calc(var(--swipe-amount-y) + 100%));
9461
+ opacity: 0;
9462
+ }
9463
+ }
9464
+ @media (max-width: 600px) {
9465
+ [data-sonner-toaster] {
9466
+ position: fixed;
9467
+ right: var(--mobile-offset-right);
9468
+ left: var(--mobile-offset-left);
9469
+ width: 100%;
9470
+ }
9471
+ [data-sonner-toaster][dir='rtl'] {
9472
+ left: calc(var(--mobile-offset-left) * -1);
9473
+ }
9474
+ [data-sonner-toaster] [data-sonner-toast] {
9475
+ left: 0;
9476
+ right: 0;
9477
+ width: calc(100% - var(--mobile-offset-left) * 2);
9478
+ }
9479
+ [data-sonner-toaster][data-x-position='left'] {
9480
+ left: var(--mobile-offset-left);
9481
+ }
9482
+ [data-sonner-toaster][data-y-position='bottom'] {
9483
+ bottom: var(--mobile-offset-bottom);
9484
+ }
9485
+ [data-sonner-toaster][data-y-position='top'] {
9486
+ top: var(--mobile-offset-top);
9487
+ }
9488
+ [data-sonner-toaster][data-x-position='center'] {
9489
+ left: var(--mobile-offset-left);
9490
+ right: var(--mobile-offset-right);
9491
+ transform: none;
9492
+ }
9493
+ }
9494
+ [data-sonner-toaster][data-sonner-theme='light'] {
9495
+ --normal-bg: #fff;
9496
+ --normal-border: var(--gray4);
9497
+ --normal-text: var(--gray12);
9498
+ --success-bg: hsl(143, 85%, 96%);
9499
+ --success-border: hsl(145, 92%, 87%);
9500
+ --success-text: hsl(140, 100%, 27%);
9501
+ --info-bg: hsl(208, 100%, 97%);
9502
+ --info-border: hsl(221, 91%, 93%);
9503
+ --info-text: hsl(210, 92%, 45%);
9504
+ --warning-bg: hsl(49, 100%, 97%);
9505
+ --warning-border: hsl(49, 91%, 84%);
9506
+ --warning-text: hsl(31, 92%, 45%);
9507
+ --error-bg: hsl(359, 100%, 97%);
9508
+ --error-border: hsl(359, 100%, 94%);
9509
+ --error-text: hsl(360, 100%, 45%);
9510
+ }
9511
+ [data-sonner-toaster][data-sonner-theme='light'] [data-sonner-toast][data-invert='true'] {
9512
+ --normal-bg: #000;
9513
+ --normal-border: hsl(0, 0%, 20%);
9514
+ --normal-text: var(--gray1);
9515
+ }
9516
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast][data-invert='true'] {
9517
+ --normal-bg: #fff;
9518
+ --normal-border: var(--gray3);
9519
+ --normal-text: var(--gray12);
9520
+ }
9521
+ [data-sonner-toaster][data-sonner-theme='dark'] {
9522
+ --normal-bg: #000;
9523
+ --normal-bg-hover: hsl(0, 0%, 12%);
9524
+ --normal-border: hsl(0, 0%, 20%);
9525
+ --normal-border-hover: hsl(0, 0%, 25%);
9526
+ --normal-text: var(--gray1);
9527
+ --success-bg: hsl(150, 100%, 6%);
9528
+ --success-border: hsl(147, 100%, 12%);
9529
+ --success-text: hsl(150, 86%, 65%);
9530
+ --info-bg: hsl(215, 100%, 6%);
9531
+ --info-border: hsl(223, 43%, 17%);
9532
+ --info-text: hsl(216, 87%, 65%);
9533
+ --warning-bg: hsl(64, 100%, 6%);
9534
+ --warning-border: hsl(60, 100%, 9%);
9535
+ --warning-text: hsl(46, 87%, 65%);
9536
+ --error-bg: hsl(358, 76%, 10%);
9537
+ --error-border: hsl(357, 89%, 16%);
9538
+ --error-text: hsl(358, 100%, 81%);
9539
+ }
9540
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast] [data-close-button] {
9541
+ background: var(--normal-bg);
9542
+ border-color: var(--normal-border);
9543
+ color: var(--normal-text);
9544
+ }
9545
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast] [data-close-button]:hover {
9546
+ background: var(--normal-bg-hover);
9547
+ border-color: var(--normal-border-hover);
9548
+ }
9549
+ [data-rich-colors='true'][data-sonner-toast][data-type='success'] {
9550
+ background: var(--success-bg);
9551
+ border-color: var(--success-border);
9552
+ color: var(--success-text);
9553
+ }
9554
+ [data-rich-colors='true'][data-sonner-toast][data-type='success'] [data-close-button] {
9555
+ background: var(--success-bg);
9556
+ border-color: var(--success-border);
9557
+ color: var(--success-text);
9558
+ }
9559
+ [data-rich-colors='true'][data-sonner-toast][data-type='info'] {
9560
+ background: var(--info-bg);
9561
+ border-color: var(--info-border);
9562
+ color: var(--info-text);
9563
+ }
9564
+ [data-rich-colors='true'][data-sonner-toast][data-type='info'] [data-close-button] {
9565
+ background: var(--info-bg);
9566
+ border-color: var(--info-border);
9567
+ color: var(--info-text);
9568
+ }
9569
+ [data-rich-colors='true'][data-sonner-toast][data-type='warning'] {
9570
+ background: var(--warning-bg);
9571
+ border-color: var(--warning-border);
9572
+ color: var(--warning-text);
9573
+ }
9574
+ [data-rich-colors='true'][data-sonner-toast][data-type='warning'] [data-close-button] {
9575
+ background: var(--warning-bg);
9576
+ border-color: var(--warning-border);
9577
+ color: var(--warning-text);
9578
+ }
9579
+ [data-rich-colors='true'][data-sonner-toast][data-type='error'] {
9580
+ background: var(--error-bg);
9581
+ border-color: var(--error-border);
9582
+ color: var(--error-text);
9583
+ }
9584
+ [data-rich-colors='true'][data-sonner-toast][data-type='error'] [data-close-button] {
9585
+ background: var(--error-bg);
9586
+ border-color: var(--error-border);
9587
+ color: var(--error-text);
9588
+ }
9589
+ .sonner-loading-wrapper {
9590
+ --size: 16px;
9591
+ height: var(--size);
9592
+ width: var(--size);
9593
+ position: absolute;
9594
+ inset: 0;
9595
+ z-index: 10;
9596
+ }
9597
+ .sonner-loading-wrapper[data-visible='false'] {
9598
+ transform-origin: center;
9599
+ animation: sonner-fade-out 0.2s ease forwards;
9600
+ }
9601
+ .sonner-spinner {
9602
+ position: relative;
9603
+ top: 50%;
9604
+ left: 50%;
9605
+ height: var(--size);
9606
+ width: var(--size);
9607
+ }
9608
+ .sonner-loading-bar {
9609
+ animation: sonner-spin 1.2s linear infinite;
9610
+ background: var(--gray11);
9611
+ border-radius: 6px;
9612
+ height: 8%;
9613
+ left: -10%;
9614
+ position: absolute;
9615
+ top: -3.9%;
9616
+ width: 24%;
9617
+ }
9618
+ .sonner-loading-bar:nth-child(1) {
9619
+ animation-delay: -1.2s;
9620
+ transform: rotate(0.0001deg) translate(146%);
9621
+ }
9622
+ .sonner-loading-bar:nth-child(2) {
9623
+ animation-delay: -1.1s;
9624
+ transform: rotate(30deg) translate(146%);
9625
+ }
9626
+ .sonner-loading-bar:nth-child(3) {
9627
+ animation-delay: -1s;
9628
+ transform: rotate(60deg) translate(146%);
9629
+ }
9630
+ .sonner-loading-bar:nth-child(4) {
9631
+ animation-delay: -0.9s;
9632
+ transform: rotate(90deg) translate(146%);
9633
+ }
9634
+ .sonner-loading-bar:nth-child(5) {
9635
+ animation-delay: -0.8s;
9636
+ transform: rotate(120deg) translate(146%);
9637
+ }
9638
+ .sonner-loading-bar:nth-child(6) {
9639
+ animation-delay: -0.7s;
9640
+ transform: rotate(150deg) translate(146%);
9641
+ }
9642
+ .sonner-loading-bar:nth-child(7) {
9643
+ animation-delay: -0.6s;
9644
+ transform: rotate(180deg) translate(146%);
9645
+ }
9646
+ .sonner-loading-bar:nth-child(8) {
9647
+ animation-delay: -0.5s;
9648
+ transform: rotate(210deg) translate(146%);
9649
+ }
9650
+ .sonner-loading-bar:nth-child(9) {
9651
+ animation-delay: -0.4s;
9652
+ transform: rotate(240deg) translate(146%);
9653
+ }
9654
+ .sonner-loading-bar:nth-child(10) {
9655
+ animation-delay: -0.3s;
9656
+ transform: rotate(270deg) translate(146%);
9657
+ }
9658
+ .sonner-loading-bar:nth-child(11) {
9659
+ animation-delay: -0.2s;
9660
+ transform: rotate(300deg) translate(146%);
9661
+ }
9662
+ .sonner-loading-bar:nth-child(12) {
9663
+ animation-delay: -0.1s;
9664
+ transform: rotate(330deg) translate(146%);
9665
+ }
9666
+ @keyframes sonner-fade-in {
9667
+ 0% {
9668
+ opacity: 0;
9669
+ transform: scale(0.8);
9670
+ }
9671
+ 100% {
9672
+ opacity: 1;
9673
+ transform: scale(1);
9674
+ }
9675
+ }
9676
+ @keyframes sonner-fade-out {
9677
+ 0% {
9678
+ opacity: 1;
9679
+ transform: scale(1);
9680
+ }
9681
+ 100% {
9682
+ opacity: 0;
9683
+ transform: scale(0.8);
9684
+ }
9685
+ }
9686
+ @keyframes sonner-spin {
9687
+ 0% {
9688
+ opacity: 1;
9689
+ }
9690
+ 100% {
9691
+ opacity: 0.15;
9692
+ }
9693
+ }
9694
+ @media (prefers-reduced-motion) {
9695
+ [data-sonner-toast], [data-sonner-toast] > *, .sonner-loading-bar {
9696
+ transition: none !important;
9697
+ animation: none !important;
9698
+ }
9699
+ }
9700
+ .sonner-loader {
9701
+ position: absolute;
9702
+ top: 50%;
9703
+ left: 50%;
9704
+ transform: translate(-50%, -50%);
9705
+ transform-origin: center;
9706
+ transition: opacity 200ms, transform 200ms;
9707
+ }
9708
+ .sonner-loader[data-visible='false'] {
9709
+ opacity: 0;
9710
+ transform: scale(0.8) translate(-50%, -50%);
9711
+ }
9047
9712
  @keyframes apollo-glow {
9048
9713
  0% {
9049
9714
  box-shadow: 0 0 0 0 var(--_glow-shadow, currentColor);