@brycks/core-front 0.5.0 → 0.7.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/dist/components/data/List/List.cjs +1 -1
- package/dist/components/data/List/List.cjs.map +1 -1
- package/dist/components/data/List/List.js +68 -148
- package/dist/components/data/List/List.js.map +1 -1
- package/dist/components/data/Table/Table.cjs +1 -1
- package/dist/components/data/Table/Table.cjs.map +1 -1
- package/dist/components/data/Table/Table.js +142 -224
- package/dist/components/data/Table/Table.js.map +1 -1
- package/dist/components/data/TreeView/TreeView.cjs +1 -1
- package/dist/components/data/TreeView/TreeView.cjs.map +1 -1
- package/dist/components/data/TreeView/TreeView.js +141 -182
- package/dist/components/data/TreeView/TreeView.js.map +1 -1
- package/dist/components/feedback/Drawer/Drawer.cjs +1 -22
- package/dist/components/feedback/Drawer/Drawer.cjs.map +1 -1
- package/dist/components/feedback/Drawer/Drawer.js +84 -184
- package/dist/components/feedback/Drawer/Drawer.js.map +1 -1
- package/dist/components/feedback/Modal/Modal.cjs +1 -1
- package/dist/components/feedback/Modal/Modal.cjs.map +1 -1
- package/dist/components/feedback/Modal/Modal.js +65 -150
- package/dist/components/feedback/Modal/Modal.js.map +1 -1
- package/dist/components/feedback/Toast/Toast.cjs +1 -10
- package/dist/components/feedback/Toast/Toast.cjs.map +1 -1
- package/dist/components/feedback/Toast/Toast.js +94 -187
- package/dist/components/feedback/Toast/Toast.js.map +1 -1
- package/dist/components/form/Checkbox/Checkbox.cjs +1 -1
- package/dist/components/form/Checkbox/Checkbox.js +11 -11
- package/dist/components/form/Combobox/Combobox.cjs +1 -6
- package/dist/components/form/Combobox/Combobox.cjs.map +1 -1
- package/dist/components/form/Combobox/Combobox.js +187 -283
- package/dist/components/form/Combobox/Combobox.js.map +1 -1
- package/dist/components/form/Input/Input.cjs +1 -1
- package/dist/components/form/Input/Input.cjs.map +1 -1
- package/dist/components/form/Input/Input.js +38 -133
- package/dist/components/form/Input/Input.js.map +1 -1
- package/dist/components/form/Select/Select.cjs +1 -1
- package/dist/components/form/Select/Select.cjs.map +1 -1
- package/dist/components/form/Select/Select.js +36 -82
- package/dist/components/form/Select/Select.js.map +1 -1
- package/dist/components/form/TagInput/TagInput.cjs +1 -1
- package/dist/components/form/TagInput/TagInput.js +8 -8
- package/dist/components/form/Textarea/Textarea.cjs +1 -1
- package/dist/components/form/Textarea/Textarea.cjs.map +1 -1
- package/dist/components/form/Textarea/Textarea.js +66 -95
- package/dist/components/form/Textarea/Textarea.js.map +1 -1
- package/dist/components/navigation/ContextMenu/ContextMenu.cjs +1 -1
- package/dist/components/navigation/ContextMenu/ContextMenu.js +9 -9
- package/dist/components/navigation/Menu/Menu.cjs +1 -1
- package/dist/components/navigation/Menu/Menu.cjs.map +1 -1
- package/dist/components/navigation/Menu/Menu.js +70 -135
- package/dist/components/navigation/Menu/Menu.js.map +1 -1
- package/dist/components/navigation/Pagination/Pagination.cjs +1 -1
- package/dist/components/navigation/Pagination/Pagination.cjs.map +1 -1
- package/dist/components/navigation/Pagination/Pagination.js +87 -157
- package/dist/components/navigation/Pagination/Pagination.js.map +1 -1
- package/dist/components/primitives/Button/Button.cjs +1 -1
- package/dist/components/primitives/Button/Button.cjs.map +1 -1
- package/dist/components/primitives/Button/Button.js +47 -43
- package/dist/components/primitives/Button/Button.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.cjs","sources":["../../../../src/components/navigation/Pagination/Pagination.tsx"],"sourcesContent":["/**\n * Pagination Component\n *\n * A pagination control for navigating through pages.\n * Supports different sizes and display modes.\n */\n\nimport { forwardRef, useMemo, type CSSProperties, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentGap } from '../../../design-system/primitives'\n\nexport type PaginationSize = 'sm' | 'md' | 'lg'\nexport type PaginationVariant = 'default' | 'simple' | 'minimal'\n\nexport interface PaginationLabels {\n /** aria-label of the nav landmark */\n navigation?: string\n /** aria-label of the first-page button */\n first?: string\n /** aria-label of the previous-page button */\n previous?: string\n /** aria-label of the next-page button */\n next?: string\n /** aria-label of the last-page button */\n last?: string\n /** aria-label of a numbered page button */\n page?: (page: number) => string\n /** Visible text of the `simple` variant */\n of?: (page: number, totalPages: number) => string\n}\n\nconst defaultLabels: Required<PaginationLabels> = {\n navigation: 'Pagination',\n first: 'First page',\n previous: 'Previous page',\n next: 'Next page',\n last: 'Last page',\n page: (page) => `Page ${page}`,\n of: (page, totalPages) => `Page ${page} of ${totalPages}`,\n}\n\nexport interface PaginationProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {\n /** Current page (1-indexed) */\n page: number\n /** Total number of pages */\n totalPages: number\n /** Callback when page changes */\n onChange: (page: number) => void\n /** Pagination size */\n size?: PaginationSize\n /** Pagination variant */\n variant?: PaginationVariant\n /** Number of sibling pages to show on each side */\n siblingCount?: number\n /** Whether to show first/last buttons */\n showFirstLast?: boolean\n /** Whether to show prev/next buttons */\n showPrevNext?: boolean\n /** Whether the component is disabled */\n disabled?: boolean\n /** Localizable labels (merged over English defaults) */\n labels?: PaginationLabels\n /** Custom class name */\n className?: string\n /** Test ID */\n testId?: string\n}\n\nconst sizeConfig: Record<PaginationSize, { height: number; fontSize: number; gap: number; minWidth: number }> = {\n sm: { height: spacing[7], fontSize: fontSizes.sm, gap: spacing[1], minWidth: spacing[7] },\n md: { height: spacing[9], fontSize: fontSizes.base, gap: componentGap.sm, minWidth: spacing[9] },\n lg: { height: spacing[11], fontSize: fontSizes.md, gap: spacing[2], minWidth: spacing[11] },\n}\n\nfunction ChevronLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M10 12L6 8l4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M6 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M11 12l-4-4 4-4M7 12l-4-4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M5 4l4 4-4 4M9 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(function Pagination(\n {\n page,\n totalPages,\n onChange,\n size = 'md',\n variant = 'default',\n siblingCount = 1,\n showFirstLast = true,\n showPrevNext = true,\n disabled = false,\n labels,\n className,\n style,\n testId,\n ...props\n },\n ref\n) {\n const config = sizeConfig[size]\n const text = { ...defaultLabels, ...labels }\n\n // Generate page numbers to display\n const pages = useMemo(() => {\n if (variant === 'minimal' || variant === 'simple') {\n return []\n }\n\n const range: (number | 'ellipsis')[] = []\n const leftSibling = Math.max(page - siblingCount, 1)\n const rightSibling = Math.min(page + siblingCount, totalPages)\n\n const showLeftEllipsis = leftSibling > 2\n const showRightEllipsis = rightSibling < totalPages - 1\n\n if (!showLeftEllipsis) {\n for (let i = 1; i <= Math.min(3 + siblingCount, totalPages); i++) {\n range.push(i)\n }\n if (showRightEllipsis) {\n range.push('ellipsis')\n range.push(totalPages)\n }\n } else if (!showRightEllipsis) {\n range.push(1)\n range.push('ellipsis')\n for (let i = Math.max(totalPages - 2 - siblingCount, 1); i <= totalPages; i++) {\n range.push(i)\n }\n } else {\n range.push(1)\n range.push('ellipsis')\n for (let i = leftSibling; i <= rightSibling; i++) {\n range.push(i)\n }\n range.push('ellipsis')\n range.push(totalPages)\n }\n\n return range\n }, [page, totalPages, siblingCount, variant])\n\n const containerStyle: CSSProperties = {\n display: 'flex',\n alignItems: 'center',\n gap: config.gap,\n ...style,\n }\n\n const getButtonStyle = (isActive: boolean, isDisabled: boolean): CSSProperties => ({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: config.minWidth,\n height: config.height,\n padding: `0 ${config.gap + 4}px`,\n fontSize: config.fontSize,\n fontWeight: isActive ? 600 : 500,\n color: isDisabled\n ? 'var(--brycks-foreground-disabled)'\n : isActive\n ? 'var(--brycks-primary-default)'\n : 'var(--brycks-foreground-default)',\n backgroundColor: isActive ? 'var(--brycks-primary-muted)' : 'transparent',\n border: 'none',\n borderRadius: 'var(--brycks-radius-md)',\n cursor: isDisabled ? 'not-allowed' : 'pointer',\n transition: `all ${durations.quick}ms ${easings.easeOut}`,\n })\n\n const ellipsisStyle: CSSProperties = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: config.minWidth,\n height: config.height,\n color: 'var(--brycks-foreground-muted)',\n fontSize: config.fontSize,\n }\n\n const infoStyle: CSSProperties = {\n fontSize: config.fontSize,\n color: 'var(--brycks-foreground-muted)',\n padding: `0 ${config.gap}px`,\n }\n\n const handlePageChange = (newPage: number) => {\n if (newPage >= 1 && newPage <= totalPages && newPage !== page && !disabled) {\n onChange(newPage)\n }\n }\n\n return (\n <nav\n ref={ref}\n role=\"navigation\"\n aria-label={text.navigation}\n className={cx('brycks-pagination', `brycks-pagination--${size}`, `brycks-pagination--${variant}`, className)}\n style={containerStyle}\n data-testid={testId}\n {...props}\n >\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.first}\n disabled={page === 1 || disabled}\n style={getButtonStyle(false, page === 1 || disabled)}\n onClick={() => handlePageChange(1)}\n onMouseEnter={(e) => {\n if (page !== 1 && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronsLeftIcon />\n </button>\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.previous}\n disabled={page === 1 || disabled}\n style={getButtonStyle(false, page === 1 || disabled)}\n onClick={() => handlePageChange(page - 1)}\n onMouseEnter={(e) => {\n if (page !== 1 && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronLeftIcon />\n </button>\n )}\n\n {variant === 'simple' || variant === 'minimal' ? (\n <span style={infoStyle}>\n {variant === 'minimal' ? `${page} / ${totalPages}` : text.of(page, totalPages)}\n </span>\n ) : (\n pages.map((p, index) =>\n p === 'ellipsis' ? (\n <span key={`ellipsis-${index}`} style={ellipsisStyle}>\n ...\n </span>\n ) : (\n <button\n key={p}\n type=\"button\"\n aria-label={text.page(p)}\n aria-current={p === page ? 'page' : undefined}\n disabled={disabled}\n style={getButtonStyle(p === page, disabled)}\n onClick={() => handlePageChange(p)}\n onMouseEnter={(e) => {\n if (p !== page && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n if (p !== page) {\n e.currentTarget.style.backgroundColor = 'transparent'\n }\n }}\n >\n {p}\n </button>\n )\n )\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.next}\n disabled={page === totalPages || disabled}\n style={getButtonStyle(false, page === totalPages || disabled)}\n onClick={() => handlePageChange(page + 1)}\n onMouseEnter={(e) => {\n if (page !== totalPages && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronRightIcon />\n </button>\n )}\n\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.last}\n disabled={page === totalPages || disabled}\n style={getButtonStyle(false, page === totalPages || disabled)}\n onClick={() => handlePageChange(totalPages)}\n onMouseEnter={(e) => {\n if (page !== totalPages && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronsRightIcon />\n </button>\n )}\n </nav>\n )\n})\n\nPagination.displayName = 'Pagination'\n"],"names":["defaultLabels","page","totalPages","sizeConfig","spacing","fontSizes","componentGap","ChevronLeftIcon","jsx","ChevronRightIcon","ChevronsLeftIcon","ChevronsRightIcon","Pagination","forwardRef","onChange","size","variant","siblingCount","showFirstLast","showPrevNext","disabled","labels","className","style","testId","props","ref","config","text","pages","useMemo","range","leftSibling","rightSibling","showLeftEllipsis","showRightEllipsis","containerStyle","getButtonStyle","isActive","isDisabled","durations","easings","ellipsisStyle","infoStyle","handlePageChange","newPage","jsxs","cx","e","p","index"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Pagination.cjs","sources":["../../../../src/components/navigation/Pagination/Pagination.tsx"],"sourcesContent":["/**\n * Pagination Component\n *\n * A pagination control for navigating through pages.\n * Supports different sizes and display modes.\n */\n\nimport { forwardRef, useMemo, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport type PaginationSize = 'sm' | 'md' | 'lg'\nexport type PaginationVariant = 'default' | 'simple' | 'minimal'\n\nexport interface PaginationLabels {\n /** aria-label of the nav landmark */\n navigation?: string\n /** aria-label of the first-page button */\n first?: string\n /** aria-label of the previous-page button */\n previous?: string\n /** aria-label of the next-page button */\n next?: string\n /** aria-label of the last-page button */\n last?: string\n /** aria-label of a numbered page button */\n page?: (page: number) => string\n /** Visible text of the `simple` variant */\n of?: (page: number, totalPages: number) => string\n}\n\nconst defaultLabels: Required<PaginationLabels> = {\n navigation: 'Pagination',\n first: 'First page',\n previous: 'Previous page',\n next: 'Next page',\n last: 'Last page',\n page: (page) => `Page ${page}`,\n of: (page, totalPages) => `Page ${page} of ${totalPages}`,\n}\n\nexport interface PaginationProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {\n /** Current page (1-indexed) */\n page: number\n /** Total number of pages */\n totalPages: number\n /** Callback when page changes */\n onChange: (page: number) => void\n /** Pagination size */\n size?: PaginationSize\n /** Pagination variant */\n variant?: PaginationVariant\n /** Number of sibling pages to show on each side */\n siblingCount?: number\n /** Whether to show first/last buttons */\n showFirstLast?: boolean\n /** Whether to show prev/next buttons */\n showPrevNext?: boolean\n /** Whether the component is disabled */\n disabled?: boolean\n /** Localizable labels (merged over English defaults) */\n labels?: PaginationLabels\n /** Custom class name */\n className?: string\n /** Test ID */\n testId?: string\n}\n\nfunction ChevronLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M10 12L6 8l4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M6 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M11 12l-4-4 4-4M7 12l-4-4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M5 4l4 4-4 4M9 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(function Pagination(\n {\n page,\n totalPages,\n onChange,\n size = 'md',\n variant = 'default',\n siblingCount = 1,\n showFirstLast = true,\n showPrevNext = true,\n disabled = false,\n labels,\n className,\n style,\n testId,\n ...props\n },\n ref\n) {\n const text = { ...defaultLabels, ...labels }\n\n // Generate page numbers to display\n const pages = useMemo(() => {\n if (variant === 'minimal' || variant === 'simple') {\n return []\n }\n\n const range: (number | 'ellipsis')[] = []\n const leftSibling = Math.max(page - siblingCount, 1)\n const rightSibling = Math.min(page + siblingCount, totalPages)\n\n const showLeftEllipsis = leftSibling > 2\n const showRightEllipsis = rightSibling < totalPages - 1\n\n if (!showLeftEllipsis) {\n for (let i = 1; i <= Math.min(3 + siblingCount, totalPages); i++) {\n range.push(i)\n }\n if (showRightEllipsis) {\n range.push('ellipsis')\n range.push(totalPages)\n }\n } else if (!showRightEllipsis) {\n range.push(1)\n range.push('ellipsis')\n for (let i = Math.max(totalPages - 2 - siblingCount, 1); i <= totalPages; i++) {\n range.push(i)\n }\n } else {\n range.push(1)\n range.push('ellipsis')\n for (let i = leftSibling; i <= rightSibling; i++) {\n range.push(i)\n }\n range.push('ellipsis')\n range.push(totalPages)\n }\n\n return range\n }, [page, totalPages, siblingCount, variant])\n\n const handlePageChange = (newPage: number) => {\n if (newPage >= 1 && newPage <= totalPages && newPage !== page && !disabled) {\n onChange(newPage)\n }\n }\n\n return (\n <nav\n ref={ref}\n role=\"navigation\"\n aria-label={text.navigation}\n className={cx('brycks-pagination', `brycks-pagination--${size}`, `brycks-pagination--${variant}`, className)}\n style={style}\n data-testid={testId}\n {...props}\n >\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.first}\n disabled={page === 1 || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(1)}\n >\n <ChevronsLeftIcon />\n </button>\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.previous}\n disabled={page === 1 || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(page - 1)}\n >\n <ChevronLeftIcon />\n </button>\n )}\n\n {variant === 'simple' || variant === 'minimal' ? (\n <span className=\"brycks-pagination__info\">\n {variant === 'minimal' ? `${page} / ${totalPages}` : text.of(page, totalPages)}\n </span>\n ) : (\n pages.map((p, index) =>\n p === 'ellipsis' ? (\n <span key={`ellipsis-${index}`} className=\"brycks-pagination__ellipsis\">\n ...\n </span>\n ) : (\n <button\n key={p}\n type=\"button\"\n aria-label={text.page(p)}\n aria-current={p === page ? 'page' : undefined}\n disabled={disabled}\n className={cx('brycks-pagination__button', p === page && 'brycks-pagination__button--active')}\n onClick={() => handlePageChange(p)}\n >\n {p}\n </button>\n )\n )\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.next}\n disabled={page === totalPages || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(page + 1)}\n >\n <ChevronRightIcon />\n </button>\n )}\n\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.last}\n disabled={page === totalPages || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(totalPages)}\n >\n <ChevronsRightIcon />\n </button>\n )}\n </nav>\n )\n})\n\nPagination.displayName = 'Pagination'\n"],"names":["defaultLabels","page","totalPages","ChevronLeftIcon","jsx","ChevronRightIcon","ChevronsLeftIcon","ChevronsRightIcon","Pagination","forwardRef","onChange","size","variant","siblingCount","showFirstLast","showPrevNext","disabled","labels","className","style","testId","props","ref","text","pages","useMemo","range","leftSibling","rightSibling","showLeftEllipsis","showRightEllipsis","i","handlePageChange","newPage","jsxs","cx","p","index"],"mappings":"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"}
|
|
@@ -1,213 +1,143 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { cx as
|
|
4
|
-
|
|
5
|
-
import { fontSizes as k } from "../../../design-system/tokens/typography.js";
|
|
6
|
-
import { componentGap as q } from "../../../design-system/primitives/sizing.js";
|
|
7
|
-
import { durations as G, easings as O } from "../../../design-system/tokens/motion.js";
|
|
8
|
-
const F = {
|
|
1
|
+
import { jsxs as $, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as j, useMemo as w } from "react";
|
|
3
|
+
import { cx as k } from "../../../utils/styles.js";
|
|
4
|
+
const B = {
|
|
9
5
|
navigation: "Pagination",
|
|
10
6
|
first: "First page",
|
|
11
7
|
previous: "Previous page",
|
|
12
8
|
next: "Next page",
|
|
13
9
|
last: "Last page",
|
|
14
|
-
page: (
|
|
15
|
-
of: (
|
|
16
|
-
}, H = {
|
|
17
|
-
sm: { height: u[7], fontSize: k.sm, gap: u[1], minWidth: u[7] },
|
|
18
|
-
md: { height: u[9], fontSize: k.base, gap: q.sm, minWidth: u[9] },
|
|
19
|
-
lg: { height: u[11], fontSize: k.md, gap: u[2], minWidth: u[11] }
|
|
10
|
+
page: (h) => `Page ${h}`,
|
|
11
|
+
of: (h, t) => `Page ${h} of ${t}`
|
|
20
12
|
};
|
|
21
|
-
function
|
|
22
|
-
return /* @__PURE__ */
|
|
13
|
+
function I() {
|
|
14
|
+
return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ n("path", { d: "M10 12L6 8l4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
23
15
|
}
|
|
24
|
-
function
|
|
25
|
-
return /* @__PURE__ */
|
|
16
|
+
function R() {
|
|
17
|
+
return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ n("path", { d: "M6 4l4 4-4 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
26
18
|
}
|
|
27
|
-
function
|
|
28
|
-
return /* @__PURE__ */
|
|
19
|
+
function W() {
|
|
20
|
+
return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ n("path", { d: "M11 12l-4-4 4-4M7 12l-4-4 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
29
21
|
}
|
|
30
|
-
function
|
|
31
|
-
return /* @__PURE__ */
|
|
22
|
+
function E() {
|
|
23
|
+
return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ n("path", { d: "M5 4l4 4-4 4M9 4l4 4-4 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
32
24
|
}
|
|
33
|
-
const
|
|
34
|
-
page:
|
|
35
|
-
totalPages:
|
|
36
|
-
onChange:
|
|
25
|
+
const S = j(function({
|
|
26
|
+
page: t,
|
|
27
|
+
totalPages: o,
|
|
28
|
+
onChange: b,
|
|
37
29
|
size: y = "md",
|
|
38
|
-
variant:
|
|
39
|
-
siblingCount:
|
|
40
|
-
showFirstLast:
|
|
41
|
-
showPrevNext:
|
|
42
|
-
disabled:
|
|
43
|
-
labels:
|
|
30
|
+
variant: r = "default",
|
|
31
|
+
siblingCount: c = 1,
|
|
32
|
+
showFirstLast: p = !0,
|
|
33
|
+
showPrevNext: d = !0,
|
|
34
|
+
disabled: l = !1,
|
|
35
|
+
labels: _,
|
|
44
36
|
className: x,
|
|
45
37
|
style: L,
|
|
46
|
-
testId:
|
|
47
|
-
...
|
|
48
|
-
},
|
|
49
|
-
const s =
|
|
50
|
-
if (
|
|
38
|
+
testId: g,
|
|
39
|
+
...v
|
|
40
|
+
}, M) {
|
|
41
|
+
const s = { ...B, ..._ }, C = w(() => {
|
|
42
|
+
if (r === "minimal" || r === "simple")
|
|
51
43
|
return [];
|
|
52
|
-
const
|
|
53
|
-
if (
|
|
54
|
-
if (
|
|
55
|
-
|
|
56
|
-
for (let
|
|
57
|
-
|
|
58
|
-
|
|
44
|
+
const i = [], u = Math.max(t - c, 1), f = Math.min(t + c, o), N = u > 2, m = f < o - 1;
|
|
45
|
+
if (N)
|
|
46
|
+
if (m) {
|
|
47
|
+
i.push(1), i.push("ellipsis");
|
|
48
|
+
for (let e = u; e <= f; e++)
|
|
49
|
+
i.push(e);
|
|
50
|
+
i.push("ellipsis"), i.push(o);
|
|
59
51
|
} else {
|
|
60
|
-
|
|
61
|
-
for (let
|
|
62
|
-
|
|
52
|
+
i.push(1), i.push("ellipsis");
|
|
53
|
+
for (let e = Math.max(o - 2 - c, 1); e <= o; e++)
|
|
54
|
+
i.push(e);
|
|
63
55
|
}
|
|
64
56
|
else {
|
|
65
|
-
for (let
|
|
66
|
-
|
|
67
|
-
|
|
57
|
+
for (let e = 1; e <= Math.min(3 + c, o); e++)
|
|
58
|
+
i.push(e);
|
|
59
|
+
m && (i.push("ellipsis"), i.push(o));
|
|
68
60
|
}
|
|
69
|
-
return
|
|
70
|
-
}, [
|
|
71
|
-
|
|
72
|
-
alignItems: "center",
|
|
73
|
-
gap: s.gap,
|
|
74
|
-
...L
|
|
75
|
-
}, f = (r, a) => ({
|
|
76
|
-
display: "inline-flex",
|
|
77
|
-
alignItems: "center",
|
|
78
|
-
justifyContent: "center",
|
|
79
|
-
minWidth: s.minWidth,
|
|
80
|
-
height: s.height,
|
|
81
|
-
padding: `0 ${s.gap + 4}px`,
|
|
82
|
-
fontSize: s.fontSize,
|
|
83
|
-
fontWeight: r ? 600 : 500,
|
|
84
|
-
color: a ? "var(--brycks-foreground-disabled)" : r ? "var(--brycks-primary-default)" : "var(--brycks-foreground-default)",
|
|
85
|
-
backgroundColor: r ? "var(--brycks-primary-muted)" : "transparent",
|
|
86
|
-
border: "none",
|
|
87
|
-
borderRadius: "var(--brycks-radius-md)",
|
|
88
|
-
cursor: a ? "not-allowed" : "pointer",
|
|
89
|
-
transition: `all ${G.quick}ms ${O.easeOut}`
|
|
90
|
-
}), j = {
|
|
91
|
-
display: "flex",
|
|
92
|
-
alignItems: "center",
|
|
93
|
-
justifyContent: "center",
|
|
94
|
-
minWidth: s.minWidth,
|
|
95
|
-
height: s.height,
|
|
96
|
-
color: "var(--brycks-foreground-muted)",
|
|
97
|
-
fontSize: s.fontSize
|
|
98
|
-
}, w = {
|
|
99
|
-
fontSize: s.fontSize,
|
|
100
|
-
color: "var(--brycks-foreground-muted)",
|
|
101
|
-
padding: `0 ${s.gap}px`
|
|
102
|
-
}, m = (r) => {
|
|
103
|
-
r >= 1 && r <= e && r !== n && !o && C(r);
|
|
61
|
+
return i;
|
|
62
|
+
}, [t, o, c, r]), a = (i) => {
|
|
63
|
+
i >= 1 && i <= o && i !== t && !l && b(i);
|
|
104
64
|
};
|
|
105
|
-
return /* @__PURE__ */
|
|
65
|
+
return /* @__PURE__ */ $(
|
|
106
66
|
"nav",
|
|
107
67
|
{
|
|
108
|
-
ref:
|
|
68
|
+
ref: M,
|
|
109
69
|
role: "navigation",
|
|
110
|
-
"aria-label":
|
|
111
|
-
className:
|
|
112
|
-
style:
|
|
113
|
-
"data-testid":
|
|
114
|
-
...
|
|
70
|
+
"aria-label": s.navigation,
|
|
71
|
+
className: k("brycks-pagination", `brycks-pagination--${y}`, `brycks-pagination--${r}`, x),
|
|
72
|
+
style: L,
|
|
73
|
+
"data-testid": g,
|
|
74
|
+
...v,
|
|
115
75
|
children: [
|
|
116
|
-
|
|
76
|
+
p && r !== "minimal" && /* @__PURE__ */ n(
|
|
117
77
|
"button",
|
|
118
78
|
{
|
|
119
79
|
type: "button",
|
|
120
|
-
"aria-label":
|
|
121
|
-
disabled:
|
|
122
|
-
|
|
123
|
-
onClick: () =>
|
|
124
|
-
|
|
125
|
-
n !== 1 && !o && (r.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
|
|
126
|
-
},
|
|
127
|
-
onMouseLeave: (r) => {
|
|
128
|
-
r.currentTarget.style.backgroundColor = "transparent";
|
|
129
|
-
},
|
|
130
|
-
children: /* @__PURE__ */ t(Q, {})
|
|
80
|
+
"aria-label": s.first,
|
|
81
|
+
disabled: t === 1 || l,
|
|
82
|
+
className: "brycks-pagination__button",
|
|
83
|
+
onClick: () => a(1),
|
|
84
|
+
children: /* @__PURE__ */ n(W, {})
|
|
131
85
|
}
|
|
132
86
|
),
|
|
133
|
-
|
|
87
|
+
d && /* @__PURE__ */ n(
|
|
134
88
|
"button",
|
|
135
89
|
{
|
|
136
90
|
type: "button",
|
|
137
|
-
"aria-label":
|
|
138
|
-
disabled:
|
|
139
|
-
|
|
140
|
-
onClick: () =>
|
|
141
|
-
|
|
142
|
-
n !== 1 && !o && (r.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
|
|
143
|
-
},
|
|
144
|
-
onMouseLeave: (r) => {
|
|
145
|
-
r.currentTarget.style.backgroundColor = "transparent";
|
|
146
|
-
},
|
|
147
|
-
children: /* @__PURE__ */ t(J, {})
|
|
91
|
+
"aria-label": s.previous,
|
|
92
|
+
disabled: t === 1 || l,
|
|
93
|
+
className: "brycks-pagination__button",
|
|
94
|
+
onClick: () => a(t - 1),
|
|
95
|
+
children: /* @__PURE__ */ n(I, {})
|
|
148
96
|
}
|
|
149
97
|
),
|
|
150
|
-
|
|
151
|
-
(
|
|
98
|
+
r === "simple" || r === "minimal" ? /* @__PURE__ */ n("span", { className: "brycks-pagination__info", children: r === "minimal" ? `${t} / ${o}` : s.of(t, o) }) : C.map(
|
|
99
|
+
(i, u) => i === "ellipsis" ? /* @__PURE__ */ n("span", { className: "brycks-pagination__ellipsis", children: "..." }, `ellipsis-${u}`) : /* @__PURE__ */ n(
|
|
152
100
|
"button",
|
|
153
101
|
{
|
|
154
102
|
type: "button",
|
|
155
|
-
"aria-label":
|
|
156
|
-
"aria-current":
|
|
157
|
-
disabled:
|
|
158
|
-
|
|
159
|
-
onClick: () =>
|
|
160
|
-
|
|
161
|
-
r !== n && !o && (h.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
|
|
162
|
-
},
|
|
163
|
-
onMouseLeave: (h) => {
|
|
164
|
-
r !== n && (h.currentTarget.style.backgroundColor = "transparent");
|
|
165
|
-
},
|
|
166
|
-
children: r
|
|
103
|
+
"aria-label": s.page(i),
|
|
104
|
+
"aria-current": i === t ? "page" : void 0,
|
|
105
|
+
disabled: l,
|
|
106
|
+
className: k("brycks-pagination__button", i === t && "brycks-pagination__button--active"),
|
|
107
|
+
onClick: () => a(i),
|
|
108
|
+
children: i
|
|
167
109
|
},
|
|
168
|
-
|
|
110
|
+
i
|
|
169
111
|
)
|
|
170
112
|
),
|
|
171
|
-
|
|
113
|
+
d && /* @__PURE__ */ n(
|
|
172
114
|
"button",
|
|
173
115
|
{
|
|
174
116
|
type: "button",
|
|
175
|
-
"aria-label":
|
|
176
|
-
disabled:
|
|
177
|
-
|
|
178
|
-
onClick: () =>
|
|
179
|
-
|
|
180
|
-
n !== e && !o && (r.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
|
|
181
|
-
},
|
|
182
|
-
onMouseLeave: (r) => {
|
|
183
|
-
r.currentTarget.style.backgroundColor = "transparent";
|
|
184
|
-
},
|
|
185
|
-
children: /* @__PURE__ */ t(K, {})
|
|
117
|
+
"aria-label": s.next,
|
|
118
|
+
disabled: t === o || l,
|
|
119
|
+
className: "brycks-pagination__button",
|
|
120
|
+
onClick: () => a(t + 1),
|
|
121
|
+
children: /* @__PURE__ */ n(R, {})
|
|
186
122
|
}
|
|
187
123
|
),
|
|
188
|
-
|
|
124
|
+
p && r !== "minimal" && /* @__PURE__ */ n(
|
|
189
125
|
"button",
|
|
190
126
|
{
|
|
191
127
|
type: "button",
|
|
192
|
-
"aria-label":
|
|
193
|
-
disabled:
|
|
194
|
-
|
|
195
|
-
onClick: () =>
|
|
196
|
-
|
|
197
|
-
n !== e && !o && (r.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
|
|
198
|
-
},
|
|
199
|
-
onMouseLeave: (r) => {
|
|
200
|
-
r.currentTarget.style.backgroundColor = "transparent";
|
|
201
|
-
},
|
|
202
|
-
children: /* @__PURE__ */ t(U, {})
|
|
128
|
+
"aria-label": s.last,
|
|
129
|
+
disabled: t === o || l,
|
|
130
|
+
className: "brycks-pagination__button",
|
|
131
|
+
onClick: () => a(o),
|
|
132
|
+
children: /* @__PURE__ */ n(E, {})
|
|
203
133
|
}
|
|
204
134
|
)
|
|
205
135
|
]
|
|
206
136
|
}
|
|
207
137
|
);
|
|
208
138
|
});
|
|
209
|
-
|
|
139
|
+
S.displayName = "Pagination";
|
|
210
140
|
export {
|
|
211
|
-
|
|
141
|
+
S as Pagination
|
|
212
142
|
};
|
|
213
143
|
//# sourceMappingURL=Pagination.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.js","sources":["../../../../src/components/navigation/Pagination/Pagination.tsx"],"sourcesContent":["/**\n * Pagination Component\n *\n * A pagination control for navigating through pages.\n * Supports different sizes and display modes.\n */\n\nimport { forwardRef, useMemo, type CSSProperties, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentGap } from '../../../design-system/primitives'\n\nexport type PaginationSize = 'sm' | 'md' | 'lg'\nexport type PaginationVariant = 'default' | 'simple' | 'minimal'\n\nexport interface PaginationLabels {\n /** aria-label of the nav landmark */\n navigation?: string\n /** aria-label of the first-page button */\n first?: string\n /** aria-label of the previous-page button */\n previous?: string\n /** aria-label of the next-page button */\n next?: string\n /** aria-label of the last-page button */\n last?: string\n /** aria-label of a numbered page button */\n page?: (page: number) => string\n /** Visible text of the `simple` variant */\n of?: (page: number, totalPages: number) => string\n}\n\nconst defaultLabels: Required<PaginationLabels> = {\n navigation: 'Pagination',\n first: 'First page',\n previous: 'Previous page',\n next: 'Next page',\n last: 'Last page',\n page: (page) => `Page ${page}`,\n of: (page, totalPages) => `Page ${page} of ${totalPages}`,\n}\n\nexport interface PaginationProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {\n /** Current page (1-indexed) */\n page: number\n /** Total number of pages */\n totalPages: number\n /** Callback when page changes */\n onChange: (page: number) => void\n /** Pagination size */\n size?: PaginationSize\n /** Pagination variant */\n variant?: PaginationVariant\n /** Number of sibling pages to show on each side */\n siblingCount?: number\n /** Whether to show first/last buttons */\n showFirstLast?: boolean\n /** Whether to show prev/next buttons */\n showPrevNext?: boolean\n /** Whether the component is disabled */\n disabled?: boolean\n /** Localizable labels (merged over English defaults) */\n labels?: PaginationLabels\n /** Custom class name */\n className?: string\n /** Test ID */\n testId?: string\n}\n\nconst sizeConfig: Record<PaginationSize, { height: number; fontSize: number; gap: number; minWidth: number }> = {\n sm: { height: spacing[7], fontSize: fontSizes.sm, gap: spacing[1], minWidth: spacing[7] },\n md: { height: spacing[9], fontSize: fontSizes.base, gap: componentGap.sm, minWidth: spacing[9] },\n lg: { height: spacing[11], fontSize: fontSizes.md, gap: spacing[2], minWidth: spacing[11] },\n}\n\nfunction ChevronLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M10 12L6 8l4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M6 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M11 12l-4-4 4-4M7 12l-4-4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M5 4l4 4-4 4M9 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(function Pagination(\n {\n page,\n totalPages,\n onChange,\n size = 'md',\n variant = 'default',\n siblingCount = 1,\n showFirstLast = true,\n showPrevNext = true,\n disabled = false,\n labels,\n className,\n style,\n testId,\n ...props\n },\n ref\n) {\n const config = sizeConfig[size]\n const text = { ...defaultLabels, ...labels }\n\n // Generate page numbers to display\n const pages = useMemo(() => {\n if (variant === 'minimal' || variant === 'simple') {\n return []\n }\n\n const range: (number | 'ellipsis')[] = []\n const leftSibling = Math.max(page - siblingCount, 1)\n const rightSibling = Math.min(page + siblingCount, totalPages)\n\n const showLeftEllipsis = leftSibling > 2\n const showRightEllipsis = rightSibling < totalPages - 1\n\n if (!showLeftEllipsis) {\n for (let i = 1; i <= Math.min(3 + siblingCount, totalPages); i++) {\n range.push(i)\n }\n if (showRightEllipsis) {\n range.push('ellipsis')\n range.push(totalPages)\n }\n } else if (!showRightEllipsis) {\n range.push(1)\n range.push('ellipsis')\n for (let i = Math.max(totalPages - 2 - siblingCount, 1); i <= totalPages; i++) {\n range.push(i)\n }\n } else {\n range.push(1)\n range.push('ellipsis')\n for (let i = leftSibling; i <= rightSibling; i++) {\n range.push(i)\n }\n range.push('ellipsis')\n range.push(totalPages)\n }\n\n return range\n }, [page, totalPages, siblingCount, variant])\n\n const containerStyle: CSSProperties = {\n display: 'flex',\n alignItems: 'center',\n gap: config.gap,\n ...style,\n }\n\n const getButtonStyle = (isActive: boolean, isDisabled: boolean): CSSProperties => ({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: config.minWidth,\n height: config.height,\n padding: `0 ${config.gap + 4}px`,\n fontSize: config.fontSize,\n fontWeight: isActive ? 600 : 500,\n color: isDisabled\n ? 'var(--brycks-foreground-disabled)'\n : isActive\n ? 'var(--brycks-primary-default)'\n : 'var(--brycks-foreground-default)',\n backgroundColor: isActive ? 'var(--brycks-primary-muted)' : 'transparent',\n border: 'none',\n borderRadius: 'var(--brycks-radius-md)',\n cursor: isDisabled ? 'not-allowed' : 'pointer',\n transition: `all ${durations.quick}ms ${easings.easeOut}`,\n })\n\n const ellipsisStyle: CSSProperties = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: config.minWidth,\n height: config.height,\n color: 'var(--brycks-foreground-muted)',\n fontSize: config.fontSize,\n }\n\n const infoStyle: CSSProperties = {\n fontSize: config.fontSize,\n color: 'var(--brycks-foreground-muted)',\n padding: `0 ${config.gap}px`,\n }\n\n const handlePageChange = (newPage: number) => {\n if (newPage >= 1 && newPage <= totalPages && newPage !== page && !disabled) {\n onChange(newPage)\n }\n }\n\n return (\n <nav\n ref={ref}\n role=\"navigation\"\n aria-label={text.navigation}\n className={cx('brycks-pagination', `brycks-pagination--${size}`, `brycks-pagination--${variant}`, className)}\n style={containerStyle}\n data-testid={testId}\n {...props}\n >\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.first}\n disabled={page === 1 || disabled}\n style={getButtonStyle(false, page === 1 || disabled)}\n onClick={() => handlePageChange(1)}\n onMouseEnter={(e) => {\n if (page !== 1 && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronsLeftIcon />\n </button>\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.previous}\n disabled={page === 1 || disabled}\n style={getButtonStyle(false, page === 1 || disabled)}\n onClick={() => handlePageChange(page - 1)}\n onMouseEnter={(e) => {\n if (page !== 1 && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronLeftIcon />\n </button>\n )}\n\n {variant === 'simple' || variant === 'minimal' ? (\n <span style={infoStyle}>\n {variant === 'minimal' ? `${page} / ${totalPages}` : text.of(page, totalPages)}\n </span>\n ) : (\n pages.map((p, index) =>\n p === 'ellipsis' ? (\n <span key={`ellipsis-${index}`} style={ellipsisStyle}>\n ...\n </span>\n ) : (\n <button\n key={p}\n type=\"button\"\n aria-label={text.page(p)}\n aria-current={p === page ? 'page' : undefined}\n disabled={disabled}\n style={getButtonStyle(p === page, disabled)}\n onClick={() => handlePageChange(p)}\n onMouseEnter={(e) => {\n if (p !== page && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n if (p !== page) {\n e.currentTarget.style.backgroundColor = 'transparent'\n }\n }}\n >\n {p}\n </button>\n )\n )\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.next}\n disabled={page === totalPages || disabled}\n style={getButtonStyle(false, page === totalPages || disabled)}\n onClick={() => handlePageChange(page + 1)}\n onMouseEnter={(e) => {\n if (page !== totalPages && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronRightIcon />\n </button>\n )}\n\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.last}\n disabled={page === totalPages || disabled}\n style={getButtonStyle(false, page === totalPages || disabled)}\n onClick={() => handlePageChange(totalPages)}\n onMouseEnter={(e) => {\n if (page !== totalPages && !disabled) {\n e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n }\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'transparent'\n }}\n >\n <ChevronsRightIcon />\n </button>\n )}\n </nav>\n )\n})\n\nPagination.displayName = 'Pagination'\n"],"names":["defaultLabels","page","totalPages","sizeConfig","spacing","fontSizes","componentGap","ChevronLeftIcon","jsx","ChevronRightIcon","ChevronsLeftIcon","ChevronsRightIcon","Pagination","forwardRef","onChange","size","variant","siblingCount","showFirstLast","showPrevNext","disabled","labels","className","style","testId","props","ref","config","text","pages","useMemo","range","leftSibling","rightSibling","showLeftEllipsis","showRightEllipsis","containerStyle","getButtonStyle","isActive","isDisabled","durations","easings","ellipsisStyle","infoStyle","handlePageChange","newPage","jsxs","cx","e","p","index"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Pagination.js","sources":["../../../../src/components/navigation/Pagination/Pagination.tsx"],"sourcesContent":["/**\n * Pagination Component\n *\n * A pagination control for navigating through pages.\n * Supports different sizes and display modes.\n */\n\nimport { forwardRef, useMemo, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport type PaginationSize = 'sm' | 'md' | 'lg'\nexport type PaginationVariant = 'default' | 'simple' | 'minimal'\n\nexport interface PaginationLabels {\n /** aria-label of the nav landmark */\n navigation?: string\n /** aria-label of the first-page button */\n first?: string\n /** aria-label of the previous-page button */\n previous?: string\n /** aria-label of the next-page button */\n next?: string\n /** aria-label of the last-page button */\n last?: string\n /** aria-label of a numbered page button */\n page?: (page: number) => string\n /** Visible text of the `simple` variant */\n of?: (page: number, totalPages: number) => string\n}\n\nconst defaultLabels: Required<PaginationLabels> = {\n navigation: 'Pagination',\n first: 'First page',\n previous: 'Previous page',\n next: 'Next page',\n last: 'Last page',\n page: (page) => `Page ${page}`,\n of: (page, totalPages) => `Page ${page} of ${totalPages}`,\n}\n\nexport interface PaginationProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {\n /** Current page (1-indexed) */\n page: number\n /** Total number of pages */\n totalPages: number\n /** Callback when page changes */\n onChange: (page: number) => void\n /** Pagination size */\n size?: PaginationSize\n /** Pagination variant */\n variant?: PaginationVariant\n /** Number of sibling pages to show on each side */\n siblingCount?: number\n /** Whether to show first/last buttons */\n showFirstLast?: boolean\n /** Whether to show prev/next buttons */\n showPrevNext?: boolean\n /** Whether the component is disabled */\n disabled?: boolean\n /** Localizable labels (merged over English defaults) */\n labels?: PaginationLabels\n /** Custom class name */\n className?: string\n /** Test ID */\n testId?: string\n}\n\nfunction ChevronLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M10 12L6 8l4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M6 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsLeftIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M11 12l-4-4 4-4M7 12l-4-4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nfunction ChevronsRightIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path d=\"M5 4l4 4-4 4M9 4l4 4-4 4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(function Pagination(\n {\n page,\n totalPages,\n onChange,\n size = 'md',\n variant = 'default',\n siblingCount = 1,\n showFirstLast = true,\n showPrevNext = true,\n disabled = false,\n labels,\n className,\n style,\n testId,\n ...props\n },\n ref\n) {\n const text = { ...defaultLabels, ...labels }\n\n // Generate page numbers to display\n const pages = useMemo(() => {\n if (variant === 'minimal' || variant === 'simple') {\n return []\n }\n\n const range: (number | 'ellipsis')[] = []\n const leftSibling = Math.max(page - siblingCount, 1)\n const rightSibling = Math.min(page + siblingCount, totalPages)\n\n const showLeftEllipsis = leftSibling > 2\n const showRightEllipsis = rightSibling < totalPages - 1\n\n if (!showLeftEllipsis) {\n for (let i = 1; i <= Math.min(3 + siblingCount, totalPages); i++) {\n range.push(i)\n }\n if (showRightEllipsis) {\n range.push('ellipsis')\n range.push(totalPages)\n }\n } else if (!showRightEllipsis) {\n range.push(1)\n range.push('ellipsis')\n for (let i = Math.max(totalPages - 2 - siblingCount, 1); i <= totalPages; i++) {\n range.push(i)\n }\n } else {\n range.push(1)\n range.push('ellipsis')\n for (let i = leftSibling; i <= rightSibling; i++) {\n range.push(i)\n }\n range.push('ellipsis')\n range.push(totalPages)\n }\n\n return range\n }, [page, totalPages, siblingCount, variant])\n\n const handlePageChange = (newPage: number) => {\n if (newPage >= 1 && newPage <= totalPages && newPage !== page && !disabled) {\n onChange(newPage)\n }\n }\n\n return (\n <nav\n ref={ref}\n role=\"navigation\"\n aria-label={text.navigation}\n className={cx('brycks-pagination', `brycks-pagination--${size}`, `brycks-pagination--${variant}`, className)}\n style={style}\n data-testid={testId}\n {...props}\n >\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.first}\n disabled={page === 1 || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(1)}\n >\n <ChevronsLeftIcon />\n </button>\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.previous}\n disabled={page === 1 || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(page - 1)}\n >\n <ChevronLeftIcon />\n </button>\n )}\n\n {variant === 'simple' || variant === 'minimal' ? (\n <span className=\"brycks-pagination__info\">\n {variant === 'minimal' ? `${page} / ${totalPages}` : text.of(page, totalPages)}\n </span>\n ) : (\n pages.map((p, index) =>\n p === 'ellipsis' ? (\n <span key={`ellipsis-${index}`} className=\"brycks-pagination__ellipsis\">\n ...\n </span>\n ) : (\n <button\n key={p}\n type=\"button\"\n aria-label={text.page(p)}\n aria-current={p === page ? 'page' : undefined}\n disabled={disabled}\n className={cx('brycks-pagination__button', p === page && 'brycks-pagination__button--active')}\n onClick={() => handlePageChange(p)}\n >\n {p}\n </button>\n )\n )\n )}\n\n {showPrevNext && (\n <button\n type=\"button\"\n aria-label={text.next}\n disabled={page === totalPages || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(page + 1)}\n >\n <ChevronRightIcon />\n </button>\n )}\n\n {showFirstLast && variant !== 'minimal' && (\n <button\n type=\"button\"\n aria-label={text.last}\n disabled={page === totalPages || disabled}\n className=\"brycks-pagination__button\"\n onClick={() => handlePageChange(totalPages)}\n >\n <ChevronsRightIcon />\n </button>\n )}\n </nav>\n )\n})\n\nPagination.displayName = 'Pagination'\n"],"names":["defaultLabels","page","totalPages","ChevronLeftIcon","jsx","ChevronRightIcon","ChevronsLeftIcon","ChevronsRightIcon","Pagination","forwardRef","onChange","size","variant","siblingCount","showFirstLast","showPrevNext","disabled","labels","className","style","testId","props","ref","text","pages","useMemo","range","leftSibling","rightSibling","showLeftEllipsis","showRightEllipsis","i","handlePageChange","newPage","jsxs","cx","p","index"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),g=require("./Button.styles.cjs"),z=require("../../../utils/styles.cjs"),C=c.memo(function({size:n}){return t.jsxs("svg",{width:n,height:n,viewBox:"0 0 24 24",fill:"none",className:"brycks-animate-spin","aria-hidden":"true",children:[t.jsx("circle",{cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeDasharray:"31.4 31.4",opacity:"0.25"}),t.jsx("circle",{cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeDasharray:"31.4 31.4",strokeDashoffset:"62.8",style:{transform:"rotate(-90deg)",transformOrigin:"center"}})]})}),q=({as:s,variant:n="solid",intent:h="primary",size:u="md",fullWidth:x,isLoading:e,isDisabled:k,leftIcon:d,rightIcon:y,isIconOnly:o,className:m,style:B,children:b,testId:j,...i},S)=>{const p=s||"button",a=k||e,r=g.sizeConfig[u];typeof process<"u"&&process.env.NODE_ENV!=="production"&&o&&!i["aria-label"]&&!i["aria-labelledby"]&&console.warn("Brycks: an icon-only Button/IconButton has no accessible name. Pass `aria-label` or `aria-labelledby`.");const w={display:"inline-flex",alignItems:"center",justifyContent:"center",...B},v=z.cx("brycks-button",`brycks-button--${n}`,`brycks-button--${h}`,`brycks-button--${u}`,x&&"brycks-button--full-width",o&&"brycks-button--icon-only",e&&"brycks-button--loading",a&&"brycks-button--disabled",m),N=p==="button"||s===void 0?{type:i.type??"button",disabled:a}:{"aria-disabled":a||void 0,role:"button",tabIndex:a?-1:0};return t.jsxs(p,{ref:S,className:v,style:w,"data-testid":j,...N,...i,children:[e&&t.jsx("span",{style:{display:"inline-flex",position:o?"absolute":"relative"},children:t.jsx(C,{size:r.iconSize})}),!e&&d&&t.jsx("span",{style:{display:"inline-flex",width:r.iconSize,height:r.iconSize},children:d}),!o&&t.jsx("span",{style:{opacity:e&&!o?.5:1},children:b}),!e&&y&&t.jsx("span",{style:{display:"inline-flex",width:r.iconSize,height:r.iconSize},children:y}),o&&!e&&b]})},l=c.forwardRef(q);l.displayName="Button";const D=(s,n)=>t.jsx(l,{ref:n,isIconOnly:!0,...s}),f=c.forwardRef(D);f.displayName="IconButton";exports.Button=l;exports.IconButton=f;
|
|
2
2
|
//# sourceMappingURL=Button.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.cjs","sources":["../../../../src/components/primitives/Button/Button.tsx"],"sourcesContent":["/**\r\n * Button Component\r\n *\r\n * A versatile, polymorphic button component with multiple variants,\r\n * sizes, and states. Designed with Apple-inspired aesthetics -\r\n * smooth transitions, tactile feedback, and refined visual details.\r\n *\r\n * All color styles are handled via CSS classes for easy customization.\r\n * Layout styles (display, alignment) use inline styles for flexibility.\r\n */\r\n\r\nimport React, {\r\n forwardRef,\r\n type ElementType,\r\n type ComponentPropsWithRef,\r\n type CSSProperties,\r\n} from 'react'\r\nimport type { ButtonProps } from './Button.types'\r\nimport { sizeConfig } from './Button.styles'\r\nimport { cx } from '../../../utils/styles'\r\n\r\ninterface ButtonComponent {\r\n <E extends ElementType = 'button'>(\r\n props: ButtonProps<E> & { ref?: ComponentPropsWithRef<E>['ref'] }\r\n ): React.JSX.Element | null\r\n displayName?: string\r\n}\r\n\r\n/** Loading spinner component - uses global CSS keyframes */\r\nconst LoadingSpinner = React.memo(function LoadingSpinner({ size }: { size: number }) {\r\n return (\r\n <svg\r\n width={size}\r\n height={size}\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n className=\"brycks-animate-spin\"\r\n aria-hidden=\"true\"\r\n >\r\n <circle\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"2\"\r\n strokeLinecap=\"round\"\r\n strokeDasharray=\"31.4 31.4\"\r\n opacity=\"0.25\"\r\n />\r\n <circle\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"2\"\r\n strokeLinecap=\"round\"\r\n strokeDasharray=\"31.4 31.4\"\r\n strokeDashoffset=\"62.8\"\r\n style={{ transform: 'rotate(-90deg)', transformOrigin: 'center' }}\r\n />\r\n </svg>\r\n )\r\n})\r\n\r\nconst ButtonInner = <E extends ElementType = 'button'>(\r\n {\r\n as,\r\n variant = 'solid',\r\n intent = 'primary',\r\n size = 'md',\r\n fullWidth,\r\n isLoading,\r\n isDisabled,\r\n leftIcon,\r\n rightIcon,\r\n isIconOnly,\r\n className,\r\n style,\r\n children,\r\n testId,\r\n ...props\r\n }: ButtonProps<E>,\r\n ref: React.ForwardedRef<Element>\r\n) => {\r\n const Component = (as || 'button') as ElementType\r\n\r\n const disabled = isDisabled || isLoading\r\n\r\n const sizeValues = sizeConfig[size]\r\n\r\n // Layout-only inline styles (colors handled by CSS classes)\r\n const layoutStyle: CSSProperties = {\r\n display: 'inline-flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n ...style,\r\n }\r\n\r\n // Build class name - CSS handles all colors and states\r\n const buttonClassName = cx(\r\n 'brycks-button',\r\n `brycks-button--${variant}`,\r\n `brycks-button--${intent}`,\r\n `brycks-button--${size}`,\r\n fullWidth && 'brycks-button--full-width',\r\n isIconOnly && 'brycks-button--icon-only',\r\n isLoading && 'brycks-button--loading',\r\n disabled && 'brycks-button--disabled',\r\n className\r\n )\r\n\r\n const isButton = Component === 'button' || as === undefined\r\n const buttonProps = isButton\r\n ? {\r\n type: (props as { type?: string }).type ?? 'button',\r\n disabled,\r\n }\r\n : {\r\n 'aria-disabled': disabled || undefined,\r\n role: 'button',\r\n tabIndex: disabled ? -1 : 0,\r\n }\r\n\r\n return (\r\n <Component\r\n ref={ref}\r\n className={buttonClassName}\r\n style={layoutStyle}\r\n data-testid={testId}\r\n {...buttonProps}\r\n {...props}\r\n >\r\n {isLoading && (\r\n <span\r\n style={{\r\n display: 'inline-flex',\r\n position: isIconOnly ? 'absolute' : 'relative',\r\n }}\r\n >\r\n <LoadingSpinner size={sizeValues.iconSize} />\r\n </span>\r\n )}\r\n\r\n {!isLoading && leftIcon && (\r\n <span\r\n style={{\r\n display: 'inline-flex',\r\n width: sizeValues.iconSize,\r\n height: sizeValues.iconSize,\r\n }}\r\n >\r\n {leftIcon}\r\n </span>\r\n )}\r\n\r\n {!isIconOnly && (\r\n <span\r\n style={{\r\n opacity: isLoading && !isIconOnly ? 0.5 : 1,\r\n }}\r\n >\r\n {children}\r\n </span>\r\n )}\r\n\r\n {!isLoading && rightIcon && (\r\n <span\r\n style={{\r\n display: 'inline-flex',\r\n width: sizeValues.iconSize,\r\n height: sizeValues.iconSize,\r\n }}\r\n >\r\n {rightIcon}\r\n </span>\r\n )}\r\n\r\n {isIconOnly && !isLoading && children}\r\n </Component>\r\n )\r\n}\r\n\r\nexport const Button = forwardRef(ButtonInner) as ButtonComponent\r\n\r\nButton.displayName = 'Button'\r\n\r\n/** Icon button shorthand */\r\nconst IconButtonInner = <E extends ElementType = 'button'>(\r\n props: Omit<ButtonProps<E>, 'isIconOnly'>,\r\n ref: React.ForwardedRef<Element>\r\n) => {\r\n return <Button ref={ref as React.ForwardedRef<HTMLButtonElement>} isIconOnly {...(props as ButtonProps<'button'>)} />\r\n}\r\n\r\nexport const IconButton = forwardRef(IconButtonInner) as ButtonComponent\r\n\r\nIconButton.displayName = 'IconButton'\r\n"],"names":["LoadingSpinner","React","size","jsxs","jsx","ButtonInner","as","variant","intent","fullWidth","isLoading","isDisabled","leftIcon","rightIcon","isIconOnly","className","style","children","testId","props","ref","Component","disabled","sizeValues","sizeConfig","layoutStyle","buttonClassName","cx","buttonProps","Button","forwardRef","IconButtonInner","IconButton"],"mappings":"gNA6BMA,EAAiBC,EAAM,KAAK,SAAwB,CAAE,KAAAC,GAA0B,CACpF,OACEC,EAAAA,KAAC,MAAA,CACC,MAAOD,EACP,OAAQA,EACR,QAAQ,YACR,KAAK,OACL,UAAU,sBACV,cAAY,OAEZ,SAAA,CAAAE,EAAAA,IAAC,SAAA,CACC,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,IACZ,cAAc,QACd,gBAAgB,YAChB,QAAQ,MAAA,CAAA,EAEVA,EAAAA,IAAC,SAAA,CACC,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,IACZ,cAAc,QACd,gBAAgB,YAChB,iBAAiB,OACjB,MAAO,CAAE,UAAW,iBAAkB,gBAAiB,QAAA,CAAS,CAAA,CAClE,CAAA,CAAA,CAGN,CAAC,EAEKC,EAAc,CAClB,CACE,GAAAC,EACA,QAAAC,EAAU,QACV,OAAAC,EAAS,UACT,KAAAN,EAAO,KACP,UAAAO,EACA,UAAAC,EACA,WAAAC,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EACA,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAAaf,GAAM,SAEnBgB,EAAWX,GAAcD,EAEzBa,EAAaC,EAAAA,WAAWtB,CAAI,
|
|
1
|
+
{"version":3,"file":"Button.cjs","sources":["../../../../src/components/primitives/Button/Button.tsx"],"sourcesContent":["/**\r\n * Button Component\r\n *\r\n * A versatile, polymorphic button component with multiple variants,\r\n * sizes, and states. Designed with Apple-inspired aesthetics -\r\n * smooth transitions, tactile feedback, and refined visual details.\r\n *\r\n * All color styles are handled via CSS classes for easy customization.\r\n * Layout styles (display, alignment) use inline styles for flexibility.\r\n */\r\n\r\nimport React, {\r\n forwardRef,\r\n type ElementType,\r\n type ComponentPropsWithRef,\r\n type CSSProperties,\r\n} from 'react'\r\nimport type { ButtonProps } from './Button.types'\r\nimport { sizeConfig } from './Button.styles'\r\nimport { cx } from '../../../utils/styles'\r\n\r\ninterface ButtonComponent {\r\n <E extends ElementType = 'button'>(\r\n props: ButtonProps<E> & { ref?: ComponentPropsWithRef<E>['ref'] }\r\n ): React.JSX.Element | null\r\n displayName?: string\r\n}\r\n\r\n/** Loading spinner component - uses global CSS keyframes */\r\nconst LoadingSpinner = React.memo(function LoadingSpinner({ size }: { size: number }) {\r\n return (\r\n <svg\r\n width={size}\r\n height={size}\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n className=\"brycks-animate-spin\"\r\n aria-hidden=\"true\"\r\n >\r\n <circle\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"2\"\r\n strokeLinecap=\"round\"\r\n strokeDasharray=\"31.4 31.4\"\r\n opacity=\"0.25\"\r\n />\r\n <circle\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"2\"\r\n strokeLinecap=\"round\"\r\n strokeDasharray=\"31.4 31.4\"\r\n strokeDashoffset=\"62.8\"\r\n style={{ transform: 'rotate(-90deg)', transformOrigin: 'center' }}\r\n />\r\n </svg>\r\n )\r\n})\r\n\r\nconst ButtonInner = <E extends ElementType = 'button'>(\r\n {\r\n as,\r\n variant = 'solid',\r\n intent = 'primary',\r\n size = 'md',\r\n fullWidth,\r\n isLoading,\r\n isDisabled,\r\n leftIcon,\r\n rightIcon,\r\n isIconOnly,\r\n className,\r\n style,\r\n children,\r\n testId,\r\n ...props\r\n }: ButtonProps<E>,\r\n ref: React.ForwardedRef<Element>\r\n) => {\r\n const Component = (as || 'button') as ElementType\r\n\r\n const disabled = isDisabled || isLoading\r\n\r\n const sizeValues = sizeConfig[size]\r\n\r\n // Dev-only a11y guard: an icon-only button has no text, so it needs an\r\n // accessible name. Reliable across the polymorphic `as` API where a type\r\n // constraint isn't (the check is stripped from production builds).\r\n if (\r\n typeof process !== 'undefined' &&\r\n process.env.NODE_ENV !== 'production' &&\r\n isIconOnly &&\r\n !(props as Record<string, unknown>)['aria-label'] &&\r\n !(props as Record<string, unknown>)['aria-labelledby']\r\n ) {\r\n console.warn(\r\n 'Brycks: an icon-only Button/IconButton has no accessible name. Pass `aria-label` or `aria-labelledby`.'\r\n )\r\n }\r\n\r\n // Layout-only inline styles (colors handled by CSS classes)\r\n const layoutStyle: CSSProperties = {\r\n display: 'inline-flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n ...style,\r\n }\r\n\r\n // Build class name - CSS handles all colors and states\r\n const buttonClassName = cx(\r\n 'brycks-button',\r\n `brycks-button--${variant}`,\r\n `brycks-button--${intent}`,\r\n `brycks-button--${size}`,\r\n fullWidth && 'brycks-button--full-width',\r\n isIconOnly && 'brycks-button--icon-only',\r\n isLoading && 'brycks-button--loading',\r\n disabled && 'brycks-button--disabled',\r\n className\r\n )\r\n\r\n const isButton = Component === 'button' || as === undefined\r\n const buttonProps = isButton\r\n ? {\r\n type: (props as { type?: string }).type ?? 'button',\r\n disabled,\r\n }\r\n : {\r\n 'aria-disabled': disabled || undefined,\r\n role: 'button',\r\n tabIndex: disabled ? -1 : 0,\r\n }\r\n\r\n return (\r\n <Component\r\n ref={ref}\r\n className={buttonClassName}\r\n style={layoutStyle}\r\n data-testid={testId}\r\n {...buttonProps}\r\n {...props}\r\n >\r\n {isLoading && (\r\n <span\r\n style={{\r\n display: 'inline-flex',\r\n position: isIconOnly ? 'absolute' : 'relative',\r\n }}\r\n >\r\n <LoadingSpinner size={sizeValues.iconSize} />\r\n </span>\r\n )}\r\n\r\n {!isLoading && leftIcon && (\r\n <span\r\n style={{\r\n display: 'inline-flex',\r\n width: sizeValues.iconSize,\r\n height: sizeValues.iconSize,\r\n }}\r\n >\r\n {leftIcon}\r\n </span>\r\n )}\r\n\r\n {!isIconOnly && (\r\n <span\r\n style={{\r\n opacity: isLoading && !isIconOnly ? 0.5 : 1,\r\n }}\r\n >\r\n {children}\r\n </span>\r\n )}\r\n\r\n {!isLoading && rightIcon && (\r\n <span\r\n style={{\r\n display: 'inline-flex',\r\n width: sizeValues.iconSize,\r\n height: sizeValues.iconSize,\r\n }}\r\n >\r\n {rightIcon}\r\n </span>\r\n )}\r\n\r\n {isIconOnly && !isLoading && children}\r\n </Component>\r\n )\r\n}\r\n\r\nexport const Button = forwardRef(ButtonInner) as ButtonComponent\r\n\r\nButton.displayName = 'Button'\r\n\r\n/** Icon button shorthand */\r\nconst IconButtonInner = <E extends ElementType = 'button'>(\r\n props: Omit<ButtonProps<E>, 'isIconOnly'>,\r\n ref: React.ForwardedRef<Element>\r\n) => {\r\n return <Button ref={ref as React.ForwardedRef<HTMLButtonElement>} isIconOnly {...(props as ButtonProps<'button'>)} />\r\n}\r\n\r\nexport const IconButton = forwardRef(IconButtonInner) as ButtonComponent\r\n\r\nIconButton.displayName = 'IconButton'\r\n"],"names":["LoadingSpinner","React","size","jsxs","jsx","ButtonInner","as","variant","intent","fullWidth","isLoading","isDisabled","leftIcon","rightIcon","isIconOnly","className","style","children","testId","props","ref","Component","disabled","sizeValues","sizeConfig","layoutStyle","buttonClassName","cx","buttonProps","Button","forwardRef","IconButtonInner","IconButton"],"mappings":"gNA6BMA,EAAiBC,EAAM,KAAK,SAAwB,CAAE,KAAAC,GAA0B,CACpF,OACEC,EAAAA,KAAC,MAAA,CACC,MAAOD,EACP,OAAQA,EACR,QAAQ,YACR,KAAK,OACL,UAAU,sBACV,cAAY,OAEZ,SAAA,CAAAE,EAAAA,IAAC,SAAA,CACC,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,IACZ,cAAc,QACd,gBAAgB,YAChB,QAAQ,MAAA,CAAA,EAEVA,EAAAA,IAAC,SAAA,CACC,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,IACZ,cAAc,QACd,gBAAgB,YAChB,iBAAiB,OACjB,MAAO,CAAE,UAAW,iBAAkB,gBAAiB,QAAA,CAAS,CAAA,CAClE,CAAA,CAAA,CAGN,CAAC,EAEKC,EAAc,CAClB,CACE,GAAAC,EACA,QAAAC,EAAU,QACV,OAAAC,EAAS,UACT,KAAAN,EAAO,KACP,UAAAO,EACA,UAAAC,EACA,WAAAC,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EACA,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAAaf,GAAM,SAEnBgB,EAAWX,GAAcD,EAEzBa,EAAaC,EAAAA,WAAWtB,CAAI,EAMhC,OAAO,QAAY,KACnB,QAAQ,IAAI,WAAa,cACzBY,GACA,CAAEK,EAAkC,YAAY,GAChD,CAAEA,EAAkC,iBAAiB,GAErD,QAAQ,KACN,wGAAA,EAKJ,MAAMM,EAA6B,CACjC,QAAS,cACT,WAAY,SACZ,eAAgB,SAChB,GAAGT,CAAA,EAICU,EAAkBC,EAAAA,GACtB,gBACA,kBAAkBpB,CAAO,GACzB,kBAAkBC,CAAM,GACxB,kBAAkBN,CAAI,GACtBO,GAAa,4BACbK,GAAc,2BACdJ,GAAa,yBACbY,GAAY,0BACZP,CAAA,EAIIa,EADWP,IAAc,UAAYf,IAAO,OAE9C,CACE,KAAOa,EAA4B,MAAQ,SAC3C,SAAAG,CAAA,EAEF,CACE,gBAAiBA,GAAY,OAC7B,KAAM,SACN,SAAUA,EAAW,GAAK,CAAA,EAGhC,OACEnB,EAAAA,KAACkB,EAAA,CACC,IAAAD,EACA,UAAWM,EACX,MAAOD,EACP,cAAaP,EACZ,GAAGU,EACH,GAAGT,EAEH,SAAA,CAAAT,GACCN,EAAAA,IAAC,OAAA,CACC,MAAO,CACL,QAAS,cACT,SAAUU,EAAa,WAAa,UAAA,EAGtC,SAAAV,EAAAA,IAACJ,EAAA,CAAe,KAAMuB,EAAW,QAAA,CAAU,CAAA,CAAA,EAI9C,CAACb,GAAaE,GACbR,EAAAA,IAAC,OAAA,CACC,MAAO,CACL,QAAS,cACT,MAAOmB,EAAW,SAClB,OAAQA,EAAW,QAAA,EAGpB,SAAAX,CAAA,CAAA,EAIJ,CAACE,GACAV,EAAAA,IAAC,OAAA,CACC,MAAO,CACL,QAASM,GAAa,CAACI,EAAa,GAAM,CAAA,EAG3C,SAAAG,CAAA,CAAA,EAIJ,CAACP,GAAaG,GACbT,EAAAA,IAAC,OAAA,CACC,MAAO,CACL,QAAS,cACT,MAAOmB,EAAW,SAClB,OAAQA,EAAW,QAAA,EAGpB,SAAAV,CAAA,CAAA,EAIJC,GAAc,CAACJ,GAAaO,CAAA,CAAA,CAAA,CAGnC,EAEaY,EAASC,EAAAA,WAAWzB,CAAW,EAE5CwB,EAAO,YAAc,SAGrB,MAAME,EAAkB,CACtBZ,EACAC,UAEQS,EAAA,CAAO,IAAAT,EAAmD,WAAU,GAAE,GAAID,EAAiC,EAGxGa,EAAaF,EAAAA,WAAWC,CAAe,EAEpDC,EAAW,YAAc"}
|