@coorpacademy/components 11.40.21 → 11.40.22-slider.13

package/lib/atom/gradient/index.native.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { ViewStyle } from 'react-native';
 export declare type Props = {
     children?: ReactNode;
@@ -9,6 +9,6 @@ export declare type Props = {
     testID?: string;
     pointerEvents?: 'auto' | 'none' | 'box-none' | 'box-only' | undefined;
 };
-declare const Gradient: ({ children, colors, transparencyPosition, height, style, testID, pointerEvents }: Props) => JSX.Element;
+declare const Gradient: ({ children, colors, transparencyPosition, height, style, testID, pointerEvents }: Props) => React.JSX.Element;
 export default Gradient;
 //# sourceMappingURL=index.native.d.ts.map

package/lib/atom/gradient/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/gradient/index.native.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACvC,OAAO,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAIvC,oBAAY,KAAK,GAAG;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACtB,oBAAoB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CAAC;CACvE,CAAC;AAEF,QAAA,MAAM,QAAQ,qFAQX,KAAK,gBAkCP,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/gradient/index.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACvC,OAAO,EAAO,SAAS,EAAuB,MAAM,cAAc,CAAC;AAGnE,oBAAY,KAAK,GAAG;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACtB,oBAAoB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CAAC;CACvE,CAAC;AAEF,QAAA,MAAM,QAAQ,qFAQX,KAAK,sBAoDP,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/atom/gradient/index.native.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _reactNativeLinearGradient = _interopRequireDefault(require("react-native-linear-gradient"));
+var _reactNative = require("react-native");
 var _colorjs = _interopRequireDefault(require("colorjs.io"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const Gradient = ({
@@ -15,9 +15,17 @@ const Gradient = ({
   testID,
   pointerEvents
 }) => {
-  let calculatedColors = colors;
-  if (colors.length === 1) {
-    const [raw] = colors;
+  // Validate colors array - ensure all values are valid strings
+  const validColors = colors?.filter(c => c && typeof c === 'string') || [];
+
+  // Fallback if no valid colors provided
+  if (validColors.length === 0) {
+    console.warn('Gradient: No valid colors provided, using transparent fallback');
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children);
+  }
+  let calculatedColors = validColors;
+  if (validColors.length === 1) {
+    const [raw] = validColors;
     const transparent = new _colorjs.default(raw).to('srgb');
     transparent.alpha = 0;
     calculatedColors = transparencyPosition === 'top' ? [transparent.toString(), raw, raw] : [raw, raw, transparent.toString()];
@@ -31,12 +39,25 @@ const Gradient = ({
       height
     });
   }
-  return /*#__PURE__*/_react.default.createElement(_reactNativeLinearGradient.default, {
-    colors: calculatedColors,
-    style: _style,
+
+  // Build CSS gradient string (vertical by default)
+  const gradientString = `linear-gradient(180deg, ${calculatedColors.join(', ')})`;
+  const gradientStyle = _reactNative.Platform.select({
+    default: {
+      // @ts-ignore - experimental_backgroundImage is not yet in types
+      experimental_backgroundImage: gradientString
+    },
+    web: {
+      // @ts-ignore
+      backgroundImage: gradientString
+    }
+  });
+  const combinedStyle = _reactNative.StyleSheet.flatten([gradientStyle, ..._style]);
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: combinedStyle,
     pointerEvents: pointerEvents,
     testID: testID
-  }, children) || null;
+  }, children);
 };
 var _default = exports.default = Gradient;
 //# sourceMappingURL=index.native.js.map

package/lib/atom/gradient/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["_react","_interopRequireDefault","require","_reactNativeLinearGradient","_colorjs","e","__esModule","default","Gradient","children","colors","transparencyPosition","height","style","testID","pointerEvents","calculatedColors","length","raw","transparent","Color","to","alpha","toString","_style","push","createElement","_default","exports"],"sources":["../../../src/atom/gradient/index.native.tsx"],"sourcesContent":["import React, {ReactNode} from 'react';\nimport {ViewStyle} from 'react-native';\nimport LinearGradient from 'react-native-linear-gradient';\nimport Color from 'colorjs.io';\n\nexport type Props = {\n  children?: ReactNode;\n  colors: Array<string>;\n  transparencyPosition?: 'top' | 'bottom';\n  height?: number;\n  style?: ViewStyle | ViewStyle[];\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 [raw] = colors;\n    const transparent = new Color(raw).to('srgb');\n    transparent.alpha = 0;\n\n    calculatedColors =\n      transparencyPosition === 'top'\n        ? [transparent.toString(), raw, raw]\n        : [raw, raw, transparent.toString()];\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    (\n      <LinearGradient\n        colors={calculatedColors}\n        style={_style}\n        pointerEvents={pointerEvents}\n        testID={testID}\n      >\n        {children}\n      </LinearGradient>\n    ) || null\n  );\n};\n\nexport default Gradient;\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,0BAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,QAAA,GAAAH,sBAAA,CAAAC,OAAA;AAA+B,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAY/B,MAAMG,QAAQ,GAAGA,CAAC;EAChBC,QAAQ;EACRC,MAAM;EACNC,oBAAoB,GAAG,KAAK;EAC5BC,MAAM;EACNC,KAAK;EACLC,MAAM;EACNC;AACK,CAAC,KAAK;EACX,IAAIC,gBAAgB,GAAGN,MAAM;EAC7B,IAAIA,MAAM,CAACO,MAAM,KAAK,CAAC,EAAE;IACvB,MAAM,CAACC,GAAG,CAAC,GAAGR,MAAM;IACpB,MAAMS,WAAW,GAAG,IAAIC,gBAAK,CAACF,GAAG,CAAC,CAACG,EAAE,CAAC,MAAM,CAAC;IAC7CF,WAAW,CAACG,KAAK,GAAG,CAAC;IAErBN,gBAAgB,GACdL,oBAAoB,KAAK,KAAK,GAC1B,CAACQ,WAAW,CAACI,QAAQ,CAAC,CAAC,EAAEL,GAAG,EAAEA,GAAG,CAAC,GAClC,CAACA,GAAG,EAAEA,GAAG,EAAEC,WAAW,CAACI,QAAQ,CAAC,CAAC,CAAC;EAC1C;EAEA,MAAMC,MAAM,GAAG,EAAE;EAEjB,IAAIX,KAAK,EAAE;IACTW,MAAM,CAACC,IAAI,CAACZ,KAAK,CAAC;EACpB;EACA,IAAID,MAAM,EAAE;IACVY,MAAM,CAACC,IAAI,CAAC;MAACb;IAAM,CAAC,CAAC;EACvB;EAEA,OACE,aACEZ,MAAA,CAAAO,OAAA,CAAAmB,aAAA,CAACvB,0BAAA,CAAAI,OAAc;IACbG,MAAM,EAAEM,gBAAiB;IACzBH,KAAK,EAAEW,MAAO;IACdT,aAAa,EAAEA,aAAc;IAC7BD,MAAM,EAAEA;EAAO,GAEdL,QACa,CAAC,IACd,IAAI;AAEb,CAAC;AAAC,IAAAkB,QAAA,GAAAC,OAAA,CAAArB,OAAA,GAEaC,QAAQ","ignoreList":[]}
+{"version":3,"file":"index.native.js","names":["_react","_interopRequireDefault","require","_reactNative","_colorjs","e","__esModule","default","Gradient","children","colors","transparencyPosition","height","style","testID","pointerEvents","validColors","filter","c","length","console","warn","createElement","Fragment","calculatedColors","raw","transparent","Color","to","alpha","toString","_style","push","gradientString","join","gradientStyle","Platform","select","experimental_backgroundImage","web","backgroundImage","combinedStyle","StyleSheet","flatten","View","_default","exports"],"sources":["../../../src/atom/gradient/index.native.tsx"],"sourcesContent":["import React, {ReactNode} from 'react';\nimport {View, ViewStyle, StyleSheet, Platform} from 'react-native';\nimport Color from 'colorjs.io';\n\nexport type Props = {\n  children?: ReactNode;\n  colors: Array<string>;\n  transparencyPosition?: 'top' | 'bottom';\n  height?: number;\n  style?: ViewStyle | ViewStyle[];\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  // Validate colors array - ensure all values are valid strings\n  const validColors = colors?.filter(c => c && typeof c === 'string') || [];\n\n  // Fallback if no valid colors provided\n  if (validColors.length === 0) {\n    console.warn('Gradient: No valid colors provided, using transparent fallback');\n    return <>{children}</>;\n  }\n\n  let calculatedColors = validColors;\n  if (validColors.length === 1) {\n    const [raw] = validColors;\n    const transparent = new Color(raw).to('srgb');\n    transparent.alpha = 0;\n\n    calculatedColors =\n      transparencyPosition === 'top'\n        ? [transparent.toString(), raw, raw]\n        : [raw, raw, transparent.toString()];\n  }\n\n  const _style: ViewStyle[] = [];\n\n  if (style) {\n    _style.push(style as ViewStyle);\n  }\n  if (height) {\n    _style.push({height});\n  }\n\n  // Build CSS gradient string (vertical by default)\n  const gradientString = `linear-gradient(180deg, ${calculatedColors.join(', ')})`;\n\n  const gradientStyle = Platform.select({\n    default: {\n      // @ts-ignore - experimental_backgroundImage is not yet in types\n      experimental_backgroundImage: gradientString\n    },\n    web: {\n      // @ts-ignore\n      backgroundImage: gradientString\n    }\n  });\n\n  const combinedStyle = StyleSheet.flatten([gradientStyle as ViewStyle, ..._style]);\n\n  return (\n    <View style={combinedStyle} pointerEvents={pointerEvents} testID={testID}>\n      {children}\n    </View>\n  );\n};\n\nexport default Gradient;\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAH,sBAAA,CAAAC,OAAA;AAA+B,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAY/B,MAAMG,QAAQ,GAAGA,CAAC;EAChBC,QAAQ;EACRC,MAAM;EACNC,oBAAoB,GAAG,KAAK;EAC5BC,MAAM;EACNC,KAAK;EACLC,MAAM;EACNC;AACK,CAAC,KAAK;EACX;EACA,MAAMC,WAAW,GAAGN,MAAM,EAAEO,MAAM,CAACC,CAAC,IAAIA,CAAC,IAAI,OAAOA,CAAC,KAAK,QAAQ,CAAC,IAAI,EAAE;;EAEzE;EACA,IAAIF,WAAW,CAACG,MAAM,KAAK,CAAC,EAAE;IAC5BC,OAAO,CAACC,IAAI,CAAC,gEAAgE,CAAC;IAC9E,oBAAOrB,MAAA,CAAAO,OAAA,CAAAe,aAAA,CAAAtB,MAAA,CAAAO,OAAA,CAAAgB,QAAA,QAAGd,QAAW,CAAC;EACxB;EAEA,IAAIe,gBAAgB,GAAGR,WAAW;EAClC,IAAIA,WAAW,CAACG,MAAM,KAAK,CAAC,EAAE;IAC5B,MAAM,CAACM,GAAG,CAAC,GAAGT,WAAW;IACzB,MAAMU,WAAW,GAAG,IAAIC,gBAAK,CAACF,GAAG,CAAC,CAACG,EAAE,CAAC,MAAM,CAAC;IAC7CF,WAAW,CAACG,KAAK,GAAG,CAAC;IAErBL,gBAAgB,GACdb,oBAAoB,KAAK,KAAK,GAC1B,CAACe,WAAW,CAACI,QAAQ,CAAC,CAAC,EAAEL,GAAG,EAAEA,GAAG,CAAC,GAClC,CAACA,GAAG,EAAEA,GAAG,EAAEC,WAAW,CAACI,QAAQ,CAAC,CAAC,CAAC;EAC1C;EAEA,MAAMC,MAAmB,GAAG,EAAE;EAE9B,IAAIlB,KAAK,EAAE;IACTkB,MAAM,CAACC,IAAI,CAACnB,KAAkB,CAAC;EACjC;EACA,IAAID,MAAM,EAAE;IACVmB,MAAM,CAACC,IAAI,CAAC;MAACpB;IAAM,CAAC,CAAC;EACvB;;EAEA;EACA,MAAMqB,cAAc,GAAG,2BAA2BT,gBAAgB,CAACU,IAAI,CAAC,IAAI,CAAC,GAAG;EAEhF,MAAMC,aAAa,GAAGC,qBAAQ,CAACC,MAAM,CAAC;IACpC9B,OAAO,EAAE;MACP;MACA+B,4BAA4B,EAAEL;IAChC,CAAC;IACDM,GAAG,EAAE;MACH;MACAC,eAAe,EAAEP;IACnB;EACF,CAAC,CAAC;EAEF,MAAMQ,aAAa,GAAGC,uBAAU,CAACC,OAAO,CAAC,CAACR,aAAa,EAAe,GAAGJ,MAAM,CAAC,CAAC;EAEjF,oBACE/B,MAAA,CAAAO,OAAA,CAAAe,aAAA,CAACnB,YAAA,CAAAyC,IAAI;IAAC/B,KAAK,EAAE4B,aAAc;IAAC1B,aAAa,EAAEA,aAAc;IAACD,MAAM,EAAEA;EAAO,GACtEL,QACG,CAAC;AAEX,CAAC;AAAC,IAAAoC,QAAA,GAAAC,OAAA,CAAAvC,OAAA,GAEaC,QAAQ","ignoreList":[]}

package/lib/atom/header-back-button/index.native.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { GestureResponderEvent } from 'react-native';
 export declare const HOME_ICON_HEIGHT = 20;
 export declare const CLOSE_ICON_HEIGHT = 16;
@@ -11,6 +11,6 @@ export declare type Props = {
     noSafeArea?: boolean;
     testID?: string;
 };
-declare const HeaderBackButton: (props: Props) => JSX.Element | null;
+declare const HeaderBackButton: (props: Props) => React.JSX.Element;
 export default HeaderBackButton;
 //# sourceMappingURL=index.native.d.ts.map

package/lib/atom/header-back-button/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/header-back-button/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAAmB,qBAAqB,EAAY,MAAM,cAAc,CAAC;AAWhF,eAAO,MAAM,gBAAgB,KAAK,CAAC;AACnC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAEnC,oBAAY,KAAK,GAAG;IAClB,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAuBF,QAAA,MAAM,gBAAgB,UAAW,KAAK,uBA+CrC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/header-back-button/index.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAmB,qBAAqB,EAAY,MAAM,cAAc,CAAC;AAWhF,eAAO,MAAM,gBAAgB,KAAK,CAAC;AACnC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAEnC,oBAAY,KAAK,GAAG;IAClB,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAuBF,QAAA,MAAM,gBAAgB,UAAW,KAAK,sBA+CrC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/atom/header-back-icon/index.native.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { ViewStyle } from 'react-native';
 export declare type Props = {
     color?: string;
@@ -6,6 +6,6 @@ export declare type Props = {
     width?: number;
     style?: ViewStyle;
 };
-declare const HeaderBackIcon: (props: Props) => JSX.Element;
+declare const HeaderBackIcon: (props: Props) => React.JSX.Element;
 export default HeaderBackIcon;
 //# sourceMappingURL=index.native.d.ts.map

package/lib/atom/header-back-icon/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/header-back-icon/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAAO,SAAS,EAAC,MAAM,cAAc,CAAC;AAI7C,oBAAY,KAAK,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,cAAc,UAAW,KAAK,gBAWnC,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/header-back-icon/index.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAO,SAAS,EAAC,MAAM,cAAc,CAAC;AAI7C,oBAAY,KAAK,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,cAAc,UAAW,KAAK,sBAWnC,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/atom/html/index.native.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { ViewStyle, ImageStyle, TextStyle } from 'react-native';
 export declare type Props = {
     children: string;
@@ -12,6 +12,6 @@ export declare type Props = {
     testID?: string;
     isTextCentered?: boolean;
 };
-declare const Html: (props: Props) => JSX.Element;
+declare const Html: (props: Props) => React.JSX.Element;
 export default Html;
 //# sourceMappingURL=index.native.d.ts.map

package/lib/atom/html/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/html/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAAO,SAAS,EAAE,UAAU,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAqBpE,oBAAY,KAAK,GAAG;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAqBF,QAAA,MAAM,IAAI,UAAW,KAAK,gBA0IzB,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/html/index.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAO,SAAS,EAAE,UAAU,EAAE,SAAS,EAAsB,MAAM,cAAc,CAAC;AAqBzF,oBAAY,KAAK,GAAG;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAqBF,QAAA,MAAM,IAAI,UAAW,KAAK,sBA6IzB,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/atom/html/index.native.js

@@ -16,6 +16,9 @@ const HtmlBase = props => {
 };
 const Html = props => {
   const templateContext = (0, _templateContext.useTemplateContext)();
+  const {
+    width: contentWidth
+  } = (0, _reactNative.useWindowDimensions)();
   const [isDisabledBaseFontStyleColor, disableBaseFontStyleColor] = (0, _react.useState)(false);
   const {
     theme
@@ -31,6 +34,27 @@ const Html = props => {
     isTextCentered,
     numberOfLines
   } = props;
+  let baseFontStyle = (0, _react.useMemo)(() => ({
+    fontSize,
+    color: theme.colors.black
+  }), [fontSize, theme]);
+  if (style) {
+    if (Array.isArray(style)) {
+      const styleObject = style.reduce((result, child) => ({
+        ...result,
+        ...child
+      }));
+      baseFontStyle = {
+        ...baseFontStyle,
+        ...styleObject
+      };
+    } else {
+      baseFontStyle = {
+        ...baseFontStyle,
+        ...style
+      };
+    }
+  }
 
   // Don't use StyleSheet there, it's not a react style
   const styles = {
@@ -53,6 +77,9 @@ const Html = props => {
   };
   const tagsStyles = {
     ...styles,
+    body: {
+      color: baseFontStyle.color
+    },
     h1: {
       fontSize
     },
@@ -76,27 +103,6 @@ const Html = props => {
     },
     img: imageStyle || {}
   };
-  let baseFontStyle = (0, _react.useMemo)(() => ({
-    fontSize,
-    color: theme.colors.black
-  }), [fontSize, theme]);
-  if (style) {
-    if (Array.isArray(style)) {
-      const styleObject = style.reduce((result, child) => ({
-        ...result,
-        ...child
-      }));
-      baseFontStyle = {
-        ...baseFontStyle,
-        ...styleObject
-      };
-    } else {
-      baseFontStyle = {
-        ...baseFontStyle,
-        ...style
-      };
-    }
-  }
   const SpanRenderer = (0, _react.useCallback)((htmlAttribs, _children) => /*#__PURE__*/_react.default.createElement(_index.default, {
     numberOfLines: numberOfLines
   }, _children), [numberOfLines]);
@@ -129,6 +135,7 @@ const Html = props => {
       // eslint-disable-next-line no-nested-ternary
       html: isTextCentered ? `<p>${children}</p>` : numberOfLines ? `<span>${children}</span>` : `${children}`
     },
+    contentWidth: contentWidth,
     tagsStyles: tagsStyles,
     baseFontStyle: {
       ...baseFontStyle,

package/lib/atom/html/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeRenderHtml","_interopRequireDefault","_theme","_templateContext","_index","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","HtmlBase","props","createElement","Html","templateContext","useTemplateContext","isDisabledBaseFontStyleColor","disableBaseFontStyleColor","useState","theme","children","fontSize","containerStyle","imageStyle","style","testID","anchorTextColor","HTML_ANCHOR_TEXT_COLOR","isTextCentered","numberOfLines","styles","p","marginVertical","textAlign","textDecorationLine","fontStyle","b","fontWeight","bold","s","tagsStyles","h1","h2","h3","h4","h5","h6","color","img","baseFontStyle","useMemo","colors","black","Array","isArray","styleObject","reduce","result","child","SpanRenderer","useCallback","htmlAttribs","_children","FontRenderer","key","replace","renderers","font","span","View","source","html","undefined","ignoredStyles","_default","exports"],"sources":["../../../src/atom/html/index.native.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport {View, ViewStyle, ImageStyle, TextStyle} from 'react-native';\nimport RenderHTML, {\n  CustomRendererProps,\n  MixedStyleRecord,\n  RenderHTMLProps,\n  TBlock\n} 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 from '../text/index.native';\n\ninterface CustomRenderHTMLProps extends RenderHTMLProps {\n  baseFontStyle?: TextStyle;\n  testID?: string;\n}\n\nconst HtmlBase = (props: CustomRenderHTMLProps) => {\n  return <RenderHTML {...props} />;\n};\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\ntype Styles = {\n  p: {\n    marginVertical: ViewStyle['marginVertical'];\n    textAlign: TextStyle['textAlign'];\n  };\n  u: {\n    textDecorationLine: TextStyle['textDecorationLine'];\n  };\n  i: {\n    fontStyle: TextStyle['fontStyle'];\n  };\n  b: {\n    fontWeight: TextStyle['fontWeight'];\n  };\n  s: {\n    textDecorationLine: TextStyle['textDecorationLine'];\n  };\n};\n\nconst Html = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const [isDisabledBaseFontStyleColor, disableBaseFontStyleColor] = useState<boolean>(false);\n  const {theme} = 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  } = props;\n\n  // Don't use StyleSheet there, it's not a react style\n  const styles: 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: MixedStyleRecord = {\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: TextStyle = useMemo(\n    () => ({fontSize, color: theme.colors.black}),\n    [fontSize, theme]\n  );\n\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 SpanRenderer = useCallback(\n    (htmlAttribs: CustomRendererProps<TBlock>, _children: string) => (\n      <Text numberOfLines={numberOfLines}>{_children}</Text>\n    ),\n    [numberOfLines]\n  );\n\n  interface HtmlAttrib extends CustomRendererProps<TBlock> {\n    color?: string;\n  }\n\n  const FontRenderer = useCallback(\n    (htmlAttribs: HtmlAttrib, _children: string) => {\n      if (htmlAttribs.color) {\n        disableBaseFontStyleColor(true);\n      }\n\n      return (\n        <Text\n          key={1}\n          style={{\n            ...baseFontStyle,\n            color: htmlAttribs.color?.replace(/ /g, '')\n          }}\n        >\n          {_children}\n        </Text>\n      );\n    },\n    [baseFontStyle]\n  );\n\n  const renderers = {\n    font: FontRenderer,\n    span: SpanRenderer\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: isDisabledBaseFontStyleColor ? undefined : baseFontStyle.color\n        }}\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"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.native.js","names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeRenderHtml","_interopRequireDefault","_theme","_templateContext","_index","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","HtmlBase","props","createElement","Html","templateContext","useTemplateContext","width","contentWidth","useWindowDimensions","isDisabledBaseFontStyleColor","disableBaseFontStyleColor","useState","theme","children","fontSize","containerStyle","imageStyle","style","testID","anchorTextColor","HTML_ANCHOR_TEXT_COLOR","isTextCentered","numberOfLines","baseFontStyle","useMemo","color","colors","black","Array","isArray","styleObject","reduce","result","child","styles","p","marginVertical","textAlign","textDecorationLine","fontStyle","b","fontWeight","bold","s","tagsStyles","body","h1","h2","h3","h4","h5","h6","img","SpanRenderer","useCallback","htmlAttribs","_children","FontRenderer","key","replace","renderers","font","span","View","source","html","undefined","ignoredStyles","_default","exports"],"sources":["../../../src/atom/html/index.native.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport {View, ViewStyle, ImageStyle, TextStyle, useWindowDimensions} from 'react-native';\nimport RenderHTML, {\n  CustomRendererProps,\n  MixedStyleRecord,\n  RenderHTMLProps,\n  TBlock\n} 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 from '../text/index.native';\n\ninterface CustomRenderHTMLProps extends RenderHTMLProps {\n  baseFontStyle?: TextStyle;\n  testID?: string;\n}\n\nconst HtmlBase = (props: CustomRenderHTMLProps) => {\n  return <RenderHTML {...props} />;\n};\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\ntype Styles = {\n  p: {\n    marginVertical: ViewStyle['marginVertical'];\n    textAlign: TextStyle['textAlign'];\n  };\n  u: {\n    textDecorationLine: TextStyle['textDecorationLine'];\n  };\n  i: {\n    fontStyle: TextStyle['fontStyle'];\n  };\n  b: {\n    fontWeight: TextStyle['fontWeight'];\n  };\n  s: {\n    textDecorationLine: TextStyle['textDecorationLine'];\n  };\n};\n\nconst Html = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const {width: contentWidth} = useWindowDimensions();\n  const [isDisabledBaseFontStyleColor, disableBaseFontStyleColor] = useState<boolean>(false);\n  const {theme} = 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  } = props;\n\n  let baseFontStyle: TextStyle = useMemo(\n    () => ({fontSize, color: theme.colors.black}),\n    [fontSize, theme]\n  );\n\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  // Don't use StyleSheet there, it's not a react style\n  const styles: 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    body: {color: baseFontStyle.color},\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  } as MixedStyleRecord;\n\n  const SpanRenderer = useCallback(\n    (htmlAttribs: CustomRendererProps<TBlock>, _children: string) => (\n      <Text numberOfLines={numberOfLines}>{_children}</Text>\n    ),\n    [numberOfLines]\n  );\n\n  interface HtmlAttrib extends CustomRendererProps<TBlock> {\n    color?: string;\n  }\n\n  const FontRenderer = useCallback(\n    (htmlAttribs: HtmlAttrib, _children: string) => {\n      if (htmlAttribs.color) {\n        disableBaseFontStyleColor(true);\n      }\n\n      return (\n        <Text\n          key={1}\n          style={{\n            ...baseFontStyle,\n            color: htmlAttribs.color?.replace(/ /g, '')\n          }}\n        >\n          {_children}\n        </Text>\n      );\n    },\n    [baseFontStyle]\n  );\n\n  const renderers = {\n    font: FontRenderer,\n    span: SpanRenderer\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        contentWidth={contentWidth}\n        tagsStyles={tagsStyles}\n        baseFontStyle={{\n          ...baseFontStyle,\n          color: isDisabledBaseFontStyleColor ? undefined : baseFontStyle.color\n        }}\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"],"mappings":"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","ignoreList":[]}

package/lib/atom/icon/index.d.ts

@@ -33,7 +33,7 @@ export declare const propTypes: {
         wrapperSize: PropTypes.Validator<number>;
     }>>;
     customStyle: PropTypes.Requireable<{
-        [x: string]: NonNullable<string | number | null | undefined> | null | undefined;
+        [x: string]: NonNullable<string | number>;
     }>;
 };
 export default Icon;

package/lib/atom/icon/index.js

@@ -7,7 +7,7 @@ exports.propTypes = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
-var _proSolidSvgIcons = require("@fortawesome/pro-solid-svg-icons");
+var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
 var _fontawesomeSvgCore = require("@fortawesome/fontawesome-svg-core");
 var _toLower = _interopRequireDefault(require("lodash/fp/toLower"));
 var _merge = _interopRequireDefault(require("lodash/fp/merge"));
@@ -16,7 +16,7 @@ var _cssColorFunction = require("css-color-function");
 var _getBackgroundGradientColor = require("../../util/get-background-gradient-color");
 var _style = _interopRequireDefault(require("./style.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-_fontawesomeSvgCore.library.add(_proSolidSvgIcons.fas);
+_fontawesomeSvgCore.library.add(_freeSolidSvgIcons.fas);
 const DEFAULT_PRESET = exports.DEFAULT_PRESET = 'm';
 const ICON_LUMINOSITY = exports.ICON_LUMINOSITY = 32;
 const DEFAULT_WRAPPER_SIZE = exports.DEFAULT_WRAPPER_SIZE = 40;

package/lib/atom/icon/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_propTypes","_reactFontawesome","_proSolidSvgIcons","_fontawesomeSvgCore","_toLower","_merge","_getOr","_cssColorFunction","_getBackgroundGradientColor","_style","e","__esModule","default","library","add","fas","DEFAULT_PRESET","exports","ICON_LUMINOSITY","DEFAULT_WRAPPER_SIZE","ICON_PADDING","DEFAULT_ICON_COLOR","getForegroundColor","backgroundColor","convert","SIZE_CONFIGS","s","faSize","wrapperSize","m","xl","Icon","iconName","iconColor","gradientBackground","borderRadius","preset","size","customStyle","effectiveIconColor","effectiveSize","merge","getOr","toLower","hasBackground","createElement","FontAwesomeIcon","icon","color","fontSize","style","iconWrapperStyle","background","createGradientBackground","width","height","padding","className","iconWrapper","propTypes","PropTypes","string","isRequired","bool","oneOf","shape","number","objectOf","oneOfType","process","env","NODE_ENV","_default"],"sources":["../../../src/atom/icon/index.tsx"],"sourcesContent":["import React, {CSSProperties} from 'react';\nimport PropTypes from 'prop-types';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {IconName, library} from '@fortawesome/fontawesome-svg-core';\nimport toLower from 'lodash/fp/toLower';\nimport merge from 'lodash/fp/merge';\nimport getOr from 'lodash/fp/getOr';\nimport {convert} from 'css-color-function';\nimport {createGradientBackground} from '../../util/get-background-gradient-color';\nimport style from './style.css';\n\nlibrary.add(fas);\n\nexport const DEFAULT_PRESET = 'm';\nexport const ICON_LUMINOSITY = 32;\nexport const DEFAULT_WRAPPER_SIZE = 40;\nexport const ICON_PADDING = 8;\nexport const DEFAULT_ICON_COLOR = 'hsl(0, 0%, 32%)';\n\nexport interface IconSize {\n  faSize: number;\n  wrapperSize: number;\n}\n\nexport interface IconProps {\n  iconName: string;\n  iconColor?: string;\n  backgroundColor?: string;\n  gradientBackground?: boolean;\n  borderRadius?: string;\n  preset?: string;\n  size?: IconSize;\n  customStyle?: CSSProperties;\n}\n\nexport function getForegroundColor(backgroundColor: string): string {\n  return convert(`color(${backgroundColor} lightness(${ICON_LUMINOSITY}%))`);\n}\n\nconst SIZE_CONFIGS: Record<'s' | 'm' | 'xl', IconSize> = {\n  s: {\n    faSize: 12,\n    wrapperSize: 32\n  },\n  m: {\n    faSize: 16,\n    wrapperSize: DEFAULT_WRAPPER_SIZE\n  },\n  xl: {\n    faSize: 20,\n    wrapperSize: 48\n  }\n};\n\nconst Icon: React.FC<IconProps> = ({\n  iconName,\n  iconColor,\n  backgroundColor,\n  gradientBackground,\n  borderRadius,\n  preset = DEFAULT_PRESET,\n  size,\n  customStyle\n}) => {\n  const effectiveIconColor =\n    iconColor || (backgroundColor ? getForegroundColor(backgroundColor) : DEFAULT_ICON_COLOR);\n\n  const effectiveSize = size\n    ? merge(SIZE_CONFIGS[DEFAULT_PRESET], size)\n    : getOr(SIZE_CONFIGS[DEFAULT_PRESET], toLower(preset), SIZE_CONFIGS);\n\n  const hasBackground = backgroundColor || gradientBackground;\n  if (!hasBackground) {\n    return (\n      <FontAwesomeIcon\n        icon={`fa-${iconName}` as IconName}\n        color={effectiveIconColor}\n        fontSize={effectiveSize.faSize}\n        style={customStyle}\n      />\n    );\n  }\n\n  const wrapperSize = effectiveSize.wrapperSize - ICON_PADDING * 2;\n  const iconWrapperStyle: CSSProperties = {\n    background: gradientBackground\n      ? createGradientBackground(effectiveIconColor, '81%', '91%')\n      : backgroundColor,\n    borderRadius,\n    width: wrapperSize,\n    height: wrapperSize,\n    padding: ICON_PADDING\n  };\n\n  return (\n    <div className={style.iconWrapper} style={{...iconWrapperStyle, ...customStyle}}>\n      <FontAwesomeIcon\n        icon={`fa-${iconName}` as IconName}\n        color={effectiveIconColor}\n        fontSize={effectiveSize.faSize}\n      />\n    </div>\n  );\n};\n\nexport const propTypes = {\n  iconName: PropTypes.string.isRequired,\n  iconColor: PropTypes.string,\n  backgroundColor: PropTypes.string,\n  gradientBackground: PropTypes.bool,\n  borderRadius: PropTypes.string,\n  preset: PropTypes.oneOf(['s', 'm', 'xl']),\n  size: PropTypes.shape({\n    faSize: PropTypes.number.isRequired,\n    wrapperSize: PropTypes.number.isRequired\n  }),\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\n// const MemoizedIcon = React.memo(Icon) as React.MemoExoticComponent<React.FC<IconProps>> & {\n//   propTypes?: React.WeakValidationMap<IconProps>;\n//   defaultProps?: Partial<IconProps>;\n// };\n\nIcon.propTypes = propTypes;\n// MemoizedIcon.propTypes = Icon.propTypes;\n\nexport default Icon;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_propTypes","_reactFontawesome","_freeSolidSvgIcons","_fontawesomeSvgCore","_toLower","_merge","_getOr","_cssColorFunction","_getBackgroundGradientColor","_style","e","__esModule","default","library","add","fas","DEFAULT_PRESET","exports","ICON_LUMINOSITY","DEFAULT_WRAPPER_SIZE","ICON_PADDING","DEFAULT_ICON_COLOR","getForegroundColor","backgroundColor","convert","SIZE_CONFIGS","s","faSize","wrapperSize","m","xl","Icon","iconName","iconColor","gradientBackground","borderRadius","preset","size","customStyle","effectiveIconColor","effectiveSize","merge","getOr","toLower","hasBackground","createElement","FontAwesomeIcon","icon","color","fontSize","style","iconWrapperStyle","background","createGradientBackground","width","height","padding","className","iconWrapper","propTypes","PropTypes","string","isRequired","bool","oneOf","shape","number","objectOf","oneOfType","process","env","NODE_ENV","_default"],"sources":["../../../src/atom/icon/index.tsx"],"sourcesContent":["import React, {CSSProperties} from 'react';\nimport PropTypes from 'prop-types';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport {fas} from '@fortawesome/free-solid-svg-icons';\nimport {IconName, library, IconPack} from '@fortawesome/fontawesome-svg-core';\nimport toLower from 'lodash/fp/toLower';\nimport merge from 'lodash/fp/merge';\nimport getOr from 'lodash/fp/getOr';\nimport {convert} from 'css-color-function';\nimport {createGradientBackground} from '../../util/get-background-gradient-color';\nimport style from './style.css';\n\nlibrary.add(fas as IconPack);\n\nexport const DEFAULT_PRESET = 'm';\nexport const ICON_LUMINOSITY = 32;\nexport const DEFAULT_WRAPPER_SIZE = 40;\nexport const ICON_PADDING = 8;\nexport const DEFAULT_ICON_COLOR = 'hsl(0, 0%, 32%)';\n\nexport interface IconSize {\n  faSize: number;\n  wrapperSize: number;\n}\n\nexport interface IconProps {\n  iconName: string;\n  iconColor?: string;\n  backgroundColor?: string;\n  gradientBackground?: boolean;\n  borderRadius?: string;\n  preset?: string;\n  size?: IconSize;\n  customStyle?: CSSProperties;\n}\n\nexport function getForegroundColor(backgroundColor: string): string {\n  return convert(`color(${backgroundColor} lightness(${ICON_LUMINOSITY}%))`);\n}\n\nconst SIZE_CONFIGS: Record<'s' | 'm' | 'xl', IconSize> = {\n  s: {\n    faSize: 12,\n    wrapperSize: 32\n  },\n  m: {\n    faSize: 16,\n    wrapperSize: DEFAULT_WRAPPER_SIZE\n  },\n  xl: {\n    faSize: 20,\n    wrapperSize: 48\n  }\n};\n\nconst Icon: React.FC<IconProps> = ({\n  iconName,\n  iconColor,\n  backgroundColor,\n  gradientBackground,\n  borderRadius,\n  preset = DEFAULT_PRESET,\n  size,\n  customStyle\n}) => {\n  const effectiveIconColor =\n    iconColor || (backgroundColor ? getForegroundColor(backgroundColor) : DEFAULT_ICON_COLOR);\n\n  const effectiveSize = size\n    ? merge(SIZE_CONFIGS[DEFAULT_PRESET], size)\n    : getOr(SIZE_CONFIGS[DEFAULT_PRESET], toLower(preset), SIZE_CONFIGS);\n\n  const hasBackground = backgroundColor || gradientBackground;\n  if (!hasBackground) {\n    return (\n      <FontAwesomeIcon\n        icon={`fa-${iconName}` as IconName}\n        color={effectiveIconColor}\n        fontSize={effectiveSize.faSize}\n        style={customStyle}\n      />\n    );\n  }\n\n  const wrapperSize = effectiveSize.wrapperSize - ICON_PADDING * 2;\n  const iconWrapperStyle: CSSProperties = {\n    background: gradientBackground\n      ? createGradientBackground(effectiveIconColor, '81%', '91%')\n      : backgroundColor,\n    borderRadius,\n    width: wrapperSize,\n    height: wrapperSize,\n    padding: ICON_PADDING\n  };\n\n  return (\n    <div className={style.iconWrapper} style={{...iconWrapperStyle, ...customStyle}}>\n      <FontAwesomeIcon\n        icon={`fa-${iconName}` as IconName}\n        color={effectiveIconColor}\n        fontSize={effectiveSize.faSize}\n      />\n    </div>\n  );\n};\n\nexport const propTypes = {\n  iconName: PropTypes.string.isRequired,\n  iconColor: PropTypes.string,\n  backgroundColor: PropTypes.string,\n  gradientBackground: PropTypes.bool,\n  borderRadius: PropTypes.string,\n  preset: PropTypes.oneOf(['s', 'm', 'xl']),\n  size: PropTypes.shape({\n    faSize: PropTypes.number.isRequired,\n    wrapperSize: PropTypes.number.isRequired\n  }),\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\n// const MemoizedIcon = React.memo(Icon) as React.MemoExoticComponent<React.FC<IconProps>> & {\n//   propTypes?: React.WeakValidationMap<IconProps>;\n//   defaultProps?: Partial<IconProps>;\n// };\n\nIcon.propTypes = propTypes as React.WeakValidationMap<IconProps>;\n// MemoizedIcon.propTypes = Icon.propTypes;\n\nexport default Icon;\n"],"mappings":"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","ignoreList":[]}

package/lib/atom/image-background/index.native.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { ViewStyle, ImageStyle } from 'react-native';
 export declare type Props = ImageStyle & {
     children?: ReactNode;
@@ -10,6 +10,6 @@ export declare type Props = ImageStyle & {
     };
     style?: ViewStyle;
 };
-declare const ImageBackground: ({ source, gradient, gradientStyle, style, testID, ...props }: Props) => JSX.Element;
+declare const ImageBackground: ({ source, gradient, gradientStyle, style, testID, ...props }: Props) => React.JSX.Element;
 export default ImageBackground;
 //# sourceMappingURL=index.native.d.ts.map

package/lib/atom/image-background/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/image-background/index.native.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACvC,OAAO,EAGL,SAAS,EACT,UAAU,EACX,MAAM,cAAc,CAAC;AAiBtB,oBAAY,KAAK,GAAG,UAAU,GAAG;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACzB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;KAAC,CAAC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,eAAe,iEAOlB,KAAK,gBAgDP,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/image-background/index.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACvC,OAAO,EAIL,SAAS,EACT,UAAU,EACX,MAAM,cAAc,CAAC;AAiBtB,oBAAY,KAAK,GAAG,UAAU,GAAG;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACzB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;KAAC,CAAC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,eAAe,iEAOlB,KAAK,sBAgDP,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/atom/image-background/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["_react","_interopRequireDefault","require","_reactNative","_getCleanUri","_getResizedImage","_index","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","styles","StyleSheet","create","image","width","height","gradient","flex","ImageBackground","source","gradientStyle","style","testID","props","uri","_width","_height","resizeMode","flatten","maxHeight","undefined","maxWidth","getResizedImage","getCleanUri","resizedSource","children","remainingProps","_style","push","createElement","colors","_default","exports"],"sources":["../../../src/atom/image-background/index.native.tsx"],"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  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"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.native.js","names":["_react","_interopRequireDefault","require","_reactNative","_getCleanUri","_getResizedImage","_index","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","styles","StyleSheet","create","image","width","height","gradient","flex","ImageBackground","source","gradientStyle","style","testID","props","uri","_width","_height","resizeMode","flatten","maxHeight","undefined","maxWidth","getResizedImage","getCleanUri","resizedSource","children","remainingProps","_style","push","createElement","colors","_default","exports"],"sources":["../../../src/atom/image-background/index.native.tsx"],"sourcesContent":["import React, {ReactNode} from 'react';\nimport {\n  ImageBackground as ImageBackgroundBase,\n  ImageBackgroundProps,\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  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 as ImageBackgroundProps)}\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 as ImageBackgroundProps)}\n      source={resizedSource}\n      style={[styles.image, style]}\n      testID={testID}\n    />\n  );\n};\n\nexport default ImageBackground;\n"],"mappings":"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","ignoreList":[]}

package/lib/atom/input-checkbox/index.d.ts

@@ -1,5 +1,5 @@
 export default InputCheckbox;
-declare function InputCheckbox(props: any): JSX.Element;
+declare function InputCheckbox(props: any): React.JSX.Element;
 declare namespace InputCheckbox {
     namespace propTypes {
         const title: PropTypes.Validator<string>;
@@ -14,5 +14,6 @@ declare namespace InputCheckbox {
         const titleStyle: PropTypes.Requireable<string>;
     }
 }
+import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/lib/atom/input-checkbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-checkbox/index.js"],"names":[],"mappings":";AAeA,wDAwDC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-checkbox/index.js"],"names":[],"mappings":";AAeA,8DAwDC"}

package/lib/atom/input-color/index.d.ts

@@ -1,5 +1,5 @@
 export default InputColor;
-declare function InputColor(props: any): JSX.Element;
+declare function InputColor(props: any): React.JSX.Element;
 declare namespace InputColor {
     namespace propTypes {
         const title: PropTypes.Validator<string>;
@@ -13,5 +13,6 @@ declare namespace InputColor {
         const modified: PropTypes.Requireable<boolean>;
     }
 }
+import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/lib/atom/input-color/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-color/index.js"],"names":[],"mappings":";AAMA,qDAsCC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-color/index.js"],"names":[],"mappings":";AAMA,2DAsCC"}

package/lib/atom/input-doublestep/index.d.ts

@@ -1,7 +1,7 @@
 export default InputDoublestep;
 declare class InputDoublestep extends React.Component<any, any, any> {
     static propTypes: {
-        description?: PropTypes.Requireable<string> | undefined;
+        description?: PropTypes.Requireable<string>;
         toggleValue: PropTypes.Validator<string>;
         onClick: PropTypes.Validator<(...args: any[]) => any>;
         onOpenConfirmation: PropTypes.Requireable<(...args: any[]) => any>;
@@ -14,7 +14,7 @@ declare class InputDoublestep extends React.Component<any, any, any> {
     };
     handleToggle(): void;
     handleOnClick(e: any): any;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 import React from "react";
 import PropTypes from "prop-types";

package/lib/atom/input-doublestep/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-doublestep/index.js"],"names":[],"mappings":";AAwGA;IACE;;;;;;;MAOE;IAEF,sCAOC;IALC;;MAEC;IAKH,qBAQC;IAED,2BAKC;IAED,sBAuCC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-doublestep/index.js"],"names":[],"mappings":";AAwGA;IACE;;;;;;;MAOE;IAEF,sCAOC;IALC;;MAEC;IAKH,qBAQC;IAED,2BAKC;IAED,4BAuCC;CACF"}

package/lib/atom/input-file-draggable/index.d.ts

@@ -7,32 +7,32 @@ declare function InputFileDraggable({ title, description, previewLabel, previewC
     uploadLabel: any;
     loading: any;
     modified: any;
-    disabled?: boolean | undefined;
-    disableHoverTooltip?: boolean | undefined;
+    disabled?: boolean;
+    disableHoverTooltip?: boolean;
     onChange: any;
-    onReset?: null | undefined;
+    onReset?: any;
     name: any;
     labelLink: any;
     labelButtonLink: any;
     hrefLink: any;
-    filesTypes?: string | undefined;
-    error?: string | undefined;
+    filesTypes?: string;
+    error?: string;
     buttonAriaLabel: any;
     errorButtonLabel: any;
     pdfButtonLabel: any;
     pdfButtonAriaLabel: any;
-    filesNumber?: number | undefined;
-    multiple?: boolean | undefined;
-    required?: boolean | undefined;
+    filesNumber?: number;
+    multiple?: boolean;
+    required?: boolean;
     onClick: any;
-}): JSX.Element;
+}): React.JSX.Element;
 declare namespace InputFileDraggable {
     const propTypes: {
         disableHoverTooltip: PropTypes.Requireable<boolean>;
         name: PropTypes.Requireable<string>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         onReset: PropTypes.Requireable<(...args: any[]) => any>;
-        filesTypes: (props: any, propName: any, componentName: any) => Error | null;
+        filesTypes: (props: any, propName: any, componentName: any) => Error;
         error: PropTypes.Requireable<string>;
         buttonAriaLabel: PropTypes.Requireable<string>;
         errorButtonLabel: PropTypes.Requireable<string>;
@@ -56,5 +56,6 @@ declare namespace InputFileDraggable {
         multiple: PropTypes.Requireable<boolean>;
     };
 }
+import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/lib/atom/input-file-draggable/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-file-draggable/index.js"],"names":[],"mappings":";AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;gBA+GC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-file-draggable/index.js"],"names":[],"mappings":";AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;sBA+GC"}

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

@@ -1,5 +1,5 @@
 export default InputHtml;
-declare function InputHtml(props: any, legacyContext: any): JSX.Element;
+declare function InputHtml(props: any, legacyContext: any): React.JSX.Element;
 declare namespace InputHtml {
     namespace propTypes {
         const title: PropTypes.Requireable<string>;
@@ -34,5 +34,6 @@ declare namespace InputHtml {
         }>>;
     }
 }
+import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/index.js"],"names":[],"mappings":";AAYA,wEA4DC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/index.js"],"names":[],"mappings":";AAYA,8EA4DC"}

package/lib/atom/input-html/input-preview.d.ts

@@ -1,5 +1,5 @@
 export default InputPreview;
-declare function InputPreview(props: any, context: any): JSX.Element;
+declare function InputPreview(props: any, context: any): React.JSX.Element;
 declare namespace InputPreview {
     namespace propTypes {
         const text: PropTypes.Validator<string>;
@@ -11,5 +11,6 @@ declare namespace InputPreview {
         const className: PropTypes.Requireable<string>;
     }
 }
+import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=input-preview.d.ts.map

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

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

package/lib/atom/input-readonly/index.d.ts

@@ -1,5 +1,5 @@
 export default InputReadonly;
-declare function InputReadonly(props: any): JSX.Element;
+declare function InputReadonly(props: any): React.JSX.Element;
 declare namespace InputReadonly {
     namespace propTypes {
         const title: PropTypes.Validator<string>;
@@ -7,5 +7,6 @@ declare namespace InputReadonly {
         const description: PropTypes.Requireable<string>;
     }
 }
+import React from "react";
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/lib/atom/input-readonly/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-readonly/index.js"],"names":[],"mappings":";AAIA,wDAUC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-readonly/index.js"],"names":[],"mappings":";AAIA,8DAUC"}