@coorpacademy/components 10.22.4 → 10.22.7
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/README.md +11 -5
- package/es/atom/choice/index.native.js +132 -0
- package/es/atom/choice/index.native.js.map +1 -0
- package/es/atom/gradient/index.native.js +46 -0
- package/es/atom/gradient/index.native.js.map +1 -0
- package/es/atom/html/index.native.js +9 -16
- package/es/atom/html/index.native.js.map +1 -1
- package/es/atom/image-background/index.native.js +90 -0
- package/es/atom/image-background/index.native.js.map +1 -0
- package/es/atom/input-switch/index.js +43 -6
- package/es/atom/input-switch/index.js.map +1 -1
- package/es/atom/input-switch/style.css +56 -6
- package/es/atom/select-modal/index.native.js +6 -6
- package/es/atom/select-modal/index.native.js.map +1 -1
- package/es/atom/text/index.native.js +3 -1
- package/es/atom/text/index.native.js.map +1 -1
- package/es/hoc/modal/select/index.native.js +4 -3
- package/es/hoc/modal/select/index.native.js.map +1 -1
- package/es/molecule/answer/index.js +39 -32
- package/es/molecule/answer/index.js.map +1 -1
- package/es/molecule/cm-popin/index.js +101 -14
- package/es/molecule/cm-popin/index.js.map +1 -1
- package/es/molecule/cm-popin/style.css +153 -9
- package/es/molecule/questions/free-text/index.native.js +8 -8
- package/es/molecule/questions/free-text/index.native.js.map +1 -1
- package/es/molecule/questions/mobile/template/index.native.js +222 -0
- package/es/molecule/questions/mobile/template/index.native.js.map +1 -0
- package/es/template/app-review/template-context.js +1 -0
- package/es/template/app-review/template-context.js.map +1 -1
- package/es/template/common/dashboard/index.js +6 -3
- package/es/template/common/dashboard/index.js.map +1 -1
- package/es/types/app-review.d.js +2 -0
- package/es/types/app-review.d.js.map +1 -0
- package/es/types/translations.js +2 -0
- package/es/types/translations.js.map +1 -0
- package/es/util/build-query-string.js +9 -0
- package/es/util/build-query-string.js.map +1 -0
- package/es/util/get-clean-uri.js +4 -0
- package/es/util/get-clean-uri.js.map +1 -0
- package/es/util/get-resized-image.js +39 -0
- package/es/util/get-resized-image.js.map +1 -0
- package/es/util/parse-template-string.js +4 -2
- package/es/util/parse-template-string.js.map +1 -1
- package/es/variables/colors.css +1 -0
- package/es/variables/theme.native.js.map +1 -1
- package/lib/atom/choice/index.native.js +150 -0
- package/lib/atom/choice/index.native.js.map +1 -0
- package/lib/atom/gradient/index.native.js +56 -0
- package/lib/atom/gradient/index.native.js.map +1 -0
- package/lib/atom/html/index.native.js +8 -15
- package/lib/atom/html/index.native.js.map +1 -1
- package/lib/atom/image-background/index.native.js +105 -0
- package/lib/atom/image-background/index.native.js.map +1 -0
- package/lib/atom/input-switch/index.js +43 -6
- package/lib/atom/input-switch/index.js.map +1 -1
- package/lib/atom/input-switch/style.css +56 -6
- package/lib/atom/select-modal/index.native.js +5 -5
- package/lib/atom/select-modal/index.native.js.map +1 -1
- package/lib/atom/text/index.native.js +3 -1
- package/lib/atom/text/index.native.js.map +1 -1
- package/lib/hoc/modal/select/index.native.js +7 -5
- package/lib/hoc/modal/select/index.native.js.map +1 -1
- package/lib/molecule/answer/index.js +39 -32
- package/lib/molecule/answer/index.js.map +1 -1
- package/lib/molecule/cm-popin/index.js +102 -13
- package/lib/molecule/cm-popin/index.js.map +1 -1
- package/lib/molecule/cm-popin/style.css +153 -9
- package/lib/molecule/questions/free-text/index.native.js +7 -7
- package/lib/molecule/questions/free-text/index.native.js.map +1 -1
- package/lib/molecule/questions/mobile/template/index.native.js +243 -0
- package/lib/molecule/questions/mobile/template/index.native.js.map +1 -0
- package/lib/template/app-review/template-context.js +1 -0
- package/lib/template/app-review/template-context.js.map +1 -1
- package/lib/template/common/dashboard/index.js +7 -3
- package/lib/template/common/dashboard/index.js.map +1 -1
- package/lib/types/app-review.d.js +2 -0
- package/lib/types/app-review.d.js.map +1 -0
- package/lib/types/translations.js +2 -0
- package/lib/types/translations.js.map +1 -0
- package/lib/util/build-query-string.js +17 -0
- package/lib/util/build-query-string.js.map +1 -0
- package/lib/util/get-clean-uri.js +10 -0
- package/lib/util/get-clean-uri.js.map +1 -0
- package/lib/util/get-resized-image.js +49 -0
- package/lib/util/get-resized-image.js.map +1 -0
- package/lib/util/parse-template-string.js +4 -2
- package/lib/util/parse-template-string.js.map +1 -1
- package/lib/variables/colors.css +1 -0
- package/lib/variables/theme.native.js.map +1 -1
- package/package.json +5 -3
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import _keys from "lodash/fp/keys";
|
|
2
|
+
|
|
3
|
+
const buildUrlQueryParams = params => _keys(params).map(key => {
|
|
4
|
+
const value = params[key].toString();
|
|
5
|
+
return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
|
|
6
|
+
}).join('&');
|
|
7
|
+
|
|
8
|
+
export default buildUrlQueryParams;
|
|
9
|
+
//# sourceMappingURL=build-query-string.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/util/build-query-string.ts"],"names":["buildUrlQueryParams","params","map","key","value","toString","encodeURIComponent","join"],"mappings":";;AAMA,MAAMA,mBAAmB,GAAIC,MAAD,IAC1B,MAAKA,MAAL,EACGC,GADH,CACOC,GAAG,IAAI;AACV,QAAMC,KAAK,GAAGH,MAAM,CAACE,GAAD,CAAN,CAAYE,QAAZ,EAAd;AACA,SAAQ,GAAEC,kBAAkB,CAACH,GAAD,CAAM,IAAGG,kBAAkB,CAACF,KAAD,CAAQ,EAA/D;AACD,CAJH,EAKGG,IALH,CAKQ,GALR,CADF;;AAQA,eAAeP,mBAAf","sourcesContent":["import {keys} from 'lodash/fp';\n\nexport type QueryParams = {\n [key: string]: string | number | boolean;\n};\n\nconst buildUrlQueryParams = (params: QueryParams) =>\n keys(params)\n .map(key => {\n const value = params[key].toString();\n return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;\n })\n .join('&');\n\nexport default buildUrlQueryParams;\n"],"file":"build-query-string.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/util/get-clean-uri.ts"],"names":["getCleanUri","originalUri","replace"],"mappings":"AAAA,MAAMA,WAAW,GAAIC,WAAD,IAClBA,WAAW,IAAIA,WAAW,CAACC,OAAZ,CAAoB,sBAApB,EAA4C,UAA5C,CADjB;;AAGA,eAAeF,WAAf","sourcesContent":["const getCleanUri = (originalUri: string): string =>\n originalUri && originalUri.replace(/(http:|https:|)\\/\\//g, 'https://');\n\nexport default getCleanUri;\n"],"file":"get-clean-uri.js"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
|
|
3
|
+
import { PixelRatio } from 'react-native';
|
|
4
|
+
import buildUrlQueryParams from './build-query-string';
|
|
5
|
+
const MEDIAS_API = 'https://api.coorpacademy.com/api-service/medias';
|
|
6
|
+
|
|
7
|
+
const getResizedImage = (url, {
|
|
8
|
+
maxWidth,
|
|
9
|
+
maxHeight,
|
|
10
|
+
resizeMode
|
|
11
|
+
}) => {
|
|
12
|
+
if (!maxWidth && !maxHeight) {
|
|
13
|
+
return url;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
let queryParams = {
|
|
17
|
+
url,
|
|
18
|
+
m: !resizeMode || resizeMode === 'cover' ? 'crop' : 'contain',
|
|
19
|
+
q: 90
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
if (maxWidth) {
|
|
23
|
+
queryParams = _extends(_extends({}, queryParams), {}, {
|
|
24
|
+
w: PixelRatio.getPixelSizeForLayoutSize(maxWidth)
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
if (maxHeight) {
|
|
29
|
+
queryParams = _extends(_extends({}, queryParams), {}, {
|
|
30
|
+
h: PixelRatio.getPixelSizeForLayoutSize(maxHeight)
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
const queryString = buildUrlQueryParams(queryParams);
|
|
35
|
+
return `${MEDIAS_API}?${queryString}`;
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
export default getResizedImage;
|
|
39
|
+
//# sourceMappingURL=get-resized-image.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/util/get-resized-image.ts"],"names":["PixelRatio","buildUrlQueryParams","MEDIAS_API","getResizedImage","url","maxWidth","maxHeight","resizeMode","queryParams","m","q","w","getPixelSizeForLayoutSize","h","queryString"],"mappings":";;AAAA,SAAQA,UAAR,QAA0C,cAA1C;AAEA,OAAOC,mBAAP,MAAgC,sBAAhC;AAEA,MAAMC,UAAU,GAAG,iDAAnB;;AAUA,MAAMC,eAAe,GAAG,CACtBC,GADsB,EAEtB;AACEC,EAAAA,QADF;AAEEC,EAAAA,SAFF;AAGEC,EAAAA;AAHF,CAFsB,KAWnB;AACH,MAAI,CAACF,QAAD,IAAa,CAACC,SAAlB,EAA6B;AAC3B,WAAOF,GAAP;AACD;;AAED,MAAII,WAAgC,GAAG;AACrCJ,IAAAA,GADqC;AAErCK,IAAAA,CAAC,EAAE,CAACF,UAAD,IAAeA,UAAU,KAAK,OAA9B,GAAwC,MAAxC,GAAiD,SAFf;AAGrCG,IAAAA,CAAC,EAAE;AAHkC,GAAvC;;AAMA,MAAIL,QAAJ,EAAc;AACZG,IAAAA,WAAW,yBACNA,WADM;AAETG,MAAAA,CAAC,EAAEX,UAAU,CAACY,yBAAX,CAAqCP,QAArC;AAFM,MAAX;AAID;;AAED,MAAIC,SAAJ,EAAe;AACbE,IAAAA,WAAW,yBACNA,WADM;AAETK,MAAAA,CAAC,EAAEb,UAAU,CAACY,yBAAX,CAAqCN,SAArC;AAFM,MAAX;AAID;;AAED,QAAMQ,WAAW,GAAGb,mBAAmB,CAACO,WAAD,CAAvC;AAEA,SAAQ,GAAEN,UAAW,IAAGY,WAAY,EAApC;AACD,CAvCD;;AAyCA,eAAeX,eAAf","sourcesContent":["import {PixelRatio, ImageResizeMode} from 'react-native';\n\nimport buildUrlQueryParams from './build-query-string';\n\nconst MEDIAS_API = 'https://api.coorpacademy.com/api-service/medias';\n\ntype MediaAPIQueryParams = {\n url: string;\n m: ImageResizeMode | 'crop';\n q: number;\n w?: number;\n h?: number;\n};\n\nconst getResizedImage = (\n url: string,\n {\n maxWidth,\n maxHeight,\n resizeMode\n }: {\n maxWidth?: number;\n maxHeight?: number;\n resizeMode?: ImageResizeMode | undefined;\n }\n) => {\n if (!maxWidth && !maxHeight) {\n return url;\n }\n\n let queryParams: MediaAPIQueryParams = {\n url,\n m: !resizeMode || resizeMode === 'cover' ? 'crop' : 'contain',\n q: 90\n };\n\n if (maxWidth) {\n queryParams = {\n ...queryParams,\n w: PixelRatio.getPixelSizeForLayoutSize(maxWidth)\n };\n }\n\n if (maxHeight) {\n queryParams = {\n ...queryParams,\n h: PixelRatio.getPixelSizeForLayoutSize(maxHeight)\n };\n }\n\n const queryString = buildUrlQueryParams(queryParams);\n\n return `${MEDIAS_API}?${queryString}`;\n};\n\nexport default getResizedImage;\n"],"file":"get-resized-image.js"}
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import _compact from "lodash/fp/compact";
|
|
2
2
|
const reg = /{{(\w+)}}/;
|
|
3
3
|
|
|
4
|
-
function parseTemplateString(
|
|
5
|
-
if (!
|
|
4
|
+
function parseTemplateString(_template) {
|
|
5
|
+
if (!_template) {
|
|
6
6
|
return [];
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
+
const template = _template.replace(/<br\s*\/*>/g, '<br>').replace(/\r?\n|\r/g, '<br>');
|
|
10
|
+
|
|
9
11
|
const res = reg.exec(template);
|
|
10
12
|
|
|
11
13
|
if (!res) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/util/parse-template-string.js"],"names":["reg","parseTemplateString","template","res","exec","type","value","index","slice","concat","length"],"mappings":";AAEA,MAAMA,GAAG,GAAG,WAAZ;;AAEA,SAASC,mBAAT,CAA6BC,
|
|
1
|
+
{"version":3,"sources":["../../src/util/parse-template-string.js"],"names":["reg","parseTemplateString","_template","template","replace","res","exec","type","value","index","slice","concat","length"],"mappings":";AAEA,MAAMA,GAAG,GAAG,WAAZ;;AAEA,SAASC,mBAAT,CAA6BC,SAA7B,EAAwC;AACtC,MAAI,CAACA,SAAL,EAAgB;AACd,WAAO,EAAP;AACD;;AAED,QAAMC,QAAQ,GAAGD,SAAS,CAACE,OAAV,CAAkB,aAAlB,EAAiC,MAAjC,EAAyCA,OAAzC,CAAiD,WAAjD,EAA8D,MAA9D,CAAjB;;AAEA,QAAMC,GAAG,GAAGL,GAAG,CAACM,IAAJ,CAASH,QAAT,CAAZ;;AAEA,MAAI,CAACE,GAAL,EAAU;AACR,WAAO,CAAC;AAACE,MAAAA,IAAI,EAAE,QAAP;AAAiBC,MAAAA,KAAK,EAAEL;AAAxB,KAAD,CAAP;AACD;;AAED,SAAO,SAAQ,CACbE,GAAG,CAACI,KAAJ,KAAc,CAAd,GAAkB,IAAlB,GAAyB;AAACF,IAAAA,IAAI,EAAE,QAAP;AAAiBC,IAAAA,KAAK,EAAEL,QAAQ,CAACO,KAAT,CAAe,CAAf,EAAkBL,GAAG,CAACI,KAAtB;AAAxB,GADZ,EAEb;AAACF,IAAAA,IAAI,EAAE,aAAP;AAAsBC,IAAAA,KAAK,EAAEH,GAAG,CAAC,CAAD;AAAhC,GAFa,CAAR,EAGJM,MAHI,CAGGV,mBAAmB,CAACE,QAAQ,CAACO,KAAT,CAAeL,GAAG,CAACI,KAAJ,GAAYJ,GAAG,CAAC,CAAD,CAAH,CAAOO,MAAlC,CAAD,CAHtB,CAAP;AAID;;AAED,eAAeX,mBAAf","sourcesContent":["import {compact} from 'lodash/fp';\n\nconst reg = /{{(\\w+)}}/;\n\nfunction parseTemplateString(_template) {\n if (!_template) {\n return [];\n }\n\n const template = _template.replace(/<br\\s*\\/*>/g, '<br>').replace(/\\r?\\n|\\r/g, '<br>');\n\n const res = reg.exec(template);\n\n if (!res) {\n return [{type: 'string', value: template}];\n }\n\n return compact([\n res.index === 0 ? null : {type: 'string', value: template.slice(0, res.index)},\n {type: 'answerField', value: res[1]}\n ]).concat(parseTemplateString(template.slice(res.index + res[0].length)));\n}\n\nexport default parseTemplateString;\n"],"file":"parse-template-string.js"}
|
package/es/variables/colors.css
CHANGED
|
@@ -67,6 +67,7 @@
|
|
|
67
67
|
@value box_shadow_light_dark: rgba(0, 0, 0, 0.12);
|
|
68
68
|
@value box_shadow_medium_dark: rgba(0, 0, 0, 0.2);
|
|
69
69
|
@value box_shadow_orange_700: rgba(255, 84, 31, 0.15);
|
|
70
|
+
@value light_blue: #ADC9F5;
|
|
70
71
|
|
|
71
72
|
@value go1_backgound: #144953;
|
|
72
73
|
@value go1_primary: #D5FD42;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/variables/theme.native.ts"],"names":["HTML_ANCHOR_TEXT_COLOR","defaultTheme","colors","border","gray","extra","lighter","light","lightMedium","medium","dark","extraDark","text","primary","background","cta","negative","positive","white","black","battle","notification","salmon","spacing","micro","tiny","small","base","large","xlarge","radius","common","card","regular","search","button","thumbnail","fontWeight","semiBold","bold","extraBold","fontSize","extraSmall","xxlarge","xxxlarge","letterSpacing","header"],"mappings":"AAEA,OAAO,MAAMA,sBAAsB,GAAG,SAA/B;
|
|
1
|
+
{"version":3,"sources":["../../src/variables/theme.native.ts"],"names":["HTML_ANCHOR_TEXT_COLOR","defaultTheme","colors","border","gray","extra","lighter","light","lightMedium","medium","dark","extraDark","text","primary","background","cta","negative","positive","white","black","battle","notification","salmon","spacing","micro","tiny","small","base","large","xlarge","radius","common","card","regular","search","button","thumbnail","fontWeight","semiBold","bold","extraBold","fontSize","extraSmall","xxlarge","xxxlarge","letterSpacing","header"],"mappings":"AAEA,OAAO,MAAMA,sBAAsB,GAAG,SAA/B;AAoEP,MAAMC,YAAmB,GAAG;AAC1BC,EAAAA,MAAM,EAAE;AACNC,IAAAA,MAAM,EAAE,oBADF;AAENC,IAAAA,IAAI,EAAE;AACJC,MAAAA,KAAK,EAAE,SADH;AAEJC,MAAAA,OAAO,EAAE,SAFL;AAGJC,MAAAA,KAAK,EAAE,SAHH;AAIJC,MAAAA,WAAW,EAAE,SAJT;AAKJC,MAAAA,MAAM,EAAE,SALJ;AAMJC,MAAAA,IAAI,EAAE,SANF;AAOJC,MAAAA,SAAS,EAAE;AAPP,KAFA;AAWNC,IAAAA,IAAI,EAAE;AACJC,MAAAA,OAAO,EAAE;AADL,KAXA;AAcNC,IAAAA,UAAU,EAAE,EAdN;AAeNC,IAAAA,GAAG,EAAE,SAfC;AAgBNC,IAAAA,QAAQ,EAAE,SAhBJ;AAiBNC,IAAAA,QAAQ,EAAE,SAjBJ;AAkBNC,IAAAA,KAAK,EAAE,SAlBD;AAmBNC,IAAAA,KAAK,EAAE,SAnBD;AAoBNC,IAAAA,MAAM,EAAE,SApBF;AAqBNC,IAAAA,YAAY,EAAE,SArBR;AAsBNC,IAAAA,MAAM,EAAE;AAtBF,GADkB;AAyB1BC,EAAAA,OAAO,EAAE;AACPC,IAAAA,KAAK,EAAE,CADA;AAEPC,IAAAA,IAAI,EAAE,CAFC;AAGPC,IAAAA,KAAK,EAAE,EAHA;AAIPC,IAAAA,IAAI,EAAE,EAJC;AAKPlB,IAAAA,MAAM,EAAE,EALD;AAMPmB,IAAAA,KAAK,EAAE,EANA;AAOPC,IAAAA,MAAM,EAAE;AAPD,GAzBiB;AAkC1BC,EAAAA,MAAM,EAAE;AACNC,IAAAA,MAAM,EAAE,CADF;AAENC,IAAAA,IAAI,EAAE,CAFA;AAGNC,IAAAA,OAAO,EAAE,CAHH;AAINxB,IAAAA,MAAM,EAAE,EAJF;AAKNyB,IAAAA,MAAM,EAAE,EALF;AAMNC,IAAAA,MAAM,EAAE,EANF;AAONC,IAAAA,SAAS,EAAE;AAPL,GAlCkB;AA2C1BC,EAAAA,UAAU,EAAE;AACVJ,IAAAA,OAAO,EAAE,KADC;AAEVK,IAAAA,QAAQ,EAAE,KAFA;AAGVC,IAAAA,IAAI,EAAE,KAHI;AAIVC,IAAAA,SAAS,EAAE;AAJD,GA3Cc;AAiD1BC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,UAAU,EAAE,EADJ;AAERhB,IAAAA,KAAK,EAAE,EAFC;AAGRjB,IAAAA,MAAM,EAAE,EAHA;AAIRwB,IAAAA,OAAO,EAAE,EAJD;AAKRL,IAAAA,KAAK,EAAE,EALC;AAMRC,IAAAA,MAAM,EAAE,EANA;AAORc,IAAAA,OAAO,EAAE,EAPD;AAQRC,IAAAA,QAAQ,EAAE;AARF,GAjDgB;AA2D1BC,EAAAA,aAAa,EAAE;AACbC,IAAAA,MAAM,EAAE;AADK;AA3DW,CAA5B;AAgEA,eAAe7C,YAAf","sourcesContent":["import {TextStyle} from 'react-native';\n\nexport const HTML_ANCHOR_TEXT_COLOR = '#002BDB';\n\nexport type Colors = {\n background?: any;\n border: string;\n gray: {\n extra: string;\n light: string;\n lighter: string;\n lightMedium: string;\n medium: string;\n dark: string;\n extraDark: string;\n };\n text: {\n primary: '#06265B';\n };\n cta: string;\n negative: string;\n positive: string;\n white: string;\n black: string;\n battle: string;\n notification: string;\n salmon: string;\n};\n\nexport type Theme = {\n colors: Colors;\n spacing: {\n micro: number;\n tiny: number;\n small: number;\n base: number;\n medium: number;\n large: number;\n xlarge: number;\n };\n radius: {\n button: number;\n common: number;\n card: number;\n medium: number;\n regular: number;\n search: number;\n thumbnail: number;\n };\n fontWeight: {\n regular: TextStyle['fontWeight'];\n semiBold: TextStyle['fontWeight'];\n bold: TextStyle['fontWeight'];\n extraBold: TextStyle['fontWeight'];\n };\n fontSize: {\n extraSmall: TextStyle['fontSize'];\n small: TextStyle['fontSize'];\n medium: TextStyle['fontSize'];\n regular: TextStyle['fontSize'];\n large: TextStyle['fontSize'];\n xlarge: TextStyle['fontSize'];\n xxlarge: TextStyle['fontSize'];\n xxxlarge: TextStyle['fontSize'];\n };\n letterSpacing: {\n header: number;\n };\n};\n\nconst defaultTheme: Theme = {\n colors: {\n border: 'rgba(0, 0, 0, 0.1)',\n gray: {\n extra: '#FAFAFA',\n lighter: '#F4F4F5',\n light: '#ededed',\n lightMedium: '#CFD8DC',\n medium: '#90A4AE',\n dark: '#546E7A',\n extraDark: '#323232'\n },\n text: {\n primary: '#06265B'\n },\n background: {},\n cta: '#0061FF',\n negative: '#F73F52',\n positive: '#3EC483',\n white: '#FFFFFF',\n black: '#14171A',\n battle: '#FFDE03',\n notification: '#FF7043',\n salmon: '#FDE2E5'\n },\n spacing: {\n micro: 4,\n tiny: 8,\n small: 16,\n base: 24,\n medium: 32,\n large: 48,\n xlarge: 64\n },\n radius: {\n common: 3,\n card: 5,\n regular: 8,\n medium: 12,\n search: 24,\n button: 32,\n thumbnail: 1000\n },\n fontWeight: {\n regular: '400',\n semiBold: '500',\n bold: '700',\n extraBold: '900'\n },\n fontSize: {\n extraSmall: 10,\n small: 12,\n medium: 13,\n regular: 15,\n large: 17,\n xlarge: 22,\n xxlarge: 28,\n xxxlarge: 40\n },\n letterSpacing: {\n header: 5\n }\n};\n\nexport default defaultTheme;\n"],"file":"theme.native.js"}
|
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
var _index = _interopRequireDefault(require("../html/index.native"));
|
|
11
|
+
|
|
12
|
+
var _index2 = _interopRequireDefault(require("../image-background/index.native"));
|
|
13
|
+
|
|
14
|
+
var _getCleanUri = _interopRequireDefault(require("../../util/get-clean-uri"));
|
|
15
|
+
|
|
16
|
+
var _index3 = _interopRequireDefault(require("../../hoc/touchable/index.native"));
|
|
17
|
+
|
|
18
|
+
var _templateContext = require("../../template/app-review/template-context");
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
|
+
|
|
22
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
23
|
+
|
|
24
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
25
|
+
|
|
26
|
+
const createStyleSheet = theme => _reactNative.StyleSheet.create({
|
|
27
|
+
boxShadow: {
|
|
28
|
+
shadowColor: '#000',
|
|
29
|
+
shadowOffset: {
|
|
30
|
+
width: 0,
|
|
31
|
+
height: 4
|
|
32
|
+
},
|
|
33
|
+
shadowOpacity: 0.12,
|
|
34
|
+
shadowRadius: 16,
|
|
35
|
+
elevation: 8,
|
|
36
|
+
backgroundColor: '#0000'
|
|
37
|
+
},
|
|
38
|
+
container: {
|
|
39
|
+
minHeight: 80,
|
|
40
|
+
backgroundColor: theme.colors.white,
|
|
41
|
+
borderRadius: theme.radius.regular,
|
|
42
|
+
overflow: 'hidden',
|
|
43
|
+
flexDirection: 'row',
|
|
44
|
+
alignItems: 'stretch'
|
|
45
|
+
},
|
|
46
|
+
textContainer: {
|
|
47
|
+
paddingHorizontal: 24,
|
|
48
|
+
paddingVertical: 12,
|
|
49
|
+
justifyContent: 'center',
|
|
50
|
+
alignItems: 'center',
|
|
51
|
+
flex: 1
|
|
52
|
+
},
|
|
53
|
+
squeezedTextContainer: {
|
|
54
|
+
padding: theme.spacing.small,
|
|
55
|
+
paddingLeft: undefined,
|
|
56
|
+
paddingVertical: undefined,
|
|
57
|
+
paddingRight: undefined,
|
|
58
|
+
flex: 0
|
|
59
|
+
},
|
|
60
|
+
text: {
|
|
61
|
+
fontWeight: theme.fontWeight.bold,
|
|
62
|
+
color: theme.colors.black
|
|
63
|
+
},
|
|
64
|
+
textSelected: {
|
|
65
|
+
color: theme.colors.white
|
|
66
|
+
},
|
|
67
|
+
unselectedImageContainer: {
|
|
68
|
+
borderRightColor: theme.colors.border
|
|
69
|
+
},
|
|
70
|
+
imageContainer: {
|
|
71
|
+
height: '100%',
|
|
72
|
+
width: '25%'
|
|
73
|
+
},
|
|
74
|
+
image: {
|
|
75
|
+
flex: 1
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
|
|
79
|
+
const Choice = ({
|
|
80
|
+
children,
|
|
81
|
+
isSelected = false,
|
|
82
|
+
squeezed = false,
|
|
83
|
+
isDisabled,
|
|
84
|
+
onPress,
|
|
85
|
+
media,
|
|
86
|
+
testID: prefixTestID,
|
|
87
|
+
style,
|
|
88
|
+
questionType
|
|
89
|
+
}) => {
|
|
90
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
91
|
+
const {
|
|
92
|
+
theme,
|
|
93
|
+
brandTheme
|
|
94
|
+
} = templateContext;
|
|
95
|
+
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
96
|
+
(0, _react.useEffect)(() => {
|
|
97
|
+
const _stylesheet = createStyleSheet(theme);
|
|
98
|
+
|
|
99
|
+
setStylesheet(_stylesheet);
|
|
100
|
+
}, [theme]);
|
|
101
|
+
|
|
102
|
+
if (!styleSheet) {
|
|
103
|
+
return null;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
const selectedStyle = brandTheme && {
|
|
107
|
+
backgroundColor: brandTheme.colors.primary,
|
|
108
|
+
borderColor: brandTheme.colors.primary,
|
|
109
|
+
borderRadius: theme.radius.common
|
|
110
|
+
};
|
|
111
|
+
const selectedSuffix = prefixTestID && isSelected ? '-selected' : '';
|
|
112
|
+
const mediaType = media && media.type && media.type === 'img' && media.type.toLowerCase();
|
|
113
|
+
const url = media && media.type === 'img' && media.src && media.src.length > 0 && (0, _getCleanUri.default)(media.src[0].url);
|
|
114
|
+
const source = {
|
|
115
|
+
uri: url ? (0, _getCleanUri.default)(url) : undefined
|
|
116
|
+
};
|
|
117
|
+
const mediaSuffix = prefixTestID && mediaType ? `-${mediaType}` : '';
|
|
118
|
+
const htmlStyle = [styleSheet.text];
|
|
119
|
+
|
|
120
|
+
if (isSelected) {
|
|
121
|
+
htmlStyle.push(styleSheet.textSelected);
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
return /*#__PURE__*/_react.default.createElement(_index3.default, {
|
|
125
|
+
onPress: !isDisabled ? onPress : undefined,
|
|
126
|
+
style: style,
|
|
127
|
+
analyticsID: "question-choice",
|
|
128
|
+
analyticsParams: {
|
|
129
|
+
questionType
|
|
130
|
+
}
|
|
131
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
132
|
+
style: [styleSheet.boxShadow, styleSheet.container],
|
|
133
|
+
testID: prefixTestID && `${prefixTestID}${selectedSuffix}`
|
|
134
|
+
}, url ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
135
|
+
style: styleSheet.imageContainer
|
|
136
|
+
}, /*#__PURE__*/_react.default.createElement(_index2.default, {
|
|
137
|
+
testID: prefixTestID && `${prefixTestID}${mediaSuffix}`,
|
|
138
|
+
source: source,
|
|
139
|
+
style: styleSheet.image
|
|
140
|
+
})) : null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
141
|
+
style: [styleSheet.textContainer, squeezed && styleSheet.squeezedTextContainer, isSelected && selectedStyle]
|
|
142
|
+
}, /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
143
|
+
fontSize: squeezed ? theme.fontSize.medium : theme.fontSize.regular,
|
|
144
|
+
style: htmlStyle
|
|
145
|
+
}, children))));
|
|
146
|
+
};
|
|
147
|
+
|
|
148
|
+
var _default = Choice;
|
|
149
|
+
exports.default = _default;
|
|
150
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/choice/index.native.tsx"],"names":["createStyleSheet","theme","StyleSheet","create","boxShadow","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","backgroundColor","container","minHeight","colors","white","borderRadius","radius","regular","overflow","flexDirection","alignItems","textContainer","paddingHorizontal","paddingVertical","justifyContent","flex","squeezedTextContainer","padding","spacing","small","paddingLeft","undefined","paddingRight","text","fontWeight","bold","color","black","textSelected","unselectedImageContainer","borderRightColor","border","imageContainer","image","Choice","children","isSelected","squeezed","isDisabled","onPress","media","testID","prefixTestID","style","questionType","templateContext","brandTheme","styleSheet","setStylesheet","_stylesheet","selectedStyle","primary","borderColor","common","selectedSuffix","mediaType","type","toLowerCase","url","src","length","source","uri","mediaSuffix","htmlStyle","push","fontSize","medium"],"mappings":"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","sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {View, StyleSheet, ViewStyle} from 'react-native';\nimport type {Media, QuestionType} from '../../types/progression-engine';\n\nimport Html from '../html/index.native';\nimport ImageBackground from '../image-background/index.native';\nimport getCleanUri from '../../util/get-clean-uri';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n isSelected?: boolean;\n onPress: () => void;\n children: string;\n isDisabled?: boolean;\n testID?: string;\n media?: Media;\n squeezed?: boolean;\n style?: ViewStyle;\n questionType: QuestionType;\n};\n\ntype StyleSheetType = {\n boxShadow: any;\n container: any;\n text: any;\n textSelected: any;\n textContainer: any;\n squeezedTextContainer: any;\n unselectedImageContainer: any;\n imageContainer: any;\n image: any;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n boxShadow: {\n shadowColor: '#000',\n shadowOffset: {width: 0, height: 4},\n shadowOpacity: 0.12,\n shadowRadius: 16,\n elevation: 8,\n backgroundColor: '#0000'\n },\n container: {\n minHeight: 80,\n backgroundColor: theme.colors.white,\n borderRadius: theme.radius.regular,\n overflow: 'hidden',\n flexDirection: 'row',\n alignItems: 'stretch'\n },\n textContainer: {\n paddingHorizontal: 24,\n paddingVertical: 12,\n justifyContent: 'center',\n alignItems: 'center',\n flex: 1\n },\n squeezedTextContainer: {\n padding: theme.spacing.small,\n paddingLeft: undefined,\n paddingVertical: undefined,\n paddingRight: undefined,\n flex: 0\n },\n text: {\n fontWeight: theme.fontWeight.bold,\n color: theme.colors.black\n },\n textSelected: {\n color: theme.colors.white\n },\n unselectedImageContainer: {\n borderRightColor: theme.colors.border\n },\n imageContainer: {\n height: '100%',\n width: '25%'\n },\n image: {\n flex: 1\n }\n });\n\nconst Choice = ({\n children,\n isSelected = false,\n squeezed = false,\n isDisabled,\n onPress,\n media,\n testID: prefixTestID,\n style,\n questionType\n}: Props) => {\n const templateContext = useTemplateContext();\n const {theme, brandTheme} = 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 (!styleSheet) {\n return null;\n }\n\n const selectedStyle = brandTheme && {\n backgroundColor: brandTheme.colors.primary,\n borderColor: brandTheme.colors.primary,\n borderRadius: theme.radius.common\n };\n\n const selectedSuffix = prefixTestID && isSelected ? '-selected' : '';\n const mediaType = media && media.type && media.type === 'img' && media.type.toLowerCase();\n const url =\n media &&\n media.type === 'img' &&\n media.src &&\n media.src.length > 0 &&\n getCleanUri(media.src[0].url);\n\n const source = {uri: url ? getCleanUri(url) : undefined};\n const mediaSuffix = prefixTestID && mediaType ? `-${mediaType}` : '';\n\n const htmlStyle: ViewStyle[] = [styleSheet.text];\n\n if (isSelected) {\n htmlStyle.push(styleSheet.textSelected);\n }\n\n return (\n <Touchable\n onPress={!isDisabled ? onPress : undefined}\n style={style}\n analyticsID=\"question-choice\"\n analyticsParams={{questionType}}\n >\n <View\n style={[styleSheet.boxShadow, styleSheet.container]}\n testID={prefixTestID && `${prefixTestID}${selectedSuffix}`}\n >\n {url ? (\n <View style={styleSheet.imageContainer}>\n <ImageBackground\n testID={prefixTestID && `${prefixTestID}${mediaSuffix}`}\n source={source}\n style={styleSheet.image}\n />\n </View>\n ) : null}\n <View\n style={[\n styleSheet.textContainer,\n squeezed && styleSheet.squeezedTextContainer,\n isSelected && selectedStyle\n ]}\n >\n <Html\n fontSize={squeezed ? theme.fontSize.medium : theme.fontSize.regular}\n style={htmlStyle}\n >\n {children}\n </Html>\n </View>\n </View>\n </Touchable>\n );\n};\n\nexport default Choice;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireDefault(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactNativeLinearGradient = _interopRequireDefault(require("react-native-linear-gradient"));
|
|
9
|
+
|
|
10
|
+
var _color = _interopRequireDefault(require("color"));
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
|
|
14
|
+
const Gradient = ({
|
|
15
|
+
children,
|
|
16
|
+
colors,
|
|
17
|
+
transparencyPosition = 'top',
|
|
18
|
+
height,
|
|
19
|
+
style,
|
|
20
|
+
testID,
|
|
21
|
+
pointerEvents
|
|
22
|
+
}) => {
|
|
23
|
+
let calculatedColors = colors;
|
|
24
|
+
|
|
25
|
+
if (colors.length === 1) {
|
|
26
|
+
const {
|
|
27
|
+
r,
|
|
28
|
+
g,
|
|
29
|
+
b
|
|
30
|
+
} = (0, _color.default)(colors[0]).object();
|
|
31
|
+
calculatedColors = transparencyPosition === 'top' ? [`rgba(${r}, ${g}, ${b}, 0)`, colors[0], colors[0]] : [colors[0], colors[0], `rgba(${r}, ${g}, ${b}, 0)`];
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
const _style = [];
|
|
35
|
+
|
|
36
|
+
if (style) {
|
|
37
|
+
_style.push(style);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
if (height) {
|
|
41
|
+
_style.push({
|
|
42
|
+
height
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
return /*#__PURE__*/_react.default.createElement(_reactNativeLinearGradient.default, {
|
|
47
|
+
colors: calculatedColors,
|
|
48
|
+
style: _style,
|
|
49
|
+
pointerEvents: pointerEvents,
|
|
50
|
+
testID: testID
|
|
51
|
+
}, children);
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
var _default = Gradient;
|
|
55
|
+
exports.default = _default;
|
|
56
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/gradient/index.native.tsx"],"names":["Gradient","children","colors","transparencyPosition","height","style","testID","pointerEvents","calculatedColors","length","r","g","b","object","_style","push"],"mappings":";;;;;AAAA;;AAEA;;AACA;;;;AAYA,MAAMA,QAAQ,GAAG,CAAC;AAChBC,EAAAA,QADgB;AAEhBC,EAAAA,MAFgB;AAGhBC,EAAAA,oBAAoB,GAAG,KAHP;AAIhBC,EAAAA,MAJgB;AAKhBC,EAAAA,KALgB;AAMhBC,EAAAA,MANgB;AAOhBC,EAAAA;AAPgB,CAAD,KAQJ;AACX,MAAIC,gBAAgB,GAAGN,MAAvB;;AACA,MAAIA,MAAM,CAACO,MAAP,KAAkB,CAAtB,EAAyB;AACvB,UAAM;AAACC,MAAAA,CAAD;AAAIC,MAAAA,CAAJ;AAAOC,MAAAA;AAAP,QAAY,oBAAMV,MAAM,CAAC,CAAD,CAAZ,EAAiBW,MAAjB,EAAlB;AACAL,IAAAA,gBAAgB,GACdL,oBAAoB,KAAK,KAAzB,GACI,CAAE,QAAOO,CAAE,KAAIC,CAAE,KAAIC,CAAE,MAAvB,EAA8BV,MAAM,CAAC,CAAD,CAApC,EAAyCA,MAAM,CAAC,CAAD,CAA/C,CADJ,GAEI,CAACA,MAAM,CAAC,CAAD,CAAP,EAAYA,MAAM,CAAC,CAAD,CAAlB,EAAwB,QAAOQ,CAAE,KAAIC,CAAE,KAAIC,CAAE,MAA7C,CAHN;AAID;;AAED,QAAME,MAAM,GAAG,EAAf;;AAEA,MAAIT,KAAJ,EAAW;AACTS,IAAAA,MAAM,CAACC,IAAP,CAAYV,KAAZ;AACD;;AACD,MAAID,MAAJ,EAAY;AACVU,IAAAA,MAAM,CAACC,IAAP,CAAY;AAACX,MAAAA;AAAD,KAAZ;AACD;;AAED,sBACE,6BAAC,kCAAD;AACE,IAAA,MAAM,EAAEI,gBADV;AAEE,IAAA,KAAK,EAAEM,MAFT;AAGE,IAAA,aAAa,EAAEP,aAHjB;AAIE,IAAA,MAAM,EAAED;AAJV,KAMGL,QANH,CADF;AAUD,CArCD;;eAuCeD,Q","sourcesContent":["import React, {ReactNode} from 'react';\nimport {ViewStyle} from 'react-native';\nimport LinearGradient from 'react-native-linear-gradient';\nimport Color from 'color';\n\nexport type Props = {\n children?: ReactNode;\n colors: Array<string>;\n transparencyPosition?: 'top' | 'bottom';\n height?: number;\n style?: ViewStyle | ViewStyle[] | undefined;\n testID?: string;\n pointerEvents?: 'auto' | 'none' | 'box-none' | 'box-only' | undefined;\n};\n\nconst Gradient = ({\n children,\n colors,\n transparencyPosition = 'top',\n height,\n style,\n testID,\n pointerEvents\n}: Props) => {\n let calculatedColors = colors;\n if (colors.length === 1) {\n const {r, g, b} = Color(colors[0]).object();\n calculatedColors =\n transparencyPosition === 'top'\n ? [`rgba(${r}, ${g}, ${b}, 0)`, colors[0], colors[0]]\n : [colors[0], colors[0], `rgba(${r}, ${g}, ${b}, 0)`];\n }\n\n const _style = [];\n\n if (style) {\n _style.push(style);\n }\n if (height) {\n _style.push({height});\n }\n\n return (\n <LinearGradient\n colors={calculatedColors}\n style={_style}\n pointerEvents={pointerEvents}\n testID={testID}\n >\n {children}\n </LinearGradient>\n );\n};\n\nexport default Gradient;\n"],"file":"index.native.js"}
|
|
@@ -24,6 +24,7 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
|
|
|
24
24
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
25
25
|
|
|
26
26
|
const Html = props => {
|
|
27
|
+
const [disableBaseFontStyleColor, setDisableBaseFontStyleColor] = (0, _react.useState)(false);
|
|
27
28
|
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
28
29
|
const {
|
|
29
30
|
theme,
|
|
@@ -44,13 +45,7 @@ const Html = props => {
|
|
|
44
45
|
const handleLinkPress = (0, _react.useMemo)(() => url => {
|
|
45
46
|
vibration?.vibrate();
|
|
46
47
|
onLinkPress && onLinkPress(url);
|
|
47
|
-
}, [onLinkPress, vibration]);
|
|
48
|
-
const state = {
|
|
49
|
-
disableBaseFontStyleColor: false
|
|
50
|
-
};
|
|
51
|
-
const {
|
|
52
|
-
disableBaseFontStyleColor
|
|
53
|
-
} = state; // Don't use StyleSheet there, it's not a react style
|
|
48
|
+
}, [onLinkPress, vibration]); // Don't use StyleSheet there, it's not a react style
|
|
54
49
|
|
|
55
50
|
const styles = {
|
|
56
51
|
p: {
|
|
@@ -112,11 +107,9 @@ const Html = props => {
|
|
|
112
107
|
|
|
113
108
|
const renderers = {
|
|
114
109
|
// eslint-disable-next-line react/display-name
|
|
115
|
-
font: (htmlAttribs,
|
|
110
|
+
font: (htmlAttribs, _children) => {
|
|
116
111
|
if (htmlAttribs.color) {
|
|
117
|
-
(
|
|
118
|
-
disableBaseFontStyleColor: true
|
|
119
|
-
});
|
|
112
|
+
setDisableBaseFontStyleColor(true);
|
|
120
113
|
}
|
|
121
114
|
|
|
122
115
|
return /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
@@ -124,18 +117,18 @@ const Html = props => {
|
|
|
124
117
|
style: _extends(_extends({}, baseFontStyle), {}, {
|
|
125
118
|
color: htmlAttribs.color
|
|
126
119
|
})
|
|
127
|
-
},
|
|
120
|
+
}, _children);
|
|
128
121
|
},
|
|
129
|
-
span: (_,
|
|
122
|
+
span: function Span(_, _children, convertedCSSStyles, {
|
|
130
123
|
allowFontScaling,
|
|
131
124
|
key
|
|
132
|
-
})
|
|
125
|
+
}) {
|
|
133
126
|
return /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
134
127
|
numberOfLines: numberOfLines,
|
|
135
128
|
allowFontScaling: allowFontScaling,
|
|
136
129
|
key: key,
|
|
137
130
|
style: convertedCSSStyles
|
|
138
|
-
},
|
|
131
|
+
}, _children);
|
|
139
132
|
}
|
|
140
133
|
};
|
|
141
134
|
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/atom/html/index.native.tsx"],"names":["Html","props","templateContext","theme","vibration","children","fontSize","containerStyle","imageStyle","style","testID","anchorTextColor","HTML_ANCHOR_TEXT_COLOR","isTextCentered","numberOfLines","onLinkPress","handleLinkPress","url","vibrate","
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/html/index.native.tsx"],"names":["Html","props","disableBaseFontStyleColor","setDisableBaseFontStyleColor","templateContext","theme","vibration","children","fontSize","containerStyle","imageStyle","style","testID","anchorTextColor","HTML_ANCHOR_TEXT_COLOR","isTextCentered","numberOfLines","onLinkPress","handleLinkPress","url","vibrate","styles","p","marginVertical","textAlign","u","textDecorationLine","i","fontStyle","b","fontWeight","bold","s","tagsStyles","h1","h2","h3","h4","h5","h6","a","color","img","baseFontStyle","DEFAULT_TEXT_STYLE","colors","black","Array","isArray","styleObject","reduce","result","child","renderers","font","htmlAttribs","_children","span","Span","_","convertedCSSStyles","allowFontScaling","key","html"],"mappings":"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","sourcesContent":["import React, {useMemo, useState} from 'react';\nimport {View, ViewStyle, ImageStyle, TextStyle} from 'react-native';\nimport HtmlBase from 'react-native-render-html';\n\nimport {HTML_ANCHOR_TEXT_COLOR} from '../../variables/theme.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Text, {DEFAULT_STYLE as DEFAULT_TEXT_STYLE} from '../text/index.native';\n\nexport type Props = {\n children: string;\n fontSize: TextStyle['fontSize'];\n numberOfLines?: number;\n onLinkPress?: (url: string) => void;\n containerStyle?: ViewStyle;\n anchorTextColor?: string;\n imageStyle?: ImageStyle;\n style?: ViewStyle | ViewStyle[];\n testID?: string;\n isTextCentered?: boolean;\n};\n\nconst Html = (props: Props) => {\n const [disableBaseFontStyleColor, setDisableBaseFontStyleColor] = useState<boolean>(false);\n const templateContext = useTemplateContext();\n const {theme, vibration} = templateContext;\n const {\n children,\n fontSize,\n containerStyle,\n imageStyle,\n style,\n testID,\n anchorTextColor = HTML_ANCHOR_TEXT_COLOR,\n isTextCentered,\n numberOfLines,\n onLinkPress\n } = props;\n\n const handleLinkPress = useMemo(\n () => (url: string) => {\n vibration?.vibrate();\n\n onLinkPress && onLinkPress(url);\n },\n [onLinkPress, vibration]\n );\n\n // Don't use StyleSheet there, it's not a react style\n const styles = {\n p: {\n marginVertical: 0,\n textAlign: 'center'\n },\n u: {\n textDecorationLine: 'underline'\n },\n i: {\n fontStyle: 'italic'\n },\n b: {\n fontWeight: theme.fontWeight.bold\n },\n s: {\n textDecorationLine: 'line-through'\n }\n };\n\n const tagsStyles = {\n ...styles,\n h1: {fontSize},\n h2: {fontSize},\n h3: {fontSize},\n h4: {fontSize},\n h5: {fontSize},\n h6: {fontSize},\n a: {color: anchorTextColor},\n img: imageStyle\n };\n\n let baseFontStyle = {...DEFAULT_TEXT_STYLE, fontSize, color: theme.colors.black};\n if (style) {\n if (Array.isArray(style)) {\n const styleObject = style.reduce((result, child) => ({\n ...result,\n ...child\n }));\n baseFontStyle = {\n ...baseFontStyle,\n ...styleObject\n };\n } else {\n baseFontStyle = {\n ...baseFontStyle,\n ...style\n };\n }\n }\n\n const renderers = {\n // eslint-disable-next-line react/display-name\n font: (htmlAttribs, _children) => {\n if (htmlAttribs.color) {\n setDisableBaseFontStyleColor(true);\n }\n return (\n <Text\n key={1}\n style={{\n ...baseFontStyle,\n color: htmlAttribs.color\n }}\n >\n {_children}\n </Text>\n );\n },\n span: function Span(\n _: any,\n _children: any,\n convertedCSSStyles: any,\n {allowFontScaling, key}: any\n ) {\n return (\n <Text\n numberOfLines={numberOfLines}\n allowFontScaling={allowFontScaling}\n key={key}\n style={convertedCSSStyles}\n >\n {_children}\n </Text>\n );\n }\n };\n\n return (\n <View testID={testID} style={containerStyle}>\n <HtmlBase\n // to text-align center on android\n // we have to encapsulate between <p> tag\n // and use custom style define on <p>\n // definition in component style doesn't work\n source={{\n // eslint-disable-next-line no-nested-ternary\n html: isTextCentered\n ? `<p>${children}</p>`\n : numberOfLines\n ? `<span>${children}</span>`\n : `${children}`\n }}\n tagsStyles={tagsStyles}\n baseFontStyle={{\n ...baseFontStyle,\n color: disableBaseFontStyleColor ? null : baseFontStyle.color\n }}\n onLinkPress={handleLinkPress}\n renderers={renderers}\n // this is exceptionally for the onboarding course\n // is the only course that has a gif in the context but the img tag\n // comes with width & height attr and these makes this lib do not render the gif\n // so to avoid it, we decided to ignore these attr\n ignoredStyles={['width', 'height']}\n testID=\"html-base\"\n />\n </View>\n );\n};\n\nexport default Html;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireDefault(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
var _getCleanUri = _interopRequireDefault(require("../../util/get-clean-uri"));
|
|
11
|
+
|
|
12
|
+
var _getResizedImage = _interopRequireDefault(require("../../util/get-resized-image"));
|
|
13
|
+
|
|
14
|
+
var _index = _interopRequireDefault(require("../gradient/index.native"));
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
19
|
+
|
|
20
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
21
|
+
|
|
22
|
+
const styles = _reactNative.StyleSheet.create({
|
|
23
|
+
image: {
|
|
24
|
+
width: '100%',
|
|
25
|
+
height: '100%'
|
|
26
|
+
},
|
|
27
|
+
gradient: {
|
|
28
|
+
flex: 1
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
const ImageBackground = (_ref) => {
|
|
33
|
+
let {
|
|
34
|
+
source,
|
|
35
|
+
gradient,
|
|
36
|
+
gradientStyle,
|
|
37
|
+
style,
|
|
38
|
+
testID = 'image-background'
|
|
39
|
+
} = _ref,
|
|
40
|
+
props = _objectWithoutPropertiesLoose(_ref, ["source", "gradient", "gradientStyle", "style", "testID"]);
|
|
41
|
+
|
|
42
|
+
// @ts-ignore this statement is enough but type is too weak
|
|
43
|
+
let uri = source && source.uri;
|
|
44
|
+
|
|
45
|
+
if (uri) {
|
|
46
|
+
const {
|
|
47
|
+
width: _width,
|
|
48
|
+
height: _height,
|
|
49
|
+
resizeMode
|
|
50
|
+
} = props;
|
|
51
|
+
|
|
52
|
+
const {
|
|
53
|
+
width,
|
|
54
|
+
height
|
|
55
|
+
} = _reactNative.StyleSheet.flatten([{
|
|
56
|
+
width: _width,
|
|
57
|
+
height: _height
|
|
58
|
+
}, style]);
|
|
59
|
+
|
|
60
|
+
const maxHeight = typeof height === 'number' ? height : undefined;
|
|
61
|
+
const maxWidth = typeof width === 'number' ? width : undefined;
|
|
62
|
+
uri = (0, _getResizedImage.default)((0, _getCleanUri.default)(uri), {
|
|
63
|
+
maxHeight,
|
|
64
|
+
maxWidth,
|
|
65
|
+
resizeMode
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
const resizedSource = uri && {
|
|
70
|
+
uri
|
|
71
|
+
} || source;
|
|
72
|
+
|
|
73
|
+
if (gradient) {
|
|
74
|
+
const {
|
|
75
|
+
children
|
|
76
|
+
} = props,
|
|
77
|
+
remainingProps = _objectWithoutPropertiesLoose(props, ["children"]);
|
|
78
|
+
|
|
79
|
+
const _style = [styles.gradient];
|
|
80
|
+
|
|
81
|
+
if (gradientStyle) {
|
|
82
|
+
_style.push(gradientStyle);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.ImageBackground, _extends({}, remainingProps, {
|
|
86
|
+
source: resizedSource,
|
|
87
|
+
style: [styles.image, style],
|
|
88
|
+
testID: testID
|
|
89
|
+
}), /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
90
|
+
testID: `${testID}-gradient`,
|
|
91
|
+
colors: gradient,
|
|
92
|
+
style: _style
|
|
93
|
+
}, children));
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.ImageBackground, _extends({}, props, {
|
|
97
|
+
source: resizedSource,
|
|
98
|
+
style: [styles.image, style],
|
|
99
|
+
testID: testID
|
|
100
|
+
}));
|
|
101
|
+
};
|
|
102
|
+
|
|
103
|
+
var _default = ImageBackground;
|
|
104
|
+
exports.default = _default;
|
|
105
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/image-background/index.native.tsx"],"names":["styles","StyleSheet","create","image","width","height","gradient","flex","ImageBackground","source","gradientStyle","style","testID","props","uri","_width","_height","resizeMode","flatten","maxHeight","undefined","maxWidth","resizedSource","children","remainingProps","_style","push"],"mappings":";;;;;AAAA;;AACA;;AAOA;;AAEA;;AACA;;;;;;;;AAEA,MAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,MADF;AAELC,IAAAA,MAAM,EAAE;AAFH,GADwB;AAK/BC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,IAAI,EAAE;AADE;AALqB,CAAlB,CAAf;;AAmBA,MAAMC,eAAe,GAAG,UAOX;AAAA,MAPY;AACvBC,IAAAA,MADuB;AAEvBH,IAAAA,QAFuB;AAGvBI,IAAAA,aAHuB;AAIvBC,IAAAA,KAJuB;AAKvBC,IAAAA,MAAM,GAAG;AALc,GAOZ;AAAA,MADRC,KACQ;;AACX;AACA,MAAIC,GAAuB,GAAGL,MAAM,IAAIA,MAAM,CAACK,GAA/C;;AAEA,MAAIA,GAAJ,EAAS;AACP,UAAM;AAACV,MAAAA,KAAK,EAAEW,MAAR;AAAgBV,MAAAA,MAAM,EAAEW,OAAxB;AAAiCC,MAAAA;AAAjC,QAA+CJ,KAArD;;AACA,UAAM;AAACT,MAAAA,KAAD;AAAQC,MAAAA;AAAR,QAAkBJ,wBAAWiB,OAAX,CAAmB,CAAC;AAACd,MAAAA,KAAK,EAAEW,MAAR;AAAgBV,MAAAA,MAAM,EAAEW;AAAxB,KAAD,EAAmCL,KAAnC,CAAnB,CAAxB;;AACA,UAAMQ,SAA6B,GAAG,OAAOd,MAAP,KAAkB,QAAlB,GAA6BA,MAA7B,GAAsCe,SAA5E;AACA,UAAMC,QAA4B,GAAG,OAAOjB,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCgB,SAAzE;AAEAN,IAAAA,GAAG,GAAG,8BAAgB,0BAAYA,GAAZ,CAAhB,EAAkC;AACtCK,MAAAA,SADsC;AAEtCE,MAAAA,QAFsC;AAGtCJ,MAAAA;AAHsC,KAAlC,CAAN;AAKD;;AAED,QAAMK,aAAa,GAAIR,GAAG,IAAI;AAACA,IAAAA;AAAD,GAAR,IAAkBL,MAAxC;;AAEA,MAAIH,QAAJ,EAAc;AACZ,UAAM;AAACiB,MAAAA;AAAD,QAAgCV,KAAtC;AAAA,UAAoBW,cAApB,iCAAsCX,KAAtC;;AACA,UAAMY,MAAmB,GAAG,CAACzB,MAAM,CAACM,QAAR,CAA5B;;AAEA,QAAII,aAAJ,EAAmB;AACjBe,MAAAA,MAAM,CAACC,IAAP,CAAYhB,aAAZ;AACD;;AAED,wBACE,6BAAC,4BAAD,eACMc,cADN;AAEE,MAAA,MAAM,EAAEF,aAFV;AAGE,MAAA,KAAK,EAAE,CAACtB,MAAM,CAACG,KAAR,EAAeQ,KAAf,CAHT;AAIE,MAAA,MAAM,EAAEC;AAJV,qBAME,6BAAC,cAAD;AAAU,MAAA,MAAM,EAAG,GAAEA,MAAO,WAA5B;AAAwC,MAAA,MAAM,EAAEN,QAAhD;AAA0D,MAAA,KAAK,EAAEmB;AAAjE,OACGF,QADH,CANF,CADF;AAYD;;AAED,sBACE,6BAAC,4BAAD,eACMV,KADN;AAEE,IAAA,MAAM,EAAES,aAFV;AAGE,IAAA,KAAK,EAAE,CAACtB,MAAM,CAACG,KAAR,EAAeQ,KAAf,CAHT;AAIE,IAAA,MAAM,EAAEC;AAJV,KADF;AAQD,CAxDD;;eA0DeJ,e","sourcesContent":["import React, {ReactNode} from 'react';\nimport {\n ImageBackground as ImageBackgroundBase,\n StyleSheet,\n ViewStyle,\n ImageStyle\n} from 'react-native';\n\nimport getCleanUri from '../../util/get-clean-uri';\n\nimport getResizedImage from '../../util/get-resized-image';\nimport Gradient from '../gradient/index.native';\n\nconst styles = StyleSheet.create({\n image: {\n width: '100%',\n height: '100%'\n },\n gradient: {\n flex: 1\n }\n});\n\nexport type Props = ImageStyle & {\n children?: ReactNode;\n gradient?: Array<string>;\n gradientStyle?: ViewStyle;\n testID?: string;\n source: {uri: string | undefined};\n style?: ViewStyle;\n};\n\nconst ImageBackground = ({\n source,\n gradient,\n gradientStyle,\n style,\n testID = 'image-background',\n ...props\n}: Props) => {\n // @ts-ignore this statement is enough but type is too weak\n let uri: string | undefined = source && source.uri;\n\n if (uri) {\n const {width: _width, height: _height, resizeMode} = props;\n const {width, height} = StyleSheet.flatten([{width: _width, height: _height}, style]);\n const maxHeight: number | undefined = typeof height === 'number' ? height : undefined;\n const maxWidth: number | undefined = typeof width === 'number' ? width : undefined;\n\n uri = getResizedImage(getCleanUri(uri), {\n maxHeight,\n maxWidth,\n resizeMode\n });\n }\n\n const resizedSource = (uri && {uri}) || source;\n\n if (gradient) {\n const {children, ...remainingProps} = props;\n const _style: ViewStyle[] = [styles.gradient];\n\n if (gradientStyle) {\n _style.push(gradientStyle);\n }\n\n return (\n <ImageBackgroundBase\n {...remainingProps}\n source={resizedSource}\n style={[styles.image, style]}\n testID={testID}\n >\n <Gradient testID={`${testID}-gradient`} colors={gradient} style={_style}>\n {children}\n </Gradient>\n </ImageBackgroundBase>\n );\n }\n\n return (\n <ImageBackgroundBase\n {...props}\n source={resizedSource}\n style={[styles.image, style]}\n testID={testID}\n />\n );\n};\n\nexport default ImageBackground;\n"],"file":"index.native.js"}
|