@coorpacademy/components 10.5.1 → 10.5.5
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/atom/card-image-preview/test/fixtures.js +0 -30
- package/es/atom/card-image-preview/test/fixtures.js.map +1 -1
- package/es/molecule/course-section/test/fixtures.js +15 -0
- package/es/molecule/course-section/test/fixtures.js.map +1 -0
- package/es/molecule/draggable/index.js +56 -0
- package/es/molecule/draggable/index.js.map +1 -0
- package/es/molecule/draggable/style.css +67 -0
- package/es/molecule/draggable/test/fixtures/default.js +12 -0
- package/es/molecule/draggable/test/fixtures/default.js.map +1 -0
- package/es/molecule/draggable/test/fixtures.js +13 -0
- package/es/molecule/draggable/test/fixtures.js.map +1 -0
- package/es/molecule/draggable-list/index.js +54 -0
- package/es/molecule/draggable-list/index.js.map +1 -0
- package/es/molecule/draggable-list/test/fixtures/dashboard-sections.js +26 -0
- package/es/molecule/draggable-list/test/fixtures/dashboard-sections.js.map +1 -0
- package/es/molecule/draggable-list/test/fixtures.js +13 -0
- package/es/molecule/draggable-list/test/fixtures.js.map +1 -0
- package/es/molecule/{setup-sections → draggable-list}/test/on-drop.js +5 -5
- package/es/molecule/draggable-list/test/on-drop.js.map +1 -0
- package/es/molecule/search/test/fixtures.js +15 -0
- package/es/molecule/search/test/fixtures.js.map +1 -0
- package/es/molecule/select-multiple/style.css +8 -5
- package/es/molecule/setup-section/index.js +2 -23
- package/es/molecule/setup-section/index.js.map +1 -1
- package/es/molecule/setup-section/style.css +1 -26
- package/es/molecule/setup-sections/index.js +7 -85
- package/es/molecule/setup-sections/index.js.map +1 -1
- package/es/molecule/setup-sections/style.css +0 -56
- package/es/organism/brand-form/test/fixtures/wizard-playlists.js +1 -1
- package/es/organism/brand-form/test/fixtures/wizard-playlists.js.map +1 -1
- package/es/template/app-player/popin-end/test/fixtures.js +2 -0
- package/es/template/app-player/popin-end/test/fixtures.js.map +1 -1
- package/lib/atom/card-image-preview/test/fixtures.js +0 -45
- package/lib/atom/card-image-preview/test/fixtures.js.map +1 -1
- package/lib/molecule/course-section/test/fixtures.js +25 -0
- package/lib/molecule/course-section/test/fixtures.js.map +1 -0
- package/lib/molecule/draggable/index.js +71 -0
- package/lib/molecule/draggable/index.js.map +1 -0
- package/lib/molecule/draggable/style.css +67 -0
- package/lib/molecule/draggable/test/fixtures/default.js +17 -0
- package/lib/molecule/draggable/test/fixtures/default.js.map +1 -0
- package/lib/molecule/draggable/test/fixtures.js +22 -0
- package/lib/molecule/draggable/test/fixtures.js.map +1 -0
- package/lib/molecule/draggable-list/index.js +70 -0
- package/lib/molecule/draggable-list/index.js.map +1 -0
- package/lib/molecule/draggable-list/test/fixtures/dashboard-sections.js +37 -0
- package/lib/molecule/draggable-list/test/fixtures/dashboard-sections.js.map +1 -0
- package/lib/molecule/draggable-list/test/fixtures.js +22 -0
- package/lib/molecule/draggable-list/test/fixtures.js.map +1 -0
- package/lib/molecule/{setup-sections → draggable-list}/test/on-drop.js +7 -7
- package/lib/molecule/draggable-list/test/on-drop.js.map +1 -0
- package/lib/molecule/search/test/fixtures.js +25 -0
- package/lib/molecule/search/test/fixtures.js.map +1 -0
- package/lib/molecule/select-multiple/style.css +8 -5
- package/lib/molecule/setup-section/index.js +2 -21
- package/lib/molecule/setup-section/index.js.map +1 -1
- package/lib/molecule/setup-section/style.css +1 -26
- package/lib/molecule/setup-sections/index.js +7 -89
- package/lib/molecule/setup-sections/index.js.map +1 -1
- package/lib/molecule/setup-sections/style.css +0 -56
- package/lib/organism/brand-form/test/fixtures/wizard-playlists.js +1 -1
- package/lib/organism/brand-form/test/fixtures/wizard-playlists.js.map +1 -1
- package/lib/template/app-player/popin-end/test/fixtures.js +3 -0
- package/lib/template/app-player/popin-end/test/fixtures.js.map +1 -1
- package/package.json +2 -2
- package/es/molecule/setup-sections/test/on-drop.js.map +0 -1
- package/lib/molecule/setup-sections/test/on-drop.js.map +0 -1
|
@@ -2,44 +2,14 @@ import test from 'ava';
|
|
|
2
2
|
import forEach from 'lodash/forEach';
|
|
3
3
|
import renderComponentMacro from '../../../test/helpers/render-component';
|
|
4
4
|
import AtomCardImagePreview from '..';
|
|
5
|
-
import fixtureAdaptivAndDisabled from './fixtures/adaptiv-and-disabled';
|
|
6
|
-
import fixtureAdaptiv from './fixtures/adaptiv';
|
|
7
|
-
import fixtureArabic from './fixtures/arabic';
|
|
8
|
-
import fixtureArticle from './fixtures/article';
|
|
9
|
-
import fixtureCoorpmanager from './fixtures/coorpmanager';
|
|
10
5
|
import fixtureDefault from './fixtures/default';
|
|
11
|
-
import fixtureDisabled from './fixtures/disabled';
|
|
12
6
|
import fixtureEmpty from './fixtures/empty';
|
|
13
|
-
import fixtureExternalContent from './fixtures/external-content';
|
|
14
|
-
import fixtureFavorite from './fixtures/favorite';
|
|
15
|
-
import fixtureFreerunAndDisabled from './fixtures/freerun-and-disabled';
|
|
16
|
-
import fixtureFreerun from './fixtures/freerun';
|
|
17
|
-
import fixturePodcast from './fixtures/podcast';
|
|
18
|
-
import fixtureScorm from './fixtures/scorm';
|
|
19
|
-
import fixtureSelectableFalse from './fixtures/selectable-false';
|
|
20
|
-
import fixtureSelectableTrue from './fixtures/selectable-true';
|
|
21
|
-
import fixtureVideo from './fixtures/video';
|
|
22
7
|
test('Atom › AtomCardImagePreview > should have valid propTypes', t => {
|
|
23
8
|
t.pass();
|
|
24
9
|
forEach(AtomCardImagePreview.propTypes, (value, key) => {
|
|
25
10
|
t.not(value, undefined, `PropType for "Atom.AtomCardImagePreview.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
|
|
26
11
|
});
|
|
27
12
|
});
|
|
28
|
-
test('Atom › AtomCardImagePreview › AdaptivAndDisabled › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureAdaptivAndDisabled);
|
|
29
|
-
test('Atom › AtomCardImagePreview › Adaptiv › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureAdaptiv);
|
|
30
|
-
test('Atom › AtomCardImagePreview › Arabic › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureArabic);
|
|
31
|
-
test('Atom › AtomCardImagePreview › Article › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureArticle);
|
|
32
|
-
test('Atom › AtomCardImagePreview › Coorpmanager › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureCoorpmanager);
|
|
33
13
|
test('Atom › AtomCardImagePreview › Default › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureDefault);
|
|
34
|
-
test('Atom › AtomCardImagePreview › Disabled › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureDisabled);
|
|
35
14
|
test('Atom › AtomCardImagePreview › Empty › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureEmpty);
|
|
36
|
-
test('Atom › AtomCardImagePreview › ExternalContent › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureExternalContent);
|
|
37
|
-
test('Atom › AtomCardImagePreview › Favorite › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureFavorite);
|
|
38
|
-
test('Atom › AtomCardImagePreview › FreerunAndDisabled › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureFreerunAndDisabled);
|
|
39
|
-
test('Atom › AtomCardImagePreview › Freerun › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureFreerun);
|
|
40
|
-
test('Atom › AtomCardImagePreview › Podcast › should be rendered', renderComponentMacro, AtomCardImagePreview, fixturePodcast);
|
|
41
|
-
test('Atom › AtomCardImagePreview › Scorm › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureScorm);
|
|
42
|
-
test('Atom › AtomCardImagePreview › SelectableFalse › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureSelectableFalse);
|
|
43
|
-
test('Atom › AtomCardImagePreview › SelectableTrue › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureSelectableTrue);
|
|
44
|
-
test('Atom › AtomCardImagePreview › Video › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureVideo);
|
|
45
15
|
//# sourceMappingURL=fixtures.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/atom/card-image-preview/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","AtomCardImagePreview","
|
|
1
|
+
{"version":3,"sources":["../../../../src/atom/card-image-preview/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","AtomCardImagePreview","fixtureDefault","fixtureEmpty","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,oBAAP,MAAiC,IAAjC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AAEAL,IAAI,CAAC,2DAAD,EAA8DM,CAAC,IAAI;AACrEA,EAAAA,CAAC,CAACC,IAAF;AACAN,EAAAA,OAAO,CAACE,oBAAoB,CAACK,SAAtB,EAAiC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACtDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,qDAAoDF,GAAI,mEAAjF;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAV,IAAI,CAAC,4DAAD,EAA+DE,oBAA/D,EAAqFC,oBAArF,EAA2GC,cAA3G,CAAJ;AACAJ,IAAI,CAAC,0DAAD,EAA6DE,oBAA7D,EAAmFC,oBAAnF,EAAyGE,YAAzG,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomCardImagePreview from '..';\nimport fixtureDefault from './fixtures/default';\nimport fixtureEmpty from './fixtures/empty';\n\ntest('Atom › AtomCardImagePreview > should have valid propTypes', t => {\n t.pass();\n forEach(AtomCardImagePreview.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Atom.AtomCardImagePreview.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Atom › AtomCardImagePreview › Default › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureDefault);\ntest('Atom › AtomCardImagePreview › Empty › should be rendered', renderComponentMacro, AtomCardImagePreview, fixtureEmpty);\n"],"file":"fixtures.js"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import test from 'ava';
|
|
2
|
+
import forEach from 'lodash/forEach';
|
|
3
|
+
import renderComponentMacro from '../../../test/helpers/render-component';
|
|
4
|
+
import MoleculeCourseSection from '..';
|
|
5
|
+
import fixtureChapter from './fixtures/chapter';
|
|
6
|
+
import fixtureCourse from './fixtures/course';
|
|
7
|
+
test('Molecule › MoleculeCourseSection > should have valid propTypes', t => {
|
|
8
|
+
t.pass();
|
|
9
|
+
forEach(MoleculeCourseSection.propTypes, (value, key) => {
|
|
10
|
+
t.not(value, undefined, `PropType for "Molecule.MoleculeCourseSection.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
|
|
11
|
+
});
|
|
12
|
+
});
|
|
13
|
+
test('Molecule › MoleculeCourseSection › Chapter › should be rendered', renderComponentMacro, MoleculeCourseSection, fixtureChapter);
|
|
14
|
+
test('Molecule › MoleculeCourseSection › Course › should be rendered', renderComponentMacro, MoleculeCourseSection, fixtureCourse);
|
|
15
|
+
//# sourceMappingURL=fixtures.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/course-section/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","MoleculeCourseSection","fixtureChapter","fixtureCourse","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,qBAAP,MAAkC,IAAlC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AAEAL,IAAI,CAAC,gEAAD,EAAmEM,CAAC,IAAI;AAC1EA,EAAAA,CAAC,CAACC,IAAF;AACAN,EAAAA,OAAO,CAACE,qBAAqB,CAACK,SAAvB,EAAkC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACvDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,0DAAyDF,GAAI,mEAAtF;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAV,IAAI,CAAC,iEAAD,EAAoEE,oBAApE,EAA0FC,qBAA1F,EAAiHC,cAAjH,CAAJ;AACAJ,IAAI,CAAC,gEAAD,EAAmEE,oBAAnE,EAAyFC,qBAAzF,EAAgHE,aAAhH,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport MoleculeCourseSection from '..';\nimport fixtureChapter from './fixtures/chapter';\nimport fixtureCourse from './fixtures/course';\n\ntest('Molecule › MoleculeCourseSection > should have valid propTypes', t => {\n t.pass();\n forEach(MoleculeCourseSection.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Molecule.MoleculeCourseSection.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Molecule › MoleculeCourseSection › Chapter › should be rendered', renderComponentMacro, MoleculeCourseSection, fixtureChapter);\ntest('Molecule › MoleculeCourseSection › Course › should be rendered', renderComponentMacro, MoleculeCourseSection, fixtureCourse);\n"],"file":"fixtures.js"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import classnames from 'classnames';
|
|
4
|
+
import style from './style.css';
|
|
5
|
+
|
|
6
|
+
const preventDefault = e => e.preventDefault();
|
|
7
|
+
|
|
8
|
+
const stopPropagation = e => e.stopPropagation();
|
|
9
|
+
|
|
10
|
+
const Draggable = props => {
|
|
11
|
+
const {
|
|
12
|
+
id,
|
|
13
|
+
dragging = false,
|
|
14
|
+
onDragStart,
|
|
15
|
+
onDragOver,
|
|
16
|
+
onDragLeave,
|
|
17
|
+
onDrop,
|
|
18
|
+
children
|
|
19
|
+
} = props;
|
|
20
|
+
const dragStartHandler = useCallback(e => {
|
|
21
|
+
stopPropagation(e);
|
|
22
|
+
onDragStart(id);
|
|
23
|
+
}, [id, onDragStart]);
|
|
24
|
+
const dragOverHandler = useCallback(e => {
|
|
25
|
+
preventDefault(e);
|
|
26
|
+
onDragOver(id);
|
|
27
|
+
}, [id, onDragOver]);
|
|
28
|
+
const dragLeaveHandler = useCallback(e => {
|
|
29
|
+
preventDefault(e);
|
|
30
|
+
onDragLeave(id);
|
|
31
|
+
}, [id, onDragLeave]);
|
|
32
|
+
const dropHandler = useCallback(e => {
|
|
33
|
+
preventDefault(e);
|
|
34
|
+
onDrop(id);
|
|
35
|
+
}, [id, onDrop]);
|
|
36
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
37
|
+
className: classnames(dragging ? style.dragging : null, style.section, style.draggable),
|
|
38
|
+
onDragStart: dragStartHandler,
|
|
39
|
+
onDragOver: dragOverHandler,
|
|
40
|
+
onDragLeave: dragLeaveHandler,
|
|
41
|
+
onDrop: dropHandler,
|
|
42
|
+
draggable: true
|
|
43
|
+
}, children);
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
Draggable.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
47
|
+
id: PropTypes.string,
|
|
48
|
+
dragging: PropTypes.bool,
|
|
49
|
+
onDragStart: PropTypes.func,
|
|
50
|
+
onDragOver: PropTypes.func,
|
|
51
|
+
onDragLeave: PropTypes.func,
|
|
52
|
+
onDrop: PropTypes.func,
|
|
53
|
+
children: PropTypes.element
|
|
54
|
+
} : {};
|
|
55
|
+
export default Draggable;
|
|
56
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/draggable/index.js"],"names":["React","useCallback","PropTypes","classnames","style","preventDefault","e","stopPropagation","Draggable","props","id","dragging","onDragStart","onDragOver","onDragLeave","onDrop","children","dragStartHandler","dragOverHandler","dragLeaveHandler","dropHandler","section","draggable","propTypes","string","bool","func","element"],"mappings":"AAAA,OAAOA,KAAP,IAAeC,WAAf,QAAiC,OAAjC;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,cAAc,GAAGC,CAAC,IAAIA,CAAC,CAACD,cAAF,EAA5B;;AACA,MAAME,eAAe,GAAGD,CAAC,IAAIA,CAAC,CAACC,eAAF,EAA7B;;AAEA,MAAMC,SAAS,GAAGC,KAAK,IAAI;AACzB,QAAM;AAACC,IAAAA,EAAD;AAAKC,IAAAA,QAAQ,GAAG,KAAhB;AAAuBC,IAAAA,WAAvB;AAAoCC,IAAAA,UAApC;AAAgDC,IAAAA,WAAhD;AAA6DC,IAAAA,MAA7D;AAAqEC,IAAAA;AAArE,MAAiFP,KAAvF;AAEA,QAAMQ,gBAAgB,GAAGhB,WAAW,CAClCK,CAAC,IAAI;AACHC,IAAAA,eAAe,CAACD,CAAD,CAAf;AACAM,IAAAA,WAAW,CAACF,EAAD,CAAX;AACD,GAJiC,EAKlC,CAACA,EAAD,EAAKE,WAAL,CALkC,CAApC;AAOA,QAAMM,eAAe,GAAGjB,WAAW,CACjCK,CAAC,IAAI;AACHD,IAAAA,cAAc,CAACC,CAAD,CAAd;AACAO,IAAAA,UAAU,CAACH,EAAD,CAAV;AACD,GAJgC,EAKjC,CAACA,EAAD,EAAKG,UAAL,CALiC,CAAnC;AAOA,QAAMM,gBAAgB,GAAGlB,WAAW,CAClCK,CAAC,IAAI;AACHD,IAAAA,cAAc,CAACC,CAAD,CAAd;AACAQ,IAAAA,WAAW,CAACJ,EAAD,CAAX;AACD,GAJiC,EAKlC,CAACA,EAAD,EAAKI,WAAL,CALkC,CAApC;AAOA,QAAMM,WAAW,GAAGnB,WAAW,CAC7BK,CAAC,IAAI;AACHD,IAAAA,cAAc,CAACC,CAAD,CAAd;AACAS,IAAAA,MAAM,CAACL,EAAD,CAAN;AACD,GAJ4B,EAK7B,CAACA,EAAD,EAAKK,MAAL,CAL6B,CAA/B;AAQA,sBACE;AACE,IAAA,SAAS,EAAEZ,UAAU,CAACQ,QAAQ,GAAGP,KAAK,CAACO,QAAT,GAAoB,IAA7B,EAAmCP,KAAK,CAACiB,OAAzC,EAAkDjB,KAAK,CAACkB,SAAxD,CADvB;AAEE,IAAA,WAAW,EAAEL,gBAFf;AAGE,IAAA,UAAU,EAAEC,eAHd;AAIE,IAAA,WAAW,EAAEC,gBAJf;AAKE,IAAA,MAAM,EAAEC,WALV;AAME,IAAA,SAAS;AANX,KAQGJ,QARH,CADF;AAYD,CA5CD;;AA6CAR,SAAS,CAACe,SAAV,2CAAsB;AACpBb,EAAAA,EAAE,EAAER,SAAS,CAACsB,MADM;AAEpBb,EAAAA,QAAQ,EAAET,SAAS,CAACuB,IAFA;AAGpBb,EAAAA,WAAW,EAAEV,SAAS,CAACwB,IAHH;AAIpBb,EAAAA,UAAU,EAAEX,SAAS,CAACwB,IAJF;AAKpBZ,EAAAA,WAAW,EAAEZ,SAAS,CAACwB,IALH;AAMpBX,EAAAA,MAAM,EAAEb,SAAS,CAACwB,IANE;AAOpBV,EAAAA,QAAQ,EAAEd,SAAS,CAACyB;AAPA,CAAtB;AAUA,eAAenB,SAAf","sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport style from './style.css';\n\nconst preventDefault = e => e.preventDefault();\nconst stopPropagation = e => e.stopPropagation();\n\nconst Draggable = props => {\n const {id, dragging = false, onDragStart, onDragOver, onDragLeave, onDrop, children} = props;\n\n const dragStartHandler = useCallback(\n e => {\n stopPropagation(e);\n onDragStart(id);\n },\n [id, onDragStart]\n );\n const dragOverHandler = useCallback(\n e => {\n preventDefault(e);\n onDragOver(id);\n },\n [id, onDragOver]\n );\n const dragLeaveHandler = useCallback(\n e => {\n preventDefault(e);\n onDragLeave(id);\n },\n [id, onDragLeave]\n );\n const dropHandler = useCallback(\n e => {\n preventDefault(e);\n onDrop(id);\n },\n [id, onDrop]\n );\n\n return (\n <div\n className={classnames(dragging ? style.dragging : null, style.section, style.draggable)}\n onDragStart={dragStartHandler}\n onDragOver={dragOverHandler}\n onDragLeave={dragLeaveHandler}\n onDrop={dropHandler}\n draggable\n >\n {children}\n </div>\n );\n};\nDraggable.propTypes = {\n id: PropTypes.string,\n dragging: PropTypes.bool,\n onDragStart: PropTypes.func,\n onDragOver: PropTypes.func,\n onDragLeave: PropTypes.func,\n onDrop: PropTypes.func,\n children: PropTypes.element\n};\n\nexport default Draggable;\n"],"file":"index.js"}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
@value breakpoints: "../../variables/breakpoints.css";
|
|
2
|
+
@value mobile from breakpoints;
|
|
3
|
+
@value colors: "../../variables/colors.css";
|
|
4
|
+
@value medium from colors;
|
|
5
|
+
@value xtraLightGrey from colors;
|
|
6
|
+
@value dark from colors;
|
|
7
|
+
@value cm_grey_100 from colors;
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
.section {
|
|
11
|
+
display: flex;
|
|
12
|
+
justify-content: center;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.draggable {
|
|
16
|
+
cursor: grab;
|
|
17
|
+
position: relative;
|
|
18
|
+
background: transparent;
|
|
19
|
+
margin: 8px 0;
|
|
20
|
+
border-radius: 7px;
|
|
21
|
+
}
|
|
22
|
+
.draggable:hover{
|
|
23
|
+
background: rgba(0, 0, 0, 0.3);
|
|
24
|
+
}
|
|
25
|
+
.draggable:active{
|
|
26
|
+
background: transparent;
|
|
27
|
+
}
|
|
28
|
+
.draggable:before {
|
|
29
|
+
content: '.';
|
|
30
|
+
position: absolute;
|
|
31
|
+
left: 23px;
|
|
32
|
+
top: 5px;
|
|
33
|
+
width: 12px;
|
|
34
|
+
font-size: 25px;
|
|
35
|
+
color: medium;
|
|
36
|
+
pointer-events: none;
|
|
37
|
+
text-shadow: 0 0 medium, 0 5px medium, 0 10px medium, 0 15px medium,
|
|
38
|
+
5px 0 medium , 5px 5px medium, 5px 10px medium, 5px 15px medium;
|
|
39
|
+
}
|
|
40
|
+
.dragging {
|
|
41
|
+
background: rgba(0, 0, 0, 0.1);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.dragging:after {
|
|
45
|
+
position: absolute;
|
|
46
|
+
content: "";
|
|
47
|
+
left: 0;
|
|
48
|
+
top: 0;
|
|
49
|
+
bottom: 0;
|
|
50
|
+
right: 0;
|
|
51
|
+
background: color(black lightness(95%));
|
|
52
|
+
pointer-events: none;
|
|
53
|
+
box-sizing: border-box;
|
|
54
|
+
display: flex;
|
|
55
|
+
justify-content: center;
|
|
56
|
+
align-items: center;
|
|
57
|
+
color: dark;
|
|
58
|
+
font-family: 'Open Sans';
|
|
59
|
+
font-weight: 600;
|
|
60
|
+
font-size: 14px;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
@media mobile {
|
|
64
|
+
.draggable:before {
|
|
65
|
+
content: none;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
props: {
|
|
3
|
+
id: 'draggableId',
|
|
4
|
+
dragging: true,
|
|
5
|
+
onDragStart: () => console.log('onDragStart'),
|
|
6
|
+
onDragOver: () => console.log('onDragOver'),
|
|
7
|
+
onDragLeave: () => console.log('onDragLeave'),
|
|
8
|
+
onDrop: () => console.log('onDrop'),
|
|
9
|
+
children: []
|
|
10
|
+
}
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=default.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/draggable/test/fixtures/default.js"],"names":["props","id","dragging","onDragStart","console","log","onDragOver","onDragLeave","onDrop","children"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,EAAE,EAAE,aADC;AAELC,IAAAA,QAAQ,EAAE,IAFL;AAGLC,IAAAA,WAAW,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,aAAZ,CAHd;AAILC,IAAAA,UAAU,EAAE,MAAMF,OAAO,CAACC,GAAR,CAAY,YAAZ,CAJb;AAKLE,IAAAA,WAAW,EAAE,MAAMH,OAAO,CAACC,GAAR,CAAY,aAAZ,CALd;AAMLG,IAAAA,MAAM,EAAE,MAAMJ,OAAO,CAACC,GAAR,CAAY,QAAZ,CANT;AAOLI,IAAAA,QAAQ,EAAE;AAPL;AADM,CAAf","sourcesContent":["export default {\n props: {\n id: 'draggableId',\n dragging: true,\n onDragStart: () => console.log('onDragStart'),\n onDragOver: () => console.log('onDragOver'),\n onDragLeave: () => console.log('onDragLeave'),\n onDrop: () => console.log('onDrop'),\n children: []\n }\n};\n"],"file":"default.js"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import test from 'ava';
|
|
2
|
+
import forEach from 'lodash/forEach';
|
|
3
|
+
import renderComponentMacro from '../../../test/helpers/render-component';
|
|
4
|
+
import MoleculeDraggable from '..';
|
|
5
|
+
import fixtureDefault from './fixtures/default';
|
|
6
|
+
test('Molecule › MoleculeDraggable > should have valid propTypes', t => {
|
|
7
|
+
t.pass();
|
|
8
|
+
forEach(MoleculeDraggable.propTypes, (value, key) => {
|
|
9
|
+
t.not(value, undefined, `PropType for "Molecule.MoleculeDraggable.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
|
|
10
|
+
});
|
|
11
|
+
});
|
|
12
|
+
test('Molecule › MoleculeDraggable › Default › should be rendered', renderComponentMacro, MoleculeDraggable, fixtureDefault);
|
|
13
|
+
//# sourceMappingURL=fixtures.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/draggable/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","MoleculeDraggable","fixtureDefault","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,iBAAP,MAA8B,IAA9B;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AAEAJ,IAAI,CAAC,4DAAD,EAA+DK,CAAC,IAAI;AACtEA,EAAAA,CAAC,CAACC,IAAF;AACAL,EAAAA,OAAO,CAACE,iBAAiB,CAACI,SAAnB,EAA8B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACnDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,sDAAqDF,GAAI,mEAAlF;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAT,IAAI,CAAC,6DAAD,EAAgEE,oBAAhE,EAAsFC,iBAAtF,EAAyGC,cAAzG,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport MoleculeDraggable from '..';\nimport fixtureDefault from './fixtures/default';\n\ntest('Molecule › MoleculeDraggable > should have valid propTypes', t => {\n t.pass();\n forEach(MoleculeDraggable.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Molecule.MoleculeDraggable.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Molecule › MoleculeDraggable › Default › should be rendered', renderComponentMacro, MoleculeDraggable, fixtureDefault);\n"],"file":"fixtures.js"}
|
|
@@ -0,0 +1,54 @@
|
|
|
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
|
+
|
|
3
|
+
import React, { useState, useCallback } from 'react';
|
|
4
|
+
import PropTypes from 'prop-types';
|
|
5
|
+
import Draggable from '../draggable';
|
|
6
|
+
import SetupSection from '../setup-section';
|
|
7
|
+
const ITEMS = {
|
|
8
|
+
'setup-section': SetupSection
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
const SetupSections = ({
|
|
12
|
+
items,
|
|
13
|
+
onDrop,
|
|
14
|
+
itemType
|
|
15
|
+
}) => {
|
|
16
|
+
const [dragTo, setDragTo] = useState(null);
|
|
17
|
+
const [dragFrom, setDragFrom] = useState(null);
|
|
18
|
+
const dragStartHandler = useCallback(id => {
|
|
19
|
+
setDragFrom(id);
|
|
20
|
+
}, [setDragFrom]);
|
|
21
|
+
const dragOverHandler = useCallback(id => {
|
|
22
|
+
if (dragTo === id) return;
|
|
23
|
+
setDragTo(id);
|
|
24
|
+
}, [dragTo, setDragTo]);
|
|
25
|
+
const dragLeaveHandler = useCallback(id => {
|
|
26
|
+
setDragTo(null);
|
|
27
|
+
}, [setDragTo]);
|
|
28
|
+
const dropHandler = useCallback(id => {
|
|
29
|
+
if (onDrop && dragFrom) onDrop(dragFrom, id);
|
|
30
|
+
setDragTo(null);
|
|
31
|
+
setDragFrom(null);
|
|
32
|
+
}, [onDrop, setDragTo, setDragFrom, dragFrom]);
|
|
33
|
+
const Item = ITEMS[itemType];
|
|
34
|
+
const itemsView = items.map(item => /*#__PURE__*/React.createElement(Draggable, {
|
|
35
|
+
key: item.id,
|
|
36
|
+
id: item.id,
|
|
37
|
+
dragging: dragTo === item.id,
|
|
38
|
+
onDragStart: dragStartHandler,
|
|
39
|
+
onDragOver: dragOverHandler,
|
|
40
|
+
onDragLeave: dragLeaveHandler,
|
|
41
|
+
onDrop: dropHandler
|
|
42
|
+
}, /*#__PURE__*/React.createElement(Item, _extends({}, item, {
|
|
43
|
+
key: item.id
|
|
44
|
+
}))));
|
|
45
|
+
return /*#__PURE__*/React.createElement("div", null, itemsView);
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
SetupSections.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
49
|
+
items: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),
|
|
50
|
+
onDrop: PropTypes.func,
|
|
51
|
+
itemType: PropTypes.string
|
|
52
|
+
} : {};
|
|
53
|
+
export default SetupSections;
|
|
54
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/draggable-list/index.js"],"names":["React","useState","useCallback","PropTypes","Draggable","SetupSection","ITEMS","SetupSections","items","onDrop","itemType","dragTo","setDragTo","dragFrom","setDragFrom","dragStartHandler","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","propTypes","arrayOf","shape","func","string"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AAEA,MAAMC,KAAK,GAAG;AAAC,mBAAiBD;AAAlB,CAAd;;AAEA,MAAME,aAAa,GAAG,CAAC;AAACC,EAAAA,KAAD;AAAQC,EAAAA,MAAR;AAAgBC,EAAAA;AAAhB,CAAD,KAA+B;AACnD,QAAM,CAACC,MAAD,EAASC,SAAT,IAAsBX,QAAQ,CAAC,IAAD,CAApC;AACA,QAAM,CAACY,QAAD,EAAWC,WAAX,IAA0Bb,QAAQ,CAAC,IAAD,CAAxC;AAEA,QAAMc,gBAAgB,GAAGb,WAAW,CAClCc,EAAE,IAAI;AACJF,IAAAA,WAAW,CAACE,EAAD,CAAX;AACD,GAHiC,EAIlC,CAACF,WAAD,CAJkC,CAApC;AAOA,QAAMG,eAAe,GAAGf,WAAW,CACjCc,EAAE,IAAI;AACJ,QAAIL,MAAM,KAAKK,EAAf,EAAmB;AACnBJ,IAAAA,SAAS,CAACI,EAAD,CAAT;AACD,GAJgC,EAKjC,CAACL,MAAD,EAASC,SAAT,CALiC,CAAnC;AAQA,QAAMM,gBAAgB,GAAGhB,WAAW,CAClCc,EAAE,IAAI;AACJJ,IAAAA,SAAS,CAAC,IAAD,CAAT;AACD,GAHiC,EAIlC,CAACA,SAAD,CAJkC,CAApC;AAOA,QAAMO,WAAW,GAAGjB,WAAW,CAC7Bc,EAAE,IAAI;AACJ,QAAIP,MAAM,IAAII,QAAd,EAAwBJ,MAAM,CAACI,QAAD,EAAWG,EAAX,CAAN;AAExBJ,IAAAA,SAAS,CAAC,IAAD,CAAT;AACAE,IAAAA,WAAW,CAAC,IAAD,CAAX;AACD,GAN4B,EAO7B,CAACL,MAAD,EAASG,SAAT,EAAoBE,WAApB,EAAiCD,QAAjC,CAP6B,CAA/B;AAUA,QAAMO,IAAI,GAAGd,KAAK,CAACI,QAAD,CAAlB;AACA,QAAMW,SAAS,GAAGb,KAAK,CAACc,GAAN,CAAUC,IAAI,iBAC9B,oBAAC,SAAD;AACE,IAAA,GAAG,EAAEA,IAAI,CAACP,EADZ;AAEE,IAAA,EAAE,EAAEO,IAAI,CAACP,EAFX;AAGE,IAAA,QAAQ,EAAEL,MAAM,KAAKY,IAAI,CAACP,EAH5B;AAIE,IAAA,WAAW,EAAED,gBAJf;AAKE,IAAA,UAAU,EAAEE,eALd;AAME,IAAA,WAAW,EAAEC,gBANf;AAOE,IAAA,MAAM,EAAEC;AAPV,kBASE,oBAAC,IAAD,eAAUI,IAAV;AAAgB,IAAA,GAAG,EAAEA,IAAI,CAACP;AAA1B,KATF,CADgB,CAAlB;AAaA,sBAAO,iCAAMK,SAAN,CAAP;AACD,CAnDD;;AAqDAd,aAAa,CAACiB,SAAd,2CAA0B;AACxBhB,EAAAA,KAAK,EAAEL,SAAS,CAACsB,OAAV,CAAkBtB,SAAS,CAACuB,KAAV,CAAgBrB,YAAY,CAACmB,SAA7B,CAAlB,CADiB;AAExBf,EAAAA,MAAM,EAAEN,SAAS,CAACwB,IAFM;AAGxBjB,EAAAA,QAAQ,EAAEP,SAAS,CAACyB;AAHI,CAA1B;AAMA,eAAerB,aAAf","sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Draggable from '../draggable';\nimport SetupSection from '../setup-section';\n\nconst ITEMS = {'setup-section': SetupSection};\n\nconst SetupSections = ({items, onDrop, itemType}) => {\n const [dragTo, setDragTo] = useState(null);\n const [dragFrom, setDragFrom] = useState(null);\n\n const dragStartHandler = useCallback(\n id => {\n setDragFrom(id);\n },\n [setDragFrom]\n );\n\n const dragOverHandler = useCallback(\n id => {\n if (dragTo === id) return;\n setDragTo(id);\n },\n [dragTo, setDragTo]\n );\n\n const dragLeaveHandler = useCallback(\n id => {\n setDragTo(null);\n },\n [setDragTo]\n );\n\n const dropHandler = useCallback(\n id => {\n if (onDrop && dragFrom) onDrop(dragFrom, id);\n\n setDragTo(null);\n setDragFrom(null);\n },\n [onDrop, setDragTo, setDragFrom, dragFrom]\n );\n\n const Item = ITEMS[itemType];\n const itemsView = items.map(item => (\n <Draggable\n key={item.id}\n id={item.id}\n dragging={dragTo === item.id}\n onDragStart={dragStartHandler}\n onDragOver={dragOverHandler}\n onDragLeave={dragLeaveHandler}\n onDrop={dropHandler}\n >\n <Item {...item} key={item.id} />\n </Draggable>\n ));\n return <div>{itemsView}</div>;\n};\n\nSetupSections.propTypes = {\n items: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),\n onDrop: PropTypes.func,\n itemType: PropTypes.string\n};\n\nexport default SetupSections;\n"],"file":"index.js"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import Boutique from '../../../setup-section/test/fixtures/analytics-boutique';
|
|
2
|
+
import Branch from '../../../setup-section/test/fixtures/analytics-branch';
|
|
3
|
+
import Region from '../../../setup-section/test/fixtures/analytics-region';
|
|
4
|
+
const {
|
|
5
|
+
props: boutique
|
|
6
|
+
} = Boutique;
|
|
7
|
+
const {
|
|
8
|
+
props: branch
|
|
9
|
+
} = Branch;
|
|
10
|
+
const {
|
|
11
|
+
props: region
|
|
12
|
+
} = Region;
|
|
13
|
+
export default {
|
|
14
|
+
props: {
|
|
15
|
+
itemType: 'setup-section',
|
|
16
|
+
items: [boutique, branch, region],
|
|
17
|
+
onDrop: (dragged, dropped) => {
|
|
18
|
+
console.log('foo');
|
|
19
|
+
console.log({
|
|
20
|
+
dragged,
|
|
21
|
+
dropped
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=dashboard-sections.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/draggable-list/test/fixtures/dashboard-sections.js"],"names":["Boutique","Branch","Region","props","boutique","branch","region","itemType","items","onDrop","dragged","dropped","console","log"],"mappings":"AAAA,OAAOA,QAAP,MAAqB,yDAArB;AACA,OAAOC,MAAP,MAAmB,uDAAnB;AACA,OAAOC,MAAP,MAAmB,uDAAnB;AAEA,MAAM;AAACC,EAAAA,KAAK,EAAEC;AAAR,IAAoBJ,QAA1B;AACA,MAAM;AAACG,EAAAA,KAAK,EAAEE;AAAR,IAAkBJ,MAAxB;AACA,MAAM;AAACE,EAAAA,KAAK,EAAEG;AAAR,IAAkBJ,MAAxB;AAEA,eAAe;AACbC,EAAAA,KAAK,EAAE;AACLI,IAAAA,QAAQ,EAAE,eADL;AAELC,IAAAA,KAAK,EAAE,CAACJ,QAAD,EAAWC,MAAX,EAAmBC,MAAnB,CAFF;AAGLG,IAAAA,MAAM,EAAE,CAACC,OAAD,EAAUC,OAAV,KAAsB;AAC5BC,MAAAA,OAAO,CAACC,GAAR,CAAY,KAAZ;AACAD,MAAAA,OAAO,CAACC,GAAR,CAAY;AAACH,QAAAA,OAAD;AAAUC,QAAAA;AAAV,OAAZ;AACD;AANI;AADM,CAAf","sourcesContent":["import Boutique from '../../../setup-section/test/fixtures/analytics-boutique';\nimport Branch from '../../../setup-section/test/fixtures/analytics-branch';\nimport Region from '../../../setup-section/test/fixtures/analytics-region';\n\nconst {props: boutique} = Boutique;\nconst {props: branch} = Branch;\nconst {props: region} = Region;\n\nexport default {\n props: {\n itemType: 'setup-section',\n items: [boutique, branch, region],\n onDrop: (dragged, dropped) => {\n console.log('foo');\n console.log({dragged, dropped});\n }\n }\n};\n"],"file":"dashboard-sections.js"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import test from 'ava';
|
|
2
|
+
import forEach from 'lodash/forEach';
|
|
3
|
+
import renderComponentMacro from '../../../test/helpers/render-component';
|
|
4
|
+
import MoleculeDraggableList from '..';
|
|
5
|
+
import fixtureDashboardSections from './fixtures/dashboard-sections';
|
|
6
|
+
test('Molecule › MoleculeDraggableList > should have valid propTypes', t => {
|
|
7
|
+
t.pass();
|
|
8
|
+
forEach(MoleculeDraggableList.propTypes, (value, key) => {
|
|
9
|
+
t.not(value, undefined, `PropType for "Molecule.MoleculeDraggableList.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
|
|
10
|
+
});
|
|
11
|
+
});
|
|
12
|
+
test('Molecule › MoleculeDraggableList › DashboardSections › should be rendered', renderComponentMacro, MoleculeDraggableList, fixtureDashboardSections);
|
|
13
|
+
//# sourceMappingURL=fixtures.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/draggable-list/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","MoleculeDraggableList","fixtureDashboardSections","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,qBAAP,MAAkC,IAAlC;AACA,OAAOC,wBAAP,MAAqC,+BAArC;AAEAJ,IAAI,CAAC,gEAAD,EAAmEK,CAAC,IAAI;AAC1EA,EAAAA,CAAC,CAACC,IAAF;AACAL,EAAAA,OAAO,CAACE,qBAAqB,CAACI,SAAvB,EAAkC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACvDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,0DAAyDF,GAAI,mEAAtF;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAT,IAAI,CAAC,2EAAD,EAA8EE,oBAA9E,EAAoGC,qBAApG,EAA2HC,wBAA3H,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport MoleculeDraggableList from '..';\nimport fixtureDashboardSections from './fixtures/dashboard-sections';\n\ntest('Molecule › MoleculeDraggableList > should have valid propTypes', t => {\n t.pass();\n forEach(MoleculeDraggableList.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Molecule.MoleculeDraggableList.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Molecule › MoleculeDraggableList › DashboardSections › should be rendered', renderComponentMacro, MoleculeDraggableList, fixtureDashboardSections);\n"],"file":"fixtures.js"}
|
|
@@ -10,16 +10,16 @@ import Adapter from 'enzyme-adapter-react-16';
|
|
|
10
10
|
import { wrappingComponent } from '../../../test/helpers/render-component';
|
|
11
11
|
import SetupSections from '..'; // eslint-disable-next-line css-modules/no-unused-class
|
|
12
12
|
|
|
13
|
-
import style from '
|
|
14
|
-
import fixtures from './fixtures/
|
|
13
|
+
import style from '../../draggable/style.css';
|
|
14
|
+
import fixtures from './fixtures/dashboard-sections';
|
|
15
15
|
browserEnv();
|
|
16
16
|
configure({
|
|
17
17
|
adapter: new Adapter()
|
|
18
18
|
});
|
|
19
19
|
test('should trigger onDrop handler', t => {
|
|
20
20
|
t.plan(7);
|
|
21
|
-
const elementToDrag = fixtures.props.
|
|
22
|
-
const elementToDrop = fixtures.props.
|
|
21
|
+
const elementToDrag = fixtures.props.items[0].id;
|
|
22
|
+
const elementToDrop = fixtures.props.items[2].id;
|
|
23
23
|
|
|
24
24
|
const dropHandler = (dragged, dropped) => {
|
|
25
25
|
t.is(dropped, elementToDrop);
|
|
@@ -74,7 +74,7 @@ test('should skip dragStart event if section id is not defined', t => {
|
|
|
74
74
|
t.fail();
|
|
75
75
|
};
|
|
76
76
|
|
|
77
|
-
const wrapper = mount( /*#__PURE__*/React.createElement(SetupSections, _extends({}, _set('
|
|
77
|
+
const wrapper = mount( /*#__PURE__*/React.createElement(SetupSections, _extends({}, _set('items.0.id', '', fixtures.props), {
|
|
78
78
|
onDrop: dropHandler
|
|
79
79
|
})), {
|
|
80
80
|
wrappingComponent
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/draggable-list/test/on-drop.js"],"names":["browserEnv","test","React","mount","configure","Adapter","wrappingComponent","SetupSections","style","fixtures","adapter","t","plan","elementToDrag","props","items","id","elementToDrop","dropHandler","dragged","dropped","is","wrapper","dragStartEvent","preventDefault","pass","dragOverEvent","dragLeaveEvent","dropEvent","find","section","at","simulate","fail"],"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 {set} from 'lodash/fp';\nimport Adapter from 'enzyme-adapter-react-16';\nimport {wrappingComponent} from '../../../test/helpers/render-component';\nimport SetupSections from '..';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from '../../draggable/style.css';\nimport fixtures from './fixtures/dashboard-sections';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\ntest('should trigger onDrop handler', t => {\n t.plan(7);\n\n const elementToDrag = fixtures.props.items[0].id;\n const elementToDrop = fixtures.props.items[2].id;\n\n const dropHandler = (dragged, dropped) => {\n t.is(dropped, elementToDrop);\n t.is(dragged, elementToDrag);\n };\n\n const wrapper = mount(<SetupSections {...fixtures.props} onDrop={dropHandler} />, {\n wrappingComponent\n });\n\n const dragStartEvent = {preventDefault: () => t.pass()};\n const dragOverEvent = {preventDefault: () => t.pass()};\n const dragLeaveEvent = {preventDefault: () => t.pass()};\n const dropEvent = {preventDefault: () => t.pass()};\n\n wrapper.find(`.${style.section}`).at(0).simulate('dragStart', dragStartEvent);\n wrapper.find(`.${style.section}`).at(0).simulate('dragOver', dragOverEvent);\n wrapper.find(`.${style.section}`).at(0).simulate('dragOver', dragOverEvent);\n wrapper.find(`.${style.section}`).at(0).simulate('dragLeave', dragLeaveEvent);\n wrapper.find(`.${style.section}`).at(2).simulate('dragOver', dragOverEvent);\n wrapper.find(`.${style.section}`).at(2).simulate('drop', dropEvent);\n});\n\ntest('should skip drop event if dragStart is not called', t => {\n t.plan(1);\n\n const dropHandler = (dragged, dropped) => {\n t.fail();\n };\n\n const wrapper = mount(<SetupSections {...fixtures.props} onDrop={dropHandler} />, {\n wrappingComponent\n });\n\n const dropEvent = {preventDefault: () => t.pass()};\n wrapper.find(`.${style.section}`).at(2).simulate('drop', dropEvent);\n});\n\ntest('should skip dragStart event if section id is not defined', t => {\n t.plan(0);\n\n const dropHandler = (dragged, dropped) => {\n t.fail();\n };\n\n const wrapper = mount(\n <SetupSections {...set('items.0.id', '', fixtures.props)} onDrop={dropHandler} />,\n {\n wrappingComponent\n }\n );\n\n const dragStartEvent = {preventDefault: () => {}};\n const dragOverEvent = {preventDefault: () => {}};\n const dragLeaveEvent = {preventDefault: () => {}};\n const dropEvent = {preventDefault: () => {}};\n\n wrapper.find(`.${style.section}`).at(0).simulate('dragStart', dragStartEvent);\n wrapper.find(`.${style.section}`).at(0).simulate('dragOver', dragOverEvent);\n wrapper.find(`.${style.section}`).at(0).simulate('dragOver', dragOverEvent);\n wrapper.find(`.${style.section}`).at(0).simulate('dragLeave', dragLeaveEvent);\n wrapper.find(`.${style.section}`).at(2).simulate('dragOver', dragOverEvent);\n wrapper.find(`.${style.section}`).at(2).simulate('drop', dropEvent);\n});\n"],"file":"on-drop.js"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import test from 'ava';
|
|
2
|
+
import forEach from 'lodash/forEach';
|
|
3
|
+
import renderComponentMacro from '../../../test/helpers/render-component';
|
|
4
|
+
import MoleculeSearch from '..';
|
|
5
|
+
import fixtureDefault from './fixtures/default';
|
|
6
|
+
import fixtureWithValue from './fixtures/with-value';
|
|
7
|
+
test('Molecule › MoleculeSearch > should have valid propTypes', t => {
|
|
8
|
+
t.pass();
|
|
9
|
+
forEach(MoleculeSearch.propTypes, (value, key) => {
|
|
10
|
+
t.not(value, undefined, `PropType for "Molecule.MoleculeSearch.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
|
|
11
|
+
});
|
|
12
|
+
});
|
|
13
|
+
test('Molecule › MoleculeSearch › Default › should be rendered', renderComponentMacro, MoleculeSearch, fixtureDefault);
|
|
14
|
+
test('Molecule › MoleculeSearch › WithValue › should be rendered', renderComponentMacro, MoleculeSearch, fixtureWithValue);
|
|
15
|
+
//# sourceMappingURL=fixtures.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/search/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","MoleculeSearch","fixtureDefault","fixtureWithValue","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,cAAP,MAA2B,IAA3B;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,gBAAP,MAA6B,uBAA7B;AAEAL,IAAI,CAAC,yDAAD,EAA4DM,CAAC,IAAI;AACnEA,EAAAA,CAAC,CAACC,IAAF;AACAN,EAAAA,OAAO,CAACE,cAAc,CAACK,SAAhB,EAA2B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AAChDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,mDAAkDF,GAAI,mEAA/E;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAV,IAAI,CAAC,0DAAD,EAA6DE,oBAA7D,EAAmFC,cAAnF,EAAmGC,cAAnG,CAAJ;AACAJ,IAAI,CAAC,4DAAD,EAA+DE,oBAA/D,EAAqFC,cAArF,EAAqGE,gBAArG,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport MoleculeSearch from '..';\nimport fixtureDefault from './fixtures/default';\nimport fixtureWithValue from './fixtures/with-value';\n\ntest('Molecule › MoleculeSearch > should have valid propTypes', t => {\n t.pass();\n forEach(MoleculeSearch.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Molecule.MoleculeSearch.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Molecule › MoleculeSearch › Default › should be rendered', renderComponentMacro, MoleculeSearch, fixtureDefault);\ntest('Molecule › MoleculeSearch › WithValue › should be rendered', renderComponentMacro, MoleculeSearch, fixtureWithValue);\n"],"file":"fixtures.js"}
|
|
@@ -352,6 +352,7 @@
|
|
|
352
352
|
|
|
353
353
|
.coorpmanager .descriptionLabel {
|
|
354
354
|
margin: 0 1px 18px 0;
|
|
355
|
+
padding: 8px 16px;
|
|
355
356
|
border-radius: 7px;
|
|
356
357
|
background-color: cm_grey_700;
|
|
357
358
|
flex-grow: 0;
|
|
@@ -365,14 +366,16 @@
|
|
|
365
366
|
text-align: center;
|
|
366
367
|
color: white;
|
|
367
368
|
padding: 8px 16px;
|
|
368
|
-
max-width:
|
|
369
|
-
position: absolute;
|
|
370
|
-
left: -20px;
|
|
371
|
-
z-index: 999;
|
|
372
|
-
bottom: 18px;
|
|
369
|
+
max-width: 348px;
|
|
373
370
|
width: max-content;
|
|
371
|
+
position: absolute;
|
|
372
|
+
left: -24px;
|
|
373
|
+
z-index: 3;
|
|
374
|
+
bottom: 5px;
|
|
374
375
|
visibility: hidden;
|
|
375
376
|
opacity: 0;
|
|
377
|
+
overflow-wrap: break-word;
|
|
378
|
+
white-space: break-spaces;
|
|
376
379
|
}
|
|
377
380
|
|
|
378
381
|
.coorpmanager .title.titleWithSelection .descriptionLabel,
|
|
@@ -4,7 +4,6 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
4
4
|
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
|
-
import { NovaCompositionNavigationArrowDown as ArrowDownIcon, NovaCompositionNavigationArrowTop as ArrowUpIcon } from '@coorpacademy/nova-icons';
|
|
8
7
|
import Provider from '../../atom/provider';
|
|
9
8
|
import InputSwitch from '../../atom/input-switch';
|
|
10
9
|
import RadioGroup from '../../atom/radio-group';
|
|
@@ -45,23 +44,13 @@ ContentTypesToggler.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
45
44
|
|
|
46
45
|
const SetupSection = (props, context) => {
|
|
47
46
|
const {
|
|
48
|
-
translate
|
|
49
|
-
skin
|
|
47
|
+
translate
|
|
50
48
|
} = context;
|
|
51
|
-
|
|
52
|
-
const brand = _get('common.brand', skin);
|
|
53
|
-
|
|
54
|
-
const medium = _get('common.medium', skin);
|
|
55
|
-
|
|
56
49
|
const {
|
|
57
50
|
title,
|
|
58
|
-
onUp,
|
|
59
|
-
onDown,
|
|
60
51
|
display,
|
|
61
52
|
contentTypes
|
|
62
53
|
} = props;
|
|
63
|
-
const colorUp = onDown ? brand : medium;
|
|
64
|
-
const colorDown = onUp ? brand : medium;
|
|
65
54
|
return /*#__PURE__*/React.createElement("div", {
|
|
66
55
|
className: style.wrapper
|
|
67
56
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -72,17 +61,7 @@ const SetupSection = (props, context) => {
|
|
|
72
61
|
contentTypes: contentTypes
|
|
73
62
|
}), /*#__PURE__*/React.createElement("div", {
|
|
74
63
|
className: style.label
|
|
75
|
-
}, translate('Show')), /*#__PURE__*/React.createElement(InputSwitch, display)
|
|
76
|
-
className: style.arrowSection
|
|
77
|
-
}, /*#__PURE__*/React.createElement(ArrowDownIcon, {
|
|
78
|
-
color: colorUp,
|
|
79
|
-
className: onDown ? style.arrow : style.disabled,
|
|
80
|
-
onClick: onDown
|
|
81
|
-
}), /*#__PURE__*/React.createElement(ArrowUpIcon, {
|
|
82
|
-
color: colorDown,
|
|
83
|
-
className: onUp ? style.arrow : style.disabled,
|
|
84
|
-
onClick: onUp
|
|
85
|
-
}))));
|
|
64
|
+
}, translate('Show')), /*#__PURE__*/React.createElement(InputSwitch, display)));
|
|
86
65
|
};
|
|
87
66
|
|
|
88
67
|
SetupSection.contextTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/setup-section/index.js"],"names":["React","PropTypes","
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/setup-section/index.js"],"names":["React","PropTypes","Provider","InputSwitch","RadioGroup","style","ContentTypesToggler","props","context","skin","contentTypes","brand","orange","contentTypesColor","contentTypeWrapper","contextTypes","childContextTypes","propTypes","shape","modified","bool","SetupSection","translate","title","display","wrapper","settings","label","string","isRequired","onUp","func","onDown"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,WAAP,MAAwB,yBAAxB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,mBAAmB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;AAC9C,QAAM;AAACC,IAAAA;AAAD,MAASD,OAAf;AACA,QAAM;AAACE,IAAAA;AAAD,MAAiBH,KAAvB;;AAEA,MAAI,CAACG,YAAL,EAAmB;AACjB,WAAO,IAAP;AACD;;AAED,QAAMC,KAAK,GAAG,KAAI,cAAJ,EAAoBF,IAApB,CAAd;;AACA,QAAMG,MAAM,GAAG,KAAI,eAAJ,EAAqBH,IAArB,CAAf;;AACA,QAAMI,iBAAiB,GAAG,KAAI,UAAJ,EAAgBH,YAAhB,IAAgCE,MAAhC,GAAyCD,KAAnE;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEN,KAAK,CAACS;AAAtB,kBACE,oBAAC,UAAD,eAAgBJ,YAAhB;AAA8B,IAAA,KAAK,EAAEG;AAArC,KADF,CADF;AAKD,CAjBD;;AAmBAP,mBAAmB,CAACS,YAApB,GAAmC;AACjCN,EAAAA,IAAI,EAAEP,QAAQ,CAACc,iBAAT,CAA2BP;AADA,CAAnC;AAIAH,mBAAmB,CAACW,SAApB,2CAAgC;AAC9BP,EAAAA,YAAY,EAAET,SAAS,CAACiB,KAAV,uBACTd,UAAU,CAACa,SADF;AAEZE,IAAAA,QAAQ,EAAElB,SAAS,CAACmB;AAFR;AADgB,CAAhC;;AAOA,MAAMC,YAAY,GAAG,CAACd,KAAD,EAAQC,OAAR,KAAoB;AACvC,QAAM;AAACc,IAAAA;AAAD,MAAcd,OAApB;AAEA,QAAM;AAACe,IAAAA,KAAD;AAAQC,IAAAA,OAAR;AAAiBd,IAAAA;AAAjB,MAAiCH,KAAvC;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEF,KAAK,CAACoB;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAEpB,KAAK,CAACkB;AAAtB,KAA8BA,KAA9B,CADF,eAEE;AAAK,IAAA,SAAS,EAAElB,KAAK,CAACqB;AAAtB,kBACE,oBAAC,mBAAD;AAAqB,IAAA,YAAY,EAAEhB;AAAnC,IADF,eAEE;AAAK,IAAA,SAAS,EAAEL,KAAK,CAACsB;AAAtB,KAA8BL,SAAS,CAAC,MAAD,CAAvC,CAFF,eAGE,oBAAC,WAAD,EAAiBE,OAAjB,CAHF,CAFF,CADF;AAUD,CAfD;;AAiBAH,YAAY,CAACN,YAAb,GAA4B;AAC1BO,EAAAA,SAAS,EAAEpB,QAAQ,CAACc,iBAAT,CAA2BM,SADZ;AAE1Bb,EAAAA,IAAI,EAAEP,QAAQ,CAACc,iBAAT,CAA2BP;AAFP,CAA5B;AAKAY,YAAY,CAACJ,SAAb,2CAAyB;AACvBM,EAAAA,KAAK,EAAEtB,SAAS,CAAC2B,MAAV,CAAiBC,UADD;AAEvBC,EAAAA,IAAI,EAAE7B,SAAS,CAAC8B,IAFO;AAGvBC,EAAAA,MAAM,EAAE/B,SAAS,CAAC8B,IAHK;AAIvBP,EAAAA,OAAO,EAAEvB,SAAS,CAACiB,KAAV,CAAgBf,WAAW,CAACc,SAA5B,CAJc;AAKvBP,EAAAA,YAAY,EAAEJ,mBAAmB,CAACW,SAApB,CAA8BP;AALrB,CAAzB;AAQA,eAAeW,YAAf","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport InputSwitch from '../../atom/input-switch';\nimport RadioGroup from '../../atom/radio-group';\nimport style from './style.css';\n\nconst ContentTypesToggler = (props, context) => {\n const {skin} = context;\n const {contentTypes} = props;\n\n if (!contentTypes) {\n return null;\n }\n\n const brand = get('common.brand', skin);\n const orange = get('common.orange', skin);\n const contentTypesColor = get('modified', contentTypes) ? orange : brand;\n\n return (\n <div className={style.contentTypeWrapper}>\n <RadioGroup {...contentTypes} color={contentTypesColor} />\n </div>\n );\n};\n\nContentTypesToggler.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nContentTypesToggler.propTypes = {\n contentTypes: PropTypes.shape({\n ...RadioGroup.propTypes,\n modified: PropTypes.bool\n })\n};\n\nconst SetupSection = (props, context) => {\n const {translate} = context;\n\n const {title, display, contentTypes} = props;\n\n return (\n <div className={style.wrapper}>\n <div className={style.title}>{title}</div>\n <div className={style.settings}>\n <ContentTypesToggler contentTypes={contentTypes} />\n <div className={style.label}>{translate('Show')}</div>\n <InputSwitch {...display} />\n </div>\n </div>\n );\n};\n\nSetupSection.contextTypes = {\n translate: Provider.childContextTypes.translate,\n skin: Provider.childContextTypes.skin\n};\n\nSetupSection.propTypes = {\n title: PropTypes.string.isRequired,\n onUp: PropTypes.func,\n onDown: PropTypes.func,\n display: PropTypes.shape(InputSwitch.propTypes),\n contentTypes: ContentTypesToggler.propTypes.contentTypes\n};\n\nexport default SetupSection;\n"],"file":"index.js"}
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
display: flex;
|
|
13
13
|
align-items: center;
|
|
14
14
|
justify-content: space-between;
|
|
15
|
-
padding: 0 24px;
|
|
15
|
+
padding: 0 24px 0 48px;
|
|
16
16
|
box-sizing: border-box;
|
|
17
17
|
}
|
|
18
18
|
|
|
@@ -37,32 +37,7 @@
|
|
|
37
37
|
margin-left: 30px;
|
|
38
38
|
margin-right: 16px;
|
|
39
39
|
}
|
|
40
|
-
.arrowSection {
|
|
41
|
-
display: none
|
|
42
|
-
}
|
|
43
|
-
.arrow {
|
|
44
|
-
left: 50%;
|
|
45
|
-
top: 50%;
|
|
46
|
-
margin: 0 0 0 24px;
|
|
47
|
-
width: 30px;
|
|
48
|
-
height: 30px;
|
|
49
|
-
cursor: pointer;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.arrow:hover path:last-child {
|
|
53
|
-
fill: primaryAdd1;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
.disabled {
|
|
57
|
-
composes: arrow;
|
|
58
|
-
pointer-events: none;
|
|
59
|
-
}
|
|
60
40
|
|
|
61
41
|
.contentTypeWrapper {
|
|
62
42
|
width: 310px;
|
|
63
43
|
}
|
|
64
|
-
@media mobile {
|
|
65
|
-
.arrowSection {
|
|
66
|
-
display: block;
|
|
67
|
-
}
|
|
68
|
-
}
|