@pedidopago/ui 1.0.6

package/dist/components/SelectInput/components/OptionsArea/index.js

@@ -0,0 +1,142 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.OptionsArea = OptionsArea;
+
+var _react = require("react");
+
+var _OptionsArea = require("./OptionsArea");
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var onChangeSearchDebounce;
+
+function OptionsArea(_ref) {
+  var data = _ref.data,
+      scrollHandler = _ref.scrollHandler,
+      chooseOption = _ref.chooseOption,
+      inputAlert = _ref.inputAlert,
+      setShowOptionsArea = _ref.setShowOptionsArea,
+      AutoComplete = _ref.AutoComplete,
+      selectedOptions = _ref.selectedOptions,
+      onChangeSearch = _ref.onChangeSearch;
+
+  var _useState = (0, _react.useState)(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      chosenItem = _useState2[0],
+      setChosenItem = _useState2[1];
+
+  var _useState3 = (0, _react.useState)([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      dataToShow = _useState4[0],
+      setDataToShow = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      AutoCompleteState = _useState6[0],
+      setAutoCompleteState = _useState6[1];
+
+  var OptionRef = (0, _react.useRef)(null);
+  var AutoCompleteRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    if (data.length > 0) {
+      var selectedOptionsNames = selectedOptions.map(function (option) {
+        return option.name;
+      });
+      var newDataWithoutChosen = data.map(function (option) {
+        return !selectedOptionsNames.includes(option.name) ? option : [];
+      }).flat();
+      var newDataToShow = AutoComplete ? newDataWithoutChosen.map(function (option) {
+        return option.value.includes(AutoCompleteState) ? option : [];
+      }).flat() : newDataWithoutChosen;
+
+      if (AutoCompleteState.length > 0 && onChangeSearch) {
+        clearTimeout(onChangeSearchDebounce);
+        onChangeSearchDebounce = setTimeout(function () {
+          onChangeSearch(AutoCompleteState);
+        }, 200);
+      }
+
+      setDataToShow(newDataToShow);
+    }
+  }, [selectedOptions, data, AutoComplete, AutoCompleteState, onChangeSearch]);
+  (0, _react.useEffect)(function () {
+    setTimeout(function () {
+      var _OptionRef$current;
+
+      (_OptionRef$current = OptionRef.current) === null || _OptionRef$current === void 0 ? void 0 : _OptionRef$current.focus();
+    }, 20);
+  }, [chosenItem]);
+  var keyDownHandler = (0, _react.useCallback)(function (event) {
+    AutoCompleteRef.current !== document.activeElement && event.preventDefault();
+    var target = event.target;
+    var nextItem = target.nextElementSibling;
+    var prevItem = target.previousElementSibling;
+
+    switch (event.key) {
+      case 'ArrowDown':
+        nextItem && nextItem.focus();
+        break;
+
+      case 'ArrowUp':
+        prevItem && prevItem.focus();
+        break;
+
+      case 'Escape':
+        setShowOptionsArea(false);
+        break;
+
+      default:
+        break;
+    }
+  }, [setShowOptionsArea]);
+  return /*#__PURE__*/React.createElement(_OptionsArea.OptionsAreaWrapper, {
+    "data-testid": "options-area",
+    selectType: inputAlert,
+    itensLength: dataToShow.length,
+    onKeyDown: keyDownHandler,
+    onScroll: scrollHandler
+  }, AutoComplete && /*#__PURE__*/React.createElement(_OptionsArea.AutoCompleteInput, {
+    type: "text",
+    autoFocus: true,
+    ref: AutoCompleteRef,
+    value: AutoCompleteState,
+    selectType: inputAlert,
+    onChange: function onChange(e) {
+      return setAutoCompleteState(e.target.value);
+    }
+  }), dataToShow.map(function (option, index) {
+    return /*#__PURE__*/React.createElement(_OptionsArea.OptionItem, {
+      ref: !AutoComplete && index === chosenItem ? OptionRef : null,
+      onFocus: function onFocus() {
+        return setChosenItem(index);
+      },
+      onMouseEnter: function onMouseEnter() {
+        return setChosenItem(index);
+      },
+      "data-testid": "options-area--option-item",
+      active: index === chosenItem,
+      tabIndex: 0,
+      selectType: inputAlert,
+      onClick: function onClick(e) {
+        return chooseOption(option);
+      },
+      onKeyDown: function onKeyDown(e) {
+        return e.key === 'Enter' && chooseOption(option);
+      },
+      key: "".concat(option.name).concat(index)
+    }, option.value);
+  }), AutoCompleteState.length > 0 && dataToShow.length === 0 && /*#__PURE__*/React.createElement(_OptionsArea.Span, null, "Sem Resultados"));
+}

package/dist/components/SelectInput/components/SelectArea/ButtonsArea.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { IStyleProps } from '../../types';
+export declare const ButtonsArea: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Button: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+//# sourceMappingURL=ButtonsArea.d.ts.map

package/dist/components/SelectInput/components/SelectArea/ButtonsArea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonsArea.d.ts","sourceRoot":"","sources":["../../../../../src/components/SelectInput/components/SelectArea/ButtonsArea.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,eAAO,MAAM,WAAW;;;uHA+BvB,CAAC;AAEF,eAAO,MAAM,MAAM;;;mIAMlB,CAAC"}

package/dist/components/SelectInput/components/SelectArea/ButtonsArea.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonsArea = exports.Button = void 0;
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _react = require("@emotion/react");
+
+var _templateObject, _templateObject2, _templateObject3;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var ButtonsArea = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  min-width: 64px;\n\n  button {\n    align-items: center;\n\n    width: 24px;\n    height: 24px;\n    margin-left: 8px;\n    padding: 0;\n\n    background: none;\n    border: 0;\n    border-radius: 12px;\n    outline: 0;\n\n    cursor: none;\n\n    ", "\n\n    :focus {\n      box-shadow: 0 0 0 2px ", ";\n    }\n  }\n"])), function (_ref) {
+  var disabled = _ref.disabled;
+  return !disabled && (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        cursor: pointer;\n      "])));
+}, function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.colors.primary.focus;
+});
+
+exports.ButtonsArea = ButtonsArea;
+
+var Button = _styled.default.button(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: ", ";\n\n  svg {\n    color: ", ";\n  }\n"])), function (_ref3) {
+  var show = _ref3.show;
+  return show ? 'flex' : 'none';
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.colors.neutral.neutral3;
+});
+
+exports.Button = Button;

package/dist/components/SelectInput/components/SelectArea/Label.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { IStyleProps } from '../../types';
+export declare const Label: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
+//# sourceMappingURL=Label.d.ts.map

package/dist/components/SelectInput/components/SelectArea/Label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../../src/components/SelectInput/components/SelectArea/Label.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,eAAO,MAAM,KAAK;;;gIA2BjB,CAAC"}

package/dist/components/SelectInput/components/SelectArea/Label.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Label = void 0;
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _css = _interopRequireDefault(require("@emotion/css"));
+
+var _templateObject, _templateObject2;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var Label = _styled.default.label(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  box-sizing: border-box;\n\n  z-index: ", ";\n  color: ", ";\n  transition: all ease-in-out 0.2s;\n\n  font-weight: ", ";\n  font-size: ", ";\n\n  padding: 0 8px;\n\n  ", ";\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.zIndex.level1;
+}, function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.colorMode === 'dark' ? theme.colors.neutral.white : theme.colors.neutral.neutral5;
+}, function (_ref3) {
+  var theme = _ref3.theme;
+  return theme.fontWeight['500'];
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.fontSizes.xs;
+}, function (_ref5) {
+  var animate = _ref5.animate,
+      theme = _ref5.theme;
+  return animate ? (0, _css.default)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n          z-index: ", ";\n          position: absolute;\n          top: 0;\n          transform: translate(-12px, -11px) scale(0.8);\n          background-color: ", ";\n          height: 20px;\n        "])), theme.zIndex.level2, theme.colorMode === 'dark' ? theme.colors.neutral.black : theme.colors.neutral.white) : '';
+});
+
+exports.Label = Label;

package/dist/components/SelectInput/components/SelectArea/SelectAreaWrapper.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { IStyleProps } from '../../types';
+export declare const SelectAreaWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//# sourceMappingURL=SelectAreaWrapper.d.ts.map

package/dist/components/SelectInput/components/SelectArea/SelectAreaWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectAreaWrapper.d.ts","sourceRoot":"","sources":["../../../../../src/components/SelectInput/components/SelectArea/SelectAreaWrapper.ts"],"names":[],"mappings":";AAGA,OAAO,EAAa,WAAW,EAAE,MAAM,aAAa,CAAC;AAGrD,eAAO,MAAM,iBAAiB;;;uHAe7B,CAAC"}

package/dist/components/SelectInput/components/SelectArea/SelectAreaWrapper.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectAreaWrapper = void 0;
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _css = _interopRequireDefault(require("@emotion/css"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var SelectAreaWrapper = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  position: relative;\n\n  min-height: 56px;\n  padding: 8px 20px;\n\n  border: 2px solid ", ";\n  border-radius: 8px;\n\n  transition: all ease-in-out 0.2s;\n\n  ", "\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.colors.neutral.neutral2;
+}, InputWrapperDisabledTratamentFunction);
+
+exports.SelectAreaWrapper = SelectAreaWrapper;
+
+function InputWrapperDisabledTratamentFunction(_ref2) {
+  var disabled = _ref2.disabled,
+      selectType = _ref2.selectType,
+      theme = _ref2.theme;
+  var disableStyle = (0, _css.default)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    background-color: ", ";\n\n    label {\n      color: ", ";\n    }\n\n    div:nth-of-type(1) {\n      button {\n        background-color: ", ";\n        color: ", ";\n      }\n    }\n  "])), theme ? theme.colors.neutral.neutral1 : '', theme ? theme.colors.neutral.neutral3 : '', theme ? theme.colors.neutral.white : '', theme ? theme.colors.neutral.neutral3 : '');
+  var enableStyle = (0, _css.default)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    &:hover {\n      border-color: ", ";\n    }\n\n    &:focus-within {\n      border-color: ", ";\n      box-shadow: 0 0 0 2px ", ";\n    }\n\n    ", "\n  "])), selectType && theme ? theme.colors[selectType].blurred : theme && theme.colors.primary.hover, theme ? theme.colors.primary.focus : '', theme ? theme.colors.primary.disabled : '', alertControl(selectType, theme));
+  return disabled ? disableStyle : enableStyle;
+}
+
+function alertControl(selectType, theme) {
+  return (0, _css.default)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    background-color: ", ";\n    border-color: ", ";\n  "])), !!selectType && !!theme ? hexToRgba(theme.colors[selectType].default, 0.2) : '', !!selectType && !!theme ? theme.colors[selectType].default : '');
+}
+
+function hexToRgba(hex, alpha) {
+  hex = hex.substr(1);
+  var aRgbHex = hex.match(/.{1,2}/g);
+  if (!aRgbHex) return;
+  var aRgb = [parseInt(aRgbHex[0], 16), parseInt(aRgbHex[1], 16), parseInt(aRgbHex[2], 16)];
+  return "rgba(".concat(aRgb[0], ",").concat(aRgb[1], ",").concat(aRgb[2], ",").concat(alpha, ")");
+}

package/dist/components/SelectInput/components/SelectArea/SelectedOptionsArea.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { IStyleProps } from '../../types';
+export declare const SelectedOptionsArea: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const SelectedOption: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const SelectedOptionText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyleProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+//# sourceMappingURL=SelectedOptionsArea.d.ts.map

package/dist/components/SelectInput/components/SelectArea/SelectedOptionsArea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectedOptionsArea.d.ts","sourceRoot":"","sources":["../../../../../src/components/SelectInput/components/SelectArea/SelectedOptionsArea.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,eAAO,MAAM,mBAAmB;;;uHAI/B,CAAC;AAEF,eAAO,MAAM,cAAc;;;mIAyB1B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yHAI9B,CAAC"}

package/dist/components/SelectInput/components/SelectArea/SelectedOptionsArea.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectedOptionsArea = exports.SelectedOptionText = exports.SelectedOption = void 0;
+
+var _react = require("@emotion/react");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var SelectedOptionsArea = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-wrap: wrap;\n  flex: 1;\n"])));
+
+exports.SelectedOptionsArea = SelectedOptionsArea;
+
+var SelectedOption = _styled.default.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n\n  min-width: 73px;\n  height: 29px;\n  padding: 4px 8px;\n  border-radius: 6px;\n\n  margin: 4px;\n\n  transition: all ease-in-out 0.2s;\n\n  background-color: ", ";\n  border: 0;\n  color: ", ";\n\n  ", ";\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.colorMode === 'dark' ? theme.colors.neutral.neutral4 : theme.colors.neutral.neutral1;
+}, function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.colorMode === 'dark' ? theme.colors.neutral.white : theme.colors.neutral.neutral6;
+}, function (_ref3) {
+  var disabled = _ref3.disabled;
+  return !disabled && (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      cursor: pointer;\n    "])));
+});
+
+exports.SelectedOption = SelectedOption;
+
+var SelectedOptionText = _styled.default.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  margin-right: 8px;\n  font-weight: ", ";\n  font-size: ", ";\n"])), function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.fontWeight['400'];
+}, function (_ref5) {
+  var theme = _ref5.theme;
+  return theme.fontSizes.xxs;
+});
+
+exports.SelectedOptionText = SelectedOptionText;

package/dist/components/SelectInput/components/SelectArea/index.d.ts

@@ -0,0 +1,16 @@
+import { AlertType, SelectData } from '../../types';
+import { MouseEvent, ReactElement } from 'react';
+interface ISelectAreaProps {
+    disabled: boolean;
+    label?: string;
+    inputAlert?: AlertType;
+    dropDownIcon?: ReactElement;
+    selectedOptions: SelectData[];
+    removeSelectedOption: (e: MouseEvent<HTMLElement>, option: SelectData) => void;
+    setShowOptionsArea: (show: boolean) => void;
+    setSelectedOptions: (array: SelectData[]) => void;
+    toggleOptionsAreaView: (e: MouseEvent<HTMLElement>) => void;
+}
+export declare function SelectArea({ disabled, label, setShowOptionsArea, toggleOptionsAreaView, inputAlert, removeSelectedOption, selectedOptions, setSelectedOptions, dropDownIcon, }: ISelectAreaProps): JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/SelectInput/components/SelectArea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SelectInput/components/SelectArea/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAGjD,UAAU,gBAAgB;IACxB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,UAAU,EAAE,CAAC;IAC9B,oBAAoB,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC/E,kBAAkB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,kBAAkB,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAClD,qBAAqB,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAC7D;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,KAAqB,EACrB,kBAAkB,EAClB,qBAAqB,EACrB,UAAU,EACV,oBAAoB,EACpB,eAAe,EACf,kBAAkB,EAClB,YAAY,GACb,EAAE,gBAAgB,eAwClB"}

package/dist/components/SelectInput/components/SelectArea/index.js

@@ -0,0 +1,71 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectArea = SelectArea;
+
+var _SelectAreaWrapper = require("./SelectAreaWrapper");
+
+var _Label = require("./Label");
+
+var _SelectedOptionsArea = require("./SelectedOptionsArea");
+
+var _ButtonsArea = require("./ButtonsArea");
+
+var _Icon = _interopRequireDefault(require("../../../Icon"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function SelectArea(_ref) {
+  var disabled = _ref.disabled,
+      _ref$label = _ref.label,
+      label = _ref$label === void 0 ? 'SelectInput' : _ref$label,
+      setShowOptionsArea = _ref.setShowOptionsArea,
+      toggleOptionsAreaView = _ref.toggleOptionsAreaView,
+      inputAlert = _ref.inputAlert,
+      removeSelectedOption = _ref.removeSelectedOption,
+      selectedOptions = _ref.selectedOptions,
+      setSelectedOptions = _ref.setSelectedOptions,
+      dropDownIcon = _ref.dropDownIcon;
+  return /*#__PURE__*/React.createElement(_SelectAreaWrapper.SelectAreaWrapper, {
+    "data-testid": "select-area",
+    onKeyDown: function onKeyDown(e) {
+      return e.key === 'ArrowDown' && setShowOptionsArea(true);
+    },
+    disabled: disabled,
+    onClick: toggleOptionsAreaView,
+    selectType: inputAlert
+  }, /*#__PURE__*/React.createElement(_Label.Label, {
+    animate: selectedOptions.length > 0
+  }, label), /*#__PURE__*/React.createElement(_SelectedOptionsArea.SelectedOptionsArea, null, selectedOptions.map(function (option) {
+    return /*#__PURE__*/React.createElement(_SelectedOptionsArea.SelectedOption, {
+      "data-testid": "select-area--selected-option",
+      key: option.name,
+      disabled: disabled,
+      onClick: function onClick(e) {
+        return removeSelectedOption(e, option);
+      }
+    }, /*#__PURE__*/React.createElement(_SelectedOptionsArea.SelectedOptionText, null, option.value), /*#__PURE__*/React.createElement(_Icon.default, {
+      name: "x-circle",
+      size: "12px"
+    }));
+  })), /*#__PURE__*/React.createElement(_ButtonsArea.ButtonsArea, null, /*#__PURE__*/React.createElement(_ButtonsArea.Button, {
+    tabIndex: 0,
+    disabled: disabled,
+    show: selectedOptions.length > 0,
+    onClick: function onClick() {
+      return setSelectedOptions([]);
+    }
+  }, /*#__PURE__*/React.createElement(_Icon.default, {
+    name: "x",
+    size: "20px"
+  })), /*#__PURE__*/React.createElement(_ButtonsArea.Button, {
+    show: true,
+    tabIndex: 0,
+    disabled: disabled,
+    onClick: toggleOptionsAreaView
+  }, dropDownIcon || /*#__PURE__*/React.createElement(_Icon.default, {
+    name: "chevron-down"
+  }))));
+}

package/dist/components/SelectInput/components/index.d.ts

@@ -0,0 +1,4 @@
+export * from './InputWrapper';
+export * from './SelectArea';
+export * from './OptionsArea';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/SelectInput/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SelectInput/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}

package/dist/components/SelectInput/components/index.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _InputWrapper = require("./InputWrapper");
+
+Object.keys(_InputWrapper).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _InputWrapper[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _InputWrapper[key];
+    }
+  });
+});
+
+var _SelectArea = require("./SelectArea");
+
+Object.keys(_SelectArea).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SelectArea[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SelectArea[key];
+    }
+  });
+});
+
+var _OptionsArea = require("./OptionsArea");
+
+Object.keys(_OptionsArea).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _OptionsArea[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _OptionsArea[key];
+    }
+  });
+});

package/dist/components/SelectInput/index.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithoutRef, FC } from 'react';
+import { ISelectInputProps } from './types';
+declare type Props = ComponentPropsWithoutRef<'p'>;
+declare const SelectInput: FC<ISelectInputProps & Props>;
+export default SelectInput;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/SelectInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SelectInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,wBAAwB,EACxB,EAAE,EAOH,MAAM,OAAO,CAAC;AAIf,OAAO,EAAa,iBAAiB,EAAc,MAAM,SAAS,CAAC;AAEnE,aAAK,KAAK,GAAG,wBAAwB,CAAC,GAAG,CAAC,CAAC;AAI3C,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,GAAG,KAAK,CAgI9C,CAAC;AAEF,eAAe,WAAW,CAAC"}