@khipu/design-system 0.3.5-alpha.35 → 0.3.5-alpha.36
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/beercss/khipu-beercss.css +950 -18
- package/dist/beercss/khipu-beercss.js +63 -0
- package/dist/beercss/khipu-beercss.min.css +1 -1
- package/dist/beercss/khipu-beercss.min.js +1 -1
- package/dist/beercss/khipu-beercss.scoped.css +949 -16
- package/dist/beercss/khipu-beercss.scoped.min.css +1 -1
- package/dist/beercss/metadata.json +5 -5
- package/dist/index.d.mts +367 -9
- package/dist/index.d.ts +367 -9
- package/dist/index.js +1113 -405
- package/dist/index.mjs +1078 -379
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -70,7 +70,7 @@ function formatTime(iso) {
|
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
// src/version.ts
|
|
73
|
-
var KDS_VERSION = "0.3.5-alpha.
|
|
73
|
+
var KDS_VERSION = "0.3.5-alpha.36";
|
|
74
74
|
|
|
75
75
|
// src/theme/KdsThemeProvider.tsx
|
|
76
76
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -1177,7 +1177,7 @@ var KdsTextField = forwardRef2(
|
|
|
1177
1177
|
label,
|
|
1178
1178
|
required && requiredMark && " *"
|
|
1179
1179
|
] }),
|
|
1180
|
-
readOnly && /* @__PURE__ */ jsx3("i", { className: "material-symbols-outlined", children: "lock" }),
|
|
1180
|
+
readOnly && /* @__PURE__ */ jsx3("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "lock" }),
|
|
1181
1181
|
isRevealable && /* @__PURE__ */ jsx3(
|
|
1182
1182
|
"a",
|
|
1183
1183
|
{
|
|
@@ -1325,8 +1325,64 @@ var KdsSecureLoader = forwardRef7(
|
|
|
1325
1325
|
);
|
|
1326
1326
|
KdsSecureLoader.displayName = "KdsSecureLoader";
|
|
1327
1327
|
|
|
1328
|
-
// src/components/core/
|
|
1328
|
+
// src/components/core/KdsProgressChecklist/KdsProgressChecklist.tsx
|
|
1329
1329
|
import { forwardRef as forwardRef8 } from "react";
|
|
1330
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1331
|
+
var DEFAULT_STATUS_LABELS = {
|
|
1332
|
+
pending: "pendiente",
|
|
1333
|
+
active: "en curso",
|
|
1334
|
+
done: "listo",
|
|
1335
|
+
error: "con error"
|
|
1336
|
+
};
|
|
1337
|
+
function Mark({ status }) {
|
|
1338
|
+
return /* @__PURE__ */ jsxs7("span", { className: "kds-progress-checklist-mark", "aria-hidden": "true", children: [
|
|
1339
|
+
status === "done" && /* @__PURE__ */ jsx9("i", { className: "material-symbols-outlined", children: "check" }),
|
|
1340
|
+
status === "error" && /* @__PURE__ */ jsx9("i", { className: "material-symbols-outlined", children: "error" }),
|
|
1341
|
+
status === "active" && /* @__PURE__ */ jsxs7("span", { className: "kds-dots-loader", children: [
|
|
1342
|
+
/* @__PURE__ */ jsx9("span", {}),
|
|
1343
|
+
/* @__PURE__ */ jsx9("span", {}),
|
|
1344
|
+
/* @__PURE__ */ jsx9("span", {})
|
|
1345
|
+
] }),
|
|
1346
|
+
status === "pending" && /* @__PURE__ */ jsx9("span", { className: "kds-progress-checklist-dot" })
|
|
1347
|
+
] });
|
|
1348
|
+
}
|
|
1349
|
+
var KdsProgressChecklist = forwardRef8(
|
|
1350
|
+
({ items, statusLabels, className, ...props }, ref) => {
|
|
1351
|
+
const labels = { ...DEFAULT_STATUS_LABELS, ...statusLabels };
|
|
1352
|
+
return /* @__PURE__ */ jsx9(
|
|
1353
|
+
"ul",
|
|
1354
|
+
{
|
|
1355
|
+
ref,
|
|
1356
|
+
className: clsx("kds-progress-checklist", className),
|
|
1357
|
+
"aria-live": "polite",
|
|
1358
|
+
...props,
|
|
1359
|
+
children: items.map((item) => /* @__PURE__ */ jsxs7(
|
|
1360
|
+
"li",
|
|
1361
|
+
{
|
|
1362
|
+
className: clsx(
|
|
1363
|
+
"kds-progress-checklist-item",
|
|
1364
|
+
`kds-progress-checklist-item--${item.status}`
|
|
1365
|
+
),
|
|
1366
|
+
"aria-current": item.status === "active" ? "step" : void 0,
|
|
1367
|
+
children: [
|
|
1368
|
+
/* @__PURE__ */ jsx9(Mark, { status: item.status }),
|
|
1369
|
+
/* @__PURE__ */ jsx9("span", { className: "kds-progress-checklist-label", children: item.label }),
|
|
1370
|
+
/* @__PURE__ */ jsxs7("span", { className: "kds-progress-checklist-status", children: [
|
|
1371
|
+
": ",
|
|
1372
|
+
labels[item.status]
|
|
1373
|
+
] })
|
|
1374
|
+
]
|
|
1375
|
+
},
|
|
1376
|
+
item.id ?? item.label
|
|
1377
|
+
))
|
|
1378
|
+
}
|
|
1379
|
+
);
|
|
1380
|
+
}
|
|
1381
|
+
);
|
|
1382
|
+
KdsProgressChecklist.displayName = "KdsProgressChecklist";
|
|
1383
|
+
|
|
1384
|
+
// src/components/core/KdsCopyButton/KdsCopyButton.tsx
|
|
1385
|
+
import { forwardRef as forwardRef9 } from "react";
|
|
1330
1386
|
|
|
1331
1387
|
// src/components/core/hooks/useCopyToClipboard.ts
|
|
1332
1388
|
import { useState as useState2, useCallback } from "react";
|
|
@@ -1347,11 +1403,11 @@ function useCopyToClipboard(resetMs = 1200) {
|
|
|
1347
1403
|
}
|
|
1348
1404
|
|
|
1349
1405
|
// src/components/core/KdsCopyButton/KdsCopyButton.tsx
|
|
1350
|
-
import { jsx as
|
|
1351
|
-
var KdsCopyButton =
|
|
1406
|
+
import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1407
|
+
var KdsCopyButton = forwardRef9(
|
|
1352
1408
|
({ value, copiedText = "Copiado", className, ...props }, ref) => {
|
|
1353
1409
|
const { copied, copy } = useCopyToClipboard();
|
|
1354
|
-
return /* @__PURE__ */
|
|
1410
|
+
return /* @__PURE__ */ jsxs8(
|
|
1355
1411
|
"button",
|
|
1356
1412
|
{
|
|
1357
1413
|
ref,
|
|
@@ -1361,11 +1417,11 @@ var KdsCopyButton = forwardRef8(
|
|
|
1361
1417
|
"aria-label": `Copiar: ${value}`,
|
|
1362
1418
|
...props,
|
|
1363
1419
|
children: [
|
|
1364
|
-
/* @__PURE__ */
|
|
1365
|
-
/* @__PURE__ */
|
|
1366
|
-
/* @__PURE__ */
|
|
1420
|
+
/* @__PURE__ */ jsxs8("span", { className: "kds-copy-button-label", children: [
|
|
1421
|
+
/* @__PURE__ */ jsx10("span", { className: "kds-copy-button-value", "aria-hidden": copied || void 0, children: value }),
|
|
1422
|
+
/* @__PURE__ */ jsx10("span", { className: "kds-copy-button-copied", "aria-hidden": !copied || void 0, children: copiedText })
|
|
1367
1423
|
] }),
|
|
1368
|
-
/* @__PURE__ */
|
|
1424
|
+
/* @__PURE__ */ jsx10("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: copied ? "check" : "content_copy" })
|
|
1369
1425
|
]
|
|
1370
1426
|
}
|
|
1371
1427
|
);
|
|
@@ -1374,26 +1430,26 @@ var KdsCopyButton = forwardRef8(
|
|
|
1374
1430
|
KdsCopyButton.displayName = "KdsCopyButton";
|
|
1375
1431
|
|
|
1376
1432
|
// src/components/core/KdsLinearProgress/KdsLinearProgress.tsx
|
|
1377
|
-
import { forwardRef as
|
|
1378
|
-
import { jsx as
|
|
1379
|
-
var KdsLinearProgress =
|
|
1380
|
-
({ value, max = 100, className, ...props }, ref) => /* @__PURE__ */
|
|
1433
|
+
import { forwardRef as forwardRef10 } from "react";
|
|
1434
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
1435
|
+
var KdsLinearProgress = forwardRef10(
|
|
1436
|
+
({ value, max = 100, className, ...props }, ref) => /* @__PURE__ */ jsx11("progress", { ref, className: clsx("kds-progress", className), value, max, ...props })
|
|
1381
1437
|
);
|
|
1382
1438
|
KdsLinearProgress.displayName = "KdsLinearProgress";
|
|
1383
1439
|
|
|
1384
1440
|
// src/components/core/KdsAlert/KdsAlert.tsx
|
|
1385
|
-
import { forwardRef as
|
|
1386
|
-
import { jsx as
|
|
1441
|
+
import { forwardRef as forwardRef11 } from "react";
|
|
1442
|
+
import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1387
1443
|
var DEFAULT_ICONS = {
|
|
1388
1444
|
success: "check_circle",
|
|
1389
1445
|
info: "info",
|
|
1390
1446
|
warning: "warning",
|
|
1391
1447
|
error: "error"
|
|
1392
1448
|
};
|
|
1393
|
-
var KdsAlert =
|
|
1449
|
+
var KdsAlert = forwardRef11(
|
|
1394
1450
|
({ severity, title, icon, inline, onClose, children, className, ...props }, ref) => {
|
|
1395
1451
|
const resolvedIcon = icon === false ? null : typeof icon === "string" ? icon : DEFAULT_ICONS[severity];
|
|
1396
|
-
return /* @__PURE__ */
|
|
1452
|
+
return /* @__PURE__ */ jsxs9(
|
|
1397
1453
|
"div",
|
|
1398
1454
|
{
|
|
1399
1455
|
ref,
|
|
@@ -1401,19 +1457,19 @@ var KdsAlert = forwardRef10(
|
|
|
1401
1457
|
className: clsx("kds-alert", `kds-${severity}`, inline && "kds-alert-inline", className),
|
|
1402
1458
|
...props,
|
|
1403
1459
|
children: [
|
|
1404
|
-
resolvedIcon && /* @__PURE__ */
|
|
1405
|
-
/* @__PURE__ */
|
|
1406
|
-
title && /* @__PURE__ */
|
|
1407
|
-
/* @__PURE__ */
|
|
1460
|
+
resolvedIcon && /* @__PURE__ */ jsx12("div", { className: "kds-alert-icon", children: /* @__PURE__ */ jsx12("i", { className: "material-symbols-outlined", children: resolvedIcon }) }),
|
|
1461
|
+
/* @__PURE__ */ jsxs9("div", { className: "kds-alert-content", children: [
|
|
1462
|
+
title && /* @__PURE__ */ jsx12("p", { className: "kds-alert-title", children: title }),
|
|
1463
|
+
/* @__PURE__ */ jsx12("p", { className: "kds-alert-description", children })
|
|
1408
1464
|
] }),
|
|
1409
|
-
onClose && /* @__PURE__ */
|
|
1465
|
+
onClose && /* @__PURE__ */ jsx12(
|
|
1410
1466
|
"button",
|
|
1411
1467
|
{
|
|
1412
1468
|
type: "button",
|
|
1413
1469
|
className: "kds-alert-close",
|
|
1414
1470
|
onClick: onClose,
|
|
1415
1471
|
"aria-label": "Cerrar",
|
|
1416
|
-
children: /* @__PURE__ */
|
|
1472
|
+
children: /* @__PURE__ */ jsx12("i", { className: "material-symbols-outlined", children: "close" })
|
|
1417
1473
|
}
|
|
1418
1474
|
)
|
|
1419
1475
|
]
|
|
@@ -1424,8 +1480,8 @@ var KdsAlert = forwardRef10(
|
|
|
1424
1480
|
KdsAlert.displayName = "KdsAlert";
|
|
1425
1481
|
|
|
1426
1482
|
// src/components/core/KdsTypography/KdsTypography.tsx
|
|
1427
|
-
import { forwardRef as
|
|
1428
|
-
import { jsx as
|
|
1483
|
+
import { forwardRef as forwardRef12 } from "react";
|
|
1484
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
1429
1485
|
var variantTag = {
|
|
1430
1486
|
display1: "h1",
|
|
1431
1487
|
display2: "h2",
|
|
@@ -1445,10 +1501,10 @@ var variantTag = {
|
|
|
1445
1501
|
link: "span",
|
|
1446
1502
|
strong: "span"
|
|
1447
1503
|
};
|
|
1448
|
-
var KdsTypography =
|
|
1504
|
+
var KdsTypography = forwardRef12(
|
|
1449
1505
|
({ variant = "body", color, as, children, className, ...props }, ref) => {
|
|
1450
1506
|
const Tag = as || variantTag[variant];
|
|
1451
|
-
return /* @__PURE__ */
|
|
1507
|
+
return /* @__PURE__ */ jsx13(
|
|
1452
1508
|
Tag,
|
|
1453
1509
|
{
|
|
1454
1510
|
ref,
|
|
@@ -1466,7 +1522,7 @@ var KdsTypography = forwardRef11(
|
|
|
1466
1522
|
KdsTypography.displayName = "KdsTypography";
|
|
1467
1523
|
|
|
1468
1524
|
// src/components/core/KdsTabs/KdsTabs.tsx
|
|
1469
|
-
import
|
|
1525
|
+
import React13, { forwardRef as forwardRef13, Children, useMemo } from "react";
|
|
1470
1526
|
|
|
1471
1527
|
// src/components/core/hooks/useTabsKeyboard.ts
|
|
1472
1528
|
import { useCallback as useCallback2 } from "react";
|
|
@@ -1491,8 +1547,8 @@ function useTabsKeyboard(tabCount, activeIndex, onChange) {
|
|
|
1491
1547
|
}
|
|
1492
1548
|
|
|
1493
1549
|
// src/components/core/KdsTabs/KdsTabs.tsx
|
|
1494
|
-
import { jsx as
|
|
1495
|
-
var KdsTabs =
|
|
1550
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
1551
|
+
var KdsTabs = forwardRef13(
|
|
1496
1552
|
({ activeIndex, onChange, children, className, style, ...props }, ref) => {
|
|
1497
1553
|
const tabCount = Children.count(children);
|
|
1498
1554
|
const { onKeyDown } = useTabsKeyboard(tabCount, activeIndex, onChange);
|
|
@@ -1504,7 +1560,7 @@ var KdsTabs = forwardRef12(
|
|
|
1504
1560
|
}),
|
|
1505
1561
|
[tabCount, activeIndex, style]
|
|
1506
1562
|
);
|
|
1507
|
-
return /* @__PURE__ */
|
|
1563
|
+
return /* @__PURE__ */ jsx14(
|
|
1508
1564
|
"div",
|
|
1509
1565
|
{
|
|
1510
1566
|
ref,
|
|
@@ -1514,8 +1570,8 @@ var KdsTabs = forwardRef12(
|
|
|
1514
1570
|
onKeyDown,
|
|
1515
1571
|
...props,
|
|
1516
1572
|
children: Children.map(children, (child, i) => {
|
|
1517
|
-
if (!
|
|
1518
|
-
return
|
|
1573
|
+
if (!React13.isValidElement(child)) return child;
|
|
1574
|
+
return React13.cloneElement(child, {
|
|
1519
1575
|
_active: i === activeIndex,
|
|
1520
1576
|
_onClick: () => onChange(i)
|
|
1521
1577
|
});
|
|
@@ -1525,8 +1581,8 @@ var KdsTabs = forwardRef12(
|
|
|
1525
1581
|
}
|
|
1526
1582
|
);
|
|
1527
1583
|
KdsTabs.displayName = "KdsTabs";
|
|
1528
|
-
var KdsTab =
|
|
1529
|
-
({ _active, _onClick, children, className, ...props }, ref) => /* @__PURE__ */
|
|
1584
|
+
var KdsTab = forwardRef13(
|
|
1585
|
+
({ _active, _onClick, children, className, ...props }, ref) => /* @__PURE__ */ jsx14(
|
|
1530
1586
|
"button",
|
|
1531
1587
|
{
|
|
1532
1588
|
ref,
|
|
@@ -1542,8 +1598,8 @@ var KdsTab = forwardRef12(
|
|
|
1542
1598
|
)
|
|
1543
1599
|
);
|
|
1544
1600
|
KdsTab.displayName = "KdsTab";
|
|
1545
|
-
var KdsTabPanel =
|
|
1546
|
-
({ active, children, className, ...props }, ref) => /* @__PURE__ */
|
|
1601
|
+
var KdsTabPanel = forwardRef13(
|
|
1602
|
+
({ active, children, className, ...props }, ref) => /* @__PURE__ */ jsx14(
|
|
1547
1603
|
"div",
|
|
1548
1604
|
{
|
|
1549
1605
|
ref,
|
|
@@ -1558,19 +1614,19 @@ var KdsTabPanel = forwardRef12(
|
|
|
1558
1614
|
KdsTabPanel.displayName = "KdsTabPanel";
|
|
1559
1615
|
|
|
1560
1616
|
// src/components/core/KdsRadioGroup/KdsRadioGroup.tsx
|
|
1561
|
-
import { forwardRef as
|
|
1562
|
-
import { jsx as
|
|
1563
|
-
var KdsRadioGroup =
|
|
1564
|
-
({ label, name, options, value, onChange, size, variant, className, ...props }, ref) => /* @__PURE__ */
|
|
1617
|
+
import { forwardRef as forwardRef14 } from "react";
|
|
1618
|
+
import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1619
|
+
var KdsRadioGroup = forwardRef14(
|
|
1620
|
+
({ label, name, options, value, onChange, size, variant, className, ...props }, ref) => /* @__PURE__ */ jsxs10(
|
|
1565
1621
|
"fieldset",
|
|
1566
1622
|
{
|
|
1567
1623
|
ref,
|
|
1568
1624
|
className: clsx("kds-radio-group", variant === "card" && "kds-radio-group--card", className),
|
|
1569
1625
|
...props,
|
|
1570
1626
|
children: [
|
|
1571
|
-
label && /* @__PURE__ */
|
|
1572
|
-
options.map((opt) => /* @__PURE__ */
|
|
1573
|
-
/* @__PURE__ */
|
|
1627
|
+
label && /* @__PURE__ */ jsx15("legend", { children: label }),
|
|
1628
|
+
options.map((opt) => /* @__PURE__ */ jsxs10("label", { className: clsx("radio", size), children: [
|
|
1629
|
+
/* @__PURE__ */ jsx15(
|
|
1574
1630
|
"input",
|
|
1575
1631
|
{
|
|
1576
1632
|
type: "radio",
|
|
@@ -1581,7 +1637,7 @@ var KdsRadioGroup = forwardRef13(
|
|
|
1581
1637
|
onChange: () => onChange?.(opt.value)
|
|
1582
1638
|
}
|
|
1583
1639
|
),
|
|
1584
|
-
/* @__PURE__ */
|
|
1640
|
+
/* @__PURE__ */ jsx15("span", { children: opt.label })
|
|
1585
1641
|
] }, opt.value))
|
|
1586
1642
|
]
|
|
1587
1643
|
}
|
|
@@ -1590,9 +1646,9 @@ var KdsRadioGroup = forwardRef13(
|
|
|
1590
1646
|
KdsRadioGroup.displayName = "KdsRadioGroup";
|
|
1591
1647
|
|
|
1592
1648
|
// src/components/core/KdsSelect/KdsSelect.tsx
|
|
1593
|
-
import { forwardRef as
|
|
1594
|
-
import { jsx as
|
|
1595
|
-
var KdsSelect =
|
|
1649
|
+
import { forwardRef as forwardRef15 } from "react";
|
|
1650
|
+
import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1651
|
+
var KdsSelect = forwardRef15(
|
|
1596
1652
|
({
|
|
1597
1653
|
label,
|
|
1598
1654
|
options,
|
|
@@ -1603,12 +1659,49 @@ var KdsSelect = forwardRef14(
|
|
|
1603
1659
|
fullWidth = true,
|
|
1604
1660
|
disabled,
|
|
1605
1661
|
required,
|
|
1662
|
+
readOnly,
|
|
1606
1663
|
className,
|
|
1607
1664
|
id,
|
|
1608
1665
|
...props
|
|
1609
1666
|
}, ref) => {
|
|
1610
1667
|
const fieldId = id || `kds-select-${label.toLowerCase().replace(/\s+/g, "-")}`;
|
|
1611
|
-
|
|
1668
|
+
if (readOnly && !disabled) {
|
|
1669
|
+
const selectedValue = String(props.value ?? props.defaultValue ?? "");
|
|
1670
|
+
const selectedLabel = options.find((opt) => opt.value === selectedValue)?.label ?? "";
|
|
1671
|
+
const passthrough = Object.fromEntries(
|
|
1672
|
+
Object.entries(props).filter(
|
|
1673
|
+
([key]) => key.startsWith("aria-") || key.startsWith("data-") || key === "title"
|
|
1674
|
+
)
|
|
1675
|
+
);
|
|
1676
|
+
return /* @__PURE__ */ jsxs11(
|
|
1677
|
+
"div",
|
|
1678
|
+
{
|
|
1679
|
+
className: clsx(
|
|
1680
|
+
"field",
|
|
1681
|
+
"label",
|
|
1682
|
+
"border",
|
|
1683
|
+
"suffix",
|
|
1684
|
+
"locked",
|
|
1685
|
+
prefixIcon && "prefix",
|
|
1686
|
+
error && "invalid",
|
|
1687
|
+
fullWidth && "kds-w-full",
|
|
1688
|
+
className
|
|
1689
|
+
),
|
|
1690
|
+
children: [
|
|
1691
|
+
prefixIcon && /* @__PURE__ */ jsx16("i", { className: "material-symbols-outlined", children: prefixIcon }),
|
|
1692
|
+
/* @__PURE__ */ jsx16("input", { ...passthrough, id: fieldId, type: "text", value: selectedLabel, placeholder: " ", readOnly: true }),
|
|
1693
|
+
/* @__PURE__ */ jsxs11("label", { htmlFor: fieldId, children: [
|
|
1694
|
+
label,
|
|
1695
|
+
required && " *"
|
|
1696
|
+
] }),
|
|
1697
|
+
/* @__PURE__ */ jsx16("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "lock" }),
|
|
1698
|
+
props.name && /* @__PURE__ */ jsx16("input", { type: "hidden", name: props.name, value: selectedValue, form: props.form }),
|
|
1699
|
+
helperText && /* @__PURE__ */ jsx16("span", { className: "helper", children: helperText })
|
|
1700
|
+
]
|
|
1701
|
+
}
|
|
1702
|
+
);
|
|
1703
|
+
}
|
|
1704
|
+
return /* @__PURE__ */ jsxs11(
|
|
1612
1705
|
"div",
|
|
1613
1706
|
{
|
|
1614
1707
|
className: clsx(
|
|
@@ -1621,8 +1714,8 @@ var KdsSelect = forwardRef14(
|
|
|
1621
1714
|
className
|
|
1622
1715
|
),
|
|
1623
1716
|
children: [
|
|
1624
|
-
prefixIcon && /* @__PURE__ */
|
|
1625
|
-
/* @__PURE__ */
|
|
1717
|
+
prefixIcon && /* @__PURE__ */ jsx16("i", { className: "material-symbols-outlined", children: prefixIcon }),
|
|
1718
|
+
/* @__PURE__ */ jsxs11(
|
|
1626
1719
|
"select",
|
|
1627
1720
|
{
|
|
1628
1721
|
ref,
|
|
@@ -1631,16 +1724,16 @@ var KdsSelect = forwardRef14(
|
|
|
1631
1724
|
required,
|
|
1632
1725
|
...props,
|
|
1633
1726
|
children: [
|
|
1634
|
-
placeholder !== void 0 && /* @__PURE__ */
|
|
1635
|
-
options.map((opt) => /* @__PURE__ */
|
|
1727
|
+
placeholder !== void 0 && /* @__PURE__ */ jsx16("option", { value: "", children: placeholder }),
|
|
1728
|
+
options.map((opt) => /* @__PURE__ */ jsx16("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value))
|
|
1636
1729
|
]
|
|
1637
1730
|
}
|
|
1638
1731
|
),
|
|
1639
|
-
/* @__PURE__ */
|
|
1732
|
+
/* @__PURE__ */ jsxs11("label", { htmlFor: fieldId, children: [
|
|
1640
1733
|
label,
|
|
1641
1734
|
required && " *"
|
|
1642
1735
|
] }),
|
|
1643
|
-
helperText && /* @__PURE__ */
|
|
1736
|
+
helperText && /* @__PURE__ */ jsx16("span", { className: "helper", children: helperText })
|
|
1644
1737
|
]
|
|
1645
1738
|
}
|
|
1646
1739
|
);
|
|
@@ -1649,13 +1742,13 @@ var KdsSelect = forwardRef14(
|
|
|
1649
1742
|
KdsSelect.displayName = "KdsSelect";
|
|
1650
1743
|
|
|
1651
1744
|
// src/components/core/KdsChip/KdsChip.tsx
|
|
1652
|
-
import { forwardRef as
|
|
1653
|
-
import { jsx as
|
|
1654
|
-
var KdsChip =
|
|
1655
|
-
({ color, icon, onDelete, children, className, ...props }, ref) => /* @__PURE__ */
|
|
1656
|
-
icon && /* @__PURE__ */
|
|
1657
|
-
/* @__PURE__ */
|
|
1658
|
-
onDelete && /* @__PURE__ */
|
|
1745
|
+
import { forwardRef as forwardRef16 } from "react";
|
|
1746
|
+
import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1747
|
+
var KdsChip = forwardRef16(
|
|
1748
|
+
({ color, icon, onDelete, children, className, ...props }, ref) => /* @__PURE__ */ jsxs12("span", { ref, className: clsx("kds-badge", color, className), ...props, children: [
|
|
1749
|
+
icon && /* @__PURE__ */ jsx17("i", { className: "material-symbols-outlined", children: icon }),
|
|
1750
|
+
/* @__PURE__ */ jsx17("span", { children }),
|
|
1751
|
+
onDelete && /* @__PURE__ */ jsx17(
|
|
1659
1752
|
"button",
|
|
1660
1753
|
{
|
|
1661
1754
|
type: "button",
|
|
@@ -1665,7 +1758,7 @@ var KdsChip = forwardRef15(
|
|
|
1665
1758
|
onDelete();
|
|
1666
1759
|
},
|
|
1667
1760
|
"aria-label": "Eliminar",
|
|
1668
|
-
children: /* @__PURE__ */
|
|
1761
|
+
children: /* @__PURE__ */ jsx17("i", { className: "material-symbols-outlined", children: "close" })
|
|
1669
1762
|
}
|
|
1670
1763
|
)
|
|
1671
1764
|
] })
|
|
@@ -1673,7 +1766,7 @@ var KdsChip = forwardRef15(
|
|
|
1673
1766
|
KdsChip.displayName = "KdsChip";
|
|
1674
1767
|
|
|
1675
1768
|
// src/components/core/KdsSnackbar/KdsSnackbar.tsx
|
|
1676
|
-
import { forwardRef as
|
|
1769
|
+
import { forwardRef as forwardRef17 } from "react";
|
|
1677
1770
|
|
|
1678
1771
|
// src/components/core/hooks/useAutoHide.ts
|
|
1679
1772
|
import { useState as useState3, useEffect, useRef } from "react";
|
|
@@ -1693,13 +1786,13 @@ function useAutoHide(durationMs, onHide) {
|
|
|
1693
1786
|
}
|
|
1694
1787
|
|
|
1695
1788
|
// src/components/core/KdsSnackbar/KdsSnackbar.tsx
|
|
1696
|
-
import { jsx as
|
|
1789
|
+
import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1697
1790
|
var DEFAULT_ICONS2 = {
|
|
1698
1791
|
info: "info",
|
|
1699
1792
|
success: "check_circle",
|
|
1700
1793
|
error: "error"
|
|
1701
1794
|
};
|
|
1702
|
-
var KdsSnackbar =
|
|
1795
|
+
var KdsSnackbar = forwardRef17(
|
|
1703
1796
|
({
|
|
1704
1797
|
message,
|
|
1705
1798
|
type = "info",
|
|
@@ -1716,7 +1809,7 @@ var KdsSnackbar = forwardRef16(
|
|
|
1716
1809
|
if (!open || !visible) return null;
|
|
1717
1810
|
const resolvedIcon = icon === false ? null : icon ?? DEFAULT_ICONS2[type];
|
|
1718
1811
|
const mergedStyle = autoDismiss ? { ...style, ["--kds-snackbar-duration"]: `${duration}ms` } : style ?? {};
|
|
1719
|
-
return /* @__PURE__ */
|
|
1812
|
+
return /* @__PURE__ */ jsxs13(
|
|
1720
1813
|
"div",
|
|
1721
1814
|
{
|
|
1722
1815
|
ref,
|
|
@@ -1726,16 +1819,16 @@ var KdsSnackbar = forwardRef16(
|
|
|
1726
1819
|
style: mergedStyle,
|
|
1727
1820
|
...props,
|
|
1728
1821
|
children: [
|
|
1729
|
-
resolvedIcon && /* @__PURE__ */
|
|
1730
|
-
/* @__PURE__ */
|
|
1731
|
-
onClose && /* @__PURE__ */
|
|
1822
|
+
resolvedIcon && /* @__PURE__ */ jsx18("i", { className: "material-symbols-outlined", children: resolvedIcon }),
|
|
1823
|
+
/* @__PURE__ */ jsx18("span", { className: "max", children: message }),
|
|
1824
|
+
onClose && /* @__PURE__ */ jsx18(
|
|
1732
1825
|
"button",
|
|
1733
1826
|
{
|
|
1734
1827
|
type: "button",
|
|
1735
1828
|
className: "kds-snackbar-close",
|
|
1736
1829
|
onClick: onClose,
|
|
1737
1830
|
"aria-label": "Cerrar",
|
|
1738
|
-
children: /* @__PURE__ */
|
|
1831
|
+
children: /* @__PURE__ */ jsx18("i", { className: "material-symbols-outlined", children: "close" })
|
|
1739
1832
|
}
|
|
1740
1833
|
)
|
|
1741
1834
|
]
|
|
@@ -1747,7 +1840,7 @@ KdsSnackbar.displayName = "KdsSnackbar";
|
|
|
1747
1840
|
|
|
1748
1841
|
// src/components/core/KdsTooltip/KdsTooltip.tsx
|
|
1749
1842
|
import * as Tooltip from "@radix-ui/react-tooltip";
|
|
1750
|
-
import { jsx as
|
|
1843
|
+
import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1751
1844
|
function KdsTooltip({
|
|
1752
1845
|
content,
|
|
1753
1846
|
children,
|
|
@@ -1758,9 +1851,9 @@ function KdsTooltip({
|
|
|
1758
1851
|
onOpenChange,
|
|
1759
1852
|
delayDuration = 300
|
|
1760
1853
|
}) {
|
|
1761
|
-
return /* @__PURE__ */
|
|
1762
|
-
/* @__PURE__ */
|
|
1763
|
-
/* @__PURE__ */
|
|
1854
|
+
return /* @__PURE__ */ jsx19(Tooltip.Provider, { delayDuration, children: /* @__PURE__ */ jsxs14(Tooltip.Root, { open, defaultOpen, onOpenChange, children: [
|
|
1855
|
+
/* @__PURE__ */ jsx19(Tooltip.Trigger, { asChild: true, children }),
|
|
1856
|
+
/* @__PURE__ */ jsx19(Tooltip.Portal, { children: /* @__PURE__ */ jsx19("div", { className: "kds-theme-root", style: { display: "contents" }, children: /* @__PURE__ */ jsxs14(
|
|
1764
1857
|
Tooltip.Content,
|
|
1765
1858
|
{
|
|
1766
1859
|
className: clsx("kds-tooltip", className),
|
|
@@ -1769,7 +1862,7 @@ function KdsTooltip({
|
|
|
1769
1862
|
collisionPadding: 8,
|
|
1770
1863
|
children: [
|
|
1771
1864
|
content,
|
|
1772
|
-
/* @__PURE__ */
|
|
1865
|
+
/* @__PURE__ */ jsx19(Tooltip.Arrow, { className: "kds-tooltip-arrow", width: 10, height: 5 })
|
|
1773
1866
|
]
|
|
1774
1867
|
}
|
|
1775
1868
|
) }) })
|
|
@@ -1777,68 +1870,68 @@ function KdsTooltip({
|
|
|
1777
1870
|
}
|
|
1778
1871
|
|
|
1779
1872
|
// src/components/core/KdsAccordion/KdsAccordion.tsx
|
|
1780
|
-
import { forwardRef as
|
|
1781
|
-
import { jsx as
|
|
1782
|
-
var KdsAccordion =
|
|
1783
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
1873
|
+
import { forwardRef as forwardRef18 } from "react";
|
|
1874
|
+
import { jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1875
|
+
var KdsAccordion = forwardRef18(
|
|
1876
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx20("details", { ref, className: clsx("kds-accordion", className), ...props, children })
|
|
1784
1877
|
);
|
|
1785
1878
|
KdsAccordion.displayName = "KdsAccordion";
|
|
1786
|
-
var KdsAccordionSummary =
|
|
1787
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
1879
|
+
var KdsAccordionSummary = forwardRef18(
|
|
1880
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsxs15("summary", { ref, className: clsx("kds-accordion-summary", className), ...props, children: [
|
|
1788
1881
|
children,
|
|
1789
|
-
/* @__PURE__ */
|
|
1882
|
+
/* @__PURE__ */ jsx20("i", { className: "material-symbols-outlined", children: "expand_more" })
|
|
1790
1883
|
] })
|
|
1791
1884
|
);
|
|
1792
1885
|
KdsAccordionSummary.displayName = "KdsAccordionSummary";
|
|
1793
|
-
var KdsAccordionDetails =
|
|
1794
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
1886
|
+
var KdsAccordionDetails = forwardRef18(
|
|
1887
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx20("div", { ref, className: clsx("kds-accordion-details", className), ...props, children })
|
|
1795
1888
|
);
|
|
1796
1889
|
KdsAccordionDetails.displayName = "KdsAccordionDetails";
|
|
1797
1890
|
|
|
1798
1891
|
// src/components/core/KdsDivider/KdsDivider.tsx
|
|
1799
|
-
import { forwardRef as
|
|
1800
|
-
import { jsx as
|
|
1801
|
-
var KdsDivider =
|
|
1802
|
-
({ dashed, className, ...props }, ref) => /* @__PURE__ */
|
|
1892
|
+
import { forwardRef as forwardRef19 } from "react";
|
|
1893
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
1894
|
+
var KdsDivider = forwardRef19(
|
|
1895
|
+
({ dashed, className, ...props }, ref) => /* @__PURE__ */ jsx21("hr", { ref, className: clsx(dashed ? "kds-hr-dashed" : "kds-hr", className), ...props })
|
|
1803
1896
|
);
|
|
1804
1897
|
KdsDivider.displayName = "KdsDivider";
|
|
1805
1898
|
|
|
1806
1899
|
// src/components/core/KdsDocumentFrame/KdsDocumentFrame.tsx
|
|
1807
|
-
import { forwardRef as
|
|
1808
|
-
import { jsx as
|
|
1809
|
-
var KdsDocumentFrame =
|
|
1810
|
-
({ src, title, scale = 1, className, style, ...props }, ref) => /* @__PURE__ */
|
|
1900
|
+
import { forwardRef as forwardRef20 } from "react";
|
|
1901
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
1902
|
+
var KdsDocumentFrame = forwardRef20(
|
|
1903
|
+
({ src, title, scale = 1, className, style, ...props }, ref) => /* @__PURE__ */ jsx22(
|
|
1811
1904
|
"div",
|
|
1812
1905
|
{
|
|
1813
1906
|
ref,
|
|
1814
1907
|
className: clsx("kds-document-frame", className),
|
|
1815
1908
|
style: { "--kds-document-frame-scale": scale, ...style },
|
|
1816
1909
|
...props,
|
|
1817
|
-
children: /* @__PURE__ */
|
|
1910
|
+
children: /* @__PURE__ */ jsx22("iframe", { src, title })
|
|
1818
1911
|
}
|
|
1819
1912
|
)
|
|
1820
1913
|
);
|
|
1821
1914
|
KdsDocumentFrame.displayName = "KdsDocumentFrame";
|
|
1822
1915
|
|
|
1823
1916
|
// src/components/core/KdsSectionNote/KdsSectionNote.tsx
|
|
1824
|
-
import { forwardRef as
|
|
1825
|
-
import { jsx as
|
|
1826
|
-
var KdsSectionNote =
|
|
1827
|
-
({ icon = "info", children, className, ...props }, ref) => /* @__PURE__ */
|
|
1828
|
-
/* @__PURE__ */
|
|
1829
|
-
/* @__PURE__ */
|
|
1917
|
+
import { forwardRef as forwardRef21 } from "react";
|
|
1918
|
+
import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1919
|
+
var KdsSectionNote = forwardRef21(
|
|
1920
|
+
({ icon = "info", children, className, ...props }, ref) => /* @__PURE__ */ jsxs16("p", { ref, className: clsx("kds-section-note", className), ...props, children: [
|
|
1921
|
+
/* @__PURE__ */ jsx23("i", { className: "material-symbols-outlined", children: icon }),
|
|
1922
|
+
/* @__PURE__ */ jsx23("span", { children })
|
|
1830
1923
|
] })
|
|
1831
1924
|
);
|
|
1832
1925
|
KdsSectionNote.displayName = "KdsSectionNote";
|
|
1833
1926
|
|
|
1834
1927
|
// src/components/core/KdsStatusBlock/KdsStatusBlock.tsx
|
|
1835
|
-
import { forwardRef as
|
|
1836
|
-
import { jsx as
|
|
1837
|
-
var KdsStatusBlock =
|
|
1928
|
+
import { forwardRef as forwardRef22 } from "react";
|
|
1929
|
+
import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1930
|
+
var KdsStatusBlock = forwardRef22(
|
|
1838
1931
|
({ status, icon, title, description, inline, className, ...props }, ref) => {
|
|
1839
1932
|
const descriptionBelowRow = Boolean(inline && description);
|
|
1840
|
-
const descriptionNode = description ? /* @__PURE__ */
|
|
1841
|
-
return /* @__PURE__ */
|
|
1933
|
+
const descriptionNode = description ? /* @__PURE__ */ jsx24("p", { className: "kds-status-block-description", children: description }) : null;
|
|
1934
|
+
return /* @__PURE__ */ jsxs17(
|
|
1842
1935
|
"div",
|
|
1843
1936
|
{
|
|
1844
1937
|
ref,
|
|
@@ -1851,9 +1944,9 @@ var KdsStatusBlock = forwardRef21(
|
|
|
1851
1944
|
"data-status": status,
|
|
1852
1945
|
...props,
|
|
1853
1946
|
children: [
|
|
1854
|
-
/* @__PURE__ */
|
|
1855
|
-
/* @__PURE__ */
|
|
1856
|
-
/* @__PURE__ */
|
|
1947
|
+
/* @__PURE__ */ jsx24("div", { className: "kds-status-block-icon", children: icon && /* @__PURE__ */ jsx24("i", { className: "material-symbols-outlined", children: icon }) }),
|
|
1948
|
+
/* @__PURE__ */ jsxs17("div", { children: [
|
|
1949
|
+
/* @__PURE__ */ jsx24("h2", { className: "kds-status-block-title", children: title }),
|
|
1857
1950
|
!descriptionBelowRow && descriptionNode
|
|
1858
1951
|
] }),
|
|
1859
1952
|
descriptionBelowRow && descriptionNode
|
|
@@ -1865,30 +1958,45 @@ var KdsStatusBlock = forwardRef21(
|
|
|
1865
1958
|
KdsStatusBlock.displayName = "KdsStatusBlock";
|
|
1866
1959
|
|
|
1867
1960
|
// src/components/core/KdsStepper/KdsStepper.tsx
|
|
1868
|
-
import { forwardRef as
|
|
1869
|
-
import { jsx as
|
|
1870
|
-
var KdsStepper =
|
|
1871
|
-
({ steps, current,
|
|
1961
|
+
import { forwardRef as forwardRef23 } from "react";
|
|
1962
|
+
import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1963
|
+
var KdsStepper = forwardRef23(
|
|
1964
|
+
({ steps, current, numbered, color = "info", currentLabelOnly, className, ...props }, ref) => /* @__PURE__ */ jsx25(
|
|
1872
1965
|
"div",
|
|
1873
1966
|
{
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1967
|
+
ref,
|
|
1968
|
+
className: clsx(
|
|
1969
|
+
"kds-stepper",
|
|
1970
|
+
numbered && "kds-stepper--numbered",
|
|
1971
|
+
color === "primary" && "kds-stepper--primary",
|
|
1972
|
+
currentLabelOnly && "kds-stepper--current-label",
|
|
1973
|
+
className
|
|
1974
|
+
),
|
|
1975
|
+
...props,
|
|
1976
|
+
children: steps.map((label, i) => /* @__PURE__ */ jsxs18(
|
|
1977
|
+
"div",
|
|
1978
|
+
{
|
|
1979
|
+
className: clsx("kds-step", i < current && "completed", i === current && "current"),
|
|
1980
|
+
"aria-current": i === current ? "step" : void 0,
|
|
1981
|
+
children: [
|
|
1982
|
+
/* @__PURE__ */ jsx25("div", { className: "kds-step-indicator", children: numbered ? i + 1 : null }),
|
|
1983
|
+
/* @__PURE__ */ jsx25("div", { className: "kds-step-label", children: label })
|
|
1984
|
+
]
|
|
1985
|
+
},
|
|
1986
|
+
`${i}-${label}`
|
|
1987
|
+
))
|
|
1988
|
+
}
|
|
1989
|
+
)
|
|
1882
1990
|
);
|
|
1883
1991
|
KdsStepper.displayName = "KdsStepper";
|
|
1884
1992
|
|
|
1885
1993
|
// src/components/core/KdsCopyRow/KdsCopyRow.tsx
|
|
1886
|
-
import { forwardRef as
|
|
1887
|
-
import { jsx as
|
|
1888
|
-
var KdsCopyRow =
|
|
1994
|
+
import { forwardRef as forwardRef24 } from "react";
|
|
1995
|
+
import { jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1996
|
+
var KdsCopyRow = forwardRef24(
|
|
1889
1997
|
({ label, value, copiedText = "Copiado", className, ...props }, ref) => {
|
|
1890
1998
|
const { copied, copy } = useCopyToClipboard();
|
|
1891
|
-
return /* @__PURE__ */
|
|
1999
|
+
return /* @__PURE__ */ jsxs19(
|
|
1892
2000
|
"button",
|
|
1893
2001
|
{
|
|
1894
2002
|
ref,
|
|
@@ -1899,13 +2007,13 @@ var KdsCopyRow = forwardRef23(
|
|
|
1899
2007
|
"aria-label": `Copiar ${label}: ${value}`,
|
|
1900
2008
|
...props,
|
|
1901
2009
|
children: [
|
|
1902
|
-
/* @__PURE__ */
|
|
1903
|
-
/* @__PURE__ */
|
|
1904
|
-
/* @__PURE__ */
|
|
1905
|
-
/* @__PURE__ */
|
|
2010
|
+
/* @__PURE__ */ jsx26("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "content_copy" }),
|
|
2011
|
+
/* @__PURE__ */ jsxs19("div", { children: [
|
|
2012
|
+
/* @__PURE__ */ jsx26("span", { className: "kds-copy-row-label", children: label }),
|
|
2013
|
+
/* @__PURE__ */ jsx26("span", { className: "kds-copy-row-value", children: value })
|
|
1906
2014
|
] }),
|
|
1907
|
-
/* @__PURE__ */
|
|
1908
|
-
/* @__PURE__ */
|
|
2015
|
+
/* @__PURE__ */ jsxs19("span", { className: "kds-copy-toast", "aria-hidden": "true", children: [
|
|
2016
|
+
/* @__PURE__ */ jsx26("i", { className: "material-symbols-outlined", children: "check_circle" }),
|
|
1909
2017
|
" ",
|
|
1910
2018
|
copiedText
|
|
1911
2019
|
] })
|
|
@@ -1917,8 +2025,8 @@ var KdsCopyRow = forwardRef23(
|
|
|
1917
2025
|
KdsCopyRow.displayName = "KdsCopyRow";
|
|
1918
2026
|
|
|
1919
2027
|
// src/components/core/KdsCopyableTable/KdsCopyableTable.tsx
|
|
1920
|
-
import { forwardRef as
|
|
1921
|
-
import { Fragment as Fragment2, jsx as
|
|
2028
|
+
import { forwardRef as forwardRef25, useState as useState4, useRef as useRef2, useCallback as useCallback3 } from "react";
|
|
2029
|
+
import { Fragment as Fragment2, jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1922
2030
|
async function copyToClipboard(text) {
|
|
1923
2031
|
try {
|
|
1924
2032
|
if (navigator.clipboard?.writeText) {
|
|
@@ -1950,18 +2058,18 @@ function GridVariant({
|
|
|
1950
2058
|
forwardedRef,
|
|
1951
2059
|
rest
|
|
1952
2060
|
}) {
|
|
1953
|
-
return /* @__PURE__ */
|
|
2061
|
+
return /* @__PURE__ */ jsx27(
|
|
1954
2062
|
"div",
|
|
1955
2063
|
{
|
|
1956
2064
|
ref: forwardedRef,
|
|
1957
2065
|
className: clsx("kds-copyable-table", "kds-copyable-table--grid", className),
|
|
1958
2066
|
...rest,
|
|
1959
|
-
children: gridRows.map((cells, rowIndex) => /* @__PURE__ */
|
|
2067
|
+
children: gridRows.map((cells, rowIndex) => /* @__PURE__ */ jsx27(
|
|
1960
2068
|
"div",
|
|
1961
2069
|
{
|
|
1962
2070
|
className: "kds-copyable-table-row kds-copyable-table-row--grid",
|
|
1963
2071
|
"data-testid": "kds-grid-row",
|
|
1964
|
-
children: cells.map((text, cellIndex) => /* @__PURE__ */
|
|
2072
|
+
children: cells.map((text, cellIndex) => /* @__PURE__ */ jsx27(
|
|
1965
2073
|
"span",
|
|
1966
2074
|
{
|
|
1967
2075
|
className: clsx("kds-grid-cell", disabled && "kds-grid-cell--disabled"),
|
|
@@ -2048,8 +2156,8 @@ function CopyableVariant({
|
|
|
2048
2156
|
setTimeout(() => setAllCopied(false), 2e3);
|
|
2049
2157
|
}
|
|
2050
2158
|
};
|
|
2051
|
-
return /* @__PURE__ */
|
|
2052
|
-
/* @__PURE__ */
|
|
2159
|
+
return /* @__PURE__ */ jsxs20(Fragment2, { children: [
|
|
2160
|
+
/* @__PURE__ */ jsx27("div", { ref: forwardedRef, className: clsx("kds-copyable-table", className), ...rest, children: rows.map((row, i) => /* @__PURE__ */ jsxs20(
|
|
2053
2161
|
"div",
|
|
2054
2162
|
{
|
|
2055
2163
|
className: clsx(
|
|
@@ -2068,13 +2176,13 @@ function CopyableVariant({
|
|
|
2068
2176
|
},
|
|
2069
2177
|
"aria-label": `Copiar ${row.label}: ${row.value}`,
|
|
2070
2178
|
children: [
|
|
2071
|
-
/* @__PURE__ */
|
|
2072
|
-
/* @__PURE__ */
|
|
2179
|
+
/* @__PURE__ */ jsx27("span", { className: "kds-key", children: row.label }),
|
|
2180
|
+
/* @__PURE__ */ jsx27("span", { className: "kds-value", children: row.value })
|
|
2073
2181
|
]
|
|
2074
2182
|
},
|
|
2075
2183
|
`${row.label}-${i}`
|
|
2076
2184
|
)) }),
|
|
2077
|
-
showCopyAll && /* @__PURE__ */
|
|
2185
|
+
showCopyAll && /* @__PURE__ */ jsxs20(
|
|
2078
2186
|
"button",
|
|
2079
2187
|
{
|
|
2080
2188
|
type: "button",
|
|
@@ -2088,14 +2196,14 @@ function CopyableVariant({
|
|
|
2088
2196
|
onClick: handleCopyAll,
|
|
2089
2197
|
"aria-label": allCopied ? copiedAllLabel : copyAllLabel,
|
|
2090
2198
|
children: [
|
|
2091
|
-
/* @__PURE__ */
|
|
2092
|
-
/* @__PURE__ */
|
|
2199
|
+
/* @__PURE__ */ jsx27("span", { className: "kds-icon", children: /* @__PURE__ */ jsx27("i", { className: "material-symbols-outlined", children: allCopied ? "check" : "content_copy" }) }),
|
|
2200
|
+
/* @__PURE__ */ jsx27("span", { children: allCopied ? copiedAllLabel : copyAllLabel })
|
|
2093
2201
|
]
|
|
2094
2202
|
}
|
|
2095
2203
|
)
|
|
2096
2204
|
] });
|
|
2097
2205
|
}
|
|
2098
|
-
var KdsCopyableTable =
|
|
2206
|
+
var KdsCopyableTable = forwardRef25(
|
|
2099
2207
|
({
|
|
2100
2208
|
rows = [],
|
|
2101
2209
|
variant = "copyable",
|
|
@@ -2108,7 +2216,7 @@ var KdsCopyableTable = forwardRef24(
|
|
|
2108
2216
|
...props
|
|
2109
2217
|
}, ref) => {
|
|
2110
2218
|
if (variant === "grid") {
|
|
2111
|
-
return /* @__PURE__ */
|
|
2219
|
+
return /* @__PURE__ */ jsx27(
|
|
2112
2220
|
GridVariant,
|
|
2113
2221
|
{
|
|
2114
2222
|
gridRows,
|
|
@@ -2119,7 +2227,7 @@ var KdsCopyableTable = forwardRef24(
|
|
|
2119
2227
|
}
|
|
2120
2228
|
);
|
|
2121
2229
|
}
|
|
2122
|
-
return /* @__PURE__ */
|
|
2230
|
+
return /* @__PURE__ */ jsx27(
|
|
2123
2231
|
CopyableVariant,
|
|
2124
2232
|
{
|
|
2125
2233
|
rows,
|
|
@@ -2136,32 +2244,32 @@ var KdsCopyableTable = forwardRef24(
|
|
|
2136
2244
|
KdsCopyableTable.displayName = "KdsCopyableTable";
|
|
2137
2245
|
|
|
2138
2246
|
// src/components/core/KdsExpandPanel/KdsExpandPanel.tsx
|
|
2139
|
-
import { forwardRef as
|
|
2140
|
-
import { jsx as
|
|
2141
|
-
var KdsExpandPanel =
|
|
2247
|
+
import { forwardRef as forwardRef26, useState as useState5 } from "react";
|
|
2248
|
+
import { jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2249
|
+
var KdsExpandPanel = forwardRef26(
|
|
2142
2250
|
({ label, defaultExpanded = false, children, className, ...props }, ref) => {
|
|
2143
2251
|
const [expanded, setExpanded] = useState5(defaultExpanded);
|
|
2144
|
-
return /* @__PURE__ */
|
|
2145
|
-
/* @__PURE__ */
|
|
2252
|
+
return /* @__PURE__ */ jsxs21("div", { ref, className, ...props, children: [
|
|
2253
|
+
/* @__PURE__ */ jsxs21(
|
|
2146
2254
|
"button",
|
|
2147
2255
|
{
|
|
2148
2256
|
className: "kds-expand-toggle",
|
|
2149
2257
|
onClick: () => setExpanded((v) => !v),
|
|
2150
2258
|
"aria-expanded": expanded,
|
|
2151
2259
|
children: [
|
|
2152
|
-
/* @__PURE__ */
|
|
2153
|
-
/* @__PURE__ */
|
|
2260
|
+
/* @__PURE__ */ jsx28("span", { children: label }),
|
|
2261
|
+
/* @__PURE__ */ jsx28("i", { className: "material-symbols-outlined", children: expanded ? "expand_less" : "expand_more" })
|
|
2154
2262
|
]
|
|
2155
2263
|
}
|
|
2156
2264
|
),
|
|
2157
|
-
/* @__PURE__ */
|
|
2265
|
+
/* @__PURE__ */ jsx28("div", { className: clsx("kds-expand-panel", expanded && "open"), children })
|
|
2158
2266
|
] });
|
|
2159
2267
|
}
|
|
2160
2268
|
);
|
|
2161
2269
|
KdsExpandPanel.displayName = "KdsExpandPanel";
|
|
2162
2270
|
|
|
2163
2271
|
// src/components/core/KdsCountdown/KdsCountdown.tsx
|
|
2164
|
-
import { forwardRef as
|
|
2272
|
+
import { forwardRef as forwardRef27, useEffect as useEffect3, useRef as useRef3 } from "react";
|
|
2165
2273
|
|
|
2166
2274
|
// src/components/core/hooks/useCountdown.ts
|
|
2167
2275
|
import { useState as useState6, useEffect as useEffect2 } from "react";
|
|
@@ -2187,8 +2295,8 @@ function useCountdown(deadline) {
|
|
|
2187
2295
|
}
|
|
2188
2296
|
|
|
2189
2297
|
// src/components/core/KdsCountdown/KdsCountdown.tsx
|
|
2190
|
-
import { jsx as
|
|
2191
|
-
var KdsCountdown =
|
|
2298
|
+
import { jsx as jsx29, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2299
|
+
var KdsCountdown = forwardRef27(
|
|
2192
2300
|
({ deadline, label, onExpire, className, ...props }, ref) => {
|
|
2193
2301
|
const { hours, minutes, seconds, expired, urgent } = useCountdown(deadline);
|
|
2194
2302
|
const onExpireRef = useRef3(onExpire);
|
|
@@ -2202,9 +2310,9 @@ var KdsCountdown = forwardRef26(
|
|
|
2202
2310
|
return null;
|
|
2203
2311
|
}
|
|
2204
2312
|
const pad = (n) => String(n).padStart(2, "0");
|
|
2205
|
-
return /* @__PURE__ */
|
|
2206
|
-
label && /* @__PURE__ */
|
|
2207
|
-
/* @__PURE__ */
|
|
2313
|
+
return /* @__PURE__ */ jsxs22("div", { ref, className: clsx("kds-countdown", urgent && "urgent", className), ...props, children: [
|
|
2314
|
+
label && /* @__PURE__ */ jsx29("span", { className: "kds-countdown-label", children: label }),
|
|
2315
|
+
/* @__PURE__ */ jsxs22("span", { className: "kds-countdown-value", children: [
|
|
2208
2316
|
pad(hours),
|
|
2209
2317
|
":",
|
|
2210
2318
|
pad(minutes),
|
|
@@ -2217,18 +2325,18 @@ var KdsCountdown = forwardRef26(
|
|
|
2217
2325
|
KdsCountdown.displayName = "KdsCountdown";
|
|
2218
2326
|
|
|
2219
2327
|
// src/components/core/KdsSegmentedTabs/KdsSegmentedTabs.tsx
|
|
2220
|
-
import { forwardRef as
|
|
2221
|
-
import { jsx as
|
|
2222
|
-
var KdsSegmentedTabs =
|
|
2223
|
-
(props, ref) => /* @__PURE__ */
|
|
2328
|
+
import { forwardRef as forwardRef28 } from "react";
|
|
2329
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2330
|
+
var KdsSegmentedTabs = forwardRef28(
|
|
2331
|
+
(props, ref) => /* @__PURE__ */ jsx30(KdsTabs, { ref, ...props })
|
|
2224
2332
|
);
|
|
2225
2333
|
KdsSegmentedTabs.displayName = "KdsSegmentedTabs";
|
|
2226
2334
|
|
|
2227
2335
|
// src/components/core/KdsFab/KdsFab.tsx
|
|
2228
|
-
import { forwardRef as
|
|
2229
|
-
import { jsx as
|
|
2230
|
-
var KdsFab =
|
|
2231
|
-
({ icon, position = "top-right", hidden = false, className, ...props }, ref) => /* @__PURE__ */
|
|
2336
|
+
import { forwardRef as forwardRef29 } from "react";
|
|
2337
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
2338
|
+
var KdsFab = forwardRef29(
|
|
2339
|
+
({ icon, position = "top-right", hidden = false, className, ...props }, ref) => /* @__PURE__ */ jsx31(
|
|
2232
2340
|
"button",
|
|
2233
2341
|
{
|
|
2234
2342
|
ref,
|
|
@@ -2242,17 +2350,17 @@ var KdsFab = forwardRef28(
|
|
|
2242
2350
|
"aria-hidden": hidden || void 0,
|
|
2243
2351
|
tabIndex: hidden ? -1 : void 0,
|
|
2244
2352
|
...props,
|
|
2245
|
-
children: /* @__PURE__ */
|
|
2353
|
+
children: /* @__PURE__ */ jsx31("i", { className: "material-symbols-outlined", children: icon })
|
|
2246
2354
|
}
|
|
2247
2355
|
)
|
|
2248
2356
|
);
|
|
2249
2357
|
KdsFab.displayName = "KdsFab";
|
|
2250
2358
|
|
|
2251
2359
|
// src/components/core/KdsEmptyState/KdsEmptyState.tsx
|
|
2252
|
-
import { forwardRef as
|
|
2253
|
-
import { jsx as
|
|
2254
|
-
var KdsEmptyState =
|
|
2255
|
-
({ icon = "hide_source", title, description, className, ...props }, ref) => /* @__PURE__ */
|
|
2360
|
+
import { forwardRef as forwardRef30 } from "react";
|
|
2361
|
+
import { jsx as jsx32, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2362
|
+
var KdsEmptyState = forwardRef30(
|
|
2363
|
+
({ icon = "hide_source", title, description, className, ...props }, ref) => /* @__PURE__ */ jsxs23(
|
|
2256
2364
|
"div",
|
|
2257
2365
|
{
|
|
2258
2366
|
ref,
|
|
@@ -2260,10 +2368,10 @@ var KdsEmptyState = forwardRef29(
|
|
|
2260
2368
|
className: clsx("kds-empty-state", className),
|
|
2261
2369
|
...props,
|
|
2262
2370
|
children: [
|
|
2263
|
-
/* @__PURE__ */
|
|
2264
|
-
/* @__PURE__ */
|
|
2265
|
-
/* @__PURE__ */
|
|
2266
|
-
description && /* @__PURE__ */
|
|
2371
|
+
/* @__PURE__ */ jsx32("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: icon }),
|
|
2372
|
+
/* @__PURE__ */ jsxs23("div", { className: "kds-empty-state-text", children: [
|
|
2373
|
+
/* @__PURE__ */ jsx32(KdsTypography, { variant: "body", color: "primary", children: title }),
|
|
2374
|
+
description && /* @__PURE__ */ jsx32(KdsTypography, { variant: "body", color: "secondary", children: description })
|
|
2267
2375
|
] })
|
|
2268
2376
|
]
|
|
2269
2377
|
}
|
|
@@ -2272,12 +2380,12 @@ var KdsEmptyState = forwardRef29(
|
|
|
2272
2380
|
KdsEmptyState.displayName = "KdsEmptyState";
|
|
2273
2381
|
|
|
2274
2382
|
// src/components/domain/KdsBankRow/KdsBankRow.tsx
|
|
2275
|
-
import { forwardRef as
|
|
2276
|
-
import { jsx as
|
|
2277
|
-
var KdsBankRow =
|
|
2383
|
+
import { forwardRef as forwardRef31 } from "react";
|
|
2384
|
+
import { jsx as jsx33, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2385
|
+
var KdsBankRow = forwardRef31(
|
|
2278
2386
|
({ name, logoUrl, selected, hideLogo, className, ...props }, ref) => {
|
|
2279
2387
|
const nameStr = typeof name === "string" ? name : "";
|
|
2280
|
-
return /* @__PURE__ */
|
|
2388
|
+
return /* @__PURE__ */ jsxs24(
|
|
2281
2389
|
"button",
|
|
2282
2390
|
{
|
|
2283
2391
|
ref,
|
|
@@ -2285,9 +2393,9 @@ var KdsBankRow = forwardRef30(
|
|
|
2285
2393
|
className: clsx("kds-bank-row", selected && "selected", className),
|
|
2286
2394
|
...props,
|
|
2287
2395
|
children: [
|
|
2288
|
-
!hideLogo && /* @__PURE__ */
|
|
2289
|
-
/* @__PURE__ */
|
|
2290
|
-
/* @__PURE__ */
|
|
2396
|
+
!hideLogo && /* @__PURE__ */ jsx33("span", { className: "kds-bank-row-logo", children: logoUrl ? /* @__PURE__ */ jsx33("img", { src: logoUrl, alt: nameStr }) : /* @__PURE__ */ jsx33("span", { className: "initials", children: nameStr.charAt(0) }) }),
|
|
2397
|
+
/* @__PURE__ */ jsx33("span", { className: "kds-bank-row-name", children: name }),
|
|
2398
|
+
/* @__PURE__ */ jsx33("i", { className: "material-symbols-outlined", children: selected ? "check_circle" : "chevron_right" })
|
|
2291
2399
|
]
|
|
2292
2400
|
}
|
|
2293
2401
|
);
|
|
@@ -2296,32 +2404,32 @@ var KdsBankRow = forwardRef30(
|
|
|
2296
2404
|
KdsBankRow.displayName = "KdsBankRow";
|
|
2297
2405
|
|
|
2298
2406
|
// src/components/domain/KdsBankList/KdsBankList.tsx
|
|
2299
|
-
import { forwardRef as
|
|
2300
|
-
import { jsx as
|
|
2301
|
-
var KdsBankList =
|
|
2302
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
2407
|
+
import { forwardRef as forwardRef32 } from "react";
|
|
2408
|
+
import { jsx as jsx34 } from "react/jsx-runtime";
|
|
2409
|
+
var KdsBankList = forwardRef32(
|
|
2410
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx34("div", { ref, className: clsx("kds-bank-list", className), role: "list", ...props, children })
|
|
2303
2411
|
);
|
|
2304
2412
|
KdsBankList.displayName = "KdsBankList";
|
|
2305
2413
|
|
|
2306
2414
|
// src/components/domain/KdsBankModal/KdsBankModal.tsx
|
|
2307
|
-
import { forwardRef as
|
|
2415
|
+
import { forwardRef as forwardRef33, useState as useState7 } from "react";
|
|
2308
2416
|
import * as Dialog from "@radix-ui/react-dialog";
|
|
2309
|
-
import { jsx as
|
|
2310
|
-
var KdsBankModal =
|
|
2417
|
+
import { jsx as jsx35, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2418
|
+
var KdsBankModal = forwardRef33(
|
|
2311
2419
|
({ open, onClose, title = "Selecciona tu banco", searchPlaceholder = "Buscar banco...", onSearch, children, className, container }, ref) => {
|
|
2312
2420
|
const [query, setQuery] = useState7("");
|
|
2313
2421
|
const handleSearch = (value) => {
|
|
2314
2422
|
setQuery(value);
|
|
2315
2423
|
onSearch?.(value);
|
|
2316
2424
|
};
|
|
2317
|
-
return /* @__PURE__ */
|
|
2425
|
+
return /* @__PURE__ */ jsx35(Dialog.Root, { open, onOpenChange: (o) => {
|
|
2318
2426
|
if (!o) onClose();
|
|
2319
|
-
}, children: /* @__PURE__ */
|
|
2320
|
-
/* @__PURE__ */
|
|
2321
|
-
/* @__PURE__ */
|
|
2322
|
-
/* @__PURE__ */
|
|
2427
|
+
}, children: /* @__PURE__ */ jsx35(Dialog.Portal, { container, children: /* @__PURE__ */ jsx35(Dialog.Overlay, { className: "kds-bank-modal-scrim open", children: /* @__PURE__ */ jsxs25(Dialog.Content, { ref, className: clsx("kds-bank-modal", className), children: [
|
|
2428
|
+
/* @__PURE__ */ jsxs25("div", { className: "kds-bank-modal-header", children: [
|
|
2429
|
+
/* @__PURE__ */ jsx35(Dialog.Title, { asChild: true, children: /* @__PURE__ */ jsx35("h3", { children: title }) }),
|
|
2430
|
+
/* @__PURE__ */ jsx35(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx35("button", { className: "kds-bank-modal-close", "aria-label": "Cerrar", children: /* @__PURE__ */ jsx35("i", { className: "material-symbols-outlined", children: "close" }) }) })
|
|
2323
2431
|
] }),
|
|
2324
|
-
/* @__PURE__ */
|
|
2432
|
+
/* @__PURE__ */ jsx35("div", { className: "kds-bank-modal-search", children: /* @__PURE__ */ jsx35(
|
|
2325
2433
|
KdsSearchField,
|
|
2326
2434
|
{
|
|
2327
2435
|
placeholder: searchPlaceholder,
|
|
@@ -2329,82 +2437,639 @@ var KdsBankModal = forwardRef32(
|
|
|
2329
2437
|
onChange: (e) => handleSearch(e.target.value)
|
|
2330
2438
|
}
|
|
2331
2439
|
) }),
|
|
2332
|
-
/* @__PURE__ */
|
|
2440
|
+
/* @__PURE__ */ jsx35("div", { className: "kds-bank-modal-body", children })
|
|
2333
2441
|
] }) }) }) });
|
|
2334
2442
|
}
|
|
2335
2443
|
);
|
|
2336
2444
|
KdsBankModal.displayName = "KdsBankModal";
|
|
2337
2445
|
|
|
2446
|
+
// src/components/domain/KdsContract/KdsContract.tsx
|
|
2447
|
+
import { forwardRef as forwardRef34, useCallback as useCallback4, useEffect as useEffect4, useId, useRef as useRef4, useState as useState8 } from "react";
|
|
2448
|
+
import { jsx as jsx36, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2449
|
+
var END_TOLERANCE_PX = 8;
|
|
2450
|
+
var KdsContract = forwardRef34(
|
|
2451
|
+
({
|
|
2452
|
+
children,
|
|
2453
|
+
contentLabel = "Contrato",
|
|
2454
|
+
acceptLabel = "Declaro que le\xED y acepto el contrato",
|
|
2455
|
+
hint = "Despl\xE1zate hasta el final del contrato para poder aceptarlo.",
|
|
2456
|
+
name,
|
|
2457
|
+
accepted,
|
|
2458
|
+
onAcceptedChange,
|
|
2459
|
+
onReadComplete,
|
|
2460
|
+
className,
|
|
2461
|
+
...props
|
|
2462
|
+
}, ref) => {
|
|
2463
|
+
const hintId = useId();
|
|
2464
|
+
const contentRef = useRef4(null);
|
|
2465
|
+
const [read, setRead] = useState8(false);
|
|
2466
|
+
const onReadCompleteRef = useRef4(onReadComplete);
|
|
2467
|
+
onReadCompleteRef.current = onReadComplete;
|
|
2468
|
+
const check = useCallback4(() => {
|
|
2469
|
+
const el = contentRef.current;
|
|
2470
|
+
if (!el || el.clientHeight === 0) return;
|
|
2471
|
+
if (el.scrollTop + el.clientHeight >= el.scrollHeight - END_TOLERANCE_PX) {
|
|
2472
|
+
setRead(true);
|
|
2473
|
+
}
|
|
2474
|
+
}, []);
|
|
2475
|
+
useEffect4(() => {
|
|
2476
|
+
check();
|
|
2477
|
+
const el = contentRef.current;
|
|
2478
|
+
if (!el || typeof ResizeObserver === "undefined") return void 0;
|
|
2479
|
+
const observer = new ResizeObserver(check);
|
|
2480
|
+
observer.observe(el);
|
|
2481
|
+
return () => observer.disconnect();
|
|
2482
|
+
}, [check]);
|
|
2483
|
+
useEffect4(() => {
|
|
2484
|
+
if (read) onReadCompleteRef.current?.();
|
|
2485
|
+
}, [read]);
|
|
2486
|
+
return /* @__PURE__ */ jsxs26("div", { ref, className: clsx("kds-contract", read && "kds-contract--read", className), ...props, children: [
|
|
2487
|
+
/* @__PURE__ */ jsx36(
|
|
2488
|
+
"div",
|
|
2489
|
+
{
|
|
2490
|
+
ref: contentRef,
|
|
2491
|
+
className: "kds-contract-content",
|
|
2492
|
+
role: "region",
|
|
2493
|
+
"aria-label": contentLabel,
|
|
2494
|
+
tabIndex: 0,
|
|
2495
|
+
onScroll: read ? void 0 : check,
|
|
2496
|
+
children
|
|
2497
|
+
}
|
|
2498
|
+
),
|
|
2499
|
+
/* @__PURE__ */ jsxs26("label", { className: "checkbox kds-contract-accept", children: [
|
|
2500
|
+
/* @__PURE__ */ jsx36(
|
|
2501
|
+
"input",
|
|
2502
|
+
{
|
|
2503
|
+
type: "checkbox",
|
|
2504
|
+
name,
|
|
2505
|
+
checked: accepted,
|
|
2506
|
+
disabled: !read,
|
|
2507
|
+
"aria-describedby": read ? void 0 : hintId,
|
|
2508
|
+
onChange: (e) => onAcceptedChange?.(e.target.checked)
|
|
2509
|
+
}
|
|
2510
|
+
),
|
|
2511
|
+
/* @__PURE__ */ jsx36("span", { children: acceptLabel })
|
|
2512
|
+
] }),
|
|
2513
|
+
!read && /* @__PURE__ */ jsx36("div", { className: "kds-contract-hint", id: hintId, children: hint })
|
|
2514
|
+
] });
|
|
2515
|
+
}
|
|
2516
|
+
);
|
|
2517
|
+
KdsContract.displayName = "KdsContract";
|
|
2518
|
+
|
|
2519
|
+
// src/components/domain/KdsFeedbackCard/KdsFeedbackCard.tsx
|
|
2520
|
+
import { forwardRef as forwardRef35, useEffect as useEffect5, useId as useId2, useRef as useRef5 } from "react";
|
|
2521
|
+
import { Fragment as Fragment3, jsx as jsx37, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
2522
|
+
var KdsFeedbackCard = forwardRef35(
|
|
2523
|
+
({
|
|
2524
|
+
title,
|
|
2525
|
+
description,
|
|
2526
|
+
icon = "auto_awesome",
|
|
2527
|
+
children,
|
|
2528
|
+
canSubmit,
|
|
2529
|
+
onSubmit,
|
|
2530
|
+
submitLabel = "Enviar",
|
|
2531
|
+
submitted = false,
|
|
2532
|
+
thanksTitle = "\xA1Gracias por contarnos!",
|
|
2533
|
+
thanksDescription = "Tu respuesta nos ayuda a llegar a m\xE1s negocios como el tuyo.",
|
|
2534
|
+
className,
|
|
2535
|
+
...props
|
|
2536
|
+
}, ref) => {
|
|
2537
|
+
const titleId = useId2();
|
|
2538
|
+
const titleRef = useRef5(null);
|
|
2539
|
+
const wasSubmitted = useRef5(submitted);
|
|
2540
|
+
useEffect5(() => {
|
|
2541
|
+
if (submitted && !wasSubmitted.current) titleRef.current?.focus();
|
|
2542
|
+
wasSubmitted.current = submitted;
|
|
2543
|
+
}, [submitted]);
|
|
2544
|
+
return /* @__PURE__ */ jsxs27(
|
|
2545
|
+
"section",
|
|
2546
|
+
{
|
|
2547
|
+
ref,
|
|
2548
|
+
className: clsx("kds-feedback-card", submitted && "kds-feedback-card--submitted", className),
|
|
2549
|
+
"aria-labelledby": titleId,
|
|
2550
|
+
"aria-live": "polite",
|
|
2551
|
+
...props,
|
|
2552
|
+
children: [
|
|
2553
|
+
/* @__PURE__ */ jsx37("span", { className: "kds-feedback-card-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx37("i", { className: "material-symbols-outlined", children: submitted ? "check" : icon }) }),
|
|
2554
|
+
/* @__PURE__ */ jsxs27("div", { className: "kds-feedback-card-body", children: [
|
|
2555
|
+
/* @__PURE__ */ jsxs27("div", { className: "kds-feedback-card-text", children: [
|
|
2556
|
+
/* @__PURE__ */ jsx37(
|
|
2557
|
+
"div",
|
|
2558
|
+
{
|
|
2559
|
+
ref: titleRef,
|
|
2560
|
+
className: "kds-feedback-card-title",
|
|
2561
|
+
id: titleId,
|
|
2562
|
+
tabIndex: submitted ? -1 : void 0,
|
|
2563
|
+
children: submitted ? thanksTitle : title
|
|
2564
|
+
}
|
|
2565
|
+
),
|
|
2566
|
+
(submitted ? thanksDescription : description) && /* @__PURE__ */ jsx37("div", { className: "kds-feedback-card-description", children: submitted ? thanksDescription : description })
|
|
2567
|
+
] }),
|
|
2568
|
+
!submitted && /* @__PURE__ */ jsxs27(Fragment3, { children: [
|
|
2569
|
+
children,
|
|
2570
|
+
/* @__PURE__ */ jsx37(KdsButton, { variant: "outlined", disabled: !canSubmit, onClick: onSubmit, children: submitLabel })
|
|
2571
|
+
] })
|
|
2572
|
+
] })
|
|
2573
|
+
]
|
|
2574
|
+
}
|
|
2575
|
+
);
|
|
2576
|
+
}
|
|
2577
|
+
);
|
|
2578
|
+
KdsFeedbackCard.displayName = "KdsFeedbackCard";
|
|
2579
|
+
|
|
2580
|
+
// src/components/domain/KdsConsentCard/KdsConsentCard.tsx
|
|
2581
|
+
import { forwardRef as forwardRef36, useId as useId3 } from "react";
|
|
2582
|
+
import { Fragment as Fragment4, jsx as jsx38, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
2583
|
+
var KdsConsentCard = forwardRef36(
|
|
2584
|
+
({
|
|
2585
|
+
requester,
|
|
2586
|
+
resource,
|
|
2587
|
+
heading,
|
|
2588
|
+
subtitle,
|
|
2589
|
+
logo,
|
|
2590
|
+
sections,
|
|
2591
|
+
onAccept,
|
|
2592
|
+
onReject,
|
|
2593
|
+
loading = false,
|
|
2594
|
+
acceptLabel = "Autorizar",
|
|
2595
|
+
rejectLabel = "Rechazar",
|
|
2596
|
+
loadingLabel = "Autorizando",
|
|
2597
|
+
className,
|
|
2598
|
+
...props
|
|
2599
|
+
}, ref) => {
|
|
2600
|
+
const titleId = useId3();
|
|
2601
|
+
return /* @__PURE__ */ jsxs28(
|
|
2602
|
+
"section",
|
|
2603
|
+
{
|
|
2604
|
+
ref,
|
|
2605
|
+
className: clsx("kds-card-elevated", "kds-consent-card", className),
|
|
2606
|
+
"aria-labelledby": titleId,
|
|
2607
|
+
...props,
|
|
2608
|
+
children: [
|
|
2609
|
+
/* @__PURE__ */ jsxs28("div", { className: "kds-consent-card-header", children: [
|
|
2610
|
+
logo && /* @__PURE__ */ jsx38("div", { className: "kds-consent-card-logo", children: logo }),
|
|
2611
|
+
/* @__PURE__ */ jsx38("div", { className: "kds-consent-card-title", role: "heading", "aria-level": 2, id: titleId, children: heading ?? /* @__PURE__ */ jsxs28(Fragment4, { children: [
|
|
2612
|
+
/* @__PURE__ */ jsx38("strong", { children: requester }),
|
|
2613
|
+
" solicita acceso a ",
|
|
2614
|
+
/* @__PURE__ */ jsx38("strong", { children: resource })
|
|
2615
|
+
] }) }),
|
|
2616
|
+
subtitle && /* @__PURE__ */ jsx38("div", { className: "kds-consent-card-subtitle", children: subtitle })
|
|
2617
|
+
] }),
|
|
2618
|
+
/* @__PURE__ */ jsxs28("div", { className: "kds-consent-card-body", children: [
|
|
2619
|
+
sections.map((section, i) => {
|
|
2620
|
+
const sectionId = `${titleId}-s${i}`;
|
|
2621
|
+
return /* @__PURE__ */ jsxs28(
|
|
2622
|
+
"div",
|
|
2623
|
+
{
|
|
2624
|
+
className: "kds-consent-card-section",
|
|
2625
|
+
role: "group",
|
|
2626
|
+
"aria-labelledby": sectionId,
|
|
2627
|
+
children: [
|
|
2628
|
+
/* @__PURE__ */ jsx38(
|
|
2629
|
+
"div",
|
|
2630
|
+
{
|
|
2631
|
+
className: "kds-consent-card-section-title",
|
|
2632
|
+
role: "heading",
|
|
2633
|
+
"aria-level": 3,
|
|
2634
|
+
id: sectionId,
|
|
2635
|
+
children: section.title
|
|
2636
|
+
}
|
|
2637
|
+
),
|
|
2638
|
+
/* @__PURE__ */ jsx38("ul", { className: "kds-consent-card-items", children: section.items.map((item, j) => /* @__PURE__ */ jsxs28("li", { className: "kds-consent-card-item", children: [
|
|
2639
|
+
item.icon && /* @__PURE__ */ jsx38("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: item.icon }),
|
|
2640
|
+
/* @__PURE__ */ jsx38("span", { children: item.text })
|
|
2641
|
+
] }, j)) })
|
|
2642
|
+
]
|
|
2643
|
+
},
|
|
2644
|
+
section.title
|
|
2645
|
+
);
|
|
2646
|
+
}),
|
|
2647
|
+
/* @__PURE__ */ jsxs28("div", { className: "kds-consent-card-actions", children: [
|
|
2648
|
+
/* @__PURE__ */ jsx38(KdsButton, { variant: "primary", fullWidth: true, loading, onClick: onAccept, children: loading ? loadingLabel : acceptLabel }),
|
|
2649
|
+
/* @__PURE__ */ jsx38(KdsButton, { variant: "outlined", fullWidth: true, disabled: loading, onClick: onReject, children: rejectLabel })
|
|
2650
|
+
] })
|
|
2651
|
+
] })
|
|
2652
|
+
]
|
|
2653
|
+
}
|
|
2654
|
+
);
|
|
2655
|
+
}
|
|
2656
|
+
);
|
|
2657
|
+
KdsConsentCard.displayName = "KdsConsentCard";
|
|
2658
|
+
|
|
2659
|
+
// src/components/domain/KdsSidebar/KdsSidebar.tsx
|
|
2660
|
+
import { forwardRef as forwardRef37, useEffect as useEffect6, useId as useId4, useRef as useRef6, useState as useState9 } from "react";
|
|
2661
|
+
import { Fragment as Fragment5, jsx as jsx39, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
2662
|
+
var KdsSidebar = forwardRef37(
|
|
2663
|
+
({
|
|
2664
|
+
header,
|
|
2665
|
+
items,
|
|
2666
|
+
navLabel = "Men\xFA de la cuenta",
|
|
2667
|
+
open = false,
|
|
2668
|
+
onClose,
|
|
2669
|
+
mobileTitle = "Men\xFA",
|
|
2670
|
+
closeLabel = "Cerrar men\xFA",
|
|
2671
|
+
className,
|
|
2672
|
+
...props
|
|
2673
|
+
}, ref) => {
|
|
2674
|
+
const [menuOpen, setMenuOpen] = useState9(false);
|
|
2675
|
+
const asideRef = useRef6(null);
|
|
2676
|
+
const headerRef = useRef6(null);
|
|
2677
|
+
const toggleRef = useRef6(null);
|
|
2678
|
+
const closeRef = useRef6(null);
|
|
2679
|
+
const menuId = useId4();
|
|
2680
|
+
const onCloseRef = useRef6(onClose);
|
|
2681
|
+
onCloseRef.current = onClose;
|
|
2682
|
+
const setAsideRef = (el) => {
|
|
2683
|
+
asideRef.current = el;
|
|
2684
|
+
if (typeof ref === "function") ref(el);
|
|
2685
|
+
else if (ref) ref.current = el;
|
|
2686
|
+
};
|
|
2687
|
+
useEffect6(() => {
|
|
2688
|
+
if (!open) return void 0;
|
|
2689
|
+
const opener = document.activeElement;
|
|
2690
|
+
closeRef.current?.focus();
|
|
2691
|
+
const onKey = (e) => {
|
|
2692
|
+
if (e.key === "Escape") onCloseRef.current?.();
|
|
2693
|
+
};
|
|
2694
|
+
document.addEventListener("keydown", onKey);
|
|
2695
|
+
return () => {
|
|
2696
|
+
document.removeEventListener("keydown", onKey);
|
|
2697
|
+
if (opener && opener !== document.body && opener.isConnected) opener.focus();
|
|
2698
|
+
};
|
|
2699
|
+
}, [open]);
|
|
2700
|
+
useEffect6(() => {
|
|
2701
|
+
const el = asideRef.current;
|
|
2702
|
+
if (!el || typeof window.matchMedia !== "function") return void 0;
|
|
2703
|
+
const mobile = window.matchMedia("(max-width: 768px)");
|
|
2704
|
+
const sync = () => el.toggleAttribute("inert", mobile.matches && !open);
|
|
2705
|
+
sync();
|
|
2706
|
+
mobile.addEventListener("change", sync);
|
|
2707
|
+
return () => mobile.removeEventListener("change", sync);
|
|
2708
|
+
}, [open]);
|
|
2709
|
+
useEffect6(() => {
|
|
2710
|
+
if (!menuOpen) return void 0;
|
|
2711
|
+
const onDocClick = (e) => {
|
|
2712
|
+
if (!headerRef.current?.contains(e.target)) setMenuOpen(false);
|
|
2713
|
+
};
|
|
2714
|
+
document.addEventListener("click", onDocClick);
|
|
2715
|
+
return () => document.removeEventListener("click", onDocClick);
|
|
2716
|
+
}, [menuOpen]);
|
|
2717
|
+
const hasMenu = header.menu !== void 0;
|
|
2718
|
+
const onHeaderKeyDown = (e) => {
|
|
2719
|
+
if (e.key === "Escape" && menuOpen) {
|
|
2720
|
+
e.stopPropagation();
|
|
2721
|
+
setMenuOpen(false);
|
|
2722
|
+
toggleRef.current?.focus();
|
|
2723
|
+
}
|
|
2724
|
+
};
|
|
2725
|
+
const headerContent = /* @__PURE__ */ jsxs29(Fragment5, { children: [
|
|
2726
|
+
header.icon ? /* @__PURE__ */ jsx39("i", { className: "material-symbols-outlined kds-sidebar-icon", "aria-hidden": "true", children: header.icon }) : header.avatar && /* @__PURE__ */ jsx39("div", { className: "kds-sidebar-avatar", "aria-hidden": "true", children: header.avatar }),
|
|
2727
|
+
/* @__PURE__ */ jsxs29("div", { className: "kds-sidebar-header-text", children: [
|
|
2728
|
+
/* @__PURE__ */ jsx39("div", { className: "kds-sidebar-title", children: header.title }),
|
|
2729
|
+
header.subtitle && /* @__PURE__ */ jsx39("div", { className: "kds-sidebar-subtitle", children: header.subtitle })
|
|
2730
|
+
] })
|
|
2731
|
+
] });
|
|
2732
|
+
return /* @__PURE__ */ jsxs29(
|
|
2733
|
+
"aside",
|
|
2734
|
+
{
|
|
2735
|
+
ref: setAsideRef,
|
|
2736
|
+
className: clsx("kds-sidebar", open && "kds-sidebar-open", className),
|
|
2737
|
+
...props,
|
|
2738
|
+
children: [
|
|
2739
|
+
/* @__PURE__ */ jsxs29("div", { className: "kds-sidebar-mobile-header", children: [
|
|
2740
|
+
/* @__PURE__ */ jsx39("span", { children: mobileTitle }),
|
|
2741
|
+
/* @__PURE__ */ jsx39(
|
|
2742
|
+
"button",
|
|
2743
|
+
{
|
|
2744
|
+
ref: closeRef,
|
|
2745
|
+
type: "button",
|
|
2746
|
+
className: "kds-sidebar-close-btn",
|
|
2747
|
+
"aria-label": closeLabel,
|
|
2748
|
+
onClick: () => onClose?.(),
|
|
2749
|
+
children: /* @__PURE__ */ jsx39("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "close" })
|
|
2750
|
+
}
|
|
2751
|
+
)
|
|
2752
|
+
] }),
|
|
2753
|
+
/* @__PURE__ */ jsx39("div", { ref: headerRef, className: "kds-sidebar-header", onKeyDown: onHeaderKeyDown, children: hasMenu ? /* @__PURE__ */ jsxs29(Fragment5, { children: [
|
|
2754
|
+
/* @__PURE__ */ jsxs29(
|
|
2755
|
+
"button",
|
|
2756
|
+
{
|
|
2757
|
+
ref: toggleRef,
|
|
2758
|
+
type: "button",
|
|
2759
|
+
className: "kds-sidebar-header-toggle",
|
|
2760
|
+
"aria-haspopup": "true",
|
|
2761
|
+
"aria-expanded": menuOpen,
|
|
2762
|
+
"aria-controls": menuId,
|
|
2763
|
+
onClick: () => setMenuOpen((v) => !v),
|
|
2764
|
+
children: [
|
|
2765
|
+
headerContent,
|
|
2766
|
+
/* @__PURE__ */ jsx39("i", { className: "material-symbols-outlined kds-sidebar-dropdown-icon", "aria-hidden": "true", children: "expand_more" })
|
|
2767
|
+
]
|
|
2768
|
+
}
|
|
2769
|
+
),
|
|
2770
|
+
/* @__PURE__ */ jsx39(
|
|
2771
|
+
"div",
|
|
2772
|
+
{
|
|
2773
|
+
id: menuId,
|
|
2774
|
+
className: clsx(
|
|
2775
|
+
"kds-sidebar-header-dropdown surface elevate border small-round",
|
|
2776
|
+
menuOpen && "kds-dropdown-open"
|
|
2777
|
+
),
|
|
2778
|
+
children: header.menu
|
|
2779
|
+
}
|
|
2780
|
+
)
|
|
2781
|
+
] }) : headerContent }),
|
|
2782
|
+
/* @__PURE__ */ jsx39("nav", { className: "kds-sidebar-nav", "aria-label": navLabel, children: items.map((item, i) => /* @__PURE__ */ jsxs29(
|
|
2783
|
+
"a",
|
|
2784
|
+
{
|
|
2785
|
+
href: item.href,
|
|
2786
|
+
className: clsx("kds-sidebar-nav-item", item.active && "active"),
|
|
2787
|
+
"aria-current": item.active ? "page" : void 0,
|
|
2788
|
+
...item.external ? { target: "_blank", rel: "noopener noreferrer" } : {},
|
|
2789
|
+
children: [
|
|
2790
|
+
item.icon && /* @__PURE__ */ jsx39("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: item.icon }),
|
|
2791
|
+
/* @__PURE__ */ jsx39("span", { children: item.label })
|
|
2792
|
+
]
|
|
2793
|
+
},
|
|
2794
|
+
`${i}-${item.href}`
|
|
2795
|
+
)) })
|
|
2796
|
+
]
|
|
2797
|
+
}
|
|
2798
|
+
);
|
|
2799
|
+
}
|
|
2800
|
+
);
|
|
2801
|
+
KdsSidebar.displayName = "KdsSidebar";
|
|
2802
|
+
|
|
2803
|
+
// src/components/domain/KdsNavbar/KdsNavbar.tsx
|
|
2804
|
+
import { forwardRef as forwardRef38 } from "react";
|
|
2805
|
+
import { jsx as jsx40, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
2806
|
+
var KdsNavbar = forwardRef38(
|
|
2807
|
+
({
|
|
2808
|
+
brand,
|
|
2809
|
+
brandHref = "/",
|
|
2810
|
+
variant = "primary",
|
|
2811
|
+
onMenuClick,
|
|
2812
|
+
menuOpen,
|
|
2813
|
+
menuControls,
|
|
2814
|
+
menuLabel = "Men\xFA",
|
|
2815
|
+
children,
|
|
2816
|
+
className,
|
|
2817
|
+
...props
|
|
2818
|
+
}, ref) => /* @__PURE__ */ jsx40(
|
|
2819
|
+
"nav",
|
|
2820
|
+
{
|
|
2821
|
+
ref,
|
|
2822
|
+
className: clsx(
|
|
2823
|
+
variant === "primary" ? "primary no-margin" : "no-margin surface secondary-nav-border",
|
|
2824
|
+
className
|
|
2825
|
+
),
|
|
2826
|
+
...props,
|
|
2827
|
+
children: /* @__PURE__ */ jsxs30("div", { className: "kds-container-center", children: [
|
|
2828
|
+
onMenuClick && /* @__PURE__ */ jsx40(
|
|
2829
|
+
"button",
|
|
2830
|
+
{
|
|
2831
|
+
type: "button",
|
|
2832
|
+
className: "kds-hamburger-btn",
|
|
2833
|
+
"aria-label": menuLabel,
|
|
2834
|
+
"aria-expanded": menuOpen,
|
|
2835
|
+
"aria-controls": menuControls,
|
|
2836
|
+
onClick: onMenuClick,
|
|
2837
|
+
children: /* @__PURE__ */ jsx40("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "menu" })
|
|
2838
|
+
}
|
|
2839
|
+
),
|
|
2840
|
+
/* @__PURE__ */ jsx40("a", { href: brandHref, className: "kds-navbar-brand", children: brand }),
|
|
2841
|
+
/* @__PURE__ */ jsx40("div", { className: "max" }),
|
|
2842
|
+
children
|
|
2843
|
+
] })
|
|
2844
|
+
}
|
|
2845
|
+
)
|
|
2846
|
+
);
|
|
2847
|
+
KdsNavbar.displayName = "KdsNavbar";
|
|
2848
|
+
|
|
2849
|
+
// src/components/domain/KdsFooter/KdsFooter.tsx
|
|
2850
|
+
import { forwardRef as forwardRef39 } from "react";
|
|
2851
|
+
import { jsx as jsx41, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
2852
|
+
var KdsFooter = forwardRef39(
|
|
2853
|
+
({ columns, children, className, ...props }, ref) => /* @__PURE__ */ jsx41("footer", { ref, className: clsx("primary", className), ...props, children: /* @__PURE__ */ jsxs31("div", { className: "kds-container-center", children: [
|
|
2854
|
+
/* @__PURE__ */ jsx41("div", { className: "kds-grid", children: columns.map((column) => /* @__PURE__ */ jsxs31("div", { className: "kds-col-sm-12 kds-col-md-6 kds-col-lg-2", children: [
|
|
2855
|
+
/* @__PURE__ */ jsx41("h6", { className: "kds-text-center", children: column.title }),
|
|
2856
|
+
/* @__PURE__ */ jsx41("nav", { className: "kds-footer-nav", "aria-label": column.title, children: column.links.map((link, i) => /* @__PURE__ */ jsx41(
|
|
2857
|
+
"a",
|
|
2858
|
+
{
|
|
2859
|
+
href: link.href,
|
|
2860
|
+
...link.external ? { target: "_blank", rel: "noopener noreferrer" } : {},
|
|
2861
|
+
children: link.label
|
|
2862
|
+
},
|
|
2863
|
+
`${i}-${link.href}`
|
|
2864
|
+
)) })
|
|
2865
|
+
] }, column.title)) }),
|
|
2866
|
+
children
|
|
2867
|
+
] }) })
|
|
2868
|
+
);
|
|
2869
|
+
KdsFooter.displayName = "KdsFooter";
|
|
2870
|
+
|
|
2338
2871
|
// src/components/domain/KdsQrRow/KdsQrRow.tsx
|
|
2339
|
-
import { forwardRef as
|
|
2340
|
-
import { jsx as
|
|
2341
|
-
var KdsQrRow =
|
|
2342
|
-
({ name, description, badge, icon = "qr_code_2", className, ...props }, ref) => /* @__PURE__ */
|
|
2343
|
-
/* @__PURE__ */
|
|
2344
|
-
/* @__PURE__ */
|
|
2345
|
-
/* @__PURE__ */
|
|
2346
|
-
description && /* @__PURE__ */
|
|
2872
|
+
import { forwardRef as forwardRef40 } from "react";
|
|
2873
|
+
import { jsx as jsx42, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
2874
|
+
var KdsQrRow = forwardRef40(
|
|
2875
|
+
({ name, description, badge, icon = "qr_code_2", className, ...props }, ref) => /* @__PURE__ */ jsxs32("button", { ref, type: "button", className: clsx("kds-qr-row", className), ...props, children: [
|
|
2876
|
+
/* @__PURE__ */ jsx42("span", { className: "kds-qr-avatar", "aria-hidden": "true", children: /* @__PURE__ */ jsx42("i", { className: "material-symbols-outlined", children: icon }) }),
|
|
2877
|
+
/* @__PURE__ */ jsxs32("span", { className: "kds-qr-text", children: [
|
|
2878
|
+
/* @__PURE__ */ jsx42("span", { className: "kds-qr-title", children: name }),
|
|
2879
|
+
description && /* @__PURE__ */ jsx42("span", { className: "kds-qr-subtitle", children: description })
|
|
2347
2880
|
] }),
|
|
2348
|
-
badge && /* @__PURE__ */
|
|
2349
|
-
/* @__PURE__ */
|
|
2881
|
+
badge && /* @__PURE__ */ jsx42("span", { className: "kds-qr-badge", children: badge }),
|
|
2882
|
+
/* @__PURE__ */ jsx42("i", { className: "material-symbols-outlined", children: "chevron_right" })
|
|
2350
2883
|
] })
|
|
2351
2884
|
);
|
|
2352
2885
|
KdsQrRow.displayName = "KdsQrRow";
|
|
2353
2886
|
|
|
2354
2887
|
// src/components/domain/KdsCardSelector/KdsCardSelector.tsx
|
|
2355
|
-
import { forwardRef as
|
|
2356
|
-
import { jsx as
|
|
2357
|
-
var KdsCardSelector =
|
|
2358
|
-
({
|
|
2359
|
-
|
|
2888
|
+
import { forwardRef as forwardRef41, useId as useId5 } from "react";
|
|
2889
|
+
import { jsx as jsx43, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
2890
|
+
var KdsCardSelector = forwardRef41(
|
|
2891
|
+
({
|
|
2892
|
+
icon,
|
|
2893
|
+
title,
|
|
2894
|
+
description,
|
|
2895
|
+
selected,
|
|
2896
|
+
radio,
|
|
2897
|
+
name,
|
|
2898
|
+
value,
|
|
2899
|
+
checked,
|
|
2900
|
+
onCheckedChange,
|
|
2901
|
+
children,
|
|
2902
|
+
className,
|
|
2903
|
+
disabled,
|
|
2904
|
+
type,
|
|
2905
|
+
...props
|
|
2906
|
+
}, ref) => {
|
|
2907
|
+
const radioId = useId5();
|
|
2908
|
+
const descriptionId = `${radioId}-description`;
|
|
2909
|
+
const iconNode = icon && /* @__PURE__ */ jsx43("span", { className: "kds-card-selector-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx43("i", { className: "material-symbols-outlined", children: icon }) });
|
|
2910
|
+
if (radio && name !== void 0 && value !== void 0) {
|
|
2911
|
+
return /* @__PURE__ */ jsxs33(
|
|
2912
|
+
"div",
|
|
2913
|
+
{
|
|
2914
|
+
ref,
|
|
2915
|
+
className: clsx("kds-card-selector", "kds-card-selector--radio", className),
|
|
2916
|
+
...props,
|
|
2917
|
+
children: [
|
|
2918
|
+
/* @__PURE__ */ jsx43(
|
|
2919
|
+
"input",
|
|
2920
|
+
{
|
|
2921
|
+
type: "radio",
|
|
2922
|
+
className: "kds-card-selector-radio",
|
|
2923
|
+
id: radioId,
|
|
2924
|
+
name,
|
|
2925
|
+
value,
|
|
2926
|
+
checked,
|
|
2927
|
+
disabled,
|
|
2928
|
+
onChange: () => onCheckedChange?.(value),
|
|
2929
|
+
"aria-describedby": description ? descriptionId : void 0
|
|
2930
|
+
}
|
|
2931
|
+
),
|
|
2932
|
+
iconNode,
|
|
2933
|
+
/* @__PURE__ */ jsx43("label", { htmlFor: radioId, className: "kds-card-selector-title", children: title }),
|
|
2934
|
+
description && /* @__PURE__ */ jsx43("span", { className: "kds-card-selector-description", id: descriptionId, children: description }),
|
|
2935
|
+
children && /* @__PURE__ */ jsx43("div", { className: "kds-card-selector-details", children })
|
|
2936
|
+
]
|
|
2937
|
+
}
|
|
2938
|
+
);
|
|
2939
|
+
}
|
|
2940
|
+
return /* @__PURE__ */ jsxs33(
|
|
2941
|
+
"button",
|
|
2942
|
+
{
|
|
2943
|
+
ref,
|
|
2944
|
+
type: type ?? "button",
|
|
2945
|
+
className: clsx("kds-card-selector", selected && "selected", className),
|
|
2946
|
+
disabled,
|
|
2947
|
+
name,
|
|
2948
|
+
value,
|
|
2949
|
+
...props,
|
|
2950
|
+
children: [
|
|
2951
|
+
iconNode,
|
|
2952
|
+
/* @__PURE__ */ jsx43("span", { className: "kds-card-selector-title", children: title }),
|
|
2953
|
+
description && /* @__PURE__ */ jsx43("span", { className: "kds-card-selector-description", children: description }),
|
|
2954
|
+
children && /* @__PURE__ */ jsx43("span", { className: "kds-card-selector-details", children })
|
|
2955
|
+
]
|
|
2956
|
+
}
|
|
2957
|
+
);
|
|
2958
|
+
}
|
|
2959
|
+
);
|
|
2960
|
+
KdsCardSelector.displayName = "KdsCardSelector";
|
|
2961
|
+
var KdsCardSelectorGroup = forwardRef41(
|
|
2962
|
+
({ label, className, children, ...props }, ref) => /* @__PURE__ */ jsx43(
|
|
2963
|
+
"div",
|
|
2360
2964
|
{
|
|
2361
2965
|
ref,
|
|
2362
|
-
|
|
2363
|
-
|
|
2966
|
+
role: "radiogroup",
|
|
2967
|
+
"aria-label": label,
|
|
2968
|
+
className: clsx("kds-card-selector-group", className),
|
|
2364
2969
|
...props,
|
|
2365
|
-
children
|
|
2366
|
-
icon && /* @__PURE__ */ jsx36("span", { className: "kds-card-selector-icon", children: /* @__PURE__ */ jsx36("i", { className: "material-symbols-outlined", children: icon }) }),
|
|
2367
|
-
/* @__PURE__ */ jsx36("span", { className: "kds-card-selector-title", children: title }),
|
|
2368
|
-
description && /* @__PURE__ */ jsx36("span", { className: "kds-card-selector-description", children: description })
|
|
2369
|
-
]
|
|
2970
|
+
children
|
|
2370
2971
|
}
|
|
2371
2972
|
)
|
|
2372
2973
|
);
|
|
2373
|
-
|
|
2974
|
+
KdsCardSelectorGroup.displayName = "KdsCardSelectorGroup";
|
|
2374
2975
|
|
|
2375
2976
|
// src/components/domain/KdsCardPlan/KdsCardPlan.tsx
|
|
2376
|
-
import { forwardRef as
|
|
2377
|
-
import { jsx as
|
|
2378
|
-
var KdsCardPlan =
|
|
2379
|
-
({
|
|
2977
|
+
import { forwardRef as forwardRef42, useId as useId6 } from "react";
|
|
2978
|
+
import { jsx as jsx44, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
2979
|
+
var KdsCardPlan = forwardRef42(
|
|
2980
|
+
({
|
|
2981
|
+
title,
|
|
2982
|
+
price,
|
|
2983
|
+
period,
|
|
2984
|
+
features,
|
|
2985
|
+
recommended,
|
|
2986
|
+
badgeText,
|
|
2987
|
+
action,
|
|
2988
|
+
description,
|
|
2989
|
+
checkFeatures,
|
|
2990
|
+
name,
|
|
2991
|
+
value,
|
|
2992
|
+
selected,
|
|
2993
|
+
onSelectedChange,
|
|
2994
|
+
className,
|
|
2995
|
+
...props
|
|
2996
|
+
}, ref) => {
|
|
2997
|
+
const radioId = useId6();
|
|
2998
|
+
const priceId = `${radioId}-price`;
|
|
2999
|
+
const badgeId = `${radioId}-badge`;
|
|
3000
|
+
const selectable = name !== void 0 && value !== void 0;
|
|
3001
|
+
return /* @__PURE__ */ jsxs34(
|
|
3002
|
+
"div",
|
|
3003
|
+
{
|
|
3004
|
+
ref,
|
|
3005
|
+
className: clsx(
|
|
3006
|
+
"kds-card-plan",
|
|
3007
|
+
recommended && "recommended",
|
|
3008
|
+
selectable && "kds-card-plan--selectable",
|
|
3009
|
+
className
|
|
3010
|
+
),
|
|
3011
|
+
...props,
|
|
3012
|
+
children: [
|
|
3013
|
+
selectable && /* @__PURE__ */ jsx44(
|
|
3014
|
+
"input",
|
|
3015
|
+
{
|
|
3016
|
+
type: "radio",
|
|
3017
|
+
className: "kds-card-plan-radio",
|
|
3018
|
+
id: radioId,
|
|
3019
|
+
name,
|
|
3020
|
+
value,
|
|
3021
|
+
checked: selected,
|
|
3022
|
+
onChange: () => onSelectedChange?.(value),
|
|
3023
|
+
"aria-describedby": badgeText ? `${priceId} ${badgeId}` : priceId
|
|
3024
|
+
}
|
|
3025
|
+
),
|
|
3026
|
+
/* @__PURE__ */ jsx44("div", { className: "kds-card-plan-header", children: /* @__PURE__ */ jsx44("h3", { children: selectable ? /* @__PURE__ */ jsx44("label", { htmlFor: radioId, children: title }) : title }) }),
|
|
3027
|
+
/* @__PURE__ */ jsxs34("div", { className: "kds-card-plan-price", id: selectable ? priceId : void 0, children: [
|
|
3028
|
+
/* @__PURE__ */ jsx44("span", { className: "kds-price", children: price }),
|
|
3029
|
+
period && /* @__PURE__ */ jsxs34("span", { className: "kds-price-period", children: [
|
|
3030
|
+
"/",
|
|
3031
|
+
period
|
|
3032
|
+
] })
|
|
3033
|
+
] }),
|
|
3034
|
+
description && /* @__PURE__ */ jsx44("div", { className: "kds-card-plan-description", children: description }),
|
|
3035
|
+
badgeText && /* @__PURE__ */ jsx44("span", { className: "kds-card-plan-badge", id: selectable ? badgeId : void 0, children: badgeText }),
|
|
3036
|
+
features && features.length > 0 && /* @__PURE__ */ jsx44(
|
|
3037
|
+
"ul",
|
|
3038
|
+
{
|
|
3039
|
+
className: clsx("kds-card-plan-features", checkFeatures && "kds-card-plan-features--check"),
|
|
3040
|
+
children: features.map((f, i) => /* @__PURE__ */ jsxs34("li", { children: [
|
|
3041
|
+
checkFeatures && /* @__PURE__ */ jsx44("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "check" }),
|
|
3042
|
+
f
|
|
3043
|
+
] }, i))
|
|
3044
|
+
}
|
|
3045
|
+
),
|
|
3046
|
+
action
|
|
3047
|
+
]
|
|
3048
|
+
}
|
|
3049
|
+
);
|
|
3050
|
+
}
|
|
3051
|
+
);
|
|
3052
|
+
KdsCardPlan.displayName = "KdsCardPlan";
|
|
3053
|
+
var KdsCardPlanGroup = forwardRef42(
|
|
3054
|
+
({ label, className, children, ...props }, ref) => /* @__PURE__ */ jsx44(
|
|
2380
3055
|
"div",
|
|
2381
3056
|
{
|
|
2382
3057
|
ref,
|
|
2383
|
-
|
|
3058
|
+
role: "radiogroup",
|
|
3059
|
+
"aria-label": label,
|
|
3060
|
+
className: clsx("kds-card-plan-group", className),
|
|
2384
3061
|
...props,
|
|
2385
|
-
children
|
|
2386
|
-
/* @__PURE__ */ jsx37("div", { className: "kds-card-plan-header", children: /* @__PURE__ */ jsx37("h3", { children: title }) }),
|
|
2387
|
-
/* @__PURE__ */ jsxs27("div", { className: "kds-card-plan-price", children: [
|
|
2388
|
-
/* @__PURE__ */ jsx37("span", { className: "kds-price", children: price }),
|
|
2389
|
-
period && /* @__PURE__ */ jsxs27("span", { className: "kds-price-period", children: [
|
|
2390
|
-
"/",
|
|
2391
|
-
period
|
|
2392
|
-
] })
|
|
2393
|
-
] }),
|
|
2394
|
-
badgeText && /* @__PURE__ */ jsx37("span", { className: "kds-card-plan-badge", children: badgeText }),
|
|
2395
|
-
features && features.length > 0 && /* @__PURE__ */ jsx37("ul", { className: "kds-card-plan-features", children: features.map((f, i) => /* @__PURE__ */ jsx37("li", { children: f }, i)) }),
|
|
2396
|
-
action
|
|
2397
|
-
]
|
|
3062
|
+
children
|
|
2398
3063
|
}
|
|
2399
3064
|
)
|
|
2400
3065
|
);
|
|
2401
|
-
|
|
3066
|
+
KdsCardPlanGroup.displayName = "KdsCardPlanGroup";
|
|
2402
3067
|
|
|
2403
3068
|
// src/components/domain/KdsInvoiceSticky/KdsInvoiceSticky.tsx
|
|
2404
|
-
import { forwardRef as
|
|
2405
|
-
import { jsx as
|
|
2406
|
-
var KdsInvoiceSticky =
|
|
2407
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
3069
|
+
import { forwardRef as forwardRef43 } from "react";
|
|
3070
|
+
import { jsx as jsx45 } from "react/jsx-runtime";
|
|
3071
|
+
var KdsInvoiceSticky = forwardRef43(
|
|
3072
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx45(
|
|
2408
3073
|
"article",
|
|
2409
3074
|
{
|
|
2410
3075
|
ref,
|
|
@@ -2417,39 +3082,39 @@ var KdsInvoiceSticky = forwardRef36(
|
|
|
2417
3082
|
KdsInvoiceSticky.displayName = "KdsInvoiceSticky";
|
|
2418
3083
|
|
|
2419
3084
|
// src/components/domain/KdsInvoiceHeaderSkeleton/KdsInvoiceHeaderSkeleton.tsx
|
|
2420
|
-
import { forwardRef as
|
|
2421
|
-
import { jsx as
|
|
2422
|
-
var Text = ({ children }) => /* @__PURE__ */
|
|
2423
|
-
var KdsInvoiceHeaderSkeleton =
|
|
2424
|
-
({ className, ...props }, ref) => /* @__PURE__ */
|
|
2425
|
-
/* @__PURE__ */
|
|
2426
|
-
/* @__PURE__ */
|
|
2427
|
-
/* @__PURE__ */
|
|
2428
|
-
/* @__PURE__ */
|
|
2429
|
-
/* @__PURE__ */
|
|
2430
|
-
/* @__PURE__ */
|
|
3085
|
+
import { forwardRef as forwardRef44 } from "react";
|
|
3086
|
+
import { jsx as jsx46, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
3087
|
+
var Text = ({ children }) => /* @__PURE__ */ jsx46("span", { className: "kds-skeleton kds-skeleton--text", children });
|
|
3088
|
+
var KdsInvoiceHeaderSkeleton = forwardRef44(
|
|
3089
|
+
({ className, ...props }, ref) => /* @__PURE__ */ jsxs35(KdsInvoiceSticky, { ref, className: clsx("kds-invoice-skeleton", className), "aria-hidden": "true", ...props, children: [
|
|
3090
|
+
/* @__PURE__ */ jsxs35("header", { className: "kds-invoice-header", children: [
|
|
3091
|
+
/* @__PURE__ */ jsxs35("div", { children: [
|
|
3092
|
+
/* @__PURE__ */ jsx46("p", { className: "kds-invoice-amount", children: /* @__PURE__ */ jsx46(Text, { children: "$00.000" }) }),
|
|
3093
|
+
/* @__PURE__ */ jsxs35("p", { className: "kds-invoice-code", children: [
|
|
3094
|
+
/* @__PURE__ */ jsx46("span", { children: /* @__PURE__ */ jsx46(Text, { children: "C\xF3digo" }) }),
|
|
3095
|
+
/* @__PURE__ */ jsx46("span", { className: "kds-invoice-code-value kds-invoice-code-value--lowercase", children: /* @__PURE__ */ jsx46(Text, { children: "xxxx-xxxx-xxxx" }) })
|
|
2431
3096
|
] })
|
|
2432
3097
|
] }),
|
|
2433
|
-
/* @__PURE__ */
|
|
3098
|
+
/* @__PURE__ */ jsx46("div", { className: "kds-invoice-merchant kds-skeleton" })
|
|
2434
3099
|
] }),
|
|
2435
|
-
/* @__PURE__ */
|
|
2436
|
-
/* @__PURE__ */
|
|
2437
|
-
/* @__PURE__ */
|
|
2438
|
-
/* @__PURE__ */
|
|
2439
|
-
/* @__PURE__ */
|
|
2440
|
-
/* @__PURE__ */
|
|
3100
|
+
/* @__PURE__ */ jsxs35("div", { className: "kds-invoice-collapsible", children: [
|
|
3101
|
+
/* @__PURE__ */ jsx46("div", { className: "kds-invoice-summary", children: /* @__PURE__ */ jsxs35("dl", { className: "kds-kv", children: [
|
|
3102
|
+
/* @__PURE__ */ jsx46("dt", { children: /* @__PURE__ */ jsx46(Text, { children: "Pago a" }) }),
|
|
3103
|
+
/* @__PURE__ */ jsx46("dd", { children: /* @__PURE__ */ jsx46(Text, { children: "Comercio de ejemplo SpA" }) }),
|
|
3104
|
+
/* @__PURE__ */ jsx46("dt", { children: /* @__PURE__ */ jsx46(Text, { children: "Asunto" }) }),
|
|
3105
|
+
/* @__PURE__ */ jsx46("dd", { children: /* @__PURE__ */ jsx46(Text, { children: "Orden de compra" }) })
|
|
2441
3106
|
] }) }),
|
|
2442
|
-
/* @__PURE__ */
|
|
3107
|
+
/* @__PURE__ */ jsx46("div", { className: "kds-expand-toggle", children: /* @__PURE__ */ jsx46("span", { children: /* @__PURE__ */ jsx46(Text, { children: "Detalle del cobro" }) }) })
|
|
2443
3108
|
] })
|
|
2444
3109
|
] })
|
|
2445
3110
|
);
|
|
2446
3111
|
KdsInvoiceHeaderSkeleton.displayName = "KdsInvoiceHeaderSkeleton";
|
|
2447
3112
|
|
|
2448
3113
|
// src/components/domain/KdsBottomSheet/KdsBottomSheet.tsx
|
|
2449
|
-
import { forwardRef as
|
|
3114
|
+
import { forwardRef as forwardRef45 } from "react";
|
|
2450
3115
|
import * as Dialog2 from "@radix-ui/react-dialog";
|
|
2451
|
-
import { jsx as
|
|
2452
|
-
var KdsBottomSheet =
|
|
3116
|
+
import { jsx as jsx47, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
3117
|
+
var KdsBottomSheet = forwardRef45(
|
|
2453
3118
|
({
|
|
2454
3119
|
open,
|
|
2455
3120
|
onClose,
|
|
@@ -2462,55 +3127,80 @@ var KdsBottomSheet = forwardRef38(
|
|
|
2462
3127
|
container,
|
|
2463
3128
|
className,
|
|
2464
3129
|
size = "auto",
|
|
3130
|
+
dismissible = true,
|
|
3131
|
+
variant = "sheet",
|
|
3132
|
+
align = "start",
|
|
3133
|
+
icon,
|
|
3134
|
+
hint,
|
|
2465
3135
|
...props
|
|
2466
|
-
}, ref) => /* @__PURE__ */
|
|
3136
|
+
}, ref) => /* @__PURE__ */ jsx47(
|
|
2467
3137
|
Dialog2.Root,
|
|
2468
3138
|
{
|
|
2469
3139
|
open,
|
|
2470
3140
|
onOpenChange: (o) => {
|
|
2471
3141
|
if (!o) onClose();
|
|
2472
3142
|
},
|
|
2473
|
-
children: /* @__PURE__ */
|
|
2474
|
-
Dialog2.
|
|
3143
|
+
children: /* @__PURE__ */ jsx47(Dialog2.Portal, { container, children: /* @__PURE__ */ jsx47("div", { className: "kds-theme-root", style: { display: "contents" }, children: /* @__PURE__ */ jsx47(
|
|
3144
|
+
Dialog2.Overlay,
|
|
2475
3145
|
{
|
|
2476
|
-
|
|
2477
|
-
|
|
2478
|
-
|
|
2479
|
-
|
|
2480
|
-
|
|
2481
|
-
|
|
2482
|
-
|
|
2483
|
-
|
|
2484
|
-
|
|
2485
|
-
|
|
2486
|
-
|
|
2487
|
-
|
|
2488
|
-
|
|
2489
|
-
|
|
2490
|
-
"
|
|
2491
|
-
|
|
2492
|
-
|
|
2493
|
-
|
|
2494
|
-
|
|
2495
|
-
|
|
2496
|
-
|
|
2497
|
-
|
|
2498
|
-
|
|
3146
|
+
className: clsx("kds-bottom-sheet-scrim", "open", variant === "dialog" && "kds-bottom-sheet-scrim--dialog"),
|
|
3147
|
+
children: /* @__PURE__ */ jsxs36(
|
|
3148
|
+
Dialog2.Content,
|
|
3149
|
+
{
|
|
3150
|
+
ref,
|
|
3151
|
+
className: clsx(
|
|
3152
|
+
"kds-bottom-sheet",
|
|
3153
|
+
size === "full" && "kds-bottom-sheet-full",
|
|
3154
|
+
variant === "dialog" && "kds-bottom-sheet--dialog",
|
|
3155
|
+
variant === "dialog" && align === "center" && "kds-bottom-sheet--center",
|
|
3156
|
+
className
|
|
3157
|
+
),
|
|
3158
|
+
onPointerDownOutside: (e) => {
|
|
3159
|
+
const target = e.target;
|
|
3160
|
+
if (!dismissible || target.closest(".kds-bottom-sheet")) e.preventDefault();
|
|
3161
|
+
},
|
|
3162
|
+
onEscapeKeyDown: (e) => {
|
|
3163
|
+
if (!dismissible) e.preventDefault();
|
|
3164
|
+
},
|
|
3165
|
+
onInteractOutside: (e) => {
|
|
3166
|
+
if (!dismissible) e.preventDefault();
|
|
3167
|
+
},
|
|
3168
|
+
...props,
|
|
3169
|
+
children: [
|
|
3170
|
+
showGrabber && dismissible && /* @__PURE__ */ jsx47("div", { className: "kds-bottom-sheet-grabber", "aria-hidden": "true" }),
|
|
3171
|
+
showCloseButton && dismissible && /* @__PURE__ */ jsx47(Dialog2.Close, { asChild: true, children: /* @__PURE__ */ jsx47(
|
|
3172
|
+
"button",
|
|
3173
|
+
{
|
|
3174
|
+
type: "button",
|
|
3175
|
+
className: "kds-bottom-sheet-close",
|
|
3176
|
+
"aria-label": "Cerrar",
|
|
3177
|
+
children: /* @__PURE__ */ jsx47("i", { className: "material-symbols-outlined", children: "close" })
|
|
3178
|
+
}
|
|
3179
|
+
) }),
|
|
3180
|
+
icon && /* @__PURE__ */ jsx47("div", { className: "kds-bottom-sheet-icon", children: icon }),
|
|
3181
|
+
title && /* @__PURE__ */ jsx47(Dialog2.Title, { className: "kds-bottom-sheet-title", children: title }),
|
|
3182
|
+
description && /* @__PURE__ */ jsx47(Dialog2.Description, { className: "kds-bottom-sheet-description", children: description }),
|
|
3183
|
+
/* @__PURE__ */ jsx47("div", { className: "kds-bottom-sheet-body", children }),
|
|
3184
|
+
hint && /* @__PURE__ */ jsx47("p", { className: "kds-bottom-sheet-hint", children: hint }),
|
|
3185
|
+
actions && /* @__PURE__ */ jsx47("div", { className: "kds-bottom-sheet-actions", children: actions })
|
|
3186
|
+
]
|
|
3187
|
+
}
|
|
3188
|
+
)
|
|
2499
3189
|
}
|
|
2500
|
-
) }) })
|
|
3190
|
+
) }) })
|
|
2501
3191
|
}
|
|
2502
3192
|
)
|
|
2503
3193
|
);
|
|
2504
3194
|
KdsBottomSheet.displayName = "KdsBottomSheet";
|
|
2505
3195
|
|
|
2506
3196
|
// src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
|
|
2507
|
-
import { forwardRef as
|
|
3197
|
+
import { forwardRef as forwardRef47 } from "react";
|
|
2508
3198
|
|
|
2509
3199
|
// src/components/domain/KdsSecureFooter/KhipuWordmark.tsx
|
|
2510
|
-
import { forwardRef as
|
|
2511
|
-
import { jsx as
|
|
2512
|
-
var KhipuWordmark =
|
|
2513
|
-
({ className = "khipu-mark", ...props }, ref) => /* @__PURE__ */
|
|
3200
|
+
import { forwardRef as forwardRef46 } from "react";
|
|
3201
|
+
import { jsx as jsx48, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
3202
|
+
var KhipuWordmark = forwardRef46(
|
|
3203
|
+
({ className = "khipu-mark", ...props }, ref) => /* @__PURE__ */ jsxs37(
|
|
2514
3204
|
"svg",
|
|
2515
3205
|
{
|
|
2516
3206
|
ref,
|
|
@@ -2521,14 +3211,14 @@ var KhipuWordmark = forwardRef39(
|
|
|
2521
3211
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2522
3212
|
...props,
|
|
2523
3213
|
children: [
|
|
2524
|
-
/* @__PURE__ */
|
|
2525
|
-
/* @__PURE__ */
|
|
2526
|
-
/* @__PURE__ */
|
|
2527
|
-
/* @__PURE__ */
|
|
2528
|
-
/* @__PURE__ */
|
|
2529
|
-
/* @__PURE__ */
|
|
2530
|
-
/* @__PURE__ */
|
|
2531
|
-
/* @__PURE__ */
|
|
3214
|
+
/* @__PURE__ */ jsx48("path", { d: "M16.6417 11.8339C16.7273 11.9196 16.8272 11.9624 16.9472 11.9624H18.9628C19.0798 11.9624 19.1826 11.9196 19.2682 11.8339C19.3539 11.7483 19.3967 11.6483 19.3967 11.5284V7.12891C19.3967 6.50081 19.3111 5.95551 19.1398 5.49586C18.9685 5.03621 18.7315 4.65937 18.4289 4.3596C18.1234 4.05983 17.758 3.83999 17.3326 3.69439C16.9043 3.55164 16.4361 3.47741 15.9251 3.47741C15.4226 3.47741 14.9801 3.58019 14.5975 3.7886C14.2121 3.99702 13.9295 4.214 13.7496 4.43668V1.03071C13.7496 0.913654 13.7068 0.810874 13.6211 0.728079C13.5355 0.642434 13.4355 0.599609 13.3185 0.599609H11.2943C11.1773 0.599609 11.0745 0.642434 10.9888 0.728079C10.9032 0.813729 10.8604 0.913654 10.8604 1.03071V11.5284C10.8604 11.6455 10.9032 11.7483 10.9888 11.8339C11.0745 11.9196 11.1744 11.9624 11.2943 11.9624H13.3099C13.427 11.9624 13.5298 11.9196 13.6126 11.8339C13.6982 11.7483 13.741 11.6483 13.741 11.5284V7.48006C13.741 7.02041 13.8495 6.65216 14.0693 6.37521C14.2892 6.09826 14.6375 5.95836 15.1171 5.95836C15.5968 5.95836 15.9479 6.09826 16.1735 6.37521C16.3961 6.65216 16.5103 7.02041 16.5103 7.48006V11.5284C16.5132 11.6483 16.556 11.7483 16.6417 11.8339Z", fill: "#8347AD" }),
|
|
3215
|
+
/* @__PURE__ */ jsx48("path", { d: "M23.6189 3.64014H21.6005C21.4834 3.64014 21.3806 3.68296 21.295 3.76861C21.2093 3.85426 21.1665 3.95418 21.1665 4.07124V11.5284C21.1665 11.6454 21.2093 11.7482 21.295 11.8339C21.3806 11.9195 21.4806 11.9623 21.6005 11.9623H23.6161C23.7331 11.9623 23.8359 11.9195 23.9187 11.8339C24.0044 11.7482 24.0472 11.6483 24.0472 11.5284V4.07124C24.0472 3.95418 24.0044 3.85141 23.9187 3.76861C23.8359 3.68296 23.736 3.64014 23.6189 3.64014Z", fill: "#8347AD" }),
|
|
3216
|
+
/* @__PURE__ */ jsx48("path", { d: "M34.1881 10.0723C34.3851 9.61264 34.4936 9.07019 34.5164 8.43924C34.5278 8.27934 34.5335 8.06239 34.5335 7.79114C34.5335 7.51994 34.5278 7.30294 34.5164 7.14309C34.4936 6.51499 34.3851 5.96969 34.1881 5.51004C33.9911 5.05039 33.7313 4.67068 33.4115 4.36519C33.0918 4.05971 32.7178 3.83702 32.2924 3.69427C31.8642 3.55152 31.4131 3.47729 30.9334 3.47729C30.5823 3.47729 30.2854 3.50584 30.0455 3.5658C29.8057 3.62575 29.603 3.69998 29.4374 3.78848C29.2718 3.87984 29.1348 3.98263 29.0206 4.09968C28.9093 4.21674 28.8036 4.32808 28.7094 4.43657V4.06828C28.7094 3.95122 28.6666 3.84844 28.5809 3.7628C28.4953 3.67715 28.3954 3.63432 28.2783 3.63432H26.3426C26.2256 3.63432 26.1228 3.67715 26.0372 3.7628C25.9515 3.84844 25.9087 3.94837 25.9087 4.06828V14.566C25.9087 14.683 25.9515 14.7858 26.0372 14.8715C26.1228 14.9571 26.2227 14.9999 26.3426 14.9999H28.3583C28.4753 14.9999 28.5781 14.9571 28.6637 14.8715C28.7494 14.7858 28.7922 14.6859 28.7922 14.566V11.1629C28.8664 11.2599 28.9635 11.3627 29.0806 11.474C29.1976 11.5854 29.3432 11.691 29.5117 11.7852C29.683 11.8823 29.8857 11.9622 30.1198 12.0251C30.3539 12.0879 30.6251 12.1221 30.9363 12.1221C31.4159 12.1221 31.8699 12.0479 32.2953 11.8994C32.7206 11.751 33.0946 11.5226 33.4144 11.22C33.7313 10.9145 33.9911 10.5319 34.1881 10.0723ZM31.65 8.24794C31.6186 8.62194 31.4959 8.94739 31.2817 9.22434C31.0676 9.50129 30.7107 9.64119 30.2083 9.64119C29.9742 9.64119 29.7715 9.60404 29.6002 9.52984C29.4289 9.45559 29.289 9.35569 29.1748 9.23289C29.0634 9.11014 28.9749 8.97309 28.9121 8.82464C28.8493 8.67619 28.8065 8.52204 28.7836 8.35929C28.7608 8.19939 28.7522 8.01384 28.7522 7.79974C28.7522 7.58559 28.7637 7.40004 28.7836 7.24014C28.8036 7.08029 28.8465 6.92609 28.9121 6.77479C28.9749 6.62634 29.0634 6.48929 29.1748 6.36654C29.2861 6.24374 29.4289 6.14384 29.6002 6.06959C29.7715 5.99539 29.9742 5.95824 30.2083 5.95824C30.7107 5.95824 31.0676 6.09814 31.2817 6.37509C31.4959 6.65204 31.6186 6.97749 31.65 7.35149C31.6843 7.65124 31.6843 7.95104 31.65 8.24794Z", fill: "#8347AD" }),
|
|
3217
|
+
/* @__PURE__ */ jsx48("path", { d: "M41.7481 11.8339C41.8337 11.9195 41.9337 11.9623 42.0536 11.9623H43.9093C44.0264 11.9623 44.1291 11.9195 44.2119 11.8339C44.2976 11.7482 44.3404 11.6483 44.3404 11.5284V4.07124C44.3404 3.95418 44.2976 3.85141 44.2119 3.76861C44.1263 3.68296 44.0264 3.64014 43.9093 3.64014H41.8937C41.7766 3.64014 41.6739 3.68296 41.5882 3.76861C41.5026 3.85426 41.4597 3.95418 41.4597 4.07124V8.1196C41.4597 8.57925 41.3598 8.94755 41.1628 9.22445C40.9658 9.5014 40.6318 9.6413 40.1636 9.6413C39.6954 9.6413 39.3585 9.5014 39.1558 9.22445C38.9531 8.94755 38.8503 8.57925 38.8503 8.1196V4.07124C38.8503 3.95418 38.8075 3.85141 38.7218 3.76861C38.6362 3.68296 38.5363 3.64014 38.4163 3.64014H36.4007C36.2837 3.64014 36.1809 3.68296 36.0953 3.76861C36.0096 3.85426 35.9668 3.95418 35.9668 4.07124V8.47075C35.9668 9.7298 36.2723 10.6519 36.8861 11.24C37.4999 11.8282 38.325 12.1194 39.3585 12.1194C39.6897 12.1194 39.9752 12.0908 40.215 12.0309C40.4548 11.9709 40.6661 11.8967 40.8459 11.8082C41.0286 11.7168 41.18 11.6169 41.3027 11.5027C41.4255 11.3914 41.5283 11.2772 41.6139 11.1601V11.5284C41.6196 11.6483 41.6624 11.7482 41.7481 11.8339Z", fill: "#8347AD" }),
|
|
3218
|
+
/* @__PURE__ */ jsx48("path", { d: "M22.5569 2.78074C21.7889 2.78074 21.1665 2.1555 21.1665 1.39037C21.1665 0.622385 21.7918 0 22.5569 0C23.3249 0 23.9473 0.62524 23.9473 1.39037C23.9501 2.1555 23.3249 2.78074 22.5569 2.78074Z", fill: "#3CB4E5" }),
|
|
3219
|
+
/* @__PURE__ */ jsx48("path", { d: "M3.1374 7.43996V4.78198L2.34372 5.77836C2.22095 5.93256 2.21524 6.14951 2.32944 6.31226L3.1374 7.43996Z", fill: "#743CEB" }),
|
|
3220
|
+
/* @__PURE__ */ jsx48("path", { d: "M2.96345 0.722369C2.88351 0.642434 2.78074 0.599609 2.66368 0.599609H0.40826C0.299771 0.599609 0.205557 0.639579 0.122763 0.722369C0.0428246 0.802309 0 0.905089 0 1.02214V11.557C0 11.6655 0.0399696 11.7597 0.122763 11.8425C0.202703 11.9224 0.299771 11.9652 0.40826 11.9652H2.66368C2.78359 11.9652 2.88351 11.9253 2.96345 11.8425C3.04339 11.7625 3.08622 11.6655 3.08622 11.557V8.41081L2.83783 8.08246L2.83212 8.07676L2.82642 8.06821L1.81576 6.65216C1.55024 6.28101 1.56166 5.76996 1.84716 5.41306L2.84069 4.16261L3.08622 3.84285V1.01929C3.08622 0.902234 3.04625 0.802309 2.96345 0.722369Z", fill: "#8347AD" }),
|
|
3221
|
+
/* @__PURE__ */ jsx48("path", { d: "M9.60962 11.9625C9.70667 11.9625 9.78947 11.9282 9.85227 11.8568C9.91797 11.7855 9.94937 11.7084 9.94937 11.6227C9.94937 11.5371 9.92652 11.4714 9.88367 11.4286L5.89242 6.0384L9.59247 1.13642C9.63532 1.08217 9.65812 1.01651 9.65812 0.942284C9.65812 0.856634 9.62387 0.776694 9.55252 0.708174C9.50967 0.665349 9.45832 0.633944 9.40407 0.616814C9.37267 0.608249 9.33552 0.602539 9.30127 0.602539H6.73752C6.56337 0.602539 6.42632 0.636799 6.32352 0.708174C6.22077 0.779549 6.14082 0.850924 6.08942 0.928009L3.32868 4.54525L2.32944 5.80145C2.27234 5.8728 2.24094 5.95845 2.24094 6.04695C2.23808 6.13545 2.26378 6.2211 2.31802 6.2982L2.83477 7.0205L3.32868 7.70855L6.29787 11.6199C6.32927 11.6627 6.39492 11.7312 6.49197 11.8226C6.55192 11.8797 6.63472 11.9197 6.73752 11.9425C6.80032 11.9568 6.86882 11.9625 6.94592 11.9625H9.60962Z", fill: "#3CB4E5" })
|
|
2532
3222
|
]
|
|
2533
3223
|
}
|
|
2534
3224
|
)
|
|
@@ -2536,17 +3226,17 @@ var KhipuWordmark = forwardRef39(
|
|
|
2536
3226
|
KhipuWordmark.displayName = "KhipuWordmark";
|
|
2537
3227
|
|
|
2538
3228
|
// src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
|
|
2539
|
-
import { Fragment as
|
|
2540
|
-
var KdsSecureFooter =
|
|
2541
|
-
({ variant = "default", showLogo = true, psp, children, className, ...props }, ref) => /* @__PURE__ */
|
|
2542
|
-
/* @__PURE__ */
|
|
2543
|
-
/* @__PURE__ */
|
|
2544
|
-
/* @__PURE__ */
|
|
3229
|
+
import { Fragment as Fragment6, jsx as jsx49, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
3230
|
+
var KdsSecureFooter = forwardRef47(
|
|
3231
|
+
({ variant = "default", showLogo = true, psp, children, className, ...props }, ref) => /* @__PURE__ */ jsxs38("footer", { ref, className: clsx("kds-secure-footer", variant === "inside" && "inside", className), ...props, children: [
|
|
3232
|
+
/* @__PURE__ */ jsxs38("svg", { className: "kds-secure-footer-lock", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
|
|
3233
|
+
/* @__PURE__ */ jsx49("rect", { x: "4.5", y: "10.5", width: "15", height: "10", rx: "2.25" }),
|
|
3234
|
+
/* @__PURE__ */ jsx49("path", { d: "M8 10.5V7a4 4 0 0 1 8 0v3.5" })
|
|
2545
3235
|
] }),
|
|
2546
|
-
children || /* @__PURE__ */
|
|
2547
|
-
showLogo && /* @__PURE__ */
|
|
2548
|
-
psp && /* @__PURE__ */
|
|
2549
|
-
/* @__PURE__ */
|
|
3236
|
+
children || /* @__PURE__ */ jsx49("span", { children: "Pago seguro procesado por" }),
|
|
3237
|
+
showLogo && /* @__PURE__ */ jsx49(KhipuWordmark, {}),
|
|
3238
|
+
psp && /* @__PURE__ */ jsxs38(Fragment6, { children: [
|
|
3239
|
+
/* @__PURE__ */ jsx49("span", { className: "kds-secure-footer-sep", "aria-hidden": "true" }),
|
|
2550
3240
|
psp
|
|
2551
3241
|
] })
|
|
2552
3242
|
] })
|
|
@@ -2554,44 +3244,44 @@ var KdsSecureFooter = forwardRef40(
|
|
|
2554
3244
|
KdsSecureFooter.displayName = "KdsSecureFooter";
|
|
2555
3245
|
|
|
2556
3246
|
// src/components/domain/KdsRecapList/KdsRecapList.tsx
|
|
2557
|
-
import { forwardRef as
|
|
2558
|
-
import { jsx as
|
|
2559
|
-
var KdsRecapList =
|
|
2560
|
-
({ items, className, ...props }, ref) => /* @__PURE__ */
|
|
2561
|
-
/* @__PURE__ */
|
|
2562
|
-
/* @__PURE__ */
|
|
3247
|
+
import { forwardRef as forwardRef48 } from "react";
|
|
3248
|
+
import { jsx as jsx50, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
3249
|
+
var KdsRecapList = forwardRef48(
|
|
3250
|
+
({ items, className, ...props }, ref) => /* @__PURE__ */ jsx50("ul", { ref, className: clsx("kds-recap-list", className), ...props, children: items.map((item, i) => /* @__PURE__ */ jsxs39("li", { children: [
|
|
3251
|
+
/* @__PURE__ */ jsx50("span", { className: "kds-key", children: item.label }),
|
|
3252
|
+
/* @__PURE__ */ jsx50("span", { className: clsx("kds-value", !item.value && item.placeholder && "placeholder"), children: item.value || item.placeholder || "-" })
|
|
2563
3253
|
] }, i)) })
|
|
2564
3254
|
);
|
|
2565
3255
|
KdsRecapList.displayName = "KdsRecapList";
|
|
2566
3256
|
|
|
2567
3257
|
// src/components/domain/KdsMontoRow/KdsMontoRow.tsx
|
|
2568
|
-
import { forwardRef as
|
|
2569
|
-
import { jsx as
|
|
2570
|
-
var KdsMontoRow =
|
|
2571
|
-
({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */
|
|
2572
|
-
/* @__PURE__ */
|
|
2573
|
-
/* @__PURE__ */
|
|
2574
|
-
deadline && /* @__PURE__ */
|
|
3258
|
+
import { forwardRef as forwardRef49 } from "react";
|
|
3259
|
+
import { jsx as jsx51, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
3260
|
+
var KdsMontoRow = forwardRef49(
|
|
3261
|
+
({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ jsxs40("div", { ref, className: clsx("kds-monto-row", className), ...props, children: [
|
|
3262
|
+
/* @__PURE__ */ jsxs40("div", { children: [
|
|
3263
|
+
/* @__PURE__ */ jsx51("div", { className: "kds-monto-row-title", children: title }),
|
|
3264
|
+
deadline && /* @__PURE__ */ jsx51("div", { className: "kds-monto-row-deadline", children: deadline })
|
|
2575
3265
|
] }),
|
|
2576
|
-
/* @__PURE__ */
|
|
3266
|
+
/* @__PURE__ */ jsx51("div", { className: "kds-monto-row-value", children: value })
|
|
2577
3267
|
] })
|
|
2578
3268
|
);
|
|
2579
3269
|
KdsMontoRow.displayName = "KdsMontoRow";
|
|
2580
3270
|
|
|
2581
3271
|
// src/components/domain/KdsMerchantTile/KdsMerchantTile.tsx
|
|
2582
|
-
import { forwardRef as
|
|
2583
|
-
import { jsx as
|
|
2584
|
-
var KdsMerchantTile =
|
|
3272
|
+
import { forwardRef as forwardRef50 } from "react";
|
|
3273
|
+
import { jsx as jsx52 } from "react/jsx-runtime";
|
|
3274
|
+
var KdsMerchantTile = forwardRef50(
|
|
2585
3275
|
({ name, logoUrl, initials, compact, className, ...props }, ref) => {
|
|
2586
3276
|
const displayInitials = (initials ?? name.slice(0, 2)).toUpperCase();
|
|
2587
|
-
return /* @__PURE__ */
|
|
3277
|
+
return /* @__PURE__ */ jsx52(
|
|
2588
3278
|
"div",
|
|
2589
3279
|
{
|
|
2590
3280
|
ref,
|
|
2591
3281
|
className: clsx("kds-merchant-tile", logoUrl && "logo", compact && "compact", className),
|
|
2592
3282
|
"aria-label": name,
|
|
2593
3283
|
...props,
|
|
2594
|
-
children: logoUrl ? /* @__PURE__ */
|
|
3284
|
+
children: logoUrl ? /* @__PURE__ */ jsx52("img", { src: logoUrl, alt: name }) : displayInitials
|
|
2595
3285
|
}
|
|
2596
3286
|
);
|
|
2597
3287
|
}
|
|
@@ -2599,10 +3289,10 @@ var KdsMerchantTile = forwardRef43(
|
|
|
2599
3289
|
KdsMerchantTile.displayName = "KdsMerchantTile";
|
|
2600
3290
|
|
|
2601
3291
|
// src/components/domain/KdsInvoiceMerchant/KdsInvoiceMerchant.tsx
|
|
2602
|
-
import { forwardRef as
|
|
3292
|
+
import { forwardRef as forwardRef51, useState as useState11 } from "react";
|
|
2603
3293
|
|
|
2604
3294
|
// src/components/domain/KdsInvoiceMerchant/useLogoBackdrop.ts
|
|
2605
|
-
import { useEffect as
|
|
3295
|
+
import { useEffect as useEffect7, useState as useState10 } from "react";
|
|
2606
3296
|
|
|
2607
3297
|
// src/components/domain/KdsInvoiceMerchant/logoLuminance.ts
|
|
2608
3298
|
var LIGHT_LOGO_LUMINANCE_THRESHOLD = 0.72;
|
|
@@ -2651,8 +3341,8 @@ function pickLogoBackdrop(luminance) {
|
|
|
2651
3341
|
|
|
2652
3342
|
// src/components/domain/KdsInvoiceMerchant/useLogoBackdrop.ts
|
|
2653
3343
|
function useLogoBackdrop(logoUrl) {
|
|
2654
|
-
const [backdrop, setBackdrop] =
|
|
2655
|
-
|
|
3344
|
+
const [backdrop, setBackdrop] = useState10("light");
|
|
3345
|
+
useEffect7(() => {
|
|
2656
3346
|
let cancelled = false;
|
|
2657
3347
|
setBackdrop("light");
|
|
2658
3348
|
if (!logoUrl) {
|
|
@@ -2671,13 +3361,13 @@ function useLogoBackdrop(logoUrl) {
|
|
|
2671
3361
|
}
|
|
2672
3362
|
|
|
2673
3363
|
// src/components/domain/KdsInvoiceMerchant/KdsInvoiceMerchant.tsx
|
|
2674
|
-
import { jsx as
|
|
2675
|
-
var KdsInvoiceMerchant =
|
|
3364
|
+
import { jsx as jsx53 } from "react/jsx-runtime";
|
|
3365
|
+
var KdsInvoiceMerchant = forwardRef51(
|
|
2676
3366
|
({ logoUrl, brandColor, className, style, ...props }, ref) => {
|
|
2677
|
-
const [failed, setFailed] =
|
|
3367
|
+
const [failed, setFailed] = useState11(false);
|
|
2678
3368
|
const showLogo = !!logoUrl && !failed;
|
|
2679
3369
|
const backdrop = useLogoBackdrop(showLogo ? logoUrl : void 0);
|
|
2680
|
-
return /* @__PURE__ */
|
|
3370
|
+
return /* @__PURE__ */ jsx53(
|
|
2681
3371
|
"div",
|
|
2682
3372
|
{
|
|
2683
3373
|
ref,
|
|
@@ -2690,7 +3380,7 @@ var KdsInvoiceMerchant = forwardRef44(
|
|
|
2690
3380
|
"aria-hidden": "true",
|
|
2691
3381
|
style: !showLogo && brandColor ? { background: brandColor, ...style } : style,
|
|
2692
3382
|
...props,
|
|
2693
|
-
children: showLogo ? /* @__PURE__ */
|
|
3383
|
+
children: showLogo ? /* @__PURE__ */ jsx53("img", { src: logoUrl, alt: "", onError: () => setFailed(true) }) : /* @__PURE__ */ jsx53("i", { className: "material-symbols-outlined", children: "storefront" })
|
|
2694
3384
|
}
|
|
2695
3385
|
);
|
|
2696
3386
|
}
|
|
@@ -2698,9 +3388,9 @@ var KdsInvoiceMerchant = forwardRef44(
|
|
|
2698
3388
|
KdsInvoiceMerchant.displayName = "KdsInvoiceMerchant";
|
|
2699
3389
|
|
|
2700
3390
|
// src/components/domain/KdsPaymentTotal/KdsPaymentTotal.tsx
|
|
2701
|
-
import { forwardRef as
|
|
2702
|
-
import { jsx as
|
|
2703
|
-
var KdsPaymentTotal =
|
|
3391
|
+
import { forwardRef as forwardRef52 } from "react";
|
|
3392
|
+
import { jsx as jsx54, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
3393
|
+
var KdsPaymentTotal = forwardRef52(
|
|
2704
3394
|
({
|
|
2705
3395
|
variant = "default",
|
|
2706
3396
|
tone = "brand",
|
|
@@ -2718,7 +3408,7 @@ var KdsPaymentTotal = forwardRef45(
|
|
|
2718
3408
|
const { integer, fraction } = formatAmount(amount, decimals, locale);
|
|
2719
3409
|
const isEmail = variant === "email";
|
|
2720
3410
|
const isInfoTone = tone === "info";
|
|
2721
|
-
return /* @__PURE__ */
|
|
3411
|
+
return /* @__PURE__ */ jsxs41(
|
|
2722
3412
|
"div",
|
|
2723
3413
|
{
|
|
2724
3414
|
ref,
|
|
@@ -2731,14 +3421,14 @@ var KdsPaymentTotal = forwardRef45(
|
|
|
2731
3421
|
),
|
|
2732
3422
|
...props,
|
|
2733
3423
|
children: [
|
|
2734
|
-
!isEmail && title != null && /* @__PURE__ */
|
|
2735
|
-
!isEmail && titleMobile != null && /* @__PURE__ */
|
|
2736
|
-
label != null && /* @__PURE__ */
|
|
2737
|
-
/* @__PURE__ */
|
|
3424
|
+
!isEmail && title != null && /* @__PURE__ */ jsx54("h5", { className: "kds-payment-total-title", children: title }),
|
|
3425
|
+
!isEmail && titleMobile != null && /* @__PURE__ */ jsx54("h5", { className: "kds-payment-total-title-mobile", children: titleMobile }),
|
|
3426
|
+
label != null && /* @__PURE__ */ jsx54("h6", { className: "kds-payment-label", children: label }),
|
|
3427
|
+
/* @__PURE__ */ jsxs41("h5", { className: "kds-payment-amount", children: [
|
|
2738
3428
|
currency,
|
|
2739
3429
|
" ",
|
|
2740
3430
|
integer,
|
|
2741
|
-
fraction !== null && /* @__PURE__ */
|
|
3431
|
+
fraction !== null && /* @__PURE__ */ jsx54("sup", { className: "kds-payment-total-decimal-sup", children: fraction })
|
|
2742
3432
|
] })
|
|
2743
3433
|
]
|
|
2744
3434
|
}
|
|
@@ -2774,10 +3464,10 @@ function formatAmount(amount, decimals, locale) {
|
|
|
2774
3464
|
}
|
|
2775
3465
|
|
|
2776
3466
|
// src/components/domain/KdsBillAttachment/KdsBillAttachment.tsx
|
|
2777
|
-
import { forwardRef as
|
|
2778
|
-
import { jsx as
|
|
2779
|
-
var KdsBillAttachment =
|
|
2780
|
-
({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */
|
|
3467
|
+
import { forwardRef as forwardRef53 } from "react";
|
|
3468
|
+
import { jsx as jsx55, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
3469
|
+
var KdsBillAttachment = forwardRef53(
|
|
3470
|
+
({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ jsxs42(
|
|
2781
3471
|
"a",
|
|
2782
3472
|
{
|
|
2783
3473
|
ref,
|
|
@@ -2787,15 +3477,15 @@ var KdsBillAttachment = forwardRef46(
|
|
|
2787
3477
|
className: clsx("kds-bill-attachment", className),
|
|
2788
3478
|
...props,
|
|
2789
3479
|
children: [
|
|
2790
|
-
/* @__PURE__ */
|
|
2791
|
-
/* @__PURE__ */
|
|
3480
|
+
/* @__PURE__ */ jsx55("i", { className: "material-symbols-outlined", children: icon }),
|
|
3481
|
+
/* @__PURE__ */ jsx55("span", { children: filename })
|
|
2792
3482
|
]
|
|
2793
3483
|
}
|
|
2794
3484
|
)
|
|
2795
3485
|
);
|
|
2796
3486
|
KdsBillAttachment.displayName = "KdsBillAttachment";
|
|
2797
|
-
var KdsBillAttachments =
|
|
2798
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
3487
|
+
var KdsBillAttachments = forwardRef53(
|
|
3488
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx55("div", { ref, className: clsx("kds-bill-attachments", className), ...props, children })
|
|
2799
3489
|
);
|
|
2800
3490
|
KdsBillAttachments.displayName = "KdsBillAttachments";
|
|
2801
3491
|
|
|
@@ -2894,12 +3584,12 @@ var guideToFirstInvalidFieldOnBlur = (form) => {
|
|
|
2894
3584
|
};
|
|
2895
3585
|
|
|
2896
3586
|
// src/components/core/hooks/useStickyInvoiceCollapse.ts
|
|
2897
|
-
import { useEffect as
|
|
3587
|
+
import { useEffect as useEffect8, useRef as useRef7 } from "react";
|
|
2898
3588
|
function useStickyInvoiceCollapse(options = {}) {
|
|
2899
3589
|
const { onCollapseStart, collapseEnd = 20, mobileBreakpoint = 768 } = options;
|
|
2900
|
-
const onCollapseStartRef =
|
|
3590
|
+
const onCollapseStartRef = useRef7(onCollapseStart);
|
|
2901
3591
|
onCollapseStartRef.current = onCollapseStart;
|
|
2902
|
-
|
|
3592
|
+
useEffect8(() => {
|
|
2903
3593
|
let viewportOffset = 0;
|
|
2904
3594
|
let ticking = false;
|
|
2905
3595
|
let wasCollapsing = false;
|
|
@@ -2972,16 +3662,16 @@ function useStickyInvoiceCollapse(options = {}) {
|
|
|
2972
3662
|
}
|
|
2973
3663
|
|
|
2974
3664
|
// src/components/core/hooks/useExpandToggle.ts
|
|
2975
|
-
import { useCallback as
|
|
3665
|
+
import { useCallback as useCallback5, useId as useId7, useLayoutEffect, useRef as useRef8, useState as useState12 } from "react";
|
|
2976
3666
|
function useExpandToggle(options = {}) {
|
|
2977
3667
|
const { defaultOpen = false, open: controlledOpen, onOpenChange, id } = options;
|
|
2978
|
-
const generatedId =
|
|
3668
|
+
const generatedId = useId7();
|
|
2979
3669
|
const panelId = id ?? `kds-expand-${generatedId}`;
|
|
2980
3670
|
const isControlled = controlledOpen !== void 0;
|
|
2981
|
-
const [uncontrolledOpen, setUncontrolledOpen] =
|
|
3671
|
+
const [uncontrolledOpen, setUncontrolledOpen] = useState12(defaultOpen);
|
|
2982
3672
|
const open = isControlled ? controlledOpen : uncontrolledOpen;
|
|
2983
|
-
const panelRef =
|
|
2984
|
-
const setPanelRef =
|
|
3673
|
+
const panelRef = useRef8(null);
|
|
3674
|
+
const setPanelRef = useCallback5((node) => {
|
|
2985
3675
|
panelRef.current = node;
|
|
2986
3676
|
}, []);
|
|
2987
3677
|
useLayoutEffect(() => {
|
|
@@ -2989,7 +3679,7 @@ function useExpandToggle(options = {}) {
|
|
|
2989
3679
|
if (!panel) return;
|
|
2990
3680
|
panel.style.maxHeight = open ? `${panel.scrollHeight}px` : "";
|
|
2991
3681
|
}, [open]);
|
|
2992
|
-
const setOpen =
|
|
3682
|
+
const setOpen = useCallback5(
|
|
2993
3683
|
(next) => {
|
|
2994
3684
|
if (!isControlled) {
|
|
2995
3685
|
setUncontrolledOpen(next);
|
|
@@ -2998,8 +3688,8 @@ function useExpandToggle(options = {}) {
|
|
|
2998
3688
|
},
|
|
2999
3689
|
[isControlled, onOpenChange]
|
|
3000
3690
|
);
|
|
3001
|
-
const toggle =
|
|
3002
|
-
const getToggleProps =
|
|
3691
|
+
const toggle = useCallback5(() => setOpen(!open), [open, setOpen]);
|
|
3692
|
+
const getToggleProps = useCallback5(
|
|
3003
3693
|
() => ({
|
|
3004
3694
|
type: "button",
|
|
3005
3695
|
"aria-expanded": open,
|
|
@@ -3008,7 +3698,7 @@ function useExpandToggle(options = {}) {
|
|
|
3008
3698
|
}),
|
|
3009
3699
|
[open, panelId, toggle]
|
|
3010
3700
|
);
|
|
3011
|
-
const getPanelProps =
|
|
3701
|
+
const getPanelProps = useCallback5(
|
|
3012
3702
|
(baseClassName = "kds-expand-panel") => ({
|
|
3013
3703
|
id: panelId,
|
|
3014
3704
|
className: open ? `${baseClassName} open` : baseClassName,
|
|
@@ -3020,11 +3710,11 @@ function useExpandToggle(options = {}) {
|
|
|
3020
3710
|
}
|
|
3021
3711
|
|
|
3022
3712
|
// src/components/core/hooks/useHideOnScroll.ts
|
|
3023
|
-
import { useEffect as
|
|
3713
|
+
import { useEffect as useEffect9, useState as useState13 } from "react";
|
|
3024
3714
|
function useHideOnScroll(options = {}) {
|
|
3025
3715
|
const { threshold = 8, topOffset = 0 } = options;
|
|
3026
|
-
const [hidden, setHidden] =
|
|
3027
|
-
|
|
3716
|
+
const [hidden, setHidden] = useState13(false);
|
|
3717
|
+
useEffect9(() => {
|
|
3028
3718
|
let viewportOffset = 0;
|
|
3029
3719
|
let lastY = 0;
|
|
3030
3720
|
let ticking = false;
|
|
@@ -3067,12 +3757,12 @@ function useHideOnScroll(options = {}) {
|
|
|
3067
3757
|
}
|
|
3068
3758
|
|
|
3069
3759
|
// src/components/core/hooks/useMediaQuery.ts
|
|
3070
|
-
import { useEffect as
|
|
3760
|
+
import { useEffect as useEffect10, useState as useState14 } from "react";
|
|
3071
3761
|
function useMediaQuery(query) {
|
|
3072
|
-
const [matches, setMatches] =
|
|
3762
|
+
const [matches, setMatches] = useState14(
|
|
3073
3763
|
() => typeof window !== "undefined" ? window.matchMedia(query).matches : false
|
|
3074
3764
|
);
|
|
3075
|
-
|
|
3765
|
+
useEffect10(() => {
|
|
3076
3766
|
if (typeof window === "undefined") return;
|
|
3077
3767
|
const mql = window.matchMedia(query);
|
|
3078
3768
|
setMatches(mql.matches);
|
|
@@ -3100,9 +3790,13 @@ export {
|
|
|
3100
3790
|
KdsCardFooter,
|
|
3101
3791
|
KdsCardHeader,
|
|
3102
3792
|
KdsCardPlan,
|
|
3793
|
+
KdsCardPlanGroup,
|
|
3103
3794
|
KdsCardSelector,
|
|
3795
|
+
KdsCardSelectorGroup,
|
|
3104
3796
|
KdsCheckbox,
|
|
3105
3797
|
KdsChip,
|
|
3798
|
+
KdsConsentCard,
|
|
3799
|
+
KdsContract,
|
|
3106
3800
|
KdsCopyButton,
|
|
3107
3801
|
KdsCopyRow,
|
|
3108
3802
|
KdsCopyableTable,
|
|
@@ -3112,13 +3806,17 @@ export {
|
|
|
3112
3806
|
KdsEmptyState,
|
|
3113
3807
|
KdsExpandPanel,
|
|
3114
3808
|
KdsFab,
|
|
3809
|
+
KdsFeedbackCard,
|
|
3810
|
+
KdsFooter,
|
|
3115
3811
|
KdsInvoiceHeaderSkeleton,
|
|
3116
3812
|
KdsInvoiceMerchant,
|
|
3117
3813
|
KdsInvoiceSticky,
|
|
3118
3814
|
KdsLinearProgress,
|
|
3119
3815
|
KdsMerchantTile,
|
|
3120
3816
|
KdsMontoRow,
|
|
3817
|
+
KdsNavbar,
|
|
3121
3818
|
KdsPaymentTotal,
|
|
3819
|
+
KdsProgressChecklist,
|
|
3122
3820
|
KdsQrRow,
|
|
3123
3821
|
KdsRadioGroup,
|
|
3124
3822
|
KdsRecapList,
|
|
@@ -3128,6 +3826,7 @@ export {
|
|
|
3128
3826
|
KdsSecureLoader,
|
|
3129
3827
|
KdsSegmentedTabs,
|
|
3130
3828
|
KdsSelect,
|
|
3829
|
+
KdsSidebar,
|
|
3131
3830
|
KdsSnackbar,
|
|
3132
3831
|
KdsSpinner,
|
|
3133
3832
|
KdsStatusBlock,
|