@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
|
@@ -1,28 +1,59 @@
|
|
|
1
1
|
// src/components/forms/xcontactform/XContactForm.tsx
|
|
2
2
|
import { useState } from "react";
|
|
3
3
|
|
|
4
|
-
// src/components/forms/xcontactform/XContactForm.module.css
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
4
|
+
// esbuild-css-modules-plugin-ns-js::src/components/forms/xcontactform/XContactForm.module.css:injector.js
|
|
5
|
+
var content = __content_placeholder__;
|
|
6
|
+
var digest = __digest_placeholder__;
|
|
7
|
+
var inject = () => {
|
|
8
|
+
setTimeout(() => {
|
|
9
|
+
if (!globalThis.document) {
|
|
10
|
+
return;
|
|
11
|
+
}
|
|
12
|
+
let root = globalThis.document.querySelector("head");
|
|
13
|
+
if (root && root.shadowRoot) {
|
|
14
|
+
root = root.shadowRoot;
|
|
15
|
+
}
|
|
16
|
+
if (!root) {
|
|
17
|
+
root = globalThis.document.head;
|
|
18
|
+
}
|
|
19
|
+
let container = root.querySelector("#_" + digest);
|
|
20
|
+
if (!container) {
|
|
21
|
+
container = globalThis.document.createElement("style");
|
|
22
|
+
container.id = "_" + digest;
|
|
23
|
+
const text = globalThis.document.createTextNode(content);
|
|
24
|
+
container.appendChild(text);
|
|
25
|
+
root.appendChild(container);
|
|
26
|
+
}
|
|
27
|
+
}, 0);
|
|
24
28
|
};
|
|
25
29
|
|
|
30
|
+
// src/components/forms/xcontactform/XContactForm.module.css
|
|
31
|
+
var XContactForm_default = new Proxy({
|
|
32
|
+
"button": "XContactForm-module__button_o7lHUG__012",
|
|
33
|
+
"buttoncontainer": "XContactForm-module__buttoncontainer_o7lHUG__012",
|
|
34
|
+
"decorativeXBottom": "XContactForm-module__decorativeXBottom_o7lHUG__012",
|
|
35
|
+
"decorativeXTop": "XContactForm-module__decorativeXTop_o7lHUG__012",
|
|
36
|
+
"field": "XContactForm-module__field_o7lHUG__012",
|
|
37
|
+
"form": "XContactForm-module__form_o7lHUG__012",
|
|
38
|
+
"grid": "XContactForm-module__grid_o7lHUG__012",
|
|
39
|
+
"honeypot": "XContactForm-module__honeypot_o7lHUG__012",
|
|
40
|
+
"large": "XContactForm-module__large_o7lHUG__012",
|
|
41
|
+
"medium": "XContactForm-module__medium_o7lHUG__012",
|
|
42
|
+
"row": "XContactForm-module__row_o7lHUG__012",
|
|
43
|
+
"small": "XContactForm-module__small_o7lHUG__012",
|
|
44
|
+
"status": "XContactForm-module__status_o7lHUG__012",
|
|
45
|
+
"statusError": "XContactForm-module__statusError_o7lHUG__012",
|
|
46
|
+
"statusOk": "XContactForm-module__statusOk_o7lHUG__012",
|
|
47
|
+
"vertical": "XContactForm-module__vertical_o7lHUG__012",
|
|
48
|
+
"withDecorativeX": "XContactForm-module__withDecorativeX_o7lHUG__012",
|
|
49
|
+
"wrapper": "XContactForm-module__wrapper_o7lHUG__012"
|
|
50
|
+
}, {
|
|
51
|
+
get: function(source, key) {
|
|
52
|
+
inject();
|
|
53
|
+
return source[key];
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
|
|
26
57
|
// src/components/forms/xcontactform/XContactForm.tsx
|
|
27
58
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
28
59
|
function XContactForm({
|
|
@@ -173,26 +204,57 @@ function XContactForm({
|
|
|
173
204
|
import { useState as useState2 } from "react";
|
|
174
205
|
import Link from "next/link";
|
|
175
206
|
|
|
176
|
-
// src/components/forms/xnewsletter/XNewsletter.module.css
|
|
177
|
-
var
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
207
|
+
// esbuild-css-modules-plugin-ns-js::src/components/forms/xnewsletter/XNewsletter.module.css:injector.js
|
|
208
|
+
var content2 = __content_placeholder__;
|
|
209
|
+
var digest2 = __digest_placeholder__;
|
|
210
|
+
var inject2 = () => {
|
|
211
|
+
setTimeout(() => {
|
|
212
|
+
if (!globalThis.document) {
|
|
213
|
+
return;
|
|
214
|
+
}
|
|
215
|
+
let root = globalThis.document.querySelector("head");
|
|
216
|
+
if (root && root.shadowRoot) {
|
|
217
|
+
root = root.shadowRoot;
|
|
218
|
+
}
|
|
219
|
+
if (!root) {
|
|
220
|
+
root = globalThis.document.head;
|
|
221
|
+
}
|
|
222
|
+
let container = root.querySelector("#_" + digest2);
|
|
223
|
+
if (!container) {
|
|
224
|
+
container = globalThis.document.createElement("style");
|
|
225
|
+
container.id = "_" + digest2;
|
|
226
|
+
const text = globalThis.document.createTextNode(content2);
|
|
227
|
+
container.appendChild(text);
|
|
228
|
+
root.appendChild(container);
|
|
229
|
+
}
|
|
230
|
+
}, 0);
|
|
194
231
|
};
|
|
195
232
|
|
|
233
|
+
// src/components/forms/xnewsletter/XNewsletter.module.css
|
|
234
|
+
var XNewsletter_default = new Proxy({
|
|
235
|
+
"actions": "XNewsletter-module__actions_uZr2_a__012",
|
|
236
|
+
"actionsHorizontal": "XNewsletter-module__actionsHorizontal_uZr2_a__012",
|
|
237
|
+
"actionsVertical": "XNewsletter-module__actionsVertical_uZr2_a__012",
|
|
238
|
+
"button": "XNewsletter-module__button_uZr2_a__012",
|
|
239
|
+
"checkbox": "XNewsletter-module__checkbox_uZr2_a__012",
|
|
240
|
+
"checkboxLabel": "XNewsletter-module__checkboxLabel_uZr2_a__012",
|
|
241
|
+
"container": "XNewsletter-module__container_uZr2_a__012",
|
|
242
|
+
"form": "XNewsletter-module__form_uZr2_a__012",
|
|
243
|
+
"horizontal": "XNewsletter-module__horizontal_uZr2_a__012",
|
|
244
|
+
"input": "XNewsletter-module__input_uZr2_a__012",
|
|
245
|
+
"message": "XNewsletter-module__message_uZr2_a__012",
|
|
246
|
+
"messageHorizontal": "XNewsletter-module__messageHorizontal_uZr2_a__012",
|
|
247
|
+
"messageVertical": "XNewsletter-module__messageVertical_uZr2_a__012",
|
|
248
|
+
"termsLink": "XNewsletter-module__termsLink_uZr2_a__012",
|
|
249
|
+
"title": "XNewsletter-module__title_uZr2_a__012",
|
|
250
|
+
"vertical": "XNewsletter-module__vertical_uZr2_a__012"
|
|
251
|
+
}, {
|
|
252
|
+
get: function(source, key) {
|
|
253
|
+
inject2();
|
|
254
|
+
return source[key];
|
|
255
|
+
}
|
|
256
|
+
});
|
|
257
|
+
|
|
196
258
|
// src/components/forms/xnewsletter/XNewsletter.tsx
|
|
197
259
|
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
198
260
|
function XNewsletter({
|
|
@@ -353,4 +415,4 @@ export {
|
|
|
353
415
|
XContactForm,
|
|
354
416
|
XNewsletter
|
|
355
417
|
};
|
|
356
|
-
//# sourceMappingURL=chunk-
|
|
418
|
+
//# sourceMappingURL=chunk-BXVG4SYP.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/forms/xcontactform/XContactForm.tsx", "esbuild-css-modules-plugin-ns-js::src/components/forms/xcontactform/XContactForm.module.css:injector.js", "../src/components/forms/xcontactform/XContactForm.module.css", "../src/components/forms/xnewsletter/XNewsletter.tsx", "esbuild-css-modules-plugin-ns-js::src/components/forms/xnewsletter/XNewsletter.module.css:injector.js", "../src/components/forms/xnewsletter/XNewsletter.module.css"],
|
|
4
|
+
"sourcesContent": ["\"use client\";\n\nimport { useState } from \"react\";\nimport styles from \"./XContactForm.module.css\";\n\ntype Status = { ok: boolean; msg: string } | null;\n\nexport interface XContactFormProps {\n // Visibilidad\n showName?: boolean;\n showEmail?: boolean;\n showPhone?: boolean;\n showSubject?: boolean;\n showMessage?: boolean;\n \n // Placeholders\n namePlaceholder?: string;\n emailPlaceholder?: string;\n phonePlaceholder?: string;\n subjectPlaceholder?: string;\n messagePlaceholder?: string;\n\n // Dise\u00F1o\n labelColor?: string;\n wrapperBackgroundColor?: string;\n wrapperBorderColor?: string;\n wrapperBorderWidth?: string;\n wrapperBorderRadius?: \"rounded\" | \"square\";\n wrapperBorderStyle?: \"solid\" | \"dashed\" | \"dotted\";\n fieldBorderColor?: string;\n fieldBorderWidth?: string;\n fieldBorderRadius?: \"rounded\" | \"square\";\n fieldBorderStyle?: \"solid\" | \"dashed\" | \"dotted\";\n buttonColor?: string;\n buttonBorderColor?: string;\n buttonBorderWidth?: string;\n buttonBorderRadius?: \"rounded\" | \"square\";\n buttonBorderStyle?: \"solid\" | \"dashed\" | \"dotted\";\n buttonHoverColor?: string;\n buttonHoverTextColor?: string;\n buttonHoverBorderColor?: string;\n buttonTextColor?: string;\n buttonAlignment?: \"left\" | \"right\";\n\n // Mensajes de estado\n requiredFieldsMessage?: string;\n honeypotMessage?: string;\n submitSuccessMessage?: string;\n statusSuccessColor?: string;\n statusErrorColor?: string;\n\n // Decorativos\n decorativeX?: boolean;\n decorativeXColor?: string;\n\n size?: \"small\" | \"medium\" | \"large\";\n layout?: \"vertical\" | \"grid\";\n}\n\nexport default function XContactForm({\n showName = true,\n showEmail = true,\n showPhone = true,\n showSubject = true,\n showMessage = true,\n namePlaceholder = \"Tu nombre\",\n emailPlaceholder = \"tucorreo@ejemplo.com\",\n phonePlaceholder = \"+34 600 000 000\",\n subjectPlaceholder = \"Tema del mensaje\",\n messagePlaceholder = \"Cu\u00E9ntame qu\u00E9 necesitas\u2026\",\n labelColor,\n wrapperBackgroundColor,\n wrapperBorderColor,\n wrapperBorderWidth,\n wrapperBorderRadius = \"rounded\",\n wrapperBorderStyle = \"solid\",\n fieldBorderColor,\n fieldBorderWidth,\n fieldBorderRadius = \"rounded\",\n fieldBorderStyle = \"solid\",\n buttonColor,\n buttonBorderColor,\n buttonBorderWidth,\n buttonBorderRadius = \"rounded\",\n buttonBorderStyle = \"solid\",\n buttonHoverColor,\n buttonHoverTextColor,\n buttonHoverBorderColor,\n buttonTextColor,\n buttonAlignment = \"left\",\n requiredFieldsMessage = \"Rellena los campos obligatorios.\",\n honeypotMessage = \"Gracias.\",\n submitSuccessMessage = \"Abriendo tu aplicaci\u00F3n de correo\u2026\",\n statusSuccessColor,\n statusErrorColor,\n decorativeX = false,\n decorativeXColor = \"currentColor\",\n size = \"medium\",\n layout = \"grid\",\n}: XContactFormProps) {\n const [status, setStatus] = useState<Status>(null);\n\n function onSubmit(e: React.FormEvent<HTMLFormElement>) {\n e.preventDefault();\n setStatus(null);\n\n const form = e.currentTarget;\n const fd = new FormData(form);\n\n if ((fd.get(\"website\") as string)?.length) {\n setStatus({ ok: true, msg: honeypotMessage });\n form.reset();\n return;\n }\n\n const name = showName ? String(fd.get(\"name\") || \"\").trim() : \"\";\n const email = showEmail ? String(fd.get(\"email\") || \"\").trim() : \"\";\n const phone = showPhone ? String(fd.get(\"phone\") || \"\").trim() : \"\";\n const subject = showSubject\n ? String(fd.get(\"subject\") || \"Contacto desde web\").trim()\n : \"Contacto desde web\";\n const message = showMessage ? String(fd.get(\"message\") || \"\").trim() : \"\";\n\n if (\n (showName && !name) ||\n (showEmail && !email) ||\n (showPhone && !phone) ||\n (showMessage && !message)\n ) {\n setStatus({ ok: false, msg: requiredFieldsMessage });\n return;\n }\n\n const bodyLines = [];\n if (showName) bodyLines.push(`Nombre: ${name}`);\n if (showEmail) bodyLines.push(`Email: ${email}`);\n if (showPhone) bodyLines.push(`Tel\u00E9fono: ${phone}`);\n bodyLines.push(\"\");\n if (showMessage) bodyLines.push(message);\n\n const body = bodyLines.join(\"\\n\");\n const to = \"x@xscriptor.com\";\n const mailto = `mailto:${encodeURIComponent(to)}?subject=${encodeURIComponent(\n subject\n )}&body=${encodeURIComponent(body)}`;\n\n window.location.href = mailto;\n setStatus({ ok: true, msg: submitSuccessMessage });\n }\n\n const radiusMap = {\n rounded: \"0.5rem\",\n square: \"0\",\n } as const;\n\n const alignmentMap = {\n left: \"flex-start\",\n right: \"flex-end\",\n } as const;\n\n // Variables CSS din\u00E1micas para estilos configurables\n const customStyles = {\n ...(decorativeXColor && { \"--decorative-x-color\": decorativeXColor }),\n ...(labelColor && { \"--label-color\": labelColor }),\n ...(wrapperBackgroundColor && { \"--wrapper-bg-color\": wrapperBackgroundColor }),\n ...(wrapperBorderColor && { \"--wrapper-border-color\": wrapperBorderColor }),\n ...(wrapperBorderWidth && { \"--wrapper-border-width\": wrapperBorderWidth }),\n \"--wrapper-radius\": radiusMap[wrapperBorderRadius],\n \"--wrapper-border-style\": wrapperBorderStyle,\n ...(fieldBorderColor && { \"--field-border-color\": fieldBorderColor }),\n ...(fieldBorderWidth && { \"--field-border-width\": fieldBorderWidth }),\n \"--field-radius\": radiusMap[fieldBorderRadius],\n \"--field-border-style\": fieldBorderStyle,\n ...(buttonColor && { \"--btn-bg-color\": buttonColor }),\n ...(buttonBorderColor && { \"--btn-border-color\": buttonBorderColor }),\n ...(buttonBorderWidth && { \"--btn-border-width\": buttonBorderWidth }),\n \"--btn-radius\": radiusMap[buttonBorderRadius],\n \"--btn-border-style\": buttonBorderStyle,\n \"--btn-alignment\": alignmentMap[buttonAlignment],\n ...(buttonHoverColor && { \"--btn-hover-bg-color\": buttonHoverColor }),\n ...(buttonHoverTextColor && { \"--btn-hover-text-color\": buttonHoverTextColor }),\n ...(buttonHoverBorderColor && { \"--btn-hover-border-color\": buttonHoverBorderColor }),\n ...(buttonTextColor && { \"--btn-text-color\": buttonTextColor }),\n ...(statusSuccessColor && { \"--status-ok-color\": statusSuccessColor }),\n ...(statusErrorColor && { \"--status-error-color\": statusErrorColor }),\n } as React.CSSProperties;\n\n return (\n <div className={`${styles.wrapper} ${styles[size]} ${decorativeX ? styles.withDecorativeX : \"\"}`} style={customStyles}>\n {decorativeX && <div className={styles.decorativeXTop}>\u2715</div>}\n <form onSubmit={onSubmit} className={`${styles.form} ${styles[layout]}`} noValidate>\n <div className={styles.honeypot} aria-hidden=\"true\">\n <label htmlFor=\"website\">Tu web</label>\n <input id=\"website\" name=\"website\" type=\"text\" tabIndex={-1} autoComplete=\"off\" />\n </div>\n\n {(showName || showEmail || showPhone) && (\n <div className={styles.row}>\n {showName && (\n <div className={styles.field}>\n <label htmlFor=\"name\">Nombre</label>\n <input id=\"name\" name=\"name\" type=\"text\" placeholder={namePlaceholder} required maxLength={80} />\n </div>\n )}\n {showEmail && (\n <div className={styles.field}>\n <label htmlFor=\"email\">Email</label>\n <input id=\"email\" name=\"email\" type=\"email\" inputMode=\"email\" placeholder={emailPlaceholder} required />\n </div>\n )}\n {showPhone && (\n <div className={styles.field}>\n <label htmlFor=\"phone\">Tel\u00E9fono</label>\n <input id=\"phone\" name=\"phone\" type=\"tel\" inputMode=\"tel\" placeholder={phonePlaceholder} required maxLength={20} />\n </div>\n )}\n </div>\n )}\n\n {showSubject && (\n <div className={styles.field}>\n <label htmlFor=\"subject\">Asunto</label>\n <input id=\"subject\" name=\"subject\" type=\"text\" placeholder={subjectPlaceholder} required maxLength={120} />\n </div>\n )}\n\n {showMessage && (\n <div className={styles.field}>\n <label htmlFor=\"message\">Mensaje</label>\n <textarea id=\"message\" name=\"message\" rows={6} placeholder={messagePlaceholder} required maxLength={3000} />\n </div>\n )}\n\n <div className={styles.buttoncontainer}>\n <button type=\"submit\" className={styles.button}>\n Enviar\n </button>\n </div>\n\n <p className={`${styles.status} ${status?.ok ? styles.statusOk : status === null ? \"\" : styles.statusError}`} role=\"status\" aria-live=\"polite\">\n {status?.msg}\n </p>\n </form>\n {decorativeX && <div className={styles.decorativeXBottom}>\u2715</div>}\n </div>\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/forms/xcontactform/XContactForm.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/forms/xcontactform/XContactForm.module.css:injector.js\";\nexport default new Proxy({\n \"button\": \"XContactForm-module__button_o7lHUG__012\",\n \"buttoncontainer\": \"XContactForm-module__buttoncontainer_o7lHUG__012\",\n \"decorativeXBottom\": \"XContactForm-module__decorativeXBottom_o7lHUG__012\",\n \"decorativeXTop\": \"XContactForm-module__decorativeXTop_o7lHUG__012\",\n \"field\": \"XContactForm-module__field_o7lHUG__012\",\n \"form\": \"XContactForm-module__form_o7lHUG__012\",\n \"grid\": \"XContactForm-module__grid_o7lHUG__012\",\n \"honeypot\": \"XContactForm-module__honeypot_o7lHUG__012\",\n \"large\": \"XContactForm-module__large_o7lHUG__012\",\n \"medium\": \"XContactForm-module__medium_o7lHUG__012\",\n \"row\": \"XContactForm-module__row_o7lHUG__012\",\n \"small\": \"XContactForm-module__small_o7lHUG__012\",\n \"status\": \"XContactForm-module__status_o7lHUG__012\",\n \"statusError\": \"XContactForm-module__statusError_o7lHUG__012\",\n \"statusOk\": \"XContactForm-module__statusOk_o7lHUG__012\",\n \"vertical\": \"XContactForm-module__vertical_o7lHUG__012\",\n \"withDecorativeX\": \"XContactForm-module__withDecorativeX_o7lHUG__012\",\n \"wrapper\": \"XContactForm-module__wrapper_o7lHUG__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n ", "\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport styles from \"./XNewsletter.module.css\";\n\nexport interface XNewsletterProps {\n title?: string;\n placeholder?: string;\n buttonText?: string;\n termsText?: string;\n termsLinkText?: string;\n successMessage?: string;\n errorMessage?: string;\n termsErrorMessage?: string;\n termsLink?: string;\n apiRoute: string;\n method?: \"POST\" | \"GET\" | \"PUT\";\n payloadType?: \"formData\" | \"json\";\n layout?: \"horizontal\" | \"vertical\";\n accentColor?: string;\n textColor?: string;\n borderColor?: string;\n buttonTextColor?: string;\n containerClassName?: string; // Para clases extra desde afuera si las necesitas\n}\n\nexport default function XNewsletter({\n title = \"Recibe poes\u00EDa y reflexiones\",\n placeholder = \"tu@email.com\",\n buttonText = \"Suscribirse\",\n termsText = \"Acepto\",\n termsLinkText = \"t\u00E9rminos\",\n successMessage = \"\u00A1Bienvenido(a)!\",\n errorMessage = \"Algo sali\u00F3 mal. Por favor, intenta de nuevo.\",\n termsErrorMessage = \"Debes aceptar los t\u00E9rminos y condiciones para suscribirte...\",\n termsLink = \"/terminos-y-condiciones\",\n apiRoute,\n method = \"POST\",\n payloadType = \"formData\",\n layout = \"horizontal\",\n accentColor = \"var(--accent)\",\n textColor = \"var(--text)\",\n borderColor = \"var(--border)\",\n buttonTextColor = \"var(--accent-text)\",\n containerClassName = \"w-full max-w-4xl mx-auto px-4 py-6\",\n}: XNewsletterProps) {\n const [email, setEmail] = useState(\"\");\n const [acceptedTerms, setAcceptedTerms] = useState(false);\n const [message, setMessage] = useState(\"\");\n const [isLoading, setIsLoading] = useState(false);\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setMessage(\"\");\n\n if (!acceptedTerms) {\n setMessage(termsErrorMessage);\n return;\n }\n\n setIsLoading(true);\n\n try {\n let bodyData: BodyInit | null | undefined = null;\n let headers: HeadersInit = {};\n\n if (payloadType === \"formData\") {\n const formData = new FormData();\n formData.append(\"email\", email);\n bodyData = formData;\n } else if (payloadType === \"json\") {\n bodyData = JSON.stringify({ email });\n headers = { \"Content-Type\": \"application/json\" };\n }\n\n const response = await fetch(apiRoute, {\n method,\n headers,\n body: method !== \"GET\" ? bodyData : undefined,\n cache: \"no-store\",\n });\n\n const data = await response.json();\n\n if (response.ok && data.success) {\n setMessage(data.message || successMessage);\n setEmail(\"\");\n setAcceptedTerms(false);\n } else {\n setMessage(data.error || errorMessage);\n }\n } catch {\n setMessage(errorMessage);\n } finally {\n setIsLoading(false);\n }\n };\n\n // Convertimos las props de colores a Variables CSS nativas.\n const customCssVariables = {\n \"--nws-accent\": accentColor,\n \"--nws-text\": textColor,\n \"--nws-border\": borderColor,\n \"--nws-btn-text\": buttonTextColor,\n } as React.CSSProperties;\n\n return (\n <div\n className={`${styles.container} ${containerClassName}`}\n style={customCssVariables}\n >\n <form\n onSubmit={handleSubmit}\n className={`${styles.form} ${styles[layout]}`}\n >\n {/* T\u00EDtulo */}\n {title && <span className={styles.title}>{title}</span>}\n\n {/* Input */}\n <input\n type=\"email\"\n placeholder={placeholder}\n className={styles.input}\n aria-label=\"email\"\n value={email}\n onChange={(e) => setEmail(e.target.value)}\n required\n disabled={isLoading}\n />\n\n {/* Grupo Acciones (Checkbox + Bot\u00F3n) */}\n <div\n className={`${styles.actions} ${\n layout === \"horizontal\"\n ? styles.actionsHorizontal\n : styles.actionsVertical\n }`}\n >\n {/* Checkbox */}\n <label className={styles.checkboxLabel}>\n <input\n type=\"checkbox\"\n className={styles.checkbox}\n checked={acceptedTerms}\n onChange={(e) => setAcceptedTerms(e.target.checked)}\n required\n disabled={isLoading}\n />\n <span>\n {termsText}{\" \"}\n <Link\n href={termsLink}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={styles.termsLink}\n >\n {termsLinkText}\n </Link>\n </span>\n </label>\n\n {/* Bot\u00F3n */}\n <button\n type=\"submit\"\n disabled={isLoading}\n className={styles.button}\n >\n {isLoading ? \"Enviando...\" : buttonText}\n </button>\n </div>\n </form>\n\n {/* Mensaje */}\n {message && (\n <p\n className={`${styles.message} ${\n layout === \"horizontal\"\n ? styles.messageHorizontal\n : styles.messageVertical\n }`}\n >\n {message}\n </p>\n )}\n </div>\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/forms/xnewsletter/XNewsletter.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/forms/xnewsletter/XNewsletter.module.css:injector.js\";\nexport default new Proxy({\n \"actions\": \"XNewsletter-module__actions_uZr2_a__012\",\n \"actionsHorizontal\": \"XNewsletter-module__actionsHorizontal_uZr2_a__012\",\n \"actionsVertical\": \"XNewsletter-module__actionsVertical_uZr2_a__012\",\n \"button\": \"XNewsletter-module__button_uZr2_a__012\",\n \"checkbox\": \"XNewsletter-module__checkbox_uZr2_a__012\",\n \"checkboxLabel\": \"XNewsletter-module__checkboxLabel_uZr2_a__012\",\n \"container\": \"XNewsletter-module__container_uZr2_a__012\",\n \"form\": \"XNewsletter-module__form_uZr2_a__012\",\n \"horizontal\": \"XNewsletter-module__horizontal_uZr2_a__012\",\n \"input\": \"XNewsletter-module__input_uZr2_a__012\",\n \"message\": \"XNewsletter-module__message_uZr2_a__012\",\n \"messageHorizontal\": \"XNewsletter-module__messageHorizontal_uZr2_a__012\",\n \"messageVertical\": \"XNewsletter-module__messageVertical_uZr2_a__012\",\n \"termsLink\": \"XNewsletter-module__termsLink_uZr2_a__012\",\n \"title\": \"XNewsletter-module__title_uZr2_a__012\",\n \"vertical\": \"XNewsletter-module__vertical_uZr2_a__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n "],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["useState", "content", "digest", "inject", "inject", "jsx", "jsxs", "useState"]
|
|
7
|
+
}
|
|
@@ -1,16 +1,47 @@
|
|
|
1
1
|
// src/components/layout/xfooter/XFooter.tsx
|
|
2
2
|
import Link from "next/link";
|
|
3
3
|
|
|
4
|
-
// src/components/layout/xfooter/XFooter.module.css
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
4
|
+
// esbuild-css-modules-plugin-ns-js::src/components/layout/xfooter/XFooter.module.css:injector.js
|
|
5
|
+
var content = __content_placeholder__;
|
|
6
|
+
var digest = __digest_placeholder__;
|
|
7
|
+
var inject = () => {
|
|
8
|
+
setTimeout(() => {
|
|
9
|
+
if (!globalThis.document) {
|
|
10
|
+
return;
|
|
11
|
+
}
|
|
12
|
+
let root = globalThis.document.querySelector("head");
|
|
13
|
+
if (root && root.shadowRoot) {
|
|
14
|
+
root = root.shadowRoot;
|
|
15
|
+
}
|
|
16
|
+
if (!root) {
|
|
17
|
+
root = globalThis.document.head;
|
|
18
|
+
}
|
|
19
|
+
let container = root.querySelector("#_" + digest);
|
|
20
|
+
if (!container) {
|
|
21
|
+
container = globalThis.document.createElement("style");
|
|
22
|
+
container.id = "_" + digest;
|
|
23
|
+
const text = globalThis.document.createTextNode(content);
|
|
24
|
+
container.appendChild(text);
|
|
25
|
+
root.appendChild(container);
|
|
26
|
+
}
|
|
27
|
+
}, 0);
|
|
12
28
|
};
|
|
13
29
|
|
|
30
|
+
// src/components/layout/xfooter/XFooter.module.css
|
|
31
|
+
var XFooter_default = new Proxy({
|
|
32
|
+
"xFooter": "XFooter-module__XFooter_v8t72G__012",
|
|
33
|
+
"container": "XFooter-module__container_v8t72G__012",
|
|
34
|
+
"copyright": "XFooter-module__copyright_v8t72G__012",
|
|
35
|
+
"link": "XFooter-module__link_v8t72G__012",
|
|
36
|
+
"nav": "XFooter-module__nav_v8t72G__012",
|
|
37
|
+
"navVertical": "XFooter-module__navVertical_v8t72G__012"
|
|
38
|
+
}, {
|
|
39
|
+
get: function(source, key) {
|
|
40
|
+
inject();
|
|
41
|
+
return source[key];
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
|
|
14
45
|
// src/components/layout/xfooter/XFooter.tsx
|
|
15
46
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
16
47
|
function XFooter({
|
|
@@ -39,18 +70,49 @@ function XFooter({
|
|
|
39
70
|
] }) });
|
|
40
71
|
}
|
|
41
72
|
|
|
42
|
-
// src/components/layout/xseparator/XSeparator.module.css
|
|
43
|
-
var
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
73
|
+
// esbuild-css-modules-plugin-ns-js::src/components/layout/xseparator/XSeparator.module.css:injector.js
|
|
74
|
+
var content2 = __content_placeholder__;
|
|
75
|
+
var digest2 = __digest_placeholder__;
|
|
76
|
+
var inject2 = () => {
|
|
77
|
+
setTimeout(() => {
|
|
78
|
+
if (!globalThis.document) {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
let root = globalThis.document.querySelector("head");
|
|
82
|
+
if (root && root.shadowRoot) {
|
|
83
|
+
root = root.shadowRoot;
|
|
84
|
+
}
|
|
85
|
+
if (!root) {
|
|
86
|
+
root = globalThis.document.head;
|
|
87
|
+
}
|
|
88
|
+
let container = root.querySelector("#_" + digest2);
|
|
89
|
+
if (!container) {
|
|
90
|
+
container = globalThis.document.createElement("style");
|
|
91
|
+
container.id = "_" + digest2;
|
|
92
|
+
const text = globalThis.document.createTextNode(content2);
|
|
93
|
+
container.appendChild(text);
|
|
94
|
+
root.appendChild(container);
|
|
95
|
+
}
|
|
96
|
+
}, 0);
|
|
52
97
|
};
|
|
53
98
|
|
|
99
|
+
// src/components/layout/xseparator/XSeparator.module.css
|
|
100
|
+
var XSeparator_default = new Proxy({
|
|
101
|
+
"dashed": "XSeparator-module__dashed_btqQTG__012",
|
|
102
|
+
"dotted": "XSeparator-module__dotted_btqQTG__012",
|
|
103
|
+
"faded": "XSeparator-module__faded_btqQTG__012",
|
|
104
|
+
"horizontal": "XSeparator-module__horizontal_btqQTG__012",
|
|
105
|
+
"iconWrapper": "XSeparator-module__iconWrapper_btqQTG__012",
|
|
106
|
+
"separator": "XSeparator-module__separator_btqQTG__012",
|
|
107
|
+
"separatorContainer": "XSeparator-module__separatorContainer_btqQTG__012",
|
|
108
|
+
"vertical": "XSeparator-module__vertical_btqQTG__012"
|
|
109
|
+
}, {
|
|
110
|
+
get: function(source, key) {
|
|
111
|
+
inject2();
|
|
112
|
+
return source[key];
|
|
113
|
+
}
|
|
114
|
+
});
|
|
115
|
+
|
|
54
116
|
// src/components/layout/xseparator/XSeparator.tsx
|
|
55
117
|
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
56
118
|
function XSeparator({
|
|
@@ -90,18 +152,49 @@ function XSeparator({
|
|
|
90
152
|
// src/components/layout/xzigzaglayout/XZigZagLayout.tsx
|
|
91
153
|
import { Children, useEffect, useRef, useState, useCallback } from "react";
|
|
92
154
|
|
|
93
|
-
// src/components/layout/xzigzaglayout/XZigZagLayout.module.css
|
|
94
|
-
var
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
155
|
+
// esbuild-css-modules-plugin-ns-js::src/components/layout/xzigzaglayout/XZigZagLayout.module.css:injector.js
|
|
156
|
+
var content3 = __content_placeholder__;
|
|
157
|
+
var digest3 = __digest_placeholder__;
|
|
158
|
+
var inject3 = () => {
|
|
159
|
+
setTimeout(() => {
|
|
160
|
+
if (!globalThis.document) {
|
|
161
|
+
return;
|
|
162
|
+
}
|
|
163
|
+
let root = globalThis.document.querySelector("head");
|
|
164
|
+
if (root && root.shadowRoot) {
|
|
165
|
+
root = root.shadowRoot;
|
|
166
|
+
}
|
|
167
|
+
if (!root) {
|
|
168
|
+
root = globalThis.document.head;
|
|
169
|
+
}
|
|
170
|
+
let container = root.querySelector("#_" + digest3);
|
|
171
|
+
if (!container) {
|
|
172
|
+
container = globalThis.document.createElement("style");
|
|
173
|
+
container.id = "_" + digest3;
|
|
174
|
+
const text = globalThis.document.createTextNode(content3);
|
|
175
|
+
container.appendChild(text);
|
|
176
|
+
root.appendChild(container);
|
|
177
|
+
}
|
|
178
|
+
}, 0);
|
|
103
179
|
};
|
|
104
180
|
|
|
181
|
+
// src/components/layout/xzigzaglayout/XZigZagLayout.module.css
|
|
182
|
+
var XZigZagLayout_default = new Proxy({
|
|
183
|
+
"contentWrapper": "XZigZagLayout-module__contentWrapper_Jgc4GG__012",
|
|
184
|
+
"item": "XZigZagLayout-module__item_Jgc4GG__012",
|
|
185
|
+
"layout": "XZigZagLayout-module__layout_Jgc4GG__012",
|
|
186
|
+
"left": "XZigZagLayout-module__left_Jgc4GG__012",
|
|
187
|
+
"right": "XZigZagLayout-module__right_Jgc4GG__012",
|
|
188
|
+
"svgLine": "XZigZagLayout-module__svgLine_Jgc4GG__012",
|
|
189
|
+
"textLeft": "XZigZagLayout-module__textLeft_Jgc4GG__012",
|
|
190
|
+
"textRight": "XZigZagLayout-module__textRight_Jgc4GG__012"
|
|
191
|
+
}, {
|
|
192
|
+
get: function(source, key) {
|
|
193
|
+
inject3();
|
|
194
|
+
return source[key];
|
|
195
|
+
}
|
|
196
|
+
});
|
|
197
|
+
|
|
105
198
|
// src/components/layout/xzigzaglayout/XZigZagLayout.tsx
|
|
106
199
|
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
107
200
|
function XZigZagLayout({
|
|
@@ -208,4 +301,4 @@ export {
|
|
|
208
301
|
XSeparator,
|
|
209
302
|
XZigZagLayout
|
|
210
303
|
};
|
|
211
|
-
//# sourceMappingURL=chunk-
|
|
304
|
+
//# sourceMappingURL=chunk-FW47JGYZ.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/layout/xfooter/XFooter.tsx", "esbuild-css-modules-plugin-ns-js::src/components/layout/xfooter/XFooter.module.css:injector.js", "../src/components/layout/xfooter/XFooter.module.css", "esbuild-css-modules-plugin-ns-js::src/components/layout/xseparator/XSeparator.module.css:injector.js", "../src/components/layout/xseparator/XSeparator.module.css", "../src/components/layout/xseparator/XSeparator.tsx", "../src/components/layout/xzigzaglayout/XZigZagLayout.tsx", "esbuild-css-modules-plugin-ns-js::src/components/layout/xzigzaglayout/XZigZagLayout.module.css:injector.js", "../src/components/layout/xzigzaglayout/XZigZagLayout.module.css"],
|
|
4
|
+
"sourcesContent": ["import Link from \"next/link\";\nimport { CSSProperties } from \"react\";\nimport styles from \"./XFooter.module.css\";\n\nexport type XFooterLink = {\n label: string;\n href: string;\n};\n\nexport type CopyrightConfig = {\n text?: string;\n showYear?: boolean;\n customYear?: number | string;\n yearFirst?: boolean;\n};\n\nexport type XFooterProps = {\n links: XFooterLink[];\n copyright?: CopyrightConfig; \n layout?: \"horizontal\" | \"vertical\";\n columns?: 1 | 2 | 3 | 4;\n colors?: {\n bg?: string;\n text?: string;\n accent?: string;\n border?: string;\n };\n className?: string;\n};\nexport default function XFooter({\n links,\n copyright,\n layout = \"horizontal\",\n columns = 1,\n colors,\n className = \"\",\n}: XFooterProps) {\n \n const customStyles = {\n \"--xf-bg\": colors?.bg,\n \"--xf-text\": colors?.text,\n \"--xf-accent\": colors?.accent,\n \"--xf-border\": colors?.border,\n \"--xf-cols\": layout === \"horizontal\" ? columns : 1,\n } as CSSProperties;\n\n const currentYear = copyright?.customYear || new Date().getFullYear();\n const copyLabel = copyright?.text || \"Xscriptor\";\n\n return (\n <footer className={`${styles.XFooter} ${className}`} style={customStyles}>\n <div className={styles.container}>\n {/* Los links se organizan en el grid definido por --xf-cols */}\n <nav className={layout === \"vertical\" ? styles.navVertical : styles.nav}>\n {links.map((link, idx) => (\n <Link key={idx} href={link.href} className={styles.link}>\n {link.label}\n </Link>\n ))}\n </nav>\n\n {/* El copyright queda fuera del nav, por lo que hereda el centrado del container */}\n <div className={styles.copyright}>\n \u00A9 {copyright?.yearFirst \n ? `${currentYear} ${copyLabel}` \n : `${copyLabel} ${currentYear}`}\n </div>\n </div>\n </footer>\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/layout/xfooter/XFooter.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/layout/xfooter/XFooter.module.css:injector.js\";\nexport default new Proxy({\n \"xFooter\": \"XFooter-module__XFooter_v8t72G__012\",\n \"container\": \"XFooter-module__container_v8t72G__012\",\n \"copyright\": \"XFooter-module__copyright_v8t72G__012\",\n \"link\": \"XFooter-module__link_v8t72G__012\",\n \"nav\": \"XFooter-module__nav_v8t72G__012\",\n \"navVertical\": \"XFooter-module__navVertical_v8t72G__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\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/layout/xseparator/XSeparator.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/layout/xseparator/XSeparator.module.css:injector.js\";\nexport default new Proxy({\n \"dashed\": \"XSeparator-module__dashed_btqQTG__012\",\n \"dotted\": \"XSeparator-module__dotted_btqQTG__012\",\n \"faded\": \"XSeparator-module__faded_btqQTG__012\",\n \"horizontal\": \"XSeparator-module__horizontal_btqQTG__012\",\n \"iconWrapper\": \"XSeparator-module__iconWrapper_btqQTG__012\",\n \"separator\": \"XSeparator-module__separator_btqQTG__012\",\n \"separatorContainer\": \"XSeparator-module__separatorContainer_btqQTG__012\",\n \"vertical\": \"XSeparator-module__vertical_btqQTG__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n ", "import React from 'react';\nimport styles from './XSeparator.module.css';\n\nexport interface XSeparatorProps {\n orientation?: 'horizontal' | 'vertical';\n variant?: 'solid' | 'dashed' | 'dotted';\n isFaded?: boolean;\n hasX?: boolean;\n xColor?: string; // Nuevo: Color de la X\n xBg?: string; // Nuevo: Fondo detr\u00E1s de la X (para el recorte)\n thickness?: string;\n color?: string;\n gap?: string;\n className?: string;\n}\n\nexport default function XSeparator({\n orientation = 'horizontal',\n variant = 'solid',\n isFaded = false,\n hasX = false,\n xColor, \n xBg = 'white',\n thickness = '1px',\n color = '#e2e8f0',\n gap = '1rem',\n className = ''\n}: XSeparatorProps) {\n \n const dynamicStyles = {\n '--separator-color': color,\n '--separator-thickness': thickness,\n '--separator-margin': gap,\n '--x-color': xColor || color, // Si no se define xColor, usa el color de la l\u00EDnea\n '--x-bg': xBg,\n } as React.CSSProperties;\n\n const classes = [\n styles.separator,\n orientation === 'vertical' ? styles.vertical : styles.horizontal,\n variant !== 'solid' && styles[variant],\n isFaded && styles.faded,\n ].filter(Boolean).join(' ');\n\n const line = <hr className={classes} style={dynamicStyles} />;\n\n if (!hasX) return line;\n\n return (\n <div className={`${styles.separatorContainer} ${className}`} style={dynamicStyles}>\n {line}\n <div className={styles.iconWrapper}>\n \u2715\n </div>\n </div>\n );\n}", "import React, { Children, HTMLAttributes, useEffect, useRef, useState, useCallback } from \"react\";\nimport styles from \"./XZigZagLayout.module.css\";\n\nexport type XZigZagLayoutProps = HTMLAttributes<HTMLDivElement> & {\n children: React.ReactNode;\n startSide?: \"left\" | \"right\";\n gap?: number | string;\n offset?: number | string;\n textAlign?: \"inherit\" | \"side\" | \"left\" | \"right\";\n showLine?: boolean;\n lineColor?: string;\n lineThickness?: number | string;\n};\n\nexport default function XZigZagLayout({\n children,\n className,\n style,\n startSide = \"left\",\n gap,\n offset,\n textAlign = \"inherit\",\n showLine = false,\n lineColor = \"#cccccc\",\n lineThickness = 2,\n ...rest\n}: XZigZagLayoutProps) {\n const items = Children.toArray(children).filter(Boolean);\n const containerRef = useRef<HTMLDivElement>(null);\n const itemsRef = useRef<(HTMLDivElement | null)[]>([]);\n const pathRef = useRef<SVGPathElement>(null);\n\n const [points, setPoints] = useState<{ x: number; y: number }[]>([]);\n const [pathLength, setPathLength] = useState(0);\n const [drawProgress, setDrawProgress] = useState(0);\n\n // Calcula el centro de cada elemento para dibujar los puntos\n const calculatePoints = useCallback(() => {\n if (!containerRef.current) return;\n const containerRect = containerRef.current.getBoundingClientRect();\n\n const newPoints = itemsRef.current.filter(Boolean).map((el) => {\n const rect = el!.getBoundingClientRect();\n return {\n x: rect.left + rect.width / 2 - containerRect.left,\n y: rect.top + rect.height / 2 - containerRect.top,\n };\n });\n\n if (newPoints.length > 0) {\n newPoints.unshift({ x: newPoints[0].x, y: 0 }); // Inicia arriba\n newPoints.push({ x: newPoints[newPoints.length - 1].x, y: containerRect.height }); // Termina abajo\n }\n\n setPoints(newPoints);\n }, []);\n\n useEffect(() => {\n if (!showLine || !containerRef.current) return;\n const observer = new ResizeObserver(() => calculatePoints());\n observer.observe(containerRef.current);\n calculatePoints();\n return () => observer.disconnect();\n }, [showLine, calculatePoints]);\n\n useEffect(() => {\n if (pathRef.current) setPathLength(pathRef.current.getTotalLength());\n }, [points]);\n\n useEffect(() => {\n if (!showLine) return;\n const handleScroll = () => {\n if (!containerRef.current) return;\n const { top, height } = containerRef.current.getBoundingClientRect();\n const windowHeight = window.innerHeight;\n const start = windowHeight / 2;\n const progress = (start - top) / height;\n\n setDrawProgress(Math.min(Math.max(progress, 0), 1));\n };\n\n window.addEventListener(\"scroll\", handleScroll);\n handleScroll();\n return () => window.removeEventListener(\"scroll\", handleScroll);\n }, [showLine]);\n\n const cssVars: Record<string, string> = {};\n if (gap !== undefined) cssVars[\"--x-zigzag-gap\"] = typeof gap === \"number\" ? `${gap}px` : gap;\n if (offset !== undefined) cssVars[\"--x-zigzag-offset\"] = typeof offset === \"number\" ? `${offset}px` : offset;\n\n const mergedStyle: React.CSSProperties = { ...style, ...cssVars };\n\n const pathD = points.length > 0\n ? `M ${points[0].x} ${points[0].y} ` + points.slice(1).map((p) => `L ${p.x} ${p.y}`).join(\" \")\n : \"\";\n\n return (\n <div\n ref={containerRef}\n {...rest}\n className={[styles.layout, className].filter(Boolean).join(\" \")}\n style={mergedStyle}\n >\n {showLine && points.length > 0 && (\n <svg className={styles.svgLine} xmlns=\"http://www.w3.org/2000/svg\">\n <path\n ref={pathRef}\n d={pathD}\n fill=\"none\"\n stroke={lineColor}\n strokeWidth={lineThickness}\n strokeDasharray={pathLength}\n strokeDashoffset={pathLength - pathLength * drawProgress}\n style={{ transition: \"stroke-dashoffset 0.1s ease-out\" }}\n />\n </svg>\n )}\n\n {items.map((child, index) => {\n const isStartLeft = startSide === \"left\";\n const alignLeft = isStartLeft ? index % 2 === 0 : index % 2 !== 0;\n const alignmentClass =\n textAlign === \"side\"\n ? alignLeft ? styles.textLeft : styles.textRight\n : textAlign === \"left\" ? styles.textLeft : textAlign === \"right\" ? styles.textRight : \"\";\n\n return (\n <div key={index} className={`${styles.item} ${alignLeft ? styles.left : styles.right} ${alignmentClass}`}>\n {/* El wrapper interno nos permite medir exactamente d\u00F3nde queda el contenido */}\n <div ref={(el) => { itemsRef.current[index] = el; }} className={styles.contentWrapper}>\n {child}\n </div>\n </div>\n );\n })}\n </div>\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/layout/xzigzaglayout/XZigZagLayout.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/layout/xzigzaglayout/XZigZagLayout.module.css:injector.js\";\nexport default new Proxy({\n \"contentWrapper\": \"XZigZagLayout-module__contentWrapper_Jgc4GG__012\",\n \"item\": \"XZigZagLayout-module__item_Jgc4GG__012\",\n \"layout\": \"XZigZagLayout-module__layout_Jgc4GG__012\",\n \"left\": \"XZigZagLayout-module__left_Jgc4GG__012\",\n \"right\": \"XZigZagLayout-module__right_Jgc4GG__012\",\n \"svgLine\": \"XZigZagLayout-module__svgLine_Jgc4GG__012\",\n \"textLeft\": \"XZigZagLayout-module__textLeft_Jgc4GG__012\",\n \"textRight\": \"XZigZagLayout-module__textRight_Jgc4GG__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n "],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;;;ACCjB,IAAM,UAAU;AAChB,IAAM,SAAS;AACf,IAAM,SAAS,MAAM;AACnB,aAAW,MAAM;AACf,QAAI,CAAC,WAAW,UAAU;AACxB;AAAA,IACF;AACA,QAAI,OAAO,WAAW,SAAS,cAAc,MAAM;AACnD,QAAI,QAAQ,KAAK,YAAY;AAC3B,aAAO,KAAK;AAAA,IACd;AACA,QAAI,CAAC,MAAM;AACT,aAAO,WAAW,SAAS;AAAA,IAC7B;AACA,QAAI,YAAY,KAAK,cAAc,OAAO,MAAM;AAChD,QAAI,CAAC,WAAW;AACd,kBAAY,WAAW,SAAS,cAAc,OAAO;AACrD,gBAAU,KAAK,MAAM;AACrB,YAAM,OAAO,WAAW,SAAS,eAAe,OAAO;AACvD,gBAAU,YAAY,IAAI;AAC1B,WAAK,YAAY,SAAS;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC;AACN;;;ACrBA,IAAO,kBAAQ,IAAI,MAAM;AAAA,EACvB,WAAW;AAAA,EACX,aAAa;AAAA,EACb,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,eAAe;AACjB,GAAG;AAAA,EACD,KAAK,SAAS,QAAQ,KAAK;AACzB,WAAO;AACP,WAAO,OAAO,GAAG;AAAA,EACnB;AACF,CAAC;;;AFwCW,cAOJ,YAPI;AA1BG,SAAR,QAAyB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,UAAU;AAAA,EACV;AAAA,EACA,YAAY;AACd,GAAiB;AAEf,QAAM,eAAe;AAAA,IACnB,WAAW,QAAQ;AAAA,IACnB,aAAa,QAAQ;AAAA,IACrB,eAAe,QAAQ;AAAA,IACvB,eAAe,QAAQ;AAAA,IACvB,aAAa,WAAW,eAAe,UAAU;AAAA,EACnD;AAEA,QAAM,cAAc,WAAW,eAAc,oBAAI,KAAK,GAAE,YAAY;AACpE,QAAM,YAAY,WAAW,QAAQ;AAErC,SACE,oBAAC,YAAO,WAAW,GAAG,gBAAO,OAAO,IAAI,SAAS,IAAI,OAAO,cAC1D,+BAAC,SAAI,WAAW,gBAAO,WAErB;AAAA,wBAAC,SAAI,WAAW,WAAW,aAAa,gBAAO,cAAc,gBAAO,KACjE,gBAAM,IAAI,CAAC,MAAM,QAChB,oBAAC,QAAe,MAAM,KAAK,MAAM,WAAW,gBAAO,MAChD,eAAK,SADG,GAEX,CACD,GACH;AAAA,IAGA,qBAAC,SAAI,WAAW,gBAAO,WAAW;AAAA;AAAA,MAC7B,WAAW,YACR,GAAG,WAAW,IAAI,SAAS,KAC3B,GAAG,SAAS,IAAI,WAAW;AAAA,OACnC;AAAA,KACF,GACF;AAEJ;;;AGrEA,IAAMA,WAAU;AAChB,IAAMC,UAAS;AACf,IAAMC,UAAS,MAAM;AACnB,aAAW,MAAM;AACf,QAAI,CAAC,WAAW,UAAU;AACxB;AAAA,IACF;AACA,QAAI,OAAO,WAAW,SAAS,cAAc,MAAM;AACnD,QAAI,QAAQ,KAAK,YAAY;AAC3B,aAAO,KAAK;AAAA,IACd;AACA,QAAI,CAAC,MAAM;AACT,aAAO,WAAW,SAAS;AAAA,IAC7B;AACA,QAAI,YAAY,KAAK,cAAc,OAAOD,OAAM;AAChD,QAAI,CAAC,WAAW;AACd,kBAAY,WAAW,SAAS,cAAc,OAAO;AACrD,gBAAU,KAAK,MAAMA;AACrB,YAAM,OAAO,WAAW,SAAS,eAAeD,QAAO;AACvD,gBAAU,YAAY,IAAI;AAC1B,WAAK,YAAY,SAAS;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC;AACN;;;ACrBA,IAAO,qBAAQ,IAAI,MAAM;AAAA,EACvB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AAAA,EACT,cAAc;AAAA,EACd,eAAe;AAAA,EACf,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,YAAY;AACd,GAAG;AAAA,EACD,KAAK,SAAS,QAAQ,KAAK;AACzB,IAAAG,QAAO;AACP,WAAO,OAAO,GAAG;AAAA,EACnB;AACF,CAAC;;;AC2Bc,gBAAAC,MAKX,QAAAC,aALW;AA5BA,SAAR,WAA4B;AAAA,EACjC,cAAc;AAAA,EACd,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP;AAAA,EACA,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,YAAY;AACd,GAAoB;AAElB,QAAM,gBAAgB;AAAA,IACpB,qBAAqB;AAAA,IACrB,yBAAyB;AAAA,IACzB,sBAAsB;AAAA,IACtB,aAAa,UAAU;AAAA;AAAA,IACvB,UAAU;AAAA,EACZ;AAEA,QAAM,UAAU;AAAA,IACd,mBAAO;AAAA,IACP,gBAAgB,aAAa,mBAAO,WAAW,mBAAO;AAAA,IACtD,YAAY,WAAW,mBAAO,OAAO;AAAA,IACrC,WAAW,mBAAO;AAAA,EACpB,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,QAAM,OAAO,gBAAAD,KAAC,QAAG,WAAW,SAAS,OAAO,eAAe;AAE3D,MAAI,CAAC,KAAM,QAAO;AAElB,SACE,gBAAAC,MAAC,SAAI,WAAW,GAAG,mBAAO,kBAAkB,IAAI,SAAS,IAAI,OAAO,eACjE;AAAA;AAAA,IACD,gBAAAD,KAAC,SAAI,WAAW,mBAAO,aAAa,oBAEpC;AAAA,KACF;AAEJ;;;ACxDA,SAAgB,UAA0B,WAAW,QAAQ,UAAU,mBAAmB;;;ACC1F,IAAME,WAAU;AAChB,IAAMC,UAAS;AACf,IAAMC,UAAS,MAAM;AACnB,aAAW,MAAM;AACf,QAAI,CAAC,WAAW,UAAU;AACxB;AAAA,IACF;AACA,QAAI,OAAO,WAAW,SAAS,cAAc,MAAM;AACnD,QAAI,QAAQ,KAAK,YAAY;AAC3B,aAAO,KAAK;AAAA,IACd;AACA,QAAI,CAAC,MAAM;AACT,aAAO,WAAW,SAAS;AAAA,IAC7B;AACA,QAAI,YAAY,KAAK,cAAc,OAAOD,OAAM;AAChD,QAAI,CAAC,WAAW;AACd,kBAAY,WAAW,SAAS,cAAc,OAAO;AACrD,gBAAU,KAAK,MAAMA;AACrB,YAAM,OAAO,WAAW,SAAS,eAAeD,QAAO;AACvD,gBAAU,YAAY,IAAI;AAC1B,WAAK,YAAY,SAAS;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC;AACN;;;ACrBA,IAAO,wBAAQ,IAAI,MAAM;AAAA,EACvB,kBAAkB;AAAA,EAClB,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AACf,GAAG;AAAA,EACD,KAAK,SAAS,QAAQ,KAAK;AACzB,IAAAG,QAAO;AACP,WAAO,OAAO,GAAG;AAAA,EACnB;AACF,CAAC;;;AFgFG,SAQM,OAAAC,MARN,QAAAC,aAAA;AAnFW,SAAR,cAA+B;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,GAAG;AACL,GAAuB;AACrB,QAAM,QAAQ,SAAS,QAAQ,QAAQ,EAAE,OAAO,OAAO;AACvD,QAAM,eAAe,OAAuB,IAAI;AAChD,QAAM,WAAW,OAAkC,CAAC,CAAC;AACrD,QAAM,UAAU,OAAuB,IAAI;AAE3C,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAqC,CAAC,CAAC;AACnE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,CAAC;AAC9C,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,CAAC;AAGlD,QAAM,kBAAkB,YAAY,MAAM;AACxC,QAAI,CAAC,aAAa,QAAS;AAC3B,UAAM,gBAAgB,aAAa,QAAQ,sBAAsB;AAEjE,UAAM,YAAY,SAAS,QAAQ,OAAO,OAAO,EAAE,IAAI,CAAC,OAAO;AAC7D,YAAM,OAAO,GAAI,sBAAsB;AACvC,aAAO;AAAA,QACL,GAAG,KAAK,OAAO,KAAK,QAAQ,IAAI,cAAc;AAAA,QAC9C,GAAG,KAAK,MAAM,KAAK,SAAS,IAAI,cAAc;AAAA,MAChD;AAAA,IACF,CAAC;AAED,QAAI,UAAU,SAAS,GAAG;AACxB,gBAAU,QAAQ,EAAE,GAAG,UAAU,CAAC,EAAE,GAAG,GAAG,EAAE,CAAC;AAC7C,gBAAU,KAAK,EAAE,GAAG,UAAU,UAAU,SAAS,CAAC,EAAE,GAAG,GAAG,cAAc,OAAO,CAAC;AAAA,IAClF;AAEA,cAAU,SAAS;AAAA,EACrB,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,QAAI,CAAC,YAAY,CAAC,aAAa,QAAS;AACxC,UAAM,WAAW,IAAI,eAAe,MAAM,gBAAgB,CAAC;AAC3D,aAAS,QAAQ,aAAa,OAAO;AACrC,oBAAgB;AAChB,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,YAAU,MAAM;AACd,QAAI,QAAQ,QAAS,eAAc,QAAQ,QAAQ,eAAe,CAAC;AAAA,EACrE,GAAG,CAAC,MAAM,CAAC;AAEX,YAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,UAAM,eAAe,MAAM;AACzB,UAAI,CAAC,aAAa,QAAS;AAC3B,YAAM,EAAE,KAAK,OAAO,IAAI,aAAa,QAAQ,sBAAsB;AACnE,YAAM,eAAe,OAAO;AAC5B,YAAM,QAAQ,eAAe;AAC7B,YAAM,YAAY,QAAQ,OAAO;AAEjC,sBAAgB,KAAK,IAAI,KAAK,IAAI,UAAU,CAAC,GAAG,CAAC,CAAC;AAAA,IACpD;AAEA,WAAO,iBAAiB,UAAU,YAAY;AAC9C,iBAAa;AACb,WAAO,MAAM,OAAO,oBAAoB,UAAU,YAAY;AAAA,EAChE,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,UAAkC,CAAC;AACzC,MAAI,QAAQ,OAAW,SAAQ,gBAAgB,IAAI,OAAO,QAAQ,WAAW,GAAG,GAAG,OAAO;AAC1F,MAAI,WAAW,OAAW,SAAQ,mBAAmB,IAAI,OAAO,WAAW,WAAW,GAAG,MAAM,OAAO;AAEtG,QAAM,cAAmC,EAAE,GAAG,OAAO,GAAG,QAAQ;AAEhE,QAAM,QAAQ,OAAO,SAAS,IAC1B,KAAK,OAAO,CAAC,EAAE,CAAC,IAAI,OAAO,CAAC,EAAE,CAAC,MAAM,OAAO,MAAM,CAAC,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,KAAK,GAAG,IAC3F;AAEJ,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACJ,GAAG;AAAA,MACJ,WAAW,CAAC,sBAAO,QAAQ,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,MAC9D,OAAO;AAAA,MAEN;AAAA,oBAAY,OAAO,SAAS,KAC3B,gBAAAD,KAAC,SAAI,WAAW,sBAAO,SAAS,OAAM,8BACpC,0BAAAA;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,GAAG;AAAA,YACH,MAAK;AAAA,YACL,QAAQ;AAAA,YACR,aAAa;AAAA,YACb,iBAAiB;AAAA,YACjB,kBAAkB,aAAa,aAAa;AAAA,YAC5C,OAAO,EAAE,YAAY,kCAAkC;AAAA;AAAA,QACzD,GACF;AAAA,QAGD,MAAM,IAAI,CAAC,OAAO,UAAU;AAC3B,gBAAM,cAAc,cAAc;AAClC,gBAAM,YAAY,cAAc,QAAQ,MAAM,IAAI,QAAQ,MAAM;AAChE,gBAAM,iBACJ,cAAc,SACV,YAAY,sBAAO,WAAW,sBAAO,YACrC,cAAc,SAAS,sBAAO,WAAW,cAAc,UAAU,sBAAO,YAAY;AAE1F,iBACE,gBAAAA,KAAC,SAAgB,WAAW,GAAG,sBAAO,IAAI,IAAI,YAAY,sBAAO,OAAO,sBAAO,KAAK,IAAI,cAAc,IAEpG,0BAAAA,KAAC,SAAI,KAAK,CAAC,OAAO;AAAE,qBAAS,QAAQ,KAAK,IAAI;AAAA,UAAI,GAAG,WAAW,sBAAO,gBACpE,iBACH,KAJQ,KAKV;AAAA,QAEJ,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ;",
|
|
6
|
+
"names": ["content", "digest", "inject", "inject", "jsx", "jsxs", "content", "digest", "inject", "inject", "jsx", "jsxs"]
|
|
7
|
+
}
|
|
@@ -1,18 +1,49 @@
|
|
|
1
1
|
// src/components/content/xinteractivephrase/XInteractivePhrase.tsx
|
|
2
2
|
import React, { useState } from "react";
|
|
3
3
|
|
|
4
|
-
// src/components/content/xinteractivephrase/XInteractivePhrase.module.css
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
4
|
+
// esbuild-css-modules-plugin-ns-js::src/components/content/xinteractivephrase/XInteractivePhrase.module.css:injector.js
|
|
5
|
+
var content = __content_placeholder__;
|
|
6
|
+
var digest = __digest_placeholder__;
|
|
7
|
+
var inject = () => {
|
|
8
|
+
setTimeout(() => {
|
|
9
|
+
if (!globalThis.document) {
|
|
10
|
+
return;
|
|
11
|
+
}
|
|
12
|
+
let root = globalThis.document.querySelector("head");
|
|
13
|
+
if (root && root.shadowRoot) {
|
|
14
|
+
root = root.shadowRoot;
|
|
15
|
+
}
|
|
16
|
+
if (!root) {
|
|
17
|
+
root = globalThis.document.head;
|
|
18
|
+
}
|
|
19
|
+
let container = root.querySelector("#_" + digest);
|
|
20
|
+
if (!container) {
|
|
21
|
+
container = globalThis.document.createElement("style");
|
|
22
|
+
container.id = "_" + digest;
|
|
23
|
+
const text = globalThis.document.createTextNode(content);
|
|
24
|
+
container.appendChild(text);
|
|
25
|
+
root.appendChild(container);
|
|
26
|
+
}
|
|
27
|
+
}, 0);
|
|
14
28
|
};
|
|
15
29
|
|
|
30
|
+
// src/components/content/xinteractivephrase/XInteractivePhrase.module.css
|
|
31
|
+
var XInteractivePhrase_default = new Proxy({
|
|
32
|
+
"blurEffect": "XInteractivePhrase-module__blurEffect_fdhnVG__012",
|
|
33
|
+
"buttonEffect": "XInteractivePhrase-module__buttonEffect_fdhnVG__012",
|
|
34
|
+
"container": "XInteractivePhrase-module__container_fdhnVG__012",
|
|
35
|
+
"isHidden": "XInteractivePhrase-module__isHidden_fdhnVG__012",
|
|
36
|
+
"isVisible": "XInteractivePhrase-module__isVisible_fdhnVG__012",
|
|
37
|
+
"lineBreak": "XInteractivePhrase-module__lineBreak_fdhnVG__012",
|
|
38
|
+
"title": "XInteractivePhrase-module__title_fdhnVG__012",
|
|
39
|
+
"underlineEffect": "XInteractivePhrase-module__underlineEffect_fdhnVG__012"
|
|
40
|
+
}, {
|
|
41
|
+
get: function(source, key) {
|
|
42
|
+
inject();
|
|
43
|
+
return source[key];
|
|
44
|
+
}
|
|
45
|
+
});
|
|
46
|
+
|
|
16
47
|
// src/components/content/xinteractivephrase/XInteractivePhrase.tsx
|
|
17
48
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
18
49
|
function XInteractivePhrase({
|
|
@@ -49,9 +80,9 @@ function XInteractivePhrase({
|
|
|
49
80
|
} else if (word.type === "blur2") {
|
|
50
81
|
dynamicClass = `${XInteractivePhrase_default.blurEffect} ${active2 ? XInteractivePhrase_default.isVisible : XInteractivePhrase_default.isHidden}`;
|
|
51
82
|
}
|
|
52
|
-
let
|
|
53
|
-
if (word.italic)
|
|
54
|
-
if (word.bold)
|
|
83
|
+
let content2 = word.text;
|
|
84
|
+
if (word.italic) content2 = /* @__PURE__ */ jsx("em", { children: content2 });
|
|
85
|
+
if (word.bold) content2 = /* @__PURE__ */ jsx("strong", { children: content2 });
|
|
55
86
|
return /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
56
87
|
/* @__PURE__ */ jsx(
|
|
57
88
|
"span",
|
|
@@ -61,7 +92,7 @@ function XInteractivePhrase({
|
|
|
61
92
|
onKeyDown: keyHandler,
|
|
62
93
|
role: clickHandler ? "button" : void 0,
|
|
63
94
|
tabIndex: clickHandler ? 0 : void 0,
|
|
64
|
-
children:
|
|
95
|
+
children: content2
|
|
65
96
|
}
|
|
66
97
|
),
|
|
67
98
|
word.breakAfter ? /* @__PURE__ */ jsx("span", { className: XInteractivePhrase_default.lineBreak }) : " "
|
|
@@ -72,4 +103,4 @@ function XInteractivePhrase({
|
|
|
72
103
|
export {
|
|
73
104
|
XInteractivePhrase
|
|
74
105
|
};
|
|
75
|
-
//# sourceMappingURL=chunk-
|
|
106
|
+
//# sourceMappingURL=chunk-IK2UCTCM.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/content/xinteractivephrase/XInteractivePhrase.tsx", "esbuild-css-modules-plugin-ns-js::src/components/content/xinteractivephrase/XInteractivePhrase.module.css:injector.js", "../src/components/content/xinteractivephrase/XInteractivePhrase.module.css"],
|
|
4
|
+
"sourcesContent": ["\"use client\";\n\nimport React, { useState, KeyboardEvent } from \"react\";\nimport styles from \"./XInteractivePhrase.module.css\";\n\nexport interface WordConfig {\n text: string;\n // Solo comportamientos de interacci\u00F3n\n type: \"normal\" | \"underline\" | \"button\" | \"blur1\" | \"blur2\"; \n breakAfter?: boolean;\n italic?: boolean; // Esto controla el <em>\n bold?: boolean; // Esto controla el <strong>\n}\n\nexport interface XInteractivePhraseProps {\n words: WordConfig[];\n as?: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"p\" | \"span\";\n className?: string;\n}\n\nexport default function XInteractivePhrase({ \n words, \n as: Tag = \"p\", \n className = \"\" \n}: XInteractivePhraseProps) {\n const [active1, setActive1] = useState<boolean>(false);\n const [active2, setActive2] = useState<boolean>(false);\n\n const handleAction = (type: \"underline\" | \"button\") => {\n if (type === \"underline\") setActive1(!active1);\n if (type === \"button\") setActive2(!active2);\n };\n\n const onKeyDown = (e: KeyboardEvent<HTMLSpanElement>, type: \"underline\" | \"button\") => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n handleAction(type);\n }\n };\n\n return (\n <div className={`${styles.container} ${className}`}>\n <Tag className={styles.title}>\n {words.map((word, index) => {\n let dynamicClass = \"\";\n let clickHandler: (() => void) | undefined = undefined;\n let keyHandler: ((e: KeyboardEvent<HTMLSpanElement>) => void) | undefined = undefined;\n\n // Gesti\u00F3n de l\u00F3gica por tipo\n if (word.type === \"underline\") {\n dynamicClass = styles.underlineEffect;\n clickHandler = () => handleAction(\"underline\");\n keyHandler = (e) => onKeyDown(e, \"underline\");\n } \n else if (word.type === \"button\") {\n dynamicClass = styles.buttonEffect;\n clickHandler = () => handleAction(\"button\");\n keyHandler = (e) => onKeyDown(e, \"button\");\n } \n else if (word.type === \"blur1\") {\n dynamicClass = `${styles.blurEffect} ${active1 ? styles.isVisible : styles.isHidden}`;\n } \n else if (word.type === \"blur2\") {\n dynamicClass = `${styles.blurEffect} ${active2 ? styles.isVisible : styles.isHidden}`;\n }\n\n // Renderizado del contenido con estilos combinables\n let content: React.ReactNode = word.text;\n if (word.italic) content = <em>{content}</em>;\n if (word.bold) content = <strong>{content}</strong>;\n\n return (\n <React.Fragment key={index}>\n <span\n className={dynamicClass}\n onClick={clickHandler}\n onKeyDown={keyHandler}\n role={clickHandler ? \"button\" : undefined}\n tabIndex={clickHandler ? 0 : undefined}\n >\n {content}\n </span>\n {word.breakAfter ? <span className={styles.lineBreak} /> : \" \"}\n </React.Fragment>\n );\n })}\n </Tag>\n </div>\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/content/xinteractivephrase/XInteractivePhrase.module.css\";\n\nimport { inject } from \"esbuild-css-modules-plugin-ns-js:src/components/content/xinteractivephrase/XInteractivePhrase.module.css:injector.js\";\nexport default new Proxy({\n \"blurEffect\": \"XInteractivePhrase-module__blurEffect_fdhnVG__012\",\n \"buttonEffect\": \"XInteractivePhrase-module__buttonEffect_fdhnVG__012\",\n \"container\": \"XInteractivePhrase-module__container_fdhnVG__012\",\n \"isHidden\": \"XInteractivePhrase-module__isHidden_fdhnVG__012\",\n \"isVisible\": \"XInteractivePhrase-module__isVisible_fdhnVG__012\",\n \"lineBreak\": \"XInteractivePhrase-module__lineBreak_fdhnVG__012\",\n \"title\": \"XInteractivePhrase-module__title_fdhnVG__012\",\n \"underlineEffect\": \"XInteractivePhrase-module__underlineEffect_fdhnVG__012\"\n}, {\n get: function(source, key) {\n inject();\n return source[key];\n }\n});\n "],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["content"]
|
|
7
|
+
}
|