@okta/odyssey-react-mui 1.37.0 → 1.38.0

package/dist/cjs/EmptyState.cjs

@@ -36,6 +36,13 @@ const EmptyContainer = (0, _styled.default)("div", {
   width: "100%",
   alignItems: "center"
 }));
+const TextContainer = (0, _styled.default)("div", {
+  shouldForwardProp: prop => prop !== "odysseyDesignTokens"
+})(({
+  odysseyDesignTokens
+}) => ({
+  maxWidth: odysseyDesignTokens.TypographyLineLengthMax
+}));
 const EmptyState = ({
   heading,
   description,
@@ -45,10 +52,13 @@ const EmptyState = ({
   const odysseyDesignTokens = (0, _OdysseyDesignTokensContext.useOdysseyDesignTokens)();
   return (0, _jsxRuntime.jsxs)(EmptyContainer, {
     odysseyDesignTokens: odysseyDesignTokens,
-    children: [(0, _jsxRuntime.jsx)(_Typography.Heading4, {
-      children: heading
-    }), (0, _jsxRuntime.jsx)(_Typography.Paragraph, {
-      children: description
+    children: [(0, _jsxRuntime.jsxs)(TextContainer, {
+      odysseyDesignTokens: odysseyDesignTokens,
+      children: [(0, _jsxRuntime.jsx)(_Typography.Heading4, {
+        children: heading
+      }), (0, _jsxRuntime.jsx)(_Typography.Paragraph, {
+        children: description
+      })]
     }), (PrimaryCallToActionComponent || SecondaryCallToActionComponent) && (0, _jsxRuntime.jsxs)(_Box.Box, {
       sx: {
         marginBlockStart: 5

package/dist/cjs/EmptyState.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.cjs","names":["_react","require","_Typography","_Box","_styled","_interopRequireDefault","_OdysseyDesignTokensContext","_jsxRuntime","e","__esModule","default","EmptyContainer","styled","shouldForwardProp","prop","odysseyDesignTokens","display","flexDirection","marginBlock","Spacing9","padding","Spacing5","textAlign","width","alignItems","EmptyState","heading","description","PrimaryCallToActionComponent","SecondaryCallToActionComponent","useOdysseyDesignTokens","jsxs","children","jsx","Heading4","Paragraph","Box","sx","marginBlockStart","MemoizedEmptyState","exports","DataTableEmptyState","memo","displayName"],"sources":["../../src/EmptyState.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ReactNode, memo } from \"react\";\nimport { Heading4, Paragraph } from \"./Typography.js\";\nimport { Box } from \"./Box.js\";\nimport styled from \"@emotion/styled\";\nimport {\n  useOdysseyDesignTokens,\n  DesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\n\nconst EmptyContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"flex\",\n  flexDirection: \"column\",\n  marginBlock: odysseyDesignTokens.Spacing9,\n  padding: odysseyDesignTokens.Spacing5,\n  textAlign: \"center\",\n  width: \"100%\",\n  alignItems: \"center\",\n}));\n\nexport type EmptyStateProps = {\n  /**\n   * Main heading of the empty state\n   */\n  heading: string;\n  /**\n   * A descriptive text explaining more context as to why we don't have data.\n   */\n  description: string;\n  /**\n   * Primary call to action\n   */\n  PrimaryCallToActionComponent?: ReactNode;\n  /**\n   * Secondary call to action\n   */\n  SecondaryCallToActionComponent?: ReactNode;\n};\n\nconst EmptyState = ({\n  heading,\n  description,\n  PrimaryCallToActionComponent,\n  SecondaryCallToActionComponent,\n}: EmptyStateProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  return (\n    <EmptyContainer odysseyDesignTokens={odysseyDesignTokens}>\n      <Heading4>{heading}</Heading4>\n      <Paragraph>{description}</Paragraph>\n      {(PrimaryCallToActionComponent || SecondaryCallToActionComponent) && (\n        <Box sx={{ marginBlockStart: 5 }}>\n          {SecondaryCallToActionComponent}\n          {PrimaryCallToActionComponent}\n        </Box>\n      )}\n    </EmptyContainer>\n  );\n};\n\nconst MemoizedEmptyState = memo(EmptyState);\nMemoizedEmptyState.displayName = \"EmptyState\";\n\nexport { MemoizedEmptyState as EmptyState };\nexport { MemoizedEmptyState as DataTableEmptyState };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,IAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,2BAAA,GAAAL,OAAA;AAGyC,IAAAM,WAAA,GAAAN,OAAA;AAAA,SAAAI,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAnBzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAWA,MAAMG,cAAc,GAAG,IAAAC,eAAM,EAAC,KAAK,EAAE;EACnCC,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEC,OAAO,EAAE,MAAM;EACfC,aAAa,EAAE,QAAQ;EACvBC,WAAW,EAAEH,mBAAmB,CAACI,QAAQ;EACzCC,OAAO,EAAEL,mBAAmB,CAACM,QAAQ;EACrCC,SAAS,EAAE,QAAQ;EACnBC,KAAK,EAAE,MAAM;EACbC,UAAU,EAAE;AACd,CAAC,CAAC,CAAC;AAqBH,MAAMC,UAAU,GAAGA,CAAC;EAClBC,OAAO;EACPC,WAAW;EACXC,4BAA4B;EAC5BC;AACe,CAAC,KAAK;EACrB,MAAMd,mBAAmB,GAAG,IAAAe,kDAAsB,EAAC,CAAC;EAEpD,OACE,IAAAvB,WAAA,CAAAwB,IAAA,EAACpB,cAAc;IAACI,mBAAmB,EAAEA,mBAAoB;IAAAiB,QAAA,GACvD,IAAAzB,WAAA,CAAA0B,GAAA,EAAC/B,WAAA,CAAAgC,QAAQ;MAAAF,QAAA,EAAEN;IAAO,CAAW,CAAC,EAC9B,IAAAnB,WAAA,CAAA0B,GAAA,EAAC/B,WAAA,CAAAiC,SAAS;MAAAH,QAAA,EAAEL;IAAW,CAAY,CAAC,EACnC,CAACC,4BAA4B,IAAIC,8BAA8B,KAC9D,IAAAtB,WAAA,CAAAwB,IAAA,EAAC5B,IAAA,CAAAiC,GAAG;MAACC,EAAE,EAAE;QAAEC,gBAAgB,EAAE;MAAE,CAAE;MAAAN,QAAA,GAC9BH,8BAA8B,EAC9BD,4BAA4B;IAAA,CAC1B,CACN;EAAA,CACa,CAAC;AAErB,CAAC;AAED,MAAMW,kBAAkB,GAAAC,OAAA,CAAAC,mBAAA,GAAAD,OAAA,CAAAf,UAAA,GAAG,IAAAiB,WAAI,EAACjB,UAAU,CAAC;AAC3Cc,kBAAkB,CAACI,WAAW,GAAG,YAAY","ignoreList":[]}
+{"version":3,"file":"EmptyState.cjs","names":["_react","require","_Typography","_Box","_styled","_interopRequireDefault","_OdysseyDesignTokensContext","_jsxRuntime","e","__esModule","default","EmptyContainer","styled","shouldForwardProp","prop","odysseyDesignTokens","display","flexDirection","marginBlock","Spacing9","padding","Spacing5","textAlign","width","alignItems","TextContainer","maxWidth","TypographyLineLengthMax","EmptyState","heading","description","PrimaryCallToActionComponent","SecondaryCallToActionComponent","useOdysseyDesignTokens","jsxs","children","jsx","Heading4","Paragraph","Box","sx","marginBlockStart","MemoizedEmptyState","exports","DataTableEmptyState","memo","displayName"],"sources":["../../src/EmptyState.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ReactNode, memo } from \"react\";\nimport { Heading4, Paragraph } from \"./Typography.js\";\nimport { Box } from \"./Box.js\";\nimport styled from \"@emotion/styled\";\nimport {\n  useOdysseyDesignTokens,\n  DesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\n\nconst EmptyContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"flex\",\n  flexDirection: \"column\",\n  marginBlock: odysseyDesignTokens.Spacing9,\n  padding: odysseyDesignTokens.Spacing5,\n  textAlign: \"center\",\n  width: \"100%\",\n  alignItems: \"center\",\n}));\n\nconst TextContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n}));\n\nexport type EmptyStateProps = {\n  /**\n   * Main heading of the empty state\n   */\n  heading: string;\n  /**\n   * A descriptive text explaining more context as to why we don't have data.\n   */\n  description: string;\n  /**\n   * Primary call to action\n   */\n  PrimaryCallToActionComponent?: ReactNode;\n  /**\n   * Secondary call to action\n   */\n  SecondaryCallToActionComponent?: ReactNode;\n};\n\nconst EmptyState = ({\n  heading,\n  description,\n  PrimaryCallToActionComponent,\n  SecondaryCallToActionComponent,\n}: EmptyStateProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  return (\n    <EmptyContainer odysseyDesignTokens={odysseyDesignTokens}>\n      <TextContainer odysseyDesignTokens={odysseyDesignTokens}>\n        <Heading4>{heading}</Heading4>\n        <Paragraph>{description}</Paragraph>\n      </TextContainer>\n      {(PrimaryCallToActionComponent || SecondaryCallToActionComponent) && (\n        <Box sx={{ marginBlockStart: 5 }}>\n          {SecondaryCallToActionComponent}\n          {PrimaryCallToActionComponent}\n        </Box>\n      )}\n    </EmptyContainer>\n  );\n};\n\nconst MemoizedEmptyState = memo(EmptyState);\nMemoizedEmptyState.displayName = \"EmptyState\";\n\nexport { MemoizedEmptyState as EmptyState };\nexport { MemoizedEmptyState as DataTableEmptyState };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,IAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,2BAAA,GAAAL,OAAA;AAGyC,IAAAM,WAAA,GAAAN,OAAA;AAAA,SAAAI,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAnBzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAWA,MAAMG,cAAc,GAAG,IAAAC,eAAM,EAAC,KAAK,EAAE;EACnCC,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEC,OAAO,EAAE,MAAM;EACfC,aAAa,EAAE,QAAQ;EACvBC,WAAW,EAAEH,mBAAmB,CAACI,QAAQ;EACzCC,OAAO,EAAEL,mBAAmB,CAACM,QAAQ;EACrCC,SAAS,EAAE,QAAQ;EACnBC,KAAK,EAAE,MAAM;EACbC,UAAU,EAAE;AACd,CAAC,CAAC,CAAC;AAEH,MAAMC,aAAa,GAAG,IAAAb,eAAM,EAAC,KAAK,EAAE;EAClCC,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEW,QAAQ,EAAEX,mBAAmB,CAACY;AAChC,CAAC,CAAC,CAAC;AAqBH,MAAMC,UAAU,GAAGA,CAAC;EAClBC,OAAO;EACPC,WAAW;EACXC,4BAA4B;EAC5BC;AACe,CAAC,KAAK;EACrB,MAAMjB,mBAAmB,GAAG,IAAAkB,kDAAsB,EAAC,CAAC;EAEpD,OACE,IAAA1B,WAAA,CAAA2B,IAAA,EAACvB,cAAc;IAACI,mBAAmB,EAAEA,mBAAoB;IAAAoB,QAAA,GACvD,IAAA5B,WAAA,CAAA2B,IAAA,EAACT,aAAa;MAACV,mBAAmB,EAAEA,mBAAoB;MAAAoB,QAAA,GACtD,IAAA5B,WAAA,CAAA6B,GAAA,EAAClC,WAAA,CAAAmC,QAAQ;QAAAF,QAAA,EAAEN;MAAO,CAAW,CAAC,EAC9B,IAAAtB,WAAA,CAAA6B,GAAA,EAAClC,WAAA,CAAAoC,SAAS;QAAAH,QAAA,EAAEL;MAAW,CAAY,CAAC;IAAA,CACvB,CAAC,EACf,CAACC,4BAA4B,IAAIC,8BAA8B,KAC9D,IAAAzB,WAAA,CAAA2B,IAAA,EAAC/B,IAAA,CAAAoC,GAAG;MAACC,EAAE,EAAE;QAAEC,gBAAgB,EAAE;MAAE,CAAE;MAAAN,QAAA,GAC9BH,8BAA8B,EAC9BD,4BAA4B;IAAA,CAC1B,CACN;EAAA,CACa,CAAC;AAErB,CAAC;AAED,MAAMW,kBAAkB,GAAAC,OAAA,CAAAC,mBAAA,GAAAD,OAAA,CAAAf,UAAA,GAAG,IAAAiB,WAAI,EAACjB,UAAU,CAAC;AAC3Cc,kBAAkB,CAACI,WAAW,GAAG,YAAY","ignoreList":[]}

package/dist/cjs/Pagination/Pagination.cjs

@@ -14,6 +14,7 @@ var _index2 = require("../icons.generated/index.cjs");
 var _OdysseyDesignTokensContext = require("../OdysseyDesignTokensContext.cjs");
 var _usePagination = require("./usePagination.cjs");
 var _Typography = require("../Typography.cjs");
+require("../i18n.cjs");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*!

package/dist/cjs/Pagination/Pagination.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.cjs","names":["_styled","_interopRequireDefault","require","_react","_reactI18next","_Box","_index","_index2","_OdysseyDesignTokensContext","_usePagination","_Typography","_jsxRuntime","e","__esModule","default","PaginationContainer","styled","display","justifyContent","PaginationSegment","shouldForwardProp","prop","odysseyDesignTokens","alignItems","gap","Spacing4","Spacing2","PaginationInput","_InputBase2","borderColor","HueNeutral200","borderRadius","BorderRadiusTight","height","Spacing6","width","HueNeutral400","PalettePrimaryMain","PaginationButtonContainer","marginInlineStart","Pagination","currentPageLabel","currentPageLabelProp","currentRowsCount","hasPageInput","hasRowCountInput","hasRowCountLabel","isDisabled","isMoreDisabled","lastRow","loadMoreLabel","loadMoreLabelProp","maxPageIndex","maxPageSize","nextLabel","nextLabelProp","onPaginationChange","onPaginationChangeProp","pageIndex","pageSize","previousLabel","previousLabelProp","rowsPerPageLabel","rowsPerPageLabelProp","totalRows","variant","useOdysseyDesignTokens","t","useTranslation","page","setPage","useState","rowsPerPage","setRowsPerPage","initialRowsPerPage","useRef","useEffect","useCallback","totalRowsLabel","usePagination","handlePaginationChange","updatedPage","updatedRowsPerPage","Math","ceil","handlePageSubmit","event","key","parseInt","currentTarget","value","handleRowsPerPageSubmit","setPageFromEvent","min","target","setRowsPerPageFromEvent","max","handleLoadMore","current","handleNextButton","handlePreviousButton","loadMoreIsDisabled","useMemo","nextButtonDisabled","previousButtonDisabled","rowsPerPageInputProps","currentPageInputProps","jsxs","children","Box","jsx","Paragraph","component","color","type","onChange","onBlur","onKeyDown","disabled","inputProps","Button","startIcon","ArrowLeftIcon","size","ariaLabel","onClick","endIcon","ArrowRightIcon","label","MemoizedPagination","exports","memo","displayName"],"sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { InputBase } from \"@mui/material\";\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Box } from \"../Box.js\";\nimport { Button } from \"../Buttons/index.js\";\nimport { paginationTypeValues } from \"./constants.js\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../icons.generated/index.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { usePagination } from \"./usePagination.js\";\nimport { Paragraph } from \"../Typography.js\";\n\nconst PaginationContainer = styled(\"nav\")({\n  display: \"flex\",\n  justifyContent: \"space-between\",\n});\n\nconst PaginationSegment = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: odysseyDesignTokens.Spacing4,\n  \"& > div\": {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: odysseyDesignTokens.Spacing2,\n  },\n}));\n\nconst PaginationInput = styled(InputBase, {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  borderColor: odysseyDesignTokens.HueNeutral200,\n  borderRadius: odysseyDesignTokens.BorderRadiusTight,\n  height: odysseyDesignTokens.Spacing6,\n  width: \"4.5714285714rem\", // This is a hardcoded value, keep as string\n  \"&:hover\": {\n    borderColor: odysseyDesignTokens.HueNeutral400,\n  },\n  \"&.Mui-focused:hover\": {\n    borderColor: odysseyDesignTokens.PalettePrimaryMain,\n  },\n}));\n\nconst PaginationButtonContainer = styled(\"div\")({\n  \"& > *\": {\n    marginInlineStart: `0 !important`,\n  },\n});\n\nexport type PaginationProps = {\n  /**\n   * The labeled rendered for the current page index\n   */\n  currentPageLabel?: string;\n  /**\n   * The number of items currently visible on the page\n   */\n  currentRowsCount?: number;\n  /**\n   * If true, the page input will be visible and the user can directly manipulate which page\n   * is visible.\n   */\n  hasPageInput?: boolean;\n  /**\n   * If true, the row count input will be visible and the user can directly manipulate how many rows\n   * are visible.\n   */\n  hasRowCountInput?: boolean;\n  /**\n   * If true, the \"X - X of total X\" label will be visible\n   */\n  hasRowCountLabel?: boolean;\n  /**\n   * If true, the pagination controls will be disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * If true, the next or Show More button will be disabled\n   */\n  isMoreDisabled?: boolean;\n  /**\n   * The current page last row index\n   */\n  lastRow?: number;\n  /**\n   * If the pagination is of \"loadMore\" variant, then this is the the load more label\n   */\n  loadMoreLabel?: string;\n  /**\n   * The max page\n   */\n  maxPageIndex?: number;\n  /**\n   * The max rows per page\n   */\n  maxPageSize?: number;\n  /**\n   * The label for the next control\n   */\n  nextLabel?: string;\n  /**\n   * Page index and page size setter\n   */\n  onPaginationChange: ({\n    pageIndex,\n    pageSize,\n  }: {\n    pageIndex: number;\n    pageSize: number;\n  }) => void;\n  /**\n   * The current page index\n   */\n  pageIndex: number;\n  /**\n   * The current page size\n   */\n  pageSize: number;\n  /**\n   * The label for the previous control\n   */\n  previousLabel?: string;\n  /**\n   * The label that shows how many results are rendered per page\n   */\n  rowsPerPageLabel?: string;\n  /**\n   * Total rows count\n   */\n  totalRows?: number;\n  /**\n   * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n   * set to a simple \"Load more\" button by setting to \"loadMore\".\n   */\n  variant?: (typeof paginationTypeValues)[number];\n};\n\nconst Pagination = ({\n  currentPageLabel: currentPageLabelProp,\n  currentRowsCount,\n  hasPageInput = true,\n  hasRowCountInput = true,\n  hasRowCountLabel = true,\n  isDisabled,\n  isMoreDisabled,\n  lastRow,\n  loadMoreLabel: loadMoreLabelProp,\n  maxPageIndex,\n  maxPageSize,\n  nextLabel: nextLabelProp,\n  onPaginationChange: onPaginationChangeProp,\n  pageIndex,\n  pageSize,\n  previousLabel: previousLabelProp,\n  rowsPerPageLabel: rowsPerPageLabelProp,\n  totalRows,\n  variant,\n}: PaginationProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n  const { t } = useTranslation();\n\n  const [page, setPage] = useState<number>(pageIndex);\n  const [rowsPerPage, setRowsPerPage] = useState<number>(pageSize);\n  const initialRowsPerPage = useRef<number>(pageSize);\n\n  const currentPageLabel = currentPageLabelProp ?? t(\"pagination.page\");\n  const loadMoreLabel = loadMoreLabelProp ?? t(\"pagination.loadmore\");\n  const nextLabel = nextLabelProp ?? t(\"pagination.next\");\n  const previousLabel = previousLabelProp ?? t(\"pagination.previous\");\n  const rowsPerPageLabel = rowsPerPageLabelProp ?? t(\"pagination.rowsperpage\");\n\n  useEffect(() => {\n    setPage(pageIndex);\n    setRowsPerPage(pageSize);\n  }, [pageIndex, pageSize]);\n\n  const onPaginationChange = useCallback(\n    ({ pageIndex, pageSize }: { pageIndex: number; pageSize: number }) => {\n      onPaginationChangeProp({ pageIndex, pageSize });\n    },\n    [onPaginationChangeProp],\n  );\n\n  const { totalRowsLabel } = usePagination({\n    pageIndex,\n    pageSize,\n    currentRowsCount: currentRowsCount || 0,\n    totalRows,\n  });\n\n  const handlePaginationChange = useCallback(() => {\n    let updatedPage = page;\n    let updatedRowsPerPage = rowsPerPage;\n\n    if (totalRows) {\n      const maxPageIndex = Math.ceil(totalRows / updatedRowsPerPage);\n\n      // Ensure rowsPerPage does not exceed totalRows\n      if (updatedRowsPerPage > totalRows) {\n        updatedRowsPerPage = totalRows;\n      }\n\n      // Ensure page is within valid range\n      if (updatedPage > maxPageIndex) {\n        updatedPage = maxPageIndex;\n      } else if (updatedPage < 1) {\n        updatedPage = 1;\n      }\n    }\n\n    onPaginationChange({\n      pageIndex: updatedPage,\n      pageSize: updatedRowsPerPage,\n    });\n  }, [page, rowsPerPage, onPaginationChange, totalRows]);\n\n  // The following handlers use React.KeyboardEvent (rather than just KeyboardEvent) becuase React.KeyboardEvent\n  // is generic, while plain KeyboardEvent is not. We need this generic so we can specify the HTMLInputElement,\n  // which allows us to use currentTarget.value\n  const handlePageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: parseInt(event.currentTarget.value),\n          pageSize: rowsPerPage,\n        });\n      }\n    },\n    [rowsPerPage, onPaginationChange],\n  );\n\n  const handleRowsPerPageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: page,\n          pageSize: parseInt(event.currentTarget.value),\n        });\n      }\n    },\n    [page, onPaginationChange],\n  );\n\n  const setPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageIndex\n        ? Math.min(parseInt(event.target.value), maxPageIndex)\n        : parseInt(event.target.value);\n      setPage(value);\n    },\n    [setPage, maxPageIndex],\n  );\n\n  const setRowsPerPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageSize\n        ? Math.min(parseInt(event.target.value), maxPageSize)\n        : parseInt(event.target.value);\n\n      // Ensure the value can't be less than 1\n      setRowsPerPage(Math.max(1, value));\n    },\n    [setRowsPerPage, maxPageSize],\n  );\n\n  const handleLoadMore = useCallback(() => {\n    onPaginationChange({\n      pageIndex: 1,\n      pageSize: rowsPerPage + initialRowsPerPage.current,\n    });\n  }, [rowsPerPage, onPaginationChange]);\n\n  const handleNextButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page + 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const handlePreviousButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page - 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const loadMoreIsDisabled = useMemo(() => {\n    return isMoreDisabled || (totalRows ? rowsPerPage >= totalRows : false);\n  }, [isMoreDisabled, rowsPerPage, totalRows]);\n\n  const nextButtonDisabled = useMemo(\n    () =>\n      isMoreDisabled ||\n      (lastRow && (totalRows ? lastRow >= totalRows : false)) ||\n      isDisabled,\n    [isMoreDisabled, totalRows, lastRow, isDisabled],\n  );\n\n  const previousButtonDisabled = useMemo(\n    () => pageIndex <= 1 || isDisabled,\n    [pageIndex, isDisabled],\n  );\n\n  const rowsPerPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": rowsPerPageLabel,\n      max: maxPageSize || totalRows,\n    }),\n    [maxPageSize, rowsPerPageLabel, totalRows],\n  );\n\n  const currentPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": currentPageLabel,\n      max: maxPageIndex,\n    }),\n    [currentPageLabel, maxPageIndex],\n  );\n\n  return variant === \"paged\" ? (\n    <PaginationContainer aria-label={t(\"pagination.label\")}>\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {hasRowCountInput && (\n          <Box>\n            <Paragraph component=\"span\" color=\"textSecondary\">\n              {rowsPerPageLabel}\n            </Paragraph>\n            <PaginationInput\n              odysseyDesignTokens={odysseyDesignTokens}\n              type=\"number\"\n              value={rowsPerPage}\n              onChange={setRowsPerPageFromEvent}\n              onBlur={handlePaginationChange}\n              onKeyDown={handleRowsPerPageSubmit}\n              disabled={isDisabled}\n              inputProps={rowsPerPageInputProps}\n            />\n          </Box>\n        )}\n        {hasRowCountLabel && (\n          <Paragraph component=\"span\" color=\"textSecondary\">\n            {totalRowsLabel}\n          </Paragraph>\n        )}\n      </PaginationSegment>\n\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {totalRows && hasPageInput && (\n          <Box>\n            <Paragraph component=\"span\" color=\"textSecondary\">\n              {currentPageLabel}\n            </Paragraph>\n            <PaginationInput\n              odysseyDesignTokens={odysseyDesignTokens}\n              type=\"number\"\n              value={page}\n              onChange={setPageFromEvent}\n              onBlur={handlePaginationChange}\n              onKeyDown={handlePageSubmit}\n              disabled={isDisabled}\n              inputProps={currentPageInputProps}\n            />\n          </Box>\n        )}\n        <PaginationButtonContainer>\n          <Button\n            startIcon={<ArrowLeftIcon />}\n            variant=\"floating\"\n            size=\"small\"\n            ariaLabel={previousLabel}\n            onClick={handlePreviousButton}\n            isDisabled={previousButtonDisabled}\n          />\n          <Button\n            endIcon={<ArrowRightIcon />}\n            variant=\"floating\"\n            size=\"small\"\n            ariaLabel={nextLabel}\n            onClick={handleNextButton}\n            isDisabled={nextButtonDisabled}\n          />\n        </PaginationButtonContainer>\n      </PaginationSegment>\n    </PaginationContainer>\n  ) : (\n    <Button\n      variant=\"secondary\"\n      label={loadMoreLabel}\n      onClick={handleLoadMore}\n      isDisabled={loadMoreIsDisabled}\n    />\n  );\n};\n\nconst MemoizedPagination = memo(Pagination);\nMemoizedPagination.displayName = \"Pagination\";\n\nexport { MemoizedPagination as Pagination };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Pagination.cjs","names":["_styled","_interopRequireDefault","require","_react","_reactI18next","_Box","_index","_index2","_OdysseyDesignTokensContext","_usePagination","_Typography","_jsxRuntime","e","__esModule","default","PaginationContainer","styled","display","justifyContent","PaginationSegment","shouldForwardProp","prop","odysseyDesignTokens","alignItems","gap","Spacing4","Spacing2","PaginationInput","_InputBase2","borderColor","HueNeutral200","borderRadius","BorderRadiusTight","height","Spacing6","width","HueNeutral400","PalettePrimaryMain","PaginationButtonContainer","marginInlineStart","Pagination","currentPageLabel","currentPageLabelProp","currentRowsCount","hasPageInput","hasRowCountInput","hasRowCountLabel","isDisabled","isMoreDisabled","lastRow","loadMoreLabel","loadMoreLabelProp","maxPageIndex","maxPageSize","nextLabel","nextLabelProp","onPaginationChange","onPaginationChangeProp","pageIndex","pageSize","previousLabel","previousLabelProp","rowsPerPageLabel","rowsPerPageLabelProp","totalRows","variant","useOdysseyDesignTokens","t","useTranslation","page","setPage","useState","rowsPerPage","setRowsPerPage","initialRowsPerPage","useRef","useEffect","useCallback","totalRowsLabel","usePagination","handlePaginationChange","updatedPage","updatedRowsPerPage","Math","ceil","handlePageSubmit","event","key","parseInt","currentTarget","value","handleRowsPerPageSubmit","setPageFromEvent","min","target","setRowsPerPageFromEvent","max","handleLoadMore","current","handleNextButton","handlePreviousButton","loadMoreIsDisabled","useMemo","nextButtonDisabled","previousButtonDisabled","rowsPerPageInputProps","currentPageInputProps","jsxs","children","Box","jsx","Paragraph","component","color","type","onChange","onBlur","onKeyDown","disabled","inputProps","Button","startIcon","ArrowLeftIcon","size","ariaLabel","onClick","endIcon","ArrowRightIcon","label","MemoizedPagination","exports","memo","displayName"],"sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { InputBase } from \"@mui/material\";\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Box } from \"../Box.js\";\nimport { Button } from \"../Buttons/index.js\";\nimport { paginationTypeValues } from \"./constants.js\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../icons.generated/index.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { usePagination } from \"./usePagination.js\";\nimport { Paragraph } from \"../Typography.js\";\nimport \"../i18n.js\";\n\nconst PaginationContainer = styled(\"nav\")({\n  display: \"flex\",\n  justifyContent: \"space-between\",\n});\n\nconst PaginationSegment = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: odysseyDesignTokens.Spacing4,\n  \"& > div\": {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: odysseyDesignTokens.Spacing2,\n  },\n}));\n\nconst PaginationInput = styled(InputBase, {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  borderColor: odysseyDesignTokens.HueNeutral200,\n  borderRadius: odysseyDesignTokens.BorderRadiusTight,\n  height: odysseyDesignTokens.Spacing6,\n  width: \"4.5714285714rem\", // This is a hardcoded value, keep as string\n  \"&:hover\": {\n    borderColor: odysseyDesignTokens.HueNeutral400,\n  },\n  \"&.Mui-focused:hover\": {\n    borderColor: odysseyDesignTokens.PalettePrimaryMain,\n  },\n}));\n\nconst PaginationButtonContainer = styled(\"div\")({\n  \"& > *\": {\n    marginInlineStart: `0 !important`,\n  },\n});\n\nexport type PaginationProps = {\n  /**\n   * The labeled rendered for the current page index\n   */\n  currentPageLabel?: string;\n  /**\n   * The number of items currently visible on the page\n   */\n  currentRowsCount?: number;\n  /**\n   * If true, the page input will be visible and the user can directly manipulate which page\n   * is visible.\n   */\n  hasPageInput?: boolean;\n  /**\n   * If true, the row count input will be visible and the user can directly manipulate how many rows\n   * are visible.\n   */\n  hasRowCountInput?: boolean;\n  /**\n   * If true, the \"X - X of total X\" label will be visible\n   */\n  hasRowCountLabel?: boolean;\n  /**\n   * If true, the pagination controls will be disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * If true, the next or Show More button will be disabled\n   */\n  isMoreDisabled?: boolean;\n  /**\n   * The current page last row index\n   */\n  lastRow?: number;\n  /**\n   * If the pagination is of \"loadMore\" variant, then this is the the load more label\n   */\n  loadMoreLabel?: string;\n  /**\n   * The max page\n   */\n  maxPageIndex?: number;\n  /**\n   * The max rows per page\n   */\n  maxPageSize?: number;\n  /**\n   * The label for the next control\n   */\n  nextLabel?: string;\n  /**\n   * Page index and page size setter\n   */\n  onPaginationChange: ({\n    pageIndex,\n    pageSize,\n  }: {\n    pageIndex: number;\n    pageSize: number;\n  }) => void;\n  /**\n   * The current page index\n   */\n  pageIndex: number;\n  /**\n   * The current page size\n   */\n  pageSize: number;\n  /**\n   * The label for the previous control\n   */\n  previousLabel?: string;\n  /**\n   * The label that shows how many results are rendered per page\n   */\n  rowsPerPageLabel?: string;\n  /**\n   * Total rows count\n   */\n  totalRows?: number;\n  /**\n   * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n   * set to a simple \"Load more\" button by setting to \"loadMore\".\n   */\n  variant?: (typeof paginationTypeValues)[number];\n};\n\nconst Pagination = ({\n  currentPageLabel: currentPageLabelProp,\n  currentRowsCount,\n  hasPageInput = true,\n  hasRowCountInput = true,\n  hasRowCountLabel = true,\n  isDisabled,\n  isMoreDisabled,\n  lastRow,\n  loadMoreLabel: loadMoreLabelProp,\n  maxPageIndex,\n  maxPageSize,\n  nextLabel: nextLabelProp,\n  onPaginationChange: onPaginationChangeProp,\n  pageIndex,\n  pageSize,\n  previousLabel: previousLabelProp,\n  rowsPerPageLabel: rowsPerPageLabelProp,\n  totalRows,\n  variant,\n}: PaginationProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n  const { t } = useTranslation();\n\n  const [page, setPage] = useState<number>(pageIndex);\n  const [rowsPerPage, setRowsPerPage] = useState<number>(pageSize);\n  const initialRowsPerPage = useRef<number>(pageSize);\n\n  const currentPageLabel = currentPageLabelProp ?? t(\"pagination.page\");\n  const loadMoreLabel = loadMoreLabelProp ?? t(\"pagination.loadmore\");\n  const nextLabel = nextLabelProp ?? t(\"pagination.next\");\n  const previousLabel = previousLabelProp ?? t(\"pagination.previous\");\n  const rowsPerPageLabel = rowsPerPageLabelProp ?? t(\"pagination.rowsperpage\");\n\n  useEffect(() => {\n    setPage(pageIndex);\n    setRowsPerPage(pageSize);\n  }, [pageIndex, pageSize]);\n\n  const onPaginationChange = useCallback(\n    ({ pageIndex, pageSize }: { pageIndex: number; pageSize: number }) => {\n      onPaginationChangeProp({ pageIndex, pageSize });\n    },\n    [onPaginationChangeProp],\n  );\n\n  const { totalRowsLabel } = usePagination({\n    pageIndex,\n    pageSize,\n    currentRowsCount: currentRowsCount || 0,\n    totalRows,\n  });\n\n  const handlePaginationChange = useCallback(() => {\n    let updatedPage = page;\n    let updatedRowsPerPage = rowsPerPage;\n\n    if (totalRows) {\n      const maxPageIndex = Math.ceil(totalRows / updatedRowsPerPage);\n\n      // Ensure rowsPerPage does not exceed totalRows\n      if (updatedRowsPerPage > totalRows) {\n        updatedRowsPerPage = totalRows;\n      }\n\n      // Ensure page is within valid range\n      if (updatedPage > maxPageIndex) {\n        updatedPage = maxPageIndex;\n      } else if (updatedPage < 1) {\n        updatedPage = 1;\n      }\n    }\n\n    onPaginationChange({\n      pageIndex: updatedPage,\n      pageSize: updatedRowsPerPage,\n    });\n  }, [page, rowsPerPage, onPaginationChange, totalRows]);\n\n  // The following handlers use React.KeyboardEvent (rather than just KeyboardEvent) becuase React.KeyboardEvent\n  // is generic, while plain KeyboardEvent is not. We need this generic so we can specify the HTMLInputElement,\n  // which allows us to use currentTarget.value\n  const handlePageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: parseInt(event.currentTarget.value),\n          pageSize: rowsPerPage,\n        });\n      }\n    },\n    [rowsPerPage, onPaginationChange],\n  );\n\n  const handleRowsPerPageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: page,\n          pageSize: parseInt(event.currentTarget.value),\n        });\n      }\n    },\n    [page, onPaginationChange],\n  );\n\n  const setPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageIndex\n        ? Math.min(parseInt(event.target.value), maxPageIndex)\n        : parseInt(event.target.value);\n      setPage(value);\n    },\n    [setPage, maxPageIndex],\n  );\n\n  const setRowsPerPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageSize\n        ? Math.min(parseInt(event.target.value), maxPageSize)\n        : parseInt(event.target.value);\n\n      // Ensure the value can't be less than 1\n      setRowsPerPage(Math.max(1, value));\n    },\n    [setRowsPerPage, maxPageSize],\n  );\n\n  const handleLoadMore = useCallback(() => {\n    onPaginationChange({\n      pageIndex: 1,\n      pageSize: rowsPerPage + initialRowsPerPage.current,\n    });\n  }, [rowsPerPage, onPaginationChange]);\n\n  const handleNextButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page + 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const handlePreviousButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page - 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const loadMoreIsDisabled = useMemo(() => {\n    return isMoreDisabled || (totalRows ? rowsPerPage >= totalRows : false);\n  }, [isMoreDisabled, rowsPerPage, totalRows]);\n\n  const nextButtonDisabled = useMemo(\n    () =>\n      isMoreDisabled ||\n      (lastRow && (totalRows ? lastRow >= totalRows : false)) ||\n      isDisabled,\n    [isMoreDisabled, totalRows, lastRow, isDisabled],\n  );\n\n  const previousButtonDisabled = useMemo(\n    () => pageIndex <= 1 || isDisabled,\n    [pageIndex, isDisabled],\n  );\n\n  const rowsPerPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": rowsPerPageLabel,\n      max: maxPageSize || totalRows,\n    }),\n    [maxPageSize, rowsPerPageLabel, totalRows],\n  );\n\n  const currentPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": currentPageLabel,\n      max: maxPageIndex,\n    }),\n    [currentPageLabel, maxPageIndex],\n  );\n\n  return variant === \"paged\" ? (\n    <PaginationContainer aria-label={t(\"pagination.label\")}>\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {hasRowCountInput && (\n          <Box>\n            <Paragraph component=\"span\" color=\"textSecondary\">\n              {rowsPerPageLabel}\n            </Paragraph>\n            <PaginationInput\n              odysseyDesignTokens={odysseyDesignTokens}\n              type=\"number\"\n              value={rowsPerPage}\n              onChange={setRowsPerPageFromEvent}\n              onBlur={handlePaginationChange}\n              onKeyDown={handleRowsPerPageSubmit}\n              disabled={isDisabled}\n              inputProps={rowsPerPageInputProps}\n            />\n          </Box>\n        )}\n        {hasRowCountLabel && (\n          <Paragraph component=\"span\" color=\"textSecondary\">\n            {totalRowsLabel}\n          </Paragraph>\n        )}\n      </PaginationSegment>\n\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {totalRows && hasPageInput && (\n          <Box>\n            <Paragraph component=\"span\" color=\"textSecondary\">\n              {currentPageLabel}\n            </Paragraph>\n            <PaginationInput\n              odysseyDesignTokens={odysseyDesignTokens}\n              type=\"number\"\n              value={page}\n              onChange={setPageFromEvent}\n              onBlur={handlePaginationChange}\n              onKeyDown={handlePageSubmit}\n              disabled={isDisabled}\n              inputProps={currentPageInputProps}\n            />\n          </Box>\n        )}\n        <PaginationButtonContainer>\n          <Button\n            startIcon={<ArrowLeftIcon />}\n            variant=\"floating\"\n            size=\"small\"\n            ariaLabel={previousLabel}\n            onClick={handlePreviousButton}\n            isDisabled={previousButtonDisabled}\n          />\n          <Button\n            endIcon={<ArrowRightIcon />}\n            variant=\"floating\"\n            size=\"small\"\n            ariaLabel={nextLabel}\n            onClick={handleNextButton}\n            isDisabled={nextButtonDisabled}\n          />\n        </PaginationButtonContainer>\n      </PaginationSegment>\n    </PaginationContainer>\n  ) : (\n    <Button\n      variant=\"secondary\"\n      label={loadMoreLabel}\n      onClick={handleLoadMore}\n      isDisabled={loadMoreIsDisabled}\n    />\n  );\n};\n\nconst MemoizedPagination = memo(Pagination);\nMemoizedPagination.displayName = \"Pagination\";\n\nexport { MemoizedPagination as Pagination };\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/addSpecificity.cjs

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addSpecificity = void 0;
+/*!
+ * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */const addSpecificity = (specificityCount, selector) => {
+  const ampersands = "&".repeat(specificityCount);
+  return `${ampersands}${selector}`;
+};
+exports.addSpecificity = addSpecificity;
+//# sourceMappingURL=addSpecificity.cjs.map

package/dist/cjs/addSpecificity.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"addSpecificity.cjs","names":["addSpecificity","specificityCount","selector","ampersands","repeat","exports"],"sources":["../../src/addSpecificity.ts"],"sourcesContent":["/*!\n * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\n/**\n * Adds CSS specificity to class selectors by prepending a specified number of ampersands.\n * This function helps override MUI component styles by increasing selector specificity.\n *\n * @param {number} specificityCount - Number of ampersands to prepend (e.g., 2 results in \"&&\")\n * @param {string} selector - The selector string to add specificity to.\n *                            Include spaces in the selector if needed for descendant selectors.\n * @returns {string} The selector with added specificity\n *\n * @example\n * // Direct selector: \"&&.MuiButton-root\"\n * addSpecificity(2, \".MuiButton-root\")\n *\n * // Descendant selector: \"&& .MuiButton-root\"\n * addSpecificity(2, \" .MuiButton-root\")\n *\n * // Direct selector with class reference:\n * addSpecificity(2, `.${buttonClasses.root}`)\n *\n * // Descendant selector with class reference:\n * addSpecificity(2, ` .${buttonClasses.root}`)\n *\n * // Combined selector: \"&&.MuiButton-root:hover\"\n * addSpecificity(2, \".MuiButton-root:hover\")\n */\nexport const addSpecificity = (\n  specificityCount: number,\n  selector: string,\n): string => {\n  const ampersands = \"&\".repeat(specificityCount);\n  return `${ampersands}${selector}`;\n};\n"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GA2BO,MAAMA,cAAc,GAAGA,CAC5BC,gBAAwB,EACxBC,QAAgB,KACL;EACX,MAAMC,UAAU,GAAG,GAAG,CAACC,MAAM,CAACH,gBAAgB,CAAC;EAC/C,OAAO,GAAGE,UAAU,GAAGD,QAAQ,EAAE;AACnC,CAAC;AAACG,OAAA,CAAAL,cAAA,GAAAA,cAAA","ignoreList":[]}

package/dist/cjs/labs/DatePickers/DateTimePicker.cjs

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DateTimePicker = void 0;
+exports.DateTimePickerSize = exports.DateTimePicker = void 0;
 var _react = require("react");
 var _reactI18next = require("react-i18next");
 var _xDatePickers = require("@mui/x-date-pickers");
@@ -18,6 +18,7 @@ var _dateTimePickerTheme = require("./dateTimePickerTheme.cjs");
 var _index2 = require("../../icons.generated/index.cjs");
 var _OdysseyDesignTokensContext = require("../../OdysseyDesignTokensContext.cjs");
 var _OdysseyThemeProvider = require("../../OdysseyThemeProvider.cjs");
+var _index3 = require("../../theme/index.cjs");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*!
@@ -32,17 +33,18 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * See the License for the specific language governing permissions and limitations under the License.
  */
 
+const DateTimePickerSize = exports.DateTimePickerSize = {
+  maxWidth: `${(0, _index3.pxToRem)(486)}rem`
+};
 const DatePickerContainer = _styled.default.div({
   ".MuiFormControl-root": {
     marginBlockEnd: 0
   }
 });
-const DatePickerWidthContainer = _styled.default.div(({
-  odysseyDesignTokens
-}) => ({
+const DatePickerWidthContainer = _styled.default.div(() => ({
   ".MuiInput-root": {
     width: "100%",
-    maxWidth: odysseyDesignTokens.TypographyLineLengthMax
+    maxWidth: DateTimePickerSize.maxWidth
   }
 }));
 const TimeZonePickerContainer = (0, _styled.default)("div", {

package/dist/cjs/labs/DatePickers/DateTimePicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.cjs","names":["_react","require","_reactI18next","_xDatePickers","_styled","_interopRequireDefault","_index","_DateFieldActionBar","_DateFieldLocalizationProvider","_TimeZonePicker","_useOdysseyDateFields","_DateTimeField","_dateTimePickerTheme","_index2","_OdysseyDesignTokensContext","_OdysseyThemeProvider","_jsxRuntime","e","__esModule","default","DatePickerContainer","styled","div","marginBlockEnd","DatePickerWidthContainer","odysseyDesignTokens","width","maxWidth","TypographyLineLengthMax","TimeZonePickerContainer","shouldForwardProp","prop","marginBlockStart","Spacing3","DateTimePicker","defaultValue","defaultValueProp","errorMessage","hint","HintLinkComponent","isDateEnabled","isDisabled","isOptional","isReadOnly","isMonthEnabled","isYearEnabled","label","minDate","minDateProp","maxDate","maxDateProp","onBlur","onCalendarDateChange","onInputChange","onInputChangeProp","timeZone","timeZonePickerLabel","timeZoneOptions","value","valueProp","i18n","t","useTranslation","inputRef","useRef","useOdysseyDesignTokens","closeCalendar","commonIcons","defaultedLanguageCode","formatDateTimeToUtcIsoDateString","formatDayOfWeek","inputValues","internalTimeZone","isOpen","localeText","onTimeZoneChange","popperElement","setPopperElement","shouldDisableDate","shouldDisableMonth","shouldDisableYear","toggleCalendarVisibility","useOdysseyDateFields","language","containerRef","useEffect","current","formatDateTimeToJsDateStringOnCalendarSelection","useCallback","dateStringFromDateTime","renderDateTimeField","jsx","DateTimeField","endAdornment","Button","ariaLabel","onClick","size","startIcon","CalendarIcon","variant","onChange","timezone","slots","useMemo","actionBar","DateFieldActionBar","field","muiProps","leftArrowIcon","ArrowLeftIcon","rightArrowIcon","ArrowRightIcon","switchViewIcon","ChevronDownIcon","slotProps","wrapperVariant","onAccept","onCancel","actions","popper","anchorEl","tabs","dateIcon","timeIcon","ClockIcon","toolbar","toolbarPlaceholder","OdysseyThemeProvider","themeOverride","dateTimePickerTheme","children","jsxs","DateFieldLocalizationProvider","ref","dayOfWeekFormatter","disabled","fixedWeekNumber","onClose","open","readOnly","TimeZonePicker","MemoizedDateTimePicker","exports","memo","displayName"],"sources":["../../../../src/labs/DatePickers/DateTimePicker.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n  type DateTimePickerSlots,\n  DateTimePicker as MuiDateTimePicker,\n  DateTimePickerProps as MuiDateTimePickerProps,\n  DateTimePickerSlotProps,\n} from \"@mui/x-date-pickers\";\nimport { DateTime } from \"luxon\";\nimport styled from \"@emotion/styled\";\n\nimport { Button } from \"../../Buttons/index.js\";\nimport { DateFieldActionBar } from \"../../DatePickers/DateFieldActionBar.js\";\nimport { DateFieldLocalizationProvider } from \"../../DatePickers/DateFieldLocalizationProvider.js\";\nimport { TimeZonePicker } from \"../../DatePickers/TimeZonePicker.js\";\nimport {\n  useOdysseyDateFields,\n  OdysseyDateFieldProps,\n} from \"../../DatePickers/useOdysseyDateFields.js\";\nimport { DateTimeField, DateTimeFieldProps } from \"./DateTimeField.js\";\nimport { dateTimePickerTheme } from \"./dateTimePickerTheme.js\";\nimport { FieldComponentProps } from \"../../FieldComponentProps.js\";\nimport { CalendarIcon, ClockIcon } from \"../../icons.generated/index.js\";\nimport {\n  useOdysseyDesignTokens,\n  DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { OdysseyThemeProvider } from \"../../OdysseyThemeProvider.js\";\n\nconst DatePickerContainer = styled.div({\n  \".MuiFormControl-root\": {\n    marginBlockEnd: 0,\n  },\n});\n\nconst DatePickerWidthContainer = styled.div<{\n  odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n  \".MuiInput-root\": {\n    width: \"100%\",\n    maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n  },\n}));\n\nconst TimeZonePickerContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  marginBlockStart: odysseyDesignTokens.Spacing3,\n}));\n\ntype RenderDateTimeFieldProps = {\n  defaultValue: DateTimeFieldProps[\"defaultValue\"];\n  value: DateTimeFieldProps[\"value\"];\n} & MuiDateTimePickerProps<DateTime>;\n\nexport type DateTimePickerProps = OdysseyDateFieldProps &\n  Pick<\n    FieldComponentProps,\n    | \"errorMessage\"\n    | \"hint\"\n    | \"HintLinkComponent\"\n    | \"isDisabled\"\n    | \"isReadOnly\"\n    | \"isOptional\"\n  >;\n\nconst DateTimePicker = ({\n  defaultValue: defaultValueProp,\n  errorMessage,\n  hint,\n  HintLinkComponent,\n  isDateEnabled = () => true,\n  isDisabled,\n  isOptional,\n  isReadOnly,\n  isMonthEnabled = () => true,\n  isYearEnabled = () => true,\n  label,\n  minDate: minDateProp,\n  maxDate: maxDateProp,\n  onBlur,\n  onCalendarDateChange,\n  onInputChange: onInputChangeProp,\n  timeZone,\n  timeZonePickerLabel,\n  timeZoneOptions,\n  value: valueProp,\n}: DateTimePickerProps) => {\n  const { i18n, t } = useTranslation();\n  const inputRef = useRef<HTMLInputElement>(null);\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const {\n    closeCalendar,\n    commonIcons,\n    defaultedLanguageCode,\n    formatDateTimeToUtcIsoDateString,\n    formatDayOfWeek,\n    inputValues,\n    internalTimeZone,\n    isOpen,\n    localeText,\n    minDate,\n    maxDate,\n    onInputChange,\n    onTimeZoneChange,\n    popperElement,\n    setPopperElement,\n    shouldDisableDate,\n    shouldDisableMonth,\n    shouldDisableYear,\n    toggleCalendarVisibility,\n  } = useOdysseyDateFields({\n    defaultValue: defaultValueProp,\n    errorMessage,\n    isDateEnabled,\n    isMonthEnabled,\n    isYearEnabled,\n    minDate: minDateProp,\n    maxDate: maxDateProp,\n    onInputChange: onInputChangeProp,\n    timeZone,\n    value: valueProp,\n  });\n\n  const { language } = i18n;\n  const containerRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    setPopperElement(containerRef.current);\n  }, [setPopperElement]);\n\n  const formatDateTimeToJsDateStringOnCalendarSelection = useCallback<\n    NonNullable<MuiDateTimePickerProps<DateTime>[\"onChange\"]>\n  >(\n    (value) => {\n      if (value) {\n        const dateStringFromDateTime = formatDateTimeToUtcIsoDateString(value);\n\n        if (dateStringFromDateTime) {\n          onCalendarDateChange?.({\n            value: dateStringFromDateTime,\n            timeZone: internalTimeZone,\n          });\n        }\n      }\n    },\n    [formatDateTimeToUtcIsoDateString, internalTimeZone, onCalendarDateChange],\n  );\n\n  const renderDateTimeField = useCallback(\n    ({ defaultValue, inputRef, value }: RenderDateTimeFieldProps) => {\n      return (\n        <DateTimeField\n          defaultValue={defaultValue}\n          endAdornment={\n            <Button\n              ariaLabel={t(\"picker.labels.date.choose\")}\n              label=\"\"\n              onClick={toggleCalendarVisibility}\n              size=\"small\"\n              startIcon={<commonIcons.CalendarIcon />}\n              variant=\"floating\"\n            />\n          }\n          errorMessage={errorMessage}\n          hint={hint}\n          HintLinkComponent={HintLinkComponent}\n          inputRef={inputRef}\n          isDisabled={isDisabled}\n          isOptional={isOptional}\n          isReadOnly={isReadOnly}\n          label={label}\n          onBlur={onBlur}\n          minDate={minDate}\n          maxDate={maxDate}\n          onChange={onInputChange}\n          timezone={internalTimeZone}\n          value={value}\n        />\n      );\n    },\n    [\n      commonIcons,\n      errorMessage,\n      hint,\n      HintLinkComponent,\n      internalTimeZone,\n      isDisabled,\n      isOptional,\n      isReadOnly,\n      label,\n      onBlur,\n      onInputChange,\n      minDate,\n      maxDate,\n      t,\n      toggleCalendarVisibility,\n    ],\n  );\n\n  const slots = useMemo<DateTimePickerSlots<DateTime>>(\n    () => ({\n      actionBar: DateFieldActionBar,\n      field: (muiProps: RenderDateTimeFieldProps) =>\n        renderDateTimeField(muiProps),\n      leftArrowIcon: () => <commonIcons.ArrowLeftIcon />,\n      rightArrowIcon: () => <commonIcons.ArrowRightIcon />,\n      switchViewIcon: () => <commonIcons.ChevronDownIcon />,\n    }),\n    [commonIcons, renderDateTimeField],\n  );\n\n  const slotProps = useMemo<DateTimePickerSlotProps<DateTime, false>>(\n    () => ({\n      actionBar: ({ wrapperVariant, onAccept, onCancel }) => ({\n        actions:\n          // This is the default behavior but felt more clear to pass them in explicitly\n          wrapperVariant === \"desktop\" ? [] : [\"accept\", \"cancel\"],\n        onAccept,\n        onCancel,\n      }),\n      popper: {\n        anchorEl: popperElement,\n      },\n      tabs: {\n        dateIcon: <CalendarIcon />,\n        timeIcon: <ClockIcon />,\n      },\n      toolbar: {\n        toolbarPlaceholder: \"\",\n      },\n    }),\n    [popperElement],\n  );\n\n  return (\n    <OdysseyThemeProvider themeOverride={dateTimePickerTheme}>\n      <DateFieldLocalizationProvider\n        defaultedLanguageCode={defaultedLanguageCode}\n        localeText={localeText}\n      >\n        <DatePickerContainer>\n          <DatePickerWidthContainer\n            odysseyDesignTokens={odysseyDesignTokens}\n            ref={containerRef}\n          >\n            <MuiDateTimePicker\n              dayOfWeekFormatter={formatDayOfWeek}\n              defaultValue={inputValues?.defaultValue}\n              disabled={isDisabled}\n              fixedWeekNumber={6}\n              inputRef={inputRef}\n              key={language}\n              label={label}\n              minDate={minDate}\n              maxDate={maxDate}\n              onChange={formatDateTimeToJsDateStringOnCalendarSelection}\n              onClose={closeCalendar}\n              open={isOpen}\n              readOnly={isReadOnly}\n              shouldDisableDate={shouldDisableDate}\n              shouldDisableMonth={shouldDisableMonth}\n              shouldDisableYear={shouldDisableYear}\n              slots={slots}\n              slotProps={slotProps}\n              timezone={internalTimeZone}\n              value={inputValues?.value}\n            />\n          </DatePickerWidthContainer>\n        </DatePickerContainer>\n\n        {timeZoneOptions && timeZonePickerLabel && (\n          <TimeZonePickerContainer odysseyDesignTokens={odysseyDesignTokens}>\n            <TimeZonePicker\n              label={timeZonePickerLabel}\n              onTimeZoneChange={onTimeZoneChange}\n              isReadOnly={isReadOnly}\n              timeZoneOptions={timeZoneOptions}\n              value={internalTimeZone}\n            />\n          </TimeZonePickerContainer>\n        )}\n      </DateFieldLocalizationProvider>\n    </OdysseyThemeProvider>\n  );\n};\n\nconst MemoizedDateTimePicker = memo(DateTimePicker);\nMemoizedDateTimePicker.displayName = \"DateTimePicker\";\n\nexport { MemoizedDateTimePicker as DateTimePicker };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DateTimePicker.cjs","names":["_react","require","_reactI18next","_xDatePickers","_styled","_interopRequireDefault","_index","_DateFieldActionBar","_DateFieldLocalizationProvider","_TimeZonePicker","_useOdysseyDateFields","_DateTimeField","_dateTimePickerTheme","_index2","_OdysseyDesignTokensContext","_OdysseyThemeProvider","_index3","_jsxRuntime","e","__esModule","default","DateTimePickerSize","exports","maxWidth","pxToRem","DatePickerContainer","styled","div","marginBlockEnd","DatePickerWidthContainer","width","TimeZonePickerContainer","shouldForwardProp","prop","odysseyDesignTokens","marginBlockStart","Spacing3","DateTimePicker","defaultValue","defaultValueProp","errorMessage","hint","HintLinkComponent","isDateEnabled","isDisabled","isOptional","isReadOnly","isMonthEnabled","isYearEnabled","label","minDate","minDateProp","maxDate","maxDateProp","onBlur","onCalendarDateChange","onInputChange","onInputChangeProp","timeZone","timeZonePickerLabel","timeZoneOptions","value","valueProp","i18n","t","useTranslation","inputRef","useRef","useOdysseyDesignTokens","closeCalendar","commonIcons","defaultedLanguageCode","formatDateTimeToUtcIsoDateString","formatDayOfWeek","inputValues","internalTimeZone","isOpen","localeText","onTimeZoneChange","popperElement","setPopperElement","shouldDisableDate","shouldDisableMonth","shouldDisableYear","toggleCalendarVisibility","useOdysseyDateFields","language","containerRef","useEffect","current","formatDateTimeToJsDateStringOnCalendarSelection","useCallback","dateStringFromDateTime","renderDateTimeField","jsx","DateTimeField","endAdornment","Button","ariaLabel","onClick","size","startIcon","CalendarIcon","variant","onChange","timezone","slots","useMemo","actionBar","DateFieldActionBar","field","muiProps","leftArrowIcon","ArrowLeftIcon","rightArrowIcon","ArrowRightIcon","switchViewIcon","ChevronDownIcon","slotProps","wrapperVariant","onAccept","onCancel","actions","popper","anchorEl","tabs","dateIcon","timeIcon","ClockIcon","toolbar","toolbarPlaceholder","OdysseyThemeProvider","themeOverride","dateTimePickerTheme","children","jsxs","DateFieldLocalizationProvider","ref","dayOfWeekFormatter","disabled","fixedWeekNumber","onClose","open","readOnly","TimeZonePicker","MemoizedDateTimePicker","memo","displayName"],"sources":["../../../../src/labs/DatePickers/DateTimePicker.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n  type DateTimePickerSlots,\n  DateTimePicker as MuiDateTimePicker,\n  DateTimePickerProps as MuiDateTimePickerProps,\n  DateTimePickerSlotProps,\n} from \"@mui/x-date-pickers\";\nimport { DateTime } from \"luxon\";\nimport styled from \"@emotion/styled\";\n\nimport { Button } from \"../../Buttons/index.js\";\nimport { DateFieldActionBar } from \"../../DatePickers/DateFieldActionBar.js\";\nimport { DateFieldLocalizationProvider } from \"../../DatePickers/DateFieldLocalizationProvider.js\";\nimport { TimeZonePicker } from \"../../DatePickers/TimeZonePicker.js\";\nimport {\n  useOdysseyDateFields,\n  OdysseyDateFieldProps,\n} from \"../../DatePickers/useOdysseyDateFields.js\";\nimport { DateTimeField, DateTimeFieldProps } from \"./DateTimeField.js\";\nimport { dateTimePickerTheme } from \"./dateTimePickerTheme.js\";\nimport { FieldComponentProps } from \"../../FieldComponentProps.js\";\nimport { CalendarIcon, ClockIcon } from \"../../icons.generated/index.js\";\nimport {\n  useOdysseyDesignTokens,\n  DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { OdysseyThemeProvider } from \"../../OdysseyThemeProvider.js\";\nimport { pxToRem } from \"../../theme/index.js\";\n\nexport const DateTimePickerSize = {\n  maxWidth: `${pxToRem(486)}rem`,\n};\n\nconst DatePickerContainer = styled.div({\n  \".MuiFormControl-root\": {\n    marginBlockEnd: 0,\n  },\n});\n\nconst DatePickerWidthContainer = styled.div<{\n  odysseyDesignTokens: DesignTokens;\n}>(() => ({\n  \".MuiInput-root\": {\n    width: \"100%\",\n    maxWidth: DateTimePickerSize.maxWidth,\n  },\n}));\n\nconst TimeZonePickerContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  marginBlockStart: odysseyDesignTokens.Spacing3,\n}));\n\ntype RenderDateTimeFieldProps = {\n  defaultValue: DateTimeFieldProps[\"defaultValue\"];\n  value: DateTimeFieldProps[\"value\"];\n} & MuiDateTimePickerProps<DateTime>;\n\nexport type DateTimePickerProps = OdysseyDateFieldProps &\n  Pick<\n    FieldComponentProps,\n    | \"errorMessage\"\n    | \"hint\"\n    | \"HintLinkComponent\"\n    | \"isDisabled\"\n    | \"isReadOnly\"\n    | \"isOptional\"\n  >;\n\nconst DateTimePicker = ({\n  defaultValue: defaultValueProp,\n  errorMessage,\n  hint,\n  HintLinkComponent,\n  isDateEnabled = () => true,\n  isDisabled,\n  isOptional,\n  isReadOnly,\n  isMonthEnabled = () => true,\n  isYearEnabled = () => true,\n  label,\n  minDate: minDateProp,\n  maxDate: maxDateProp,\n  onBlur,\n  onCalendarDateChange,\n  onInputChange: onInputChangeProp,\n  timeZone,\n  timeZonePickerLabel,\n  timeZoneOptions,\n  value: valueProp,\n}: DateTimePickerProps) => {\n  const { i18n, t } = useTranslation();\n  const inputRef = useRef<HTMLInputElement>(null);\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const {\n    closeCalendar,\n    commonIcons,\n    defaultedLanguageCode,\n    formatDateTimeToUtcIsoDateString,\n    formatDayOfWeek,\n    inputValues,\n    internalTimeZone,\n    isOpen,\n    localeText,\n    minDate,\n    maxDate,\n    onInputChange,\n    onTimeZoneChange,\n    popperElement,\n    setPopperElement,\n    shouldDisableDate,\n    shouldDisableMonth,\n    shouldDisableYear,\n    toggleCalendarVisibility,\n  } = useOdysseyDateFields({\n    defaultValue: defaultValueProp,\n    errorMessage,\n    isDateEnabled,\n    isMonthEnabled,\n    isYearEnabled,\n    minDate: minDateProp,\n    maxDate: maxDateProp,\n    onInputChange: onInputChangeProp,\n    timeZone,\n    value: valueProp,\n  });\n\n  const { language } = i18n;\n  const containerRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    setPopperElement(containerRef.current);\n  }, [setPopperElement]);\n\n  const formatDateTimeToJsDateStringOnCalendarSelection = useCallback<\n    NonNullable<MuiDateTimePickerProps<DateTime>[\"onChange\"]>\n  >(\n    (value) => {\n      if (value) {\n        const dateStringFromDateTime = formatDateTimeToUtcIsoDateString(value);\n\n        if (dateStringFromDateTime) {\n          onCalendarDateChange?.({\n            value: dateStringFromDateTime,\n            timeZone: internalTimeZone,\n          });\n        }\n      }\n    },\n    [formatDateTimeToUtcIsoDateString, internalTimeZone, onCalendarDateChange],\n  );\n\n  const renderDateTimeField = useCallback(\n    ({ defaultValue, inputRef, value }: RenderDateTimeFieldProps) => {\n      return (\n        <DateTimeField\n          defaultValue={defaultValue}\n          endAdornment={\n            <Button\n              ariaLabel={t(\"picker.labels.date.choose\")}\n              label=\"\"\n              onClick={toggleCalendarVisibility}\n              size=\"small\"\n              startIcon={<commonIcons.CalendarIcon />}\n              variant=\"floating\"\n            />\n          }\n          errorMessage={errorMessage}\n          hint={hint}\n          HintLinkComponent={HintLinkComponent}\n          inputRef={inputRef}\n          isDisabled={isDisabled}\n          isOptional={isOptional}\n          isReadOnly={isReadOnly}\n          label={label}\n          onBlur={onBlur}\n          minDate={minDate}\n          maxDate={maxDate}\n          onChange={onInputChange}\n          timezone={internalTimeZone}\n          value={value}\n        />\n      );\n    },\n    [\n      commonIcons,\n      errorMessage,\n      hint,\n      HintLinkComponent,\n      internalTimeZone,\n      isDisabled,\n      isOptional,\n      isReadOnly,\n      label,\n      onBlur,\n      onInputChange,\n      minDate,\n      maxDate,\n      t,\n      toggleCalendarVisibility,\n    ],\n  );\n\n  const slots = useMemo<DateTimePickerSlots<DateTime>>(\n    () => ({\n      actionBar: DateFieldActionBar,\n      field: (muiProps: RenderDateTimeFieldProps) =>\n        renderDateTimeField(muiProps),\n      leftArrowIcon: () => <commonIcons.ArrowLeftIcon />,\n      rightArrowIcon: () => <commonIcons.ArrowRightIcon />,\n      switchViewIcon: () => <commonIcons.ChevronDownIcon />,\n    }),\n    [commonIcons, renderDateTimeField],\n  );\n\n  const slotProps = useMemo<DateTimePickerSlotProps<DateTime, false>>(\n    () => ({\n      actionBar: ({ wrapperVariant, onAccept, onCancel }) => ({\n        actions:\n          // This is the default behavior but felt more clear to pass them in explicitly\n          wrapperVariant === \"desktop\" ? [] : [\"accept\", \"cancel\"],\n        onAccept,\n        onCancel,\n      }),\n      popper: {\n        anchorEl: popperElement,\n      },\n      tabs: {\n        dateIcon: <CalendarIcon />,\n        timeIcon: <ClockIcon />,\n      },\n      toolbar: {\n        toolbarPlaceholder: \"\",\n      },\n    }),\n    [popperElement],\n  );\n\n  return (\n    <OdysseyThemeProvider themeOverride={dateTimePickerTheme}>\n      <DateFieldLocalizationProvider\n        defaultedLanguageCode={defaultedLanguageCode}\n        localeText={localeText}\n      >\n        <DatePickerContainer>\n          <DatePickerWidthContainer\n            odysseyDesignTokens={odysseyDesignTokens}\n            ref={containerRef}\n          >\n            <MuiDateTimePicker\n              dayOfWeekFormatter={formatDayOfWeek}\n              defaultValue={inputValues?.defaultValue}\n              disabled={isDisabled}\n              fixedWeekNumber={6}\n              inputRef={inputRef}\n              key={language}\n              label={label}\n              minDate={minDate}\n              maxDate={maxDate}\n              onChange={formatDateTimeToJsDateStringOnCalendarSelection}\n              onClose={closeCalendar}\n              open={isOpen}\n              readOnly={isReadOnly}\n              shouldDisableDate={shouldDisableDate}\n              shouldDisableMonth={shouldDisableMonth}\n              shouldDisableYear={shouldDisableYear}\n              slots={slots}\n              slotProps={slotProps}\n              timezone={internalTimeZone}\n              value={inputValues?.value}\n            />\n          </DatePickerWidthContainer>\n        </DatePickerContainer>\n\n        {timeZoneOptions && timeZonePickerLabel && (\n          <TimeZonePickerContainer odysseyDesignTokens={odysseyDesignTokens}>\n            <TimeZonePicker\n              label={timeZonePickerLabel}\n              onTimeZoneChange={onTimeZoneChange}\n              isReadOnly={isReadOnly}\n              timeZoneOptions={timeZoneOptions}\n              value={internalTimeZone}\n            />\n          </TimeZonePickerContainer>\n        )}\n      </DateFieldLocalizationProvider>\n    </OdysseyThemeProvider>\n  );\n};\n\nconst MemoizedDateTimePicker = memo(DateTimePicker);\nMemoizedDateTimePicker.displayName = \"DateTimePicker\";\n\nexport { MemoizedDateTimePicker as DateTimePicker };\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/labs/DatePickers/dateTimePickerTheme.cjs

@@ -5,7 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.dateTimePickerTheme = void 0;
 var _utils = require("@mui/utils");
+var _DigitalClock = require("@mui/x-date-pickers/DigitalClock");
+var _MultiSectionDigitalClock = require("@mui/x-date-pickers/MultiSectionDigitalClock");
 var _datePickerTheme = require("../../DatePickers/datePickerTheme.cjs");
+var _DateTimePicker = require("./DateTimePicker.cjs");
+var _index = require("../../theme/index.cjs");
+var _addSpecificity = require("../../addSpecificity.cjs");
 /*!
  * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
  * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
@@ -16,7 +21,11 @@ var _datePickerTheme = require("../../DatePickers/datePickerTheme.cjs");
  * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  *
  * See the License for the specific language governing permissions and limitations under the License.
- */const theme = {
+ */const DateTimePickerComponentSize = {
+  dateCalendarMaxHeight: `${(0, _index.pxToRem)(336)}rem`,
+  slideTransitionMinHeight: `${(0, _index.pxToRem)(240)}rem`
+};
+const theme = {
   components: {
     MuiClock: {
       styleOverrides: {
@@ -53,7 +62,9 @@ var _datePickerTheme = require("../../DatePickers/datePickerTheme.cjs");
       styleOverrides: {
         root: {
           display: "block",
-          width: "100%"
+          width: "100%",
+          maxHeight: DateTimePickerComponentSize.dateCalendarMaxHeight,
+          height: DateTimePickerComponentSize.dateCalendarMaxHeight
         }
       }
     },
@@ -82,6 +93,11 @@ var _datePickerTheme = require("../../DatePickers/datePickerTheme.cjs");
     },
     MuiPickersLayout: {
       styleOverrides: {
+        root: () => ({
+          display: "block",
+          width: _DateTimePicker.DateTimePickerSize.maxWidth,
+          maxWidth: _DateTimePicker.DateTimePickerSize.maxWidth
+        }),
         contentWrapper: ({
           theme
         }) => ({
@@ -90,6 +106,17 @@ var _datePickerTheme = require("../../DatePickers/datePickerTheme.cjs");
         })
       }
     },
+    MuiMultiSectionDigitalClock: {
+      styleOverrides: {
+        root: {
+          [`${(0, _addSpecificity.addSpecificity)(2, `.${_MultiSectionDigitalClock.multiSectionDigitalClockClasses.root}`)}, 
+            ${(0, _addSpecificity.addSpecificity)(2, ` .${_MultiSectionDigitalClock.multiSectionDigitalClockSectionClasses.root}`)}, 
+            ${(0, _addSpecificity.addSpecificity)(2, `.${_DigitalClock.digitalClockClasses.root}`)}`]: {
+            maxHeight: DateTimePickerComponentSize.dateCalendarMaxHeight
+          }
+        }
+      }
+    },
     MuiMultiSectionDigitalClockSection: {
       styleOverrides: {
         root: {
@@ -222,6 +249,13 @@ var _datePickerTheme = require("../../DatePickers/datePickerTheme.cjs");
         })
       }
     },
+    MuiDayCalendar: {
+      styleOverrides: {
+        slideTransition: {
+          minHeight: DateTimePickerComponentSize.slideTransitionMinHeight
+        }
+      }
+    },
     MuiTimeClock: {
       styleOverrides: {
         arrowSwitcher: {

package/dist/cjs/labs/DatePickers/dateTimePickerTheme.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"dateTimePickerTheme.cjs","names":["_utils","require","_datePickerTheme","theme","components","MuiClock","styleOverrides","clock","width","spacing","height","backgroundColor","palette","grey","pin","primary","light","MuiClockPointer","root","thumb","borderColor","main","MuiDateCalendar","display","MuiPickersArrowSwitcher","button","margin","padding","color","typography","body1","marginInlineStart","svg","spacer","MuiPickersLayout","contentWrapper","gridTemplateColumns","MuiMultiSectionDigitalClockSection","item","dateStyles","default","marginInline","marginBlockStart","hover","focus","selected","hoverSelected","disabled","MuiDateTimePickerToolbar","dateContainer","flexDirection","marginInlineEnd","timeDigitsContainer","alignItems","ampmSelection","common","white","separator","h5","marginBlock","MuiPickersToolbarButton","border","borderRadius","mixins","subtitle1","MuiPickersToolbarText","position","lineHeight","left","bottom","opacity","content","transition","transform","MuiTimeClock","arrowSwitcher","top","right","dateTimePickerTheme","exports","deepmerge","datePickerTheme"],"sources":["../../../../src/labs/DatePickers/dateTimePickerTheme.ts"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\n// import { CSSInterpolation } from \"@mui/material/styles\";\nimport { deepmerge } from \"@mui/utils\";\nimport { ThemeOptions } from \"@mui/material\";\n\nimport {\n  datePickerTheme,\n  dateStyles,\n} from \"../../DatePickers/datePickerTheme.js\";\n\nconst theme: ThemeOptions = {\n  components: {\n    MuiClock: {\n      styleOverrides: {\n        clock: ({ theme }) => ({\n          width: `calc(${theme.spacing(9)} * 4)`,\n          height: `calc(${theme.spacing(9)} * 4)`,\n          backgroundColor: theme.palette.grey[50],\n        }),\n        pin: ({ theme }) => ({\n          backgroundColor: theme.palette.primary.light,\n        }),\n      },\n    },\n    MuiClockPointer: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          backgroundColor: theme.palette.primary.light,\n        }),\n        thumb: ({ theme }) => ({\n          borderColor: theme.palette.primary.light,\n          backgroundColor: theme.palette.primary.main,\n        }),\n      },\n    },\n    MuiDateCalendar: {\n      styleOverrides: {\n        root: {\n          display: \"block\",\n          width: \"100%\",\n        },\n      },\n    },\n    MuiPickersArrowSwitcher: {\n      styleOverrides: {\n        button: ({ theme }) => ({\n          display: \"flex\",\n          margin: 0,\n          padding: theme.spacing(2),\n          color: theme.typography.body1.color,\n\n          \"& + &\": {\n            marginInlineStart: theme.spacing(2),\n          },\n\n          svg: {\n            display: \"flex\",\n          },\n        }),\n        spacer: ({ theme }) => ({\n          width: theme.spacing(1),\n        }),\n      },\n    },\n    MuiPickersLayout: {\n      styleOverrides: {\n        contentWrapper: ({ theme }) => ({\n          padding: theme.spacing(3),\n          gridTemplateColumns: \"1fr 16px auto\",\n        }),\n      },\n    },\n    MuiMultiSectionDigitalClockSection: {\n      styleOverrides: {\n        root: {\n          width: \"auto\",\n        },\n        item: ({ theme }) => [\n          dateStyles.default({ theme }),\n          {\n            margin: 0,\n            marginInline: theme.spacing(1),\n            \"& + &\": {\n              marginBlockStart: theme.spacing(1),\n            },\n            \"&:hover\": dateStyles.hover({ theme }),\n            \"&:focus\": dateStyles.focus({ theme }),\n\n            \"&.Mui-selected, &.Mui-selected:focus\": dateStyles.selected({\n              theme,\n            }),\n            \"&.Mui-selected:hover\": dateStyles.hoverSelected({ theme }),\n\n            \"&.Mui-disabled\": dateStyles.disabled({ theme }),\n          },\n        ],\n      },\n    },\n    MuiDateTimePickerToolbar: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          padding: theme.spacing(3),\n        }),\n        dateContainer: ({ theme }) => ({\n          flexDirection: \"row-reverse\",\n\n          button: {\n            \"+ button\": {\n              marginInlineEnd: theme.spacing(2),\n            },\n          },\n        }),\n        timeDigitsContainer: {\n          alignItems: \"center\",\n        },\n        ampmSelection: ({ theme }) => ({\n          margin: 0,\n          marginInlineStart: theme.spacing(3),\n\n          button: {\n            padding: theme.spacing(2),\n\n            \"&:has(.Mui-selected)\": {\n              backgroundColor: theme.palette.primary.main,\n\n              \".Mui-selected\": {\n                color: theme.palette.common.white,\n                \"&::after\": {\n                  display: \"none\",\n                },\n              },\n            },\n          },\n        }),\n        separator: ({ theme }) => ({\n          ...theme.typography.h5,\n          marginBlock: 0,\n          marginInline: theme.spacing(1),\n        }),\n      },\n    },\n    MuiPickersToolbarButton: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          height: \"auto\",\n          padding: 0,\n          margin: 0,\n          border: 0,\n          borderRadius: theme.mixins.borderRadius,\n          backgroundColor: \"transparent\",\n          color: theme.typography.subtitle1.color,\n\n          \"&:hover\": {\n            backgroundColor: \"transparent\",\n          },\n\n          \"& + &\": {\n            marginInlineStart: 0,\n          },\n        }),\n      },\n    },\n    MuiPickersToolbarText: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          ...theme.typography.h5,\n          position: \"relative\",\n          margin: 0,\n          lineHeight: 1,\n          color: \"inherit\",\n\n          \"&::after\": {\n            position: \"absolute\",\n            left: 0,\n            bottom: 0,\n            width: \"100%\",\n            height: 2,\n            backgroundColor: \"currentColor\",\n            opacity: 0,\n            content: \"''\",\n            transition: \"opacity 100ms, transform 200ms\",\n          },\n\n          \"&.Mui-selected\": {\n            color: theme.typography.body1.color,\n\n            \"&::after\": {\n              transform: \"translateY(2px)\",\n              opacity: 1,\n            },\n          },\n        }),\n      },\n    },\n    MuiTimeClock: {\n      styleOverrides: {\n        arrowSwitcher: {\n          top: 0,\n          right: 0,\n        },\n      },\n    },\n  },\n};\nexport const dateTimePickerTheme = deepmerge(datePickerTheme, theme);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"dateTimePickerTheme.cjs","names":["_utils","require","_DigitalClock","_MultiSectionDigitalClock","_datePickerTheme","_DateTimePicker","_index","_addSpecificity","DateTimePickerComponentSize","dateCalendarMaxHeight","pxToRem","slideTransitionMinHeight","theme","components","MuiClock","styleOverrides","clock","width","spacing","height","backgroundColor","palette","grey","pin","primary","light","MuiClockPointer","root","thumb","borderColor","main","MuiDateCalendar","display","maxHeight","MuiPickersArrowSwitcher","button","margin","padding","color","typography","body1","marginInlineStart","svg","spacer","MuiPickersLayout","DateTimePickerSize","maxWidth","contentWrapper","gridTemplateColumns","MuiMultiSectionDigitalClock","addSpecificity","multiSectionDigitalClockClasses","multiSectionDigitalClockSectionClasses","digitalClockClasses","MuiMultiSectionDigitalClockSection","item","dateStyles","default","marginInline","marginBlockStart","hover","focus","selected","hoverSelected","disabled","MuiDateTimePickerToolbar","dateContainer","flexDirection","marginInlineEnd","timeDigitsContainer","alignItems","ampmSelection","common","white","separator","h5","marginBlock","MuiPickersToolbarButton","border","borderRadius","mixins","subtitle1","MuiPickersToolbarText","position","lineHeight","left","bottom","opacity","content","transition","transform","MuiDayCalendar","slideTransition","minHeight","MuiTimeClock","arrowSwitcher","top","right","dateTimePickerTheme","exports","deepmerge","datePickerTheme"],"sources":["../../../../src/labs/DatePickers/dateTimePickerTheme.ts"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\n// import { CSSInterpolation } from \"@mui/material/styles\";\nimport { deepmerge } from \"@mui/utils\";\nimport { ThemeOptions } from \"@mui/material\";\nimport { digitalClockClasses } from \"@mui/x-date-pickers/DigitalClock\";\nimport {\n  multiSectionDigitalClockSectionClasses,\n  multiSectionDigitalClockClasses,\n} from \"@mui/x-date-pickers/MultiSectionDigitalClock\";\nimport {\n  datePickerTheme,\n  dateStyles,\n} from \"../../DatePickers/datePickerTheme.js\";\nimport { DateTimePickerSize } from \"./DateTimePicker.js\";\nimport { pxToRem } from \"../../theme/index.js\";\nimport { addSpecificity } from \"../../addSpecificity.js\";\n\nconst DateTimePickerComponentSize = {\n  dateCalendarMaxHeight: `${pxToRem(336)}rem`,\n  slideTransitionMinHeight: `${pxToRem(240)}rem`,\n};\n\nconst theme: ThemeOptions = {\n  components: {\n    MuiClock: {\n      styleOverrides: {\n        clock: ({ theme }) => ({\n          width: `calc(${theme.spacing(9)} * 4)`,\n          height: `calc(${theme.spacing(9)} * 4)`,\n          backgroundColor: theme.palette.grey[50],\n        }),\n        pin: ({ theme }) => ({\n          backgroundColor: theme.palette.primary.light,\n        }),\n      },\n    },\n    MuiClockPointer: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          backgroundColor: theme.palette.primary.light,\n        }),\n        thumb: ({ theme }) => ({\n          borderColor: theme.palette.primary.light,\n          backgroundColor: theme.palette.primary.main,\n        }),\n      },\n    },\n    MuiDateCalendar: {\n      styleOverrides: {\n        root: {\n          display: \"block\",\n          width: \"100%\",\n          maxHeight: DateTimePickerComponentSize.dateCalendarMaxHeight,\n          height: DateTimePickerComponentSize.dateCalendarMaxHeight,\n        },\n      },\n    },\n    MuiPickersArrowSwitcher: {\n      styleOverrides: {\n        button: ({ theme }) => ({\n          display: \"flex\",\n          margin: 0,\n          padding: theme.spacing(2),\n          color: theme.typography.body1.color,\n\n          \"& + &\": {\n            marginInlineStart: theme.spacing(2),\n          },\n\n          svg: {\n            display: \"flex\",\n          },\n        }),\n        spacer: ({ theme }) => ({\n          width: theme.spacing(1),\n        }),\n      },\n    },\n    MuiPickersLayout: {\n      styleOverrides: {\n        root: () => ({\n          display: \"block\",\n          width: DateTimePickerSize.maxWidth,\n          maxWidth: DateTimePickerSize.maxWidth,\n        }),\n        contentWrapper: ({ theme }) => ({\n          padding: theme.spacing(3),\n          gridTemplateColumns: \"1fr 16px auto\",\n        }),\n      },\n    },\n    MuiMultiSectionDigitalClock: {\n      styleOverrides: {\n        root: {\n          [`${addSpecificity(2, `.${multiSectionDigitalClockClasses.root}`)}, \n            ${addSpecificity(2, ` .${multiSectionDigitalClockSectionClasses.root}`)}, \n            ${addSpecificity(2, `.${digitalClockClasses.root}`)}`]: {\n            maxHeight: DateTimePickerComponentSize.dateCalendarMaxHeight,\n          },\n        },\n      },\n    },\n    MuiMultiSectionDigitalClockSection: {\n      styleOverrides: {\n        root: {\n          width: \"auto\",\n        },\n        item: ({ theme }) => [\n          dateStyles.default({ theme }),\n          {\n            margin: 0,\n            marginInline: theme.spacing(1),\n            \"& + &\": {\n              marginBlockStart: theme.spacing(1),\n            },\n            \"&:hover\": dateStyles.hover({ theme }),\n            \"&:focus\": dateStyles.focus({ theme }),\n\n            \"&.Mui-selected, &.Mui-selected:focus\": dateStyles.selected({\n              theme,\n            }),\n            \"&.Mui-selected:hover\": dateStyles.hoverSelected({ theme }),\n\n            \"&.Mui-disabled\": dateStyles.disabled({ theme }),\n          },\n        ],\n      },\n    },\n    MuiDateTimePickerToolbar: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          padding: theme.spacing(3),\n        }),\n        dateContainer: ({ theme }) => ({\n          flexDirection: \"row-reverse\",\n\n          button: {\n            \"+ button\": {\n              marginInlineEnd: theme.spacing(2),\n            },\n          },\n        }),\n        timeDigitsContainer: {\n          alignItems: \"center\",\n        },\n        ampmSelection: ({ theme }) => ({\n          margin: 0,\n          marginInlineStart: theme.spacing(3),\n\n          button: {\n            padding: theme.spacing(2),\n\n            \"&:has(.Mui-selected)\": {\n              backgroundColor: theme.palette.primary.main,\n\n              \".Mui-selected\": {\n                color: theme.palette.common.white,\n                \"&::after\": {\n                  display: \"none\",\n                },\n              },\n            },\n          },\n        }),\n        separator: ({ theme }) => ({\n          ...theme.typography.h5,\n          marginBlock: 0,\n          marginInline: theme.spacing(1),\n        }),\n      },\n    },\n    MuiPickersToolbarButton: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          height: \"auto\",\n          padding: 0,\n          margin: 0,\n          border: 0,\n          borderRadius: theme.mixins.borderRadius,\n          backgroundColor: \"transparent\",\n          color: theme.typography.subtitle1.color,\n\n          \"&:hover\": {\n            backgroundColor: \"transparent\",\n          },\n\n          \"& + &\": {\n            marginInlineStart: 0,\n          },\n        }),\n      },\n    },\n    MuiPickersToolbarText: {\n      styleOverrides: {\n        root: ({ theme }) => ({\n          ...theme.typography.h5,\n          position: \"relative\",\n          margin: 0,\n          lineHeight: 1,\n          color: \"inherit\",\n\n          \"&::after\": {\n            position: \"absolute\",\n            left: 0,\n            bottom: 0,\n            width: \"100%\",\n            height: 2,\n            backgroundColor: \"currentColor\",\n            opacity: 0,\n            content: \"''\",\n            transition: \"opacity 100ms, transform 200ms\",\n          },\n\n          \"&.Mui-selected\": {\n            color: theme.typography.body1.color,\n\n            \"&::after\": {\n              transform: \"translateY(2px)\",\n              opacity: 1,\n            },\n          },\n        }),\n      },\n    },\n    MuiDayCalendar: {\n      styleOverrides: {\n        slideTransition: {\n          minHeight: DateTimePickerComponentSize.slideTransitionMinHeight,\n        },\n      },\n    },\n    MuiTimeClock: {\n      styleOverrides: {\n        arrowSwitcher: {\n          top: 0,\n          right: 0,\n        },\n      },\n    },\n  },\n};\nexport const dateTimePickerTheme = deepmerge(datePickerTheme, theme);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/labs/OdysseyPickers/ComposablePicker.cjs

@@ -27,6 +27,7 @@ const adornmentSizeValues = exports.adornmentSizeValues = ["small", "large"];
 const ComposablePicker = ({
   ariaDescribedBy,
   defaultValue,
+  emptyOptionsText,
   errorMessage,
   errorMessageList,
   getIsOptionEqualToValue,
@@ -102,6 +103,7 @@ const ComposablePicker = ({
     isOptionEqualToValue: getIsOptionEqualToValue,
     loading: isLoading,
     multiple: hasMultipleChoices,
+    noOptionsText: emptyOptionsText,
     onBlur: onBlur,
     onChange: onChange,
     onInputChange: onInputChange,

package/dist/cjs/labs/OdysseyPickers/ComposablePicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComposablePicker.cjs","names":["_react","require","_reactI18next","_PickerVirtualizationListBox","_useAutocomplete","_jsxRuntime","_interopRequireDefault","e","__esModule","default","adornmentSizeValues","exports","ComposablePicker","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","getIsOptionEqualToValue","getOptionLabel","groupOptionsBy","hasMultipleChoices","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","hint","HintLinkComponent","label","name","nameOverride","onBlur","onChange","onInputChange","onFocus","options","renderOption","renderTags","value","testId","translate","t","useTranslation","inputValueProp","isVirtualizedRef","renderInput","valueProps","useAutocomplete","jsx","_Autocomplete2","current","ListboxComponent","PickerVirtualizationListBox","clearText","closeText","disableCloseOnSelect","disabled","freeSolo","filterSelectedOptions","fullWidth","groupBy","isOptionEqualToValue","loading","multiple","readOnly","MemoizedComposablePicker","memo","displayName"],"sources":["../../../../src/labs/OdysseyPickers/ComposablePicker.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n  Autocomplete as MuiAutocomplete,\n  AutocompleteProps as MuiAutocompleteProps,\n} from \"@mui/material\";\n\nimport { AutocompleteProps } from \"../../Autocomplete.js\";\nimport { PickerVirtualizationListBox } from \"./PickerVirtualizationListBox.js\";\nimport { useAutocomplete } from \"../../useAutocomplete.js\";\n\nexport const adornmentSizeValues = [\"small\", \"large\"] as const;\nexport type AdornmentSize = (typeof adornmentSizeValues)[number];\n\nexport type BasePickerProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n> = AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n  adornmentSize?: AdornmentSize;\n  groupOptionsBy?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"groupBy\"];\n};\n\nexport type BasePickerType = {\n  displayName: string;\n  <\n    OptionType,\n    HasMultipleChoices extends boolean | undefined,\n    IsCustomValueAllowed extends boolean | undefined,\n  >(\n    props: BasePickerProps<\n      OptionType,\n      HasMultipleChoices,\n      IsCustomValueAllowed\n    >,\n  ): ReactNode;\n};\n\nexport type ComposablePickerProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n> = BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n  getOptionLabel?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"getOptionLabel\"];\n\n  renderOption: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"renderOption\"];\n\n  renderTags?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"renderTags\"];\n};\n\nconst ComposablePicker = <\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n>({\n  ariaDescribedBy,\n  defaultValue,\n  errorMessage,\n  errorMessageList,\n  getIsOptionEqualToValue,\n  getOptionLabel,\n  groupOptionsBy,\n  hasMultipleChoices,\n  id: idOverride,\n  inputValue,\n  isCustomValueAllowed,\n  isDisabled,\n  isFullWidth = false,\n  isLoading,\n  isOptional = false,\n  isReadOnly,\n  isVirtualized = false,\n  hint,\n  HintLinkComponent,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange,\n  onInputChange,\n  onFocus,\n  options,\n  renderOption,\n  renderTags,\n  value,\n  testId,\n  translate,\n}: ComposablePickerProps<\n  OptionType,\n  HasMultipleChoices,\n  IsCustomValueAllowed\n>) => {\n  const { t } = useTranslation();\n  const { inputValueProp, isVirtualizedRef, renderInput, valueProps } =\n    useAutocomplete<OptionType, HasMultipleChoices, IsCustomValueAllowed>({\n      ariaDescribedBy,\n      defaultValue,\n      errorMessage,\n      errorMessageList,\n      hasMultipleChoices,\n      hint,\n      HintLinkComponent,\n      inputValue,\n      isFullWidth,\n      isOptional,\n      isVirtualized,\n      label,\n      name: nameOverride,\n      testId,\n      value,\n    });\n\n  return (\n    <MuiAutocomplete\n      {...valueProps}\n      {...inputValueProp}\n      // conditionally provide the ListboxComponent if this needs to be virtualized\n      {...(isVirtualizedRef.current && {\n        ListboxComponent: PickerVirtualizationListBox,\n      })}\n      // AutoComplete is wrapped in a div within MUI which does not get the disabled attr. So this aria-disabled gets set in the div\n      aria-disabled={isDisabled}\n      clearText={t(\"clear.text\")}\n      closeText={t(\"close.text\")}\n      disableCloseOnSelect={hasMultipleChoices}\n      disabled={isDisabled}\n      freeSolo={isCustomValueAllowed}\n      filterSelectedOptions={true}\n      fullWidth={isFullWidth}\n      getOptionLabel={getOptionLabel}\n      groupBy={groupOptionsBy}\n      id={idOverride}\n      isOptionEqualToValue={getIsOptionEqualToValue}\n      loading={isLoading}\n      multiple={hasMultipleChoices}\n      onBlur={onBlur}\n      onChange={onChange}\n      onInputChange={onInputChange}\n      onFocus={onFocus}\n      options={options}\n      readOnly={isReadOnly}\n      renderInput={renderInput}\n      renderOption={renderOption}\n      renderTags={renderTags}\n      translate={translate}\n    />\n  );\n};\n\n// Need the `typeof ComposablePicker` because generics don't get passed through\nconst MemoizedComposablePicker = memo(\n  ComposablePicker,\n) as typeof ComposablePicker;\n// @ts-expect-error displayName is expected to not be on `typeof ComposablePicker`\nMemoizedComposablePicker.displayName = \"ComposablePicker\";\n\nexport { MemoizedComposablePicker as ComposablePicker };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ComposablePicker.cjs","names":["_react","require","_reactI18next","_PickerVirtualizationListBox","_useAutocomplete","_jsxRuntime","_interopRequireDefault","e","__esModule","default","adornmentSizeValues","exports","ComposablePicker","ariaDescribedBy","defaultValue","emptyOptionsText","errorMessage","errorMessageList","getIsOptionEqualToValue","getOptionLabel","groupOptionsBy","hasMultipleChoices","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","hint","HintLinkComponent","label","name","nameOverride","onBlur","onChange","onInputChange","onFocus","options","renderOption","renderTags","value","testId","translate","t","useTranslation","inputValueProp","isVirtualizedRef","renderInput","valueProps","useAutocomplete","jsx","_Autocomplete2","current","ListboxComponent","PickerVirtualizationListBox","clearText","closeText","disableCloseOnSelect","disabled","freeSolo","filterSelectedOptions","fullWidth","groupBy","isOptionEqualToValue","loading","multiple","noOptionsText","readOnly","MemoizedComposablePicker","memo","displayName"],"sources":["../../../../src/labs/OdysseyPickers/ComposablePicker.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n  Autocomplete as MuiAutocomplete,\n  AutocompleteProps as MuiAutocompleteProps,\n} from \"@mui/material\";\n\nimport { AutocompleteProps } from \"../../Autocomplete.js\";\nimport { PickerVirtualizationListBox } from \"./PickerVirtualizationListBox.js\";\nimport { useAutocomplete } from \"../../useAutocomplete.js\";\n\nexport const adornmentSizeValues = [\"small\", \"large\"] as const;\nexport type AdornmentSize = (typeof adornmentSizeValues)[number];\n\nexport type BasePickerProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n> = AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n  adornmentSize?: AdornmentSize;\n  emptyOptionsText?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"noOptionsText\"];\n  groupOptionsBy?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"groupBy\"];\n};\n\nexport type BasePickerType = {\n  displayName: string;\n  <\n    OptionType,\n    HasMultipleChoices extends boolean | undefined,\n    IsCustomValueAllowed extends boolean | undefined,\n  >(\n    props: BasePickerProps<\n      OptionType,\n      HasMultipleChoices,\n      IsCustomValueAllowed\n    >,\n  ): ReactNode;\n};\n\nexport type ComposablePickerProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n> = BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n  getOptionLabel?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"getOptionLabel\"];\n\n  renderOption: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"renderOption\"];\n\n  renderTags?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"renderTags\"];\n};\n\nconst ComposablePicker = <\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n>({\n  ariaDescribedBy,\n  defaultValue,\n  emptyOptionsText,\n  errorMessage,\n  errorMessageList,\n  getIsOptionEqualToValue,\n  getOptionLabel,\n  groupOptionsBy,\n  hasMultipleChoices,\n  id: idOverride,\n  inputValue,\n  isCustomValueAllowed,\n  isDisabled,\n  isFullWidth = false,\n  isLoading,\n  isOptional = false,\n  isReadOnly,\n  isVirtualized = false,\n  hint,\n  HintLinkComponent,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange,\n  onInputChange,\n  onFocus,\n  options,\n  renderOption,\n  renderTags,\n  value,\n  testId,\n  translate,\n}: ComposablePickerProps<\n  OptionType,\n  HasMultipleChoices,\n  IsCustomValueAllowed\n>) => {\n  const { t } = useTranslation();\n  const { inputValueProp, isVirtualizedRef, renderInput, valueProps } =\n    useAutocomplete<OptionType, HasMultipleChoices, IsCustomValueAllowed>({\n      ariaDescribedBy,\n      defaultValue,\n      errorMessage,\n      errorMessageList,\n      hasMultipleChoices,\n      hint,\n      HintLinkComponent,\n      inputValue,\n      isFullWidth,\n      isOptional,\n      isVirtualized,\n      label,\n      name: nameOverride,\n      testId,\n      value,\n    });\n\n  return (\n    <MuiAutocomplete\n      {...valueProps}\n      {...inputValueProp}\n      // conditionally provide the ListboxComponent if this needs to be virtualized\n      {...(isVirtualizedRef.current && {\n        ListboxComponent: PickerVirtualizationListBox,\n      })}\n      // AutoComplete is wrapped in a div within MUI which does not get the disabled attr. So this aria-disabled gets set in the div\n      aria-disabled={isDisabled}\n      clearText={t(\"clear.text\")}\n      closeText={t(\"close.text\")}\n      disableCloseOnSelect={hasMultipleChoices}\n      disabled={isDisabled}\n      freeSolo={isCustomValueAllowed}\n      filterSelectedOptions={true}\n      fullWidth={isFullWidth}\n      getOptionLabel={getOptionLabel}\n      groupBy={groupOptionsBy}\n      id={idOverride}\n      isOptionEqualToValue={getIsOptionEqualToValue}\n      loading={isLoading}\n      multiple={hasMultipleChoices}\n      noOptionsText={emptyOptionsText}\n      onBlur={onBlur}\n      onChange={onChange}\n      onInputChange={onInputChange}\n      onFocus={onFocus}\n      options={options}\n      readOnly={isReadOnly}\n      renderInput={renderInput}\n      renderOption={renderOption}\n      renderTags={renderTags}\n      translate={translate}\n    />\n  );\n};\n\n// Need the `typeof ComposablePicker` because generics don't get passed through\nconst MemoizedComposablePicker = memo(\n  ComposablePicker,\n) as typeof ComposablePicker;\n// @ts-expect-error displayName is expected to not be on `typeof ComposablePicker`\nMemoizedComposablePicker.displayName = \"ComposablePicker\";\n\nexport { MemoizedComposablePicker as ComposablePicker };\n"],"mappings":"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","ignoreList":[]}