@measured/puck 0.15.0-canary.480467a → 0.15.0-canary.91dff22

Sign up to get free protection for your applications and to get access to all the features.
Files changed (7) hide show
  1. package/README.md +1 -4
  2. package/dist/{Config-550396e1.d.ts → Config-6344ec1b.d.ts} +35 -14
  3. package/dist/index.css +994 -990
  4. package/dist/index.d.ts +43 -28
  5. package/dist/index.js +2908 -2794
  6. package/dist/rsc.d.ts +1 -1
  7. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -136,334 +136,325 @@
136
136
 
137
137
  /* styles.css */
138
138
 
139
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Button/Button.module.css/#css-module-data */
140
- ._Button_1t64k_1 {
141
- appearance: none;
142
- background: none;
143
- border: 1px solid transparent;
144
- border-radius: 4px;
145
- color: var(--puck-color-white);
146
- display: inline-flex;
147
- align-items: center;
148
- gap: 8px;
149
- letter-spacing: 0.05ch;
150
- font-family: var(--puck-font-family);
151
- font-size: 14px;
152
- font-weight: 400;
153
- box-sizing: border-box;
154
- line-height: 1;
155
- text-align: center;
156
- text-decoration: none;
157
- transition: background-color 50ms ease-in;
158
- cursor: pointer;
159
- white-space: nowrap;
160
- margin: 0;
139
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/AutoField/styles.module.css/#css-module-data */
140
+ ._Input_1t4qc_1 {
141
+ color: var(--puck-color-grey-04);
142
+ padding: 16px;
143
+ padding-bottom: 12px;
144
+ display: block;
161
145
  }
162
- ._Button_1t64k_1:hover,
163
- ._Button_1t64k_1:active {
164
- transition: none;
146
+ ._Input_1t4qc_1 ._Input_1t4qc_1 {
147
+ padding: 0px;
165
148
  }
166
- ._Button--medium_1t64k_29 {
167
- min-height: 34px;
168
- padding-bottom: 7px;
169
- padding-left: 19px;
170
- padding-right: 19px;
171
- padding-top: 7px;
149
+ ._Input_1t4qc_1 * {
150
+ box-sizing: border-box;
172
151
  }
173
- ._Button--large_1t64k_37 {
174
- padding-bottom: 11px;
175
- padding-left: 19px;
176
- padding-right: 19px;
177
- padding-top: 11px;
152
+ ._Input_1t4qc_1 + ._Input_1t4qc_1 {
153
+ border-top: 1px solid var(--puck-color-grey-09);
154
+ margin-top: 8px;
178
155
  }
179
- ._Button-icon_1t64k_44 {
180
- margin-top: 2px;
156
+ ._Input_1t4qc_1 ._Input_1t4qc_1 + ._Input_1t4qc_1 {
157
+ border-top: 0px;
158
+ margin-top: 12px;
181
159
  }
182
- ._Button--primary_1t64k_48 {
183
- background: var(--puck-color-azure-04);
160
+ ._Input-label_1t4qc_26 {
161
+ align-items: center;
162
+ display: flex;
163
+ padding-bottom: 12px;
164
+ font-size: var(--puck-font-size-xxs);
165
+ font-weight: 600;
184
166
  }
185
- ._Button_1t64k_1:focus-visible {
186
- outline: 2px solid var(--puck-color-azure-05);
187
- outline-offset: 2px;
167
+ ._Input-labelIcon_1t4qc_34 {
168
+ color: var(--puck-color-grey-07);
169
+ display: flex;
170
+ margin-right: 4px;
171
+ padding-left: 4px;
188
172
  }
189
- @media (hover: hover) and (pointer: fine) {
190
- ._Button--primary_1t64k_48:hover {
191
- background-color: var(--puck-color-azure-03);
192
- }
173
+ ._Input-disabledIcon_1t4qc_41 {
174
+ color: var(--puck-color-grey-05);
175
+ margin-left: auto;
193
176
  }
194
- ._Button--primary_1t64k_48:active {
195
- background-color: var(--puck-color-azure-02);
177
+ ._Input-input_1t4qc_46 {
178
+ background: var(--puck-color-white);
179
+ border-width: 1px;
180
+ border-style: solid;
181
+ border-color: var(--puck-color-grey-09);
182
+ border-radius: 4px;
183
+ font-family: inherit;
184
+ font-size: 14px;
185
+ padding: 12px 15px;
186
+ transition: border-color 50ms ease-in;
187
+ width: 100%;
196
188
  }
197
- ._Button--secondary_1t64k_67 {
198
- border: 1px solid currentColor;
199
- color: currentColor;
189
+ select._Input-input_1t4qc_46 {
190
+ appearance: none;
191
+ background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23c3c3c3'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat;
192
+ background-size: 12px;
193
+ background-position: calc(100% - 12px) calc(50% + 3px);
194
+ background-repeat: no-repeat;
195
+ background-color: var(--puck-color-white);
196
+ cursor: pointer;
200
197
  }
201
198
  @media (hover: hover) and (pointer: fine) {
202
- ._Button--secondary_1t64k_67:hover {
199
+ ._Input_1t4qc_1:has(> input):hover ._Input-input_1t4qc_46:not([readonly]),
200
+ ._Input_1t4qc_1:has(> textarea):hover ._Input-input_1t4qc_46:not([readonly]) {
201
+ border-color: var(--puck-color-grey-05);
202
+ transition: none;
203
+ }
204
+ ._Input_1t4qc_1:has(> select):hover ._Input-input_1t4qc_46:not([disabled]) {
203
205
  background-color: var(--puck-color-azure-12);
204
- color: var(--puck-color-black);
206
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%235a5a5a'><polygon points='0,0 100,0 50,50'/></svg>");
207
+ border-color: var(--puck-color-grey-05);
208
+ transition: none;
205
209
  }
206
210
  }
207
- ._Button--secondary_1t64k_67:active {
208
- background-color: var(--puck-color-azure-11);
209
- color: var(--puck-color-black);
210
- }
211
- ._Button--flush_1t64k_84 {
212
- border-radius: 0;
211
+ ._Input-input_1t4qc_46:focus {
212
+ border-color: var(--puck-color-grey-05);
213
+ outline: 2px solid var(--puck-color-azure-05);
214
+ transition: none;
213
215
  }
214
- ._Button--disabled_1t64k_88,
215
- ._Button--disabled_1t64k_88:hover {
216
- background-color: var(--puck-color-grey-07);
217
- color: var(--puck-color-grey-03);
218
- cursor: not-allowed;
216
+ ._Input--readOnly_1t4qc_90 > ._Input-input_1t4qc_46,
217
+ ._Input--readOnly_1t4qc_90 > select._Input-input_1t4qc_46,
218
+ ._Input-input_1t4qc_46:read-only {
219
+ background-color: var(--puck-color-grey-11);
220
+ border-color: var(--puck-color-grey-09);
221
+ color: var(--puck-color-grey-04);
222
+ cursor: default;
223
+ opacity: 1;
224
+ outline: 0;
225
+ transition: none;
219
226
  }
220
- ._Button--fullWidth_1t64k_95 {
221
- justify-content: center;
222
- width: 100%;
227
+ ._Input-radioGroupItems_1t4qc_102 {
228
+ display: flex;
229
+ border: 1px solid var(--puck-color-grey-09);
230
+ border-radius: 4px;
231
+ flex-wrap: wrap;
223
232
  }
224
- ._Button-spinner_1t64k_100 {
225
- padding-left: 8px;
233
+ ._Input-radio_1t4qc_102 {
234
+ border-right: 1px solid var(--puck-color-grey-09);
235
+ flex-grow: 1;
226
236
  }
227
-
228
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Drawer/styles.module.css/#css-module-data */
229
- ._Drawer_6zh0b_1 {
230
- font-family: var(--puck-font-family);
237
+ ._Input-radio_1t4qc_102:first-of-type {
238
+ border-bottom-left-radius: 4px;
239
+ border-top-left-radius: 4px;
231
240
  }
232
- ._DrawerItem-default_6zh0b_5 ._DrawerItem-draggableWrapper_6zh0b_5 {
233
- padding-bottom: 12px;
241
+ ._Input-radio_1t4qc_102:first-of-type ._Input-radioInner_1t4qc_119 {
242
+ border-bottom-left-radius: 3px;
243
+ border-top-left-radius: 3px;
234
244
  }
235
- ._DrawerItem_6zh0b_5:last-of-type ._DrawerItem-default_6zh0b_5 ._DrawerItem-draggableWrapper_6zh0b_5 {
236
- padding-bottom: 0;
245
+ ._Input-radio_1t4qc_102:last-of-type {
246
+ border-bottom-right-radius: 4px;
247
+ border-right: 0;
248
+ border-top-right-radius: 4px;
237
249
  }
238
- ._DrawerItem-draggable_6zh0b_5 {
239
- background: var(--puck-color-white);
240
- padding: 12px;
241
- display: flex;
242
- border: 1px var(--puck-color-grey-09) solid;
243
- border-radius: 4px;
244
- font-size: var(--puck-font-size-xxs);
245
- justify-content: space-between;
246
- align-items: center;
247
- cursor: grab;
248
- transition: background-color 50ms ease-in, color 50ms ease-in;
250
+ ._Input-radio_1t4qc_102:last-of-type ._Input-radioInner_1t4qc_119 {
251
+ border-bottom-right-radius: 3px;
252
+ border-top-right-radius: 3px;
249
253
  }
250
- ._DrawerItem_6zh0b_5:focus-visible {
251
- outline: 0;
254
+ ._Input-radioInner_1t4qc_119 {
255
+ background-color: var(--puck-color-white);
256
+ color: var(--puck-color-grey-04);
257
+ cursor: pointer;
258
+ font-size: var(--puck-font-size-xxxs);
259
+ padding: 8px 12px;
260
+ text-align: center;
261
+ transition: background-color 50ms ease-in;
252
262
  }
253
- ._Drawer_6zh0b_1:not(._Drawer--isDraggingFrom_6zh0b_31) ._DrawerItem_6zh0b_5:focus-visible ._DrawerItem-draggable_6zh0b_5 {
254
- border-radius: 4px;
263
+ ._Input-radio_1t4qc_102:has(:focus-visible) {
255
264
  outline: 2px solid var(--puck-color-azure-05);
256
265
  outline-offset: 2px;
266
+ position: relative;
257
267
  }
258
268
  @media (hover: hover) and (pointer: fine) {
259
- ._Drawer_6zh0b_1:not(._Drawer--isDraggingFrom_6zh0b_31) ._DrawerItem-draggable_6zh0b_5:hover {
269
+ ._Input-radioInner_1t4qc_119:hover {
260
270
  background-color: var(--puck-color-azure-12);
261
- color: var(--puck-color-azure-04);
262
271
  transition: none;
263
272
  }
264
273
  }
265
- ._DrawerItem-name_6zh0b_47 {
266
- overflow-x: hidden;
267
- text-overflow: ellipsis;
268
- white-space: nowrap;
269
- }
270
-
271
- /* css-module:/home/runner/work/puck/puck/packages/core/components/DragIcon/styles.module.css/#css-module-data */
272
- ._DragIcon_1p5wn_1 {
273
- color: var(--puck-color-grey-05);
274
- cursor: grab;
275
- padding: 4px;
276
- border-radius: 4px;
274
+ ._Input--readOnly_1t4qc_90 ._Input-radioInner_1t4qc_119 {
275
+ background-color: var(--puck-color-white);
276
+ color: var(--puck-color-grey-04);
277
+ cursor: default;
277
278
  }
278
- @media (hover: hover) and (pointer: fine) {
279
- ._DragIcon_1p5wn_1:hover {
280
- color: var(--puck-color-azure-05);
281
- background-color: var(--puck-color-azure-12);
282
- }
279
+ ._Input-radio_1t4qc_102 ._Input-radioInput_1t4qc_164:checked ~ ._Input-radioInner_1t4qc_119 {
280
+ background-color: var(--puck-color-azure-11);
281
+ color: var(--puck-color-azure-04);
282
+ font-weight: 500;
283
283
  }
284
-
285
- /* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
286
- ._DraggableComponent_59z7f_1 {
287
- pointer-events: auto;
288
- --overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
284
+ ._Input--readOnly_1t4qc_90 ._Input-radioInput_1t4qc_164:checked ~ ._Input-radioInner_1t4qc_119 {
285
+ background-color: var(--puck-color-grey-11);
286
+ color: var(--puck-color-grey-04);
289
287
  }
290
- ._DraggableComponent--isDragging_59z7f_11 {
291
- background: color-mix(in srgb, var(--puck-color-azure-08) 10%, transparent);
288
+ ._Input-radio_1t4qc_102 ._Input-radioInput_1t4qc_164 {
289
+ clip: rect(0 0 0 0);
290
+ clip-path: inset(100%);
291
+ height: 1px;
292
292
  overflow: hidden;
293
+ position: absolute;
294
+ white-space: nowrap;
295
+ width: 1px;
293
296
  }
294
- ._DraggableComponent-contents_59z7f_16 {
295
- position: relative;
296
- pointer-events: none;
297
- z-index: 0;
297
+ textarea._Input-input_1t4qc_46 {
298
+ margin-bottom: -4px;
298
299
  }
299
- ._DraggableComponent-contents_59z7f_16::before,
300
- ._DraggableComponent-contents_59z7f_16::after {
301
- content: " ";
302
- display: table;
300
+
301
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/AutoField/fields/ArrayField/styles.module.css/#css-module-data */
302
+ ._ArrayField_1lr58_5 {
303
+ display: flex;
304
+ flex-direction: column;
305
+ background-color: var(--puck-color-grey-09);
306
+ border: 1px solid var(--puck-color-grey-09);
307
+ border-radius: 4px;
303
308
  }
304
- ._DraggableComponent-overlay_59z7f_29 {
309
+ ._ArrayField--isDraggingFrom_1lr58_13 {
310
+ background-color: var(--puck-color-azure-11);
311
+ overflow: hidden;
312
+ }
313
+ ._ArrayField-addButton_1lr58_18 {
314
+ background-color: var(--puck-color-white);
315
+ border: none;
316
+ border-radius: 3px;
317
+ display: flex;
318
+ color: var(--puck-color-azure-05);
319
+ justify-content: center;
305
320
  cursor: pointer;
306
- height: 100%;
307
321
  width: 100%;
308
- top: 0;
309
- outline-offset: -2px;
310
- position: absolute;
311
- pointer-events: none;
312
- box-sizing: border-box;
313
- z-index: 1;
322
+ margin: 0;
323
+ padding: 14px;
324
+ text-align: left;
325
+ transition: background-color 50ms ease-in;
314
326
  }
315
- ._DraggableComponent_59z7f_1:focus-visible > ._DraggableComponent-overlay_59z7f_29 {
316
- outline: 1px solid var(--puck-color-azure-05);
327
+ ._ArrayField--hasItems_1lr58_33 > ._ArrayField-addButton_1lr58_18 {
328
+ border-top: 1px solid var(--puck-color-grey-09);
329
+ border-top-left-radius: 0;
330
+ border-top-right-radius: 0;
317
331
  }
318
- ._DraggableComponent--isDragging_59z7f_11 > ._DraggableComponent-overlay_59z7f_29 {
319
- outline: 2px var(--puck-color-azure-09) solid !important;
320
- }
321
- ._DraggableComponent-loadingOverlay_59z7f_49 {
322
- background: var(--puck-color-white);
323
- color: var(--puck-color-grey-03);
324
- border-radius: 4px;
325
- display: flex;
326
- padding: 8px;
327
- top: 8px;
328
- right: 8px;
329
- position: absolute;
330
- z-index: 1;
331
- pointer-events: all;
332
- box-sizing: border-box;
333
- opacity: 0.8;
334
- z-index: 1;
332
+ ._ArrayField-addButton_1lr58_18:focus-visible {
333
+ outline: 2px solid var(--puck-color-azure-05);
334
+ outline-offset: 2px;
335
+ position: relative;
335
336
  }
336
- ._DraggableComponent_59z7f_1:hover:not(._DraggableComponent--isLocked_59z7f_65) > ._DraggableComponent-overlay_59z7f_29 {
337
- background: var(--overlay-background);
338
- pointer-events: none;
337
+ @media (hover: hover) and (pointer: fine) {
338
+ ._ArrayField_1lr58_5:not(._ArrayField--isDraggingFrom_1lr58_13) > ._ArrayField-addButton_1lr58_18:hover {
339
+ background: var(--puck-color-azure-12);
340
+ color: var(--puck-color-azure-04);
341
+ transition: none;
342
+ }
339
343
  }
340
- ._DraggableComponent--forceHover_59z7f_71 > ._DraggableComponent-overlay_59z7f_29 {
341
- background: var(--overlay-background);
342
- pointer-events: none;
344
+ ._ArrayField_1lr58_5:not(._ArrayField--isDraggingFrom_1lr58_13) > ._ArrayField-addButton_1lr58_18:active {
345
+ background: var(--puck-color-azure-11);
346
+ color: var(--puck-color-azure-04);
347
+ transition: none;
343
348
  }
344
- ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):hover > ._DraggableComponent-overlay_59z7f_29 {
345
- outline: 2px var(--puck-color-azure-09) solid !important;
349
+ ._ArrayFieldItem_1lr58_63 {
350
+ border-top-left-radius: 3px;
351
+ border-top-right-radius: 3px;
352
+ display: block;
353
+ position: relative;
346
354
  }
347
- ._DraggableComponent--indicativeHover_59z7f_81 > ._DraggableComponent-overlay_59z7f_29 {
348
- pointer-events: none;
355
+ ._ArrayFieldItem_1lr58_63:not(._ArrayFieldItem--isDragging_1lr58_71):not(:first-of-type)::before {
356
+ background-color: var(--puck-color-grey-09);
357
+ position: absolute;
358
+ width: 100%;
359
+ height: 1px;
360
+ content: "";
361
+ z-index: 1;
362
+ top: -1px;
349
363
  }
350
- ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):has(._DraggableComponent_59z7f_1:hover > ._DraggableComponent-overlay_59z7f_29) > ._DraggableComponent-overlay_59z7f_29 {
364
+ ._ArrayFieldItem--isExpanded_1lr58_81::before {
351
365
  display: none;
352
366
  }
353
- ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-overlay_59z7f_29 {
354
- outline: 2px var(--puck-color-azure-07) solid !important;
355
- }
356
- ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 {
357
- display: block;
358
- position: sticky;
367
+ ._ArrayFieldItem--isExpanded_1lr58_81 {
368
+ border-bottom: 0;
369
+ outline-offset: 0px !important;
370
+ outline: 1px solid var(--puck-color-azure-07) !important;
359
371
  z-index: 2;
360
372
  }
361
- ._DraggableComponent-actions_59z7f_97 {
362
- position: absolute;
363
- width: auto;
364
- padding: 4px;
365
- border-top-left-radius: 8px;
366
- border-top-right-radius: 8px;
367
- border-radius: 8px;
368
- background: var(--puck-color-grey-01);
369
- color: var(--puck-color-white);
370
- cursor: grab;
371
- display: none;
372
- font-family: var(--puck-font-family);
373
- gap: 4px;
374
- pointer-events: auto;
375
- box-sizing: border-box;
376
- transform-origin: right top;
373
+ ._ArrayFieldItem--isDragging_1lr58_71 {
374
+ box-shadow: color-mix(in srgb, var(--puck-color-grey-06) 25%, transparent) 0 3px 6px 0;
377
375
  }
378
- ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 > ._DraggableComponent-actions_59z7f_97 {
379
- display: flex;
376
+ ._ArrayFieldItem--isDragging_1lr58_71 ._ArrayFieldItem-summary_1lr58_97:active {
377
+ background-color: var(--puck-color-white);
380
378
  }
381
- ._DraggableComponent-actionsLabel_59z7f_127 {
382
- color: var(--puck-color-grey-08);
383
- display: flex;
384
- font-size: var(--puck-font-size-xxxs);
385
- font-weight: 500;
386
- justify-content: center;
387
- align-items: center;
388
- padding-left: 8px;
389
- padding-right: 16px;
390
- margin-right: 8px;
391
- border-right: 0.5px solid var(--puck-color-grey-05);
392
- text-overflow: ellipsis;
393
- white-space: nowrap;
379
+ ._ArrayFieldItem_1lr58_63 + ._ArrayFieldItem_1lr58_63 {
380
+ border-top-left-radius: 0;
381
+ border-top-right-radius: 0;
394
382
  }
395
- ._DraggableComponent-action_59z7f_97 {
396
- background: transparent;
397
- border: none;
398
- color: var(--puck-color-grey-08);
383
+ ._ArrayFieldItem-summary_1lr58_97 {
384
+ background: var(--puck-color-white);
385
+ color: var(--puck-color-grey-04);
399
386
  cursor: pointer;
400
- padding: 6px 8px;
401
- border-radius: 4px;
402
- overflow: hidden;
403
387
  display: flex;
404
388
  align-items: center;
405
- justify-content: center;
406
- transition: color 50ms ease-in;
389
+ gap: 2px;
390
+ justify-content: space-between;
391
+ font-size: var(--puck-font-size-xxs);
392
+ list-style: none;
393
+ padding: 12px 15px;
394
+ padding-bottom: 13px;
395
+ position: relative;
396
+ overflow: hidden;
397
+ transition: background-color 50ms ease-in;
407
398
  }
408
- ._DraggableComponent-action_59z7f_97:focus-visible {
399
+ ._ArrayFieldItem_1lr58_63:first-of-type > ._ArrayFieldItem-summary_1lr58_97 {
400
+ border-top-left-radius: 3px;
401
+ border-top-right-radius: 3px;
402
+ }
403
+ ._ArrayField--addDisabled_1lr58_128 > ._ArrayFieldItem_1lr58_63:last-of-type:not(._ArrayFieldItem--isExpanded_1lr58_81) > ._ArrayFieldItem-summary_1lr58_97 {
404
+ border-bottom-left-radius: 3px;
405
+ border-bottom-right-radius: 3px;
406
+ }
407
+ ._ArrayField--addDisabled_1lr58_128 > ._ArrayFieldItem--isExpanded_1lr58_81:last-of-type {
408
+ border-bottom-left-radius: 3px;
409
+ border-bottom-right-radius: 3px;
410
+ }
411
+ ._ArrayFieldItem-summary_1lr58_97:focus-visible {
409
412
  outline: 2px solid var(--puck-color-azure-05);
410
- outline-offset: -2px;
413
+ outline-offset: 2px;
411
414
  }
412
415
  @media (hover: hover) and (pointer: fine) {
413
- ._DraggableComponent-action_59z7f_97:hover {
414
- color: var(--puck-color-azure-06);
416
+ ._ArrayFieldItem-summary_1lr58_97:hover {
417
+ background-color: var(--puck-color-azure-12);
415
418
  transition: none;
416
419
  }
417
420
  }
418
- ._DraggableComponent-action_59z7f_97:active {
419
- color: var(--puck-color-azure-07);
421
+ ._ArrayFieldItem-summary_1lr58_97:active {
422
+ background-color: var(--puck-color-azure-11);
420
423
  transition: none;
421
424
  }
422
-
423
- /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
424
- ._DropZone_djoti_1 {
425
- margin-left: auto;
426
- margin-right: auto;
427
- position: relative;
428
- min-height: 100%;
429
- outline-offset: -2px;
430
- width: 100%;
431
- }
432
- ._DropZone-content_djoti_10 {
433
- min-height: 128px;
434
- height: 100%;
435
- }
436
- ._DropZone--userIsDragging_djoti_15 ._DropZone-content_djoti_10 {
437
- pointer-events: all;
438
- }
439
- ._DropZone--userIsDragging_djoti_15:not(._DropZone--draggingOverArea_djoti_19):not(._DropZone--draggingNewComponent_djoti_20) > ._DropZone-content_djoti_10 {
440
- pointer-events: none;
425
+ ._ArrayFieldItem--isExpanded_1lr58_81 > ._ArrayFieldItem-summary_1lr58_97 {
426
+ background: var(--puck-color-azure-11);
427
+ color: var(--puck-color-azure-04);
428
+ font-weight: 600;
429
+ transition: none;
441
430
  }
442
- ._DropZone--isAreaSelected_djoti_26,
443
- ._DropZone--draggingOverArea_djoti_19:not(:has(._DropZone--hoveringOverArea_djoti_27)),
444
- ._DropZone--hoveringOverArea_djoti_27:not(._DropZone--isDisabled_djoti_28):not(._DropZone--isRootZone_djoti_29):not(._DropZone--hasChildren_djoti_30) {
445
- background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
446
- outline: 2px dashed var(--puck-color-azure-08);
431
+ ._ArrayFieldItem-body_1lr58_164 {
432
+ background: var(--puck-color-white);
433
+ display: none;
447
434
  }
448
- ._DropZone_djoti_1:not(._DropZone--hasChildren_djoti_30) {
449
- background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
450
- outline: 2px dashed var(--puck-color-azure-08);
435
+ ._ArrayFieldItem--isExpanded_1lr58_81 > ._ArrayFieldItem-body_1lr58_164 {
436
+ display: block;
451
437
  }
452
- ._DropZone--isDestination_djoti_40 {
453
- outline: 2px dashed var(--puck-color-azure-04) !important;
438
+ ._ArrayFieldItem-fieldset_1lr58_173 {
439
+ border: none;
440
+ border-top: 1px solid var(--puck-color-grey-09);
441
+ margin: 0;
442
+ padding: 16px 15px;
454
443
  }
455
- ._DropZone--isDestination_djoti_40:not(._DropZone--isRootZone_djoti_29) {
456
- background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent) !important;
444
+ ._ArrayFieldItem-rhs_1lr58_180 {
445
+ display: flex;
446
+ gap: 4px;
447
+ align-items: center;
457
448
  }
458
- ._DropZone-item_djoti_52 {
459
- position: relative;
449
+ ._ArrayFieldItem-actions_1lr58_186 {
450
+ color: var(--puck-color-grey-04);
451
+ display: flex;
452
+ gap: 4px;
453
+ opacity: 0;
460
454
  }
461
- ._DropZone-hitbox_djoti_56 {
462
- position: absolute;
463
- bottom: -12px;
464
- height: 24px;
465
- width: 100%;
466
- z-index: 1;
455
+ ._ArrayFieldItem-summary_1lr58_97:focus-within > ._ArrayFieldItem-rhs_1lr58_180 > ._ArrayFieldItem-actions_1lr58_186,
456
+ ._ArrayFieldItem-summary_1lr58_97:hover > ._ArrayFieldItem-rhs_1lr58_180 > ._ArrayFieldItem-actions_1lr58_186 {
457
+ opacity: 1;
467
458
  }
468
459
 
469
460
  /* css-module:/home/runner/work/puck/puck/packages/core/components/IconButton/IconButton.module.css/#css-module-data */
@@ -508,965 +499,978 @@
508
499
  color: var(--puck-color-grey-07);
509
500
  }
510
501
 
511
- /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
512
- ._SidebarSection_125qe_1 {
502
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/DragIcon/styles.module.css/#css-module-data */
503
+ ._DragIcon_1p5wn_1 {
504
+ color: var(--puck-color-grey-05);
505
+ cursor: grab;
506
+ padding: 4px;
507
+ border-radius: 4px;
508
+ }
509
+ @media (hover: hover) and (pointer: fine) {
510
+ ._DragIcon_1p5wn_1:hover {
511
+ color: var(--puck-color-azure-05);
512
+ background-color: var(--puck-color-azure-12);
513
+ }
514
+ }
515
+
516
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css/#css-module-data */
517
+ ._ExternalInput-actions_19obq_1 {
513
518
  display: flex;
514
- position: relative;
515
- flex-direction: column;
516
- color: var(--puck-color-black);
517
519
  }
518
- ._SidebarSection_125qe_1:last-of-type {
520
+ ._ExternalInput-button_19obq_5 {
521
+ display: flex;
522
+ gap: 8px;
523
+ align-items: center;
524
+ justify-content: center;
525
+ background-color: var(--puck-color-white);
526
+ border: 1px solid var(--puck-color-grey-09);
527
+ border-radius: 4px;
528
+ color: var(--puck-color-azure-04);
529
+ cursor: pointer;
530
+ padding: 12px 16px;
531
+ font-weight: 500;
532
+ white-space: nowrap;
533
+ text-overflow: ellipsis;
534
+ transition: background-color 50ms ease-in;
535
+ position: relative;
536
+ overflow: hidden;
519
537
  flex-grow: 1;
520
538
  }
521
- ._SidebarSection-title_125qe_12 {
522
- background: var(--puck-color-white);
523
- padding: 16px;
524
- border-bottom: 1px solid var(--puck-color-grey-09);
525
- border-top: 1px solid var(--puck-color-grey-09);
526
- overflow-x: auto;
527
- }
528
- ._SidebarSection--noBorderTop_125qe_20 > ._SidebarSection-title_125qe_12 {
529
- border-top: 0px;
530
- }
531
- ._SidebarSection-content_125qe_24 {
532
- padding: 16px;
533
- }
534
- ._SidebarSection--noPadding_125qe_28 > ._SidebarSection-content_125qe_24 {
535
- padding: 0px;
536
- }
537
- ._SidebarSection--noPadding_125qe_28 > ._SidebarSection-content_125qe_24:last-child {
538
- padding-bottom: 4px;
539
- }
540
- ._SidebarSection_125qe_1:last-of-type ._SidebarSection-content_125qe_24 {
541
- border-bottom: none;
542
- flex-grow: 1;
539
+ ._ExternalInput--dataSelected_19obq_25 ._ExternalInput-button_19obq_5 {
540
+ color: var(--puck-color-grey-03);
541
+ display: block;
542
+ border-top-right-radius: 0px;
543
+ border-bottom-right-radius: 0px;
543
544
  }
544
- ._SidebarSection-breadcrumbLabel_125qe_41 {
545
- background: none;
546
- border: 0;
547
- border-radius: 2px;
548
- color: var(--puck-color-azure-04);
545
+ ._ExternalInput-detachButton_19obq_32 {
546
+ border: 1px solid var(--puck-color-grey-09);
547
+ border-top-right-radius: 4px;
548
+ border-bottom-right-radius: 4px;
549
+ background-color: var(--puck-color-grey-12);
550
+ color: var(--puck-color-grey-05);
549
551
  cursor: pointer;
550
- font: inherit;
551
- flex-shrink: 0;
552
- padding: 0;
553
- transition: color 50ms ease-in;
552
+ display: flex;
553
+ gap: 8px;
554
+ align-items: center;
555
+ justify-content: center;
556
+ padding: 8px 12px;
557
+ position: relative;
558
+ transition: background-color 50ms ease-in, color 50ms ease-in;
559
+ margin-left: -1px;
554
560
  }
555
- ._SidebarSection-breadcrumbLabel_125qe_41:focus-visible {
561
+ ._ExternalInput-button_19obq_5:focus-visible,
562
+ ._ExternalInput-detachButton_19obq_32:focus-visible {
556
563
  outline: 2px solid var(--puck-color-azure-05);
557
564
  outline-offset: 2px;
565
+ z-index: 1;
558
566
  }
559
567
  @media (hover: hover) and (pointer: fine) {
560
- ._SidebarSection-breadcrumbLabel_125qe_41:hover {
561
- color: var(--puck-color-azure-03);
568
+ ._ExternalInput-button_19obq_5:hover,
569
+ ._ExternalInput-detachButton_19obq_32:hover {
570
+ background: var(--puck-color-azure-12);
562
571
  transition: none;
563
572
  }
573
+ ._ExternalInput-detachButton_19obq_32:hover {
574
+ color: var(--puck-color-azure-04);
575
+ }
564
576
  }
565
- ._SidebarSection-breadcrumbLabel_125qe_41:active {
566
- color: var(--puck-color-azure-02);
577
+ ._ExternalInput-button_19obq_5:active,
578
+ ._ExternalInput-detachButton_19obq_32:active {
579
+ background: var(--puck-color-azure-11);
567
580
  transition: none;
568
581
  }
569
- ._SidebarSection-breadcrumbs_125qe_70 {
570
- align-items: center;
571
- display: flex;
572
- gap: 4px;
582
+ ._ExternalInputModal_19obq_74 {
583
+ color: var(--puck-color-black);
584
+ display: grid;
585
+ grid-template-rows: min-content minmax(128px, 100%) min-content;
586
+ grid-template-columns: 100%;
587
+ position: relative;
588
+ min-height: 50dvh;
589
+ max-height: 90dvh;
573
590
  }
574
- ._SidebarSection-breadcrumb_125qe_41 {
575
- align-items: center;
591
+ ._ExternalInputModal-grid_19obq_84 {
576
592
  display: flex;
577
- gap: 4px;
593
+ flex-direction: column;
578
594
  }
579
- ._SidebarSection-heading_125qe_82 {
580
- padding-right: 16px;
595
+ @media (min-width: 458px) {
596
+ ._ExternalInputModal-grid_19obq_84 {
597
+ display: grid;
598
+ grid-template-columns: 100%;
599
+ }
600
+ ._ExternalInputModal--filtersToggled_19obq_95 ._ExternalInputModal-grid_19obq_84 {
601
+ grid-template-columns: 25% 75%;
602
+ }
581
603
  }
582
- ._SidebarSection-loadingOverlay_125qe_86 {
583
- background: var(--puck-color-white);
604
+ ._ExternalInputModal-filters_19obq_100 {
605
+ border-bottom: 1px solid var(--puck-color-grey-09);
606
+ }
607
+ ._ExternalInputModal--filtersToggled_19obq_95 ._ExternalInputModal-filters_19obq_100 {
608
+ display: none;
609
+ }
610
+ @media (min-width: 458px) {
611
+ ._ExternalInputModal-filters_19obq_100 {
612
+ border-right: 1px solid var(--puck-color-grey-09);
613
+ display: none;
614
+ }
615
+ ._ExternalInputModal--filtersToggled_19obq_95 ._ExternalInputModal-filters_19obq_100 {
616
+ display: block;
617
+ }
618
+ }
619
+ ._ExternalInputModal-masthead_19obq_119 {
620
+ background-color: var(--puck-color-grey-12);
621
+ border-bottom: 1px solid var(--puck-color-grey-09);
584
622
  display: flex;
585
- justify-content: center;
586
- align-items: center;
587
- height: 100%;
588
- width: 100%;
589
- top: 0;
590
- position: absolute;
591
- z-index: 1;
592
- pointer-events: all;
593
- box-sizing: border-box;
594
- opacity: 0.8;
623
+ flex-wrap: wrap;
624
+ gap: 24px;
625
+ padding: 24px;
595
626
  }
596
-
597
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css/#css-module-data */
598
- ._Heading_qxrry_1 {
599
- display: block;
600
- color: var(--puck-color-black);
601
- font-weight: 700;
602
- margin: 0;
627
+ ._ExternalInputModal-tableWrapper_19obq_128 {
628
+ position: relative;
629
+ overflow-x: auto;
630
+ overflow-y: auto;
631
+ flex-grow: 1;
603
632
  }
604
- ._Heading_qxrry_1 b {
605
- font-weight: 700;
633
+ ._ExternalInputModal-table_19obq_128 {
634
+ border-collapse: unset;
635
+ border-spacing: 0px;
636
+ color: var(--puck-color-grey-02);
637
+ position: relative;
638
+ z-index: 0;
639
+ min-width: 100%;
606
640
  }
607
- ._Heading--xxxxl_qxrry_12 {
608
- font-size: var(--puck-font-size-xxxxl);
609
- letter-spacing: 0.08ch;
610
- font-weight: 800;
641
+ ._ExternalInputModal-thead_19obq_144 {
642
+ background-color: var(--puck-color-white);
643
+ position: sticky;
644
+ top: 0;
645
+ z-index: 1;
611
646
  }
612
- ._Heading--xxxl_qxrry_18 {
613
- font-size: var(--puck-font-size-xxxl);
647
+ ._ExternalInputModal-th_19obq_144 {
648
+ border-bottom: 1px solid var(--puck-color-grey-09);
649
+ color: var(--puck-color-grey-04);
650
+ font-weight: 500;
651
+ font-size: 14px;
652
+ padding: 16px 24px;
614
653
  }
615
- ._Heading--xxl_qxrry_22 {
616
- font-size: var(--puck-font-size-xxl);
654
+ ._ExternalInputModal-td_19obq_159 {
655
+ border-bottom: 1px solid var(--puck-color-grey-10);
656
+ padding: 16px 24px;
617
657
  }
618
- ._Heading--xl_qxrry_26 {
619
- font-size: var(--puck-font-size-xl);
658
+ ._ExternalInputModal-tr_19obq_164 ._ExternalInputModal-td_19obq_159:first-of-type {
659
+ font-weight: 500;
660
+ width: 1%;
661
+ white-space: nowrap;
620
662
  }
621
- ._Heading--l_qxrry_30 {
622
- font-size: var(--puck-font-size-l);
663
+ @media (hover: hover) and (pointer: fine) {
664
+ ._ExternalInputModal-tbody_19obq_171 ._ExternalInputModal-tr_19obq_164:hover {
665
+ background: var(--puck-color-azure-12);
666
+ color: var(--puck-color-azure-04);
667
+ cursor: pointer;
668
+ position: relative;
669
+ margin-left: -5px;
670
+ }
671
+ ._ExternalInputModal-tbody_19obq_171 ._ExternalInputModal-tr_19obq_164:hover ._ExternalInputModal-td_19obq_159:first-of-type {
672
+ border-left: 4px solid var(--puck-color-azure-04);
673
+ padding-left: 20px;
674
+ }
623
675
  }
624
- ._Heading--m_qxrry_34 {
625
- font-size: var(--puck-font-size-m);
676
+ ._ExternalInputModal-tbody_19obq_171 ._ExternalInputModal-tr_19obq_164:last-of-type ._ExternalInputModal-td_19obq_159 {
677
+ border-bottom: none;
626
678
  }
627
- ._Heading--s_qxrry_38 {
628
- font-size: var(--puck-font-size-s);
679
+ ._ExternalInputModal-tableWrapper_19obq_128 {
680
+ display: none;
629
681
  }
630
- ._Heading--xs_qxrry_42 {
631
- font-size: var(--puck-font-size-xs);
682
+ ._ExternalInputModal--hasData_19obq_197 ._ExternalInputModal-tableWrapper_19obq_128 {
683
+ display: block;
632
684
  }
633
-
634
- /* css-module:/home/runner/work/puck/puck/packages/core/components/MenuBar/styles.module.css/#css-module-data */
635
- ._MenuBar_8pf8c_1 {
636
- background-color: var(--puck-color-white);
637
- border-bottom: 1px solid var(--puck-color-grey-09);
685
+ ._ExternalInputModal-loadingBanner_19obq_201 {
638
686
  display: none;
639
- left: 0;
640
- margin-top: 1px;
641
- padding: 8px 16px;
687
+ background-color: color-mix(in srgb, var(--puck-color-white) 90%, transparent);
688
+ padding: 64px;
689
+ align-items: center;
690
+ justify-content: center;
642
691
  position: absolute;
692
+ top: 0;
693
+ left: 0;
643
694
  right: 0;
644
- top: 100%;
645
- z-index: 2;
646
- }
647
- ._MenuBar--menuOpen_8pf8c_14 {
648
- display: block;
695
+ bottom: 0;
649
696
  }
650
- @media (min-width: 638px) {
651
- ._MenuBar_8pf8c_1 {
652
- border: none;
653
- display: block;
654
- margin-top: 0;
655
- overflow-y: visible;
656
- padding: 0;
657
- position: static;
658
- }
697
+ ._ExternalInputModal--isLoading_19obq_218 ._ExternalInputModal-loadingBanner_19obq_201 {
698
+ display: flex;
659
699
  }
660
- ._MenuBar-inner_8pf8c_29 {
661
- align-items: center;
700
+ ._ExternalInputModal-searchForm_19obq_222 {
662
701
  display: flex;
663
702
  flex-wrap: wrap;
664
- gap: 8px 16px;
665
- justify-content: flex-end;
703
+ gap: 12px;
704
+ flex-grow: 1;
666
705
  }
667
- @media (min-width: 638px) {
668
- ._MenuBar-inner_8pf8c_29 {
669
- display: flex;
670
- flex-direction: row;
706
+ @media (min-width: 458px) {
707
+ ._ExternalInputModal-searchForm_19obq_222 {
671
708
  flex-wrap: nowrap;
672
709
  }
673
710
  }
674
- ._MenuBar-history_8pf8c_45 {
711
+ ._ExternalInputModal-search_19obq_222 {
675
712
  display: flex;
713
+ background: var(--puck-color-white);
714
+ border-width: 1px;
715
+ border-style: solid;
716
+ border-color: var(--puck-color-grey-09);
717
+ border-radius: 4px;
718
+ flex-grow: 1;
719
+ transition: border-color 50ms ease-in;
676
720
  }
677
-
678
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css/#css-module-data */
679
- ._Puck_mowzv_19 {
680
- --puck-space-px: 16px;
681
- bottom: 0;
682
- font-family: var(--puck-font-family);
683
- left: 0;
684
- position: fixed;
685
- right: 0;
686
- top: 0;
687
- }
688
- ._Puck-layout_mowzv_29 {
689
- --puck-frame-width: auto;
690
- --puck-side-bar-width: 0px;
691
- display: grid;
692
- grid-template-areas: "header header header" "left editor right";
693
- grid-template-columns: 0 var(--puck-frame-width) 0;
694
- grid-template-rows: min-content auto;
695
- height: 100dvh;
696
- position: relative;
697
- z-index: 0;
698
- }
699
- ._Puck--mounted_mowzv_41 ._Puck-layout_mowzv_29 {
700
- --puck-side-bar-width: 186px;
701
- }
702
- ._Puck--leftSideBarVisible_mowzv_45 ._Puck-layout_mowzv_29 {
703
- grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) 0;
704
- }
705
- ._Puck--rightSideBarVisible_mowzv_51 ._Puck-layout_mowzv_29 {
706
- grid-template-columns: 0 var(--puck-frame-width) var(--puck-side-bar-width);
707
- }
708
- ._Puck--leftSideBarVisible_mowzv_45._Puck--rightSideBarVisible_mowzv_51 ._Puck-layout_mowzv_29 {
709
- grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) var(--puck-side-bar-width);
710
- }
711
- @media (min-width: 458px) {
712
- ._Puck-mounted_mowzv_64 ._Puck-layout_mowzv_29 {
713
- --puck-frame-width: minmax(266px, auto);
714
- }
715
- }
716
- @media (min-width: 638px) {
717
- ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
718
- --puck-side-bar-width: minmax(186px, 250px);
719
- }
721
+ ._ExternalInputModal-search_19obq_222:focus-within {
722
+ border-color: var(--puck-color-grey-05);
723
+ outline: 2px solid var(--puck-color-azure-05);
724
+ transition: none;
720
725
  }
721
- @media (min-width: 766px) {
722
- ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
723
- --puck-frame-width: auto;
726
+ @media (hover: hover) and (pointer: fine) {
727
+ ._ExternalInputModal-search_19obq_222:hover {
728
+ border-color: var(--puck-color-grey-05);
729
+ transition: none;
724
730
  }
725
731
  }
726
- @media (min-width: 990px) {
727
- ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
728
- --puck-side-bar-width: 256px;
729
- }
732
+ ._ExternalInputModal-searchIcon_19obq_259 {
733
+ align-items: center;
734
+ background: var(--puck-color-grey-12);
735
+ border-bottom-left-radius: 4px;
736
+ border-top-left-radius: 4px;
737
+ border-right: 1px solid var(--puck-color-grey-09);
738
+ color: var(--puck-color-grey-07);
739
+ display: flex;
740
+ justify-content: center;
741
+ padding: 12px 15px;
742
+ transition: color 50ms ease-in;
730
743
  }
731
- @media (min-width: 1198px) {
732
- ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
733
- --puck-side-bar-width: 274px;
734
- }
744
+ ._ExternalInputModal-search_19obq_222:focus-within ._ExternalInputModal-searchIcon_19obq_259 {
745
+ color: var(--puck-color-grey-04);
746
+ transition: none;
735
747
  }
736
- @media (min-width: 1398px) {
737
- ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
738
- --puck-side-bar-width: 290px;
748
+ @media (hover: hover) and (pointer: fine) {
749
+ ._ExternalInputModal-search_19obq_222:hover ._ExternalInputModal-searchIcon_19obq_259 {
750
+ color: var(--puck-color-grey-04);
751
+ transition: none;
739
752
  }
740
753
  }
741
- @media (min-width: 1598px) {
742
- ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
743
- --puck-side-bar-width: 320px;
744
- }
754
+ ._ExternalInputModal-searchIconText_19obq_284 {
755
+ clip: rect(0 0 0 0);
756
+ clip-path: inset(100%);
757
+ height: 1px;
758
+ overflow: hidden;
759
+ position: absolute;
760
+ white-space: nowrap;
761
+ width: 1px;
745
762
  }
746
- ._Puck-header_mowzv_105 {
763
+ ._ExternalInputModal-searchInput_19obq_294 {
764
+ border: none;
765
+ border-radius: 4px;
747
766
  background: var(--puck-color-white);
748
- border-bottom: 1px solid var(--puck-color-grey-09);
749
- color: var(--puck-color-black);
750
- grid-area: header;
751
- position: relative;
752
- max-width: 100vw;
767
+ font-family: inherit;
768
+ font-size: 14px;
769
+ padding: 12px 15px;
770
+ width: 100%;
753
771
  }
754
- ._Puck-headerInner_mowzv_114 {
755
- align-items: end;
756
- display: grid;
757
- gap: var(--puck-space-px);
758
- grid-template-areas: "left middle right";
759
- grid-template-columns: 1fr auto 1fr;
760
- grid-template-rows: auto;
761
- padding: var(--puck-space-px);
772
+ ._ExternalInputModal-searchInput_19obq_294:focus {
773
+ outline: 0;
762
774
  }
763
- ._Puck-headerToggle_mowzv_124 {
764
- color: var(--puck-color-grey-05);
775
+ ._ExternalInputModal-searchActions_19obq_308 {
765
776
  display: flex;
766
- margin-left: -4px;
767
- padding-top: 2px;
777
+ gap: 8px;
778
+ height: 44px;
779
+ width: 100%;
768
780
  }
769
- ._Puck--rightSideBarVisible_mowzv_51 ._Puck-rightSideBarToggle_mowzv_131,
770
- ._Puck--leftSideBarVisible_mowzv_45 ._Puck-leftSideBarToggle_mowzv_132 {
771
- color: var(--puck-color-black);
781
+ @media (min-width: 458px) {
782
+ ._ExternalInputModal-searchActions_19obq_308 {
783
+ width: auto;
784
+ }
772
785
  }
773
- ._Puck-headerTitle_mowzv_136 {
786
+ ._ExternalInputModal-searchActionIcon_19obq_321 {
774
787
  align-self: center;
775
788
  }
776
- ._Puck-headerPath_mowzv_140 {
777
- font-family: var(--puck-font-family-monospaced);
778
- font-size: var(--puck-font-size-xxs);
779
- font-weight: normal;
780
- word-break: break-all;
781
- }
782
- ._Puck-headerTools_mowzv_147 {
783
- display: flex;
784
- gap: 16px;
785
- justify-content: flex-end;
786
- }
787
- ._Puck-menuButton_mowzv_153 {
788
- color: var(--puck-color-grey-05);
789
- margin-left: -4px;
790
- }
791
- ._Puck--menuOpen_mowzv_158 ._Puck-menuButton_mowzv_153 {
792
- color: var(--puck-color-black);
789
+ ._ExternalInputModal-footer_19obq_325 {
790
+ background-color: var(--puck-color-grey-12);
791
+ border-top: 1px solid var(--puck-color-grey-09);
792
+ color: var(--puck-color-grey-04);
793
+ font-weight: 500;
794
+ font-size: 14px;
795
+ padding: 16px;
796
+ text-align: right;
793
797
  }
794
- @media (min-width: 638px) {
795
- ._Puck-menuButton_mowzv_153 {
796
- display: none;
797
- }
798
+
799
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Modal/styles.module.css/#css-module-data */
800
+ ._Modal_ikbaj_1 {
801
+ background: color-mix(in srgb, var(--puck-color-black) 75%, transparent);
802
+ display: none;
803
+ justify-content: center;
804
+ align-items: center;
805
+ position: fixed;
806
+ top: 0;
807
+ left: 0;
808
+ bottom: 0;
809
+ right: 0;
810
+ z-index: 1;
811
+ padding: 32px;
798
812
  }
799
- ._Puck-leftSideBar_mowzv_132 {
800
- background: var(--puck-color-grey-12);
801
- border-right: 1px solid var(--puck-color-grey-09);
813
+ ._Modal--isOpen_ikbaj_15 {
802
814
  display: flex;
803
- flex-direction: column;
804
- grid-area: left;
805
- overflow-y: auto;
806
815
  }
807
- ._Puck-rightSideBar_mowzv_131 {
816
+ ._Modal-inner_ikbaj_19 {
817
+ width: 100%;
818
+ max-width: 1024px;
819
+ border-radius: 8px;
820
+ overflow: hidden;
808
821
  background: var(--puck-color-white);
809
- border-left: 1px solid var(--puck-color-grey-09);
810
822
  display: flex;
811
823
  flex-direction: column;
812
- grid-area: right;
813
- overflow-y: auto;
814
- }
815
- ._Puck-portal_mowzv_186 {
816
- z-index: 2;
824
+ max-height: 90dvh;
817
825
  }
818
826
 
819
- /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/styles.module.css/#css-module-data */
820
- ._Input_1qi5b_1 {
821
- color: var(--puck-color-grey-04);
822
- padding: 16px;
823
- padding-bottom: 12px;
827
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css/#css-module-data */
828
+ ._Heading_qxrry_1 {
824
829
  display: block;
830
+ color: var(--puck-color-black);
831
+ font-weight: 700;
832
+ margin: 0;
825
833
  }
826
- ._Input_1qi5b_1 ._Input_1qi5b_1 {
827
- padding: 0px;
834
+ ._Heading_qxrry_1 b {
835
+ font-weight: 700;
828
836
  }
829
- ._Input_1qi5b_1 * {
830
- box-sizing: border-box;
837
+ ._Heading--xxxxl_qxrry_12 {
838
+ font-size: var(--puck-font-size-xxxxl);
839
+ letter-spacing: 0.08ch;
840
+ font-weight: 800;
831
841
  }
832
- ._Input_1qi5b_1 + ._Input_1qi5b_1 {
833
- border-top: 1px solid var(--puck-color-grey-09);
834
- margin-top: 8px;
842
+ ._Heading--xxxl_qxrry_18 {
843
+ font-size: var(--puck-font-size-xxxl);
835
844
  }
836
- ._Input_1qi5b_1 ._Input_1qi5b_1 + ._Input_1qi5b_1 {
837
- border-top: 0px;
838
- margin-top: 12px;
845
+ ._Heading--xxl_qxrry_22 {
846
+ font-size: var(--puck-font-size-xxl);
839
847
  }
840
- ._Input-label_1qi5b_26 {
841
- align-items: center;
842
- display: flex;
843
- padding-bottom: 12px;
844
- font-size: var(--puck-font-size-xxs);
845
- font-weight: 600;
848
+ ._Heading--xl_qxrry_26 {
849
+ font-size: var(--puck-font-size-xl);
846
850
  }
847
- ._Input-labelIcon_1qi5b_34 {
848
- color: var(--puck-color-grey-07);
849
- display: flex;
850
- margin-right: 4px;
851
- padding-left: 4px;
851
+ ._Heading--l_qxrry_30 {
852
+ font-size: var(--puck-font-size-l);
852
853
  }
853
- ._Input-disabledIcon_1qi5b_41 {
854
- color: var(--puck-color-grey-05);
855
- margin-left: auto;
854
+ ._Heading--m_qxrry_34 {
855
+ font-size: var(--puck-font-size-m);
856
856
  }
857
- ._Input-input_1qi5b_46 {
858
- background: var(--puck-color-white);
859
- border-width: 1px;
860
- border-style: solid;
861
- border-color: var(--puck-color-grey-09);
862
- border-radius: 4px;
863
- font-family: inherit;
864
- font-size: 14px;
865
- padding: 12px 15px;
866
- transition: border-color 50ms ease-in;
867
- width: 100%;
857
+ ._Heading--s_qxrry_38 {
858
+ font-size: var(--puck-font-size-s);
859
+ }
860
+ ._Heading--xs_qxrry_42 {
861
+ font-size: var(--puck-font-size-xs);
868
862
  }
869
- select._Input-input_1qi5b_46 {
863
+
864
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Button/Button.module.css/#css-module-data */
865
+ ._Button_1t64k_1 {
870
866
  appearance: none;
871
- background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23c3c3c3'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat;
872
- background-size: 12px;
873
- background-position: calc(100% - 12px) calc(50% + 3px);
874
- background-repeat: no-repeat;
875
- background-color: var(--puck-color-white);
867
+ background: none;
868
+ border: 1px solid transparent;
869
+ border-radius: 4px;
870
+ color: var(--puck-color-white);
871
+ display: inline-flex;
872
+ align-items: center;
873
+ gap: 8px;
874
+ letter-spacing: 0.05ch;
875
+ font-family: var(--puck-font-family);
876
+ font-size: 14px;
877
+ font-weight: 400;
878
+ box-sizing: border-box;
879
+ line-height: 1;
880
+ text-align: center;
881
+ text-decoration: none;
882
+ transition: background-color 50ms ease-in;
876
883
  cursor: pointer;
884
+ white-space: nowrap;
885
+ margin: 0;
877
886
  }
878
- @media (hover: hover) and (pointer: fine) {
879
- ._Input_1qi5b_1:has(> input):hover ._Input-input_1qi5b_46:not([readonly]),
880
- ._Input_1qi5b_1:has(> textarea):hover ._Input-input_1qi5b_46:not([readonly]) {
881
- border-color: var(--puck-color-grey-05);
882
- transition: none;
883
- }
884
- ._Input_1qi5b_1:has(> select):hover ._Input-input_1qi5b_46:not([disabled]) {
885
- background-color: var(--puck-color-azure-12);
886
- background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%235a5a5a'><polygon points='0,0 100,0 50,50'/></svg>");
887
- border-color: var(--puck-color-grey-05);
888
- transition: none;
889
- }
890
- }
891
- ._Input-input_1qi5b_46:focus {
892
- border-color: var(--puck-color-grey-05);
893
- outline: 2px solid var(--puck-color-azure-05);
894
- transition: none;
895
- }
896
- ._Input--readOnly_1qi5b_90 > ._Input-input_1qi5b_46,
897
- ._Input--readOnly_1qi5b_90 > select._Input-input_1qi5b_46 {
898
- background-color: var(--puck-color-grey-11);
899
- border-color: var(--puck-color-grey-09);
900
- color: var(--puck-color-grey-04);
901
- cursor: default;
902
- opacity: 1;
903
- outline: 0;
887
+ ._Button_1t64k_1:hover,
888
+ ._Button_1t64k_1:active {
904
889
  transition: none;
905
890
  }
906
- ._Input-radioGroupItems_1qi5b_101 {
907
- display: flex;
908
- border: 1px solid var(--puck-color-grey-09);
909
- border-radius: 4px;
910
- flex-wrap: wrap;
891
+ ._Button--medium_1t64k_29 {
892
+ min-height: 34px;
893
+ padding-bottom: 7px;
894
+ padding-left: 19px;
895
+ padding-right: 19px;
896
+ padding-top: 7px;
911
897
  }
912
- ._Input-radio_1qi5b_101 {
913
- border-right: 1px solid var(--puck-color-grey-09);
914
- flex-grow: 1;
898
+ ._Button--large_1t64k_37 {
899
+ padding-bottom: 11px;
900
+ padding-left: 19px;
901
+ padding-right: 19px;
902
+ padding-top: 11px;
915
903
  }
916
- ._Input-radio_1qi5b_101:first-of-type {
917
- border-bottom-left-radius: 4px;
918
- border-top-left-radius: 4px;
904
+ ._Button-icon_1t64k_44 {
905
+ margin-top: 2px;
919
906
  }
920
- ._Input-radio_1qi5b_101:first-of-type ._Input-radioInner_1qi5b_118 {
921
- border-bottom-left-radius: 3px;
922
- border-top-left-radius: 3px;
907
+ ._Button--primary_1t64k_48 {
908
+ background: var(--puck-color-azure-04);
923
909
  }
924
- ._Input-radio_1qi5b_101:last-of-type {
925
- border-bottom-right-radius: 4px;
926
- border-right: 0;
927
- border-top-right-radius: 4px;
910
+ ._Button_1t64k_1:focus-visible {
911
+ outline: 2px solid var(--puck-color-azure-05);
912
+ outline-offset: 2px;
928
913
  }
929
- ._Input-radio_1qi5b_101:last-of-type ._Input-radioInner_1qi5b_118 {
930
- border-bottom-right-radius: 3px;
931
- border-top-right-radius: 3px;
914
+ @media (hover: hover) and (pointer: fine) {
915
+ ._Button--primary_1t64k_48:hover {
916
+ background-color: var(--puck-color-azure-03);
917
+ }
932
918
  }
933
- ._Input-radioInner_1qi5b_118 {
934
- background-color: var(--puck-color-white);
935
- color: var(--puck-color-grey-04);
936
- cursor: pointer;
937
- font-size: var(--puck-font-size-xxxs);
938
- padding: 8px 12px;
939
- text-align: center;
940
- transition: background-color 50ms ease-in;
919
+ ._Button--primary_1t64k_48:active {
920
+ background-color: var(--puck-color-azure-02);
941
921
  }
942
- ._Input-radio_1qi5b_101:has(:focus-visible) {
943
- outline: 2px solid var(--puck-color-azure-05);
944
- outline-offset: 2px;
945
- position: relative;
922
+ ._Button--secondary_1t64k_67 {
923
+ border: 1px solid currentColor;
924
+ color: currentColor;
946
925
  }
947
926
  @media (hover: hover) and (pointer: fine) {
948
- ._Input-radioInner_1qi5b_118:hover {
927
+ ._Button--secondary_1t64k_67:hover {
949
928
  background-color: var(--puck-color-azure-12);
950
- transition: none;
929
+ color: var(--puck-color-black);
951
930
  }
952
931
  }
953
- ._Input--readOnly_1qi5b_90 ._Input-radioInner_1qi5b_118 {
954
- background-color: var(--puck-color-white);
955
- color: var(--puck-color-grey-04);
956
- cursor: default;
957
- }
958
- ._Input-radio_1qi5b_101 ._Input-radioInput_1qi5b_163:checked ~ ._Input-radioInner_1qi5b_118 {
932
+ ._Button--secondary_1t64k_67:active {
959
933
  background-color: var(--puck-color-azure-11);
960
- color: var(--puck-color-azure-04);
961
- font-weight: 500;
934
+ color: var(--puck-color-black);
962
935
  }
963
- ._Input--readOnly_1qi5b_90 ._Input-radioInput_1qi5b_163:checked ~ ._Input-radioInner_1qi5b_118 {
964
- background-color: var(--puck-color-grey-11);
965
- color: var(--puck-color-grey-04);
936
+ ._Button--flush_1t64k_84 {
937
+ border-radius: 0;
966
938
  }
967
- ._Input-radio_1qi5b_101 ._Input-radioInput_1qi5b_163 {
968
- clip: rect(0 0 0 0);
969
- clip-path: inset(100%);
970
- height: 1px;
971
- overflow: hidden;
972
- position: absolute;
973
- white-space: nowrap;
974
- width: 1px;
939
+ ._Button--disabled_1t64k_88,
940
+ ._Button--disabled_1t64k_88:hover {
941
+ background-color: var(--puck-color-grey-07);
942
+ color: var(--puck-color-grey-03);
943
+ cursor: not-allowed;
975
944
  }
976
- textarea._Input-input_1qi5b_46 {
977
- margin-bottom: -4px;
945
+ ._Button--fullWidth_1t64k_95 {
946
+ justify-content: center;
947
+ width: 100%;
948
+ }
949
+ ._Button-spinner_1t64k_100 {
950
+ padding-left: 8px;
978
951
  }
979
952
 
980
- /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/fields/ArrayField/styles.module.css/#css-module-data */
981
- ._ArrayField_1lr58_5 {
953
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/AutoField/fields/ObjectField/styles.module.css/#css-module-data */
954
+ ._ObjectField_15j63_5 {
982
955
  display: flex;
983
956
  flex-direction: column;
984
- background-color: var(--puck-color-grey-09);
957
+ background-color: var(--puck-color-white);
985
958
  border: 1px solid var(--puck-color-grey-09);
986
959
  border-radius: 4px;
987
960
  }
988
- ._ArrayField--isDraggingFrom_1lr58_13 {
989
- background-color: var(--puck-color-azure-11);
990
- overflow: hidden;
991
- }
992
- ._ArrayField-addButton_1lr58_18 {
993
- background-color: var(--puck-color-white);
961
+ ._ObjectField-fieldset_15j63_13 {
994
962
  border: none;
995
- border-radius: 3px;
996
- display: flex;
997
- color: var(--puck-color-azure-05);
998
- justify-content: center;
999
- cursor: pointer;
1000
- width: 100%;
1001
963
  margin: 0;
1002
- padding: 14px;
1003
- text-align: left;
1004
- transition: background-color 50ms ease-in;
964
+ padding: 16px 15px;
1005
965
  }
1006
- ._ArrayField--hasItems_1lr58_33 > ._ArrayField-addButton_1lr58_18 {
1007
- border-top: 1px solid var(--puck-color-grey-09);
1008
- border-top-left-radius: 0;
1009
- border-top-right-radius: 0;
966
+
967
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Drawer/styles.module.css/#css-module-data */
968
+ ._Drawer_6zh0b_1 {
969
+ font-family: var(--puck-font-family);
1010
970
  }
1011
- ._ArrayField-addButton_1lr58_18:focus-visible {
971
+ ._DrawerItem-default_6zh0b_5 ._DrawerItem-draggableWrapper_6zh0b_5 {
972
+ padding-bottom: 12px;
973
+ }
974
+ ._DrawerItem_6zh0b_5:last-of-type ._DrawerItem-default_6zh0b_5 ._DrawerItem-draggableWrapper_6zh0b_5 {
975
+ padding-bottom: 0;
976
+ }
977
+ ._DrawerItem-draggable_6zh0b_5 {
978
+ background: var(--puck-color-white);
979
+ padding: 12px;
980
+ display: flex;
981
+ border: 1px var(--puck-color-grey-09) solid;
982
+ border-radius: 4px;
983
+ font-size: var(--puck-font-size-xxs);
984
+ justify-content: space-between;
985
+ align-items: center;
986
+ cursor: grab;
987
+ transition: background-color 50ms ease-in, color 50ms ease-in;
988
+ }
989
+ ._DrawerItem_6zh0b_5:focus-visible {
990
+ outline: 0;
991
+ }
992
+ ._Drawer_6zh0b_1:not(._Drawer--isDraggingFrom_6zh0b_31) ._DrawerItem_6zh0b_5:focus-visible ._DrawerItem-draggable_6zh0b_5 {
993
+ border-radius: 4px;
1012
994
  outline: 2px solid var(--puck-color-azure-05);
1013
995
  outline-offset: 2px;
1014
- position: relative;
1015
996
  }
1016
997
  @media (hover: hover) and (pointer: fine) {
1017
- ._ArrayField_1lr58_5:not(._ArrayField--isDraggingFrom_1lr58_13) > ._ArrayField-addButton_1lr58_18:hover {
1018
- background: var(--puck-color-azure-12);
998
+ ._Drawer_6zh0b_1:not(._Drawer--isDraggingFrom_6zh0b_31) ._DrawerItem-draggable_6zh0b_5:hover {
999
+ background-color: var(--puck-color-azure-12);
1019
1000
  color: var(--puck-color-azure-04);
1020
1001
  transition: none;
1021
1002
  }
1022
1003
  }
1023
- ._ArrayField_1lr58_5:not(._ArrayField--isDraggingFrom_1lr58_13) > ._ArrayField-addButton_1lr58_18:active {
1024
- background: var(--puck-color-azure-11);
1025
- color: var(--puck-color-azure-04);
1026
- transition: none;
1004
+ ._DrawerItem-name_6zh0b_47 {
1005
+ overflow-x: hidden;
1006
+ text-overflow: ellipsis;
1007
+ white-space: nowrap;
1027
1008
  }
1028
- ._ArrayFieldItem_1lr58_63 {
1029
- border-top-left-radius: 3px;
1030
- border-top-right-radius: 3px;
1031
- display: block;
1032
- position: relative;
1009
+
1010
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
1011
+ ._DraggableComponent_59z7f_1 {
1012
+ pointer-events: auto;
1013
+ --overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
1033
1014
  }
1034
- ._ArrayFieldItem_1lr58_63:not(._ArrayFieldItem--isDragging_1lr58_71):not(:first-of-type)::before {
1035
- background-color: var(--puck-color-grey-09);
1036
- position: absolute;
1037
- width: 100%;
1038
- height: 1px;
1039
- content: "";
1040
- z-index: 1;
1041
- top: -1px;
1015
+ ._DraggableComponent--isDragging_59z7f_11 {
1016
+ background: color-mix(in srgb, var(--puck-color-azure-08) 10%, transparent);
1017
+ overflow: hidden;
1042
1018
  }
1043
- ._ArrayFieldItem--isExpanded_1lr58_81::before {
1044
- display: none;
1019
+ ._DraggableComponent-contents_59z7f_16 {
1020
+ position: relative;
1021
+ pointer-events: none;
1022
+ z-index: 0;
1045
1023
  }
1046
- ._ArrayFieldItem--isExpanded_1lr58_81 {
1047
- border-bottom: 0;
1048
- outline-offset: 0px !important;
1049
- outline: 1px solid var(--puck-color-azure-07) !important;
1050
- z-index: 2;
1024
+ ._DraggableComponent-contents_59z7f_16::before,
1025
+ ._DraggableComponent-contents_59z7f_16::after {
1026
+ content: " ";
1027
+ display: table;
1051
1028
  }
1052
- ._ArrayFieldItem--isDragging_1lr58_71 {
1053
- box-shadow: color-mix(in srgb, var(--puck-color-grey-06) 25%, transparent) 0 3px 6px 0;
1029
+ ._DraggableComponent-overlay_59z7f_29 {
1030
+ cursor: pointer;
1031
+ height: 100%;
1032
+ width: 100%;
1033
+ top: 0;
1034
+ outline-offset: -2px;
1035
+ position: absolute;
1036
+ pointer-events: none;
1037
+ box-sizing: border-box;
1038
+ z-index: 1;
1054
1039
  }
1055
- ._ArrayFieldItem--isDragging_1lr58_71 ._ArrayFieldItem-summary_1lr58_97:active {
1056
- background-color: var(--puck-color-white);
1040
+ ._DraggableComponent_59z7f_1:focus-visible > ._DraggableComponent-overlay_59z7f_29 {
1041
+ outline: 1px solid var(--puck-color-azure-05);
1057
1042
  }
1058
- ._ArrayFieldItem_1lr58_63 + ._ArrayFieldItem_1lr58_63 {
1059
- border-top-left-radius: 0;
1060
- border-top-right-radius: 0;
1043
+ ._DraggableComponent--isDragging_59z7f_11 > ._DraggableComponent-overlay_59z7f_29 {
1044
+ outline: 2px var(--puck-color-azure-09) solid !important;
1061
1045
  }
1062
- ._ArrayFieldItem-summary_1lr58_97 {
1046
+ ._DraggableComponent-loadingOverlay_59z7f_49 {
1063
1047
  background: var(--puck-color-white);
1064
- color: var(--puck-color-grey-04);
1065
- cursor: pointer;
1048
+ color: var(--puck-color-grey-03);
1049
+ border-radius: 4px;
1066
1050
  display: flex;
1067
- align-items: center;
1068
- gap: 2px;
1069
- justify-content: space-between;
1070
- font-size: var(--puck-font-size-xxs);
1071
- list-style: none;
1072
- padding: 12px 15px;
1073
- padding-bottom: 13px;
1074
- position: relative;
1075
- overflow: hidden;
1076
- transition: background-color 50ms ease-in;
1077
- }
1078
- ._ArrayFieldItem_1lr58_63:first-of-type > ._ArrayFieldItem-summary_1lr58_97 {
1079
- border-top-left-radius: 3px;
1080
- border-top-right-radius: 3px;
1081
- }
1082
- ._ArrayField--addDisabled_1lr58_128 > ._ArrayFieldItem_1lr58_63:last-of-type:not(._ArrayFieldItem--isExpanded_1lr58_81) > ._ArrayFieldItem-summary_1lr58_97 {
1083
- border-bottom-left-radius: 3px;
1084
- border-bottom-right-radius: 3px;
1085
- }
1086
- ._ArrayField--addDisabled_1lr58_128 > ._ArrayFieldItem--isExpanded_1lr58_81:last-of-type {
1087
- border-bottom-left-radius: 3px;
1088
- border-bottom-right-radius: 3px;
1051
+ padding: 8px;
1052
+ top: 8px;
1053
+ right: 8px;
1054
+ position: absolute;
1055
+ z-index: 1;
1056
+ pointer-events: all;
1057
+ box-sizing: border-box;
1058
+ opacity: 0.8;
1059
+ z-index: 1;
1089
1060
  }
1090
- ._ArrayFieldItem-summary_1lr58_97:focus-visible {
1091
- outline: 2px solid var(--puck-color-azure-05);
1092
- outline-offset: 2px;
1061
+ ._DraggableComponent_59z7f_1:hover:not(._DraggableComponent--isLocked_59z7f_65) > ._DraggableComponent-overlay_59z7f_29 {
1062
+ background: var(--overlay-background);
1063
+ pointer-events: none;
1093
1064
  }
1094
- @media (hover: hover) and (pointer: fine) {
1095
- ._ArrayFieldItem-summary_1lr58_97:hover {
1096
- background-color: var(--puck-color-azure-12);
1097
- transition: none;
1098
- }
1065
+ ._DraggableComponent--forceHover_59z7f_71 > ._DraggableComponent-overlay_59z7f_29 {
1066
+ background: var(--overlay-background);
1067
+ pointer-events: none;
1099
1068
  }
1100
- ._ArrayFieldItem-summary_1lr58_97:active {
1101
- background-color: var(--puck-color-azure-11);
1102
- transition: none;
1069
+ ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):hover > ._DraggableComponent-overlay_59z7f_29 {
1070
+ outline: 2px var(--puck-color-azure-09) solid !important;
1103
1071
  }
1104
- ._ArrayFieldItem--isExpanded_1lr58_81 > ._ArrayFieldItem-summary_1lr58_97 {
1105
- background: var(--puck-color-azure-11);
1106
- color: var(--puck-color-azure-04);
1107
- font-weight: 600;
1108
- transition: none;
1072
+ ._DraggableComponent--indicativeHover_59z7f_81 > ._DraggableComponent-overlay_59z7f_29 {
1073
+ pointer-events: none;
1109
1074
  }
1110
- ._ArrayFieldItem-body_1lr58_164 {
1111
- background: var(--puck-color-white);
1075
+ ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):has(._DraggableComponent_59z7f_1:hover > ._DraggableComponent-overlay_59z7f_29) > ._DraggableComponent-overlay_59z7f_29 {
1112
1076
  display: none;
1113
1077
  }
1114
- ._ArrayFieldItem--isExpanded_1lr58_81 > ._ArrayFieldItem-body_1lr58_164 {
1115
- display: block;
1116
- }
1117
- ._ArrayFieldItem-fieldset_1lr58_173 {
1118
- border: none;
1119
- border-top: 1px solid var(--puck-color-grey-09);
1120
- margin: 0;
1121
- padding: 16px 15px;
1078
+ ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-overlay_59z7f_29 {
1079
+ outline: 2px var(--puck-color-azure-07) solid !important;
1122
1080
  }
1123
- ._ArrayFieldItem-rhs_1lr58_180 {
1124
- display: flex;
1125
- gap: 4px;
1126
- align-items: center;
1081
+ ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 {
1082
+ display: block;
1083
+ position: sticky;
1084
+ z-index: 2;
1127
1085
  }
1128
- ._ArrayFieldItem-actions_1lr58_186 {
1129
- color: var(--puck-color-grey-04);
1130
- display: flex;
1086
+ ._DraggableComponent-actions_59z7f_97 {
1087
+ position: absolute;
1088
+ width: auto;
1089
+ padding: 4px;
1090
+ border-top-left-radius: 8px;
1091
+ border-top-right-radius: 8px;
1092
+ border-radius: 8px;
1093
+ background: var(--puck-color-grey-01);
1094
+ color: var(--puck-color-white);
1095
+ cursor: grab;
1096
+ display: none;
1097
+ font-family: var(--puck-font-family);
1131
1098
  gap: 4px;
1132
- opacity: 0;
1133
- }
1134
- ._ArrayFieldItem-summary_1lr58_97:focus-within > ._ArrayFieldItem-rhs_1lr58_180 > ._ArrayFieldItem-actions_1lr58_186,
1135
- ._ArrayFieldItem-summary_1lr58_97:hover > ._ArrayFieldItem-rhs_1lr58_180 > ._ArrayFieldItem-actions_1lr58_186 {
1136
- opacity: 1;
1137
- }
1138
-
1139
- /* css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css/#css-module-data */
1140
- ._ExternalInput-actions_19obq_1 {
1141
- display: flex;
1099
+ pointer-events: auto;
1100
+ box-sizing: border-box;
1101
+ transform-origin: right top;
1142
1102
  }
1143
- ._ExternalInput-button_19obq_5 {
1103
+ ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 > ._DraggableComponent-actions_59z7f_97 {
1144
1104
  display: flex;
1145
- gap: 8px;
1146
- align-items: center;
1147
- justify-content: center;
1148
- background-color: var(--puck-color-white);
1149
- border: 1px solid var(--puck-color-grey-09);
1150
- border-radius: 4px;
1151
- color: var(--puck-color-azure-04);
1152
- cursor: pointer;
1153
- padding: 12px 16px;
1105
+ }
1106
+ ._DraggableComponent-actionsLabel_59z7f_127 {
1107
+ color: var(--puck-color-grey-08);
1108
+ display: flex;
1109
+ font-size: var(--puck-font-size-xxxs);
1154
1110
  font-weight: 500;
1155
- white-space: nowrap;
1111
+ justify-content: center;
1112
+ align-items: center;
1113
+ padding-left: 8px;
1114
+ padding-right: 16px;
1115
+ margin-right: 8px;
1116
+ border-right: 0.5px solid var(--puck-color-grey-05);
1156
1117
  text-overflow: ellipsis;
1157
- transition: background-color 50ms ease-in;
1158
- position: relative;
1159
- overflow: hidden;
1160
- flex-grow: 1;
1161
- }
1162
- ._ExternalInput--dataSelected_19obq_25 ._ExternalInput-button_19obq_5 {
1163
- color: var(--puck-color-grey-03);
1164
- display: block;
1165
- border-top-right-radius: 0px;
1166
- border-bottom-right-radius: 0px;
1118
+ white-space: nowrap;
1167
1119
  }
1168
- ._ExternalInput-detachButton_19obq_32 {
1169
- border: 1px solid var(--puck-color-grey-09);
1170
- border-top-right-radius: 4px;
1171
- border-bottom-right-radius: 4px;
1172
- background-color: var(--puck-color-grey-12);
1173
- color: var(--puck-color-grey-05);
1120
+ ._DraggableComponent-action_59z7f_97 {
1121
+ background: transparent;
1122
+ border: none;
1123
+ color: var(--puck-color-grey-08);
1174
1124
  cursor: pointer;
1125
+ padding: 6px 8px;
1126
+ border-radius: 4px;
1127
+ overflow: hidden;
1175
1128
  display: flex;
1176
- gap: 8px;
1177
1129
  align-items: center;
1178
1130
  justify-content: center;
1179
- padding: 8px 12px;
1180
- position: relative;
1181
- transition: background-color 50ms ease-in, color 50ms ease-in;
1182
- margin-left: -1px;
1131
+ transition: color 50ms ease-in;
1183
1132
  }
1184
- ._ExternalInput-button_19obq_5:focus-visible,
1185
- ._ExternalInput-detachButton_19obq_32:focus-visible {
1133
+ ._DraggableComponent-action_59z7f_97:focus-visible {
1186
1134
  outline: 2px solid var(--puck-color-azure-05);
1187
- outline-offset: 2px;
1188
- z-index: 1;
1135
+ outline-offset: -2px;
1189
1136
  }
1190
1137
  @media (hover: hover) and (pointer: fine) {
1191
- ._ExternalInput-button_19obq_5:hover,
1192
- ._ExternalInput-detachButton_19obq_32:hover {
1193
- background: var(--puck-color-azure-12);
1138
+ ._DraggableComponent-action_59z7f_97:hover {
1139
+ color: var(--puck-color-azure-06);
1194
1140
  transition: none;
1195
1141
  }
1196
- ._ExternalInput-detachButton_19obq_32:hover {
1197
- color: var(--puck-color-azure-04);
1198
- }
1199
1142
  }
1200
- ._ExternalInput-button_19obq_5:active,
1201
- ._ExternalInput-detachButton_19obq_32:active {
1202
- background: var(--puck-color-azure-11);
1143
+ ._DraggableComponent-action_59z7f_97:active {
1144
+ color: var(--puck-color-azure-07);
1203
1145
  transition: none;
1204
1146
  }
1205
- ._ExternalInputModal_19obq_74 {
1206
- color: var(--puck-color-black);
1207
- display: grid;
1208
- grid-template-rows: min-content minmax(128px, 100%) min-content;
1209
- grid-template-columns: 100%;
1147
+
1148
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
1149
+ ._DropZone_djoti_1 {
1150
+ margin-left: auto;
1151
+ margin-right: auto;
1210
1152
  position: relative;
1211
- min-height: 50dvh;
1212
- max-height: 90dvh;
1153
+ min-height: 100%;
1154
+ outline-offset: -2px;
1155
+ width: 100%;
1213
1156
  }
1214
- ._ExternalInputModal-grid_19obq_84 {
1215
- display: flex;
1216
- flex-direction: column;
1157
+ ._DropZone-content_djoti_10 {
1158
+ min-height: 128px;
1159
+ height: 100%;
1217
1160
  }
1218
- @media (min-width: 458px) {
1219
- ._ExternalInputModal-grid_19obq_84 {
1220
- display: grid;
1221
- grid-template-columns: 100%;
1222
- }
1223
- ._ExternalInputModal--filtersToggled_19obq_95 ._ExternalInputModal-grid_19obq_84 {
1224
- grid-template-columns: 25% 75%;
1225
- }
1161
+ ._DropZone--userIsDragging_djoti_15 ._DropZone-content_djoti_10 {
1162
+ pointer-events: all;
1226
1163
  }
1227
- ._ExternalInputModal-filters_19obq_100 {
1228
- border-bottom: 1px solid var(--puck-color-grey-09);
1164
+ ._DropZone--userIsDragging_djoti_15:not(._DropZone--draggingOverArea_djoti_19):not(._DropZone--draggingNewComponent_djoti_20) > ._DropZone-content_djoti_10 {
1165
+ pointer-events: none;
1229
1166
  }
1230
- ._ExternalInputModal--filtersToggled_19obq_95 ._ExternalInputModal-filters_19obq_100 {
1231
- display: none;
1167
+ ._DropZone--isAreaSelected_djoti_26,
1168
+ ._DropZone--draggingOverArea_djoti_19:not(:has(._DropZone--hoveringOverArea_djoti_27)),
1169
+ ._DropZone--hoveringOverArea_djoti_27:not(._DropZone--isDisabled_djoti_28):not(._DropZone--isRootZone_djoti_29):not(._DropZone--hasChildren_djoti_30) {
1170
+ background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
1171
+ outline: 2px dashed var(--puck-color-azure-08);
1232
1172
  }
1233
- @media (min-width: 458px) {
1234
- ._ExternalInputModal-filters_19obq_100 {
1235
- border-right: 1px solid var(--puck-color-grey-09);
1236
- display: none;
1237
- }
1238
- ._ExternalInputModal--filtersToggled_19obq_95 ._ExternalInputModal-filters_19obq_100 {
1239
- display: block;
1240
- }
1173
+ ._DropZone_djoti_1:not(._DropZone--hasChildren_djoti_30) {
1174
+ background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
1175
+ outline: 2px dashed var(--puck-color-azure-08);
1241
1176
  }
1242
- ._ExternalInputModal-masthead_19obq_119 {
1243
- background-color: var(--puck-color-grey-12);
1244
- border-bottom: 1px solid var(--puck-color-grey-09);
1245
- display: flex;
1246
- flex-wrap: wrap;
1247
- gap: 24px;
1248
- padding: 24px;
1177
+ ._DropZone--isDestination_djoti_40 {
1178
+ outline: 2px dashed var(--puck-color-azure-04) !important;
1249
1179
  }
1250
- ._ExternalInputModal-tableWrapper_19obq_128 {
1251
- position: relative;
1252
- overflow-x: auto;
1253
- overflow-y: auto;
1254
- flex-grow: 1;
1180
+ ._DropZone--isDestination_djoti_40:not(._DropZone--isRootZone_djoti_29) {
1181
+ background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent) !important;
1255
1182
  }
1256
- ._ExternalInputModal-table_19obq_128 {
1257
- border-collapse: unset;
1258
- border-spacing: 0px;
1259
- color: var(--puck-color-grey-02);
1183
+ ._DropZone-item_djoti_52 {
1260
1184
  position: relative;
1261
- z-index: 0;
1262
- min-width: 100%;
1263
1185
  }
1264
- ._ExternalInputModal-thead_19obq_144 {
1265
- background-color: var(--puck-color-white);
1266
- position: sticky;
1267
- top: 0;
1186
+ ._DropZone-hitbox_djoti_56 {
1187
+ position: absolute;
1188
+ bottom: -12px;
1189
+ height: 24px;
1190
+ width: 100%;
1268
1191
  z-index: 1;
1269
1192
  }
1270
- ._ExternalInputModal-th_19obq_144 {
1193
+
1194
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
1195
+ ._SidebarSection_125qe_1 {
1196
+ display: flex;
1197
+ position: relative;
1198
+ flex-direction: column;
1199
+ color: var(--puck-color-black);
1200
+ }
1201
+ ._SidebarSection_125qe_1:last-of-type {
1202
+ flex-grow: 1;
1203
+ }
1204
+ ._SidebarSection-title_125qe_12 {
1205
+ background: var(--puck-color-white);
1206
+ padding: 16px;
1271
1207
  border-bottom: 1px solid var(--puck-color-grey-09);
1272
- color: var(--puck-color-grey-04);
1273
- font-weight: 500;
1274
- font-size: 14px;
1275
- padding: 16px 24px;
1208
+ border-top: 1px solid var(--puck-color-grey-09);
1209
+ overflow-x: auto;
1276
1210
  }
1277
- ._ExternalInputModal-td_19obq_159 {
1278
- border-bottom: 1px solid var(--puck-color-grey-10);
1279
- padding: 16px 24px;
1211
+ ._SidebarSection--noBorderTop_125qe_20 > ._SidebarSection-title_125qe_12 {
1212
+ border-top: 0px;
1280
1213
  }
1281
- ._ExternalInputModal-tr_19obq_164 ._ExternalInputModal-td_19obq_159:first-of-type {
1282
- font-weight: 500;
1283
- width: 1%;
1284
- white-space: nowrap;
1214
+ ._SidebarSection-content_125qe_24 {
1215
+ padding: 16px;
1216
+ }
1217
+ ._SidebarSection--noPadding_125qe_28 > ._SidebarSection-content_125qe_24 {
1218
+ padding: 0px;
1219
+ }
1220
+ ._SidebarSection--noPadding_125qe_28 > ._SidebarSection-content_125qe_24:last-child {
1221
+ padding-bottom: 4px;
1222
+ }
1223
+ ._SidebarSection_125qe_1:last-of-type ._SidebarSection-content_125qe_24 {
1224
+ border-bottom: none;
1225
+ flex-grow: 1;
1226
+ }
1227
+ ._SidebarSection-breadcrumbLabel_125qe_41 {
1228
+ background: none;
1229
+ border: 0;
1230
+ border-radius: 2px;
1231
+ color: var(--puck-color-azure-04);
1232
+ cursor: pointer;
1233
+ font: inherit;
1234
+ flex-shrink: 0;
1235
+ padding: 0;
1236
+ transition: color 50ms ease-in;
1237
+ }
1238
+ ._SidebarSection-breadcrumbLabel_125qe_41:focus-visible {
1239
+ outline: 2px solid var(--puck-color-azure-05);
1240
+ outline-offset: 2px;
1285
1241
  }
1286
1242
  @media (hover: hover) and (pointer: fine) {
1287
- ._ExternalInputModal-tbody_19obq_171 ._ExternalInputModal-tr_19obq_164:hover {
1288
- background: var(--puck-color-azure-12);
1289
- color: var(--puck-color-azure-04);
1290
- cursor: pointer;
1291
- position: relative;
1292
- margin-left: -5px;
1293
- }
1294
- ._ExternalInputModal-tbody_19obq_171 ._ExternalInputModal-tr_19obq_164:hover ._ExternalInputModal-td_19obq_159:first-of-type {
1295
- border-left: 4px solid var(--puck-color-azure-04);
1296
- padding-left: 20px;
1243
+ ._SidebarSection-breadcrumbLabel_125qe_41:hover {
1244
+ color: var(--puck-color-azure-03);
1245
+ transition: none;
1297
1246
  }
1298
1247
  }
1299
- ._ExternalInputModal-tbody_19obq_171 ._ExternalInputModal-tr_19obq_164:last-of-type ._ExternalInputModal-td_19obq_159 {
1300
- border-bottom: none;
1248
+ ._SidebarSection-breadcrumbLabel_125qe_41:active {
1249
+ color: var(--puck-color-azure-02);
1250
+ transition: none;
1301
1251
  }
1302
- ._ExternalInputModal-tableWrapper_19obq_128 {
1303
- display: none;
1252
+ ._SidebarSection-breadcrumbs_125qe_70 {
1253
+ align-items: center;
1254
+ display: flex;
1255
+ gap: 4px;
1304
1256
  }
1305
- ._ExternalInputModal--hasData_19obq_197 ._ExternalInputModal-tableWrapper_19obq_128 {
1306
- display: block;
1257
+ ._SidebarSection-breadcrumb_125qe_41 {
1258
+ align-items: center;
1259
+ display: flex;
1260
+ gap: 4px;
1307
1261
  }
1308
- ._ExternalInputModal-loadingBanner_19obq_201 {
1262
+ ._SidebarSection-heading_125qe_82 {
1263
+ padding-right: 16px;
1264
+ }
1265
+ ._SidebarSection-loadingOverlay_125qe_86 {
1266
+ background: var(--puck-color-white);
1267
+ display: flex;
1268
+ justify-content: center;
1269
+ align-items: center;
1270
+ height: 100%;
1271
+ width: 100%;
1272
+ top: 0;
1273
+ position: absolute;
1274
+ z-index: 1;
1275
+ pointer-events: all;
1276
+ box-sizing: border-box;
1277
+ opacity: 0.8;
1278
+ }
1279
+
1280
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/MenuBar/styles.module.css/#css-module-data */
1281
+ ._MenuBar_8pf8c_1 {
1282
+ background-color: var(--puck-color-white);
1283
+ border-bottom: 1px solid var(--puck-color-grey-09);
1309
1284
  display: none;
1310
- background-color: color-mix(in srgb, var(--puck-color-white) 90%, transparent);
1311
- padding: 64px;
1312
- align-items: center;
1313
- justify-content: center;
1314
- position: absolute;
1315
- top: 0;
1316
1285
  left: 0;
1286
+ margin-top: 1px;
1287
+ padding: 8px 16px;
1288
+ position: absolute;
1317
1289
  right: 0;
1318
- bottom: 0;
1290
+ top: 100%;
1291
+ z-index: 2;
1319
1292
  }
1320
- ._ExternalInputModal--isLoading_19obq_218 ._ExternalInputModal-loadingBanner_19obq_201 {
1321
- display: flex;
1293
+ ._MenuBar--menuOpen_8pf8c_14 {
1294
+ display: block;
1322
1295
  }
1323
- ._ExternalInputModal-searchForm_19obq_222 {
1296
+ @media (min-width: 638px) {
1297
+ ._MenuBar_8pf8c_1 {
1298
+ border: none;
1299
+ display: block;
1300
+ margin-top: 0;
1301
+ overflow-y: visible;
1302
+ padding: 0;
1303
+ position: static;
1304
+ }
1305
+ }
1306
+ ._MenuBar-inner_8pf8c_29 {
1307
+ align-items: center;
1324
1308
  display: flex;
1325
1309
  flex-wrap: wrap;
1326
- gap: 12px;
1327
- flex-grow: 1;
1310
+ gap: 8px 16px;
1311
+ justify-content: flex-end;
1328
1312
  }
1329
- @media (min-width: 458px) {
1330
- ._ExternalInputModal-searchForm_19obq_222 {
1313
+ @media (min-width: 638px) {
1314
+ ._MenuBar-inner_8pf8c_29 {
1315
+ display: flex;
1316
+ flex-direction: row;
1331
1317
  flex-wrap: nowrap;
1332
1318
  }
1333
1319
  }
1334
- ._ExternalInputModal-search_19obq_222 {
1320
+ ._MenuBar-history_8pf8c_45 {
1335
1321
  display: flex;
1336
- background: var(--puck-color-white);
1337
- border-width: 1px;
1338
- border-style: solid;
1339
- border-color: var(--puck-color-grey-09);
1340
- border-radius: 4px;
1341
- flex-grow: 1;
1342
- transition: border-color 50ms ease-in;
1343
1322
  }
1344
- ._ExternalInputModal-search_19obq_222:focus-within {
1345
- border-color: var(--puck-color-grey-05);
1346
- outline: 2px solid var(--puck-color-azure-05);
1347
- transition: none;
1323
+
1324
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css/#css-module-data */
1325
+ ._Puck_mowzv_19 {
1326
+ --puck-space-px: 16px;
1327
+ bottom: 0;
1328
+ font-family: var(--puck-font-family);
1329
+ left: 0;
1330
+ position: fixed;
1331
+ right: 0;
1332
+ top: 0;
1348
1333
  }
1349
- @media (hover: hover) and (pointer: fine) {
1350
- ._ExternalInputModal-search_19obq_222:hover {
1351
- border-color: var(--puck-color-grey-05);
1352
- transition: none;
1334
+ ._Puck-layout_mowzv_29 {
1335
+ --puck-frame-width: auto;
1336
+ --puck-side-bar-width: 0px;
1337
+ display: grid;
1338
+ grid-template-areas: "header header header" "left editor right";
1339
+ grid-template-columns: 0 var(--puck-frame-width) 0;
1340
+ grid-template-rows: min-content auto;
1341
+ height: 100dvh;
1342
+ position: relative;
1343
+ z-index: 0;
1344
+ }
1345
+ ._Puck--mounted_mowzv_41 ._Puck-layout_mowzv_29 {
1346
+ --puck-side-bar-width: 186px;
1347
+ }
1348
+ ._Puck--leftSideBarVisible_mowzv_45 ._Puck-layout_mowzv_29 {
1349
+ grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) 0;
1350
+ }
1351
+ ._Puck--rightSideBarVisible_mowzv_51 ._Puck-layout_mowzv_29 {
1352
+ grid-template-columns: 0 var(--puck-frame-width) var(--puck-side-bar-width);
1353
+ }
1354
+ ._Puck--leftSideBarVisible_mowzv_45._Puck--rightSideBarVisible_mowzv_51 ._Puck-layout_mowzv_29 {
1355
+ grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) var(--puck-side-bar-width);
1356
+ }
1357
+ @media (min-width: 458px) {
1358
+ ._Puck-mounted_mowzv_64 ._Puck-layout_mowzv_29 {
1359
+ --puck-frame-width: minmax(266px, auto);
1353
1360
  }
1354
1361
  }
1355
- ._ExternalInputModal-searchIcon_19obq_259 {
1356
- align-items: center;
1357
- background: var(--puck-color-grey-12);
1358
- border-bottom-left-radius: 4px;
1359
- border-top-left-radius: 4px;
1360
- border-right: 1px solid var(--puck-color-grey-09);
1361
- color: var(--puck-color-grey-07);
1362
- display: flex;
1363
- justify-content: center;
1364
- padding: 12px 15px;
1365
- transition: color 50ms ease-in;
1362
+ @media (min-width: 638px) {
1363
+ ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
1364
+ --puck-side-bar-width: minmax(186px, 250px);
1365
+ }
1366
1366
  }
1367
- ._ExternalInputModal-search_19obq_222:focus-within ._ExternalInputModal-searchIcon_19obq_259 {
1368
- color: var(--puck-color-grey-04);
1369
- transition: none;
1367
+ @media (min-width: 766px) {
1368
+ ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
1369
+ --puck-frame-width: auto;
1370
+ }
1370
1371
  }
1371
- @media (hover: hover) and (pointer: fine) {
1372
- ._ExternalInputModal-search_19obq_222:hover ._ExternalInputModal-searchIcon_19obq_259 {
1373
- color: var(--puck-color-grey-04);
1374
- transition: none;
1372
+ @media (min-width: 990px) {
1373
+ ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
1374
+ --puck-side-bar-width: 256px;
1375
1375
  }
1376
1376
  }
1377
- ._ExternalInputModal-searchIconText_19obq_284 {
1378
- clip: rect(0 0 0 0);
1379
- clip-path: inset(100%);
1380
- height: 1px;
1381
- overflow: hidden;
1382
- position: absolute;
1383
- white-space: nowrap;
1384
- width: 1px;
1377
+ @media (min-width: 1198px) {
1378
+ ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
1379
+ --puck-side-bar-width: 274px;
1380
+ }
1385
1381
  }
1386
- ._ExternalInputModal-searchInput_19obq_294 {
1387
- border: none;
1388
- border-radius: 4px;
1382
+ @media (min-width: 1398px) {
1383
+ ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
1384
+ --puck-side-bar-width: 290px;
1385
+ }
1386
+ }
1387
+ @media (min-width: 1598px) {
1388
+ ._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
1389
+ --puck-side-bar-width: 320px;
1390
+ }
1391
+ }
1392
+ ._Puck-header_mowzv_105 {
1389
1393
  background: var(--puck-color-white);
1390
- font-family: inherit;
1391
- font-size: 14px;
1392
- padding: 12px 15px;
1393
- width: 100%;
1394
+ border-bottom: 1px solid var(--puck-color-grey-09);
1395
+ color: var(--puck-color-black);
1396
+ grid-area: header;
1397
+ position: relative;
1398
+ max-width: 100vw;
1394
1399
  }
1395
- ._ExternalInputModal-searchInput_19obq_294:focus {
1396
- outline: 0;
1400
+ ._Puck-headerInner_mowzv_114 {
1401
+ align-items: end;
1402
+ display: grid;
1403
+ gap: var(--puck-space-px);
1404
+ grid-template-areas: "left middle right";
1405
+ grid-template-columns: 1fr auto 1fr;
1406
+ grid-template-rows: auto;
1407
+ padding: var(--puck-space-px);
1397
1408
  }
1398
- ._ExternalInputModal-searchActions_19obq_308 {
1409
+ ._Puck-headerToggle_mowzv_124 {
1410
+ color: var(--puck-color-grey-05);
1399
1411
  display: flex;
1400
- gap: 8px;
1401
- height: 44px;
1402
- width: 100%;
1412
+ margin-left: -4px;
1413
+ padding-top: 2px;
1403
1414
  }
1404
- @media (min-width: 458px) {
1405
- ._ExternalInputModal-searchActions_19obq_308 {
1406
- width: auto;
1407
- }
1415
+ ._Puck--rightSideBarVisible_mowzv_51 ._Puck-rightSideBarToggle_mowzv_131,
1416
+ ._Puck--leftSideBarVisible_mowzv_45 ._Puck-leftSideBarToggle_mowzv_132 {
1417
+ color: var(--puck-color-black);
1408
1418
  }
1409
- ._ExternalInputModal-searchActionIcon_19obq_321 {
1419
+ ._Puck-headerTitle_mowzv_136 {
1410
1420
  align-self: center;
1411
1421
  }
1412
- ._ExternalInputModal-footer_19obq_325 {
1413
- background-color: var(--puck-color-grey-12);
1414
- border-top: 1px solid var(--puck-color-grey-09);
1415
- color: var(--puck-color-grey-04);
1416
- font-weight: 500;
1417
- font-size: 14px;
1418
- padding: 16px;
1419
- text-align: right;
1420
- }
1421
-
1422
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Modal/styles.module.css/#css-module-data */
1423
- ._Modal_ikbaj_1 {
1424
- background: color-mix(in srgb, var(--puck-color-black) 75%, transparent);
1425
- display: none;
1426
- justify-content: center;
1427
- align-items: center;
1428
- position: fixed;
1429
- top: 0;
1430
- left: 0;
1431
- bottom: 0;
1432
- right: 0;
1433
- z-index: 1;
1434
- padding: 32px;
1422
+ ._Puck-headerPath_mowzv_140 {
1423
+ font-family: var(--puck-font-family-monospaced);
1424
+ font-size: var(--puck-font-size-xxs);
1425
+ font-weight: normal;
1426
+ word-break: break-all;
1435
1427
  }
1436
- ._Modal--isOpen_ikbaj_15 {
1428
+ ._Puck-headerTools_mowzv_147 {
1437
1429
  display: flex;
1430
+ gap: 16px;
1431
+ justify-content: flex-end;
1438
1432
  }
1439
- ._Modal-inner_ikbaj_19 {
1440
- width: 100%;
1441
- max-width: 1024px;
1442
- border-radius: 8px;
1443
- overflow: hidden;
1444
- background: var(--puck-color-white);
1433
+ ._Puck-menuButton_mowzv_153 {
1434
+ color: var(--puck-color-grey-05);
1435
+ margin-left: -4px;
1436
+ }
1437
+ ._Puck--menuOpen_mowzv_158 ._Puck-menuButton_mowzv_153 {
1438
+ color: var(--puck-color-black);
1439
+ }
1440
+ @media (min-width: 638px) {
1441
+ ._Puck-menuButton_mowzv_153 {
1442
+ display: none;
1443
+ }
1444
+ }
1445
+ ._Puck-leftSideBar_mowzv_132 {
1446
+ background: var(--puck-color-grey-12);
1447
+ border-right: 1px solid var(--puck-color-grey-09);
1445
1448
  display: flex;
1446
1449
  flex-direction: column;
1447
- max-height: 90dvh;
1450
+ grid-area: left;
1451
+ overflow-y: auto;
1448
1452
  }
1449
-
1450
- /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/fields/ObjectField/styles.module.css/#css-module-data */
1451
- ._ObjectField_15j63_5 {
1453
+ ._Puck-rightSideBar_mowzv_131 {
1454
+ background: var(--puck-color-white);
1455
+ border-left: 1px solid var(--puck-color-grey-09);
1452
1456
  display: flex;
1453
1457
  flex-direction: column;
1454
- background-color: var(--puck-color-white);
1455
- border: 1px solid var(--puck-color-grey-09);
1456
- border-radius: 4px;
1458
+ grid-area: right;
1459
+ overflow-y: auto;
1457
1460
  }
1458
- ._ObjectField-fieldset_15j63_13 {
1459
- border: none;
1460
- margin: 0;
1461
- padding: 16px 15px;
1461
+ ._Puck-portal_mowzv_186 {
1462
+ z-index: 2;
1462
1463
  }
1463
1464
 
1464
1465
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Fields/styles.module.css/#css-module-data */
1465
- ._PuckFields_17k3p_1 {
1466
+ ._PuckFields_1o0if_1 {
1466
1467
  position: relative;
1467
1468
  font-family: var(--puck-font-family);
1468
1469
  }
1469
- ._PuckFields-loadingOverlay_17k3p_6 {
1470
+ ._PuckFields--isLoading_1o0if_6 {
1471
+ min-height: 48px;
1472
+ }
1473
+ ._PuckFields-loadingOverlay_1o0if_10 {
1470
1474
  background: var(--puck-color-white);
1471
1475
  display: flex;
1472
1476
  justify-content: center;