@coorpacademy/components 11.38.2 → 11.38.3-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/atom/input-search/index.d.ts +2 -0
- package/es/atom/input-search/index.d.ts.map +1 -1
- package/es/atom/input-search/index.js +46 -13
- package/es/atom/input-search/index.js.map +1 -1
- package/es/atom/input-search/style.css +97 -0
- package/es/molecule/cm-popin/types.d.ts +2 -0
- package/es/molecule/cm-popin/types.d.ts.map +1 -1
- package/es/molecule/multi-filter-panel/index.d.ts +2 -0
- package/es/molecule/multi-filter-panel/index.d.ts.map +1 -1
- package/es/molecule/multi-filter-panel/prop-types.d.ts +2 -0
- package/es/molecule/multi-filter-panel/prop-types.d.ts.map +1 -1
- package/es/molecule/search-form/index.d.ts +5 -0
- package/es/molecule/search-form/index.d.ts.map +1 -1
- package/es/molecule/search-form/index.js +26 -16
- package/es/molecule/search-form/index.js.map +1 -1
- package/es/molecule/search-form/style.css +21 -6
- package/es/organism/brand-table/index.d.ts +2 -0
- package/es/organism/content-skill-modal/index.d.ts +4 -0
- package/es/organism/content-skill-modal/index.d.ts.map +1 -1
- package/es/organism/content-skill-modal/types.d.ts +4 -0
- package/es/organism/content-skill-modal/types.d.ts.map +1 -1
- package/es/organism/filter-checkbox-and-search/index.d.ts +2 -0
- package/es/organism/filter-checkbox-and-search/index.d.ts.map +1 -1
- package/es/organism/filter-checkbox-and-search/props-types.d.ts +2 -0
- package/es/organism/filter-checkbox-and-search/props-types.d.ts.map +1 -1
- package/es/organism/list-items/index.d.ts +2 -0
- package/es/organism/mooc-header/index.d.ts +14 -0
- package/es/organism/mooc-header/index.d.ts.map +1 -1
- package/es/organism/mooc-header/index.js +132 -13
- package/es/organism/mooc-header/index.js.map +1 -1
- package/es/organism/mooc-header/style.css +182 -8
- package/es/template/app-player/loading/index.d.ts +2 -0
- package/es/template/app-player/player/index.d.ts +4 -0
- package/es/template/app-player/player/slides/index.d.ts +2 -0
- package/es/template/app-player/player/slides/index.d.ts.map +1 -1
- package/es/template/app-player/popin-correction/index.d.ts +2 -0
- package/es/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/es/template/app-player/popin-end/index.d.ts +2 -0
- package/es/template/app-review/index.d.ts +2 -0
- package/es/template/app-review/index.d.ts.map +1 -1
- package/es/template/app-review/player/prop-types.d.ts +2 -0
- package/es/template/app-review/player/prop-types.d.ts.map +1 -1
- package/es/template/app-review/prop-types.d.ts +2 -0
- package/es/template/app-review/prop-types.d.ts.map +1 -1
- package/es/template/back-office/brand-update/index.d.ts +12 -0
- package/es/template/common/dashboard/index.d.ts +4 -0
- package/es/template/common/search-page/index.d.ts +2 -0
- package/es/template/external-course/index.d.ts +2 -0
- package/es/util/check-is-mobile.d.ts +1 -1
- package/es/util/check-is-mobile.d.ts.map +1 -1
- package/es/util/check-is-mobile.js +4 -2
- package/es/util/check-is-mobile.js.map +1 -1
- package/lib/atom/input-search/index.d.ts +2 -0
- package/lib/atom/input-search/index.d.ts.map +1 -1
- package/lib/atom/input-search/index.js +46 -13
- package/lib/atom/input-search/index.js.map +1 -1
- package/lib/atom/input-search/style.css +97 -0
- package/lib/molecule/cm-popin/types.d.ts +2 -0
- package/lib/molecule/cm-popin/types.d.ts.map +1 -1
- package/lib/molecule/multi-filter-panel/index.d.ts +2 -0
- package/lib/molecule/multi-filter-panel/index.d.ts.map +1 -1
- package/lib/molecule/multi-filter-panel/prop-types.d.ts +2 -0
- package/lib/molecule/multi-filter-panel/prop-types.d.ts.map +1 -1
- package/lib/molecule/search-form/index.d.ts +5 -0
- package/lib/molecule/search-form/index.d.ts.map +1 -1
- package/lib/molecule/search-form/index.js +27 -17
- package/lib/molecule/search-form/index.js.map +1 -1
- package/lib/molecule/search-form/style.css +21 -6
- package/lib/organism/brand-table/index.d.ts +2 -0
- package/lib/organism/content-skill-modal/index.d.ts +4 -0
- package/lib/organism/content-skill-modal/index.d.ts.map +1 -1
- package/lib/organism/content-skill-modal/types.d.ts +4 -0
- package/lib/organism/content-skill-modal/types.d.ts.map +1 -1
- package/lib/organism/filter-checkbox-and-search/index.d.ts +2 -0
- package/lib/organism/filter-checkbox-and-search/index.d.ts.map +1 -1
- package/lib/organism/filter-checkbox-and-search/props-types.d.ts +2 -0
- package/lib/organism/filter-checkbox-and-search/props-types.d.ts.map +1 -1
- package/lib/organism/list-items/index.d.ts +2 -0
- package/lib/organism/mooc-header/index.d.ts +14 -0
- package/lib/organism/mooc-header/index.d.ts.map +1 -1
- package/lib/organism/mooc-header/index.js +132 -13
- package/lib/organism/mooc-header/index.js.map +1 -1
- package/lib/organism/mooc-header/style.css +182 -8
- package/lib/template/app-player/loading/index.d.ts +2 -0
- package/lib/template/app-player/player/index.d.ts +4 -0
- package/lib/template/app-player/player/slides/index.d.ts +2 -0
- package/lib/template/app-player/player/slides/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-correction/index.d.ts +2 -0
- package/lib/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-end/index.d.ts +2 -0
- package/lib/template/app-review/index.d.ts +2 -0
- package/lib/template/app-review/index.d.ts.map +1 -1
- package/lib/template/app-review/player/prop-types.d.ts +2 -0
- package/lib/template/app-review/player/prop-types.d.ts.map +1 -1
- package/lib/template/app-review/prop-types.d.ts +2 -0
- package/lib/template/app-review/prop-types.d.ts.map +1 -1
- package/lib/template/back-office/brand-update/index.d.ts +12 -0
- package/lib/template/common/dashboard/index.d.ts +4 -0
- package/lib/template/common/search-page/index.d.ts +2 -0
- package/lib/template/external-course/index.d.ts +2 -0
- package/lib/util/check-is-mobile.d.ts +1 -1
- package/lib/util/check-is-mobile.d.ts.map +1 -1
- package/lib/util/check-is-mobile.js +4 -2
- package/lib/util/check-is-mobile.js.map +1 -1
- package/package.json +2 -2
|
@@ -31,6 +31,8 @@ declare namespace Search {
|
|
|
31
31
|
const onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
32
32
|
const onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
33
33
|
const onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
34
|
+
const onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
35
|
+
const inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
34
36
|
const theme: PropTypes.Requireable<string>;
|
|
35
37
|
const dataTestId: PropTypes.Requireable<string>;
|
|
36
38
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-search/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-search/index.js"],"names":[],"mappings":";AAiBA,iDAoFC"}
|
|
@@ -6,6 +6,10 @@ import classnames from 'classnames';
|
|
|
6
6
|
import { NovaCompositionCoorpacademySearchThin as CMSearchIcon, NovaCompositionCoorpacademySearch as SearchIcon, NovaSolidStatusClose as CloseIcon } from '@coorpacademy/nova-icons';
|
|
7
7
|
import Provider from '../provider';
|
|
8
8
|
import style from './style.css';
|
|
9
|
+
const handleMouseDown = e => {
|
|
10
|
+
e.preventDefault();
|
|
11
|
+
e.stopPropagation();
|
|
12
|
+
};
|
|
9
13
|
const Search = props => {
|
|
10
14
|
const {
|
|
11
15
|
value,
|
|
@@ -14,27 +18,53 @@ const Search = props => {
|
|
|
14
18
|
onClear = _noop,
|
|
15
19
|
onFocus,
|
|
16
20
|
onBlur,
|
|
21
|
+
onKeyDown,
|
|
22
|
+
inputRef,
|
|
17
23
|
theme = 'default',
|
|
18
24
|
dataTestId
|
|
19
25
|
} = props;
|
|
20
26
|
const handleChange = useMemo(() => e => onChange(e.target.value), [onChange]);
|
|
21
|
-
const
|
|
22
|
-
|
|
27
|
+
const handleKeyDown = useMemo(() => e => {
|
|
28
|
+
if (onKeyDown) {
|
|
29
|
+
onKeyDown(e);
|
|
30
|
+
}
|
|
31
|
+
}, [onKeyDown]);
|
|
32
|
+
const isCoorpManager = theme === 'coorpmanager';
|
|
33
|
+
const isMooc = theme === 'mooc';
|
|
34
|
+
const isDefault = theme === 'default';
|
|
35
|
+
const wrapperClass = classnames({
|
|
36
|
+
[style.wrapperSearch]: isDefault,
|
|
37
|
+
[style.coorpmanager]: isCoorpManager,
|
|
38
|
+
[style.wrapperMooc]: isMooc
|
|
39
|
+
});
|
|
40
|
+
const wrapperParentClass = classnames({
|
|
41
|
+
[style.wrapperMoocParent]: isMooc
|
|
42
|
+
});
|
|
43
|
+
const searchClass = classnames({
|
|
44
|
+
[style.search]: true,
|
|
45
|
+
[style.moocSearch]: isMooc
|
|
46
|
+
});
|
|
47
|
+
const SearchIconComponent = isCoorpManager ? CMSearchIcon : SearchIcon;
|
|
48
|
+
const showTitle = isCoorpManager;
|
|
49
|
+
const showClearIcon = value && isCoorpManager;
|
|
23
50
|
return /*#__PURE__*/React.createElement("div", {
|
|
24
|
-
className:
|
|
51
|
+
className: wrapperParentClass
|
|
52
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
53
|
+
className: wrapperClass
|
|
25
54
|
}, /*#__PURE__*/React.createElement("label", {
|
|
26
55
|
htmlFor: "search",
|
|
27
56
|
title: placeholder
|
|
28
|
-
},
|
|
29
|
-
className: style.searchIcon
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
}),
|
|
57
|
+
}, /*#__PURE__*/React.createElement(SearchIconComponent, {
|
|
58
|
+
className: style.searchIcon,
|
|
59
|
+
"data-name": "search-icon",
|
|
60
|
+
onMouseDown: handleMouseDown
|
|
61
|
+
}), showTitle ? /*#__PURE__*/React.createElement("span", {
|
|
33
62
|
className: classnames(style.title, _isEmpty(value) && style.noValue)
|
|
34
63
|
}, placeholder) : null), /*#__PURE__*/React.createElement("input", {
|
|
64
|
+
ref: inputRef,
|
|
35
65
|
"data-name": "search-input",
|
|
36
66
|
"data-testid": dataTestId,
|
|
37
|
-
className:
|
|
67
|
+
className: searchClass,
|
|
38
68
|
"aria-label": placeholder,
|
|
39
69
|
type: "text",
|
|
40
70
|
name: "search",
|
|
@@ -45,11 +75,12 @@ const Search = props => {
|
|
|
45
75
|
onInput: handleChange,
|
|
46
76
|
onFocus: onFocus,
|
|
47
77
|
onChange: _noop,
|
|
48
|
-
onBlur: onBlur
|
|
49
|
-
|
|
78
|
+
onBlur: onBlur,
|
|
79
|
+
onKeyDown: handleKeyDown
|
|
80
|
+
}), showClearIcon ? /*#__PURE__*/React.createElement(CloseIcon, {
|
|
50
81
|
onClick: onClear,
|
|
51
82
|
className: style.clearIcon
|
|
52
|
-
}) : null);
|
|
83
|
+
}) : null));
|
|
53
84
|
};
|
|
54
85
|
Search.contextTypes = {
|
|
55
86
|
skin: Provider.childContextTypes.skin
|
|
@@ -61,7 +92,9 @@ Search.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
61
92
|
onClear: PropTypes.func,
|
|
62
93
|
onFocus: PropTypes.func,
|
|
63
94
|
onBlur: PropTypes.func,
|
|
64
|
-
|
|
95
|
+
onKeyDown: PropTypes.func,
|
|
96
|
+
inputRef: PropTypes.func,
|
|
97
|
+
theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc']),
|
|
65
98
|
dataTestId: PropTypes.string
|
|
66
99
|
} : {};
|
|
67
100
|
export default Search;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","classnames","NovaCompositionCoorpacademySearchThin","CMSearchIcon","NovaCompositionCoorpacademySearch","SearchIcon","NovaSolidStatusClose","CloseIcon","Provider","style","Search","props","value","placeholder","onChange","_noop","onClear","onFocus","onBlur","theme","dataTestId","handleChange","
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","classnames","NovaCompositionCoorpacademySearchThin","CMSearchIcon","NovaCompositionCoorpacademySearch","SearchIcon","NovaSolidStatusClose","CloseIcon","Provider","style","handleMouseDown","e","preventDefault","stopPropagation","Search","props","value","placeholder","onChange","_noop","onClear","onFocus","onBlur","onKeyDown","inputRef","theme","dataTestId","handleChange","target","handleKeyDown","isCoorpManager","isMooc","isDefault","wrapperClass","wrapperSearch","coorpmanager","wrapperMooc","wrapperParentClass","wrapperMoocParent","searchClass","search","moocSearch","SearchIconComponent","showTitle","showClearIcon","createElement","className","htmlFor","title","searchIcon","onMouseDown","_isEmpty","noValue","ref","type","name","id","onInput","onClick","clearIcon","contextTypes","skin","childContextTypes","propTypes","process","env","NODE_ENV","string","isRequired","func","oneOf"],"sources":["../../../src/atom/input-search/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaCompositionCoorpacademySearchThin as CMSearchIcon,\n NovaCompositionCoorpacademySearch as SearchIcon,\n NovaSolidStatusClose as CloseIcon\n} from '@coorpacademy/nova-icons';\nimport {noop, isEmpty} from 'lodash/fp';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst handleMouseDown = e => {\n e.preventDefault();\n e.stopPropagation();\n};\n\nconst Search = props => {\n const {\n value,\n placeholder,\n onChange = noop,\n onClear = noop,\n onFocus,\n onBlur,\n onKeyDown,\n inputRef,\n theme = 'default',\n dataTestId\n } = props;\n const handleChange = useMemo(() => e => onChange(e.target.value), [onChange]);\n\n const handleKeyDown = useMemo(\n () => e => {\n if (onKeyDown) {\n onKeyDown(e);\n }\n },\n [onKeyDown]\n );\n\n const isCoorpManager = theme === 'coorpmanager';\n const isMooc = theme === 'mooc';\n const isDefault = theme === 'default';\n\n const wrapperClass = classnames({\n [style.wrapperSearch]: isDefault,\n [style.coorpmanager]: isCoorpManager,\n [style.wrapperMooc]: isMooc\n });\n\n const wrapperParentClass = classnames({\n [style.wrapperMoocParent]: isMooc\n });\n\n const searchClass = classnames({\n [style.search]: true,\n [style.moocSearch]: isMooc\n });\n\n const SearchIconComponent = isCoorpManager ? CMSearchIcon : SearchIcon;\n const showTitle = isCoorpManager;\n const showClearIcon = value && isCoorpManager;\n\n return (\n <div className={wrapperParentClass}>\n <div className={wrapperClass}>\n <label htmlFor=\"search\" title={placeholder}>\n <SearchIconComponent\n className={style.searchIcon}\n data-name=\"search-icon\"\n onMouseDown={handleMouseDown}\n />\n {showTitle ? (\n <span className={classnames(style.title, isEmpty(value) && style.noValue)}>\n {placeholder}\n </span>\n ) : null}\n </label>\n <input\n ref={inputRef}\n data-name=\"search-input\"\n data-testid={dataTestId}\n className={searchClass}\n aria-label={placeholder}\n type=\"text\"\n name=\"search\"\n id=\"search\"\n placeholder={placeholder}\n title={placeholder}\n value={value}\n onInput={handleChange}\n onFocus={onFocus}\n onChange={noop}\n onBlur={onBlur}\n onKeyDown={handleKeyDown}\n />\n {showClearIcon ? <CloseIcon onClick={onClear} className={style.clearIcon} /> : null}\n </div>\n </div>\n );\n};\n\nSearch.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nSearch.propTypes = {\n value: PropTypes.string,\n placeholder: PropTypes.string.isRequired,\n onChange: PropTypes.func,\n onClear: PropTypes.func,\n onFocus: PropTypes.func,\n onBlur: PropTypes.func,\n onKeyDown: PropTypes.func,\n inputRef: PropTypes.func,\n theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc']),\n dataTestId: PropTypes.string\n};\n\nexport default Search;\n"],"mappings":";;AAAA,OAAOA,KAAK,IAAGC,OAAO,QAAO,OAAO;AACpC,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,SACEC,qCAAqC,IAAIC,YAAY,EACrDC,iCAAiC,IAAIC,UAAU,EAC/CC,oBAAoB,IAAIC,SAAS,QAC5B,0BAA0B;AAEjC,OAAOC,QAAQ,MAAM,aAAa;AAClC,OAAOC,KAAK,MAAM,aAAa;AAE/B,MAAMC,eAAe,GAAGC,CAAC,IAAI;EAC3BA,CAAC,CAACC,cAAc,CAAC,CAAC;EAClBD,CAAC,CAACE,eAAe,CAAC,CAAC;AACrB,CAAC;AAED,MAAMC,MAAM,GAAGC,KAAK,IAAI;EACtB,MAAM;IACJC,KAAK;IACLC,WAAW;IACXC,QAAQ,GAAAC,KAAO;IACfC,OAAO,GAAAD,KAAO;IACdE,OAAO;IACPC,MAAM;IACNC,SAAS;IACTC,QAAQ;IACRC,KAAK,GAAG,SAAS;IACjBC;EACF,CAAC,GAAGX,KAAK;EACT,MAAMY,YAAY,GAAG5B,OAAO,CAAC,MAAMY,CAAC,IAAIO,QAAQ,CAACP,CAAC,CAACiB,MAAM,CAACZ,KAAK,CAAC,EAAE,CAACE,QAAQ,CAAC,CAAC;EAE7E,MAAMW,aAAa,GAAG9B,OAAO,CAC3B,MAAMY,CAAC,IAAI;IACT,IAAIY,SAAS,EAAE;MACbA,SAAS,CAACZ,CAAC,CAAC;IACd;EACF,CAAC,EACD,CAACY,SAAS,CACZ,CAAC;EAED,MAAMO,cAAc,GAAGL,KAAK,KAAK,cAAc;EAC/C,MAAMM,MAAM,GAAGN,KAAK,KAAK,MAAM;EAC/B,MAAMO,SAAS,GAAGP,KAAK,KAAK,SAAS;EAErC,MAAMQ,YAAY,GAAGhC,UAAU,CAAC;IAC9B,CAACQ,KAAK,CAACyB,aAAa,GAAGF,SAAS;IAChC,CAACvB,KAAK,CAAC0B,YAAY,GAAGL,cAAc;IACpC,CAACrB,KAAK,CAAC2B,WAAW,GAAGL;EACvB,CAAC,CAAC;EAEF,MAAMM,kBAAkB,GAAGpC,UAAU,CAAC;IACpC,CAACQ,KAAK,CAAC6B,iBAAiB,GAAGP;EAC7B,CAAC,CAAC;EAEF,MAAMQ,WAAW,GAAGtC,UAAU,CAAC;IAC7B,CAACQ,KAAK,CAAC+B,MAAM,GAAG,IAAI;IACpB,CAAC/B,KAAK,CAACgC,UAAU,GAAGV;EACtB,CAAC,CAAC;EAEF,MAAMW,mBAAmB,GAAGZ,cAAc,GAAG3B,YAAY,GAAGE,UAAU;EACtE,MAAMsC,SAAS,GAAGb,cAAc;EAChC,MAAMc,aAAa,GAAG5B,KAAK,IAAIc,cAAc;EAE7C,oBACEhC,KAAA,CAAA+C,aAAA;IAAKC,SAAS,EAAET;EAAmB,gBACjCvC,KAAA,CAAA+C,aAAA;IAAKC,SAAS,EAAEb;EAAa,gBAC3BnC,KAAA,CAAA+C,aAAA;IAAOE,OAAO,EAAC,QAAQ;IAACC,KAAK,EAAE/B;EAAY,gBACzCnB,KAAA,CAAA+C,aAAA,CAACH,mBAAmB;IAClBI,SAAS,EAAErC,KAAK,CAACwC,UAAW;IAC5B,aAAU,aAAa;IACvBC,WAAW,EAAExC;EAAgB,CAC9B,CAAC,EACDiC,SAAS,gBACR7C,KAAA,CAAA+C,aAAA;IAAMC,SAAS,EAAE7C,UAAU,CAACQ,KAAK,CAACuC,KAAK,EAAEG,QAAA,CAAQnC,KAAK,CAAC,IAAIP,KAAK,CAAC2C,OAAO;EAAE,GACvEnC,WACG,CAAC,GACL,IACC,CAAC,eACRnB,KAAA,CAAA+C,aAAA;IACEQ,GAAG,EAAE7B,QAAS;IACd,aAAU,cAAc;IACxB,eAAaE,UAAW;IACxBoB,SAAS,EAAEP,WAAY;IACvB,cAAYtB,WAAY;IACxBqC,IAAI,EAAC,MAAM;IACXC,IAAI,EAAC,QAAQ;IACbC,EAAE,EAAC,QAAQ;IACXvC,WAAW,EAAEA,WAAY;IACzB+B,KAAK,EAAE/B,WAAY;IACnBD,KAAK,EAAEA,KAAM;IACbyC,OAAO,EAAE9B,YAAa;IACtBN,OAAO,EAAEA,OAAQ;IACjBH,QAAQ,EAAAC,KAAO;IACfG,MAAM,EAAEA,MAAO;IACfC,SAAS,EAAEM;EAAc,CAC1B,CAAC,EACDe,aAAa,gBAAG9C,KAAA,CAAA+C,aAAA,CAACtC,SAAS;IAACmD,OAAO,EAAEtC,OAAQ;IAAC0B,SAAS,EAAErC,KAAK,CAACkD;EAAU,CAAE,CAAC,GAAG,IAC5E,CACF,CAAC;AAEV,CAAC;AAED7C,MAAM,CAAC8C,YAAY,GAAG;EACpBC,IAAI,EAAErD,QAAQ,CAACsD,iBAAiB,CAACD;AACnC,CAAC;AAED/C,MAAM,CAACiD,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EACjBlD,KAAK,EAAEhB,SAAS,CAACmE,MAAM;EACvBlD,WAAW,EAAEjB,SAAS,CAACmE,MAAM,CAACC,UAAU;EACxClD,QAAQ,EAAElB,SAAS,CAACqE,IAAI;EACxBjD,OAAO,EAAEpB,SAAS,CAACqE,IAAI;EACvBhD,OAAO,EAAErB,SAAS,CAACqE,IAAI;EACvB/C,MAAM,EAAEtB,SAAS,CAACqE,IAAI;EACtB9C,SAAS,EAAEvB,SAAS,CAACqE,IAAI;EACzB7C,QAAQ,EAAExB,SAAS,CAACqE,IAAI;EACxB5C,KAAK,EAAEzB,SAAS,CAACsE,KAAK,CAAC,CAAC,SAAS,EAAE,cAAc,EAAE,MAAM,CAAC,CAAC;EAC3D5C,UAAU,EAAE1B,SAAS,CAACmE;AACxB,CAAC;AAED,eAAerD,MAAM","ignoreList":[]}
|
|
@@ -8,11 +8,13 @@
|
|
|
8
8
|
@value white from colors;
|
|
9
9
|
@value dark from colors;
|
|
10
10
|
@value black from colors;
|
|
11
|
+
@value cm_grey_75 from colors;
|
|
11
12
|
@value cm_grey_100 from colors;
|
|
12
13
|
@value cm_grey_150 from colors;
|
|
13
14
|
@value cm_grey_400 from colors;
|
|
14
15
|
@value cm_grey_500 from colors;
|
|
15
16
|
@value cm_grey_700 from colors;
|
|
17
|
+
@value brand from colors;
|
|
16
18
|
|
|
17
19
|
.wrapperSearch {
|
|
18
20
|
display: flex;
|
|
@@ -66,6 +68,7 @@
|
|
|
66
68
|
color: medium;
|
|
67
69
|
}
|
|
68
70
|
|
|
71
|
+
/* Theme: coorpmanager */
|
|
69
72
|
.coorpmanager {
|
|
70
73
|
position: relative;
|
|
71
74
|
}
|
|
@@ -177,6 +180,65 @@
|
|
|
177
180
|
line-height: 16px;
|
|
178
181
|
}
|
|
179
182
|
|
|
183
|
+
/* Theme: mooc */
|
|
184
|
+
.wrapperMooc {
|
|
185
|
+
display: flex;
|
|
186
|
+
flex-flow: nowrap;
|
|
187
|
+
flex-direction: row;
|
|
188
|
+
align-items: center;
|
|
189
|
+
overflow: hidden;
|
|
190
|
+
border-radius: 12px;
|
|
191
|
+
transition: box-shadow 0.3s ease-in-out;
|
|
192
|
+
background: cm_grey_100;
|
|
193
|
+
padding: 2px;
|
|
194
|
+
width: 100%;
|
|
195
|
+
flex: 1;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
.wrapperMoocParent {
|
|
199
|
+
width: 100%;
|
|
200
|
+
flex: 1;
|
|
201
|
+
border-radius: 12px;
|
|
202
|
+
transition: box-shadow 0.3s ease-in-out;
|
|
203
|
+
background: transparent;
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.moocSearch {
|
|
207
|
+
background-color: cm_grey_100;
|
|
208
|
+
border-radius: 12px;
|
|
209
|
+
height: 44px;
|
|
210
|
+
margin: 0;
|
|
211
|
+
font-family: Gilroy;
|
|
212
|
+
font-size: 14px;
|
|
213
|
+
font-weight: 500;
|
|
214
|
+
color: cm_grey_700;
|
|
215
|
+
padding: 0 0 0 45px;
|
|
216
|
+
padding-right: 48px;
|
|
217
|
+
outline: none;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.moocSearch:focus-within {
|
|
221
|
+
background-color: cm_grey_75;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
.wrapperMoocParent:focus-within .wrapperMooc {
|
|
225
|
+
background: transparent;
|
|
226
|
+
box-shadow: 0 0 0 2px rgba(255,255,255,0), 0 0 0 2px brand;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
.wrapperMooc:hover {
|
|
230
|
+
box-shadow: 0 0 0 2px brand;
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
.wrapperMooc .clearIcon {
|
|
234
|
+
position: relative;
|
|
235
|
+
right: 26px;
|
|
236
|
+
color: cm_grey_400;
|
|
237
|
+
width: 14px;
|
|
238
|
+
height: 14px;
|
|
239
|
+
cursor: pointer;
|
|
240
|
+
}
|
|
241
|
+
|
|
180
242
|
input:-webkit-autofill,
|
|
181
243
|
input:-webkit-autofill:hover,
|
|
182
244
|
input:-webkit-autofill:focus,
|
|
@@ -184,6 +246,21 @@ input:-webkit-autofill:active{
|
|
|
184
246
|
-webkit-background-clip: text;
|
|
185
247
|
}
|
|
186
248
|
|
|
249
|
+
/* Correction spécifique pour le thème mooc */
|
|
250
|
+
.moocSearch:-webkit-autofill,
|
|
251
|
+
.moocSearch:-webkit-autofill:hover,
|
|
252
|
+
.moocSearch:-webkit-autofill:focus,
|
|
253
|
+
.moocSearch:-webkit-autofill:active {
|
|
254
|
+
-webkit-box-shadow: 0 0 0 1000px cm_grey_100 inset !important;
|
|
255
|
+
-webkit-text-fill-color: cm_grey_700 !important;
|
|
256
|
+
background-color: cm_grey_100 !important;
|
|
257
|
+
}
|
|
258
|
+
|
|
259
|
+
.wrapperMoocParent:focus-within .moocSearch:-webkit-autofill {
|
|
260
|
+
-webkit-box-shadow: 0 0 0 1000px cm_grey_75 inset !important;
|
|
261
|
+
background-color: cm_grey_75 !important;
|
|
262
|
+
}
|
|
263
|
+
|
|
187
264
|
@media tablet {
|
|
188
265
|
.search,
|
|
189
266
|
input {
|
|
@@ -194,6 +271,16 @@ input:-webkit-autofill:active{
|
|
|
194
271
|
font-size: 12px;
|
|
195
272
|
color: medium;
|
|
196
273
|
}
|
|
274
|
+
|
|
275
|
+
.wrapperMoocParent {
|
|
276
|
+
max-width: 100%;
|
|
277
|
+
box-sizing: border-box;
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
.wrapperMooc {
|
|
281
|
+
max-width: 100%;
|
|
282
|
+
box-sizing: border-box;
|
|
283
|
+
}
|
|
197
284
|
}
|
|
198
285
|
|
|
199
286
|
@media mobile {
|
|
@@ -204,4 +291,14 @@ input:-webkit-autofill:active{
|
|
|
204
291
|
.search::placeholder {
|
|
205
292
|
font-size: 12px;
|
|
206
293
|
}
|
|
294
|
+
|
|
295
|
+
.wrapperMoocParent {
|
|
296
|
+
max-width: 100%;
|
|
297
|
+
box-sizing: border-box;
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
.wrapperMooc {
|
|
301
|
+
max-width: 100%;
|
|
302
|
+
box-sizing: border-box;
|
|
303
|
+
}
|
|
207
304
|
}
|
|
@@ -648,6 +648,8 @@ declare const propTypes: {
|
|
|
648
648
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
649
649
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
650
650
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
651
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
652
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
651
653
|
theme: PropTypes.Requireable<string>;
|
|
652
654
|
dataTestId: PropTypes.Requireable<string>;
|
|
653
655
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAElD,OAAO,EAAC,SAAS,IAAI,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE3D,QAAA,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -39,6 +39,8 @@ declare const MultiFilterPanel: {
|
|
|
39
39
|
onClear: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
40
40
|
onFocus: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
41
41
|
onBlur: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
42
|
+
onKeyDown: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
43
|
+
inputRef: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
42
44
|
theme: import("prop-types").Requireable<string>;
|
|
43
45
|
dataTestId: import("prop-types").Requireable<string>;
|
|
44
46
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/multi-filter-panel/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAEjE,OAAkB,EAAC,qBAAqB,EAAqB,MAAM,cAAc,CAAC;AAqBlF,QAAA,MAAM,gBAAgB;YAAW,qBAAqB,WAAW,gBAAgB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/multi-filter-panel/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAEjE,OAAkB,EAAC,qBAAqB,EAAqB,MAAM,cAAc,CAAC;AAqBlF,QAAA,MAAM,gBAAgB;YAAW,qBAAqB,WAAW,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgDhF,CAAC;AAQF,eAAe,gBAAgB,CAAC"}
|
|
@@ -37,6 +37,8 @@ declare const propTypes: {
|
|
|
37
37
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
38
38
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
39
39
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
40
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
41
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
40
42
|
theme: PropTypes.Requireable<string>;
|
|
41
43
|
dataTestId: PropTypes.Requireable<string>;
|
|
42
44
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/multi-filter-panel/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAA4B,EAAC,eAAe,EAAC,MAAM,uCAAuC,CAAC;AAC3F,OAAyC,EACvC,4BAA4B,EAC7B,MAAM,uDAAuD,CAAC;AAE/D,QAAA,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/multi-filter-panel/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAA4B,EAAC,eAAe,EAAC,MAAM,uCAAuC,CAAC;AAC3F,OAAyC,EACvC,4BAA4B,EAC7B,MAAM,uDAAuD,CAAC;AAE/D,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAed,CAAC;AAEF,oBAAY,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,eAAe,CAAC;CAC1B,CAAC;AAEF,oBAAY,oBAAoB,GAAG;IACjC,IAAI,EAAE,UAAU,CAAC;IACjB,OAAO,EAAE,4BAA4B,CAAC;CACvC,CAAC;AAEF,oBAAY,kBAAkB,GAAG,gBAAgB,GAAG,oBAAoB,CAAC;AAEzE,oBAAY,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE,kBAAkB,EAAE,CAAC;CAC/B,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -8,6 +8,8 @@ declare namespace SearchForm {
|
|
|
8
8
|
onReset: PropTypes.Requireable<(...args: any[]) => any>;
|
|
9
9
|
onSearchFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
10
10
|
onSearchBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
11
|
+
onSearchKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
12
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
11
13
|
search: PropTypes.Requireable<PropTypes.InferProps<{
|
|
12
14
|
value: PropTypes.Requireable<string>;
|
|
13
15
|
placeholder: PropTypes.Validator<string>;
|
|
@@ -15,11 +17,14 @@ declare namespace SearchForm {
|
|
|
15
17
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
16
18
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
17
19
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
20
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
21
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
18
22
|
theme: PropTypes.Requireable<string>;
|
|
19
23
|
dataTestId: PropTypes.Requireable<string>;
|
|
20
24
|
}>>;
|
|
21
25
|
'search-reset-aria-label': PropTypes.Requireable<string>;
|
|
22
26
|
dataTestId: PropTypes.Requireable<string>;
|
|
27
|
+
theme: PropTypes.Requireable<string>;
|
|
23
28
|
};
|
|
24
29
|
}
|
|
25
30
|
import PropTypes from "prop-types";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/search-form/index.js"],"names":[],"mappings":";AAOA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/search-form/index.js"],"names":[],"mappings":";AAOA,mEAkEC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import _get from "lodash/fp/get";
|
|
2
1
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
3
2
|
import React, { useMemo } from 'react';
|
|
4
3
|
import PropTypes from 'prop-types';
|
|
5
|
-
import {
|
|
4
|
+
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
5
|
+
import classnames from 'classnames';
|
|
6
6
|
import Search from '../../atom/input-search';
|
|
7
7
|
import style from './style.css';
|
|
8
8
|
const SearchForm = (props, context) => {
|
|
@@ -14,17 +14,23 @@ const SearchForm = (props, context) => {
|
|
|
14
14
|
search,
|
|
15
15
|
onSearchFocus,
|
|
16
16
|
onSearchBlur,
|
|
17
|
+
onSearchKeyDown,
|
|
18
|
+
inputRef,
|
|
17
19
|
'search-reset-aria-label': searchResetAriaLabel,
|
|
18
|
-
dataTestId
|
|
20
|
+
dataTestId,
|
|
21
|
+
theme
|
|
19
22
|
} = props;
|
|
20
23
|
const handleSubmit = useMemo(() => evt => {
|
|
21
24
|
evt.preventDefault();
|
|
22
25
|
return onSubmit && onSubmit(evt);
|
|
23
26
|
}, [onSubmit]);
|
|
24
|
-
const {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
27
|
+
const handleReset = useMemo(() => evt => {
|
|
28
|
+
evt.preventDefault();
|
|
29
|
+
evt.stopPropagation();
|
|
30
|
+
return onReset && onReset(evt);
|
|
31
|
+
}, [onReset]);
|
|
32
|
+
const isMooc = theme === 'mooc';
|
|
33
|
+
const clearClassName = search.value ? classnames(style.wrapperClear, isMooc && style.wrapperClearMooc) : style.wrapperNoClear;
|
|
28
34
|
return /*#__PURE__*/React.createElement("form", {
|
|
29
35
|
className: style.form,
|
|
30
36
|
action: action,
|
|
@@ -35,17 +41,18 @@ const SearchForm = (props, context) => {
|
|
|
35
41
|
}, /*#__PURE__*/React.createElement(Search, _extends({}, search, {
|
|
36
42
|
onFocus: onSearchFocus,
|
|
37
43
|
onBlur: onSearchBlur,
|
|
38
|
-
|
|
44
|
+
onKeyDown: onSearchKeyDown,
|
|
45
|
+
inputRef: inputRef,
|
|
46
|
+
dataTestId: dataTestId,
|
|
47
|
+
theme: theme
|
|
39
48
|
})), /*#__PURE__*/React.createElement("div", {
|
|
40
49
|
"data-name": "search-form-reset",
|
|
41
50
|
"aria-label": searchResetAriaLabel,
|
|
42
|
-
|
|
43
|
-
className:
|
|
44
|
-
}, /*#__PURE__*/React.createElement(
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
},
|
|
48
|
-
className: style.clear
|
|
51
|
+
onMouseDown: handleReset,
|
|
52
|
+
className: clearClassName
|
|
53
|
+
}, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
|
|
54
|
+
icon: "xmark",
|
|
55
|
+
className: style.clearIcon
|
|
49
56
|
})));
|
|
50
57
|
};
|
|
51
58
|
SearchForm.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
@@ -55,9 +62,12 @@ SearchForm.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
55
62
|
onReset: PropTypes.func,
|
|
56
63
|
onSearchFocus: PropTypes.func,
|
|
57
64
|
onSearchBlur: PropTypes.func,
|
|
65
|
+
onSearchKeyDown: PropTypes.func,
|
|
66
|
+
inputRef: PropTypes.func,
|
|
58
67
|
search: PropTypes.shape(Search.propTypes),
|
|
59
68
|
'search-reset-aria-label': PropTypes.string,
|
|
60
|
-
dataTestId: PropTypes.string
|
|
69
|
+
dataTestId: PropTypes.string,
|
|
70
|
+
theme: PropTypes.string
|
|
61
71
|
} : {};
|
|
62
72
|
export default SearchForm;
|
|
63
73
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","FontAwesomeIcon","classnames","Search","style","SearchForm","props","context","action","method","onSubmit","onReset","search","onSearchFocus","onSearchBlur","onSearchKeyDown","inputRef","searchResetAriaLabel","dataTestId","theme","handleSubmit","evt","preventDefault","handleReset","stopPropagation","isMooc","clearClassName","value","wrapperClear","wrapperClearMooc","wrapperNoClear","createElement","className","form","placeholder","_extends","onFocus","onBlur","onKeyDown","onMouseDown","icon","clearIcon","propTypes","process","env","NODE_ENV","string","func","shape"],"sources":["../../../src/molecule/search-form/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport classnames from 'classnames';\nimport Search from '../../atom/input-search';\nimport style from './style.css';\n\nconst SearchForm = (props, context) => {\n const {\n action,\n method,\n onSubmit,\n onReset,\n search,\n onSearchFocus,\n onSearchBlur,\n onSearchKeyDown,\n inputRef,\n 'search-reset-aria-label': searchResetAriaLabel,\n dataTestId,\n theme\n } = props;\n const handleSubmit = useMemo(\n () => evt => {\n evt.preventDefault();\n return onSubmit && onSubmit(evt);\n },\n [onSubmit]\n );\n\n const handleReset = useMemo(\n () => evt => {\n evt.preventDefault();\n evt.stopPropagation();\n return onReset && onReset(evt);\n },\n [onReset]\n );\n\n const isMooc = theme === 'mooc';\n\n const clearClassName = search.value\n ? classnames(style.wrapperClear, isMooc && style.wrapperClearMooc)\n : style.wrapperNoClear;\n\n return (\n <form\n className={style.form}\n action={action}\n method={method}\n onSubmit={handleSubmit}\n data-name=\"searchForm\"\n aria-label={search.placeholder}\n >\n <Search\n {...search}\n onFocus={onSearchFocus}\n onBlur={onSearchBlur}\n onKeyDown={onSearchKeyDown}\n inputRef={inputRef}\n dataTestId={dataTestId}\n theme={theme}\n />\n <div\n data-name=\"search-form-reset\"\n aria-label={searchResetAriaLabel}\n onMouseDown={handleReset}\n className={clearClassName}\n >\n <FontAwesomeIcon icon=\"xmark\" className={style.clearIcon} />\n </div>\n </form>\n );\n};\n\nSearchForm.propTypes = {\n action: PropTypes.string,\n method: PropTypes.string,\n onSubmit: PropTypes.func,\n onReset: PropTypes.func,\n onSearchFocus: PropTypes.func,\n onSearchBlur: PropTypes.func,\n onSearchKeyDown: PropTypes.func,\n inputRef: PropTypes.func,\n search: PropTypes.shape(Search.propTypes),\n 'search-reset-aria-label': PropTypes.string,\n dataTestId: PropTypes.string,\n theme: PropTypes.string\n};\n\nexport default SearchForm;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAGC,OAAO,QAAO,OAAO;AACpC,OAAOC,SAAS,MAAM,YAAY;AAClC,SAAQC,eAAe,QAAO,gCAAgC;AAC9D,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,MAAM,MAAM,yBAAyB;AAC5C,OAAOC,KAAK,MAAM,aAAa;AAE/B,MAAMC,UAAU,GAAGA,CAACC,KAAK,EAAEC,OAAO,KAAK;EACrC,MAAM;IACJC,MAAM;IACNC,MAAM;IACNC,QAAQ;IACRC,OAAO;IACPC,MAAM;IACNC,aAAa;IACbC,YAAY;IACZC,eAAe;IACfC,QAAQ;IACR,yBAAyB,EAAEC,oBAAoB;IAC/CC,UAAU;IACVC;EACF,CAAC,GAAGb,KAAK;EACT,MAAMc,YAAY,GAAGrB,OAAO,CAC1B,MAAMsB,GAAG,IAAI;IACXA,GAAG,CAACC,cAAc,CAAC,CAAC;IACpB,OAAOZ,QAAQ,IAAIA,QAAQ,CAACW,GAAG,CAAC;EAClC,CAAC,EACD,CAACX,QAAQ,CACX,CAAC;EAED,MAAMa,WAAW,GAAGxB,OAAO,CACzB,MAAMsB,GAAG,IAAI;IACXA,GAAG,CAACC,cAAc,CAAC,CAAC;IACpBD,GAAG,CAACG,eAAe,CAAC,CAAC;IACrB,OAAOb,OAAO,IAAIA,OAAO,CAACU,GAAG,CAAC;EAChC,CAAC,EACD,CAACV,OAAO,CACV,CAAC;EAED,MAAMc,MAAM,GAAGN,KAAK,KAAK,MAAM;EAE/B,MAAMO,cAAc,GAAGd,MAAM,CAACe,KAAK,GAC/BzB,UAAU,CAACE,KAAK,CAACwB,YAAY,EAAEH,MAAM,IAAIrB,KAAK,CAACyB,gBAAgB,CAAC,GAChEzB,KAAK,CAAC0B,cAAc;EAExB,oBACEhC,KAAA,CAAAiC,aAAA;IACEC,SAAS,EAAE5B,KAAK,CAAC6B,IAAK;IACtBzB,MAAM,EAAEA,MAAO;IACfC,MAAM,EAAEA,MAAO;IACfC,QAAQ,EAAEU,YAAa;IACvB,aAAU,YAAY;IACtB,cAAYR,MAAM,CAACsB;EAAY,gBAE/BpC,KAAA,CAAAiC,aAAA,CAAC5B,MAAM,EAAAgC,QAAA,KACDvB,MAAM;IACVwB,OAAO,EAAEvB,aAAc;IACvBwB,MAAM,EAAEvB,YAAa;IACrBwB,SAAS,EAAEvB,eAAgB;IAC3BC,QAAQ,EAAEA,QAAS;IACnBE,UAAU,EAAEA,UAAW;IACvBC,KAAK,EAAEA;EAAM,EACd,CAAC,eACFrB,KAAA,CAAAiC,aAAA;IACE,aAAU,mBAAmB;IAC7B,cAAYd,oBAAqB;IACjCsB,WAAW,EAAEhB,WAAY;IACzBS,SAAS,EAAEN;EAAe,gBAE1B5B,KAAA,CAAAiC,aAAA,CAAC9B,eAAe;IAACuC,IAAI,EAAC,OAAO;IAACR,SAAS,EAAE5B,KAAK,CAACqC;EAAU,CAAE,CACxD,CACD,CAAC;AAEX,CAAC;AAEDpC,UAAU,CAACqC,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EACrBrC,MAAM,EAAER,SAAS,CAAC8C,MAAM;EACxBrC,MAAM,EAAET,SAAS,CAAC8C,MAAM;EACxBpC,QAAQ,EAAEV,SAAS,CAAC+C,IAAI;EACxBpC,OAAO,EAAEX,SAAS,CAAC+C,IAAI;EACvBlC,aAAa,EAAEb,SAAS,CAAC+C,IAAI;EAC7BjC,YAAY,EAAEd,SAAS,CAAC+C,IAAI;EAC5BhC,eAAe,EAAEf,SAAS,CAAC+C,IAAI;EAC/B/B,QAAQ,EAAEhB,SAAS,CAAC+C,IAAI;EACxBnC,MAAM,EAAEZ,SAAS,CAACgD,KAAK,CAAC7C,MAAM,CAACuC,SAAS,CAAC;EACzC,yBAAyB,EAAE1C,SAAS,CAAC8C,MAAM;EAC3C5B,UAAU,EAAElB,SAAS,CAAC8C,MAAM;EAC5B3B,KAAK,EAAEnB,SAAS,CAAC8C;AACnB,CAAC;AAED,eAAezC,UAAU","ignoreList":[]}
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value cm_grey_500 from colors;
|
|
3
|
+
|
|
1
4
|
.form {
|
|
2
5
|
display: flex;
|
|
3
6
|
justify-content: flex-start;
|
|
@@ -8,6 +11,7 @@
|
|
|
8
11
|
margin: 0;
|
|
9
12
|
width: 100%;
|
|
10
13
|
height: 100%;
|
|
14
|
+
position: relative;
|
|
11
15
|
}
|
|
12
16
|
|
|
13
17
|
.wrapperClear {
|
|
@@ -23,11 +27,22 @@
|
|
|
23
27
|
display: none;
|
|
24
28
|
}
|
|
25
29
|
|
|
26
|
-
.
|
|
27
|
-
|
|
28
|
-
width:
|
|
29
|
-
height:
|
|
30
|
+
.clearIcon {
|
|
31
|
+
color: cm_grey_500;
|
|
32
|
+
width: 12px;
|
|
33
|
+
height: 14px;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.wrapperClearMooc {
|
|
30
37
|
position: absolute;
|
|
31
|
-
|
|
32
|
-
|
|
38
|
+
right: 16px;
|
|
39
|
+
width: 14px;
|
|
40
|
+
height: 14px;
|
|
41
|
+
top: 50%;
|
|
42
|
+
transform: translateY(-50%);
|
|
43
|
+
cursor: pointer;
|
|
44
|
+
display: flex;
|
|
45
|
+
align-items: center;
|
|
46
|
+
justify-content: center;
|
|
47
|
+
z-index: 2002;
|
|
33
48
|
}
|
|
@@ -9,6 +9,8 @@ declare namespace BrandTable {
|
|
|
9
9
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
10
10
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
11
11
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
12
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
13
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
12
14
|
theme: PropTypes.Requireable<string>;
|
|
13
15
|
dataTestId: PropTypes.Requireable<string>;
|
|
14
16
|
}>>;
|
|
@@ -493,6 +493,8 @@ declare const ContentSkillModal: {
|
|
|
493
493
|
onClear: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
494
494
|
onFocus: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
495
495
|
onBlur: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
496
|
+
onKeyDown: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
497
|
+
inputRef: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
496
498
|
theme: import("prop-types").Requireable<string>;
|
|
497
499
|
dataTestId: import("prop-types").Requireable<string>;
|
|
498
500
|
}>>;
|
|
@@ -670,6 +672,8 @@ declare const ContentSkillModal: {
|
|
|
670
672
|
onClear: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
671
673
|
onFocus: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
672
674
|
onBlur: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
675
|
+
onKeyDown: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
676
|
+
inputRef: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
673
677
|
theme: import("prop-types").Requireable<string>;
|
|
674
678
|
dataTestId: import("prop-types").Requireable<string>;
|
|
675
679
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/content-skill-modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAOlD,OAAkB,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAE1D,QAAA,MAAM,iBAAiB;YAAW,sBAAsB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/content-skill-modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAOlD,OAAkB,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAE1D,QAAA,MAAM,iBAAiB;YAAW,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DvD,CAAC;AAQF,eAAe,iBAAiB,CAAC"}
|
|
@@ -490,6 +490,8 @@ declare const ContentSkillModalPropTypes: {
|
|
|
490
490
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
491
491
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
492
492
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
493
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
494
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
493
495
|
theme: PropTypes.Requireable<string>;
|
|
494
496
|
dataTestId: PropTypes.Requireable<string>;
|
|
495
497
|
}>>;
|
|
@@ -667,6 +669,8 @@ declare const ContentSkillModalPropTypes: {
|
|
|
667
669
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
668
670
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
669
671
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
672
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
673
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
670
674
|
theme: PropTypes.Requireable<string>;
|
|
671
675
|
dataTestId: PropTypes.Requireable<string>;
|
|
672
676
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/organism/content-skill-modal/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,SAAS,MAAM,eAAe,CAAC;AACtC,OAAkC,EAChC,qBAAqB,EACtB,MAAM,8CAA8C,CAAC;AAStD,QAAA,MAAM,0BAA0B
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/organism/content-skill-modal/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,SAAS,MAAM,eAAe,CAAC;AACtC,OAAkC,EAChC,qBAAqB,EACtB,MAAM,8CAA8C,CAAC;AAStD,QAAA,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAI/B,CAAC;AAEF,eAAe,0BAA0B,CAAC;AAE1C,aAAK,UAAU,GAAG;IAChB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,oBAAY,sBAAsB,GAAG;IACnC,WAAW,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,CAAC;IACpD,OAAO,EAAE,qBAAqB,CAAC;IAC/B,KAAK,EAAE,UAAU,CAAC;CACnB,CAAC"}
|
|
@@ -21,6 +21,8 @@ declare const FilterCheckboxAndSearch: {
|
|
|
21
21
|
onClear: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
22
22
|
onFocus: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
23
23
|
onBlur: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
24
|
+
onKeyDown: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
25
|
+
inputRef: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
24
26
|
theme: import("prop-types").Requireable<string>;
|
|
25
27
|
dataTestId: import("prop-types").Requireable<string>;
|
|
26
28
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-checkbox-and-search/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAKjE,OAAkB,EAAC,4BAA4B,EAAC,MAAM,eAAe,CAAC;AAiBtE,QAAA,MAAM,uBAAuB;YACpB,4BAA4B,WAC1B,gBAAgB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-checkbox-and-search/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAKjE,OAAkB,EAAC,4BAA4B,EAAC,MAAM,eAAe,CAAC;AAiBtE,QAAA,MAAM,uBAAuB;YACpB,4BAA4B,WAC1B,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiG1B,CAAC;AAQF,eAAe,uBAAuB,CAAC"}
|
|
@@ -17,6 +17,8 @@ declare const propTypes: {
|
|
|
17
17
|
onClear: PropTypes.Requireable<(...args: any[]) => any>;
|
|
18
18
|
onFocus: PropTypes.Requireable<(...args: any[]) => any>;
|
|
19
19
|
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
20
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
21
|
+
inputRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
20
22
|
theme: PropTypes.Requireable<string>;
|
|
21
23
|
dataTestId: PropTypes.Requireable<string>;
|
|
22
24
|
}>>;
|