@coorpacademy/components 11.32.24-alpha.0 → 11.32.24

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ConfirmationInput","onChange","placeholder","handleOnChange","useMemo","e","target","value","style","input","propTypes","PropTypes","func","string","ConfirmationForm","props","confirmValue","confirmDisabled","onConfirm","cancelValue","onHandleClose","textValidation","isPending","form","confirmForm","confirmEmptySpace","cancel","disabled","delete","isRequired","bool","Confirmation","description","sectionConfirm","inputDoubleProps","InputDoublestep","React","Component","constructor","context","state","open","handleToggle","bind","handleOnClick","setState","onCloseConfirmation","onOpenConfirmation","preventDefault","onClick","render","toggleValue","formView","toggleDisabled","toggle","wrapper"],"sources":["../../../src/atom/input-doublestep/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {snakeCase, omit, noop} from 'lodash/fp';\nimport Loader from '../loader';\nimport style from './style.css';\n\nconst ConfirmationInput = ({onChange, placeholder = ''}) => {\n  const handleOnChange = useMemo(\n    () => e => {\n      return onChange(e.target.value);\n    },\n    [onChange]\n  );\n\n  return (\n    <div>\n      <input\n        onInput={handleOnChange}\n        placeholder={placeholder}\n        className={style.input}\n        onChange={noop}\n      />\n    </div>\n  );\n};\n\nConfirmationInput.propTypes = {\n  onChange: PropTypes.func,\n  placeholder: PropTypes.string\n};\n\nconst ConfirmationForm = props => {\n  const {\n    confirmValue,\n    confirmDisabled = false,\n    onConfirm,\n    cancelValue,\n    onHandleClose,\n    onChange,\n    textValidation,\n    placeholder,\n    isPending = false\n  } = props;\n\n  const form = (\n    <div className={style.confirmForm}>\n      {textValidation ? (\n        <ConfirmationInput onChange={onChange} placeholder={placeholder} />\n      ) : (\n        <div className={style.confirmEmptySpace} />\n      )}\n      <span onClick={onHandleClose} className={style.cancel}>\n        {cancelValue}\n      </span>\n      <span\n        onClick={confirmDisabled ? noop : onConfirm}\n        className={confirmDisabled ? style.disabled : style.delete}\n      >\n        {confirmValue}\n      </span>\n    </div>\n  );\n\n  return isPending ? (\n    <div className={style.confirmForm}>\n      <Loader />\n    </div>\n  ) : (\n    form\n  );\n};\nConfirmationForm.propTypes = {\n  confirmValue: PropTypes.string.isRequired,\n  confirmDisabled: PropTypes.bool,\n  onConfirm: PropTypes.func.isRequired,\n  cancelValue: PropTypes.string.isRequired,\n  onHandleClose: PropTypes.func.isRequired,\n  textValidation: PropTypes.bool,\n  isPending: PropTypes.bool,\n  ...ConfirmationInput.propTypes\n};\n\nconst Confirmation = props => {\n  const {description} = props;\n\n  return (\n    <div className={style.sectionConfirm}>\n      <div className={style.description}>{description}</div>\n      <ConfirmationForm {...props} />\n    </div>\n  );\n};\nConfirmation.propTypes = {\n  description: PropTypes.string\n};\n\nconst inputDoubleProps = omit(['onConfirm', 'onHandleClose'], {...Confirmation.propTypes});\nclass InputDoublestep extends React.Component {\n  static propTypes = {\n    toggleValue: PropTypes.string.isRequired,\n    onClick: PropTypes.func.isRequired,\n    onOpenConfirmation: PropTypes.func,\n    onCloseConfirmation: PropTypes.func,\n    ...inputDoubleProps\n  };\n\n  constructor(props, context) {\n    super(props);\n    this.state = {\n      open: false\n    };\n    this.handleToggle = this.handleToggle.bind(this);\n    this.handleOnClick = this.handleOnClick.bind(this);\n  }\n\n  handleToggle() {\n    this.setState(state => ({\n      open: !state.open\n    }));\n\n    const {open} = this.state;\n    const {onCloseConfirmation = noop, onOpenConfirmation = noop} = this.props;\n    open ? onCloseConfirmation() : onOpenConfirmation();\n  }\n\n  handleOnClick(e) {\n    e.preventDefault();\n    this.setState({open: false});\n    const {onClick = noop} = this.props;\n    return onClick(e);\n  }\n\n  render() {\n    const {toggleValue, disabled} = this.props;\n    const {open} = this.state;\n\n    const formView = !open ? (\n      <span\n        onClick={disabled ? noop : this.handleToggle}\n        className={disabled ? style.toggleDisabled : style.toggle}\n      >\n        {toggleValue}\n      </span>\n    ) : (\n      <Confirmation\n        {...this.props}\n        onHandleClose={this.handleToggle}\n        onConfirm={this.handleOnClick}\n      />\n    );\n\n    return (\n      <div className={style.wrapper}>\n        <div data-name={`input_doublestep_${snakeCase(toggleValue)}`} className={style.value}>\n          {formView}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default InputDoublestep;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ConfirmationInput","onChange","placeholder","handleOnChange","useMemo","e","target","value","style","input","propTypes","PropTypes","func","string","ConfirmationForm","props","confirmValue","confirmDisabled","onConfirm","cancelValue","onHandleClose","textValidation","isPending","form","confirmForm","confirmEmptySpace","confirmationCTAWrapper","backgroundColor","color","isRequired","bool","Confirmation","description","sectionConfirm","inputDoubleProps","InputDoublestep","React","Component","constructor","context","state","open","handleToggle","bind","handleOnClick","setState","onCloseConfirmation","onOpenConfirmation","preventDefault","onClick","render","toggleValue","disabled","icon","formView","position","faIcon","name","size","wrapper"],"sources":["../../../src/atom/input-doublestep/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {snakeCase, omit, noop} from 'lodash/fp';\nimport Loader from '../loader';\nimport ButtonLink from '../button-link';\nimport style from './style.css';\n\nconst ConfirmationInput = ({onChange, placeholder = ''}) => {\n  const handleOnChange = useMemo(\n    () => e => {\n      return onChange(e.target.value);\n    },\n    [onChange]\n  );\n\n  return (\n    <div>\n      <input\n        data-testid=\"input\"\n        onInput={handleOnChange}\n        placeholder={placeholder}\n        className={style.input}\n        onChange={noop}\n      />\n    </div>\n  );\n};\n\nConfirmationInput.propTypes = {\n  onChange: PropTypes.func,\n  placeholder: PropTypes.string\n};\n\nconst ConfirmationForm = props => {\n  const {\n    confirmValue,\n    confirmDisabled = false,\n    onConfirm,\n    cancelValue,\n    onHandleClose,\n    onChange,\n    textValidation,\n    placeholder,\n    isPending = false\n  } = props;\n\n  const form = (\n    <div className={style.confirmForm}>\n      {textValidation ? (\n        <ConfirmationInput onChange={onChange} placeholder={placeholder} />\n      ) : (\n        <div className={style.confirmEmptySpace} />\n      )}\n      <div className={style.confirmationCTAWrapper}>\n        <ButtonLink\n          label={cancelValue}\n          data-testid=\"cancel-confirmation-button\"\n          onClick={onHandleClose}\n        />\n        <ButtonLink\n          label={confirmValue}\n          disabled={confirmDisabled}\n          data-testid=\"confirm-delete-button\"\n          onClick={onConfirm}\n          customStyle={{backgroundColor: 'orange', color: 'white'}}\n        />\n      </div>\n    </div>\n  );\n\n  return isPending ? (\n    <div className={style.confirmForm}>\n      <Loader />\n    </div>\n  ) : (\n    form\n  );\n};\nConfirmationForm.propTypes = {\n  confirmValue: PropTypes.string.isRequired,\n  confirmDisabled: PropTypes.bool,\n  onConfirm: PropTypes.func.isRequired,\n  cancelValue: PropTypes.string.isRequired,\n  onHandleClose: PropTypes.func.isRequired,\n  textValidation: PropTypes.bool,\n  isPending: PropTypes.bool,\n  ...ConfirmationInput.propTypes\n};\n\nconst Confirmation = props => {\n  const {description} = props;\n\n  return (\n    <div className={style.sectionConfirm}>\n      <div className={style.description}>{description}</div>\n      <ConfirmationForm {...props} />\n    </div>\n  );\n};\nConfirmation.propTypes = {\n  description: PropTypes.string\n};\n\nconst inputDoubleProps = omit(['onConfirm', 'onHandleClose'], {...Confirmation.propTypes});\nclass InputDoublestep extends React.Component {\n  static propTypes = {\n    toggleValue: PropTypes.string.isRequired,\n    onClick: PropTypes.func.isRequired,\n    onOpenConfirmation: PropTypes.func,\n    onCloseConfirmation: PropTypes.func,\n    icon: PropTypes.string,\n    ...inputDoubleProps\n  };\n\n  constructor(props, context) {\n    super(props);\n    this.state = {\n      open: false\n    };\n    this.handleToggle = this.handleToggle.bind(this);\n    this.handleOnClick = this.handleOnClick.bind(this);\n  }\n\n  handleToggle() {\n    this.setState(state => ({\n      open: !state.open\n    }));\n\n    const {open} = this.state;\n    const {onCloseConfirmation = noop, onOpenConfirmation = noop} = this.props;\n    open ? onCloseConfirmation() : onOpenConfirmation();\n  }\n\n  handleOnClick(e) {\n    e.preventDefault();\n    this.setState({open: false});\n    const {onClick = noop} = this.props;\n    return onClick(e);\n  }\n\n  render() {\n    const {toggleValue, disabled, icon} = this.props;\n    const {open} = this.state;\n\n    const formView = !open ? (\n      <ButtonLink\n        {...(icon\n          ? {\n              icon: {\n                position: 'left',\n                faIcon: {\n                  name: icon,\n                  color: '#ffffff',\n                  size: 16\n                }\n              }\n            }\n          : {})}\n        type=\"dangerous\"\n        label={toggleValue}\n        disabled={disabled}\n        data-testid=\"input-toggle-button\"\n        onClick={this.handleToggle}\n      />\n    ) : (\n      <Confirmation\n        {...this.props}\n        onHandleClose={this.handleToggle}\n        onConfirm={this.handleOnClick}\n      />\n    );\n\n    return (\n      <div className={style.wrapper}>\n        <div data-name={`input_doublestep_${snakeCase(toggleValue)}`} className={style.value}>\n          {formView}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default InputDoublestep;\n"],"mappings":"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"}

package/lib/atom/input-doublestep/style.css

@@ -35,73 +35,6 @@
   min-height: 63px;
 }
 
-.toggle {
-  height: 52px;
-  padding: 0 40px;
-  line-height: 52px;
-  border-radius: 2px;
-  font-family: 'Gilroy';
-  font-size: 15px;
-  color: white;
-  font-weight: 700px;
-  display: block;
-  background-color: negative;
-  cursor: pointer;
-  text-align: center;
-}
-
-.toggleDisabled {
-  composes: toggle;
-  cursor: default;
-  background-color: light;
-  border: 1px solid light;
-}
-
-.button {
-  height: 32px;
-  padding: 0 15px;
-  text-transform: uppercase;
-  border-radius: 2px;
-  font-family: 'Gilroy';
-  font-size: 15px;
-  font-weight: 700;
-  cursor: pointer;
-  line-height: 30px;
-  text-align: center;
-  box-sizing: border-box;
-}
-
-.cancel {
-  composes: button;
-  border: 1px solid dark;
-  color: white;
-  background-color: dark;
-  margin-right: 10px;
-  margin-bottom: 10px;
-  font-weight: 600;
-  display: inline-block;
-  min-width: 120px;
-}
-
-.delete {
-  composes: button;
-  border: 1px solid orange;
-  color: white;
-  background-color: orange;
-  margin-right: 5px;
-  margin-bottom: 10px;
-  font-weight: 600;
-  display: inline-block;
-  min-width: 120px;
-}
-
-.disabled {
-  composes: delete;
-  cursor: default;
-  background-color: light;
-  border: 1px solid light;
-}
-
 .description {
   font-family: 'Gilroy';
   font-weight: 500;
@@ -123,3 +56,10 @@
   width: 230px;
   appearance: none;
 }
+
+.confirmationCTAWrapper {
+  display: flex;
+  margin: auto;
+  width: 50%;
+  gap: 16px;
+}

package/lib/atom/select/index.js

@@ -72,7 +72,7 @@ const ArrowView = ({
     color: arrowColor
   }, {
     className: arrowClass
-  }), [ariaLabel, arrowClass, arrowColor]);
+  }), [arrowClass, arrowColor]);
 
   if (shouldRender) {
     return isArrowUp ? /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowTop, _extends({}, props, {

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","skillDetail","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  skillDetail: style.skillDetail,\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-testid=\"select-wrapper\"\n        data-name=\"select-wrapper\"\n        title={title}\n        style={{\n          ...(shouldUseSkinFontColor && {\n            color\n          })\n        }}\n        className={style.selectWrapper}\n      >\n        {titleView}\n        <span\n          data-testid=\"select-span\"\n          data-name=\"select-span\"\n          className={classnames(\n            style.selectSpan,\n            includes(theme, [\n              'player',\n              'invalid',\n              'question',\n              'thematiques',\n              'template',\n              'skillDetail'\n            ])\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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"}
+{"version":3,"file":"index.js","names":["themeStyle","filter","style","invalid","header","mooc","question","sort","thematiques","player","template","skillDetail","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  skillDetail: style.skillDetail,\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    [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-testid=\"select-wrapper\"\n        data-name=\"select-wrapper\"\n        title={title}\n        style={{\n          ...(shouldUseSkinFontColor && {\n            color\n          })\n        }}\n        className={style.selectWrapper}\n      >\n        {titleView}\n        <span\n          data-testid=\"select-span\"\n          data-name=\"select-span\"\n          className={classnames(\n            style.selectSpan,\n            includes(theme, [\n              'player',\n              'invalid',\n              'question',\n              'thematiques',\n              'template',\n              'skillDetail'\n            ])\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/base-modal/index.d.ts

@@ -47,6 +47,7 @@ declare namespace BaseModal {
                 onConfirm: PropTypes.Requireable<(...args: any[]) => any>;
                 iconName: PropTypes.Requireable<string>;
                 disabled: PropTypes.Requireable<boolean>;
+                color: PropTypes.Requireable<string>;
             }>>;
         }> | null | undefined>>;
         const onClose: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/molecule/base-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AASA,yEA4GC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AASA,yEA6GC"}

package/lib/molecule/base-modal/index.js

@@ -60,9 +60,10 @@ const BaseModal = (props, context) => {
       label: confirmLabel,
       onConfirm,
       disabled: confirmDisabled,
-      iconName
+      iconName,
+      color
     } = confirmButton || {};
-    const primarySkinColor = (0, _get2.default)('common.primary', skin);
+    const buttonConfirmColor = color || (0, _get2.default)('common.primary', skin);
     return /*#__PURE__*/_react.default.createElement("div", {
       className: _style.default.footer
     }, /*#__PURE__*/_react.default.createElement("div", {
@@ -75,9 +76,9 @@ const BaseModal = (props, context) => {
       disabled: cancelDisabled
     }) : null, onConfirm && confirmLabel ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_buttonLink.default, _extends({
       customStyle: {
-        backgroundColor: primarySkinColor
+        backgroundColor: buttonConfirmColor
       },
-      hoverBackgroundColor: (0, _cssColorFunction.convert)(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`),
+      hoverBackgroundColor: (0, _cssColorFunction.convert)(`hsl(from ${buttonConfirmColor} h s calc(l*(1 - 0.08)))`),
       hoverColor: '#FFFFFF',
       className: _style.default.footerConfirmButton,
       type: 'primary',
@@ -96,7 +97,7 @@ const BaseModal = (props, context) => {
     } : {}))) : null), text ? /*#__PURE__*/_react.default.createElement("div", {
       className: `${_style.default.footerDescription} ${isError ? _style.default.footerDescriptionError : ''}`
     }, text) : null);
-  }, [footer, skin, _style.default, _cssColorFunction.convert, _get2.default, _isEmpty2.default]);
+  }, [footer, skin]);
   if (!isOpen || !title || !children) return null;
 
   function handleOnClose(e) {
@@ -166,7 +167,8 @@ BaseModal.propTypes = process.env.NODE_ENV !== "production" ? {
       label: _propTypes.default.string,
       onConfirm: _propTypes.default.func,
       iconName: _propTypes.default.string,
-      disabled: _propTypes.default.bool
+      disabled: _propTypes.default.bool,
+      color: _propTypes.default.string
     })
   })]),
   onClose: _propTypes.default.func

package/lib/molecule/base-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["BaseModal","props","context","title","description","headerIcon","children","isOpen","footer","onClose","skin","Footer","useCallback","cancelButton","confirmButton","text","isError","label","cancelLabel","onCancel","disabled","cancelDisabled","confirmLabel","onConfirm","confirmDisabled","iconName","primarySkinColor","style","footerCTAWrapper","className","footerCancelButton","type","onClick","customStyle","backgroundColor","hoverBackgroundColor","convert","hoverColor","footerConfirmButton","icon","position","faIcon","name","color","size","footerDescription","footerDescriptionError","handleOnClose","e","stopPropagation","modalWrapper","modal","header","faSize","wrapperSize","headerContent","headerTitle","headerDescription","headerCloseIcon","body","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","shape","node","bool","oneOfType","func","boolean"],"sources":["../../../src/molecule/base-modal/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, get} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst BaseModal = (props, context) => {\n  const {title, description, headerIcon, children, isOpen, footer, onClose} = props;\n  const {skin} = context;\n\n  const Footer = useCallback(() => {\n    if (isEmpty(footer)) return null;\n    if (typeof footer === 'function') return footer();\n\n    const {cancelButton, confirmButton, text, isError} = footer;\n    const {label: cancelLabel, onCancel, disabled: cancelDisabled} = cancelButton || {};\n    const {\n      label: confirmLabel,\n      onConfirm,\n      disabled: confirmDisabled,\n      iconName\n    } = confirmButton || {};\n    const primarySkinColor = get('common.primary', skin);\n\n    return (\n      <div className={style.footer}>\n        <div className={style.footerCTAWrapper}>\n          {onCancel && cancelLabel ? (\n            <ButtonLink\n              {...{\n                className: style.footerCancelButton,\n                type: 'secondary',\n                onClick: onCancel,\n                label: cancelLabel,\n                disabled: cancelDisabled\n              }}\n            />\n          ) : null}\n          {onConfirm && confirmLabel ? (\n            <div>\n              <ButtonLink\n                {...{\n                  customStyle: {backgroundColor: primarySkinColor},\n                  hoverBackgroundColor: convert(\n                    `hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`\n                  ),\n                  hoverColor: '#FFFFFF',\n                  className: style.footerConfirmButton,\n                  type: 'primary',\n                  onClick: onConfirm,\n                  label: confirmLabel,\n                  disabled: confirmDisabled,\n                  ...(iconName\n                    ? {\n                        icon: {\n                          position: 'left',\n                          faIcon: {\n                            name: iconName,\n                            color: '#FFFFFF',\n                            size: 16\n                          }\n                        }\n                      }\n                    : {})\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n        {text ? (\n          <div\n            className={`${style.footerDescription} ${isError ? style.footerDescriptionError : ''}`}\n          >\n            {text}\n          </div>\n        ) : null}\n      </div>\n    );\n  }, [footer, skin, style, convert, get, isEmpty]);\n\n  if (!isOpen || !title || !children) return null;\n\n  function handleOnClose(e) {\n    e?.stopPropagation();\n    onClose();\n  }\n\n  return (\n    <div className={style.modalWrapper}>\n      <div className={style.modal}>\n        <header className={style.header}>\n          {headerIcon?.name ? (\n            <div className={style.headerIcon}>\n              <Icon\n                iconName={headerIcon.name}\n                iconColor={headerIcon.color}\n                backgroundColor={headerIcon.backgroundColor}\n                size={{faSize: 20, wrapperSize: 48}}\n              />\n            </div>\n          ) : null}\n          <div className={style.headerContent}>\n            <div className={style.headerTitle}>{title}</div>\n            {description ? <div className={style.headerDescription}>{description}</div> : null}\n          </div>\n          <div className={style.headerCloseIcon} onClick={handleOnClose}>\n            <Icon iconName=\"close\" backgroundColor=\"#F4F4F5\" size={{faSize: 14, wrapperSize: 28}} />\n          </div>\n        </header>\n        <div className={style.body}>{children}</div>\n        <Footer />\n      </div>\n    </div>\n  );\n};\n\nBaseModal.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBaseModal.propTypes = {\n  title: PropTypes.string,\n  headerIcon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string,\n    backgroundColor: PropTypes.string\n  }),\n  description: PropTypes.string,\n  children: PropTypes.node,\n  isOpen: PropTypes.bool,\n  footer: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({\n      text: PropTypes.string,\n      isError: PropTypes.boolean,\n      cancelButton: PropTypes.shape({\n        label: PropTypes.string,\n        onCancel: PropTypes.func,\n        disabled: PropTypes.bool\n      }),\n      confirmButton: PropTypes.shape({\n        label: PropTypes.string,\n        onConfirm: PropTypes.func,\n        iconName: PropTypes.string,\n        disabled: PropTypes.bool\n      })\n    })\n  ]),\n  onClose: PropTypes.func\n};\n\nexport default BaseModal;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,SAAS,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACpC,MAAM;IAACC,KAAD;IAAQC,WAAR;IAAqBC,UAArB;IAAiCC,QAAjC;IAA2CC,MAA3C;IAAmDC,MAAnD;IAA2DC;EAA3D,IAAsER,KAA5E;EACA,MAAM;IAACS;EAAD,IAASR,OAAf;EAEA,MAAMS,MAAM,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC/B,IAAI,uBAAQJ,MAAR,CAAJ,EAAqB,OAAO,IAAP;IACrB,IAAI,OAAOA,MAAP,KAAkB,UAAtB,EAAkC,OAAOA,MAAM,EAAb;IAElC,MAAM;MAACK,YAAD;MAAeC,aAAf;MAA8BC,IAA9B;MAAoCC;IAApC,IAA+CR,MAArD;IACA,MAAM;MAACS,KAAK,EAAEC,WAAR;MAAqBC,QAArB;MAA+BC,QAAQ,EAAEC;IAAzC,IAA2DR,YAAY,IAAI,EAAjF;IACA,MAAM;MACJI,KAAK,EAAEK,YADH;MAEJC,SAFI;MAGJH,QAAQ,EAAEI,eAHN;MAIJC;IAJI,IAKFX,aAAa,IAAI,EALrB;IAMA,MAAMY,gBAAgB,GAAG,mBAAI,gBAAJ,EAAsBhB,IAAtB,CAAzB;IAEA,oBACE;MAAK,SAAS,EAAEiB,cAAA,CAAMnB;IAAtB,gBACE;MAAK,SAAS,EAAEmB,cAAA,CAAMC;IAAtB,GACGT,QAAQ,IAAID,WAAZ,gBACC,6BAAC,mBAAD;MAEIW,SAAS,EAAEF,cAAA,CAAMG,kBAFrB;MAGIC,IAAI,EAAE,WAHV;MAIIC,OAAO,EAAEb,QAJb;MAKIF,KAAK,EAAEC,WALX;MAMIE,QAAQ,EAAEC;IANd,EADD,GAUG,IAXN,EAYGE,SAAS,IAAID,YAAb,gBACC,uDACE,6BAAC,mBAAD;MAEIW,WAAW,EAAE;QAACC,eAAe,EAAER;MAAlB,CAFjB;MAGIS,oBAAoB,EAAE,IAAAC,yBAAA,EACnB,YAAWV,gBAAiB,0BADT,CAH1B;MAMIW,UAAU,EAAE,SANhB;MAOIR,SAAS,EAAEF,cAAA,CAAMW,mBAPrB;MAQIP,IAAI,EAAE,SARV;MASIC,OAAO,EAAET,SATb;MAUIN,KAAK,EAAEK,YAVX;MAWIF,QAAQ,EAAEI;IAXd,GAYQC,QAAQ,GACR;MACEc,IAAI,EAAE;QACJC,QAAQ,EAAE,MADN;QAEJC,MAAM,EAAE;UACNC,IAAI,EAAEjB,QADA;UAENkB,KAAK,EAAE,SAFD;UAGNC,IAAI,EAAE;QAHA;MAFJ;IADR,CADQ,GAWR,EAvBR,EADF,CADD,GA6BG,IAzCN,CADF,EA4CG7B,IAAI,gBACH;MACE,SAAS,EAAG,GAAEY,cAAA,CAAMkB,iBAAkB,IAAG7B,OAAO,GAAGW,cAAA,CAAMmB,sBAAT,GAAkC,EAAG;IADvF,GAGG/B,IAHH,CADG,GAMD,IAlDN,CADF;EAsDD,CApEc,EAoEZ,CAACP,MAAD,EAASE,IAAT,EAAeiB,cAAf,EAAsBS,yBAAtB,mCApEY,CAAf;EAsEA,IAAI,CAAC7B,MAAD,IAAW,CAACJ,KAAZ,IAAqB,CAACG,QAA1B,EAAoC,OAAO,IAAP;;EAEpC,SAASyC,aAAT,CAAuBC,CAAvB,EAA0B;IACxBA,CAAC,EAAEC,eAAH;IACAxC,OAAO;EACR;;EAED,oBACE;IAAK,SAAS,EAAEkB,cAAA,CAAMuB;EAAtB,gBACE;IAAK,SAAS,EAAEvB,cAAA,CAAMwB;EAAtB,gBACE;IAAQ,SAAS,EAAExB,cAAA,CAAMyB;EAAzB,GACG/C,UAAU,EAAEqC,IAAZ,gBACC;IAAK,SAAS,EAAEf,cAAA,CAAMtB;EAAtB,gBACE,6BAAC,aAAD;IACE,QAAQ,EAAEA,UAAU,CAACqC,IADvB;IAEE,SAAS,EAAErC,UAAU,CAACsC,KAFxB;IAGE,eAAe,EAAEtC,UAAU,CAAC6B,eAH9B;IAIE,IAAI,EAAE;MAACmB,MAAM,EAAE,EAAT;MAAaC,WAAW,EAAE;IAA1B;EAJR,EADF,CADD,GASG,IAVN,eAWE;IAAK,SAAS,EAAE3B,cAAA,CAAM4B;EAAtB,gBACE;IAAK,SAAS,EAAE5B,cAAA,CAAM6B;EAAtB,GAAoCrD,KAApC,CADF,EAEGC,WAAW,gBAAG;IAAK,SAAS,EAAEuB,cAAA,CAAM8B;EAAtB,GAA0CrD,WAA1C,CAAH,GAAkE,IAFhF,CAXF,eAeE;IAAK,SAAS,EAAEuB,cAAA,CAAM+B,eAAtB;IAAuC,OAAO,EAAEX;EAAhD,gBACE,6BAAC,aAAD;IAAM,QAAQ,EAAC,OAAf;IAAuB,eAAe,EAAC,SAAvC;IAAiD,IAAI,EAAE;MAACM,MAAM,EAAE,EAAT;MAAaC,WAAW,EAAE;IAA1B;EAAvD,EADF,CAfF,CADF,eAoBE;IAAK,SAAS,EAAE3B,cAAA,CAAMgC;EAAtB,GAA6BrD,QAA7B,CApBF,eAqBE,6BAAC,MAAD,OArBF,CADF,CADF;AA2BD,CA5GD;;AA8GAN,SAAS,CAAC4D,YAAV,GAAyB;EACvBlD,IAAI,EAAEmD,iBAAA,CAASC,iBAAT,CAA2BpD;AADV,CAAzB;AAIAV,SAAS,CAAC+D,SAAV,2CAAsB;EACpB5D,KAAK,EAAE6D,kBAAA,CAAUC,MADG;EAEpB5D,UAAU,EAAE2D,kBAAA,CAAUE,KAAV,CAAgB;IAC1BxB,IAAI,EAAEsB,kBAAA,CAAUC,MADU;IAE1BtB,KAAK,EAAEqB,kBAAA,CAAUC,MAFS;IAG1B/B,eAAe,EAAE8B,kBAAA,CAAUC;EAHD,CAAhB,CAFQ;EAOpB7D,WAAW,EAAE4D,kBAAA,CAAUC,MAPH;EAQpB3D,QAAQ,EAAE0D,kBAAA,CAAUG,IARA;EASpB5D,MAAM,EAAEyD,kBAAA,CAAUI,IATE;EAUpB5D,MAAM,EAAEwD,kBAAA,CAAUK,SAAV,CAAoB,CAC1BL,kBAAA,CAAUM,IADgB,EAE1BN,kBAAA,CAAUE,KAAV,CAAgB;IACdnD,IAAI,EAAEiD,kBAAA,CAAUC,MADF;IAEdjD,OAAO,EAAEgD,kBAAA,CAAUO,OAFL;IAGd1D,YAAY,EAAEmD,kBAAA,CAAUE,KAAV,CAAgB;MAC5BjD,KAAK,EAAE+C,kBAAA,CAAUC,MADW;MAE5B9C,QAAQ,EAAE6C,kBAAA,CAAUM,IAFQ;MAG5BlD,QAAQ,EAAE4C,kBAAA,CAAUI;IAHQ,CAAhB,CAHA;IAQdtD,aAAa,EAAEkD,kBAAA,CAAUE,KAAV,CAAgB;MAC7BjD,KAAK,EAAE+C,kBAAA,CAAUC,MADY;MAE7B1C,SAAS,EAAEyC,kBAAA,CAAUM,IAFQ;MAG7B7C,QAAQ,EAAEuC,kBAAA,CAAUC,MAHS;MAI7B7C,QAAQ,EAAE4C,kBAAA,CAAUI;IAJS,CAAhB;EARD,CAAhB,CAF0B,CAApB,CAVY;EA4BpB3D,OAAO,EAAEuD,kBAAA,CAAUM;AA5BC,CAAtB;eA+BetE,S"}
+{"version":3,"file":"index.js","names":["BaseModal","props","context","title","description","headerIcon","children","isOpen","footer","onClose","skin","Footer","useCallback","cancelButton","confirmButton","text","isError","label","cancelLabel","onCancel","disabled","cancelDisabled","confirmLabel","onConfirm","confirmDisabled","iconName","color","buttonConfirmColor","style","footerCTAWrapper","className","footerCancelButton","type","onClick","customStyle","backgroundColor","hoverBackgroundColor","convert","hoverColor","footerConfirmButton","icon","position","faIcon","name","size","footerDescription","footerDescriptionError","handleOnClose","e","stopPropagation","modalWrapper","modal","header","faSize","wrapperSize","headerContent","headerTitle","headerDescription","headerCloseIcon","body","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","shape","node","bool","oneOfType","func","boolean"],"sources":["../../../src/molecule/base-modal/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, get} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst BaseModal = (props, context) => {\n  const {title, description, headerIcon, children, isOpen, footer, onClose} = props;\n  const {skin} = context;\n\n  const Footer = useCallback(() => {\n    if (isEmpty(footer)) return null;\n    if (typeof footer === 'function') return footer();\n\n    const {cancelButton, confirmButton, text, isError} = footer;\n    const {label: cancelLabel, onCancel, disabled: cancelDisabled} = cancelButton || {};\n    const {\n      label: confirmLabel,\n      onConfirm,\n      disabled: confirmDisabled,\n      iconName,\n      color\n    } = confirmButton || {};\n    const buttonConfirmColor = color || get('common.primary', skin);\n\n    return (\n      <div className={style.footer}>\n        <div className={style.footerCTAWrapper}>\n          {onCancel && cancelLabel ? (\n            <ButtonLink\n              {...{\n                className: style.footerCancelButton,\n                type: 'secondary',\n                onClick: onCancel,\n                label: cancelLabel,\n                disabled: cancelDisabled\n              }}\n            />\n          ) : null}\n          {onConfirm && confirmLabel ? (\n            <div>\n              <ButtonLink\n                {...{\n                  customStyle: {backgroundColor: buttonConfirmColor},\n                  hoverBackgroundColor: convert(\n                    `hsl(from ${buttonConfirmColor} h s calc(l*(1 - 0.08)))`\n                  ),\n                  hoverColor: '#FFFFFF',\n                  className: style.footerConfirmButton,\n                  type: 'primary',\n                  onClick: onConfirm,\n                  label: confirmLabel,\n                  disabled: confirmDisabled,\n                  ...(iconName\n                    ? {\n                        icon: {\n                          position: 'left',\n                          faIcon: {\n                            name: iconName,\n                            color: '#FFFFFF',\n                            size: 16\n                          }\n                        }\n                      }\n                    : {})\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n        {text ? (\n          <div\n            className={`${style.footerDescription} ${isError ? style.footerDescriptionError : ''}`}\n          >\n            {text}\n          </div>\n        ) : null}\n      </div>\n    );\n  }, [footer, skin]);\n\n  if (!isOpen || !title || !children) return null;\n\n  function handleOnClose(e) {\n    e?.stopPropagation();\n    onClose();\n  }\n\n  return (\n    <div className={style.modalWrapper}>\n      <div className={style.modal}>\n        <header className={style.header}>\n          {headerIcon?.name ? (\n            <div className={style.headerIcon}>\n              <Icon\n                iconName={headerIcon.name}\n                iconColor={headerIcon.color}\n                backgroundColor={headerIcon.backgroundColor}\n                size={{faSize: 20, wrapperSize: 48}}\n              />\n            </div>\n          ) : null}\n          <div className={style.headerContent}>\n            <div className={style.headerTitle}>{title}</div>\n            {description ? <div className={style.headerDescription}>{description}</div> : null}\n          </div>\n          <div className={style.headerCloseIcon} onClick={handleOnClose}>\n            <Icon iconName=\"close\" backgroundColor=\"#F4F4F5\" size={{faSize: 14, wrapperSize: 28}} />\n          </div>\n        </header>\n        <div className={style.body}>{children}</div>\n        <Footer />\n      </div>\n    </div>\n  );\n};\n\nBaseModal.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBaseModal.propTypes = {\n  title: PropTypes.string,\n  headerIcon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string,\n    backgroundColor: PropTypes.string\n  }),\n  description: PropTypes.string,\n  children: PropTypes.node,\n  isOpen: PropTypes.bool,\n  footer: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({\n      text: PropTypes.string,\n      isError: PropTypes.boolean,\n      cancelButton: PropTypes.shape({\n        label: PropTypes.string,\n        onCancel: PropTypes.func,\n        disabled: PropTypes.bool\n      }),\n      confirmButton: PropTypes.shape({\n        label: PropTypes.string,\n        onConfirm: PropTypes.func,\n        iconName: PropTypes.string,\n        disabled: PropTypes.bool,\n        color: PropTypes.string\n      })\n    })\n  ]),\n  onClose: PropTypes.func\n};\n\nexport default BaseModal;\n"],"mappings":"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"}

package/lib/molecule/brand-create-form/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/brand-create-form/index.js"],"names":[],"mappings":";AAOA,wEAuDC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/brand-create-form/index.js"],"names":[],"mappings":";AAOA,wEA4DC"}

package/lib/molecule/brand-create-form/index.js

@@ -7,7 +7,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _button = _interopRequireDefault(require("../../atom/button"));
+var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
 var _loader = _interopRequireDefault(require("../../atom/loader"));
 
@@ -47,11 +47,16 @@ const BrandCreateForm = (props, context) => {
     className: _style.default.wait
   }, waitMessage), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.loading
-  }, /*#__PURE__*/_react.default.createElement(_loader.default, null))) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_button.default, {
+  }, /*#__PURE__*/_react.default.createElement(_loader.default, null))) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
+    type: "primary",
     "data-name": "brand_create_submit_button",
-    type: "submit",
+    usage: "submit",
+    customStyle: {
+      display: 'inline-block',
+      width: 'fit-content'
+    },
     disabled: disabled,
-    submitValue: submitValue
+    label: submitValue
   }));
   return /*#__PURE__*/_react.default.createElement("div", {
     className: wrapperClass

package/lib/molecule/brand-create-form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["BrandCreateForm","props","context","title","subtitle","description","field","onSubmit","submitValue","isPending","isModified","translate","waitMessage","wrapperClass","error","style","modifiedWrapper","wrapper","fieldClass","default","disabled","onChange","handleChange","useMemo","e","target","value","actionView","wait","loading","header","content","placeholder","label","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","shape","func","bool"],"sources":["../../../src/molecule/brand-create-form/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport Button from '../../atom/button';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst BrandCreateForm = (props, context) => {\n  const {title, subtitle, description, field, onSubmit, submitValue, isPending, isModified} = props;\n  const {translate} = context;\n  const waitMessage = translate('Wait_creation');\n\n  const wrapperClass =\n    isModified || isPending || field.error ? style.modifiedWrapper : style.wrapper;\n  const fieldClass = field.error ? style.error : style.default;\n  const disabled = isPending || !isModified;\n  const {onChange} = field;\n  const handleChange = useMemo(() => e => onChange(e.target.value), [onChange]);\n\n  const actionView = isPending ? (\n    <div>\n      <div className={style.wait}>{waitMessage}</div>\n      <div className={style.loading}>\n        <Loader />\n      </div>\n    </div>\n  ) : (\n    <div>\n      <Button\n        data-name=\"brand_create_submit_button\"\n        type=\"submit\"\n        disabled={disabled}\n        submitValue={submitValue}\n      />\n    </div>\n  );\n\n  return (\n    <div className={wrapperClass}>\n      <div className={style.header}>\n        <h1>{title}</h1>\n      </div>\n      <form className={style.content} onSubmit={onSubmit}>\n        <h2>{subtitle}</h2>\n        <div className={style.description}>{description}</div>\n        <div className={fieldClass}>\n          <label>\n            <input\n              type=\"text\"\n              maxLength=\"40\"\n              data-name=\"brand_create_text_input\"\n              placeholder={field.placeholder}\n              defaultValue={field.value}\n              onInput={handleChange}\n            />\n            {field.label}\n          </label>\n        </div>\n        {actionView}\n      </form>\n    </div>\n  );\n};\n\nBrandCreateForm.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nBrandCreateForm.propTypes = {\n  title: PropTypes.string.isRequired,\n  subtitle: PropTypes.string.isRequired,\n  description: PropTypes.string.isRequired,\n  field: PropTypes.shape({\n    placeholder: PropTypes.string.isRequired,\n    label: PropTypes.string.isRequired,\n    onChange: PropTypes.func.isRequired,\n    error: PropTypes.string,\n    value: PropTypes.string\n  }).isRequired,\n  onSubmit: PropTypes.func.isRequired,\n  submitValue: PropTypes.string.isRequired,\n  isPending: PropTypes.bool,\n  isModified: PropTypes.bool\n};\n\nexport default BrandCreateForm;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["BrandCreateForm","props","context","title","subtitle","description","field","onSubmit","submitValue","isPending","isModified","translate","waitMessage","wrapperClass","error","style","modifiedWrapper","wrapper","fieldClass","default","disabled","onChange","handleChange","useMemo","e","target","value","actionView","wait","loading","display","width","header","content","placeholder","label","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","shape","func","bool"],"sources":["../../../src/molecule/brand-create-form/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst BrandCreateForm = (props, context) => {\n  const {title, subtitle, description, field, onSubmit, submitValue, isPending, isModified} = props;\n  const {translate} = context;\n  const waitMessage = translate('Wait_creation');\n\n  const wrapperClass =\n    isModified || isPending || field.error ? style.modifiedWrapper : style.wrapper;\n  const fieldClass = field.error ? style.error : style.default;\n  const disabled = isPending || !isModified;\n  const {onChange} = field;\n  const handleChange = useMemo(() => e => onChange(e.target.value), [onChange]);\n\n  const actionView = isPending ? (\n    <div>\n      <div className={style.wait}>{waitMessage}</div>\n      <div className={style.loading}>\n        <Loader />\n      </div>\n    </div>\n  ) : (\n    <div>\n      <ButtonLink\n        type=\"primary\"\n        data-name=\"brand_create_submit_button\"\n        usage=\"submit\"\n        customStyle={{\n          display: 'inline-block',\n          width: 'fit-content'\n        }}\n        disabled={disabled}\n        label={submitValue}\n      />\n    </div>\n  );\n\n  return (\n    <div className={wrapperClass}>\n      <div className={style.header}>\n        <h1>{title}</h1>\n      </div>\n      <form className={style.content} onSubmit={onSubmit}>\n        <h2>{subtitle}</h2>\n        <div className={style.description}>{description}</div>\n        <div className={fieldClass}>\n          <label>\n            <input\n              type=\"text\"\n              maxLength=\"40\"\n              data-name=\"brand_create_text_input\"\n              placeholder={field.placeholder}\n              defaultValue={field.value}\n              onInput={handleChange}\n            />\n            {field.label}\n          </label>\n        </div>\n        {actionView}\n      </form>\n    </div>\n  );\n};\n\nBrandCreateForm.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nBrandCreateForm.propTypes = {\n  title: PropTypes.string.isRequired,\n  subtitle: PropTypes.string.isRequired,\n  description: PropTypes.string.isRequired,\n  field: PropTypes.shape({\n    placeholder: PropTypes.string.isRequired,\n    label: PropTypes.string.isRequired,\n    onChange: PropTypes.func.isRequired,\n    error: PropTypes.string,\n    value: PropTypes.string\n  }).isRequired,\n  onSubmit: PropTypes.func.isRequired,\n  submitValue: PropTypes.string.isRequired,\n  isPending: PropTypes.bool,\n  isModified: PropTypes.bool\n};\n\nexport default BrandCreateForm;\n"],"mappings":"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"}

package/lib/molecule/brand-download-box/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/brand-download-box/index.js"],"names":[],"mappings":";AAQA,yEA+BC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/brand-download-box/index.js"],"names":[],"mappings":";AAQA,yEA8BC"}

package/lib/molecule/brand-download-box/index.js

@@ -11,7 +11,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _novaIcons = require("@coorpacademy/nova-icons");
 
-var _button = _interopRequireDefault(require("../../atom/button"));
+var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
 var _provider = _interopRequireDefault(require("../../atom/provider"));
 
@@ -52,13 +52,18 @@ const BrandDownloadBox = (props, context) => {
   }, description));
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.wrapper
-  }, type, /*#__PURE__*/_react.default.createElement(_button.default, {
+  }, type, /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
     className: _style.default.button,
-    type: "link",
-    download: true,
-    href: href,
+    link: {
+      href,
+      download: true
+    },
     onClick: onClick,
-    submitValue: submitValue
+    label: submitValue,
+    customStyle: {
+      backgroundColor: '#FFA000',
+      color: 'white'
+    }
   }));
 };
 

package/lib/molecule/brand-download-box/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["BrandDownloadBox","props","context","title","warning","description","href","onClick","submitValue","skin","negativeColor","type","style","texts","icon","color","titleTexts","wrapper","button","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","func"],"sources":["../../../src/molecule/brand-download-box/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {NovaSolidInterfaceFeedbackInterfaceAlertCircle as AlertIcon} from '@coorpacademy/nova-icons';\nimport {get} from 'lodash/fp';\nimport Button from '../../atom/button';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst BrandDownloadBox = (props, context) => {\n  const {title = '', warning = '', description = '', href = '', onClick, submitValue = ''} = props;\n  const {skin} = context;\n  const negativeColor = get('common.negative', skin);\n\n  const type = warning ? (\n    <div className={style.texts}>\n      <AlertIcon className={style.icon} style={{color: negativeColor}} />\n      <span className={style.warning}>{warning}</span>\n      <p className={style.description}>{description}</p>\n    </div>\n  ) : (\n    <div className={style.titleTexts}>\n      <span className={style.title}>{title}</span>\n      <p className={style.description}>{description}</p>\n    </div>\n  );\n\n  return (\n    <div className={style.wrapper}>\n      {type}\n      <Button\n        className={style.button}\n        type=\"link\"\n        download\n        href={href}\n        onClick={onClick}\n        submitValue={submitValue}\n      />\n    </div>\n  );\n};\n\nBrandDownloadBox.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBrandDownloadBox.propTypes = {\n  title: PropTypes.string,\n  warning: PropTypes.string,\n  description: PropTypes.string,\n  href: PropTypes.string,\n  onClick: PropTypes.func,\n  submitValue: PropTypes.string\n};\n\nexport default BrandDownloadBox;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;;;AAEA,MAAMA,gBAAgB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EAC3C,MAAM;IAACC,KAAK,GAAG,EAAT;IAAaC,OAAO,GAAG,EAAvB;IAA2BC,WAAW,GAAG,EAAzC;IAA6CC,IAAI,GAAG,EAApD;IAAwDC,OAAxD;IAAiEC,WAAW,GAAG;EAA/E,IAAqFP,KAA3F;EACA,MAAM;IAACQ;EAAD,IAASP,OAAf;EACA,MAAMQ,aAAa,GAAG,mBAAI,iBAAJ,EAAuBD,IAAvB,CAAtB;EAEA,MAAME,IAAI,GAAGP,OAAO,gBAClB;IAAK,SAAS,EAAEQ,cAAA,CAAMC;EAAtB,gBACE,6BAAC,yDAAD;IAAW,SAAS,EAAED,cAAA,CAAME,IAA5B;IAAkC,KAAK,EAAE;MAACC,KAAK,EAAEL;IAAR;EAAzC,EADF,eAEE;IAAM,SAAS,EAAEE,cAAA,CAAMR;EAAvB,GAAiCA,OAAjC,CAFF,eAGE;IAAG,SAAS,EAAEQ,cAAA,CAAMP;EAApB,GAAkCA,WAAlC,CAHF,CADkB,gBAOlB;IAAK,SAAS,EAAEO,cAAA,CAAMI;EAAtB,gBACE;IAAM,SAAS,EAAEJ,cAAA,CAAMT;EAAvB,GAA+BA,KAA/B,CADF,eAEE;IAAG,SAAS,EAAES,cAAA,CAAMP;EAApB,GAAkCA,WAAlC,CAFF,CAPF;EAaA,oBACE;IAAK,SAAS,EAAEO,cAAA,CAAMK;EAAtB,GACGN,IADH,eAEE,6BAAC,eAAD;IACE,SAAS,EAAEC,cAAA,CAAMM,MADnB;IAEE,IAAI,EAAC,MAFP;IAGE,QAAQ,MAHV;IAIE,IAAI,EAAEZ,IAJR;IAKE,OAAO,EAAEC,OALX;IAME,WAAW,EAAEC;EANf,EAFF,CADF;AAaD,CA/BD;;AAiCAR,gBAAgB,CAACmB,YAAjB,GAAgC;EAC9BV,IAAI,EAAEW,iBAAA,CAASC,iBAAT,CAA2BZ;AADH,CAAhC;AAIAT,gBAAgB,CAACsB,SAAjB,2CAA6B;EAC3BnB,KAAK,EAAEoB,kBAAA,CAAUC,MADU;EAE3BpB,OAAO,EAAEmB,kBAAA,CAAUC,MAFQ;EAG3BnB,WAAW,EAAEkB,kBAAA,CAAUC,MAHI;EAI3BlB,IAAI,EAAEiB,kBAAA,CAAUC,MAJW;EAK3BjB,OAAO,EAAEgB,kBAAA,CAAUE,IALQ;EAM3BjB,WAAW,EAAEe,kBAAA,CAAUC;AANI,CAA7B;eASexB,gB"}
+{"version":3,"file":"index.js","names":["BrandDownloadBox","props","context","title","warning","description","href","onClick","submitValue","skin","negativeColor","type","style","texts","icon","color","titleTexts","wrapper","button","download","backgroundColor","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","func"],"sources":["../../../src/molecule/brand-download-box/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {NovaSolidInterfaceFeedbackInterfaceAlertCircle as AlertIcon} from '@coorpacademy/nova-icons';\nimport {get} from 'lodash/fp';\nimport ButtonLink from '../../atom/button-link';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst BrandDownloadBox = (props, context) => {\n  const {title = '', warning = '', description = '', href = '', onClick, submitValue = ''} = props;\n  const {skin} = context;\n  const negativeColor = get('common.negative', skin);\n\n  const type = warning ? (\n    <div className={style.texts}>\n      <AlertIcon className={style.icon} style={{color: negativeColor}} />\n      <span className={style.warning}>{warning}</span>\n      <p className={style.description}>{description}</p>\n    </div>\n  ) : (\n    <div className={style.titleTexts}>\n      <span className={style.title}>{title}</span>\n      <p className={style.description}>{description}</p>\n    </div>\n  );\n\n  return (\n    <div className={style.wrapper}>\n      {type}\n      <ButtonLink\n        className={style.button}\n        link={{href, download: true}}\n        onClick={onClick}\n        label={submitValue}\n        customStyle={{backgroundColor: '#FFA000', color: 'white'}}\n      />\n    </div>\n  );\n};\n\nBrandDownloadBox.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBrandDownloadBox.propTypes = {\n  title: PropTypes.string,\n  warning: PropTypes.string,\n  description: PropTypes.string,\n  href: PropTypes.string,\n  onClick: PropTypes.func,\n  submitValue: PropTypes.string\n};\n\nexport default BrandDownloadBox;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;;;AAEA,MAAMA,gBAAgB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EAC3C,MAAM;IAACC,KAAK,GAAG,EAAT;IAAaC,OAAO,GAAG,EAAvB;IAA2BC,WAAW,GAAG,EAAzC;IAA6CC,IAAI,GAAG,EAApD;IAAwDC,OAAxD;IAAiEC,WAAW,GAAG;EAA/E,IAAqFP,KAA3F;EACA,MAAM;IAACQ;EAAD,IAASP,OAAf;EACA,MAAMQ,aAAa,GAAG,mBAAI,iBAAJ,EAAuBD,IAAvB,CAAtB;EAEA,MAAME,IAAI,GAAGP,OAAO,gBAClB;IAAK,SAAS,EAAEQ,cAAA,CAAMC;EAAtB,gBACE,6BAAC,yDAAD;IAAW,SAAS,EAAED,cAAA,CAAME,IAA5B;IAAkC,KAAK,EAAE;MAACC,KAAK,EAAEL;IAAR;EAAzC,EADF,eAEE;IAAM,SAAS,EAAEE,cAAA,CAAMR;EAAvB,GAAiCA,OAAjC,CAFF,eAGE;IAAG,SAAS,EAAEQ,cAAA,CAAMP;EAApB,GAAkCA,WAAlC,CAHF,CADkB,gBAOlB;IAAK,SAAS,EAAEO,cAAA,CAAMI;EAAtB,gBACE;IAAM,SAAS,EAAEJ,cAAA,CAAMT;EAAvB,GAA+BA,KAA/B,CADF,eAEE;IAAG,SAAS,EAAES,cAAA,CAAMP;EAApB,GAAkCA,WAAlC,CAFF,CAPF;EAaA,oBACE;IAAK,SAAS,EAAEO,cAAA,CAAMK;EAAtB,GACGN,IADH,eAEE,6BAAC,mBAAD;IACE,SAAS,EAAEC,cAAA,CAAMM,MADnB;IAEE,IAAI,EAAE;MAACZ,IAAD;MAAOa,QAAQ,EAAE;IAAjB,CAFR;IAGE,OAAO,EAAEZ,OAHX;IAIE,KAAK,EAAEC,WAJT;IAKE,WAAW,EAAE;MAACY,eAAe,EAAE,SAAlB;MAA6BL,KAAK,EAAE;IAApC;EALf,EAFF,CADF;AAYD,CA9BD;;AAgCAf,gBAAgB,CAACqB,YAAjB,GAAgC;EAC9BZ,IAAI,EAAEa,iBAAA,CAASC,iBAAT,CAA2Bd;AADH,CAAhC;AAIAT,gBAAgB,CAACwB,SAAjB,2CAA6B;EAC3BrB,KAAK,EAAEsB,kBAAA,CAAUC,MADU;EAE3BtB,OAAO,EAAEqB,kBAAA,CAAUC,MAFQ;EAG3BrB,WAAW,EAAEoB,kBAAA,CAAUC,MAHI;EAI3BpB,IAAI,EAAEmB,kBAAA,CAAUC,MAJW;EAK3BnB,OAAO,EAAEkB,kBAAA,CAAUE,IALQ;EAM3BnB,WAAW,EAAEiB,kBAAA,CAAUC;AANI,CAA7B;eASe1B,gB"}

package/lib/molecule/brand-download-box/style.css

@@ -19,10 +19,6 @@
   width: 80%;
 }
 
-.wrapper > .button {
-  background-color: dark;
-}
-
 .icon {
   width: 32px;
   height: 32px;
@@ -47,13 +43,18 @@
   font-size: 13px;
 }
 
+.button {
+  width: 200px;
+  flex-shrink: 0;
+  box-sizing: border-box;
+}
+
 @media mobile {
   .wrapper {
     display: block;
   }
 
   .button {
-    display: block;
     width: 100%;
   }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/brand-form-group/index.js"],"names":[],"mappings":";AAmHA,yDAuBC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/brand-form-group/index.js"],"names":[],"mappings":";AA6HA,yDAuBC"}

package/lib/molecule/brand-form-group/index.js

@@ -140,7 +140,18 @@ const buildInput = field => {
 
     case 'button':
     case 'link':
-      return /*#__PURE__*/_react.default.createElement(_button.default, field);
+      return /*#__PURE__*/_react.default.createElement(_buttonLink.default, _extends({}, field, {
+        type: "primary",
+        label: field.submitValue,
+        link: field.href ? {
+          href: field.href,
+          target: field.target,
+          download: field.download
+        } : null,
+        customStyle: {
+          width: 'fit-content'
+        }
+      }));
 
     case 'buttonLink':
       return /*#__PURE__*/_react.default.createElement(_buttonLink.default, _extends({}, field, {