@xscriptor/xcomponents 0.1.1 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-TKT37LIX.mjs → chunk-BXVG4SYP.mjs} +101 -39
- package/dist/chunk-BXVG4SYP.mjs.map +7 -0
- package/dist/{chunk-UROP4J6G.mjs → chunk-FW47JGYZ.mjs} +122 -29
- package/dist/chunk-FW47JGYZ.mjs.map +7 -0
- package/dist/{chunk-34NJCJUI.mjs → chunk-IK2UCTCM.mjs} +46 -15
- package/dist/chunk-IK2UCTCM.mjs.map +7 -0
- package/dist/{chunk-2H7TVDE7.mjs → chunk-WE7QZGVP.mjs} +45 -14
- package/dist/chunk-WE7QZGVP.mjs.map +7 -0
- package/dist/{chunk-MYFPSHSQ.mjs → chunk-XB3UGHSF.mjs} +94 -32
- package/dist/chunk-XB3UGHSF.mjs.map +7 -0
- package/dist/{chunk-TG3B4GAW.mjs → chunk-ZDMG7X6H.mjs} +57 -26
- package/dist/{chunk-TG3B4GAW.mjs.map → chunk-ZDMG7X6H.mjs.map} +4 -4
- package/dist/components/content/index.css +64 -65
- package/dist/components/content/index.css.map +4 -4
- package/dist/components/content/index.js +45 -14
- package/dist/components/content/index.js.map +4 -4
- package/dist/components/content/index.mjs +1 -1
- package/dist/components/forms/index.css +113 -115
- package/dist/components/forms/index.css.map +4 -4
- package/dist/components/forms/index.js +100 -38
- package/dist/components/forms/index.js.map +4 -4
- package/dist/components/forms/index.mjs +1 -1
- package/dist/components/gallery/index.css +107 -110
- package/dist/components/gallery/index.css.map +4 -4
- package/dist/components/gallery/index.js +93 -31
- package/dist/components/gallery/index.js.map +4 -4
- package/dist/components/gallery/index.mjs +1 -1
- package/dist/components/index.css +536 -534
- package/dist/components/index.css.map +4 -4
- package/dist/components/index.js +459 -149
- package/dist/components/index.js.map +4 -4
- package/dist/components/index.mjs +6 -6
- package/dist/components/layout/index.css +89 -81
- package/dist/components/layout/index.css.map +4 -4
- package/dist/components/layout/index.js +121 -28
- package/dist/components/layout/index.js.map +4 -4
- package/dist/components/layout/index.mjs +1 -1
- package/dist/components/navigation/index.css +120 -120
- package/dist/components/navigation/index.css.map +4 -4
- package/dist/components/navigation/index.js +56 -25
- package/dist/components/navigation/index.js.map +4 -4
- package/dist/components/navigation/index.mjs +1 -1
- package/dist/components/social/index.css +43 -43
- package/dist/components/social/index.css.map +4 -4
- package/dist/components/social/index.js +44 -13
- package/dist/components/social/index.js.map +4 -4
- package/dist/components/social/index.mjs +1 -1
- package/dist/index.css +536 -534
- package/dist/index.css.map +4 -4
- package/dist/index.js +459 -149
- package/dist/index.js.map +4 -4
- package/dist/index.mjs +6 -6
- package/package.json +2 -1
- package/dist/chunk-2H7TVDE7.mjs.map +0 -7
- package/dist/chunk-34NJCJUI.mjs.map +0 -7
- package/dist/chunk-MYFPSHSQ.mjs.map +0 -7
- package/dist/chunk-TKT37LIX.mjs.map +0 -7
- package/dist/chunk-UROP4J6G.mjs.map +0 -7
|
@@ -40,24 +40,55 @@ var import_react = __toESM(require("react"));
|
|
|
40
40
|
var import_image = __toESM(require("next/image"));
|
|
41
41
|
var import_framer_motion = require("framer-motion");
|
|
42
42
|
|
|
43
|
-
// src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css
|
|
44
|
-
var
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
43
|
+
// esbuild-css-modules-plugin-ns-js::src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css:injector.js
|
|
44
|
+
var content = __content_placeholder__;
|
|
45
|
+
var digest = __digest_placeholder__;
|
|
46
|
+
var inject = () => {
|
|
47
|
+
setTimeout(() => {
|
|
48
|
+
if (!globalThis.document) {
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
let root = globalThis.document.querySelector("head");
|
|
52
|
+
if (root && root.shadowRoot) {
|
|
53
|
+
root = root.shadowRoot;
|
|
54
|
+
}
|
|
55
|
+
if (!root) {
|
|
56
|
+
root = globalThis.document.head;
|
|
57
|
+
}
|
|
58
|
+
let container = root.querySelector("#_" + digest);
|
|
59
|
+
if (!container) {
|
|
60
|
+
container = globalThis.document.createElement("style");
|
|
61
|
+
container.id = "_" + digest;
|
|
62
|
+
const text = globalThis.document.createTextNode(content);
|
|
63
|
+
container.appendChild(text);
|
|
64
|
+
root.appendChild(container);
|
|
65
|
+
}
|
|
66
|
+
}, 0);
|
|
59
67
|
};
|
|
60
68
|
|
|
69
|
+
// src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css
|
|
70
|
+
var XMicroGalleryText_default = new Proxy({
|
|
71
|
+
"artistic1": "XMicroGalleryText-module__artistic1_22YC0W__012",
|
|
72
|
+
"artistic2": "XMicroGalleryText-module__artistic2_22YC0W__012",
|
|
73
|
+
"artistic3": "XMicroGalleryText-module__artistic3_22YC0W__012",
|
|
74
|
+
"artisticGrid": "XMicroGalleryText-module__artisticGrid_22YC0W__012",
|
|
75
|
+
"container": "XMicroGalleryText-module__container_22YC0W__012",
|
|
76
|
+
"gallery": "XMicroGalleryText-module__gallery_22YC0W__012",
|
|
77
|
+
"imageWrapper": "XMicroGalleryText-module__imageWrapper_22YC0W__012",
|
|
78
|
+
"previewImage": "XMicroGalleryText-module__previewImage_22YC0W__012",
|
|
79
|
+
"reverse": "XMicroGalleryText-module__reverse_22YC0W__012",
|
|
80
|
+
"textCenter": "XMicroGalleryText-module__textCenter_22YC0W__012",
|
|
81
|
+
"textContent": "XMicroGalleryText-module__textContent_22YC0W__012",
|
|
82
|
+
"textLeft": "XMicroGalleryText-module__textLeft_22YC0W__012",
|
|
83
|
+
"textRight": "XMicroGalleryText-module__textRight_22YC0W__012",
|
|
84
|
+
"visible": "XMicroGalleryText-module__visible_22YC0W__012"
|
|
85
|
+
}, {
|
|
86
|
+
get: function(source, key) {
|
|
87
|
+
inject();
|
|
88
|
+
return source[key];
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
|
|
61
92
|
// src/components/gallery/xmicrogallerytext/XMicroGalleryText.tsx
|
|
62
93
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
63
94
|
var DISPLAY_COUNT = 3;
|
|
@@ -142,23 +173,54 @@ var XMicroGalleryText_default2 = XMicroGalleryText;
|
|
|
142
173
|
var import_react2 = require("react");
|
|
143
174
|
var import_image2 = __toESM(require("next/image"));
|
|
144
175
|
|
|
145
|
-
// src/components/gallery/xstaticgallery/XStaticGallery.module.css
|
|
146
|
-
var
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
176
|
+
// esbuild-css-modules-plugin-ns-js::src/components/gallery/xstaticgallery/XStaticGallery.module.css:injector.js
|
|
177
|
+
var content2 = __content_placeholder__;
|
|
178
|
+
var digest2 = __digest_placeholder__;
|
|
179
|
+
var inject2 = () => {
|
|
180
|
+
setTimeout(() => {
|
|
181
|
+
if (!globalThis.document) {
|
|
182
|
+
return;
|
|
183
|
+
}
|
|
184
|
+
let root = globalThis.document.querySelector("head");
|
|
185
|
+
if (root && root.shadowRoot) {
|
|
186
|
+
root = root.shadowRoot;
|
|
187
|
+
}
|
|
188
|
+
if (!root) {
|
|
189
|
+
root = globalThis.document.head;
|
|
190
|
+
}
|
|
191
|
+
let container = root.querySelector("#_" + digest2);
|
|
192
|
+
if (!container) {
|
|
193
|
+
container = globalThis.document.createElement("style");
|
|
194
|
+
container.id = "_" + digest2;
|
|
195
|
+
const text = globalThis.document.createTextNode(content2);
|
|
196
|
+
container.appendChild(text);
|
|
197
|
+
root.appendChild(container);
|
|
198
|
+
}
|
|
199
|
+
}, 0);
|
|
160
200
|
};
|
|
161
201
|
|
|
202
|
+
// src/components/gallery/xstaticgallery/XStaticGallery.module.css
|
|
203
|
+
var XStaticGallery_default = new Proxy({
|
|
204
|
+
"cols1": "XStaticGallery-module__cols1_7nn4pa__012",
|
|
205
|
+
"cols2": "XStaticGallery-module__cols2_7nn4pa__012",
|
|
206
|
+
"cols3": "XStaticGallery-module__cols3_7nn4pa__012",
|
|
207
|
+
"cols4": "XStaticGallery-module__cols4_7nn4pa__012",
|
|
208
|
+
"cols5": "XStaticGallery-module__cols5_7nn4pa__012",
|
|
209
|
+
"galleryContainer": "XStaticGallery-module__galleryContainer_7nn4pa__012",
|
|
210
|
+
"galleryImage": "XStaticGallery-module__galleryImage_7nn4pa__012",
|
|
211
|
+
"galleryTitle": "XStaticGallery-module__galleryTitle_7nn4pa__012",
|
|
212
|
+
"imageContainer": "XStaticGallery-module__imageContainer_7nn4pa__012",
|
|
213
|
+
"imageOverlay": "XStaticGallery-module__imageOverlay_7nn4pa__012",
|
|
214
|
+
"masonryGrid": "XStaticGallery-module__masonryGrid_7nn4pa__012",
|
|
215
|
+
"masonryItem": "XStaticGallery-module__masonryItem_7nn4pa__012",
|
|
216
|
+
"visible": "XStaticGallery-module__visible_7nn4pa__012"
|
|
217
|
+
}, {
|
|
218
|
+
get: function(source, key) {
|
|
219
|
+
inject2();
|
|
220
|
+
return source[key];
|
|
221
|
+
}
|
|
222
|
+
});
|
|
223
|
+
|
|
162
224
|
// src/components/gallery/xstaticgallery/XStaticGallery.tsx
|
|
163
225
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
164
226
|
var COLUMN_CLASSES = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/gallery/index.ts", "../../../src/components/gallery/xmicrogallerytext/XMicroGalleryText.tsx", "../../../src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css", "../../../src/components/gallery/xstaticgallery/XStaticGallery.tsx", "../../../src/components/gallery/xstaticgallery/XStaticGallery.module.css"],
|
|
4
|
-
"sourcesContent": ["export { XMicroGalleryText } from \"./xmicrogallerytext\";\nexport { XStaticGallery } from \"./xstaticgallery\";\nexport type { XMicroGalleryTextProps, XMicroGalleryImage } from \"./xmicrogallerytext\";\nexport type { XStaticGalleryProps, XStaticGalleryImage } from \"./xstaticgallery\";\n", "import React, { useEffect, useRef } from 'react';\nimport Image from 'next/image';\nimport { motion } from 'framer-motion';\nimport styles from './XMicroGalleryText.module.css';\n\nexport interface XMicroGalleryImage {\n src: string;\n alt: string;\n}\n\nexport interface XMicroGalleryTextProps {\n images: XMicroGalleryImage[];\n text: React.ReactNode;\n textPosition?: 'left' | 'right';\n textAlign?: 'left' | 'right' | 'center';\n autoShuffle?: boolean;\n shuffleInterval?: number;\n}\n\nconst DISPLAY_COUNT = 3;\n\nconst XMicroGalleryText: React.FC<XMicroGalleryTextProps> = ({ \n images, \n text, \n textPosition = 'left',\n textAlign = 'left',\n autoShuffle = false,\n shuffleInterval = 5000\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [startIndex, setStartIndex] = React.useState(0);\n\n const visibleImages = React.useMemo(() => {\n const result: XMicroGalleryImage[] = [];\n for (let i = 0; i < DISPLAY_COUNT; i++) {\n result.push(images[(startIndex + i) % images.length]);\n }\n return result;\n }, [images, startIndex]);\n\n React.useEffect(() => {\n if (!autoShuffle || images.length <= DISPLAY_COUNT) return;\n\n const intervalId = setInterval(() => {\n setStartIndex((prev) => (prev + 1) % images.length);\n }, shuffleInterval);\n\n return () => clearInterval(intervalId);\n }, [autoShuffle, shuffleInterval, images.length]);\n\n const [isVisible, setIsVisible] = React.useState(false);\n\n useEffect(() => {\n const observer = new IntersectionObserver(\n ([entry]) => {\n if (entry.isIntersecting) {\n setIsVisible(true);\n observer.disconnect();\n }\n },\n {\n threshold: 0.1,\n rootMargin: '0px 0px -50px 0px'\n }\n );\n\n if (containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => observer.disconnect();\n }, []);\n\n const isTextRight = textPosition === 'right';\n\n const alignClass = {\n left: styles.textLeft,\n right: styles.textRight,\n center: styles.textCenter,\n }[textAlign];\n\n return (\n <div ref={containerRef} className={`${styles.container} ${isTextRight ? styles.reverse : ''}`}>\n <div className={`${styles.textContent} ${alignClass} ${isVisible ? styles.visible : ''}`}>\n {typeof text === 'string' ? (\n <div dangerouslySetInnerHTML={{ __html: text }} />\n ) : (\n text\n )}\n </div>\n \n <div className={styles.gallery}>\n <div className={styles.artisticGrid}>\n {visibleImages.map((image, index) => (\n <motion.div \n layout\n key={image.src} \n className={`${styles.imageWrapper} ${styles[`artistic${index + 1}`]} ${isVisible ? styles.visible : ''}`}\n style={{ transitionProperty: 'opacity, box-shadow' }}\n transition={{\n layout: { type: \"spring\", stiffness: 80, damping: 20 }\n }}\n >\n <Image\n src={image.src}\n alt={image.alt}\n fill\n className={styles.previewImage}\n sizes=\"(max-width: 768px) 100vw, (max-width: 1024px) 50vw, 33vw\"\n />\n </motion.div>\n ))}\n </div>\n </div>\n </div>\n );\n};\n\nexport default XMicroGalleryText;\n", ".container {\n display: flex;\n flex-direction: column;\n gap: 2rem;\n width: 100%;\n align-items: center;\n margin: 2rem 0;\n}\n\n@media (min-width: 1024px) {\n .container {\n flex-direction: row;\n align-items: center;\n gap: 4rem;\n }\n \n .reverse {\n flex-direction: row-reverse;\n }\n}\n\n.textContent {\n flex: 1;\n opacity: 0;\n transform: translateY(30px);\n transition: opacity 0.8s ease-out, transform 0.8s ease-out;\n color: var(--foreground);\n}\n\n.textContent.visible {\n opacity: 1;\n transform: translateY(0);\n}\n\n.textLeft {\n text-align: left;\n}\n\n.textRight {\n text-align: right;\n}\n\n.textCenter {\n text-align: center;\n}\n\n.textContent p,\n.textContent div,\n.textContent span,\n.textContent em,\n.textContent strong,\n.textContent a {\n text-align: inherit;\n max-width: none;\n margin-left: unset;\n margin-right: unset;\n}\n\n.gallery {\n flex: 1.5;\n width: 100%;\n}\n\n.artisticGrid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n grid-template-rows: 380px 220px;\n gap: 1rem;\n}\n\n.imageWrapper {\n position: relative;\n overflow: hidden;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n border-radius: 20px;\n opacity: 0;\n transform: translateY(50px) scale(0.95);\n transition: opacity 0.6s ease-out, transform 0.6s ease-out, box-shadow 0.3s ease;\n}\n\n.imageWrapper.visible {\n opacity: 1;\n transform: translateY(0) scale(1);\n}\n\n.imageWrapper:hover {\n transform: translateY(-5px);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);\n}\n\n.previewImage {\n object-fit: cover;\n}\n\n.artisticGrid .artistic1 .previewImage {\n object-position: center top;\n transform: translateY(0);\n}\n\n.artistic1 {\n grid-column: 1 / 4;\n grid-row: 1 / 2;\n transition-delay: 0.2s;\n}\n\n.artistic2 {\n grid-column: 1 / 2;\n grid-row: 2 / 3;\n transition-delay: 0.3s;\n}\n\n.artistic3 {\n grid-column: 2 / 4;\n grid-row: 2 / 3;\n transition-delay: 0.4s;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .artisticGrid {\n grid-template-columns: 1fr;\n grid-template-rows: 240px 180px 180px;\n }\n \n .artistic1,\n .artistic2,\n .artistic3 {\n grid-column: 1 / 2;\n }\n \n .artistic1 {\n grid-row: 1 / 2;\n }\n \n .artistic2 {\n grid-row: 2 / 3;\n }\n \n .artistic3 {\n grid-row: 3 / 4;\n }\n}\n\n@media (max-width: 480px) {\n .artisticGrid {\n grid-template-rows: 200px 140px 140px;\n }\n}\n", "\"use client\";\nimport React, { useEffect, useRef } from 'react';\nimport Image from 'next/image';\nimport styles from './XStaticGallery.module.css';\n\nexport interface XStaticGalleryImage {\n src: string;\n alt: string;\n}\n\nexport interface XStaticGalleryProps {\n images: XStaticGalleryImage[];\n columns?: 1 | 2 | 3 | 4 | 5;\n title?: string;\n}\n\nconst COLUMN_CLASSES: Record<number, string> = {\n 1: styles.cols1,\n 2: styles.cols2,\n 3: styles.cols3,\n 4: styles.cols4,\n 5: styles.cols5,\n};\n\nexport default function XStaticGallery({ images, columns = 4, title }: XStaticGalleryProps) {\n const containerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new IntersectionObserver(\n (entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n entry.target.classList.add(styles.visible);\n }\n });\n },\n {\n threshold: 0.1,\n rootMargin: '0px 0px -50px 0px',\n }\n );\n\n const items = containerRef.current?.querySelectorAll(`.${styles.masonryItem}`);\n items?.forEach((el) => observer.observe(el));\n\n return () => observer.disconnect();\n }, []);\n\n const colClass = COLUMN_CLASSES[columns] || COLUMN_CLASSES[4];\n\n return (\n <div ref={containerRef} className={styles.galleryContainer}>\n {title && <h2 className={styles.galleryTitle}>{title}</h2>}\n\n <div className={`${styles.masonryGrid} ${colClass}`}>\n {images.map((image, index) => (\n <div key={index} className={styles.masonryItem}>\n <div className={styles.imageContainer}>\n <Image\n src={image.src}\n alt={image.alt}\n width={600}\n height={600}\n className={styles.galleryImage}\n loading=\"lazy\"\n sizes=\"(max-width: 640px) 100vw, (max-width: 768px) 50vw, (max-width: 1280px) 33vw, 25vw\"\n />\n <div className={styles.imageOverlay} />\n </div>\n </div>\n ))}\n </div>\n </div>\n );\n}\n", ".galleryContainer {\n width: 100%;\n max-width: 80rem;\n margin: 0 auto;\n padding: 1rem 1rem 3rem;\n}\n\n.galleryTitle {\n font-size: 1.875rem;\n text-align: right;\n color: var(--primary);\n margin-bottom: 3rem;\n opacity: 0.8;\n}\n\n/* Masonry via CSS columns */\n.masonryGrid {\n gap: 1rem;\n}\n\n.masonryItem {\n break-inside: avoid;\n position: relative;\n border-radius: 1rem;\n overflow: hidden;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n margin-bottom: 1rem;\n opacity: 0;\n transform: translateY(20px);\n transition: opacity 0.5s ease-out, transform 0.5s ease-out, box-shadow 0.3s ease;\n}\n\n.masonryItem.visible {\n opacity: 1;\n transform: translateY(0);\n}\n\n.masonryItem:hover {\n box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);\n}\n\n.imageContainer {\n position: relative;\n width: 100%;\n overflow: hidden;\n border-radius: 1rem;\n}\n\n.galleryImage {\n width: 100%;\n height: auto;\n object-fit: cover;\n display: block;\n transition: transform 0.5s ease-out;\n}\n\n.masonryItem:hover .galleryImage {\n transform: scale(1.05);\n}\n\n.imageOverlay {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0);\n transition: background 0.3s ease;\n pointer-events: none;\n}\n\n.masonryItem:hover .imageOverlay {\n background: rgba(0, 0, 0, 0.1);\n}\n\n/* Column count via CSS custom property */\n.cols1 { columns: 1; }\n.cols2 { columns: 2; }\n.cols3 { columns: 3; }\n.cols4 { columns: 4; }\n.cols5 { columns: 5; }\n\n/* Responsive overrides */\n@media (max-width: 1280px) {\n .cols4, .cols5 { columns: 3; }\n}\n\n@media (max-width: 768px) {\n .cols3, .cols4, .cols5 { columns: 2; }\n}\n\n@media (max-width: 640px) {\n .cols2, .cols3, .cols4, .cols5 { columns: 1; }\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,2BAAAA;AAAA,EAAA;AAAA;AAAA;;;ACAA,mBAAyC;AACzC,mBAAkB;AAClB,2BAAuB;;;
|
|
6
|
-
"names": ["XMicroGalleryText_default", "
|
|
3
|
+
"sources": ["../../../src/components/gallery/index.ts", "../../../src/components/gallery/xmicrogallerytext/XMicroGalleryText.tsx", "esbuild-css-modules-plugin-ns-js::src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css:injector.js", "../../../src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css", "../../../src/components/gallery/xstaticgallery/XStaticGallery.tsx", "esbuild-css-modules-plugin-ns-js::src/components/gallery/xstaticgallery/XStaticGallery.module.css:injector.js", "../../../src/components/gallery/xstaticgallery/XStaticGallery.module.css"],
|
|
4
|
+
"sourcesContent": ["export { XMicroGalleryText } from \"./xmicrogallerytext\";\nexport { XStaticGallery } from \"./xstaticgallery\";\nexport type { XMicroGalleryTextProps, XMicroGalleryImage } from \"./xmicrogallerytext\";\nexport type { XStaticGalleryProps, XStaticGalleryImage } from \"./xstaticgallery\";\n", "import React, { useEffect, useRef } from 'react';\nimport Image from 'next/image';\nimport { motion } from 'framer-motion';\nimport styles from './XMicroGalleryText.module.css';\n\nexport interface XMicroGalleryImage {\n src: string;\n alt: string;\n}\n\nexport interface XMicroGalleryTextProps {\n images: XMicroGalleryImage[];\n text: React.ReactNode;\n textPosition?: 'left' | 'right';\n textAlign?: 'left' | 'right' | 'center';\n autoShuffle?: boolean;\n shuffleInterval?: number;\n}\n\nconst DISPLAY_COUNT = 3;\n\nconst XMicroGalleryText: React.FC<XMicroGalleryTextProps> = ({ \n images, \n text, \n textPosition = 'left',\n textAlign = 'left',\n autoShuffle = false,\n shuffleInterval = 5000\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [startIndex, setStartIndex] = React.useState(0);\n\n const visibleImages = React.useMemo(() => {\n const result: XMicroGalleryImage[] = [];\n for (let i = 0; i < DISPLAY_COUNT; i++) {\n result.push(images[(startIndex + i) % images.length]);\n }\n return result;\n }, [images, startIndex]);\n\n React.useEffect(() => {\n if (!autoShuffle || images.length <= DISPLAY_COUNT) return;\n\n const intervalId = setInterval(() => {\n setStartIndex((prev) => (prev + 1) % images.length);\n }, shuffleInterval);\n\n return () => clearInterval(intervalId);\n }, [autoShuffle, shuffleInterval, images.length]);\n\n const [isVisible, setIsVisible] = React.useState(false);\n\n useEffect(() => {\n const observer = new IntersectionObserver(\n ([entry]) => {\n if (entry.isIntersecting) {\n setIsVisible(true);\n observer.disconnect();\n }\n },\n {\n threshold: 0.1,\n rootMargin: '0px 0px -50px 0px'\n }\n );\n\n if (containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => observer.disconnect();\n }, []);\n\n const isTextRight = textPosition === 'right';\n\n const alignClass = {\n left: styles.textLeft,\n right: styles.textRight,\n center: styles.textCenter,\n }[textAlign];\n\n return (\n <div ref={containerRef} className={`${styles.container} ${isTextRight ? styles.reverse : ''}`}>\n <div className={`${styles.textContent} ${alignClass} ${isVisible ? styles.visible : ''}`}>\n {typeof text === 'string' ? (\n <div dangerouslySetInnerHTML={{ __html: text }} />\n ) : (\n text\n )}\n </div>\n \n <div className={styles.gallery}>\n <div className={styles.artisticGrid}>\n {visibleImages.map((image, index) => (\n <motion.div \n layout\n key={image.src} \n className={`${styles.imageWrapper} ${styles[`artistic${index + 1}`]} ${isVisible ? styles.visible : ''}`}\n style={{ transitionProperty: 'opacity, box-shadow' }}\n transition={{\n layout: { type: \"spring\", stiffness: 80, damping: 20 }\n }}\n >\n <Image\n src={image.src}\n alt={image.alt}\n fill\n className={styles.previewImage}\n sizes=\"(max-width: 768px) 100vw, (max-width: 1024px) 50vw, 33vw\"\n />\n </motion.div>\n ))}\n </div>\n </div>\n </div>\n );\n};\n\nexport default XMicroGalleryText;\n", "\nconst content = __content_placeholder__;\nconst digest = __digest_placeholder__; \nconst inject = () => {\n setTimeout(() => {\n if (!globalThis.document) {\n return;\n }\n let root = globalThis.document.querySelector(\"head\");\n if (root && root.shadowRoot) {\n root = root.shadowRoot;\n }\n if (!root) {\n root = globalThis.document.head;\n }\n let container = root.querySelector(\"#_\" + digest);\n if (!container) {\n container = globalThis.document.createElement(\"style\");\n container.id = \"_\" + digest;\n const text = globalThis.document.createTextNode(content);\n container.appendChild(text);\n root.appendChild(container);\n }\n }, 0);\n};\n\nexport { inject };\n ", "import \"esbuild-css-modules-plugin-ns-css:src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/gallery/xmicrogallerytext/XMicroGalleryText.module.css:injector.js\";\nexport default new Proxy({\n \"artistic1\": \"XMicroGalleryText-module__artistic1_22YC0W__012\",\n \"artistic2\": \"XMicroGalleryText-module__artistic2_22YC0W__012\",\n \"artistic3\": \"XMicroGalleryText-module__artistic3_22YC0W__012\",\n \"artisticGrid\": \"XMicroGalleryText-module__artisticGrid_22YC0W__012\",\n \"container\": \"XMicroGalleryText-module__container_22YC0W__012\",\n \"gallery\": \"XMicroGalleryText-module__gallery_22YC0W__012\",\n \"imageWrapper\": \"XMicroGalleryText-module__imageWrapper_22YC0W__012\",\n \"previewImage\": \"XMicroGalleryText-module__previewImage_22YC0W__012\",\n \"reverse\": \"XMicroGalleryText-module__reverse_22YC0W__012\",\n \"textCenter\": \"XMicroGalleryText-module__textCenter_22YC0W__012\",\n \"textContent\": \"XMicroGalleryText-module__textContent_22YC0W__012\",\n \"textLeft\": \"XMicroGalleryText-module__textLeft_22YC0W__012\",\n \"textRight\": \"XMicroGalleryText-module__textRight_22YC0W__012\",\n \"visible\": \"XMicroGalleryText-module__visible_22YC0W__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n ", "\"use client\";\nimport React, { useEffect, useRef } from 'react';\nimport Image from 'next/image';\nimport styles from './XStaticGallery.module.css';\n\nexport interface XStaticGalleryImage {\n src: string;\n alt: string;\n}\n\nexport interface XStaticGalleryProps {\n images: XStaticGalleryImage[];\n columns?: 1 | 2 | 3 | 4 | 5;\n title?: string;\n}\n\nconst COLUMN_CLASSES: Record<number, string> = {\n 1: styles.cols1,\n 2: styles.cols2,\n 3: styles.cols3,\n 4: styles.cols4,\n 5: styles.cols5,\n};\n\nexport default function XStaticGallery({ images, columns = 4, title }: XStaticGalleryProps) {\n const containerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new IntersectionObserver(\n (entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n entry.target.classList.add(styles.visible);\n }\n });\n },\n {\n threshold: 0.1,\n rootMargin: '0px 0px -50px 0px',\n }\n );\n\n const items = containerRef.current?.querySelectorAll(`.${styles.masonryItem}`);\n items?.forEach((el) => observer.observe(el));\n\n return () => observer.disconnect();\n }, []);\n\n const colClass = COLUMN_CLASSES[columns] || COLUMN_CLASSES[4];\n\n return (\n <div ref={containerRef} className={styles.galleryContainer}>\n {title && <h2 className={styles.galleryTitle}>{title}</h2>}\n\n <div className={`${styles.masonryGrid} ${colClass}`}>\n {images.map((image, index) => (\n <div key={index} className={styles.masonryItem}>\n <div className={styles.imageContainer}>\n <Image\n src={image.src}\n alt={image.alt}\n width={600}\n height={600}\n className={styles.galleryImage}\n loading=\"lazy\"\n sizes=\"(max-width: 640px) 100vw, (max-width: 768px) 50vw, (max-width: 1280px) 33vw, 25vw\"\n />\n <div className={styles.imageOverlay} />\n </div>\n </div>\n ))}\n </div>\n </div>\n );\n}\n", "\nconst content = __content_placeholder__;\nconst digest = __digest_placeholder__; \nconst inject = () => {\n setTimeout(() => {\n if (!globalThis.document) {\n return;\n }\n let root = globalThis.document.querySelector(\"head\");\n if (root && root.shadowRoot) {\n root = root.shadowRoot;\n }\n if (!root) {\n root = globalThis.document.head;\n }\n let container = root.querySelector(\"#_\" + digest);\n if (!container) {\n container = globalThis.document.createElement(\"style\");\n container.id = \"_\" + digest;\n const text = globalThis.document.createTextNode(content);\n container.appendChild(text);\n root.appendChild(container);\n }\n }, 0);\n};\n\nexport { inject };\n ", "import \"esbuild-css-modules-plugin-ns-css:src/components/gallery/xstaticgallery/XStaticGallery.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/gallery/xstaticgallery/XStaticGallery.module.css:injector.js\";\nexport default new Proxy({\n \"cols1\": \"XStaticGallery-module__cols1_7nn4pa__012\",\n \"cols2\": \"XStaticGallery-module__cols2_7nn4pa__012\",\n \"cols3\": \"XStaticGallery-module__cols3_7nn4pa__012\",\n \"cols4\": \"XStaticGallery-module__cols4_7nn4pa__012\",\n \"cols5\": \"XStaticGallery-module__cols5_7nn4pa__012\",\n \"galleryContainer\": \"XStaticGallery-module__galleryContainer_7nn4pa__012\",\n \"galleryImage\": \"XStaticGallery-module__galleryImage_7nn4pa__012\",\n \"galleryTitle\": \"XStaticGallery-module__galleryTitle_7nn4pa__012\",\n \"imageContainer\": \"XStaticGallery-module__imageContainer_7nn4pa__012\",\n \"imageOverlay\": \"XStaticGallery-module__imageOverlay_7nn4pa__012\",\n \"masonryGrid\": \"XStaticGallery-module__masonryGrid_7nn4pa__012\",\n \"masonryItem\": \"XStaticGallery-module__masonryItem_7nn4pa__012\",\n \"visible\": \"XStaticGallery-module__visible_7nn4pa__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n "],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["XMicroGalleryText_default", "React", "Image", "XMicroGalleryText_default", "import_react", "import_image", "content", "digest", "inject", "inject", "import_jsx_runtime", "Image"]
|
|
7
7
|
}
|