@coorpacademy/components 10.22.2 → 10.22.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/atom/drag-and-drop/index.js +2 -1
- package/es/atom/drag-and-drop/index.js.map +1 -1
- package/es/atom/header-back-button/index.native.js +74 -0
- package/es/atom/header-back-button/index.native.js.map +1 -0
- package/es/atom/header-back-icon/index.native.js +27 -0
- package/es/atom/header-back-icon/index.native.js.map +1 -0
- package/es/atom/html/index.native.js +146 -0
- package/es/atom/html/index.native.js.map +1 -0
- package/es/atom/input-checkbox/index.js +3 -2
- package/es/atom/input-checkbox/index.js.map +1 -1
- package/es/atom/input-switch/index.js +45 -7
- package/es/atom/input-switch/index.js.map +1 -1
- package/es/atom/input-switch/style.css +56 -6
- package/es/atom/select-modal/index.native.js +113 -0
- package/es/atom/select-modal/index.native.js.map +1 -0
- package/es/atom/space/index.native.js +21 -0
- package/es/atom/space/index.native.js.map +1 -0
- package/es/atom/text/index.native.js +31 -0
- package/es/atom/text/index.native.js.map +1 -0
- package/es/hoc/modal/index.native.js +97 -0
- package/es/hoc/modal/index.native.js.map +1 -0
- package/es/hoc/modal/select/index.native.js +86 -0
- package/es/hoc/modal/select/index.native.js.map +1 -0
- package/es/hoc/modal/select-item/index.native.js +54 -0
- package/es/hoc/modal/select-item/index.native.js.map +1 -0
- package/es/hoc/touchable/index.native.js +8 -0
- package/es/hoc/touchable/index.native.js.map +1 -1
- package/es/index.js +2 -1
- package/es/index.js.map +1 -1
- package/es/molecule/answer/index.js +39 -32
- package/es/molecule/answer/index.js.map +1 -1
- package/es/molecule/cm-popin/index.js +125 -19
- package/es/molecule/cm-popin/index.js.map +1 -1
- package/es/molecule/cm-popin/style.css +176 -9
- package/es/molecule/feedback/index.js +7 -3
- package/es/molecule/feedback/index.js.map +1 -1
- package/es/molecule/feedback/style.css +24 -0
- package/es/molecule/questions/free-text/index.native.js +9 -10
- package/es/molecule/questions/free-text/index.native.js.map +1 -1
- package/es/molecule/questions/mobile/template/index.native.js +222 -0
- package/es/molecule/questions/mobile/template/index.native.js.map +1 -0
- package/es/template/app-player/player/index.js +6 -3
- package/es/template/app-player/player/index.js.map +1 -1
- package/es/template/app-player/popin-end/index.js +21 -6
- package/es/template/app-player/popin-end/index.js.map +1 -1
- package/es/template/app-player/popin-end/style.css +1 -1
- package/es/template/app-player/popin-end/summary.css +65 -0
- package/es/template/app-player/popin-end/summary.js +57 -7
- package/es/template/app-player/popin-end/summary.js.map +1 -1
- package/es/template/app-player/popin-header/index.js +33 -12
- package/es/template/app-player/popin-header/index.js.map +1 -1
- package/es/template/app-player/popin-header/style.css +93 -0
- package/es/template/app-player/popin-no-access/index.js +27 -0
- package/es/template/app-player/popin-no-access/index.js.map +1 -0
- package/es/template/app-review/prop-types.js +2 -1
- package/es/template/app-review/prop-types.js.map +1 -1
- package/es/template/app-review/slides/index.js +2 -2
- package/es/template/app-review/slides/index.js.map +1 -1
- package/es/template/app-review/template-context.js +5 -1
- package/es/template/app-review/template-context.js.map +1 -1
- package/es/template/common/dashboard/index.js +6 -3
- package/es/template/common/dashboard/index.js.map +1 -1
- package/es/types/app-review.d.js +2 -0
- package/es/types/app-review.d.js.map +1 -0
- package/es/types/progression-engine.d.js +2 -0
- package/es/types/progression-engine.d.js.map +1 -0
- package/es/types/translations.js +2 -0
- package/es/types/translations.js.map +1 -0
- package/es/util/parse-template-string.js +4 -2
- package/es/util/parse-template-string.js.map +1 -1
- package/es/variables/colors.css +1 -0
- package/es/variables/theme.native.js +1 -0
- package/es/variables/theme.native.js.map +1 -1
- package/lib/atom/drag-and-drop/index.js +2 -1
- package/lib/atom/drag-and-drop/index.js.map +1 -1
- package/lib/atom/header-back-button/index.native.js +95 -0
- package/lib/atom/header-back-button/index.native.js.map +1 -0
- package/lib/atom/header-back-icon/index.native.js +38 -0
- package/lib/atom/header-back-icon/index.native.js.map +1 -0
- package/lib/atom/html/index.native.js +163 -0
- package/lib/atom/html/index.native.js.map +1 -0
- package/lib/atom/input-checkbox/index.js +2 -1
- package/lib/atom/input-checkbox/index.js.map +1 -1
- package/lib/atom/input-switch/index.js +45 -7
- package/lib/atom/input-switch/index.js.map +1 -1
- package/lib/atom/input-switch/style.css +56 -6
- package/lib/atom/select-modal/index.native.js +135 -0
- package/lib/atom/select-modal/index.native.js.map +1 -0
- package/lib/atom/space/index.native.js +33 -0
- package/lib/atom/space/index.native.js.map +1 -0
- package/lib/atom/text/index.native.js +46 -0
- package/lib/atom/text/index.native.js.map +1 -0
- package/lib/hoc/modal/index.native.js +114 -0
- package/lib/hoc/modal/index.native.js.map +1 -0
- package/lib/hoc/modal/select/index.native.js +103 -0
- package/lib/hoc/modal/select/index.native.js.map +1 -0
- package/lib/hoc/modal/select-item/index.native.js +70 -0
- package/lib/hoc/modal/select-item/index.native.js.map +1 -0
- package/lib/hoc/touchable/index.native.js +9 -0
- package/lib/hoc/touchable/index.native.js.map +1 -1
- package/lib/index.js +4 -0
- package/lib/index.js.map +1 -1
- package/lib/molecule/answer/index.js +39 -32
- package/lib/molecule/answer/index.js.map +1 -1
- package/lib/molecule/cm-popin/index.js +126 -18
- package/lib/molecule/cm-popin/index.js.map +1 -1
- package/lib/molecule/cm-popin/style.css +176 -9
- package/lib/molecule/feedback/index.js +7 -3
- package/lib/molecule/feedback/index.js.map +1 -1
- package/lib/molecule/feedback/style.css +24 -0
- package/lib/molecule/questions/free-text/index.native.js +8 -9
- package/lib/molecule/questions/free-text/index.native.js.map +1 -1
- package/lib/molecule/questions/mobile/template/index.native.js +243 -0
- package/lib/molecule/questions/mobile/template/index.native.js.map +1 -0
- package/lib/template/app-player/player/index.js +7 -3
- package/lib/template/app-player/player/index.js.map +1 -1
- package/lib/template/app-player/popin-end/index.js +21 -6
- package/lib/template/app-player/popin-end/index.js.map +1 -1
- package/lib/template/app-player/popin-end/style.css +1 -1
- package/lib/template/app-player/popin-end/summary.css +65 -0
- package/lib/template/app-player/popin-end/summary.js +58 -7
- package/lib/template/app-player/popin-end/summary.js.map +1 -1
- package/lib/template/app-player/popin-header/index.js +32 -11
- package/lib/template/app-player/popin-header/index.js.map +1 -1
- package/lib/template/app-player/popin-header/style.css +93 -0
- package/lib/template/app-player/popin-no-access/index.js +37 -0
- package/lib/template/app-player/popin-no-access/index.js.map +1 -0
- package/lib/template/app-review/prop-types.js +2 -1
- package/lib/template/app-review/prop-types.js.map +1 -1
- package/lib/template/app-review/slides/index.js +2 -2
- package/lib/template/app-review/slides/index.js.map +1 -1
- package/lib/template/app-review/template-context.js +5 -1
- package/lib/template/app-review/template-context.js.map +1 -1
- package/lib/template/common/dashboard/index.js +7 -3
- package/lib/template/common/dashboard/index.js.map +1 -1
- package/lib/types/app-review.d.js +2 -0
- package/lib/types/app-review.d.js.map +1 -0
- package/lib/types/progression-engine.d.js +2 -0
- package/lib/types/progression-engine.d.js.map +1 -0
- package/lib/types/translations.js +2 -0
- package/lib/types/translations.js.map +1 -0
- package/lib/util/parse-template-string.js +4 -2
- package/lib/util/parse-template-string.js.map +1 -1
- package/lib/variables/colors.css +1 -0
- package/lib/variables/theme.native.js +3 -1
- package/lib/variables/theme.native.js.map +1 -1
- package/package.json +6 -4
|
@@ -143,7 +143,8 @@ class DragAndDrop extends React.Component {
|
|
|
143
143
|
className: classnames(previewContainer, disabled && style.disabled)
|
|
144
144
|
}, previewView) : /*#__PURE__*/React.createElement("div", {
|
|
145
145
|
className: classnames(dragging ? style.dragging : inputWrapper, disabled && style.disabled),
|
|
146
|
-
id: idBox
|
|
146
|
+
id: idBox,
|
|
147
|
+
"data-name": "drag-and-drop-box"
|
|
147
148
|
}, /*#__PURE__*/React.createElement("div", {
|
|
148
149
|
className: style.infosContainer
|
|
149
150
|
}, error ? /*#__PURE__*/React.createElement(FileUploadBlockedIcon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/atom/drag-and-drop/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"],"mappings":"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","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 >\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"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/drag-and-drop/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"],"mappings":"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","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"],"file":"index.js"}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import React, { useState, useEffect } from 'react';
|
|
2
|
+
import { View, StyleSheet } from 'react-native';
|
|
3
|
+
import { NovaSolidPlacesPlacesHome2 as HomeIcon, NovaSolidStatusClose as CloseIcon } from '@coorpacademy/nova-icons';
|
|
4
|
+
import { useTemplateContext } from '../../template/app-review/template-context';
|
|
5
|
+
import Touchable from '../../hoc/touchable/index.native';
|
|
6
|
+
import HeaderBackIcon from '../header-back-icon/index.native';
|
|
7
|
+
export const HOME_ICON_HEIGHT = 20;
|
|
8
|
+
export const CLOSE_ICON_HEIGHT = 16;
|
|
9
|
+
export const BACK_ICON_HEIGHT = 20;
|
|
10
|
+
|
|
11
|
+
const createStyleSheet = (theme, statusBarHeight) => StyleSheet.create({
|
|
12
|
+
container: {
|
|
13
|
+
paddingLeft: theme.spacing.base
|
|
14
|
+
},
|
|
15
|
+
floating: {
|
|
16
|
+
paddingTop: theme.spacing.base,
|
|
17
|
+
position: 'absolute',
|
|
18
|
+
top: statusBarHeight
|
|
19
|
+
},
|
|
20
|
+
noSafeArea: {
|
|
21
|
+
top: 0
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
|
|
25
|
+
const HeaderBackButton = props => {
|
|
26
|
+
const templateContext = useTemplateContext();
|
|
27
|
+
const [styleSheet, setStylesheet] = useState(null);
|
|
28
|
+
const {
|
|
29
|
+
theme,
|
|
30
|
+
display: {
|
|
31
|
+
statusBarHeight
|
|
32
|
+
}
|
|
33
|
+
} = templateContext;
|
|
34
|
+
const {
|
|
35
|
+
type,
|
|
36
|
+
color = theme.colors.white,
|
|
37
|
+
onPress,
|
|
38
|
+
isFloating = true,
|
|
39
|
+
noSafeArea = false,
|
|
40
|
+
testID = 'default-header-back-button-test-id'
|
|
41
|
+
} = props;
|
|
42
|
+
useEffect(() => {
|
|
43
|
+
const _stylesheet = createStyleSheet(theme, statusBarHeight);
|
|
44
|
+
|
|
45
|
+
setStylesheet(_stylesheet);
|
|
46
|
+
}, [theme, statusBarHeight]);
|
|
47
|
+
|
|
48
|
+
if (!styleSheet) {
|
|
49
|
+
return null;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
53
|
+
style: [styleSheet.container, isFloating && styleSheet.floating, isFloating && noSafeArea && styleSheet.noSafeArea]
|
|
54
|
+
}, /*#__PURE__*/React.createElement(Touchable, {
|
|
55
|
+
testID: testID,
|
|
56
|
+
onPress: onPress,
|
|
57
|
+
analyticsID: "button-close"
|
|
58
|
+
}, type === 'home' ? /*#__PURE__*/React.createElement(HomeIcon, {
|
|
59
|
+
height: HOME_ICON_HEIGHT,
|
|
60
|
+
width: HOME_ICON_HEIGHT,
|
|
61
|
+
color: color
|
|
62
|
+
}) : null, type === 'close' ? /*#__PURE__*/React.createElement(CloseIcon, {
|
|
63
|
+
height: CLOSE_ICON_HEIGHT,
|
|
64
|
+
width: CLOSE_ICON_HEIGHT,
|
|
65
|
+
color: color
|
|
66
|
+
}) : null, type === 'back' ? /*#__PURE__*/React.createElement(HeaderBackIcon, {
|
|
67
|
+
height: BACK_ICON_HEIGHT,
|
|
68
|
+
width: BACK_ICON_HEIGHT,
|
|
69
|
+
color: color
|
|
70
|
+
}) : null));
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
export default HeaderBackButton;
|
|
74
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/header-back-button/index.native.tsx"],"names":["React","useState","useEffect","View","StyleSheet","NovaSolidPlacesPlacesHome2","HomeIcon","NovaSolidStatusClose","CloseIcon","useTemplateContext","Touchable","HeaderBackIcon","HOME_ICON_HEIGHT","CLOSE_ICON_HEIGHT","BACK_ICON_HEIGHT","createStyleSheet","theme","statusBarHeight","create","container","paddingLeft","spacing","base","floating","paddingTop","position","top","noSafeArea","HeaderBackButton","props","templateContext","styleSheet","setStylesheet","display","type","color","colors","white","onPress","isFloating","testID","_stylesheet"],"mappings":"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","sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {View, StyleSheet} from 'react-native';\nimport type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes';\n\nimport {\n NovaSolidPlacesPlacesHome2 as HomeIcon,\n NovaSolidStatusClose as CloseIcon\n} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\nimport HeaderBackIcon from '../header-back-icon/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport const HOME_ICON_HEIGHT = 20;\nexport const CLOSE_ICON_HEIGHT = 16;\nexport const BACK_ICON_HEIGHT = 20;\n\nexport type Props = {\n type: 'close' | 'back' | 'home';\n color?: string;\n onPress?: (event: PressEvent) => any;\n isFloating?: boolean;\n noSafeArea?: boolean;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: {\n paddingLeft: number;\n };\n floating: {\n paddingTop: number;\n position: string;\n top: number;\n };\n noSafeArea: {\n top: 0;\n };\n};\n\nconst createStyleSheet = (theme: Theme, statusBarHeight: number) =>\n StyleSheet.create({\n container: {\n paddingLeft: theme.spacing.base\n },\n floating: {\n paddingTop: theme.spacing.base,\n position: 'absolute',\n top: statusBarHeight\n },\n noSafeArea: {\n top: 0\n }\n });\n\nconst HeaderBackButton = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {\n theme,\n display: {statusBarHeight}\n } = templateContext;\n\n const {\n type,\n color = theme.colors.white,\n onPress,\n isFloating = true,\n noSafeArea = false,\n testID = 'default-header-back-button-test-id'\n } = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme, statusBarHeight);\n setStylesheet(_stylesheet);\n }, [theme, statusBarHeight]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View\n style={[\n styleSheet.container,\n isFloating && styleSheet.floating,\n isFloating && noSafeArea && styleSheet.noSafeArea\n ]}\n >\n <Touchable testID={testID} onPress={onPress} analyticsID=\"button-close\">\n {type === 'home' ? (\n <HomeIcon height={HOME_ICON_HEIGHT} width={HOME_ICON_HEIGHT} color={color} />\n ) : null}\n {type === 'close' ? (\n <CloseIcon height={CLOSE_ICON_HEIGHT} width={CLOSE_ICON_HEIGHT} color={color} />\n ) : null}\n {type === 'back' ? (\n <HeaderBackIcon height={BACK_ICON_HEIGHT} width={BACK_ICON_HEIGHT} color={color} />\n ) : null}\n </Touchable>\n </View>\n );\n};\n\nexport default HeaderBackButton;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { NovaCompositionNavigationArrowLeft as BackIcon } from '@coorpacademy/nova-icons';
|
|
4
|
+
import { useTemplateContext } from '../../template/app-review/template-context';
|
|
5
|
+
|
|
6
|
+
const HeaderBackIcon = props => {
|
|
7
|
+
const templateContext = useTemplateContext();
|
|
8
|
+
const {
|
|
9
|
+
theme
|
|
10
|
+
} = templateContext;
|
|
11
|
+
const {
|
|
12
|
+
color = theme.colors.gray.dark,
|
|
13
|
+
height = 16,
|
|
14
|
+
width = 16,
|
|
15
|
+
style
|
|
16
|
+
} = props;
|
|
17
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
18
|
+
style: style
|
|
19
|
+
}, /*#__PURE__*/React.createElement(BackIcon, {
|
|
20
|
+
color: color,
|
|
21
|
+
height: height,
|
|
22
|
+
width: width
|
|
23
|
+
}));
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export default HeaderBackIcon;
|
|
27
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/header-back-icon/index.native.tsx"],"names":["React","View","NovaCompositionNavigationArrowLeft","BackIcon","useTemplateContext","HeaderBackIcon","props","templateContext","theme","color","colors","gray","dark","height","width","style"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAQC,IAAR,QAA8B,cAA9B;AACA,SAAQC,kCAAkC,IAAIC,QAA9C,QAA6D,0BAA7D;AACA,SAAQC,kBAAR,QAAiC,4CAAjC;;AASA,MAAMC,cAAc,GAAIC,KAAD,IAAkB;AACvC,QAAMC,eAAe,GAAGH,kBAAkB,EAA1C;AACA,QAAM;AAACI,IAAAA;AAAD,MAAUD,eAAhB;AAEA,QAAM;AAACE,IAAAA,KAAK,GAAGD,KAAK,CAACE,MAAN,CAAaC,IAAb,CAAkBC,IAA3B;AAAiCC,IAAAA,MAAM,GAAG,EAA1C;AAA8CC,IAAAA,KAAK,GAAG,EAAtD;AAA0DC,IAAAA;AAA1D,MAAmET,KAAzE;AAEA,sBACE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAES;AAAb,kBACE,oBAAC,QAAD;AAAU,IAAA,KAAK,EAAEN,KAAjB;AAAwB,IAAA,MAAM,EAAEI,MAAhC;AAAwC,IAAA,KAAK,EAAEC;AAA/C,IADF,CADF;AAKD,CAXD;;AAaA,eAAeT,cAAf","sourcesContent":["import React from 'react';\nimport {View, ViewStyle} from 'react-native';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../../template/app-review/template-context';\n\nexport type Props = {\n color?: string;\n height?: number;\n width?: number;\n style?: ViewStyle;\n};\n\nconst HeaderBackIcon = (props: Props) => {\n const templateContext = useTemplateContext();\n const {theme} = templateContext;\n\n const {color = theme.colors.gray.dark, height = 16, width = 16, style} = props;\n\n return (\n <View style={style}>\n <BackIcon color={color} height={height} width={width} />\n </View>\n );\n};\n\nexport default HeaderBackIcon;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign || 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); }
|
|
2
|
+
|
|
3
|
+
import React, { useMemo, useState } from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import HtmlBase from 'react-native-render-html';
|
|
6
|
+
import { HTML_ANCHOR_TEXT_COLOR } from '../../variables/theme.native';
|
|
7
|
+
import { useTemplateContext } from '../../template/app-review/template-context';
|
|
8
|
+
import Text, { DEFAULT_STYLE as DEFAULT_TEXT_STYLE } from '../text/index.native';
|
|
9
|
+
|
|
10
|
+
const Html = props => {
|
|
11
|
+
const [disableBaseFontStyleColor, setDisableBaseFontStyleColor] = useState(false);
|
|
12
|
+
const templateContext = useTemplateContext();
|
|
13
|
+
const {
|
|
14
|
+
theme,
|
|
15
|
+
vibration
|
|
16
|
+
} = templateContext;
|
|
17
|
+
const {
|
|
18
|
+
children,
|
|
19
|
+
fontSize,
|
|
20
|
+
containerStyle,
|
|
21
|
+
imageStyle,
|
|
22
|
+
style,
|
|
23
|
+
testID,
|
|
24
|
+
anchorTextColor = HTML_ANCHOR_TEXT_COLOR,
|
|
25
|
+
isTextCentered,
|
|
26
|
+
numberOfLines,
|
|
27
|
+
onLinkPress
|
|
28
|
+
} = props;
|
|
29
|
+
const handleLinkPress = useMemo(() => url => {
|
|
30
|
+
vibration?.vibrate();
|
|
31
|
+
onLinkPress && onLinkPress(url);
|
|
32
|
+
}, [onLinkPress, vibration]); // Don't use StyleSheet there, it's not a react style
|
|
33
|
+
|
|
34
|
+
const styles = {
|
|
35
|
+
p: {
|
|
36
|
+
marginVertical: 0,
|
|
37
|
+
textAlign: 'center'
|
|
38
|
+
},
|
|
39
|
+
u: {
|
|
40
|
+
textDecorationLine: 'underline'
|
|
41
|
+
},
|
|
42
|
+
i: {
|
|
43
|
+
fontStyle: 'italic'
|
|
44
|
+
},
|
|
45
|
+
b: {
|
|
46
|
+
fontWeight: theme.fontWeight.bold
|
|
47
|
+
},
|
|
48
|
+
s: {
|
|
49
|
+
textDecorationLine: 'line-through'
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
const tagsStyles = _extends(_extends({}, styles), {}, {
|
|
54
|
+
h1: {
|
|
55
|
+
fontSize
|
|
56
|
+
},
|
|
57
|
+
h2: {
|
|
58
|
+
fontSize
|
|
59
|
+
},
|
|
60
|
+
h3: {
|
|
61
|
+
fontSize
|
|
62
|
+
},
|
|
63
|
+
h4: {
|
|
64
|
+
fontSize
|
|
65
|
+
},
|
|
66
|
+
h5: {
|
|
67
|
+
fontSize
|
|
68
|
+
},
|
|
69
|
+
h6: {
|
|
70
|
+
fontSize
|
|
71
|
+
},
|
|
72
|
+
a: {
|
|
73
|
+
color: anchorTextColor
|
|
74
|
+
},
|
|
75
|
+
img: imageStyle
|
|
76
|
+
});
|
|
77
|
+
|
|
78
|
+
let baseFontStyle = _extends(_extends({}, DEFAULT_TEXT_STYLE), {}, {
|
|
79
|
+
fontSize,
|
|
80
|
+
color: theme.colors.black
|
|
81
|
+
});
|
|
82
|
+
|
|
83
|
+
if (style) {
|
|
84
|
+
if (Array.isArray(style)) {
|
|
85
|
+
const styleObject = style.reduce((result, child) => _extends(_extends({}, result), child));
|
|
86
|
+
baseFontStyle = _extends(_extends({}, baseFontStyle), styleObject);
|
|
87
|
+
} else {
|
|
88
|
+
baseFontStyle = _extends(_extends({}, baseFontStyle), style);
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
const renderers = {
|
|
93
|
+
// eslint-disable-next-line react/display-name
|
|
94
|
+
font: (htmlAttribs, _children) => {
|
|
95
|
+
if (htmlAttribs.color) {
|
|
96
|
+
setDisableBaseFontStyleColor(true);
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
return /*#__PURE__*/React.createElement(Text, {
|
|
100
|
+
key: 1,
|
|
101
|
+
style: _extends(_extends({}, baseFontStyle), {}, {
|
|
102
|
+
color: htmlAttribs.color
|
|
103
|
+
})
|
|
104
|
+
}, _children);
|
|
105
|
+
},
|
|
106
|
+
span: function Span(_, _children, convertedCSSStyles, {
|
|
107
|
+
allowFontScaling,
|
|
108
|
+
key
|
|
109
|
+
}) {
|
|
110
|
+
return /*#__PURE__*/React.createElement(Text, {
|
|
111
|
+
numberOfLines: numberOfLines,
|
|
112
|
+
allowFontScaling: allowFontScaling,
|
|
113
|
+
key: key,
|
|
114
|
+
style: convertedCSSStyles
|
|
115
|
+
}, _children);
|
|
116
|
+
}
|
|
117
|
+
};
|
|
118
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
119
|
+
testID: testID,
|
|
120
|
+
style: containerStyle
|
|
121
|
+
}, /*#__PURE__*/React.createElement(HtmlBase // to text-align center on android
|
|
122
|
+
// we have to encapsulate between <p> tag
|
|
123
|
+
// and use custom style define on <p>
|
|
124
|
+
// definition in component style doesn't work
|
|
125
|
+
, {
|
|
126
|
+
source: {
|
|
127
|
+
// eslint-disable-next-line no-nested-ternary
|
|
128
|
+
html: isTextCentered ? `<p>${children}</p>` : numberOfLines ? `<span>${children}</span>` : `${children}`
|
|
129
|
+
},
|
|
130
|
+
tagsStyles: tagsStyles,
|
|
131
|
+
baseFontStyle: _extends(_extends({}, baseFontStyle), {}, {
|
|
132
|
+
color: disableBaseFontStyleColor ? null : baseFontStyle.color
|
|
133
|
+
}),
|
|
134
|
+
onLinkPress: handleLinkPress,
|
|
135
|
+
renderers: renderers // this is exceptionally for the onboarding course
|
|
136
|
+
// is the only course that has a gif in the context but the img tag
|
|
137
|
+
// comes with width & height attr and these makes this lib do not render the gif
|
|
138
|
+
// so to avoid it, we decided to ignore these attr
|
|
139
|
+
,
|
|
140
|
+
ignoredStyles: ['width', 'height'],
|
|
141
|
+
testID: "html-base"
|
|
142
|
+
}));
|
|
143
|
+
};
|
|
144
|
+
|
|
145
|
+
export default Html;
|
|
146
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/html/index.native.tsx"],"names":["React","useMemo","useState","View","HtmlBase","HTML_ANCHOR_TEXT_COLOR","useTemplateContext","Text","DEFAULT_STYLE","DEFAULT_TEXT_STYLE","Html","props","disableBaseFontStyleColor","setDisableBaseFontStyleColor","templateContext","theme","vibration","children","fontSize","containerStyle","imageStyle","style","testID","anchorTextColor","isTextCentered","numberOfLines","onLinkPress","handleLinkPress","url","vibrate","styles","p","marginVertical","textAlign","u","textDecorationLine","i","fontStyle","b","fontWeight","bold","s","tagsStyles","h1","h2","h3","h4","h5","h6","a","color","img","baseFontStyle","colors","black","Array","isArray","styleObject","reduce","result","child","renderers","font","htmlAttribs","_children","span","Span","_","convertedCSSStyles","allowFontScaling","key","html"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,OAAf,EAAwBC,QAAxB,QAAuC,OAAvC;AACA,SAAQC,IAAR,QAAqD,cAArD;AACA,OAAOC,QAAP,MAAqB,0BAArB;AAEA,SAAQC,sBAAR,QAAqC,8BAArC;AACA,SAAQC,kBAAR,QAAiC,4CAAjC;AACA,OAAOC,IAAP,IAAcC,aAAa,IAAIC,kBAA/B,QAAwD,sBAAxD;;AAeA,MAAMC,IAAI,GAAIC,KAAD,IAAkB;AAC7B,QAAM,CAACC,yBAAD,EAA4BC,4BAA5B,IAA4DX,QAAQ,CAAU,KAAV,CAA1E;AACA,QAAMY,eAAe,GAAGR,kBAAkB,EAA1C;AACA,QAAM;AAACS,IAAAA,KAAD;AAAQC,IAAAA;AAAR,MAAqBF,eAA3B;AACA,QAAM;AACJG,IAAAA,QADI;AAEJC,IAAAA,QAFI;AAGJC,IAAAA,cAHI;AAIJC,IAAAA,UAJI;AAKJC,IAAAA,KALI;AAMJC,IAAAA,MANI;AAOJC,IAAAA,eAAe,GAAGlB,sBAPd;AAQJmB,IAAAA,cARI;AASJC,IAAAA,aATI;AAUJC,IAAAA;AAVI,MAWFf,KAXJ;AAaA,QAAMgB,eAAe,GAAG1B,OAAO,CAC7B,MAAO2B,GAAD,IAAiB;AACrBZ,IAAAA,SAAS,EAAEa,OAAX;AAEAH,IAAAA,WAAW,IAAIA,WAAW,CAACE,GAAD,CAA1B;AACD,GAL4B,EAM7B,CAACF,WAAD,EAAcV,SAAd,CAN6B,CAA/B,CAjB6B,CA0B7B;;AACA,QAAMc,MAAM,GAAG;AACbC,IAAAA,CAAC,EAAE;AACDC,MAAAA,cAAc,EAAE,CADf;AAEDC,MAAAA,SAAS,EAAE;AAFV,KADU;AAKbC,IAAAA,CAAC,EAAE;AACDC,MAAAA,kBAAkB,EAAE;AADnB,KALU;AAQbC,IAAAA,CAAC,EAAE;AACDC,MAAAA,SAAS,EAAE;AADV,KARU;AAWbC,IAAAA,CAAC,EAAE;AACDC,MAAAA,UAAU,EAAExB,KAAK,CAACwB,UAAN,CAAiBC;AAD5B,KAXU;AAcbC,IAAAA,CAAC,EAAE;AACDN,MAAAA,kBAAkB,EAAE;AADnB;AAdU,GAAf;;AAmBA,QAAMO,UAAU,yBACXZ,MADW;AAEda,IAAAA,EAAE,EAAE;AAACzB,MAAAA;AAAD,KAFU;AAGd0B,IAAAA,EAAE,EAAE;AAAC1B,MAAAA;AAAD,KAHU;AAId2B,IAAAA,EAAE,EAAE;AAAC3B,MAAAA;AAAD,KAJU;AAKd4B,IAAAA,EAAE,EAAE;AAAC5B,MAAAA;AAAD,KALU;AAMd6B,IAAAA,EAAE,EAAE;AAAC7B,MAAAA;AAAD,KANU;AAOd8B,IAAAA,EAAE,EAAE;AAAC9B,MAAAA;AAAD,KAPU;AAQd+B,IAAAA,CAAC,EAAE;AAACC,MAAAA,KAAK,EAAE3B;AAAR,KARW;AASd4B,IAAAA,GAAG,EAAE/B;AATS,IAAhB;;AAYA,MAAIgC,aAAa,yBAAO3C,kBAAP;AAA2BS,IAAAA,QAA3B;AAAqCgC,IAAAA,KAAK,EAAEnC,KAAK,CAACsC,MAAN,CAAaC;AAAzD,IAAjB;;AACA,MAAIjC,KAAJ,EAAW;AACT,QAAIkC,KAAK,CAACC,OAAN,CAAcnC,KAAd,CAAJ,EAA0B;AACxB,YAAMoC,WAAW,GAAGpC,KAAK,CAACqC,MAAN,CAAa,CAACC,MAAD,EAASC,KAAT,2BAC5BD,MAD4B,GAE5BC,KAF4B,CAAb,CAApB;AAIAR,MAAAA,aAAa,yBACRA,aADQ,GAERK,WAFQ,CAAb;AAID,KATD,MASO;AACLL,MAAAA,aAAa,yBACRA,aADQ,GAER/B,KAFQ,CAAb;AAID;AACF;;AAED,QAAMwC,SAAS,GAAG;AAChB;AACAC,IAAAA,IAAI,EAAE,CAACC,WAAD,EAAcC,SAAd,KAA4B;AAChC,UAAID,WAAW,CAACb,KAAhB,EAAuB;AACrBrC,QAAAA,4BAA4B,CAAC,IAAD,CAA5B;AACD;;AACD,0BACE,oBAAC,IAAD;AACE,QAAA,GAAG,EAAE,CADP;AAEE,QAAA,KAAK,wBACAuC,aADA;AAEHF,UAAAA,KAAK,EAAEa,WAAW,CAACb;AAFhB;AAFP,SAOGc,SAPH,CADF;AAWD,KAjBe;AAkBhBC,IAAAA,IAAI,EAAE,SAASC,IAAT,CACJC,CADI,EAEJH,SAFI,EAGJI,kBAHI,EAIJ;AAACC,MAAAA,gBAAD;AAAmBC,MAAAA;AAAnB,KAJI,EAKJ;AACA,0BACE,oBAAC,IAAD;AACE,QAAA,aAAa,EAAE7C,aADjB;AAEE,QAAA,gBAAgB,EAAE4C,gBAFpB;AAGE,QAAA,GAAG,EAAEC,GAHP;AAIE,QAAA,KAAK,EAAEF;AAJT,SAMGJ,SANH,CADF;AAUD;AAlCe,GAAlB;AAqCA,sBACE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAE1C,MAAd;AAAsB,IAAA,KAAK,EAAEH;AAA7B,kBACE,oBAAC,QAAD,CACE;AACA;AACA;AACA;AAJF;AAKE,IAAA,MAAM,EAAE;AACN;AACAoD,MAAAA,IAAI,EAAE/C,cAAc,GACf,MAAKP,QAAS,MADC,GAEhBQ,aAAa,GACZ,SAAQR,QAAS,SADL,GAEZ,GAAEA,QAAS;AANV,KALV;AAaE,IAAA,UAAU,EAAEyB,UAbd;AAcE,IAAA,aAAa,wBACRU,aADQ;AAEXF,MAAAA,KAAK,EAAEtC,yBAAyB,GAAG,IAAH,GAAUwC,aAAa,CAACF;AAF7C,MAdf;AAkBE,IAAA,WAAW,EAAEvB,eAlBf;AAmBE,IAAA,SAAS,EAAEkC,SAnBb,CAoBE;AACA;AACA;AACA;AAvBF;AAwBE,IAAA,aAAa,EAAE,CAAC,OAAD,EAAU,QAAV,CAxBjB;AAyBE,IAAA,MAAM,EAAC;AAzBT,IADF,CADF;AA+BD,CAjJD;;AAmJA,eAAenD,IAAf","sourcesContent":["import React, {useMemo, useState} from 'react';\nimport {View, ViewStyle, ImageStyle, TextStyle} from 'react-native';\nimport HtmlBase from 'react-native-render-html';\n\nimport {HTML_ANCHOR_TEXT_COLOR} from '../../variables/theme.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Text, {DEFAULT_STYLE as DEFAULT_TEXT_STYLE} from '../text/index.native';\n\nexport type Props = {\n children: string;\n fontSize: number;\n numberOfLines?: number;\n onLinkPress?: (url: string) => void;\n containerStyle?: ViewStyle;\n anchorTextColor?: string;\n imageStyle?: ImageStyle;\n style?: TextStyle;\n testID?: string;\n isTextCentered?: boolean;\n};\n\nconst Html = (props: Props) => {\n const [disableBaseFontStyleColor, setDisableBaseFontStyleColor] = useState<boolean>(false);\n const templateContext = useTemplateContext();\n const {theme, vibration} = templateContext;\n const {\n children,\n fontSize,\n containerStyle,\n imageStyle,\n style,\n testID,\n anchorTextColor = HTML_ANCHOR_TEXT_COLOR,\n isTextCentered,\n numberOfLines,\n onLinkPress\n } = props;\n\n const handleLinkPress = useMemo(\n () => (url: string) => {\n vibration?.vibrate();\n\n onLinkPress && onLinkPress(url);\n },\n [onLinkPress, vibration]\n );\n\n // Don't use StyleSheet there, it's not a react style\n const styles = {\n p: {\n marginVertical: 0,\n textAlign: 'center'\n },\n u: {\n textDecorationLine: 'underline'\n },\n i: {\n fontStyle: 'italic'\n },\n b: {\n fontWeight: theme.fontWeight.bold\n },\n s: {\n textDecorationLine: 'line-through'\n }\n };\n\n const tagsStyles = {\n ...styles,\n h1: {fontSize},\n h2: {fontSize},\n h3: {fontSize},\n h4: {fontSize},\n h5: {fontSize},\n h6: {fontSize},\n a: {color: anchorTextColor},\n img: imageStyle\n };\n\n let baseFontStyle = {...DEFAULT_TEXT_STYLE, fontSize, color: theme.colors.black};\n if (style) {\n if (Array.isArray(style)) {\n const styleObject = style.reduce((result, child) => ({\n ...result,\n ...child\n }));\n baseFontStyle = {\n ...baseFontStyle,\n ...styleObject\n };\n } else {\n baseFontStyle = {\n ...baseFontStyle,\n ...style\n };\n }\n }\n\n const renderers = {\n // eslint-disable-next-line react/display-name\n font: (htmlAttribs, _children) => {\n if (htmlAttribs.color) {\n setDisableBaseFontStyleColor(true);\n }\n return (\n <Text\n key={1}\n style={{\n ...baseFontStyle,\n color: htmlAttribs.color\n }}\n >\n {_children}\n </Text>\n );\n },\n span: function Span(\n _: any,\n _children: any,\n convertedCSSStyles: any,\n {allowFontScaling, key}: any\n ) {\n return (\n <Text\n numberOfLines={numberOfLines}\n allowFontScaling={allowFontScaling}\n key={key}\n style={convertedCSSStyles}\n >\n {_children}\n </Text>\n );\n }\n };\n\n return (\n <View testID={testID} style={containerStyle}>\n <HtmlBase\n // to text-align center on android\n // we have to encapsulate between <p> tag\n // and use custom style define on <p>\n // definition in component style doesn't work\n source={{\n // eslint-disable-next-line no-nested-ternary\n html: isTextCentered\n ? `<p>${children}</p>`\n : numberOfLines\n ? `<span>${children}</span>`\n : `${children}`\n }}\n tagsStyles={tagsStyles}\n baseFontStyle={{\n ...baseFontStyle,\n color: disableBaseFontStyleColor ? null : baseFontStyle.color\n }}\n onLinkPress={handleLinkPress}\n renderers={renderers}\n // this is exceptionally for the onboarding course\n // is the only course that has a gif in the context but the img tag\n // comes with width & height attr and these makes this lib do not render the gif\n // so to avoid it, we decided to ignore these attr\n ignoredStyles={['width', 'height']}\n testID=\"html-base\"\n />\n </View>\n );\n};\n\nexport default Html;\n"],"file":"index.native.js"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _uniqueId from "lodash/fp/uniqueId";
|
|
2
2
|
import _noop from "lodash/fp/noop";
|
|
3
3
|
import _keys from "lodash/fp/keys";
|
|
4
|
-
import React, {
|
|
4
|
+
import React, { useCallback } from 'react';
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
6
|
import classnames from 'classnames';
|
|
7
7
|
import { NovaSolidStatusValidate as CheckIcon } from '@coorpacademy/nova-icons';
|
|
@@ -32,7 +32,7 @@ const InputCheckbox = props => {
|
|
|
32
32
|
const idCheckbox = _uniqueId('input-checkbox-');
|
|
33
33
|
|
|
34
34
|
const title = `${propsTitle}${required ? '*' : ''}`;
|
|
35
|
-
const handleChange =
|
|
35
|
+
const handleChange = useCallback(e => onChange(e.target.checked), [onChange]);
|
|
36
36
|
const modifiedClassName = theme === 'coorpmanager' ? style.coorpManagerModified : style.defaultModified;
|
|
37
37
|
const errorClassName = theme === 'coorpmanager' ? style.coorpManagerError : style.defaultError;
|
|
38
38
|
const defaultContainerClassName = theme === 'coorpmanager' ? style.coorpManager : style.default;
|
|
@@ -51,6 +51,7 @@ const InputCheckbox = props => {
|
|
|
51
51
|
disabled: disabled,
|
|
52
52
|
"data-name": "checkbox-input"
|
|
53
53
|
}), /*#__PURE__*/React.createElement("div", {
|
|
54
|
+
"data-name": "checkbox-label",
|
|
54
55
|
className: classnames(style.label, noLabelMargins ? style.noLabelMargins : undefined)
|
|
55
56
|
}, /*#__PURE__*/React.createElement(CheckIcon, {
|
|
56
57
|
className: style.icon
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/atom/input-checkbox/index.js"],"names":["React","
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/input-checkbox/index.js"],"names":["React","useCallback","PropTypes","classnames","NovaSolidStatusValidate","CheckIcon","getClassState","style","titleStylesClassNames","inherit","primary","secondary","tertiary","InputCheckbox","props","checked","onChange","error","disabled","required","titleStyle","modified","theme","title","propsTitle","noLabelMargins","titleStyleClassName","idCheckbox","handleChange","e","target","modifiedClassName","coorpManagerModified","defaultModified","errorClassName","coorpManagerError","defaultError","defaultContainerClassName","coorpManager","default","className","checkbox","label","undefined","icon","propTypes","string","isRequired","bool","func","oneOf"],"mappings":"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","sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaSolidStatusValidate as CheckIcon} from '@coorpacademy/nova-icons';\nimport {keys, noop, uniqueId} from 'lodash/fp';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst titleStylesClassNames = {\n inherit: style.inherit,\n primary: style.primary,\n secondary: style.secondary,\n tertiary: style.tertiary\n};\n\nconst InputCheckbox = props => {\n const {\n checked,\n onChange = noop,\n error,\n disabled,\n required,\n titleStyle = 'primary',\n modified = false,\n theme = 'default',\n title: propsTitle,\n noLabelMargins = false\n } = props;\n\n const titleStyleClassName = titleStylesClassNames[titleStyle];\n const idCheckbox = uniqueId('input-checkbox-');\n const title = `${propsTitle}${required ? '*' : ''}`;\n const handleChange = useCallback(e => onChange(e.target.checked), [onChange]);\n\n const modifiedClassName =\n theme === 'coorpmanager' ? style.coorpManagerModified : style.defaultModified;\n const errorClassName = theme === 'coorpmanager' ? style.coorpManagerError : style.defaultError;\n const defaultContainerClassName = theme === 'coorpmanager' ? style.coorpManager : style.default;\n\n const className = getClassState(\n defaultContainerClassName,\n modifiedClassName,\n errorClassName,\n modified,\n error\n );\n\n return (\n <label className={className} htmlFor={idCheckbox} data-name=\"checkbox-input-label\">\n <input\n type=\"checkbox\"\n className={style.checkbox}\n name={title}\n id={idCheckbox}\n checked={checked}\n onChange={handleChange}\n disabled={disabled}\n data-name=\"checkbox-input\"\n />\n <div\n data-name=\"checkbox-label\"\n className={classnames(style.label, noLabelMargins ? style.noLabelMargins : undefined)}\n >\n <CheckIcon className={style.icon} />\n </div>\n <span className={titleStyleClassName} title={title}>\n {title}\n </span>\n </label>\n );\n};\n\nInputCheckbox.propTypes = {\n title: PropTypes.string.isRequired,\n disabled: PropTypes.bool,\n required: PropTypes.bool,\n checked: PropTypes.bool,\n error: PropTypes.bool,\n onChange: PropTypes.func,\n modified: PropTypes.bool,\n noLabelMargins: PropTypes.bool,\n theme: PropTypes.oneOf(['coorpmanager', 'default']),\n titleStyle: PropTypes.oneOf(keys(titleStylesClassNames))\n};\n\nexport default InputCheckbox;\n"],"file":"index.js"}
|
|
@@ -16,7 +16,9 @@ const InputSwitch = props => {
|
|
|
16
16
|
description,
|
|
17
17
|
modified = false,
|
|
18
18
|
theme = 'default',
|
|
19
|
-
titlePosition = 'left'
|
|
19
|
+
titlePosition = 'left',
|
|
20
|
+
details = '',
|
|
21
|
+
requiredSelection = false
|
|
20
22
|
} = props;
|
|
21
23
|
|
|
22
24
|
const idSwitch = id || _uniqueId('input-switch-');
|
|
@@ -29,13 +31,42 @@ const InputSwitch = props => {
|
|
|
29
31
|
const descriptionView = description ? /*#__PURE__*/React.createElement("div", {
|
|
30
32
|
className: style.description
|
|
31
33
|
}, description) : null;
|
|
32
|
-
|
|
33
|
-
const
|
|
34
|
+
|
|
35
|
+
const getClass = () => {
|
|
36
|
+
switch (theme) {
|
|
37
|
+
case 'coorpmanager':
|
|
38
|
+
return {
|
|
39
|
+
defaultClass: style.coorpmanager,
|
|
40
|
+
modifiedClass: style.coorpmanagerModified
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
case 'mooc':
|
|
44
|
+
return {
|
|
45
|
+
defaultClass: style.partielUncheck,
|
|
46
|
+
modifiedClass: style.coorpmanagerModified
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
default:
|
|
50
|
+
return {
|
|
51
|
+
defaultClass: style.default,
|
|
52
|
+
modifiedClass: style.modified
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
const {
|
|
58
|
+
defaultClass,
|
|
59
|
+
modifiedClass
|
|
60
|
+
} = getClass();
|
|
34
61
|
const className = getClassState(defaultClass, modifiedClass, null, modified);
|
|
35
62
|
return /*#__PURE__*/React.createElement("div", {
|
|
36
63
|
className: className,
|
|
37
64
|
"data-name": `switch-input-${theme}`
|
|
38
|
-
}, titlePosition === 'left' ? titleView : null, /*#__PURE__*/React.createElement("
|
|
65
|
+
}, titlePosition === 'left' ? titleView : null, /*#__PURE__*/React.createElement("div", {
|
|
66
|
+
className: requiredSelection ? style.requiredSelection : null
|
|
67
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
68
|
+
className: style.btnSwitchContainer
|
|
69
|
+
}, /*#__PURE__*/React.createElement("input", {
|
|
39
70
|
type: "checkbox",
|
|
40
71
|
id: idSwitch,
|
|
41
72
|
name: name,
|
|
@@ -44,8 +75,13 @@ const InputSwitch = props => {
|
|
|
44
75
|
disabled: isDisabled,
|
|
45
76
|
className: style.checkbox
|
|
46
77
|
}), /*#__PURE__*/React.createElement("label", {
|
|
47
|
-
htmlFor: idSwitch
|
|
48
|
-
|
|
78
|
+
htmlFor: idSwitch,
|
|
79
|
+
"data-name": "input-switch-label"
|
|
80
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
|
81
|
+
className: !details ? style.alignedTextContainer : null
|
|
82
|
+
}, titlePosition === 'right' ? titleView : null, details ? /*#__PURE__*/React.createElement("div", {
|
|
83
|
+
className: style.detailsTxt
|
|
84
|
+
}, details) : null), descriptionView);
|
|
49
85
|
};
|
|
50
86
|
|
|
51
87
|
InputSwitch.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
@@ -58,7 +94,9 @@ InputSwitch.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
58
94
|
description: PropTypes.string,
|
|
59
95
|
modified: PropTypes.bool,
|
|
60
96
|
titlePosition: PropTypes.oneOf(['right', 'left']),
|
|
61
|
-
theme: PropTypes.oneOf(['default', 'coorpmanager'])
|
|
97
|
+
theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc']),
|
|
98
|
+
details: PropTypes.string,
|
|
99
|
+
requiredSelection: PropTypes.bool
|
|
62
100
|
} : {};
|
|
63
101
|
export default InputSwitch;
|
|
64
102
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/atom/input-switch/index.js"],"names":["React","useMemo","PropTypes","getClassState","style","InputSwitch","props","title","name","id","value","disabled","onChange","description","modified","theme","titlePosition","idSwitch","isDisabled","handleChange","e","target","checked","titleView","descriptionView","
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/input-switch/index.js"],"names":["React","useMemo","PropTypes","getClassState","style","InputSwitch","props","title","name","id","value","disabled","onChange","description","modified","theme","titlePosition","details","requiredSelection","idSwitch","isDisabled","handleChange","e","target","checked","titleView","descriptionView","getClass","defaultClass","coorpmanager","modifiedClass","coorpmanagerModified","partielUncheck","default","className","btnSwitchContainer","checkbox","alignedTextContainer","detailsTxt","propTypes","string","bool","func","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst InputSwitch = props => {\n const {\n title,\n name,\n id,\n value,\n disabled,\n onChange = noop,\n description,\n modified = false,\n theme = 'default',\n titlePosition = 'left',\n details = '',\n requiredSelection = false\n } = props;\n\n const idSwitch = id || uniqueId('input-switch-');\n const isDisabled = disabled ? 'disabled' : '';\n const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n const titleView = title ? <span className={style.title}>{`${title} `}</span> : null;\n\n const descriptionView = description ? (\n <div className={style.description}>{description}</div>\n ) : null;\n\n const getClass = () => {\n switch (theme) {\n case 'coorpmanager':\n return {\n defaultClass: style.coorpmanager,\n modifiedClass: style.coorpmanagerModified\n };\n case 'mooc':\n return {\n defaultClass: style.partielUncheck,\n modifiedClass: style.coorpmanagerModified\n };\n default:\n return {defaultClass: style.default, modifiedClass: style.modified};\n }\n };\n const {defaultClass, modifiedClass} = getClass();\n const className = getClassState(defaultClass, modifiedClass, null, modified);\n\n return (\n <div className={className} data-name={`switch-input-${theme}`}>\n {titlePosition === 'left' ? titleView : null}\n <div className={requiredSelection ? style.requiredSelection : null}>\n <div className={style.btnSwitchContainer}>\n <input\n type=\"checkbox\"\n id={idSwitch}\n name={name}\n onChange={handleChange}\n checked={value}\n disabled={isDisabled}\n className={style.checkbox}\n />\n <label htmlFor={idSwitch} data-name=\"input-switch-label\" />\n </div>\n </div>\n <div className={!details ? style.alignedTextContainer : null}>\n {titlePosition === 'right' ? titleView : null}\n {details ? <div className={style.detailsTxt}>{details}</div> : null}\n </div>\n {descriptionView}\n </div>\n );\n};\n\nInputSwitch.propTypes = {\n title: PropTypes.string,\n name: PropTypes.string,\n id: PropTypes.string,\n value: PropTypes.bool,\n disabled: PropTypes.bool,\n onChange: PropTypes.func,\n description: PropTypes.string,\n modified: PropTypes.bool,\n titlePosition: PropTypes.oneOf(['right', 'left']),\n theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc']),\n details: PropTypes.string,\n requiredSelection: PropTypes.bool\n};\nexport default InputSwitch;\n"],"file":"index.js"}
|
|
@@ -8,11 +8,10 @@
|
|
|
8
8
|
@value cm_grey_200 from colors;
|
|
9
9
|
@value black from colors;
|
|
10
10
|
@value cm_primary_blue from colors;
|
|
11
|
+
@value light_blue from colors;
|
|
11
12
|
|
|
12
13
|
.default {
|
|
13
14
|
display: flex;
|
|
14
|
-
align-items: center;
|
|
15
|
-
align-content: center;
|
|
16
15
|
}
|
|
17
16
|
|
|
18
17
|
.modified {
|
|
@@ -27,6 +26,10 @@
|
|
|
27
26
|
composes: modified;
|
|
28
27
|
}
|
|
29
28
|
|
|
29
|
+
.partielUncheck {
|
|
30
|
+
composes: coorpmanager;
|
|
31
|
+
}
|
|
32
|
+
|
|
30
33
|
.default label {
|
|
31
34
|
height: 30px;
|
|
32
35
|
position: relative;
|
|
@@ -97,12 +100,11 @@
|
|
|
97
100
|
font-size: 15px;
|
|
98
101
|
text-transform: none;
|
|
99
102
|
color: dark;
|
|
100
|
-
width: 180px;
|
|
101
103
|
margin-right: 20px;
|
|
102
|
-
min-height: 50px;
|
|
103
104
|
display: flex;
|
|
104
105
|
align-items: center;
|
|
105
106
|
align-content: center;
|
|
107
|
+
min-height: 24px;
|
|
106
108
|
}
|
|
107
109
|
|
|
108
110
|
.description {
|
|
@@ -118,7 +120,7 @@
|
|
|
118
120
|
width: 48px;
|
|
119
121
|
height: 24px;
|
|
120
122
|
border: solid 2px cm_grey_200;
|
|
121
|
-
margin-right:
|
|
123
|
+
margin-right: 16px;
|
|
122
124
|
background: cm_grey_200;
|
|
123
125
|
}
|
|
124
126
|
|
|
@@ -148,4 +150,52 @@
|
|
|
148
150
|
|
|
149
151
|
.coorpmanager .checkbox:disabled ~ label::after {
|
|
150
152
|
background: white;
|
|
151
|
-
}
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
.partielUncheck label::after {
|
|
156
|
+
width: 19px;
|
|
157
|
+
height: 19px;
|
|
158
|
+
border: 3px solid cm_primary_blue;
|
|
159
|
+
margin-left: 8px;
|
|
160
|
+
}
|
|
161
|
+
.partielUncheck label {
|
|
162
|
+
width: 50px;
|
|
163
|
+
height: 26px;
|
|
164
|
+
background: light_blue;
|
|
165
|
+
border: 0px;
|
|
166
|
+
}
|
|
167
|
+
.partielUncheck .checkbox:checked ~ label {
|
|
168
|
+
background-color: cm_primary_blue;
|
|
169
|
+
border: 0px;
|
|
170
|
+
width: 50px;
|
|
171
|
+
height: 26px;
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
.partielUncheck .checkbox:checked ~ label::after {
|
|
175
|
+
margin-left: 0px;
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
.btnSwitchContainer {
|
|
179
|
+
display: flex;
|
|
180
|
+
align-items: center;
|
|
181
|
+
}
|
|
182
|
+
.alignedTextContainer {
|
|
183
|
+
display: flex;
|
|
184
|
+
align-items: center;
|
|
185
|
+
align-content: center;
|
|
186
|
+
}
|
|
187
|
+
.detailsTxt {
|
|
188
|
+
font-family: Gilroy;
|
|
189
|
+
font-weight: 500;
|
|
190
|
+
font-size: 14px;
|
|
191
|
+
line-height: 22px;
|
|
192
|
+
color: black;
|
|
193
|
+
font-style: normal;
|
|
194
|
+
white-space: pre-line;
|
|
195
|
+
margin-right: 24px;
|
|
196
|
+
}
|
|
197
|
+
.requiredSelection label, .requiredSelection .checkbox:disabled ~ label {
|
|
198
|
+
background-color: cm_primary_blue;
|
|
199
|
+
border-color: cm_primary_blue;
|
|
200
|
+
opacity: 0.4;
|
|
201
|
+
}
|