@carto/meridian-ds 2.6.1-alpha-searchfield.6 → 2.6.2-alpha.0

package/dist/components/index.js

@@ -1,14 +1,14 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import React, { forwardRef, useState, useRef, useEffect, useMemo, createElement, Fragment as Fragment$1, useCallback, useImperativeHandle } from "react";
-import { styled, Box, Button as Button$1, CircularProgress, Popper, Grow, Paper, ClickAwayListener, MenuList as MenuList$1, MenuItem, ButtonGroup as ButtonGroup$1, TextField, InputAdornment, Select, FormControl, InputLabel, FormHelperText, Link, Checkbox, IconButton as IconButton$1, ListItemText, Tooltip, ToggleButtonGroup as ToggleButtonGroup$1, Autocomplete as Autocomplete$1, Divider, ListItemIcon, createFilterOptions, alpha, useTheme, AppBar as AppBar$1, Toolbar, Dialog as Dialog$1, DialogTitle as DialogTitle$1, Chip, DialogContent as DialogContent$1, DialogActions as DialogActions$1, Slide, Accordion, AccordionSummary, AccordionDetails, Avatar as Avatar$1, Menu as Menu$2, useMediaQuery, Stack, Snackbar as Snackbar$1, Portal, Fade } from "@mui/material";
+import { styled, Box, Button as Button$1, CircularProgress, Popper, Grow, Paper, ClickAwayListener, MenuList as MenuList$1, MenuItem, ButtonGroup as ButtonGroup$1, TextField, InputAdornment, Select, FormControl, InputLabel, FormHelperText, Link, Checkbox, IconButton as IconButton$1, ListItemText, Tooltip, ToggleButtonGroup as ToggleButtonGroup$1, Autocomplete as Autocomplete$1, Divider, ListItemIcon, createFilterOptions, alpha, useTheme, AppBar as AppBar$1, Toolbar, Dialog as Dialog$1, DialogTitle as DialogTitle$1, Chip, DialogContent as DialogContent$1, DialogActions as DialogActions$1, Slide, Accordion, AccordionSummary, AccordionDetails, Avatar as Avatar$1, Menu as Menu$2, useMediaQuery, Snackbar as Snackbar$1, Portal, Fade } from "@mui/material";
 import { OpenInNewOutlined, VisibilityOffOutlined, VisibilityOutlined, Cancel, ContentCopyOutlined, AddCircleOutlineOutlined, MenuOutlined, MoreVertOutlined, HelpOutline, ErrorOutline, CloseOutlined, Check, TodayOutlined } from "@mui/icons-material";
-import { u as useTranslationWithFallback, T as Typography, c as ICON_SIZE_SMALL, i as IconButton, f as MENU_ITEM_SIZE_DENSE, d as MENU_LIST_MAX_SIZE, h as MENU_ITEM_SIZE_EXTENDED, M as MENU_ITEM_SIZE_DEFAULT, A as APPBAR_SIZE, j as useImperativeIntl, b as ICON_SIZE_MEDIUM, N as NOTIFICATION_DURATION_IN_MS, e as ellipsisStyles } from "../css-utils-BHYA7By_.js";
-import { a } from "../css-utils-BHYA7By_.js";
-import { S as ScreenReaderOnly, A as Alert$1 } from "../Alert-BfDnWlbD.js";
-import { L } from "../Alert-BfDnWlbD.js";
+import { u as useTranslationWithFallback, T as Typography, c as ICON_SIZE_SMALL, i as IconButton, f as MENU_ITEM_SIZE_DENSE, d as MENU_LIST_MAX_SIZE, h as MENU_ITEM_SIZE_EXTENDED, M as MENU_ITEM_SIZE_DEFAULT, A as APPBAR_SIZE, j as useImperativeIntl, N as NOTIFICATION_DURATION_IN_MS, e as ellipsisStyles } from "../css-utils-lmkjeCdF.js";
+import { a } from "../css-utils-lmkjeCdF.js";
+import { S as ScreenReaderOnly, A as Alert$1 } from "../Alert-1A6BG2aO.js";
+import { L } from "../Alert-1A6BG2aO.js";
 import { A as ArrowDown } from "../ArrowDown-d6bxUL0F.js";
 import { A as ArrowUp, O as OpenDiagonallyRight, C as CloseDiagonallyRight } from "../OpenDiagonallyRight-CGdCEXlF.js";
-import { M as MenuItem$1 } from "../MenuItem-GpTpLidu.js";
+import { M as MenuItem$1 } from "../MenuItem-DgHhHW-j.js";
 import "cartocolor";
 import { FixedSizeList } from "react-window";
 import { Controlled, UnControlled } from "react-codemirror2";
@@ -41,7 +41,6 @@ import { useIntl } from "react-intl";
 import { PickersDay as PickersDay$1 } from "@mui/x-date-pickers";
 import { TimePicker as TimePicker$1 } from "@mui/x-date-pickers/TimePicker";
 import { DateTimePicker as DateTimePicker$1 } from "@mui/x-date-pickers/DateTimePicker";
-import { S as Search } from "../Search-C7wkXu3f.js";
 import DOMPurify from "dompurify";
 const IndicatorIcon = styled(Box)({
   position: "absolute",
@@ -5040,279 +5039,6 @@ function _FilterDropdown({
 const FilterDropdown = forwardRef(
   _FilterDropdown
 );
-const SearchIcon = styled(Search, {
-  shouldForwardProp: (prop) => prop !== "minimized" && prop !== "disabled"
-})(
-  ({ theme, minimized, disabled }) => ({
-    cursor: !disabled && minimized ? "pointer" : "inherit",
-    width: ICON_SIZE_MEDIUM,
-    height: ICON_SIZE_MEDIUM,
-    path: {
-      fillOpacity: 1,
-      fill: disabled ? theme.palette.text.disabled : theme.palette.text.secondary
-    }
-  })
-);
-const ClearSearchIcon = styled(Cancel)(({ theme }) => ({
-  color: `${theme.palette.text.hint} !important`
-}));
-const LoadingSearchIcon = styled(CircularProgress)(({ theme }) => ({
-  svg: {
-    color: `${theme.palette.primary.main} !important`
-  }
-}));
-const SearchInputAdornment = styled(InputAdornment, {
-  shouldForwardProp: (prop) => prop !== "minimized" && prop !== "expanded"
-})(
-  ({ theme, minimized, expanded }) => ({
-    // Start adornment
-    "&.MuiInputAdornment-positionStart": {
-      marginLeft: minimized ? theme.spacing(1) : void 0
-    },
-    // End adornment
-    "&.MuiInputAdornment-positionEnd": {
-      minWidth: theme.spacing(4),
-      "&.MuiInputAdornment-sizeSmall": {
-        minWidth: theme.spacing(3)
-      }
-    },
-    ...expanded && !minimized && {
-      "&.MuiInputAdornment-root": {
-        minWidth: theme.spacing(9),
-        "&.MuiInputAdornment-sizeSmall": {
-          minWidth: theme.spacing(7)
-        }
-      }
-    }
-  })
-);
-const SearchFieldBase = styled(TextField, {
-  shouldForwardProp: (prop) => prop !== "minimized" && prop !== "isInputFocused" && prop !== "emphasis"
-})(({ theme, emphasis = "filled", minimized, isInputFocused }) => ({
-  "&.MuiTextField-root .MuiInputBase-root": {
-    paddingRight: theme.spacing(1),
-    transition: theme.transitions.create("width", {
-      easing: theme.transitions.easing.easeInOut,
-      duration: theme.transitions.duration.shortest
-    }),
-    "&.MuiInputBase-sizeSmall": {
-      paddingRight: theme.spacing(0.5)
-    },
-    "&:before": {
-      border: "none !important",
-      "&:hover": {
-        border: "none !important"
-      }
-    },
-    // Input
-    "& .MuiInputBase-input": {
-      pointerEvents: isInputFocused ? "auto" : "none"
-      // Fix Chrome scroll issue https://issues.chromium.org/issues/41245282
-    },
-    // Error state
-    "&.Mui-error": {
-      "&::after": {
-        borderColor: "transparent !important"
-      }
-    },
-    ...minimized && {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      padding: 0,
-      width: theme.spacing(6),
-      cursor: "pointer",
-      "& .MuiInputBase-input": {
-        display: "none"
-      },
-      "&.MuiInputBase-sizeSmall": {
-        width: theme.spacing(4)
-      }
-    }
-  },
-  // Variants
-  ...emphasis === "filled" && {
-    "& .MuiInputBase-root": {
-      // not disabled
-      "&:not(.Mui-disabled):hover": {
-        backgroundColor: `${theme.palette.action.hover} !important`
-      }
-    }
-  },
-  ...emphasis === "transparent" && {
-    "& .MuiInputBase-root": {
-      backgroundColor: "transparent !important",
-      "&:hover": {
-        backgroundColor: minimized ? `${theme.palette.action.hover} !important` : "transparent !important"
-      },
-      "&.Mui-disabled": {
-        backgroundColor: "transparent !important"
-      }
-    }
-  },
-  ...emphasis === "floating" && {
-    "& .MuiInputBase-root": {
-      backgroundColor: `${theme.palette.background.paper} !important`,
-      boxShadow: theme.shadows[1],
-      "&:hover": {
-        backgroundColor: minimized ? `${theme.palette.action.hover} !important` : `${theme.palette.background.paper} !important`
-      },
-      "&.Mui-disabled": {
-        backgroundColor: `${theme.palette.background.paper} !important`
-      }
-    }
-  }
-}));
-const SearchFieldEndAdornment = ({
-  disabled,
-  showClearButton = true,
-  loading,
-  size,
-  endAdornment,
-  clearButton,
-  clearButtonLabel,
-  onClear
-}) => {
-  if (!showClearButton && !endAdornment && !loading) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
-    SearchInputAdornment,
-    {
-      position: "end",
-      expanded: Boolean(endAdornment && showClearButton),
-      children: /* @__PURE__ */ jsxs(
-        Stack,
-        {
-          direction: "row",
-          spacing: 1,
-          sx: {
-            alignItems: "center"
-          },
-          children: [
-            loading ? /* @__PURE__ */ jsx(LoadingSearchIcon, { size: ICON_SIZE_MEDIUM }) : showClearButton ? clearButton ?? /* @__PURE__ */ jsx(
-              IconButton,
-              {
-                onClick: onClear,
-                size,
-                color: "default",
-                disabled,
-                tooltip: clearButtonLabel,
-                "aria-label": clearButtonLabel,
-                icon: /* @__PURE__ */ jsx(ClearSearchIcon, {})
-              }
-            ) : null,
-            endAdornment
-          ]
-        }
-      )
-    }
-  );
-};
-const SearchFieldStartAdornment = ({
-  minimized,
-  loading,
-  startAdornment,
-  disabled
-}) => {
-  return /* @__PURE__ */ jsx(SearchInputAdornment, { position: "start", minimized, children: loading && minimized ? /* @__PURE__ */ jsx(LoadingSearchIcon, { size: ICON_SIZE_MEDIUM }) : startAdornment || /* @__PURE__ */ jsx(SearchIcon, { disabled, minimized }) });
-};
-function _SearchField({
-  value,
-  defaultValue,
-  placeholder,
-  disabled,
-  minimized = false,
-  loading = false,
-  variant = "filled",
-  size = "small",
-  InputProps,
-  inputProps,
-  startAdornment,
-  endAdornment,
-  onFocus,
-  onBlur,
-  onChange,
-  onClick,
-  onResetSearch,
-  showClearButton = true,
-  clearButtonLabel,
-  clearButton,
-  ...otherProps
-}, ref) {
-  const [isInputFocused, setIsInputFocused] = useState(false);
-  const clearButtonVisibility = !disabled && Boolean(value ?? defaultValue) && showClearButton;
-  const clearButtonLabelValue = useTranslationWithFallback(
-    "c4r.button.clear",
-    clearButtonLabel
-  );
-  const handleFocus = (event) => {
-    setIsInputFocused(true);
-    onFocus == null ? void 0 : onFocus(event);
-  };
-  const handleBlur = (event) => {
-    setIsInputFocused(false);
-    onBlur == null ? void 0 : onBlur(event);
-  };
-  const handleClear = () => {
-    onResetSearch == null ? void 0 : onResetSearch();
-    onChange == null ? void 0 : onChange({ target: { value: "" } });
-  };
-  return /* @__PURE__ */ jsx(
-    SearchFieldBase,
-    {
-      value: minimized ? "" : value,
-      defaultValue,
-      placeholder: minimized ? "" : placeholder,
-      onChange,
-      onClick,
-      variant: "filled",
-      emphasis: variant,
-      size,
-      focused: false,
-      isInputFocused,
-      disabled,
-      minimized,
-      InputProps: {
-        onFocus: handleFocus,
-        onBlur: handleBlur,
-        startAdornment: /* @__PURE__ */ jsx(
-          SearchFieldStartAdornment,
-          {
-            minimized,
-            loading,
-            disabled,
-            startAdornment
-          }
-        ),
-        endAdornment: !minimized && /* @__PURE__ */ jsx(
-          SearchFieldEndAdornment,
-          {
-            disabled,
-            loading,
-            showClearButton: clearButtonVisibility,
-            clearButton,
-            clearButtonLabel: clearButtonLabelValue,
-            onClear: handleClear,
-            size,
-            endAdornment
-          }
-        ),
-        ...InputProps
-      },
-      inputProps: {
-        role: "searchbox",
-        ...inputProps
-      },
-      role: "search",
-      "data-variant": variant,
-      "data-name": "search-field",
-      ref,
-      ...otherProps
-    }
-  );
-}
-const SearchField = forwardRef(_SearchField);
 const MAX_WIDTH = 480;
 const SnackbarRoot = styled(Snackbar$1)(({ theme }) => ({
   bottom: theme.spacing(2),
@@ -6136,7 +5862,6 @@ export {
   MultipleSelectField,
   PasswordField,
   ScreenReaderOnly,
-  SearchField,
   SelectField,
   Snackbar,
   SplitButton,

package/dist/{css-utils-DjvM17Vb.cjs → css-utils-BNXxLCyb.cjs}

@@ -818,7 +818,6 @@ const en = {
       copy: "Copy",
       save: "Save",
       add: "Add",
-      clear: "Clear",
       showOptions: "Show options",
       hide: "Hide",
       show: "Show",
@@ -968,7 +967,6 @@ const es = {
       copy: "Copiar",
       save: "Guardar",
       add: "Añadir",
-      clear: "Borrar",
       showOptions: "Mostrar opciones",
       hide: "Ocultar",
       show: "Mostrar",
@@ -1116,7 +1114,6 @@ const id = {
       copy: "Salin",
       save: "Simpan",
       add: "Tambah",
-      clear: "Bersihkan",
       showOptions: "Tampilkan opsi",
       hide: "Sembunyikan",
       show: "Tampilkan",

package/dist/{css-utils-BHYA7By_.js → css-utils-lmkjeCdF.js}

@@ -817,7 +817,6 @@ const en = {
       copy: "Copy",
       save: "Save",
       add: "Add",
-      clear: "Clear",
       showOptions: "Show options",
       hide: "Hide",
       show: "Show",
@@ -967,7 +966,6 @@ const es = {
       copy: "Copiar",
       save: "Guardar",
       add: "Añadir",
-      clear: "Borrar",
       showOptions: "Mostrar opciones",
       hide: "Ocultar",
       show: "Mostrar",
@@ -1115,7 +1113,6 @@ const id = {
       copy: "Salin",
       save: "Simpan",
       add: "Tambah",
-      clear: "Bersihkan",
       showOptions: "Tampilkan opsi",
       hide: "Sembunyikan",
       show: "Tampilkan",