@procivis/one-react-native-components 0.1.63 → 0.3.22

package/lib/module/ui-components/history/data-item.js

@@ -0,0 +1,68 @@
+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, { useMemo } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { concatTestID } from '../../utils/testID';
+import Typography from '../text/typography';
+import { useAppColorScheme } from '../theme/color-scheme-context';
+const DataItem = ({
+  attribute,
+  value,
+  valueColor,
+  valueIcon,
+  multiline,
+  last,
+  testID,
+  style,
+  ...props
+}) => {
+  const colorScheme = useAppColorScheme();
+  const valueIconView = useMemo(() => {
+    if (/*#__PURE__*/React.isValidElement(valueIcon)) {
+      return valueIcon;
+    } else if (valueIcon) {
+      const IconComponent = valueIcon;
+      return /*#__PURE__*/React.createElement(IconComponent, null);
+    }
+  }, [valueIcon]);
+  return /*#__PURE__*/React.createElement(View, _extends({
+    style: [styles.dataItem, {
+      borderColor: colorScheme.background
+    }, last && styles.last, style],
+    testID: testID
+  }, props), /*#__PURE__*/React.createElement(Typography, {
+    color: colorScheme.text,
+    preset: "xs/line-height-small",
+    style: styles.dataItemLabel,
+    testID: concatTestID(testID, 'title')
+  }, attribute), /*#__PURE__*/React.createElement(View, {
+    style: styles.value
+  }, valueIconView, /*#__PURE__*/React.createElement(Typography, {
+    color: valueColor !== null && valueColor !== void 0 ? valueColor : colorScheme.text,
+    numberOfLines: multiline ? undefined : 1,
+    preset: "s",
+    style: valueIcon ? styles.valueLabel : undefined,
+    testID: concatTestID(testID, 'value')
+  }, value)));
+};
+const styles = StyleSheet.create({
+  dataItem: {
+    borderBottomWidth: 1,
+    paddingVertical: 10
+  },
+  dataItemLabel: {
+    marginBottom: 4,
+    opacity: 0.7
+  },
+  last: {
+    borderBottomWidth: 0
+  },
+  value: {
+    alignItems: 'center',
+    flexDirection: 'row'
+  },
+  valueLabel: {
+    marginLeft: 4
+  }
+});
+export default DataItem;
+//# sourceMappingURL=data-item.js.map

package/lib/module/ui-components/history/data-item.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","StyleSheet","View","concatTestID","Typography","useAppColorScheme","DataItem","attribute","value","valueColor","valueIcon","multiline","last","testID","style","props","colorScheme","valueIconView","isValidElement","IconComponent","createElement","_extends","styles","dataItem","borderColor","background","color","text","preset","dataItemLabel","numberOfLines","undefined","valueLabel","create","borderBottomWidth","paddingVertical","marginBottom","opacity","alignItems","flexDirection","marginLeft"],"sources":["data-item.tsx"],"sourcesContent":["import React, { ComponentType, FC, ReactElement, useMemo } from 'react';\nimport { ColorValue, StyleSheet, View, ViewProps } from 'react-native';\n\nimport { concatTestID } from '../../utils/testID';\nimport Typography from '../text/typography';\nimport { useAppColorScheme } from '../theme/color-scheme-context';\n\nexport type DataItemProps = ViewProps & {\n  attribute: string;\n  last?: boolean;\n  multiline?: boolean;\n  value: string;\n  valueColor?: ColorValue;\n  valueIcon?: ComponentType<any> | ReactElement;\n};\n\nconst DataItem: FC<DataItemProps> = ({\n  attribute,\n  value,\n  valueColor,\n  valueIcon,\n  multiline,\n  last,\n  testID,\n  style,\n  ...props\n}) => {\n  const colorScheme = useAppColorScheme();\n\n  const valueIconView: ReactElement | undefined = useMemo(() => {\n    if (React.isValidElement(valueIcon)) {\n      return valueIcon;\n    } else if (valueIcon) {\n      const IconComponent = valueIcon as ComponentType<any>;\n      return <IconComponent />;\n    }\n  }, [valueIcon]);\n\n  return (\n    <View\n      style={[styles.dataItem, { borderColor: colorScheme.background }, last && styles.last, style]}\n      testID={testID}\n      {...props}>\n      <Typography\n        color={colorScheme.text}\n        preset=\"xs/line-height-small\"\n        style={styles.dataItemLabel}\n        testID={concatTestID(testID, 'title')}>\n        {attribute}\n      </Typography>\n\n      <View style={styles.value}>\n        {valueIconView}\n        <Typography\n          color={valueColor ?? colorScheme.text}\n          numberOfLines={multiline ? undefined : 1}\n          preset=\"s\"\n          style={valueIcon ? styles.valueLabel : undefined}\n          testID={concatTestID(testID, 'value')}>\n          {value}\n        </Typography>\n      </View>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  dataItem: {\n    borderBottomWidth: 1,\n    paddingVertical: 10,\n  },\n  dataItemLabel: {\n    marginBottom: 4,\n    opacity: 0.7,\n  },\n  last: {\n    borderBottomWidth: 0,\n  },\n  value: {\n    alignItems: 'center',\n    flexDirection: 'row',\n  },\n  valueLabel: {\n    marginLeft: 4,\n  },\n});\n\nexport default DataItem;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAqCC,OAAO,QAAQ,OAAO;AACvE,SAAqBC,UAAU,EAAEC,IAAI,QAAmB,cAAc;AAEtE,SAASC,YAAY,QAAQ,oBAAoB;AACjD,OAAOC,UAAU,MAAM,oBAAoB;AAC3C,SAASC,iBAAiB,QAAQ,+BAA+B;AAWjE,MAAMC,QAA2B,GAAGA,CAAC;EACnCC,SAAS;EACTC,KAAK;EACLC,UAAU;EACVC,SAAS;EACTC,SAAS;EACTC,IAAI;EACJC,MAAM;EACNC,KAAK;EACL,GAAGC;AACL,CAAC,KAAK;EACJ,MAAMC,WAAW,GAAGX,iBAAiB,CAAC,CAAC;EAEvC,MAAMY,aAAuC,GAAGjB,OAAO,CAAC,MAAM;IAC5D,iBAAID,KAAK,CAACmB,cAAc,CAACR,SAAS,CAAC,EAAE;MACnC,OAAOA,SAAS;IAClB,CAAC,MAAM,IAAIA,SAAS,EAAE;MACpB,MAAMS,aAAa,GAAGT,SAA+B;MACrD,oBAAOX,KAAA,CAAAqB,aAAA,CAACD,aAAa,MAAE,CAAC;IAC1B;EACF,CAAC,EAAE,CAACT,SAAS,CAAC,CAAC;EAEf,oBACEX,KAAA,CAAAqB,aAAA,CAAClB,IAAI,EAAAmB,QAAA;IACHP,KAAK,EAAE,CAACQ,MAAM,CAACC,QAAQ,EAAE;MAAEC,WAAW,EAAER,WAAW,CAACS;IAAW,CAAC,EAAEb,IAAI,IAAIU,MAAM,CAACV,IAAI,EAAEE,KAAK,CAAE;IAC9FD,MAAM,EAAEA;EAAO,GACXE,KAAK,gBACThB,KAAA,CAAAqB,aAAA,CAAChB,UAAU;IACTsB,KAAK,EAAEV,WAAW,CAACW,IAAK;IACxBC,MAAM,EAAC,sBAAsB;IAC7Bd,KAAK,EAAEQ,MAAM,CAACO,aAAc;IAC5BhB,MAAM,EAAEV,YAAY,CAACU,MAAM,EAAE,OAAO;EAAE,GACrCN,SACS,CAAC,eAEbR,KAAA,CAAAqB,aAAA,CAAClB,IAAI;IAACY,KAAK,EAAEQ,MAAM,CAACd;EAAM,GACvBS,aAAa,eACdlB,KAAA,CAAAqB,aAAA,CAAChB,UAAU;IACTsB,KAAK,EAAEjB,UAAU,aAAVA,UAAU,cAAVA,UAAU,GAAIO,WAAW,CAACW,IAAK;IACtCG,aAAa,EAAEnB,SAAS,GAAGoB,SAAS,GAAG,CAAE;IACzCH,MAAM,EAAC,GAAG;IACVd,KAAK,EAAEJ,SAAS,GAAGY,MAAM,CAACU,UAAU,GAAGD,SAAU;IACjDlB,MAAM,EAAEV,YAAY,CAACU,MAAM,EAAE,OAAO;EAAE,GACrCL,KACS,CACR,CACF,CAAC;AAEX,CAAC;AAED,MAAMc,MAAM,GAAGrB,UAAU,CAACgC,MAAM,CAAC;EAC/BV,QAAQ,EAAE;IACRW,iBAAiB,EAAE,CAAC;IACpBC,eAAe,EAAE;EACnB,CAAC;EACDN,aAAa,EAAE;IACbO,YAAY,EAAE,CAAC;IACfC,OAAO,EAAE;EACX,CAAC;EACDzB,IAAI,EAAE;IACJsB,iBAAiB,EAAE;EACrB,CAAC;EACD1B,KAAK,EAAE;IACL8B,UAAU,EAAE,QAAQ;IACpBC,aAAa,EAAE;EACjB,CAAC;EACDP,UAAU,EAAE;IACVQ,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,eAAelC,QAAQ","ignoreList":[]}

package/lib/module/ui-components/history/history-details.js

@@ -0,0 +1,171 @@
+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, { useEffect, useMemo } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { CredentialDetails, EntityDetails } from '../../components';
+import { HeaderInfoButton } from '../../components/navigation/header-buttons';
+import { concatTestID, useCredentialListExpandedCard } from '../../utils';
+import { TouchableOpacity } from '../accessibility';
+import { BackButton } from '../buttons';
+import { CredentialDetailsCardListItem, CredentialHeader } from '../credential';
+import { NextIcon } from '../icons';
+import { ScrollViewScreen } from '../screens';
+import { Typography } from '../text';
+import { useAppColorScheme } from '../theme';
+import DataItem from './data-item';
+export const HistoryDetailsView = ({
+  assets,
+  data,
+  headerButton,
+  labels,
+  onBackPressed,
+  onInfoPressed,
+  onImagePreview,
+  testID
+}) => {
+  var _assets$cards, _assets$cards2;
+  const colorScheme = useAppColorScheme();
+  const {
+    expandedCredential,
+    onHeaderPress,
+    setInitialCredential
+  } = useCredentialListExpandedCard();
+
+  // Expand the first credential
+  useEffect(() => {
+    if (assets !== null && assets !== void 0 && assets.cards && assets.cards.length > 0) {
+      let id = 'credentialDetails' in assets.cards[0] ? assets.cards[0].credentialDetails.credentialId : assets.cards[0].credentialCard.card.credentialId;
+      if (id) {
+        setInitialCredential(id);
+      }
+    }
+  }, [assets === null || assets === void 0 ? void 0 : assets.cards, setInitialCredential]);
+  const moreInfoHeaderButton = useMemo(() => {
+    var _labels$infoButtonAcc;
+    if (headerButton) {
+      return headerButton;
+    }
+    if (!onInfoPressed) {
+      return undefined;
+    }
+    return /*#__PURE__*/React.createElement(HeaderInfoButton, {
+      onPress: onInfoPressed,
+      testID: concatTestID(testID, 'header', 'info'),
+      accessibilityLabel: (_labels$infoButtonAcc = labels.infoButtonAccessibility) !== null && _labels$infoButtonAcc !== void 0 ? _labels$infoButtonAcc : ''
+    });
+  }, [headerButton, labels.infoButtonAccessibility, onInfoPressed, testID]);
+  const hasAssets = assets && (assets.header || ((_assets$cards = assets.cards) === null || _assets$cards === void 0 ? void 0 : _assets$cards.length));
+  return /*#__PURE__*/React.createElement(ScrollViewScreen, {
+    header: {
+      leftItem: /*#__PURE__*/React.createElement(BackButton, {
+        onPress: onBackPressed,
+        testID: concatTestID(testID, 'header', 'back')
+      }),
+      rightItem: moreInfoHeaderButton,
+      static: true,
+      title: labels.title
+    },
+    scrollView: {
+      style: styles.content
+    },
+    testID: testID
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.section, {
+      backgroundColor: colorScheme.white
+    }]
+  }, data.header && 'entity' in data.header && /*#__PURE__*/React.createElement(EntityDetails, _extends({}, data.header.entity, {
+    style: [styles.entity, {
+      borderColor: colorScheme.background
+    }, data.header.entity.style]
+  })), data.header && 'credentialHeader' in data.header && /*#__PURE__*/React.createElement(CredentialHeader, _extends({}, data.header.credentialHeader, {
+    blur: false,
+    style: [styles.header, {
+      borderColor: colorScheme.background
+    }, data.header.credentialHeader.style]
+  })), /*#__PURE__*/React.createElement(DataItem, {
+    attribute: labels.data.date,
+    value: data.date
+  }), /*#__PURE__*/React.createElement(DataItem, {
+    attribute: labels.data.action,
+    last: true,
+    testID: data.action.testID,
+    value: data.action.label,
+    valueColor: data.action.color,
+    valueIcon: data.action.icon
+  })), hasAssets && /*#__PURE__*/React.createElement(Typography, {
+    color: colorScheme.text,
+    preset: "m",
+    style: styles.sectionHeader
+  }, labels.relatedAssets), (assets === null || assets === void 0 ? void 0 : assets.header) && /*#__PURE__*/React.createElement(TouchableOpacity, {
+    disabled: !assets.header.onPressed,
+    onPress: assets.header.onPressed
+  }, /*#__PURE__*/React.createElement(CredentialHeader, _extends({}, assets.header, {
+    accessory: assets.header.onPressed ? /*#__PURE__*/React.createElement(NextIcon, {
+      color: colorScheme.text
+    }) : undefined,
+    blur: false,
+    style: [styles.assetsHeader, assets.header.style]
+  }))), assets === null || assets === void 0 || (_assets$cards2 = assets.cards) === null || _assets$cards2 === void 0 ? void 0 : _assets$cards2.map((props, index, {
+    length
+  }) => {
+    if ('credentialDetails' in props) {
+      return /*#__PURE__*/React.createElement(View, {
+        key: props.credentialDetails.credentialId,
+        style: styles.credential
+      }, /*#__PURE__*/React.createElement(CredentialDetails, _extends({}, props.credentialDetails, {
+        expanded: expandedCredential === props.credentialDetails.credentialId,
+        labels: labels.credentialCard,
+        lastItem: index === length - 1,
+        onHeaderPress: onHeaderPress,
+        onImagePreview: onImagePreview
+      })));
+    } else {
+      const itemProps = {
+        ...props.credentialCard,
+        card: {
+          ...props.credentialCard.card,
+          onHeaderPress
+        }
+      };
+      return /*#__PURE__*/React.createElement(View, {
+        key: index.toString(),
+        style: styles.credential
+      }, /*#__PURE__*/React.createElement(CredentialDetailsCardListItem, _extends({}, itemProps, {
+        expanded: expandedCredential === props.credentialCard.card.credentialId,
+        lastItem: index === length - 1,
+        onImagePreview: onImagePreview
+      })));
+    }
+  }));
+};
+const styles = StyleSheet.create({
+  assetsHeader: {
+    borderRadius: 8
+  },
+  content: {
+    paddingHorizontal: 16,
+    paddingTop: 12
+  },
+  credential: {
+    marginBottom: 4
+  },
+  entity: {
+    borderBottomWidth: 1,
+    paddingBottom: 8
+  },
+  header: {
+    borderBottomWidth: 1,
+    marginTop: -8,
+    paddingBottom: 12,
+    paddingHorizontal: 0
+  },
+  section: {
+    borderRadius: 8,
+    marginBottom: 12,
+    padding: 12
+  },
+  sectionHeader: {
+    marginHorizontal: 4,
+    marginVertical: 16
+  }
+});
+//# sourceMappingURL=history-details.js.map

package/lib/module/ui-components/history/history-details.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useMemo","StyleSheet","View","CredentialDetails","EntityDetails","HeaderInfoButton","concatTestID","useCredentialListExpandedCard","TouchableOpacity","BackButton","CredentialDetailsCardListItem","CredentialHeader","NextIcon","ScrollViewScreen","Typography","useAppColorScheme","DataItem","HistoryDetailsView","assets","data","headerButton","labels","onBackPressed","onInfoPressed","onImagePreview","testID","_assets$cards","_assets$cards2","colorScheme","expandedCredential","onHeaderPress","setInitialCredential","cards","length","id","credentialDetails","credentialId","credentialCard","card","moreInfoHeaderButton","_labels$infoButtonAcc","undefined","createElement","onPress","accessibilityLabel","infoButtonAccessibility","hasAssets","header","leftItem","rightItem","static","title","scrollView","style","styles","content","section","backgroundColor","white","_extends","entity","borderColor","background","credentialHeader","blur","attribute","date","value","action","last","label","valueColor","color","valueIcon","icon","text","preset","sectionHeader","relatedAssets","disabled","onPressed","accessory","assetsHeader","map","props","index","key","credential","expanded","lastItem","itemProps","toString","create","borderRadius","paddingHorizontal","paddingTop","marginBottom","borderBottomWidth","paddingBottom","marginTop","padding","marginHorizontal","marginVertical"],"sources":["history-details.tsx"],"sourcesContent":["import React, { ComponentType, FC, ReactElement, useEffect, useMemo } from 'react';\nimport { ColorValue, ImageSourcePropType, StyleSheet, View } from 'react-native';\n\nimport { CredentialDetails, CredentialDetailsProps, EntityDetails, EntityDetailsProps } from '../../components';\nimport { HeaderInfoButton } from '../../components/navigation/header-buttons';\nimport { CardLabels, concatTestID, useCredentialListExpandedCard } from '../../utils';\nimport { TouchableOpacity } from '../accessibility';\nimport { BackButton } from '../buttons';\nimport {\n  CredentialDetailsCardListItem,\n  CredentialDetailsCardListItemProps,\n  CredentialHeader,\n  CredentialHeaderProps,\n} from '../credential';\nimport { NextIcon } from '../icons';\nimport { ScrollViewScreen } from '../screens';\nimport { Typography } from '../text';\nimport { useAppColorScheme } from '../theme';\nimport DataItem from './data-item';\n\nexport type HistoryDetailsLabels = {\n  credentialCard: CardLabels;\n  data: {\n    date: string;\n    action: string;\n  };\n  infoButtonAccessibility?: string;\n  relatedAssets: string;\n  title: string;\n};\n\ntype CredentialDetails = Omit<\n  CredentialDetailsProps,\n  'expanded' | 'labels' | 'lastItem' | 'onHeaderPress' | 'onImagePreview'\n>;\n\ntype CredentialCard = Omit<\n  CredentialDetailsCardListItemProps,\n  'expanded' | 'labels' | 'lastItem' | 'onHeaderPress' | 'onImagePreview'\n>;\n\nexport type HistoryDetailsViewProps = {\n  assets?: {\n    header?: CredentialHeaderProps & {\n      onPressed?: () => void;\n    };\n    cards?: (\n      | {\n          credentialDetails: CredentialDetails;\n        }\n      | {\n          credentialCard: CredentialCard;\n        }\n    )[];\n  };\n  data: {\n    header?:\n      | {\n          entity: EntityDetailsProps;\n        }\n      | {\n          credentialHeader: CredentialHeaderProps;\n        };\n    date: string;\n    action: {\n      icon: ComponentType<any> | ReactElement;\n      label: string;\n      color: ColorValue;\n      testID?: string;\n    };\n  };\n  headerButton?: ReactElement;\n  labels: HistoryDetailsLabels;\n  onBackPressed: () => void;\n  onInfoPressed?: () => void;\n  onImagePreview: (title: string, image: ImageSourcePropType) => void;\n  testID: string;\n};\n\nexport const HistoryDetailsView: FC<HistoryDetailsViewProps> = ({\n  assets,\n  data,\n  headerButton,\n  labels,\n  onBackPressed,\n  onInfoPressed,\n  onImagePreview,\n  testID,\n}) => {\n  const colorScheme = useAppColorScheme();\n  const { expandedCredential, onHeaderPress, setInitialCredential } = useCredentialListExpandedCard();\n\n  // Expand the first credential\n  useEffect(() => {\n    if (assets?.cards && assets.cards.length > 0) {\n      let id =\n        'credentialDetails' in assets.cards[0]\n          ? assets.cards[0].credentialDetails.credentialId\n          : assets.cards[0].credentialCard.card.credentialId;\n      if (id) {\n        setInitialCredential(id);\n      }\n    }\n  }, [assets?.cards, setInitialCredential]);\n\n  const moreInfoHeaderButton = useMemo(() => {\n    if (headerButton) {\n      return headerButton;\n    }\n\n    if (!onInfoPressed) {\n      return undefined;\n    }\n\n    return (\n      <HeaderInfoButton\n        onPress={onInfoPressed}\n        testID={concatTestID(testID, 'header', 'info')}\n        accessibilityLabel={labels.infoButtonAccessibility ?? ''}\n      />\n    );\n  }, [headerButton, labels.infoButtonAccessibility, onInfoPressed, testID]);\n\n  const hasAssets = assets && (assets.header || assets.cards?.length);\n\n  return (\n    <ScrollViewScreen\n      header={{\n        leftItem: <BackButton onPress={onBackPressed} testID={concatTestID(testID, 'header', 'back')} />,\n        rightItem: moreInfoHeaderButton,\n        static: true,\n        title: labels.title,\n      }}\n      scrollView={{\n        style: styles.content,\n      }}\n      testID={testID}>\n      <View style={[styles.section, { backgroundColor: colorScheme.white }]}>\n        {data.header && 'entity' in data.header && (\n          <EntityDetails\n            {...data.header.entity}\n            style={[styles.entity, { borderColor: colorScheme.background }, data.header.entity.style]}\n          />\n        )}\n        {data.header && 'credentialHeader' in data.header && (\n          <CredentialHeader\n            {...data.header.credentialHeader}\n            blur={false}\n            style={[styles.header, { borderColor: colorScheme.background }, data.header.credentialHeader.style]}\n          />\n        )}\n        <DataItem attribute={labels.data.date} value={data.date} />\n        <DataItem\n          attribute={labels.data.action}\n          last\n          testID={data.action.testID}\n          value={data.action.label}\n          valueColor={data.action.color}\n          valueIcon={data.action.icon}\n        />\n      </View>\n\n      {hasAssets && (\n        <Typography color={colorScheme.text} preset=\"m\" style={styles.sectionHeader}>\n          {labels.relatedAssets}\n        </Typography>\n      )}\n\n      {assets?.header && (\n        <TouchableOpacity disabled={!assets.header.onPressed} onPress={assets.header.onPressed}>\n          <CredentialHeader\n            {...assets.header}\n            accessory={assets.header.onPressed ? <NextIcon color={colorScheme.text} /> : undefined}\n            blur={false}\n            style={[styles.assetsHeader, assets.header.style]}\n          />\n        </TouchableOpacity>\n      )}\n      {assets?.cards?.map((props, index, { length }) => {\n        if ('credentialDetails' in props) {\n          return (\n            <View key={props.credentialDetails.credentialId} style={styles.credential}>\n              <CredentialDetails\n                {...props.credentialDetails}\n                expanded={expandedCredential === props.credentialDetails.credentialId}\n                labels={labels.credentialCard}\n                lastItem={index === length - 1}\n                onHeaderPress={onHeaderPress}\n                onImagePreview={onImagePreview}\n              />\n            </View>\n          );\n        } else {\n          const itemProps = {\n            ...props.credentialCard,\n            card: {\n              ...props.credentialCard.card,\n              onHeaderPress,\n            },\n          };\n          return (\n            <View key={index.toString()} style={styles.credential}>\n              <CredentialDetailsCardListItem\n                {...itemProps}\n                expanded={expandedCredential === props.credentialCard.card.credentialId}\n                lastItem={index === length - 1}\n                onImagePreview={onImagePreview}\n              />\n            </View>\n          );\n        }\n      })}\n    </ScrollViewScreen>\n  );\n};\n\nconst styles = StyleSheet.create({\n  assetsHeader: {\n    borderRadius: 8,\n  },\n  content: {\n    paddingHorizontal: 16,\n    paddingTop: 12,\n  },\n  credential: {\n    marginBottom: 4,\n  },\n  entity: {\n    borderBottomWidth: 1,\n    paddingBottom: 8,\n  },\n  header: {\n    borderBottomWidth: 1,\n    marginTop: -8,\n    paddingBottom: 12,\n    paddingHorizontal: 0,\n  },\n  section: {\n    borderRadius: 8,\n    marginBottom: 12,\n    padding: 12,\n  },\n  sectionHeader: {\n    marginHorizontal: 4,\n    marginVertical: 16,\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/module/ui-components/history/history-item.js

@@ -0,0 +1,102 @@
+import React, { useMemo } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { concatTestID } from '../../utils/testID';
+import { TouchableOpacity } from '../accessibility/accessibilityHistoryWrappers';
+import Typography from '../text/typography';
+import { useAppColorScheme } from '../theme/color-scheme-context';
+const HistoryItemView = ({
+  first,
+  icon,
+  label,
+  info,
+  last,
+  style,
+  time,
+  onPress,
+  testID
+}) => {
+  const colorScheme = useAppColorScheme();
+  const iconView = useMemo(() => {
+    if (/*#__PURE__*/React.isValidElement(icon)) {
+      return icon;
+    } else if (icon) {
+      const IconComponent = icon;
+      return /*#__PURE__*/React.createElement(IconComponent, null);
+    }
+  }, [icon]);
+  return /*#__PURE__*/React.createElement(TouchableOpacity, {
+    disabled: !onPress,
+    onPress: () => onPress === null || onPress === void 0 ? void 0 : onPress(),
+    style: [styles.historyItemContainer, {
+      backgroundColor: colorScheme.white
+    }, first && styles.containerFirst, last && styles.containerLast, style],
+    testID: testID
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.historyItemWrapper, {
+      backgroundColor: colorScheme.white,
+      borderColor: colorScheme.background
+    }, last && styles.wrapperLast]
+  }, iconView, /*#__PURE__*/React.createElement(View, {
+    style: styles.labelAndInfo
+  }, /*#__PURE__*/React.createElement(Typography, {
+    color: colorScheme.text,
+    numberOfLines: 1,
+    preset: "s",
+    style: styles.label,
+    testID: concatTestID(testID, 'label')
+  }, label), Boolean(info) && /*#__PURE__*/React.createElement(Typography, {
+    color: colorScheme.text,
+    numberOfLines: 1,
+    preset: "s/line-height-small",
+    style: styles.shaded,
+    testID: concatTestID(testID, 'info')
+  }, info)), /*#__PURE__*/React.createElement(Typography, {
+    color: colorScheme.text,
+    numberOfLines: 1,
+    preset: "xs/line-height-small",
+    style: styles.time,
+    testID: concatTestID(testID, 'timeLabel')
+  }, time)));
+};
+const styles = StyleSheet.create({
+  containerFirst: {
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20,
+    marginTop: 8,
+    paddingTop: 12
+  },
+  containerLast: {
+    borderBottomLeftRadius: 20,
+    borderBottomRightRadius: 20,
+    marginBottom: 12,
+    paddingBottom: 12
+  },
+  historyItemContainer: {
+    paddingHorizontal: 12
+  },
+  historyItemWrapper: {
+    alignItems: 'center',
+    borderBottomWidth: 1,
+    flexDirection: 'row',
+    paddingVertical: 12
+  },
+  label: {
+    marginBottom: 2
+  },
+  labelAndInfo: {
+    flex: 1,
+    marginHorizontal: 12
+  },
+  shaded: {
+    opacity: 0.7
+  },
+  time: {
+    marginRight: 8,
+    opacity: 0.7
+  },
+  wrapperLast: {
+    borderBottomWidth: 0
+  }
+});
+export default HistoryItemView;
+//# sourceMappingURL=history-item.js.map

package/lib/module/ui-components/history/history-item.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","StyleSheet","View","concatTestID","TouchableOpacity","Typography","useAppColorScheme","HistoryItemView","first","icon","label","info","last","style","time","onPress","testID","colorScheme","iconView","isValidElement","IconComponent","createElement","disabled","styles","historyItemContainer","backgroundColor","white","containerFirst","containerLast","historyItemWrapper","borderColor","background","wrapperLast","labelAndInfo","color","text","numberOfLines","preset","Boolean","shaded","create","borderTopLeftRadius","borderTopRightRadius","marginTop","paddingTop","borderBottomLeftRadius","borderBottomRightRadius","marginBottom","paddingBottom","paddingHorizontal","alignItems","borderBottomWidth","flexDirection","paddingVertical","flex","marginHorizontal","opacity","marginRight"],"sources":["history-item.tsx"],"sourcesContent":["import React, { ComponentType, FC, ReactElement, useMemo } from 'react';\nimport { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { concatTestID } from '../../utils/testID';\nimport { TouchableOpacity } from '../accessibility/accessibilityHistoryWrappers';\nimport Typography from '../text/typography';\nimport { useAppColorScheme } from '../theme/color-scheme-context';\n\nexport type HistoryItemViewProps = {\n  first?: boolean;\n  icon: ComponentType<any> | ReactElement;\n  info?: string;\n  label: string;\n  last?: boolean;\n  onPress?: () => void;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n  time: string;\n};\n\nconst HistoryItemView: FC<HistoryItemViewProps> = ({\n  first,\n  icon,\n  label,\n  info,\n  last,\n  style,\n  time,\n  onPress,\n  testID,\n}) => {\n  const colorScheme = useAppColorScheme();\n\n  const iconView: ReactElement | undefined = useMemo(() => {\n    if (React.isValidElement(icon)) {\n      return icon;\n    } else if (icon) {\n      const IconComponent = icon as ComponentType<any>;\n      return <IconComponent />;\n    }\n  }, [icon]);\n\n  return (\n    <TouchableOpacity\n      disabled={!onPress}\n      onPress={() => onPress?.()}\n      style={[\n        styles.historyItemContainer,\n        {\n          backgroundColor: colorScheme.white,\n        },\n        first && styles.containerFirst,\n        last && styles.containerLast,\n        style,\n      ]}\n      testID={testID}>\n      <View\n        style={[\n          styles.historyItemWrapper,\n          {\n            backgroundColor: colorScheme.white,\n            borderColor: colorScheme.background,\n          },\n          last && styles.wrapperLast,\n        ]}>\n        {iconView}\n        <View style={styles.labelAndInfo}>\n          <Typography\n            color={colorScheme.text}\n            numberOfLines={1}\n            preset=\"s\"\n            style={styles.label}\n            testID={concatTestID(testID, 'label')}>\n            {label}\n          </Typography>\n          {Boolean(info) && (\n            <Typography\n              color={colorScheme.text}\n              numberOfLines={1}\n              preset=\"s/line-height-small\"\n              style={styles.shaded}\n              testID={concatTestID(testID, 'info')}>\n              {info}\n            </Typography>\n          )}\n        </View>\n        <Typography\n          color={colorScheme.text}\n          numberOfLines={1}\n          preset=\"xs/line-height-small\"\n          style={styles.time}\n          testID={concatTestID(testID, 'timeLabel')}>\n          {time}\n        </Typography>\n      </View>\n    </TouchableOpacity>\n  );\n};\n\nconst styles = StyleSheet.create({\n  containerFirst: {\n    borderTopLeftRadius: 20,\n    borderTopRightRadius: 20,\n    marginTop: 8,\n    paddingTop: 12,\n  },\n  containerLast: {\n    borderBottomLeftRadius: 20,\n    borderBottomRightRadius: 20,\n    marginBottom: 12,\n    paddingBottom: 12,\n  },\n  historyItemContainer: {\n    paddingHorizontal: 12,\n  },\n  historyItemWrapper: {\n    alignItems: 'center',\n    borderBottomWidth: 1,\n    flexDirection: 'row',\n    paddingVertical: 12,\n  },\n  label: {\n    marginBottom: 2,\n  },\n  labelAndInfo: {\n    flex: 1,\n    marginHorizontal: 12,\n  },\n  shaded: {\n    opacity: 0.7,\n  },\n  time: {\n    marginRight: 8,\n    opacity: 0.7,\n  },\n  wrapperLast: {\n    borderBottomWidth: 0,\n  },\n});\n\nexport default HistoryItemView;\n"],"mappings":"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","ignoreList":[]}

package/lib/module/ui-components/history/history-section-header.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { concatTestID } from '../../utils/testID';
+import Typography from '../text/typography';
+import { useAppColorScheme } from '../theme/color-scheme-context';
+
+// component used on the history section lists (Settings->History, CredentialDetail->History)
+// https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?type=design&node-id=1246-51813&mode=dev
+
+const HistorySectionHeaderView = ({
+  day,
+  year,
+  testID
+}) => {
+  const colorScheme = useAppColorScheme();
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.header
+  }, /*#__PURE__*/React.createElement(Typography, {
+    accessibilityRole: "header",
+    color: colorScheme.text,
+    preset: "m",
+    testID: concatTestID(testID, 'title')
+  }, day), year && /*#__PURE__*/React.createElement(Typography, {
+    color: colorScheme.accent,
+    preset: "s/line-height-small",
+    style: styles.year
+  }, year));
+};
+const styles = StyleSheet.create({
+  header: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    marginVertical: 16,
+    paddingHorizontal: 4
+  },
+  year: {
+    opacity: 0.7
+  }
+});
+export default HistorySectionHeaderView;
+//# sourceMappingURL=history-section-header.js.map

package/lib/module/ui-components/history/history-section-header.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","concatTestID","Typography","useAppColorScheme","HistorySectionHeaderView","day","year","testID","colorScheme","createElement","style","styles","header","accessibilityRole","color","text","preset","accent","create","flexDirection","justifyContent","marginVertical","paddingHorizontal","opacity"],"sources":["history-section-header.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { concatTestID } from '../../utils/testID';\nimport Typography from '../text/typography';\nimport { useAppColorScheme } from '../theme/color-scheme-context';\n\n// component used on the history section lists (Settings->History, CredentialDetail->History)\n// https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?type=design&node-id=1246-51813&mode=dev\n\nconst HistorySectionHeaderView: FC<{\n  day: string;\n  testID?: string;\n  year?: string;\n}> = ({ day, year, testID }) => {\n  const colorScheme = useAppColorScheme();\n\n  return (\n    <View style={styles.header}>\n      <Typography accessibilityRole=\"header\" color={colorScheme.text} preset=\"m\" testID={concatTestID(testID, 'title')}>\n        {day}\n      </Typography>\n      {year && (\n        <Typography color={colorScheme.accent} preset=\"s/line-height-small\" style={styles.year}>\n          {year}\n        </Typography>\n      )}\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  header: {\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    marginVertical: 16,\n    paddingHorizontal: 4,\n  },\n  year: {\n    opacity: 0.7,\n  },\n});\n\nexport default HistorySectionHeaderView;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAc,OAAO;AACjC,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,YAAY,QAAQ,oBAAoB;AACjD,OAAOC,UAAU,MAAM,oBAAoB;AAC3C,SAASC,iBAAiB,QAAQ,+BAA+B;;AAEjE;AACA;;AAEA,MAAMC,wBAIJ,GAAGA,CAAC;EAAEC,GAAG;EAAEC,IAAI;EAAEC;AAAO,CAAC,KAAK;EAC9B,MAAMC,WAAW,GAAGL,iBAAiB,CAAC,CAAC;EAEvC,oBACEL,KAAA,CAAAW,aAAA,CAACT,IAAI;IAACU,KAAK,EAAEC,MAAM,CAACC;EAAO,gBACzBd,KAAA,CAAAW,aAAA,CAACP,UAAU;IAACW,iBAAiB,EAAC,QAAQ;IAACC,KAAK,EAAEN,WAAW,CAACO,IAAK;IAACC,MAAM,EAAC,GAAG;IAACT,MAAM,EAAEN,YAAY,CAACM,MAAM,EAAE,OAAO;EAAE,GAC9GF,GACS,CAAC,EACZC,IAAI,iBACHR,KAAA,CAAAW,aAAA,CAACP,UAAU;IAACY,KAAK,EAAEN,WAAW,CAACS,MAAO;IAACD,MAAM,EAAC,qBAAqB;IAACN,KAAK,EAAEC,MAAM,CAACL;EAAK,GACpFA,IACS,CAEV,CAAC;AAEX,CAAC;AAED,MAAMK,MAAM,GAAGZ,UAAU,CAACmB,MAAM,CAAC;EAC/BN,MAAM,EAAE;IACNO,aAAa,EAAE,KAAK;IACpBC,cAAc,EAAE,eAAe;IAC/BC,cAAc,EAAE,EAAE;IAClBC,iBAAiB,EAAE;EACrB,CAAC;EACDhB,IAAI,EAAE;IACJiB,OAAO,EAAE;EACX;AACF,CAAC,CAAC;AAEF,eAAenB,wBAAwB","ignoreList":[]}

package/lib/module/ui-components/history/history-section-list-item.js

@@ -0,0 +1,42 @@
+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 from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useAppColorScheme } from '../theme/color-scheme-context';
+import HistoryItemView from './history-item';
+
+// component used on the history section lists (Settings->History, CredentialDetail->History)
+// https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?type=design&node-id=1246-51813&mode=dev
+
+const HistorySectionListItem = ({
+  first,
+  last,
+  ...props
+}) => {
+  const colorScheme = useAppColorScheme();
+  return /*#__PURE__*/React.createElement(View, {
+    style: [styles.item, first && styles.first, last && styles.last, {
+      backgroundColor: colorScheme.white
+    }]
+  }, /*#__PURE__*/React.createElement(HistoryItemView, _extends({
+    last: last
+  }, props)));
+};
+const styles = StyleSheet.create({
+  first: {
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20,
+    marginTop: 8,
+    paddingTop: 12
+  },
+  item: {
+    paddingHorizontal: 12
+  },
+  last: {
+    borderBottomLeftRadius: 20,
+    borderBottomRightRadius: 20,
+    marginBottom: 12,
+    paddingBottom: 12
+  }
+});
+export default HistorySectionListItem;
+//# sourceMappingURL=history-section-list-item.js.map

package/lib/module/ui-components/history/history-section-list-item.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","useAppColorScheme","HistoryItemView","HistorySectionListItem","first","last","props","colorScheme","createElement","style","styles","item","backgroundColor","white","_extends","create","borderTopLeftRadius","borderTopRightRadius","marginTop","paddingTop","paddingHorizontal","borderBottomLeftRadius","borderBottomRightRadius","marginBottom","paddingBottom"],"sources":["history-section-list-item.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { useAppColorScheme } from '../theme/color-scheme-context';\nimport HistoryItemView, { HistoryItemViewProps } from './history-item';\n\n// component used on the history section lists (Settings->History, CredentialDetail->History)\n// https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?type=design&node-id=1246-51813&mode=dev\n\nexport interface HistorySectionListItemProps extends HistoryItemViewProps {\n  first?: boolean;\n}\n\nconst HistorySectionListItem: FC<HistorySectionListItemProps> = ({ first, last, ...props }) => {\n  const colorScheme = useAppColorScheme();\n  return (\n    <View style={[styles.item, first && styles.first, last && styles.last, { backgroundColor: colorScheme.white }]}>\n      <HistoryItemView last={last} {...props} />\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  first: {\n    borderTopLeftRadius: 20,\n    borderTopRightRadius: 20,\n    marginTop: 8,\n    paddingTop: 12,\n  },\n  item: {\n    paddingHorizontal: 12,\n  },\n  last: {\n    borderBottomLeftRadius: 20,\n    borderBottomRightRadius: 20,\n    marginBottom: 12,\n    paddingBottom: 12,\n  },\n});\n\nexport default HistorySectionListItem;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAc,OAAO;AACjC,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,iBAAiB,QAAQ,+BAA+B;AACjE,OAAOC,eAAe,MAAgC,gBAAgB;;AAEtE;AACA;;AAMA,MAAMC,sBAAuD,GAAGA,CAAC;EAAEC,KAAK;EAAEC,IAAI;EAAE,GAAGC;AAAM,CAAC,KAAK;EAC7F,MAAMC,WAAW,GAAGN,iBAAiB,CAAC,CAAC;EACvC,oBACEH,KAAA,CAAAU,aAAA,CAACR,IAAI;IAACS,KAAK,EAAE,CAACC,MAAM,CAACC,IAAI,EAAEP,KAAK,IAAIM,MAAM,CAACN,KAAK,EAAEC,IAAI,IAAIK,MAAM,CAACL,IAAI,EAAE;MAAEO,eAAe,EAAEL,WAAW,CAACM;IAAM,CAAC;EAAE,gBAC7Gf,KAAA,CAAAU,aAAA,CAACN,eAAe,EAAAY,QAAA;IAACT,IAAI,EAAEA;EAAK,GAAKC,KAAK,CAAG,CACrC,CAAC;AAEX,CAAC;AAED,MAAMI,MAAM,GAAGX,UAAU,CAACgB,MAAM,CAAC;EAC/BX,KAAK,EAAE;IACLY,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE,EAAE;IACxBC,SAAS,EAAE,CAAC;IACZC,UAAU,EAAE;EACd,CAAC;EACDR,IAAI,EAAE;IACJS,iBAAiB,EAAE;EACrB,CAAC;EACDf,IAAI,EAAE;IACJgB,sBAAsB,EAAE,EAAE;IAC1BC,uBAAuB,EAAE,EAAE;IAC3BC,YAAY,EAAE,EAAE;IAChBC,aAAa,EAAE;EACjB;AACF,CAAC,CAAC;AAEF,eAAerB,sBAAsB","ignoreList":[]}

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

@@ -0,0 +1,10 @@
+import DataItem, { DataItemProps } from './data-item';
+import HistoryItemView, { HistoryItemViewProps } from './history-item';
+import HistorySectionHeaderView from './history-section-header';
+import HistorySectionListItem, { HistorySectionListItemProps } from './history-section-list-item';
+export * from './history-details';
+export { DataItem, DataItemProps };
+export { HistoryItemView, HistoryItemViewProps };
+export { HistorySectionHeaderView };
+export { HistorySectionListItem, HistorySectionListItemProps };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["DataItem","DataItemProps","HistoryItemView","HistoryItemViewProps","HistorySectionHeaderView","HistorySectionListItem","HistorySectionListItemProps"],"sources":["index.ts"],"sourcesContent":["import DataItem, { DataItemProps } from './data-item';\nimport HistoryItemView, { HistoryItemViewProps } from './history-item';\nimport HistorySectionHeaderView from './history-section-header';\nimport HistorySectionListItem, { HistorySectionListItemProps } from './history-section-list-item';\n\nexport * from './history-details';\nexport { DataItem, DataItemProps };\nexport { HistoryItemView, HistoryItemViewProps };\nexport { HistorySectionHeaderView };\nexport { HistorySectionListItem, HistorySectionListItemProps };\n"],"mappings":"AAAA,OAAOA,QAAQ,IAAIC,aAAa,QAAQ,aAAa;AACrD,OAAOC,eAAe,IAAIC,oBAAoB,QAAQ,gBAAgB;AACtE,OAAOC,wBAAwB,MAAM,0BAA0B;AAC/D,OAAOC,sBAAsB,IAAIC,2BAA2B,QAAQ,6BAA6B;AAEjG,cAAc,mBAAmB;AACjC,SAASN,QAAQ,EAAEC,aAAa;AAChC,SAASC,eAAe,EAAEC,oBAAoB;AAC9C,SAASC,wBAAwB;AACjC,SAASC,sBAAsB,EAAEC,2BAA2B","ignoreList":[]}