@measured/puck 0.17.0-canary.8ea38c3 → 0.17.0-canary.c3557ab

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
@@ -135,6 +135,9 @@
135
135
  }
136
136
 
137
137
  /* styles.css */
138
+ #frame-root {
139
+ height: 100vh;
140
+ }
138
141
 
139
142
  /* css-module:/home/runner/work/puck/puck/packages/core/components/ActionBar/styles.module.css/#css-module-data */
140
143
  ._ActionBar_151w5_1 {
@@ -204,27 +207,27 @@
204
207
  }
205
208
 
206
209
  /* css-module:/home/runner/work/puck/puck/packages/core/components/AutoField/styles.module.css/#css-module-data */
207
- ._Input_3pq3z_1 {
210
+ ._InputWrapper_1l5m8_1 {
208
211
  color: var(--puck-color-grey-04);
209
212
  padding: 16px;
210
213
  padding-bottom: 12px;
211
214
  display: block;
212
215
  }
213
- ._Input_3pq3z_1 ._Input_3pq3z_1 {
216
+ ._InputWrapper_1l5m8_1 + ._InputWrapper_1l5m8_1 {
217
+ border-top: 1px solid var(--puck-color-grey-09);
218
+ margin-top: 8px;
219
+ }
220
+ ._Input_1l5m8_1 ._InputWrapper_1l5m8_1 {
214
221
  padding: 0px;
215
222
  }
216
- ._Input_3pq3z_1 * {
223
+ ._Input_1l5m8_1 * {
217
224
  box-sizing: border-box;
218
225
  }
219
- ._Input_3pq3z_1 + ._Input_3pq3z_1 {
220
- border-top: 1px solid var(--puck-color-grey-09);
221
- margin-top: 8px;
222
- }
223
- ._Input_3pq3z_1 ._Input_3pq3z_1 + ._Input_3pq3z_1 {
226
+ ._Input_1l5m8_1 ._InputWrapper_1l5m8_1 + ._InputWrapper_1l5m8_1 {
224
227
  border-top: 0px;
225
228
  margin-top: 12px;
226
229
  }
227
- ._Input-label_3pq3z_26 {
230
+ ._Input-label_1l5m8_26 {
228
231
  align-items: center;
229
232
  color: var(--puck-color-grey-04);
230
233
  display: flex;
@@ -232,17 +235,17 @@
232
235
  font-size: var(--puck-font-size-xxs);
233
236
  font-weight: 600;
234
237
  }
235
- ._Input-labelIcon_3pq3z_35 {
238
+ ._Input-labelIcon_1l5m8_35 {
236
239
  color: var(--puck-color-grey-07);
237
240
  display: flex;
238
241
  margin-right: 4px;
239
242
  padding-left: 4px;
240
243
  }
241
- ._Input-disabledIcon_3pq3z_42 {
244
+ ._Input-disabledIcon_1l5m8_42 {
242
245
  color: var(--puck-color-grey-05);
243
246
  margin-left: auto;
244
247
  }
245
- ._Input-input_3pq3z_47 {
248
+ ._Input-input_1l5m8_47 {
246
249
  background: var(--puck-color-white);
247
250
  border-width: 1px;
248
251
  border-style: solid;
@@ -254,7 +257,7 @@
254
257
  transition: border-color 50ms ease-in;
255
258
  width: 100%;
256
259
  }
257
- select._Input-input_3pq3z_47 {
260
+ select._Input-input_1l5m8_47 {
258
261
  appearance: none;
259
262
  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;
260
263
  background-size: 12px;
@@ -264,25 +267,25 @@ select._Input-input_3pq3z_47 {
264
267
  cursor: pointer;
265
268
  }
266
269
  @media (hover: hover) and (pointer: fine) {
267
- ._Input_3pq3z_1:has(> input):hover ._Input-input_3pq3z_47:not([readonly]),
268
- ._Input_3pq3z_1:has(> textarea):hover ._Input-input_3pq3z_47:not([readonly]) {
270
+ ._Input_1l5m8_1:has(> input):hover ._Input-input_1l5m8_47:not([readonly]),
271
+ ._Input_1l5m8_1:has(> textarea):hover ._Input-input_1l5m8_47:not([readonly]) {
269
272
  border-color: var(--puck-color-grey-05);
270
273
  transition: none;
271
274
  }
272
- ._Input_3pq3z_1:has(> select):hover ._Input-input_3pq3z_47:not([disabled]) {
275
+ ._Input_1l5m8_1:has(> select):hover ._Input-input_1l5m8_47:not([disabled]) {
273
276
  background-color: var(--puck-color-azure-12);
274
277
  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>");
275
278
  border-color: var(--puck-color-grey-05);
276
279
  transition: none;
277
280
  }
278
281
  }
279
- ._Input-input_3pq3z_47:focus {
282
+ ._Input-input_1l5m8_47:focus {
280
283
  border-color: var(--puck-color-grey-05);
281
284
  outline: 2px solid var(--puck-color-azure-05);
282
285
  transition: none;
283
286
  }
284
- ._Input--readOnly_3pq3z_91 > ._Input-input_3pq3z_47,
285
- ._Input--readOnly_3pq3z_91 > select._Input-input_3pq3z_47 {
287
+ ._Input--readOnly_1l5m8_91 > ._Input-input_1l5m8_47,
288
+ ._Input--readOnly_1l5m8_91 > select._Input-input_1l5m8_47 {
286
289
  background-color: var(--puck-color-grey-11);
287
290
  border-color: var(--puck-color-grey-09);
288
291
  color: var(--puck-color-grey-04);
@@ -291,34 +294,34 @@ select._Input-input_3pq3z_47 {
291
294
  outline: 0;
292
295
  transition: none;
293
296
  }
294
- ._Input-radioGroupItems_3pq3z_102 {
297
+ ._Input-radioGroupItems_1l5m8_102 {
295
298
  display: flex;
296
299
  border: 1px solid var(--puck-color-grey-09);
297
300
  border-radius: 4px;
298
301
  flex-wrap: wrap;
299
302
  }
300
- ._Input-radio_3pq3z_102 {
303
+ ._Input-radio_1l5m8_102 {
301
304
  border-right: 1px solid var(--puck-color-grey-09);
302
305
  flex-grow: 1;
303
306
  }
304
- ._Input-radio_3pq3z_102:first-of-type {
307
+ ._Input-radio_1l5m8_102:first-of-type {
305
308
  border-bottom-left-radius: 4px;
306
309
  border-top-left-radius: 4px;
307
310
  }
308
- ._Input-radio_3pq3z_102:first-of-type ._Input-radioInner_3pq3z_119 {
311
+ ._Input-radio_1l5m8_102:first-of-type ._Input-radioInner_1l5m8_119 {
309
312
  border-bottom-left-radius: 3px;
310
313
  border-top-left-radius: 3px;
311
314
  }
312
- ._Input-radio_3pq3z_102:last-of-type {
315
+ ._Input-radio_1l5m8_102:last-of-type {
313
316
  border-bottom-right-radius: 4px;
314
317
  border-right: 0;
315
318
  border-top-right-radius: 4px;
316
319
  }
317
- ._Input-radio_3pq3z_102:last-of-type ._Input-radioInner_3pq3z_119 {
320
+ ._Input-radio_1l5m8_102:last-of-type ._Input-radioInner_1l5m8_119 {
318
321
  border-bottom-right-radius: 3px;
319
322
  border-top-right-radius: 3px;
320
323
  }
321
- ._Input-radioInner_3pq3z_119 {
324
+ ._Input-radioInner_1l5m8_119 {
322
325
  background-color: var(--puck-color-white);
323
326
  color: var(--puck-color-grey-04);
324
327
  cursor: pointer;
@@ -327,32 +330,32 @@ select._Input-input_3pq3z_47 {
327
330
  text-align: center;
328
331
  transition: background-color 50ms ease-in;
329
332
  }
330
- ._Input-radio_3pq3z_102:has(:focus-visible) {
333
+ ._Input-radio_1l5m8_102:has(:focus-visible) {
331
334
  outline: 2px solid var(--puck-color-azure-05);
332
335
  outline-offset: 2px;
333
336
  position: relative;
334
337
  }
335
338
  @media (hover: hover) and (pointer: fine) {
336
- ._Input-radioInner_3pq3z_119:hover {
339
+ ._Input-radioInner_1l5m8_119:hover {
337
340
  background-color: var(--puck-color-azure-12);
338
341
  transition: none;
339
342
  }
340
343
  }
341
- ._Input--readOnly_3pq3z_91 ._Input-radioInner_3pq3z_119 {
344
+ ._Input--readOnly_1l5m8_91 ._Input-radioInner_1l5m8_119 {
342
345
  background-color: var(--puck-color-white);
343
346
  color: var(--puck-color-grey-04);
344
347
  cursor: default;
345
348
  }
346
- ._Input-radio_3pq3z_102 ._Input-radioInput_3pq3z_164:checked ~ ._Input-radioInner_3pq3z_119 {
349
+ ._Input-radio_1l5m8_102 ._Input-radioInput_1l5m8_164:checked ~ ._Input-radioInner_1l5m8_119 {
347
350
  background-color: var(--puck-color-azure-11);
348
351
  color: var(--puck-color-azure-04);
349
352
  font-weight: 500;
350
353
  }
351
- ._Input--readOnly_3pq3z_91 ._Input-radioInput_3pq3z_164:checked ~ ._Input-radioInner_3pq3z_119 {
354
+ ._Input--readOnly_1l5m8_91 ._Input-radioInput_1l5m8_164:checked ~ ._Input-radioInner_1l5m8_119 {
352
355
  background-color: var(--puck-color-grey-11);
353
356
  color: var(--puck-color-grey-04);
354
357
  }
355
- ._Input-radio_3pq3z_102 ._Input-radioInput_3pq3z_164 {
358
+ ._Input-radio_1l5m8_102 ._Input-radioInput_1l5m8_164 {
356
359
  clip: rect(0 0 0 0);
357
360
  clip-path: inset(100%);
358
361
  height: 1px;
@@ -361,7 +364,7 @@ select._Input-input_3pq3z_47 {
361
364
  white-space: nowrap;
362
365
  width: 1px;
363
366
  }
364
- textarea._Input-input_3pq3z_47 {
367
+ textarea._Input-input_1l5m8_47 {
365
368
  margin-bottom: -4px;
366
369
  }
367
370
 
@@ -607,10 +610,10 @@ textarea._Input-input_3pq3z_47 {
607
610
  }
608
611
 
609
612
  /* css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css/#css-module-data */
610
- ._ExternalInput-actions_wprq3_1 {
613
+ ._ExternalInput-actions_8wgzm_1 {
611
614
  display: flex;
612
615
  }
613
- ._ExternalInput-button_wprq3_5 {
616
+ ._ExternalInput-button_8wgzm_5 {
614
617
  display: flex;
615
618
  gap: 8px;
616
619
  align-items: center;
@@ -628,16 +631,16 @@ textarea._Input-input_3pq3z_47 {
628
631
  overflow: hidden;
629
632
  flex-grow: 1;
630
633
  }
631
- ._ExternalInput--dataSelected_wprq3_24 ._ExternalInput-button_wprq3_5 {
634
+ ._ExternalInput--dataSelected_8wgzm_24 ._ExternalInput-button_8wgzm_5 {
632
635
  color: var(--puck-color-grey-03);
633
636
  display: block;
634
637
  border-top-right-radius: 0px;
635
638
  border-bottom-right-radius: 0px;
636
639
  }
637
- ._ExternalInput--readOnly_wprq3_31 ._ExternalInput-button_wprq3_5 {
640
+ ._ExternalInput--readOnly_8wgzm_31 ._ExternalInput-button_8wgzm_5 {
638
641
  background-color: var(--puck-color-grey-11);
639
642
  }
640
- ._ExternalInput-detachButton_wprq3_35 {
643
+ ._ExternalInput-detachButton_8wgzm_35 {
641
644
  border: 1px solid var(--puck-color-grey-09);
642
645
  border-top-right-radius: 4px;
643
646
  border-bottom-right-radius: 4px;
@@ -652,28 +655,28 @@ textarea._Input-input_3pq3z_47 {
652
655
  transition: background-color 50ms ease-in, color 50ms ease-in;
653
656
  margin-left: -1px;
654
657
  }
655
- ._ExternalInput-button_wprq3_5:focus-visible,
656
- ._ExternalInput-detachButton_wprq3_35:focus-visible {
658
+ ._ExternalInput-button_8wgzm_5:focus-visible,
659
+ ._ExternalInput-detachButton_8wgzm_35:focus-visible {
657
660
  outline: 2px solid var(--puck-color-azure-05);
658
661
  outline-offset: 2px;
659
662
  z-index: 1;
660
663
  }
661
664
  @media (hover: hover) and (pointer: fine) {
662
- ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-button_wprq3_5:hover,
663
- ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-detachButton_wprq3_35:hover {
665
+ ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-button_8wgzm_5:hover,
666
+ ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-detachButton_8wgzm_35:hover {
664
667
  background: var(--puck-color-azure-12);
665
668
  transition: none;
666
669
  }
667
- ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-detachButton_wprq3_35:hover {
670
+ ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-detachButton_8wgzm_35:hover {
668
671
  color: var(--puck-color-azure-04);
669
672
  }
670
673
  }
671
- ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-button_wprq3_5:active,
672
- ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-detachButton_wprq3_35:active {
674
+ ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-button_8wgzm_5:active,
675
+ ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-detachButton_8wgzm_35:active {
673
676
  background: var(--puck-color-azure-11);
674
677
  transition: none;
675
678
  }
676
- ._ExternalInputModal_wprq3_79 {
679
+ ._ExternalInputModal_8wgzm_79 {
677
680
  color: var(--puck-color-black);
678
681
  display: grid;
679
682
  grid-template-rows: min-content minmax(128px, 100%) min-content;
@@ -682,35 +685,35 @@ textarea._Input-input_3pq3z_47 {
682
685
  min-height: 50dvh;
683
686
  max-height: 90dvh;
684
687
  }
685
- ._ExternalInputModal-grid_wprq3_89 {
688
+ ._ExternalInputModal-grid_8wgzm_89 {
686
689
  display: flex;
687
690
  flex-direction: column;
688
691
  }
689
692
  @media (min-width: 458px) {
690
- ._ExternalInputModal-grid_wprq3_89 {
693
+ ._ExternalInputModal-grid_8wgzm_89 {
691
694
  display: grid;
692
695
  grid-template-columns: 100%;
693
696
  }
694
- ._ExternalInputModal--filtersToggled_wprq3_100 ._ExternalInputModal-grid_wprq3_89 {
697
+ ._ExternalInputModal--filtersToggled_8wgzm_100 ._ExternalInputModal-grid_8wgzm_89 {
695
698
  grid-template-columns: 25% 75%;
696
699
  }
697
700
  }
698
- ._ExternalInputModal-filters_wprq3_105 {
701
+ ._ExternalInputModal-filters_8wgzm_105 {
699
702
  border-bottom: 1px solid var(--puck-color-grey-09);
700
703
  }
701
- ._ExternalInputModal--filtersToggled_wprq3_100 ._ExternalInputModal-filters_wprq3_105 {
704
+ ._ExternalInputModal--filtersToggled_8wgzm_100 ._ExternalInputModal-filters_8wgzm_105 {
702
705
  display: none;
703
706
  }
704
707
  @media (min-width: 458px) {
705
- ._ExternalInputModal-filters_wprq3_105 {
708
+ ._ExternalInputModal-filters_8wgzm_105 {
706
709
  border-right: 1px solid var(--puck-color-grey-09);
707
710
  display: none;
708
711
  }
709
- ._ExternalInputModal--filtersToggled_wprq3_100 ._ExternalInputModal-filters_wprq3_105 {
712
+ ._ExternalInputModal--filtersToggled_8wgzm_100 ._ExternalInputModal-filters_8wgzm_105 {
710
713
  display: block;
711
714
  }
712
715
  }
713
- ._ExternalInputModal-masthead_wprq3_124 {
716
+ ._ExternalInputModal-masthead_8wgzm_124 {
714
717
  background-color: var(--puck-color-grey-12);
715
718
  border-bottom: 1px solid var(--puck-color-grey-09);
716
719
  display: flex;
@@ -718,13 +721,13 @@ textarea._Input-input_3pq3z_47 {
718
721
  gap: 24px;
719
722
  padding: 24px;
720
723
  }
721
- ._ExternalInputModal-tableWrapper_wprq3_133 {
724
+ ._ExternalInputModal-tableWrapper_8wgzm_133 {
722
725
  position: relative;
723
726
  overflow-x: auto;
724
727
  overflow-y: auto;
725
728
  flex-grow: 1;
726
729
  }
727
- ._ExternalInputModal-table_wprq3_133 {
730
+ ._ExternalInputModal-table_8wgzm_133 {
728
731
  border-collapse: unset;
729
732
  border-spacing: 0px;
730
733
  color: var(--puck-color-grey-02);
@@ -732,51 +735,51 @@ textarea._Input-input_3pq3z_47 {
732
735
  z-index: 0;
733
736
  min-width: 100%;
734
737
  }
735
- ._ExternalInputModal-thead_wprq3_149 {
738
+ ._ExternalInputModal-thead_8wgzm_149 {
736
739
  background-color: var(--puck-color-white);
737
740
  position: sticky;
738
741
  top: 0;
739
742
  z-index: 1;
740
743
  }
741
- ._ExternalInputModal-th_wprq3_149 {
744
+ ._ExternalInputModal-th_8wgzm_149 {
742
745
  border-bottom: 1px solid var(--puck-color-grey-09);
743
746
  color: var(--puck-color-grey-04);
744
747
  font-weight: 500;
745
748
  font-size: 14px;
746
749
  padding: 16px 24px;
747
750
  }
748
- ._ExternalInputModal-td_wprq3_164 {
751
+ ._ExternalInputModal-td_8wgzm_164 {
749
752
  border-bottom: 1px solid var(--puck-color-grey-10);
750
753
  padding: 16px 24px;
751
754
  }
752
- ._ExternalInputModal-tr_wprq3_169 ._ExternalInputModal-td_wprq3_164:first-of-type {
755
+ ._ExternalInputModal-tr_8wgzm_169 ._ExternalInputModal-td_8wgzm_164:first-of-type {
753
756
  font-weight: 500;
754
757
  width: 1%;
755
758
  white-space: nowrap;
756
759
  }
757
760
  @media (hover: hover) and (pointer: fine) {
758
- ._ExternalInputModal-tbody_wprq3_176 ._ExternalInputModal-tr_wprq3_169:hover {
761
+ ._ExternalInputModal-tbody_8wgzm_176 ._ExternalInputModal-tr_8wgzm_169:hover {
759
762
  background: var(--puck-color-azure-12);
760
763
  color: var(--puck-color-azure-04);
761
764
  cursor: pointer;
762
765
  position: relative;
763
766
  margin-left: -5px;
764
767
  }
765
- ._ExternalInputModal-tbody_wprq3_176 ._ExternalInputModal-tr_wprq3_169:hover ._ExternalInputModal-td_wprq3_164:first-of-type {
768
+ ._ExternalInputModal-tbody_8wgzm_176 ._ExternalInputModal-tr_8wgzm_169:hover ._ExternalInputModal-td_8wgzm_164:first-of-type {
766
769
  border-left: 4px solid var(--puck-color-azure-04);
767
770
  padding-left: 20px;
768
771
  }
769
772
  }
770
- ._ExternalInputModal-tbody_wprq3_176 ._ExternalInputModal-tr_wprq3_169:last-of-type ._ExternalInputModal-td_wprq3_164 {
773
+ ._ExternalInputModal-tbody_8wgzm_176 ._ExternalInputModal-tr_8wgzm_169:last-of-type ._ExternalInputModal-td_8wgzm_164 {
771
774
  border-bottom: none;
772
775
  }
773
- ._ExternalInputModal-tableWrapper_wprq3_133 {
776
+ ._ExternalInputModal-tableWrapper_8wgzm_133 {
774
777
  display: none;
775
778
  }
776
- ._ExternalInputModal--hasData_wprq3_202 ._ExternalInputModal-tableWrapper_wprq3_133 {
779
+ ._ExternalInputModal--hasData_8wgzm_202 ._ExternalInputModal-tableWrapper_8wgzm_133 {
777
780
  display: block;
778
781
  }
779
- ._ExternalInputModal-loadingBanner_wprq3_206 {
782
+ ._ExternalInputModal-loadingBanner_8wgzm_206 {
780
783
  display: none;
781
784
  background-color: color-mix(in srgb, var(--puck-color-white) 90%, transparent);
782
785
  padding: 64px;
@@ -788,21 +791,21 @@ textarea._Input-input_3pq3z_47 {
788
791
  right: 0;
789
792
  bottom: 0;
790
793
  }
791
- ._ExternalInputModal--isLoading_wprq3_223 ._ExternalInputModal-loadingBanner_wprq3_206 {
794
+ ._ExternalInputModal--isLoading_8wgzm_223 ._ExternalInputModal-loadingBanner_8wgzm_206 {
792
795
  display: flex;
793
796
  }
794
- ._ExternalInputModal-searchForm_wprq3_227 {
797
+ ._ExternalInputModal-searchForm_8wgzm_227 {
795
798
  display: flex;
796
799
  flex-wrap: wrap;
797
800
  gap: 12px;
798
801
  flex-grow: 1;
799
802
  }
800
803
  @media (min-width: 458px) {
801
- ._ExternalInputModal-searchForm_wprq3_227 {
804
+ ._ExternalInputModal-searchForm_8wgzm_227 {
802
805
  flex-wrap: nowrap;
803
806
  }
804
807
  }
805
- ._ExternalInputModal-search_wprq3_227 {
808
+ ._ExternalInputModal-search_8wgzm_227 {
806
809
  display: flex;
807
810
  background: var(--puck-color-white);
808
811
  border-width: 1px;
@@ -812,18 +815,18 @@ textarea._Input-input_3pq3z_47 {
812
815
  flex-grow: 1;
813
816
  transition: border-color 50ms ease-in;
814
817
  }
815
- ._ExternalInputModal-search_wprq3_227:focus-within {
818
+ ._ExternalInputModal-search_8wgzm_227:focus-within {
816
819
  border-color: var(--puck-color-grey-05);
817
820
  outline: 2px solid var(--puck-color-azure-05);
818
821
  transition: none;
819
822
  }
820
823
  @media (hover: hover) and (pointer: fine) {
821
- ._ExternalInputModal-search_wprq3_227:hover {
824
+ ._ExternalInputModal-search_8wgzm_227:hover {
822
825
  border-color: var(--puck-color-grey-05);
823
826
  transition: none;
824
827
  }
825
828
  }
826
- ._ExternalInputModal-searchIcon_wprq3_264 {
829
+ ._ExternalInputModal-searchIcon_8wgzm_264 {
827
830
  align-items: center;
828
831
  background: var(--puck-color-grey-12);
829
832
  border-bottom-left-radius: 4px;
@@ -835,17 +838,17 @@ textarea._Input-input_3pq3z_47 {
835
838
  padding: 12px 15px;
836
839
  transition: color 50ms ease-in;
837
840
  }
838
- ._ExternalInputModal-search_wprq3_227:focus-within ._ExternalInputModal-searchIcon_wprq3_264 {
841
+ ._ExternalInputModal-search_8wgzm_227:focus-within ._ExternalInputModal-searchIcon_8wgzm_264 {
839
842
  color: var(--puck-color-grey-04);
840
843
  transition: none;
841
844
  }
842
845
  @media (hover: hover) and (pointer: fine) {
843
- ._ExternalInputModal-search_wprq3_227:hover ._ExternalInputModal-searchIcon_wprq3_264 {
846
+ ._ExternalInputModal-search_8wgzm_227:hover ._ExternalInputModal-searchIcon_8wgzm_264 {
844
847
  color: var(--puck-color-grey-04);
845
848
  transition: none;
846
849
  }
847
850
  }
848
- ._ExternalInputModal-searchIconText_wprq3_289 {
851
+ ._ExternalInputModal-searchIconText_8wgzm_289 {
849
852
  clip: rect(0 0 0 0);
850
853
  clip-path: inset(100%);
851
854
  height: 1px;
@@ -854,7 +857,7 @@ textarea._Input-input_3pq3z_47 {
854
857
  white-space: nowrap;
855
858
  width: 1px;
856
859
  }
857
- ._ExternalInputModal-searchInput_wprq3_299 {
860
+ ._ExternalInputModal-searchInput_8wgzm_299 {
858
861
  border: none;
859
862
  border-radius: 4px;
860
863
  background: var(--puck-color-white);
@@ -863,30 +866,32 @@ textarea._Input-input_3pq3z_47 {
863
866
  padding: 12px 15px;
864
867
  width: 100%;
865
868
  }
866
- ._ExternalInputModal-searchInput_wprq3_299:focus {
869
+ ._ExternalInputModal-searchInput_8wgzm_299:focus {
867
870
  outline: 0;
868
871
  }
869
- ._ExternalInputModal-searchActions_wprq3_313 {
872
+ ._ExternalInputModal-searchActions_8wgzm_313 {
870
873
  display: flex;
871
874
  gap: 8px;
872
875
  height: 44px;
873
876
  width: 100%;
874
877
  }
875
878
  @media (min-width: 458px) {
876
- ._ExternalInputModal-searchActions_wprq3_313 {
879
+ ._ExternalInputModal-searchActions_8wgzm_313 {
877
880
  width: auto;
878
881
  }
879
882
  }
880
- ._ExternalInputModal-searchActionIcon_wprq3_326 {
883
+ ._ExternalInputModal-searchActionIcon_8wgzm_326 {
881
884
  align-self: center;
882
885
  }
883
- ._ExternalInputModal-footer_wprq3_330 {
886
+ ._ExternalInputModal-footerContainer_8wgzm_330 {
884
887
  background-color: var(--puck-color-grey-12);
885
888
  border-top: 1px solid var(--puck-color-grey-09);
886
889
  color: var(--puck-color-grey-04);
890
+ padding: 16px;
891
+ }
892
+ ._ExternalInputModal-footer_8wgzm_330 {
887
893
  font-weight: 500;
888
894
  font-size: 14px;
889
- padding: 16px;
890
895
  text-align: right;
891
896
  }
892
897
 
@@ -1060,21 +1065,13 @@ textarea._Input-input_3pq3z_47 {
1060
1065
  }
1061
1066
 
1062
1067
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Drawer/styles.module.css/#css-module-data */
1063
- ._Drawer_1oa7v_1 {
1068
+ ._Drawer_1pb1t_1 {
1069
+ display: flex;
1070
+ flex-direction: column;
1064
1071
  font-family: var(--puck-font-family);
1072
+ gap: 12px;
1065
1073
  }
1066
- ._DrawerItem--disabled_1oa7v_5 ._DrawerItem-draggable_1oa7v_5 {
1067
- background: var(--puck-color-grey-11);
1068
- color: var(--puck-color-grey-05);
1069
- cursor: not-allowed;
1070
- }
1071
- ._DrawerItem-default_1oa7v_11 ._DrawerItem-draggableWrapper_1oa7v_11 {
1072
- padding-bottom: 12px;
1073
- }
1074
- ._DrawerItem_1oa7v_5:last-of-type ._DrawerItem-default_1oa7v_11 ._DrawerItem-draggableWrapper_1oa7v_11 {
1075
- padding-bottom: 0;
1076
- }
1077
- ._DrawerItem-draggable_1oa7v_5 {
1074
+ ._DrawerItem-draggable_1pb1t_8 {
1078
1075
  background: var(--puck-color-white);
1079
1076
  padding: 12px;
1080
1077
  display: flex;
@@ -1085,64 +1082,58 @@ textarea._Input-input_3pq3z_47 {
1085
1082
  align-items: center;
1086
1083
  transition: background-color 50ms ease-in, color 50ms ease-in;
1087
1084
  }
1088
- ._DrawerItem_1oa7v_5:focus-visible {
1085
+ ._DrawerItem--disabled_1pb1t_20 ._DrawerItem-draggable_1pb1t_8 {
1086
+ background: var(--puck-color-grey-11);
1087
+ color: var(--puck-color-grey-05);
1088
+ cursor: not-allowed;
1089
+ }
1090
+ ._DrawerItem_1pb1t_8:focus-visible {
1089
1091
  outline: 0;
1090
1092
  }
1091
- ._Drawer_1oa7v_1:not(._Drawer--isDraggingFrom_1oa7v_36) ._DrawerItem_1oa7v_5:focus-visible ._DrawerItem-draggable_1oa7v_5 {
1093
+ ._Drawer_1pb1t_1:not(._Drawer--isDraggingFrom_1pb1t_30) ._DrawerItem_1pb1t_8:focus-visible ._DrawerItem-draggable_1pb1t_8 {
1092
1094
  border-radius: 4px;
1093
1095
  outline: 2px solid var(--puck-color-azure-05);
1094
1096
  outline-offset: 2px;
1095
1097
  }
1096
1098
  @media (hover: hover) and (pointer: fine) {
1097
- ._Drawer_1oa7v_1:not(._Drawer--isDraggingFrom_1oa7v_36) ._DrawerItem_1oa7v_5:not(._DrawerItem--disabled_1oa7v_5) ._DrawerItem-draggable_1oa7v_5:hover {
1099
+ ._Drawer_1pb1t_1:not(._Drawer--isDraggingFrom_1pb1t_30) ._DrawerItem_1pb1t_8:not(._DrawerItem--disabled_1pb1t_20) ._DrawerItem-draggable_1pb1t_8:hover {
1098
1100
  background-color: var(--puck-color-azure-12);
1099
1101
  color: var(--puck-color-azure-04);
1100
1102
  transition: none;
1101
1103
  }
1102
1104
  }
1103
- ._DrawerItem-name_1oa7v_54 {
1105
+ ._DrawerItem-name_1pb1t_48 {
1104
1106
  overflow-x: hidden;
1105
1107
  text-overflow: ellipsis;
1106
1108
  white-space: nowrap;
1107
1109
  }
1108
1110
 
1109
1111
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
1110
- ._DraggableComponent_1bhad_1 {
1111
- pointer-events: auto;
1112
- --overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
1113
- }
1114
- ._DraggableComponent--isDragging_1bhad_11 {
1115
- background: color-mix(in srgb, var(--puck-color-azure-08) 10%, transparent);
1116
- overflow: hidden;
1117
- }
1118
- ._DraggableComponent-contents_1bhad_16 {
1119
- position: relative;
1112
+ ._DraggableComponent_lchn0_1 {
1113
+ opacity: 0;
1114
+ position: absolute;
1120
1115
  pointer-events: none;
1121
- z-index: 0;
1116
+ --overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
1122
1117
  }
1123
- ._DraggableComponent-contents_1bhad_16::before,
1124
- ._DraggableComponent-contents_1bhad_16::after {
1125
- content: " ";
1126
- display: table;
1118
+ ._DraggableComponent--isReady_lchn0_13 {
1119
+ opacity: 1;
1127
1120
  }
1128
- ._DraggableComponent-overlay_1bhad_29 {
1121
+ ._DraggableComponent-overlay_lchn0_17 {
1129
1122
  cursor: pointer;
1130
1123
  height: 100%;
1131
1124
  width: 100%;
1132
1125
  top: 0;
1126
+ outline: 2px var(--puck-color-azure-09) solid;
1133
1127
  outline-offset: -2px;
1134
1128
  position: absolute;
1135
1129
  pointer-events: none;
1136
1130
  box-sizing: border-box;
1137
1131
  z-index: 1;
1138
1132
  }
1139
- ._DraggableComponent_1bhad_1:focus-visible > ._DraggableComponent-overlay_1bhad_29 {
1133
+ ._DraggableComponent_lchn0_1:focus-visible > ._DraggableComponent-overlay_lchn0_17 {
1140
1134
  outline: 1px solid var(--puck-color-azure-05);
1141
1135
  }
1142
- ._DraggableComponent--isDragging_1bhad_11 > ._DraggableComponent-overlay_1bhad_29 {
1143
- outline: 2px var(--puck-color-azure-09) solid !important;
1144
- }
1145
- ._DraggableComponent-loadingOverlay_1bhad_49 {
1136
+ ._DraggableComponent-loadingOverlay_lchn0_34 {
1146
1137
  background: var(--puck-color-white);
1147
1138
  color: var(--puck-color-grey-03);
1148
1139
  border-radius: 4px;
@@ -1157,89 +1148,82 @@ textarea._Input-input_3pq3z_47 {
1157
1148
  opacity: 0.8;
1158
1149
  z-index: 1;
1159
1150
  }
1160
- ._DraggableComponent_1bhad_1:hover:not(._DraggableComponent--isLocked_1bhad_65) > ._DraggableComponent-overlay_1bhad_29 {
1151
+ ._DraggableComponent--hover_lchn0_50:not(._DraggableComponent--isLocked_lchn0_50) > ._DraggableComponent-overlay_lchn0_17 {
1161
1152
  background: var(--overlay-background);
1162
- pointer-events: none;
1163
1153
  }
1164
- ._DraggableComponent--forceHover_1bhad_71 > ._DraggableComponent-overlay_1bhad_29 {
1165
- background: var(--overlay-background);
1166
- pointer-events: none;
1154
+ ._DraggableComponent--hover_lchn0_50 > ._DraggableComponent-overlay_lchn0_17 {
1155
+ outline: 2px var(--puck-color-azure-09) solid;
1167
1156
  }
1168
- ._DraggableComponent_1bhad_1:not(._DraggableComponent--isSelected_1bhad_76):hover > ._DraggableComponent-overlay_1bhad_29 {
1169
- outline: 2px var(--puck-color-azure-09) solid !important;
1157
+ ._DraggableComponent--isSelected_lchn0_59 > ._DraggableComponent-overlay_lchn0_17 {
1158
+ outline-color: var(--puck-color-azure-07);
1170
1159
  }
1171
- ._DraggableComponent--indicativeHover_1bhad_81 > ._DraggableComponent-overlay_1bhad_29 {
1172
- pointer-events: none;
1173
- }
1174
- ._DraggableComponent_1bhad_1:not(._DraggableComponent--isSelected_1bhad_76):has(._DraggableComponent_1bhad_1:hover > ._DraggableComponent-overlay_1bhad_29) > ._DraggableComponent-overlay_1bhad_29 {
1160
+ ._DraggableComponent_lchn0_1:has(._DraggableComponent--hover_lchn0_50 > ._DraggableComponent-overlay_lchn0_17) > ._DraggableComponent-overlay_lchn0_17 {
1175
1161
  display: none;
1176
1162
  }
1177
- ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-overlay_1bhad_29 {
1178
- outline: 2px var(--puck-color-azure-07) solid !important;
1179
- }
1180
- ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 {
1181
- display: block;
1163
+ ._DraggableComponent-actionsOverlay_lchn0_71 {
1182
1164
  position: sticky;
1183
1165
  z-index: 2;
1184
1166
  }
1185
- ._DraggableComponent-actions_1bhad_97 {
1167
+ ._DraggableComponent-actions_lchn0_71 {
1186
1168
  position: absolute;
1187
1169
  width: auto;
1188
1170
  cursor: grab;
1189
- display: none;
1171
+ display: flex;
1190
1172
  pointer-events: auto;
1191
1173
  box-sizing: border-box;
1192
1174
  transform-origin: right top;
1193
1175
  }
1194
- ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 > ._DraggableComponent-actions_1bhad_97 {
1195
- display: flex;
1196
- }
1197
1176
 
1198
1177
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
1199
- ._DropZone_djoti_1 {
1200
- margin-left: auto;
1201
- margin-right: auto;
1178
+ ._DropZone_q2ip3_1 {
1179
+ --drop-animation-ms: 250ms;
1180
+ --resize-animation-ms: 150ms;
1202
1181
  position: relative;
1203
- min-height: 100%;
1182
+ height: 100%;
1183
+ min-height: var(--min-empty-height);
1204
1184
  outline-offset: -2px;
1205
1185
  width: 100%;
1206
1186
  }
1207
- ._DropZone-content_djoti_10 {
1208
- min-height: 128px;
1209
- height: 100%;
1187
+ ._DropZone--hasChildren_q2ip3_12 {
1188
+ min-height: 0;
1210
1189
  }
1211
- ._DropZone--userIsDragging_djoti_15 ._DropZone-content_djoti_10 {
1212
- pointer-events: all;
1190
+ ._DropZone_q2ip3_1:empty {
1191
+ min-height: var(--min-empty-height);
1213
1192
  }
1214
- ._DropZone--userIsDragging_djoti_15:not(._DropZone--draggingOverArea_djoti_19):not(._DropZone--draggingNewComponent_djoti_20) > ._DropZone-content_djoti_10 {
1215
- pointer-events: none;
1193
+ ._DropZone--hasChildren_q2ip3_12:not(._DropZone--userIsDragging_q2ip3_20) {
1194
+ transition: min-height var(--resize-animation-ms) var(--drop-animation-ms) ease-in;
1195
+ }
1196
+ ._DropZone_q2ip3_1:empty:not(._DropZone--userIsDragging_q2ip3_20) {
1197
+ transition: min-height var(--resize-animation-ms) ease-in;
1216
1198
  }
1217
- ._DropZone--isAreaSelected_djoti_26,
1218
- ._DropZone--draggingOverArea_djoti_19:not(:has(._DropZone--hoveringOverArea_djoti_27)),
1219
- ._DropZone--hoveringOverArea_djoti_27:not(._DropZone--isDisabled_djoti_28):not(._DropZone--isRootZone_djoti_29):not(._DropZone--hasChildren_djoti_30) {
1199
+ ._DropZone--isAreaSelected_q2ip3_29,
1200
+ ._DropZone--hoveringOverArea_q2ip3_30:not(._DropZone--isRootZone_q2ip3_30) {
1220
1201
  background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
1221
1202
  outline: 2px dashed var(--puck-color-azure-08);
1222
1203
  }
1223
- ._DropZone_djoti_1:not(._DropZone--hasChildren_djoti_30) {
1204
+ ._DropZone_q2ip3_1:empty {
1224
1205
  background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
1225
1206
  outline: 2px dashed var(--puck-color-azure-08);
1226
1207
  }
1227
- ._DropZone--isDestination_djoti_40 {
1208
+ ._DropZone--isDestination_q2ip3_40 {
1228
1209
  outline: 2px dashed var(--puck-color-azure-04) !important;
1229
1210
  }
1230
- ._DropZone--isDestination_djoti_40:not(._DropZone--isRootZone_djoti_29) {
1211
+ ._DropZone--isDestination_q2ip3_40:not(._DropZone--isRootZone_q2ip3_30) {
1231
1212
  background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent) !important;
1232
1213
  }
1233
- ._DropZone-item_djoti_52 {
1214
+ ._DropZone-item_q2ip3_52 {
1234
1215
  position: relative;
1235
1216
  }
1236
- ._DropZone-hitbox_djoti_56 {
1217
+ ._DropZone-hitbox_q2ip3_56 {
1237
1218
  position: absolute;
1238
1219
  bottom: -12px;
1239
1220
  height: 24px;
1240
1221
  width: 100%;
1241
1222
  z-index: 1;
1242
1223
  }
1224
+ ._DropZone--isEnabled_q2ip3_64._DropZone--userIsDragging_q2ip3_20 {
1225
+ outline: 2px dashed var(--puck-color-azure-06);
1226
+ }
1243
1227
 
1244
1228
  /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
1245
1229
  ._SidebarSection_125qe_1 {
@@ -1594,12 +1578,13 @@ textarea._Input-input_3pq3z_47 {
1594
1578
  }
1595
1579
 
1596
1580
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Preview/styles.module.css/#css-module-data */
1597
- ._PuckPreview_rxwlr_1 {
1581
+ ._PuckPreview_z2rgu_1 {
1582
+ position: relative;
1598
1583
  height: 100%;
1599
1584
  }
1600
- ._PuckPreview-frame_rxwlr_5 {
1585
+ ._PuckPreview-frame_z2rgu_6 {
1601
1586
  border: none;
1602
- min-height: 100%;
1587
+ height: 100%;
1603
1588
  width: 100%;
1604
1589
  }
1605
1590