@mission-studio/puck 1.0.20 → 1.0.23
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/Popup-BlNJZyB6.d.ts +270 -0
- package/dist/Popup-llKrR-vO.d.mts +270 -0
- package/dist/ResponsiveToggleField-65CqZEK-.d.mts +10 -0
- package/dist/ResponsiveToggleField-QCve94L_.d.ts +10 -0
- package/dist/chunk-KER4VXRB.mjs +61 -0
- package/dist/{chunk-X6VGLL5Y.mjs → chunk-MWW5LYLN.mjs} +182 -222
- package/dist/{chunk-A2J2E524.mjs → chunk-WFLVAZV2.mjs} +67 -3
- package/dist/components/page/astro/index.d.mts +34 -0
- package/dist/components/page/astro/index.d.ts +34 -0
- package/dist/components/page/astro/index.js +2126 -0
- package/dist/components/page/astro/index.mjs +51 -0
- package/dist/config/server.js +166 -181
- package/dist/config/server.mjs +28 -53
- package/dist/config-entry.js +53 -31
- package/dist/config-entry.mjs +5 -5
- package/dist/{ResponsiveToggleField-CfBKL5oY.d.ts → defaults-j55hBQHu.d.mts} +2 -8
- package/dist/{ResponsiveToggleField-BihXsGIJ.d.mts → defaults-z8Ft2j5r.d.ts} +2 -8
- package/dist/editor.d.mts +5 -4
- package/dist/editor.d.ts +5 -4
- package/dist/index.d.mts +5 -3
- package/dist/index.d.ts +5 -3
- package/dist/index.js +53 -31
- package/dist/index.mjs +5 -5
- package/dist/renderer.d.mts +13 -269
- package/dist/renderer.d.ts +13 -269
- package/dist/renderer.js +53 -31
- package/dist/renderer.mjs +5 -5
- package/dist/resolve/index.d.mts +1 -1
- package/dist/resolve/index.d.ts +1 -1
- package/dist/{types-D-CIduaE.d.mts → types-HQ6hIbYr.d.mts} +1 -1
- package/dist/{types-D-CIduaE.d.ts → types-HQ6hIbYr.d.ts} +1 -1
- package/package.json +6 -1
package/dist/renderer.d.ts
CHANGED
|
@@ -1,17 +1,12 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import { n as EntryBoundValue, j as ThemeableColorValue,
|
|
3
|
-
export { P as PageTheme, T as ThemeBorderKey, a as ThemeBorders, b as ThemeColorKey, c as ThemeColors, d as ThemeShadowKey, e as ThemeShadows, f as ThemeSpacing, g as ThemeSpacingKey, h as ThemeTypography, i as ThemeableBorderRadiusValue, k as ThemeableShadowValue, l as ThemeableSpacingValue } from './types-
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
export { D as DEFAULT_THEME, T as ThemeProvider, u as useTheme } from './
|
|
7
|
-
import
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
type HeadingSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
|
|
11
|
-
type HeadingWeight = "normal" | "medium" | "semibold" | "bold" | "extrabold";
|
|
12
|
-
type HeadingAlign = "left" | "center" | "right";
|
|
13
|
-
type HeadingLetterSpacing = "tight" | "normal" | "wide";
|
|
14
|
-
type HeadingLineHeight = "tight" | "normal" | "relaxed";
|
|
2
|
+
import { n as EntryBoundValue, j as ThemeableColorValue, m as ColorValue } from './types-HQ6hIbYr.js';
|
|
3
|
+
export { P as PageTheme, T as ThemeBorderKey, a as ThemeBorders, b as ThemeColorKey, c as ThemeColors, d as ThemeShadowKey, e as ThemeShadows, f as ThemeSpacing, g as ThemeSpacingKey, h as ThemeTypography, i as ThemeableBorderRadiusValue, k as ThemeableShadowValue, l as ThemeableSpacingValue } from './types-HQ6hIbYr.js';
|
|
4
|
+
import { H as HeadingLevel, J as HeadingSize, K as HeadingWeight, L as HeadingAlign, M as HeadingLetterSpacing, N as HeadingLineHeight, O as ParagraphSize, Q as ParagraphWeight, R as ParagraphAlign, U as ParagraphLineHeight } from './Popup-BlNJZyB6.js';
|
|
5
|
+
export { B as Button, a as ButtonProps, C as Card, b as CardProps, c as CarouselImage, d as Columns, e as ColumnsProps, f as Container, g as ContainerProps, h as CustomImage, i as CustomImageProps, D as Divider, j as DividerProps, F as FeatureGrid, k as FeatureGridProps, l as FeaturesList, m as FeaturesListProps, n as Footer, o as FooterProps, I as Icon, p as IconProps, q as Image, r as ImageCarousel, s as ImageCarouselProps, t as ImageProps, P as Popup, u as PopupProps, S as Section, v as SectionProps, w as Spacer, x as SpacerProps, T as TextBlock, y as TextBlockProps, z as Topbar, A as TopbarProps, V as VideoEmbed, E as VideoEmbedProps, G as availableIcons } from './Popup-BlNJZyB6.js';
|
|
6
|
+
export { D as DEFAULT_THEME, T as ThemeProvider, u as useTheme } from './defaults-z8Ft2j5r.js';
|
|
7
|
+
import 'react';
|
|
8
|
+
import './ResponsiveToggleField-QCve94L_.js';
|
|
9
|
+
import '@measured/puck';
|
|
15
10
|
|
|
16
11
|
type HeadingProps = {
|
|
17
12
|
text?: EntryBoundValue<string> | string;
|
|
@@ -30,11 +25,11 @@ declare function Heading({ text, level, size, weight, color, align, letterSpacin
|
|
|
30
25
|
|
|
31
26
|
type ParagraphProps = {
|
|
32
27
|
text?: EntryBoundValue<string> | string;
|
|
33
|
-
size?:
|
|
34
|
-
weight?:
|
|
28
|
+
size?: ParagraphSize;
|
|
29
|
+
weight?: ParagraphWeight;
|
|
35
30
|
color?: ThemeableColorValue | ColorValue | string;
|
|
36
|
-
align?:
|
|
37
|
-
lineHeight?:
|
|
31
|
+
align?: ParagraphAlign;
|
|
32
|
+
lineHeight?: ParagraphLineHeight;
|
|
38
33
|
maxWidth?: string;
|
|
39
34
|
id?: string;
|
|
40
35
|
puck?: unknown;
|
|
@@ -42,255 +37,4 @@ type ParagraphProps = {
|
|
|
42
37
|
};
|
|
43
38
|
declare function Paragraph({ text, size, weight, color, align, lineHeight, maxWidth, id, }: ParagraphProps): react_jsx_runtime.JSX.Element | null;
|
|
44
39
|
|
|
45
|
-
type
|
|
46
|
-
text?: EntryBoundValue<string> | string;
|
|
47
|
-
href?: string;
|
|
48
|
-
target?: "_self" | "_blank";
|
|
49
|
-
variant?: "solid" | "outline" | "ghost" | "link";
|
|
50
|
-
size?: "sm" | "md" | "lg" | "xl";
|
|
51
|
-
color?: ThemeableColorValue | ColorValue | string;
|
|
52
|
-
textColor?: ThemeableColorValue | ColorValue | string;
|
|
53
|
-
borderRadius?: "none" | "sm" | "md" | "lg" | "full";
|
|
54
|
-
fullWidth?: boolean;
|
|
55
|
-
align?: "left" | "center" | "right";
|
|
56
|
-
id?: string;
|
|
57
|
-
puck?: unknown;
|
|
58
|
-
editMode?: boolean;
|
|
59
|
-
};
|
|
60
|
-
declare function Button({ text, href, target, variant, size, color, textColor, borderRadius, fullWidth, align, id, }: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
61
|
-
|
|
62
|
-
type ImageProps = {
|
|
63
|
-
src?: EntryBoundValue<string> | string;
|
|
64
|
-
alt?: string;
|
|
65
|
-
width?: "auto" | "full" | "sm" | "md" | "lg" | "xl";
|
|
66
|
-
aspectRatio?: "auto" | "1:1" | "4:3" | "16:9" | "21:9";
|
|
67
|
-
objectFit?: "contain" | "cover" | "fill" | "none";
|
|
68
|
-
borderRadius?: "none" | "sm" | "md" | "lg" | "xl" | "full";
|
|
69
|
-
shadow?: "none" | "sm" | "md" | "lg" | "xl";
|
|
70
|
-
align?: "left" | "center" | "right";
|
|
71
|
-
caption?: EntryBoundValue<string> | string;
|
|
72
|
-
captionColor?: ThemeableColorValue | ColorValue | string;
|
|
73
|
-
id?: string;
|
|
74
|
-
puck?: unknown;
|
|
75
|
-
editMode?: boolean;
|
|
76
|
-
};
|
|
77
|
-
declare function Image({ src, alt, width, aspectRatio, objectFit, borderRadius, shadow, align, caption, captionColor, id, }: ImageProps): react_jsx_runtime.JSX.Element;
|
|
78
|
-
|
|
79
|
-
type CarouselImage = {
|
|
80
|
-
src: string;
|
|
81
|
-
alt?: string;
|
|
82
|
-
};
|
|
83
|
-
type ImageCarouselProps = {
|
|
84
|
-
images?: CarouselImage[];
|
|
85
|
-
aspectRatio?: "16:9" | "4:3" | "1:1" | "21:9";
|
|
86
|
-
borderRadius?: "none" | "sm" | "md" | "lg";
|
|
87
|
-
showDots?: boolean;
|
|
88
|
-
showArrows?: boolean;
|
|
89
|
-
arrowColor?: ThemeableColorValue | ColorValue | string;
|
|
90
|
-
dotColor?: ThemeableColorValue | ColorValue | string;
|
|
91
|
-
autoPlay?: boolean;
|
|
92
|
-
autoPlayInterval?: number;
|
|
93
|
-
id?: string;
|
|
94
|
-
puck?: unknown;
|
|
95
|
-
editMode?: boolean;
|
|
96
|
-
};
|
|
97
|
-
declare function ImageCarousel({ images, aspectRatio, borderRadius, showDots, showArrows, arrowColor, dotColor, id, }: ImageCarouselProps): react_jsx_runtime.JSX.Element;
|
|
98
|
-
|
|
99
|
-
type VideoEmbedProps = {
|
|
100
|
-
url?: EntryBoundValue<string> | string;
|
|
101
|
-
aspectRatio?: "16:9" | "4:3" | "1:1" | "21:9";
|
|
102
|
-
borderRadius?: "none" | "sm" | "md" | "lg";
|
|
103
|
-
autoplay?: boolean;
|
|
104
|
-
muted?: boolean;
|
|
105
|
-
loop?: boolean;
|
|
106
|
-
align?: "left" | "center" | "right";
|
|
107
|
-
maxWidth?: "sm" | "md" | "lg" | "xl" | "full";
|
|
108
|
-
id?: string;
|
|
109
|
-
puck?: unknown;
|
|
110
|
-
editMode?: boolean;
|
|
111
|
-
};
|
|
112
|
-
declare function VideoEmbed({ url, aspectRatio, borderRadius, autoplay, muted, loop, align, maxWidth, id, }: VideoEmbedProps): react_jsx_runtime.JSX.Element;
|
|
113
|
-
|
|
114
|
-
type IconProps = {
|
|
115
|
-
name?: string;
|
|
116
|
-
size?: "sm" | "md" | "lg" | "xl" | "2xl";
|
|
117
|
-
color?: ThemeableColorValue | ColorValue | string;
|
|
118
|
-
align?: "left" | "center" | "right";
|
|
119
|
-
id?: string;
|
|
120
|
-
puck?: unknown;
|
|
121
|
-
editMode?: boolean;
|
|
122
|
-
};
|
|
123
|
-
declare function Icon({ name, size, color, align, id, }: IconProps): react_jsx_runtime.JSX.Element;
|
|
124
|
-
declare const availableIcons: string[];
|
|
125
|
-
|
|
126
|
-
type PuckProps = {
|
|
127
|
-
puck?: PuckContext;
|
|
128
|
-
editMode?: boolean;
|
|
129
|
-
id?: string;
|
|
130
|
-
};
|
|
131
|
-
|
|
132
|
-
type SectionProps = {
|
|
133
|
-
children?: ReactNode;
|
|
134
|
-
verticalPadding?: number;
|
|
135
|
-
horizontalPadding?: number;
|
|
136
|
-
gap?: number;
|
|
137
|
-
backgroundColor?: ThemeableColorValue | ColorValue | string;
|
|
138
|
-
backgroundImage?: string;
|
|
139
|
-
shadow?: string;
|
|
140
|
-
borderRadius?: number;
|
|
141
|
-
contentMaxWidth?: string;
|
|
142
|
-
anchorLink?: string;
|
|
143
|
-
visibility?: ResponsiveVisibility;
|
|
144
|
-
} & PuckProps;
|
|
145
|
-
declare function Section({ children: _children, verticalPadding, horizontalPadding, gap, backgroundColor, backgroundImage, shadow, borderRadius, contentMaxWidth, anchorLink, visibility, puck, }: SectionProps): react_jsx_runtime.JSX.Element;
|
|
146
|
-
|
|
147
|
-
type ContainerProps = {
|
|
148
|
-
maxWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "full";
|
|
149
|
-
padding?: "none" | "sm" | "md" | "lg" | "xl";
|
|
150
|
-
paddingX?: "none" | "sm" | "md" | "lg" | "xl";
|
|
151
|
-
paddingY?: "none" | "sm" | "md" | "lg" | "xl";
|
|
152
|
-
backgroundColor?: ThemeableColorValue | ColorValue | string;
|
|
153
|
-
centered?: boolean;
|
|
154
|
-
} & PuckProps;
|
|
155
|
-
declare function Container({ maxWidth, padding, paddingX, paddingY, backgroundColor, centered, id, puck, }: ContainerProps): react_jsx_runtime.JSX.Element;
|
|
156
|
-
|
|
157
|
-
type ColumnsProps = {
|
|
158
|
-
columns?: 2 | 3 | 4;
|
|
159
|
-
gap?: "none" | "sm" | "md" | "lg" | "xl";
|
|
160
|
-
verticalAlign?: "top" | "center" | "bottom" | "stretch";
|
|
161
|
-
stackOnMobile?: boolean;
|
|
162
|
-
} & PuckProps;
|
|
163
|
-
declare function Columns({ columns, gap, verticalAlign, stackOnMobile, id, puck, }: ColumnsProps): react_jsx_runtime.JSX.Element;
|
|
164
|
-
|
|
165
|
-
type CardProps = {
|
|
166
|
-
backgroundColor?: ThemeableColorValue | ColorValue | string;
|
|
167
|
-
borderColor?: ThemeableColorValue | ColorValue | string;
|
|
168
|
-
borderWidth?: "none" | "thin" | "medium" | "thick";
|
|
169
|
-
borderRadius?: "none" | "sm" | "md" | "lg" | "xl";
|
|
170
|
-
shadow?: "none" | "sm" | "md" | "lg" | "xl";
|
|
171
|
-
padding?: "none" | "sm" | "md" | "lg" | "xl";
|
|
172
|
-
} & PuckProps;
|
|
173
|
-
declare function Card({ backgroundColor, borderColor, borderWidth, borderRadius, shadow, padding, id, puck, }: CardProps): react_jsx_runtime.JSX.Element;
|
|
174
|
-
|
|
175
|
-
type DividerProps = {
|
|
176
|
-
style?: "solid" | "dashed" | "dotted";
|
|
177
|
-
thickness?: "thin" | "medium" | "thick";
|
|
178
|
-
color?: ThemeableColorValue | ColorValue | string;
|
|
179
|
-
width?: "full" | "3/4" | "1/2" | "1/4";
|
|
180
|
-
align?: "left" | "center" | "right";
|
|
181
|
-
spacing?: "sm" | "md" | "lg" | "xl";
|
|
182
|
-
id?: string;
|
|
183
|
-
puck?: unknown;
|
|
184
|
-
editMode?: boolean;
|
|
185
|
-
};
|
|
186
|
-
declare function Divider({ style: lineStyle, thickness, color, width, align, spacing, id, }: DividerProps): react_jsx_runtime.JSX.Element;
|
|
187
|
-
|
|
188
|
-
type SpacerProps = {
|
|
189
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
|
|
190
|
-
id?: string;
|
|
191
|
-
puck?: unknown;
|
|
192
|
-
editMode?: boolean;
|
|
193
|
-
};
|
|
194
|
-
declare function Spacer({ size, id }: SpacerProps): react_jsx_runtime.JSX.Element;
|
|
195
|
-
|
|
196
|
-
type TextBlockProps = {
|
|
197
|
-
title?: EntryBoundValue<string> | string;
|
|
198
|
-
subtitle?: EntryBoundValue<string> | string;
|
|
199
|
-
body?: EntryBoundValue<string> | string;
|
|
200
|
-
alignment?: "left" | "center" | "right";
|
|
201
|
-
textSize?: "small" | "medium-small" | "medium" | "large" | "xlarge";
|
|
202
|
-
textColor?: ThemeableColorValue | ColorValue | string;
|
|
203
|
-
subtitleBodyColor?: ThemeableColorValue | ColorValue | string;
|
|
204
|
-
useGradientText?: boolean;
|
|
205
|
-
gradientColor1?: ThemeableColorValue | ColorValue | string;
|
|
206
|
-
gradientColor2?: ThemeableColorValue | ColorValue | string;
|
|
207
|
-
anchorLink?: string;
|
|
208
|
-
puck?: unknown;
|
|
209
|
-
editMode?: boolean;
|
|
210
|
-
id?: string;
|
|
211
|
-
};
|
|
212
|
-
declare function TextBlock({ title, subtitle, body, alignment, textSize, textColor, subtitleBodyColor, useGradientText, gradientColor1, gradientColor2, anchorLink, }: TextBlockProps): react_jsx_runtime.JSX.Element;
|
|
213
|
-
|
|
214
|
-
type CustomImageProps = {
|
|
215
|
-
image?: string;
|
|
216
|
-
alt?: string;
|
|
217
|
-
maxWidth?: number;
|
|
218
|
-
alignment?: "left" | "center" | "right";
|
|
219
|
-
fitContent?: boolean;
|
|
220
|
-
} & PuckProps;
|
|
221
|
-
declare function CustomImage({ image, alt, maxWidth, alignment, fitContent, }: CustomImageProps): react_jsx_runtime.JSX.Element;
|
|
222
|
-
|
|
223
|
-
type Feature$1 = {
|
|
224
|
-
icon?: string;
|
|
225
|
-
image?: string;
|
|
226
|
-
title?: string;
|
|
227
|
-
description?: string;
|
|
228
|
-
};
|
|
229
|
-
type FeaturesListProps = {
|
|
230
|
-
features?: Feature$1[];
|
|
231
|
-
align?: "left" | "center" | "right";
|
|
232
|
-
size?: "small" | "medium" | "large";
|
|
233
|
-
iconColor?: string;
|
|
234
|
-
anchorLink?: string;
|
|
235
|
-
} & Record<string, unknown>;
|
|
236
|
-
declare function FeaturesList({ features, align, size, iconColor, anchorLink, }: FeaturesListProps): react_jsx_runtime.JSX.Element;
|
|
237
|
-
|
|
238
|
-
type Feature = {
|
|
239
|
-
icon?: string;
|
|
240
|
-
image?: string;
|
|
241
|
-
title?: string;
|
|
242
|
-
description?: string;
|
|
243
|
-
};
|
|
244
|
-
type FeatureGridProps = {
|
|
245
|
-
heading?: string;
|
|
246
|
-
description?: string;
|
|
247
|
-
features?: Feature[];
|
|
248
|
-
columns?: 2 | 3 | 4;
|
|
249
|
-
align?: "left" | "center" | "right";
|
|
250
|
-
size?: "small" | "medium" | "large";
|
|
251
|
-
iconColor?: string;
|
|
252
|
-
textColor?: string;
|
|
253
|
-
anchorLink?: string;
|
|
254
|
-
} & Record<string, unknown>;
|
|
255
|
-
declare function FeatureGrid({ heading, description, features, columns, align, size, iconColor, textColor, anchorLink, }: FeatureGridProps): react_jsx_runtime.JSX.Element;
|
|
256
|
-
|
|
257
|
-
type FooterProps = {
|
|
258
|
-
logo?: string;
|
|
259
|
-
copyright?: string;
|
|
260
|
-
backgroundColor?: string;
|
|
261
|
-
textColor?: string;
|
|
262
|
-
facebookUrl?: string;
|
|
263
|
-
instagramUrl?: string;
|
|
264
|
-
twitterUrl?: string;
|
|
265
|
-
tiktokUrl?: string;
|
|
266
|
-
} & Record<string, unknown> & PuckProps;
|
|
267
|
-
declare function Footer({ logo, copyright, backgroundColor, textColor, facebookUrl, instagramUrl, twitterUrl, puck, }: FooterProps): react_jsx_runtime.JSX.Element;
|
|
268
|
-
|
|
269
|
-
type NavItem = {
|
|
270
|
-
name: string;
|
|
271
|
-
url: string;
|
|
272
|
-
linkType?: "internal" | "external" | "scrollTo";
|
|
273
|
-
};
|
|
274
|
-
type TopbarProps = {
|
|
275
|
-
logo?: string;
|
|
276
|
-
logoUrl?: string;
|
|
277
|
-
navItems?: NavItem[];
|
|
278
|
-
backgroundColor?: string;
|
|
279
|
-
textColor?: string;
|
|
280
|
-
maxWidth?: string;
|
|
281
|
-
} & Record<string, unknown> & PuckProps;
|
|
282
|
-
declare function Topbar({ logo, logoUrl, navItems, backgroundColor, textColor, maxWidth, puck, }: TopbarProps): react_jsx_runtime.JSX.Element;
|
|
283
|
-
|
|
284
|
-
type PopupProps = {
|
|
285
|
-
ctaText?: string;
|
|
286
|
-
buttonColor?: string;
|
|
287
|
-
textColor?: string;
|
|
288
|
-
icon?: string;
|
|
289
|
-
iconPosition?: "left" | "right";
|
|
290
|
-
size?: "small" | "medium" | "large";
|
|
291
|
-
width?: "small" | "medium" | "large";
|
|
292
|
-
textLink?: boolean;
|
|
293
|
-
} & Record<string, unknown> & PuckProps;
|
|
294
|
-
declare function Popup({ ctaText, buttonColor, textColor, icon, iconPosition, size, width, textLink, puck, }: PopupProps): react_jsx_runtime.JSX.Element;
|
|
295
|
-
|
|
296
|
-
export { Button, type ButtonProps, Card, type CardProps, type CarouselImage, Columns, type ColumnsProps, Container, type ContainerProps, CustomImage, type CustomImageProps, Divider, type DividerProps, FeatureGrid, type FeatureGridProps, FeaturesList, type FeaturesListProps, Footer, type FooterProps, Heading, type HeadingProps, Icon, type IconProps, Image, ImageCarousel, type ImageCarouselProps, type ImageProps, Paragraph, type ParagraphProps, Popup, type PopupProps, Section, type SectionProps, Spacer, type SpacerProps, TextBlock, type TextBlockProps, ThemeableColorValue, Topbar, type TopbarProps, VideoEmbed, type VideoEmbedProps, availableIcons };
|
|
40
|
+
export { Heading, type HeadingProps, Paragraph, type ParagraphProps, ThemeableColorValue };
|
package/dist/renderer.js
CHANGED
|
@@ -275,25 +275,38 @@ function Heading({
|
|
|
275
275
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Tag, { id, style, children: resolvedText });
|
|
276
276
|
}
|
|
277
277
|
|
|
278
|
-
// components/page/Paragraph.
|
|
279
|
-
var
|
|
280
|
-
var sizeMap = {
|
|
278
|
+
// components/page/primitives/Paragraph.ts
|
|
279
|
+
var paragraphSizeMap = {
|
|
281
280
|
sm: "0.875rem",
|
|
282
281
|
base: "1rem",
|
|
283
282
|
lg: "1.125rem",
|
|
284
283
|
xl: "1.25rem"
|
|
285
284
|
};
|
|
286
|
-
var
|
|
285
|
+
var paragraphWeightMap = {
|
|
287
286
|
normal: 400,
|
|
288
287
|
medium: 500,
|
|
289
288
|
semibold: 600
|
|
290
289
|
};
|
|
291
|
-
var
|
|
290
|
+
var paragraphLineHeightMap = {
|
|
292
291
|
tight: "1.4",
|
|
293
292
|
normal: "1.6",
|
|
294
293
|
relaxed: "1.75",
|
|
295
294
|
loose: "2"
|
|
296
295
|
};
|
|
296
|
+
function getParagraphStyle(props) {
|
|
297
|
+
return {
|
|
298
|
+
fontSize: paragraphSizeMap[props.size],
|
|
299
|
+
fontWeight: paragraphWeightMap[props.weight],
|
|
300
|
+
color: props.color,
|
|
301
|
+
textAlign: props.align,
|
|
302
|
+
lineHeight: paragraphLineHeightMap[props.lineHeight],
|
|
303
|
+
maxWidth: props.maxWidth || void 0,
|
|
304
|
+
margin: 0
|
|
305
|
+
};
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
// components/page/next/Paragraph.tsx
|
|
309
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
297
310
|
function isThemeableValue2(value) {
|
|
298
311
|
return typeof value === "object" && value !== null && "useTheme" in value;
|
|
299
312
|
}
|
|
@@ -324,23 +337,32 @@ function Paragraph({
|
|
|
324
337
|
return "";
|
|
325
338
|
})();
|
|
326
339
|
const resolvedColor = (() => {
|
|
327
|
-
if (!color)
|
|
328
|
-
|
|
340
|
+
if (!color)
|
|
341
|
+
return hexToRgba(
|
|
342
|
+
resolveColor2("foreground").color,
|
|
343
|
+
resolveColor2("foreground").opacity
|
|
344
|
+
);
|
|
345
|
+
if (typeof color === "string") return color;
|
|
329
346
|
if (isThemeableValue2(color)) {
|
|
330
|
-
return color.useTheme ?
|
|
347
|
+
return color.useTheme ? hexToRgba(
|
|
348
|
+
resolveColor2(color.themeKey).color,
|
|
349
|
+
resolveColor2(color.themeKey).opacity
|
|
350
|
+
) : hexToRgba(color.value.color, color.value.opacity);
|
|
331
351
|
}
|
|
332
|
-
if ("color" in color) return color;
|
|
333
|
-
return
|
|
352
|
+
if ("color" in color) return hexToRgba(color.color, color.opacity);
|
|
353
|
+
return hexToRgba(
|
|
354
|
+
resolveColor2("foreground").color,
|
|
355
|
+
resolveColor2("foreground").opacity
|
|
356
|
+
);
|
|
334
357
|
})();
|
|
335
|
-
const style = {
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
color:
|
|
339
|
-
|
|
340
|
-
lineHeight
|
|
341
|
-
maxWidth
|
|
342
|
-
|
|
343
|
-
};
|
|
358
|
+
const style = getParagraphStyle({
|
|
359
|
+
size,
|
|
360
|
+
weight,
|
|
361
|
+
color: resolvedColor,
|
|
362
|
+
align,
|
|
363
|
+
lineHeight,
|
|
364
|
+
maxWidth
|
|
365
|
+
});
|
|
344
366
|
if (!resolvedText) return null;
|
|
345
367
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { id, style, children: resolvedText });
|
|
346
368
|
}
|
|
@@ -1001,7 +1023,7 @@ function VideoEmbed({
|
|
|
1001
1023
|
|
|
1002
1024
|
// components/page/Icon.tsx
|
|
1003
1025
|
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
1004
|
-
var
|
|
1026
|
+
var sizeMap = {
|
|
1005
1027
|
sm: { size: "16px", strokeWidth: 2 },
|
|
1006
1028
|
md: { size: "24px", strokeWidth: 2 },
|
|
1007
1029
|
lg: { size: "32px", strokeWidth: 1.5 },
|
|
@@ -1219,7 +1241,7 @@ function Icon({
|
|
|
1219
1241
|
return resolveColor2("primary");
|
|
1220
1242
|
})();
|
|
1221
1243
|
const IconComponent = icons[name.toLowerCase()] || icons.check;
|
|
1222
|
-
const { size: iconSize, strokeWidth } =
|
|
1244
|
+
const { size: iconSize, strokeWidth } = sizeMap[size];
|
|
1223
1245
|
const colorValue = hexToRgba(resolvedColor.color, resolvedColor.opacity);
|
|
1224
1246
|
const wrapperStyle = {
|
|
1225
1247
|
display: "flex",
|
|
@@ -1563,7 +1585,7 @@ function Divider({
|
|
|
1563
1585
|
|
|
1564
1586
|
// components/page/Spacer.tsx
|
|
1565
1587
|
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
1566
|
-
var
|
|
1588
|
+
var sizeMap2 = {
|
|
1567
1589
|
xs: "8px",
|
|
1568
1590
|
sm: "16px",
|
|
1569
1591
|
md: "24px",
|
|
@@ -1574,7 +1596,7 @@ var sizeMap3 = {
|
|
|
1574
1596
|
};
|
|
1575
1597
|
function Spacer({ size = "md", id }) {
|
|
1576
1598
|
const style = {
|
|
1577
|
-
height:
|
|
1599
|
+
height: sizeMap2[size],
|
|
1578
1600
|
width: "100%"
|
|
1579
1601
|
};
|
|
1580
1602
|
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { id, style, "aria-hidden": "true" });
|
|
@@ -1587,7 +1609,7 @@ var alignmentMap = {
|
|
|
1587
1609
|
center: "text-center",
|
|
1588
1610
|
right: "text-right"
|
|
1589
1611
|
};
|
|
1590
|
-
var
|
|
1612
|
+
var sizeMap3 = {
|
|
1591
1613
|
small: "text-2xl",
|
|
1592
1614
|
"medium-small": "text-3xl",
|
|
1593
1615
|
medium: "text-4xl",
|
|
@@ -1676,7 +1698,7 @@ function TextBlock({
|
|
|
1676
1698
|
resolvedTitle && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1677
1699
|
"h2",
|
|
1678
1700
|
{
|
|
1679
|
-
className: cn("font-bold",
|
|
1701
|
+
className: cn("font-bold", sizeMap3[textSize]),
|
|
1680
1702
|
style: gradientStyle,
|
|
1681
1703
|
children: resolvedTitle
|
|
1682
1704
|
}
|
|
@@ -1730,7 +1752,7 @@ function CustomImage({
|
|
|
1730
1752
|
// components/page/FeaturesList.tsx
|
|
1731
1753
|
var import_lucide_react = require("lucide-react");
|
|
1732
1754
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1733
|
-
var
|
|
1755
|
+
var sizeMap4 = {
|
|
1734
1756
|
small: { icon: 24, title: "text-base", desc: "text-sm" },
|
|
1735
1757
|
medium: { icon: 32, title: "text-lg", desc: "text-base" },
|
|
1736
1758
|
large: { icon: 48, title: "text-xl", desc: "text-lg" }
|
|
@@ -1742,7 +1764,7 @@ function FeaturesList({
|
|
|
1742
1764
|
iconColor = "#000000",
|
|
1743
1765
|
anchorLink
|
|
1744
1766
|
}) {
|
|
1745
|
-
const sizeConfig =
|
|
1767
|
+
const sizeConfig = sizeMap4[size];
|
|
1746
1768
|
const getIcon = (iconName) => {
|
|
1747
1769
|
const formatted = iconName.charAt(0).toUpperCase() + iconName.slice(1);
|
|
1748
1770
|
return import_lucide_react.icons[formatted] || null;
|
|
@@ -1799,7 +1821,7 @@ function FeaturesList({
|
|
|
1799
1821
|
// components/page/FeatureGrid.tsx
|
|
1800
1822
|
var import_lucide_react2 = require("lucide-react");
|
|
1801
1823
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1802
|
-
var
|
|
1824
|
+
var sizeMap5 = {
|
|
1803
1825
|
small: { icon: 24, title: "text-base", desc: "text-sm" },
|
|
1804
1826
|
medium: { icon: 32, title: "text-lg", desc: "text-base" },
|
|
1805
1827
|
large: { icon: 48, title: "text-xl", desc: "text-lg" }
|
|
@@ -1815,7 +1837,7 @@ function FeatureGrid({
|
|
|
1815
1837
|
textColor = "#000000",
|
|
1816
1838
|
anchorLink
|
|
1817
1839
|
}) {
|
|
1818
|
-
const sizeConfig =
|
|
1840
|
+
const sizeConfig = sizeMap5[size];
|
|
1819
1841
|
const getIcon = (iconName) => {
|
|
1820
1842
|
const formatted = iconName.charAt(0).toUpperCase() + iconName.slice(1);
|
|
1821
1843
|
return import_lucide_react2.icons[formatted] || null;
|
|
@@ -2082,7 +2104,7 @@ var widthMap3 = {
|
|
|
2082
2104
|
medium: "max-w-lg",
|
|
2083
2105
|
large: "max-w-2xl"
|
|
2084
2106
|
};
|
|
2085
|
-
var
|
|
2107
|
+
var sizeMap6 = {
|
|
2086
2108
|
small: "px-3 py-1.5 text-sm",
|
|
2087
2109
|
medium: "px-4 py-2 text-base",
|
|
2088
2110
|
large: "px-6 py-3 text-lg"
|
|
@@ -2127,7 +2149,7 @@ function Popup({
|
|
|
2127
2149
|
onClick: handleOpen,
|
|
2128
2150
|
className: cn(
|
|
2129
2151
|
"flex items-center gap-2 rounded-full font-medium",
|
|
2130
|
-
|
|
2152
|
+
sizeMap6[size]
|
|
2131
2153
|
),
|
|
2132
2154
|
style: { backgroundColor: buttonColor, color: textColor },
|
|
2133
2155
|
children: [
|
package/dist/renderer.mjs
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
|
-
Heading
|
|
3
|
-
|
|
2
|
+
Heading,
|
|
3
|
+
Paragraph
|
|
4
|
+
} from "./chunk-WFLVAZV2.mjs";
|
|
4
5
|
import {
|
|
5
6
|
Button,
|
|
6
7
|
Card,
|
|
@@ -14,7 +15,6 @@ import {
|
|
|
14
15
|
Icon,
|
|
15
16
|
Image,
|
|
16
17
|
ImageCarousel,
|
|
17
|
-
Paragraph,
|
|
18
18
|
Popup,
|
|
19
19
|
Section,
|
|
20
20
|
Spacer,
|
|
@@ -22,15 +22,15 @@ import {
|
|
|
22
22
|
Topbar,
|
|
23
23
|
VideoEmbed,
|
|
24
24
|
availableIcons
|
|
25
|
-
} from "./chunk-
|
|
25
|
+
} from "./chunk-MWW5LYLN.mjs";
|
|
26
26
|
import {
|
|
27
27
|
ThemeProvider,
|
|
28
28
|
useTheme
|
|
29
29
|
} from "./chunk-PJXZC564.mjs";
|
|
30
|
+
import "./chunk-QSWQDR6M.mjs";
|
|
30
31
|
import {
|
|
31
32
|
DEFAULT_THEME
|
|
32
33
|
} from "./chunk-C6V3YUPF.mjs";
|
|
33
|
-
import "./chunk-QSWQDR6M.mjs";
|
|
34
34
|
export {
|
|
35
35
|
Button,
|
|
36
36
|
Card,
|
package/dist/resolve/index.d.mts
CHANGED
package/dist/resolve/index.d.ts
CHANGED
|
@@ -108,4 +108,4 @@ type EntryBoundValue<T> = {
|
|
|
108
108
|
value: T;
|
|
109
109
|
};
|
|
110
110
|
|
|
111
|
-
export type {
|
|
111
|
+
export type { CustomFieldProps as C, Entry as E, PageTheme as P, ThemeBorderKey as T, ThemeBorders as a, ThemeColorKey as b, ThemeColors as c, ThemeShadowKey as d, ThemeShadows as e, ThemeSpacing as f, ThemeSpacingKey as g, ThemeTypography as h, ThemeableBorderRadiusValue as i, ThemeableColorValue as j, ThemeableShadowValue as k, ThemeableSpacingValue as l, ColorValue as m, EntryBoundValue as n, EntryContent as o };
|
|
@@ -108,4 +108,4 @@ type EntryBoundValue<T> = {
|
|
|
108
108
|
value: T;
|
|
109
109
|
};
|
|
110
110
|
|
|
111
|
-
export type {
|
|
111
|
+
export type { CustomFieldProps as C, Entry as E, PageTheme as P, ThemeBorderKey as T, ThemeBorders as a, ThemeColorKey as b, ThemeColors as c, ThemeShadowKey as d, ThemeShadows as e, ThemeSpacing as f, ThemeSpacingKey as g, ThemeTypography as h, ThemeableBorderRadiusValue as i, ThemeableColorValue as j, ThemeableShadowValue as k, ThemeableSpacingValue as l, ColorValue as m, EntryBoundValue as n, EntryContent as o };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mission-studio/puck",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.23",
|
|
4
4
|
"description": "A collection of puck components and configurations for internal use at Mission Studio.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -57,6 +57,11 @@
|
|
|
57
57
|
"import": "./dist/resolve/index.mjs",
|
|
58
58
|
"require": "./dist/resolve/index.js"
|
|
59
59
|
},
|
|
60
|
+
"./components/page/astro": {
|
|
61
|
+
"types": "./dist/components/page/astro/index.d.ts",
|
|
62
|
+
"import": "./dist/components/page/astro/index.mjs",
|
|
63
|
+
"require": "./dist/components/page/astro/index.js"
|
|
64
|
+
},
|
|
60
65
|
"./styles.css": "./dist/styles.css"
|
|
61
66
|
},
|
|
62
67
|
"scripts": {
|