@measured/puck 0.14.2-canary.3f7fc52 → 0.14.2-canary.4a479b1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (3) hide show
  1. package/dist/index.css +44 -41
  2. package/dist/index.js +10 -8
  3. package/package.json +2 -2
package/dist/index.css CHANGED
@@ -135,6 +135,9 @@
135
135
  }
136
136
 
137
137
  /* styles.css */
138
+ .Puck {
139
+ min-height: 100%;
140
+ }
138
141
 
139
142
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Button/Button.module.css/#css-module-data */
140
143
  ._Button_1t64k_1 {
@@ -283,25 +286,25 @@
283
286
  }
284
287
 
285
288
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
286
- ._DraggableComponent_1542z_1 {
289
+ ._DraggableComponent_59z7f_1 {
287
290
  pointer-events: auto;
288
291
  --overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
289
292
  }
290
- ._DraggableComponent--isDragging_1542z_11 {
293
+ ._DraggableComponent--isDragging_59z7f_11 {
291
294
  background: color-mix(in srgb, var(--puck-color-azure-08) 10%, transparent);
292
295
  overflow: hidden;
293
296
  }
294
- ._DraggableComponent-contents_1542z_16 {
297
+ ._DraggableComponent-contents_59z7f_16 {
295
298
  position: relative;
296
299
  pointer-events: none;
297
300
  z-index: 0;
298
301
  }
299
- ._DraggableComponent-contents_1542z_16::before,
300
- ._DraggableComponent-contents_1542z_16::after {
302
+ ._DraggableComponent-contents_59z7f_16::before,
303
+ ._DraggableComponent-contents_59z7f_16::after {
301
304
  content: " ";
302
305
  display: table;
303
306
  }
304
- ._DraggableComponent-overlay_1542z_29 {
307
+ ._DraggableComponent-overlay_59z7f_29 {
305
308
  cursor: pointer;
306
309
  height: 100%;
307
310
  width: 100%;
@@ -312,13 +315,13 @@
312
315
  box-sizing: border-box;
313
316
  z-index: 1;
314
317
  }
315
- ._DraggableComponent_1542z_1:focus-visible > ._DraggableComponent-overlay_1542z_29 {
318
+ ._DraggableComponent_59z7f_1:focus-visible > ._DraggableComponent-overlay_59z7f_29 {
316
319
  outline: 1px solid var(--puck-color-azure-05);
317
320
  }
318
- ._DraggableComponent--isDragging_1542z_11 > ._DraggableComponent-overlay_1542z_29 {
319
- outline: 1px var(--puck-color-azure-09) solid !important;
321
+ ._DraggableComponent--isDragging_59z7f_11 > ._DraggableComponent-overlay_59z7f_29 {
322
+ outline: 2px var(--puck-color-azure-09) solid !important;
320
323
  }
321
- ._DraggableComponent-loadingOverlay_1542z_49 {
324
+ ._DraggableComponent-loadingOverlay_59z7f_49 {
322
325
  background: var(--puck-color-white);
323
326
  color: var(--puck-color-grey-03);
324
327
  border-radius: 4px;
@@ -333,32 +336,32 @@
333
336
  opacity: 0.8;
334
337
  z-index: 1;
335
338
  }
336
- ._DraggableComponent_1542z_1:hover:not(._DraggableComponent--isLocked_1542z_65) > ._DraggableComponent-overlay_1542z_29 {
339
+ ._DraggableComponent_59z7f_1:hover:not(._DraggableComponent--isLocked_59z7f_65) > ._DraggableComponent-overlay_59z7f_29 {
337
340
  background: var(--overlay-background);
338
341
  pointer-events: none;
339
342
  }
340
- ._DraggableComponent--forceHover_1542z_71 > ._DraggableComponent-overlay_1542z_29 {
343
+ ._DraggableComponent--forceHover_59z7f_71 > ._DraggableComponent-overlay_59z7f_29 {
341
344
  background: var(--overlay-background);
342
345
  pointer-events: none;
343
346
  }
344
- ._DraggableComponent_1542z_1:not(._DraggableComponent--isSelected_1542z_76):hover > ._DraggableComponent-overlay_1542z_29 {
347
+ ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):hover > ._DraggableComponent-overlay_59z7f_29 {
345
348
  outline: 2px var(--puck-color-azure-09) solid !important;
346
349
  }
347
- ._DraggableComponent--indicativeHover_1542z_81 > ._DraggableComponent-overlay_1542z_29 {
350
+ ._DraggableComponent--indicativeHover_59z7f_81 > ._DraggableComponent-overlay_59z7f_29 {
348
351
  pointer-events: none;
349
352
  }
350
- ._DraggableComponent_1542z_1:not(._DraggableComponent--isSelected_1542z_76):has(._DraggableComponent_1542z_1:hover > ._DraggableComponent-overlay_1542z_29) > ._DraggableComponent-overlay_1542z_29 {
353
+ ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):has(._DraggableComponent_59z7f_1:hover > ._DraggableComponent-overlay_59z7f_29) > ._DraggableComponent-overlay_59z7f_29 {
351
354
  display: none;
352
355
  }
353
- ._DraggableComponent--isSelected_1542z_76 > ._DraggableComponent-overlay_1542z_29 {
356
+ ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-overlay_59z7f_29 {
354
357
  outline: 2px var(--puck-color-azure-07) solid !important;
355
358
  }
356
- ._DraggableComponent--isSelected_1542z_76 > ._DraggableComponent-actionsOverlay_1542z_97 {
359
+ ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 {
357
360
  display: block;
358
361
  position: sticky;
359
362
  z-index: 2;
360
363
  }
361
- ._DraggableComponent-actions_1542z_97 {
364
+ ._DraggableComponent-actions_59z7f_97 {
362
365
  position: absolute;
363
366
  width: auto;
364
367
  padding: 4px;
@@ -375,10 +378,10 @@
375
378
  box-sizing: border-box;
376
379
  transform-origin: right top;
377
380
  }
378
- ._DraggableComponent--isSelected_1542z_76 > ._DraggableComponent-actionsOverlay_1542z_97 > ._DraggableComponent-actions_1542z_97 {
381
+ ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 > ._DraggableComponent-actions_59z7f_97 {
379
382
  display: flex;
380
383
  }
381
- ._DraggableComponent-actionsLabel_1542z_127 {
384
+ ._DraggableComponent-actionsLabel_59z7f_127 {
382
385
  color: var(--puck-color-grey-08);
383
386
  display: flex;
384
387
  font-size: var(--puck-font-size-xxxs);
@@ -392,7 +395,7 @@
392
395
  text-overflow: ellipsis;
393
396
  white-space: nowrap;
394
397
  }
395
- ._DraggableComponent-action_1542z_97 {
398
+ ._DraggableComponent-action_59z7f_97 {
396
399
  background: transparent;
397
400
  border: none;
398
401
  color: var(--puck-color-grey-08);
@@ -405,60 +408,60 @@
405
408
  justify-content: center;
406
409
  transition: color 50ms ease-in;
407
410
  }
408
- ._DraggableComponent-action_1542z_97:focus-visible {
411
+ ._DraggableComponent-action_59z7f_97:focus-visible {
409
412
  outline: 2px solid var(--puck-color-azure-05);
410
413
  outline-offset: -2px;
411
414
  }
412
415
  @media (hover: hover) and (pointer: fine) {
413
- ._DraggableComponent-action_1542z_97:hover {
416
+ ._DraggableComponent-action_59z7f_97:hover {
414
417
  color: var(--puck-color-azure-06);
415
418
  transition: none;
416
419
  }
417
420
  }
418
- ._DraggableComponent-action_1542z_97:active {
421
+ ._DraggableComponent-action_59z7f_97:active {
419
422
  color: var(--puck-color-azure-07);
420
423
  transition: none;
421
424
  }
422
425
 
423
426
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
424
- ._DropZone_w4btq_1 {
427
+ ._DropZone_djoti_1 {
425
428
  margin-left: auto;
426
429
  margin-right: auto;
427
430
  position: relative;
428
- height: 100%;
429
- outline-offset: -1px;
431
+ min-height: 100%;
432
+ outline-offset: -2px;
430
433
  width: 100%;
431
434
  }
432
- ._DropZone-content_w4btq_10 {
435
+ ._DropZone-content_djoti_10 {
433
436
  min-height: 128px;
434
437
  height: 100%;
435
438
  }
436
- ._DropZone--userIsDragging_w4btq_15 ._DropZone-content_w4btq_10 {
439
+ ._DropZone--userIsDragging_djoti_15 ._DropZone-content_djoti_10 {
437
440
  pointer-events: all;
438
441
  }
439
- ._DropZone--userIsDragging_w4btq_15:not(._DropZone--draggingOverArea_w4btq_19):not(._DropZone--draggingNewComponent_w4btq_20) > ._DropZone-content_w4btq_10 {
442
+ ._DropZone--userIsDragging_djoti_15:not(._DropZone--draggingOverArea_djoti_19):not(._DropZone--draggingNewComponent_djoti_20) > ._DropZone-content_djoti_10 {
440
443
  pointer-events: none;
441
444
  }
442
- ._DropZone--isAreaSelected_w4btq_26,
443
- ._DropZone--draggingOverArea_w4btq_19:not(:has(._DropZone--hoveringOverArea_w4btq_27)),
444
- ._DropZone--hoveringOverArea_w4btq_27:not(._DropZone--isDisabled_w4btq_28):not(._DropZone--isRootZone_w4btq_29):not(._DropZone--hasChildren_w4btq_30) {
445
+ ._DropZone--isAreaSelected_djoti_26,
446
+ ._DropZone--draggingOverArea_djoti_19:not(:has(._DropZone--hoveringOverArea_djoti_27)),
447
+ ._DropZone--hoveringOverArea_djoti_27:not(._DropZone--isDisabled_djoti_28):not(._DropZone--isRootZone_djoti_29):not(._DropZone--hasChildren_djoti_30) {
445
448
  background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
446
449
  outline: 2px dashed var(--puck-color-azure-08);
447
450
  }
448
- ._DropZone_w4btq_1:not(._DropZone--hasChildren_w4btq_30) {
451
+ ._DropZone_djoti_1:not(._DropZone--hasChildren_djoti_30) {
449
452
  background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent);
450
453
  outline: 2px dashed var(--puck-color-azure-08);
451
454
  }
452
- ._DropZone--isDestination_w4btq_40 {
455
+ ._DropZone--isDestination_djoti_40 {
453
456
  outline: 2px dashed var(--puck-color-azure-04) !important;
454
457
  }
455
- ._DropZone--isDestination_w4btq_40:not(._DropZone--isRootZone_w4btq_29) {
458
+ ._DropZone--isDestination_djoti_40:not(._DropZone--isRootZone_djoti_29) {
456
459
  background: color-mix(in srgb, var(--puck-color-azure-09) 30%, transparent) !important;
457
460
  }
458
- ._DropZone-item_w4btq_52 {
461
+ ._DropZone-item_djoti_52 {
459
462
  position: relative;
460
463
  }
461
- ._DropZone-hitbox_w4btq_56 {
464
+ ._DropZone-hitbox_djoti_56 {
462
465
  position: absolute;
463
466
  bottom: -12px;
464
467
  height: 24px;
@@ -1531,12 +1534,12 @@ textarea._Input-input_1qi5b_46 {
1531
1534
  }
1532
1535
 
1533
1536
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Preview/styles.module.css/#css-module-data */
1534
- ._PuckPreview_1mia0_1 {
1537
+ ._PuckPreview_rxwlr_1 {
1535
1538
  height: 100%;
1536
1539
  }
1537
- ._PuckPreview-frame_1mia0_5 {
1540
+ ._PuckPreview-frame_rxwlr_5 {
1538
1541
  border: none;
1539
- height: 100%;
1542
+ min-height: 100%;
1540
1543
  width: 100%;
1541
1544
  }
1542
1545
 
package/dist/index.js CHANGED
@@ -29296,10 +29296,10 @@ var setupZone = (data, zoneKey) => {
29296
29296
  var getItem = (selector, data, dynamicProps = {}) => {
29297
29297
  if (!selector.zone || selector.zone === rootDroppableId) {
29298
29298
  const item2 = data.content[selector.index];
29299
- return __spreadProps(__spreadValues({}, item2), { props: dynamicProps[item2.props.id] || item2.props });
29299
+ return (item2 == null ? void 0 : item2.props) ? __spreadProps(__spreadValues({}, item2), { props: dynamicProps[item2.props.id] || item2.props }) : void 0;
29300
29300
  }
29301
29301
  const item = setupZone(data, selector.zone).zones[selector.zone][selector.index];
29302
- return __spreadProps(__spreadValues({}, item), { props: dynamicProps[item.props.id] || item.props });
29302
+ return (item == null ? void 0 : item.props) ? __spreadProps(__spreadValues({}, item), { props: dynamicProps[item.props.id] || item.props }) : void 0;
29303
29303
  };
29304
29304
 
29305
29305
  // components/ViewportControls/default-viewports.ts
@@ -29589,7 +29589,7 @@ var import_dnd3 = require("@measured/dnd");
29589
29589
 
29590
29590
  // css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css#css-module
29591
29591
  init_react_import();
29592
- var styles_module_default3 = { "DraggableComponent": "_DraggableComponent_1542z_1", "DraggableComponent--isDragging": "_DraggableComponent--isDragging_1542z_11", "DraggableComponent-contents": "_DraggableComponent-contents_1542z_16", "DraggableComponent-overlay": "_DraggableComponent-overlay_1542z_29", "DraggableComponent-loadingOverlay": "_DraggableComponent-loadingOverlay_1542z_49", "DraggableComponent--isLocked": "_DraggableComponent--isLocked_1542z_65", "DraggableComponent--forceHover": "_DraggableComponent--forceHover_1542z_71", "DraggableComponent--isSelected": "_DraggableComponent--isSelected_1542z_76", "DraggableComponent--indicativeHover": "_DraggableComponent--indicativeHover_1542z_81", "DraggableComponent-actionsOverlay": "_DraggableComponent-actionsOverlay_1542z_97", "DraggableComponent-actions": "_DraggableComponent-actions_1542z_97", "DraggableComponent-actionsLabel": "_DraggableComponent-actionsLabel_1542z_127", "DraggableComponent-action": "_DraggableComponent-action_1542z_97" };
29592
+ var styles_module_default3 = { "DraggableComponent": "_DraggableComponent_59z7f_1", "DraggableComponent--isDragging": "_DraggableComponent--isDragging_59z7f_11", "DraggableComponent-contents": "_DraggableComponent-contents_59z7f_16", "DraggableComponent-overlay": "_DraggableComponent-overlay_59z7f_29", "DraggableComponent-loadingOverlay": "_DraggableComponent-loadingOverlay_59z7f_49", "DraggableComponent--isLocked": "_DraggableComponent--isLocked_59z7f_65", "DraggableComponent--forceHover": "_DraggableComponent--forceHover_59z7f_71", "DraggableComponent--isSelected": "_DraggableComponent--isSelected_59z7f_76", "DraggableComponent--indicativeHover": "_DraggableComponent--indicativeHover_59z7f_81", "DraggableComponent-actionsOverlay": "_DraggableComponent-actionsOverlay_59z7f_97", "DraggableComponent-actions": "_DraggableComponent-actions_59z7f_97", "DraggableComponent-actionsLabel": "_DraggableComponent-actionsLabel_59z7f_127", "DraggableComponent-action": "_DraggableComponent-action_59z7f_97" };
29593
29593
 
29594
29594
  // ../../node_modules/lucide-react/dist/esm/lucide-react.js
29595
29595
  init_react_import();
@@ -30000,7 +30000,7 @@ var DraggableComponent = ({
30000
30000
 
30001
30001
  // css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css#css-module
30002
30002
  init_react_import();
30003
- var styles_module_default4 = { "DropZone": "_DropZone_w4btq_1", "DropZone-content": "_DropZone-content_w4btq_10", "DropZone--userIsDragging": "_DropZone--userIsDragging_w4btq_15", "DropZone--draggingOverArea": "_DropZone--draggingOverArea_w4btq_19", "DropZone--draggingNewComponent": "_DropZone--draggingNewComponent_w4btq_20", "DropZone--isAreaSelected": "_DropZone--isAreaSelected_w4btq_26", "DropZone--hoveringOverArea": "_DropZone--hoveringOverArea_w4btq_27", "DropZone--isDisabled": "_DropZone--isDisabled_w4btq_28", "DropZone--isRootZone": "_DropZone--isRootZone_w4btq_29", "DropZone--hasChildren": "_DropZone--hasChildren_w4btq_30", "DropZone--isDestination": "_DropZone--isDestination_w4btq_40", "DropZone-item": "_DropZone-item_w4btq_52", "DropZone-hitbox": "_DropZone-hitbox_w4btq_56" };
30003
+ var styles_module_default4 = { "DropZone": "_DropZone_djoti_1", "DropZone-content": "_DropZone-content_djoti_10", "DropZone--userIsDragging": "_DropZone--userIsDragging_djoti_15", "DropZone--draggingOverArea": "_DropZone--draggingOverArea_djoti_19", "DropZone--draggingNewComponent": "_DropZone--draggingNewComponent_djoti_20", "DropZone--isAreaSelected": "_DropZone--isAreaSelected_djoti_26", "DropZone--hoveringOverArea": "_DropZone--hoveringOverArea_djoti_27", "DropZone--isDisabled": "_DropZone--isDisabled_djoti_28", "DropZone--isRootZone": "_DropZone--isRootZone_djoti_29", "DropZone--hasChildren": "_DropZone--hasChildren_djoti_30", "DropZone--isDestination": "_DropZone--isDestination_djoti_40", "DropZone-item": "_DropZone-item_djoti_52", "DropZone-hitbox": "_DropZone-hitbox_djoti_56" };
30004
30004
 
30005
30005
  // components/DropZone/context.tsx
30006
30006
  init_react_import();
@@ -32535,10 +32535,11 @@ var useComponentList = (config, ui) => {
32535
32535
  children: category.components.map((componentName, i) => {
32536
32536
  var _a2;
32537
32537
  matchedComponents.push(componentName);
32538
+ const componentConf = config.components[componentName] || {};
32538
32539
  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
32539
32540
  ComponentList.Item,
32540
32541
  {
32541
- label: (_a2 = config.components[componentName]["label"]) != null ? _a2 : componentName,
32542
+ label: (_a2 = componentConf["label"]) != null ? _a2 : componentName,
32542
32543
  name: componentName,
32543
32544
  index: i
32544
32545
  },
@@ -32562,11 +32563,12 @@ var useComponentList = (config, ui) => {
32562
32563
  title: ((_c = ui.componentList.other) == null ? void 0 : _c.title) || "Other",
32563
32564
  children: remainingComponents.map((componentName, i) => {
32564
32565
  var _a2;
32566
+ const componentConf = config.components[componentName] || {};
32565
32567
  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
32566
32568
  ComponentList.Item,
32567
32569
  {
32568
32570
  name: componentName,
32569
- label: (_a2 = config.components[componentName]["label"]) != null ? _a2 : componentName,
32571
+ label: (_a2 = componentConf["label"]) != null ? _a2 : componentName,
32570
32572
  index: i
32571
32573
  },
32572
32574
  componentName
@@ -32600,7 +32602,7 @@ var import_auto_frame_component = __toESM(require("@measured/auto-frame-componen
32600
32602
 
32601
32603
  // css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Preview/styles.module.css#css-module
32602
32604
  init_react_import();
32603
- var styles_module_default16 = { "PuckPreview": "_PuckPreview_1mia0_1", "PuckPreview-frame": "_PuckPreview-frame_1mia0_5" };
32605
+ var styles_module_default16 = { "PuckPreview": "_PuckPreview_rxwlr_1", "PuckPreview-frame": "_PuckPreview-frame_rxwlr_5" };
32604
32606
 
32605
32607
  // components/Puck/components/Preview/index.tsx
32606
32608
  var import_jsx_runtime29 = require("react/jsx-runtime");
@@ -33380,7 +33382,7 @@ var Canvas = () => {
33380
33382
  {
33381
33383
  className: getClassName24("root"),
33382
33384
  style: {
33383
- width: iframe.enabled ? ui.viewports.current.width : void 0,
33385
+ width: iframe.enabled ? ui.viewports.current.width : "100%",
33384
33386
  height: zoomConfig.rootHeight,
33385
33387
  transform: iframe.enabled ? `scale(${zoomConfig.zoom})` : void 0,
33386
33388
  transition: showTransition ? "width 150ms ease-out, height 150ms ease-out, transform 150ms ease-out" : "",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@measured/puck",
3
- "version": "0.14.2-canary.3f7fc52",
3
+ "version": "0.14.2-canary.4a479b1",
4
4
  "author": "Measured Corporation Ltd <hello@measured.co>",
5
5
  "repository": "measuredco/puck",
6
6
  "bugs": "https://github.com/measuredco/puck/issues",
@@ -60,7 +60,7 @@
60
60
  },
61
61
  "dependencies": {
62
62
  "@measured/auto-frame-component": "0.1.1",
63
- "@measured/dnd": "16.6.0-canary.c7c88e8",
63
+ "@measured/dnd": "16.6.0-canary.f472135",
64
64
  "deep-diff": "^1.0.2",
65
65
  "react-hotkeys-hook": "^4.4.1",
66
66
  "react-spinners": "^0.13.8",