@elliemae/ds-pagination 3.16.0-next.2 → 3.16.0-next.21

package/dist/cjs/styled.js

@@ -18,25 +18,27 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var styled_exports = {};
 __export(styled_exports, {
-  InvisibleDetail: () => InvisibleDetail,
-  PaginationBoldText: () => PaginationBoldText,
-  PaginationContainer: () => PaginationContainer,
-  PaginationDetail: () => PaginationDetail,
+  DSPaginationSeparator: () => DSPaginationSeparator,
+  InvisibleDiv: () => InvisibleDiv,
   PaginationDropdownButton: () => PaginationDropdownButton,
-  PaginationSeparator: () => PaginationSeparator,
-  PaginationWrapper: () => PaginationWrapper,
-  PreviousNextPageButton: () => PreviousNextPageButton
+  PreviousNextPageButton: () => PreviousNextPageButton,
+  StyledPaginationContainer: () => StyledPaginationContainer,
+  StyledPaginationWrapper: () => StyledPaginationWrapper
 });
 module.exports = __toCommonJS(styled_exports);
 var React = __toESM(require("react"));
 var import_ds_grid = require("@elliemae/ds-grid");
-var import_ds_button = require("@elliemae/ds-button");
+var import_ds_button_v2 = require("@elliemae/ds-button-v2");
 var import_ds_system = require("@elliemae/ds-system");
 const styledFocusCss = import_ds_system.css`
   &:after {
@@ -52,43 +54,35 @@ const styledFocusCss = import_ds_system.css`
     z-index: 7;
   }
 `;
-const PaginationContainer = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+const StyledPaginationContainer = (0, import_ds_system.styled)(import_ds_grid.Grid)`
   height: 42px;
   max-width: 100%;
   align-items: center;
+  justify-content: center;
   box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);
   position: relative;
   ${import_ds_system.xStyledCommonProps}
 `;
-const PaginationWrapper = import_ds_system.styled.div`
-  display: flex;
+const StyledPaginationWrapper = import_ds_system.styled.div`
+  display: grid;
+  grid-auto-flow: column;
   justify-content: center;
   align-items: center;
 `;
-const PaginationSeparator = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+const DSPaginationSeparator = (0, import_ds_system.styled)(import_ds_grid.Grid)`
   background-color: ${(props) => props.theme.colors.neutral[300]};
   width: 1px;
-  height: ${(props) => props.height || "30px"};
-`;
-const PaginationBoldText = import_ds_system.styled.span`
-  font-weight: ${(props) => props.theme.fontWeights.semibold};
-  position: relative;
+  height: 30px;
   ${import_ds_system.xStyledCommonProps}
 `;
-const InvisibleDetail = import_ds_system.styled.div`
+const InvisibleDiv = import_ds_system.styled.div`
   opacity: 0;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   position: absolute;
 `;
-const PaginationDetail = import_ds_system.styled.span`
-  text-align: left;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-`;
-const PaginationDropdownButton = (0, import_ds_system.styled)(import_ds_button.DSButtonV2)`
+const PaginationDropdownButton = (0, import_ds_system.styled)(import_ds_button_v2.DSButtonV2)`
   height: 42px;
   display: grid;
   grid-auto-flow: column;
@@ -99,7 +93,7 @@ const PaginationDropdownButton = (0, import_ds_system.styled)(import_ds_button.D
   padding-right: 16px;
   grid-gap: 8px;
   font-size: 13px;
-  color: ${(props) => props.theme.colors.neutral[700]};
+  color: neutral-700;
   cursor: pointer;
   border-radius: 0;
   font-weight: ${(props) => props.theme.fontWeights.regular};
@@ -111,7 +105,7 @@ const PaginationDropdownButton = (0, import_ds_system.styled)(import_ds_button.D
   }
   white-space: nowrap;
 `;
-const PreviousNextPageButton = (0, import_ds_system.styled)(import_ds_button.DSButtonV2)`
+const PreviousNextPageButton = (0, import_ds_system.styled)(import_ds_button_v2.DSButtonV2)`
   height: 42px;
   display: grid;
   place-items: center;

package/dist/cjs/styled.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { xStyledCommonProps, styled, css } from '@elliemae/ds-system';\nimport type { XstyledProps } from '@elliemae/ds-utilities';\nimport type {} from '@xstyled/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)<React.ComponentProps<typeof Grid> & XstyledProps>`\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  ${xStyledCommonProps}\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`\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  position: relative;\n  ${xStyledCommonProps}\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  &[aria-disabled='true'] {\n    cursor: not-allowed;\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"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qBAAqB;AACrB,uBAA2B;AAC3B,uBAAgD;AAIhD,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,IAM1C;AAAA;AAGG,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;AAAA,IAEhD;AAAA;AAGG,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;AAAA;AAAA;AAAA;AAQC,MAAM,6BAAyB,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQ3C,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;AAAA;AAAA;",
+  "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { xStyledCommonProps, styled, css } from '@elliemae/ds-system';\nimport type { XstyledProps } from '@elliemae/ds-props-helpers';\nimport type {} from '@xstyled/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 StyledPaginationContainer = styled(Grid)<React.ComponentProps<typeof Grid> & XstyledProps>`\n  height: 42px;\n  max-width: 100%;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);\n  position: relative;\n  ${xStyledCommonProps}\n`;\n\nexport const StyledPaginationWrapper = styled.div`\n  display: grid;\n  grid-auto-flow: column;\n  justify-content: center;\n  align-items: center;\n`;\n\nexport const DSPaginationSeparator = styled(Grid)`\n  background-color: ${(props) => props.theme.colors.neutral[300]};\n  width: 1px;\n  height: 30px;\n  ${xStyledCommonProps}\n`;\n\nexport const InvisibleDiv = styled.div`\n  opacity: 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  position: absolute;\n`;\n\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: neutral-700;\n  cursor: pointer;\n  border-radius: 0;\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  :focus {\n    ${styledFocusCss}\n  }\n  &[aria-disabled='true'] {\n    cursor: not-allowed;\n  }\n  white-space: nowrap;\n`;\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"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qBAAqB;AACrB,0BAA2B;AAC3B,uBAAgD;AAIhD,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAMtD,MAAM,gCAA4B,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOhD;AAAA;AAGG,MAAM,0BAA0B,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOvC,MAAM,4BAAwB,yBAAO,mBAAI;AAAA,sBAC1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA,IAG3D;AAAA;AAGG,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ5B,MAAM,+BAA2B,yBAAO,8BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAcxC,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,MAE9C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQC,MAAM,6BAAyB,yBAAO,8BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQ3C,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;AAAA;AAAA;",
   "names": []
 }

package/dist/esm/DSPaginationDefinitions.js

@@ -1,6 +1,18 @@
 import * as React from "react";
 const DSPaginationName = "DSPagination";
+const PaginationContainerName = "DSPaginationContainer";
+const PerPageSelectorName = "DSPerPageSelector";
+const PagePrevButtonName = "DSPagePrevButton";
+const PageNextButtonName = "DSPageNextButton";
+const PaginatorName = "DSPaginator";
+const PaginationSeparatorName = "DSPaginationSeparator";
 export {
-  DSPaginationName
+  DSPaginationName,
+  PageNextButtonName,
+  PagePrevButtonName,
+  PaginationContainerName,
+  PaginationSeparatorName,
+  PaginatorName,
+  PerPageSelectorName
 };
 //# sourceMappingURL=DSPaginationDefinitions.js.map

package/dist/esm/DSPaginationDefinitions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSPaginationDefinitions.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSPaginationName = 'DSPagination';\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,mBAAmB;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSPaginationName = 'DSPagination';\n\nexport const PaginationContainerName = 'DSPaginationContainer';\n\nexport const PerPageSelectorName = 'DSPerPageSelector';\n\nexport const PagePrevButtonName = 'DSPagePrevButton';\n\nexport const PageNextButtonName = 'DSPageNextButton';\n\nexport const PaginatorName = 'DSPaginator';\n\nexport const PaginationSeparatorName = 'DSPaginationSeparator';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,mBAAmB;AAEzB,MAAM,0BAA0B;AAEhC,MAAM,sBAAsB;AAE5B,MAAM,qBAAqB;AAE3B,MAAM,qBAAqB;AAE3B,MAAM,gBAAgB;AAEtB,MAAM,0BAA0B;",
   "names": []
 }

package/dist/esm/Pagination.js

@@ -1,9 +1,9 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
-import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
-import { PaginationContent } from "./parts/PaginationContent";
-import { DSPaginationName } from "./DSPaginationDefinitions";
-import { defaultProps, DSPaginationPropTypesSchema } from "./react-desc-prop-types";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-props-helpers";
+import { PaginationContent } from "./parts/PaginationContent.js";
+import { DSPaginationName } from "./DSPaginationDefinitions.js";
+import { defaultProps, DSPaginationPropTypesSchema } from "./react-desc-prop-types.js";
 const DSPagination = (props) => {
   const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
   useValidateTypescriptPropTypes(propsWithDefault, DSPaginationPropTypesSchema, DSPaginationName);

package/dist/esm/Pagination.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/Pagination.tsx"],
-  "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 { DSPaginationName } from './DSPaginationDefinitions';\nimport type { DSPaginationT } from './react-desc-prop-types';\nimport { defaultProps, DSPaginationPropTypesSchema } from './react-desc-prop-types';\n\nconst DSPagination: React.ComponentType<DSPaginationT.Props> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault<DSPaginationT.InternalProps>(props, defaultProps);\n  useValidateTypescriptPropTypes(propsWithDefault, DSPaginationPropTypesSchema, DSPaginationName);\n\n  return <PaginationContent {...propsWithDefault} />;\n};\n\nDSPagination.propTypes = DSPaginationPropTypesSchema;\nDSPagination.displayName = DSPaginationName;\nconst DSPaginationWithSchema = describe(DSPagination).description('DSPagination');\nDSPaginationWithSchema.propTypes = DSPaginationPropTypesSchema;\n\nexport { DSPagination, DSPaginationWithSchema };\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { PaginationContent } from './parts/PaginationContent.js';\nimport { DSPaginationName } from './DSPaginationDefinitions.js';\nimport type { DSPaginationT } from './react-desc-prop-types.js';\nimport { defaultProps, DSPaginationPropTypesSchema } from './react-desc-prop-types.js';\n\nconst DSPagination: React.ComponentType<DSPaginationT.Props> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault<DSPaginationT.InternalProps>(props, defaultProps);\n  useValidateTypescriptPropTypes(propsWithDefault, DSPaginationPropTypesSchema, DSPaginationName);\n\n  return <PaginationContent {...propsWithDefault} />;\n};\n\nDSPagination.propTypes = DSPaginationPropTypesSchema;\nDSPagination.displayName = DSPaginationName;\nconst DSPaginationWithSchema = describe(DSPagination).description('DSPagination');\nDSPaginationWithSchema.propTypes = DSPaginationPropTypesSchema;\n\nexport { DSPagination, DSPaginationWithSchema };\n"],
   "mappings": "AAAA,YAAY,WAAW;ACWd;AAVT,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AAEjC,SAAS,cAAc,mCAAmC;AAE1D,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,mBAAmB,6BAA0D,OAAO,YAAY;AACtG,iCAA+B,kBAAkB,6BAA6B,gBAAgB;AAE9F,SAAO,oBAAC,qBAAmB,GAAG,kBAAkB;AAClD;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY,EAAE,YAAY,cAAc;AAChF,uBAAuB,YAAY;",
   "names": []
 }

package/dist/esm/PaginationDataTestID.js

@@ -2,7 +2,9 @@ import * as React from "react";
 const PAGINATION_DATA_TESTID = {
   PREVIOUS_BUTTON: "data-table-pagination-prev-button",
   NEXT_BUTTON: "data-table-pagination-next-button",
-  CONTAINER: "data-table-pagination-container"
+  CONTAINER: "data-table-pagination-container",
+  PER_PAGE_SELECTOR: "ds-pagination-per-page-selector",
+  PAGINATOR: "ds-pagination-paginator"
 };
 export {
   PAGINATION_DATA_TESTID

package/dist/esm/PaginationDataTestID.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/PaginationDataTestID.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const PAGINATION_DATA_TESTID = {\n  PREVIOUS_BUTTON: 'data-table-pagination-prev-button',\n  NEXT_BUTTON: 'data-table-pagination-next-button',\n  CONTAINER: 'data-table-pagination-container',\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,yBAAyB;AAAA,EACpC,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,WAAW;AACb;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const PAGINATION_DATA_TESTID = {\n  PREVIOUS_BUTTON: 'data-table-pagination-prev-button',\n  NEXT_BUTTON: 'data-table-pagination-next-button',\n  CONTAINER: 'data-table-pagination-container',\n  PER_PAGE_SELECTOR: 'ds-pagination-per-page-selector',\n  PAGINATOR: 'ds-pagination-paginator',\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,yBAAyB;AAAA,EACpC,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,WAAW;AAAA,EACX,mBAAmB;AAAA,EACnB,WAAW;AACb;",
   "names": []
 }

package/dist/esm/index.js

@@ -1,3 +1,41 @@
 import * as React from "react";
-export * from "./Pagination";
+import { DSPaginationSeparator } from "./styled.js";
+import { DSPaginationStyledPartPropTypesSchema } from "./react-desc-prop-types.js";
+import { describe } from "@elliemae/ds-props-helpers";
+import { PaginationSeparatorName } from "./DSPaginationDefinitions.js";
+DSPaginationSeparator.propTypes = DSPaginationStyledPartPropTypesSchema;
+DSPaginationSeparator.displayName = PaginationSeparatorName;
+const DSPaginationSeparatorWithSchema = describe(DSPaginationSeparator).description("Pagination Separator");
+import { DSPagination, DSPaginationWithSchema } from "./Pagination.js";
+import {
+  DSPageNextButton,
+  DSPageNextButtonWithSchema,
+  DSPagePrevButton,
+  DSPagePrevButtonWithSchema,
+  DSPaginationContainer,
+  DSPaginationContainerWithSchema,
+  DSPerPageSelector,
+  DSPerPageSelectorWithSchema,
+  DSPaginator,
+  DSPaginatorWithSchema
+} from "./parts/index.js";
+import { DSPaginationSeparator as DSPaginationSeparator2 } from "./styled.js";
+import { PAGINATION_DATA_TESTID } from "./PaginationDataTestID.js";
+export {
+  DSPageNextButton,
+  DSPageNextButtonWithSchema,
+  DSPagePrevButton,
+  DSPagePrevButtonWithSchema,
+  DSPagination,
+  DSPaginationContainer,
+  DSPaginationContainerWithSchema,
+  DSPaginationSeparator2 as DSPaginationSeparator,
+  DSPaginationSeparatorWithSchema,
+  DSPaginationWithSchema,
+  DSPaginator,
+  DSPaginatorWithSchema,
+  DSPerPageSelector,
+  DSPerPageSelectorWithSchema,
+  PAGINATION_DATA_TESTID
+};
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './Pagination';\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
-  "names": []
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSPaginationSeparator } from './styled.js';\nimport { DSPaginationStyledPartPropTypesSchema } from './react-desc-prop-types.js';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { PaginationSeparatorName } from './DSPaginationDefinitions.js';\n\nDSPaginationSeparator.propTypes = DSPaginationStyledPartPropTypesSchema;\nDSPaginationSeparator.displayName = PaginationSeparatorName;\nconst DSPaginationSeparatorWithSchema = describe(DSPaginationSeparator).description('Pagination Separator');\n\nexport { DSPagination, DSPaginationWithSchema } from './Pagination.js';\nexport {\n  DSPageNextButton,\n  DSPageNextButtonWithSchema,\n  DSPagePrevButton,\n  DSPagePrevButtonWithSchema,\n  DSPaginationContainer,\n  DSPaginationContainerWithSchema,\n  DSPerPageSelector,\n  DSPerPageSelectorWithSchema,\n  DSPaginator,\n  DSPaginatorWithSchema,\n} from './parts/index.js';\n\nexport { DSPaginationSeparator } from './styled.js';\n\nexport { DSPaginationSeparatorWithSchema };\n\nexport { PAGINATION_DATA_TESTID } from './PaginationDataTestID.js';\n\nexport type { DSPaginationT } from './react-desc-prop-types.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,6BAA6B;AACtC,SAAS,6CAA6C;AACtD,SAAS,gBAAgB;AACzB,SAAS,+BAA+B;AAExC,sBAAsB,YAAY;AAClC,sBAAsB,cAAc;AACpC,MAAM,kCAAkC,SAAS,qBAAqB,EAAE,YAAY,sBAAsB;AAE1G,SAAS,cAAc,8BAA8B;AACrD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,yBAAAA,8BAA6B;AAItC,SAAS,8BAA8B;",
+  "names": ["DSPaginationSeparator"]
 }

package/dist/esm/package.json

@@ -0,0 +1,7 @@
+{
+  "type": "module",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ]
+}

package/dist/esm/parts/DSPageNextButton.js

@@ -0,0 +1,50 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { omit } from "lodash";
+import { ChevronRight } from "@elliemae/ds-icons";
+import {
+  describe,
+  useGetGlobalAttributes,
+  useGetXstyledProps,
+  useMemoMergePropsWithDefault,
+  useValidateTypescriptPropTypes
+} from "@elliemae/ds-props-helpers";
+import { PAGINATION_DATA_TESTID } from "../PaginationDataTestID.js";
+import { PreviousNextPageButton } from "../styled.js";
+import { pageNextButtonDefaultProps, DSPageNextButtonPropTypesSchema } from "../react-desc-prop-types.js";
+import { PageNextButtonName } from "../DSPaginationDefinitions.js";
+const DSPageNextButton = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(
+    props,
+    pageNextButtonDefaultProps
+  );
+  useValidateTypescriptPropTypes(propsWithDefault, DSPageNextButtonPropTypesSchema, PageNextButtonName);
+  const { canNextPage, onNextPage } = propsWithDefault;
+  const globalAttributes = omit(useGetGlobalAttributes(propsWithDefault), "shape", "size", "type");
+  const xstyledAttributes = useGetXstyledProps(propsWithDefault);
+  return /* @__PURE__ */ jsx(
+    PreviousNextPageButton,
+    {
+      disabled: !canNextPage,
+      buttonType: "raw",
+      "data-testid": PAGINATION_DATA_TESTID.NEXT_BUTTON,
+      "aria-label": "Go to next page",
+      ...globalAttributes,
+      ...xstyledAttributes,
+      onClick: () => {
+        if (canNextPage)
+          onNextPage();
+      },
+      children: /* @__PURE__ */ jsx(ChevronRight, { color: canNextPage ? ["brand-primary", "700"] : ["neutral", "500"] })
+    }
+  );
+};
+DSPageNextButton.propTypes = DSPageNextButtonPropTypesSchema;
+DSPageNextButton.displayName = PageNextButtonName;
+const DSPageNextButtonWithSchema = describe(DSPageNextButton).description("Per Page Selector");
+DSPageNextButtonWithSchema.propTypes = DSPageNextButtonPropTypesSchema;
+export {
+  DSPageNextButton,
+  DSPageNextButtonWithSchema
+};
+//# sourceMappingURL=DSPageNextButton.js.map

package/dist/esm/parts/DSPageNextButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DSPageNextButton.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { omit } from 'lodash';\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';\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 = omit(useGetGlobalAttributes(propsWithDefault), 'shape', 'size', 'type');\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"],
+  "mappings": "AAAA,YAAY,WAAW;ACwCjB;AAtCN,SAAS,YAAY;AACrB,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;AAG5B,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,KAAK,uBAAuB,gBAAgB,GAAG,SAAS,QAAQ,MAAM;AAC/F,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;",
+  "names": []
+}

package/dist/esm/parts/DSPagePrevButton.js

@@ -0,0 +1,50 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { omit } from "lodash";
+import { ChevronLeft } from "@elliemae/ds-icons";
+import { PAGINATION_DATA_TESTID } from "../PaginationDataTestID.js";
+import { PreviousNextPageButton } from "../styled.js";
+import { pagePrevButtonDefaultProps, DSPagePrevButtonPropTypesSchema } from "../react-desc-prop-types.js";
+import {
+  describe,
+  useGetGlobalAttributes,
+  useGetXstyledProps,
+  useMemoMergePropsWithDefault,
+  useValidateTypescriptPropTypes
+} from "@elliemae/ds-props-helpers";
+import { PagePrevButtonName } from "../DSPaginationDefinitions.js";
+const DSPagePrevButton = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(
+    props,
+    pagePrevButtonDefaultProps
+  );
+  useValidateTypescriptPropTypes(propsWithDefault, DSPagePrevButtonPropTypesSchema, PagePrevButtonName);
+  const { canPreviousPage, onPreviousPage } = propsWithDefault;
+  const globalAttributes = omit(useGetGlobalAttributes(propsWithDefault), "shape", "size", "type");
+  const xstyledAttributes = useGetXstyledProps(propsWithDefault);
+  return /* @__PURE__ */ jsx(
+    PreviousNextPageButton,
+    {
+      disabled: !canPreviousPage,
+      buttonType: "raw",
+      "data-testid": PAGINATION_DATA_TESTID.PREVIOUS_BUTTON,
+      "aria-label": "Go to previous page",
+      ...globalAttributes,
+      ...xstyledAttributes,
+      onClick: () => {
+        if (canPreviousPage)
+          onPreviousPage();
+      },
+      children: /* @__PURE__ */ jsx(ChevronLeft, { color: canPreviousPage ? ["brand-primary", "700"] : ["neutral", "500"] })
+    }
+  );
+};
+DSPagePrevButton.propTypes = DSPagePrevButtonPropTypesSchema;
+DSPagePrevButton.displayName = PagePrevButtonName;
+const DSPagePrevButtonWithSchema = describe(DSPagePrevButton).description("Per Page Selector");
+DSPagePrevButtonWithSchema.propTypes = DSPagePrevButtonPropTypesSchema;
+export {
+  DSPagePrevButton,
+  DSPagePrevButtonWithSchema
+};
+//# sourceMappingURL=DSPagePrevButton.js.map

package/dist/esm/parts/DSPagePrevButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DSPagePrevButton.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { omit } from 'lodash';\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';\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 = omit(useGetGlobalAttributes(propsWithDefault), 'shape', 'size', 'type');\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"],
+  "mappings": "AAAA,YAAY,WAAW;ACwCjB;AAtCN,SAAS,YAAY;AACrB,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;AAG5B,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,KAAK,uBAAuB,gBAAgB,GAAG,SAAS,QAAQ,MAAM;AAC/F,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;",
+  "names": []
+}

package/dist/esm/parts/DSPaginationContainer.js

@@ -0,0 +1,31 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { omit } from "lodash";
+import { describe, useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
+import { PAGINATION_DATA_TESTID } from "../PaginationDataTestID.js";
+import { StyledPaginationContainer, StyledPaginationWrapper } from "../styled.js";
+import { DSPaginationContainerPropTypesSchema } from "../react-desc-prop-types.js";
+import { PaginationContainerName } from "../DSPaginationDefinitions.js";
+const DSPaginationContainer = (props) => {
+  const globalAttributes = omit(useGetGlobalAttributes(props), ["rows", "wrap"]);
+  const xstyledProps = useGetXstyledProps(props);
+  return /* @__PURE__ */ jsx(
+    StyledPaginationContainer,
+    {
+      "data-testid": PAGINATION_DATA_TESTID.CONTAINER,
+      ...globalAttributes,
+      ...xstyledProps,
+      cols: ["minmax(auto, 80%)"],
+      children: /* @__PURE__ */ jsx(StyledPaginationWrapper, { children: props.children })
+    }
+  );
+};
+DSPaginationContainer.propTypes = DSPaginationContainerPropTypesSchema;
+DSPaginationContainer.displayName = PaginationContainerName;
+const DSPaginationContainerWithSchema = describe(DSPaginationContainer).description("Per Page Selector");
+DSPaginationContainerWithSchema.propTypes = DSPaginationContainerPropTypesSchema;
+export {
+  DSPaginationContainer,
+  DSPaginationContainerWithSchema
+};
+//# sourceMappingURL=DSPaginationContainer.js.map

package/dist/esm/parts/DSPaginationContainer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DSPaginationContainer.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { omit } from 'lodash';\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';\n\nexport const DSPaginationContainer: React.ComponentType<DSPaginationT.ContainerProps> = (props) => {\n  const globalAttributes = omit(useGetGlobalAttributes(props), ['rows', 'wrap']);\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"],
+  "mappings": "AAAA,YAAY,WAAW;ACoBjB;AAnBN,SAAS,YAAY;AACrB,SAAS,UAAU,wBAAwB,0BAA0B;AACrE,SAAS,8BAA8B;AACvC,SAAS,2BAA2B,+BAA+B;AACnE,SAAS,4CAA4C;AACrD,SAAS,+BAA+B;AAGjC,MAAM,wBAA2E,CAAC,UAAU;AACjG,QAAM,mBAAmB,KAAK,uBAAuB,KAAK,GAAG,CAAC,QAAQ,MAAM,CAAC;AAC7E,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;",
+  "names": []
+}

package/dist/esm/parts/DSPaginator/createPaginatorHeader.js

@@ -0,0 +1,20 @@
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Grid } from "@elliemae/ds-grid";
+import { DSPaginationSeparator } from "../../styled.js";
+const createPaginatorHeader = ({ pageDetailsTitle, pageInfoWidth }) => {
+  const Comp = () => {
+    if (pageDetailsTitle === "")
+      return /* @__PURE__ */ jsx(Fragment, { children: "Page" });
+    return /* @__PURE__ */ jsxs(Grid, { cols: [`${pageInfoWidth + 50}px`, "8px", "auto"], children: [
+      /* @__PURE__ */ jsx("span", { style: { marginLeft: "8px" }, children: "Page" }),
+      /* @__PURE__ */ jsx(DSPaginationSeparator, { height: "100%" }),
+      /* @__PURE__ */ jsx("span", { children: pageDetailsTitle })
+    ] });
+  };
+  return Comp;
+};
+export {
+  createPaginatorHeader
+};
+//# sourceMappingURL=createPaginatorHeader.js.map

package/dist/esm/parts/DSPaginator/createPaginatorHeader.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPaginator/createPaginatorHeader.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSPaginationSeparator } from '../../styled.js';\n\ninterface PaginatorHeaderOptions {\n  pageDetailsTitle: string;\n  pageInfoWidth: number;\n}\n\nexport const createPaginatorHeader = ({ pageDetailsTitle, pageInfoWidth }: PaginatorHeaderOptions) => {\n  const Comp = () => {\n    if (pageDetailsTitle === '') return <>Page</>;\n\n    return (\n      <Grid cols={[`${pageInfoWidth + 50}px`, '8px', 'auto']}>\n        <span style={{ marginLeft: '8px' }}>Page</span>\n        <DSPaginationSeparator height=\"100%\" />\n        <span>{pageDetailsTitle}</span>\n      </Grid>\n    );\n  };\n  return Comp;\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACWiB,wBAGlC,YAHkC;AAVxC,SAAS,YAAY;AACrB,SAAS,6BAA6B;AAO/B,MAAM,wBAAwB,CAAC,EAAE,kBAAkB,cAAc,MAA8B;AACpG,QAAM,OAAO,MAAM;AACjB,QAAI,qBAAqB;AAAI,aAAO,gCAAE,kBAAI;AAE1C,WACE,qBAAC,QAAK,MAAM,CAAC,GAAG,gBAAgB,QAAQ,OAAO,MAAM,GACnD;AAAA,0BAAC,UAAK,OAAO,EAAE,YAAY,MAAM,GAAG,kBAAI;AAAA,MACxC,oBAAC,yBAAsB,QAAO,QAAO;AAAA,MACrC,oBAAC,UAAM,4BAAiB;AAAA,OAC1B;AAAA,EAEJ;AACA,SAAO;AACT;",
+  "names": []
+}

package/dist/esm/parts/DSPaginator/getOptions.js

@@ -0,0 +1,46 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Grid } from "@elliemae/ds-grid";
+import { Checkmark } from "@elliemae/ds-icons";
+const OptionWithDetails = (props) => {
+  const Comp = () => {
+    const { pageInfoWidth, pageIndex, index, pageDetails } = props;
+    return /* @__PURE__ */ jsxs(Grid, { cols: ["16px", `${pageInfoWidth + 16}px`, "auto"], gutter: "xxs", alignItems: "center", children: [
+      pageIndex - 1 === index ? /* @__PURE__ */ jsx(Checkmark, { size: "s", color: ["brand-primary", "600"] }) : /* @__PURE__ */ jsx("div", {}),
+      /* @__PURE__ */ jsx("span", { children: index + 1 }),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          style: {
+            whiteSpace: "nowrap",
+            textOverflow: "ellipsis",
+            overflow: "hidden"
+          },
+          children: pageDetails[index]
+        }
+      )
+    ] });
+  };
+  return Comp;
+};
+const getOptions = (args) => {
+  const { pageCount, pageIndex, pageDetails, pageInfoWidth } = args;
+  const amountOfPages = typeof pageCount === "string" ? pageIndex + 1 : pageCount;
+  const options = new Array(amountOfPages).fill(0).map((_, index) => {
+    const option = {
+      dsId: (index + 1).toString(),
+      label: (index + 1).toString(),
+      value: index + 1,
+      type: "single"
+    };
+    if (pageDetails?.length) {
+      option.render = OptionWithDetails({ pageInfoWidth, pageIndex, index, pageDetails });
+    }
+    return option;
+  });
+  return options;
+};
+export {
+  getOptions
+};
+//# sourceMappingURL=getOptions.js.map

package/dist/esm/parts/DSPaginator/getOptions.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSPaginator/getOptions.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport type { DSDropdownMenuT } from '@elliemae/ds-dropdownmenu';\n\ninterface OptionWithDetailsT {\n  pageInfoWidth: number;\n  pageIndex: number;\n  index: number;\n  pageDetails: string[];\n}\n\nconst OptionWithDetails = (props: OptionWithDetailsT) => {\n  const Comp = () => {\n    const { pageInfoWidth, pageIndex, index, pageDetails } = props;\n    return (\n      <Grid cols={['16px', `${pageInfoWidth + 16}px`, 'auto']} gutter=\"xxs\" alignItems=\"center\">\n        {pageIndex - 1 === 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 Comp;\n};\n\nexport const getOptions = (args: {\n  pageCount: number | string;\n  pageIndex: number;\n  pageDetails: string[];\n  pageInfoWidth: number;\n}): DSDropdownMenuT.ItemSingleOptions[] => {\n  const { pageCount, pageIndex, pageDetails, pageInfoWidth } = args;\n\n  const amountOfPages = typeof pageCount === 'string' ? pageIndex + 1 : pageCount;\n\n  const options = new Array(amountOfPages).fill(0).map((_, index) => {\n    const option: DSDropdownMenuT.ItemSingleOptions = {\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 = OptionWithDetails({ pageInfoWidth, pageIndex, index, pageDetails });\n    }\n    return option;\n  });\n  return options;\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgBjB,SAC6B,KAD7B;AAfN,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAU1B,MAAM,oBAAoB,CAAC,UAA8B;AACvD,QAAM,OAAO,MAAM;AACjB,UAAM,EAAE,eAAe,WAAW,OAAO,YAAY,IAAI;AACzD,WACE,qBAAC,QAAK,MAAM,CAAC,QAAQ,GAAG,gBAAgB,QAAQ,MAAM,GAAG,QAAO,OAAM,YAAW,UAC9E;AAAA,kBAAY,MAAM,QAAQ,oBAAC,aAAU,MAAK,KAAI,OAAO,CAAC,iBAAiB,KAAK,GAAG,IAAK,oBAAC,SAAI;AAAA,MAC1F,oBAAC,UAAM,kBAAQ,GAAE;AAAA,MACjB;AAAA,QAAC;AAAA;AAAA,UACC,OAAO;AAAA,YACL,YAAY;AAAA,YACZ,cAAc;AAAA,YACd,UAAU;AAAA,UACZ;AAAA,UAEC,sBAAY,KAAK;AAAA;AAAA,MACpB;AAAA,OACF;AAAA,EAEJ;AACA,SAAO;AACT;AAEO,MAAM,aAAa,CAAC,SAKgB;AACzC,QAAM,EAAE,WAAW,WAAW,aAAa,cAAc,IAAI;AAE7D,QAAM,gBAAgB,OAAO,cAAc,WAAW,YAAY,IAAI;AAEtE,QAAM,UAAU,IAAI,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU;AACjE,UAAM,SAA4C;AAAA,MAChD,OAAO,QAAQ,GAAG,SAAS;AAAA,MAC3B,QAAQ,QAAQ,GAAG,SAAS;AAAA,MAC5B,OAAO,QAAQ;AAAA,MACf,MAAM;AAAA,IACR;AACA,QAAI,aAAa,QAAQ;AACvB,aAAO,SAAS,kBAAkB,EAAE,eAAe,WAAW,OAAO,YAAY,CAAC;AAAA,IACpF;AACA,WAAO;AAAA,EACT,CAAC;AACD,SAAO;AACT;",
+  "names": []
+}