@measured/puck 0.20.0-canary.f73c8fa0 → 0.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-UBWXLOVR.mjs → chunk-DCZ7BU3G.mjs} +5808 -6165
- package/dist/{chunk-BNXRZWNI.mjs → chunk-NFK5JVZW.mjs} +126 -227
- package/dist/index.css +259 -383
- package/dist/index.d.mts +6 -9
- package/dist/index.d.ts +6 -9
- package/dist/index.js +1660 -2061
- package/dist/index.mjs +6 -6
- package/dist/no-external.css +471 -599
- package/dist/no-external.d.mts +2 -2
- package/dist/no-external.d.ts +2 -2
- package/dist/no-external.js +1660 -2064
- package/dist/no-external.mjs +2 -6
- package/dist/rsc.d.mts +2 -2
- package/dist/rsc.d.ts +2 -2
- package/dist/rsc.js +1 -3
- package/dist/rsc.mjs +105 -2
- package/dist/{walk-tree-Dn5XpDNA.d.mts → walk-tree-CiAkCQEp.d.mts} +153 -118
- package/dist/{walk-tree-Dn5XpDNA.d.ts → walk-tree-CiAkCQEp.d.ts} +153 -118
- package/package.json +1 -1
|
@@ -284,230 +284,6 @@ function walkTree(data, config, callbackFn) {
|
|
|
284
284
|
};
|
|
285
285
|
}
|
|
286
286
|
|
|
287
|
-
// components/ServerRender/index.tsx
|
|
288
|
-
init_react_import();
|
|
289
|
-
|
|
290
|
-
// lib/root-droppable-id.ts
|
|
291
|
-
init_react_import();
|
|
292
|
-
var rootAreaId = "root";
|
|
293
|
-
var rootZone = "default-zone";
|
|
294
|
-
var rootDroppableId = `${rootAreaId}:${rootZone}`;
|
|
295
|
-
|
|
296
|
-
// lib/data/setup-zone.ts
|
|
297
|
-
init_react_import();
|
|
298
|
-
var setupZone = (data, zoneKey) => {
|
|
299
|
-
if (zoneKey === rootDroppableId) {
|
|
300
|
-
return data;
|
|
301
|
-
}
|
|
302
|
-
const newData = __spreadProps(__spreadValues({}, data), {
|
|
303
|
-
zones: data.zones ? __spreadValues({}, data.zones) : {}
|
|
304
|
-
});
|
|
305
|
-
newData.zones[zoneKey] = newData.zones[zoneKey] || [];
|
|
306
|
-
return newData;
|
|
307
|
-
};
|
|
308
|
-
|
|
309
|
-
// lib/use-slots.tsx
|
|
310
|
-
init_react_import();
|
|
311
|
-
|
|
312
|
-
// lib/field-transforms/use-field-transforms.tsx
|
|
313
|
-
init_react_import();
|
|
314
|
-
import { useMemo } from "react";
|
|
315
|
-
function useFieldTransforms(config, item, transforms, readOnly, forceReadOnly) {
|
|
316
|
-
const mappers = useMemo(() => {
|
|
317
|
-
return Object.keys(transforms).reduce((acc, _fieldType) => {
|
|
318
|
-
const fieldType = _fieldType;
|
|
319
|
-
return __spreadProps(__spreadValues({}, acc), {
|
|
320
|
-
[fieldType]: (_a) => {
|
|
321
|
-
var _b = _a, {
|
|
322
|
-
parentId
|
|
323
|
-
} = _b, params = __objRest(_b, [
|
|
324
|
-
"parentId"
|
|
325
|
-
]);
|
|
326
|
-
const wildcardPath = params.propPath.replace(/\[\d+\]/g, "[*]");
|
|
327
|
-
const isReadOnly = (readOnly == null ? void 0 : readOnly[params.propPath]) || (readOnly == null ? void 0 : readOnly[wildcardPath]) || forceReadOnly || false;
|
|
328
|
-
const fn = transforms[fieldType];
|
|
329
|
-
return fn == null ? void 0 : fn(__spreadProps(__spreadValues({}, params), {
|
|
330
|
-
isReadOnly,
|
|
331
|
-
componentId: parentId
|
|
332
|
-
}));
|
|
333
|
-
}
|
|
334
|
-
});
|
|
335
|
-
}, {});
|
|
336
|
-
}, [transforms, readOnly, forceReadOnly]);
|
|
337
|
-
const transformedProps = useMemo(() => {
|
|
338
|
-
const mapped = mapFields(item, mappers, config).props;
|
|
339
|
-
return mapped;
|
|
340
|
-
}, [config, item, mappers]);
|
|
341
|
-
const mergedProps = useMemo(
|
|
342
|
-
() => __spreadValues(__spreadValues({}, item.props), transformedProps),
|
|
343
|
-
[item.props, transformedProps]
|
|
344
|
-
);
|
|
345
|
-
return mergedProps;
|
|
346
|
-
}
|
|
347
|
-
|
|
348
|
-
// lib/field-transforms/default-transforms/slot-transform.tsx
|
|
349
|
-
init_react_import();
|
|
350
|
-
var getSlotTransform = (renderSlotEdit, renderSlotRender = renderSlotEdit) => ({
|
|
351
|
-
slot: ({ value: content, propName, field, isReadOnly }) => {
|
|
352
|
-
const render = isReadOnly ? renderSlotRender : renderSlotEdit;
|
|
353
|
-
const Slot = (dzProps) => render(__spreadProps(__spreadValues({
|
|
354
|
-
allow: (field == null ? void 0 : field.type) === "slot" ? field.allow : [],
|
|
355
|
-
disallow: (field == null ? void 0 : field.type) === "slot" ? field.disallow : []
|
|
356
|
-
}, dzProps), {
|
|
357
|
-
zone: propName,
|
|
358
|
-
content
|
|
359
|
-
}));
|
|
360
|
-
return Slot;
|
|
361
|
-
}
|
|
362
|
-
});
|
|
363
|
-
|
|
364
|
-
// lib/use-slots.tsx
|
|
365
|
-
function useSlots(config, item, renderSlotEdit, renderSlotRender = renderSlotEdit, readOnly, forceReadOnly) {
|
|
366
|
-
return useFieldTransforms(
|
|
367
|
-
config,
|
|
368
|
-
item,
|
|
369
|
-
getSlotTransform(renderSlotEdit, renderSlotRender),
|
|
370
|
-
readOnly,
|
|
371
|
-
forceReadOnly
|
|
372
|
-
);
|
|
373
|
-
}
|
|
374
|
-
|
|
375
|
-
// components/SlotRender/server.tsx
|
|
376
|
-
init_react_import();
|
|
377
|
-
import { forwardRef } from "react";
|
|
378
|
-
import { jsx } from "react/jsx-runtime";
|
|
379
|
-
var SlotRenderPure = (props) => /* @__PURE__ */ jsx(SlotRender, __spreadValues({}, props));
|
|
380
|
-
var Item = ({
|
|
381
|
-
config,
|
|
382
|
-
item,
|
|
383
|
-
metadata
|
|
384
|
-
}) => {
|
|
385
|
-
const Component = config.components[item.type];
|
|
386
|
-
const props = useSlots(config, item, (slotProps) => /* @__PURE__ */ jsx(SlotRenderPure, __spreadProps(__spreadValues({}, slotProps), { config, metadata })));
|
|
387
|
-
return /* @__PURE__ */ jsx(
|
|
388
|
-
Component.render,
|
|
389
|
-
__spreadProps(__spreadValues({}, props), {
|
|
390
|
-
puck: __spreadProps(__spreadValues({}, props.puck), {
|
|
391
|
-
renderDropZone: DropZoneRender,
|
|
392
|
-
metadata: metadata || {}
|
|
393
|
-
})
|
|
394
|
-
})
|
|
395
|
-
);
|
|
396
|
-
};
|
|
397
|
-
var SlotRender = forwardRef(
|
|
398
|
-
function SlotRenderInternal({ className, style, content, config, metadata }, ref) {
|
|
399
|
-
return /* @__PURE__ */ jsx("div", { className, style, ref, children: content.map((item) => {
|
|
400
|
-
if (!config.components[item.type]) {
|
|
401
|
-
return null;
|
|
402
|
-
}
|
|
403
|
-
return /* @__PURE__ */ jsx(
|
|
404
|
-
Item,
|
|
405
|
-
{
|
|
406
|
-
config,
|
|
407
|
-
item,
|
|
408
|
-
metadata
|
|
409
|
-
},
|
|
410
|
-
item.props.id
|
|
411
|
-
);
|
|
412
|
-
}) });
|
|
413
|
-
}
|
|
414
|
-
);
|
|
415
|
-
|
|
416
|
-
// components/ServerRender/index.tsx
|
|
417
|
-
import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
|
|
418
|
-
function DropZoneRender({
|
|
419
|
-
zone,
|
|
420
|
-
data,
|
|
421
|
-
areaId = "root",
|
|
422
|
-
config,
|
|
423
|
-
metadata = {}
|
|
424
|
-
}) {
|
|
425
|
-
let zoneCompound = rootDroppableId;
|
|
426
|
-
let content = (data == null ? void 0 : data.content) || [];
|
|
427
|
-
if (!data || !config) {
|
|
428
|
-
return null;
|
|
429
|
-
}
|
|
430
|
-
if (areaId !== rootAreaId && zone !== rootZone) {
|
|
431
|
-
zoneCompound = `${areaId}:${zone}`;
|
|
432
|
-
content = setupZone(data, zoneCompound).zones[zoneCompound];
|
|
433
|
-
}
|
|
434
|
-
return /* @__PURE__ */ jsx2(Fragment, { children: content.map((item) => {
|
|
435
|
-
const Component = config.components[item.type];
|
|
436
|
-
const props = __spreadProps(__spreadValues({}, item.props), {
|
|
437
|
-
puck: {
|
|
438
|
-
renderDropZone: ({ zone: zone2 }) => /* @__PURE__ */ jsx2(
|
|
439
|
-
DropZoneRender,
|
|
440
|
-
{
|
|
441
|
-
zone: zone2,
|
|
442
|
-
data,
|
|
443
|
-
areaId: item.props.id,
|
|
444
|
-
config,
|
|
445
|
-
metadata
|
|
446
|
-
}
|
|
447
|
-
),
|
|
448
|
-
metadata,
|
|
449
|
-
dragRef: null,
|
|
450
|
-
isEditing: false
|
|
451
|
-
}
|
|
452
|
-
});
|
|
453
|
-
const renderItem = __spreadProps(__spreadValues({}, item), { props });
|
|
454
|
-
const propsWithSlots = useSlots(config, renderItem, (props2) => /* @__PURE__ */ jsx2(SlotRenderPure, __spreadProps(__spreadValues({}, props2), { config, metadata })));
|
|
455
|
-
if (Component) {
|
|
456
|
-
return /* @__PURE__ */ jsx2(Component.render, __spreadValues({}, propsWithSlots), renderItem.props.id);
|
|
457
|
-
}
|
|
458
|
-
return null;
|
|
459
|
-
}) });
|
|
460
|
-
}
|
|
461
|
-
function Render({
|
|
462
|
-
config,
|
|
463
|
-
data,
|
|
464
|
-
metadata = {}
|
|
465
|
-
}) {
|
|
466
|
-
var _a;
|
|
467
|
-
const rootProps = "props" in data.root ? data.root.props : data.root;
|
|
468
|
-
const title = rootProps.title || "";
|
|
469
|
-
const props = __spreadProps(__spreadValues({}, rootProps), {
|
|
470
|
-
puck: {
|
|
471
|
-
renderDropZone: ({ zone }) => /* @__PURE__ */ jsx2(
|
|
472
|
-
DropZoneRender,
|
|
473
|
-
{
|
|
474
|
-
zone,
|
|
475
|
-
data,
|
|
476
|
-
config,
|
|
477
|
-
metadata
|
|
478
|
-
}
|
|
479
|
-
),
|
|
480
|
-
isEditing: false,
|
|
481
|
-
dragRef: null,
|
|
482
|
-
metadata
|
|
483
|
-
},
|
|
484
|
-
title,
|
|
485
|
-
editMode: false,
|
|
486
|
-
id: "puck-root"
|
|
487
|
-
});
|
|
488
|
-
const propsWithSlots = useSlots(config, { type: "root", props }, (props2) => /* @__PURE__ */ jsx2(SlotRenderPure, __spreadProps(__spreadValues({}, props2), { config, metadata })));
|
|
489
|
-
if ((_a = config.root) == null ? void 0 : _a.render) {
|
|
490
|
-
return /* @__PURE__ */ jsx2(config.root.render, __spreadProps(__spreadValues({}, propsWithSlots), { children: /* @__PURE__ */ jsx2(
|
|
491
|
-
DropZoneRender,
|
|
492
|
-
{
|
|
493
|
-
config,
|
|
494
|
-
data,
|
|
495
|
-
zone: rootZone,
|
|
496
|
-
metadata
|
|
497
|
-
}
|
|
498
|
-
) }));
|
|
499
|
-
}
|
|
500
|
-
return /* @__PURE__ */ jsx2(
|
|
501
|
-
DropZoneRender,
|
|
502
|
-
{
|
|
503
|
-
config,
|
|
504
|
-
data,
|
|
505
|
-
zone: rootZone,
|
|
506
|
-
metadata
|
|
507
|
-
}
|
|
508
|
-
);
|
|
509
|
-
}
|
|
510
|
-
|
|
511
287
|
// lib/migrate.ts
|
|
512
288
|
init_react_import();
|
|
513
289
|
|
|
@@ -541,8 +317,7 @@ var defaultAppState = {
|
|
|
541
317
|
options: [],
|
|
542
318
|
controlsVisible: true
|
|
543
319
|
},
|
|
544
|
-
field: { focus: null }
|
|
545
|
-
plugin: { current: null }
|
|
320
|
+
field: { focus: null }
|
|
546
321
|
},
|
|
547
322
|
indexes: {
|
|
548
323
|
nodes: {},
|
|
@@ -558,6 +333,14 @@ init_react_import();
|
|
|
558
333
|
|
|
559
334
|
// lib/get-zone-id.ts
|
|
560
335
|
init_react_import();
|
|
336
|
+
|
|
337
|
+
// lib/root-droppable-id.ts
|
|
338
|
+
init_react_import();
|
|
339
|
+
var rootAreaId = "root";
|
|
340
|
+
var rootZone = "default-zone";
|
|
341
|
+
var rootDroppableId = `${rootAreaId}:${rootZone}`;
|
|
342
|
+
|
|
343
|
+
// lib/get-zone-id.ts
|
|
561
344
|
var getZoneId = (zoneCompound) => {
|
|
562
345
|
if (!zoneCompound) {
|
|
563
346
|
return [];
|
|
@@ -1032,6 +815,123 @@ function resolveAllData(_0, _1) {
|
|
|
1032
815
|
});
|
|
1033
816
|
}
|
|
1034
817
|
|
|
818
|
+
// lib/data/setup-zone.ts
|
|
819
|
+
init_react_import();
|
|
820
|
+
var setupZone = (data, zoneKey) => {
|
|
821
|
+
if (zoneKey === rootDroppableId) {
|
|
822
|
+
return data;
|
|
823
|
+
}
|
|
824
|
+
const newData = __spreadProps(__spreadValues({}, data), {
|
|
825
|
+
zones: data.zones ? __spreadValues({}, data.zones) : {}
|
|
826
|
+
});
|
|
827
|
+
newData.zones[zoneKey] = newData.zones[zoneKey] || [];
|
|
828
|
+
return newData;
|
|
829
|
+
};
|
|
830
|
+
|
|
831
|
+
// lib/field-transforms/use-field-transforms.tsx
|
|
832
|
+
init_react_import();
|
|
833
|
+
import { useMemo } from "react";
|
|
834
|
+
function useFieldTransforms(config, item, transforms, readOnly, forceReadOnly) {
|
|
835
|
+
const mappers = useMemo(() => {
|
|
836
|
+
return Object.keys(transforms).reduce((acc, _fieldType) => {
|
|
837
|
+
const fieldType = _fieldType;
|
|
838
|
+
return __spreadProps(__spreadValues({}, acc), {
|
|
839
|
+
[fieldType]: (_a) => {
|
|
840
|
+
var _b = _a, {
|
|
841
|
+
parentId
|
|
842
|
+
} = _b, params = __objRest(_b, [
|
|
843
|
+
"parentId"
|
|
844
|
+
]);
|
|
845
|
+
const wildcardPath = params.propPath.replace(/\[\d+\]/g, "[*]");
|
|
846
|
+
const isReadOnly = (readOnly == null ? void 0 : readOnly[params.propPath]) || (readOnly == null ? void 0 : readOnly[wildcardPath]) || forceReadOnly || false;
|
|
847
|
+
const fn = transforms[fieldType];
|
|
848
|
+
return fn == null ? void 0 : fn(__spreadProps(__spreadValues({}, params), {
|
|
849
|
+
isReadOnly,
|
|
850
|
+
componentId: parentId
|
|
851
|
+
}));
|
|
852
|
+
}
|
|
853
|
+
});
|
|
854
|
+
}, {});
|
|
855
|
+
}, [transforms, readOnly, forceReadOnly]);
|
|
856
|
+
const transformedProps = useMemo(() => {
|
|
857
|
+
const mapped = mapFields(item, mappers, config).props;
|
|
858
|
+
return mapped;
|
|
859
|
+
}, [config, item, mappers]);
|
|
860
|
+
const mergedProps = useMemo(
|
|
861
|
+
() => __spreadValues(__spreadValues({}, item.props), transformedProps),
|
|
862
|
+
[item.props, transformedProps]
|
|
863
|
+
);
|
|
864
|
+
return mergedProps;
|
|
865
|
+
}
|
|
866
|
+
|
|
867
|
+
// lib/field-transforms/default-transforms/slot-transform.tsx
|
|
868
|
+
init_react_import();
|
|
869
|
+
var getSlotTransform = (renderSlotEdit, renderSlotRender = renderSlotEdit) => ({
|
|
870
|
+
slot: ({ value: content, propName, field, isReadOnly }) => {
|
|
871
|
+
const render = isReadOnly ? renderSlotRender : renderSlotEdit;
|
|
872
|
+
const Slot = (dzProps) => render(__spreadProps(__spreadValues({
|
|
873
|
+
allow: (field == null ? void 0 : field.type) === "slot" ? field.allow : [],
|
|
874
|
+
disallow: (field == null ? void 0 : field.type) === "slot" ? field.disallow : []
|
|
875
|
+
}, dzProps), {
|
|
876
|
+
zone: propName,
|
|
877
|
+
content
|
|
878
|
+
}));
|
|
879
|
+
return Slot;
|
|
880
|
+
}
|
|
881
|
+
});
|
|
882
|
+
|
|
883
|
+
// lib/use-slots.tsx
|
|
884
|
+
init_react_import();
|
|
885
|
+
function useSlots(config, item, renderSlotEdit, renderSlotRender = renderSlotEdit, readOnly, forceReadOnly) {
|
|
886
|
+
return useFieldTransforms(
|
|
887
|
+
config,
|
|
888
|
+
item,
|
|
889
|
+
getSlotTransform(renderSlotEdit, renderSlotRender),
|
|
890
|
+
readOnly,
|
|
891
|
+
forceReadOnly
|
|
892
|
+
);
|
|
893
|
+
}
|
|
894
|
+
|
|
895
|
+
// components/SlotRender/server.tsx
|
|
896
|
+
init_react_import();
|
|
897
|
+
import { forwardRef } from "react";
|
|
898
|
+
import { jsx } from "react/jsx-runtime";
|
|
899
|
+
var SlotRenderPure = (props) => /* @__PURE__ */ jsx(SlotRender, __spreadValues({}, props));
|
|
900
|
+
var Item = ({
|
|
901
|
+
config,
|
|
902
|
+
item,
|
|
903
|
+
metadata
|
|
904
|
+
}) => {
|
|
905
|
+
const Component = config.components[item.type];
|
|
906
|
+
const props = useSlots(config, item, (slotProps) => /* @__PURE__ */ jsx(SlotRenderPure, __spreadProps(__spreadValues({}, slotProps), { config, metadata })));
|
|
907
|
+
return /* @__PURE__ */ jsx(
|
|
908
|
+
Component.render,
|
|
909
|
+
__spreadProps(__spreadValues({}, props), {
|
|
910
|
+
puck: __spreadProps(__spreadValues({}, props.puck), {
|
|
911
|
+
metadata: metadata || {}
|
|
912
|
+
})
|
|
913
|
+
})
|
|
914
|
+
);
|
|
915
|
+
};
|
|
916
|
+
var SlotRender = forwardRef(
|
|
917
|
+
function SlotRenderInternal({ className, style, content, config, metadata }, ref) {
|
|
918
|
+
return /* @__PURE__ */ jsx("div", { className, style, ref, children: content.map((item) => {
|
|
919
|
+
if (!config.components[item.type]) {
|
|
920
|
+
return null;
|
|
921
|
+
}
|
|
922
|
+
return /* @__PURE__ */ jsx(
|
|
923
|
+
Item,
|
|
924
|
+
{
|
|
925
|
+
config,
|
|
926
|
+
item,
|
|
927
|
+
metadata
|
|
928
|
+
},
|
|
929
|
+
item.props.id
|
|
930
|
+
);
|
|
931
|
+
}) });
|
|
932
|
+
}
|
|
933
|
+
);
|
|
934
|
+
|
|
1035
935
|
export {
|
|
1036
936
|
__spreadValues,
|
|
1037
937
|
__spreadProps,
|
|
@@ -1056,7 +956,6 @@ export {
|
|
|
1056
956
|
useFieldTransforms,
|
|
1057
957
|
getSlotTransform,
|
|
1058
958
|
useSlots,
|
|
1059
|
-
Render,
|
|
1060
959
|
SlotRenderPure,
|
|
1061
960
|
SlotRender,
|
|
1062
961
|
migrate,
|