@moduix/react 2.1.0 → 2.2.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 (96) hide show
  1. package/README.md +13 -14
  2. package/dist/components/accordion/Accordion.css +47 -47
  3. package/dist/components/alert/Alert.css +62 -46
  4. package/dist/components/angle-slider/AngleSlider.css +65 -64
  5. package/dist/components/aspect-ratio/AspectRatio.css +2 -2
  6. package/dist/components/avatar/Avatar.css +26 -26
  7. package/dist/components/badge/Badge.css +34 -34
  8. package/dist/components/bleed/Bleed.css +13 -13
  9. package/dist/components/breadcrumbs/Breadcrumbs.css +28 -28
  10. package/dist/components/button/Button.css +81 -78
  11. package/dist/components/card/Card.css +46 -46
  12. package/dist/components/carousel/Carousel.css +57 -57
  13. package/dist/components/checkbox/Checkbox.css +40 -40
  14. package/dist/components/clipboard/Clipboard.css +68 -59
  15. package/dist/components/close-button/CloseButton.css +17 -17
  16. package/dist/components/collapsible/Collapsible.css +40 -38
  17. package/dist/components/color-picker/ColorPicker.css +155 -151
  18. package/dist/components/combobox/Combobox.css +118 -115
  19. package/dist/components/command-palette/CommandPalette.css +172 -177
  20. package/dist/components/command-palette/CommandPalette.module.js +0 -1
  21. package/dist/components/container/Container.css +12 -12
  22. package/dist/components/date-input/DateInput.css +41 -40
  23. package/dist/components/date-picker/DatePicker.css +174 -172
  24. package/dist/components/dialog/Dialog.css +84 -79
  25. package/dist/components/drawer/Drawer.css +126 -108
  26. package/dist/components/editable/Editable.css +63 -61
  27. package/dist/components/empty/Empty.css +25 -25
  28. package/dist/components/field/Field.css +45 -45
  29. package/dist/components/fieldset/Fieldset.css +22 -22
  30. package/dist/components/file-upload/FileUpload.css +128 -125
  31. package/dist/components/floating-panel/FloatingPanel.css +114 -110
  32. package/dist/components/heading/Heading.css +26 -26
  33. package/dist/components/highlight/Highlight.css +8 -8
  34. package/dist/components/hover-card/HoverCard.css +49 -47
  35. package/dist/components/image/Image.css +2 -2
  36. package/dist/components/image-cropper/ImageCropper.css +63 -60
  37. package/dist/components/input/Input.css +46 -45
  38. package/dist/components/input-group/InputGroup.css +71 -70
  39. package/dist/components/kbd/Kbd.css +16 -16
  40. package/dist/components/lightbox/Lightbox.css +80 -77
  41. package/dist/components/list/List.css +32 -32
  42. package/dist/components/listbox/Listbox.css +120 -117
  43. package/dist/components/marquee/Marquee.css +16 -16
  44. package/dist/components/menu/Menu.css +121 -120
  45. package/dist/components/native-select/NativeSelect.css +42 -41
  46. package/dist/components/number-input/NumberInput.css +59 -56
  47. package/dist/components/pagination/Pagination.css +35 -34
  48. package/dist/components/password-input/PasswordInput.css +60 -59
  49. package/dist/components/pin-input/PinInput.css +35 -35
  50. package/dist/components/popover/Popover.css +81 -77
  51. package/dist/components/progress-circular/ProgressCircular.css +20 -20
  52. package/dist/components/progress-linear/ProgressLinear.css +29 -28
  53. package/dist/components/qr-code/QrCode.css +39 -35
  54. package/dist/components/radio-group/RadioGroup.css +48 -48
  55. package/dist/components/rating-group/RatingGroup.css +30 -30
  56. package/dist/components/scroll-area/ScrollArea.css +34 -34
  57. package/dist/components/segment-group/SegmentGroup.css +37 -37
  58. package/dist/components/select/Select.css +118 -126
  59. package/dist/components/select/Select.d.ts +0 -5
  60. package/dist/components/select/Select.js +0 -8
  61. package/dist/components/select/Select.module.js +0 -1
  62. package/dist/components/separator/Separator.css +13 -13
  63. package/dist/components/sidebar/Sidebar.css +142 -142
  64. package/dist/components/signature-pad/SignaturePad.css +50 -50
  65. package/dist/components/skeleton/Skeleton.css +7 -5
  66. package/dist/components/slider/Slider.css +61 -61
  67. package/dist/components/spinner/Spinner.css +12 -12
  68. package/dist/components/split-button/SplitButton.css +12 -12
  69. package/dist/components/splitter/Splitter.css +63 -62
  70. package/dist/components/splitter/Splitter.js +2 -2
  71. package/dist/components/stack/Stack.css +4 -4
  72. package/dist/components/stack/Stack.js +3 -3
  73. package/dist/components/steps/Steps.css +89 -89
  74. package/dist/components/swap/Swap.css +7 -7
  75. package/dist/components/switch/Switch.css +59 -57
  76. package/dist/components/table/Table.css +58 -56
  77. package/dist/components/tabs/Tabs.css +64 -62
  78. package/dist/components/tag/Tag.css +45 -45
  79. package/dist/components/tags-input/TagsInput.css +92 -86
  80. package/dist/components/text/Text.css +23 -23
  81. package/dist/components/text/Text.js +1 -1
  82. package/dist/components/textarea/Textarea.css +27 -26
  83. package/dist/components/timer/Timer.css +38 -37
  84. package/dist/components/toast/Toast.css +94 -79
  85. package/dist/components/toggle/Toggle.css +66 -66
  86. package/dist/components/toggle-group/ToggleGroup.css +16 -16
  87. package/dist/components/tooltip/Tooltip.css +56 -53
  88. package/dist/components/tour/Tour.css +121 -117
  89. package/dist/components/tree-view/TreeView.css +88 -86
  90. package/dist/components/typeset/Typeset.css +61 -61
  91. package/dist/lib/moduix/presets/contrast.css +59 -60
  92. package/dist/lib/moduix/presets/dense.css +72 -73
  93. package/dist/lib/moduix/presets/soft.css +71 -72
  94. package/dist/lib/moduix/styles/reset.css +1 -1
  95. package/dist/lib/moduix/styles/style.css +230 -226
  96. package/package.json +1 -1
package/dist/components/dialog/Dialog.css CHANGED
@@ -1,22 +1,22 @@
1
- @layer ui.components {
1
+ @layer moduix.components {
2
2
  ._9AixhG_trigger, ._9AixhG_closeTrigger {
3
3
  box-sizing: border-box;
4
- min-height: var(--dialog-control-height, var(--size-md));
5
- padding: var(--dialog-control-padding-y, var(--spacing-1))
6
- var(--dialog-control-padding-x, var(--spacing-3-5));
7
- border: var(--dialog-control-border-width, var(--border-width-sm)) solid
8
- var(--dialog-control-border-color, var(--color-border));
9
- border-radius: var(--dialog-control-radius, var(--radius-md));
10
- background-color: var(--dialog-control-bg, var(--color-background));
11
- color: var(--dialog-control-color, var(--color-foreground));
4
+ min-height: var(--moduix-dialog-control-height, var(--moduix-size-md));
5
+ padding: var(--moduix-dialog-control-padding-y, var(--moduix-spacing-1))
6
+ var(--moduix-dialog-control-padding-x, var(--moduix-spacing-3-5));
7
+ border: var(--moduix-dialog-control-border-width, var(--moduix-border-width-sm)) solid
8
+ var(--moduix-dialog-control-border-color, var(--moduix-color-border));
9
+ border-radius: var(--moduix-dialog-control-radius, var(--moduix-radius-md));
10
+ background-color: var(--moduix-dialog-control-bg, var(--moduix-color-background));
11
+ color: var(--moduix-dialog-control-color, var(--moduix-color-foreground));
12
12
  font: inherit;
13
- font-size: var(--dialog-control-font-size, var(--text-md));
14
- line-height: var(--dialog-control-line-height, var(--line-height-text-md));
13
+ font-size: var(--moduix-dialog-control-font-size, var(--moduix-text-md));
14
+ line-height: var(--moduix-dialog-control-line-height, var(--moduix-line-height-text-md));
15
15
  cursor: pointer;
16
16
  user-select: none;
17
- transition: background-color var(--transition-default),
18
- border-color var(--transition-default),
19
- color var(--transition-default);
17
+ transition: background-color var(--moduix-transition-default),
18
+ border-color var(--moduix-transition-default),
19
+ color var(--moduix-transition-default);
20
20
  justify-content: center;
21
21
  align-items: center;
22
22
  margin: 0;
@@ -24,46 +24,48 @@
24
24
 
25
25
  @media (hover: hover) {
26
26
  &:hover {
27
- background-color: var(--dialog-control-bg-hover, var(--color-accent));
27
+ background-color: var(--moduix-dialog-control-bg-hover, var(--moduix-color-accent));
28
28
  }
29
29
  }
30
30
 
31
31
  &:focus-visible {
32
- outline: var(--dialog-focus-ring-width, var(--dialog-control-border-width, var(--border-width-sm)))
33
- solid var(--dialog-focus-ring-color, var(--color-ring));
34
- outline-offset: calc(var(--dialog-focus-ring-width, var(--dialog-control-border-width, var(--border-width-sm))) *
32
+ outline: var(--moduix-dialog-focus-ring-width, var(--moduix-dialog-control-border-width, var(--moduix-border-width-sm)))
33
+ solid var(--moduix-dialog-focus-ring-color, var(--moduix-color-ring));
34
+ outline-offset: calc(var(--moduix-dialog-focus-ring-width, var(--moduix-dialog-control-border-width, var(--moduix-border-width-sm))) *
35
35
  -1);
36
36
  }
37
37
 
38
38
  &[data-disabled], &[disabled] {
39
39
  pointer-events: none;
40
- opacity: var(--opacity-disabled);
40
+ opacity: var(--moduix-opacity-disabled);
41
41
  }
42
42
  }
43
43
 
44
44
  ._9AixhG_backdrop {
45
- z-index: calc(var(--z-backdrop) + var(--layer-index, 0));
46
- background-color: var(--dialog-backdrop-bg, var(--backdrop-bg, var(--color-overlay)));
45
+ z-index: calc(var(--moduix-z-backdrop) + var(--layer-index, 0));
46
+ background-color: var(--moduix-dialog-backdrop-bg, var(--moduix-backdrop-bg, var(--moduix-color-overlay)));
47
47
  min-height: 100dvh;
48
- backdrop-filter: var(--backdrop-filter, blur(var(--dialog-backdrop-blur, 4px)));
48
+ backdrop-filter: var(--moduix-backdrop-filter, blur(var(--moduix-dialog-backdrop-blur, 4px)));
49
49
  position: fixed;
50
50
  inset: 0;
51
51
 
52
52
  &[data-state="open"] {
53
- animation: _9AixhG_dialog-backdrop-in var(--dialog-backdrop-transition, var(--transition-default));
53
+ animation: _9AixhG_dialog-backdrop-in
54
+ var(--moduix-dialog-backdrop-transition, var(--moduix-transition-default));
54
55
  }
55
56
 
56
57
  &[data-state="closed"] {
57
- animation: _9AixhG_dialog-backdrop-out var(--dialog-backdrop-transition, var(--transition-default));
58
+ animation: _9AixhG_dialog-backdrop-out
59
+ var(--moduix-dialog-backdrop-transition, var(--moduix-transition-default));
58
60
  }
59
61
  }
60
62
 
61
63
  ._9AixhG_positioner {
62
64
  box-sizing: border-box;
63
- z-index: calc(var(--z-modal) + var(--layer-index, 0));
65
+ z-index: calc(var(--moduix-z-modal) + var(--layer-index, 0));
64
66
  overscroll-behavior: contain;
65
67
  scrollbar-gutter: stable both-edges;
66
- padding: var(--dialog-positioner-padding, var(--spacing-4));
68
+ padding: var(--moduix-dialog-positioner-padding, var(--moduix-spacing-4));
67
69
  place-items: center;
68
70
  display: grid;
69
71
  position: fixed;
@@ -73,20 +75,22 @@
73
75
 
74
76
  ._9AixhG_content {
75
77
  box-sizing: border-box;
76
- width: min(var(--dialog-width, 28rem),
77
- var(--dialog-max-width, calc(100vw - var(--spacing-8, 2rem))));
78
+ width: min(var(--moduix-dialog-width, 28rem),
79
+ var(--moduix-dialog-max-width, calc(100vw - var(--moduix-spacing-8, 2rem))));
78
80
  max-width: 100%;
79
- max-height: calc(100dvh - var(--spacing-8, 2rem));
80
- padding: var(--dialog-padding, var(--spacing-6));
81
- border: var(--dialog-border-width, var(--border-width-sm)) solid
82
- var(--dialog-border-color, var(--color-border));
83
- border-radius: var(--dialog-radius, var(--radius-lg));
84
- background-color: var(--dialog-bg, var(--color-popover));
85
- color: var(--dialog-color, var(--color-popover-foreground));
86
- box-shadow: var(--dialog-shadow, var(--shadow-lg));
81
+ max-height: calc(100dvh - var(--moduix-spacing-8, 2rem));
82
+ padding: var(--moduix-dialog-padding, var(--moduix-spacing-6));
83
+ border: var(--moduix-dialog-border-width, var(--moduix-border-width-sm)) solid
84
+ var(--moduix-dialog-border-color, var(--moduix-color-border));
85
+ border-radius: var(--moduix-dialog-radius, var(--moduix-radius-lg));
86
+ background-color: var(--moduix-dialog-bg, var(--moduix-color-popover));
87
+ color: var(--moduix-dialog-color, var(--moduix-color-popover-foreground));
88
+ box-shadow: var(--moduix-dialog-shadow, var(--moduix-shadow-lg));
87
89
  transform-origin: top;
88
- transition: scale var(--dialog-nested-transition, var(--dialog-transition, var(--transition-default))),
89
- translate var(--dialog-nested-transition, var(--dialog-transition, var(--transition-default)));
90
+ transition: scale
91
+ var(--moduix-dialog-nested-transition, var(--moduix-dialog-transition, var(--moduix-transition-default))),
92
+ translate
93
+ var(--moduix-dialog-nested-transition, var(--moduix-dialog-transition, var(--moduix-transition-default)));
90
94
  outline: 0;
91
95
  position: relative;
92
96
  translate: 0;
@@ -96,19 +100,20 @@
96
100
  content: "";
97
101
  z-index: 1;
98
102
  border-radius: inherit;
99
- background-color: var(--dialog-nested-overlay-bg, #0000000d);
103
+ background-color: var(--moduix-dialog-nested-overlay-bg, #0000000d);
100
104
  opacity: 0;
101
105
  pointer-events: none;
102
106
  transition: opacity
103
- var(--dialog-nested-transition, var(--dialog-transition, var(--transition-default)));
107
+ var(--moduix-dialog-nested-transition, var(--moduix-dialog-transition, var(--moduix-transition-default)));
104
108
  position: absolute;
105
109
  inset: 0;
106
110
  }
107
111
 
108
112
  &[data-has-nested] {
109
- scale: calc(1 - var(--dialog-nested-scale-step, .05) * var(--nested-layer-count, 0));
113
+ scale: calc(1 - var(--moduix-dialog-nested-scale-step, .05) * var(--nested-layer-count, 0));
110
114
  translate: 0
111
- calc(var(--dialog-nested-translate-step, var(--spacing-10)) * var(--nested-layer-count, 0));
115
+ calc(var(--moduix-dialog-nested-translate-step, var(--moduix-spacing-10)) *
116
+ var(--nested-layer-count, 0));
112
117
 
113
118
  &:after {
114
119
  opacity: 1;
@@ -117,20 +122,20 @@
117
122
 
118
123
  &[data-state="open"] {
119
124
  animation: _9AixhG_dialog-content-in
120
- var(--dialog-transition, var(--popup-motion-duration, var(--duration-normal))
121
- var(--popup-motion-easing, var(--ease-in-out)));
125
+ var(--moduix-dialog-transition, var(--moduix-popup-motion-duration, var(--moduix-duration-normal))
126
+ var(--moduix-popup-motion-easing, var(--moduix-ease-in-out)));
122
127
  }
123
128
 
124
129
  &[data-state="closed"] {
125
130
  animation: _9AixhG_dialog-content-out
126
- var(--dialog-transition, var(--popup-motion-duration, var(--duration-normal))
127
- var(--popup-motion-easing, var(--ease-in-out)));
131
+ var(--moduix-dialog-transition, var(--moduix-popup-motion-duration, var(--moduix-duration-normal))
132
+ var(--moduix-popup-motion-easing, var(--moduix-ease-in-out)));
128
133
  }
129
134
  }
130
135
 
131
136
  ._9AixhG_header {
132
137
  align-items: start;
133
- gap: var(--dialog-header-gap, var(--spacing-1));
138
+ gap: var(--moduix-dialog-header-gap, var(--moduix-spacing-1));
134
139
  grid-template-columns: minmax(0, 1fr) auto;
135
140
  display: grid;
136
141
 
@@ -149,17 +154,17 @@
149
154
  }
150
155
 
151
156
  ._9AixhG_title {
152
- color: var(--dialog-title-color, var(--dialog-color, var(--color-popover-foreground)));
153
- font-size: var(--dialog-title-font-size, var(--text-lg));
154
- font-weight: var(--dialog-title-font-weight, var(--weight-semibold));
155
- line-height: var(--dialog-title-line-height, var(--line-height-text-lg));
157
+ color: var(--moduix-dialog-title-color, var(--moduix-dialog-color, var(--moduix-color-popover-foreground)));
158
+ font-size: var(--moduix-dialog-title-font-size, var(--moduix-text-lg));
159
+ font-weight: var(--moduix-dialog-title-font-weight, var(--moduix-weight-semibold));
160
+ line-height: var(--moduix-dialog-title-line-height, var(--moduix-line-height-text-lg));
156
161
  margin: 0;
157
162
  }
158
163
 
159
164
  ._9AixhG_description, ._9AixhG_body {
160
- color: var(--dialog-description-color, var(--dialog-muted-color, var(--color-muted-foreground)));
161
- font-size: var(--dialog-description-font-size, var(--text-md));
162
- line-height: var(--dialog-description-line-height, var(--line-height-text-md));
165
+ color: var(--moduix-dialog-description-color, var(--moduix-dialog-muted-color, var(--moduix-color-muted-foreground)));
166
+ font-size: var(--moduix-dialog-description-font-size, var(--moduix-text-md));
167
+ line-height: var(--moduix-dialog-description-line-height, var(--moduix-line-height-text-md));
163
168
  }
164
169
 
165
170
  ._9AixhG_description {
@@ -167,60 +172,60 @@
167
172
  }
168
173
 
169
174
  ._9AixhG_body {
170
- margin: var(--dialog-content-margin, var(--spacing-4) 0 0);
175
+ margin: var(--moduix-dialog-content-margin, var(--moduix-spacing-4) 0 0);
171
176
  }
172
177
 
173
178
  ._9AixhG_footer {
174
179
  justify-content: flex-end;
175
- gap: var(--dialog-footer-gap, var(--spacing-2));
176
- margin-top: var(--dialog-footer-margin-top, var(--spacing-6));
180
+ gap: var(--moduix-dialog-footer-gap, var(--moduix-spacing-2));
181
+ margin-top: var(--moduix-dialog-footer-margin-top, var(--moduix-spacing-6));
177
182
  display: flex;
178
183
  }
179
184
 
180
185
  ._9AixhG_closeIcon {
181
- --close-button-size: var(--dialog-close-icon-size, var(--spacing-7));
182
- --close-button-radius: var(--dialog-close-icon-radius, var(--radius-md));
183
- --close-button-color: var(--dialog-close-icon-color, var(--dialog-muted-color, var(--color-muted-foreground)));
184
- --close-button-color-hover: var(--dialog-close-icon-color-hover, var(--dialog-close-icon-color, var(--dialog-color, var(--color-popover-foreground))));
185
- --close-button-bg: var(--dialog-close-icon-bg, transparent);
186
- --close-button-bg-hover: var(--dialog-close-icon-bg-hover, var(--color-accent));
187
- --close-button-focus-ring-color: var(--dialog-close-icon-focus-ring-color, var(--dialog-focus-ring-color, var(--color-ring)));
188
- --close-button-icon-size: var(--dialog-close-icon-glyph-size, var(--spacing-3));
186
+ --moduix-close-button-size: var(--moduix-dialog-close-icon-size, var(--moduix-spacing-7));
187
+ --moduix-close-button-radius: var(--moduix-dialog-close-icon-radius, var(--moduix-radius-md));
188
+ --moduix-close-button-color: var(--moduix-dialog-close-icon-color, var(--moduix-dialog-muted-color, var(--moduix-color-muted-foreground)));
189
+ --moduix-close-button-color-hover: var(--moduix-dialog-close-icon-color-hover, var(--moduix-dialog-close-icon-color, var(--moduix-dialog-color, var(--moduix-color-popover-foreground))));
190
+ --moduix-close-button-bg: var(--moduix-dialog-close-icon-bg, transparent);
191
+ --moduix-close-button-bg-hover: var(--moduix-dialog-close-icon-bg-hover, var(--moduix-color-accent));
192
+ --moduix-close-button-focus-ring-color: var(--moduix-dialog-close-icon-focus-ring-color, var(--moduix-dialog-focus-ring-color, var(--moduix-color-ring)));
193
+ --moduix-close-button-icon-size: var(--moduix-dialog-close-icon-glyph-size, var(--moduix-spacing-3));
189
194
  z-index: 2;
190
195
  position: absolute;
191
- inset-block-start: var(--dialog-close-icon-inset-block-start, var(--spacing-4));
192
- inset-inline-end: var(--dialog-close-icon-inset-inline-end, var(--spacing-4));
196
+ inset-block-start: var(--moduix-dialog-close-icon-inset-block-start, var(--moduix-spacing-4));
197
+ inset-inline-end: var(--moduix-dialog-close-icon-inset-inline-end, var(--moduix-spacing-4));
193
198
  }
194
199
 
195
200
  @keyframes _9AixhG_dialog-backdrop-in {
196
201
  from {
197
- opacity: var(--dialog-backdrop-starting-opacity, 0);
198
- backdrop-filter: var(--dialog-backdrop-starting-blur, none);
202
+ opacity: var(--moduix-dialog-backdrop-starting-opacity, 0);
203
+ backdrop-filter: var(--moduix-dialog-backdrop-starting-blur, none);
199
204
  }
200
205
  }
201
206
 
202
207
  @keyframes _9AixhG_dialog-backdrop-out {
203
208
  to {
204
- opacity: var(--dialog-backdrop-ending-opacity, 0);
205
- backdrop-filter: var(--dialog-backdrop-ending-blur, none);
209
+ opacity: var(--moduix-dialog-backdrop-ending-opacity, 0);
210
+ backdrop-filter: var(--moduix-dialog-backdrop-ending-blur, none);
206
211
  }
207
212
  }
208
213
 
209
214
  @keyframes _9AixhG_dialog-content-in {
210
215
  from {
211
- opacity: var(--dialog-content-starting-opacity, var(--popup-motion-starting-opacity, 0));
212
- translate: var(--dialog-content-starting-translate-x, var(--popup-motion-starting-translate-x, 0))
213
- var(--dialog-content-starting-translate-y, var(--popup-motion-starting-translate-y, 0));
214
- scale: var(--dialog-content-starting-scale, var(--popup-motion-starting-scale, var(--scale-popup)));
216
+ opacity: var(--moduix-dialog-content-starting-opacity, var(--moduix-popup-motion-starting-opacity, 0));
217
+ translate: var(--moduix-dialog-content-starting-translate-x, var(--moduix-popup-motion-starting-translate-x, 0))
218
+ var(--moduix-dialog-content-starting-translate-y, var(--moduix-popup-motion-starting-translate-y, 0));
219
+ scale: var(--moduix-dialog-content-starting-scale, var(--moduix-popup-motion-starting-scale, var(--moduix-scale-popup)));
215
220
  }
216
221
  }
217
222
 
218
223
  @keyframes _9AixhG_dialog-content-out {
219
224
  to {
220
- opacity: var(--dialog-content-ending-opacity, var(--popup-motion-ending-opacity, 0));
221
- translate: var(--dialog-content-ending-translate-x, var(--popup-motion-ending-translate-x, 0))
222
- var(--dialog-content-ending-translate-y, var(--popup-motion-ending-translate-y, 0));
223
- scale: var(--dialog-content-ending-scale, var(--popup-motion-ending-scale, var(--scale-popup)));
225
+ opacity: var(--moduix-dialog-content-ending-opacity, var(--moduix-popup-motion-ending-opacity, 0));
226
+ translate: var(--moduix-dialog-content-ending-translate-x, var(--moduix-popup-motion-ending-translate-x, 0))
227
+ var(--moduix-dialog-content-ending-translate-y, var(--moduix-popup-motion-ending-translate-y, 0));
228
+ scale: var(--moduix-dialog-content-ending-scale, var(--moduix-popup-motion-ending-scale, var(--moduix-scale-popup)));
224
229
  }
225
230
  }
226
231
  }