@votodigital-onpeui/react 0.1.45 → 0.1.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1528,6 +1528,19 @@ var Show = ({ condition, loadingComponent, children }) => {
1528
1528
  };
1529
1529
  var ModalGlobalContext = react.createContext(null);
1530
1530
  var useModalGlobalContext = () => react.useContext(ModalGlobalContext);
1531
+ var openModals = globalThis.__openModals || (globalThis.__openModals = /* @__PURE__ */ new Set());
1532
+ var lockBodyScroll = (id, enabled) => {
1533
+ if (!enabled || typeof document === "undefined") return;
1534
+ openModals.add(id);
1535
+ document.body.style.overflow = "hidden";
1536
+ };
1537
+ var unlockBodyScroll = (id, enabled) => {
1538
+ if (!enabled || typeof document === "undefined") return;
1539
+ openModals.delete(id);
1540
+ if (openModals.size === 0) {
1541
+ document.body.style.overflow = "";
1542
+ }
1543
+ };
1531
1544
  var Modal = ({
1532
1545
  isOpen,
1533
1546
  onClose,
@@ -1548,6 +1561,7 @@ var Modal = ({
1548
1561
  overlayColor: _overlayColor = "blue",
1549
1562
  ...props
1550
1563
  }) => {
1564
+ const modalId = react.useId();
1551
1565
  const ctx = useModalGlobalContext();
1552
1566
  const animated = animatedProp ?? ctx?.animated ?? true;
1553
1567
  const ariaLabelledBy = props["aria-labelledby"];
@@ -1579,17 +1593,12 @@ var Modal = ({
1579
1593
  return () => clearTimeout(timer);
1580
1594
  }
1581
1595
  }, [isOpen, animated, onCloseComplete]);
1582
- react.useEffect(() => {
1583
- if (!preventBodyScroll) return;
1584
- if (isOpen) {
1585
- document.body.style.overflow = "hidden";
1586
- } else {
1587
- document.body.style.overflow = "";
1588
- }
1596
+ react.useLayoutEffect(() => {
1597
+ if (isOpen) lockBodyScroll(modalId, preventBodyScroll);
1589
1598
  return () => {
1590
- document.body.style.overflow = "";
1599
+ if (isOpen) unlockBodyScroll(modalId, preventBodyScroll);
1591
1600
  };
1592
- }, [isOpen, preventBodyScroll]);
1601
+ }, [isOpen, preventBodyScroll, modalId]);
1593
1602
  react.useEffect(() => {
1594
1603
  if (!isOpen) return;
1595
1604
  const resetScroll = () => {
@@ -2281,7 +2290,7 @@ var ModalDnieVersions = ({
2281
2290
  zIndexLevel,
2282
2291
  isOpen,
2283
2292
  onClose,
2284
- className: `bg-white max-w-[590px]! pt-[30px] pb-[38px] ${className}`,
2293
+ className: `bg-white max-w-[590px]! pt-[30px] pb-[38px] md:pt-[35px] px-4 md:pb-[54px] md:px-8 ${className}`,
2285
2294
  closeButton: true,
2286
2295
  children: [
2287
2296
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2302,20 +2311,28 @@ var ModalDnieVersions = ({
2302
2311
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "DNI electr\xF3nico versi\xF3n 1" }),
2303
2312
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "DNIe versi\xF3n 1" })
2304
2313
  ] }) }),
2305
- /* @__PURE__ */ jsxRuntime.jsxs("ul", { role: "none", className: "text-sm list-disc text-justify self-start pl-8", children: [
2306
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2307
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Chip en la parte delantera del DNI electr\xF3nico." }),
2308
- /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "Chip en la parte delantera del DNIe." })
2309
- ] }) }),
2310
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2311
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Compatible solo con el lector del DNI electr\xF3nico en PC, Mac o laptop." }),
2312
- /* @__PURE__ */ jsxRuntime.jsxs("span", { "aria-hidden": "true", children: [
2313
- "Compatible solo con el lector del DNIe en ",
2314
- /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "PC, Mac o laptop" }),
2315
- "."
2316
- ] })
2317
- ] }) })
2318
- ] })
2314
+ /* @__PURE__ */ jsxRuntime.jsxs(
2315
+ "ul",
2316
+ {
2317
+ role: "none",
2318
+ className: "text-sm list-disc text-justify self-start pl-8",
2319
+ children: [
2320
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2321
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Chip en la parte delantera del DNI electr\xF3nico." }),
2322
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "Chip en la parte delantera del DNIe." })
2323
+ ] }) }),
2324
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2325
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Compatible solo con el lector del DNI electr\xF3nico en PC, Mac o laptop." }),
2326
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { "aria-hidden": "true", children: [
2327
+ "Compatible solo con el lector del DNIe en",
2328
+ " ",
2329
+ /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "PC, Mac o laptop" }),
2330
+ "."
2331
+ ] })
2332
+ ] }) })
2333
+ ]
2334
+ }
2335
+ )
2319
2336
  ] }),
2320
2337
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[240px] sm:w-[200px] relative flex justify-center", children: iconDnie1 })
2321
2338
  ] }),
@@ -2325,20 +2342,31 @@ var ModalDnieVersions = ({
2325
2342
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "DNI electr\xF3nico versi\xF3n 2 y 3" }),
2326
2343
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "DNIe versi\xF3n 2 y 3" })
2327
2344
  ] }) }),
2328
- /* @__PURE__ */ jsxRuntime.jsxs("ul", { role: "none", className: "text-sm list-disc text-justify self-start pl-8", children: [
2329
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2330
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Chip en la parte posterior del DNI electr\xF3nico." }),
2331
- /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "Chip en la parte posterior del DNIe." })
2332
- ] }) }),
2333
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2334
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Compatibles con el lector del DNI electr\xF3nico en PC, Mac o laptop y tecnolog\xEDa NFC (ISO 14443-B) en m\xF3viles." }),
2335
- /* @__PURE__ */ jsxRuntime.jsxs("span", { "aria-hidden": "true", children: [
2336
- "Compatibles con el lector del DNIe en ",
2337
- /* @__PURE__ */ jsxRuntime.jsx("strong", { children: " PC, Mac o laptop y tecnolog\xEDa NFC (ISO 14443-B) en m\xF3viles" }),
2338
- "."
2339
- ] })
2340
- ] }) })
2341
- ] })
2345
+ /* @__PURE__ */ jsxRuntime.jsxs(
2346
+ "ul",
2347
+ {
2348
+ role: "none",
2349
+ className: "text-sm list-disc text-justify self-start pl-8",
2350
+ children: [
2351
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2352
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Chip en la parte posterior del DNI electr\xF3nico." }),
2353
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "Chip en la parte posterior del DNIe." })
2354
+ ] }) }),
2355
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { tabIndex: 0, children: [
2356
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Compatibles con el lector del DNI electr\xF3nico en PC, Mac o laptop y tecnolog\xEDa NFC (ISO 14443-B) en m\xF3viles." }),
2357
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { "aria-hidden": "true", children: [
2358
+ "Compatibles con el lector del DNIe en",
2359
+ " ",
2360
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
2361
+ " ",
2362
+ "PC, Mac o laptop y tecnolog\xEDa NFC (ISO 14443-B) en m\xF3viles"
2363
+ ] }),
2364
+ "."
2365
+ ] })
2366
+ ] }) })
2367
+ ]
2368
+ }
2369
+ )
2342
2370
  ] }),
2343
2371
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[240px] sm:w-[200px] h-[181px] relative", children: [
2344
2372
  iconDnie2,
@@ -2367,10 +2395,17 @@ var ModalNfc = ({
2367
2395
  zIndexLevel,
2368
2396
  isOpen,
2369
2397
  onClose,
2370
- className: `bg-white max-w-[600px]! pt-[46px] pb-[46px] px-[30px] md:px-[50px] ${className}`,
2398
+ className: `bg-white max-w-[600px]! pt-[46px] pb-[46px] px-[30px] md:px-[50px] md:pt-[35px] md:pb-[54px] ${className}`,
2371
2399
  closeButton: true,
2372
2400
  children: [
2373
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-center text-onpe-blue font-bold text-base", tabIndex: 0, children: "\xBFC\xF3mo saber si tu dispositivo m\xF3vil tiene NFC?" }),
2401
+ /* @__PURE__ */ jsxRuntime.jsx(
2402
+ "h2",
2403
+ {
2404
+ className: "text-center text-onpe-blue font-bold text-base",
2405
+ tabIndex: 0,
2406
+ children: "\xBFC\xF3mo saber si tu dispositivo m\xF3vil tiene NFC?"
2407
+ }
2408
+ ),
2374
2409
  /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "flex flex-col gap-6 items-center mt-8 text-sm w-full", children: [
2375
2410
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
2376
2411
  /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm text-justify mb-3", tabIndex: 0, children: [
@@ -2378,14 +2413,28 @@ var ModalNfc = ({
2378
2413
  "Celular Android"
2379
2414
  ] }),
2380
2415
  /* @__PURE__ */ jsxRuntime.jsxs("ul", { role: "presentation", className: "list-disc pl-[26px] mt-2", children: [
2381
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "text-sm text-left mb-2 tracking-[0.15px]", children: "Desde la barra de notificaciones, simplemente deslizando hacia abajo desde tu pantalla y buscando el \xEDcono del NFC." }),
2382
- /* @__PURE__ */ jsxRuntime.jsxs("li", { role: "presentation", className: "text-sm text-left mb-2 tracking-[0.15px]", children: [
2383
- "Otra forma es ir hacia Ajustes",
2384
- /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: " > " }),
2385
- "Conexiones o Redes Inal\xE1mbricas",
2386
- /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: " > " }),
2387
- 'Buscar "NFC".'
2388
- ] })
2416
+ /* @__PURE__ */ jsxRuntime.jsx(
2417
+ "li",
2418
+ {
2419
+ role: "presentation",
2420
+ className: "text-sm text-left mb-2 tracking-[0.15px]",
2421
+ children: "Desde la barra de notificaciones, simplemente deslizando hacia abajo desde tu pantalla y buscando el \xEDcono del NFC."
2422
+ }
2423
+ ),
2424
+ /* @__PURE__ */ jsxRuntime.jsxs(
2425
+ "li",
2426
+ {
2427
+ role: "presentation",
2428
+ className: "text-sm text-left mb-2 tracking-[0.15px]",
2429
+ children: [
2430
+ "Otra forma es ir hacia Ajustes",
2431
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: " > " }),
2432
+ "Conexiones o Redes Inal\xE1mbricas",
2433
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: " > " }),
2434
+ 'Buscar "NFC".'
2435
+ ]
2436
+ }
2437
+ )
2389
2438
  ] })
2390
2439
  ] }),
2391
2440
  iconNfc1,
@@ -2394,16 +2443,37 @@ var ModalNfc = ({
2394
2443
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-1", children: "2." }),
2395
2444
  "Celular iPhone"
2396
2445
  ] }),
2397
- /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "presentation", className: "list-disc pl-[26px] mt-2", children: /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "text-sm text-left mb-2 tracking-[0.15px]", children: "Todos los modelos iPhone 7 en adelante ya cuentan con tecnolog\xEDa NFC activa." }) })
2446
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "presentation", className: "list-disc pl-[26px] mt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
2447
+ "li",
2448
+ {
2449
+ role: "presentation",
2450
+ className: "text-sm text-left mb-2 tracking-[0.15px]",
2451
+ children: "Todos los modelos iPhone 7 en adelante ya cuentan con tecnolog\xEDa NFC activa."
2452
+ }
2453
+ ) })
2398
2454
  ] }),
2399
2455
  iconNfc2,
2400
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-center text-onpe-blue font-bold my-5 text-base", tabIndex: 0, children: "\xBFC\xF3mo usar el NFC correctamente?" }),
2401
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pl-3 w-full", children: /* @__PURE__ */ jsxRuntime.jsxs("ol", { role: "presentation", className: "text-sm text-justify list-decimal list-outside", children: [
2402
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: "Activa el NFC en tu celular." }),
2403
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: "Busca en internet d\xF3nde est\xE1 el lector NFC seg\xFAn tu modelo." }),
2404
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: "Coloca tu DNIe sobre esa zona hasta que recibas la confirmaci\xF3n del sistema." }),
2405
- /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: 'Puedes consultar los videos "Aprende como leer tu DNIe con NFC":' })
2406
- ] }) }),
2456
+ /* @__PURE__ */ jsxRuntime.jsx(
2457
+ "h2",
2458
+ {
2459
+ className: "text-center text-onpe-blue font-bold my-5 text-base",
2460
+ tabIndex: 0,
2461
+ children: "\xBFC\xF3mo usar el NFC correctamente?"
2462
+ }
2463
+ ),
2464
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pl-3 w-full", children: /* @__PURE__ */ jsxRuntime.jsxs(
2465
+ "ol",
2466
+ {
2467
+ role: "presentation",
2468
+ className: "text-sm text-justify list-decimal list-outside",
2469
+ children: [
2470
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: "Activa el NFC en tu celular." }),
2471
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: "Busca en internet d\xF3nde est\xE1 el lector NFC seg\xFAn tu modelo." }),
2472
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: "Coloca tu DNIe sobre esa zona hasta que recibas la confirmaci\xF3n del sistema." }),
2473
+ /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", className: "mb-2", children: 'Puedes consultar los videos "Aprende como leer tu DNIe con NFC":' })
2474
+ ]
2475
+ }
2476
+ ) }),
2407
2477
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row gap-5 justify-center items-center", children: [
2408
2478
  /* @__PURE__ */ jsxRuntime.jsxs(
2409
2479
  "a",