@elliemae/ds-pagination 3.70.0-next.47 → 3.70.0-next.49

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.
Files changed (9) hide show
  1. package/dist/cjs/parts/DSPaginator/styled.js +1 -1
  2. package/dist/cjs/parts/DSPaginator/styled.js.map +1 -1
  3. package/dist/cjs/parts/DSPerPageSelector/styled.js +1 -1
  4. package/dist/cjs/parts/DSPerPageSelector/styled.js.map +1 -1
  5. package/dist/esm/parts/DSPaginator/styled.js +1 -1
  6. package/dist/esm/parts/DSPaginator/styled.js.map +1 -1
  7. package/dist/esm/parts/DSPerPageSelector/styled.js +1 -1
  8. package/dist/esm/parts/DSPerPageSelector/styled.js.map +1 -1
  9. package/package.json +12 -12
package/dist/cjs/parts/DSPaginator/styled.js CHANGED
@@ -86,7 +86,7 @@ const paginationDropdownButtonCommonStyles = import_ds_system.css`
86
86
  :focus {
87
87
  ${styledFocusCss}
88
88
  }
89
- &[aria-disabled='true'] {
89
+ &:disabled {
90
90
  cursor: not-allowed;
91
91
  }
92
92
  white-space: nowrap;
package/dist/cjs/parts/DSPaginator/styled.js.map CHANGED
@@ -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\nexport const StyledPageInfo = styled.div`\n display: flex;\n gap: 4px;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
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 &:disabled {\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
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
  }
package/dist/cjs/parts/DSPerPageSelector/styled.js CHANGED
@@ -80,7 +80,7 @@ const paginationDropdownButtonCommonStyles = import_ds_system.css`
80
80
  :focus {
81
81
  ${styledFocusCss}
82
82
  }
83
- &[aria-disabled='true'] {
83
+ &:disabled {
84
84
  cursor: not-allowed;
85
85
  }
86
86
  white-space: nowrap;
package/dist/cjs/parts/DSPerPageSelector/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/DSPerPageSelector/styled.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PER_PAGE_SELECTOR_SLOTS } from './constants/index.js';\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\n\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 PaginationDropdownButtonPerPageSelector = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PER_PAGE_SELECTOR_SLOTS.PER_PAGE_SELECTOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\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-per-page-selector {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\n\nexport const StyledHeader = styled.div`\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"],
4
+ "sourcesContent": ["import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PER_PAGE_SELECTOR_SLOTS } from './constants/index.js';\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\n\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 &:disabled {\n cursor: not-allowed;\n }\n white-space: nowrap;\n`;\nexport const PaginationDropdownButtonPerPageSelector = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PER_PAGE_SELECTOR_SLOTS.PER_PAGE_SELECTOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\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-per-page-selector {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\n\nexport const StyledHeader = styled.div`\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
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA2B;AAE3B,uBAA4B;AAE5B,uBAA0D;AAC1D,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAE9B,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,8CAA0C,yBAAO,gCAAY;AAAA,EACxE,MAAM;AAAA,EACN,MAAM,yCAAwB;AAAA,EAC9B,0BAA0B;AAC5B,CAAC;AAAA,IACG,oCAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAYvB,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAK5B,MAAM,eAAe,wBAAO;AAAA,eACpB,gBAAgB;AAAA,uBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,iBAC5C,gBAAgB;AAAA;AAAA;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/DSPaginator/styled.js CHANGED
@@ -49,7 +49,7 @@ const paginationDropdownButtonCommonStyles = css`
49
49
  :focus {
50
50
  ${styledFocusCss}
51
51
  }
52
- &[aria-disabled='true'] {
52
+ &:disabled {
53
53
  cursor: not-allowed;
54
54
  }
55
55
  white-space: nowrap;
package/dist/esm/parts/DSPaginator/styled.js.map CHANGED
@@ -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\nexport const StyledPageInfo = styled.div`\n display: flex;\n gap: 4px;\n`;\n"],
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 &:disabled {\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
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
  }
package/dist/esm/parts/DSPerPageSelector/styled.js CHANGED
@@ -45,7 +45,7 @@ const paginationDropdownButtonCommonStyles = css`
45
45
  :focus {
46
46
  ${styledFocusCss}
47
47
  }
48
- &[aria-disabled='true'] {
48
+ &:disabled {
49
49
  cursor: not-allowed;
50
50
  }
51
51
  white-space: nowrap;
package/dist/esm/parts/DSPerPageSelector/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPerPageSelector/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PER_PAGE_SELECTOR_SLOTS } from './constants/index.js';\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\n\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 PaginationDropdownButtonPerPageSelector = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PER_PAGE_SELECTOR_SLOTS.PER_PAGE_SELECTOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\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-per-page-selector {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\n\nexport const StyledHeader = styled.div`\n font-size: ${fontSize12Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize12Base13}rem;\n }\n`;\n"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { css, styled } from '@elliemae/ds-system';\nimport type {} from '@xstyled/system';\nimport { DSPaginationName, PER_PAGE_SELECTOR_SLOTS } from './constants/index.js';\nconst fontSize13Base13 = 13 / 13;\nconst fontSize13Base16 = 13 / 16;\n\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 &:disabled {\n cursor: not-allowed;\n }\n white-space: nowrap;\n`;\nexport const PaginationDropdownButtonPerPageSelector = styled(DSButtonV3, {\n name: DSPaginationName,\n slot: PER_PAGE_SELECTOR_SLOTS.PER_PAGE_SELECTOR,\n preserveLegacyDataTestId: true,\n})`\n ${paginationDropdownButtonCommonStyles}\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-per-page-selector {\n font-size: ${fontSize13Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize13Base13}rem;\n }\n }\n`;\n\nexport const StyledHeader = styled.div`\n font-size: ${fontSize12Base16}rem;\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${fontSize12Base13}rem;\n }\n`;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,kBAAkB;AAE3B,SAAS,KAAK,cAAc;AAE5B,SAAS,kBAAkB,+BAA+B;AAC1D,MAAM,mBAAmB,KAAK;AAC9B,MAAM,mBAAmB,KAAK;AAE9B,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,0CAA0C,OAAO,YAAY;AAAA,EACxE,MAAM;AAAA,EACN,MAAM,wBAAwB;AAAA,EAC9B,0BAA0B;AAC5B,CAAC;AAAA,IACG,oCAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAYvB,gBAAgB;AAAA,yBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,mBAC5C,gBAAgB;AAAA;AAAA;AAAA;AAK5B,MAAM,eAAe,OAAO;AAAA,eACpB,gBAAgB;AAAA,uBACR,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA,iBAC5C,gBAAgB;AAAA;AAAA;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-pagination",
3
- "version": "3.70.0-next.47",
3
+ "version": "3.70.0-next.49",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Pagination",
6
6
  "files": [
@@ -38,23 +38,23 @@
38
38
  },
39
39
  "dependencies": {
40
40
  "@xstyled/system": "~3.8.1",
41
- "@elliemae/ds-button-v2": "3.70.0-next.47",
42
- "@elliemae/ds-circular-progress-indicator": "3.70.0-next.47",
43
- "@elliemae/ds-dropdownmenu-v2": "3.70.0-next.47",
44
- "@elliemae/ds-typescript-helpers": "3.70.0-next.47",
45
- "@elliemae/ds-icons": "3.70.0-next.47",
46
- "@elliemae/ds-props-helpers": "3.70.0-next.47",
47
- "@elliemae/ds-grid": "3.70.0-next.47",
48
- "@elliemae/ds-typography": "3.70.0-next.47",
49
- "@elliemae/ds-system": "3.70.0-next.47"
41
+ "@elliemae/ds-button-v2": "3.70.0-next.49",
42
+ "@elliemae/ds-dropdownmenu-v2": "3.70.0-next.49",
43
+ "@elliemae/ds-circular-progress-indicator": "3.70.0-next.49",
44
+ "@elliemae/ds-grid": "3.70.0-next.49",
45
+ "@elliemae/ds-props-helpers": "3.70.0-next.49",
46
+ "@elliemae/ds-icons": "3.70.0-next.49",
47
+ "@elliemae/ds-typescript-helpers": "3.70.0-next.49",
48
+ "@elliemae/ds-system": "3.70.0-next.49",
49
+ "@elliemae/ds-typography": "3.70.0-next.49"
50
50
  },
51
51
  "devDependencies": {
52
52
  "@playwright/experimental-ct-react": "^1.60.0",
53
53
  "jest": "^30.0.0",
54
54
  "styled-components": "~5.3.9",
55
55
  "styled-system": "^5.1.5",
56
- "@elliemae/ds-monorepo-devops": "3.70.0-next.47",
57
- "@elliemae/ds-test-utils": "3.70.0-next.47"
56
+ "@elliemae/ds-monorepo-devops": "3.70.0-next.49",
57
+ "@elliemae/ds-test-utils": "3.70.0-next.49"
58
58
  },
59
59
  "peerDependencies": {
60
60
  "@testing-library/react": "^16.0.1",