npm - udp-react-enterprise-component-library - Versions diffs - 25.18.1-beta.41 → 25.18.1-beta.43 - Mend

udp-react-enterprise-component-library 25.18.1-beta.41 → 25.18.1-beta.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (362) hide show

package/dist/{FieldArrayCard-CgM6q87c.js.map → FieldArrayCard-Bv9h9akG.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldArrayCard-CgM6q87c.js","names":["Grid","AutocompleteFinalField","DateRangeField","FormControlLabel","Typography","Grid","SearchSideSheet"],"sources":["../src/UI/inputs/fieldArrayCard/fieldArrayCardEnum.ts","../src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx","../src/UI/inputs/fieldArrayCard/AutocompleteFinalField.jsx","../src/UI/inputs/fieldArrayCard/DateRangeField.jsx","../src/UI/inputs/fieldArrayCard/FieldArrayCard.jsx"],"sourcesContent":["export enum FieldType {\n Text = 'text',\n Date = 'date',\n DateRange = 'dateRange',\n Time = 'time',\n DateTime = 'dateTime',\n Toggle = 'toggle',\n Checkbox = 'checkbox',\n DropdownMenu = 'dropdownMenu',\n}","import React, { useCallback, useMemo, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { AmbientGridTemplate } from '../../templates/deprecated/AmbientGridTemplate/AmbientGridTemplate';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FilterOperators } from '../../../models/SearchOperator';\nimport { SideSheet } from '../../surfaces/SideSheet';\nimport { useAgGridApi } from '../../../utilities/aggrid/AgTable';\n\nconst SearchSideSheet = props => {\n const {\n open,\n handleClose,\n exclude,\n title,\n productApiBase,\n searchApi,\n colDefs = [],\n gridTitle,\n idField,\n formIdField,\n handleSearch,\n width = '800px',\n height='58vh'\n } = props;\n const [selectedData, setSelectedData] = useState([]);\n const { t } = useTranslation();\n const { gridApi, onGridReady, gridColumnApi } = useAgGridApi();\n const paginationPageSize = 20;\n\n // TODO: use queryId or new data grid from stencil\n const searchData = useCallback(\n async data =>\n apiMutate(\n productApiBase,\n searchApi,\n {\n method: 'post',\n },\n data\n ),\n [productApiBase, searchApi]\n );\n\n const onSelectionChanged = useCallback(() => {\n const selectedRows = gridApi?.getSelectedRows() ?? [];\n setSelectedData(selectedRows);\n }, [gridApi]);\n\n const handleCloseSideSheet = useCallback(\n data => {\n handleClose(data);\n setSelectedData([]);\n },\n [handleClose]\n );\n\n const dataSource = useMemo(\n () => ({\n getRows: async ({ request, success, fail }) => {\n if (handleSearch) {\n handleSearch(paginationPageSize, request, success, fail);\n return;\n }\n const filterElements = request?.filterModel\n ? Object.entries(request.filterModel)?.map(([key, value]) => {\n return {\n searchField: key,\n searchOperator: FilterOperators[value?.type],\n searchValue: value?.filter,\n };\n })\n : [];\n\n const orderElements = request?.sortModel\n ? request.sortModel?.map(sortObj => {\n return {\n sortColumn: sortObj?.colId,\n sortDirection: sortObj?.sort?.toUpperCase(),\n };\n })\n : [];\n await searchData({\n data: {\n filterElements: filterElements,\n orderElements: orderElements,\n pagesize: paginationPageSize,\n pageNumber: (request?.startRow ?? 0) / paginationPageSize + 1,\n },\n })\n .then(response => {\n success({\n rowData: response.data?.pageList,\n rowCount: response.data?.total,\n });\n })\n .catch(error => {\n fail();\n });\n\n },\n }),\n [searchData, handleSearch]\n );\n return (\n <SideSheet\n open={open}\n onClose={() => handleCloseSideSheet()}\n title={title}\n width={width}\n buttonLabel={t('Choose')}\n onSubmit={() => {\n handleCloseSideSheet(selectedData);\n }}\n >\n <AmbientGridTemplate\n title={gridTitle}\n rowModelType=\"serverSide\"\n serverSideDatasource={dataSource}\n cacheBlockSize={paginationPageSize}\n serverSideStoreType=\"partial\"\n paginationPageSize={paginationPageSize}\n columnDefs={[\n {\n field: '',\n checkboxSelection: true,\n maxWidth: 60,\n minWidth: 60,\n cellRenderer: params => {\n console.log({\n exclude,\n formIdField,\n idField,\n bool: exclude?.find(\n selectedItem =>\n selectedItem[formIdField] === params.data?.[idField]\n ),\n });\n if (\n params?.data &&\n !!exclude?.find(\n selectedItem =>\n selectedItem[formIdField] === params.data?.[idField]\n )\n ) {\n params.node.setSelected(true);\n }\n },\n },\n ...colDefs,\n ]}\n hideGroupTab\n hideColumnTab\n suppressRowClickSelection={true}\n onSelectionChanged={onSelectionChanged}\n rowSelection=\"multiple\"\n api={gridApi}\n gridReady={onGridReady}\n columnApi={gridColumnApi}\n dynamicSizing={true}\n height={height}\n />\n </SideSheet>\n );\n};\n\nexport default SearchSideSheet;\n","import React, { useMemo } from 'react';\nimport { FluentTextFieldAutoComplete } from '../textField/FluentTextFieldAutoComplete';\n\n// this is only to used in FieldArrayCard\nconst AutocompleteFinalField = props => {\n const { value, options, idField = 'id' ,...otherProps } = props;\n\n const currentValue = useMemo(() => {\n if (typeof value === 'object') {\n return value;\n }\n\n return options.find(option => option[idField] === value) \|\| null;\n }, [idField, options, value]);\n\n return (\n <FluentTextFieldAutoComplete\n {...otherProps}\n options={options}\n value={currentValue}\n />\n );\n};\n\nexport default AutocompleteFinalField;\n","import React, { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Field } from '../../../utilities/form';\nimport { FluentDatePicker } from '../pickers/FluentDatePicker';\nimport { Grid } from '../../Grid';\n\nconst DateRangeField = props => {\n const {\n fieldName,\n startDateProps = {},\n endDateProps = {},\n sameRow = false,\n initialValues,\n } = props;\n const [maxStartDate, setMaxStartDate] = useState();\n const [minEndDate, setMinEndDate] = useState();\n const { t } = useTranslation();\n\n useEffect(() => {\n const currentStartDate = initialValues[startDateProps?.name ?? 'startDate'];\n if (currentStartDate) {\n let minDate = new Date(currentStartDate);\n minDate.setDate(minDate?.getDate() + 1);\n setMinEndDate(minDate);\n } else {\n setMinEndDate(undefined);\n }\n }, [initialValues, startDateProps.name]);\n\n useEffect(() => {\n const currentEndDate = initialValues[endDateProps?.name ?? 'endDate'];\n if (currentEndDate) {\n let maxDate = new Date(currentEndDate);\n maxDate.setDate(maxDate?.getDate() - 1);\n maxDate.setHours(0, 0, 0, 0);\n setMaxStartDate(maxDate);\n } else {\n setMaxStartDate(undefined);\n }\n }, [endDateProps.name, initialValues]);\n\n return (\n <Grid container spacing={sameRow ? 2 : 0}>\n <Grid item xs={12} sm={sameRow ? 6 : 12}>\n <Field\n {...startDateProps}\n parse={value => (value ? value : null)}\n format={value => (value ? value : null)}\n label={startDateProps?.label ?? t('Start Date')}\n name={`${fieldName}.${startDateProps?.name ?? 'startDate'}`}\n key={`${fieldName}.${startDateProps?.name ?? 'startDate'}`}\n component={FluentDatePicker}\n size=\"small\"\n maxDate={maxStartDate}\n allowNull\n />\n </Grid>\n <Grid item xs={12} sm={sameRow ? 6 : 12}>\n <Field\n {...endDateProps}\n parse={value => value ?? null}\n format={value => value ?? null}\n label={endDateProps?.label ?? t('End Date')}\n name={`${fieldName}.${endDateProps?.name ?? 'endDate'}`}\n key={`${fieldName}.${endDateProps?.name ?? 'endDate'}`}\n component={FluentDatePicker}\n size=\"small\"\n minDate={minEndDate}\n allowNull\n />\n </Grid>\n </Grid>\n );\n};\n\nexport default DateRangeField;\n","import { AddIcon, DeleteIcon } from '@fluentui/react-icons';\nimport { makeStyles } from '@material-ui/core';\nimport React, { useCallback, useState } from 'react';\nimport { FieldArray } from 'react-final-form-arrays';\nimport { useTranslation } from 'react-i18next';\nimport SearchSideSheet from './SearchSideSheet';\nimport AutocompleteFinalField from './AutocompleteFinalField';\nimport DateRangeField from './DateRangeField';\nimport { FieldType } from './fieldArrayCardEnum';\nimport { AmbientCard } from '../../surfaces/cards/AmbientCard';\nimport { DateTimeField } from '../datetimes/DateTimeField';\nimport { EmptyStateDisplay } from '../../dataDisplay/EmptyStateDisplay';\nimport { Field } from '../../../utilities/form';\nimport { FluentCheckbox } from '../checkbox/FluentCheckbox';\nimport { FluentDatePicker } from '../pickers/FluentDatePicker';\nimport { FluentTextField } from '../textField/FluentTextField';\nimport { FluentTimePicker } from '../pickers/FluentTimePicker';\nimport { FluentToggle } from '../toggle/FluentToggle';\nimport { FormControlLabel } from '../../utilityDisplay/FormControlLabel';\nimport { Grid } from '../../Grid';\nimport { IconButtonWithTooltip } from '../buttons/IconButtonWithToolTip';\nimport { LayoutUnit } from '../../../layout/LayoutUnit';\nimport { Typography } from '../../dataDisplay/typography/Typography';\n\nconst useStyles = makeStyles(theme => ({\n toggleWrapper: {\n marginLeft: theme.spacing(-0.1),\n gap: theme.spacing(1),\n marginTop: theme.spacing(0.8),\n },\n checkboxField: {\n marginLeft: theme.spacing(-1.1),\n },\n sectionHeader: {\n display: 'flex',\n justifyContent: 'space-between',\n gap: theme.spacing(1),\n alignItems: 'center',\n marginBottom: theme.spacing(1),\n },\n fieldsWrapper: {\n display: 'flex',\n flexDirection: 'column',\n },\n cardsWrapper: {\n display: 'flex',\n flexDirection: 'column',\n gap: theme.spacing(2),\n },\n cardHeader: {\n display: 'flex',\n justifyContent: 'space-between',\n gap: theme.spacing(1),\n alignItems: 'center',\n },\n}));\n\nexport const FieldArrayCard = props => {\n const {\n title = ' ',\n fieldArrayName,\n getRowTitle,\n fieldConfig,\n removeTopLayoutUnit = false,\n defaultAddedItemValues,\n //search sidesheet props\n enableSearchSideSheet,\n searchSideSheetTitle,\n searchFieldId = 'id',\n formFieldId = 'id',\n formatAddedSearchItems,\n productApiBase,\n searchApi,\n searchGridColDefs,\n searchGridTitle,\n handleSearch,\n disableExcludeInSearch = false,\n searchSideSheetWidth,\n searchSideSheetHeight,\n } = props;\n const classes = useStyles();\n const [openSideSheet, setOpenSideSheet] = useState(false);\n const { t } = useTranslation();\n\n const getField = useCallback(\n (finalFieldName, config, fieldObj) => {\n const { fieldName, fieldType, fieldLabel, componentProps } = config;\n\n let fieldComponent = null;\n\n switch (fieldType) {\n case FieldType.DropdownMenu:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={AutocompleteFinalField}\n label={fieldLabel}\n />\n );\n break;\n case FieldType.Date:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentDatePicker}\n label={fieldLabel}\n size=\"small\"\n allowNull\n />\n );\n break;\n case FieldType.DateRange:\n fieldComponent = (\n <DateRangeField\n {...componentProps}\n fieldName={finalFieldName}\n initialValues={fieldObj}\n />\n );\n break;\n case FieldType.Time:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentTimePicker}\n label={fieldLabel}\n size=\"small\"\n />\n );\n break;\n case FieldType.DateTime:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={DateTimeField}\n label={fieldLabel}\n size=\"small\"\n allowNull\n />\n );\n break;\n case FieldType.Toggle:\n fieldComponent = (\n <FormControlLabel\n control={\n <Field\n defaultChecked={false}\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentToggle}\n type=\"checkbox\"\n />\n }\n label={fieldLabel}\n className={classes.toggleWrapper}\n />\n );\n break;\n case FieldType.Checkbox:\n fieldComponent = (\n <FormControlLabel\n control={\n <Field\n defaultChecked={false}\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentCheckbox}\n type=\"checkbox\"\n />\n }\n label={fieldLabel}\n className={classes.checkboxField}\n />\n );\n break;\n default:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentTextField}\n label={fieldLabel}\n />\n );\n break;\n }\n\n return fieldComponent;\n },\n [classes.checkboxField, classes.toggleWrapper]\n );\n\n const handleCloseSideSheet = useCallback(\n (selectedRecords, fieldArray) => {\n const formattedRecords = formatAddedSearchItems\n ? formatAddedSearchItems(selectedRecords ?? [])\n : selectedRecords;\n\n if (formattedRecords?.length) {\n for (const record of formattedRecords) {\n if (\n disableExcludeInSearch \|\|\n !!!fieldArray?.value?.find(\n item => item[formFieldId] === record[formFieldId]\n )\n )\n fieldArray.push(record);\n }\n }\n\n setOpenSideSheet(false);\n },\n [disableExcludeInSearch, formFieldId, formatAddedSearchItems]\n );\n\n const handleAddField = useCallback(\n fields => {\n if (enableSearchSideSheet) {\n setOpenSideSheet(true);\n } else {\n if (defaultAddedItemValues) {\n fields.push(defaultAddedItemValues);\n } else {\n fields.push({});\n }\n }\n },\n [defaultAddedItemValues, enableSearchSideSheet]\n );\n\n return (\n <div>\n <FieldArray name={fieldArrayName}>\n {({ fields }) => {\n return (\n <div>\n <div className={classes.sectionHeader}>\n <div>\n {title && <Typography variant=\"h6\">{title}</Typography>}\n </div>\n <IconButtonWithTooltip\n onClick={() => {\n handleAddField(fields);\n }}\n icon={AddIcon}\n title={t('Add')}\n />\n </div>\n\n <div className={classes.cardsWrapper}>\n {fields?.value?.length > 0 ? (\n fields.map((name, index) => {\n const rowTitle =\n getRowTitle && getRowTitle(fields?.value?.[index]);\n return (\n <AmbientCard fullWidth>\n <div className={classes.cardHeader}>\n <Typography variant=\"h6\">{rowTitle}</Typography>\n\n <IconButtonWithTooltip\n onClick={() => fields.remove(index)}\n icon={DeleteIcon}\n title={t('Delete')}\n />\n </div>\n {rowTitle && !removeTopLayoutUnit && (\n <LayoutUnit unit=\"xxs\" />\n )}\n <div className={classes.fieldsWrapper}>\n {fieldConfig?.map(config => {\n if (Array.isArray(config)) {\n return (\n <Grid container spacing={2}>\n {config?.map(innerConfig => {\n return (\n <Grid\n item\n xs={12}\n sm={12 / config?.length}\n >\n {getField(\n name,\n innerConfig,\n fields?.value?.[index]\n )}\n </Grid>\n );\n })}\n </Grid>\n );\n } else {\n return getField(\n name,\n config,\n fields?.value?.[index]\n );\n }\n })}\n </div>\n </AmbientCard>\n );\n })\n ) : (\n <AmbientCard fullWidth cardHeight=\"155px\">\n <EmptyStateDisplay\n primaryText={t('No records to show')}\n secondaryText={t('Try adding one')}\n />\n </AmbientCard>\n )}\n </div>\n <SearchSideSheet\n open={openSideSheet}\n handleClose={data => {\n handleCloseSideSheet(data, fields);\n }}\n exclude={disableExcludeInSearch ? [] : fields?.value}\n title={searchSideSheetTitle}\n productApiBase={productApiBase}\n searchApi={searchApi}\n colDefs={searchGridColDefs}\n idField={searchFieldId}\n formIdField={formFieldId}\n gridTitle={searchGridTitle}\n handleSearch={handleSearch}\n width={searchSideSheetWidth}\n height={searchSideSheetHeight}\n />\n </div>\n );\n }}\n </FieldArray>\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"FieldArrayCard-Bv9h9akG.js","names":["Grid","AutocompleteFinalField","DateRangeField","FormControlLabel","Typography","Grid","SearchSideSheet"],"sources":["../src/UI/inputs/fieldArrayCard/fieldArrayCardEnum.ts","../src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx","../src/UI/inputs/fieldArrayCard/AutocompleteFinalField.jsx","../src/UI/inputs/fieldArrayCard/DateRangeField.jsx","../src/UI/inputs/fieldArrayCard/FieldArrayCard.jsx"],"sourcesContent":["export enum FieldType {\n Text = 'text',\n Date = 'date',\n DateRange = 'dateRange',\n Time = 'time',\n DateTime = 'dateTime',\n Toggle = 'toggle',\n Checkbox = 'checkbox',\n DropdownMenu = 'dropdownMenu',\n}","import React, { useCallback, useMemo, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { AmbientGridTemplate } from '../../templates/deprecated/AmbientGridTemplate/AmbientGridTemplate';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FilterOperators } from '../../../models/SearchOperator';\nimport { SideSheet } from '../../surfaces/SideSheet';\nimport { useAgGridApi } from '../../../utilities/aggrid/AgTable';\n\nconst SearchSideSheet = props => {\n const {\n open,\n handleClose,\n exclude,\n title,\n productApiBase,\n searchApi,\n colDefs = [],\n gridTitle,\n idField,\n formIdField,\n handleSearch,\n width = '800px',\n height='58vh'\n } = props;\n const [selectedData, setSelectedData] = useState([]);\n const { t } = useTranslation();\n const { gridApi, onGridReady, gridColumnApi } = useAgGridApi();\n const paginationPageSize = 20;\n\n // TODO: use queryId or new data grid from stencil\n const searchData = useCallback(\n async data =>\n apiMutate(\n productApiBase,\n searchApi,\n {\n method: 'post',\n },\n data\n ),\n [productApiBase, searchApi]\n );\n\n const onSelectionChanged = useCallback(() => {\n const selectedRows = gridApi?.getSelectedRows() ?? [];\n setSelectedData(selectedRows);\n }, [gridApi]);\n\n const handleCloseSideSheet = useCallback(\n data => {\n handleClose(data);\n setSelectedData([]);\n },\n [handleClose]\n );\n\n const dataSource = useMemo(\n () => ({\n getRows: async ({ request, success, fail }) => {\n if (handleSearch) {\n handleSearch(paginationPageSize, request, success, fail);\n return;\n }\n const filterElements = request?.filterModel\n ? Object.entries(request.filterModel)?.map(([key, value]) => {\n return {\n searchField: key,\n searchOperator: FilterOperators[value?.type],\n searchValue: value?.filter,\n };\n })\n : [];\n\n const orderElements = request?.sortModel\n ? request.sortModel?.map(sortObj => {\n return {\n sortColumn: sortObj?.colId,\n sortDirection: sortObj?.sort?.toUpperCase(),\n };\n })\n : [];\n await searchData({\n data: {\n filterElements: filterElements,\n orderElements: orderElements,\n pagesize: paginationPageSize,\n pageNumber: (request?.startRow ?? 0) / paginationPageSize + 1,\n },\n })\n .then(response => {\n success({\n rowData: response.data?.pageList,\n rowCount: response.data?.total,\n });\n })\n .catch(error => {\n fail();\n });\n\n },\n }),\n [searchData, handleSearch]\n );\n return (\n <SideSheet\n open={open}\n onClose={() => handleCloseSideSheet()}\n title={title}\n width={width}\n buttonLabel={t('Choose')}\n onSubmit={() => {\n handleCloseSideSheet(selectedData);\n }}\n >\n <AmbientGridTemplate\n title={gridTitle}\n rowModelType=\"serverSide\"\n serverSideDatasource={dataSource}\n cacheBlockSize={paginationPageSize}\n serverSideStoreType=\"partial\"\n paginationPageSize={paginationPageSize}\n columnDefs={[\n {\n field: '',\n checkboxSelection: true,\n maxWidth: 60,\n minWidth: 60,\n cellRenderer: params => {\n console.log({\n exclude,\n formIdField,\n idField,\n bool: exclude?.find(\n selectedItem =>\n selectedItem[formIdField] === params.data?.[idField]\n ),\n });\n if (\n params?.data &&\n !!exclude?.find(\n selectedItem =>\n selectedItem[formIdField] === params.data?.[idField]\n )\n ) {\n params.node.setSelected(true);\n }\n },\n },\n ...colDefs,\n ]}\n hideGroupTab\n hideColumnTab\n suppressRowClickSelection={true}\n onSelectionChanged={onSelectionChanged}\n rowSelection=\"multiple\"\n api={gridApi}\n gridReady={onGridReady}\n columnApi={gridColumnApi}\n dynamicSizing={true}\n height={height}\n />\n </SideSheet>\n );\n};\n\nexport default SearchSideSheet;\n","import React, { useMemo } from 'react';\nimport { FluentTextFieldAutoComplete } from '../textField/FluentTextFieldAutoComplete';\n\n// this is only to used in FieldArrayCard\nconst AutocompleteFinalField = props => {\n const { value, options, idField = 'id' ,...otherProps } = props;\n\n const currentValue = useMemo(() => {\n if (typeof value === 'object') {\n return value;\n }\n\n return options.find(option => option[idField] === value) \|\| null;\n }, [idField, options, value]);\n\n return (\n <FluentTextFieldAutoComplete\n {...otherProps}\n options={options}\n value={currentValue}\n />\n );\n};\n\nexport default AutocompleteFinalField;\n","import React, { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Field } from '../../../utilities/form';\nimport { FluentDatePicker } from '../pickers/FluentDatePicker';\nimport { Grid } from '../../Grid';\n\nconst DateRangeField = props => {\n const {\n fieldName,\n startDateProps = {},\n endDateProps = {},\n sameRow = false,\n initialValues,\n } = props;\n const [maxStartDate, setMaxStartDate] = useState();\n const [minEndDate, setMinEndDate] = useState();\n const { t } = useTranslation();\n\n useEffect(() => {\n const currentStartDate = initialValues[startDateProps?.name ?? 'startDate'];\n if (currentStartDate) {\n let minDate = new Date(currentStartDate);\n minDate.setDate(minDate?.getDate() + 1);\n setMinEndDate(minDate);\n } else {\n setMinEndDate(undefined);\n }\n }, [initialValues, startDateProps.name]);\n\n useEffect(() => {\n const currentEndDate = initialValues[endDateProps?.name ?? 'endDate'];\n if (currentEndDate) {\n let maxDate = new Date(currentEndDate);\n maxDate.setDate(maxDate?.getDate() - 1);\n maxDate.setHours(0, 0, 0, 0);\n setMaxStartDate(maxDate);\n } else {\n setMaxStartDate(undefined);\n }\n }, [endDateProps.name, initialValues]);\n\n return (\n <Grid container spacing={sameRow ? 2 : 0}>\n <Grid item xs={12} sm={sameRow ? 6 : 12}>\n <Field\n {...startDateProps}\n parse={value => (value ? value : null)}\n format={value => (value ? value : null)}\n label={startDateProps?.label ?? t('Start Date')}\n name={`${fieldName}.${startDateProps?.name ?? 'startDate'}`}\n key={`${fieldName}.${startDateProps?.name ?? 'startDate'}`}\n component={FluentDatePicker}\n size=\"small\"\n maxDate={maxStartDate}\n allowNull\n />\n </Grid>\n <Grid item xs={12} sm={sameRow ? 6 : 12}>\n <Field\n {...endDateProps}\n parse={value => value ?? null}\n format={value => value ?? null}\n label={endDateProps?.label ?? t('End Date')}\n name={`${fieldName}.${endDateProps?.name ?? 'endDate'}`}\n key={`${fieldName}.${endDateProps?.name ?? 'endDate'}`}\n component={FluentDatePicker}\n size=\"small\"\n minDate={minEndDate}\n allowNull\n />\n </Grid>\n </Grid>\n );\n};\n\nexport default DateRangeField;\n","import { AddIcon, DeleteIcon } from '@fluentui/react-icons';\nimport { makeStyles } from '@material-ui/core';\nimport React, { useCallback, useState } from 'react';\nimport { FieldArray } from 'react-final-form-arrays';\nimport { useTranslation } from 'react-i18next';\nimport SearchSideSheet from './SearchSideSheet';\nimport AutocompleteFinalField from './AutocompleteFinalField';\nimport DateRangeField from './DateRangeField';\nimport { FieldType } from './fieldArrayCardEnum';\nimport { AmbientCard } from '../../surfaces/cards/AmbientCard';\nimport { DateTimeField } from '../datetimes/DateTimeField';\nimport { EmptyStateDisplay } from '../../dataDisplay/EmptyStateDisplay';\nimport { Field } from '../../../utilities/form';\nimport { FluentCheckbox } from '../checkbox/FluentCheckbox';\nimport { FluentDatePicker } from '../pickers/FluentDatePicker';\nimport { FluentTextField } from '../textField/FluentTextField';\nimport { FluentTimePicker } from '../pickers/FluentTimePicker';\nimport { FluentToggle } from '../toggle/FluentToggle';\nimport { FormControlLabel } from '../../utilityDisplay/FormControlLabel';\nimport { Grid } from '../../Grid';\nimport { IconButtonWithTooltip } from '../buttons/IconButtonWithToolTip';\nimport { LayoutUnit } from '../../../layout/LayoutUnit';\nimport { Typography } from '../../dataDisplay/typography/Typography';\n\nconst useStyles = makeStyles(theme => ({\n toggleWrapper: {\n marginLeft: theme.spacing(-0.1),\n gap: theme.spacing(1),\n marginTop: theme.spacing(0.8),\n },\n checkboxField: {\n marginLeft: theme.spacing(-1.1),\n },\n sectionHeader: {\n display: 'flex',\n justifyContent: 'space-between',\n gap: theme.spacing(1),\n alignItems: 'center',\n marginBottom: theme.spacing(1),\n },\n fieldsWrapper: {\n display: 'flex',\n flexDirection: 'column',\n },\n cardsWrapper: {\n display: 'flex',\n flexDirection: 'column',\n gap: theme.spacing(2),\n },\n cardHeader: {\n display: 'flex',\n justifyContent: 'space-between',\n gap: theme.spacing(1),\n alignItems: 'center',\n },\n}));\n\nexport const FieldArrayCard = props => {\n const {\n title = ' ',\n fieldArrayName,\n getRowTitle,\n fieldConfig,\n removeTopLayoutUnit = false,\n defaultAddedItemValues,\n //search sidesheet props\n enableSearchSideSheet,\n searchSideSheetTitle,\n searchFieldId = 'id',\n formFieldId = 'id',\n formatAddedSearchItems,\n productApiBase,\n searchApi,\n searchGridColDefs,\n searchGridTitle,\n handleSearch,\n disableExcludeInSearch = false,\n searchSideSheetWidth,\n searchSideSheetHeight,\n } = props;\n const classes = useStyles();\n const [openSideSheet, setOpenSideSheet] = useState(false);\n const { t } = useTranslation();\n\n const getField = useCallback(\n (finalFieldName, config, fieldObj) => {\n const { fieldName, fieldType, fieldLabel, componentProps } = config;\n\n let fieldComponent = null;\n\n switch (fieldType) {\n case FieldType.DropdownMenu:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={AutocompleteFinalField}\n label={fieldLabel}\n />\n );\n break;\n case FieldType.Date:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentDatePicker}\n label={fieldLabel}\n size=\"small\"\n allowNull\n />\n );\n break;\n case FieldType.DateRange:\n fieldComponent = (\n <DateRangeField\n {...componentProps}\n fieldName={finalFieldName}\n initialValues={fieldObj}\n />\n );\n break;\n case FieldType.Time:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentTimePicker}\n label={fieldLabel}\n size=\"small\"\n />\n );\n break;\n case FieldType.DateTime:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={DateTimeField}\n label={fieldLabel}\n size=\"small\"\n allowNull\n />\n );\n break;\n case FieldType.Toggle:\n fieldComponent = (\n <FormControlLabel\n control={\n <Field\n defaultChecked={false}\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentToggle}\n type=\"checkbox\"\n />\n }\n label={fieldLabel}\n className={classes.toggleWrapper}\n />\n );\n break;\n case FieldType.Checkbox:\n fieldComponent = (\n <FormControlLabel\n control={\n <Field\n defaultChecked={false}\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentCheckbox}\n type=\"checkbox\"\n />\n }\n label={fieldLabel}\n className={classes.checkboxField}\n />\n );\n break;\n default:\n fieldComponent = (\n <Field\n {...componentProps}\n name={`${finalFieldName}.${fieldName}`}\n component={FluentTextField}\n label={fieldLabel}\n />\n );\n break;\n }\n\n return fieldComponent;\n },\n [classes.checkboxField, classes.toggleWrapper]\n );\n\n const handleCloseSideSheet = useCallback(\n (selectedRecords, fieldArray) => {\n const formattedRecords = formatAddedSearchItems\n ? formatAddedSearchItems(selectedRecords ?? [])\n : selectedRecords;\n\n if (formattedRecords?.length) {\n for (const record of formattedRecords) {\n if (\n disableExcludeInSearch \|\|\n !!!fieldArray?.value?.find(\n item => item[formFieldId] === record[formFieldId]\n )\n )\n fieldArray.push(record);\n }\n }\n\n setOpenSideSheet(false);\n },\n [disableExcludeInSearch, formFieldId, formatAddedSearchItems]\n );\n\n const handleAddField = useCallback(\n fields => {\n if (enableSearchSideSheet) {\n setOpenSideSheet(true);\n } else {\n if (defaultAddedItemValues) {\n fields.push(defaultAddedItemValues);\n } else {\n fields.push({});\n }\n }\n },\n [defaultAddedItemValues, enableSearchSideSheet]\n );\n\n return (\n <div>\n <FieldArray name={fieldArrayName}>\n {({ fields }) => {\n return (\n <div>\n <div className={classes.sectionHeader}>\n <div>\n {title && <Typography variant=\"h6\">{title}</Typography>}\n </div>\n <IconButtonWithTooltip\n onClick={() => {\n handleAddField(fields);\n }}\n icon={AddIcon}\n title={t('Add')}\n />\n </div>\n\n <div className={classes.cardsWrapper}>\n {fields?.value?.length > 0 ? (\n fields.map((name, index) => {\n const rowTitle =\n getRowTitle && getRowTitle(fields?.value?.[index]);\n return (\n <AmbientCard fullWidth>\n <div className={classes.cardHeader}>\n <Typography variant=\"h6\">{rowTitle}</Typography>\n\n <IconButtonWithTooltip\n onClick={() => fields.remove(index)}\n icon={DeleteIcon}\n title={t('Delete')}\n />\n </div>\n {rowTitle && !removeTopLayoutUnit && (\n <LayoutUnit unit=\"xxs\" />\n )}\n <div className={classes.fieldsWrapper}>\n {fieldConfig?.map(config => {\n if (Array.isArray(config)) {\n return (\n <Grid container spacing={2}>\n {config?.map(innerConfig => {\n return (\n <Grid\n item\n xs={12}\n sm={12 / config?.length}\n >\n {getField(\n name,\n innerConfig,\n fields?.value?.[index]\n )}\n </Grid>\n );\n })}\n </Grid>\n );\n } else {\n return getField(\n name,\n config,\n fields?.value?.[index]\n );\n }\n })}\n </div>\n </AmbientCard>\n );\n })\n ) : (\n <AmbientCard fullWidth cardHeight=\"155px\">\n <EmptyStateDisplay\n primaryText={t('No records to show')}\n secondaryText={t('Try adding one')}\n />\n </AmbientCard>\n )}\n </div>\n <SearchSideSheet\n open={openSideSheet}\n handleClose={data => {\n handleCloseSideSheet(data, fields);\n }}\n exclude={disableExcludeInSearch ? [] : fields?.value}\n title={searchSideSheetTitle}\n productApiBase={productApiBase}\n searchApi={searchApi}\n colDefs={searchGridColDefs}\n idField={searchFieldId}\n formIdField={formFieldId}\n gridTitle={searchGridTitle}\n handleSearch={handleSearch}\n width={searchSideSheetWidth}\n height={searchSideSheetHeight}\n />\n </div>\n );\n }}\n </FieldArray>\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/{FileUpload-t3PZx_yE.js → FileUpload-BCxrOds_.js} RENAMED Viewed

@@ -238,4 +238,4 @@ const FileUpload = (props) => {
 //#endregion
 export { FileType as n, FileUpload as t };
-//# sourceMappingURL=FileUpload-t3PZx_yE.js.map
+//# sourceMappingURL=FileUpload-BCxrOds_.js.map

package/dist/{FileUpload-t3PZx_yE.js.map → FileUpload-BCxrOds_.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileUpload-t3PZx_yE.js","names":["useStyles","useStyles","FileProfile","ImagePreview","pickedFile"],"sources":["../src/utilities/uploader/FileProfile.jsx","../src/utilities/uploader/ImagePreview.jsx","../src/utilities/uploader/FileType.jsx","../src/utilities/uploader/FileUpload.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Typography, makeStyles } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n flexDirection: 'row'\n },\n prefix: {\n fontWeight: 600\n },\n title: {\n flex: 1\n },\n detail: {\n marginLeft: theme.spacing(2)\n }\n}))\n\nconst FileProfile = (props) => {\n const classes = useStyles()\n const { children, fileName, fileType, size, lastModifiedDate } = props\n return (\n <Fragment>\n <div className={classes.root}>\n <Typography variant='body1' className={classes.title}>\n <strong>{fileName}</strong>\n </Typography>\n <Typography variant='caption' className={classes.detail}>\n <span className={classes.prefix}>Type:</span> {fileType}\n </Typography>\n <Typography variant='caption' className={classes.detail}>\n <span className={classes.prefix}>Size:</span> {size}\n </Typography>\n </div>\n {children}\n <Typography variant='caption'>\n <span className={classes.prefix}>Last Modified:</span>{' '}\n {lastModifiedDate}\n </Typography>\n </Fragment>\n )\n}\nexport default FileProfile\n","import React from 'react';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex',\n justifyContent: 'center',\n },\n image: {\n maxWidth: 465,\n },\n}));\n\nconst ImagePreview = props => {\n const { image } = props;\n const classes = useStyles();\n\n return (\n <div className={classes.root}>\n <img className={classes.image} src={image} alt=\"upload preview\" />\n </div>\n );\n};\nexport default ImagePreview;\n","import React from 'react';\nimport FileProfile from './FileProfile';\nimport ImagePreview from './ImagePreview';\n\nexport const FileType = props => {\n let type = '';\n const { fileType, image, fileName, size, lastModifiedDate } = props;\n\n switch (fileType) {\n case 'pdf':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n />\n );\n break;\n case 'doc':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n />\n );\n break;\n case 'png':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n >\n <ImagePreview image={image} />\n </FileProfile>\n );\n break;\n case 'jpg':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n >\n <ImagePreview image={image} />\n </FileProfile>\n );\n break;\n case 'jpeg':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n >\n <ImagePreview image={image} />\n </FileProfile>\n );\n break;\n\n default:\n }\n\n return type;\n};\n","import React, { useRef, useState, useEffect, Fragment } from 'react'\nimport {\n makeStyles,\n Typography,\n Card,\n CardContent,\n Divider\n} from '@material-ui/core'\nimport { FileType } from './FileType'\nimport { FluentButton } from '../../UI/inputs/buttons/FluentButton'\n\nconst useStyles = makeStyles((theme) => ({\n avatarImage: {\n width: 200,\n height: 200,\n borderRadius: 100,\n border: '3px solid',\n borderColor: theme.palette.primary.main,\n marginTop: -3,\n marginLeft: -3\n },\n image: {\n width: 300,\n height: '100%',\n border: '2px solid',\n borderColor: theme.palette.primary.main,\n marginTop: -3,\n marginLeft: -3\n },\n instruction: {\n display: 'flex',\n alignContent: 'center',\n justifyContent: 'center'\n },\n icon: {\n display: 'flex',\n justifyContent: 'center'\n },\n avatarIcon: {\n display: 'flex',\n justifyContent: 'center',\n marginTop: '35%'\n },\n previewCard: {\n maxWidth: 500\n },\n action: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n display: 'flex',\n flexDirection: 'row'\n },\n divider: {\n marginTop: theme.spacing(1)\n },\n initialInstruction: {\n marginLeft: theme.spacing(2),\n marginTop: theme.spacing(0.5)\n }\n}))\n\nexport const FileUpload = (props) => {\n const [file, setFile] = useState()\n const [previewUrl, setPreviewUrl] = useState()\n const [isValid, setIsValid] = useState(false)\n const [fileType, setFileType] = useState()\n const [fileName, setFileName] = useState()\n const [fileSize, setFileSize] = useState()\n const [fileDate, setFileDate] = useState()\n const { id, onInput, accept, errorText } = props\n const classes = useStyles()\n\n const filePickerRef = useRef()\n useEffect(() => {\n if (!file) {\n return\n }\n const fileReader = new window.FileReader()\n fileReader.onload = () => {\n setPreviewUrl(fileReader.result)\n }\n fileReader.readAsDataURL(file)\n }, [file])\n\n const pickedHandler = (event) => {\n const pickedFile = event.target.files[0]\n let fileIsValid = isValid\n // console.log('ETF', event.target.files[0].name);\n setFileName(event.target.files[0].name)\n setFileSize(event.target.files[0].size)\n setFileDate(event.target.files[0].lastModifiedDate.toString())\n const str = event.target.files[0].name.split('.')[1]\n // console.log('STR', str);\n setFileType(str)\n if (event.target.files && event.target.files.length === 1) {\n const pickedFile = event.target.files[0]\n setFile(pickedFile)\n setIsValid(true)\n } else {\n setIsValid(false)\n fileIsValid = false\n }\n onInput(id, pickedFile, fileIsValid)\n }\n\n const pickFileHandler = () => {\n filePickerRef.current.click()\n if (file && file !== previewUrl) {\n reset()\n }\n }\n\n const formatBytes = (bytes, decimals = 2) => {\n if (bytes === 0) return '0 Bytes'\n\n const k = 1024\n const dm = decimals < 0 ? 0 : decimals\n const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']\n\n const i = Math.floor(Math.log(bytes) / Math.log(k))\n\n return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]\n }\n\n const reset = () => {\n const fileReader = new window.FileReader()\n fileReader.onload = () => {\n setPreviewUrl(fileReader.result)\n }\n fileReader.readAsDataURL(file)\n }\n\n return (\n <Card className={classes.previewCard} variant='outlined'>\n <CardContent>\n <div className={classes.formControl}>\n <input\n id={id}\n ref={filePickerRef}\n style={{ display: 'none' }}\n type='file'\n accept={accept}\n onChange={pickedHandler}\n />\n\n <div className={classes.imageUpload}>\n {!previewUrl && (\n <div className={classes.action}>\n <div className={classes.action}>\n <FluentButton\n type='button'\n variant='contained'\n color='secondary'\n onClick={pickFileHandler}\n >\n Select File\n </FluentButton>\n\n <div className={classes.initialInstruction}>\n <Typography variant='caption'>\n Click 'Select File' to upload a file from your computer\n </Typography>\n </div>\n </div>\n </div>\n )}\n\n {previewUrl && (\n <Fragment>\n <div className={classes.imagePreview}>\n {/* {console.log('PREVIEW URL:', previewUrl)} */}\n <FileType\n fileType={fileType}\n image={previewUrl}\n fileName={fileName}\n size={formatBytes(fileSize)}\n lastModifiedDate={fileDate}\n />\n </div>\n <div className={classes.divider}>\n <Divider />\n </div>\n </Fragment>\n )}\n </div>\n {!isValid && <Typography>{errorText} </Typography>}\n </div>\n </CardContent>\n </Card>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"FileUpload-BCxrOds_.js","names":["useStyles","useStyles","FileProfile","ImagePreview","pickedFile"],"sources":["../src/utilities/uploader/FileProfile.jsx","../src/utilities/uploader/ImagePreview.jsx","../src/utilities/uploader/FileType.jsx","../src/utilities/uploader/FileUpload.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Typography, makeStyles } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n flexDirection: 'row'\n },\n prefix: {\n fontWeight: 600\n },\n title: {\n flex: 1\n },\n detail: {\n marginLeft: theme.spacing(2)\n }\n}))\n\nconst FileProfile = (props) => {\n const classes = useStyles()\n const { children, fileName, fileType, size, lastModifiedDate } = props\n return (\n <Fragment>\n <div className={classes.root}>\n <Typography variant='body1' className={classes.title}>\n <strong>{fileName}</strong>\n </Typography>\n <Typography variant='caption' className={classes.detail}>\n <span className={classes.prefix}>Type:</span> {fileType}\n </Typography>\n <Typography variant='caption' className={classes.detail}>\n <span className={classes.prefix}>Size:</span> {size}\n </Typography>\n </div>\n {children}\n <Typography variant='caption'>\n <span className={classes.prefix}>Last Modified:</span>{' '}\n {lastModifiedDate}\n </Typography>\n </Fragment>\n )\n}\nexport default FileProfile\n","import React from 'react';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex',\n justifyContent: 'center',\n },\n image: {\n maxWidth: 465,\n },\n}));\n\nconst ImagePreview = props => {\n const { image } = props;\n const classes = useStyles();\n\n return (\n <div className={classes.root}>\n <img className={classes.image} src={image} alt=\"upload preview\" />\n </div>\n );\n};\nexport default ImagePreview;\n","import React from 'react';\nimport FileProfile from './FileProfile';\nimport ImagePreview from './ImagePreview';\n\nexport const FileType = props => {\n let type = '';\n const { fileType, image, fileName, size, lastModifiedDate } = props;\n\n switch (fileType) {\n case 'pdf':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n />\n );\n break;\n case 'doc':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n />\n );\n break;\n case 'png':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n >\n <ImagePreview image={image} />\n </FileProfile>\n );\n break;\n case 'jpg':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n >\n <ImagePreview image={image} />\n </FileProfile>\n );\n break;\n case 'jpeg':\n type = (\n <FileProfile\n fileType={fileType}\n fileName={fileName}\n size={size}\n lastModifiedDate={lastModifiedDate}\n >\n <ImagePreview image={image} />\n </FileProfile>\n );\n break;\n\n default:\n }\n\n return type;\n};\n","import React, { useRef, useState, useEffect, Fragment } from 'react'\nimport {\n makeStyles,\n Typography,\n Card,\n CardContent,\n Divider\n} from '@material-ui/core'\nimport { FileType } from './FileType'\nimport { FluentButton } from '../../UI/inputs/buttons/FluentButton'\n\nconst useStyles = makeStyles((theme) => ({\n avatarImage: {\n width: 200,\n height: 200,\n borderRadius: 100,\n border: '3px solid',\n borderColor: theme.palette.primary.main,\n marginTop: -3,\n marginLeft: -3\n },\n image: {\n width: 300,\n height: '100%',\n border: '2px solid',\n borderColor: theme.palette.primary.main,\n marginTop: -3,\n marginLeft: -3\n },\n instruction: {\n display: 'flex',\n alignContent: 'center',\n justifyContent: 'center'\n },\n icon: {\n display: 'flex',\n justifyContent: 'center'\n },\n avatarIcon: {\n display: 'flex',\n justifyContent: 'center',\n marginTop: '35%'\n },\n previewCard: {\n maxWidth: 500\n },\n action: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n display: 'flex',\n flexDirection: 'row'\n },\n divider: {\n marginTop: theme.spacing(1)\n },\n initialInstruction: {\n marginLeft: theme.spacing(2),\n marginTop: theme.spacing(0.5)\n }\n}))\n\nexport const FileUpload = (props) => {\n const [file, setFile] = useState()\n const [previewUrl, setPreviewUrl] = useState()\n const [isValid, setIsValid] = useState(false)\n const [fileType, setFileType] = useState()\n const [fileName, setFileName] = useState()\n const [fileSize, setFileSize] = useState()\n const [fileDate, setFileDate] = useState()\n const { id, onInput, accept, errorText } = props\n const classes = useStyles()\n\n const filePickerRef = useRef()\n useEffect(() => {\n if (!file) {\n return\n }\n const fileReader = new window.FileReader()\n fileReader.onload = () => {\n setPreviewUrl(fileReader.result)\n }\n fileReader.readAsDataURL(file)\n }, [file])\n\n const pickedHandler = (event) => {\n const pickedFile = event.target.files[0]\n let fileIsValid = isValid\n // console.log('ETF', event.target.files[0].name);\n setFileName(event.target.files[0].name)\n setFileSize(event.target.files[0].size)\n setFileDate(event.target.files[0].lastModifiedDate.toString())\n const str = event.target.files[0].name.split('.')[1]\n // console.log('STR', str);\n setFileType(str)\n if (event.target.files && event.target.files.length === 1) {\n const pickedFile = event.target.files[0]\n setFile(pickedFile)\n setIsValid(true)\n } else {\n setIsValid(false)\n fileIsValid = false\n }\n onInput(id, pickedFile, fileIsValid)\n }\n\n const pickFileHandler = () => {\n filePickerRef.current.click()\n if (file && file !== previewUrl) {\n reset()\n }\n }\n\n const formatBytes = (bytes, decimals = 2) => {\n if (bytes === 0) return '0 Bytes'\n\n const k = 1024\n const dm = decimals < 0 ? 0 : decimals\n const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']\n\n const i = Math.floor(Math.log(bytes) / Math.log(k))\n\n return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]\n }\n\n const reset = () => {\n const fileReader = new window.FileReader()\n fileReader.onload = () => {\n setPreviewUrl(fileReader.result)\n }\n fileReader.readAsDataURL(file)\n }\n\n return (\n <Card className={classes.previewCard} variant='outlined'>\n <CardContent>\n <div className={classes.formControl}>\n <input\n id={id}\n ref={filePickerRef}\n style={{ display: 'none' }}\n type='file'\n accept={accept}\n onChange={pickedHandler}\n />\n\n <div className={classes.imageUpload}>\n {!previewUrl && (\n <div className={classes.action}>\n <div className={classes.action}>\n <FluentButton\n type='button'\n variant='contained'\n color='secondary'\n onClick={pickFileHandler}\n >\n Select File\n </FluentButton>\n\n <div className={classes.initialInstruction}>\n <Typography variant='caption'>\n Click 'Select File' to upload a file from your computer\n </Typography>\n </div>\n </div>\n </div>\n )}\n\n {previewUrl && (\n <Fragment>\n <div className={classes.imagePreview}>\n {/* {console.log('PREVIEW URL:', previewUrl)} */}\n <FileType\n fileType={fileType}\n image={previewUrl}\n fileName={fileName}\n size={formatBytes(fileSize)}\n lastModifiedDate={fileDate}\n />\n </div>\n <div className={classes.divider}>\n <Divider />\n </div>\n </Fragment>\n )}\n </div>\n {!isValid && <Typography>{errorText} </Typography>}\n </div>\n </CardContent>\n </Card>\n )\n}\n"],"mappings":"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"}

package/dist/{FluentCardHeader-CRJaqkV3.js → FluentCardHeader-BdMB2qzK.js} RENAMED Viewed

@@ -26,4 +26,4 @@ FluentCardHeader.displayName = "FluentCardHeader";
 //#endregion
 export { FluentCardHeader as t };
-//# sourceMappingURL=FluentCardHeader-CRJaqkV3.js.map
+//# sourceMappingURL=FluentCardHeader-BdMB2qzK.js.map

package/dist/{FluentCardHeader-CRJaqkV3.js.map → FluentCardHeader-BdMB2qzK.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentCardHeader-~~CRJaqkV3~~.js","names":[],"sources":["../src/UI/surfaces/cards/fluentCards/FluentCardHeader.jsx"],"sourcesContent":["import React from 'react';\nimport { forwardRef } from 'react';\nimport { makeStyles, CardHeader } from '@material-ui/core';\n\nconst useStyles = makeStyles(\n {\n root: {},\n avatar: {},\n action: {},\n content: {},\n title: {},\n subheader: {},\n },\n { name: 'FluentCardHeader' }\n);\n\n/*\n A variant of <CardHeader> that uses a Fluent UI card style\n */\nexport const FluentCardHeader = forwardRef((props, ref) => {\n const classes = useStyles(props);\n const { children, ...other } = props;\n\n return (\n <CardHeader ref={ref} {...other} classes={classes}>\n {children}\n </CardHeader>\n );\n});\nFluentCardHeader.displayName = 'FluentCardHeader';\n"],"mappings":";;;;AAIA,MAAM,YAAY,WAChB;CACE,MAAM,EAAE;CACR,QAAQ,EAAE;CACV,QAAQ,EAAE;CACV,SAAS,EAAE;CACX,OAAO,EAAE;CACT,WAAW,EAAE;CACd,EACD,EAAE,MAAM,oBAAoB,CAC7B;;;;AAKD,MAAa,mBAAmB,YAAY,OAAO,QAAQ;CACzD,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,UAAU,GAAG,UAAU;AAE/B,QACE,oCAAC;EAAgB;EAAK,GAAI;EAAgB;IACvC,SACU;EAEf;AACF,iBAAiB,cAAc"}
1	+ {"version":3,"file":"FluentCardHeader-BdMB2qzK.js","names":[],"sources":["../src/UI/surfaces/cards/fluentCards/FluentCardHeader.jsx"],"sourcesContent":["import React from 'react';\nimport { forwardRef } from 'react';\nimport { makeStyles, CardHeader } from '@material-ui/core';\n\nconst useStyles = makeStyles(\n {\n root: {},\n avatar: {},\n action: {},\n content: {},\n title: {},\n subheader: {},\n },\n { name: 'FluentCardHeader' }\n);\n\n/*\n A variant of <CardHeader> that uses a Fluent UI card style\n */\nexport const FluentCardHeader = forwardRef((props, ref) => {\n const classes = useStyles(props);\n const { children, ...other } = props;\n\n return (\n <CardHeader ref={ref} {...other} classes={classes}>\n {children}\n </CardHeader>\n );\n});\nFluentCardHeader.displayName = 'FluentCardHeader';\n"],"mappings":";;;;AAIA,MAAM,YAAY,WAChB;CACE,MAAM,EAAE;CACR,QAAQ,EAAE;CACV,QAAQ,EAAE;CACV,SAAS,EAAE;CACX,OAAO,EAAE;CACT,WAAW,EAAE;CACd,EACD,EAAE,MAAM,oBAAoB,CAC7B;;;;AAKD,MAAa,mBAAmB,YAAY,OAAO,QAAQ;CACzD,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,UAAU,GAAG,UAAU;AAE/B,QACE,oCAAC;EAAgB;EAAK,GAAI;EAAgB;IACvC,SACU;EAEf;AACF,iBAAiB,cAAc"}

package/dist/{FluentCell-C1d53Ct2.js → FluentCell-D2lpxw4O.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { t as UnityFluentIcon } from "./UnityFluentIcon-DrASIcTF.js";
-import { S as getIconFromName } from "./TreeUtilities-kiPupulY.js";
+import { S as getIconFromName } from "./TreeUtilities-VCy2z4Qv.js";
 import { t as StatusChip } from "./StatusChip-DZAN88VU.js";
 import React from "react";
 import { Box, TableCell, Tooltip, makeStyles, useTheme } from "@material-ui/core";
@@ -78,4 +78,4 @@ var FluentCell_default = FluentCell;
 //#endregion
 export { FluentCell_default as t };
-//# sourceMappingURL=FluentCell-C1d53Ct2.js.map
+//# sourceMappingURL=FluentCell-D2lpxw4O.js.map

package/dist/{FluentCell-C1d53Ct2.js.map → FluentCell-D2lpxw4O.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentCell-~~C1d53Ct2~~.js","names":[],"sources":["../src/UI/dataDisplay/FluentDataTable/FluentCell/index.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Box, makeStyles, TableCell, Theme, useTheme, Tooltip } from '@material-ui/core';\nimport { format } from 'date-fns';\nimport { UnityFluentIcon } from '../../../../utilities/iconLibrary/UnityFluentIcon';\nimport { getIconFromName } from '../../../../utilities/tree/TreeUtilities';\nimport { StatusChip } from '../../status/StatusChip';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles<Theme, FluentCellProps>((theme) => ({\n labelText: {\n color: theme.palette.text.primary,\n fontSize: '12px'\n },\n tableCell: {\n fontSize: '12px',\n letterSpacing: '0.4px',\n fontWeight: (props) => (props?.bold ? 500 : 400)\n },\n unityIconWrapper: {\n gap: theme.spacing(1)\n }\n}));\n\n/* #region CellUnityIcon /\n\ninterface CellUnityIconProps extends FluentCellProps {\n icon: string;\n size: string;\n color: string;\n align?: 'inherit' \| 'left' \| 'center' \| 'right' \| 'justify';\n className?: string;\n}\n\nconst CellUnityIcon = (props: Partial<CellUnityIconProps>) => {\n const theme = useTheme();\n const {\n icon = '',\n size = 'large',\n color = theme.palette.primary.main,\n children\n } = props;\n const classes = useStyles(props as FluentCellProps);\n\n return (\n <FluentCell {...props}>\n { / @ts-ignore / }\n <Box display='flex' alignItems='center' className={classes.unityIconWrapper}>\n <UnityFluentIcon\n size={size}\n color={color}\n icon={getIconFromName(icon)}\n />\n {children && children}\n </Box>\n </FluentCell>\n );\n};\n\n/ #endregion /\n\n/ #region CellIcon /\n\ninterface CellImageProps extends FluentCellProps {\n src: string;\n alt: string;\n title: string;\n style?: object;\n children: any;\n}\n\nconst CellImage = (props: CellImageProps) => (\n <FluentCell {...props}>\n <img src={props?.src} alt={props?.alt} style={props?.style} />\n {props?.title}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellIcon /\n\ninterface CellIconProps extends FluentCellProps {\n icon: any;\n label: string;\n style?: object;\n}\n\nconst CellIcon = (props: Partial<CellIconProps>) => (\n <FluentCell {...props}>\n <>\n {props?.label ? (\n // @ts-ignore\n <Box display='flex' alignItems='center' style={{ gap: '8px' }}>\n { / @ts-ignore / }\n <Box>{props?.icon}</Box>\n {props?.label}\n </Box>\n ) : (\n props?.icon\n )}\n {props?.children}\n </>\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellNumber /\n\ninterface CellNumberProps extends FluentCellProps {\n decimals?: number \| string;\n children: any;\n}\n\nconst CellNumber = (props: CellNumberProps) => (\n <FluentCell {...props}>\n {Number(props?.children).toFixed(Number(props?.decimals ?? 2))}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellDate /\n\ninterface CellDateProps extends FluentCellProps {\n format?: string;\n children: any;\n}\n\nconst CellDate = (props: CellDateProps) => (\n <FluentCell {...props}>\n {format(new Date(props?.children), props?.format \|\| 'MM/dd/yyyy')}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellCurrency /\n\ninterface CellCurrencyProps extends FluentCellProps {\n currencySymbol?: string;\n children: any;\n}\n\nconst CellCurrency = (props: CellCurrencyProps) => (\n <FluentCell {...props}>\n {props?.currencySymbol \|\| '$'}\n {props?.children}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellText /\n\ninterface CellTextProps extends FluentCellProps {\n children: any;\n}\n\nconst CellText = (props: CellTextProps) => (\n <FluentCell {...props}>{props.children}</FluentCell>\n);\n\n/ #endregion /\n\n/ #region Chip /\n\ninterface CellChipProps extends FluentCellProps {\n status?: string;\n size?: string;\n children: any;\n}\n\nconst CellChip = (props: CellChipProps) => (\n <FluentCell {...props}>\n {/ @ts-ignore /}\n <StatusChip\n status={props?.status \|\| 'success'}\n label={props?.children}\n />\n </FluentCell>\n);\n/ #endregion */\n\ninterface FluentCellProps {\n scope?: string;\n bold?: boolean;\n style?: object;\n align?: 'inherit' \| 'left' \| 'center' \| 'right' \| 'justify';\n children?: ReactNode;\n className?: string;\n colSpan?: number;\n tooltip?: string;\n}\n\nconst FluentCell = (props: FluentCellProps) => {\n const classes = useStyles(props);\n const { scope = 'row', style, align, colSpan, className, tooltip, children } = props;\n\n const cellContent = children;\n\n return (\n <TableCell\n scope={scope}\n className={clsx(classes.tableCell, className)}\n style={style}\n align={align}\n colSpan={colSpan}\n >\n {tooltip ? (\n <Tooltip title={tooltip \|\| ''} children={<span>{cellContent \|\| ''}</span>} />\n ) : (\n cellContent\n )}\n </TableCell>\n );\n};\n\nFluentCell.UnityIcon = CellUnityIcon;\nFluentCell.Icon = CellIcon;\nFluentCell.Number = CellNumber;\nFluentCell.Text = CellText;\nFluentCell.Currency = CellCurrency;\nFluentCell.Date = CellDate;\nFluentCell.Chip = CellChip;\nFluentCell.Image = CellImage;\n\nexport default FluentCell;\n"],"mappings":";;;;;;;;;AAQA,MAAM,YAAY,YAAoC,WAAW;CAC/D,WAAW;EACT,OAAO,MAAM,QAAQ,KAAK;EAC1B,UAAU;EACX;CACD,WAAW;EACT,UAAU;EACV,eAAe;EACf,aAAa,UAAW,OAAO,OAAO,MAAM;EAC7C;CACD,kBAAkB,EAChB,KAAK,MAAM,QAAQ,EAAE,EACtB;CACF,EAAE;AAYH,MAAM,iBAAiB,UAAuC;CAC5D,MAAM,QAAQ,UAAU;CACxB,MAAM,EACJ,OAAO,IACP,OAAO,SACP,QAAQ,MAAM,QAAQ,QAAQ,MAC9B,aACE;CACJ,MAAM,UAAU,UAAU,MAAyB;AAEnD,QACE,oCAAC,YAAe,OAEd,oCAAC;EAAI,SAAQ;EAAO,YAAW;EAAS,WAAW,QAAQ;IACzD,oCAAC;EACO;EACC;EACP,MAAM,gBAAgB,KAAK;GAC3B,EACD,YAAY,SACT,CACK;;AAgBjB,MAAM,aAAa,UACjB,oCAAC,YAAe,OACd,oCAAC;CAAI,KAAK,OAAO;CAAK,KAAK,OAAO;CAAK,OAAO,OAAO;EAAS,EAC7D,OAAO,MACG;AAaf,MAAM,YAAY,UAChB,oCAAC,YAAe,OACd,0DACG,OAAO,QAEN,oCAAC;CAAI,SAAQ;CAAO,YAAW;CAAS,OAAO,EAAE,KAAK,OAAO;GAE3D,oCAAC,WAAK,OAAO,KAAW,EACvB,OAAO,MACJ,GAEN,OAAO,MAER,OAAO,SACP,CACQ;AAYf,MAAM,cAAc,UAClB,oCAAC,YAAe,OACb,OAAO,OAAO,SAAS,CAAC,QAAQ,OAAO,OAAO,YAAY,EAAE,CAAC,CACnD;AAYf,MAAM,YAAY,UAChB,oCAAC,YAAe,OACb,OAAO,IAAI,KAAK,OAAO,SAAS,EAAE,OAAO,UAAU,aAAa,CACtD;AAYf,MAAM,gBAAgB,UACpB,oCAAC,YAAe,OACb,OAAO,kBAAkB,KACzB,OAAO,SACG;AAWf,MAAM,YAAY,UAChB,oCAAC,YAAe,OAAQ,MAAM,SAAsB;AAatD,MAAM,YAAY,UAChB,oCAAC,YAAe,OAEd,oCAAC;CACC,QAAQ,OAAO,UAAU;CACzB,OAAO,OAAO;EACd,CACS;AAef,MAAM,cAAc,UAA2B;CAC7C,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,QAAQ,OAAO,OAAO,OAAO,SAAS,WAAW,SAAS,aAAa;CAE/E,MAAM,cAAc;AAEpB,QACE,oCAAC;EACQ;EACP,WAAW,KAAK,QAAQ,WAAW,UAAU;EACtC;EACA;EACE;IAER,UACC,oCAAC;EAAQ,OAAO,WAAW;EAAI,UAAU,oCAAC,cAAM,eAAe,GAAU;GAAI,GAE7E,YAEQ;;AAIhB,WAAW,YAAY;AACvB,WAAW,OAAO;AAClB,WAAW,SAAS;AACpB,WAAW,OAAO;AAClB,WAAW,WAAW;AACtB,WAAW,OAAO;AAClB,WAAW,OAAO;AAClB,WAAW,QAAQ;AAEnB,yBAAe"}
1	+ {"version":3,"file":"FluentCell-D2lpxw4O.js","names":[],"sources":["../src/UI/dataDisplay/FluentDataTable/FluentCell/index.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Box, makeStyles, TableCell, Theme, useTheme, Tooltip } from '@material-ui/core';\nimport { format } from 'date-fns';\nimport { UnityFluentIcon } from '../../../../utilities/iconLibrary/UnityFluentIcon';\nimport { getIconFromName } from '../../../../utilities/tree/TreeUtilities';\nimport { StatusChip } from '../../status/StatusChip';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles<Theme, FluentCellProps>((theme) => ({\n labelText: {\n color: theme.palette.text.primary,\n fontSize: '12px'\n },\n tableCell: {\n fontSize: '12px',\n letterSpacing: '0.4px',\n fontWeight: (props) => (props?.bold ? 500 : 400)\n },\n unityIconWrapper: {\n gap: theme.spacing(1)\n }\n}));\n\n/* #region CellUnityIcon /\n\ninterface CellUnityIconProps extends FluentCellProps {\n icon: string;\n size: string;\n color: string;\n align?: 'inherit' \| 'left' \| 'center' \| 'right' \| 'justify';\n className?: string;\n}\n\nconst CellUnityIcon = (props: Partial<CellUnityIconProps>) => {\n const theme = useTheme();\n const {\n icon = '',\n size = 'large',\n color = theme.palette.primary.main,\n children\n } = props;\n const classes = useStyles(props as FluentCellProps);\n\n return (\n <FluentCell {...props}>\n { / @ts-ignore / }\n <Box display='flex' alignItems='center' className={classes.unityIconWrapper}>\n <UnityFluentIcon\n size={size}\n color={color}\n icon={getIconFromName(icon)}\n />\n {children && children}\n </Box>\n </FluentCell>\n );\n};\n\n/ #endregion /\n\n/ #region CellIcon /\n\ninterface CellImageProps extends FluentCellProps {\n src: string;\n alt: string;\n title: string;\n style?: object;\n children: any;\n}\n\nconst CellImage = (props: CellImageProps) => (\n <FluentCell {...props}>\n <img src={props?.src} alt={props?.alt} style={props?.style} />\n {props?.title}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellIcon /\n\ninterface CellIconProps extends FluentCellProps {\n icon: any;\n label: string;\n style?: object;\n}\n\nconst CellIcon = (props: Partial<CellIconProps>) => (\n <FluentCell {...props}>\n <>\n {props?.label ? (\n // @ts-ignore\n <Box display='flex' alignItems='center' style={{ gap: '8px' }}>\n { / @ts-ignore / }\n <Box>{props?.icon}</Box>\n {props?.label}\n </Box>\n ) : (\n props?.icon\n )}\n {props?.children}\n </>\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellNumber /\n\ninterface CellNumberProps extends FluentCellProps {\n decimals?: number \| string;\n children: any;\n}\n\nconst CellNumber = (props: CellNumberProps) => (\n <FluentCell {...props}>\n {Number(props?.children).toFixed(Number(props?.decimals ?? 2))}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellDate /\n\ninterface CellDateProps extends FluentCellProps {\n format?: string;\n children: any;\n}\n\nconst CellDate = (props: CellDateProps) => (\n <FluentCell {...props}>\n {format(new Date(props?.children), props?.format \|\| 'MM/dd/yyyy')}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellCurrency /\n\ninterface CellCurrencyProps extends FluentCellProps {\n currencySymbol?: string;\n children: any;\n}\n\nconst CellCurrency = (props: CellCurrencyProps) => (\n <FluentCell {...props}>\n {props?.currencySymbol \|\| '$'}\n {props?.children}\n </FluentCell>\n);\n\n/ #endregion /\n\n/ #region CellText /\n\ninterface CellTextProps extends FluentCellProps {\n children: any;\n}\n\nconst CellText = (props: CellTextProps) => (\n <FluentCell {...props}>{props.children}</FluentCell>\n);\n\n/ #endregion /\n\n/ #region Chip /\n\ninterface CellChipProps extends FluentCellProps {\n status?: string;\n size?: string;\n children: any;\n}\n\nconst CellChip = (props: CellChipProps) => (\n <FluentCell {...props}>\n {/ @ts-ignore /}\n <StatusChip\n status={props?.status \|\| 'success'}\n label={props?.children}\n />\n </FluentCell>\n);\n/ #endregion */\n\ninterface FluentCellProps {\n scope?: string;\n bold?: boolean;\n style?: object;\n align?: 'inherit' \| 'left' \| 'center' \| 'right' \| 'justify';\n children?: ReactNode;\n className?: string;\n colSpan?: number;\n tooltip?: string;\n}\n\nconst FluentCell = (props: FluentCellProps) => {\n const classes = useStyles(props);\n const { scope = 'row', style, align, colSpan, className, tooltip, children } = props;\n\n const cellContent = children;\n\n return (\n <TableCell\n scope={scope}\n className={clsx(classes.tableCell, className)}\n style={style}\n align={align}\n colSpan={colSpan}\n >\n {tooltip ? (\n <Tooltip title={tooltip \|\| ''} children={<span>{cellContent \|\| ''}</span>} />\n ) : (\n cellContent\n )}\n </TableCell>\n );\n};\n\nFluentCell.UnityIcon = CellUnityIcon;\nFluentCell.Icon = CellIcon;\nFluentCell.Number = CellNumber;\nFluentCell.Text = CellText;\nFluentCell.Currency = CellCurrency;\nFluentCell.Date = CellDate;\nFluentCell.Chip = CellChip;\nFluentCell.Image = CellImage;\n\nexport default FluentCell;\n"],"mappings":";;;;;;;;;AAQA,MAAM,YAAY,YAAoC,WAAW;CAC/D,WAAW;EACT,OAAO,MAAM,QAAQ,KAAK;EAC1B,UAAU;EACX;CACD,WAAW;EACT,UAAU;EACV,eAAe;EACf,aAAa,UAAW,OAAO,OAAO,MAAM;EAC7C;CACD,kBAAkB,EAChB,KAAK,MAAM,QAAQ,EAAE,EACtB;CACF,EAAE;AAYH,MAAM,iBAAiB,UAAuC;CAC5D,MAAM,QAAQ,UAAU;CACxB,MAAM,EACJ,OAAO,IACP,OAAO,SACP,QAAQ,MAAM,QAAQ,QAAQ,MAC9B,aACE;CACJ,MAAM,UAAU,UAAU,MAAyB;AAEnD,QACE,oCAAC,YAAe,OAEd,oCAAC;EAAI,SAAQ;EAAO,YAAW;EAAS,WAAW,QAAQ;IACzD,oCAAC;EACO;EACC;EACP,MAAM,gBAAgB,KAAK;GAC3B,EACD,YAAY,SACT,CACK;;AAgBjB,MAAM,aAAa,UACjB,oCAAC,YAAe,OACd,oCAAC;CAAI,KAAK,OAAO;CAAK,KAAK,OAAO;CAAK,OAAO,OAAO;EAAS,EAC7D,OAAO,MACG;AAaf,MAAM,YAAY,UAChB,oCAAC,YAAe,OACd,0DACG,OAAO,QAEN,oCAAC;CAAI,SAAQ;CAAO,YAAW;CAAS,OAAO,EAAE,KAAK,OAAO;GAE3D,oCAAC,WAAK,OAAO,KAAW,EACvB,OAAO,MACJ,GAEN,OAAO,MAER,OAAO,SACP,CACQ;AAYf,MAAM,cAAc,UAClB,oCAAC,YAAe,OACb,OAAO,OAAO,SAAS,CAAC,QAAQ,OAAO,OAAO,YAAY,EAAE,CAAC,CACnD;AAYf,MAAM,YAAY,UAChB,oCAAC,YAAe,OACb,OAAO,IAAI,KAAK,OAAO,SAAS,EAAE,OAAO,UAAU,aAAa,CACtD;AAYf,MAAM,gBAAgB,UACpB,oCAAC,YAAe,OACb,OAAO,kBAAkB,KACzB,OAAO,SACG;AAWf,MAAM,YAAY,UAChB,oCAAC,YAAe,OAAQ,MAAM,SAAsB;AAatD,MAAM,YAAY,UAChB,oCAAC,YAAe,OAEd,oCAAC;CACC,QAAQ,OAAO,UAAU;CACzB,OAAO,OAAO;EACd,CACS;AAef,MAAM,cAAc,UAA2B;CAC7C,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,QAAQ,OAAO,OAAO,OAAO,SAAS,WAAW,SAAS,aAAa;CAE/E,MAAM,cAAc;AAEpB,QACE,oCAAC;EACQ;EACP,WAAW,KAAK,QAAQ,WAAW,UAAU;EACtC;EACA;EACE;IAER,UACC,oCAAC;EAAQ,OAAO,WAAW;EAAI,UAAU,oCAAC,cAAM,eAAe,GAAU;GAAI,GAE7E,YAEQ;;AAIhB,WAAW,YAAY;AACvB,WAAW,OAAO;AAClB,WAAW,SAAS;AACpB,WAAW,OAAO;AAClB,WAAW,WAAW;AACtB,WAAW,OAAO;AAClB,WAAW,OAAO;AAClB,WAAW,QAAQ;AAEnB,yBAAe"}

package/dist/{FluentDataTable-C1rFIP0M.js → FluentDataTable-ChpZUwal.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { t as FluentBody_default } from "./FluentBody-CBqwLzTG.js";
-import { t as FluentCell_default } from "./FluentCell-C1d53Ct2.js";
+import { t as FluentCell_default } from "./FluentCell-D2lpxw4O.js";
 import { t as FluentHead_default } from "./FluentHead-C1bs_iJK.js";
 import { t as FluentRow_default } from "./FluentRow-C_YJYbQ5.js";
 import React from "react";
@@ -27,4 +27,4 @@ FluentDataTable.FluentRow = FluentRow_default;
 //#endregion
 export { FluentDataTable as t };
-//# sourceMappingURL=FluentDataTable-C1rFIP0M.js.map
+//# sourceMappingURL=FluentDataTable-ChpZUwal.js.map

package/dist/{FluentDataTable-C1rFIP0M.js.map → FluentDataTable-ChpZUwal.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentDataTable-~~C1rFIP0M~~.js","names":["FluentHead","FluentBody","FluentCell","FluentRow"],"sources":["../src/UI/dataDisplay/FluentDataTable/FluentDataTable.tsx"],"sourcesContent":["import { Size, Table, TableContainer, makeStyles } from '@material-ui/core';\nimport React, { ReactElement, ReactNode } from 'react';\nimport FluentBody from './FluentBody';\nimport FluentCell from './FluentCell';\nimport FluentHead from './FluentHead';\nimport FluentRow from './FluentRow';\n\ninterface FluentDataTableProps {\n style?: object;\n size?: Size \| undefined;\n children: ReactNode;\n stickyHeader?: boolean;\n containerMaxHeight?: string \| number;\n}\n\ntype FluentDataTableComponent = React.FC<FluentDataTableProps> & {\n FluentHead: typeof FluentHead;\n FluentBody: typeof FluentBody;\n FluentCell: typeof FluentCell;\n FluentRow: typeof FluentRow;\n};\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n maxHeight: (props: any) => props?.containerMaxHeight\n }\n}));\n\nexport const FluentDataTable = ((props: FluentDataTableProps): ReactElement => {\n const { size = 'small', style, stickyHeader = false, containerMaxHeight } = props;\n const classes = useStyles({ containerMaxHeight });\n return (\n <TableContainer\n style={{ maxHeight: containerMaxHeight, height: '100%'}}\n >\n <Table\n aria-label='simple table'\n size={size}\n style={style}\n stickyHeader={stickyHeader}\n >\n {props?.children}\n </Table>\n </TableContainer>\n );\n}) as FluentDataTableComponent;\n\nFluentDataTable.FluentHead = FluentHead;\nFluentDataTable.FluentBody = FluentBody;\nFluentDataTable.FluentCell = FluentCell;\nFluentDataTable.FluentRow = FluentRow;\n"],"mappings":";;;;;;;;AAsBA,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EACJ,YAAY,UAAe,OAAO,oBACnC,EACF,EAAE;AAEH,MAAa,oBAAoB,UAA8C;CAC7E,MAAM,EAAE,OAAO,SAAS,OAAO,eAAe,OAAO,uBAAuB;AAC5D,WAAU,EAAE,oBAAoB,CAAC;AACjD,QACE,oCAAC,kBACC,OAAO;EAAE,WAAW;EAAoB,QAAQ;EAAO,IAEvD,oCAAC;EACC,cAAW;EACL;EACC;EACO;IAEb,OAAO,SACF,CACO;;AAIrB,gBAAgB,aAAaA;AAC7B,gBAAgB,aAAaC;AAC7B,gBAAgB,aAAaC;AAC7B,gBAAgB,YAAYC"}
1	+ {"version":3,"file":"FluentDataTable-ChpZUwal.js","names":["FluentHead","FluentBody","FluentCell","FluentRow"],"sources":["../src/UI/dataDisplay/FluentDataTable/FluentDataTable.tsx"],"sourcesContent":["import { Size, Table, TableContainer, makeStyles } from '@material-ui/core';\nimport React, { ReactElement, ReactNode } from 'react';\nimport FluentBody from './FluentBody';\nimport FluentCell from './FluentCell';\nimport FluentHead from './FluentHead';\nimport FluentRow from './FluentRow';\n\ninterface FluentDataTableProps {\n style?: object;\n size?: Size \| undefined;\n children: ReactNode;\n stickyHeader?: boolean;\n containerMaxHeight?: string \| number;\n}\n\ntype FluentDataTableComponent = React.FC<FluentDataTableProps> & {\n FluentHead: typeof FluentHead;\n FluentBody: typeof FluentBody;\n FluentCell: typeof FluentCell;\n FluentRow: typeof FluentRow;\n};\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n maxHeight: (props: any) => props?.containerMaxHeight\n }\n}));\n\nexport const FluentDataTable = ((props: FluentDataTableProps): ReactElement => {\n const { size = 'small', style, stickyHeader = false, containerMaxHeight } = props;\n const classes = useStyles({ containerMaxHeight });\n return (\n <TableContainer\n style={{ maxHeight: containerMaxHeight, height: '100%'}}\n >\n <Table\n aria-label='simple table'\n size={size}\n style={style}\n stickyHeader={stickyHeader}\n >\n {props?.children}\n </Table>\n </TableContainer>\n );\n}) as FluentDataTableComponent;\n\nFluentDataTable.FluentHead = FluentHead;\nFluentDataTable.FluentBody = FluentBody;\nFluentDataTable.FluentCell = FluentCell;\nFluentDataTable.FluentRow = FluentRow;\n"],"mappings":";;;;;;;;AAsBA,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EACJ,YAAY,UAAe,OAAO,oBACnC,EACF,EAAE;AAEH,MAAa,oBAAoB,UAA8C;CAC7E,MAAM,EAAE,OAAO,SAAS,OAAO,eAAe,OAAO,uBAAuB;AAC5D,WAAU,EAAE,oBAAoB,CAAC;AACjD,QACE,oCAAC,kBACC,OAAO;EAAE,WAAW;EAAoB,QAAQ;EAAO,IAEvD,oCAAC;EACC,cAAW;EACL;EACC;EACO;IAEb,OAAO,SACF,CACO;;AAIrB,gBAAgB,aAAaA;AAC7B,gBAAgB,aAAaC;AAC7B,gBAAgB,aAAaC;AAC7B,gBAAgB,YAAYC"}

package/dist/{FluentLink-D-gKioCQ.js → FluentLink-DP2eDAH2.js} RENAMED Viewed

@@ -36,4 +36,4 @@ const FluentLink = (props) => {
 //#endregion
 export { FluentLink as t };
-//# sourceMappingURL=FluentLink-D-gKioCQ.js.map
+//# sourceMappingURL=FluentLink-DP2eDAH2.js.map

package/dist/{FluentLink-D-gKioCQ.js.map → FluentLink-DP2eDAH2.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentLink-~~D-gKioCQ~~.js","names":["Link","MuiLink"],"sources":["../src/UI/inputs/link/FluentLink.jsx"],"sourcesContent":["import React from 'react'\nimport { Link } from 'react-router-dom'\nimport {\n Typography,\n Link as MuiLink,\n makeStyles,\n useTheme\n} from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n textDecoration: 'none',\n '& > * + *': {\n marginLeft: theme.spacing(2)\n }\n },\n link: {\n textDecoration: 'none',\n fontWeight: 700\n }\n}))\n\nexport const FluentLink = (props) => {\n const {\n icon,\n alt,\n label,\n children,\n activeClassName,\n to,\n linkColor,\n ...otherProps\n } = props\n const theme = useTheme()\n const classes = useStyles()\n\n return to && to.substring(0, 4) !== 'http' ? (\n <Link\n to={to}\n activeClassName={activeClassName}\n className={classes.link}\n style={{\n color:\n linkColor === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main\n }}\n >\n {children}\n </Link>\n ) : (\n <Typography component='div' className={classes.root}>\n <MuiLink\n {...otherProps}\n href={to}\n color={linkColor}\n variant='body1'\n style={{ textDecoration: 'none' }}\n >\n {children}\n </MuiLink>\n </Typography>\n )\n}\n"],"mappings":";;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,gBAAgB;EAChB,aAAa,EACX,YAAY,MAAM,QAAQ,EAAE,EAC7B;EACF;CACD,MAAM;EACJ,gBAAgB;EAChB,YAAY;EACb;CACF,EAAE;AAEH,MAAa,cAAc,UAAU;CACnC,MAAM,EACJ,MACA,KACA,OACA,UACA,iBACA,IACA,WACA,GAAG,eACD;CACJ,MAAM,QAAQ,UAAU;CACxB,MAAM,UAAU,WAAW;AAE3B,QAAO,MAAM,GAAG,UAAU,GAAG,EAAE,KAAK,SAClC,oCAACA;EACK;EACa;EACjB,WAAW,QAAQ;EACnB,OAAO,EACL,OACE,cAAc,YACV,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,MAC/B;IAEA,SACI,GAEP,oCAAC;EAAW,WAAU;EAAM,WAAW,QAAQ;IAC7C,oCAACC;EACC,GAAI;EACJ,MAAM;EACN,OAAO;EACP,SAAQ;EACR,OAAO,EAAE,gBAAgB,QAAQ;IAEhC,SACO,CACC"}
1	+ {"version":3,"file":"FluentLink-DP2eDAH2.js","names":["Link","MuiLink"],"sources":["../src/UI/inputs/link/FluentLink.jsx"],"sourcesContent":["import React from 'react'\nimport { Link } from 'react-router-dom'\nimport {\n Typography,\n Link as MuiLink,\n makeStyles,\n useTheme\n} from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n textDecoration: 'none',\n '& > * + *': {\n marginLeft: theme.spacing(2)\n }\n },\n link: {\n textDecoration: 'none',\n fontWeight: 700\n }\n}))\n\nexport const FluentLink = (props) => {\n const {\n icon,\n alt,\n label,\n children,\n activeClassName,\n to,\n linkColor,\n ...otherProps\n } = props\n const theme = useTheme()\n const classes = useStyles()\n\n return to && to.substring(0, 4) !== 'http' ? (\n <Link\n to={to}\n activeClassName={activeClassName}\n className={classes.link}\n style={{\n color:\n linkColor === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main\n }}\n >\n {children}\n </Link>\n ) : (\n <Typography component='div' className={classes.root}>\n <MuiLink\n {...otherProps}\n href={to}\n color={linkColor}\n variant='body1'\n style={{ textDecoration: 'none' }}\n >\n {children}\n </MuiLink>\n </Typography>\n )\n}\n"],"mappings":";;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,gBAAgB;EAChB,aAAa,EACX,YAAY,MAAM,QAAQ,EAAE,EAC7B;EACF;CACD,MAAM;EACJ,gBAAgB;EAChB,YAAY;EACb;CACF,EAAE;AAEH,MAAa,cAAc,UAAU;CACnC,MAAM,EACJ,MACA,KACA,OACA,UACA,iBACA,IACA,WACA,GAAG,eACD;CACJ,MAAM,QAAQ,UAAU;CACxB,MAAM,UAAU,WAAW;AAE3B,QAAO,MAAM,GAAG,UAAU,GAAG,EAAE,KAAK,SAClC,oCAACA;EACK;EACa;EACjB,WAAW,QAAQ;EACnB,OAAO,EACL,OACE,cAAc,YACV,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,MAC/B;IAEA,SACI,GAEP,oCAAC;EAAW,WAAU;EAAM,WAAW,QAAQ;IAC7C,oCAACC;EACC,GAAI;EACJ,MAAM;EACN,OAAO;EACP,SAAQ;EACR,OAAO,EAAE,gBAAgB,QAAQ;IAEhC,SACO,CACC"}

package/dist/{FluentRadioGroup-Cfldr9dO.js → FluentRadioGroup-CCKelZVk.js} RENAMED Viewed

@@ -28,4 +28,4 @@ const FluentRadioGroup = (props) => {
 //#endregion
 export { FluentRadio as n, FluentRadioGroup as t };
-//# sourceMappingURL=FluentRadioGroup-Cfldr9dO.js.map
+//# sourceMappingURL=FluentRadioGroup-CCKelZVk.js.map

package/dist/{FluentRadioGroup-Cfldr9dO.js.map → FluentRadioGroup-CCKelZVk.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentRadioGroup-~~Cfldr9dO~~.js","names":[],"sources":["../src/UI/inputs/radio/FluentRadio.jsx","../src/UI/inputs/radio/FluentRadioGroup.jsx"],"sourcesContent":["import React from 'react';\nimport { Radio } from '@material-ui/core';\n\nexport const FluentRadio = props => {\n const {\n label,\n value,\n variant = 'outlined',\n color = 'secondary',\n ...otherProps\n } = props;\n\n return (\n <Radio\n id={'udpRecord-radio-' + value}\n updrecordid={'udpRecord-radio-' + value}\n label={label}\n value={value}\n variant={variant}\n color={color}\n {...otherProps}\n />\n );\n};\n","import React from 'react';\nimport { RadioGroup } from '@material-ui/core';\n\nexport const FluentRadioGroup = props => {\n const {\n name,\n value,\n ...otherProps\n } = props;\n\n return (\n <RadioGroup\n name={name}\n value={value}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;AAGA,MAAa,eAAc,UAAS;CAClC,MAAM,EACJ,OACA,OACA,UAAU,YACV,QAAQ,aACR,GAAG,eACD;AAEJ,QACE,oCAAC;EACC,IAAI,qBAAqB;EACzB,aAAa,qBAAqB;EAC3B;EACA;EACE;EACF;EACP,GAAI;GACJ;;;;;AClBN,MAAa,oBAAmB,UAAS;CACvC,MAAM,EACJ,MACA,OACA,GAAG,eACD;AAEJ,QACE,oCAAC;EACO;EACC;EACP,GAAI;GACJ"}
1	+ {"version":3,"file":"FluentRadioGroup-CCKelZVk.js","names":[],"sources":["../src/UI/inputs/radio/FluentRadio.jsx","../src/UI/inputs/radio/FluentRadioGroup.jsx"],"sourcesContent":["import React from 'react';\nimport { Radio } from '@material-ui/core';\n\nexport const FluentRadio = props => {\n const {\n label,\n value,\n variant = 'outlined',\n color = 'secondary',\n ...otherProps\n } = props;\n\n return (\n <Radio\n id={'udpRecord-radio-' + value}\n updrecordid={'udpRecord-radio-' + value}\n label={label}\n value={value}\n variant={variant}\n color={color}\n {...otherProps}\n />\n );\n};\n","import React from 'react';\nimport { RadioGroup } from '@material-ui/core';\n\nexport const FluentRadioGroup = props => {\n const {\n name,\n value,\n ...otherProps\n } = props;\n\n return (\n <RadioGroup\n name={name}\n value={value}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;AAGA,MAAa,eAAc,UAAS;CAClC,MAAM,EACJ,OACA,OACA,UAAU,YACV,QAAQ,aACR,GAAG,eACD;AAEJ,QACE,oCAAC;EACC,IAAI,qBAAqB;EACzB,aAAa,qBAAqB;EAC3B;EACA;EACE;EACF;EACP,GAAI;GACJ;;;;;AClBN,MAAa,oBAAmB,UAAS;CACvC,MAAM,EACJ,MACA,OACA,GAAG,eACD;AAEJ,QACE,oCAAC;EACO;EACC;EACP,GAAI;GACJ"}

package/dist/{FluentSelectMenu-BEREJbe-.js → FluentSelectMenu-yQMFZWEg.js} RENAMED Viewed

@@ -25,4 +25,4 @@ const FluentSelectMenu = ({ data, id, onChange: onChangeProp, width = 300, autoC
 //#endregion
 export { FluentSelectMenu as t };
-//# sourceMappingURL=FluentSelectMenu-BEREJbe-.js.map
+//# sourceMappingURL=FluentSelectMenu-yQMFZWEg.js.map

package/dist/{FluentSelectMenu-BEREJbe-.js.map → FluentSelectMenu-yQMFZWEg.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentSelectMenu-~~BEREJbe-.~~js","names":["option"],"sources":["../src/UI/inputs/menus/FluentSelectMenu.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define /\nimport React, { useCallback } from 'react';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { FluentTextField } from '../textField/FluentTextField';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n '&[class=\"MuiOutlinedInput-root\"][class*=\"MuiOutlinedInput-marginDense\"]':\n {\n padding: '4px 8px'\n }\n }\n}));\n\nexport const FluentSelectMenu = ({\n data,\n id,\n onChange: onChangeProp,\n width = 300,\n // displayProperty = 'label',\n autoCompleteProps,\n displayProperty,\n ...otherProps\n}) => {\n const classes = useStyles();\n // Modified onChange to work inside final-form Field component\n // Also works with a passed in onChange function if not in Field component\n const onChange = useCallback(\n (e, value) => onChangeProp?.(value),\n [onChangeProp]\n );\n\n // return (\n // <Autocomplete\n // classes={{\n // inputRoot: classes.root\n // }}\n // id={id}\n // onChange={onChange}\n // options={data}\n // getOptionLabel={\n // displayProperty\n // ? option[displayProperty]\n // ? option[displayProperty]\n // : ''\n // : option\n // }\n // style={{ width: width }}\n // {...autoCompleteProps}\n // renderInput={(params) => <FluentTextField {...otherProps} {...params} />}\n // />\n // )\n return (\n <Autocomplete\n classes={{\n inputRoot: classes.root\n }}\n id={id}\n onChange={onChange}\n options={data}\n getOptionLabel={(option) =>\n displayProperty\n ? option[displayProperty]\n ? option[displayProperty]\n : ''\n : (option) => option\n }\n style={{ width: width }}\n {...autoCompleteProps}\n renderInput={(params) => (\n <FluentTextField {...otherProps} {...params} />\n )}\n />\n );\n};\n"],"mappings":";;;;;;AAMA,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EACJ,gFACE,EACE,SAAS,WACV,EACJ,EACF,EAAE;AAEH,MAAa,oBAAoB,EAC/B,MACA,IACA,UAAU,cACV,QAAQ,KAER,mBACA,iBACA,GAAG,iBACC;CACJ,MAAM,UAAU,WAAW;CAG3B,MAAM,WAAW,aACd,GAAG,UAAU,eAAe,MAAM,EACnC,CAAC,aAAa,CACf;AAsBD,QACE,oCAAC;EACC,SAAS,EACP,WAAW,QAAQ,MACpB;EACG;EACM;EACV,SAAS;EACT,iBAAiB,WACf,kBACI,OAAO,mBACL,OAAO,mBACP,MACD,aAAWA;EAElB,OAAO,EAAS,OAAO;EACvB,GAAI;EACJ,cAAc,WACZ,oCAAC;GAAgB,GAAI;GAAY,GAAI;IAAU;GAEjD"}
1	+ {"version":3,"file":"FluentSelectMenu-yQMFZWEg.js","names":["option"],"sources":["../src/UI/inputs/menus/FluentSelectMenu.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define /\nimport React, { useCallback } from 'react';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { FluentTextField } from '../textField/FluentTextField';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n '&[class=\"MuiOutlinedInput-root\"][class*=\"MuiOutlinedInput-marginDense\"]':\n {\n padding: '4px 8px'\n }\n }\n}));\n\nexport const FluentSelectMenu = ({\n data,\n id,\n onChange: onChangeProp,\n width = 300,\n // displayProperty = 'label',\n autoCompleteProps,\n displayProperty,\n ...otherProps\n}) => {\n const classes = useStyles();\n // Modified onChange to work inside final-form Field component\n // Also works with a passed in onChange function if not in Field component\n const onChange = useCallback(\n (e, value) => onChangeProp?.(value),\n [onChangeProp]\n );\n\n // return (\n // <Autocomplete\n // classes={{\n // inputRoot: classes.root\n // }}\n // id={id}\n // onChange={onChange}\n // options={data}\n // getOptionLabel={\n // displayProperty\n // ? option[displayProperty]\n // ? option[displayProperty]\n // : ''\n // : option\n // }\n // style={{ width: width }}\n // {...autoCompleteProps}\n // renderInput={(params) => <FluentTextField {...otherProps} {...params} />}\n // />\n // )\n return (\n <Autocomplete\n classes={{\n inputRoot: classes.root\n }}\n id={id}\n onChange={onChange}\n options={data}\n getOptionLabel={(option) =>\n displayProperty\n ? option[displayProperty]\n ? option[displayProperty]\n : ''\n : (option) => option\n }\n style={{ width: width }}\n {...autoCompleteProps}\n renderInput={(params) => (\n <FluentTextField {...otherProps} {...params} />\n )}\n />\n );\n};\n"],"mappings":";;;;;;AAMA,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EACJ,gFACE,EACE,SAAS,WACV,EACJ,EACF,EAAE;AAEH,MAAa,oBAAoB,EAC/B,MACA,IACA,UAAU,cACV,QAAQ,KAER,mBACA,iBACA,GAAG,iBACC;CACJ,MAAM,UAAU,WAAW;CAG3B,MAAM,WAAW,aACd,GAAG,UAAU,eAAe,MAAM,EACnC,CAAC,aAAa,CACf;AAsBD,QACE,oCAAC;EACC,SAAS,EACP,WAAW,QAAQ,MACpB;EACG;EACM;EACV,SAAS;EACT,iBAAiB,WACf,kBACI,OAAO,mBACL,OAAO,mBACP,MACD,aAAWA;EAElB,OAAO,EAAS,OAAO;EACvB,GAAI;EACJ,cAAc,WACZ,oCAAC;GAAgB,GAAI;GAAY,GAAI;IAAU;GAEjD"}

package/dist/{FluentSimpleSelect-Djff-up8.js → FluentSimpleSelect-DxxbQV37.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { t as apiMutate } from "./useAxiosMutate-DeqKSi5z.js";
 import { t as Box$1 } from "./Box-Colr5GEl.js";
-import { t as FluentSelectMenu } from "./FluentSelectMenu-BEREJbe-.js";
+import { t as FluentSelectMenu } from "./FluentSelectMenu-yQMFZWEg.js";
 import React, { Children, forwardRef, useCallback, useEffect, useRef, useState } from "react";
 import { CircularProgress, FormControl, InputBase, NativeSelect, TextField, Typography, makeStyles, withStyles } from "@material-ui/core";
 import Autocomplete from "@material-ui/lab/Autocomplete";
@@ -417,4 +417,4 @@ const FluentSimpleSelect = forwardRef(FluentSimpleSelectComponent);
 //#endregion
 export { FluentSelectGroupMenu as i, FluentScrollLoadAutocompleteMenu as n, SelectGroupMenu as r, FluentSimpleSelect as t };
-//# sourceMappingURL=FluentSimpleSelect-Djff-up8.js.map
+//# sourceMappingURL=FluentSimpleSelect-DxxbQV37.js.map

package/dist/{FluentSimpleSelect-Djff-up8.js.map → FluentSimpleSelect-DxxbQV37.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentSimpleSelect-Djff-up8.js","names":["useStyles","useStyles","useStyles","makeStyles","Box"],"sources":["../src/UI/inputs/menus/FluentSelectDirectoryMenu.jsx","../src/UI/inputs/menus/FluentSelectGroupMenu.jsx","../src/UI/inputs/menus/FluentScrollLoadAutocompleteMenu.jsx","../src/UI/inputs/menus/FluentSimpleSelect.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define /\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n textField: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(1)\n },\n dense: {\n marginTop: theme.spacing(1)\n },\n input: {\n borderRadius: 2,\n height: 32,\n padding: 0,\n marginTop: 3\n },\n formTextInput: {\n fontSize: 14\n },\n labelRoot: {\n fontSize: 14\n }\n}))\n\nexport const FluentSelectGroupMenu = ({\n data,\n placeholder,\n id,\n handleChange\n}) => {\n const classes = useStyles()\n const options =\n data &&\n data.map((option) => {\n const firstLetter = option.label[0].toUpperCase()\n return {\n firstLetter: /[0-9]/.test(firstLetter) ? '0-9' : firstLetter,\n ...option\n }\n })\n\n return (\n <Autocomplete\n id={id}\n onChange={(event, value) => handleChange(value)}\n options={options.sort(\n (a, b) => -b.firstLetter.localeCompare(a.firstLetter)\n )}\n groupBy={(option) => option.firstLetter}\n getOptionLabel={(option) => option.label}\n style={{ width: 300 }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={!params.inputProps.value && placeholder}\n variant='outlined'\n size='small'\n InputLabelProps={{\n shrink: false,\n classes: {\n root: classes.labelRoot,\n focused: classes.labelFocused\n }\n }}\n SelectProps={{\n MenuProps: {\n className: classes.menu\n }\n }}\n />\n )}\n />\n )\n}\n","/ eslint-disable no-use-before-define /\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n textField: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(1)\n },\n dense: {\n marginTop: theme.spacing(1)\n },\n input: {\n borderRadius: 2,\n height: 32,\n padding: 0,\n marginTop: 3\n },\n formTextInput: {\n fontSize: 14\n },\n labelRoot: {\n fontSize: 14\n }\n}))\n\nexport const SelectGroupMenu = ({ data, placeholder, id, handleChange, className }) => {\n const classes = useStyles()\n const options =\n data &&\n data.map((option) => {\n const grouping = option.category\n return {\n grouping,\n ...option\n }\n })\n\n return (\n <Autocomplete\n className={className}\n id={id}\n onChange={(event, value) => handleChange(value)}\n options={options.sort((a, b) => -b.grouping.localeCompare(a.grouping))}\n groupBy={(option) => option.grouping}\n getOptionLabel={(option) => option.label}\n style={{ width: 300 }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={!params.inputProps.value && placeholder}\n variant='outlined'\n size='small'\n InputLabelProps={{\n shrink: false,\n classes: {\n root: classes.labelRoot,\n focused: classes.labelFocused\n }\n }}\n SelectProps={{\n MenuProps: {\n className: classes.menu\n }\n }}\n />\n )}\n />\n )\n}\n","import React, {\n useState,\n useCallback,\n useEffect,\n forwardRef,\n useRef,\n Children,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport { CircularProgress } from '@material-ui/core';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FluentSelectMenu } from './FluentSelectMenu';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useTranslation } from 'react-i18next';\nimport { Box } from '../../Box';\nimport Alert from '@material-ui/lab/Alert';\n\nconst useStyles = makeStyles((theme) => ({\n listbox: {\n position: 'relative',\n maxHeight: 300,\n overflow: 'auto',\n },\n listboxHidden: {\n overflow: 'hidden',\n },\n loadingItem: {\n textAlign: 'center',\n padding: theme.spacing(1),\n },\n overlay: {\n position: 'absolute',\n inset: 0,\n background: 'rgba(255,255,255,.95)',\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n zIndex: 1,\n },\n overlayText: {\n marginTop: theme.spacing(1),\n },\n alert: {\n marginTop: theme.spacing(1),\n },\n}));\n\n/\n FluentScrollLoadAutocompleteMenu\n\n A drop‑in extension for MUI’s `<Autocomplete>` that:\n\n 1. Fetches paginated / sortable data from any REST endpoint \n* 2. Implements infinite scrolling with automatic scroll‑position restore \n* 3. Supports client‑side filtering, grouping \n* 4. Displays a Material UI `<CircularProgress>` while loading and a MUI `<Alert>` on errors\n\n Internally it wraps unity‑fluent‑library’s `<FluentSelectMenu>` so you get the same\n* keyboard navigation and styling as the rest of the Fluent controls.\n\n ---\n\n ### Typical usage\n* ```jsx\n* const endpoint = (q, page, size, sortCol, sortDir) =>\n* `/api/products?search=${q}&page=${page}&pageSize=${size}&sort=${sortCol}&dir=${sortDir}`;\n\n const map = (raw) => ({\n* items: raw.items,\n* total: raw.totalRows,\n* });\n\n <FluentScrollLoadAutocompleteMenu\n* apiBaseUrl=\"https://api.example.com\"\n* apiEndpoint={endpoint}\n* mapResponse={map}\n* onChange={(product) => console.log(product)}\n* />\n* ```\n* ---\n\n @param {Object} props\n* @param {string} props.apiBaseUrl Base URL forwarded to apiMutate\n* @param {Function} props.apiEndpoint `(keyword, page, pageSize, sortCol, sortDir) => string`\n* @param {Function} props.mapResponse Maps raw API payload → `{ items, total }`\n* @param {Function} [props.onChange] Fires when the user selects/clears an option\n* @param {Function} [props.getOptionLabel] Returns the display label for an item (default: `o.name`)\n* @param {Function} [props.groupBy] Returns a group heading string for an item\n* @param {string} [props.placeholder='Search…'] Placeholder text\n* @param {string} [props.displayProperty='name'] Property passed to `<FluentSelectMenu>`\n* @param {number\|string} [props.width=300] Fixed width of the component container\n* @param {boolean} [props.fetchEnabled=true] Disable to work fully offline\n* @param {} [props.initialValue=null] Pre‑selected value shown immediately\n @param {Array} [props.initialOptions=[]] Pre‑loaded options shown immediately\n* @param {boolean} [props.isPaginated=true] Disable if your API returns the full list\n* @param {boolean} [props.isSortable=true] Disable server‑side sorting\n* @param {boolean} [props.isFilterable=true] Disable server‑side filtering\n* @param {number} [props.pageSize=50] Items per page when paginating\n* @param {string} [props.sortColumn='Name'] Default sort column\n* @param {'ASC'\|'DESC'} [props.sortDirection='ASC'] Default sort direction\n\n @returns {JSX.Element}\n/\nexport const FluentScrollLoadAutocompleteMenu = ({\n apiBaseUrl,\n apiEndpoint,\n apiConfig = {},\n apiData = null,\n mapResponse,\n onChange,\n getOptionLabel = (o) => o?.name ?? '',\n groupBy,\n placeholder = 'Search…',\n displayProperty = 'name',\n width = 300,\n fetchEnabled = true,\n initialValue = null,\n initialOptions = [],\n isPaginated = true,\n isSortable = true,\n isFilterable = true,\n pageSize = 50,\n sortColumn = 'Name',\n sortDirection = 'ASC',\n}) => {\n const classes = useStyles();\n const [options, setOptions] = useState(initialOptions);\n const [value, setValue] = useState(initialValue);\n const [inputValue, setInputValue] = useState('');\n const [loading, setLoading] = useState(false);\n const [loadingMore, setLoadingMore] = useState(false);\n const [error, setError] = useState(null);\n const [pageNumber, setPageNumber] = useState(1);\n const [totalRows, setTotalRows] = useState(0);\n\n const configRef = useRef(apiConfig);\n const dataRef = useRef(apiData);\n const listboxRef = useRef(null);\n const prevScrollPositionRef = useRef(0);\n\n const { t } = useTranslation();\n\n /\n Fetches a page of data from the provided API endpoint and updates the component state accordingly.\n \n This function supports:\n * - Filtering (if `isFilterable` is true)\n * - Sorting (if `isSortable` is true)\n * - Pagination (based on the `page` and `pageSize` arguments)\n * - Infinite scroll appending (via the `append` flag)\n \n @function fetchPage\n * @param {string} keyword - The keyword to filter results by (if filtering is enabled)\n * @param {number} page - The page number to fetch\n * @param {boolean} [append=false] - If true, appends results to the current list; otherwise replaces it\n * @returns {Promise<void>} - Resolves once data is fetched and state is updated\n /\n const fetchPage = useCallback(\n async (keyword, page, append = false) => {\n if (!fetchEnabled) return;\n\n setError(null);\n page === 1 ? setLoading(true) : setLoadingMore(true);\n\n try {\n const url = apiEndpoint(\n isFilterable ? keyword : '',\n page,\n pageSize,\n isSortable ? sortColumn : '',\n isSortable ? sortDirection : 'ASC'\n );\n const resp = await apiMutate(apiBaseUrl, url, configRef.current, dataRef.current);\n const { items, total } = mapResponse(resp.data);\n\n setOptions((prev) => (append ? [...prev, ...items] : items));\n setTotalRows(total);\n setPageNumber(page);\n } catch (err) {\n setError(err.response?.data?.message ?? err.message ?? t('Unknown error'));\n } finally {\n page === 1 ? setLoading(false) : setLoadingMore(false);\n }\n },\n [\n apiBaseUrl,\n apiEndpoint,\n mapResponse,\n pageSize,\n sortColumn,\n sortDirection,\n isFilterable,\n isSortable,\n fetchEnabled,\n t,\n ]\n );\n\n / ---------- infinite scroll ---------- /\n const handleListboxScroll = (e) => {\n if (!isPaginated) return;\n\n const node = e.currentTarget;\n prevScrollPositionRef.current = node.scrollTop;\n\n if (\n node.scrollTop + node.clientHeight >= node.scrollHeight - 30 &&\n !loadingMore &&\n options.length < totalRows\n ) {\n fetchPage(inputValue, pageNumber + 1, true);\n }\n };\n\n /\n Listbox\n \n Custom scrollable container used by the Autocomplete dropdown.\n * - Attaches a ref to preserve scroll position between pages.\n * - Displays a loading message if no options are present initially.\n * - Shows a full overlay spinner when `loadingMore` is true.\n \n This component is passed as the `ListboxComponent` to FluentSelectMenu’s\n * Autocomplete integration, enabling infinite scroll with visual feedback.\n \n @param {Object} props\n * @param {React.ReactNode} props.children - Option elements to render\n * @param {boolean} props.initialLoading - Whether to show the “Loading…” message initially\n * @param {React.Ref} ref - Forwarded ref from the Autocomplete dropdown\n * @returns {JSX.Element}\n /\n const Listbox = forwardRef(({ children, initialLoading, ...other }, ref) => (\n <ul\n ref={(inst) => {\n if (inst) listboxRef.current = inst;\n if (typeof ref === 'function') ref(inst);\n else if (ref) ref.current = inst;\n }}\n {...other}\n style={{\n position: 'relative',\n maxHeight: 300,\n overflow: loadingMore ? 'hidden' : 'auto',\n }}\n >\n {Children.count(children) === 0 && initialLoading ? (\n <li style={{ textAlign: 'center', padding: 8 }}>{t('Loading...')}</li>\n ) : (\n children\n )}\n\n {loadingMore && (\n <Box className={classes.overlay}>\n <CircularProgress size={20} />\n <span className={classes.overlayText}>{t('Loading...')}</span>\n </Box>\n )}\n </ul>\n ));\n Listbox.displayName = 'FluentSMAutocompleteListbox';\n\n / [Initial / filtered fetch] /\n useEffect(() => {\n if (!fetchEnabled \|\| !isFilterable) return;\n if (value && inputValue === getOptionLabel(value)) return;\n\n const timer = setTimeout(() => fetchPage(inputValue, 1, false), 400);\n return () => clearTimeout(timer);\n }, [inputValue, fetchPage, value, getOptionLabel, isFilterable, fetchEnabled]);\n\n // [Initial fetch when filtering is disabled]\n useEffect(() => {\n if (!fetchEnabled \|\| isFilterable) return;\n fetchPage('', 1, false);\n }, [isFilterable, fetchEnabled, fetchPage]);\n\n // [Restores scroll position after loading more items]\n useEffect(() => {\n if (!loadingMore && listboxRef.current) {\n listboxRef.current.scrollTop = prevScrollPositionRef.current;\n }\n }, [options, loadingMore]);\n\n useEffect(() => { configRef.current = apiConfig }, [apiConfig]);\n useEffect(() => { dataRef.current = apiData }, [apiData]);\n\n return (\n <Box width={width}>\n <FluentSelectMenu\n placeholder={placeholder}\n data={options}\n displayProperty={displayProperty}\n onChange={(val) => {\n setValue(val);\n onChange?.(val);\n }}\n InputProps={{\n endAdornment:\n loading && pageNumber === 1 ? (\n <CircularProgress color=\"inherit\" size={20} />\n ) : null,\n }}\n autoCompleteProps={{\n value,\n inputValue,\n onInputChange: (_e, v) => setInputValue(v),\n loading: loading && pageNumber === 1,\n getOptionLabel,\n groupBy,\n ListboxComponent: Listbox,\n ListboxProps: {\n onScroll: handleListboxScroll,\n initialLoading: loading && pageNumber === 1,\n },\n }}\n />\n\n {error && (\n <Alert severity=\"error\" style={{ marginTop: 8 }}>\n {error}\n </Alert>\n )}\n </Box>\n );\n};\n\nFluentScrollLoadAutocompleteMenu.propTypes = {\n /* Base URL used by apiMutate /\n apiBaseUrl: PropTypes.string.isRequired,\n\n /* Builds the endpoint URL: (keyword, page, pageSize, sortCol, sortDir) => string /\n apiEndpoint: PropTypes.func.isRequired,\n\n /* Additional config passed to apiMutate /\n apiConfig: PropTypes.object,\n\n /* Raw API data passed to apiMutate /\n apiData: PropTypes.any,\n\n /* Maps raw API payload into { items, total } /\n mapResponse: PropTypes.func.isRequired,\n\n /* Called when the user selects or clears an option /\n onChange: PropTypes.func,\n\n /* Returns the text label for a given option /\n getOptionLabel: PropTypes.func,\n\n /* Returns the group heading for a given option /\n groupBy: PropTypes.func,\n\n placeholder: PropTypes.string,\n displayProperty: PropTypes.string,\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n / Behavior flags /\n fetchEnabled: PropTypes.bool,\n initialValue: PropTypes.any,\n initialOptions: PropTypes.array,\n\n isPaginated: PropTypes.bool,\n isSortable: PropTypes.bool,\n isFilterable: PropTypes.bool,\n\n pageSize: PropTypes.number,\n sortColumn: PropTypes.string,\n sortDirection: PropTypes.oneOf(['ASC', 'DESC']),\n};\n","import React, {forwardRef} from 'react'\nimport {\n makeStyles,\n withStyles,\n Typography,\n FormControl,\n NativeSelect,\n InputBase\n} from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst FluentInput = withStyles((theme) => ({\n root: {\n 'label + &': {\n marginTop: theme.spacing(1)\n }\n },\n input: {\n borderRadius: 2,\n position: 'relative',\n border: '1px solid rgba(0, 0, 0, 0.23)',\n fontSize: 14,\n padding: '4px 8px',\n height: 20,\n transition: theme.transitions.create(['border-color', 'box-shadow']),\n '&:focus': {\n borderRadius: 2\n }\n }\n}))(InputBase)\n\nconst useStyles = makeStyles((theme) => ({\n margin: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n }\n}))\n\nconst FluentSimpleSelectComponent = ({\n label,\n children,\n id,\n value,\n handleChange,\n defaultValue\n}, ref) => {\n const classes = useStyles()\n\n return (\n <div>\n <FormControl className={classes.margin}>\n <Typography\n className={classes.label}\n style={{\n color: 'rgba(0, 0, 0, 0.54)',\n fontWeight: 400,\n letterSpacing: 0\n }}\n >\n {label}\n </Typography>\n <NativeSelect\n id={id}\n inputRef={ref}\n value={value}\n onChange={handleChange}\n defaultValue={defaultValue}\n input={<FluentInput />}\n noShrink='true'\n >\n {children}\n </NativeSelect>\n </FormControl>\n </div>\n )\n}\n\nFluentSimpleSelectComponent.propTypes = {\n /\n Label that appears above the selector\n /\n label: PropTypes.string,\n /\n Contents of the selected options (<option></option>)\n /\n children: PropTypes.node,\n /\n Function to handle option change\n /\n handleChange: PropTypes.func,\n /\n Value: the value of the selected item\n */\n value: PropTypes.string\n}\nexport const FluentSimpleSelect = forwardRef(FluentSimpleSelectComponent)\n"],"mappings":";;;;;;;;;;;;AAMA,MAAMA,cAAY,YAAY,WAAW;CACvC,WAAW;EACT,YAAY,MAAM,QAAQ,EAAE;EAC5B,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,OAAO,EACL,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACD,OAAO;EACL,cAAc;EACd,QAAQ;EACR,SAAS;EACT,WAAW;EACZ;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACF,EAAE;AAEH,MAAa,yBAAyB,EACpC,MACA,aACA,IACA,mBACI;CACJ,MAAM,UAAUA,aAAW;CAC3B,MAAM,UACJ,QACA,KAAK,KAAK,WAAW;EACnB,MAAM,cAAc,OAAO,MAAM,GAAG,aAAa;AACjD,SAAO;GACL,aAAa,QAAQ,KAAK,YAAY,GAAG,QAAQ;GACjD,GAAG;GACJ;GACD;AAEJ,QACE,oCAAC;EACK;EACJ,WAAW,OAAO,UAAU,aAAa,MAAM;EAC/C,SAAS,QAAQ,MACd,GAAG,MAAM,CAAC,EAAE,YAAY,cAAc,EAAE,YAAY,CACtD;EACD,UAAU,WAAW,OAAO;EAC5B,iBAAiB,WAAW,OAAO;EACnC,OAAO,EAAE,OAAO,KAAK;EACrB,cAAc,WACZ,oCAAC;GACC,GAAI;GACJ,OAAO,CAAC,OAAO,WAAW,SAAS;GACnC,SAAQ;GACR,MAAK;GACL,iBAAiB;IACf,QAAQ;IACR,SAAS;KACP,MAAM,QAAQ;KACd,SAAS,QAAQ;KAClB;IACF;GACD,aAAa,EACX,WAAW,EACT,WAAW,QAAQ,MACpB,EACF;IACD;GAEJ;;;;;ACrEN,MAAMC,cAAY,YAAY,WAAW;CACvC,WAAW;EACT,YAAY,MAAM,QAAQ,EAAE;EAC5B,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,OAAO,EACL,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACD,OAAO;EACL,cAAc;EACd,QAAQ;EACR,SAAS;EACT,WAAW;EACZ;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACF,EAAE;AAEH,MAAa,mBAAmB,EAAE,MAAM,aAAa,IAAI,cAAc,gBAAgB;CACrF,MAAM,UAAUA,aAAW;CAC3B,MAAM,UACJ,QACA,KAAK,KAAK,WAAW;AAEnB,SAAO;GACL,UAFe,OAAO;GAGtB,GAAG;GACJ;GACD;AAEJ,QACE,oCAAC;EACY;EACP;EACJ,WAAW,OAAO,UAAU,aAAa,MAAM;EAC/C,SAAS,QAAQ,MAAM,GAAG,MAAM,CAAC,EAAE,SAAS,cAAc,EAAE,SAAS,CAAC;EACtE,UAAU,WAAW,OAAO;EAC5B,iBAAiB,WAAW,OAAO;EACnC,OAAO,EAAE,OAAO,KAAK;EACrB,cAAc,WACZ,oCAAC;GACC,GAAI;GACJ,OAAO,CAAC,OAAO,WAAW,SAAS;GACnC,SAAQ;GACR,MAAK;GACL,iBAAiB;IACf,QAAQ;IACR,SAAS;KACP,MAAM,QAAQ;KACd,SAAS,QAAQ;KAClB;IACF;GACD,aAAa,EACX,WAAW,EACT,WAAW,QAAQ,MACpB,EACF;IACD;GAEJ;;;;;ACpDN,MAAMC,cAAYC,cAAY,WAAW;CACvC,SAAS;EACP,UAAU;EACV,WAAW;EACX,UAAU;EACX;CACD,eAAe,EACb,UAAU,UACX;CACD,aAAa;EACX,WAAW;EACX,SAAS,MAAM,QAAQ,EAAE;EAC1B;CACD,SAAS;EACP,UAAU;EACV,OAAO;EACP,YAAY;EACZ,SAAS;EACT,eAAe;EACf,YAAY;EACZ,gBAAgB;EAChB,QAAQ;EACT;CACD,aAAa,EACX,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACD,OAAO,EACL,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACF,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DH,MAAa,oCAAoC,EAC/C,YACA,aACA,YAAY,EAAE,EACd,UAAU,MACV,aACA,UACA,kBAAkB,MAAM,GAAG,QAAQ,IACnC,SACA,cAAc,WACd,kBAAkB,QAClB,QAAQ,KACR,eAAe,MACf,eAAe,MACf,iBAAiB,EAAE,EACnB,cAAc,MACd,aAAa,MACb,eAAe,MACf,WAAW,IACX,aAAa,QACb,gBAAgB,YACZ;CACJ,MAAM,UAAUD,aAAW;CAC3B,MAAM,CAAC,SAAS,cAAc,SAAS,eAAe;CACtD,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;CAChD,MAAM,CAAC,YAAY,iBAAiB,SAAS,GAAG;CAChD,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,CAAC,aAAa,kBAAkB,SAAS,MAAM;CACrD,MAAM,CAAC,OAAO,YAAY,SAAS,KAAK;CACxC,MAAM,CAAC,YAAY,iBAAiB,SAAS,EAAE;CAC/C,MAAM,CAAC,WAAW,gBAAgB,SAAS,EAAE;CAE7C,MAAM,YAAY,OAAO,UAAU;CACnC,MAAM,UAAU,OAAO,QAAQ;CAC/B,MAAM,aAAa,OAAO,KAAK;CAC/B,MAAM,wBAAwB,OAAO,EAAE;CAEvC,MAAM,EAAE,MAAM,gBAAgB;;;;;;;;;;;;;;;;CAiB9B,MAAM,YAAY,YAChB,OAAO,SAAS,MAAM,SAAS,UAAU;AACvC,MAAI,CAAC,aAAc;AAEnB,WAAS,KAAK;AACd,WAAS,IAAI,WAAW,KAAK,GAAG,eAAe,KAAK;AAEpD,MAAI;GASF,MAAM,EAAE,OAAO,UAAU,aADZ,MAAM,UAAU,YAPjB,YACV,eAAe,UAAU,IACzB,MACA,UACA,aAAa,aAAa,IAC1B,aAAa,gBAAgB,MAC9B,EAC6C,UAAU,SAAS,QAAQ,QAAQ,EACvC,KAAK;AAE/C,eAAY,SAAU,SAAS,CAAC,GAAG,MAAM,GAAG,MAAM,GAAG,MAAO;AAC5D,gBAAa,MAAM;AACnB,iBAAc,KAAK;WACZ,KAAK;AACZ,YAAS,IAAI,UAAU,MAAM,WAAW,IAAI,WAAW,EAAE,gBAAgB,CAAC;YAClE;AACR,YAAS,IAAI,WAAW,MAAM,GAAG,eAAe,MAAM;;IAG1D;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAGD,MAAM,uBAAuB,MAAM;AACjC,MAAI,CAAC,YAAa;EAElB,MAAM,OAAO,EAAE;AACf,wBAAsB,UAAU,KAAK;AAErC,MACE,KAAK,YAAY,KAAK,gBAAgB,KAAK,eAAe,MAC1D,CAAC,eACD,QAAQ,SAAS,UAEjB,WAAU,YAAY,aAAa,GAAG,KAAK;;;;;;;;;;;;;;;;;;;CAqB/C,MAAM,UAAU,YAAY,EAAE,UAAU,gBAAgB,GAAG,SAAS,QAClE,oCAAC;EACC,MAAM,SAAS;AACb,OAAI,KAAM,YAAW,UAAU;AAC/B,OAAI,OAAO,QAAQ,WAAY,KAAI,KAAK;YAC/B,IAAK,KAAI,UAAU;;EAE9B,GAAI;EACJ,OAAO;GACL,UAAU;GACV,WAAW;GACX,UAAU,cAAc,WAAW;GACpC;IAEA,SAAS,MAAM,SAAS,KAAK,KAAK,iBACjC,oCAAC,QAAG,OAAO;EAAE,WAAW;EAAU,SAAS;EAAG,IAAG,EAAE,aAAa,CAAM,GAEtE,UAGD,eACC,oCAACE,SAAI,WAAW,QAAQ,WACtB,oCAAC,oBAAiB,MAAM,KAAM,EAC9B,oCAAC,UAAK,WAAW,QAAQ,eAAc,EAAE,aAAa,CAAQ,CAC1D,CAEL,CACL;AACF,SAAQ,cAAc;AAGtB,iBAAgB;AACd,MAAI,CAAC,gBAAgB,CAAC,aAAc;AACpC,MAAI,SAAS,eAAe,eAAe,MAAM,CAAE;EAEnD,MAAM,QAAQ,iBAAiB,UAAU,YAAY,GAAG,MAAM,EAAE,IAAI;AACpE,eAAa,aAAa,MAAM;IAC/B;EAAC;EAAY;EAAW;EAAO;EAAgB;EAAc;EAAa,CAAC;AAG9E,iBAAgB;AACd,MAAI,CAAC,gBAAgB,aAAc;AACnC,YAAU,IAAI,GAAG,MAAM;IACtB;EAAC;EAAc;EAAc;EAAU,CAAC;AAG3C,iBAAgB;AACd,MAAI,CAAC,eAAe,WAAW,QAC7B,YAAW,QAAQ,YAAY,sBAAsB;IAEtD,CAAC,SAAS,YAAY,CAAC;AAE1B,iBAAgB;AAAE,YAAU,UAAU;IAAa,CAAC,UAAU,CAAC;AAC/D,iBAAgB;AAAE,UAAQ,UAAU;IAAW,CAAC,QAAQ,CAAC;AAEzD,QACE,oCAACA,SAAW,SACV,oCAAC;EACc;EACb,MAAM;EACW;EACjB,WAAW,QAAQ;AACjB,YAAS,IAAI;AACb,cAAW,IAAI;;EAEjB,YAAY,EACV,cACE,WAAW,eAAe,IACxB,oCAAC;GAAiB,OAAM;GAAU,MAAM;IAAM,GAC5C,MACP;EACD,mBAAmB;GACjB;GACA;GACA,gBAAgB,IAAI,MAAM,cAAc,EAAE;GAC1C,SAAS,WAAW,eAAe;GACnC;GACA;GACA,kBAAkB;GAClB,cAAc;IACZ,UAAU;IACV,gBAAgB,WAAW,eAAe;IAC3C;GACF;GACD,EAED,SACC,oCAAC;EAAM,UAAS;EAAQ,OAAO,EAAE,WAAW,GAAG;IAC5C,MACK,CAEN;;AAIV,iCAAiC,YAAY;CAE3C,YAAY,UAAU,OAAO;CAG7B,aAAa,UAAU,KAAK;CAG5B,WAAW,UAAU;CAGrB,SAAS,UAAU;CAGnB,aAAa,UAAU,KAAK;CAG5B,UAAU,UAAU;CAGpB,gBAAgB,UAAU;CAG1B,SAAS,UAAU;CAEnB,aAAa,UAAU;CACvB,iBAAiB,UAAU;CAC3B,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,OAAO,CAAC;CAGhE,cAAc,UAAU;CACxB,cAAc,UAAU;CACxB,gBAAgB,UAAU;CAE1B,aAAa,UAAU;CACvB,YAAY,UAAU;CACtB,cAAc,UAAU;CAExB,UAAU,UAAU;CACpB,YAAY,UAAU;CACtB,eAAe,UAAU,MAAM,CAAC,OAAO,OAAO,CAAC;CAChD;;;;ACrWD,MAAM,cAAc,YAAY,WAAW;CACzC,MAAM,EACJ,aAAa,EACX,WAAW,MAAM,QAAQ,EAAE,EAC5B,EACF;CACD,OAAO;EACL,cAAc;EACd,UAAU;EACV,QAAQ;EACR,UAAU;EACV,SAAS;EACT,QAAQ;EACR,YAAY,MAAM,YAAY,OAAO,CAAC,gBAAgB,aAAa,CAAC;EACpE,WAAW,EACT,cAAc,GACf;EACF;CACF,EAAE,CAAC,UAAU;AAEd,MAAM,YAAY,YAAY,WAAW,EACvC,QAAQ;CACN,WAAW,MAAM,QAAQ,EAAE;CAC3B,cAAc,MAAM,QAAQ,EAAE;CAC/B,EACF,EAAE;AAEH,MAAM,+BAA+B,EACnC,OACA,UACA,IACA,OACA,cACA,gBACC,QAAQ;CACT,MAAM,UAAU,WAAW;AAE3B,QACE,oCAAC,aACC,oCAAC,eAAY,WAAW,QAAQ,UAC9B,oCAAC;EACC,WAAW,QAAQ;EACnB,OAAO;GACL,OAAO;GACP,YAAY;GACZ,eAAe;GAChB;IAEA,MACU,EACb,oCAAC;EACK;EACJ,UAAU;EACH;EACP,UAAU;EACI;EACd,OAAO,oCAAC,kBAAc;EACtB,UAAS;IAER,SACY,CACH,CACV;;AAIV,4BAA4B,YAAY;CAItC,OAAO,UAAU;CAIjB,UAAU,UAAU;CAIpB,cAAc,UAAU;CAIxB,OAAO,UAAU;CAClB;AACD,MAAa,qBAAqB,WAAW,4BAA4B"}
1	+ {"version":3,"file":"FluentSimpleSelect-DxxbQV37.js","names":["useStyles","useStyles","useStyles","makeStyles","Box"],"sources":["../src/UI/inputs/menus/FluentSelectDirectoryMenu.jsx","../src/UI/inputs/menus/FluentSelectGroupMenu.jsx","../src/UI/inputs/menus/FluentScrollLoadAutocompleteMenu.jsx","../src/UI/inputs/menus/FluentSimpleSelect.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define /\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n textField: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(1)\n },\n dense: {\n marginTop: theme.spacing(1)\n },\n input: {\n borderRadius: 2,\n height: 32,\n padding: 0,\n marginTop: 3\n },\n formTextInput: {\n fontSize: 14\n },\n labelRoot: {\n fontSize: 14\n }\n}))\n\nexport const FluentSelectGroupMenu = ({\n data,\n placeholder,\n id,\n handleChange\n}) => {\n const classes = useStyles()\n const options =\n data &&\n data.map((option) => {\n const firstLetter = option.label[0].toUpperCase()\n return {\n firstLetter: /[0-9]/.test(firstLetter) ? '0-9' : firstLetter,\n ...option\n }\n })\n\n return (\n <Autocomplete\n id={id}\n onChange={(event, value) => handleChange(value)}\n options={options.sort(\n (a, b) => -b.firstLetter.localeCompare(a.firstLetter)\n )}\n groupBy={(option) => option.firstLetter}\n getOptionLabel={(option) => option.label}\n style={{ width: 300 }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={!params.inputProps.value && placeholder}\n variant='outlined'\n size='small'\n InputLabelProps={{\n shrink: false,\n classes: {\n root: classes.labelRoot,\n focused: classes.labelFocused\n }\n }}\n SelectProps={{\n MenuProps: {\n className: classes.menu\n }\n }}\n />\n )}\n />\n )\n}\n","/ eslint-disable no-use-before-define /\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n textField: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(1)\n },\n dense: {\n marginTop: theme.spacing(1)\n },\n input: {\n borderRadius: 2,\n height: 32,\n padding: 0,\n marginTop: 3\n },\n formTextInput: {\n fontSize: 14\n },\n labelRoot: {\n fontSize: 14\n }\n}))\n\nexport const SelectGroupMenu = ({ data, placeholder, id, handleChange, className }) => {\n const classes = useStyles()\n const options =\n data &&\n data.map((option) => {\n const grouping = option.category\n return {\n grouping,\n ...option\n }\n })\n\n return (\n <Autocomplete\n className={className}\n id={id}\n onChange={(event, value) => handleChange(value)}\n options={options.sort((a, b) => -b.grouping.localeCompare(a.grouping))}\n groupBy={(option) => option.grouping}\n getOptionLabel={(option) => option.label}\n style={{ width: 300 }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={!params.inputProps.value && placeholder}\n variant='outlined'\n size='small'\n InputLabelProps={{\n shrink: false,\n classes: {\n root: classes.labelRoot,\n focused: classes.labelFocused\n }\n }}\n SelectProps={{\n MenuProps: {\n className: classes.menu\n }\n }}\n />\n )}\n />\n )\n}\n","import React, {\n useState,\n useCallback,\n useEffect,\n forwardRef,\n useRef,\n Children,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport { CircularProgress } from '@material-ui/core';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FluentSelectMenu } from './FluentSelectMenu';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useTranslation } from 'react-i18next';\nimport { Box } from '../../Box';\nimport Alert from '@material-ui/lab/Alert';\n\nconst useStyles = makeStyles((theme) => ({\n listbox: {\n position: 'relative',\n maxHeight: 300,\n overflow: 'auto',\n },\n listboxHidden: {\n overflow: 'hidden',\n },\n loadingItem: {\n textAlign: 'center',\n padding: theme.spacing(1),\n },\n overlay: {\n position: 'absolute',\n inset: 0,\n background: 'rgba(255,255,255,.95)',\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n zIndex: 1,\n },\n overlayText: {\n marginTop: theme.spacing(1),\n },\n alert: {\n marginTop: theme.spacing(1),\n },\n}));\n\n/\n FluentScrollLoadAutocompleteMenu\n\n A drop‑in extension for MUI’s `<Autocomplete>` that:\n\n 1. Fetches paginated / sortable data from any REST endpoint \n* 2. Implements infinite scrolling with automatic scroll‑position restore \n* 3. Supports client‑side filtering, grouping \n* 4. Displays a Material UI `<CircularProgress>` while loading and a MUI `<Alert>` on errors\n\n Internally it wraps unity‑fluent‑library’s `<FluentSelectMenu>` so you get the same\n* keyboard navigation and styling as the rest of the Fluent controls.\n\n ---\n\n ### Typical usage\n* ```jsx\n* const endpoint = (q, page, size, sortCol, sortDir) =>\n* `/api/products?search=${q}&page=${page}&pageSize=${size}&sort=${sortCol}&dir=${sortDir}`;\n\n const map = (raw) => ({\n* items: raw.items,\n* total: raw.totalRows,\n* });\n\n <FluentScrollLoadAutocompleteMenu\n* apiBaseUrl=\"https://api.example.com\"\n* apiEndpoint={endpoint}\n* mapResponse={map}\n* onChange={(product) => console.log(product)}\n* />\n* ```\n* ---\n\n @param {Object} props\n* @param {string} props.apiBaseUrl Base URL forwarded to apiMutate\n* @param {Function} props.apiEndpoint `(keyword, page, pageSize, sortCol, sortDir) => string`\n* @param {Function} props.mapResponse Maps raw API payload → `{ items, total }`\n* @param {Function} [props.onChange] Fires when the user selects/clears an option\n* @param {Function} [props.getOptionLabel] Returns the display label for an item (default: `o.name`)\n* @param {Function} [props.groupBy] Returns a group heading string for an item\n* @param {string} [props.placeholder='Search…'] Placeholder text\n* @param {string} [props.displayProperty='name'] Property passed to `<FluentSelectMenu>`\n* @param {number\|string} [props.width=300] Fixed width of the component container\n* @param {boolean} [props.fetchEnabled=true] Disable to work fully offline\n* @param {} [props.initialValue=null] Pre‑selected value shown immediately\n @param {Array} [props.initialOptions=[]] Pre‑loaded options shown immediately\n* @param {boolean} [props.isPaginated=true] Disable if your API returns the full list\n* @param {boolean} [props.isSortable=true] Disable server‑side sorting\n* @param {boolean} [props.isFilterable=true] Disable server‑side filtering\n* @param {number} [props.pageSize=50] Items per page when paginating\n* @param {string} [props.sortColumn='Name'] Default sort column\n* @param {'ASC'\|'DESC'} [props.sortDirection='ASC'] Default sort direction\n\n @returns {JSX.Element}\n/\nexport const FluentScrollLoadAutocompleteMenu = ({\n apiBaseUrl,\n apiEndpoint,\n apiConfig = {},\n apiData = null,\n mapResponse,\n onChange,\n getOptionLabel = (o) => o?.name ?? '',\n groupBy,\n placeholder = 'Search…',\n displayProperty = 'name',\n width = 300,\n fetchEnabled = true,\n initialValue = null,\n initialOptions = [],\n isPaginated = true,\n isSortable = true,\n isFilterable = true,\n pageSize = 50,\n sortColumn = 'Name',\n sortDirection = 'ASC',\n}) => {\n const classes = useStyles();\n const [options, setOptions] = useState(initialOptions);\n const [value, setValue] = useState(initialValue);\n const [inputValue, setInputValue] = useState('');\n const [loading, setLoading] = useState(false);\n const [loadingMore, setLoadingMore] = useState(false);\n const [error, setError] = useState(null);\n const [pageNumber, setPageNumber] = useState(1);\n const [totalRows, setTotalRows] = useState(0);\n\n const configRef = useRef(apiConfig);\n const dataRef = useRef(apiData);\n const listboxRef = useRef(null);\n const prevScrollPositionRef = useRef(0);\n\n const { t } = useTranslation();\n\n /\n Fetches a page of data from the provided API endpoint and updates the component state accordingly.\n \n This function supports:\n * - Filtering (if `isFilterable` is true)\n * - Sorting (if `isSortable` is true)\n * - Pagination (based on the `page` and `pageSize` arguments)\n * - Infinite scroll appending (via the `append` flag)\n \n @function fetchPage\n * @param {string} keyword - The keyword to filter results by (if filtering is enabled)\n * @param {number} page - The page number to fetch\n * @param {boolean} [append=false] - If true, appends results to the current list; otherwise replaces it\n * @returns {Promise<void>} - Resolves once data is fetched and state is updated\n /\n const fetchPage = useCallback(\n async (keyword, page, append = false) => {\n if (!fetchEnabled) return;\n\n setError(null);\n page === 1 ? setLoading(true) : setLoadingMore(true);\n\n try {\n const url = apiEndpoint(\n isFilterable ? keyword : '',\n page,\n pageSize,\n isSortable ? sortColumn : '',\n isSortable ? sortDirection : 'ASC'\n );\n const resp = await apiMutate(apiBaseUrl, url, configRef.current, dataRef.current);\n const { items, total } = mapResponse(resp.data);\n\n setOptions((prev) => (append ? [...prev, ...items] : items));\n setTotalRows(total);\n setPageNumber(page);\n } catch (err) {\n setError(err.response?.data?.message ?? err.message ?? t('Unknown error'));\n } finally {\n page === 1 ? setLoading(false) : setLoadingMore(false);\n }\n },\n [\n apiBaseUrl,\n apiEndpoint,\n mapResponse,\n pageSize,\n sortColumn,\n sortDirection,\n isFilterable,\n isSortable,\n fetchEnabled,\n t,\n ]\n );\n\n / ---------- infinite scroll ---------- /\n const handleListboxScroll = (e) => {\n if (!isPaginated) return;\n\n const node = e.currentTarget;\n prevScrollPositionRef.current = node.scrollTop;\n\n if (\n node.scrollTop + node.clientHeight >= node.scrollHeight - 30 &&\n !loadingMore &&\n options.length < totalRows\n ) {\n fetchPage(inputValue, pageNumber + 1, true);\n }\n };\n\n /\n Listbox\n \n Custom scrollable container used by the Autocomplete dropdown.\n * - Attaches a ref to preserve scroll position between pages.\n * - Displays a loading message if no options are present initially.\n * - Shows a full overlay spinner when `loadingMore` is true.\n \n This component is passed as the `ListboxComponent` to FluentSelectMenu’s\n * Autocomplete integration, enabling infinite scroll with visual feedback.\n \n @param {Object} props\n * @param {React.ReactNode} props.children - Option elements to render\n * @param {boolean} props.initialLoading - Whether to show the “Loading…” message initially\n * @param {React.Ref} ref - Forwarded ref from the Autocomplete dropdown\n * @returns {JSX.Element}\n /\n const Listbox = forwardRef(({ children, initialLoading, ...other }, ref) => (\n <ul\n ref={(inst) => {\n if (inst) listboxRef.current = inst;\n if (typeof ref === 'function') ref(inst);\n else if (ref) ref.current = inst;\n }}\n {...other}\n style={{\n position: 'relative',\n maxHeight: 300,\n overflow: loadingMore ? 'hidden' : 'auto',\n }}\n >\n {Children.count(children) === 0 && initialLoading ? (\n <li style={{ textAlign: 'center', padding: 8 }}>{t('Loading...')}</li>\n ) : (\n children\n )}\n\n {loadingMore && (\n <Box className={classes.overlay}>\n <CircularProgress size={20} />\n <span className={classes.overlayText}>{t('Loading...')}</span>\n </Box>\n )}\n </ul>\n ));\n Listbox.displayName = 'FluentSMAutocompleteListbox';\n\n / [Initial / filtered fetch] /\n useEffect(() => {\n if (!fetchEnabled \|\| !isFilterable) return;\n if (value && inputValue === getOptionLabel(value)) return;\n\n const timer = setTimeout(() => fetchPage(inputValue, 1, false), 400);\n return () => clearTimeout(timer);\n }, [inputValue, fetchPage, value, getOptionLabel, isFilterable, fetchEnabled]);\n\n // [Initial fetch when filtering is disabled]\n useEffect(() => {\n if (!fetchEnabled \|\| isFilterable) return;\n fetchPage('', 1, false);\n }, [isFilterable, fetchEnabled, fetchPage]);\n\n // [Restores scroll position after loading more items]\n useEffect(() => {\n if (!loadingMore && listboxRef.current) {\n listboxRef.current.scrollTop = prevScrollPositionRef.current;\n }\n }, [options, loadingMore]);\n\n useEffect(() => { configRef.current = apiConfig }, [apiConfig]);\n useEffect(() => { dataRef.current = apiData }, [apiData]);\n\n return (\n <Box width={width}>\n <FluentSelectMenu\n placeholder={placeholder}\n data={options}\n displayProperty={displayProperty}\n onChange={(val) => {\n setValue(val);\n onChange?.(val);\n }}\n InputProps={{\n endAdornment:\n loading && pageNumber === 1 ? (\n <CircularProgress color=\"inherit\" size={20} />\n ) : null,\n }}\n autoCompleteProps={{\n value,\n inputValue,\n onInputChange: (_e, v) => setInputValue(v),\n loading: loading && pageNumber === 1,\n getOptionLabel,\n groupBy,\n ListboxComponent: Listbox,\n ListboxProps: {\n onScroll: handleListboxScroll,\n initialLoading: loading && pageNumber === 1,\n },\n }}\n />\n\n {error && (\n <Alert severity=\"error\" style={{ marginTop: 8 }}>\n {error}\n </Alert>\n )}\n </Box>\n );\n};\n\nFluentScrollLoadAutocompleteMenu.propTypes = {\n /* Base URL used by apiMutate /\n apiBaseUrl: PropTypes.string.isRequired,\n\n /* Builds the endpoint URL: (keyword, page, pageSize, sortCol, sortDir) => string /\n apiEndpoint: PropTypes.func.isRequired,\n\n /* Additional config passed to apiMutate /\n apiConfig: PropTypes.object,\n\n /* Raw API data passed to apiMutate /\n apiData: PropTypes.any,\n\n /* Maps raw API payload into { items, total } /\n mapResponse: PropTypes.func.isRequired,\n\n /* Called when the user selects or clears an option /\n onChange: PropTypes.func,\n\n /* Returns the text label for a given option /\n getOptionLabel: PropTypes.func,\n\n /* Returns the group heading for a given option /\n groupBy: PropTypes.func,\n\n placeholder: PropTypes.string,\n displayProperty: PropTypes.string,\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n / Behavior flags /\n fetchEnabled: PropTypes.bool,\n initialValue: PropTypes.any,\n initialOptions: PropTypes.array,\n\n isPaginated: PropTypes.bool,\n isSortable: PropTypes.bool,\n isFilterable: PropTypes.bool,\n\n pageSize: PropTypes.number,\n sortColumn: PropTypes.string,\n sortDirection: PropTypes.oneOf(['ASC', 'DESC']),\n};\n","import React, {forwardRef} from 'react'\nimport {\n makeStyles,\n withStyles,\n Typography,\n FormControl,\n NativeSelect,\n InputBase\n} from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst FluentInput = withStyles((theme) => ({\n root: {\n 'label + &': {\n marginTop: theme.spacing(1)\n }\n },\n input: {\n borderRadius: 2,\n position: 'relative',\n border: '1px solid rgba(0, 0, 0, 0.23)',\n fontSize: 14,\n padding: '4px 8px',\n height: 20,\n transition: theme.transitions.create(['border-color', 'box-shadow']),\n '&:focus': {\n borderRadius: 2\n }\n }\n}))(InputBase)\n\nconst useStyles = makeStyles((theme) => ({\n margin: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n }\n}))\n\nconst FluentSimpleSelectComponent = ({\n label,\n children,\n id,\n value,\n handleChange,\n defaultValue\n}, ref) => {\n const classes = useStyles()\n\n return (\n <div>\n <FormControl className={classes.margin}>\n <Typography\n className={classes.label}\n style={{\n color: 'rgba(0, 0, 0, 0.54)',\n fontWeight: 400,\n letterSpacing: 0\n }}\n >\n {label}\n </Typography>\n <NativeSelect\n id={id}\n inputRef={ref}\n value={value}\n onChange={handleChange}\n defaultValue={defaultValue}\n input={<FluentInput />}\n noShrink='true'\n >\n {children}\n </NativeSelect>\n </FormControl>\n </div>\n )\n}\n\nFluentSimpleSelectComponent.propTypes = {\n /\n Label that appears above the selector\n /\n label: PropTypes.string,\n /\n Contents of the selected options (<option></option>)\n /\n children: PropTypes.node,\n /\n Function to handle option change\n /\n handleChange: PropTypes.func,\n /\n Value: the value of the selected item\n */\n value: PropTypes.string\n}\nexport const FluentSimpleSelect = forwardRef(FluentSimpleSelectComponent)\n"],"mappings":"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"}

package/dist/{FluentTimeline-D8sfgLj1.js → FluentTimeline-BEPJHsgi.js} RENAMED Viewed

@@ -89,4 +89,4 @@ var FluentTimeline_default = FluentTimeline;
 //#endregion
 export { FluentTimeline_default as t };
-//# sourceMappingURL=FluentTimeline-D8sfgLj1.js.map
+//# sourceMappingURL=FluentTimeline-BEPJHsgi.js.map

package/dist/{FluentTimeline-D8sfgLj1.js.map → FluentTimeline-BEPJHsgi.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FluentTimeline-~~D8sfgLj1~~.js","names":["useStyles","NumberVisualization"],"sources":["../src/UI/widgets/utils/NumberVisualization.jsx","../src/UI/widgets/FluentComponents/molecules/FluentTimeline.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Avatar, colors, makeStyles } from '@material-ui/core'\nimport clsx from 'clsx'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n minWidth: 30,\n minHeight: 30,\n maxWidth: 70,\n maxHeight: 70,\n // color: theme.palette.getContrastText(theme.palette.primary.dark),\n color: theme?.palette?.primary?.dark\n },\n positive: {\n backgroundColor: (props) =>\n colors.teal[Math.ceil((props.number * 5) / 100) * 100]\n },\n negative: {\n backgroundColor: (props) =>\n colors.deepOrange[Math.abs(Math.ceil((props.number * 5) / 100) * 100)]\n }\n}))\n\nconst NumberVisualization = (props) => {\n const classes = useStyles(props)\n const { number } = props\n\n let displayCircle = ''\n\n if (number > 0) {\n displayCircle = (\n <Avatar\n className={clsx(classes.root, classes.positive)}\n style={{\n width: number * 2,\n height: number * 2\n }}\n >\n {number}\n </Avatar>\n )\n } else {\n displayCircle = (\n <Avatar\n className={clsx(classes.root, classes.negative)}\n style={{\n width: number * 2,\n height: number * 2\n }}\n >\n {number}\n </Avatar>\n )\n }\n\n return <Fragment> {displayCircle} </Fragment>\n}\nexport default NumberVisualization\n","import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport NumberVisualization from '../../utils/NumberVisualization'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n flexDirection: 'row',\n marginTop: theme.spacing(3),\n marginLeft: theme.spacing(2),\n overflow: 'auto'\n },\n dot: {\n width: 10,\n height: 10,\n backgroundColor: 'white',\n borderRadius: theme.shape.borderRadius + 25,\n marginTop: theme.spacing(1)\n },\n timeLabels: {\n color: 'white'\n },\n indicator: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-end',\n marginRight: theme.spacing(2),\n textAlign: 'center',\n alignItems: 'center'\n }\n}))\n\nconst TimeDot = (props) => {\n const classes = useStyles()\n const { dot } = props\n return (\n <div className={classes.indicator}>\n <div className={classes.dot} />\n <div className={classes.timeLabels}>\n <Typography variant='overline'>{dot}</Typography>\n </div>\n </div>\n )\n}\n\nconst Visualization = (props) => {\n const classes = useStyles()\n const { value, label } = props\n return (\n <div className={classes.indicator}>\n <div>\n <NumberVisualization number={value} />\n </div>\n <div>\n <TimeDot dot={label} />\n </div>\n </div>\n )\n}\n\nconst categoriesToDisplay = (categories) =>\n categories.map((item) => {\n return (\n <Visualization key={item.label} value={item.value} label={item.label} />\n )\n })\n\nconst FluentTimeline = (props) => {\n const classes = useStyles()\n const { categories } = props\n\n return <div className={classes.root}>{categoriesToDisplay(categories)}</div>\n}\nexport default FluentTimeline\n"],"mappings":";;;;;AAIA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM;EACJ,UAAU;EACV,WAAW;EACX,UAAU;EACV,WAAW;EAEX,OAAO,OAAO,SAAS,SAAS;EACjC;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,KAAK,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,MACrD;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,WAAW,KAAK,IAAI,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,IAAI,GACxE;CACF,EAAE;AAEH,MAAM,uBAAuB,UAAU;CACrC,MAAM,UAAUA,YAAU,MAAM;CAChC,MAAM,EAAE,WAAW;CAEnB,IAAI,gBAAgB;AAEpB,KAAI,SAAS,EACX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;KAGX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;AAIb,QAAO,oCAAC,gBAAS,KAAE,eAAc,IAAY;;AAE/C,kCAAe;;;;ACrDf,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,SAAS;EACT,eAAe;EACf,WAAW,MAAM,QAAQ,EAAE;EAC3B,YAAY,MAAM,QAAQ,EAAE;EAC5B,UAAU;EACX;CACD,KAAK;EACH,OAAO;EACP,QAAQ;EACR,iBAAiB;EACjB,cAAc,MAAM,MAAM,eAAe;EACzC,WAAW,MAAM,QAAQ,EAAE;EAC5B;CACD,YAAY,EACV,OAAO,SACR;CACD,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC7B,WAAW;EACX,YAAY;EACb;CACF,EAAE;AAEH,MAAM,WAAW,UAAU;CACzB,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,QAAQ;AAChB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,SAAI,WAAW,QAAQ,MAAO,EAC/B,oCAAC,SAAI,WAAW,QAAQ,cACtB,oCAAC,cAAW,SAAQ,cAAY,IAAiB,CAC7C,CACF;;AAIV,MAAM,iBAAiB,UAAU;CAC/B,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,OAAO,UAAU;AACzB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,aACC,oCAACC,+BAAoB,QAAQ,QAAS,CAClC,EACN,oCAAC,aACC,oCAAC,WAAQ,KAAK,QAAS,CACnB,CACF;;AAIV,MAAM,uBAAuB,eAC3B,WAAW,KAAK,SAAS;AACvB,QACE,oCAAC;EAAc,KAAK,KAAK;EAAO,OAAO,KAAK;EAAO,OAAO,KAAK;GAAS;EAE1E;AAEJ,MAAM,kBAAkB,UAAU;CAChC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,eAAe;AAEvB,QAAO,oCAAC,SAAI,WAAW,QAAQ,QAAO,oBAAoB,WAAW,CAAO;;AAE9E,6BAAe"}
1	+ {"version":3,"file":"FluentTimeline-BEPJHsgi.js","names":["useStyles","NumberVisualization"],"sources":["../src/UI/widgets/utils/NumberVisualization.jsx","../src/UI/widgets/FluentComponents/molecules/FluentTimeline.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Avatar, colors, makeStyles } from '@material-ui/core'\nimport clsx from 'clsx'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n minWidth: 30,\n minHeight: 30,\n maxWidth: 70,\n maxHeight: 70,\n // color: theme.palette.getContrastText(theme.palette.primary.dark),\n color: theme?.palette?.primary?.dark\n },\n positive: {\n backgroundColor: (props) =>\n colors.teal[Math.ceil((props.number * 5) / 100) * 100]\n },\n negative: {\n backgroundColor: (props) =>\n colors.deepOrange[Math.abs(Math.ceil((props.number * 5) / 100) * 100)]\n }\n}))\n\nconst NumberVisualization = (props) => {\n const classes = useStyles(props)\n const { number } = props\n\n let displayCircle = ''\n\n if (number > 0) {\n displayCircle = (\n <Avatar\n className={clsx(classes.root, classes.positive)}\n style={{\n width: number * 2,\n height: number * 2\n }}\n >\n {number}\n </Avatar>\n )\n } else {\n displayCircle = (\n <Avatar\n className={clsx(classes.root, classes.negative)}\n style={{\n width: number * 2,\n height: number * 2\n }}\n >\n {number}\n </Avatar>\n )\n }\n\n return <Fragment> {displayCircle} </Fragment>\n}\nexport default NumberVisualization\n","import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport NumberVisualization from '../../utils/NumberVisualization'\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n flexDirection: 'row',\n marginTop: theme.spacing(3),\n marginLeft: theme.spacing(2),\n overflow: 'auto'\n },\n dot: {\n width: 10,\n height: 10,\n backgroundColor: 'white',\n borderRadius: theme.shape.borderRadius + 25,\n marginTop: theme.spacing(1)\n },\n timeLabels: {\n color: 'white'\n },\n indicator: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-end',\n marginRight: theme.spacing(2),\n textAlign: 'center',\n alignItems: 'center'\n }\n}))\n\nconst TimeDot = (props) => {\n const classes = useStyles()\n const { dot } = props\n return (\n <div className={classes.indicator}>\n <div className={classes.dot} />\n <div className={classes.timeLabels}>\n <Typography variant='overline'>{dot}</Typography>\n </div>\n </div>\n )\n}\n\nconst Visualization = (props) => {\n const classes = useStyles()\n const { value, label } = props\n return (\n <div className={classes.indicator}>\n <div>\n <NumberVisualization number={value} />\n </div>\n <div>\n <TimeDot dot={label} />\n </div>\n </div>\n )\n}\n\nconst categoriesToDisplay = (categories) =>\n categories.map((item) => {\n return (\n <Visualization key={item.label} value={item.value} label={item.label} />\n )\n })\n\nconst FluentTimeline = (props) => {\n const classes = useStyles()\n const { categories } = props\n\n return <div className={classes.root}>{categoriesToDisplay(categories)}</div>\n}\nexport default FluentTimeline\n"],"mappings":";;;;;AAIA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM;EACJ,UAAU;EACV,WAAW;EACX,UAAU;EACV,WAAW;EAEX,OAAO,OAAO,SAAS,SAAS;EACjC;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,KAAK,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,MACrD;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,WAAW,KAAK,IAAI,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,IAAI,GACxE;CACF,EAAE;AAEH,MAAM,uBAAuB,UAAU;CACrC,MAAM,UAAUA,YAAU,MAAM;CAChC,MAAM,EAAE,WAAW;CAEnB,IAAI,gBAAgB;AAEpB,KAAI,SAAS,EACX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;KAGX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;AAIb,QAAO,oCAAC,gBAAS,KAAE,eAAc,IAAY;;AAE/C,kCAAe;;;;ACrDf,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,SAAS;EACT,eAAe;EACf,WAAW,MAAM,QAAQ,EAAE;EAC3B,YAAY,MAAM,QAAQ,EAAE;EAC5B,UAAU;EACX;CACD,KAAK;EACH,OAAO;EACP,QAAQ;EACR,iBAAiB;EACjB,cAAc,MAAM,MAAM,eAAe;EACzC,WAAW,MAAM,QAAQ,EAAE;EAC5B;CACD,YAAY,EACV,OAAO,SACR;CACD,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC7B,WAAW;EACX,YAAY;EACb;CACF,EAAE;AAEH,MAAM,WAAW,UAAU;CACzB,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,QAAQ;AAChB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,SAAI,WAAW,QAAQ,MAAO,EAC/B,oCAAC,SAAI,WAAW,QAAQ,cACtB,oCAAC,cAAW,SAAQ,cAAY,IAAiB,CAC7C,CACF;;AAIV,MAAM,iBAAiB,UAAU;CAC/B,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,OAAO,UAAU;AACzB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,aACC,oCAACC,+BAAoB,QAAQ,QAAS,CAClC,EACN,oCAAC,aACC,oCAAC,WAAQ,KAAK,QAAS,CACnB,CACF;;AAIV,MAAM,uBAAuB,eAC3B,WAAW,KAAK,SAAS;AACvB,QACE,oCAAC;EAAc,KAAK,KAAK;EAAO,OAAO,KAAK;EAAO,OAAO,KAAK;GAAS;EAE1E;AAEJ,MAAM,kBAAkB,UAAU;CAChC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,eAAe;AAEvB,QAAO,oCAAC,SAAI,WAAW,QAAQ,QAAO,oBAAoB,WAAW,CAAO;;AAE9E,6BAAe"}

package/dist/{GraphCard-Dv4a99wo.js → GraphCard-CcXwOERk.js} RENAMED Viewed

@@ -72,4 +72,4 @@ GraphCard.propTypes = {
 //#endregion
 export { GraphCard as t };
-//# sourceMappingURL=GraphCard-Dv4a99wo.js.map
+//# sourceMappingURL=GraphCard-CcXwOERk.js.map

package/dist/{GraphCard-Dv4a99wo.js.map → GraphCard-CcXwOERk.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GraphCard-~~Dv4a99wo~~.js","names":["PropTypes"],"sources":["../src/UI/dataDisplay/GraphCard/GraphCard.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { PropTypes } from 'prop-types';\nimport { AmbientCard } from '../../surfaces/cards/AmbientCard';\nimport { EmptyStateDisplay } from '../EmptyStateDisplay';\nimport { useTranslation } from 'react-i18next';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles((theme) => ({\n infoPanel: {\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'space-around',\n alignItems: 'center',\n alignSelf: 'stretch',\n padding: '10px 32px'\n },\n graphSection: {\n overflow: 'hidden',\n '& svg': {\n width: '100%',\n height: '100%'\n },\n '& .vega-embed': {\n width: '100%',\n height: '100%'\n },\n paddingTop: theme.spacing(1),\n margin: 0,\n height: (props) => props?.graphHeight ?? '255px'\n },\n emptyStateDisplay: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n }\n}));\n\n/*\n `GraphCard` component\n /\nexport const GraphCard = (props) => {\n const {\n title,\n showInfoPanel = true,\n graphSpecs,\n children,\n headerColor,\n className,\n noData = false,\n emptyStatePrimaryText,\n emptyStateImageSrc,\n emptyStateIconSize,\n emptyStateImageWidth,\n emptyStateClassName,\n emptyStateIcon,\n ...otherProps\n } = props;\n const classes = useStyles(props);\n const { t } = useTranslation();\n\n return (\n <AmbientCard\n fullWidth\n title={title}\n headerColor={headerColor}\n {...otherProps}\n >\n {!noData ? (\n <div>\n {showInfoPanel && <div className={classes.infoPanel}>{children}</div>}\n <div className={classes.graphSection}>\n <MuiVegaLite\n variant='verticalBarChart'\n background='paper'\n autoResize\n actions={false}\n spec={graphSpecs \|\| {}}\n />\n </div>\n </div>\n ) : (\n <div className={clsx(classes.emptyStateDisplay, emptyStateClassName)}>\n <EmptyStateDisplay\n primaryText={emptyStatePrimaryText ?? t('No results found')}\n icon={emptyStateIcon}\n iconSize={emptyStateIconSize}\n imageSrc={emptyStateImageSrc}\n imageWidth={emptyStateImageWidth}\n />\n </div>\n )}\n </AmbientCard>\n );\n};\n\nGraphCard.propTypes = {\n /\n Optional, card title\n /\n title: PropTypes.string,\n\n /\n @type {?object}\n {\n graphSpecs: {} object see an example structure in https://vega.github.io/vega-lite/usage/typescript.html\n }\n /\n graphSpecs: PropTypes.object.isRequired,\n\n /\n Optional, hide or show the top panel\n /\n showInfoPanel: PropTypes.bool,\n\n /\n Optional, content for the info panel behind the graph\n /\n children: PropTypes.node,\n\n /\n Optional, additional properties to apply some styles over the main container\n */\n style: PropTypes.object\n};\n"],"mappings":";;;;;;;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,YAAY;EACZ,WAAW;EACX,SAAS;EACV;CACD,cAAc;EACZ,UAAU;EACV,SAAS;GACP,OAAO;GACP,QAAQ;GACT;EACD,iBAAiB;GACf,OAAO;GACP,QAAQ;GACT;EACD,YAAY,MAAM,QAAQ,EAAE;EAC5B,QAAQ;EACR,SAAS,UAAU,OAAO,eAAe;EAC1C;CACD,mBAAmB;EACjB,WAAW,MAAM,QAAQ,EAAE;EAC3B,cAAc,MAAM,QAAQ,EAAE;EAC/B;CACF,EAAE;;;;AAKH,MAAa,aAAa,UAAU;CAClC,MAAM,EACJ,OACA,gBAAgB,MAChB,YACA,UACA,aACA,WACA,SAAS,OACT,uBACA,oBACA,oBACA,sBACA,qBACA,gBACA,GAAG,eACD;CACJ,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,MAAM,gBAAgB;AAE9B,QACE,oCAAC;EACC;EACO;EACM;EACb,GAAI;IAEH,CAAC,SACA,oCAAC,aACE,iBAAiB,oCAAC,SAAI,WAAW,QAAQ,aAAY,SAAe,EACrE,oCAAC,SAAI,WAAW,QAAQ,gBACtB,oCAAC;EACC,SAAQ;EACR,YAAW;EACX;EACA,SAAS;EACT,MAAM,cAAc,EAAE;GACtB,CACE,CACF,GAEN,oCAAC,SAAI,WAAW,KAAK,QAAQ,mBAAmB,oBAAoB,IAClE,oCAAC;EACC,aAAa,yBAAyB,EAAE,mBAAmB;EAC3D,MAAM;EACN,UAAU;EACV,UAAU;EACV,YAAY;GACZ,CACE,CAEI;;AAIlB,UAAU,YAAY;CAIpB,OAAOA,YAAU;CAQjB,YAAYA,YAAU,OAAO;CAK7B,eAAeA,YAAU;CAKzB,UAAUA,YAAU;CAKpB,OAAOA,YAAU;CAClB"}
1	+ {"version":3,"file":"GraphCard-CcXwOERk.js","names":["PropTypes"],"sources":["../src/UI/dataDisplay/GraphCard/GraphCard.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { PropTypes } from 'prop-types';\nimport { AmbientCard } from '../../surfaces/cards/AmbientCard';\nimport { EmptyStateDisplay } from '../EmptyStateDisplay';\nimport { useTranslation } from 'react-i18next';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles((theme) => ({\n infoPanel: {\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'space-around',\n alignItems: 'center',\n alignSelf: 'stretch',\n padding: '10px 32px'\n },\n graphSection: {\n overflow: 'hidden',\n '& svg': {\n width: '100%',\n height: '100%'\n },\n '& .vega-embed': {\n width: '100%',\n height: '100%'\n },\n paddingTop: theme.spacing(1),\n margin: 0,\n height: (props) => props?.graphHeight ?? '255px'\n },\n emptyStateDisplay: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n }\n}));\n\n/*\n `GraphCard` component\n /\nexport const GraphCard = (props) => {\n const {\n title,\n showInfoPanel = true,\n graphSpecs,\n children,\n headerColor,\n className,\n noData = false,\n emptyStatePrimaryText,\n emptyStateImageSrc,\n emptyStateIconSize,\n emptyStateImageWidth,\n emptyStateClassName,\n emptyStateIcon,\n ...otherProps\n } = props;\n const classes = useStyles(props);\n const { t } = useTranslation();\n\n return (\n <AmbientCard\n fullWidth\n title={title}\n headerColor={headerColor}\n {...otherProps}\n >\n {!noData ? (\n <div>\n {showInfoPanel && <div className={classes.infoPanel}>{children}</div>}\n <div className={classes.graphSection}>\n <MuiVegaLite\n variant='verticalBarChart'\n background='paper'\n autoResize\n actions={false}\n spec={graphSpecs \|\| {}}\n />\n </div>\n </div>\n ) : (\n <div className={clsx(classes.emptyStateDisplay, emptyStateClassName)}>\n <EmptyStateDisplay\n primaryText={emptyStatePrimaryText ?? t('No results found')}\n icon={emptyStateIcon}\n iconSize={emptyStateIconSize}\n imageSrc={emptyStateImageSrc}\n imageWidth={emptyStateImageWidth}\n />\n </div>\n )}\n </AmbientCard>\n );\n};\n\nGraphCard.propTypes = {\n /\n Optional, card title\n /\n title: PropTypes.string,\n\n /\n @type {?object}\n {\n graphSpecs: {} object see an example structure in https://vega.github.io/vega-lite/usage/typescript.html\n }\n /\n graphSpecs: PropTypes.object.isRequired,\n\n /\n Optional, hide or show the top panel\n /\n showInfoPanel: PropTypes.bool,\n\n /\n Optional, content for the info panel behind the graph\n /\n children: PropTypes.node,\n\n /\n Optional, additional properties to apply some styles over the main container\n */\n style: PropTypes.object\n};\n"],"mappings":";;;;;;;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,YAAY;EACZ,WAAW;EACX,SAAS;EACV;CACD,cAAc;EACZ,UAAU;EACV,SAAS;GACP,OAAO;GACP,QAAQ;GACT;EACD,iBAAiB;GACf,OAAO;GACP,QAAQ;GACT;EACD,YAAY,MAAM,QAAQ,EAAE;EAC5B,QAAQ;EACR,SAAS,UAAU,OAAO,eAAe;EAC1C;CACD,mBAAmB;EACjB,WAAW,MAAM,QAAQ,EAAE;EAC3B,cAAc,MAAM,QAAQ,EAAE;EAC/B;CACF,EAAE;;;;AAKH,MAAa,aAAa,UAAU;CAClC,MAAM,EACJ,OACA,gBAAgB,MAChB,YACA,UACA,aACA,WACA,SAAS,OACT,uBACA,oBACA,oBACA,sBACA,qBACA,gBACA,GAAG,eACD;CACJ,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,MAAM,gBAAgB;AAE9B,QACE,oCAAC;EACC;EACO;EACM;EACb,GAAI;IAEH,CAAC,SACA,oCAAC,aACE,iBAAiB,oCAAC,SAAI,WAAW,QAAQ,aAAY,SAAe,EACrE,oCAAC,SAAI,WAAW,QAAQ,gBACtB,oCAAC;EACC,SAAQ;EACR,YAAW;EACX;EACA,SAAS;EACT,MAAM,cAAc,EAAE;GACtB,CACE,CACF,GAEN,oCAAC,SAAI,WAAW,KAAK,QAAQ,mBAAmB,oBAAoB,IAClE,oCAAC;EACC,aAAa,yBAAyB,EAAE,mBAAmB;EAC3D,MAAM;EACN,UAAU;EACV,UAAU;EACV,YAAY;GACZ,CACE,CAEI;;AAIlB,UAAU,YAAY;CAIpB,OAAOA,YAAU;CAQjB,YAAYA,YAAU,OAAO;CAK7B,eAAeA,YAAU;CAKzB,UAAUA,YAAU;CAKpB,OAAOA,YAAU;CAClB"}