@bbl-digital/snorre 4.2.82 → 4.2.83

package/esm/core/SearchSelect/index.js

@@ -1,104 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _IconChevronDown = _interopRequireDefault(require("../../icons/General/IconChevronDown"));
-var _Button = _interopRequireDefault(require("../Button"));
-var _Input = _interopRequireDefault(require("../Input"));
-var _List = _interopRequireDefault(require("../List"));
-var _Select = require("../Select");
-var _useSelectSearch = _interopRequireDefault(require("./hooks/useSelectSearch"));
-var _styles = require("./styles");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/** @jsxImportSource @emotion/react */
-
-const SelectSearch = props => {
-  const ref = (0, _react.useRef)(null);
-  const inputRef = (0, _react.useRef)(null);
-  const {
-    open,
-    values,
-    search,
-    setSearch,
-    setOpen
-  } = (0, _useSelectSearch.default)(props);
-  const handleClickOutside = e => {
-    const node = ref.current;
-    if (node && node.contains(e.target)) return;
-    setOpen(false);
-    setSearch('');
-  };
-  (0, _react.useEffect)(() => {
-    if (open) {
-      document.addEventListener('mousedown', handleClickOutside);
-      return;
-    }
-    document.removeEventListener('mousedown', handleClickOutside);
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [open, ref]);
-  (0, _react.useEffect)(() => {
-    if (open && inputRef.current) {
-      inputRef?.current?.focus();
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [inputRef?.current, open]);
-  const handleOnClick = () => {
-    setOpen(!open);
-    if (!open) setSearch('');
-  };
-  const handleOnItemClick = item => () => {
-    props.onChange(item);
-    setOpen(false);
-  };
-  const getDisplayedValue = selected => {
-    const item = values.find(v => v[props.keyName || 'id'] === selected);
-    if (!item) return null;
-    return props.createLabelName?.(item);
-  };
-  return (0, _jsxRuntime.jsxs)(_styles.Wrapper, {
-    ref: ref,
-    css: () => [props.type === 'opacity08' && _styles.styles.opacity08],
-    children: [props.label && (0, _jsxRuntime.jsx)(_styles.StyledLabel, {
-      children: props.label
-    }), (0, _jsxRuntime.jsx)(_Button.default, {
-      nostyle: true,
-      afterIcon: (0, _jsxRuntime.jsx)(_IconChevronDown.default, {
-        flipVertical: open,
-        size: 14
-      }),
-      onClick: handleOnClick,
-      trackingName: props.trackingName,
-      trackingEvent: props.trackingEvent,
-      children: props?.createLabelName && getDisplayedValue(props.selectedValue) || props.selectedValue || props.defaultValue || ''
-    }), (0, _jsxRuntime.jsx)(_styles.OptionsWrapper, {
-      children: open ? (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [(0, _jsxRuntime.jsx)(_Input.default, {
-          ref: inputRef,
-          height: "36px",
-          type: "search",
-          highlight: true,
-          placeholder: props.inputPlaceholder || '',
-          value: search,
-          onChange: e => setSearch(e.target.value)
-        }), (0, _jsxRuntime.jsx)(_styles.ListWrapper, {
-          children: (0, _jsxRuntime.jsx)(_List.default, {
-            children: values.map(item => (0, _jsxRuntime.jsx)(_Select.Option, {
-              onChange: handleOnItemClick(item),
-              children: props.createLabelName?.(item) || item[props.labelName || 'label']
-            }, item[item.keyName || 'id']))
-          })
-        })]
-      }) : null
-    })]
-  });
-};
-var _default = exports.default = SelectSearch;

package/esm/core/SearchSelect/interface/IProps.js

@@ -1,5 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});

package/esm/core/SearchSelect/styles.js

@@ -1,72 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.styles = exports.Wrapper = exports.StyledLabel = exports.OptionsWrapper = exports.ListWrapper = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = require("@emotion/react");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-const StyledLabel = exports.StyledLabel = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
-  target: "e141unqb3"
-} : {
-  target: "e141unqb3",
-  label: "StyledLabel"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1ge8ozm",
-  styles: "line-height:22px;font-size:1em;font-weight:600;margin-bottom:4px"
-} : {
-  name: "1ge8ozm",
-  styles: "line-height:22px;font-size:1em;font-weight:600;margin-bottom:4px",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const Wrapper = exports.Wrapper = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
-  target: "e141unqb2"
-} : {
-  target: "e141unqb2",
-  label: "Wrapper"
-})(process.env.NODE_ENV === "production" ? {
-  name: "fnf23l",
-  styles: "position:relative;ul{border-top:none;}"
-} : {
-  name: "fnf23l",
-  styles: "position:relative;ul{border-top:none;}",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const OptionsWrapper = exports.OptionsWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e141unqb1"
-} : {
-  target: "e141unqb1",
-  label: "OptionsWrapper"
-})(process.env.NODE_ENV === "production" ? {
-  name: "zje6v4",
-  styles: "position:absolute;left:0;right:0;min-width:150px;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.1);z-index:1000;border-radius:10px;overflow:hidden;background:#fff;width:max-content;@media (max-width: 768px){width:auto;}"
-} : {
-  name: "zje6v4",
-  styles: "position:absolute;left:0;right:0;min-width:150px;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.1);z-index:1000;border-radius:10px;overflow:hidden;background:#fff;width:max-content;@media (max-width: 768px){width:auto;}",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const ListWrapper = exports.ListWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e141unqb0"
-} : {
-  target: "e141unqb0",
-  label: "ListWrapper"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1xlkuzg",
-  styles: "max-height:10em;overflow-x:hidden;overflow-y:auto"
-} : {
-  name: "1xlkuzg",
-  styles: "max-height:10em;overflow-x:hidden;overflow-y:auto",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const styles = exports.styles = {
-  opacity08: process.env.NODE_ENV === "production" ? {
-    name: "eoqxuw",
-    styles: "display:flex;justify-content:space-between;align-items:center;padding:0 0.5em;height:39px;background-color:rgba(216, 216, 216, 0.08);border:1px solid rgba(255, 255, 255, 0.24);border-radius:5px;color:white;&>button>span{color:white;font-weight:400;}button svg polygon{fill:white;}button{width:100%;}button+div{top:40px;}"
-  } : {
-    name: "6fnvbj-opacity08",
-    styles: "display:flex;justify-content:space-between;align-items:center;padding:0 0.5em;height:39px;background-color:rgba(216, 216, 216, 0.08);border:1px solid rgba(255, 255, 255, 0.24);border-radius:5px;color:white;&>button>span{color:white;font-weight:400;}button svg polygon{fill:white;}button{width:100%;}button+div{top:40px;};label:opacity08;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-  }
-};

package/esm/core/Select/Option.js

@@ -1,41 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _styles = require("./styles");
-var _Item = _interopRequireDefault(require("../List/Item"));
-var _Button = _interopRequireDefault(require("../Button"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/** @jsxImportSource @emotion/react */
-
-const Option = ({
-  trackingEvent,
-  trackingName,
-  ...props
-}) => {
-  const onChange = () => {
-    if (props.onChange && !props.disabled) {
-      props.onChange({
-        value: props.value
-      });
-    }
-  };
-  return (0, _jsxRuntime.jsx)(_Item.default, {
-    children: (0, _jsxRuntime.jsx)(_Button.default, {
-      nostyle: true,
-      css: (0, _styles.optionButton)(props.indent),
-      onClick: onChange,
-      trackingEvent: trackingEvent,
-      trackingName: trackingName,
-      disabled: props.disabled,
-      children: _react.default.Children.map(props.children, child => {
-        return child;
-      })
-    }, props.key)
-  });
-};
-var _default = exports.default = Option;

package/esm/core/Select/Select.stories.js

@@ -1,252 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.WithInfoButton = exports.Width = exports.SelectNative = exports.SelectDefault = exports.Primary10 = exports.OptionsWidth = exports.Opacity08 = exports.MaxHeight = exports.Input = exports.Icon = exports.Disabled = void 0;
-var _addonActions = require("@storybook/addon-actions");
-var _ = _interopRequireDefault(require("."));
-var _Option = _interopRequireDefault(require("./Option"));
-var _IconTypeOfBuilding = _interopRequireDefault(require("../../icons/General/IconTypeOfBuilding"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Core/Select',
-  component: _.default
-};
-const SelectDefault = exports.SelectDefault = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Sorter etter",
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Select'
-};
-const Width = exports.Width = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Sorter etter",
-    type: "primary10",
-    width: "400px",
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Width'
-};
-const OptionsWidth = exports.OptionsWidth = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Sorter etter",
-    optionsWidth: "400px",
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Options width'
-};
-const SelectNative = exports.SelectNative = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Sorter etter",
-    native: true,
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Select - native'
-};
-const Input = exports.Input = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Velg en",
-    label: "Label",
-    input: true,
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Input'
-};
-const Icon = exports.Icon = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Velg en",
-    label: "Label",
-    icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconTypeOfBuilding.default, {
-      primary: true
-    }),
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Icon'
-};
-const Primary10 = exports.Primary10 = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Background with 10 opacity",
-    type: "primary10",
-    onChange: (0, _addonActions.action)('onChange'),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'Primary10'
-};
-const Opacity08 = exports.Opacity08 = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    style: {
-      backgroundColor: '#04112D',
-      padding: '2em'
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-      text: "Opacity08",
-      type: "opacity08",
-      onChange: (0, _addonActions.action)('onChange'),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        disabled: true,
-        value: "1",
-        children: "Option 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "2",
-        children: "Option 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "3",
-        children: "Option 3"
-      })]
-    })
-  }),
-  name: 'Opacity08'
-};
-const MaxHeight = exports.MaxHeight = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    style: {
-      backgroundColor: '#04112D',
-      padding: '2em'
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-      text: "maxHeight",
-      type: "opacity08",
-      onChange: (0, _addonActions.action)('onChange'),
-      maxHeight: "100px",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        disabled: true,
-        value: "1",
-        children: "Option 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "2",
-        children: "Option 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "3",
-        children: "Option 3"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "3",
-        children: "Option 4"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "3",
-        children: "Option 5"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "3",
-        children: "Option 6"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-        value: "3",
-        children: "Option 7"
-      })]
-    })
-  }),
-  name: 'MaxHeight'
-};
-const Disabled = exports.Disabled = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Im disabled",
-    input: true,
-    disabled: true,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    })]
-  }),
-  name: 'Disabled'
-};
-const WithInfoButton = exports.WithInfoButton = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    text: "Velg en",
-    label: "With info button",
-    input: true,
-    onChange: (0, _addonActions.action)('onChange'),
-    info: "Ullamco nisi excepteur quis ut sint ipsum deserunt dolor. Nulla cillum exercitation labore fugiat nulla do duis irure dolore.",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      disabled: true,
-      value: "1",
-      children: "Option 1"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "2",
-      children: "Option 2"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
-      value: "3",
-      children: "Option 3"
-    })]
-  }),
-  name: 'With Info Button'
-};

package/esm/core/Select/index.js

@@ -1,156 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Option", {
-  enumerable: true,
-  get: function () {
-    return _Option.default;
-  }
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _Option = _interopRequireDefault(require("./Option"));
-var _styles = require("./styles");
-var _InfoButton = _interopRequireDefault(require("../InfoButton"));
-var _IconHelp = _interopRequireDefault(require("../../icons/General/IconHelp"));
-var _Button = _interopRequireDefault(require("../Button"));
-var _IconChevronDown = _interopRequireDefault(require("../../icons/General/IconChevronDown"));
-var _List = _interopRequireDefault(require("../List"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/** @jsxImportSource @emotion/react */
-
-const Select = ({
-  input,
-  icon,
-  type = 'default',
-  native,
-  optionsWidth,
-  width,
-  maxHeight,
-  focus,
-  customOpenstyle,
-  customStyle,
-  trackingEvent,
-  trackingName,
-  disabled,
-  label,
-  closeKey,
-  className,
-  info,
-  infoPlacement = 'left',
-  ...props
-}) => {
-  const ref = /*#__PURE__*/(0, _react.createRef)();
-  const [open, toggleOpen] = (0, _react.useState)(false);
-  const onClick = function () {
-    toggleOpen(!open && !disabled);
-    props.onOpenChange?.(!open);
-  };
-  const handleOpen = open => {
-    toggleOpen(open);
-    props.onOpenChange?.(open);
-  };
-  (0, _react.useEffect)(() => {
-    if (closeKey) {
-      handleOpen(false);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [closeKey]);
-  (0, _react.useEffect)(() => {
-    const handleClickOutside = e => {
-      const node = ref.current;
-      if (node && node.contains(e.target)) {
-        return;
-      }
-      handleOpen(false);
-    };
-    if (open) {
-      const firstOption = ref.current?.querySelector('button, a, [tabindex]');
-      if (firstOption) {
-        firstOption.focus();
-      }
-      document.addEventListener('mousedown', handleClickOutside);
-    } else {
-      document.removeEventListener('mousedown', handleClickOutside);
-    }
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-  }, [open, ref]);
-  const onChange = value => {
-    if (props.onChange && !disabled) {
-      props.onChange(value);
-      handleOpen(false);
-    }
-  };
-  const Label = (0, _jsxRuntime.jsx)(_styles.StyledLabel, {
-    withInfo: Boolean(info),
-    children: label
-  });
-  const NonNative = (0, _jsxRuntime.jsxs)(_styles.SelectWrapper, {
-    ref: ref,
-    className: className,
-    css: theme => [_styles.styles.default, input && _styles.styles.input(theme), input && open && _styles.styles.open(theme), type === 'primary10' && _styles.styles.primary10(theme), icon && _styles.styles.withIcon, type === 'opacity08' && _styles.styles.opacity08(theme), width && _styles.styles.width(width), maxHeight && _styles.styles.maxHeight(maxHeight), customStyle && customStyle, open && customOpenstyle && customOpenstyle, disabled && _styles.styles.disabled(theme)],
-    "aria-expanded": open,
-    "aria-label": label ? label : 'Select',
-    children: [input && label && Label, info && (0, _jsxRuntime.jsx)("span", {
-      css: _styles.styles.infoButton,
-      children: (0, _jsxRuntime.jsx)(_InfoButton.default, {
-        icon: (0, _jsxRuntime.jsx)(_IconHelp.default, {
-          primary: true
-        }),
-        place: infoPlacement,
-        children: info
-      })
-    }), (0, _jsxRuntime.jsx)(_Button.default, {
-      nostyle: true,
-      afterIcon: (0, _jsxRuntime.jsx)(_IconChevronDown.default, {
-        flipVertical: open,
-        size: 14
-      }),
-      onClick: onClick,
-      beforeIcon: icon,
-      autoFocus: focus,
-      trackingName: trackingName,
-      trackingEvent: trackingEvent,
-      tabIndex: disabled ? -1 : undefined,
-      children: props.selectedValue ? props.selectedValue : props.text || ''
-    }), (0, _jsxRuntime.jsx)(_styles.OptionsWrapper, {
-      css: [input && _styles.styles.inputstyle(!!label), optionsWidth && _styles.styles.optionsWidth(optionsWidth), process.env.NODE_ENV === "production" ? "" : ";label:NonNative;"],
-      children: open ? (0, _jsxRuntime.jsx)(_List.default, {
-        selectList: true,
-        children: props.children.filter(x => x).map((child, key) => {
-          if (!child) {
-            return null;
-          }
-          return /*#__PURE__*/_react.default.cloneElement(child, {
-            onChange: onChange,
-            key
-          });
-        })
-      }) : null
-    })]
-  });
-  const Native = (0, _jsxRuntime.jsx)("select", {
-    className: className,
-    css: theme => [_styles.styles.default, input && _styles.styles.input(theme), input && open && _styles.styles.open(theme), type === 'primary10' && _styles.styles.primary10(theme), icon && _styles.styles.withIcon],
-    value: props.selectedValue ? props.selectedValue : props.text || '',
-    onChange: e => onChange(e.target.value),
-    children: props.children.filter(x => x).map((child, key) => {
-      if (!child) {
-        return null;
-      }
-      return (0, _jsxRuntime.jsx)("option", {
-        value: child.props.value,
-        children: child.props.children
-      }, key);
-    })
-  });
-  return native ? Native : NonNative;
-};
-var _default = exports.default = Select;