@procivis/one-react-native-components 0.3.62 → 0.3.86

package/lib/module/components/proof-request/v2/share-credential-v2-group.js

@@ -0,0 +1,154 @@
+import React, { useCallback, useMemo } from 'react';
+import { StyleSheet } from 'react-native';
+import Animated, { LinearTransition } from 'react-native-reanimated';
+import { BlurView, CredentialCardShadow, DownIcon, Selector, SelectorStatus, TouchableOpacity, UpIcon } from '../../../ui-components';
+import CredentialGroupHeader from '../../../ui-components/credential/group/credential-group-header';
+import { concatTestID, useCredentialListExpandedCard } from '../../../utils';
+import { GroupedShareCredentialV2Padding, ShareCredentialV2 } from './share-credential-v2';
+const multipleCredentialsSelected = (selectedCredentials, credentialRequestId) => {
+  return selectedCredentials && selectedCredentials[credentialRequestId] && Array.isArray(selectedCredentials[credentialRequestId]) && selectedCredentials[credentialRequestId].length > 1;
+};
+const numberOfCardsForRequest = (selectedCredentials, credentialRequestId) => {
+  if (!selectedCredentials || !selectedCredentials[credentialRequestId]) {
+    return 1;
+  }
+  const selection = selectedCredentials[credentialRequestId];
+  if (Array.isArray(selection)) {
+    return selection.length;
+  }
+  return 1;
+};
+const heightForNumberOfCards = numberOfCards => 60 * (numberOfCards + 1) + 12 * numberOfCards;
+export const ShareCredentialV2Group = ({
+  labels,
+  lastGroup,
+  onGroupSelect,
+  onImagePreview,
+  onSelectCredential,
+  onSelectField,
+  presentationDefinition,
+  requestGroup,
+  selected,
+  selectedCredentials = {},
+  style,
+  testID,
+  valid
+}) => {
+  const {
+    expandedCredential,
+    onHeaderPress
+  } = useCredentialListExpandedCard();
+  const numberOfCards = requestGroup.reduce((acc, groupId) => acc + numberOfCardsForRequest(selectedCredentials, groupId), 0);
+  const singleCredentialGroup = requestGroup.length === 1 && !multipleCredentialsSelected(selectedCredentials, requestGroup[0]);
+  const headerPressHandler = useCallback(() => {
+    onGroupSelect === null || onGroupSelect === void 0 || onGroupSelect(!selected);
+  }, [selected, onGroupSelect]);
+  const onNestedCardHeaderPress = useCallback(credentialId => () => {
+    if (!selected) {
+      onGroupSelect === null || onGroupSelect === void 0 || onGroupSelect(true);
+    }
+    onHeaderPress(credentialId);
+  }, [selected, onGroupSelect, onHeaderPress]);
+  const credentialCards = useMemo(() => {
+    return requestGroup.flatMap((credentialRequestId, credentialRequestIndex, {
+      length: credentialRequestsLength
+    }) => {
+      const lastQuery = credentialRequestIndex === credentialRequestsLength - 1;
+      const credentialQuery = presentationDefinition.credentialQueries[credentialRequestId];
+      let defaultSelection;
+      if ('applicableCredentials' in credentialQuery) {
+        var _credentialQuery$appl;
+        defaultSelection = (_credentialQuery$appl = credentialQuery.applicableCredentials) !== null && _credentialQuery$appl !== void 0 && _credentialQuery$appl[0] ? {
+          credentialId: credentialQuery.applicableCredentials[0].id,
+          userSelections: []
+        } : {
+          credentialId: '',
+          userSelections: []
+        };
+      } else {
+        defaultSelection = {
+          credentialId: '',
+          userSelections: []
+        };
+      }
+      const request = selectedCredentials[credentialRequestId];
+      const credentialSelections = request ? Array.isArray(request) ? request : [request] : [defaultSelection];
+      return credentialSelections === null || credentialSelections === void 0 ? void 0 : credentialSelections.flatMap((credentialRequest, credentialIndex, {
+        length: credentialsLength
+      }) => {
+        const selectedFields = credentialRequest.userSelections;
+        const cardId = `${credentialRequestId}-${credentialRequest.credentialId}`;
+        const lastItem = singleCredentialGroup ? lastGroup : lastQuery && credentialIndex === credentialsLength - 1;
+        const cardExpanded = selected && (singleCredentialGroup || expandedCredential === cardId);
+        const headerAccessory = singleCredentialGroup && valid ? /*#__PURE__*/React.createElement(Selector, {
+          status: selected ? SelectorStatus.SelectedRadio : SelectorStatus.Empty
+        }) : cardExpanded ? UpIcon : DownIcon;
+        return /*#__PURE__*/React.createElement(ShareCredentialV2, {
+          credentialQuery: credentialQuery,
+          credentialRequestId: credentialRequestId,
+          expanded: cardExpanded,
+          grouped: !singleCredentialGroup,
+          headerAccessory: headerAccessory,
+          key: credentialRequestId,
+          labels: labels,
+          lastItem: lastItem,
+          onHeaderPress: singleCredentialGroup ? headerPressHandler : onNestedCardHeaderPress(cardId),
+          onImagePreview: onImagePreview,
+          onSelectCredential: onSelectCredential === null || onSelectCredential === void 0 ? void 0 : onSelectCredential(credentialRequestId),
+          onSelectField: onSelectField(credentialRequestId),
+          selectedCredentialId: credentialRequest.credentialId,
+          selectedFields: selectedFields,
+          style: [!singleCredentialGroup && styles.requestedCredential, lastItem && styles.requestedCredentialLast],
+          testID: concatTestID(testID, credentialRequestId)
+        });
+      });
+    });
+  }, [expandedCredential, labels, lastGroup, headerPressHandler, onImagePreview, onNestedCardHeaderPress, onSelectCredential, onSelectField, presentationDefinition.credentialQueries, requestGroup, selected, selectedCredentials, singleCredentialGroup, testID, valid]);
+  if (singleCredentialGroup) {
+    return credentialCards[0];
+  }
+  const groupHeaderAccessory = valid ? /*#__PURE__*/React.createElement(Selector, {
+    status: selected ? SelectorStatus.SelectedRadio : SelectorStatus.Empty
+  }) : selected ? UpIcon : DownIcon;
+  return /*#__PURE__*/React.createElement(Animated.View, {
+    layout: LinearTransition,
+    style: [styles.animatedWrapper,
+    // eslint-disable-next-line react-native/no-inline-styles
+    {
+      height: selected || lastGroup ? 'auto' : heightForNumberOfCards(numberOfCards)
+    }, style]
+  }, /*#__PURE__*/React.createElement(Animated.View, {
+    layout: LinearTransition,
+    style: [singleCredentialGroup ? undefined : styles.groupedCredentialsWrapper, !singleCredentialGroup && styles.requestedCredential, lastGroup && styles.requestedCredentialLast, style]
+  }, /*#__PURE__*/React.createElement(BlurView, {
+    blurStyle: "strong",
+    darkMode: true,
+    style: StyleSheet.absoluteFill
+  }), /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: headerPressHandler
+  }, /*#__PURE__*/React.createElement(CredentialGroupHeader, {
+    accessory: groupHeaderAccessory,
+    name: labels.groupHeader,
+    style: styles.header
+  })), credentialCards));
+};
+const styles = StyleSheet.create({
+  animatedWrapper: {
+    ...CredentialCardShadow
+  },
+  groupedCredentialsWrapper: {
+    borderRadius: 10 + GroupedShareCredentialV2Padding,
+    overflow: 'hidden',
+    paddingBottom: GroupedShareCredentialV2Padding
+  },
+  header: {
+    marginBottom: GroupedShareCredentialV2Padding
+  },
+  requestedCredential: {
+    marginBottom: 12
+  },
+  requestedCredentialLast: {
+    marginBottom: 0
+  }
+});
+//# sourceMappingURL=share-credential-v2-group.js.map

package/lib/module/components/proof-request/v2/share-credential-v2-group.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMemo","StyleSheet","Animated","LinearTransition","BlurView","CredentialCardShadow","DownIcon","Selector","SelectorStatus","TouchableOpacity","UpIcon","CredentialGroupHeader","concatTestID","useCredentialListExpandedCard","GroupedShareCredentialV2Padding","ShareCredentialV2","multipleCredentialsSelected","selectedCredentials","credentialRequestId","Array","isArray","length","numberOfCardsForRequest","selection","heightForNumberOfCards","numberOfCards","ShareCredentialV2Group","labels","lastGroup","onGroupSelect","onImagePreview","onSelectCredential","onSelectField","presentationDefinition","requestGroup","selected","style","testID","valid","expandedCredential","onHeaderPress","reduce","acc","groupId","singleCredentialGroup","headerPressHandler","onNestedCardHeaderPress","credentialId","credentialCards","flatMap","credentialRequestIndex","credentialRequestsLength","lastQuery","credentialQuery","credentialQueries","defaultSelection","_credentialQuery$appl","applicableCredentials","id","userSelections","request","credentialSelections","credentialRequest","credentialIndex","credentialsLength","selectedFields","cardId","lastItem","cardExpanded","headerAccessory","createElement","status","SelectedRadio","Empty","expanded","grouped","key","selectedCredentialId","styles","requestedCredential","requestedCredentialLast","groupHeaderAccessory","View","layout","animatedWrapper","height","undefined","groupedCredentialsWrapper","blurStyle","darkMode","absoluteFill","onPress","accessory","name","groupHeader","header","create","borderRadius","overflow","paddingBottom","marginBottom"],"sources":["share-credential-v2-group.tsx"],"sourcesContent":["import {\n  CredentialListItem,\n  PresentationDefinitionV2,\n  PresentationDefinitionV2CredentialClaim,\n  PresentationSubmitV2CredentialRequest,\n} from '@procivis/react-native-one-core';\nimport React, { FC, useCallback, useMemo } from 'react';\nimport { ImageSourcePropType, StyleProp, StyleSheet, ViewStyle } from 'react-native';\nimport Animated, { LinearTransition } from 'react-native-reanimated';\n\nimport {\n  BlurView,\n  CredentialCardShadow,\n  DownIcon,\n  Selector,\n  SelectorStatus,\n  TouchableOpacity,\n  UpIcon,\n} from '../../../ui-components';\nimport CredentialGroupHeader from '../../../ui-components/credential/group/credential-group-header';\nimport { concatTestID, useCredentialListExpandedCard } from '../../../utils';\nimport { ShareCredentialLabels } from '../v1/share-credential';\nimport { GroupedShareCredentialV2Padding, ShareCredentialV2 } from './share-credential-v2';\n\nexport type CredentialQuerySelection = Record<\n  string,\n  PresentationSubmitV2CredentialRequest | PresentationSubmitV2CredentialRequest[]\n>;\n\nexport type ShareCredentialGroupLabels = ShareCredentialLabels & {\n  groupHeader: string;\n};\n\nexport type ShareCredentialV2GroupProps = {\n  labels: ShareCredentialGroupLabels;\n  lastGroup: boolean;\n  onGroupSelect?: (selected: boolean) => void;\n  onImagePreview: (title: string, image: ImageSourcePropType) => void;\n  onSelectCredential: (requestCredentialId: string) => () => void;\n  onSelectField: (\n    requestCredentialId: string,\n  ) => (\n    credentialId: CredentialListItem['id'],\n    fieldPath: PresentationDefinitionV2CredentialClaim['path'],\n    selected: boolean,\n  ) => void;\n  presentationDefinition: PresentationDefinitionV2;\n  requestGroup: string[];\n  selected?: boolean;\n  selectedCredentials?: CredentialQuerySelection;\n  style?: StyleProp<ViewStyle>;\n  testID: string;\n  valid: boolean;\n};\n\nconst multipleCredentialsSelected = (\n  selectedCredentials: CredentialQuerySelection | undefined,\n  credentialRequestId: string,\n) => {\n  return (\n    selectedCredentials &&\n    selectedCredentials[credentialRequestId] &&\n    Array.isArray(selectedCredentials[credentialRequestId]) &&\n    (selectedCredentials[credentialRequestId] as PresentationSubmitV2CredentialRequest[]).length > 1\n  );\n};\n\nconst numberOfCardsForRequest = (\n  selectedCredentials: CredentialQuerySelection | undefined,\n  credentialRequestId: string,\n) => {\n  if (!selectedCredentials || !selectedCredentials[credentialRequestId]) {\n    return 1;\n  }\n  const selection = selectedCredentials[credentialRequestId];\n  if (Array.isArray(selection)) {\n    return selection.length;\n  }\n  return 1;\n};\n\nconst heightForNumberOfCards = (numberOfCards: number) => 60 * (numberOfCards + 1) + 12 * numberOfCards;\n\nexport const ShareCredentialV2Group: FC<ShareCredentialV2GroupProps> = ({\n  labels,\n  lastGroup,\n  onGroupSelect,\n  onImagePreview,\n  onSelectCredential,\n  onSelectField,\n  presentationDefinition,\n  requestGroup,\n  selected,\n  selectedCredentials = {},\n  style,\n  testID,\n  valid,\n}) => {\n  const { expandedCredential, onHeaderPress } = useCredentialListExpandedCard();\n  const numberOfCards = requestGroup.reduce(\n    (acc, groupId) => acc + numberOfCardsForRequest(selectedCredentials, groupId),\n    0,\n  );\n  const singleCredentialGroup =\n    requestGroup.length === 1 && !multipleCredentialsSelected(selectedCredentials, requestGroup[0]);\n\n  const headerPressHandler = useCallback(() => {\n    onGroupSelect?.(!selected);\n  }, [selected, onGroupSelect]);\n\n  const onNestedCardHeaderPress = useCallback(\n    (credentialId: string) => () => {\n      if (!selected) {\n        onGroupSelect?.(true);\n      }\n      onHeaderPress(credentialId);\n    },\n    [selected, onGroupSelect, onHeaderPress],\n  );\n\n  const credentialCards = useMemo(() => {\n    return requestGroup.flatMap((credentialRequestId, credentialRequestIndex, { length: credentialRequestsLength }) => {\n      const lastQuery = credentialRequestIndex === credentialRequestsLength - 1;\n\n      const credentialQuery = presentationDefinition.credentialQueries[credentialRequestId];\n      let defaultSelection: PresentationSubmitV2CredentialRequest;\n      if ('applicableCredentials' in credentialQuery) {\n        defaultSelection = credentialQuery.applicableCredentials?.[0]\n          ? {\n              credentialId: credentialQuery.applicableCredentials[0].id,\n              userSelections: [],\n            }\n          : {\n              credentialId: '',\n              userSelections: [],\n            };\n      } else {\n        defaultSelection = {\n          credentialId: '',\n          userSelections: [],\n        };\n      }\n      const request = selectedCredentials[credentialRequestId];\n      const credentialSelections = request ? (Array.isArray(request) ? request : [request]) : [defaultSelection];\n\n      return credentialSelections?.flatMap((credentialRequest, credentialIndex, { length: credentialsLength }) => {\n        const selectedFields = credentialRequest.userSelections;\n        const cardId = `${credentialRequestId}-${credentialRequest.credentialId}`;\n        const lastItem = singleCredentialGroup ? lastGroup : lastQuery && credentialIndex === credentialsLength - 1;\n        const cardExpanded = selected && (singleCredentialGroup || expandedCredential === cardId);\n        const headerAccessory =\n          singleCredentialGroup && valid ? (\n            <Selector status={selected ? SelectorStatus.SelectedRadio : SelectorStatus.Empty} />\n          ) : cardExpanded ? (\n            UpIcon\n          ) : (\n            DownIcon\n          );\n        return (\n          <ShareCredentialV2\n            credentialQuery={credentialQuery}\n            credentialRequestId={credentialRequestId}\n            expanded={cardExpanded}\n            grouped={!singleCredentialGroup}\n            headerAccessory={headerAccessory}\n            key={credentialRequestId}\n            labels={labels}\n            lastItem={lastItem}\n            onHeaderPress={singleCredentialGroup ? headerPressHandler : onNestedCardHeaderPress(cardId)}\n            onImagePreview={onImagePreview}\n            onSelectCredential={onSelectCredential?.(credentialRequestId)}\n            onSelectField={onSelectField(credentialRequestId)}\n            selectedCredentialId={credentialRequest.credentialId}\n            selectedFields={selectedFields}\n            style={[!singleCredentialGroup && styles.requestedCredential, lastItem && styles.requestedCredentialLast]}\n            testID={concatTestID(testID, credentialRequestId)}\n          />\n        );\n      });\n    });\n  }, [\n    expandedCredential,\n    labels,\n    lastGroup,\n    headerPressHandler,\n    onImagePreview,\n    onNestedCardHeaderPress,\n    onSelectCredential,\n    onSelectField,\n    presentationDefinition.credentialQueries,\n    requestGroup,\n    selected,\n    selectedCredentials,\n    singleCredentialGroup,\n    testID,\n    valid,\n  ]);\n\n  if (singleCredentialGroup) {\n    return credentialCards[0];\n  }\n\n  const groupHeaderAccessory = valid ? (\n    <Selector status={selected ? SelectorStatus.SelectedRadio : SelectorStatus.Empty} />\n  ) : selected ? (\n    UpIcon\n  ) : (\n    DownIcon\n  );\n\n  return (\n    <Animated.View\n      layout={LinearTransition}\n      style={[\n        styles.animatedWrapper,\n        // eslint-disable-next-line react-native/no-inline-styles\n        {\n          height: selected || lastGroup ? 'auto' : heightForNumberOfCards(numberOfCards),\n        },\n        style,\n      ]}>\n      <Animated.View\n        layout={LinearTransition}\n        style={[\n          singleCredentialGroup ? undefined : styles.groupedCredentialsWrapper,\n          !singleCredentialGroup && styles.requestedCredential,\n          lastGroup && styles.requestedCredentialLast,\n          style,\n        ]}>\n        <BlurView blurStyle=\"strong\" darkMode={true} style={StyleSheet.absoluteFill} />\n        <TouchableOpacity onPress={headerPressHandler}>\n          <CredentialGroupHeader accessory={groupHeaderAccessory} name={labels.groupHeader} style={styles.header} />\n        </TouchableOpacity>\n        {credentialCards}\n      </Animated.View>\n    </Animated.View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  animatedWrapper: {\n    ...CredentialCardShadow,\n  },\n  groupedCredentialsWrapper: {\n    borderRadius: 10 + GroupedShareCredentialV2Padding,\n    overflow: 'hidden',\n    paddingBottom: GroupedShareCredentialV2Padding,\n  },\n  header: {\n    marginBottom: GroupedShareCredentialV2Padding,\n  },\n  requestedCredential: {\n    marginBottom: 12,\n  },\n  requestedCredentialLast: {\n    marginBottom: 0,\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/module/components/proof-request/v2/share-credential-v2.js

@@ -0,0 +1,126 @@
+import React, { useCallback, useMemo } from 'react';
+import { Dimensions, StyleSheet } from 'react-native';
+import { CredentialDetailsCardListItem, useAppColorScheme } from '../../../ui-components';
+import { concatTestID, getValidityState, useCoreConfig, useWalletUnitAttestation, ValidityState, walletUnitAttestationState } from '../../../utils';
+import { shareCredentialCardFromV2PresentationCredential } from '../../../utils/parsers/credential-sharing-v2';
+import { SelectShareCredentialCardNotice } from '../select-share-credential-card-notice';
+import { ShareCredentialCardNotice } from '../share-credential-card-notice';
+export const GroupedShareCredentialV2Padding = 4;
+export const ShareCredentialV2 = ({
+  credentialQuery,
+  credentialRequestId,
+  expanded,
+  grouped,
+  headerAccessory,
+  labels,
+  lastItem,
+  onHeaderPress,
+  onImagePreview,
+  onSelectCredential,
+  onSelectField,
+  selectedCredentialId,
+  selectedFields,
+  style,
+  testID
+}) => {
+  var _applicableCredential, _credential$issuer;
+  const colorScheme = useAppColorScheme();
+  const applicableCredentials = 'applicableCredentials' in credentialQuery ? credentialQuery.applicableCredentials : undefined;
+  const failureHint = 'failureHint' in credentialQuery ? credentialQuery.failureHint : undefined;
+  const credential = (_applicableCredential = applicableCredentials === null || applicableCredentials === void 0 ? void 0 : applicableCredentials.find(c => c.id === selectedCredentialId)) !== null && _applicableCredential !== void 0 ? _applicableCredential : applicableCredentials === null || applicableCredentials === void 0 ? void 0 : applicableCredentials[0];
+  const {
+    data: config
+  } = useCoreConfig();
+  const {
+    data: walletUnitAttestation,
+    isLoading: isLoadingWUA
+  } = useWalletUnitAttestation();
+  const cardWidth = useMemo(() => Dimensions.get('window').width - 32 - (grouped ? GroupedShareCredentialV2Padding * 2 : 0), [grouped]);
+  const multipleCredentialsAvailable = Boolean((applicableCredentials === null || applicableCredentials === void 0 ? void 0 : applicableCredentials.length) && applicableCredentials.length > 1);
+  const validityState = getValidityState(credential ? {
+    ...credential,
+    issuer: credential === null || credential === void 0 || (_credential$issuer = credential.issuer) === null || _credential$issuer === void 0 ? void 0 : _credential$issuer.id
+  } : undefined);
+  const footer = useMemo(() => {
+    if (!expanded) {
+      return;
+    }
+    if (validityState === ValidityState.Revoked) {
+      return /*#__PURE__*/React.createElement(ShareCredentialCardNotice, {
+        testID: concatTestID(testID, 'notice.revoked'),
+        text: labels.revokedCredentialNotice
+      });
+    }
+    if (validityState === ValidityState.Suspended) {
+      return /*#__PURE__*/React.createElement(ShareCredentialCardNotice, {
+        testID: concatTestID(testID, 'notice.suspended'),
+        text: labels.suspendedCredentialNotice
+      });
+    }
+    if ((failureHint === null || failureHint === void 0 ? void 0 : failureHint.reason) === 'VALIDITY') {
+      return /*#__PURE__*/React.createElement(ShareCredentialCardNotice, {
+        testID: concatTestID(testID, 'notice.invalid'),
+        text: labels.invalidCredentialNotice
+      });
+    }
+    if (multipleCredentialsAvailable) {
+      return /*#__PURE__*/React.createElement(SelectShareCredentialCardNotice, {
+        buttonTitle: labels.multipleCredentialsSelect,
+        onPress: onSelectCredential,
+        testID: concatTestID(testID, 'notice.multiple'),
+        text: labels.multipleCredentialsNotice
+      });
+    }
+  }, [expanded, failureHint === null || failureHint === void 0 ? void 0 : failureHint.reason, labels.invalidCredentialNotice, labels.multipleCredentialsNotice, labels.multipleCredentialsSelect, labels.revokedCredentialNotice, labels.suspendedCredentialNotice, multipleCredentialsAvailable, onSelectCredential, testID, validityState]);
+  const onAttributeSelected = useCallback((fieldPath, selected) => {
+    if (!selectedCredentialId) {
+      return;
+    }
+    onSelectField(selectedCredentialId, fieldPath, selected);
+  }, [onSelectField, selectedCredentialId]);
+  if (!config || isLoadingWUA) {
+    return null;
+  }
+  const {
+    card: {
+      header,
+      ...card
+    },
+    attributes
+  } = shareCredentialCardFromV2PresentationCredential(credential, failureHint, Boolean(expanded), multipleCredentialsAvailable, selectedFields, config, walletUnitAttestationState(walletUnitAttestation), testID, labels);
+  if (headerAccessory) {
+    header.accessory = headerAccessory;
+  }
+  return /*#__PURE__*/React.createElement(CredentialDetailsCardListItem, {
+    attributes: attributes,
+    card: {
+      ...card,
+      credentialId: credentialRequestId,
+      header,
+      onHeaderPress,
+      width: cardWidth
+    },
+    expanded: expanded,
+    footer: footer,
+    lastItem: lastItem,
+    onAttributeSelected: onAttributeSelected,
+    onImagePreview: onImagePreview,
+    style: [styles.credential, grouped ? styles.groupedCredential : styles.bordered, {
+      borderColor: colorScheme.background
+    }, style],
+    testID: testID
+  });
+};
+const styles = StyleSheet.create({
+  bordered: {
+    borderWidth: 1
+  },
+  credential: {
+    borderRadius: 10,
+    marginBottom: 8
+  },
+  groupedCredential: {
+    marginHorizontal: GroupedShareCredentialV2Padding
+  }
+});
+//# sourceMappingURL=share-credential-v2.js.map

package/lib/module/components/proof-request/v2/share-credential-v2.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMemo","Dimensions","StyleSheet","CredentialDetailsCardListItem","useAppColorScheme","concatTestID","getValidityState","useCoreConfig","useWalletUnitAttestation","ValidityState","walletUnitAttestationState","shareCredentialCardFromV2PresentationCredential","SelectShareCredentialCardNotice","ShareCredentialCardNotice","GroupedShareCredentialV2Padding","ShareCredentialV2","credentialQuery","credentialRequestId","expanded","grouped","headerAccessory","labels","lastItem","onHeaderPress","onImagePreview","onSelectCredential","onSelectField","selectedCredentialId","selectedFields","style","testID","_applicableCredential","_credential$issuer","colorScheme","applicableCredentials","undefined","failureHint","credential","find","c","id","data","config","walletUnitAttestation","isLoading","isLoadingWUA","cardWidth","get","width","multipleCredentialsAvailable","Boolean","length","validityState","issuer","footer","Revoked","createElement","text","revokedCredentialNotice","Suspended","suspendedCredentialNotice","reason","invalidCredentialNotice","buttonTitle","multipleCredentialsSelect","onPress","multipleCredentialsNotice","onAttributeSelected","fieldPath","selected","card","header","attributes","accessory","credentialId","styles","groupedCredential","bordered","borderColor","background","create","borderWidth","borderRadius","marginBottom","marginHorizontal"],"sources":["share-credential-v2.tsx"],"sourcesContent":["import {\n  CredentialListItem,\n  PresentationDefinitionV2CredentialClaim,\n  PresentationDefinitionV2CredentialQuery,\n} from '@procivis/react-native-one-core';\nimport React, { FunctionComponent, useCallback, useMemo } from 'react';\nimport { Dimensions, ImageSourcePropType, StyleProp, StyleSheet, ViewStyle } from 'react-native';\n\nimport { CredentialDetailsCardListItem, useAppColorScheme } from '../../../ui-components';\nimport {\n  concatTestID,\n  getValidityState,\n  useCoreConfig,\n  useWalletUnitAttestation,\n  ValidityState,\n  walletUnitAttestationState,\n} from '../../../utils';\nimport { shareCredentialCardFromV2PresentationCredential } from '../../../utils/parsers/credential-sharing-v2';\nimport { SelectShareCredentialCardNotice } from '../select-share-credential-card-notice';\nimport { ShareCredentialCardNotice } from '../share-credential-card-notice';\nimport { ShareCredentialLabels } from '../v1';\n\nexport type ShareCredentialV2Props = {\n  credentialQuery: PresentationDefinitionV2CredentialQuery;\n  credentialRequestId: string;\n  expanded?: boolean;\n  grouped?: boolean;\n  headerAccessory?: React.ComponentType<any> | React.ReactElement;\n  labels: ShareCredentialLabels;\n  lastItem?: boolean;\n  onHeaderPress?: (_credentialId?: string) => void;\n  onImagePreview: (title: string, image: ImageSourcePropType) => void;\n  onSelectCredential?: () => void;\n  onSelectField: (\n    credentialId: CredentialListItem['id'],\n    fieldPath: PresentationDefinitionV2CredentialClaim['path'],\n    selected: boolean,\n  ) => void;\n  selectedCredentialId?: CredentialListItem['id'];\n  selectedFields?: Array<PresentationDefinitionV2CredentialClaim['path']>;\n  style?: StyleProp<ViewStyle>;\n  testID: string;\n};\n\nexport const GroupedShareCredentialV2Padding = 4;\n\nexport const ShareCredentialV2: FunctionComponent<ShareCredentialV2Props> = ({\n  credentialQuery,\n  credentialRequestId,\n  expanded,\n  grouped,\n  headerAccessory,\n  labels,\n  lastItem,\n  onHeaderPress,\n  onImagePreview,\n  onSelectCredential,\n  onSelectField,\n  selectedCredentialId,\n  selectedFields,\n  style,\n  testID,\n}) => {\n  const colorScheme = useAppColorScheme();\n  const applicableCredentials =\n    'applicableCredentials' in credentialQuery ? credentialQuery.applicableCredentials : undefined;\n  const failureHint = 'failureHint' in credentialQuery ? credentialQuery.failureHint : undefined;\n  const credential = applicableCredentials?.find((c) => c.id === selectedCredentialId) ?? applicableCredentials?.[0];\n  const { data: config } = useCoreConfig();\n  const { data: walletUnitAttestation, isLoading: isLoadingWUA } = useWalletUnitAttestation();\n  const cardWidth = useMemo(\n    () => Dimensions.get('window').width - 32 - (grouped ? GroupedShareCredentialV2Padding * 2 : 0),\n    [grouped],\n  );\n\n  const multipleCredentialsAvailable = Boolean(applicableCredentials?.length && applicableCredentials.length > 1);\n\n  const validityState = getValidityState(\n    credential\n      ? {\n          ...credential,\n          issuer: credential?.issuer?.id,\n        }\n      : undefined,\n  );\n\n  const footer = useMemo(() => {\n    if (!expanded) {\n      return;\n    }\n    if (validityState === ValidityState.Revoked) {\n      return (\n        <ShareCredentialCardNotice\n          testID={concatTestID(testID, 'notice.revoked')}\n          text={labels.revokedCredentialNotice}\n        />\n      );\n    }\n    if (validityState === ValidityState.Suspended) {\n      return (\n        <ShareCredentialCardNotice\n          testID={concatTestID(testID, 'notice.suspended')}\n          text={labels.suspendedCredentialNotice}\n        />\n      );\n    }\n\n    if (failureHint?.reason === 'VALIDITY') {\n      return (\n        <ShareCredentialCardNotice\n          testID={concatTestID(testID, 'notice.invalid')}\n          text={labels.invalidCredentialNotice}\n        />\n      );\n    }\n\n    if (multipleCredentialsAvailable) {\n      return (\n        <SelectShareCredentialCardNotice\n          buttonTitle={labels.multipleCredentialsSelect}\n          onPress={onSelectCredential}\n          testID={concatTestID(testID, 'notice.multiple')}\n          text={labels.multipleCredentialsNotice}\n        />\n      );\n    }\n  }, [\n    expanded,\n    failureHint?.reason,\n    labels.invalidCredentialNotice,\n    labels.multipleCredentialsNotice,\n    labels.multipleCredentialsSelect,\n    labels.revokedCredentialNotice,\n    labels.suspendedCredentialNotice,\n    multipleCredentialsAvailable,\n    onSelectCredential,\n    testID,\n    validityState,\n  ]);\n\n  const onAttributeSelected = useCallback(\n    (fieldPath: PresentationDefinitionV2CredentialClaim['path'], selected: boolean) => {\n      if (!selectedCredentialId) {\n        return;\n      }\n      onSelectField(selectedCredentialId, fieldPath, selected);\n    },\n    [onSelectField, selectedCredentialId],\n  );\n\n  if (!config || isLoadingWUA) {\n    return null;\n  }\n\n  const {\n    card: { header, ...card },\n    attributes,\n  } = shareCredentialCardFromV2PresentationCredential(\n    credential,\n    failureHint,\n    Boolean(expanded),\n    multipleCredentialsAvailable,\n    selectedFields,\n    config,\n    walletUnitAttestationState(walletUnitAttestation),\n    testID,\n    labels,\n  );\n\n  if (headerAccessory) {\n    header.accessory = headerAccessory;\n  }\n\n  return (\n    <CredentialDetailsCardListItem\n      attributes={attributes}\n      card={{\n        ...card,\n        credentialId: credentialRequestId,\n        header,\n        onHeaderPress,\n        width: cardWidth,\n      }}\n      expanded={expanded}\n      footer={footer}\n      lastItem={lastItem}\n      onAttributeSelected={onAttributeSelected}\n      onImagePreview={onImagePreview}\n      style={[\n        styles.credential,\n        grouped ? styles.groupedCredential : styles.bordered,\n        { borderColor: colorScheme.background },\n        style,\n      ]}\n      testID={testID}\n    />\n  );\n};\n\nconst styles = StyleSheet.create({\n  bordered: {\n    borderWidth: 1,\n  },\n  credential: {\n    borderRadius: 10,\n    marginBottom: 8,\n  },\n  groupedCredential: {\n    marginHorizontal: GroupedShareCredentialV2Padding,\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/module/ui-components/buttons/index.js

@@ -5,5 +5,6 @@ import FilterButton from './filter-button';
 import GhostButton from './ghost-button';
 import HoldButton from './hold-button';
 import ScanButton from './scan-button';
-export { BackButton, BackButtonIcon, Button, ButtonType, ConnectivityButton, ConnectivityTransport, FilterButton, GhostButton, HoldButton, ScanButton };
+import ShareButton from './share-button';
+export { BackButton, BackButtonIcon, Button, ButtonType, ConnectivityButton, ConnectivityTransport, FilterButton, GhostButton, HoldButton, ScanButton, ShareButton };
 //# sourceMappingURL=index.js.map

package/lib/module/ui-components/buttons/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["BackButton","BackButtonIcon","Button","ButtonType","ConnectivityButton","ConnectivityTransport","FilterButton","GhostButton","HoldButton","ScanButton"],"sources":["index.ts"],"sourcesContent":["import type { BackButtonProps } from './back-button';\nimport BackButton, { BackButtonIcon } from './back-button';\nimport type { ButtonProps } from './button';\nimport { Button, ButtonType } from './button';\nimport type { ConnectivityButtonProps } from './connectivity-button';\nimport ConnectivityButton, { ConnectivityTransport } from './connectivity-button';\nimport type { FilterButtonProps } from './filter-button';\nimport FilterButton from './filter-button';\nimport type { GhostButtonProps } from './ghost-button';\nimport GhostButton from './ghost-button';\nimport type { HoldButtonProps } from './hold-button';\nimport HoldButton from './hold-button';\nimport type { ScanButtonProps } from './scan-button';\nimport ScanButton from './scan-button';\n\nexport {\n  BackButton,\n  BackButtonIcon,\n  BackButtonProps,\n  Button,\n  ButtonProps,\n  ButtonType,\n  ConnectivityButton,\n  ConnectivityButtonProps,\n  ConnectivityTransport,\n  FilterButton,\n  FilterButtonProps,\n  GhostButton,\n  GhostButtonProps,\n  HoldButton,\n  HoldButtonProps,\n  ScanButton,\n  ScanButtonProps,\n};\n"],"mappings":"AACA,OAAOA,UAAU,IAAIC,cAAc,QAAQ,eAAe;AAE1D,SAASC,MAAM,EAAEC,UAAU,QAAQ,UAAU;AAE7C,OAAOC,kBAAkB,IAAIC,qBAAqB,QAAQ,uBAAuB;AAEjF,OAAOC,YAAY,MAAM,iBAAiB;AAE1C,OAAOC,WAAW,MAAM,gBAAgB;AAExC,OAAOC,UAAU,MAAM,eAAe;AAEtC,OAAOC,UAAU,MAAM,eAAe;AAEtC,SACET,UAAU,EACVC,cAAc,EAEdC,MAAM,EAENC,UAAU,EACVC,kBAAkB,EAElBC,qBAAqB,EACrBC,YAAY,EAEZC,WAAW,EAEXC,UAAU,EAEVC,UAAU","ignoreList":[]}
+{"version":3,"names":["BackButton","BackButtonIcon","Button","ButtonType","ConnectivityButton","ConnectivityTransport","FilterButton","GhostButton","HoldButton","ScanButton","ShareButton"],"sources":["index.ts"],"sourcesContent":["import type { BackButtonProps } from './back-button';\nimport BackButton, { BackButtonIcon } from './back-button';\nimport type { ButtonProps } from './button';\nimport { Button, ButtonType } from './button';\nimport type { ConnectivityButtonProps } from './connectivity-button';\nimport ConnectivityButton, { ConnectivityTransport } from './connectivity-button';\nimport type { FilterButtonProps } from './filter-button';\nimport FilterButton from './filter-button';\nimport type { GhostButtonProps } from './ghost-button';\nimport GhostButton from './ghost-button';\nimport type { HoldButtonProps } from './hold-button';\nimport HoldButton from './hold-button';\nimport type { ScanButtonProps } from './scan-button';\nimport ScanButton from './scan-button';\nimport type { ShareButtonProps } from './share-button';\nimport ShareButton from './share-button';\n\nexport {\n  BackButton,\n  BackButtonIcon,\n  BackButtonProps,\n  Button,\n  ButtonProps,\n  ButtonType,\n  ConnectivityButton,\n  ConnectivityButtonProps,\n  ConnectivityTransport,\n  FilterButton,\n  FilterButtonProps,\n  GhostButton,\n  GhostButtonProps,\n  HoldButton,\n  HoldButtonProps,\n  ScanButton,\n  ScanButtonProps,\n  ShareButton,\n  ShareButtonProps,\n};\n"],"mappings":"AACA,OAAOA,UAAU,IAAIC,cAAc,QAAQ,eAAe;AAE1D,SAASC,MAAM,EAAEC,UAAU,QAAQ,UAAU;AAE7C,OAAOC,kBAAkB,IAAIC,qBAAqB,QAAQ,uBAAuB;AAEjF,OAAOC,YAAY,MAAM,iBAAiB;AAE1C,OAAOC,WAAW,MAAM,gBAAgB;AAExC,OAAOC,UAAU,MAAM,eAAe;AAEtC,OAAOC,UAAU,MAAM,eAAe;AAEtC,OAAOC,WAAW,MAAM,gBAAgB;AAExC,SACEV,UAAU,EACVC,cAAc,EAEdC,MAAM,EAENC,UAAU,EACVC,kBAAkB,EAElBC,qBAAqB,EACrBC,YAAY,EAEZC,WAAW,EAEXC,UAAU,EAEVC,UAAU,EAEVC,WAAW","ignoreList":[]}

package/lib/module/ui-components/buttons/share-button.js

@@ -0,0 +1,47 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { concatTestID } from '../../utils';
+import { TouchableHighlight } from '../accessibility';
+import { LinkIcon } from '../icons';
+import { Typography } from '../text';
+import { useAppColorScheme } from '../theme';
+const ShareButton = ({
+  onPress,
+  style,
+  title,
+  testID
+}) => {
+  const colorScheme = useAppColorScheme();
+  return /*#__PURE__*/React.createElement(TouchableHighlight, {
+    onPress: onPress,
+    style: [styles.button, style],
+    testID: testID
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.container, {
+      backgroundColor: colorScheme.white
+    }]
+  }, /*#__PURE__*/React.createElement(LinkIcon, {
+    color: colorScheme.text
+  }), title && /*#__PURE__*/React.createElement(Typography, {
+    testID: concatTestID(testID, 'title'),
+    color: colorScheme.text,
+    preset: "s"
+  }, title)));
+};
+const styles = StyleSheet.create({
+  button: {
+    borderRadius: 5,
+    overflow: 'hidden'
+  },
+  container: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    gap: 5,
+    height: 32,
+    paddingLeft: 4,
+    paddingRight: 6,
+    paddingVertical: 5
+  }
+});
+export default ShareButton;
+//# sourceMappingURL=share-button.js.map

package/lib/module/ui-components/buttons/share-button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","concatTestID","TouchableHighlight","LinkIcon","Typography","useAppColorScheme","ShareButton","onPress","style","title","testID","colorScheme","createElement","styles","button","container","backgroundColor","white","color","text","preset","create","borderRadius","overflow","alignItems","flexDirection","gap","height","paddingLeft","paddingRight","paddingVertical"],"sources":["share-button.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { concatTestID } from '../../utils';\nimport { TouchableHighlight } from '../accessibility';\nimport { LinkIcon } from '../icons';\nimport { Typography } from '../text';\nimport { useAppColorScheme } from '../theme';\n\nexport type ShareButtonProps = {\n  onPress?: () => void;\n  style?: StyleProp<ViewStyle>;\n  title?: string;\n  testID?: string;\n};\n\nconst ShareButton: FC<ShareButtonProps> = ({\n  onPress,\n  style,\n  title,\n  testID,\n}) => {\n  const colorScheme = useAppColorScheme();\n\n  return (\n    <TouchableHighlight onPress={onPress} style={[styles.button, style]} testID={testID}>\n      <View style={[styles.container, { backgroundColor: colorScheme.white }]}>\n        <LinkIcon color={colorScheme.text} />\n        {title && (\n          <Typography testID={concatTestID(testID, 'title')} color={colorScheme.text} preset=\"s\">\n            {title}\n          </Typography>\n        )}\n      </View>\n    </TouchableHighlight>\n  );\n};\n\nconst styles = StyleSheet.create({\n  button: {\n    borderRadius: 5,\n    overflow: 'hidden',\n  },\n  container: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    gap: 5,\n    height: 32,\n    paddingLeft: 4,\n    paddingRight: 6,\n    paddingVertical: 5,\n  },\n});\n\nexport default ShareButton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAc,OAAO;AACjC,SAAoBC,UAAU,EAAEC,IAAI,QAAmB,cAAc;AAErE,SAASC,YAAY,QAAQ,aAAa;AAC1C,SAASC,kBAAkB,QAAQ,kBAAkB;AACrD,SAASC,QAAQ,QAAQ,UAAU;AACnC,SAASC,UAAU,QAAQ,SAAS;AACpC,SAASC,iBAAiB,QAAQ,UAAU;AAS5C,MAAMC,WAAiC,GAAGA,CAAC;EACzCC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAMC,WAAW,GAAGN,iBAAiB,CAAC,CAAC;EAEvC,oBACEP,KAAA,CAAAc,aAAA,CAACV,kBAAkB;IAACK,OAAO,EAAEA,OAAQ;IAACC,KAAK,EAAE,CAACK,MAAM,CAACC,MAAM,EAAEN,KAAK,CAAE;IAACE,MAAM,EAAEA;EAAO,gBAClFZ,KAAA,CAAAc,aAAA,CAACZ,IAAI;IAACQ,KAAK,EAAE,CAACK,MAAM,CAACE,SAAS,EAAE;MAAEC,eAAe,EAAEL,WAAW,CAACM;IAAM,CAAC;EAAE,gBACtEnB,KAAA,CAAAc,aAAA,CAACT,QAAQ;IAACe,KAAK,EAAEP,WAAW,CAACQ;EAAK,CAAE,CAAC,EACpCV,KAAK,iBACJX,KAAA,CAAAc,aAAA,CAACR,UAAU;IAACM,MAAM,EAAET,YAAY,CAACS,MAAM,EAAE,OAAO,CAAE;IAACQ,KAAK,EAAEP,WAAW,CAACQ,IAAK;IAACC,MAAM,EAAC;EAAG,GACnFX,KACS,CAEV,CACY,CAAC;AAEzB,CAAC;AAED,MAAMI,MAAM,GAAGd,UAAU,CAACsB,MAAM,CAAC;EAC/BP,MAAM,EAAE;IACNQ,YAAY,EAAE,CAAC;IACfC,QAAQ,EAAE;EACZ,CAAC;EACDR,SAAS,EAAE;IACTS,UAAU,EAAE,QAAQ;IACpBC,aAAa,EAAE,KAAK;IACpBC,GAAG,EAAE,CAAC;IACNC,MAAM,EAAE,EAAE;IACVC,WAAW,EAAE,CAAC;IACdC,YAAY,EAAE,CAAC;IACfC,eAAe,EAAE;EACnB;AACF,CAAC,CAAC;AAEF,eAAexB,WAAW","ignoreList":[]}

package/lib/module/ui-components/camera/qr-code-scanner.js

@@ -1,6 +1,8 @@
+import { useIsFocused } from '@react-navigation/native';
 import React, { useMemo } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { Camera, useCameraDevice, useCodeScanner } from 'react-native-vision-camera';
+import { useIsAppActive } from '../../utils';
 import CameraOverlay from './camera-overlay';
 const QRCodeScanner = ({
   cameraOverlay,
@@ -9,6 +11,8 @@ const QRCodeScanner = ({
   noCameraView = null,
   ...viewProps
 }) => {
+  const isFocused = useIsFocused();
+  const isAppActive = useIsAppActive();
   const qrCodeScanner = useCodeScanner({
     codeTypes,
     onCodeScanned: onQRCodeRead
@@ -31,7 +35,7 @@ const QRCodeScanner = ({
   return /*#__PURE__*/React.createElement(View, viewProps, /*#__PURE__*/React.createElement(Camera, {
     codeScanner: qrCodeScanner,
     device: device,
-    isActive: true,
+    isActive: isFocused && isAppActive !== false,
     style: StyleSheet.absoluteFill
   }), cameraOverlayView);
 };

package/lib/module/ui-components/camera/qr-code-scanner.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","StyleSheet","View","Camera","useCameraDevice","useCodeScanner","CameraOverlay","QRCodeScanner","cameraOverlay","codeTypes","onQRCodeRead","noCameraView","viewProps","qrCodeScanner","onCodeScanned","device","cameraOverlayView","createElement","isValidElement","CameraOverlayComponent","codeScanner","isActive","style","absoluteFill"],"sources":["qr-code-scanner.tsx"],"sourcesContent":["import React, { FunctionComponent, useMemo } from 'react';\nimport { StyleSheet, View, ViewProps } from 'react-native';\nimport { Camera, Code, CodeType, useCameraDevice, useCodeScanner } from 'react-native-vision-camera';\n\nimport CameraOverlay from './camera-overlay';\n\nexport type QRCodeScannerProps = ViewProps & {\n  cameraOverlay?: React.ComponentType<any> | React.ReactElement;\n  codeTypes?: CodeType[];\n  noCameraView?: JSX.Element;\n  onQRCodeRead: (code: Code[]) => void;\n};\n\nconst QRCodeScanner: FunctionComponent<QRCodeScannerProps> = ({\n  cameraOverlay,\n  codeTypes = ['qr'],\n  onQRCodeRead,\n  noCameraView = null,\n  ...viewProps\n}) => {\n  const qrCodeScanner = useCodeScanner({\n    codeTypes,\n    onCodeScanned: onQRCodeRead,\n  });\n\n  const device = useCameraDevice('back');\n\n  const cameraOverlayView: React.ReactElement | undefined = useMemo(() => {\n    if (!cameraOverlay) {\n      return <CameraOverlay />;\n    }\n    if (React.isValidElement(cameraOverlay)) {\n      return cameraOverlay;\n    } else {\n      const CameraOverlayComponent = cameraOverlay as React.ComponentType<any>;\n      return <CameraOverlayComponent />;\n    }\n  }, [cameraOverlay]);\n\n  if (!device) {\n    return noCameraView;\n  }\n\n  return (\n    <View {...viewProps}>\n      <Camera codeScanner={qrCodeScanner} device={device} isActive={true} style={StyleSheet.absoluteFill} />\n      {cameraOverlayView}\n    </View>\n  );\n};\n\nexport default QRCodeScanner;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAuBC,OAAO,QAAQ,OAAO;AACzD,SAASC,UAAU,EAAEC,IAAI,QAAmB,cAAc;AAC1D,SAASC,MAAM,EAAkBC,eAAe,EAAEC,cAAc,QAAQ,4BAA4B;AAEpG,OAAOC,aAAa,MAAM,kBAAkB;AAS5C,MAAMC,aAAoD,GAAGA,CAAC;EAC5DC,aAAa;EACbC,SAAS,GAAG,CAAC,IAAI,CAAC;EAClBC,YAAY;EACZC,YAAY,GAAG,IAAI;EACnB,GAAGC;AACL,CAAC,KAAK;EACJ,MAAMC,aAAa,GAAGR,cAAc,CAAC;IACnCI,SAAS;IACTK,aAAa,EAAEJ;EACjB,CAAC,CAAC;EAEF,MAAMK,MAAM,GAAGX,eAAe,CAAC,MAAM,CAAC;EAEtC,MAAMY,iBAAiD,GAAGhB,OAAO,CAAC,MAAM;IACtE,IAAI,CAACQ,aAAa,EAAE;MAClB,oBAAOT,KAAA,CAAAkB,aAAA,CAACX,aAAa,MAAE,CAAC;IAC1B;IACA,iBAAIP,KAAK,CAACmB,cAAc,CAACV,aAAa,CAAC,EAAE;MACvC,OAAOA,aAAa;IACtB,CAAC,MAAM;MACL,MAAMW,sBAAsB,GAAGX,aAAyC;MACxE,oBAAOT,KAAA,CAAAkB,aAAA,CAACE,sBAAsB,MAAE,CAAC;IACnC;EACF,CAAC,EAAE,CAACX,aAAa,CAAC,CAAC;EAEnB,IAAI,CAACO,MAAM,EAAE;IACX,OAAOJ,YAAY;EACrB;EAEA,oBACEZ,KAAA,CAAAkB,aAAA,CAACf,IAAI,EAAKU,SAAS,eACjBb,KAAA,CAAAkB,aAAA,CAACd,MAAM;IAACiB,WAAW,EAAEP,aAAc;IAACE,MAAM,EAAEA,MAAO;IAACM,QAAQ,EAAE,IAAK;IAACC,KAAK,EAAErB,UAAU,CAACsB;EAAa,CAAE,CAAC,EACrGP,iBACG,CAAC;AAEX,CAAC;AAED,eAAeT,aAAa","ignoreList":[]}
+{"version":3,"names":["useIsFocused","React","useMemo","StyleSheet","View","Camera","useCameraDevice","useCodeScanner","useIsAppActive","CameraOverlay","QRCodeScanner","cameraOverlay","codeTypes","onQRCodeRead","noCameraView","viewProps","isFocused","isAppActive","qrCodeScanner","onCodeScanned","device","cameraOverlayView","createElement","isValidElement","CameraOverlayComponent","codeScanner","isActive","style","absoluteFill"],"sources":["qr-code-scanner.tsx"],"sourcesContent":["import { useIsFocused } from '@react-navigation/native';\nimport React, { FunctionComponent, useMemo } from 'react';\nimport { StyleSheet, View, ViewProps } from 'react-native';\nimport { Camera, Code, CodeType, useCameraDevice, useCodeScanner } from 'react-native-vision-camera';\n\nimport { useIsAppActive } from '../../utils';\nimport CameraOverlay from './camera-overlay';\n\nexport type QRCodeScannerProps = ViewProps & {\n  cameraOverlay?: React.ComponentType<any> | React.ReactElement;\n  codeTypes?: CodeType[];\n  noCameraView?: JSX.Element;\n  onQRCodeRead: (code: Code[]) => void;\n};\n\nconst QRCodeScanner: FunctionComponent<QRCodeScannerProps> = ({\n  cameraOverlay,\n  codeTypes = ['qr'],\n  onQRCodeRead,\n  noCameraView = null,\n  ...viewProps\n}) => {\n  const isFocused = useIsFocused();\n  const isAppActive = useIsAppActive();\n  const qrCodeScanner = useCodeScanner({\n    codeTypes,\n    onCodeScanned: onQRCodeRead,\n  });\n\n  const device = useCameraDevice('back');\n\n  const cameraOverlayView = useMemo(() => {\n    if (!cameraOverlay) {\n      return <CameraOverlay />;\n    }\n    if (React.isValidElement(cameraOverlay)) {\n      return cameraOverlay;\n    } else {\n      const CameraOverlayComponent = cameraOverlay as React.ComponentType<any>;\n      return <CameraOverlayComponent />;\n    }\n  }, [cameraOverlay]);\n\n  if (!device) {\n    return noCameraView;\n  }\n\n  return (\n    <View {...viewProps}>\n      <Camera\n        codeScanner={qrCodeScanner}\n        device={device}\n        isActive={isFocused && isAppActive !== false}\n        style={StyleSheet.absoluteFill}\n      />\n      {cameraOverlayView}\n    </View>\n  );\n};\n\nexport default QRCodeScanner;\n"],"mappings":"AAAA,SAASA,YAAY,QAAQ,0BAA0B;AACvD,OAAOC,KAAK,IAAuBC,OAAO,QAAQ,OAAO;AACzD,SAASC,UAAU,EAAEC,IAAI,QAAmB,cAAc;AAC1D,SAASC,MAAM,EAAkBC,eAAe,EAAEC,cAAc,QAAQ,4BAA4B;AAEpG,SAASC,cAAc,QAAQ,aAAa;AAC5C,OAAOC,aAAa,MAAM,kBAAkB;AAS5C,MAAMC,aAAoD,GAAGA,CAAC;EAC5DC,aAAa;EACbC,SAAS,GAAG,CAAC,IAAI,CAAC;EAClBC,YAAY;EACZC,YAAY,GAAG,IAAI;EACnB,GAAGC;AACL,CAAC,KAAK;EACJ,MAAMC,SAAS,GAAGhB,YAAY,CAAC,CAAC;EAChC,MAAMiB,WAAW,GAAGT,cAAc,CAAC,CAAC;EACpC,MAAMU,aAAa,GAAGX,cAAc,CAAC;IACnCK,SAAS;IACTO,aAAa,EAAEN;EACjB,CAAC,CAAC;EAEF,MAAMO,MAAM,GAAGd,eAAe,CAAC,MAAM,CAAC;EAEtC,MAAMe,iBAAiB,GAAGnB,OAAO,CAAC,MAAM;IACtC,IAAI,CAACS,aAAa,EAAE;MAClB,oBAAOV,KAAA,CAAAqB,aAAA,CAACb,aAAa,MAAE,CAAC;IAC1B;IACA,iBAAIR,KAAK,CAACsB,cAAc,CAACZ,aAAa,CAAC,EAAE;MACvC,OAAOA,aAAa;IACtB,CAAC,MAAM;MACL,MAAMa,sBAAsB,GAAGb,aAAyC;MACxE,oBAAOV,KAAA,CAAAqB,aAAA,CAACE,sBAAsB,MAAE,CAAC;IACnC;EACF,CAAC,EAAE,CAACb,aAAa,CAAC,CAAC;EAEnB,IAAI,CAACS,MAAM,EAAE;IACX,OAAON,YAAY;EACrB;EAEA,oBACEb,KAAA,CAAAqB,aAAA,CAAClB,IAAI,EAAKW,SAAS,eACjBd,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACLoB,WAAW,EAAEP,aAAc;IAC3BE,MAAM,EAAEA,MAAO;IACfM,QAAQ,EAAEV,SAAS,IAAIC,WAAW,KAAK,KAAM;IAC7CU,KAAK,EAAExB,UAAU,CAACyB;EAAa,CAChC,CAAC,EACDP,iBACG,CAAC;AAEX,CAAC;AAED,eAAeX,aAAa","ignoreList":[]}

package/lib/module/ui-components/credential/card/credential-details-list-item.js

@@ -1,7 +1,7 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useCallback, useEffect, useState } from 'react';
-import { StyleSheet, View } from 'react-native';
-import Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
+import React, { useCallback, useState } from 'react';
+import { StyleSheet } from 'react-native';
+import Animated, { LinearTransition } from 'react-native-reanimated';
 import { CredentialCardRatio, CredentialCardShadow } from './credential-card';
 import CredentialDetailsCard from './credential-details-card';
 const CredentialDetailsCardListItem = ({
@@ -11,43 +11,12 @@ const CredentialDetailsCardListItem = ({
   style,
   ...props
 }) => {
-  const [cardWidth, setCardWidth] = useState();
-  const [minHeight, setMinHeight] = useState();
   const [detailsCardHeight, setDetailsCardHeight] = useState();
-  const cardListItemHeight = useSharedValue(undefined);
-  useEffect(() => {
-    if (!detailsCardHeight || !minHeight) {
-      return;
-    }
-    const newValue = expanded ? detailsCardHeight : minHeight;
-    if (cardListItemHeight.value === undefined) {
-      cardListItemHeight.value = newValue;
-      return;
-    }
-    cardListItemHeight.value = withTiming(newValue, {
-      duration: 250
-    });
-  }, [cardListItemHeight, detailsCardHeight, minHeight, expanded]);
-  const animatedCardWrapperStyle = useAnimatedStyle(() => {
-    if (cardListItemHeight.value !== undefined) {
-      return {
-        height: cardListItemHeight.value
-      };
-    }
-    if (lastItem || expanded) {
-      return {};
-    }
-    return {
-      height: 60
-    };
-  }, [cardListItemHeight, lastItem, expanded]);
-  const cardWrapperStyle = {
-    minHeight: cardWidth ? Math.ceil(cardWidth / CredentialCardRatio) : undefined
-  };
+  const cardWidth = props.card.width;
+  const minHeight = lastItem ? Math.ceil(cardWidth / CredentialCardRatio) : 60;
   const onContentLayout = useCallback(event => {
     var _StyleSheet$flatten$b, _StyleSheet$flatten;
     const {
-      width,
       height
     } = event.nativeEvent.layout;
     const borderWidth = (_StyleSheet$flatten$b = (_StyleSheet$flatten = StyleSheet.flatten(style)) === null || _StyleSheet$flatten === void 0 ? void 0 : _StyleSheet$flatten.borderWidth) !== null && _StyleSheet$flatten$b !== void 0 ? _StyleSheet$flatten$b : 0;
@@ -55,16 +24,22 @@ const CredentialDetailsCardListItem = ({
     if (cardHeight === detailsCardHeight) {
       return;
     }
-    setCardWidth(width);
-    if (!minHeight) {
-      setMinHeight(lastItem ? Math.ceil(width / CredentialCardRatio) : 60);
-    }
     setDetailsCardHeight(cardHeight);
-  }, [lastItem, minHeight, style, detailsCardHeight]);
+  }, [style, detailsCardHeight]);
   return /*#__PURE__*/React.createElement(Animated.View, {
-    style: [styles.animatedWrapper, animatedCardWrapperStyle, style]
-  }, /*#__PURE__*/React.createElement(View, {
-    style: [styles.cardWrapper, cardWrapperStyle]
+    layout: LinearTransition,
+    style: [styles.animatedWrapper,
+    // eslint-disable-next-line react-native/no-inline-styles
+    {
+      height: expanded ? 'auto' : minHeight
+    }, style]
+  }, /*#__PURE__*/React.createElement(Animated.View, {
+    layout: LinearTransition,
+    style: [styles.cardWrapper,
+    // eslint-disable-next-line react-native/no-inline-styles
+    {
+      height: expanded ? 'auto' : Math.ceil(cardWidth / CredentialCardRatio)
+    }]
   }, /*#__PURE__*/React.createElement(CredentialDetailsCard, _extends({
     animate: false,
     expanded: true,
@@ -78,7 +53,6 @@ const styles = StyleSheet.create({
   },
   cardWrapper: {
     borderRadius: 10,
-    height: '100%',
     overflow: 'hidden'
   }
 });

package/lib/module/ui-components/credential/card/credential-details-list-item.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useState","StyleSheet","View","Animated","useAnimatedStyle","useSharedValue","withTiming","CredentialCardRatio","CredentialCardShadow","CredentialDetailsCard","CredentialDetailsCardListItem","detailsCardStyle","expanded","lastItem","style","props","cardWidth","setCardWidth","minHeight","setMinHeight","detailsCardHeight","setDetailsCardHeight","cardListItemHeight","undefined","newValue","value","duration","animatedCardWrapperStyle","height","cardWrapperStyle","Math","ceil","onContentLayout","event","_StyleSheet$flatten$b","_StyleSheet$flatten","width","nativeEvent","layout","borderWidth","flatten","cardHeight","round","createElement","styles","animatedWrapper","cardWrapper","_extends","animate","onLayout","create","borderRadius","overflow"],"sources":["credential-details-list-item.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react';\nimport { LayoutChangeEvent, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\nimport Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';\n\nimport { CredentialCardRatio, CredentialCardShadow } from './credential-card';\nimport CredentialDetailsCard, { CredentialDetailsCardProps } from './credential-details-card';\n\nexport type CredentialDetailsCardListItemProps = Omit<CredentialDetailsCardProps, 'animate'> & {\n  detailsCardStyle?: StyleProp<ViewStyle>;\n  lastItem?: boolean;\n};\n\nconst CredentialDetailsCardListItem: FC<CredentialDetailsCardListItemProps> = ({\n  detailsCardStyle,\n  expanded,\n  lastItem,\n  style,\n  ...props\n}) => {\n  const [cardWidth, setCardWidth] = useState<number>();\n  const [minHeight, setMinHeight] = useState<number>();\n  const [detailsCardHeight, setDetailsCardHeight] = useState<number>();\n\n  const cardListItemHeight = useSharedValue<number | undefined>(undefined);\n\n  useEffect(() => {\n    if (!detailsCardHeight || !minHeight) {\n      return;\n    }\n    const newValue = expanded ? detailsCardHeight : minHeight;\n    if (cardListItemHeight.value === undefined) {\n      cardListItemHeight.value = newValue;\n      return;\n    }\n    cardListItemHeight.value = withTiming(newValue, {\n      duration: 250,\n    });\n  }, [cardListItemHeight, detailsCardHeight, minHeight, expanded]);\n\n  const animatedCardWrapperStyle = useAnimatedStyle(() => {\n    if (cardListItemHeight.value !== undefined) {\n      return {\n        height: cardListItemHeight.value,\n      };\n    }\n    if (lastItem || expanded) {\n      return {};\n    }\n    return {\n      height: 60,\n    };\n  }, [cardListItemHeight, lastItem, expanded]);\n\n  const cardWrapperStyle: ViewStyle = {\n    minHeight: cardWidth ? Math.ceil(cardWidth / CredentialCardRatio) : undefined,\n  }\n\n  const onContentLayout = useCallback(\n    (event: LayoutChangeEvent) => {\n      const { width, height } = event.nativeEvent.layout;\n      const borderWidth = StyleSheet.flatten(style)?.borderWidth ?? 0;\n      const cardHeight = Math.round(height) + 2 * borderWidth;\n      if (cardHeight === detailsCardHeight) {\n        return;\n      }\n      setCardWidth(width);\n      if (!minHeight) {\n        setMinHeight(lastItem ? Math.ceil(width / CredentialCardRatio) : 60);\n      }\n      setDetailsCardHeight(cardHeight);\n    },\n    [lastItem, minHeight, style, detailsCardHeight],\n  );\n\n  return (\n    <Animated.View style={[styles.animatedWrapper, animatedCardWrapperStyle, style]}>\n      <View style={[styles.cardWrapper, cardWrapperStyle]}>\n        <CredentialDetailsCard\n          animate={false}\n          expanded={true}\n          onLayout={onContentLayout}\n          style={detailsCardStyle}\n          {...props}\n        />\n      </View>\n    </Animated.View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  animatedWrapper: {\n    ...CredentialCardShadow,\n  },\n  cardWrapper: {\n    borderRadius: 10,\n    height: '100%',\n    overflow: 'hidden',\n  },\n});\n\nexport default CredentialDetailsCardListItem;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useState","StyleSheet","Animated","LinearTransition","CredentialCardRatio","CredentialCardShadow","CredentialDetailsCard","CredentialDetailsCardListItem","detailsCardStyle","expanded","lastItem","style","props","detailsCardHeight","setDetailsCardHeight","cardWidth","card","width","minHeight","Math","ceil","onContentLayout","event","_StyleSheet$flatten$b","_StyleSheet$flatten","height","nativeEvent","layout","borderWidth","flatten","cardHeight","round","createElement","View","styles","animatedWrapper","cardWrapper","_extends","animate","onLayout","create","borderRadius","overflow"],"sources":["credential-details-list-item.tsx"],"sourcesContent":["import React, { FC, useCallback, useState } from 'react';\nimport { LayoutChangeEvent, StyleProp, StyleSheet, ViewStyle } from 'react-native';\nimport Animated, { LinearTransition } from 'react-native-reanimated';\n\nimport { CredentialCardRatio, CredentialCardShadow } from './credential-card';\nimport CredentialDetailsCard, { CredentialDetailsCardProps } from './credential-details-card';\n\nexport type CredentialDetailsCardListItemProps = Omit<CredentialDetailsCardProps, 'animate'> & {\n  detailsCardStyle?: StyleProp<ViewStyle>;\n  lastItem?: boolean;\n};\n\nconst CredentialDetailsCardListItem: FC<CredentialDetailsCardListItemProps> = ({\n  detailsCardStyle,\n  expanded,\n  lastItem,\n  style,\n  ...props\n}) => {\n  const [detailsCardHeight, setDetailsCardHeight] = useState<number>();\n  const cardWidth = props.card.width;\n  const minHeight = lastItem ? Math.ceil(cardWidth / CredentialCardRatio) : 60;\n\n  const onContentLayout = useCallback(\n    (event: LayoutChangeEvent) => {\n      const { height } = event.nativeEvent.layout;\n      const borderWidth = StyleSheet.flatten(style)?.borderWidth ?? 0;\n      const cardHeight = Math.round(height) + 2 * borderWidth;\n      if (cardHeight === detailsCardHeight) {\n        return;\n      }\n      setDetailsCardHeight(cardHeight);\n    },\n    [style, detailsCardHeight],\n  );\n\n  return (\n    <Animated.View\n      layout={LinearTransition}\n      style={[\n        styles.animatedWrapper,\n        // eslint-disable-next-line react-native/no-inline-styles\n        {\n          height: expanded ? 'auto' : minHeight,\n        },\n        style,\n      ]}>\n      <Animated.View\n        layout={LinearTransition}\n        style={[\n          styles.cardWrapper,\n          // eslint-disable-next-line react-native/no-inline-styles\n          {\n            height: expanded ? 'auto' : Math.ceil(cardWidth / CredentialCardRatio),\n          },\n        ]}>\n        <CredentialDetailsCard\n          animate={false}\n          expanded={true}\n          onLayout={onContentLayout}\n          style={detailsCardStyle}\n          {...props}\n        />\n      </Animated.View>\n    </Animated.View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  animatedWrapper: {\n    ...CredentialCardShadow,\n  },\n  cardWrapper: {\n    borderRadius: 10,\n    overflow: 'hidden',\n  },\n});\n\nexport default CredentialDetailsCardListItem;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAQC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACxD,SAAuCC,UAAU,QAAmB,cAAc;AAClF,OAAOC,QAAQ,IAAIC,gBAAgB,QAAQ,yBAAyB;AAEpE,SAASC,mBAAmB,EAAEC,oBAAoB,QAAQ,mBAAmB;AAC7E,OAAOC,qBAAqB,MAAsC,2BAA2B;AAO7F,MAAMC,6BAAqE,GAAGA,CAAC;EAC7EC,gBAAgB;EAChBC,QAAQ;EACRC,QAAQ;EACRC,KAAK;EACL,GAAGC;AACL,CAAC,KAAK;EACJ,MAAM,CAACC,iBAAiB,EAAEC,oBAAoB,CAAC,GAAGd,QAAQ,CAAS,CAAC;EACpE,MAAMe,SAAS,GAAGH,KAAK,CAACI,IAAI,CAACC,KAAK;EAClC,MAAMC,SAAS,GAAGR,QAAQ,GAAGS,IAAI,CAACC,IAAI,CAACL,SAAS,GAAGX,mBAAmB,CAAC,GAAG,EAAE;EAE5E,MAAMiB,eAAe,GAAGtB,WAAW,CAChCuB,KAAwB,IAAK;IAAA,IAAAC,qBAAA,EAAAC,mBAAA;IAC5B,MAAM;MAAEC;IAAO,CAAC,GAAGH,KAAK,CAACI,WAAW,CAACC,MAAM;IAC3C,MAAMC,WAAW,IAAAL,qBAAA,IAAAC,mBAAA,GAAGvB,UAAU,CAAC4B,OAAO,CAAClB,KAAK,CAAC,cAAAa,mBAAA,uBAAzBA,mBAAA,CAA2BI,WAAW,cAAAL,qBAAA,cAAAA,qBAAA,GAAI,CAAC;IAC/D,MAAMO,UAAU,GAAGX,IAAI,CAACY,KAAK,CAACN,MAAM,CAAC,GAAG,CAAC,GAAGG,WAAW;IACvD,IAAIE,UAAU,KAAKjB,iBAAiB,EAAE;MACpC;IACF;IACAC,oBAAoB,CAACgB,UAAU,CAAC;EAClC,CAAC,EACD,CAACnB,KAAK,EAAEE,iBAAiB,CAC3B,CAAC;EAED,oBACEf,KAAA,CAAAkC,aAAA,CAAC9B,QAAQ,CAAC+B,IAAI;IACZN,MAAM,EAAExB,gBAAiB;IACzBQ,KAAK,EAAE,CACLuB,MAAM,CAACC,eAAe;IACtB;IACA;MACEV,MAAM,EAAEhB,QAAQ,GAAG,MAAM,GAAGS;IAC9B,CAAC,EACDP,KAAK;EACL,gBACFb,KAAA,CAAAkC,aAAA,CAAC9B,QAAQ,CAAC+B,IAAI;IACZN,MAAM,EAAExB,gBAAiB;IACzBQ,KAAK,EAAE,CACLuB,MAAM,CAACE,WAAW;IAClB;IACA;MACEX,MAAM,EAAEhB,QAAQ,GAAG,MAAM,GAAGU,IAAI,CAACC,IAAI,CAACL,SAAS,GAAGX,mBAAmB;IACvE,CAAC;EACD,gBACFN,KAAA,CAAAkC,aAAA,CAAC1B,qBAAqB,EAAA+B,QAAA;IACpBC,OAAO,EAAE,KAAM;IACf7B,QAAQ,EAAE,IAAK;IACf8B,QAAQ,EAAElB,eAAgB;IAC1BV,KAAK,EAAEH;EAAiB,GACpBI,KAAK,CACV,CACY,CACF,CAAC;AAEpB,CAAC;AAED,MAAMsB,MAAM,GAAGjC,UAAU,CAACuC,MAAM,CAAC;EAC/BL,eAAe,EAAE;IACf,GAAG9B;EACL,CAAC;EACD+B,WAAW,EAAE;IACXK,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAenC,6BAA6B","ignoreList":[]}

package/lib/module/ui-components/credential/credential-attribute-item.js

@@ -254,7 +254,9 @@ const styles = StyleSheet.create({
     paddingLeft: 12
   },
   rightAccessory: {
-    paddingHorizontal: 8
+    paddingHorizontal: 8,
+    position: 'absolute',
+    right: 0
   },
   separator: {
     height: 1,