@timmbr/ui 1.5.0 → 1.6.0
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/README.md +12 -10
- package/dist/components/Alert/Alert.styles.d.ts +2 -2
- package/dist/components/AlertDialog/AlertDialog.d.ts +5 -3
- package/dist/components/AlertDialog/AlertDialog.d.ts.map +1 -1
- package/dist/components/AlertDialog/AlertDialog.js +21 -8
- package/dist/components/AlertDialog/AlertDialog.styles.d.ts +7 -1
- package/dist/components/AlertDialog/AlertDialog.styles.d.ts.map +1 -1
- package/dist/components/AlertDialog/AlertDialog.styles.js +26 -3
- package/dist/components/AlertDialog/AlertDialog.types.d.ts +19 -2
- package/dist/components/AlertDialog/AlertDialog.types.d.ts.map +1 -1
- package/dist/components/Avatar/Avatar.styles.d.ts +2 -2
- package/dist/components/Badge/Badge.styles.d.ts +2 -2
- package/dist/components/Badge/Badge.styles.d.ts.map +1 -1
- package/dist/components/Badge/Badge.styles.js +3 -1
- package/dist/components/Button/Button.d.ts.map +1 -1
- package/dist/components/Button/Button.js +6 -0
- package/dist/components/Button/Button.styles.d.ts +4 -2
- package/dist/components/Button/Button.styles.d.ts.map +1 -1
- package/dist/components/Button/Button.styles.js +26 -7
- package/dist/components/Card/Card.d.ts.map +1 -1
- package/dist/components/Card/Card.js +51 -32
- package/dist/components/Card/Card.styles.d.ts +32 -5
- package/dist/components/Card/Card.styles.d.ts.map +1 -1
- package/dist/components/Card/Card.styles.js +69 -10
- package/dist/components/Card/Card.types.d.ts +14 -3
- package/dist/components/Card/Card.types.d.ts.map +1 -1
- package/dist/components/Checkbox/Checkbox.styles.d.ts +2 -2
- package/dist/components/Chip/Chip.styles.d.ts +1 -1
- package/dist/components/ConfirmDialog/ConfirmDialog.d.ts +30 -0
- package/dist/components/ConfirmDialog/ConfirmDialog.d.ts.map +1 -0
- package/dist/components/ConfirmDialog/ConfirmDialog.js +57 -0
- package/dist/components/ConfirmDialog/index.d.ts +2 -0
- package/dist/components/ConfirmDialog/index.d.ts.map +1 -0
- package/dist/components/Container/Container.styles.d.ts +1 -1
- package/dist/components/DataList/DataList.d.ts +3 -1
- package/dist/components/DataList/DataList.d.ts.map +1 -1
- package/dist/components/DataList/DataList.js +53 -15
- package/dist/components/DataList/DataList.styles.d.ts +17 -4
- package/dist/components/DataList/DataList.styles.d.ts.map +1 -1
- package/dist/components/DataList/DataList.styles.js +53 -10
- package/dist/components/DataList/DataList.types.d.ts +19 -2
- package/dist/components/DataList/DataList.types.d.ts.map +1 -1
- package/dist/components/Drawer/Drawer.d.ts +4 -3
- package/dist/components/Drawer/Drawer.d.ts.map +1 -1
- package/dist/components/Drawer/Drawer.js +33 -6
- package/dist/components/Drawer/Drawer.styles.d.ts +4 -0
- package/dist/components/Drawer/Drawer.styles.d.ts.map +1 -1
- package/dist/components/Drawer/Drawer.styles.js +8 -5
- package/dist/components/Drawer/Drawer.types.d.ts +1 -0
- package/dist/components/Drawer/Drawer.types.d.ts.map +1 -1
- package/dist/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/dist/components/Dropdown/Dropdown.js +23 -10
- package/dist/components/Dropdown/Dropdown.styles.d.ts +5 -1
- package/dist/components/Dropdown/Dropdown.styles.d.ts.map +1 -1
- package/dist/components/Dropdown/Dropdown.styles.js +12 -2
- package/dist/components/Dropdown/Dropdown.types.d.ts +4 -0
- package/dist/components/Dropdown/Dropdown.types.d.ts.map +1 -1
- package/dist/components/EmptyState/EmptyState.d.ts.map +1 -1
- package/dist/components/EmptyState/EmptyState.js +2 -1
- package/dist/components/EmptyState/EmptyState.styles.d.ts +3 -2
- package/dist/components/EmptyState/EmptyState.styles.d.ts.map +1 -1
- package/dist/components/EmptyState/EmptyState.styles.js +5 -0
- package/dist/components/Fieldset/Fieldset.d.ts +14 -0
- package/dist/components/Fieldset/Fieldset.d.ts.map +1 -0
- package/dist/components/Fieldset/Fieldset.js +24 -0
- package/dist/components/Fieldset/index.d.ts +2 -0
- package/dist/components/Fieldset/index.d.ts.map +1 -0
- package/dist/components/FormActions/FormActions.d.ts +13 -0
- package/dist/components/FormActions/FormActions.d.ts.map +1 -0
- package/dist/components/FormActions/FormActions.js +24 -0
- package/dist/components/FormActions/index.d.ts +2 -0
- package/dist/components/FormActions/index.d.ts.map +1 -0
- package/dist/components/Grid/Grid.d.ts +3 -1
- package/dist/components/Grid/Grid.d.ts.map +1 -1
- package/dist/components/Grid/Grid.js +31 -5
- package/dist/components/Grid/Grid.styles.d.ts +86 -0
- package/dist/components/Grid/Grid.styles.d.ts.map +1 -1
- package/dist/components/Grid/Grid.styles.js +85 -1
- package/dist/components/Grid/Grid.types.d.ts +31 -3
- package/dist/components/Grid/Grid.types.d.ts.map +1 -1
- package/dist/components/Heading/Heading.styles.d.ts +2 -2
- package/dist/components/Heading/Heading.styles.d.ts.map +1 -1
- package/dist/components/Heading/Heading.styles.js +3 -1
- package/dist/components/Heading/Heading.types.d.ts +1 -1
- package/dist/components/Heading/Heading.types.d.ts.map +1 -1
- package/dist/components/Icon/Icon.styles.d.ts +2 -2
- package/dist/components/Icon/Icon.styles.d.ts.map +1 -1
- package/dist/components/Icon/Icon.styles.js +6 -2
- package/dist/components/IconTile/IconTile.d.ts +8 -0
- package/dist/components/IconTile/IconTile.d.ts.map +1 -0
- package/dist/components/IconTile/IconTile.js +23 -0
- package/dist/components/IconTile/IconTile.styles.d.ts +7 -0
- package/dist/components/IconTile/IconTile.styles.d.ts.map +1 -0
- package/dist/components/IconTile/IconTile.styles.js +24 -0
- package/dist/components/IconTile/IconTile.types.d.ts +12 -0
- package/dist/components/IconTile/IconTile.types.d.ts.map +1 -0
- package/dist/components/IconTile/index.d.ts +4 -0
- package/dist/components/IconTile/index.d.ts.map +1 -0
- package/dist/components/Inline/Inline.d.ts.map +1 -1
- package/dist/components/Inline/Inline.js +10 -2
- package/dist/components/Inline/Inline.types.d.ts +6 -1
- package/dist/components/Inline/Inline.types.d.ts.map +1 -1
- package/dist/components/Input/Input.styles.d.ts +1 -1
- package/dist/components/Label/Label.styles.d.ts +1 -1
- package/dist/components/LinkButton/LinkButton.d.ts.map +1 -1
- package/dist/components/LinkButton/LinkButton.js +2 -0
- package/dist/components/LinkButton/LinkButton.styles.d.ts +3 -2
- package/dist/components/LinkButton/LinkButton.styles.d.ts.map +1 -1
- package/dist/components/LinkButton/LinkButton.styles.js +6 -0
- package/dist/components/List/List.d.ts.map +1 -1
- package/dist/components/List/List.js +18 -5
- package/dist/components/List/List.styles.d.ts +3 -1
- package/dist/components/List/List.styles.d.ts.map +1 -1
- package/dist/components/List/List.styles.js +4 -3
- package/dist/components/List/List.types.d.ts +7 -0
- package/dist/components/List/List.types.d.ts.map +1 -1
- package/dist/components/MediaCard/MediaCard.d.ts +13 -0
- package/dist/components/MediaCard/MediaCard.d.ts.map +1 -0
- package/dist/components/MediaCard/MediaCard.js +123 -0
- package/dist/components/MediaCard/MediaCard.styles.d.ts +17 -0
- package/dist/components/MediaCard/MediaCard.styles.d.ts.map +1 -0
- package/dist/components/MediaCard/MediaCard.styles.js +57 -0
- package/dist/components/MediaCard/MediaCard.types.d.ts +73 -0
- package/dist/components/MediaCard/MediaCard.types.d.ts.map +1 -0
- package/dist/components/MediaCard/index.d.ts +4 -0
- package/dist/components/MediaCard/index.d.ts.map +1 -0
- package/dist/components/NavFooter/NavFooter.styles.d.ts +1 -1
- package/dist/components/NavHeader/NavHeader.d.ts.map +1 -1
- package/dist/components/NavHeader/NavHeader.js +2 -1
- package/dist/components/NavHeader/NavHeader.styles.d.ts +1 -1
- package/dist/components/NavHeader/NavHeader.types.d.ts +22 -0
- package/dist/components/NavHeader/NavHeader.types.d.ts.map +1 -1
- package/dist/components/NavHeader/index.d.ts +1 -1
- package/dist/components/NavHeader/index.d.ts.map +1 -1
- package/dist/components/NavHeader/subcomponents/NavActions.d.ts +5 -0
- package/dist/components/NavHeader/subcomponents/NavActions.d.ts.map +1 -1
- package/dist/components/NavHeader/subcomponents/NavActions.js +32 -2
- package/dist/components/OtpInput/OtpInput.styles.d.ts +1 -1
- package/dist/components/PageHeader/PageHeader.d.ts +8 -0
- package/dist/components/PageHeader/PageHeader.d.ts.map +1 -0
- package/dist/components/PageHeader/PageHeader.js +55 -0
- package/dist/components/PageHeader/PageHeader.styles.d.ts +10 -0
- package/dist/components/PageHeader/PageHeader.styles.d.ts.map +1 -0
- package/dist/components/PageHeader/PageHeader.styles.js +23 -0
- package/dist/components/PageHeader/PageHeader.types.d.ts +24 -0
- package/dist/components/PageHeader/PageHeader.types.d.ts.map +1 -0
- package/dist/components/PageHeader/index.d.ts +4 -0
- package/dist/components/PageHeader/index.d.ts.map +1 -0
- package/dist/components/Pagination/Pagination.d.ts +9 -3
- package/dist/components/Pagination/Pagination.d.ts.map +1 -1
- package/dist/components/Pagination/Pagination.js +60 -39
- package/dist/components/Pagination/Pagination.styles.d.ts +1 -1
- package/dist/components/Pagination/Pagination.types.d.ts +23 -14
- package/dist/components/Pagination/Pagination.types.d.ts.map +1 -1
- package/dist/components/Price/Price.d.ts +10 -0
- package/dist/components/Price/Price.d.ts.map +1 -0
- package/dist/components/Price/Price.js +49 -0
- package/dist/components/Price/Price.styles.d.ts +15 -0
- package/dist/components/Price/Price.styles.d.ts.map +1 -0
- package/dist/components/Price/Price.styles.js +44 -0
- package/dist/components/Price/Price.types.d.ts +22 -0
- package/dist/components/Price/Price.types.d.ts.map +1 -0
- package/dist/components/Price/index.d.ts +4 -0
- package/dist/components/Price/index.d.ts.map +1 -0
- package/dist/components/Progress/Progress.styles.d.ts +1 -1
- package/dist/components/Radio/Radio.styles.d.ts +2 -2
- package/dist/components/Rating/Rating.d.ts +5 -0
- package/dist/components/Rating/Rating.d.ts.map +1 -0
- package/dist/components/Rating/Rating.js +38 -0
- package/dist/components/Rating/Rating.styles.d.ts +6 -0
- package/dist/components/Rating/Rating.styles.d.ts.map +1 -0
- package/dist/components/Rating/Rating.styles.js +13 -0
- package/dist/components/Rating/Rating.types.d.ts +18 -0
- package/dist/components/Rating/Rating.types.d.ts.map +1 -0
- package/dist/components/Rating/index.d.ts +4 -0
- package/dist/components/Rating/index.d.ts.map +1 -0
- package/dist/components/ResponsiveDialog/ResponsiveDialog.d.ts +29 -0
- package/dist/components/ResponsiveDialog/ResponsiveDialog.d.ts.map +1 -0
- package/dist/components/ResponsiveDialog/ResponsiveDialog.js +74 -0
- package/dist/components/ResponsiveDialog/ResponsiveDialog.types.d.ts +27 -0
- package/dist/components/ResponsiveDialog/ResponsiveDialog.types.d.ts.map +1 -0
- package/dist/components/ResponsiveDialog/index.d.ts +3 -0
- package/dist/components/ResponsiveDialog/index.d.ts.map +1 -0
- package/dist/components/SectionNav/SectionNav.d.ts +12 -0
- package/dist/components/SectionNav/SectionNav.d.ts.map +1 -0
- package/dist/components/SectionNav/SectionNav.js +67 -0
- package/dist/components/SectionNav/SectionNav.styles.d.ts +11 -0
- package/dist/components/SectionNav/SectionNav.styles.d.ts.map +1 -0
- package/dist/components/SectionNav/SectionNav.styles.js +28 -0
- package/dist/components/SectionNav/SectionNav.types.d.ts +37 -0
- package/dist/components/SectionNav/SectionNav.types.d.ts.map +1 -0
- package/dist/components/SectionNav/index.d.ts +4 -0
- package/dist/components/SectionNav/index.d.ts.map +1 -0
- package/dist/components/Select/Select.styles.d.ts +1 -1
- package/dist/components/Spinner/Spinner.styles.d.ts +1 -1
- package/dist/components/Stack/Stack.d.ts.map +1 -1
- package/dist/components/Stack/Stack.js +16 -1
- package/dist/components/Stack/Stack.types.d.ts +14 -1
- package/dist/components/Stack/Stack.types.d.ts.map +1 -1
- package/dist/components/Stepper/Stepper.d.ts +9 -0
- package/dist/components/Stepper/Stepper.d.ts.map +1 -0
- package/dist/components/Stepper/Stepper.js +81 -0
- package/dist/components/Stepper/Stepper.styles.d.ts +14 -0
- package/dist/components/Stepper/Stepper.styles.d.ts.map +1 -0
- package/dist/components/Stepper/Stepper.styles.js +40 -0
- package/dist/components/Stepper/Stepper.types.d.ts +17 -0
- package/dist/components/Stepper/Stepper.types.d.ts.map +1 -0
- package/dist/components/Stepper/index.d.ts +4 -0
- package/dist/components/Stepper/index.d.ts.map +1 -0
- package/dist/components/Steps/Steps.d.ts +9 -0
- package/dist/components/Steps/Steps.d.ts.map +1 -0
- package/dist/components/Steps/Steps.js +81 -0
- package/dist/components/Steps/Steps.styles.d.ts +14 -0
- package/dist/components/Steps/Steps.styles.d.ts.map +1 -0
- package/dist/components/Steps/Steps.styles.js +40 -0
- package/dist/components/Steps/Steps.types.d.ts +17 -0
- package/dist/components/Steps/Steps.types.d.ts.map +1 -0
- package/dist/components/Steps/index.d.ts +4 -0
- package/dist/components/Steps/index.d.ts.map +1 -0
- package/dist/components/SubNav/SubNav.d.ts +17 -0
- package/dist/components/SubNav/SubNav.d.ts.map +1 -0
- package/dist/components/SubNav/SubNav.js +87 -0
- package/dist/components/SubNav/SubNav.styles.d.ts +18 -0
- package/dist/components/SubNav/SubNav.styles.d.ts.map +1 -0
- package/dist/components/SubNav/SubNav.styles.js +33 -0
- package/dist/components/SubNav/SubNav.types.d.ts +45 -0
- package/dist/components/SubNav/SubNav.types.d.ts.map +1 -0
- package/dist/components/SubNav/index.d.ts +4 -0
- package/dist/components/SubNav/index.d.ts.map +1 -0
- package/dist/components/Switch/Switch.styles.d.ts +2 -2
- package/dist/components/Table/Table.styles.d.ts +1 -1
- package/dist/components/Tabs/Tabs.d.ts.map +1 -1
- package/dist/components/Tabs/Tabs.js +73 -6
- package/dist/components/Tabs/Tabs.styles.d.ts +10 -2
- package/dist/components/Tabs/Tabs.styles.d.ts.map +1 -1
- package/dist/components/Tabs/Tabs.styles.js +17 -2
- package/dist/components/Tabs/Tabs.types.d.ts +13 -0
- package/dist/components/Tabs/Tabs.types.d.ts.map +1 -1
- package/dist/components/Text/Text.d.ts.map +1 -1
- package/dist/components/Text/Text.js +4 -0
- package/dist/components/Text/Text.styles.d.ts +4 -2
- package/dist/components/Text/Text.styles.d.ts.map +1 -1
- package/dist/components/Text/Text.styles.js +16 -2
- package/dist/components/Text/Text.types.d.ts +1 -1
- package/dist/components/Text/Text.types.d.ts.map +1 -1
- package/dist/components/Textarea/Textarea.styles.d.ts +1 -1
- package/dist/components/VisuallyHidden/VisuallyHidden.d.ts +8 -0
- package/dist/components/VisuallyHidden/VisuallyHidden.d.ts.map +1 -0
- package/dist/components/VisuallyHidden/VisuallyHidden.js +14 -0
- package/dist/components/VisuallyHidden/index.d.ts +2 -0
- package/dist/components/VisuallyHidden/index.d.ts.map +1 -0
- package/dist/index.d.ts +13 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +32 -13
- package/dist/utils/gap.d.ts +21 -1
- package/dist/utils/gap.d.ts.map +1 -1
- package/dist/utils/gap.js +306 -46
- package/package.json +6 -6
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type * as React from 'react';
|
|
2
|
+
import type { PageHeaderTitleVariants, PageHeaderVariants } from './PageHeader.styles';
|
|
3
|
+
export interface PageHeaderProps extends Omit<React.HTMLAttributes<HTMLElement>, 'title'>, PageHeaderVariants, PageHeaderTitleVariants {
|
|
4
|
+
title: React.ReactNode;
|
|
5
|
+
description?: React.ReactNode;
|
|
6
|
+
/** Buttons or links aligned to the end of the title row. */
|
|
7
|
+
actions?: React.ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* "‹ Back" link above the title, rendered by LinkButton (`variant="back"`).
|
|
10
|
+
* Same-app links use next/link (base path aware); set `crossZone` for a
|
|
11
|
+
* full navigation to another app.
|
|
12
|
+
*/
|
|
13
|
+
back?: {
|
|
14
|
+
href: string;
|
|
15
|
+
label: React.ReactNode;
|
|
16
|
+
crossZone?: boolean;
|
|
17
|
+
ariaLabel?: string;
|
|
18
|
+
};
|
|
19
|
+
/** `id` of the heading, for `aria-labelledby` on a surrounding section. */
|
|
20
|
+
titleId?: string;
|
|
21
|
+
/** Heading element. Defaults to `h1`; use `h2` for sections within a page. */
|
|
22
|
+
as?: 'h1' | 'h2' | 'h3';
|
|
23
|
+
}
|
|
24
|
+
//# sourceMappingURL=PageHeader.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PageHeader.types.d.ts","sourceRoot":"","sources":["../../../src/components/PageHeader/PageHeader.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,uBAAuB,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAEvF,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC,EACtD,kBAAkB,EAClB,uBAAuB;IACzB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,4DAA4D;IAC5D,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,SAAS,CAAC,EAAE,OAAO,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACzF,2EAA2E;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8EAA8E;IAC9E,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACzB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageHeader/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC"}
|
|
@@ -1,15 +1,21 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { PaginationProps, PaginationContentProps, PaginationItemProps, PaginationLinkProps, PaginationPreviousProps, PaginationNextProps, PaginationEllipsisProps } from './Pagination.types';
|
|
2
|
+
import type { PaginationProps, PaginationContentProps, PaginationItemProps, PaginationLinkProps, PaginationPreviousProps, PaginationNextProps, PaginationEllipsisProps, PaginationSummaryProps } from './Pagination.types';
|
|
3
3
|
export declare const Pagination: React.FC<PaginationProps>;
|
|
4
4
|
export declare const PaginationContent: React.ForwardRefExoticComponent<Omit<PaginationContentProps, "ref"> & React.RefAttributes<HTMLUListElement>>;
|
|
5
5
|
export declare const PaginationItem: React.ForwardRefExoticComponent<Omit<PaginationItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
6
|
+
/** A page button, or (with `asChild`) a link such as `next/link`. */
|
|
6
7
|
export declare const PaginationLink: React.ForwardRefExoticComponent<PaginationLinkProps & React.RefAttributes<HTMLButtonElement>>;
|
|
7
8
|
export declare const PaginationPrevious: {
|
|
8
|
-
({
|
|
9
|
+
({ label, ariaLabel, ...props }: PaginationPreviousProps): React.JSX.Element;
|
|
9
10
|
displayName: string;
|
|
10
11
|
};
|
|
11
12
|
export declare const PaginationNext: {
|
|
12
|
-
({
|
|
13
|
+
({ label, ariaLabel, ...props }: PaginationNextProps): React.JSX.Element;
|
|
14
|
+
displayName: string;
|
|
15
|
+
};
|
|
16
|
+
/** "Page 2 of 5" between the step links (announced politely when it changes). */
|
|
17
|
+
export declare const PaginationSummary: {
|
|
18
|
+
({ className, ...props }: PaginationSummaryProps): React.JSX.Element;
|
|
13
19
|
displayName: string;
|
|
14
20
|
};
|
|
15
21
|
export declare const PaginationEllipsis: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EACV,eAAe,EACf,sBAAsB,EACtB,mBAAmB,EACnB,mBAAmB,EACnB,uBAAuB,EACvB,mBAAmB,EACnB,uBAAuB,EACvB,sBAAsB,EAEvB,MAAM,oBAAoB,CAAC;AAE5B,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAOhD,CAAC;AAGF,eAAO,MAAM,iBAAiB,8GAS7B,CAAC;AAGF,eAAO,MAAM,cAAc,wGAI1B,CAAC;AAGF,qEAAqE;AACrE,eAAO,MAAM,cAAc,+FAe1B,CAAC;AAsDF,eAAO,MAAM,kBAAkB;qCAI5B,uBAAuB;;CAAqF,CAAC;AAGhH,eAAO,MAAM,cAAc;qCAIxB,mBAAmB;;CAAiF,CAAC;AAGxG,iFAAiF;AACjF,eAAO,MAAM,iBAAiB;8BAA6B,sBAAsB;;CAUhF,CAAC;AAGF,eAAO,MAAM,kBAAkB;8BAG5B,uBAAuB;;CAUzB,CAAC"}
|
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
3
|
import * as React from 'react';
|
|
4
|
+
import { Slot } from '@radix-ui/react-slot';
|
|
4
5
|
import { cn } from '@timmbr/utils';
|
|
5
|
-
import { MoreHorizontal,
|
|
6
|
+
import { MoreHorizontal, ChevronLeft, ChevronRight } from '@timmbr/icons';
|
|
6
7
|
import { paginationLinkVariants } from './Pagination.styles.js';
|
|
8
|
+
import { Text } from '../Text/Text.js';
|
|
7
9
|
|
|
8
10
|
const Pagination = ({ className, ...props }) => /* @__PURE__ */ jsx(
|
|
9
11
|
"nav",
|
|
10
12
|
{
|
|
11
|
-
role: "navigation",
|
|
12
13
|
"aria-label": "pagination",
|
|
13
14
|
"data-slot": "pagination",
|
|
14
15
|
className: cn("mx-auto flex w-full justify-center font-sans", className),
|
|
@@ -33,52 +34,72 @@ const PaginationItem = React.forwardRef(
|
|
|
33
34
|
);
|
|
34
35
|
PaginationItem.displayName = "PaginationItem";
|
|
35
36
|
const PaginationLink = React.forwardRef(
|
|
36
|
-
({ className, isActive, size = "default", ...props }, ref) =>
|
|
37
|
-
"button"
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
37
|
+
({ className, isActive, size = "default", asChild = false, ...props }, ref) => {
|
|
38
|
+
const Comp = asChild ? Slot : "button";
|
|
39
|
+
return /* @__PURE__ */ jsx(
|
|
40
|
+
Comp,
|
|
41
|
+
{
|
|
42
|
+
ref,
|
|
43
|
+
...asChild ? {} : { type: "button" },
|
|
44
|
+
"aria-current": isActive ? "page" : void 0,
|
|
45
|
+
"data-slot": "pagination-link",
|
|
46
|
+
"data-active": isActive,
|
|
47
|
+
className: cn(paginationLinkVariants({ isActive, size }), className),
|
|
48
|
+
...props
|
|
49
|
+
}
|
|
50
|
+
);
|
|
51
|
+
}
|
|
48
52
|
);
|
|
49
53
|
PaginationLink.displayName = "PaginationLink";
|
|
50
|
-
const
|
|
54
|
+
const DefaultLink = ({ href, children, ...rest }) => /* @__PURE__ */ jsx("a", { href, ...rest, children });
|
|
55
|
+
function StepLink({
|
|
56
|
+
direction,
|
|
57
|
+
href,
|
|
58
|
+
linkComponent: LinkComponent = DefaultLink,
|
|
59
|
+
label,
|
|
60
|
+
ariaLabel,
|
|
61
|
+
disabled,
|
|
51
62
|
className,
|
|
63
|
+
children,
|
|
52
64
|
...props
|
|
53
|
-
})
|
|
54
|
-
|
|
55
|
-
{
|
|
56
|
-
"
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
65
|
+
}) {
|
|
66
|
+
const icon = direction === "previous" ? /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-4", "aria-hidden": "true" });
|
|
67
|
+
const content = /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
68
|
+
direction === "previous" && icon,
|
|
69
|
+
/* @__PURE__ */ jsx("span", { children: children ?? label }),
|
|
70
|
+
direction === "next" && icon
|
|
71
|
+
] });
|
|
72
|
+
const classes = cn("gap-1", direction === "previous" ? "pl-2.5" : "pr-2.5", className);
|
|
73
|
+
if (href && !disabled) {
|
|
74
|
+
return /* @__PURE__ */ jsx(PaginationLink, { asChild: true, "aria-label": ariaLabel, className: classes, ...props, children: /* @__PURE__ */ jsx(LinkComponent, { href, children: content }) });
|
|
63
75
|
}
|
|
64
|
-
);
|
|
76
|
+
return /* @__PURE__ */ jsx(PaginationLink, { "aria-label": ariaLabel, disabled, className: classes, ...props, children: content });
|
|
77
|
+
}
|
|
78
|
+
const PaginationPrevious = ({
|
|
79
|
+
label = "Previous",
|
|
80
|
+
ariaLabel = "Go to previous page",
|
|
81
|
+
...props
|
|
82
|
+
}) => /* @__PURE__ */ jsx(StepLink, { direction: "previous", label, ariaLabel, ...props });
|
|
65
83
|
PaginationPrevious.displayName = "PaginationPrevious";
|
|
66
84
|
const PaginationNext = ({
|
|
67
|
-
|
|
85
|
+
label = "Next",
|
|
86
|
+
ariaLabel = "Go to next page",
|
|
68
87
|
...props
|
|
69
|
-
}) => /* @__PURE__ */
|
|
70
|
-
|
|
88
|
+
}) => /* @__PURE__ */ jsx(StepLink, { direction: "next", label, ariaLabel, ...props });
|
|
89
|
+
PaginationNext.displayName = "PaginationNext";
|
|
90
|
+
const PaginationSummary = ({ className, ...props }) => /* @__PURE__ */ jsx(
|
|
91
|
+
Text,
|
|
71
92
|
{
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
93
|
+
as: "span",
|
|
94
|
+
variant: "body-2",
|
|
95
|
+
foreground: "muted",
|
|
96
|
+
"aria-live": "polite",
|
|
97
|
+
"data-slot": "pagination-summary",
|
|
98
|
+
className: cn("px-2", className),
|
|
99
|
+
...props
|
|
79
100
|
}
|
|
80
101
|
);
|
|
81
|
-
|
|
102
|
+
PaginationSummary.displayName = "PaginationSummary";
|
|
82
103
|
const PaginationEllipsis = ({
|
|
83
104
|
className,
|
|
84
105
|
...props
|
|
@@ -97,4 +118,4 @@ const PaginationEllipsis = ({
|
|
|
97
118
|
);
|
|
98
119
|
PaginationEllipsis.displayName = "PaginationEllipsis";
|
|
99
120
|
|
|
100
|
-
export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };
|
|
121
|
+
export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PaginationSummary };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const paginationLinkVariants: (props?: ({
|
|
2
2
|
isActive?: boolean | null | undefined;
|
|
3
|
-
size?: "
|
|
3
|
+
size?: "sm" | "lg" | "default" | null | undefined;
|
|
4
4
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
//# sourceMappingURL=Pagination.styles.d.ts.map
|
|
@@ -68,24 +68,32 @@ export interface PaginationLinkProps extends React.ButtonHTMLAttributes<HTMLButt
|
|
|
68
68
|
*/
|
|
69
69
|
children?: React.ReactNode;
|
|
70
70
|
}
|
|
71
|
-
/**
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
export interface PaginationPreviousProps extends PaginationLinkProps {
|
|
75
|
-
/**
|
|
76
|
-
* Custom label or override text for Previous button.
|
|
77
|
-
*/
|
|
71
|
+
/** Props of the link component used by Previous / Next (e.g. next/link). */
|
|
72
|
+
export interface PaginationLinkComponentProps {
|
|
73
|
+
href: string;
|
|
78
74
|
children?: React.ReactNode;
|
|
75
|
+
className?: string;
|
|
76
|
+
}
|
|
77
|
+
interface PaginationStepProps extends Omit<PaginationLinkProps, 'asChild'> {
|
|
78
|
+
/** Page URL: renders a link (URL-based paging) instead of a button. */
|
|
79
|
+
href?: string;
|
|
80
|
+
/** Link to render `href` with (e.g. next/link). Defaults to `<a>`. */
|
|
81
|
+
linkComponent?: React.ComponentType<PaginationLinkComponentProps>;
|
|
82
|
+
/** Visible text (localise it). */
|
|
83
|
+
label?: React.ReactNode;
|
|
84
|
+
/** Accessible name (localise it). */
|
|
85
|
+
ariaLabel?: string;
|
|
79
86
|
}
|
|
80
87
|
/**
|
|
81
|
-
*
|
|
88
|
+
* Previous page action (link with `href`, otherwise a button).
|
|
82
89
|
*/
|
|
83
|
-
export
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
90
|
+
export type PaginationPreviousProps = PaginationStepProps;
|
|
91
|
+
/**
|
|
92
|
+
* Next page action (link with `href`, otherwise a button).
|
|
93
|
+
*/
|
|
94
|
+
export type PaginationNextProps = PaginationStepProps;
|
|
95
|
+
/** "Page x of y" text. */
|
|
96
|
+
export type PaginationSummaryProps = React.ComponentProps<'span'>;
|
|
89
97
|
/**
|
|
90
98
|
* Decorative ellipsis indicator representing omitted pages in the range.
|
|
91
99
|
*/
|
|
@@ -95,4 +103,5 @@ export interface PaginationEllipsisProps extends React.ComponentProps<'span'> {
|
|
|
95
103
|
*/
|
|
96
104
|
className?: string;
|
|
97
105
|
}
|
|
106
|
+
export {};
|
|
98
107
|
//# sourceMappingURL=Pagination.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.types.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAClE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC;IACxE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC;IACrE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI,CAAC;IAC/B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED
|
|
1
|
+
{"version":3,"file":"Pagination.types.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAClE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC;IACxE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC;IACrE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI,CAAC;IAC/B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,4EAA4E;AAC5E,MAAM,WAAW,4BAA4B;IAC3C,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,mBAAoB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,SAAS,CAAC;IACxE,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,4BAA4B,CAAC,CAAC;IAClE,kCAAkC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG,mBAAmB,CAAC;AAE1D;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG,mBAAmB,CAAC;AAEtD,0BAA0B;AAC1B,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;AAElE;;GAEG;AACH,MAAM,WAAW,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC;IAC3E;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { PriceProps } from './Price.types';
|
|
3
|
+
/** Whole-number saving of `amount` against `compareAt`, or `null` when there is none. */
|
|
4
|
+
export declare function discountPercent(amount: number, compareAt?: number | null): number | null;
|
|
5
|
+
/**
|
|
6
|
+
* A price with an optional struck-through original price and the saving,
|
|
7
|
+
* e.g. ₹32,999 ~~₹66,999~~ 51% Off.
|
|
8
|
+
*/
|
|
9
|
+
export declare const Price: React.ForwardRefExoticComponent<PriceProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
//# sourceMappingURL=Price.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Price.d.ts","sourceRoot":"","sources":["../../../src/components/Price/Price.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,yFAAyF;AACzF,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAIxF;AAID;;;GAGG;AACH,eAAO,MAAM,KAAK,mFAwCjB,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { formatCurrency, cn } from '@timmbr/utils';
|
|
4
|
+
import { priceAmountVariants, priceCompareVariants, priceDiscountVariants, priceVariants } from './Price.styles.js';
|
|
5
|
+
|
|
6
|
+
function discountPercent(amount, compareAt) {
|
|
7
|
+
if (compareAt == null || compareAt <= 0 || compareAt <= amount) return null;
|
|
8
|
+
const percent = Math.round((compareAt - amount) / compareAt * 100);
|
|
9
|
+
return percent > 0 ? percent : null;
|
|
10
|
+
}
|
|
11
|
+
const defaultFormatDiscount = (percent) => `${percent}% Off`;
|
|
12
|
+
const Price = React.forwardRef(
|
|
13
|
+
({
|
|
14
|
+
amount,
|
|
15
|
+
compareAt,
|
|
16
|
+
currency = "INR",
|
|
17
|
+
locale = "en-IN",
|
|
18
|
+
showDiscount = true,
|
|
19
|
+
formatDiscount = defaultFormatDiscount,
|
|
20
|
+
srLabels,
|
|
21
|
+
size,
|
|
22
|
+
className,
|
|
23
|
+
...props
|
|
24
|
+
}, ref) => {
|
|
25
|
+
const percent = discountPercent(amount, compareAt);
|
|
26
|
+
return /* @__PURE__ */ jsxs("div", { ref, "data-slot": "price", className: cn(priceVariants({ size }), className), ...props, children: [
|
|
27
|
+
/* @__PURE__ */ jsxs("span", { className: priceAmountVariants({ size }), "data-slot": "price-amount", children: [
|
|
28
|
+
srLabels?.price && /* @__PURE__ */ jsxs("span", { className: "sr-only", children: [
|
|
29
|
+
srLabels.price,
|
|
30
|
+
" "
|
|
31
|
+
] }),
|
|
32
|
+
formatCurrency(amount, currency, locale)
|
|
33
|
+
] }),
|
|
34
|
+
percent !== null && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
35
|
+
/* @__PURE__ */ jsxs("s", { className: priceCompareVariants({ size }), "data-slot": "price-compare", children: [
|
|
36
|
+
srLabels?.compareAt && /* @__PURE__ */ jsxs("span", { className: "sr-only", children: [
|
|
37
|
+
srLabels.compareAt,
|
|
38
|
+
" "
|
|
39
|
+
] }),
|
|
40
|
+
formatCurrency(compareAt, currency, locale)
|
|
41
|
+
] }),
|
|
42
|
+
showDiscount && /* @__PURE__ */ jsx("span", { className: priceDiscountVariants({ size }), "data-slot": "price-discount", children: formatDiscount(percent) })
|
|
43
|
+
] })
|
|
44
|
+
] });
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
Price.displayName = "Price";
|
|
48
|
+
|
|
49
|
+
export { Price, discountPercent };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
export declare const priceVariants: (props?: ({
|
|
3
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const priceAmountVariants: (props?: ({
|
|
6
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
export declare const priceCompareVariants: (props?: ({
|
|
9
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
10
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
|
+
export declare const priceDiscountVariants: (props?: ({
|
|
12
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
13
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
14
|
+
export type PriceVariants = VariantProps<typeof priceVariants>;
|
|
15
|
+
//# sourceMappingURL=Price.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Price.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Price/Price.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,eAAO,MAAM,aAAa;;8EASxB,CAAC;AAEH,eAAO,MAAM,mBAAmB;;8EAS9B,CAAC;AAEH,eAAO,MAAM,oBAAoB;;8EAS/B,CAAC;AAEH,eAAO,MAAM,qBAAqB;;8EAShC,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { cva } from 'class-variance-authority';
|
|
2
|
+
|
|
3
|
+
const priceVariants = cva("inline-flex flex-wrap items-baseline font-sans text-foreground", {
|
|
4
|
+
variants: {
|
|
5
|
+
size: {
|
|
6
|
+
sm: "gap-x-1.5",
|
|
7
|
+
md: "gap-x-1",
|
|
8
|
+
lg: "gap-x-2"
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
defaultVariants: { size: "md" }
|
|
12
|
+
});
|
|
13
|
+
const priceAmountVariants = cva("font-semibold", {
|
|
14
|
+
variants: {
|
|
15
|
+
size: {
|
|
16
|
+
sm: "text-body-1",
|
|
17
|
+
md: "text-subtitle-1",
|
|
18
|
+
lg: "text-h5 font-sans"
|
|
19
|
+
}
|
|
20
|
+
},
|
|
21
|
+
defaultVariants: { size: "md" }
|
|
22
|
+
});
|
|
23
|
+
const priceCompareVariants = cva("text-muted-foreground line-through", {
|
|
24
|
+
variants: {
|
|
25
|
+
size: {
|
|
26
|
+
sm: "text-body-3",
|
|
27
|
+
md: "text-body-3",
|
|
28
|
+
lg: "text-body-2"
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
defaultVariants: { size: "md" }
|
|
32
|
+
});
|
|
33
|
+
const priceDiscountVariants = cva("font-semibold text-success", {
|
|
34
|
+
variants: {
|
|
35
|
+
size: {
|
|
36
|
+
sm: "text-body-3",
|
|
37
|
+
md: "ms-1 text-body-2",
|
|
38
|
+
lg: "text-body-1"
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
defaultVariants: { size: "md" }
|
|
42
|
+
});
|
|
43
|
+
|
|
44
|
+
export { priceAmountVariants, priceCompareVariants, priceDiscountVariants, priceVariants };
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type * as React from 'react';
|
|
2
|
+
import type { PriceVariants } from './Price.styles';
|
|
3
|
+
export interface PriceProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>, PriceVariants {
|
|
4
|
+
/** Selling price. */
|
|
5
|
+
amount: number;
|
|
6
|
+
/** Original price; shown struck through when higher than `amount`. */
|
|
7
|
+
compareAt?: number | null;
|
|
8
|
+
/** ISO 4217 code (default `INR`). */
|
|
9
|
+
currency?: string;
|
|
10
|
+
/** BCP 47 locale for formatting (default `en-IN`). */
|
|
11
|
+
locale?: string;
|
|
12
|
+
/** Show the saving as a percentage, e.g. "51% Off" (default `true`). */
|
|
13
|
+
showDiscount?: boolean;
|
|
14
|
+
/** Text of the discount, from the rounded percentage (default `"51% Off"`). */
|
|
15
|
+
formatDiscount?: (percent: number) => string;
|
|
16
|
+
/** Screen-reader prefixes for the two prices. */
|
|
17
|
+
srLabels?: {
|
|
18
|
+
price?: string;
|
|
19
|
+
compareAt?: string;
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
//# sourceMappingURL=Price.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Price.types.d.ts","sourceRoot":"","sources":["../../../src/components/Price/Price.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,aAAa;IACvG,qBAAqB;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sDAAsD;IACtD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wEAAwE;IACxE,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,+EAA+E;IAC/E,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7C,iDAAiD;IACjD,QAAQ,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACnD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Price/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type VariantProps } from 'class-variance-authority';
|
|
2
2
|
export declare const progressRootVariants: (props?: ({
|
|
3
|
-
size?: "
|
|
3
|
+
size?: "sm" | "lg" | "default" | null | undefined;
|
|
4
4
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
export declare const progressIndicatorVariants: (props?: ({
|
|
6
6
|
variant?: "default" | "destructive" | "success" | "warning" | "primary" | null | undefined;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { type VariantProps } from 'class-variance-authority';
|
|
2
2
|
export declare const radioItemVariants: (props?: ({
|
|
3
|
-
size?: "
|
|
3
|
+
size?: "sm" | "md" | "lg" | "default" | null | undefined;
|
|
4
4
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
export declare const radioIndicatorVariants: (props?: ({
|
|
6
|
-
size?: "
|
|
6
|
+
size?: "sm" | "md" | "lg" | "default" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export type RadioItemVariants = VariantProps<typeof radioItemVariants>;
|
|
9
9
|
//# sourceMappingURL=Radio.styles.d.ts.map
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { RatingProps } from './Rating.types';
|
|
3
|
+
/** Read-only average rating: "4.5 ★ (817)". */
|
|
4
|
+
export declare const Rating: React.ForwardRefExoticComponent<RatingProps & React.RefAttributes<HTMLDivElement>>;
|
|
5
|
+
//# sourceMappingURL=Rating.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,+CAA+C;AAC/C,eAAO,MAAM,MAAM,oFA4BlB,CAAC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { cn } from '@timmbr/utils';
|
|
4
|
+
import { Star } from '@timmbr/icons';
|
|
5
|
+
import { ratingVariants } from './Rating.styles.js';
|
|
6
|
+
|
|
7
|
+
const Rating = React.forwardRef(
|
|
8
|
+
({ value, max = 5, count, locale = "en-IN", label, size, className, ...props }, ref) => {
|
|
9
|
+
const shown = new Intl.NumberFormat(locale, { maximumFractionDigits: 1 }).format(value);
|
|
10
|
+
const counted = count !== void 0 ? new Intl.NumberFormat(locale).format(count) : void 0;
|
|
11
|
+
const accessibleName = label ?? `Rated ${shown} out of ${max}${counted !== void 0 ? ` from ${counted} ratings` : ""}`;
|
|
12
|
+
return /* @__PURE__ */ jsxs(
|
|
13
|
+
"div",
|
|
14
|
+
{
|
|
15
|
+
ref,
|
|
16
|
+
role: "img",
|
|
17
|
+
"aria-label": accessibleName,
|
|
18
|
+
"data-slot": "rating",
|
|
19
|
+
className: cn(ratingVariants({ size }), className),
|
|
20
|
+
...props,
|
|
21
|
+
children: [
|
|
22
|
+
/* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "inline-flex items-center gap-0.5", children: [
|
|
23
|
+
/* @__PURE__ */ jsx("span", { className: "font-medium", children: shown }),
|
|
24
|
+
/* @__PURE__ */ jsx(Star, { className: "fill-warning text-warning" })
|
|
25
|
+
] }),
|
|
26
|
+
counted !== void 0 && /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "text-muted-foreground", children: [
|
|
27
|
+
"(",
|
|
28
|
+
counted,
|
|
29
|
+
")"
|
|
30
|
+
] })
|
|
31
|
+
]
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
}
|
|
35
|
+
);
|
|
36
|
+
Rating.displayName = "Rating";
|
|
37
|
+
|
|
38
|
+
export { Rating };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
export declare const ratingVariants: (props?: ({
|
|
3
|
+
size?: "sm" | "md" | null | undefined;
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export type RatingVariants = VariantProps<typeof ratingVariants>;
|
|
6
|
+
//# sourceMappingURL=Rating.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Rating.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,eAAO,MAAM,cAAc;;8EAQzB,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { cva } from 'class-variance-authority';
|
|
2
|
+
|
|
3
|
+
const ratingVariants = cva("inline-flex items-center font-sans text-foreground", {
|
|
4
|
+
variants: {
|
|
5
|
+
size: {
|
|
6
|
+
sm: "gap-1 text-body-3 [&_svg]:size-3.5",
|
|
7
|
+
md: "gap-1.5 text-body-2 [&_svg]:size-4"
|
|
8
|
+
}
|
|
9
|
+
},
|
|
10
|
+
defaultVariants: { size: "sm" }
|
|
11
|
+
});
|
|
12
|
+
|
|
13
|
+
export { ratingVariants };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type * as React from 'react';
|
|
2
|
+
import type { RatingVariants } from './Rating.styles';
|
|
3
|
+
export interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>, RatingVariants {
|
|
4
|
+
/** Average rating, e.g. 4.5. */
|
|
5
|
+
value: number;
|
|
6
|
+
/** Highest possible rating (default 5). */
|
|
7
|
+
max?: number;
|
|
8
|
+
/** Number of ratings or reviews, shown as "(817)". */
|
|
9
|
+
count?: number;
|
|
10
|
+
/** BCP 47 locale for the numbers (default `en-IN`). */
|
|
11
|
+
locale?: string;
|
|
12
|
+
/**
|
|
13
|
+
* Accessible description; the visible "4.5 ★ (817)" is hidden from screen
|
|
14
|
+
* readers. Default: "Rated 4.5 out of 5 from 817 ratings".
|
|
15
|
+
*/
|
|
16
|
+
label?: string;
|
|
17
|
+
}
|
|
18
|
+
//# sourceMappingURL=Rating.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Rating.types.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,cAAc;IACzG,gCAAgC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uDAAuD;IACvD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { ResponsiveDialogContentProps, ResponsiveDialogMode, ResponsiveDialogProps, ResponsiveDialogSectionProps, ResponsiveDialogFormProps } from './ResponsiveDialog.types';
|
|
3
|
+
export declare const RESPONSIVE_DIALOG_BREAKPOINT = "(min-width: 640px)";
|
|
4
|
+
/** Whether the surrounding ResponsiveDialog renders as a `dialog` or a bottom `drawer`. */
|
|
5
|
+
export declare const useResponsiveDialogMode: () => ResponsiveDialogMode;
|
|
6
|
+
/**
|
|
7
|
+
* A centred Dialog on larger screens and a bottom sheet (Drawer) on phones,
|
|
8
|
+
* with one API. Use it for forms and pickers; keep short confirmations in
|
|
9
|
+
* AlertDialog. Before hydration it renders as a dialog.
|
|
10
|
+
*/
|
|
11
|
+
export declare function ResponsiveDialog({ breakpoint, children, ...props }: ResponsiveDialogProps): React.JSX.Element;
|
|
12
|
+
export declare namespace ResponsiveDialog {
|
|
13
|
+
var displayName: string;
|
|
14
|
+
}
|
|
15
|
+
export declare const ResponsiveDialogContent: React.ForwardRefExoticComponent<ResponsiveDialogContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
16
|
+
export declare const ResponsiveDialogHeader: React.FC<ResponsiveDialogSectionProps>;
|
|
17
|
+
export declare const ResponsiveDialogBody: React.FC<ResponsiveDialogSectionProps>;
|
|
18
|
+
/** Actions; pinned to the bottom of the sheet on phones (above the keyboard and home bar). */
|
|
19
|
+
export declare const ResponsiveDialogFooter: React.FC<ResponsiveDialogSectionProps>;
|
|
20
|
+
export declare const ResponsiveDialogTitle: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dialog").DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
|
|
21
|
+
export declare const ResponsiveDialogDescription: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
|
|
22
|
+
/**
|
|
23
|
+
* A form that wraps ResponsiveDialogBody + ResponsiveDialogFooter, so the
|
|
24
|
+
* submit button can live in the (pinned) footer and the fields still scroll.
|
|
25
|
+
*/
|
|
26
|
+
export declare const ResponsiveDialogForm: React.ForwardRefExoticComponent<ResponsiveDialogFormProps & React.RefAttributes<HTMLFormElement>>;
|
|
27
|
+
/** Same Radix close in both modes. */
|
|
28
|
+
export declare const ResponsiveDialogClose: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
|
|
29
|
+
//# sourceMappingURL=ResponsiveDialog.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ResponsiveDialog.d.ts","sourceRoot":"","sources":["../../../src/components/ResponsiveDialog/ResponsiveDialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAqB/B,OAAO,KAAK,EACV,4BAA4B,EAC5B,oBAAoB,EACpB,qBAAqB,EACrB,4BAA4B,EAC5B,yBAAyB,EAC1B,MAAM,0BAA0B,CAAC;AAIlC,eAAO,MAAM,4BAA4B,uBAAuB,CAAC;AAIjE,2FAA2F;AAC3F,eAAO,MAAM,uBAAuB,4BAAsC,CAAC;AAE3E;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,UAAyC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,qBAUxH;yBAVe,gBAAgB;;;AAahC,eAAO,MAAM,uBAAuB,qGAoBnC,CAAC;AAGF,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAC0B,CAAC;AAGrG,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CACwB,CAAC;AAGjG,8FAA8F;AAC9F,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAKvE,CAAC;AAGJ,eAAO,MAAM,qBAAqB,4OAKjC,CAAC;AAGF,eAAO,MAAM,2BAA2B,wPASvC,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,oBAAoB,mGAYhC,CAAC;AAGF,sCAAsC;AACtC,eAAO,MAAM,qBAAqB,6HAAc,CAAC"}
|