@measured/puck 0.12.1-canary.ccf7aa5 → 0.13.0-canary.0450f4e

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.
package/dist/index.css CHANGED
@@ -212,26 +212,66 @@
212
212
  width: 100%;
213
213
  }
214
214
 
215
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Drawer/styles.module.css/#css-module-data */
216
+ ._DrawerItem_1qydx_1:last-of-type ._DrawerItem-default_1qydx_1 ._DrawerItem-draggableWrapper_1qydx_1 {
217
+ padding-bottom: 0px;
218
+ }
219
+ ._DrawerItem-default_1qydx_1 ._DrawerItem-draggableWrapper_1qydx_1 {
220
+ padding-bottom: 12px;
221
+ }
222
+ ._DrawerItem-draggable_1qydx_1 {
223
+ background: white;
224
+ padding: 12px;
225
+ display: flex;
226
+ border: 1px var(--puck-color-grey-8) solid;
227
+ border-radius: 4px;
228
+ font-size: var(--puck-font-size-xxs);
229
+ justify-content: space-between;
230
+ align-items: center;
231
+ cursor: grab;
232
+ }
233
+ ._Drawer_1qydx_1:not(._Drawer--isDraggingFrom_1qydx_21) ._DrawerItem-draggable_1qydx_1:hover {
234
+ background-color: var(--puck-color-azure-9);
235
+ color: var(--puck-color-azure-4);
236
+ }
237
+ ._DrawerItem-name_1qydx_26 {
238
+ overflow-x: hidden;
239
+ text-overflow: ellipsis;
240
+ white-space: nowrap;
241
+ }
242
+
243
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/DragIcon/styles.module.css/#css-module-data */
244
+ ._DragIcon_o29on_1 {
245
+ color: var(--puck-color-grey-4);
246
+ padding: 4px;
247
+ border-radius: 4px;
248
+ }
249
+ ._DragIcon_o29on_1:hover {
250
+ cursor: grab;
251
+ background: var(--puck-color-grey-9);
252
+ }
253
+
215
254
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
216
- ._DraggableComponent_2abzb_1 {
255
+ ._DraggableComponent_foluk_1 {
256
+ outline-offset: 0px !important;
217
257
  pointer-events: auto;
218
258
  }
219
- ._DraggableComponent--isDragging_2abzb_5 {
259
+ ._DraggableComponent--isDragging_foluk_6 {
220
260
  background: #abc7e510;
221
- outline: 2px var(--puck-color-azure-8) solid;
261
+ outline: 2px var(--puck-color-azure-8) solid !important;
222
262
  overflow: hidden;
223
263
  }
224
- ._DraggableComponent-contents_2abzb_11 {
264
+ ._DraggableComponent-contents_foluk_12 {
225
265
  position: relative;
226
266
  pointer-events: none;
227
267
  z-index: 0;
228
268
  }
229
- ._DraggableComponent-contents_2abzb_11::before,
230
- ._DraggableComponent-contents_2abzb_11::after {
269
+ ._DraggableComponent-contents_foluk_12::before,
270
+ ._DraggableComponent-contents_foluk_12::after {
231
271
  content: " ";
232
272
  display: table;
233
273
  }
234
- ._DraggableComponent-overlay_2abzb_24 {
274
+ ._DraggableComponent-overlay_foluk_25 {
235
275
  display: none;
236
276
  background: #abc7e530;
237
277
  cursor: pointer;
@@ -244,7 +284,7 @@
244
284
  pointer-events: none;
245
285
  box-sizing: border-box;
246
286
  }
247
- ._DraggableComponent-loadingOverlay_2abzb_38 {
287
+ ._DraggableComponent-loadingOverlay_foluk_39 {
248
288
  background: var(--puck-color-white);
249
289
  color: var(--puck-color-grey-2);
250
290
  border-radius: 4px;
@@ -259,36 +299,36 @@
259
299
  opacity: 0.8;
260
300
  z-index: 1;
261
301
  }
262
- ._DraggableComponent_2abzb_1:hover:not(._DraggableComponent--isLocked_2abzb_54) > ._DraggableComponent-overlay_2abzb_24 {
302
+ ._DraggableComponent_foluk_1:hover:not(._DraggableComponent--isLocked_foluk_55) > ._DraggableComponent-overlay_foluk_25 {
263
303
  display: block;
264
304
  pointer-events: none;
265
305
  }
266
- ._DraggableComponent--forceHover_2abzb_60 > ._DraggableComponent-overlay_2abzb_24 {
306
+ ._DraggableComponent--forceHover_foluk_61 > ._DraggableComponent-overlay_foluk_25 {
267
307
  display: block;
268
308
  pointer-events: none;
269
309
  }
270
- ._DraggableComponent_2abzb_1:not(._DraggableComponent--isSelected_2abzb_65) > ._DraggableComponent-overlay_2abzb_24 {
271
- outline: 2px var(--puck-color-azure-8) solid;
310
+ ._DraggableComponent_foluk_1:not(._DraggableComponent--isSelected_foluk_66) > ._DraggableComponent-overlay_foluk_25 {
311
+ outline: 2px var(--puck-color-azure-8) solid !important;
272
312
  }
273
- ._DraggableComponent--indicativeHover_2abzb_70 > ._DraggableComponent-overlay_2abzb_24 {
313
+ ._DraggableComponent--indicativeHover_foluk_71 > ._DraggableComponent-overlay_foluk_25 {
274
314
  display: block;
275
315
  background: transparent;
276
316
  pointer-events: none;
277
317
  }
278
- ._DraggableComponent_2abzb_1:not(._DraggableComponent--isSelected_2abzb_65):has(._DraggableComponent_2abzb_1:hover > ._DraggableComponent-overlay_2abzb_24) > ._DraggableComponent-overlay_2abzb_24 {
318
+ ._DraggableComponent_foluk_1:not(._DraggableComponent--isSelected_foluk_66):has(._DraggableComponent_foluk_1:hover > ._DraggableComponent-overlay_foluk_25) > ._DraggableComponent-overlay_foluk_25 {
279
319
  display: none;
280
320
  }
281
- ._DraggableComponent--isSelected_2abzb_65 {
282
- outline: 2px var(--puck-color-azure-6) solid;
321
+ ._DraggableComponent--isSelected_foluk_66 {
322
+ outline: 2px var(--puck-color-azure-6) solid !important;
283
323
  }
284
- ._DraggableComponent--isSelected_2abzb_65 > ._DraggableComponent-overlay_2abzb_24 {
324
+ ._DraggableComponent--isSelected_foluk_66 > ._DraggableComponent-overlay_foluk_25 {
285
325
  background: none;
286
326
  display: block;
287
327
  position: sticky;
288
328
  top: 56px;
289
329
  z-index: 1;
290
330
  }
291
- ._DraggableComponent-actions_2abzb_96 {
331
+ ._DraggableComponent-actions_foluk_97 {
292
332
  position: absolute;
293
333
  right: 6.5px;
294
334
  width: auto;
@@ -304,10 +344,10 @@
304
344
  pointer-events: auto;
305
345
  box-sizing: border-box;
306
346
  }
307
- ._DraggableComponent--isSelected_2abzb_65 > ._DraggableComponent-overlay_2abzb_24 > ._DraggableComponent-actions_2abzb_96 {
347
+ ._DraggableComponent--isSelected_foluk_66 > ._DraggableComponent-overlay_foluk_25 > ._DraggableComponent-actions_foluk_97 {
308
348
  display: flex;
309
349
  }
310
- ._DraggableComponent-actionsLabel_2abzb_119 {
350
+ ._DraggableComponent-actionsLabel_foluk_120 {
311
351
  color: var(--puck-color-grey-7);
312
352
  display: flex;
313
353
  font-size: var(--puck-font-size-xxxs);
@@ -321,7 +361,7 @@
321
361
  text-overflow: ellipsis;
322
362
  white-space: nowrap;
323
363
  }
324
- ._DraggableComponent-action_2abzb_96 {
364
+ ._DraggableComponent-action_foluk_97 {
325
365
  background: transparent;
326
366
  border: none;
327
367
  color: var(--puck-color-grey-7);
@@ -329,52 +369,57 @@
329
369
  border-radius: 4px;
330
370
  overflow: hidden;
331
371
  }
332
- ._DraggableComponent-action_2abzb_96:hover {
372
+ ._DraggableComponent-action_foluk_97:hover {
333
373
  background: var(--puck-color-grey-2);
334
374
  color: var(--puck-color-azure-5);
335
375
  cursor: pointer;
336
376
  }
337
377
 
338
378
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
339
- ._DropZone_1akqa_1 {
379
+ ._DropZone_i675d_1 {
340
380
  margin-left: auto;
341
381
  margin-right: auto;
342
- zoom: 1.33;
343
382
  position: relative;
344
383
  height: 100%;
345
384
  outline-offset: -1px;
346
385
  width: 100%;
347
386
  }
348
- ._DropZone-content_1akqa_11 {
387
+ ._DropZone--zoomEnabled_i675d_10 {
388
+ zoom: 1.33;
389
+ }
390
+ ._DropZone--zoomEnabled_i675d_10 ._DropZone-renderWrapper_i675d_14 {
391
+ zoom: 0.75;
392
+ }
393
+ ._DropZone-content_i675d_18 {
349
394
  min-height: 128px;
350
395
  height: 100%;
351
396
  }
352
- ._DropZone--userIsDragging_1akqa_16 ._DropZone-content_1akqa_11 {
397
+ ._DropZone--userIsDragging_i675d_23 ._DropZone-content_i675d_18 {
353
398
  pointer-events: all;
354
399
  }
355
- ._DropZone--userIsDragging_1akqa_16:not(._DropZone--draggingOverArea_1akqa_20):not(._DropZone--draggingNewComponent_1akqa_21) > ._DropZone-content_1akqa_11 {
400
+ ._DropZone--userIsDragging_i675d_23:not(._DropZone--draggingOverArea_i675d_27):not(._DropZone--draggingNewComponent_i675d_28) > ._DropZone-content_i675d_18 {
356
401
  pointer-events: none;
357
402
  }
358
- ._DropZone--isAreaSelected_1akqa_27,
359
- ._DropZone--draggingOverArea_1akqa_20:not(:has(._DropZone--hoveringOverArea_1akqa_28)),
360
- ._DropZone--hoveringOverArea_1akqa_28:not(._DropZone--isDisabled_1akqa_29):not(._DropZone--isRootZone_1akqa_30) {
403
+ ._DropZone--isAreaSelected_i675d_34,
404
+ ._DropZone--draggingOverArea_i675d_27:not(:has(._DropZone--hoveringOverArea_i675d_35)),
405
+ ._DropZone--hoveringOverArea_i675d_35:not(._DropZone--isDisabled_i675d_36):not(._DropZone--isRootZone_i675d_37) {
361
406
  background: var(--puck-color-azure-9);
362
407
  outline: 2px dashed var(--puck-color-azure-7);
363
408
  }
364
- ._DropZone_1akqa_1:not(._DropZone--hasChildren_1akqa_36) {
409
+ ._DropZone_i675d_1:not(._DropZone--hasChildren_i675d_43) {
365
410
  background: var(--puck-color-azure-9);
366
411
  outline: 2px dashed var(--puck-color-azure-7);
367
412
  }
368
- ._DropZone--isDestination_1akqa_41 {
413
+ ._DropZone--isDestination_i675d_48 {
369
414
  outline: 2px dashed var(--puck-color-azure-3) !important;
370
415
  }
371
- ._DropZone--isDestination_1akqa_41:not(._DropZone--isRootZone_1akqa_30) {
416
+ ._DropZone--isDestination_i675d_48:not(._DropZone--isRootZone_i675d_37) {
372
417
  background: var(--puck-color-azure-85) !important;
373
418
  }
374
- ._DropZone-item_1akqa_49 {
419
+ ._DropZone-item_i675d_56 {
375
420
  position: relative;
376
421
  }
377
- ._DropZone-hitbox_1akqa_53 {
422
+ ._DropZone-hitbox_i675d_60 {
378
423
  position: absolute;
379
424
  bottom: -12px;
380
425
  height: 24px;
@@ -408,162 +453,466 @@
408
453
  width: 1px;
409
454
  }
410
455
 
411
- /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/styles.module.css/#css-module-data */
412
- ._Input_1jyrm_1 {
413
- color: var(--puck-color-grey-3);
456
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
457
+ ._SidebarSection_170gs_1 {
458
+ display: flex;
459
+ position: relative;
460
+ flex-direction: column;
461
+ color: black;
462
+ }
463
+ ._SidebarSection_170gs_1:last-of-type {
464
+ flex-grow: 1;
465
+ }
466
+ ._SidebarSection-title_170gs_12 {
467
+ background: white;
468
+ padding: 16px;
469
+ border-bottom: 1px solid var(--puck-color-grey-8);
470
+ border-top: 1px solid var(--puck-color-grey-8);
471
+ overflow-x: auto;
472
+ }
473
+ ._SidebarSection--noBorderTop_170gs_20 > ._SidebarSection-title_170gs_12 {
474
+ border-top: 0px;
475
+ }
476
+ ._SidebarSection-content_170gs_24 {
414
477
  padding: 16px;
415
- padding-bottom: 12px;
416
- display: block;
417
- font-family: var(--puck-font-stack);
418
478
  }
419
- ._Input_1jyrm_1 ._Input_1jyrm_1 {
479
+ ._SidebarSection--noPadding_170gs_28 > ._SidebarSection-content_170gs_24 {
420
480
  padding: 0px;
421
481
  }
422
- ._Input_1jyrm_1 * {
423
- box-sizing: border-box;
482
+ ._SidebarSection--noPadding_170gs_28 > ._SidebarSection-content_170gs_24:last-child {
483
+ padding-bottom: 4px;
424
484
  }
425
- ._Input_1jyrm_1 + ._Input_1jyrm_1 {
426
- border-top: 1px solid var(--puck-color-grey-8);
427
- margin-top: 8px;
485
+ ._SidebarSection_170gs_1:last-of-type ._SidebarSection-content_170gs_24 {
486
+ border-bottom: none;
487
+ flex-grow: 1;
428
488
  }
429
- ._Input_1jyrm_1 ._Input_1jyrm_1 + ._Input_1jyrm_1 {
430
- border-top: 0px;
431
- margin-top: 12px;
489
+ ._SidebarSection-breadcrumbLabel_170gs_41 {
490
+ color: var(--puck-color-azure-3);
491
+ flex-shrink: 0;
492
+ }
493
+ ._SidebarSection-breadcrumbLabel_170gs_41:hover {
494
+ color: var(--puck-color-azure-4);
495
+ cursor: pointer;
496
+ text-decoration: underline;
432
497
  }
433
- ._Input-label_1jyrm_27 {
498
+ ._SidebarSection-breadcrumbs_170gs_52 {
434
499
  align-items: center;
435
500
  display: flex;
436
- padding-bottom: 12px;
437
- font-size: var(--puck-font-size-xxs);
438
- font-weight: 600;
501
+ gap: 4px;
439
502
  }
440
- ._Input-labelIcon_1jyrm_35 {
441
- color: var(--puck-color-grey-6);
442
- margin-right: 4px;
443
- padding-left: 4px;
503
+ ._SidebarSection-breadcrumb_170gs_41 {
504
+ align-items: center;
505
+ display: flex;
506
+ gap: 4px;
444
507
  }
445
- ._Input-disabledIcon_1jyrm_41 {
446
- color: var(--puck-color-grey-4);
447
- margin-left: auto;
508
+ ._SidebarSection-heading_170gs_64 {
509
+ padding-right: 16px;
448
510
  }
449
- ._Input-input_1jyrm_46 {
511
+ ._SidebarSection-loadingOverlay_170gs_68 {
450
512
  background: white;
451
- border-width: 1px;
452
- border-style: solid;
453
- border-color: var(--puck-color-grey-8);
454
- border-radius: 4px;
455
- font-family: inherit;
456
- font-size: 14px;
457
- padding: 12px 15px;
513
+ display: flex;
514
+ justify-content: center;
515
+ align-items: center;
516
+ height: 100%;
458
517
  width: 100%;
518
+ top: 0;
519
+ position: absolute;
520
+ z-index: 1;
521
+ pointer-events: all;
522
+ box-sizing: border-box;
523
+ opacity: 0.8;
459
524
  }
460
- ._Input_1jyrm_1 select._Input-input_1jyrm_46 {
461
- appearance: none;
462
- 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;
463
- background-size: 12px;
464
- background-position: calc(100% - 12px) calc(50% + 3px);
465
- background-repeat: no-repeat;
466
- background-color: white;
525
+
526
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css/#css-module-data */
527
+ ._Heading_1bvy5_1 {
528
+ display: block;
529
+ color: var(--puck-color-black);
530
+ font-family: var(--puck-font-stack);
531
+ font-weight: 700;
532
+ margin: 0;
467
533
  }
468
- ._Input--readOnly_1jyrm_69 > ._Input-input_1jyrm_46,
469
- ._Input--readOnly_1jyrm_69 > select._Input-input_1jyrm_46 {
470
- background-color: var(--puck-color-grey-11);
471
- border-color: var(--puck-color-grey-8);
472
- color: var(--puck-color-grey-5);
473
- opacity: 1;
534
+ ._Heading_1bvy5_1 b {
535
+ font-weight: 700;
474
536
  }
475
- ._Input-input_1jyrm_46:hover {
476
- border-color: var(--puck-color-neutral-3);
537
+ ._Heading--xxxxl_1bvy5_13 {
538
+ font-size: var(--puck-font-size-xxxxl);
539
+ letter-spacing: 0.08ch;
540
+ font-weight: 800;
477
541
  }
478
- ._Input-input_1jyrm_46:focus {
479
- border-color: var(--puck-color-azure-4);
480
- outline: var(--puck-color-azure-8) 4px solid;
481
- outline-offset: 0;
542
+ ._Heading--xxxl_1bvy5_19 {
543
+ font-size: var(--puck-font-size-xxxl);
482
544
  }
483
- ._Input-radioGroupItems_1jyrm_87 {
484
- display: flex;
485
- border: 1px solid var(--puck-color-grey-7);
486
- border-radius: 4px;
487
- flex-wrap: wrap;
488
- overflow: hidden;
545
+ ._Heading--xxl_1bvy5_23 {
546
+ font-size: var(--puck-font-size-xxl);
489
547
  }
490
- ._Input-radio_1jyrm_87 {
491
- border-right: 1px solid var(--puck-color-grey-7);
492
- flex-grow: 1;
548
+ ._Heading--xl_1bvy5_27 {
549
+ font-size: var(--puck-font-size-xl);
493
550
  }
494
- ._Input-radio_1jyrm_87:last-of-type {
495
- border-right: none;
551
+ ._Heading--l_1bvy5_31 {
552
+ font-size: var(--puck-font-size-l);
496
553
  }
497
- ._Input-radioInner_1jyrm_104 {
498
- background-color: white;
499
- color: var(--puck-color-grey-4);
500
- font-size: var(--puck-font-size-xxxs);
501
- padding: 8px 12px;
502
- text-align: center;
554
+ ._Heading--m_1bvy5_35 {
555
+ font-size: var(--puck-font-size-m);
503
556
  }
504
- ._Input-radioInner_1jyrm_104:hover {
505
- background-color: var(--puck-color-azure-9);
506
- cursor: pointer;
557
+ ._Heading--s_1bvy5_39 {
558
+ font-size: var(--puck-font-size-s);
507
559
  }
508
- ._Input--readOnly_1jyrm_69 ._Input-radioGroupItems_1jyrm_87 {
509
- border-color: var(--puck-color-grey-8);
560
+ ._Heading--xs_1bvy5_43 {
561
+ font-size: var(--puck-font-size-xs);
510
562
  }
511
- ._Input--readOnly_1jyrm_69 ._Input-radioInner_1jyrm_104 {
512
- background-color: var(--puck-color-grey-11);
513
- color: var(--puck-color-grey-5);
563
+
564
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/MenuBar/styles.module.css/#css-module-data */
565
+ ._MenuBar_12sp7_1 {
566
+ background-color: var(--puck-color-white);
567
+ border-bottom: 1px solid var(--puck-color-grey-8);
568
+ display: none;
569
+ left: 0;
570
+ margin-top: 1px;
571
+ padding: 8px 16px;
572
+ position: absolute;
573
+ right: 0;
574
+ top: 100%;
575
+ z-index: 2;
514
576
  }
515
- ._Input-radio_1jyrm_87 ._Input-radioInput_1jyrm_126:checked ~ ._Input-radioInner_1jyrm_104 {
516
- background-color: var(--puck-color-azure-9);
517
- color: var(--puck-color-grey-1);
518
- font-weight: 500;
577
+ ._MenuBar--menuOpen_12sp7_14 {
578
+ display: block;
519
579
  }
520
- ._Input--readOnly_1jyrm_69 ._Input-radioInput_1jyrm_126:checked ~ ._Input-radioInner_1jyrm_104 {
521
- background-color: var(--puck-color-azure-9);
522
- color: var(--puck-color-grey-4);
580
+ @media (min-width: 638px) {
581
+ ._MenuBar_12sp7_1 {
582
+ border: none;
583
+ display: block;
584
+ margin-top: 0;
585
+ overflow-y: visible;
586
+ padding: 0;
587
+ position: static;
588
+ }
523
589
  }
524
- ._Input-radio_1jyrm_87 ._Input-radioInput_1jyrm_126 {
525
- display: none;
590
+ ._MenuBar-inner_12sp7_29 {
591
+ align-items: center;
592
+ display: flex;
593
+ flex-wrap: wrap;
594
+ gap: 8px 16px;
595
+ justify-content: flex-end;
526
596
  }
527
- ._Input_1jyrm_1 textarea._Input-input_1jyrm_46 {
528
- margin-bottom: -4px;
597
+ @media (min-width: 638px) {
598
+ ._MenuBar-inner_12sp7_29 {
599
+ display: flex;
600
+ flex-direction: row;
601
+ flex-wrap: nowrap;
602
+ }
529
603
  }
530
-
531
- /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/fields/ArrayField/styles.module.css/#css-module-data */
532
- ._ArrayField_1auyc_5 {
604
+ ._MenuBar-history_12sp7_45 {
533
605
  display: flex;
534
- flex-direction: column;
535
- background-color: var(--puck-color-grey-8);
536
- border: 1px solid var(--puck-color-grey-8);
537
- border-radius: 4px;
538
606
  }
539
- ._ArrayField--isDraggingFrom_1auyc_13 {
540
- background-color: var(--puck-color-azure-9);
607
+
608
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css/#css-module-data */
609
+ ._Puck_pp63_19 {
610
+ --puck-frame-width: auto;
611
+ --puck-side-bar-width: 186px;
612
+ --puck-space-px: 16px;
613
+ bottom: 0;
614
+ display: grid;
615
+ grid-template-areas: "header header header" "left editor right";
616
+ grid-template-columns: 0 var(--puck-frame-width) 0;
617
+ grid-template-rows: min-content auto;
618
+ height: 100vh;
619
+ left: 0;
620
+ position: fixed;
621
+ right: 0;
622
+ top: 0;
541
623
  }
542
- ._ArrayField-addButton_1auyc_17 {
543
- background-color: white;
544
- border: none;
545
- border-radius: 4px;
546
- display: flex;
547
- color: var(--puck-color-azure-4);
548
- justify-content: center;
549
- cursor: pointer;
550
- width: 100%;
551
- margin: 0;
552
- padding: 16px;
553
- text-align: left;
624
+ ._Puck--leftSideBarVisible_pp63_35 {
625
+ grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) 0;
554
626
  }
555
- ._ArrayField--hasItems_1auyc_31 > ._ArrayField-addButton_1auyc_17 {
556
- border-top-left-radius: 0;
557
- border-top-right-radius: 0;
627
+ ._Puck--rightSideBarVisible_pp63_41 {
628
+ grid-template-columns: 0 var(--puck-frame-width) var(--puck-side-bar-width);
558
629
  }
559
- ._ArrayField_1auyc_5:not(._ArrayField--isDraggingFrom_1auyc_13) > ._ArrayField-addButton_1auyc_17:hover {
560
- background: var(--puck-color-azure-9);
561
- color: var(--puck-color-azure-4);
630
+ ._Puck--leftSideBarVisible_pp63_35._Puck--rightSideBarVisible_pp63_41 {
631
+ grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) var(--puck-side-bar-width);
562
632
  }
563
- ._ArrayFieldItem_1auyc_45 {
564
- background: white;
565
- border-top-left-radius: 4px;
566
- border-top-right-radius: 4px;
633
+ @media (min-width: 458px) {
634
+ ._Puck_pp63_19 {
635
+ --puck-frame-width: minmax(266px, auto);
636
+ }
637
+ }
638
+ @media (min-width: 638px) {
639
+ ._Puck_pp63_19 {
640
+ --puck-side-bar-width: minmax(186px, 250px);
641
+ }
642
+ }
643
+ @media (min-width: 766px) {
644
+ ._Puck_pp63_19 {
645
+ --puck-frame-width: auto;
646
+ }
647
+ }
648
+ @media (min-width: 990px) {
649
+ ._Puck_pp63_19 {
650
+ --puck-side-bar-width: 256px;
651
+ }
652
+ }
653
+ @media (min-width: 1198px) {
654
+ ._Puck_pp63_19 {
655
+ --puck-side-bar-width: 274px;
656
+ }
657
+ }
658
+ @media (min-width: 1398px) {
659
+ ._Puck_pp63_19 {
660
+ --puck-side-bar-width: 290px;
661
+ }
662
+ }
663
+ @media (min-width: 1598px) {
664
+ ._Puck_pp63_19 {
665
+ --puck-side-bar-width: 320px;
666
+ }
667
+ }
668
+ ._Puck-header_pp63_95 {
669
+ background: var(--puck-color-white);
670
+ border-bottom: 1px solid var(--puck-color-grey-8);
671
+ color: var(--puck-color-black);
672
+ grid-area: header;
673
+ position: relative;
674
+ max-width: 100vw;
675
+ }
676
+ ._Puck-headerInner_pp63_104 {
677
+ align-items: end;
678
+ display: grid;
679
+ gap: var(--puck-space-px);
680
+ grid-template-areas: "left middle right";
681
+ grid-template-columns: 1fr auto 1fr;
682
+ grid-template-rows: auto;
683
+ padding: var(--puck-space-px);
684
+ }
685
+ ._Puck-headerToggle_pp63_114 {
686
+ color: var(--puck-color-grey-4);
687
+ display: flex;
688
+ margin-left: -4px;
689
+ padding-top: 2px;
690
+ }
691
+ ._Puck-rightSideBarToggle_pp63_121 {
692
+ transform: rotate(180deg);
693
+ }
694
+ ._Puck--rightSideBarVisible_pp63_41 ._Puck-rightSideBarToggle_pp63_121,
695
+ ._Puck--leftSideBarVisible_pp63_35 ._Puck-leftSideBarToggle_pp63_126 {
696
+ color: var(--puck-color-black);
697
+ }
698
+ ._Puck-headerTitle_pp63_130 {
699
+ align-self: center;
700
+ }
701
+ ._Puck-headerPath_pp63_134 {
702
+ font-family: var(--puck-font-family-monospaced);
703
+ font-size: var(--puck-font-size-xxs);
704
+ font-weight: normal;
705
+ word-break: break-all;
706
+ }
707
+ ._Puck-headerTools_pp63_141 {
708
+ display: flex;
709
+ gap: 16px;
710
+ justify-content: flex-end;
711
+ }
712
+ ._Puck-menuButton_pp63_147 {
713
+ color: var(--puck-color-grey-4);
714
+ margin-left: -4px;
715
+ }
716
+ ._Puck--menuOpen_pp63_152 ._Puck-menuButton_pp63_147 {
717
+ color: var(--puck-color-black);
718
+ }
719
+ @media (min-width: 638px) {
720
+ ._Puck-menuButton_pp63_147 {
721
+ display: none;
722
+ }
723
+ }
724
+ ._Puck-leftSideBar_pp63_126 {
725
+ background: var(--puck-color-grey-11);
726
+ border-right: 1px solid var(--puck-color-grey-8);
727
+ display: flex;
728
+ flex-direction: column;
729
+ grid-area: left;
730
+ overflow-y: auto;
731
+ }
732
+ ._Puck-frame_pp63_171 {
733
+ display: flex;
734
+ flex-direction: column;
735
+ grid-area: editor;
736
+ overflow: auto;
737
+ position: relative;
738
+ }
739
+ ._Puck-root_pp63_179 {
740
+ border: 1px solid var(--puck-color-grey-8);
741
+ box-shadow: 0 0 0 calc(var(--puck-space-px) * 1.5) var(--puck-color-grey-10);
742
+ margin: var(--puck-space-px);
743
+ min-width: 321px;
744
+ }
745
+ @media (min-width: 1198px) {
746
+ ._Puck-root_pp63_179 {
747
+ margin: calc(var(--puck-space-px) * 1.5);
748
+ }
749
+ }
750
+ ._Puck-rightSideBar_pp63_121 {
751
+ background: var(--puck-color-white);
752
+ border-left: 1px solid var(--puck-color-grey-8);
753
+ display: flex;
754
+ flex-direction: column;
755
+ font-family: var(--puck-font-stack);
756
+ grid-area: right;
757
+ overflow-y: auto;
758
+ }
759
+
760
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/styles.module.css/#css-module-data */
761
+ ._Input_1v7zr_1 {
762
+ color: var(--puck-color-grey-3);
763
+ padding: 16px;
764
+ padding-bottom: 12px;
765
+ display: block;
766
+ font-family: var(--puck-font-stack);
767
+ }
768
+ ._Input_1v7zr_1 ._Input_1v7zr_1 {
769
+ padding: 0px;
770
+ }
771
+ ._Input_1v7zr_1 * {
772
+ box-sizing: border-box;
773
+ }
774
+ ._Input_1v7zr_1 + ._Input_1v7zr_1 {
775
+ border-top: 1px solid var(--puck-color-grey-8);
776
+ margin-top: 8px;
777
+ }
778
+ ._Input_1v7zr_1 ._Input_1v7zr_1 + ._Input_1v7zr_1 {
779
+ border-top: 0px;
780
+ margin-top: 12px;
781
+ }
782
+ ._Input-label_1v7zr_27 {
783
+ align-items: center;
784
+ display: flex;
785
+ padding-bottom: 12px;
786
+ font-size: var(--puck-font-size-xxs);
787
+ font-weight: 600;
788
+ }
789
+ ._Input-labelIcon_1v7zr_35 {
790
+ color: var(--puck-color-grey-6);
791
+ margin-right: 4px;
792
+ padding-left: 4px;
793
+ }
794
+ ._Input-disabledIcon_1v7zr_41 {
795
+ color: var(--puck-color-grey-4);
796
+ margin-left: auto;
797
+ }
798
+ ._Input-input_1v7zr_46 {
799
+ background: white;
800
+ border-width: 1px;
801
+ border-style: solid;
802
+ border-color: var(--puck-color-grey-8);
803
+ border-radius: 4px;
804
+ font-family: inherit;
805
+ font-size: 14px;
806
+ padding: 12px 15px;
807
+ width: 100%;
808
+ }
809
+ select._Input-input_1v7zr_46 {
810
+ appearance: none;
811
+ 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;
812
+ background-size: 12px;
813
+ background-position: calc(100% - 12px) calc(50% + 3px);
814
+ background-repeat: no-repeat;
815
+ background-color: white;
816
+ }
817
+ ._Input--readOnly_1v7zr_69 > ._Input-input_1v7zr_46,
818
+ ._Input--readOnly_1v7zr_69 > select._Input-input_1v7zr_46 {
819
+ background-color: var(--puck-color-grey-11);
820
+ border-color: var(--puck-color-grey-8);
821
+ color: var(--puck-color-grey-5);
822
+ opacity: 1;
823
+ }
824
+ ._Input-input_1v7zr_46:hover {
825
+ border-color: var(--puck-color-neutral-3);
826
+ }
827
+ ._Input-input_1v7zr_46:focus {
828
+ border-color: var(--puck-color-azure-4);
829
+ outline: var(--puck-color-azure-8) 4px solid;
830
+ outline-offset: 0;
831
+ }
832
+ ._Input-radioGroupItems_1v7zr_87 {
833
+ display: flex;
834
+ border: 1px solid var(--puck-color-grey-7);
835
+ border-radius: 4px;
836
+ flex-wrap: wrap;
837
+ overflow: hidden;
838
+ }
839
+ ._Input-radio_1v7zr_87 {
840
+ border-right: 1px solid var(--puck-color-grey-7);
841
+ flex-grow: 1;
842
+ }
843
+ ._Input-radio_1v7zr_87:last-of-type {
844
+ border-right: none;
845
+ }
846
+ ._Input-radioInner_1v7zr_104 {
847
+ background-color: white;
848
+ color: var(--puck-color-grey-4);
849
+ font-size: var(--puck-font-size-xxxs);
850
+ padding: 8px 12px;
851
+ text-align: center;
852
+ }
853
+ ._Input-radioInner_1v7zr_104:hover {
854
+ background-color: var(--puck-color-azure-9);
855
+ cursor: pointer;
856
+ }
857
+ ._Input--readOnly_1v7zr_69 ._Input-radioGroupItems_1v7zr_87 {
858
+ border-color: var(--puck-color-grey-8);
859
+ }
860
+ ._Input--readOnly_1v7zr_69 ._Input-radioInner_1v7zr_104 {
861
+ background-color: var(--puck-color-grey-11);
862
+ color: var(--puck-color-grey-5);
863
+ }
864
+ ._Input-radio_1v7zr_87 ._Input-radioInput_1v7zr_126:checked ~ ._Input-radioInner_1v7zr_104 {
865
+ background-color: var(--puck-color-azure-9);
866
+ color: var(--puck-color-grey-1);
867
+ font-weight: 500;
868
+ }
869
+ ._Input--readOnly_1v7zr_69 ._Input-radioInput_1v7zr_126:checked ~ ._Input-radioInner_1v7zr_104 {
870
+ background-color: var(--puck-color-azure-9);
871
+ color: var(--puck-color-grey-4);
872
+ }
873
+ ._Input-radio_1v7zr_87 ._Input-radioInput_1v7zr_126 {
874
+ display: none;
875
+ }
876
+ textarea._Input-input_1v7zr_46 {
877
+ margin-bottom: -4px;
878
+ }
879
+
880
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/fields/ArrayField/styles.module.css/#css-module-data */
881
+ ._ArrayField_1auyc_5 {
882
+ display: flex;
883
+ flex-direction: column;
884
+ background-color: var(--puck-color-grey-8);
885
+ border: 1px solid var(--puck-color-grey-8);
886
+ border-radius: 4px;
887
+ }
888
+ ._ArrayField--isDraggingFrom_1auyc_13 {
889
+ background-color: var(--puck-color-azure-9);
890
+ }
891
+ ._ArrayField-addButton_1auyc_17 {
892
+ background-color: white;
893
+ border: none;
894
+ border-radius: 4px;
895
+ display: flex;
896
+ color: var(--puck-color-azure-4);
897
+ justify-content: center;
898
+ cursor: pointer;
899
+ width: 100%;
900
+ margin: 0;
901
+ padding: 16px;
902
+ text-align: left;
903
+ }
904
+ ._ArrayField--hasItems_1auyc_31 > ._ArrayField-addButton_1auyc_17 {
905
+ border-top-left-radius: 0;
906
+ border-top-right-radius: 0;
907
+ }
908
+ ._ArrayField_1auyc_5:not(._ArrayField--isDraggingFrom_1auyc_13) > ._ArrayField-addButton_1auyc_17:hover {
909
+ background: var(--puck-color-azure-9);
910
+ color: var(--puck-color-azure-4);
911
+ }
912
+ ._ArrayFieldItem_1auyc_45 {
913
+ background: white;
914
+ border-top-left-radius: 4px;
915
+ border-top-right-radius: 4px;
567
916
  display: block;
568
917
  margin-bottom: 1px;
569
918
  }
@@ -644,25 +993,14 @@
644
993
  cursor: pointer;
645
994
  }
646
995
 
647
- /* css-module:/home/runner/work/puck/puck/packages/core/components/DragIcon/styles.module.css/#css-module-data */
648
- ._DragIcon_o29on_1 {
649
- color: var(--puck-color-grey-4);
650
- padding: 4px;
651
- border-radius: 4px;
652
- }
653
- ._DragIcon_o29on_1:hover {
654
- cursor: grab;
655
- background: var(--puck-color-grey-9);
656
- }
657
-
658
996
  /* css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css/#css-module-data */
659
- ._ExternalInput_157li_1 {
997
+ ._ExternalInput_s6fxy_1 {
660
998
  font-family: var(--puck-font-stack);
661
999
  }
662
- ._ExternalInput-actions_157li_5 {
1000
+ ._ExternalInput-actions_s6fxy_5 {
663
1001
  display: flex;
664
1002
  }
665
- ._ExternalInput-button_157li_9 {
1003
+ ._ExternalInput-button_s6fxy_9 {
666
1004
  display: flex;
667
1005
  gap: 8px;
668
1006
  align-items: center;
@@ -679,20 +1017,20 @@
679
1017
  overflow: hidden;
680
1018
  flex-grow: 1;
681
1019
  }
682
- ._ExternalInput-button_157li_9:hover,
683
- ._ExternalInput-detachButton_157li_28:hover {
1020
+ ._ExternalInput-button_s6fxy_9:hover,
1021
+ ._ExternalInput-detachButton_s6fxy_28:hover {
684
1022
  cursor: pointer;
685
1023
  background: var(--puck-color-azure-9);
686
1024
  color: var(--puck-color-azure-4);
687
1025
  z-index: 1;
688
1026
  }
689
- ._ExternalInput--dataSelected_157li_35 ._ExternalInput-button_157li_9 {
1027
+ ._ExternalInput--dataSelected_s6fxy_35 ._ExternalInput-button_s6fxy_9 {
690
1028
  color: var(--puck-color-grey-2);
691
1029
  display: block;
692
1030
  border-top-right-radius: 0px;
693
1031
  border-bottom-right-radius: 0px;
694
1032
  }
695
- ._ExternalInput-detachButton_157li_28 {
1033
+ ._ExternalInput-detachButton_s6fxy_28 {
696
1034
  border: 1px solid var(--puck-color-grey-8);
697
1035
  border-top-right-radius: 4px;
698
1036
  border-bottom-right-radius: 4px;
@@ -705,22 +1043,27 @@
705
1043
  padding: 8px 12px;
706
1044
  margin-left: -1px;
707
1045
  }
708
- ._ExternalInputModal_157li_56 {
1046
+ ._ExternalInputModal_s6fxy_56 {
1047
+ color: black;
709
1048
  display: flex;
710
1049
  flex-direction: column;
711
1050
  position: relative;
712
1051
  max-height: 90vh;
713
1052
  }
714
- ._ExternalInputModal-masthead_157li_63 {
1053
+ ._ExternalInputModal-masthead_s6fxy_64 {
715
1054
  background-color: white;
1055
+ display: flex;
1056
+ flex-wrap: wrap;
1057
+ gap: 24px;
716
1058
  padding: 32px 24px;
717
1059
  }
718
- ._ExternalInputModal-tableWrapper_157li_68 {
1060
+ ._ExternalInputModal-tableWrapper_s6fxy_72 {
1061
+ position: relative;
719
1062
  overflow-x: auto;
720
1063
  overflow-y: auto;
721
1064
  flex-grow: 1;
722
1065
  }
723
- ._ExternalInputModal-table_157li_68 {
1066
+ ._ExternalInputModal-table_s6fxy_72 {
724
1067
  border-collapse: unset;
725
1068
  border-spacing: 0px;
726
1069
  color: var(--puck-color-neutral-4);
@@ -728,64 +1071,125 @@
728
1071
  z-index: 0;
729
1072
  min-width: 100%;
730
1073
  }
731
- ._ExternalInputModal-thead_157li_83 {
1074
+ ._ExternalInputModal-thead_s6fxy_88 {
732
1075
  position: sticky;
733
1076
  top: 0;
734
1077
  z-index: 1;
735
1078
  }
736
- ._ExternalInputModal-th_157li_83 {
1079
+ ._ExternalInputModal-th_s6fxy_88 {
737
1080
  border-bottom: 1px solid var(--puck-color-grey-8);
738
1081
  border-top: 1px solid var(--puck-color-grey-8);
739
1082
  font-weight: 700;
740
1083
  padding: 16px 24px;
741
1084
  opacity: 0.9;
742
1085
  }
743
- ._ExternalInputModal-td_157li_97 {
1086
+ ._ExternalInputModal-td_s6fxy_102 {
744
1087
  font-family: var(--puck-font-stack);
745
1088
  padding: 16px 24px;
746
1089
  }
747
- ._ExternalInputModal-tr_157li_102:nth-of-type(n) {
1090
+ ._ExternalInputModal-tr_s6fxy_107:nth-of-type(n) {
748
1091
  background-color: white;
749
1092
  }
750
- ._ExternalInputModal-tr_157li_102:nth-of-type(2n) {
1093
+ ._ExternalInputModal-tr_s6fxy_107:nth-of-type(2n) {
751
1094
  background-color: var(--puck-color-grey-10);
752
1095
  }
753
- ._ExternalInputModal-tr_157li_102 ._ExternalInputModal-td_157li_97:first-of-type {
1096
+ ._ExternalInputModal-tr_s6fxy_107 ._ExternalInputModal-td_s6fxy_102:first-of-type {
754
1097
  font-weight: 500;
755
1098
  }
756
- ._ExternalInputModal-tbody_157li_114 ._ExternalInputModal-tr_157li_102:hover {
1099
+ ._ExternalInputModal-tbody_s6fxy_119 ._ExternalInputModal-tr_s6fxy_107:hover {
757
1100
  background: var(--puck-color-grey-11);
758
1101
  color: var(--puck-color-azure-4);
759
1102
  cursor: pointer;
760
1103
  position: relative;
761
1104
  margin-left: -5px;
762
1105
  }
763
- ._ExternalInputModal-tbody_157li_114 ._ExternalInputModal-tr_157li_102:hover ._ExternalInputModal-td_157li_97:first-of-type {
1106
+ ._ExternalInputModal-tbody_s6fxy_119 ._ExternalInputModal-tr_s6fxy_107:hover ._ExternalInputModal-td_s6fxy_102:first-of-type {
764
1107
  border-left: 4px solid var(--puck-color-azure-4);
765
1108
  padding-left: 20px;
766
1109
  }
767
- ._ExternalInputModal-tableWrapper_157li_68 {
1110
+ ._ExternalInputModal-tableWrapper_s6fxy_72 {
768
1111
  display: none;
769
1112
  }
770
- ._ExternalInputModal--hasData_157li_133 ._ExternalInputModal-tableWrapper_157li_68 {
1113
+ ._ExternalInputModal--hasData_s6fxy_138 ._ExternalInputModal-tableWrapper_s6fxy_72 {
771
1114
  display: block;
772
1115
  }
773
- ._ExternalInputModal-loadingBanner_157li_137 {
1116
+ ._ExternalInputModal-loadingBanner_s6fxy_142 {
774
1117
  display: none;
775
- background-color: white;
1118
+ background-color: #ffffff90;
776
1119
  padding: 64px;
777
1120
  align-items: center;
778
1121
  justify-content: center;
1122
+ position: absolute;
1123
+ top: 0;
1124
+ left: 0;
1125
+ right: 0;
1126
+ bottom: 0;
779
1127
  }
780
- ._ExternalInputModal--isLoading_157li_145 ._ExternalInputModal-loadingBanner_157li_137 {
1128
+ ._ExternalInputModal--isLoading_s6fxy_155 ._ExternalInputModal-loadingBanner_s6fxy_142 {
781
1129
  display: flex;
782
1130
  }
783
- ._ExternalInputModal-noContentBanner_157li_149 {
1131
+ ._ExternalInputModal-noContentBanner_s6fxy_159 {
784
1132
  display: none;
1133
+ border-top: 1px solid var(--puck-color-grey-8);
1134
+ padding: 24px;
1135
+ text-align: center;
785
1136
  }
786
- ._ExternalInputModal--loaded_157li_153:not(._ExternalInputModal--hasData_157li_133) ._ExternalInputModal-noContentBanner_157li_149 {
1137
+ ._ExternalInputModal--loaded_s6fxy_166:not(._ExternalInputModal--hasData_s6fxy_138) ._ExternalInputModal-noContentBanner_s6fxy_159 {
787
1138
  display: block;
788
- padding: 24px;
1139
+ }
1140
+ ._ExternalInputModal-searchForm_s6fxy_171 {
1141
+ display: flex;
1142
+ margin-left: auto;
1143
+ height: 43px;
1144
+ gap: 12px;
1145
+ }
1146
+ ._ExternalInputModal-search_s6fxy_171 {
1147
+ display: flex;
1148
+ background: white;
1149
+ border-width: 1px;
1150
+ border-style: solid;
1151
+ border-color: var(--puck-color-grey-8);
1152
+ border-radius: 4px;
1153
+ width: 100%;
1154
+ }
1155
+ ._ExternalInputModal-search_s6fxy_171:focus-within {
1156
+ border-color: var(--puck-color-azure-4);
1157
+ outline: var(--puck-color-azure-8) 4px solid;
1158
+ outline-offset: 0;
1159
+ }
1160
+ ._ExternalInputModal-searchIcon_s6fxy_194 {
1161
+ align-items: center;
1162
+ background: var(--puck-color-grey-11);
1163
+ border-bottom-left-radius: 4px;
1164
+ border-top-left-radius: 4px;
1165
+ border-right: 1px solid var(--puck-color-grey-8);
1166
+ color: var(--puck-color-grey-6);
1167
+ display: flex;
1168
+ justify-content: center;
1169
+ padding: 12px 15px;
1170
+ }
1171
+ ._ExternalInputModal-searchIconText_s6fxy_206 {
1172
+ clip: rect(0 0 0 0);
1173
+ clip-path: inset(100%);
1174
+ height: 1px;
1175
+ overflow: hidden;
1176
+ position: absolute;
1177
+ white-space: nowrap;
1178
+ width: 1px;
1179
+ }
1180
+ ._ExternalInputModal-searchInput_s6fxy_216 {
1181
+ border: none;
1182
+ border-radius: 4px;
1183
+ background: white;
1184
+ font-family: inherit;
1185
+ font-size: 14px;
1186
+ padding: 12px 15px;
1187
+ width: 100%;
1188
+ }
1189
+ ._ExternalInputModal-searchInput_s6fxy_216:focus {
1190
+ border: none;
1191
+ outline: none;
1192
+ box-shadow: none;
789
1193
  }
790
1194
 
791
1195
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Modal/styles.module.css/#css-module-data */
@@ -816,59 +1220,54 @@
816
1220
  max-height: 90vh;
817
1221
  }
818
1222
 
819
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css/#css-module-data */
820
- ._Heading_1bvy5_1 {
821
- display: block;
822
- color: var(--puck-color-black);
823
- font-family: var(--puck-font-stack);
824
- font-weight: 700;
825
- margin: 0;
826
- }
827
- ._Heading_1bvy5_1 b {
828
- font-weight: 700;
829
- }
830
- ._Heading--xxxxl_1bvy5_13 {
831
- font-size: var(--puck-font-size-xxxxl);
832
- letter-spacing: 0.08ch;
833
- font-weight: 800;
834
- }
835
- ._Heading--xxxl_1bvy5_19 {
836
- font-size: var(--puck-font-size-xxxl);
837
- }
838
- ._Heading--xxl_1bvy5_23 {
839
- font-size: var(--puck-font-size-xxl);
840
- }
841
- ._Heading--xl_1bvy5_27 {
842
- font-size: var(--puck-font-size-xl);
843
- }
844
- ._Heading--l_1bvy5_31 {
845
- font-size: var(--puck-font-size-l);
1223
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/InputOrGroup/fields/ObjectField/styles.module.css/#css-module-data */
1224
+ ._ObjectField_56z4t_5 {
1225
+ display: flex;
1226
+ flex-direction: column;
1227
+ background-color: white;
1228
+ border: 1px solid var(--puck-color-grey-8);
1229
+ border-radius: 4px;
846
1230
  }
847
- ._Heading--m_1bvy5_35 {
848
- font-size: var(--puck-font-size-m);
1231
+ ._ObjectField-fieldset_56z4t_13 {
1232
+ border: none;
1233
+ margin: 0;
1234
+ padding: 16px 15px;
849
1235
  }
850
- ._Heading--s_1bvy5_39 {
851
- font-size: var(--puck-font-size-s);
1236
+
1237
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Fields/styles.module.css/#css-module-data */
1238
+ ._PuckFields_1276r_1 {
1239
+ position: relative;
852
1240
  }
853
- ._Heading--xs_1bvy5_43 {
854
- font-size: var(--puck-font-size-xs);
1241
+ ._PuckFields-loadingOverlay_1276r_5 {
1242
+ background: white;
1243
+ display: flex;
1244
+ justify-content: center;
1245
+ align-items: center;
1246
+ height: 100%;
1247
+ width: 100%;
1248
+ top: 0;
1249
+ position: absolute;
1250
+ z-index: 1;
1251
+ pointer-events: all;
1252
+ box-sizing: border-box;
1253
+ opacity: 0.8;
855
1254
  }
856
1255
 
857
1256
  /* css-module:/home/runner/work/puck/puck/packages/core/components/ComponentList/styles.module.css/#css-module-data */
858
- ._ComponentList_1m8r5_1 {
1257
+ ._ComponentList_1di93_1 {
859
1258
  font-family: var(--puck-font-stack);
860
1259
  max-width: 100%;
861
1260
  }
862
- ._ComponentList--isExpanded_1m8r5_6 + ._ComponentList_1m8r5_1 {
1261
+ ._ComponentList--isExpanded_1di93_6 + ._ComponentList_1di93_1 {
863
1262
  margin-top: 12px;
864
1263
  }
865
- ._ComponentList-content_1m8r5_10 {
1264
+ ._ComponentList-content_1di93_10 {
866
1265
  display: none;
867
1266
  }
868
- ._ComponentList--isExpanded_1m8r5_6 > ._ComponentList-content_1m8r5_10 {
1267
+ ._ComponentList--isExpanded_1di93_6 > ._ComponentList-content_1di93_10 {
869
1268
  display: block;
870
1269
  }
871
- ._ComponentList-title_1m8r5_18 {
1270
+ ._ComponentList-title_1di93_18 {
872
1271
  color: var(--puck-color-grey-4);
873
1272
  display: flex;
874
1273
  font-size: var(--puck-font-size-xxxs);
@@ -878,108 +1277,17 @@
878
1277
  gap: 4px;
879
1278
  border-radius: 4px;
880
1279
  }
881
- ._ComponentList--isExpanded_1m8r5_6 ._ComponentList-title_1m8r5_18 {
1280
+ ._ComponentList--isExpanded_1di93_6 ._ComponentList-title_1di93_18 {
882
1281
  margin-bottom: 4px;
883
1282
  }
884
- ._ComponentList-title_1m8r5_18:hover {
1283
+ ._ComponentList-title_1di93_18:hover {
885
1284
  background-color: var(--puck-color-azure-9);
886
1285
  color: var(--puck-color-azure-4);
887
1286
  cursor: pointer;
888
1287
  }
889
- ._ComponentList-titleIcon_1m8r5_39 {
1288
+ ._ComponentList-titleIcon_1di93_39 {
890
1289
  margin-left: auto;
891
1290
  }
892
- ._ComponentListItem_1m8r5_43:last-of-type ._ComponentListItem-draggable_1m8r5_43 {
893
- margin-bottom: 0px;
894
- }
895
- ._ComponentListItem-draggable_1m8r5_43 {
896
- background: white;
897
- padding: 12px;
898
- display: flex;
899
- border: 1px var(--puck-color-grey-8) solid;
900
- border-radius: 4px;
901
- font-size: var(--puck-font-size-xxs);
902
- justify-content: space-between;
903
- align-items: center;
904
- cursor: grab;
905
- margin-bottom: 12px;
906
- }
907
- ._ComponentListItem-name_1m8r5_60 {
908
- overflow-x: hidden;
909
- text-overflow: ellipsis;
910
- white-space: nowrap;
911
- }
912
- ._ComponentList_1m8r5_1:not(._ComponentList--isDraggingFrom_1m8r5_66) ._ComponentListItem-draggable_1m8r5_43:hover {
913
- background-color: var(--puck-color-azure-9);
914
- color: var(--puck-color-azure-4);
915
- }
916
-
917
- /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
918
- ._SidebarSection_1uyg2_1 {
919
- display: flex;
920
- position: relative;
921
- flex-direction: column;
922
- color: black;
923
- }
924
- ._SidebarSection_1uyg2_1:last-of-type {
925
- flex-grow: 1;
926
- }
927
- ._SidebarSection-title_1uyg2_12 {
928
- background: white;
929
- padding: 16px;
930
- border-bottom: 1px solid var(--puck-color-grey-8);
931
- overflow-x: auto;
932
- }
933
- ._SidebarSection-content_1uyg2_19 {
934
- border-bottom: 1px solid var(--puck-color-grey-8);
935
- padding: 16px;
936
- }
937
- ._SidebarSection--noPadding_1uyg2_24 ._SidebarSection-content_1uyg2_19 {
938
- padding: 0px;
939
- }
940
- ._SidebarSection--noPadding_1uyg2_24 ._SidebarSection-content_1uyg2_19:last-child {
941
- padding-bottom: 4px;
942
- }
943
- ._SidebarSection_1uyg2_1:last-of-type ._SidebarSection-content_1uyg2_19 {
944
- border-bottom: none;
945
- flex-grow: 1;
946
- }
947
- ._SidebarSection-breadcrumbLabel_1uyg2_37 {
948
- color: var(--puck-color-azure-3);
949
- flex-shrink: 0;
950
- }
951
- ._SidebarSection-breadcrumbLabel_1uyg2_37:hover {
952
- color: var(--puck-color-azure-4);
953
- cursor: pointer;
954
- text-decoration: underline;
955
- }
956
- ._SidebarSection-breadcrumbs_1uyg2_48 {
957
- align-items: center;
958
- display: flex;
959
- gap: 4px;
960
- }
961
- ._SidebarSection-breadcrumb_1uyg2_37 {
962
- align-items: center;
963
- display: flex;
964
- gap: 4px;
965
- }
966
- ._SidebarSection-heading_1uyg2_60 {
967
- padding-right: 16px;
968
- }
969
- ._SidebarSection-loadingOverlay_1uyg2_64 {
970
- background: white;
971
- display: flex;
972
- justify-content: center;
973
- align-items: center;
974
- height: 100%;
975
- width: 100%;
976
- top: 0;
977
- position: absolute;
978
- z-index: 1;
979
- pointer-events: all;
980
- box-sizing: border-box;
981
- opacity: 0.8;
982
- }
983
1291
 
984
1292
  /* css-module:/home/runner/work/puck/puck/packages/core/components/LayerTree/styles.module.css/#css-module-data */
985
1293
  ._LayerTree_o89yt_1 {
@@ -1071,202 +1379,3 @@
1071
1379
  color: var(--puck-color-grey-7);
1072
1380
  margin-top: 4px;
1073
1381
  }
1074
-
1075
- /* css-module:/home/runner/work/puck/puck/packages/core/components/MenuBar/styles.module.css/#css-module-data */
1076
- ._MenuBar_12sp7_1 {
1077
- background-color: var(--puck-color-white);
1078
- border-bottom: 1px solid var(--puck-color-grey-8);
1079
- display: none;
1080
- left: 0;
1081
- margin-top: 1px;
1082
- padding: 8px 16px;
1083
- position: absolute;
1084
- right: 0;
1085
- top: 100%;
1086
- z-index: 2;
1087
- }
1088
- ._MenuBar--menuOpen_12sp7_14 {
1089
- display: block;
1090
- }
1091
- @media (min-width: 638px) {
1092
- ._MenuBar_12sp7_1 {
1093
- border: none;
1094
- display: block;
1095
- margin-top: 0;
1096
- overflow-y: visible;
1097
- padding: 0;
1098
- position: static;
1099
- }
1100
- }
1101
- ._MenuBar-inner_12sp7_29 {
1102
- align-items: center;
1103
- display: flex;
1104
- flex-wrap: wrap;
1105
- gap: 8px 16px;
1106
- justify-content: flex-end;
1107
- }
1108
- @media (min-width: 638px) {
1109
- ._MenuBar-inner_12sp7_29 {
1110
- display: flex;
1111
- flex-direction: row;
1112
- flex-wrap: nowrap;
1113
- }
1114
- }
1115
- ._MenuBar-history_12sp7_45 {
1116
- display: flex;
1117
- }
1118
-
1119
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css/#css-module-data */
1120
- ._Puck_103k9_19 {
1121
- --puck-frame-width: auto;
1122
- --puck-side-bar-width: 186px;
1123
- --puck-space-px: 16px;
1124
- bottom: 0;
1125
- display: grid;
1126
- grid-template-areas: "header header header" "left editor right";
1127
- grid-template-columns: 0 var(--puck-frame-width) 0;
1128
- grid-template-rows: min-content auto;
1129
- height: 100vh;
1130
- left: 0;
1131
- position: fixed;
1132
- right: 0;
1133
- top: 0;
1134
- }
1135
- ._Puck--leftSideBarVisible_103k9_35 {
1136
- grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) 0;
1137
- }
1138
- ._Puck--rightSideBarVisible_103k9_41 {
1139
- grid-template-columns: 0 var(--puck-frame-width) var(--puck-side-bar-width);
1140
- }
1141
- ._Puck--leftSideBarVisible_103k9_35._Puck--rightSideBarVisible_103k9_41 {
1142
- grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) var(--puck-side-bar-width);
1143
- }
1144
- @media (min-width: 458px) {
1145
- ._Puck_103k9_19 {
1146
- --puck-frame-width: minmax(266px, auto);
1147
- }
1148
- }
1149
- @media (min-width: 638px) {
1150
- ._Puck_103k9_19 {
1151
- --puck-side-bar-width: minmax(186px, 250px);
1152
- }
1153
- }
1154
- @media (min-width: 766px) {
1155
- ._Puck_103k9_19 {
1156
- --puck-frame-width: auto;
1157
- }
1158
- }
1159
- @media (min-width: 990px) {
1160
- ._Puck_103k9_19 {
1161
- --puck-side-bar-width: 256px;
1162
- }
1163
- }
1164
- @media (min-width: 1198px) {
1165
- ._Puck_103k9_19 {
1166
- --puck-side-bar-width: 274px;
1167
- }
1168
- }
1169
- @media (min-width: 1398px) {
1170
- ._Puck_103k9_19 {
1171
- --puck-side-bar-width: 290px;
1172
- }
1173
- }
1174
- @media (min-width: 1598px) {
1175
- ._Puck_103k9_19 {
1176
- --puck-side-bar-width: 320px;
1177
- }
1178
- }
1179
- ._Puck-header_103k9_95 {
1180
- background: var(--puck-color-white);
1181
- border-bottom: 1px solid var(--puck-color-grey-8);
1182
- color: var(--puck-color-black);
1183
- grid-area: header;
1184
- position: relative;
1185
- max-width: 100vw;
1186
- }
1187
- ._Puck-headerInner_103k9_104 {
1188
- align-items: end;
1189
- display: grid;
1190
- gap: var(--puck-space-px);
1191
- grid-template-areas: "left middle right";
1192
- grid-template-columns: 1fr auto 1fr;
1193
- grid-template-rows: auto;
1194
- padding: var(--puck-space-px);
1195
- }
1196
- ._Puck-headerToggle_103k9_114 {
1197
- color: var(--puck-color-grey-4);
1198
- display: flex;
1199
- margin-left: -4px;
1200
- padding-top: 2px;
1201
- }
1202
- ._Puck-rightSideBarToggle_103k9_121 {
1203
- transform: rotate(180deg);
1204
- }
1205
- ._Puck--rightSideBarVisible_103k9_41 ._Puck-rightSideBarToggle_103k9_121,
1206
- ._Puck--leftSideBarVisible_103k9_35 ._Puck-leftSideBarToggle_103k9_126 {
1207
- color: var(--puck-color-black);
1208
- }
1209
- ._Puck-headerTitle_103k9_130 {
1210
- align-self: center;
1211
- }
1212
- ._Puck-headerPath_103k9_134 {
1213
- font-family: var(--puck-font-family-monospaced);
1214
- font-size: var(--puck-font-size-xxs);
1215
- font-weight: normal;
1216
- word-break: break-all;
1217
- }
1218
- ._Puck-headerTools_103k9_141 {
1219
- display: flex;
1220
- gap: 16px;
1221
- justify-content: flex-end;
1222
- }
1223
- ._Puck-menuButton_103k9_147 {
1224
- color: var(--puck-color-grey-4);
1225
- margin-left: -4px;
1226
- }
1227
- ._Puck--menuOpen_103k9_152 ._Puck-menuButton_103k9_147 {
1228
- color: var(--puck-color-black);
1229
- }
1230
- @media (min-width: 638px) {
1231
- ._Puck-menuButton_103k9_147 {
1232
- display: none;
1233
- }
1234
- }
1235
- ._Puck-leftSideBar_103k9_126 {
1236
- background: var(--puck-color-grey-11);
1237
- border-right: 1px solid var(--puck-color-grey-8);
1238
- display: flex;
1239
- flex-direction: column;
1240
- grid-area: left;
1241
- overflow-y: auto;
1242
- }
1243
- ._Puck-frame_103k9_171 {
1244
- display: flex;
1245
- flex-direction: column;
1246
- grid-area: editor;
1247
- overflow: auto;
1248
- position: relative;
1249
- }
1250
- ._Puck-root_103k9_179 {
1251
- box-shadow: 0 0 0 calc(var(--puck-space-px) * 2) var(--puck-color-grey-10);
1252
- margin: var(--puck-space-px);
1253
- min-width: 321px;
1254
- zoom: 0.75;
1255
- }
1256
- @media (min-width: 1198px) {
1257
- ._Puck-root_103k9_179 {
1258
- margin: calc(var(--puck-space-px) * 2);
1259
- }
1260
- }
1261
- ._Puck-page_103k9_192 {
1262
- border: 1px solid var(--puck-color-grey-8);
1263
- }
1264
- ._Puck-rightSideBar_103k9_121 {
1265
- background: var(--puck-color-white);
1266
- border-left: 1px solid var(--puck-color-grey-8);
1267
- display: flex;
1268
- flex-direction: column;
1269
- font-family: var(--puck-font-stack);
1270
- grid-area: right;
1271
- overflow-y: auto;
1272
- }