@pagopa/io-app-design-system 4.0.1 → 4.0.2
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/lib/commonjs/components/modules/ModuleCredential.js +35 -28
- package/lib/commonjs/components/modules/ModuleCredential.js.map +1 -1
- package/lib/module/components/modules/ModuleCredential.js +36 -29
- package/lib/module/components/modules/ModuleCredential.js.map +1 -1
- package/lib/typescript/components/modules/ModuleCredential.d.ts +2 -2
- package/lib/typescript/components/modules/ModuleCredential.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/modules/ModuleCredential.tsx +49 -39
|
@@ -17,21 +17,19 @@ var _ModuleStatic = require("./ModuleStatic");
|
|
|
17
17
|
var _PressableModuleBase = require("./PressableModuleBase");
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
19
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
20
|
-
const ModuleCredential = props =>
|
|
20
|
+
const ModuleCredential = props => props.isLoading ? /*#__PURE__*/_react.default.createElement(ModuleCredentialSkeleton, null) : /*#__PURE__*/_react.default.createElement(ModuleCredentialContent, props);
|
|
21
|
+
exports.ModuleCredential = ModuleCredential;
|
|
22
|
+
const ModuleCredentialContent = ({
|
|
23
|
+
testID,
|
|
24
|
+
icon,
|
|
25
|
+
image,
|
|
26
|
+
label,
|
|
27
|
+
onPress,
|
|
28
|
+
badge,
|
|
29
|
+
isFetching,
|
|
30
|
+
...pressableProps
|
|
31
|
+
}) => {
|
|
21
32
|
const theme = (0, _core.useIOTheme)();
|
|
22
|
-
if (props.isLoading) {
|
|
23
|
-
return /*#__PURE__*/_react.default.createElement(ModuleCredentialSkeleton, null);
|
|
24
|
-
}
|
|
25
|
-
const {
|
|
26
|
-
testID,
|
|
27
|
-
icon,
|
|
28
|
-
image,
|
|
29
|
-
label,
|
|
30
|
-
onPress,
|
|
31
|
-
badge,
|
|
32
|
-
isFetching,
|
|
33
|
-
...pressableProps
|
|
34
|
-
} = props;
|
|
35
33
|
const iconComponent = icon && /*#__PURE__*/_react.default.createElement(_icons.Icon, {
|
|
36
34
|
name: icon,
|
|
37
35
|
size: _core.IOSelectionListItemVisualParams.iconSize,
|
|
@@ -42,6 +40,28 @@ const ModuleCredential = props => {
|
|
|
42
40
|
style: styles.image,
|
|
43
41
|
accessibilityIgnoresInvertColors: true
|
|
44
42
|
});
|
|
43
|
+
const endComponent = _react.default.useMemo(() => {
|
|
44
|
+
if (isFetching) {
|
|
45
|
+
return /*#__PURE__*/_react.default.createElement(_loadingSpinner.LoadingSpinner, {
|
|
46
|
+
testID: testID ? `${testID}_activityIndicator` : undefined,
|
|
47
|
+
color: theme["interactiveElem-default"]
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
if (badge) {
|
|
51
|
+
return /*#__PURE__*/_react.default.createElement(_badge.Badge, _extends({}, badge, {
|
|
52
|
+
testID: testID ? `${testID}_badge` : undefined
|
|
53
|
+
}));
|
|
54
|
+
}
|
|
55
|
+
if (onPress) {
|
|
56
|
+
return /*#__PURE__*/_react.default.createElement(_icons.Icon, {
|
|
57
|
+
testID: testID ? `${testID}_icon` : undefined,
|
|
58
|
+
name: "chevronRightListItem",
|
|
59
|
+
color: theme["interactiveElem-default"],
|
|
60
|
+
size: _core.IOListItemVisualParams.chevronSize
|
|
61
|
+
});
|
|
62
|
+
}
|
|
63
|
+
return null;
|
|
64
|
+
}, [testID, theme, isFetching, badge, onPress]);
|
|
45
65
|
const ModuleContent = () => /*#__PURE__*/_react.default.createElement(_Stack.HStack, {
|
|
46
66
|
space: 8,
|
|
47
67
|
style: {
|
|
@@ -62,25 +82,12 @@ const ModuleCredential = props => {
|
|
|
62
82
|
style: {
|
|
63
83
|
flexShrink: 1
|
|
64
84
|
}
|
|
65
|
-
}, label)),
|
|
66
|
-
style: _core.IOStyles.row
|
|
67
|
-
}, badge ? /*#__PURE__*/_react.default.createElement(_badge.Badge, _extends({}, badge, {
|
|
68
|
-
testID: testID ? `${testID}_badge` : undefined
|
|
69
|
-
})) : null, isFetching ? /*#__PURE__*/_react.default.createElement(_loadingSpinner.LoadingSpinner, {
|
|
70
|
-
testID: testID ? `${testID}_activityIndicator` : undefined,
|
|
71
|
-
color: theme["interactiveElem-default"]
|
|
72
|
-
}) : onPress ? /*#__PURE__*/_react.default.createElement(_icons.Icon, {
|
|
73
|
-
testID: testID ? `${testID}_icon` : undefined,
|
|
74
|
-
name: "chevronRightListItem",
|
|
75
|
-
color: theme["interactiveElem-default"],
|
|
76
|
-
size: _core.IOListItemVisualParams.chevronSize
|
|
77
|
-
}) : null));
|
|
85
|
+
}, label)), endComponent);
|
|
78
86
|
return onPress ? /*#__PURE__*/_react.default.createElement(_PressableModuleBase.PressableModuleBase, _extends({}, pressableProps, {
|
|
79
87
|
testID: testID,
|
|
80
88
|
onPress: onPress
|
|
81
89
|
}), /*#__PURE__*/_react.default.createElement(ModuleContent, null)) : /*#__PURE__*/_react.default.createElement(_ModuleStatic.ModuleStatic, null, /*#__PURE__*/_react.default.createElement(ModuleContent, null));
|
|
82
90
|
};
|
|
83
|
-
exports.ModuleCredential = ModuleCredential;
|
|
84
91
|
const ModuleCredentialSkeleton = () => /*#__PURE__*/_react.default.createElement(_ModuleStatic.ModuleStatic, {
|
|
85
92
|
startBlock: /*#__PURE__*/_react.default.createElement(_Stack.HStack, {
|
|
86
93
|
style: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_rnPlaceholder","_core","_badge","_icons","_loadingSpinner","_Stack","_typography","_ModuleStatic","_PressableModuleBase","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","ModuleCredential","props","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_rnPlaceholder","_core","_badge","_icons","_loadingSpinner","_Stack","_typography","_ModuleStatic","_PressableModuleBase","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","ModuleCredential","props","isLoading","createElement","ModuleCredentialSkeleton","ModuleCredentialContent","exports","testID","icon","image","label","onPress","badge","isFetching","pressableProps","theme","useIOTheme","iconComponent","Icon","name","size","IOSelectionListItemVisualParams","iconSize","color","imageComponent","Image","style","styles","accessibilityIgnoresInvertColors","endComponent","React","useMemo","LoadingSpinner","undefined","Badge","IOListItemVisualParams","chevronSize","ModuleContent","HStack","space","alignItems","IOVisualCostants","iconMargin","flexGrow","flexShrink","BodySmall","weight","numberOfLines","lineBreakMode","PressableModuleBase","ModuleStatic","startBlock","Box","animate","width","height","radius","endBlock","StyleSheet","create","resizeMode"],"sourceRoot":"../../../../src","sources":["components/modules/ModuleCredential.tsx"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
import React from "react";
|
|
3
|
-
import { Image, StyleSheet
|
|
3
|
+
import { Image, StyleSheet } from "react-native";
|
|
4
4
|
import Placeholder from "rn-placeholder";
|
|
5
|
-
import { IOListItemVisualParams, IOSelectionListItemVisualParams,
|
|
5
|
+
import { IOListItemVisualParams, IOSelectionListItemVisualParams, IOVisualCostants, useIOTheme } from "../../core";
|
|
6
6
|
import { Badge } from "../badge";
|
|
7
7
|
import { Icon } from "../icons";
|
|
8
8
|
import { LoadingSpinner } from "../loadingSpinner";
|
|
@@ -10,21 +10,18 @@ import { HStack } from "../stack/Stack";
|
|
|
10
10
|
import { BodySmall } from "../typography";
|
|
11
11
|
import { ModuleStatic } from "./ModuleStatic";
|
|
12
12
|
import { PressableModuleBase } from "./PressableModuleBase";
|
|
13
|
-
const ModuleCredential = props =>
|
|
13
|
+
const ModuleCredential = props => props.isLoading ? /*#__PURE__*/React.createElement(ModuleCredentialSkeleton, null) : /*#__PURE__*/React.createElement(ModuleCredentialContent, props);
|
|
14
|
+
const ModuleCredentialContent = ({
|
|
15
|
+
testID,
|
|
16
|
+
icon,
|
|
17
|
+
image,
|
|
18
|
+
label,
|
|
19
|
+
onPress,
|
|
20
|
+
badge,
|
|
21
|
+
isFetching,
|
|
22
|
+
...pressableProps
|
|
23
|
+
}) => {
|
|
14
24
|
const theme = useIOTheme();
|
|
15
|
-
if (props.isLoading) {
|
|
16
|
-
return /*#__PURE__*/React.createElement(ModuleCredentialSkeleton, null);
|
|
17
|
-
}
|
|
18
|
-
const {
|
|
19
|
-
testID,
|
|
20
|
-
icon,
|
|
21
|
-
image,
|
|
22
|
-
label,
|
|
23
|
-
onPress,
|
|
24
|
-
badge,
|
|
25
|
-
isFetching,
|
|
26
|
-
...pressableProps
|
|
27
|
-
} = props;
|
|
28
25
|
const iconComponent = icon && /*#__PURE__*/React.createElement(Icon, {
|
|
29
26
|
name: icon,
|
|
30
27
|
size: IOSelectionListItemVisualParams.iconSize,
|
|
@@ -35,6 +32,28 @@ const ModuleCredential = props => {
|
|
|
35
32
|
style: styles.image,
|
|
36
33
|
accessibilityIgnoresInvertColors: true
|
|
37
34
|
});
|
|
35
|
+
const endComponent = React.useMemo(() => {
|
|
36
|
+
if (isFetching) {
|
|
37
|
+
return /*#__PURE__*/React.createElement(LoadingSpinner, {
|
|
38
|
+
testID: testID ? `${testID}_activityIndicator` : undefined,
|
|
39
|
+
color: theme["interactiveElem-default"]
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
if (badge) {
|
|
43
|
+
return /*#__PURE__*/React.createElement(Badge, _extends({}, badge, {
|
|
44
|
+
testID: testID ? `${testID}_badge` : undefined
|
|
45
|
+
}));
|
|
46
|
+
}
|
|
47
|
+
if (onPress) {
|
|
48
|
+
return /*#__PURE__*/React.createElement(Icon, {
|
|
49
|
+
testID: testID ? `${testID}_icon` : undefined,
|
|
50
|
+
name: "chevronRightListItem",
|
|
51
|
+
color: theme["interactiveElem-default"],
|
|
52
|
+
size: IOListItemVisualParams.chevronSize
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
return null;
|
|
56
|
+
}, [testID, theme, isFetching, badge, onPress]);
|
|
38
57
|
const ModuleContent = () => /*#__PURE__*/React.createElement(HStack, {
|
|
39
58
|
space: 8,
|
|
40
59
|
style: {
|
|
@@ -55,19 +74,7 @@ const ModuleCredential = props => {
|
|
|
55
74
|
style: {
|
|
56
75
|
flexShrink: 1
|
|
57
76
|
}
|
|
58
|
-
}, label)),
|
|
59
|
-
style: IOStyles.row
|
|
60
|
-
}, badge ? /*#__PURE__*/React.createElement(Badge, _extends({}, badge, {
|
|
61
|
-
testID: testID ? `${testID}_badge` : undefined
|
|
62
|
-
})) : null, isFetching ? /*#__PURE__*/React.createElement(LoadingSpinner, {
|
|
63
|
-
testID: testID ? `${testID}_activityIndicator` : undefined,
|
|
64
|
-
color: theme["interactiveElem-default"]
|
|
65
|
-
}) : onPress ? /*#__PURE__*/React.createElement(Icon, {
|
|
66
|
-
testID: testID ? `${testID}_icon` : undefined,
|
|
67
|
-
name: "chevronRightListItem",
|
|
68
|
-
color: theme["interactiveElem-default"],
|
|
69
|
-
size: IOListItemVisualParams.chevronSize
|
|
70
|
-
}) : null));
|
|
77
|
+
}, label)), endComponent);
|
|
71
78
|
return onPress ? /*#__PURE__*/React.createElement(PressableModuleBase, _extends({}, pressableProps, {
|
|
72
79
|
testID: testID,
|
|
73
80
|
onPress: onPress
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Image","StyleSheet","
|
|
1
|
+
{"version":3,"names":["React","Image","StyleSheet","Placeholder","IOListItemVisualParams","IOSelectionListItemVisualParams","IOVisualCostants","useIOTheme","Badge","Icon","LoadingSpinner","HStack","BodySmall","ModuleStatic","PressableModuleBase","ModuleCredential","props","isLoading","createElement","ModuleCredentialSkeleton","ModuleCredentialContent","testID","icon","image","label","onPress","badge","isFetching","pressableProps","theme","iconComponent","name","size","iconSize","color","imageComponent","source","style","styles","accessibilityIgnoresInvertColors","endComponent","useMemo","undefined","_extends","chevronSize","ModuleContent","space","alignItems","iconMargin","flexGrow","flexShrink","weight","numberOfLines","lineBreakMode","startBlock","Box","animate","width","height","radius","endBlock","create","resizeMode"],"sourceRoot":"../../../../src","sources":["components/modules/ModuleCredential.tsx"],"mappings":"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"}
|
|
@@ -20,7 +20,7 @@ type BaseModuleProps = {
|
|
|
20
20
|
badge?: Badge;
|
|
21
21
|
isFetching?: boolean;
|
|
22
22
|
};
|
|
23
|
-
type ModuleCredentialProps =
|
|
24
|
-
declare const ModuleCredential: (props: WithTestID<ModuleCredentialProps>) => React.JSX.Element;
|
|
23
|
+
type ModuleCredentialProps = BaseModuleProps & ImageProps & PressableModuleBaseProps;
|
|
24
|
+
declare const ModuleCredential: (props: WithTestID<LoadingModuleProps | ModuleCredentialProps>) => React.JSX.Element;
|
|
25
25
|
export { ModuleCredential };
|
|
26
26
|
//# sourceMappingURL=ModuleCredential.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModuleCredential.d.ts","sourceRoot":"","sources":["../../../../src/components/modules/ModuleCredential.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,mBAAmB,EACnB,cAAc,
|
|
1
|
+
{"version":3,"file":"ModuleCredential.d.ts","sourceRoot":"","sources":["../../../../src/components/modules/ModuleCredential.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,mBAAmB,EACnB,cAAc,EAEf,MAAM,cAAc,CAAC;AAStB,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,OAAO,EAAQ,MAAM,UAAU,CAAC;AAKzC,OAAO,EAEL,wBAAwB,EACzB,MAAM,uBAAuB,CAAC;AAE/B,KAAK,UAAU,GACX;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,GAChC;IAAE,IAAI,CAAC,EAAE,KAAK,CAAC;IAAC,KAAK,EAAE,cAAc,GAAG,mBAAmB,CAAA;CAAE,CAAC;AAElE,KAAK,kBAAkB,GAAG;IACxB,SAAS,EAAE,IAAI,CAAC;CACjB,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,qBAAqB,GACtB,eAAe,GAAG,UAAU,GAAG,wBAAwB,CAAC;AAE5D,QAAA,MAAM,gBAAgB,UACb,WAAW,kBAAkB,GAAG,qBAAqB,CAAC,sBAM5D,CAAC;AAoHJ,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -3,15 +3,13 @@ import {
|
|
|
3
3
|
Image,
|
|
4
4
|
ImageSourcePropType,
|
|
5
5
|
ImageURISource,
|
|
6
|
-
StyleSheet
|
|
7
|
-
View
|
|
6
|
+
StyleSheet
|
|
8
7
|
} from "react-native";
|
|
9
8
|
import Placeholder from "rn-placeholder";
|
|
10
9
|
import {
|
|
11
10
|
IOListItemVisualParams,
|
|
12
11
|
IOSelectionListItemVisualParams,
|
|
13
12
|
IOSpacer,
|
|
14
|
-
IOStyles,
|
|
15
13
|
IOVisualCostants,
|
|
16
14
|
useIOTheme
|
|
17
15
|
} from "../../core";
|
|
@@ -43,26 +41,28 @@ type BaseModuleProps = {
|
|
|
43
41
|
};
|
|
44
42
|
|
|
45
43
|
type ModuleCredentialProps =
|
|
46
|
-
|
|
|
47
|
-
| (BaseModuleProps & ImageProps & PressableModuleBaseProps);
|
|
44
|
+
| BaseModuleProps & ImageProps & PressableModuleBaseProps;
|
|
48
45
|
|
|
49
|
-
const ModuleCredential = (
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
46
|
+
const ModuleCredential = (
|
|
47
|
+
props: WithTestID<LoadingModuleProps | ModuleCredentialProps>
|
|
48
|
+
) =>
|
|
49
|
+
props.isLoading ? (
|
|
50
|
+
<ModuleCredentialSkeleton />
|
|
51
|
+
) : (
|
|
52
|
+
<ModuleCredentialContent {...props} />
|
|
53
|
+
);
|
|
55
54
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
55
|
+
const ModuleCredentialContent = ({
|
|
56
|
+
testID,
|
|
57
|
+
icon,
|
|
58
|
+
image,
|
|
59
|
+
label,
|
|
60
|
+
onPress,
|
|
61
|
+
badge,
|
|
62
|
+
isFetching,
|
|
63
|
+
...pressableProps
|
|
64
|
+
}: WithTestID<ModuleCredentialProps>) => {
|
|
65
|
+
const theme = useIOTheme();
|
|
66
66
|
|
|
67
67
|
const iconComponent = icon && (
|
|
68
68
|
<Icon
|
|
@@ -80,6 +80,33 @@ const ModuleCredential = (props: WithTestID<ModuleCredentialProps>) => {
|
|
|
80
80
|
/>
|
|
81
81
|
);
|
|
82
82
|
|
|
83
|
+
const endComponent = React.useMemo(() => {
|
|
84
|
+
if (isFetching) {
|
|
85
|
+
return (
|
|
86
|
+
<LoadingSpinner
|
|
87
|
+
testID={testID ? `${testID}_activityIndicator` : undefined}
|
|
88
|
+
color={theme["interactiveElem-default"]}
|
|
89
|
+
/>
|
|
90
|
+
);
|
|
91
|
+
}
|
|
92
|
+
if (badge) {
|
|
93
|
+
return (
|
|
94
|
+
<Badge {...badge} testID={testID ? `${testID}_badge` : undefined} />
|
|
95
|
+
);
|
|
96
|
+
}
|
|
97
|
+
if (onPress) {
|
|
98
|
+
return (
|
|
99
|
+
<Icon
|
|
100
|
+
testID={testID ? `${testID}_icon` : undefined}
|
|
101
|
+
name="chevronRightListItem"
|
|
102
|
+
color={theme["interactiveElem-default"]}
|
|
103
|
+
size={IOListItemVisualParams.chevronSize}
|
|
104
|
+
/>
|
|
105
|
+
);
|
|
106
|
+
}
|
|
107
|
+
return null;
|
|
108
|
+
}, [testID, theme, isFetching, badge, onPress]);
|
|
109
|
+
|
|
83
110
|
const ModuleContent = () => (
|
|
84
111
|
<HStack space={8} style={{ alignItems: "center" }}>
|
|
85
112
|
<HStack
|
|
@@ -99,24 +126,7 @@ const ModuleCredential = (props: WithTestID<ModuleCredentialProps>) => {
|
|
|
99
126
|
{label}
|
|
100
127
|
</BodySmall>
|
|
101
128
|
</HStack>
|
|
102
|
-
|
|
103
|
-
{badge ? (
|
|
104
|
-
<Badge {...badge} testID={testID ? `${testID}_badge` : undefined} />
|
|
105
|
-
) : null}
|
|
106
|
-
{isFetching ? (
|
|
107
|
-
<LoadingSpinner
|
|
108
|
-
testID={testID ? `${testID}_activityIndicator` : undefined}
|
|
109
|
-
color={theme["interactiveElem-default"]}
|
|
110
|
-
/>
|
|
111
|
-
) : onPress ? (
|
|
112
|
-
<Icon
|
|
113
|
-
testID={testID ? `${testID}_icon` : undefined}
|
|
114
|
-
name="chevronRightListItem"
|
|
115
|
-
color={theme["interactiveElem-default"]}
|
|
116
|
-
size={IOListItemVisualParams.chevronSize}
|
|
117
|
-
/>
|
|
118
|
-
) : null}
|
|
119
|
-
</View>
|
|
129
|
+
{endComponent}
|
|
120
130
|
</HStack>
|
|
121
131
|
);
|
|
122
132
|
|