@ovotech/element-native 4.3.0-canary-3908de8-301 → 4.3.0-canary-cfd4e2d-302

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 (9) hide show
  1. package/dist/components/Badge/Badge.js +1 -1
  2. package/dist/components/ErrorText/ErrorText.js +1 -1
  3. package/dist/components/HintText/HintText.js +1 -1
  4. package/dist/components/SegmentedControls/components/SegmentButton.js +5 -3
  5. package/dist/esm/components/Badge/Badge.js +1 -1
  6. package/dist/esm/components/ErrorText/ErrorText.js +1 -1
  7. package/dist/esm/components/HintText/HintText.js +1 -1
  8. package/dist/esm/components/SegmentedControls/components/SegmentButton.js +5 -3
  9. package/package.json +2 -2
package/dist/components/Badge/Badge.js CHANGED
@@ -69,7 +69,7 @@ var StyledBadge = styled_native_1.default.View(function (_a) {
69
69
  surface = customVariant.backgroundColor;
70
70
  message = customVariant.foregroundColor;
71
71
  }
72
- return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding: 0 ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "], ["\n padding: 0 ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "])), (0, element_core_1.numToPx)(core.space[2]), (0, element_core_1.numToPx)(core.borderWidth.medium), core.color.brand.white, inverted ? message : surface);
72
+ return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding: 2px ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "], ["\n padding: 2px ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "])), (0, element_core_1.numToPx)(core.space[2]), (0, element_core_1.numToPx)(core.borderWidth.medium), core.color.brand.white, inverted ? message : surface);
73
73
  });
74
74
  var StyledBadgeText = styled_native_1.default.Text(function (_a) {
75
75
  var _b = _a.theme, core = _b.core, semantic = _b.semantic, component = _b.component, _c = _a.variant, variant = _c === void 0 ? 'info' : _c, _d = _a.inverted, inverted = _d === void 0 ? false : _d, customVariant = _a.customVariant;
package/dist/components/ErrorText/ErrorText.js CHANGED
@@ -36,7 +36,7 @@ var StyledErrorText = styled_native_1.default.Text(function (_a) {
36
36
  var fontSize = smallAndUp
37
37
  ? core.fontSize.body.large
38
38
  : core.fontSize.body.small;
39
- return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n line-height: ", ";\n font-size: ", ";\n color: ", ";\n "], ["\n font-family: ", ";\n line-height: ", ";\n font-size: ", ";\n color: ", ";\n "])), core.fontFamily.body.native, (0, element_core_1.numToPx)(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), (0, element_core_1.numToPx)(fontSize), semantic.message.error);
39
+ return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "], ["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "])), (0, element_core_1.numToPx)(core.space[1]), (0, element_core_1.numToPx)(core.space[1]), core.fontFamily.body.native, (0, element_core_1.numToPx)(fontSize), (0, element_core_1.numToPx)(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), semantic.message.error);
40
40
  });
41
41
  var ErrorText = (0, utils_1.styledComponentWithBreakpoints)(StyledErrorText);
42
42
  exports.ErrorText = ErrorText;
package/dist/components/HintText/HintText.js CHANGED
@@ -36,7 +36,7 @@ var StyledHintText = styled_native_1.default.Text(function (_a) {
36
36
  var fontSize = smallAndUp
37
37
  ? core.fontSize.body.large
38
38
  : core.fontSize.body.small;
39
- return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "], ["\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "])), core.fontFamily.body.native, (0, element_core_1.numToPx)(fontSize), (0, element_core_1.numToPx)(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), semantic.border.functional);
39
+ return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "], ["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "])), (0, element_core_1.numToPx)(core.space[1]), (0, element_core_1.numToPx)(core.space[1]), core.fontFamily.body.native, (0, element_core_1.numToPx)(fontSize), (0, element_core_1.numToPx)(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), semantic.border.functional);
40
40
  });
41
41
  var HintText = (0, utils_1.styledComponentWithBreakpoints)(StyledHintText);
42
42
  exports.HintText = HintText;
package/dist/components/SegmentedControls/components/SegmentButton.js CHANGED
@@ -79,15 +79,17 @@ var SegmentButton = function (_a) {
79
79
  }, style: {
80
80
  flexGrow: inline || multipleRows ? undefined : 1,
81
81
  width: inline || multipleRows ? 'auto' : "".concat(100 / segmentCount, "%"),
82
- }, testID: testID, children: (0, jsx_runtime_1.jsxs)(SSegmentsWrapper, { "$isSelected": isSelected, "$size": size, children: [(0, jsx_runtime_1.jsx)(SSegmentText, { style: {
82
+ }, testID: testID, children: (0, jsx_runtime_1.jsxs)(SSegmentsWrapper, { "$isSelected": isSelected, "$size": size, multiline: multipleRows, children: [(0, jsx_runtime_1.jsx)(SSegmentText, { style: {
83
83
  opacity: 0,
84
84
  fontWeight: '900',
85
85
  }, "$isSelected": false, children: label }), (0, jsx_runtime_1.jsx)(SSegmentText, { style: animatedStyleNormal, "$isSelected": false, numberOfLines: 1, adjustsFontSizeToFit: true, children: label }), (0, jsx_runtime_1.jsx)(SSegmentText, { style: animatedStyleBold, "$isSelected": true, numberOfLines: 1, adjustsFontSizeToFit: true, children: label })] }) }));
86
86
  };
87
87
  exports.SegmentButton = SegmentButton;
88
88
  var SSegmentsWrapper = styled_native_1.default.View(function (_a) {
89
- var theme = _a.theme, $size = _a.$size;
90
- return "\n padding: ".concat($size === 'small' ? 0 : 6, "px ").concat(theme.core.space[$size === 'small' ? 3 : 4], "px;\n align-items: center;\n justify-content: center;\n");
89
+ var theme = _a.theme, $size = _a.$size, multiline = _a.multiline;
90
+ return "\n ".concat(multiline
91
+ ? "padding: 4px ".concat(theme.core.space[$size === 'small' ? 4 : 6], "px;")
92
+ : "padding: ".concat($size === 'small' ? 2 : 8, "px ").concat(theme.core.space[$size === 'small' ? 3 : 4], "px;"), "\n align-items: center;\n justify-content: center;\n");
91
93
  });
92
94
  var SSegmentText = (0, styled_native_1.default)(AnimatedP)(function (_a) {
93
95
  var $isSelected = _a.$isSelected, theme = _a.theme;
package/dist/esm/components/Badge/Badge.js CHANGED
@@ -43,7 +43,7 @@ var StyledBadge = styled.View(function (_a) {
43
43
  surface = customVariant.backgroundColor;
44
44
  message = customVariant.foregroundColor;
45
45
  }
46
- return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding: 0 ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "], ["\n padding: 0 ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "])), numToPx(core.space[2]), numToPx(core.borderWidth.medium), core.color.brand.white, inverted ? message : surface);
46
+ return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding: 2px ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "], ["\n padding: 2px ", ";\n border-radius: 16px;\n border: ", " solid\n ", ";\n background-color: ", ";\n align-self: flex-start;\n "])), numToPx(core.space[2]), numToPx(core.borderWidth.medium), core.color.brand.white, inverted ? message : surface);
47
47
  });
48
48
  var StyledBadgeText = styled.Text(function (_a) {
49
49
  var _b = _a.theme, core = _b.core, semantic = _b.semantic, component = _b.component, _c = _a.variant, variant = _c === void 0 ? 'info' : _c, _d = _a.inverted, inverted = _d === void 0 ? false : _d, customVariant = _a.customVariant;
package/dist/esm/components/ErrorText/ErrorText.js CHANGED
@@ -10,7 +10,7 @@ var StyledErrorText = styled.Text(function (_a) {
10
10
  var fontSize = smallAndUp
11
11
  ? core.fontSize.body.large
12
12
  : core.fontSize.body.small;
13
- return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n line-height: ", ";\n font-size: ", ";\n color: ", ";\n "], ["\n font-family: ", ";\n line-height: ", ";\n font-size: ", ";\n color: ", ";\n "])), core.fontFamily.body.native, numToPx(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), numToPx(fontSize), semantic.message.error);
13
+ return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "], ["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "])), numToPx(core.space[1]), numToPx(core.space[1]), core.fontFamily.body.native, numToPx(fontSize), numToPx(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), semantic.message.error);
14
14
  });
15
15
  var ErrorText = styledComponentWithBreakpoints(StyledErrorText);
16
16
  export { ErrorText };
package/dist/esm/components/HintText/HintText.js CHANGED
@@ -10,7 +10,7 @@ var StyledHintText = styled.Text(function (_a) {
10
10
  var fontSize = smallAndUp
11
11
  ? core.fontSize.body.large
12
12
  : core.fontSize.body.small;
13
- return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "], ["\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "])), core.fontFamily.body.native, numToPx(fontSize), numToPx(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), semantic.border.functional);
13
+ return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "], ["\n margin-top: ", ";\n margin-bottom: ", ";\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n "])), numToPx(core.space[1]), numToPx(core.space[1]), core.fontFamily.body.native, numToPx(fontSize), numToPx(smallAndUp ? core.lineHeight.body.large : core.lineHeight.body.small), semantic.border.functional);
14
14
  });
15
15
  var HintText = styledComponentWithBreakpoints(StyledHintText);
16
16
  export { HintText };
package/dist/esm/components/SegmentedControls/components/SegmentButton.js CHANGED
@@ -50,14 +50,16 @@ export var SegmentButton = function (_a) {
50
50
  }, style: {
51
51
  flexGrow: inline || multipleRows ? undefined : 1,
52
52
  width: inline || multipleRows ? 'auto' : "".concat(100 / segmentCount, "%"),
53
- }, testID: testID, children: _jsxs(SSegmentsWrapper, { "$isSelected": isSelected, "$size": size, children: [_jsx(SSegmentText, { style: {
53
+ }, testID: testID, children: _jsxs(SSegmentsWrapper, { "$isSelected": isSelected, "$size": size, multiline: multipleRows, children: [_jsx(SSegmentText, { style: {
54
54
  opacity: 0,
55
55
  fontWeight: '900',
56
56
  }, "$isSelected": false, children: label }), _jsx(SSegmentText, { style: animatedStyleNormal, "$isSelected": false, numberOfLines: 1, adjustsFontSizeToFit: true, children: label }), _jsx(SSegmentText, { style: animatedStyleBold, "$isSelected": true, numberOfLines: 1, adjustsFontSizeToFit: true, children: label })] }) }));
57
57
  };
58
58
  var SSegmentsWrapper = styled.View(function (_a) {
59
- var theme = _a.theme, $size = _a.$size;
60
- return "\n padding: ".concat($size === 'small' ? 0 : 6, "px ").concat(theme.core.space[$size === 'small' ? 3 : 4], "px;\n align-items: center;\n justify-content: center;\n");
59
+ var theme = _a.theme, $size = _a.$size, multiline = _a.multiline;
60
+ return "\n ".concat(multiline
61
+ ? "padding: 4px ".concat(theme.core.space[$size === 'small' ? 4 : 6], "px;")
62
+ : "padding: ".concat($size === 'small' ? 2 : 8, "px ").concat(theme.core.space[$size === 'small' ? 3 : 4], "px;"), "\n align-items: center;\n justify-content: center;\n");
61
63
  });
62
64
  var SSegmentText = styled(AnimatedP)(function (_a) {
63
65
  var $isSelected = _a.$isSelected, theme = _a.theme;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ovotech/element-native",
3
- "version": "4.3.0-canary-3908de8-301",
3
+ "version": "4.3.0-canary-cfd4e2d-302",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -14,7 +14,7 @@
14
14
  },
15
15
  "dependencies": {
16
16
  "@backpackapp-io/react-native-toast": "^0.10.0",
17
- "@ovotech/element-core": "3.1.0-canary-3908de8-301",
17
+ "@ovotech/element-core": "3.1.0-canary-cfd4e2d-302",
18
18
  "deepmerge": "^4.2.2",
19
19
  "lodash.groupby": "^4.6.0",
20
20
  "react-native-reanimated-carousel": "^3.5.1"