@perses-dev/components 0.55.1 → 0.56.0-beta.1

package/dist/RepeatGrid/RepeatGrid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/RepeatGrid/RepeatGrid.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 { SxProps, Theme } from '@mui/material';\nimport { Box } from '@mui/material';\nimport type { ReactNode } from 'react';\nimport { useMemo } from 'react';\n\nexport interface RepeatGridProps<T> {\n  repeatItems: T[];\n  maxPer: number;\n  gap: number;\n  renderItem: (item: T, options: { rowIndex: number; colIndex: number }) => ReactNode;\n  containerSx?: SxProps<Theme>;\n  rowSx?: SxProps<Theme>;\n}\n\nexport function RepeatGrid<T>({\n  repeatItems,\n  maxPer,\n  gap,\n  renderItem,\n  containerSx,\n  rowSx,\n}: RepeatGridProps<T>): ReactNode {\n  const { rows, perRow } = useMemo(() => {\n    const perRow = Math.max(1, maxPer);\n    const rows: T[][] = [];\n    for (let i = 0; i < repeatItems.length; i += perRow) {\n      rows.push(repeatItems.slice(i, i + perRow));\n    }\n\n    return { rows, perRow };\n  }, [maxPer, repeatItems]);\n\n  return (\n    <Box\n      sx={[\n        { display: 'flex', flexDirection: 'column', width: '100%', height: '100%', gap: `${gap}px` },\n        ...(Array.isArray(containerSx) ? containerSx : [containerSx]),\n      ]}\n    >\n      {rows.map((rowItems, rowIndex) => (\n        <Box key={rowIndex} sx={[{ display: 'flex', gap: `${gap}px` }, ...(Array.isArray(rowSx) ? rowSx : [rowSx])]}>\n          {rowItems.map((item, colIndex) => (\n            <Box\n              key={`${rowIndex}-${colIndex}`}\n              sx={{\n                width: `calc((100% - ${gap * (perRow - 1)}px) / ${perRow})`,\n                overflow: 'hidden',\n              }}\n            >\n              {renderItem(item, { rowIndex, colIndex })}\n            </Box>\n          ))}\n        </Box>\n      ))}\n    </Box>\n  );\n}\n"],"names":["Box","useMemo","RepeatGrid","repeatItems","maxPer","gap","renderItem","containerSx","rowSx","rows","perRow","Math","max","i","length","push","slice","sx","display","flexDirection","width","height","Array","isArray","map","rowItems","rowIndex","item","colIndex","overflow"],"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,GAAG,QAAQ,gBAAgB;AAEpC,SAASC,OAAO,QAAQ,QAAQ;AAWhC,OAAO,SAASC,WAAc,EAC5BC,WAAW,EACXC,MAAM,EACNC,GAAG,EACHC,UAAU,EACVC,WAAW,EACXC,KAAK,EACc;IACnB,MAAM,EAAEC,IAAI,EAAEC,MAAM,EAAE,GAAGT,QAAQ;QAC/B,MAAMS,SAASC,KAAKC,GAAG,CAAC,GAAGR;QAC3B,MAAMK,OAAc,EAAE;QACtB,IAAK,IAAII,IAAI,GAAGA,IAAIV,YAAYW,MAAM,EAAED,KAAKH,OAAQ;YACnDD,KAAKM,IAAI,CAACZ,YAAYa,KAAK,CAACH,GAAGA,IAAIH;QACrC;QAEA,OAAO;YAAED;YAAMC;QAAO;IACxB,GAAG;QAACN;QAAQD;KAAY;IAExB,qBACE,KAACH;QACCiB,IAAI;YACF;gBAAEC,SAAS;gBAAQC,eAAe;gBAAUC,OAAO;gBAAQC,QAAQ;gBAAQhB,KAAK,GAAGA,IAAI,EAAE,CAAC;YAAC;eACvFiB,MAAMC,OAAO,CAAChB,eAAeA,cAAc;gBAACA;aAAY;SAC7D;kBAEAE,KAAKe,GAAG,CAAC,CAACC,UAAUC,yBACnB,KAAC1B;gBAAmBiB,IAAI;oBAAC;wBAAEC,SAAS;wBAAQb,KAAK,GAAGA,IAAI,EAAE,CAAC;oBAAC;uBAAOiB,MAAMC,OAAO,CAACf,SAASA,QAAQ;wBAACA;qBAAM;iBAAE;0BACxGiB,SAASD,GAAG,CAAC,CAACG,MAAMC,yBACnB,KAAC5B;wBAECiB,IAAI;4BACFG,OAAO,CAAC,aAAa,EAAEf,MAAOK,CAAAA,SAAS,CAAA,EAAG,MAAM,EAAEA,OAAO,CAAC,CAAC;4BAC3DmB,UAAU;wBACZ;kCAECvB,WAAWqB,MAAM;4BAAED;4BAAUE;wBAAS;uBANlC,GAAGF,SAAS,CAAC,EAAEE,UAAU;eAH1BF;;AAgBlB"}
+{"version":3,"sources":["../../src/RepeatGrid/RepeatGrid.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 { SxProps, Theme } from '@mui/material';\nimport { Box } from '@mui/material';\nimport type { ReactNode } from 'react';\nimport { useMemo } from 'react';\n\nexport interface RepeatGridProps<T> {\n  repeatItems: T[];\n  maxPer: number;\n  gap: number;\n  renderItem: (item: T, options: { rowIndex: number; colIndex: number }) => ReactNode;\n  containerSx?: SxProps<Theme>;\n  rowSx?: SxProps<Theme>;\n}\n\nexport function RepeatGrid<T>({\n  repeatItems,\n  maxPer,\n  gap,\n  renderItem,\n  containerSx,\n  rowSx,\n}: RepeatGridProps<T>): ReactNode {\n  const { rows, perRow } = useMemo(() => {\n    const perRow = Math.max(1, maxPer);\n    const rows: T[][] = [];\n    for (let i = 0; i < repeatItems.length; i += perRow) {\n      rows.push(repeatItems.slice(i, i + perRow));\n    }\n\n    return { rows, perRow };\n  }, [maxPer, repeatItems]);\n\n  return (\n    <Box\n      sx={[\n        { display: 'flex', flexDirection: 'column', width: '100%', height: '100%', gap: `${gap}px` },\n        ...(Array.isArray(containerSx) ? containerSx : [containerSx]),\n      ]}\n    >\n      {rows.map((rowItems, rowIndex) => (\n        <Box key={rowIndex} sx={[{ display: 'flex', gap: `${gap}px` }, ...(Array.isArray(rowSx) ? rowSx : [rowSx])]}>\n          {rowItems.map((item, colIndex) => (\n            <Box\n              key={`${rowIndex}-${colIndex}`}\n              sx={{\n                width: `calc((100% - ${gap * (perRow - 1)}px) / ${perRow})`,\n                overflow: 'hidden',\n              }}\n            >\n              {renderItem(item, { rowIndex, colIndex })}\n            </Box>\n          ))}\n        </Box>\n      ))}\n    </Box>\n  );\n}\n"],"names":["Box"],"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,GAAG,QAAQ,gBAAgB;AAapC,OAAO"}

package/dist/SettingsAutocomplete/SettingsAutocomplete.js

@@ -11,6 +11,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
 import { Autocomplete, TextField, Typography, createFilterOptions } from "@mui/material";
 function renderDefaultInput(params) {
     return /*#__PURE__*/ _jsx(TextField, {
@@ -22,34 +23,55 @@ function renderDefaultInput(params) {
  * 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 = renderDefaultInput, id, 'aria-labelledby': ariaLabelledby, ...otherProps }) {
-    const getOptionLabel = (option)=>{
-        return option.label ?? option.id;
-    };
-    // Merge id and aria-labelledby props into the input element for proper accessibility
-    // and form association, while still allowing custom renderInput implementations.
-    const handleRenderInput = (params)=>{
-        const mergedParams = {
-            ...params,
-            inputProps: {
-                ...params.inputProps,
-                id,
-                'aria-labelledby': ariaLabelledby
-            }
+ */ export function SettingsAutocomplete(t0) {
+    const $ = _c(16);
+    let ariaLabelledby;
+    let id;
+    let options;
+    let otherProps;
+    let t1;
+    if ($[0] !== t0) {
+        ({ options, renderInput: t1, id, "aria-labelledby": ariaLabelledby, ...otherProps } = t0);
+        $[0] = t0;
+        $[1] = ariaLabelledby;
+        $[2] = id;
+        $[3] = options;
+        $[4] = otherProps;
+        $[5] = t1;
+    } else {
+        ariaLabelledby = $[1];
+        id = $[2];
+        options = $[3];
+        otherProps = $[4];
+        t1 = $[5];
+    }
+    const renderInput = t1 === undefined ? renderDefaultInput : t1;
+    const getOptionLabel = _temp;
+    let t2;
+    if ($[6] !== ariaLabelledby || $[7] !== id || $[8] !== renderInput) {
+        t2 = (params)=>{
+            const mergedParams = {
+                ...params,
+                inputProps: {
+                    ...params.inputProps,
+                    id,
+                    "aria-labelledby": ariaLabelledby
+                }
+            };
+            return renderInput(mergedParams);
         };
-        return renderInput(mergedParams);
-    };
-    // Note: this component currently is not virtualized because it is specific
-    // to being used for settings, which generally have a pretty small list of
-    // options. If this changes to include values with many options, virtualization
-    // should be added using react-virtuoso.
-    return /*#__PURE__*/ _jsx(Autocomplete, {
-        isOptionEqualToValue: (option, value)=>option.id === value.id,
-        getOptionDisabled: (option)=>!!option.disabled,
-        getOptionLabel: getOptionLabel,
-        options: options,
-        renderInput: handleRenderInput,
-        renderOption: ({ key, ...props }, option)=>{
+        $[6] = ariaLabelledby;
+        $[7] = id;
+        $[8] = renderInput;
+        $[9] = t2;
+    } else {
+        t2 = $[9];
+    }
+    const handleRenderInput = t2;
+    let t3;
+    if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+        t3 = (t4, option_2)=>{
+            const { key, ...props } = t4;
             return /*#__PURE__*/ _jsx("li", {
                 ...props,
                 children: /*#__PURE__*/ _jsxs("div", {
@@ -57,26 +79,65 @@ function renderDefaultInput(params) {
                         /*#__PURE__*/ _jsx(Typography, {
                             variant: "body1",
                             component: "div",
-                            children: getOptionLabel(option)
+                            children: getOptionLabel(option_2)
                         }),
-                        option.description && /*#__PURE__*/ _jsx(Typography, {
+                        option_2.description && /*#__PURE__*/ _jsx(Typography, {
                             variant: "body2",
                             component: "div",
                             sx: {
-                                color: (theme)=>theme.palette.text.secondary
+                                color: _temp4
                             },
-                            children: option.description
+                            children: option_2.description
                         })
                     ]
                 })
             }, key);
-        },
-        filterOptions: createFilterOptions({
-            // Include the label and the description in search.
-            stringify: (option)=>`${getOptionLabel(option)} ${option.description || ''}`
-        }),
-        ...otherProps
-    });
+        };
+        $[10] = t3;
+    } else {
+        t3 = $[10];
+    }
+    let t4;
+    if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+        t4 = createFilterOptions({
+            stringify: (option_3)=>`${getOptionLabel(option_3)} ${option_3.description || ""}`
+        });
+        $[11] = t4;
+    } else {
+        t4 = $[11];
+    }
+    let t5;
+    if ($[12] !== handleRenderInput || $[13] !== options || $[14] !== otherProps) {
+        t5 = /*#__PURE__*/ _jsx(Autocomplete, {
+            isOptionEqualToValue: _temp2,
+            getOptionDisabled: _temp3,
+            getOptionLabel: getOptionLabel,
+            options: options,
+            renderInput: handleRenderInput,
+            renderOption: t3,
+            filterOptions: t4,
+            ...otherProps
+        });
+        $[12] = handleRenderInput;
+        $[13] = options;
+        $[14] = otherProps;
+        $[15] = t5;
+    } else {
+        t5 = $[15];
+    }
+    return t5;
+}
+function _temp4(theme) {
+    return theme.palette.text.secondary;
+}
+function _temp3(option_1) {
+    return !!option_1.disabled;
+}
+function _temp2(option_0, value) {
+    return option_0.id === value.id;
+}
+function _temp(option) {
+    return option.label ?? option.id;
 }
 
 //# sourceMappingURL=SettingsAutocomplete.js.map

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, 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"}
+{"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"],"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,MAAM;IAChC,qBAAO,KAACJ;QAAW,GAAGI,MAAM;;AAC9B;AA0CA;;;;;CAKC,GACD,OAAO"}

package/dist/SortSelector/SortSelector.js

@@ -11,32 +11,65 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
 import { OptionsEditorControl } from "../OptionsEditorLayout/index.js";
 import { SettingsAutocomplete } from "../SettingsAutocomplete/index.js";
 const SORT_OPTIONS = [
     {
-        id: 'asc',
-        label: 'Ascending'
+        id: "asc",
+        label: "Ascending"
     },
     {
-        id: 'desc',
-        label: 'Descending'
+        id: "desc",
+        label: "Descending"
     }
 ];
-export function SortSelector({ onChange, value = 'desc' }) {
-    const handleSortChange = (_, { id })=>{
-        onChange(id);
-    };
-    return /*#__PURE__*/ _jsx(OptionsEditorControl, {
-        label: "Sort",
-        control: /*#__PURE__*/ _jsx(SettingsAutocomplete, {
-            value: SORT_OPTIONS.find((o)=>o.id === value),
-            options: SORT_OPTIONS,
-            getOptionLabel: (o)=>o.label,
-            onChange: handleSortChange,
-            disableClearable: true
-        })
-    });
+export function SortSelector(t0) {
+    const $ = _c(7);
+    const { onChange, value: t1 } = t0;
+    const value = t1 === undefined ? "desc" : t1;
+    let t2;
+    if ($[0] !== onChange) {
+        t2 = (_, t3)=>{
+            const { id } = t3;
+            onChange(id);
+        };
+        $[0] = onChange;
+        $[1] = t2;
+    } else {
+        t2 = $[1];
+    }
+    const handleSortChange = t2;
+    let t3;
+    if ($[2] !== value) {
+        t3 = SORT_OPTIONS.find((o)=>o.id === value);
+        $[2] = value;
+        $[3] = t3;
+    } else {
+        t3 = $[3];
+    }
+    let t4;
+    if ($[4] !== handleSortChange || $[5] !== t3) {
+        t4 = /*#__PURE__*/ _jsx(OptionsEditorControl, {
+            label: "Sort",
+            control: /*#__PURE__*/ _jsx(SettingsAutocomplete, {
+                value: t3,
+                options: SORT_OPTIONS,
+                getOptionLabel: _temp,
+                onChange: handleSortChange,
+                disableClearable: true
+            })
+        });
+        $[4] = handleSortChange;
+        $[5] = t3;
+        $[6] = t4;
+    } else {
+        t4 = $[6];
+    }
+    return t4;
+}
+function _temp(o_0) {
+    return o_0.label;
 }
 
 //# sourceMappingURL=SortSelector.js.map

package/dist/SortSelector/SortSelector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/SortSelector/SortSelector.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';\n\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\n\nconst SORT_OPTIONS: Array<{ id: SortOption; label: string }> = [\n  { id: 'asc', label: 'Ascending' },\n  { id: 'desc', label: 'Descending' },\n];\n\nexport type SortOption = 'asc' | 'desc';\n\nexport interface SortSelectorProps {\n  onChange: (sort: SortOption) => void;\n  value?: SortOption;\n}\n\nexport function SortSelector({ onChange, value = 'desc' }: SortSelectorProps): ReactElement {\n  const handleSortChange = (_: unknown, { id }: { id: SortOption }): void => {\n    onChange(id);\n  };\n\n  return (\n    <OptionsEditorControl\n      label=\"Sort\"\n      control={\n        <SettingsAutocomplete\n          value={SORT_OPTIONS.find((o) => o.id === value)}\n          options={SORT_OPTIONS}\n          getOptionLabel={(o) => o.label}\n          onChange={handleSortChange}\n          disableClearable\n        />\n      }\n    />\n  );\n}\n"],"names":["OptionsEditorControl","SettingsAutocomplete","SORT_OPTIONS","id","label","SortSelector","onChange","value","handleSortChange","_","control","find","o","options","getOptionLabel","disableClearable"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,wEAAwE;AACxE,qEAAqE;AACrE,6EAA6E;AAC7E,sEAAsE;AACtE,iCAAiC;;AAIjC,SAASA,oBAAoB,QAAQ,kCAAyB;AAC9D,SAASC,oBAAoB,QAAQ,mCAA0B;AAE/D,MAAMC,eAAyD;IAC7D;QAAEC,IAAI;QAAOC,OAAO;IAAY;IAChC;QAAED,IAAI;QAAQC,OAAO;IAAa;CACnC;AASD,OAAO,SAASC,aAAa,EAAEC,QAAQ,EAAEC,QAAQ,MAAM,EAAqB;IAC1E,MAAMC,mBAAmB,CAACC,GAAY,EAAEN,EAAE,EAAsB;QAC9DG,SAASH;IACX;IAEA,qBACE,KAACH;QACCI,OAAM;QACNM,uBACE,KAACT;YACCM,OAAOL,aAAaS,IAAI,CAAC,CAACC,IAAMA,EAAET,EAAE,KAAKI;YACzCM,SAASX;YACTY,gBAAgB,CAACF,IAAMA,EAAER,KAAK;YAC9BE,UAAUE;YACVO,gBAAgB;;;AAK1B"}
+{"version":3,"sources":["../../src/SortSelector/SortSelector.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';\n\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\n\nconst SORT_OPTIONS: Array<{ id: SortOption; label: string }> = [\n  { id: 'asc', label: 'Ascending' },\n  { id: 'desc', label: 'Descending' },\n];\n\nexport type SortOption = 'asc' | 'desc';\n\nexport interface SortSelectorProps {\n  onChange: (sort: SortOption) => void;\n  value?: SortOption;\n}\n\nexport function SortSelector({ onChange, value = 'desc' }: SortSelectorProps): ReactElement {\n  const handleSortChange = (_: unknown, { id }: { id: SortOption }): void => {\n    onChange(id);\n  };\n\n  return (\n    <OptionsEditorControl\n      label=\"Sort\"\n      control={\n        <SettingsAutocomplete\n          value={SORT_OPTIONS.find((o) => o.id === value)}\n          options={SORT_OPTIONS}\n          getOptionLabel={(o) => o.label}\n          onChange={handleSortChange}\n          disableClearable\n        />\n      }\n    />\n  );\n}\n"],"names":["OptionsEditorControl","SettingsAutocomplete","SORT_OPTIONS","id","label"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,wEAAwE;AACxE,qEAAqE;AACrE,6EAA6E;AAC7E,sEAAsE;AACtE,iCAAiC;;;AAIjC,SAASA,oBAAoB,QAAQ,kCAAyB;AAC9D,SAASC,oBAAoB,QAAQ,mCAA0B;AAE/D,MAAMC,eAAyD;IAC7D;QAAEC,IAAI;QAAOC,OAAO;IAAY;IAChC;QAAED,IAAI;QAAQC,OAAO;IAAa;CACnC;AASD,OAAO"}

package/dist/SortSelector/SortSelectorButtons.js

@@ -11,32 +11,116 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
 import { Button, ButtonGroup } from "@mui/material";
-export function SortSelectorButtons({ onChange, value, ...props }) {
-    const handleSortChange = (sort)=>{
-        onChange(sort);
-    };
-    return /*#__PURE__*/ _jsxs(ButtonGroup, {
-        "aria-label": "Sort",
-        ...props,
-        children: [
-            /*#__PURE__*/ _jsx(Button, {
-                onClick: ()=>handleSortChange(undefined),
-                variant: value === undefined ? 'contained' : 'outlined',
-                children: "None"
-            }),
-            /*#__PURE__*/ _jsx(Button, {
-                onClick: ()=>handleSortChange('asc'),
-                variant: value === 'asc' ? 'contained' : 'outlined',
-                children: "Asc"
-            }),
-            /*#__PURE__*/ _jsx(Button, {
-                onClick: ()=>handleSortChange('desc'),
-                variant: value === 'desc' ? 'contained' : 'outlined',
-                children: "Desc"
-            })
-        ]
-    });
+export function SortSelectorButtons(t0) {
+    const $ = _c(24);
+    let props;
+    let t1;
+    let value;
+    if ($[0] !== t0) {
+        const { onChange, value: t2, ...t3 } = t0;
+        value = t2;
+        props = t3;
+        t1 = (sort)=>{
+            onChange(sort);
+        };
+        $[0] = t0;
+        $[1] = props;
+        $[2] = t1;
+        $[3] = value;
+    } else {
+        props = $[1];
+        t1 = $[2];
+        value = $[3];
+    }
+    const handleSortChange = t1;
+    let t2;
+    if ($[4] !== handleSortChange) {
+        t2 = ()=>handleSortChange(undefined);
+        $[4] = handleSortChange;
+        $[5] = t2;
+    } else {
+        t2 = $[5];
+    }
+    const t3 = value === undefined ? "contained" : "outlined";
+    let t4;
+    if ($[6] !== t2 || $[7] !== t3) {
+        t4 = /*#__PURE__*/ _jsx(Button, {
+            onClick: t2,
+            variant: t3,
+            children: "None"
+        });
+        $[6] = t2;
+        $[7] = t3;
+        $[8] = t4;
+    } else {
+        t4 = $[8];
+    }
+    let t5;
+    if ($[9] !== handleSortChange) {
+        t5 = ()=>handleSortChange("asc");
+        $[9] = handleSortChange;
+        $[10] = t5;
+    } else {
+        t5 = $[10];
+    }
+    const t6 = value === "asc" ? "contained" : "outlined";
+    let t7;
+    if ($[11] !== t5 || $[12] !== t6) {
+        t7 = /*#__PURE__*/ _jsx(Button, {
+            onClick: t5,
+            variant: t6,
+            children: "Asc"
+        });
+        $[11] = t5;
+        $[12] = t6;
+        $[13] = t7;
+    } else {
+        t7 = $[13];
+    }
+    let t8;
+    if ($[14] !== handleSortChange) {
+        t8 = ()=>handleSortChange("desc");
+        $[14] = handleSortChange;
+        $[15] = t8;
+    } else {
+        t8 = $[15];
+    }
+    const t9 = value === "desc" ? "contained" : "outlined";
+    let t10;
+    if ($[16] !== t8 || $[17] !== t9) {
+        t10 = /*#__PURE__*/ _jsx(Button, {
+            onClick: t8,
+            variant: t9,
+            children: "Desc"
+        });
+        $[16] = t8;
+        $[17] = t9;
+        $[18] = t10;
+    } else {
+        t10 = $[18];
+    }
+    let t11;
+    if ($[19] !== props || $[20] !== t10 || $[21] !== t4 || $[22] !== t7) {
+        t11 = /*#__PURE__*/ _jsxs(ButtonGroup, {
+            "aria-label": "Sort",
+            ...props,
+            children: [
+                t4,
+                t7,
+                t10
+            ]
+        });
+        $[19] = props;
+        $[20] = t10;
+        $[21] = t4;
+        $[22] = t7;
+        $[23] = t11;
+    } else {
+        t11 = $[23];
+    }
+    return t11;
 }
 
 //# sourceMappingURL=SortSelectorButtons.js.map

package/dist/SortSelector/SortSelectorButtons.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/SortSelector/SortSelectorButtons.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License |  Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing |  software\n// distributed under the License is distributed on an \"AS IS\" BASIS |\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND |  either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { ButtonGroupProps } from '@mui/material';\nimport { Button, ButtonGroup } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport type { SortOption } from './SortSelector';\n\nexport interface SortSelectorButtonsProps extends Omit<ButtonGroupProps, 'onChange'> {\n  value?: SortOption;\n  onChange: (sort?: SortOption) => void;\n}\n\nexport function SortSelectorButtons({ onChange, value, ...props }: SortSelectorButtonsProps): ReactElement {\n  const handleSortChange = (sort?: SortOption): void => {\n    onChange(sort);\n  };\n\n  return (\n    <ButtonGroup aria-label=\"Sort\" {...props}>\n      <Button onClick={() => handleSortChange(undefined)} variant={value === undefined ? 'contained' : 'outlined'}>\n        None\n      </Button>\n      <Button onClick={() => handleSortChange('asc')} variant={value === 'asc' ? 'contained' : 'outlined'}>\n        Asc\n      </Button>\n      <Button onClick={() => handleSortChange('desc')} variant={value === 'desc' ? 'contained' : 'outlined'}>\n        Desc\n      </Button>\n    </ButtonGroup>\n  );\n}\n"],"names":["Button","ButtonGroup","SortSelectorButtons","onChange","value","props","handleSortChange","sort","aria-label","onClick","undefined","variant"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,wEAAwE;AACxE,qEAAqE;AACrE,6EAA6E;AAC7E,sEAAsE;AACtE,iCAAiC;;AAGjC,SAASA,MAAM,EAAEC,WAAW,QAAQ,gBAAgB;AAUpD,OAAO,SAASC,oBAAoB,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGC,OAAiC;IACzF,MAAMC,mBAAmB,CAACC;QACxBJ,SAASI;IACX;IAEA,qBACE,MAACN;QAAYO,cAAW;QAAQ,GAAGH,KAAK;;0BACtC,KAACL;gBAAOS,SAAS,IAAMH,iBAAiBI;gBAAYC,SAASP,UAAUM,YAAY,cAAc;0BAAY;;0BAG7G,KAACV;gBAAOS,SAAS,IAAMH,iBAAiB;gBAAQK,SAASP,UAAU,QAAQ,cAAc;0BAAY;;0BAGrG,KAACJ;gBAAOS,SAAS,IAAMH,iBAAiB;gBAASK,SAASP,UAAU,SAAS,cAAc;0BAAY;;;;AAK7G"}
+{"version":3,"sources":["../../src/SortSelector/SortSelectorButtons.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License |  Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing |  software\n// distributed under the License is distributed on an \"AS IS\" BASIS |\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND |  either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { ButtonGroupProps } from '@mui/material';\nimport { Button, ButtonGroup } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport type { SortOption } from './SortSelector';\n\nexport interface SortSelectorButtonsProps extends Omit<ButtonGroupProps, 'onChange'> {\n  value?: SortOption;\n  onChange: (sort?: SortOption) => void;\n}\n\nexport function SortSelectorButtons({ onChange, value, ...props }: SortSelectorButtonsProps): ReactElement {\n  const handleSortChange = (sort?: SortOption): void => {\n    onChange(sort);\n  };\n\n  return (\n    <ButtonGroup aria-label=\"Sort\" {...props}>\n      <Button onClick={() => handleSortChange(undefined)} variant={value === undefined ? 'contained' : 'outlined'}>\n        None\n      </Button>\n      <Button onClick={() => handleSortChange('asc')} variant={value === 'asc' ? 'contained' : 'outlined'}>\n        Asc\n      </Button>\n      <Button onClick={() => handleSortChange('desc')} variant={value === 'desc' ? 'contained' : 'outlined'}>\n        Desc\n      </Button>\n    </ButtonGroup>\n  );\n}\n"],"names":["Button","ButtonGroup"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,wEAAwE;AACxE,qEAAqE;AACrE,6EAA6E;AAC7E,sEAAsE;AACtE,iCAAiC;;;AAGjC,SAASA,MAAM,EAAEC,WAAW,QAAQ,gBAAgB;AAUpD,OAAO"}

package/dist/Table/InnerTable.js

@@ -11,29 +11,60 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
 import { Table as MuiTable, styled } from "@mui/material";
 import { forwardRef } from "react";
 const StyledMuiTable = styled(MuiTable)(({ theme })=>({
         // This value is needed to have a consistent table layout when scrolling.
-        tableLayout: 'fixed',
-        borderCollapse: 'separate',
+        tableLayout: "fixed",
+        borderCollapse: "separate",
         backgroundColor: theme.palette.background.default
     }));
 const TABLE_DENSITY_CONFIG = {
-    compact: 'small',
-    standard: 'medium',
-    comfortable: 'medium'
+    compact: "small",
+    standard: "medium",
+    comfortable: "medium"
 };
-export const InnerTable = /*#__PURE__*/ forwardRef(function InnerTable({ density, ...otherProps }, ref) {
-    return /*#__PURE__*/ _jsx(StyledMuiTable, {
-        ...otherProps,
-        tabIndex: -1,
-        size: TABLE_DENSITY_CONFIG[density],
-        ref: ref,
-        sx: {
-            width: '100%'
-        }
-    });
+export const InnerTable = /*#__PURE__*/ forwardRef(function InnerTable(t0, ref) {
+    const $ = _c(8);
+    let density;
+    let otherProps;
+    if ($[0] !== t0) {
+        ({ density, ...otherProps } = t0);
+        $[0] = t0;
+        $[1] = density;
+        $[2] = otherProps;
+    } else {
+        density = $[1];
+        otherProps = $[2];
+    }
+    const t1 = TABLE_DENSITY_CONFIG[density];
+    let t2;
+    if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+        t2 = {
+            width: "100%"
+        };
+        $[3] = t2;
+    } else {
+        t2 = $[3];
+    }
+    let t3;
+    if ($[4] !== otherProps || $[5] !== ref || $[6] !== t1) {
+        t3 = /*#__PURE__*/ _jsx(StyledMuiTable, {
+            ...otherProps,
+            tabIndex: -1,
+            size: t1,
+            ref: ref,
+            sx: t2
+        });
+        $[4] = otherProps;
+        $[5] = ref;
+        $[6] = t1;
+        $[7] = t3;
+    } else {
+        t3 = $[7];
+    }
+    return t3;
 });
 
 //# sourceMappingURL=InnerTable.js.map

package/dist/Table/InnerTable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Table/InnerTable.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { TableProps as MuiTableProps } from '@mui/material';\nimport { Table as MuiTable, styled } from '@mui/material';\nimport { forwardRef } from 'react';\n\nimport type { TableDensity } from './model/table-model';\n\nconst StyledMuiTable = styled(MuiTable)(({ theme }) => ({\n  // This value is needed to have a consistent table layout when scrolling.\n  tableLayout: 'fixed',\n  borderCollapse: 'separate',\n  backgroundColor: theme.palette.background.default,\n}));\n\ntype InnerTableProps = Omit<MuiTableProps, 'size'> & {\n  density: TableDensity;\n};\n\nconst TABLE_DENSITY_CONFIG: Record<TableDensity, MuiTableProps['size']> = {\n  compact: 'small',\n  standard: 'medium',\n  comfortable: 'medium',\n};\n\nexport const InnerTable = forwardRef<HTMLTableElement, InnerTableProps>(function InnerTable(\n  { density, ...otherProps },\n  ref,\n) {\n  return (\n    <StyledMuiTable\n      {...otherProps}\n      tabIndex={-1}\n      size={TABLE_DENSITY_CONFIG[density]}\n      ref={ref}\n      sx={{\n        width: '100%',\n      }}\n    />\n  );\n});\n"],"names":["Table","MuiTable","styled","forwardRef","StyledMuiTable","theme","tableLayout","borderCollapse","backgroundColor","palette","background","default","TABLE_DENSITY_CONFIG","compact","standard","comfortable","InnerTable","density","otherProps","ref","tabIndex","size","sx","width"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAGjC,SAASA,SAASC,QAAQ,EAAEC,MAAM,QAAQ,gBAAgB;AAC1D,SAASC,UAAU,QAAQ,QAAQ;AAInC,MAAMC,iBAAiBF,OAAOD,UAAU,CAAC,EAAEI,KAAK,EAAE,GAAM,CAAA;QACtD,yEAAyE;QACzEC,aAAa;QACbC,gBAAgB;QAChBC,iBAAiBH,MAAMI,OAAO,CAACC,UAAU,CAACC,OAAO;IACnD,CAAA;AAMA,MAAMC,uBAAoE;IACxEC,SAAS;IACTC,UAAU;IACVC,aAAa;AACf;AAEA,OAAO,MAAMC,2BAAab,WAA8C,SAASa,WAC/E,EAAEC,OAAO,EAAE,GAAGC,YAAY,EAC1BC,GAAG;IAEH,qBACE,KAACf;QACE,GAAGc,UAAU;QACdE,UAAU,CAAC;QACXC,MAAMT,oBAAoB,CAACK,QAAQ;QACnCE,KAAKA;QACLG,IAAI;YACFC,OAAO;QACT;;AAGN,GAAG"}
+{"version":3,"sources":["../../src/Table/InnerTable.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { TableProps as MuiTableProps } from '@mui/material';\nimport { Table as MuiTable, styled } from '@mui/material';\nimport { forwardRef } from 'react';\n\nimport type { TableDensity } from './model/table-model';\n\nconst StyledMuiTable = styled(MuiTable)(({ theme }) => ({\n  // This value is needed to have a consistent table layout when scrolling.\n  tableLayout: 'fixed',\n  borderCollapse: 'separate',\n  backgroundColor: theme.palette.background.default,\n}));\n\ntype InnerTableProps = Omit<MuiTableProps, 'size'> & {\n  density: TableDensity;\n};\n\nconst TABLE_DENSITY_CONFIG: Record<TableDensity, MuiTableProps['size']> = {\n  compact: 'small',\n  standard: 'medium',\n  comfortable: 'medium',\n};\n\nexport const InnerTable = forwardRef<HTMLTableElement, InnerTableProps>(function InnerTable(\n  { density, ...otherProps },\n  ref,\n) {\n  return (\n    <StyledMuiTable\n      {...otherProps}\n      tabIndex={-1}\n      size={TABLE_DENSITY_CONFIG[density]}\n      ref={ref}\n      sx={{\n        width: '100%',\n      }}\n    />\n  );\n});\n"],"names":["Table","MuiTable","styled","forwardRef","StyledMuiTable","theme","tableLayout","borderCollapse","backgroundColor","palette","background","default","TABLE_DENSITY_CONFIG","compact","standard","comfortable","InnerTable"],"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,SAASC,QAAQ,EAAEC,MAAM,QAAQ,gBAAgB;AAC1D,SAASC,UAAU,QAAQ,QAAQ;AAInC,MAAMC,iBAAiBF,OAAOD,UAAU,CAAC,EAAEI,KAAK,EAAE,GAAM,CAAA;QACtD,yEAAyE;QACzEC,aAAa;QACbC,gBAAgB;QAChBC,iBAAiBH,MAAMI,OAAO,CAACC,UAAU,CAACC,OAAO;IACnD,CAAA;AAMA,MAAMC,uBAAoE;IACxEC,SAAS;IACTC,UAAU;IACVC,aAAa;AACf;AAEA,OAAO,MAAMC,2BAAab,WAA8C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAerE"}

package/dist/Table/Table.d.ts

@@ -1,10 +1,12 @@
+import type { RowData } from '@tanstack/react-table';
 import type { ReactElement } from 'react';
 import type { TableProps } from './model/table-model';
+export type { TableFeatures } from './model/table-model';
 /**
  * Component used to render tabular data in Perses use cases. This component is
  * **not** intended to be a general use data table for use cases unrelated to Perses.
  *
  * **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 declare function Table<TableData>({ data, columns, cellConfigs, density, defaultColumnWidth, defaultColumnHeight, checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId, rowSelection, sorting, getItemActions, hasItemActions, pagination, onPaginationChange, rowSelectionVariant, getSubRows, hiddenColumns, tableToolbarConfig, columnResizeMode, defaultColumnConfig, ...otherProps }: TableProps<TableData>): ReactElement;
+export declare function Table<TableData extends RowData>({ data, columns, cellConfigs, density, defaultColumnWidth, defaultColumnHeight, checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId, rowSelection, sorting, getItemActions, hasItemActions, pagination, onPaginationChange, rowSelectionVariant, getSubRows, hiddenColumns, tableToolbarConfig, columnResizeMode, defaultColumnConfig, ...otherProps }: TableProps<TableData>): ReactElement;
 //# sourceMappingURL=Table.d.ts.map

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,CAwMtC"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAMV,OAAO,EAIR,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,UAAU,EAAiB,MAAM,qBAAqB,CAAC;AAErE,YAAY,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAczD;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,SAAS,SAAS,OAAO,EAAE,EAC/C,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,CAiMtC"}