@elliemae/ds-pagination 3.33.0-next.0 → 3.33.0-next.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/parts/DSPageNextButton.js +1 -2
- package/dist/cjs/parts/DSPageNextButton.js.map +2 -2
- package/dist/cjs/parts/DSPagePrevButton.js +1 -2
- package/dist/cjs/parts/DSPagePrevButton.js.map +2 -2
- package/dist/cjs/parts/DSPaginationContainer.js +1 -2
- package/dist/cjs/parts/DSPaginationContainer.js.map +2 -2
- package/dist/cjs/parts/DSPaginator/usePaginator.js +1 -2
- package/dist/cjs/parts/DSPaginator/usePaginator.js.map +2 -2
- package/dist/cjs/parts/DSPerPageSelector/usePerPageSelector.js +1 -2
- package/dist/cjs/parts/DSPerPageSelector/usePerPageSelector.js.map +2 -2
- package/dist/esm/parts/DSPageNextButton.js +1 -2
- package/dist/esm/parts/DSPageNextButton.js.map +2 -2
- package/dist/esm/parts/DSPagePrevButton.js +1 -2
- package/dist/esm/parts/DSPagePrevButton.js.map +2 -2
- package/dist/esm/parts/DSPaginationContainer.js +1 -2
- package/dist/esm/parts/DSPaginationContainer.js.map +2 -2
- package/dist/esm/parts/DSPaginator/usePaginator.js +1 -2
- package/dist/esm/parts/DSPaginator/usePaginator.js.map +2 -2
- package/dist/esm/parts/DSPerPageSelector/usePerPageSelector.js +1 -2
- package/dist/esm/parts/DSPerPageSelector/usePerPageSelector.js.map +2 -2
- package/dist/types/parts/DSPaginator/usePaginator.d.ts +366 -2
- package/dist/types/parts/DSPerPageSelector/usePerPageSelector.d.ts +366 -2
- package/package.json +11 -11
|
@@ -34,7 +34,6 @@ __export(DSPageNextButton_exports, {
|
|
|
34
34
|
module.exports = __toCommonJS(DSPageNextButton_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
|
-
var import_lodash = require("lodash");
|
|
38
37
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
39
38
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
40
39
|
var import_PaginationDataTestID = require("../PaginationDataTestID.js");
|
|
@@ -48,7 +47,7 @@ const DSPageNextButton = (props) => {
|
|
|
48
47
|
);
|
|
49
48
|
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefault, import_react_desc_prop_types.DSPageNextButtonPropTypesSchema, import_DSPaginationDefinitions.PageNextButtonName);
|
|
50
49
|
const { canNextPage, onNextPage } = propsWithDefault;
|
|
51
|
-
const globalAttributes = (0,
|
|
50
|
+
const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefault);
|
|
52
51
|
const xstyledAttributes = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefault);
|
|
53
52
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
53
|
import_styled.PreviousNextPageButton,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/DSPageNextButton.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronRight } from '@elliemae/ds-icons';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID.js';\nimport { PreviousNextPageButton } from '../styled.js';\nimport { pageNextButtonDefaultProps, DSPageNextButtonPropTypesSchema } from '../react-desc-prop-types.js';\nimport { PageNextButtonName } from '../DSPaginationDefinitions.js';\nimport type { DSPaginationT } from '../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const DSPageNextButton: React.ComponentType<DSPaginationT.PageNextButtonProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSPaginationT.PageNextButtonInternalProps>(\n props,\n pageNextButtonDefaultProps,\n );\n useValidateTypescriptPropTypes(propsWithDefault, DSPageNextButtonPropTypesSchema, PageNextButtonName);\n\n const { canNextPage, onNextPage } = propsWithDefault;\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PageNextButtonInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(propsWithDefault);\n const xstyledAttributes = useGetXstyledProps(propsWithDefault);\n\n return (\n <PreviousNextPageButton\n disabled={!canNextPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.NEXT_BUTTON}\n aria-label=\"Go to next page\"\n {...globalAttributes}\n {...xstyledAttributes}\n onClick={() => {\n if (canNextPage) onNextPage();\n }}\n >\n <ChevronRight color={canNextPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n );\n};\n\nDSPageNextButton.propTypes = DSPageNextButtonPropTypesSchema;\nDSPageNextButton.displayName = PageNextButtonName;\nexport const DSPageNextButtonWithSchema = describe(DSPageNextButton).description('Per Page Selector');\nDSPageNextButtonWithSchema.propTypes = DSPageNextButtonPropTypesSchema;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4CjB;AA1CN,sBAA6B;AAC7B,8BAMO;AACP,kCAAuC;AACvC,oBAAuC;AACvC,mCAA4E;AAC5E,qCAAmC;AAI5B,MAAM,mBAA2E,CAAC,UAAU;AACjG,QAAM,uBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,8DAA+B,kBAAkB,8DAAiC,iDAAkB;AAEpG,QAAM,EAAE,aAAa,WAAW,IAAI;AACpC,QAAM,uBAAmB,gDAIvB,gBAAgB;AAClB,QAAM,wBAAoB,4CAAmB,gBAAgB;AAE7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC;AAAA,MACX,YAAW;AAAA,MACX,eAAa,mDAAuB;AAAA,MACpC,cAAW;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,SAAS,MAAM;AACb,YAAI;AAAa,qBAAW;AAAA,MAC9B;AAAA,MAEA,sDAAC,gCAAa,OAAO,cAAc,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK,GAAG;AAAA;AAAA,EACpF;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,cAAc;AACxB,MAAM,iCAA6B,kCAAS,gBAAgB,EAAE,YAAY,mBAAmB;AACpG,2BAA2B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,7 +34,6 @@ __export(DSPagePrevButton_exports, {
|
|
|
34
34
|
module.exports = __toCommonJS(DSPagePrevButton_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
|
-
var import_lodash = require("lodash");
|
|
38
37
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
39
38
|
var import_PaginationDataTestID = require("../PaginationDataTestID.js");
|
|
40
39
|
var import_styled = require("../styled.js");
|
|
@@ -48,7 +47,7 @@ const DSPagePrevButton = (props) => {
|
|
|
48
47
|
);
|
|
49
48
|
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefault, import_react_desc_prop_types.DSPagePrevButtonPropTypesSchema, import_DSPaginationDefinitions.PagePrevButtonName);
|
|
50
49
|
const { canPreviousPage, onPreviousPage } = propsWithDefault;
|
|
51
|
-
const globalAttributes = (0,
|
|
50
|
+
const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefault);
|
|
52
51
|
const xstyledAttributes = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefault);
|
|
53
52
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
53
|
import_styled.PreviousNextPageButton,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/DSPagePrevButton.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID.js';\nimport { PreviousNextPageButton } from '../styled.js';\nimport { pagePrevButtonDefaultProps, DSPagePrevButtonPropTypesSchema } from '../react-desc-prop-types.js';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { PagePrevButtonName } from '../DSPaginationDefinitions.js';\nimport type { DSPaginationT } from '../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const DSPagePrevButton: React.ComponentType<DSPaginationT.PagePrevButtonProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSPaginationT.PagePrevButtonInternalProps>(\n props,\n pagePrevButtonDefaultProps,\n );\n useValidateTypescriptPropTypes(propsWithDefault, DSPagePrevButtonPropTypesSchema, PagePrevButtonName);\n\n const { canPreviousPage, onPreviousPage } = propsWithDefault;\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PagePrevButtonInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(propsWithDefault);\n const xstyledAttributes = useGetXstyledProps(propsWithDefault);\n\n return (\n <PreviousNextPageButton\n disabled={!canPreviousPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.PREVIOUS_BUTTON}\n aria-label=\"Go to previous page\"\n {...globalAttributes}\n {...xstyledAttributes}\n onClick={() => {\n if (canPreviousPage) onPreviousPage();\n }}\n >\n <ChevronLeft color={canPreviousPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n );\n};\n\nDSPagePrevButton.propTypes = DSPagePrevButtonPropTypesSchema;\nDSPagePrevButton.displayName = PagePrevButtonName;\nexport const DSPagePrevButtonWithSchema = describe(DSPagePrevButton).description('Per Page Selector');\nDSPagePrevButtonWithSchema.propTypes = DSPagePrevButtonPropTypesSchema;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4CjB;AA1CN,sBAA4B;AAC5B,kCAAuC;AACvC,oBAAuC;AACvC,mCAA4E;AAC5E,8BAMO;AACP,qCAAmC;AAI5B,MAAM,mBAA2E,CAAC,UAAU;AACjG,QAAM,uBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,8DAA+B,kBAAkB,8DAAiC,iDAAkB;AAEpG,QAAM,EAAE,iBAAiB,eAAe,IAAI;AAC5C,QAAM,uBAAmB,gDAIvB,gBAAgB;AAClB,QAAM,wBAAoB,4CAAmB,gBAAgB;AAE7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC;AAAA,MACX,YAAW;AAAA,MACX,eAAa,mDAAuB;AAAA,MACpC,cAAW;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,SAAS,MAAM;AACb,YAAI;AAAiB,yBAAe;AAAA,MACtC;AAAA,MAEA,sDAAC,+BAAY,OAAO,kBAAkB,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK,GAAG;AAAA;AAAA,EACvF;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,cAAc;AACxB,MAAM,iCAA6B,kCAAS,gBAAgB,EAAE,YAAY,mBAAmB;AACpG,2BAA2B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,14 +34,13 @@ __export(DSPaginationContainer_exports, {
|
|
|
34
34
|
module.exports = __toCommonJS(DSPaginationContainer_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
|
-
var import_lodash = require("lodash");
|
|
38
37
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
39
38
|
var import_PaginationDataTestID = require("../PaginationDataTestID.js");
|
|
40
39
|
var import_styled = require("../styled.js");
|
|
41
40
|
var import_react_desc_prop_types = require("../react-desc-prop-types.js");
|
|
42
41
|
var import_DSPaginationDefinitions = require("../DSPaginationDefinitions.js");
|
|
43
42
|
const DSPaginationContainer = (props) => {
|
|
44
|
-
const globalAttributes = (0,
|
|
43
|
+
const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(props);
|
|
45
44
|
const xstyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(props);
|
|
46
45
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
47
46
|
import_styled.StyledPaginationContainer,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/DSPaginationContainer.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoBjB;AAnBN,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID.js';\nimport { StyledPaginationContainer, StyledPaginationWrapper } from '../styled.js';\nimport { DSPaginationContainerPropTypesSchema } from '../react-desc-prop-types.js';\nimport { PaginationContainerName } from '../DSPaginationDefinitions.js';\nimport type { DSPaginationT } from '../react-desc-prop-types.js';\nimport type { DSGridT } from '@elliemae/ds-grid';\n\nexport const DSPaginationContainer: React.ComponentType<DSPaginationT.ContainerProps> = (props) => {\n const globalAttributes = useGetGlobalAttributes<DSPaginationT.ContainerProps, HTMLDivElement, DSGridT.Props>(props);\n const xstyledProps = useGetXstyledProps(props);\n\n return (\n <StyledPaginationContainer\n data-testid={PAGINATION_DATA_TESTID.CONTAINER}\n {...globalAttributes}\n {...xstyledProps}\n cols={['minmax(auto, 80%)']}\n >\n <StyledPaginationWrapper>{props.children}</StyledPaginationWrapper>\n </StyledPaginationContainer>\n );\n};\n\nDSPaginationContainer.propTypes = DSPaginationContainerPropTypesSchema;\nDSPaginationContainer.displayName = PaginationContainerName;\nexport const DSPaginationContainerWithSchema = describe(DSPaginationContainer).description('Per Page Selector');\nDSPaginationContainerWithSchema.propTypes = DSPaginationContainerPropTypesSchema;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoBjB;AAnBN,8BAAqE;AACrE,kCAAuC;AACvC,oBAAmE;AACnE,mCAAqD;AACrD,qCAAwC;AAIjC,MAAM,wBAA2E,CAAC,UAAU;AACjG,QAAM,uBAAmB,gDAAoF,KAAK;AAClH,QAAM,mBAAe,4CAAmB,KAAK;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,mDAAuB;AAAA,MACnC,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,MAAM,CAAC,mBAAmB;AAAA,MAE1B,sDAAC,yCAAyB,gBAAM,UAAS;AAAA;AAAA,EAC3C;AAEJ;AAEA,sBAAsB,YAAY;AAClC,sBAAsB,cAAc;AAC7B,MAAM,sCAAkC,kCAAS,qBAAqB,EAAE,YAAY,mBAAmB;AAC9G,gCAAgC,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,7 +33,6 @@ __export(usePaginator_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(usePaginator_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_react = require("react");
|
|
36
|
-
var import_lodash = require("lodash");
|
|
37
36
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
37
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
39
38
|
var import_usePaginationSearch = require("./usePaginationSearch.js");
|
|
@@ -51,7 +50,7 @@ const usePaginator = (props) => {
|
|
|
51
50
|
[pageCount, pageIndex, pageDetails, pageInfoWidth]
|
|
52
51
|
);
|
|
53
52
|
const onKeyDown = (0, import_usePaginationSearch.usePaginationSearch)(pageCount, actionRef);
|
|
54
|
-
const globalAttributes = (0,
|
|
53
|
+
const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(props);
|
|
55
54
|
const xstyledAttributes = (0, import_ds_props_helpers.useGetXstyledProps)(props);
|
|
56
55
|
(0, import_react.useEffect)(() => {
|
|
57
56
|
if (isOpened) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSPaginator/usePaginator.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAsE;AACtE,
|
|
4
|
+
"sourcesContent": ["import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useOnElementResize } from '@elliemae/ds-utilities';\nimport { usePaginationSearch } from './usePaginationSearch.js';\nimport { getOptions } from './getOptions.js';\nimport type { DSPaginationT } from '../../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const usePaginator = (props: DSPaginationT.PaginatorInternalProps) => {\n const { pageIndex, pageCount, pageDetails } = props;\n\n const [isOpened, setIsOpened] = useState(false);\n const [detailWidth, setDetailWidth] = useState(0);\n const [pageInfoWidth, setPageInfoWidth] = useState(0);\n\n const btnRef = useRef<HTMLButtonElement>(null);\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n\n const { width: btnWidth } = useOnElementResize(btnRef);\n\n const options = useMemo(\n () => getOptions({ pageCount, pageIndex, pageDetails, pageInfoWidth }),\n [pageCount, pageIndex, pageDetails, pageInfoWidth],\n );\n\n const onKeyDown = usePaginationSearch(pageCount, actionRef);\n\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PaginatorInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(props);\n const xstyledAttributes = useGetXstyledProps(props);\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant(pageIndex.toString());\n actionRef.current.scrollOptionIntoView(pageIndex.toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\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 useEffect(() => {\n setPageInfoWidth(() => {\n // Here we get the size of the page info\n // Inside of the button, we have the page info, the chevron, separators, page details and padding\n // We substract the detailWidth if present, and the padding + chevron + separators in each case\n if (detailWidth) return btnWidth - detailWidth - 89;\n return btnWidth - 56;\n });\n }, [btnWidth, detailWidth]);\n\n return {\n btnRef,\n btnWidth,\n pageInfoWidth,\n options,\n isOpened,\n setIsOpened,\n detailWidth,\n setDetailWidth,\n globalAttributes,\n xstyledAttributes,\n actionRef,\n onKeyDown,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAsE;AACtE,8BAA2D;AAC3D,0BAAmC;AACnC,iCAAoC;AACpC,wBAA2B;AAIpB,MAAM,eAAe,CAAC,UAAgD;AAC3E,QAAM,EAAE,WAAW,WAAW,YAAY,IAAI;AAE9C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,CAAC;AAChD,QAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAS,CAAC;AAEpD,QAAM,aAAS,qBAA0B,IAAI;AAC7C,QAAM,gBAAY,qBAA+C,CAAC,CAAC;AAEnE,QAAM,EAAE,OAAO,SAAS,QAAI,wCAAmB,MAAM;AAErD,QAAM,cAAU;AAAA,IACd,UAAM,8BAAW,EAAE,WAAW,WAAW,aAAa,cAAc,CAAC;AAAA,IACrE,CAAC,WAAW,WAAW,aAAa,aAAa;AAAA,EACnD;AAEA,QAAM,gBAAY,gDAAoB,WAAW,SAAS;AAE1D,QAAM,uBAAmB,gDAIvB,KAAK;AACP,QAAM,wBAAoB,4CAAmB,KAAK;AAElD,8BAAU,MAAM;AACd,QAAI,UAAU;AACZ,gBAAU,QAAQ,oBAAoB,UAAU,SAAS,CAAC;AAC1D,gBAAU,QAAQ,qBAAqB,UAAU,SAAS,CAAC;AAAA,IAC7D;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAEb,oCAAgB,MAAM;AACpB,UAAM,mBAAmB;AAAA,MACvB,GAAG,SAAS,KAAK,iBAAiB,+DAA+D;AAAA,IACnG;AACA,UAAM,WAAW,iBAAiB,OAAO,CAAC,KAAK,QAAQ,KAAK,IAAI,KAAK,IAAI,sBAAsB,EAAE,KAAK,GAAG,CAAC;AAC1G,mBAAe,QAAQ;AAAA,EACzB,GAAG,CAAC,WAAW,CAAC;AAEhB,8BAAU,MAAM;AACd,qBAAiB,MAAM;AAIrB,UAAI;AAAa,eAAO,WAAW,cAAc;AACjD,aAAO,WAAW;AAAA,IACpB,CAAC;AAAA,EACH,GAAG,CAAC,UAAU,WAAW,CAAC;AAE1B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,7 +33,6 @@ __export(usePerPageSelector_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(usePerPageSelector_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_react = require("react");
|
|
36
|
-
var import_lodash = require("lodash");
|
|
37
36
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
37
|
var import_getOptions = require("./getOptions.js");
|
|
39
38
|
const usePerPageSelector = (props) => {
|
|
@@ -56,7 +55,7 @@ const usePerPageSelector = (props) => {
|
|
|
56
55
|
const maxLength = options.reduce((acc, cur) => Math.max(acc, ("label" in cur ? cur.label : "").length), 0);
|
|
57
56
|
return maxLength * 6 + 90;
|
|
58
57
|
}, [options]);
|
|
59
|
-
const globalAttributes = (0,
|
|
58
|
+
const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(props);
|
|
60
59
|
const xstyledAttributes = (0, import_ds_props_helpers.useGetXstyledProps)(props);
|
|
61
60
|
return {
|
|
62
61
|
actionRef,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSPerPageSelector/usePerPageSelector.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useEffect, useMemo, useRef, useState } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,
|
|
4
|
+
"sourcesContent": ["import { useEffect, useMemo, useRef, useState } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { generateOption, getOptions } from './getOptions.js';\nimport type { DSPaginationT } from '../../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const usePerPageSelector = (props: DSPaginationT.PerPageSelectorInternalProps) => {\n const { pageSize, perPageOptions, perPageStep, minPerPage, maxPerPage } = props;\n\n const [isOpened, setIsOpened] = useState(false);\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, ('label' in cur ? cur.label : '').length), 0);\n return maxLength * 6 + 90;\n }, [options]);\n\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PerPageSelectorInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(props);\n const xstyledAttributes = useGetXstyledProps(props);\n\n return {\n actionRef,\n btnRef,\n width,\n isOpened,\n setIsOpened,\n options,\n globalAttributes,\n xstyledAttributes,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,8BAA2D;AAC3D,wBAA2C;AAIpC,MAAM,qBAAqB,CAAC,UAAsD;AACvF,QAAM,EAAE,UAAU,gBAAgB,aAAa,YAAY,WAAW,IAAI;AAE1E,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAE9C,QAAM,cAAU,sBAAQ,MAAM;AAC5B,QAAI;AAAgB,aAAO,eAAe,IAAI,gCAAc;AAC5D,eAAO,8BAAW,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,MAAM,WAAW,MAAM,IAAI,QAAQ,IAAI,MAAM,GAAG,CAAC;AACzG,WAAO,YAAY,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,uBAAmB,gDAIvB,KAAK;AACP,QAAM,wBAAoB,4CAAmB,KAAK;AAElD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { omit } from "lodash";
|
|
4
3
|
import { ChevronRight } from "@elliemae/ds-icons";
|
|
5
4
|
import {
|
|
6
5
|
describe,
|
|
@@ -20,7 +19,7 @@ const DSPageNextButton = (props) => {
|
|
|
20
19
|
);
|
|
21
20
|
useValidateTypescriptPropTypes(propsWithDefault, DSPageNextButtonPropTypesSchema, PageNextButtonName);
|
|
22
21
|
const { canNextPage, onNextPage } = propsWithDefault;
|
|
23
|
-
const globalAttributes =
|
|
22
|
+
const globalAttributes = useGetGlobalAttributes(propsWithDefault);
|
|
24
23
|
const xstyledAttributes = useGetXstyledProps(propsWithDefault);
|
|
25
24
|
return /* @__PURE__ */ jsx(
|
|
26
25
|
PreviousNextPageButton,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DSPageNextButton.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
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 {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID.js';\nimport { PreviousNextPageButton } from '../styled.js';\nimport { pageNextButtonDefaultProps, DSPageNextButtonPropTypesSchema } from '../react-desc-prop-types.js';\nimport { PageNextButtonName } from '../DSPaginationDefinitions.js';\nimport type { DSPaginationT } from '../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const DSPageNextButton: React.ComponentType<DSPaginationT.PageNextButtonProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSPaginationT.PageNextButtonInternalProps>(\n props,\n pageNextButtonDefaultProps,\n );\n useValidateTypescriptPropTypes(propsWithDefault, DSPageNextButtonPropTypesSchema, PageNextButtonName);\n\n const { canNextPage, onNextPage } = propsWithDefault;\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PageNextButtonInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(propsWithDefault);\n const xstyledAttributes = useGetXstyledProps(propsWithDefault);\n\n return (\n <PreviousNextPageButton\n disabled={!canNextPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.NEXT_BUTTON}\n aria-label=\"Go to next page\"\n {...globalAttributes}\n {...xstyledAttributes}\n onClick={() => {\n if (canNextPage) onNextPage();\n }}\n >\n <ChevronRight color={canNextPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n );\n};\n\nDSPageNextButton.propTypes = DSPageNextButtonPropTypesSchema;\nDSPageNextButton.displayName = PageNextButtonName;\nexport const DSPageNextButtonWithSchema = describe(DSPageNextButton).description('Per Page Selector');\nDSPageNextButtonWithSchema.propTypes = DSPageNextButtonPropTypesSchema;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4CjB;AA1CN,SAAS,oBAAoB;AAC7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AACvC,SAAS,4BAA4B,uCAAuC;AAC5E,SAAS,0BAA0B;AAI5B,MAAM,mBAA2E,CAAC,UAAU;AACjG,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,iCAA+B,kBAAkB,iCAAiC,kBAAkB;AAEpG,QAAM,EAAE,aAAa,WAAW,IAAI;AACpC,QAAM,mBAAmB,uBAIvB,gBAAgB;AAClB,QAAM,oBAAoB,mBAAmB,gBAAgB;AAE7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC;AAAA,MACX,YAAW;AAAA,MACX,eAAa,uBAAuB;AAAA,MACpC,cAAW;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,SAAS,MAAM;AACb,YAAI;AAAa,qBAAW;AAAA,MAC9B;AAAA,MAEA,8BAAC,gBAAa,OAAO,cAAc,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK,GAAG;AAAA;AAAA,EACpF;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,cAAc;AACxB,MAAM,6BAA6B,SAAS,gBAAgB,EAAE,YAAY,mBAAmB;AACpG,2BAA2B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { omit } from "lodash";
|
|
4
3
|
import { ChevronLeft } from "@elliemae/ds-icons";
|
|
5
4
|
import { PAGINATION_DATA_TESTID } from "../PaginationDataTestID.js";
|
|
6
5
|
import { PreviousNextPageButton } from "../styled.js";
|
|
@@ -20,7 +19,7 @@ const DSPagePrevButton = (props) => {
|
|
|
20
19
|
);
|
|
21
20
|
useValidateTypescriptPropTypes(propsWithDefault, DSPagePrevButtonPropTypesSchema, PagePrevButtonName);
|
|
22
21
|
const { canPreviousPage, onPreviousPage } = propsWithDefault;
|
|
23
|
-
const globalAttributes =
|
|
22
|
+
const globalAttributes = useGetGlobalAttributes(propsWithDefault);
|
|
24
23
|
const xstyledAttributes = useGetXstyledProps(propsWithDefault);
|
|
25
24
|
return /* @__PURE__ */ jsx(
|
|
26
25
|
PreviousNextPageButton,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DSPagePrevButton.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
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.js';\nimport { PreviousNextPageButton } from '../styled.js';\nimport { pagePrevButtonDefaultProps, DSPagePrevButtonPropTypesSchema } from '../react-desc-prop-types.js';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { PagePrevButtonName } from '../DSPaginationDefinitions.js';\nimport type { DSPaginationT } from '../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const DSPagePrevButton: React.ComponentType<DSPaginationT.PagePrevButtonProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSPaginationT.PagePrevButtonInternalProps>(\n props,\n pagePrevButtonDefaultProps,\n );\n useValidateTypescriptPropTypes(propsWithDefault, DSPagePrevButtonPropTypesSchema, PagePrevButtonName);\n\n const { canPreviousPage, onPreviousPage } = propsWithDefault;\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PagePrevButtonInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(propsWithDefault);\n const xstyledAttributes = useGetXstyledProps(propsWithDefault);\n\n return (\n <PreviousNextPageButton\n disabled={!canPreviousPage}\n buttonType=\"raw\"\n data-testid={PAGINATION_DATA_TESTID.PREVIOUS_BUTTON}\n aria-label=\"Go to previous page\"\n {...globalAttributes}\n {...xstyledAttributes}\n onClick={() => {\n if (canPreviousPage) onPreviousPage();\n }}\n >\n <ChevronLeft color={canPreviousPage ? ['brand-primary', '700'] : ['neutral', '500']} />\n </PreviousNextPageButton>\n );\n};\n\nDSPagePrevButton.propTypes = DSPagePrevButtonPropTypesSchema;\nDSPagePrevButton.displayName = PagePrevButtonName;\nexport const DSPagePrevButtonWithSchema = describe(DSPagePrevButton).description('Per Page Selector');\nDSPagePrevButtonWithSchema.propTypes = DSPagePrevButtonPropTypesSchema;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4CjB;AA1CN,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AACvC,SAAS,4BAA4B,uCAAuC;AAC5E;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,0BAA0B;AAI5B,MAAM,mBAA2E,CAAC,UAAU;AACjG,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,iCAA+B,kBAAkB,iCAAiC,kBAAkB;AAEpG,QAAM,EAAE,iBAAiB,eAAe,IAAI;AAC5C,QAAM,mBAAmB,uBAIvB,gBAAgB;AAClB,QAAM,oBAAoB,mBAAmB,gBAAgB;AAE7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC;AAAA,MACX,YAAW;AAAA,MACX,eAAa,uBAAuB;AAAA,MACpC,cAAW;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,SAAS,MAAM;AACb,YAAI;AAAiB,yBAAe;AAAA,MACtC;AAAA,MAEA,8BAAC,eAAY,OAAO,kBAAkB,CAAC,iBAAiB,KAAK,IAAI,CAAC,WAAW,KAAK,GAAG;AAAA;AAAA,EACvF;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,cAAc;AACxB,MAAM,6BAA6B,SAAS,gBAAgB,EAAE,YAAY,mBAAmB;AACpG,2BAA2B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { omit } from "lodash";
|
|
4
3
|
import { describe, useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
|
|
5
4
|
import { PAGINATION_DATA_TESTID } from "../PaginationDataTestID.js";
|
|
6
5
|
import { StyledPaginationContainer, StyledPaginationWrapper } from "../styled.js";
|
|
7
6
|
import { DSPaginationContainerPropTypesSchema } from "../react-desc-prop-types.js";
|
|
8
7
|
import { PaginationContainerName } from "../DSPaginationDefinitions.js";
|
|
9
8
|
const DSPaginationContainer = (props) => {
|
|
10
|
-
const globalAttributes =
|
|
9
|
+
const globalAttributes = useGetGlobalAttributes(props);
|
|
11
10
|
const xstyledProps = useGetXstyledProps(props);
|
|
12
11
|
return /* @__PURE__ */ jsx(
|
|
13
12
|
StyledPaginationContainer,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DSPaginationContainer.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACoBjB;AAnBN,SAAS,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { PAGINATION_DATA_TESTID } from '../PaginationDataTestID.js';\nimport { StyledPaginationContainer, StyledPaginationWrapper } from '../styled.js';\nimport { DSPaginationContainerPropTypesSchema } from '../react-desc-prop-types.js';\nimport { PaginationContainerName } from '../DSPaginationDefinitions.js';\nimport type { DSPaginationT } from '../react-desc-prop-types.js';\nimport type { DSGridT } from '@elliemae/ds-grid';\n\nexport const DSPaginationContainer: React.ComponentType<DSPaginationT.ContainerProps> = (props) => {\n const globalAttributes = useGetGlobalAttributes<DSPaginationT.ContainerProps, HTMLDivElement, DSGridT.Props>(props);\n const xstyledProps = useGetXstyledProps(props);\n\n return (\n <StyledPaginationContainer\n data-testid={PAGINATION_DATA_TESTID.CONTAINER}\n {...globalAttributes}\n {...xstyledProps}\n cols={['minmax(auto, 80%)']}\n >\n <StyledPaginationWrapper>{props.children}</StyledPaginationWrapper>\n </StyledPaginationContainer>\n );\n};\n\nDSPaginationContainer.propTypes = DSPaginationContainerPropTypesSchema;\nDSPaginationContainer.displayName = PaginationContainerName;\nexport const DSPaginationContainerWithSchema = describe(DSPaginationContainer).description('Per Page Selector');\nDSPaginationContainerWithSchema.propTypes = DSPaginationContainerPropTypesSchema;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACoBjB;AAnBN,SAAS,UAAU,wBAAwB,0BAA0B;AACrE,SAAS,8BAA8B;AACvC,SAAS,2BAA2B,+BAA+B;AACnE,SAAS,4CAA4C;AACrD,SAAS,+BAA+B;AAIjC,MAAM,wBAA2E,CAAC,UAAU;AACjG,QAAM,mBAAmB,uBAAoF,KAAK;AAClH,QAAM,eAAe,mBAAmB,KAAK;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,uBAAuB;AAAA,MACnC,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,MAAM,CAAC,mBAAmB;AAAA,MAE1B,8BAAC,2BAAyB,gBAAM,UAAS;AAAA;AAAA,EAC3C;AAEJ;AAEA,sBAAsB,YAAY;AAClC,sBAAsB,cAAc;AAC7B,MAAM,kCAAkC,SAAS,qBAAqB,EAAE,YAAY,mBAAmB;AAC9G,gCAAgC,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
3
|
-
import { omit } from "lodash";
|
|
4
3
|
import { useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
|
|
5
4
|
import { useOnElementResize } from "@elliemae/ds-utilities";
|
|
6
5
|
import { usePaginationSearch } from "./usePaginationSearch.js";
|
|
@@ -18,7 +17,7 @@ const usePaginator = (props) => {
|
|
|
18
17
|
[pageCount, pageIndex, pageDetails, pageInfoWidth]
|
|
19
18
|
);
|
|
20
19
|
const onKeyDown = usePaginationSearch(pageCount, actionRef);
|
|
21
|
-
const globalAttributes =
|
|
20
|
+
const globalAttributes = useGetGlobalAttributes(props);
|
|
22
21
|
const xstyledAttributes = useGetXstyledProps(props);
|
|
23
22
|
useEffect(() => {
|
|
24
23
|
if (isOpened) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPaginator/usePaginator.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,iBAAiB,SAAS,QAAQ,gBAAgB;AACtE,SAAS,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useOnElementResize } from '@elliemae/ds-utilities';\nimport { usePaginationSearch } from './usePaginationSearch.js';\nimport { getOptions } from './getOptions.js';\nimport type { DSPaginationT } from '../../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const usePaginator = (props: DSPaginationT.PaginatorInternalProps) => {\n const { pageIndex, pageCount, pageDetails } = props;\n\n const [isOpened, setIsOpened] = useState(false);\n const [detailWidth, setDetailWidth] = useState(0);\n const [pageInfoWidth, setPageInfoWidth] = useState(0);\n\n const btnRef = useRef<HTMLButtonElement>(null);\n const actionRef = useRef<Record<string, (dsId: string) => void>>({});\n\n const { width: btnWidth } = useOnElementResize(btnRef);\n\n const options = useMemo(\n () => getOptions({ pageCount, pageIndex, pageDetails, pageInfoWidth }),\n [pageCount, pageIndex, pageDetails, pageInfoWidth],\n );\n\n const onKeyDown = usePaginationSearch(pageCount, actionRef);\n\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PaginatorInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(props);\n const xstyledAttributes = useGetXstyledProps(props);\n\n useEffect(() => {\n if (isOpened) {\n actionRef.current.setActiveDescendant(pageIndex.toString());\n actionRef.current.scrollOptionIntoView(pageIndex.toString());\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpened]);\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 useEffect(() => {\n setPageInfoWidth(() => {\n // Here we get the size of the page info\n // Inside of the button, we have the page info, the chevron, separators, page details and padding\n // We substract the detailWidth if present, and the padding + chevron + separators in each case\n if (detailWidth) return btnWidth - detailWidth - 89;\n return btnWidth - 56;\n });\n }, [btnWidth, detailWidth]);\n\n return {\n btnRef,\n btnWidth,\n pageInfoWidth,\n options,\n isOpened,\n setIsOpened,\n detailWidth,\n setDetailWidth,\n globalAttributes,\n xstyledAttributes,\n actionRef,\n onKeyDown,\n };\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,iBAAiB,SAAS,QAAQ,gBAAgB;AACtE,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,0BAA0B;AACnC,SAAS,2BAA2B;AACpC,SAAS,kBAAkB;AAIpB,MAAM,eAAe,CAAC,UAAgD;AAC3E,QAAM,EAAE,WAAW,WAAW,YAAY,IAAI;AAE9C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,CAAC;AAChD,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,CAAC;AAEpD,QAAM,SAAS,OAA0B,IAAI;AAC7C,QAAM,YAAY,OAA+C,CAAC,CAAC;AAEnE,QAAM,EAAE,OAAO,SAAS,IAAI,mBAAmB,MAAM;AAErD,QAAM,UAAU;AAAA,IACd,MAAM,WAAW,EAAE,WAAW,WAAW,aAAa,cAAc,CAAC;AAAA,IACrE,CAAC,WAAW,WAAW,aAAa,aAAa;AAAA,EACnD;AAEA,QAAM,YAAY,oBAAoB,WAAW,SAAS;AAE1D,QAAM,mBAAmB,uBAIvB,KAAK;AACP,QAAM,oBAAoB,mBAAmB,KAAK;AAElD,YAAU,MAAM;AACd,QAAI,UAAU;AACZ,gBAAU,QAAQ,oBAAoB,UAAU,SAAS,CAAC;AAC1D,gBAAU,QAAQ,qBAAqB,UAAU,SAAS,CAAC;AAAA,IAC7D;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAEb,kBAAgB,MAAM;AACpB,UAAM,mBAAmB;AAAA,MACvB,GAAG,SAAS,KAAK,iBAAiB,+DAA+D;AAAA,IACnG;AACA,UAAM,WAAW,iBAAiB,OAAO,CAAC,KAAK,QAAQ,KAAK,IAAI,KAAK,IAAI,sBAAsB,EAAE,KAAK,GAAG,CAAC;AAC1G,mBAAe,QAAQ;AAAA,EACzB,GAAG,CAAC,WAAW,CAAC;AAEhB,YAAU,MAAM;AACd,qBAAiB,MAAM;AAIrB,UAAI;AAAa,eAAO,WAAW,cAAc;AACjD,aAAO,WAAW;AAAA,IACpB,CAAC;AAAA,EACH,GAAG,CAAC,UAAU,WAAW,CAAC;AAE1B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { useEffect, useMemo, useRef, useState } from "react";
|
|
3
|
-
import { omit } from "lodash";
|
|
4
3
|
import { useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
|
|
5
4
|
import { generateOption, getOptions } from "./getOptions.js";
|
|
6
5
|
const usePerPageSelector = (props) => {
|
|
@@ -23,7 +22,7 @@ const usePerPageSelector = (props) => {
|
|
|
23
22
|
const maxLength = options.reduce((acc, cur) => Math.max(acc, ("label" in cur ? cur.label : "").length), 0);
|
|
24
23
|
return maxLength * 6 + 90;
|
|
25
24
|
}, [options]);
|
|
26
|
-
const globalAttributes =
|
|
25
|
+
const globalAttributes = useGetGlobalAttributes(props);
|
|
27
26
|
const xstyledAttributes = useGetXstyledProps(props);
|
|
28
27
|
return {
|
|
29
28
|
actionRef,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPerPageSelector/usePerPageSelector.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useMemo, useRef, useState } from 'react';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,SAAS,QAAQ,gBAAgB;AACrD,SAAS,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useMemo, useRef, useState } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { generateOption, getOptions } from './getOptions.js';\nimport type { DSPaginationT } from '../../react-desc-prop-types.js';\nimport type { DSButtonV2T } from '@elliemae/ds-button-v2';\n\nexport const usePerPageSelector = (props: DSPaginationT.PerPageSelectorInternalProps) => {\n const { pageSize, perPageOptions, perPageStep, minPerPage, maxPerPage } = props;\n\n const [isOpened, setIsOpened] = useState(false);\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, ('label' in cur ? cur.label : '').length), 0);\n return maxLength * 6 + 90;\n }, [options]);\n\n const globalAttributes = useGetGlobalAttributes<\n DSPaginationT.PerPageSelectorInternalProps,\n HTMLButtonElement,\n DSButtonV2T.Props\n >(props);\n const xstyledAttributes = useGetXstyledProps(props);\n\n return {\n actionRef,\n btnRef,\n width,\n isOpened,\n setIsOpened,\n options,\n globalAttributes,\n xstyledAttributes,\n };\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,SAAS,QAAQ,gBAAgB;AACrD,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,gBAAgB,kBAAkB;AAIpC,MAAM,qBAAqB,CAAC,UAAsD;AACvF,QAAM,EAAE,UAAU,gBAAgB,aAAa,YAAY,WAAW,IAAI;AAE1E,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,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,MAAM,WAAW,MAAM,IAAI,QAAQ,IAAI,MAAM,GAAG,CAAC;AACzG,WAAO,YAAY,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,mBAAmB,uBAIvB,KAAK;AACP,QAAM,oBAAoB,mBAAmB,KAAK;AAElD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|