@khipu/design-system 0.3.5-alpha.29 → 0.3.5-alpha.30
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 +65 -1
- package/dist/beercss/khipu-beercss.min.css +1 -1
- package/dist/beercss/khipu-beercss.scoped.css +65 -1
- package/dist/beercss/khipu-beercss.scoped.min.css +1 -1
- package/dist/beercss/metadata.json +5 -5
- package/dist/index.d.mts +18 -2
- package/dist/index.d.ts +18 -2
- package/dist/index.js +125 -100
- package/dist/index.mjs +101 -77
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@khipu/design-system/beercss",
|
|
3
|
-
"version": "0.3.5-alpha.
|
|
3
|
+
"version": "0.3.5-alpha.30",
|
|
4
4
|
"description": "Khipu BeerCSS bundle with Material Design 3 and Khipu customizations",
|
|
5
|
-
"buildDate": "2026-10-
|
|
5
|
+
"buildDate": "2026-10-06T20:11:27.836Z",
|
|
6
6
|
"includes": {
|
|
7
7
|
"beercss": "4.0.1",
|
|
8
8
|
"khipu-tokens": "latest",
|
|
@@ -19,8 +19,8 @@
|
|
|
19
19
|
},
|
|
20
20
|
"scopeClass": ".kds-theme-root",
|
|
21
21
|
"cdn": {
|
|
22
|
-
"css": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.
|
|
23
|
-
"cssScoped": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.
|
|
24
|
-
"js": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.
|
|
22
|
+
"css": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.30/dist/beercss/khipu-beercss.min.css",
|
|
23
|
+
"cssScoped": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.30/dist/beercss/khipu-beercss.scoped.min.css",
|
|
24
|
+
"js": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.30/dist/beercss/khipu-beercss.min.js"
|
|
25
25
|
}
|
|
26
26
|
}
|
package/dist/index.d.mts
CHANGED
|
@@ -29,7 +29,7 @@ interface KdsThemeProviderProps {
|
|
|
29
29
|
*/
|
|
30
30
|
declare function KdsThemeProvider({ primaryColor, mode, children }: KdsThemeProviderProps): react_jsx_runtime.JSX.Element;
|
|
31
31
|
|
|
32
|
-
declare const KDS_VERSION = "0.3.5-alpha.
|
|
32
|
+
declare const KDS_VERSION = "0.3.5-alpha.30";
|
|
33
33
|
|
|
34
34
|
/**
|
|
35
35
|
* Color tokens organized by theme mode
|
|
@@ -3492,6 +3492,22 @@ interface KdsInvoiceStickyProps extends React__default.HTMLAttributes<HTMLElemen
|
|
|
3492
3492
|
}
|
|
3493
3493
|
declare const KdsInvoiceSticky: React__default.ForwardRefExoticComponent<KdsInvoiceStickyProps & React__default.RefAttributes<HTMLElement>>;
|
|
3494
3494
|
|
|
3495
|
+
/**
|
|
3496
|
+
* Khipu Design System - InvoiceHeaderSkeleton Component
|
|
3497
|
+
*
|
|
3498
|
+
* Placeholder del header de la factura (KdsInvoiceSticky) mientras sus datos no llegan:
|
|
3499
|
+
* monto, código, tile del comercio y el resumen "pago a / asunto". Replica el markup del
|
|
3500
|
+
* header real con bloques `.kds-skeleton` dentro de los mismos elementos, así cada caja
|
|
3501
|
+
* mide lo mismo y el reemplazo por el header real no desplaza el layout.
|
|
3502
|
+
*
|
|
3503
|
+
* Va dentro de `.kds-invoice-sticky-wrap`, igual que el header real. Es decorativo
|
|
3504
|
+
* (`aria-hidden`): el estado de carga lo anuncia el loader del body card.
|
|
3505
|
+
*/
|
|
3506
|
+
|
|
3507
|
+
interface KdsInvoiceHeaderSkeletonProps extends React__default.HTMLAttributes<HTMLElement> {
|
|
3508
|
+
}
|
|
3509
|
+
declare const KdsInvoiceHeaderSkeleton: React__default.ForwardRefExoticComponent<KdsInvoiceHeaderSkeletonProps & React__default.RefAttributes<HTMLElement>>;
|
|
3510
|
+
|
|
3495
3511
|
/**
|
|
3496
3512
|
* Khipu Design System - BottomSheet Component
|
|
3497
3513
|
*
|
|
@@ -4092,4 +4108,4 @@ declare function formatDate(iso?: string): string;
|
|
|
4092
4108
|
*/
|
|
4093
4109
|
declare function formatTime(iso?: string): string;
|
|
4094
4110
|
|
|
4095
|
-
export { type Colors, type ExpandPanelProps, type ExpandToggleProps, KDS_VERSION, KdsAccordion, KdsAccordionDetails, type KdsAccordionDetailsProps, type KdsAccordionProps, KdsAccordionSummary, type KdsAccordionSummaryProps, KdsAlert, type KdsAlertProps, type KdsAlertSeverity, KdsBankList, type KdsBankListProps, KdsBankModal, type KdsBankModalProps, KdsBankRow, type KdsBankRowProps, KdsBillAttachment, type KdsBillAttachmentProps, KdsBillAttachments, type KdsBillAttachmentsProps, KdsBottomSheet, type KdsBottomSheetProps, KdsButton, type KdsButtonProps, type KdsButtonSize, type KdsButtonVariant, KdsCard, KdsCardBody, KdsCardFooter, KdsCardHeader, KdsCardPlan, type KdsCardPlanProps, type KdsCardProps, type KdsCardSectionProps, KdsCardSelector, type KdsCardSelectorProps, type KdsCardVariant, KdsCheckbox, type KdsCheckboxProps, KdsChip, type KdsChipColor, type KdsChipProps, KdsCopyButton, type KdsCopyButtonProps, KdsCopyRow, type KdsCopyRowProps, KdsCopyableTable, type KdsCopyableTableProps, type KdsCopyableTableRow, KdsCountdown, type KdsCountdownProps, KdsDivider, type KdsDividerProps, KdsDocumentFrame, type KdsDocumentFrameProps, KdsEmptyState, type KdsEmptyStateProps, KdsExpandPanel, type KdsExpandPanelProps, KdsFab, type KdsFabPosition, type KdsFabProps, KdsInvoiceMerchant, type KdsInvoiceMerchantProps, KdsInvoiceSticky, type KdsInvoiceStickyProps, KdsLinearProgress, type KdsLinearProgressProps, KdsMerchantTile, type KdsMerchantTileProps, KdsMontoRow, type KdsMontoRowProps, KdsPaymentTotal, type KdsPaymentTotalProps, type KdsPaymentTotalVariant, KdsQrRow, type KdsQrRowProps, KdsRadioGroup, type KdsRadioGroupProps, type KdsRadioOption, type KdsRecapItem, KdsRecapList, type KdsRecapListProps, KdsSearchField, type KdsSearchFieldProps, KdsSectionNote, type KdsSectionNoteProps, KdsSecureFooter, type KdsSecureFooterProps, KdsSecureLoader, type KdsSecureLoaderProps, KdsSegmentedTabs, type KdsSegmentedTabsProps, KdsSelect, type KdsSelectOption, type KdsSelectProps, KdsSnackbar, type KdsSnackbarProps, type KdsSnackbarType, KdsSpinner, type KdsSpinnerProps, type KdsSpinnerSize, KdsStatusBlock, type KdsStatusBlockProps, type KdsStatusType, KdsStepper, type KdsStepperProps, KdsTab, KdsTabPanel, type KdsTabPanelProps, type KdsTabProps, KdsTabs, type KdsTabsProps, KdsTextField, type KdsTextFieldProps, KdsThemeProvider, type KdsThemeProviderProps, KdsTooltip, type KdsTooltipPlacement, type KdsTooltipProps, KdsTypography, type KdsTypographyProps, type KdsTypographyVariant, LIGHT_LOGO_LUMINANCE_THRESHOLD, type LogoBackdrop, type ThemeMode, type Tokens, type TokensByMode, type Typography as TypographyTokens, type UseExpandToggleOptions, type UseExpandToggleResult, type UseHideOnScrollOptions, type UseHideOnScrollResult, type UseStickyInvoiceCollapseOptions, borderRadius, breakpoints, centerFieldInViewport, colors, colorsByMode, focusFirstInvalidField, fontFamilies, fontSizes, fontWeights, formatDate, formatDateTime, formatTime, getContrastColor, guideToFirstInvalidFieldOnBlur, letterSpacings, lighten, lineHeights, measureLogoLuminance, pickLogoBackdrop, runAfterPointerGesture, scrollToFirstInvalidField, semanticSpacing, shadows, spacing, tokens, tokensByMode, transitions, typography, useAutoHide, useCopyToClipboard, useCountdown, useExpandToggle, useHideOnScroll, useLogoBackdrop, useMediaQuery, useStickyInvoiceCollapse, useTabsKeyboard, zIndex };
|
|
4111
|
+
export { type Colors, type ExpandPanelProps, type ExpandToggleProps, KDS_VERSION, KdsAccordion, KdsAccordionDetails, type KdsAccordionDetailsProps, type KdsAccordionProps, KdsAccordionSummary, type KdsAccordionSummaryProps, KdsAlert, type KdsAlertProps, type KdsAlertSeverity, KdsBankList, type KdsBankListProps, KdsBankModal, type KdsBankModalProps, KdsBankRow, type KdsBankRowProps, KdsBillAttachment, type KdsBillAttachmentProps, KdsBillAttachments, type KdsBillAttachmentsProps, KdsBottomSheet, type KdsBottomSheetProps, KdsButton, type KdsButtonProps, type KdsButtonSize, type KdsButtonVariant, KdsCard, KdsCardBody, KdsCardFooter, KdsCardHeader, KdsCardPlan, type KdsCardPlanProps, type KdsCardProps, type KdsCardSectionProps, KdsCardSelector, type KdsCardSelectorProps, type KdsCardVariant, KdsCheckbox, type KdsCheckboxProps, KdsChip, type KdsChipColor, type KdsChipProps, KdsCopyButton, type KdsCopyButtonProps, KdsCopyRow, type KdsCopyRowProps, KdsCopyableTable, type KdsCopyableTableProps, type KdsCopyableTableRow, KdsCountdown, type KdsCountdownProps, KdsDivider, type KdsDividerProps, KdsDocumentFrame, type KdsDocumentFrameProps, KdsEmptyState, type KdsEmptyStateProps, KdsExpandPanel, type KdsExpandPanelProps, KdsFab, type KdsFabPosition, type KdsFabProps, KdsInvoiceHeaderSkeleton, type KdsInvoiceHeaderSkeletonProps, KdsInvoiceMerchant, type KdsInvoiceMerchantProps, KdsInvoiceSticky, type KdsInvoiceStickyProps, KdsLinearProgress, type KdsLinearProgressProps, KdsMerchantTile, type KdsMerchantTileProps, KdsMontoRow, type KdsMontoRowProps, KdsPaymentTotal, type KdsPaymentTotalProps, type KdsPaymentTotalVariant, KdsQrRow, type KdsQrRowProps, KdsRadioGroup, type KdsRadioGroupProps, type KdsRadioOption, type KdsRecapItem, KdsRecapList, type KdsRecapListProps, KdsSearchField, type KdsSearchFieldProps, KdsSectionNote, type KdsSectionNoteProps, KdsSecureFooter, type KdsSecureFooterProps, KdsSecureLoader, type KdsSecureLoaderProps, KdsSegmentedTabs, type KdsSegmentedTabsProps, KdsSelect, type KdsSelectOption, type KdsSelectProps, KdsSnackbar, type KdsSnackbarProps, type KdsSnackbarType, KdsSpinner, type KdsSpinnerProps, type KdsSpinnerSize, KdsStatusBlock, type KdsStatusBlockProps, type KdsStatusType, KdsStepper, type KdsStepperProps, KdsTab, KdsTabPanel, type KdsTabPanelProps, type KdsTabProps, KdsTabs, type KdsTabsProps, KdsTextField, type KdsTextFieldProps, KdsThemeProvider, type KdsThemeProviderProps, KdsTooltip, type KdsTooltipPlacement, type KdsTooltipProps, KdsTypography, type KdsTypographyProps, type KdsTypographyVariant, LIGHT_LOGO_LUMINANCE_THRESHOLD, type LogoBackdrop, type ThemeMode, type Tokens, type TokensByMode, type Typography as TypographyTokens, type UseExpandToggleOptions, type UseExpandToggleResult, type UseHideOnScrollOptions, type UseHideOnScrollResult, type UseStickyInvoiceCollapseOptions, borderRadius, breakpoints, centerFieldInViewport, colors, colorsByMode, focusFirstInvalidField, fontFamilies, fontSizes, fontWeights, formatDate, formatDateTime, formatTime, getContrastColor, guideToFirstInvalidFieldOnBlur, letterSpacings, lighten, lineHeights, measureLogoLuminance, pickLogoBackdrop, runAfterPointerGesture, scrollToFirstInvalidField, semanticSpacing, shadows, spacing, tokens, tokensByMode, transitions, typography, useAutoHide, useCopyToClipboard, useCountdown, useExpandToggle, useHideOnScroll, useLogoBackdrop, useMediaQuery, useStickyInvoiceCollapse, useTabsKeyboard, zIndex };
|
package/dist/index.d.ts
CHANGED
|
@@ -29,7 +29,7 @@ interface KdsThemeProviderProps {
|
|
|
29
29
|
*/
|
|
30
30
|
declare function KdsThemeProvider({ primaryColor, mode, children }: KdsThemeProviderProps): react_jsx_runtime.JSX.Element;
|
|
31
31
|
|
|
32
|
-
declare const KDS_VERSION = "0.3.5-alpha.
|
|
32
|
+
declare const KDS_VERSION = "0.3.5-alpha.30";
|
|
33
33
|
|
|
34
34
|
/**
|
|
35
35
|
* Color tokens organized by theme mode
|
|
@@ -3492,6 +3492,22 @@ interface KdsInvoiceStickyProps extends React__default.HTMLAttributes<HTMLElemen
|
|
|
3492
3492
|
}
|
|
3493
3493
|
declare const KdsInvoiceSticky: React__default.ForwardRefExoticComponent<KdsInvoiceStickyProps & React__default.RefAttributes<HTMLElement>>;
|
|
3494
3494
|
|
|
3495
|
+
/**
|
|
3496
|
+
* Khipu Design System - InvoiceHeaderSkeleton Component
|
|
3497
|
+
*
|
|
3498
|
+
* Placeholder del header de la factura (KdsInvoiceSticky) mientras sus datos no llegan:
|
|
3499
|
+
* monto, código, tile del comercio y el resumen "pago a / asunto". Replica el markup del
|
|
3500
|
+
* header real con bloques `.kds-skeleton` dentro de los mismos elementos, así cada caja
|
|
3501
|
+
* mide lo mismo y el reemplazo por el header real no desplaza el layout.
|
|
3502
|
+
*
|
|
3503
|
+
* Va dentro de `.kds-invoice-sticky-wrap`, igual que el header real. Es decorativo
|
|
3504
|
+
* (`aria-hidden`): el estado de carga lo anuncia el loader del body card.
|
|
3505
|
+
*/
|
|
3506
|
+
|
|
3507
|
+
interface KdsInvoiceHeaderSkeletonProps extends React__default.HTMLAttributes<HTMLElement> {
|
|
3508
|
+
}
|
|
3509
|
+
declare const KdsInvoiceHeaderSkeleton: React__default.ForwardRefExoticComponent<KdsInvoiceHeaderSkeletonProps & React__default.RefAttributes<HTMLElement>>;
|
|
3510
|
+
|
|
3495
3511
|
/**
|
|
3496
3512
|
* Khipu Design System - BottomSheet Component
|
|
3497
3513
|
*
|
|
@@ -4092,4 +4108,4 @@ declare function formatDate(iso?: string): string;
|
|
|
4092
4108
|
*/
|
|
4093
4109
|
declare function formatTime(iso?: string): string;
|
|
4094
4110
|
|
|
4095
|
-
export { type Colors, type ExpandPanelProps, type ExpandToggleProps, KDS_VERSION, KdsAccordion, KdsAccordionDetails, type KdsAccordionDetailsProps, type KdsAccordionProps, KdsAccordionSummary, type KdsAccordionSummaryProps, KdsAlert, type KdsAlertProps, type KdsAlertSeverity, KdsBankList, type KdsBankListProps, KdsBankModal, type KdsBankModalProps, KdsBankRow, type KdsBankRowProps, KdsBillAttachment, type KdsBillAttachmentProps, KdsBillAttachments, type KdsBillAttachmentsProps, KdsBottomSheet, type KdsBottomSheetProps, KdsButton, type KdsButtonProps, type KdsButtonSize, type KdsButtonVariant, KdsCard, KdsCardBody, KdsCardFooter, KdsCardHeader, KdsCardPlan, type KdsCardPlanProps, type KdsCardProps, type KdsCardSectionProps, KdsCardSelector, type KdsCardSelectorProps, type KdsCardVariant, KdsCheckbox, type KdsCheckboxProps, KdsChip, type KdsChipColor, type KdsChipProps, KdsCopyButton, type KdsCopyButtonProps, KdsCopyRow, type KdsCopyRowProps, KdsCopyableTable, type KdsCopyableTableProps, type KdsCopyableTableRow, KdsCountdown, type KdsCountdownProps, KdsDivider, type KdsDividerProps, KdsDocumentFrame, type KdsDocumentFrameProps, KdsEmptyState, type KdsEmptyStateProps, KdsExpandPanel, type KdsExpandPanelProps, KdsFab, type KdsFabPosition, type KdsFabProps, KdsInvoiceMerchant, type KdsInvoiceMerchantProps, KdsInvoiceSticky, type KdsInvoiceStickyProps, KdsLinearProgress, type KdsLinearProgressProps, KdsMerchantTile, type KdsMerchantTileProps, KdsMontoRow, type KdsMontoRowProps, KdsPaymentTotal, type KdsPaymentTotalProps, type KdsPaymentTotalVariant, KdsQrRow, type KdsQrRowProps, KdsRadioGroup, type KdsRadioGroupProps, type KdsRadioOption, type KdsRecapItem, KdsRecapList, type KdsRecapListProps, KdsSearchField, type KdsSearchFieldProps, KdsSectionNote, type KdsSectionNoteProps, KdsSecureFooter, type KdsSecureFooterProps, KdsSecureLoader, type KdsSecureLoaderProps, KdsSegmentedTabs, type KdsSegmentedTabsProps, KdsSelect, type KdsSelectOption, type KdsSelectProps, KdsSnackbar, type KdsSnackbarProps, type KdsSnackbarType, KdsSpinner, type KdsSpinnerProps, type KdsSpinnerSize, KdsStatusBlock, type KdsStatusBlockProps, type KdsStatusType, KdsStepper, type KdsStepperProps, KdsTab, KdsTabPanel, type KdsTabPanelProps, type KdsTabProps, KdsTabs, type KdsTabsProps, KdsTextField, type KdsTextFieldProps, KdsThemeProvider, type KdsThemeProviderProps, KdsTooltip, type KdsTooltipPlacement, type KdsTooltipProps, KdsTypography, type KdsTypographyProps, type KdsTypographyVariant, LIGHT_LOGO_LUMINANCE_THRESHOLD, type LogoBackdrop, type ThemeMode, type Tokens, type TokensByMode, type Typography as TypographyTokens, type UseExpandToggleOptions, type UseExpandToggleResult, type UseHideOnScrollOptions, type UseHideOnScrollResult, type UseStickyInvoiceCollapseOptions, borderRadius, breakpoints, centerFieldInViewport, colors, colorsByMode, focusFirstInvalidField, fontFamilies, fontSizes, fontWeights, formatDate, formatDateTime, formatTime, getContrastColor, guideToFirstInvalidFieldOnBlur, letterSpacings, lighten, lineHeights, measureLogoLuminance, pickLogoBackdrop, runAfterPointerGesture, scrollToFirstInvalidField, semanticSpacing, shadows, spacing, tokens, tokensByMode, transitions, typography, useAutoHide, useCopyToClipboard, useCountdown, useExpandToggle, useHideOnScroll, useLogoBackdrop, useMediaQuery, useStickyInvoiceCollapse, useTabsKeyboard, zIndex };
|
|
4111
|
+
export { type Colors, type ExpandPanelProps, type ExpandToggleProps, KDS_VERSION, KdsAccordion, KdsAccordionDetails, type KdsAccordionDetailsProps, type KdsAccordionProps, KdsAccordionSummary, type KdsAccordionSummaryProps, KdsAlert, type KdsAlertProps, type KdsAlertSeverity, KdsBankList, type KdsBankListProps, KdsBankModal, type KdsBankModalProps, KdsBankRow, type KdsBankRowProps, KdsBillAttachment, type KdsBillAttachmentProps, KdsBillAttachments, type KdsBillAttachmentsProps, KdsBottomSheet, type KdsBottomSheetProps, KdsButton, type KdsButtonProps, type KdsButtonSize, type KdsButtonVariant, KdsCard, KdsCardBody, KdsCardFooter, KdsCardHeader, KdsCardPlan, type KdsCardPlanProps, type KdsCardProps, type KdsCardSectionProps, KdsCardSelector, type KdsCardSelectorProps, type KdsCardVariant, KdsCheckbox, type KdsCheckboxProps, KdsChip, type KdsChipColor, type KdsChipProps, KdsCopyButton, type KdsCopyButtonProps, KdsCopyRow, type KdsCopyRowProps, KdsCopyableTable, type KdsCopyableTableProps, type KdsCopyableTableRow, KdsCountdown, type KdsCountdownProps, KdsDivider, type KdsDividerProps, KdsDocumentFrame, type KdsDocumentFrameProps, KdsEmptyState, type KdsEmptyStateProps, KdsExpandPanel, type KdsExpandPanelProps, KdsFab, type KdsFabPosition, type KdsFabProps, KdsInvoiceHeaderSkeleton, type KdsInvoiceHeaderSkeletonProps, KdsInvoiceMerchant, type KdsInvoiceMerchantProps, KdsInvoiceSticky, type KdsInvoiceStickyProps, KdsLinearProgress, type KdsLinearProgressProps, KdsMerchantTile, type KdsMerchantTileProps, KdsMontoRow, type KdsMontoRowProps, KdsPaymentTotal, type KdsPaymentTotalProps, type KdsPaymentTotalVariant, KdsQrRow, type KdsQrRowProps, KdsRadioGroup, type KdsRadioGroupProps, type KdsRadioOption, type KdsRecapItem, KdsRecapList, type KdsRecapListProps, KdsSearchField, type KdsSearchFieldProps, KdsSectionNote, type KdsSectionNoteProps, KdsSecureFooter, type KdsSecureFooterProps, KdsSecureLoader, type KdsSecureLoaderProps, KdsSegmentedTabs, type KdsSegmentedTabsProps, KdsSelect, type KdsSelectOption, type KdsSelectProps, KdsSnackbar, type KdsSnackbarProps, type KdsSnackbarType, KdsSpinner, type KdsSpinnerProps, type KdsSpinnerSize, KdsStatusBlock, type KdsStatusBlockProps, type KdsStatusType, KdsStepper, type KdsStepperProps, KdsTab, KdsTabPanel, type KdsTabPanelProps, type KdsTabProps, KdsTabs, type KdsTabsProps, KdsTextField, type KdsTextFieldProps, KdsThemeProvider, type KdsThemeProviderProps, KdsTooltip, type KdsTooltipPlacement, type KdsTooltipProps, KdsTypography, type KdsTypographyProps, type KdsTypographyVariant, LIGHT_LOGO_LUMINANCE_THRESHOLD, type LogoBackdrop, type ThemeMode, type Tokens, type TokensByMode, type Typography as TypographyTokens, type UseExpandToggleOptions, type UseExpandToggleResult, type UseHideOnScrollOptions, type UseHideOnScrollResult, type UseStickyInvoiceCollapseOptions, borderRadius, breakpoints, centerFieldInViewport, colors, colorsByMode, focusFirstInvalidField, fontFamilies, fontSizes, fontWeights, formatDate, formatDateTime, formatTime, getContrastColor, guideToFirstInvalidFieldOnBlur, letterSpacings, lighten, lineHeights, measureLogoLuminance, pickLogoBackdrop, runAfterPointerGesture, scrollToFirstInvalidField, semanticSpacing, shadows, spacing, tokens, tokensByMode, transitions, typography, useAutoHide, useCopyToClipboard, useCountdown, useExpandToggle, useHideOnScroll, useLogoBackdrop, useMediaQuery, useStickyInvoiceCollapse, useTabsKeyboard, zIndex };
|
package/dist/index.js
CHANGED
|
@@ -59,6 +59,7 @@ __export(index_exports, {
|
|
|
59
59
|
KdsEmptyState: () => KdsEmptyState,
|
|
60
60
|
KdsExpandPanel: () => KdsExpandPanel,
|
|
61
61
|
KdsFab: () => KdsFab,
|
|
62
|
+
KdsInvoiceHeaderSkeleton: () => KdsInvoiceHeaderSkeleton,
|
|
62
63
|
KdsInvoiceMerchant: () => KdsInvoiceMerchant,
|
|
63
64
|
KdsInvoiceSticky: () => KdsInvoiceSticky,
|
|
64
65
|
KdsLinearProgress: () => KdsLinearProgress,
|
|
@@ -200,7 +201,7 @@ function formatTime(iso) {
|
|
|
200
201
|
}
|
|
201
202
|
|
|
202
203
|
// src/version.ts
|
|
203
|
-
var KDS_VERSION = "0.3.5-alpha.
|
|
204
|
+
var KDS_VERSION = "0.3.5-alpha.30";
|
|
204
205
|
|
|
205
206
|
// src/theme/KdsThemeProvider.tsx
|
|
206
207
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
@@ -2546,11 +2547,34 @@ var KdsInvoiceSticky = (0, import_react40.forwardRef)(
|
|
|
2546
2547
|
);
|
|
2547
2548
|
KdsInvoiceSticky.displayName = "KdsInvoiceSticky";
|
|
2548
2549
|
|
|
2549
|
-
// src/components/domain/
|
|
2550
|
+
// src/components/domain/KdsInvoiceHeaderSkeleton/KdsInvoiceHeaderSkeleton.tsx
|
|
2550
2551
|
var import_react41 = require("react");
|
|
2551
|
-
var Dialog2 = __toESM(require("@radix-ui/react-dialog"));
|
|
2552
2552
|
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2553
|
-
var
|
|
2553
|
+
var Line = () => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "kds-skeleton kds-skeleton--text" });
|
|
2554
|
+
var KdsInvoiceHeaderSkeleton = (0, import_react41.forwardRef)(
|
|
2555
|
+
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(KdsInvoiceSticky, { ref, className: (0, import_clsx.clsx)("kds-invoice-skeleton", className), "aria-hidden": "true", ...props, children: [
|
|
2556
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("header", { className: "kds-invoice-header", children: [
|
|
2557
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { children: [
|
|
2558
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: "kds-invoice-amount", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Line, {}) }),
|
|
2559
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: "kds-invoice-code", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Line, {}) })
|
|
2560
|
+
] }),
|
|
2561
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "kds-invoice-merchant kds-skeleton" })
|
|
2562
|
+
] }),
|
|
2563
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "kds-invoice-collapsible", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "kds-invoice-summary", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("dl", { className: "kds-kv", children: [
|
|
2564
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("dt", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Line, {}) }),
|
|
2565
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("dd", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Line, {}) }),
|
|
2566
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("dt", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Line, {}) }),
|
|
2567
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("dd", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Line, {}) })
|
|
2568
|
+
] }) }) })
|
|
2569
|
+
] })
|
|
2570
|
+
);
|
|
2571
|
+
KdsInvoiceHeaderSkeleton.displayName = "KdsInvoiceHeaderSkeleton";
|
|
2572
|
+
|
|
2573
|
+
// src/components/domain/KdsBottomSheet/KdsBottomSheet.tsx
|
|
2574
|
+
var import_react42 = require("react");
|
|
2575
|
+
var Dialog2 = __toESM(require("@radix-ui/react-dialog"));
|
|
2576
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2577
|
+
var KdsBottomSheet = (0, import_react42.forwardRef)(
|
|
2554
2578
|
({
|
|
2555
2579
|
open,
|
|
2556
2580
|
onClose,
|
|
@@ -2564,14 +2588,14 @@ var KdsBottomSheet = (0, import_react41.forwardRef)(
|
|
|
2564
2588
|
className,
|
|
2565
2589
|
size = "auto",
|
|
2566
2590
|
...props
|
|
2567
|
-
}, ref) => /* @__PURE__ */ (0,
|
|
2591
|
+
}, ref) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
2568
2592
|
Dialog2.Root,
|
|
2569
2593
|
{
|
|
2570
2594
|
open,
|
|
2571
2595
|
onOpenChange: (o) => {
|
|
2572
2596
|
if (!o) onClose();
|
|
2573
2597
|
},
|
|
2574
|
-
children: /* @__PURE__ */ (0,
|
|
2598
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Dialog2.Portal, { container, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "kds-theme-root", style: { display: "contents" }, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Dialog2.Overlay, { className: "kds-bottom-sheet-scrim open", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
2575
2599
|
Dialog2.Content,
|
|
2576
2600
|
{
|
|
2577
2601
|
ref,
|
|
@@ -2582,20 +2606,20 @@ var KdsBottomSheet = (0, import_react41.forwardRef)(
|
|
|
2582
2606
|
},
|
|
2583
2607
|
...props,
|
|
2584
2608
|
children: [
|
|
2585
|
-
showGrabber && /* @__PURE__ */ (0,
|
|
2586
|
-
showCloseButton && /* @__PURE__ */ (0,
|
|
2609
|
+
showGrabber && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "kds-bottom-sheet-grabber", "aria-hidden": "true" }),
|
|
2610
|
+
showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Dialog2.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
2587
2611
|
"button",
|
|
2588
2612
|
{
|
|
2589
2613
|
type: "button",
|
|
2590
2614
|
className: "kds-bottom-sheet-close",
|
|
2591
2615
|
"aria-label": "Cerrar",
|
|
2592
|
-
children: /* @__PURE__ */ (0,
|
|
2616
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("i", { className: "material-symbols-outlined", children: "close" })
|
|
2593
2617
|
}
|
|
2594
2618
|
) }),
|
|
2595
|
-
title && /* @__PURE__ */ (0,
|
|
2596
|
-
description && /* @__PURE__ */ (0,
|
|
2597
|
-
/* @__PURE__ */ (0,
|
|
2598
|
-
actions && /* @__PURE__ */ (0,
|
|
2619
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Dialog2.Title, { className: "kds-bottom-sheet-title", children: title }),
|
|
2620
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Dialog2.Description, { className: "kds-bottom-sheet-description", children: description }),
|
|
2621
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "kds-bottom-sheet-body", children }),
|
|
2622
|
+
actions && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "kds-bottom-sheet-actions", children: actions })
|
|
2599
2623
|
]
|
|
2600
2624
|
}
|
|
2601
2625
|
) }) }) })
|
|
@@ -2605,13 +2629,13 @@ var KdsBottomSheet = (0, import_react41.forwardRef)(
|
|
|
2605
2629
|
KdsBottomSheet.displayName = "KdsBottomSheet";
|
|
2606
2630
|
|
|
2607
2631
|
// src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
|
|
2608
|
-
var
|
|
2632
|
+
var import_react44 = require("react");
|
|
2609
2633
|
|
|
2610
2634
|
// src/components/domain/KdsSecureFooter/KhipuWordmark.tsx
|
|
2611
|
-
var
|
|
2612
|
-
var
|
|
2613
|
-
var KhipuWordmark = (0,
|
|
2614
|
-
({ className = "khipu-mark", ...props }, ref) => /* @__PURE__ */ (0,
|
|
2635
|
+
var import_react43 = require("react");
|
|
2636
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2637
|
+
var KhipuWordmark = (0, import_react43.forwardRef)(
|
|
2638
|
+
({ className = "khipu-mark", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
2615
2639
|
"svg",
|
|
2616
2640
|
{
|
|
2617
2641
|
ref,
|
|
@@ -2622,14 +2646,14 @@ var KhipuWordmark = (0, import_react42.forwardRef)(
|
|
|
2622
2646
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2623
2647
|
...props,
|
|
2624
2648
|
children: [
|
|
2625
|
-
/* @__PURE__ */ (0,
|
|
2626
|
-
/* @__PURE__ */ (0,
|
|
2627
|
-
/* @__PURE__ */ (0,
|
|
2628
|
-
/* @__PURE__ */ (0,
|
|
2629
|
-
/* @__PURE__ */ (0,
|
|
2630
|
-
/* @__PURE__ */ (0,
|
|
2631
|
-
/* @__PURE__ */ (0,
|
|
2632
|
-
/* @__PURE__ */ (0,
|
|
2649
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2650
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2651
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2652
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2653
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2654
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2655
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" }),
|
|
2656
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.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" })
|
|
2633
2657
|
]
|
|
2634
2658
|
}
|
|
2635
2659
|
)
|
|
@@ -2637,17 +2661,17 @@ var KhipuWordmark = (0, import_react42.forwardRef)(
|
|
|
2637
2661
|
KhipuWordmark.displayName = "KhipuWordmark";
|
|
2638
2662
|
|
|
2639
2663
|
// src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
|
|
2640
|
-
var
|
|
2641
|
-
var KdsSecureFooter = (0,
|
|
2642
|
-
({ variant = "default", showLogo = true, psp, children, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2643
|
-
/* @__PURE__ */ (0,
|
|
2644
|
-
/* @__PURE__ */ (0,
|
|
2645
|
-
/* @__PURE__ */ (0,
|
|
2664
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2665
|
+
var KdsSecureFooter = (0, import_react44.forwardRef)(
|
|
2666
|
+
({ variant = "default", showLogo = true, psp, children, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("footer", { ref, className: (0, import_clsx.clsx)("kds-secure-footer", variant === "inside" && "inside", className), ...props, children: [
|
|
2667
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("svg", { className: "kds-secure-footer-lock", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
|
|
2668
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("rect", { x: "4.5", y: "10.5", width: "15", height: "10", rx: "2.25" }),
|
|
2669
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("path", { d: "M8 10.5V7a4 4 0 0 1 8 0v3.5" })
|
|
2646
2670
|
] }),
|
|
2647
|
-
children || /* @__PURE__ */ (0,
|
|
2648
|
-
showLogo && /* @__PURE__ */ (0,
|
|
2649
|
-
psp && /* @__PURE__ */ (0,
|
|
2650
|
-
/* @__PURE__ */ (0,
|
|
2671
|
+
children || /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { children: "Pago seguro procesado por" }),
|
|
2672
|
+
showLogo && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(KhipuWordmark, {}),
|
|
2673
|
+
psp && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
|
|
2674
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "kds-secure-footer-sep", "aria-hidden": "true" }),
|
|
2651
2675
|
psp
|
|
2652
2676
|
] })
|
|
2653
2677
|
] })
|
|
@@ -2655,44 +2679,44 @@ var KdsSecureFooter = (0, import_react43.forwardRef)(
|
|
|
2655
2679
|
KdsSecureFooter.displayName = "KdsSecureFooter";
|
|
2656
2680
|
|
|
2657
2681
|
// src/components/domain/KdsRecapList/KdsRecapList.tsx
|
|
2658
|
-
var
|
|
2659
|
-
var
|
|
2660
|
-
var KdsRecapList = (0,
|
|
2661
|
-
({ items, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2662
|
-
/* @__PURE__ */ (0,
|
|
2663
|
-
/* @__PURE__ */ (0,
|
|
2682
|
+
var import_react45 = require("react");
|
|
2683
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2684
|
+
var KdsRecapList = (0, import_react45.forwardRef)(
|
|
2685
|
+
({ items, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("ul", { ref, className: (0, import_clsx.clsx)("kds-recap-list", className), ...props, children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("li", { children: [
|
|
2686
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "kds-key", children: item.label }),
|
|
2687
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: (0, import_clsx.clsx)("kds-value", !item.value && item.placeholder && "placeholder"), children: item.value || item.placeholder || "-" })
|
|
2664
2688
|
] }, i)) })
|
|
2665
2689
|
);
|
|
2666
2690
|
KdsRecapList.displayName = "KdsRecapList";
|
|
2667
2691
|
|
|
2668
2692
|
// src/components/domain/KdsMontoRow/KdsMontoRow.tsx
|
|
2669
|
-
var
|
|
2670
|
-
var
|
|
2671
|
-
var KdsMontoRow = (0,
|
|
2672
|
-
({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2673
|
-
/* @__PURE__ */ (0,
|
|
2674
|
-
/* @__PURE__ */ (0,
|
|
2675
|
-
deadline && /* @__PURE__ */ (0,
|
|
2693
|
+
var import_react46 = require("react");
|
|
2694
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2695
|
+
var KdsMontoRow = (0, import_react46.forwardRef)(
|
|
2696
|
+
({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { ref, className: (0, import_clsx.clsx)("kds-monto-row", className), ...props, children: [
|
|
2697
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { children: [
|
|
2698
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "kds-monto-row-title", children: title }),
|
|
2699
|
+
deadline && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "kds-monto-row-deadline", children: deadline })
|
|
2676
2700
|
] }),
|
|
2677
|
-
/* @__PURE__ */ (0,
|
|
2701
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "kds-monto-row-value", children: value })
|
|
2678
2702
|
] })
|
|
2679
2703
|
);
|
|
2680
2704
|
KdsMontoRow.displayName = "KdsMontoRow";
|
|
2681
2705
|
|
|
2682
2706
|
// src/components/domain/KdsMerchantTile/KdsMerchantTile.tsx
|
|
2683
|
-
var
|
|
2684
|
-
var
|
|
2685
|
-
var KdsMerchantTile = (0,
|
|
2707
|
+
var import_react47 = require("react");
|
|
2708
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2709
|
+
var KdsMerchantTile = (0, import_react47.forwardRef)(
|
|
2686
2710
|
({ name, logoUrl, initials, compact, className, ...props }, ref) => {
|
|
2687
2711
|
const displayInitials = (initials ?? name.slice(0, 2)).toUpperCase();
|
|
2688
|
-
return /* @__PURE__ */ (0,
|
|
2712
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2689
2713
|
"div",
|
|
2690
2714
|
{
|
|
2691
2715
|
ref,
|
|
2692
2716
|
className: (0, import_clsx.clsx)("kds-merchant-tile", logoUrl && "logo", compact && "compact", className),
|
|
2693
2717
|
"aria-label": name,
|
|
2694
2718
|
...props,
|
|
2695
|
-
children: logoUrl ? /* @__PURE__ */ (0,
|
|
2719
|
+
children: logoUrl ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("img", { src: logoUrl, alt: name }) : displayInitials
|
|
2696
2720
|
}
|
|
2697
2721
|
);
|
|
2698
2722
|
}
|
|
@@ -2700,10 +2724,10 @@ var KdsMerchantTile = (0, import_react46.forwardRef)(
|
|
|
2700
2724
|
KdsMerchantTile.displayName = "KdsMerchantTile";
|
|
2701
2725
|
|
|
2702
2726
|
// src/components/domain/KdsInvoiceMerchant/KdsInvoiceMerchant.tsx
|
|
2703
|
-
var
|
|
2727
|
+
var import_react49 = require("react");
|
|
2704
2728
|
|
|
2705
2729
|
// src/components/domain/KdsInvoiceMerchant/useLogoBackdrop.ts
|
|
2706
|
-
var
|
|
2730
|
+
var import_react48 = require("react");
|
|
2707
2731
|
|
|
2708
2732
|
// src/components/domain/KdsInvoiceMerchant/logoLuminance.ts
|
|
2709
2733
|
var LIGHT_LOGO_LUMINANCE_THRESHOLD = 0.72;
|
|
@@ -2752,8 +2776,8 @@ function pickLogoBackdrop(luminance) {
|
|
|
2752
2776
|
|
|
2753
2777
|
// src/components/domain/KdsInvoiceMerchant/useLogoBackdrop.ts
|
|
2754
2778
|
function useLogoBackdrop(logoUrl) {
|
|
2755
|
-
const [backdrop, setBackdrop] = (0,
|
|
2756
|
-
(0,
|
|
2779
|
+
const [backdrop, setBackdrop] = (0, import_react48.useState)("light");
|
|
2780
|
+
(0, import_react48.useEffect)(() => {
|
|
2757
2781
|
let cancelled = false;
|
|
2758
2782
|
setBackdrop("light");
|
|
2759
2783
|
if (!logoUrl) {
|
|
@@ -2772,13 +2796,13 @@ function useLogoBackdrop(logoUrl) {
|
|
|
2772
2796
|
}
|
|
2773
2797
|
|
|
2774
2798
|
// src/components/domain/KdsInvoiceMerchant/KdsInvoiceMerchant.tsx
|
|
2775
|
-
var
|
|
2776
|
-
var KdsInvoiceMerchant = (0,
|
|
2799
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
2800
|
+
var KdsInvoiceMerchant = (0, import_react49.forwardRef)(
|
|
2777
2801
|
({ logoUrl, brandColor, className, style, ...props }, ref) => {
|
|
2778
|
-
const [failed, setFailed] = (0,
|
|
2802
|
+
const [failed, setFailed] = (0, import_react49.useState)(false);
|
|
2779
2803
|
const showLogo = !!logoUrl && !failed;
|
|
2780
2804
|
const backdrop = useLogoBackdrop(showLogo ? logoUrl : void 0);
|
|
2781
|
-
return /* @__PURE__ */ (0,
|
|
2805
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2782
2806
|
"div",
|
|
2783
2807
|
{
|
|
2784
2808
|
ref,
|
|
@@ -2791,7 +2815,7 @@ var KdsInvoiceMerchant = (0, import_react48.forwardRef)(
|
|
|
2791
2815
|
"aria-hidden": "true",
|
|
2792
2816
|
style: !showLogo && brandColor ? { background: brandColor, ...style } : style,
|
|
2793
2817
|
...props,
|
|
2794
|
-
children: showLogo ? /* @__PURE__ */ (0,
|
|
2818
|
+
children: showLogo ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("img", { src: logoUrl, alt: "", onError: () => setFailed(true) }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("i", { className: "material-symbols-outlined", children: "storefront" })
|
|
2795
2819
|
}
|
|
2796
2820
|
);
|
|
2797
2821
|
}
|
|
@@ -2799,9 +2823,9 @@ var KdsInvoiceMerchant = (0, import_react48.forwardRef)(
|
|
|
2799
2823
|
KdsInvoiceMerchant.displayName = "KdsInvoiceMerchant";
|
|
2800
2824
|
|
|
2801
2825
|
// src/components/domain/KdsPaymentTotal/KdsPaymentTotal.tsx
|
|
2802
|
-
var
|
|
2803
|
-
var
|
|
2804
|
-
var KdsPaymentTotal = (0,
|
|
2826
|
+
var import_react50 = require("react");
|
|
2827
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
2828
|
+
var KdsPaymentTotal = (0, import_react50.forwardRef)(
|
|
2805
2829
|
({
|
|
2806
2830
|
variant = "default",
|
|
2807
2831
|
tone = "brand",
|
|
@@ -2819,7 +2843,7 @@ var KdsPaymentTotal = (0, import_react49.forwardRef)(
|
|
|
2819
2843
|
const { integer, fraction } = formatAmount(amount, decimals, locale);
|
|
2820
2844
|
const isEmail = variant === "email";
|
|
2821
2845
|
const isInfoTone = tone === "info";
|
|
2822
|
-
return /* @__PURE__ */ (0,
|
|
2846
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
|
|
2823
2847
|
"div",
|
|
2824
2848
|
{
|
|
2825
2849
|
ref,
|
|
@@ -2832,14 +2856,14 @@ var KdsPaymentTotal = (0, import_react49.forwardRef)(
|
|
|
2832
2856
|
),
|
|
2833
2857
|
...props,
|
|
2834
2858
|
children: [
|
|
2835
|
-
!isEmail && title != null && /* @__PURE__ */ (0,
|
|
2836
|
-
!isEmail && titleMobile != null && /* @__PURE__ */ (0,
|
|
2837
|
-
label != null && /* @__PURE__ */ (0,
|
|
2838
|
-
/* @__PURE__ */ (0,
|
|
2859
|
+
!isEmail && title != null && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("h5", { className: "kds-payment-total-title", children: title }),
|
|
2860
|
+
!isEmail && titleMobile != null && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("h5", { className: "kds-payment-total-title-mobile", children: titleMobile }),
|
|
2861
|
+
label != null && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("h6", { className: "kds-payment-label", children: label }),
|
|
2862
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("h5", { className: "kds-payment-amount", children: [
|
|
2839
2863
|
currency,
|
|
2840
2864
|
" ",
|
|
2841
2865
|
integer,
|
|
2842
|
-
fraction !== null && /* @__PURE__ */ (0,
|
|
2866
|
+
fraction !== null && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("sup", { className: "kds-payment-total-decimal-sup", children: fraction })
|
|
2843
2867
|
] })
|
|
2844
2868
|
]
|
|
2845
2869
|
}
|
|
@@ -2875,10 +2899,10 @@ function formatAmount(amount, decimals, locale) {
|
|
|
2875
2899
|
}
|
|
2876
2900
|
|
|
2877
2901
|
// src/components/domain/KdsBillAttachment/KdsBillAttachment.tsx
|
|
2878
|
-
var
|
|
2879
|
-
var
|
|
2880
|
-
var KdsBillAttachment = (0,
|
|
2881
|
-
({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2902
|
+
var import_react51 = require("react");
|
|
2903
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
2904
|
+
var KdsBillAttachment = (0, import_react51.forwardRef)(
|
|
2905
|
+
({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
|
|
2882
2906
|
"a",
|
|
2883
2907
|
{
|
|
2884
2908
|
ref,
|
|
@@ -2888,15 +2912,15 @@ var KdsBillAttachment = (0, import_react50.forwardRef)(
|
|
|
2888
2912
|
className: (0, import_clsx.clsx)("kds-bill-attachment", className),
|
|
2889
2913
|
...props,
|
|
2890
2914
|
children: [
|
|
2891
|
-
/* @__PURE__ */ (0,
|
|
2892
|
-
/* @__PURE__ */ (0,
|
|
2915
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)("i", { className: "material-symbols-outlined", children: icon }),
|
|
2916
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { children: filename })
|
|
2893
2917
|
]
|
|
2894
2918
|
}
|
|
2895
2919
|
)
|
|
2896
2920
|
);
|
|
2897
2921
|
KdsBillAttachment.displayName = "KdsBillAttachment";
|
|
2898
|
-
var KdsBillAttachments = (0,
|
|
2899
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
2922
|
+
var KdsBillAttachments = (0, import_react51.forwardRef)(
|
|
2923
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { ref, className: (0, import_clsx.clsx)("kds-bill-attachments", className), ...props, children })
|
|
2900
2924
|
);
|
|
2901
2925
|
KdsBillAttachments.displayName = "KdsBillAttachments";
|
|
2902
2926
|
|
|
@@ -2995,12 +3019,12 @@ var guideToFirstInvalidFieldOnBlur = (form) => {
|
|
|
2995
3019
|
};
|
|
2996
3020
|
|
|
2997
3021
|
// src/components/core/hooks/useStickyInvoiceCollapse.ts
|
|
2998
|
-
var
|
|
3022
|
+
var import_react52 = require("react");
|
|
2999
3023
|
function useStickyInvoiceCollapse(options = {}) {
|
|
3000
3024
|
const { onCollapseStart, collapseEnd = 20, mobileBreakpoint = 768 } = options;
|
|
3001
|
-
const onCollapseStartRef = (0,
|
|
3025
|
+
const onCollapseStartRef = (0, import_react52.useRef)(onCollapseStart);
|
|
3002
3026
|
onCollapseStartRef.current = onCollapseStart;
|
|
3003
|
-
(0,
|
|
3027
|
+
(0, import_react52.useEffect)(() => {
|
|
3004
3028
|
let viewportOffset = 0;
|
|
3005
3029
|
let ticking = false;
|
|
3006
3030
|
let wasCollapsing = false;
|
|
@@ -3073,24 +3097,24 @@ function useStickyInvoiceCollapse(options = {}) {
|
|
|
3073
3097
|
}
|
|
3074
3098
|
|
|
3075
3099
|
// src/components/core/hooks/useExpandToggle.ts
|
|
3076
|
-
var
|
|
3100
|
+
var import_react53 = require("react");
|
|
3077
3101
|
function useExpandToggle(options = {}) {
|
|
3078
3102
|
const { defaultOpen = false, open: controlledOpen, onOpenChange, id } = options;
|
|
3079
|
-
const generatedId = (0,
|
|
3103
|
+
const generatedId = (0, import_react53.useId)();
|
|
3080
3104
|
const panelId = id ?? `kds-expand-${generatedId}`;
|
|
3081
3105
|
const isControlled = controlledOpen !== void 0;
|
|
3082
|
-
const [uncontrolledOpen, setUncontrolledOpen] = (0,
|
|
3106
|
+
const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react53.useState)(defaultOpen);
|
|
3083
3107
|
const open = isControlled ? controlledOpen : uncontrolledOpen;
|
|
3084
|
-
const panelRef = (0,
|
|
3085
|
-
const setPanelRef = (0,
|
|
3108
|
+
const panelRef = (0, import_react53.useRef)(null);
|
|
3109
|
+
const setPanelRef = (0, import_react53.useCallback)((node) => {
|
|
3086
3110
|
panelRef.current = node;
|
|
3087
3111
|
}, []);
|
|
3088
|
-
(0,
|
|
3112
|
+
(0, import_react53.useLayoutEffect)(() => {
|
|
3089
3113
|
const panel = panelRef.current;
|
|
3090
3114
|
if (!panel) return;
|
|
3091
3115
|
panel.style.maxHeight = open ? `${panel.scrollHeight}px` : "";
|
|
3092
3116
|
}, [open]);
|
|
3093
|
-
const setOpen = (0,
|
|
3117
|
+
const setOpen = (0, import_react53.useCallback)(
|
|
3094
3118
|
(next) => {
|
|
3095
3119
|
if (!isControlled) {
|
|
3096
3120
|
setUncontrolledOpen(next);
|
|
@@ -3099,8 +3123,8 @@ function useExpandToggle(options = {}) {
|
|
|
3099
3123
|
},
|
|
3100
3124
|
[isControlled, onOpenChange]
|
|
3101
3125
|
);
|
|
3102
|
-
const toggle = (0,
|
|
3103
|
-
const getToggleProps = (0,
|
|
3126
|
+
const toggle = (0, import_react53.useCallback)(() => setOpen(!open), [open, setOpen]);
|
|
3127
|
+
const getToggleProps = (0, import_react53.useCallback)(
|
|
3104
3128
|
() => ({
|
|
3105
3129
|
type: "button",
|
|
3106
3130
|
"aria-expanded": open,
|
|
@@ -3109,7 +3133,7 @@ function useExpandToggle(options = {}) {
|
|
|
3109
3133
|
}),
|
|
3110
3134
|
[open, panelId, toggle]
|
|
3111
3135
|
);
|
|
3112
|
-
const getPanelProps = (0,
|
|
3136
|
+
const getPanelProps = (0, import_react53.useCallback)(
|
|
3113
3137
|
(baseClassName = "kds-expand-panel") => ({
|
|
3114
3138
|
id: panelId,
|
|
3115
3139
|
className: open ? `${baseClassName} open` : baseClassName,
|
|
@@ -3122,11 +3146,11 @@ function useExpandToggle(options = {}) {
|
|
|
3122
3146
|
}
|
|
3123
3147
|
|
|
3124
3148
|
// src/components/core/hooks/useHideOnScroll.ts
|
|
3125
|
-
var
|
|
3149
|
+
var import_react54 = require("react");
|
|
3126
3150
|
function useHideOnScroll(options = {}) {
|
|
3127
3151
|
const { threshold = 8, topOffset = 0 } = options;
|
|
3128
|
-
const [hidden, setHidden] = (0,
|
|
3129
|
-
(0,
|
|
3152
|
+
const [hidden, setHidden] = (0, import_react54.useState)(false);
|
|
3153
|
+
(0, import_react54.useEffect)(() => {
|
|
3130
3154
|
let viewportOffset = 0;
|
|
3131
3155
|
let lastY = 0;
|
|
3132
3156
|
let ticking = false;
|
|
@@ -3169,12 +3193,12 @@ function useHideOnScroll(options = {}) {
|
|
|
3169
3193
|
}
|
|
3170
3194
|
|
|
3171
3195
|
// src/components/core/hooks/useMediaQuery.ts
|
|
3172
|
-
var
|
|
3196
|
+
var import_react55 = require("react");
|
|
3173
3197
|
function useMediaQuery(query) {
|
|
3174
|
-
const [matches, setMatches] = (0,
|
|
3198
|
+
const [matches, setMatches] = (0, import_react55.useState)(
|
|
3175
3199
|
() => typeof window !== "undefined" ? window.matchMedia(query).matches : false
|
|
3176
3200
|
);
|
|
3177
|
-
(0,
|
|
3201
|
+
(0, import_react55.useEffect)(() => {
|
|
3178
3202
|
if (typeof window === "undefined") return;
|
|
3179
3203
|
const mql = window.matchMedia(query);
|
|
3180
3204
|
setMatches(mql.matches);
|
|
@@ -3215,6 +3239,7 @@ function useMediaQuery(query) {
|
|
|
3215
3239
|
KdsEmptyState,
|
|
3216
3240
|
KdsExpandPanel,
|
|
3217
3241
|
KdsFab,
|
|
3242
|
+
KdsInvoiceHeaderSkeleton,
|
|
3218
3243
|
KdsInvoiceMerchant,
|
|
3219
3244
|
KdsInvoiceSticky,
|
|
3220
3245
|
KdsLinearProgress,
|