@coorpacademy/components 10.30.4-alpha.2 → 10.30.5-alpha.1
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/choice/index.native.js +2 -4
- package/es/atom/choice/index.native.js.map +1 -1
- package/es/atom/html/index.native.js +1 -3
- package/es/atom/html/index.native.js.map +1 -1
- package/es/atom/review-presentation/index.native.js +56 -60
- package/es/atom/review-presentation/index.native.js.map +1 -1
- package/es/hoc/modal/select/index.native.js +3 -3
- package/es/hoc/modal/select/index.native.js.map +1 -1
- package/es/hoc/modal/select-item/index.native.js +13 -17
- package/es/hoc/modal/select-item/index.native.js.map +1 -1
- package/es/hoc/touchable/index.native.js +2 -2
- package/es/hoc/touchable/index.native.js.map +1 -1
- package/es/molecule/dashboard/cards-list/index.js +3 -7
- package/es/molecule/dashboard/cards-list/index.js.map +1 -1
- package/es/molecule/questions/free-text/index.native.js +26 -30
- package/es/molecule/questions/free-text/index.native.js.map +1 -1
- package/es/molecule/questions/mobile/slider/index.native.js +3 -5
- package/es/molecule/questions/mobile/slider/index.native.js.map +1 -1
- package/es/molecule/questions/mobile/template/index.native.js +1 -3
- package/es/molecule/questions/mobile/template/index.native.js.map +1 -1
- package/es/organism/mooc-header/index.d.ts +2 -2
- package/es/organism/mooc-header/index.d.ts.map +1 -1
- package/es/organism/mooc-header/index.js +6 -2
- package/es/organism/mooc-header/index.js.map +1 -1
- package/es/organism/review-congrats/index.js +1 -3
- package/es/organism/review-congrats/index.js.map +1 -1
- package/es/organism/review-slide/index.d.ts.map +1 -1
- package/es/organism/review-slide/index.js +6 -2
- package/es/organism/review-slide/index.js.map +1 -1
- package/es/organism/review-slide/index.native.d.ts.map +1 -1
- package/es/organism/review-slide/index.native.js +116 -79
- package/es/organism/review-slide/index.native.js.map +1 -1
- package/es/organism/review-slide/prop-types.d.ts +11 -0
- package/es/organism/review-slide/prop-types.d.ts.map +1 -1
- package/es/organism/review-slide/prop-types.js.map +1 -1
- package/es/template/common/dashboard/index.d.ts +0 -1
- package/es/template/common/dashboard/index.d.ts.map +1 -1
- package/es/template/common/dashboard/index.js +3 -26
- package/es/template/common/dashboard/index.js.map +1 -1
- package/lib/atom/choice/index.native.js +2 -4
- package/lib/atom/choice/index.native.js.map +1 -1
- package/lib/atom/html/index.native.js +1 -3
- package/lib/atom/html/index.native.js.map +1 -1
- package/lib/atom/review-presentation/index.native.js +56 -60
- package/lib/atom/review-presentation/index.native.js.map +1 -1
- package/lib/hoc/modal/select/index.native.js +3 -3
- package/lib/hoc/modal/select/index.native.js.map +1 -1
- package/lib/hoc/modal/select-item/index.native.js +13 -17
- package/lib/hoc/modal/select-item/index.native.js.map +1 -1
- package/lib/hoc/touchable/index.native.js +2 -2
- package/lib/hoc/touchable/index.native.js.map +1 -1
- package/lib/molecule/dashboard/cards-list/index.js +3 -7
- package/lib/molecule/dashboard/cards-list/index.js.map +1 -1
- package/lib/molecule/questions/free-text/index.native.js +26 -30
- package/lib/molecule/questions/free-text/index.native.js.map +1 -1
- package/lib/molecule/questions/mobile/slider/index.native.js +3 -5
- package/lib/molecule/questions/mobile/slider/index.native.js.map +1 -1
- package/lib/molecule/questions/mobile/template/index.native.js +1 -3
- package/lib/molecule/questions/mobile/template/index.native.js.map +1 -1
- package/lib/organism/mooc-header/index.d.ts +2 -2
- package/lib/organism/mooc-header/index.d.ts.map +1 -1
- package/lib/organism/mooc-header/index.js +6 -2
- package/lib/organism/mooc-header/index.js.map +1 -1
- package/lib/organism/review-congrats/index.js +1 -3
- package/lib/organism/review-congrats/index.js.map +1 -1
- package/lib/organism/review-slide/index.d.ts.map +1 -1
- package/lib/organism/review-slide/index.js +6 -2
- package/lib/organism/review-slide/index.js.map +1 -1
- package/lib/organism/review-slide/index.native.d.ts.map +1 -1
- package/lib/organism/review-slide/index.native.js +115 -78
- package/lib/organism/review-slide/index.native.js.map +1 -1
- package/lib/organism/review-slide/prop-types.d.ts +11 -0
- package/lib/organism/review-slide/prop-types.d.ts.map +1 -1
- package/lib/organism/review-slide/prop-types.js.map +1 -1
- package/lib/template/common/dashboard/index.d.ts +0 -1
- package/lib/template/common/dashboard/index.d.ts.map +1 -1
- package/lib/template/common/dashboard/index.js +3 -30
- package/lib/template/common/dashboard/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","content","paddingHorizontal","separator","borderTopWidth","borderColor","colors","border","list","width","keyExtractor","item","index","createRenderItem","value","testID","onChange","Item","handleChange","_value","text","createSeparator","styleSheet","Separator","ModalSelect","props","templateContext","useTemplateContext","setStylesheet","useState","values","onClose","useEffect","_stylesheet","renderItem","useMemo","renderSeparator"],"sources":["../../../../src/hoc/modal/select/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, useMemo} from 'react';\nimport {View, FlatList, StyleSheet, GestureResponderEvent, ViewStyle} from 'react-native';\nimport {noop} from 'lodash/fp';\n\nimport {Theme} from '../../../variables/theme.native';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\n\nimport Modal from '../index.native';\nimport ModalSelectItem from '../select-item/index.native';\nimport {ChoiceItem} from '../../../atom/select-modal/index.native';\n\nexport type OnChangeFunction = (value: string) => void;\n\nexport type Props = {\n value?: string;\n values: Array<ChoiceItem> | undefined;\n onChange: OnChangeFunction;\n onClose?: (event: GestureResponderEvent) => void;\n testID?: string;\n};\n\ntype StyleSheetType = {\n content: ViewStyle;\n separator: ViewStyle;\n list: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n content: {\n paddingHorizontal: 0\n },\n separator: {\n borderTopWidth: 1,\n borderColor: theme.colors.border\n },\n list: {\n width: '100%'\n }\n });\n\nconst keyExtractor = (item: ChoiceItem, index: number): string => {\n return `modal-select-item-${index + 1}`;\n};\n\ntype ItemProps = {item: ChoiceItem; index: number};\nconst createRenderItem = (value: string, testID: string, onChange: OnChangeFunction) =>\n function Item({item, index}: ItemProps) {\n // eslint-disable-next-line unicorn/consistent-function-scoping\n const handleChange = (_value: string) => () => onChange(_value);\n\n return (\n <ModalSelectItem\n onPress={handleChange(item.text)}\n isSelected={value === item.text}\n testID={`${testID}-item-${index + 1}`}\n >\n {item.text}\n </ModalSelectItem>\n );\n };\n\nconst createSeparator = (styleSheet: StyleSheetType) =>\n function Separator() {\n return <View style={styleSheet?.separator} />;\n };\n\nconst ModalSelect = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {theme} = templateContext;\n const {value = '', values, onChange, onClose = noop, testID = 'modal-select'} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n const renderItem = useMemo(\n () => createRenderItem(value, testID, onChange),\n [value, testID, onChange]\n );\n\n const renderSeparator = useMemo(\n () => (styleSheet ? createSeparator(styleSheet) : null),\n [styleSheet]\n );\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal onClose={onClose} contentStyle={styleSheet?.content} testID={testID}>\n <FlatList\n data={values}\n renderItem={renderItem}\n keyExtractor={keyExtractor}\n showsVerticalScrollIndicator={false}\n ItemSeparatorComponent={renderSeparator}\n style={styleSheet?.list}\n testID={`${testID}-items`}\n />\n </Modal>\n );\n};\n\nexport default ModalSelect;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAIA;;AAEA;;AACA;;;;;;;;AAmBA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,OAAO,EAAE;IACPC,iBAAiB,EAAE;EADZ,CADO;EAIhBC,SAAS,EAAE;IACTC,cAAc,EAAE,CADP;IAETC,WAAW,EAAEP,KAAK,CAACQ,MAAN,CAAaC;EAFjB,CAJK;EAQhBC,IAAI,EAAE;IACJC,KAAK,EAAE;EADH;AARU,CAAlB,CADF;;AAcA,MAAMC,YAAY,GAAG,CAACC,IAAD,EAAmBC,KAAnB,KAA6C;EAChE,OAAQ,qBAAoBA,KAAK,GAAG,CAAE,EAAtC;AACD,CAFD;;AAKA,MAAMC,gBAAgB,GAAG,CAACC,KAAD,EAAgBC,MAAhB,EAAgCC,QAAhC,KACvB,SAASC,IAAT,CAAc;EAACN,IAAD;EAAOC;AAAP,CAAd,EAAwC;EACtC;EACA,MAAMM,YAAY,GAAIC,MAAD,IAAoB,MAAMH,QAAQ,CAACG,MAAD,CAAvD;;EAEA,oBACE,6BAAC,eAAD;IACE,OAAO,EAAED,YAAY,CAACP,IAAI,CAACS,IAAN,CADvB;IAEE,UAAU,EAAEN,KAAK,KAAKH,IAAI,CAACS,IAF7B;IAGE,MAAM,EAAG,GAAEL,MAAO,SAAQH,KAAK,GAAG,CAAE;EAHtC,GAKGD,IAAI,CAACS,IALR,CADF;AASD,CAdH;;AAgBA,MAAMC,eAAe,GAAIC,UAAD,IACtB,SAASC,SAAT,GAAqB;EACnB,oBAAO,6BAAC,iBAAD;IAAM,KAAK,EAAED,
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","content","paddingHorizontal","separator","borderTopWidth","borderColor","colors","border","list","width","keyExtractor","item","index","createRenderItem","value","testID","onChange","Item","handleChange","_value","text","createSeparator","styleSheet","Separator","ModalSelect","props","templateContext","useTemplateContext","setStylesheet","useState","values","onClose","useEffect","_stylesheet","renderItem","useMemo","renderSeparator"],"sources":["../../../../src/hoc/modal/select/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, useMemo} from 'react';\nimport {View, FlatList, StyleSheet, GestureResponderEvent, ViewStyle} from 'react-native';\nimport {noop} from 'lodash/fp';\n\nimport {Theme} from '../../../variables/theme.native';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\n\nimport Modal from '../index.native';\nimport ModalSelectItem from '../select-item/index.native';\nimport {ChoiceItem} from '../../../atom/select-modal/index.native';\n\nexport type OnChangeFunction = (value: string) => void;\n\nexport type Props = {\n value?: string;\n values: Array<ChoiceItem> | undefined;\n onChange: OnChangeFunction;\n onClose?: (event: GestureResponderEvent) => void;\n testID?: string;\n};\n\ntype StyleSheetType = {\n content: ViewStyle;\n separator: ViewStyle;\n list: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n content: {\n paddingHorizontal: 0\n },\n separator: {\n borderTopWidth: 1,\n borderColor: theme.colors.border\n },\n list: {\n width: '100%'\n }\n });\n\nconst keyExtractor = (item: ChoiceItem, index: number): string => {\n return `modal-select-item-${index + 1}`;\n};\n\ntype ItemProps = {item: ChoiceItem; index: number};\nconst createRenderItem = (value: string, testID: string, onChange: OnChangeFunction) =>\n function Item({item, index}: ItemProps) {\n // eslint-disable-next-line unicorn/consistent-function-scoping\n const handleChange = (_value: string) => () => onChange(_value);\n\n return (\n <ModalSelectItem\n onPress={handleChange(item.text)}\n isSelected={value === item.text}\n testID={`${testID}-item-${index + 1}`}\n >\n {item.text}\n </ModalSelectItem>\n );\n };\n\nconst createSeparator = (styleSheet: StyleSheetType) =>\n function Separator() {\n return <View style={styleSheet?.separator} />;\n };\n\nconst ModalSelect = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {theme} = templateContext;\n const {value = '', values, onChange, onClose = noop, testID = 'modal-select'} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n const renderItem = useMemo(\n () => createRenderItem(value, testID, onChange),\n [value, testID, onChange]\n );\n\n const renderSeparator = useMemo(\n () => (styleSheet ? createSeparator(styleSheet) : null),\n [styleSheet]\n );\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal onClose={onClose} contentStyle={styleSheet?.content} testID={testID}>\n <FlatList\n data={values}\n renderItem={renderItem}\n keyExtractor={keyExtractor}\n showsVerticalScrollIndicator={false}\n ItemSeparatorComponent={renderSeparator}\n style={styleSheet?.list}\n testID={`${testID}-items`}\n />\n </Modal>\n );\n};\n\nexport default ModalSelect;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAIA;;AAEA;;AACA;;;;;;;;AAmBA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,OAAO,EAAE;IACPC,iBAAiB,EAAE;EADZ,CADO;EAIhBC,SAAS,EAAE;IACTC,cAAc,EAAE,CADP;IAETC,WAAW,EAAEP,KAAK,CAACQ,MAAN,CAAaC;EAFjB,CAJK;EAQhBC,IAAI,EAAE;IACJC,KAAK,EAAE;EADH;AARU,CAAlB,CADF;;AAcA,MAAMC,YAAY,GAAG,CAACC,IAAD,EAAmBC,KAAnB,KAA6C;EAChE,OAAQ,qBAAoBA,KAAK,GAAG,CAAE,EAAtC;AACD,CAFD;;AAKA,MAAMC,gBAAgB,GAAG,CAACC,KAAD,EAAgBC,MAAhB,EAAgCC,QAAhC,KACvB,SAASC,IAAT,CAAc;EAACN,IAAD;EAAOC;AAAP,CAAd,EAAwC;EACtC;EACA,MAAMM,YAAY,GAAIC,MAAD,IAAoB,MAAMH,QAAQ,CAACG,MAAD,CAAvD;;EAEA,oBACE,6BAAC,eAAD;IACE,OAAO,EAAED,YAAY,CAACP,IAAI,CAACS,IAAN,CADvB;IAEE,UAAU,EAAEN,KAAK,KAAKH,IAAI,CAACS,IAF7B;IAGE,MAAM,EAAG,GAAEL,MAAO,SAAQH,KAAK,GAAG,CAAE;EAHtC,GAKGD,IAAI,CAACS,IALR,CADF;AASD,CAdH;;AAgBA,MAAMC,eAAe,GAAIC,UAAD,IACtB,SAASC,SAAT,GAAqB;EACnB,oBAAO,6BAAC,iBAAD;IAAM,KAAK,EAAED,UAAU,EAAEnB;EAAzB,EAAP;AACD,CAHH;;AAKA,MAAMqB,WAAW,GAAIC,KAAD,IAAkB;EACpC,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACL,UAAD,EAAaM,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAAC/B;EAAD,IAAU4B,eAAhB;EACA,MAAM;IAACZ,KAAK,GAAG,EAAT;IAAagB,MAAb;IAAqBd,QAArB;IAA+Be,OAAO,iBAAtC;IAA+ChB,MAAM,GAAG;EAAxD,IAA0EU,KAAhF;EAEA,IAAAO,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAGpC,gBAAgB,CAACC,KAAD,CAApC;;IACA8B,aAAa,CAACK,WAAD,CAAb;EACD,CAHD,EAGG,CAACnC,KAAD,CAHH;EAKA,MAAMoC,UAAU,GAAG,IAAAC,cAAA,EACjB,MAAMtB,gBAAgB,CAACC,KAAD,EAAQC,MAAR,EAAgBC,QAAhB,CADL,EAEjB,CAACF,KAAD,EAAQC,MAAR,EAAgBC,QAAhB,CAFiB,CAAnB;EAKA,MAAMoB,eAAe,GAAG,IAAAD,cAAA,EACtB,MAAOb,UAAU,GAAGD,eAAe,CAACC,UAAD,CAAlB,GAAiC,IAD5B,EAEtB,CAACA,UAAD,CAFsB,CAAxB;;EAKA,IAAI,CAACA,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,cAAD;IAAO,OAAO,EAAES,OAAhB;IAAyB,YAAY,EAAET,UAAU,EAAErB,OAAnD;IAA4D,MAAM,EAAEc;EAApE,gBACE,6BAAC,qBAAD;IACE,IAAI,EAAEe,MADR;IAEE,UAAU,EAAEI,UAFd;IAGE,YAAY,EAAExB,YAHhB;IAIE,4BAA4B,EAAE,KAJhC;IAKE,sBAAsB,EAAE0B,eAL1B;IAME,KAAK,EAAEd,UAAU,EAAEd,IANrB;IAOE,MAAM,EAAG,GAAEO,MAAO;EAPpB,EADF,CADF;AAaD,CAtCD;;eAwCeS,W"}
|
|
@@ -19,23 +19,19 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
19
19
|
|
|
20
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
21
|
|
|
22
|
-
const createStyleSheet = (brandTheme, theme) => {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
color: brandTheme == null ? void 0 : (_brandTheme$colors = brandTheme.colors) == null ? void 0 : _brandTheme$colors.primary
|
|
36
|
-
}
|
|
37
|
-
});
|
|
38
|
-
};
|
|
22
|
+
const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
|
|
23
|
+
container: {
|
|
24
|
+
backgroundColor: theme.colors.white,
|
|
25
|
+
padding: theme.spacing.small
|
|
26
|
+
},
|
|
27
|
+
text: {
|
|
28
|
+
fontWeight: theme.fontWeight.bold,
|
|
29
|
+
color: theme.colors.black
|
|
30
|
+
},
|
|
31
|
+
selectedTextStyle: {
|
|
32
|
+
color: brandTheme?.colors?.primary
|
|
33
|
+
}
|
|
34
|
+
});
|
|
39
35
|
|
|
40
36
|
const ModalSelectItem = props => {
|
|
41
37
|
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","container","backgroundColor","colors","white","padding","spacing","small","text","fontWeight","bold","color","black","selectedTextStyle","primary","ModalSelectItem","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","useEffect","_stylesheet","children","onPress","isSelected","testID","textStyle","push"],"sources":["../../../../src/hoc/modal/select-item/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {GestureResponderEvent, StyleSheet, TextStyle, ViewStyle} from 'react-native';\n\nimport Text from '../../../atom/text/index.native';\nimport Touchable from '../../touchable/index.native';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {Theme} from '../../../variables/theme.native';\nimport {Brand} from '../../../variables/brand.native';\n\nexport type Props = {\n isSelected?: boolean;\n children: string;\n onPress?: (event: GestureResponderEvent) => void;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n text: TextStyle;\n selectedTextStyle: TextStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme): StyleSheetType =>\n StyleSheet.create({\n container: {\n backgroundColor: theme.colors.white,\n padding: theme.spacing.small\n },\n text: {\n fontWeight: theme.fontWeight.bold,\n color: theme.colors.black\n },\n selectedTextStyle: {\n color: brandTheme?.colors?.primary\n }\n });\n\nconst ModalSelectItem = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme} = templateContext;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [theme, brandTheme]);\n\n if (!styleSheet) {\n return null;\n }\n\n const {children, onPress, isSelected, testID} = props;\n\n const textStyle: TextStyle[] = [styleSheet.text];\n if (isSelected) {\n textStyle.push(styleSheet.selectedTextStyle);\n }\n\n return (\n <Touchable onPress={onPress} style={styleSheet.container} testID={testID}>\n <Text style={textStyle}>{children}</Text>\n </Touchable>\n );\n};\n\nexport default ModalSelectItem;\n"],"mappings":";;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;AAiBA,MAAMA,gBAAgB,GAAG,CAACC,UAAD,EAAoBC,KAApB
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","container","backgroundColor","colors","white","padding","spacing","small","text","fontWeight","bold","color","black","selectedTextStyle","primary","ModalSelectItem","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","useEffect","_stylesheet","children","onPress","isSelected","testID","textStyle","push"],"sources":["../../../../src/hoc/modal/select-item/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {GestureResponderEvent, StyleSheet, TextStyle, ViewStyle} from 'react-native';\n\nimport Text from '../../../atom/text/index.native';\nimport Touchable from '../../touchable/index.native';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {Theme} from '../../../variables/theme.native';\nimport {Brand} from '../../../variables/brand.native';\n\nexport type Props = {\n isSelected?: boolean;\n children: string;\n onPress?: (event: GestureResponderEvent) => void;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n text: TextStyle;\n selectedTextStyle: TextStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme): StyleSheetType =>\n StyleSheet.create({\n container: {\n backgroundColor: theme.colors.white,\n padding: theme.spacing.small\n },\n text: {\n fontWeight: theme.fontWeight.bold,\n color: theme.colors.black\n },\n selectedTextStyle: {\n color: brandTheme?.colors?.primary\n }\n });\n\nconst ModalSelectItem = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme} = templateContext;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [theme, brandTheme]);\n\n if (!styleSheet) {\n return null;\n }\n\n const {children, onPress, isSelected, testID} = props;\n\n const textStyle: TextStyle[] = [styleSheet.text];\n if (isSelected) {\n textStyle.push(styleSheet.selectedTextStyle);\n }\n\n return (\n <Touchable onPress={onPress} style={styleSheet.container} testID={testID}>\n <Text style={textStyle}>{children}</Text>\n </Touchable>\n );\n};\n\nexport default ModalSelectItem;\n"],"mappings":";;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;AAiBA,MAAMA,gBAAgB,GAAG,CAACC,UAAD,EAAoBC,KAApB,KACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,eAAe,EAAEJ,KAAK,CAACK,MAAN,CAAaC,KADrB;IAETC,OAAO,EAAEP,KAAK,CAACQ,OAAN,CAAcC;EAFd,CADK;EAKhBC,IAAI,EAAE;IACJC,UAAU,EAAEX,KAAK,CAACW,UAAN,CAAiBC,IADzB;IAEJC,KAAK,EAAEb,KAAK,CAACK,MAAN,CAAaS;EAFhB,CALU;EAShBC,iBAAiB,EAAE;IACjBF,KAAK,EAAEd,UAAU,EAAEM,MAAZ,EAAoBW;EADV;AATH,CAAlB,CADF;;AAeA,MAAMC,eAAe,GAAIC,KAAD,IAAkB;EACxC,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAACxB,UAAD;IAAaC;EAAb,IAAsBmB,eAA5B;EAEA,IAAAK,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAG3B,gBAAgB,CAACC,UAAD,EAAaC,KAAb,CAApC;;IACAsB,aAAa,CAACG,WAAD,CAAb;EACD,CAHD,EAGG,CAACzB,KAAD,EAAQD,UAAR,CAHH;;EAKA,IAAI,CAACsB,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,MAAM;IAACK,QAAD;IAAWC,OAAX;IAAoBC,UAApB;IAAgCC;EAAhC,IAA0CX,KAAhD;EAEA,MAAMY,SAAsB,GAAG,CAACT,UAAU,CAACX,IAAZ,CAA/B;;EACA,IAAIkB,UAAJ,EAAgB;IACdE,SAAS,CAACC,IAAV,CAAeV,UAAU,CAACN,iBAA1B;EACD;;EAED,oBACE,6BAAC,eAAD;IAAW,OAAO,EAAEY,OAApB;IAA6B,KAAK,EAAEN,UAAU,CAAClB,SAA/C;IAA0D,MAAM,EAAE0B;EAAlE,gBACE,6BAAC,cAAD;IAAM,KAAK,EAAEC;EAAb,GAAyBJ,QAAzB,CADF,CADF;AAKD,CA1BD;;eA4BeT,e"}
|
|
@@ -49,13 +49,13 @@ const Touchable = props => {
|
|
|
49
49
|
} = props;
|
|
50
50
|
const handlePress = (0, _react.useMemo)(() => event => {
|
|
51
51
|
if (!onPress) return;
|
|
52
|
-
vibration
|
|
52
|
+
vibration?.vibrate();
|
|
53
53
|
analytics && analyticsID && logEvent(_analytics.ANALYTICS_EVENT_TYPE.PRESS, analyticsID, analytics, analyticsParams);
|
|
54
54
|
onPress(event);
|
|
55
55
|
}, [analytics, analyticsID, analyticsParams, onPress, vibration]);
|
|
56
56
|
const handleLongPress = (0, _react.useMemo)(() => event => {
|
|
57
57
|
if (!onLongPress) return;
|
|
58
|
-
vibration
|
|
58
|
+
vibration?.vibrate();
|
|
59
59
|
analytics && analyticsID && logEvent(_analytics.ANALYTICS_EVENT_TYPE.LONG_PRESS, analyticsID, analytics, analyticsParams);
|
|
60
60
|
onLongPress(event);
|
|
61
61
|
}, [analytics, analyticsID, analyticsParams, onLongPress, vibration]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["hitSlop","left","right","bottom","top","logEvent","eventName","analyticsID","analytics","analyticsParams","id","Touchable","props","templateContext","useTemplateContext","theme","vibration","onPress","onLongPress","isWithoutFeedback","isHighlight","activeOpacity","disabled","handlePress","useMemo","event","vibrate","ANALYTICS_EVENT_TYPE","PRESS","handleLongPress","LONG_PRESS","colors","gray","light"],"sources":["../../../src/hoc/touchable/index.native.tsx"],"sourcesContent":["import {\n TouchableOpacity,\n TouchableHighlight,\n ViewStyle,\n LayoutChangeEvent,\n NativeSyntheticEvent,\n GestureResponderEvent,\n TargetedEvent\n} from 'react-native';\n\nimport React, {useMemo} from 'react';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics, AnalyticsEventParams} from '../../variables/analytics';\nimport {Vibration} from '../../variables/vibration';\n\nconst hitSlop = {\n left: 12,\n right: 12,\n bottom: 12,\n top: 12\n};\n\nexport type Props = {\n accessibilityLabel?: string;\n accessible?: boolean;\n children?: React.ReactNode;\n delayLongPress?: number;\n delayPressIn?: number;\n delayPressOut?: number;\n disabled?: boolean;\n focusable?: boolean;\n onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void;\n onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void;\n onLayout?: (event: LayoutChangeEvent) => void;\n onLongPress?: (event: GestureResponderEvent) => void;\n onPress?: (event: GestureResponderEvent) => void;\n onPressIn?: (event: GestureResponderEvent) => void;\n onPressOut?: (event: GestureResponderEvent) => void;\n testID?: string;\n isHighlight?: boolean;\n isWithoutFeedback?: boolean;\n // for TouchableOpacity\n activeOpacity?: number;\n style?: ViewStyle;\n // Analytics\n analytics?: Analytics;\n analyticsID?: string;\n analyticsParams?: AnalyticsEventParams;\n vibration?: Vibration;\n};\n\nconst logEvent = (\n eventName: string,\n analyticsID: string,\n analytics: Analytics,\n analyticsParams?: AnalyticsEventParams\n) => {\n analytics &&\n analytics.logEvent(eventName, {\n ...(analyticsParams || {}),\n id: analyticsID\n });\n};\n\nconst Touchable = (props: Props) => {\n const templateContext = useTemplateContext();\n\n const {theme, vibration, analytics} = templateContext;\n\n const {\n analyticsID,\n analyticsParams,\n onPress,\n onLongPress,\n isWithoutFeedback,\n isHighlight,\n activeOpacity,\n disabled\n } = props;\n\n const handlePress = useMemo(\n () => (event: GestureResponderEvent) => {\n if (!onPress) return;\n\n vibration?.vibrate();\n\n analytics &&\n analyticsID &&\n logEvent(ANALYTICS_EVENT_TYPE.PRESS, analyticsID, analytics, analyticsParams);\n onPress(event);\n },\n [analytics, analyticsID, analyticsParams, onPress, vibration]\n );\n\n const handleLongPress = useMemo(\n () => (event: GestureResponderEvent) => {\n if (!onLongPress) return;\n\n vibration?.vibrate();\n\n analytics &&\n analyticsID &&\n logEvent(ANALYTICS_EVENT_TYPE.LONG_PRESS, analyticsID, analytics, analyticsParams);\n onLongPress(event);\n },\n [analytics, analyticsID, analyticsParams, onLongPress, vibration]\n );\n\n if (isHighlight) {\n return (\n <TouchableHighlight\n {...props}\n hitSlop={hitSlop}\n underlayColor={theme.colors.gray.light}\n onPress={handlePress}\n onLongPress={handleLongPress}\n activeOpacity={activeOpacity || (disabled ? 1 : 0.85)}\n />\n );\n }\n\n return (\n <TouchableOpacity\n {...props}\n hitSlop={hitSlop}\n onPress={handlePress}\n onLongPress={handleLongPress}\n activeOpacity={(isWithoutFeedback && 1) || activeOpacity || (disabled ? 1 : 0.2)}\n />\n );\n};\n\nexport default Touchable;\n"],"mappings":";;;;;AAAA;;AAUA;;AACA;;AACA;;;;;;;;AAGA,MAAMA,OAAO,GAAG;EACdC,IAAI,EAAE,EADQ;EAEdC,KAAK,EAAE,EAFO;EAGdC,MAAM,EAAE,EAHM;EAIdC,GAAG,EAAE;AAJS,CAAhB;;AAoCA,MAAMC,QAAQ,GAAG,CACfC,SADe,EAEfC,WAFe,EAGfC,SAHe,EAIfC,eAJe,KAKZ;EACHD,SAAS,IACPA,SAAS,CAACH,QAAV,CAAmBC,SAAnB,eACMG,eAAe,IAAI,EADzB;IAEEC,EAAE,EAAEH;EAFN,GADF;AAKD,CAXD;;AAaA,MAAMI,SAAS,GAAIC,KAAD,IAAkB;EAClC,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EAEA,MAAM;IAACC,KAAD;IAAQC,SAAR;IAAmBR;EAAnB,IAAgCK,eAAtC;EAEA,MAAM;IACJN,WADI;IAEJE,eAFI;IAGJQ,OAHI;IAIJC,WAJI;IAKJC,iBALI;IAMJC,WANI;IAOJC,aAPI;IAQJC;EARI,IASFV,KATJ;EAWA,MAAMW,WAAW,GAAG,IAAAC,cAAA,EAClB,MAAOC,KAAD,IAAkC;IACtC,IAAI,CAACR,OAAL,EAAc;IAEdD,SAAS,
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["hitSlop","left","right","bottom","top","logEvent","eventName","analyticsID","analytics","analyticsParams","id","Touchable","props","templateContext","useTemplateContext","theme","vibration","onPress","onLongPress","isWithoutFeedback","isHighlight","activeOpacity","disabled","handlePress","useMemo","event","vibrate","ANALYTICS_EVENT_TYPE","PRESS","handleLongPress","LONG_PRESS","colors","gray","light"],"sources":["../../../src/hoc/touchable/index.native.tsx"],"sourcesContent":["import {\n TouchableOpacity,\n TouchableHighlight,\n ViewStyle,\n LayoutChangeEvent,\n NativeSyntheticEvent,\n GestureResponderEvent,\n TargetedEvent\n} from 'react-native';\n\nimport React, {useMemo} from 'react';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics, AnalyticsEventParams} from '../../variables/analytics';\nimport {Vibration} from '../../variables/vibration';\n\nconst hitSlop = {\n left: 12,\n right: 12,\n bottom: 12,\n top: 12\n};\n\nexport type Props = {\n accessibilityLabel?: string;\n accessible?: boolean;\n children?: React.ReactNode;\n delayLongPress?: number;\n delayPressIn?: number;\n delayPressOut?: number;\n disabled?: boolean;\n focusable?: boolean;\n onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void;\n onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void;\n onLayout?: (event: LayoutChangeEvent) => void;\n onLongPress?: (event: GestureResponderEvent) => void;\n onPress?: (event: GestureResponderEvent) => void;\n onPressIn?: (event: GestureResponderEvent) => void;\n onPressOut?: (event: GestureResponderEvent) => void;\n testID?: string;\n isHighlight?: boolean;\n isWithoutFeedback?: boolean;\n // for TouchableOpacity\n activeOpacity?: number;\n style?: ViewStyle;\n // Analytics\n analytics?: Analytics;\n analyticsID?: string;\n analyticsParams?: AnalyticsEventParams;\n vibration?: Vibration;\n};\n\nconst logEvent = (\n eventName: string,\n analyticsID: string,\n analytics: Analytics,\n analyticsParams?: AnalyticsEventParams\n) => {\n analytics &&\n analytics.logEvent(eventName, {\n ...(analyticsParams || {}),\n id: analyticsID\n });\n};\n\nconst Touchable = (props: Props) => {\n const templateContext = useTemplateContext();\n\n const {theme, vibration, analytics} = templateContext;\n\n const {\n analyticsID,\n analyticsParams,\n onPress,\n onLongPress,\n isWithoutFeedback,\n isHighlight,\n activeOpacity,\n disabled\n } = props;\n\n const handlePress = useMemo(\n () => (event: GestureResponderEvent) => {\n if (!onPress) return;\n\n vibration?.vibrate();\n\n analytics &&\n analyticsID &&\n logEvent(ANALYTICS_EVENT_TYPE.PRESS, analyticsID, analytics, analyticsParams);\n onPress(event);\n },\n [analytics, analyticsID, analyticsParams, onPress, vibration]\n );\n\n const handleLongPress = useMemo(\n () => (event: GestureResponderEvent) => {\n if (!onLongPress) return;\n\n vibration?.vibrate();\n\n analytics &&\n analyticsID &&\n logEvent(ANALYTICS_EVENT_TYPE.LONG_PRESS, analyticsID, analytics, analyticsParams);\n onLongPress(event);\n },\n [analytics, analyticsID, analyticsParams, onLongPress, vibration]\n );\n\n if (isHighlight) {\n return (\n <TouchableHighlight\n {...props}\n hitSlop={hitSlop}\n underlayColor={theme.colors.gray.light}\n onPress={handlePress}\n onLongPress={handleLongPress}\n activeOpacity={activeOpacity || (disabled ? 1 : 0.85)}\n />\n );\n }\n\n return (\n <TouchableOpacity\n {...props}\n hitSlop={hitSlop}\n onPress={handlePress}\n onLongPress={handleLongPress}\n activeOpacity={(isWithoutFeedback && 1) || activeOpacity || (disabled ? 1 : 0.2)}\n />\n );\n};\n\nexport default Touchable;\n"],"mappings":";;;;;AAAA;;AAUA;;AACA;;AACA;;;;;;;;AAGA,MAAMA,OAAO,GAAG;EACdC,IAAI,EAAE,EADQ;EAEdC,KAAK,EAAE,EAFO;EAGdC,MAAM,EAAE,EAHM;EAIdC,GAAG,EAAE;AAJS,CAAhB;;AAoCA,MAAMC,QAAQ,GAAG,CACfC,SADe,EAEfC,WAFe,EAGfC,SAHe,EAIfC,eAJe,KAKZ;EACHD,SAAS,IACPA,SAAS,CAACH,QAAV,CAAmBC,SAAnB,eACMG,eAAe,IAAI,EADzB;IAEEC,EAAE,EAAEH;EAFN,GADF;AAKD,CAXD;;AAaA,MAAMI,SAAS,GAAIC,KAAD,IAAkB;EAClC,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EAEA,MAAM;IAACC,KAAD;IAAQC,SAAR;IAAmBR;EAAnB,IAAgCK,eAAtC;EAEA,MAAM;IACJN,WADI;IAEJE,eAFI;IAGJQ,OAHI;IAIJC,WAJI;IAKJC,iBALI;IAMJC,WANI;IAOJC,aAPI;IAQJC;EARI,IASFV,KATJ;EAWA,MAAMW,WAAW,GAAG,IAAAC,cAAA,EAClB,MAAOC,KAAD,IAAkC;IACtC,IAAI,CAACR,OAAL,EAAc;IAEdD,SAAS,EAAEU,OAAX;IAEAlB,SAAS,IACPD,WADF,IAEEF,QAAQ,CAACsB,+BAAA,CAAqBC,KAAtB,EAA6BrB,WAA7B,EAA0CC,SAA1C,EAAqDC,eAArD,CAFV;IAGAQ,OAAO,CAACQ,KAAD,CAAP;EACD,CAViB,EAWlB,CAACjB,SAAD,EAAYD,WAAZ,EAAyBE,eAAzB,EAA0CQ,OAA1C,EAAmDD,SAAnD,CAXkB,CAApB;EAcA,MAAMa,eAAe,GAAG,IAAAL,cAAA,EACtB,MAAOC,KAAD,IAAkC;IACtC,IAAI,CAACP,WAAL,EAAkB;IAElBF,SAAS,EAAEU,OAAX;IAEAlB,SAAS,IACPD,WADF,IAEEF,QAAQ,CAACsB,+BAAA,CAAqBG,UAAtB,EAAkCvB,WAAlC,EAA+CC,SAA/C,EAA0DC,eAA1D,CAFV;IAGAS,WAAW,CAACO,KAAD,CAAX;EACD,CAVqB,EAWtB,CAACjB,SAAD,EAAYD,WAAZ,EAAyBE,eAAzB,EAA0CS,WAA1C,EAAuDF,SAAvD,CAXsB,CAAxB;;EAcA,IAAII,WAAJ,EAAiB;IACf,oBACE,6BAAC,+BAAD,eACMR,KADN;MAEE,OAAO,EAAEZ,OAFX;MAGE,aAAa,EAAEe,KAAK,CAACgB,MAAN,CAAaC,IAAb,CAAkBC,KAHnC;MAIE,OAAO,EAAEV,WAJX;MAKE,WAAW,EAAEM,eALf;MAME,aAAa,EAAER,aAAa,KAAKC,QAAQ,GAAG,CAAH,GAAO,IAApB;IAN9B,GADF;EAUD;;EAED,oBACE,6BAAC,6BAAD,eACMV,KADN;IAEE,OAAO,EAAEZ,OAFX;IAGE,OAAO,EAAEuB,WAHX;IAIE,WAAW,EAAEM,eAJf;IAKE,aAAa,EAAGV,iBAAiB,IAAI,CAAtB,IAA4BE,aAA5B,KAA8CC,QAAQ,GAAG,CAAH,GAAO,GAA7D;EALjB,GADF;AASD,CAlED;;eAoEeX,S"}
|
|
@@ -206,12 +206,10 @@ class CardsList extends _react.default.PureComponent {
|
|
|
206
206
|
}
|
|
207
207
|
|
|
208
208
|
setCardsWrapper(element) {
|
|
209
|
-
var _this$cardsWrapper, _this$cardsWrapper2;
|
|
210
|
-
|
|
211
209
|
this.cardsWrapper = element;
|
|
212
210
|
this.setState({
|
|
213
|
-
scrollLeft:
|
|
214
|
-
offsetWidth:
|
|
211
|
+
scrollLeft: this.cardsWrapper?.scrollLeft,
|
|
212
|
+
offsetWidth: this.cardsWrapper?.offsetWidth
|
|
215
213
|
});
|
|
216
214
|
}
|
|
217
215
|
|
|
@@ -224,9 +222,7 @@ class CardsList extends _react.default.PureComponent {
|
|
|
224
222
|
}
|
|
225
223
|
|
|
226
224
|
handleScroll() {
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
const scrollLeft = (_this$cardsWrapper3 = this.cardsWrapper) == null ? void 0 : _this$cardsWrapper3.scrollLeft;
|
|
225
|
+
const scrollLeft = this.cardsWrapper?.scrollLeft;
|
|
230
226
|
this.setState({
|
|
231
227
|
scrollLeft
|
|
232
228
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["ShowMoreLink","props","onShowMore","showMore","className","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","func","string","IconView","context","contentType","ICONS","chapter","TimerIcon","course","LearnerIcon","dark","IconType","style","icon","computeWidth","card","type","nextPage","page","maxPages","CardsList","React","PureComponent","constructor","state","actualPage","scrollLeft","offsetWidth","possiblePositions","possiblePages","cardsWidth","handleScroll_","handleScroll","bind","handleOnLeft","handleOnRight","scrollTo","updateState","updatePages","setCardsWrapper","getScrollWidth","handleResize","componentDidMount","cardsWrapper","addEventListener","window","componentDidUpdate","cards","newCardsWidth","updatePaginationState","setState","componentWillUnmount","removeEventListener","cancel","wrapperWidth","wrapperScrollLeft","cardWidths","cardPositions","accWidth","cardWidth","acc","pageIndex","accPageWidth","pageWidth","skip","position","element","index","onScroll","leftBound","rightBound","leftIndex","rightIndex","limit","indexOfNextFirstCard","indexOf","nextPosition","render","title","dataName","titleStyle","titleLink","cardsView","key","leftArrowView","circle","left","rightArrowView","right","titleView","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","translate","arrayOf","shape","Card","protoTypes"],"sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"sourcesContent":["import React from 'react';\nimport {\n debounce,\n throttle,\n get,\n getOr,\n map,\n sum,\n last,\n pipe,\n toPairs,\n reduce,\n head,\n findIndex,\n findLastIndex\n} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaSolidContentContentBook1 as LearnerIcon,\n NovaCompositionCoorpacademyTimer as TimerIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../../atom/provider';\nimport Card from '../../card';\nimport style from './style.css';\n\nconst ShowMoreLink = props => {\n const {onShowMore, showMore, className} = props;\n return (\n <div className={className} onClick={onShowMore}>\n {showMore}\n </div>\n );\n};\n\nShowMoreLink.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nShowMoreLink.propTypes = {\n onShowMore: PropTypes.func,\n showMore: PropTypes.string,\n className: PropTypes.string\n};\n\nconst IconView = (props, context) => {\n const {skin} = context;\n const {contentType} = props;\n const ICONS = {\n chapter: TimerIcon,\n course: LearnerIcon\n };\n\n if (!contentType) {\n return null;\n }\n\n const dark = get('common.dark', skin);\n const IconType = ICONS[contentType];\n\n return (\n <div>\n <IconType color={dark} className={style.icon} data-contenttype={contentType} />\n </div>\n );\n};\n\nconst computeWidth = card => {\n switch (card && card.type) {\n case 'chapter':\n return 219;\n default:\n return 272;\n }\n};\n\nconst nextPage = (page, maxPages) => {\n if (page < 0) return maxPages;\n if (page > maxPages) return 0;\n return page;\n};\n\nIconView.propTypes = {\n contentType: PropTypes.string\n};\n\nclass CardsList extends React.PureComponent {\n static propTypes = {\n contentType: PropTypes.string,\n dataName: PropTypes.string,\n title: PropTypes.string,\n showMore: PropTypes.string,\n cards: PropTypes.arrayOf(PropTypes.shape(Card.protoTypes)),\n onScroll: PropTypes.func,\n onShowMore: PropTypes.func\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n actualPage: 0,\n maxPages: 0,\n scrollLeft: 0,\n offsetWidth: 0,\n possiblePositions: [],\n possiblePages: [],\n cardsWidth: 0\n };\n\n this.handleScroll_ = throttle(200, this.handleScroll.bind(this));\n this.handleScroll = this.handleScroll.bind(this);\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n this.updateState = debounce(200, this.updatePages.bind(this));\n this.updatePages = this.updatePages.bind(this);\n this.setCardsWrapper = this.setCardsWrapper.bind(this);\n this.getScrollWidth = this.getScrollWidth.bind(this);\n this.handleResize = this.handleResize.bind(this);\n }\n\n componentDidMount() {\n this.cardsWrapper.addEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.addEventListener('resize', this.handleResize);\n }\n }\n\n componentDidUpdate() {\n const {cards = []} = this.props;\n const {offsetWidth, cardsWidth} = this.state;\n const newCardsWidth = pipe(map(computeWidth), sum)(cards);\n\n if (newCardsWidth !== cardsWidth && offsetWidth !== 0) {\n this.updatePaginationState(cards);\n // eslint-disable-next-line react/no-did-update-set-state\n this.setState({\n cardsWidth: newCardsWidth\n });\n }\n }\n\n componentWillUnmount() {\n this.cardsWrapper.removeEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.removeEventListener('resize', this.handleResize);\n }\n this.updateState.cancel();\n }\n\n handleResize() {\n const {cards = []} = this.props;\n this.updatePaginationState(cards);\n }\n\n updatePaginationState(cards) {\n const {offsetWidth: wrapperWidth, scrollLeft: wrapperScrollLeft} = this.state;\n\n const cardWidths = map(computeWidth)(cards);\n\n const possiblePositions = pipe(\n reduce(\n ([cardPositions, accWidth], cardWidth) => [\n [...cardPositions, accWidth],\n cardWidth + accWidth\n ],\n [[], 0]\n ),\n head\n )(cardWidths);\n\n const possiblePages = pipe(\n reduce(\n ([acc, pageIndex, accPageWidth], cardWidth) => {\n const pageWidth = accPageWidth + cardWidth;\n if (pageWidth > wrapperWidth) {\n return [[...acc, pageIndex + 1], pageIndex + 1, cardWidth];\n }\n return [[...acc, pageIndex], pageIndex, pageWidth];\n },\n [[], 0, 0]\n ),\n head\n )(cardWidths);\n\n const skip = findIndex(position => position >= wrapperScrollLeft, possiblePositions);\n const actualPage = possiblePages[skip + 1];\n\n this.setState({\n possiblePositions,\n possiblePages,\n maxPages: last(possiblePages),\n actualPage\n });\n }\n\n setCardsWrapper(element) {\n this.cardsWrapper = element;\n this.setState({\n scrollLeft: this.cardsWrapper?.scrollLeft,\n offsetWidth: this.cardsWrapper?.offsetWidth\n });\n }\n\n getScrollWidth(index) {\n const {cards = []} = this.props;\n const card = cards[index];\n return computeWidth(card);\n }\n\n handleScroll() {\n const scrollLeft = this.cardsWrapper?.scrollLeft;\n this.setState({scrollLeft});\n\n const {possiblePositions, offsetWidth} = this.state;\n const {onScroll} = this.props;\n if (onScroll) {\n const leftBound = scrollLeft;\n const rightBound = scrollLeft + offsetWidth;\n\n const leftIndex = findIndex(position => position > leftBound, possiblePositions) - 1;\n const rightIndex = findLastIndex(position => position < rightBound, possiblePositions);\n const skip = leftIndex;\n const limit = rightIndex - skip + 1;\n\n onScroll(skip, limit);\n }\n }\n\n handleOnLeft() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage - 1, maxPages));\n }\n\n handleOnRight() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage + 1, maxPages));\n }\n\n scrollTo(page) {\n const {possiblePages, possiblePositions} = this.state;\n const indexOfNextFirstCard = possiblePages.indexOf(page);\n const nextPosition = possiblePositions[indexOfNextFirstCard];\n this.cardsWrapper.scrollLeft = nextPosition;\n this.updatePages(page);\n this.setState({\n scrollLeft: nextPosition\n });\n }\n\n updatePages(actualPage) {\n this.setState({\n actualPage\n });\n }\n\n render() {\n const {title, showMore, cards, onShowMore, dataName, contentType} = this.props;\n const {skin} = this.context;\n const {maxPages} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const titleStyle = onShowMore ? style.titleLink : style.title;\n const cardsView = pipe(\n toPairs,\n map(([key, card]) => {\n return (\n <div className={style.card} key={key}>\n <Card {...card} dataName={`${dataName}-${key}`} />\n </div>\n );\n })\n )(cards);\n const leftArrowView = (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"card-list-left-arrow\">\n <ArrowLeft color={dark} className={style.left} width={10} height={10} />\n </div>\n );\n const rightArrowView = (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n );\n\n const titleView = (\n <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n <IconView contentType={contentType} />\n <span>{title}</span>\n </span>\n );\n\n const hasPages = maxPages > 0;\n const showMoreView =\n hasPages && showMore && onShowMore ? (\n <ShowMoreLink\n className={hasPages ? style.showMoreBar : style.showMore}\n onShowMore={onShowMore}\n showMore={showMore}\n />\n ) : null;\n\n const switchPagesView = hasPages ? (\n <div className={style.pagingWrapper}>\n {showMoreView}\n {leftArrowView}\n {rightArrowView}\n </div>\n ) : null;\n return (\n <div className={style.wrapper} data-name=\"cardsList\">\n <div className={style.list}>\n <div>\n <div data-name=\"header\" className={style.header}>\n {titleView}\n {switchPagesView}\n </div>\n <div className={style.cards} ref={this.setCardsWrapper}>\n {cardsView}\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default CardsList;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["ShowMoreLink","props","onShowMore","showMore","className","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","func","string","IconView","context","contentType","ICONS","chapter","TimerIcon","course","LearnerIcon","dark","IconType","style","icon","computeWidth","card","type","nextPage","page","maxPages","CardsList","React","PureComponent","constructor","state","actualPage","scrollLeft","offsetWidth","possiblePositions","possiblePages","cardsWidth","handleScroll_","handleScroll","bind","handleOnLeft","handleOnRight","scrollTo","updateState","updatePages","setCardsWrapper","getScrollWidth","handleResize","componentDidMount","cardsWrapper","addEventListener","window","componentDidUpdate","cards","newCardsWidth","updatePaginationState","setState","componentWillUnmount","removeEventListener","cancel","wrapperWidth","wrapperScrollLeft","cardWidths","cardPositions","accWidth","cardWidth","acc","pageIndex","accPageWidth","pageWidth","skip","position","element","index","onScroll","leftBound","rightBound","leftIndex","rightIndex","limit","indexOfNextFirstCard","indexOf","nextPosition","render","title","dataName","titleStyle","titleLink","cardsView","key","leftArrowView","circle","left","rightArrowView","right","titleView","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","translate","arrayOf","shape","Card","protoTypes"],"sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"sourcesContent":["import React from 'react';\nimport {\n debounce,\n throttle,\n get,\n getOr,\n map,\n sum,\n last,\n pipe,\n toPairs,\n reduce,\n head,\n findIndex,\n findLastIndex\n} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaSolidContentContentBook1 as LearnerIcon,\n NovaCompositionCoorpacademyTimer as TimerIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../../atom/provider';\nimport Card from '../../card';\nimport style from './style.css';\n\nconst ShowMoreLink = props => {\n const {onShowMore, showMore, className} = props;\n return (\n <div className={className} onClick={onShowMore}>\n {showMore}\n </div>\n );\n};\n\nShowMoreLink.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nShowMoreLink.propTypes = {\n onShowMore: PropTypes.func,\n showMore: PropTypes.string,\n className: PropTypes.string\n};\n\nconst IconView = (props, context) => {\n const {skin} = context;\n const {contentType} = props;\n const ICONS = {\n chapter: TimerIcon,\n course: LearnerIcon\n };\n\n if (!contentType) {\n return null;\n }\n\n const dark = get('common.dark', skin);\n const IconType = ICONS[contentType];\n\n return (\n <div>\n <IconType color={dark} className={style.icon} data-contenttype={contentType} />\n </div>\n );\n};\n\nconst computeWidth = card => {\n switch (card && card.type) {\n case 'chapter':\n return 219;\n default:\n return 272;\n }\n};\n\nconst nextPage = (page, maxPages) => {\n if (page < 0) return maxPages;\n if (page > maxPages) return 0;\n return page;\n};\n\nIconView.propTypes = {\n contentType: PropTypes.string\n};\n\nclass CardsList extends React.PureComponent {\n static propTypes = {\n contentType: PropTypes.string,\n dataName: PropTypes.string,\n title: PropTypes.string,\n showMore: PropTypes.string,\n cards: PropTypes.arrayOf(PropTypes.shape(Card.protoTypes)),\n onScroll: PropTypes.func,\n onShowMore: PropTypes.func\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n actualPage: 0,\n maxPages: 0,\n scrollLeft: 0,\n offsetWidth: 0,\n possiblePositions: [],\n possiblePages: [],\n cardsWidth: 0\n };\n\n this.handleScroll_ = throttle(200, this.handleScroll.bind(this));\n this.handleScroll = this.handleScroll.bind(this);\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n this.updateState = debounce(200, this.updatePages.bind(this));\n this.updatePages = this.updatePages.bind(this);\n this.setCardsWrapper = this.setCardsWrapper.bind(this);\n this.getScrollWidth = this.getScrollWidth.bind(this);\n this.handleResize = this.handleResize.bind(this);\n }\n\n componentDidMount() {\n this.cardsWrapper.addEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.addEventListener('resize', this.handleResize);\n }\n }\n\n componentDidUpdate() {\n const {cards = []} = this.props;\n const {offsetWidth, cardsWidth} = this.state;\n const newCardsWidth = pipe(map(computeWidth), sum)(cards);\n\n if (newCardsWidth !== cardsWidth && offsetWidth !== 0) {\n this.updatePaginationState(cards);\n // eslint-disable-next-line react/no-did-update-set-state\n this.setState({\n cardsWidth: newCardsWidth\n });\n }\n }\n\n componentWillUnmount() {\n this.cardsWrapper.removeEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.removeEventListener('resize', this.handleResize);\n }\n this.updateState.cancel();\n }\n\n handleResize() {\n const {cards = []} = this.props;\n this.updatePaginationState(cards);\n }\n\n updatePaginationState(cards) {\n const {offsetWidth: wrapperWidth, scrollLeft: wrapperScrollLeft} = this.state;\n\n const cardWidths = map(computeWidth)(cards);\n\n const possiblePositions = pipe(\n reduce(\n ([cardPositions, accWidth], cardWidth) => [\n [...cardPositions, accWidth],\n cardWidth + accWidth\n ],\n [[], 0]\n ),\n head\n )(cardWidths);\n\n const possiblePages = pipe(\n reduce(\n ([acc, pageIndex, accPageWidth], cardWidth) => {\n const pageWidth = accPageWidth + cardWidth;\n if (pageWidth > wrapperWidth) {\n return [[...acc, pageIndex + 1], pageIndex + 1, cardWidth];\n }\n return [[...acc, pageIndex], pageIndex, pageWidth];\n },\n [[], 0, 0]\n ),\n head\n )(cardWidths);\n\n const skip = findIndex(position => position >= wrapperScrollLeft, possiblePositions);\n const actualPage = possiblePages[skip + 1];\n\n this.setState({\n possiblePositions,\n possiblePages,\n maxPages: last(possiblePages),\n actualPage\n });\n }\n\n setCardsWrapper(element) {\n this.cardsWrapper = element;\n this.setState({\n scrollLeft: this.cardsWrapper?.scrollLeft,\n offsetWidth: this.cardsWrapper?.offsetWidth\n });\n }\n\n getScrollWidth(index) {\n const {cards = []} = this.props;\n const card = cards[index];\n return computeWidth(card);\n }\n\n handleScroll() {\n const scrollLeft = this.cardsWrapper?.scrollLeft;\n this.setState({scrollLeft});\n\n const {possiblePositions, offsetWidth} = this.state;\n const {onScroll} = this.props;\n if (onScroll) {\n const leftBound = scrollLeft;\n const rightBound = scrollLeft + offsetWidth;\n\n const leftIndex = findIndex(position => position > leftBound, possiblePositions) - 1;\n const rightIndex = findLastIndex(position => position < rightBound, possiblePositions);\n const skip = leftIndex;\n const limit = rightIndex - skip + 1;\n\n onScroll(skip, limit);\n }\n }\n\n handleOnLeft() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage - 1, maxPages));\n }\n\n handleOnRight() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage + 1, maxPages));\n }\n\n scrollTo(page) {\n const {possiblePages, possiblePositions} = this.state;\n const indexOfNextFirstCard = possiblePages.indexOf(page);\n const nextPosition = possiblePositions[indexOfNextFirstCard];\n this.cardsWrapper.scrollLeft = nextPosition;\n this.updatePages(page);\n this.setState({\n scrollLeft: nextPosition\n });\n }\n\n updatePages(actualPage) {\n this.setState({\n actualPage\n });\n }\n\n render() {\n const {title, showMore, cards, onShowMore, dataName, contentType} = this.props;\n const {skin} = this.context;\n const {maxPages} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const titleStyle = onShowMore ? style.titleLink : style.title;\n const cardsView = pipe(\n toPairs,\n map(([key, card]) => {\n return (\n <div className={style.card} key={key}>\n <Card {...card} dataName={`${dataName}-${key}`} />\n </div>\n );\n })\n )(cards);\n const leftArrowView = (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"card-list-left-arrow\">\n <ArrowLeft color={dark} className={style.left} width={10} height={10} />\n </div>\n );\n const rightArrowView = (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n );\n\n const titleView = (\n <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n <IconView contentType={contentType} />\n <span>{title}</span>\n </span>\n );\n\n const hasPages = maxPages > 0;\n const showMoreView =\n hasPages && showMore && onShowMore ? (\n <ShowMoreLink\n className={hasPages ? style.showMoreBar : style.showMore}\n onShowMore={onShowMore}\n showMore={showMore}\n />\n ) : null;\n\n const switchPagesView = hasPages ? (\n <div className={style.pagingWrapper}>\n {showMoreView}\n {leftArrowView}\n {rightArrowView}\n </div>\n ) : null;\n return (\n <div className={style.wrapper} data-name=\"cardsList\">\n <div className={style.list}>\n <div>\n <div data-name=\"header\" className={style.header}>\n {titleView}\n {switchPagesView}\n </div>\n <div className={style.cards} ref={this.setCardsWrapper}>\n {cardsView}\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default CardsList;\n"],"mappings":"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"}
|
|
@@ -19,36 +19,32 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
19
19
|
|
|
20
20
|
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
21
|
|
|
22
|
-
const createStyleSheet = (brandTheme, theme) => {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
width: '100%'
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
};
|
|
22
|
+
const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
|
|
23
|
+
// eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread
|
|
24
|
+
input: _extends({
|
|
25
|
+
padding: theme.spacing.tiny,
|
|
26
|
+
borderColor: theme.colors.gray.lightMedium,
|
|
27
|
+
borderRadius: theme.radius.regular,
|
|
28
|
+
minWidth: 175,
|
|
29
|
+
marginHorizontal: 12,
|
|
30
|
+
paddingVertical: 16
|
|
31
|
+
}, _shadow.BOX_STYLE, {
|
|
32
|
+
backgroundColor: theme.colors.white
|
|
33
|
+
}),
|
|
34
|
+
text: {
|
|
35
|
+
borderColor: brandTheme?.colors?.primary,
|
|
36
|
+
color: brandTheme?.colors?.primary || theme.colors.gray.medium,
|
|
37
|
+
fontWeight: theme.fontWeight.bold,
|
|
38
|
+
fontSize: theme.fontSize.regular,
|
|
39
|
+
textAlign: 'center'
|
|
40
|
+
},
|
|
41
|
+
spaced: {
|
|
42
|
+
paddingVertical: theme.spacing.tiny
|
|
43
|
+
},
|
|
44
|
+
fullWitdh: {
|
|
45
|
+
width: '100%'
|
|
46
|
+
}
|
|
47
|
+
});
|
|
52
48
|
|
|
53
49
|
const logEvent = (eventName, analytics, questionType) => {
|
|
54
50
|
analytics && analytics.logEvent(eventName, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","BOX_STYLE","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","useCallback","ANALYTICS_EVENT_TYPE","INPUT_FOCUS","handleBlur","INPUT_BLUR","useEffect","_stylesheet","typeHere"],"sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"sourcesContent":["import {View, StyleSheet, TextInput, ViewStyle} from 'react-native';\nimport React, {useState, useEffect, useCallback} from 'react';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../../variables/analytics';\nimport {Theme} from '../../../variables/theme.native';\nimport {BOX_STYLE} from '../../../variables/shadow';\nimport {Brand} from '../../../variables/brand.native';\n\ntype QuestionType = 'basic' | 'template';\n\ninterface Props {\n fullWidth?: boolean;\n testID: string;\n questionType: QuestionType;\n analytics?: Analytics;\n onChange: (text: string) => void;\n isDisabled?: boolean;\n value?: string; // when value is undefined, TextInput acts as not controlled\n}\n\ntype StyleSheetType = {\n input: ViewStyle;\n text: ViewStyle;\n spaced: ViewStyle;\n fullWitdh: ViewStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme): StyleSheetType =>\n StyleSheet.create({\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n input: {\n padding: theme.spacing.tiny,\n borderColor: theme.colors.gray.lightMedium,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n text: {\n borderColor: brandTheme?.colors?.primary,\n color: brandTheme?.colors?.primary || theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n fullWitdh: {\n width: '100%'\n }\n });\n\nconst logEvent = (eventName: string, analytics: Analytics, questionType: QuestionType) => {\n analytics &&\n analytics.logEvent(eventName, {\n id: `question-input-text`,\n questionType\n });\n};\n\nconst FreeText = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme, translations} = templateContext;\n const PLACEHOLDER_COLOR = theme.colors.gray.medium;\n\n // ------------------------------------\n\n const {\n analytics,\n questionType,\n fullWidth = false,\n testID,\n onChange,\n isDisabled = false,\n value\n } = props;\n\n // ------------------------------------\n\n const handleFocus = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType),\n [analytics, questionType]\n );\n\n const handleBlur = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType),\n [analytics, questionType]\n );\n\n // ------------------------------------\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [brandTheme, theme]);\n\n // ------------------------------------\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.spaced, fullWidth && styleSheet.fullWitdh]}>\n <TextInput\n style={[styleSheet.input, styleSheet.text]}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChangeText={onChange}\n placeholder={translations.typeHere}\n placeholderTextColor={PLACEHOLDER_COLOR}\n value={value}\n testID={testID}\n editable={!isDisabled}\n selectTextOnFocus={!isDisabled}\n />\n </View>\n );\n};\n\nexport default FreeText;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;AAsBA,MAAMA,gBAAgB,GAAG,CAACC,UAAD,EAAoBC,KAApB
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","BOX_STYLE","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","useCallback","ANALYTICS_EVENT_TYPE","INPUT_FOCUS","handleBlur","INPUT_BLUR","useEffect","_stylesheet","typeHere"],"sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"sourcesContent":["import {View, StyleSheet, TextInput, ViewStyle} from 'react-native';\nimport React, {useState, useEffect, useCallback} from 'react';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../../variables/analytics';\nimport {Theme} from '../../../variables/theme.native';\nimport {BOX_STYLE} from '../../../variables/shadow';\nimport {Brand} from '../../../variables/brand.native';\n\ntype QuestionType = 'basic' | 'template';\n\ninterface Props {\n fullWidth?: boolean;\n testID: string;\n questionType: QuestionType;\n analytics?: Analytics;\n onChange: (text: string) => void;\n isDisabled?: boolean;\n value?: string; // when value is undefined, TextInput acts as not controlled\n}\n\ntype StyleSheetType = {\n input: ViewStyle;\n text: ViewStyle;\n spaced: ViewStyle;\n fullWitdh: ViewStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme): StyleSheetType =>\n StyleSheet.create({\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n input: {\n padding: theme.spacing.tiny,\n borderColor: theme.colors.gray.lightMedium,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n text: {\n borderColor: brandTheme?.colors?.primary,\n color: brandTheme?.colors?.primary || theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n fullWitdh: {\n width: '100%'\n }\n });\n\nconst logEvent = (eventName: string, analytics: Analytics, questionType: QuestionType) => {\n analytics &&\n analytics.logEvent(eventName, {\n id: `question-input-text`,\n questionType\n });\n};\n\nconst FreeText = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme, translations} = templateContext;\n const PLACEHOLDER_COLOR = theme.colors.gray.medium;\n\n // ------------------------------------\n\n const {\n analytics,\n questionType,\n fullWidth = false,\n testID,\n onChange,\n isDisabled = false,\n value\n } = props;\n\n // ------------------------------------\n\n const handleFocus = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType),\n [analytics, questionType]\n );\n\n const handleBlur = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType),\n [analytics, questionType]\n );\n\n // ------------------------------------\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [brandTheme, theme]);\n\n // ------------------------------------\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.spaced, fullWidth && styleSheet.fullWitdh]}>\n <TextInput\n style={[styleSheet.input, styleSheet.text]}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChangeText={onChange}\n placeholder={translations.typeHere}\n placeholderTextColor={PLACEHOLDER_COLOR}\n value={value}\n testID={testID}\n editable={!isDisabled}\n selectTextOnFocus={!isDisabled}\n />\n </View>\n );\n};\n\nexport default FreeText;\n"],"mappings":"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"}
|
|
@@ -67,8 +67,6 @@ const createStyleSheet = theme => _reactNative.StyleSheet.create({
|
|
|
67
67
|
});
|
|
68
68
|
|
|
69
69
|
const QuestionSlider = props => {
|
|
70
|
-
var _brandTheme$colors, _brandTheme$colors2, _brandTheme$colors3;
|
|
71
|
-
|
|
72
70
|
const {
|
|
73
71
|
step,
|
|
74
72
|
style,
|
|
@@ -104,7 +102,7 @@ const QuestionSlider = props => {
|
|
|
104
102
|
testID: testID
|
|
105
103
|
}, /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
106
104
|
style: [styleSheet.header, {
|
|
107
|
-
color: brandTheme
|
|
105
|
+
color: brandTheme?.colors?.primary
|
|
108
106
|
}],
|
|
109
107
|
testID: "slider-value"
|
|
110
108
|
}, value), /*#__PURE__*/_react.default.createElement(_reactNativeSlider.default, {
|
|
@@ -114,10 +112,10 @@ const QuestionSlider = props => {
|
|
|
114
112
|
maximumValue: max,
|
|
115
113
|
minimumValue: min,
|
|
116
114
|
onSlidingComplete: handleSlidingComplete,
|
|
117
|
-
minimumTrackTintColor: brandTheme
|
|
115
|
+
minimumTrackTintColor: brandTheme?.colors?.primary,
|
|
118
116
|
trackStyle: styleSheet.track,
|
|
119
117
|
thumbStyle: [styleSheet.thumb, {
|
|
120
|
-
borderColor: brandTheme
|
|
118
|
+
borderColor: brandTheme?.colors?.primary
|
|
121
119
|
}],
|
|
122
120
|
testID: "slider"
|
|
123
121
|
}), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","container","flex","paddingHorizontal","flexDirection","justifyContent","header","fontSize","fontWeight","bold","textAlign","textValue","color","colors","black","valuesContainer","leftValue","alignItems","rightValue","track","height","borderRadius","radius","button","thumb","BOX_STYLE","width","backgroundColor","borderWidth","QuestionSlider","props","step","style","min","max","unit","value","storeValue","onSlidingComplete","testID","templateContext","useTemplateContext","brandTheme","styleSheet","setStylesheet","useState","setValue","handleSlidingComplete","useCallback","useEffect","_stylesheet","primary","borderColor"],"sources":["../../../../../src/molecule/questions/mobile/slider/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, useCallback} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\nimport Slider from '@coorpacademy/react-native-slider';\n\nimport {Theme} from '../../../../variables/theme.native';\nimport Text from '../../../../atom/text/index.native';\nimport {useTemplateContext} from '../../../../template/app-review/template-context';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\nexport type OnSlidingCompleteFunction = (value: number) => void;\n\nexport type Props = {\n min: number;\n max: number;\n value?: number;\n unit?: string;\n onSlidingComplete: OnSlidingCompleteFunction;\n style?: ViewStyle;\n step?: number;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n header: TextStyle;\n textValue: TextStyle;\n valuesContainer: ViewStyle;\n leftValue: ViewStyle;\n rightValue: ViewStyle;\n track: ViewStyle;\n thumb: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n container: {\n flex: 1,\n paddingHorizontal: 20,\n flexDirection: 'column',\n justifyContent: 'center'\n },\n header: {\n fontSize: 25,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n textValue: {\n fontSize: 15,\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n valuesContainer: {\n flexDirection: 'row',\n justifyContent: 'space-around'\n },\n leftValue: {\n flex: 1,\n alignItems: 'flex-start'\n },\n rightValue: {\n flex: 1,\n alignItems: 'flex-end'\n },\n track: {\n height: 10,\n borderRadius: theme.radius.button\n },\n thumb: {\n ...BOX_STYLE,\n width: 30,\n height: 30,\n borderRadius: 30 / 2,\n backgroundColor: 'white',\n borderWidth: 1\n }\n });\n\nconst QuestionSlider = (props: Props) => {\n const {\n step,\n style,\n min,\n max,\n unit = '',\n value: storeValue = 0,\n onSlidingComplete,\n testID\n } = props;\n const templateContext = useTemplateContext();\n const {brandTheme, theme} = templateContext;\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const [value, setValue] = useState<number>(storeValue);\n\n const handleSlidingComplete = useCallback(() => {\n onSlidingComplete(value);\n }, [onSlidingComplete, value]);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.container, style]} testID={testID}>\n <Text style={[styleSheet.header, {color: brandTheme?.colors?.primary}]} testID=\"slider-value\">\n {value}\n </Text>\n <Slider\n step={step || 1}\n value={value}\n onValueChange={setValue}\n maximumValue={max}\n minimumValue={min}\n onSlidingComplete={handleSlidingComplete}\n minimumTrackTintColor={brandTheme?.colors?.primary}\n trackStyle={styleSheet.track}\n thumbStyle={[styleSheet.thumb, {borderColor: brandTheme?.colors?.primary}]}\n testID=\"slider\"\n />\n <View style={styleSheet.valuesContainer} testID=\"slider-values-container\">\n <View style={styleSheet.leftValue}>\n <Text style={styleSheet.textValue} testID=\"slider-min-value\">\n {`${min} ${unit}`}\n </Text>\n </View>\n <View style={styleSheet.rightValue}>\n <Text style={styleSheet.textValue} testID=\"slider-max-value\">\n {`${max} ${unit}`}\n </Text>\n </View>\n </View>\n </View>\n );\n};\n\nexport default QuestionSlider;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AAGA;;AACA;;AACA;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,IAAI,EAAE,CADG;IAETC,iBAAiB,EAAE,EAFV;IAGTC,aAAa,EAAE,QAHN;IAITC,cAAc,EAAE;EAJP,CADK;EAOhBC,MAAM,EAAE;IACNC,QAAQ,EAAE,EADJ;IAENC,UAAU,EAAEV,KAAK,CAACU,UAAN,CAAiBC,IAFvB;IAGNC,SAAS,EAAE;EAHL,CAPQ;EAYhBC,SAAS,EAAE;IACTJ,QAAQ,EAAE,EADD;IAETK,KAAK,EAAEd,KAAK,CAACe,MAAN,CAAaC,KAFX;IAGTN,UAAU,EAAEV,KAAK,CAACU,UAAN,CAAiBC,IAHpB;IAITC,SAAS,EAAE;EAJF,CAZK;EAkBhBK,eAAe,EAAE;IACfX,aAAa,EAAE,KADA;IAEfC,cAAc,EAAE;EAFD,CAlBD;EAsBhBW,SAAS,EAAE;IACTd,IAAI,EAAE,CADG;IAETe,UAAU,EAAE;EAFH,CAtBK;EA0BhBC,UAAU,EAAE;IACVhB,IAAI,EAAE,CADI;IAEVe,UAAU,EAAE;EAFF,CA1BI;EA8BhBE,KAAK,EAAE;IACLC,MAAM,EAAE,EADH;IAELC,YAAY,EAAEvB,KAAK,CAACwB,MAAN,CAAaC;EAFtB,CA9BS;EAkChBC,KAAK,eACAC,iBADA;IAEHC,KAAK,EAAE,EAFJ;IAGHN,MAAM,EAAE,EAHL;IAIHC,YAAY,EAAE,KAAK,CAJhB;IAKHM,eAAe,EAAE,OALd;IAMHC,WAAW,EAAE;EANV;AAlCW,CAAlB,CADF;;AA6CA,MAAMC,cAAc,GAAIC,KAAD,IAAkB;
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","container","flex","paddingHorizontal","flexDirection","justifyContent","header","fontSize","fontWeight","bold","textAlign","textValue","color","colors","black","valuesContainer","leftValue","alignItems","rightValue","track","height","borderRadius","radius","button","thumb","BOX_STYLE","width","backgroundColor","borderWidth","QuestionSlider","props","step","style","min","max","unit","value","storeValue","onSlidingComplete","testID","templateContext","useTemplateContext","brandTheme","styleSheet","setStylesheet","useState","setValue","handleSlidingComplete","useCallback","useEffect","_stylesheet","primary","borderColor"],"sources":["../../../../../src/molecule/questions/mobile/slider/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, useCallback} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\nimport Slider from '@coorpacademy/react-native-slider';\n\nimport {Theme} from '../../../../variables/theme.native';\nimport Text from '../../../../atom/text/index.native';\nimport {useTemplateContext} from '../../../../template/app-review/template-context';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\nexport type OnSlidingCompleteFunction = (value: number) => void;\n\nexport type Props = {\n min: number;\n max: number;\n value?: number;\n unit?: string;\n onSlidingComplete: OnSlidingCompleteFunction;\n style?: ViewStyle;\n step?: number;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n header: TextStyle;\n textValue: TextStyle;\n valuesContainer: ViewStyle;\n leftValue: ViewStyle;\n rightValue: ViewStyle;\n track: ViewStyle;\n thumb: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n container: {\n flex: 1,\n paddingHorizontal: 20,\n flexDirection: 'column',\n justifyContent: 'center'\n },\n header: {\n fontSize: 25,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n textValue: {\n fontSize: 15,\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n valuesContainer: {\n flexDirection: 'row',\n justifyContent: 'space-around'\n },\n leftValue: {\n flex: 1,\n alignItems: 'flex-start'\n },\n rightValue: {\n flex: 1,\n alignItems: 'flex-end'\n },\n track: {\n height: 10,\n borderRadius: theme.radius.button\n },\n thumb: {\n ...BOX_STYLE,\n width: 30,\n height: 30,\n borderRadius: 30 / 2,\n backgroundColor: 'white',\n borderWidth: 1\n }\n });\n\nconst QuestionSlider = (props: Props) => {\n const {\n step,\n style,\n min,\n max,\n unit = '',\n value: storeValue = 0,\n onSlidingComplete,\n testID\n } = props;\n const templateContext = useTemplateContext();\n const {brandTheme, theme} = templateContext;\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const [value, setValue] = useState<number>(storeValue);\n\n const handleSlidingComplete = useCallback(() => {\n onSlidingComplete(value);\n }, [onSlidingComplete, value]);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.container, style]} testID={testID}>\n <Text style={[styleSheet.header, {color: brandTheme?.colors?.primary}]} testID=\"slider-value\">\n {value}\n </Text>\n <Slider\n step={step || 1}\n value={value}\n onValueChange={setValue}\n maximumValue={max}\n minimumValue={min}\n onSlidingComplete={handleSlidingComplete}\n minimumTrackTintColor={brandTheme?.colors?.primary}\n trackStyle={styleSheet.track}\n thumbStyle={[styleSheet.thumb, {borderColor: brandTheme?.colors?.primary}]}\n testID=\"slider\"\n />\n <View style={styleSheet.valuesContainer} testID=\"slider-values-container\">\n <View style={styleSheet.leftValue}>\n <Text style={styleSheet.textValue} testID=\"slider-min-value\">\n {`${min} ${unit}`}\n </Text>\n </View>\n <View style={styleSheet.rightValue}>\n <Text style={styleSheet.textValue} testID=\"slider-max-value\">\n {`${max} ${unit}`}\n </Text>\n </View>\n </View>\n </View>\n );\n};\n\nexport default QuestionSlider;\n"],"mappings":"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"}
|
|
@@ -66,8 +66,6 @@ const createStyleSheet = theme => ({
|
|
|
66
66
|
});
|
|
67
67
|
|
|
68
68
|
const Item = props => {
|
|
69
|
-
var _brandTheme$colors;
|
|
70
|
-
|
|
71
69
|
const {
|
|
72
70
|
part,
|
|
73
71
|
index,
|
|
@@ -89,7 +87,7 @@ const Item = props => {
|
|
|
89
87
|
const id = `question-part-${index + 1}`;
|
|
90
88
|
const isFocused = focusedSelectId === id;
|
|
91
89
|
const coloredText = brandTheme && {
|
|
92
|
-
color:
|
|
90
|
+
color: brandTheme.colors?.primary
|
|
93
91
|
};
|
|
94
92
|
|
|
95
93
|
if (part.type === 'answerField' && inputNames.includes(part.value)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","BOX_STYLE","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","useTemplateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","trim","QuestionTemplate","template","styleSheet","setStylesheet","useState","useEffect","_stylesheet","parts","parseTemplateString"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n FocusedSelectId,\n HandleBlur,\n HandleFocus,\n useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n container: ViewStyle;\n spaced: ViewStyle;\n htmlText: TextStyle;\n selectInput: ViewStyle;\n selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n container: {\n width: '100%',\n flexDirection: 'row',\n flexWrap: 'wrap',\n justifyContent: 'center',\n alignItems: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n htmlText: {\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n lineHeight: 25\n },\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n selectInput: {\n padding: theme.spacing.tiny,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n selectText: {\n color: theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n }\n});\n\ntype TemplatePart = {\n type: 'string' | 'answerField';\n value: string;\n};\n\ntype ItemProps = {\n part: TemplatePart;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n index: number;\n isDisabled?: boolean;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n const {\n part,\n index,\n isDisabled = false,\n focusedSelectId,\n choices,\n onInputChange,\n handleBlur,\n handleFocus,\n styles\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme, brandTheme, translations} = templateContext;\n\n const inputNames = choices.map(choice => choice.name);\n const id = `question-part-${index + 1}`;\n const isFocused = focusedSelectId === id;\n\n const coloredText = brandTheme && {\n color: brandTheme.colors?.primary\n };\n\n if (part.type === 'answerField' && inputNames.includes(part.value)) {\n const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n const choice = choices[choiceIndex];\n const {value} = choice;\n\n if (!choice || !choice.type || !choice.name) {\n return null;\n }\n\n const disabledSuffix = isDisabled ? '-disabled' : '';\n const selectedSuffix = value ? '-selected' : '';\n\n const handleInputChange =\n (_item: TemplateTextChoice | TemplateListOfChoices) => (_value: string) =>\n onInputChange(_item, _value);\n\n if (choice.type === 'text') {\n return (\n <View style={styles.spaced} testID={id}>\n <FreeText\n key={id}\n isDisabled={isDisabled}\n onChange={handleInputChange(choice)}\n value={value}\n testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n questionType=\"template\"\n />\n </View>\n );\n }\n\n const selectInputStyle: TextStyle[] = [styles.selectInput];\n if (coloredText && value) {\n selectInputStyle.push(coloredText);\n }\n\n const selectTextStyle: TextStyle[] = [styles.selectText];\n if (coloredText && value) {\n selectTextStyle.push(coloredText);\n }\n\n if (choice.type === 'select') {\n return (\n <View style={styles.spaced} testID={id}>\n <Select\n isDisabled={isDisabled}\n questionType=\"template\"\n values={choice.items}\n value={value}\n placeholder={translations.selectAnAnswer}\n isFocused={isFocused}\n onBlur={handleBlur}\n onFocus={handleFocus(id)}\n onChange={handleInputChange(choice)}\n textStyle={selectTextStyle}\n style={selectInputStyle}\n analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n />\n </View>\n );\n }\n }\n\n return (\n <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n {trim(part.value || '')}\n </Html>\n );\n};\n\nexport type Props = {\n isDisabled?: boolean;\n template: string;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n const {\n template,\n onInputChange,\n choices,\n handleBlur,\n handleFocus,\n focusedSelectId,\n isDisabled = false\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme} = templateContext;\n\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!template || !styleSheet) {\n return null;\n }\n\n const parts: TemplatePart[] = parseTemplateString(template);\n\n return (\n <View style={styleSheet.container} testID=\"question-template\">\n {parts.map((part, id) => (\n <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n <Item\n part={part}\n choices={choices}\n index={id}\n focusedSelectId={focusedSelectId}\n isDisabled={isDisabled}\n handleBlur={handleBlur}\n handleFocus={handleFocus}\n onInputChange={onInputChange}\n styles={styleSheet}\n />\n <Space type=\"micro\" />\n </View>\n ))}\n </View>\n );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","BOX_STYLE","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","useTemplateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","trim","QuestionTemplate","template","styleSheet","setStylesheet","useState","useEffect","_stylesheet","parts","parseTemplateString"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n FocusedSelectId,\n HandleBlur,\n HandleFocus,\n useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n container: ViewStyle;\n spaced: ViewStyle;\n htmlText: TextStyle;\n selectInput: ViewStyle;\n selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n container: {\n width: '100%',\n flexDirection: 'row',\n flexWrap: 'wrap',\n justifyContent: 'center',\n alignItems: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n htmlText: {\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n lineHeight: 25\n },\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n selectInput: {\n padding: theme.spacing.tiny,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n selectText: {\n color: theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n }\n});\n\ntype TemplatePart = {\n type: 'string' | 'answerField';\n value: string;\n};\n\ntype ItemProps = {\n part: TemplatePart;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n index: number;\n isDisabled?: boolean;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n const {\n part,\n index,\n isDisabled = false,\n focusedSelectId,\n choices,\n onInputChange,\n handleBlur,\n handleFocus,\n styles\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme, brandTheme, translations} = templateContext;\n\n const inputNames = choices.map(choice => choice.name);\n const id = `question-part-${index + 1}`;\n const isFocused = focusedSelectId === id;\n\n const coloredText = brandTheme && {\n color: brandTheme.colors?.primary\n };\n\n if (part.type === 'answerField' && inputNames.includes(part.value)) {\n const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n const choice = choices[choiceIndex];\n const {value} = choice;\n\n if (!choice || !choice.type || !choice.name) {\n return null;\n }\n\n const disabledSuffix = isDisabled ? '-disabled' : '';\n const selectedSuffix = value ? '-selected' : '';\n\n const handleInputChange =\n (_item: TemplateTextChoice | TemplateListOfChoices) => (_value: string) =>\n onInputChange(_item, _value);\n\n if (choice.type === 'text') {\n return (\n <View style={styles.spaced} testID={id}>\n <FreeText\n key={id}\n isDisabled={isDisabled}\n onChange={handleInputChange(choice)}\n value={value}\n testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n questionType=\"template\"\n />\n </View>\n );\n }\n\n const selectInputStyle: TextStyle[] = [styles.selectInput];\n if (coloredText && value) {\n selectInputStyle.push(coloredText);\n }\n\n const selectTextStyle: TextStyle[] = [styles.selectText];\n if (coloredText && value) {\n selectTextStyle.push(coloredText);\n }\n\n if (choice.type === 'select') {\n return (\n <View style={styles.spaced} testID={id}>\n <Select\n isDisabled={isDisabled}\n questionType=\"template\"\n values={choice.items}\n value={value}\n placeholder={translations.selectAnAnswer}\n isFocused={isFocused}\n onBlur={handleBlur}\n onFocus={handleFocus(id)}\n onChange={handleInputChange(choice)}\n textStyle={selectTextStyle}\n style={selectInputStyle}\n analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n />\n </View>\n );\n }\n }\n\n return (\n <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n {trim(part.value || '')}\n </Html>\n );\n};\n\nexport type Props = {\n isDisabled?: boolean;\n template: string;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n const {\n template,\n onInputChange,\n choices,\n handleBlur,\n handleFocus,\n focusedSelectId,\n isDisabled = false\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme} = templateContext;\n\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!template || !styleSheet) {\n return null;\n }\n\n const parts: TemplatePart[] = parseTemplateString(template);\n\n return (\n <View style={styleSheet.container} testID=\"question-template\">\n {parts.map((part, id) => (\n <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n <Item\n part={part}\n choices={choices}\n index={id}\n focusedSelectId={focusedSelectId}\n isDisabled={isDisabled}\n handleBlur={handleBlur}\n handleFocus={handleFocus}\n onInputChange={onInputChange}\n styles={styleSheet}\n />\n <Space type=\"micro\" />\n </View>\n ))}\n </View>\n );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}
|
|
@@ -144,8 +144,8 @@ declare class MoocHeader extends React.Component<any, any, any> {
|
|
|
144
144
|
handleResetSearch(): void;
|
|
145
145
|
handleOnFocus(): void;
|
|
146
146
|
handleOnBlur(): void;
|
|
147
|
-
handleOnMenuOpen(): void;
|
|
148
|
-
handleOnMenuClose(): void;
|
|
147
|
+
handleOnMenuOpen(e: any): void;
|
|
148
|
+
handleOnMenuClose(e: any): void;
|
|
149
149
|
componentDidUpdate(prevProps: any, prevState: any, prevContext: any): void;
|
|
150
150
|
menuSettings: any;
|
|
151
151
|
render(): JSX.Element | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAwBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAyFE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAmBC;IAjBC;;;;MAIC;IA6CH,6BAIC;IAED,yBAGC;IAxBD,qCAQC;IAED,wBAGC;IAjBD,+BAEC;IA4BD,2BAKC;IAED,0BAKC;IAED,sBAIC;IAED,qBAIC;IAED
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAwBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAyFE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAmBC;IAjBC;;;;MAIC;IA6CH,6BAIC;IAED,yBAGC;IAxBD,qCAQC;IAED,wBAGC;IAjBD,+BAEC;IA4BD,2BAKC;IAED,0BAKC;IAED,sBAIC;IAED,qBAIC;IAED,+BAUC;IAED,gCAUC;IAzFD,2EASC;IAGC,kBAAsB;IA+ExB,6BAmZC;CACF"}
|
|
@@ -144,7 +144,9 @@ class MoocHeader extends _react.default.Component {
|
|
|
144
144
|
}));
|
|
145
145
|
}
|
|
146
146
|
|
|
147
|
-
handleOnMenuOpen() {
|
|
147
|
+
handleOnMenuOpen(e) {
|
|
148
|
+
e.stopPropagation();
|
|
149
|
+
e.preventDefault();
|
|
148
150
|
const {
|
|
149
151
|
onMenuOpen
|
|
150
152
|
} = this.props;
|
|
@@ -158,7 +160,9 @@ class MoocHeader extends _react.default.Component {
|
|
|
158
160
|
}));
|
|
159
161
|
}
|
|
160
162
|
|
|
161
|
-
handleOnMenuClose() {
|
|
163
|
+
handleOnMenuClose(e) {
|
|
164
|
+
e.stopPropagation();
|
|
165
|
+
e.preventDefault();
|
|
162
166
|
const {
|
|
163
167
|
onMenuClose
|
|
164
168
|
} = this.props;
|