@okta/odyssey-react-mui 1.35.0 → 1.35.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (145) hide show
  1. package/dist/cjs/DatePickers/useOdysseyDateFields.cjs +2 -2
  2. package/dist/cjs/DatePickers/useOdysseyDateFields.cjs.map +1 -1
  3. package/dist/cjs/Field.cjs +1 -1
  4. package/dist/cjs/Field.cjs.map +1 -1
  5. package/dist/cjs/Pagination/Pagination.cjs +0 -6
  6. package/dist/cjs/Pagination/Pagination.cjs.map +1 -1
  7. package/dist/cjs/inputUtils.cjs +1 -1
  8. package/dist/cjs/inputUtils.cjs.map +1 -1
  9. package/dist/cjs/labs/DataFilters.cjs +4 -4
  10. package/dist/cjs/labs/DataFilters.cjs.map +1 -1
  11. package/dist/cjs/labs/DataView/DataCard.cjs +18 -18
  12. package/dist/cjs/labs/DataView/DataCard.cjs.map +1 -1
  13. package/dist/cjs/labs/DataView/DataView.cjs +10 -10
  14. package/dist/cjs/labs/DataView/DataView.cjs.map +1 -1
  15. package/dist/cjs/labs/DataView/TableLayoutContent.cjs +4 -1
  16. package/dist/cjs/labs/DataView/TableLayoutContent.cjs.map +1 -1
  17. package/dist/cjs/labs/DataView/useFilterConversion.cjs +1 -1
  18. package/dist/cjs/labs/DataView/useFilterConversion.cjs.map +1 -1
  19. package/dist/cjs/theme/StringWithValue.cjs +6 -0
  20. package/dist/cjs/theme/StringWithValue.cjs.map +1 -0
  21. package/dist/cjs/theme/components.cjs +2590 -2592
  22. package/dist/cjs/theme/components.cjs.map +1 -1
  23. package/dist/cjs/theme/useMediaQuery.cjs +4 -4
  24. package/dist/cjs/theme/useMediaQuery.cjs.map +1 -1
  25. package/dist/cjs/ui-shell/InnerAppContainer.cjs +60 -0
  26. package/dist/cjs/ui-shell/InnerAppContainer.cjs.map +1 -0
  27. package/dist/cjs/ui-shell/NarrowUiShellContent.cjs +6 -1
  28. package/dist/cjs/ui-shell/NarrowUiShellContent.cjs.map +1 -1
  29. package/dist/cjs/ui-shell/SideNav/SideNav.cjs +79 -48
  30. package/dist/cjs/ui-shell/SideNav/SideNav.cjs.map +1 -1
  31. package/dist/cjs/ui-shell/SideNav/SideNavToggleButton.cjs +84 -112
  32. package/dist/cjs/ui-shell/SideNav/SideNavToggleButton.cjs.map +1 -1
  33. package/dist/cjs/ui-shell/TopNav/TopNav.cjs +1 -6
  34. package/dist/cjs/ui-shell/TopNav/TopNav.cjs.map +1 -1
  35. package/dist/cjs/ui-shell/UiShell.cjs +6 -5
  36. package/dist/cjs/ui-shell/UiShell.cjs.map +1 -1
  37. package/dist/cjs/ui-shell/WideUiShellContent.cjs +10 -4
  38. package/dist/cjs/ui-shell/WideUiShellContent.cjs.map +1 -1
  39. package/dist/cjs/ui-shell/index.cjs +29 -9
  40. package/dist/cjs/ui-shell/index.cjs.map +1 -1
  41. package/dist/cjs/ui-shell/renderUiShell.cjs +2 -0
  42. package/dist/cjs/ui-shell/renderUiShell.cjs.map +1 -1
  43. package/dist/cjs/ui-shell/useMatchAppElementToUiShellAppArea.cjs +3 -2
  44. package/dist/cjs/ui-shell/useMatchAppElementToUiShellAppArea.cjs.map +1 -1
  45. package/dist/cjs/ui-shell/useScrollState.cjs +71 -21
  46. package/dist/cjs/ui-shell/useScrollState.cjs.map +1 -1
  47. package/dist/cjs/ui-shell/useUiShellBreakpoints.cjs +20 -15
  48. package/dist/cjs/ui-shell/useUiShellBreakpoints.cjs.map +1 -1
  49. package/dist/cjs/web-component/createReactRootElements.cjs +5 -3
  50. package/dist/cjs/web-component/createReactRootElements.cjs.map +1 -1
  51. package/dist/cjs/web-component/renderReactInWebComponent.cjs +21 -7
  52. package/dist/cjs/web-component/renderReactInWebComponent.cjs.map +1 -1
  53. package/dist/esm/DatePickers/useOdysseyDateFields.js +2 -2
  54. package/dist/esm/DatePickers/useOdysseyDateFields.js.map +1 -1
  55. package/dist/esm/Field.js +1 -1
  56. package/dist/esm/Field.js.map +1 -1
  57. package/dist/esm/Pagination/Pagination.js +0 -6
  58. package/dist/esm/Pagination/Pagination.js.map +1 -1
  59. package/dist/esm/inputUtils.js +1 -1
  60. package/dist/esm/inputUtils.js.map +1 -1
  61. package/dist/esm/labs/DataFilters.js +4 -4
  62. package/dist/esm/labs/DataFilters.js.map +1 -1
  63. package/dist/esm/labs/DataView/DataCard.js +18 -18
  64. package/dist/esm/labs/DataView/DataCard.js.map +1 -1
  65. package/dist/esm/labs/DataView/DataView.js +10 -10
  66. package/dist/esm/labs/DataView/DataView.js.map +1 -1
  67. package/dist/esm/labs/DataView/TableLayoutContent.js +4 -1
  68. package/dist/esm/labs/DataView/TableLayoutContent.js.map +1 -1
  69. package/dist/esm/labs/DataView/useFilterConversion.js +1 -1
  70. package/dist/esm/labs/DataView/useFilterConversion.js.map +1 -1
  71. package/dist/esm/theme/StringWithValue.js +2 -0
  72. package/dist/esm/theme/StringWithValue.js.map +1 -0
  73. package/dist/esm/theme/components.js +2607 -2609
  74. package/dist/esm/theme/components.js.map +1 -1
  75. package/dist/esm/theme/useMediaQuery.js +5 -5
  76. package/dist/esm/theme/useMediaQuery.js.map +1 -1
  77. package/dist/esm/ui-shell/InnerAppContainer.js +56 -0
  78. package/dist/esm/ui-shell/InnerAppContainer.js.map +1 -0
  79. package/dist/esm/ui-shell/NarrowUiShellContent.js +6 -1
  80. package/dist/esm/ui-shell/NarrowUiShellContent.js.map +1 -1
  81. package/dist/esm/ui-shell/SideNav/SideNav.js +80 -49
  82. package/dist/esm/ui-shell/SideNav/SideNav.js.map +1 -1
  83. package/dist/esm/ui-shell/SideNav/SideNavToggleButton.js +85 -113
  84. package/dist/esm/ui-shell/SideNav/SideNavToggleButton.js.map +1 -1
  85. package/dist/esm/ui-shell/TopNav/TopNav.js +1 -6
  86. package/dist/esm/ui-shell/TopNav/TopNav.js.map +1 -1
  87. package/dist/esm/ui-shell/UiShell.js +6 -5
  88. package/dist/esm/ui-shell/UiShell.js.map +1 -1
  89. package/dist/esm/ui-shell/WideUiShellContent.js +10 -4
  90. package/dist/esm/ui-shell/WideUiShellContent.js.map +1 -1
  91. package/dist/esm/ui-shell/index.js +3 -1
  92. package/dist/esm/ui-shell/index.js.map +1 -1
  93. package/dist/esm/ui-shell/renderUiShell.js +2 -0
  94. package/dist/esm/ui-shell/renderUiShell.js.map +1 -1
  95. package/dist/esm/ui-shell/useMatchAppElementToUiShellAppArea.js +3 -2
  96. package/dist/esm/ui-shell/useMatchAppElementToUiShellAppArea.js.map +1 -1
  97. package/dist/esm/ui-shell/useScrollState.js +67 -21
  98. package/dist/esm/ui-shell/useScrollState.js.map +1 -1
  99. package/dist/esm/ui-shell/useUiShellBreakpoints.js +19 -14
  100. package/dist/esm/ui-shell/useUiShellBreakpoints.js.map +1 -1
  101. package/dist/esm/web-component/createReactRootElements.js +4 -2
  102. package/dist/esm/web-component/createReactRootElements.js.map +1 -1
  103. package/dist/esm/web-component/renderReactInWebComponent.js +19 -5
  104. package/dist/esm/web-component/renderReactInWebComponent.js.map +1 -1
  105. package/dist/index.cjs +1 -1
  106. package/dist/index.mjs +1 -1
  107. package/dist/index.scss +1 -1
  108. package/dist/tsconfig.production.tsbuildinfo +1 -1
  109. package/dist/tsconfig.tsbuildinfo +1 -1
  110. package/dist/types/DatePickers/useOdysseyDateFields.d.ts.map +1 -1
  111. package/dist/types/Pagination/Pagination.d.ts.map +1 -1
  112. package/dist/types/labs/DataView/DataCard.d.ts.map +1 -1
  113. package/dist/types/labs/DataView/DataView.d.ts.map +1 -1
  114. package/dist/types/labs/DataView/TableLayoutContent.d.ts.map +1 -1
  115. package/dist/types/theme/StringWithValue.d.ts +13 -0
  116. package/dist/types/theme/StringWithValue.d.ts.map +1 -0
  117. package/dist/types/theme/components.d.ts.map +1 -1
  118. package/dist/types/theme/useMediaQuery.d.ts +2 -1
  119. package/dist/types/theme/useMediaQuery.d.ts.map +1 -1
  120. package/dist/types/ui-shell/InnerAppContainer.d.ts +35 -0
  121. package/dist/types/ui-shell/InnerAppContainer.d.ts.map +1 -0
  122. package/dist/types/ui-shell/NarrowUiShellContent.d.ts.map +1 -1
  123. package/dist/types/ui-shell/SideNav/SideNav.d.ts +2 -0
  124. package/dist/types/ui-shell/SideNav/SideNav.d.ts.map +1 -1
  125. package/dist/types/ui-shell/SideNav/SideNavToggleButton.d.ts +15 -8
  126. package/dist/types/ui-shell/SideNav/SideNavToggleButton.d.ts.map +1 -1
  127. package/dist/types/ui-shell/TopNav/TopNav.d.ts +1 -1
  128. package/dist/types/ui-shell/TopNav/TopNav.d.ts.map +1 -1
  129. package/dist/types/ui-shell/UiShell.d.ts +8 -1
  130. package/dist/types/ui-shell/UiShell.d.ts.map +1 -1
  131. package/dist/types/ui-shell/WideUiShellContent.d.ts.map +1 -1
  132. package/dist/types/ui-shell/index.d.ts +3 -1
  133. package/dist/types/ui-shell/index.d.ts.map +1 -1
  134. package/dist/types/ui-shell/renderUiShell.d.ts +2 -2
  135. package/dist/types/ui-shell/renderUiShell.d.ts.map +1 -1
  136. package/dist/types/ui-shell/useMatchAppElementToUiShellAppArea.d.ts.map +1 -1
  137. package/dist/types/ui-shell/useScrollState.d.ts +9 -1
  138. package/dist/types/ui-shell/useScrollState.d.ts.map +1 -1
  139. package/dist/types/ui-shell/useUiShellBreakpoints.d.ts +15 -5
  140. package/dist/types/ui-shell/useUiShellBreakpoints.d.ts.map +1 -1
  141. package/dist/types/web-component/createReactRootElements.d.ts +2 -0
  142. package/dist/types/web-component/createReactRootElements.d.ts.map +1 -1
  143. package/dist/types/web-component/renderReactInWebComponent.d.ts +1 -1
  144. package/dist/types/web-component/renderReactInWebComponent.d.ts.map +1 -1
  145. package/package.json +17 -14
@@ -68,7 +68,7 @@ const useOdysseyDateFields = ({
68
68
  uncontrolledValue: defaultValue
69
69
  }));
70
70
  const defaultedLanguageCode = isInvalidLocale ? "en-US" : language.replaceAll("_", "-");
71
- const isValidTimeZone = timeZone => _luxon.DateTime.local().setZone(timeZone).isValid;
71
+ const isValidTimeZone = (0, _react.useCallback)(timeZone => _luxon.DateTime.local().setZone(timeZone).isValid, []);
72
72
  const formatDateTimeToUtcIsoDateString = (0, _react.useCallback)(value => value.toUTC().toISO() || undefined, []);
73
73
  const shouldDisableDate = (0, _react.useCallback)(date => !isDateEnabled(new Date(date?.toJSDate())) || false, [isDateEnabled]);
74
74
  const shouldDisableMonth = (0, _react.useCallback)(date => !isMonthEnabled(new Date(date?.toJSDate())) || false, [isMonthEnabled]);
@@ -91,7 +91,7 @@ const useOdysseyDateFields = ({
91
91
  }
92
92
  }
93
93
  return null;
94
- }, [defaultValue, validationDateRanges, value]);
94
+ }, [defaultValue, value]);
95
95
  const onTimeZoneChange = (0, _react.useCallback)(timeZone => {
96
96
  if (timeZone && isValidTimeZone(timeZone)) {
97
97
  setInternalTimeZone(timeZone);
@@ -1 +1 @@
1
- {"version":3,"file":"useOdysseyDateFields.cjs","names":["_react","require","_luxon","_reactI18next","_index","_inputUtils","_useDateFieldsTranslations","CONTROLLED","ComponentControlledState","isValidDateTime","dateTime","isValid","utcDateTimeFromIsoString","dateString","DateTime","fromISO","toUTC","useOdysseyDateFields","defaultValue","isDateEnabled","isMonthEnabled","isYearEnabled","minDate","minDateProp","maxDate","maxDateProp","onInputChange","onInputChangeProp","timeZone","value","isOpen","setIsOpen","useState","popperElement","setPopperElement","internalTimeZone","setInternalTimeZone","internalValueRef","useRef","validationDateRanges","setValidationDateRanges","undefined","useEffect","startOf","i18n","useTranslation","language","invalidLocales","isInvalidLocale","includes","localeText","useDateFieldsTranslations","controlledStateRef","getControlState","controlledValue","uncontrolledValue","defaultedLanguageCode","replaceAll","isValidTimeZone","local","setZone","formatDateTimeToUtcIsoDateString","useCallback","toISO","shouldDisableDate","date","Date","toJSDate","shouldDisableMonth","shouldDisableYear","inputValues","useMemo","current","valueAsUTCDateTime","defaultValueAsUTCDateTime","onTimeZoneChange","toggleCalendarVisibility","closeCalendar","formatDayOfWeek","toFormat","commonIcons","ArrowLeftIcon","ArrowRightIcon","CalendarIcon","ChevronDownIcon","exports"],"sources":["../../../src/DatePickers/useOdysseyDateFields.ts"],"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 {\n FocusEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { DateTime } from \"luxon\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FieldComponentProps } from \"../FieldComponentProps.js\";\nimport {\n ArrowLeftIcon,\n ArrowRightIcon,\n CalendarIcon,\n ChevronDownIcon,\n} from \"../icons.generated/index.js\";\nimport { ComponentControlledState, getControlState } from \"../inputUtils.js\";\nimport { TimeZoneOption, TimeZonePickerProps } from \"./TimeZonePicker.js\";\nimport { useDateFieldsTranslations } from \"./useDateFieldsTranslations.js\";\n\nconst { CONTROLLED } = ComponentControlledState;\n\nconst isValidDateTime = (dateTime: DateTime) => dateTime.isValid;\n\nconst utcDateTimeFromIsoString = (dateString: string) =>\n DateTime.fromISO(dateString).toUTC();\n\nexport type OdysseyDateFieldProps = {\n /**\n * default value when uncontrolled.\n *\n * NOTE: Must be a date string in ISO format\n */\n defaultValue?: string;\n /**\n * Disable specific date(s).\n *\n * Warning: This function can be called multiple times (for example when rendering date calendar, checking if focus can be moved to a certain date, etc.). Expensive computations can impact performance.\n */\n isDateEnabled?: (date: Date) => boolean;\n /**\n * Disable specific month(s).\n */\n isMonthEnabled?: (date: Date) => boolean;\n /**\n * Disable specific year(s).\n */\n isYearEnabled?: (date: Date) => boolean;\n /**\n * The label for the `input` element.\n */\n label: string;\n /**\n * Minimum date allowed.\n *\n * NOTE: If not a valid date string in ISO format, `minDate` will not apply\n */\n minDate?: string;\n /**\n * Maximum date allowed.\n *\n * NOTE: If not a valid date string in ISO format, `maxDate` will not apply\n */\n maxDate?: string;\n /**\n * Callback fired when the a date field loses focus\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback fired when the a date is selected with the calendar.\n */\n onCalendarDateChange?: ({\n value,\n timeZone,\n }: {\n value: string | undefined;\n timeZone: string;\n }) => void;\n /**\n * Callback fired when the date/text input changes.\n */\n onInputChange?: (value: string) => void;\n /**\n * a default timezone for the picker\n */\n timeZone?: string;\n /**\n * If provided, a `TimeZonePicker` will be rendered below the DatePicker. These options will populate as the Autocomplete options\n */\n timeZoneOptions?: TimeZoneOption[];\n /**\n * label for `TimeZonePicker`\n */\n timeZonePickerLabel?: TimeZonePickerProps[\"label\"];\n /**\n * value when controlled.\n *\n * NOTE: Must be a date string in ISO format or it will not be applied\n */\n value?: string;\n};\n\ntype FormatDateTimeToUtcIsoDateString = (value: DateTime) => string | undefined;\n\ntype ValidationDateRanges = {\n minDate?: DateTime;\n maxDate?: DateTime;\n};\n\nexport const useOdysseyDateFields = ({\n defaultValue,\n isDateEnabled = () => true,\n isMonthEnabled = () => true,\n isYearEnabled = () => true,\n minDate: minDateProp,\n maxDate: maxDateProp,\n onInputChange: onInputChangeProp,\n timeZone = \"system\",\n value,\n}: Pick<\n OdysseyDateFieldProps,\n | \"defaultValue\"\n | \"isDateEnabled\"\n | \"isMonthEnabled\"\n | \"isYearEnabled\"\n | \"minDate\"\n | \"maxDate\"\n | \"onInputChange\"\n | \"timeZone\"\n | \"value\"\n> &\n Pick<FieldComponentProps, \"errorMessage\">) => {\n const [isOpen, setIsOpen] = useState(false);\n const [popperElement, setPopperElement] = useState<HTMLInputElement | null>();\n const [internalTimeZone, setInternalTimeZone] = useState(timeZone);\n\n const internalValueRef = useRef<DateTime | null>(null);\n\n const [validationDateRanges, setValidationDateRanges] =\n useState<ValidationDateRanges>({\n minDate: undefined,\n maxDate: undefined,\n });\n\n useEffect(() => {\n const minDate = minDateProp ? DateTime.fromISO(minDateProp) : undefined;\n const maxDate = maxDateProp ? DateTime.fromISO(maxDateProp) : undefined;\n\n setValidationDateRanges({\n minDate:\n minDate && isValidDateTime(minDate)\n ? minDate.startOf(\"day\")\n : undefined,\n maxDate:\n maxDate && isValidDateTime(maxDate)\n ? maxDate.startOf(\"day\")\n : undefined,\n });\n }, [minDateProp, maxDateProp]);\n\n const { i18n } = useTranslation();\n const { language } = i18n;\n\n const invalidLocales = [\"ok_PL\", \"ok_SK\"];\n // In the Applitools env the language code is `en-us@posix`. Need to check for that\n const isInvalidLocale =\n invalidLocales.includes(language) || language.includes(\"@\");\n\n const localeText = useDateFieldsTranslations();\n\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n\n const defaultedLanguageCode = isInvalidLocale\n ? \"en-US\"\n : language.replaceAll(\"_\", \"-\");\n\n const isValidTimeZone = (timeZone: string) =>\n DateTime.local().setZone(timeZone).isValid;\n\n const formatDateTimeToUtcIsoDateString =\n useCallback<FormatDateTimeToUtcIsoDateString>(\n (value) => value.toUTC().toISO() || undefined,\n [],\n );\n\n const shouldDisableDate = useCallback(\n (date: DateTime) => !isDateEnabled(new Date(date?.toJSDate())) || false,\n [isDateEnabled],\n );\n\n const shouldDisableMonth = useCallback(\n (date: DateTime) => !isMonthEnabled(new Date(date?.toJSDate())) || false,\n [isMonthEnabled],\n );\n\n const shouldDisableYear = useCallback(\n (date: DateTime) => !isYearEnabled(new Date(date?.toJSDate())) || false,\n [isYearEnabled],\n );\n\n const inputValues = useMemo(() => {\n if (value && controlledStateRef.current === CONTROLLED) {\n const valueAsUTCDateTime = utcDateTimeFromIsoString(value);\n\n if (isValidDateTime(valueAsUTCDateTime)) {\n return {\n value: valueAsUTCDateTime,\n };\n }\n }\n\n if (defaultValue) {\n const defaultValueAsUTCDateTime = utcDateTimeFromIsoString(defaultValue);\n\n if (isValidDateTime(defaultValueAsUTCDateTime)) {\n return {\n defaultValue: defaultValueAsUTCDateTime,\n };\n }\n }\n\n return null;\n }, [defaultValue, validationDateRanges, value]);\n\n const onTimeZoneChange = useCallback(\n (timeZone: string | undefined) => {\n if (timeZone && isValidTimeZone(timeZone)) {\n setInternalTimeZone(timeZone);\n }\n },\n [isValidTimeZone, setInternalTimeZone],\n );\n\n const toggleCalendarVisibility = useCallback(\n () => setIsOpen(!isOpen),\n [isOpen, setIsOpen],\n );\n\n const closeCalendar = useCallback(() => {\n setIsOpen(false);\n }, [setIsOpen]);\n\n const formatDayOfWeek = (date: DateTime) => date.toFormat(\"EEE\");\n\n const onInputChange = useCallback<(value: string) => void>(\n (value) => {\n onInputChangeProp?.(value);\n },\n [onInputChangeProp],\n );\n\n const commonIcons = {\n ArrowLeftIcon: ArrowLeftIcon,\n ArrowRightIcon: ArrowRightIcon,\n CalendarIcon: CalendarIcon,\n ChevronDownIcon: ChevronDownIcon,\n };\n\n return {\n closeCalendar,\n commonIcons,\n defaultedLanguageCode,\n formatDateTimeToUtcIsoDateString,\n formatDayOfWeek,\n inputValues,\n internalTimeZone,\n internalValueRef,\n isOpen,\n isValidTimeZone,\n localeText,\n maxDate: validationDateRanges.maxDate,\n minDate: validationDateRanges.minDate,\n popperElement,\n onInputChange,\n onTimeZoneChange,\n setInternalTimeZone,\n setIsOpen,\n setPopperElement,\n shouldDisableDate,\n shouldDisableMonth,\n shouldDisableYear,\n toggleCalendarVisibility,\n };\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"useOdysseyDateFields.cjs","names":["_react","require","_luxon","_reactI18next","_index","_inputUtils","_useDateFieldsTranslations","CONTROLLED","ComponentControlledState","isValidDateTime","dateTime","isValid","utcDateTimeFromIsoString","dateString","DateTime","fromISO","toUTC","useOdysseyDateFields","defaultValue","isDateEnabled","isMonthEnabled","isYearEnabled","minDate","minDateProp","maxDate","maxDateProp","onInputChange","onInputChangeProp","timeZone","value","isOpen","setIsOpen","useState","popperElement","setPopperElement","internalTimeZone","setInternalTimeZone","internalValueRef","useRef","validationDateRanges","setValidationDateRanges","undefined","useEffect","startOf","i18n","useTranslation","language","invalidLocales","isInvalidLocale","includes","localeText","useDateFieldsTranslations","controlledStateRef","getControlState","controlledValue","uncontrolledValue","defaultedLanguageCode","replaceAll","isValidTimeZone","useCallback","local","setZone","formatDateTimeToUtcIsoDateString","toISO","shouldDisableDate","date","Date","toJSDate","shouldDisableMonth","shouldDisableYear","inputValues","useMemo","current","valueAsUTCDateTime","defaultValueAsUTCDateTime","onTimeZoneChange","toggleCalendarVisibility","closeCalendar","formatDayOfWeek","toFormat","commonIcons","ArrowLeftIcon","ArrowRightIcon","CalendarIcon","ChevronDownIcon","exports"],"sources":["../../../src/DatePickers/useOdysseyDateFields.ts"],"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 {\n FocusEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { DateTime } from \"luxon\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FieldComponentProps } from \"../FieldComponentProps.js\";\nimport {\n ArrowLeftIcon,\n ArrowRightIcon,\n CalendarIcon,\n ChevronDownIcon,\n} from \"../icons.generated/index.js\";\nimport { ComponentControlledState, getControlState } from \"../inputUtils.js\";\nimport { TimeZoneOption, TimeZonePickerProps } from \"./TimeZonePicker.js\";\nimport { useDateFieldsTranslations } from \"./useDateFieldsTranslations.js\";\n\nconst { CONTROLLED } = ComponentControlledState;\n\nconst isValidDateTime = (dateTime: DateTime) => dateTime.isValid;\n\nconst utcDateTimeFromIsoString = (dateString: string) =>\n DateTime.fromISO(dateString).toUTC();\n\nexport type OdysseyDateFieldProps = {\n /**\n * default value when uncontrolled.\n *\n * NOTE: Must be a date string in ISO format\n */\n defaultValue?: string;\n /**\n * Disable specific date(s).\n *\n * Warning: This function can be called multiple times (for example when rendering date calendar, checking if focus can be moved to a certain date, etc.). Expensive computations can impact performance.\n */\n isDateEnabled?: (date: Date) => boolean;\n /**\n * Disable specific month(s).\n */\n isMonthEnabled?: (date: Date) => boolean;\n /**\n * Disable specific year(s).\n */\n isYearEnabled?: (date: Date) => boolean;\n /**\n * The label for the `input` element.\n */\n label: string;\n /**\n * Minimum date allowed.\n *\n * NOTE: If not a valid date string in ISO format, `minDate` will not apply\n */\n minDate?: string;\n /**\n * Maximum date allowed.\n *\n * NOTE: If not a valid date string in ISO format, `maxDate` will not apply\n */\n maxDate?: string;\n /**\n * Callback fired when the a date field loses focus\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback fired when the a date is selected with the calendar.\n */\n onCalendarDateChange?: ({\n value,\n timeZone,\n }: {\n value: string | undefined;\n timeZone: string;\n }) => void;\n /**\n * Callback fired when the date/text input changes.\n */\n onInputChange?: (value: string) => void;\n /**\n * a default timezone for the picker\n */\n timeZone?: string;\n /**\n * If provided, a `TimeZonePicker` will be rendered below the DatePicker. These options will populate as the Autocomplete options\n */\n timeZoneOptions?: TimeZoneOption[];\n /**\n * label for `TimeZonePicker`\n */\n timeZonePickerLabel?: TimeZonePickerProps[\"label\"];\n /**\n * value when controlled.\n *\n * NOTE: Must be a date string in ISO format or it will not be applied\n */\n value?: string;\n};\n\ntype FormatDateTimeToUtcIsoDateString = (value: DateTime) => string | undefined;\n\ntype ValidationDateRanges = {\n minDate?: DateTime;\n maxDate?: DateTime;\n};\n\nexport const useOdysseyDateFields = ({\n defaultValue,\n isDateEnabled = () => true,\n isMonthEnabled = () => true,\n isYearEnabled = () => true,\n minDate: minDateProp,\n maxDate: maxDateProp,\n onInputChange: onInputChangeProp,\n timeZone = \"system\",\n value,\n}: Pick<\n OdysseyDateFieldProps,\n | \"defaultValue\"\n | \"isDateEnabled\"\n | \"isMonthEnabled\"\n | \"isYearEnabled\"\n | \"minDate\"\n | \"maxDate\"\n | \"onInputChange\"\n | \"timeZone\"\n | \"value\"\n> &\n Pick<FieldComponentProps, \"errorMessage\">) => {\n const [isOpen, setIsOpen] = useState(false);\n const [popperElement, setPopperElement] = useState<HTMLInputElement | null>();\n const [internalTimeZone, setInternalTimeZone] = useState(timeZone);\n\n const internalValueRef = useRef<DateTime | null>(null);\n\n const [validationDateRanges, setValidationDateRanges] =\n useState<ValidationDateRanges>({\n minDate: undefined,\n maxDate: undefined,\n });\n\n useEffect(() => {\n const minDate = minDateProp ? DateTime.fromISO(minDateProp) : undefined;\n const maxDate = maxDateProp ? DateTime.fromISO(maxDateProp) : undefined;\n\n setValidationDateRanges({\n minDate:\n minDate && isValidDateTime(minDate)\n ? minDate.startOf(\"day\")\n : undefined,\n maxDate:\n maxDate && isValidDateTime(maxDate)\n ? maxDate.startOf(\"day\")\n : undefined,\n });\n }, [minDateProp, maxDateProp]);\n\n const { i18n } = useTranslation();\n const { language } = i18n;\n\n const invalidLocales = [\"ok_PL\", \"ok_SK\"];\n // In the Applitools env the language code is `en-us@posix`. Need to check for that\n const isInvalidLocale =\n invalidLocales.includes(language) || language.includes(\"@\");\n\n const localeText = useDateFieldsTranslations();\n\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n\n const defaultedLanguageCode = isInvalidLocale\n ? \"en-US\"\n : language.replaceAll(\"_\", \"-\");\n\n const isValidTimeZone = useCallback(\n (timeZone: string) => DateTime.local().setZone(timeZone).isValid,\n [],\n );\n\n const formatDateTimeToUtcIsoDateString =\n useCallback<FormatDateTimeToUtcIsoDateString>(\n (value) => value.toUTC().toISO() || undefined,\n [],\n );\n\n const shouldDisableDate = useCallback(\n (date: DateTime) => !isDateEnabled(new Date(date?.toJSDate())) || false,\n [isDateEnabled],\n );\n\n const shouldDisableMonth = useCallback(\n (date: DateTime) => !isMonthEnabled(new Date(date?.toJSDate())) || false,\n [isMonthEnabled],\n );\n\n const shouldDisableYear = useCallback(\n (date: DateTime) => !isYearEnabled(new Date(date?.toJSDate())) || false,\n [isYearEnabled],\n );\n\n const inputValues = useMemo(() => {\n if (value && controlledStateRef.current === CONTROLLED) {\n const valueAsUTCDateTime = utcDateTimeFromIsoString(value);\n\n if (isValidDateTime(valueAsUTCDateTime)) {\n return {\n value: valueAsUTCDateTime,\n };\n }\n }\n\n if (defaultValue) {\n const defaultValueAsUTCDateTime = utcDateTimeFromIsoString(defaultValue);\n\n if (isValidDateTime(defaultValueAsUTCDateTime)) {\n return {\n defaultValue: defaultValueAsUTCDateTime,\n };\n }\n }\n\n return null;\n }, [defaultValue, value]);\n\n const onTimeZoneChange = useCallback(\n (timeZone: string | undefined) => {\n if (timeZone && isValidTimeZone(timeZone)) {\n setInternalTimeZone(timeZone);\n }\n },\n [isValidTimeZone, setInternalTimeZone],\n );\n\n const toggleCalendarVisibility = useCallback(\n () => setIsOpen(!isOpen),\n [isOpen, setIsOpen],\n );\n\n const closeCalendar = useCallback(() => {\n setIsOpen(false);\n }, [setIsOpen]);\n\n const formatDayOfWeek = (date: DateTime) => date.toFormat(\"EEE\");\n\n const onInputChange = useCallback<(value: string) => void>(\n (value) => {\n onInputChangeProp?.(value);\n },\n [onInputChangeProp],\n );\n\n const commonIcons = {\n ArrowLeftIcon: ArrowLeftIcon,\n ArrowRightIcon: ArrowRightIcon,\n CalendarIcon: CalendarIcon,\n ChevronDownIcon: ChevronDownIcon,\n };\n\n return {\n closeCalendar,\n commonIcons,\n defaultedLanguageCode,\n formatDateTimeToUtcIsoDateString,\n formatDayOfWeek,\n inputValues,\n internalTimeZone,\n internalValueRef,\n isOpen,\n isValidTimeZone,\n localeText,\n maxDate: validationDateRanges.maxDate,\n minDate: validationDateRanges.minDate,\n popperElement,\n onInputChange,\n onTimeZoneChange,\n setInternalTimeZone,\n setIsOpen,\n setPopperElement,\n shouldDisableDate,\n shouldDisableMonth,\n shouldDisableYear,\n toggleCalendarVisibility,\n };\n};\n"],"mappings":"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","ignoreList":[]}
@@ -62,8 +62,8 @@ const Field = ({
62
62
  component: fieldType === "group" ? "fieldset" : "div",
63
63
  disabled: isDisabled,
64
64
  error: Boolean(errorMessage) || Array.isArray(errorMessageList) && errorMessageList.length > 0,
65
- role: isRadioGroup ? "radiogroup" : undefined,
66
65
  fullWidth: isFullWidth,
66
+ role: isRadioGroup ? "radiogroup" : undefined,
67
67
  children: [fieldType === "group" ? (0, _jsxRuntime.jsxs)(_FormLabel2.default, {
68
68
  component: "legend",
69
69
  id: labelElementId,
@@ -1 +1 @@
1
- {"version":3,"file":"Field.cjs","names":["_react","require","_FieldError","_FieldHint","_FieldLabel","_Typography","_FieldsetContext","_reactI18next","_useUniqueId","_jsxRuntime","_interopRequireDefault","e","__esModule","default","fieldTypeValues","exports","Field","ariaDescribedBy","errorMessage","errorMessageList","fieldType","hasVisibleLabel","hint","HintLinkComponent","id","idOverride","isDisabled","isDisabledProp","isFullWidth","isRadioGroup","isOptional","isReadOnly","label","renderFieldComponent","t","useTranslation","useUniqueId","hintId","undefined","errorMessageElementId","labelElementId","localAriaDescribedBy","useMemo","join","trim","isFieldsetDisabled","useFieldset","jsxs","_FormControl2","component","disabled","error","Boolean","Array","isArray","length","role","fullWidth","children","_FormLabel2","Typography","color","jsx","FieldLabel","inputId","text","FieldHint","LinkComponent","FieldError","message","messageList","MemoizedField","memo","displayName"],"sources":["../../src/Field.tsx"],"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\nimport { memo, ReactElement, useMemo } from \"react\";\nimport {\n FormControl as MuiFormControl,\n FormLabel as MuiFormLabel,\n} from \"@mui/material\";\nimport { FieldComponentProps } from \"./FieldComponentProps.js\";\nimport { FieldError } from \"./FieldError.js\";\nimport { FieldHint } from \"./FieldHint.js\";\nimport { FieldLabel } from \"./FieldLabel.js\";\nimport { HtmlProps } from \"./HtmlProps.js\";\nimport { Typography } from \"./Typography.js\";\nimport { useFieldset } from \"./FieldsetContext.js\";\nimport { useTranslation } from \"react-i18next\";\nimport { useUniqueId } from \"./useUniqueId.js\";\n\nexport const fieldTypeValues = [\"single\", \"group\"] as const;\n\nexport type RenderFieldComponentProps = {\n ariaDescribedBy?: string;\n dataSe?: string;\n errorMessageElementId?: string;\n id: string;\n labelElementId: string;\n isReadOnly?: boolean;\n};\n\nexport type FieldProps = {\n /**\n * If `error` is not undefined, the `input` will indicate an error.\n */\n errorMessageList?: string[];\n /**\n * The field type determines how ARIA components are setup. It's important to use this to denote if you expect only one component (like a text field) or multiple (like a radio group).\n */\n fieldType: (typeof fieldTypeValues)[number];\n /**\n * If `true`, the Field label will be shown\n */\n hasVisibleLabel: boolean;\n /**\n * Important for narrowing down the `fieldset` role to \"radiogroup\".\n */\n isRadioGroup?: boolean;\n /**\n * Important for determining if children inherit error state\n */\n isCheckboxGroup?: boolean;\n /**\n * The label for the `input` element.\n */\n label: string;\n /**\n * The short hint displayed in the `input` before the user enters a value.\n */\n placeholder?: string;\n /**\n * Render-props function that sends back ARIA props to your field component.\n */\n renderFieldComponent: ({\n ariaDescribedBy,\n dataSe,\n errorMessageElementId,\n id,\n labelElementId,\n isReadOnly,\n }: RenderFieldComponentProps) => ReactElement;\n};\n\nconst Field = ({\n ariaDescribedBy,\n errorMessage,\n errorMessageList,\n fieldType,\n hasVisibleLabel,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled: isDisabledProp = false,\n isFullWidth = false,\n isRadioGroup = false,\n isOptional = false,\n isReadOnly = false,\n label,\n renderFieldComponent,\n}: FieldProps &\n Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"errorMessageList\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"id\"\n | \"isDisabled\"\n | \"isFullWidth\"\n | \"isOptional\"\n | \"isReadOnly\"\n > &\n Pick<HtmlProps, \"ariaDescribedBy\">) => {\n const { t } = useTranslation();\n\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n const errorMessageElementId =\n errorMessage || errorMessageList ? `${id}-error` : undefined;\n const labelElementId = `${id}-label`;\n\n const localAriaDescribedBy = useMemo(\n () =>\n [hintId, errorMessageElementId, ariaDescribedBy].join(\" \").trim() ||\n undefined,\n [ariaDescribedBy, errorMessageElementId, hintId],\n );\n\n const { isDisabled: isFieldsetDisabled } = useFieldset();\n\n const isDisabled = useMemo(\n () => isDisabledProp || isFieldsetDisabled,\n [isDisabledProp, isFieldsetDisabled],\n );\n\n return (\n <MuiFormControl\n component={fieldType === \"group\" ? \"fieldset\" : \"div\"}\n disabled={isDisabled}\n error={\n Boolean(errorMessage) ||\n (Array.isArray(errorMessageList) && errorMessageList.length > 0)\n }\n role={isRadioGroup ? \"radiogroup\" : undefined}\n fullWidth={isFullWidth}\n >\n {fieldType === \"group\" ? (\n <MuiFormLabel component=\"legend\" id={labelElementId}>\n {label}{\" \"}\n {isOptional && label && (\n <Typography component=\"span\" color=\"textSecondary\">\n ({t(\"fieldlabel.optional.text\")})\n </Typography>\n )}\n </MuiFormLabel>\n ) : (\n <FieldLabel\n hasVisibleLabel={hasVisibleLabel}\n id={labelElementId}\n inputId={id}\n isOptional={isOptional}\n text={label}\n />\n )}\n\n {hint && (\n <FieldHint id={hintId} LinkComponent={HintLinkComponent} text={hint} />\n )}\n\n {renderFieldComponent({\n ariaDescribedBy: localAriaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n isReadOnly,\n })}\n\n {(errorMessage || errorMessageList) && (\n <FieldError\n id={errorMessageElementId}\n message={errorMessage}\n messageList={errorMessageList}\n />\n )}\n </MuiFormControl>\n );\n};\n\nconst MemoizedField = memo(Field);\nMemoizedField.displayName = \"Field\";\n\nexport { MemoizedField as Field };\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Field.cjs","names":["_react","require","_FieldError","_FieldHint","_FieldLabel","_Typography","_FieldsetContext","_reactI18next","_useUniqueId","_jsxRuntime","_interopRequireDefault","e","__esModule","default","fieldTypeValues","exports","Field","ariaDescribedBy","errorMessage","errorMessageList","fieldType","hasVisibleLabel","hint","HintLinkComponent","id","idOverride","isDisabled","isDisabledProp","isFullWidth","isRadioGroup","isOptional","isReadOnly","label","renderFieldComponent","t","useTranslation","useUniqueId","hintId","undefined","errorMessageElementId","labelElementId","localAriaDescribedBy","useMemo","join","trim","isFieldsetDisabled","useFieldset","jsxs","_FormControl2","component","disabled","error","Boolean","Array","isArray","length","fullWidth","role","children","_FormLabel2","Typography","color","jsx","FieldLabel","inputId","text","FieldHint","LinkComponent","FieldError","message","messageList","MemoizedField","memo","displayName"],"sources":["../../src/Field.tsx"],"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\nimport { memo, ReactElement, useMemo } from \"react\";\nimport {\n FormControl as MuiFormControl,\n FormLabel as MuiFormLabel,\n} from \"@mui/material\";\nimport { FieldComponentProps } from \"./FieldComponentProps.js\";\nimport { FieldError } from \"./FieldError.js\";\nimport { FieldHint } from \"./FieldHint.js\";\nimport { FieldLabel } from \"./FieldLabel.js\";\nimport { HtmlProps } from \"./HtmlProps.js\";\nimport { Typography } from \"./Typography.js\";\nimport { useFieldset } from \"./FieldsetContext.js\";\nimport { useTranslation } from \"react-i18next\";\nimport { useUniqueId } from \"./useUniqueId.js\";\n\nexport const fieldTypeValues = [\"single\", \"group\"] as const;\n\nexport type RenderFieldComponentProps = {\n ariaDescribedBy?: string;\n dataSe?: string;\n errorMessageElementId?: string;\n id: string;\n labelElementId: string;\n isReadOnly?: boolean;\n};\n\nexport type FieldProps = {\n /**\n * If `error` is not undefined, the `input` will indicate an error.\n */\n errorMessageList?: string[];\n /**\n * The field type determines how ARIA components are setup. It's important to use this to denote if you expect only one component (like a text field) or multiple (like a radio group).\n */\n fieldType: (typeof fieldTypeValues)[number];\n /**\n * If `true`, the Field label will be shown\n */\n hasVisibleLabel: boolean;\n /**\n * Important for narrowing down the `fieldset` role to \"radiogroup\".\n */\n isRadioGroup?: boolean;\n /**\n * Important for determining if children inherit error state\n */\n isCheckboxGroup?: boolean;\n /**\n * The label for the `input` element.\n */\n label: string;\n /**\n * The short hint displayed in the `input` before the user enters a value.\n */\n placeholder?: string;\n /**\n * Render-props function that sends back ARIA props to your field component.\n */\n renderFieldComponent: ({\n ariaDescribedBy,\n dataSe,\n errorMessageElementId,\n id,\n labelElementId,\n isReadOnly,\n }: RenderFieldComponentProps) => ReactElement;\n};\n\nconst Field = ({\n ariaDescribedBy,\n errorMessage,\n errorMessageList,\n fieldType,\n hasVisibleLabel,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled: isDisabledProp = false,\n isFullWidth = false,\n isRadioGroup = false,\n isOptional = false,\n isReadOnly = false,\n label,\n renderFieldComponent,\n}: FieldProps &\n Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"errorMessageList\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"id\"\n | \"isDisabled\"\n | \"isFullWidth\"\n | \"isOptional\"\n | \"isReadOnly\"\n > &\n Pick<HtmlProps, \"ariaDescribedBy\">) => {\n const { t } = useTranslation();\n\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n const errorMessageElementId =\n errorMessage || errorMessageList ? `${id}-error` : undefined;\n const labelElementId = `${id}-label`;\n\n const localAriaDescribedBy = useMemo(\n () =>\n [hintId, errorMessageElementId, ariaDescribedBy].join(\" \").trim() ||\n undefined,\n [ariaDescribedBy, errorMessageElementId, hintId],\n );\n\n const { isDisabled: isFieldsetDisabled } = useFieldset();\n\n const isDisabled = useMemo(\n () => isDisabledProp || isFieldsetDisabled,\n [isDisabledProp, isFieldsetDisabled],\n );\n\n return (\n <MuiFormControl\n component={fieldType === \"group\" ? \"fieldset\" : \"div\"}\n disabled={isDisabled}\n error={\n Boolean(errorMessage) ||\n (Array.isArray(errorMessageList) && errorMessageList.length > 0)\n }\n fullWidth={isFullWidth}\n role={isRadioGroup ? \"radiogroup\" : undefined}\n >\n {fieldType === \"group\" ? (\n <MuiFormLabel component=\"legend\" id={labelElementId}>\n {label}{\" \"}\n {isOptional && label && (\n <Typography component=\"span\" color=\"textSecondary\">\n ({t(\"fieldlabel.optional.text\")})\n </Typography>\n )}\n </MuiFormLabel>\n ) : (\n <FieldLabel\n hasVisibleLabel={hasVisibleLabel}\n id={labelElementId}\n inputId={id}\n isOptional={isOptional}\n text={label}\n />\n )}\n\n {hint && (\n <FieldHint id={hintId} LinkComponent={HintLinkComponent} text={hint} />\n )}\n\n {renderFieldComponent({\n ariaDescribedBy: localAriaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n isReadOnly,\n })}\n\n {(errorMessage || errorMessageList) && (\n <FieldError\n id={errorMessageElementId}\n message={errorMessage}\n messageList={errorMessageList}\n />\n )}\n </MuiFormControl>\n );\n};\n\nconst MemoizedField = memo(Field);\nMemoizedField.displayName = \"Field\";\n\nexport { MemoizedField as Field };\n"],"mappings":"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","ignoreList":[]}
@@ -135,12 +135,6 @@ const Pagination = ({
135
135
  updatedPage = 1;
136
136
  }
137
137
  }
138
- console.log({
139
- page,
140
- updatedPage,
141
- rowsPerPage,
142
- updatedRowsPerPage
143
- });
144
138
  onPaginationChange({
145
139
  pageIndex: updatedPage,
146
140
  pageSize: updatedRowsPerPage
@@ -1 +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","console","log","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 || pageSize,\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 console.log({\n page,\n updatedPage,\n rowsPerPage,\n updatedRowsPerPage,\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":";;;;;;;AAYA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AAEA,IAAAG,IAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAEA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,2BAAA,GAAAN,OAAA;AAIA,IAAAO,cAAA,GAAAP,OAAA;AACA,IAAAQ,WAAA,GAAAR,OAAA;AAA6C,IAAAS,WAAA,GAAAT,OAAA;AAAA,SAAAD,uBAAAW,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AA1B7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAkBA,MAAMG,mBAAmB,GAAG,IAAAC,eAAM,EAAC,KAAK,CAAC,CAAC;EACxCC,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE;AAClB,CAAC,CAAC;AAEF,MAAMC,iBAAiB,GAAG,IAAAH,eAAM,EAAC,KAAK,EAAE;EACtCI,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEL,OAAO,EAAE,MAAM;EACfM,UAAU,EAAE,QAAQ;EACpBC,GAAG,EAAEF,mBAAmB,CAACG,QAAQ;EACjC,SAAS,EAAE;IACTR,OAAO,EAAE,MAAM;IACfM,UAAU,EAAE,QAAQ;IACpBC,GAAG,EAAEF,mBAAmB,CAACI;EAC3B;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,eAAe,GAAG,IAAAX,eAAM,EAAAY,WAAA,CAAAd,OAAA,EAAY;EACxCM,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEO,WAAW,EAAEP,mBAAmB,CAACQ,aAAa;EAC9CC,YAAY,EAAET,mBAAmB,CAACU,iBAAiB;EACnDC,MAAM,EAAEX,mBAAmB,CAACY,QAAQ;EACpCC,KAAK,EAAE,iBAAiB;EACxB,SAAS,EAAE;IACTN,WAAW,EAAEP,mBAAmB,CAACc;EACnC,CAAC;EACD,qBAAqB,EAAE;IACrBP,WAAW,EAAEP,mBAAmB,CAACe;EACnC;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,yBAAyB,GAAG,IAAAtB,eAAM,EAAC,KAAK,CAAC,CAAC;EAC9C,OAAO,EAAE;IACPuB,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AA0FF,MAAMC,UAAU,GAAGA,CAAC;EAClBC,gBAAgB,EAAEC,oBAAoB;EACtCC,gBAAgB;EAChBC,YAAY,GAAG,IAAI;EACnBC,gBAAgB,GAAG,IAAI;EACvBC,gBAAgB,GAAG,IAAI;EACvBC,UAAU;EACVC,cAAc;EACdC,OAAO;EACPC,aAAa,EAAEC,iBAAiB;EAChCC,YAAY;EACZC,WAAW;EACXC,SAAS,EAAEC,aAAa;EACxBC,kBAAkB,EAAEC,sBAAsB;EAC1CC,SAAS;EACTC,QAAQ;EACRC,aAAa,EAAEC,iBAAiB;EAChCC,gBAAgB,EAAEC,oBAAoB;EACtCC,SAAS;EACTC;AACe,CAAC,KAAK;EACrB,MAAM3C,mBAAmB,GAAG,IAAA4C,kDAAsB,EAAC,CAAC;EACpD,MAAM;IAAEC;EAAE,CAAC,GAAG,IAAAC,4BAAc,EAAC,CAAC;EAE9B,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAG,IAAAC,eAAQ,EAASb,SAAS,CAAC;EACnD,MAAM,CAACc,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAF,eAAQ,EAASZ,QAAQ,CAAC;EAChE,MAAMe,kBAAkB,GAAG,IAAAC,aAAM,EAAShB,QAAQ,CAAC;EAEnD,MAAMlB,gBAAgB,GAAGC,oBAAoB,IAAIyB,CAAC,CAAC,iBAAiB,CAAC;EACrE,MAAMjB,aAAa,GAAGC,iBAAiB,IAAIgB,CAAC,CAAC,qBAAqB,CAAC;EACnE,MAAMb,SAAS,GAAGC,aAAa,IAAIY,CAAC,CAAC,iBAAiB,CAAC;EACvD,MAAMP,aAAa,GAAGC,iBAAiB,IAAIM,CAAC,CAAC,qBAAqB,CAAC;EACnE,MAAML,gBAAgB,GAAGC,oBAAoB,IAAII,CAAC,CAAC,wBAAwB,CAAC;EAE5E,IAAAS,gBAAS,EAAC,MAAM;IACdN,OAAO,CAACZ,SAAS,CAAC;IAClBe,cAAc,CAACd,QAAQ,CAAC;EAC1B,CAAC,EAAE,CAACD,SAAS,EAAEC,QAAQ,CAAC,CAAC;EAEzB,MAAMH,kBAAkB,GAAG,IAAAqB,kBAAW,EACpC,CAAC;IAAEnB,SAAS;IAAEC;EAAkD,CAAC,KAAK;IACpEF,sBAAsB,CAAC;MAAEC,SAAS;MAAEC;IAAS,CAAC,CAAC;EACjD,CAAC,EACD,CAACF,sBAAsB,CACzB,CAAC;EAED,MAAM;IAAEqB;EAAe,CAAC,GAAG,IAAAC,4BAAa,EAAC;IACvCrB,SAAS;IACTC,QAAQ;IACRhB,gBAAgB,EAAEA,gBAAgB,IAAIgB,QAAQ;IAC9CK;EACF,CAAC,CAAC;EAEF,MAAMgB,sBAAsB,GAAG,IAAAH,kBAAW,EAAC,MAAM;IAC/C,IAAII,WAAW,GAAGZ,IAAI;IACtB,IAAIa,kBAAkB,GAAGV,WAAW;IAEpC,IAAIR,SAAS,EAAE;MACb,MAAMZ,YAAY,GAAG+B,IAAI,CAACC,IAAI,CAACpB,SAAS,GAAGkB,kBAAkB,CAAC;MAG9D,IAAIA,kBAAkB,GAAGlB,SAAS,EAAE;QAClCkB,kBAAkB,GAAGlB,SAAS;MAChC;MAGA,IAAIiB,WAAW,GAAG7B,YAAY,EAAE;QAC9B6B,WAAW,GAAG7B,YAAY;MAC5B,CAAC,MAAM,IAAI6B,WAAW,GAAG,CAAC,EAAE;QAC1BA,WAAW,GAAG,CAAC;MACjB;IACF;IAEAI,OAAO,CAACC,GAAG,CAAC;MACVjB,IAAI;MACJY,WAAW;MACXT,WAAW;MACXU;IACF,CAAC,CAAC;IAEF1B,kBAAkB,CAAC;MACjBE,SAAS,EAAEuB,WAAW;MACtBtB,QAAQ,EAAEuB;IACZ,CAAC,CAAC;EACJ,CAAC,EAAE,CAACb,IAAI,EAAEG,WAAW,EAAEhB,kBAAkB,EAAEQ,SAAS,CAAC,CAAC;EAKtD,MAAMuB,gBAAgB,GAAG,IAAAV,kBAAW,EACjCW,KAAkE,IAAK;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,EAAE;MACzBjC,kBAAkB,CAAC;QACjBE,SAAS,EAAEgC,QAAQ,CAACF,KAAK,CAACG,aAAa,CAACC,KAAK,CAAC;QAC9CjC,QAAQ,EAAEa;MACZ,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAACA,WAAW,EAAEhB,kBAAkB,CAClC,CAAC;EAED,MAAMqC,uBAAuB,GAAG,IAAAhB,kBAAW,EACxCW,KAAkE,IAAK;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,EAAE;MACzBjC,kBAAkB,CAAC;QACjBE,SAAS,EAAEW,IAAI;QACfV,QAAQ,EAAE+B,QAAQ,CAACF,KAAK,CAACG,aAAa,CAACC,KAAK;MAC9C,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAACvB,IAAI,EAAEb,kBAAkB,CAC3B,CAAC;EAED,MAAMsC,gBAAgB,GAAG,IAAAjB,kBAAW,EACjCW,KAA0C,IAAK;IAC9C,MAAMI,KAAK,GAAGxC,YAAY,GACtB+B,IAAI,CAACY,GAAG,CAACL,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC,EAAExC,YAAY,CAAC,GACpDsC,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC;IAChCtB,OAAO,CAACsB,KAAK,CAAC;EAChB,CAAC,EACD,CAACtB,OAAO,EAAElB,YAAY,CACxB,CAAC;EAED,MAAM6C,uBAAuB,GAAG,IAAApB,kBAAW,EACxCW,KAA0C,IAAK;IAC9C,MAAMI,KAAK,GAAGvC,WAAW,GACrB8B,IAAI,CAACY,GAAG,CAACL,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC,EAAEvC,WAAW,CAAC,GACnDqC,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC;IAGhCnB,cAAc,CAACU,IAAI,CAACe,GAAG,CAAC,CAAC,EAAEN,KAAK,CAAC,CAAC;EACpC,CAAC,EACD,CAACnB,cAAc,EAAEpB,WAAW,CAC9B,CAAC;EAED,MAAM8C,cAAc,GAAG,IAAAtB,kBAAW,EAAC,MAAM;IACvCrB,kBAAkB,CAAC;MACjBE,SAAS,EAAE,CAAC;MACZC,QAAQ,EAAEa,WAAW,GAAGE,kBAAkB,CAAC0B;IAC7C,CAAC,CAAC;EACJ,CAAC,EAAE,CAAC5B,WAAW,EAAEhB,kBAAkB,CAAC,CAAC;EAErC,MAAM6C,gBAAgB,GAAG,IAAAxB,kBAAW,EAAC,MAAM;IACzCrB,kBAAkB,CAAC;MAAEE,SAAS,EAAEW,IAAI,GAAG,CAAC;MAAEV,QAAQ,EAAEa;IAAY,CAAC,CAAC;EACpE,CAAC,EAAE,CAAChB,kBAAkB,EAAEa,IAAI,EAAEG,WAAW,CAAC,CAAC;EAE3C,MAAM8B,oBAAoB,GAAG,IAAAzB,kBAAW,EAAC,MAAM;IAC7CrB,kBAAkB,CAAC;MAAEE,SAAS,EAAEW,IAAI,GAAG,CAAC;MAAEV,QAAQ,EAAEa;IAAY,CAAC,CAAC;EACpE,CAAC,EAAE,CAAChB,kBAAkB,EAAEa,IAAI,EAAEG,WAAW,CAAC,CAAC;EAE3C,MAAM+B,kBAAkB,GAAG,IAAAC,cAAO,EAAC,MAAM;IACvC,OAAOxD,cAAc,KAAKgB,SAAS,GAAGQ,WAAW,IAAIR,SAAS,GAAG,KAAK,CAAC;EACzE,CAAC,EAAE,CAAChB,cAAc,EAAEwB,WAAW,EAAER,SAAS,CAAC,CAAC;EAE5C,MAAMyC,kBAAkB,GAAG,IAAAD,cAAO,EAChC,MACExD,cAAc,IACbC,OAAO,KAAKe,SAAS,GAAGf,OAAO,IAAIe,SAAS,GAAG,KAAK,CAAE,IACvDjB,UAAU,EACZ,CAACC,cAAc,EAAEgB,SAAS,EAAEf,OAAO,EAAEF,UAAU,CACjD,CAAC;EAED,MAAM2D,sBAAsB,GAAG,IAAAF,cAAO,EACpC,MAAM9C,SAAS,IAAI,CAAC,IAAIX,UAAU,EAClC,CAACW,SAAS,EAAEX,UAAU,CACxB,CAAC;EAED,MAAM4D,qBAAqB,GAAG,IAAAH,cAAO,EACnC,OAAO;IACL,YAAY,EAAE1C,gBAAgB;IAC9BoC,GAAG,EAAE7C,WAAW,IAAIW;EACtB,CAAC,CAAC,EACF,CAACX,WAAW,EAAES,gBAAgB,EAAEE,SAAS,CAC3C,CAAC;EAED,MAAM4C,qBAAqB,GAAG,IAAAJ,cAAO,EACnC,OAAO;IACL,YAAY,EAAE/D,gBAAgB;IAC9ByD,GAAG,EAAE9C;EACP,CAAC,CAAC,EACF,CAACX,gBAAgB,EAAEW,YAAY,CACjC,CAAC;EAED,OAAOa,OAAO,KAAK,OAAO,GACxB,IAAAtD,WAAA,CAAAkG,IAAA,EAAC9F,mBAAmB;IAAC,cAAYoD,CAAC,CAAC,kBAAkB,CAAE;IAAA2C,QAAA,GACrD,IAAAnG,WAAA,CAAAkG,IAAA,EAAC1F,iBAAiB;MAACG,mBAAmB,EAAEA,mBAAoB;MAAAwF,QAAA,GACzDjE,gBAAgB,IACf,IAAAlC,WAAA,CAAAkG,IAAA,EAACxG,IAAA,CAAA0G,GAAG;QAAAD,QAAA,GACF,IAAAnG,WAAA,CAAAqG,GAAA,EAACtG,WAAA,CAAAuG,SAAS;UAACC,SAAS,EAAC,MAAM;UAACC,KAAK,EAAC,eAAe;UAAAL,QAAA,EAC9ChD;QAAgB,CACR,CAAC,EACZ,IAAAnD,WAAA,CAAAqG,GAAA,EAACrF,eAAe;UACdL,mBAAmB,EAAEA,mBAAoB;UACzC8F,IAAI,EAAC,QAAQ;UACbxB,KAAK,EAAEpB,WAAY;UACnB6C,QAAQ,EAAEpB,uBAAwB;UAClCqB,MAAM,EAAEtC,sBAAuB;UAC/BuC,SAAS,EAAE1B,uBAAwB;UACnC2B,QAAQ,EAAEzE,UAAW;UACrB0E,UAAU,EAAEd;QAAsB,CACnC,CAAC;MAAA,CACC,CACN,EACA7D,gBAAgB,IACf,IAAAnC,WAAA,CAAAqG,GAAA,EAACtG,WAAA,CAAAuG,SAAS;QAACC,SAAS,EAAC,MAAM;QAACC,KAAK,EAAC,eAAe;QAAAL,QAAA,EAC9ChC;MAAc,CACN,CACZ;IAAA,CACgB,CAAC,EAEpB,IAAAnE,WAAA,CAAAkG,IAAA,EAAC1F,iBAAiB;MAACG,mBAAmB,EAAEA,mBAAoB;MAAAwF,QAAA,GACzD9C,SAAS,IAAIpB,YAAY,IACxB,IAAAjC,WAAA,CAAAkG,IAAA,EAACxG,IAAA,CAAA0G,GAAG;QAAAD,QAAA,GACF,IAAAnG,WAAA,CAAAqG,GAAA,EAACtG,WAAA,CAAAuG,SAAS;UAACC,SAAS,EAAC,MAAM;UAACC,KAAK,EAAC,eAAe;UAAAL,QAAA,EAC9CrE;QAAgB,CACR,CAAC,EACZ,IAAA9B,WAAA,CAAAqG,GAAA,EAACrF,eAAe;UACdL,mBAAmB,EAAEA,mBAAoB;UACzC8F,IAAI,EAAC,QAAQ;UACbxB,KAAK,EAAEvB,IAAK;UACZgD,QAAQ,EAAEvB,gBAAiB;UAC3BwB,MAAM,EAAEtC,sBAAuB;UAC/BuC,SAAS,EAAEhC,gBAAiB;UAC5BiC,QAAQ,EAAEzE,UAAW;UACrB0E,UAAU,EAAEb;QAAsB,CACnC,CAAC;MAAA,CACC,CACN,EACD,IAAAjG,WAAA,CAAAkG,IAAA,EAACvE,yBAAyB;QAAAwE,QAAA,GACxB,IAAAnG,WAAA,CAAAqG,GAAA,EAAC1G,MAAA,CAAAoH,MAAM;UACLC,SAAS,EAAE,IAAAhH,WAAA,CAAAqG,GAAA,EAACzG,OAAA,CAAAqH,aAAa,IAAE,CAAE;UAC7B3D,OAAO,EAAC,UAAU;UAClB4D,IAAI,EAAC,OAAO;UACZC,SAAS,EAAElE,aAAc;UACzBmE,OAAO,EAAEzB,oBAAqB;UAC9BvD,UAAU,EAAE2D;QAAuB,CACpC,CAAC,EACF,IAAA/F,WAAA,CAAAqG,GAAA,EAAC1G,MAAA,CAAAoH,MAAM;UACLM,OAAO,EAAE,IAAArH,WAAA,CAAAqG,GAAA,EAACzG,OAAA,CAAA0H,cAAc,IAAE,CAAE;UAC5BhE,OAAO,EAAC,UAAU;UAClB4D,IAAI,EAAC,OAAO;UACZC,SAAS,EAAExE,SAAU;UACrByE,OAAO,EAAE1B,gBAAiB;UAC1BtD,UAAU,EAAE0D;QAAmB,CAChC,CAAC;MAAA,CACuB,CAAC;IAAA,CACX,CAAC;EAAA,CACD,CAAC,GAEtB,IAAA9F,WAAA,CAAAqG,GAAA,EAAC1G,MAAA,CAAAoH,MAAM;IACLzD,OAAO,EAAC,WAAW;IACnBiE,KAAK,EAAEhF,aAAc;IACrB6E,OAAO,EAAE5B,cAAe;IACxBpD,UAAU,EAAEwD;EAAmB,CAChC,CACF;AACH,CAAC;AAED,MAAM4B,kBAAkB,GAAAC,OAAA,CAAA5F,UAAA,GAAG,IAAA6F,WAAI,EAAC7F,UAAU,CAAC;AAC3C2F,kBAAkB,CAACG,WAAW,GAAG,YAAY","ignoreList":[]}
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 || pageSize,\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":[]}
@@ -45,7 +45,7 @@ const useInputValues = ({
45
45
  return {
46
46
  defaultValue
47
47
  };
48
- }, [defaultValue, value]);
48
+ }, [controlState, defaultValue, value]);
49
49
  return inputValues;
50
50
  };
51
51
  exports.useInputValues = useInputValues;
@@ -1 +1 @@
1
- {"version":3,"file":"inputUtils.cjs","names":["_react","require","ComponentControlledState","exports","CONTROLLED","UNCONTROLLED","getControlState","controlledValue","uncontrolledValue","undefined","useInputValues","defaultValue","value","controlState","inputValues","useMemo"],"sources":["../../src/inputUtils.ts"],"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 { useMemo } from \"react\";\n\nexport type FocusHandle = {\n focus: () => void;\n};\n\ntype UseControlledStateProps<Value> = {\n controlledValue?: Value;\n uncontrolledValue?: Value;\n};\n\nexport const ComponentControlledState = {\n CONTROLLED: \"CONTROLLED\",\n UNCONTROLLED: \"UNCONTROLLED\",\n};\n\nexport type ModeType = keyof typeof ComponentControlledState;\nexport type ModeTypeValue = (typeof ComponentControlledState)[ModeType];\n\nexport const getControlState = <Value>({\n controlledValue,\n uncontrolledValue,\n}: UseControlledStateProps<Value>): ModeTypeValue => {\n if (uncontrolledValue !== undefined || controlledValue === undefined) {\n return ComponentControlledState.UNCONTROLLED;\n }\n return ComponentControlledState.CONTROLLED;\n};\n\ntype InputValueProps<Value> = {\n defaultValue?: Value;\n value?: Value;\n controlState: ModeTypeValue;\n};\n\ntype InputValue<Value> =\n | {\n defaultValue: Value | undefined;\n value?: undefined;\n }\n | {\n value: Value | undefined;\n defaultValue?: undefined;\n };\n\n/**\n * In components that support being used in a controlled or uncontrolled way, the defaultValue and value props need\n * to be suppled values in a mutually exclusive way.\n * If a `value` is being provided to the component, then it is being used in a controlled manner and `defaultValue` needs to be undefined.\n * If `value` is undefined, then that means the component is being used in an uncontrolled way and `defaultValue` is either Value or undefined.\n * This helper helps ensure this mutual exclusivity between the 2 props so the component can operate as expected.\n *\n * @param {InputValueProps<Value>}: { defaultValue: Value | undefined, value: Value | undefined }\n * @returns {InputValue<Value>}: { defaultValue: Value | undefined, value?: undefined } | { defaultValue?: undefined, value: Value }\n */\nexport const useInputValues = <Value>({\n defaultValue,\n value,\n controlState,\n}: InputValueProps<Value>): InputValue<Value> => {\n const inputValues = useMemo(() => {\n if (controlState === ComponentControlledState.CONTROLLED) {\n return { value };\n }\n return { defaultValue };\n }, [defaultValue, value]);\n return inputValues;\n};\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAZA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAaO,MAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG;EACtCE,UAAU,EAAE,YAAY;EACxBC,YAAY,EAAE;AAChB,CAAC;AAKM,MAAMC,eAAe,GAAGA,CAAQ;EACrCC,eAAe;EACfC;AAC8B,CAAC,KAAoB;EACnD,IAAIA,iBAAiB,KAAKC,SAAS,IAAIF,eAAe,KAAKE,SAAS,EAAE;IACpE,OAAOP,wBAAwB,CAACG,YAAY;EAC9C;EACA,OAAOH,wBAAwB,CAACE,UAAU;AAC5C,CAAC;AAACD,OAAA,CAAAG,eAAA,GAAAA,eAAA;AA4BK,MAAMI,cAAc,GAAGA,CAAQ;EACpCC,YAAY;EACZC,KAAK;EACLC;AACsB,CAAC,KAAwB;EAC/C,MAAMC,WAAW,GAAG,IAAAC,cAAO,EAAC,MAAM;IAChC,IAAIF,YAAY,KAAKX,wBAAwB,CAACE,UAAU,EAAE;MACxD,OAAO;QAAEQ;MAAM,CAAC;IAClB;IACA,OAAO;MAAED;IAAa,CAAC;EACzB,CAAC,EAAE,CAACA,YAAY,EAAEC,KAAK,CAAC,CAAC;EACzB,OAAOE,WAAW;AACpB,CAAC;AAACX,OAAA,CAAAO,cAAA,GAAAA,cAAA","ignoreList":[]}
1
+ {"version":3,"file":"inputUtils.cjs","names":["_react","require","ComponentControlledState","exports","CONTROLLED","UNCONTROLLED","getControlState","controlledValue","uncontrolledValue","undefined","useInputValues","defaultValue","value","controlState","inputValues","useMemo"],"sources":["../../src/inputUtils.ts"],"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 { useMemo } from \"react\";\n\nexport type FocusHandle = {\n focus: () => void;\n};\n\ntype UseControlledStateProps<Value> = {\n controlledValue?: Value;\n uncontrolledValue?: Value;\n};\n\nexport const ComponentControlledState = {\n CONTROLLED: \"CONTROLLED\",\n UNCONTROLLED: \"UNCONTROLLED\",\n};\n\nexport type ModeType = keyof typeof ComponentControlledState;\nexport type ModeTypeValue = (typeof ComponentControlledState)[ModeType];\n\nexport const getControlState = <Value>({\n controlledValue,\n uncontrolledValue,\n}: UseControlledStateProps<Value>): ModeTypeValue => {\n if (uncontrolledValue !== undefined || controlledValue === undefined) {\n return ComponentControlledState.UNCONTROLLED;\n }\n return ComponentControlledState.CONTROLLED;\n};\n\ntype InputValueProps<Value> = {\n defaultValue?: Value;\n value?: Value;\n controlState: ModeTypeValue;\n};\n\ntype InputValue<Value> =\n | {\n defaultValue: Value | undefined;\n value?: undefined;\n }\n | {\n value: Value | undefined;\n defaultValue?: undefined;\n };\n\n/**\n * In components that support being used in a controlled or uncontrolled way, the defaultValue and value props need\n * to be suppled values in a mutually exclusive way.\n * If a `value` is being provided to the component, then it is being used in a controlled manner and `defaultValue` needs to be undefined.\n * If `value` is undefined, then that means the component is being used in an uncontrolled way and `defaultValue` is either Value or undefined.\n * This helper helps ensure this mutual exclusivity between the 2 props so the component can operate as expected.\n *\n * @param {InputValueProps<Value>}: { defaultValue: Value | undefined, value: Value | undefined }\n * @returns {InputValue<Value>}: { defaultValue: Value | undefined, value?: undefined } | { defaultValue?: undefined, value: Value }\n */\nexport const useInputValues = <Value>({\n defaultValue,\n value,\n controlState,\n}: InputValueProps<Value>): InputValue<Value> => {\n const inputValues = useMemo(() => {\n if (controlState === ComponentControlledState.CONTROLLED) {\n return { value };\n }\n return { defaultValue };\n }, [controlState, defaultValue, value]);\n return inputValues;\n};\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAZA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAaO,MAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG;EACtCE,UAAU,EAAE,YAAY;EACxBC,YAAY,EAAE;AAChB,CAAC;AAKM,MAAMC,eAAe,GAAGA,CAAQ;EACrCC,eAAe;EACfC;AAC8B,CAAC,KAAoB;EACnD,IAAIA,iBAAiB,KAAKC,SAAS,IAAIF,eAAe,KAAKE,SAAS,EAAE;IACpE,OAAOP,wBAAwB,CAACG,YAAY;EAC9C;EACA,OAAOH,wBAAwB,CAACE,UAAU;AAC5C,CAAC;AAACD,OAAA,CAAAG,eAAA,GAAAA,eAAA;AA4BK,MAAMI,cAAc,GAAGA,CAAQ;EACpCC,YAAY;EACZC,KAAK;EACLC;AACsB,CAAC,KAAwB;EAC/C,MAAMC,WAAW,GAAG,IAAAC,cAAO,EAAC,MAAM;IAChC,IAAIF,YAAY,KAAKX,wBAAwB,CAACE,UAAU,EAAE;MACxD,OAAO;QAAEQ;MAAM,CAAC;IAClB;IACA,OAAO;MAAED;IAAa,CAAC;EACzB,CAAC,EAAE,CAACE,YAAY,EAAEF,YAAY,EAAEC,KAAK,CAAC,CAAC;EACvC,OAAOE,WAAW;AACpB,CAAC;AAACX,OAAA,CAAAO,cAAA,GAAAA,cAAA","ignoreList":[]}
@@ -40,7 +40,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
40
40
  * See the License for the specific language governing permissions and limitations under the License.
41
41
  */
42
42
 
43
- const AutocompleteOuterContainer = (0, _styled.default)("div", {
43
+ const StyledAutocompleteOuterContainer = (0, _styled.default)("div", {
44
44
  shouldForwardProp: prop => prop !== "odysseyDesignTokens"
45
45
  })(({
46
46
  odysseyDesignTokens
@@ -49,7 +49,7 @@ const AutocompleteOuterContainer = (0, _styled.default)("div", {
49
49
  alignItems: "flex-end",
50
50
  gap: odysseyDesignTokens.Spacing2
51
51
  }));
52
- const AutocompleteInnerContainer = (0, _styled.default)("div")({
52
+ const StyledAutocompleteInnerContainer = (0, _styled.default)("div")({
53
53
  width: "100%"
54
54
  });
55
55
  const FilterTags = ({
@@ -370,9 +370,9 @@ const DataFilters = ({
370
370
  },
371
371
  noValidate: true,
372
372
  children: filterPopoverCurrentFilter?.render ? filterPopoverCurrentFilter.render(updateFilters) : (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
373
- children: [filterPopoverCurrentFilter?.variant === "autocomplete" && filterPopoverCurrentFilter?.options && (0, _jsxRuntime.jsxs)(AutocompleteOuterContainer, {
373
+ children: [filterPopoverCurrentFilter?.variant === "autocomplete" && filterPopoverCurrentFilter?.options && (0, _jsxRuntime.jsxs)(StyledAutocompleteOuterContainer, {
374
374
  odysseyDesignTokens: odysseyDesignTokens,
375
- children: [(0, _jsxRuntime.jsx)(AutocompleteInnerContainer, {
375
+ children: [(0, _jsxRuntime.jsx)(StyledAutocompleteInnerContainer, {
376
376
  children: (0, _jsxRuntime.jsx)(_Autocomplete.Autocomplete, {
377
377
  hasMultipleChoices: true,
378
378
  isCustomValueAllowed: filterPopoverCurrentFilter?.isCustomValueAllowed,