@coorpacademy/components 10.3.18 → 10.3.21-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/molecule/vertical-tabs/index.js +17 -8
- package/es/molecule/vertical-tabs/index.js.map +1 -1
- package/es/molecule/vertical-tabs/style.css +11 -0
- package/es/molecule/vertical-tabs/test/fixtures/default.js +8 -3
- package/es/molecule/vertical-tabs/test/fixtures/default.js.map +1 -1
- package/es/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js +47 -0
- package/es/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js.map +1 -0
- package/es/molecule/vertical-tabs/test/fixtures/with-selected-item.js +10 -5
- package/es/molecule/vertical-tabs/test/fixtures/with-selected-item.js.map +1 -1
- package/es/molecule/wizard-summary/style.css +2 -2
- package/es/organism/content-translation/test/fixtures/default.js +2 -2
- package/es/organism/content-translation/test/fixtures/default.js.map +1 -1
- package/es/organism/setup-header/style.css +1 -0
- package/es/organism/wizard-contents/style.css +14 -1
- package/lib/molecule/vertical-tabs/index.js +18 -8
- package/lib/molecule/vertical-tabs/index.js.map +1 -1
- package/lib/molecule/vertical-tabs/style.css +11 -0
- package/lib/molecule/vertical-tabs/test/fixtures/default.js +11 -4
- package/lib/molecule/vertical-tabs/test/fixtures/default.js.map +1 -1
- package/lib/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js +54 -0
- package/lib/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js.map +1 -0
- package/lib/molecule/vertical-tabs/test/fixtures/with-selected-item.js +12 -5
- package/lib/molecule/vertical-tabs/test/fixtures/with-selected-item.js.map +1 -1
- package/lib/molecule/wizard-summary/style.css +2 -2
- package/lib/organism/content-translation/test/fixtures/default.js.map +1 -1
- package/lib/organism/setup-header/style.css +1 -0
- package/lib/organism/wizard-contents/style.css +14 -1
- package/package.json +2 -2
|
@@ -1,31 +1,38 @@
|
|
|
1
|
-
import _snakeCase from "lodash/fp/snakeCase";
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import PropTypes from 'prop-types';
|
|
4
3
|
import classnames from 'classnames';
|
|
5
|
-
import { NovaSolidStatusCheckCircle2 as CheckIcon } from '@coorpacademy/nova-icons';
|
|
4
|
+
import { NovaSolidStatusCheckCircle2 as CheckIcon, NovaSolidStatusClose as ErrorIcon } from '@coorpacademy/nova-icons';
|
|
5
|
+
import keys from 'lodash/fp/keys';
|
|
6
|
+
import snakeCase from 'lodash/fp/snakeCase';
|
|
6
7
|
import Link from '../../atom/link';
|
|
7
8
|
import style from './style.css';
|
|
8
9
|
const LeftIcons = {
|
|
9
|
-
BlueValidatedCircle: CheckIcon
|
|
10
|
+
BlueValidatedCircle: CheckIcon,
|
|
11
|
+
LocaleInError: ErrorIcon
|
|
10
12
|
};
|
|
11
13
|
|
|
14
|
+
const getIconDataName = iconType => iconType === 'LocaleInError' ? 'validated-locale-icon' : 'locale-in-error-icon';
|
|
15
|
+
|
|
12
16
|
const buildTab = (tab, index) => {
|
|
13
17
|
const {
|
|
14
18
|
title,
|
|
15
19
|
selected,
|
|
16
20
|
onClick,
|
|
17
|
-
leftIcon
|
|
21
|
+
leftIcon,
|
|
22
|
+
iconAriaLabel
|
|
18
23
|
} = tab;
|
|
19
24
|
const LeftIcon = LeftIcons[leftIcon];
|
|
20
25
|
return /*#__PURE__*/React.createElement("li", {
|
|
21
|
-
"data-name": `vertical_tab_${
|
|
26
|
+
"data-name": `vertical_tab_${snakeCase(title)}`,
|
|
22
27
|
className: classnames(style.tab, selected && style.selected),
|
|
23
28
|
key: index,
|
|
24
29
|
onClick: onClick
|
|
25
30
|
}, /*#__PURE__*/React.createElement("span", {
|
|
26
31
|
className: style.title
|
|
27
32
|
}, title), LeftIcon ? /*#__PURE__*/React.createElement(LeftIcon, {
|
|
28
|
-
|
|
33
|
+
"data-name": getIconDataName(leftIcon),
|
|
34
|
+
"aria-label": iconAriaLabel,
|
|
35
|
+
className: leftIcon === 'LocaleInError' ? style.leftIconError : style.leftIcon
|
|
29
36
|
}) : null);
|
|
30
37
|
};
|
|
31
38
|
|
|
@@ -42,12 +49,14 @@ const VerticalTabs = props => {
|
|
|
42
49
|
}, tabsList);
|
|
43
50
|
};
|
|
44
51
|
|
|
52
|
+
const LeftIconValues = process.env.NODE_ENV !== "production" ? [...keys(LeftIcons), ''] : {};
|
|
45
53
|
VerticalTabs.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
46
54
|
tabs: PropTypes.arrayOf(PropTypes.shape({
|
|
47
55
|
title: Link.propTypes.children,
|
|
48
56
|
selected: PropTypes.bool,
|
|
49
|
-
leftIcon: PropTypes.
|
|
50
|
-
onClick: PropTypes.func
|
|
57
|
+
leftIcon: PropTypes.oneOf(LeftIconValues),
|
|
58
|
+
onClick: PropTypes.func,
|
|
59
|
+
iconAriaLabel: PropTypes.string
|
|
51
60
|
})),
|
|
52
61
|
className: PropTypes.string,
|
|
53
62
|
'aria-label': PropTypes.string
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/vertical-tabs/index.js"],"names":["React","PropTypes","classnames","NovaSolidStatusCheckCircle2","CheckIcon","Link","style","LeftIcons","BlueValidatedCircle","buildTab","tab","index","title","selected","onClick","leftIcon","LeftIcon","VerticalTabs","props","tabs","className","ariaLabel","tabsList","map","wrapper","propTypes","arrayOf","shape","children","bool","
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/vertical-tabs/index.js"],"names":["React","PropTypes","classnames","NovaSolidStatusCheckCircle2","CheckIcon","NovaSolidStatusClose","ErrorIcon","keys","snakeCase","Link","style","LeftIcons","BlueValidatedCircle","LocaleInError","getIconDataName","iconType","buildTab","tab","index","title","selected","onClick","leftIcon","iconAriaLabel","LeftIcon","leftIconError","VerticalTabs","props","tabs","className","ariaLabel","tabsList","map","wrapper","LeftIconValues","propTypes","arrayOf","shape","children","bool","oneOf","func","string"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SACEC,2BAA2B,IAAIC,SADjC,EAEEC,oBAAoB,IAAIC,SAF1B,QAGO,0BAHP;AAIA,OAAOC,IAAP,MAAiB,gBAAjB;AACA,OAAOC,SAAP,MAAsB,qBAAtB;AACA,OAAOC,IAAP,MAAiB,iBAAjB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,MAAMC,SAAS,GAAG;AAChBC,EAAAA,mBAAmB,EAAER,SADL;AAEhBS,EAAAA,aAAa,EAAEP;AAFC,CAAlB;;AAKA,MAAMQ,eAAe,GAAGC,QAAQ,IAC9BA,QAAQ,KAAK,eAAb,GAA+B,uBAA/B,GAAyD,sBAD3D;;AAGA,MAAMC,QAAQ,GAAG,CAACC,GAAD,EAAMC,KAAN,KAAgB;AAC/B,QAAM;AAACC,IAAAA,KAAD;AAAQC,IAAAA,QAAR;AAAkBC,IAAAA,OAAlB;AAA2BC,IAAAA,QAA3B;AAAqCC,IAAAA;AAArC,MAAsDN,GAA5D;AAEA,QAAMO,QAAQ,GAAGb,SAAS,CAACW,QAAD,CAA1B;AACA,sBACE;AACE,iBAAY,gBAAed,SAAS,CAACW,KAAD,CAAQ,EAD9C;AAEE,IAAA,SAAS,EAAEjB,UAAU,CAACQ,KAAK,CAACO,GAAP,EAAYG,QAAQ,IAAIV,KAAK,CAACU,QAA9B,CAFvB;AAGE,IAAA,GAAG,EAAEF,KAHP;AAIE,IAAA,OAAO,EAAEG;AAJX,kBAME;AAAM,IAAA,SAAS,EAAEX,KAAK,CAACS;AAAvB,KAA+BA,KAA/B,CANF,EAOGK,QAAQ,gBACP,oBAAC,QAAD;AACE,iBAAWV,eAAe,CAACQ,QAAD,CAD5B;AAEE,kBAAYC,aAFd;AAGE,IAAA,SAAS,EAAED,QAAQ,KAAK,eAAb,GAA+BZ,KAAK,CAACe,aAArC,GAAqDf,KAAK,CAACY;AAHxE,IADO,GAML,IAbN,CADF;AAiBD,CArBD;;AAuBA,MAAMI,YAAY,GAAGC,KAAK,IAAI;AAC5B,QAAM;AAACC,IAAAA,IAAD;AAAOC,IAAAA,SAAP;AAAkB,kBAAcC;AAAhC,MAA6CH,KAAnD;AACA,QAAMI,QAAQ,GAAGH,IAAI,CAACI,GAAL,CAAShB,QAAT,CAAjB;AAEA,sBACE;AAAI,IAAA,SAAS,EAAEd,UAAU,CAAC,CAACQ,KAAK,CAACuB,OAAP,EAAgBJ,SAAhB,CAAD,CAAzB;AAAuD,IAAA,KAAK,EAAEC;AAA9D,KACGC,QADH,CADF;AAKD,CATD;;AAWA,MAAMG,cAAN,2CAAuB,CAAC,GAAG3B,IAAI,CAACI,SAAD,CAAR,EAAqB,EAArB,CAAvB;AAEAe,YAAY,CAACS,SAAb,2CAAyB;AACvBP,EAAAA,IAAI,EAAE3B,SAAS,CAACmC,OAAV,CACJnC,SAAS,CAACoC,KAAV,CAAgB;AACdlB,IAAAA,KAAK,EAAEV,IAAI,CAAC0B,SAAL,CAAeG,QADR;AAEdlB,IAAAA,QAAQ,EAAEnB,SAAS,CAACsC,IAFN;AAGdjB,IAAAA,QAAQ,EAAErB,SAAS,CAACuC,KAAV,CAAgBN,cAAhB,CAHI;AAIdb,IAAAA,OAAO,EAAEpB,SAAS,CAACwC,IAJL;AAKdlB,IAAAA,aAAa,EAAEtB,SAAS,CAACyC;AALX,GAAhB,CADI,CADiB;AAUvBb,EAAAA,SAAS,EAAE5B,SAAS,CAACyC,MAVE;AAWvB,gBAAczC,SAAS,CAACyC;AAXD,CAAzB;AAaA,eAAehB,YAAf","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaSolidStatusCheckCircle2 as CheckIcon,\n NovaSolidStatusClose as ErrorIcon\n} from '@coorpacademy/nova-icons';\nimport keys from 'lodash/fp/keys';\nimport snakeCase from 'lodash/fp/snakeCase';\nimport Link from '../../atom/link';\nimport style from './style.css';\n\nconst LeftIcons = {\n BlueValidatedCircle: CheckIcon,\n LocaleInError: ErrorIcon\n};\n\nconst getIconDataName = iconType =>\n iconType === 'LocaleInError' ? 'validated-locale-icon' : 'locale-in-error-icon';\n\nconst buildTab = (tab, index) => {\n const {title, selected, onClick, leftIcon, iconAriaLabel} = tab;\n\n const LeftIcon = LeftIcons[leftIcon];\n return (\n <li\n data-name={`vertical_tab_${snakeCase(title)}`}\n className={classnames(style.tab, selected && style.selected)}\n key={index}\n onClick={onClick}\n >\n <span className={style.title}>{title}</span>\n {LeftIcon ? (\n <LeftIcon\n data-name={getIconDataName(leftIcon)}\n aria-label={iconAriaLabel}\n className={leftIcon === 'LocaleInError' ? style.leftIconError : style.leftIcon}\n />\n ) : null}\n </li>\n );\n};\n\nconst VerticalTabs = props => {\n const {tabs, className, 'aria-label': ariaLabel} = props;\n const tabsList = tabs.map(buildTab);\n\n return (\n <ul className={classnames([style.wrapper, className])} title={ariaLabel}>\n {tabsList}\n </ul>\n );\n};\n\nconst LeftIconValues = [...keys(LeftIcons), ''];\n\nVerticalTabs.propTypes = {\n tabs: PropTypes.arrayOf(\n PropTypes.shape({\n title: Link.propTypes.children,\n selected: PropTypes.bool,\n leftIcon: PropTypes.oneOf(LeftIconValues),\n onClick: PropTypes.func,\n iconAriaLabel: PropTypes.string\n })\n ),\n className: PropTypes.string,\n 'aria-label': PropTypes.string\n};\nexport default VerticalTabs;\n"],"file":"index.js"}
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
@value medium from colors;
|
|
6
6
|
@value cm_blue_50 from colors;
|
|
7
7
|
@value cm_primary_blue from colors;
|
|
8
|
+
@value cm_negative_100 from colors;
|
|
8
9
|
|
|
9
10
|
.wrapper {
|
|
10
11
|
background-color: white;
|
|
@@ -52,6 +53,16 @@
|
|
|
52
53
|
color: cm_primary_blue
|
|
53
54
|
}
|
|
54
55
|
|
|
56
|
+
.leftIconError {
|
|
57
|
+
background-color: cm_negative_100;
|
|
58
|
+
color: white;
|
|
59
|
+
border-radius: 50%;
|
|
60
|
+
padding: 2px;
|
|
61
|
+
width: 9px;
|
|
62
|
+
height: 9px;
|
|
63
|
+
margin-right: 3px;
|
|
64
|
+
}
|
|
65
|
+
|
|
55
66
|
.tab:hover {
|
|
56
67
|
color: cm_blue_50;
|
|
57
68
|
}
|
|
@@ -1,20 +1,25 @@
|
|
|
1
|
+
export const iconAriaLabelError = 'Locale with errors icon';
|
|
2
|
+
export const iconAriaLabelSuccess = 'Validated locale icon';
|
|
1
3
|
export default {
|
|
2
4
|
props: {
|
|
3
5
|
tabs: [{
|
|
4
6
|
title: '🇫🇷 French',
|
|
5
7
|
leftIcon: 'BlueValidatedCircle',
|
|
6
8
|
onClick: () => console.log('click'),
|
|
7
|
-
selected: false
|
|
9
|
+
selected: false,
|
|
10
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
8
11
|
}, {
|
|
9
12
|
title: '🇪🇸 Spanish',
|
|
10
13
|
leftIcon: 'BlueValidatedCircle',
|
|
11
14
|
onClick: () => console.log('click'),
|
|
12
|
-
selected: false
|
|
15
|
+
selected: false,
|
|
16
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
13
17
|
}, {
|
|
14
18
|
title: '🇮🇹 Italian',
|
|
15
19
|
leftIcon: 'BlueValidatedCircle',
|
|
16
20
|
onClick: () => console.log('click'),
|
|
17
|
-
selected: false
|
|
21
|
+
selected: false,
|
|
22
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
18
23
|
}, {
|
|
19
24
|
title: '🇩🇪 German',
|
|
20
25
|
leftIcon: '',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/default.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected"],"mappings":"AAAA,eAAe;
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/default.js"],"names":["iconAriaLabelError","iconAriaLabelSuccess","props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel"],"mappings":"AAAA,OAAO,MAAMA,kBAAkB,GAAG,yBAA3B;AACP,OAAO,MAAMC,oBAAoB,GAAG,uBAA7B;AAEP,eAAe;AACbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KADI,EAQJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KARI,EAeJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KAfI,EAsBJ;AACEG,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAtBI,EA4BJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA5BI,EAkCJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAlCI,EAwCJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAxCI,CADD;AAgDL,kBAAc;AAhDT;AADM,CAAf","sourcesContent":["export const iconAriaLabelError = 'Locale with errors icon';\nexport const iconAriaLabelSuccess = 'Validated locale icon';\n\nexport default {\n props: {\n tabs: [\n {\n title: '🇫🇷 French',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇪🇸 Spanish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇮🇹 Italian',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n }\n ],\n 'aria-label': 'Languages list'\n }\n};\n"],"file":"default.js"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { iconAriaLabelError, iconAriaLabelSuccess } from './default';
|
|
2
|
+
export default {
|
|
3
|
+
props: {
|
|
4
|
+
tabs: [{
|
|
5
|
+
title: '🇫🇷 French',
|
|
6
|
+
leftIcon: 'LocaleInError',
|
|
7
|
+
onClick: () => console.log('click'),
|
|
8
|
+
selected: false,
|
|
9
|
+
iconAriaLabel: iconAriaLabelError
|
|
10
|
+
}, {
|
|
11
|
+
title: '🇪🇸 Spanish',
|
|
12
|
+
leftIcon: 'BlueValidatedCircle',
|
|
13
|
+
onClick: () => console.log('click'),
|
|
14
|
+
selected: false,
|
|
15
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
16
|
+
}, {
|
|
17
|
+
title: '🇮🇹 Italian',
|
|
18
|
+
leftIcon: 'LocaleInError',
|
|
19
|
+
onClick: () => console.log('click'),
|
|
20
|
+
selected: false,
|
|
21
|
+
iconAriaLabel: iconAriaLabelError
|
|
22
|
+
}, {
|
|
23
|
+
title: '🇩🇪 German',
|
|
24
|
+
leftIcon: '',
|
|
25
|
+
onClick: () => console.log('click'),
|
|
26
|
+
selected: false
|
|
27
|
+
}, {
|
|
28
|
+
title: '🇷🇺 Russian',
|
|
29
|
+
leftIcon: '',
|
|
30
|
+
onClick: () => console.log('click'),
|
|
31
|
+
selected: false
|
|
32
|
+
}, {
|
|
33
|
+
title: '🇵🇱 Polish',
|
|
34
|
+
leftIcon: 'BlueValidatedCircle',
|
|
35
|
+
onClick: () => console.log('click'),
|
|
36
|
+
selected: false,
|
|
37
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
38
|
+
}, {
|
|
39
|
+
title: '🇹🇷 Turkish',
|
|
40
|
+
leftIcon: '',
|
|
41
|
+
onClick: () => console.log('click'),
|
|
42
|
+
selected: false
|
|
43
|
+
}],
|
|
44
|
+
'aria-label': 'Languages list'
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=with-multiple-errors.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js"],"names":["iconAriaLabelError","iconAriaLabelSuccess","props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel"],"mappings":"AAAA,SAAQA,kBAAR,EAA4BC,oBAA5B,QAAuD,WAAvD;AAEA,eAAe;AACbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,eAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEV;AALjB,KADI,EAQJ;AACEI,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KARI,EAeJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,eAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEV;AALjB,KAfI,EAsBJ;AACEI,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAtBI,EA4BJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA5BI,EAkCJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KAlCI,EAyCJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAzCI,CADD;AAiDL,kBAAc;AAjDT;AADM,CAAf","sourcesContent":["import {iconAriaLabelError, iconAriaLabelSuccess} from './default';\n\nexport default {\n props: {\n tabs: [\n {\n title: '🇫🇷 French',\n leftIcon: 'LocaleInError',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelError\n },\n {\n title: '🇪🇸 Spanish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇮🇹 Italian',\n leftIcon: 'LocaleInError',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelError\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n }\n ],\n 'aria-label': 'Languages list'\n }\n};\n"],"file":"with-multiple-errors.js"}
|
|
@@ -1,20 +1,24 @@
|
|
|
1
|
+
import { iconAriaLabelError, iconAriaLabelSuccess } from './default';
|
|
1
2
|
export default {
|
|
2
3
|
props: {
|
|
3
4
|
tabs: [{
|
|
4
5
|
title: '🇫🇷 French',
|
|
5
6
|
leftIcon: 'BlueValidatedCircle',
|
|
6
7
|
onClick: () => console.log('click'),
|
|
7
|
-
selected: true
|
|
8
|
+
selected: true,
|
|
9
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
8
10
|
}, {
|
|
9
11
|
title: '🇪🇸 Spanish',
|
|
10
12
|
leftIcon: 'BlueValidatedCircle',
|
|
11
13
|
onClick: () => console.log('click'),
|
|
12
|
-
selected: false
|
|
14
|
+
selected: false,
|
|
15
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
13
16
|
}, {
|
|
14
17
|
title: '🇮🇹 Italian',
|
|
15
18
|
leftIcon: 'BlueValidatedCircle',
|
|
16
19
|
onClick: () => console.log('click'),
|
|
17
|
-
selected: false
|
|
20
|
+
selected: false,
|
|
21
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
18
22
|
}, {
|
|
19
23
|
title: '🇩🇪 German',
|
|
20
24
|
leftIcon: '',
|
|
@@ -72,9 +76,10 @@ export default {
|
|
|
72
76
|
selected: false
|
|
73
77
|
}, {
|
|
74
78
|
title: '🇹🇷 Turkish',
|
|
75
|
-
leftIcon: '',
|
|
79
|
+
leftIcon: 'LocaleInError',
|
|
76
80
|
onClick: () => console.log('click'),
|
|
77
|
-
selected: false
|
|
81
|
+
selected: false,
|
|
82
|
+
iconAriaLabel: iconAriaLabelError
|
|
78
83
|
}],
|
|
79
84
|
'aria-label': 'Languages list'
|
|
80
85
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-selected-item.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected"],"mappings":"AAAA,eAAe;
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-selected-item.js"],"names":["iconAriaLabelError","iconAriaLabelSuccess","props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel"],"mappings":"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","sourcesContent":["import {iconAriaLabelError, iconAriaLabelSuccess} from './default';\n\nexport default {\n props: {\n tabs: [\n {\n title: '🇫🇷 French',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: true,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇪🇸 Spanish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇮🇹 Italian',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: 'LocaleInError',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelError\n }\n ],\n 'aria-label': 'Languages list'\n }\n};\n"],"file":"with-selected-item.js"}
|
|
@@ -233,7 +233,7 @@ ul {
|
|
|
233
233
|
}
|
|
234
234
|
|
|
235
235
|
.checkbox:checked + .summary {
|
|
236
|
-
height:
|
|
236
|
+
height: 70%;
|
|
237
237
|
max-height: 1000px;
|
|
238
238
|
padding: 12px 24px 12px 24px;
|
|
239
239
|
box-shadow: 0 -6px 42px -14px rgba(0, 0, 0, 0.25);
|
|
@@ -243,6 +243,6 @@ ul {
|
|
|
243
243
|
transform: rotateZ(180deg);
|
|
244
244
|
}
|
|
245
245
|
.summarySections {
|
|
246
|
-
max-height:
|
|
246
|
+
max-height: 500px;
|
|
247
247
|
}
|
|
248
248
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
|
|
3
|
-
import
|
|
3
|
+
import verticalMenu from '../../../../molecule/vertical-tabs/test/fixtures/with-selected-item';
|
|
4
4
|
import inputText from '../../../../atom/input-text/test/fixtures/cm-default';
|
|
5
5
|
import textArea from '../../../../atom/input-textarea/test/fixtures/cm-default';
|
|
6
|
-
const languageTabs =
|
|
6
|
+
const languageTabs = verticalMenu.props.tabs;
|
|
7
7
|
export default {
|
|
8
8
|
props: {
|
|
9
9
|
languageTabs,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/organism/content-translation/test/fixtures/default.js"],"names":["
|
|
1
|
+
{"version":3,"sources":["../../../../../src/organism/content-translation/test/fixtures/default.js"],"names":["verticalMenu","inputText","textArea","languageTabs","props","tabs","theme"],"mappings":";;AAAA,OAAOA,YAAP,MAAyB,qEAAzB;AACA,OAAOC,SAAP,MAAsB,sDAAtB;AACA,OAAOC,QAAP,MAAqB,0DAArB;AAEA,MAAMC,YAAY,GAAGH,YAAY,CAACI,KAAb,CAAmBC,IAAxC;AAEA,eAAe;AACbD,EAAAA,KAAK,EAAE;AACLD,IAAAA,YADK;AAELF,IAAAA,SAAS,wBAAMA,SAAS,CAACG,KAAhB;AAAuBE,MAAAA,KAAK,EAAE;AAA9B,MAFJ;AAGLJ,IAAAA,QAAQ,wBAAMA,QAAQ,CAACE,KAAf;AAAsBE,MAAAA,KAAK,EAAE;AAA7B,MAHH;AAIL,uBAAmB;AAJd;AADM,CAAf","sourcesContent":["import verticalMenu from '../../../../molecule/vertical-tabs/test/fixtures/with-selected-item';\nimport inputText from '../../../../atom/input-text/test/fixtures/cm-default';\nimport textArea from '../../../../atom/input-textarea/test/fixtures/cm-default';\n\nconst languageTabs = verticalMenu.props.tabs;\n\nexport default {\n props: {\n languageTabs,\n inputText: {...inputText.props, theme: 'coorpmanager'},\n textArea: {...textArea.props, theme: 'coorpmanager'},\n 'list-aria-label': 'Languages list'\n }\n};\n"],"file":"default.js"}
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
align-items: stretch;
|
|
9
9
|
justify-content: flex-start;
|
|
10
10
|
flex-wrap: wrap;
|
|
11
|
+
height: 100%;
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
.leftSection {
|
|
@@ -24,6 +25,7 @@
|
|
|
24
25
|
display: flex;
|
|
25
26
|
flex-direction: column;
|
|
26
27
|
flex: 0 1 320px;
|
|
28
|
+
height: 100%;
|
|
27
29
|
}
|
|
28
30
|
|
|
29
31
|
.stickySection {
|
|
@@ -32,7 +34,12 @@
|
|
|
32
34
|
z-index: 1;
|
|
33
35
|
bottom: 0;
|
|
34
36
|
right: 64px;
|
|
35
|
-
width:
|
|
37
|
+
width: 320px;
|
|
38
|
+
height: 82%;
|
|
39
|
+
border-radius: 7px;
|
|
40
|
+
height: 80%;
|
|
41
|
+
display: flex;
|
|
42
|
+
flex-direction: column;
|
|
36
43
|
}
|
|
37
44
|
|
|
38
45
|
.header {
|
|
@@ -56,6 +63,9 @@
|
|
|
56
63
|
width: 100%;
|
|
57
64
|
position: relative;
|
|
58
65
|
min-height: 500px;
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: column;
|
|
68
|
+
flex-grow: 1;
|
|
59
69
|
justify-content: space-between;
|
|
60
70
|
}
|
|
61
71
|
|
|
@@ -72,6 +82,7 @@
|
|
|
72
82
|
|
|
73
83
|
.footer {
|
|
74
84
|
width: 100%;
|
|
85
|
+
height: 100%;
|
|
75
86
|
bottom: 0px;
|
|
76
87
|
display: none;
|
|
77
88
|
position: inherit;
|
|
@@ -93,6 +104,7 @@
|
|
|
93
104
|
bottom: 10px;
|
|
94
105
|
position: sticky;
|
|
95
106
|
z-index: 1;
|
|
107
|
+
min-height: 600px;
|
|
96
108
|
}
|
|
97
109
|
.footer::before {
|
|
98
110
|
content: '';
|
|
@@ -107,6 +119,7 @@
|
|
|
107
119
|
|
|
108
120
|
.summaryFooter {
|
|
109
121
|
width: 57%;
|
|
122
|
+
height: 100%;
|
|
110
123
|
}
|
|
111
124
|
|
|
112
125
|
.actionFooter {
|
|
@@ -3,8 +3,6 @@
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
4
|
exports.default = void 0;
|
|
5
5
|
|
|
6
|
-
var _snakeCase2 = _interopRequireDefault(require("lodash/fp/snakeCase"));
|
|
7
|
-
|
|
8
6
|
var _react = _interopRequireDefault(require("react"));
|
|
9
7
|
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
@@ -13,6 +11,10 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
|
13
11
|
|
|
14
12
|
var _novaIcons = require("@coorpacademy/nova-icons");
|
|
15
13
|
|
|
14
|
+
var _keys = _interopRequireDefault(require("lodash/fp/keys"));
|
|
15
|
+
|
|
16
|
+
var _snakeCase = _interopRequireDefault(require("lodash/fp/snakeCase"));
|
|
17
|
+
|
|
16
18
|
var _link = _interopRequireDefault(require("../../atom/link"));
|
|
17
19
|
|
|
18
20
|
var _style = _interopRequireDefault(require("./style.css"));
|
|
@@ -20,26 +22,32 @@ var _style = _interopRequireDefault(require("./style.css"));
|
|
|
20
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
23
|
|
|
22
24
|
const LeftIcons = {
|
|
23
|
-
BlueValidatedCircle: _novaIcons.NovaSolidStatusCheckCircle2
|
|
25
|
+
BlueValidatedCircle: _novaIcons.NovaSolidStatusCheckCircle2,
|
|
26
|
+
LocaleInError: _novaIcons.NovaSolidStatusClose
|
|
24
27
|
};
|
|
25
28
|
|
|
29
|
+
const getIconDataName = iconType => iconType === 'LocaleInError' ? 'validated-locale-icon' : 'locale-in-error-icon';
|
|
30
|
+
|
|
26
31
|
const buildTab = (tab, index) => {
|
|
27
32
|
const {
|
|
28
33
|
title,
|
|
29
34
|
selected,
|
|
30
35
|
onClick,
|
|
31
|
-
leftIcon
|
|
36
|
+
leftIcon,
|
|
37
|
+
iconAriaLabel
|
|
32
38
|
} = tab;
|
|
33
39
|
const LeftIcon = LeftIcons[leftIcon];
|
|
34
40
|
return /*#__PURE__*/_react.default.createElement("li", {
|
|
35
|
-
"data-name": `vertical_tab_${(0,
|
|
41
|
+
"data-name": `vertical_tab_${(0, _snakeCase.default)(title)}`,
|
|
36
42
|
className: (0, _classnames.default)(_style.default.tab, selected && _style.default.selected),
|
|
37
43
|
key: index,
|
|
38
44
|
onClick: onClick
|
|
39
45
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
40
46
|
className: _style.default.title
|
|
41
47
|
}, title), LeftIcon ? /*#__PURE__*/_react.default.createElement(LeftIcon, {
|
|
42
|
-
|
|
48
|
+
"data-name": getIconDataName(leftIcon),
|
|
49
|
+
"aria-label": iconAriaLabel,
|
|
50
|
+
className: leftIcon === 'LocaleInError' ? _style.default.leftIconError : _style.default.leftIcon
|
|
43
51
|
}) : null);
|
|
44
52
|
};
|
|
45
53
|
|
|
@@ -56,12 +64,14 @@ const VerticalTabs = props => {
|
|
|
56
64
|
}, tabsList);
|
|
57
65
|
};
|
|
58
66
|
|
|
67
|
+
const LeftIconValues = process.env.NODE_ENV !== "production" ? [...(0, _keys.default)(LeftIcons), ''] : {};
|
|
59
68
|
VerticalTabs.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
60
69
|
tabs: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
61
70
|
title: _link.default.propTypes.children,
|
|
62
71
|
selected: _propTypes.default.bool,
|
|
63
|
-
leftIcon: _propTypes.default.
|
|
64
|
-
onClick: _propTypes.default.func
|
|
72
|
+
leftIcon: _propTypes.default.oneOf(LeftIconValues),
|
|
73
|
+
onClick: _propTypes.default.func,
|
|
74
|
+
iconAriaLabel: _propTypes.default.string
|
|
65
75
|
})),
|
|
66
76
|
className: _propTypes.default.string,
|
|
67
77
|
'aria-label': _propTypes.default.string
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecule/vertical-tabs/index.js"],"names":["LeftIcons","BlueValidatedCircle","CheckIcon","buildTab","tab","index","title","selected","onClick","leftIcon","LeftIcon","style","VerticalTabs","props","tabs","className","ariaLabel","tabsList","map","wrapper","propTypes","PropTypes","arrayOf","shape","Link","children","bool","
|
|
1
|
+
{"version":3,"sources":["../../../src/molecule/vertical-tabs/index.js"],"names":["LeftIcons","BlueValidatedCircle","CheckIcon","LocaleInError","ErrorIcon","getIconDataName","iconType","buildTab","tab","index","title","selected","onClick","leftIcon","iconAriaLabel","LeftIcon","style","leftIconError","VerticalTabs","props","tabs","className","ariaLabel","tabsList","map","wrapper","LeftIconValues","propTypes","PropTypes","arrayOf","shape","Link","children","bool","oneOf","func","string"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,SAAS,GAAG;AAChBC,EAAAA,mBAAmB,EAAEC,sCADL;AAEhBC,EAAAA,aAAa,EAAEC;AAFC,CAAlB;;AAKA,MAAMC,eAAe,GAAGC,QAAQ,IAC9BA,QAAQ,KAAK,eAAb,GAA+B,uBAA/B,GAAyD,sBAD3D;;AAGA,MAAMC,QAAQ,GAAG,CAACC,GAAD,EAAMC,KAAN,KAAgB;AAC/B,QAAM;AAACC,IAAAA,KAAD;AAAQC,IAAAA,QAAR;AAAkBC,IAAAA,OAAlB;AAA2BC,IAAAA,QAA3B;AAAqCC,IAAAA;AAArC,MAAsDN,GAA5D;AAEA,QAAMO,QAAQ,GAAGf,SAAS,CAACa,QAAD,CAA1B;AACA,sBACE;AACE,iBAAY,gBAAe,wBAAUH,KAAV,CAAiB,EAD9C;AAEE,IAAA,SAAS,EAAE,yBAAWM,eAAMR,GAAjB,EAAsBG,QAAQ,IAAIK,eAAML,QAAxC,CAFb;AAGE,IAAA,GAAG,EAAEF,KAHP;AAIE,IAAA,OAAO,EAAEG;AAJX,kBAME;AAAM,IAAA,SAAS,EAAEI,eAAMN;AAAvB,KAA+BA,KAA/B,CANF,EAOGK,QAAQ,gBACP,6BAAC,QAAD;AACE,iBAAWV,eAAe,CAACQ,QAAD,CAD5B;AAEE,kBAAYC,aAFd;AAGE,IAAA,SAAS,EAAED,QAAQ,KAAK,eAAb,GAA+BG,eAAMC,aAArC,GAAqDD,eAAMH;AAHxE,IADO,GAML,IAbN,CADF;AAiBD,CArBD;;AAuBA,MAAMK,YAAY,GAAGC,KAAK,IAAI;AAC5B,QAAM;AAACC,IAAAA,IAAD;AAAOC,IAAAA,SAAP;AAAkB,kBAAcC;AAAhC,MAA6CH,KAAnD;AACA,QAAMI,QAAQ,GAAGH,IAAI,CAACI,GAAL,CAASjB,QAAT,CAAjB;AAEA,sBACE;AAAI,IAAA,SAAS,EAAE,yBAAW,CAACS,eAAMS,OAAP,EAAgBJ,SAAhB,CAAX,CAAf;AAAuD,IAAA,KAAK,EAAEC;AAA9D,KACGC,QADH,CADF;AAKD,CATD;;AAWA,MAAMG,cAAN,2CAAuB,CAAC,GAAG,mBAAK1B,SAAL,CAAJ,EAAqB,EAArB,CAAvB;AAEAkB,YAAY,CAACS,SAAb,2CAAyB;AACvBP,EAAAA,IAAI,EAAEQ,mBAAUC,OAAV,CACJD,mBAAUE,KAAV,CAAgB;AACdpB,IAAAA,KAAK,EAAEqB,cAAKJ,SAAL,CAAeK,QADR;AAEdrB,IAAAA,QAAQ,EAAEiB,mBAAUK,IAFN;AAGdpB,IAAAA,QAAQ,EAAEe,mBAAUM,KAAV,CAAgBR,cAAhB,CAHI;AAIdd,IAAAA,OAAO,EAAEgB,mBAAUO,IAJL;AAKdrB,IAAAA,aAAa,EAAEc,mBAAUQ;AALX,GAAhB,CADI,CADiB;AAUvBf,EAAAA,SAAS,EAAEO,mBAAUQ,MAVE;AAWvB,gBAAcR,mBAAUQ;AAXD,CAAzB;eAaelB,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaSolidStatusCheckCircle2 as CheckIcon,\n NovaSolidStatusClose as ErrorIcon\n} from '@coorpacademy/nova-icons';\nimport keys from 'lodash/fp/keys';\nimport snakeCase from 'lodash/fp/snakeCase';\nimport Link from '../../atom/link';\nimport style from './style.css';\n\nconst LeftIcons = {\n BlueValidatedCircle: CheckIcon,\n LocaleInError: ErrorIcon\n};\n\nconst getIconDataName = iconType =>\n iconType === 'LocaleInError' ? 'validated-locale-icon' : 'locale-in-error-icon';\n\nconst buildTab = (tab, index) => {\n const {title, selected, onClick, leftIcon, iconAriaLabel} = tab;\n\n const LeftIcon = LeftIcons[leftIcon];\n return (\n <li\n data-name={`vertical_tab_${snakeCase(title)}`}\n className={classnames(style.tab, selected && style.selected)}\n key={index}\n onClick={onClick}\n >\n <span className={style.title}>{title}</span>\n {LeftIcon ? (\n <LeftIcon\n data-name={getIconDataName(leftIcon)}\n aria-label={iconAriaLabel}\n className={leftIcon === 'LocaleInError' ? style.leftIconError : style.leftIcon}\n />\n ) : null}\n </li>\n );\n};\n\nconst VerticalTabs = props => {\n const {tabs, className, 'aria-label': ariaLabel} = props;\n const tabsList = tabs.map(buildTab);\n\n return (\n <ul className={classnames([style.wrapper, className])} title={ariaLabel}>\n {tabsList}\n </ul>\n );\n};\n\nconst LeftIconValues = [...keys(LeftIcons), ''];\n\nVerticalTabs.propTypes = {\n tabs: PropTypes.arrayOf(\n PropTypes.shape({\n title: Link.propTypes.children,\n selected: PropTypes.bool,\n leftIcon: PropTypes.oneOf(LeftIconValues),\n onClick: PropTypes.func,\n iconAriaLabel: PropTypes.string\n })\n ),\n className: PropTypes.string,\n 'aria-label': PropTypes.string\n};\nexport default VerticalTabs;\n"],"file":"index.js"}
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
@value medium from colors;
|
|
6
6
|
@value cm_blue_50 from colors;
|
|
7
7
|
@value cm_primary_blue from colors;
|
|
8
|
+
@value cm_negative_100 from colors;
|
|
8
9
|
|
|
9
10
|
.wrapper {
|
|
10
11
|
background-color: white;
|
|
@@ -52,6 +53,16 @@
|
|
|
52
53
|
color: cm_primary_blue
|
|
53
54
|
}
|
|
54
55
|
|
|
56
|
+
.leftIconError {
|
|
57
|
+
background-color: cm_negative_100;
|
|
58
|
+
color: white;
|
|
59
|
+
border-radius: 50%;
|
|
60
|
+
padding: 2px;
|
|
61
|
+
width: 9px;
|
|
62
|
+
height: 9px;
|
|
63
|
+
margin-right: 3px;
|
|
64
|
+
}
|
|
65
|
+
|
|
55
66
|
.tab:hover {
|
|
56
67
|
color: cm_blue_50;
|
|
57
68
|
}
|
|
@@ -1,24 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
4
|
+
exports.default = exports.iconAriaLabelSuccess = exports.iconAriaLabelError = void 0;
|
|
5
|
+
const iconAriaLabelError = 'Locale with errors icon';
|
|
6
|
+
exports.iconAriaLabelError = iconAriaLabelError;
|
|
7
|
+
const iconAriaLabelSuccess = 'Validated locale icon';
|
|
8
|
+
exports.iconAriaLabelSuccess = iconAriaLabelSuccess;
|
|
5
9
|
var _default = {
|
|
6
10
|
props: {
|
|
7
11
|
tabs: [{
|
|
8
12
|
title: '🇫🇷 French',
|
|
9
13
|
leftIcon: 'BlueValidatedCircle',
|
|
10
14
|
onClick: () => console.log('click'),
|
|
11
|
-
selected: false
|
|
15
|
+
selected: false,
|
|
16
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
12
17
|
}, {
|
|
13
18
|
title: '🇪🇸 Spanish',
|
|
14
19
|
leftIcon: 'BlueValidatedCircle',
|
|
15
20
|
onClick: () => console.log('click'),
|
|
16
|
-
selected: false
|
|
21
|
+
selected: false,
|
|
22
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
17
23
|
}, {
|
|
18
24
|
title: '🇮🇹 Italian',
|
|
19
25
|
leftIcon: 'BlueValidatedCircle',
|
|
20
26
|
onClick: () => console.log('click'),
|
|
21
|
-
selected: false
|
|
27
|
+
selected: false,
|
|
28
|
+
iconAriaLabel: iconAriaLabelSuccess
|
|
22
29
|
}, {
|
|
23
30
|
title: '🇩🇪 German',
|
|
24
31
|
leftIcon: '',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/default.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected"],"mappings":";;;;
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/default.js"],"names":["iconAriaLabelError","iconAriaLabelSuccess","props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel"],"mappings":";;;;AAAO,MAAMA,kBAAkB,GAAG,yBAA3B;;AACA,MAAMC,oBAAoB,GAAG,uBAA7B;;eAEQ;AACbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KADI,EAQJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KARI,EAeJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KAfI,EAsBJ;AACEG,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAtBI,EA4BJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA5BI,EAkCJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAlCI,EAwCJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAxCI,CADD;AAgDL,kBAAc;AAhDT;AADM,C","sourcesContent":["export const iconAriaLabelError = 'Locale with errors icon';\nexport const iconAriaLabelSuccess = 'Validated locale icon';\n\nexport default {\n props: {\n tabs: [\n {\n title: '🇫🇷 French',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇪🇸 Spanish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇮🇹 Italian',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n }\n ],\n 'aria-label': 'Languages list'\n }\n};\n"],"file":"default.js"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _default2 = require("./default");
|
|
7
|
+
|
|
8
|
+
var _default = {
|
|
9
|
+
props: {
|
|
10
|
+
tabs: [{
|
|
11
|
+
title: '🇫🇷 French',
|
|
12
|
+
leftIcon: 'LocaleInError',
|
|
13
|
+
onClick: () => console.log('click'),
|
|
14
|
+
selected: false,
|
|
15
|
+
iconAriaLabel: _default2.iconAriaLabelError
|
|
16
|
+
}, {
|
|
17
|
+
title: '🇪🇸 Spanish',
|
|
18
|
+
leftIcon: 'BlueValidatedCircle',
|
|
19
|
+
onClick: () => console.log('click'),
|
|
20
|
+
selected: false,
|
|
21
|
+
iconAriaLabel: _default2.iconAriaLabelSuccess
|
|
22
|
+
}, {
|
|
23
|
+
title: '🇮🇹 Italian',
|
|
24
|
+
leftIcon: 'LocaleInError',
|
|
25
|
+
onClick: () => console.log('click'),
|
|
26
|
+
selected: false,
|
|
27
|
+
iconAriaLabel: _default2.iconAriaLabelError
|
|
28
|
+
}, {
|
|
29
|
+
title: '🇩🇪 German',
|
|
30
|
+
leftIcon: '',
|
|
31
|
+
onClick: () => console.log('click'),
|
|
32
|
+
selected: false
|
|
33
|
+
}, {
|
|
34
|
+
title: '🇷🇺 Russian',
|
|
35
|
+
leftIcon: '',
|
|
36
|
+
onClick: () => console.log('click'),
|
|
37
|
+
selected: false
|
|
38
|
+
}, {
|
|
39
|
+
title: '🇵🇱 Polish',
|
|
40
|
+
leftIcon: 'BlueValidatedCircle',
|
|
41
|
+
onClick: () => console.log('click'),
|
|
42
|
+
selected: false,
|
|
43
|
+
iconAriaLabel: _default2.iconAriaLabelSuccess
|
|
44
|
+
}, {
|
|
45
|
+
title: '🇹🇷 Turkish',
|
|
46
|
+
leftIcon: '',
|
|
47
|
+
onClick: () => console.log('click'),
|
|
48
|
+
selected: false
|
|
49
|
+
}],
|
|
50
|
+
'aria-label': 'Languages list'
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
exports.default = _default;
|
|
54
|
+
//# sourceMappingURL=with-multiple-errors.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel","iconAriaLabelError","iconAriaLabelSuccess"],"mappings":";;;;;AAAA;;eAEe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,eAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEC;AALjB,KADI,EAQJ;AACEP,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEE;AALjB,KARI,EAeJ;AACER,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,eAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEC;AALjB,KAfI,EAsBJ;AACEP,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAtBI,EA4BJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA5BI,EAkCJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEE;AALjB,KAlCI,EAyCJ;AACER,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAzCI,CADD;AAiDL,kBAAc;AAjDT;AADM,C","sourcesContent":["import {iconAriaLabelError, iconAriaLabelSuccess} from './default';\n\nexport default {\n props: {\n tabs: [\n {\n title: '🇫🇷 French',\n leftIcon: 'LocaleInError',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelError\n },\n {\n title: '🇪🇸 Spanish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇮🇹 Italian',\n leftIcon: 'LocaleInError',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelError\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n }\n ],\n 'aria-label': 'Languages list'\n }\n};\n"],"file":"with-multiple-errors.js"}
|
|
@@ -2,23 +2,29 @@
|
|
|
2
2
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
4
|
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _default2 = require("./default");
|
|
7
|
+
|
|
5
8
|
var _default = {
|
|
6
9
|
props: {
|
|
7
10
|
tabs: [{
|
|
8
11
|
title: '🇫🇷 French',
|
|
9
12
|
leftIcon: 'BlueValidatedCircle',
|
|
10
13
|
onClick: () => console.log('click'),
|
|
11
|
-
selected: true
|
|
14
|
+
selected: true,
|
|
15
|
+
iconAriaLabel: _default2.iconAriaLabelSuccess
|
|
12
16
|
}, {
|
|
13
17
|
title: '🇪🇸 Spanish',
|
|
14
18
|
leftIcon: 'BlueValidatedCircle',
|
|
15
19
|
onClick: () => console.log('click'),
|
|
16
|
-
selected: false
|
|
20
|
+
selected: false,
|
|
21
|
+
iconAriaLabel: _default2.iconAriaLabelSuccess
|
|
17
22
|
}, {
|
|
18
23
|
title: '🇮🇹 Italian',
|
|
19
24
|
leftIcon: 'BlueValidatedCircle',
|
|
20
25
|
onClick: () => console.log('click'),
|
|
21
|
-
selected: false
|
|
26
|
+
selected: false,
|
|
27
|
+
iconAriaLabel: _default2.iconAriaLabelSuccess
|
|
22
28
|
}, {
|
|
23
29
|
title: '🇩🇪 German',
|
|
24
30
|
leftIcon: '',
|
|
@@ -76,9 +82,10 @@ var _default = {
|
|
|
76
82
|
selected: false
|
|
77
83
|
}, {
|
|
78
84
|
title: '🇹🇷 Turkish',
|
|
79
|
-
leftIcon: '',
|
|
85
|
+
leftIcon: 'LocaleInError',
|
|
80
86
|
onClick: () => console.log('click'),
|
|
81
|
-
selected: false
|
|
87
|
+
selected: false,
|
|
88
|
+
iconAriaLabel: _default2.iconAriaLabelError
|
|
82
89
|
}],
|
|
83
90
|
'aria-label': 'Languages list'
|
|
84
91
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-selected-item.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-selected-item.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel","iconAriaLabelSuccess","iconAriaLabelError"],"mappings":"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","sourcesContent":["import {iconAriaLabelError, iconAriaLabelSuccess} from './default';\n\nexport default {\n props: {\n tabs: [\n {\n title: '🇫🇷 French',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: true,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇪🇸 Spanish',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇮🇹 Italian',\n leftIcon: 'BlueValidatedCircle',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelSuccess\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇩🇪 German',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇷🇺 Russian',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇵🇱 Polish',\n leftIcon: '',\n onClick: () => console.log('click'),\n selected: false\n },\n {\n title: '🇹🇷 Turkish',\n leftIcon: 'LocaleInError',\n onClick: () => console.log('click'),\n selected: false,\n iconAriaLabel: iconAriaLabelError\n }\n ],\n 'aria-label': 'Languages list'\n }\n};\n"],"file":"with-selected-item.js"}
|
|
@@ -233,7 +233,7 @@ ul {
|
|
|
233
233
|
}
|
|
234
234
|
|
|
235
235
|
.checkbox:checked + .summary {
|
|
236
|
-
height:
|
|
236
|
+
height: 70%;
|
|
237
237
|
max-height: 1000px;
|
|
238
238
|
padding: 12px 24px 12px 24px;
|
|
239
239
|
box-shadow: 0 -6px 42px -14px rgba(0, 0, 0, 0.25);
|
|
@@ -243,6 +243,6 @@ ul {
|
|
|
243
243
|
transform: rotateZ(180deg);
|
|
244
244
|
}
|
|
245
245
|
.summarySections {
|
|
246
|
-
max-height:
|
|
246
|
+
max-height: 500px;
|
|
247
247
|
}
|
|
248
248
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/organism/content-translation/test/fixtures/default.js"],"names":["languageTabs","
|
|
1
|
+
{"version":3,"sources":["../../../../../src/organism/content-translation/test/fixtures/default.js"],"names":["languageTabs","verticalMenu","props","tabs","inputText","theme","textArea"],"mappings":";;;;;AAAA;;AACA;;AACA;;;;;;AAEA,MAAMA,YAAY,GAAGC,0BAAaC,KAAb,CAAmBC,IAAxC;eAEe;AACbD,EAAAA,KAAK,EAAE;AACLF,IAAAA,YADK;AAELI,IAAAA,SAAS,wBAAMA,mBAAUF,KAAhB;AAAuBG,MAAAA,KAAK,EAAE;AAA9B,MAFJ;AAGLC,IAAAA,QAAQ,wBAAMA,oBAASJ,KAAf;AAAsBG,MAAAA,KAAK,EAAE;AAA7B,MAHH;AAIL,uBAAmB;AAJd;AADM,C","sourcesContent":["import verticalMenu from '../../../../molecule/vertical-tabs/test/fixtures/with-selected-item';\nimport inputText from '../../../../atom/input-text/test/fixtures/cm-default';\nimport textArea from '../../../../atom/input-textarea/test/fixtures/cm-default';\n\nconst languageTabs = verticalMenu.props.tabs;\n\nexport default {\n props: {\n languageTabs,\n inputText: {...inputText.props, theme: 'coorpmanager'},\n textArea: {...textArea.props, theme: 'coorpmanager'},\n 'list-aria-label': 'Languages list'\n }\n};\n"],"file":"default.js"}
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
align-items: stretch;
|
|
9
9
|
justify-content: flex-start;
|
|
10
10
|
flex-wrap: wrap;
|
|
11
|
+
height: 100%;
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
.leftSection {
|
|
@@ -24,6 +25,7 @@
|
|
|
24
25
|
display: flex;
|
|
25
26
|
flex-direction: column;
|
|
26
27
|
flex: 0 1 320px;
|
|
28
|
+
height: 100%;
|
|
27
29
|
}
|
|
28
30
|
|
|
29
31
|
.stickySection {
|
|
@@ -32,7 +34,12 @@
|
|
|
32
34
|
z-index: 1;
|
|
33
35
|
bottom: 0;
|
|
34
36
|
right: 64px;
|
|
35
|
-
width:
|
|
37
|
+
width: 320px;
|
|
38
|
+
height: 82%;
|
|
39
|
+
border-radius: 7px;
|
|
40
|
+
height: 80%;
|
|
41
|
+
display: flex;
|
|
42
|
+
flex-direction: column;
|
|
36
43
|
}
|
|
37
44
|
|
|
38
45
|
.header {
|
|
@@ -56,6 +63,9 @@
|
|
|
56
63
|
width: 100%;
|
|
57
64
|
position: relative;
|
|
58
65
|
min-height: 500px;
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: column;
|
|
68
|
+
flex-grow: 1;
|
|
59
69
|
justify-content: space-between;
|
|
60
70
|
}
|
|
61
71
|
|
|
@@ -72,6 +82,7 @@
|
|
|
72
82
|
|
|
73
83
|
.footer {
|
|
74
84
|
width: 100%;
|
|
85
|
+
height: 100%;
|
|
75
86
|
bottom: 0px;
|
|
76
87
|
display: none;
|
|
77
88
|
position: inherit;
|
|
@@ -93,6 +104,7 @@
|
|
|
93
104
|
bottom: 10px;
|
|
94
105
|
position: sticky;
|
|
95
106
|
z-index: 1;
|
|
107
|
+
min-height: 600px;
|
|
96
108
|
}
|
|
97
109
|
.footer::before {
|
|
98
110
|
content: '';
|
|
@@ -107,6 +119,7 @@
|
|
|
107
119
|
|
|
108
120
|
.summaryFooter {
|
|
109
121
|
width: 57%;
|
|
122
|
+
height: 100%;
|
|
110
123
|
}
|
|
111
124
|
|
|
112
125
|
.actionFooter {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coorpacademy/components",
|
|
3
|
-
"version": "10.3.
|
|
3
|
+
"version": "10.3.21-alpha.2+c5a486311",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -119,5 +119,5 @@
|
|
|
119
119
|
"webpack-hot-middleware": "^2.25.0"
|
|
120
120
|
},
|
|
121
121
|
"author": "CoorpAcademy",
|
|
122
|
-
"gitHead": "
|
|
122
|
+
"gitHead": "c5a486311fd514d025f378d5f50f24b5ccbd1a3c"
|
|
123
123
|
}
|