@flipdish/portal-library 3.7.1 → 4.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/dist/components/FDErrorBoundary/index.cjs.js.map +1 -1
- package/dist/components/FDErrorBoundary/index.js.map +1 -1
- package/dist/components/Form/FormItemLayout/index.cjs.js.map +1 -1
- package/dist/components/Form/FormItemLayout/index.js.map +1 -1
- package/dist/components/Form/GenericAutocompleteField/index.cjs.js +1 -1
- package/dist/components/Form/GenericAutocompleteField/index.cjs.js.map +1 -1
- package/dist/components/Form/GenericAutocompleteField/index.d.ts +4 -4
- package/dist/components/Form/GenericAutocompleteField/index.js +1 -1
- package/dist/components/Form/GenericAutocompleteField/index.js.map +1 -1
- package/dist/components/Form/GenericFormContainer/index.cjs.js +1 -1
- package/dist/components/Form/GenericFormContainer/index.cjs.js.map +1 -1
- package/dist/components/Form/GenericFormContainer/index.d.ts +3 -3
- package/dist/components/Form/GenericFormContainer/index.js +1 -1
- package/dist/components/Form/GenericFormContainer/index.js.map +1 -1
- package/dist/components/Form/GenericTextField/index.cjs.js.map +1 -1
- package/dist/components/Form/GenericTextField/index.js.map +1 -1
- package/dist/components/Form/PaginatedAutocompleteField/index.cjs.js +1 -1
- package/dist/components/Form/PaginatedAutocompleteField/index.cjs.js.map +1 -1
- package/dist/components/Form/PaginatedAutocompleteField/index.js +1 -1
- package/dist/components/Form/PaginatedAutocompleteField/index.js.map +1 -1
- package/dist/components/GenericDatePickerField/GenericDateFieldBase.cjs.js.map +1 -1
- package/dist/components/GenericDatePickerField/GenericDateFieldBase.js.map +1 -1
- package/dist/components/GenericRadioButtons/index.cjs.js +1 -1
- package/dist/components/GenericRadioButtons/index.cjs.js.map +1 -1
- package/dist/components/GenericRadioButtons/index.d.ts +3 -3
- package/dist/components/GenericRadioButtons/index.js +1 -1
- package/dist/components/GenericRadioButtons/index.js.map +1 -1
- package/dist/components/GenericTable/HighlightScrollbar.cjs.js.map +1 -1
- package/dist/components/GenericTable/HighlightScrollbar.js.map +1 -1
- package/dist/components/GenericTable/index.cjs.js +1 -1
- package/dist/components/GenericTable/index.cjs.js.map +1 -1
- package/dist/components/GenericTable/index.js +1 -1
- package/dist/components/GenericTable/index.js.map +1 -1
- package/dist/components/GenericTableBody/index.cjs.js +1 -1
- package/dist/components/GenericTableBody/index.cjs.js.map +1 -1
- package/dist/components/GenericTableBody/index.d.ts +9 -9
- package/dist/components/GenericTableBody/index.js +1 -1
- package/dist/components/GenericTableBody/index.js.map +1 -1
- package/dist/components/GenericTableBodyRow/index.cjs.js +1 -1
- package/dist/components/GenericTableBodyRow/index.cjs.js.map +1 -1
- package/dist/components/GenericTableBodyRow/index.d.ts +2 -2
- package/dist/components/GenericTableBodyRow/index.js +1 -1
- package/dist/components/GenericTableBodyRow/index.js.map +1 -1
- package/dist/components/ListItemLinkButton/index.cjs.js +1 -1
- package/dist/components/ListItemLinkButton/index.cjs.js.map +1 -1
- package/dist/components/ListItemLinkButton/index.js +1 -1
- package/dist/components/ListItemLinkButton/index.js.map +1 -1
- package/dist/components/NoResults/index.cjs.js.map +1 -1
- package/dist/components/NoResults/index.js.map +1 -1
- package/dist/components/PageLayout/DocumentTitle.cjs.js.map +1 -1
- package/dist/components/PageLayout/DocumentTitle.d.ts +1 -1
- package/dist/components/PageLayout/DocumentTitle.js.map +1 -1
- package/dist/components/PageLayout/FullWidthContainer.cjs.js.map +1 -1
- package/dist/components/PageLayout/FullWidthContainer.js.map +1 -1
- package/dist/components/PageLayout/GlobalSpacingStyles.cjs.js.map +1 -1
- package/dist/components/PageLayout/GlobalSpacingStyles.js.map +1 -1
- package/dist/components/PageLayout/index.cjs.js.map +1 -1
- package/dist/components/PageLayout/index.js.map +1 -1
- package/dist/components/PortalMock/index.cjs.js.map +1 -1
- package/dist/components/PortalMock/index.js.map +1 -1
- package/dist/components/Spacer/index.cjs.js.map +1 -1
- package/dist/components/Spacer/index.js.map +1 -1
- package/dist/components/atoms/Badge/index.cjs.js +1 -1
- package/dist/components/atoms/Badge/index.cjs.js.map +1 -1
- package/dist/components/atoms/Badge/index.js +1 -1
- package/dist/components/atoms/Badge/index.js.map +1 -1
- package/dist/components/atoms/Button/buttonThemeOverrides.cjs.js +2 -0
- package/dist/components/atoms/Button/buttonThemeOverrides.cjs.js.map +1 -0
- package/dist/components/atoms/Button/buttonThemeOverrides.d.ts +21 -0
- package/dist/components/atoms/Button/buttonThemeOverrides.js +2 -0
- package/dist/components/atoms/Button/buttonThemeOverrides.js.map +1 -0
- package/dist/components/atoms/Button/getButtonStyles.cjs.js +2 -0
- package/dist/components/atoms/Button/getButtonStyles.cjs.js.map +1 -0
- package/dist/components/atoms/Button/getButtonStyles.d.ts +15 -0
- package/dist/components/atoms/Button/getButtonStyles.js +2 -0
- package/dist/components/atoms/Button/getButtonStyles.js.map +1 -0
- package/dist/components/atoms/Button/index.cjs.js +2 -0
- package/dist/components/atoms/Button/index.cjs.js.map +1 -0
- package/dist/components/atoms/Button/index.d.ts +26 -0
- package/dist/components/atoms/Button/index.js +2 -0
- package/dist/components/atoms/Button/index.js.map +1 -0
- package/dist/components/atoms/IconContainer/index.cjs.js.map +1 -1
- package/dist/components/molecules/Alert/index.cjs.js +1 -1
- package/dist/components/molecules/Alert/index.cjs.js.map +1 -1
- package/dist/components/molecules/Alert/index.d.ts +1 -1
- package/dist/components/molecules/Alert/index.js +1 -1
- package/dist/components/molecules/Alert/index.js.map +1 -1
- package/dist/components/molecules/Modal/index.cjs.js.map +1 -1
- package/dist/components/molecules/Modal/index.js.map +1 -1
- package/dist/custom-hooks/useMicroFrontendAttributes.cjs.js +1 -1
- package/dist/custom-hooks/useMicroFrontendAttributes.cjs.js.map +1 -1
- package/dist/custom-hooks/useMicroFrontendAttributes.d.ts +4 -4
- package/dist/custom-hooks/useMicroFrontendAttributes.js +1 -1
- package/dist/custom-hooks/useMicroFrontendAttributes.js.map +1 -1
- package/dist/custom-hooks/useRenderValidText.cjs.js.map +1 -1
- package/dist/custom-hooks/useRenderValidText.d.ts +3 -3
- package/dist/custom-hooks/useRenderValidText.js.map +1 -1
- package/dist/custom-hooks/useToasts.cjs.js.map +1 -1
- package/dist/custom-hooks/useToasts.js.map +1 -1
- package/dist/icons/helpers/withSvgIcon.cjs.js.map +1 -1
- package/dist/icons/helpers/withSvgIcon.js.map +1 -1
- package/dist/themes/ThemeProvider.cjs.js.map +1 -1
- package/dist/themes/flipdishPublicTheme.cjs.js +1 -1
- package/dist/themes/flipdishPublicTheme.cjs.js.map +1 -1
- package/dist/themes/flipdishPublicTheme.js +1 -1
- package/dist/themes/flipdishPublicTheme.js.map +1 -1
- package/dist/themes/theme.d.ts +14 -2
- package/dist/themes/tokens/colours/colours-stories-utils.cjs.js +1 -1
- package/dist/themes/tokens/colours/colours-stories-utils.cjs.js.map +1 -1
- package/dist/themes/tokens/colours/colours-stories-utils.js +1 -1
- package/dist/themes/tokens/colours/colours-stories-utils.js.map +1 -1
- package/dist/themes/tokens/colours/primitives.cjs.js +1 -1
- package/dist/themes/tokens/colours/primitives.cjs.js.map +1 -1
- package/dist/themes/tokens/colours/primitives.js +1 -1
- package/dist/themes/tokens/colours/primitives.js.map +1 -1
- package/dist/themes/tokens/colours/semantic.cjs.js +1 -1
- package/dist/themes/tokens/colours/semantic.cjs.js.map +1 -1
- package/dist/themes/tokens/colours/semantic.d.ts +223 -4
- package/dist/themes/tokens/colours/semantic.js +1 -1
- package/dist/themes/tokens/colours/semantic.js.map +1 -1
- package/dist/themes/tokens/colours/types.d.ts +14 -14
- package/dist/themes/tokens/shadows/shadows.cjs.js +2 -0
- package/dist/themes/tokens/shadows/shadows.cjs.js.map +1 -0
- package/dist/themes/tokens/shadows/shadows.d.ts +8 -0
- package/dist/themes/tokens/shadows/shadows.js +2 -0
- package/dist/themes/tokens/shadows/shadows.js.map +1 -0
- package/dist/themes/typography.cjs.js.map +1 -1
- package/dist/themes/typography.d.ts +31 -2
- package/dist/themes/typography.js.map +1 -1
- package/dist/utilities/formValidation.cjs.js +1 -1
- package/dist/utilities/formValidation.cjs.js.map +1 -1
- package/dist/utilities/formValidation.d.ts +1 -1
- package/dist/utilities/formValidation.js.map +1 -1
- package/dist/utilities/genericUtilities.cjs.js.map +1 -1
- package/dist/utilities/genericUtilities.js.map +1 -1
- package/dist/utilities/renderUtilities.cjs.js.map +1 -1
- package/dist/utilities/renderUtilities.js.map +1 -1
- package/package.json +5 -4
- package/dist/components/Button/index.cjs.js +0 -2
- package/dist/components/Button/index.cjs.js.map +0 -1
- package/dist/components/Button/index.d.ts +0 -6
- package/dist/components/Button/index.js +0 -2
- package/dist/components/Button/index.js.map +0 -1
- package/dist/themes/tokens/colours/index.cjs.js +0 -2
- package/dist/themes/tokens/colours/index.cjs.js.map +0 -1
- package/dist/themes/tokens/colours/index.d.ts +0 -3
- package/dist/themes/tokens/colours/index.js +0 -2
- package/dist/themes/tokens/colours/index.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Form/PaginatedAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Form/PaginatedAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { type SyntheticEvent, useCallback, useEffect, useState } from 'react';\n\nimport { useQuery } from '@tanstack/react-query';\nimport { useFormikContext } from 'formik';\nimport debounce from 'lodash.debounce';\n\nimport GenericAutocompleteField, {\n type Props as GenericAutocompleteFieldProps,\n} from '../GenericAutocompleteField';\n\ntype Props<T> = Omit<GenericAutocompleteFieldProps<T>, 'options'> & {\n fetch: (page: number, search: string) => Promise<T[]>;\n};\n\nconst PaginatedAutocompleteField = <T,>(props: Props<T>) => {\n const { fieldName, fetch, onChange, onInputChange, onScroll } = props;\n const { values } = useFormikContext<{ [key: string]: any }>();\n\n const [options, setOptions] = useState<T[]>(values[fieldName] ? [values[fieldName]] : []);\n const [page, setPage] = useState(1);\n const [searchQuery, setSearchQuery] = useState('');\n const [hasMore, setHasMore] = useState(true);\n\n const { data: queryResult, isLoading } = useQuery({\n queryKey: [`PaginatedAutocompleteField-${fieldName}`, page, searchQuery],\n queryFn: () => fetch(page, searchQuery),\n retry: 1,\n });\n\n useEffect(() => {\n if (!queryResult || queryResult.length === 0) {\n setHasMore(false);\n return;\n }\n setHasMore(true);\n if (page === 1) {\n setOptions(queryResult);\n } else {\n setOptions((prevVouchers) => [...prevVouchers, ...queryResult]);\n }\n }, [queryResult]);\n\n const loadMore = useCallback(() => {\n if (isLoading || !hasMore) {\n return;\n }\n setPage((prevPage) => prevPage + 1);\n }, [isLoading, hasMore]);\n\n const handleScroll = (event: React.UIEvent<HTMLUListElement, UIEvent>) => {\n const listboxNode = event.currentTarget;\n if (\n listboxNode.scrollTop + listboxNode.clientHeight >=\n listboxNode.scrollHeight - 100 // Trigger 100px before the bottom\n ) {\n loadMore();\n }\n };\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-call\n const handleInputChange = debounce((value: string) => {\n setPage(1);\n setSearchQuery(value);\n setHasMore(true);\n }, 500);\n\n useEffect(() => {\n return () => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access\n handleInputChange.cancel();\n };\n }, [handleInputChange]);\n\n return (\n <GenericAutocompleteField\n {...props}\n loading={isLoading}\n options={options}\n onChange={(e: SyntheticEvent<Element, Event>, value: T | T[] | null) => {\n setSearchQuery('');\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={(e: SyntheticEvent, value: string) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n handleInputChange(value);\n if (onInputChange) {\n onInputChange(e, value);\n }\n }}\n onScroll={(e: React.UIEvent<HTMLUListElement, UIEvent>) => {\n handleScroll(e);\n if (onScroll) {\n onScroll(e);\n }\n }}\n />\n );\n};\n\nexport default PaginatedAutocompleteField;\n"],"names":["PaginatedAutocompleteField","props","fieldName","fetch","onChange","onInputChange","onScroll","values","useFormikContext","options","setOptions","useState","page","setPage","searchQuery","setSearchQuery","hasMore","setHasMore","data","queryResult","isLoading","useQuery","queryKey","queryFn","retry","useEffect","length","prevVouchers","loadMore","useCallback","prevPage","handleInputChange","debounce","value","cancel","_jsx","GenericAutocompleteField","loading","e","event","listboxNode","currentTarget","scrollTop","clientHeight","scrollHeight","handleScroll"],"mappings":"uRAeA,MAAMA,EAAkCC,IACtC,MAAMC,UAAEA,EAASC,MAAEA,EAAKC,SAAEA,EAAQC,cAAEA,EAAaC,SAAEA,GAAaL,GAC1DM,OAAEA,GAAWC,KAEZC,EAASC,GAAcC,EAAcJ,EAAOL,GAAa,CAACK,EAAOL,IAAc,KAC/EU,EAAMC,GAAWF,EAAS,IAC1BG,EAAaC,GAAkBJ,EAAS,KACxCK,EAASC,GAAcN,GAAS,IAE/BO,KAAMC,EAAWC,UAAEA,GAAcC,EAAS,CAChDC,SAAU,CAAC,8BAA8BpB,IAAaU,EAAME,GAC5DS,QAAS,IAAMpB,EAAMS,EAAME,GAC3BU,MAAO,IAGTC,GAAU,KACHN,GAAsC,IAAvBA,EAAYO,QAIhCT,GAAW,GAETP,EADW,IAATE,EACSO,EAECQ,GAAiB,IAAIA,KAAiBR,KAPlDF,GAAW,KASZ,CAACE,IAEJ,MAAMS,EAAWC,GAAY,MACvBT,GAAcJ,GAGlBH,GAASiB,GAAaA,EAAW,MAChC,CAACV,EAAWJ,IAaTe,EAAoBC,GAAUC,IAClCpB,EAAQ,GACRE,EAAekB,GACfhB,GAAW,KACV,KASH,OAPAQ,GAAU,IACD,KAELM,EAAkBG,WAEnB,CAACH,IAGFI,EAACC,EAAwB,IACnBnC,EACJoC,QAASjB,EACTX,QAASA,EACTL,SAAU,CAACkC,EAAmCL,KAC5ClB,EAAe,IACXX,GACFA,EAASkC,EAAGL,IAGhB5B,cAAe,CAACiC,EAAmBL,KAEjCF,EAAkBE,GACd5B,GACFA,EAAciC,EAAGL,IAGrB3B,SAAWgC,IA1CM,CAACC,IACpB,MAAMC,EAAcD,EAAME,cAExBD,EAAYE,UAAYF,EAAYG,cACpCH,EAAYI,aAAe,KAE3BhB,KAqCEiB,CAAaP,GACThC,GACFA,EAASgC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GenericDateFieldBase.cjs.js","sources":["../../../src/components/GenericDatePickerField/GenericDateFieldBase.tsx"],"sourcesContent":["import { type FieldProps, Field } from 'formik';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport { styled, useTheme } from '@mui/material/styles';\nimport { type TextFieldVariants } from '@mui/material/TextField';\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport moment from 'moment';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';\n\nconst StyledPickerBase = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n '& > div': {\n width: '100%',\n },\n}));\n\nexport type GenericDateFieldBaseProps = {\n label: string;\n placeholder?: string;\n fieldName: string;\n description?: string;\n validation?: (value: string) => string | undefined;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldVariants;\n disabled?: boolean;\n disablePast?: boolean;\n disablefuture?: boolean;\n onChange?: (dateTime: moment.Moment) => void;\n showHelperTextWhenValid?: boolean;\n pickerComponent: typeof DatePicker | typeof DateTimePicker;\n};\n\nconst GenericDateFieldBase = ({\n label,\n fieldName,\n description,\n validation,\n variant = 'standard',\n layout,\n onChange,\n disabled = false,\n disablePast = false,\n disablefuture = false,\n placeholder = undefined,\n showHelperTextWhenValid = false,\n pickerComponent: PickerComponent,\n}: GenericDateFieldBaseProps) => {\n const theme = useTheme();\n\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {({ field, form }: FieldProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <Box sx={{ paddingRight: layout === 'horizontal' ? '16px' : 0 }}>\n <StyledPickerBase>\n <PickerComponent\n label={variant === 'standard' ? undefined : label}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n value={moment.isMoment(field.value) ? field.value : moment(field.value)}\n onChange={(value) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n const momentValue = moment.isMoment(value) ? value : moment(value);\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(field.name, momentValue);\n if (onChange) {\n onChange(momentValue);\n }\n }}\n name={fieldName}\n slotProps={{\n textField: {\n variant,\n placeholder,\n error: showError,\n helperText: (() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })(),\n FormHelperTextProps: {\n children: ' ',\n style: { textAlign: 'right' },\n },\n },\n }}\n disabled={isSubmitting || disabled}\n disablePast={disablePast}\n disableFuture={disablefuture}\n />\n </StyledPickerBase>\n {description && (\n <Typography variant=\"caption\" sx={{ color: theme.palette.text.secondary }}>\n {description}\n </Typography>\n )}\n </Box>\n );\n }}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericDateFieldBase;\n"],"names":["StyledPickerBase","styled","theme","marginTop","spacing","width","label","fieldName","description","validation","variant","layout","onChange","disabled","disablePast","disablefuture","placeholder","showHelperTextWhenValid","pickerComponent","PickerComponent","useTheme","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","_jsxs","jsxs","Box","sx","paddingRight","undefined","moment","isMoment","momentValue","setFieldValue","slotProps","textField","error","FormHelperTextProps","style","textAlign","disableFuture","Typography","color","palette","text","secondary","_Fragment","component","FormItemLayout"],"mappings":"yaAWA,MAAMA,EAAmBC,EAAAA,OAAO,MAAPA,EAAc,EAAGC,YAAa,CACnDC,UAAWD,EAAME,QAAQ,GACzB,UAAW,CACPC,MAAO,2BAoBc,EACzBC,QACAC,YACAC,cACAC,aACAC,UAAU,WACVC,SACAC,WACAC,YAAW,EACXC,eAAc,EACdC,iBAAgB,EAChBC,cACAC,2BAA0B,EAC1BC,gBAAiBC,MAEjB,MAAMjB,EAAQkB,EAAAA,WAERC,EAAc,IAEZC,MAACC,EAAAA,OAAMC,KAAMjB,EAAWkB,SAAUhB,EAAUiB,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EACf,CACIH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,OAEjB,SAGJ,OACIC,EAACC,KAAAC,GAAIC,GAAI,CAAEC,aAAyB,eAAX9B,EAA0B,OAAS,GAAGe,SAAA,CAC3DJ,EAAAA,IAACtB,EAAgB,CAAA0B,SACbJ,MAACH,EAAe,CACZb,MAAmB,aAAZI,OAAyBgC,EAAYpC,EAE5C8B,MAAOO,EAAOC,SAASjB,EAAMS,OAAST,EAAMS,MAAQO,EAAOhB,EAAMS,OACjExB,SAAWwB,IAEP,MAAMS,EAAcF,EAAOC,SAASR,GAASA,EAAQO,EAAOP,GAE5DR,EAAKkB,cAAcnB,EAAMH,KAAMqB,GAC3BjC,GACAA,EAASiC,IAGjBrB,KAAMjB,EACNwC,UAAW,CACPC,UAAW,CACPtC,UACAM,cACAiC,MAAOhB,EACPC,WACQD,GACAhB,EADkBiB,OACtB,EAGJgB,oBAAqB,CACjBxB,SAAU,IACVyB,MAAO,CAAEC,UAAW,YAIhCvC,SAAUkB,GAAgBlB,EAC1BC,YAAaA,EACbuC,cAAetC,MAGtBP,GACGc,EAAAA,IAACgC,EAAU,CAAC5C,QAAQ,UAAU8B,GAAI,CAAEe,MAAOrD,EAAMsD,QAAQC,KAAKC,WAAWhC,SACpElB,
|
|
1
|
+
{"version":3,"file":"GenericDateFieldBase.cjs.js","sources":["../../../src/components/GenericDatePickerField/GenericDateFieldBase.tsx"],"sourcesContent":["import { type FieldProps, Field } from 'formik';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport { styled, useTheme } from '@mui/material/styles';\nimport { type TextFieldVariants } from '@mui/material/TextField';\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport moment from 'moment';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';\n\nconst StyledPickerBase = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n '& > div': {\n width: '100%',\n },\n}));\n\nexport type GenericDateFieldBaseProps = {\n label: string;\n placeholder?: string;\n fieldName: string;\n description?: string;\n validation?: (value: string) => string | undefined;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldVariants;\n disabled?: boolean;\n disablePast?: boolean;\n disablefuture?: boolean;\n onChange?: (dateTime: moment.Moment) => void;\n showHelperTextWhenValid?: boolean;\n pickerComponent: typeof DatePicker | typeof DateTimePicker;\n};\n\nconst GenericDateFieldBase = ({\n label,\n fieldName,\n description,\n validation,\n variant = 'standard',\n layout,\n onChange,\n disabled = false,\n disablePast = false,\n disablefuture = false,\n placeholder = undefined,\n showHelperTextWhenValid = false,\n pickerComponent: PickerComponent,\n}: GenericDateFieldBaseProps) => {\n const theme = useTheme();\n\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {({ field, form }: FieldProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <Box sx={{ paddingRight: layout === 'horizontal' ? '16px' : 0 }}>\n <StyledPickerBase>\n <PickerComponent\n label={variant === 'standard' ? undefined : label}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n value={moment.isMoment(field.value) ? field.value : moment(field.value)}\n onChange={(value) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n const momentValue = moment.isMoment(value) ? value : moment(value);\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(field.name, momentValue);\n if (onChange) {\n onChange(momentValue);\n }\n }}\n name={fieldName}\n slotProps={{\n textField: {\n variant,\n placeholder,\n error: showError,\n helperText: (() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })(),\n FormHelperTextProps: {\n children: ' ',\n style: { textAlign: 'right' },\n },\n },\n }}\n disabled={isSubmitting || disabled}\n disablePast={disablePast}\n disableFuture={disablefuture}\n />\n </StyledPickerBase>\n {description && (\n <Typography variant=\"caption\" sx={{ color: theme.palette.text.secondary }}>\n {description}\n </Typography>\n )}\n </Box>\n );\n }}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericDateFieldBase;\n"],"names":["StyledPickerBase","styled","theme","marginTop","spacing","width","label","fieldName","description","validation","variant","layout","onChange","disabled","disablePast","disablefuture","placeholder","showHelperTextWhenValid","pickerComponent","PickerComponent","useTheme","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","_jsxs","jsxs","Box","sx","paddingRight","undefined","moment","isMoment","momentValue","setFieldValue","slotProps","textField","error","FormHelperTextProps","style","textAlign","disableFuture","Typography","color","palette","text","secondary","_Fragment","component","FormItemLayout"],"mappings":"yaAWA,MAAMA,EAAmBC,EAAAA,OAAO,MAAPA,EAAc,EAAGC,YAAa,CACnDC,UAAWD,EAAME,QAAQ,GACzB,UAAW,CACPC,MAAO,2BAoBc,EACzBC,QACAC,YACAC,cACAC,aACAC,UAAU,WACVC,SACAC,WACAC,YAAW,EACXC,eAAc,EACdC,iBAAgB,EAChBC,cACAC,2BAA0B,EAC1BC,gBAAiBC,MAEjB,MAAMjB,EAAQkB,EAAAA,WAERC,EAAc,IAEZC,MAACC,EAAAA,OAAMC,KAAMjB,EAAWkB,SAAUhB,EAAUiB,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EACf,CACIH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,OAEjB,SAGJ,OACIC,EAACC,KAAAC,GAAIC,GAAI,CAAEC,aAAyB,eAAX9B,EAA0B,OAAS,GAAGe,SAAA,CAC3DJ,EAAAA,IAACtB,EAAgB,CAAA0B,SACbJ,MAACH,EAAe,CACZb,MAAmB,aAAZI,OAAyBgC,EAAYpC,EAE5C8B,MAAOO,EAAOC,SAASjB,EAAMS,OAAST,EAAMS,MAAQO,EAAOhB,EAAMS,OACjExB,SAAWwB,IAEP,MAAMS,EAAcF,EAAOC,SAASR,GAASA,EAAQO,EAAOP,GAE5DR,EAAKkB,cAAcnB,EAAMH,KAAMqB,GAC3BjC,GACAA,EAASiC,IAGjBrB,KAAMjB,EACNwC,UAAW,CACPC,UAAW,CACPtC,UACAM,cACAiC,MAAOhB,EACPC,WACQD,GACAhB,EADkBiB,OACtB,EAGJgB,oBAAqB,CACjBxB,SAAU,IACVyB,MAAO,CAAEC,UAAW,YAIhCvC,SAAUkB,GAAgBlB,EAC1BC,YAAaA,EACbuC,cAAetC,MAGtBP,GACGc,EAAAA,IAACgC,EAAU,CAAC5C,QAAQ,UAAU8B,GAAI,CAAEe,MAAOrD,EAAMsD,QAAQC,KAAKC,WAAWhC,SACpElB,UAUjC,MAAe,aAAXG,EAEI0B,EAAAC,KAAAqB,WAAA,CAAAjC,SAAA,CACiB,aAAZhB,GACGY,EAAAA,IAACgC,EAAU,CAAC5C,QAAQ,YAAYkD,UAAU,KAAKL,MAAM,cAChD7B,SAAApB,IAGRe,OAKNC,EAAAA,IAACuC,EAAc,CAACvD,MAAOA,EAAQoB,SAAAL"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GenericDateFieldBase.js","sources":["../../../src/components/GenericDatePickerField/GenericDateFieldBase.tsx"],"sourcesContent":["import { type FieldProps, Field } from 'formik';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport { styled, useTheme } from '@mui/material/styles';\nimport { type TextFieldVariants } from '@mui/material/TextField';\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport moment from 'moment';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';\n\nconst StyledPickerBase = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n '& > div': {\n width: '100%',\n },\n}));\n\nexport type GenericDateFieldBaseProps = {\n label: string;\n placeholder?: string;\n fieldName: string;\n description?: string;\n validation?: (value: string) => string | undefined;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldVariants;\n disabled?: boolean;\n disablePast?: boolean;\n disablefuture?: boolean;\n onChange?: (dateTime: moment.Moment) => void;\n showHelperTextWhenValid?: boolean;\n pickerComponent: typeof DatePicker | typeof DateTimePicker;\n};\n\nconst GenericDateFieldBase = ({\n label,\n fieldName,\n description,\n validation,\n variant = 'standard',\n layout,\n onChange,\n disabled = false,\n disablePast = false,\n disablefuture = false,\n placeholder = undefined,\n showHelperTextWhenValid = false,\n pickerComponent: PickerComponent,\n}: GenericDateFieldBaseProps) => {\n const theme = useTheme();\n\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {({ field, form }: FieldProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <Box sx={{ paddingRight: layout === 'horizontal' ? '16px' : 0 }}>\n <StyledPickerBase>\n <PickerComponent\n label={variant === 'standard' ? undefined : label}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n value={moment.isMoment(field.value) ? field.value : moment(field.value)}\n onChange={(value) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n const momentValue = moment.isMoment(value) ? value : moment(value);\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(field.name, momentValue);\n if (onChange) {\n onChange(momentValue);\n }\n }}\n name={fieldName}\n slotProps={{\n textField: {\n variant,\n placeholder,\n error: showError,\n helperText: (() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })(),\n FormHelperTextProps: {\n children: ' ',\n style: { textAlign: 'right' },\n },\n },\n }}\n disabled={isSubmitting || disabled}\n disablePast={disablePast}\n disableFuture={disablefuture}\n />\n </StyledPickerBase>\n {description && (\n <Typography variant=\"caption\" sx={{ color: theme.palette.text.secondary }}>\n {description}\n </Typography>\n )}\n </Box>\n );\n }}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericDateFieldBase;\n"],"names":["StyledPickerBase","styled","theme","marginTop","spacing","width","GenericDateFieldBase","label","fieldName","description","validation","variant","layout","onChange","disabled","disablePast","disablefuture","placeholder","showHelperTextWhenValid","pickerComponent","PickerComponent","useTheme","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","_jsxs","Box","sx","paddingRight","undefined","moment","isMoment","momentValue","setFieldValue","slotProps","textField","error","FormHelperTextProps","style","textAlign","disableFuture","Typography","color","palette","text","secondary","_Fragment","component","FormItemLayout"],"mappings":"mdAWA,MAAMA,EAAmBC,EAAO,MAAPA,EAAc,EAAGC,YAAa,CACnDC,UAAWD,EAAME,QAAQ,GACzB,UAAW,CACPC,MAAO,YAoBTC,EAAuB,EACzBC,QACAC,YACAC,cACAC,aACAC,UAAU,WACVC,SACAC,WACAC,YAAW,EACXC,eAAc,EACdC,iBAAgB,EAChBC,cACAC,2BAA0B,EAC1BC,gBAAiBC,MAEjB,MAAMlB,EAAQmB,IAERC,EAAc,IAEZC,EAACC,GAAMC,KAAMjB,EAAWkB,SAAUhB,EAAUiB,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EACf,CACIH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,OAEjB,SAGJ,OACIC,EAACC,GAAIC,GAAI,CAAEC,aAAyB,eAAX7B,EAA0B,OAAS,GAAGe,SAAA,CAC3DJ,EAACvB,EAAgB,CAAA2B,SACbJ,EAACH,EAAe,CACZb,MAAmB,aAAZI,OAAyB+B,EAAYnC,EAE5C8B,MAAOM,EAAOC,SAAShB,EAAMS,OAAST,EAAMS,MAAQM,EAAOf,EAAMS,OACjExB,SAAWwB,IAEP,MAAMQ,EAAcF,EAAOC,SAASP,GAASA,EAAQM,EAAON,GAE5DR,EAAKiB,cAAclB,EAAMH,KAAMoB,GAC3BhC,GACAA,EAASgC,IAGjBpB,KAAMjB,EACNuC,UAAW,CACPC,UAAW,CACPrC,UACAM,cACAgC,MAAOf,EACPC,WACQD,GACAhB,EADkBiB,OACtB,EAGJe,oBAAqB,CACjBvB,SAAU,IACVwB,MAAO,CAAEC,UAAW,YAIhCtC,SAAUkB,GAAgBlB,EAC1BC,YAAaA,EACbsC,cAAerC,MAGtBP,GACGc,EAAC+B,EAAU,CAAC3C,QAAQ,UAAU6B,GAAI,CAAEe,MAAOrD,EAAMsD,QAAQC,KAAKC,WAAW/B,SACpElB,
|
|
1
|
+
{"version":3,"file":"GenericDateFieldBase.js","sources":["../../../src/components/GenericDatePickerField/GenericDateFieldBase.tsx"],"sourcesContent":["import { type FieldProps, Field } from 'formik';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport { styled, useTheme } from '@mui/material/styles';\nimport { type TextFieldVariants } from '@mui/material/TextField';\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport moment from 'moment';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';\n\nconst StyledPickerBase = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n '& > div': {\n width: '100%',\n },\n}));\n\nexport type GenericDateFieldBaseProps = {\n label: string;\n placeholder?: string;\n fieldName: string;\n description?: string;\n validation?: (value: string) => string | undefined;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldVariants;\n disabled?: boolean;\n disablePast?: boolean;\n disablefuture?: boolean;\n onChange?: (dateTime: moment.Moment) => void;\n showHelperTextWhenValid?: boolean;\n pickerComponent: typeof DatePicker | typeof DateTimePicker;\n};\n\nconst GenericDateFieldBase = ({\n label,\n fieldName,\n description,\n validation,\n variant = 'standard',\n layout,\n onChange,\n disabled = false,\n disablePast = false,\n disablefuture = false,\n placeholder = undefined,\n showHelperTextWhenValid = false,\n pickerComponent: PickerComponent,\n}: GenericDateFieldBaseProps) => {\n const theme = useTheme();\n\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {({ field, form }: FieldProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <Box sx={{ paddingRight: layout === 'horizontal' ? '16px' : 0 }}>\n <StyledPickerBase>\n <PickerComponent\n label={variant === 'standard' ? undefined : label}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n value={moment.isMoment(field.value) ? field.value : moment(field.value)}\n onChange={(value) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n const momentValue = moment.isMoment(value) ? value : moment(value);\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(field.name, momentValue);\n if (onChange) {\n onChange(momentValue);\n }\n }}\n name={fieldName}\n slotProps={{\n textField: {\n variant,\n placeholder,\n error: showError,\n helperText: (() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })(),\n FormHelperTextProps: {\n children: ' ',\n style: { textAlign: 'right' },\n },\n },\n }}\n disabled={isSubmitting || disabled}\n disablePast={disablePast}\n disableFuture={disablefuture}\n />\n </StyledPickerBase>\n {description && (\n <Typography variant=\"caption\" sx={{ color: theme.palette.text.secondary }}>\n {description}\n </Typography>\n )}\n </Box>\n );\n }}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericDateFieldBase;\n"],"names":["StyledPickerBase","styled","theme","marginTop","spacing","width","GenericDateFieldBase","label","fieldName","description","validation","variant","layout","onChange","disabled","disablePast","disablefuture","placeholder","showHelperTextWhenValid","pickerComponent","PickerComponent","useTheme","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","_jsxs","Box","sx","paddingRight","undefined","moment","isMoment","momentValue","setFieldValue","slotProps","textField","error","FormHelperTextProps","style","textAlign","disableFuture","Typography","color","palette","text","secondary","_Fragment","component","FormItemLayout"],"mappings":"mdAWA,MAAMA,EAAmBC,EAAO,MAAPA,EAAc,EAAGC,YAAa,CACnDC,UAAWD,EAAME,QAAQ,GACzB,UAAW,CACPC,MAAO,YAoBTC,EAAuB,EACzBC,QACAC,YACAC,cACAC,aACAC,UAAU,WACVC,SACAC,WACAC,YAAW,EACXC,eAAc,EACdC,iBAAgB,EAChBC,cACAC,2BAA0B,EAC1BC,gBAAiBC,MAEjB,MAAMlB,EAAQmB,IAERC,EAAc,IAEZC,EAACC,GAAMC,KAAMjB,EAAWkB,SAAUhB,EAAUiB,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EACf,CACIH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,OAEjB,SAGJ,OACIC,EAACC,GAAIC,GAAI,CAAEC,aAAyB,eAAX7B,EAA0B,OAAS,GAAGe,SAAA,CAC3DJ,EAACvB,EAAgB,CAAA2B,SACbJ,EAACH,EAAe,CACZb,MAAmB,aAAZI,OAAyB+B,EAAYnC,EAE5C8B,MAAOM,EAAOC,SAAShB,EAAMS,OAAST,EAAMS,MAAQM,EAAOf,EAAMS,OACjExB,SAAWwB,IAEP,MAAMQ,EAAcF,EAAOC,SAASP,GAASA,EAAQM,EAAON,GAE5DR,EAAKiB,cAAclB,EAAMH,KAAMoB,GAC3BhC,GACAA,EAASgC,IAGjBpB,KAAMjB,EACNuC,UAAW,CACPC,UAAW,CACPrC,UACAM,cACAgC,MAAOf,EACPC,WACQD,GACAhB,EADkBiB,OACtB,EAGJe,oBAAqB,CACjBvB,SAAU,IACVwB,MAAO,CAAEC,UAAW,YAIhCtC,SAAUkB,GAAgBlB,EAC1BC,YAAaA,EACbsC,cAAerC,MAGtBP,GACGc,EAAC+B,EAAU,CAAC3C,QAAQ,UAAU6B,GAAI,CAAEe,MAAOrD,EAAMsD,QAAQC,KAAKC,WAAW/B,SACpElB,UAUjC,MAAe,aAAXG,EAEI0B,EAAAqB,EAAA,CAAAhC,SAAA,CACiB,aAAZhB,GACGY,EAAC+B,EAAU,CAAC3C,QAAQ,YAAYiD,UAAU,KAAKL,MAAM,cAChD5B,SAAApB,IAGRe,OAKNC,EAACsC,EAAc,CAACtD,MAAOA,EAAQoB,SAAAL"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime")
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime");require("react");var r=require("@mui/material/Box"),i=require("@mui/material/FormControlLabel"),a=require("@mui/material/Radio"),o=require("@mui/material/RadioGroup"),t=require("@mui/material/styles"),l=require("@mui/material/Typography"),s=require("formik"),n=require("../../custom-hooks/useRenderValidText.cjs.js"),u=require("../Form/FormItemLayout/index.cjs.js"),d=require("../Spacer/index.cjs.js");const m=t.styled(r)((({theme:e})=>({marginLeft:e.spacing(4)}))),h=t.styled(l,{shouldForwardProp:e=>"showError"!==e})((({theme:e,showError:r})=>({color:r?e.palette.error.main:"inherit",textAlign:"right"}))),c=({field:t,form:l,onChange:s,options:u,layout:c,showHelperTextWhenValid:x=!1})=>{const{errors:j,touched:p,isSubmitting:v}=l,g=t.value,q=j[t.name],b=!!q&&p[t.name],y=n({fieldError:q,showError:b,touched:!!p[t.name],value:g},"Valid");return e.jsxs(r,{sx:{paddingRight:"horizontal"===c?"16px":0},children:[e.jsx(o,{name:"radio-buttons-group",value:g,onChange:e=>{l.setFieldValue(t.name,e.target.value),s&&s(e)},children:u.map((r=>e.jsxs("div",{children:[e.jsx(i,{control:e.jsx(a,{}),disabled:v||r.disabled,label:r.label,value:r.value}),r.selectedContent&&t.value===r.value&&e.jsxs(m,{children:[r.selectedContent,e.jsx(d,{size:8,variant:"horizontal"})]})]},r.value)))}),e.jsx(h,{showError:b,children:b||x?y:void 0})]})};module.exports=({label:r,fieldName:i,layout:a,onChange:o,options:t,showHelperTextWhenValid:n=!1})=>{const d=()=>e.jsx(s.Field,{name:i,children:r=>e.jsx(c,{...r,layout:a,options:t,showHelperTextWhenValid:n,onChange:o})});return"vertical"===a?e.jsxs(e.Fragment,{children:[r&&e.jsx(l,{color:"textPrimary",component:"h3",variant:"subtitle1",children:r}),d()]}):e.jsx(u,{label:r,children:d()})};
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/GenericRadioButtons/index.tsx"],"sourcesContent":["import { type
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/GenericRadioButtons/index.tsx"],"sourcesContent":["import { type ChangeEvent, type ReactNode } from 'react';\n\nimport Box from '@mui/material/Box';\nimport FormControlLabel from '@mui/material/FormControlLabel';\nimport Radio from '@mui/material/Radio';\nimport RadioGroup from '@mui/material/RadioGroup';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport { Field, type FieldProps } from 'formik';\n\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport Spacer from '../Spacer';\n\ninterface Props {\n label?: string;\n fieldName: string;\n layout?: 'horizontal' | 'vertical';\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n showHelperTextWhenValid?: boolean;\n options: {\n label: string;\n value: string;\n disabled?: boolean;\n selectedContent?: ReactNode;\n }[];\n}\n\ninterface RadioButtonsComponentProps {\n field: FieldProps['field'];\n form: FieldProps['form'];\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n showHelperTextWhenValid?: boolean;\n options: Props['options'];\n layout?: 'horizontal' | 'vertical';\n}\n\nconst StyledSelectedContent = styled(Box)(({ theme }) => ({\n marginLeft: theme.spacing(4),\n}));\n\nconst StyledHelperText = styled(Typography, {\n shouldForwardProp: (prop) => prop !== 'showError',\n})<{ showError?: boolean }>(({ theme, showError }) => ({\n color: showError ? theme.palette.error.main : 'inherit',\n textAlign: 'right',\n}));\n\nconst RadioButtonsComponent = ({\n field,\n form,\n onChange,\n options,\n layout,\n showHelperTextWhenValid = false,\n}: RadioButtonsComponentProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldValue = field.value as string | undefined;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: fieldValue,\n },\n 'Valid',\n );\n\n return (\n <Box sx={{ paddingRight: layout === 'horizontal' ? '16px' : 0 }}>\n <RadioGroup\n name=\"radio-buttons-group\"\n value={fieldValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(field.name, e.target.value);\n if (onChange) {\n onChange(e);\n }\n }}\n >\n {options.map((option) => (\n <div key={option.value}>\n <FormControlLabel\n control={<Radio />}\n disabled={isSubmitting || option.disabled}\n label={option.label}\n value={option.value}\n />\n {option.selectedContent && field.value === option.value && (\n <StyledSelectedContent>\n {option.selectedContent}\n <Spacer size={8} variant=\"horizontal\" />\n </StyledSelectedContent>\n )}\n </div>\n ))}\n </RadioGroup>\n <StyledHelperText showError={showError}>\n {(() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })()}\n </StyledHelperText>\n </Box>\n );\n};\n\nconst GenericRadioButtons = ({\n label,\n fieldName,\n layout,\n onChange,\n options,\n showHelperTextWhenValid = false,\n}: Props) => {\n const renderField = () => (\n <Field name={fieldName}>\n {(fieldProps: FieldProps) => (\n <RadioButtonsComponent\n {...fieldProps}\n layout={layout}\n options={options}\n showHelperTextWhenValid={showHelperTextWhenValid}\n onChange={onChange}\n />\n )}\n </Field>\n );\n\n if (layout === 'vertical') {\n return (\n <>\n {label && (\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericRadioButtons;\n"],"names":["StyledSelectedContent","styled","Box","theme","marginLeft","spacing","StyledHelperText","Typography","shouldForwardProp","prop","showError","color","palette","error","main","textAlign","RadioButtonsComponent","field","form","onChange","options","layout","showHelperTextWhenValid","errors","touched","isSubmitting","fieldValue","value","fieldError","name","helperText","useRenderValidText","_jsxs","jsxs","sx","paddingRight","_jsx","jsx","RadioGroup","e","setFieldValue","target","children","map","option","FormControlLabel","control","Radio","disabled","label","selectedContent","Spacer","size","variant","fieldName","renderField","Field","fieldProps","_Fragment","Fragment","component","FormItemLayout"],"mappings":"kcAsCA,MAAMA,EAAwBC,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAa,CACxDC,WAAYD,EAAME,QAAQ,OAGtBC,EAAmBL,EAAMA,OAACM,EAAY,CAC1CC,kBAAoBC,GAAkB,cAATA,GADNR,EAEG,EAAGE,QAAOO,gBAAiB,CACrDC,MAAOD,EAAYP,EAAMS,QAAQC,MAAMC,KAAO,UAC9CC,UAAW,YAGPC,EAAwB,EAC5BC,QACAC,OACAC,WACAC,UACAC,SACAC,2BAA0B,MAE1B,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBP,EACpCQ,EAAaT,EAAMU,MACnBC,EAAaL,EAAON,EAAMY,MAC1BnB,IAAckB,GAAeJ,EAAQP,EAAMY,MAC3CC,EAAaC,EACjB,CACEH,aACAlB,YACAc,UAAWA,EAAQP,EAAMY,MACzBF,MAAOD,GAET,SAGF,OACEM,EAACC,KAAA/B,EAAI,CAAAgC,GAAI,CAAEC,aAAyB,eAAXd,EAA0B,OAAS,aAC1De,EAACC,IAAAC,EACC,CAAAT,KAAK,sBACLF,MAAOD,EACPP,SAAWoB,IAETrB,EAAKsB,cAAcvB,EAAMY,KAAMU,EAAEE,OAAOd,OACpCR,GACFA,EAASoB,IAEZG,SAEAtB,EAAQuB,KAAKC,GACZZ,EAAAA,KACE,MAAA,CAAAU,SAAA,CAAAN,EAAAA,IAACS,EACC,CAAAC,QAASV,EAACC,IAAAU,MACVC,SAAUvB,GAAgBmB,EAAOI,SACjCC,MAAOL,EAAOK,MACdtB,MAAOiB,EAAOjB,QAEfiB,EAAOM,iBAAmBjC,EAAMU,QAAUiB,EAAOjB,OAChDK,EAAAA,KAAChC,EAAqB,CAAA0C,SAAA,CACnBE,EAAOM,gBACRd,EAAAA,IAACe,GAAOC,KAAM,EAAGC,QAAQ,oBAVrBT,EAAOjB,WAgBrBS,EAAAC,IAAC/B,EAAiB,CAAAI,UAAWA,EAASgC,SAE9BhC,GACAY,EADkBQ,OACtB,uBAQkB,EAC1BmB,QACAK,YACAjC,SACAF,WACAC,UACAE,2BAA0B,MAE1B,MAAMiC,EAAc,IAClBnB,MAACoB,EAAAA,MAAK,CAAC3B,KAAMyB,WACTG,GACArB,EAAAA,IAACpB,MACKyC,EACJpC,OAAQA,EACRD,QAASA,EACTE,wBAAyBA,EACzBH,SAAUA,MAMlB,MAAe,aAAXE,EAEAW,EAAAC,KAAAyB,EAAAC,SAAA,CAAAjB,SAAA,CACGO,GACCb,EAAAC,IAAC9B,EAAU,CAACI,MAAM,cAAciD,UAAU,KAAKP,QAAQ,YAAWX,SAC/DO,IAGJM,OAKAnB,EAAAA,IAACyB,EAAc,CAACZ,MAAOA,EAAQP,SAAAa"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import { ChangeEvent, ReactNode } from 'react';
|
|
3
3
|
|
|
4
|
-
|
|
4
|
+
interface Props {
|
|
5
5
|
label?: string;
|
|
6
6
|
fieldName: string;
|
|
7
7
|
layout?: 'horizontal' | 'vertical';
|
|
@@ -13,7 +13,7 @@ type Props = {
|
|
|
13
13
|
disabled?: boolean;
|
|
14
14
|
selectedContent?: ReactNode;
|
|
15
15
|
}[];
|
|
16
|
-
}
|
|
17
|
-
declare const GenericRadioButtons: ({ label, fieldName, layout, onChange, options, showHelperTextWhenValid }: Props) => react_jsx_runtime.JSX.Element;
|
|
16
|
+
}
|
|
17
|
+
declare const GenericRadioButtons: ({ label, fieldName, layout, onChange, options, showHelperTextWhenValid, }: Props) => react_jsx_runtime.JSX.Element;
|
|
18
18
|
|
|
19
19
|
export { GenericRadioButtons as default };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as e,Fragment as r,jsx as o}from"react/jsx-runtime";import
|
|
1
|
+
import{jsxs as e,Fragment as r,jsx as o}from"react/jsx-runtime";import"react";import t from"@mui/material/Box";import i from"@mui/material/FormControlLabel";import a from"@mui/material/Radio";import l from"@mui/material/RadioGroup";import{styled as m}from"@mui/material/styles";import n from"@mui/material/Typography";import{Field as d}from"formik";import h from"../../custom-hooks/useRenderValidText.js";import s from"../Form/FormItemLayout/index.js";import u from"../Spacer/index.js";const p=m(t)((({theme:e})=>({marginLeft:e.spacing(4)}))),c=m(n,{shouldForwardProp:e=>"showError"!==e})((({theme:e,showError:r})=>({color:r?e.palette.error.main:"inherit",textAlign:"right"}))),f=({field:r,form:m,onChange:n,options:d,layout:s,showHelperTextWhenValid:f=!1})=>{const{errors:g,touched:v,isSubmitting:x}=m,b=r.value,w=g[r.name],y=!!w&&v[r.name],C=h({fieldError:w,showError:y,touched:!!v[r.name],value:b},"Valid");return e(t,{sx:{paddingRight:"horizontal"===s?"16px":0},children:[o(l,{name:"radio-buttons-group",value:b,onChange:e=>{m.setFieldValue(r.name,e.target.value),n&&n(e)},children:d.map((t=>e("div",{children:[o(i,{control:o(a,{}),disabled:x||t.disabled,label:t.label,value:t.value}),t.selectedContent&&r.value===t.value&&e(p,{children:[t.selectedContent,o(u,{size:8,variant:"horizontal"})]})]},t.value)))}),o(c,{showError:y,children:y||f?C:void 0})]})},g=({label:t,fieldName:i,layout:a,onChange:l,options:m,showHelperTextWhenValid:h=!1})=>{const u=()=>o(d,{name:i,children:e=>o(f,{...e,layout:a,options:m,showHelperTextWhenValid:h,onChange:l})});return"vertical"===a?e(r,{children:[t&&o(n,{color:"textPrimary",component:"h3",variant:"subtitle1",children:t}),u()]}):o(s,{label:t,children:u()})};export{g as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/GenericRadioButtons/index.tsx"],"sourcesContent":["import { type
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/GenericRadioButtons/index.tsx"],"sourcesContent":["import { type ChangeEvent, type ReactNode } from 'react';\n\nimport Box from '@mui/material/Box';\nimport FormControlLabel from '@mui/material/FormControlLabel';\nimport Radio from '@mui/material/Radio';\nimport RadioGroup from '@mui/material/RadioGroup';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport { Field, type FieldProps } from 'formik';\n\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport Spacer from '../Spacer';\n\ninterface Props {\n label?: string;\n fieldName: string;\n layout?: 'horizontal' | 'vertical';\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n showHelperTextWhenValid?: boolean;\n options: {\n label: string;\n value: string;\n disabled?: boolean;\n selectedContent?: ReactNode;\n }[];\n}\n\ninterface RadioButtonsComponentProps {\n field: FieldProps['field'];\n form: FieldProps['form'];\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n showHelperTextWhenValid?: boolean;\n options: Props['options'];\n layout?: 'horizontal' | 'vertical';\n}\n\nconst StyledSelectedContent = styled(Box)(({ theme }) => ({\n marginLeft: theme.spacing(4),\n}));\n\nconst StyledHelperText = styled(Typography, {\n shouldForwardProp: (prop) => prop !== 'showError',\n})<{ showError?: boolean }>(({ theme, showError }) => ({\n color: showError ? theme.palette.error.main : 'inherit',\n textAlign: 'right',\n}));\n\nconst RadioButtonsComponent = ({\n field,\n form,\n onChange,\n options,\n layout,\n showHelperTextWhenValid = false,\n}: RadioButtonsComponentProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldValue = field.value as string | undefined;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: fieldValue,\n },\n 'Valid',\n );\n\n return (\n <Box sx={{ paddingRight: layout === 'horizontal' ? '16px' : 0 }}>\n <RadioGroup\n name=\"radio-buttons-group\"\n value={fieldValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(field.name, e.target.value);\n if (onChange) {\n onChange(e);\n }\n }}\n >\n {options.map((option) => (\n <div key={option.value}>\n <FormControlLabel\n control={<Radio />}\n disabled={isSubmitting || option.disabled}\n label={option.label}\n value={option.value}\n />\n {option.selectedContent && field.value === option.value && (\n <StyledSelectedContent>\n {option.selectedContent}\n <Spacer size={8} variant=\"horizontal\" />\n </StyledSelectedContent>\n )}\n </div>\n ))}\n </RadioGroup>\n <StyledHelperText showError={showError}>\n {(() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })()}\n </StyledHelperText>\n </Box>\n );\n};\n\nconst GenericRadioButtons = ({\n label,\n fieldName,\n layout,\n onChange,\n options,\n showHelperTextWhenValid = false,\n}: Props) => {\n const renderField = () => (\n <Field name={fieldName}>\n {(fieldProps: FieldProps) => (\n <RadioButtonsComponent\n {...fieldProps}\n layout={layout}\n options={options}\n showHelperTextWhenValid={showHelperTextWhenValid}\n onChange={onChange}\n />\n )}\n </Field>\n );\n\n if (layout === 'vertical') {\n return (\n <>\n {label && (\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericRadioButtons;\n"],"names":["StyledSelectedContent","styled","Box","theme","marginLeft","spacing","StyledHelperText","Typography","shouldForwardProp","prop","showError","color","palette","error","main","textAlign","RadioButtonsComponent","field","form","onChange","options","layout","showHelperTextWhenValid","errors","touched","isSubmitting","fieldValue","value","fieldError","name","helperText","useRenderValidText","_jsxs","sx","paddingRight","_jsx","RadioGroup","e","setFieldValue","target","children","map","option","FormControlLabel","control","Radio","disabled","label","selectedContent","Spacer","size","variant","GenericRadioButtons","fieldName","renderField","Field","fieldProps","_Fragment","component","FormItemLayout"],"mappings":"seAsCA,MAAMA,EAAwBC,EAAOC,EAAPD,EAAY,EAAGE,YAAa,CACxDC,WAAYD,EAAME,QAAQ,OAGtBC,EAAmBL,EAAOM,EAAY,CAC1CC,kBAAoBC,GAAkB,cAATA,GADNR,EAEG,EAAGE,QAAOO,gBAAiB,CACrDC,MAAOD,EAAYP,EAAMS,QAAQC,MAAMC,KAAO,UAC9CC,UAAW,YAGPC,EAAwB,EAC5BC,QACAC,OACAC,WACAC,UACAC,SACAC,2BAA0B,MAE1B,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBP,EACpCQ,EAAaT,EAAMU,MACnBC,EAAaL,EAAON,EAAMY,MAC1BnB,IAAckB,GAAeJ,EAAQP,EAAMY,MAC3CC,EAAaC,EACjB,CACEH,aACAlB,YACAc,UAAWA,EAAQP,EAAMY,MACzBF,MAAOD,GAET,SAGF,OACEM,EAAC9B,EAAI,CAAA+B,GAAI,CAAEC,aAAyB,eAAXb,EAA0B,OAAS,aAC1Dc,EAACC,EACC,CAAAP,KAAK,sBACLF,MAAOD,EACPP,SAAWkB,IAETnB,EAAKoB,cAAcrB,EAAMY,KAAMQ,EAAEE,OAAOZ,OACpCR,GACFA,EAASkB,IAEZG,SAEApB,EAAQqB,KAAKC,GACZV,EACE,MAAA,CAAAQ,SAAA,CAAAL,EAACQ,EACC,CAAAC,QAAST,EAACU,MACVC,SAAUrB,GAAgBiB,EAAOI,SACjCC,MAAOL,EAAOK,MACdpB,MAAOe,EAAOf,QAEfe,EAAOM,iBAAmB/B,EAAMU,QAAUe,EAAOf,OAChDK,EAAChC,EAAqB,CAAAwC,SAAA,CACnBE,EAAOM,gBACRb,EAACc,GAAOC,KAAM,EAAGC,QAAQ,oBAVrBT,EAAOf,WAgBrBQ,EAAC7B,EAAiB,CAAAI,UAAWA,EAAS8B,SAE9B9B,GACAY,EADkBQ,OACtB,QAQJsB,EAAsB,EAC1BL,QACAM,YACAhC,SACAF,WACAC,UACAE,2BAA0B,MAE1B,MAAMgC,EAAc,IAClBnB,EAACoB,EAAK,CAAC1B,KAAMwB,WACTG,GACArB,EAACnB,MACKwC,EACJnC,OAAQA,EACRD,QAASA,EACTE,wBAAyBA,EACzBH,SAAUA,MAMlB,MAAe,aAAXE,EAEAW,EAAAyB,EAAA,CAAAjB,SAAA,CACGO,GACCZ,EAAC5B,EAAU,CAACI,MAAM,cAAc+C,UAAU,KAAKP,QAAQ,YAAWX,SAC/DO,IAGJO,OAKAnB,EAACwB,EAAc,CAACZ,MAAOA,EAAQP,SAAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HighlightScrollbar.cjs.js","sources":["../../../src/components/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport React, { useState } from 'react';\n\ntype HighlightScrollbarProps = {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: '1px solid #d5d5d5',\n },\n '&::-webkit-scrollbar-track': {\n background: '#f1f1f1',\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : '#f5f5f5',\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : '#f5f5f5',\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? '0px 2px 6px rgba(0, 0, 0, 0.5)' : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","overflowX","padding","height","border","background","borderRadius","boxShadow","transition","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"qGAeA,MAAMA,EAAkBC,EAAMA,OAAC,MAAPA,EAA8B,EAAGC,UAASC,kBAAmB,CACjFC,UAAW,OACX,uBAAwB,CACpBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,qBAEZ,6BAA8B,CAC1BC,WAAY,WAEhB,6BAA8B,CAC1BA,WAAYN,EAAU,wBAA0B,UAChDO,aAAc,OAElB,2FAA4F,CACxFD,WAAYN,EAAU,wBAA0B,WAEpD,kBAAmB,CACfQ,UAAWP,EAAc,iCAAmC,OAC5DQ,WAAY,uCAIoEC,IACpF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,EAAAA,UAAS,GAUjD,OACIC,EAAAA,IAACpB,EAAe,CACZE,QAASe,EACTd,cAAeY,EACfM,aAZmB,IAAMH,GAAgB,GAazCI,aAXc,KAClBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,
|
|
1
|
+
{"version":3,"file":"HighlightScrollbar.cjs.js","sources":["../../../src/components/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport React, { useState } from 'react';\n\ntype HighlightScrollbarProps = {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: '1px solid #d5d5d5',\n },\n '&::-webkit-scrollbar-track': {\n background: '#f1f1f1',\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : '#f5f5f5',\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : '#f5f5f5',\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? '0px 2px 6px rgba(0, 0, 0, 0.5)' : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","overflowX","padding","height","border","background","borderRadius","boxShadow","transition","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"qGAeA,MAAMA,EAAkBC,EAAMA,OAAC,MAAPA,EAA8B,EAAGC,UAASC,kBAAmB,CACjFC,UAAW,OACX,uBAAwB,CACpBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,qBAEZ,6BAA8B,CAC1BC,WAAY,WAEhB,6BAA8B,CAC1BA,WAAYN,EAAU,wBAA0B,UAChDO,aAAc,OAElB,2FAA4F,CACxFD,WAAYN,EAAU,wBAA0B,WAEpD,kBAAmB,CACfQ,UAAWP,EAAc,iCAAmC,OAC5DQ,WAAY,uCAIoEC,IACpF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,EAAAA,UAAS,GAUjD,OACIC,EAAAA,IAACpB,EAAe,CACZE,QAASe,EACTd,cAAeY,EACfM,aAZmB,IAAMH,GAAgB,GAazCI,aAXc,KAClBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,IASnCF,SAAUA,EAAQD,SAEjBA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HighlightScrollbar.js","sources":["../../../src/components/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport React, { useState } from 'react';\n\ntype HighlightScrollbarProps = {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: '1px solid #d5d5d5',\n },\n '&::-webkit-scrollbar-track': {\n background: '#f1f1f1',\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : '#f5f5f5',\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : '#f5f5f5',\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? '0px 2px 6px rgba(0, 0, 0, 0.5)' : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","overflowX","padding","height","border","background","borderRadius","boxShadow","transition","HighlightScrollbar","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"uHAeA,MAAMA,EAAkBC,EAAO,MAAPA,EAA8B,EAAGC,UAASC,kBAAmB,CACjFC,UAAW,OACX,uBAAwB,CACpBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,qBAEZ,6BAA8B,CAC1BC,WAAY,WAEhB,6BAA8B,CAC1BA,WAAYN,EAAU,wBAA0B,UAChDO,aAAc,OAElB,2FAA4F,CACxFD,WAAYN,EAAU,wBAA0B,WAEpD,kBAAmB,CACfQ,UAAWP,EAAc,iCAAmC,OAC5DQ,WAAY,wBAIdC,EAAkFC,IACpF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,GAAS,GAUjD,OACIC,EAACrB,EAAe,CACZE,QAASgB,EACTf,cAAea,EACfM,aAZmB,IAAMH,GAAgB,GAazCI,aAXc,KAClBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,
|
|
1
|
+
{"version":3,"file":"HighlightScrollbar.js","sources":["../../../src/components/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport React, { useState } from 'react';\n\ntype HighlightScrollbarProps = {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: '1px solid #d5d5d5',\n },\n '&::-webkit-scrollbar-track': {\n background: '#f1f1f1',\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : '#f5f5f5',\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : '#f5f5f5',\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? '0px 2px 6px rgba(0, 0, 0, 0.5)' : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","overflowX","padding","height","border","background","borderRadius","boxShadow","transition","HighlightScrollbar","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"uHAeA,MAAMA,EAAkBC,EAAO,MAAPA,EAA8B,EAAGC,UAASC,kBAAmB,CACjFC,UAAW,OACX,uBAAwB,CACpBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,qBAEZ,6BAA8B,CAC1BC,WAAY,WAEhB,6BAA8B,CAC1BA,WAAYN,EAAU,wBAA0B,UAChDO,aAAc,OAElB,2FAA4F,CACxFD,WAAYN,EAAU,wBAA0B,WAEpD,kBAAmB,CACfQ,UAAWP,EAAc,iCAAmC,OAC5DQ,WAAY,wBAIdC,EAAkFC,IACpF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,GAAS,GAUjD,OACIC,EAACrB,EAAe,CACZE,QAASgB,EACTf,cAAea,EACfM,aAZmB,IAAMH,GAAgB,GAazCI,aAXc,KAClBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,IASnCF,SAAUA,EAAQD,SAEjBA"}
|
|
@@ -14,5 +14,5 @@
|
|
|
14
14
|
}
|
|
15
15
|
`,x=r.styled(l,{shouldForwardProp:e=>"isSticky"!==e&&"titleVariant"!==e})((({theme:e,isSticky:i,titleVariant:t})=>({fontSize:13,fontWeight:"light"===t?400:e.typography.fontWeightMedium,color:"light"===t?e.palette.semantic.text["text-weak"]:e.palette.semantic.text["text-strong"],padding:e.spacing(1.25,2),whiteSpace:"nowrap",position:i?"sticky":"relative",zIndex:i?1:"auto"}))),b=r.styled(i)`
|
|
16
16
|
overflow: hidden;
|
|
17
|
-
`,g=r.styled(o)((({theme:e})=>({marginLeft:e.spacing(.5),svg:{fontSize:e.typography.body1.fontSize}})));module.exports=({data:i,title:l,subTitle:o,showTitle:j=!0,onRowClick:f,loading:y,metadata:k,titleVariant:w="default"})=>{const q=new Set(k.filter((e=>e.isVisible)).sort(((e,i)=>e.ordinal-i.ordinal)).map((e=>e.columnName))),T=k.reduce(((e,i)=>(e[i.columnName]=i,e)),{}),S=r.useTheme(),v=!d(S.breakpoints.up("tablet")),z=v?"normal":"sticky";return e.jsxs(p,{children:[j&&e.jsx(m,{subTitle:o,title:l}),e.jsx(b,{children:e.jsx(h,{children:e.jsxs(a,{"aria-label":l,"data-testid":"generic-table"+(j?`-${l
|
|
17
|
+
`,g=r.styled(o)((({theme:e})=>({marginLeft:e.spacing(.5),svg:{fontSize:e.typography.body1.fontSize}})));module.exports=({data:i,title:l,subTitle:o,showTitle:j=!0,onRowClick:f,loading:y,metadata:k,titleVariant:w="default"})=>{const q=new Set(k.filter((e=>e.isVisible)).sort(((e,i)=>e.ordinal-i.ordinal)).map((e=>e.columnName))),T=k.reduce(((e,i)=>(e[i.columnName]=i,e)),{}),S=r.useTheme(),v=!d(S.breakpoints.up("tablet")),z=v?"normal":"sticky";return e.jsxs(p,{children:[j&&e.jsx(m,{subTitle:o,title:l}),e.jsx(b,{children:e.jsx(h,{children:e.jsxs(a,{"aria-label":l,"data-testid":"generic-table"+(j?`-${l?.replace(" ","-").toLowerCase()}`:""),children:[e.jsx(s,{children:e.jsx(n,{children:Array.from(q).map(((i,r)=>{const{columnName:a,columnTitle:l,align:s="left",tooltip:n}=T[i]||{};return e.jsx(x,{align:s,isSticky:0===r&&!v,titleVariant:w,children:e.jsxs("div",{children:[e.jsx("span",{children:l}),n&&e.jsx(g,{placement:"right-start",title:n,children:e.jsx(t,{size:"small",children:e.jsx(c,{"data-testid":"InfoOutlinedIcon",size:"sm"})})})]})},a)}))})}),e.jsx(u,{columns:q,data:i,loading:y,meta:T,type:z,onRowClick:f})]})})})]})};
|
|
18
18
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/GenericTable/index.tsx"],"sourcesContent":["import Card from '@mui/material/Card';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport InfoOutlinedIcon from '../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from '../GenericTableBody';\nimport GenericTableTitle from '../GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' | 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' | 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledPaper = styled(Card)`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop];\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton size=\"small\">\n <InfoOutlinedIcon data-testid=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledPaper>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-testid={`generic-table` + (showTitle ? `-${title
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/GenericTable/index.tsx"],"sourcesContent":["import Card from '@mui/material/Card';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport InfoOutlinedIcon from '../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from '../GenericTableBody';\nimport GenericTableTitle from '../GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' | 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' | 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledPaper = styled(Card)`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop] || {};\n\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton size=\"small\">\n <InfoOutlinedIcon data-testid=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledPaper>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-testid={`generic-table` + (showTitle ? `-${title?.replace(' ', '-').toLowerCase()}` : '')}\n >\n {renderTableHeader()}\n <GenericTableBody\n columns={columns}\n data={data}\n loading={loading}\n meta={tableMeta}\n type={firstColumnStylePosition}\n onRowClick={onRowClick}\n />\n </Table>\n </HighlightScrollbar>\n </StyledPaper>\n </StyledContainer>\n );\n};\n\nexport default GenericTable;\n"],"names":["StyledContainer","styled","StyledTableCell","TableCell","shouldForwardProp","prop","theme","isSticky","titleVariant","fontSize","fontWeight","typography","fontWeightMedium","color","palette","semantic","text","padding","spacing","whiteSpace","position","zIndex","StyledPaper","Card","StyledTooltip","Tooltip","marginLeft","svg","body1","data","title","subTitle","showTitle","onRowClick","loading","metadata","columns","Set","filter","m","isVisible","sort","a","b","ordinal","map","columnName","tableMeta","reduce","obj","mData","useTheme","isMobile","useMediaQuery","breakpoints","up","firstColumnStylePosition","_jsxs","jsxs","_jsx","GenericTableTitle","children","HighlightScrollbar","Table","replace","toLowerCase","jsx","TableHead","TableRow","Array","from","idx","columnTitle","align","tooltip","placement","IconButton","size","InfoOutlinedIcon","GenericTableBody","meta","type"],"mappings":"ijBA4BA,MAAMA,EAAkBC,EAAAA,OAAO,MAAM;;;;;;;;;;;;;;EAgB/BC,EAAkBD,EAAMA,OAACE,EAAW,CACxCC,kBAAoBC,GAAkB,aAATA,GAAgC,iBAATA,GAD9BJ,EAEqC,EAAGK,QAAOC,WAAUC,mBAAoB,CACnGC,SAAU,GACVC,WAA6B,UAAjBF,EAA2B,IAAMF,EAAMK,WAAWC,iBAC9DC,MACmB,UAAjBL,EACIF,EAAMQ,QAAQC,SAASC,KAAK,aAC5BV,EAAMQ,QAAQC,SAASC,KAAK,eAClCC,QAASX,EAAMY,QAAQ,KAAM,GAC7BC,WAAY,SACZC,SAAUb,EAAW,SAAW,WAChCc,OAAQd,EAAW,EAAI,WAGnBe,EAAcrB,EAAAA,OAAOsB,EAAK;;EAI1BC,EAAgBvB,EAAAA,OAAOwB,EAAPxB,EAAgB,EAAGK,YAAa,CACpDoB,WAAYpB,EAAMY,QAAQ,IAC1BS,IAAK,CACHlB,SAAUH,EAAMK,WAAWiB,MAAMnB,6BAIhB,EACnBoB,OACAC,QACAC,WACAC,aAAY,EACZC,aACAC,UACAC,WACA3B,eAAe,cAEf,MAAM4B,EAAU,IAAIC,IAClBF,EACGG,QAAQC,GAAMA,EAAEC,YAChBC,MAAK,CAACC,EAAGC,IAAMD,EAAEE,QAAUD,EAAEC,UAC7BC,KAAKN,GAAMA,EAAEO,cAEZC,EAAYZ,EAASa,QAA+C,CAACC,EAAKC,KAC9ED,EAAIC,EAAMJ,YAAcI,EACjBD,IACN,IAEG3C,EAAQ6C,EAAAA,WACRC,GAAYC,EAAc/C,EAAMgD,YAAYC,GAAG,WAG/CC,EAA2BJ,EAAW,SAAW,SAgCvD,OACEK,EAACC,KAAA1D,aACEgC,GAAa2B,MAACC,EAAiB,CAAC7B,SAAUA,EAAUD,MAAOA,IAC5D6B,EAAAA,IAACrC,EAAW,CAAAuC,SACVF,MAACG,EAAkB,CAAAD,SACjBJ,EAAAA,KAACM,EAAK,CAAA,aACQjC,EACC,cAAA,iBAAmBE,EAAY,IAAIF,GAAOkC,QAAQ,IAAK,KAAKC,gBAAkB,IAE1FJ,SAAA,CAtCTF,EAAAO,IAACC,EAAS,CAAAN,SACRF,EAAAA,IAACS,EACE,CAAAP,SAAAQ,MAAMC,KAAKlC,GAASS,KAAI,CAACxC,EAAMkE,KAC9B,MAAMzB,WAAEA,EAAU0B,YAAEA,EAAWC,MAAEA,EAAQ,OAAMC,QAAEA,GAAY3B,EAAU1C,IAAS,CAAE,EAElF,OACEsD,MAACzD,EAAe,CAEduE,MAAOA,EACPlE,SAAkB,IAARgE,IAAcnB,EACxB5C,aAAcA,EAAYqD,SAE1BJ,EAAAA,KACE,MAAA,CAAAI,SAAA,CAAAF,EAAAO,IAAA,OAAA,CAAAL,SAAOW,IACNE,GACCf,MAACnC,EAAa,CAACmD,UAAU,cAAc7C,MAAO4C,EAAOb,SACnDF,EAACO,IAAAU,EAAW,CAAAC,KAAK,iBACflB,EAAAA,IAACmB,EAA6B,CAAA,cAAA,mBAAmBD,KAAK,eAVzD/B,UAgCPa,EAAAA,IAACoB,EACC,CAAA3C,QAASA,EACTP,KAAMA,EACNK,QAASA,EACT8C,KAAMjC,EACNkC,KAAMzB,EACNvB,WAAYA"}
|
|
@@ -14,5 +14,5 @@ import{jsxs as t,jsx as i}from"react/jsx-runtime";import e from"@mui/material/Ca
|
|
|
14
14
|
}
|
|
15
15
|
`,g=a(m,{shouldForwardProp:t=>"isSticky"!==t&&"titleVariant"!==t})((({theme:t,isSticky:i,titleVariant:e})=>({fontSize:13,fontWeight:"light"===e?400:t.typography.fontWeightMedium,color:"light"===e?t.palette.semantic.text["text-weak"]:t.palette.semantic.text["text-strong"],padding:t.spacing(1.25,2),whiteSpace:"nowrap",position:i?"sticky":"relative",zIndex:i?1:"auto"}))),k=a(e)`
|
|
16
16
|
overflow: hidden;
|
|
17
|
-
`,w=a(c)((({theme:t})=>({marginLeft:t.spacing(.5),svg:{fontSize:t.typography.body1.fontSize}}))),x=({data:e,title:a,subTitle:m,showTitle:c=!0,onRowClick:x,loading:y,metadata:T,titleVariant:S="default"})=>{const v=new Set(T.filter((t=>t.isVisible)).sort(((t,i)=>t.ordinal-i.ordinal)).map((t=>t.columnName))),z=T.reduce(((t,i)=>(t[i.columnName]=i,t)),{}),C=o(),j=!s(C.breakpoints.up("tablet")),I=j?"normal":"sticky";return t(b,{children:[c&&i(u,{subTitle:m,title:a}),i(k,{children:i(h,{children:t(l,{"aria-label":a,"data-testid":"generic-table"+(c?`-${a
|
|
17
|
+
`,w=a(c)((({theme:t})=>({marginLeft:t.spacing(.5),svg:{fontSize:t.typography.body1.fontSize}}))),x=({data:e,title:a,subTitle:m,showTitle:c=!0,onRowClick:x,loading:y,metadata:T,titleVariant:S="default"})=>{const v=new Set(T.filter((t=>t.isVisible)).sort(((t,i)=>t.ordinal-i.ordinal)).map((t=>t.columnName))),z=T.reduce(((t,i)=>(t[i.columnName]=i,t)),{}),C=o(),j=!s(C.breakpoints.up("tablet")),I=j?"normal":"sticky";return t(b,{children:[c&&i(u,{subTitle:m,title:a}),i(k,{children:i(h,{children:t(l,{"aria-label":a,"data-testid":"generic-table"+(c?`-${a?.replace(" ","-").toLowerCase()}`:""),children:[i(n,{children:i(d,{children:Array.from(v).map(((e,a)=>{const{columnName:o,columnTitle:l,align:m="left",tooltip:n}=z[e]||{};return i(g,{align:m,isSticky:0===a&&!j,titleVariant:S,children:t("div",{children:[i("span",{children:l}),n&&i(w,{placement:"right-start",title:n,children:i(r,{size:"small",children:i(p,{"data-testid":"InfoOutlinedIcon",size:"sm"})})})]})},o)}))})}),i(f,{columns:v,data:e,loading:y,meta:z,type:I,onRowClick:x})]})})})]})};export{x as default};
|
|
18
18
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/GenericTable/index.tsx"],"sourcesContent":["import Card from '@mui/material/Card';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport InfoOutlinedIcon from '../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from '../GenericTableBody';\nimport GenericTableTitle from '../GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' | 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' | 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledPaper = styled(Card)`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop];\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton size=\"small\">\n <InfoOutlinedIcon data-testid=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledPaper>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-testid={`generic-table` + (showTitle ? `-${title
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/GenericTable/index.tsx"],"sourcesContent":["import Card from '@mui/material/Card';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport InfoOutlinedIcon from '../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from '../GenericTableBody';\nimport GenericTableTitle from '../GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' | 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' | 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledPaper = styled(Card)`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop] || {};\n\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton size=\"small\">\n <InfoOutlinedIcon data-testid=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledPaper>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-testid={`generic-table` + (showTitle ? `-${title?.replace(' ', '-').toLowerCase()}` : '')}\n >\n {renderTableHeader()}\n <GenericTableBody\n columns={columns}\n data={data}\n loading={loading}\n meta={tableMeta}\n type={firstColumnStylePosition}\n onRowClick={onRowClick}\n />\n </Table>\n </HighlightScrollbar>\n </StyledPaper>\n </StyledContainer>\n );\n};\n\nexport default GenericTable;\n"],"names":["StyledContainer","styled","StyledTableCell","TableCell","shouldForwardProp","prop","theme","isSticky","titleVariant","fontSize","fontWeight","typography","fontWeightMedium","color","palette","semantic","text","padding","spacing","whiteSpace","position","zIndex","StyledPaper","Card","StyledTooltip","Tooltip","marginLeft","svg","body1","GenericTable","data","title","subTitle","showTitle","onRowClick","loading","metadata","columns","Set","filter","m","isVisible","sort","a","b","ordinal","map","columnName","tableMeta","reduce","obj","mData","useTheme","isMobile","useMediaQuery","breakpoints","up","firstColumnStylePosition","_jsxs","_jsx","GenericTableTitle","children","HighlightScrollbar","Table","replace","toLowerCase","TableHead","TableRow","Array","from","idx","columnTitle","align","tooltip","placement","IconButton","size","InfoOutlinedIcon","GenericTableBody","meta","type"],"mappings":"qlBA4BA,MAAMA,EAAkBC,EAAO,MAAM;;;;;;;;;;;;;;EAgB/BC,EAAkBD,EAAOE,EAAW,CACxCC,kBAAoBC,GAAkB,aAATA,GAAgC,iBAATA,GAD9BJ,EAEqC,EAAGK,QAAOC,WAAUC,mBAAoB,CACnGC,SAAU,GACVC,WAA6B,UAAjBF,EAA2B,IAAMF,EAAMK,WAAWC,iBAC9DC,MACmB,UAAjBL,EACIF,EAAMQ,QAAQC,SAASC,KAAK,aAC5BV,EAAMQ,QAAQC,SAASC,KAAK,eAClCC,QAASX,EAAMY,QAAQ,KAAM,GAC7BC,WAAY,SACZC,SAAUb,EAAW,SAAW,WAChCc,OAAQd,EAAW,EAAI,WAGnBe,EAAcrB,EAAOsB,EAAK;;EAI1BC,EAAgBvB,EAAOwB,EAAPxB,EAAgB,EAAGK,YAAa,CACpDoB,WAAYpB,EAAMY,QAAQ,IAC1BS,IAAK,CACHlB,SAAUH,EAAMK,WAAWiB,MAAMnB,cAI/BoB,EAAe,EACnBC,OACAC,QACAC,WACAC,aAAY,EACZC,aACAC,UACAC,WACA5B,eAAe,cAEf,MAAM6B,EAAU,IAAIC,IAClBF,EACGG,QAAQC,GAAMA,EAAEC,YAChBC,MAAK,CAACC,EAAGC,IAAMD,EAAEE,QAAUD,EAAEC,UAC7BC,KAAKN,GAAMA,EAAEO,cAEZC,EAAYZ,EAASa,QAA+C,CAACC,EAAKC,KAC9ED,EAAIC,EAAMJ,YAAcI,EACjBD,IACN,IAEG5C,EAAQ8C,IACRC,GAAYC,EAAchD,EAAMiD,YAAYC,GAAG,WAG/CC,EAA2BJ,EAAW,SAAW,SAgCvD,OACEK,EAAC1D,aACEiC,GAAa0B,EAACC,EAAiB,CAAC5B,SAAUA,EAAUD,MAAOA,IAC5D4B,EAACrC,EAAW,CAAAuC,SACVF,EAACG,EAAkB,CAAAD,SACjBH,EAACK,EAAK,CAAA,aACQhC,EACC,cAAA,iBAAmBE,EAAY,IAAIF,GAAOiC,QAAQ,IAAK,KAAKC,gBAAkB,IAE1FJ,SAAA,CAtCTF,EAACO,EAAS,CAAAL,SACRF,EAACQ,EACE,CAAAN,SAAAO,MAAMC,KAAKhC,GAASS,KAAI,CAACzC,EAAMiE,KAC9B,MAAMvB,WAAEA,EAAUwB,YAAEA,EAAWC,MAAEA,EAAQ,OAAMC,QAAEA,GAAYzB,EAAU3C,IAAS,CAAE,EAElF,OACEsD,EAACzD,EAAe,CAEdsE,MAAOA,EACPjE,SAAkB,IAAR+D,IAAcjB,EACxB7C,aAAcA,EAAYqD,SAE1BH,EACE,MAAA,CAAAG,SAAA,CAAAF,EAAA,OAAA,CAAAE,SAAOU,IACNE,GACCd,EAACnC,EAAa,CAACkD,UAAU,cAAc3C,MAAO0C,EAAOZ,SACnDF,EAACgB,EAAW,CAAAC,KAAK,iBACfjB,EAACkB,EAA6B,CAAA,cAAA,mBAAmBD,KAAK,eAVzD7B,UAgCPY,EAACmB,EACC,CAAAzC,QAASA,EACTP,KAAMA,EACNK,QAASA,EACT4C,KAAM/B,EACNgC,KAAMvB,EACNvB,WAAYA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material/
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material/Skeleton"),r=require("@mui/material/styles"),l=require("@mui/material/TableBody"),a=require("@mui/material/TableCell"),o=require("@mui/material/TableRow"),n=require("../GenericTableBodyRow/index.cjs.js");const s=r.styled(a,{shouldForwardProp:e=>"align"!==e&&"titleCell"!==e&&"warning"!==e&&"sticky"!==e&&"isTitleRow"!==e})((({align:e,titleCell:i,warning:t,sticky:r,isTitleRow:l})=>({textAlign:e,fontWeight:i||l?"bold":"normal",backgroundColor:t?"#ffcccb":"inherit",position:r?"sticky":"static"}))),c=({colIdx:t,colName:r,hasWarning:l,hasTitle:a,meta:o,row:n,type:c})=>{const d=n[r],m=o[r]?.align??"left",u=o[r]?.hideWhenEmpty??!1?"":"-",w={align:m,warning:l??!1,titleCell:a??!1,sticky:"sticky"===c&&0===t,"data-testid":`col-${r}`,isTitleRow:n.isTitleRow??!1};if(i.isValidElement(d))return e.jsx(s,{...w,children:d});switch(o[r]?.columnType){case"String":default:return e.jsx(s,{...w,children:d??u});case"Custom":return e.jsx(s,{...w,children:d?o[r]?.customComponent?.(d,n):u})}};module.exports=({columns:i,data:r,loading:a,type:d,onRowClick:m,meta:u})=>e.jsx(l,{children:a?Array.from(Array(5)).map(((r,l)=>e.jsx(o,{"data-testid":"row-loader",children:Array.from(i).map(((i,r)=>e.jsx(s,{align:"left","data-testid":`col-${i}`,isTitleRow:!1,sticky:!1,titleCell:!1,warning:!1,children:e.jsx(t,{height:22,width:"90%"})},`col-${i}-loader-${r}`)))},`row-loader-${l}`))):r?.map(((t,r)=>e.jsx(n,{row:t,tableRowTestKey:r.toString(),onRowClick:m,children:Array.from(i).map(((i,r)=>e.jsx(c,{colIdx:r,colName:i,meta:u??{},row:t,type:d},`cell-${i}-${r}`)))},`row-${r}`)))});
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/GenericTableBody/index.tsx"],"sourcesContent":["import React from 'react';\nimport { styled } from '@mui/material/styles';\nimport MuiTableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\n\nimport
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/GenericTableBody/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Skeleton from '@mui/material/Skeleton';\nimport { styled } from '@mui/material/styles';\nimport MuiTableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\n\nimport GenericTableBodyRow from '../GenericTableBodyRow';\n\nexport interface GenericTableColumns {\n columnName: string;\n columnTitle: string;\n columnType: 'Custom' | 'String';\n align?: 'left' | 'right';\n isVisible: boolean;\n ordinal: number;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customComponent?: (data: any, row: any) => JSX.Element;\n tooltip?: string;\n hideWhenEmpty?: boolean;\n}\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) =>\n prop !== 'align' &&\n prop !== 'titleCell' &&\n prop !== 'warning' &&\n prop !== 'sticky' &&\n prop !== 'isTitleRow',\n})<{ align: string; titleCell: boolean; warning: boolean; sticky: boolean; isTitleRow: boolean }>(\n ({ align, titleCell, warning, sticky, isTitleRow }) => ({\n textAlign: align,\n fontWeight: titleCell || isTitleRow ? 'bold' : 'normal',\n backgroundColor: warning ? '#ffcccb' : 'inherit',\n position: sticky ? 'sticky' : 'static',\n }),\n);\n\nexport interface TableCellProps {\n colIdx: number;\n colName: string;\n hasWarning?: boolean;\n hasTitle?: boolean;\n meta: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: Record<string, any>;\n type: 'normal' | 'sticky';\n}\n\nconst RenderTableCell: React.FC<TableCellProps> = ({\n colIdx,\n colName,\n hasWarning,\n hasTitle,\n meta,\n row,\n type,\n}) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const prop = row[colName];\n const align = meta[colName]?.align ?? 'left';\n const hideWhenEmpty = meta[colName]?.hideWhenEmpty ?? false;\n const fallbackValue = hideWhenEmpty ? '' : '-';\n const tableCellProps = {\n align,\n warning: hasWarning ?? false,\n titleCell: hasTitle ?? false,\n sticky: type === 'sticky' && colIdx === 0,\n 'data-testid': `col-${colName}`,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n isTitleRow: row['isTitleRow'] ?? false,\n };\n\n // When prop is a React element render it as is\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n if (React.isValidElement(prop)) {\n return <StyledTableCell {...tableCellProps}>{prop}</StyledTableCell>;\n }\n\n switch (meta[colName]?.columnType) {\n case 'String':\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n case 'Custom':\n return (\n <StyledTableCell {...tableCellProps}>\n {prop ? meta[colName]?.customComponent?.(prop, row) : fallbackValue}\n </StyledTableCell>\n );\n default:\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n }\n};\n\ninterface TableBodyProps {\n columns: Set<string>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n meta?: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n type: 'normal' | 'sticky';\n}\n\nconst GenericTableBody: React.FC<TableBodyProps> = ({ columns, data, loading, type, onRowClick, meta }) => {\n const rowsPerPage = 5;\n return (\n <MuiTableBody>\n {loading\n ? Array.from(Array(rowsPerPage)).map((_, idx) => (\n // eslint-disable-next-line react/no-array-index-key\n <TableRow key={`row-loader-${idx}`} data-testid=\"row-loader\">\n {Array.from(columns).map((columnName, colIdx) => (\n <StyledTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`col-${columnName}-loader-${colIdx}`}\n align={'left'}\n data-testid={`col-${columnName}`}\n isTitleRow={false}\n sticky={false}\n titleCell={false}\n warning={false}\n >\n <Skeleton height={22} width=\"90%\" />\n </StyledTableCell>\n ))}\n </TableRow>\n ))\n : data?.map((row, rowIdx) => (\n <GenericTableBodyRow\n // eslint-disable-next-line react/no-array-index-key\n key={`row-${rowIdx}`}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n tableRowTestKey={rowIdx.toString()}\n onRowClick={onRowClick}\n >\n {Array.from(columns).map((colName, colIdx) => (\n <RenderTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`cell-${colName}-${colIdx}`}\n colIdx={colIdx}\n colName={colName}\n meta={meta ?? {}}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n type={type}\n />\n ))}\n </GenericTableBodyRow>\n ))}\n </MuiTableBody>\n );\n};\n\nexport default GenericTableBody;\n"],"names":["StyledTableCell","styled","TableCell","shouldForwardProp","prop","align","titleCell","warning","sticky","isTitleRow","textAlign","fontWeight","backgroundColor","position","RenderTableCell","colIdx","colName","hasWarning","hasTitle","meta","row","type","fallbackValue","hideWhenEmpty","tableCellProps","React","isValidElement","_jsx","children","columnType","jsx","customComponent","columns","data","loading","onRowClick","MuiTableBody","Array","from","map","_","idx","TableRow","columnName","Skeleton","height","width","rowIdx","GenericTableBodyRow","tableRowTestKey","toString"],"mappings":"wSAuBA,MAAMA,EAAkBC,EAAMA,OAACC,EAAW,CACxCC,kBAAoBC,GACT,UAATA,GACS,cAATA,GACS,YAATA,GACS,WAATA,GACS,eAATA,GANoBH,EAQtB,EAAGI,QAAOC,YAAWC,UAASC,SAAQC,iBAAkB,CACtDC,UAAWL,EACXM,WAAYL,GAAaG,EAAa,OAAS,SAC/CG,gBAAiBL,EAAU,UAAY,UACvCM,SAAUL,EAAS,SAAW,aAe5BM,EAA4C,EAChDC,SACAC,UACAC,aACAC,WACAC,OACAC,MACAC,WAGA,MAAMjB,EAAOgB,EAAIJ,GACXX,EAAQc,EAAKH,IAAUX,OAAS,OAEhCiB,EADgBH,EAAKH,IAAUO,gBAAiB,EAChB,GAAK,IACrCC,EAAiB,CACrBnB,QACAE,QAASU,IAAc,EACvBX,UAAWY,IAAY,EACvBV,OAAiB,WAATa,GAAgC,IAAXN,EAC7B,cAAe,OAAOC,IAEtBP,WAAYW,EAAgB,aAAK,GAKnC,GAAIK,EAAMC,eAAetB,GACvB,OAAOuB,EAAAA,IAAC3B,EAAe,IAAKwB,EAAiBI,SAAAxB,IAG/C,OAAQe,EAAKH,IAAUa,YACrB,IAAK,SAQL,QACE,OAAOF,EAAAA,IAAC3B,EAAoB,IAAAwB,WAAiBpB,GAAQkB,IAPvD,IAAK,SACH,OACEK,EAAAG,IAAC9B,EAAe,IAAKwB,EAAcI,SAChCxB,EAAOe,EAAKH,IAAUe,kBAAkB3B,EAAMgB,GAAOE,qBAmBb,EAAGU,UAASC,OAAMC,UAASb,OAAMc,aAAYhB,UAG5FQ,EAAAG,IAACM,EAAY,CAAAR,SACVM,EACGG,MAAMC,KAAKD,MAJC,IAImBE,KAAI,CAACC,EAAGC,IAErCd,EAAAA,IAACe,iBAA+C,aAAYd,SACzDS,MAAMC,KAAKN,GAASO,KAAI,CAACI,EAAY5B,IACpCY,EAAAA,IAAC3B,GAGCK,MAAO,OACM,cAAA,OAAOsC,IACpBlC,YAAY,EACZD,QAAQ,EACRF,WAAW,EACXC,SAAS,EAETqB,SAAAD,MAACiB,EAAS,CAAAC,OAAQ,GAAIC,MAAM,SARvB,OAAOH,YAAqB5B,QAJxB,cAAc0B,OAiB/BR,GAAMM,KAAI,CAACnB,EAAK2B,IACdpB,EAAAA,IAACqB,GAIC5B,IAAKA,EACL6B,gBAAiBF,EAAOG,WACxBf,WAAYA,WAEXE,MAAMC,KAAKN,GAASO,KAAI,CAACvB,EAASD,IACjCY,MAACb,GAGCC,OAAQA,EACRC,QAASA,EACTG,KAAMA,GAAQ,CAAE,EAEhBC,IAAKA,EACLC,KAAMA,GAND,QAAQL,KAAWD,QATvB,OAAOgC"}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import react__default from 'react';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
interface GenericTableColumns {
|
|
4
4
|
columnName: string;
|
|
5
5
|
columnTitle: string;
|
|
6
|
-
columnType: '
|
|
6
|
+
columnType: 'Custom' | 'String';
|
|
7
7
|
align?: 'left' | 'right';
|
|
8
8
|
isVisible: boolean;
|
|
9
9
|
ordinal: number;
|
|
10
10
|
customComponent?: (data: any, row: any) => JSX.Element;
|
|
11
11
|
tooltip?: string;
|
|
12
12
|
hideWhenEmpty?: boolean;
|
|
13
|
-
}
|
|
14
|
-
|
|
13
|
+
}
|
|
14
|
+
interface TableCellProps {
|
|
15
15
|
colIdx: number;
|
|
16
16
|
colName: string;
|
|
17
17
|
hasWarning?: boolean;
|
|
@@ -20,9 +20,9 @@ type TableCellProps = {
|
|
|
20
20
|
[key: string]: GenericTableColumns;
|
|
21
21
|
};
|
|
22
22
|
row: Record<string, any>;
|
|
23
|
-
type: '
|
|
24
|
-
}
|
|
25
|
-
|
|
23
|
+
type: 'normal' | 'sticky';
|
|
24
|
+
}
|
|
25
|
+
interface TableBodyProps {
|
|
26
26
|
columns: Set<string>;
|
|
27
27
|
data?: any[];
|
|
28
28
|
loading?: boolean;
|
|
@@ -30,8 +30,8 @@ type TableBodyProps = {
|
|
|
30
30
|
[key: string]: GenericTableColumns;
|
|
31
31
|
};
|
|
32
32
|
onRowClick?: Function;
|
|
33
|
-
type: '
|
|
34
|
-
}
|
|
33
|
+
type: 'normal' | 'sticky';
|
|
34
|
+
}
|
|
35
35
|
declare const GenericTableBody: react__default.FC<TableBodyProps>;
|
|
36
36
|
|
|
37
37
|
export { GenericTableBody as default };
|