sapo-components-ui-rn 1.1.8 → 1.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.DS_Store +0 -0
- package/dist/components/Text/index.d.ts +2 -1
- package/dist/index.esm.js +34 -4
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +34 -4
- package/dist/index.js.map +1 -1
- package/dist/styles/themes/tokens.d.ts +24 -0
- package/dist/types.d.ts +6 -0
- package/package.json +1 -1
- package/src/components/Button/index.tsx +0 -1
- package/src/components/SearchInput/index.tsx +1 -0
- package/src/components/Text/index.tsx +18 -2
- package/src/components/TextInput/TextInputDefault.tsx +1 -1
- package/src/styles/themes/DarkTheme.tsx +6 -0
- package/src/styles/themes/LightTheme.tsx +6 -0
- package/src/styles/themes/tokens.tsx +12 -0
- package/src/types.ts +6 -0
- package/src/types.tsx +6 -0
package/dist/.DS_Store
ADDED
|
Binary file
|
|
@@ -8,7 +8,8 @@ export interface IText extends TextProps {
|
|
|
8
8
|
center?: boolean;
|
|
9
9
|
bold?: boolean;
|
|
10
10
|
medium?: boolean;
|
|
11
|
-
|
|
11
|
+
semibold?: boolean;
|
|
12
|
+
children?: React.ReactNode;
|
|
12
13
|
theme?: ThemeProp;
|
|
13
14
|
}
|
|
14
15
|
declare const _default: React.MemoExoticComponent<React.ComponentType<IText>>;
|
package/dist/index.esm.js
CHANGED
|
@@ -243,7 +243,13 @@ var ref = {
|
|
|
243
243
|
borderSuccessDefault: green.GREEN100,
|
|
244
244
|
borderWarningDefault: yellow.YELLOW100,
|
|
245
245
|
iconBrandDefault: blue.BLUE100,
|
|
246
|
+
iconBrandHover: blue.BLUE80,
|
|
247
|
+
iconBrandPressed: blue.BLUE120,
|
|
248
|
+
iconBrandDisabled: ink.INK20,
|
|
246
249
|
iconCriticalDefault: red.RED100,
|
|
250
|
+
iconCriticalHover: red.RED80,
|
|
251
|
+
iconCriticalPressed: red.RED_STATUS,
|
|
252
|
+
iconCriticalDisabled: ink.INK20,
|
|
247
253
|
iconErrorDefault: red.RED100,
|
|
248
254
|
iconInfoDefault: blue.BLUE100,
|
|
249
255
|
iconPrimaryDefault: ink.INK40,
|
|
@@ -388,7 +394,13 @@ var ref = {
|
|
|
388
394
|
borderSuccessDefault: green.GREEN100,
|
|
389
395
|
borderWarningDefault: yellow.YELLOW100,
|
|
390
396
|
iconBrandDefault: blue.BLUE100,
|
|
397
|
+
iconBrandHover: blue.BLUE80,
|
|
398
|
+
iconBrandPressed: blue.BLUE120,
|
|
399
|
+
iconBrandDisabled: ink.INK20,
|
|
391
400
|
iconCriticalDefault: red.RED100,
|
|
401
|
+
iconCriticalHover: red.RED80,
|
|
402
|
+
iconCriticalPressed: red.RED_STATUS,
|
|
403
|
+
iconCriticalDisabled: ink.INK20,
|
|
392
404
|
iconErrorDefault: red.RED100,
|
|
393
405
|
iconInfoDefault: blue.BLUE100,
|
|
394
406
|
iconPrimaryDefault: ink.INK40,
|
|
@@ -1294,7 +1306,13 @@ var LightTheme = {
|
|
|
1294
1306
|
borderSuccessDefault: green.GREEN100,
|
|
1295
1307
|
borderWarningDefault: yellow.YELLOW100,
|
|
1296
1308
|
iconBrandDefault: blue.BLUE100,
|
|
1309
|
+
iconBrandHover: blue.BLUE80,
|
|
1310
|
+
iconBrandPressed: blue.BLUE120,
|
|
1311
|
+
iconBrandDisabled: ink.INK20,
|
|
1297
1312
|
iconCriticalDefault: red.RED100,
|
|
1313
|
+
iconCriticalHover: red.RED80,
|
|
1314
|
+
iconCriticalPressed: red.RED_STATUS,
|
|
1315
|
+
iconCriticalDisabled: ink.INK20,
|
|
1298
1316
|
iconErrorDefault: red.RED100,
|
|
1299
1317
|
iconInfoDefault: blue.BLUE100,
|
|
1300
1318
|
iconPrimaryDefault: ink.INK40,
|
|
@@ -1443,7 +1461,13 @@ var DarkTheme = __assign(__assign({}, LightTheme), { dark: true, mode: "adaptive
|
|
|
1443
1461
|
borderSuccessDefault: green.GREEN100,
|
|
1444
1462
|
borderWarningDefault: yellow.YELLOW100,
|
|
1445
1463
|
iconBrandDefault: blue.BLUE100,
|
|
1464
|
+
iconBrandHover: blue.BLUE80,
|
|
1465
|
+
iconBrandPressed: blue.BLUE120,
|
|
1466
|
+
iconBrandDisabled: ink.INK20,
|
|
1446
1467
|
iconCriticalDefault: red.RED100,
|
|
1468
|
+
iconCriticalHover: red.RED80,
|
|
1469
|
+
iconCriticalPressed: red.RED_STATUS,
|
|
1470
|
+
iconCriticalDisabled: ink.INK20,
|
|
1447
1471
|
iconErrorDefault: red.RED100,
|
|
1448
1472
|
iconInfoDefault: blue.BLUE100,
|
|
1449
1473
|
iconPrimaryDefault: ink.INK40,
|
|
@@ -4752,7 +4776,7 @@ var Text = function (props) {
|
|
|
4752
4776
|
fontSize: 14,
|
|
4753
4777
|
lineHeight: 20,
|
|
4754
4778
|
};
|
|
4755
|
-
var _a = props.size, size = _a === void 0 ? 14 : _a, lineHeight = props.lineHeight, center = props.center, color = props.color, bold = props.bold, medium = props.medium;
|
|
4779
|
+
var _a = props.size, size = _a === void 0 ? 14 : _a, lineHeight = props.lineHeight, center = props.center, color = props.color, bold = props.bold, medium = props.medium, semibold = props.semibold;
|
|
4756
4780
|
style.color = theme.colors.textDefault || "black";
|
|
4757
4781
|
if (size) {
|
|
4758
4782
|
style.fontSize = size;
|
|
@@ -4773,6 +4797,12 @@ var Text = function (props) {
|
|
|
4773
4797
|
}
|
|
4774
4798
|
}
|
|
4775
4799
|
if (medium) {
|
|
4800
|
+
style.fontFamily = "Inter-Medium";
|
|
4801
|
+
if (Platform.OS === "ios") {
|
|
4802
|
+
style.fontWeight = "500";
|
|
4803
|
+
}
|
|
4804
|
+
}
|
|
4805
|
+
if (semibold) {
|
|
4776
4806
|
style.fontFamily = "Inter-SemiBold";
|
|
4777
4807
|
if (Platform.OS === "ios") {
|
|
4778
4808
|
style.fontWeight = "600";
|
|
@@ -5457,7 +5487,7 @@ var TextInputDefault = function (_a) {
|
|
|
5457
5487
|
if (height && typeof height !== "number") {
|
|
5458
5488
|
console.warn("Currently we support only numbers in height prop");
|
|
5459
5489
|
}
|
|
5460
|
-
var placeholderTextColorBasedOnState = placeholderTextColor || colors.
|
|
5490
|
+
var placeholderTextColorBasedOnState = placeholderTextColor || colors.textPlaceholder;
|
|
5461
5491
|
var getBorderColor = function () {
|
|
5462
5492
|
if (disabled) {
|
|
5463
5493
|
return theme.colors.surfacePrimaryDisabled;
|
|
@@ -6354,7 +6384,7 @@ var Button = function (_a) {
|
|
|
6354
6384
|
? CONSTANTS.SPACE_4
|
|
6355
6385
|
: CONSTANTS.SPACE_8 })),
|
|
6356
6386
|
React__default.createElement(View, { center: true },
|
|
6357
|
-
React__default.createElement(Text$1, __assign({ numberOfLines: 1, color: textColor || renderTextColor(), size: size,
|
|
6387
|
+
React__default.createElement(Text$1, __assign({ numberOfLines: 1, color: textColor || renderTextColor(), size: size, medium: medium, style: [disabled && disabledTextStyle, textStyle] }, textProps), title)),
|
|
6358
6388
|
right && (React__default.createElement(Spacer, { width: buttonSize === "small"
|
|
6359
6389
|
? CONSTANTS.SPACE_4
|
|
6360
6390
|
: CONSTANTS.SPACE_8 })),
|
|
@@ -7223,7 +7253,7 @@ var SearchInput = function (_a) {
|
|
|
7223
7253
|
onChangeText === null || onChangeText === void 0 ? void 0 : onChangeText(text);
|
|
7224
7254
|
}, debounceTime);
|
|
7225
7255
|
return (React__default.createElement(TextInput, { left: React__default.createElement(View, null,
|
|
7226
|
-
React__default.createElement(Icon$1, { name: "IconSearch", type: "Svg", size: 18 })), disabled: disabled, value: value, clearButton: clearButton, mode: "default", label: placeholder, placeholder: placeholder, right: rightIcon, onFocus: onFocus, onBlur: onBlur, allowFontScaling: false, onChangeText: debouncedOnChangeText, style: [
|
|
7256
|
+
React__default.createElement(Icon$1, { name: "IconSearch", type: "Svg", size: 18 })), disabled: disabled, value: value, clearButton: clearButton, mode: "default", label: placeholder, placeholder: placeholder, placeholderTextColor: colors.textPlaceholder, right: rightIcon, onFocus: onFocus, onBlur: onBlur, allowFontScaling: false, onChangeText: debouncedOnChangeText, style: [
|
|
7227
7257
|
{
|
|
7228
7258
|
height: height || 36,
|
|
7229
7259
|
},
|