@mantine-vue/schedule 2.3.1 → 2.4.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 (9) hide show
  1. package/cjs/index.cjs +29 -15
  2. package/cjs/index.cjs.map +1 -1
  3. package/esm/index.mjs +29 -15
  4. package/esm/index.mjs.map +1 -1
  5. package/lib/components/ScheduleHeader/ScheduleHeaderBase.d.ts +5 -2
  6. package/lib/utils/clamp-interval-minutes/clamp-interval-minutes.d.ts +8 -1
  7. package/package.json +4 -4
  8. package/styles.css +52 -37
  9. package/styles.layer.css +52 -37
package/lib/components/ScheduleHeader/ScheduleHeaderBase.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { type PropType, type VNodeChild } from 'vue';
1
+ import { type PropType, type SlotsType, type VNodeChild } from 'vue';
2
2
  import { type ScheduleLabelsOverride } from '../../labels';
3
3
  import type { DateStringValue, ScheduleViewLevel } from '../../types';
4
4
  import type { MonthYearSelectProps, NativeButtonProps, ViewSelectProps } from '../../component-props';
@@ -22,6 +22,9 @@ export interface ScheduleHeaderBaseProps {
22
22
  todayControlProps?: NativeButtonProps;
23
23
  viewSelectProps?: Partial<ViewSelectProps>;
24
24
  }
25
+ export interface ScheduleHeaderBaseSlots {
26
+ title?: () => VNodeChild;
27
+ }
25
28
  export declare const ScheduleHeaderBase: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
26
29
  view: {
27
30
  type: PropType<ScheduleViewLevel>;
@@ -64,7 +67,7 @@ export declare const ScheduleHeaderBase: import("vue").DefineComponent<import("v
64
67
  nextControlProps: PropType<NativeButtonProps>;
65
68
  todayControlProps: PropType<NativeButtonProps>;
66
69
  viewSelectProps: PropType<Partial<ViewSelectProps>>;
67
- }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
70
+ }>> & Readonly<{}>, {}, SlotsType<ScheduleHeaderBaseSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
68
71
  export declare function createHeaderNavigation(date: Date | string, unit: 'day' | 'week' | 'month' | 'year'): {
69
72
  previous: () => string;
70
73
  next: () => string;
package/lib/utils/clamp-interval-minutes/clamp-interval-minutes.d.ts CHANGED
@@ -1,2 +1,9 @@
1
- /** Clamp interval minutes to valid values (1-60) and ensure it divides evenly into 60 */
1
+ /**
2
+ * Clamps interval minutes to a value that keeps the time grid consistent:
3
+ *
4
+ * - Values of 60 or less must divide evenly into an hour.
5
+ * - Values above an hour must be a whole number of hours.
6
+ *
7
+ * Invalid values fall back to 60 and the result is capped to one day.
8
+ */
2
9
  export declare function clampIntervalMinutes(intervalMinutes: number): number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mantine-vue/schedule",
3
- "version": "2.3.1",
3
+ "version": "2.4.0",
4
4
  "description": "Vue schedule and calendar components equivalent to @mantine/schedule",
5
5
  "license": "MIT",
6
6
  "files": [
@@ -44,9 +44,9 @@
44
44
  "vue": "^3.5.0"
45
45
  },
46
46
  "peerDependencies": {
47
- "@mantine-vue/core": "2.3.1",
48
- "@mantine-vue/dates": "2.3.1",
49
- "@mantine-vue/hooks": "2.3.1",
47
+ "@mantine-vue/core": "2.4.0",
48
+ "@mantine-vue/dates": "2.4.0",
49
+ "@mantine-vue/hooks": "2.4.0",
50
50
  "dayjs": ">=1.0.0",
51
51
  "vue": "^3.5.0"
52
52
  }
package/styles.css CHANGED
@@ -60,7 +60,7 @@
60
60
  z-index: 2;
61
61
  text-transform: uppercase;
62
62
  }
63
- ._event_bnqc2_1 {
63
+ ._event_19lsr_1 {
64
64
  padding: calc(0.0625rem * var(--mantine-scale));
65
65
  pointer-events: none;
66
66
  display: flex;
@@ -70,58 +70,58 @@
70
70
  z-index: 3;
71
71
  }
72
72
 
73
- ._event_bnqc2_1:where([data-auto-size]) {
73
+ ._event_19lsr_1:where([data-auto-size]) {
74
74
  container-type: size;
75
75
  }
76
76
 
77
- ._event_bnqc2_1:where([data-draggable]) ._eventInner_bnqc2_14 {
77
+ ._event_19lsr_1:where([data-draggable]) ._eventInner_19lsr_14 {
78
78
  cursor: grab;
79
79
  }
80
80
 
81
- ._event_bnqc2_1:where([data-draggable]) ._eventInner_bnqc2_14:active {
81
+ ._event_19lsr_1:where([data-draggable]) ._eventInner_19lsr_14:active {
82
82
  cursor: grabbing;
83
83
  }
84
84
 
85
- ._event_bnqc2_1:where([data-dragging]) {
85
+ ._event_19lsr_1:where([data-dragging]) {
86
86
  opacity: 0.2;
87
87
  }
88
88
 
89
- ._event_bnqc2_1:where([data-dragging]) ._eventInner_bnqc2_14 {
89
+ ._event_19lsr_1:where([data-dragging]) ._eventInner_19lsr_14 {
90
90
  cursor: grabbing;
91
91
  }
92
92
 
93
- ._event_bnqc2_1:where([data-any-dragging]:not([data-dragging])) {
93
+ ._event_19lsr_1:where([data-any-dragging]:not([data-dragging])) {
94
94
  pointer-events: none;
95
95
  }
96
96
 
97
- ._event_bnqc2_1:where([data-any-dragging]:not([data-dragging])) ._eventInner_bnqc2_14 {
97
+ ._event_19lsr_1:where([data-any-dragging]:not([data-dragging])) ._eventInner_19lsr_14 {
98
98
  pointer-events: none;
99
99
  }
100
100
 
101
- ._event_bnqc2_1:where([data-static]) {
101
+ ._event_19lsr_1:where([data-static]) {
102
102
  pointer-events: none;
103
103
  cursor: default;
104
104
  }
105
105
 
106
- ._event_bnqc2_1:where([data-resizing]) {
106
+ ._event_19lsr_1:where([data-resizing]) {
107
107
  z-index: 10;
108
108
  }
109
109
 
110
110
  @media (hover: hover) {
111
111
 
112
- ._event_bnqc2_1:where([data-resizing]) ._eventInner_bnqc2_14:hover {
112
+ ._event_19lsr_1:where([data-resizing]) ._eventInner_19lsr_14:hover {
113
113
  background-color: var(--event-bg);
114
114
  }
115
115
  }
116
116
 
117
117
  @media (hover: none) {
118
118
 
119
- ._event_bnqc2_1:where([data-resizing]) ._eventInner_bnqc2_14:active {
119
+ ._event_19lsr_1:where([data-resizing]) ._eventInner_19lsr_14:active {
120
120
  background-color: var(--event-bg);
121
121
  }
122
122
  }
123
123
 
124
- ._event_bnqc2_1:where([data-hanging='start'], [data-hanging='both'])::before {
124
+ ._event_19lsr_1:where([data-hanging='start'], [data-hanging='both'])::before {
125
125
  content: '';
126
126
  position: absolute;
127
127
  inset-block: calc(0.125rem * var(--mantine-scale));
@@ -132,13 +132,13 @@
132
132
  opacity: 0.3;
133
133
  }
134
134
 
135
- ._event_bnqc2_1:where([data-hanging='start'], [data-hanging='both']) ._eventInner_bnqc2_14 {
135
+ ._event_19lsr_1:where([data-hanging='start'], [data-hanging='both']) ._eventInner_19lsr_14 {
136
136
  padding-inline-start: calc(0.375rem * var(--mantine-scale));
137
137
  border-start-start-radius: 0;
138
138
  border-end-start-radius: 0;
139
139
  }
140
140
 
141
- ._event_bnqc2_1:where([data-hanging='end'], [data-hanging='both'])::after {
141
+ ._event_19lsr_1:where([data-hanging='end'], [data-hanging='both'])::after {
142
142
  content: '';
143
143
  position: absolute;
144
144
  inset-block: calc(0.125rem * var(--mantine-scale));
@@ -149,27 +149,27 @@
149
149
  opacity: 0.3;
150
150
  }
151
151
 
152
- ._event_bnqc2_1:where([data-hanging='end'], [data-hanging='both']) ._eventInner_bnqc2_14 {
152
+ ._event_19lsr_1:where([data-hanging='end'], [data-hanging='both']) ._eventInner_19lsr_14 {
153
153
  padding-inline-end: calc(0.375rem * var(--mantine-scale));
154
154
  border-start-end-radius: 0;
155
155
  border-end-end-radius: 0;
156
156
  }
157
157
 
158
- ._event_bnqc2_1:where([data-clip-start]) ._eventInner_bnqc2_14 {
158
+ ._event_19lsr_1:where([data-clip-start]) ._eventInner_19lsr_14 {
159
159
  padding-inline-start: calc(0.75rem * var(--mantine-scale));
160
160
  border-start-start-radius: 0;
161
161
  border-end-start-radius: 0;
162
162
  clip-path: polygon(10px 0, 100% 0, 100% 100%, calc(0.625rem * var(--mantine-scale)) 100%, 0 50%);
163
163
  }
164
164
 
165
- ._event_bnqc2_1:where([data-clip-end]) ._eventInner_bnqc2_14 {
165
+ ._event_19lsr_1:where([data-clip-end]) ._eventInner_19lsr_14 {
166
166
  padding-inline-end: calc(0.75rem * var(--mantine-scale));
167
167
  border-start-end-radius: 0;
168
168
  border-end-end-radius: 0;
169
169
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%);
170
170
  }
171
171
 
172
- ._event_bnqc2_1:where([data-clip-start][data-clip-end]) ._eventInner_bnqc2_14 {
172
+ ._event_19lsr_1:where([data-clip-start][data-clip-end]) ._eventInner_19lsr_14 {
173
173
  clip-path: polygon(
174
174
  calc(0.625rem * var(--mantine-scale)) 0,
175
175
  calc(100% - 10px) 0,
@@ -180,11 +180,11 @@
180
180
  );
181
181
  }
182
182
 
183
- ._eventInner_bnqc2_14 {
183
+ ._eventInner_19lsr_14 {
184
184
  background-color: var(--event-bg);
185
185
  color: var(--event-color);
186
186
  pointer-events: all;
187
- border-radius: var(--event-radius);
187
+ border-radius: min(var(--event-radius), 50%);
188
188
  font-weight: var(--mantine-font-weight-medium);
189
189
  font-size: calc(0.75rem * var(--mantine-scale));
190
190
  line-height: 1;
@@ -196,34 +196,49 @@
196
196
  overflow: hidden;
197
197
  }
198
198
 
199
- ._eventInner_bnqc2_14:where([data-nowrap]) {
199
+ ._eventInner_19lsr_14:where([data-nowrap]) {
200
200
  white-space: nowrap;
201
201
  text-overflow: ellipsis;
202
202
  line-height: 1.25;
203
203
  }
204
204
 
205
- ._eventInner_bnqc2_14:where([data-size='md']) {
205
+ ._eventInner_19lsr_14:where([data-size='md']) {
206
206
  font-size: calc(0.875rem * var(--mantine-scale));
207
207
  padding: calc(0.25rem * var(--mantine-scale)) calc(0.375rem * var(--mantine-scale));
208
208
  }
209
209
 
210
210
  @media (hover: hover) {
211
211
 
212
- ._eventInner_bnqc2_14:hover {
212
+ ._eventInner_19lsr_14:hover {
213
213
  background-color: var(--event-hover);
214
214
  }
215
215
  }
216
216
 
217
217
  @media (hover: none) {
218
218
 
219
- ._eventInner_bnqc2_14:active {
219
+ ._eventInner_19lsr_14:active {
220
220
  background-color: var(--event-hover);
221
221
  }
222
222
  }
223
223
 
224
+ @container (max-width: 12px) {
225
+
226
+ ._eventInner_19lsr_14:where([data-auto-size]) {
227
+ padding-inline: 0
228
+ }
229
+ }
230
+
231
+ @container (min-width: 16px) {
232
+
233
+ ._eventInner_19lsr_14:where([data-auto-size]) {
234
+ width: calc(100% - 2px);
235
+ margin-inline: auto
236
+ }
237
+ }
238
+
224
239
  @container (max-height: 18px) {
225
240
 
226
- ._eventInner_bnqc2_14:where([data-auto-size]) {
241
+ ._eventInner_19lsr_14:where([data-auto-size]) {
227
242
  font-size: calc(0.5625rem * var(--mantine-scale));
228
243
  padding-block: 0rem;
229
244
  display: flex;
@@ -232,30 +247,30 @@
232
247
  }
233
248
  }
234
249
 
235
- ._event_bnqc2_1[data-static] ._eventInner_bnqc2_14 {
250
+ ._event_19lsr_1[data-static] ._eventInner_19lsr_14 {
236
251
  cursor: default;
237
252
  pointer-events: none;
238
253
  }
239
254
 
240
255
  @media (hover: hover) {
241
256
 
242
- ._event_bnqc2_1[data-static] ._eventInner_bnqc2_14:hover {
257
+ ._event_19lsr_1[data-static] ._eventInner_19lsr_14:hover {
243
258
  background-color: var(--event-bg);
244
259
  }
245
260
  }
246
261
 
247
262
  @media (hover: none) {
248
263
 
249
- ._event_bnqc2_1[data-static] ._eventInner_bnqc2_14:active {
264
+ ._event_19lsr_1[data-static] ._eventInner_19lsr_14:active {
250
265
  background-color: var(--event-bg);
251
266
  }
252
267
  }
253
268
 
254
- :where([data-slot-dragging]) ._eventInner_bnqc2_14 {
269
+ :where([data-slot-dragging]) ._eventInner_19lsr_14 {
255
270
  pointer-events: none;
256
271
  }
257
272
 
258
- ._eventResizeHandle_bnqc2_177 {
273
+ ._eventResizeHandle_19lsr_186 {
259
274
  position: absolute;
260
275
  left: 50%;
261
276
  transform: translateX(-50%);
@@ -272,34 +287,34 @@
272
287
  transition: opacity 100ms ease;
273
288
  }
274
289
 
275
- ._eventResizeHandle_bnqc2_177::before {
290
+ ._eventResizeHandle_19lsr_186::before {
276
291
  content: '';
277
292
  position: absolute;
278
293
  inset: calc(-0.25rem * var(--mantine-scale)) calc(-0.375rem * var(--mantine-scale));
279
294
  }
280
295
 
281
- ._eventResizeHandle_bnqc2_177:where([data-edge='top']) {
296
+ ._eventResizeHandle_19lsr_186:where([data-edge='top']) {
282
297
  top: calc(-0.125rem * var(--mantine-scale));
283
298
  }
284
299
 
285
- ._eventResizeHandle_bnqc2_177:where([data-edge='bottom']) {
300
+ ._eventResizeHandle_19lsr_186:where([data-edge='bottom']) {
286
301
  bottom: calc(-0.125rem * var(--mantine-scale));
287
302
  }
288
303
 
289
- ._event_bnqc2_1:where(:hover, [data-resizing]) ._eventResizeHandle_bnqc2_177 {
304
+ ._event_19lsr_1:where(:hover, [data-resizing]) ._eventResizeHandle_19lsr_186 {
290
305
  opacity: 0.5;
291
306
  }
292
307
 
293
308
  @media (hover: hover) {
294
309
 
295
- ._eventResizeHandle_bnqc2_177:hover {
310
+ ._eventResizeHandle_19lsr_186:hover {
296
311
  opacity: 0.8;
297
312
  }
298
313
  }
299
314
 
300
315
  @media (hover: none) {
301
316
 
302
- ._eventResizeHandle_bnqc2_177:active {
317
+ ._eventResizeHandle_19lsr_186:active {
303
318
  opacity: 0.8;
304
319
  }
305
320
  }
package/styles.layer.css CHANGED
@@ -61,7 +61,7 @@
61
61
  z-index: 2;
62
62
  text-transform: uppercase;
63
63
  }
64
- ._event_bnqc2_1 {
64
+ ._event_19lsr_1 {
65
65
  padding: calc(0.0625rem * var(--mantine-scale));
66
66
  pointer-events: none;
67
67
  display: flex;
@@ -71,58 +71,58 @@
71
71
  z-index: 3;
72
72
  }
73
73
 
74
- ._event_bnqc2_1:where([data-auto-size]) {
74
+ ._event_19lsr_1:where([data-auto-size]) {
75
75
  container-type: size;
76
76
  }
77
77
 
78
- ._event_bnqc2_1:where([data-draggable]) ._eventInner_bnqc2_14 {
78
+ ._event_19lsr_1:where([data-draggable]) ._eventInner_19lsr_14 {
79
79
  cursor: grab;
80
80
  }
81
81
 
82
- ._event_bnqc2_1:where([data-draggable]) ._eventInner_bnqc2_14:active {
82
+ ._event_19lsr_1:where([data-draggable]) ._eventInner_19lsr_14:active {
83
83
  cursor: grabbing;
84
84
  }
85
85
 
86
- ._event_bnqc2_1:where([data-dragging]) {
86
+ ._event_19lsr_1:where([data-dragging]) {
87
87
  opacity: 0.2;
88
88
  }
89
89
 
90
- ._event_bnqc2_1:where([data-dragging]) ._eventInner_bnqc2_14 {
90
+ ._event_19lsr_1:where([data-dragging]) ._eventInner_19lsr_14 {
91
91
  cursor: grabbing;
92
92
  }
93
93
 
94
- ._event_bnqc2_1:where([data-any-dragging]:not([data-dragging])) {
94
+ ._event_19lsr_1:where([data-any-dragging]:not([data-dragging])) {
95
95
  pointer-events: none;
96
96
  }
97
97
 
98
- ._event_bnqc2_1:where([data-any-dragging]:not([data-dragging])) ._eventInner_bnqc2_14 {
98
+ ._event_19lsr_1:where([data-any-dragging]:not([data-dragging])) ._eventInner_19lsr_14 {
99
99
  pointer-events: none;
100
100
  }
101
101
 
102
- ._event_bnqc2_1:where([data-static]) {
102
+ ._event_19lsr_1:where([data-static]) {
103
103
  pointer-events: none;
104
104
  cursor: default;
105
105
  }
106
106
 
107
- ._event_bnqc2_1:where([data-resizing]) {
107
+ ._event_19lsr_1:where([data-resizing]) {
108
108
  z-index: 10;
109
109
  }
110
110
 
111
111
  @media (hover: hover) {
112
112
 
113
- ._event_bnqc2_1:where([data-resizing]) ._eventInner_bnqc2_14:hover {
113
+ ._event_19lsr_1:where([data-resizing]) ._eventInner_19lsr_14:hover {
114
114
  background-color: var(--event-bg);
115
115
  }
116
116
  }
117
117
 
118
118
  @media (hover: none) {
119
119
 
120
- ._event_bnqc2_1:where([data-resizing]) ._eventInner_bnqc2_14:active {
120
+ ._event_19lsr_1:where([data-resizing]) ._eventInner_19lsr_14:active {
121
121
  background-color: var(--event-bg);
122
122
  }
123
123
  }
124
124
 
125
- ._event_bnqc2_1:where([data-hanging='start'], [data-hanging='both'])::before {
125
+ ._event_19lsr_1:where([data-hanging='start'], [data-hanging='both'])::before {
126
126
  content: '';
127
127
  position: absolute;
128
128
  inset-block: calc(0.125rem * var(--mantine-scale));
@@ -133,13 +133,13 @@
133
133
  opacity: 0.3;
134
134
  }
135
135
 
136
- ._event_bnqc2_1:where([data-hanging='start'], [data-hanging='both']) ._eventInner_bnqc2_14 {
136
+ ._event_19lsr_1:where([data-hanging='start'], [data-hanging='both']) ._eventInner_19lsr_14 {
137
137
  padding-inline-start: calc(0.375rem * var(--mantine-scale));
138
138
  border-start-start-radius: 0;
139
139
  border-end-start-radius: 0;
140
140
  }
141
141
 
142
- ._event_bnqc2_1:where([data-hanging='end'], [data-hanging='both'])::after {
142
+ ._event_19lsr_1:where([data-hanging='end'], [data-hanging='both'])::after {
143
143
  content: '';
144
144
  position: absolute;
145
145
  inset-block: calc(0.125rem * var(--mantine-scale));
@@ -150,27 +150,27 @@
150
150
  opacity: 0.3;
151
151
  }
152
152
 
153
- ._event_bnqc2_1:where([data-hanging='end'], [data-hanging='both']) ._eventInner_bnqc2_14 {
153
+ ._event_19lsr_1:where([data-hanging='end'], [data-hanging='both']) ._eventInner_19lsr_14 {
154
154
  padding-inline-end: calc(0.375rem * var(--mantine-scale));
155
155
  border-start-end-radius: 0;
156
156
  border-end-end-radius: 0;
157
157
  }
158
158
 
159
- ._event_bnqc2_1:where([data-clip-start]) ._eventInner_bnqc2_14 {
159
+ ._event_19lsr_1:where([data-clip-start]) ._eventInner_19lsr_14 {
160
160
  padding-inline-start: calc(0.75rem * var(--mantine-scale));
161
161
  border-start-start-radius: 0;
162
162
  border-end-start-radius: 0;
163
163
  clip-path: polygon(10px 0, 100% 0, 100% 100%, calc(0.625rem * var(--mantine-scale)) 100%, 0 50%);
164
164
  }
165
165
 
166
- ._event_bnqc2_1:where([data-clip-end]) ._eventInner_bnqc2_14 {
166
+ ._event_19lsr_1:where([data-clip-end]) ._eventInner_19lsr_14 {
167
167
  padding-inline-end: calc(0.75rem * var(--mantine-scale));
168
168
  border-start-end-radius: 0;
169
169
  border-end-end-radius: 0;
170
170
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%);
171
171
  }
172
172
 
173
- ._event_bnqc2_1:where([data-clip-start][data-clip-end]) ._eventInner_bnqc2_14 {
173
+ ._event_19lsr_1:where([data-clip-start][data-clip-end]) ._eventInner_19lsr_14 {
174
174
  clip-path: polygon(
175
175
  calc(0.625rem * var(--mantine-scale)) 0,
176
176
  calc(100% - 10px) 0,
@@ -181,11 +181,11 @@
181
181
  );
182
182
  }
183
183
 
184
- ._eventInner_bnqc2_14 {
184
+ ._eventInner_19lsr_14 {
185
185
  background-color: var(--event-bg);
186
186
  color: var(--event-color);
187
187
  pointer-events: all;
188
- border-radius: var(--event-radius);
188
+ border-radius: min(var(--event-radius), 50%);
189
189
  font-weight: var(--mantine-font-weight-medium);
190
190
  font-size: calc(0.75rem * var(--mantine-scale));
191
191
  line-height: 1;
@@ -197,34 +197,49 @@
197
197
  overflow: hidden;
198
198
  }
199
199
 
200
- ._eventInner_bnqc2_14:where([data-nowrap]) {
200
+ ._eventInner_19lsr_14:where([data-nowrap]) {
201
201
  white-space: nowrap;
202
202
  text-overflow: ellipsis;
203
203
  line-height: 1.25;
204
204
  }
205
205
 
206
- ._eventInner_bnqc2_14:where([data-size='md']) {
206
+ ._eventInner_19lsr_14:where([data-size='md']) {
207
207
  font-size: calc(0.875rem * var(--mantine-scale));
208
208
  padding: calc(0.25rem * var(--mantine-scale)) calc(0.375rem * var(--mantine-scale));
209
209
  }
210
210
 
211
211
  @media (hover: hover) {
212
212
 
213
- ._eventInner_bnqc2_14:hover {
213
+ ._eventInner_19lsr_14:hover {
214
214
  background-color: var(--event-hover);
215
215
  }
216
216
  }
217
217
 
218
218
  @media (hover: none) {
219
219
 
220
- ._eventInner_bnqc2_14:active {
220
+ ._eventInner_19lsr_14:active {
221
221
  background-color: var(--event-hover);
222
222
  }
223
223
  }
224
224
 
225
+ @container (max-width: 12px) {
226
+
227
+ ._eventInner_19lsr_14:where([data-auto-size]) {
228
+ padding-inline: 0
229
+ }
230
+ }
231
+
232
+ @container (min-width: 16px) {
233
+
234
+ ._eventInner_19lsr_14:where([data-auto-size]) {
235
+ width: calc(100% - 2px);
236
+ margin-inline: auto
237
+ }
238
+ }
239
+
225
240
  @container (max-height: 18px) {
226
241
 
227
- ._eventInner_bnqc2_14:where([data-auto-size]) {
242
+ ._eventInner_19lsr_14:where([data-auto-size]) {
228
243
  font-size: calc(0.5625rem * var(--mantine-scale));
229
244
  padding-block: 0rem;
230
245
  display: flex;
@@ -233,30 +248,30 @@
233
248
  }
234
249
  }
235
250
 
236
- ._event_bnqc2_1[data-static] ._eventInner_bnqc2_14 {
251
+ ._event_19lsr_1[data-static] ._eventInner_19lsr_14 {
237
252
  cursor: default;
238
253
  pointer-events: none;
239
254
  }
240
255
 
241
256
  @media (hover: hover) {
242
257
 
243
- ._event_bnqc2_1[data-static] ._eventInner_bnqc2_14:hover {
258
+ ._event_19lsr_1[data-static] ._eventInner_19lsr_14:hover {
244
259
  background-color: var(--event-bg);
245
260
  }
246
261
  }
247
262
 
248
263
  @media (hover: none) {
249
264
 
250
- ._event_bnqc2_1[data-static] ._eventInner_bnqc2_14:active {
265
+ ._event_19lsr_1[data-static] ._eventInner_19lsr_14:active {
251
266
  background-color: var(--event-bg);
252
267
  }
253
268
  }
254
269
 
255
- :where([data-slot-dragging]) ._eventInner_bnqc2_14 {
270
+ :where([data-slot-dragging]) ._eventInner_19lsr_14 {
256
271
  pointer-events: none;
257
272
  }
258
273
 
259
- ._eventResizeHandle_bnqc2_177 {
274
+ ._eventResizeHandle_19lsr_186 {
260
275
  position: absolute;
261
276
  left: 50%;
262
277
  transform: translateX(-50%);
@@ -273,34 +288,34 @@
273
288
  transition: opacity 100ms ease;
274
289
  }
275
290
 
276
- ._eventResizeHandle_bnqc2_177::before {
291
+ ._eventResizeHandle_19lsr_186::before {
277
292
  content: '';
278
293
  position: absolute;
279
294
  inset: calc(-0.25rem * var(--mantine-scale)) calc(-0.375rem * var(--mantine-scale));
280
295
  }
281
296
 
282
- ._eventResizeHandle_bnqc2_177:where([data-edge='top']) {
297
+ ._eventResizeHandle_19lsr_186:where([data-edge='top']) {
283
298
  top: calc(-0.125rem * var(--mantine-scale));
284
299
  }
285
300
 
286
- ._eventResizeHandle_bnqc2_177:where([data-edge='bottom']) {
301
+ ._eventResizeHandle_19lsr_186:where([data-edge='bottom']) {
287
302
  bottom: calc(-0.125rem * var(--mantine-scale));
288
303
  }
289
304
 
290
- ._event_bnqc2_1:where(:hover, [data-resizing]) ._eventResizeHandle_bnqc2_177 {
305
+ ._event_19lsr_1:where(:hover, [data-resizing]) ._eventResizeHandle_19lsr_186 {
291
306
  opacity: 0.5;
292
307
  }
293
308
 
294
309
  @media (hover: hover) {
295
310
 
296
- ._eventResizeHandle_bnqc2_177:hover {
311
+ ._eventResizeHandle_19lsr_186:hover {
297
312
  opacity: 0.8;
298
313
  }
299
314
  }
300
315
 
301
316
  @media (hover: none) {
302
317
 
303
- ._eventResizeHandle_bnqc2_177:active {
318
+ ._eventResizeHandle_19lsr_186:active {
304
319
  opacity: 0.8;
305
320
  }
306
321
  }