@ovotech/element-native 2.0.0-beta.1 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/components/Notification/Notification.d.ts +1 -1
  2. package/dist/components/Notification/Notification.js +29 -26
  3. package/dist/components/SkeletonLoading/Skeleton.js +4 -24
  4. package/dist/components/Text/Text.js +1 -1
  5. package/dist/esm/components/Notification/Notification.js +29 -26
  6. package/dist/esm/components/SkeletonLoading/Skeleton.js +2 -2
  7. package/dist/esm/components/Text/Text.js +1 -1
  8. package/dist/esm/theme/create-theme.js +2 -2
  9. package/dist/theme/create-theme.js +2 -2
  10. package/package.json +1 -1
package/dist/components/Notification/Notification.d.ts CHANGED
@@ -18,7 +18,7 @@ export declare const NotificationTitleBox: import("styled-components").StyledCom
18
18
  } & Breakpoints, never>;
19
19
  export declare const Notification: React.ForwardRefExoticComponent<{
20
20
  variant?: (string & {}) | NotificationVariantName | undefined;
21
- title?: ReactNode;
21
+ title?: ReactNode | string;
22
22
  noMargin?: boolean | undefined;
23
23
  children?: ReactNode;
24
24
  dismissable?: boolean | undefined;
package/dist/components/Notification/Notification.js CHANGED
@@ -61,7 +61,7 @@ var NotificationBox = styled_native_1.default.View(function (_a) {
61
61
  var _b = _a.theme, notification = _b.notification, space = _b.space, variant = _a.variant, noMargin = _a.noMargin;
62
62
  // @ts-ignore
63
63
  var currentVariant = notification.variants[variant];
64
- return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "], ["\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "])), notification.borderWidth, currentVariant.borderColor, notification.borderRadius, noMargin ? 0 : space[4]);
64
+ return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "], ["\n position: relative;\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "])), notification.borderWidth, currentVariant.borderColor, notification.borderRadius, noMargin ? 0 : space[4]);
65
65
  });
66
66
  exports.NotificationContentBox = styled_native_1.default.View(function (_a) {
67
67
  var _b = _a.theme, colors = _b.colors, _c = _b.notification, paddingX = _c.paddingX, paddingY = _c.paddingY, variants = _c.variants, smallAndUp = _a.smallAndUp, variant = _a.variant;
@@ -78,46 +78,49 @@ exports.NotificationTitleBox = styled_native_1.default.View(function (_a) {
78
78
  pxToNumber(notification.dismiss.size))
79
79
  : notification.paddingY[smallAndUp ? 1 : 0]);
80
80
  });
81
- var NotificationTitle = styled_native_1.default.Text(function (_a) {
81
+ var NotificationTitleText = styled_native_1.default.Text(function (_a) {
82
82
  var _b = _a.theme, fonts = _b.fonts, fontWeights = _b.fontWeights, responsiveFontSizes = _b.responsiveFontSizes, notification = _b.notification, variant = _a.variant;
83
83
  // @ts-ignore
84
84
  var currentVariant = notification.variants[variant];
85
85
  return (0, styled_native_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "], ["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "])), currentVariant.textColor, fonts.bold, fontWeights.bold, responsiveFontSizes.body[0]);
86
86
  });
87
+ var NotificationTitleView = styled_native_1.default.View(function (_a) {
88
+ var _b = _a.theme, fonts = _b.fonts, fontWeights = _b.fontWeights, responsiveFontSizes = _b.responsiveFontSizes, notification = _b.notification, variant = _a.variant;
89
+ // @ts-ignore
90
+ var currentVariant = notification.variants[variant];
91
+ return (0, styled_native_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "], ["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "])), currentVariant.textColor, fonts.bold, fontWeights.bold, responsiveFontSizes.body[0]);
92
+ });
87
93
  var DismissButton = styled_native_1.default.TouchableOpacity(function (_a) {
88
94
  var notification = _a.theme.notification;
89
- return (0, styled_native_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "], ["\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "])), notification.dismiss.touchSize, notification.dismiss.touchSize);
95
+ return (0, styled_native_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "], ["\n position: absolute;\n top: 0;\n right: 0;\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "])), notification.dismiss.touchSize, notification.dismiss.touchSize);
90
96
  });
91
97
  exports.Notification = (0, react_1.forwardRef)(function (_a, ref) {
92
- var _b = _a.variant, variant = _b === void 0 ? 'info' : _b, children = _a.children, _c = _a.title, title = _c === void 0 ? 'Info' : _c, noMargin = _a.noMargin, dismissable = _a.dismissable, onDismiss = _a.onDismiss, rest = __rest(_a, ["variant", "children", "title", "noMargin", "dismissable", "onDismiss"]);
98
+ var _b = _a.variant, variant = _b === void 0 ? 'info' : _b, children = _a.children, title = _a.title, noMargin = _a.noMargin, dismissable = _a.dismissable, onDismiss = _a.onDismiss, rest = __rest(_a, ["variant", "children", "title", "noMargin", "dismissable", "onDismiss"]);
93
99
  var breakpoints = (0, hooks_1.useBreakpoint)();
94
100
  var theme = (0, react_1.useContext)(styled_native_1.ThemeContext);
95
- var _d = (0, react_1.useState)(false), dismissed = _d[0], setDismissed = _d[1];
96
- if (dismissed) {
101
+ var _c = (0, react_1.useState)(false), dismissed = _c[0], setDismissed = _c[1];
102
+ if (dismissed || (!title && !children)) {
97
103
  return null;
98
104
  }
99
- var renderDismissButton = function () {
100
- if (!dismissable)
101
- return null;
102
- return (react_1.default.createElement(DismissButton, { accessibilityLabel: "Dismiss", testID: "nb-notification-dismiss", onPress: function () {
103
- setDismissed(true);
104
- if (onDismiss) {
105
- onDismiss();
106
- }
107
- } },
108
- react_1.default.createElement(Icon_1.Icon, { name: theme.notification.dismiss.icon, size: theme.notification.dismiss.size,
109
- // @ts-ignore
110
- color: theme.notification.variants[variant].textColor })));
111
- };
105
+ var TitleComponent = typeof title === 'string' ? NotificationTitleText : NotificationTitleView;
112
106
  return (react_1.default.createElement(react_native_1.View, __assign({ ref: ref }, rest),
113
107
  react_1.default.createElement(NotificationBox, __assign({ variant: variant, noMargin: noMargin, testID: "nb-notification" }, breakpoints),
114
- react_1.default.createElement(exports.NotificationTitleBox, __assign({ variant: variant, "data-testid": "nb-notification-box", dismissable: dismissable }, breakpoints),
115
- react_1.default.createElement(NotificationTitle, { variant: variant }, title),
116
- renderDismissButton()),
117
- children ? (react_1.default.createElement(exports.NotificationContentBox, __assign({ variant: variant }, breakpoints), children)) : null)));
108
+ title ? (react_1.default.createElement(exports.NotificationTitleBox, __assign({ variant: variant, dismissable: dismissable }, breakpoints),
109
+ react_1.default.createElement(TitleComponent, { variant: variant }, title),
110
+ ";")) : null,
111
+ dismissable ? (react_1.default.createElement(DismissButton, { accessibilityLabel: "Dismiss", testID: "nb-notification-dismiss", onPress: function () {
112
+ setDismissed(true);
113
+ if (onDismiss) {
114
+ onDismiss();
115
+ }
116
+ } },
117
+ react_1.default.createElement(Icon_1.Icon, { name: theme.notification.dismiss.icon, size: theme.notification.dismiss.size,
118
+ // @ts-ignore
119
+ color: theme.notification.variants[variant].textColor }))) : null,
120
+ children ? (react_1.default.createElement(exports.NotificationContentBox, __assign({ "data-testid": "el-notification-box", variant: variant }, breakpoints), children)) : null)));
118
121
  });
119
122
  exports.ErrorNotification = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(exports.Notification, __assign({ ref: ref, variant: "error", title: "Oops, there\u2019s a problem\u2026" }, props))); });
120
- exports.SuccessNotification = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(exports.Notification, __assign({ title: "Success", ref: ref, variant: "success" }, props))); });
123
+ exports.SuccessNotification = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(exports.Notification, __assign({ ref: ref, variant: "success" }, props))); });
121
124
  exports.InfoNotification = (0, react_1.forwardRef)(function (props, ref) { return react_1.default.createElement(exports.Notification, __assign({ ref: ref, variant: "info" }, props)); });
122
- exports.WarningNotification = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(exports.Notification, __assign({ title: "Warning", ref: ref, variant: "warning" }, props))); });
123
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
125
+ exports.WarningNotification = (0, react_1.forwardRef)(function (props, ref) { return react_1.default.createElement(exports.Notification, __assign({ ref: ref, variant: "warning" }, props)); });
126
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
package/dist/components/SkeletonLoading/Skeleton.js CHANGED
@@ -3,31 +3,11 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
3
3
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
4
  return cooked;
5
5
  };
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
6
+ var __importDefault = (this && this.__importDefault) || function (mod) {
7
+ return (mod && mod.__esModule) ? mod : { "default": mod };
28
8
  };
29
9
  Object.defineProperty(exports, "__esModule", { value: true });
30
10
  exports.Skeleton = void 0;
31
- var styled_native_1 = __importStar(require("../../styled.native"));
32
- exports.Skeleton = styled_native_1.default.View(function () { return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n overflow: hidden;\n display: flex;\n\n &:after {\n content: '';\n position: absolute;\n opacity: 0.6;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background: linear-gradient(\n 90deg,\n rgba(255, 255, 255, 0) 0%,\n rgba(255, 255, 255, 1) 50%,\n rgba(255, 255, 255, 0) 100%\n );\n background-size: 100px;\n background-repeat: no-repeat;\n }\n "], ["\n position: relative;\n overflow: hidden;\n display: flex;\n\n &:after {\n content: '';\n position: absolute;\n opacity: 0.6;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background: linear-gradient(\n 90deg,\n rgba(255, 255, 255, 0) 0%,\n rgba(255, 255, 255, 1) 50%,\n rgba(255, 255, 255, 0) 100%\n );\n background-size: 100px;\n background-repeat: no-repeat;\n }\n "]))); });
11
+ var styled_native_1 = __importDefault(require("../../styled.native"));
12
+ exports.Skeleton = styled_native_1.default.View(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
33
13
  var templateObject_1;
package/dist/components/Text/Text.js CHANGED
@@ -72,7 +72,7 @@ exports.Strong = styled_native_1.default.Text(function (_a) {
72
72
  var text = _a.theme.text;
73
73
  return "\n font-family: ".concat(text.strong.fontFamily, ";\n font-weight: ").concat(text.strong.fontWeight, ";\n ");
74
74
  });
75
- exports.Em = styled_native_1.default.Text(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-style: italic;\n"], ["\n font-style: italic;\n"])));
75
+ exports.Em = styled_native_1.default.Text(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-family: 'System font';\n font-style: italic;\n"], ["\n font-family: 'System font';\n font-style: italic;\n"])));
76
76
  exports.LineThrough = styled_native_1.default.Text(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n text-decoration: line-through;\n"], ["\n text-decoration: line-through;\n"])));
77
77
  var TextGroup = function (_a) {
78
78
  var children = _a.children, rest = __rest(_a, ["children"]);
package/dist/esm/components/Notification/Notification.js CHANGED
@@ -35,7 +35,7 @@ var NotificationBox = styled.View(function (_a) {
35
35
  var _b = _a.theme, notification = _b.notification, space = _b.space, variant = _a.variant, noMargin = _a.noMargin;
36
36
  // @ts-ignore
37
37
  var currentVariant = notification.variants[variant];
38
- return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "], ["\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "])), notification.borderWidth, currentVariant.borderColor, notification.borderRadius, noMargin ? 0 : space[4]);
38
+ return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "], ["\n position: relative;\n border: ", " solid ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n "])), notification.borderWidth, currentVariant.borderColor, notification.borderRadius, noMargin ? 0 : space[4]);
39
39
  });
40
40
  export var NotificationContentBox = styled.View(function (_a) {
41
41
  var _b = _a.theme, colors = _b.colors, _c = _b.notification, paddingX = _c.paddingX, paddingY = _c.paddingY, variants = _c.variants, smallAndUp = _a.smallAndUp, variant = _a.variant;
@@ -52,46 +52,49 @@ export var NotificationTitleBox = styled.View(function (_a) {
52
52
  pxToNumber(notification.dismiss.size))
53
53
  : notification.paddingY[smallAndUp ? 1 : 0]);
54
54
  });
55
- var NotificationTitle = styled.Text(function (_a) {
55
+ var NotificationTitleText = styled.Text(function (_a) {
56
56
  var _b = _a.theme, fonts = _b.fonts, fontWeights = _b.fontWeights, responsiveFontSizes = _b.responsiveFontSizes, notification = _b.notification, variant = _a.variant;
57
57
  // @ts-ignore
58
58
  var currentVariant = notification.variants[variant];
59
59
  return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "], ["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "])), currentVariant.textColor, fonts.bold, fontWeights.bold, responsiveFontSizes.body[0]);
60
60
  });
61
+ var NotificationTitleView = styled.View(function (_a) {
62
+ var _b = _a.theme, fonts = _b.fonts, fontWeights = _b.fontWeights, responsiveFontSizes = _b.responsiveFontSizes, notification = _b.notification, variant = _a.variant;
63
+ // @ts-ignore
64
+ var currentVariant = notification.variants[variant];
65
+ return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "], ["\n color: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n "])), currentVariant.textColor, fonts.bold, fontWeights.bold, responsiveFontSizes.body[0]);
66
+ });
61
67
  var DismissButton = styled.TouchableOpacity(function (_a) {
62
68
  var notification = _a.theme.notification;
63
- return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "], ["\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "])), notification.dismiss.touchSize, notification.dismiss.touchSize);
69
+ return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "], ["\n position: absolute;\n top: 0;\n right: 0;\n width: ", ";\n height: ", ";\n align-items: center;\n justify-content: center;\n "])), notification.dismiss.touchSize, notification.dismiss.touchSize);
64
70
  });
65
71
  export var Notification = forwardRef(function (_a, ref) {
66
- var _b = _a.variant, variant = _b === void 0 ? 'info' : _b, children = _a.children, _c = _a.title, title = _c === void 0 ? 'Info' : _c, noMargin = _a.noMargin, dismissable = _a.dismissable, onDismiss = _a.onDismiss, rest = __rest(_a, ["variant", "children", "title", "noMargin", "dismissable", "onDismiss"]);
72
+ var _b = _a.variant, variant = _b === void 0 ? 'info' : _b, children = _a.children, title = _a.title, noMargin = _a.noMargin, dismissable = _a.dismissable, onDismiss = _a.onDismiss, rest = __rest(_a, ["variant", "children", "title", "noMargin", "dismissable", "onDismiss"]);
67
73
  var breakpoints = useBreakpoint();
68
74
  var theme = useContext(ThemeContext);
69
- var _d = useState(false), dismissed = _d[0], setDismissed = _d[1];
70
- if (dismissed) {
75
+ var _c = useState(false), dismissed = _c[0], setDismissed = _c[1];
76
+ if (dismissed || (!title && !children)) {
71
77
  return null;
72
78
  }
73
- var renderDismissButton = function () {
74
- if (!dismissable)
75
- return null;
76
- return (React.createElement(DismissButton, { accessibilityLabel: "Dismiss", testID: "nb-notification-dismiss", onPress: function () {
77
- setDismissed(true);
78
- if (onDismiss) {
79
- onDismiss();
80
- }
81
- } },
82
- React.createElement(Icon, { name: theme.notification.dismiss.icon, size: theme.notification.dismiss.size,
83
- // @ts-ignore
84
- color: theme.notification.variants[variant].textColor })));
85
- };
79
+ var TitleComponent = typeof title === 'string' ? NotificationTitleText : NotificationTitleView;
86
80
  return (React.createElement(View, __assign({ ref: ref }, rest),
87
81
  React.createElement(NotificationBox, __assign({ variant: variant, noMargin: noMargin, testID: "nb-notification" }, breakpoints),
88
- React.createElement(NotificationTitleBox, __assign({ variant: variant, "data-testid": "nb-notification-box", dismissable: dismissable }, breakpoints),
89
- React.createElement(NotificationTitle, { variant: variant }, title),
90
- renderDismissButton()),
91
- children ? (React.createElement(NotificationContentBox, __assign({ variant: variant }, breakpoints), children)) : null)));
82
+ title ? (React.createElement(NotificationTitleBox, __assign({ variant: variant, dismissable: dismissable }, breakpoints),
83
+ React.createElement(TitleComponent, { variant: variant }, title),
84
+ ";")) : null,
85
+ dismissable ? (React.createElement(DismissButton, { accessibilityLabel: "Dismiss", testID: "nb-notification-dismiss", onPress: function () {
86
+ setDismissed(true);
87
+ if (onDismiss) {
88
+ onDismiss();
89
+ }
90
+ } },
91
+ React.createElement(Icon, { name: theme.notification.dismiss.icon, size: theme.notification.dismiss.size,
92
+ // @ts-ignore
93
+ color: theme.notification.variants[variant].textColor }))) : null,
94
+ children ? (React.createElement(NotificationContentBox, __assign({ "data-testid": "el-notification-box", variant: variant }, breakpoints), children)) : null)));
92
95
  });
93
96
  export var ErrorNotification = forwardRef(function (props, ref) { return (React.createElement(Notification, __assign({ ref: ref, variant: "error", title: "Oops, there\u2019s a problem\u2026" }, props))); });
94
- export var SuccessNotification = forwardRef(function (props, ref) { return (React.createElement(Notification, __assign({ title: "Success", ref: ref, variant: "success" }, props))); });
97
+ export var SuccessNotification = forwardRef(function (props, ref) { return (React.createElement(Notification, __assign({ ref: ref, variant: "success" }, props))); });
95
98
  export var InfoNotification = forwardRef(function (props, ref) { return React.createElement(Notification, __assign({ ref: ref, variant: "info" }, props)); });
96
- export var WarningNotification = forwardRef(function (props, ref) { return (React.createElement(Notification, __assign({ title: "Warning", ref: ref, variant: "warning" }, props))); });
97
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
99
+ export var WarningNotification = forwardRef(function (props, ref) { return React.createElement(Notification, __assign({ ref: ref, variant: "warning" }, props)); });
100
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
package/dist/esm/components/SkeletonLoading/Skeleton.js CHANGED
@@ -2,6 +2,6 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
2
2
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
3
  return cooked;
4
4
  };
5
- import styled, { css } from '../../styled.native';
6
- export var Skeleton = styled.View(function () { return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n overflow: hidden;\n display: flex;\n\n &:after {\n content: '';\n position: absolute;\n opacity: 0.6;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background: linear-gradient(\n 90deg,\n rgba(255, 255, 255, 0) 0%,\n rgba(255, 255, 255, 1) 50%,\n rgba(255, 255, 255, 0) 100%\n );\n background-size: 100px;\n background-repeat: no-repeat;\n }\n "], ["\n position: relative;\n overflow: hidden;\n display: flex;\n\n &:after {\n content: '';\n position: absolute;\n opacity: 0.6;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background: linear-gradient(\n 90deg,\n rgba(255, 255, 255, 0) 0%,\n rgba(255, 255, 255, 1) 50%,\n rgba(255, 255, 255, 0) 100%\n );\n background-size: 100px;\n background-repeat: no-repeat;\n }\n "]))); });
5
+ import styled from '../../styled.native';
6
+ export var Skeleton = styled.View(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
7
7
  var templateObject_1;
package/dist/esm/components/Text/Text.js CHANGED
@@ -46,7 +46,7 @@ export var Strong = styled.Text(function (_a) {
46
46
  var text = _a.theme.text;
47
47
  return "\n font-family: ".concat(text.strong.fontFamily, ";\n font-weight: ").concat(text.strong.fontWeight, ";\n ");
48
48
  });
49
- export var Em = styled.Text(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-style: italic;\n"], ["\n font-style: italic;\n"])));
49
+ export var Em = styled.Text(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-family: 'System font';\n font-style: italic;\n"], ["\n font-family: 'System font';\n font-style: italic;\n"])));
50
50
  export var LineThrough = styled.Text(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n text-decoration: line-through;\n"], ["\n text-decoration: line-through;\n"])));
51
51
  export var TextGroup = function (_a) {
52
52
  var children = _a.children, rest = __rest(_a, ["children"]);
package/dist/esm/theme/create-theme.js CHANGED
@@ -130,7 +130,7 @@ export var defaultTokens = {
130
130
  small: ['14px', '14px'],
131
131
  body: ['16px', '16px'],
132
132
  level1: ['28px', '48px'],
133
- level2: ['24px', '36px'],
133
+ level2: ['24px', '32px'],
134
134
  level3: ['20px', '28px'],
135
135
  level4: ['16px', '22px'],
136
136
  lead: ['18px', '22px'],
@@ -140,7 +140,7 @@ export var defaultTokens = {
140
140
  small: ['20px', '20px'],
141
141
  body: ['24px', '24px'],
142
142
  level1: ['36px', '52px'],
143
- level2: ['32px', '44px'],
143
+ level2: ['32px', '40px'],
144
144
  level3: ['24px', '36px'],
145
145
  level4: ['20px', '28px'],
146
146
  lead: ['24px', '28px'],
package/dist/theme/create-theme.js CHANGED
@@ -136,7 +136,7 @@ exports.defaultTokens = {
136
136
  small: ['14px', '14px'],
137
137
  body: ['16px', '16px'],
138
138
  level1: ['28px', '48px'],
139
- level2: ['24px', '36px'],
139
+ level2: ['24px', '32px'],
140
140
  level3: ['20px', '28px'],
141
141
  level4: ['16px', '22px'],
142
142
  lead: ['18px', '22px'],
@@ -146,7 +146,7 @@ exports.defaultTokens = {
146
146
  small: ['20px', '20px'],
147
147
  body: ['24px', '24px'],
148
148
  level1: ['36px', '52px'],
149
- level2: ['32px', '44px'],
149
+ level2: ['32px', '40px'],
150
150
  level3: ['24px', '36px'],
151
151
  level4: ['20px', '28px'],
152
152
  lead: ['24px', '28px'],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ovotech/element-native",
3
- "version": "2.0.0-beta.1",
3
+ "version": "2.0.1",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/index.d.ts",