@coorpacademy/components 11.9.3-alpha.25.24 → 11.9.3-alpha.30

package/lib/atom/input-switch/index.js

@@ -21,6 +21,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const InputSwitch = props => {
   const {
     title,
@@ -35,14 +37,17 @@ const InputSwitch = props => {
     titlePosition = 'left',
     details = '',
     requiredSelection = false,
-    'data-name': dataName
+    'data-name': dataName,
+    'aria-labelledby': ariaLabelledBy,
+    'aria-label': ariaLabel
   } = props;
   const idSwitch = id || (0, _uniqueId2.default)('input-switch-');
   const isDisabled = disabled ? 'disabled' : '';
   const handleChange = (0, _react.useMemo)(() => e => onChange(e.target.checked), [onChange]);
   const titleView = title ? /*#__PURE__*/_react.default.createElement("span", {
+    id: `title-view-${dataName}`,
     className: _style.default.title
-  }, `${title} `) : null;
+  }, `${title} `, ' ') : null;
   const descriptionView = description ? /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.description
   }, description) : null;
@@ -77,13 +82,19 @@ const InputSwitch = props => {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: className,
     "data-name": `switch-input-${theme}${dataName}`
-  }, titlePosition === 'left' ? /*#__PURE__*/_react.default.createElement("div", {
-    id: `title-view-${dataName}`
-  }, titleView, " ") : null, /*#__PURE__*/_react.default.createElement("div", {
+  }, titlePosition === 'left' ? {
+    titleView
+  } : null, /*#__PURE__*/_react.default.createElement("div", {
     className: requiredSelection ? _style.default.requiredSelection : null
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.btnSwitchContainer
-  }, /*#__PURE__*/_react.default.createElement("input", {
+  }, /*#__PURE__*/_react.default.createElement("input", _extends({}, ariaLabelledBy ? {
+    'aria-labelledby': ariaLabelledBy
+  } : {}, title && !ariaLabelledBy ? {
+    'aria-labelledby': `title-view-${dataName}`
+  } : {}, ariaLabel && !ariaLabelledBy && !title ? {
+    'aria-label': ariaLabel
+  } : {}, {
     type: "checkbox",
     id: idSwitch,
     name: name,
@@ -91,15 +102,15 @@ const InputSwitch = props => {
     checked: value,
     disabled: isDisabled,
     className: _style.default.checkbox,
-    "aria-labelledby": `title-view-${dataName}`
-  }), /*#__PURE__*/_react.default.createElement("label", {
+    "aria-labelledby": ariaLabelledBy
+  })), /*#__PURE__*/_react.default.createElement("label", {
     htmlFor: idSwitch,
     "data-name": "input-switch-label"
   }))), /*#__PURE__*/_react.default.createElement("div", {
     className: !details ? _style.default.alignedTextContainer : null
-  }, titlePosition === 'right' ? /*#__PURE__*/_react.default.createElement("div", {
-    id: `title-view-${dataName}`
-  }, titleView, " ") : null, details ? /*#__PURE__*/_react.default.createElement("div", {
+  }, titlePosition === 'right' ? {
+    titleView
+  } : null, details ? /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.detailsTxt
   }, details) : null), descriptionView);
 };
@@ -112,6 +123,8 @@ InputSwitch.propTypes = process.env.NODE_ENV !== "production" ? {
   disabled: _propTypes.default.bool,
   onChange: _propTypes.default.func,
   description: _propTypes.default.string,
+  'aria-labelledby': _propTypes.default.string,
+  'aria-label': _propTypes.default.string,
   modified: _propTypes.default.bool,
   titlePosition: _propTypes.default.oneOf(['right', 'left']),
   theme: _propTypes.default.oneOf(['default', 'coorpmanager', 'mooc']),

package/lib/atom/input-switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["InputSwitch","props","title","name","id","value","disabled","onChange","description","modified","theme","titlePosition","details","requiredSelection","dataName","idSwitch","isDisabled","handleChange","useMemo","e","target","checked","titleView","style","descriptionView","getClass","defaultClass","coorpmanager","modifiedClass","coorpmanagerModified","partielUncheck","default","className","getClassState","btnSwitchContainer","checkbox","alignedTextContainer","detailsTxt","propTypes","PropTypes","string","bool","func","oneOf"],"sources":["../../../src/atom/input-switch/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst InputSwitch = props => {\n  const {\n    title,\n    name,\n    id,\n    value,\n    disabled,\n    onChange = noop,\n    description,\n    modified = false,\n    theme = 'default',\n    titlePosition = 'left',\n    details = '',\n    requiredSelection = false,\n    'data-name': dataName\n  } = props;\n\n  const idSwitch = id || uniqueId('input-switch-');\n  const isDisabled = disabled ? 'disabled' : '';\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  const titleView = title ? <span className={style.title}>{`${title} `}</span> : null;\n\n  const descriptionView = description ? (\n    <div className={style.description}>{description}</div>\n  ) : null;\n\n  const getClass = () => {\n    switch (theme) {\n      case 'coorpmanager':\n        return {\n          defaultClass: style.coorpmanager,\n          modifiedClass: style.coorpmanagerModified\n        };\n      case 'mooc':\n        return {\n          defaultClass: style.partielUncheck,\n          modifiedClass: style.coorpmanagerModified\n        };\n      default:\n        return {defaultClass: style.default, modifiedClass: style.modified};\n    }\n  };\n  const {defaultClass, modifiedClass} = getClass();\n  const className = getClassState(defaultClass, modifiedClass, null, modified);\n\n  return (\n    <div className={className} data-name={`switch-input-${theme}${dataName}`}>\n      {titlePosition === 'left' ? <div id={`title-view-${dataName}`}>{titleView} </div> : null}\n      <div className={requiredSelection ? style.requiredSelection : null}>\n        <div className={style.btnSwitchContainer}>\n          <input\n            type=\"checkbox\"\n            id={idSwitch}\n            name={name}\n            onChange={handleChange}\n            checked={value}\n            disabled={isDisabled}\n            className={style.checkbox}\n            aria-labelledby={`title-view-${dataName}`}\n          />\n          <label htmlFor={idSwitch} data-name=\"input-switch-label\" />\n        </div>\n      </div>\n      <div className={!details ? style.alignedTextContainer : null}>\n        {titlePosition === 'right' ? <div id={`title-view-${dataName}`}>{titleView} </div> : null}\n        {details ? <div className={style.detailsTxt}>{details}</div> : null}\n      </div>\n      {descriptionView}\n    </div>\n  );\n};\n\nInputSwitch.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  id: PropTypes.string,\n  value: PropTypes.bool,\n  disabled: PropTypes.bool,\n  onChange: PropTypes.func,\n  description: PropTypes.string,\n  modified: PropTypes.bool,\n  titlePosition: PropTypes.oneOf(['right', 'left']),\n  theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc']),\n  details: PropTypes.string,\n  'data-name': PropTypes.string,\n  requiredSelection: PropTypes.bool\n};\nexport default InputSwitch;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["InputSwitch","props","title","name","id","value","disabled","onChange","description","modified","theme","titlePosition","details","requiredSelection","dataName","ariaLabelledBy","ariaLabel","idSwitch","isDisabled","handleChange","useMemo","e","target","checked","titleView","style","descriptionView","getClass","defaultClass","coorpmanager","modifiedClass","coorpmanagerModified","partielUncheck","default","className","getClassState","btnSwitchContainer","checkbox","alignedTextContainer","detailsTxt","propTypes","PropTypes","string","bool","func","oneOf"],"sources":["../../../src/atom/input-switch/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst InputSwitch = props => {\n  const {\n    title,\n    name,\n    id,\n    value,\n    disabled,\n    onChange = noop,\n    description,\n    modified = false,\n    theme = 'default',\n    titlePosition = 'left',\n    details = '',\n    requiredSelection = false,\n    'data-name': dataName,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-label': ariaLabel\n  } = props;\n\n  const idSwitch = id || uniqueId('input-switch-');\n  const isDisabled = disabled ? 'disabled' : '';\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  const titleView = title ? (\n    <span id={`title-view-${dataName}`} className={style.title}>\n      {`${title} `}{' '}\n    </span>\n  ) : null;\n\n  const descriptionView = description ? (\n    <div className={style.description}>{description}</div>\n  ) : null;\n\n  const getClass = () => {\n    switch (theme) {\n      case 'coorpmanager':\n        return {\n          defaultClass: style.coorpmanager,\n          modifiedClass: style.coorpmanagerModified\n        };\n      case 'mooc':\n        return {\n          defaultClass: style.partielUncheck,\n          modifiedClass: style.coorpmanagerModified\n        };\n      default:\n        return {defaultClass: style.default, modifiedClass: style.modified};\n    }\n  };\n  const {defaultClass, modifiedClass} = getClass();\n  const className = getClassState(defaultClass, modifiedClass, null, modified);\n\n  return (\n    <div className={className} data-name={`switch-input-${theme}${dataName}`}>\n      {titlePosition === 'left' ? {titleView} : null}\n      <div className={requiredSelection ? style.requiredSelection : null}>\n        <div className={style.btnSwitchContainer}>\n          <input\n            {...(ariaLabelledBy ? {'aria-labelledby': ariaLabelledBy} : {})}\n            {...(title && !ariaLabelledBy ? {'aria-labelledby': `title-view-${dataName}`} : {})}\n            {...(ariaLabel && !ariaLabelledBy && !title ? {'aria-label': ariaLabel} : {})}\n            type=\"checkbox\"\n            id={idSwitch}\n            name={name}\n            onChange={handleChange}\n            checked={value}\n            disabled={isDisabled}\n            className={style.checkbox}\n            aria-labelledby={ariaLabelledBy}\n          />\n          <label htmlFor={idSwitch} data-name=\"input-switch-label\" />\n        </div>\n      </div>\n      <div className={!details ? style.alignedTextContainer : null}>\n        {titlePosition === 'right' ? {titleView} : null}\n        {details ? <div className={style.detailsTxt}>{details}</div> : null}\n      </div>\n      {descriptionView}\n    </div>\n  );\n};\n\nInputSwitch.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  id: PropTypes.string,\n  value: PropTypes.bool,\n  disabled: PropTypes.bool,\n  onChange: PropTypes.func,\n  description: PropTypes.string,\n  'aria-labelledby': PropTypes.string,\n  'aria-label': PropTypes.string,\n  modified: PropTypes.bool,\n  titlePosition: PropTypes.oneOf(['right', 'left']),\n  theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc']),\n  details: PropTypes.string,\n  'data-name': PropTypes.string,\n  requiredSelection: PropTypes.bool\n};\nexport default InputSwitch;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;;;AAEA,MAAMA,WAAW,GAAGC,KAAK,IAAI;EAC3B,MAAM;IACJC,KADI;IAEJC,IAFI;IAGJC,EAHI;IAIJC,KAJI;IAKJC,QALI;IAMJC,QAAQ,iBANJ;IAOJC,WAPI;IAQJC,QAAQ,GAAG,KARP;IASJC,KAAK,GAAG,SATJ;IAUJC,aAAa,GAAG,MAVZ;IAWJC,OAAO,GAAG,EAXN;IAYJC,iBAAiB,GAAG,KAZhB;IAaJ,aAAaC,QAbT;IAcJ,mBAAmBC,cAdf;IAeJ,cAAcC;EAfV,IAgBFf,KAhBJ;EAkBA,MAAMgB,QAAQ,GAAGb,EAAE,IAAI,wBAAS,eAAT,CAAvB;EACA,MAAMc,UAAU,GAAGZ,QAAQ,GAAG,UAAH,GAAgB,EAA3C;EACA,MAAMa,YAAY,GAAG,IAAAC,cAAA,EAAQ,MAAMC,CAAC,IAAId,QAAQ,CAACc,CAAC,CAACC,MAAF,CAASC,OAAV,CAA3B,EAA+C,CAAChB,QAAD,CAA/C,CAArB;EAEA,MAAMiB,SAAS,GAAGtB,KAAK,gBACrB;IAAM,EAAE,EAAG,cAAaY,QAAS,EAAjC;IAAoC,SAAS,EAAEW,cAAA,CAAMvB;EAArD,GACI,GAAEA,KAAM,GADZ,EACgB,GADhB,CADqB,GAInB,IAJJ;EAMA,MAAMwB,eAAe,GAAGlB,WAAW,gBACjC;IAAK,SAAS,EAAEiB,cAAA,CAAMjB;EAAtB,GAAoCA,WAApC,CADiC,GAE/B,IAFJ;;EAIA,MAAMmB,QAAQ,GAAG,MAAM;IACrB,QAAQjB,KAAR;MACE,KAAK,cAAL;QACE,OAAO;UACLkB,YAAY,EAAEH,cAAA,CAAMI,YADf;UAELC,aAAa,EAAEL,cAAA,CAAMM;QAFhB,CAAP;;MAIF,KAAK,MAAL;QACE,OAAO;UACLH,YAAY,EAAEH,cAAA,CAAMO,cADf;UAELF,aAAa,EAAEL,cAAA,CAAMM;QAFhB,CAAP;;MAIF;QACE,OAAO;UAACH,YAAY,EAAEH,cAAA,CAAMQ,OAArB;UAA8BH,aAAa,EAAEL,cAAA,CAAMhB;QAAnD,CAAP;IAZJ;EAcD,CAfD;;EAgBA,MAAM;IAACmB,YAAD;IAAeE;EAAf,IAAgCH,QAAQ,EAA9C;EACA,MAAMO,SAAS,GAAG,IAAAC,sBAAA,EAAcP,YAAd,EAA4BE,aAA5B,EAA2C,IAA3C,EAAiDrB,QAAjD,CAAlB;EAEA,oBACE;IAAK,SAAS,EAAEyB,SAAhB;IAA2B,aAAY,gBAAexB,KAAM,GAAEI,QAAS;EAAvE,GACGH,aAAa,KAAK,MAAlB,GAA2B;IAACa;EAAD,CAA3B,GAAyC,IAD5C,eAEE;IAAK,SAAS,EAAEX,iBAAiB,GAAGY,cAAA,CAAMZ,iBAAT,GAA6B;EAA9D,gBACE;IAAK,SAAS,EAAEY,cAAA,CAAMW;EAAtB,gBACE,mDACOrB,cAAc,GAAG;IAAC,mBAAmBA;EAApB,CAAH,GAAyC,EAD9D,EAEOb,KAAK,IAAI,CAACa,cAAV,GAA2B;IAAC,mBAAoB,cAAaD,QAAS;EAA3C,CAA3B,GAA2E,EAFlF,EAGOE,SAAS,IAAI,CAACD,cAAd,IAAgC,CAACb,KAAjC,GAAyC;IAAC,cAAcc;EAAf,CAAzC,GAAqE,EAH5E;IAIE,IAAI,EAAC,UAJP;IAKE,EAAE,EAAEC,QALN;IAME,IAAI,EAAEd,IANR;IAOE,QAAQ,EAAEgB,YAPZ;IAQE,OAAO,EAAEd,KARX;IASE,QAAQ,EAAEa,UATZ;IAUE,SAAS,EAAEO,cAAA,CAAMY,QAVnB;IAWE,mBAAiBtB;EAXnB,GADF,eAcE;IAAO,OAAO,EAAEE,QAAhB;IAA0B,aAAU;EAApC,EAdF,CADF,CAFF,eAoBE;IAAK,SAAS,EAAE,CAACL,OAAD,GAAWa,cAAA,CAAMa,oBAAjB,GAAwC;EAAxD,GACG3B,aAAa,KAAK,OAAlB,GAA4B;IAACa;EAAD,CAA5B,GAA0C,IAD7C,EAEGZ,OAAO,gBAAG;IAAK,SAAS,EAAEa,cAAA,CAAMc;EAAtB,GAAmC3B,OAAnC,CAAH,GAAuD,IAFjE,CApBF,EAwBGc,eAxBH,CADF;AA4BD,CAhFD;;AAkFA1B,WAAW,CAACwC,SAAZ,2CAAwB;EACtBtC,KAAK,EAAEuC,kBAAA,CAAUC,MADK;EAEtBvC,IAAI,EAAEsC,kBAAA,CAAUC,MAFM;EAGtBtC,EAAE,EAAEqC,kBAAA,CAAUC,MAHQ;EAItBrC,KAAK,EAAEoC,kBAAA,CAAUE,IAJK;EAKtBrC,QAAQ,EAAEmC,kBAAA,CAAUE,IALE;EAMtBpC,QAAQ,EAAEkC,kBAAA,CAAUG,IANE;EAOtBpC,WAAW,EAAEiC,kBAAA,CAAUC,MAPD;EAQtB,mBAAmBD,kBAAA,CAAUC,MARP;EAStB,cAAcD,kBAAA,CAAUC,MATF;EAUtBjC,QAAQ,EAAEgC,kBAAA,CAAUE,IAVE;EAWtBhC,aAAa,EAAE8B,kBAAA,CAAUI,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CAXO;EAYtBnC,KAAK,EAAE+B,kBAAA,CAAUI,KAAV,CAAgB,CAAC,SAAD,EAAY,cAAZ,EAA4B,MAA5B,CAAhB,CAZe;EAatBjC,OAAO,EAAE6B,kBAAA,CAAUC,MAbG;EActB,aAAaD,kBAAA,CAAUC,MAdD;EAetB7B,iBAAiB,EAAE4B,kBAAA,CAAUE;AAfP,CAAxB;eAiBe3C,W"}

package/lib/atom/select/index.d.ts

@@ -69,6 +69,7 @@ declare namespace Select {
         modified: PropTypes.Requireable<boolean>;
         error: PropTypes.Requireable<boolean>;
         'aria-label': PropTypes.Requireable<string>;
+        'aria-labelledby': PropTypes.Requireable<string>;
     };
 }
 //# sourceMappingURL=index.d.ts.map

package/lib/atom/select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/select/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AA2DA,qEAqLC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/select/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAuDA,qEAwLC"}

package/lib/atom/select/index.js

@@ -67,9 +67,7 @@ const ArrowView = ({
   arrowClass,
   arrowColor
 }) => {
-  const props = (0, _react.useMemo)(() => _extends({}, ariaLabel & {
-    'aria-label': ariaLabel
-  }, arrowColor & {
+  const props = (0, _react.useMemo)(() => _extends({}, arrowColor & {
     color: arrowColor
   }, {
     className: arrowClass
@@ -100,7 +98,8 @@ const Select = (props, legacyContext) => {
     modified = false,
     error = false,
     title: propTitle,
-    'aria-label': ariaLabel
+    'aria-label': ariaLabel,
+    'aria-labelledby': ariaLabelledBy
   } = props;
   const skin = (0, _provider.GetSkinFromContext)(legacyContext);
   const title = (0, _react.useMemo)(() => propTitle ? `${propTitle}${required ? '*' : ''}` : null, [propTitle, required]);
@@ -175,10 +174,15 @@ const Select = (props, legacyContext) => {
     ariaLabel: ariaLabel,
     arrowClass: shouldUseSkinFontColor ? _style.default.selectedArrow : _style.default.arrow,
     arrowColor: isThemeOneOfQuestionTemplateOrPlayer ? arrowColor : black
-  }), /*#__PURE__*/_react.default.createElement("select", {
+  }), /*#__PURE__*/_react.default.createElement("select", _extends({}, ariaLabelledBy ? {
+    'aria-labelledby': ariaLabelledBy
+  } : {}, ariaLabel && !ariaLabelledBy ? {
+    'aria-label': ariaLabel
+  } : {}, ariaLabel ? {
+    title: ariaLabel
+  } : {}, {
     "data-name": "native-select",
     className: _style.default.selectBox,
-    title: selectedLabel,
     name: name,
     onChange: handleChange,
     value: selected,
@@ -191,7 +195,7 @@ const Select = (props, legacyContext) => {
     ,
     onMouseLeave: handleSelectOnBlur,
     "data-testid": "native-select"
-  }, optionList)), /*#__PURE__*/_react.default.createElement("div", {
+  }), optionList)), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.description
   }, description));
 };
@@ -226,7 +230,8 @@ Select.propTypes = process.env.NODE_ENV !== "production" ? {
   optgroups: _propTypes.default.arrayOf(_propTypes.default.shape(SelectOptionGroupPropTypes)),
   modified: _propTypes.default.bool,
   error: _propTypes.default.bool,
-  'aria-label': _propTypes.default.string
+  'aria-label': _propTypes.default.string,
+  'aria-labelledby': _propTypes.default.string
 } : {};
 var _default = Select;
 exports.default = _default;

package/lib/atom/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["themeStyle","filter","style","invalid","header","mooc","question","sort","thematiques","player","template","coorpmanager","ArrowView","shouldRender","isArrowUp","ariaLabel","arrowClass","arrowColor","props","useMemo","color","className","Select","legacyContext","name","options","optgroups","borderClassName","onChange","multiple","disabled","required","description","theme","modified","error","title","propTitle","skin","GetSkinFromContext","setIsArrowUp","useState","handleSelectOnFocus","useCallback","handleSelectOnBlur","selectOption","option","index","value","optionList","isEmpty","map","optgroup","label","i","titleView","selected","get","find","concat","flatMapDeep","selectedLabel","isSelectedInValidOption","getOr","validOption","handleChange","e","target","selectedOptions","black","isThemeOneOfQuestionTemplateOrPlayer","includes","shouldUseSkinFontColor","undefined","behaviorClassName","getClassState","default","composedClassName","classnames","unselected","labelSize","size","isLongLabel","selectWrapper","selectSpan","noLabelCommon","longLabel","selectedArrow","arrow","selectBox","SelectOptionPropTypes","PropTypes","string","isRequired","oneOfType","number","bool","SelectOptionGroupPropTypes","arrayOf","shape","contextTypes","Provider","childContextTypes","propTypes","func","oneOf","keys"],"sources":["../../../src/atom/select/index.js"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport concat from 'lodash/fp/concat';\nimport filter from 'lodash/fp/filter';\nimport find from 'lodash/fp/find';\nimport flatMapDeep from 'lodash/fp/flatMapDeep';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport includes from 'lodash/fp/includes';\nimport isEmpty from 'lodash/fp/isEmpty';\nimport keys from 'lodash/fp/keys';\nimport map from 'lodash/fp/map';\nimport size from 'lodash/fp/size';\nimport {\n  NovaCompositionNavigationArrowDown as ArrowDown,\n  NovaCompositionNavigationArrowTop as ArrowUp\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  filter: style.filter,\n  invalid: style.invalid,\n  header: style.header,\n  mooc: style.mooc,\n  question: style.question,\n  sort: style.sort,\n  thematiques: style.thematiques,\n  player: style.player,\n  template: style.template,\n  coorpmanager: null\n};\n\nconst ArrowView = ({shouldRender, isArrowUp, ariaLabel, arrowClass, arrowColor}) => {\n  const props = useMemo(\n    () => ({\n      ...(ariaLabel &\n        {\n          'aria-label': ariaLabel\n        }),\n      ...(arrowColor &\n        {\n          color: arrowColor\n        }),\n      className: arrowClass\n    }),\n    [ariaLabel, arrowClass, arrowColor]\n  );\n  if (shouldRender) {\n    return isArrowUp ? (\n      <ArrowUp {...props} data-testid=\"select-arrow-up-icon\" />\n    ) : (\n      <ArrowDown {...props} data-testid=\"select-arrow-down-icon\" />\n    );\n  } else return null;\n};\n\nconst Select = (props, legacyContext) => {\n  const {\n    name,\n    options = [],\n    optgroups = [],\n    className,\n    borderClassName,\n    onChange,\n    multiple = false,\n    disabled,\n    required,\n    description,\n    theme,\n    modified = false,\n    error = false,\n    title: propTitle,\n    'aria-label': ariaLabel\n  } = props;\n\n  const skin = GetSkinFromContext(legacyContext);\n  const title = useMemo(\n    () => (propTitle ? `${propTitle}${required ? '*' : ''}` : null),\n    [propTitle, required]\n  );\n\n  const [isArrowUp, setIsArrowUp] = useState(false);\n\n  const handleSelectOnFocus = useCallback(() => setIsArrowUp(true), []);\n  const handleSelectOnBlur = useCallback(() => setIsArrowUp(false), []);\n\n  const selectOption = (option, index) => {\n    return (\n      <option key={index} value={option.value} className={style.selectOption}>\n        {option.name}\n      </option>\n    );\n  };\n\n  const optionList = !isEmpty(options)\n    ? options.map((option, index) => selectOption(option, index))\n    : optgroups.map((optgroup, index) => {\n        return (\n          <optgroup key={index} label={optgroup.label}>\n            {optgroup.options && optgroup.options.map((option, i) => selectOption(option, i))}\n          </optgroup>\n        );\n      });\n\n  const titleView = title ? <span className={style.title}>{title} </span> : null;\n\n  const selected = useMemo(\n    () =>\n      multiple\n        ? map(get('value'), filter({selected: true}, options))\n        : get('value', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n  const selectedLabel = useMemo(\n    () =>\n      multiple\n        ? map(get('name'), filter({selected: true}, options))\n        : get('name', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n\n  const isSelectedInValidOption = useMemo(\n    () =>\n      theme === 'player' &&\n      getOr(false, 'name', find({validOption: false, selected: true}, options)),\n    [options, theme]\n  );\n\n  const handleChange = useMemo(\n    () =>\n      multiple\n        ? e => {\n            setIsArrowUp(false);\n            onChange(map(get('value'), e.target.selectedOptions));\n          }\n        : e => {\n            setIsArrowUp(false);\n            onChange(e.target.value);\n          },\n    [onChange, multiple]\n  );\n\n  const black = useMemo(() => getOr('#14171A', 'common.black', skin), [skin]);\n  const color = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n  const isThemeOneOfQuestionTemplateOrPlayer = useMemo(\n    () => includes(theme, ['question', 'template', 'player']),\n    [theme]\n  );\n  const shouldUseSkinFontColor = useMemo(\n    () => !isSelectedInValidOption && selected && isThemeOneOfQuestionTemplateOrPlayer,\n    [isSelectedInValidOption, selected, isThemeOneOfQuestionTemplateOrPlayer]\n  );\n  const arrowColor = selected ? color : undefined;\n\n  const behaviorClassName = useMemo(\n    () => getClassState(style.default, style.modified, style.error, modified, error),\n    [error, modified]\n  );\n  const composedClassName = useMemo(\n    () =>\n      classnames(\n        theme && theme !== 'coorpmanager' ? themeStyle[theme] : behaviorClassName,\n        selected ? style.selected : style.unselected,\n        className\n      ),\n    [behaviorClassName, className, selected, theme]\n  );\n\n  const labelSize = useMemo(() => size(selectedLabel), [selectedLabel]);\n\n  const isLongLabel = useMemo(() => labelSize >= 65, [labelSize]);\n\n  return (\n    <div\n      className={classnames(\n        composedClassName,\n        theme === 'coorpmanager' ? style.coorpmanager : null\n      )}\n    >\n      <label\n        data-name=\"select-wrapper\"\n        style={{\n          ...(shouldUseSkinFontColor && {\n            color\n          })\n        }}\n        className={style.selectWrapper}\n      >\n        {titleView}\n        <span\n          data-name=\"select-span\"\n          className={classnames(\n            style.selectSpan,\n            includes(theme, ['player', 'invalid', 'question', 'thematiques', 'template'])\n              ? style.noLabelCommon\n              : null,\n            borderClassName,\n            isLongLabel ? style.longLabel : null\n          )}\n          style={{\n            ...(shouldUseSkinFontColor && {\n              color\n            })\n          }}\n        >\n          {selectedLabel}\n        </span>\n        <ArrowView\n          shouldRender={!multiple}\n          isArrowUp={isArrowUp}\n          ariaLabel={ariaLabel}\n          arrowClass={shouldUseSkinFontColor ? style.selectedArrow : style.arrow}\n          arrowColor={isThemeOneOfQuestionTemplateOrPlayer ? arrowColor : black}\n        />\n        <select\n          data-name=\"native-select\"\n          className={style.selectBox}\n          title={selectedLabel}\n          name={name}\n          onChange={handleChange}\n          value={selected}\n          multiple={multiple}\n          disabled={disabled}\n          onClick={handleSelectOnFocus}\n          onBlur={handleSelectOnBlur}\n          // onBlur does not handle completely an out of bounds click\n          // ex: select is Opened and a click is done outside, cancelling the select\n          // that doesn't count as a Blur, so an onMouseLeave is needed\n          onMouseLeave={handleSelectOnBlur}\n          data-testid=\"native-select\"\n        >\n          {optionList}\n        </select>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nexport const SelectOptionPropTypes = {\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  selected: PropTypes.bool,\n  validOption: PropTypes.bool\n};\n\nexport const SelectOptionGroupPropTypes = {\n  label: PropTypes.string.isRequired,\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n};\n\nSelect.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nSelect.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  className: PropTypes.string,\n  borderClassName: PropTypes.string,\n  disabled: PropTypes.bool,\n  multiple: PropTypes.bool,\n  description: PropTypes.string,\n  required: PropTypes.bool,\n  onChange: PropTypes.func,\n  theme: PropTypes.oneOf(keys(themeStyle)),\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes)),\n  optgroups: PropTypes.arrayOf(PropTypes.shape(SelectOptionGroupPropTypes)),\n  modified: PropTypes.bool,\n  error: PropTypes.bool,\n  'aria-label': PropTypes.string\n};\n\nexport default Select;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["themeStyle","filter","style","invalid","header","mooc","question","sort","thematiques","player","template","coorpmanager","ArrowView","shouldRender","isArrowUp","ariaLabel","arrowClass","arrowColor","props","useMemo","color","className","Select","legacyContext","name","options","optgroups","borderClassName","onChange","multiple","disabled","required","description","theme","modified","error","title","propTitle","ariaLabelledBy","skin","GetSkinFromContext","setIsArrowUp","useState","handleSelectOnFocus","useCallback","handleSelectOnBlur","selectOption","option","index","value","optionList","isEmpty","map","optgroup","label","i","titleView","selected","get","find","concat","flatMapDeep","selectedLabel","isSelectedInValidOption","getOr","validOption","handleChange","e","target","selectedOptions","black","isThemeOneOfQuestionTemplateOrPlayer","includes","shouldUseSkinFontColor","undefined","behaviorClassName","getClassState","default","composedClassName","classnames","unselected","labelSize","size","isLongLabel","selectWrapper","selectSpan","noLabelCommon","longLabel","selectedArrow","arrow","selectBox","SelectOptionPropTypes","PropTypes","string","isRequired","oneOfType","number","bool","SelectOptionGroupPropTypes","arrayOf","shape","contextTypes","Provider","childContextTypes","propTypes","func","oneOf","keys"],"sources":["../../../src/atom/select/index.js"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport concat from 'lodash/fp/concat';\nimport filter from 'lodash/fp/filter';\nimport find from 'lodash/fp/find';\nimport flatMapDeep from 'lodash/fp/flatMapDeep';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport includes from 'lodash/fp/includes';\nimport isEmpty from 'lodash/fp/isEmpty';\nimport keys from 'lodash/fp/keys';\nimport map from 'lodash/fp/map';\nimport size from 'lodash/fp/size';\nimport {\n  NovaCompositionNavigationArrowDown as ArrowDown,\n  NovaCompositionNavigationArrowTop as ArrowUp\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  filter: style.filter,\n  invalid: style.invalid,\n  header: style.header,\n  mooc: style.mooc,\n  question: style.question,\n  sort: style.sort,\n  thematiques: style.thematiques,\n  player: style.player,\n  template: style.template,\n  coorpmanager: null\n};\n\nconst ArrowView = ({shouldRender, isArrowUp, ariaLabel, arrowClass, arrowColor}) => {\n  const props = useMemo(\n    () => ({\n      ...(arrowColor &\n        {\n          color: arrowColor\n        }),\n      className: arrowClass\n    }),\n    [ariaLabel, arrowClass, arrowColor]\n  );\n  if (shouldRender) {\n    return isArrowUp ? (\n      <ArrowUp {...props} data-testid=\"select-arrow-up-icon\" />\n    ) : (\n      <ArrowDown {...props} data-testid=\"select-arrow-down-icon\" />\n    );\n  } else return null;\n};\n\nconst Select = (props, legacyContext) => {\n  const {\n    name,\n    options = [],\n    optgroups = [],\n    className,\n    borderClassName,\n    onChange,\n    multiple = false,\n    disabled,\n    required,\n    description,\n    theme,\n    modified = false,\n    error = false,\n    title: propTitle,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy\n  } = props;\n\n  const skin = GetSkinFromContext(legacyContext);\n  const title = useMemo(\n    () => (propTitle ? `${propTitle}${required ? '*' : ''}` : null),\n    [propTitle, required]\n  );\n\n  const [isArrowUp, setIsArrowUp] = useState(false);\n\n  const handleSelectOnFocus = useCallback(() => setIsArrowUp(true), []);\n  const handleSelectOnBlur = useCallback(() => setIsArrowUp(false), []);\n\n  const selectOption = (option, index) => {\n    return (\n      <option key={index} value={option.value} className={style.selectOption}>\n        {option.name}\n      </option>\n    );\n  };\n\n  const optionList = !isEmpty(options)\n    ? options.map((option, index) => selectOption(option, index))\n    : optgroups.map((optgroup, index) => {\n        return (\n          <optgroup key={index} label={optgroup.label}>\n            {optgroup.options && optgroup.options.map((option, i) => selectOption(option, i))}\n          </optgroup>\n        );\n      });\n\n  const titleView = title ? <span className={style.title}>{title} </span> : null;\n\n  const selected = useMemo(\n    () =>\n      multiple\n        ? map(get('value'), filter({selected: true}, options))\n        : get('value', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n  const selectedLabel = useMemo(\n    () =>\n      multiple\n        ? map(get('name'), filter({selected: true}, options))\n        : get('name', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n\n  const isSelectedInValidOption = useMemo(\n    () =>\n      theme === 'player' &&\n      getOr(false, 'name', find({validOption: false, selected: true}, options)),\n    [options, theme]\n  );\n\n  const handleChange = useMemo(\n    () =>\n      multiple\n        ? e => {\n            setIsArrowUp(false);\n            onChange(map(get('value'), e.target.selectedOptions));\n          }\n        : e => {\n            setIsArrowUp(false);\n            onChange(e.target.value);\n          },\n    [onChange, multiple]\n  );\n\n  const black = useMemo(() => getOr('#14171A', 'common.black', skin), [skin]);\n  const color = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n  const isThemeOneOfQuestionTemplateOrPlayer = useMemo(\n    () => includes(theme, ['question', 'template', 'player']),\n    [theme]\n  );\n  const shouldUseSkinFontColor = useMemo(\n    () => !isSelectedInValidOption && selected && isThemeOneOfQuestionTemplateOrPlayer,\n    [isSelectedInValidOption, selected, isThemeOneOfQuestionTemplateOrPlayer]\n  );\n  const arrowColor = selected ? color : undefined;\n\n  const behaviorClassName = useMemo(\n    () => getClassState(style.default, style.modified, style.error, modified, error),\n    [error, modified]\n  );\n  const composedClassName = useMemo(\n    () =>\n      classnames(\n        theme && theme !== 'coorpmanager' ? themeStyle[theme] : behaviorClassName,\n        selected ? style.selected : style.unselected,\n        className\n      ),\n    [behaviorClassName, className, selected, theme]\n  );\n\n  const labelSize = useMemo(() => size(selectedLabel), [selectedLabel]);\n\n  const isLongLabel = useMemo(() => labelSize >= 65, [labelSize]);\n\n  return (\n    <div\n      className={classnames(\n        composedClassName,\n        theme === 'coorpmanager' ? style.coorpmanager : null\n      )}\n    >\n      <label\n        data-name=\"select-wrapper\"\n        style={{\n          ...(shouldUseSkinFontColor && {\n            color\n          })\n        }}\n        className={style.selectWrapper}\n      >\n        {titleView}\n        <span\n          data-name=\"select-span\"\n          className={classnames(\n            style.selectSpan,\n            includes(theme, ['player', 'invalid', 'question', 'thematiques', 'template'])\n              ? style.noLabelCommon\n              : null,\n            borderClassName,\n            isLongLabel ? style.longLabel : null\n          )}\n          style={{\n            ...(shouldUseSkinFontColor && {\n              color\n            })\n          }}\n        >\n          {selectedLabel}\n        </span>\n        <ArrowView\n          shouldRender={!multiple}\n          isArrowUp={isArrowUp}\n          ariaLabel={ariaLabel}\n          arrowClass={shouldUseSkinFontColor ? style.selectedArrow : style.arrow}\n          arrowColor={isThemeOneOfQuestionTemplateOrPlayer ? arrowColor : black}\n        />\n        <select\n          {...(ariaLabelledBy ? {'aria-labelledby': ariaLabelledBy} : {})}\n          {...(ariaLabel && !ariaLabelledBy ? {'aria-label': ariaLabel} : {})}\n          {...(ariaLabel ? {title: ariaLabel} : {})}\n          data-name=\"native-select\"\n          className={style.selectBox}\n          name={name}\n          onChange={handleChange}\n          value={selected}\n          multiple={multiple}\n          disabled={disabled}\n          onClick={handleSelectOnFocus}\n          onBlur={handleSelectOnBlur}\n          // onBlur does not handle completely an out of bounds click\n          // ex: select is Opened and a click is done outside, cancelling the select\n          // that doesn't count as a Blur, so an onMouseLeave is needed\n          onMouseLeave={handleSelectOnBlur}\n          data-testid=\"native-select\"\n        >\n          {optionList}\n        </select>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nexport const SelectOptionPropTypes = {\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  selected: PropTypes.bool,\n  validOption: PropTypes.bool\n};\n\nexport const SelectOptionGroupPropTypes = {\n  label: PropTypes.string.isRequired,\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n};\n\nSelect.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nSelect.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  className: PropTypes.string,\n  borderClassName: PropTypes.string,\n  disabled: PropTypes.bool,\n  multiple: PropTypes.bool,\n  description: PropTypes.string,\n  required: PropTypes.bool,\n  onChange: PropTypes.func,\n  theme: PropTypes.oneOf(keys(themeStyle)),\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes)),\n  optgroups: PropTypes.arrayOf(PropTypes.shape(SelectOptionGroupPropTypes)),\n  modified: PropTypes.bool,\n  error: PropTypes.bool,\n  'aria-label': PropTypes.string,\n  'aria-labelledby': PropTypes.string\n};\n\nexport default Select;\n"],"mappings":"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"}

package/lib/molecule/brand-form-group/index.d.ts

@@ -56,6 +56,8 @@ declare namespace BrandFormGroup {
             disabled: PropTypes.Requireable<boolean>;
             onChange: PropTypes.Requireable<(...args: any[]) => any>;
             description: PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
+            'aria-label': PropTypes.Requireable<string>;
             modified: PropTypes.Requireable<boolean>;
             titlePosition: PropTypes.Requireable<string>;
             theme: PropTypes.Requireable<string>;
@@ -109,6 +111,7 @@ declare namespace BrandFormGroup {
             modified: PropTypes.Requireable<boolean>;
             error: PropTypes.Requireable<boolean>;
             'aria-label': PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
         }> | PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             title: PropTypes.Validator<string>;
@@ -188,6 +191,8 @@ declare namespace BrandFormGroup {
                     disabled: PropTypes.Requireable<boolean>;
                     onChange: PropTypes.Requireable<(...args: any[]) => any>;
                     description: PropTypes.Requireable<string>;
+                    'aria-labelledby': PropTypes.Requireable<string>;
+                    'aria-label': PropTypes.Requireable<string>;
                     modified: PropTypes.Requireable<boolean>;
                     titlePosition: PropTypes.Requireable<string>;
                     theme: PropTypes.Requireable<string>;
@@ -224,6 +229,7 @@ declare namespace BrandFormGroup {
                     modified: PropTypes.Requireable<boolean>;
                     error: PropTypes.Requireable<boolean>;
                     'aria-label': PropTypes.Requireable<string>;
+                    'aria-labelledby': PropTypes.Requireable<string>;
                 }> | PropTypes.InferProps<{
                     type: PropTypes.Requireable<string>;
                     title: PropTypes.Validator<string>;
@@ -328,6 +334,8 @@ declare namespace BrandFormGroup {
                     disabled: PropTypes.Requireable<boolean>;
                     onChange: PropTypes.Requireable<(...args: any[]) => any>;
                     description: PropTypes.Requireable<string>;
+                    'aria-labelledby': PropTypes.Requireable<string>;
+                    'aria-label': PropTypes.Requireable<string>;
                     modified: PropTypes.Requireable<boolean>;
                     titlePosition: PropTypes.Requireable<string>;
                     theme: PropTypes.Requireable<string>;

package/lib/molecule/cm-popin/types.d.ts

@@ -41,6 +41,8 @@ declare const propTypes: {
         disabled: PropTypes.Requireable<boolean>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         description: PropTypes.Requireable<string>;
+        'aria-labelledby': PropTypes.Requireable<string>;
+        'aria-label': PropTypes.Requireable<string>;
         modified: PropTypes.Requireable<boolean>;
         titlePosition: PropTypes.Requireable<string>;
         theme: PropTypes.Requireable<string>;

package/lib/molecule/cm-popin/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCd,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;CAChC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCd,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;CAChC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/molecule/draggable-list/index.d.ts

@@ -18,6 +18,8 @@ declare namespace DraggableList {
                 disabled: PropTypes.Requireable<boolean>;
                 onChange: PropTypes.Requireable<(...args: any[]) => any>;
                 description: PropTypes.Requireable<string>;
+                'aria-labelledby': PropTypes.Requireable<string>;
+                'aria-label': PropTypes.Requireable<string>;
                 modified: PropTypes.Requireable<boolean>;
                 titlePosition: PropTypes.Requireable<string>;
                 theme: PropTypes.Requireable<string>;

package/lib/molecule/filters/filters-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filters-wrapper.d.ts","sourceRoot":"","sources":["../../../src/molecule/filters/filters-wrapper.js"],"names":[],"mappings":";AAUA,sEA6DC"}
+{"version":3,"file":"filters-wrapper.d.ts","sourceRoot":"","sources":["../../../src/molecule/filters/filters-wrapper.js"],"names":[],"mappings":";AAUA,sEA+DC"}

package/lib/molecule/filters/filters-wrapper.js

@@ -80,10 +80,13 @@ const FiltersWapper = (props, context) => {
           className: _filtersWapper.default.choice,
           key: idx
         }, /*#__PURE__*/_react.default.createElement("p", {
+          id: `title-id-${idx}`,
           className: _filtersWapper.default.title
         }, filter.title), /*#__PURE__*/_react.default.createElement("div", {
           className: _filtersWapper.default.toggle
-        }, /*#__PURE__*/_react.default.createElement(_inputSwitch.default, filter.display)));
+        }, /*#__PURE__*/_react.default.createElement(_inputSwitch.default, _extends({}, filter.display, {
+          "aria-labelledby": `titleId-${idx}`
+        }))));
 
       default:
         return null;

package/lib/molecule/filters/filters-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"filters-wrapper.js","names":["FiltersWapper","props","context","filters","className","filterGroupAriaLabel","buildFilter","filter","idx","type","fieldName","style","choice","title","radioGroup","timerWrapper","timerSubtitle","subtitle","toggle","display","filtersList","convert","cap","emptyFilters","classnames","wrapperNone","wrapper","propTypes","PropTypes","string","arrayOf","shape","oneOf","isRequired"],"sources":["../../../src/molecule/filters/filters-wrapper.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, map} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Select from '../../atom/select';\nimport InputSwitch from '../../atom/input-switch';\nimport RadioGroup from '../../atom/radio-group';\nimport RangeSlider from '../../atom/range';\nimport style from './filters-wapper.css';\n\nconst FiltersWapper = (props, context) => {\n  const {filters, className, filterGroupAriaLabel} = props;\n\n  const buildFilter = (filter, idx) => {\n    const {type, fieldName} = filter;\n    switch (type) {\n      case 'select':\n        return (\n          <div data-name=\"choice\" data-filter-type={fieldName} className={style.choice} key={idx}>\n            <Select {...filter} />\n          </div>\n        );\n      case 'radio':\n        return (\n          <div data-name=\"choice\" data-filter-type={fieldName} className={style.choice} key={idx}>\n            <p className={style.title}>{filter.title}</p>\n            <RadioGroup {...filter} className={style.radioGroup} />\n          </div>\n        );\n      case 'range':\n        return (\n          <div\n            data-name=\"choice\"\n            data-filter-type={fieldName}\n            className={style.timerWrapper}\n            key={idx}\n          >\n            <label>\n              <span className={style.title}>{filter.title}</span>\n              <p className={style.timerSubtitle}>{filter.subtitle}</p>\n              <RangeSlider {...filter} />\n            </label>\n          </div>\n        );\n      case 'switch':\n        return (\n          <div data-name=\"choice\" data-filter-type={fieldName} className={style.choice} key={idx}>\n            <p className={style.title}>{filter.title}</p>\n            <div className={style.toggle}>\n              <InputSwitch {...filter.display} />\n            </div>\n          </div>\n        );\n      default:\n        return null;\n    }\n  };\n\n  const filtersList = map.convert({cap: false})(buildFilter, filters);\n  const emptyFilters = isEmpty(filters);\n  return (\n    <form>\n      <div\n        className={classnames(className, emptyFilters ? style.wrapperNone : style.wrapper)}\n        role=\"group\"\n        aria-label={filterGroupAriaLabel}\n      >\n        {filtersList}\n      </div>\n    </form>\n  );\n};\n\nFiltersWapper.propTypes = {\n  className: PropTypes.string,\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      type: PropTypes.oneOf(['select', 'range', 'radio', 'switch']).isRequired,\n      fieldName: PropTypes.string.isRequired\n    })\n  ),\n  filterGroupAriaLabel: PropTypes.string\n};\nexport default FiltersWapper;\n"],"mappings":"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"}
+{"version":3,"file":"filters-wrapper.js","names":["FiltersWapper","props","context","filters","className","filterGroupAriaLabel","buildFilter","filter","idx","type","fieldName","style","choice","title","radioGroup","timerWrapper","timerSubtitle","subtitle","toggle","display","filtersList","convert","cap","emptyFilters","classnames","wrapperNone","wrapper","propTypes","PropTypes","string","arrayOf","shape","oneOf","isRequired"],"sources":["../../../src/molecule/filters/filters-wrapper.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, map} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Select from '../../atom/select';\nimport InputSwitch from '../../atom/input-switch';\nimport RadioGroup from '../../atom/radio-group';\nimport RangeSlider from '../../atom/range';\nimport style from './filters-wapper.css';\n\nconst FiltersWapper = (props, context) => {\n  const {filters, className, filterGroupAriaLabel} = props;\n\n  const buildFilter = (filter, idx) => {\n    const {type, fieldName} = filter;\n    switch (type) {\n      case 'select':\n        return (\n          <div data-name=\"choice\" data-filter-type={fieldName} className={style.choice} key={idx}>\n            <Select {...filter} />\n          </div>\n        );\n      case 'radio':\n        return (\n          <div data-name=\"choice\" data-filter-type={fieldName} className={style.choice} key={idx}>\n            <p className={style.title}>{filter.title}</p>\n            <RadioGroup {...filter} className={style.radioGroup} />\n          </div>\n        );\n      case 'range':\n        return (\n          <div\n            data-name=\"choice\"\n            data-filter-type={fieldName}\n            className={style.timerWrapper}\n            key={idx}\n          >\n            <label>\n              <span className={style.title}>{filter.title}</span>\n              <p className={style.timerSubtitle}>{filter.subtitle}</p>\n              <RangeSlider {...filter} />\n            </label>\n          </div>\n        );\n      case 'switch':\n        return (\n          <div data-name=\"choice\" data-filter-type={fieldName} className={style.choice} key={idx}>\n            <p id={`title-id-${idx}`} className={style.title}>\n              {filter.title}\n            </p>\n            <div className={style.toggle}>\n              <InputSwitch {...filter.display} aria-labelledby={`titleId-${idx}`} />\n            </div>\n          </div>\n        );\n      default:\n        return null;\n    }\n  };\n\n  const filtersList = map.convert({cap: false})(buildFilter, filters);\n  const emptyFilters = isEmpty(filters);\n  return (\n    <form>\n      <div\n        className={classnames(className, emptyFilters ? style.wrapperNone : style.wrapper)}\n        role=\"group\"\n        aria-label={filterGroupAriaLabel}\n      >\n        {filtersList}\n      </div>\n    </form>\n  );\n};\n\nFiltersWapper.propTypes = {\n  className: PropTypes.string,\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      type: PropTypes.oneOf(['select', 'range', 'radio', 'switch']).isRequired,\n      fieldName: PropTypes.string.isRequired\n    })\n  ),\n  filterGroupAriaLabel: PropTypes.string\n};\nexport default FiltersWapper;\n"],"mappings":"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"}

package/lib/molecule/filters/index.d.ts

@@ -40,6 +40,7 @@ declare class Filters extends React.Component<any, any, any> {
             modified: PropTypes.Requireable<boolean>;
             error: PropTypes.Requireable<boolean>;
             'aria-label': PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
         }>>;
         onSearch: PropTypes.Requireable<(...args: any[]) => any>;
         onToggleFilters: PropTypes.Requireable<(...args: any[]) => any>;
@@ -47,6 +48,7 @@ declare class Filters extends React.Component<any, any, any> {
         moreSortAriaLabel: PropTypes.Requireable<string>;
         moreFilterAriaLabel: PropTypes.Requireable<string>;
         filterGroupAriaLabel: PropTypes.Requireable<string>;
+        sortAriaLabel: PropTypes.Requireable<string>;
     };
     static contextTypes: {
         skin: PropTypes.Requireable<PropTypes.InferProps<{

package/lib/molecule/filters/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/filters/index.js"],"names":[],"mappings":";AASA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAeE;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,wBASC;IAPC;;;MAGC;IAMH,yBAcC;IAED,uBAYC;IAED,qBAOC;IAED,sBA2FC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/filters/index.js"],"names":[],"mappings":";AASA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAgBE;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,wBASC;IAPC;;;MAGC;IAMH,yBAcC;IAED,uBAYC;IAED,qBAOC;IAED,sBA4FC;CACF"}

package/lib/molecule/filters/index.js

@@ -21,6 +21,8 @@ var _filtersWrapper = _interopRequireDefault(require("./filters-wrapper"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 class Filters extends _react.default.Component {
   constructor(props) {
     super(props);
@@ -87,7 +89,8 @@ class Filters extends _react.default.Component {
       filters,
       moreFilterAriaLabel,
       moreSortAriaLabel,
-      filterGroupAriaLabel
+      filterGroupAriaLabel,
+      sortAriaLabel
     } = this.props;
     const {
       filter,
@@ -103,7 +106,9 @@ class Filters extends _react.default.Component {
     const sortView = sorting !== undefined ? /*#__PURE__*/_react.default.createElement("div", {
       "data-name": "choice",
       className: _style.default.select
-    }, /*#__PURE__*/_react.default.createElement(_select.default, sorting)) : null;
+    }, /*#__PURE__*/_react.default.createElement(_select.default, _extends({}, sorting, {
+      "aria-label": sortAriaLabel
+    }))) : null;
     return /*#__PURE__*/_react.default.createElement("div", {
       "data-name": "search",
       className: _style.default.search
@@ -181,7 +186,8 @@ Filters.propTypes = process.env.NODE_ENV !== "production" ? {
   onToggleSorts: _propTypes.default.func,
   moreSortAriaLabel: _propTypes.default.string,
   moreFilterAriaLabel: _propTypes.default.string,
-  filterGroupAriaLabel: _propTypes.default.string
+  filterGroupAriaLabel: _propTypes.default.string,
+  sortAriaLabel: _propTypes.default.string
 } : {};
 var _default = Filters;
 exports.default = _default;

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Filters","React","Component","constructor","props","state","filter","openFilters","sorted","openSorts","handleOpenFilter","bind","handleOpenSort","handleSearch","onToggleFilters","newValue","setState","onToggleSorts","onSearch","render","sorting","filterCTALabel","filterTabLabel","sortCTALabel","sortTabLabel","filters","moreFilterAriaLabel","moreSortAriaLabel","filterGroupAriaLabel","skin","context","defaultColor","darkColor","filtersActive","sortingActive","sortView","undefined","style","select","search","activeDefault","default","title","arrow","activeWrapperSortBy","wrapperSortBy","activeWrapperFilters","wrapperFilters","wrapper","CTAfilter","backgroundColor","activeSorting","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","bool","FiltersWrapper","shape","Select","func"],"sources":["../../../src/molecule/filters/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport Select from '../../atom/select';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\nimport FiltersWrapper from './filters-wrapper';\n\nclass Filters extends React.Component {\n  static propTypes = {\n    filterCTALabel: PropTypes.string,\n    filterTabLabel: PropTypes.string,\n    sortCTALabel: PropTypes.string,\n    sortTabLabel: PropTypes.string,\n    openFilters: PropTypes.bool,\n    openSorts: PropTypes.bool,\n    filters: FiltersWrapper.propTypes.filters,\n    sorting: PropTypes.shape(Select.propTypes),\n    onSearch: PropTypes.func,\n    onToggleFilters: PropTypes.func,\n    onToggleSorts: PropTypes.func,\n    moreSortAriaLabel: PropTypes.string,\n    moreFilterAriaLabel: PropTypes.string,\n    filterGroupAriaLabel: PropTypes.string\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      filter: !!props.openFilters,\n      sorted: !!props.openSorts\n    };\n    this.handleOpenFilter = this.handleOpenFilter.bind(this);\n    this.handleOpenSort = this.handleOpenSort.bind(this);\n    this.handleSearch = this.handleSearch.bind(this);\n  }\n\n  handleOpenFilter() {\n    const {filter} = this.state;\n    const {onToggleFilters} = this.props;\n\n    const newValue = !filter;\n\n    this.setState({\n      filter: newValue,\n      sorted: false\n    });\n\n    if (onToggleFilters) {\n      onToggleFilters(newValue);\n    }\n  }\n\n  handleOpenSort() {\n    const {sorted} = this.state;\n    const {onToggleSorts} = this.props;\n\n    const newValue = !sorted;\n\n    this.setState({\n      sorted: newValue,\n      filter: false\n    });\n\n    if (onToggleSorts) onToggleSorts(newValue);\n  }\n\n  handleSearch() {\n    const {onSearch} = this.props;\n    this.setState({\n      sorted: false,\n      filter: false\n    });\n    if (onSearch) onSearch();\n  }\n\n  render() {\n    const {\n      sorting,\n      filterCTALabel,\n      filterTabLabel,\n      sortCTALabel,\n      sortTabLabel,\n      filters,\n      moreFilterAriaLabel,\n      moreSortAriaLabel,\n      filterGroupAriaLabel\n    } = this.props;\n    const {filter, sorted} = this.state;\n    const {skin} = this.context;\n\n    const defaultColor = get('common.primary', skin);\n    const darkColor = get('common.dark', skin);\n    const filtersActive = filter === true;\n    const sortingActive = sorted === true;\n\n    const sortView =\n      sorting !== undefined ? (\n        <div data-name=\"choice\" className={style.select}>\n          <Select {...sorting} />\n        </div>\n      ) : null;\n\n    return (\n      <div data-name=\"search\" className={style.search}>\n        <div\n          data-name=\"filter\"\n          data-open={filtersActive}\n          className={filtersActive ? style.activeDefault : style.default}\n        >\n          <div className={style.title} data-name=\"filterButton\" onClick={this.handleOpenFilter}>\n            {filterTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} aria-label={moreFilterAriaLabel} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"sortBy\"\n          data-open={sortingActive}\n          className={sortingActive ? style.activeWrapperSortBy : style.wrapperSortBy}\n        >\n          <div className={style.title} data-name=\"sortButton\" onClick={this.handleOpenSort}>\n            {sortTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} aria-label={moreSortAriaLabel} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"filterWrapper\"\n          className={filtersActive ? style.activeWrapperFilters : style.wrapperFilters}\n        >\n          <FiltersWrapper\n            className={style.wrapper}\n            filters={filters}\n            filterGroupAriaLabel={filterGroupAriaLabel}\n          />\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {filterCTALabel}\n          </div>\n        </div>\n        <div\n          data-name=\"sortWrapper\"\n          className={sortingActive ? style.activeSorting : style.sorting}\n        >\n          {sortView}\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {sortCTALabel}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default Filters;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Filters","React","Component","constructor","props","state","filter","openFilters","sorted","openSorts","handleOpenFilter","bind","handleOpenSort","handleSearch","onToggleFilters","newValue","setState","onToggleSorts","onSearch","render","sorting","filterCTALabel","filterTabLabel","sortCTALabel","sortTabLabel","filters","moreFilterAriaLabel","moreSortAriaLabel","filterGroupAriaLabel","sortAriaLabel","skin","context","defaultColor","darkColor","filtersActive","sortingActive","sortView","undefined","style","select","search","activeDefault","default","title","arrow","activeWrapperSortBy","wrapperSortBy","activeWrapperFilters","wrapperFilters","wrapper","CTAfilter","backgroundColor","activeSorting","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","bool","FiltersWrapper","shape","Select","func"],"sources":["../../../src/molecule/filters/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport Select from '../../atom/select';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\nimport FiltersWrapper from './filters-wrapper';\n\nclass Filters extends React.Component {\n  static propTypes = {\n    filterCTALabel: PropTypes.string,\n    filterTabLabel: PropTypes.string,\n    sortCTALabel: PropTypes.string,\n    sortTabLabel: PropTypes.string,\n    openFilters: PropTypes.bool,\n    openSorts: PropTypes.bool,\n    filters: FiltersWrapper.propTypes.filters,\n    sorting: PropTypes.shape(Select.propTypes),\n    onSearch: PropTypes.func,\n    onToggleFilters: PropTypes.func,\n    onToggleSorts: PropTypes.func,\n    moreSortAriaLabel: PropTypes.string,\n    moreFilterAriaLabel: PropTypes.string,\n    filterGroupAriaLabel: PropTypes.string,\n    sortAriaLabel: PropTypes.string\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      filter: !!props.openFilters,\n      sorted: !!props.openSorts\n    };\n    this.handleOpenFilter = this.handleOpenFilter.bind(this);\n    this.handleOpenSort = this.handleOpenSort.bind(this);\n    this.handleSearch = this.handleSearch.bind(this);\n  }\n\n  handleOpenFilter() {\n    const {filter} = this.state;\n    const {onToggleFilters} = this.props;\n\n    const newValue = !filter;\n\n    this.setState({\n      filter: newValue,\n      sorted: false\n    });\n\n    if (onToggleFilters) {\n      onToggleFilters(newValue);\n    }\n  }\n\n  handleOpenSort() {\n    const {sorted} = this.state;\n    const {onToggleSorts} = this.props;\n\n    const newValue = !sorted;\n\n    this.setState({\n      sorted: newValue,\n      filter: false\n    });\n\n    if (onToggleSorts) onToggleSorts(newValue);\n  }\n\n  handleSearch() {\n    const {onSearch} = this.props;\n    this.setState({\n      sorted: false,\n      filter: false\n    });\n    if (onSearch) onSearch();\n  }\n\n  render() {\n    const {\n      sorting,\n      filterCTALabel,\n      filterTabLabel,\n      sortCTALabel,\n      sortTabLabel,\n      filters,\n      moreFilterAriaLabel,\n      moreSortAriaLabel,\n      filterGroupAriaLabel,\n      sortAriaLabel\n    } = this.props;\n    const {filter, sorted} = this.state;\n    const {skin} = this.context;\n\n    const defaultColor = get('common.primary', skin);\n    const darkColor = get('common.dark', skin);\n    const filtersActive = filter === true;\n    const sortingActive = sorted === true;\n\n    const sortView =\n      sorting !== undefined ? (\n        <div data-name=\"choice\" className={style.select}>\n          <Select {...sorting} aria-label={sortAriaLabel} />\n        </div>\n      ) : null;\n\n    return (\n      <div data-name=\"search\" className={style.search}>\n        <div\n          data-name=\"filter\"\n          data-open={filtersActive}\n          className={filtersActive ? style.activeDefault : style.default}\n        >\n          <div className={style.title} data-name=\"filterButton\" onClick={this.handleOpenFilter}>\n            {filterTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} aria-label={moreFilterAriaLabel} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"sortBy\"\n          data-open={sortingActive}\n          className={sortingActive ? style.activeWrapperSortBy : style.wrapperSortBy}\n        >\n          <div className={style.title} data-name=\"sortButton\" onClick={this.handleOpenSort}>\n            {sortTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} aria-label={moreSortAriaLabel} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"filterWrapper\"\n          className={filtersActive ? style.activeWrapperFilters : style.wrapperFilters}\n        >\n          <FiltersWrapper\n            className={style.wrapper}\n            filters={filters}\n            filterGroupAriaLabel={filterGroupAriaLabel}\n          />\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {filterCTALabel}\n          </div>\n        </div>\n        <div\n          data-name=\"sortWrapper\"\n          className={sortingActive ? style.activeSorting : style.sorting}\n        >\n          {sortView}\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {sortCTALabel}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default Filters;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,OAAN,SAAsBC,cAAA,CAAMC,SAA5B,CAAsC;EAuBpCC,WAAW,CAACC,KAAD,EAAQ;IACjB,MAAMA,KAAN;IACA,KAAKC,KAAL,GAAa;MACXC,MAAM,EAAE,CAAC,CAACF,KAAK,CAACG,WADL;MAEXC,MAAM,EAAE,CAAC,CAACJ,KAAK,CAACK;IAFL,CAAb;IAIA,KAAKC,gBAAL,GAAwB,KAAKA,gBAAL,CAAsBC,IAAtB,CAA2B,IAA3B,CAAxB;IACA,KAAKC,cAAL,GAAsB,KAAKA,cAAL,CAAoBD,IAApB,CAAyB,IAAzB,CAAtB;IACA,KAAKE,YAAL,GAAoB,KAAKA,YAAL,CAAkBF,IAAlB,CAAuB,IAAvB,CAApB;EACD;;EAEDD,gBAAgB,GAAG;IACjB,MAAM;MAACJ;IAAD,IAAW,KAAKD,KAAtB;IACA,MAAM;MAACS;IAAD,IAAoB,KAAKV,KAA/B;IAEA,MAAMW,QAAQ,GAAG,CAACT,MAAlB;IAEA,KAAKU,QAAL,CAAc;MACZV,MAAM,EAAES,QADI;MAEZP,MAAM,EAAE;IAFI,CAAd;;IAKA,IAAIM,eAAJ,EAAqB;MACnBA,eAAe,CAACC,QAAD,CAAf;IACD;EACF;;EAEDH,cAAc,GAAG;IACf,MAAM;MAACJ;IAAD,IAAW,KAAKH,KAAtB;IACA,MAAM;MAACY;IAAD,IAAkB,KAAKb,KAA7B;IAEA,MAAMW,QAAQ,GAAG,CAACP,MAAlB;IAEA,KAAKQ,QAAL,CAAc;MACZR,MAAM,EAAEO,QADI;MAEZT,MAAM,EAAE;IAFI,CAAd;IAKA,IAAIW,aAAJ,EAAmBA,aAAa,CAACF,QAAD,CAAb;EACpB;;EAEDF,YAAY,GAAG;IACb,MAAM;MAACK;IAAD,IAAa,KAAKd,KAAxB;IACA,KAAKY,QAAL,CAAc;MACZR,MAAM,EAAE,KADI;MAEZF,MAAM,EAAE;IAFI,CAAd;IAIA,IAAIY,QAAJ,EAAcA,QAAQ;EACvB;;EAEDC,MAAM,GAAG;IACP,MAAM;MACJC,OADI;MAEJC,cAFI;MAGJC,cAHI;MAIJC,YAJI;MAKJC,YALI;MAMJC,OANI;MAOJC,mBAPI;MAQJC,iBARI;MASJC,oBATI;MAUJC;IAVI,IAWF,KAAKzB,KAXT;IAYA,MAAM;MAACE,MAAD;MAASE;IAAT,IAAmB,KAAKH,KAA9B;IACA,MAAM;MAACyB;IAAD,IAAS,KAAKC,OAApB;IAEA,MAAMC,YAAY,GAAG,mBAAI,gBAAJ,EAAsBF,IAAtB,CAArB;IACA,MAAMG,SAAS,GAAG,mBAAI,aAAJ,EAAmBH,IAAnB,CAAlB;IACA,MAAMI,aAAa,GAAG5B,MAAM,KAAK,IAAjC;IACA,MAAM6B,aAAa,GAAG3B,MAAM,KAAK,IAAjC;IAEA,MAAM4B,QAAQ,GACZhB,OAAO,KAAKiB,SAAZ,gBACE;MAAK,aAAU,QAAf;MAAwB,SAAS,EAAEC,cAAA,CAAMC;IAAzC,gBACE,6BAAC,eAAD,eAAYnB,OAAZ;MAAqB,cAAYS;IAAjC,GADF,CADF,GAII,IALN;IAOA,oBACE;MAAK,aAAU,QAAf;MAAwB,SAAS,EAAES,cAAA,CAAME;IAAzC,gBACE;MACE,aAAU,QADZ;MAEE,aAAWN,aAFb;MAGE,SAAS,EAAEA,aAAa,GAAGI,cAAA,CAAMG,aAAT,GAAyBH,cAAA,CAAMI;IAHzD,gBAKE;MAAK,SAAS,EAAEJ,cAAA,CAAMK,KAAtB;MAA6B,aAAU,cAAvC;MAAsD,OAAO,EAAE,KAAKjC;IAApE,GACGY,cADH,eAEE;MAAK,SAAS,EAAEgB,cAAA,CAAMM;IAAtB,gBACE,6BAAC,6CAAD;MAAW,KAAK,EAAEX,SAAlB;MAA6B,MAAM,EAAE,EAArC;MAAyC,cAAYP;IAArD,EADF,CAFF,CALF,CADF,eAaE;MACE,aAAU,QADZ;MAEE,aAAWS,aAFb;MAGE,SAAS,EAAEA,aAAa,GAAGG,cAAA,CAAMO,mBAAT,GAA+BP,cAAA,CAAMQ;IAH/D,gBAKE;MAAK,SAAS,EAAER,cAAA,CAAMK,KAAtB;MAA6B,aAAU,YAAvC;MAAoD,OAAO,EAAE,KAAK/B;IAAlE,GACGY,YADH,eAEE;MAAK,SAAS,EAAEc,cAAA,CAAMM;IAAtB,gBACE,6BAAC,6CAAD;MAAW,KAAK,EAAEX,SAAlB;MAA6B,MAAM,EAAE,EAArC;MAAyC,cAAYN;IAArD,EADF,CAFF,CALF,CAbF,eAyBE;MACE,aAAU,eADZ;MAEE,SAAS,EAAEO,aAAa,GAAGI,cAAA,CAAMS,oBAAT,GAAgCT,cAAA,CAAMU;IAFhE,gBAIE,6BAAC,uBAAD;MACE,SAAS,EAAEV,cAAA,CAAMW,OADnB;MAEE,OAAO,EAAExB,OAFX;MAGE,oBAAoB,EAAEG;IAHxB,EAJF,eASE;MACE,aAAU,KADZ;MAEE,SAAS,EAAEU,cAAA,CAAMY,SAFnB;MAGE,KAAK,EAAE;QACLC,eAAe,EAAEnB;MADZ,CAHT;MAME,OAAO,EAAE,KAAKnB;IANhB,GAQGQ,cARH,CATF,CAzBF,eA6CE;MACE,aAAU,aADZ;MAEE,SAAS,EAAEc,aAAa,GAAGG,cAAA,CAAMc,aAAT,GAAyBd,cAAA,CAAMlB;IAFzD,GAIGgB,QAJH,eAKE;MACE,aAAU,KADZ;MAEE,SAAS,EAAEE,cAAA,CAAMY,SAFnB;MAGE,KAAK,EAAE;QACLC,eAAe,EAAEnB;MADZ,CAHT;MAME,OAAO,EAAE,KAAKnB;IANhB,GAQGU,YARH,CALF,CA7CF,CADF;EAgED;;AArKmC;;AAAhCvB,O,CAmBGqD,Y,GAAe;EACpBvB,IAAI,EAAEwB,iBAAA,CAASC,iBAAT,CAA2BzB;AADb,C;AAnBlB9B,O,CACGwD,S,2CAAY;EACjBnC,cAAc,EAAEoC,kBAAA,CAAUC,MADT;EAEjBpC,cAAc,EAAEmC,kBAAA,CAAUC,MAFT;EAGjBnC,YAAY,EAAEkC,kBAAA,CAAUC,MAHP;EAIjBlC,YAAY,EAAEiC,kBAAA,CAAUC,MAJP;EAKjBnD,WAAW,EAAEkD,kBAAA,CAAUE,IALN;EAMjBlD,SAAS,EAAEgD,kBAAA,CAAUE,IANJ;EAOjBlC,OAAO,EAAEmC,uBAAA,CAAeJ,SAAf,CAAyB/B,OAPjB;EAQjBL,OAAO,EAAEqC,kBAAA,CAAUI,KAAV,CAAgBC,eAAA,CAAON,SAAvB,CARQ;EASjBtC,QAAQ,EAAEuC,kBAAA,CAAUM,IATH;EAUjBjD,eAAe,EAAE2C,kBAAA,CAAUM,IAVV;EAWjB9C,aAAa,EAAEwC,kBAAA,CAAUM,IAXR;EAYjBpC,iBAAiB,EAAE8B,kBAAA,CAAUC,MAZZ;EAajBhC,mBAAmB,EAAE+B,kBAAA,CAAUC,MAbd;EAcjB9B,oBAAoB,EAAE6B,kBAAA,CAAUC,MAdf;EAejB7B,aAAa,EAAE4B,kBAAA,CAAUC;AAfR,C;eAuKN1D,O"}

package/lib/molecule/setup-section/index.d.ts

@@ -37,6 +37,8 @@ declare namespace SetupSection {
             disabled: PropTypes.Requireable<boolean>;
             onChange: PropTypes.Requireable<(...args: any[]) => any>;
             description: PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
+            'aria-label': PropTypes.Requireable<string>;
             modified: PropTypes.Requireable<boolean>;
             titlePosition: PropTypes.Requireable<string>;
             theme: PropTypes.Requireable<string>;

package/lib/molecule/setup-section/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/setup-section/index.js"],"names":[],"mappings":";AAsCA,qEAeC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA7CD,mFAiBC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/setup-section/index.js"],"names":[],"mappings":";AAsCA,qEAeC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA7CD,mFAiBC"}

package/lib/molecule/setup-sections/index.d.ts

@@ -18,6 +18,8 @@ declare namespace SetupSections {
                 disabled: PropTypes.Requireable<boolean>;
                 onChange: PropTypes.Requireable<(...args: any[]) => any>;
                 description: PropTypes.Requireable<string>;
+                'aria-labelledby': PropTypes.Requireable<string>;
+                'aria-label': PropTypes.Requireable<string>;
                 modified: PropTypes.Requireable<boolean>;
                 titlePosition: PropTypes.Requireable<string>;
                 theme: PropTypes.Requireable<string>;

package/lib/molecule/setup-slide/index.d.ts

@@ -30,6 +30,8 @@ declare namespace SetupSlide {
             disabled: PropTypes.Requireable<boolean>;
             onChange: PropTypes.Requireable<(...args: any[]) => any>;
             description: PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
+            'aria-label': PropTypes.Requireable<string>;
             modified: PropTypes.Requireable<boolean>;
             titlePosition: PropTypes.Requireable<string>;
             theme: PropTypes.Requireable<string>;
@@ -66,6 +68,7 @@ declare namespace SetupSlide {
             modified: PropTypes.Requireable<boolean>;
             error: PropTypes.Requireable<boolean>;
             'aria-label': PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
         }> | PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             title: PropTypes.Validator<string>;

package/lib/molecule/setup-slider/index.d.ts

@@ -43,6 +43,8 @@ declare namespace SetupSlider {
                 disabled: PropTypes.Requireable<boolean>;
                 onChange: PropTypes.Requireable<(...args: any[]) => any>;
                 description: PropTypes.Requireable<string>;
+                'aria-labelledby': PropTypes.Requireable<string>;
+                'aria-label': PropTypes.Requireable<string>;
                 modified: PropTypes.Requireable<boolean>;
                 titlePosition: PropTypes.Requireable<string>;
                 theme: PropTypes.Requireable<string>;
@@ -79,6 +81,7 @@ declare namespace SetupSlider {
                 modified: PropTypes.Requireable<boolean>;
                 error: PropTypes.Requireable<boolean>;
                 'aria-label': PropTypes.Requireable<string>;
+                'aria-labelledby': PropTypes.Requireable<string>;
             }> | PropTypes.InferProps<{
                 type: PropTypes.Requireable<string>;
                 title: PropTypes.Validator<string>;