@carto/ps-react-ui 0.0.2-alpha.17

package/dist/ps-react-ui.es.js

@@ -0,0 +1,1390 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import * as React$2 from "react";
+import React__default, { useRef, useState, useEffect } from "react";
+import { makeStyles, Box, Typography, IconButton, Button } from "@material-ui/core";
+import { withStyles as withStyles$1 } from "@material-ui/styles";
+import * as ReactDOM from "react-dom";
+function toVal(mix) {
+  var k, y, str = "";
+  if (typeof mix === "string" || typeof mix === "number") {
+    str += mix;
+  } else if (typeof mix === "object") {
+    if (Array.isArray(mix)) {
+      for (k = 0; k < mix.length; k++) {
+        if (mix[k]) {
+          if (y = toVal(mix[k])) {
+            str && (str += " ");
+            str += y;
+          }
+        }
+      }
+    } else {
+      for (k in mix) {
+        if (mix[k]) {
+          str && (str += " ");
+          str += k;
+        }
+      }
+    }
+  }
+  return str;
+}
+function clsx() {
+  var i = 0, tmp, x, str = "";
+  while (i < arguments.length) {
+    if (tmp = arguments[i++]) {
+      if (x = toVal(tmp)) {
+        str && (str += " ");
+        str += x;
+      }
+    }
+  }
+  return str;
+}
+function getAugmentedNamespace(n) {
+  if (n.__esModule)
+    return n;
+  var a = Object.defineProperty({}, "__esModule", { value: true });
+  Object.keys(n).forEach(function(k) {
+    var d = Object.getOwnPropertyDescriptor(n, k);
+    Object.defineProperty(a, k, d.get ? d : {
+      enumerable: true,
+      get: function() {
+        return n[k];
+      }
+    });
+  });
+  return a;
+}
+var DeleteOutline = {};
+var interopRequireDefault = { exports: {} };
+(function(module) {
+  function _interopRequireDefault2(obj) {
+    return obj && obj.__esModule ? obj : {
+      "default": obj
+    };
+  }
+  module.exports = _interopRequireDefault2, module.exports.__esModule = true, module.exports["default"] = module.exports;
+})(interopRequireDefault);
+var interopRequireWildcard = { exports: {} };
+var _typeof$1 = { exports: {} };
+(function(module) {
+  function _typeof2(obj) {
+    "@babel/helpers - typeof";
+    return module.exports = _typeof2 = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(obj2) {
+      return typeof obj2;
+    } : function(obj2) {
+      return obj2 && typeof Symbol == "function" && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2;
+    }, module.exports.__esModule = true, module.exports["default"] = module.exports, _typeof2(obj);
+  }
+  module.exports = _typeof2, module.exports.__esModule = true, module.exports["default"] = module.exports;
+})(_typeof$1);
+(function(module) {
+  var _typeof2 = _typeof$1.exports["default"];
+  function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function")
+      return null;
+    var cacheBabelInterop = /* @__PURE__ */ new WeakMap();
+    var cacheNodeInterop = /* @__PURE__ */ new WeakMap();
+    return (_getRequireWildcardCache = function _getRequireWildcardCache2(nodeInterop2) {
+      return nodeInterop2 ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+  }
+  function _interopRequireWildcard2(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+      return obj;
+    }
+    if (obj === null || _typeof2(obj) !== "object" && typeof obj !== "function") {
+      return {
+        "default": obj
+      };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+      return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for (var key in obj) {
+      if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+        if (desc && (desc.get || desc.set)) {
+          Object.defineProperty(newObj, key, desc);
+        } else {
+          newObj[key] = obj[key];
+        }
+      }
+    }
+    newObj["default"] = obj;
+    if (cache) {
+      cache.set(obj, newObj);
+    }
+    return newObj;
+  }
+  module.exports = _interopRequireWildcard2, module.exports.__esModule = true, module.exports["default"] = module.exports;
+})(interopRequireWildcard);
+var createSvgIcon$1 = {};
+function _extends() {
+  _extends = Object.assign || function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+function _typeof(obj) {
+  "@babel/helpers - typeof";
+  return _typeof = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(obj2) {
+    return typeof obj2;
+  } : function(obj2) {
+    return obj2 && typeof Symbol == "function" && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2;
+  }, _typeof(obj);
+}
+function isPlainObject(item) {
+  return item && _typeof(item) === "object" && item.constructor === Object;
+}
+function deepmerge(target, source) {
+  var options = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {
+    clone: true
+  };
+  var output = options.clone ? _extends({}, target) : target;
+  if (isPlainObject(target) && isPlainObject(source)) {
+    Object.keys(source).forEach(function(key) {
+      if (key === "__proto__") {
+        return;
+      }
+      if (isPlainObject(source[key]) && key in target) {
+        output[key] = deepmerge(target[key], source[key], options);
+      } else {
+        output[key] = source[key];
+      }
+    });
+  }
+  return output;
+}
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+function formatMuiErrorMessage(code) {
+  var url = "https://material-ui.com/production-error/?code=" + code;
+  for (var i = 1; i < arguments.length; i += 1) {
+    url += "&args[]=" + encodeURIComponent(arguments[i]);
+  }
+  return "Minified Material-UI error #" + code + "; visit " + url + " for the full message.";
+}
+function capitalize(string) {
+  if (typeof string !== "string") {
+    throw new Error(formatMuiErrorMessage(7));
+  }
+  return string.charAt(0).toUpperCase() + string.slice(1);
+}
+function createChainedFunction() {
+  for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) {
+    funcs[_key] = arguments[_key];
+  }
+  return funcs.reduce(function(acc, func) {
+    if (func == null) {
+      return acc;
+    }
+    return function chainedFunction() {
+      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+        args[_key2] = arguments[_key2];
+      }
+      acc.apply(this, args);
+      func.apply(this, args);
+    };
+  }, function() {
+  });
+}
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0)
+      continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null)
+    return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0)
+        continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key))
+        continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+var keys = ["xs", "sm", "md", "lg", "xl"];
+function createBreakpoints(breakpoints) {
+  var _breakpoints$values = breakpoints.values, values = _breakpoints$values === void 0 ? {
+    xs: 0,
+    sm: 600,
+    md: 960,
+    lg: 1280,
+    xl: 1920
+  } : _breakpoints$values, _breakpoints$unit = breakpoints.unit, unit = _breakpoints$unit === void 0 ? "px" : _breakpoints$unit, _breakpoints$step = breakpoints.step, step = _breakpoints$step === void 0 ? 5 : _breakpoints$step, other = _objectWithoutProperties(breakpoints, ["values", "unit", "step"]);
+  function up(key) {
+    var value = typeof values[key] === "number" ? values[key] : key;
+    return "@media (min-width:".concat(value).concat(unit, ")");
+  }
+  function down(key) {
+    var endIndex = keys.indexOf(key) + 1;
+    var upperbound = values[keys[endIndex]];
+    if (endIndex === keys.length) {
+      return up("xs");
+    }
+    var value = typeof upperbound === "number" && endIndex > 0 ? upperbound : key;
+    return "@media (max-width:".concat(value - step / 100).concat(unit, ")");
+  }
+  function between(start, end) {
+    var endIndex = keys.indexOf(end);
+    if (endIndex === keys.length - 1) {
+      return up(start);
+    }
+    return "@media (min-width:".concat(typeof values[start] === "number" ? values[start] : start).concat(unit, ") and ") + "(max-width:".concat((endIndex !== -1 && typeof values[keys[endIndex + 1]] === "number" ? values[keys[endIndex + 1]] : end) - step / 100).concat(unit, ")");
+  }
+  function only(key) {
+    return between(key, key);
+  }
+  function width(key) {
+    return values[key];
+  }
+  return _extends({
+    keys,
+    values,
+    up,
+    down,
+    between,
+    only,
+    width
+  }, other);
+}
+function createMixins(breakpoints, spacing, mixins) {
+  var _toolbar;
+  return _extends({
+    gutters: function gutters() {
+      var styles3 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+      console.warn(["Material-UI: theme.mixins.gutters() is deprecated.", "You can use the source of the mixin directly:", "\n      paddingLeft: theme.spacing(2),\n      paddingRight: theme.spacing(2),\n      [theme.breakpoints.up('sm')]: {\n        paddingLeft: theme.spacing(3),\n        paddingRight: theme.spacing(3),\n      },\n      "].join("\n"));
+      return _extends({
+        paddingLeft: spacing(2),
+        paddingRight: spacing(2)
+      }, styles3, _defineProperty({}, breakpoints.up("sm"), _extends({
+        paddingLeft: spacing(3),
+        paddingRight: spacing(3)
+      }, styles3[breakpoints.up("sm")])));
+    },
+    toolbar: (_toolbar = {
+      minHeight: 56
+    }, _defineProperty(_toolbar, "".concat(breakpoints.up("xs"), " and (orientation: landscape)"), {
+      minHeight: 48
+    }), _defineProperty(_toolbar, breakpoints.up("sm"), {
+      minHeight: 64
+    }), _toolbar)
+  }, mixins);
+}
+var common = {
+  black: "#000",
+  white: "#fff"
+};
+var common$1 = common;
+var grey = {
+  50: "#fafafa",
+  100: "#f5f5f5",
+  200: "#eeeeee",
+  300: "#e0e0e0",
+  400: "#bdbdbd",
+  500: "#9e9e9e",
+  600: "#757575",
+  700: "#616161",
+  800: "#424242",
+  900: "#212121",
+  A100: "#d5d5d5",
+  A200: "#aaaaaa",
+  A400: "#303030",
+  A700: "#616161"
+};
+var grey$1 = grey;
+var indigo = {
+  50: "#e8eaf6",
+  100: "#c5cae9",
+  200: "#9fa8da",
+  300: "#7986cb",
+  400: "#5c6bc0",
+  500: "#3f51b5",
+  600: "#3949ab",
+  700: "#303f9f",
+  800: "#283593",
+  900: "#1a237e",
+  A100: "#8c9eff",
+  A200: "#536dfe",
+  A400: "#3d5afe",
+  A700: "#304ffe"
+};
+var indigo$1 = indigo;
+var pink = {
+  50: "#fce4ec",
+  100: "#f8bbd0",
+  200: "#f48fb1",
+  300: "#f06292",
+  400: "#ec407a",
+  500: "#e91e63",
+  600: "#d81b60",
+  700: "#c2185b",
+  800: "#ad1457",
+  900: "#880e4f",
+  A100: "#ff80ab",
+  A200: "#ff4081",
+  A400: "#f50057",
+  A700: "#c51162"
+};
+var pink$1 = pink;
+var red = {
+  50: "#ffebee",
+  100: "#ffcdd2",
+  200: "#ef9a9a",
+  300: "#e57373",
+  400: "#ef5350",
+  500: "#f44336",
+  600: "#e53935",
+  700: "#d32f2f",
+  800: "#c62828",
+  900: "#b71c1c",
+  A100: "#ff8a80",
+  A200: "#ff5252",
+  A400: "#ff1744",
+  A700: "#d50000"
+};
+var red$1 = red;
+var orange = {
+  50: "#fff3e0",
+  100: "#ffe0b2",
+  200: "#ffcc80",
+  300: "#ffb74d",
+  400: "#ffa726",
+  500: "#ff9800",
+  600: "#fb8c00",
+  700: "#f57c00",
+  800: "#ef6c00",
+  900: "#e65100",
+  A100: "#ffd180",
+  A200: "#ffab40",
+  A400: "#ff9100",
+  A700: "#ff6d00"
+};
+var orange$1 = orange;
+var blue = {
+  50: "#e3f2fd",
+  100: "#bbdefb",
+  200: "#90caf9",
+  300: "#64b5f6",
+  400: "#42a5f5",
+  500: "#2196f3",
+  600: "#1e88e5",
+  700: "#1976d2",
+  800: "#1565c0",
+  900: "#0d47a1",
+  A100: "#82b1ff",
+  A200: "#448aff",
+  A400: "#2979ff",
+  A700: "#2962ff"
+};
+var blue$1 = blue;
+var green = {
+  50: "#e8f5e9",
+  100: "#c8e6c9",
+  200: "#a5d6a7",
+  300: "#81c784",
+  400: "#66bb6a",
+  500: "#4caf50",
+  600: "#43a047",
+  700: "#388e3c",
+  800: "#2e7d32",
+  900: "#1b5e20",
+  A100: "#b9f6ca",
+  A200: "#69f0ae",
+  A400: "#00e676",
+  A700: "#00c853"
+};
+var green$1 = green;
+function clamp(value) {
+  var min = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
+  var max = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 1;
+  return Math.min(Math.max(min, value), max);
+}
+function hexToRgb(color) {
+  color = color.substr(1);
+  var re = new RegExp(".{1,".concat(color.length >= 6 ? 2 : 1, "}"), "g");
+  var colors = color.match(re);
+  if (colors && colors[0].length === 1) {
+    colors = colors.map(function(n) {
+      return n + n;
+    });
+  }
+  return colors ? "rgb".concat(colors.length === 4 ? "a" : "", "(").concat(colors.map(function(n, index) {
+    return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1e3) / 1e3;
+  }).join(", "), ")") : "";
+}
+function hslToRgb(color) {
+  color = decomposeColor(color);
+  var _color = color, values = _color.values;
+  var h = values[0];
+  var s = values[1] / 100;
+  var l = values[2] / 100;
+  var a = s * Math.min(l, 1 - l);
+  var f = function f2(n) {
+    var k = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : (n + h / 30) % 12;
+    return l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+  };
+  var type = "rgb";
+  var rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];
+  if (color.type === "hsla") {
+    type += "a";
+    rgb.push(values[3]);
+  }
+  return recomposeColor({
+    type,
+    values: rgb
+  });
+}
+function decomposeColor(color) {
+  if (color.type) {
+    return color;
+  }
+  if (color.charAt(0) === "#") {
+    return decomposeColor(hexToRgb(color));
+  }
+  var marker = color.indexOf("(");
+  var type = color.substring(0, marker);
+  if (["rgb", "rgba", "hsl", "hsla"].indexOf(type) === -1) {
+    throw new Error(formatMuiErrorMessage(3, color));
+  }
+  var values = color.substring(marker + 1, color.length - 1).split(",");
+  values = values.map(function(value) {
+    return parseFloat(value);
+  });
+  return {
+    type,
+    values
+  };
+}
+function recomposeColor(color) {
+  var type = color.type;
+  var values = color.values;
+  if (type.indexOf("rgb") !== -1) {
+    values = values.map(function(n, i) {
+      return i < 3 ? parseInt(n, 10) : n;
+    });
+  } else if (type.indexOf("hsl") !== -1) {
+    values[1] = "".concat(values[1], "%");
+    values[2] = "".concat(values[2], "%");
+  }
+  return "".concat(type, "(").concat(values.join(", "), ")");
+}
+function getContrastRatio(foreground, background) {
+  var lumA = getLuminance(foreground);
+  var lumB = getLuminance(background);
+  return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
+}
+function getLuminance(color) {
+  color = decomposeColor(color);
+  var rgb = color.type === "hsl" ? decomposeColor(hslToRgb(color)).values : color.values;
+  rgb = rgb.map(function(val) {
+    val /= 255;
+    return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
+  });
+  return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));
+}
+function darken(color, coefficient) {
+  color = decomposeColor(color);
+  coefficient = clamp(coefficient);
+  if (color.type.indexOf("hsl") !== -1) {
+    color.values[2] *= 1 - coefficient;
+  } else if (color.type.indexOf("rgb") !== -1) {
+    for (var i = 0; i < 3; i += 1) {
+      color.values[i] *= 1 - coefficient;
+    }
+  }
+  return recomposeColor(color);
+}
+function lighten(color, coefficient) {
+  color = decomposeColor(color);
+  coefficient = clamp(coefficient);
+  if (color.type.indexOf("hsl") !== -1) {
+    color.values[2] += (100 - color.values[2]) * coefficient;
+  } else if (color.type.indexOf("rgb") !== -1) {
+    for (var i = 0; i < 3; i += 1) {
+      color.values[i] += (255 - color.values[i]) * coefficient;
+    }
+  }
+  return recomposeColor(color);
+}
+var light = {
+  text: {
+    primary: "rgba(0, 0, 0, 0.87)",
+    secondary: "rgba(0, 0, 0, 0.54)",
+    disabled: "rgba(0, 0, 0, 0.38)",
+    hint: "rgba(0, 0, 0, 0.38)"
+  },
+  divider: "rgba(0, 0, 0, 0.12)",
+  background: {
+    paper: common$1.white,
+    default: grey$1[50]
+  },
+  action: {
+    active: "rgba(0, 0, 0, 0.54)",
+    hover: "rgba(0, 0, 0, 0.04)",
+    hoverOpacity: 0.04,
+    selected: "rgba(0, 0, 0, 0.08)",
+    selectedOpacity: 0.08,
+    disabled: "rgba(0, 0, 0, 0.26)",
+    disabledBackground: "rgba(0, 0, 0, 0.12)",
+    disabledOpacity: 0.38,
+    focus: "rgba(0, 0, 0, 0.12)",
+    focusOpacity: 0.12,
+    activatedOpacity: 0.12
+  }
+};
+var dark = {
+  text: {
+    primary: common$1.white,
+    secondary: "rgba(255, 255, 255, 0.7)",
+    disabled: "rgba(255, 255, 255, 0.5)",
+    hint: "rgba(255, 255, 255, 0.5)",
+    icon: "rgba(255, 255, 255, 0.5)"
+  },
+  divider: "rgba(255, 255, 255, 0.12)",
+  background: {
+    paper: grey$1[800],
+    default: "#303030"
+  },
+  action: {
+    active: common$1.white,
+    hover: "rgba(255, 255, 255, 0.08)",
+    hoverOpacity: 0.08,
+    selected: "rgba(255, 255, 255, 0.16)",
+    selectedOpacity: 0.16,
+    disabled: "rgba(255, 255, 255, 0.3)",
+    disabledBackground: "rgba(255, 255, 255, 0.12)",
+    disabledOpacity: 0.38,
+    focus: "rgba(255, 255, 255, 0.12)",
+    focusOpacity: 0.12,
+    activatedOpacity: 0.24
+  }
+};
+function addLightOrDark(intent, direction, shade, tonalOffset) {
+  var tonalOffsetLight = tonalOffset.light || tonalOffset;
+  var tonalOffsetDark = tonalOffset.dark || tonalOffset * 1.5;
+  if (!intent[direction]) {
+    if (intent.hasOwnProperty(shade)) {
+      intent[direction] = intent[shade];
+    } else if (direction === "light") {
+      intent.light = lighten(intent.main, tonalOffsetLight);
+    } else if (direction === "dark") {
+      intent.dark = darken(intent.main, tonalOffsetDark);
+    }
+  }
+}
+function createPalette(palette) {
+  var _palette$primary = palette.primary, primary = _palette$primary === void 0 ? {
+    light: indigo$1[300],
+    main: indigo$1[500],
+    dark: indigo$1[700]
+  } : _palette$primary, _palette$secondary = palette.secondary, secondary = _palette$secondary === void 0 ? {
+    light: pink$1.A200,
+    main: pink$1.A400,
+    dark: pink$1.A700
+  } : _palette$secondary, _palette$error = palette.error, error = _palette$error === void 0 ? {
+    light: red$1[300],
+    main: red$1[500],
+    dark: red$1[700]
+  } : _palette$error, _palette$warning = palette.warning, warning = _palette$warning === void 0 ? {
+    light: orange$1[300],
+    main: orange$1[500],
+    dark: orange$1[700]
+  } : _palette$warning, _palette$info = palette.info, info = _palette$info === void 0 ? {
+    light: blue$1[300],
+    main: blue$1[500],
+    dark: blue$1[700]
+  } : _palette$info, _palette$success = palette.success, success = _palette$success === void 0 ? {
+    light: green$1[300],
+    main: green$1[500],
+    dark: green$1[700]
+  } : _palette$success, _palette$type = palette.type, type = _palette$type === void 0 ? "light" : _palette$type, _palette$contrastThre = palette.contrastThreshold, contrastThreshold = _palette$contrastThre === void 0 ? 3 : _palette$contrastThre, _palette$tonalOffset = palette.tonalOffset, tonalOffset = _palette$tonalOffset === void 0 ? 0.2 : _palette$tonalOffset, other = _objectWithoutProperties(palette, ["primary", "secondary", "error", "warning", "info", "success", "type", "contrastThreshold", "tonalOffset"]);
+  function getContrastText(background) {
+    var contrastText = getContrastRatio(background, dark.text.primary) >= contrastThreshold ? dark.text.primary : light.text.primary;
+    return contrastText;
+  }
+  var augmentColor = function augmentColor2(color) {
+    var mainShade = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 500;
+    var lightShade = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 300;
+    var darkShade = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : 700;
+    color = _extends({}, color);
+    if (!color.main && color[mainShade]) {
+      color.main = color[mainShade];
+    }
+    if (!color.main) {
+      throw new Error(formatMuiErrorMessage(4, mainShade));
+    }
+    if (typeof color.main !== "string") {
+      throw new Error(formatMuiErrorMessage(5, JSON.stringify(color.main)));
+    }
+    addLightOrDark(color, "light", lightShade, tonalOffset);
+    addLightOrDark(color, "dark", darkShade, tonalOffset);
+    if (!color.contrastText) {
+      color.contrastText = getContrastText(color.main);
+    }
+    return color;
+  };
+  var types = {
+    dark,
+    light
+  };
+  var paletteOutput = deepmerge(_extends({
+    common: common$1,
+    type,
+    primary: augmentColor(primary),
+    secondary: augmentColor(secondary, "A400", "A200", "A700"),
+    error: augmentColor(error),
+    warning: augmentColor(warning),
+    info: augmentColor(info),
+    success: augmentColor(success),
+    grey: grey$1,
+    contrastThreshold,
+    getContrastText,
+    augmentColor,
+    tonalOffset
+  }, types[type]), other);
+  return paletteOutput;
+}
+function round(value) {
+  return Math.round(value * 1e5) / 1e5;
+}
+function roundWithDeprecationWarning(value) {
+  return round(value);
+}
+var caseAllCaps = {
+  textTransform: "uppercase"
+};
+var defaultFontFamily = '"Roboto", "Helvetica", "Arial", sans-serif';
+function createTypography(palette, typography) {
+  var _ref = typeof typography === "function" ? typography(palette) : typography, _ref$fontFamily = _ref.fontFamily, fontFamily = _ref$fontFamily === void 0 ? defaultFontFamily : _ref$fontFamily, _ref$fontSize = _ref.fontSize, fontSize = _ref$fontSize === void 0 ? 14 : _ref$fontSize, _ref$fontWeightLight = _ref.fontWeightLight, fontWeightLight = _ref$fontWeightLight === void 0 ? 300 : _ref$fontWeightLight, _ref$fontWeightRegula = _ref.fontWeightRegular, fontWeightRegular = _ref$fontWeightRegula === void 0 ? 400 : _ref$fontWeightRegula, _ref$fontWeightMedium = _ref.fontWeightMedium, fontWeightMedium = _ref$fontWeightMedium === void 0 ? 500 : _ref$fontWeightMedium, _ref$fontWeightBold = _ref.fontWeightBold, fontWeightBold = _ref$fontWeightBold === void 0 ? 700 : _ref$fontWeightBold, _ref$htmlFontSize = _ref.htmlFontSize, htmlFontSize = _ref$htmlFontSize === void 0 ? 16 : _ref$htmlFontSize, allVariants = _ref.allVariants, pxToRem2 = _ref.pxToRem, other = _objectWithoutProperties(_ref, ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"]);
+  var coef = fontSize / 14;
+  var pxToRem = pxToRem2 || function(size) {
+    return "".concat(size / htmlFontSize * coef, "rem");
+  };
+  var buildVariant = function buildVariant2(fontWeight, size, lineHeight, letterSpacing, casing) {
+    return _extends({
+      fontFamily,
+      fontWeight,
+      fontSize: pxToRem(size),
+      lineHeight
+    }, fontFamily === defaultFontFamily ? {
+      letterSpacing: "".concat(round(letterSpacing / size), "em")
+    } : {}, casing, allVariants);
+  };
+  var variants = {
+    h1: buildVariant(fontWeightLight, 96, 1.167, -1.5),
+    h2: buildVariant(fontWeightLight, 60, 1.2, -0.5),
+    h3: buildVariant(fontWeightRegular, 48, 1.167, 0),
+    h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25),
+    h5: buildVariant(fontWeightRegular, 24, 1.334, 0),
+    h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15),
+    subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15),
+    subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1),
+    body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15),
+    body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15),
+    button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps),
+    caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4),
+    overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps)
+  };
+  return deepmerge(_extends({
+    htmlFontSize,
+    pxToRem,
+    round: roundWithDeprecationWarning,
+    fontFamily,
+    fontSize,
+    fontWeightLight,
+    fontWeightRegular,
+    fontWeightMedium,
+    fontWeightBold
+  }, variants), other, {
+    clone: false
+  });
+}
+var shadowKeyUmbraOpacity = 0.2;
+var shadowKeyPenumbraOpacity = 0.14;
+var shadowAmbientShadowOpacity = 0.12;
+function createShadow() {
+  return ["".concat(arguments.length <= 0 ? void 0 : arguments[0], "px ").concat(arguments.length <= 1 ? void 0 : arguments[1], "px ").concat(arguments.length <= 2 ? void 0 : arguments[2], "px ").concat(arguments.length <= 3 ? void 0 : arguments[3], "px rgba(0,0,0,").concat(shadowKeyUmbraOpacity, ")"), "".concat(arguments.length <= 4 ? void 0 : arguments[4], "px ").concat(arguments.length <= 5 ? void 0 : arguments[5], "px ").concat(arguments.length <= 6 ? void 0 : arguments[6], "px ").concat(arguments.length <= 7 ? void 0 : arguments[7], "px rgba(0,0,0,").concat(shadowKeyPenumbraOpacity, ")"), "".concat(arguments.length <= 8 ? void 0 : arguments[8], "px ").concat(arguments.length <= 9 ? void 0 : arguments[9], "px ").concat(arguments.length <= 10 ? void 0 : arguments[10], "px ").concat(arguments.length <= 11 ? void 0 : arguments[11], "px rgba(0,0,0,").concat(shadowAmbientShadowOpacity, ")")].join(",");
+}
+var shadows = ["none", createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];
+var shadows$1 = shadows;
+var shape = {
+  borderRadius: 4
+};
+var shape$1 = shape;
+function createUnarySpacing(theme) {
+  var themeSpacing = theme.spacing || 8;
+  if (typeof themeSpacing === "number") {
+    return function(abs) {
+      return themeSpacing * abs;
+    };
+  }
+  if (Array.isArray(themeSpacing)) {
+    return function(abs) {
+      return themeSpacing[abs];
+    };
+  }
+  if (typeof themeSpacing === "function") {
+    return themeSpacing;
+  }
+  return function() {
+    return void 0;
+  };
+}
+function createSpacing() {
+  var spacingInput = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 8;
+  if (spacingInput.mui) {
+    return spacingInput;
+  }
+  var transform = createUnarySpacing({
+    spacing: spacingInput
+  });
+  var spacing = function spacing2() {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    if (args.length === 0) {
+      return transform(1);
+    }
+    if (args.length === 1) {
+      return transform(args[0]);
+    }
+    return args.map(function(argument) {
+      if (typeof argument === "string") {
+        return argument;
+      }
+      var output = transform(argument);
+      return typeof output === "number" ? "".concat(output, "px") : output;
+    }).join(" ");
+  };
+  Object.defineProperty(spacing, "unit", {
+    get: function get() {
+      return spacingInput;
+    }
+  });
+  spacing.mui = true;
+  return spacing;
+}
+var easing = {
+  easeInOut: "cubic-bezier(0.4, 0, 0.2, 1)",
+  easeOut: "cubic-bezier(0.0, 0, 0.2, 1)",
+  easeIn: "cubic-bezier(0.4, 0, 1, 1)",
+  sharp: "cubic-bezier(0.4, 0, 0.6, 1)"
+};
+var duration = {
+  shortest: 150,
+  shorter: 200,
+  short: 250,
+  standard: 300,
+  complex: 375,
+  enteringScreen: 225,
+  leavingScreen: 195
+};
+function formatMs(milliseconds) {
+  return "".concat(Math.round(milliseconds), "ms");
+}
+var transitions = {
+  easing,
+  duration,
+  create: function create() {
+    var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : ["all"];
+    var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+    var _options$duration = options.duration, durationOption = _options$duration === void 0 ? duration.standard : _options$duration, _options$easing = options.easing, easingOption = _options$easing === void 0 ? easing.easeInOut : _options$easing, _options$delay = options.delay, delay = _options$delay === void 0 ? 0 : _options$delay;
+    _objectWithoutProperties(options, ["duration", "easing", "delay"]);
+    return (Array.isArray(props) ? props : [props]).map(function(animatedProp) {
+      return "".concat(animatedProp, " ").concat(typeof durationOption === "string" ? durationOption : formatMs(durationOption), " ").concat(easingOption, " ").concat(typeof delay === "string" ? delay : formatMs(delay));
+    }).join(",");
+  },
+  getAutoHeightDuration: function getAutoHeightDuration(height) {
+    if (!height) {
+      return 0;
+    }
+    var constant = height / 36;
+    return Math.round((4 + 15 * Math.pow(constant, 0.25) + constant / 5) * 10);
+  }
+};
+var zIndex = {
+  mobileStepper: 1e3,
+  speedDial: 1050,
+  appBar: 1100,
+  drawer: 1200,
+  modal: 1300,
+  snackbar: 1400,
+  tooltip: 1500
+};
+var zIndex$1 = zIndex;
+function createTheme() {
+  var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+  var _options$breakpoints = options.breakpoints, breakpointsInput = _options$breakpoints === void 0 ? {} : _options$breakpoints, _options$mixins = options.mixins, mixinsInput = _options$mixins === void 0 ? {} : _options$mixins, _options$palette = options.palette, paletteInput = _options$palette === void 0 ? {} : _options$palette, spacingInput = options.spacing, _options$typography = options.typography, typographyInput = _options$typography === void 0 ? {} : _options$typography, other = _objectWithoutProperties(options, ["breakpoints", "mixins", "palette", "spacing", "typography"]);
+  var palette = createPalette(paletteInput);
+  var breakpoints = createBreakpoints(breakpointsInput);
+  var spacing = createSpacing(spacingInput);
+  var muiTheme = deepmerge({
+    breakpoints,
+    direction: "ltr",
+    mixins: createMixins(breakpoints, spacing, mixinsInput),
+    overrides: {},
+    palette,
+    props: {},
+    shadows: shadows$1,
+    typography: createTypography(palette, typographyInput),
+    spacing,
+    shape: shape$1,
+    transitions,
+    zIndex: zIndex$1
+  }, other);
+  for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    args[_key - 1] = arguments[_key];
+  }
+  muiTheme = args.reduce(function(acc, argument) {
+    return deepmerge(acc, argument);
+  }, muiTheme);
+  return muiTheme;
+}
+var defaultTheme = createTheme();
+var defaultTheme$1 = defaultTheme;
+function withStyles(stylesOrCreator, options) {
+  return withStyles$1(stylesOrCreator, _extends({
+    defaultTheme: defaultTheme$1
+  }, options));
+}
+var styles = function styles2(theme) {
+  return {
+    root: {
+      userSelect: "none",
+      width: "1em",
+      height: "1em",
+      display: "inline-block",
+      fill: "currentColor",
+      flexShrink: 0,
+      fontSize: theme.typography.pxToRem(24),
+      transition: theme.transitions.create("fill", {
+        duration: theme.transitions.duration.shorter
+      })
+    },
+    colorPrimary: {
+      color: theme.palette.primary.main
+    },
+    colorSecondary: {
+      color: theme.palette.secondary.main
+    },
+    colorAction: {
+      color: theme.palette.action.active
+    },
+    colorError: {
+      color: theme.palette.error.main
+    },
+    colorDisabled: {
+      color: theme.palette.action.disabled
+    },
+    fontSizeInherit: {
+      fontSize: "inherit"
+    },
+    fontSizeSmall: {
+      fontSize: theme.typography.pxToRem(20)
+    },
+    fontSizeLarge: {
+      fontSize: theme.typography.pxToRem(35)
+    }
+  };
+};
+var SvgIcon = /* @__PURE__ */ React$2.forwardRef(function SvgIcon2(props, ref) {
+  var children = props.children, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? "inherit" : _props$color, _props$component = props.component, Component = _props$component === void 0 ? "svg" : _props$component, _props$fontSize = props.fontSize, fontSize = _props$fontSize === void 0 ? "medium" : _props$fontSize, htmlColor = props.htmlColor, titleAccess = props.titleAccess, _props$viewBox = props.viewBox, viewBox = _props$viewBox === void 0 ? "0 0 24 24" : _props$viewBox, other = _objectWithoutProperties(props, ["children", "classes", "className", "color", "component", "fontSize", "htmlColor", "titleAccess", "viewBox"]);
+  return /* @__PURE__ */ React$2.createElement(Component, _extends({
+    className: clsx(classes.root, className, color !== "inherit" && classes["color".concat(capitalize(color))], fontSize !== "default" && fontSize !== "medium" && classes["fontSize".concat(capitalize(fontSize))]),
+    focusable: "false",
+    viewBox,
+    color: htmlColor,
+    "aria-hidden": titleAccess ? void 0 : true,
+    role: titleAccess ? "img" : void 0,
+    ref
+  }, other), children, titleAccess ? /* @__PURE__ */ React$2.createElement("title", null, titleAccess) : null);
+});
+SvgIcon.muiName = "SvgIcon";
+var SvgIcon$1 = withStyles(styles, {
+  name: "MuiSvgIcon"
+})(SvgIcon);
+function createSvgIcon(path, displayName) {
+  var Component = function Component2(props, ref) {
+    return /* @__PURE__ */ React__default.createElement(SvgIcon$1, _extends({
+      ref
+    }, props), path);
+  };
+  Component.muiName = SvgIcon$1.muiName;
+  return /* @__PURE__ */ React__default.memo(/* @__PURE__ */ React__default.forwardRef(Component));
+}
+function debounce(func) {
+  var wait = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 166;
+  var timeout;
+  function debounced() {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    var that = this;
+    var later = function later2() {
+      func.apply(that, args);
+    };
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+  }
+  debounced.clear = function() {
+    clearTimeout(timeout);
+  };
+  return debounced;
+}
+function deprecatedPropType(validator, reason) {
+  {
+    return function() {
+      return null;
+    };
+  }
+}
+function isMuiElement(element, muiNames) {
+  return /* @__PURE__ */ React$2.isValidElement(element) && muiNames.indexOf(element.type.muiName) !== -1;
+}
+function ownerDocument(node) {
+  return node && node.ownerDocument || document;
+}
+function ownerWindow(node) {
+  var doc = ownerDocument(node);
+  return doc.defaultView || window;
+}
+function requirePropFactory(componentNameInError) {
+  {
+    return function() {
+      return null;
+    };
+  }
+}
+function setRef(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (ref) {
+    ref.current = value;
+  }
+}
+function unsupportedProp(props, propName, componentName, location, propFullName) {
+  {
+    return null;
+  }
+}
+function useControlled(_ref) {
+  var controlled = _ref.controlled, defaultProp = _ref.default;
+  _ref.name;
+  _ref.state;
+  var _React$useRef = React$2.useRef(controlled !== void 0), isControlled = _React$useRef.current;
+  var _React$useState = React$2.useState(defaultProp), valueState = _React$useState[0], setValue = _React$useState[1];
+  var value = isControlled ? controlled : valueState;
+  var setValueIfUncontrolled = React$2.useCallback(function(newValue) {
+    if (!isControlled) {
+      setValue(newValue);
+    }
+  }, []);
+  return [value, setValueIfUncontrolled];
+}
+var useEnhancedEffect = typeof window !== "undefined" ? React$2.useLayoutEffect : React$2.useEffect;
+function useEventCallback(fn) {
+  var ref = React$2.useRef(fn);
+  useEnhancedEffect(function() {
+    ref.current = fn;
+  });
+  return React$2.useCallback(function() {
+    return ref.current.apply(void 0, arguments);
+  }, []);
+}
+function useForkRef(refA, refB) {
+  return React$2.useMemo(function() {
+    if (refA == null && refB == null) {
+      return null;
+    }
+    return function(refValue) {
+      setRef(refA, refValue);
+      setRef(refB, refValue);
+    };
+  }, [refA, refB]);
+}
+function useId(idOverride) {
+  var _React$useState = React$2.useState(idOverride), defaultId = _React$useState[0], setDefaultId = _React$useState[1];
+  var id = idOverride || defaultId;
+  React$2.useEffect(function() {
+    if (defaultId == null) {
+      setDefaultId("mui-".concat(Math.round(Math.random() * 1e5)));
+    }
+  }, [defaultId]);
+  return id;
+}
+var hadKeyboardEvent = true;
+var hadFocusVisibleRecently = false;
+var hadFocusVisibleRecentlyTimeout = null;
+var inputTypesWhitelist = {
+  text: true,
+  search: true,
+  url: true,
+  tel: true,
+  email: true,
+  password: true,
+  number: true,
+  date: true,
+  month: true,
+  week: true,
+  time: true,
+  datetime: true,
+  "datetime-local": true
+};
+function focusTriggersKeyboardModality(node) {
+  var type = node.type, tagName = node.tagName;
+  if (tagName === "INPUT" && inputTypesWhitelist[type] && !node.readOnly) {
+    return true;
+  }
+  if (tagName === "TEXTAREA" && !node.readOnly) {
+    return true;
+  }
+  if (node.isContentEditable) {
+    return true;
+  }
+  return false;
+}
+function handleKeyDown(event) {
+  if (event.metaKey || event.altKey || event.ctrlKey) {
+    return;
+  }
+  hadKeyboardEvent = true;
+}
+function handlePointerDown() {
+  hadKeyboardEvent = false;
+}
+function handleVisibilityChange() {
+  if (this.visibilityState === "hidden") {
+    if (hadFocusVisibleRecently) {
+      hadKeyboardEvent = true;
+    }
+  }
+}
+function prepare(doc) {
+  doc.addEventListener("keydown", handleKeyDown, true);
+  doc.addEventListener("mousedown", handlePointerDown, true);
+  doc.addEventListener("pointerdown", handlePointerDown, true);
+  doc.addEventListener("touchstart", handlePointerDown, true);
+  doc.addEventListener("visibilitychange", handleVisibilityChange, true);
+}
+function isFocusVisible(event) {
+  var target = event.target;
+  try {
+    return target.matches(":focus-visible");
+  } catch (error) {
+  }
+  return hadKeyboardEvent || focusTriggersKeyboardModality(target);
+}
+function handleBlurVisible() {
+  hadFocusVisibleRecently = true;
+  window.clearTimeout(hadFocusVisibleRecentlyTimeout);
+  hadFocusVisibleRecentlyTimeout = window.setTimeout(function() {
+    hadFocusVisibleRecently = false;
+  }, 100);
+}
+function useIsFocusVisible() {
+  var ref = React$2.useCallback(function(instance) {
+    var node = ReactDOM.findDOMNode(instance);
+    if (node != null) {
+      prepare(node.ownerDocument);
+    }
+  }, []);
+  return {
+    isFocusVisible,
+    onBlurVisible: handleBlurVisible,
+    ref
+  };
+}
+var utils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  capitalize,
+  createChainedFunction,
+  createSvgIcon,
+  debounce,
+  deprecatedPropType,
+  isMuiElement,
+  ownerDocument,
+  ownerWindow,
+  requirePropFactory,
+  setRef,
+  unsupportedProp,
+  useControlled,
+  useEventCallback,
+  useForkRef,
+  unstable_useId: useId,
+  useIsFocusVisible
+}, Symbol.toStringTag, { value: "Module" }));
+var require$$0 = /* @__PURE__ */ getAugmentedNamespace(utils);
+(function(exports) {
+  Object.defineProperty(exports, "__esModule", {
+    value: true
+  });
+  Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function get() {
+      return _utils.createSvgIcon;
+    }
+  });
+  var _utils = require$$0;
+})(createSvgIcon$1);
+var _interopRequireDefault = interopRequireDefault.exports;
+var _interopRequireWildcard = interopRequireWildcard.exports;
+Object.defineProperty(DeleteOutline, "__esModule", {
+  value: true
+});
+var default_1 = DeleteOutline.default = void 0;
+var React$1 = _interopRequireWildcard(React__default);
+var _createSvgIcon = _interopRequireDefault(createSvgIcon$1);
+var _default = (0, _createSvgIcon.default)(/* @__PURE__ */ React$1.createElement("path", {
+  d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4z"
+}), "DeleteOutline");
+default_1 = DeleteOutline.default = _default;
+const useStyles = makeStyles(({ palette, spacing, typography }) => ({
+  inputFile: {
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    flex: 1,
+    height: spacing(7),
+    minHeight: spacing(7),
+    padding: spacing(0, 1, 0, 2),
+    backgroundColor: ({ variant }) => variant === "filled" ? palette.action.hover : palette.common.white,
+    border: "2px solid",
+    borderColor: ({ variant }) => variant === "filled" ? "transparent" : palette.action.disabled,
+    borderRadius: spacing(0.5),
+    color: palette.text.secondary,
+    transition: "border-color 0.25s ease, background-color 0.25s ease",
+    "&:hover": {
+      backgroundColor: ({ variant }) => variant === "filled" ? palette.action.selected : palette.common.white,
+      borderColor: ({ variant }) => variant === "filled" ? "transparent" : palette.text.primary
+    }
+  },
+  over: {
+    borderColor: () => palette.primary.main
+  },
+  files: {
+    borderColor: ({ variant }) => variant === "filled" ? "transparent" : palette.action.disabled
+  },
+  textWrapper: {
+    display: "flex",
+    flexDirection: "column",
+    position: "relative",
+    maxWidth: "calc(100% - 110px)",
+    height: "100%",
+    color: "inherit"
+  },
+  placeholder: {
+    position: "absolute",
+    top: "50%",
+    transform: "translateY(-50%)",
+    transition: "all 0.2s ease-in-out"
+  },
+  placeholderFiles: __spreadValues({
+    top: spacing(1),
+    transform: "translateY(0)",
+    opacity: 1
+  }, typography.caption),
+  filesText: {
+    position: "absolute",
+    top: spacing(4),
+    opacity: 0,
+    transition: "all 0.2s ease-in-out"
+  },
+  filesTextFiles: {
+    top: spacing(3),
+    opacity: 1
+  },
+  helperText: {
+    fontWeight: typography.body1.fontWeight
+  },
+  clearButton: {
+    marginTop: spacing(2),
+    marginRight: spacing(0.5),
+    color: palette.error.main
+  },
+  disabled: {
+    "& $inputFile": {
+      color: palette.text.disabled,
+      borderColor: () => palette.text.disabled,
+      backgroundColor: () => palette.action.hover,
+      pointerEvents: "none"
+    },
+    "& $helperText": {
+      color: palette.action.disabled
+    }
+  },
+  error: {
+    "& $inputFile": {
+      borderColor: () => palette.error.main
+    },
+    "& $files": {
+      color: palette.error.main
+    },
+    "& $helperText": {
+      color: palette.error.main
+    }
+  }
+}));
+function InputFile({
+  placeholder = "Upload file",
+  buttonText = "Browse",
+  multipleSummaryText = "files selected",
+  helperText,
+  accept = "application/JSON",
+  multiple = false,
+  disabled = false,
+  error = false,
+  variant = "outlined",
+  files = [],
+  onChange
+}) {
+  const classes = useStyles({ variant });
+  const uploadInputRef = useRef(null);
+  const [filesText, setFilesText] = useState("");
+  const [over, setOver] = useState(false);
+  useEffect(() => {
+    let txt = "";
+    if (files.length === 1) {
+      txt = files[0].name;
+    } else if (files.length > 1) {
+      txt = `${files.length} ${multipleSummaryText}`;
+    }
+    setFilesText(txt);
+  }, [files, multipleSummaryText]);
+  const handleBrowse = () => {
+    var _a;
+    (_a = uploadInputRef.current) == null ? void 0 : _a.click();
+  };
+  const handleDragOver = (event) => {
+    event.preventDefault();
+    setOver(true);
+  };
+  const handleDragLeave = (event) => {
+    event.preventDefault();
+    setOver(false);
+  };
+  const handleDrop = (event) => {
+    event.preventDefault();
+    const newFiles = [];
+    const items = event.dataTransfer.items;
+    for (let i = 0; i < items.length; i++) {
+      const file = items[i].getAsFile();
+      newFiles.push(file);
+    }
+    setOver(false);
+    onChange(newFiles);
+  };
+  const handleFiles = (event) => {
+    const newFiles = Array.from(event.target.files);
+    onChange(newFiles);
+  };
+  const clear = () => {
+    onChange([]);
+  };
+  return /* @__PURE__ */ React.createElement(Box, {
+    className: clsx({ [classes.error]: error }, { [classes.disabled]: disabled })
+  }, /* @__PURE__ */ React.createElement(Box, {
+    className: clsx(classes.inputFile, { [classes.over]: over }, { [classes.files]: filesText }),
+    onDragOver: handleDragOver,
+    onDragLeave: handleDragLeave,
+    onDrop: handleDrop
+  }, /* @__PURE__ */ React.createElement(Box, {
+    className: classes.textWrapper
+  }, /* @__PURE__ */ React.createElement(Typography, {
+    variant: "body1",
+    color: "inherit",
+    noWrap: true,
+    className: clsx(classes.placeholder, {
+      [classes.placeholderFiles]: filesText
+    })
+  }, placeholder), /* @__PURE__ */ React.createElement(Typography, {
+    variant: "body1",
+    color: "textPrimary",
+    noWrap: true,
+    className: clsx(classes.filesText, {
+      [classes.filesTextFiles]: filesText
+    })
+  }, filesText)), files.length ? /* @__PURE__ */ React.createElement(IconButton, {
+    size: "small",
+    className: classes.clearButton,
+    onClick: clear
+  }, /* @__PURE__ */ React.createElement(default_1, null)) : /* @__PURE__ */ React.createElement(Button, {
+    variant: "text",
+    color: "primary",
+    disabled,
+    onClick: handleBrowse
+  }, buttonText), /* @__PURE__ */ React.createElement("input", {
+    ref: uploadInputRef,
+    style: { display: "none" },
+    type: "file",
+    accept,
+    multiple,
+    disabled,
+    onChange: handleFiles
+  })), helperText && /* @__PURE__ */ React.createElement(Box, {
+    mt: 0.5,
+    ml: 2
+  }, /* @__PURE__ */ React.createElement(Typography, {
+    variant: "caption",
+    color: "textSecondary",
+    className: classes.helperText
+  }, helperText)));
+}
+export { InputFile };