dune-react 0.0.22 → 0.0.24
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/components/puck-base/image.js +1 -1
- package/dist/components/puck-block/banner-sections/css-marquee-banner/css-marquee-banner.js +13 -13
- package/dist/components/puck-block/banner-sections/dual-row-marquee/dual-row-marquee.js +77 -53
- package/dist/components/puck-block/banner-sections/scroll-driven-marquee/scroll-driven-marquee.js +8 -6
- package/dist/components/puck-block/banner-sections/scroll-parallax-text/scroll-parallax-text.js +3 -1
- package/dist/components/puck-block/contact-sections/contact-cards-grid/contact-cards-grid.js +1 -1
- package/dist/components/puck-block/contact-sections/form-with-media/form-with-media.js +1 -1
- package/dist/components/puck-block/contact-sections/header-form-cards/header-form-cards.js +1 -1
- package/dist/components/puck-block/contact-sections/header-info-fullwidth/header-info-fullwidth.js +2 -2
- package/dist/components/puck-block/contact-sections/info-cards-media/info-cards-media.js +2 -2
- package/dist/components/puck-block/contact-sections/split-info-form/split-info-form.js +1 -1
- package/dist/components/puck-block/contact-sections/tab-locations/tab-locations.js +71 -55
- package/dist/components/puck-block/cta-sections/mouse-track-cta/mouse-track-cta.js +4 -4
- package/dist/components/puck-block/cta-sections/side-media-cta/side-media-cta.js +1 -1
- package/dist/components/puck-block/cta-sections/text-block-cta/text-block-cta.js +2 -2
- package/dist/components/puck-block/feature-sections/feature-cards-grid/component.js +1 -1
- package/dist/components/puck-block/feature-sections/feature-list-split/component.js +1 -1
- package/dist/components/puck-block/feature-sections/tab-feature/component.js +4 -4
- package/dist/components/puck-block/feature-sections/text-media-split/component.js +1 -1
- package/dist/components/puck-block/footer-sections/centered-minimal-footer/centered-minimal-footer.js +72 -18
- package/dist/components/puck-block/footer-sections/centered-minimal-footer/index.d.ts +79 -0
- package/dist/components/puck-block/footer-sections/centered-minimal-footer/index.js +43 -1
- package/dist/components/puck-block/footer-sections/compact-newsletter-footer/index.d.ts +41 -0
- package/dist/components/puck-block/footer-sections/contact-links-footer/contact-links-footer.js +4 -3
- package/dist/components/puck-block/footer-sections/contact-links-footer/index.d.ts +86 -0
- package/dist/components/puck-block/footer-sections/contact-links-footer/index.js +1 -1
- package/dist/components/puck-block/footer-sections/cta-links-footer/cta-links-footer.js +3 -2
- package/dist/components/puck-block/footer-sections/cta-links-footer/index.d.ts +37 -0
- package/dist/components/puck-block/footer-sections/cta-links-footer/index.js +1 -1
- package/dist/components/puck-block/footer-sections/links-newsletter-footer/index.d.ts +54 -0
- package/dist/components/puck-block/footer-sections/newsletter-links-footer/index.d.ts +41 -0
- package/dist/components/puck-block/footer-sections/newsletter-top-links-footer/index.d.ts +54 -0
- package/dist/components/puck-block/footer-sections/props.d.ts +3 -0
- package/dist/components/puck-block/gallery-sections/fullscreen-portfolio/fullscreen-portfolio.js +1 -1
- package/dist/components/puck-block/gallery-sections/image-carousel/index.d.ts +14 -1
- package/dist/components/puck-block/gallery-sections/interactive-portfolio/interactive-portfolio.js +166 -105
- package/dist/components/puck-block/gallery-sections/masonry-grid/index.d.ts +17 -1
- package/dist/components/puck-block/gallery-sections/masonry-grid/masonry-grid.js +56 -31
- package/dist/components/puck-block/gallery-sections/portfolio-cards/index.d.ts +17 -1
- package/dist/components/puck-block/gallery-sections/portfolio-cards/portfolio-cards.js +41 -13
- package/dist/components/puck-block/gallery-sections/portfolio-divider/portfolio-divider.js +1 -1
- package/dist/components/puck-block/gallery-sections/props.d.ts +42 -3
- package/dist/components/puck-block/gallery-sections/props.js +24 -6
- package/dist/components/puck-block/gallery-sections/scroll-parallax/scroll-parallax.js +71 -22
- package/dist/components/puck-block/gallery-sections/scroll-parallax-portfolio/scroll-parallax-portfolio.js +284 -159
- package/dist/components/puck-block/gallery-sections/split-carousel/index.d.ts +11 -1
- package/dist/components/puck-block/gallery-sections/static-grid/index.d.ts +17 -1
- package/dist/components/puck-block/header-sections/centered-navbar/centered-navbar.js +95 -14
- package/dist/components/puck-block/header-sections/drawer-navbar/drawer-navbar.js +4 -3
- package/dist/components/puck-block/header-sections/floating-bordered-navbar/floating-bordered-navbar.js +5 -4
- package/dist/components/puck-block/header-sections/fullscreen-overlay-navbar/fullscreen-overlay-navbar.js +4 -3
- package/dist/components/puck-block/header-sections/mega-menu-navbar/mega-menu-navbar.js +3 -2
- package/dist/components/puck-block/header-sections/props.d.ts +3 -0
- package/dist/components/puck-block/header-sections/standard-navbar/standard-navbar.js +3 -2
- package/dist/components/puck-block/hero-sections/carousel-hero/component.js +3 -3
- package/dist/components/puck-block/hero-sections/column-scroll-hero/component.js +8 -8
- package/dist/components/puck-block/hero-sections/dual-marquee-hero/component.js +6 -6
- package/dist/components/puck-block/hero-sections/fullscreen-video-hero/component.js +1 -1
- package/dist/components/puck-block/hero-sections/grid-expand-hero/component.js +26 -17
- package/dist/components/puck-block/hero-sections/grid-expand-hero/index.d.ts +17 -1
- package/dist/components/puck-block/hero-sections/horizontal-marquee-hero/component.js +3 -3
- package/dist/components/puck-block/hero-sections/inline-image-hero/inline-image-hero.js +59 -28
- package/dist/components/puck-block/hero-sections/mouse-track-hero/component.js +60 -19
- package/dist/components/puck-block/hero-sections/multi-image-grid-hero/index.d.ts +17 -1
- package/dist/components/puck-block/hero-sections/multi-image-grid-hero/multi-image-grid-hero.js +2 -2
- package/dist/components/puck-block/hero-sections/overlapping-image-hero/overlapping-image-hero.js +3 -3
- package/dist/components/puck-block/hero-sections/parallax-images-hero/component.js +18 -6
- package/dist/components/puck-block/hero-sections/props.d.ts +34 -2
- package/dist/components/puck-block/hero-sections/props.js +18 -4
- package/dist/components/puck-block/hero-sections/scatter-parallax-hero/component.js +9 -7
- package/dist/components/puck-block/hero-sections/scroll-expand-video-hero/component.js +7 -5
- package/dist/components/puck-block/hero-sections/scroll-zoom-hero/component.js +5 -3
- package/dist/components/puck-block/hero-sections/sticky-expand-hero/component.js +1 -1
- package/dist/components/puck-block/hero-sections/sticky-expand-hero/index.d.ts +13 -5
- package/dist/components/puck-block/hero-sections/sticky-expand-hero/index.js +2 -2
- package/dist/components/puck-block/hero-sections/sticky-video-hero/component.js +2 -2
- package/dist/components/puck-block/hero-sections/tab-hero/component.js +5 -5
- package/dist/components/puck-block/hero-sections/three-image-parallax-hero/component.js +3 -3
- package/dist/components/puck-block/hero-sections/vertical-gallery-hero/component.js +6 -6
- package/dist/components/puck-block/hero-sections/zoom-grid-hero/component.js +14 -12
- package/dist/components/puck-block/index.d.ts +1 -0
- package/dist/components/puck-block/location-sections/index.d.ts +3 -0
- package/dist/components/puck-block/location-sections/location-1/index.js +102 -0
- package/dist/components/puck-block/location-sections/location-1/location.d.ts +0 -3
- package/dist/components/puck-block/location-sections/location-1/location.js +139 -0
- package/dist/components/puck-block/location-sections/location-2/index.js +126 -0
- package/dist/components/puck-block/location-sections/location-2/location.d.ts +0 -3
- package/dist/components/puck-block/location-sections/location-2/location.js +133 -0
- package/dist/components/puck-block/location-sections/location-3/index.js +109 -0
- package/dist/components/puck-block/location-sections/location-3/location.d.ts +0 -3
- package/dist/components/puck-block/location-sections/location-3/location.js +140 -0
- package/dist/components/puck-block/location-sections/props.d.ts +0 -3
- package/dist/components/puck-block/metrics-sections/center-media-stats/center-media-stats.js +1 -1
- package/dist/components/puck-block/metrics-sections/header-stats-row/header-stats-row.js +1 -1
- package/dist/components/puck-block/metrics-sections/mixed-grid-stats/mixed-grid-stats.js +2 -2
- package/dist/components/puck-block/metrics-sections/split-stats/split-stats.js +1 -1
- package/dist/components/puck-block/metrics-sections/tab-stats/tab-stats.js +4 -4
- package/dist/components/puck-block/pricing-sections/pricing-comparison-table/component.js +134 -33
- package/dist/components/puck-block/pricing-sections/pricing-comparison-table/index.d.ts +47 -0
- package/dist/components/puck-block/pricing-sections/pricing-comparison-table/index.js +34 -0
- package/dist/components/puck-block/pricing-sections/split-pricing/component.js +3 -3
- package/dist/components/puck-block/pricing-sections/tab-pricing-grid/component.js +86 -40
- package/dist/components/puck-block/pricing-sections/tab-single-pricing/component.js +1 -1
- package/dist/components/puck-block/registry.generated.d.ts +501 -12
- package/dist/components/puck-block/registry.generated.js +157 -138
- package/dist/components/puck-block/showcase-sections/tab-timeline/component.js +2 -2
- package/dist/components/puck-block/testimonial-sections/bento-testimonial/component.js +157 -83
- package/dist/components/puck-block/testimonial-sections/centered-testimonial/component.js +71 -28
- package/dist/components/puck-block/testimonial-sections/image-testimonial/component.js +66 -29
- package/dist/components/puck-block/testimonial-sections/image-testimonial-carousel/component.js +1 -1
- package/dist/components/puck-block/testimonial-sections/tab-testimonial/component.js +6 -6
- package/dist/components/puck-block/testimonial-sections/testimonial-card-grid/component.js +2 -2
- package/dist/components/puck-block/testimonial-sections/testimonial-carousel/component.js +1 -1
- package/dist/components/puck-block/text-sections/prose-content/component.js +1 -1
- package/dist/components/puck-block/text-sections/side-media-content/component.js +1 -1
- package/dist/components/puck-block/text-sections/sticky-text-multi-image/component.js +3 -3
- package/dist/components/puck-core/core/props/form.js +25 -1
- package/dist/components/puck-core/core/props/media.js +6 -1
- package/dist/components/puck-core/fields/array-field.d.ts +7 -0
- package/dist/components/puck-core/fields/array-field.js +229 -0
- package/dist/components/puck-core/fields/auto-field.js +11 -0
- package/dist/components/puck-core/fields/image-upload-field.js +1 -1
- package/dist/components/puck-core/fields/index.d.ts +1 -0
- package/dist/components/puck-core/fields/location-field.js +4 -1
- package/dist/components/puck-core/fields/object-field.js +1 -1
- package/dist/index.js +6 -0
- package/dist/node_modules/.pnpm/@dnd-kit_accessibility@3.1.1_react@19.2.4/node_modules/@dnd-kit/accessibility/dist/accessibility.esm.js +59 -0
- package/dist/node_modules/.pnpm/@dnd-kit_core@6.3.1_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/@dnd-kit/core/dist/core.esm.js +3093 -0
- package/dist/node_modules/.pnpm/@dnd-kit_sortable@10.0.0_@dnd-kit_core@6.3.1_react-dom@19.2.4_react@19.2.4__react@19.2.4__react@19.2.4/node_modules/@dnd-kit/sortable/dist/sortable.esm.js +592 -0
- package/dist/node_modules/.pnpm/@dnd-kit_utilities@3.2.2_react@19.2.4/node_modules/@dnd-kit/utilities/dist/utilities.esm.js +301 -0
- package/package.json +7 -1
package/dist/components/puck-block/gallery-sections/fullscreen-portfolio/fullscreen-portfolio.js
CHANGED
|
@@ -112,7 +112,7 @@ const defaultProject = {
|
|
|
112
112
|
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.",
|
|
113
113
|
image: {
|
|
114
114
|
src: "https://picsum.photos/seed/fullscreen-port/1920/1080",
|
|
115
|
-
alt: "
|
|
115
|
+
alt: "Placeholder image"
|
|
116
116
|
},
|
|
117
117
|
url: "#",
|
|
118
118
|
button: { label: "View project", variant: "secondary" }
|
|
@@ -89,8 +89,21 @@ declare const conf: {
|
|
|
89
89
|
}];
|
|
90
90
|
};
|
|
91
91
|
slidesPerView: {
|
|
92
|
-
readonly type: "
|
|
92
|
+
readonly type: "select";
|
|
93
93
|
readonly label: "Slides Per View";
|
|
94
|
+
readonly options: readonly [{
|
|
95
|
+
readonly label: "1";
|
|
96
|
+
readonly value: "1";
|
|
97
|
+
}, {
|
|
98
|
+
readonly label: "1 → 2 (responsive)";
|
|
99
|
+
readonly value: "1-md2";
|
|
100
|
+
}, {
|
|
101
|
+
readonly label: "2 → 3 (responsive)";
|
|
102
|
+
readonly value: "2-md3";
|
|
103
|
+
}, {
|
|
104
|
+
readonly label: "2 → 4 (responsive)";
|
|
105
|
+
readonly value: "2-md4";
|
|
106
|
+
}];
|
|
94
107
|
};
|
|
95
108
|
slideOverflow: {
|
|
96
109
|
readonly type: "radio";
|
package/dist/components/puck-block/gallery-sections/interactive-portfolio/interactive-portfolio.js
CHANGED
|
@@ -24,7 +24,12 @@ const InteractivePortfolio = (props) => {
|
|
|
24
24
|
...InteractivePortfolioDefaults,
|
|
25
25
|
...props
|
|
26
26
|
};
|
|
27
|
-
const {
|
|
27
|
+
const {
|
|
28
|
+
className: sectionClassName,
|
|
29
|
+
style: sectionStyle,
|
|
30
|
+
css,
|
|
31
|
+
listLayout = "center"
|
|
32
|
+
} = styles ?? {};
|
|
28
33
|
const ref = useRef(null);
|
|
29
34
|
const [cursorPosition, setCursorPosition] = useState({ x: 0, y: 0 });
|
|
30
35
|
const [hoveredIndex, setHoveredIndex] = useState(null);
|
|
@@ -49,109 +54,129 @@ const InteractivePortfolio = (props) => {
|
|
|
49
54
|
const translateLeftInverse = direction === "left" ? -50 : 0;
|
|
50
55
|
const translateRightInverse = direction === "right" ? 50 : 0;
|
|
51
56
|
if (listLayout === "left-with-sticky-image") {
|
|
52
|
-
return /* @__PURE__ */ jsx(
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
57
|
+
return /* @__PURE__ */ jsx(
|
|
58
|
+
SectionWrapper,
|
|
59
|
+
{
|
|
60
|
+
className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName),
|
|
61
|
+
style: sectionStyle,
|
|
62
|
+
css,
|
|
63
|
+
children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
|
|
64
|
+
/* @__PURE__ */ jsx("p", { className: "mb-6 font-semibold md:mb-8", children: tagline }),
|
|
65
|
+
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-12 lg:grid-cols-2 lg:gap-16", children: [
|
|
66
|
+
/* @__PURE__ */ jsx("div", { className: "lg:sticky lg:top-20 lg:self-start", children: /* @__PURE__ */ jsx("div", { className: "aspect-square w-full overflow-hidden", children: /* @__PURE__ */ jsx(
|
|
67
|
+
CompoundImage,
|
|
68
|
+
{
|
|
69
|
+
src: hoveredIndex !== null ? hoverLinks[hoveredIndex].image.src : (_a = hoverLinks[0]) == null ? void 0 : _a.image.src,
|
|
70
|
+
alt: hoveredIndex !== null ? hoverLinks[hoveredIndex].image.alt : (_b = hoverLinks[0]) == null ? void 0 : _b.image.alt,
|
|
71
|
+
className: "size-full object-cover transition-all duration-500"
|
|
72
|
+
}
|
|
73
|
+
) }) }),
|
|
74
|
+
/* @__PURE__ */ jsx("div", { children: hoverLinks.map((link, index) => /* @__PURE__ */ jsxs(
|
|
75
|
+
"a",
|
|
76
|
+
{
|
|
77
|
+
href: link.url,
|
|
78
|
+
onMouseEnter: () => setHoveredIndex(index),
|
|
79
|
+
onMouseLeave: () => setHoveredIndex(null),
|
|
80
|
+
className: "flex items-center justify-between border-b border-border-primary py-6 md:py-8",
|
|
81
|
+
children: [
|
|
82
|
+
/* @__PURE__ */ jsx(
|
|
83
|
+
"h3",
|
|
76
84
|
{
|
|
77
|
-
|
|
85
|
+
className: cn(
|
|
86
|
+
"text-2xl font-bold transition-colors duration-300 md:text-4xl lg:text-5xl",
|
|
87
|
+
{
|
|
88
|
+
"text-black/20": hoveredIndex !== index && hoveredIndex !== null
|
|
89
|
+
}
|
|
90
|
+
),
|
|
91
|
+
children: link.heading
|
|
78
92
|
}
|
|
79
93
|
),
|
|
80
|
-
children: link.
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
] }) });
|
|
94
|
+
/* @__PURE__ */ jsx("div", { className: "bg-background-secondary px-2 py-1 text-sm font-semibold", children: link.tag })
|
|
95
|
+
]
|
|
96
|
+
},
|
|
97
|
+
index
|
|
98
|
+
)) })
|
|
99
|
+
] })
|
|
100
|
+
] })
|
|
101
|
+
}
|
|
102
|
+
);
|
|
90
103
|
}
|
|
91
104
|
const isLeftAligned = listLayout === "left-aligned";
|
|
92
|
-
return /* @__PURE__ */ jsx(
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
{
|
|
119
|
-
"
|
|
120
|
-
"
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
105
|
+
return /* @__PURE__ */ jsx(
|
|
106
|
+
SectionWrapper,
|
|
107
|
+
{
|
|
108
|
+
className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName),
|
|
109
|
+
style: sectionStyle,
|
|
110
|
+
css,
|
|
111
|
+
onMouseMove: handleMouseMove,
|
|
112
|
+
children: /* @__PURE__ */ jsxs(
|
|
113
|
+
"div",
|
|
114
|
+
{
|
|
115
|
+
className: cn("container", { "max-w-xl text-center": !isLeftAligned }),
|
|
116
|
+
children: [
|
|
117
|
+
/* @__PURE__ */ jsx("p", { className: "mb-6 font-semibold md:mb-8", children: tagline }),
|
|
118
|
+
/* @__PURE__ */ jsx(
|
|
119
|
+
motion.div,
|
|
120
|
+
{
|
|
121
|
+
initial: "initial",
|
|
122
|
+
whileHover: direction,
|
|
123
|
+
ref,
|
|
124
|
+
onMouseEnter: handleMouseEnter,
|
|
125
|
+
onMouseLeave: handleMouseLeave,
|
|
126
|
+
children: hoverLinks.map((link, index) => /* @__PURE__ */ jsxs(
|
|
127
|
+
"a",
|
|
128
|
+
{
|
|
129
|
+
href: link.url,
|
|
130
|
+
onMouseEnter: () => setHoveredIndex(index),
|
|
131
|
+
className: cn("flex items-center gap-2 p-4 sm:gap-4 md:gap-8", {
|
|
132
|
+
"flex-col justify-center sm:flex-row": !isLeftAligned,
|
|
133
|
+
"flex-row justify-between border-b border-border-primary": isLeftAligned
|
|
134
|
+
}),
|
|
135
|
+
children: [
|
|
136
|
+
isLeftAligned && /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-neutral-500", children: String(index + 1).padStart(2, "0") }),
|
|
137
|
+
/* @__PURE__ */ jsx(
|
|
138
|
+
"h3",
|
|
139
|
+
{
|
|
140
|
+
className: cn("font-bold transition-colors duration-300", {
|
|
141
|
+
"text-6xl md:text-9xl lg:text-10xl": !isLeftAligned,
|
|
142
|
+
"text-2xl md:text-4xl lg:text-5xl": isLeftAligned,
|
|
143
|
+
"lg:text-black/20": hoveredIndex !== index && hoveredIndex !== null,
|
|
144
|
+
"lg:text-black": hoveredIndex === index || hoveredIndex === null
|
|
145
|
+
}),
|
|
146
|
+
children: link.heading
|
|
147
|
+
}
|
|
148
|
+
),
|
|
149
|
+
/* @__PURE__ */ jsx("div", { className: "bg-background-secondary whitespace-nowrap border border-neutral-lightest px-2 py-1 text-sm font-semibold", children: link.tag }),
|
|
150
|
+
/* @__PURE__ */ jsx(
|
|
151
|
+
motion.div,
|
|
152
|
+
{
|
|
153
|
+
className: `pointer-events-none fixed inset-0 -z-10 hidden size-[600px] lg:block ${hoveredIndex === index ? "opacity-100" : "opacity-0"}`,
|
|
154
|
+
style: {
|
|
155
|
+
translateX: cursorPosition.x - 300 + translateLeftInverse + translateRightInverse,
|
|
156
|
+
translateY: cursorPosition.y - 300 + translateTopInverse + translateBottomInverse
|
|
157
|
+
},
|
|
158
|
+
children: /* @__PURE__ */ jsx(
|
|
159
|
+
motion.img,
|
|
160
|
+
{
|
|
161
|
+
className: "size-full max-w-md",
|
|
162
|
+
variants: imageVariants,
|
|
163
|
+
src: link.image.src,
|
|
164
|
+
alt: link.image.alt
|
|
165
|
+
}
|
|
166
|
+
)
|
|
167
|
+
}
|
|
168
|
+
)
|
|
169
|
+
]
|
|
136
170
|
},
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
}
|
|
147
|
-
)
|
|
148
|
-
]
|
|
149
|
-
},
|
|
150
|
-
index
|
|
151
|
-
))
|
|
152
|
-
}
|
|
153
|
-
)
|
|
154
|
-
] }) });
|
|
171
|
+
index
|
|
172
|
+
))
|
|
173
|
+
}
|
|
174
|
+
)
|
|
175
|
+
]
|
|
176
|
+
}
|
|
177
|
+
)
|
|
178
|
+
}
|
|
179
|
+
);
|
|
155
180
|
};
|
|
156
181
|
const defaultHoverLink = {
|
|
157
182
|
url: "#",
|
|
@@ -159,7 +184,7 @@ const defaultHoverLink = {
|
|
|
159
184
|
tag: "Tag",
|
|
160
185
|
image: {
|
|
161
186
|
src: "https://picsum.photos/seed/interactive-port/800/800",
|
|
162
|
-
alt: "
|
|
187
|
+
alt: "Placeholder image"
|
|
163
188
|
}
|
|
164
189
|
};
|
|
165
190
|
const InteractivePortfolioDefaults = {
|
|
@@ -171,12 +196,48 @@ const InteractivePortfolioDefaults = {
|
|
|
171
196
|
images: [],
|
|
172
197
|
projects: [],
|
|
173
198
|
hoverLinks: [
|
|
174
|
-
{
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
199
|
+
{
|
|
200
|
+
...defaultHoverLink,
|
|
201
|
+
image: {
|
|
202
|
+
src: "https://picsum.photos/seed/ip-1/800/800",
|
|
203
|
+
alt: "Project 1"
|
|
204
|
+
}
|
|
205
|
+
},
|
|
206
|
+
{
|
|
207
|
+
...defaultHoverLink,
|
|
208
|
+
image: {
|
|
209
|
+
src: "https://picsum.photos/seed/ip-2/800/800",
|
|
210
|
+
alt: "Project 2"
|
|
211
|
+
}
|
|
212
|
+
},
|
|
213
|
+
{
|
|
214
|
+
...defaultHoverLink,
|
|
215
|
+
image: {
|
|
216
|
+
src: "https://picsum.photos/seed/ip-3/800/800",
|
|
217
|
+
alt: "Project 3"
|
|
218
|
+
}
|
|
219
|
+
},
|
|
220
|
+
{
|
|
221
|
+
...defaultHoverLink,
|
|
222
|
+
image: {
|
|
223
|
+
src: "https://picsum.photos/seed/ip-4/800/800",
|
|
224
|
+
alt: "Project 4"
|
|
225
|
+
}
|
|
226
|
+
},
|
|
227
|
+
{
|
|
228
|
+
...defaultHoverLink,
|
|
229
|
+
image: {
|
|
230
|
+
src: "https://picsum.photos/seed/ip-5/800/800",
|
|
231
|
+
alt: "Project 5"
|
|
232
|
+
}
|
|
233
|
+
},
|
|
234
|
+
{
|
|
235
|
+
...defaultHoverLink,
|
|
236
|
+
image: {
|
|
237
|
+
src: "https://picsum.photos/seed/ip-6/800/800",
|
|
238
|
+
alt: "Project 6"
|
|
239
|
+
}
|
|
240
|
+
}
|
|
180
241
|
],
|
|
181
242
|
styles: {
|
|
182
243
|
listLayout: "center"
|
|
@@ -56,8 +56,24 @@ declare const conf: {
|
|
|
56
56
|
};
|
|
57
57
|
};
|
|
58
58
|
columns: {
|
|
59
|
-
readonly type: "
|
|
59
|
+
readonly type: "select";
|
|
60
60
|
readonly label: "Columns";
|
|
61
|
+
readonly options: readonly [{
|
|
62
|
+
readonly label: "1";
|
|
63
|
+
readonly value: "1";
|
|
64
|
+
}, {
|
|
65
|
+
readonly label: "2";
|
|
66
|
+
readonly value: "2";
|
|
67
|
+
}, {
|
|
68
|
+
readonly label: "3";
|
|
69
|
+
readonly value: "3";
|
|
70
|
+
}, {
|
|
71
|
+
readonly label: "2 → 3 (responsive)";
|
|
72
|
+
readonly value: "2-lg3";
|
|
73
|
+
}, {
|
|
74
|
+
readonly label: "2 → 4 (responsive)";
|
|
75
|
+
readonly value: "2-lg4";
|
|
76
|
+
}];
|
|
61
77
|
};
|
|
62
78
|
};
|
|
63
79
|
};
|
|
@@ -7,40 +7,53 @@ const MasonryGrid = (props) => {
|
|
|
7
7
|
...MasonryGridDefaults,
|
|
8
8
|
...props
|
|
9
9
|
};
|
|
10
|
-
const {
|
|
10
|
+
const {
|
|
11
|
+
className: sectionClassName,
|
|
12
|
+
style: sectionStyle,
|
|
13
|
+
css,
|
|
14
|
+
columns = "2"
|
|
15
|
+
} = styles ?? {};
|
|
11
16
|
const cols = parseInt(columns, 10) || 2;
|
|
12
|
-
return /* @__PURE__ */ jsx(
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
"div",
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
"md:
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
children: images.map((image, index) => /* @__PURE__ */ jsx("a", { href: "#", className: "mb-8 inline-block w-full", children: /* @__PURE__ */ jsx(
|
|
17
|
+
return /* @__PURE__ */ jsx(
|
|
18
|
+
SectionWrapper,
|
|
19
|
+
{
|
|
20
|
+
className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName),
|
|
21
|
+
style: sectionStyle,
|
|
22
|
+
css,
|
|
23
|
+
children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
|
|
24
|
+
/* @__PURE__ */ jsxs("div", { className: "mb-12 text-center md:mb-18 lg:mb-20", children: [
|
|
25
|
+
/* @__PURE__ */ jsx("h2", { className: "mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
|
|
26
|
+
/* @__PURE__ */ jsx("p", { className: "md:text-md", children: description })
|
|
27
|
+
] }),
|
|
28
|
+
/* @__PURE__ */ jsx(
|
|
25
29
|
"div",
|
|
26
30
|
{
|
|
27
|
-
className: cn("
|
|
28
|
-
"
|
|
29
|
-
"
|
|
31
|
+
className: cn("gap-x-8", {
|
|
32
|
+
"md:columns-2": cols === 2,
|
|
33
|
+
"md:columns-2 lg:columns-3": cols === 3
|
|
30
34
|
}),
|
|
31
|
-
children: /* @__PURE__ */ jsx(
|
|
32
|
-
|
|
35
|
+
children: images.map((image, index) => /* @__PURE__ */ jsx("a", { href: "#", className: "mb-8 inline-block w-full", children: /* @__PURE__ */ jsx(
|
|
36
|
+
"div",
|
|
33
37
|
{
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
38
|
+
className: cn("relative inline-block w-full", {
|
|
39
|
+
"pt-[100%]": index % 3 === 0,
|
|
40
|
+
"pt-[66.66%]": index % 3 !== 0
|
|
41
|
+
}),
|
|
42
|
+
children: /* @__PURE__ */ jsx(
|
|
43
|
+
CompoundImage,
|
|
44
|
+
{
|
|
45
|
+
src: image.src,
|
|
46
|
+
alt: image.alt,
|
|
47
|
+
className: "absolute inset-0 size-full object-cover"
|
|
48
|
+
}
|
|
49
|
+
)
|
|
37
50
|
}
|
|
38
|
-
)
|
|
51
|
+
) }, index))
|
|
39
52
|
}
|
|
40
|
-
)
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
|
|
53
|
+
)
|
|
54
|
+
] })
|
|
55
|
+
}
|
|
56
|
+
);
|
|
44
57
|
};
|
|
45
58
|
const MasonryGridDefaults = {
|
|
46
59
|
tagline: "",
|
|
@@ -49,10 +62,22 @@ const MasonryGridDefaults = {
|
|
|
49
62
|
button: { label: "View all" },
|
|
50
63
|
buttons: [],
|
|
51
64
|
images: [
|
|
52
|
-
{
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
65
|
+
{
|
|
66
|
+
src: "https://images.unsplash.com/photo-1523275335684-37898b6baf30?w=800&h=800&fit=crop",
|
|
67
|
+
alt: "Gallery image 1"
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
src: "https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=800&h=533&fit=crop",
|
|
71
|
+
alt: "Gallery image 2"
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
src: "https://images.unsplash.com/photo-1542291026-7eec264c27ff?w=800&h=533&fit=crop",
|
|
75
|
+
alt: "Gallery image 3"
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
src: "https://images.unsplash.com/photo-1526170375885-4d8ecf77b99f?w=800&h=800&fit=crop",
|
|
79
|
+
alt: "Gallery image 4"
|
|
80
|
+
}
|
|
56
81
|
],
|
|
57
82
|
projects: [],
|
|
58
83
|
hoverLinks: [],
|
|
@@ -179,8 +179,24 @@ declare const conf: {
|
|
|
179
179
|
};
|
|
180
180
|
};
|
|
181
181
|
columns: {
|
|
182
|
-
readonly type: "
|
|
182
|
+
readonly type: "select";
|
|
183
183
|
readonly label: "Columns";
|
|
184
|
+
readonly options: readonly [{
|
|
185
|
+
readonly label: "1";
|
|
186
|
+
readonly value: "1";
|
|
187
|
+
}, {
|
|
188
|
+
readonly label: "2";
|
|
189
|
+
readonly value: "2";
|
|
190
|
+
}, {
|
|
191
|
+
readonly label: "3";
|
|
192
|
+
readonly value: "3";
|
|
193
|
+
}, {
|
|
194
|
+
readonly label: "2 → 3 (responsive)";
|
|
195
|
+
readonly value: "2-lg3";
|
|
196
|
+
}, {
|
|
197
|
+
readonly label: "2 → 4 (responsive)";
|
|
198
|
+
readonly value: "2-lg4";
|
|
199
|
+
}];
|
|
184
200
|
};
|
|
185
201
|
bordered: {
|
|
186
202
|
readonly type: "radio";
|
|
@@ -42,7 +42,7 @@ const PortfolioCards = (props) => {
|
|
|
42
42
|
const isStacked = cardLayout === "stacked";
|
|
43
43
|
const isZigzag = cardLayout === "zigzag";
|
|
44
44
|
const isMasonry = cardLayout === "masonry";
|
|
45
|
-
const imageElement = /* @__PURE__ */ jsx("a", { href: project.url, className: cn({
|
|
45
|
+
const imageElement = /* @__PURE__ */ jsx("a", { href: project.url, className: cn({ block: true }), children: /* @__PURE__ */ jsx(
|
|
46
46
|
CompoundImage,
|
|
47
47
|
{
|
|
48
48
|
src: project.image.src,
|
|
@@ -64,7 +64,14 @@ const PortfolioCards = (props) => {
|
|
|
64
64
|
children: tag.label
|
|
65
65
|
}
|
|
66
66
|
) }, tagIndex)) }),
|
|
67
|
-
(metaType === "tags-button" || metaType === "none") && project.button && /* @__PURE__ */ jsx("div", { className: "mt-5 md:mt-6", children: /* @__PURE__ */ jsx(
|
|
67
|
+
(metaType === "tags-button" || metaType === "none") && project.button && /* @__PURE__ */ jsx("div", { className: "mt-5 md:mt-6", children: /* @__PURE__ */ jsx(
|
|
68
|
+
Button,
|
|
69
|
+
{
|
|
70
|
+
variant: project.button.variant,
|
|
71
|
+
size: project.button.size,
|
|
72
|
+
children: project.button.label
|
|
73
|
+
}
|
|
74
|
+
) })
|
|
68
75
|
] });
|
|
69
76
|
if (isZigzag) {
|
|
70
77
|
return /* @__PURE__ */ jsx(
|
|
@@ -114,25 +121,46 @@ const PortfolioCards = (props) => {
|
|
|
114
121
|
index
|
|
115
122
|
);
|
|
116
123
|
};
|
|
117
|
-
return /* @__PURE__ */ jsx(
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
124
|
+
return /* @__PURE__ */ jsx(
|
|
125
|
+
SectionWrapper,
|
|
126
|
+
{
|
|
127
|
+
className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName),
|
|
128
|
+
style: sectionStyle,
|
|
129
|
+
css,
|
|
130
|
+
children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
|
|
131
|
+
/* @__PURE__ */ jsxs("header", { className: "mx-auto mb-12 max-w-lg text-center md:mb-18 lg:mb-20", children: [
|
|
132
|
+
/* @__PURE__ */ jsx("p", { className: "mb-3 font-semibold md:mb-4", children: tagline }),
|
|
133
|
+
/* @__PURE__ */ jsx("h2", { className: "mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
|
|
134
|
+
/* @__PURE__ */ jsx("p", { className: "md:text-md", children: description })
|
|
135
|
+
] }),
|
|
136
|
+
/* @__PURE__ */ jsx("div", { className: getGridClass(), children: projects.map((project, index) => renderProject(project, index)) }),
|
|
137
|
+
/* @__PURE__ */ jsx("footer", { className: "mt-12 flex justify-center md:mt-18 lg:mt-20", children: /* @__PURE__ */ jsx(
|
|
138
|
+
CompoundButton,
|
|
139
|
+
{
|
|
140
|
+
label: button.label,
|
|
141
|
+
variant: button.variant,
|
|
142
|
+
size: button.size,
|
|
143
|
+
action: button.action,
|
|
144
|
+
icon: button.icon
|
|
145
|
+
}
|
|
146
|
+
) })
|
|
147
|
+
] })
|
|
148
|
+
}
|
|
149
|
+
);
|
|
126
150
|
};
|
|
127
151
|
const defaultProject = {
|
|
128
152
|
title: "Project name here",
|
|
129
153
|
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros.",
|
|
130
154
|
image: {
|
|
131
155
|
src: "https://picsum.photos/seed/portfolio-card/1200/800",
|
|
132
|
-
alt: "
|
|
156
|
+
alt: "Placeholder image"
|
|
133
157
|
},
|
|
134
158
|
url: "#",
|
|
135
|
-
button: {
|
|
159
|
+
button: {
|
|
160
|
+
label: "View project",
|
|
161
|
+
variant: "link",
|
|
162
|
+
size: "sm"
|
|
163
|
+
},
|
|
136
164
|
tags: [
|
|
137
165
|
{ label: "Tag one", url: "#" },
|
|
138
166
|
{ label: "Tag two", url: "#" }
|
|
@@ -96,7 +96,7 @@ const defaultProject = {
|
|
|
96
96
|
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros.",
|
|
97
97
|
image: {
|
|
98
98
|
src: "https://picsum.photos/seed/portfolio-div/1200/800",
|
|
99
|
-
alt: "
|
|
99
|
+
alt: "Placeholder image"
|
|
100
100
|
},
|
|
101
101
|
url: "#",
|
|
102
102
|
button: { label: "View project", variant: "link", size: "sm" },
|