@uipath/apollo-wind 2.32.0 → 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.
@@ -531,12 +531,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
531
531
  }
532
532
  function FormField({ children, className = '' }) {
533
533
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
534
- className: (0, index_cjs_namespaceObject.cn)('space-y-2', className),
534
+ "data-slot": "form-field",
535
+ className: (0, index_cjs_namespaceObject.cn)('grid gap-1.5', className),
535
536
  children: children
536
537
  });
537
538
  }
538
539
  function FormLabel({ children, required, htmlFor, className = '' }) {
539
540
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(label_cjs_namespaceObject.Label, {
541
+ "data-slot": "form-label",
540
542
  htmlFor: htmlFor,
541
543
  className: className,
542
544
  children: [
@@ -551,6 +553,7 @@ function FormLabel({ children, required, htmlFor, className = '' }) {
551
553
  function FormDescription({ children }) {
552
554
  if (!children) return null;
553
555
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
556
+ "data-slot": "form-description",
554
557
  className: "text-sm text-muted-foreground",
555
558
  children: children
556
559
  });
@@ -503,12 +503,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
503
503
  }
504
504
  function FormField({ children, className = '' }) {
505
505
  return /*#__PURE__*/ jsx("div", {
506
- className: cn('space-y-2', className),
506
+ "data-slot": "form-field",
507
+ className: cn('grid gap-1.5', className),
507
508
  children: children
508
509
  });
509
510
  }
510
511
  function FormLabel({ children, required, htmlFor, className = '' }) {
511
512
  return /*#__PURE__*/ jsxs(Label, {
513
+ "data-slot": "form-label",
512
514
  htmlFor: htmlFor,
513
515
  className: className,
514
516
  children: [
@@ -523,6 +525,7 @@ function FormLabel({ children, required, htmlFor, className = '' }) {
523
525
  function FormDescription({ children }) {
524
526
  if (!children) return null;
525
527
  return /*#__PURE__*/ jsx("p", {
528
+ "data-slot": "form-description",
526
529
  className: "text-sm text-muted-foreground",
527
530
  children: children
528
531
  });
@@ -15,7 +15,7 @@ var __webpack_modules__ = {
15
15
  "./avatar" (module) {
16
16
  module.exports = require("./avatar.cjs");
17
17
  },
18
- "./badge" (module) {
18
+ "@/components/ui/badge" (module) {
19
19
  module.exports = require("./badge.cjs");
20
20
  },
21
21
  "./breadcrumb" (module) {
@@ -30,22 +30,22 @@ var __webpack_modules__ = {
30
30
  "./calendar" (module) {
31
31
  module.exports = require("./calendar.cjs");
32
32
  },
33
- "./card" (module) {
33
+ "@/components/ui/card" (module) {
34
34
  module.exports = require("./card.cjs");
35
35
  },
36
36
  "./checkbox" (module) {
37
37
  module.exports = require("./checkbox.cjs");
38
38
  },
39
- "./collapsible" (module) {
39
+ "@/components/ui/collapsible" (module) {
40
40
  module.exports = require("./collapsible.cjs");
41
41
  },
42
42
  "./combobox" (module) {
43
43
  module.exports = require("./combobox.cjs");
44
44
  },
45
- "./command" (module) {
45
+ "@/components/ui/command" (module) {
46
46
  module.exports = require("./command.cjs");
47
47
  },
48
- "./context-menu" (module) {
48
+ "@/components/ui/context-menu" (module) {
49
49
  module.exports = require("./context-menu.cjs");
50
50
  },
51
51
  "./data-table" (module) {
@@ -60,10 +60,10 @@ var __webpack_modules__ = {
60
60
  "./dialog" (module) {
61
61
  module.exports = require("./dialog.cjs");
62
62
  },
63
- "./dropdown-menu" (module) {
63
+ "@/components/ui/dropdown-menu" (module) {
64
64
  module.exports = require("./dropdown-menu.cjs");
65
65
  },
66
- "./editable-cell" (module) {
66
+ "@/components/ui/editable-cell" (module) {
67
67
  module.exports = require("./editable-cell.cjs");
68
68
  },
69
69
  "./empty-state" (module) {
@@ -72,10 +72,10 @@ var __webpack_modules__ = {
72
72
  "./file-upload" (module) {
73
73
  module.exports = require("./file-upload.cjs");
74
74
  },
75
- "./hover-card" (module) {
75
+ "@/components/ui/hover-card" (module) {
76
76
  module.exports = require("./hover-card.cjs");
77
77
  },
78
- "./input-group" (module) {
78
+ "@/components/ui/input-group" (module) {
79
79
  module.exports = require("./input-group.cjs");
80
80
  },
81
81
  "./input" (module) {
@@ -93,7 +93,7 @@ var __webpack_modules__ = {
93
93
  "./pagination" (module) {
94
94
  module.exports = require("./pagination.cjs");
95
95
  },
96
- "./popover" (module) {
96
+ "@/components/ui/popover" (module) {
97
97
  module.exports = require("./popover.cjs");
98
98
  },
99
99
  "./progress" (module) {
@@ -144,7 +144,7 @@ var __webpack_modules__ = {
144
144
  "./switch" (module) {
145
145
  module.exports = require("./switch.cjs");
146
146
  },
147
- "./table" (module) {
147
+ "@/components/ui/table" (module) {
148
148
  module.exports = require("./table.cjs");
149
149
  },
150
150
  "./tabs" (module) {
@@ -247,7 +247,7 @@ var __webpack_exports__ = {};
247
247
  "default"
248
248
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_avatar__rspack_import_4[__rspack_import_key];
249
249
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
250
- var _badge__rspack_import_5 = __webpack_require__("./badge");
250
+ var _badge__rspack_import_5 = __webpack_require__("@/components/ui/badge");
251
251
  var __rspack_reexport = {};
252
252
  for(const __rspack_import_key in _badge__rspack_import_5)if ([
253
253
  "TreeView",
@@ -282,7 +282,7 @@ var __webpack_exports__ = {};
282
282
  "default"
283
283
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_calendar__rspack_import_9[__rspack_import_key];
284
284
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
285
- var _card__rspack_import_10 = __webpack_require__("./card");
285
+ var _card__rspack_import_10 = __webpack_require__("@/components/ui/card");
286
286
  var __rspack_reexport = {};
287
287
  for(const __rspack_import_key in _card__rspack_import_10)if ([
288
288
  "TreeView",
@@ -296,7 +296,7 @@ var __webpack_exports__ = {};
296
296
  "default"
297
297
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_checkbox__rspack_import_11[__rspack_import_key];
298
298
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
299
- var _collapsible__rspack_import_12 = __webpack_require__("./collapsible");
299
+ var _collapsible__rspack_import_12 = __webpack_require__("@/components/ui/collapsible");
300
300
  var __rspack_reexport = {};
301
301
  for(const __rspack_import_key in _collapsible__rspack_import_12)if ([
302
302
  "TreeView",
@@ -310,14 +310,14 @@ var __webpack_exports__ = {};
310
310
  "default"
311
311
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_combobox__rspack_import_13[__rspack_import_key];
312
312
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
313
- var _command__rspack_import_14 = __webpack_require__("./command");
313
+ var _command__rspack_import_14 = __webpack_require__("@/components/ui/command");
314
314
  var __rspack_reexport = {};
315
315
  for(const __rspack_import_key in _command__rspack_import_14)if ([
316
316
  "TreeView",
317
317
  "default"
318
318
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_command__rspack_import_14[__rspack_import_key];
319
319
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
320
- var _context_menu__rspack_import_15 = __webpack_require__("./context-menu");
320
+ var _context_menu__rspack_import_15 = __webpack_require__("@/components/ui/context-menu");
321
321
  var __rspack_reexport = {};
322
322
  for(const __rspack_import_key in _context_menu__rspack_import_15)if ([
323
323
  "TreeView",
@@ -352,14 +352,14 @@ var __webpack_exports__ = {};
352
352
  "default"
353
353
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dialog__rspack_import_19[__rspack_import_key];
354
354
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
355
- var _dropdown_menu__rspack_import_20 = __webpack_require__("./dropdown-menu");
355
+ var _dropdown_menu__rspack_import_20 = __webpack_require__("@/components/ui/dropdown-menu");
356
356
  var __rspack_reexport = {};
357
357
  for(const __rspack_import_key in _dropdown_menu__rspack_import_20)if ([
358
358
  "TreeView",
359
359
  "default"
360
360
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dropdown_menu__rspack_import_20[__rspack_import_key];
361
361
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
362
- var _editable_cell__rspack_import_21 = __webpack_require__("./editable-cell");
362
+ var _editable_cell__rspack_import_21 = __webpack_require__("@/components/ui/editable-cell");
363
363
  var __rspack_reexport = {};
364
364
  for(const __rspack_import_key in _editable_cell__rspack_import_21)if ([
365
365
  "TreeView",
@@ -380,7 +380,7 @@ var __webpack_exports__ = {};
380
380
  "default"
381
381
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_file_upload__rspack_import_23[__rspack_import_key];
382
382
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
383
- var _hover_card__rspack_import_24 = __webpack_require__("./hover-card");
383
+ var _hover_card__rspack_import_24 = __webpack_require__("@/components/ui/hover-card");
384
384
  var __rspack_reexport = {};
385
385
  for(const __rspack_import_key in _hover_card__rspack_import_24)if ([
386
386
  "TreeView",
@@ -394,7 +394,7 @@ var __webpack_exports__ = {};
394
394
  "default"
395
395
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input__rspack_import_25[__rspack_import_key];
396
396
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
397
- var _input_group__rspack_import_26 = __webpack_require__("./input-group");
397
+ var _input_group__rspack_import_26 = __webpack_require__("@/components/ui/input-group");
398
398
  var __rspack_reexport = {};
399
399
  for(const __rspack_import_key in _input_group__rspack_import_26)if ([
400
400
  "TreeView",
@@ -429,7 +429,7 @@ var __webpack_exports__ = {};
429
429
  "default"
430
430
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_pagination__rspack_import_30[__rspack_import_key];
431
431
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
432
- var _popover__rspack_import_31 = __webpack_require__("./popover");
432
+ var _popover__rspack_import_31 = __webpack_require__("@/components/ui/popover");
433
433
  var __rspack_reexport = {};
434
434
  for(const __rspack_import_key in _popover__rspack_import_31)if ([
435
435
  "TreeView",
@@ -548,7 +548,7 @@ var __webpack_exports__ = {};
548
548
  "default"
549
549
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_switch__rspack_import_47[__rspack_import_key];
550
550
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
551
- var _table__rspack_import_48 = __webpack_require__("./table");
551
+ var _table__rspack_import_48 = __webpack_require__("@/components/ui/table");
552
552
  var __rspack_reexport = {};
553
553
  for(const __rspack_import_key in _table__rspack_import_48)if ([
554
554
  "TreeView",
package/dist/styles.css CHANGED
@@ -9105,6 +9105,610 @@ body.future-light, .future-light {
9105
9105
  --border: var(--border-future-light);
9106
9106
  color-scheme: light;
9107
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
+ }
9108
9712
  @keyframes apollo-glow {
9109
9713
  0% {
9110
9714
  box-shadow: 0 0 0 0 var(--_glow-shadow, currentColor);
package/dist/tailwind.css CHANGED
@@ -12,6 +12,7 @@
12
12
 
13
13
  @import "tailwindcss";
14
14
  @import "@uipath/apollo-core/tokens/css/theme-variables.css";
15
+ @import "sonner/dist/styles.css";
15
16
 
16
17
  @import "./tailwind.utilities.css";
17
18
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uipath/apollo-wind",
3
- "version": "2.32.0",
3
+ "version": "2.32.1",
4
4
  "description": "UiPath wind design system - A Tailwind CSS based React component library",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",