@kosmeo-ui/react 0.1.1 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -1
- package/dist/components/buttons/button/index.d.ts +2 -0
- package/dist/components/buttons/button/index.d.ts.map +1 -1
- package/dist/components/buttons/button/index.js +2 -2
- package/dist/components/buttons/button/index.js.map +1 -1
- package/dist/components/buttons/button/styles.css +45 -43
- package/dist/components/buttons/rowActions/index.d.ts.map +1 -1
- package/dist/components/buttons/rowActions/index.js +2 -1
- package/dist/components/buttons/rowActions/index.js.map +1 -1
- package/dist/components/buttons/rowActions/styles.css +7 -0
- package/dist/components/data-display/addressBlock/styles.css +2 -4
- package/dist/components/data-display/colorSwatch/index.d.ts +1 -1
- package/dist/components/data-display/colorSwatch/index.d.ts.map +1 -1
- package/dist/components/data-display/colorSwatch/index.js +1 -1
- package/dist/components/data-display/colorSwatch/index.js.map +1 -1
- package/dist/components/data-display/colorSwatch/styles.css +1 -1
- package/dist/components/data-display/dataTable/index.d.ts.map +1 -1
- package/dist/components/data-display/dataTable/index.js +7 -3
- package/dist/components/data-display/dataTable/index.js.map +1 -1
- package/dist/components/data-display/dataTable/styles.css +18 -2
- package/dist/components/data-display/dataTable/utils/parseDataKey.d.ts +8 -1
- package/dist/components/data-display/dataTable/utils/parseDataKey.d.ts.map +1 -1
- package/dist/components/data-display/dataTable/utils/parseDataKey.js +13 -41
- package/dist/components/data-display/dataTable/utils/parseDataKey.js.map +1 -1
- package/dist/components/data-display/imagePreview/styles.css +2 -2
- package/dist/components/data-display/infiniteScroll/filters/index.d.ts +4 -0
- package/dist/components/data-display/infiniteScroll/filters/index.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/index.js +12 -2
- package/dist/components/data-display/infiniteScroll/filters/index.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/listFilter.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/listFilter.js +1 -1
- package/dist/components/data-display/infiniteScroll/filters/listFilter.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/rangeFilter.d.ts +6 -0
- package/dist/components/data-display/infiniteScroll/filters/rangeFilter.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/rangeFilter.js +55 -46
- package/dist/components/data-display/infiniteScroll/filters/rangeFilter.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/searchFilter.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/searchFilter.js +4 -35
- package/dist/components/data-display/infiniteScroll/filters/searchFilter.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/selectFilter.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/selectFilter.js +3 -5
- package/dist/components/data-display/infiniteScroll/filters/selectFilter.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/filters/styles.css +34 -1
- package/dist/components/data-display/infiniteScroll/header/deleteButton.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/deleteButton.js +1 -1
- package/dist/components/data-display/infiniteScroll/header/deleteButton.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/index.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/index.js +1 -1
- package/dist/components/data-display/infiniteScroll/header/index.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/limit.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/limit.js +1 -1
- package/dist/components/data-display/infiniteScroll/header/limit.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/sortBy.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/sortBy.js +1 -1
- package/dist/components/data-display/infiniteScroll/header/sortBy.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/sortDirection.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/header/sortDirection.js +1 -1
- package/dist/components/data-display/infiniteScroll/header/sortDirection.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/index.d.ts +8 -0
- package/dist/components/data-display/infiniteScroll/index.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/index.js +41 -23
- package/dist/components/data-display/infiniteScroll/index.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/styles.css +2 -2
- package/dist/components/data-display/infiniteScroll/table/index.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/table/index.js +2 -2
- package/dist/components/data-display/infiniteScroll/table/index.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/index.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/index.js +7 -11
- package/dist/components/data-display/infiniteScroll/tags/index.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/listFilterTag.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/listFilterTag.js +8 -8
- package/dist/components/data-display/infiniteScroll/tags/listFilterTag.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/rangeFilterTag.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/rangeFilterTag.js +6 -18
- package/dist/components/data-display/infiniteScroll/tags/rangeFilterTag.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/selectFilterTag.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/selectFilterTag.js +3 -5
- package/dist/components/data-display/infiniteScroll/tags/selectFilterTag.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/tags/styles.css +1 -29
- package/dist/components/data-display/infiniteScroll/utils/generateQueryString.d.ts +6 -0
- package/dist/components/data-display/infiniteScroll/utils/generateQueryString.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/utils/generateQueryString.js +24 -12
- package/dist/components/data-display/infiniteScroll/utils/generateQueryString.js.map +1 -1
- package/dist/components/data-display/infiniteScroll/utils/hasPendingChanges.d.ts +11 -1
- package/dist/components/data-display/infiniteScroll/utils/hasPendingChanges.d.ts.map +1 -1
- package/dist/components/data-display/infiniteScroll/utils/hasPendingChanges.js +37 -18
- package/dist/components/data-display/infiniteScroll/utils/hasPendingChanges.js.map +1 -1
- package/dist/components/data-display/listCard/styles.css +3 -3
- package/dist/components/data-display/listRow/styles.css +2 -2
- package/dist/components/data-display/recoveryCodeGrid/styles.css +3 -4
- package/dist/components/data-display/secretDisplay/styles.css +4 -4
- package/dist/components/data-display/statCard/styles.css +12 -12
- package/dist/components/data-display/summaryRow/styles.css +4 -4
- package/dist/components/data-display/table/index.d.ts.map +1 -1
- package/dist/components/data-display/table/index.js +2 -2
- package/dist/components/data-display/table/index.js.map +1 -1
- package/dist/components/data-display/table/styles.css +22 -11
- package/dist/components/data-display/tableFilters/index.d.ts +30 -0
- package/dist/components/data-display/tableFilters/index.d.ts.map +1 -0
- package/dist/components/data-display/tableFilters/index.js +67 -0
- package/dist/components/data-display/tableFilters/index.js.map +1 -0
- package/dist/components/data-display/tagCard/index.d.ts.map +1 -1
- package/dist/components/data-display/tagCard/index.js +1 -1
- package/dist/components/data-display/tagCard/index.js.map +1 -1
- package/dist/components/data-display/tagCard/styles.css +1 -1
- package/dist/components/feedback/alert/styles.css +15 -15
- package/dist/components/feedback/badge/index.d.ts.map +1 -1
- package/dist/components/feedback/badge/index.js +14 -8
- package/dist/components/feedback/badge/index.js.map +1 -1
- package/dist/components/feedback/badge/styles.css +45 -45
- package/dist/components/feedback/emptyState/styles.css +2 -4
- package/dist/components/feedback/loadingOverlay/styles.css +1 -1
- package/dist/components/feedback/progressBar/index.d.ts.map +1 -1
- package/dist/components/feedback/progressBar/index.js +7 -2
- package/dist/components/feedback/progressBar/index.js.map +1 -1
- package/dist/components/feedback/progressBar/styles.css +25 -16
- package/dist/components/feedback/spinner/styles.css +14 -24
- package/dist/components/feedback/tooltip/styles.css +9 -7
- package/dist/components/forms/detailField/styles.css +1 -1
- package/dist/components/forms/fieldShell/index.d.ts +3 -1
- package/dist/components/forms/fieldShell/index.d.ts.map +1 -1
- package/dist/components/forms/fieldShell/index.js +1 -1
- package/dist/components/forms/fieldShell/index.js.map +1 -1
- package/dist/components/forms/fieldShell/styles.css +5 -5
- package/dist/components/forms/form/styles.css +6 -6
- package/dist/components/forms/formActions/styles.css +4 -4
- package/dist/components/forms/formGrid/styles.css +32 -0
- package/dist/components/forms/infoRow/styles.css +2 -3
- package/dist/components/forms/optionsGroup/index.d.ts +3 -1
- package/dist/components/forms/optionsGroup/index.d.ts.map +1 -1
- package/dist/components/forms/optionsGroup/index.js +5 -1
- package/dist/components/forms/optionsGroup/index.js.map +1 -1
- package/dist/components/forms/optionsGroup/styles.css +1 -1
- package/dist/components/forms/requiredAsterisk/index.d.ts.map +1 -1
- package/dist/components/forms/requiredAsterisk/index.js +3 -2
- package/dist/components/forms/requiredAsterisk/index.js.map +1 -1
- package/dist/components/forms/requiredAsterisk/styles.css +1 -1
- package/dist/components/index.d.ts +4 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +2 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/inputs/checkbox/index.d.ts +6 -1
- package/dist/components/inputs/checkbox/index.d.ts.map +1 -1
- package/dist/components/inputs/checkbox/index.js +12 -3
- package/dist/components/inputs/checkbox/index.js.map +1 -1
- package/dist/components/inputs/checkbox/styles.css +11 -3
- package/dist/components/inputs/colorPicker/index.d.ts.map +1 -1
- package/dist/components/inputs/colorPicker/index.js +3 -1
- package/dist/components/inputs/colorPicker/index.js.map +1 -1
- package/dist/components/inputs/colorPicker/styles.css +3 -3
- package/dist/components/inputs/dateInput/index.d.ts +6 -6
- package/dist/components/inputs/dateInput/index.d.ts.map +1 -1
- package/dist/components/inputs/dateInput/index.js +15 -5
- package/dist/components/inputs/dateInput/index.js.map +1 -1
- package/dist/components/inputs/dateInput/styles.css +5 -5
- package/dist/components/inputs/dateInput/utils.d.ts +0 -1
- package/dist/components/inputs/dateInput/utils.d.ts.map +1 -1
- package/dist/components/inputs/dateInput/utils.js +13 -8
- package/dist/components/inputs/dateInput/utils.js.map +1 -1
- package/dist/components/inputs/dropdown/index.d.ts +2 -0
- package/dist/components/inputs/dropdown/index.d.ts.map +1 -1
- package/dist/components/inputs/dropdown/index.js +2 -2
- package/dist/components/inputs/dropdown/index.js.map +1 -1
- package/dist/components/inputs/dropdown/styles.css +2 -2
- package/dist/components/inputs/dropdownArrowButton/index.d.ts.map +1 -1
- package/dist/components/inputs/dropdownArrowButton/index.js +1 -1
- package/dist/components/inputs/dropdownArrowButton/index.js.map +1 -1
- package/dist/components/inputs/dropdownArrowButton/styles.css +7 -5
- package/dist/components/inputs/fileDropZone/index.d.ts.map +1 -1
- package/dist/components/inputs/fileDropZone/index.js +3 -2
- package/dist/components/inputs/fileDropZone/index.js.map +1 -1
- package/dist/components/inputs/fileDropZone/styles.css +12 -12
- package/dist/components/inputs/fileUpload/index.d.ts.map +1 -1
- package/dist/components/inputs/fileUpload/index.js +11 -6
- package/dist/components/inputs/fileUpload/index.js.map +1 -1
- package/dist/components/inputs/fileUpload/styles.css +9 -9
- package/dist/components/inputs/input/index.d.ts +17 -1
- package/dist/components/inputs/input/index.d.ts.map +1 -1
- package/dist/components/inputs/input/index.js +27 -5
- package/dist/components/inputs/input/index.js.map +1 -1
- package/dist/components/inputs/input/styles.css +68 -24
- package/dist/components/inputs/languageSelect/index.d.ts.map +1 -1
- package/dist/components/inputs/languageSelect/index.js +15 -4
- package/dist/components/inputs/languageSelect/index.js.map +1 -1
- package/dist/components/inputs/multiSelect/dropDown.d.ts +7 -0
- package/dist/components/inputs/multiSelect/dropDown.d.ts.map +1 -1
- package/dist/components/inputs/multiSelect/dropDown.js +19 -12
- package/dist/components/inputs/multiSelect/dropDown.js.map +1 -1
- package/dist/components/inputs/multiSelect/index.d.ts.map +1 -1
- package/dist/components/inputs/multiSelect/index.js +49 -13
- package/dist/components/inputs/multiSelect/index.js.map +1 -1
- package/dist/components/inputs/multiSelect/styles.css +51 -43
- package/dist/components/inputs/multiSelect/utils.d.ts +7 -0
- package/dist/components/inputs/multiSelect/utils.d.ts.map +1 -0
- package/dist/components/inputs/multiSelect/utils.js +18 -0
- package/dist/components/inputs/multiSelect/utils.js.map +1 -0
- package/dist/components/inputs/phoneInput/index.d.ts.map +1 -1
- package/dist/components/inputs/phoneInput/index.js +11 -3
- package/dist/components/inputs/phoneInput/index.js.map +1 -1
- package/dist/components/inputs/phoneInput/styles.css +13 -13
- package/dist/components/inputs/radioGroup/index.d.ts.map +1 -1
- package/dist/components/inputs/radioGroup/index.js +1 -1
- package/dist/components/inputs/radioGroup/index.js.map +1 -1
- package/dist/components/inputs/richTextEditor/index.d.ts.map +1 -1
- package/dist/components/inputs/richTextEditor/index.js +30 -20
- package/dist/components/inputs/richTextEditor/index.js.map +1 -1
- package/dist/components/inputs/richTextEditor/styles.css +24 -24
- package/dist/components/inputs/searchList/index.d.ts +4 -1
- package/dist/components/inputs/searchList/index.d.ts.map +1 -1
- package/dist/components/inputs/searchList/index.js +46 -31
- package/dist/components/inputs/searchList/index.js.map +1 -1
- package/dist/components/inputs/searchList/styles.css +22 -22
- package/dist/components/inputs/searchSelect/index.d.ts.map +1 -1
- package/dist/components/inputs/searchSelect/index.js +8 -2
- package/dist/components/inputs/searchSelect/index.js.map +1 -1
- package/dist/components/inputs/select/index.js +3 -2
- package/dist/components/inputs/select/index.js.map +1 -1
- package/dist/components/inputs/select/styles.css +93 -15
- package/dist/components/inputs/switch/index.d.ts.map +1 -1
- package/dist/components/inputs/switch/index.js +3 -1
- package/dist/components/inputs/switch/index.js.map +1 -1
- package/dist/components/inputs/switch/styles.css +5 -5
- package/dist/components/inputs/textArea/index.d.ts.map +1 -1
- package/dist/components/inputs/textArea/index.js +3 -2
- package/dist/components/inputs/textArea/index.js.map +1 -1
- package/dist/components/inputs/textArea/styles.css +11 -11
- package/dist/components/inputs/typeahead/index.d.ts.map +1 -1
- package/dist/components/inputs/typeahead/index.js +21 -6
- package/dist/components/inputs/typeahead/index.js.map +1 -1
- package/dist/components/inputs/typeahead/styles.css +13 -13
- package/dist/components/layout/authPage/styles.css +6 -6
- package/dist/components/layout/borderedSection/index.d.ts +3 -1
- package/dist/components/layout/borderedSection/index.d.ts.map +1 -1
- package/dist/components/layout/borderedSection/index.js +2 -2
- package/dist/components/layout/borderedSection/index.js.map +1 -1
- package/dist/components/layout/borderedSection/styles.css +3 -3
- package/dist/components/layout/card/styles.css +53 -31
- package/dist/components/layout/col/styles.css +1 -1
- package/dist/components/layout/page/styles.css +25 -5
- package/dist/components/layout/sectionHeader/styles.css +3 -4
- package/dist/components/navigation/breadcrumbs/styles.css +7 -7
- package/dist/components/navigation/pagination/index.d.ts +23 -0
- package/dist/components/navigation/pagination/index.d.ts.map +1 -0
- package/dist/components/navigation/pagination/index.js +29 -0
- package/dist/components/navigation/pagination/index.js.map +1 -0
- package/dist/components/navigation/pagination/styles.css +113 -0
- package/dist/components/navigation/pagination/utils.d.ts +9 -0
- package/dist/components/navigation/pagination/utils.d.ts.map +1 -0
- package/dist/components/navigation/pagination/utils.js +25 -0
- package/dist/components/navigation/pagination/utils.js.map +1 -0
- package/dist/components/navigation/sidebar/styles.css +13 -5
- package/dist/components/navigation/stepper/styles.css +14 -14
- package/dist/components/navigation/tabButton/styles.css +59 -59
- package/dist/components/navigation/tabs/styles.css +5 -5
- package/dist/components/overlays/confirmationModal/index.d.ts +5 -0
- package/dist/components/overlays/confirmationModal/index.d.ts.map +1 -1
- package/dist/components/overlays/confirmationModal/index.js +23 -4
- package/dist/components/overlays/confirmationModal/index.js.map +1 -1
- package/dist/components/overlays/confirmationModal/styles.css +3 -0
- package/dist/components/overlays/modal/index.d.ts +2 -0
- package/dist/components/overlays/modal/index.d.ts.map +1 -1
- package/dist/components/overlays/modal/index.js +13 -4
- package/dist/components/overlays/modal/index.js.map +1 -1
- package/dist/components/overlays/modal/styles.css +19 -19
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +1 -0
- package/dist/hooks/index.js.map +1 -1
- package/dist/hooks/useInfinite.d.ts +3 -1
- package/dist/hooks/useInfinite.d.ts.map +1 -1
- package/dist/hooks/useInfinite.js +4 -2
- package/dist/hooks/useInfinite.js.map +1 -1
- package/dist/hooks/useInfiniteArchivableCursor.d.ts +1 -1
- package/dist/hooks/useInfiniteArchivableCursor.d.ts.map +1 -1
- package/dist/hooks/useInfiniteArchivableCursor.js +11 -4
- package/dist/hooks/useInfiniteArchivableCursor.js.map +1 -1
- package/dist/hooks/useInfiniteCursor.d.ts +1 -1
- package/dist/hooks/useInfiniteCursor.d.ts.map +1 -1
- package/dist/hooks/useInfiniteCursor.js +11 -4
- package/dist/hooks/useInfiniteCursor.js.map +1 -1
- package/dist/hooks/usePaginated.d.ts +43 -0
- package/dist/hooks/usePaginated.d.ts.map +1 -0
- package/dist/hooks/usePaginated.js +60 -0
- package/dist/hooks/usePaginated.js.map +1 -0
- package/dist/styles.css +161 -123
- package/package.json +15 -4
- package/src/components/buttons/button/index.tsx +14 -5
- package/src/components/buttons/button/styles.css +45 -43
- package/src/components/buttons/rowActions/index.tsx +6 -1
- package/src/components/buttons/rowActions/styles.css +7 -0
- package/src/components/data-display/addressBlock/styles.css +2 -4
- package/src/components/data-display/colorSwatch/index.tsx +2 -2
- package/src/components/data-display/colorSwatch/styles.css +1 -1
- package/src/components/data-display/dataTable/index.tsx +6 -3
- package/src/components/data-display/dataTable/styles.css +18 -2
- package/src/components/data-display/dataTable/utils/parseDataKey.ts +18 -36
- package/src/components/data-display/imagePreview/styles.css +2 -2
- package/src/components/data-display/infiniteScroll/filters/index.tsx +18 -1
- package/src/components/data-display/infiniteScroll/filters/listFilter.tsx +1 -0
- package/src/components/data-display/infiniteScroll/filters/rangeFilter.tsx +77 -33
- package/src/components/data-display/infiniteScroll/filters/searchFilter.tsx +16 -65
- package/src/components/data-display/infiniteScroll/filters/selectFilter.tsx +11 -17
- package/src/components/data-display/infiniteScroll/filters/styles.css +34 -1
- package/src/components/data-display/infiniteScroll/header/deleteButton.tsx +1 -0
- package/src/components/data-display/infiniteScroll/header/index.tsx +4 -0
- package/src/components/data-display/infiniteScroll/header/limit.tsx +1 -0
- package/src/components/data-display/infiniteScroll/header/sortBy.tsx +1 -0
- package/src/components/data-display/infiniteScroll/header/sortDirection.tsx +1 -0
- package/src/components/data-display/infiniteScroll/index.tsx +75 -29
- package/src/components/data-display/infiniteScroll/styles.css +2 -2
- package/src/components/data-display/infiniteScroll/table/index.tsx +2 -0
- package/src/components/data-display/infiniteScroll/tags/index.tsx +7 -16
- package/src/components/data-display/infiniteScroll/tags/listFilterTag.tsx +31 -28
- package/src/components/data-display/infiniteScroll/tags/rangeFilterTag.tsx +8 -25
- package/src/components/data-display/infiniteScroll/tags/selectFilterTag.tsx +4 -11
- package/src/components/data-display/infiniteScroll/tags/styles.css +1 -29
- package/src/components/data-display/infiniteScroll/utils/generateQueryString.ts +28 -13
- package/src/components/data-display/infiniteScroll/utils/hasPendingChanges.ts +48 -16
- package/src/components/data-display/listCard/styles.css +3 -3
- package/src/components/data-display/listRow/styles.css +2 -2
- package/src/components/data-display/recoveryCodeGrid/styles.css +3 -4
- package/src/components/data-display/secretDisplay/styles.css +4 -4
- package/src/components/data-display/statCard/styles.css +12 -12
- package/src/components/data-display/summaryRow/styles.css +4 -4
- package/src/components/data-display/table/index.tsx +2 -2
- package/src/components/data-display/table/styles.css +22 -11
- package/src/components/data-display/tableFilters/index.tsx +147 -0
- package/src/components/data-display/tagCard/index.tsx +7 -4
- package/src/components/data-display/tagCard/styles.css +1 -1
- package/src/components/feedback/alert/styles.css +15 -15
- package/src/components/feedback/badge/index.tsx +36 -16
- package/src/components/feedback/badge/styles.css +45 -45
- package/src/components/feedback/emptyState/styles.css +2 -4
- package/src/components/feedback/loadingOverlay/styles.css +1 -1
- package/src/components/feedback/progressBar/index.tsx +14 -8
- package/src/components/feedback/progressBar/styles.css +25 -16
- package/src/components/feedback/spinner/styles.css +14 -24
- package/src/components/feedback/tooltip/styles.css +9 -7
- package/src/components/forms/detailField/styles.css +1 -1
- package/src/components/forms/fieldShell/index.tsx +4 -1
- package/src/components/forms/fieldShell/styles.css +5 -5
- package/src/components/forms/form/styles.css +6 -6
- package/src/components/forms/formActions/styles.css +4 -4
- package/src/components/forms/formGrid/styles.css +32 -0
- package/src/components/forms/infoRow/styles.css +2 -3
- package/src/components/forms/optionsGroup/index.tsx +31 -12
- package/src/components/forms/optionsGroup/styles.css +1 -1
- package/src/components/forms/requiredAsterisk/index.tsx +5 -1
- package/src/components/forms/requiredAsterisk/styles.css +1 -1
- package/src/components/index.ts +4 -0
- package/src/components/inputs/checkbox/index.tsx +27 -6
- package/src/components/inputs/checkbox/styles.css +11 -3
- package/src/components/inputs/colorPicker/index.tsx +5 -2
- package/src/components/inputs/colorPicker/styles.css +3 -3
- package/src/components/inputs/dateInput/index.tsx +17 -9
- package/src/components/inputs/dateInput/styles.css +5 -5
- package/src/components/inputs/dateInput/utils.ts +12 -8
- package/src/components/inputs/dropdown/index.tsx +5 -1
- package/src/components/inputs/dropdown/styles.css +2 -2
- package/src/components/inputs/dropdownArrowButton/index.tsx +1 -0
- package/src/components/inputs/dropdownArrowButton/styles.css +7 -5
- package/src/components/inputs/fileDropZone/index.tsx +4 -3
- package/src/components/inputs/fileDropZone/styles.css +12 -12
- package/src/components/inputs/fileUpload/index.tsx +33 -23
- package/src/components/inputs/fileUpload/styles.css +9 -9
- package/src/components/inputs/input/index.tsx +67 -6
- package/src/components/inputs/input/styles.css +68 -24
- package/src/components/inputs/languageSelect/index.tsx +19 -4
- package/src/components/inputs/multiSelect/dropDown.tsx +83 -35
- package/src/components/inputs/multiSelect/index.tsx +87 -29
- package/src/components/inputs/multiSelect/styles.css +51 -43
- package/src/components/inputs/multiSelect/utils.ts +18 -0
- package/src/components/inputs/phoneInput/index.tsx +16 -4
- package/src/components/inputs/phoneInput/styles.css +13 -13
- package/src/components/inputs/radioGroup/index.tsx +2 -1
- package/src/components/inputs/richTextEditor/index.tsx +59 -37
- package/src/components/inputs/richTextEditor/styles.css +24 -24
- package/src/components/inputs/searchList/index.tsx +121 -109
- package/src/components/inputs/searchList/styles.css +22 -22
- package/src/components/inputs/searchSelect/index.tsx +8 -2
- package/src/components/inputs/select/index.tsx +3 -3
- package/src/components/inputs/select/styles.css +93 -15
- package/src/components/inputs/switch/index.tsx +3 -2
- package/src/components/inputs/switch/styles.css +5 -5
- package/src/components/inputs/textArea/index.tsx +3 -3
- package/src/components/inputs/textArea/styles.css +11 -11
- package/src/components/inputs/typeahead/index.tsx +84 -54
- package/src/components/inputs/typeahead/styles.css +13 -13
- package/src/components/layout/authPage/styles.css +6 -6
- package/src/components/layout/borderedSection/index.tsx +4 -1
- package/src/components/layout/borderedSection/styles.css +3 -3
- package/src/components/layout/card/styles.css +53 -31
- package/src/components/layout/col/styles.css +1 -1
- package/src/components/layout/page/styles.css +25 -5
- package/src/components/layout/sectionHeader/styles.css +3 -4
- package/src/components/navigation/breadcrumbs/styles.css +7 -7
- package/src/components/navigation/pagination/index.tsx +134 -0
- package/src/components/navigation/pagination/styles.css +113 -0
- package/src/components/navigation/pagination/utils.ts +32 -0
- package/src/components/navigation/sidebar/styles.css +13 -5
- package/src/components/navigation/stepper/styles.css +14 -14
- package/src/components/navigation/tabButton/styles.css +59 -59
- package/src/components/navigation/tabs/styles.css +5 -5
- package/src/components/overlays/confirmationModal/index.tsx +37 -1
- package/src/components/overlays/confirmationModal/styles.css +3 -0
- package/src/components/overlays/modal/index.tsx +23 -4
- package/src/components/overlays/modal/styles.css +19 -19
- package/src/hooks/index.ts +4 -0
- package/src/hooks/useInfinite.ts +7 -3
- package/src/hooks/useInfiniteArchivableCursor.ts +11 -4
- package/src/hooks/useInfiniteCursor.ts +11 -4
- package/src/hooks/usePaginated.ts +123 -0
- package/src/styles.css +161 -123
- package/dist/components/data-display/infiniteScroll/tags/searchFilterTag.d.ts +0 -10
- package/dist/components/data-display/infiniteScroll/tags/searchFilterTag.d.ts.map +0 -1
- package/dist/components/data-display/infiniteScroll/tags/searchFilterTag.js +0 -22
- package/dist/components/data-display/infiniteScroll/tags/searchFilterTag.js.map +0 -1
- package/src/components/data-display/infiniteScroll/tags/searchFilterTag.tsx +0 -41
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
.k-tab-button {
|
|
2
|
-
background: var(--background-color);
|
|
3
|
-
border: 0.0625rem solid var(--border-color);
|
|
2
|
+
background: var(--k-background-color);
|
|
3
|
+
border: 0.0625rem solid var(--k-border-color);
|
|
4
4
|
border-bottom: 0.125rem solid transparent;
|
|
5
5
|
border-radius: 0.375rem 0.375rem 0 0;
|
|
6
6
|
padding: 0.5rem 1rem;
|
|
@@ -15,126 +15,126 @@
|
|
|
15
15
|
/* Size variations */
|
|
16
16
|
.k-tab-button-sm {
|
|
17
17
|
padding: 0.375rem 0.75rem;
|
|
18
|
-
font-size: var(--text-size-sm);
|
|
18
|
+
font-size: var(--k-text-size-sm);
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
.k-tab-button-md {
|
|
22
22
|
padding: 0.5rem 1rem;
|
|
23
|
-
font-size: var(--text-size-md);
|
|
23
|
+
font-size: var(--k-text-size-md);
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
.k-tab-button-lg {
|
|
27
27
|
padding: 0.625rem 1.25rem;
|
|
28
|
-
font-size: var(--text-size-lg);
|
|
28
|
+
font-size: var(--k-text-size-lg);
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
/* Variant styles - all keep white background, only text and border colors change */
|
|
32
32
|
.k-tab-button-primary {
|
|
33
|
-
color: var(--text-color);
|
|
34
|
-
background-color: var(--background-color);
|
|
33
|
+
color: var(--k-text-color);
|
|
34
|
+
background-color: var(--k-background-color);
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
.k-tab-button-primary:hover:not(.k-tab-button-disabled) {
|
|
38
|
-
color: var(--primary-color);
|
|
39
|
-
background-color: var(--background-color);
|
|
38
|
+
color: var(--k-primary-color-text);
|
|
39
|
+
background-color: var(--k-background-color);
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
.k-tab-button-primary.k-tab-button-active {
|
|
43
|
-
color: var(--primary-color);
|
|
44
|
-
background-color: var(--background-color);
|
|
45
|
-
border-bottom-color: var(--primary-color);
|
|
46
|
-
border-color: var(--primary-color) var(--primary-color) transparent
|
|
47
|
-
var(--primary-color);
|
|
43
|
+
color: var(--k-primary-color-text);
|
|
44
|
+
background-color: var(--k-background-color);
|
|
45
|
+
border-bottom-color: var(--k-primary-color);
|
|
46
|
+
border-color: var(--k-primary-color) var(--k-primary-color) transparent
|
|
47
|
+
var(--k-primary-color);
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
.k-tab-button-secondary {
|
|
51
|
-
color: var(--text-color-secondary);
|
|
52
|
-
background-color: var(--background-color);
|
|
51
|
+
color: var(--k-text-color-secondary);
|
|
52
|
+
background-color: var(--k-background-color);
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
.k-tab-button-secondary:hover:not(.k-tab-button-disabled) {
|
|
56
|
-
color: var(--text-color);
|
|
57
|
-
background-color: var(--background-color);
|
|
56
|
+
color: var(--k-text-color);
|
|
57
|
+
background-color: var(--k-background-color);
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
.k-tab-button-secondary.k-tab-button-active {
|
|
61
|
-
color: var(--text-color);
|
|
62
|
-
background-color: var(--background-color);
|
|
63
|
-
border-bottom-color: var(--secondary-color);
|
|
64
|
-
border-color: var(--secondary-color) var(--secondary-color) transparent
|
|
65
|
-
var(--secondary-color);
|
|
61
|
+
color: var(--k-text-color);
|
|
62
|
+
background-color: var(--k-background-color);
|
|
63
|
+
border-bottom-color: var(--k-secondary-color);
|
|
64
|
+
border-color: var(--k-secondary-color) var(--k-secondary-color) transparent
|
|
65
|
+
var(--k-secondary-color);
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
.k-tab-button-success {
|
|
69
|
-
color: var(--text-color);
|
|
70
|
-
background-color: var(--background-color);
|
|
69
|
+
color: var(--k-text-color);
|
|
70
|
+
background-color: var(--k-background-color);
|
|
71
71
|
}
|
|
72
72
|
|
|
73
73
|
.k-tab-button-success:hover:not(.k-tab-button-disabled) {
|
|
74
|
-
color: var(--success-color);
|
|
75
|
-
background-color: var(--background-color);
|
|
74
|
+
color: var(--k-success-color);
|
|
75
|
+
background-color: var(--k-background-color);
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
.k-tab-button-success.k-tab-button-active {
|
|
79
|
-
color: var(--success-color);
|
|
80
|
-
background-color: var(--background-color);
|
|
81
|
-
border-bottom-color: var(--success-color);
|
|
82
|
-
border-color: var(--success-color) var(--success-color) transparent
|
|
83
|
-
var(--success-color);
|
|
79
|
+
color: var(--k-success-color);
|
|
80
|
+
background-color: var(--k-background-color);
|
|
81
|
+
border-bottom-color: var(--k-success-color);
|
|
82
|
+
border-color: var(--k-success-color) var(--k-success-color) transparent
|
|
83
|
+
var(--k-success-color);
|
|
84
84
|
}
|
|
85
85
|
|
|
86
86
|
.k-tab-button-danger {
|
|
87
|
-
color: var(--text-color);
|
|
88
|
-
background-color: var(--background-color);
|
|
87
|
+
color: var(--k-text-color);
|
|
88
|
+
background-color: var(--k-background-color);
|
|
89
89
|
}
|
|
90
90
|
|
|
91
91
|
.k-tab-button-danger:hover:not(.k-tab-button-disabled) {
|
|
92
|
-
color: var(--danger-color);
|
|
93
|
-
background-color: var(--background-color);
|
|
92
|
+
color: var(--k-danger-color-text);
|
|
93
|
+
background-color: var(--k-background-color);
|
|
94
94
|
}
|
|
95
95
|
|
|
96
96
|
.k-tab-button-danger.k-tab-button-active {
|
|
97
|
-
color: var(--danger-color);
|
|
98
|
-
background-color: var(--background-color);
|
|
99
|
-
border-bottom-color: var(--danger-color);
|
|
100
|
-
border-color: var(--danger-color) var(--danger-color) transparent
|
|
101
|
-
var(--danger-color);
|
|
97
|
+
color: var(--k-danger-color-text);
|
|
98
|
+
background-color: var(--k-background-color);
|
|
99
|
+
border-bottom-color: var(--k-danger-color);
|
|
100
|
+
border-color: var(--k-danger-color) var(--k-danger-color) transparent
|
|
101
|
+
var(--k-danger-color);
|
|
102
102
|
}
|
|
103
103
|
|
|
104
104
|
.k-tab-button-warning {
|
|
105
|
-
color: var(--text-color);
|
|
106
|
-
background-color: var(--background-color);
|
|
105
|
+
color: var(--k-text-color);
|
|
106
|
+
background-color: var(--k-background-color);
|
|
107
107
|
}
|
|
108
108
|
|
|
109
109
|
.k-tab-button-warning:hover:not(.k-tab-button-disabled) {
|
|
110
|
-
color: var(--warning-color);
|
|
111
|
-
background-color: var(--background-color);
|
|
110
|
+
color: var(--k-warning-color-text);
|
|
111
|
+
background-color: var(--k-background-color);
|
|
112
112
|
}
|
|
113
113
|
|
|
114
114
|
.k-tab-button-warning.k-tab-button-active {
|
|
115
|
-
color: var(--warning-color);
|
|
116
|
-
background-color: var(--background-color);
|
|
117
|
-
border-bottom-color: var(--warning-color);
|
|
118
|
-
border-color: var(--warning-color) var(--warning-color) transparent
|
|
119
|
-
var(--warning-color);
|
|
115
|
+
color: var(--k-warning-color-text);
|
|
116
|
+
background-color: var(--k-background-color);
|
|
117
|
+
border-bottom-color: var(--k-warning-color);
|
|
118
|
+
border-color: var(--k-warning-color) var(--k-warning-color) transparent
|
|
119
|
+
var(--k-warning-color);
|
|
120
120
|
}
|
|
121
121
|
|
|
122
122
|
.k-tab-button-light {
|
|
123
|
-
color: var(--text-color-secondary);
|
|
124
|
-
background-color: var(--background-color);
|
|
123
|
+
color: var(--k-text-color-secondary);
|
|
124
|
+
background-color: var(--k-background-color);
|
|
125
125
|
}
|
|
126
126
|
|
|
127
127
|
.k-tab-button-light:hover:not(.k-tab-button-disabled) {
|
|
128
|
-
color: var(--text-color);
|
|
129
|
-
background-color: var(--background-color);
|
|
128
|
+
color: var(--k-text-color);
|
|
129
|
+
background-color: var(--k-background-color);
|
|
130
130
|
}
|
|
131
131
|
|
|
132
132
|
.k-tab-button-light.k-tab-button-active {
|
|
133
|
-
color: var(--text-color);
|
|
134
|
-
background-color: var(--background-color);
|
|
135
|
-
border-bottom-color: var(--border-color);
|
|
136
|
-
border-color: var(--border-color) var(--border-color) transparent
|
|
137
|
-
var(--border-color);
|
|
133
|
+
color: var(--k-text-color);
|
|
134
|
+
background-color: var(--k-background-color);
|
|
135
|
+
border-bottom-color: var(--k-border-color);
|
|
136
|
+
border-color: var(--k-border-color) var(--k-border-color) transparent
|
|
137
|
+
var(--k-border-color);
|
|
138
138
|
}
|
|
139
139
|
|
|
140
140
|
/* Disabled state */
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
display: flex;
|
|
8
8
|
flex-wrap: wrap;
|
|
9
9
|
gap: 0.25rem;
|
|
10
|
-
border-bottom: 0.0625rem solid var(--border-color);
|
|
10
|
+
border-bottom: 0.0625rem solid var(--k-border-color);
|
|
11
11
|
margin-bottom: 1rem;
|
|
12
12
|
}
|
|
13
13
|
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
background: transparent;
|
|
17
17
|
border: none;
|
|
18
18
|
border-bottom: 0.1875rem solid transparent;
|
|
19
|
-
color: var(--text-color);
|
|
19
|
+
color: var(--k-text-color);
|
|
20
20
|
cursor: pointer;
|
|
21
21
|
font-size: 0.9375rem;
|
|
22
22
|
font-weight: 500;
|
|
@@ -28,12 +28,12 @@
|
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
.k-tabs-button:hover:not(:disabled) {
|
|
31
|
-
color: var(--primary-color);
|
|
31
|
+
color: var(--k-primary-color-text);
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
.k-tabs-button-active {
|
|
35
|
-
color: var(--primary-color);
|
|
36
|
-
border-bottom-color: var(--primary-color);
|
|
35
|
+
color: var(--k-primary-color-text);
|
|
36
|
+
border-bottom-color: var(--k-primary-color);
|
|
37
37
|
}
|
|
38
38
|
|
|
39
39
|
.k-tabs-button:disabled {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import "./styles.css";
|
|
1
2
|
export interface ConfirmationModalProps {
|
|
2
3
|
show: boolean;
|
|
3
4
|
handleHide: () => void;
|
|
@@ -7,6 +8,10 @@ export interface ConfirmationModalProps {
|
|
|
7
8
|
confirmButtonText: string;
|
|
8
9
|
cancelButtonText?: string;
|
|
9
10
|
isLoading?: boolean;
|
|
11
|
+
/** **_Optional_** text the user must type, exactly, before the confirm button enables (e.g. the name of what's being deleted) */
|
|
12
|
+
confirmationText?: string;
|
|
13
|
+
/** **_Optional_** whether Escape and a click outside close the modal. Defaults to `true` */
|
|
14
|
+
dismissible?: boolean;
|
|
10
15
|
}
|
|
11
16
|
declare const ConfirmationModal: (props: ConfirmationModalProps) => import("react").JSX.Element;
|
|
12
17
|
export default ConfirmationModal;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/confirmationModal/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/confirmationModal/index.tsx"],"names":[],"mappings":"AAMA,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,iBAAiB,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iIAAiI;IACjI,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,4FAA4F;IAC5F,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,iBAAiB,GAAI,OAAO,sBAAsB,gCA0DvD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -1,12 +1,31 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import Button from "../../buttons/button/index.js";
|
|
4
|
+
import Input from "../../inputs/input/index.js";
|
|
4
5
|
import Modal from "../modal/index.js";
|
|
6
|
+
import { useState } from "react";
|
|
7
|
+
import "./styles.css";
|
|
5
8
|
const ConfirmationModal = (props) => {
|
|
6
|
-
|
|
9
|
+
const [typed, setTyped] = useState("");
|
|
10
|
+
const [wasShown, setWasShown] = useState(props.show);
|
|
11
|
+
// Clear the typed text each time the modal opens, so a match from a
|
|
12
|
+
// previous confirmation never carries over.
|
|
13
|
+
if (props.show !== wasShown) {
|
|
14
|
+
setWasShown(props.show);
|
|
15
|
+
if (props.show)
|
|
16
|
+
setTyped("");
|
|
17
|
+
}
|
|
18
|
+
const confirmed = props.confirmationText === undefined || typed === props.confirmationText;
|
|
19
|
+
const canConfirm = confirmed && !props.isLoading;
|
|
20
|
+
return (_jsxs(Modal, { show: props.show, title: props.title, onClose: props.handleHide,
|
|
21
|
+
// Cancel is disabled while loading; Escape and the backdrop follow suit.
|
|
22
|
+
dismissible: props.dismissible !== false && !props.isLoading, footerButtons: [
|
|
7
23
|
_jsx(Button, { variant: "secondary", onClick: props.handleHide, disabled: props.isLoading, children: props.cancelButtonText || "Cancel" }, "cancel"),
|
|
8
|
-
_jsx(Button, { variant: "danger", onClick: props.handleConfirm, isLoading: props.isLoading, disabled:
|
|
9
|
-
], children: props.body }))
|
|
24
|
+
_jsx(Button, { variant: "danger", onClick: props.handleConfirm, isLoading: props.isLoading, disabled: !canConfirm, children: props.confirmButtonText }, "confirm"),
|
|
25
|
+
], children: [props.body, props.confirmationText !== undefined && (_jsx("div", { className: "k-confirmation-modal-check", children: _jsx(Input, { label: `Type "${props.confirmationText}" to confirm`, value: typed, onChange: (e) => setTyped(e.target.value), onKeyDown: (e) => {
|
|
26
|
+
if (e.key === "Enter" && canConfirm)
|
|
27
|
+
props.handleConfirm();
|
|
28
|
+
}, autoComplete: "off" }) }))] }));
|
|
10
29
|
};
|
|
11
30
|
export default ConfirmationModal;
|
|
12
31
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/overlays/confirmationModal/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,KAAK,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/overlays/confirmationModal/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,KAAK,MAAM,6BAA6B,CAAC;AAChD,OAAO,KAAK,MAAM,mBAAmB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,cAAc,CAAC;AAiBtB,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAErD,oEAAoE;IACpE,4CAA4C;IAC5C,IAAI,KAAK,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;QAC5B,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACxB,IAAI,KAAK,CAAC,IAAI;YAAE,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC/B,CAAC;IAED,MAAM,SAAS,GACb,KAAK,CAAC,gBAAgB,KAAK,SAAS,IAAI,KAAK,KAAK,KAAK,CAAC,gBAAgB,CAAC;IAC3E,MAAM,UAAU,GAAG,SAAS,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IAEjD,OAAO,CACL,MAAC,KAAK,IACJ,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,UAAU;QACzB,yEAAyE;QACzE,WAAW,EAAE,KAAK,CAAC,WAAW,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,SAAS,EAC5D,aAAa,EAAE;YACb,KAAC,MAAM,IAEL,OAAO,EAAC,WAAW,EACnB,OAAO,EAAE,KAAK,CAAC,UAAU,EACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,YAExB,KAAK,CAAC,gBAAgB,IAAI,QAAQ,IAL/B,QAAQ,CAML;YACT,KAAC,MAAM,IAEL,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,KAAK,CAAC,aAAa,EAC5B,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,QAAQ,EAAE,CAAC,UAAU,YAEpB,KAAK,CAAC,iBAAiB,IANpB,SAAS,CAON;SACV,aAEA,KAAK,CAAC,IAAI,EACV,KAAK,CAAC,gBAAgB,KAAK,SAAS,IAAI,CACvC,cAAK,SAAS,EAAC,4BAA4B,YACzC,KAAC,KAAK,IACJ,KAAK,EAAE,SAAS,KAAK,CAAC,gBAAgB,cAAc,EACpD,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;wBACf,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,UAAU;4BAAE,KAAK,CAAC,aAAa,EAAE,CAAC;oBAC7D,CAAC,EACD,YAAY,EAAC,KAAK,GAClB,GACE,CACP,IACK,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -16,6 +16,8 @@ interface ModalProps extends PropsWithChildren {
|
|
|
16
16
|
* editors) that would feel cramped at `lg`.
|
|
17
17
|
*/
|
|
18
18
|
size?: ModalSize;
|
|
19
|
+
/** **_Optional_** whether Escape and a click on the backdrop close the modal. When `false`, only the modal's own buttons can close it. Defaults to `true` */
|
|
20
|
+
dismissible?: boolean;
|
|
19
21
|
}
|
|
20
22
|
declare const Modal: (props: ModalProps) => React.JSX.Element | null;
|
|
21
23
|
export default Modal;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAI9E,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEpD,UAAU,UAAW,SAAQ,iBAAiB;IAC5C,yDAAyD;IACzD,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,wDAAwD;IACxD,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAI9E,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEpD,UAAU,UAAW,SAAQ,iBAAiB;IAC5C,yDAAyD;IACzD,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,wDAAwD;IACxD,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,6JAA6J;IAC7J,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,KAAK,GAAI,OAAO,UAAU,6BA4E/B,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -6,10 +6,11 @@ import Button from "../../buttons/button/index.js";
|
|
|
6
6
|
import Portal from "../portal/index.js";
|
|
7
7
|
import "./styles.css";
|
|
8
8
|
const Modal = (props) => {
|
|
9
|
-
const { size = "md" } = props;
|
|
9
|
+
const { size = "md", dismissible = true } = props;
|
|
10
10
|
const [shouldRender, setShouldRender] = useState(props.show);
|
|
11
11
|
const [isAnimating, setIsAnimating] = useState(false);
|
|
12
12
|
const contentRef = useRef(null);
|
|
13
|
+
const pressStartedOnOverlay = useRef(false);
|
|
13
14
|
useEffect(() => {
|
|
14
15
|
if (props.show) {
|
|
15
16
|
setIsAnimating(false);
|
|
@@ -25,7 +26,7 @@ const Modal = (props) => {
|
|
|
25
26
|
}
|
|
26
27
|
}, [props.show]);
|
|
27
28
|
useEffect(() => {
|
|
28
|
-
if (!props.show)
|
|
29
|
+
if (!props.show || !dismissible)
|
|
29
30
|
return;
|
|
30
31
|
const handler = (e) => {
|
|
31
32
|
if (e.key === "Escape")
|
|
@@ -33,11 +34,19 @@ const Modal = (props) => {
|
|
|
33
34
|
};
|
|
34
35
|
document.addEventListener("keydown", handler);
|
|
35
36
|
return () => document.removeEventListener("keydown", handler);
|
|
36
|
-
}, [props.show, props.onClose]);
|
|
37
|
+
}, [props.show, props.onClose, dismissible]);
|
|
37
38
|
useFocusTrap(contentRef, !!props.show && !!shouldRender);
|
|
38
39
|
if (!shouldRender)
|
|
39
40
|
return null;
|
|
40
|
-
return (_jsx(Portal, { children: _jsx("div", { className: `k-modal-overlay ${isAnimating ? "closing" : ""}`,
|
|
41
|
+
return (_jsx(Portal, { children: _jsx("div", { className: `k-modal-overlay ${isAnimating ? "closing" : ""}`, onMouseDown: (e) => {
|
|
42
|
+
pressStartedOnOverlay.current = e.target === e.currentTarget;
|
|
43
|
+
}, onClick: (e) => {
|
|
44
|
+
if (dismissible &&
|
|
45
|
+
pressStartedOnOverlay.current &&
|
|
46
|
+
e.target === e.currentTarget) {
|
|
47
|
+
props.onClose();
|
|
48
|
+
}
|
|
49
|
+
}, children: _jsxs("div", { ref: contentRef, className: `k-modal-content ${isAnimating ? "closing" : ""} ${size}`, role: "dialog", "aria-modal": "true", children: [props.title && _jsx("div", { className: "k-modal-header", children: props.title }), _jsx("div", { className: "k-modal-body", children: props.children }), _jsx("div", { className: "k-modal-footer", children: props.footerButtons ? (props.footerButtons.map((button, index) => (_jsx(React.Fragment, { children: button }, index)))) : (_jsx(Button, { onClick: props.onClose, variant: "secondary", children: "Close" })) })] }) }) }));
|
|
41
50
|
};
|
|
42
51
|
export default Modal;
|
|
43
52
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/overlays/modal/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,EAAE,EAAqB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC9E,OAAO,YAAY,MAAM,gCAAgC,CAAC;AAC1D,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,MAAM,MAAM,oBAAoB,CAAC;AACxC,OAAO,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/overlays/modal/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@keyframes
|
|
1
|
+
@keyframes k-fade-in {
|
|
2
2
|
from {
|
|
3
3
|
opacity: 0;
|
|
4
4
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
-
@keyframes
|
|
10
|
+
@keyframes k-fade-out {
|
|
11
11
|
from {
|
|
12
12
|
opacity: 1;
|
|
13
13
|
}
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
@keyframes
|
|
19
|
+
@keyframes k-scale-in {
|
|
20
20
|
from {
|
|
21
21
|
transform: scale(0.95);
|
|
22
22
|
}
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
@keyframes
|
|
28
|
+
@keyframes k-scale-out {
|
|
29
29
|
from {
|
|
30
30
|
transform: scale(1);
|
|
31
31
|
}
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
.k-modal-overlay {
|
|
38
38
|
position: fixed;
|
|
39
39
|
inset: 0;
|
|
40
|
-
background-color: var(--background-color-overlay);
|
|
40
|
+
background-color: var(--k-background-color-overlay);
|
|
41
41
|
display: flex;
|
|
42
42
|
align-items: center;
|
|
43
43
|
justify-content: center;
|
|
@@ -45,16 +45,16 @@
|
|
|
45
45
|
padding: 1rem;
|
|
46
46
|
opacity: 1;
|
|
47
47
|
pointer-events: auto;
|
|
48
|
-
animation:
|
|
48
|
+
animation: k-fade-in 0.2s ease-out forwards;
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
.k-modal-content {
|
|
52
|
-
background-color: var(--background-color-light);
|
|
52
|
+
background-color: var(--k-background-color-light);
|
|
53
53
|
border-radius: 0.5rem;
|
|
54
54
|
padding: 1rem;
|
|
55
55
|
box-shadow:
|
|
56
|
-
0 1.25rem 1.5625rem -0.3125rem var(--shadow-color),
|
|
57
|
-
0 0.5rem 0.625rem -0.375rem var(--shadow-color);
|
|
56
|
+
0 1.25rem 1.5625rem -0.3125rem var(--k-shadow-color),
|
|
57
|
+
0 0.5rem 0.625rem -0.375rem var(--k-shadow-color);
|
|
58
58
|
max-width: 40rem;
|
|
59
59
|
width: 100%;
|
|
60
60
|
display: flex;
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
opacity: 1;
|
|
64
64
|
transform: scale(1);
|
|
65
65
|
pointer-events: auto;
|
|
66
|
-
animation:
|
|
66
|
+
animation: k-scale-in 0.2s ease-out forwards;
|
|
67
67
|
max-height: 80vh;
|
|
68
68
|
overflow: hidden;
|
|
69
69
|
}
|
|
@@ -88,21 +88,21 @@
|
|
|
88
88
|
}
|
|
89
89
|
|
|
90
90
|
.k-modal-overlay.closing {
|
|
91
|
-
animation:
|
|
91
|
+
animation: k-fade-out 0.2s ease-in forwards;
|
|
92
92
|
pointer-events: none;
|
|
93
93
|
}
|
|
94
94
|
|
|
95
95
|
.k-modal-content.closing {
|
|
96
|
-
animation:
|
|
96
|
+
animation: k-scale-out 0.2s ease-in forwards;
|
|
97
97
|
pointer-events: none;
|
|
98
98
|
}
|
|
99
99
|
|
|
100
100
|
.k-modal-header {
|
|
101
101
|
padding-bottom: 0.5rem;
|
|
102
|
-
border-bottom: 0.0625rem solid var(--border-color);
|
|
103
|
-
font-size: var(--text-size-xl);
|
|
102
|
+
border-bottom: 0.0625rem solid var(--k-border-color);
|
|
103
|
+
font-size: var(--k-text-size-xl);
|
|
104
104
|
font-weight: 700;
|
|
105
|
-
color: var(--text-color);
|
|
105
|
+
color: var(--k-text-color);
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
.k-modal-body {
|
|
@@ -110,22 +110,22 @@
|
|
|
110
110
|
flex-direction: column;
|
|
111
111
|
padding-top: 0.5rem;
|
|
112
112
|
padding-bottom: 0.5rem;
|
|
113
|
-
color: var(--text-color-secondary);
|
|
113
|
+
color: var(--k-text-color-secondary);
|
|
114
114
|
overflow-y: auto;
|
|
115
115
|
min-height: 0;
|
|
116
116
|
flex: 1;
|
|
117
117
|
}
|
|
118
118
|
|
|
119
119
|
.k-modal-message {
|
|
120
|
-
font-size: var(--text-size-lg);
|
|
120
|
+
font-size: var(--k-text-size-lg);
|
|
121
121
|
font-weight: 600;
|
|
122
|
-
color: var(--text-color);
|
|
122
|
+
color: var(--k-text-color);
|
|
123
123
|
margin-bottom: 1rem;
|
|
124
124
|
}
|
|
125
125
|
|
|
126
126
|
.k-modal-footer {
|
|
127
127
|
padding-top: 0.5rem;
|
|
128
|
-
border-top: 0.0625rem solid var(--border-color);
|
|
128
|
+
border-top: 0.0625rem solid var(--k-border-color);
|
|
129
129
|
display: flex;
|
|
130
130
|
justify-content: end;
|
|
131
131
|
gap: 0.5rem;
|
package/dist/hooks/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { default as useInfiniteArchivableCursor } from "./useInfiniteArchivableCursor.js";
|
|
2
2
|
export { default as useInfinite, type UseInfiniteReturn, } from "./useInfinite.js";
|
|
3
3
|
export { default as useInfiniteCursor } from "./useInfiniteCursor.js";
|
|
4
|
+
export { default as usePaginated, type UsePaginatedReturn, } from "./usePaginated.js";
|
|
4
5
|
export { default as useScrollIntoView } from "./useScrollIntoView.js";
|
|
5
6
|
export { default as useDebouncedValue } from "./useDebouncedValue.js";
|
|
6
7
|
export { default as useOutsideClick } from "./useOutsideClick.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC1F,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,KAAK,iBAAiB,GACvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,OAAO,IAAI,mBAAmB,EAC9B,KAAK,gBAAgB,EACrB,KAAK,YAAY,GAClB,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC1F,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,KAAK,iBAAiB,GACvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EACL,OAAO,IAAI,YAAY,EACvB,KAAK,kBAAkB,GACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,OAAO,IAAI,mBAAmB,EAC9B,KAAK,gBAAgB,EACrB,KAAK,YAAY,GAClB,MAAM,0BAA0B,CAAC"}
|
package/dist/hooks/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { default as useInfiniteArchivableCursor } from "./useInfiniteArchivableCursor.js";
|
|
2
2
|
export { default as useInfinite, } from "./useInfinite.js";
|
|
3
3
|
export { default as useInfiniteCursor } from "./useInfiniteCursor.js";
|
|
4
|
+
export { default as usePaginated, } from "./usePaginated.js";
|
|
4
5
|
export { default as useScrollIntoView } from "./useScrollIntoView.js";
|
|
5
6
|
export { default as useDebouncedValue } from "./useDebouncedValue.js";
|
|
6
7
|
export { default as useOutsideClick } from "./useOutsideClick.js";
|
package/dist/hooks/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC1F,OAAO,EACL,OAAO,IAAI,WAAW,GAEvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,OAAO,IAAI,mBAAmB,GAG/B,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC1F,OAAO,EACL,OAAO,IAAI,WAAW,GAEvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EACL,OAAO,IAAI,YAAY,GAExB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,OAAO,IAAI,mBAAmB,GAG/B,MAAM,0BAA0B,CAAC"}
|
|
@@ -7,7 +7,7 @@ interface UseInfiniteOptions {
|
|
|
7
7
|
queryKey: string;
|
|
8
8
|
/** Organization ID to scope cache keys (prevents stale cross-org data) */
|
|
9
9
|
orgId?: string | null;
|
|
10
|
-
/** Initial limit (default:
|
|
10
|
+
/** Initial limit (default: 25, InfiniteScroll's default page size) */
|
|
11
11
|
initialLimit?: number;
|
|
12
12
|
/** Whether or not the query should be enabled */
|
|
13
13
|
enabled?: boolean;
|
|
@@ -17,6 +17,8 @@ export interface UseInfiniteReturn<T> {
|
|
|
17
17
|
hasMore: boolean;
|
|
18
18
|
isLoading: boolean;
|
|
19
19
|
isReloading: boolean;
|
|
20
|
+
/** The failed request's error, or null; cleared once a load succeeds. */
|
|
21
|
+
error: Error | null;
|
|
20
22
|
total: number;
|
|
21
23
|
onQueryChange: (queryString: string) => void;
|
|
22
24
|
reload: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInfinite.d.ts","sourceRoot":"","sources":["../../src/hooks/useInfinite.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAQtC,UAAU,kBAAkB;IAC1B,aAAa,EAAE,aAAa,CAAC;IAC7B,0EAA0E;IAC1E,QAAQ,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,QAAQ,EAAE,MAAM,CAAC;IACjB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,
|
|
1
|
+
{"version":3,"file":"useInfinite.d.ts","sourceRoot":"","sources":["../../src/hooks/useInfinite.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAQtC,UAAU,kBAAkB;IAC1B,aAAa,EAAE,aAAa,CAAC;IAC7B,0EAA0E;IAC1E,QAAQ,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,QAAQ,EAAE,MAAM,CAAC;IACjB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,sEAAsE;IACtE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iDAAiD;IACjD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,iBAAiB,CAAC,CAAC;IAClC,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,QAAA,MAAM,WAAW,GAAI,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,EACpD,SAAS,kBAAkB,KAC1B,iBAAiB,CAAC,CAAC,CAgHrB,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { useCallback, useEffect, useRef, useState } from "react";
|
|
3
3
|
import { useQuery } from "@tanstack/react-query";
|
|
4
4
|
const useInfinite = (options) => {
|
|
5
|
-
const { axiosInstance, endpoint, queryKey, orgId, initialLimit =
|
|
5
|
+
const { axiosInstance, endpoint, queryKey, orgId, initialLimit = 25, } = options;
|
|
6
6
|
const [queryString, setQueryString] = useState(`limit=${initialLimit}&offset=0`);
|
|
7
7
|
const [allData, setAllData] = useState([]);
|
|
8
8
|
const [reloadKey, setReloadKey] = useState(0);
|
|
@@ -83,9 +83,11 @@ const useInfinite = (options) => {
|
|
|
83
83
|
}, [query.data]);
|
|
84
84
|
return {
|
|
85
85
|
data: allData,
|
|
86
|
-
|
|
86
|
+
// After a failure, stop offering pages: reload() retries.
|
|
87
|
+
hasMore: query.isError ? false : (query.data?.hasMore ?? true),
|
|
87
88
|
isLoading: query.isLoading,
|
|
88
89
|
isReloading: query.isFetching && allData.length > 0,
|
|
90
|
+
error: query.error,
|
|
89
91
|
total: query.data?.total ?? 0,
|
|
90
92
|
onQueryChange: handleQueryChange,
|
|
91
93
|
reload,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInfinite.js","sourceRoot":"","sources":["../../src/hooks/useInfinite.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"useInfinite.js","sourceRoot":"","sources":["../../src/hooks/useInfinite.ts"],"names":[],"mappings":"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"}
|
|
@@ -12,7 +12,7 @@ interface UseInfiniteArchivableCursorOptions {
|
|
|
12
12
|
queryKey: string | (string | null)[];
|
|
13
13
|
/** Organization ID to scope cache keys (prevents stale cross-org data). */
|
|
14
14
|
orgId?: string | null;
|
|
15
|
-
/** Initial page size (default:
|
|
15
|
+
/** Initial page size (default: 25, InfiniteScroll's default). */
|
|
16
16
|
initialLimit?: number;
|
|
17
17
|
enabled?: boolean;
|
|
18
18
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInfiniteArchivableCursor.d.ts","sourceRoot":"","sources":["../../src/hooks/useInfiniteArchivableCursor.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAE1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAS3C,UAAU,kCAAkC;IAC1C,aAAa,EAAE,aAAa,CAAC;IAC7B,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,QAAQ,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACrC,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,
|
|
1
|
+
{"version":3,"file":"useInfiniteArchivableCursor.d.ts","sourceRoot":"","sources":["../../src/hooks/useInfiniteArchivableCursor.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAE1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAS3C,UAAU,kCAAkC;IAC1C,aAAa,EAAE,aAAa,CAAC;IAC7B,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,QAAQ,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACrC,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,iEAAiE;IACjE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,2BAA2B,GAAI,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,EACpE,SAAS,kCAAkC,KAC1C,iBAAiB,CAAC,CAAC,CA0GrB,CAAC;AAEF,eAAe,2BAA2B,CAAC"}
|