@perses-dev/components 0.54.0-beta.0 → 0.54.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AlignSelector/AlignSelector.js +1 -1
- package/dist/AlignSelector/AlignSelector.js.map +1 -1
- package/dist/ColorPicker/ColorPicker.js +1 -1
- package/dist/ColorPicker/ColorPicker.js.map +1 -1
- package/dist/ColorPicker/OptionsColorPicker.js +1 -1
- package/dist/ColorPicker/OptionsColorPicker.js.map +1 -1
- package/dist/ContentWithLegend/ContentWithLegend.js +1 -1
- package/dist/ContentWithLegend/ContentWithLegend.js.map +1 -1
- package/dist/ContentWithLegend/model/content-with-legend-model.d.ts +1 -1
- package/dist/ContentWithLegend/model/content-with-legend-model.d.ts.map +1 -1
- package/dist/ContentWithLegend/model/content-with-legend-model.js +1 -1
- package/dist/ContentWithLegend/model/content-with-legend-model.js.map +1 -1
- package/dist/Dialog/DiscardChangesConfirmationDialog.js +1 -1
- package/dist/Dialog/DiscardChangesConfirmationDialog.js.map +1 -1
- package/dist/DragAndDrop/DragAndDropList.js +1 -1
- package/dist/DragAndDrop/DragAndDropList.js.map +1 -1
- package/dist/DragAndDrop/DragButton.js +1 -1
- package/dist/DragAndDrop/DragButton.js.map +1 -1
- package/dist/DragAndDrop/DropIndicator.js +1 -1
- package/dist/DragAndDrop/DropIndicator.js.map +1 -1
- package/dist/Drawer/Drawer.js +1 -1
- package/dist/Drawer/Drawer.js.map +1 -1
- package/dist/EChart/EChart.js +1 -1
- package/dist/EChart/EChart.js.map +1 -1
- package/dist/ErrorAlert.js +1 -1
- package/dist/ErrorAlert.js.map +1 -1
- package/dist/FormEditor/FormActions.d.ts +1 -1
- package/dist/FormEditor/FormActions.d.ts.map +1 -1
- package/dist/FormEditor/FormActions.js +1 -1
- package/dist/FormEditor/FormActions.js.map +1 -1
- package/dist/FormatControls/FormatControls.d.ts +1 -1
- package/dist/FormatControls/FormatControls.d.ts.map +1 -1
- package/dist/FormatControls/FormatControls.js +2 -2
- package/dist/FormatControls/FormatControls.js.map +1 -1
- package/dist/FormatControls/UnitSelector.d.ts +1 -1
- package/dist/FormatControls/UnitSelector.d.ts.map +1 -1
- package/dist/FormatControls/UnitSelector.js +1 -1
- package/dist/FormatControls/UnitSelector.js.map +1 -1
- package/dist/JSONEditor.js +1 -1
- package/dist/JSONEditor.js.map +1 -1
- package/dist/Legend/CompactLegend.js +1 -1
- package/dist/Legend/CompactLegend.js.map +1 -1
- package/dist/Legend/Legend.js +2 -2
- package/dist/Legend/Legend.js.map +1 -1
- package/dist/Legend/LegendColorBadge.js +1 -1
- package/dist/Legend/LegendColorBadge.js.map +1 -1
- package/dist/Legend/ListLegend.js +1 -1
- package/dist/Legend/ListLegend.js.map +1 -1
- package/dist/Legend/ListLegendItem.js +1 -1
- package/dist/Legend/ListLegendItem.js.map +1 -1
- package/dist/Legend/TableLegend.d.ts.map +1 -1
- package/dist/Legend/TableLegend.js +18 -4
- package/dist/Legend/TableLegend.js.map +1 -1
- package/dist/Legend/legend-model.d.ts +1 -1
- package/dist/Legend/legend-model.d.ts.map +1 -1
- package/dist/Legend/legend-model.js.map +1 -1
- package/dist/LinksEditor/LinkEditorForm.js +1 -1
- package/dist/LinksEditor/LinkEditorForm.js.map +1 -1
- package/dist/LinksEditor/LinksEditor.js +1 -1
- package/dist/LinksEditor/LinksEditor.js.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorColumn.js +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorColumn.js.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorControl.js +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorControl.js.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorGrid.js +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorGrid.js.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorGroup.js +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorGroup.js.map +1 -1
- package/dist/Overlay/Overlay.js +1 -1
- package/dist/Overlay/Overlay.js.map +1 -1
- package/dist/RefreshIntervalPicker/RefreshIntervalPicker.js +1 -1
- package/dist/RefreshIntervalPicker/RefreshIntervalPicker.js.map +1 -1
- package/dist/SettingsAutocomplete/SettingsAutocomplete.js +1 -1
- package/dist/SettingsAutocomplete/SettingsAutocomplete.js.map +1 -1
- package/dist/SortSelector/SortSelectorButtons.js +1 -1
- package/dist/SortSelector/SortSelectorButtons.js.map +1 -1
- package/dist/Table/InnerTable.js +1 -1
- package/dist/Table/InnerTable.js.map +1 -1
- package/dist/Table/Table.d.ts +1 -1
- package/dist/Table/Table.d.ts.map +1 -1
- package/dist/Table/Table.js +47 -14
- package/dist/Table/Table.js.map +1 -1
- package/dist/Table/TableBody.js +1 -1
- package/dist/Table/TableBody.js.map +1 -1
- package/dist/Table/TableCell.js +1 -1
- package/dist/Table/TableCell.js.map +1 -1
- package/dist/Table/TableCheckbox.js +1 -1
- package/dist/Table/TableCheckbox.js.map +1 -1
- package/dist/Table/TableFoot.js +1 -1
- package/dist/Table/TableFoot.js.map +1 -1
- package/dist/Table/TableHead.js +1 -1
- package/dist/Table/TableHead.js.map +1 -1
- package/dist/Table/TableHeaderCell.d.ts +20 -1
- package/dist/Table/TableHeaderCell.d.ts.map +1 -1
- package/dist/Table/TableHeaderCell.js +56 -24
- package/dist/Table/TableHeaderCell.js.map +1 -1
- package/dist/Table/TableRow.js +1 -1
- package/dist/Table/TableRow.js.map +1 -1
- package/dist/Table/TableToolbar.d.ts +46 -0
- package/dist/Table/TableToolbar.d.ts.map +1 -0
- package/dist/Table/TableToolbar.js +138 -0
- package/dist/Table/TableToolbar.js.map +1 -0
- package/dist/Table/VirtualizedTable.d.ts +7 -3
- package/dist/Table/VirtualizedTable.d.ts.map +1 -1
- package/dist/Table/VirtualizedTable.js +157 -123
- package/dist/Table/VirtualizedTable.js.map +1 -1
- package/dist/Table/VirtualizedTableContainer.d.ts.map +1 -1
- package/dist/Table/VirtualizedTableContainer.js +6 -2
- package/dist/Table/VirtualizedTableContainer.js.map +1 -1
- package/dist/Table/hooks/useFuzzySearch.d.ts +14 -0
- package/dist/Table/hooks/useFuzzySearch.d.ts.map +1 -0
- package/dist/Table/hooks/useFuzzySearch.js +62 -0
- package/dist/Table/hooks/useFuzzySearch.js.map +1 -0
- package/dist/Table/model/table-model.d.ts +78 -4
- package/dist/Table/model/table-model.d.ts.map +1 -1
- package/dist/Table/model/table-model.js +37 -19
- package/dist/Table/model/table-model.js.map +1 -1
- package/dist/ThresholdsEditor/ThresholdInput.d.ts +1 -1
- package/dist/ThresholdsEditor/ThresholdInput.d.ts.map +1 -1
- package/dist/ThresholdsEditor/ThresholdInput.js +1 -1
- package/dist/ThresholdsEditor/ThresholdInput.js.map +1 -1
- package/dist/ThresholdsEditor/ThresholdsEditor.d.ts +1 -1
- package/dist/ThresholdsEditor/ThresholdsEditor.d.ts.map +1 -1
- package/dist/ThresholdsEditor/ThresholdsEditor.js +1 -1
- package/dist/ThresholdsEditor/ThresholdsEditor.js.map +1 -1
- package/dist/TimeRangeSelector/DateTimeRangePicker.js +1 -1
- package/dist/TimeRangeSelector/DateTimeRangePicker.js.map +1 -1
- package/dist/TimeRangeSelector/TimeRangeSelector.d.ts.map +1 -1
- package/dist/TimeRangeSelector/TimeRangeSelector.js +25 -2
- package/dist/TimeRangeSelector/TimeRangeSelector.js.map +1 -1
- package/dist/TimeSeriesTooltip/SeriesInfo.js +1 -1
- package/dist/TimeSeriesTooltip/SeriesInfo.js.map +1 -1
- package/dist/TimeSeriesTooltip/SeriesLabelsStack.js +1 -1
- package/dist/TimeSeriesTooltip/SeriesLabelsStack.js.map +1 -1
- package/dist/TimeSeriesTooltip/SeriesMarker.js +1 -1
- package/dist/TimeSeriesTooltip/SeriesMarker.js.map +1 -1
- package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts +1 -2
- package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/TimeChartTooltip.js +1 -1
- package/dist/TimeSeriesTooltip/TimeChartTooltip.js.map +1 -1
- package/dist/TimeSeriesTooltip/TooltipContent.js +1 -1
- package/dist/TimeSeriesTooltip/TooltipContent.js.map +1 -1
- package/dist/TimeSeriesTooltip/TooltipHeader.js +1 -1
- package/dist/TimeSeriesTooltip/TooltipHeader.js.map +1 -1
- package/dist/TimeSeriesTooltip/nearby-series.d.ts +2 -2
- package/dist/TimeSeriesTooltip/nearby-series.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/nearby-series.js +1 -2
- package/dist/TimeSeriesTooltip/nearby-series.js.map +1 -1
- package/dist/TimeZoneSelector.js +1 -1
- package/dist/TimeZoneSelector.js.map +1 -1
- package/dist/ToolbarIconButton/ToolbarIconButton.js +1 -1
- package/dist/ToolbarIconButton/ToolbarIconButton.js.map +1 -1
- package/dist/TransformsEditor/TransformEditor.d.ts +1 -1
- package/dist/TransformsEditor/TransformEditor.d.ts.map +1 -1
- package/dist/TransformsEditor/TransformEditor.js +1 -1
- package/dist/TransformsEditor/TransformEditor.js.map +1 -1
- package/dist/TransformsEditor/TransformEditorContainer.d.ts.map +1 -1
- package/dist/TransformsEditor/TransformEditorContainer.js +2 -2
- package/dist/TransformsEditor/TransformEditorContainer.js.map +1 -1
- package/dist/TransformsEditor/TransformsEditor.d.ts +1 -1
- package/dist/TransformsEditor/TransformsEditor.d.ts.map +1 -1
- package/dist/TransformsEditor/TransformsEditor.js +1 -1
- package/dist/TransformsEditor/TransformsEditor.js.map +1 -1
- package/dist/ValueMappingEditor/ValueMappingEditor.d.ts +1 -1
- package/dist/ValueMappingEditor/ValueMappingEditor.d.ts.map +1 -1
- package/dist/ValueMappingEditor/ValueMappingEditor.js +1 -1
- package/dist/ValueMappingEditor/ValueMappingEditor.js.map +1 -1
- package/dist/ValueMappingEditor/ValueMappingsEditor.d.ts +1 -1
- package/dist/ValueMappingEditor/ValueMappingsEditor.d.ts.map +1 -1
- package/dist/ValueMappingEditor/ValueMappingsEditor.js +1 -1
- package/dist/ValueMappingEditor/ValueMappingsEditor.js.map +1 -1
- package/dist/YAxisLabel.js +1 -1
- package/dist/YAxisLabel.js.map +1 -1
- package/dist/cjs/ContentWithLegend/ContentWithLegend.js +2 -2
- package/dist/cjs/ContentWithLegend/model/content-with-legend-model.js +2 -2
- package/dist/cjs/FormatControls/FormatControls.js +4 -4
- package/dist/cjs/FormatControls/UnitSelector.js +3 -3
- package/dist/cjs/Legend/Legend.js +2 -2
- package/dist/cjs/Legend/TableLegend.js +16 -2
- package/dist/cjs/Table/Table.js +44 -11
- package/dist/cjs/Table/TableHeaderCell.js +54 -22
- package/dist/cjs/Table/TableToolbar.js +151 -0
- package/dist/cjs/Table/VirtualizedTable.js +155 -121
- package/dist/cjs/Table/VirtualizedTableContainer.js +5 -1
- package/dist/cjs/Table/hooks/useFuzzySearch.js +67 -0
- package/dist/cjs/Table/model/table-model.js +43 -19
- package/dist/cjs/TimeRangeSelector/TimeRangeSelector.js +23 -0
- package/dist/cjs/TimeSeriesTooltip/nearby-series.js +2 -3
- package/dist/cjs/TransformsEditor/TransformEditorContainer.js +2 -2
- package/dist/cjs/model/action.js +43 -0
- package/dist/cjs/model/bits.js +113 -0
- package/dist/cjs/model/bytes.js +115 -0
- package/dist/cjs/model/constants.js +23 -0
- package/dist/cjs/model/currency.js +126 -0
- package/dist/cjs/model/date.js +297 -0
- package/dist/cjs/model/decimal.js +72 -0
- package/dist/cjs/model/formatterCache.js +120 -0
- package/dist/cjs/model/index.js +17 -0
- package/dist/cjs/model/legend.js +101 -0
- package/dist/cjs/model/percent.js +82 -0
- package/dist/cjs/model/temperature.js +72 -0
- package/dist/cjs/model/thresholds.js +16 -0
- package/dist/cjs/model/throughput.js +161 -0
- package/dist/cjs/model/time.js +178 -0
- package/dist/cjs/model/transforms.js +29 -0
- package/dist/cjs/model/types.js +16 -0
- package/dist/cjs/model/units.js +186 -0
- package/dist/cjs/model/utils.js +48 -0
- package/dist/cjs/model/value-mapping.js +16 -0
- package/dist/cjs/theme/typography.js +1 -1
- package/dist/cjs/utils/axis.js +5 -5
- package/dist/cjs/utils/format.js +20 -0
- package/dist/cjs/utils/index.js +1 -0
- package/dist/cjs/utils/request-interpolation.js +49 -0
- package/dist/context/ChartsProvider.js +1 -1
- package/dist/context/ChartsProvider.js.map +1 -1
- package/dist/context/ItemActionsProvider.js +1 -1
- package/dist/context/ItemActionsProvider.js.map +1 -1
- package/dist/context/SelectionProvider.js +1 -1
- package/dist/context/SelectionProvider.js.map +1 -1
- package/dist/context/SnackbarProvider.js +1 -1
- package/dist/context/SnackbarProvider.js.map +1 -1
- package/dist/context/TimeZoneProvider.js +1 -1
- package/dist/context/TimeZoneProvider.js.map +1 -1
- package/dist/controls/TextField.js +1 -1
- package/dist/controls/TextField.js.map +1 -1
- package/dist/model/action.d.ts +4 -0
- package/dist/model/action.d.ts.map +1 -0
- package/dist/model/action.js +27 -0
- package/dist/model/action.js.map +1 -0
- package/dist/model/bits.d.ts +12 -0
- package/dist/model/bits.d.ts.map +1 -0
- package/dist/model/bits.js +89 -0
- package/dist/model/bits.js.map +1 -0
- package/dist/model/bytes.d.ts +12 -0
- package/dist/model/bytes.d.ts.map +1 -0
- package/dist/model/bytes.js +91 -0
- package/dist/model/bytes.js.map +1 -0
- package/dist/model/constants.d.ts +2 -0
- package/dist/model/constants.d.ts.map +1 -0
- package/dist/model/constants.js +15 -0
- package/dist/model/constants.js.map +1 -0
- package/dist/model/currency.d.ts +11 -0
- package/dist/model/currency.d.ts.map +1 -0
- package/dist/model/currency.js +107 -0
- package/dist/model/currency.js.map +1 -0
- package/dist/model/date.d.ts +28 -0
- package/dist/model/date.d.ts.map +1 -0
- package/dist/model/date.js +278 -0
- package/dist/model/date.js.map +1 -0
- package/dist/model/decimal.d.ts +12 -0
- package/dist/model/decimal.d.ts.map +1 -0
- package/dist/model/decimal.js +53 -0
- package/dist/model/decimal.js.map +1 -0
- package/dist/model/formatterCache.d.ts +11 -0
- package/dist/model/formatterCache.d.ts.map +1 -0
- package/dist/model/formatterCache.js +104 -0
- package/dist/model/formatterCache.js.map +1 -0
- package/dist/model/index.d.ts +17 -0
- package/dist/model/index.d.ts.map +1 -1
- package/dist/model/index.js +17 -0
- package/dist/model/index.js.map +1 -1
- package/dist/model/legend.d.ts +19 -0
- package/dist/model/legend.d.ts.map +1 -0
- package/dist/model/legend.js +61 -0
- package/dist/model/legend.js.map +1 -0
- package/dist/model/percent.d.ts +11 -0
- package/dist/model/percent.d.ts.map +1 -0
- package/dist/model/percent.js +63 -0
- package/dist/model/percent.js.map +1 -0
- package/dist/model/temperature.d.ts +11 -0
- package/dist/model/temperature.d.ts.map +1 -0
- package/dist/model/temperature.js +53 -0
- package/dist/model/temperature.js.map +1 -0
- package/dist/model/theme.d.ts +1 -1
- package/dist/model/theme.d.ts.map +1 -1
- package/dist/model/theme.js.map +1 -1
- package/dist/model/thresholds.d.ts +16 -0
- package/dist/model/thresholds.d.ts.map +1 -0
- package/dist/model/thresholds.js +15 -0
- package/dist/model/thresholds.js.map +1 -0
- package/dist/model/throughput.d.ts +12 -0
- package/dist/model/throughput.d.ts.map +1 -0
- package/dist/model/throughput.js +142 -0
- package/dist/model/throughput.js.map +1 -0
- package/dist/model/time.d.ts +23 -0
- package/dist/model/time.d.ts.map +1 -0
- package/dist/model/time.js +158 -0
- package/dist/model/time.js.map +1 -0
- package/dist/model/transforms.d.ts +43 -0
- package/dist/model/transforms.d.ts.map +1 -0
- package/dist/model/transforms.js +22 -0
- package/dist/model/transforms.js.map +1 -0
- package/dist/model/types.d.ts +56 -0
- package/dist/model/types.d.ts.map +1 -0
- package/dist/model/types.js +15 -0
- package/dist/model/types.js.map +1 -0
- package/dist/model/units.d.ts +105 -0
- package/dist/model/units.d.ts.map +1 -0
- package/dist/model/units.js +132 -0
- package/dist/model/units.js.map +1 -0
- package/dist/model/utils.d.ts +4 -0
- package/dist/model/utils.d.ts.map +1 -0
- package/dist/model/utils.js +32 -0
- package/dist/model/utils.js.map +1 -0
- package/dist/model/value-mapping.d.ts +35 -0
- package/dist/model/value-mapping.d.ts.map +1 -0
- package/dist/model/value-mapping.js +15 -0
- package/dist/model/value-mapping.js.map +1 -0
- package/dist/test/render.js +1 -1
- package/dist/test/render.js.map +1 -1
- package/dist/theme/typography.js +1 -1
- package/dist/theme/typography.js.map +1 -1
- package/dist/utils/axis.d.ts +1 -1
- package/dist/utils/axis.d.ts.map +1 -1
- package/dist/utils/axis.js +1 -1
- package/dist/utils/axis.js.map +1 -1
- package/dist/utils/format.d.ts +1 -0
- package/dist/utils/format.d.ts.map +1 -1
- package/dist/utils/format.js +17 -0
- package/dist/utils/format.js.map +1 -1
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +1 -0
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/request-interpolation.d.ts +6 -0
- package/dist/utils/request-interpolation.d.ts.map +1 -0
- package/dist/utils/request-interpolation.js +33 -0
- package/dist/utils/request-interpolation.js.map +1 -0
- package/package.json +4 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/LinksEditor/LinksEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Fragment, HTMLAttributes, ReactElement } from 'react';\nimport { Divider, IconButton, Stack, Typography } from '@mui/material';\nimport { Controller, useFieldArray, Control } from 'react-hook-form';\nimport PlusIcon from 'mdi-material-ui/Plus';\nimport MinusIcon from 'mdi-material-ui/Minus';\nimport { PanelEditorValues } from '@perses-dev/spec';\nimport { LinkEditorForm } from './LinkEditorForm';\n\nexport interface LinksEditorProps extends HTMLAttributes<HTMLDivElement> {\n control: Control<PanelEditorValues>;\n}\n\nexport function LinksEditor({ control, ...props }: LinksEditorProps): ReactElement {\n const { fields, append, remove } = useFieldArray({\n control: control,\n name: 'panelDefinition.spec.links',\n });\n\n return (\n <Stack {...props} gap={3}>\n {fields && fields.length > 0 ? (\n fields.map((field, index) => (\n <Fragment key={field.id}>\n <Stack direction=\"row\" gap={1} alignItems=\"center\">\n <LinkControl control={control} index={index} />\n <IconButton style={{ width: 'fit-content', height: 'fit-content' }} onClick={() => remove(index)}>\n <MinusIcon />\n </IconButton>\n </Stack>\n <Divider />\n </Fragment>\n ))\n ) : (\n <Typography variant=\"subtitle1\" mb={2} fontStyle=\"italic\">\n No links defined\n </Typography>\n )}\n <IconButton\n style={{ width: 'fit-content', height: 'fit-content' }}\n onClick={() => append({ url: '', name: '', tooltip: '', renderVariables: false, targetBlank: false })}\n >\n <PlusIcon />\n </IconButton>\n </Stack>\n );\n}\n\nfunction LinkControl({ control, index }: { control: Control<PanelEditorValues>; index: number }): ReactElement {\n const defaultLink = { url: '', name: '', tooltip: '', renderVariables: false, targetBlank: false };\n return (\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}`}\n render={({ field, field: { value: link }, fieldState }) => {\n const safeLink = link ?? defaultLink;\n return (\n <LinkEditorForm\n mode=\"inline\"\n url={{\n value: safeLink.url,\n label: 'URL',\n error: { hasError: !!fieldState.error, helperText: fieldState.error?.message },\n onChange: (url) => {\n field.onChange({ ...link, url });\n },\n }}\n newTabOpen={{\n value: !!safeLink.targetBlank,\n onChange: (targetBlank) => {\n field.onChange({ ...link, targetBlank });\n },\n label: 'Open in new tab',\n }}\n name={{\n value: safeLink.name ?? '',\n label: 'Name',\n onChange: (name) => {\n field.onChange({ ...link, name });\n },\n }}\n renderVariables={{\n value: !!safeLink.renderVariables,\n label: 'Render variables',\n onChange: (renderVariables) => {\n field.onChange({ ...link, renderVariables });\n },\n }}\n tooltip={{\n value: safeLink.tooltip ?? '',\n label: 'Tooltip',\n onChange: (tooltip) => {\n field.onChange({ ...link, tooltip });\n },\n }}\n />\n );\n }}\n />\n );\n}\n"],"names":["Fragment","Divider","IconButton","Stack","Typography","Controller","useFieldArray","PlusIcon","MinusIcon","LinkEditorForm","LinksEditor","control","props","fields","append","remove","name","gap","length","map","field","index","direction","alignItems","LinkControl","style","width","height","onClick","id","variant","mb","fontStyle","url","tooltip","renderVariables","targetBlank","defaultLink","render","value","link","fieldState","safeLink","mode","label","error","hasError","helperText","message","onChange","newTabOpen"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/LinksEditor/LinksEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Fragment, HTMLAttributes, ReactElement } from 'react';\nimport { Divider, IconButton, Stack, Typography } from '@mui/material';\nimport { Controller, useFieldArray, Control } from 'react-hook-form';\nimport PlusIcon from 'mdi-material-ui/Plus';\nimport MinusIcon from 'mdi-material-ui/Minus';\nimport { PanelEditorValues } from '@perses-dev/spec';\nimport { LinkEditorForm } from './LinkEditorForm';\n\nexport interface LinksEditorProps extends HTMLAttributes<HTMLDivElement> {\n control: Control<PanelEditorValues>;\n}\n\nexport function LinksEditor({ control, ...props }: LinksEditorProps): ReactElement {\n const { fields, append, remove } = useFieldArray({\n control: control,\n name: 'panelDefinition.spec.links',\n });\n\n return (\n <Stack {...props} gap={3}>\n {fields && fields.length > 0 ? (\n fields.map((field, index) => (\n <Fragment key={field.id}>\n <Stack direction=\"row\" gap={1} alignItems=\"center\">\n <LinkControl control={control} index={index} />\n <IconButton style={{ width: 'fit-content', height: 'fit-content' }} onClick={() => remove(index)}>\n <MinusIcon />\n </IconButton>\n </Stack>\n <Divider />\n </Fragment>\n ))\n ) : (\n <Typography variant=\"subtitle1\" mb={2} fontStyle=\"italic\">\n No links defined\n </Typography>\n )}\n <IconButton\n style={{ width: 'fit-content', height: 'fit-content' }}\n onClick={() => append({ url: '', name: '', tooltip: '', renderVariables: false, targetBlank: false })}\n >\n <PlusIcon />\n </IconButton>\n </Stack>\n );\n}\n\nfunction LinkControl({ control, index }: { control: Control<PanelEditorValues>; index: number }): ReactElement {\n const defaultLink = { url: '', name: '', tooltip: '', renderVariables: false, targetBlank: false };\n return (\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}`}\n render={({ field, field: { value: link }, fieldState }) => {\n const safeLink = link ?? defaultLink;\n return (\n <LinkEditorForm\n mode=\"inline\"\n url={{\n value: safeLink.url,\n label: 'URL',\n error: { hasError: !!fieldState.error, helperText: fieldState.error?.message },\n onChange: (url) => {\n field.onChange({ ...link, url });\n },\n }}\n newTabOpen={{\n value: !!safeLink.targetBlank,\n onChange: (targetBlank) => {\n field.onChange({ ...link, targetBlank });\n },\n label: 'Open in new tab',\n }}\n name={{\n value: safeLink.name ?? '',\n label: 'Name',\n onChange: (name) => {\n field.onChange({ ...link, name });\n },\n }}\n renderVariables={{\n value: !!safeLink.renderVariables,\n label: 'Render variables',\n onChange: (renderVariables) => {\n field.onChange({ ...link, renderVariables });\n },\n }}\n tooltip={{\n value: safeLink.tooltip ?? '',\n label: 'Tooltip',\n onChange: (tooltip) => {\n field.onChange({ ...link, tooltip });\n },\n }}\n />\n );\n }}\n />\n );\n}\n"],"names":["Fragment","Divider","IconButton","Stack","Typography","Controller","useFieldArray","PlusIcon","MinusIcon","LinkEditorForm","LinksEditor","control","props","fields","append","remove","name","gap","length","map","field","index","direction","alignItems","LinkControl","style","width","height","onClick","id","variant","mb","fontStyle","url","tooltip","renderVariables","targetBlank","defaultLink","render","value","link","fieldState","safeLink","mode","label","error","hasError","helperText","message","onChange","newTabOpen"],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
14
|
import { Grid, Stack } from '@mui/material';
|
|
15
15
|
/**
|
|
16
16
|
* Lay out content in a column within panel options.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorColumn.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Grid, Stack } from '@mui/material';\nimport { ReactElement } from 'react';\n\nexport type OptionsEditorColumnProps = {\n /**\n * Components to render in the column. These will usually be\n * `OptionsEditorGroup` components.\n */\n children: React.ReactNode;\n};\n\n/**\n * Lay out content in a column within panel options.\n */\nexport const OptionsEditorColumn = ({ children }: OptionsEditorColumnProps): ReactElement => {\n return (\n <Grid item xs={4}>\n <Stack spacing={3}>{children}</Stack>\n </Grid>\n );\n};\n"],"names":["Grid","Stack","OptionsEditorColumn","children","item","xs","spacing"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorColumn.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Grid, Stack } from '@mui/material';\nimport { ReactElement } from 'react';\n\nexport type OptionsEditorColumnProps = {\n /**\n * Components to render in the column. These will usually be\n * `OptionsEditorGroup` components.\n */\n children: React.ReactNode;\n};\n\n/**\n * Lay out content in a column within panel options.\n */\nexport const OptionsEditorColumn = ({ children }: OptionsEditorColumnProps): ReactElement => {\n return (\n <Grid item xs={4}>\n <Stack spacing={3}>{children}</Stack>\n </Grid>\n );\n};\n"],"names":["Grid","Stack","OptionsEditorColumn","children","item","xs","spacing"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,IAAI,EAAEC,KAAK,QAAQ,gBAAgB;AAW5C;;CAEC,GACD,OAAO,MAAMC,sBAAsB,CAAC,EAAEC,QAAQ,EAA4B;IACxE,qBACE,KAACH;QAAKI,IAAI;QAACC,IAAI;kBACb,cAAA,KAACJ;YAAMK,SAAS;sBAAIH;;;AAG1B,EAAE"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
14
|
import { FormControl, FormLabel, Stack, Box, IconButton } from '@mui/material';
|
|
15
15
|
import React from 'react';
|
|
16
16
|
import InformationOutlineIcon from 'mdi-material-ui/InformationOutline';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorControl.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { FormControl, FormLabel, FormControlLabelProps, Stack, Box, IconButton } from '@mui/material';\nimport React, { ReactElement } from 'react';\nimport InformationOutlineIcon from 'mdi-material-ui/InformationOutline';\nimport { useId } from '../utils';\nimport { InfoTooltip } from '../InfoTooltip';\n\nexport type OptionsEditorControlProps = Pick<FormControlLabelProps, 'label' | 'control'> & {\n description?: string;\n};\n\nexport const OptionsEditorControl = ({ label, control, description }: OptionsEditorControlProps): ReactElement => {\n // Make sure we have a unique ID we can use for associating labels and\n // controls for a11y.\n const generatedControlId = useId('EditorSectionControl');\n const controlId = `${generatedControlId}-control`;\n const labelId = `${generatedControlId}-label`;\n\n const controlProps = {\n id: controlId,\n 'aria-labelledby': labelId,\n };\n\n return (\n <FormControl>\n <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\">\n <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"center\">\n <FormLabel id={labelId} htmlFor={controlId}>\n {label}\n </FormLabel>\n {description && (\n <InfoTooltip description={description} enterDelay={100}>\n <IconButton\n size=\"small\"\n sx={(theme) => ({ borderRadius: theme.shape.borderRadius, padding: '4x', margin: '0 2px' })}\n >\n <InformationOutlineIcon\n aria-describedby=\"info-tooltip\"\n aria-hidden={false}\n fontSize=\"inherit\"\n sx={{ color: (theme) => theme.palette.grey[700] }}\n />\n </IconButton>\n </InfoTooltip>\n )}\n </Stack>\n <Box sx={{ width: '180px', textAlign: 'right' }}> {React.cloneElement(control, controlProps)}</Box>\n </Stack>\n </FormControl>\n );\n};\n"],"names":["FormControl","FormLabel","Stack","Box","IconButton","React","InformationOutlineIcon","useId","InfoTooltip","OptionsEditorControl","label","control","description","generatedControlId","controlId","labelId","controlProps","id","direction","alignItems","justifyContent","htmlFor","enterDelay","size","sx","theme","borderRadius","shape","padding","margin","aria-describedby","aria-hidden","fontSize","color","palette","grey","width","textAlign","cloneElement"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorControl.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { FormControl, FormLabel, FormControlLabelProps, Stack, Box, IconButton } from '@mui/material';\nimport React, { ReactElement } from 'react';\nimport InformationOutlineIcon from 'mdi-material-ui/InformationOutline';\nimport { useId } from '../utils';\nimport { InfoTooltip } from '../InfoTooltip';\n\nexport type OptionsEditorControlProps = Pick<FormControlLabelProps, 'label' | 'control'> & {\n description?: string;\n};\n\nexport const OptionsEditorControl = ({ label, control, description }: OptionsEditorControlProps): ReactElement => {\n // Make sure we have a unique ID we can use for associating labels and\n // controls for a11y.\n const generatedControlId = useId('EditorSectionControl');\n const controlId = `${generatedControlId}-control`;\n const labelId = `${generatedControlId}-label`;\n\n const controlProps = {\n id: controlId,\n 'aria-labelledby': labelId,\n };\n\n return (\n <FormControl>\n <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\">\n <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"center\">\n <FormLabel id={labelId} htmlFor={controlId}>\n {label}\n </FormLabel>\n {description && (\n <InfoTooltip description={description} enterDelay={100}>\n <IconButton\n size=\"small\"\n sx={(theme) => ({ borderRadius: theme.shape.borderRadius, padding: '4x', margin: '0 2px' })}\n >\n <InformationOutlineIcon\n aria-describedby=\"info-tooltip\"\n aria-hidden={false}\n fontSize=\"inherit\"\n sx={{ color: (theme) => theme.palette.grey[700] }}\n />\n </IconButton>\n </InfoTooltip>\n )}\n </Stack>\n <Box sx={{ width: '180px', textAlign: 'right' }}> {React.cloneElement(control, controlProps)}</Box>\n </Stack>\n </FormControl>\n );\n};\n"],"names":["FormControl","FormLabel","Stack","Box","IconButton","React","InformationOutlineIcon","useId","InfoTooltip","OptionsEditorControl","label","control","description","generatedControlId","controlId","labelId","controlProps","id","direction","alignItems","justifyContent","htmlFor","enterDelay","size","sx","theme","borderRadius","shape","padding","margin","aria-describedby","aria-hidden","fontSize","color","palette","grey","width","textAlign","cloneElement"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,WAAW,EAAEC,SAAS,EAAyBC,KAAK,EAAEC,GAAG,EAAEC,UAAU,QAAQ,gBAAgB;AACtG,OAAOC,WAA6B,QAAQ;AAC5C,OAAOC,4BAA4B,qCAAqC;AACxE,SAASC,KAAK,QAAQ,WAAW;AACjC,SAASC,WAAW,QAAQ,iBAAiB;AAM7C,OAAO,MAAMC,uBAAuB,CAAC,EAAEC,KAAK,EAAEC,OAAO,EAAEC,WAAW,EAA6B;IAC7F,sEAAsE;IACtE,qBAAqB;IACrB,MAAMC,qBAAqBN,MAAM;IACjC,MAAMO,YAAY,GAAGD,mBAAmB,QAAQ,CAAC;IACjD,MAAME,UAAU,GAAGF,mBAAmB,MAAM,CAAC;IAE7C,MAAMG,eAAe;QACnBC,IAAIH;QACJ,mBAAmBC;IACrB;IAEA,qBACE,KAACf;kBACC,cAAA,MAACE;YAAMgB,WAAU;YAAMC,YAAW;YAASC,gBAAe;;8BACxD,MAAClB;oBAAMgB,WAAU;oBAAMC,YAAW;oBAASC,gBAAe;;sCACxD,KAACnB;4BAAUgB,IAAIF;4BAASM,SAASP;sCAC9BJ;;wBAEFE,6BACC,KAACJ;4BAAYI,aAAaA;4BAAaU,YAAY;sCACjD,cAAA,KAAClB;gCACCmB,MAAK;gCACLC,IAAI,CAACC,QAAW,CAAA;wCAAEC,cAAcD,MAAME,KAAK,CAACD,YAAY;wCAAEE,SAAS;wCAAMC,QAAQ;oCAAQ,CAAA;0CAEzF,cAAA,KAACvB;oCACCwB,oBAAiB;oCACjBC,eAAa;oCACbC,UAAS;oCACTR,IAAI;wCAAES,OAAO,CAACR,QAAUA,MAAMS,OAAO,CAACC,IAAI,CAAC,IAAI;oCAAC;;;;;;8BAM1D,MAAChC;oBAAIqB,IAAI;wBAAEY,OAAO;wBAASC,WAAW;oBAAQ;;wBAAG;sCAAEhC,MAAMiC,YAAY,CAAC3B,SAASK;;;;;;AAIvF,EAAE"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
14
|
import { Grid } from '@mui/material';
|
|
15
15
|
/**
|
|
16
16
|
* Top level grid container used to lay out content for editing in panel
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorGrid.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Grid } from '@mui/material';\nimport { ReactElement } from 'react';\n\nexport type OptionsEditorGridProps = {\n /**\n * 1-3 `OptionsEditorColumn` components to render content in columns.\n */\n children: React.ReactNode;\n};\n\n/**\n * Top level grid container used to lay out content for editing in panel\n * options.\n */\nexport const OptionsEditorGrid = ({ children }: OptionsEditorGridProps): ReactElement => {\n return (\n <Grid container spacing={8}>\n {children}\n </Grid>\n );\n};\n"],"names":["Grid","OptionsEditorGrid","children","container","spacing"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorGrid.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Grid } from '@mui/material';\nimport { ReactElement } from 'react';\n\nexport type OptionsEditorGridProps = {\n /**\n * 1-3 `OptionsEditorColumn` components to render content in columns.\n */\n children: React.ReactNode;\n};\n\n/**\n * Top level grid container used to lay out content for editing in panel\n * options.\n */\nexport const OptionsEditorGrid = ({ children }: OptionsEditorGridProps): ReactElement => {\n return (\n <Grid container spacing={8}>\n {children}\n </Grid>\n );\n};\n"],"names":["Grid","OptionsEditorGrid","children","container","spacing"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,IAAI,QAAQ,gBAAgB;AAUrC;;;CAGC,GACD,OAAO,MAAMC,oBAAoB,CAAC,EAAEC,QAAQ,EAA0B;IACpE,qBACE,KAACF;QAAKG,SAAS;QAACC,SAAS;kBACtBF;;AAGP,EAAE"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
14
|
import { Box, Typography, Stack } from '@mui/material';
|
|
15
15
|
import React from 'react';
|
|
16
16
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorGroup.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Typography, Stack } from '@mui/material';\nimport React, { ReactElement } from 'react';\n\nexport type OptionsEditorGroupProps = {\n /**\n * Text that communicates the purpose of the grouping.\n */\n title: string;\n children: React.ReactNode;\n icon?: React.ReactNode;\n};\n\n/**\n * Group similar content within panel options.\n */\nexport const OptionsEditorGroup = ({ title, children, icon }: OptionsEditorGroupProps): ReactElement => {\n return (\n <Box>\n <Box display=\"flex\" borderBottom={1} borderColor=\"grey.300\" marginBottom={(theme) => theme.spacing(1)}>\n <Typography variant=\"overline\" component=\"h4\">\n {title}\n </Typography>\n {icon && <Box sx={{ marginLeft: 'auto' }}>{icon}</Box>}\n </Box>\n <Stack spacing={1}>{children}</Stack>\n </Box>\n );\n};\n"],"names":["Box","Typography","Stack","React","OptionsEditorGroup","title","children","icon","display","borderBottom","borderColor","marginBottom","theme","spacing","variant","component","sx","marginLeft"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/OptionsEditorLayout/OptionsEditorGroup.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Typography, Stack } from '@mui/material';\nimport React, { ReactElement } from 'react';\n\nexport type OptionsEditorGroupProps = {\n /**\n * Text that communicates the purpose of the grouping.\n */\n title: string;\n children: React.ReactNode;\n icon?: React.ReactNode;\n};\n\n/**\n * Group similar content within panel options.\n */\nexport const OptionsEditorGroup = ({ title, children, icon }: OptionsEditorGroupProps): ReactElement => {\n return (\n <Box>\n <Box display=\"flex\" borderBottom={1} borderColor=\"grey.300\" marginBottom={(theme) => theme.spacing(1)}>\n <Typography variant=\"overline\" component=\"h4\">\n {title}\n </Typography>\n {icon && <Box sx={{ marginLeft: 'auto' }}>{icon}</Box>}\n </Box>\n <Stack spacing={1}>{children}</Stack>\n </Box>\n );\n};\n"],"names":["Box","Typography","Stack","React","OptionsEditorGroup","title","children","icon","display","borderBottom","borderColor","marginBottom","theme","spacing","variant","component","sx","marginLeft"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,UAAU,EAAEC,KAAK,QAAQ,gBAAgB;AACvD,OAAOC,WAA6B,QAAQ;AAW5C;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,IAAI,EAA2B;IACnF,qBACE,MAACP;;0BACC,MAACA;gBAAIQ,SAAQ;gBAAOC,cAAc;gBAAGC,aAAY;gBAAWC,cAAc,CAACC,QAAUA,MAAMC,OAAO,CAAC;;kCACjG,KAACZ;wBAAWa,SAAQ;wBAAWC,WAAU;kCACtCV;;oBAEFE,sBAAQ,KAACP;wBAAIgB,IAAI;4BAAEC,YAAY;wBAAO;kCAAIV;;;;0BAE7C,KAACL;gBAAMW,SAAS;0BAAIP;;;;AAG1B,EAAE"}
|
package/dist/Overlay/Overlay.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
14
|
import { Skeleton, Stack, Typography } from '@mui/material';
|
|
15
15
|
export function TextOverlay(props) {
|
|
16
16
|
const { message } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Overlay/Overlay.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Skeleton, SkeletonOwnProps, Stack, Typography } from '@mui/material';\nimport { ReactElement } from 'react';\n\ninterface TextOverlayProps {\n message: string;\n}\n\nexport function TextOverlay(props: TextOverlayProps): ReactElement {\n const { message } = props;\n\n return (\n <Stack sx={{ height: '100%', alignItems: 'center', justifyContent: 'center' }}>\n <Typography>{message}</Typography>\n </Stack>\n );\n}\n\ninterface NoDataOverlayProps {\n resource: string;\n}\n\nexport function NoDataOverlay(props: NoDataOverlayProps): ReactElement {\n const { resource } = props;\n\n return <TextOverlay message={`No ${resource}`} />;\n}\n\ninterface LoadingOverlayProps {\n variant?: SkeletonOwnProps['variant'];\n}\n\nexport function LoadingOverlay(props: LoadingOverlayProps): ReactElement {\n const { variant = 'rounded' } = props;\n\n return (\n <Stack sx={{ height: '100%', alignItems: 'center', justifyContent: 'center', px: 1 }}>\n <Skeleton variant={variant} width=\"100%\" height=\"30%\" aria-label=\"Loading...\" />\n </Stack>\n );\n}\n"],"names":["Skeleton","Stack","Typography","TextOverlay","props","message","sx","height","alignItems","justifyContent","NoDataOverlay","resource","LoadingOverlay","variant","px","width","aria-label"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/Overlay/Overlay.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Skeleton, SkeletonOwnProps, Stack, Typography } from '@mui/material';\nimport { ReactElement } from 'react';\n\ninterface TextOverlayProps {\n message: string;\n}\n\nexport function TextOverlay(props: TextOverlayProps): ReactElement {\n const { message } = props;\n\n return (\n <Stack sx={{ height: '100%', alignItems: 'center', justifyContent: 'center' }}>\n <Typography>{message}</Typography>\n </Stack>\n );\n}\n\ninterface NoDataOverlayProps {\n resource: string;\n}\n\nexport function NoDataOverlay(props: NoDataOverlayProps): ReactElement {\n const { resource } = props;\n\n return <TextOverlay message={`No ${resource}`} />;\n}\n\ninterface LoadingOverlayProps {\n variant?: SkeletonOwnProps['variant'];\n}\n\nexport function LoadingOverlay(props: LoadingOverlayProps): ReactElement {\n const { variant = 'rounded' } = props;\n\n return (\n <Stack sx={{ height: '100%', alignItems: 'center', justifyContent: 'center', px: 1 }}>\n <Skeleton variant={variant} width=\"100%\" height=\"30%\" aria-label=\"Loading...\" />\n </Stack>\n );\n}\n"],"names":["Skeleton","Stack","Typography","TextOverlay","props","message","sx","height","alignItems","justifyContent","NoDataOverlay","resource","LoadingOverlay","variant","px","width","aria-label"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,QAAQ,EAAoBC,KAAK,EAAEC,UAAU,QAAQ,gBAAgB;AAO9E,OAAO,SAASC,YAAYC,KAAuB;IACjD,MAAM,EAAEC,OAAO,EAAE,GAAGD;IAEpB,qBACE,KAACH;QAAMK,IAAI;YAAEC,QAAQ;YAAQC,YAAY;YAAUC,gBAAgB;QAAS;kBAC1E,cAAA,KAACP;sBAAYG;;;AAGnB;AAMA,OAAO,SAASK,cAAcN,KAAyB;IACrD,MAAM,EAAEO,QAAQ,EAAE,GAAGP;IAErB,qBAAO,KAACD;QAAYE,SAAS,CAAC,GAAG,EAAEM,UAAU;;AAC/C;AAMA,OAAO,SAASC,eAAeR,KAA0B;IACvD,MAAM,EAAES,UAAU,SAAS,EAAE,GAAGT;IAEhC,qBACE,KAACH;QAAMK,IAAI;YAAEC,QAAQ;YAAQC,YAAY;YAAUC,gBAAgB;YAAUK,IAAI;QAAE;kBACjF,cAAA,KAACd;YAASa,SAASA;YAASE,OAAM;YAAOR,QAAO;YAAMS,cAAW;;;AAGvE"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
14
|
import { Box, FormControl, MenuItem, Select } from '@mui/material';
|
|
15
15
|
import { useMemo } from 'react';
|
|
16
16
|
export function RefreshIntervalPicker(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/RefreshIntervalPicker/RefreshIntervalPicker.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, FormControl, MenuItem, Select } from '@mui/material';\nimport { DurationString } from '@perses-dev/spec';\nimport { ReactElement, useMemo } from 'react';\nimport { TimeOption } from '../model';\n\ninterface RefreshIntervalPickerProps {\n timeOptions: TimeOption[];\n value?: DurationString;\n onChange: (value: DurationString) => void;\n height?: string;\n}\n\nexport function RefreshIntervalPicker(props: RefreshIntervalPickerProps): ReactElement {\n const { value, onChange, timeOptions, height } = props;\n\n // If the dashboard refresh interval is not provided in timeOptions, it will create a specific option for the select\n const customInterval = useMemo(() => {\n if (value && !timeOptions.some((option) => option.value.pastDuration === value)) {\n return <MenuItem value={value}>{value}</MenuItem>;\n }\n }, [timeOptions, value]);\n\n return (\n <FormControl>\n <Box>\n <Select\n id=\"refreshInterval\"\n value={value}\n onChange={(event) => {\n const duration = event.target.value as DurationString;\n onChange(duration);\n }}\n inputProps={{\n 'aria-label': `Select refresh interval. Currently set to ${value}`,\n }}\n sx={{\n '.MuiSelect-select': height ? { lineHeight: height, paddingY: 0 } : {},\n }}\n >\n {timeOptions.map((item, idx) => (\n <MenuItem key={idx} value={item.value.pastDuration}>\n {item.display}\n </MenuItem>\n ))}\n {customInterval}\n </Select>\n </Box>\n </FormControl>\n );\n}\n"],"names":["Box","FormControl","MenuItem","Select","useMemo","RefreshIntervalPicker","props","value","onChange","timeOptions","height","customInterval","some","option","pastDuration","id","event","duration","target","inputProps","sx","lineHeight","paddingY","map","item","idx","display"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/RefreshIntervalPicker/RefreshIntervalPicker.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, FormControl, MenuItem, Select } from '@mui/material';\nimport { DurationString } from '@perses-dev/spec';\nimport { ReactElement, useMemo } from 'react';\nimport { TimeOption } from '../model';\n\ninterface RefreshIntervalPickerProps {\n timeOptions: TimeOption[];\n value?: DurationString;\n onChange: (value: DurationString) => void;\n height?: string;\n}\n\nexport function RefreshIntervalPicker(props: RefreshIntervalPickerProps): ReactElement {\n const { value, onChange, timeOptions, height } = props;\n\n // If the dashboard refresh interval is not provided in timeOptions, it will create a specific option for the select\n const customInterval = useMemo(() => {\n if (value && !timeOptions.some((option) => option.value.pastDuration === value)) {\n return <MenuItem value={value}>{value}</MenuItem>;\n }\n }, [timeOptions, value]);\n\n return (\n <FormControl>\n <Box>\n <Select\n id=\"refreshInterval\"\n value={value}\n onChange={(event) => {\n const duration = event.target.value as DurationString;\n onChange(duration);\n }}\n inputProps={{\n 'aria-label': `Select refresh interval. Currently set to ${value}`,\n }}\n sx={{\n '.MuiSelect-select': height ? { lineHeight: height, paddingY: 0 } : {},\n }}\n >\n {timeOptions.map((item, idx) => (\n <MenuItem key={idx} value={item.value.pastDuration}>\n {item.display}\n </MenuItem>\n ))}\n {customInterval}\n </Select>\n </Box>\n </FormControl>\n );\n}\n"],"names":["Box","FormControl","MenuItem","Select","useMemo","RefreshIntervalPicker","props","value","onChange","timeOptions","height","customInterval","some","option","pastDuration","id","event","duration","target","inputProps","sx","lineHeight","paddingY","map","item","idx","display"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,WAAW,EAAEC,QAAQ,EAAEC,MAAM,QAAQ,gBAAgB;AAEnE,SAAuBC,OAAO,QAAQ,QAAQ;AAU9C,OAAO,SAASC,sBAAsBC,KAAiC;IACrE,MAAM,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,MAAM,EAAE,GAAGJ;IAEjD,oHAAoH;IACpH,MAAMK,iBAAiBP,QAAQ;QAC7B,IAAIG,SAAS,CAACE,YAAYG,IAAI,CAAC,CAACC,SAAWA,OAAON,KAAK,CAACO,YAAY,KAAKP,QAAQ;YAC/E,qBAAO,KAACL;gBAASK,OAAOA;0BAAQA;;QAClC;IACF,GAAG;QAACE;QAAaF;KAAM;IAEvB,qBACE,KAACN;kBACC,cAAA,KAACD;sBACC,cAAA,MAACG;gBACCY,IAAG;gBACHR,OAAOA;gBACPC,UAAU,CAACQ;oBACT,MAAMC,WAAWD,MAAME,MAAM,CAACX,KAAK;oBACnCC,SAASS;gBACX;gBACAE,YAAY;oBACV,cAAc,CAAC,0CAA0C,EAAEZ,OAAO;gBACpE;gBACAa,IAAI;oBACF,qBAAqBV,SAAS;wBAAEW,YAAYX;wBAAQY,UAAU;oBAAE,IAAI,CAAC;gBACvE;;oBAECb,YAAYc,GAAG,CAAC,CAACC,MAAMC,oBACtB,KAACvB;4BAAmBK,OAAOiB,KAAKjB,KAAK,CAACO,YAAY;sCAC/CU,KAAKE,OAAO;2BADAD;oBAIhBd;;;;;AAKX"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
14
|
import { Autocomplete, TextField, Typography, createFilterOptions } from '@mui/material';
|
|
15
15
|
/**
|
|
16
16
|
* Opinionated autocomplete component useful for providing users with a dropdown
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/SettingsAutocomplete/SettingsAutocomplete.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport {\n Autocomplete,\n AutocompleteProps,\n TextField,\n Typography,\n UseAutocompleteProps,\n createFilterOptions,\n} from '@mui/material';\nimport { ReactElement, ReactNode } from 'react';\n\n/**\n * Interface to extend from for `options` when using `SettingsAutocomplete`.\n */\nexport interface SettingsAutocompleteOption {\n /**\n * Unique identifier for the option.\n */\n id: string;\n\n /**\n * Optional value that is presented to the user for each option. If not set,\n * the `id` will be used instead.\n */\n label?: string;\n\n /**\n * Optional description that will be rendered below the `label` to provide the\n * user with additional information about the option.\n */\n description?: ReactNode;\n\n /**\n * When `true`, the option will be disabled.\n */\n disabled?: boolean;\n}\n\nexport interface SettingsAutocompleteProps<\n OptionType extends SettingsAutocompleteOption,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n // Note that the last `false` in the generic arguments sets the `freeSolo` option to `false`.\n // This component is intended to be used with a discrete list of options, so `freeSolo` never\n // needs to be `true`.\n> extends Omit<AutocompleteProps<OptionType, Multiple, DisableClearable, false>, 'renderInput'> {\n // Modifying this to optional, so we can define a sensible default below that\n // is used in many of the simple cases.\n renderInput?: AutocompleteProps<OptionType, Multiple, DisableClearable, false>['renderInput'];\n}\n\n/**\n * Opinionated autocomplete component useful for providing users with a dropdown\n * for settings that require selecting one or more options from a list.\n *\n * **Note: This component is currently experimental and is likely to have significant breaking changes in the near future. Use with caution outside of the core Perses codebase.**\n */\nexport function SettingsAutocomplete<\n OptionType extends SettingsAutocompleteOption,\n Multiple extends boolean | undefined = false,\n DisableClearable extends boolean | undefined = false,\n>({\n options,\n renderInput = (params): ReactElement => <TextField {...params} />,\n id,\n 'aria-labelledby': ariaLabelledby,\n ...otherProps\n}: SettingsAutocompleteProps<OptionType, Multiple, DisableClearable>): ReactElement {\n const getOptionLabel: UseAutocompleteProps<OptionType, undefined, boolean, undefined>['getOptionLabel'] = (\n option\n ) => {\n return option.label ?? option.id;\n };\n\n // Merge id and aria-labelledby props into the input element for proper accessibility\n // and form association, while still allowing custom renderInput implementations.\n const handleRenderInput: AutocompleteProps<OptionType, Multiple, DisableClearable, false>['renderInput'] = (\n params\n ) => {\n const mergedParams = {\n ...params,\n inputProps: { ...params.inputProps, id, 'aria-labelledby': ariaLabelledby },\n };\n return renderInput(mergedParams);\n };\n\n // Note: this component currently is not virtualized because it is specific\n // to being used for settings, which generally have a pretty small list of\n // options. If this changes to include values with many options, virtualization\n // should be added using react-virtuoso.\n return (\n <Autocomplete\n isOptionEqualToValue={(option, value) => option.id === value.id}\n getOptionDisabled={(option) => !!option.disabled}\n getOptionLabel={getOptionLabel}\n options={options}\n renderInput={handleRenderInput}\n renderOption={({ key, ...props }, option) => {\n return (\n <li key={key} {...props}>\n <div>\n <Typography variant=\"body1\" component=\"div\">\n {getOptionLabel(option)}\n </Typography>\n {option.description && (\n <Typography variant=\"body2\" component=\"div\" sx={{ color: (theme) => theme.palette.text.secondary }}>\n {option.description}\n </Typography>\n )}\n </div>\n </li>\n );\n }}\n filterOptions={createFilterOptions({\n // Include the label and the description in search.\n stringify: (option) => `${getOptionLabel(option)} ${option.description || ''}`,\n })}\n {...otherProps}\n />\n );\n}\n"],"names":["Autocomplete","TextField","Typography","createFilterOptions","SettingsAutocomplete","options","renderInput","params","id","ariaLabelledby","otherProps","getOptionLabel","option","label","handleRenderInput","mergedParams","inputProps","isOptionEqualToValue","value","getOptionDisabled","disabled","renderOption","key","props","li","div","variant","component","description","sx","color","theme","palette","text","secondary","filterOptions","stringify"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/SettingsAutocomplete/SettingsAutocomplete.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport {\n Autocomplete,\n AutocompleteProps,\n TextField,\n Typography,\n UseAutocompleteProps,\n createFilterOptions,\n} from '@mui/material';\nimport { ReactElement, ReactNode } from 'react';\n\n/**\n * Interface to extend from for `options` when using `SettingsAutocomplete`.\n */\nexport interface SettingsAutocompleteOption {\n /**\n * Unique identifier for the option.\n */\n id: string;\n\n /**\n * Optional value that is presented to the user for each option. If not set,\n * the `id` will be used instead.\n */\n label?: string;\n\n /**\n * Optional description that will be rendered below the `label` to provide the\n * user with additional information about the option.\n */\n description?: ReactNode;\n\n /**\n * When `true`, the option will be disabled.\n */\n disabled?: boolean;\n}\n\nexport interface SettingsAutocompleteProps<\n OptionType extends SettingsAutocompleteOption,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n // Note that the last `false` in the generic arguments sets the `freeSolo` option to `false`.\n // This component is intended to be used with a discrete list of options, so `freeSolo` never\n // needs to be `true`.\n> extends Omit<AutocompleteProps<OptionType, Multiple, DisableClearable, false>, 'renderInput'> {\n // Modifying this to optional, so we can define a sensible default below that\n // is used in many of the simple cases.\n renderInput?: AutocompleteProps<OptionType, Multiple, DisableClearable, false>['renderInput'];\n}\n\n/**\n * Opinionated autocomplete component useful for providing users with a dropdown\n * for settings that require selecting one or more options from a list.\n *\n * **Note: This component is currently experimental and is likely to have significant breaking changes in the near future. Use with caution outside of the core Perses codebase.**\n */\nexport function SettingsAutocomplete<\n OptionType extends SettingsAutocompleteOption,\n Multiple extends boolean | undefined = false,\n DisableClearable extends boolean | undefined = false,\n>({\n options,\n renderInput = (params): ReactElement => <TextField {...params} />,\n id,\n 'aria-labelledby': ariaLabelledby,\n ...otherProps\n}: SettingsAutocompleteProps<OptionType, Multiple, DisableClearable>): ReactElement {\n const getOptionLabel: UseAutocompleteProps<OptionType, undefined, boolean, undefined>['getOptionLabel'] = (\n option\n ) => {\n return option.label ?? option.id;\n };\n\n // Merge id and aria-labelledby props into the input element for proper accessibility\n // and form association, while still allowing custom renderInput implementations.\n const handleRenderInput: AutocompleteProps<OptionType, Multiple, DisableClearable, false>['renderInput'] = (\n params\n ) => {\n const mergedParams = {\n ...params,\n inputProps: { ...params.inputProps, id, 'aria-labelledby': ariaLabelledby },\n };\n return renderInput(mergedParams);\n };\n\n // Note: this component currently is not virtualized because it is specific\n // to being used for settings, which generally have a pretty small list of\n // options. If this changes to include values with many options, virtualization\n // should be added using react-virtuoso.\n return (\n <Autocomplete\n isOptionEqualToValue={(option, value) => option.id === value.id}\n getOptionDisabled={(option) => !!option.disabled}\n getOptionLabel={getOptionLabel}\n options={options}\n renderInput={handleRenderInput}\n renderOption={({ key, ...props }, option) => {\n return (\n <li key={key} {...props}>\n <div>\n <Typography variant=\"body1\" component=\"div\">\n {getOptionLabel(option)}\n </Typography>\n {option.description && (\n <Typography variant=\"body2\" component=\"div\" sx={{ color: (theme) => theme.palette.text.secondary }}>\n {option.description}\n </Typography>\n )}\n </div>\n </li>\n );\n }}\n filterOptions={createFilterOptions({\n // Include the label and the description in search.\n stringify: (option) => `${getOptionLabel(option)} ${option.description || ''}`,\n })}\n {...otherProps}\n />\n );\n}\n"],"names":["Autocomplete","TextField","Typography","createFilterOptions","SettingsAutocomplete","options","renderInput","params","id","ariaLabelledby","otherProps","getOptionLabel","option","label","handleRenderInput","mergedParams","inputProps","isOptionEqualToValue","value","getOptionDisabled","disabled","renderOption","key","props","li","div","variant","component","description","sx","color","theme","palette","text","secondary","filterOptions","stringify"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SACEA,YAAY,EAEZC,SAAS,EACTC,UAAU,EAEVC,mBAAmB,QACd,gBAAgB;AA2CvB;;;;;CAKC,GACD,OAAO,SAASC,qBAId,EACAC,OAAO,EACPC,cAAc,CAACC,uBAAyB,KAACN;QAAW,GAAGM,MAAM;MAAI,EACjEC,EAAE,EACF,mBAAmBC,cAAc,EACjC,GAAGC,YAC+D;IAClE,MAAMC,iBAAoG,CACxGC;QAEA,OAAOA,OAAOC,KAAK,IAAID,OAAOJ,EAAE;IAClC;IAEA,qFAAqF;IACrF,iFAAiF;IACjF,MAAMM,oBAAqG,CACzGP;QAEA,MAAMQ,eAAe;YACnB,GAAGR,MAAM;YACTS,YAAY;gBAAE,GAAGT,OAAOS,UAAU;gBAAER;gBAAI,mBAAmBC;YAAe;QAC5E;QACA,OAAOH,YAAYS;IACrB;IAEA,2EAA2E;IAC3E,0EAA0E;IAC1E,+EAA+E;IAC/E,wCAAwC;IACxC,qBACE,KAACf;QACCiB,sBAAsB,CAACL,QAAQM,QAAUN,OAAOJ,EAAE,KAAKU,MAAMV,EAAE;QAC/DW,mBAAmB,CAACP,SAAW,CAAC,CAACA,OAAOQ,QAAQ;QAChDT,gBAAgBA;QAChBN,SAASA;QACTC,aAAaQ;QACbO,cAAc,CAAC,EAAEC,GAAG,EAAE,GAAGC,OAAO,EAAEX;YAChC,qBACE,KAACY;gBAAc,GAAGD,KAAK;0BACrB,cAAA,MAACE;;sCACC,KAACvB;4BAAWwB,SAAQ;4BAAQC,WAAU;sCACnChB,eAAeC;;wBAEjBA,OAAOgB,WAAW,kBACjB,KAAC1B;4BAAWwB,SAAQ;4BAAQC,WAAU;4BAAME,IAAI;gCAAEC,OAAO,CAACC,QAAUA,MAAMC,OAAO,CAACC,IAAI,CAACC,SAAS;4BAAC;sCAC9FtB,OAAOgB,WAAW;;;;eAPlBN;QAab;QACAa,eAAehC,oBAAoB;YACjC,mDAAmD;YACnDiC,WAAW,CAACxB,SAAW,GAAGD,eAAeC,QAAQ,CAAC,EAAEA,OAAOgB,WAAW,IAAI,IAAI;QAChF;QACC,GAAGlB,UAAU;;AAGpB"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License | Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND | either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
14
|
import { Button, ButtonGroup } from '@mui/material';
|
|
15
15
|
export function SortSelectorButtons({ onChange, value, ...props }) {
|
|
16
16
|
const handleSortChange = (sort)=>{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/SortSelector/SortSelectorButtons.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License | Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing | software\n// distributed under the License is distributed on an \"AS IS\" BASIS |\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND | either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material';\nimport { ReactElement } from 'react';\nimport { SortOption } from './SortSelector';\n\nexport interface SortSelectorButtonsProps extends Omit<ButtonGroupProps, 'onChange'> {\n value?: SortOption;\n onChange: (sort?: SortOption) => void;\n}\n\nexport function SortSelectorButtons({ onChange, value, ...props }: SortSelectorButtonsProps): ReactElement {\n const handleSortChange = (sort?: SortOption): void => {\n onChange(sort);\n };\n\n return (\n <ButtonGroup aria-label=\"Sort\" {...props}>\n <Button onClick={() => handleSortChange(undefined)} variant={value === undefined ? 'contained' : 'outlined'}>\n None\n </Button>\n <Button onClick={() => handleSortChange('asc')} variant={value === 'asc' ? 'contained' : 'outlined'}>\n Asc\n </Button>\n <Button onClick={() => handleSortChange('desc')} variant={value === 'desc' ? 'contained' : 'outlined'}>\n Desc\n </Button>\n </ButtonGroup>\n );\n}\n"],"names":["Button","ButtonGroup","SortSelectorButtons","onChange","value","props","handleSortChange","sort","aria-label","onClick","undefined","variant"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,wEAAwE;AACxE,qEAAqE;AACrE,6EAA6E;AAC7E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/SortSelector/SortSelectorButtons.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License | Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing | software\n// distributed under the License is distributed on an \"AS IS\" BASIS |\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND | either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material';\nimport { ReactElement } from 'react';\nimport { SortOption } from './SortSelector';\n\nexport interface SortSelectorButtonsProps extends Omit<ButtonGroupProps, 'onChange'> {\n value?: SortOption;\n onChange: (sort?: SortOption) => void;\n}\n\nexport function SortSelectorButtons({ onChange, value, ...props }: SortSelectorButtonsProps): ReactElement {\n const handleSortChange = (sort?: SortOption): void => {\n onChange(sort);\n };\n\n return (\n <ButtonGroup aria-label=\"Sort\" {...props}>\n <Button onClick={() => handleSortChange(undefined)} variant={value === undefined ? 'contained' : 'outlined'}>\n None\n </Button>\n <Button onClick={() => handleSortChange('asc')} variant={value === 'asc' ? 'contained' : 'outlined'}>\n Asc\n </Button>\n <Button onClick={() => handleSortChange('desc')} variant={value === 'desc' ? 'contained' : 'outlined'}>\n Desc\n </Button>\n </ButtonGroup>\n );\n}\n"],"names":["Button","ButtonGroup","SortSelectorButtons","onChange","value","props","handleSortChange","sort","aria-label","onClick","undefined","variant"],"mappings":";AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,wEAAwE;AACxE,qEAAqE;AACrE,6EAA6E;AAC7E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,MAAM,EAAEC,WAAW,QAA0B,gBAAgB;AAStE,OAAO,SAASC,oBAAoB,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGC,OAAiC;IACzF,MAAMC,mBAAmB,CAACC;QACxBJ,SAASI;IACX;IAEA,qBACE,MAACN;QAAYO,cAAW;QAAQ,GAAGH,KAAK;;0BACtC,KAACL;gBAAOS,SAAS,IAAMH,iBAAiBI;gBAAYC,SAASP,UAAUM,YAAY,cAAc;0BAAY;;0BAG7G,KAACV;gBAAOS,SAAS,IAAMH,iBAAiB;gBAAQK,SAASP,UAAU,QAAQ,cAAc;0BAAY;;0BAGrG,KAACJ;gBAAOS,SAAS,IAAMH,iBAAiB;gBAASK,SAASP,UAAU,SAAS,cAAc;0BAAY;;;;AAK7G"}
|
package/dist/Table/InnerTable.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
14
|
import { Table as MuiTable, styled } from '@mui/material';
|
|
15
15
|
import { forwardRef } from 'react';
|
|
16
16
|
const StyledMuiTable = styled(MuiTable)(({ theme })=>({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Table/InnerTable.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Table as MuiTable, styled, TableProps as MuiTableProps } from '@mui/material';\nimport { forwardRef } from 'react';\nimport { TableDensity } from './model/table-model';\n\nconst StyledMuiTable = styled(MuiTable)(({ theme }) => ({\n // This value is needed to have a consistent table layout when scrolling.\n tableLayout: 'fixed',\n borderCollapse: 'separate',\n backgroundColor: theme.palette.background.default,\n}));\n\ntype InnerTableProps = Omit<MuiTableProps, 'size'> & {\n density: TableDensity;\n};\n\nconst TABLE_DENSITY_CONFIG: Record<TableDensity, MuiTableProps['size']> = {\n compact: 'small',\n standard: 'medium',\n comfortable: 'medium',\n};\n\nexport const InnerTable = forwardRef<HTMLTableElement, InnerTableProps>(function InnerTable(\n { density, ...otherProps },\n ref\n) {\n return (\n <StyledMuiTable\n {...otherProps}\n tabIndex={-1}\n size={TABLE_DENSITY_CONFIG[density]}\n ref={ref}\n sx={{\n width: '100%',\n }}\n />\n );\n});\n"],"names":["Table","MuiTable","styled","forwardRef","StyledMuiTable","theme","tableLayout","borderCollapse","backgroundColor","palette","background","default","TABLE_DENSITY_CONFIG","compact","standard","comfortable","InnerTable","density","otherProps","ref","tabIndex","size","sx","width"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC
|
|
1
|
+
{"version":3,"sources":["../../src/Table/InnerTable.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Table as MuiTable, styled, TableProps as MuiTableProps } from '@mui/material';\nimport { forwardRef } from 'react';\nimport { TableDensity } from './model/table-model';\n\nconst StyledMuiTable = styled(MuiTable)(({ theme }) => ({\n // This value is needed to have a consistent table layout when scrolling.\n tableLayout: 'fixed',\n borderCollapse: 'separate',\n backgroundColor: theme.palette.background.default,\n}));\n\ntype InnerTableProps = Omit<MuiTableProps, 'size'> & {\n density: TableDensity;\n};\n\nconst TABLE_DENSITY_CONFIG: Record<TableDensity, MuiTableProps['size']> = {\n compact: 'small',\n standard: 'medium',\n comfortable: 'medium',\n};\n\nexport const InnerTable = forwardRef<HTMLTableElement, InnerTableProps>(function InnerTable(\n { density, ...otherProps },\n ref\n) {\n return (\n <StyledMuiTable\n {...otherProps}\n tabIndex={-1}\n size={TABLE_DENSITY_CONFIG[density]}\n ref={ref}\n sx={{\n width: '100%',\n }}\n />\n );\n});\n"],"names":["Table","MuiTable","styled","forwardRef","StyledMuiTable","theme","tableLayout","borderCollapse","backgroundColor","palette","background","default","TABLE_DENSITY_CONFIG","compact","standard","comfortable","InnerTable","density","otherProps","ref","tabIndex","size","sx","width"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,SAASC,QAAQ,EAAEC,MAAM,QAAqC,gBAAgB;AACvF,SAASC,UAAU,QAAQ,QAAQ;AAGnC,MAAMC,iBAAiBF,OAAOD,UAAU,CAAC,EAAEI,KAAK,EAAE,GAAM,CAAA;QACtD,yEAAyE;QACzEC,aAAa;QACbC,gBAAgB;QAChBC,iBAAiBH,MAAMI,OAAO,CAACC,UAAU,CAACC,OAAO;IACnD,CAAA;AAMA,MAAMC,uBAAoE;IACxEC,SAAS;IACTC,UAAU;IACVC,aAAa;AACf;AAEA,OAAO,MAAMC,2BAAab,WAA8C,SAASa,WAC/E,EAAEC,OAAO,EAAE,GAAGC,YAAY,EAC1BC,GAAG;IAEH,qBACE,KAACf;QACE,GAAGc,UAAU;QACdE,UAAU,CAAC;QACXC,MAAMT,oBAAoB,CAACK,QAAQ;QACnCE,KAAKA;QACLG,IAAI;YACFC,OAAO;QACT;;AAGN,GAAG"}
|
package/dist/Table/Table.d.ts
CHANGED
|
@@ -6,5 +6,5 @@ import { TableProps } from './model/table-model';
|
|
|
6
6
|
*
|
|
7
7
|
* **Note: This component is currently experimental and is likely to have significant breaking changes in the near future. Use with caution outside of the core Perses codebase.**
|
|
8
8
|
*/
|
|
9
|
-
export declare function Table<TableData>({ data, columns, cellConfigs, density, defaultColumnWidth, defaultColumnHeight, checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId, rowSelection, sorting, getItemActions, hasItemActions, pagination, onPaginationChange, rowSelectionVariant, ...otherProps }: TableProps<TableData>): ReactElement;
|
|
9
|
+
export declare function Table<TableData>({ data, columns, cellConfigs, density, defaultColumnWidth, defaultColumnHeight, checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId, rowSelection, sorting, getItemActions, hasItemActions, pagination, onPaginationChange, rowSelectionVariant, getSubRows, hiddenColumns, tableToolbarConfig, columnResizeMode, defaultColumnConfig, ...otherProps }: TableProps<TableData>): ReactElement;
|
|
10
10
|
//# sourceMappingURL=Table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"AA6BA,OAAO,EAAE,YAAY,EAAkC,MAAM,OAAO,CAAC;AAIrE,OAAO,EAAwD,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAYvG;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,SAAS,EAAE,EAC/B,IAAI,EACJ,OAAO,EACP,WAAW,EACX,OAAoB,EACpB,kBAAyC,EACzC,mBAA4B,EAC5B,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EACf,gBAAgB,EAChB,QAA6B,EAC7B,YAAoC,EACpC,OAAyB,EACzB,cAAc,EACd,cAAc,EACd,UAAU,EACV,kBAAkB,EAClB,mBAAgC,EAChC,UAAU,EACV,aAAa,EACb,kBAAkB,EAClB,gBAA6B,EAC7B,mBAAmB,EACnB,GAAG,UAAU,EACd,EAAE,UAAU,CAAC,SAAS,CAAC,GAAG,YAAY,CAoMtC"}
|
package/dist/Table/Table.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,10 +11,10 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
14
|
import { Stack, useTheme } from '@mui/material';
|
|
15
|
-
import { getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
|
|
16
|
-
import { useCallback, useMemo } from 'react';
|
|
15
|
+
import { getCoreRowModel, getExpandedRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
|
|
16
|
+
import { useCallback, useMemo, useState } from 'react';
|
|
17
|
+
import { useFuzzySearch } from './hooks/useFuzzySearch';
|
|
17
18
|
import { TableCheckbox } from './TableCheckbox';
|
|
18
19
|
import { VirtualizedTable } from './VirtualizedTable';
|
|
19
20
|
import { DEFAULT_COLUMN_WIDTH, persesColumnsToTanstackColumns } from './model/table-model';
|
|
@@ -30,8 +31,15 @@ const DEFAULT_SORTING = [];
|
|
|
30
31
|
* **not** intended to be a general use data table for use cases unrelated to Perses.
|
|
31
32
|
*
|
|
32
33
|
* **Note: This component is currently experimental and is likely to have significant breaking changes in the near future. Use with caution outside of the core Perses codebase.**
|
|
33
|
-
*/ export function Table({ data, columns, cellConfigs, density = 'standard', defaultColumnWidth = DEFAULT_COLUMN_WIDTH, defaultColumnHeight = 'auto', checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId = DEFAULT_GET_ROW_ID, rowSelection = DEFAULT_ROW_SELECTION, sorting = DEFAULT_SORTING, getItemActions, hasItemActions, pagination, onPaginationChange, rowSelectionVariant = 'standard', ...otherProps }) {
|
|
34
|
+
*/ export function Table({ data, columns, cellConfigs, density = 'standard', defaultColumnWidth = DEFAULT_COLUMN_WIDTH, defaultColumnHeight = 'auto', checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId = DEFAULT_GET_ROW_ID, rowSelection = DEFAULT_ROW_SELECTION, sorting = DEFAULT_SORTING, getItemActions, hasItemActions, pagination, onPaginationChange, rowSelectionVariant = 'standard', getSubRows, hiddenColumns, tableToolbarConfig, columnResizeMode = 'onChange', defaultColumnConfig, ...otherProps }) {
|
|
34
35
|
const theme = useTheme();
|
|
36
|
+
const hasSubRows = !!getSubRows;
|
|
37
|
+
const [expanded, setExpanded] = useState({});
|
|
38
|
+
const { globalFilter, setGlobalFilter, fuzzySearchOptions } = useFuzzySearch(tableToolbarConfig?.isSearchEnabled, tableToolbarConfig?.fuzzyMatchThreshold ?? 'CONTAINS', expanded, setExpanded);
|
|
39
|
+
const [columnVisibility, setColumnVisibility] = useState(hiddenColumns?.reduce((acc, columnId)=>({
|
|
40
|
+
...acc,
|
|
41
|
+
[columnId]: false
|
|
42
|
+
}), {}) ?? {});
|
|
35
43
|
const handleRowSelectionChange = (rowSelectionUpdater)=>{
|
|
36
44
|
const newRowSelection = typeof rowSelectionUpdater === 'function' ? rowSelectionUpdater(rowSelection) : rowSelectionUpdater;
|
|
37
45
|
onRowSelectionChange?.(newRowSelection);
|
|
@@ -82,7 +90,8 @@ const DEFAULT_SORTING = [];
|
|
|
82
90
|
})
|
|
83
91
|
});
|
|
84
92
|
},
|
|
85
|
-
enableSorting: false
|
|
93
|
+
enableSorting: false,
|
|
94
|
+
enableResizing: false
|
|
86
95
|
};
|
|
87
96
|
}, [
|
|
88
97
|
getItemActions
|
|
@@ -111,7 +120,8 @@ const DEFAULT_SORTING = [];
|
|
|
111
120
|
density: density
|
|
112
121
|
});
|
|
113
122
|
},
|
|
114
|
-
enableSorting: false
|
|
123
|
+
enableSorting: false,
|
|
124
|
+
enableResizing: false
|
|
115
125
|
};
|
|
116
126
|
}, [
|
|
117
127
|
theme.palette.text.primary,
|
|
@@ -120,7 +130,7 @@ const DEFAULT_SORTING = [];
|
|
|
120
130
|
handleCheckboxChange
|
|
121
131
|
]);
|
|
122
132
|
const tableColumns = useMemo(()=>{
|
|
123
|
-
const initTableColumns = persesColumnsToTanstackColumns(columns);
|
|
133
|
+
const initTableColumns = persesColumnsToTanstackColumns(columns, defaultColumnConfig);
|
|
124
134
|
if (hasItemActions) {
|
|
125
135
|
initTableColumns.unshift(actionsColumn);
|
|
126
136
|
}
|
|
@@ -129,16 +139,17 @@ const DEFAULT_SORTING = [];
|
|
|
129
139
|
}
|
|
130
140
|
return initTableColumns;
|
|
131
141
|
}, [
|
|
132
|
-
checkboxColumn,
|
|
133
|
-
checkboxSelection,
|
|
134
142
|
columns,
|
|
143
|
+
defaultColumnConfig,
|
|
135
144
|
hasItemActions,
|
|
136
|
-
|
|
145
|
+
checkboxSelection,
|
|
146
|
+
actionsColumn,
|
|
147
|
+
checkboxColumn
|
|
137
148
|
]);
|
|
138
149
|
const table = useReactTable({
|
|
139
150
|
data,
|
|
140
151
|
columns: tableColumns,
|
|
141
|
-
getRowId,
|
|
152
|
+
getRowId: getRowId,
|
|
142
153
|
getCoreRowModel: getCoreRowModel(),
|
|
143
154
|
getSortedRowModel: getSortedRowModel(),
|
|
144
155
|
getPaginationRowModel: pagination ? getPaginationRowModel() : undefined,
|
|
@@ -148,15 +159,24 @@ const DEFAULT_SORTING = [];
|
|
|
148
159
|
enableRowSelection: !!checkboxSelection,
|
|
149
160
|
onRowSelectionChange: handleRowSelectionChange,
|
|
150
161
|
onSortingChange: handleSortingChange,
|
|
162
|
+
onColumnVisibilityChange: setColumnVisibility,
|
|
163
|
+
getSubRows: getSubRows,
|
|
164
|
+
getExpandedRowModel: hasSubRows ? getExpandedRowModel() : undefined,
|
|
165
|
+
...fuzzySearchOptions,
|
|
151
166
|
// For now, defaulting to sort by descending first. We can expose the ability
|
|
152
167
|
// to customize it if/when we have use cases for it.
|
|
153
168
|
sortDescFirst: true,
|
|
169
|
+
columnResizeMode,
|
|
170
|
+
onExpandedChange: setExpanded,
|
|
154
171
|
state: {
|
|
155
172
|
rowSelection,
|
|
156
173
|
sorting,
|
|
174
|
+
globalFilter: tableToolbarConfig?.isSearchEnabled ? globalFilter : undefined,
|
|
175
|
+
columnVisibility,
|
|
157
176
|
...pagination ? {
|
|
158
177
|
pagination
|
|
159
|
-
} : {}
|
|
178
|
+
} : {},
|
|
179
|
+
expanded
|
|
160
180
|
}
|
|
161
181
|
});
|
|
162
182
|
const handleRowClick = useCallback((e, rowId)=>{
|
|
@@ -174,12 +194,25 @@ const DEFAULT_SORTING = [];
|
|
|
174
194
|
defaultColumnHeight: defaultColumnHeight,
|
|
175
195
|
onRowClick: handleRowClick,
|
|
176
196
|
rows: table.getRowModel().rows,
|
|
177
|
-
columns: table.
|
|
197
|
+
columns: table.getVisibleFlatColumns(),
|
|
198
|
+
columnSizing: table.getState().columnSizing,
|
|
199
|
+
columnSizingInfo: table.getState().columnSizingInfo,
|
|
178
200
|
headers: table.getHeaderGroups(),
|
|
179
201
|
cellConfigs: cellConfigs,
|
|
180
202
|
pagination: pagination,
|
|
181
203
|
onPaginationChange: onPaginationChange,
|
|
182
|
-
rowCount: table.getRowCount()
|
|
204
|
+
rowCount: table.getRowCount(),
|
|
205
|
+
toolbarConfig: {
|
|
206
|
+
isSearchEnabled: tableToolbarConfig?.isSearchEnabled,
|
|
207
|
+
globalFilter,
|
|
208
|
+
onGlobalFilterChange: setGlobalFilter,
|
|
209
|
+
isColumnFilterEnabled: tableToolbarConfig?.isColumnFilterEnabled,
|
|
210
|
+
columns: table.getAllColumns(),
|
|
211
|
+
columnFilterMenuMaxHeight: tableToolbarConfig?.columnFilterMenuMaxHeight,
|
|
212
|
+
isExpandAllEnabled: hasSubRows,
|
|
213
|
+
isAllExpanded: table.getIsAllRowsExpanded(),
|
|
214
|
+
onExpandAllChange: table.getToggleAllRowsExpandedHandler()
|
|
215
|
+
}
|
|
183
216
|
});
|
|
184
217
|
}
|
|
185
218
|
|
package/dist/Table/Table.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Table/Table.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Stack, useTheme } from '@mui/material';\nimport {\n ColumnDef,\n OnChangeFn,\n Row,\n RowSelectionState,\n SortingState,\n Table as TanstackTable,\n getCoreRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n} from '@tanstack/react-table';\nimport { ReactElement, useCallback, useMemo } from 'react';\nimport { TableCheckbox } from './TableCheckbox';\nimport { VirtualizedTable } from './VirtualizedTable';\nimport { DEFAULT_COLUMN_WIDTH, TableProps, persesColumnsToTanstackColumns } from './model/table-model';\n\nconst DEFAULT_GET_ROW_ID = (data: unknown, index: number): string => {\n return `${index}`;\n};\n\n// Setting these defaults one enables them to be consistent across renders instead\n// of being recreated every time, which can be important for perf because react\n// does not do deep equality checking for objects and arrays.\nconst DEFAULT_ROW_SELECTION: NonNullable<TableProps<unknown>['rowSelection']> = {};\nconst DEFAULT_SORTING: NonNullable<TableProps<unknown>['sorting']> = [];\n\n/**\n * Component used to render tabular data in Perses use cases. This component is\n * **not** intended to be a general use data table for use cases unrelated to Perses.\n *\n * **Note: This component is currently experimental and is likely to have significant breaking changes in the near future. Use with caution outside of the core Perses codebase.**\n */\nexport function Table<TableData>({\n data,\n columns,\n cellConfigs,\n density = 'standard',\n defaultColumnWidth = DEFAULT_COLUMN_WIDTH,\n defaultColumnHeight = 'auto',\n checkboxSelection,\n onRowSelectionChange,\n onSortingChange,\n getCheckboxColor,\n getRowId = DEFAULT_GET_ROW_ID,\n rowSelection = DEFAULT_ROW_SELECTION,\n sorting = DEFAULT_SORTING,\n getItemActions,\n hasItemActions,\n pagination,\n onPaginationChange,\n rowSelectionVariant = 'standard',\n ...otherProps\n}: TableProps<TableData>): ReactElement {\n const theme = useTheme();\n\n const handleRowSelectionChange: OnChangeFn<RowSelectionState> = (rowSelectionUpdater) => {\n const newRowSelection =\n typeof rowSelectionUpdater === 'function' ? rowSelectionUpdater(rowSelection) : rowSelectionUpdater;\n onRowSelectionChange?.(newRowSelection);\n };\n\n const handleRowSelectionEvent = useCallback(\n (table: TanstackTable<TableData>, row: Row<TableData>, isModified: boolean) => {\n if (rowSelectionVariant === 'standard' || isModified) {\n row.toggleSelected();\n } else {\n // Legend variant (when action not modified with shift/meta key).\n // Note that this behavior needs to be kept in sync with behavior in\n // the Legend component for list-based legends.\n if (row.getIsSelected() && !table.getIsAllRowsSelected()) {\n // Row was already selected. Revert to select all.\n table.toggleAllRowsSelected();\n } else {\n // Focus the selected row.\n onRowSelectionChange?.({\n [row.id]: true,\n });\n }\n }\n },\n [onRowSelectionChange, rowSelectionVariant]\n );\n\n const handleCheckboxChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>, table: TanstackTable<TableData>, row: Row<TableData>) => {\n const nativePointerEvent =\n e.nativeEvent && (e.nativeEvent instanceof MouseEvent || e.nativeEvent instanceof KeyboardEvent)\n ? (e.nativeEvent as PointerEvent)\n : undefined;\n const isModifed = !!nativePointerEvent?.metaKey || !!nativePointerEvent?.shiftKey;\n handleRowSelectionEvent(table, row, isModifed);\n },\n [handleRowSelectionEvent]\n );\n\n const handleSortingChange: OnChangeFn<SortingState> = (sortingUpdater) => {\n const newSorting = typeof sortingUpdater === 'function' ? sortingUpdater(sorting) : sortingUpdater;\n onSortingChange?.(newSorting);\n };\n\n const actionsColumn: ColumnDef<TableData> = useMemo(() => {\n return {\n id: 'itemActions',\n header: 'Actions',\n cell: ({ row }): ReactElement => {\n return (\n <Stack direction=\"row\" alignItems=\"center\">\n {getItemActions?.({ id: row.id, data: row.original })}\n </Stack>\n );\n },\n enableSorting: false,\n };\n }, [getItemActions]);\n\n const checkboxColumn: ColumnDef<TableData> = useMemo(() => {\n return {\n id: 'checkboxRowSelect',\n size: 28,\n header: ({ table }): ReactElement => {\n return (\n <TableCheckbox\n checked={table.getIsAllRowsSelected()}\n indeterminate={table.getIsSomeRowsSelected()}\n onChange={table.getToggleAllRowsSelectedHandler()}\n color={theme.palette.text.primary}\n density={density}\n />\n );\n },\n cell: ({ row, table }): ReactElement => {\n return (\n <TableCheckbox\n checked={row.getIsSelected()}\n indeterminate={row.getIsSomeSelected()}\n onChange={(e) => {\n handleCheckboxChange(e, table, row);\n }}\n color={getCheckboxColor?.(row.original)}\n density={density}\n />\n );\n },\n enableSorting: false,\n };\n }, [theme.palette.text.primary, density, getCheckboxColor, handleCheckboxChange]);\n\n const tableColumns: Array<ColumnDef<TableData>> = useMemo(() => {\n const initTableColumns = persesColumnsToTanstackColumns(columns);\n\n if (hasItemActions) {\n initTableColumns.unshift(actionsColumn);\n }\n\n if (checkboxSelection) {\n initTableColumns.unshift(checkboxColumn);\n }\n\n return initTableColumns;\n }, [checkboxColumn, checkboxSelection, columns, hasItemActions, actionsColumn]);\n\n const table = useReactTable({\n data,\n columns: tableColumns,\n getRowId,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getPaginationRowModel: pagination ? getPaginationRowModel() : undefined,\n // without this setting, the getPaginationRowModel setting persists and it is not possible to switch from paginated to unpaginated\n // can be removed once https://github.com/TanStack/table/pull/5974 is merged\n manualPagination: !pagination,\n enableRowSelection: !!checkboxSelection,\n onRowSelectionChange: handleRowSelectionChange,\n onSortingChange: handleSortingChange,\n // For now, defaulting to sort by descending first. We can expose the ability\n // to customize it if/when we have use cases for it.\n sortDescFirst: true,\n state: {\n rowSelection,\n sorting,\n ...(pagination ? { pagination } : {}),\n },\n });\n\n const handleRowClick = useCallback(\n (e: React.MouseEvent<HTMLDivElement, MouseEvent>, rowId: string) => {\n const row = table.getRow(rowId);\n const isModifiedClick = e.metaKey || e.shiftKey;\n handleRowSelectionEvent(table, row, isModifiedClick);\n },\n [handleRowSelectionEvent, table]\n );\n\n return (\n <VirtualizedTable\n {...otherProps}\n density={density}\n defaultColumnWidth={defaultColumnWidth}\n defaultColumnHeight={defaultColumnHeight}\n onRowClick={handleRowClick}\n rows={table.getRowModel().rows}\n columns={table.getAllFlatColumns()}\n headers={table.getHeaderGroups()}\n cellConfigs={cellConfigs}\n pagination={pagination}\n onPaginationChange={onPaginationChange}\n rowCount={table.getRowCount()}\n />\n );\n}\n"],"names":["Stack","useTheme","getCoreRowModel","getPaginationRowModel","getSortedRowModel","useReactTable","useCallback","useMemo","TableCheckbox","VirtualizedTable","DEFAULT_COLUMN_WIDTH","persesColumnsToTanstackColumns","DEFAULT_GET_ROW_ID","data","index","DEFAULT_ROW_SELECTION","DEFAULT_SORTING","Table","columns","cellConfigs","density","defaultColumnWidth","defaultColumnHeight","checkboxSelection","onRowSelectionChange","onSortingChange","getCheckboxColor","getRowId","rowSelection","sorting","getItemActions","hasItemActions","pagination","onPaginationChange","rowSelectionVariant","otherProps","theme","handleRowSelectionChange","rowSelectionUpdater","newRowSelection","handleRowSelectionEvent","table","row","isModified","toggleSelected","getIsSelected","getIsAllRowsSelected","toggleAllRowsSelected","id","handleCheckboxChange","e","nativePointerEvent","nativeEvent","MouseEvent","KeyboardEvent","undefined","isModifed","metaKey","shiftKey","handleSortingChange","sortingUpdater","newSorting","actionsColumn","header","cell","direction","alignItems","original","enableSorting","checkboxColumn","size","checked","indeterminate","getIsSomeRowsSelected","onChange","getToggleAllRowsSelectedHandler","color","palette","text","primary","getIsSomeSelected","tableColumns","initTableColumns","unshift","manualPagination","enableRowSelection","sortDescFirst","state","handleRowClick","rowId","getRow","isModifiedClick","onRowClick","rows","getRowModel","getAllFlatColumns","headers","getHeaderGroups","rowCount","getRowCount"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/Table/Table.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Stack, useTheme } from '@mui/material';\nimport {\n ColumnDef,\n ExpandedState,\n getCoreRowModel,\n getExpandedRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n OnChangeFn,\n Row,\n RowSelectionState,\n SortingState,\n Table as TanstackTable,\n useReactTable,\n VisibilityState,\n} from '@tanstack/react-table';\nimport { ReactElement, useCallback, useMemo, useState } from 'react';\nimport { useFuzzySearch } from './hooks/useFuzzySearch';\nimport { TableCheckbox } from './TableCheckbox';\nimport { VirtualizedTable } from './VirtualizedTable';\nimport { DEFAULT_COLUMN_WIDTH, persesColumnsToTanstackColumns, TableProps } from './model/table-model';\n\nconst DEFAULT_GET_ROW_ID = (data: unknown, index: number): string => {\n return `${index}`;\n};\n\n// Setting these defaults one enables them to be consistent across renders instead\n// of being recreated every time, which can be important for perf because react\n// does not do deep equality checking for objects and arrays.\nconst DEFAULT_ROW_SELECTION: NonNullable<TableProps<unknown>['rowSelection']> = {};\nconst DEFAULT_SORTING: NonNullable<TableProps<unknown>['sorting']> = [];\n\n/**\n * Component used to render tabular data in Perses use cases. This component is\n * **not** intended to be a general use data table for use cases unrelated to Perses.\n *\n * **Note: This component is currently experimental and is likely to have significant breaking changes in the near future. Use with caution outside of the core Perses codebase.**\n */\nexport function Table<TableData>({\n data,\n columns,\n cellConfigs,\n density = 'standard',\n defaultColumnWidth = DEFAULT_COLUMN_WIDTH,\n defaultColumnHeight = 'auto',\n checkboxSelection,\n onRowSelectionChange,\n onSortingChange,\n getCheckboxColor,\n getRowId = DEFAULT_GET_ROW_ID,\n rowSelection = DEFAULT_ROW_SELECTION,\n sorting = DEFAULT_SORTING,\n getItemActions,\n hasItemActions,\n pagination,\n onPaginationChange,\n rowSelectionVariant = 'standard',\n getSubRows,\n hiddenColumns,\n tableToolbarConfig,\n columnResizeMode = 'onChange',\n defaultColumnConfig,\n ...otherProps\n}: TableProps<TableData>): ReactElement {\n const theme = useTheme();\n\n const hasSubRows = !!getSubRows;\n\n const [expanded, setExpanded] = useState<ExpandedState>({});\n\n const { globalFilter, setGlobalFilter, fuzzySearchOptions } = useFuzzySearch<TableData>(\n tableToolbarConfig?.isSearchEnabled,\n tableToolbarConfig?.fuzzyMatchThreshold ?? 'CONTAINS',\n expanded,\n setExpanded\n );\n\n const [columnVisibility, setColumnVisibility] = useState<VisibilityState>(\n hiddenColumns?.reduce((acc, columnId) => ({ ...acc, [columnId]: false }), {}) ?? {}\n );\n\n const handleRowSelectionChange: OnChangeFn<RowSelectionState> = (rowSelectionUpdater) => {\n const newRowSelection =\n typeof rowSelectionUpdater === 'function' ? rowSelectionUpdater(rowSelection) : rowSelectionUpdater;\n onRowSelectionChange?.(newRowSelection);\n };\n\n const handleRowSelectionEvent = useCallback(\n (table: TanstackTable<TableData>, row: Row<TableData>, isModified: boolean) => {\n if (rowSelectionVariant === 'standard' || isModified) {\n row.toggleSelected();\n } else {\n // Legend variant (when action not modified with shift/meta key).\n // Note that this behavior needs to be kept in sync with behavior in\n // the Legend component for list-based legends.\n if (row.getIsSelected() && !table.getIsAllRowsSelected()) {\n // Row was already selected. Revert to select all.\n table.toggleAllRowsSelected();\n } else {\n // Focus the selected row.\n onRowSelectionChange?.({\n [row.id]: true,\n });\n }\n }\n },\n [onRowSelectionChange, rowSelectionVariant]\n );\n\n const handleCheckboxChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>, table: TanstackTable<TableData>, row: Row<TableData>) => {\n const nativePointerEvent =\n e.nativeEvent && (e.nativeEvent instanceof MouseEvent || e.nativeEvent instanceof KeyboardEvent)\n ? (e.nativeEvent as PointerEvent)\n : undefined;\n const isModifed = !!nativePointerEvent?.metaKey || !!nativePointerEvent?.shiftKey;\n handleRowSelectionEvent(table, row, isModifed);\n },\n [handleRowSelectionEvent]\n );\n\n const handleSortingChange: OnChangeFn<SortingState> = (sortingUpdater) => {\n const newSorting = typeof sortingUpdater === 'function' ? sortingUpdater(sorting) : sortingUpdater;\n onSortingChange?.(newSorting);\n };\n\n const actionsColumn: ColumnDef<TableData> = useMemo(() => {\n return {\n id: 'itemActions',\n header: 'Actions',\n cell: ({ row }): ReactElement => {\n return (\n <Stack direction=\"row\" alignItems=\"center\">\n {getItemActions?.({ id: row.id, data: row.original })}\n </Stack>\n );\n },\n enableSorting: false,\n enableResizing: false,\n };\n }, [getItemActions]);\n\n const checkboxColumn: ColumnDef<TableData> = useMemo(() => {\n return {\n id: 'checkboxRowSelect',\n size: 28,\n header: ({ table }): ReactElement => {\n return (\n <TableCheckbox\n checked={table.getIsAllRowsSelected()}\n indeterminate={table.getIsSomeRowsSelected()}\n onChange={table.getToggleAllRowsSelectedHandler()}\n color={theme.palette.text.primary}\n density={density}\n />\n );\n },\n cell: ({ row, table }): ReactElement => {\n return (\n <TableCheckbox\n checked={row.getIsSelected()}\n indeterminate={row.getIsSomeSelected()}\n onChange={(e) => {\n handleCheckboxChange(e, table, row);\n }}\n color={getCheckboxColor?.(row.original)}\n density={density}\n />\n );\n },\n enableSorting: false,\n enableResizing: false,\n };\n }, [theme.palette.text.primary, density, getCheckboxColor, handleCheckboxChange]);\n\n const tableColumns: Array<ColumnDef<TableData>> = useMemo(() => {\n const initTableColumns = persesColumnsToTanstackColumns(columns, defaultColumnConfig);\n\n if (hasItemActions) {\n initTableColumns.unshift(actionsColumn);\n }\n\n if (checkboxSelection) {\n initTableColumns.unshift(checkboxColumn);\n }\n\n return initTableColumns;\n }, [columns, defaultColumnConfig, hasItemActions, checkboxSelection, actionsColumn, checkboxColumn]);\n\n const table = useReactTable({\n data,\n columns: tableColumns,\n getRowId: getRowId,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getPaginationRowModel: pagination ? getPaginationRowModel() : undefined,\n // without this setting, the getPaginationRowModel setting persists and it is not possible to switch from paginated to unpaginated\n // can be removed once https://github.com/TanStack/table/pull/5974 is merged\n manualPagination: !pagination,\n enableRowSelection: !!checkboxSelection,\n onRowSelectionChange: handleRowSelectionChange,\n onSortingChange: handleSortingChange,\n onColumnVisibilityChange: setColumnVisibility,\n getSubRows: getSubRows,\n getExpandedRowModel: hasSubRows ? getExpandedRowModel() : undefined,\n ...fuzzySearchOptions,\n // For now, defaulting to sort by descending first. We can expose the ability\n // to customize it if/when we have use cases for it.\n sortDescFirst: true,\n columnResizeMode,\n onExpandedChange: setExpanded,\n state: {\n rowSelection,\n sorting,\n globalFilter: tableToolbarConfig?.isSearchEnabled ? globalFilter : undefined,\n columnVisibility,\n ...(pagination ? { pagination } : {}),\n expanded,\n },\n });\n\n const handleRowClick = useCallback(\n (e: React.MouseEvent<HTMLDivElement, MouseEvent>, rowId: string) => {\n const row = table.getRow(rowId);\n const isModifiedClick = e.metaKey || e.shiftKey;\n handleRowSelectionEvent(table, row, isModifiedClick);\n },\n [handleRowSelectionEvent, table]\n );\n\n return (\n <VirtualizedTable\n {...otherProps}\n density={density}\n defaultColumnWidth={defaultColumnWidth}\n defaultColumnHeight={defaultColumnHeight}\n onRowClick={handleRowClick}\n rows={table.getRowModel().rows}\n columns={table.getVisibleFlatColumns()}\n columnSizing={table.getState().columnSizing}\n columnSizingInfo={table.getState().columnSizingInfo}\n headers={table.getHeaderGroups()}\n cellConfigs={cellConfigs}\n pagination={pagination}\n onPaginationChange={onPaginationChange}\n rowCount={table.getRowCount()}\n toolbarConfig={{\n isSearchEnabled: tableToolbarConfig?.isSearchEnabled,\n globalFilter,\n onGlobalFilterChange: setGlobalFilter,\n isColumnFilterEnabled: tableToolbarConfig?.isColumnFilterEnabled,\n columns: table.getAllColumns(),\n columnFilterMenuMaxHeight: tableToolbarConfig?.columnFilterMenuMaxHeight,\n isExpandAllEnabled: hasSubRows,\n isAllExpanded: table.getIsAllRowsExpanded(),\n onExpandAllChange: table.getToggleAllRowsExpandedHandler(),\n }}\n />\n );\n}\n"],"names":["Stack","useTheme","getCoreRowModel","getExpandedRowModel","getPaginationRowModel","getSortedRowModel","useReactTable","useCallback","useMemo","useState","useFuzzySearch","TableCheckbox","VirtualizedTable","DEFAULT_COLUMN_WIDTH","persesColumnsToTanstackColumns","DEFAULT_GET_ROW_ID","data","index","DEFAULT_ROW_SELECTION","DEFAULT_SORTING","Table","columns","cellConfigs","density","defaultColumnWidth","defaultColumnHeight","checkboxSelection","onRowSelectionChange","onSortingChange","getCheckboxColor","getRowId","rowSelection","sorting","getItemActions","hasItemActions","pagination","onPaginationChange","rowSelectionVariant","getSubRows","hiddenColumns","tableToolbarConfig","columnResizeMode","defaultColumnConfig","otherProps","theme","hasSubRows","expanded","setExpanded","globalFilter","setGlobalFilter","fuzzySearchOptions","isSearchEnabled","fuzzyMatchThreshold","columnVisibility","setColumnVisibility","reduce","acc","columnId","handleRowSelectionChange","rowSelectionUpdater","newRowSelection","handleRowSelectionEvent","table","row","isModified","toggleSelected","getIsSelected","getIsAllRowsSelected","toggleAllRowsSelected","id","handleCheckboxChange","e","nativePointerEvent","nativeEvent","MouseEvent","KeyboardEvent","undefined","isModifed","metaKey","shiftKey","handleSortingChange","sortingUpdater","newSorting","actionsColumn","header","cell","direction","alignItems","original","enableSorting","enableResizing","checkboxColumn","size","checked","indeterminate","getIsSomeRowsSelected","onChange","getToggleAllRowsSelectedHandler","color","palette","text","primary","getIsSomeSelected","tableColumns","initTableColumns","unshift","manualPagination","enableRowSelection","onColumnVisibilityChange","sortDescFirst","onExpandedChange","state","handleRowClick","rowId","getRow","isModifiedClick","onRowClick","rows","getRowModel","getVisibleFlatColumns","columnSizing","getState","columnSizingInfo","headers","getHeaderGroups","rowCount","getRowCount","toolbarConfig","onGlobalFilterChange","isColumnFilterEnabled","getAllColumns","columnFilterMenuMaxHeight","isExpandAllEnabled","isAllExpanded","getIsAllRowsExpanded","onExpandAllChange","getToggleAllRowsExpandedHandler"],"mappings":"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"}
|
package/dist/Table/TableBody.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
// Copyright The Perses Authors
|
|
2
3
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
4
|
// you may not use this file except in compliance with the License.
|
|
@@ -10,7 +11,6 @@
|
|
|
10
11
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
12
|
// See the License for the specific language governing permissions and
|
|
12
13
|
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
14
|
import { TableBody as MuiTableBody } from '@mui/material';
|
|
15
15
|
import { forwardRef } from 'react';
|
|
16
16
|
export const TableBody = /*#__PURE__*/ forwardRef(function TableBody(props, ref) {
|