@perses-dev/components 0.55.0-beta.8 → 0.55.0-rc.0

package/dist/{utils/component-ids.js → ExemplarMetadata/index.js}

@@ -4,24 +4,11 @@
 // You may obtain a copy of the License at
 //
 // http://www.apache.org/licenses/LICENSE-2.0
-//
 // Unless required by applicable law or agreed to in writing, software
 // distributed under the License is distributed on an "AS IS" BASIS,
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { useRef } from "react";
-/**
- * Generates a unique (stable) ID for a component. Should be replaced with React.useId once we support only React 18.
- */ export function useId(prefix) {
-    if (globalThis.useIdValue === undefined) {
-        globalThis.useIdValue = 0;
-    }
-    const id = useRef(undefined);
-    if (id.current === undefined) {
-        id.current = `${prefix}-${globalThis.useIdValue++}`;
-    }
-    return id.current;
-}
+export * from "./ExemplarMetadataTooltip.js";
 
-//# sourceMappingURL=component-ids.js.map
+//# sourceMappingURL=index.js.map

package/dist/ExemplarMetadata/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ExemplarMetadata/index.ts"],"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// 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\nexport * from './ExemplarMetadataTooltip';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,+BAA4B"}

package/dist/FormatControls/FormatControls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormatControls.d.ts","sourceRoot":"","sources":["../../src/FormatControls/FormatControls.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAM9C,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAiBD,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAgB,EAAE,EAAE,mBAAmB,GAAG,YAAY,CA+DvG"}
+{"version":3,"file":"FormatControls.d.ts","sourceRoot":"","sources":["../../src/FormatControls/FormatControls.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAM9C,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAiBD,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAgB,EAAE,EAAE,mBAAmB,GAAG,YAAY,CAkGvG"}

package/dist/FormatControls/FormatControls.js

@@ -11,8 +11,8 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Switch } from "@mui/material";
-import { isUnitWithDecimalPlaces, isUnitWithShortValues, shouldShortenValues } from "../model/index.js";
+import { Switch, TextField } from "@mui/material";
+import { isUnitWithDecimalPlaces, isUnitWithShortValues, shouldShortenValues, supportsCustomLabel } from "../model/index.js";
 import { OptionsEditorControl } from "../OptionsEditorLayout/index.js";
 import { SettingsAutocomplete } from "../SettingsAutocomplete/index.js";
 import { UnitSelector } from "./UnitSelector.js";
@@ -55,10 +55,21 @@ export function FormatControls({ value, onChange, disabled = false }) {
     const hasDecimalPlaces = isUnitWithDecimalPlaces(value);
     const hasShortValues = isUnitWithShortValues(value);
     const handleUnitChange = (newValue)=>{
-        onChange(newValue || {
+        const next = newValue || {
             unit: 'decimal'
-        }); // Fallback to 'decimal' if undefined
+        };
+        const customLabel = value.customLabel?.trim();
+        // Keep label only when the new unit supports customLabel (whitelist).
+        if (customLabel && supportsCustomLabel(next.unit)) {
+            onChange({
+                ...next,
+                customLabel: value.customLabel
+            });
+            return;
+        }
+        onChange(next);
     };
+    const showCustomLabel = supportsCustomLabel(value.unit);
     const handleDecimalPlacesChange = ({ decimalPlaces })=>{
         if (hasDecimalPlaces) {
             onChange({
@@ -75,6 +86,18 @@ export function FormatControls({ value, onChange, disabled = false }) {
             });
         }
     };
+    const handleCustomLabelChange = (raw)=>{
+        // Keep raw input while typing (spaces allowed). Trim only when clearing / display.
+        if (raw === '') {
+            const { customLabel: _removed, ...rest } = value;
+            onChange(rest);
+            return;
+        }
+        onChange({
+            ...value,
+            customLabel: raw
+        });
+    };
     return /*#__PURE__*/ _jsxs(_Fragment, {
         children: [
             /*#__PURE__*/ _jsx(OptionsEditorControl, {
@@ -93,6 +116,21 @@ export function FormatControls({ value, onChange, disabled = false }) {
                     disabled: disabled
                 })
             }),
+            showCustomLabel && /*#__PURE__*/ _jsx(OptionsEditorControl, {
+                label: "Custom label",
+                control: /*#__PURE__*/ _jsx(TextField, {
+                    size: "small",
+                    fullWidth: true,
+                    value: value.customLabel ?? '',
+                    onChange: (e)=>handleCustomLabelChange(e.target.value),
+                    placeholder: "Optional display override (e.g. pnr/mn)",
+                    disabled: disabled,
+                    inputProps: {
+                        'aria-label': 'custom unit label',
+                        maxLength: 32
+                    }
+                })
+            }),
             /*#__PURE__*/ _jsx(OptionsEditorControl, {
                 label: "Decimals",
                 control: /*#__PURE__*/ _jsx(SettingsAutocomplete, {

package/dist/FormatControls/FormatControls.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/FormatControls/FormatControls.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.\nimport type { SwitchProps } from '@mui/material';\nimport { Switch } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport type { FormatOptions } from '../model';\nimport { isUnitWithDecimalPlaces, isUnitWithShortValues, shouldShortenValues } from '../model';\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\nimport { UnitSelector } from './UnitSelector';\n\nexport interface FormatControlsProps {\n  value: FormatOptions;\n  onChange: (unit: FormatOptions) => void;\n  disabled?: boolean;\n}\n\nconst DECIMAL_PLACES_OPTIONS: Array<{ id: string; label: string; decimalPlaces?: number }> = [\n  { id: 'default', label: 'Default', decimalPlaces: undefined },\n  { id: '0', label: '0', decimalPlaces: 0 },\n  { id: '1', label: '1', decimalPlaces: 1 },\n  { id: '2', label: '2', decimalPlaces: 2 },\n  { id: '3', label: '3', decimalPlaces: 3 },\n  { id: '4', label: '4', decimalPlaces: 4 },\n];\n\nfunction getOptionByDecimalPlaces(\n  decimalPlaces?: number,\n): { id: string; label: string; decimalPlaces?: number } | undefined {\n  return DECIMAL_PLACES_OPTIONS.find((o) => o.decimalPlaces === decimalPlaces);\n}\n\nexport function FormatControls({ value, onChange, disabled = false }: FormatControlsProps): ReactElement {\n  const hasDecimalPlaces = isUnitWithDecimalPlaces(value);\n  const hasShortValues = isUnitWithShortValues(value);\n\n  const handleUnitChange = (newValue: FormatOptions | undefined): void => {\n    onChange(newValue || { unit: 'decimal' }); // Fallback to 'decimal' if undefined\n  };\n\n  const handleDecimalPlacesChange = ({\n    decimalPlaces,\n  }: {\n    id: string;\n    label: string;\n    decimalPlaces?: number;\n  }): void => {\n    if (hasDecimalPlaces) {\n      onChange({\n        ...value,\n        decimalPlaces: decimalPlaces,\n      });\n    }\n  };\n\n  const handleShortValuesChange: SwitchProps['onChange'] = (_: unknown, checked: boolean) => {\n    if (hasShortValues) {\n      onChange({\n        ...value,\n        shortValues: checked,\n      });\n    }\n  };\n\n  return (\n    <>\n      <OptionsEditorControl\n        label=\"Short values\"\n        control={\n          <Switch\n            checked={hasShortValues ? shouldShortenValues(value.shortValues) : false}\n            onChange={handleShortValuesChange}\n            disabled={!hasShortValues}\n          />\n        }\n      />\n      <OptionsEditorControl\n        label=\"Unit\"\n        control={<UnitSelector value={value} onChange={handleUnitChange} disabled={disabled} />}\n      />\n      <OptionsEditorControl\n        label=\"Decimals\"\n        control={\n          <SettingsAutocomplete\n            value={getOptionByDecimalPlaces(value.decimalPlaces)}\n            options={DECIMAL_PLACES_OPTIONS}\n            getOptionLabel={(o) => o.label}\n            onChange={(_, value) => handleDecimalPlacesChange(value)}\n            disabled={!hasDecimalPlaces}\n            disableClearable\n          />\n        }\n      />\n    </>\n  );\n}\n"],"names":["Switch","isUnitWithDecimalPlaces","isUnitWithShortValues","shouldShortenValues","OptionsEditorControl","SettingsAutocomplete","UnitSelector","DECIMAL_PLACES_OPTIONS","id","label","decimalPlaces","undefined","getOptionByDecimalPlaces","find","o","FormatControls","value","onChange","disabled","hasDecimalPlaces","hasShortValues","handleUnitChange","newValue","unit","handleDecimalPlacesChange","handleShortValuesChange","_","checked","shortValues","control","options","getOptionLabel","disableClearable"],"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,MAAM,QAAQ,gBAAgB;AAIvC,SAASC,uBAAuB,EAAEC,qBAAqB,EAAEC,mBAAmB,QAAQ,oBAAW;AAC/F,SAASC,oBAAoB,QAAQ,kCAAyB;AAC9D,SAASC,oBAAoB,QAAQ,mCAA0B;AAC/D,SAASC,YAAY,QAAQ,oBAAiB;AAQ9C,MAAMC,yBAAuF;IAC3F;QAAEC,IAAI;QAAWC,OAAO;QAAWC,eAAeC;IAAU;IAC5D;QAAEH,IAAI;QAAKC,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEF,IAAI;QAAKC,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEF,IAAI;QAAKC,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEF,IAAI;QAAKC,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEF,IAAI;QAAKC,OAAO;QAAKC,eAAe;IAAE;CACzC;AAED,SAASE,yBACPF,aAAsB;IAEtB,OAAOH,uBAAuBM,IAAI,CAAC,CAACC,IAAMA,EAAEJ,aAAa,KAAKA;AAChE;AAEA,OAAO,SAASK,eAAe,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,WAAW,KAAK,EAAuB;IACvF,MAAMC,mBAAmBlB,wBAAwBe;IACjD,MAAMI,iBAAiBlB,sBAAsBc;IAE7C,MAAMK,mBAAmB,CAACC;QACxBL,SAASK,YAAY;YAAEC,MAAM;QAAU,IAAI,qCAAqC;IAClF;IAEA,MAAMC,4BAA4B,CAAC,EACjCd,aAAa,EAKd;QACC,IAAIS,kBAAkB;YACpBF,SAAS;gBACP,GAAGD,KAAK;gBACRN,eAAeA;YACjB;QACF;IACF;IAEA,MAAMe,0BAAmD,CAACC,GAAYC;QACpE,IAAIP,gBAAgB;YAClBH,SAAS;gBACP,GAAGD,KAAK;gBACRY,aAAaD;YACf;QACF;IACF;IAEA,qBACE;;0BACE,KAACvB;gBACCK,OAAM;gBACNoB,uBACE,KAAC7B;oBACC2B,SAASP,iBAAiBjB,oBAAoBa,MAAMY,WAAW,IAAI;oBACnEX,UAAUQ;oBACVP,UAAU,CAACE;;;0BAIjB,KAAChB;gBACCK,OAAM;gBACNoB,uBAAS,KAACvB;oBAAaU,OAAOA;oBAAOC,UAAUI;oBAAkBH,UAAUA;;;0BAE7E,KAACd;gBACCK,OAAM;gBACNoB,uBACE,KAACxB;oBACCW,OAAOJ,yBAAyBI,MAAMN,aAAa;oBACnDoB,SAASvB;oBACTwB,gBAAgB,CAACjB,IAAMA,EAAEL,KAAK;oBAC9BQ,UAAU,CAACS,GAAGV,QAAUQ,0BAA0BR;oBAClDE,UAAU,CAACC;oBACXa,gBAAgB;;;;;AAM5B"}
+{"version":3,"sources":["../../src/FormatControls/FormatControls.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.\nimport type { SwitchProps } from '@mui/material';\nimport { Switch, TextField } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport type { FormatOptions } from '../model';\nimport { isUnitWithDecimalPlaces, isUnitWithShortValues, shouldShortenValues, supportsCustomLabel } from '../model';\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\nimport { UnitSelector } from './UnitSelector';\n\nexport interface FormatControlsProps {\n  value: FormatOptions;\n  onChange: (unit: FormatOptions) => void;\n  disabled?: boolean;\n}\n\nconst DECIMAL_PLACES_OPTIONS: Array<{ id: string; label: string; decimalPlaces?: number }> = [\n  { id: 'default', label: 'Default', decimalPlaces: undefined },\n  { id: '0', label: '0', decimalPlaces: 0 },\n  { id: '1', label: '1', decimalPlaces: 1 },\n  { id: '2', label: '2', decimalPlaces: 2 },\n  { id: '3', label: '3', decimalPlaces: 3 },\n  { id: '4', label: '4', decimalPlaces: 4 },\n];\n\nfunction getOptionByDecimalPlaces(\n  decimalPlaces?: number,\n): { id: string; label: string; decimalPlaces?: number } | undefined {\n  return DECIMAL_PLACES_OPTIONS.find((o) => o.decimalPlaces === decimalPlaces);\n}\n\nexport function FormatControls({ value, onChange, disabled = false }: FormatControlsProps): ReactElement {\n  const hasDecimalPlaces = isUnitWithDecimalPlaces(value);\n  const hasShortValues = isUnitWithShortValues(value);\n\n  const handleUnitChange = (newValue: FormatOptions | undefined): void => {\n    const next = newValue || { unit: 'decimal' };\n    const customLabel = value.customLabel?.trim();\n    // Keep label only when the new unit supports customLabel (whitelist).\n    if (customLabel && supportsCustomLabel(next.unit)) {\n      onChange({ ...next, customLabel: value.customLabel });\n      return;\n    }\n    onChange(next);\n  };\n\n  const showCustomLabel = supportsCustomLabel(value.unit);\n\n  const handleDecimalPlacesChange = ({\n    decimalPlaces,\n  }: {\n    id: string;\n    label: string;\n    decimalPlaces?: number;\n  }): void => {\n    if (hasDecimalPlaces) {\n      onChange({\n        ...value,\n        decimalPlaces: decimalPlaces,\n      });\n    }\n  };\n\n  const handleShortValuesChange: SwitchProps['onChange'] = (_: unknown, checked: boolean) => {\n    if (hasShortValues) {\n      onChange({\n        ...value,\n        shortValues: checked,\n      });\n    }\n  };\n\n  const handleCustomLabelChange = (raw: string): void => {\n    // Keep raw input while typing (spaces allowed). Trim only when clearing / display.\n    if (raw === '') {\n      const { customLabel: _removed, ...rest } = value;\n      onChange(rest as FormatOptions);\n      return;\n    }\n    onChange({ ...value, customLabel: raw });\n  };\n\n  return (\n    <>\n      <OptionsEditorControl\n        label=\"Short values\"\n        control={\n          <Switch\n            checked={hasShortValues ? shouldShortenValues(value.shortValues) : false}\n            onChange={handleShortValuesChange}\n            disabled={!hasShortValues}\n          />\n        }\n      />\n      <OptionsEditorControl\n        label=\"Unit\"\n        control={<UnitSelector value={value} onChange={handleUnitChange} disabled={disabled} />}\n      />\n      {showCustomLabel && (\n        <OptionsEditorControl\n          label=\"Custom label\"\n          control={\n            <TextField\n              size=\"small\"\n              fullWidth\n              value={value.customLabel ?? ''}\n              onChange={(e) => handleCustomLabelChange(e.target.value)}\n              placeholder=\"Optional display override (e.g. pnr/mn)\"\n              disabled={disabled}\n              inputProps={{ 'aria-label': 'custom unit label', maxLength: 32 }}\n            />\n          }\n        />\n      )}\n      <OptionsEditorControl\n        label=\"Decimals\"\n        control={\n          <SettingsAutocomplete\n            value={getOptionByDecimalPlaces(value.decimalPlaces)}\n            options={DECIMAL_PLACES_OPTIONS}\n            getOptionLabel={(o) => o.label}\n            onChange={(_, value) => handleDecimalPlacesChange(value)}\n            disabled={!hasDecimalPlaces}\n            disableClearable\n          />\n        }\n      />\n    </>\n  );\n}\n"],"names":["Switch","TextField","isUnitWithDecimalPlaces","isUnitWithShortValues","shouldShortenValues","supportsCustomLabel","OptionsEditorControl","SettingsAutocomplete","UnitSelector","DECIMAL_PLACES_OPTIONS","id","label","decimalPlaces","undefined","getOptionByDecimalPlaces","find","o","FormatControls","value","onChange","disabled","hasDecimalPlaces","hasShortValues","handleUnitChange","newValue","next","unit","customLabel","trim","showCustomLabel","handleDecimalPlacesChange","handleShortValuesChange","_","checked","shortValues","handleCustomLabelChange","raw","_removed","rest","control","size","fullWidth","e","target","placeholder","inputProps","maxLength","options","getOptionLabel","disableClearable"],"mappings":"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"}

package/dist/FormatControls/UnitSelector.js

@@ -27,11 +27,11 @@ export function UnitSelector({ value, onChange, disabled = false, ...otherProps
     const handleChange = (_, newValue)=>{
         if (newValue === null) {
             onChange(undefined);
-        } else {
-            onChange({
-                unit: newValue.id
-            });
+            return;
         }
+        onChange({
+            unit: newValue.id
+        });
     };
     return /*#__PURE__*/ _jsx(SettingsAutocomplete, {
         value: {

package/dist/FormatControls/UnitSelector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/FormatControls/UnitSelector.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 { IconButton, InputAdornment, TextField } from '@mui/material';\nimport ClearIcon from 'mdi-material-ui/Close';\nimport type { ReactElement } from 'react';\n\nimport type { FormatOptions, UnitConfig } from '../model';\nimport { UNIT_CONFIG } from '../model';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\n\nexport interface UnitSelectorProps {\n  value?: FormatOptions;\n  onChange: (format: FormatOptions | undefined) => void;\n  disabled?: boolean;\n}\n\ntype AutocompleteUnitOption = UnitConfig & {\n  id: NonNullable<FormatOptions['unit']>;\n};\n\nconst KIND_OPTIONS: readonly AutocompleteUnitOption[] = Object.entries(UNIT_CONFIG)\n  .map<AutocompleteUnitOption>(([id, config]) => {\n    return {\n      ...config,\n      id: id as AutocompleteUnitOption['id'],\n      group: config.group || 'Decimal',\n    };\n  })\n  .filter((config) => !config.disableSelectorOption);\n\nexport function UnitSelector({ value, onChange, disabled = false, ...otherProps }: UnitSelectorProps): ReactElement {\n  const unitConfig = UNIT_CONFIG[value?.unit || 'decimal'];\n\n  const handleChange = (_: unknown, newValue: AutocompleteUnitOption | null): void => {\n    if (newValue === null) {\n      onChange(undefined);\n    } else {\n      onChange({ unit: newValue.id } as FormatOptions);\n    }\n  };\n\n  return (\n    <SettingsAutocomplete<AutocompleteUnitOption, false, true>\n      value={{ id: value?.unit || 'decimal', ...unitConfig }}\n      options={KIND_OPTIONS}\n      groupBy={(option) => option.group ?? 'Decimal'}\n      onChange={handleChange}\n      disabled={disabled}\n      disableClearable\n      renderInput={({ InputProps, ...params }) => (\n        <TextField\n          {...params}\n          slotProps={{\n            input: {\n              ...InputProps,\n              endAdornment: (\n                <>\n                  {InputProps.endAdornment}\n                  <InputAdornment position=\"end\">\n                    <IconButton\n                      size=\"small\"\n                      aria-label=\"clear unit\"\n                      onClick={() => onChange(undefined)}\n                      disabled={disabled}\n                      tabIndex={-1}\n                    >\n                      <ClearIcon fontSize=\"small\" />\n                    </IconButton>\n                  </InputAdornment>\n                </>\n              ),\n            },\n          }}\n        />\n      )}\n      {...otherProps}\n    />\n  );\n}\n"],"names":["IconButton","InputAdornment","TextField","ClearIcon","UNIT_CONFIG","SettingsAutocomplete","KIND_OPTIONS","Object","entries","map","id","config","group","filter","disableSelectorOption","UnitSelector","value","onChange","disabled","otherProps","unitConfig","unit","handleChange","_","newValue","undefined","options","groupBy","option","disableClearable","renderInput","InputProps","params","slotProps","input","endAdornment","position","size","aria-label","onClick","tabIndex","fontSize"],"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,UAAU,EAAEC,cAAc,EAAEC,SAAS,QAAQ,gBAAgB;AACtE,OAAOC,eAAe,wBAAwB;AAI9C,SAASC,WAAW,QAAQ,oBAAW;AACvC,SAASC,oBAAoB,QAAQ,mCAA0B;AAY/D,MAAMC,eAAkDC,OAAOC,OAAO,CAACJ,aACpEK,GAAG,CAAyB,CAAC,CAACC,IAAIC,OAAO;IACxC,OAAO;QACL,GAAGA,MAAM;QACTD,IAAIA;QACJE,OAAOD,OAAOC,KAAK,IAAI;IACzB;AACF,GACCC,MAAM,CAAC,CAACF,SAAW,CAACA,OAAOG,qBAAqB;AAEnD,OAAO,SAASC,aAAa,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,WAAW,KAAK,EAAE,GAAGC,YAA+B;IAClG,MAAMC,aAAahB,WAAW,CAACY,OAAOK,QAAQ,UAAU;IAExD,MAAMC,eAAe,CAACC,GAAYC;QAChC,IAAIA,aAAa,MAAM;YACrBP,SAASQ;QACX,OAAO;YACLR,SAAS;gBAAEI,MAAMG,SAASd,EAAE;YAAC;QAC/B;IACF;IAEA,qBACE,KAACL;QACCW,OAAO;YAAEN,IAAIM,OAAOK,QAAQ;YAAW,GAAGD,UAAU;QAAC;QACrDM,SAASpB;QACTqB,SAAS,CAACC,SAAWA,OAAOhB,KAAK,IAAI;QACrCK,UAAUK;QACVJ,UAAUA;QACVW,gBAAgB;QAChBC,aAAa,CAAC,EAAEC,UAAU,EAAE,GAAGC,QAAQ,iBACrC,KAAC9B;gBACE,GAAG8B,MAAM;gBACVC,WAAW;oBACTC,OAAO;wBACL,GAAGH,UAAU;wBACbI,4BACE;;gCACGJ,WAAWI,YAAY;8CACxB,KAAClC;oCAAemC,UAAS;8CACvB,cAAA,KAACpC;wCACCqC,MAAK;wCACLC,cAAW;wCACXC,SAAS,IAAMtB,SAASQ;wCACxBP,UAAUA;wCACVsB,UAAU,CAAC;kDAEX,cAAA,KAACrC;4CAAUsC,UAAS;;;;;;oBAK9B;gBACF;;QAGH,GAAGtB,UAAU;;AAGpB"}
+{"version":3,"sources":["../../src/FormatControls/UnitSelector.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 { IconButton, InputAdornment, TextField } from '@mui/material';\nimport ClearIcon from 'mdi-material-ui/Close';\nimport type { ReactElement } from 'react';\n\nimport type { FormatOptions, UnitConfig } from '../model';\nimport { UNIT_CONFIG } from '../model';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\n\nexport interface UnitSelectorProps {\n  value?: FormatOptions;\n  onChange: (format: FormatOptions | undefined) => void;\n  disabled?: boolean;\n}\n\ntype AutocompleteUnitOption = UnitConfig & {\n  id: NonNullable<FormatOptions['unit']>;\n};\n\nconst KIND_OPTIONS: readonly AutocompleteUnitOption[] = Object.entries(UNIT_CONFIG)\n  .map<AutocompleteUnitOption>(([id, config]) => {\n    return {\n      ...config,\n      id: id as AutocompleteUnitOption['id'],\n      group: config.group || 'Decimal',\n    };\n  })\n  .filter((config) => !config.disableSelectorOption);\n\nexport function UnitSelector({ value, onChange, disabled = false, ...otherProps }: UnitSelectorProps): ReactElement {\n  const unitConfig = UNIT_CONFIG[value?.unit || 'decimal'];\n\n  const handleChange = (_: unknown, newValue: AutocompleteUnitOption | null): void => {\n    if (newValue === null) {\n      onChange(undefined);\n      return;\n    }\n    onChange({ unit: newValue.id } as FormatOptions);\n  };\n\n  return (\n    <SettingsAutocomplete<AutocompleteUnitOption, false, true>\n      value={{ id: value?.unit || 'decimal', ...unitConfig }}\n      options={KIND_OPTIONS}\n      groupBy={(option) => option.group ?? 'Decimal'}\n      onChange={handleChange}\n      disabled={disabled}\n      disableClearable\n      renderInput={({ InputProps, ...params }) => (\n        <TextField\n          {...params}\n          slotProps={{\n            input: {\n              ...InputProps,\n              endAdornment: (\n                <>\n                  {InputProps.endAdornment}\n                  <InputAdornment position=\"end\">\n                    <IconButton\n                      size=\"small\"\n                      aria-label=\"clear unit\"\n                      onClick={() => onChange(undefined)}\n                      disabled={disabled}\n                      tabIndex={-1}\n                    >\n                      <ClearIcon fontSize=\"small\" />\n                    </IconButton>\n                  </InputAdornment>\n                </>\n              ),\n            },\n          }}\n        />\n      )}\n      {...otherProps}\n    />\n  );\n}\n"],"names":["IconButton","InputAdornment","TextField","ClearIcon","UNIT_CONFIG","SettingsAutocomplete","KIND_OPTIONS","Object","entries","map","id","config","group","filter","disableSelectorOption","UnitSelector","value","onChange","disabled","otherProps","unitConfig","unit","handleChange","_","newValue","undefined","options","groupBy","option","disableClearable","renderInput","InputProps","params","slotProps","input","endAdornment","position","size","aria-label","onClick","tabIndex","fontSize"],"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,UAAU,EAAEC,cAAc,EAAEC,SAAS,QAAQ,gBAAgB;AACtE,OAAOC,eAAe,wBAAwB;AAI9C,SAASC,WAAW,QAAQ,oBAAW;AACvC,SAASC,oBAAoB,QAAQ,mCAA0B;AAY/D,MAAMC,eAAkDC,OAAOC,OAAO,CAACJ,aACpEK,GAAG,CAAyB,CAAC,CAACC,IAAIC,OAAO;IACxC,OAAO;QACL,GAAGA,MAAM;QACTD,IAAIA;QACJE,OAAOD,OAAOC,KAAK,IAAI;IACzB;AACF,GACCC,MAAM,CAAC,CAACF,SAAW,CAACA,OAAOG,qBAAqB;AAEnD,OAAO,SAASC,aAAa,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,WAAW,KAAK,EAAE,GAAGC,YAA+B;IAClG,MAAMC,aAAahB,WAAW,CAACY,OAAOK,QAAQ,UAAU;IAExD,MAAMC,eAAe,CAACC,GAAYC;QAChC,IAAIA,aAAa,MAAM;YACrBP,SAASQ;YACT;QACF;QACAR,SAAS;YAAEI,MAAMG,SAASd,EAAE;QAAC;IAC/B;IAEA,qBACE,KAACL;QACCW,OAAO;YAAEN,IAAIM,OAAOK,QAAQ;YAAW,GAAGD,UAAU;QAAC;QACrDM,SAASpB;QACTqB,SAAS,CAACC,SAAWA,OAAOhB,KAAK,IAAI;QACrCK,UAAUK;QACVJ,UAAUA;QACVW,gBAAgB;QAChBC,aAAa,CAAC,EAAEC,UAAU,EAAE,GAAGC,QAAQ,iBACrC,KAAC9B;gBACE,GAAG8B,MAAM;gBACVC,WAAW;oBACTC,OAAO;wBACL,GAAGH,UAAU;wBACbI,4BACE;;gCACGJ,WAAWI,YAAY;8CACxB,KAAClC;oCAAemC,UAAS;8CACvB,cAAA,KAACpC;wCACCqC,MAAK;wCACLC,cAAW;wCACXC,SAAS,IAAMtB,SAASQ;wCACxBP,UAAUA;wCACVsB,UAAU,CAAC;kDAEX,cAAA,KAACrC;4CAAUsC,UAAS;;;;;;oBAK9B;gBACF;;QAGH,GAAGtB,UAAU;;AAGpB"}

package/dist/Legend/TableLegend.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableLegend.d.ts","sourceRoot":"","sources":["../../src/Legend/TableLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,UAAU,EAAqB,MAAM,UAAU,CAAC;AAE9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACnG,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC;IAC9D,qBAAqB,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,sBAAsB,CAAC,CAAC;IACtE,eAAe,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,gBAAgB,CAAC,CAAC;IAC3D,cAAc,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD,OAAO,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC;CAC7C;AA2BD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,aAAa,EAAE,gBAAgB,EAC/B,qBAAqB,EACrB,eAAe,EACf,cAAc,EACd,MAAM,EACN,KAAK,EACL,OAAO,EAAE,iBAAsB,EAC/B,OAAO,EACP,eAAe,GAChB,EAAE,gBAAgB,GAAG,YAAY,CAyDjC"}
+{"version":3,"file":"TableLegend.d.ts","sourceRoot":"","sources":["../../src/Legend/TableLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,UAAU,EAAqB,MAAM,UAAU,CAAC;AAE9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACnG,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC;IAC9D,qBAAqB,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,sBAAsB,CAAC,CAAC;IACtE,eAAe,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,gBAAgB,CAAC,CAAC;IAC3D,cAAc,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD,OAAO,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC;CAC7C;AA4BD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,aAAa,EAAE,gBAAgB,EAC/B,qBAAqB,EACrB,eAAe,EACf,cAAc,EACd,MAAM,EACN,KAAK,EACL,OAAO,EAAE,iBAAiC,EAC1C,OAAO,EACP,eAAe,GAChB,EAAE,gBAAgB,GAAG,YAAY,CAyDjC"}

package/dist/Legend/TableLegend.js

@@ -36,7 +36,8 @@ const getCheckboxColor = (data)=>{
 };
 // This is a rough estimate of value that needs to be subtracted from the total width to avoid horizontal scrolling on initial render
 const TABLE_PADDING = 45;
-export function TableLegend({ items, selectedItems: initRowSelection, onSelectedItemsChange, onItemMouseOver, onItemMouseOut, height, width, columns: additionalColumns = [], sorting, onSortingChange }) {
+const EMPTY_COLUMNS = [];
+export function TableLegend({ items, selectedItems: initRowSelection, onSelectedItemsChange, onItemMouseOver, onItemMouseOut, height, width, columns: additionalColumns = EMPTY_COLUMNS, sorting, onSortingChange }) {
     const rowSelection = useMemo(()=>{
         return typeof initRowSelection !== 'string' ? initRowSelection : // items for checkboxes.
         // TODO: clean this up if we switch to also using checkboxes in list legend.

package/dist/Legend/TableLegend.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Legend/TableLegend.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 type { ReactElement } from 'react';\nimport { useMemo } from 'react';\n\nimport type { TableProps, TableColumnConfig } from '../Table';\nimport { Table, DEFAULT_COLUMN_WIDTH, DEFAULT_COLUMN_MIN_WIDTH } from '../Table';\nimport type { LegendItem } from './legend-model';\n\nexport interface TableLegendProps extends Pick<TableProps<LegendItem>, 'sorting' | 'onSortingChange'> {\n  items: LegendItem[];\n  height: number;\n  width: number;\n  selectedItems: TableProps<LegendItem>['rowSelection'] | 'ALL';\n  onSelectedItemsChange: TableProps<LegendItem>['onRowSelectionChange'];\n  onItemMouseOver?: TableProps<LegendItem>['onRowMouseOver'];\n  onItemMouseOut?: TableProps<LegendItem>['onRowMouseOut'];\n  columns?: TableProps<LegendItem>['columns'];\n}\n\nconst COLUMNS: Array<TableColumnConfig<LegendItem>> = [\n  {\n    accessorKey: 'label',\n    header: 'Name',\n    enableSorting: true,\n    enableResizing: true,\n\n    // Starting with `title` attr instead of a tooltip because it is easier to\n    // implement. We should try adding a tooltip in the future, but we'll need\n    // to be very careful about performance when doing so with large tables.\n    cell: ({ getValue }) => <span title={getValue()}>{getValue()}</span>,\n  },\n];\n\nconst getRowId: NonNullable<TableProps<LegendItem>['getRowId']> = (data) => {\n  return data.id;\n};\n\nconst getCheckboxColor: TableProps<LegendItem>['getCheckboxColor'] = (data) => {\n  return data.color;\n};\n\n// This is a rough estimate of value that needs to be subtracted from the total width to avoid horizontal scrolling on initial render\nconst TABLE_PADDING = 45;\n\nexport function TableLegend({\n  items,\n  selectedItems: initRowSelection,\n  onSelectedItemsChange,\n  onItemMouseOver,\n  onItemMouseOut,\n  height,\n  width,\n  columns: additionalColumns = [],\n  sorting,\n  onSortingChange,\n}: TableLegendProps): ReactElement {\n  const rowSelection = useMemo(() => {\n    return typeof initRowSelection !== 'string'\n      ? initRowSelection\n      : // Turn \"ALL\" state into a table component friendly map of all of the selected\n        // items for checkboxes.\n        // TODO: clean this up if we switch to also using checkboxes in list legend.\n        items.reduce(\n          (allRowSelection, item, index) => {\n            allRowSelection[getRowId(item, index)] = true;\n            return allRowSelection;\n          },\n          {} as Record<string, boolean>,\n        );\n  }, [initRowSelection, items]);\n\n  const columns = useMemo(() => {\n    // Calculate column widths to fit the container on initial render, avoiding unnecessary horizontal scrolling.\n    // Falls back to a default width if available width is too small; the user can resize columns as needed.\n    const additionalColumnsLength =\n      additionalColumns?.reduce((colWidth, col) => {\n        return colWidth + (typeof col.width === 'number' ? col.width : DEFAULT_COLUMN_WIDTH);\n      }, 0) ?? 0;\n    const availableWidth = Math.max(\n      width - additionalColumnsLength - TABLE_PADDING,\n      DEFAULT_COLUMN_MIN_WIDTH * COLUMNS.length,\n    );\n    const columnWidth = availableWidth / COLUMNS.length;\n    return [\n      ...COLUMNS.map((column) => ({\n        ...column,\n        width: columnWidth,\n      })),\n      ...additionalColumns,\n    ];\n  }, [additionalColumns, width]);\n\n  return (\n    <Table\n      height={height}\n      width={width}\n      rowSelection={rowSelection}\n      onRowSelectionChange={onSelectedItemsChange}\n      onRowMouseOver={onItemMouseOver}\n      onRowMouseOut={onItemMouseOut}\n      sorting={sorting}\n      onSortingChange={onSortingChange}\n      data={items}\n      columns={columns}\n      density=\"compact\"\n      defaultColumnWidth=\"auto\"\n      getRowId={getRowId}\n      getCheckboxColor={getCheckboxColor}\n      checkboxSelection\n      rowSelectionVariant=\"legend\"\n    />\n  );\n}\n"],"names":["useMemo","Table","DEFAULT_COLUMN_WIDTH","DEFAULT_COLUMN_MIN_WIDTH","COLUMNS","accessorKey","header","enableSorting","enableResizing","cell","getValue","span","title","getRowId","data","id","getCheckboxColor","color","TABLE_PADDING","TableLegend","items","selectedItems","initRowSelection","onSelectedItemsChange","onItemMouseOver","onItemMouseOut","height","width","columns","additionalColumns","sorting","onSortingChange","rowSelection","reduce","allRowSelection","item","index","additionalColumnsLength","colWidth","col","availableWidth","Math","max","length","columnWidth","map","column","onRowSelectionChange","onRowMouseOver","onRowMouseOut","density","defaultColumnWidth","checkboxSelection","rowSelectionVariant"],"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;;AAGjC,SAASA,OAAO,QAAQ,QAAQ;AAGhC,SAASC,KAAK,EAAEC,oBAAoB,EAAEC,wBAAwB,QAAQ,oBAAW;AAcjF,MAAMC,UAAgD;IACpD;QACEC,aAAa;QACbC,QAAQ;QACRC,eAAe;QACfC,gBAAgB;QAEhB,0EAA0E;QAC1E,0EAA0E;QAC1E,wEAAwE;QACxEC,MAAM,CAAC,EAAEC,QAAQ,EAAE,iBAAK,KAACC;gBAAKC,OAAOF;0BAAaA;;IACpD;CACD;AAED,MAAMG,WAA4D,CAACC;IACjE,OAAOA,KAAKC,EAAE;AAChB;AAEA,MAAMC,mBAA+D,CAACF;IACpE,OAAOA,KAAKG,KAAK;AACnB;AAEA,qIAAqI;AACrI,MAAMC,gBAAgB;AAEtB,OAAO,SAASC,YAAY,EAC1BC,KAAK,EACLC,eAAeC,gBAAgB,EAC/BC,qBAAqB,EACrBC,eAAe,EACfC,cAAc,EACdC,MAAM,EACNC,KAAK,EACLC,SAASC,oBAAoB,EAAE,EAC/BC,OAAO,EACPC,eAAe,EACE;IACjB,MAAMC,eAAehC,QAAQ;QAC3B,OAAO,OAAOsB,qBAAqB,WAC/BA,mBAEA,wBAAwB;QACxB,4EAA4E;QAC5EF,MAAMa,MAAM,CACV,CAACC,iBAAiBC,MAAMC;YACtBF,eAAe,CAACrB,SAASsB,MAAMC,OAAO,GAAG;YACzC,OAAOF;QACT,GACA,CAAC;IAET,GAAG;QAACZ;QAAkBF;KAAM;IAE5B,MAAMQ,UAAU5B,QAAQ;QACtB,6GAA6G;QAC7G,wGAAwG;QACxG,MAAMqC,0BACJR,mBAAmBI,OAAO,CAACK,UAAUC;YACnC,OAAOD,WAAY,CAAA,OAAOC,IAAIZ,KAAK,KAAK,WAAWY,IAAIZ,KAAK,GAAGzB,oBAAmB;QACpF,GAAG,MAAM;QACX,MAAMsC,iBAAiBC,KAAKC,GAAG,CAC7Bf,QAAQU,0BAA0BnB,eAClCf,2BAA2BC,QAAQuC,MAAM;QAE3C,MAAMC,cAAcJ,iBAAiBpC,QAAQuC,MAAM;QACnD,OAAO;eACFvC,QAAQyC,GAAG,CAAC,CAACC,SAAY,CAAA;oBAC1B,GAAGA,MAAM;oBACTnB,OAAOiB;gBACT,CAAA;eACGf;SACJ;IACH,GAAG;QAACA;QAAmBF;KAAM;IAE7B,qBACE,KAAC1B;QACCyB,QAAQA;QACRC,OAAOA;QACPK,cAAcA;QACde,sBAAsBxB;QACtByB,gBAAgBxB;QAChByB,eAAexB;QACfK,SAASA;QACTC,iBAAiBA;QACjBjB,MAAMM;QACNQ,SAASA;QACTsB,SAAQ;QACRC,oBAAmB;QACnBtC,UAAUA;QACVG,kBAAkBA;QAClBoC,iBAAiB;QACjBC,qBAAoB;;AAG1B"}
+{"version":3,"sources":["../../src/Legend/TableLegend.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 type { ReactElement } from 'react';\nimport { useMemo } from 'react';\n\nimport type { TableProps, TableColumnConfig } from '../Table';\nimport { Table, DEFAULT_COLUMN_WIDTH, DEFAULT_COLUMN_MIN_WIDTH } from '../Table';\nimport type { LegendItem } from './legend-model';\n\nexport interface TableLegendProps extends Pick<TableProps<LegendItem>, 'sorting' | 'onSortingChange'> {\n  items: LegendItem[];\n  height: number;\n  width: number;\n  selectedItems: TableProps<LegendItem>['rowSelection'] | 'ALL';\n  onSelectedItemsChange: TableProps<LegendItem>['onRowSelectionChange'];\n  onItemMouseOver?: TableProps<LegendItem>['onRowMouseOver'];\n  onItemMouseOut?: TableProps<LegendItem>['onRowMouseOut'];\n  columns?: TableProps<LegendItem>['columns'];\n}\n\nconst COLUMNS: Array<TableColumnConfig<LegendItem>> = [\n  {\n    accessorKey: 'label',\n    header: 'Name',\n    enableSorting: true,\n    enableResizing: true,\n\n    // Starting with `title` attr instead of a tooltip because it is easier to\n    // implement. We should try adding a tooltip in the future, but we'll need\n    // to be very careful about performance when doing so with large tables.\n    cell: ({ getValue }) => <span title={getValue<string>()}>{getValue<string>()}</span>,\n  },\n];\n\nconst getRowId: NonNullable<TableProps<LegendItem>['getRowId']> = (data) => {\n  return data.id;\n};\n\nconst getCheckboxColor: TableProps<LegendItem>['getCheckboxColor'] = (data) => {\n  return data.color;\n};\n\n// This is a rough estimate of value that needs to be subtracted from the total width to avoid horizontal scrolling on initial render\nconst TABLE_PADDING = 45;\nconst EMPTY_COLUMNS: Array<TableColumnConfig<LegendItem>> = [];\n\nexport function TableLegend({\n  items,\n  selectedItems: initRowSelection,\n  onSelectedItemsChange,\n  onItemMouseOver,\n  onItemMouseOut,\n  height,\n  width,\n  columns: additionalColumns = EMPTY_COLUMNS,\n  sorting,\n  onSortingChange,\n}: TableLegendProps): ReactElement {\n  const rowSelection = useMemo(() => {\n    return typeof initRowSelection !== 'string'\n      ? initRowSelection\n      : // Turn \"ALL\" state into a table component friendly map of all of the selected\n        // items for checkboxes.\n        // TODO: clean this up if we switch to also using checkboxes in list legend.\n        items.reduce(\n          (allRowSelection, item, index) => {\n            allRowSelection[getRowId(item, index)] = true;\n            return allRowSelection;\n          },\n          {} as Record<string, boolean>,\n        );\n  }, [initRowSelection, items]);\n\n  const columns = useMemo(() => {\n    // Calculate column widths to fit the container on initial render, avoiding unnecessary horizontal scrolling.\n    // Falls back to a default width if available width is too small; the user can resize columns as needed.\n    const additionalColumnsLength =\n      additionalColumns?.reduce((colWidth, col) => {\n        return colWidth + (typeof col.width === 'number' ? col.width : DEFAULT_COLUMN_WIDTH);\n      }, 0) ?? 0;\n    const availableWidth = Math.max(\n      width - additionalColumnsLength - TABLE_PADDING,\n      DEFAULT_COLUMN_MIN_WIDTH * COLUMNS.length,\n    );\n    const columnWidth = availableWidth / COLUMNS.length;\n    return [\n      ...COLUMNS.map((column) => ({\n        ...column,\n        width: columnWidth,\n      })),\n      ...additionalColumns,\n    ];\n  }, [additionalColumns, width]);\n\n  return (\n    <Table\n      height={height}\n      width={width}\n      rowSelection={rowSelection}\n      onRowSelectionChange={onSelectedItemsChange}\n      onRowMouseOver={onItemMouseOver}\n      onRowMouseOut={onItemMouseOut}\n      sorting={sorting}\n      onSortingChange={onSortingChange}\n      data={items}\n      columns={columns}\n      density=\"compact\"\n      defaultColumnWidth=\"auto\"\n      getRowId={getRowId}\n      getCheckboxColor={getCheckboxColor}\n      checkboxSelection\n      rowSelectionVariant=\"legend\"\n    />\n  );\n}\n"],"names":["useMemo","Table","DEFAULT_COLUMN_WIDTH","DEFAULT_COLUMN_MIN_WIDTH","COLUMNS","accessorKey","header","enableSorting","enableResizing","cell","getValue","span","title","getRowId","data","id","getCheckboxColor","color","TABLE_PADDING","EMPTY_COLUMNS","TableLegend","items","selectedItems","initRowSelection","onSelectedItemsChange","onItemMouseOver","onItemMouseOut","height","width","columns","additionalColumns","sorting","onSortingChange","rowSelection","reduce","allRowSelection","item","index","additionalColumnsLength","colWidth","col","availableWidth","Math","max","length","columnWidth","map","column","onRowSelectionChange","onRowMouseOver","onRowMouseOut","density","defaultColumnWidth","checkboxSelection","rowSelectionVariant"],"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;;AAGjC,SAASA,OAAO,QAAQ,QAAQ;AAGhC,SAASC,KAAK,EAAEC,oBAAoB,EAAEC,wBAAwB,QAAQ,oBAAW;AAcjF,MAAMC,UAAgD;IACpD;QACEC,aAAa;QACbC,QAAQ;QACRC,eAAe;QACfC,gBAAgB;QAEhB,0EAA0E;QAC1E,0EAA0E;QAC1E,wEAAwE;QACxEC,MAAM,CAAC,EAAEC,QAAQ,EAAE,iBAAK,KAACC;gBAAKC,OAAOF;0BAAqBA;;IAC5D;CACD;AAED,MAAMG,WAA4D,CAACC;IACjE,OAAOA,KAAKC,EAAE;AAChB;AAEA,MAAMC,mBAA+D,CAACF;IACpE,OAAOA,KAAKG,KAAK;AACnB;AAEA,qIAAqI;AACrI,MAAMC,gBAAgB;AACtB,MAAMC,gBAAsD,EAAE;AAE9D,OAAO,SAASC,YAAY,EAC1BC,KAAK,EACLC,eAAeC,gBAAgB,EAC/BC,qBAAqB,EACrBC,eAAe,EACfC,cAAc,EACdC,MAAM,EACNC,KAAK,EACLC,SAASC,oBAAoBX,aAAa,EAC1CY,OAAO,EACPC,eAAe,EACE;IACjB,MAAMC,eAAejC,QAAQ;QAC3B,OAAO,OAAOuB,qBAAqB,WAC/BA,mBAEA,wBAAwB;QACxB,4EAA4E;QAC5EF,MAAMa,MAAM,CACV,CAACC,iBAAiBC,MAAMC;YACtBF,eAAe,CAACtB,SAASuB,MAAMC,OAAO,GAAG;YACzC,OAAOF;QACT,GACA,CAAC;IAET,GAAG;QAACZ;QAAkBF;KAAM;IAE5B,MAAMQ,UAAU7B,QAAQ;QACtB,6GAA6G;QAC7G,wGAAwG;QACxG,MAAMsC,0BACJR,mBAAmBI,OAAO,CAACK,UAAUC;YACnC,OAAOD,WAAY,CAAA,OAAOC,IAAIZ,KAAK,KAAK,WAAWY,IAAIZ,KAAK,GAAG1B,oBAAmB;QACpF,GAAG,MAAM;QACX,MAAMuC,iBAAiBC,KAAKC,GAAG,CAC7Bf,QAAQU,0BAA0BpB,eAClCf,2BAA2BC,QAAQwC,MAAM;QAE3C,MAAMC,cAAcJ,iBAAiBrC,QAAQwC,MAAM;QACnD,OAAO;eACFxC,QAAQ0C,GAAG,CAAC,CAACC,SAAY,CAAA;oBAC1B,GAAGA,MAAM;oBACTnB,OAAOiB;gBACT,CAAA;eACGf;SACJ;IACH,GAAG;QAACA;QAAmBF;KAAM;IAE7B,qBACE,KAAC3B;QACC0B,QAAQA;QACRC,OAAOA;QACPK,cAAcA;QACde,sBAAsBxB;QACtByB,gBAAgBxB;QAChByB,eAAexB;QACfK,SAASA;QACTC,iBAAiBA;QACjBlB,MAAMO;QACNQ,SAASA;QACTsB,SAAQ;QACRC,oBAAmB;QACnBvC,UAAUA;QACVG,kBAAkBA;QAClBqC,iBAAiB;QACjBC,qBAAoB;;AAG1B"}

package/dist/LinksEditor/LinkEditorForm.d.ts

@@ -2,6 +2,7 @@ import type { ReactElement } from 'react';
 export interface LinkEditorFormField<T> {
     value: T;
     onChange: (value: T) => void;
+    onBlur?: () => void;
     placeholder?: string;
     label: string;
     error: {

package/dist/LinksEditor/LinkEditorForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkEditorForm.d.ts","sourceRoot":"","sources":["../../src/LinksEditor/LinkEditorForm.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,MAAM,WAAW,mBAAmB,CAAC,CAAC;IACpC,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAC;QAAC,UAAU,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACpD;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,QAAQ,GAAG,eAAe,CAAC;IACjC,GAAG,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC;IAClD,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC;IACrD,UAAU,EAAE,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC;IACxD,eAAe,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC;CAC/D;AAED,eAAO,MAAM,cAAc,UAAW,mBAAmB,KAAG,YAoE3D,CAAC"}
+{"version":3,"file":"LinkEditorForm.d.ts","sourceRoot":"","sources":["../../src/LinksEditor/LinkEditorForm.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,MAAM,WAAW,mBAAmB,CAAC,CAAC;IACpC,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAC;QAAC,UAAU,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACpD;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,QAAQ,GAAG,eAAe,CAAC;IACjC,GAAG,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC;IAClD,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC;IACrD,UAAU,EAAE,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC;IACxD,eAAe,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC;CAC/D;AAED,eAAO,MAAM,cAAc,UAAW,mBAAmB,KAAG,YAqE3D,CAAC"}

package/dist/LinksEditor/LinkEditorForm.js

@@ -25,6 +25,7 @@ export const LinkEditorForm = (props)=>{
                 error: url.error?.hasError,
                 helperText: url.error?.helperText,
                 onChange: url.onChange,
+                onBlur: url.onBlur,
                 placeholder: url.placeholder,
                 multiline: true,
                 maxRows: 5,

package/dist/LinksEditor/LinkEditorForm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/LinksEditor/LinkEditorForm.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 { Checkbox, FormControlLabel, Stack } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport { TextField } from '../controls';\n\nexport interface LinkEditorFormField<T> {\n  value: T;\n  onChange: (value: T) => void;\n  placeholder?: string;\n  label: string;\n  error: { hasError?: boolean; helperText?: string };\n}\n\nexport interface LinkEditorFormProps {\n  mode: 'inline' | 'modalEmbedded';\n  url: LinkEditorFormField<string>;\n  name?: Omit<LinkEditorFormField<string>, 'error'>;\n  tooltip?: Omit<LinkEditorFormField<string>, 'error'>;\n  newTabOpen: Omit<LinkEditorFormField<boolean>, 'error'>;\n  renderVariables?: Omit<LinkEditorFormField<boolean>, 'error'>;\n}\n\nexport const LinkEditorForm = (props: LinkEditorFormProps): ReactElement => {\n  const { mode, url, name, newTabOpen, renderVariables, tooltip } = props;\n\n  return (\n    <Stack direction=\"column\" gap={2} flexGrow={1}>\n      <TextField\n        label={url.label}\n        error={url.error?.hasError}\n        helperText={url.error?.helperText}\n        onChange={url.onChange}\n        placeholder={url.placeholder}\n        multiline\n        maxRows={5}\n        required\n        fullWidth\n        value={url.value}\n      />\n      {(name || tooltip) && (\n        <Stack gap={1} direction={mode === 'inline' ? 'row' : 'column'}>\n          {name && (\n            <TextField\n              sx={{ flexGrow: '1' }}\n              label={name.label}\n              onChange={name?.onChange}\n              placeholder={name?.placeholder}\n              value={name?.value}\n            />\n          )}\n          {tooltip && (\n            <TextField\n              sx={{ flexGrow: '1' }}\n              label={tooltip.label}\n              onChange={tooltip?.onChange}\n              placeholder={tooltip?.placeholder}\n              value={tooltip?.value}\n            />\n          )}\n        </Stack>\n      )}\n      <Stack direction=\"row\" gap={1}>\n        {renderVariables && (\n          <FormControlLabel\n            label={renderVariables.label}\n            control={\n              <Checkbox\n                checked={renderVariables.value}\n                onChange={(e) => {\n                  renderVariables?.onChange(e.target.checked);\n                }}\n              />\n            }\n          />\n        )}\n\n        <FormControlLabel\n          label={newTabOpen.label}\n          control={\n            <Checkbox\n              checked={newTabOpen.value}\n              onChange={(e) => {\n                newTabOpen?.onChange(e.target.checked);\n              }}\n            />\n          }\n        />\n      </Stack>\n    </Stack>\n  );\n};\n"],"names":["Checkbox","FormControlLabel","Stack","TextField","LinkEditorForm","props","mode","url","name","newTabOpen","renderVariables","tooltip","direction","gap","flexGrow","label","error","hasError","helperText","onChange","placeholder","multiline","maxRows","required","fullWidth","value","sx","control","checked","e","target"],"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,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,gBAAgB;AAGlE,SAASC,SAAS,QAAQ,uBAAc;AAmBxC,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAM,EAAEC,IAAI,EAAEC,GAAG,EAAEC,IAAI,EAAEC,UAAU,EAAEC,eAAe,EAAEC,OAAO,EAAE,GAAGN;IAElE,qBACE,MAACH;QAAMU,WAAU;QAASC,KAAK;QAAGC,UAAU;;0BAC1C,KAACX;gBACCY,OAAOR,IAAIQ,KAAK;gBAChBC,OAAOT,IAAIS,KAAK,EAAEC;gBAClBC,YAAYX,IAAIS,KAAK,EAAEE;gBACvBC,UAAUZ,IAAIY,QAAQ;gBACtBC,aAAab,IAAIa,WAAW;gBAC5BC,SAAS;gBACTC,SAAS;gBACTC,QAAQ;gBACRC,SAAS;gBACTC,OAAOlB,IAAIkB,KAAK;;YAEhBjB,CAAAA,QAAQG,OAAM,mBACd,MAACT;gBAAMW,KAAK;gBAAGD,WAAWN,SAAS,WAAW,QAAQ;;oBACnDE,sBACC,KAACL;wBACCuB,IAAI;4BAAEZ,UAAU;wBAAI;wBACpBC,OAAOP,KAAKO,KAAK;wBACjBI,UAAUX,MAAMW;wBAChBC,aAAaZ,MAAMY;wBACnBK,OAAOjB,MAAMiB;;oBAGhBd,yBACC,KAACR;wBACCuB,IAAI;4BAAEZ,UAAU;wBAAI;wBACpBC,OAAOJ,QAAQI,KAAK;wBACpBI,UAAUR,SAASQ;wBACnBC,aAAaT,SAASS;wBACtBK,OAAOd,SAASc;;;;0BAKxB,MAACvB;gBAAMU,WAAU;gBAAMC,KAAK;;oBACzBH,iCACC,KAACT;wBACCc,OAAOL,gBAAgBK,KAAK;wBAC5BY,uBACE,KAAC3B;4BACC4B,SAASlB,gBAAgBe,KAAK;4BAC9BN,UAAU,CAACU;gCACTnB,iBAAiBS,SAASU,EAAEC,MAAM,CAACF,OAAO;4BAC5C;;;kCAMR,KAAC3B;wBACCc,OAAON,WAAWM,KAAK;wBACvBY,uBACE,KAAC3B;4BACC4B,SAASnB,WAAWgB,KAAK;4BACzBN,UAAU,CAACU;gCACTpB,YAAYU,SAASU,EAAEC,MAAM,CAACF,OAAO;4BACvC;;;;;;;AAOd,EAAE"}
+{"version":3,"sources":["../../src/LinksEditor/LinkEditorForm.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 { Checkbox, FormControlLabel, Stack } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport { TextField } from '../controls';\n\nexport interface LinkEditorFormField<T> {\n  value: T;\n  onChange: (value: T) => void;\n  onBlur?: () => void;\n  placeholder?: string;\n  label: string;\n  error: { hasError?: boolean; helperText?: string };\n}\n\nexport interface LinkEditorFormProps {\n  mode: 'inline' | 'modalEmbedded';\n  url: LinkEditorFormField<string>;\n  name?: Omit<LinkEditorFormField<string>, 'error'>;\n  tooltip?: Omit<LinkEditorFormField<string>, 'error'>;\n  newTabOpen: Omit<LinkEditorFormField<boolean>, 'error'>;\n  renderVariables?: Omit<LinkEditorFormField<boolean>, 'error'>;\n}\n\nexport const LinkEditorForm = (props: LinkEditorFormProps): ReactElement => {\n  const { mode, url, name, newTabOpen, renderVariables, tooltip } = props;\n\n  return (\n    <Stack direction=\"column\" gap={2} flexGrow={1}>\n      <TextField\n        label={url.label}\n        error={url.error?.hasError}\n        helperText={url.error?.helperText}\n        onChange={url.onChange}\n        onBlur={url.onBlur}\n        placeholder={url.placeholder}\n        multiline\n        maxRows={5}\n        required\n        fullWidth\n        value={url.value}\n      />\n      {(name || tooltip) && (\n        <Stack gap={1} direction={mode === 'inline' ? 'row' : 'column'}>\n          {name && (\n            <TextField\n              sx={{ flexGrow: '1' }}\n              label={name.label}\n              onChange={name?.onChange}\n              placeholder={name?.placeholder}\n              value={name?.value}\n            />\n          )}\n          {tooltip && (\n            <TextField\n              sx={{ flexGrow: '1' }}\n              label={tooltip.label}\n              onChange={tooltip?.onChange}\n              placeholder={tooltip?.placeholder}\n              value={tooltip?.value}\n            />\n          )}\n        </Stack>\n      )}\n      <Stack direction=\"row\" gap={1}>\n        {renderVariables && (\n          <FormControlLabel\n            label={renderVariables.label}\n            control={\n              <Checkbox\n                checked={renderVariables.value}\n                onChange={(e) => {\n                  renderVariables?.onChange(e.target.checked);\n                }}\n              />\n            }\n          />\n        )}\n\n        <FormControlLabel\n          label={newTabOpen.label}\n          control={\n            <Checkbox\n              checked={newTabOpen.value}\n              onChange={(e) => {\n                newTabOpen?.onChange(e.target.checked);\n              }}\n            />\n          }\n        />\n      </Stack>\n    </Stack>\n  );\n};\n"],"names":["Checkbox","FormControlLabel","Stack","TextField","LinkEditorForm","props","mode","url","name","newTabOpen","renderVariables","tooltip","direction","gap","flexGrow","label","error","hasError","helperText","onChange","onBlur","placeholder","multiline","maxRows","required","fullWidth","value","sx","control","checked","e","target"],"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,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,gBAAgB;AAGlE,SAASC,SAAS,QAAQ,uBAAc;AAoBxC,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAM,EAAEC,IAAI,EAAEC,GAAG,EAAEC,IAAI,EAAEC,UAAU,EAAEC,eAAe,EAAEC,OAAO,EAAE,GAAGN;IAElE,qBACE,MAACH;QAAMU,WAAU;QAASC,KAAK;QAAGC,UAAU;;0BAC1C,KAACX;gBACCY,OAAOR,IAAIQ,KAAK;gBAChBC,OAAOT,IAAIS,KAAK,EAAEC;gBAClBC,YAAYX,IAAIS,KAAK,EAAEE;gBACvBC,UAAUZ,IAAIY,QAAQ;gBACtBC,QAAQb,IAAIa,MAAM;gBAClBC,aAAad,IAAIc,WAAW;gBAC5BC,SAAS;gBACTC,SAAS;gBACTC,QAAQ;gBACRC,SAAS;gBACTC,OAAOnB,IAAImB,KAAK;;YAEhBlB,CAAAA,QAAQG,OAAM,mBACd,MAACT;gBAAMW,KAAK;gBAAGD,WAAWN,SAAS,WAAW,QAAQ;;oBACnDE,sBACC,KAACL;wBACCwB,IAAI;4BAAEb,UAAU;wBAAI;wBACpBC,OAAOP,KAAKO,KAAK;wBACjBI,UAAUX,MAAMW;wBAChBE,aAAab,MAAMa;wBACnBK,OAAOlB,MAAMkB;;oBAGhBf,yBACC,KAACR;wBACCwB,IAAI;4BAAEb,UAAU;wBAAI;wBACpBC,OAAOJ,QAAQI,KAAK;wBACpBI,UAAUR,SAASQ;wBACnBE,aAAaV,SAASU;wBACtBK,OAAOf,SAASe;;;;0BAKxB,MAACxB;gBAAMU,WAAU;gBAAMC,KAAK;;oBACzBH,iCACC,KAACT;wBACCc,OAAOL,gBAAgBK,KAAK;wBAC5Ba,uBACE,KAAC5B;4BACC6B,SAASnB,gBAAgBgB,KAAK;4BAC9BP,UAAU,CAACW;gCACTpB,iBAAiBS,SAASW,EAAEC,MAAM,CAACF,OAAO;4BAC5C;;;kCAMR,KAAC5B;wBACCc,OAAON,WAAWM,KAAK;wBACvBa,uBACE,KAAC5B;4BACC6B,SAASpB,WAAWiB,KAAK;4BACzBP,UAAU,CAACW;gCACTrB,YAAYU,SAASW,EAAEC,MAAM,CAACF,OAAO;4BACvC;;;;;;;AAOd,EAAE"}

package/dist/OptionsEditorLayout/OptionsEditorControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OptionsEditorControl.d.ts","sourceRoot":"","sources":["../../src/OptionsEditorLayout/OptionsEditorControl.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAG3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAM1C,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,qBAAqB,EAAE,OAAO,GAAG,SAAS,CAAC,GAAG;IACzF,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,oBAAoB,oCAAqC,yBAAyB,KAAG,YAuCjG,CAAC"}
+{"version":3,"file":"OptionsEditorControl.d.ts","sourceRoot":"","sources":["../../src/OptionsEditorLayout/OptionsEditorControl.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAG3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,qBAAqB,EAAE,OAAO,GAAG,SAAS,CAAC,GAAG;IACzF,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,oBAAoB,oCAAqC,yBAAyB,KAAG,YAuCjG,CAAC"}

package/dist/OptionsEditorLayout/OptionsEditorControl.js

@@ -13,13 +13,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FormControl, FormLabel, Stack, Box, IconButton } from "@mui/material";
 import InformationOutlineIcon from "mdi-material-ui/InformationOutline";
-import React from "react";
+import React, { useId } from "react";
 import { InfoTooltip } from "../InfoTooltip/index.js";
-import { useId } from "../utils/index.js";
 export const OptionsEditorControl = ({ label, control, description })=>{
     // Make sure we have a unique ID we can use for associating labels and
     // controls for a11y.
-    const generatedControlId = useId('EditorSectionControl');
+    const generatedControlId = `EditorSectionControl-${useId()}`;
     const controlId = `${generatedControlId}-control`;
     const labelId = `${generatedControlId}-label`;
     const controlProps = {

package/dist/OptionsEditorLayout/OptionsEditorControl.js.map

@@ -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 type { FormControlLabelProps } from '@mui/material';\nimport { FormControl, FormLabel, Stack, Box, IconButton } from '@mui/material';\nimport InformationOutlineIcon from 'mdi-material-ui/InformationOutline';\nimport type { ReactElement } from 'react';\nimport React from 'react';\n\nimport { InfoTooltip } from '../InfoTooltip';\nimport { useId } from '../utils';\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","InformationOutlineIcon","React","InfoTooltip","useId","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;;AAGjC,SAASA,WAAW,EAAEC,SAAS,EAAEC,KAAK,EAAEC,GAAG,EAAEC,UAAU,QAAQ,gBAAgB;AAC/E,OAAOC,4BAA4B,qCAAqC;AAExE,OAAOC,WAAW,QAAQ;AAE1B,SAASC,WAAW,QAAQ,0BAAiB;AAC7C,SAASC,KAAK,QAAQ,oBAAW;AAMjC,OAAO,MAAMC,uBAAuB,CAAC,EAAEC,KAAK,EAAEC,OAAO,EAAEC,WAAW,EAA6B;IAC7F,sEAAsE;IACtE,qBAAqB;IACrB,MAAMC,qBAAqBL,MAAM;IACjC,MAAMM,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,KAACL;4BAAYK,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,KAACxB;oCACCyB,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;sCAAE/B,MAAMgC,YAAY,CAAC3B,SAASK;;;;;;AAIvF,EAAE"}
+{"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 type { FormControlLabelProps } from '@mui/material';\nimport { FormControl, FormLabel, Stack, Box, IconButton } from '@mui/material';\nimport InformationOutlineIcon from 'mdi-material-ui/InformationOutline';\nimport type { ReactElement } from 'react';\nimport React, { useId } from 'react';\n\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 = `EditorSectionControl-${useId()}`;\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","InformationOutlineIcon","React","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;;AAGjC,SAASA,WAAW,EAAEC,SAAS,EAAEC,KAAK,EAAEC,GAAG,EAAEC,UAAU,QAAQ,gBAAgB;AAC/E,OAAOC,4BAA4B,qCAAqC;AAExE,OAAOC,SAASC,KAAK,QAAQ,QAAQ;AAErC,SAASC,WAAW,QAAQ,0BAAiB;AAM7C,OAAO,MAAMC,uBAAuB,CAAC,EAAEC,KAAK,EAAEC,OAAO,EAAEC,WAAW,EAA6B;IAC7F,sEAAsE;IACtE,qBAAqB;IACrB,MAAMC,qBAAqB,CAAC,qBAAqB,EAAEN,SAAS;IAC5D,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,KAACxB;oCACCyB,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;sCAAE/B,MAAMgC,YAAY,CAAC3B,SAASK;;;;;;AAIvF,EAAE"}

package/dist/SettingsAutocomplete/SettingsAutocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsAutocomplete.d.ts","sourceRoot":"","sources":["../../src/SettingsAutocomplete/SettingsAutocomplete.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,eAAe,CAAC;AAE7E,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,yBAAyB,CACxC,UAAU,SAAS,0BAA0B,EAC7C,QAAQ,SAAS,OAAO,GAAG,SAAS,EACpC,gBAAgB,SAAS,OAAO,GAAG,SAAS,CAI5C,SAAQ,IAAI,CAAC,iBAAiB,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,EAAE,KAAK,CAAC,EAAE,aAAa,CAAC;IAG7F,WAAW,CAAC,EAAE,iBAAiB,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,EAAE,KAAK,CAAC,CAAC,aAAa,CAAC,CAAC;CAC/F;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAClC,UAAU,SAAS,0BAA0B,EAC7C,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,KAAK,EAC5C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,KAAK,EACpD,EACA,OAAO,EACP,WAAiE,EACjE,EAAE,EACF,iBAAiB,EAAE,cAAc,EACjC,GAAG,UAAU,EACd,EAAE,yBAAyB,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,CAAC,GAAG,YAAY,CAqDlF"}
+{"version":3,"file":"SettingsAutocomplete.d.ts","sourceRoot":"","sources":["../../src/SettingsAutocomplete/SettingsAutocomplete.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,iBAAiB,EAAuD,MAAM,eAAe,CAAC;AAE5G,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMrD;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,yBAAyB,CACxC,UAAU,SAAS,0BAA0B,EAC7C,QAAQ,SAAS,OAAO,GAAG,SAAS,EACpC,gBAAgB,SAAS,OAAO,GAAG,SAAS,CAI5C,SAAQ,IAAI,CAAC,iBAAiB,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,EAAE,KAAK,CAAC,EAAE,aAAa,CAAC;IAG7F,WAAW,CAAC,EAAE,iBAAiB,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,EAAE,KAAK,CAAC,CAAC,aAAa,CAAC,CAAC;CAC/F;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAClC,UAAU,SAAS,0BAA0B,EAC7C,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,KAAK,EAC5C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,KAAK,EACpD,EACA,OAAO,EACP,WAAgC,EAChC,EAAE,EACF,iBAAiB,EAAE,cAAc,EACjC,GAAG,UAAU,EACd,EAAE,yBAAyB,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,CAAC,GAAG,YAAY,CAqDlF"}

package/dist/SettingsAutocomplete/SettingsAutocomplete.js

@@ -12,14 +12,17 @@
 // limitations under the License.
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Autocomplete, TextField, Typography, createFilterOptions } from "@mui/material";
+function renderDefaultInput(params) {
+    return /*#__PURE__*/ _jsx(TextField, {
+        ...params
+    });
+}
 /**
  * Opinionated autocomplete component useful for providing users with a dropdown
  * for settings that require selecting one or more options from a list.
  *
  * **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.**
- */ export function SettingsAutocomplete({ options, renderInput = (params)=>/*#__PURE__*/ _jsx(TextField, {
-        ...params
-    }), id, 'aria-labelledby': ariaLabelledby, ...otherProps }) {
+ */ export function SettingsAutocomplete({ options, renderInput = renderDefaultInput, id, 'aria-labelledby': ariaLabelledby, ...otherProps }) {
     const getOptionLabel = (option)=>{
         return option.label ?? option.id;
     };

package/dist/SettingsAutocomplete/SettingsAutocomplete.js.map

@@ -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 type { AutocompleteProps, UseAutocompleteProps } from '@mui/material';\nimport { Autocomplete, TextField, Typography, createFilterOptions } from '@mui/material';\nimport type { 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;;AAGjC,SAASA,YAAY,EAAEC,SAAS,EAAEC,UAAU,EAAEC,mBAAmB,QAAQ,gBAAgB;AA2CzF;;;;;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"}
+{"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 type { AutocompleteProps, AutocompleteRenderInputParams, UseAutocompleteProps } from '@mui/material';\nimport { Autocomplete, TextField, Typography, createFilterOptions } from '@mui/material';\nimport type { ReactElement, ReactNode } from 'react';\n\nfunction renderDefaultInput(params: AutocompleteRenderInputParams): ReactElement {\n  return <TextField {...params} />;\n}\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 = renderDefaultInput,\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","renderDefaultInput","params","SettingsAutocomplete","options","renderInput","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;;AAGjC,SAASA,YAAY,EAAEC,SAAS,EAAEC,UAAU,EAAEC,mBAAmB,QAAQ,gBAAgB;AAGzF,SAASC,mBAAmBC,MAAqC;IAC/D,qBAAO,KAACJ;QAAW,GAAGI,MAAM;;AAC9B;AA0CA;;;;;CAKC,GACD,OAAO,SAASC,qBAId,EACAC,OAAO,EACPC,cAAcJ,kBAAkB,EAChCK,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,CACzGV;QAEA,MAAMW,eAAe;YACnB,GAAGX,MAAM;YACTY,YAAY;gBAAE,GAAGZ,OAAOY,UAAU;gBAAER;gBAAI,mBAAmBC;YAAe;QAC5E;QACA,OAAOF,YAAYQ;IACrB;IAEA,2EAA2E;IAC3E,0EAA0E;IAC1E,+EAA+E;IAC/E,wCAAwC;IACxC,qBACE,KAAChB;QACCkB,sBAAsB,CAACL,QAAQM,QAAUN,OAAOJ,EAAE,KAAKU,MAAMV,EAAE;QAC/DW,mBAAmB,CAACP,SAAW,CAAC,CAACA,OAAOQ,QAAQ;QAChDT,gBAAgBA;QAChBL,SAASA;QACTC,aAAaO;QACbO,cAAc,CAAC,EAAEC,GAAG,EAAE,GAAGC,OAAO,EAAEX;YAChC,qBACE,KAACY;gBAAc,GAAGD,KAAK;0BACrB,cAAA,MAACE;;sCACC,KAACxB;4BAAWyB,SAAQ;4BAAQC,WAAU;sCACnChB,eAAeC;;wBAEjBA,OAAOgB,WAAW,kBACjB,KAAC3B;4BAAWyB,SAAQ;4BAAQC,WAAU;4BAAME,IAAI;gCAAEC,OAAO,CAACC,QAAUA,MAAMC,OAAO,CAACC,IAAI,CAACC,SAAS;4BAAC;sCAC9FtB,OAAOgB,WAAW;;;;eAPlBN;QAab;QACAa,eAAejC,oBAAoB;YACjC,mDAAmD;YACnDkC,WAAW,CAACxB,SAAW,GAAGD,eAAeC,QAAQ,CAAC,EAAEA,OAAOgB,WAAW,IAAI,IAAI;QAChF;QACC,GAAGlB,UAAU;;AAGpB"}

package/dist/Table/Table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAetD;;;;;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"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAetD;;;;;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,CAwMtC"}

package/dist/Table/Table.js

@@ -32,6 +32,7 @@ const DEFAULT_SORTING = [];
  *
  * **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.**
  */ 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 }) {
+    'use no memo'; // TanStack Table v8 uses a mutable instance that automatic memoization cannot track.
     const theme = useTheme();
     const hasSubRows = !!getSubRows;
     const [expanded, setExpanded] = useState({});
@@ -146,6 +147,8 @@ const DEFAULT_SORTING = [];
         actionsColumn,
         checkboxColumn
     ]);
+    // Oxlint still checks incompatible APIs inside functions opted out of compilation above.
+    // oxlint-disable-next-line react/incompatible-library
     const table = useReactTable({
         data,
         columns: tableColumns,

package/dist/Table/Table.js.map

@@ -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 type {\n  ColumnDef,\n  ExpandedState,\n  OnChangeFn,\n  Row,\n  RowSelectionState,\n  SortingState,\n  Table as TanstackTable,\n  VisibilityState,\n} from '@tanstack/react-table';\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\nimport type { ReactElement } from 'react';\nimport { useCallback, useMemo, useState } from 'react';\n\nimport { useFuzzySearch } from './hooks/useFuzzySearch';\nimport type { TableProps } from './model/table-model';\nimport { DEFAULT_COLUMN_WIDTH, persesColumnsToTanstackColumns } from './model/table-model';\nimport { TableCheckbox } from './TableCheckbox';\nimport { VirtualizedTable } from './VirtualizedTable';\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","DEFAULT_COLUMN_WIDTH","persesColumnsToTanstackColumns","TableCheckbox","VirtualizedTable","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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"}
+{"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 type {\n  ColumnDef,\n  ExpandedState,\n  OnChangeFn,\n  Row,\n  RowSelectionState,\n  SortingState,\n  Table as TanstackTable,\n  VisibilityState,\n} from '@tanstack/react-table';\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\nimport type { ReactElement } from 'react';\nimport { useCallback, useMemo, useState } from 'react';\n\nimport { useFuzzySearch } from './hooks/useFuzzySearch';\nimport type { TableProps } from './model/table-model';\nimport { DEFAULT_COLUMN_WIDTH, persesColumnsToTanstackColumns } from './model/table-model';\nimport { TableCheckbox } from './TableCheckbox';\nimport { VirtualizedTable } from './VirtualizedTable';\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  'use no memo'; // TanStack Table v8 uses a mutable instance that automatic memoization cannot track.\n\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  // Oxlint still checks incompatible APIs inside functions opted out of compilation above.\n  // oxlint-disable-next-line react/incompatible-library\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","DEFAULT_COLUMN_WIDTH","persesColumnsToTanstackColumns","TableCheckbox","VirtualizedTable","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/TableToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableToolbar.d.ts","sourceRoot":"","sources":["../../src/Table/TableToolbar.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAMpD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,MAAM,WAAW,iBAAiB,CAAC,SAAS;IAC1C;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9C;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5C;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,YAAY,CAAC,SAAS,EAAE,EACtC,eAAe,EACf,YAAY,EACZ,oBAAoB,EACpB,qBAAqB,EACrB,OAAO,EACP,KAAK,EACL,yBAA+B,EAC/B,kBAAkB,EAClB,aAAa,EACb,iBAAiB,GAClB,EAAE,iBAAiB,CAAC,SAAS,CAAC,GAAG,YAAY,GAAG,IAAI,CAyGpD"}
+{"version":3,"file":"TableToolbar.d.ts","sourceRoot":"","sources":["../../src/Table/TableToolbar.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAMpD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,MAAM,WAAW,iBAAiB,CAAC,SAAS;IAC1C;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9C;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5C;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,YAAY,CAAC,SAAS,EAAE,EACtC,eAAe,EACf,YAAY,EACZ,oBAAoB,EACpB,qBAAqB,EACrB,OAAO,EACP,KAAK,EACL,yBAA+B,EAC/B,kBAAkB,EAClB,aAAa,EACb,iBAAiB,GAClB,EAAE,iBAAiB,CAAC,SAAS,CAAC,GAAG,YAAY,GAAG,IAAI,CA2GpD"}

package/dist/Table/TableToolbar.js

@@ -20,6 +20,7 @@ import ViewColumn from "mdi-material-ui/ViewColumn";
 import { useCallback, useState } from "react";
 import { TextField } from "../controls/index.js";
 export function TableToolbar({ isSearchEnabled, globalFilter, onGlobalFilterChange, isColumnFilterEnabled, columns, width, columnFilterMenuMaxHeight = 400, isExpandAllEnabled, isAllExpanded, onExpandAllChange }) {
+    'use no memo'; // TanStack Table columns retain their identity when visibility changes.
     const [colMenuAnchor, setColMenuAnchor] = useState(null);
     const colMenuOpen = Boolean(colMenuAnchor);
     const [searchResetKey, setSearchResetKey] = useState(0);