@khipu/design-system 0.2.0-alpha.136 → 0.2.0-alpha.137
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/arch.svg +1 -0
- package/dist/beercss/arrow.svg +1 -0
- package/dist/beercss/boom.svg +1 -0
- package/dist/beercss/bun.svg +1 -0
- package/dist/beercss/burst.svg +1 -0
- package/dist/beercss/circle.svg +1 -0
- package/dist/beercss/clamshell.svg +1 -0
- package/dist/beercss/diamond.svg +1 -0
- package/dist/beercss/fan.svg +1 -0
- package/dist/beercss/flower.svg +1 -0
- package/dist/beercss/gem.svg +1 -0
- package/dist/beercss/ghost-ish.svg +1 -0
- package/dist/beercss/heart.svg +1 -0
- package/dist/beercss/khipu-beercss.css +45 -3
- package/dist/beercss/khipu-beercss.min.css +1 -1
- package/dist/beercss/khipu-beercss.scoped.css +45 -3
- package/dist/beercss/khipu-beercss.scoped.min.css +1 -1
- package/dist/beercss/leaf-clover4.svg +1 -0
- package/dist/beercss/leaf-clover8.svg +1 -0
- package/dist/beercss/loading-indicator.svg +1 -0
- package/dist/beercss/material-symbols-outlined.woff2 +0 -0
- package/dist/beercss/material-symbols-rounded.woff2 +0 -0
- package/dist/beercss/material-symbols-sharp.woff2 +0 -0
- package/dist/beercss/material-symbols-subset.woff2 +0 -0
- package/dist/beercss/metadata.json +5 -5
- package/dist/beercss/oval.svg +1 -0
- package/dist/beercss/pentagon.svg +1 -0
- package/dist/beercss/pill.svg +1 -0
- package/dist/beercss/pixel-circle.svg +1 -0
- package/dist/beercss/pixel-triangle.svg +1 -0
- package/dist/beercss/puffy-diamond.svg +1 -0
- package/dist/beercss/puffy.svg +1 -0
- package/dist/beercss/semicircle.svg +1 -0
- package/dist/beercss/sided-cookie12.svg +1 -0
- package/dist/beercss/sided-cookie4.svg +1 -0
- package/dist/beercss/sided-cookie6.svg +1 -0
- package/dist/beercss/sided-cookie7.svg +1 -0
- package/dist/beercss/sided-cookie9.svg +1 -0
- package/dist/beercss/slanted.svg +1 -0
- package/dist/beercss/soft-boom.svg +1 -0
- package/dist/beercss/soft-burst.svg +1 -0
- package/dist/beercss/square.svg +1 -0
- package/dist/beercss/sunny.svg +1 -0
- package/dist/beercss/triangle.svg +1 -0
- package/dist/beercss/very-sunny.svg +1 -0
- package/dist/beercss/wavy-circle.svg +1 -0
- package/dist/beercss/wavy.svg +1 -0
- package/dist/index.d.mts +31 -1
- package/dist/index.d.ts +31 -1
- package/dist/index.js +176 -151
- package/dist/index.mjs +151 -127
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -54,6 +54,7 @@ __export(index_exports, {
|
|
|
54
54
|
KdsCopyableTable: () => KdsCopyableTable,
|
|
55
55
|
KdsCountdown: () => KdsCountdown,
|
|
56
56
|
KdsDivider: () => KdsDivider,
|
|
57
|
+
KdsEmptyState: () => KdsEmptyState,
|
|
57
58
|
KdsExpandPanel: () => KdsExpandPanel,
|
|
58
59
|
KdsFab: () => KdsFab,
|
|
59
60
|
KdsInvoiceMerchant: () => KdsInvoiceMerchant,
|
|
@@ -2326,13 +2327,36 @@ var KdsFab = (0, import_react31.forwardRef)(
|
|
|
2326
2327
|
);
|
|
2327
2328
|
KdsFab.displayName = "KdsFab";
|
|
2328
2329
|
|
|
2329
|
-
// src/components/
|
|
2330
|
+
// src/components/core/KdsEmptyState/KdsEmptyState.tsx
|
|
2330
2331
|
var import_react32 = require("react");
|
|
2331
2332
|
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
2332
|
-
var
|
|
2333
|
+
var KdsEmptyState = (0, import_react32.forwardRef)(
|
|
2334
|
+
({ icon = "hide_source", title, description, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
2335
|
+
"div",
|
|
2336
|
+
{
|
|
2337
|
+
ref,
|
|
2338
|
+
role: "status",
|
|
2339
|
+
className: (0, import_clsx.clsx)("kds-empty-state", className),
|
|
2340
|
+
...props,
|
|
2341
|
+
children: [
|
|
2342
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: icon }),
|
|
2343
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "kds-empty-state-text", children: [
|
|
2344
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(KdsTypography, { variant: "body", color: "primary", children: title }),
|
|
2345
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(KdsTypography, { variant: "body", color: "secondary", children: description })
|
|
2346
|
+
] })
|
|
2347
|
+
]
|
|
2348
|
+
}
|
|
2349
|
+
)
|
|
2350
|
+
);
|
|
2351
|
+
KdsEmptyState.displayName = "KdsEmptyState";
|
|
2352
|
+
|
|
2353
|
+
// src/components/domain/KdsBankRow/KdsBankRow.tsx
|
|
2354
|
+
var import_react33 = require("react");
|
|
2355
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
2356
|
+
var KdsBankRow = (0, import_react33.forwardRef)(
|
|
2333
2357
|
({ name, logoUrl, selected, hideLogo, className, ...props }, ref) => {
|
|
2334
2358
|
const nameStr = typeof name === "string" ? name : "";
|
|
2335
|
-
return /* @__PURE__ */ (0,
|
|
2359
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
2336
2360
|
"button",
|
|
2337
2361
|
{
|
|
2338
2362
|
ref,
|
|
@@ -2340,9 +2364,9 @@ var KdsBankRow = (0, import_react32.forwardRef)(
|
|
|
2340
2364
|
className: (0, import_clsx.clsx)("kds-bank-row", selected && "selected", className),
|
|
2341
2365
|
...props,
|
|
2342
2366
|
children: [
|
|
2343
|
-
!hideLogo && /* @__PURE__ */ (0,
|
|
2344
|
-
/* @__PURE__ */ (0,
|
|
2345
|
-
/* @__PURE__ */ (0,
|
|
2367
|
+
!hideLogo && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "kds-bank-row-logo", children: logoUrl ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("img", { src: logoUrl, alt: nameStr }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "initials", children: nameStr.charAt(0) }) }),
|
|
2368
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "kds-bank-row-name", children: name }),
|
|
2369
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("i", { className: "material-symbols-outlined", children: selected ? "check_circle" : "chevron_right" })
|
|
2346
2370
|
]
|
|
2347
2371
|
}
|
|
2348
2372
|
);
|
|
@@ -2351,32 +2375,32 @@ var KdsBankRow = (0, import_react32.forwardRef)(
|
|
|
2351
2375
|
KdsBankRow.displayName = "KdsBankRow";
|
|
2352
2376
|
|
|
2353
2377
|
// src/components/domain/KdsBankList/KdsBankList.tsx
|
|
2354
|
-
var
|
|
2355
|
-
var
|
|
2356
|
-
var KdsBankList = (0,
|
|
2357
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2378
|
+
var import_react34 = require("react");
|
|
2379
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
2380
|
+
var KdsBankList = (0, import_react34.forwardRef)(
|
|
2381
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { ref, className: (0, import_clsx.clsx)("kds-bank-list", className), role: "list", ...props, children })
|
|
2358
2382
|
);
|
|
2359
2383
|
KdsBankList.displayName = "KdsBankList";
|
|
2360
2384
|
|
|
2361
2385
|
// src/components/domain/KdsBankModal/KdsBankModal.tsx
|
|
2362
|
-
var
|
|
2386
|
+
var import_react35 = require("react");
|
|
2363
2387
|
var Dialog = __toESM(require("@radix-ui/react-dialog"));
|
|
2364
|
-
var
|
|
2365
|
-
var KdsBankModal = (0,
|
|
2388
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
2389
|
+
var KdsBankModal = (0, import_react35.forwardRef)(
|
|
2366
2390
|
({ open, onClose, title = "Selecciona tu banco", searchPlaceholder = "Buscar banco...", onSearch, children, className, container }, ref) => {
|
|
2367
|
-
const [query, setQuery] = (0,
|
|
2391
|
+
const [query, setQuery] = (0, import_react35.useState)("");
|
|
2368
2392
|
const handleSearch = (value) => {
|
|
2369
2393
|
setQuery(value);
|
|
2370
2394
|
onSearch?.(value);
|
|
2371
2395
|
};
|
|
2372
|
-
return /* @__PURE__ */ (0,
|
|
2396
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Dialog.Root, { open, onOpenChange: (o) => {
|
|
2373
2397
|
if (!o) onClose();
|
|
2374
|
-
}, children: /* @__PURE__ */ (0,
|
|
2375
|
-
/* @__PURE__ */ (0,
|
|
2376
|
-
/* @__PURE__ */ (0,
|
|
2377
|
-
/* @__PURE__ */ (0,
|
|
2398
|
+
}, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Dialog.Portal, { container, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Dialog.Overlay, { className: "kds-bank-modal-scrim open", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(Dialog.Content, { ref, className: (0, import_clsx.clsx)("kds-bank-modal", className), children: [
|
|
2399
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "kds-bank-modal-header", children: [
|
|
2400
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Dialog.Title, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("h3", { children: title }) }),
|
|
2401
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("button", { className: "kds-bank-modal-close", "aria-label": "Cerrar", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("i", { className: "material-symbols-outlined", children: "close" }) }) })
|
|
2378
2402
|
] }),
|
|
2379
|
-
/* @__PURE__ */ (0,
|
|
2403
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "kds-bank-modal-search", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
2380
2404
|
KdsSearchField,
|
|
2381
2405
|
{
|
|
2382
2406
|
placeholder: searchPlaceholder,
|
|
@@ -2384,33 +2408,33 @@ var KdsBankModal = (0, import_react34.forwardRef)(
|
|
|
2384
2408
|
onChange: (e) => handleSearch(e.target.value)
|
|
2385
2409
|
}
|
|
2386
2410
|
) }),
|
|
2387
|
-
/* @__PURE__ */ (0,
|
|
2411
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "kds-bank-modal-body", children })
|
|
2388
2412
|
] }) }) }) });
|
|
2389
2413
|
}
|
|
2390
2414
|
);
|
|
2391
2415
|
KdsBankModal.displayName = "KdsBankModal";
|
|
2392
2416
|
|
|
2393
2417
|
// src/components/domain/KdsQrRow/KdsQrRow.tsx
|
|
2394
|
-
var
|
|
2395
|
-
var
|
|
2396
|
-
var KdsQrRow = (0,
|
|
2397
|
-
({ name, description, badge, icon = "qr_code_2", className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2398
|
-
/* @__PURE__ */ (0,
|
|
2399
|
-
/* @__PURE__ */ (0,
|
|
2400
|
-
/* @__PURE__ */ (0,
|
|
2401
|
-
description && /* @__PURE__ */ (0,
|
|
2418
|
+
var import_react36 = require("react");
|
|
2419
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
2420
|
+
var KdsQrRow = (0, import_react36.forwardRef)(
|
|
2421
|
+
({ name, description, badge, icon = "qr_code_2", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("button", { ref, type: "button", className: (0, import_clsx.clsx)("kds-qr-row", className), ...props, children: [
|
|
2422
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "kds-qr-avatar", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("i", { className: "material-symbols-outlined", children: icon }) }),
|
|
2423
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: "kds-qr-text", children: [
|
|
2424
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "kds-qr-title", children: name }),
|
|
2425
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "kds-qr-subtitle", children: description })
|
|
2402
2426
|
] }),
|
|
2403
|
-
badge && /* @__PURE__ */ (0,
|
|
2404
|
-
/* @__PURE__ */ (0,
|
|
2427
|
+
badge && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "kds-qr-badge", children: badge }),
|
|
2428
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("i", { className: "material-symbols-outlined", children: "chevron_right" })
|
|
2405
2429
|
] })
|
|
2406
2430
|
);
|
|
2407
2431
|
KdsQrRow.displayName = "KdsQrRow";
|
|
2408
2432
|
|
|
2409
2433
|
// src/components/domain/KdsCardSelector/KdsCardSelector.tsx
|
|
2410
|
-
var
|
|
2411
|
-
var
|
|
2412
|
-
var KdsCardSelector = (0,
|
|
2413
|
-
({ icon, title, description, selected, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2434
|
+
var import_react37 = require("react");
|
|
2435
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
2436
|
+
var KdsCardSelector = (0, import_react37.forwardRef)(
|
|
2437
|
+
({ icon, title, description, selected, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
2414
2438
|
"button",
|
|
2415
2439
|
{
|
|
2416
2440
|
ref,
|
|
@@ -2418,9 +2442,9 @@ var KdsCardSelector = (0, import_react36.forwardRef)(
|
|
|
2418
2442
|
className: (0, import_clsx.clsx)("kds-card-selector", selected && "selected", className),
|
|
2419
2443
|
...props,
|
|
2420
2444
|
children: [
|
|
2421
|
-
icon && /* @__PURE__ */ (0,
|
|
2422
|
-
/* @__PURE__ */ (0,
|
|
2423
|
-
description && /* @__PURE__ */ (0,
|
|
2445
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "kds-card-selector-icon", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("i", { className: "material-symbols-outlined", children: icon }) }),
|
|
2446
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "kds-card-selector-title", children: title }),
|
|
2447
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "kds-card-selector-description", children: description })
|
|
2424
2448
|
]
|
|
2425
2449
|
}
|
|
2426
2450
|
)
|
|
@@ -2428,26 +2452,26 @@ var KdsCardSelector = (0, import_react36.forwardRef)(
|
|
|
2428
2452
|
KdsCardSelector.displayName = "KdsCardSelector";
|
|
2429
2453
|
|
|
2430
2454
|
// src/components/domain/KdsCardPlan/KdsCardPlan.tsx
|
|
2431
|
-
var
|
|
2432
|
-
var
|
|
2433
|
-
var KdsCardPlan = (0,
|
|
2434
|
-
({ title, price, period, features, recommended, badgeText, action, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2455
|
+
var import_react38 = require("react");
|
|
2456
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
2457
|
+
var KdsCardPlan = (0, import_react38.forwardRef)(
|
|
2458
|
+
({ title, price, period, features, recommended, badgeText, action, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2435
2459
|
"div",
|
|
2436
2460
|
{
|
|
2437
2461
|
ref,
|
|
2438
2462
|
className: (0, import_clsx.clsx)("kds-card-plan", recommended && "recommended", className),
|
|
2439
2463
|
...props,
|
|
2440
2464
|
children: [
|
|
2441
|
-
/* @__PURE__ */ (0,
|
|
2442
|
-
/* @__PURE__ */ (0,
|
|
2443
|
-
/* @__PURE__ */ (0,
|
|
2444
|
-
period && /* @__PURE__ */ (0,
|
|
2465
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "kds-card-plan-header", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h3", { children: title }) }),
|
|
2466
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "kds-card-plan-price", children: [
|
|
2467
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "kds-price", children: price }),
|
|
2468
|
+
period && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("span", { className: "kds-price-period", children: [
|
|
2445
2469
|
"/",
|
|
2446
2470
|
period
|
|
2447
2471
|
] })
|
|
2448
2472
|
] }),
|
|
2449
|
-
badgeText && /* @__PURE__ */ (0,
|
|
2450
|
-
features && features.length > 0 && /* @__PURE__ */ (0,
|
|
2473
|
+
badgeText && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "kds-card-plan-badge", children: badgeText }),
|
|
2474
|
+
features && features.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("ul", { className: "kds-card-plan-features", children: features.map((f, i) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("li", { children: f }, i)) }),
|
|
2451
2475
|
action
|
|
2452
2476
|
]
|
|
2453
2477
|
}
|
|
@@ -2456,10 +2480,10 @@ var KdsCardPlan = (0, import_react37.forwardRef)(
|
|
|
2456
2480
|
KdsCardPlan.displayName = "KdsCardPlan";
|
|
2457
2481
|
|
|
2458
2482
|
// src/components/domain/KdsInvoiceSticky/KdsInvoiceSticky.tsx
|
|
2459
|
-
var
|
|
2460
|
-
var
|
|
2461
|
-
var KdsInvoiceSticky = (0,
|
|
2462
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2483
|
+
var import_react39 = require("react");
|
|
2484
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2485
|
+
var KdsInvoiceSticky = (0, import_react39.forwardRef)(
|
|
2486
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
2463
2487
|
"article",
|
|
2464
2488
|
{
|
|
2465
2489
|
ref,
|
|
@@ -2472,10 +2496,10 @@ var KdsInvoiceSticky = (0, import_react38.forwardRef)(
|
|
|
2472
2496
|
KdsInvoiceSticky.displayName = "KdsInvoiceSticky";
|
|
2473
2497
|
|
|
2474
2498
|
// src/components/domain/KdsBottomSheet/KdsBottomSheet.tsx
|
|
2475
|
-
var
|
|
2499
|
+
var import_react40 = require("react");
|
|
2476
2500
|
var Dialog2 = __toESM(require("@radix-ui/react-dialog"));
|
|
2477
|
-
var
|
|
2478
|
-
var KdsBottomSheet = (0,
|
|
2501
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2502
|
+
var KdsBottomSheet = (0, import_react40.forwardRef)(
|
|
2479
2503
|
({
|
|
2480
2504
|
open,
|
|
2481
2505
|
onClose,
|
|
@@ -2488,14 +2512,14 @@ var KdsBottomSheet = (0, import_react39.forwardRef)(
|
|
|
2488
2512
|
container,
|
|
2489
2513
|
className,
|
|
2490
2514
|
...props
|
|
2491
|
-
}, ref) => /* @__PURE__ */ (0,
|
|
2515
|
+
}, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2492
2516
|
Dialog2.Root,
|
|
2493
2517
|
{
|
|
2494
2518
|
open,
|
|
2495
2519
|
onOpenChange: (o) => {
|
|
2496
2520
|
if (!o) onClose();
|
|
2497
2521
|
},
|
|
2498
|
-
children: /* @__PURE__ */ (0,
|
|
2522
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Dialog2.Portal, { container, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "kds-theme-root", style: { display: "contents" }, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Dialog2.Overlay, { className: "kds-bottom-sheet-scrim open", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
2499
2523
|
Dialog2.Content,
|
|
2500
2524
|
{
|
|
2501
2525
|
ref,
|
|
@@ -2506,20 +2530,20 @@ var KdsBottomSheet = (0, import_react39.forwardRef)(
|
|
|
2506
2530
|
},
|
|
2507
2531
|
...props,
|
|
2508
2532
|
children: [
|
|
2509
|
-
showGrabber && /* @__PURE__ */ (0,
|
|
2510
|
-
showCloseButton && /* @__PURE__ */ (0,
|
|
2533
|
+
showGrabber && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "kds-bottom-sheet-grabber", "aria-hidden": "true" }),
|
|
2534
|
+
showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Dialog2.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2511
2535
|
"button",
|
|
2512
2536
|
{
|
|
2513
2537
|
type: "button",
|
|
2514
2538
|
className: "kds-bottom-sheet-close",
|
|
2515
2539
|
"aria-label": "Cerrar",
|
|
2516
|
-
children: /* @__PURE__ */ (0,
|
|
2540
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("i", { className: "material-symbols-outlined", children: "close" })
|
|
2517
2541
|
}
|
|
2518
2542
|
) }),
|
|
2519
|
-
title && /* @__PURE__ */ (0,
|
|
2520
|
-
description && /* @__PURE__ */ (0,
|
|
2521
|
-
/* @__PURE__ */ (0,
|
|
2522
|
-
actions && /* @__PURE__ */ (0,
|
|
2543
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Dialog2.Title, { className: "kds-bottom-sheet-title", children: title }),
|
|
2544
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Dialog2.Description, { className: "kds-bottom-sheet-description", children: description }),
|
|
2545
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "kds-bottom-sheet-body", children }),
|
|
2546
|
+
actions && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "kds-bottom-sheet-actions", children: actions })
|
|
2523
2547
|
]
|
|
2524
2548
|
}
|
|
2525
2549
|
) }) }) })
|
|
@@ -2529,13 +2553,13 @@ var KdsBottomSheet = (0, import_react39.forwardRef)(
|
|
|
2529
2553
|
KdsBottomSheet.displayName = "KdsBottomSheet";
|
|
2530
2554
|
|
|
2531
2555
|
// src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
|
|
2532
|
-
var
|
|
2556
|
+
var import_react42 = require("react");
|
|
2533
2557
|
|
|
2534
2558
|
// src/components/domain/KdsSecureFooter/KhipuWordmark.tsx
|
|
2535
|
-
var
|
|
2536
|
-
var
|
|
2537
|
-
var KhipuWordmark = (0,
|
|
2538
|
-
({ className = "khipu-mark", ...props }, ref) => /* @__PURE__ */ (0,
|
|
2559
|
+
var import_react41 = require("react");
|
|
2560
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2561
|
+
var KhipuWordmark = (0, import_react41.forwardRef)(
|
|
2562
|
+
({ className = "khipu-mark", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
2539
2563
|
"svg",
|
|
2540
2564
|
{
|
|
2541
2565
|
ref,
|
|
@@ -2546,14 +2570,14 @@ var KhipuWordmark = (0, import_react40.forwardRef)(
|
|
|
2546
2570
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2547
2571
|
...props,
|
|
2548
2572
|
children: [
|
|
2549
|
-
/* @__PURE__ */ (0,
|
|
2550
|
-
/* @__PURE__ */ (0,
|
|
2551
|
-
/* @__PURE__ */ (0,
|
|
2552
|
-
/* @__PURE__ */ (0,
|
|
2553
|
-
/* @__PURE__ */ (0,
|
|
2554
|
-
/* @__PURE__ */ (0,
|
|
2555
|
-
/* @__PURE__ */ (0,
|
|
2556
|
-
/* @__PURE__ */ (0,
|
|
2573
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2574
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2575
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2576
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2577
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2578
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2579
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" }),
|
|
2580
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("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" })
|
|
2557
2581
|
]
|
|
2558
2582
|
}
|
|
2559
2583
|
)
|
|
@@ -2561,17 +2585,17 @@ var KhipuWordmark = (0, import_react40.forwardRef)(
|
|
|
2561
2585
|
KhipuWordmark.displayName = "KhipuWordmark";
|
|
2562
2586
|
|
|
2563
2587
|
// src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
|
|
2564
|
-
var
|
|
2565
|
-
var KdsSecureFooter = (0,
|
|
2566
|
-
({ variant = "default", showLogo = true, psp, children, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2567
|
-
/* @__PURE__ */ (0,
|
|
2568
|
-
/* @__PURE__ */ (0,
|
|
2569
|
-
/* @__PURE__ */ (0,
|
|
2588
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2589
|
+
var KdsSecureFooter = (0, import_react42.forwardRef)(
|
|
2590
|
+
({ variant = "default", showLogo = true, psp, children, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("footer", { ref, className: (0, import_clsx.clsx)("kds-secure-footer", variant === "inside" && "inside", className), ...props, children: [
|
|
2591
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("svg", { className: "kds-secure-footer-lock", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
|
|
2592
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("rect", { x: "4.5", y: "10.5", width: "15", height: "10", rx: "2.25" }),
|
|
2593
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { d: "M8 10.5V7a4 4 0 0 1 8 0v3.5" })
|
|
2570
2594
|
] }),
|
|
2571
|
-
children || /* @__PURE__ */ (0,
|
|
2572
|
-
showLogo && /* @__PURE__ */ (0,
|
|
2573
|
-
psp && /* @__PURE__ */ (0,
|
|
2574
|
-
/* @__PURE__ */ (0,
|
|
2595
|
+
children || /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { children: "Pago seguro procesado por" }),
|
|
2596
|
+
showLogo && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(KhipuWordmark, {}),
|
|
2597
|
+
psp && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
2598
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "kds-secure-footer-sep", "aria-hidden": "true" }),
|
|
2575
2599
|
psp
|
|
2576
2600
|
] })
|
|
2577
2601
|
] })
|
|
@@ -2579,44 +2603,44 @@ var KdsSecureFooter = (0, import_react41.forwardRef)(
|
|
|
2579
2603
|
KdsSecureFooter.displayName = "KdsSecureFooter";
|
|
2580
2604
|
|
|
2581
2605
|
// src/components/domain/KdsRecapList/KdsRecapList.tsx
|
|
2582
|
-
var
|
|
2583
|
-
var
|
|
2584
|
-
var KdsRecapList = (0,
|
|
2585
|
-
({ items, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2586
|
-
/* @__PURE__ */ (0,
|
|
2587
|
-
/* @__PURE__ */ (0,
|
|
2606
|
+
var import_react43 = require("react");
|
|
2607
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2608
|
+
var KdsRecapList = (0, import_react43.forwardRef)(
|
|
2609
|
+
({ items, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("ul", { ref, className: (0, import_clsx.clsx)("kds-recap-list", className), ...props, children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("li", { children: [
|
|
2610
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "kds-key", children: item.label }),
|
|
2611
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: (0, import_clsx.clsx)("kds-value", !item.value && item.placeholder && "placeholder"), children: item.value || item.placeholder || "-" })
|
|
2588
2612
|
] }, i)) })
|
|
2589
2613
|
);
|
|
2590
2614
|
KdsRecapList.displayName = "KdsRecapList";
|
|
2591
2615
|
|
|
2592
2616
|
// src/components/domain/KdsMontoRow/KdsMontoRow.tsx
|
|
2593
|
-
var
|
|
2594
|
-
var
|
|
2595
|
-
var KdsMontoRow = (0,
|
|
2596
|
-
({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2597
|
-
/* @__PURE__ */ (0,
|
|
2598
|
-
/* @__PURE__ */ (0,
|
|
2599
|
-
deadline && /* @__PURE__ */ (0,
|
|
2617
|
+
var import_react44 = require("react");
|
|
2618
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2619
|
+
var KdsMontoRow = (0, import_react44.forwardRef)(
|
|
2620
|
+
({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { ref, className: (0, import_clsx.clsx)("kds-monto-row", className), ...props, children: [
|
|
2621
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { children: [
|
|
2622
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "kds-monto-row-title", children: title }),
|
|
2623
|
+
deadline && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "kds-monto-row-deadline", children: deadline })
|
|
2600
2624
|
] }),
|
|
2601
|
-
/* @__PURE__ */ (0,
|
|
2625
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "kds-monto-row-value", children: value })
|
|
2602
2626
|
] })
|
|
2603
2627
|
);
|
|
2604
2628
|
KdsMontoRow.displayName = "KdsMontoRow";
|
|
2605
2629
|
|
|
2606
2630
|
// src/components/domain/KdsMerchantTile/KdsMerchantTile.tsx
|
|
2607
|
-
var
|
|
2608
|
-
var
|
|
2609
|
-
var KdsMerchantTile = (0,
|
|
2631
|
+
var import_react45 = require("react");
|
|
2632
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2633
|
+
var KdsMerchantTile = (0, import_react45.forwardRef)(
|
|
2610
2634
|
({ name, logoUrl, initials, compact, className, ...props }, ref) => {
|
|
2611
2635
|
const displayInitials = (initials ?? name.slice(0, 2)).toUpperCase();
|
|
2612
|
-
return /* @__PURE__ */ (0,
|
|
2636
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
2613
2637
|
"div",
|
|
2614
2638
|
{
|
|
2615
2639
|
ref,
|
|
2616
2640
|
className: (0, import_clsx.clsx)("kds-merchant-tile", logoUrl && "logo", compact && "compact", className),
|
|
2617
2641
|
"aria-label": name,
|
|
2618
2642
|
...props,
|
|
2619
|
-
children: logoUrl ? /* @__PURE__ */ (0,
|
|
2643
|
+
children: logoUrl ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("img", { src: logoUrl, alt: name }) : displayInitials
|
|
2620
2644
|
}
|
|
2621
2645
|
);
|
|
2622
2646
|
}
|
|
@@ -2624,10 +2648,10 @@ var KdsMerchantTile = (0, import_react44.forwardRef)(
|
|
|
2624
2648
|
KdsMerchantTile.displayName = "KdsMerchantTile";
|
|
2625
2649
|
|
|
2626
2650
|
// src/components/domain/KdsInvoiceMerchant/KdsInvoiceMerchant.tsx
|
|
2627
|
-
var
|
|
2651
|
+
var import_react47 = require("react");
|
|
2628
2652
|
|
|
2629
2653
|
// src/components/domain/KdsInvoiceMerchant/useLogoBackdrop.ts
|
|
2630
|
-
var
|
|
2654
|
+
var import_react46 = require("react");
|
|
2631
2655
|
|
|
2632
2656
|
// src/components/domain/KdsInvoiceMerchant/logoLuminance.ts
|
|
2633
2657
|
var LIGHT_LOGO_LUMINANCE_THRESHOLD = 0.72;
|
|
@@ -2676,8 +2700,8 @@ function pickLogoBackdrop(luminance) {
|
|
|
2676
2700
|
|
|
2677
2701
|
// src/components/domain/KdsInvoiceMerchant/useLogoBackdrop.ts
|
|
2678
2702
|
function useLogoBackdrop(logoUrl) {
|
|
2679
|
-
const [backdrop, setBackdrop] = (0,
|
|
2680
|
-
(0,
|
|
2703
|
+
const [backdrop, setBackdrop] = (0, import_react46.useState)("light");
|
|
2704
|
+
(0, import_react46.useEffect)(() => {
|
|
2681
2705
|
let cancelled = false;
|
|
2682
2706
|
setBackdrop("light");
|
|
2683
2707
|
if (!logoUrl) {
|
|
@@ -2696,13 +2720,13 @@ function useLogoBackdrop(logoUrl) {
|
|
|
2696
2720
|
}
|
|
2697
2721
|
|
|
2698
2722
|
// src/components/domain/KdsInvoiceMerchant/KdsInvoiceMerchant.tsx
|
|
2699
|
-
var
|
|
2700
|
-
var KdsInvoiceMerchant = (0,
|
|
2723
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2724
|
+
var KdsInvoiceMerchant = (0, import_react47.forwardRef)(
|
|
2701
2725
|
({ logoUrl, brandColor, className, style, ...props }, ref) => {
|
|
2702
|
-
const [failed, setFailed] = (0,
|
|
2726
|
+
const [failed, setFailed] = (0, import_react47.useState)(false);
|
|
2703
2727
|
const showLogo = !!logoUrl && !failed;
|
|
2704
2728
|
const backdrop = useLogoBackdrop(showLogo ? logoUrl : void 0);
|
|
2705
|
-
return /* @__PURE__ */ (0,
|
|
2729
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
2706
2730
|
"div",
|
|
2707
2731
|
{
|
|
2708
2732
|
ref,
|
|
@@ -2715,7 +2739,7 @@ var KdsInvoiceMerchant = (0, import_react46.forwardRef)(
|
|
|
2715
2739
|
"aria-hidden": "true",
|
|
2716
2740
|
style: !showLogo && brandColor ? { background: brandColor, ...style } : style,
|
|
2717
2741
|
...props,
|
|
2718
|
-
children: showLogo ? /* @__PURE__ */ (0,
|
|
2742
|
+
children: showLogo ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("img", { src: logoUrl, alt: "", onError: () => setFailed(true) }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("i", { className: "material-symbols-outlined", children: "storefront" })
|
|
2719
2743
|
}
|
|
2720
2744
|
);
|
|
2721
2745
|
}
|
|
@@ -2723,9 +2747,9 @@ var KdsInvoiceMerchant = (0, import_react46.forwardRef)(
|
|
|
2723
2747
|
KdsInvoiceMerchant.displayName = "KdsInvoiceMerchant";
|
|
2724
2748
|
|
|
2725
2749
|
// src/components/domain/KdsPaymentTotal/KdsPaymentTotal.tsx
|
|
2726
|
-
var
|
|
2727
|
-
var
|
|
2728
|
-
var KdsPaymentTotal = (0,
|
|
2750
|
+
var import_react48 = require("react");
|
|
2751
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2752
|
+
var KdsPaymentTotal = (0, import_react48.forwardRef)(
|
|
2729
2753
|
({
|
|
2730
2754
|
variant = "default",
|
|
2731
2755
|
tone = "brand",
|
|
@@ -2743,7 +2767,7 @@ var KdsPaymentTotal = (0, import_react47.forwardRef)(
|
|
|
2743
2767
|
const { integer, fraction } = formatAmount(amount, decimals, locale);
|
|
2744
2768
|
const isEmail = variant === "email";
|
|
2745
2769
|
const isInfoTone = tone === "info";
|
|
2746
|
-
return /* @__PURE__ */ (0,
|
|
2770
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
2747
2771
|
"div",
|
|
2748
2772
|
{
|
|
2749
2773
|
ref,
|
|
@@ -2756,14 +2780,14 @@ var KdsPaymentTotal = (0, import_react47.forwardRef)(
|
|
|
2756
2780
|
),
|
|
2757
2781
|
...props,
|
|
2758
2782
|
children: [
|
|
2759
|
-
!isEmail && title != null && /* @__PURE__ */ (0,
|
|
2760
|
-
!isEmail && titleMobile != null && /* @__PURE__ */ (0,
|
|
2761
|
-
label != null && /* @__PURE__ */ (0,
|
|
2762
|
-
/* @__PURE__ */ (0,
|
|
2783
|
+
!isEmail && title != null && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("h5", { className: "kds-payment-total-title", children: title }),
|
|
2784
|
+
!isEmail && titleMobile != null && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("h5", { className: "kds-payment-total-title-mobile", children: titleMobile }),
|
|
2785
|
+
label != null && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("h6", { className: "kds-payment-label", children: label }),
|
|
2786
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("h5", { className: "kds-payment-amount", children: [
|
|
2763
2787
|
currency,
|
|
2764
2788
|
" ",
|
|
2765
2789
|
integer,
|
|
2766
|
-
fraction !== null && /* @__PURE__ */ (0,
|
|
2790
|
+
fraction !== null && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("sup", { className: "kds-payment-total-decimal-sup", children: fraction })
|
|
2767
2791
|
] })
|
|
2768
2792
|
]
|
|
2769
2793
|
}
|
|
@@ -2799,10 +2823,10 @@ function formatAmount(amount, decimals, locale) {
|
|
|
2799
2823
|
}
|
|
2800
2824
|
|
|
2801
2825
|
// src/components/domain/KdsBillAttachment/KdsBillAttachment.tsx
|
|
2802
|
-
var
|
|
2803
|
-
var
|
|
2804
|
-
var KdsBillAttachment = (0,
|
|
2805
|
-
({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2826
|
+
var import_react49 = require("react");
|
|
2827
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
2828
|
+
var KdsBillAttachment = (0, import_react49.forwardRef)(
|
|
2829
|
+
({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
|
|
2806
2830
|
"a",
|
|
2807
2831
|
{
|
|
2808
2832
|
ref,
|
|
@@ -2812,15 +2836,15 @@ var KdsBillAttachment = (0, import_react48.forwardRef)(
|
|
|
2812
2836
|
className: (0, import_clsx.clsx)("kds-bill-attachment", className),
|
|
2813
2837
|
...props,
|
|
2814
2838
|
children: [
|
|
2815
|
-
/* @__PURE__ */ (0,
|
|
2816
|
-
/* @__PURE__ */ (0,
|
|
2839
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("i", { className: "material-symbols-outlined", children: icon }),
|
|
2840
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children: filename })
|
|
2817
2841
|
]
|
|
2818
2842
|
}
|
|
2819
2843
|
)
|
|
2820
2844
|
);
|
|
2821
2845
|
KdsBillAttachment.displayName = "KdsBillAttachment";
|
|
2822
|
-
var KdsBillAttachments = (0,
|
|
2823
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2846
|
+
var KdsBillAttachments = (0, import_react49.forwardRef)(
|
|
2847
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { ref, className: (0, import_clsx.clsx)("kds-bill-attachments", className), ...props, children })
|
|
2824
2848
|
);
|
|
2825
2849
|
KdsBillAttachments.displayName = "KdsBillAttachments";
|
|
2826
2850
|
|
|
@@ -2919,12 +2943,12 @@ var guideToFirstInvalidFieldOnBlur = (form) => {
|
|
|
2919
2943
|
};
|
|
2920
2944
|
|
|
2921
2945
|
// src/components/core/hooks/useStickyInvoiceCollapse.ts
|
|
2922
|
-
var
|
|
2946
|
+
var import_react50 = require("react");
|
|
2923
2947
|
function useStickyInvoiceCollapse(options = {}) {
|
|
2924
2948
|
const { onCollapseStart, collapseEnd = 20, mobileBreakpoint = 768 } = options;
|
|
2925
|
-
const onCollapseStartRef = (0,
|
|
2949
|
+
const onCollapseStartRef = (0, import_react50.useRef)(onCollapseStart);
|
|
2926
2950
|
onCollapseStartRef.current = onCollapseStart;
|
|
2927
|
-
(0,
|
|
2951
|
+
(0, import_react50.useEffect)(() => {
|
|
2928
2952
|
let viewportOffset = 0;
|
|
2929
2953
|
let ticking = false;
|
|
2930
2954
|
let wasCollapsing = false;
|
|
@@ -2997,24 +3021,24 @@ function useStickyInvoiceCollapse(options = {}) {
|
|
|
2997
3021
|
}
|
|
2998
3022
|
|
|
2999
3023
|
// src/components/core/hooks/useExpandToggle.ts
|
|
3000
|
-
var
|
|
3024
|
+
var import_react51 = require("react");
|
|
3001
3025
|
function useExpandToggle(options = {}) {
|
|
3002
3026
|
const { defaultOpen = false, open: controlledOpen, onOpenChange, id } = options;
|
|
3003
|
-
const generatedId = (0,
|
|
3027
|
+
const generatedId = (0, import_react51.useId)();
|
|
3004
3028
|
const panelId = id ?? `kds-expand-${generatedId}`;
|
|
3005
3029
|
const isControlled = controlledOpen !== void 0;
|
|
3006
|
-
const [uncontrolledOpen, setUncontrolledOpen] = (0,
|
|
3030
|
+
const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react51.useState)(defaultOpen);
|
|
3007
3031
|
const open = isControlled ? controlledOpen : uncontrolledOpen;
|
|
3008
|
-
const panelRef = (0,
|
|
3009
|
-
const setPanelRef = (0,
|
|
3032
|
+
const panelRef = (0, import_react51.useRef)(null);
|
|
3033
|
+
const setPanelRef = (0, import_react51.useCallback)((node) => {
|
|
3010
3034
|
panelRef.current = node;
|
|
3011
3035
|
}, []);
|
|
3012
|
-
(0,
|
|
3036
|
+
(0, import_react51.useLayoutEffect)(() => {
|
|
3013
3037
|
const panel = panelRef.current;
|
|
3014
3038
|
if (!panel) return;
|
|
3015
3039
|
panel.style.maxHeight = open ? `${panel.scrollHeight}px` : "";
|
|
3016
3040
|
}, [open]);
|
|
3017
|
-
const setOpen = (0,
|
|
3041
|
+
const setOpen = (0, import_react51.useCallback)(
|
|
3018
3042
|
(next) => {
|
|
3019
3043
|
if (!isControlled) {
|
|
3020
3044
|
setUncontrolledOpen(next);
|
|
@@ -3023,8 +3047,8 @@ function useExpandToggle(options = {}) {
|
|
|
3023
3047
|
},
|
|
3024
3048
|
[isControlled, onOpenChange]
|
|
3025
3049
|
);
|
|
3026
|
-
const toggle = (0,
|
|
3027
|
-
const getToggleProps = (0,
|
|
3050
|
+
const toggle = (0, import_react51.useCallback)(() => setOpen(!open), [open, setOpen]);
|
|
3051
|
+
const getToggleProps = (0, import_react51.useCallback)(
|
|
3028
3052
|
() => ({
|
|
3029
3053
|
type: "button",
|
|
3030
3054
|
"aria-expanded": open,
|
|
@@ -3033,7 +3057,7 @@ function useExpandToggle(options = {}) {
|
|
|
3033
3057
|
}),
|
|
3034
3058
|
[open, panelId, toggle]
|
|
3035
3059
|
);
|
|
3036
|
-
const getPanelProps = (0,
|
|
3060
|
+
const getPanelProps = (0, import_react51.useCallback)(
|
|
3037
3061
|
(baseClassName = "kds-expand-panel") => ({
|
|
3038
3062
|
id: panelId,
|
|
3039
3063
|
className: open ? `${baseClassName} open` : baseClassName,
|
|
@@ -3046,11 +3070,11 @@ function useExpandToggle(options = {}) {
|
|
|
3046
3070
|
}
|
|
3047
3071
|
|
|
3048
3072
|
// src/components/core/hooks/useHideOnScroll.ts
|
|
3049
|
-
var
|
|
3073
|
+
var import_react52 = require("react");
|
|
3050
3074
|
function useHideOnScroll(options = {}) {
|
|
3051
3075
|
const { threshold = 8, topOffset = 0 } = options;
|
|
3052
|
-
const [hidden, setHidden] = (0,
|
|
3053
|
-
(0,
|
|
3076
|
+
const [hidden, setHidden] = (0, import_react52.useState)(false);
|
|
3077
|
+
(0, import_react52.useEffect)(() => {
|
|
3054
3078
|
let viewportOffset = 0;
|
|
3055
3079
|
let lastY = 0;
|
|
3056
3080
|
let ticking = false;
|
|
@@ -3093,12 +3117,12 @@ function useHideOnScroll(options = {}) {
|
|
|
3093
3117
|
}
|
|
3094
3118
|
|
|
3095
3119
|
// src/components/core/hooks/useMediaQuery.ts
|
|
3096
|
-
var
|
|
3120
|
+
var import_react53 = require("react");
|
|
3097
3121
|
function useMediaQuery(query) {
|
|
3098
|
-
const [matches, setMatches] = (0,
|
|
3122
|
+
const [matches, setMatches] = (0, import_react53.useState)(
|
|
3099
3123
|
() => typeof window !== "undefined" ? window.matchMedia(query).matches : false
|
|
3100
3124
|
);
|
|
3101
|
-
(0,
|
|
3125
|
+
(0, import_react53.useEffect)(() => {
|
|
3102
3126
|
if (typeof window === "undefined") return;
|
|
3103
3127
|
const mql = window.matchMedia(query);
|
|
3104
3128
|
setMatches(mql.matches);
|
|
@@ -3134,6 +3158,7 @@ function useMediaQuery(query) {
|
|
|
3134
3158
|
KdsCopyableTable,
|
|
3135
3159
|
KdsCountdown,
|
|
3136
3160
|
KdsDivider,
|
|
3161
|
+
KdsEmptyState,
|
|
3137
3162
|
KdsExpandPanel,
|
|
3138
3163
|
KdsFab,
|
|
3139
3164
|
KdsInvoiceMerchant,
|