sapo-components-ui-rn 1.1.90 → 1.1.91
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/assets/icon-checkbox-indeterminate.svg +20 -0
- package/dist/assets/index.ts +2 -0
- package/dist/assets/svg/icon-checkbox-indeterminate.svg +20 -0
- package/dist/assets/svg/index.d.ts +1 -0
- package/dist/assets/svg/index.ts +2 -0
- package/dist/components/Checkbox/index.d.ts +1 -1
- package/dist/index.esm.js +11 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +12 -5
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect
|
|
3
|
+
x="2.75"
|
|
4
|
+
y="2.75"
|
|
5
|
+
width="18.5"
|
|
6
|
+
height="18.5"
|
|
7
|
+
rx="5.25"
|
|
8
|
+
fill="#0088FF"
|
|
9
|
+
stroke="#0088FF"
|
|
10
|
+
stroke-width="1.5"
|
|
11
|
+
/>
|
|
12
|
+
<rect
|
|
13
|
+
x="7"
|
|
14
|
+
y="11"
|
|
15
|
+
width="10"
|
|
16
|
+
height="2"
|
|
17
|
+
rx="1"
|
|
18
|
+
fill="white"
|
|
19
|
+
/>
|
|
20
|
+
</svg>
|
package/dist/assets/index.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import IconClose from "./icon-close.svg";
|
|
2
2
|
import IconCheckbox from "./icon-checkbox.svg";
|
|
3
3
|
import IconCheckboxActive from "./icon-checkbox-active.svg";
|
|
4
|
+
import IconCheckboxIndeterminate from "./icon-checkbox-indeterminate.svg";
|
|
4
5
|
import IconRadio from "./icon-radio.svg";
|
|
5
6
|
import IconRadioActive from "./icon-radio-active.svg";
|
|
6
7
|
import IconSearch from "./icon-search.svg";
|
|
@@ -16,6 +17,7 @@ export const Svg = {
|
|
|
16
17
|
IconClose,
|
|
17
18
|
IconCheckbox,
|
|
18
19
|
IconCheckboxActive,
|
|
20
|
+
IconCheckboxIndeterminate,
|
|
19
21
|
IconRadio,
|
|
20
22
|
IconRadioActive,
|
|
21
23
|
IconSearch,
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect
|
|
3
|
+
x="2.75"
|
|
4
|
+
y="2.75"
|
|
5
|
+
width="18.5"
|
|
6
|
+
height="18.5"
|
|
7
|
+
rx="5.25"
|
|
8
|
+
fill="#0088FF"
|
|
9
|
+
stroke="#0088FF"
|
|
10
|
+
stroke-width="1.5"
|
|
11
|
+
/>
|
|
12
|
+
<rect
|
|
13
|
+
x="7"
|
|
14
|
+
y="11"
|
|
15
|
+
width="10"
|
|
16
|
+
height="2"
|
|
17
|
+
rx="1"
|
|
18
|
+
fill="white"
|
|
19
|
+
/>
|
|
20
|
+
</svg>
|
|
@@ -2,6 +2,7 @@ export declare const Svg: {
|
|
|
2
2
|
IconClose: import("react").FC<import("react-native-svg").SvgProps>;
|
|
3
3
|
IconCheckbox: import("react").FC<import("react-native-svg").SvgProps>;
|
|
4
4
|
IconCheckboxActive: import("react").FC<import("react-native-svg").SvgProps>;
|
|
5
|
+
IconCheckboxIndeterminate: import("react").FC<import("react-native-svg").SvgProps>;
|
|
5
6
|
IconRadio: import("react").FC<import("react-native-svg").SvgProps>;
|
|
6
7
|
IconRadioActive: import("react").FC<import("react-native-svg").SvgProps>;
|
|
7
8
|
IconSearch: import("react").FC<import("react-native-svg").SvgProps>;
|
package/dist/assets/svg/index.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import IconClose from "./icon-close.svg";
|
|
2
2
|
import IconCheckbox from "./icon-checkbox.svg";
|
|
3
3
|
import IconCheckboxActive from "./icon-checkbox-active.svg";
|
|
4
|
+
import IconCheckboxIndeterminate from "./icon-checkbox-indeterminate.svg";
|
|
4
5
|
import IconRadio from "./icon-radio.svg";
|
|
5
6
|
import IconRadioActive from "./icon-radio-active.svg";
|
|
6
7
|
import IconSearch from "./icon-search.svg";
|
|
@@ -16,6 +17,7 @@ export const Svg = {
|
|
|
16
17
|
IconClose,
|
|
17
18
|
IconCheckbox,
|
|
18
19
|
IconCheckboxActive,
|
|
20
|
+
IconCheckboxIndeterminate,
|
|
19
21
|
IconRadio,
|
|
20
22
|
IconRadioActive,
|
|
21
23
|
IconSearch,
|
|
@@ -8,7 +8,7 @@ interface CheckboxProps {
|
|
|
8
8
|
textStyle?: StyleProp<TextStyle>;
|
|
9
9
|
disabled?: boolean;
|
|
10
10
|
leftIcon?: React.ReactNode;
|
|
11
|
-
checked?: boolean;
|
|
11
|
+
checked?: boolean | "indeterminate";
|
|
12
12
|
iconSize?: number;
|
|
13
13
|
}
|
|
14
14
|
declare const Checkbox: ({ testID, style, content, textStyle, onPress, disabled, leftIcon, checked, iconSize, }: CheckboxProps) => React.JSX.Element;
|
package/dist/index.esm.js
CHANGED
|
@@ -7,6 +7,7 @@ import color from 'color';
|
|
|
7
7
|
import IconClose from './assets/svg/icon-close.svg';
|
|
8
8
|
import IconCheckbox from './assets/svg/icon-checkbox.svg';
|
|
9
9
|
import IconCheckboxActive from './assets/svg/icon-checkbox-active.svg';
|
|
10
|
+
import IconCheckboxIndeterminate from './assets/svg/icon-checkbox-indeterminate.svg';
|
|
10
11
|
import IconRadio from './assets/svg/icon-radio.svg';
|
|
11
12
|
import IconRadioActive from './assets/svg/icon-radio-active.svg';
|
|
12
13
|
import IconSearch from './assets/svg/icon-search.svg';
|
|
@@ -4796,6 +4797,7 @@ var Svg = {
|
|
|
4796
4797
|
IconClose: IconClose,
|
|
4797
4798
|
IconCheckbox: IconCheckbox,
|
|
4798
4799
|
IconCheckboxActive: IconCheckboxActive,
|
|
4800
|
+
IconCheckboxIndeterminate: IconCheckboxIndeterminate,
|
|
4799
4801
|
IconRadio: IconRadio,
|
|
4800
4802
|
IconRadioActive: IconRadioActive,
|
|
4801
4803
|
IconSearch: IconSearch,
|
|
@@ -7029,6 +7031,13 @@ var Checkbox = function (_a) {
|
|
|
7029
7031
|
var colors = theme.colors;
|
|
7030
7032
|
var _f = useState(checked), isActive = _f[0], setActive = _f[1];
|
|
7031
7033
|
var checkboxColor = useCheckboxColor(isActive, disabled);
|
|
7034
|
+
var checkboxIconName = "IconCheckbox";
|
|
7035
|
+
if (isActive === "indeterminate") {
|
|
7036
|
+
checkboxIconName = "IconCheckboxIndeterminate";
|
|
7037
|
+
}
|
|
7038
|
+
else if (isActive) {
|
|
7039
|
+
checkboxIconName = "IconCheckboxActive";
|
|
7040
|
+
}
|
|
7032
7041
|
var handlePress = useCallback(function () {
|
|
7033
7042
|
onPress === null || onPress === void 0 ? void 0 : onPress();
|
|
7034
7043
|
}, [isActive, onPress]);
|
|
@@ -7037,7 +7046,7 @@ var Checkbox = function (_a) {
|
|
|
7037
7046
|
}, [checked]);
|
|
7038
7047
|
return (React__default.createElement(View, { testID: testID, row: true, disabled: disabled, alignCenter: true, style: [style], onPress: handlePress },
|
|
7039
7048
|
leftIcon ? (React__default.createElement(View, { paddingRight: CONSTANTS.SPACE_8 }, leftIcon)) : (React__default.createElement(View, { paddingRight: CONSTANTS.SPACE_8 },
|
|
7040
|
-
React__default.createElement(SvgIcon, { name:
|
|
7049
|
+
React__default.createElement(SvgIcon, { name: checkboxIconName, width: iconSize, height: iconSize, color: checkboxColor }))),
|
|
7041
7050
|
React__default.createElement(View, { full: true },
|
|
7042
7051
|
React__default.createElement(Text$1, { color: colors.textDefault, style: [
|
|
7043
7052
|
styles$5.text14,
|
|
@@ -7047,10 +7056,7 @@ var Checkbox = function (_a) {
|
|
|
7047
7056
|
textStyle,
|
|
7048
7057
|
] }, content))));
|
|
7049
7058
|
};
|
|
7050
|
-
var styles$5 = StyleSheet.create(__assign(
|
|
7051
|
-
width: 24,
|
|
7052
|
-
height: 24,
|
|
7053
|
-
} }));
|
|
7059
|
+
var styles$5 = StyleSheet.create(__assign({}, containerStyles));
|
|
7054
7060
|
|
|
7055
7061
|
var RadioButton = function (_a) {
|
|
7056
7062
|
var testID = _a.testID, style = _a.style, _b = _a.content, content = _b === void 0 ? "content" : _b, textStyle = _a.textStyle, onPress = _a.onPress, _c = _a.disabled, disabled = _c === void 0 ? false : _c, leftIcon = _a.leftIcon, _d = _a.checked, checked = _d === void 0 ? false : _d;
|