@elliemae/ds-pagination 3.57.0-next.42 → 3.57.0-next.45
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/cjs/parts/DSPaginator/DSPaginator.js +1 -1
- package/dist/cjs/parts/DSPaginator/DSPaginator.js.map +2 -2
- package/dist/cjs/parts/DSPaginator/styled.js +6 -1
- package/dist/cjs/parts/DSPaginator/styled.js.map +2 -2
- package/dist/esm/parts/DSPaginator/DSPaginator.js +2 -2
- package/dist/esm/parts/DSPaginator/DSPaginator.js.map +2 -2
- package/dist/esm/parts/DSPaginator/styled.js +6 -1
- package/dist/esm/parts/DSPaginator/styled.js.map +2 -2
- package/dist/types/parts/DSPaginator/styled.d.ts +1 -0
- package/package.json +13 -13
|
@@ -124,7 +124,7 @@ const DSPaginator = (props) => {
|
|
|
124
124
|
...ownerPropsConfig,
|
|
125
125
|
onClick: buttonOnClick,
|
|
126
126
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { gutter: "xxxs", alignItems: "center", style: { gridAutoFlow: "column" }, children: [
|
|
127
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
127
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.StyledPageInfo, { innerRef: pageInfoRef, children: [
|
|
128
128
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
129
129
|
import_ds_typography.DSTypography,
|
|
130
130
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSPaginator/DSPaginator.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useMemo } from 'react';\nimport type { DSButtonT } from '@elliemae/ds-button-v2';\nimport { DSCircularIndeterminateIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { type DSDropdownMenuT } from '@elliemae/ds-dropdownmenu-v2';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { DSPaginationSeparator } from '../DSPaginationSeparator/index.js';\nimport { createPaginatorHeader } from './config/createPaginatorHeader.js';\nimport { usePaginator } from './config/usePaginator.js';\nimport { DSPaginatorName, PAGINATOR_DATA_TESTID } from './constants/index.js';\nimport { DSPaginatorPropTypesSchema, type DSPaginatorT } from './react-desc-prop-types.js';\nimport { InvisibleDiv, PaginationDropdownButtonPaginator, StyledDropdown } from './styled.js';\n\nconst DSPaginator: React.ComponentType<DSPaginatorT.Props> = (props) => {\n const {\n propsWithDefault: { pageIndex, pageCount, isLoadingPageCount, onPageChange, pageDetails, pageDetailsTitle },\n xstyledProps,\n globalAttributes,\n ownerPropsConfig,\n btnRef,\n btnWidth,\n pageInfoWidth,\n options,\n isOpened,\n actionRef,\n widestChildRef,\n pageInfoRef,\n checkMarkRef,\n checkMarkWidth,\n onKeyDown,\n setIsOpened,\n } = usePaginator(props);\n\n const widestTypographyRef = React.useRef<HTMLDivElement>(null);\n\n const Header = useMemo(\n () => createPaginatorHeader({ pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth }),\n [pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth],\n );\n\n const buttonOnClick: DSButtonT.Props['onClick'] = useMemo(() => {\n if (globalAttributes.onClick) return globalAttributes.onClick as DSButtonT.Props['onClick'];\n return () => setIsOpened((prev) => !prev);\n }, [globalAttributes.onClick, setIsOpened]);\n\n return (\n <StyledDropdown\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageIndex.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageChange((clickedOption as DSDropdownMenuT.ItemSingleOptions).value as number);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[-(checkMarkWidth + 7), 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n onKeyDown={onKeyDown}\n minWidth={\n pageDetails.length !== 0\n ? btnWidth + checkMarkWidth + 7\n : /**\n * Structure of the width:\n * 16px (left padding)\n * + chevronWidth (size of the chevron icon)\n * + 8px (spacing between chevron and text)\n * + pageCount length in ch\n * + 16px (right padding)\n * + a small scrollbar placeholder (to avoid text wrapping when scrollbars appear)\n * By using `calc()` + `ch` units, the component stays responsive to font-size changes\n * without requiring an extra ref to measure the page count text width.\n */\n\n `calc(${checkMarkWidth + 60}px + ${pageCount.toString().length}ch)`\n }\n maxHeight={300}\n HeaderComp={Header}\n >\n <PaginationDropdownButtonPaginator\n buttonType=\"raw\"\n disabled={isLoadingPageCount}\n innerRef={btnRef}\n aria-pressed={isOpened}\n aria-label={`Page ${pageIndex} out of ${pageCount}, ${\n pageDetails.length !== 0 ? pageDetails[pageIndex - 1] : '\\b\\b'\n }. Press to change the current page`}\n data-testid={PAGINATOR_DATA_TESTID.PAGINATOR}\n {...globalAttributes}\n {...xstyledProps}\n {...ownerPropsConfig}\n onClick={buttonOnClick}\n >\n <Grid gutter=\"xxxs\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqGX;AArGZ,mBAA+B;AAE/B,4CAAiD;AAEjD,qBAAqB;AACrB,sBAA4B;AAC5B,8BAAyB;AACzB,2BAA6B;AAC7B,mCAAsC;AACtC,mCAAsC;AACtC,0BAA6B;AAC7B,uBAAuD;AACvD,mCAA8D;AAC9D,
|
|
4
|
+
"sourcesContent": ["import React, { useMemo } from 'react';\nimport type { DSButtonT } from '@elliemae/ds-button-v2';\nimport { DSCircularIndeterminateIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { type DSDropdownMenuT } from '@elliemae/ds-dropdownmenu-v2';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { DSPaginationSeparator } from '../DSPaginationSeparator/index.js';\nimport { createPaginatorHeader } from './config/createPaginatorHeader.js';\nimport { usePaginator } from './config/usePaginator.js';\nimport { DSPaginatorName, PAGINATOR_DATA_TESTID } from './constants/index.js';\nimport { DSPaginatorPropTypesSchema, type DSPaginatorT } from './react-desc-prop-types.js';\nimport { InvisibleDiv, PaginationDropdownButtonPaginator, StyledDropdown, StyledPageInfo } from './styled.js';\n\nconst DSPaginator: React.ComponentType<DSPaginatorT.Props> = (props) => {\n const {\n propsWithDefault: { pageIndex, pageCount, isLoadingPageCount, onPageChange, pageDetails, pageDetailsTitle },\n xstyledProps,\n globalAttributes,\n ownerPropsConfig,\n btnRef,\n btnWidth,\n pageInfoWidth,\n options,\n isOpened,\n actionRef,\n widestChildRef,\n pageInfoRef,\n checkMarkRef,\n checkMarkWidth,\n onKeyDown,\n setIsOpened,\n } = usePaginator(props);\n\n const widestTypographyRef = React.useRef<HTMLDivElement>(null);\n\n const Header = useMemo(\n () => createPaginatorHeader({ pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth }),\n [pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth],\n );\n\n const buttonOnClick: DSButtonT.Props['onClick'] = useMemo(() => {\n if (globalAttributes.onClick) return globalAttributes.onClick as DSButtonT.Props['onClick'];\n return () => setIsOpened((prev) => !prev);\n }, [globalAttributes.onClick, setIsOpened]);\n\n return (\n <StyledDropdown\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageIndex.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageChange((clickedOption as DSDropdownMenuT.ItemSingleOptions).value as number);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[-(checkMarkWidth + 7), 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n onKeyDown={onKeyDown}\n minWidth={\n pageDetails.length !== 0\n ? btnWidth + checkMarkWidth + 7\n : /**\n * Structure of the width:\n * 16px (left padding)\n * + chevronWidth (size of the chevron icon)\n * + 8px (spacing between chevron and text)\n * + pageCount length in ch\n * + 16px (right padding)\n * + a small scrollbar placeholder (to avoid text wrapping when scrollbars appear)\n * By using `calc()` + `ch` units, the component stays responsive to font-size changes\n * without requiring an extra ref to measure the page count text width.\n */\n\n `calc(${checkMarkWidth + 60}px + ${pageCount.toString().length}ch)`\n }\n maxHeight={300}\n HeaderComp={Header}\n >\n <PaginationDropdownButtonPaginator\n buttonType=\"raw\"\n disabled={isLoadingPageCount}\n innerRef={btnRef}\n aria-pressed={isOpened}\n aria-label={`Page ${pageIndex} out of ${pageCount}, ${\n pageDetails.length !== 0 ? pageDetails[pageIndex - 1] : '\\b\\b'\n }. Press to change the current page`}\n data-testid={PAGINATOR_DATA_TESTID.PAGINATOR}\n {...globalAttributes}\n {...xstyledProps}\n {...ownerPropsConfig}\n onClick={buttonOnClick}\n >\n <Grid gutter=\"xxxs\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <StyledPageInfo innerRef={pageInfoRef}>\n <DSTypography\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */\n id=\"typography-page-index\"\n variant=\"b1\"\n as=\"span\"\n fontWeight=\"semibold\"\n textAlign=\"start\"\n >\n {pageIndex}\n </DSTypography>\n <DSTypography\n variant=\"b1\"\n as=\"span\"\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */ className=\"typography-page-info-and-detail\"\n >\n / {pageCount}\n </DSTypography>\n </StyledPageInfo>\n {isLoadingPageCount && <DSCircularIndeterminateIndicator ml=\"xxxs\" mr=\"xxxs\" size=\"xs\" />}\n {pageDetails.length !== 0 && (\n <>\n <DSPaginationSeparator height=\"12px\" ml=\"12px\" mr=\"xxxs\" {...ownerPropsConfig} />\n <DSTypography\n className=\"typography-page-info-and-detail\"\n innerRef={widestTypographyRef}\n mr=\"xxs\"\n variant=\"b1\"\n as=\"span\"\n fontWeight=\"semibold\"\n textAlign=\"start\"\n >\n {pageDetails[pageIndex - 1]}\n </DSTypography>\n </>\n )}\n <ChevronDown ml=\"xxxs\" color={['brand-primary', '700']} innerRef={checkMarkRef} />\n </Grid>\n </PaginationDropdownButtonPaginator>\n {/* We calculate the length of the longest detail here (this is as per specs) */}\n <Grid style={{ position: 'relative' }}>\n {pageDetails.map((pageDetail, index) => (\n <InvisibleDiv\n innerRef={(el) => {\n if (!el) return;\n if (!widestChildRef.current) {\n widestChildRef.current = el;\n return;\n }\n if (el.offsetWidth > widestChildRef.current.offsetWidth) {\n widestChildRef.current = el;\n }\n if (index === pageDetails.length - 1) {\n widestTypographyRef.current?.style.setProperty('min-width', `${widestChildRef.current?.offsetWidth}px`);\n }\n }}\n data-testid=\"ds-pagination-invisible-detail-for-width-calc\"\n key={pageDetail}\n >\n <DSTypography\n className=\"typography-page-info-and-detail\"\n mr=\"xxs\"\n variant=\"b1\"\n as=\"span\"\n fontWeight=\"semibold\"\n textAlign=\"start\"\n >\n {pageDetail}\n </DSTypography>\n </InvisibleDiv>\n ))}\n </Grid>\n </StyledDropdown>\n );\n};\n\nDSPaginator.displayName = DSPaginatorName;\nconst DSPaginatorWithSchema = describe(DSPaginator);\nDSPaginatorWithSchema.propTypes = DSPaginatorPropTypesSchema;\n\nexport { DSPaginator, DSPaginatorWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -31,7 +31,8 @@ __export(styled_exports, {
|
|
|
31
31
|
InvisibleDiv: () => InvisibleDiv,
|
|
32
32
|
PaginationDropdownButtonPaginator: () => PaginationDropdownButtonPaginator,
|
|
33
33
|
StyledDropdown: () => StyledDropdown,
|
|
34
|
-
StyledHeader: () => StyledHeader
|
|
34
|
+
StyledHeader: () => StyledHeader,
|
|
35
|
+
StyledPageInfo: () => StyledPageInfo
|
|
35
36
|
});
|
|
36
37
|
module.exports = __toCommonJS(styled_exports);
|
|
37
38
|
var React = __toESM(require("react"));
|
|
@@ -127,4 +128,8 @@ const StyledHeader = (0, import_ds_system.styled)(import_ds_grid.default)`
|
|
|
127
128
|
font-size: ${fontSize12Base13}rem;
|
|
128
129
|
}
|
|
129
130
|
`;
|
|
131
|
+
const StyledPageInfo = import_ds_system.styled.div`
|
|
132
|
+
display: flex;
|
|
133
|
+
gap: 4px;
|
|
134
|
+
`;
|
|
130
135
|
//# sourceMappingURL=styled.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSPaginator/styled.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu-v2';\nimport Grid from '@elliemae/ds-grid';\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PAGINATOR_SLOTS } from './constants/index.js';\n\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\nconst fontSize18Base13 = 18 / 13;\nconst fontSize18Base16 = 18 / 16;\nconst fontSize12Base13 = 12 / 13;\nconst fontSize12Base16 = 12 / 16;\n\nconst styledFocusCss = css`\n &:after {\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n z-index: 7;\n }\n`;\n\nexport const InvisibleDiv = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nconst paginationDropdownButtonCommonStyles = css`\n min-height: 42px;\n display: grid;\n grid-auto-flow: column;\n justify-content: center;\n align-items: center;\n position: relative;\n padding-left: 16px;\n padding-right: 16px;\n grid-gap: 8px;\n font-size: 13px;\n color: neutral-700;\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n &[aria-disabled='true'] {\n cursor: not-allowed;\n }\n white-space: nowrap;\n`;\nexport const PaginationDropdownButtonPaginator = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PAGINATOR_SLOTS.PAGINATOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\n`;\n\nexport const StyledDropdown = styled(DSDropdownMenuV2)`\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */\n #typography-page-index {\n font-size: ${fontSize18Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize18Base13}rem;\n }\n }\n .typography-page-info-and-detail {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\nexport const StyledHeader = styled(Grid)`\n font-size: ${fontSize12Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize12Base13}rem;\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA2B;AAE3B,gCAAiC;AACjC,qBAAiB;AACjB,uBAA4B;AAE5B,uBAAkD;AAElD,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAE9B,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQnC,MAAM,uCAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAc5B,CAAC,UAAU,MAAM,MAAM,YAAY,OAAO;AAAA;AAAA,MAErD,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOb,MAAM,wCAAoC,yBAAO,gCAAY;AAAA,EAClE,MAAM;AAAA,EACN,MAAM,iCAAgB;AAAA,EACtB,0BAA0B;AAC5B,CAAC;AAAA,IACG,oCAAoC;AAAA;AAGjC,MAAM,qBAAiB,yBAAO,0CAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAYpC,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAAA,iBAIlB,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAI5B,MAAM,mBAAe,yBAAO,eAAAA,OAAI;AAAA,eACxB,gBAAgB;AAAA,uBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,iBAC5C,gBAAgB;AAAA;AAAA;",
|
|
4
|
+
"sourcesContent": ["import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu-v2';\nimport Grid from '@elliemae/ds-grid';\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PAGINATOR_SLOTS } from './constants/index.js';\n\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\nconst fontSize18Base13 = 18 / 13;\nconst fontSize18Base16 = 18 / 16;\nconst fontSize12Base13 = 12 / 13;\nconst fontSize12Base16 = 12 / 16;\n\nconst styledFocusCss = css`\n &:after {\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n z-index: 7;\n }\n`;\n\nexport const InvisibleDiv = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nconst paginationDropdownButtonCommonStyles = css`\n min-height: 42px;\n display: grid;\n grid-auto-flow: column;\n justify-content: center;\n align-items: center;\n position: relative;\n padding-left: 16px;\n padding-right: 16px;\n grid-gap: 8px;\n font-size: 13px;\n color: neutral-700;\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n &[aria-disabled='true'] {\n cursor: not-allowed;\n }\n white-space: nowrap;\n`;\nexport const PaginationDropdownButtonPaginator = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PAGINATOR_SLOTS.PAGINATOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\n`;\n\nexport const StyledDropdown = styled(DSDropdownMenuV2)`\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */\n #typography-page-index {\n font-size: ${fontSize18Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize18Base13}rem;\n }\n }\n .typography-page-info-and-detail {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\nexport const StyledHeader = styled(Grid)`\n font-size: ${fontSize12Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize12Base13}rem;\n }\n`;\n\nexport const StyledPageInfo = styled.div`\n display: flex;\n gap: 4px;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA2B;AAE3B,gCAAiC;AACjC,qBAAiB;AACjB,uBAA4B;AAE5B,uBAAkD;AAElD,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAE9B,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQnC,MAAM,uCAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAc5B,CAAC,UAAU,MAAM,MAAM,YAAY,OAAO;AAAA;AAAA,MAErD,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOb,MAAM,wCAAoC,yBAAO,gCAAY;AAAA,EAClE,MAAM;AAAA,EACN,MAAM,iCAAgB;AAAA,EACtB,0BAA0B;AAC5B,CAAC;AAAA,IACG,oCAAoC;AAAA;AAGjC,MAAM,qBAAiB,yBAAO,0CAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAYpC,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAAA,iBAIlB,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAI5B,MAAM,mBAAe,yBAAO,eAAAA,OAAI;AAAA,eACxB,gBAAgB;AAAA,uBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,iBAC5C,gBAAgB;AAAA;AAAA;AAI1B,MAAM,iBAAiB,wBAAO;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": ["Grid"]
|
|
7
7
|
}
|
|
@@ -11,7 +11,7 @@ import { createPaginatorHeader } from "./config/createPaginatorHeader.js";
|
|
|
11
11
|
import { usePaginator } from "./config/usePaginator.js";
|
|
12
12
|
import { DSPaginatorName, PAGINATOR_DATA_TESTID } from "./constants/index.js";
|
|
13
13
|
import { DSPaginatorPropTypesSchema } from "./react-desc-prop-types.js";
|
|
14
|
-
import { InvisibleDiv, PaginationDropdownButtonPaginator, StyledDropdown } from "./styled.js";
|
|
14
|
+
import { InvisibleDiv, PaginationDropdownButtonPaginator, StyledDropdown, StyledPageInfo } from "./styled.js";
|
|
15
15
|
const DSPaginator = (props) => {
|
|
16
16
|
const {
|
|
17
17
|
propsWithDefault: { pageIndex, pageCount, isLoadingPageCount, onPageChange, pageDetails, pageDetailsTitle },
|
|
@@ -90,7 +90,7 @@ const DSPaginator = (props) => {
|
|
|
90
90
|
...ownerPropsConfig,
|
|
91
91
|
onClick: buttonOnClick,
|
|
92
92
|
children: /* @__PURE__ */ jsxs(Grid, { gutter: "xxxs", alignItems: "center", style: { gridAutoFlow: "column" }, children: [
|
|
93
|
-
/* @__PURE__ */ jsxs(
|
|
93
|
+
/* @__PURE__ */ jsxs(StyledPageInfo, { innerRef: pageInfoRef, children: [
|
|
94
94
|
/* @__PURE__ */ jsx(
|
|
95
95
|
DSTypography,
|
|
96
96
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPaginator/DSPaginator.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport type { DSButtonT } from '@elliemae/ds-button-v2';\nimport { DSCircularIndeterminateIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { type DSDropdownMenuT } from '@elliemae/ds-dropdownmenu-v2';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { DSPaginationSeparator } from '../DSPaginationSeparator/index.js';\nimport { createPaginatorHeader } from './config/createPaginatorHeader.js';\nimport { usePaginator } from './config/usePaginator.js';\nimport { DSPaginatorName, PAGINATOR_DATA_TESTID } from './constants/index.js';\nimport { DSPaginatorPropTypesSchema, type DSPaginatorT } from './react-desc-prop-types.js';\nimport { InvisibleDiv, PaginationDropdownButtonPaginator, StyledDropdown } from './styled.js';\n\nconst DSPaginator: React.ComponentType<DSPaginatorT.Props> = (props) => {\n const {\n propsWithDefault: { pageIndex, pageCount, isLoadingPageCount, onPageChange, pageDetails, pageDetailsTitle },\n xstyledProps,\n globalAttributes,\n ownerPropsConfig,\n btnRef,\n btnWidth,\n pageInfoWidth,\n options,\n isOpened,\n actionRef,\n widestChildRef,\n pageInfoRef,\n checkMarkRef,\n checkMarkWidth,\n onKeyDown,\n setIsOpened,\n } = usePaginator(props);\n\n const widestTypographyRef = React.useRef<HTMLDivElement>(null);\n\n const Header = useMemo(\n () => createPaginatorHeader({ pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth }),\n [pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth],\n );\n\n const buttonOnClick: DSButtonT.Props['onClick'] = useMemo(() => {\n if (globalAttributes.onClick) return globalAttributes.onClick as DSButtonT.Props['onClick'];\n return () => setIsOpened((prev) => !prev);\n }, [globalAttributes.onClick, setIsOpened]);\n\n return (\n <StyledDropdown\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageIndex.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageChange((clickedOption as DSDropdownMenuT.ItemSingleOptions).value as number);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[-(checkMarkWidth + 7), 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n onKeyDown={onKeyDown}\n minWidth={\n pageDetails.length !== 0\n ? btnWidth + checkMarkWidth + 7\n : /**\n * Structure of the width:\n * 16px (left padding)\n * + chevronWidth (size of the chevron icon)\n * + 8px (spacing between chevron and text)\n * + pageCount length in ch\n * + 16px (right padding)\n * + a small scrollbar placeholder (to avoid text wrapping when scrollbars appear)\n * By using `calc()` + `ch` units, the component stays responsive to font-size changes\n * without requiring an extra ref to measure the page count text width.\n */\n\n `calc(${checkMarkWidth + 60}px + ${pageCount.toString().length}ch)`\n }\n maxHeight={300}\n HeaderComp={Header}\n >\n <PaginationDropdownButtonPaginator\n buttonType=\"raw\"\n disabled={isLoadingPageCount}\n innerRef={btnRef}\n aria-pressed={isOpened}\n aria-label={`Page ${pageIndex} out of ${pageCount}, ${\n pageDetails.length !== 0 ? pageDetails[pageIndex - 1] : '\\b\\b'\n }. Press to change the current page`}\n data-testid={PAGINATOR_DATA_TESTID.PAGINATOR}\n {...globalAttributes}\n {...xstyledProps}\n {...ownerPropsConfig}\n onClick={buttonOnClick}\n >\n <Grid gutter=\"xxxs\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACqGX,SAsCA,UAtCA,KAmBA,YAnBA;AArGZ,OAAOA,UAAS,eAAe;AAE/B,SAAS,wCAAwC;AAEjD,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAC5B,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;AAC7B,SAAS,6BAA6B;AACtC,SAAS,6BAA6B;AACtC,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB,6BAA6B;AACvD,SAAS,kCAAqD;AAC9D,SAAS,cAAc,mCAAmC,sBAAsB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport type { DSButtonT } from '@elliemae/ds-button-v2';\nimport { DSCircularIndeterminateIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { type DSDropdownMenuT } from '@elliemae/ds-dropdownmenu-v2';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { DSPaginationSeparator } from '../DSPaginationSeparator/index.js';\nimport { createPaginatorHeader } from './config/createPaginatorHeader.js';\nimport { usePaginator } from './config/usePaginator.js';\nimport { DSPaginatorName, PAGINATOR_DATA_TESTID } from './constants/index.js';\nimport { DSPaginatorPropTypesSchema, type DSPaginatorT } from './react-desc-prop-types.js';\nimport { InvisibleDiv, PaginationDropdownButtonPaginator, StyledDropdown, StyledPageInfo } from './styled.js';\n\nconst DSPaginator: React.ComponentType<DSPaginatorT.Props> = (props) => {\n const {\n propsWithDefault: { pageIndex, pageCount, isLoadingPageCount, onPageChange, pageDetails, pageDetailsTitle },\n xstyledProps,\n globalAttributes,\n ownerPropsConfig,\n btnRef,\n btnWidth,\n pageInfoWidth,\n options,\n isOpened,\n actionRef,\n widestChildRef,\n pageInfoRef,\n checkMarkRef,\n checkMarkWidth,\n onKeyDown,\n setIsOpened,\n } = usePaginator(props);\n\n const widestTypographyRef = React.useRef<HTMLDivElement>(null);\n\n const Header = useMemo(\n () => createPaginatorHeader({ pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth }),\n [pageDetailsTitle, pageInfoWidth, ownerPropsConfig, checkMarkWidth],\n );\n\n const buttonOnClick: DSButtonT.Props['onClick'] = useMemo(() => {\n if (globalAttributes.onClick) return globalAttributes.onClick as DSButtonT.Props['onClick'];\n return () => setIsOpened((prev) => !prev);\n }, [globalAttributes.onClick, setIsOpened]);\n\n return (\n <StyledDropdown\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageIndex.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageChange((clickedOption as DSDropdownMenuT.ItemSingleOptions).value as number);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[-(checkMarkWidth + 7), 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n onKeyDown={onKeyDown}\n minWidth={\n pageDetails.length !== 0\n ? btnWidth + checkMarkWidth + 7\n : /**\n * Structure of the width:\n * 16px (left padding)\n * + chevronWidth (size of the chevron icon)\n * + 8px (spacing between chevron and text)\n * + pageCount length in ch\n * + 16px (right padding)\n * + a small scrollbar placeholder (to avoid text wrapping when scrollbars appear)\n * By using `calc()` + `ch` units, the component stays responsive to font-size changes\n * without requiring an extra ref to measure the page count text width.\n */\n\n `calc(${checkMarkWidth + 60}px + ${pageCount.toString().length}ch)`\n }\n maxHeight={300}\n HeaderComp={Header}\n >\n <PaginationDropdownButtonPaginator\n buttonType=\"raw\"\n disabled={isLoadingPageCount}\n innerRef={btnRef}\n aria-pressed={isOpened}\n aria-label={`Page ${pageIndex} out of ${pageCount}, ${\n pageDetails.length !== 0 ? pageDetails[pageIndex - 1] : '\\b\\b'\n }. Press to change the current page`}\n data-testid={PAGINATOR_DATA_TESTID.PAGINATOR}\n {...globalAttributes}\n {...xstyledProps}\n {...ownerPropsConfig}\n onClick={buttonOnClick}\n >\n <Grid gutter=\"xxxs\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <StyledPageInfo innerRef={pageInfoRef}>\n <DSTypography\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */\n id=\"typography-page-index\"\n variant=\"b1\"\n as=\"span\"\n fontWeight=\"semibold\"\n textAlign=\"start\"\n >\n {pageIndex}\n </DSTypography>\n <DSTypography\n variant=\"b1\"\n as=\"span\"\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */ className=\"typography-page-info-and-detail\"\n >\n / {pageCount}\n </DSTypography>\n </StyledPageInfo>\n {isLoadingPageCount && <DSCircularIndeterminateIndicator ml=\"xxxs\" mr=\"xxxs\" size=\"xs\" />}\n {pageDetails.length !== 0 && (\n <>\n <DSPaginationSeparator height=\"12px\" ml=\"12px\" mr=\"xxxs\" {...ownerPropsConfig} />\n <DSTypography\n className=\"typography-page-info-and-detail\"\n innerRef={widestTypographyRef}\n mr=\"xxs\"\n variant=\"b1\"\n as=\"span\"\n fontWeight=\"semibold\"\n textAlign=\"start\"\n >\n {pageDetails[pageIndex - 1]}\n </DSTypography>\n </>\n )}\n <ChevronDown ml=\"xxxs\" color={['brand-primary', '700']} innerRef={checkMarkRef} />\n </Grid>\n </PaginationDropdownButtonPaginator>\n {/* We calculate the length of the longest detail here (this is as per specs) */}\n <Grid style={{ position: 'relative' }}>\n {pageDetails.map((pageDetail, index) => (\n <InvisibleDiv\n innerRef={(el) => {\n if (!el) return;\n if (!widestChildRef.current) {\n widestChildRef.current = el;\n return;\n }\n if (el.offsetWidth > widestChildRef.current.offsetWidth) {\n widestChildRef.current = el;\n }\n if (index === pageDetails.length - 1) {\n widestTypographyRef.current?.style.setProperty('min-width', `${widestChildRef.current?.offsetWidth}px`);\n }\n }}\n data-testid=\"ds-pagination-invisible-detail-for-width-calc\"\n key={pageDetail}\n >\n <DSTypography\n className=\"typography-page-info-and-detail\"\n mr=\"xxs\"\n variant=\"b1\"\n as=\"span\"\n fontWeight=\"semibold\"\n textAlign=\"start\"\n >\n {pageDetail}\n </DSTypography>\n </InvisibleDiv>\n ))}\n </Grid>\n </StyledDropdown>\n );\n};\n\nDSPaginator.displayName = DSPaginatorName;\nconst DSPaginatorWithSchema = describe(DSPaginator);\nDSPaginatorWithSchema.propTypes = DSPaginatorPropTypesSchema;\n\nexport { DSPaginator, DSPaginatorWithSchema };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -91,10 +91,15 @@ const StyledHeader = styled(Grid)`
|
|
|
91
91
|
font-size: ${fontSize12Base13}rem;
|
|
92
92
|
}
|
|
93
93
|
`;
|
|
94
|
+
const StyledPageInfo = styled.div`
|
|
95
|
+
display: flex;
|
|
96
|
+
gap: 4px;
|
|
97
|
+
`;
|
|
94
98
|
export {
|
|
95
99
|
InvisibleDiv,
|
|
96
100
|
PaginationDropdownButtonPaginator,
|
|
97
101
|
StyledDropdown,
|
|
98
|
-
StyledHeader
|
|
102
|
+
StyledHeader,
|
|
103
|
+
StyledPageInfo
|
|
99
104
|
};
|
|
100
105
|
//# sourceMappingURL=styled.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPaginator/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu-v2';\nimport Grid from '@elliemae/ds-grid';\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PAGINATOR_SLOTS } from './constants/index.js';\n\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\nconst fontSize18Base13 = 18 / 13;\nconst fontSize18Base16 = 18 / 16;\nconst fontSize12Base13 = 12 / 13;\nconst fontSize12Base16 = 12 / 16;\n\nconst styledFocusCss = css`\n &:after {\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n z-index: 7;\n }\n`;\n\nexport const InvisibleDiv = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nconst paginationDropdownButtonCommonStyles = css`\n min-height: 42px;\n display: grid;\n grid-auto-flow: column;\n justify-content: center;\n align-items: center;\n position: relative;\n padding-left: 16px;\n padding-right: 16px;\n grid-gap: 8px;\n font-size: 13px;\n color: neutral-700;\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n &[aria-disabled='true'] {\n cursor: not-allowed;\n }\n white-space: nowrap;\n`;\nexport const PaginationDropdownButtonPaginator = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PAGINATOR_SLOTS.PAGINATOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\n`;\n\nexport const StyledDropdown = styled(DSDropdownMenuV2)`\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */\n #typography-page-index {\n font-size: ${fontSize18Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize18Base13}rem;\n }\n }\n .typography-page-info-and-detail {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\nexport const StyledHeader = styled(Grid)`\n font-size: ${fontSize12Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize12Base13}rem;\n }\n`;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,kBAAkB;AAE3B,SAAS,wBAAwB;AACjC,OAAO,UAAU;AACjB,SAAS,KAAK,cAAc;AAE5B,SAAS,kBAAkB,uBAAuB;AAElD,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAE9B,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQnC,MAAM,uCAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAc5B,CAAC,UAAU,MAAM,MAAM,YAAY,OAAO;AAAA;AAAA,MAErD,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOb,MAAM,oCAAoC,OAAO,YAAY;AAAA,EAClE,MAAM;AAAA,EACN,MAAM,gBAAgB;AAAA,EACtB,0BAA0B;AAC5B,CAAC;AAAA,IACG,oCAAoC;AAAA;AAGjC,MAAM,iBAAiB,OAAO,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAYpC,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAAA,iBAIlB,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAI5B,MAAM,eAAe,OAAO,IAAI;AAAA,eACxB,gBAAgB;AAAA,uBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,iBAC5C,gBAAgB;AAAA;AAAA;",
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu-v2';\nimport Grid from '@elliemae/ds-grid';\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PAGINATOR_SLOTS } from './constants/index.js';\n\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\nconst fontSize18Base13 = 18 / 13;\nconst fontSize18Base16 = 18 / 16;\nconst fontSize12Base13 = 12 / 13;\nconst fontSize12Base16 = 12 / 16;\n\nconst styledFocusCss = css`\n &:after {\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n z-index: 7;\n }\n`;\n\nexport const InvisibleDiv = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nconst paginationDropdownButtonCommonStyles = css`\n min-height: 42px;\n display: grid;\n grid-auto-flow: column;\n justify-content: center;\n align-items: center;\n position: relative;\n padding-left: 16px;\n padding-right: 16px;\n grid-gap: 8px;\n font-size: 13px;\n color: neutral-700;\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n &[aria-disabled='true'] {\n cursor: not-allowed;\n }\n white-space: nowrap;\n`;\nexport const PaginationDropdownButtonPaginator = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PAGINATOR_SLOTS.PAGINATOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\n`;\n\nexport const StyledDropdown = styled(DSDropdownMenuV2)`\n /**\n * Pagination uses DSTypography internally, but each typography variant defines\n * its own font-size. When these components are placed inside a styled() wrapper,\n * trying to style them via styled(DSTypography) triggers TypeScript errors\n * because DSTypography exposes \"as\" props and variant-specific overrides.\n *\n * Instead of wrapping DSTypography directly in styled(), we target the\n * underlying rendered elements via className/id. This avoids the TS conflicts\n * while still allowing us to override their font-size reliably.\n */\n #typography-page-index {\n font-size: ${fontSize18Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize18Base13}rem;\n }\n }\n .typography-page-info-and-detail {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\nexport const StyledHeader = styled(Grid)`\n font-size: ${fontSize12Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize12Base13}rem;\n }\n`;\n\nexport const StyledPageInfo = styled.div`\n display: flex;\n gap: 4px;\n`;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,kBAAkB;AAE3B,SAAS,wBAAwB;AACjC,OAAO,UAAU;AACjB,SAAS,KAAK,cAAc;AAE5B,SAAS,kBAAkB,uBAAuB;AAElD,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAE9B,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQnC,MAAM,uCAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAc5B,CAAC,UAAU,MAAM,MAAM,YAAY,OAAO;AAAA;AAAA,MAErD,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOb,MAAM,oCAAoC,OAAO,YAAY;AAAA,EAClE,MAAM;AAAA,EACN,MAAM,gBAAgB;AAAA,EACtB,0BAA0B;AAC5B,CAAC;AAAA,IACG,oCAAoC;AAAA;AAGjC,MAAM,iBAAiB,OAAO,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAYpC,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAAA,iBAIlB,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAI5B,MAAM,eAAe,OAAO,IAAI;AAAA,eACxB,gBAAgB;AAAA,uBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,iBAC5C,gBAAgB;AAAA;AAAA;AAI1B,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,3 +2,4 @@ export declare const InvisibleDiv: import("styled-components").StyledComponent<"
|
|
|
2
2
|
export declare const PaginationDropdownButtonPaginator: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-button-v2").DSButtonV3T.Props>, import("@elliemae/ds-system").Theme, import("styled-components").ThemeProps<import("@xstyled/system").Theme> & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ComponentType<import("@elliemae/ds-button-v2").DSButtonV3T.Props>>, never>;
|
|
3
3
|
export declare const StyledDropdown: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-dropdownmenu-v2").DSDropdownMenuT.Props>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ComponentType<import("@elliemae/ds-dropdownmenu-v2").DSDropdownMenuT.Props>>, never>;
|
|
4
4
|
export declare const StyledHeader: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
5
|
+
export declare const StyledPageInfo: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-pagination",
|
|
3
|
-
"version": "3.57.0-next.
|
|
3
|
+
"version": "3.57.0-next.45",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Pagination",
|
|
6
6
|
"files": [
|
|
@@ -45,20 +45,20 @@
|
|
|
45
45
|
"checkDeps": "npm exec ../../util/ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@elliemae/ds-button-v2": "3.57.0-next.
|
|
49
|
-
"@elliemae/ds-circular-progress-indicator": "3.57.0-next.
|
|
50
|
-
"@elliemae/ds-dropdownmenu-v2": "3.57.0-next.
|
|
51
|
-
"@elliemae/ds-grid": "3.57.0-next.
|
|
52
|
-
"@elliemae/ds-icons": "3.57.0-next.
|
|
53
|
-
"@elliemae/ds-props-helpers": "3.57.0-next.
|
|
54
|
-
"@elliemae/ds-system": "3.57.0-next.
|
|
55
|
-
"@elliemae/ds-typescript-helpers": "3.57.0-next.
|
|
56
|
-
"@elliemae/ds-typography": "3.57.0-next.
|
|
48
|
+
"@elliemae/ds-button-v2": "3.57.0-next.45",
|
|
49
|
+
"@elliemae/ds-circular-progress-indicator": "3.57.0-next.45",
|
|
50
|
+
"@elliemae/ds-dropdownmenu-v2": "3.57.0-next.45",
|
|
51
|
+
"@elliemae/ds-grid": "3.57.0-next.45",
|
|
52
|
+
"@elliemae/ds-icons": "3.57.0-next.45",
|
|
53
|
+
"@elliemae/ds-props-helpers": "3.57.0-next.45",
|
|
54
|
+
"@elliemae/ds-system": "3.57.0-next.45",
|
|
55
|
+
"@elliemae/ds-typescript-helpers": "3.57.0-next.45",
|
|
56
|
+
"@elliemae/ds-typography": "3.57.0-next.45",
|
|
57
57
|
"@xstyled/system": "catalog:"
|
|
58
58
|
},
|
|
59
59
|
"devDependencies": {
|
|
60
|
-
"@elliemae/ds-monorepo-devops": "3.57.0-next.
|
|
61
|
-
"@elliemae/ds-test-utils": "3.57.0-next.
|
|
60
|
+
"@elliemae/ds-monorepo-devops": "3.57.0-next.45",
|
|
61
|
+
"@elliemae/ds-test-utils": "3.57.0-next.45",
|
|
62
62
|
"@elliemae/pui-cli": "catalog:",
|
|
63
63
|
"jest": "catalog:",
|
|
64
64
|
"styled-components": "catalog:",
|
|
@@ -77,5 +77,5 @@
|
|
|
77
77
|
"access": "public",
|
|
78
78
|
"typeSafety": true
|
|
79
79
|
},
|
|
80
|
-
"gitHead": "
|
|
80
|
+
"gitHead": "d4c28c2bdf9206e85aa787a76333ef2e59c02a25"
|
|
81
81
|
}
|