@measured/puck-plugin-heading-analyzer 0.20.0-canary.77cef35d → 0.20.0-canary.7ccbeece
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 +145 -0
- package/dist/index.d.mts +5 -11
- package/dist/index.d.ts +5 -11
- package/dist/index.js +238 -82
- package/dist/index.mjs +235 -79
- package/package.json +2 -2
package/dist/index.css
CHANGED
|
@@ -12,6 +12,151 @@
|
|
|
12
12
|
color: var(--puck-color-red-04);
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
+
/* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
|
|
16
|
+
._SidebarSection_8boj8_1 {
|
|
17
|
+
display: flex;
|
|
18
|
+
position: relative;
|
|
19
|
+
flex-direction: column;
|
|
20
|
+
color: var(--puck-color-black);
|
|
21
|
+
}
|
|
22
|
+
._SidebarSection_8boj8_1:last-of-type {
|
|
23
|
+
flex-grow: 1;
|
|
24
|
+
}
|
|
25
|
+
._SidebarSection-title_8boj8_12 {
|
|
26
|
+
background: var(--puck-color-white);
|
|
27
|
+
padding: 16px;
|
|
28
|
+
border-bottom: 1px solid var(--puck-color-grey-09);
|
|
29
|
+
border-top: 1px solid var(--puck-color-grey-09);
|
|
30
|
+
overflow-x: auto;
|
|
31
|
+
}
|
|
32
|
+
._SidebarSection--noBorderTop_8boj8_20 > ._SidebarSection-title_8boj8_12 {
|
|
33
|
+
border-top: 0px;
|
|
34
|
+
}
|
|
35
|
+
._SidebarSection-content_8boj8_24 {
|
|
36
|
+
padding: 16px;
|
|
37
|
+
}
|
|
38
|
+
._SidebarSection--noPadding_8boj8_28 > ._SidebarSection-content_8boj8_24 {
|
|
39
|
+
padding: 0px;
|
|
40
|
+
}
|
|
41
|
+
._SidebarSection--noPadding_8boj8_28 > ._SidebarSection-content_8boj8_24:last-child {
|
|
42
|
+
padding-bottom: 4px;
|
|
43
|
+
}
|
|
44
|
+
._SidebarSection_8boj8_1:last-of-type ._SidebarSection-content_8boj8_24 {
|
|
45
|
+
border-bottom: none;
|
|
46
|
+
flex-grow: 1;
|
|
47
|
+
}
|
|
48
|
+
._SidebarSection-breadcrumbLabel_8boj8_41 {
|
|
49
|
+
background: none;
|
|
50
|
+
border: 0;
|
|
51
|
+
border-radius: 2px;
|
|
52
|
+
color: var(--puck-color-azure-04);
|
|
53
|
+
cursor: pointer;
|
|
54
|
+
font: inherit;
|
|
55
|
+
flex-shrink: 0;
|
|
56
|
+
padding: 0;
|
|
57
|
+
transition: color 50ms ease-in;
|
|
58
|
+
}
|
|
59
|
+
._SidebarSection-breadcrumbLabel_8boj8_41:focus-visible {
|
|
60
|
+
outline: 2px solid var(--puck-color-azure-05);
|
|
61
|
+
outline-offset: 2px;
|
|
62
|
+
}
|
|
63
|
+
@media (hover: hover) and (pointer: fine) {
|
|
64
|
+
._SidebarSection-breadcrumbLabel_8boj8_41:hover {
|
|
65
|
+
color: var(--puck-color-azure-03);
|
|
66
|
+
transition: none;
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
._SidebarSection-breadcrumbLabel_8boj8_41:active {
|
|
70
|
+
color: var(--puck-color-azure-02);
|
|
71
|
+
transition: none;
|
|
72
|
+
}
|
|
73
|
+
._SidebarSection-breadcrumbs_8boj8_70 {
|
|
74
|
+
align-items: center;
|
|
75
|
+
display: flex;
|
|
76
|
+
gap: 4px;
|
|
77
|
+
}
|
|
78
|
+
._SidebarSection-breadcrumb_8boj8_41 {
|
|
79
|
+
align-items: center;
|
|
80
|
+
display: flex;
|
|
81
|
+
gap: 4px;
|
|
82
|
+
}
|
|
83
|
+
._SidebarSection-heading_8boj8_82 {
|
|
84
|
+
padding-inline-end: 16px;
|
|
85
|
+
}
|
|
86
|
+
._SidebarSection-loadingOverlay_8boj8_86 {
|
|
87
|
+
background: var(--puck-color-white);
|
|
88
|
+
display: flex;
|
|
89
|
+
justify-content: center;
|
|
90
|
+
align-items: center;
|
|
91
|
+
height: 100%;
|
|
92
|
+
width: 100%;
|
|
93
|
+
top: 0;
|
|
94
|
+
position: absolute;
|
|
95
|
+
z-index: 1;
|
|
96
|
+
pointer-events: all;
|
|
97
|
+
box-sizing: border-box;
|
|
98
|
+
opacity: 0.8;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
/* css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css/#css-module-data */
|
|
102
|
+
._Heading_qxrry_1 {
|
|
103
|
+
display: block;
|
|
104
|
+
color: var(--puck-color-black);
|
|
105
|
+
font-weight: 700;
|
|
106
|
+
margin: 0;
|
|
107
|
+
}
|
|
108
|
+
._Heading_qxrry_1 b {
|
|
109
|
+
font-weight: 700;
|
|
110
|
+
}
|
|
111
|
+
._Heading--xxxxl_qxrry_12 {
|
|
112
|
+
font-size: var(--puck-font-size-xxxxl);
|
|
113
|
+
letter-spacing: 0.08ch;
|
|
114
|
+
font-weight: 800;
|
|
115
|
+
}
|
|
116
|
+
._Heading--xxxl_qxrry_18 {
|
|
117
|
+
font-size: var(--puck-font-size-xxxl);
|
|
118
|
+
}
|
|
119
|
+
._Heading--xxl_qxrry_22 {
|
|
120
|
+
font-size: var(--puck-font-size-xxl);
|
|
121
|
+
}
|
|
122
|
+
._Heading--xl_qxrry_26 {
|
|
123
|
+
font-size: var(--puck-font-size-xl);
|
|
124
|
+
}
|
|
125
|
+
._Heading--l_qxrry_30 {
|
|
126
|
+
font-size: var(--puck-font-size-l);
|
|
127
|
+
}
|
|
128
|
+
._Heading--m_qxrry_34 {
|
|
129
|
+
font-size: var(--puck-font-size-m);
|
|
130
|
+
}
|
|
131
|
+
._Heading--s_qxrry_38 {
|
|
132
|
+
font-size: var(--puck-font-size-s);
|
|
133
|
+
}
|
|
134
|
+
._Heading--xs_qxrry_42 {
|
|
135
|
+
font-size: var(--puck-font-size-xs);
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
/* css-module:/home/runner/work/puck/puck/packages/core/components/Loader/styles.module.css/#css-module-data */
|
|
139
|
+
@keyframes _loader-animation_nacdm_1 {
|
|
140
|
+
0% {
|
|
141
|
+
transform: rotate(0deg) scale(1);
|
|
142
|
+
}
|
|
143
|
+
50% {
|
|
144
|
+
transform: rotate(180deg) scale(0.8);
|
|
145
|
+
}
|
|
146
|
+
100% {
|
|
147
|
+
transform: rotate(360deg) scale(1);
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
._Loader_nacdm_13 {
|
|
151
|
+
background: transparent;
|
|
152
|
+
border-radius: 100%;
|
|
153
|
+
border: 2px solid currentColor;
|
|
154
|
+
border-bottom-color: transparent;
|
|
155
|
+
display: inline-block;
|
|
156
|
+
animation: _loader-animation_nacdm_1 1s 0s infinite linear;
|
|
157
|
+
animation-fill-mode: both;
|
|
158
|
+
}
|
|
159
|
+
|
|
15
160
|
/* css-module:/home/runner/work/puck/puck/packages/core/components/OutlineList/styles.module.css/#css-module-data */
|
|
16
161
|
._OutlineList_w4lzv_1 {
|
|
17
162
|
color: var(--puck-color-grey-03);
|
package/dist/index.d.mts
CHANGED
|
@@ -136,7 +136,6 @@ type Metadata = {
|
|
|
136
136
|
type ItemWithId = {
|
|
137
137
|
_arrayId: string;
|
|
138
138
|
_originalIndex: number;
|
|
139
|
-
_currentIndex: number;
|
|
140
139
|
};
|
|
141
140
|
type ArrayState = {
|
|
142
141
|
items: ItemWithId[];
|
|
@@ -170,12 +169,6 @@ type UiState = {
|
|
|
170
169
|
};
|
|
171
170
|
};
|
|
172
171
|
|
|
173
|
-
type RenderFunc<Props extends {
|
|
174
|
-
[key: string]: any;
|
|
175
|
-
} = {
|
|
176
|
-
children: ReactNode;
|
|
177
|
-
}> = (props: Props) => ReactElement;
|
|
178
|
-
|
|
179
172
|
type MapFnParams<ThisField = Field> = {
|
|
180
173
|
value: any;
|
|
181
174
|
parentId: string;
|
|
@@ -193,6 +186,11 @@ type FieldTransforms = Partial<{
|
|
|
193
186
|
[FieldType in Field["type"]]: FieldTransformFn<ExtractField<FieldType>>;
|
|
194
187
|
}>;
|
|
195
188
|
|
|
189
|
+
type RenderFunc<Props extends {
|
|
190
|
+
[key: string]: any;
|
|
191
|
+
} = {
|
|
192
|
+
children: ReactNode;
|
|
193
|
+
}> = (props: Props) => ReactElement;
|
|
196
194
|
declare const overrideKeys: readonly ["header", "headerActions", "fields", "fieldLabel", "drawer", "drawerItem", "componentOverlay", "outline", "puck", "preview"];
|
|
197
195
|
type OverrideKey = (typeof overrideKeys)[number];
|
|
198
196
|
type OverridesGeneric<Shape extends {
|
|
@@ -273,10 +271,6 @@ type Viewport = {
|
|
|
273
271
|
};
|
|
274
272
|
|
|
275
273
|
type Plugin = {
|
|
276
|
-
name?: string;
|
|
277
|
-
label?: string;
|
|
278
|
-
icon?: ReactNode;
|
|
279
|
-
render?: () => ReactElement;
|
|
280
274
|
overrides?: Partial<Overrides>;
|
|
281
275
|
fieldTransforms?: FieldTransforms;
|
|
282
276
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -136,7 +136,6 @@ type Metadata = {
|
|
|
136
136
|
type ItemWithId = {
|
|
137
137
|
_arrayId: string;
|
|
138
138
|
_originalIndex: number;
|
|
139
|
-
_currentIndex: number;
|
|
140
139
|
};
|
|
141
140
|
type ArrayState = {
|
|
142
141
|
items: ItemWithId[];
|
|
@@ -170,12 +169,6 @@ type UiState = {
|
|
|
170
169
|
};
|
|
171
170
|
};
|
|
172
171
|
|
|
173
|
-
type RenderFunc<Props extends {
|
|
174
|
-
[key: string]: any;
|
|
175
|
-
} = {
|
|
176
|
-
children: ReactNode;
|
|
177
|
-
}> = (props: Props) => ReactElement;
|
|
178
|
-
|
|
179
172
|
type MapFnParams<ThisField = Field> = {
|
|
180
173
|
value: any;
|
|
181
174
|
parentId: string;
|
|
@@ -193,6 +186,11 @@ type FieldTransforms = Partial<{
|
|
|
193
186
|
[FieldType in Field["type"]]: FieldTransformFn<ExtractField<FieldType>>;
|
|
194
187
|
}>;
|
|
195
188
|
|
|
189
|
+
type RenderFunc<Props extends {
|
|
190
|
+
[key: string]: any;
|
|
191
|
+
} = {
|
|
192
|
+
children: ReactNode;
|
|
193
|
+
}> = (props: Props) => ReactElement;
|
|
196
194
|
declare const overrideKeys: readonly ["header", "headerActions", "fields", "fieldLabel", "drawer", "drawerItem", "componentOverlay", "outline", "puck", "preview"];
|
|
197
195
|
type OverrideKey = (typeof overrideKeys)[number];
|
|
198
196
|
type OverridesGeneric<Shape extends {
|
|
@@ -273,10 +271,6 @@ type Viewport = {
|
|
|
273
271
|
};
|
|
274
272
|
|
|
275
273
|
type Plugin = {
|
|
276
|
-
name?: string;
|
|
277
|
-
label?: string;
|
|
278
|
-
icon?: ReactNode;
|
|
279
|
-
render?: () => ReactElement;
|
|
280
274
|
overrides?: Partial<Overrides>;
|
|
281
275
|
fieldTransforms?: FieldTransforms;
|
|
282
276
|
};
|
package/dist/index.js
CHANGED
|
@@ -313,7 +313,7 @@ init_react_import();
|
|
|
313
313
|
|
|
314
314
|
// src/HeadingAnalyzer.tsx
|
|
315
315
|
init_react_import();
|
|
316
|
-
var
|
|
316
|
+
var import_react11 = require("react");
|
|
317
317
|
|
|
318
318
|
// css-module:/home/runner/work/puck/puck/packages/plugin-heading-analyzer/src/HeadingAnalyzer.module.css#css-module
|
|
319
319
|
init_react_import();
|
|
@@ -322,12 +322,12 @@ var HeadingAnalyzer_module_default = { "HeadingAnalyzer": "_HeadingAnalyzer_116v
|
|
|
322
322
|
// src/HeadingAnalyzer.tsx
|
|
323
323
|
var import_puck = require("@measured/puck");
|
|
324
324
|
|
|
325
|
-
// ../core/components/
|
|
325
|
+
// ../core/components/SidebarSection/index.tsx
|
|
326
326
|
init_react_import();
|
|
327
327
|
|
|
328
|
-
// css-module:/home/runner/work/puck/puck/packages/core/components/
|
|
328
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css#css-module
|
|
329
329
|
init_react_import();
|
|
330
|
-
var styles_module_default = { "
|
|
330
|
+
var styles_module_default = { "SidebarSection": "_SidebarSection_8boj8_1", "SidebarSection-title": "_SidebarSection-title_8boj8_12", "SidebarSection--noBorderTop": "_SidebarSection--noBorderTop_8boj8_20", "SidebarSection-content": "_SidebarSection-content_8boj8_24", "SidebarSection--noPadding": "_SidebarSection--noPadding_8boj8_28", "SidebarSection-breadcrumbLabel": "_SidebarSection-breadcrumbLabel_8boj8_41", "SidebarSection-breadcrumbs": "_SidebarSection-breadcrumbs_8boj8_70", "SidebarSection-breadcrumb": "_SidebarSection-breadcrumb_8boj8_41", "SidebarSection-heading": "_SidebarSection-heading_8boj8_82", "SidebarSection-loadingOverlay": "_SidebarSection-loadingOverlay_8boj8_86" };
|
|
331
331
|
|
|
332
332
|
// ../core/lib/get-class-name-factory.ts
|
|
333
333
|
init_react_import();
|
|
@@ -356,50 +356,29 @@ var getClassNameFactory = (rootClass, styles, config = { baseClass: "" }) => (op
|
|
|
356
356
|
};
|
|
357
357
|
var get_class_name_factory_default = getClassNameFactory;
|
|
358
358
|
|
|
359
|
-
// ../core/components/
|
|
359
|
+
// ../core/components/Heading/index.tsx
|
|
360
|
+
init_react_import();
|
|
361
|
+
|
|
362
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css#css-module
|
|
363
|
+
init_react_import();
|
|
364
|
+
var styles_module_default2 = { "Heading": "_Heading_qxrry_1", "Heading--xxxxl": "_Heading--xxxxl_qxrry_12", "Heading--xxxl": "_Heading--xxxl_qxrry_18", "Heading--xxl": "_Heading--xxl_qxrry_22", "Heading--xl": "_Heading--xl_qxrry_26", "Heading--l": "_Heading--l_qxrry_30", "Heading--m": "_Heading--m_qxrry_34", "Heading--s": "_Heading--s_qxrry_38", "Heading--xs": "_Heading--xs_qxrry_42" };
|
|
365
|
+
|
|
366
|
+
// ../core/components/Heading/index.tsx
|
|
360
367
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
361
|
-
var getClassName = get_class_name_factory_default("
|
|
362
|
-
var
|
|
363
|
-
|
|
364
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: getClassName(), children });
|
|
365
|
-
};
|
|
366
|
-
OutlineList.Clickable = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: getClassNameItem({ clickable: true }), children });
|
|
367
|
-
OutlineList.Item = ({
|
|
368
|
-
children,
|
|
369
|
-
onClick
|
|
370
|
-
}) => {
|
|
368
|
+
var getClassName = get_class_name_factory_default("Heading", styles_module_default2);
|
|
369
|
+
var Heading = ({ children, rank, size = "m" }) => {
|
|
370
|
+
const Tag = rank ? `h${rank}` : "span";
|
|
371
371
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
372
|
-
|
|
372
|
+
Tag,
|
|
373
373
|
{
|
|
374
|
-
className:
|
|
375
|
-
|
|
374
|
+
className: getClassName({
|
|
375
|
+
[size]: true
|
|
376
|
+
}),
|
|
376
377
|
children
|
|
377
378
|
}
|
|
378
379
|
);
|
|
379
380
|
};
|
|
380
381
|
|
|
381
|
-
// ../core/lib/scroll-into-view.ts
|
|
382
|
-
init_react_import();
|
|
383
|
-
var scrollIntoView = (el) => {
|
|
384
|
-
const oldStyle = __spreadValues({}, el.style);
|
|
385
|
-
el.style.scrollMargin = "256px";
|
|
386
|
-
if (el) {
|
|
387
|
-
el == null ? void 0 : el.scrollIntoView({ behavior: "smooth" });
|
|
388
|
-
el.style.scrollMargin = oldStyle.scrollMargin || "";
|
|
389
|
-
}
|
|
390
|
-
};
|
|
391
|
-
|
|
392
|
-
// ../core/lib/get-frame.ts
|
|
393
|
-
init_react_import();
|
|
394
|
-
var getFrame = () => {
|
|
395
|
-
if (typeof window === "undefined") return;
|
|
396
|
-
let frameEl = document.querySelector("#preview-frame");
|
|
397
|
-
if ((frameEl == null ? void 0 : frameEl.tagName) === "IFRAME") {
|
|
398
|
-
return frameEl.contentDocument || document;
|
|
399
|
-
}
|
|
400
|
-
return (frameEl == null ? void 0 : frameEl.ownerDocument) || document;
|
|
401
|
-
};
|
|
402
|
-
|
|
403
382
|
// ../../node_modules/lucide-react/dist/esm/lucide-react.js
|
|
404
383
|
init_react_import();
|
|
405
384
|
|
|
@@ -487,29 +466,15 @@ var createLucideIcon = (iconName, iconNode) => {
|
|
|
487
466
|
return Component;
|
|
488
467
|
};
|
|
489
468
|
|
|
490
|
-
// ../../node_modules/lucide-react/dist/esm/icons/
|
|
469
|
+
// ../../node_modules/lucide-react/dist/esm/icons/chevron-right.js
|
|
491
470
|
init_react_import();
|
|
492
|
-
var
|
|
493
|
-
["path", { d: "
|
|
494
|
-
["path", { d: "M4 18V6", key: "1rz3zl" }],
|
|
495
|
-
["path", { d: "M12 18V6", key: "zqpxq5" }],
|
|
496
|
-
["path", { d: "m17 12 3-2v8", key: "1hhhft" }]
|
|
471
|
+
var ChevronRight = createLucideIcon("ChevronRight", [
|
|
472
|
+
["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]
|
|
497
473
|
]);
|
|
498
474
|
|
|
499
|
-
// ../core/lib/
|
|
500
|
-
init_react_import();
|
|
501
|
-
|
|
502
|
-
// ../core/lib/filter.ts
|
|
503
|
-
init_react_import();
|
|
504
|
-
|
|
505
|
-
// ../core/lib/data/reorder.ts
|
|
506
|
-
init_react_import();
|
|
507
|
-
|
|
508
|
-
// ../core/lib/data/replace.ts
|
|
509
|
-
init_react_import();
|
|
510
|
-
|
|
511
|
-
// ../core/lib/use-reset-auto-zoom.ts
|
|
475
|
+
// ../core/lib/use-breadcrumbs.ts
|
|
512
476
|
init_react_import();
|
|
477
|
+
var import_react10 = require("react");
|
|
513
478
|
|
|
514
479
|
// ../core/store/index.ts
|
|
515
480
|
init_react_import();
|
|
@@ -2150,14 +2115,203 @@ var createAppStore = (initialAppStore) => create()(
|
|
|
2150
2115
|
})
|
|
2151
2116
|
);
|
|
2152
2117
|
var appStoreContext = (0, import_react9.createContext)(createAppStore());
|
|
2118
|
+
function useAppStore(selector) {
|
|
2119
|
+
const context = (0, import_react9.useContext)(appStoreContext);
|
|
2120
|
+
return useStore(context, selector);
|
|
2121
|
+
}
|
|
2122
|
+
function useAppStoreApi() {
|
|
2123
|
+
return (0, import_react9.useContext)(appStoreContext);
|
|
2124
|
+
}
|
|
2125
|
+
|
|
2126
|
+
// ../core/lib/use-breadcrumbs.ts
|
|
2127
|
+
var useBreadcrumbs = (renderCount) => {
|
|
2128
|
+
const selectedId = useAppStore((s) => {
|
|
2129
|
+
var _a;
|
|
2130
|
+
return (_a = s.selectedItem) == null ? void 0 : _a.props.id;
|
|
2131
|
+
});
|
|
2132
|
+
const config = useAppStore((s) => s.config);
|
|
2133
|
+
const path = useAppStore((s) => {
|
|
2134
|
+
var _a;
|
|
2135
|
+
return (_a = s.state.indexes.nodes[selectedId]) == null ? void 0 : _a.path;
|
|
2136
|
+
});
|
|
2137
|
+
const appStore = useAppStoreApi();
|
|
2138
|
+
return (0, import_react10.useMemo)(() => {
|
|
2139
|
+
const breadcrumbs = (path == null ? void 0 : path.map((zoneCompound) => {
|
|
2140
|
+
var _a, _b, _c;
|
|
2141
|
+
const [componentId] = zoneCompound.split(":");
|
|
2142
|
+
if (componentId === "root") {
|
|
2143
|
+
return {
|
|
2144
|
+
label: "Page",
|
|
2145
|
+
selector: null
|
|
2146
|
+
};
|
|
2147
|
+
}
|
|
2148
|
+
const node = appStore.getState().state.indexes.nodes[componentId];
|
|
2149
|
+
const parentId = node.path[node.path.length - 1];
|
|
2150
|
+
const contentIds = ((_a = appStore.getState().state.indexes.zones[parentId]) == null ? void 0 : _a.contentIds) || [];
|
|
2151
|
+
const index = contentIds.indexOf(componentId);
|
|
2152
|
+
const label = node ? (_c = (_b = config.components[node.data.type]) == null ? void 0 : _b.label) != null ? _c : node.data.type : "Component";
|
|
2153
|
+
return {
|
|
2154
|
+
label,
|
|
2155
|
+
selector: node ? {
|
|
2156
|
+
index,
|
|
2157
|
+
zone: node.path[node.path.length - 1]
|
|
2158
|
+
} : null
|
|
2159
|
+
};
|
|
2160
|
+
})) || [];
|
|
2161
|
+
if (renderCount) {
|
|
2162
|
+
return breadcrumbs.slice(breadcrumbs.length - renderCount);
|
|
2163
|
+
}
|
|
2164
|
+
return breadcrumbs;
|
|
2165
|
+
}, [path, renderCount]);
|
|
2166
|
+
};
|
|
2167
|
+
|
|
2168
|
+
// ../core/components/Loader/index.tsx
|
|
2169
|
+
init_react_import();
|
|
2170
|
+
|
|
2171
|
+
// ../core/lib/index.ts
|
|
2172
|
+
init_react_import();
|
|
2173
|
+
|
|
2174
|
+
// ../core/lib/filter.ts
|
|
2175
|
+
init_react_import();
|
|
2176
|
+
|
|
2177
|
+
// ../core/lib/data/reorder.ts
|
|
2178
|
+
init_react_import();
|
|
2179
|
+
|
|
2180
|
+
// ../core/lib/data/replace.ts
|
|
2181
|
+
init_react_import();
|
|
2182
|
+
|
|
2183
|
+
// ../core/lib/use-reset-auto-zoom.ts
|
|
2184
|
+
init_react_import();
|
|
2153
2185
|
|
|
2154
2186
|
// ../core/lib/get-zoom-config.ts
|
|
2155
2187
|
init_react_import();
|
|
2156
2188
|
|
|
2189
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/Loader/styles.module.css#css-module
|
|
2190
|
+
init_react_import();
|
|
2191
|
+
var styles_module_default3 = { "Loader": "_Loader_nacdm_13", "loader-animation": "_loader-animation_nacdm_1" };
|
|
2192
|
+
|
|
2193
|
+
// ../core/components/Loader/index.tsx
|
|
2194
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
2195
|
+
var getClassName2 = get_class_name_factory_default("Loader", styles_module_default3);
|
|
2196
|
+
var Loader = (_a) => {
|
|
2197
|
+
var _b = _a, {
|
|
2198
|
+
color,
|
|
2199
|
+
size = 16
|
|
2200
|
+
} = _b, props = __objRest(_b, [
|
|
2201
|
+
"color",
|
|
2202
|
+
"size"
|
|
2203
|
+
]);
|
|
2204
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2205
|
+
"span",
|
|
2206
|
+
__spreadValues({
|
|
2207
|
+
className: getClassName2(),
|
|
2208
|
+
style: {
|
|
2209
|
+
width: size,
|
|
2210
|
+
height: size,
|
|
2211
|
+
color
|
|
2212
|
+
},
|
|
2213
|
+
"aria-label": "loading"
|
|
2214
|
+
}, props)
|
|
2215
|
+
);
|
|
2216
|
+
};
|
|
2217
|
+
|
|
2218
|
+
// ../core/components/SidebarSection/index.tsx
|
|
2219
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
2220
|
+
var getClassName3 = get_class_name_factory_default("SidebarSection", styles_module_default);
|
|
2221
|
+
var SidebarSection = ({
|
|
2222
|
+
children,
|
|
2223
|
+
title,
|
|
2224
|
+
background,
|
|
2225
|
+
showBreadcrumbs,
|
|
2226
|
+
noBorderTop,
|
|
2227
|
+
noPadding,
|
|
2228
|
+
isLoading
|
|
2229
|
+
}) => {
|
|
2230
|
+
const setUi = useAppStore((s) => s.setUi);
|
|
2231
|
+
const breadcrumbs = useBreadcrumbs(1);
|
|
2232
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
2233
|
+
"div",
|
|
2234
|
+
{
|
|
2235
|
+
className: getClassName3({ noBorderTop, noPadding }),
|
|
2236
|
+
style: { background },
|
|
2237
|
+
children: [
|
|
2238
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: getClassName3("title"), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: getClassName3("breadcrumbs"), children: [
|
|
2239
|
+
showBreadcrumbs ? breadcrumbs.map((breadcrumb, i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: getClassName3("breadcrumb"), children: [
|
|
2240
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
2241
|
+
"button",
|
|
2242
|
+
{
|
|
2243
|
+
type: "button",
|
|
2244
|
+
className: getClassName3("breadcrumbLabel"),
|
|
2245
|
+
onClick: () => setUi({ itemSelector: breadcrumb.selector }),
|
|
2246
|
+
children: breadcrumb.label
|
|
2247
|
+
}
|
|
2248
|
+
),
|
|
2249
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChevronRight, { size: 16 })
|
|
2250
|
+
] }, i)) : null,
|
|
2251
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: getClassName3("heading"), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Heading, { rank: "2", size: "xs", children: title }) })
|
|
2252
|
+
] }) }),
|
|
2253
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: getClassName3("content"), children }),
|
|
2254
|
+
isLoading && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: getClassName3("loadingOverlay"), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Loader, { size: 32 }) })
|
|
2255
|
+
]
|
|
2256
|
+
}
|
|
2257
|
+
);
|
|
2258
|
+
};
|
|
2259
|
+
|
|
2260
|
+
// ../core/components/OutlineList/index.tsx
|
|
2261
|
+
init_react_import();
|
|
2262
|
+
|
|
2263
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/OutlineList/styles.module.css#css-module
|
|
2264
|
+
init_react_import();
|
|
2265
|
+
var styles_module_default4 = { "OutlineList": "_OutlineList_w4lzv_1", "OutlineListItem": "_OutlineListItem_w4lzv_25", "OutlineListItem--clickable": "_OutlineListItem--clickable_w4lzv_45" };
|
|
2266
|
+
|
|
2267
|
+
// ../core/components/OutlineList/index.tsx
|
|
2268
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
2269
|
+
var getClassName4 = get_class_name_factory_default("OutlineList", styles_module_default4);
|
|
2270
|
+
var getClassNameItem = get_class_name_factory_default("OutlineListItem", styles_module_default4);
|
|
2271
|
+
var OutlineList = ({ children }) => {
|
|
2272
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("ul", { className: getClassName4(), children });
|
|
2273
|
+
};
|
|
2274
|
+
OutlineList.Clickable = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: getClassNameItem({ clickable: true }), children });
|
|
2275
|
+
OutlineList.Item = ({
|
|
2276
|
+
children,
|
|
2277
|
+
onClick
|
|
2278
|
+
}) => {
|
|
2279
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
2280
|
+
"li",
|
|
2281
|
+
{
|
|
2282
|
+
className: getClassNameItem({ clickable: !!onClick }),
|
|
2283
|
+
onClick,
|
|
2284
|
+
children
|
|
2285
|
+
}
|
|
2286
|
+
);
|
|
2287
|
+
};
|
|
2288
|
+
|
|
2289
|
+
// ../core/lib/scroll-into-view.ts
|
|
2290
|
+
init_react_import();
|
|
2291
|
+
var scrollIntoView = (el) => {
|
|
2292
|
+
const oldStyle = __spreadValues({}, el.style);
|
|
2293
|
+
el.style.scrollMargin = "256px";
|
|
2294
|
+
if (el) {
|
|
2295
|
+
el == null ? void 0 : el.scrollIntoView({ behavior: "smooth" });
|
|
2296
|
+
el.style.scrollMargin = oldStyle.scrollMargin || "";
|
|
2297
|
+
}
|
|
2298
|
+
};
|
|
2299
|
+
|
|
2300
|
+
// ../core/lib/get-frame.ts
|
|
2301
|
+
init_react_import();
|
|
2302
|
+
var getFrame = () => {
|
|
2303
|
+
if (typeof window === "undefined") return;
|
|
2304
|
+
let frameEl = document.querySelector("#preview-frame");
|
|
2305
|
+
if ((frameEl == null ? void 0 : frameEl.tagName) === "IFRAME") {
|
|
2306
|
+
return frameEl.contentDocument || document;
|
|
2307
|
+
}
|
|
2308
|
+
return (frameEl == null ? void 0 : frameEl.ownerDocument) || document;
|
|
2309
|
+
};
|
|
2310
|
+
|
|
2157
2311
|
// src/HeadingAnalyzer.tsx
|
|
2158
2312
|
var import_react_from_json = __toESM(require("react-from-json"));
|
|
2159
|
-
var
|
|
2160
|
-
var
|
|
2313
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
2314
|
+
var getClassName5 = get_class_name_factory_default("HeadingAnalyzer", HeadingAnalyzer_module_default);
|
|
2161
2315
|
var getClassNameItem2 = get_class_name_factory_default("HeadingAnalyzerItem", HeadingAnalyzer_module_default);
|
|
2162
2316
|
var ReactFromJSON = import_react_from_json.default.default || import_react_from_json.default;
|
|
2163
2317
|
var getOutline = ({ frame } = {}) => {
|
|
@@ -2212,8 +2366,8 @@ function buildHierarchy(frame) {
|
|
|
2212
2366
|
var usePuck = (0, import_puck.createUsePuck)();
|
|
2213
2367
|
var HeadingAnalyzer = () => {
|
|
2214
2368
|
const data = usePuck((s) => s.appState.data);
|
|
2215
|
-
const [hierarchy, setHierarchy] = (0,
|
|
2216
|
-
(0,
|
|
2369
|
+
const [hierarchy, setHierarchy] = (0, import_react11.useState)([]);
|
|
2370
|
+
(0, import_react11.useEffect)(() => {
|
|
2217
2371
|
const frame = getFrame();
|
|
2218
2372
|
let entry = frame == null ? void 0 : frame.querySelector(`[data-puck-entry]`);
|
|
2219
2373
|
const createHierarchy = () => {
|
|
@@ -2248,11 +2402,11 @@ var HeadingAnalyzer = () => {
|
|
|
2248
2402
|
frameObserver.disconnect();
|
|
2249
2403
|
};
|
|
2250
2404
|
}, [data]);
|
|
2251
|
-
return /* @__PURE__ */ (0,
|
|
2252
|
-
/* @__PURE__ */ (0,
|
|
2405
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: getClassName5(), children: [
|
|
2406
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
2253
2407
|
"small",
|
|
2254
2408
|
{
|
|
2255
|
-
className:
|
|
2409
|
+
className: getClassName5("cssWarning"),
|
|
2256
2410
|
style: {
|
|
2257
2411
|
color: "var(--puck-color-red-04)",
|
|
2258
2412
|
display: "block",
|
|
@@ -2261,19 +2415,19 @@ var HeadingAnalyzer = () => {
|
|
|
2261
2415
|
children: [
|
|
2262
2416
|
"Heading analyzer styles not loaded. Please review the",
|
|
2263
2417
|
" ",
|
|
2264
|
-
/* @__PURE__ */ (0,
|
|
2418
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("a", { href: "https://github.com/measuredco/puck/blob/main/packages/plugin-heading-analyzer/README.md", children: "README" }),
|
|
2265
2419
|
"."
|
|
2266
2420
|
]
|
|
2267
2421
|
}
|
|
2268
2422
|
),
|
|
2269
|
-
hierarchy.length === 0 && /* @__PURE__ */ (0,
|
|
2270
|
-
/* @__PURE__ */ (0,
|
|
2423
|
+
hierarchy.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { children: "No headings." }),
|
|
2424
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(OutlineList, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
2271
2425
|
ReactFromJSON,
|
|
2272
2426
|
{
|
|
2273
2427
|
mapping: {
|
|
2274
|
-
Root: (props) => /* @__PURE__ */ (0,
|
|
2275
|
-
OutlineListItem: (props) => /* @__PURE__ */ (0,
|
|
2276
|
-
/* @__PURE__ */ (0,
|
|
2428
|
+
Root: (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: props.children }),
|
|
2429
|
+
OutlineListItem: (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(OutlineList.Item, { children: [
|
|
2430
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(OutlineList.Clickable, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
2277
2431
|
"small",
|
|
2278
2432
|
{
|
|
2279
2433
|
className: getClassNameItem2({ missing: props.missing }),
|
|
@@ -2291,14 +2445,14 @@ var HeadingAnalyzer = () => {
|
|
|
2291
2445
|
}, 2e3);
|
|
2292
2446
|
}
|
|
2293
2447
|
},
|
|
2294
|
-
children: props.missing ? /* @__PURE__ */ (0,
|
|
2295
|
-
/* @__PURE__ */ (0,
|
|
2448
|
+
children: props.missing ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
|
|
2449
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("b", { children: [
|
|
2296
2450
|
"H",
|
|
2297
2451
|
props.rank
|
|
2298
2452
|
] }),
|
|
2299
2453
|
": Missing"
|
|
2300
|
-
] }) : /* @__PURE__ */ (0,
|
|
2301
|
-
/* @__PURE__ */ (0,
|
|
2454
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
|
|
2455
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("b", { children: [
|
|
2302
2456
|
"H",
|
|
2303
2457
|
props.rank
|
|
2304
2458
|
] }),
|
|
@@ -2307,7 +2461,7 @@ var HeadingAnalyzer = () => {
|
|
|
2307
2461
|
] })
|
|
2308
2462
|
}
|
|
2309
2463
|
) }),
|
|
2310
|
-
/* @__PURE__ */ (0,
|
|
2464
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(OutlineList, { children: props.children })
|
|
2311
2465
|
] })
|
|
2312
2466
|
},
|
|
2313
2467
|
entry: {
|
|
@@ -2328,10 +2482,12 @@ var HeadingAnalyzer = () => {
|
|
|
2328
2482
|
] });
|
|
2329
2483
|
};
|
|
2330
2484
|
var headingAnalyzer = {
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2485
|
+
overrides: {
|
|
2486
|
+
fields: ({ children, itemSelector }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
|
|
2487
|
+
children,
|
|
2488
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { display: itemSelector ? "none" : "block" }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SidebarSection, { title: "Heading Outline", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(HeadingAnalyzer, {}) }) })
|
|
2489
|
+
] })
|
|
2490
|
+
}
|
|
2335
2491
|
};
|
|
2336
2492
|
var HeadingAnalyzer_default = headingAnalyzer;
|
|
2337
2493
|
/*! Bundled license information:
|
|
@@ -2375,7 +2531,7 @@ lucide-react/dist/esm/createLucideIcon.js:
|
|
|
2375
2531
|
* See the LICENSE file in the root directory of this source tree.
|
|
2376
2532
|
*)
|
|
2377
2533
|
|
|
2378
|
-
lucide-react/dist/esm/icons/
|
|
2534
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
2379
2535
|
(**
|
|
2380
2536
|
* @license lucide-react v0.468.0 - ISC
|
|
2381
2537
|
*
|
package/dist/index.mjs
CHANGED
|
@@ -310,12 +310,12 @@ var HeadingAnalyzer_module_default = { "HeadingAnalyzer": "_HeadingAnalyzer_116v
|
|
|
310
310
|
// src/HeadingAnalyzer.tsx
|
|
311
311
|
import { createUsePuck } from "@measured/puck";
|
|
312
312
|
|
|
313
|
-
// ../core/components/
|
|
313
|
+
// ../core/components/SidebarSection/index.tsx
|
|
314
314
|
init_react_import();
|
|
315
315
|
|
|
316
|
-
// css-module:/home/runner/work/puck/puck/packages/core/components/
|
|
316
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css#css-module
|
|
317
317
|
init_react_import();
|
|
318
|
-
var styles_module_default = { "
|
|
318
|
+
var styles_module_default = { "SidebarSection": "_SidebarSection_8boj8_1", "SidebarSection-title": "_SidebarSection-title_8boj8_12", "SidebarSection--noBorderTop": "_SidebarSection--noBorderTop_8boj8_20", "SidebarSection-content": "_SidebarSection-content_8boj8_24", "SidebarSection--noPadding": "_SidebarSection--noPadding_8boj8_28", "SidebarSection-breadcrumbLabel": "_SidebarSection-breadcrumbLabel_8boj8_41", "SidebarSection-breadcrumbs": "_SidebarSection-breadcrumbs_8boj8_70", "SidebarSection-breadcrumb": "_SidebarSection-breadcrumb_8boj8_41", "SidebarSection-heading": "_SidebarSection-heading_8boj8_82", "SidebarSection-loadingOverlay": "_SidebarSection-loadingOverlay_8boj8_86" };
|
|
319
319
|
|
|
320
320
|
// ../core/lib/get-class-name-factory.ts
|
|
321
321
|
init_react_import();
|
|
@@ -344,50 +344,29 @@ var getClassNameFactory = (rootClass, styles, config = { baseClass: "" }) => (op
|
|
|
344
344
|
};
|
|
345
345
|
var get_class_name_factory_default = getClassNameFactory;
|
|
346
346
|
|
|
347
|
-
// ../core/components/
|
|
347
|
+
// ../core/components/Heading/index.tsx
|
|
348
|
+
init_react_import();
|
|
349
|
+
|
|
350
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/Heading/styles.module.css#css-module
|
|
351
|
+
init_react_import();
|
|
352
|
+
var styles_module_default2 = { "Heading": "_Heading_qxrry_1", "Heading--xxxxl": "_Heading--xxxxl_qxrry_12", "Heading--xxxl": "_Heading--xxxl_qxrry_18", "Heading--xxl": "_Heading--xxl_qxrry_22", "Heading--xl": "_Heading--xl_qxrry_26", "Heading--l": "_Heading--l_qxrry_30", "Heading--m": "_Heading--m_qxrry_34", "Heading--s": "_Heading--s_qxrry_38", "Heading--xs": "_Heading--xs_qxrry_42" };
|
|
353
|
+
|
|
354
|
+
// ../core/components/Heading/index.tsx
|
|
348
355
|
import { jsx } from "react/jsx-runtime";
|
|
349
|
-
var getClassName = get_class_name_factory_default("
|
|
350
|
-
var
|
|
351
|
-
|
|
352
|
-
return /* @__PURE__ */ jsx("ul", { className: getClassName(), children });
|
|
353
|
-
};
|
|
354
|
-
OutlineList.Clickable = ({ children }) => /* @__PURE__ */ jsx("div", { className: getClassNameItem({ clickable: true }), children });
|
|
355
|
-
OutlineList.Item = ({
|
|
356
|
-
children,
|
|
357
|
-
onClick
|
|
358
|
-
}) => {
|
|
356
|
+
var getClassName = get_class_name_factory_default("Heading", styles_module_default2);
|
|
357
|
+
var Heading = ({ children, rank, size = "m" }) => {
|
|
358
|
+
const Tag = rank ? `h${rank}` : "span";
|
|
359
359
|
return /* @__PURE__ */ jsx(
|
|
360
|
-
|
|
360
|
+
Tag,
|
|
361
361
|
{
|
|
362
|
-
className:
|
|
363
|
-
|
|
362
|
+
className: getClassName({
|
|
363
|
+
[size]: true
|
|
364
|
+
}),
|
|
364
365
|
children
|
|
365
366
|
}
|
|
366
367
|
);
|
|
367
368
|
};
|
|
368
369
|
|
|
369
|
-
// ../core/lib/scroll-into-view.ts
|
|
370
|
-
init_react_import();
|
|
371
|
-
var scrollIntoView = (el) => {
|
|
372
|
-
const oldStyle = __spreadValues({}, el.style);
|
|
373
|
-
el.style.scrollMargin = "256px";
|
|
374
|
-
if (el) {
|
|
375
|
-
el == null ? void 0 : el.scrollIntoView({ behavior: "smooth" });
|
|
376
|
-
el.style.scrollMargin = oldStyle.scrollMargin || "";
|
|
377
|
-
}
|
|
378
|
-
};
|
|
379
|
-
|
|
380
|
-
// ../core/lib/get-frame.ts
|
|
381
|
-
init_react_import();
|
|
382
|
-
var getFrame = () => {
|
|
383
|
-
if (typeof window === "undefined") return;
|
|
384
|
-
let frameEl = document.querySelector("#preview-frame");
|
|
385
|
-
if ((frameEl == null ? void 0 : frameEl.tagName) === "IFRAME") {
|
|
386
|
-
return frameEl.contentDocument || document;
|
|
387
|
-
}
|
|
388
|
-
return (frameEl == null ? void 0 : frameEl.ownerDocument) || document;
|
|
389
|
-
};
|
|
390
|
-
|
|
391
370
|
// ../../node_modules/lucide-react/dist/esm/lucide-react.js
|
|
392
371
|
init_react_import();
|
|
393
372
|
|
|
@@ -475,29 +454,15 @@ var createLucideIcon = (iconName, iconNode) => {
|
|
|
475
454
|
return Component;
|
|
476
455
|
};
|
|
477
456
|
|
|
478
|
-
// ../../node_modules/lucide-react/dist/esm/icons/
|
|
457
|
+
// ../../node_modules/lucide-react/dist/esm/icons/chevron-right.js
|
|
479
458
|
init_react_import();
|
|
480
|
-
var
|
|
481
|
-
["path", { d: "
|
|
482
|
-
["path", { d: "M4 18V6", key: "1rz3zl" }],
|
|
483
|
-
["path", { d: "M12 18V6", key: "zqpxq5" }],
|
|
484
|
-
["path", { d: "m17 12 3-2v8", key: "1hhhft" }]
|
|
459
|
+
var ChevronRight = createLucideIcon("ChevronRight", [
|
|
460
|
+
["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]
|
|
485
461
|
]);
|
|
486
462
|
|
|
487
|
-
// ../core/lib/
|
|
488
|
-
init_react_import();
|
|
489
|
-
|
|
490
|
-
// ../core/lib/filter.ts
|
|
491
|
-
init_react_import();
|
|
492
|
-
|
|
493
|
-
// ../core/lib/data/reorder.ts
|
|
494
|
-
init_react_import();
|
|
495
|
-
|
|
496
|
-
// ../core/lib/data/replace.ts
|
|
497
|
-
init_react_import();
|
|
498
|
-
|
|
499
|
-
// ../core/lib/use-reset-auto-zoom.ts
|
|
463
|
+
// ../core/lib/use-breadcrumbs.ts
|
|
500
464
|
init_react_import();
|
|
465
|
+
import { useMemo } from "react";
|
|
501
466
|
|
|
502
467
|
// ../core/store/index.ts
|
|
503
468
|
init_react_import();
|
|
@@ -2138,14 +2103,203 @@ var createAppStore = (initialAppStore) => create()(
|
|
|
2138
2103
|
})
|
|
2139
2104
|
);
|
|
2140
2105
|
var appStoreContext = createContext(createAppStore());
|
|
2106
|
+
function useAppStore(selector) {
|
|
2107
|
+
const context = useContext(appStoreContext);
|
|
2108
|
+
return useStore(context, selector);
|
|
2109
|
+
}
|
|
2110
|
+
function useAppStoreApi() {
|
|
2111
|
+
return useContext(appStoreContext);
|
|
2112
|
+
}
|
|
2113
|
+
|
|
2114
|
+
// ../core/lib/use-breadcrumbs.ts
|
|
2115
|
+
var useBreadcrumbs = (renderCount) => {
|
|
2116
|
+
const selectedId = useAppStore((s) => {
|
|
2117
|
+
var _a;
|
|
2118
|
+
return (_a = s.selectedItem) == null ? void 0 : _a.props.id;
|
|
2119
|
+
});
|
|
2120
|
+
const config = useAppStore((s) => s.config);
|
|
2121
|
+
const path = useAppStore((s) => {
|
|
2122
|
+
var _a;
|
|
2123
|
+
return (_a = s.state.indexes.nodes[selectedId]) == null ? void 0 : _a.path;
|
|
2124
|
+
});
|
|
2125
|
+
const appStore = useAppStoreApi();
|
|
2126
|
+
return useMemo(() => {
|
|
2127
|
+
const breadcrumbs = (path == null ? void 0 : path.map((zoneCompound) => {
|
|
2128
|
+
var _a, _b, _c;
|
|
2129
|
+
const [componentId] = zoneCompound.split(":");
|
|
2130
|
+
if (componentId === "root") {
|
|
2131
|
+
return {
|
|
2132
|
+
label: "Page",
|
|
2133
|
+
selector: null
|
|
2134
|
+
};
|
|
2135
|
+
}
|
|
2136
|
+
const node = appStore.getState().state.indexes.nodes[componentId];
|
|
2137
|
+
const parentId = node.path[node.path.length - 1];
|
|
2138
|
+
const contentIds = ((_a = appStore.getState().state.indexes.zones[parentId]) == null ? void 0 : _a.contentIds) || [];
|
|
2139
|
+
const index = contentIds.indexOf(componentId);
|
|
2140
|
+
const label = node ? (_c = (_b = config.components[node.data.type]) == null ? void 0 : _b.label) != null ? _c : node.data.type : "Component";
|
|
2141
|
+
return {
|
|
2142
|
+
label,
|
|
2143
|
+
selector: node ? {
|
|
2144
|
+
index,
|
|
2145
|
+
zone: node.path[node.path.length - 1]
|
|
2146
|
+
} : null
|
|
2147
|
+
};
|
|
2148
|
+
})) || [];
|
|
2149
|
+
if (renderCount) {
|
|
2150
|
+
return breadcrumbs.slice(breadcrumbs.length - renderCount);
|
|
2151
|
+
}
|
|
2152
|
+
return breadcrumbs;
|
|
2153
|
+
}, [path, renderCount]);
|
|
2154
|
+
};
|
|
2155
|
+
|
|
2156
|
+
// ../core/components/Loader/index.tsx
|
|
2157
|
+
init_react_import();
|
|
2158
|
+
|
|
2159
|
+
// ../core/lib/index.ts
|
|
2160
|
+
init_react_import();
|
|
2161
|
+
|
|
2162
|
+
// ../core/lib/filter.ts
|
|
2163
|
+
init_react_import();
|
|
2164
|
+
|
|
2165
|
+
// ../core/lib/data/reorder.ts
|
|
2166
|
+
init_react_import();
|
|
2167
|
+
|
|
2168
|
+
// ../core/lib/data/replace.ts
|
|
2169
|
+
init_react_import();
|
|
2170
|
+
|
|
2171
|
+
// ../core/lib/use-reset-auto-zoom.ts
|
|
2172
|
+
init_react_import();
|
|
2141
2173
|
|
|
2142
2174
|
// ../core/lib/get-zoom-config.ts
|
|
2143
2175
|
init_react_import();
|
|
2144
2176
|
|
|
2177
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/Loader/styles.module.css#css-module
|
|
2178
|
+
init_react_import();
|
|
2179
|
+
var styles_module_default3 = { "Loader": "_Loader_nacdm_13", "loader-animation": "_loader-animation_nacdm_1" };
|
|
2180
|
+
|
|
2181
|
+
// ../core/components/Loader/index.tsx
|
|
2182
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
2183
|
+
var getClassName2 = get_class_name_factory_default("Loader", styles_module_default3);
|
|
2184
|
+
var Loader = (_a) => {
|
|
2185
|
+
var _b = _a, {
|
|
2186
|
+
color,
|
|
2187
|
+
size = 16
|
|
2188
|
+
} = _b, props = __objRest(_b, [
|
|
2189
|
+
"color",
|
|
2190
|
+
"size"
|
|
2191
|
+
]);
|
|
2192
|
+
return /* @__PURE__ */ jsx2(
|
|
2193
|
+
"span",
|
|
2194
|
+
__spreadValues({
|
|
2195
|
+
className: getClassName2(),
|
|
2196
|
+
style: {
|
|
2197
|
+
width: size,
|
|
2198
|
+
height: size,
|
|
2199
|
+
color
|
|
2200
|
+
},
|
|
2201
|
+
"aria-label": "loading"
|
|
2202
|
+
}, props)
|
|
2203
|
+
);
|
|
2204
|
+
};
|
|
2205
|
+
|
|
2206
|
+
// ../core/components/SidebarSection/index.tsx
|
|
2207
|
+
import { jsx as jsx3, jsxs } from "react/jsx-runtime";
|
|
2208
|
+
var getClassName3 = get_class_name_factory_default("SidebarSection", styles_module_default);
|
|
2209
|
+
var SidebarSection = ({
|
|
2210
|
+
children,
|
|
2211
|
+
title,
|
|
2212
|
+
background,
|
|
2213
|
+
showBreadcrumbs,
|
|
2214
|
+
noBorderTop,
|
|
2215
|
+
noPadding,
|
|
2216
|
+
isLoading
|
|
2217
|
+
}) => {
|
|
2218
|
+
const setUi = useAppStore((s) => s.setUi);
|
|
2219
|
+
const breadcrumbs = useBreadcrumbs(1);
|
|
2220
|
+
return /* @__PURE__ */ jsxs(
|
|
2221
|
+
"div",
|
|
2222
|
+
{
|
|
2223
|
+
className: getClassName3({ noBorderTop, noPadding }),
|
|
2224
|
+
style: { background },
|
|
2225
|
+
children: [
|
|
2226
|
+
/* @__PURE__ */ jsx3("div", { className: getClassName3("title"), children: /* @__PURE__ */ jsxs("div", { className: getClassName3("breadcrumbs"), children: [
|
|
2227
|
+
showBreadcrumbs ? breadcrumbs.map((breadcrumb, i) => /* @__PURE__ */ jsxs("div", { className: getClassName3("breadcrumb"), children: [
|
|
2228
|
+
/* @__PURE__ */ jsx3(
|
|
2229
|
+
"button",
|
|
2230
|
+
{
|
|
2231
|
+
type: "button",
|
|
2232
|
+
className: getClassName3("breadcrumbLabel"),
|
|
2233
|
+
onClick: () => setUi({ itemSelector: breadcrumb.selector }),
|
|
2234
|
+
children: breadcrumb.label
|
|
2235
|
+
}
|
|
2236
|
+
),
|
|
2237
|
+
/* @__PURE__ */ jsx3(ChevronRight, { size: 16 })
|
|
2238
|
+
] }, i)) : null,
|
|
2239
|
+
/* @__PURE__ */ jsx3("div", { className: getClassName3("heading"), children: /* @__PURE__ */ jsx3(Heading, { rank: "2", size: "xs", children: title }) })
|
|
2240
|
+
] }) }),
|
|
2241
|
+
/* @__PURE__ */ jsx3("div", { className: getClassName3("content"), children }),
|
|
2242
|
+
isLoading && /* @__PURE__ */ jsx3("div", { className: getClassName3("loadingOverlay"), children: /* @__PURE__ */ jsx3(Loader, { size: 32 }) })
|
|
2243
|
+
]
|
|
2244
|
+
}
|
|
2245
|
+
);
|
|
2246
|
+
};
|
|
2247
|
+
|
|
2248
|
+
// ../core/components/OutlineList/index.tsx
|
|
2249
|
+
init_react_import();
|
|
2250
|
+
|
|
2251
|
+
// css-module:/home/runner/work/puck/puck/packages/core/components/OutlineList/styles.module.css#css-module
|
|
2252
|
+
init_react_import();
|
|
2253
|
+
var styles_module_default4 = { "OutlineList": "_OutlineList_w4lzv_1", "OutlineListItem": "_OutlineListItem_w4lzv_25", "OutlineListItem--clickable": "_OutlineListItem--clickable_w4lzv_45" };
|
|
2254
|
+
|
|
2255
|
+
// ../core/components/OutlineList/index.tsx
|
|
2256
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
2257
|
+
var getClassName4 = get_class_name_factory_default("OutlineList", styles_module_default4);
|
|
2258
|
+
var getClassNameItem = get_class_name_factory_default("OutlineListItem", styles_module_default4);
|
|
2259
|
+
var OutlineList = ({ children }) => {
|
|
2260
|
+
return /* @__PURE__ */ jsx4("ul", { className: getClassName4(), children });
|
|
2261
|
+
};
|
|
2262
|
+
OutlineList.Clickable = ({ children }) => /* @__PURE__ */ jsx4("div", { className: getClassNameItem({ clickable: true }), children });
|
|
2263
|
+
OutlineList.Item = ({
|
|
2264
|
+
children,
|
|
2265
|
+
onClick
|
|
2266
|
+
}) => {
|
|
2267
|
+
return /* @__PURE__ */ jsx4(
|
|
2268
|
+
"li",
|
|
2269
|
+
{
|
|
2270
|
+
className: getClassNameItem({ clickable: !!onClick }),
|
|
2271
|
+
onClick,
|
|
2272
|
+
children
|
|
2273
|
+
}
|
|
2274
|
+
);
|
|
2275
|
+
};
|
|
2276
|
+
|
|
2277
|
+
// ../core/lib/scroll-into-view.ts
|
|
2278
|
+
init_react_import();
|
|
2279
|
+
var scrollIntoView = (el) => {
|
|
2280
|
+
const oldStyle = __spreadValues({}, el.style);
|
|
2281
|
+
el.style.scrollMargin = "256px";
|
|
2282
|
+
if (el) {
|
|
2283
|
+
el == null ? void 0 : el.scrollIntoView({ behavior: "smooth" });
|
|
2284
|
+
el.style.scrollMargin = oldStyle.scrollMargin || "";
|
|
2285
|
+
}
|
|
2286
|
+
};
|
|
2287
|
+
|
|
2288
|
+
// ../core/lib/get-frame.ts
|
|
2289
|
+
init_react_import();
|
|
2290
|
+
var getFrame = () => {
|
|
2291
|
+
if (typeof window === "undefined") return;
|
|
2292
|
+
let frameEl = document.querySelector("#preview-frame");
|
|
2293
|
+
if ((frameEl == null ? void 0 : frameEl.tagName) === "IFRAME") {
|
|
2294
|
+
return frameEl.contentDocument || document;
|
|
2295
|
+
}
|
|
2296
|
+
return (frameEl == null ? void 0 : frameEl.ownerDocument) || document;
|
|
2297
|
+
};
|
|
2298
|
+
|
|
2145
2299
|
// src/HeadingAnalyzer.tsx
|
|
2146
2300
|
import ReactFromJSONModule from "react-from-json";
|
|
2147
|
-
import { Fragment, jsx as
|
|
2148
|
-
var
|
|
2301
|
+
import { Fragment, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
2302
|
+
var getClassName5 = get_class_name_factory_default("HeadingAnalyzer", HeadingAnalyzer_module_default);
|
|
2149
2303
|
var getClassNameItem2 = get_class_name_factory_default("HeadingAnalyzerItem", HeadingAnalyzer_module_default);
|
|
2150
2304
|
var ReactFromJSON = ReactFromJSONModule.default || ReactFromJSONModule;
|
|
2151
2305
|
var getOutline = ({ frame } = {}) => {
|
|
@@ -2236,11 +2390,11 @@ var HeadingAnalyzer = () => {
|
|
|
2236
2390
|
frameObserver.disconnect();
|
|
2237
2391
|
};
|
|
2238
2392
|
}, [data]);
|
|
2239
|
-
return /* @__PURE__ */
|
|
2240
|
-
/* @__PURE__ */
|
|
2393
|
+
return /* @__PURE__ */ jsxs2("div", { className: getClassName5(), children: [
|
|
2394
|
+
/* @__PURE__ */ jsxs2(
|
|
2241
2395
|
"small",
|
|
2242
2396
|
{
|
|
2243
|
-
className:
|
|
2397
|
+
className: getClassName5("cssWarning"),
|
|
2244
2398
|
style: {
|
|
2245
2399
|
color: "var(--puck-color-red-04)",
|
|
2246
2400
|
display: "block",
|
|
@@ -2249,19 +2403,19 @@ var HeadingAnalyzer = () => {
|
|
|
2249
2403
|
children: [
|
|
2250
2404
|
"Heading analyzer styles not loaded. Please review the",
|
|
2251
2405
|
" ",
|
|
2252
|
-
/* @__PURE__ */
|
|
2406
|
+
/* @__PURE__ */ jsx5("a", { href: "https://github.com/measuredco/puck/blob/main/packages/plugin-heading-analyzer/README.md", children: "README" }),
|
|
2253
2407
|
"."
|
|
2254
2408
|
]
|
|
2255
2409
|
}
|
|
2256
2410
|
),
|
|
2257
|
-
hierarchy.length === 0 && /* @__PURE__ */
|
|
2258
|
-
/* @__PURE__ */
|
|
2411
|
+
hierarchy.length === 0 && /* @__PURE__ */ jsx5("div", { children: "No headings." }),
|
|
2412
|
+
/* @__PURE__ */ jsx5(OutlineList, { children: /* @__PURE__ */ jsx5(
|
|
2259
2413
|
ReactFromJSON,
|
|
2260
2414
|
{
|
|
2261
2415
|
mapping: {
|
|
2262
|
-
Root: (props) => /* @__PURE__ */
|
|
2263
|
-
OutlineListItem: (props) => /* @__PURE__ */
|
|
2264
|
-
/* @__PURE__ */
|
|
2416
|
+
Root: (props) => /* @__PURE__ */ jsx5(Fragment, { children: props.children }),
|
|
2417
|
+
OutlineListItem: (props) => /* @__PURE__ */ jsxs2(OutlineList.Item, { children: [
|
|
2418
|
+
/* @__PURE__ */ jsx5(OutlineList.Clickable, { children: /* @__PURE__ */ jsx5(
|
|
2265
2419
|
"small",
|
|
2266
2420
|
{
|
|
2267
2421
|
className: getClassNameItem2({ missing: props.missing }),
|
|
@@ -2279,14 +2433,14 @@ var HeadingAnalyzer = () => {
|
|
|
2279
2433
|
}, 2e3);
|
|
2280
2434
|
}
|
|
2281
2435
|
},
|
|
2282
|
-
children: props.missing ? /* @__PURE__ */
|
|
2283
|
-
/* @__PURE__ */
|
|
2436
|
+
children: props.missing ? /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
2437
|
+
/* @__PURE__ */ jsxs2("b", { children: [
|
|
2284
2438
|
"H",
|
|
2285
2439
|
props.rank
|
|
2286
2440
|
] }),
|
|
2287
2441
|
": Missing"
|
|
2288
|
-
] }) : /* @__PURE__ */
|
|
2289
|
-
/* @__PURE__ */
|
|
2442
|
+
] }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
2443
|
+
/* @__PURE__ */ jsxs2("b", { children: [
|
|
2290
2444
|
"H",
|
|
2291
2445
|
props.rank
|
|
2292
2446
|
] }),
|
|
@@ -2295,7 +2449,7 @@ var HeadingAnalyzer = () => {
|
|
|
2295
2449
|
] })
|
|
2296
2450
|
}
|
|
2297
2451
|
) }),
|
|
2298
|
-
/* @__PURE__ */
|
|
2452
|
+
/* @__PURE__ */ jsx5(OutlineList, { children: props.children })
|
|
2299
2453
|
] })
|
|
2300
2454
|
},
|
|
2301
2455
|
entry: {
|
|
@@ -2316,10 +2470,12 @@ var HeadingAnalyzer = () => {
|
|
|
2316
2470
|
] });
|
|
2317
2471
|
};
|
|
2318
2472
|
var headingAnalyzer = {
|
|
2319
|
-
|
|
2320
|
-
|
|
2321
|
-
|
|
2322
|
-
|
|
2473
|
+
overrides: {
|
|
2474
|
+
fields: ({ children, itemSelector }) => /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
2475
|
+
children,
|
|
2476
|
+
/* @__PURE__ */ jsx5("div", { style: { display: itemSelector ? "none" : "block" }, children: /* @__PURE__ */ jsx5(SidebarSection, { title: "Heading Outline", children: /* @__PURE__ */ jsx5(HeadingAnalyzer, {}) }) })
|
|
2477
|
+
] })
|
|
2478
|
+
}
|
|
2323
2479
|
};
|
|
2324
2480
|
var HeadingAnalyzer_default = headingAnalyzer;
|
|
2325
2481
|
export {
|
|
@@ -2366,7 +2522,7 @@ lucide-react/dist/esm/createLucideIcon.js:
|
|
|
2366
2522
|
* See the LICENSE file in the root directory of this source tree.
|
|
2367
2523
|
*)
|
|
2368
2524
|
|
|
2369
|
-
lucide-react/dist/esm/icons/
|
|
2525
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
2370
2526
|
(**
|
|
2371
2527
|
* @license lucide-react v0.468.0 - ISC
|
|
2372
2528
|
*
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@measured/puck-plugin-heading-analyzer",
|
|
3
|
-
"version": "0.20.0-canary.
|
|
3
|
+
"version": "0.20.0-canary.7ccbeece",
|
|
4
4
|
"author": "Chris Villa <chris@puckeditor.com>",
|
|
5
5
|
"repository": "measuredco/puck",
|
|
6
6
|
"bugs": "https://github.com/measuredco/puck/issues",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"dist"
|
|
26
26
|
],
|
|
27
27
|
"devDependencies": {
|
|
28
|
-
"@measured/puck": "^0.20.0-canary.
|
|
28
|
+
"@measured/puck": "^0.20.0-canary.7ccbeece",
|
|
29
29
|
"@types/react": "^19.0.1",
|
|
30
30
|
"@types/react-dom": "^19.0.2",
|
|
31
31
|
"eslint": "^7.32.0",
|