decathlon-ui 0.3.29 → 0.3.30

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 (16) hide show
  1. package/dist/components/badge/badge.component.d.ts.map +1 -1
  2. package/dist/components/badge/badge.component.js +6 -6
  3. package/dist/components/badge/badge.styles.d.ts +3 -1
  4. package/dist/components/badge/badge.styles.d.ts.map +1 -1
  5. package/dist/components/badge/badge.styles.js +3 -1
  6. package/dist/components/button/button.styles.d.ts +0 -50
  7. package/dist/components/button/button.styles.d.ts.map +1 -1
  8. package/dist/components/button/button.styles.js +1 -1
  9. package/dist/components/range-slider/range-slider.component.d.ts.map +1 -1
  10. package/dist/components/range-slider/range-slider.component.js +25 -15
  11. package/dist/components/range-slider/range-slider.styles.d.ts +27 -1
  12. package/dist/components/range-slider/range-slider.styles.d.ts.map +1 -1
  13. package/dist/components/range-slider/range-slider.styles.js +25 -1
  14. package/dist/components/range-slider/range-slider.types.d.ts +1 -0
  15. package/dist/components/range-slider/range-slider.types.d.ts.map +1 -1
  16. package/package.json +1 -1
package/dist/components/badge/badge.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"badge.component.d.ts","sourceRoot":"","sources":["../../../src/components/badge/badge.component.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AA+DhD,eAAO,MAAM,KAAK,6FAjDf,UAAU,6CAiDkC,CAAC"}
1
+ {"version":3,"file":"badge.component.d.ts","sourceRoot":"","sources":["../../../src/components/badge/badge.component.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAgEhD,eAAO,MAAM,KAAK,6FAlDf,UAAU,6CAkDkC,CAAC"}
package/dist/components/badge/badge.component.js CHANGED
@@ -26,12 +26,12 @@ const BadgeComponent = ({ text, variant, size = "medium", style, textStyle, icon
26
26
  return styles.medium;
27
27
  }
28
28
  };
29
- return (_jsxs(View, { style: [styles.container, !style && variant && styles[variant], style], children: [icon && iconPosition === "left" && renderIcon(), _jsx(Text, { style: [
30
- styles.text,
31
- getSizeStyle(),
32
- variant && styles[variant],
33
- textStyle,
34
- ], children: text }), icon && iconPosition === "right" && renderIcon()] }));
29
+ return (_jsxs(View, { style: [styles.container, !style && variant && styles[variant], style], children: [icon && iconPosition === "left" && renderIcon(), _jsx(View, { style: styles.textContainer, children: _jsx(Text, { style: [
30
+ styles.text,
31
+ getSizeStyle(),
32
+ variant && styles[variant],
33
+ textStyle,
34
+ ], children: text }) }), icon && iconPosition === "right" && renderIcon()] }));
35
35
  };
36
36
  export const Badge = React.memo(BadgeComponent);
37
37
  Badge.displayName = "Badge";
package/dist/components/badge/badge.styles.d.ts CHANGED
@@ -6,7 +6,9 @@ export declare const useBadgeStyles: (variant?: BadgeVariant, size?: BadgeSize)
6
6
  alignItems: "center";
7
7
  justifyContent: "center";
8
8
  gap: 8;
9
- height: number;
9
+ };
10
+ textContainer: {
11
+ flex: number;
10
12
  };
11
13
  text: {
12
14
  color: "#101010";
package/dist/components/badge/badge.styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"badge.styles.d.ts","sourceRoot":"","sources":["../../../src/components/badge/badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAM7D,eAAO,MAAM,cAAc,GACzB,UAAS,YAAwB,EACjC,OAAM,SAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0F3B,CAAC"}
1
+ {"version":3,"file":"badge.styles.d.ts","sourceRoot":"","sources":["../../../src/components/badge/badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAM7D,eAAO,MAAM,cAAc,GACzB,UAAS,YAAwB,EACjC,OAAM,SAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4F3B,CAAC"}
package/dist/components/badge/badge.styles.js CHANGED
@@ -22,7 +22,9 @@ export const useBadgeStyles = (variant = "default", size = "medium") => {
22
22
  alignItems: "center",
23
23
  justifyContent: "center",
24
24
  gap: theme.spacing.xs,
25
- height: size === "small" ? 19 : size === "medium" ? 30 : 48,
25
+ },
26
+ textContainer: {
27
+ flex: 1,
26
28
  },
27
29
  text: {
28
30
  color: theme.colors.textPrimary,
package/dist/components/button/button.styles.d.ts CHANGED
@@ -41,18 +41,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
41
41
  borderColor?: undefined;
42
42
  paddingHorizontal: 16;
43
43
  paddingVertical: number;
44
- } | {
45
- width: "auto" | "100%";
46
- borderRadius: number;
47
- justifyContent: "center";
48
- alignItems: "center";
49
- flexDirection: "row";
50
- gap: number;
51
- backgroundColor: string;
52
- borderWidth: number;
53
- borderColor: "#FFE4D6";
54
- paddingHorizontal: 16;
55
- paddingVertical: number;
56
44
  } | {
57
45
  width: "auto" | "100%";
58
46
  borderRadius: number;
@@ -101,18 +89,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
101
89
  borderColor?: undefined;
102
90
  paddingHorizontal: 16;
103
91
  paddingVertical: 12;
104
- } | {
105
- width: "auto" | "100%";
106
- borderRadius: number;
107
- justifyContent: "center";
108
- alignItems: "center";
109
- flexDirection: "row";
110
- gap: number;
111
- backgroundColor: string;
112
- borderWidth: number;
113
- borderColor: "#FFE4D6";
114
- paddingHorizontal: 16;
115
- paddingVertical: 12;
116
92
  } | {
117
93
  width: "auto" | "100%";
118
94
  borderRadius: number;
@@ -161,18 +137,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
161
137
  borderColor?: undefined;
162
138
  paddingHorizontal: 16;
163
139
  paddingVertical: 16;
164
- } | {
165
- width: "auto" | "100%";
166
- borderRadius: number;
167
- justifyContent: "center";
168
- alignItems: "center";
169
- flexDirection: "row";
170
- gap: number;
171
- backgroundColor: string;
172
- borderWidth: number;
173
- borderColor: "#FFE4D6";
174
- paddingHorizontal: 16;
175
- paddingVertical: 16;
176
140
  } | {
177
141
  width: "auto" | "100%";
178
142
  borderRadius: number;
@@ -202,10 +166,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
202
166
  fontWeight: "600";
203
167
  color: "#AB0009";
204
168
  fontSize: 14;
205
- } | {
206
- fontWeight: "600";
207
- color: "#AB0009";
208
- fontSize: 14;
209
169
  } | {
210
170
  fontWeight: "600";
211
171
  color: "#101010";
@@ -222,10 +182,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
222
182
  fontWeight: "600";
223
183
  color: "#AB0009";
224
184
  fontSize: 16;
225
- } | {
226
- fontWeight: "600";
227
- color: "#AB0009";
228
- fontSize: 16;
229
185
  } | {
230
186
  fontWeight: "600";
231
187
  color: "#101010";
@@ -242,10 +198,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
242
198
  fontWeight: "600";
243
199
  color: "#AB0009";
244
200
  fontSize: 18;
245
- } | {
246
- fontWeight: "600";
247
- color: "#AB0009";
248
- fontSize: 18;
249
201
  };
250
202
  icon: {
251
203
  color: "#101010";
@@ -255,8 +207,6 @@ export declare const useButtonStyles: ({ variant, fullWidth, size, disabled, }:
255
207
  color: string;
256
208
  } | {
257
209
  color: "#AB0009";
258
- } | {
259
- color: "#AB0009";
260
210
  };
261
211
  disabled: {
262
212
  opacity: number;
package/dist/components/button/button.styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,eAAO,MAAM,eAAe,GAAI;;;;;CAK/B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4MA,CAAC"}
1
+ {"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,eAAO,MAAM,eAAe,GAAI;;;;;CAK/B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4MA,CAAC"}
package/dist/components/button/button.styles.js CHANGED
@@ -151,7 +151,7 @@ fullWidth = true, size = "medium", disabled = false, }) => {
151
151
  container: {
152
152
  backgroundColor: "transparent",
153
153
  borderWidth: 1,
154
- borderColor: theme.colors.backgroundError,
154
+ borderColor: theme.colors.borderError,
155
155
  },
156
156
  buttonText: { color: theme.colors.textError },
157
157
  icon: {
package/dist/components/range-slider/range-slider.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"range-slider.component.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AA0KxD,eAAO,MAAM,WAAW,8CAAmC,CAAC"}
1
+ {"version":3,"file":"range-slider.component.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAsMxD,eAAO,MAAM,WAAW,8CAAmC,CAAC"}
package/dist/components/range-slider/range-slider.component.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import * as React from "react";
3
- import { Animated, PanResponder, Platform, UIManager, View, } from "react-native";
3
+ import { Animated, PanResponder, Platform, Text, UIManager, View, } from "react-native";
4
4
  import { useRangeSliderStyles } from "./range-slider.styles";
5
5
  if (Platform.OS === "android") {
6
6
  if (UIManager.setLayoutAnimationEnabledExperimental) {
7
7
  UIManager.setLayoutAnimationEnabledExperimental(true);
8
8
  }
9
9
  }
10
- const RangeSliderComponent = ({ value = [0, 100], min = 0, max = 100, disabled, selected, error, onChangeValue, testID, }) => {
10
+ const RangeSliderComponent = ({ value = [0, 100], min = 0, max = 100, disabled, selected, error, onChangeValue, testID, formatter = (val) => val.toString(), }) => {
11
11
  const styles = useRangeSliderStyles();
12
12
  // Referência para o container do slider
13
13
  const sliderContainerRef = React.useRef(null);
@@ -103,19 +103,29 @@ const RangeSliderComponent = ({ value = [0, 100], min = 0, max = 100, disabled,
103
103
  });
104
104
  const leftPanResponder = createPanResponder(true);
105
105
  const rightPanResponder = createPanResponder(false);
106
- return (_jsxs(View, { ref: sliderContainerRef, style: [styles.sliderContainer, disabled && { opacity: 0.5 }], onLayout: (event) => setSliderWidth(event.nativeEvent.layout.width), testID: testID, children: [_jsx(View, { style: styles.sliderTrack }), _jsx(Animated.View, { style: [
107
- styles.sliderFilledTrack,
108
- {
109
- left: leftThumbPosition,
110
- width: Animated.subtract(rightThumbPosition, leftThumbPosition),
111
- },
112
- ] }), _jsx(Animated.View, { ...leftPanResponder.panHandlers, style: [
113
- styles.thumb,
114
- { transform: [{ translateX: leftThumbPosition }] },
115
- ], children: _jsx(View, { style: styles.thumbDot }) }), _jsx(Animated.View, { ...rightPanResponder.panHandlers, style: [
116
- styles.thumb,
117
- { transform: [{ translateX: rightThumbPosition }] },
118
- ], children: _jsx(View, { style: styles.thumbDot }) })] }));
106
+ return (_jsxs(View, { style: styles.container, children: [_jsxs(View, { style: styles.labelsContainer, children: [_jsx(Animated.View, { style: [
107
+ styles.valueLabel,
108
+ {
109
+ transform: [{ translateX: leftThumbPosition }],
110
+ },
111
+ ], children: _jsx(Text, { style: styles.valueLabelText, children: formatter(leftValue) }) }), _jsx(Animated.View, { style: [
112
+ styles.valueLabel,
113
+ {
114
+ transform: [{ translateX: rightThumbPosition }],
115
+ },
116
+ ], children: _jsx(Text, { style: styles.valueLabelText, children: formatter(rightValue) }) })] }), _jsxs(View, { ref: sliderContainerRef, style: [styles.sliderContainer, disabled && { opacity: 0.5 }], onLayout: (event) => setSliderWidth(event.nativeEvent.layout.width), testID: testID, children: [_jsx(View, { style: styles.sliderTrack }), _jsx(Animated.View, { style: [
117
+ styles.sliderFilledTrack,
118
+ {
119
+ left: leftThumbPosition,
120
+ width: Animated.subtract(rightThumbPosition, leftThumbPosition),
121
+ },
122
+ ] }), _jsx(Animated.View, { ...leftPanResponder.panHandlers, style: [
123
+ styles.thumb,
124
+ { transform: [{ translateX: leftThumbPosition }] },
125
+ ], children: _jsx(View, { style: styles.thumbDot }) }), _jsx(Animated.View, { ...rightPanResponder.panHandlers, style: [
126
+ styles.thumb,
127
+ { transform: [{ translateX: rightThumbPosition }] },
128
+ ], children: _jsx(View, { style: styles.thumbDot }) })] })] }));
119
129
  };
120
130
  export const RangeSlider = React.memo(RangeSliderComponent);
121
131
  RangeSlider.displayName = "RangeSlider";
package/dist/components/range-slider/range-slider.styles.d.ts CHANGED
@@ -1,8 +1,34 @@
1
1
  export declare const useRangeSliderStyles: () => {
2
+ container: {
3
+ width: "100%";
4
+ marginVertical: number;
5
+ };
6
+ labelsContainer: {
7
+ height: number;
8
+ width: "100%";
9
+ position: "relative";
10
+ marginBottom: number;
11
+ };
12
+ valueLabel: {
13
+ position: "absolute";
14
+ top: number;
15
+ width: number;
16
+ height: number;
17
+ justifyContent: "center";
18
+ alignItems: "center";
19
+ transform: {
20
+ translateX: number;
21
+ }[];
22
+ };
23
+ valueLabelText: {
24
+ fontSize: number;
25
+ fontWeight: "600";
26
+ color: "#101010";
27
+ textAlign: "center";
28
+ };
2
29
  sliderContainer: {
3
30
  height: number;
4
31
  width: "100%";
5
- marginVertical: number;
6
32
  position: "relative";
7
33
  };
8
34
  sliderTrack: {
package/dist/components/range-slider/range-slider.styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"range-slider.styles.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ChC,CAAC"}
1
+ {"version":3,"file":"range-slider.styles.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkEhC,CAAC"}
package/dist/components/range-slider/range-slider.styles.js CHANGED
@@ -3,10 +3,34 @@ import { useTheme } from "../../themes";
3
3
  export const useRangeSliderStyles = () => {
4
4
  const theme = useTheme();
5
5
  return StyleSheet.create({
6
+ container: {
7
+ width: "100%",
8
+ marginVertical: 20,
9
+ },
10
+ labelsContainer: {
11
+ height: 30,
12
+ width: "100%",
13
+ position: "relative",
14
+ marginBottom: 10,
15
+ },
16
+ valueLabel: {
17
+ position: "absolute",
18
+ top: 0,
19
+ width: 20,
20
+ height: 20,
21
+ justifyContent: "center",
22
+ alignItems: "center",
23
+ transform: [{ translateX: -10 }], // Centraliza o label com o thumb
24
+ },
25
+ valueLabelText: {
26
+ fontSize: 12,
27
+ fontWeight: "600",
28
+ color: theme.colors.textPrimary,
29
+ textAlign: "center",
30
+ },
6
31
  sliderContainer: {
7
32
  height: 40,
8
33
  width: "100%",
9
- marginVertical: 20,
10
34
  position: "relative",
11
35
  },
12
36
  sliderTrack: {
package/dist/components/range-slider/range-slider.types.d.ts CHANGED
@@ -7,5 +7,6 @@ export interface RangeSliderProps {
7
7
  error?: boolean;
8
8
  onChangeValue?: (value: [number, number]) => void;
9
9
  testID?: string;
10
+ formatter?: (value: number) => string;
10
11
  }
11
12
  //# sourceMappingURL=range-slider.types.d.ts.map
package/dist/components/range-slider/range-slider.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"range-slider.types.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAClD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}
1
+ {"version":3,"file":"range-slider.types.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAClD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACvC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "decathlon-ui",
3
- "version": "0.3.29",
3
+ "version": "0.3.30",
4
4
  "description": "Biblioteca de componentes React Native com Storybook e documentação via GitHub Pages.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",