@coorpacademy/components 10.3.3 → 10.3.4-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/molecule/select-multiple/index.js +19 -20
- package/es/molecule/select-multiple/index.js.map +1 -1
- package/es/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js +2 -1
- package/es/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js.map +1 -1
- package/es/molecule/select-multiple/test/index.js +25 -34
- package/es/molecule/select-multiple/test/index.js.map +1 -1
- package/lib/molecule/select-multiple/index.js +20 -23
- package/lib/molecule/select-multiple/index.js.map +1 -1
- package/lib/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js +2 -1
- package/lib/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js.map +1 -1
- package/lib/molecule/select-multiple/test/index.js +23 -38
- package/lib/molecule/select-multiple/test/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -23,22 +23,19 @@ const themeStyle = {
|
|
|
23
23
|
cockpit: style.cockpit,
|
|
24
24
|
sidebar: style.sidebar,
|
|
25
25
|
coorpmanager: style.coorpmanager
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
return [getChoices, setChoices];
|
|
41
|
-
};
|
|
26
|
+
}; // export const useChoices = options => {
|
|
27
|
+
// const [choices, _setChoices] = useState(options);
|
|
28
|
+
// const getChoices = () => {
|
|
29
|
+
// return choices;
|
|
30
|
+
// };
|
|
31
|
+
// const setChoices = choice => {
|
|
32
|
+
// const _choices = set(`${choice.i}.selected`, !choice.selected, getChoices());
|
|
33
|
+
// console.log(JSON.stringify({choice, _choices}, null, 2));
|
|
34
|
+
// // choices.filter(c => c.selected);
|
|
35
|
+
// _setChoices(getChoices().filter(c => c.selected));
|
|
36
|
+
// };
|
|
37
|
+
// return [getChoices, setChoices];
|
|
38
|
+
// };
|
|
42
39
|
|
|
43
40
|
const CMMultipleView = ({
|
|
44
41
|
multiple,
|
|
@@ -87,7 +84,7 @@ const SelectMultiple = ({
|
|
|
87
84
|
skin
|
|
88
85
|
}) => {
|
|
89
86
|
const [isOpened, updateIsOpened] = useState(false);
|
|
90
|
-
const [
|
|
87
|
+
const [choices, setChoices] = useState(options);
|
|
91
88
|
const nodeRef = useRef(null);
|
|
92
89
|
|
|
93
90
|
const defaultColor = _get('common.primary', skin);
|
|
@@ -109,12 +106,14 @@ const SelectMultiple = ({
|
|
|
109
106
|
// if multiple prop is turned on
|
|
110
107
|
// we return all selected choices
|
|
111
108
|
if (multiple) {
|
|
112
|
-
|
|
113
|
-
|
|
109
|
+
const _choices = _set(`[${choice.i}].selected`, !choice.selected, choices);
|
|
110
|
+
|
|
111
|
+
setChoices(_choices);
|
|
112
|
+
return onChange(choices);
|
|
114
113
|
}
|
|
115
114
|
|
|
116
115
|
return onChange(choice);
|
|
117
|
-
}, [multiple, onChange
|
|
116
|
+
}, [choices, multiple, onChange]);
|
|
118
117
|
useEffect(() => {
|
|
119
118
|
document.addEventListener('click', closeHandle);
|
|
120
119
|
document.addEventListener('touchstart', closeHandle);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["React","useState","useEffect","useRef","useCallback","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDown","NovaSolidStatusClose","ErrorIcon","NovaCompositionCoorpacademyInformationIcon","InfoIcon","TitledCheckbox","Provider","Checkbox","getClassState","style","themeStyle","setup","cockpit","sidebar","coorpmanager","useChoices","options","choicesRef","getChoices","current","setChoices","choice","choices","i","selected","filter","c","CMMultipleView","multiple","onChange","handleChange","checked","item","name","SelectMultiple","title","theme","placeholder","description","hint","onError","modified","required","error","disabled","skin","isOpened","updateIsOpened","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","contains","target","document","addEventListener","removeEventListener","isCMTheme","lines","convert","cap","selection","_title","isActive","titleView","titleWithSelection","noValue","active","infoIconWrapper","infoIcon","descriptionLabel","hintView","hideHint","__html","mainClass","default","showPlaceholder","behaviourClassName","errorIconView","errorIcon","select","noselection","iconsWrapper","flex","clicked","arrow","down","activeChoices","list","contextTypes","childContextTypes","propTypes","bool","func","string","arrayOf","oneOf"],"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, keys, isEmpty} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowDown as ArrowDown,\n NovaSolidStatusClose as ErrorIcon,\n NovaCompositionCoorpacademyInformationIcon as InfoIcon\n} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport Checkbox from '../../atom/input-checkbox';\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 coorpmanager: style.coorpmanager\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 CMMultipleView = ({multiple, choice, onChange}) => {\n const handleChange = useCallback(\n checked => {\n if (!multiple) {\n return onChange(choice);\n }\n return onChange({...choice, selected: checked});\n },\n [onChange, choice, multiple]\n );\n\n return multiple ? (\n <div className={style.item}>\n <Checkbox\n titleStyle=\"inherit\"\n checked={choice.selected}\n onChange={handleChange}\n noLabelMargins\n title={choice.name}\n />\n </div>\n ) : (\n <span className={style.item} onClick={handleChange} title={choice.name}>\n {choice.name}\n </span>\n );\n};\n\nconst SelectMultiple = (\n {\n title,\n options,\n theme,\n placeholder,\n description,\n hint,\n multiple,\n onChange,\n onError,\n modified = false,\n required = false,\n error = '',\n disabled = 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(\n e => {\n if (disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n\n updateIsOpened(prev => !prev);\n },\n [disabled]\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 [multiple, onChange, setChoices, getChoices]\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 isCMTheme = theme === 'coorpmanager';\n\n const lines = map.convert({cap: false})((choice, i) => {\n return (\n <li key={i} className={style.choice}>\n {isCMTheme ? (\n <CMMultipleView multiple={multiple} choice={{...choice, i}} onChange={handleChange} />\n ) : (\n <TitledCheckbox\n onToggle={handleChange}\n choice={{...choice, i}}\n background={defaultColor}\n />\n )}\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 isActive = isOpened === true;\n\n const titleView = title ? (\n <span\n className={classnames(\n style.title,\n isCMTheme && selection && style.titleWithSelection,\n isCMTheme && isEmpty(selection) && style.noValue,\n isActive && style.active\n )}\n >\n {_title}\n {isCMTheme ? (\n <div className={style.infoIconWrapper}>\n <InfoIcon className={style.infoIcon} />\n <div className={style.descriptionLabel}>{description}</div>\n </div>\n ) : null}\n </span>\n ) : null;\n\n const hintView = isCMTheme ? (\n <div\n className={classnames(style.hint, isActive && style.hideHint)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: error || hint}}\n />\n ) : null;\n\n const mainClass = theme ? themeStyle[theme] : style.default;\n const showPlaceholder = isCMTheme && isActive;\n const behaviourClassName = getClassState(\n style.default,\n style.modified,\n style.error,\n modified,\n error\n );\n\n const errorIconView = error ? <ErrorIcon onClick={onError} className={style.errorIcon} /> : null;\n\n return (\n <div\n className={classnames(mainClass, behaviourClassName, disabled && style.disabled)}\n ref={nodeRef}\n >\n <label>\n {!isCMTheme && titleView}\n <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n {isCMTheme && titleView}\n <span\n className={classnames(\n style.selection,\n isCMTheme && isEmpty(selection) && style.noselection\n )}\n >\n {selection || !isCMTheme || (showPlaceholder && placeholder) || null}\n </span>\n {isCMTheme ? (\n <div className={style.iconsWrapper}>\n <div className={style.flex}>{errorIconView}</div>\n <div className={classnames(style.flex, isActive && style.clicked)}>\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n </div>\n </div>\n ) : (\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n )}\n </div>\n <div className={classnames(style.choices, isActive && style.activeChoices)}>\n <ul className={style.list}>{lines}</ul>\n </div>\n </label>\n {!isCMTheme ? <div className={style.description}>{description}</div> : null}\n {hintView}\n </div>\n );\n};\n\nSelectMultiple.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nCMMultipleView.propTypes = {\n multiple: PropTypes.bool,\n choice: TitledCheckbox.propTypes.choice,\n onChange: PropTypes.func\n};\n\nSelectMultiple.propTypes = {\n title: PropTypes.string,\n placeholder: PropTypes.string,\n description: PropTypes.string,\n hint: PropTypes.string,\n options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n onChange: PropTypes.func,\n onError: PropTypes.func,\n multiple: PropTypes.bool,\n modified: PropTypes.bool,\n disabled: PropTypes.bool,\n required: PropTypes.bool,\n error: PropTypes.string,\n theme: PropTypes.oneOf(keys(themeStyle))\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["React","useState","useEffect","useRef","useCallback","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDown","NovaSolidStatusClose","ErrorIcon","NovaCompositionCoorpacademyInformationIcon","InfoIcon","TitledCheckbox","Provider","Checkbox","getClassState","style","themeStyle","setup","cockpit","sidebar","coorpmanager","CMMultipleView","multiple","choice","onChange","handleChange","checked","selected","item","name","SelectMultiple","title","options","theme","placeholder","description","hint","onError","modified","required","error","disabled","skin","isOpened","updateIsOpened","choices","setChoices","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","current","contains","target","_choices","i","document","addEventListener","removeEventListener","isCMTheme","lines","convert","cap","selection","_title","isActive","titleView","titleWithSelection","noValue","active","infoIconWrapper","infoIcon","descriptionLabel","hintView","hideHint","__html","mainClass","default","showPlaceholder","behaviourClassName","errorIconView","errorIcon","select","noselection","iconsWrapper","flex","clicked","arrow","down","activeChoices","list","contextTypes","childContextTypes","propTypes","bool","func","string","arrayOf","oneOf"],"mappings":";;;;;;;;;;;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,SAAzB,EAAoCC,MAApC,EAA4CC,WAA5C,QAA8D,OAA9D;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SACEC,kCAAkC,IAAIC,SADxC,EAEEC,oBAAoB,IAAIC,SAF1B,EAGEC,0CAA0C,IAAIC,QAHhD,QAIO,0BAJP;AAKA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,QAAP,MAAqB,2BAArB;AACA,OAAOC,aAAP,MAA0B,4BAA1B;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,MAAMC,UAAU,GAAG;AACjBC,EAAAA,KAAK,EAAEF,KAAK,CAACE,KADI;AAEjBC,EAAAA,OAAO,EAAEH,KAAK,CAACG,OAFE;AAGjBC,EAAAA,OAAO,EAAEJ,KAAK,CAACI,OAHE;AAIjBC,EAAAA,YAAY,EAAEL,KAAK,CAACK;AAJH,CAAnB,C,CAOA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;;AAEA,MAAMC,cAAc,GAAG,CAAC;AAACC,EAAAA,QAAD;AAAWC,EAAAA,MAAX;AAAmBC,EAAAA;AAAnB,CAAD,KAAkC;AACvD,QAAMC,YAAY,GAAGvB,WAAW,CAC9BwB,OAAO,IAAI;AACT,QAAI,CAACJ,QAAL,EAAe;AACb,aAAOE,QAAQ,CAACD,MAAD,CAAf;AACD;;AACD,WAAOC,QAAQ,uBAAKD,MAAL;AAAaI,MAAAA,QAAQ,EAAED;AAAvB,OAAf;AACD,GAN6B,EAO9B,CAACF,QAAD,EAAWD,MAAX,EAAmBD,QAAnB,CAP8B,CAAhC;AAUA,SAAOA,QAAQ,gBACb;AAAK,IAAA,SAAS,EAAEP,KAAK,CAACa;AAAtB,kBACE,oBAAC,QAAD;AACE,IAAA,UAAU,EAAC,SADb;AAEE,IAAA,OAAO,EAAEL,MAAM,CAACI,QAFlB;AAGE,IAAA,QAAQ,EAAEF,YAHZ;AAIE,IAAA,cAAc,MAJhB;AAKE,IAAA,KAAK,EAAEF,MAAM,CAACM;AALhB,IADF,CADa,gBAWb;AAAM,IAAA,SAAS,EAAEd,KAAK,CAACa,IAAvB;AAA6B,IAAA,OAAO,EAAEH,YAAtC;AAAoD,IAAA,KAAK,EAAEF,MAAM,CAACM;AAAlE,KACGN,MAAM,CAACM,IADV,CAXF;AAeD,CA1BD;;AA4BA,MAAMC,cAAc,GAAG,CACrB;AACEC,EAAAA,KADF;AAEEC,EAAAA,OAFF;AAGEC,EAAAA,KAHF;AAIEC,EAAAA,WAJF;AAKEC,EAAAA,WALF;AAMEC,EAAAA,IANF;AAOEd,EAAAA,QAPF;AAQEE,EAAAA,QARF;AASEa,EAAAA,OATF;AAUEC,EAAAA,QAAQ,GAAG,KAVb;AAWEC,EAAAA,QAAQ,GAAG,KAXb;AAYEC,EAAAA,KAAK,GAAG,EAZV;AAaEC,EAAAA,QAAQ,GAAG;AAbb,CADqB,EAgBrB;AAACC,EAAAA;AAAD,CAhBqB,KAiBlB;AACH,QAAM,CAACC,QAAD,EAAWC,cAAX,IAA6B7C,QAAQ,CAAC,KAAD,CAA3C;AACA,QAAM,CAAC8C,OAAD,EAAUC,UAAV,IAAwB/C,QAAQ,CAACiC,OAAD,CAAtC;AACA,QAAMe,OAAO,GAAG9C,MAAM,CAAC,IAAD,CAAtB;;AAEA,QAAM+C,YAAY,GAAG,KAAI,gBAAJ,EAAsBN,IAAtB,CAArB;;AACA,QAAMO,KAAK,GAAG,KAAI,cAAJ,EAAoBP,IAApB,CAAd;;AAEA,QAAMQ,aAAa,GAAGhD,WAAW,CAC/BiD,CAAC,IAAI;AACH,QAAIV,QAAJ,EAAc;AAEdU,IAAAA,CAAC,CAACC,cAAF;AACAD,IAAAA,CAAC,CAACE,eAAF;AAEAT,IAAAA,cAAc,CAACU,IAAI,IAAI,CAACA,IAAV,CAAd;AACD,GAR8B,EAS/B,CAACb,QAAD,CAT+B,CAAjC;AAYA,QAAMc,WAAW,GAAGrD,WAAW,CAACiD,CAAC,IAAI;AACnC,QAAIJ,OAAO,IAAIA,OAAO,CAACS,OAAnB,IAA8B,CAACT,OAAO,CAACS,OAAR,CAAgBC,QAAhB,CAAyBN,CAAC,CAACO,MAA3B,CAAnC,EAAuE;AACrEd,MAAAA,cAAc,CAAC,KAAD,CAAd;AACD;AACF,GAJ8B,EAI5B,EAJ4B,CAA/B;AAMA,QAAMnB,YAAY,GAAGvB,WAAW,CAC9BqB,MAAM,IAAI;AACR;AACA;AACA,QAAID,QAAJ,EAAc;AACZ,YAAMqC,QAAQ,GAAG,KAAK,IAAGpC,MAAM,CAACqC,CAAE,YAAjB,EAA8B,CAACrC,MAAM,CAACI,QAAtC,EAAgDkB,OAAhD,CAAjB;;AACAC,MAAAA,UAAU,CAACa,QAAD,CAAV;AAEA,aAAOnC,QAAQ,CAACqB,OAAD,CAAf;AACD;;AAED,WAAOrB,QAAQ,CAACD,MAAD,CAAf;AACD,GAZ6B,EAa9B,CAACsB,OAAD,EAAUvB,QAAV,EAAoBE,QAApB,CAb8B,CAAhC;AAgBAxB,EAAAA,SAAS,CAAC,MAAM;AACd6D,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCP,WAAnC;AACAM,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,YAA1B,EAAwCP,WAAxC;AAEA,WAAO,MAAM;AACXM,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCR,WAAtC;AACAM,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,YAA7B,EAA2CR,WAA3C;AACD,KAHD;AAID,GARQ,EAQN,CAACA,WAAD,CARM,CAAT;AAUA,QAAMS,SAAS,GAAG/B,KAAK,KAAK,cAA5B;;AAEA,QAAMgC,KAAK,GAAG,KAAIC,OAAJ,CAAY;AAACC,IAAAA,GAAG,EAAE;AAAN,GAAZ,EAA0B,CAAC5C,MAAD,EAASqC,CAAT,KAAe;AACrD,wBACE;AAAI,MAAA,GAAG,EAAEA,CAAT;AAAY,MAAA,SAAS,EAAE7C,KAAK,CAACQ;AAA7B,OACGyC,SAAS,gBACR,oBAAC,cAAD;AAAgB,MAAA,QAAQ,EAAE1C,QAA1B;AAAoC,MAAA,MAAM,wBAAMC,MAAN;AAAcqC,QAAAA;AAAd,QAA1C;AAA4D,MAAA,QAAQ,EAAEnC;AAAtE,MADQ,gBAGR,oBAAC,cAAD;AACE,MAAA,QAAQ,EAAEA,YADZ;AAEE,MAAA,MAAM,wBAAMF,MAAN;AAAcqC,QAAAA;AAAd,QAFR;AAGE,MAAA,UAAU,EAAEZ;AAHd,MAJJ,CADF;AAaD,GAda,EAcXhB,OAdW,CAAd;;AAgBA,QAAMoC,SAAS,GAAG,MAAK,QAAO;AAACzC,IAAAA,QAAQ,EAAE;AAAX,GAAP,CAAL,EAA+B,KAAI,MAAJ,CAA/B,EAA4C,MAAK,IAAL,CAA5C,EAAwDK,OAAxD,CAAlB;;AAEA,QAAMqC,MAAM,GAAGtC,KAAK,IAAK,GAAEA,KAAM,GAAEQ,QAAQ,GAAG,IAAH,GAAU,EAAG,EAAxD;;AAEA,QAAM+B,QAAQ,GAAG3B,QAAQ,KAAK,IAA9B;AAEA,QAAM4B,SAAS,GAAGxC,KAAK,gBACrB;AACE,IAAA,SAAS,EAAE3B,UAAU,CACnBW,KAAK,CAACgB,KADa,EAEnBiC,SAAS,IAAII,SAAb,IAA0BrD,KAAK,CAACyD,kBAFb,EAGnBR,SAAS,IAAI,SAAQI,SAAR,CAAb,IAAmCrD,KAAK,CAAC0D,OAHtB,EAInBH,QAAQ,IAAIvD,KAAK,CAAC2D,MAJC;AADvB,KAQGL,MARH,EASGL,SAAS,gBACR;AAAK,IAAA,SAAS,EAAEjD,KAAK,CAAC4D;AAAtB,kBACE,oBAAC,QAAD;AAAU,IAAA,SAAS,EAAE5D,KAAK,CAAC6D;AAA3B,IADF,eAEE;AAAK,IAAA,SAAS,EAAE7D,KAAK,CAAC8D;AAAtB,KAAyC1C,WAAzC,CAFF,CADQ,GAKN,IAdN,CADqB,GAiBnB,IAjBJ;AAmBA,QAAM2C,QAAQ,GAAGd,SAAS,gBACxB;AACE,IAAA,SAAS,EAAE5D,UAAU,CAACW,KAAK,CAACqB,IAAP,EAAakC,QAAQ,IAAIvD,KAAK,CAACgE,QAA/B,CADvB,CAEE;AAFF;AAGE,IAAA,uBAAuB,EAAE;AAACC,MAAAA,MAAM,EAAExC,KAAK,IAAIJ;AAAlB;AAH3B,IADwB,GAMtB,IANJ;AAQA,QAAM6C,SAAS,GAAGhD,KAAK,GAAGjB,UAAU,CAACiB,KAAD,CAAb,GAAuBlB,KAAK,CAACmE,OAApD;AACA,QAAMC,eAAe,GAAGnB,SAAS,IAAIM,QAArC;AACA,QAAMc,kBAAkB,GAAGtE,aAAa,CACtCC,KAAK,CAACmE,OADgC,EAEtCnE,KAAK,CAACuB,QAFgC,EAGtCvB,KAAK,CAACyB,KAHgC,EAItCF,QAJsC,EAKtCE,KALsC,CAAxC;AAQA,QAAM6C,aAAa,GAAG7C,KAAK,gBAAG,oBAAC,SAAD;AAAW,IAAA,OAAO,EAAEH,OAApB;AAA6B,IAAA,SAAS,EAAEtB,KAAK,CAACuE;AAA9C,IAAH,GAAiE,IAA5F;AAEA,sBACE;AACE,IAAA,SAAS,EAAElF,UAAU,CAAC6E,SAAD,EAAYG,kBAAZ,EAAgC3C,QAAQ,IAAI1B,KAAK,CAAC0B,QAAlD,CADvB;AAEE,IAAA,GAAG,EAAEM;AAFP,kBAIE,mCACG,CAACiB,SAAD,IAAcO,SADjB,eAEE;AAAK,IAAA,SAAS,EAAExD,KAAK,CAACwE,MAAtB;AAA8B,IAAA,KAAK,EAAEnB,SAAS,IAAIlC,WAAlD;AAA+D,IAAA,OAAO,EAAEgB;AAAxE,KACGc,SAAS,IAAIO,SADhB,eAEE;AACE,IAAA,SAAS,EAAEnE,UAAU,CACnBW,KAAK,CAACqD,SADa,EAEnBJ,SAAS,IAAI,SAAQI,SAAR,CAAb,IAAmCrD,KAAK,CAACyE,WAFtB;AADvB,KAMGpB,SAAS,IAAI,CAACJ,SAAd,IAA4BmB,eAAe,IAAIjD,WAA/C,IAA+D,IANlE,CAFF,EAUG8B,SAAS,gBACR;AAAK,IAAA,SAAS,EAAEjD,KAAK,CAAC0E;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAE1E,KAAK,CAAC2E;AAAtB,KAA6BL,aAA7B,CADF,eAEE;AAAK,IAAA,SAAS,EAAEjF,UAAU,CAACW,KAAK,CAAC2E,IAAP,EAAapB,QAAQ,IAAIvD,KAAK,CAAC4E,OAA/B;AAA1B,kBACE,oBAAC,SAAD;AACE,IAAA,KAAK,EAAE1C,KADT;AAEE,IAAA,SAAS,EAAE7C,UAAU,CAACW,KAAK,CAAC6E,KAAP,EAAc;AAAC,OAAC7E,KAAK,CAAC8E,IAAP,GAAcvB;AAAf,KAAd;AAFvB,IADF,CAFF,CADQ,gBAWR,oBAAC,SAAD;AACE,IAAA,KAAK,EAAErB,KADT;AAEE,IAAA,SAAS,EAAE7C,UAAU,CAACW,KAAK,CAAC6E,KAAP,EAAc;AAAC,OAAC7E,KAAK,CAAC8E,IAAP,GAAcvB;AAAf,KAAd;AAFvB,IArBJ,CAFF,eA6BE;AAAK,IAAA,SAAS,EAAElE,UAAU,CAACW,KAAK,CAAC8B,OAAP,EAAgByB,QAAQ,IAAIvD,KAAK,CAAC+E,aAAlC;AAA1B,kBACE;AAAI,IAAA,SAAS,EAAE/E,KAAK,CAACgF;AAArB,KAA4B9B,KAA5B,CADF,CA7BF,CAJF,EAqCG,CAACD,SAAD,gBAAa;AAAK,IAAA,SAAS,EAAEjD,KAAK,CAACoB;AAAtB,KAAoCA,WAApC,CAAb,GAAsE,IArCzE,EAsCG2C,QAtCH,CADF;AA0CD,CA9KD;;AAgLAhD,cAAc,CAACkE,YAAf,GAA8B;AAC5BtD,EAAAA,IAAI,EAAE9B,QAAQ,CAACqF,iBAAT,CAA2BvD;AADL,CAA9B;AAIArB,cAAc,CAAC6E,SAAf,2CAA2B;AACzB5E,EAAAA,QAAQ,EAAEnB,SAAS,CAACgG,IADK;AAEzB5E,EAAAA,MAAM,EAAEZ,cAAc,CAACuF,SAAf,CAAyB3E,MAFR;AAGzBC,EAAAA,QAAQ,EAAErB,SAAS,CAACiG;AAHK,CAA3B;AAMAtE,cAAc,CAACoE,SAAf,2CAA2B;AACzBnE,EAAAA,KAAK,EAAE5B,SAAS,CAACkG,MADQ;AAEzBnE,EAAAA,WAAW,EAAE/B,SAAS,CAACkG,MAFE;AAGzBlE,EAAAA,WAAW,EAAEhC,SAAS,CAACkG,MAHE;AAIzBjE,EAAAA,IAAI,EAAEjC,SAAS,CAACkG,MAJS;AAKzBrE,EAAAA,OAAO,EAAE7B,SAAS,CAACmG,OAAV,CAAkB3F,cAAc,CAACuF,SAAf,CAAyB3E,MAA3C,CALgB;AAMzBC,EAAAA,QAAQ,EAAErB,SAAS,CAACiG,IANK;AAOzB/D,EAAAA,OAAO,EAAElC,SAAS,CAACiG,IAPM;AAQzB9E,EAAAA,QAAQ,EAAEnB,SAAS,CAACgG,IARK;AASzB7D,EAAAA,QAAQ,EAAEnC,SAAS,CAACgG,IATK;AAUzB1D,EAAAA,QAAQ,EAAEtC,SAAS,CAACgG,IAVK;AAWzB5D,EAAAA,QAAQ,EAAEpC,SAAS,CAACgG,IAXK;AAYzB3D,EAAAA,KAAK,EAAErC,SAAS,CAACkG,MAZQ;AAazBpE,EAAAA,KAAK,EAAE9B,SAAS,CAACoG,KAAV,CAAgB,MAAKvF,UAAL,CAAhB;AAbkB,CAA3B;AAgBA,eAAec,cAAf","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, keys, isEmpty} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowDown as ArrowDown,\n NovaSolidStatusClose as ErrorIcon,\n NovaCompositionCoorpacademyInformationIcon as InfoIcon\n} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport Checkbox from '../../atom/input-checkbox';\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 coorpmanager: style.coorpmanager\n};\n\n// export const useChoices = options => {\n// const [choices, _setChoices] = useState(options);\n\n// const getChoices = () => {\n// return choices;\n// };\n\n// const setChoices = choice => {\n// const _choices = set(`${choice.i}.selected`, !choice.selected, getChoices());\n\n// console.log(JSON.stringify({choice, _choices}, null, 2));\n// // choices.filter(c => c.selected);\n// _setChoices(getChoices().filter(c => c.selected));\n// };\n\n// return [getChoices, setChoices];\n// };\n\nconst CMMultipleView = ({multiple, choice, onChange}) => {\n const handleChange = useCallback(\n checked => {\n if (!multiple) {\n return onChange(choice);\n }\n return onChange({...choice, selected: checked});\n },\n [onChange, choice, multiple]\n );\n\n return multiple ? (\n <div className={style.item}>\n <Checkbox\n titleStyle=\"inherit\"\n checked={choice.selected}\n onChange={handleChange}\n noLabelMargins\n title={choice.name}\n />\n </div>\n ) : (\n <span className={style.item} onClick={handleChange} title={choice.name}>\n {choice.name}\n </span>\n );\n};\n\nconst SelectMultiple = (\n {\n title,\n options,\n theme,\n placeholder,\n description,\n hint,\n multiple,\n onChange,\n onError,\n modified = false,\n required = false,\n error = '',\n disabled = false\n },\n {skin}\n) => {\n const [isOpened, updateIsOpened] = useState(false);\n const [choices, setChoices] = useState(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(\n e => {\n if (disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n\n updateIsOpened(prev => !prev);\n },\n [disabled]\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 const _choices = set(`[${choice.i}].selected`, !choice.selected, choices);\n setChoices(_choices);\n\n return onChange(choices);\n }\n\n return onChange(choice);\n },\n [choices, 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 isCMTheme = theme === 'coorpmanager';\n\n const lines = map.convert({cap: false})((choice, i) => {\n return (\n <li key={i} className={style.choice}>\n {isCMTheme ? (\n <CMMultipleView multiple={multiple} choice={{...choice, i}} onChange={handleChange} />\n ) : (\n <TitledCheckbox\n onToggle={handleChange}\n choice={{...choice, i}}\n background={defaultColor}\n />\n )}\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 isActive = isOpened === true;\n\n const titleView = title ? (\n <span\n className={classnames(\n style.title,\n isCMTheme && selection && style.titleWithSelection,\n isCMTheme && isEmpty(selection) && style.noValue,\n isActive && style.active\n )}\n >\n {_title}\n {isCMTheme ? (\n <div className={style.infoIconWrapper}>\n <InfoIcon className={style.infoIcon} />\n <div className={style.descriptionLabel}>{description}</div>\n </div>\n ) : null}\n </span>\n ) : null;\n\n const hintView = isCMTheme ? (\n <div\n className={classnames(style.hint, isActive && style.hideHint)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: error || hint}}\n />\n ) : null;\n\n const mainClass = theme ? themeStyle[theme] : style.default;\n const showPlaceholder = isCMTheme && isActive;\n const behaviourClassName = getClassState(\n style.default,\n style.modified,\n style.error,\n modified,\n error\n );\n\n const errorIconView = error ? <ErrorIcon onClick={onError} className={style.errorIcon} /> : null;\n\n return (\n <div\n className={classnames(mainClass, behaviourClassName, disabled && style.disabled)}\n ref={nodeRef}\n >\n <label>\n {!isCMTheme && titleView}\n <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n {isCMTheme && titleView}\n <span\n className={classnames(\n style.selection,\n isCMTheme && isEmpty(selection) && style.noselection\n )}\n >\n {selection || !isCMTheme || (showPlaceholder && placeholder) || null}\n </span>\n {isCMTheme ? (\n <div className={style.iconsWrapper}>\n <div className={style.flex}>{errorIconView}</div>\n <div className={classnames(style.flex, isActive && style.clicked)}>\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n </div>\n </div>\n ) : (\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n )}\n </div>\n <div className={classnames(style.choices, isActive && style.activeChoices)}>\n <ul className={style.list}>{lines}</ul>\n </div>\n </label>\n {!isCMTheme ? <div className={style.description}>{description}</div> : null}\n {hintView}\n </div>\n );\n};\n\nSelectMultiple.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nCMMultipleView.propTypes = {\n multiple: PropTypes.bool,\n choice: TitledCheckbox.propTypes.choice,\n onChange: PropTypes.func\n};\n\nSelectMultiple.propTypes = {\n title: PropTypes.string,\n placeholder: PropTypes.string,\n description: PropTypes.string,\n hint: PropTypes.string,\n options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n onChange: PropTypes.func,\n onError: PropTypes.func,\n multiple: PropTypes.bool,\n modified: PropTypes.bool,\n disabled: PropTypes.bool,\n required: PropTypes.bool,\n error: PropTypes.string,\n theme: PropTypes.oneOf(keys(themeStyle))\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}
|
|
@@ -2,6 +2,7 @@ export default {
|
|
|
2
2
|
props: {
|
|
3
3
|
theme: 'cockpit',
|
|
4
4
|
placeholder: 'Select language(s)',
|
|
5
|
+
multiple: true,
|
|
5
6
|
options: [{
|
|
6
7
|
name: 'English',
|
|
7
8
|
value: 'en',
|
|
@@ -19,7 +20,7 @@ export default {
|
|
|
19
20
|
value: 'es',
|
|
20
21
|
selected: false
|
|
21
22
|
}],
|
|
22
|
-
onChange:
|
|
23
|
+
onChange: choices => console.log(JSON.stringify(choices, null, 2))
|
|
23
24
|
}
|
|
24
25
|
};
|
|
25
26
|
//# sourceMappingURL=checked-cockpit-theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js"],"names":["props","theme","placeholder","options","name","value","selected","onChange"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,SADF;AAELC,IAAAA,WAAW,EAAE,oBAFR;AAGLC,IAAAA,OAAO,EAAE,CACP;AACEC,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KADO,EAMP;AACEF,MAAAA,IAAI,EAAE,QADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KANO,EAWP;AACEF,MAAAA,IAAI,EAAE,MADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAXO,EAgBP;AACEF,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAhBO,
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js"],"names":["props","theme","placeholder","multiple","options","name","value","selected","onChange","choices","console","log","JSON","stringify"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,SADF;AAELC,IAAAA,WAAW,EAAE,oBAFR;AAGLC,IAAAA,QAAQ,EAAE,IAHL;AAILC,IAAAA,OAAO,EAAE,CACP;AACEC,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KADO,EAMP;AACEF,MAAAA,IAAI,EAAE,QADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KANO,EAWP;AACEF,MAAAA,IAAI,EAAE,MADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAXO,EAgBP;AACEF,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAhBO,CAJJ;AA0BLC,IAAAA,QAAQ,EAAGC,OAAD,IAAaC,OAAO,CAACC,GAAR,CAAYC,IAAI,CAACC,SAAL,CAAeJ,OAAf,EAAwB,IAAxB,EAA8B,CAA9B,CAAZ;AA1BlB;AADM,CAAf","sourcesContent":["export default {\n props: {\n theme: 'cockpit',\n placeholder: 'Select language(s)',\n multiple: true,\n options: [\n {\n name: 'English',\n value: 'en',\n selected: true\n },\n {\n name: 'German',\n value: 'de',\n selected: false\n },\n {\n name: 'Thai',\n value: 'th',\n selected: false\n },\n {\n name: 'Spanish',\n value: 'es',\n selected: false\n }\n ],\n onChange: (choices) => console.log(JSON.stringify(choices, null, 2))\n }\n};\n"],"file":"checked-cockpit-theme.js"}
|
|
@@ -1,29 +1,25 @@
|
|
|
1
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); }
|
|
2
2
|
|
|
3
3
|
import browserEnv from 'browser-env';
|
|
4
|
-
import test from 'ava';
|
|
5
|
-
|
|
4
|
+
import test from 'ava'; // import flatten from 'lodash/fp/flatten';
|
|
5
|
+
|
|
6
6
|
import React from 'react';
|
|
7
7
|
import { mount, configure } from 'enzyme';
|
|
8
8
|
import Adapter from 'enzyme-adapter-react-16';
|
|
9
|
-
import SelectMultiple
|
|
9
|
+
import SelectMultiple from '..';
|
|
10
10
|
import defaultFixture from './fixtures/checked';
|
|
11
11
|
browserEnv();
|
|
12
12
|
configure({
|
|
13
13
|
adapter: new Adapter()
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
mount( /*#__PURE__*/React.createElement(TestComponent, null));
|
|
25
|
-
return flatten(returnVal);
|
|
26
|
-
};
|
|
14
|
+
}); // const setup = options => {
|
|
15
|
+
// const returnVal = [];
|
|
16
|
+
// const TestComponent = () => {
|
|
17
|
+
// returnVal.push(useChoices(options));
|
|
18
|
+
// return null;
|
|
19
|
+
// };
|
|
20
|
+
// mount(<TestComponent />);
|
|
21
|
+
// return flatten(returnVal);
|
|
22
|
+
// };
|
|
27
23
|
|
|
28
24
|
test('should select array of choices when props.multiple is set', t => {
|
|
29
25
|
t.plan(2);
|
|
@@ -42,22 +38,17 @@ test('should select array of choices when props.multiple is set', t => {
|
|
|
42
38
|
checkbox.simulate('change', {
|
|
43
39
|
props
|
|
44
40
|
});
|
|
45
|
-
});
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
setChoices(_extends(_extends({}, props.options[0]), {}, {
|
|
59
|
-
i: 0
|
|
60
|
-
}));
|
|
61
|
-
t.is(getChoices()[0].selected, true, 'not updating correctly expected value for choice[0]');
|
|
62
|
-
});
|
|
41
|
+
}); // test('should return choices (getter)', t => {
|
|
42
|
+
// const props = {...defaultFixture.props};
|
|
43
|
+
// const [getChoices] = setup(props.options);
|
|
44
|
+
// t.is(getChoices().length, 4, 'not returning expected choices');
|
|
45
|
+
// });
|
|
46
|
+
// test('should set current choice (setter)', t => {
|
|
47
|
+
// const props = {...defaultFixture.props};
|
|
48
|
+
// const [getChoices, setChoices] = setup(props.options);
|
|
49
|
+
// const choices = getChoices();
|
|
50
|
+
// t.is(choices[0].selected, false, 'not setting correctly expected value for choice[0]');
|
|
51
|
+
// setChoices({...props.options[0], i: 0});
|
|
52
|
+
// t.is(getChoices()[0].selected, true, 'not updating correctly expected value for choice[0]');
|
|
53
|
+
// });
|
|
63
54
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/molecule/select-multiple/test/index.js"],"names":["browserEnv","test","
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/select-multiple/test/index.js"],"names":["browserEnv","test","React","mount","configure","Adapter","SelectMultiple","defaultFixture","adapter","t","plan","props","multiple","onChange","choices","true","Array","isArray","pass","wrapper","update","checkbox","find","first","simulate"],"mappings":";;AAAA,OAAOA,UAAP,MAAuB,aAAvB;AACA,OAAOC,IAAP,MAAiB,KAAjB,C,CACA;;AACA,OAAOC,KAAP,MAAkB,OAAlB;AACA,SAAQC,KAAR,EAAeC,SAAf,QAA+B,QAA/B;AACA,OAAOC,OAAP,MAAoB,yBAApB;AACA,OAAOC,cAAP,MAA2B,IAA3B;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AAEAP,UAAU;AACVI,SAAS,CAAC;AAACI,EAAAA,OAAO,EAAE,IAAIH,OAAJ;AAAV,CAAD,CAAT,C,CAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;AAEAJ,IAAI,CAAC,2DAAD,EAA8DQ,CAAC,IAAI;AACrEA,EAAAA,CAAC,CAACC,IAAF,CAAO,CAAP;;AACA,QAAMC,KAAK,yBACNJ,cAAc,CAACI,KADT;AAETC,IAAAA,QAAQ,EAAE,IAFD;AAGTC,IAAAA,QAAQ,EAAEC,OAAO,IAAI;AACnBL,MAAAA,CAAC,CAACM,IAAF,CAAOC,KAAK,CAACC,OAAN,CAAcH,OAAd,CAAP,EAA+B,QAA/B;AACAL,MAAAA,CAAC,CAACS,IAAF;AACD;AANQ,IAAX;;AASA,QAAMC,OAAO,GAAGhB,KAAK,eAAC,oBAAC,cAAD,EAAoBQ,KAApB,CAAD,CAArB;AAEAQ,EAAAA,OAAO,CAACC,MAAR;AAEA,QAAMC,QAAQ,GAAGF,OAAO,CAACG,IAAR,CAAa,iBAAb,EAAgCC,KAAhC,EAAjB;AAEAF,EAAAA,QAAQ,CAACG,QAAT,CAAkB,QAAlB,EAA4B;AAACb,IAAAA;AAAD,GAA5B;AACD,CAlBG,CAAJ,C,CAoBA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\n// import flatten from 'lodash/fp/flatten';\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\n// const 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\n// test('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\n// test('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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
|
-
exports.default =
|
|
4
|
+
exports.default = void 0;
|
|
5
5
|
|
|
6
6
|
var _isEmpty2 = _interopRequireDefault(require("lodash/fp/isEmpty"));
|
|
7
7
|
|
|
@@ -50,24 +50,19 @@ const themeStyle = {
|
|
|
50
50
|
cockpit: _style.default.cockpit,
|
|
51
51
|
sidebar: _style.default.sidebar,
|
|
52
52
|
coorpmanager: _style.default.coorpmanager
|
|
53
|
-
};
|
|
54
|
-
|
|
55
|
-
const
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
return [getChoices, setChoices];
|
|
68
|
-
};
|
|
69
|
-
|
|
70
|
-
exports.useChoices = useChoices;
|
|
53
|
+
}; // export const useChoices = options => {
|
|
54
|
+
// const [choices, _setChoices] = useState(options);
|
|
55
|
+
// const getChoices = () => {
|
|
56
|
+
// return choices;
|
|
57
|
+
// };
|
|
58
|
+
// const setChoices = choice => {
|
|
59
|
+
// const _choices = set(`${choice.i}.selected`, !choice.selected, getChoices());
|
|
60
|
+
// console.log(JSON.stringify({choice, _choices}, null, 2));
|
|
61
|
+
// // choices.filter(c => c.selected);
|
|
62
|
+
// _setChoices(getChoices().filter(c => c.selected));
|
|
63
|
+
// };
|
|
64
|
+
// return [getChoices, setChoices];
|
|
65
|
+
// };
|
|
71
66
|
|
|
72
67
|
const CMMultipleView = ({
|
|
73
68
|
multiple,
|
|
@@ -116,7 +111,7 @@ const SelectMultiple = ({
|
|
|
116
111
|
skin
|
|
117
112
|
}) => {
|
|
118
113
|
const [isOpened, updateIsOpened] = (0, _react.useState)(false);
|
|
119
|
-
const [
|
|
114
|
+
const [choices, setChoices] = (0, _react.useState)(options);
|
|
120
115
|
const nodeRef = (0, _react.useRef)(null);
|
|
121
116
|
const defaultColor = (0, _get2.default)('common.primary', skin);
|
|
122
117
|
const black = (0, _get2.default)('common.black', skin);
|
|
@@ -135,12 +130,14 @@ const SelectMultiple = ({
|
|
|
135
130
|
// if multiple prop is turned on
|
|
136
131
|
// we return all selected choices
|
|
137
132
|
if (multiple) {
|
|
138
|
-
|
|
139
|
-
|
|
133
|
+
const _choices = (0, _set2.default)(`[${choice.i}].selected`, !choice.selected, choices);
|
|
134
|
+
|
|
135
|
+
setChoices(_choices);
|
|
136
|
+
return onChange(choices);
|
|
140
137
|
}
|
|
141
138
|
|
|
142
139
|
return onChange(choice);
|
|
143
|
-
}, [multiple, onChange
|
|
140
|
+
}, [choices, multiple, onChange]);
|
|
144
141
|
(0, _react.useEffect)(() => {
|
|
145
142
|
document.addEventListener('click', closeHandle);
|
|
146
143
|
document.addEventListener('touchstart', closeHandle);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["themeStyle","setup","style","cockpit","sidebar","coorpmanager","useChoices","options","choicesRef","getChoices","current","setChoices","choice","choices","i","selected","filter","c","CMMultipleView","multiple","onChange","handleChange","checked","item","name","SelectMultiple","title","theme","placeholder","description","hint","onError","modified","required","error","disabled","skin","isOpened","updateIsOpened","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","contains","target","document","addEventListener","removeEventListener","isCMTheme","lines","convert","cap","selection","_title","isActive","titleView","titleWithSelection","noValue","active","infoIconWrapper","infoIcon","descriptionLabel","hintView","hideHint","__html","mainClass","default","showPlaceholder","behaviourClassName","errorIconView","errorIcon","select","noselection","iconsWrapper","flex","clicked","arrow","down","activeChoices","list","contextTypes","Provider","childContextTypes","propTypes","PropTypes","bool","TitledCheckbox","func","string","arrayOf","oneOf"],"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, keys, isEmpty} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowDown as ArrowDown,\n NovaSolidStatusClose as ErrorIcon,\n NovaCompositionCoorpacademyInformationIcon as InfoIcon\n} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport Checkbox from '../../atom/input-checkbox';\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 coorpmanager: style.coorpmanager\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 CMMultipleView = ({multiple, choice, onChange}) => {\n const handleChange = useCallback(\n checked => {\n if (!multiple) {\n return onChange(choice);\n }\n return onChange({...choice, selected: checked});\n },\n [onChange, choice, multiple]\n );\n\n return multiple ? (\n <div className={style.item}>\n <Checkbox\n titleStyle=\"inherit\"\n checked={choice.selected}\n onChange={handleChange}\n noLabelMargins\n title={choice.name}\n />\n </div>\n ) : (\n <span className={style.item} onClick={handleChange} title={choice.name}>\n {choice.name}\n </span>\n );\n};\n\nconst SelectMultiple = (\n {\n title,\n options,\n theme,\n placeholder,\n description,\n hint,\n multiple,\n onChange,\n onError,\n modified = false,\n required = false,\n error = '',\n disabled = 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(\n e => {\n if (disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n\n updateIsOpened(prev => !prev);\n },\n [disabled]\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 [multiple, onChange, setChoices, getChoices]\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 isCMTheme = theme === 'coorpmanager';\n\n const lines = map.convert({cap: false})((choice, i) => {\n return (\n <li key={i} className={style.choice}>\n {isCMTheme ? (\n <CMMultipleView multiple={multiple} choice={{...choice, i}} onChange={handleChange} />\n ) : (\n <TitledCheckbox\n onToggle={handleChange}\n choice={{...choice, i}}\n background={defaultColor}\n />\n )}\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 isActive = isOpened === true;\n\n const titleView = title ? (\n <span\n className={classnames(\n style.title,\n isCMTheme && selection && style.titleWithSelection,\n isCMTheme && isEmpty(selection) && style.noValue,\n isActive && style.active\n )}\n >\n {_title}\n {isCMTheme ? (\n <div className={style.infoIconWrapper}>\n <InfoIcon className={style.infoIcon} />\n <div className={style.descriptionLabel}>{description}</div>\n </div>\n ) : null}\n </span>\n ) : null;\n\n const hintView = isCMTheme ? (\n <div\n className={classnames(style.hint, isActive && style.hideHint)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: error || hint}}\n />\n ) : null;\n\n const mainClass = theme ? themeStyle[theme] : style.default;\n const showPlaceholder = isCMTheme && isActive;\n const behaviourClassName = getClassState(\n style.default,\n style.modified,\n style.error,\n modified,\n error\n );\n\n const errorIconView = error ? <ErrorIcon onClick={onError} className={style.errorIcon} /> : null;\n\n return (\n <div\n className={classnames(mainClass, behaviourClassName, disabled && style.disabled)}\n ref={nodeRef}\n >\n <label>\n {!isCMTheme && titleView}\n <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n {isCMTheme && titleView}\n <span\n className={classnames(\n style.selection,\n isCMTheme && isEmpty(selection) && style.noselection\n )}\n >\n {selection || !isCMTheme || (showPlaceholder && placeholder) || null}\n </span>\n {isCMTheme ? (\n <div className={style.iconsWrapper}>\n <div className={style.flex}>{errorIconView}</div>\n <div className={classnames(style.flex, isActive && style.clicked)}>\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n </div>\n </div>\n ) : (\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n )}\n </div>\n <div className={classnames(style.choices, isActive && style.activeChoices)}>\n <ul className={style.list}>{lines}</ul>\n </div>\n </label>\n {!isCMTheme ? <div className={style.description}>{description}</div> : null}\n {hintView}\n </div>\n );\n};\n\nSelectMultiple.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nCMMultipleView.propTypes = {\n multiple: PropTypes.bool,\n choice: TitledCheckbox.propTypes.choice,\n onChange: PropTypes.func\n};\n\nSelectMultiple.propTypes = {\n title: PropTypes.string,\n placeholder: PropTypes.string,\n description: PropTypes.string,\n hint: PropTypes.string,\n options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n onChange: PropTypes.func,\n onError: PropTypes.func,\n multiple: PropTypes.bool,\n modified: PropTypes.bool,\n disabled: PropTypes.bool,\n required: PropTypes.bool,\n error: PropTypes.string,\n theme: PropTypes.oneOf(keys(themeStyle))\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["themeStyle","setup","style","cockpit","sidebar","coorpmanager","CMMultipleView","multiple","choice","onChange","handleChange","checked","selected","item","name","SelectMultiple","title","options","theme","placeholder","description","hint","onError","modified","required","error","disabled","skin","isOpened","updateIsOpened","choices","setChoices","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","current","contains","target","_choices","i","document","addEventListener","removeEventListener","isCMTheme","lines","convert","cap","selection","_title","isActive","titleView","titleWithSelection","noValue","active","infoIconWrapper","infoIcon","descriptionLabel","hintView","hideHint","__html","mainClass","default","showPlaceholder","behaviourClassName","errorIconView","errorIcon","select","noselection","iconsWrapper","flex","clicked","arrow","down","activeChoices","list","contextTypes","Provider","childContextTypes","propTypes","PropTypes","bool","TitledCheckbox","func","string","arrayOf","oneOf"],"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, keys, isEmpty} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowDown as ArrowDown,\n NovaSolidStatusClose as ErrorIcon,\n NovaCompositionCoorpacademyInformationIcon as InfoIcon\n} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport Checkbox from '../../atom/input-checkbox';\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 coorpmanager: style.coorpmanager\n};\n\n// export const useChoices = options => {\n// const [choices, _setChoices] = useState(options);\n\n// const getChoices = () => {\n// return choices;\n// };\n\n// const setChoices = choice => {\n// const _choices = set(`${choice.i}.selected`, !choice.selected, getChoices());\n\n// console.log(JSON.stringify({choice, _choices}, null, 2));\n// // choices.filter(c => c.selected);\n// _setChoices(getChoices().filter(c => c.selected));\n// };\n\n// return [getChoices, setChoices];\n// };\n\nconst CMMultipleView = ({multiple, choice, onChange}) => {\n const handleChange = useCallback(\n checked => {\n if (!multiple) {\n return onChange(choice);\n }\n return onChange({...choice, selected: checked});\n },\n [onChange, choice, multiple]\n );\n\n return multiple ? (\n <div className={style.item}>\n <Checkbox\n titleStyle=\"inherit\"\n checked={choice.selected}\n onChange={handleChange}\n noLabelMargins\n title={choice.name}\n />\n </div>\n ) : (\n <span className={style.item} onClick={handleChange} title={choice.name}>\n {choice.name}\n </span>\n );\n};\n\nconst SelectMultiple = (\n {\n title,\n options,\n theme,\n placeholder,\n description,\n hint,\n multiple,\n onChange,\n onError,\n modified = false,\n required = false,\n error = '',\n disabled = false\n },\n {skin}\n) => {\n const [isOpened, updateIsOpened] = useState(false);\n const [choices, setChoices] = useState(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(\n e => {\n if (disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n\n updateIsOpened(prev => !prev);\n },\n [disabled]\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 const _choices = set(`[${choice.i}].selected`, !choice.selected, choices);\n setChoices(_choices);\n\n return onChange(choices);\n }\n\n return onChange(choice);\n },\n [choices, 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 isCMTheme = theme === 'coorpmanager';\n\n const lines = map.convert({cap: false})((choice, i) => {\n return (\n <li key={i} className={style.choice}>\n {isCMTheme ? (\n <CMMultipleView multiple={multiple} choice={{...choice, i}} onChange={handleChange} />\n ) : (\n <TitledCheckbox\n onToggle={handleChange}\n choice={{...choice, i}}\n background={defaultColor}\n />\n )}\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 isActive = isOpened === true;\n\n const titleView = title ? (\n <span\n className={classnames(\n style.title,\n isCMTheme && selection && style.titleWithSelection,\n isCMTheme && isEmpty(selection) && style.noValue,\n isActive && style.active\n )}\n >\n {_title}\n {isCMTheme ? (\n <div className={style.infoIconWrapper}>\n <InfoIcon className={style.infoIcon} />\n <div className={style.descriptionLabel}>{description}</div>\n </div>\n ) : null}\n </span>\n ) : null;\n\n const hintView = isCMTheme ? (\n <div\n className={classnames(style.hint, isActive && style.hideHint)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: error || hint}}\n />\n ) : null;\n\n const mainClass = theme ? themeStyle[theme] : style.default;\n const showPlaceholder = isCMTheme && isActive;\n const behaviourClassName = getClassState(\n style.default,\n style.modified,\n style.error,\n modified,\n error\n );\n\n const errorIconView = error ? <ErrorIcon onClick={onError} className={style.errorIcon} /> : null;\n\n return (\n <div\n className={classnames(mainClass, behaviourClassName, disabled && style.disabled)}\n ref={nodeRef}\n >\n <label>\n {!isCMTheme && titleView}\n <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n {isCMTheme && titleView}\n <span\n className={classnames(\n style.selection,\n isCMTheme && isEmpty(selection) && style.noselection\n )}\n >\n {selection || !isCMTheme || (showPlaceholder && placeholder) || null}\n </span>\n {isCMTheme ? (\n <div className={style.iconsWrapper}>\n <div className={style.flex}>{errorIconView}</div>\n <div className={classnames(style.flex, isActive && style.clicked)}>\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n </div>\n </div>\n ) : (\n <ArrowDown\n color={black}\n className={classnames(style.arrow, {[style.down]: isActive})}\n />\n )}\n </div>\n <div className={classnames(style.choices, isActive && style.activeChoices)}>\n <ul className={style.list}>{lines}</ul>\n </div>\n </label>\n {!isCMTheme ? <div className={style.description}>{description}</div> : null}\n {hintView}\n </div>\n );\n};\n\nSelectMultiple.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nCMMultipleView.propTypes = {\n multiple: PropTypes.bool,\n choice: TitledCheckbox.propTypes.choice,\n onChange: PropTypes.func\n};\n\nSelectMultiple.propTypes = {\n title: PropTypes.string,\n placeholder: PropTypes.string,\n description: PropTypes.string,\n hint: PropTypes.string,\n options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n onChange: PropTypes.func,\n onError: PropTypes.func,\n multiple: PropTypes.bool,\n modified: PropTypes.bool,\n disabled: PropTypes.bool,\n required: PropTypes.bool,\n error: PropTypes.string,\n theme: PropTypes.oneOf(keys(themeStyle))\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}
|
|
@@ -6,6 +6,7 @@ var _default = {
|
|
|
6
6
|
props: {
|
|
7
7
|
theme: 'cockpit',
|
|
8
8
|
placeholder: 'Select language(s)',
|
|
9
|
+
multiple: true,
|
|
9
10
|
options: [{
|
|
10
11
|
name: 'English',
|
|
11
12
|
value: 'en',
|
|
@@ -23,7 +24,7 @@ var _default = {
|
|
|
23
24
|
value: 'es',
|
|
24
25
|
selected: false
|
|
25
26
|
}],
|
|
26
|
-
onChange:
|
|
27
|
+
onChange: choices => console.log(JSON.stringify(choices, null, 2))
|
|
27
28
|
}
|
|
28
29
|
};
|
|
29
30
|
exports.default = _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js"],"names":["props","theme","placeholder","options","name","value","selected","onChange"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,SADF;AAELC,IAAAA,WAAW,EAAE,oBAFR;AAGLC,IAAAA,OAAO,EAAE,CACP;AACEC,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KADO,EAMP;AACEF,MAAAA,IAAI,EAAE,QADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KANO,EAWP;AACEF,MAAAA,IAAI,EAAE,MADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAXO,EAgBP;AACEF,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAhBO,
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/select-multiple/test/fixtures/checked-cockpit-theme.js"],"names":["props","theme","placeholder","multiple","options","name","value","selected","onChange","choices","console","log","JSON","stringify"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,SADF;AAELC,IAAAA,WAAW,EAAE,oBAFR;AAGLC,IAAAA,QAAQ,EAAE,IAHL;AAILC,IAAAA,OAAO,EAAE,CACP;AACEC,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KADO,EAMP;AACEF,MAAAA,IAAI,EAAE,QADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KANO,EAWP;AACEF,MAAAA,IAAI,EAAE,MADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAXO,EAgBP;AACEF,MAAAA,IAAI,EAAE,SADR;AAEEC,MAAAA,KAAK,EAAE,IAFT;AAGEC,MAAAA,QAAQ,EAAE;AAHZ,KAhBO,CAJJ;AA0BLC,IAAAA,QAAQ,EAAGC,OAAD,IAAaC,OAAO,CAACC,GAAR,CAAYC,IAAI,CAACC,SAAL,CAAeJ,OAAf,EAAwB,IAAxB,EAA8B,CAA9B,CAAZ;AA1BlB;AADM,C","sourcesContent":["export default {\n props: {\n theme: 'cockpit',\n placeholder: 'Select language(s)',\n multiple: true,\n options: [\n {\n name: 'English',\n value: 'en',\n selected: true\n },\n {\n name: 'German',\n value: 'de',\n selected: false\n },\n {\n name: 'Thai',\n value: 'th',\n selected: false\n },\n {\n name: 'Spanish',\n value: 'es',\n selected: false\n }\n ],\n onChange: (choices) => console.log(JSON.stringify(choices, null, 2))\n }\n};\n"],"file":"checked-cockpit-theme.js"}
|
|
@@ -4,22 +4,16 @@ var _browserEnv = _interopRequireDefault(require("browser-env"));
|
|
|
4
4
|
|
|
5
5
|
var _ava = _interopRequireDefault(require("ava"));
|
|
6
6
|
|
|
7
|
-
var _flatten = _interopRequireDefault(require("lodash/fp/flatten"));
|
|
8
|
-
|
|
9
7
|
var _react = _interopRequireDefault(require("react"));
|
|
10
8
|
|
|
11
9
|
var _enzyme = require("enzyme");
|
|
12
10
|
|
|
13
11
|
var _enzymeAdapterReact = _interopRequireDefault(require("enzyme-adapter-react-16"));
|
|
14
12
|
|
|
15
|
-
var _ =
|
|
13
|
+
var _ = _interopRequireDefault(require(".."));
|
|
16
14
|
|
|
17
15
|
var _checked = _interopRequireDefault(require("./fixtures/checked"));
|
|
18
16
|
|
|
19
|
-
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
20
|
-
|
|
21
|
-
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; }
|
|
22
|
-
|
|
23
17
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
24
18
|
|
|
25
19
|
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); }
|
|
@@ -27,19 +21,15 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
27
21
|
(0, _browserEnv.default)();
|
|
28
22
|
(0, _enzyme.configure)({
|
|
29
23
|
adapter: new _enzymeAdapterReact.default()
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
(0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(TestComponent, null));
|
|
41
|
-
return (0, _flatten.default)(returnVal);
|
|
42
|
-
};
|
|
24
|
+
}); // const setup = options => {
|
|
25
|
+
// const returnVal = [];
|
|
26
|
+
// const TestComponent = () => {
|
|
27
|
+
// returnVal.push(useChoices(options));
|
|
28
|
+
// return null;
|
|
29
|
+
// };
|
|
30
|
+
// mount(<TestComponent />);
|
|
31
|
+
// return flatten(returnVal);
|
|
32
|
+
// };
|
|
43
33
|
|
|
44
34
|
(0, _ava.default)('should select array of choices when props.multiple is set', t => {
|
|
45
35
|
t.plan(2);
|
|
@@ -58,22 +48,17 @@ const setup = options => {
|
|
|
58
48
|
checkbox.simulate('change', {
|
|
59
49
|
props
|
|
60
50
|
});
|
|
61
|
-
});
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
setChoices(_extends(_extends({}, props.options[0]), {}, {
|
|
75
|
-
i: 0
|
|
76
|
-
}));
|
|
77
|
-
t.is(getChoices()[0].selected, true, 'not updating correctly expected value for choice[0]');
|
|
78
|
-
});
|
|
51
|
+
}); // test('should return choices (getter)', t => {
|
|
52
|
+
// const props = {...defaultFixture.props};
|
|
53
|
+
// const [getChoices] = setup(props.options);
|
|
54
|
+
// t.is(getChoices().length, 4, 'not returning expected choices');
|
|
55
|
+
// });
|
|
56
|
+
// test('should set current choice (setter)', t => {
|
|
57
|
+
// const props = {...defaultFixture.props};
|
|
58
|
+
// const [getChoices, setChoices] = setup(props.options);
|
|
59
|
+
// const choices = getChoices();
|
|
60
|
+
// t.is(choices[0].selected, false, 'not setting correctly expected value for choice[0]');
|
|
61
|
+
// setChoices({...props.options[0], i: 0});
|
|
62
|
+
// t.is(getChoices()[0].selected, true, 'not updating correctly expected value for choice[0]');
|
|
63
|
+
// });
|
|
79
64
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/molecule/select-multiple/test/index.js"],"names":["adapter","Adapter","
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/select-multiple/test/index.js"],"names":["adapter","Adapter","t","plan","props","defaultFixture","multiple","onChange","choices","true","Array","isArray","pass","wrapper","update","checkbox","find","first","simulate"],"mappings":";;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA;AACA,uBAAU;AAACA,EAAAA,OAAO,EAAE,IAAIC,2BAAJ;AAAV,CAAV,E,CAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;AAEA,kBAAK,2DAAL,EAAkEC,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,E,CAoBA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\n// import flatten from 'lodash/fp/flatten';\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\n// const 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\n// test('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\n// test('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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coorpacademy/components",
|
|
3
|
-
"version": "10.3.
|
|
3
|
+
"version": "10.3.4-alpha.0+9ea308ec2",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -119,5 +119,5 @@
|
|
|
119
119
|
"webpack-hot-middleware": "^2.25.0"
|
|
120
120
|
},
|
|
121
121
|
"author": "CoorpAcademy",
|
|
122
|
-
"gitHead": "
|
|
122
|
+
"gitHead": "9ea308ec2a8401ca9475e37790ab0a0f49105432"
|
|
123
123
|
}
|