@coorpacademy/components 10.1.1 → 10.1.5

package/lib/molecule/select-multiple/index.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = void 0;
+exports.default = exports.useChoices = void 0;
 
 var _set2 = _interopRequireDefault(require("lodash/fp/set"));
 
@@ -15,7 +15,7 @@ var _pipe2 = _interopRequireDefault(require("lodash/fp/pipe"));
 
 var _map2 = _interopRequireDefault(require("lodash/fp/map"));
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -31,162 +31,136 @@ var _getClassState = _interopRequireDefault(require("../../util/get-class-state"
 
 var _style = _interopRequireDefault(require("./style.css"));
 
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 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 _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 const themeStyle = {
   setup: _style.default.setup,
   cockpit: _style.default.cockpit,
   sidebar: _style.default.sidebar
 };
 
-class SelectMultiple extends _react.default.Component {
-  constructor(props) {
-    super(props);
-
-    _defineProperty(this, "handleOnClick", e => {
-      const {
-        opened
-      } = this.state;
-      e.preventDefault();
-      e.stopPropagation();
-      this.setState({
-        opened: !opened
-      });
-    });
-
-    _defineProperty(this, "closeHandle", e => {
-      if (this.node && !this.node.contains(e.target)) {
-        this.setState({
-          opened: false
-        });
-      }
-    });
-
-    _defineProperty(this, "handleChange", choice => {
-      const {
-        multiple,
-        onChange
-      } = this.props; // if multiple prop is turned on
-      // we return all selected choices
-
-      if (multiple) {
-        this.choices = choice;
-        return onChange(this.choices);
-      }
-
-      return onChange(choice);
-    });
-
-    this.state = {
-      opened: false
-    };
-    this.node = null;
+const useChoices = options => {
+  const choicesRef = (0, _react.useRef)(options);
 
-    this.setNode = el => this.node = el;
-  }
+  const getChoices = () => {
+    return choicesRef.current;
+  };
 
-  componentDidMount() {
-    if (typeof document !== 'undefined') {
-      document.addEventListener('click', this.closeHandle);
-      document.addEventListener('touchstart', this.closeHandle);
-    }
-  }
+  const setChoices = choice => {
+    const choices = (0, _set2.default)(`[${choice.i}].selected`, !choice.selected, getChoices());
+    choicesRef.current = choices.filter(c => c.selected);
+  };
+
+  return [getChoices, setChoices];
+};
 
-  componentWillUnmount() {
-    if (typeof document !== 'undefined') {
-      document.removeEventListener('click', this.closeHandle);
-      document.removeEventListener('touchstart', this.closeHandle);
+exports.useChoices = useChoices;
+
+const SelectMultiple = ({
+  title,
+  options,
+  theme,
+  placeholder,
+  description,
+  multiple,
+  onChange,
+  modified = false,
+  required = false,
+  error = false
+}, {
+  skin
+}) => {
+  const [isOpened, updateIsOpened] = (0, _react.useState)(false);
+  const [getChoices, setChoices] = useChoices(options);
+  const nodeRef = (0, _react.useRef)(null);
+  const defaultColor = (0, _get2.default)('common.primary', skin);
+  const black = (0, _get2.default)('common.black', skin);
+  const handleOnClick = (0, _react.useCallback)(e => {
+    e.preventDefault();
+    e.stopPropagation();
+    updateIsOpened(prev => !prev);
+  }, []);
+  const closeHandle = (0, _react.useCallback)(e => {
+    if (nodeRef && nodeRef.current && !nodeRef.current.contains(e.target)) {
+      updateIsOpened(false);
+    }
+  }, []);
+  const handleChange = (0, _react.useCallback)(choice => {
+    // if multiple prop is turned on
+    // we return all selected choices
+    if (multiple) {
+      setChoices(choice);
+      return onChange(getChoices());
     }
-  }
-
-  set choices(choice) {
-    const choices = (0, _set2.default)(`[${choice.i}].selected`, !choice.selected, this._choices);
-    this._choices = choices.filter(c => c.selected);
-  }
-
-  get choices() {
-    return this._choices;
-  }
-
-  render() {
-    const {
-      skin
-    } = this.context;
-    const defaultColor = (0, _get2.default)('common.primary', skin);
-    const black = (0, _get2.default)('common.black', skin);
-    const {
-      title,
-      options,
-      theme,
-      placeholder,
-      description,
-      modified = false,
-      required = false,
-      error = false
-    } = this.props;
-    const {
-      opened
-    } = this.state;
-    this._choices = options;
-
-    const lines = _map2.default.convert({
-      cap: false
-    })((choice, i) => {
-      return /*#__PURE__*/_react.default.createElement("li", {
-        key: i,
-        className: _style.default.choice
-      }, /*#__PURE__*/_react.default.createElement(_titledCheckbox.default, {
-        onToggle: this.handleChange,
-        choice: _extends(_extends({}, choice), {}, {
-          i
-        }),
-        background: defaultColor
-      }));
-    }, options);
-
-    const selection = (0, _pipe2.default)((0, _filter2.default)({
-      selected: true
-    }), (0, _map2.default)('name'), (0, _join2.default)(', '))(options);
-
-    const _title = title && `${title}${required ? ' *' : ''}`;
-
-    const titleView = title ? /*#__PURE__*/_react.default.createElement("span", {
-      className: _style.default.title
-    }, _title, " ") : null;
-    const isActive = opened === true;
-    const mainClass = theme ? themeStyle[theme] : _style.default.default;
-    const behaviourClassName = (0, _getClassState.default)(_style.default.default, _style.default.modified, _style.default.error, modified, error);
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)(mainClass, behaviourClassName),
-      ref: this.setNode
-    }, /*#__PURE__*/_react.default.createElement("label", null, titleView, /*#__PURE__*/_react.default.createElement("div", {
-      className: _style.default.select,
-      title: selection || placeholder,
-      onClick: this.handleOnClick
-    }, selection || placeholder, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowDown, {
-      color: black,
-      className: (0, _classnames.default)(_style.default.arrow, {
-        [_style.default.down]: isActive
-      })
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: isActive ? _style.default.activeChoices : _style.default.choices
-    }, /*#__PURE__*/_react.default.createElement("ul", {
-      className: _style.default.list
-    }, lines))), /*#__PURE__*/_react.default.createElement("div", {
-      className: _style.default.description
-    }, description));
-  }
-
-}
-
-_defineProperty(SelectMultiple, "contextTypes", {
-  skin: _provider.default.childContextTypes.skin
-});
 
+    return onChange(choice);
+  }, [setChoices, multiple, onChange]);
+  (0, _react.useEffect)(() => {
+    document.addEventListener('click', closeHandle);
+    document.addEventListener('touchstart', closeHandle);
+    return () => {
+      document.removeEventListener('click', closeHandle);
+      document.removeEventListener('touchstart', closeHandle);
+    };
+  }, [closeHandle]);
+
+  const lines = _map2.default.convert({
+    cap: false
+  })((choice, i) => {
+    return /*#__PURE__*/_react.default.createElement("li", {
+      key: i,
+      className: _style.default.choice
+    }, /*#__PURE__*/_react.default.createElement(_titledCheckbox.default, {
+      onToggle: handleChange,
+      choice: _extends(_extends({}, choice), {}, {
+        i
+      }),
+      background: defaultColor
+    }));
+  }, options);
+
+  const selection = (0, _pipe2.default)((0, _filter2.default)({
+    selected: true
+  }), (0, _map2.default)('name'), (0, _join2.default)(', '))(options);
+
+  const _title = title && `${title}${required ? ' *' : ''}`;
+
+  const titleView = title ? /*#__PURE__*/_react.default.createElement("span", {
+    className: _style.default.title
+  }, _title, " ") : null;
+  const isActive = isOpened === true;
+  const mainClass = theme ? themeStyle[theme] : _style.default.default;
+  const behaviourClassName = (0, _getClassState.default)(_style.default.default, _style.default.modified, _style.default.error, modified, error);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)(mainClass, behaviourClassName),
+    ref: nodeRef
+  }, /*#__PURE__*/_react.default.createElement("label", null, titleView, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.select,
+    title: selection || placeholder,
+    onClick: handleOnClick
+  }, selection || placeholder, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowDown, {
+    color: black,
+    className: (0, _classnames.default)(_style.default.arrow, {
+      [_style.default.down]: isActive
+    })
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: isActive ? _style.default.activeChoices : _style.default.choices
+  }, /*#__PURE__*/_react.default.createElement("ul", {
+    className: _style.default.list
+  }, lines))), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.description
+  }, description));
+};
+
+SelectMultiple.contextTypes = {
+  skin: _provider.default.childContextTypes.skin
+};
 SelectMultiple.propTypes = process.env.NODE_ENV !== "production" ? {
   title: _propTypes.default.string,
   placeholder: _propTypes.default.string,

package/lib/molecule/select-multiple/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["themeStyle","setup","style","cockpit","sidebar","SelectMultiple","React","Component","constructor","props","e","opened","state","preventDefault","stopPropagation","setState","node","contains","target","choice","multiple","onChange","choices","setNode","el","componentDidMount","document","addEventListener","closeHandle","componentWillUnmount","removeEventListener","i","selected","_choices","filter","c","render","skin","context","defaultColor","black","title","options","theme","placeholder","description","modified","required","error","lines","convert","cap","handleChange","selection","_title","titleView","isActive","mainClass","default","behaviourClassName","select","handleOnClick","arrow","down","activeChoices","list","Provider","childContextTypes","propTypes","PropTypes","string","arrayOf","TitledCheckbox","func","bool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {map, pipe, join, filter, get, set} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  setup: style.setup,\n  cockpit: style.cockpit,\n  sidebar: style.sidebar\n};\n\nclass SelectMultiple extends React.Component {\n  static propTypes = {\n    title: PropTypes.string,\n    placeholder: PropTypes.string,\n    description: PropTypes.string,\n    options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n    onChange: PropTypes.func,\n    multiple: PropTypes.bool,\n    theme: PropTypes.string,\n    modified: PropTypes.bool,\n    required: PropTypes.bool,\n    error: PropTypes.bool\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      opened: false\n    };\n\n    this.node = null;\n    this.setNode = el => (this.node = el);\n  }\n\n  componentDidMount() {\n    if (typeof document !== 'undefined') {\n      document.addEventListener('click', this.closeHandle);\n      document.addEventListener('touchstart', this.closeHandle);\n    }\n  }\n\n  componentWillUnmount() {\n    if (typeof document !== 'undefined') {\n      document.removeEventListener('click', this.closeHandle);\n      document.removeEventListener('touchstart', this.closeHandle);\n    }\n  }\n\n  handleOnClick = e => {\n    const {opened} = this.state;\n    e.preventDefault();\n    e.stopPropagation();\n\n    this.setState({opened: !opened});\n  };\n\n  closeHandle = e => {\n    if (this.node && !this.node.contains(e.target)) {\n      this.setState({opened: false});\n    }\n  };\n\n  set choices(choice) {\n    const choices = set(`[${choice.i}].selected`, !choice.selected, this._choices);\n\n    this._choices = choices.filter(c => c.selected);\n  }\n\n  get choices() {\n    return this._choices;\n  }\n\n  handleChange = choice => {\n    const {multiple, onChange} = this.props;\n    // if multiple prop is turned on\n    // we return all selected choices\n    if (multiple) {\n      this.choices = choice;\n\n      return onChange(this.choices);\n    }\n\n    return onChange(choice);\n  };\n\n  render() {\n    const {skin} = this.context;\n    const defaultColor = get('common.primary', skin);\n    const black = get('common.black', skin);\n    const {\n      title,\n      options,\n      theme,\n      placeholder,\n      description,\n      modified = false,\n      required = false,\n      error = false\n    } = this.props;\n    const {opened} = this.state;\n\n    this._choices = options;\n\n    const lines = map.convert({cap: false})((choice, i) => {\n      return (\n        <li key={i} className={style.choice}>\n          <TitledCheckbox\n            onToggle={this.handleChange}\n            choice={{...choice, i}}\n            background={defaultColor}\n          />\n        </li>\n      );\n    }, options);\n    const selection = pipe(filter({selected: true}), map('name'), join(', '))(options);\n\n    const _title = title && `${title}${required ? ' *' : ''}`;\n\n    const titleView = title ? <span className={style.title}>{_title} </span> : null;\n    const isActive = opened === true;\n    const mainClass = theme ? themeStyle[theme] : style.default;\n    const behaviourClassName = getClassState(\n      style.default,\n      style.modified,\n      style.error,\n      modified,\n      error\n    );\n\n    return (\n      <div className={classnames(mainClass, behaviourClassName)} ref={this.setNode}>\n        <label>\n          {titleView}\n          <div\n            className={style.select}\n            title={selection || placeholder}\n            onClick={this.handleOnClick}\n          >\n            {selection || placeholder}\n            <ArrowDown\n              color={black}\n              className={classnames(style.arrow, {[style.down]: isActive})}\n            />\n          </div>\n          <div className={isActive ? style.activeChoices : style.choices}>\n            <ul className={style.list}>{lines}</ul>\n          </div>\n        </label>\n        <div className={style.description}>{description}</div>\n      </div>\n    );\n  }\n}\n\nexport default SelectMultiple;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["themeStyle","setup","style","cockpit","sidebar","useChoices","options","choicesRef","getChoices","current","setChoices","choice","choices","i","selected","filter","c","SelectMultiple","title","theme","placeholder","description","multiple","onChange","modified","required","error","skin","isOpened","updateIsOpened","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","contains","target","handleChange","document","addEventListener","removeEventListener","lines","convert","cap","selection","_title","titleView","isActive","mainClass","default","behaviourClassName","select","arrow","down","activeChoices","list","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","arrayOf","TitledCheckbox","func","bool"],"mappings":"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","sourcesContent":["import React, {useState, useEffect, useRef, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {map, pipe, join, filter, get, set} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  setup: style.setup,\n  cockpit: style.cockpit,\n  sidebar: style.sidebar\n};\n\nexport const useChoices = options => {\n  const choicesRef = useRef(options);\n\n  const getChoices = () => {\n    return choicesRef.current;\n  };\n\n  const setChoices = choice => {\n    const choices = set(`[${choice.i}].selected`, !choice.selected, getChoices());\n\n    choicesRef.current = choices.filter(c => c.selected);\n  };\n\n  return [getChoices, setChoices];\n};\n\nconst SelectMultiple = (\n  {\n    title,\n    options,\n    theme,\n    placeholder,\n    description,\n    multiple,\n    onChange,\n    modified = false,\n    required = false,\n    error = false\n  },\n  {skin}\n) => {\n  const [isOpened, updateIsOpened] = useState(false);\n  const [getChoices, setChoices] = useChoices(options);\n  const nodeRef = useRef(null);\n\n  const defaultColor = get('common.primary', skin);\n  const black = get('common.black', skin);\n\n  const handleOnClick = useCallback(e => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    updateIsOpened(prev => !prev);\n  }, []);\n\n  const closeHandle = useCallback(e => {\n    if (nodeRef && nodeRef.current && !nodeRef.current.contains(e.target)) {\n      updateIsOpened(false);\n    }\n  }, []);\n\n  const handleChange = useCallback(\n    choice => {\n      // if multiple prop is turned on\n      // we return all selected choices\n      if (multiple) {\n        setChoices(choice);\n\n        return onChange(getChoices());\n      }\n\n      return onChange(choice);\n    },\n    [setChoices, multiple, onChange]\n  );\n\n  useEffect(() => {\n    document.addEventListener('click', closeHandle);\n    document.addEventListener('touchstart', closeHandle);\n\n    return () => {\n      document.removeEventListener('click', closeHandle);\n      document.removeEventListener('touchstart', closeHandle);\n    };\n  }, [closeHandle]);\n\n  const lines = map.convert({cap: false})((choice, i) => {\n    return (\n      <li key={i} className={style.choice}>\n        <TitledCheckbox onToggle={handleChange} choice={{...choice, i}} background={defaultColor} />\n      </li>\n    );\n  }, options);\n\n  const selection = pipe(filter({selected: true}), map('name'), join(', '))(options);\n\n  const _title = title && `${title}${required ? ' *' : ''}`;\n\n  const titleView = title ? <span className={style.title}>{_title} </span> : null;\n  const isActive = isOpened === true;\n  const mainClass = theme ? themeStyle[theme] : style.default;\n  const behaviourClassName = getClassState(\n    style.default,\n    style.modified,\n    style.error,\n    modified,\n    error\n  );\n\n  return (\n    <div className={classnames(mainClass, behaviourClassName)} ref={nodeRef}>\n      <label>\n        {titleView}\n        <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n          {selection || placeholder}\n          <ArrowDown color={black} className={classnames(style.arrow, {[style.down]: isActive})} />\n        </div>\n        <div className={isActive ? style.activeChoices : style.choices}>\n          <ul className={style.list}>{lines}</ul>\n        </div>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nSelectMultiple.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nSelectMultiple.propTypes = {\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  description: PropTypes.string,\n  options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n  onChange: PropTypes.func,\n  multiple: PropTypes.bool,\n  theme: PropTypes.string,\n  modified: PropTypes.bool,\n  required: PropTypes.bool,\n  error: PropTypes.bool\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}

package/lib/molecule/select-multiple/test/index.js

@@ -4,16 +4,22 @@ var _browserEnv = _interopRequireDefault(require("browser-env"));
 
 var _ava = _interopRequireDefault(require("ava"));
 
+var _flatten = _interopRequireDefault(require("lodash/fp/flatten"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _enzyme = require("enzyme");
 
 var _enzymeAdapterReact = _interopRequireDefault(require("enzyme-adapter-react-16"));
 
-var _ = _interopRequireDefault(require(".."));
+var _ = _interopRequireWildcard(require(".."));
 
 var _checked = _interopRequireDefault(require("./fixtures/checked"));
 
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 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); }
@@ -22,49 +28,19 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 (0, _enzyme.configure)({
   adapter: new _enzymeAdapterReact.default()
 });
-(0, _ava.default)('should open and close list', t => {
-  t.plan(8);
-  const clickEvent = {
-    preventDefault: () => t.pass(),
-    stopPropagation: () => t.pass()
-  };
-  const props = _checked.default.props;
-  const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(_.default, props));
-  const selectWrapper = wrapper.find('.select-multiple__select');
-  t.is(wrapper.state().opened, false);
-  t.is(selectWrapper.exists(), true);
-  selectWrapper.simulate('click', clickEvent);
-  t.is(wrapper.state().opened, true);
-  selectWrapper.simulate('click', clickEvent);
-  t.is(wrapper.state().opened, false);
-});
-(0, _ava.default)('should select choice', t => {
-  t.plan(8);
-  const clickEvent = {
-    preventDefault: () => t.pass(),
-    stopPropagation: () => t.pass()
+
+const setup = options => {
+  const returnVal = [];
+
+  const TestComponent = () => {
+    returnVal.push((0, _.useChoices)(options));
+    return null;
   };
 
-  const props = _extends(_extends({}, _checked.default.props), {}, {
-    onChange: evt => {
-      t.is(evt.value, 'digital');
-      t.pass();
-    }
-  });
+  (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(TestComponent, null));
+  return (0, _flatten.default)(returnVal);
+};
 
-  const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(_.default, props));
-  const selectWrapper = wrapper.find('.select-multiple__select');
-  wrapper.update();
-  t.is(wrapper.state().opened, false);
-  t.is(selectWrapper.exists(), true);
-  selectWrapper.simulate('click', clickEvent);
-  wrapper.update();
-  t.is(wrapper.state().opened, true);
-  const checkbox = wrapper.find('[checked=false]').first();
-  checkbox.simulate('change');
-  t.is(wrapper.state().opened, true);
-  wrapper.update();
-});
 (0, _ava.default)('should select array of choices when props.multiple is set', t => {
   t.plan(2);
 
@@ -83,51 +59,21 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
     props
   });
 });
-(0, _ava.default)('should click outside', t => {
-  t.plan(10);
-  const clickEvent = {
-    preventDefault: () => t.pass(),
-    stopPropagation: () => t.pass()
-  };
-  const props = _checked.default.props;
-  const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(_.default, props));
-  const selectWrapper = wrapper.find('.select-multiple__select');
-  const instance = wrapper.instance();
-  wrapper.update();
-  t.is(wrapper.state().opened, false);
-  t.is(selectWrapper.exists(), true);
-  selectWrapper.simulate('click', clickEvent);
-  wrapper.update();
-  t.is(wrapper.state().opened, true);
-  instance.closeHandle({
-    target: null
-  });
-  t.is(wrapper.state().opened, false);
-  selectWrapper.simulate('click', clickEvent);
-  wrapper.update();
-  t.is(wrapper.state().opened, true);
-  instance.closeHandle({
-    target: selectWrapper.getDOMNode()
-  });
-  t.is(wrapper.state().opened, true);
-  wrapper.update();
-  wrapper.unmount();
-});
 (0, _ava.default)('should return choices (getter)', t => {
   const props = _extends({}, _checked.default.props);
 
-  const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(_.default, props));
-  t.is(wrapper.instance().choices.length, 4, 'not returning expected choices');
+  const [getChoices] = setup(props.options);
+  t.is(getChoices().length, 4, 'not returning expected choices');
 });
 (0, _ava.default)('should set current choice (setter)', t => {
   const props = _extends({}, _checked.default.props);
 
-  const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(_.default, props));
-  const instance = wrapper.instance();
-  t.is(instance.choices[0].selected, false, 'not setting correctly expected value for choice[0]');
-  instance.choices = _extends(_extends({}, props.options[0]), {}, {
+  const [getChoices, setChoices] = setup(props.options);
+  const choices = getChoices();
+  t.is(choices[0].selected, false, 'not setting correctly expected value for choice[0]');
+  setChoices(_extends(_extends({}, props.options[0]), {}, {
     i: 0
-  });
-  t.is(instance.choices[0].selected, true, 'not updating correctly expected value for choice[0]');
+  }));
+  t.is(getChoices()[0].selected, true, 'not updating correctly expected value for choice[0]');
 });
 //# sourceMappingURL=index.js.map

package/lib/molecule/select-multiple/test/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/molecule/select-multiple/test/index.js"],"names":["adapter","Adapter","t","plan","clickEvent","preventDefault","pass","stopPropagation","props","defaultFixture","wrapper","selectWrapper","find","is","state","opened","exists","simulate","onChange","evt","value","update","checkbox","first","multiple","choices","true","Array","isArray","instance","closeHandle","target","getDOMNode","unmount","length","selected","options","i"],"mappings":"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","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\nimport React from 'react';\nimport {mount, configure} from 'enzyme';\nimport Adapter from 'enzyme-adapter-react-16';\nimport SelectMultiple from '..';\nimport defaultFixture from './fixtures/checked';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\ntest('should open and close list', t => {\n  t.plan(8);\n\n  const clickEvent = {preventDefault: () => t.pass(), stopPropagation: () => t.pass()};\n  const props = defaultFixture.props;\n  const wrapper = mount(<SelectMultiple {...props} />);\n  const selectWrapper = wrapper.find('.select-multiple__select');\n\n  t.is(wrapper.state().opened, false);\n\n  t.is(selectWrapper.exists(), true);\n\n  selectWrapper.simulate('click', clickEvent);\n\n  t.is(wrapper.state().opened, true);\n\n  selectWrapper.simulate('click', clickEvent);\n\n  t.is(wrapper.state().opened, false);\n});\n\ntest('should select choice', t => {\n  t.plan(8);\n\n  const clickEvent = {preventDefault: () => t.pass(), stopPropagation: () => t.pass()};\n  const props = {\n    ...defaultFixture.props,\n    onChange: evt => {\n      t.is(evt.value, 'digital');\n\n      t.pass();\n    }\n  };\n  const wrapper = mount(<SelectMultiple {...props} />);\n  const selectWrapper = wrapper.find('.select-multiple__select');\n\n  wrapper.update();\n\n  t.is(wrapper.state().opened, false);\n\n  t.is(selectWrapper.exists(), true);\n\n  selectWrapper.simulate('click', clickEvent);\n\n  wrapper.update();\n\n  t.is(wrapper.state().opened, true);\n\n  const checkbox = wrapper.find('[checked=false]').first();\n\n  checkbox.simulate('change');\n\n  t.is(wrapper.state().opened, true);\n\n  wrapper.update();\n});\n\ntest('should select array of choices when props.multiple is set', t => {\n  t.plan(2);\n  const props = {\n    ...defaultFixture.props,\n    multiple: true,\n    onChange: choices => {\n      t.true(Array.isArray(choices), 'dffdff');\n      t.pass();\n    }\n  };\n\n  const wrapper = mount(<SelectMultiple {...props} />);\n\n  wrapper.update();\n\n  const checkbox = wrapper.find('[checked=false]').first();\n\n  checkbox.simulate('change', {props});\n});\n\ntest('should click outside', t => {\n  t.plan(10);\n\n  const clickEvent = {preventDefault: () => t.pass(), stopPropagation: () => t.pass()};\n  const props = defaultFixture.props;\n  const wrapper = mount(<SelectMultiple {...props} />);\n  const selectWrapper = wrapper.find('.select-multiple__select');\n  const instance = wrapper.instance();\n\n  wrapper.update();\n\n  t.is(wrapper.state().opened, false);\n\n  t.is(selectWrapper.exists(), true);\n\n  selectWrapper.simulate('click', clickEvent);\n\n  wrapper.update();\n\n  t.is(wrapper.state().opened, true);\n\n  instance.closeHandle({target: null});\n\n  t.is(wrapper.state().opened, false);\n\n  selectWrapper.simulate('click', clickEvent);\n\n  wrapper.update();\n\n  t.is(wrapper.state().opened, true);\n\n  instance.closeHandle({target: selectWrapper.getDOMNode()});\n\n  t.is(wrapper.state().opened, true);\n\n  wrapper.update();\n\n  wrapper.unmount();\n});\n\ntest('should return choices (getter)', t => {\n  const props = {...defaultFixture.props};\n  const wrapper = mount(<SelectMultiple {...props} />);\n\n  t.is(wrapper.instance().choices.length, 4, 'not returning expected choices');\n});\n\ntest('should set current choice (setter)', t => {\n  const props = {...defaultFixture.props};\n  const wrapper = mount(<SelectMultiple {...props} />);\n  const instance = wrapper.instance();\n\n  t.is(instance.choices[0].selected, false, 'not setting correctly expected value for choice[0]');\n\n  instance.choices = {...props.options[0], i: 0};\n\n  t.is(instance.choices[0].selected, true, 'not updating correctly expected value for choice[0]');\n});\n"],"file":"index.js"}
+{"version":3,"sources":["../../../../src/molecule/select-multiple/test/index.js"],"names":["adapter","Adapter","setup","options","returnVal","TestComponent","push","t","plan","props","defaultFixture","multiple","onChange","choices","true","Array","isArray","pass","wrapper","update","checkbox","find","first","simulate","getChoices","is","length","setChoices","selected","i"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA;AACA,uBAAU;AAACA,EAAAA,OAAO,EAAE,IAAIC,2BAAJ;AAAV,CAAV;;AAEA,MAAMC,KAAK,GAAGC,OAAO,IAAI;AACvB,QAAMC,SAAS,GAAG,EAAlB;;AACA,QAAMC,aAAa,GAAG,MAAM;AAC1BD,IAAAA,SAAS,CAACE,IAAV,CAAe,kBAAWH,OAAX,CAAf;AACA,WAAO,IAAP;AACD,GAHD;;AAKA,mCAAM,6BAAC,aAAD,OAAN;AACA,SAAO,sBAAQC,SAAR,CAAP;AACD,CATD;;AAWA,kBAAK,2DAAL,EAAkEG,CAAC,IAAI;AACrEA,EAAAA,CAAC,CAACC,IAAF,CAAO,CAAP;;AACA,QAAMC,KAAK,yBACNC,iBAAeD,KADT;AAETE,IAAAA,QAAQ,EAAE,IAFD;AAGTC,IAAAA,QAAQ,EAAEC,OAAO,IAAI;AACnBN,MAAAA,CAAC,CAACO,IAAF,CAAOC,KAAK,CAACC,OAAN,CAAcH,OAAd,CAAP,EAA+B,QAA/B;AACAN,MAAAA,CAAC,CAACU,IAAF;AACD;AANQ,IAAX;;AASA,QAAMC,OAAO,GAAG,iCAAM,6BAAC,SAAD,EAAoBT,KAApB,CAAN,CAAhB;AAEAS,EAAAA,OAAO,CAACC,MAAR;AAEA,QAAMC,QAAQ,GAAGF,OAAO,CAACG,IAAR,CAAa,iBAAb,EAAgCC,KAAhC,EAAjB;AAEAF,EAAAA,QAAQ,CAACG,QAAT,CAAkB,QAAlB,EAA4B;AAACd,IAAAA;AAAD,GAA5B;AACD,CAlBD;AAoBA,kBAAK,gCAAL,EAAuCF,CAAC,IAAI;AAC1C,QAAME,KAAK,gBAAOC,iBAAeD,KAAtB,CAAX;;AACA,QAAM,CAACe,UAAD,IAAetB,KAAK,CAACO,KAAK,CAACN,OAAP,CAA1B;AAEAI,EAAAA,CAAC,CAACkB,EAAF,CAAKD,UAAU,GAAGE,MAAlB,EAA0B,CAA1B,EAA6B,gCAA7B;AACD,CALD;AAOA,kBAAK,oCAAL,EAA2CnB,CAAC,IAAI;AAC9C,QAAME,KAAK,gBAAOC,iBAAeD,KAAtB,CAAX;;AACA,QAAM,CAACe,UAAD,EAAaG,UAAb,IAA2BzB,KAAK,CAACO,KAAK,CAACN,OAAP,CAAtC;AACA,QAAMU,OAAO,GAAGW,UAAU,EAA1B;AAEAjB,EAAAA,CAAC,CAACkB,EAAF,CAAKZ,OAAO,CAAC,CAAD,CAAP,CAAWe,QAAhB,EAA0B,KAA1B,EAAiC,oDAAjC;AAEAD,EAAAA,UAAU,uBAAKlB,KAAK,CAACN,OAAN,CAAc,CAAd,CAAL;AAAuB0B,IAAAA,CAAC,EAAE;AAA1B,KAAV;AAEAtB,EAAAA,CAAC,CAACkB,EAAF,CAAKD,UAAU,GAAG,CAAH,CAAV,CAAgBI,QAArB,EAA+B,IAA/B,EAAqC,qDAArC;AACD,CAVD","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\nimport flatten from 'lodash/fp/flatten';\nimport React from 'react';\nimport {mount, configure} from 'enzyme';\nimport Adapter from 'enzyme-adapter-react-16';\nimport SelectMultiple, {useChoices} from '..';\nimport defaultFixture from './fixtures/checked';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\nconst setup = options => {\n  const returnVal = [];\n  const TestComponent = () => {\n    returnVal.push(useChoices(options));\n    return null;\n  };\n\n  mount(<TestComponent />);\n  return flatten(returnVal);\n};\n\ntest('should select array of choices when props.multiple is set', t => {\n  t.plan(2);\n  const props = {\n    ...defaultFixture.props,\n    multiple: true,\n    onChange: choices => {\n      t.true(Array.isArray(choices), 'dffdff');\n      t.pass();\n    }\n  };\n\n  const wrapper = mount(<SelectMultiple {...props} />);\n\n  wrapper.update();\n\n  const checkbox = wrapper.find('[checked=false]').first();\n\n  checkbox.simulate('change', {props});\n});\n\ntest('should return choices (getter)', t => {\n  const props = {...defaultFixture.props};\n  const [getChoices] = setup(props.options);\n\n  t.is(getChoices().length, 4, 'not returning expected choices');\n});\n\ntest('should set current choice (setter)', t => {\n  const props = {...defaultFixture.props};\n  const [getChoices, setChoices] = setup(props.options);\n  const choices = getChoices();\n\n  t.is(choices[0].selected, false, 'not setting correctly expected value for choice[0]');\n\n  setChoices({...props.options[0], i: 0});\n\n  t.is(getChoices()[0].selected, true, 'not updating correctly expected value for choice[0]');\n});\n"],"file":"index.js"}