@coorpacademy/components 11.40.14 → 11.40.16

package/lib/molecule/tabs/index.js

@@ -0,0 +1,74 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _cssColorFunction = require("css-color-function");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _getOr = _interopRequireDefault(require("lodash/fp/getOr"));
+var _provider = _interopRequireDefault(require("../../atom/provider"));
+var _colors = require("../../variables/colors");
+var _tag = _interopRequireDefault(require("../../atom/tag"));
+var _style = _interopRequireDefault(require("./style.css"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const handleTabClick = tab => e => {
+  if (tab && typeof tab.onClick === 'function') tab.onClick(e);
+};
+const handleTabKeyDown = tab => e => {
+  if (e.key === 'Enter') handleTabClick(tab)(e);
+};
+const Tabs = (props, context) => {
+  const {
+    items = []
+  } = props;
+  const {
+    skin
+  } = context;
+  const primaryColor = (0, _getOr.default)('#00B0FF', 'common.primary', skin);
+  const createTab = (index, tab) => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: index,
+      className: _style.default.tab,
+      role: "tab",
+      tabIndex: 0,
+      "aria-selected": tab.isActive,
+      "aria-label": tab['aria-label'] || tab.title,
+      onClick: handleTabClick(tab),
+      onKeyDown: handleTabKeyDown(tab),
+      style: {
+        '--hover-bg': (0, _cssColorFunction.convert)(`color(${tab.isActive ? primaryColor : _colors.COLORS.cm_grey_500} a(0.15))`),
+        '--bg': tab.isActive ? (0, _cssColorFunction.convert)(`color(${primaryColor} a(0.07))`) : 'transparent',
+        color: tab.isActive ? primaryColor : _colors.COLORS.cm_grey_500
+      }
+    }, /*#__PURE__*/_react.default.createElement("span", null, tab.title), typeof tab.count === 'number' ? /*#__PURE__*/_react.default.createElement(_tag.default, {
+      label: tab.count.toString(),
+      type: "default",
+      size: "S",
+      customStyle: {
+        backgroundColor: tab.isActive ? (0, _cssColorFunction.convert)(`color(${primaryColor} a(0.25))`) : _colors.COLORS.cm_grey_200,
+        color: tab.isActive ? primaryColor : _colors.COLORS.cm_grey_500
+      }
+    }) : null);
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.tabs,
+    role: "tablist"
+  }, items && items.map((tab, index) => {
+    return createTab(index, tab);
+  }));
+};
+Tabs.contextTypes = {
+  skin: _provider.default.childContextTypes.skin,
+  translate: _provider.default.childContextTypes.translate
+};
+Tabs.propTypes = process.env.NODE_ENV !== "production" ? {
+  items: _propTypes.default.arrayOf(_propTypes.default.shape({
+    title: _propTypes.default.string,
+    count: _propTypes.default.number,
+    'aria-label': _propTypes.default.string,
+    onClick: _propTypes.default.func,
+    isActive: _propTypes.default.bool
+  }))
+} : {};
+var _default = exports.default = Tabs;
+//# sourceMappingURL=index.js.map

package/lib/molecule/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_cssColorFunction","_propTypes","_getOr","_provider","_colors","_tag","_style","e","__esModule","default","handleTabClick","tab","onClick","handleTabKeyDown","key","Tabs","props","context","items","skin","primaryColor","getOr","createTab","index","createElement","className","style","role","tabIndex","isActive","title","onKeyDown","convert","COLORS","cm_grey_500","color","count","label","toString","type","size","customStyle","backgroundColor","cm_grey_200","tabs","map","contextTypes","Provider","childContextTypes","translate","propTypes","process","env","NODE_ENV","PropTypes","arrayOf","shape","string","number","func","bool","_default","exports"],"sources":["../../../src/molecule/tabs/index.js"],"sourcesContent":["import React from 'react';\nimport {convert} from 'css-color-function';\nimport PropTypes from 'prop-types';\nimport getOr from 'lodash/fp/getOr';\nimport Provider from '../../atom/provider';\nimport {COLORS} from '../../variables/colors';\nimport Tag from '../../atom/tag';\nimport style from './style.css';\n\nconst handleTabClick = tab => e => {\n  if (tab && typeof tab.onClick === 'function') tab.onClick(e);\n};\nconst handleTabKeyDown = tab => e => {\n  if (e.key === 'Enter') handleTabClick(tab)(e);\n};\nconst Tabs = (props, context) => {\n  const {items = []} = props;\n  const {skin} = context;\n  const primaryColor = getOr('#00B0FF', 'common.primary', skin);\n\n  const createTab = (index, tab) => {\n    return (\n      <div\n        key={index}\n        className={style.tab}\n        role=\"tab\"\n        tabIndex={0}\n        aria-selected={tab.isActive}\n        aria-label={tab['aria-label'] || tab.title}\n        onClick={handleTabClick(tab)}\n        onKeyDown={handleTabKeyDown(tab)}\n        style={{\n          '--hover-bg': convert(\n            `color(${tab.isActive ? primaryColor : COLORS.cm_grey_500} a(0.15))`\n          ),\n          '--bg': tab.isActive ? convert(`color(${primaryColor} a(0.07))`) : 'transparent',\n          color: tab.isActive ? primaryColor : COLORS.cm_grey_500\n        }}\n      >\n        <span>{tab.title}</span>\n        {typeof tab.count === 'number' ? (\n          <Tag\n            label={tab.count.toString()}\n            type=\"default\"\n            size=\"S\"\n            customStyle={{\n              backgroundColor: tab.isActive\n                ? convert(`color(${primaryColor} a(0.25))`)\n                : COLORS.cm_grey_200,\n              color: tab.isActive ? primaryColor : COLORS.cm_grey_500\n            }}\n          />\n        ) : null}\n      </div>\n    );\n  };\n\n  return (\n    <div className={style.tabs} role=\"tablist\">\n      {items &&\n        items.map((tab, index) => {\n          return createTab(index, tab);\n        })}\n    </div>\n  );\n};\n\nTabs.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nTabs.propTypes = {\n  items: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: PropTypes.string,\n      count: PropTypes.number,\n      'aria-label': PropTypes.string,\n      onClick: PropTypes.func,\n      isActive: PropTypes.bool\n    })\n  )\n};\n\nexport default Tabs;\n"],"mappings":"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","ignoreList":[]}

package/lib/molecule/tabs/style.css

@@ -0,0 +1,28 @@
+
+.tabs{
+  display: flex;
+  flex-direction: row;
+  flex-grow: 2;  
+} 
+
+.tab{
+  font-family: 'Gilroy';
+  font-weight: 600;
+  font-size: 16px;
+  line-height: 20px;
+  letter-spacing: 0px;
+  cursor: pointer;
+  padding: 8px 16px;
+  border-radius: 5px;
+  min-width: 160px;
+  display: flex;
+  flex-direction: row;
+  gap: 8px;
+  margin: 0px 8px 0px 0px;
+  background-color: var(--bg);
+  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
+}
+
+.tab:hover {
+  background-color: var(--hover-bg);
+}

package/lib/molecule/title-and-checkbox-wrapper/index.d.ts

@@ -3,6 +3,7 @@ declare function TitleAndCheckBoxWrapper(props: any): JSX.Element;
 declare namespace TitleAndCheckBoxWrapper {
     namespace propTypes {
         const checkboxWithTitle: PropTypes.Requireable<PropTypes.InferProps<{
+            value: PropTypes.Requireable<string>;
             title: PropTypes.Requireable<string>;
             name: PropTypes.Requireable<string>;
             checked: PropTypes.Requireable<boolean>;

package/lib/organism/brand-analytics/style.css

@@ -27,7 +27,7 @@
   color: dark;
   border: 1px solid light;
   padding: 10px;
-  background-color: lightMediumGray;
+  background-color: lightMediumGrey;
   flex-grow: 0;
 }
 

package/lib/organism/brand-learning-priorities/index.d.ts

@@ -132,6 +132,7 @@ declare namespace BrandLearningPriorities {
                 }>>;
                 image: PropTypes.Requireable<string>;
                 checkbox: PropTypes.Requireable<PropTypes.InferProps<{
+                    value: PropTypes.Requireable<string>;
                     title: PropTypes.Requireable<string>;
                     name: PropTypes.Requireable<string>;
                     checked: PropTypes.Requireable<boolean>;

package/lib/organism/content-skill-modal/index.d.ts

@@ -145,6 +145,7 @@ declare const ContentSkillModal: {
                     }>>;
                     image: import("prop-types").Requireable<string>;
                     checkbox: import("prop-types").Requireable<import("prop-types").InferProps<{
+                        value: import("prop-types").Requireable<string>;
                         title: import("prop-types").Requireable<string>;
                         name: import("prop-types").Requireable<string>;
                         checked: import("prop-types").Requireable<boolean>;
@@ -533,6 +534,7 @@ declare const ContentSkillModal: {
                 searchIconAriaLabel: import("prop-types").Requireable<string>;
             }>>;
             checkboxWithTitle: import("prop-types").Requireable<import("prop-types").InferProps<{
+                value: import("prop-types").Requireable<string>;
                 title: import("prop-types").Requireable<string>;
                 name: import("prop-types").Requireable<string>;
                 checked: import("prop-types").Requireable<boolean>;
@@ -719,6 +721,7 @@ declare const ContentSkillModal: {
                         count: import("prop-types").Requireable<number>;
                         onClick: import("prop-types").Requireable<(...args: any[]) => any>;
                     }> | null | undefined)[]>;
+                    emptySearchResult: import("prop-types").Requireable<string>;
                     searchOptions: import("prop-types").Requireable<import("prop-types").InferProps<{
                         value: import("prop-types").Requireable<string>;
                         placeholder: import("prop-types").Validator<string>;
@@ -745,8 +748,28 @@ declare const ContentSkillModal: {
                         onChange: import("prop-types").Validator<(...args: any[]) => any>;
                         theme: import("prop-types").Validator<string>;
                         ariaLabel: import("prop-types").Validator<string>;
+                        id: import("prop-types").Requireable<string>;
                     }> | null | undefined)[]>;
                 }>>;
+            }> | import("prop-types").InferProps<{
+                type: import("prop-types").Requireable<string>;
+                options: import("prop-types").Requireable<import("prop-types").InferProps<{
+                    title: import("prop-types").Validator<string>;
+                    titleAriaLabel: import("prop-types").Requireable<string>;
+                    onClear: import("prop-types").Validator<(...args: any[]) => any>;
+                    options: import("prop-types").Requireable<import("prop-types").InferProps<{
+                        label: import("prop-types").Validator<string>;
+                        min: import("prop-types").Validator<number>;
+                        max: import("prop-types").Validator<number>;
+                        step: import("prop-types").Requireable<number>;
+                        value: import("prop-types").Requireable<(number | null | undefined)[]>;
+                        minLabel: import("prop-types").Requireable<string>;
+                        maxLabel: import("prop-types").Requireable<string>;
+                        onChange: import("prop-types").Validator<(...args: any[]) => any>;
+                        theme: import("prop-types").Requireable<string>;
+                        selected: import("prop-types").Requireable<boolean>;
+                    }>>;
+                }>>;
             }> | null | undefined> | null | undefined)[]>;
         }>>>;
         modal: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<{

package/lib/organism/content-skill-modal/index.d.ts.map

@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6DvD,CAAC;AAQF,eAAe,iBAAiB,CAAC"}
+{"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6DvD,CAAC;AAQF,eAAe,iBAAiB,CAAC"}

package/lib/organism/content-skill-modal/types.d.ts

@@ -142,6 +142,7 @@ declare const ContentSkillModalPropTypes: {
                 }>>;
                 image: PropTypes.Requireable<string>;
                 checkbox: PropTypes.Requireable<PropTypes.InferProps<{
+                    value: PropTypes.Requireable<string>;
                     title: PropTypes.Requireable<string>;
                     name: PropTypes.Requireable<string>;
                     checked: PropTypes.Requireable<boolean>;
@@ -530,6 +531,7 @@ declare const ContentSkillModalPropTypes: {
             searchIconAriaLabel: PropTypes.Requireable<string>;
         }>>;
         checkboxWithTitle: PropTypes.Requireable<PropTypes.InferProps<{
+            value: PropTypes.Requireable<string>;
             title: PropTypes.Requireable<string>;
             name: PropTypes.Requireable<string>;
             checked: PropTypes.Requireable<boolean>;
@@ -716,6 +718,7 @@ declare const ContentSkillModalPropTypes: {
                     count: PropTypes.Requireable<number>;
                     onClick: PropTypes.Requireable<(...args: any[]) => any>;
                 }> | null | undefined)[]>;
+                emptySearchResult: PropTypes.Requireable<string>;
                 searchOptions: PropTypes.Requireable<PropTypes.InferProps<{
                     value: PropTypes.Requireable<string>;
                     placeholder: PropTypes.Validator<string>;
@@ -742,8 +745,28 @@ declare const ContentSkillModalPropTypes: {
                     onChange: PropTypes.Validator<(...args: any[]) => any>;
                     theme: PropTypes.Validator<string>;
                     ariaLabel: PropTypes.Validator<string>;
+                    id: PropTypes.Requireable<string>;
                 }> | null | undefined)[]>;
             }>>;
+        }> | PropTypes.InferProps<{
+            type: PropTypes.Requireable<string>;
+            options: PropTypes.Requireable<PropTypes.InferProps<{
+                title: PropTypes.Validator<string>;
+                titleAriaLabel: PropTypes.Requireable<string>;
+                onClear: PropTypes.Validator<(...args: any[]) => any>;
+                options: PropTypes.Requireable<PropTypes.InferProps<{
+                    label: PropTypes.Validator<string>;
+                    min: PropTypes.Validator<number>;
+                    max: PropTypes.Validator<number>;
+                    step: PropTypes.Requireable<number>;
+                    value: PropTypes.Requireable<(number | null | undefined)[]>;
+                    minLabel: PropTypes.Requireable<string>;
+                    maxLabel: PropTypes.Requireable<string>;
+                    onChange: PropTypes.Validator<(...args: any[]) => any>;
+                    theme: PropTypes.Requireable<string>;
+                    selected: PropTypes.Requireable<boolean>;
+                }>>;
+            }>>;
         }> | null | undefined> | null | undefined)[]>;
     }>>>;
     modal: PropTypes.Validator<NonNullable<PropTypes.InferProps<{

package/lib/organism/content-skill-modal/types.d.ts.map

@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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"}
+{"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"}

package/lib/organism/filter-checkbox-and-search/index.d.ts

@@ -15,6 +15,7 @@ declare const FilterCheckboxAndSearch: {
             count: import("prop-types").Requireable<number>;
             onClick: import("prop-types").Requireable<(...args: any[]) => any>;
         }> | null | undefined)[]>;
+        emptySearchResult: import("prop-types").Requireable<string>;
         searchOptions: import("prop-types").Requireable<import("prop-types").InferProps<{
             value: import("prop-types").Requireable<string>;
             placeholder: import("prop-types").Validator<string>;
@@ -31,6 +32,27 @@ declare const FilterCheckboxAndSearch: {
     };
     contextTypes: {
         translate: import("prop-types").Requireable<(...args: any[]) => any>;
+        skin: import("prop-types").Requireable<import("prop-types").InferProps<{
+            common: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+            images: import("prop-types").Requireable<import("prop-types").InferProps<{
+                'logo-mobile': import("prop-types").Requireable<any>;
+                logo: import("prop-types").Requireable<any>;
+                'logo-email': import("prop-types").Requireable<any>;
+                login: import("prop-types").Requireable<any>;
+            }>>;
+            icons: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+            mod: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+            courses: import("prop-types").Requireable<any[]>;
+            texts: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
     };
 };
 export default FilterCheckboxAndSearch;

package/lib/organism/filter-checkbox-and-search/index.d.ts.map

@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgG1B,CAAC;AAQF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-checkbox-and-search/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAKjE,OAAkB,EAAC,4BAA4B,EAAC,MAAM,eAAe,CAAC;AAiBtE,QAAA,MAAM,uBAAuB;YACpB,4BAA4B,WAC1B,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkH1B,CAAC;AASF,eAAe,uBAAuB,CAAC"}

package/lib/organism/filter-checkbox-and-search/index.js

@@ -6,8 +6,10 @@ var _toString2 = _interopRequireDefault(require("lodash/fp/toString"));
 var _size2 = _interopRequireDefault(require("lodash/fp/size"));
 var _pipe2 = _interopRequireDefault(require("lodash/fp/pipe"));
 var _isEmpty2 = _interopRequireDefault(require("lodash/fp/isEmpty"));
+var _getOr2 = _interopRequireDefault(require("lodash/fp/getOr"));
 var _filter2 = _interopRequireDefault(require("lodash/fp/filter"));
 var _react = _interopRequireWildcard(require("react"));
+var _cssColorFunction = require("css-color-function");
 var _title = _interopRequireDefault(require("../../atom/title"));
 var _tag = _interopRequireDefault(require("../../atom/tag"));
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
@@ -39,11 +41,17 @@ const CHECKBOX_TITLE_STYLE = {
 const INITIAL_VISIBLE_OPTIONS = 5;
 const FilterCheckboxAndSearch = (props, context) => {
   const {
+    skin
+  } = context;
+  const primaryColor = (0, _getOr2.default)(_colors.COLORS.cm_primary_blue, 'common.primary', skin);
+  const {
+    id,
     title,
     titleAriaLabel,
     searchOptions,
     onClear,
-    options
+    options,
+    emptySearchResult
   } = props;
   const translate = (0, _provider.GetTranslateFromContext)(context);
   const [showMore, setShowMore] = (0, _react.useState)(false);
@@ -58,6 +66,7 @@ const FilterCheckboxAndSearch = (props, context) => {
     return showMore ? options : options.slice(0, INITIAL_VISIBLE_OPTIONS);
   }, [options, showMore]);
   return /*#__PURE__*/_react.default.createElement("div", {
+    "data-name": id,
     "data-testid": "filter-checkbox-and-search-container",
     className: _style.default.container
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -72,7 +81,11 @@ const FilterCheckboxAndSearch = (props, context) => {
   }), hasSelectedFilters ? /*#__PURE__*/_react.default.createElement(_tag.default, {
     label: (0, _toString2.default)(selectedFiltersCount),
     type: "info",
-    size: "S"
+    size: "S",
+    customStyle: {
+      color: primaryColor,
+      backgroundColor: (0, _cssColorFunction.convert)(`color(${primaryColor} lightness(92%))`)
+    }
   }) : null), hasSelectedFilters ? /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.clearButtonContainer
   }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
@@ -90,7 +103,7 @@ const FilterCheckboxAndSearch = (props, context) => {
   }, (0, _isEmpty2.default)(visibleOptions) ? /*#__PURE__*/_react.default.createElement("p", {
     className: _style.default.emptySearchResult,
     "data-testid": "filter-checkbox-and-search-empty-message"
-  }, "No results... Try adjusting your search.") : visibleOptions.map(({
+  }, emptySearchResult) : visibleOptions.map(({
     value,
     label,
     selected,
@@ -102,14 +115,17 @@ const FilterCheckboxAndSearch = (props, context) => {
     "data-testid": `filter-checkbox-and-search-option-row-${index}`
   }, /*#__PURE__*/_react.default.createElement(_checkboxWithTitle.default, {
     key: value,
+    value: value,
     title: label,
     onChange: onClick,
     name: label,
     checked: selected,
     customStyle: CHECKBOX_TITLE_STYLE
   }), /*#__PURE__*/_react.default.createElement("p", {
+    "data-name": 'counter',
     className: _style.default.optionCount
   }, count)))), (0, _size2.default)(options) > INITIAL_VISIBLE_OPTIONS ? /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
+    "data-name": 'show-more-button',
     label: showMore ? translate('Show less') : translate('Show more'),
     type: "text",
     icon: {
@@ -127,7 +143,8 @@ const FilterCheckboxAndSearch = (props, context) => {
 };
 FilterCheckboxAndSearch.propTypes = process.env.NODE_ENV !== "production" ? _propsTypes.default : {};
 FilterCheckboxAndSearch.contextTypes = {
-  translate: _provider.default.childContextTypes.translate
+  translate: _provider.default.childContextTypes.translate,
+  skin: _provider.default.childContextTypes.skin
 };
 var _default = exports.default = FilterCheckboxAndSearch;
 //# sourceMappingURL=index.js.map

package/lib/organism/filter-checkbox-and-search/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_title","_interopRequireDefault","_tag","_buttonLink","_provider","_checkboxWithTitle","_colors","_inputSearch","_style","_propsTypes","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CLEAR_BUTTON_STYLE","fontWeight","padding","SHOW_BUTTON_STYLE","fontSize","fontFamily","CHECKBOX_TITLE_STYLE","marginRight","INITIAL_VISIBLE_OPTIONS","FilterCheckboxAndSearch","props","context","title","titleAriaLabel","searchOptions","onClear","options","translate","GetTranslateFromContext","showMore","setShowMore","useState","selectedFiltersCount","_pipe2","_filter2","selected","_size2","hasSelectedFilters","handleShowMore","useCallback","visibleOptions","useMemo","slice","createElement","className","style","container","header","titleAndTagWrapper","ariaLabel","label","_toString2","type","size","clearButtonContainer","onClick","customStyle","hoverColor","COLORS","cm_grey_700","search","optionsContainer","_isEmpty2","emptySearchResult","map","value","count","index","key","optionRow","onChange","name","checked","optionCount","icon","position","faIcon","color","cm_grey_500","propTypes","process","env","NODE_ENV","contextTypes","Provider","childContextTypes","_default","exports"],"sources":["../../../src/organism/filter-checkbox-and-search/index.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport {filter, isEmpty, pipe, size, toString} from 'lodash/fp';\nimport Title from '../../atom/title';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport Provider, {GetTranslateFromContext} from '../../atom/provider';\nimport {WebContextValues} from '../../atom/provider/web-context';\nimport CheckboxWithTitle from '../../atom/checkbox-with-title';\nimport {COLORS} from '../../variables/colors';\nimport Search from '../../atom/input-search';\nimport style from './style.css';\nimport propTypes, {FilterCheckboxAndSearchProps} from './props-types';\n\nconst CLEAR_BUTTON_STYLE = {fontWeight: 'normal', padding: 0};\nconst SHOW_BUTTON_STYLE = {\n  fontSize: '14px',\n  fontWeight: '600',\n  fontFamily: 'Gilroy',\n  padding: '0'\n};\nconst CHECKBOX_TITLE_STYLE = {\n  marginRight: '16px',\n  fontSize: '14px',\n  fontFamily: 'Gilroy',\n  fontWeight: 'normal'\n};\nconst INITIAL_VISIBLE_OPTIONS = 5;\n\nconst FilterCheckboxAndSearch = (\n  props: FilterCheckboxAndSearchProps,\n  context: WebContextValues\n) => {\n  const {title, titleAriaLabel, searchOptions, onClear, options} = props;\n  const translate = GetTranslateFromContext(context);\n  const [showMore, setShowMore] = useState(false);\n  const selectedFiltersCount = pipe(filter({selected: true}), size)(options);\n  const hasSelectedFilters = selectedFiltersCount > 0;\n\n  const handleShowMore = useCallback(() => {\n    setShowMore(!showMore);\n  }, [showMore]);\n\n  const visibleOptions = useMemo(() => {\n    return showMore ? options : options.slice(0, INITIAL_VISIBLE_OPTIONS);\n  }, [options, showMore]);\n\n  return (\n    <div data-testid=\"filter-checkbox-and-search-container\" className={style.container}>\n      <div className={style.header} data-testid=\"filter-checkbox-and-search-header\">\n        <div\n          className={style.titleAndTagWrapper}\n          data-testid=\"filter-checkbox-and-searh-title-and-tag-wrapper\"\n        >\n          <Title title={title} ariaLabel={titleAriaLabel} />\n          {hasSelectedFilters ? (\n            <Tag label={toString(selectedFiltersCount)} type=\"info\" size=\"S\" />\n          ) : null}\n        </div>\n        {hasSelectedFilters ? (\n          <div className={style.clearButtonContainer}>\n            <ButtonLink\n              label={translate('clear')}\n              type=\"text\"\n              data-testid=\"filter-checkbox-and-search-clear-button\"\n              onClick={onClear}\n              customStyle={CLEAR_BUTTON_STYLE}\n              hoverColor={COLORS.cm_grey_700}\n            />\n          </div>\n        ) : null}\n      </div>\n      {searchOptions ? (\n        <div className={style.search}>\n          <Search {...searchOptions} />\n        </div>\n      ) : null}\n      <div\n        data-testid=\"filter-checkbox-and-search-options-container\"\n        className={style.optionsContainer}\n      >\n        {isEmpty(visibleOptions) ? (\n          <p\n            className={style.emptySearchResult}\n            data-testid=\"filter-checkbox-and-search-empty-message\"\n          >\n            No results... Try adjusting your search.\n          </p>\n        ) : (\n          visibleOptions.map(({value, label, selected, count, onClick}, index) => (\n            <div\n              key={value}\n              className={style.optionRow}\n              data-testid={`filter-checkbox-and-search-option-row-${index}`}\n            >\n              <CheckboxWithTitle\n                key={value}\n                title={label}\n                onChange={onClick}\n                name={label}\n                checked={selected}\n                customStyle={CHECKBOX_TITLE_STYLE}\n              />\n              <p className={style.optionCount}>{count}</p>\n            </div>\n          ))\n        )}\n      </div>\n      {size(options) > INITIAL_VISIBLE_OPTIONS ? (\n        <ButtonLink\n          label={showMore ? translate('Show less') : translate('Show more')}\n          type=\"text\"\n          icon={{\n            position: 'right',\n            faIcon: {\n              name: showMore ? 'chevron-up' : 'chevron-down',\n              size: 16,\n              color: COLORS.cm_grey_500\n            }\n          }}\n          customStyle={SHOW_BUTTON_STYLE}\n          onClick={handleShowMore}\n          data-testid=\"filter-checkbox-and-search-show-button\"\n        />\n      ) : null}\n    </div>\n  );\n};\n\nFilterCheckboxAndSearch.propTypes = propTypes;\n\nFilterCheckboxAndSearch.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nexport default FilterCheckboxAndSearch;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_cssColorFunction","_title","_interopRequireDefault","_tag","_buttonLink","_provider","_checkboxWithTitle","_colors","_inputSearch","_style","_propsTypes","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CLEAR_BUTTON_STYLE","fontWeight","padding","SHOW_BUTTON_STYLE","fontSize","fontFamily","CHECKBOX_TITLE_STYLE","marginRight","INITIAL_VISIBLE_OPTIONS","FilterCheckboxAndSearch","props","context","skin","primaryColor","_getOr2","COLORS","cm_primary_blue","id","title","titleAriaLabel","searchOptions","onClear","options","emptySearchResult","translate","GetTranslateFromContext","showMore","setShowMore","useState","selectedFiltersCount","_pipe2","_filter2","selected","_size2","hasSelectedFilters","handleShowMore","useCallback","visibleOptions","useMemo","slice","createElement","className","style","container","header","titleAndTagWrapper","ariaLabel","label","_toString2","type","size","customStyle","color","backgroundColor","convert","clearButtonContainer","onClick","hoverColor","cm_grey_700","search","optionsContainer","_isEmpty2","map","value","count","index","key","optionRow","onChange","name","checked","optionCount","icon","position","faIcon","cm_grey_500","propTypes","process","env","NODE_ENV","contextTypes","Provider","childContextTypes","_default","exports"],"sources":["../../../src/organism/filter-checkbox-and-search/index.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport {filter, getOr, isEmpty, pipe, size, toString} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Title from '../../atom/title';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport Provider, {GetTranslateFromContext} from '../../atom/provider';\nimport {WebContextValues} from '../../atom/provider/web-context';\nimport CheckboxWithTitle from '../../atom/checkbox-with-title';\nimport {COLORS} from '../../variables/colors';\nimport Search from '../../atom/input-search';\nimport style from './style.css';\nimport propTypes, {FilterCheckboxAndSearchProps} from './props-types';\n\nconst CLEAR_BUTTON_STYLE = {fontWeight: 'normal', padding: 0};\nconst SHOW_BUTTON_STYLE = {\n  fontSize: '14px',\n  fontWeight: '600',\n  fontFamily: 'Gilroy',\n  padding: '0'\n};\nconst CHECKBOX_TITLE_STYLE = {\n  marginRight: '16px',\n  fontSize: '14px',\n  fontFamily: 'Gilroy',\n  fontWeight: 'normal'\n};\nconst INITIAL_VISIBLE_OPTIONS = 5;\n\nconst FilterCheckboxAndSearch = (\n  props: FilterCheckboxAndSearchProps,\n  context: WebContextValues\n) => {\n  const {skin} = context;\n  const primaryColor = getOr(COLORS.cm_primary_blue, 'common.primary', skin);\n  const {id, title, titleAriaLabel, searchOptions, onClear, options, emptySearchResult} = props;\n  const translate = GetTranslateFromContext(context);\n  const [showMore, setShowMore] = useState(false);\n  const selectedFiltersCount = pipe(filter({selected: true}), size)(options);\n  const hasSelectedFilters = selectedFiltersCount > 0;\n\n  const handleShowMore = useCallback(() => {\n    setShowMore(!showMore);\n  }, [showMore]);\n\n  const visibleOptions = useMemo(() => {\n    return showMore ? options : options.slice(0, INITIAL_VISIBLE_OPTIONS);\n  }, [options, showMore]);\n\n  return (\n    <div\n      data-name={id}\n      data-testid=\"filter-checkbox-and-search-container\"\n      className={style.container}\n    >\n      <div className={style.header} data-testid=\"filter-checkbox-and-search-header\">\n        <div\n          className={style.titleAndTagWrapper}\n          data-testid=\"filter-checkbox-and-searh-title-and-tag-wrapper\"\n        >\n          <Title title={title} ariaLabel={titleAriaLabel} />\n          {hasSelectedFilters ? (\n            <Tag\n              label={toString(selectedFiltersCount)}\n              type=\"info\"\n              size=\"S\"\n              customStyle={{\n                color: primaryColor,\n                backgroundColor: convert(`color(${primaryColor} lightness(92%))`)\n              }}\n            />\n          ) : null}\n        </div>\n        {hasSelectedFilters ? (\n          <div className={style.clearButtonContainer}>\n            <ButtonLink\n              label={translate('clear')}\n              type=\"text\"\n              data-testid=\"filter-checkbox-and-search-clear-button\"\n              onClick={onClear}\n              customStyle={CLEAR_BUTTON_STYLE}\n              hoverColor={COLORS.cm_grey_700}\n            />\n          </div>\n        ) : null}\n      </div>\n      {searchOptions ? (\n        <div className={style.search}>\n          <Search {...searchOptions} />\n        </div>\n      ) : null}\n      <div\n        data-testid=\"filter-checkbox-and-search-options-container\"\n        className={style.optionsContainer}\n      >\n        {isEmpty(visibleOptions) ? (\n          <p\n            className={style.emptySearchResult}\n            data-testid=\"filter-checkbox-and-search-empty-message\"\n          >\n            {emptySearchResult}\n          </p>\n        ) : (\n          visibleOptions.map(({value, label, selected, count, onClick}, index) => (\n            <div\n              key={value}\n              className={style.optionRow}\n              data-testid={`filter-checkbox-and-search-option-row-${index}`}\n            >\n              <CheckboxWithTitle\n                key={value}\n                value={value}\n                title={label}\n                onChange={onClick}\n                name={label}\n                checked={selected}\n                customStyle={CHECKBOX_TITLE_STYLE}\n              />\n              <p data-name={'counter'} className={style.optionCount}>\n                {count}\n              </p>\n            </div>\n          ))\n        )}\n      </div>\n      {size(options) > INITIAL_VISIBLE_OPTIONS ? (\n        <ButtonLink\n          data-name={'show-more-button'}\n          label={showMore ? translate('Show less') : translate('Show more')}\n          type=\"text\"\n          icon={{\n            position: 'right',\n            faIcon: {\n              name: showMore ? 'chevron-up' : 'chevron-down',\n              size: 16,\n              color: COLORS.cm_grey_500\n            }\n          }}\n          customStyle={SHOW_BUTTON_STYLE}\n          onClick={handleShowMore}\n          data-testid=\"filter-checkbox-and-search-show-button\"\n        />\n      ) : null}\n    </div>\n  );\n};\n\nFilterCheckboxAndSearch.propTypes = propTypes;\n\nFilterCheckboxAndSearch.contextTypes = {\n  translate: Provider.childContextTypes.translate,\n  skin: Provider.childContextTypes.skin\n};\n\nexport default FilterCheckboxAndSearch;\n"],"mappings":"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","ignoreList":[]}

package/lib/organism/filter-checkbox-and-search/props-types.d.ts

@@ -11,6 +11,7 @@ declare const propTypes: {
         count: PropTypes.Requireable<number>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
     }> | null | undefined)[]>;
+    emptySearchResult: PropTypes.Requireable<string>;
     searchOptions: PropTypes.Requireable<PropTypes.InferProps<{
         value: PropTypes.Requireable<string>;
         placeholder: PropTypes.Validator<string>;
@@ -44,10 +45,12 @@ declare type SearchType = {
     dataTestId?: string;
 };
 export declare type FilterCheckboxAndSearchProps = {
+    id?: string;
     title: string;
     titleAriaLabel?: string;
     onClear: () => void;
     searchOptions: SearchType;
+    emptySearchResult?: string;
     options: FilterCheckboxAndSearchOptions[];
 };
 export default propTypes;

package/lib/organism/filter-checkbox-and-search/props-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props-types.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-checkbox-and-search/props-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAGnC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;CAed,CAAC;AAEF,oBAAY,8BAA8B,GAAG;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,aAAK,UAAU,GAAG;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,GAAG,cAAc,CAAC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,oBAAY,4BAA4B,GAAG;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,UAAU,CAAC;IAC1B,OAAO,EAAE,8BAA8B,EAAE,CAAC;CAC3C,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"props-types.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-checkbox-and-search/props-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAGnC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBd,CAAC;AAEF,oBAAY,8BAA8B,GAAG;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,aAAK,UAAU,GAAG;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,GAAG,cAAc,CAAC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,oBAAY,4BAA4B,GAAG;IACzC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,UAAU,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,OAAO,EAAE,8BAA8B,EAAE,CAAC;CAC3C,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/organism/filter-checkbox-and-search/props-types.js

@@ -17,6 +17,7 @@ const propTypes = {
     count: _propTypes.default.number,
     onClick: _propTypes.default.func
   })),
+  emptySearchResult: _propTypes.default.string,
   searchOptions: _propTypes.default.shape(_inputSearch.default.propTypes)
 };
 var _default = exports.default = propTypes;

package/lib/organism/filter-checkbox-and-search/props-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"props-types.js","names":["_propTypes","_interopRequireDefault","require","_inputSearch","e","__esModule","default","propTypes","title","PropTypes","string","titleAriaLabel","onClear","func","options","arrayOf","shape","label","value","selected","bool","ref","count","number","onClick","searchOptions","Search","_default","exports"],"sources":["../../../src/organism/filter-checkbox-and-search/props-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport Search from '../../atom/input-search';\n\nconst propTypes = {\n  title: PropTypes.string,\n  titleAriaLabel: PropTypes.string,\n  onClear: PropTypes.func,\n  options: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      value: PropTypes.string,\n      selected: PropTypes.bool,\n      ref: PropTypes.string,\n      count: PropTypes.number,\n      onClick: PropTypes.func\n    })\n  ),\n  searchOptions: PropTypes.shape(Search.propTypes)\n};\n\nexport type FilterCheckboxAndSearchOptions = {\n  label: string;\n  value: string;\n  selected: boolean;\n  ref: string;\n  count: number;\n  onClick: () => void;\n};\n\ntype SearchType = {\n  value?: string;\n  placeholder: string;\n  onChange?: () => void;\n  onClear?: () => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  theme?: 'default' | 'coorpmanager';\n  dataTestId?: string;\n};\n\nexport type FilterCheckboxAndSearchProps = {\n  title: string;\n  titleAriaLabel?: string;\n  onClear: () => void;\n  searchOptions: SearchType;\n  options: FilterCheckboxAndSearchOptions[];\n};\n\nexport default propTypes;\n"],"mappings":";;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAF,sBAAA,CAAAC,OAAA;AAA6C,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE7C,MAAMG,SAAS,GAAG;EAChBC,KAAK,EAAEC,kBAAS,CAACC,MAAM;EACvBC,cAAc,EAAEF,kBAAS,CAACC,MAAM;EAChCE,OAAO,EAAEH,kBAAS,CAACI,IAAI;EACvBC,OAAO,EAAEL,kBAAS,CAACM,OAAO,CACxBN,kBAAS,CAACO,KAAK,CAAC;IACdC,KAAK,EAAER,kBAAS,CAACC,MAAM;IACvBQ,KAAK,EAAET,kBAAS,CAACC,MAAM;IACvBS,QAAQ,EAAEV,kBAAS,CAACW,IAAI;IACxBC,GAAG,EAAEZ,kBAAS,CAACC,MAAM;IACrBY,KAAK,EAAEb,kBAAS,CAACc,MAAM;IACvBC,OAAO,EAAEf,kBAAS,CAACI;EACrB,CAAC,CACH,CAAC;EACDY,aAAa,EAAEhB,kBAAS,CAACO,KAAK,CAACU,oBAAM,CAACnB,SAAS;AACjD,CAAC;AAAC,IAAAoB,QAAA,GAAAC,OAAA,CAAAtB,OAAA,GA8BaC,SAAS","ignoreList":[]}
+{"version":3,"file":"props-types.js","names":["_propTypes","_interopRequireDefault","require","_inputSearch","e","__esModule","default","propTypes","title","PropTypes","string","titleAriaLabel","onClear","func","options","arrayOf","shape","label","value","selected","bool","ref","count","number","onClick","emptySearchResult","searchOptions","Search","_default","exports"],"sources":["../../../src/organism/filter-checkbox-and-search/props-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport Search from '../../atom/input-search';\n\nconst propTypes = {\n  title: PropTypes.string,\n  titleAriaLabel: PropTypes.string,\n  onClear: PropTypes.func,\n  options: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      value: PropTypes.string,\n      selected: PropTypes.bool,\n      ref: PropTypes.string,\n      count: PropTypes.number,\n      onClick: PropTypes.func\n    })\n  ),\n  emptySearchResult: PropTypes.string,\n  searchOptions: PropTypes.shape(Search.propTypes)\n};\n\nexport type FilterCheckboxAndSearchOptions = {\n  label: string;\n  value: string;\n  selected: boolean;\n  ref: string;\n  count: number;\n  onClick: () => void;\n};\n\ntype SearchType = {\n  value?: string;\n  placeholder: string;\n  onChange?: () => void;\n  onClear?: () => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  theme?: 'default' | 'coorpmanager';\n  dataTestId?: string;\n};\n\nexport type FilterCheckboxAndSearchProps = {\n  id?: string;\n  title: string;\n  titleAriaLabel?: string;\n  onClear: () => void;\n  searchOptions: SearchType;\n  emptySearchResult?: string;\n  options: FilterCheckboxAndSearchOptions[];\n};\n\nexport default propTypes;\n"],"mappings":";;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAF,sBAAA,CAAAC,OAAA;AAA6C,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE7C,MAAMG,SAAS,GAAG;EAChBC,KAAK,EAAEC,kBAAS,CAACC,MAAM;EACvBC,cAAc,EAAEF,kBAAS,CAACC,MAAM;EAChCE,OAAO,EAAEH,kBAAS,CAACI,IAAI;EACvBC,OAAO,EAAEL,kBAAS,CAACM,OAAO,CACxBN,kBAAS,CAACO,KAAK,CAAC;IACdC,KAAK,EAAER,kBAAS,CAACC,MAAM;IACvBQ,KAAK,EAAET,kBAAS,CAACC,MAAM;IACvBS,QAAQ,EAAEV,kBAAS,CAACW,IAAI;IACxBC,GAAG,EAAEZ,kBAAS,CAACC,MAAM;IACrBY,KAAK,EAAEb,kBAAS,CAACc,MAAM;IACvBC,OAAO,EAAEf,kBAAS,CAACI;EACrB,CAAC,CACH,CAAC;EACDY,iBAAiB,EAAEhB,kBAAS,CAACC,MAAM;EACnCgB,aAAa,EAAEjB,kBAAS,CAACO,KAAK,CAACW,oBAAM,CAACpB,SAAS;AACjD,CAAC;AAAC,IAAAqB,QAAA,GAAAC,OAAA,CAAAvB,OAAA,GAgCaC,SAAS","ignoreList":[]}

package/lib/organism/filter-chip/index.d.ts

@@ -19,6 +19,27 @@ declare const FilterChip: {
     };
     contextTypes: {
         translate: import("prop-types").Requireable<(...args: any[]) => any>;
+        skin: import("prop-types").Requireable<import("prop-types").InferProps<{
+            common: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+            images: import("prop-types").Requireable<import("prop-types").InferProps<{
+                'logo-mobile': import("prop-types").Requireable<any>;
+                logo: import("prop-types").Requireable<any>;
+                'logo-email': import("prop-types").Requireable<any>;
+                login: import("prop-types").Requireable<any>;
+            }>>;
+            icons: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+            mod: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+            courses: import("prop-types").Requireable<any[]>;
+            texts: import("prop-types").Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
     };
 };
 export default FilterChip;

package/lib/organism/filter-chip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-chip/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAEjE,OAAkB,EAAC,eAAe,EAAC,MAAM,cAAc,CAAC;AAGxD,QAAA,MAAM,UAAU;YAAW,eAAe,WAAW,gBAAgB;;;;;;;;;;;;;;;;;;CAiDpE,CAAC;AAQF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/filter-chip/index.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAEjE,OAAkB,EAAC,eAAe,EAAC,MAAM,cAAc,CAAC;AAGxD,QAAA,MAAM,UAAU;YAAW,eAAe,WAAW,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DpE,CAAC;AASF,eAAe,UAAU,CAAC"}

package/lib/organism/filter-chip/index.js

@@ -6,8 +6,10 @@ var _toString2 = _interopRequireDefault(require("lodash/fp/toString"));
 var _size2 = _interopRequireDefault(require("lodash/fp/size"));
 var _pipe2 = _interopRequireDefault(require("lodash/fp/pipe"));
 var _map2 = _interopRequireDefault(require("lodash/fp/map"));
+var _getOr2 = _interopRequireDefault(require("lodash/fp/getOr"));
 var _filter2 = _interopRequireDefault(require("lodash/fp/filter"));
 var _react = _interopRequireDefault(require("react"));
+var _cssColorFunction = require("css-color-function");
 var _chip = _interopRequireDefault(require("../../atom/chip"));
 var _title = _interopRequireDefault(require("../../atom/title"));
 var _tag = _interopRequireDefault(require("../../atom/tag"));
@@ -20,6 +22,10 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const FilterChip = (props, context) => {
+  const {
+    skin
+  } = context;
+  const primaryColor = (0, _getOr2.default)(_colors.COLORS.cm_grey_700, 'common.primary', skin);
   const {
     options,
     titleAriaLabel,
@@ -41,7 +47,11 @@ const FilterChip = (props, context) => {
   }), hasSelectedFilters ? /*#__PURE__*/_react.default.createElement(_tag.default, {
     label: (0, _toString2.default)(selectedFiltersCount),
     type: "info",
-    size: "S"
+    size: "S",
+    customStyle: {
+      color: primaryColor,
+      backgroundColor: (0, _cssColorFunction.convert)(`color(${primaryColor} lightness(92%))`)
+    }
   }) : null), hasSelectedFilters ? /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.buttonContainer
   }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
@@ -74,6 +84,7 @@ const FilterChip = (props, context) => {
       text: label,
       textColor: textColor,
       key: label,
+      backgroundColor: "skin",
       selected: selected,
       onClick: handleClick,
       customIcon: customIcon
@@ -82,7 +93,8 @@ const FilterChip = (props, context) => {
 };
 FilterChip.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.default : {};
 FilterChip.contextTypes = {
-  translate: _provider.default.childContextTypes.translate
+  translate: _provider.default.childContextTypes.translate,
+  skin: _provider.default.childContextTypes.skin
 };
 var _default = exports.default = FilterChip;
 //# sourceMappingURL=index.js.map