@elliemae/ds-pagination 3.11.1-rc.1 → 3.12.0-next.1

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 (18) hide show
  1. package/dist/cjs/Pagination.js.map +2 -2
  2. package/dist/cjs/parts/PageNextButton.js.map +2 -2
  3. package/dist/cjs/parts/PagePrevButton.js.map +2 -2
  4. package/dist/cjs/parts/PaginationContent.js.map +2 -2
  5. package/dist/cjs/parts/Paginator.js.map +1 -1
  6. package/dist/cjs/parts/PerPageSelector.js.map +2 -2
  7. package/dist/cjs/props.js.map +1 -1
  8. package/dist/cjs/styled.js.map +2 -2
  9. package/dist/esm/Pagination.js.map +2 -2
  10. package/dist/esm/parts/PageNextButton.js.map +2 -2
  11. package/dist/esm/parts/PagePrevButton.js.map +2 -2
  12. package/dist/esm/parts/PaginationContent.js.map +2 -2
  13. package/dist/esm/parts/Paginator.js.map +1 -1
  14. package/dist/esm/parts/PerPageSelector.js.map +2 -2
  15. package/dist/esm/props.js.map +1 -1
  16. package/dist/esm/styled.js +1 -8
  17. package/dist/esm/styled.js.map +2 -2
  18. package/package.json +11 -8
package/dist/cjs/Pagination.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Pagination.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { PaginationContent } from './parts/PaginationContent';\nimport { propTypes, defaultProps } from './props';\nimport { DSPaginationProps } from './index.d';\n\nconst DSPagination: React.ComponentType<DSPaginationProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefault, propTypes);\n\n return <PaginationContent {...propsWithDefault} />;\n};\n\nDSPagination.propTypes = propTypes;\nDSPagination.displayName = 'DSPagination';\nconst DSPaginationWithSchema = describe(DSPagination).description('DSPagination');\nDSPaginationWithSchema.propTypes = propTypes;\n\nexport { DSPagination, DSPaginationWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAuF;AACvF,+BAAkC;AAClC,mBAAwC;AAGxC,MAAM,eAAuD,CAAC,UAAU;AACtE,QAAM,uBAAmB,kDAA6B,OAAO,yBAAY;AACzE,0DAA+B,kBAAkB,sBAAS;AAE1D,SAAO,4CAAC;AAAA,IAAmB,GAAG;AAAA,GAAkB;AAClD;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,6BAAyB,8BAAS,YAAY,EAAE,YAAY,cAAc;AAChF,uBAAuB,YAAY;",
4
+ "sourcesContent": ["import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { PaginationContent } from './parts/PaginationContent';\nimport { propTypes, defaultProps } from './props';\nimport type { DSPaginationProps } from './index.d';\n\nconst DSPagination: React.ComponentType<DSPaginationProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefault, propTypes);\n\n return <PaginationContent {...propsWithDefault} />;\n};\n\nDSPagination.propTypes = propTypes;\nDSPagination.displayName = 'DSPagination';\nconst DSPaginationWithSchema = describe(DSPagination).description('DSPagination');\nDSPaginationWithSchema.propTypes = propTypes;\n\nexport { DSPagination, DSPaginationWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADUd;AATT,0BAAuF;AACvF,+BAAkC;AAClC,mBAAwC;AAGxC,MAAM,eAAuD,CAAC,UAAU;AACtE,QAAM,uBAAmB,kDAA6B,OAAO,yBAAY;AACzE,0DAA+B,kBAAkB,sBAAS;AAE1D,SAAO,4CAAC;AAAA,IAAmB,GAAG;AAAA,GAAkB;AAClD;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,6BAAyB,8BAAS,YAAY,EAAE,YAAY,cAAc;AAChF,uBAAuB,YAAY;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/PageNextButton.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/PageNextButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronRight } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport { DSPaginationProps } from '../index.d';\n\nexport const PageNextButton: React.ComponentType<Required<Pick<DSPaginationProps, 'onNextPage' | 'canNextPage'>>> = ({\n onNextPage,\n canNextPage,\n}) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canNextPage) onNextPage();\n }}\n disabled={!canNextPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.NEXT_BUTTON}\n HeaderComp={() => 'Page'}\n aria-label=\"Go to next page\"\n >\n <ChevronRight color={canNextPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,sBAA6B;AAC7B,kCAAuC;AACvC,oBAAuC;AAGhC,MAAM,iBAAuG,CAAC;AAAA,EACnH;AAAA,EACA;AACF,MACE,4CAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAa,iBAAW;AAAA,EAC9B;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,mDAAuB;AAAA,EACpC,YAAY,MAAM;AAAA,EAClB,cAAW;AAAA,EAEX,sDAAC;AAAA,IAAa,OAAO,cAAc,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACpF;",
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronRight } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport type { DSPaginationProps } from '../index.d';\n\nexport const PageNextButton: React.ComponentType<Required<Pick<DSPaginationProps, 'onNextPage' | 'canNextPage'>>> = ({\n onNextPage,\n canNextPage,\n}) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canNextPage) onNextPage();\n }}\n disabled={!canNextPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.NEXT_BUTTON}\n HeaderComp={() => 'Page'}\n aria-label=\"Go to next page\"\n >\n <ChevronRight color={canNextPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqBnB;AAnBJ,sBAA6B;AAC7B,kCAAuC;AACvC,oBAAuC;AAGhC,MAAM,iBAAuG,CAAC;AAAA,EACnH;AAAA,EACA;AACF,MACE,4CAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAa,iBAAW;AAAA,EAC9B;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,mDAAuB;AAAA,EACpC,YAAY,MAAM;AAAA,EAClB,cAAW;AAAA,EAEX,sDAAC;AAAA,IAAa,OAAO,cAAc,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACpF;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/PagePrevButton.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/PagePrevButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport { DSPaginationProps } from '../index.d';\n\nexport const PagePrevButton: React.ComponentType<\n Required<Pick<DSPaginationProps, 'onPreviousPage' | 'canPreviousPage'>>\n> = ({ onPreviousPage, canPreviousPage }) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canPreviousPage) onPreviousPage();\n }}\n disabled={!canPreviousPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.PREVIOUS_BUTTON}\n aria-label=\"Go to previous page\"\n >\n <ChevronLeft color={canPreviousPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,sBAA4B;AAC5B,kCAAuC;AACvC,oBAAuC;AAGhC,MAAM,iBAET,CAAC,EAAE,gBAAgB,gBAAgB,MACrC,4CAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAiB,qBAAe;AAAA,EACtC;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,mDAAuB;AAAA,EACpC,cAAW;AAAA,EAEX,sDAAC;AAAA,IAAY,OAAO,kBAAkB,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACvF;",
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport type { DSPaginationProps } from '../index.d';\n\nexport const PagePrevButton: React.ComponentType<\n Required<Pick<DSPaginationProps, 'onPreviousPage' | 'canPreviousPage'>>\n> = ({ onPreviousPage, canPreviousPage }) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canPreviousPage) onPreviousPage();\n }}\n disabled={!canPreviousPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.PREVIOUS_BUTTON}\n aria-label=\"Go to previous page\"\n >\n <ChevronLeft color={canPreviousPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmBnB;AAjBJ,sBAA4B;AAC5B,kCAAuC;AACvC,oBAAuC;AAGhC,MAAM,iBAET,CAAC,EAAE,gBAAgB,gBAAgB,MACrC,4CAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAiB,qBAAe;AAAA,EACtC;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,mDAAuB;AAAA,EACpC,cAAW;AAAA,EAEX,sDAAC;AAAA,IAAY,OAAO,kBAAkB,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACvF;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/PaginationContent.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/PaginationContent.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useGetGlobalAttributes } from '@elliemae/ds-utilities';\nimport { PaginationContainer, PaginationSeparator, PaginationWrapper } from '../styled';\nimport PerPageSelector from './PerPageSelector';\nimport Paginator from './Paginator';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PagePrevButton } from './PagePrevButton';\nimport { PageNextButton } from './PageNextButton';\nimport { DSPaginationProps } from '../index.d';\n\nexport const PaginationContent: React.ComponentType<Required<DSPaginationProps>> = (props) => {\n const {\n pageIndex,\n pageSize,\n canPreviousPage,\n canNextPage,\n onPageSizeChange,\n onNextPage,\n onPreviousPage,\n onPageChange,\n pageCount,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n perPageOptions,\n maxPerPage,\n perPageStep,\n minPerPage,\n width,\n } = props;\n\n const globalAttributes = useGetGlobalAttributes(props);\n\n return (\n <PaginationContainer\n justifyContent=\"center\"\n alignItems=\"center\"\n width={width.toString()}\n data-testid={PAGINATION_DATA_TESTID.CONTAINER}\n cols={['minmax(auto, 80%)']}\n {...globalAttributes}\n >\n <PaginationWrapper>\n {showPerPageSelector && (\n <>\n <PerPageSelector\n pageSize={pageSize}\n onPageSizeChange={onPageSizeChange}\n perPageOptions={perPageOptions}\n maxPerPage={maxPerPage}\n perPageStep={perPageStep}\n minPerPage={minPerPage}\n />\n <PaginationSeparator mr={24} />\n </>\n )}\n <Grid mr=\"32px\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <PagePrevButton canPreviousPage={canPreviousPage} onPreviousPage={onPreviousPage} />\n <Paginator\n pageCount={pageCount}\n pageIndex={pageIndex}\n onPageChange={onPageChange}\n pageDetails={pageDetails}\n pageDetailsTitle={pageDetailsTitle}\n />\n <PageNextButton canNextPage={canNextPage} onNextPage={onNextPage} />\n </Grid>\n </PaginationWrapper>\n </PaginationContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,qBAAqB;AACrB,0BAAuC;AACvC,oBAA4E;AAC5E,6BAA4B;AAC5B,uBAAsB;AACtB,kCAAuC;AACvC,4BAA+B;AAC/B,4BAA+B;AAGxB,MAAM,oBAAsE,CAAC,UAAU;AAC5F,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,uBAAmB,4CAAuB,KAAK;AAErD,SACE,4CAAC;AAAA,IACC,gBAAe;AAAA,IACf,YAAW;AAAA,IACX,OAAO,MAAM,SAAS;AAAA,IACtB,eAAa,mDAAuB;AAAA,IACpC,MAAM,CAAC,mBAAmB;AAAA,IACzB,GAAG;AAAA,IAEJ,uDAAC;AAAA,MACE;AAAA,+BACC;AAAA,UACE;AAAA,wDAAC,uBAAAA,SAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,4CAAC;AAAA,cAAoB,IAAI;AAAA,aAAI;AAAA;AAAA,SAC/B;AAAA,QAEF,6CAAC;AAAA,UAAK,IAAG;AAAA,UAAO,YAAW;AAAA,UAAS,OAAO,EAAE,cAAc,SAAS;AAAA,UAClE;AAAA,wDAAC;AAAA,cAAe;AAAA,cAAkC;AAAA,aAAgC;AAAA,YAClF,4CAAC,iBAAAC,SAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,4CAAC;AAAA,cAAe;AAAA,cAA0B;AAAA,aAAwB;AAAA;AAAA,SACpE;AAAA;AAAA,KACF;AAAA,GACF;AAEJ;",
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useGetGlobalAttributes } from '@elliemae/ds-utilities';\nimport { PaginationContainer, PaginationSeparator, PaginationWrapper } from '../styled';\nimport PerPageSelector from './PerPageSelector';\nimport Paginator from './Paginator';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PagePrevButton } from './PagePrevButton';\nimport { PageNextButton } from './PageNextButton';\nimport type { DSPaginationProps } from '../index.d';\n\nexport const PaginationContent: React.ComponentType<Required<DSPaginationProps>> = (props) => {\n const {\n pageIndex,\n pageSize,\n canPreviousPage,\n canNextPage,\n onPageSizeChange,\n onNextPage,\n onPreviousPage,\n onPageChange,\n pageCount,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n perPageOptions,\n maxPerPage,\n perPageStep,\n minPerPage,\n width,\n } = props;\n\n const globalAttributes = useGetGlobalAttributes(props);\n\n return (\n <PaginationContainer\n justifyContent=\"center\"\n alignItems=\"center\"\n width={width.toString()}\n data-testid={PAGINATION_DATA_TESTID.CONTAINER}\n cols={['minmax(auto, 80%)']}\n {...globalAttributes}\n >\n <PaginationWrapper>\n {showPerPageSelector && (\n <>\n <PerPageSelector\n pageSize={pageSize}\n onPageSizeChange={onPageSizeChange}\n perPageOptions={perPageOptions}\n maxPerPage={maxPerPage}\n perPageStep={perPageStep}\n minPerPage={minPerPage}\n />\n <PaginationSeparator mr={24} />\n </>\n )}\n <Grid mr=\"32px\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <PagePrevButton canPreviousPage={canPreviousPage} onPreviousPage={onPreviousPage} />\n <Paginator\n pageCount={pageCount}\n pageIndex={pageIndex}\n onPageChange={onPageChange}\n pageDetails={pageDetails}\n pageDetailsTitle={pageDetailsTitle}\n />\n <PageNextButton canNextPage={canNextPage} onNextPage={onNextPage} />\n </Grid>\n </PaginationWrapper>\n </PaginationContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8Cb;AA5CV,qBAAqB;AACrB,0BAAuC;AACvC,oBAA4E;AAC5E,6BAA4B;AAC5B,uBAAsB;AACtB,kCAAuC;AACvC,4BAA+B;AAC/B,4BAA+B;AAGxB,MAAM,oBAAsE,CAAC,UAAU;AAC5F,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,uBAAmB,4CAAuB,KAAK;AAErD,SACE,4CAAC;AAAA,IACC,gBAAe;AAAA,IACf,YAAW;AAAA,IACX,OAAO,MAAM,SAAS;AAAA,IACtB,eAAa,mDAAuB;AAAA,IACpC,MAAM,CAAC,mBAAmB;AAAA,IACzB,GAAG;AAAA,IAEJ,uDAAC;AAAA,MACE;AAAA,+BACC;AAAA,UACE;AAAA,wDAAC,uBAAAA,SAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,4CAAC;AAAA,cAAoB,IAAI;AAAA,aAAI;AAAA;AAAA,SAC/B;AAAA,QAEF,6CAAC;AAAA,UAAK,IAAG;AAAA,UAAO,YAAW;AAAA,UAAS,OAAO,EAAE,cAAc,SAAS;AAAA,UAClE;AAAA,wDAAC;AAAA,cAAe;AAAA,cAAkC;AAAA,aAAgC;AAAA,YAClF,4CAAC,iBAAAC,SAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,4CAAC;AAAA,cAAe;AAAA,cAA0B;AAAA,aAAwB;AAAA;AAAA,SACpE;AAAA;AAAA,KACF;AAAA,GACF;AAEJ;",
6
6
  "names": ["PerPageSelector", "Paginator"]
7
7
  }
package/dist/cjs/parts/Paginator.js.map CHANGED
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/Paginator.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { Checkmark, ChevronDown } from '@elliemae/ds-icons';\nimport { useOnElementResize } from '@elliemae/ds-utilities';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport {\n InvisibleDetail,\n PaginationBoldText,\n PaginationDetail,\n PaginationDropdownButton,\n PaginationSeparator,\n} from '../styled';\nimport { usePaginationSearch } from '../hooks/usePaginationSearch';\n\ninterface PaginatorPropsT {\n pageIndex: number;\n pageCount: number;\n onPageChange: (page: number) => void;\n pageDetails: string[];\n pageDetailsTitle: string;\n}\n\nconst Paginator: React.ComponentType<PaginatorPropsT> = (props) => {\n const { pageIndex, pageCount, onPageChange, pageDetails, pageDetailsTitle } = props;\n\n const [isOpened, setIsOpened] = useState(false);\n\n const btnRef = useRef<HTMLButtonElement>(null);\n const pageInfoRef = useRef<HTMLDivElement>(null);\n\n const { width: btnWidth } = useOnElementResize(btnRef);\n const { width: txtWidth } = useOnElementResize(pageInfoRef);\n\n const options = useMemo(\n () =>\n new Array(pageCount).fill(0).map((_, index) => {\n const option: Record<string, unknown> = {\n dsId: (index + 1).toString(),\n label: (index + 1).toString(),\n value: index + 1,\n type: 'single',\n };\n if (pageDetails?.length) {\n option.render = () => (\n <Grid cols={['16px', `${txtWidth + 16}px`, 'auto']} gutter=\"xxs\" alignItems=\"center\">\n {pageIndex === index ? <Checkmark size=\"s\" color={['brand-primary', '600']} /> : <div />}\n <span>{index + 1}</span>\n <span\n style={{\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n }}\n >\n {pageDetails[index]}\n </span>\n </Grid>\n );\n }\n return option;\n }),\n [pageCount, pageDetails, pageIndex, txtWidth],\n );\n\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant((pageIndex + 1).toString());\n actionRef.current.scrollOptionIntoView((pageIndex + 1).toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\n\n const [detailWidth, setDetailWidth] = useState(0);\n\n useLayoutEffect(() => {\n const invisibleDetails = [\n ...document.body.querySelectorAll('[data-testid=\"ds-pagination-invisible-detail-for-width-calc\"]'),\n ] as HTMLDivElement[];\n const maxWidth = invisibleDetails.reduce((acc, cur) => Math.max(acc, cur.getBoundingClientRect().width), 0);\n setDetailWidth(maxWidth);\n }, [pageDetails]);\n\n const onKeyDown = usePaginationSearch(pageCount, actionRef);\n\n return (\n <>\n <PaginationSeparator />\n <DSDropdownMenuV2\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [(pageIndex + 1).toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageChange(clickedOption.value);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[-23, 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n onKeyDown={onKeyDown}\n minWidth={pageDetails.length !== 0 ? btnWidth + 23 : pageCount.toString().length * 6 + 90}\n maxHeight={300}\n HeaderComp={() =>\n pageDetailsTitle !== '' ? (\n <Grid cols={[`${txtWidth + 50}px`, '8px', 'auto']}>\n <span style={{ marginLeft: '8px' }}>Page</span>\n <PaginationSeparator height=\"100%\" />\n <span>{pageDetailsTitle}</span>\n </Grid>\n ) : (\n 'Page'\n )\n }\n >\n <PaginationDropdownButton\n buttonType=\"raw\"\n onClick={() => setIsOpened((prev) => !prev)}\n innerRef={btnRef}\n aria-label={`Page ${pageIndex + 1} out of ${pageCount}, ${\n pageDetails.length !== 0 ? pageDetails[pageIndex] : '\\b\\b'\n }. Press to change the current page`}\n >\n <Grid\n gutter=\"xxs\"\n alignItems=\"center\"\n cols={\n pageDetails.length !== 0\n ? ['auto', 'min-content', 'minmax(0px, 70%)', 'min-content']\n : ['auto', 'min-content']\n }\n >\n <Grid alignItems=\"center\" gutter=\"xxxs\" ref={pageInfoRef} style={{ gridAutoFlow: 'column' }}>\n <PaginationBoldText fontSize=\"18px\">{pageIndex + 1}</PaginationBoldText> / {pageCount}\n </Grid>\n {pageDetails.length !== 0 && (\n <>\n <PaginationSeparator height=\"12px\" ml=\"8px\" />\n <PaginationBoldText fontSize=\"13px\" w={detailWidth} mr=\"xxs\" display=\"grid\">\n <SimpleTruncatedTooltipText value={pageDetails[pageIndex]}>\n {pageDetails[pageIndex]}\n </SimpleTruncatedTooltipText>\n {pageDetails.map((pageDetail) => (\n <InvisibleDetail data-testid=\"ds-pagination-invisible-detail-for-width-calc\">\n {pageDetail}\n </InvisibleDetail>\n ))}\n </PaginationBoldText>\n </>\n )}\n <ChevronDown color={['brand-primary', '700']} />\n </Grid>\n </PaginationDropdownButton>\n </DSDropdownMenuV2>\n <PaginationSeparator />\n </>\n );\n};\n\nexport default Paginator;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/PerPageSelector.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/PerPageSelector.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport memoize from 'memoize-one';\nimport { range } from '@elliemae/ds-utilities';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { DSPaginationProps } from '../index.d';\nimport { PaginationDropdownButton } from '../styled';\n\nconst generateOption = (value: number | Record<string, unknown>) => {\n if (typeof value === 'object') {\n return value;\n }\n return {\n dsId: value.toString(),\n value,\n label: value.toString(),\n type: 'single',\n };\n};\n\nconst getOptions = memoize((step: number, min: number, max: number) => {\n const options = range(min, max + step, step).map(generateOption);\n return min === 0 ? options.slice(1, options.length) : options;\n});\n\nconst PerPageSelector: React.ComponentType<\n Required<\n Pick<\n DSPaginationProps,\n 'pageSize' | 'onPageSizeChange' | 'perPageOptions' | 'perPageStep' | 'minPerPage' | 'maxPerPage'\n >\n >\n> = (props) => {\n const [isOpened, setIsOpened] = useState(false);\n const { pageSize, onPageSizeChange, perPageOptions, maxPerPage, perPageStep, minPerPage } = props;\n\n const options = useMemo(() => {\n if (perPageOptions) return perPageOptions.map(generateOption);\n return getOptions(perPageStep, minPerPage, maxPerPage);\n }, [maxPerPage, minPerPage, perPageOptions, perPageStep]);\n\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n const btnRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant(pageSize.toString());\n actionRef.current.scrollOptionIntoView(pageSize.toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\n\n const width = useMemo(() => {\n const maxLength = options.reduce((acc, cur) => Math.max(acc, (cur?.label as string)?.length ?? 0), 0);\n return maxLength * 6 + 90;\n }, [options]);\n\n return (\n <DSDropdownMenuV2\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageSize.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageSizeChange(clickedOption.value);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[10, 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n minWidth={width}\n maxHeight={300}\n HeaderComp={() => 'Per Page'}\n >\n <div style={{ marginLeft: '32px' }}>\n <PaginationDropdownButton\n buttonType=\"raw\"\n onClick={() => setIsOpened((prev) => !prev)}\n aria-pressed={isOpened}\n innerRef={btnRef}\n aria-label={`${pageSize} rows per page. Press to select rows per page`}\n >\n {pageSize} / page\n <ChevronDown color={['brand-primary', '700']} />\n </PaginationDropdownButton>\n </div>\n </DSDropdownMenuV2>\n );\n};\n\nexport default PerPageSelector;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAA4D;AAC5D,yBAAoB;AACpB,0BAAsB;AACtB,6BAAiC;AACjC,sBAA4B;AAE5B,oBAAyC;AAEzC,MAAM,iBAAiB,CAAC,UAA4C;AAClE,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,EACT;AACA,SAAO;AAAA,IACL,MAAM,MAAM,SAAS;AAAA,IACrB;AAAA,IACA,OAAO,MAAM,SAAS;AAAA,IACtB,MAAM;AAAA,EACR;AACF;AAEA,MAAM,iBAAa,mBAAAA,SAAQ,CAAC,MAAc,KAAa,QAAgB;AACrE,QAAM,cAAU,2BAAM,KAAK,MAAM,MAAM,IAAI,EAAE,IAAI,cAAc;AAC/D,SAAO,QAAQ,IAAI,QAAQ,MAAM,GAAG,QAAQ,MAAM,IAAI;AACxD,CAAC;AAED,MAAM,kBAOF,CAAC,UAAU;AACb,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,EAAE,UAAU,kBAAkB,gBAAgB,YAAY,aAAa,WAAW,IAAI;AAE5F,QAAM,cAAU,sBAAQ,MAAM;AAC5B,QAAI;AAAgB,aAAO,eAAe,IAAI,cAAc;AAC5D,WAAO,WAAW,aAAa,YAAY,UAAU;AAAA,EACvD,GAAG,CAAC,YAAY,YAAY,gBAAgB,WAAW,CAAC;AAExD,QAAM,gBAAY,qBAA+C,CAAC,CAAC;AACnE,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,QAAI,UAAU;AACZ,gBAAU,QAAQ,oBAAoB,SAAS,SAAS,CAAC;AACzD,gBAAU,QAAQ,qBAAqB,SAAS,SAAS,CAAC;AAAA,IAC5D;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,UAAM,YAAY,QAAQ,OAAO,CAAC,KAAK,QAAQ,KAAK,IAAI,KAAM,KAAK,OAAkB,UAAU,CAAC,GAAG,CAAC;AACpG,WAAO,YAAY,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,CAAC;AAEZ,SACE,4CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA,iBAAiB,EAAE,CAAC,SAAS,SAAS,IAAI,KAAK;AAAA,IAC/C,eAAe,CAAC,GAAG,kBAAkB;AACnC,uBAAiB,cAAc,KAAK;AACpC,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,gBAAgB,MAAM;AACpB,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,cAAc,CAAC,IAAI,CAAC;AAAA,IACpB,0BAAyB;AAAA,IACzB;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY,MAAM;AAAA,IAElB,sDAAC;AAAA,MAAI,OAAO,EAAE,YAAY,OAAO;AAAA,MAC/B,uDAAC;AAAA,QACC,YAAW;AAAA,QACX,SAAS,MAAM,YAAY,CAAC,SAAS,CAAC,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,UAAU;AAAA,QACV,cAAY,GAAG;AAAA,QAEd;AAAA;AAAA,UAAS;AAAA,UACV,4CAAC;AAAA,YAAY,OAAO,CAAC,iBAAiB,KAAK;AAAA,WAAG;AAAA;AAAA,OAChD;AAAA,KACF;AAAA,GACF;AAEJ;AAEA,IAAO,0BAAQ;",
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport memoize from 'memoize-one';\nimport { range } from '@elliemae/ds-utilities';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport type { DSPaginationProps } from '../index.d';\nimport { PaginationDropdownButton } from '../styled';\n\nconst generateOption = (value: number | Record<string, unknown>) => {\n if (typeof value === 'object') {\n return value;\n }\n return {\n dsId: value.toString(),\n value,\n label: value.toString(),\n type: 'single',\n };\n};\n\nconst getOptions = memoize((step: number, min: number, max: number) => {\n const options = range(min, max + step, step).map(generateOption);\n return min === 0 ? options.slice(1, options.length) : options;\n});\n\nconst PerPageSelector: React.ComponentType<\n Required<\n Pick<\n DSPaginationProps,\n 'pageSize' | 'onPageSizeChange' | 'perPageOptions' | 'perPageStep' | 'minPerPage' | 'maxPerPage'\n >\n >\n> = (props) => {\n const [isOpened, setIsOpened] = useState(false);\n const { pageSize, onPageSizeChange, perPageOptions, maxPerPage, perPageStep, minPerPage } = props;\n\n const options = useMemo(() => {\n if (perPageOptions) return perPageOptions.map(generateOption);\n return getOptions(perPageStep, minPerPage, maxPerPage);\n }, [maxPerPage, minPerPage, perPageOptions, perPageStep]);\n\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n const btnRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant(pageSize.toString());\n actionRef.current.scrollOptionIntoView(pageSize.toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\n\n const width = useMemo(() => {\n const maxLength = options.reduce((acc, cur) => Math.max(acc, (cur?.label as string)?.length ?? 0), 0);\n return maxLength * 6 + 90;\n }, [options]);\n\n return (\n <DSDropdownMenuV2\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageSize.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageSizeChange(clickedOption.value);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[10, 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n minWidth={width}\n maxHeight={300}\n HeaderComp={() => 'Per Page'}\n >\n <div style={{ marginLeft: '32px' }}>\n <PaginationDropdownButton\n buttonType=\"raw\"\n onClick={() => setIsOpened((prev) => !prev)}\n aria-pressed={isOpened}\n innerRef={btnRef}\n aria-label={`${pageSize} rows per page. Press to select rows per page`}\n >\n {pageSize} / page\n <ChevronDown color={['brand-primary', '700']} />\n </PaginationDropdownButton>\n </div>\n </DSDropdownMenuV2>\n );\n};\n\nexport default PerPageSelector;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgFf;AA/ER,mBAA4D;AAC5D,yBAAoB;AACpB,0BAAsB;AACtB,6BAAiC;AACjC,sBAA4B;AAE5B,oBAAyC;AAEzC,MAAM,iBAAiB,CAAC,UAA4C;AAClE,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,EACT;AACA,SAAO;AAAA,IACL,MAAM,MAAM,SAAS;AAAA,IACrB;AAAA,IACA,OAAO,MAAM,SAAS;AAAA,IACtB,MAAM;AAAA,EACR;AACF;AAEA,MAAM,iBAAa,mBAAAA,SAAQ,CAAC,MAAc,KAAa,QAAgB;AACrE,QAAM,cAAU,2BAAM,KAAK,MAAM,MAAM,IAAI,EAAE,IAAI,cAAc;AAC/D,SAAO,QAAQ,IAAI,QAAQ,MAAM,GAAG,QAAQ,MAAM,IAAI;AACxD,CAAC;AAED,MAAM,kBAOF,CAAC,UAAU;AACb,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,EAAE,UAAU,kBAAkB,gBAAgB,YAAY,aAAa,WAAW,IAAI;AAE5F,QAAM,cAAU,sBAAQ,MAAM;AAC5B,QAAI;AAAgB,aAAO,eAAe,IAAI,cAAc;AAC5D,WAAO,WAAW,aAAa,YAAY,UAAU;AAAA,EACvD,GAAG,CAAC,YAAY,YAAY,gBAAgB,WAAW,CAAC;AAExD,QAAM,gBAAY,qBAA+C,CAAC,CAAC;AACnE,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,QAAI,UAAU;AACZ,gBAAU,QAAQ,oBAAoB,SAAS,SAAS,CAAC;AACzD,gBAAU,QAAQ,qBAAqB,SAAS,SAAS,CAAC;AAAA,IAC5D;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,UAAM,YAAY,QAAQ,OAAO,CAAC,KAAK,QAAQ,KAAK,IAAI,KAAM,KAAK,OAAkB,UAAU,CAAC,GAAG,CAAC;AACpG,WAAO,YAAY,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,CAAC;AAEZ,SACE,4CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA,iBAAiB,EAAE,CAAC,SAAS,SAAS,IAAI,KAAK;AAAA,IAC/C,eAAe,CAAC,GAAG,kBAAkB;AACnC,uBAAiB,cAAc,KAAK;AACpC,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,gBAAgB,MAAM;AACpB,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,cAAc,CAAC,IAAI,CAAC;AAAA,IACpB,0BAAyB;AAAA,IACzB;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY,MAAM;AAAA,IAElB,sDAAC;AAAA,MAAI,OAAO,EAAE,YAAY,OAAO;AAAA,MAC/B,uDAAC;AAAA,QACC,YAAW;AAAA,QACX,SAAS,MAAM,YAAY,CAAC,SAAS,CAAC,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,UAAU;AAAA,QACV,cAAY,GAAG;AAAA,QAEd;AAAA;AAAA,UAAS;AAAA,UACV,4CAAC;AAAA,YAAY,OAAO,CAAC,iBAAiB,KAAK;AAAA,WAAG;AAAA;AAAA,OAChD;AAAA,KACF;AAAA,GACF;AAEJ;AAEA,IAAO,0BAAQ;",
6
6
  "names": ["memoize"]
7
7
  }
package/dist/cjs/props.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/props.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { PropTypes } from '@elliemae/ds-utilities';\nimport { WeakValidationMap } from 'react';\n\nconst emptyFunc = () => null;\n\nexport const propTypes = {\n pageCount: PropTypes.number.description('How many pages are there'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func.description('Function invoked when the page size changes').defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n width: PropTypes.any.description('Width for the container of the pagination').defaultValue('100%'),\n} as WeakValidationMap<unknown>;\n\nexport const defaultProps = {\n pageIndex: 1,\n canPreviousPage: true,\n canNextPage: true,\n pageSize: 10,\n showPerPageSelector: true,\n perPageOptions: [10],\n perPageStep: 5,\n minPerPage: 0,\n maxPerPage: 100,\n onPageSizeChange: emptyFunc,\n onPreviousPage: emptyFunc,\n onNextPage: emptyFunc,\n onPageChange: emptyFunc,\n pageDetails: [],\n pageDetailsTitle: '',\n width: '100%',\n};\n", "import * as React from 'react';\nexport { React };\n"],
4
+ "sourcesContent": ["import { PropTypes } from '@elliemae/ds-utilities';\nimport type { WeakValidationMap } from 'react';\n\nconst emptyFunc = () => null;\n\nexport const propTypes = {\n pageCount: PropTypes.number.description('How many pages are there'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func.description('Function invoked when the page size changes').defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n width: PropTypes.any.description('Width for the container of the pagination').defaultValue('100%'),\n} as WeakValidationMap<unknown>;\n\nexport const defaultProps = {\n pageIndex: 1,\n canPreviousPage: true,\n canNextPage: true,\n pageSize: 10,\n showPerPageSelector: true,\n perPageOptions: [10],\n perPageStep: 5,\n minPerPage: 0,\n maxPerPage: 100,\n onPageSizeChange: emptyFunc,\n onPreviousPage: emptyFunc,\n onNextPage: emptyFunc,\n onPageChange: emptyFunc,\n pageDetails: [],\n pageDetailsTitle: '',\n width: '100%',\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA0B;AAG1B,MAAM,YAAY,MAAM;AAEjB,MAAM,YAAY;AAAA,EACvB,WAAW,8BAAU,OAAO,YAAY,0BAA0B;AAAA,EAClE,WAAW,8BAAU,OAAO,YAAY,4CAA4C,EAAE,aAAa,CAAC;AAAA,EACpG,iBAAiB,8BAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,IAAI;AAAA,EAC/G,aAAa,8BAAU,KAAK,YAAY,4CAA4C,EAAE,aAAa,IAAI;AAAA,EACvG,UAAU,8BAAU,OAAO,YAAY,uBAAuB,EAAE,aAAa,EAAE;AAAA,EAC/E,qBAAqB,8BAAU,KAAK,YAAY,mCAAmC,EAAE,aAAa,IAAI;AAAA,EACtG,gBAAgB,8BAAU;AAAA,IACxB,8BAAU,UAAU;AAAA,MAClB,8BAAU;AAAA,MACV,8BAAU,MAAM;AAAA,QACd,MAAM,8BAAU;AAAA,QAChB,OAAO,8BAAU;AAAA,QACjB,OAAO,8BAAU;AAAA,QACjB,MAAM,8BAAU,MAAM,CAAC,QAAQ,CAAC;AAAA,MAClC,CAAC;AAAA,IACH,CAAC;AAAA,EACH,EACG,YAAY,qCAAqC,EACjD,aAAa,CAAC,EAAE,CAAC;AAAA,EACpB,aAAa,8BAAU,OAAO,YAAY,+BAA+B,EAAE,aAAa,CAAC;AAAA,EACzF,YAAY,8BAAU,OAAO,YAAY,+BAA+B,EAAE,aAAa,CAAC;AAAA,EACxF,YAAY,8BAAU,OAAO,YAAY,+BAA+B,EAAE,aAAa,GAAG;AAAA,EAC1F,kBAAkB,8BAAU,KAAK,YAAY,6CAA6C,EAAE,aAAa,MAAM,IAAI;AAAA,EACnH,gBAAgB,8BAAU,KACvB,YAAY,sDAAsD,EAClE,aAAa,MAAM,IAAI;AAAA,EAC1B,cAAc,8BAAU,KAAK,YAAY,wCAAwC,EAAE,aAAa,MAAM,IAAI;AAAA,EAC1G,YAAY,8BAAU,KAAK,YAAY,8CAA8C,EAAE,aAAa,MAAM,IAAI;AAAA,EAC9G,aAAa,8BAAU,QAAQ,8BAAU,MAAM,EAAE,YAAY,kCAAkC,EAAE,aAAa,CAAC,CAAC;AAAA,EAChH,kBAAkB,8BAAU,OACzB,YAAY,6DAA6D,EACzE,aAAa,EAAE;AAAA,EAClB,OAAO,8BAAU,IAAI,YAAY,2CAA2C,EAAE,aAAa,MAAM;AACnG;AAEO,MAAM,eAAe;AAAA,EAC1B,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,UAAU;AAAA,EACV,qBAAqB;AAAA,EACrB,gBAAgB,CAAC,EAAE;AAAA,EACnB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,aAAa,CAAC;AAAA,EACd,kBAAkB;AAAA,EAClB,OAAO;AACT;",
6
6
  "names": []
7
7
  }
package/dist/cjs/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport {\n styled,\n space,\n typography,\n TypographyProps,\n SpaceProps,\n sizing,\n SizingProps,\n layout,\n LayoutProps,\n css,\n} from '@elliemae/ds-system';\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 PaginationContainer = styled(Grid)`\n height: 42px;\n max-width: 100%;\n align-items: center;\n box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);\n position: relative;\n`;\n\nexport const PaginationWrapper = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const PaginationSeparator = styled(Grid)`\n background-color: ${(props) => props.theme.colors.neutral[300]};\n width: 1px;\n height: ${(props) => props.height || '30px'};\n`;\n\nexport const PaginationBoldText = styled.span<TypographyProps & SpaceProps & SizingProps & LayoutProps>`\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n ${typography}\n ${space}\n ${sizing}\n ${layout}\n position: relative;\n`;\n\nexport const InvisibleDetail = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nexport const PaginationDetail = styled.span`\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const PaginationDropdownButton = styled(DSButtonV2)`\n 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: ${(props) => props.theme.colors.neutral[700]};\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n white-space: nowrap;\n`;\n\nexport const PreviousNextPageButton = styled(DSButtonV2)`\n height: 42px;\n display: grid;\n place-items: center;\n position: relative;\n padding-left: 8px;\n padding-right: 8px;\n border-radius: 0;\n cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n :focus {\n ${styledFocusCss}\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qBAAqB;AACrB,uBAA2B;AAC3B,uBAWO;AAEP,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMnD,MAAM,0BAAsB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvC,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,0BAAsB,yBAAO,mBAAI;AAAA,sBACxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,YAEhD,CAAC,UAAU,MAAM,UAAU;AAAA;AAGhC,MAAM,qBAAqB,wBAAO;AAAA,iBACxB,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,IAChD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAIG,MAAM,kBAAkB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ/B,MAAM,mBAAmB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,+BAA2B,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAW9C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,iBAGhC,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,MAE9C;AAAA;AAAA;AAAA;AAKC,MAAM,6BAAyB,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQ3C,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;AAAA;AAAA;",
4
+ "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport type { TypographyProps, SpaceProps, SizingProps, LayoutProps } from '@elliemae/ds-system';\nimport { styled, space, typography, sizing, layout, css } from '@elliemae/ds-system';\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 PaginationContainer = styled(Grid)`\n height: 42px;\n max-width: 100%;\n align-items: center;\n box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);\n position: relative;\n`;\n\nexport const PaginationWrapper = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const PaginationSeparator = styled(Grid)`\n background-color: ${(props) => props.theme.colors.neutral[300]};\n width: 1px;\n height: ${(props) => props.height || '30px'};\n`;\n\nexport const PaginationBoldText = styled.span<TypographyProps & SpaceProps & SizingProps & LayoutProps>`\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n ${typography}\n ${space}\n ${sizing}\n ${layout}\n position: relative;\n`;\n\nexport const InvisibleDetail = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nexport const PaginationDetail = styled.span`\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const PaginationDropdownButton = styled(DSButtonV2)`\n 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: ${(props) => props.theme.colors.neutral[700]};\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n white-space: nowrap;\n`;\n\nexport const PreviousNextPageButton = styled(DSButtonV2)`\n height: 42px;\n display: grid;\n place-items: center;\n position: relative;\n padding-left: 8px;\n padding-right: 8px;\n border-radius: 0;\n cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n :focus {\n ${styledFocusCss}\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qBAAqB;AACrB,uBAA2B;AAE3B,uBAA+D;AAE/D,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMnD,MAAM,0BAAsB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvC,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,0BAAsB,yBAAO,mBAAI;AAAA,sBACxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,YAEhD,CAAC,UAAU,MAAM,UAAU;AAAA;AAGhC,MAAM,qBAAqB,wBAAO;AAAA,iBACxB,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,IAChD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAIG,MAAM,kBAAkB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ/B,MAAM,mBAAmB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,+BAA2B,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAW9C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,iBAGhC,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,MAE9C;AAAA;AAAA;AAAA;AAKC,MAAM,6BAAyB,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQ3C,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;AAAA;AAAA;",
6
6
  "names": []
7
7
  }
package/dist/esm/Pagination.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/Pagination.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { PaginationContent } from './parts/PaginationContent';\nimport { propTypes, defaultProps } from './props';\nimport { DSPaginationProps } from './index.d';\n\nconst DSPagination: React.ComponentType<DSPaginationProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefault, propTypes);\n\n return <PaginationContent {...propsWithDefault} />;\n};\n\nDSPagination.propTypes = propTypes;\nDSPagination.displayName = 'DSPagination';\nconst DSPaginationWithSchema = describe(DSPagination).description('DSPagination');\nDSPaginationWithSchema.propTypes = propTypes;\n\nexport { DSPagination, DSPaginationWithSchema };\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAS,yBAAyB;AAClC,SAAS,WAAW,oBAAoB;AAGxC,MAAM,eAAuD,CAAC,UAAU;AACtE,QAAM,mBAAmB,6BAA6B,OAAO,YAAY;AACzE,iCAA+B,kBAAkB,SAAS;AAE1D,SAAO,oBAAC;AAAA,IAAmB,GAAG;AAAA,GAAkB;AAClD;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY,EAAE,YAAY,cAAc;AAChF,uBAAuB,YAAY;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { PaginationContent } from './parts/PaginationContent';\nimport { propTypes, defaultProps } from './props';\nimport type { DSPaginationProps } from './index.d';\n\nconst DSPagination: React.ComponentType<DSPaginationProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefault, propTypes);\n\n return <PaginationContent {...propsWithDefault} />;\n};\n\nDSPagination.propTypes = propTypes;\nDSPagination.displayName = 'DSPagination';\nconst DSPaginationWithSchema = describe(DSPagination).description('DSPagination');\nDSPaginationWithSchema.propTypes = propTypes;\n\nexport { DSPagination, DSPaginationWithSchema };\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACUd;AATT,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAS,yBAAyB;AAClC,SAAS,WAAW,oBAAoB;AAGxC,MAAM,eAAuD,CAAC,UAAU;AACtE,QAAM,mBAAmB,6BAA6B,OAAO,YAAY;AACzE,iCAA+B,kBAAkB,SAAS;AAE1D,SAAO,oBAAC;AAAA,IAAmB,GAAG;AAAA,GAAkB;AAClD;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY,EAAE,YAAY,cAAc;AAChF,uBAAuB,YAAY;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/PageNextButton.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/PageNextButton.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronRight } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport { DSPaginationProps } from '../index.d';\n\nexport const PageNextButton: React.ComponentType<Required<Pick<DSPaginationProps, 'onNextPage' | 'canNextPage'>>> = ({\n onNextPage,\n canNextPage,\n}) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canNextPage) onNextPage();\n }}\n disabled={!canNextPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.NEXT_BUTTON}\n HeaderComp={() => 'Page'}\n aria-label=\"Go to next page\"\n >\n <ChevronRight color={canNextPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AAEA,SAAS,oBAAoB;AAC7B,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AAGhC,MAAM,iBAAuG,CAAC;AAAA,EACnH;AAAA,EACA;AACF,MACE,oBAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAa,iBAAW;AAAA,EAC9B;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,uBAAuB;AAAA,EACpC,YAAY,MAAM;AAAA,EAClB,cAAW;AAAA,EAEX,8BAAC;AAAA,IAAa,OAAO,cAAc,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACpF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronRight } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport type { DSPaginationProps } from '../index.d';\n\nexport const PageNextButton: React.ComponentType<Required<Pick<DSPaginationProps, 'onNextPage' | 'canNextPage'>>> = ({\n onNextPage,\n canNextPage,\n}) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canNextPage) onNextPage();\n }}\n disabled={!canNextPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.NEXT_BUTTON}\n HeaderComp={() => 'Page'}\n aria-label=\"Go to next page\"\n >\n <ChevronRight color={canNextPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACqBnB;AAnBJ,SAAS,oBAAoB;AAC7B,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AAGhC,MAAM,iBAAuG,CAAC;AAAA,EACnH;AAAA,EACA;AACF,MACE,oBAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAa,iBAAW;AAAA,EAC9B;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,uBAAuB;AAAA,EACpC,YAAY,MAAM;AAAA,EAClB,cAAW;AAAA,EAEX,8BAAC;AAAA,IAAa,OAAO,cAAc,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACpF;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/PagePrevButton.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/PagePrevButton.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport { DSPaginationProps } from '../index.d';\n\nexport const PagePrevButton: React.ComponentType<\n Required<Pick<DSPaginationProps, 'onPreviousPage' | 'canPreviousPage'>>\n> = ({ onPreviousPage, canPreviousPage }) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canPreviousPage) onPreviousPage();\n }}\n disabled={!canPreviousPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.PREVIOUS_BUTTON}\n aria-label=\"Go to previous page\"\n >\n <ChevronLeft color={canPreviousPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AAEA,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AAGhC,MAAM,iBAET,CAAC,EAAE,gBAAgB,gBAAgB,MACrC,oBAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAiB,qBAAe;AAAA,EACtC;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,uBAAuB;AAAA,EACpC,cAAW;AAAA,EAEX,8BAAC;AAAA,IAAY,OAAO,kBAAkB,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACvF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PreviousNextPageButton } from '../styled';\nimport type { DSPaginationProps } from '../index.d';\n\nexport const PagePrevButton: React.ComponentType<\n Required<Pick<DSPaginationProps, 'onPreviousPage' | 'canPreviousPage'>>\n> = ({ onPreviousPage, canPreviousPage }) => (\n <PreviousNextPageButton\n onClick={() => {\n if (canPreviousPage) onPreviousPage();\n }}\n disabled={!canPreviousPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.PREVIOUS_BUTTON}\n aria-label=\"Go to previous page\"\n >\n <ChevronLeft color={canPreviousPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n);\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACmBnB;AAjBJ,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AAGhC,MAAM,iBAET,CAAC,EAAE,gBAAgB,gBAAgB,MACrC,oBAAC;AAAA,EACC,SAAS,MAAM;AACb,QAAI;AAAiB,qBAAe;AAAA,EACtC;AAAA,EACA,UAAU,CAAC;AAAA,EACX,YAAW;AAAA,EACX,eAAa,uBAAuB;AAAA,EACpC,cAAW;AAAA,EAEX,8BAAC;AAAA,IAAY,OAAO,kBAAkB,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK;AAAA,GAAG;AAAA,CACvF;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/PaginationContent.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/PaginationContent.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useGetGlobalAttributes } from '@elliemae/ds-utilities';\nimport { PaginationContainer, PaginationSeparator, PaginationWrapper } from '../styled';\nimport PerPageSelector from './PerPageSelector';\nimport Paginator from './Paginator';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PagePrevButton } from './PagePrevButton';\nimport { PageNextButton } from './PageNextButton';\nimport { DSPaginationProps } from '../index.d';\n\nexport const PaginationContent: React.ComponentType<Required<DSPaginationProps>> = (props) => {\n const {\n pageIndex,\n pageSize,\n canPreviousPage,\n canNextPage,\n onPageSizeChange,\n onNextPage,\n onPreviousPage,\n onPageChange,\n pageCount,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n perPageOptions,\n maxPerPage,\n perPageStep,\n minPerPage,\n width,\n } = props;\n\n const globalAttributes = useGetGlobalAttributes(props);\n\n return (\n <PaginationContainer\n justifyContent=\"center\"\n alignItems=\"center\"\n width={width.toString()}\n data-testid={PAGINATION_DATA_TESTID.CONTAINER}\n cols={['minmax(auto, 80%)']}\n {...globalAttributes}\n >\n <PaginationWrapper>\n {showPerPageSelector && (\n <>\n <PerPageSelector\n pageSize={pageSize}\n onPageSizeChange={onPageSizeChange}\n perPageOptions={perPageOptions}\n maxPerPage={maxPerPage}\n perPageStep={perPageStep}\n minPerPage={minPerPage}\n />\n <PaginationSeparator mr={24} />\n </>\n )}\n <Grid mr=\"32px\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <PagePrevButton canPreviousPage={canPreviousPage} onPreviousPage={onPreviousPage} />\n <Paginator\n pageCount={pageCount}\n pageIndex={pageIndex}\n onPageChange={onPageChange}\n pageDetails={pageDetails}\n pageDetailsTitle={pageDetailsTitle}\n />\n <PageNextButton canNextPage={canNextPage} onNextPage={onNextPage} />\n </Grid>\n </PaginationWrapper>\n </PaginationContainer>\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AAEA,SAAS,YAAY;AACrB,SAAS,8BAA8B;AACvC,SAAS,qBAAqB,qBAAqB,yBAAyB;AAC5E,OAAO,qBAAqB;AAC5B,OAAO,eAAe;AACtB,SAAS,8BAA8B;AACvC,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAGxB,MAAM,oBAAsE,CAAC,UAAU;AAC5F,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,mBAAmB,uBAAuB,KAAK;AAErD,SACE,oBAAC;AAAA,IACC,gBAAe;AAAA,IACf,YAAW;AAAA,IACX,OAAO,MAAM,SAAS;AAAA,IACtB,eAAa,uBAAuB;AAAA,IACpC,MAAM,CAAC,mBAAmB;AAAA,IACzB,GAAG;AAAA,IAEJ,+BAAC;AAAA,MACE;AAAA,+BACC;AAAA,UACE;AAAA,gCAAC;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,oBAAC;AAAA,cAAoB,IAAI;AAAA,aAAI;AAAA;AAAA,SAC/B;AAAA,QAEF,qBAAC;AAAA,UAAK,IAAG;AAAA,UAAO,YAAW;AAAA,UAAS,OAAO,EAAE,cAAc,SAAS;AAAA,UAClE;AAAA,gCAAC;AAAA,cAAe;AAAA,cAAkC;AAAA,aAAgC;AAAA,YAClF,oBAAC;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,oBAAC;AAAA,cAAe;AAAA,cAA0B;AAAA,aAAwB;AAAA;AAAA,SACpE;AAAA;AAAA,KACF;AAAA,GACF;AAEJ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useGetGlobalAttributes } from '@elliemae/ds-utilities';\nimport { PaginationContainer, PaginationSeparator, PaginationWrapper } from '../styled';\nimport PerPageSelector from './PerPageSelector';\nimport Paginator from './Paginator';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID';\nimport { PagePrevButton } from './PagePrevButton';\nimport { PageNextButton } from './PageNextButton';\nimport type { DSPaginationProps } from '../index.d';\n\nexport const PaginationContent: React.ComponentType<Required<DSPaginationProps>> = (props) => {\n const {\n pageIndex,\n pageSize,\n canPreviousPage,\n canNextPage,\n onPageSizeChange,\n onNextPage,\n onPreviousPage,\n onPageChange,\n pageCount,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n perPageOptions,\n maxPerPage,\n perPageStep,\n minPerPage,\n width,\n } = props;\n\n const globalAttributes = useGetGlobalAttributes(props);\n\n return (\n <PaginationContainer\n justifyContent=\"center\"\n alignItems=\"center\"\n width={width.toString()}\n data-testid={PAGINATION_DATA_TESTID.CONTAINER}\n cols={['minmax(auto, 80%)']}\n {...globalAttributes}\n >\n <PaginationWrapper>\n {showPerPageSelector && (\n <>\n <PerPageSelector\n pageSize={pageSize}\n onPageSizeChange={onPageSizeChange}\n perPageOptions={perPageOptions}\n maxPerPage={maxPerPage}\n perPageStep={perPageStep}\n minPerPage={minPerPage}\n />\n <PaginationSeparator mr={24} />\n </>\n )}\n <Grid mr=\"32px\" alignItems=\"center\" style={{ gridAutoFlow: 'column' }}>\n <PagePrevButton canPreviousPage={canPreviousPage} onPreviousPage={onPreviousPage} />\n <Paginator\n pageCount={pageCount}\n pageIndex={pageIndex}\n onPageChange={onPageChange}\n pageDetails={pageDetails}\n pageDetailsTitle={pageDetailsTitle}\n />\n <PageNextButton canNextPage={canNextPage} onNextPage={onNextPage} />\n </Grid>\n </PaginationWrapper>\n </PaginationContainer>\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;AC8Cb,mBACE,KADF;AA5CV,SAAS,YAAY;AACrB,SAAS,8BAA8B;AACvC,SAAS,qBAAqB,qBAAqB,yBAAyB;AAC5E,OAAO,qBAAqB;AAC5B,OAAO,eAAe;AACtB,SAAS,8BAA8B;AACvC,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAGxB,MAAM,oBAAsE,CAAC,UAAU;AAC5F,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,mBAAmB,uBAAuB,KAAK;AAErD,SACE,oBAAC;AAAA,IACC,gBAAe;AAAA,IACf,YAAW;AAAA,IACX,OAAO,MAAM,SAAS;AAAA,IACtB,eAAa,uBAAuB;AAAA,IACpC,MAAM,CAAC,mBAAmB;AAAA,IACzB,GAAG;AAAA,IAEJ,+BAAC;AAAA,MACE;AAAA,+BACC;AAAA,UACE;AAAA,gCAAC;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,oBAAC;AAAA,cAAoB,IAAI;AAAA,aAAI;AAAA;AAAA,SAC/B;AAAA,QAEF,qBAAC;AAAA,UAAK,IAAG;AAAA,UAAO,YAAW;AAAA,UAAS,OAAO,EAAE,cAAc,SAAS;AAAA,UAClE;AAAA,gCAAC;AAAA,cAAe;AAAA,cAAkC;AAAA,aAAgC;AAAA,YAClF,oBAAC;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,aACF;AAAA,YACA,oBAAC;AAAA,cAAe;AAAA,cAA0B;AAAA,aAAwB;AAAA;AAAA,SACpE;AAAA;AAAA,KACF;AAAA,GACF;AAEJ;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/Paginator.js.map CHANGED
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Paginator.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { Checkmark, ChevronDown } from '@elliemae/ds-icons';\nimport { useOnElementResize } from '@elliemae/ds-utilities';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport {\n InvisibleDetail,\n PaginationBoldText,\n PaginationDetail,\n PaginationDropdownButton,\n PaginationSeparator,\n} from '../styled';\nimport { usePaginationSearch } from '../hooks/usePaginationSearch';\n\ninterface PaginatorPropsT {\n pageIndex: number;\n pageCount: number;\n onPageChange: (page: number) => void;\n pageDetails: string[];\n pageDetailsTitle: string;\n}\n\nconst Paginator: React.ComponentType<PaginatorPropsT> = (props) => {\n const { pageIndex, pageCount, onPageChange, pageDetails, pageDetailsTitle } = props;\n\n const [isOpened, setIsOpened] = useState(false);\n\n const btnRef = useRef<HTMLButtonElement>(null);\n const pageInfoRef = useRef<HTMLDivElement>(null);\n\n const { width: btnWidth } = useOnElementResize(btnRef);\n const { width: txtWidth } = useOnElementResize(pageInfoRef);\n\n const options = useMemo(\n () =>\n new Array(pageCount).fill(0).map((_, index) => {\n const option: Record<string, unknown> = {\n dsId: (index + 1).toString(),\n label: (index + 1).toString(),\n value: index + 1,\n type: 'single',\n };\n if (pageDetails?.length) {\n option.render = () => (\n <Grid cols={['16px', `${txtWidth + 16}px`, 'auto']} gutter=\"xxs\" alignItems=\"center\">\n {pageIndex === index ? <Checkmark size=\"s\" color={['brand-primary', '600']} /> : <div />}\n <span>{index + 1}</span>\n <span\n style={{\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n }}\n >\n {pageDetails[index]}\n </span>\n </Grid>\n );\n }\n return option;\n }),\n [pageCount, pageDetails, pageIndex, txtWidth],\n );\n\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant((pageIndex + 1).toString());\n actionRef.current.scrollOptionIntoView((pageIndex + 1).toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\n\n const [detailWidth, setDetailWidth] = useState(0);\n\n useLayoutEffect(() => {\n const invisibleDetails = [\n ...document.body.querySelectorAll('[data-testid=\"ds-pagination-invisible-detail-for-width-calc\"]'),\n ] as HTMLDivElement[];\n const maxWidth = invisibleDetails.reduce((acc, cur) => Math.max(acc, cur.getBoundingClientRect().width), 0);\n setDetailWidth(maxWidth);\n }, [pageDetails]);\n\n const onKeyDown = usePaginationSearch(pageCount, actionRef);\n\n return (\n <>\n <PaginationSeparator />\n <DSDropdownMenuV2\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [(pageIndex + 1).toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageChange(clickedOption.value);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[-23, 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n onKeyDown={onKeyDown}\n minWidth={pageDetails.length !== 0 ? btnWidth + 23 : pageCount.toString().length * 6 + 90}\n maxHeight={300}\n HeaderComp={() =>\n pageDetailsTitle !== '' ? (\n <Grid cols={[`${txtWidth + 50}px`, '8px', 'auto']}>\n <span style={{ marginLeft: '8px' }}>Page</span>\n <PaginationSeparator height=\"100%\" />\n <span>{pageDetailsTitle}</span>\n </Grid>\n ) : (\n 'Page'\n )\n }\n >\n <PaginationDropdownButton\n buttonType=\"raw\"\n onClick={() => setIsOpened((prev) => !prev)}\n innerRef={btnRef}\n aria-label={`Page ${pageIndex + 1} out of ${pageCount}, ${\n pageDetails.length !== 0 ? pageDetails[pageIndex] : '\\b\\b'\n }. Press to change the current page`}\n >\n <Grid\n gutter=\"xxs\"\n alignItems=\"center\"\n cols={\n pageDetails.length !== 0\n ? ['auto', 'min-content', 'minmax(0px, 70%)', 'min-content']\n : ['auto', 'min-content']\n }\n >\n <Grid alignItems=\"center\" gutter=\"xxxs\" ref={pageInfoRef} style={{ gridAutoFlow: 'column' }}>\n <PaginationBoldText fontSize=\"18px\">{pageIndex + 1}</PaginationBoldText> / {pageCount}\n </Grid>\n {pageDetails.length !== 0 && (\n <>\n <PaginationSeparator height=\"12px\" ml=\"8px\" />\n <PaginationBoldText fontSize=\"13px\" w={detailWidth} mr=\"xxs\" display=\"grid\">\n <SimpleTruncatedTooltipText value={pageDetails[pageIndex]}>\n {pageDetails[pageIndex]}\n </SimpleTruncatedTooltipText>\n {pageDetails.map((pageDetail) => (\n <InvisibleDetail data-testid=\"ds-pagination-invisible-detail-for-width-calc\">\n {pageDetail}\n </InvisibleDetail>\n ))}\n </PaginationBoldText>\n </>\n )}\n <ChevronDown color={['brand-primary', '700']} />\n </Grid>\n </PaginationDropdownButton>\n </DSDropdownMenuV2>\n <PaginationSeparator />\n </>\n );\n};\n\nexport default Paginator;\n"],
5
- "mappings": "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",
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/PerPageSelector.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/PerPageSelector.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport memoize from 'memoize-one';\nimport { range } from '@elliemae/ds-utilities';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { DSPaginationProps } from '../index.d';\nimport { PaginationDropdownButton } from '../styled';\n\nconst generateOption = (value: number | Record<string, unknown>) => {\n if (typeof value === 'object') {\n return value;\n }\n return {\n dsId: value.toString(),\n value,\n label: value.toString(),\n type: 'single',\n };\n};\n\nconst getOptions = memoize((step: number, min: number, max: number) => {\n const options = range(min, max + step, step).map(generateOption);\n return min === 0 ? options.slice(1, options.length) : options;\n});\n\nconst PerPageSelector: React.ComponentType<\n Required<\n Pick<\n DSPaginationProps,\n 'pageSize' | 'onPageSizeChange' | 'perPageOptions' | 'perPageStep' | 'minPerPage' | 'maxPerPage'\n >\n >\n> = (props) => {\n const [isOpened, setIsOpened] = useState(false);\n const { pageSize, onPageSizeChange, perPageOptions, maxPerPage, perPageStep, minPerPage } = props;\n\n const options = useMemo(() => {\n if (perPageOptions) return perPageOptions.map(generateOption);\n return getOptions(perPageStep, minPerPage, maxPerPage);\n }, [maxPerPage, minPerPage, perPageOptions, perPageStep]);\n\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n const btnRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant(pageSize.toString());\n actionRef.current.scrollOptionIntoView(pageSize.toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\n\n const width = useMemo(() => {\n const maxLength = options.reduce((acc, cur) => Math.max(acc, (cur?.label as string)?.length ?? 0), 0);\n return maxLength * 6 + 90;\n }, [options]);\n\n return (\n <DSDropdownMenuV2\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageSize.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageSizeChange(clickedOption.value);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[10, 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n minWidth={width}\n maxHeight={300}\n HeaderComp={() => 'Per Page'}\n >\n <div style={{ marginLeft: '32px' }}>\n <PaginationDropdownButton\n buttonType=\"raw\"\n onClick={() => setIsOpened((prev) => !prev)}\n aria-pressed={isOpened}\n innerRef={btnRef}\n aria-label={`${pageSize} rows per page. Press to select rows per page`}\n >\n {pageSize} / page\n <ChevronDown color={['brand-primary', '700']} />\n </PaginationDropdownButton>\n </div>\n </DSDropdownMenuV2>\n );\n};\n\nexport default PerPageSelector;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAgB,WAAW,SAAS,QAAQ,gBAAgB;AAC5D,OAAO,aAAa;AACpB,SAAS,aAAa;AACtB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAE5B,SAAS,gCAAgC;AAEzC,MAAM,iBAAiB,CAAC,UAA4C;AAClE,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,EACT;AACA,SAAO;AAAA,IACL,MAAM,MAAM,SAAS;AAAA,IACrB;AAAA,IACA,OAAO,MAAM,SAAS;AAAA,IACtB,MAAM;AAAA,EACR;AACF;AAEA,MAAM,aAAa,QAAQ,CAAC,MAAc,KAAa,QAAgB;AACrE,QAAM,UAAU,MAAM,KAAK,MAAM,MAAM,IAAI,EAAE,IAAI,cAAc;AAC/D,SAAO,QAAQ,IAAI,QAAQ,MAAM,GAAG,QAAQ,MAAM,IAAI;AACxD,CAAC;AAED,MAAM,kBAOF,CAAC,UAAU;AACb,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,EAAE,UAAU,kBAAkB,gBAAgB,YAAY,aAAa,WAAW,IAAI;AAE5F,QAAM,UAAU,QAAQ,MAAM;AAC5B,QAAI;AAAgB,aAAO,eAAe,IAAI,cAAc;AAC5D,WAAO,WAAW,aAAa,YAAY,UAAU;AAAA,EACvD,GAAG,CAAC,YAAY,YAAY,gBAAgB,WAAW,CAAC;AAExD,QAAM,YAAY,OAA+C,CAAC,CAAC;AACnE,QAAM,SAAS,OAA0B,IAAI;AAE7C,YAAU,MAAM;AACd,QAAI,UAAU;AACZ,gBAAU,QAAQ,oBAAoB,SAAS,SAAS,CAAC;AACzD,gBAAU,QAAQ,qBAAqB,SAAS,SAAS,CAAC;AAAA,IAC5D;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,QAAQ,QAAQ,MAAM;AAC1B,UAAM,YAAY,QAAQ,OAAO,CAAC,KAAK,QAAQ,KAAK,IAAI,KAAM,KAAK,OAAkB,UAAU,CAAC,GAAG,CAAC;AACpG,WAAO,YAAY,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,CAAC;AAEZ,SACE,oBAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA,iBAAiB,EAAE,CAAC,SAAS,SAAS,IAAI,KAAK;AAAA,IAC/C,eAAe,CAAC,GAAG,kBAAkB;AACnC,uBAAiB,cAAc,KAAK;AACpC,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,gBAAgB,MAAM;AACpB,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,cAAc,CAAC,IAAI,CAAC;AAAA,IACpB,0BAAyB;AAAA,IACzB;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY,MAAM;AAAA,IAElB,8BAAC;AAAA,MAAI,OAAO,EAAE,YAAY,OAAO;AAAA,MAC/B,+BAAC;AAAA,QACC,YAAW;AAAA,QACX,SAAS,MAAM,YAAY,CAAC,SAAS,CAAC,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,UAAU;AAAA,QACV,cAAY,GAAG;AAAA,QAEd;AAAA;AAAA,UAAS;AAAA,UACV,oBAAC;AAAA,YAAY,OAAO,CAAC,iBAAiB,KAAK;AAAA,WAAG;AAAA;AAAA,OAChD;AAAA,KACF;AAAA,GACF;AAEJ;AAEA,IAAO,0BAAQ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport memoize from 'memoize-one';\nimport { range } from '@elliemae/ds-utilities';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport type { DSPaginationProps } from '../index.d';\nimport { PaginationDropdownButton } from '../styled';\n\nconst generateOption = (value: number | Record<string, unknown>) => {\n if (typeof value === 'object') {\n return value;\n }\n return {\n dsId: value.toString(),\n value,\n label: value.toString(),\n type: 'single',\n };\n};\n\nconst getOptions = memoize((step: number, min: number, max: number) => {\n const options = range(min, max + step, step).map(generateOption);\n return min === 0 ? options.slice(1, options.length) : options;\n});\n\nconst PerPageSelector: React.ComponentType<\n Required<\n Pick<\n DSPaginationProps,\n 'pageSize' | 'onPageSizeChange' | 'perPageOptions' | 'perPageStep' | 'minPerPage' | 'maxPerPage'\n >\n >\n> = (props) => {\n const [isOpened, setIsOpened] = useState(false);\n const { pageSize, onPageSizeChange, perPageOptions, maxPerPage, perPageStep, minPerPage } = props;\n\n const options = useMemo(() => {\n if (perPageOptions) return perPageOptions.map(generateOption);\n return getOptions(perPageStep, minPerPage, maxPerPage);\n }, [maxPerPage, minPerPage, perPageOptions, perPageStep]);\n\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n const btnRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant(pageSize.toString());\n actionRef.current.scrollOptionIntoView(pageSize.toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\n\n const width = useMemo(() => {\n const maxLength = options.reduce((acc, cur) => Math.max(acc, (cur?.label as string)?.length ?? 0), 0);\n return maxLength * 6 + 90;\n }, [options]);\n\n return (\n <DSDropdownMenuV2\n isOpened={isOpened}\n options={options}\n selectedOptions={{ [pageSize.toString()]: true }}\n onOptionClick={(_, clickedOption) => {\n onPageSizeChange(clickedOption.value);\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n onClickOutside={() => {\n setIsOpened(false);\n btnRef.current?.focus();\n }}\n customOffset={[10, 2]}\n startPlacementPreference=\"top-start\"\n actionRef={actionRef}\n minWidth={width}\n maxHeight={300}\n HeaderComp={() => 'Per Page'}\n >\n <div style={{ marginLeft: '32px' }}>\n <PaginationDropdownButton\n buttonType=\"raw\"\n onClick={() => setIsOpened((prev) => !prev)}\n aria-pressed={isOpened}\n innerRef={btnRef}\n aria-label={`${pageSize} rows per page. Press to select rows per page`}\n >\n {pageSize} / page\n <ChevronDown color={['brand-primary', '700']} />\n </PaginationDropdownButton>\n </div>\n </DSDropdownMenuV2>\n );\n};\n\nexport default PerPageSelector;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACgFf,SAQE,KARF;AA/ER,SAAgB,WAAW,SAAS,QAAQ,gBAAgB;AAC5D,OAAO,aAAa;AACpB,SAAS,aAAa;AACtB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAE5B,SAAS,gCAAgC;AAEzC,MAAM,iBAAiB,CAAC,UAA4C;AAClE,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,EACT;AACA,SAAO;AAAA,IACL,MAAM,MAAM,SAAS;AAAA,IACrB;AAAA,IACA,OAAO,MAAM,SAAS;AAAA,IACtB,MAAM;AAAA,EACR;AACF;AAEA,MAAM,aAAa,QAAQ,CAAC,MAAc,KAAa,QAAgB;AACrE,QAAM,UAAU,MAAM,KAAK,MAAM,MAAM,IAAI,EAAE,IAAI,cAAc;AAC/D,SAAO,QAAQ,IAAI,QAAQ,MAAM,GAAG,QAAQ,MAAM,IAAI;AACxD,CAAC;AAED,MAAM,kBAOF,CAAC,UAAU;AACb,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,EAAE,UAAU,kBAAkB,gBAAgB,YAAY,aAAa,WAAW,IAAI;AAE5F,QAAM,UAAU,QAAQ,MAAM;AAC5B,QAAI;AAAgB,aAAO,eAAe,IAAI,cAAc;AAC5D,WAAO,WAAW,aAAa,YAAY,UAAU;AAAA,EACvD,GAAG,CAAC,YAAY,YAAY,gBAAgB,WAAW,CAAC;AAExD,QAAM,YAAY,OAA+C,CAAC,CAAC;AACnE,QAAM,SAAS,OAA0B,IAAI;AAE7C,YAAU,MAAM;AACd,QAAI,UAAU;AACZ,gBAAU,QAAQ,oBAAoB,SAAS,SAAS,CAAC;AACzD,gBAAU,QAAQ,qBAAqB,SAAS,SAAS,CAAC;AAAA,IAC5D;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,QAAQ,QAAQ,MAAM;AAC1B,UAAM,YAAY,QAAQ,OAAO,CAAC,KAAK,QAAQ,KAAK,IAAI,KAAM,KAAK,OAAkB,UAAU,CAAC,GAAG,CAAC;AACpG,WAAO,YAAY,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,CAAC;AAEZ,SACE,oBAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA,iBAAiB,EAAE,CAAC,SAAS,SAAS,IAAI,KAAK;AAAA,IAC/C,eAAe,CAAC,GAAG,kBAAkB;AACnC,uBAAiB,cAAc,KAAK;AACpC,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,gBAAgB,MAAM;AACpB,kBAAY,KAAK;AACjB,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,IACA,cAAc,CAAC,IAAI,CAAC;AAAA,IACpB,0BAAyB;AAAA,IACzB;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY,MAAM;AAAA,IAElB,8BAAC;AAAA,MAAI,OAAO,EAAE,YAAY,OAAO;AAAA,MAC/B,+BAAC;AAAA,QACC,YAAW;AAAA,QACX,SAAS,MAAM,YAAY,CAAC,SAAS,CAAC,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,UAAU;AAAA,QACV,cAAY,GAAG;AAAA,QAEd;AAAA;AAAA,UAAS;AAAA,UACV,oBAAC;AAAA,YAAY,OAAO,CAAC,iBAAiB,KAAK;AAAA,WAAG;AAAA;AAAA,OAChD;AAAA,KACF;AAAA,GACF;AAEJ;AAEA,IAAO,0BAAQ;",
6
6
  "names": []
7
7
  }
package/dist/esm/props.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/props.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-utilities';\nimport { WeakValidationMap } from 'react';\n\nconst emptyFunc = () => null;\n\nexport const propTypes = {\n pageCount: PropTypes.number.description('How many pages are there'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func.description('Function invoked when the page size changes').defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n width: PropTypes.any.description('Width for the container of the pagination').defaultValue('100%'),\n} as WeakValidationMap<unknown>;\n\nexport const defaultProps = {\n pageIndex: 1,\n canPreviousPage: true,\n canNextPage: true,\n pageSize: 10,\n showPerPageSelector: true,\n perPageOptions: [10],\n perPageStep: 5,\n minPerPage: 0,\n maxPerPage: 100,\n onPageSizeChange: emptyFunc,\n onPreviousPage: emptyFunc,\n onNextPage: emptyFunc,\n onPageChange: emptyFunc,\n pageDetails: [],\n pageDetailsTitle: '',\n width: '100%',\n};\n"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-utilities';\nimport type { WeakValidationMap } from 'react';\n\nconst emptyFunc = () => null;\n\nexport const propTypes = {\n pageCount: PropTypes.number.description('How many pages are there'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func.description('Function invoked when the page size changes').defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n width: PropTypes.any.description('Width for the container of the pagination').defaultValue('100%'),\n} as WeakValidationMap<unknown>;\n\nexport const defaultProps = {\n pageIndex: 1,\n canPreviousPage: true,\n canNextPage: true,\n pageSize: 10,\n showPerPageSelector: true,\n perPageOptions: [10],\n perPageStep: 5,\n minPerPage: 0,\n maxPerPage: 100,\n onPageSizeChange: emptyFunc,\n onPreviousPage: emptyFunc,\n onNextPage: emptyFunc,\n onPageChange: emptyFunc,\n pageDetails: [],\n pageDetailsTitle: '',\n width: '100%',\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAG1B,MAAM,YAAY,MAAM;AAEjB,MAAM,YAAY;AAAA,EACvB,WAAW,UAAU,OAAO,YAAY,0BAA0B;AAAA,EAClE,WAAW,UAAU,OAAO,YAAY,4CAA4C,EAAE,aAAa,CAAC;AAAA,EACpG,iBAAiB,UAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,IAAI;AAAA,EAC/G,aAAa,UAAU,KAAK,YAAY,4CAA4C,EAAE,aAAa,IAAI;AAAA,EACvG,UAAU,UAAU,OAAO,YAAY,uBAAuB,EAAE,aAAa,EAAE;AAAA,EAC/E,qBAAqB,UAAU,KAAK,YAAY,mCAAmC,EAAE,aAAa,IAAI;AAAA,EACtG,gBAAgB,UAAU;AAAA,IACxB,UAAU,UAAU;AAAA,MAClB,UAAU;AAAA,MACV,UAAU,MAAM;AAAA,QACd,MAAM,UAAU;AAAA,QAChB,OAAO,UAAU;AAAA,QACjB,OAAO,UAAU;AAAA,QACjB,MAAM,UAAU,MAAM,CAAC,QAAQ,CAAC;AAAA,MAClC,CAAC;AAAA,IACH,CAAC;AAAA,EACH,EACG,YAAY,qCAAqC,EACjD,aAAa,CAAC,EAAE,CAAC;AAAA,EACpB,aAAa,UAAU,OAAO,YAAY,+BAA+B,EAAE,aAAa,CAAC;AAAA,EACzF,YAAY,UAAU,OAAO,YAAY,+BAA+B,EAAE,aAAa,CAAC;AAAA,EACxF,YAAY,UAAU,OAAO,YAAY,+BAA+B,EAAE,aAAa,GAAG;AAAA,EAC1F,kBAAkB,UAAU,KAAK,YAAY,6CAA6C,EAAE,aAAa,MAAM,IAAI;AAAA,EACnH,gBAAgB,UAAU,KACvB,YAAY,sDAAsD,EAClE,aAAa,MAAM,IAAI;AAAA,EAC1B,cAAc,UAAU,KAAK,YAAY,wCAAwC,EAAE,aAAa,MAAM,IAAI;AAAA,EAC1G,YAAY,UAAU,KAAK,YAAY,8CAA8C,EAAE,aAAa,MAAM,IAAI;AAAA,EAC9G,aAAa,UAAU,QAAQ,UAAU,MAAM,EAAE,YAAY,kCAAkC,EAAE,aAAa,CAAC,CAAC;AAAA,EAChH,kBAAkB,UAAU,OACzB,YAAY,6DAA6D,EACzE,aAAa,EAAE;AAAA,EAClB,OAAO,UAAU,IAAI,YAAY,2CAA2C,EAAE,aAAa,MAAM;AACnG;AAEO,MAAM,eAAe;AAAA,EAC1B,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,UAAU;AAAA,EACV,qBAAqB;AAAA,EACrB,gBAAgB,CAAC,EAAE;AAAA,EACnB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,aAAa,CAAC;AAAA,EACd,kBAAkB;AAAA,EAClB,OAAO;AACT;",
6
6
  "names": []
7
7
  }
package/dist/esm/styled.js CHANGED
@@ -1,14 +1,7 @@
1
1
  import * as React from "react";
2
2
  import { Grid } from "@elliemae/ds-grid";
3
3
  import { DSButtonV2 } from "@elliemae/ds-button";
4
- import {
5
- styled,
6
- space,
7
- typography,
8
- sizing,
9
- layout,
10
- css
11
- } from "@elliemae/ds-system";
4
+ import { styled, space, typography, sizing, layout, css } from "@elliemae/ds-system";
12
5
  const styledFocusCss = css`
13
6
  &:after {
14
7
  display: block;
package/dist/esm/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport {\n styled,\n space,\n typography,\n TypographyProps,\n SpaceProps,\n sizing,\n SizingProps,\n layout,\n LayoutProps,\n css,\n} from '@elliemae/ds-system';\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 PaginationContainer = styled(Grid)`\n height: 42px;\n max-width: 100%;\n align-items: center;\n box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);\n position: relative;\n`;\n\nexport const PaginationWrapper = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const PaginationSeparator = styled(Grid)`\n background-color: ${(props) => props.theme.colors.neutral[300]};\n width: 1px;\n height: ${(props) => props.height || '30px'};\n`;\n\nexport const PaginationBoldText = styled.span<TypographyProps & SpaceProps & SizingProps & LayoutProps>`\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n ${typography}\n ${space}\n ${sizing}\n ${layout}\n position: relative;\n`;\n\nexport const InvisibleDetail = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nexport const PaginationDetail = styled.span`\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const PaginationDropdownButton = styled(DSButtonV2)`\n 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: ${(props) => props.theme.colors.neutral[700]};\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n white-space: nowrap;\n`;\n\nexport const PreviousNextPageButton = styled(DSButtonV2)`\n height: 42px;\n display: grid;\n place-items: center;\n position: relative;\n padding-left: 8px;\n padding-right: 8px;\n border-radius: 0;\n cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n :focus {\n ${styledFocusCss}\n }\n`;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,EAEA;AAAA,EAEA;AAAA,OACK;AAEP,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMnD,MAAM,sBAAsB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvC,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,sBAAsB,OAAO,IAAI;AAAA,sBACxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,YAEhD,CAAC,UAAU,MAAM,UAAU;AAAA;AAGhC,MAAM,qBAAqB,OAAO;AAAA,iBACxB,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,IAChD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAIG,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ/B,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,2BAA2B,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAW9C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,iBAGhC,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,MAE9C;AAAA;AAAA;AAAA;AAKC,MAAM,yBAAyB,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQ3C,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;AAAA;AAAA;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport type { TypographyProps, SpaceProps, SizingProps, LayoutProps } from '@elliemae/ds-system';\nimport { styled, space, typography, sizing, layout, css } from '@elliemae/ds-system';\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 PaginationContainer = styled(Grid)`\n height: 42px;\n max-width: 100%;\n align-items: center;\n box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);\n position: relative;\n`;\n\nexport const PaginationWrapper = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const PaginationSeparator = styled(Grid)`\n background-color: ${(props) => props.theme.colors.neutral[300]};\n width: 1px;\n height: ${(props) => props.height || '30px'};\n`;\n\nexport const PaginationBoldText = styled.span<TypographyProps & SpaceProps & SizingProps & LayoutProps>`\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n ${typography}\n ${space}\n ${sizing}\n ${layout}\n position: relative;\n`;\n\nexport const InvisibleDetail = styled.div`\n opacity: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n position: absolute;\n`;\n\nexport const PaginationDetail = styled.span`\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const PaginationDropdownButton = styled(DSButtonV2)`\n 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: ${(props) => props.theme.colors.neutral[700]};\n cursor: pointer;\n border-radius: 0;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n :focus {\n ${styledFocusCss}\n }\n white-space: nowrap;\n`;\n\nexport const PreviousNextPageButton = styled(DSButtonV2)`\n height: 42px;\n display: grid;\n place-items: center;\n position: relative;\n padding-left: 8px;\n padding-right: 8px;\n border-radius: 0;\n cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n :focus {\n ${styledFocusCss}\n }\n`;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAE3B,SAAS,QAAQ,OAAO,YAAY,QAAQ,QAAQ,WAAW;AAE/D,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMnD,MAAM,sBAAsB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvC,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,sBAAsB,OAAO,IAAI;AAAA,sBACxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,YAEhD,CAAC,UAAU,MAAM,UAAU;AAAA;AAGhC,MAAM,qBAAqB,OAAO;AAAA,iBACxB,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,IAChD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAIG,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ/B,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,2BAA2B,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAW9C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,iBAGhC,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,MAE9C;AAAA;AAAA;AAAA;AAKC,MAAM,yBAAyB,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQ3C,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;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.11.1-rc.1",
3
+ "version": "3.12.0-next.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Pagination",
6
6
  "files": [
@@ -75,13 +75,13 @@
75
75
  "indent": 4
76
76
  },
77
77
  "dependencies": {
78
- "@elliemae/ds-button": "3.11.1-rc.1",
79
- "@elliemae/ds-dropdownmenu": "3.11.1-rc.1",
80
- "@elliemae/ds-grid": "3.11.1-rc.1",
81
- "@elliemae/ds-icons": "3.11.1-rc.1",
82
- "@elliemae/ds-system": "3.11.1-rc.1",
83
- "@elliemae/ds-truncated-tooltip-text": "3.11.1-rc.1",
84
- "@elliemae/ds-utilities": "3.11.1-rc.1",
78
+ "@elliemae/ds-button": "3.12.0-next.1",
79
+ "@elliemae/ds-dropdownmenu": "3.12.0-next.1",
80
+ "@elliemae/ds-grid": "3.12.0-next.1",
81
+ "@elliemae/ds-icons": "3.12.0-next.1",
82
+ "@elliemae/ds-system": "3.12.0-next.1",
83
+ "@elliemae/ds-truncated-tooltip-text": "3.12.0-next.1",
84
+ "@elliemae/ds-utilities": "3.12.0-next.1",
85
85
  "memoize-one": "~6.0.0"
86
86
  },
87
87
  "devDependencies": {
@@ -103,8 +103,11 @@
103
103
  "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
104
104
  "test": "node ../../scripts/testing/test.mjs",
105
105
  "lint": "node ../../scripts/lint.mjs",
106
+ "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../.eslintrc.js' src/",
106
107
  "dts": "node ../../scripts/dts.mjs",
107
108
  "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
109
+ "dev:build": "pnpm --filter {.}... build && pnpm --filter {.}... dts",
110
+ "dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
108
111
  "checkDeps": "npx -yes ../ds-codemods check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
109
112
  }
110
113
  }