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

package/dist/TimeZoneSelector.js

@@ -11,51 +11,146 @@
 // 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 { Select, MenuItem } from "@mui/material";
-import { useMemo } from "react";
 import { getTimeZoneOptions } from "./model/timeZoneOption.js";
 /**
  * Timezone selector component
  * Allows users to select a timezone from a dropdown list
- */ export function TimeZoneSelector({ value, onChange, timeZoneOptions, variant = 'standard', heightPx, ...selectProps }) {
-    const options = useMemo(()=>timeZoneOptions ?? getTimeZoneOptions(), [
-        timeZoneOptions
-    ]);
-    let height;
-    if (heightPx) {
-        height = typeof heightPx === 'number' ? `${heightPx}px` : heightPx;
+ */ export function TimeZoneSelector(t0) {
+    const $ = _c(31);
+    let heightPx;
+    let onChange;
+    let selectProps;
+    let t1;
+    let timeZoneOptions;
+    let value;
+    if ($[0] !== t0) {
+        ({ value, onChange, timeZoneOptions, variant: t1, heightPx, ...selectProps } = t0);
+        $[0] = t0;
+        $[1] = heightPx;
+        $[2] = onChange;
+        $[3] = selectProps;
+        $[4] = t1;
+        $[5] = timeZoneOptions;
+        $[6] = value;
+    } else {
+        heightPx = $[1];
+        onChange = $[2];
+        selectProps = $[3];
+        t1 = $[4];
+        timeZoneOptions = $[5];
+        value = $[6];
+    }
+    const variant = t1 === undefined ? "standard" : t1;
+    let t2;
+    if ($[7] !== timeZoneOptions) {
+        t2 = timeZoneOptions ?? getTimeZoneOptions();
+        $[7] = timeZoneOptions;
+        $[8] = t2;
+    } else {
+        t2 = $[8];
     }
-    const handleChange = (selectedValue)=>{
-        const selectedOption = options.find((opt)=>opt.value === selectedValue);
-        if (selectedOption && onChange) {
-            onChange(selectedOption);
+    const options = t2;
+    let height;
+    if ($[9] !== heightPx) {
+        if (heightPx) {
+            height = typeof heightPx === "number" ? `${heightPx}px` : heightPx;
         }
-    };
-    const sxStyles = useMemo(()=>({
-            minWidth: variant === 'compact' ? '80px' : '150px',
-            ...height && {
-                lineHeight: height,
-                paddingY: 0
-            },
+        $[9] = heightPx;
+        $[10] = height;
+    } else {
+        height = $[10];
+    }
+    let t3;
+    if ($[11] !== onChange || $[12] !== options) {
+        t3 = (selectedValue)=>{
+            const selectedOption = options.find((opt)=>opt.value === selectedValue);
+            if (selectedOption && onChange) {
+                onChange(selectedOption);
+            }
+        };
+        $[11] = onChange;
+        $[12] = options;
+        $[13] = t3;
+    } else {
+        t3 = $[13];
+    }
+    const handleChange = t3;
+    height;
+    const t4 = variant === "compact" ? "80px" : "150px";
+    let t5;
+    if ($[14] !== height) {
+        t5 = height && {
+            lineHeight: height,
+            paddingY: 0
+        };
+        $[14] = height;
+        $[15] = t5;
+    } else {
+        t5 = $[15];
+    }
+    let t6;
+    if ($[16] !== selectProps.sx || $[17] !== t4 || $[18] !== t5) {
+        t6 = {
+            minWidth: t4,
+            ...t5,
             ...selectProps.sx
-        }), [
-        variant,
-        height,
-        selectProps.sx
-    ]);
-    return /*#__PURE__*/ _jsx(Select, {
-        ...selectProps,
-        value: value,
-        onChange: (event, _child)=>{
+        };
+        $[16] = selectProps.sx;
+        $[17] = t4;
+        $[18] = t5;
+        $[19] = t6;
+    } else {
+        t6 = $[19];
+    }
+    const sxStyles = t6;
+    let t7;
+    if ($[20] !== handleChange) {
+        t7 = (event, _child)=>{
             handleChange(event.target.value);
-        },
-        sx: sxStyles,
-        size: variant === 'compact' ? 'small' : 'medium',
-        children: options.map((option)=>/*#__PURE__*/ _jsx(MenuItem, {
-                value: option.value,
-                children: option.display
-            }, option.value))
-    });
+        };
+        $[20] = handleChange;
+        $[21] = t7;
+    } else {
+        t7 = $[21];
+    }
+    const t8 = variant === "compact" ? "small" : "medium";
+    let t9;
+    if ($[22] !== options) {
+        t9 = options.map(_temp);
+        $[22] = options;
+        $[23] = t9;
+    } else {
+        t9 = $[23];
+    }
+    let t10;
+    if ($[24] !== selectProps || $[25] !== sxStyles || $[26] !== t7 || $[27] !== t8 || $[28] !== t9 || $[29] !== value) {
+        t10 = /*#__PURE__*/ _jsx(Select, {
+            ...selectProps,
+            value: value,
+            onChange: t7,
+            sx: sxStyles,
+            size: t8,
+            children: t9
+        });
+        $[24] = selectProps;
+        $[25] = sxStyles;
+        $[26] = t7;
+        $[27] = t8;
+        $[28] = t9;
+        $[29] = value;
+        $[30] = t10;
+    } else {
+        t10 = $[30];
+    }
+    return t10;
+}
+function _temp(option) {
+    return /*#__PURE__*/ _jsx(MenuItem, {
+        value: option.value,
+        children: option.display
+    }, option.value);
 }
 
 //# sourceMappingURL=TimeZoneSelector.js.map

package/dist/TimeZoneSelector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TimeZoneSelector.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 { SelectProps, SelectChangeEvent } from '@mui/material';\nimport { Select, MenuItem } from '@mui/material';\nimport type { ReactElement, ReactNode } from 'react';\nimport { useMemo } from 'react';\n\nimport type { TimeZoneOption } from './model/timeZoneOption';\nimport { getTimeZoneOptions } from './model/timeZoneOption';\n\nexport interface TimeZoneSelectorProps extends Omit<SelectProps, 'onChange' | 'variant' | 'value'> {\n  value: string;\n  onChange?: (timeZoneOption: TimeZoneOption) => void;\n  timeZoneOptions?: TimeZoneOption[];\n  variant?: 'standard' | 'compact';\n  heightPx?: string | number;\n}\n\n/**\n * Timezone selector component\n * Allows users to select a timezone from a dropdown list\n */\nexport function TimeZoneSelector({\n  value,\n  onChange,\n  timeZoneOptions,\n  variant = 'standard',\n  heightPx,\n  ...selectProps\n}: TimeZoneSelectorProps): ReactElement {\n  const options = useMemo(() => timeZoneOptions ?? getTimeZoneOptions(), [timeZoneOptions]);\n\n  let height: string | undefined;\n  if (heightPx) {\n    height = typeof heightPx === 'number' ? `${heightPx}px` : heightPx;\n  }\n\n  const handleChange = (selectedValue: string): void => {\n    const selectedOption = options.find((opt: TimeZoneOption) => opt.value === selectedValue);\n    if (selectedOption && onChange) {\n      onChange(selectedOption);\n    }\n  };\n\n  const sxStyles = useMemo(\n    () => ({\n      minWidth: variant === 'compact' ? '80px' : '150px',\n      ...(height && { lineHeight: height, paddingY: 0 }),\n      ...selectProps.sx,\n    }),\n    [variant, height, selectProps.sx],\n  );\n\n  return (\n    <Select\n      {...selectProps}\n      value={value}\n      onChange={(event: SelectChangeEvent<unknown>, _child: ReactNode) => {\n        handleChange(event.target.value as string);\n      }}\n      sx={sxStyles}\n      size={variant === 'compact' ? 'small' : 'medium'}\n    >\n      {options.map((option: TimeZoneOption) => (\n        <MenuItem key={option.value} value={option.value}>\n          {option.display}\n        </MenuItem>\n      ))}\n    </Select>\n  );\n}\n"],"names":["Select","MenuItem","useMemo","getTimeZoneOptions","TimeZoneSelector","value","onChange","timeZoneOptions","variant","heightPx","selectProps","options","height","handleChange","selectedValue","selectedOption","find","opt","sxStyles","minWidth","lineHeight","paddingY","sx","event","_child","target","size","map","option","display"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAGjC,SAASA,MAAM,EAAEC,QAAQ,QAAQ,gBAAgB;AAEjD,SAASC,OAAO,QAAQ,QAAQ;AAGhC,SAASC,kBAAkB,QAAQ,4BAAyB;AAU5D;;;CAGC,GACD,OAAO,SAASC,iBAAiB,EAC/BC,KAAK,EACLC,QAAQ,EACRC,eAAe,EACfC,UAAU,UAAU,EACpBC,QAAQ,EACR,GAAGC,aACmB;IACtB,MAAMC,UAAUT,QAAQ,IAAMK,mBAAmBJ,sBAAsB;QAACI;KAAgB;IAExF,IAAIK;IACJ,IAAIH,UAAU;QACZG,SAAS,OAAOH,aAAa,WAAW,GAAGA,SAAS,EAAE,CAAC,GAAGA;IAC5D;IAEA,MAAMI,eAAe,CAACC;QACpB,MAAMC,iBAAiBJ,QAAQK,IAAI,CAAC,CAACC,MAAwBA,IAAIZ,KAAK,KAAKS;QAC3E,IAAIC,kBAAkBT,UAAU;YAC9BA,SAASS;QACX;IACF;IAEA,MAAMG,WAAWhB,QACf,IAAO,CAAA;YACLiB,UAAUX,YAAY,YAAY,SAAS;YAC3C,GAAII,UAAU;gBAAEQ,YAAYR;gBAAQS,UAAU;YAAE,CAAC;YACjD,GAAGX,YAAYY,EAAE;QACnB,CAAA,GACA;QAACd;QAASI;QAAQF,YAAYY,EAAE;KAAC;IAGnC,qBACE,KAACtB;QACE,GAAGU,WAAW;QACfL,OAAOA;QACPC,UAAU,CAACiB,OAAmCC;YAC5CX,aAAaU,MAAME,MAAM,CAACpB,KAAK;QACjC;QACAiB,IAAIJ;QACJQ,MAAMlB,YAAY,YAAY,UAAU;kBAEvCG,QAAQgB,GAAG,CAAC,CAACC,uBACZ,KAAC3B;gBAA4BI,OAAOuB,OAAOvB,KAAK;0BAC7CuB,OAAOC,OAAO;eADFD,OAAOvB,KAAK;;AAMnC"}
+{"version":3,"sources":["../src/TimeZoneSelector.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 { SelectProps, SelectChangeEvent } from '@mui/material';\nimport { Select, MenuItem } from '@mui/material';\nimport type { ReactElement, ReactNode } from 'react';\nimport { useMemo } from 'react';\n\nimport type { TimeZoneOption } from './model/timeZoneOption';\nimport { getTimeZoneOptions } from './model/timeZoneOption';\n\nexport interface TimeZoneSelectorProps extends Omit<SelectProps, 'onChange' | 'variant' | 'value'> {\n  value: string;\n  onChange?: (timeZoneOption: TimeZoneOption) => void;\n  timeZoneOptions?: TimeZoneOption[];\n  variant?: 'standard' | 'compact';\n  heightPx?: string | number;\n}\n\n/**\n * Timezone selector component\n * Allows users to select a timezone from a dropdown list\n */\nexport function TimeZoneSelector({\n  value,\n  onChange,\n  timeZoneOptions,\n  variant = 'standard',\n  heightPx,\n  ...selectProps\n}: TimeZoneSelectorProps): ReactElement {\n  const options = useMemo(() => timeZoneOptions ?? getTimeZoneOptions(), [timeZoneOptions]);\n\n  let height: string | undefined;\n  if (heightPx) {\n    height = typeof heightPx === 'number' ? `${heightPx}px` : heightPx;\n  }\n\n  const handleChange = (selectedValue: string): void => {\n    const selectedOption = options.find((opt: TimeZoneOption) => opt.value === selectedValue);\n    if (selectedOption && onChange) {\n      onChange(selectedOption);\n    }\n  };\n\n  const sxStyles = useMemo(\n    () => ({\n      minWidth: variant === 'compact' ? '80px' : '150px',\n      ...(height && { lineHeight: height, paddingY: 0 }),\n      ...selectProps.sx,\n    }),\n    [variant, height, selectProps.sx],\n  );\n\n  return (\n    <Select\n      {...selectProps}\n      value={value}\n      onChange={(event: SelectChangeEvent<unknown>, _child: ReactNode) => {\n        handleChange(event.target.value as string);\n      }}\n      sx={sxStyles}\n      size={variant === 'compact' ? 'small' : 'medium'}\n    >\n      {options.map((option: TimeZoneOption) => (\n        <MenuItem key={option.value} value={option.value}>\n          {option.display}\n        </MenuItem>\n      ))}\n    </Select>\n  );\n}\n"],"names":["Select","MenuItem","getTimeZoneOptions"],"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,MAAM,EAAEC,QAAQ,QAAQ,gBAAgB;AAKjD,SAASC,kBAAkB,QAAQ,4BAAyB;AAU5D;;;CAGC,GACD,OAAO"}

package/dist/ToolbarIconButton/ToolbarIconButton.js

@@ -11,21 +11,32 @@
 // 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 { Button, styled } from "@mui/material";
 import { forwardRef } from "react";
 function IconButton(props, ref) {
-    return /*#__PURE__*/ _jsx(StyledIconButton, {
-        ref: ref,
-        variant: "outlined",
-        color: "secondary",
-        ...props
-    });
+    const $ = _c(3);
+    let t0;
+    if ($[0] !== props || $[1] !== ref) {
+        t0 = /*#__PURE__*/ _jsx(StyledIconButton, {
+            ref: ref,
+            variant: "outlined",
+            color: "secondary",
+            ...props
+        });
+        $[0] = props;
+        $[1] = ref;
+        $[2] = t0;
+    } else {
+        t0 = $[2];
+    }
+    return t0;
 }
 const StyledIconButton = styled(Button)(({ theme })=>({
         // Using a button with some adjusted styles because it is easier to inherit
         // styling and variants from themes than with an IconButton.
         padding: theme.spacing(0.5),
-        minWidth: 'auto'
+        minWidth: "auto"
     }));
 export const ToolbarIconButton = /*#__PURE__*/ forwardRef(IconButton);
 

package/dist/ToolbarIconButton/ToolbarIconButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ToolbarIconButton/ToolbarIconButton.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 { ButtonProps } from '@mui/material';\nimport { Button, styled } from '@mui/material';\nimport type { ForwardedRef, ReactElement } from 'react';\nimport { forwardRef } from 'react';\n\ntype ToolbarIconButtonProps = ButtonProps;\n\nfunction IconButton(props: ToolbarIconButtonProps, ref: ForwardedRef<HTMLButtonElement>): ReactElement {\n  return <StyledIconButton ref={ref} variant=\"outlined\" color=\"secondary\" {...props} />;\n}\n\nconst StyledIconButton = styled(Button)(({ theme }) => ({\n  // Using a button with some adjusted styles because it is easier to inherit\n  // styling and variants from themes than with an IconButton.\n  padding: theme.spacing(0.5),\n  minWidth: 'auto',\n}));\n\nexport const ToolbarIconButton = forwardRef(IconButton);\n"],"names":["Button","styled","forwardRef","IconButton","props","ref","StyledIconButton","variant","color","theme","padding","spacing","minWidth","ToolbarIconButton"],"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,MAAM,EAAEC,MAAM,QAAQ,gBAAgB;AAE/C,SAASC,UAAU,QAAQ,QAAQ;AAInC,SAASC,WAAWC,KAA6B,EAAEC,GAAoC;IACrF,qBAAO,KAACC;QAAiBD,KAAKA;QAAKE,SAAQ;QAAWC,OAAM;QAAa,GAAGJ,KAAK;;AACnF;AAEA,MAAME,mBAAmBL,OAAOD,QAAQ,CAAC,EAAES,KAAK,EAAE,GAAM,CAAA;QACtD,2EAA2E;QAC3E,4DAA4D;QAC5DC,SAASD,MAAME,OAAO,CAAC;QACvBC,UAAU;IACZ,CAAA;AAEA,OAAO,MAAMC,kCAAoBX,WAAWC,YAAY"}
+{"version":3,"sources":["../../src/ToolbarIconButton/ToolbarIconButton.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 { ButtonProps } from '@mui/material';\nimport { Button, styled } from '@mui/material';\nimport type { ForwardedRef, ReactElement } from 'react';\nimport { forwardRef } from 'react';\n\ntype ToolbarIconButtonProps = ButtonProps;\n\nfunction IconButton(props: ToolbarIconButtonProps, ref: ForwardedRef<HTMLButtonElement>): ReactElement {\n  return <StyledIconButton ref={ref} variant=\"outlined\" color=\"secondary\" {...props} />;\n}\n\nconst StyledIconButton = styled(Button)(({ theme }) => ({\n  // Using a button with some adjusted styles because it is easier to inherit\n  // styling and variants from themes than with an IconButton.\n  padding: theme.spacing(0.5),\n  minWidth: 'auto',\n}));\n\nexport const ToolbarIconButton = forwardRef(IconButton);\n"],"names":["Button","styled","forwardRef","StyledIconButton","theme","padding","spacing","minWidth","ToolbarIconButton","IconButton"],"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,MAAM,EAAEC,MAAM,QAAQ,gBAAgB;AAE/C,SAASC,UAAU,QAAQ,QAAQ;AAInC;;;;;;;;;;;;;;;;;;AAIA,MAAMC,mBAAmBF,OAAOD,QAAQ,CAAC,EAAEI,KAAK,EAAE,GAAM,CAAA;QACtD,2EAA2E;QAC3E,4DAA4D;QAC5DC,SAASD,MAAME,OAAO,CAAC;QACvBC,UAAU;IACZ,CAAA;AAEA,OAAO,MAAMC,kCAAoBN,WAAWO,YAAY"}