@coorpacademy/components 11.11.16-alpha.11 → 11.11.16-alpha.12

package/es/atom/drag-and-drop/index.d.ts

@@ -18,8 +18,6 @@ declare class DragAndDrop extends React.Component<any, any, any> {
         error: PropTypes.Requireable<string>;
         buttonAriaLabel: PropTypes.Requireable<string>;
         errorButtonLabel: PropTypes.Requireable<string>;
-        pdfButtonLabel: PropTypes.Requireable<string>;
-        pdfButtonAriaLabel: PropTypes.Requireable<string>;
     };
     constructor(props: any);
     state: {

package/es/atom/drag-and-drop/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/drag-and-drop/index.js"],"names":[],"mappings":";AAgBA;IACE;;;;;;;;;;;;;;;;;;;;MAoBE;IAEF,wBASC;IANC;;MAEC;IAMH,wBAIC;IAED,uBAIC;IAED,sBAsKC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/drag-and-drop/index.js"],"names":[],"mappings":";AAgBA;IACE;;;;;;;;;;;;;;;;;;MAkBE;IAEF,wBASC;IANC;;MAEC;IAMH,wBAIC;IAED,uBAIC;IAED,sBAmJC;CACF"}

package/es/atom/drag-and-drop/index.js

@@ -53,9 +53,7 @@ class DragAndDrop extends React.Component {
       error = '',
       buttonAriaLabel = '',
       errorButtonLabel = '',
-      disabled = false,
-      pdfButtonLabel,
-      pdfButtonAriaLabel
+      disabled = false
     } = this.props;
     const {
       dragging
@@ -76,26 +74,6 @@ class DragAndDrop extends React.Component {
         src: previewContent.src,
         type: "video/*"
       }));
-    } else if (previewContent && previewContent.type === 'pdf') {
-      previewView = /*#__PURE__*/React.createElement("div", {
-        className: style.previewPdf
-      }, /*#__PURE__*/React.createElement("p", {
-        className: style.previewLabelPdf
-      }, previewLabel), /*#__PURE__*/React.createElement(Button, {
-        type: "secondary",
-        link: {
-          href: previewContent.src,
-          target: '_blank',
-          download: false
-        },
-        label: pdfButtonLabel,
-        "aria-label": pdfButtonAriaLabel,
-        "data-name": "default-button-pdf",
-        icon: {
-          position: 'left',
-          type: 'pdf'
-        }
-      }));
     } else if (loading) {
       previewView = /*#__PURE__*/React.createElement("div", {
         className: style.loaderWrapper
@@ -201,9 +179,7 @@ DragAndDrop.propTypes = process.env.NODE_ENV !== "production" ? {
   onReset: PropTypes.func,
   error: PropTypes.string,
   buttonAriaLabel: PropTypes.string,
-  errorButtonLabel: PropTypes.string,
-  pdfButtonLabel: PropTypes.string,
-  pdfButtonAriaLabel: PropTypes.string
+  errorButtonLabel: PropTypes.string
 } : {};
 export default DragAndDrop;
 //# sourceMappingURL=index.js.map

package/es/atom/drag-and-drop/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","NovaSolidStatusClose","Close","NovaSolidFilesBasicFileUpload2","FileUploadIcon","NovaSolidFilesBasicFileBlock2","FileUploadBlockedIcon","classnames","Loader","Button","getClassState","style","constantNull","DragAndDrop","Component","constructor","props","state","dragging","handleDragStart","bind","handleDragStop","setState","render","idBox","children","title","description","uploadLabel","previewLabel","previewContent","loading","modified","onReset","error","buttonAriaLabel","errorButtonLabel","disabled","pdfButtonLabel","pdfButtonAriaLabel","previewView","type","preview","src","previewPdf","previewLabelPdf","href","target","download","position","loaderWrapper","loadingCancel","closeIcon","loader","loaderText","resetContent","resetUploadWrapper","resetSrcLabel","label","buildButton","defaultButtonProps","icon","button","previewContainer","modifiedPreviewContainer","inputWrapper","modifiedInputWrapper","errorInputWrapper","wrapper","infosContainer","iconError","dragAndDropLabel","errorMessage","propTypes","string","shape","bool","func"],"sources":["../../../src/atom/drag-and-drop/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {uniqueId, constant, isEmpty} from 'lodash/fp';\nimport {\n  NovaSolidStatusClose as Close,\n  NovaSolidFilesBasicFileUpload2 as FileUploadIcon,\n  NovaSolidFilesBasicFileBlock2 as FileUploadBlockedIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Loader from '../loader';\nimport Button from '../button-link';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst constantNull = constant(null);\n\nclass DragAndDrop extends React.Component {\n  static propTypes = {\n    title: PropTypes.string,\n    description: PropTypes.string,\n    uploadLabel: PropTypes.string,\n    previewLabel: PropTypes.string,\n    previewContent: PropTypes.shape({\n      type: PropTypes.string,\n      src: PropTypes.string,\n      label: PropTypes.string\n    }),\n    loading: PropTypes.bool,\n    modified: PropTypes.bool,\n    disabled: PropTypes.bool,\n    children: PropTypes.func,\n    onReset: PropTypes.func,\n    error: PropTypes.string,\n    buttonAriaLabel: PropTypes.string,\n    errorButtonLabel: PropTypes.string,\n    pdfButtonLabel: PropTypes.string,\n    pdfButtonAriaLabel: PropTypes.string\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      dragging: false\n    };\n\n    this.handleDragStart = this.handleDragStart.bind(this);\n    this.handleDragStop = this.handleDragStop.bind(this);\n  }\n\n  handleDragStart() {\n    this.setState({\n      dragging: true\n    });\n  }\n\n  handleDragStop() {\n    this.setState({\n      dragging: false\n    });\n  }\n\n  render() {\n    const idBox = uniqueId('drop-box-');\n    const {\n      children = constantNull,\n      title,\n      description,\n      uploadLabel,\n      previewLabel = '',\n      previewContent,\n      loading = false,\n      modified = false,\n      onReset = null,\n      error = '',\n      buttonAriaLabel = '',\n      errorButtonLabel = '',\n      disabled = false,\n      pdfButtonLabel,\n      pdfButtonAriaLabel\n    } = this.props;\n    const {dragging} = this.state;\n\n    let previewView = null;\n\n    if (previewContent && previewContent.type === 'image') {\n      previewView = (\n        <div className={style.preview}>\n          <img src={previewContent.src} />\n        </div>\n      );\n    } else if (previewContent && previewContent.type === 'video') {\n      previewView = (\n        <div className={style.preview}>\n          <video controls src={previewContent.src} type=\"video/*\" />\n        </div>\n      );\n    } else if (previewContent && previewContent.type === 'pdf') {\n      previewView = (\n        <div className={style.previewPdf}>\n          <p className={style.previewLabelPdf}>{previewLabel}</p>\n          <Button\n            type=\"secondary\"\n            link={{href: previewContent.src, target: '_blank', download: false}}\n            label={pdfButtonLabel}\n            aria-label={pdfButtonAriaLabel}\n            data-name=\"default-button-pdf\"\n            icon={{\n              position: 'left',\n              type: 'pdf'\n            }}\n          />\n        </div>\n      );\n    } else if (loading) {\n      previewView = (\n        <div className={style.loaderWrapper}>\n          <div className={style.loadingCancel}>\n            <Close\n              data-name=\"reset-content-icon\"\n              height={12}\n              width={12}\n              className={style.closeIcon}\n              onClick={onReset}\n            />\n          </div>\n          <div className={style.loader}>\n            <Loader theme=\"coorpmanager\" />\n          </div>\n          <span className={style.loaderText}>Uploading</span>\n        </div>\n      );\n    } else {\n      previewView = <span>{previewLabel}</span>;\n    }\n\n    const resetContent =\n      previewContent && previewContent.src ? (\n        <div className={classnames(style.resetUploadWrapper, disabled && style.disabled)}>\n          <div className={style.resetSrcLabel}>\n            {previewContent.label ? previewContent.label : previewContent.src}\n          </div>\n          {onReset ? (\n            <Close\n              data-name=\"reset-content-icon\"\n              height={12}\n              width={12}\n              className={style.closeIcon}\n              onClick={onReset}\n            />\n          ) : null}\n        </div>\n      ) : null;\n\n    const buildButton = () => {\n      const defaultButtonProps = {\n        label: uploadLabel,\n        'aria-label': buttonAriaLabel,\n        'data-name': 'default-button',\n        icon: {\n          position: 'left',\n          type: 'folders'\n        }\n      };\n      if (dragging) {\n        return null;\n      } else if (error) {\n        return <Button {...defaultButtonProps} label={errorButtonLabel} icon={{}} />;\n      } else {\n        return <Button {...defaultButtonProps} />;\n      }\n    };\n\n    const button = buildButton(dragging, error);\n\n    const previewContainer = getClassState(\n      style.previewContainer,\n      style.modifiedPreviewContainer,\n      null,\n      modified,\n      error\n    );\n    const inputWrapper = getClassState(\n      style.inputWrapper,\n      style.modifiedInputWrapper,\n      style.errorInputWrapper,\n      modified,\n      error\n    );\n\n    return (\n      <div className={style.wrapper} data-name=\"drag-and-drop-wrapper\">\n        <div className={style.title}>{title}</div>\n        {!isEmpty(previewContent) || loading ? (\n          <div className={classnames(previewContainer, disabled && style.disabled)}>\n            {previewView}\n          </div>\n        ) : (\n          <div\n            className={classnames(\n              dragging ? style.dragging : inputWrapper,\n              disabled && style.disabled\n            )}\n            id={idBox}\n            data-name=\"drag-and-drop-box\"\n          >\n            <div className={style.infosContainer}>\n              {error ? (\n                <FileUploadBlockedIcon className={style.iconError} />\n              ) : (\n                <FileUploadIcon className={style.icon} />\n              )}\n              {description ? <div className={style.description}>{description}</div> : null}\n              {error ? null : <div className={style.dragAndDropLabel}>{'Drag & Drop here'}</div>}\n            </div>\n            {button}\n            <div>{children(this.handleDragStart, this.handleDragStop)}</div>\n          </div>\n        )}\n        {error ? (\n          <span className={classnames(style.errorMessage, disabled && style.disabled)}>\n            {error}\n          </span>\n        ) : (\n          resetContent\n        )}\n      </div>\n    );\n  }\n}\n\nexport default DragAndDrop;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","PropTypes","NovaSolidStatusClose","Close","NovaSolidFilesBasicFileUpload2","FileUploadIcon","NovaSolidFilesBasicFileBlock2","FileUploadBlockedIcon","classnames","Loader","Button","getClassState","style","constantNull","DragAndDrop","Component","constructor","props","state","dragging","handleDragStart","bind","handleDragStop","setState","render","idBox","children","title","description","uploadLabel","previewLabel","previewContent","loading","modified","onReset","error","buttonAriaLabel","errorButtonLabel","disabled","previewView","type","preview","src","loaderWrapper","loadingCancel","closeIcon","loader","loaderText","resetContent","resetUploadWrapper","resetSrcLabel","label","buildButton","defaultButtonProps","icon","position","button","previewContainer","modifiedPreviewContainer","inputWrapper","modifiedInputWrapper","errorInputWrapper","wrapper","infosContainer","iconError","dragAndDropLabel","errorMessage","propTypes","string","shape","bool","func"],"sources":["../../../src/atom/drag-and-drop/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {uniqueId, constant, isEmpty} from 'lodash/fp';\nimport {\n  NovaSolidStatusClose as Close,\n  NovaSolidFilesBasicFileUpload2 as FileUploadIcon,\n  NovaSolidFilesBasicFileBlock2 as FileUploadBlockedIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Loader from '../loader';\nimport Button from '../button-link';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst constantNull = constant(null);\n\nclass DragAndDrop extends React.Component {\n  static propTypes = {\n    title: PropTypes.string,\n    description: PropTypes.string,\n    uploadLabel: PropTypes.string,\n    previewLabel: PropTypes.string,\n    previewContent: PropTypes.shape({\n      type: PropTypes.string,\n      src: PropTypes.string,\n      label: PropTypes.string\n    }),\n    loading: PropTypes.bool,\n    modified: PropTypes.bool,\n    disabled: PropTypes.bool,\n    children: PropTypes.func,\n    onReset: PropTypes.func,\n    error: PropTypes.string,\n    buttonAriaLabel: PropTypes.string,\n    errorButtonLabel: PropTypes.string\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      dragging: false\n    };\n\n    this.handleDragStart = this.handleDragStart.bind(this);\n    this.handleDragStop = this.handleDragStop.bind(this);\n  }\n\n  handleDragStart() {\n    this.setState({\n      dragging: true\n    });\n  }\n\n  handleDragStop() {\n    this.setState({\n      dragging: false\n    });\n  }\n\n  render() {\n    const idBox = uniqueId('drop-box-');\n    const {\n      children = constantNull,\n      title,\n      description,\n      uploadLabel,\n      previewLabel = '',\n      previewContent,\n      loading = false,\n      modified = false,\n      onReset = null,\n      error = '',\n      buttonAriaLabel = '',\n      errorButtonLabel = '',\n      disabled = false\n    } = this.props;\n    const {dragging} = this.state;\n\n    let previewView = null;\n\n    if (previewContent && previewContent.type === 'image') {\n      previewView = (\n        <div className={style.preview}>\n          <img src={previewContent.src} />\n        </div>\n      );\n    } else if (previewContent && previewContent.type === 'video') {\n      previewView = (\n        <div className={style.preview}>\n          <video controls src={previewContent.src} type=\"video/*\" />\n        </div>\n      );\n    } else if (loading) {\n      previewView = (\n        <div className={style.loaderWrapper}>\n          <div className={style.loadingCancel}>\n            <Close\n              data-name=\"reset-content-icon\"\n              height={12}\n              width={12}\n              className={style.closeIcon}\n              onClick={onReset}\n            />\n          </div>\n          <div className={style.loader}>\n            <Loader theme=\"coorpmanager\" />\n          </div>\n          <span className={style.loaderText}>Uploading</span>\n        </div>\n      );\n    } else {\n      previewView = <span>{previewLabel}</span>;\n    }\n\n    const resetContent =\n      previewContent && previewContent.src ? (\n        <div className={classnames(style.resetUploadWrapper, disabled && style.disabled)}>\n          <div className={style.resetSrcLabel}>\n            {previewContent.label ? previewContent.label : previewContent.src}\n          </div>\n          {onReset ? (\n            <Close\n              data-name=\"reset-content-icon\"\n              height={12}\n              width={12}\n              className={style.closeIcon}\n              onClick={onReset}\n            />\n          ) : null}\n        </div>\n      ) : null;\n\n    const buildButton = () => {\n      const defaultButtonProps = {\n        label: uploadLabel,\n        'aria-label': buttonAriaLabel,\n        'data-name': 'default-button',\n        icon: {\n          position: 'left',\n          type: 'folders'\n        }\n      };\n      if (dragging) {\n        return null;\n      } else if (error) {\n        return <Button {...defaultButtonProps} label={errorButtonLabel} icon={{}} />;\n      } else {\n        return <Button {...defaultButtonProps} />;\n      }\n    };\n\n    const button = buildButton(dragging, error);\n\n    const previewContainer = getClassState(\n      style.previewContainer,\n      style.modifiedPreviewContainer,\n      null,\n      modified,\n      error\n    );\n    const inputWrapper = getClassState(\n      style.inputWrapper,\n      style.modifiedInputWrapper,\n      style.errorInputWrapper,\n      modified,\n      error\n    );\n\n    return (\n      <div className={style.wrapper} data-name=\"drag-and-drop-wrapper\">\n        <div className={style.title}>{title}</div>\n        {!isEmpty(previewContent) || loading ? (\n          <div className={classnames(previewContainer, disabled && style.disabled)}>\n            {previewView}\n          </div>\n        ) : (\n          <div\n            className={classnames(\n              dragging ? style.dragging : inputWrapper,\n              disabled && style.disabled\n            )}\n            id={idBox}\n            data-name=\"drag-and-drop-box\"\n          >\n            <div className={style.infosContainer}>\n              {error ? (\n                <FileUploadBlockedIcon className={style.iconError} />\n              ) : (\n                <FileUploadIcon className={style.icon} />\n              )}\n              {description ? <div className={style.description}>{description}</div> : null}\n              {error ? null : <div className={style.dragAndDropLabel}>{'Drag & Drop here'}</div>}\n            </div>\n            {button}\n            <div>{children(this.handleDragStart, this.handleDragStop)}</div>\n          </div>\n        )}\n        {error ? (\n          <span className={classnames(style.errorMessage, disabled && style.disabled)}>\n            {error}\n          </span>\n        ) : (\n          resetContent\n        )}\n      </div>\n    );\n  }\n}\n\nexport default DragAndDrop;\n"],"mappings":"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"}

package/es/atom/drag-and-drop/style.css

@@ -78,31 +78,12 @@
   background-color: white;
 }
 
-.preview img,
-video {
+.preview img, video {
   max-width: 100%;
   max-height: 100%;
   margin: auto;
 }
 
-.previewPdf {
-  composes: preview;
-  min-height: 150px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-evenly;
-}
-
-.previewLabelPdf {
-  text-align: center;
-  font-family: "Gilroy";
-  color: cm_grey_300;
-  padding: 0px 4px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 90%;
-  white-space: nowrap;
-}
 .infosContainer {
   width: 100%;
   height: 100%;
@@ -171,7 +152,7 @@ video {
   align-items: center;
   justify-content: space-between;
   margin-top: 16px;
-  padding: 8px 14px 8px 1px;
+  padding: 4px 8px;
   font-size: 12px;
   font-weight: 400;
   position: relative;
@@ -183,6 +164,9 @@ video {
   text-overflow: ellipsis;
   white-space: nowrap;
   flex-wrap: nowrap;
+  position: absolute;
+  left: 0;
+  right: 15px;
 }
 
 .closeIcon {

package/es/atom/image-upload/index.d.ts

@@ -1,5 +1,5 @@
 export default ImageUpload;
-declare function ImageUpload({ title, description, previewLabel, previewContent, uploadLabel, loading, modified, disabled, onChange, onReset, name, labelLink, labelButtonLink, hrefLink, imageTypes, error, buttonAriaLabel, errorButtonLabel, pdfButtonLabel, pdfButtonAriaLabel }: {
+declare function ImageUpload({ title, description, previewLabel, previewContent, uploadLabel, loading, modified, disabled, onChange, onReset, name, labelLink, labelButtonLink, hrefLink, imageTypes, error, buttonAriaLabel, errorButtonLabel }: {
     title: any;
     description: any;
     previewLabel: any;
@@ -18,8 +18,6 @@ declare function ImageUpload({ title, description, previewLabel, previewContent,
     error?: string | undefined;
     buttonAriaLabel: any;
     errorButtonLabel: any;
-    pdfButtonLabel: any;
-    pdfButtonAriaLabel: any;
 }): JSX.Element;
 declare namespace ImageUpload {
     const propTypes: {
@@ -45,8 +43,6 @@ declare namespace ImageUpload {
         modified: PropTypes.Requireable<boolean>;
         disabled: PropTypes.Requireable<boolean>;
         children: PropTypes.Requireable<(...args: any[]) => any>;
-        pdfButtonLabel: PropTypes.Requireable<string>;
-        pdfButtonAriaLabel: PropTypes.Requireable<string>;
     };
 }
 import PropTypes from "prop-types";

package/es/atom/image-upload/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/image-upload/index.js"],"names":[],"mappings":";AAQA;;;;;;;;;;;;;;;;;;;;;gBAkFC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/image-upload/index.js"],"names":[],"mappings":";AAQA;;;;;;;;;;;;;;;;;;;gBAmFC"}

package/es/atom/image-upload/index.js

@@ -1,4 +1,7 @@
 import _isNil from "lodash/fp/isNil";
+import _pipe from "lodash/fp/pipe";
+import _map from "lodash/fp/map";
+import _join from "lodash/fp/join";
 
 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); }
 
@@ -21,22 +24,23 @@ const ImageUpload = ({
   onChange,
   onReset = null,
   name,
+  // See ImagePropType for accepted values
   labelLink,
   labelButtonLink,
   hrefLink,
-  // See ImagePropType for accepted values
   imageTypes = ['*'],
   error = '',
   buttonAriaLabel,
-  errorButtonLabel,
-  pdfButtonLabel,
-  pdfButtonAriaLabel
+  errorButtonLabel
 }) => {
   const handleReset = useCallback(e => {
     if (_isNil(onReset)) return;
     e.preventDefault();
     return onReset(e);
   }, [onReset]);
+
+  const acceptedImages = _pipe(_map(t => `image/${t}`), _join(','))(imageTypes);
+
   const linkCustomStyle = {
     width: '40px',
     color: 'red'
@@ -53,13 +57,11 @@ const ImageUpload = ({
     error: error,
     disabled: disabled,
     buttonAriaLabel: buttonAriaLabel,
-    errorButtonLabel: errorButtonLabel,
-    pdfButtonLabel: pdfButtonLabel,
-    pdfButtonAriaLabel: pdfButtonAriaLabel
+    errorButtonLabel: errorButtonLabel
   }, (onDragStart, onDragStop) => /*#__PURE__*/React.createElement("input", {
     type: "file",
     name: name,
-    accept: imageTypes,
+    accept: acceptedImages,
     disabled: loading || disabled,
     className: style.input,
     onChange: onChange,

package/es/atom/image-upload/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","PropTypes","DragAndDrop","ImagePropType","Link","style","ImageUpload","title","description","previewLabel","previewContent","uploadLabel","loading","modified","disabled","onChange","onReset","name","labelLink","labelButtonLink","hrefLink","imageTypes","error","buttonAriaLabel","errorButtonLabel","pdfButtonLabel","pdfButtonAriaLabel","handleReset","e","preventDefault","linkCustomStyle","width","color","onDragStart","onDragStop","input","templateLink","href","download","propTypes","string","func","arrayOf"],"sources":["../../../src/atom/image-upload/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {isNil} from 'lodash/fp';\nimport DragAndDrop from '../drag-and-drop';\nimport {ImagePropType} from '../../util/proptypes';\nimport Link from '../button-link';\nimport style from './style.css';\n\nconst ImageUpload = ({\n  title,\n  description,\n  previewLabel,\n  previewContent,\n  uploadLabel,\n  loading,\n  modified,\n  disabled = false,\n  onChange,\n  onReset = null,\n  name,\n  labelLink,\n  labelButtonLink,\n  hrefLink,\n  // See ImagePropType for accepted values\n  imageTypes = ['*'],\n  error = '',\n  buttonAriaLabel,\n  errorButtonLabel,\n  pdfButtonLabel,\n  pdfButtonAriaLabel\n}) => {\n  const handleReset = useCallback(\n    e => {\n      if (isNil(onReset)) return;\n      e.preventDefault();\n      return onReset(e);\n    },\n    [onReset]\n  );\n\n  const linkCustomStyle = {\n    width: '40px',\n    color: 'red'\n  };\n\n  return (\n    <div>\n      <DragAndDrop\n        title={title}\n        description={description}\n        previewLabel={previewLabel}\n        previewContent={previewContent}\n        uploadLabel={uploadLabel}\n        loading={loading}\n        modified={modified}\n        onReset={handleReset}\n        error={error}\n        disabled={disabled}\n        buttonAriaLabel={buttonAriaLabel}\n        errorButtonLabel={errorButtonLabel}\n        pdfButtonLabel={pdfButtonLabel}\n        pdfButtonAriaLabel={pdfButtonAriaLabel}\n      >\n        {(onDragStart, onDragStop) => (\n          <input\n            type=\"file\"\n            name={name}\n            accept={imageTypes}\n            disabled={loading || disabled}\n            className={style.input}\n            onChange={onChange}\n            onDragEnter={onDragStart}\n            onDrop={onDragStop}\n            onDragLeave={onDragStop}\n          />\n        )}\n      </DragAndDrop>\n      {labelLink && hrefLink ? (\n        <div className={style.templateLink}>\n          {labelLink}\n          <Link\n            type=\"text\"\n            customStyle={linkCustomStyle}\n            link={{href: hrefLink, download: true}}\n            label={labelButtonLink}\n          />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nImageUpload.propTypes = {\n  ...DragAndDrop.propTypes,\n  name: PropTypes.string,\n  onChange: PropTypes.func,\n  onReset: PropTypes.func,\n  imageTypes: PropTypes.arrayOf(ImagePropType),\n  error: PropTypes.string,\n  buttonAriaLabel: PropTypes.string,\n  errorButtonLabel: PropTypes.string,\n  labelLink: PropTypes.string,\n  hrefLink: PropTypes.string\n};\n\nexport default ImageUpload;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useCallback","PropTypes","DragAndDrop","ImagePropType","Link","style","ImageUpload","title","description","previewLabel","previewContent","uploadLabel","loading","modified","disabled","onChange","onReset","name","labelLink","labelButtonLink","hrefLink","imageTypes","error","buttonAriaLabel","errorButtonLabel","handleReset","e","preventDefault","acceptedImages","t","linkCustomStyle","width","color","onDragStart","onDragStop","input","templateLink","href","download","propTypes","string","func","arrayOf"],"sources":["../../../src/atom/image-upload/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {join, map, pipe, isNil} from 'lodash/fp';\nimport DragAndDrop from '../drag-and-drop';\nimport {ImagePropType} from '../../util/proptypes';\nimport Link from '../button-link';\nimport style from './style.css';\n\nconst ImageUpload = ({\n  title,\n  description,\n  previewLabel,\n  previewContent,\n  uploadLabel,\n  loading,\n  modified,\n  disabled = false,\n  onChange,\n  onReset = null,\n  name,\n  // See ImagePropType for accepted values\n  labelLink,\n  labelButtonLink,\n  hrefLink,\n  imageTypes = ['*'],\n  error = '',\n  buttonAriaLabel,\n  errorButtonLabel\n}) => {\n  const handleReset = useCallback(\n    e => {\n      if (isNil(onReset)) return;\n      e.preventDefault();\n      return onReset(e);\n    },\n    [onReset]\n  );\n\n  const acceptedImages = pipe(\n    map(t => `image/${t}`),\n    join(',')\n  )(imageTypes);\n\n  const linkCustomStyle = {\n    width: '40px',\n    color: 'red'\n  };\n\n  return (\n    <div>\n      <DragAndDrop\n        title={title}\n        description={description}\n        previewLabel={previewLabel}\n        previewContent={previewContent}\n        uploadLabel={uploadLabel}\n        loading={loading}\n        modified={modified}\n        onReset={handleReset}\n        error={error}\n        disabled={disabled}\n        buttonAriaLabel={buttonAriaLabel}\n        errorButtonLabel={errorButtonLabel}\n      >\n        {(onDragStart, onDragStop) => (\n          <input\n            type=\"file\"\n            name={name}\n            accept={acceptedImages}\n            disabled={loading || disabled}\n            className={style.input}\n            onChange={onChange}\n            onDragEnter={onDragStart}\n            onDrop={onDragStop}\n            onDragLeave={onDragStop}\n          />\n        )}\n      </DragAndDrop>\n      {labelLink && hrefLink ? (\n        <div className={style.templateLink}>\n          {labelLink}\n          <Link\n            type=\"text\"\n            customStyle={linkCustomStyle}\n            link={{href: hrefLink, download: true}}\n            label={labelButtonLink}\n          />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nImageUpload.propTypes = {\n  ...DragAndDrop.propTypes,\n  name: PropTypes.string,\n  onChange: PropTypes.func,\n  onReset: PropTypes.func,\n  imageTypes: PropTypes.arrayOf(ImagePropType),\n  error: PropTypes.string,\n  buttonAriaLabel: PropTypes.string,\n  errorButtonLabel: PropTypes.string,\n  labelLink: PropTypes.string,\n  hrefLink: PropTypes.string\n};\n\nexport default ImageUpload;\n"],"mappings":"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"}

package/es/atom/input-html/index.d.ts

@@ -1,27 +1,38 @@
 export default InputHtml;
-declare class InputHtml extends React.Component<any, any, any> {
-    static propTypes: {
-        title: PropTypes.Requireable<string>;
-        placeholder: PropTypes.Requireable<string>;
-        disabled: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<string>;
-        error: PropTypes.Requireable<string>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        description: PropTypes.Requireable<string>;
-    };
-    static getDerivedStateFromProps(props: any, state: any): {
-        text: any;
-        preview: any;
-    } | null;
-    constructor(props: any, context: any);
-    state: {
-        text: any;
-        preview: boolean;
-    };
-    handleChange(e: any): void;
-    handlePreview(e: any): void;
-    render(): JSX.Element;
+declare function InputHtml(props: any, legacyContext: any): JSX.Element;
+declare namespace InputHtml {
+    namespace propTypes {
+        const title: PropTypes.Requireable<string>;
+        const placeholder: PropTypes.Requireable<string>;
+        const disabled: PropTypes.Requireable<boolean>;
+        const value: PropTypes.Requireable<string>;
+        const error: PropTypes.Requireable<string>;
+        const onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        const description: PropTypes.Requireable<string>;
+    }
+    namespace contextTypes {
+        const skin: PropTypes.Requireable<PropTypes.InferProps<{
+            common: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            images: PropTypes.Requireable<PropTypes.InferProps<{
+                'logo-mobile': PropTypes.Requireable<any>;
+                logo: PropTypes.Requireable<any>;
+                'logo-email': PropTypes.Requireable<any>;
+                login: PropTypes.Requireable<any>;
+            }>>;
+            icons: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            mod: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            courses: PropTypes.Requireable<any[]>;
+            texts: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
+    }
 }
-import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/es/atom/input-html/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/index.js"],"names":[],"mappings":";AAUA;IACE;;;;;;;;MAQE;IAEF;;;aASC;IAED,sCAQC;IANC;;;MAGC;IAKH,2BAQC;IAED,4BAMC;IAED,sBAmCC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/index.js"],"names":[],"mappings":";AAWA,wEA4DC"}

package/es/atom/input-html/index.js

@@ -1,107 +1,73 @@
-import _isUndefined from "lodash/fp/isUndefined";
 import _getOr from "lodash/fp/getOr";
 import _noop from "lodash/fp/noop";
-import React from 'react';
+import React, { useCallback, useState } from 'react';
 import PropTypes from 'prop-types';
 import { NovaLineBusinessCircleView as PreviewIcon, NovaLineContentEditionPencil2 as PencilIcon } from '@coorpacademy/nova-icons';
+import Provider, { GetSkinFromContext } from '../provider';
 import InputPreview from './input-preview';
 import style from './style.css';
 
-class InputHtml extends React.Component {
-  static getDerivedStateFromProps(props, state) {
-    const {
-      value
-    } = props;
-    if (_isUndefined(value)) return null;
-    return {
-      text: value,
-      preview: state.preview
-    };
-  }
-
-  constructor(props, context) {
-    super(props);
-    this.state = {
-      text: _getOr('', 'value', props),
-      preview: true
-    };
-    this.handleChange = this.handleChange.bind(this);
-    this.handlePreview = this.handlePreview.bind(this);
-  }
-
-  handleChange(e) {
-    const {
-      onChange = _noop
-    } = this.props;
-    const value = e.target.value;
-    this.setState(state => ({
-      text: value,
-      preview: state.preview
-    }));
-    onChange(value);
-  }
-
-  handlePreview(e) {
+const InputHtml = (props, legacyContext) => {
+  const {
+    value = '',
+    onChange = _noop
+  } = props;
+  const [text, setText] = useState(value);
+  const [preview, setPreview] = useState(true);
+  const handleChange = useCallback(e => {
+    const _value = e.target.value;
+    setText(_value);
+    onChange(_value);
+  }, [onChange]);
+  const handlePreview = useCallback(e => {
     e.preventDefault();
-    this.setState(state => ({
-      text: state.text,
-      preview: !state.preview
-    }));
-  }
-
-  render() {
-    const {
-      skin
-    } = this.context;
-
-    const mediumColor = _getOr('#999999', 'common.medium', skin);
+    setPreview(!preview);
+  }, [preview, setPreview]);
+  const skin = GetSkinFromContext(legacyContext);
 
-    const {
-      title,
-      placeholder,
-      error,
-      description,
-      disabled
-    } = this.props;
-    const {
-      text,
-      preview
-    } = this.state;
-    const className = error ? style.error : style.default;
-    const iconContent = !preview ? /*#__PURE__*/React.createElement(PreviewIcon, {
-      style: {
-        color: mediumColor
-      },
-      height: 16
-    }) : /*#__PURE__*/React.createElement(PencilIcon, {
-      style: {
-        color: mediumColor
-      },
-      height: 16
-    });
-    return /*#__PURE__*/React.createElement("div", {
-      className: className
-    }, /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("span", {
-      className: style.title
-    }, `${title} `), /*#__PURE__*/React.createElement("div", {
-      className: style.contentWrapper
-    }, /*#__PURE__*/React.createElement(InputPreview, {
-      title: title,
-      text: text,
-      placeholder: placeholder,
-      onChange: this.handleChange,
-      disabled: disabled,
-      preview: preview,
-      className: style.input
-    })), /*#__PURE__*/React.createElement("span", {
-      className: style.toggle,
-      onClick: this.handlePreview
-    }, iconContent)), /*#__PURE__*/React.createElement("div", {
-      className: style.description
-    }, description));
-  }
+  const mediumColor = _getOr('#999999', 'common.medium', skin);
 
-}
+  const {
+    title,
+    placeholder,
+    error,
+    description,
+    disabled
+  } = props;
+  const className = error ? style.error : style.default;
+  const iconContent = !preview ? /*#__PURE__*/React.createElement(PreviewIcon, {
+    style: {
+      color: mediumColor
+    },
+    height: 16
+  }) : /*#__PURE__*/React.createElement(PencilIcon, {
+    style: {
+      color: mediumColor
+    },
+    height: 16
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("span", {
+    className: style.title
+  }, `${title} `), /*#__PURE__*/React.createElement("div", {
+    className: style.contentWrapper
+  }, /*#__PURE__*/React.createElement(InputPreview, {
+    title: title,
+    text: text,
+    placeholder: placeholder,
+    onChange: handleChange,
+    disabled: disabled,
+    preview: preview,
+    className: style.input
+  })), /*#__PURE__*/React.createElement("span", {
+    "data-testid": preview ? 'pencil-icon' : 'preview-icon',
+    className: style.toggle,
+    onClick: handlePreview
+  }, iconContent)), /*#__PURE__*/React.createElement("div", {
+    className: style.description
+  }, description));
+};
 
 InputHtml.propTypes = process.env.NODE_ENV !== "production" ? {
   title: PropTypes.string,
@@ -112,5 +78,8 @@ InputHtml.propTypes = process.env.NODE_ENV !== "production" ? {
   onChange: PropTypes.func,
   description: PropTypes.string
 } : {};
+InputHtml.contextTypes = {
+  skin: Provider.childContextTypes.skin
+};
 export default InputHtml;
 //# sourceMappingURL=index.js.map

package/es/atom/input-html/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","NovaLineBusinessCircleView","PreviewIcon","NovaLineContentEditionPencil2","PencilIcon","InputPreview","style","InputHtml","Component","getDerivedStateFromProps","props","state","value","text","preview","constructor","context","handleChange","bind","handlePreview","e","onChange","target","setState","preventDefault","render","skin","mediumColor","title","placeholder","error","description","disabled","className","default","iconContent","color","contentWrapper","input","toggle","propTypes","string","bool","func"],"sources":["../../../src/atom/input-html/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr, isUndefined} from 'lodash/fp';\nimport {\n  NovaLineBusinessCircleView as PreviewIcon,\n  NovaLineContentEditionPencil2 as PencilIcon\n} from '@coorpacademy/nova-icons';\nimport InputPreview from './input-preview';\nimport style from './style.css';\n\nclass InputHtml extends React.Component {\n  static propTypes = {\n    title: PropTypes.string,\n    placeholder: PropTypes.string,\n    disabled: PropTypes.bool,\n    value: PropTypes.string,\n    error: PropTypes.string,\n    onChange: PropTypes.func,\n    description: PropTypes.string\n  };\n\n  static getDerivedStateFromProps(props, state) {\n    const {value} = props;\n\n    if (isUndefined(value)) return null;\n\n    return {\n      text: value,\n      preview: state.preview\n    };\n  }\n\n  constructor(props, context) {\n    super(props);\n    this.state = {\n      text: getOr('', 'value', props),\n      preview: true\n    };\n    this.handleChange = this.handleChange.bind(this);\n    this.handlePreview = this.handlePreview.bind(this);\n  }\n\n  handleChange(e) {\n    const {onChange = noop} = this.props;\n    const value = e.target.value;\n    this.setState(state => ({\n      text: value,\n      preview: state.preview\n    }));\n    onChange(value);\n  }\n\n  handlePreview(e) {\n    e.preventDefault();\n    this.setState(state => ({\n      text: state.text,\n      preview: !state.preview\n    }));\n  }\n\n  render() {\n    const {skin} = this.context;\n    const mediumColor = getOr('#999999', 'common.medium', skin);\n\n    const {title, placeholder, error, description, disabled} = this.props;\n    const {text, preview} = this.state;\n\n    const className = error ? style.error : style.default;\n    const iconContent = !preview ? (\n      <PreviewIcon style={{color: mediumColor}} height={16} />\n    ) : (\n      <PencilIcon style={{color: mediumColor}} height={16} />\n    );\n    return (\n      <div className={className}>\n        <label>\n          <span className={style.title}>{`${title} `}</span>\n          <div className={style.contentWrapper}>\n            <InputPreview\n              title={title}\n              text={text}\n              placeholder={placeholder}\n              onChange={this.handleChange}\n              disabled={disabled}\n              preview={preview}\n              className={style.input}\n            />\n          </div>\n          <span className={style.toggle} onClick={this.handlePreview}>\n            {iconContent}\n          </span>\n        </label>\n        <div className={style.description}>{description}</div>\n      </div>\n    );\n  }\n}\nexport default InputHtml;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","NovaLineBusinessCircleView","PreviewIcon","NovaLineContentEditionPencil2","PencilIcon","Provider","GetSkinFromContext","InputPreview","style","InputHtml","props","legacyContext","value","onChange","text","setText","preview","setPreview","handleChange","e","_value","target","handlePreview","preventDefault","skin","mediumColor","title","placeholder","error","description","disabled","className","default","iconContent","color","contentWrapper","input","toggle","propTypes","string","bool","func","contextTypes","childContextTypes"],"sources":["../../../src/atom/input-html/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr} from 'lodash/fp';\nimport {\n  NovaLineBusinessCircleView as PreviewIcon,\n  NovaLineContentEditionPencil2 as PencilIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport InputPreview from './input-preview';\nimport style from './style.css';\n\nconst InputHtml = (props, legacyContext) => {\n  const {value = '', onChange = noop} = props;\n  const [text, setText] = useState(value);\n  const [preview, setPreview] = useState(true);\n\n  const handleChange = useCallback(\n    e => {\n      const _value = e.target.value;\n      setText(_value);\n      onChange(_value);\n    },\n    [onChange]\n  );\n\n  const handlePreview = useCallback(\n    e => {\n      e.preventDefault();\n      setPreview(!preview);\n    },\n    [preview, setPreview]\n  );\n\n  const skin = GetSkinFromContext(legacyContext);\n  const mediumColor = getOr('#999999', 'common.medium', skin);\n\n  const {title, placeholder, error, description, disabled} = props;\n\n  const className = error ? style.error : style.default;\n  const iconContent = !preview ? (\n    <PreviewIcon style={{color: mediumColor}} height={16} />\n  ) : (\n    <PencilIcon style={{color: mediumColor}} height={16} />\n  );\n\n  return (\n    <div className={className}>\n      <label>\n        <span className={style.title}>{`${title} `}</span>\n        <div className={style.contentWrapper}>\n          <InputPreview\n            title={title}\n            text={text}\n            placeholder={placeholder}\n            onChange={handleChange}\n            disabled={disabled}\n            preview={preview}\n            className={style.input}\n          />\n        </div>\n        <span\n          data-testid={preview ? 'pencil-icon' : 'preview-icon'}\n          className={style.toggle}\n          onClick={handlePreview}\n        >\n          {iconContent}\n        </span>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nInputHtml.propTypes = {\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  disabled: PropTypes.bool,\n  value: PropTypes.string,\n  error: PropTypes.string,\n  onChange: PropTypes.func,\n  description: PropTypes.string\n};\n\nInputHtml.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default InputHtml;\n"],"mappings":"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"}

package/es/atom/input-html/input-preview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-preview.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/input-preview.js"],"names":[],"mappings":";AAKA,qEAkBC"}
+{"version":3,"file":"input-preview.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/input-preview.js"],"names":[],"mappings":";AAKA,qEAqBC"}

package/es/atom/input-html/input-preview.js

@@ -14,6 +14,7 @@ const InputPreview = (props, context) => {
     className
   } = props;
   return !preview ? /*#__PURE__*/React.createElement("textarea", {
+    "data-testid": "input-preview-textarea",
     className: className,
     name: title,
     value: text,
@@ -21,6 +22,7 @@ const InputPreview = (props, context) => {
     onChange: onChange,
     disabled: disabled
   }) : /*#__PURE__*/React.createElement("div", {
+    "data-testid": "input-preview",
     className: classnames(style.preview, className) // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {

package/es/atom/input-html/input-preview.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-preview.js","names":["React","PropTypes","classnames","style","InputPreview","props","context","title","text","placeholder","onChange","disabled","preview","className","__html","propTypes","string","isRequired","bool","func"],"sources":["../../../src/atom/input-html/input-preview.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport style from './input-preview.css';\n\nconst InputPreview = (props, context) => {\n  const {title, text, placeholder, onChange, disabled, preview, className} = props;\n  return !preview ? (\n    <textarea\n      className={className}\n      name={title}\n      value={text}\n      placeholder={placeholder}\n      onChange={onChange}\n      disabled={disabled}\n    />\n  ) : (\n    <div\n      className={classnames(style.preview, className)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: text}}\n    />\n  );\n};\n\nInputPreview.propTypes = {\n  text: PropTypes.string.isRequired,\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  disabled: PropTypes.bool,\n  preview: PropTypes.bool.isRequired,\n  onChange: PropTypes.func,\n  className: PropTypes.string\n};\nexport default InputPreview;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,qBAAlB;;AAEA,MAAMC,YAAY,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACvC,MAAM;IAACC,KAAD;IAAQC,IAAR;IAAcC,WAAd;IAA2BC,QAA3B;IAAqCC,QAArC;IAA+CC,OAA/C;IAAwDC;EAAxD,IAAqER,KAA3E;EACA,OAAO,CAACO,OAAD,gBACL;IACE,SAAS,EAAEC,SADb;IAEE,IAAI,EAAEN,KAFR;IAGE,KAAK,EAAEC,IAHT;IAIE,WAAW,EAAEC,WAJf;IAKE,QAAQ,EAAEC,QALZ;IAME,QAAQ,EAAEC;EANZ,EADK,gBAUL;IACE,SAAS,EAAET,UAAU,CAACC,KAAK,CAACS,OAAP,EAAgBC,SAAhB,CADvB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACC,MAAM,EAAEN;IAAT;EAH3B,EAVF;AAgBD,CAlBD;;AAoBAJ,YAAY,CAACW,SAAb,2CAAyB;EACvBP,IAAI,EAAEP,SAAS,CAACe,MAAV,CAAiBC,UADA;EAEvBV,KAAK,EAAEN,SAAS,CAACe,MAFM;EAGvBP,WAAW,EAAER,SAAS,CAACe,MAHA;EAIvBL,QAAQ,EAAEV,SAAS,CAACiB,IAJG;EAKvBN,OAAO,EAAEX,SAAS,CAACiB,IAAV,CAAeD,UALD;EAMvBP,QAAQ,EAAET,SAAS,CAACkB,IANG;EAOvBN,SAAS,EAAEZ,SAAS,CAACe;AAPE,CAAzB;AASA,eAAeZ,YAAf"}
+{"version":3,"file":"input-preview.js","names":["React","PropTypes","classnames","style","InputPreview","props","context","title","text","placeholder","onChange","disabled","preview","className","__html","propTypes","string","isRequired","bool","func"],"sources":["../../../src/atom/input-html/input-preview.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport style from './input-preview.css';\n\nconst InputPreview = (props, context) => {\n  const {title, text, placeholder, onChange, disabled, preview, className} = props;\n\n  return !preview ? (\n    <textarea\n      data-testid=\"input-preview-textarea\"\n      className={className}\n      name={title}\n      value={text}\n      placeholder={placeholder}\n      onChange={onChange}\n      disabled={disabled}\n    />\n  ) : (\n    <div\n      data-testid=\"input-preview\"\n      className={classnames(style.preview, className)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: text}}\n    />\n  );\n};\n\nInputPreview.propTypes = {\n  text: PropTypes.string.isRequired,\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  disabled: PropTypes.bool,\n  preview: PropTypes.bool.isRequired,\n  onChange: PropTypes.func,\n  className: PropTypes.string\n};\nexport default InputPreview;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,qBAAlB;;AAEA,MAAMC,YAAY,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACvC,MAAM;IAACC,KAAD;IAAQC,IAAR;IAAcC,WAAd;IAA2BC,QAA3B;IAAqCC,QAArC;IAA+CC,OAA/C;IAAwDC;EAAxD,IAAqER,KAA3E;EAEA,OAAO,CAACO,OAAD,gBACL;IACE,eAAY,wBADd;IAEE,SAAS,EAAEC,SAFb;IAGE,IAAI,EAAEN,KAHR;IAIE,KAAK,EAAEC,IAJT;IAKE,WAAW,EAAEC,WALf;IAME,QAAQ,EAAEC,QANZ;IAOE,QAAQ,EAAEC;EAPZ,EADK,gBAWL;IACE,eAAY,eADd;IAEE,SAAS,EAAET,UAAU,CAACC,KAAK,CAACS,OAAP,EAAgBC,SAAhB,CAFvB,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAEN;IAAT;EAJ3B,EAXF;AAkBD,CArBD;;AAuBAJ,YAAY,CAACW,SAAb,2CAAyB;EACvBP,IAAI,EAAEP,SAAS,CAACe,MAAV,CAAiBC,UADA;EAEvBV,KAAK,EAAEN,SAAS,CAACe,MAFM;EAGvBP,WAAW,EAAER,SAAS,CAACe,MAHA;EAIvBL,QAAQ,EAAEV,SAAS,CAACiB,IAJG;EAKvBN,OAAO,EAAEX,SAAS,CAACiB,IAAV,CAAeD,UALD;EAMvBP,QAAQ,EAAET,SAAS,CAACkB,IANG;EAOvBN,SAAS,EAAEZ,SAAS,CAACe;AAPE,CAAzB;AASA,eAAeZ,YAAf"}

package/es/atom/input-textarea/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-textarea/index.js"],"names":[],"mappings":";AAkBA,wDA+DC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-textarea/index.js"],"names":[],"mappings":";AAkBA,wDAgEC"}

package/es/atom/input-textarea/index.js

@@ -64,7 +64,8 @@ const InputTextarea = props => {
     value: value,
     placeholder: placeholder,
     onChange: handleChange,
-    disabled: disabled
+    disabled: disabled,
+    "data-testid": name
   }), errorIconView, validIconView, hintView), descriptionView);
 };