@coorpacademy/components 10.4.7 → 10.5.3
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/autocomplete/style.css +4 -4
- package/es/atom/button/style.css +1 -1
- package/es/atom/card-image-preview/test/fixtures.js +15 -0
- package/es/atom/card-image-preview/test/fixtures.js.map +1 -0
- package/es/atom/catalog-section/style.css +1 -1
- package/es/atom/clue/style.css +2 -2
- package/es/atom/cta/style.css +1 -1
- package/es/atom/difficulty-level/style.css +1 -1
- package/es/atom/drag-and-drop/style.css +6 -5
- package/es/atom/input-checkbox/style.css +1 -1
- package/es/atom/input-doublestep/style.css +5 -5
- package/es/atom/input-html/input-preview.css +2 -2
- package/es/atom/input-html/style.css +2 -2
- package/es/atom/input-readonly/style.css +3 -3
- package/es/atom/input-search/style.css +1 -1
- package/es/atom/input-switch/style.css +2 -2
- package/es/atom/input-text/style.css +5 -5
- package/es/atom/input-textarea/style.css +5 -5
- package/es/atom/life/style.css +1 -1
- package/es/atom/notification/style.css +1 -1
- package/es/atom/radio-group/item.css +1 -1
- package/es/atom/resource-miniature/style.css +1 -1
- package/es/atom/select/style.css +7 -7
- package/es/atom/slide/style.css +1 -1
- package/es/molecule/add-to-my-list/style.css +3 -3
- package/es/molecule/audio/style.css +1 -1
- package/es/molecule/battle-request/style.css +4 -4
- package/es/molecule/brand-card/description.css +1 -1
- package/es/molecule/brand-card/style.css +2 -2
- package/es/molecule/brand-card-create/style.css +1 -1
- package/es/molecule/brand-create-form/style.css +6 -6
- package/es/molecule/brand-download-box/style.css +2 -2
- package/es/molecule/brand-tabs/style.css +1 -1
- package/es/molecule/brand-upload-box/style.css +2 -2
- package/es/molecule/breadcrumbs/style.css +3 -3
- package/es/molecule/card/customer.css +1 -1
- package/es/molecule/card/favorite.css +1 -1
- package/es/molecule/card/notification.css +1 -1
- package/es/molecule/card/style.css +1 -1
- package/es/molecule/card/test/fixtures.js +2 -0
- package/es/molecule/card/test/fixtures.js.map +1 -1
- package/es/molecule/card-content/style.css +4 -4
- package/es/molecule/card-with-button/style.css +2 -2
- package/es/molecule/cookie-banner/style.css +2 -2
- package/es/molecule/dashboard/cards-list/style.css +2 -2
- package/es/molecule/dashboard/news-list/style.css +2 -2
- package/es/molecule/dashboard/start-battle/style.css +4 -4
- package/es/molecule/discipline-cta/style.css +2 -2
- package/es/molecule/discipline-header/style.css +4 -4
- package/es/molecule/discipline-partners/style.css +2 -2
- package/es/molecule/drag-and-drop/common.css +1 -1
- package/es/molecule/drag-and-drop/overlay.css +1 -1
- package/es/molecule/drag-and-drop/style.css +1 -1
- package/es/molecule/drag-and-drop/upload-report.css +4 -4
- package/es/molecule/draggable/index.js +56 -0
- package/es/molecule/draggable/index.js.map +1 -0
- package/es/molecule/draggable/style.css +77 -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/external-content-button/style.css +2 -2
- package/es/molecule/feedback/style.css +3 -3
- package/es/molecule/filters/filters-wapper.css +2 -2
- package/es/molecule/filters/style.css +2 -2
- package/es/molecule/forum/forum-comment/style.css +1 -1
- package/es/molecule/forum/forum-post/style.css +5 -5
- package/es/molecule/menu-list/style.css +1 -1
- package/es/molecule/message-popin/style.css +2 -2
- package/es/molecule/modal/style.css +2 -2
- package/es/molecule/module-card/style.css +2 -2
- package/es/molecule/news/style.css +3 -3
- package/es/molecule/notification-banner/style.css +3 -3
- package/es/molecule/pagination/style.css +1 -1
- package/es/molecule/payment-form/index.js +2 -2
- package/es/molecule/payment-form/index.js.map +1 -1
- package/es/molecule/pdf/style.css +2 -2
- package/es/molecule/popin/style.css +2 -2
- package/es/molecule/progress-bar/style.css +1 -1
- package/es/molecule/questions/free-text/style.css +1 -1
- package/es/molecule/questions/qcm/style.css +1 -1
- package/es/molecule/questions/qcm-drag/style.css +2 -2
- package/es/molecule/questions/qcm-graphic/style.css +1 -1
- package/es/molecule/questions/question-range/style.css +2 -2
- package/es/molecule/questions/template/style.css +1 -1
- package/es/molecule/resource-player/style.css +1 -1
- package/es/molecule/scope-content/style.css +6 -6
- package/es/molecule/scope-tabs/style.css +1 -1
- package/es/molecule/select-multiple/style.css +2 -2
- package/es/molecule/setup-cohort-item/style.css +1 -1
- 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 +3 -28
- package/es/molecule/setup-sections/index.js +3 -55
- package/es/molecule/setup-sections/index.js.map +1 -1
- package/es/molecule/setup-sections/style.css +0 -56
- package/es/molecule/setup-sections/test/on-drop.js +1 -1
- package/es/molecule/setup-sections/test/on-drop.js.map +1 -1
- package/es/molecule/share/style.css +3 -3
- package/es/molecule/ssmenu-list/style.css +1 -1
- package/es/molecule/table/style.css +5 -5
- package/es/molecule/teams-popin/style.css +2 -2
- package/es/molecule/titled-checkbox/style.css +1 -1
- package/es/molecule/video-player/jwplayer.css +1 -1
- package/es/molecule/wizard-summary/index.js +5 -5
- package/es/molecule/wizard-summary/index.js.map +1 -1
- package/es/organism/accordion/part/style.css +1 -1
- package/es/organism/brand-analytics/analytics-popin.css +1 -0
- package/es/organism/brand-analytics/style.css +1 -1
- package/es/organism/brand-table/style.css +2 -2
- package/es/organism/brand-upload/style.css +2 -2
- package/es/organism/discussion/style.css +1 -1
- package/es/organism/get-the-app/style.css +1 -1
- package/es/organism/hero/style.css +1 -1
- package/es/organism/mooc-footer/style.css +2 -2
- package/es/organism/mooc-header/style.css +8 -8
- package/es/organism/playlist-translation/test/fixtures.js +15 -0
- package/es/organism/playlist-translation/test/fixtures.js.map +1 -0
- package/es/organism/popin/style.css +1 -0
- package/es/organism/sidebar/style.css +2 -2
- package/es/organism/user-preferences/style.css +1 -1
- package/es/template/activity/engine-stars.css +3 -3
- package/es/template/activity/progression-item.css +5 -4
- package/es/template/activity/stars-summary.css +2 -2
- package/es/template/activity/style.css +3 -3
- package/es/template/app-player/player/slides/footer/style.css +1 -1
- package/es/template/app-player/player/slides/header/learner.css +4 -4
- package/es/template/app-player/player/slides/header/microlearning.css +1 -1
- package/es/template/app-player/player/slides/style.css +9 -8
- package/es/template/app-player/popin-correction/style.css +3 -3
- package/es/template/app-player/popin-end/summary.css +4 -4
- 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/es/template/app-player/popin-header/style.css +5 -5
- package/es/template/back-office/dashboard-preview/dashboard-popin.css +1 -0
- package/es/template/back-office/dashboard-preview/style.css +1 -1
- package/es/template/cockpit/jw-uploader/style.css +1 -0
- package/es/template/common/authors/style.css +5 -4
- package/es/template/common/layout.css +1 -1
- package/es/template/common/search-page/style.css +2 -1
- package/es/template/external-course/style.css +1 -1
- package/es/variables/fonts.css +1 -1
- package/lib/atom/autocomplete/style.css +4 -4
- package/lib/atom/button/style.css +1 -1
- package/lib/atom/card-image-preview/test/fixtures.js +25 -0
- package/lib/atom/card-image-preview/test/fixtures.js.map +1 -0
- package/lib/atom/catalog-section/style.css +1 -1
- package/lib/atom/clue/style.css +2 -2
- package/lib/atom/cta/style.css +1 -1
- package/lib/atom/difficulty-level/style.css +1 -1
- package/lib/atom/drag-and-drop/style.css +6 -5
- package/lib/atom/input-checkbox/style.css +1 -1
- package/lib/atom/input-doublestep/style.css +5 -5
- package/lib/atom/input-html/input-preview.css +2 -2
- package/lib/atom/input-html/style.css +2 -2
- package/lib/atom/input-readonly/style.css +3 -3
- package/lib/atom/input-search/style.css +1 -1
- package/lib/atom/input-switch/style.css +2 -2
- package/lib/atom/input-text/style.css +5 -5
- package/lib/atom/input-textarea/style.css +5 -5
- package/lib/atom/life/style.css +1 -1
- package/lib/atom/notification/style.css +1 -1
- package/lib/atom/radio-group/item.css +1 -1
- package/lib/atom/resource-miniature/style.css +1 -1
- package/lib/atom/select/style.css +7 -7
- package/lib/atom/slide/style.css +1 -1
- package/lib/molecule/add-to-my-list/style.css +3 -3
- package/lib/molecule/audio/style.css +1 -1
- package/lib/molecule/battle-request/style.css +4 -4
- package/lib/molecule/brand-card/description.css +1 -1
- package/lib/molecule/brand-card/style.css +2 -2
- package/lib/molecule/brand-card-create/style.css +1 -1
- package/lib/molecule/brand-create-form/style.css +6 -6
- package/lib/molecule/brand-download-box/style.css +2 -2
- package/lib/molecule/brand-tabs/style.css +1 -1
- package/lib/molecule/brand-upload-box/style.css +2 -2
- package/lib/molecule/breadcrumbs/style.css +3 -3
- package/lib/molecule/card/customer.css +1 -1
- package/lib/molecule/card/favorite.css +1 -1
- package/lib/molecule/card/notification.css +1 -1
- package/lib/molecule/card/style.css +1 -1
- package/lib/molecule/card/test/fixtures.js +3 -0
- package/lib/molecule/card/test/fixtures.js.map +1 -1
- package/lib/molecule/card-content/style.css +4 -4
- package/lib/molecule/card-with-button/style.css +2 -2
- package/lib/molecule/cookie-banner/style.css +2 -2
- package/lib/molecule/dashboard/cards-list/style.css +2 -2
- package/lib/molecule/dashboard/news-list/style.css +2 -2
- package/lib/molecule/dashboard/start-battle/style.css +4 -4
- package/lib/molecule/discipline-cta/style.css +2 -2
- package/lib/molecule/discipline-header/style.css +4 -4
- package/lib/molecule/discipline-partners/style.css +2 -2
- package/lib/molecule/drag-and-drop/common.css +1 -1
- package/lib/molecule/drag-and-drop/overlay.css +1 -1
- package/lib/molecule/drag-and-drop/style.css +1 -1
- package/lib/molecule/drag-and-drop/upload-report.css +4 -4
- package/lib/molecule/draggable/index.js +71 -0
- package/lib/molecule/draggable/index.js.map +1 -0
- package/lib/molecule/draggable/style.css +77 -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/external-content-button/style.css +2 -2
- package/lib/molecule/feedback/style.css +3 -3
- package/lib/molecule/filters/filters-wapper.css +2 -2
- package/lib/molecule/filters/style.css +2 -2
- package/lib/molecule/forum/forum-comment/style.css +1 -1
- package/lib/molecule/forum/forum-post/style.css +5 -5
- package/lib/molecule/menu-list/style.css +1 -1
- package/lib/molecule/message-popin/style.css +2 -2
- package/lib/molecule/modal/style.css +2 -2
- package/lib/molecule/module-card/style.css +2 -2
- package/lib/molecule/news/style.css +3 -3
- package/lib/molecule/notification-banner/style.css +3 -3
- package/lib/molecule/pagination/style.css +1 -1
- package/lib/molecule/payment-form/index.js +2 -2
- package/lib/molecule/payment-form/index.js.map +1 -1
- package/lib/molecule/pdf/style.css +2 -2
- package/lib/molecule/popin/style.css +2 -2
- package/lib/molecule/progress-bar/style.css +1 -1
- package/lib/molecule/questions/free-text/style.css +1 -1
- package/lib/molecule/questions/qcm/style.css +1 -1
- package/lib/molecule/questions/qcm-drag/style.css +2 -2
- package/lib/molecule/questions/qcm-graphic/style.css +1 -1
- package/lib/molecule/questions/question-range/style.css +2 -2
- package/lib/molecule/questions/template/style.css +1 -1
- package/lib/molecule/resource-player/style.css +1 -1
- package/lib/molecule/scope-content/style.css +6 -6
- package/lib/molecule/scope-tabs/style.css +1 -1
- package/lib/molecule/select-multiple/style.css +2 -2
- package/lib/molecule/setup-cohort-item/style.css +1 -1
- 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 +3 -28
- package/lib/molecule/setup-sections/index.js +3 -55
- package/lib/molecule/setup-sections/index.js.map +1 -1
- package/lib/molecule/setup-sections/style.css +0 -56
- package/lib/molecule/setup-sections/test/on-drop.js +1 -1
- package/lib/molecule/setup-sections/test/on-drop.js.map +1 -1
- package/lib/molecule/share/style.css +3 -3
- package/lib/molecule/ssmenu-list/style.css +1 -1
- package/lib/molecule/table/style.css +5 -5
- package/lib/molecule/teams-popin/style.css +2 -2
- package/lib/molecule/titled-checkbox/style.css +1 -1
- package/lib/molecule/video-player/jwplayer.css +1 -1
- package/lib/molecule/wizard-summary/index.js +5 -5
- package/lib/molecule/wizard-summary/index.js.map +1 -1
- package/lib/organism/accordion/part/style.css +1 -1
- package/lib/organism/brand-analytics/analytics-popin.css +1 -0
- package/lib/organism/brand-analytics/style.css +1 -1
- package/lib/organism/brand-table/style.css +2 -2
- package/lib/organism/brand-upload/style.css +2 -2
- package/lib/organism/discussion/style.css +1 -1
- package/lib/organism/get-the-app/style.css +1 -1
- package/lib/organism/hero/style.css +1 -1
- package/lib/organism/mooc-footer/style.css +2 -2
- package/lib/organism/mooc-header/style.css +8 -8
- package/lib/organism/playlist-translation/test/fixtures.js +25 -0
- package/lib/organism/playlist-translation/test/fixtures.js.map +1 -0
- package/lib/organism/popin/style.css +1 -0
- package/lib/organism/sidebar/style.css +2 -2
- package/lib/organism/user-preferences/style.css +1 -1
- package/lib/template/activity/engine-stars.css +3 -3
- package/lib/template/activity/progression-item.css +5 -4
- package/lib/template/activity/stars-summary.css +2 -2
- package/lib/template/activity/style.css +3 -3
- package/lib/template/app-player/player/slides/footer/style.css +1 -1
- package/lib/template/app-player/player/slides/header/learner.css +4 -4
- package/lib/template/app-player/player/slides/header/microlearning.css +1 -1
- package/lib/template/app-player/player/slides/style.css +9 -8
- package/lib/template/app-player/popin-correction/style.css +3 -3
- package/lib/template/app-player/popin-end/summary.css +4 -4
- 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/lib/template/app-player/popin-header/style.css +5 -5
- package/lib/template/back-office/dashboard-preview/dashboard-popin.css +1 -0
- package/lib/template/back-office/dashboard-preview/style.css +1 -1
- package/lib/template/cockpit/jw-uploader/style.css +1 -0
- package/lib/template/common/authors/style.css +5 -4
- package/lib/template/common/layout.css +1 -1
- package/lib/template/common/search-page/style.css +2 -1
- package/lib/template/external-course/style.css +1 -1
- package/lib/variables/fonts.css +1 -1
- package/package.json +2 -2
- package/es/molecule/cockpit-popin/test/fixtures.js +0 -17
- package/es/molecule/cockpit-popin/test/fixtures.js.map +0 -1
- package/lib/molecule/cockpit-popin/test/fixtures.js +0 -28
- package/lib/molecule/cockpit-popin/test/fixtures.js.map +0 -1
|
@@ -12,12 +12,12 @@
|
|
|
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
|
|
|
19
19
|
.title {
|
|
20
|
-
font-family: '
|
|
20
|
+
font-family: 'Gilroy';
|
|
21
21
|
font-size: 14px;
|
|
22
22
|
color: brand;
|
|
23
23
|
font-weight: 700;
|
|
@@ -30,39 +30,14 @@
|
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
.label {
|
|
33
|
-
font-family: '
|
|
33
|
+
font-family: 'Gilroy';
|
|
34
34
|
font-weight: 600;
|
|
35
35
|
font-size: 14px;
|
|
36
36
|
color: brand;
|
|
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
|
-
}
|
|
@@ -2,61 +2,11 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
2
2
|
|
|
3
3
|
import React, { useState, useCallback } from 'react';
|
|
4
4
|
import PropTypes from 'prop-types';
|
|
5
|
-
import
|
|
5
|
+
import Draggable from '../draggable';
|
|
6
6
|
import SetupSection from '../setup-section';
|
|
7
7
|
import Loader from '../../atom/loader';
|
|
8
8
|
import style from './style.css';
|
|
9
9
|
|
|
10
|
-
const preventDefault = e => e.preventDefault();
|
|
11
|
-
|
|
12
|
-
const stopPropagation = e => e.stopPropagation();
|
|
13
|
-
|
|
14
|
-
const Draggable = props => {
|
|
15
|
-
const {
|
|
16
|
-
id,
|
|
17
|
-
dragging = false,
|
|
18
|
-
onDragStart,
|
|
19
|
-
onDragOver,
|
|
20
|
-
onDragLeave,
|
|
21
|
-
onDrop,
|
|
22
|
-
children
|
|
23
|
-
} = props;
|
|
24
|
-
const dragStartHandler = useCallback(e => {
|
|
25
|
-
stopPropagation(e);
|
|
26
|
-
onDragStart(id);
|
|
27
|
-
}, [id, onDragStart]);
|
|
28
|
-
const dragOverHandler = useCallback(e => {
|
|
29
|
-
preventDefault(e);
|
|
30
|
-
onDragOver(id);
|
|
31
|
-
}, [id, onDragOver]);
|
|
32
|
-
const dragLeaveHandler = useCallback(e => {
|
|
33
|
-
preventDefault(e);
|
|
34
|
-
onDragLeave(id);
|
|
35
|
-
}, [id, onDragLeave]);
|
|
36
|
-
const dropHandler = useCallback(e => {
|
|
37
|
-
preventDefault(e);
|
|
38
|
-
onDrop(id);
|
|
39
|
-
}, [id, onDrop]);
|
|
40
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
41
|
-
className: classnames(dragging ? style.dragging : null, style.section, style.draggable),
|
|
42
|
-
onDragStart: dragStartHandler,
|
|
43
|
-
onDragOver: dragOverHandler,
|
|
44
|
-
onDragLeave: dragLeaveHandler,
|
|
45
|
-
onDrop: dropHandler,
|
|
46
|
-
draggable: true
|
|
47
|
-
}, children);
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
Draggable.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
51
|
-
id: PropTypes.string,
|
|
52
|
-
dragging: PropTypes.bool,
|
|
53
|
-
onDragStart: PropTypes.func,
|
|
54
|
-
onDragOver: PropTypes.func,
|
|
55
|
-
onDragLeave: PropTypes.func,
|
|
56
|
-
onDrop: PropTypes.func,
|
|
57
|
-
children: PropTypes.element
|
|
58
|
-
} : {};
|
|
59
|
-
|
|
60
10
|
const Loading = () => /*#__PURE__*/React.createElement("div", {
|
|
61
11
|
className: style.loading
|
|
62
12
|
}, /*#__PURE__*/React.createElement(Loader, null));
|
|
@@ -84,7 +34,7 @@ const SetupSections = ({
|
|
|
84
34
|
setDragFrom(null);
|
|
85
35
|
}, [onDrop, setDragTo, setDragFrom, dragFrom]);
|
|
86
36
|
if (loading) return /*#__PURE__*/React.createElement(Loading, null);
|
|
87
|
-
const sectionsView = sections.map(
|
|
37
|
+
const sectionsView = sections.map(section => /*#__PURE__*/React.createElement(Draggable, {
|
|
88
38
|
key: section.id,
|
|
89
39
|
id: section.id,
|
|
90
40
|
dragging: dragTo === section.id,
|
|
@@ -93,9 +43,7 @@ const SetupSections = ({
|
|
|
93
43
|
onDragLeave: dragLeaveHandler,
|
|
94
44
|
onDrop: dropHandler
|
|
95
45
|
}, /*#__PURE__*/React.createElement(SetupSection, _extends({}, section, {
|
|
96
|
-
key: section.id
|
|
97
|
-
onUp: index === 0 ? null : section.onUp,
|
|
98
|
-
onDown: index === sections.length - 1 ? null : section.onDown
|
|
46
|
+
key: section.id
|
|
99
47
|
}))));
|
|
100
48
|
return /*#__PURE__*/React.createElement("div", null, sectionsView);
|
|
101
49
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/setup-sections/index.js"],"names":["React","useState","useCallback","PropTypes","
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/setup-sections/index.js"],"names":["React","useState","useCallback","PropTypes","Draggable","SetupSection","Loader","style","Loading","loading","SetupSections","sections","onDrop","dragTo","setDragTo","dragFrom","setDragFrom","dragStartHandler","id","dragOverHandler","dragLeaveHandler","dropHandler","sectionsView","map","section","propTypes","arrayOf","shape","bool","func"],"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;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,OAAO,GAAG,mBACd;AAAK,EAAA,SAAS,EAAED,KAAK,CAACE;AAAtB,gBACE,oBAAC,MAAD,OADF,CADF;;AAMA,MAAMC,aAAa,GAAG,CAAC;AAACC,EAAAA,QAAD;AAAWF,EAAAA,OAAX;AAAoBG,EAAAA;AAApB,CAAD,KAAiC;AACrD,QAAM,CAACC,MAAD,EAASC,SAAT,IAAsBb,QAAQ,CAAC,IAAD,CAApC;AACA,QAAM,CAACc,QAAD,EAAWC,WAAX,IAA0Bf,QAAQ,CAAC,IAAD,CAAxC;AAEA,QAAMgB,gBAAgB,GAAGf,WAAW,CAClCgB,EAAE,IAAI;AACJF,IAAAA,WAAW,CAACE,EAAD,CAAX;AACD,GAHiC,EAIlC,CAACF,WAAD,CAJkC,CAApC;AAOA,QAAMG,eAAe,GAAGjB,WAAW,CACjCgB,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,GAAGlB,WAAW,CAClCgB,EAAE,IAAI;AACJJ,IAAAA,SAAS,CAAC,IAAD,CAAT;AACD,GAHiC,EAIlC,CAACA,SAAD,CAJkC,CAApC;AAOA,QAAMO,WAAW,GAAGnB,WAAW,CAC7BgB,EAAE,IAAI;AACJ,QAAIN,MAAM,IAAIG,QAAd,EAAwBH,MAAM,CAACG,QAAD,EAAWG,EAAX,CAAN;AAExBJ,IAAAA,SAAS,CAAC,IAAD,CAAT;AACAE,IAAAA,WAAW,CAAC,IAAD,CAAX;AACD,GAN4B,EAO7B,CAACJ,MAAD,EAASE,SAAT,EAAoBE,WAApB,EAAiCD,QAAjC,CAP6B,CAA/B;AAUA,MAAIN,OAAJ,EAAa,oBAAO,oBAAC,OAAD,OAAP;AAEb,QAAMa,YAAY,GAAGX,QAAQ,CAACY,GAAT,CAAaC,OAAO,iBACvC,oBAAC,SAAD;AACE,IAAA,GAAG,EAAEA,OAAO,CAACN,EADf;AAEE,IAAA,EAAE,EAAEM,OAAO,CAACN,EAFd;AAGE,IAAA,QAAQ,EAAEL,MAAM,KAAKW,OAAO,CAACN,EAH/B;AAIE,IAAA,WAAW,EAAED,gBAJf;AAKE,IAAA,UAAU,EAAEE,eALd;AAME,IAAA,WAAW,EAAEC,gBANf;AAOE,IAAA,MAAM,EAAEC;AAPV,kBASE,oBAAC,YAAD,eAAkBG,OAAlB;AAA2B,IAAA,GAAG,EAAEA,OAAO,CAACN;AAAxC,KATF,CADmB,CAArB;AAaA,sBAAO,iCAAMI,YAAN,CAAP;AACD,CApDD;;AAsDAZ,aAAa,CAACe,SAAd,2CAA0B;AACxBd,EAAAA,QAAQ,EAAER,SAAS,CAACuB,OAAV,CAAkBvB,SAAS,CAACwB,KAAV,CAAgBtB,YAAY,CAACoB,SAA7B,CAAlB,CADc;AAExBhB,EAAAA,OAAO,EAAEN,SAAS,CAACyB,IAFK;AAGxBhB,EAAAA,MAAM,EAAET,SAAS,CAAC0B;AAHM,CAA1B;AAMA,eAAenB,aAAf","sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Draggable from '../draggable';\nimport SetupSection from '../setup-section';\nimport Loader from '../../atom/loader';\nimport style from './style.css';\n\nconst Loading = () => (\n <div className={style.loading}>\n <Loader />\n </div>\n);\n\nconst SetupSections = ({sections, loading, onDrop}) => {\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 if (loading) return <Loading />;\n\n const sectionsView = sections.map(section => (\n <Draggable\n key={section.id}\n id={section.id}\n dragging={dragTo === section.id}\n onDragStart={dragStartHandler}\n onDragOver={dragOverHandler}\n onDragLeave={dragLeaveHandler}\n onDrop={dropHandler}\n >\n <SetupSection {...section} key={section.id} />\n </Draggable>\n ));\n return <div>{sectionsView}</div>;\n};\n\nSetupSections.propTypes = {\n sections: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),\n loading: PropTypes.bool,\n onDrop: PropTypes.func\n};\n\nexport default SetupSections;\n"],"file":"index.js"}
|
|
@@ -15,10 +15,6 @@
|
|
|
15
15
|
border-bottom: 0;
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
.section:last-child {
|
|
19
|
-
border-bottom: 1px solid medium;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
18
|
.loading {
|
|
23
19
|
composes: section;
|
|
24
20
|
width: 100%;
|
|
@@ -27,55 +23,3 @@
|
|
|
27
23
|
min-height: 60px;
|
|
28
24
|
position: relative;
|
|
29
25
|
}
|
|
30
|
-
.draggable {
|
|
31
|
-
cursor: grab;
|
|
32
|
-
position: relative;
|
|
33
|
-
background: transparent;
|
|
34
|
-
}
|
|
35
|
-
.draggable:hover{
|
|
36
|
-
background: rgba(0, 0, 0, 0.3);
|
|
37
|
-
}
|
|
38
|
-
.draggable:active{
|
|
39
|
-
background: transparent;
|
|
40
|
-
}
|
|
41
|
-
.draggable:before {
|
|
42
|
-
content: '.';
|
|
43
|
-
position: absolute;
|
|
44
|
-
left: 5px;
|
|
45
|
-
font-size: 20px;
|
|
46
|
-
line-height: 7px;
|
|
47
|
-
color: medium;
|
|
48
|
-
pointer-events: none;
|
|
49
|
-
text-shadow: 0 0 medium, 0 5px medium, 0 10px medium, 0 15px medium, 0 20px medium, 0 25px medium, 0 30px medium, 0 35px medium, 0 40px medium, 0 45px medium,
|
|
50
|
-
5px 0 medium, 5px 5px medium, 5px 10px medium, 5px 15px medium, 5px 20px medium, 5px 25px medium, 5px 30px medium, 5px 35px medium, 5px 40px medium, 5px 45px medium,
|
|
51
|
-
10px 0 medium, 10px 5px medium, 10px 10px medium, 10px 15px medium, 10px 20px medium, 10px 25px medium, 10px 30px medium, 10px 35px medium, 10px 40px medium, 10px 45px medium;
|
|
52
|
-
}
|
|
53
|
-
.dragging {
|
|
54
|
-
background: rgba(0, 0, 0, 0.1);
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
.dragging:after {
|
|
58
|
-
position: absolute;
|
|
59
|
-
content: "drop here";
|
|
60
|
-
left: 5px;
|
|
61
|
-
top: 5px;
|
|
62
|
-
bottom: 5px;
|
|
63
|
-
right: 5px;
|
|
64
|
-
background: color(black lightness(95%));
|
|
65
|
-
pointer-events: none;
|
|
66
|
-
border: 1px dashed medium;
|
|
67
|
-
box-sizing: border-box;
|
|
68
|
-
display: flex;
|
|
69
|
-
justify-content: center;
|
|
70
|
-
align-items: center;
|
|
71
|
-
color: dark;
|
|
72
|
-
font-family: 'Open Sans';
|
|
73
|
-
font-weight: 600;
|
|
74
|
-
font-size: 14px;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
@media mobile {
|
|
78
|
-
.draggable:before {
|
|
79
|
-
content: none;
|
|
80
|
-
}
|
|
81
|
-
}
|
|
@@ -10,7 +10,7 @@ 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 '
|
|
13
|
+
import style from '../../draggable/style.css';
|
|
14
14
|
import fixtures from './fixtures/default';
|
|
15
15
|
browserEnv();
|
|
16
16
|
configure({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/molecule/setup-sections/test/on-drop.js"],"names":["browserEnv","test","React","mount","configure","Adapter","wrappingComponent","SetupSections","style","fixtures","adapter","t","plan","elementToDrag","props","sections","id","elementToDrop","dropHandler","dragged","dropped","is","wrapper","dragStartEvent","preventDefault","pass","dragOverEvent","dragLeaveEvent","dropEvent","find","section","at","simulate","fail"],"mappings":";;;;AAAA,OAAOA,UAAP,MAAuB,aAAvB;AACA,OAAOC,IAAP,MAAiB,KAAjB;AACA,OAAOC,KAAP,MAAkB,OAAlB;AACA,SAAQC,KAAR,EAAeC,SAAf,QAA+B,QAA/B;AAEA,OAAOC,OAAP,MAAoB,yBAApB;AACA,SAAQC,iBAAR,QAAgC,wCAAhC;AACA,OAAOC,aAAP,MAA0B,IAA1B,C,CACA;;AACA,OAAOC,KAAP,MAAkB,
|
|
1
|
+
{"version":3,"sources":["../../../../src/molecule/setup-sections/test/on-drop.js"],"names":["browserEnv","test","React","mount","configure","Adapter","wrappingComponent","SetupSections","style","fixtures","adapter","t","plan","elementToDrag","props","sections","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/default';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\ntest('should trigger onDrop handler', t => {\n t.plan(7);\n\n const elementToDrag = fixtures.props.sections[0].id;\n const elementToDrop = fixtures.props.sections[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('sections.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"}
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
display: flex;
|
|
15
15
|
align-items: center;
|
|
16
16
|
margin: 15px 0;
|
|
17
|
-
font-family:
|
|
17
|
+
font-family: Gilroy;
|
|
18
18
|
font-weight: bold;
|
|
19
19
|
font-size: 13px;
|
|
20
20
|
overflow: inherit;
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
text-transform: inherit;
|
|
29
29
|
background-color: xtraLightGrey;
|
|
30
30
|
color: dark;
|
|
31
|
-
font-family:
|
|
31
|
+
font-family: Gilroy;
|
|
32
32
|
font-weight: 600;
|
|
33
33
|
font-size: 13px;
|
|
34
34
|
text-decoration: none;
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
align-items: center;
|
|
74
74
|
color: white;
|
|
75
75
|
text-align: center;
|
|
76
|
-
font-family:
|
|
76
|
+
font-family: Gilroy;
|
|
77
77
|
font-weight: bold;
|
|
78
78
|
font-size: 13px;
|
|
79
79
|
box-shadow: 0 -1px 20px 0 rgba(0, 0, 0, 0.25);
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
|
|
14
14
|
.table {
|
|
15
15
|
border: 1px solid light;
|
|
16
|
-
font-family: '
|
|
16
|
+
font-family: 'Gilroy';
|
|
17
17
|
border-spacing: 0;
|
|
18
18
|
}
|
|
19
19
|
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
.noOptions label {
|
|
76
76
|
display: inline-block;
|
|
77
77
|
cursor: pointer;
|
|
78
|
-
font-family: '
|
|
78
|
+
font-family: 'Gilroy';
|
|
79
79
|
font-size: 15px;
|
|
80
80
|
font-weight: 700;
|
|
81
81
|
color: medium;
|
|
@@ -124,7 +124,7 @@
|
|
|
124
124
|
outline: 0;
|
|
125
125
|
padding: 0;
|
|
126
126
|
background: none;
|
|
127
|
-
font-family: '
|
|
127
|
+
font-family: 'Gilroy';
|
|
128
128
|
font-weight: 600;
|
|
129
129
|
font-size: 15px;
|
|
130
130
|
line-height: 25px;
|
|
@@ -155,7 +155,7 @@
|
|
|
155
155
|
text-align: center;
|
|
156
156
|
width: 100%;
|
|
157
157
|
margin: 0 auto;
|
|
158
|
-
font-family: '
|
|
158
|
+
font-family: 'Gilroy';
|
|
159
159
|
color: dark;
|
|
160
160
|
}
|
|
161
161
|
|
|
@@ -166,7 +166,7 @@
|
|
|
166
166
|
border-radius: 4px;
|
|
167
167
|
overflow: scroll;
|
|
168
168
|
box-shadow: 0 0 2px 0 rgba(0,0,0,.19);
|
|
169
|
-
font-family: '
|
|
169
|
+
font-family: 'Gilroy';
|
|
170
170
|
background-color: white;
|
|
171
171
|
}
|
|
172
172
|
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
}
|
|
48
48
|
|
|
49
49
|
.header {
|
|
50
|
-
font-family: '
|
|
50
|
+
font-family: 'Gilroy';
|
|
51
51
|
font-size: 24px;
|
|
52
52
|
font-weight: bold;
|
|
53
53
|
color: black;
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
.content {
|
|
61
|
-
font-family: '
|
|
61
|
+
font-family: 'Gilroy';
|
|
62
62
|
font-size: 16px;
|
|
63
63
|
font-weight: normal;
|
|
64
64
|
color: black;
|
|
@@ -109,15 +109,15 @@ const buildSections = sections => {
|
|
|
109
109
|
};
|
|
110
110
|
|
|
111
111
|
const BuildAction = ({
|
|
112
|
-
action
|
|
112
|
+
action,
|
|
113
|
+
side
|
|
113
114
|
}) => {
|
|
114
115
|
const {
|
|
115
116
|
onClick,
|
|
116
117
|
text,
|
|
117
118
|
disabled = false,
|
|
118
119
|
icon,
|
|
119
|
-
'aria-label': ariaLabel
|
|
120
|
-
side
|
|
120
|
+
'aria-label': ariaLabel
|
|
121
121
|
} = action;
|
|
122
122
|
const handleClick = useMemo(() => () => onClick(), [onClick]);
|
|
123
123
|
if (!action) return null;
|
|
@@ -215,10 +215,10 @@ BuildAction.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
215
215
|
icon: PropTypes.string,
|
|
216
216
|
disabled: PropTypes.bool,
|
|
217
217
|
text: PropTypes.string,
|
|
218
|
-
side: PropTypes.string,
|
|
219
218
|
onClick: PropTypes.func,
|
|
220
219
|
'aria-label': PropTypes.string
|
|
221
|
-
})
|
|
220
|
+
}),
|
|
221
|
+
side: PropTypes.string
|
|
222
222
|
} : {};
|
|
223
223
|
WizardSummary.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
224
224
|
title: PropTypes.string,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/wizard-summary/index.js"],"names":["React","useMemo","useState","useCallback","useRef","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDownIcon","ContentBadge","ButtonLink","style","buildItemsOfSection","items","map","item","index","type","title","value","category","label","author","unsaved","contentWrapper","contentCounter","contentItem","content","contentTitle","__html","text","valueSimpleText","buildSectionHeader","section","counterText","sectionHeader","buildSections","sections","itemsView","sectionWrapper","BuildAction","action","onClick","disabled","icon","ariaLabel","side","handleClick","buttonProps","position","button","checkOnClose","checked","summaryElement","onCloseSummary","clickEvent","current","contains","target","WizardSummary","props","sectionsView","idSwitch","setChecked","handleOnChange","document","addEventListener","removeEventListener","container","desktopSummaryTitle","checkbox","summary","tabletSummaryHeader","tabletSummaryTitle","tabletSummaryIcon","summarySections","actionZone","propTypes","shape","string","bool","func","arrayOf","oneOfType","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo, useState, useCallback, useRef} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {uniqueId} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDownIcon} from '@coorpacademy/nova-icons';\nimport ContentBadge from '../../atom/content-badge';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildItemsOfSection = items => {\n return items.map((item, index) => {\n const {type} = item;\n switch (type) {\n case 'mainElement':\n return (\n <li key={`${item.title}-${index}`} data-name={item.title}>\n <span className={style.title}>{item.title}</span>\n <span className={style.value}>{item.value}</span>\n </li>\n );\n case 'content': {\n const {category, label, title, author, unsaved = false} = item;\n return (\n <li className={style.contentWrapper} key={`${title}-${index}`} data-name={item.title}>\n <span className={style.contentCounter}>{index + 1}</span>\n <div className={style.contentItem}>\n <div className={style.content}>\n <ContentBadge category={category} label={label} />\n <span\n className={classnames(style.contentTitle, unsaved && style.unsaved)}\n title={title}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n {author ? <span className={style.author}>{author}</span> : null}\n </div>\n </li>\n );\n }\n case 'text':\n default: {\n const {text, unsaved = false} = item;\n return (\n <li key={`${item.text}-${index}`} data-name={item.title}>\n <span className={classnames(style.valueSimpleText, unsaved && style.unsaved)}>\n {text}\n </span>\n </li>\n );\n }\n }\n });\n};\n\nconst buildSectionHeader = section => {\n const {title, counterText} = section;\n if (!title) {\n return null;\n }\n return (\n <div className={style.sectionHeader}>\n <span className={style.title}>{title}</span>\n {counterText ? <span className={style.counterText}>{counterText}</span> : null}\n </div>\n );\n};\n\nconst buildSections = sections => {\n return sections.map((section, index) => {\n const sectionHeader = buildSectionHeader(section);\n const itemsView = buildItemsOfSection(section.items);\n return (\n <div\n key={`summary-section-${index}`}\n data-step={index}\n data-name={`summary-section-${index}`}\n className={style.sectionWrapper}\n >\n {sectionHeader}\n <ul>{itemsView}</ul>\n </div>\n );\n });\n};\n\nconst BuildAction = ({action}) => {\n const {onClick, text, disabled = false, icon, 'aria-label': ariaLabel, side} = action;\n const handleClick = useMemo(() => () => onClick(), [onClick]);\n\n if (!action) return null;\n\n const buttonProps = {\n type: 'text',\n label: text,\n disabled,\n 'aria-label': ariaLabel,\n 'data-name': `${icon}-button-${side}`,\n onClick: handleClick,\n icon: {\n position: 'left',\n type: icon\n }\n };\n\n return (\n <div className={style.button}>\n <ButtonLink {...buttonProps} />\n </div>\n );\n};\n\nconst checkOnClose = (checked, summaryElement, onCloseSummary, clickEvent) => {\n if (checked) {\n if (\n summaryElement &&\n summaryElement.current &&\n !summaryElement.current.contains(clickEvent.target)\n ) {\n onCloseSummary();\n }\n }\n};\n\nconst WizardSummary = props => {\n const {title, sections, action, side} = props;\n const sectionsView = buildSections(sections);\n const idSwitch = uniqueId('open-summary-wizard');\n const summaryElement = useRef(null);\n const [checked, setChecked] = useState(false);\n\n const onCloseSummary = () => setChecked(false);\n const handleOnChange = useCallback(() => {\n if (!checked) {\n document.addEventListener('click', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n document.addEventListener('touchstart', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n } else {\n document.removeEventListener('click', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n document.removeEventListener('touchstart', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n }\n setChecked(!checked);\n }, [checked]);\n\n return (\n <div className={style.container} ref={summaryElement}>\n <span className={style.desktopSummaryTitle} data-name={`summary-title-${side}`}>\n {title}\n </span>\n <input\n type=\"checkbox\"\n id={idSwitch}\n name=\"toogle\"\n title={idSwitch}\n className={style.checkbox}\n data-name={`summary-checkbox-${side}`}\n checked={checked}\n onChange={handleOnChange}\n />\n <div className={style.summary}>\n <div className={style.tabletSummaryHeader}>\n <label htmlFor={idSwitch}>\n <span className={style.tabletSummaryTitle}>{title}</span>\n <ArrowDownIcon className={style.tabletSummaryIcon} />\n </label>\n </div>\n <div className={style.summarySections} data-name={`summary-section-${side}`}>\n {sectionsView}\n </div>\n </div>\n <div className={style.actionZone} data-name={`summary-actions-${side}`}>\n <BuildAction action={action} side={side} />\n </div>\n </div>\n );\n};\n\nBuildAction.propTypes = {\n action: PropTypes.shape({\n icon: PropTypes.string,\n disabled: PropTypes.bool,\n text: PropTypes.string,\n side: PropTypes.string,\n onClick: PropTypes.func,\n 'aria-label': PropTypes.string\n })\n};\n\nWizardSummary.propTypes = {\n title: PropTypes.string,\n side: PropTypes.string,\n sections: PropTypes.arrayOf(\n PropTypes.shape({\n title: PropTypes.string,\n items: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.shape({\n type: PropTypes.string,\n title: PropTypes.string,\n value: PropTypes.string\n }),\n PropTypes.shape({\n type: PropTypes.string,\n text: PropTypes.string,\n unsaved: PropTypes.bool\n }),\n PropTypes.shape({\n type: PropTypes.string,\n category: PropTypes.oneOf([\n 'base',\n 'advanced',\n 'coach',\n 'chapter',\n 'scorm',\n 'video',\n 'article',\n 'podcast',\n 'course'\n ]),\n title: PropTypes.string,\n label: PropTypes.string,\n author: PropTypes.string,\n unsaved: PropTypes.bool\n })\n ])\n ),\n counterText: PropTypes.string\n })\n ),\n action: BuildAction.propTypes.action\n};\n\nexport default WizardSummary;\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/wizard-summary/index.js"],"names":["React","useMemo","useState","useCallback","useRef","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDownIcon","ContentBadge","ButtonLink","style","buildItemsOfSection","items","map","item","index","type","title","value","category","label","author","unsaved","contentWrapper","contentCounter","contentItem","content","contentTitle","__html","text","valueSimpleText","buildSectionHeader","section","counterText","sectionHeader","buildSections","sections","itemsView","sectionWrapper","BuildAction","action","side","onClick","disabled","icon","ariaLabel","handleClick","buttonProps","position","button","checkOnClose","checked","summaryElement","onCloseSummary","clickEvent","current","contains","target","WizardSummary","props","sectionsView","idSwitch","setChecked","handleOnChange","document","addEventListener","removeEventListener","container","desktopSummaryTitle","checkbox","summary","tabletSummaryHeader","tabletSummaryTitle","tabletSummaryIcon","summarySections","actionZone","propTypes","shape","string","bool","func","arrayOf","oneOfType","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo, useState, useCallback, useRef} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {uniqueId} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDownIcon} from '@coorpacademy/nova-icons';\nimport ContentBadge from '../../atom/content-badge';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildItemsOfSection = items => {\n return items.map((item, index) => {\n const {type} = item;\n switch (type) {\n case 'mainElement':\n return (\n <li key={`${item.title}-${index}`} data-name={item.title}>\n <span className={style.title}>{item.title}</span>\n <span className={style.value}>{item.value}</span>\n </li>\n );\n case 'content': {\n const {category, label, title, author, unsaved = false} = item;\n return (\n <li className={style.contentWrapper} key={`${title}-${index}`} data-name={item.title}>\n <span className={style.contentCounter}>{index + 1}</span>\n <div className={style.contentItem}>\n <div className={style.content}>\n <ContentBadge category={category} label={label} />\n <span\n className={classnames(style.contentTitle, unsaved && style.unsaved)}\n title={title}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n {author ? <span className={style.author}>{author}</span> : null}\n </div>\n </li>\n );\n }\n case 'text':\n default: {\n const {text, unsaved = false} = item;\n return (\n <li key={`${item.text}-${index}`} data-name={item.title}>\n <span className={classnames(style.valueSimpleText, unsaved && style.unsaved)}>\n {text}\n </span>\n </li>\n );\n }\n }\n });\n};\n\nconst buildSectionHeader = section => {\n const {title, counterText} = section;\n if (!title) {\n return null;\n }\n return (\n <div className={style.sectionHeader}>\n <span className={style.title}>{title}</span>\n {counterText ? <span className={style.counterText}>{counterText}</span> : null}\n </div>\n );\n};\n\nconst buildSections = sections => {\n return sections.map((section, index) => {\n const sectionHeader = buildSectionHeader(section);\n const itemsView = buildItemsOfSection(section.items);\n return (\n <div\n key={`summary-section-${index}`}\n data-step={index}\n data-name={`summary-section-${index}`}\n className={style.sectionWrapper}\n >\n {sectionHeader}\n <ul>{itemsView}</ul>\n </div>\n );\n });\n};\n\nconst BuildAction = ({action, side}) => {\n const {onClick, text, disabled = false, icon, 'aria-label': ariaLabel} = action;\n const handleClick = useMemo(() => () => onClick(), [onClick]);\n\n if (!action) return null;\n\n const buttonProps = {\n type: 'text',\n label: text,\n disabled,\n 'aria-label': ariaLabel,\n 'data-name': `${icon}-button-${side}`,\n onClick: handleClick,\n icon: {\n position: 'left',\n type: icon\n }\n };\n\n return (\n <div className={style.button}>\n <ButtonLink {...buttonProps} />\n </div>\n );\n};\n\nconst checkOnClose = (checked, summaryElement, onCloseSummary, clickEvent) => {\n if (checked) {\n if (\n summaryElement &&\n summaryElement.current &&\n !summaryElement.current.contains(clickEvent.target)\n ) {\n onCloseSummary();\n }\n }\n};\n\nconst WizardSummary = props => {\n const {title, sections, action, side} = props;\n const sectionsView = buildSections(sections);\n const idSwitch = uniqueId('open-summary-wizard');\n const summaryElement = useRef(null);\n const [checked, setChecked] = useState(false);\n\n const onCloseSummary = () => setChecked(false);\n const handleOnChange = useCallback(() => {\n if (!checked) {\n document.addEventListener('click', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n document.addEventListener('touchstart', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n } else {\n document.removeEventListener('click', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n document.removeEventListener('touchstart', clickEvent =>\n checkOnClose(!checked, summaryElement, onCloseSummary, clickEvent)\n );\n }\n setChecked(!checked);\n }, [checked]);\n\n return (\n <div className={style.container} ref={summaryElement}>\n <span className={style.desktopSummaryTitle} data-name={`summary-title-${side}`}>\n {title}\n </span>\n <input\n type=\"checkbox\"\n id={idSwitch}\n name=\"toogle\"\n title={idSwitch}\n className={style.checkbox}\n data-name={`summary-checkbox-${side}`}\n checked={checked}\n onChange={handleOnChange}\n />\n <div className={style.summary}>\n <div className={style.tabletSummaryHeader}>\n <label htmlFor={idSwitch}>\n <span className={style.tabletSummaryTitle}>{title}</span>\n <ArrowDownIcon className={style.tabletSummaryIcon} />\n </label>\n </div>\n <div className={style.summarySections} data-name={`summary-section-${side}`}>\n {sectionsView}\n </div>\n </div>\n <div className={style.actionZone} data-name={`summary-actions-${side}`}>\n <BuildAction action={action} side={side} />\n </div>\n </div>\n );\n};\n\nBuildAction.propTypes = {\n action: PropTypes.shape({\n icon: PropTypes.string,\n disabled: PropTypes.bool,\n text: PropTypes.string,\n onClick: PropTypes.func,\n 'aria-label': PropTypes.string\n }),\n side: PropTypes.string\n};\n\nWizardSummary.propTypes = {\n title: PropTypes.string,\n side: PropTypes.string,\n sections: PropTypes.arrayOf(\n PropTypes.shape({\n title: PropTypes.string,\n items: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.shape({\n type: PropTypes.string,\n title: PropTypes.string,\n value: PropTypes.string\n }),\n PropTypes.shape({\n type: PropTypes.string,\n text: PropTypes.string,\n unsaved: PropTypes.bool\n }),\n PropTypes.shape({\n type: PropTypes.string,\n category: PropTypes.oneOf([\n 'base',\n 'advanced',\n 'coach',\n 'chapter',\n 'scorm',\n 'video',\n 'article',\n 'podcast',\n 'course'\n ]),\n title: PropTypes.string,\n label: PropTypes.string,\n author: PropTypes.string,\n unsaved: PropTypes.bool\n })\n ])\n ),\n counterText: PropTypes.string\n })\n ),\n action: BuildAction.propTypes.action\n};\n\nexport default WizardSummary;\n"],"file":"index.js"}
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
.refresh {
|
|
15
|
-
font-family: '
|
|
15
|
+
font-family: 'Gilroy';
|
|
16
16
|
color: dark;
|
|
17
17
|
font-size: 15px;
|
|
18
18
|
font-weight: 700;
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
|
|
45
45
|
.empty {
|
|
46
46
|
height: 200px;
|
|
47
|
-
font-family: '
|
|
47
|
+
font-family: 'Gilroy';
|
|
48
48
|
color: dark;
|
|
49
49
|
font-size: 15px;
|
|
50
50
|
font-weight: 700;
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
.title h3 {
|
|
24
|
-
font-family: '
|
|
24
|
+
font-family: 'Gilroy';
|
|
25
25
|
font-size: 17px;
|
|
26
26
|
font-weight: 700;
|
|
27
27
|
color: dark;
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
}
|
|
43
43
|
|
|
44
44
|
.notification span {
|
|
45
|
-
font-family: '
|
|
45
|
+
font-family: 'Gilroy';
|
|
46
46
|
font-size: 12px;
|
|
47
47
|
font-weight: 400;
|
|
48
48
|
color: white;
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
line-height: normal;
|
|
48
48
|
letter-spacing: 1px;
|
|
49
49
|
color: white;
|
|
50
|
-
font-family: "
|
|
50
|
+
font-family: "Gilroy";
|
|
51
51
|
font-size: 14px;
|
|
52
52
|
text-transform: uppercase;
|
|
53
53
|
}
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
display: flex;
|
|
69
69
|
flex-wrap: nowrap;
|
|
70
70
|
flex-direction: row;
|
|
71
|
-
font-family: "
|
|
71
|
+
font-family: "Gilroy";
|
|
72
72
|
background-color: black;
|
|
73
73
|
}
|
|
74
74
|
|