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

package/lib/commonjs/ui-components/screens/nerd-mode-screen.js

@@ -0,0 +1,165 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.EntityType = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _entityDetailsWithButtons = _interopRequireDefault(require("../../components/entity/entity-details-with-buttons"));
+var _contrastingStatusBar = _interopRequireDefault(require("../../utils/contrasting-status-bar"));
+var _testID = require("../../utils/testID");
+var _accessibilityHistoryWrappers = require("../accessibility/accessibilityHistoryWrappers");
+var _entityCluster = _interopRequireDefault(require("../entity/entity-cluster"));
+var _navigationHeader = _interopRequireDefault(require("../header/navigation-header"));
+var _icons = require("../icons/icons");
+var _nerdModeItem = _interopRequireDefault(require("../nerd-view/nerd-mode-item"));
+var _typography = _interopRequireDefault(require("../text/typography"));
+var _colorSchemeContext = require("../theme/color-scheme-context");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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); }
+let EntityType = exports.EntityType = /*#__PURE__*/function (EntityType) {
+  EntityType[EntityType["CredentialEntity"] = 0] = "CredentialEntity";
+  EntityType[EntityType["ProofEntity"] = 1] = "ProofEntity";
+  return EntityType;
+}({});
+function isSectionEntityCluster(item) {
+  return item.did !== undefined;
+}
+const AnimatedSectionList = _reactNativeReanimated.default.createAnimatedComponent(_reactNative.SectionList);
+const NerdModeScreen = ({
+  sections,
+  labels,
+  onClose,
+  onCopyToClipboard,
+  entityCluster,
+  testID,
+  title
+}) => {
+  var _entityCluster$testID;
+  const insets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const colorScheme = (0, _colorSchemeContext.useAppColorScheme)();
+  const scrollOffset = (0, _reactNativeReanimated.useSharedValue)(0);
+  const [expandedAttributes, setExpandedAttributes] = (0, _react.useState)(0);
+
+  // This is a bit of a hack. It's used to notify attributes that another attribute has been expanded
+  // which will allow them to update their scroll offset accordingly.
+  const onExpand = expanded => {
+    setExpandedAttributes(prev => expanded ? prev + 1 : prev - 1);
+  };
+  const onScroll = (0, _reactNativeReanimated.useAnimatedScrollHandler)({
+    onScroll: ({
+      contentOffset
+    }) => {
+      scrollOffset.value = contentOffset.y;
+    }
+  });
+  const lastElementsForSection = sections.reduce((acc, {
+    title: sectionTitle = '',
+    data
+  }) => {
+    const lastElement = data[data.length - 1];
+    return {
+      ...acc,
+      [sectionTitle]: lastElement && !isSectionEntityCluster(lastElement) ? lastElement.attributeKey : ''
+    };
+  }, {});
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_contrastingStatusBar.default, {
+    backgroundColor: colorScheme.nerdView.background
+  }), /*#__PURE__*/_react.default.createElement(_navigationHeader.default, {
+    leftItem: /*#__PURE__*/_react.default.createElement(_accessibilityHistoryWrappers.TouchableOpacity, {
+      onPress: onClose,
+      testID: (0, _testID.concatTestID)(testID, 'closeIcon')
+    }, /*#__PURE__*/_react.default.createElement(_icons.CloseIcon, {
+      color: colorScheme.white
+    })),
+    style: {
+      backgroundColor: colorScheme.nerdView.background,
+      paddingTop: insets.top
+    },
+    title: title,
+    titleColor: colorScheme.white
+  }), /*#__PURE__*/_react.default.createElement(AnimatedSectionList, {
+    ListHeaderComponent: entityCluster ? /*#__PURE__*/_react.default.createElement(_entityDetailsWithButtons.default, _extends({}, entityCluster, {
+      entityType: EntityType.ProofEntity,
+      entityLabels: entityCluster.entityLabels,
+      attributesLabels: labels,
+      style: [styles.entityCluster, {
+        backgroundColor: colorScheme.nerdView.background
+      }],
+      onCopyToClipboard: onCopyToClipboard,
+      testID: (_entityCluster$testID = entityCluster.testID) !== null && _entityCluster$testID !== void 0 ? _entityCluster$testID : (0, _testID.concatTestID)(testID, 'entityCluster'),
+      textColor: colorScheme.white
+    })) : null,
+    onScroll: onScroll,
+    renderItem: ({
+      item,
+      section,
+      index
+    }) => {
+      if (isSectionEntityCluster(item)) {
+        var _item$testID;
+        return /*#__PURE__*/_react.default.createElement(_entityDetailsWithButtons.default, _extends({}, item, {
+          entityType: EntityType.CredentialEntity,
+          entityLabels: item.entityLabels,
+          attributesLabels: labels,
+          style: [styles.entityCluster, {
+            backgroundColor: colorScheme.nerdView.background
+          }],
+          onCopyToClipboard: onCopyToClipboard,
+          testID: (_item$testID = item.testID) !== null && _item$testID !== void 0 ? _item$testID : (0, _testID.concatTestID)(testID, 'sectionEntityCluster', index.toString()),
+          textColor: colorScheme.white
+        }));
+      } else {
+        return /*#__PURE__*/_react.default.createElement(_nerdModeItem.default, _extends({}, item, {
+          expandedAttributes: expandedAttributes,
+          labels: labels,
+          last: lastElementsForSection[section.title] === item.attributeKey,
+          onCopyToClipboard: onCopyToClipboard,
+          onExpand: onExpand,
+          scrollOffset: scrollOffset,
+          testID: (0, _testID.concatTestID)(testID, item.testID)
+        }));
+      }
+    },
+    renderSectionHeader: ({
+      section
+    }) => {
+      return section.title ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+        style: styles.sectionHeaderContainer,
+        testID: (0, _testID.concatTestID)(testID, section.title)
+      }, /*#__PURE__*/_react.default.createElement(_typography.default, {
+        color: colorScheme.white,
+        style: styles.sectionHeaderText
+      }, section.title)) : null;
+    },
+    scrollEventThrottle: 16,
+    sections: sections,
+    stickySectionHeadersEnabled: false,
+    style: {
+      backgroundColor: colorScheme.nerdView.background
+    },
+    testID: testID
+  }));
+};
+const styles = _reactNative.StyleSheet.create({
+  entityCluster: {
+    paddingHorizontal: 24,
+    paddingVertical: 20
+  },
+  sectionHeaderContainer: {
+    justifyContent: 'center',
+    marginTop: 20,
+    paddingVertical: 16
+  },
+  sectionHeaderText: {
+    opacity: 0.7,
+    paddingHorizontal: 20
+  }
+});
+var _default = exports.default = NerdModeScreen;
+//# sourceMappingURL=nerd-mode-screen.js.map

package/lib/commonjs/ui-components/screens/nerd-mode-screen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_reactNativeSafeAreaContext","_entityDetailsWithButtons","_interopRequireDefault","_contrastingStatusBar","_testID","_accessibilityHistoryWrappers","_entityCluster","_navigationHeader","_icons","_nerdModeItem","_typography","_colorSchemeContext","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","EntityType","exports","isSectionEntityCluster","item","did","undefined","AnimatedSectionList","Animated","createAnimatedComponent","SectionList","NerdModeScreen","sections","labels","onClose","onCopyToClipboard","entityCluster","testID","title","_entityCluster$testID","insets","useSafeAreaInsets","colorScheme","useAppColorScheme","scrollOffset","useSharedValue","expandedAttributes","setExpandedAttributes","useState","onExpand","expanded","prev","onScroll","useAnimatedScrollHandler","contentOffset","value","y","lastElementsForSection","reduce","acc","sectionTitle","data","lastElement","attributeKey","createElement","Fragment","backgroundColor","nerdView","background","leftItem","TouchableOpacity","onPress","concatTestID","CloseIcon","color","white","style","paddingTop","top","titleColor","ListHeaderComponent","entityType","ProofEntity","entityLabels","attributesLabels","styles","textColor","renderItem","section","index","_item$testID","CredentialEntity","toString","last","renderSectionHeader","View","sectionHeaderContainer","sectionHeaderText","scrollEventThrottle","stickySectionHeadersEnabled","StyleSheet","create","paddingHorizontal","paddingVertical","justifyContent","marginTop","opacity","_default"],"sources":["nerd-mode-screen.tsx"],"sourcesContent":["import { DidListItem } from '@procivis/react-native-one-core';\nimport React, { FunctionComponent, useState } from 'react';\nimport { SectionList, StyleSheet, View } from 'react-native';\nimport Animated, { useAnimatedScrollHandler, useSharedValue } from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport EntityDetailsWithButtons, { ContextRole } from '../../components/entity/entity-details-with-buttons';\nimport ContrastingStatusBar from '../../utils/contrasting-status-bar';\nimport { concatTestID } from '../../utils/testID';\nimport { TouchableOpacity } from '../accessibility/accessibilityHistoryWrappers';\nimport SectionEntityCluster from '../entity/entity-cluster';\nimport NavigationHeader from '../header/navigation-header';\nimport { CloseIcon } from '../icons/icons';\nimport NerdModeItem, { NerdModeItemProps } from '../nerd-view/nerd-mode-item';\nimport Typography from '../text/typography';\nimport { useAppColorScheme } from '../theme/color-scheme-context';\n\nexport interface EntityLabels {\n  trusted: string;\n  unknownIssuer: string;\n  unknownVerifier: string;\n  visitWebsite: string;\n  termsAndServices: string;\n  privacyPolicy: string;\n}\n\nexport interface AttributesLabels {\n  trustRegistry: string;\n  issuerDid: string;\n  entityDid: string;\n  role: string;\n  expand: string;\n  collapse: string;\n}\n\ninterface SectionEntityCluster {\n  did?: DidListItem;\n  subline?: string;\n  entityLabels: EntityLabels;\n  role: ContextRole;\n  testID?: string;\n}\n\ntype SectionAttribute = Omit<NerdModeItemProps, 'labels' | 'onCopyToClipboard'>;\n\ntype NerdModeSectionItem = SectionAttribute | SectionEntityCluster;\n\nexport type NerdModeSection = {\n  data: NerdModeSectionItem[];\n  title?: string;\n};\n\nexport type NerdModeScreenProps = {\n  entityCluster?: SectionEntityCluster;\n  labels: AttributesLabels;\n  onClose: () => void;\n  onCopyToClipboard: (value: string) => void;\n  sections: NerdModeSection[];\n  testID: string;\n  title: string;\n};\n\nexport enum EntityType {\n  CredentialEntity,\n  ProofEntity,\n}\n\nfunction isSectionEntityCluster(item: NerdModeSectionItem): item is SectionEntityCluster {\n  return (item as SectionEntityCluster).did !== undefined;\n}\n\nconst AnimatedSectionList = Animated.createAnimatedComponent(SectionList<NerdModeSectionItem>);\n\nconst NerdModeScreen: FunctionComponent<NerdModeScreenProps> = ({\n  sections,\n  labels,\n  onClose,\n  onCopyToClipboard,\n  entityCluster,\n  testID,\n  title,\n}) => {\n  const insets = useSafeAreaInsets();\n  const colorScheme = useAppColorScheme();\n  const scrollOffset = useSharedValue(0);\n  const [expandedAttributes, setExpandedAttributes] = useState(0);\n\n  // This is a bit of a hack. It's used to notify attributes that another attribute has been expanded\n  // which will allow them to update their scroll offset accordingly.\n  const onExpand = (expanded: boolean) => {\n    setExpandedAttributes((prev) => (expanded ? prev + 1 : prev - 1));\n  };\n\n  const onScroll = useAnimatedScrollHandler({\n    onScroll: ({ contentOffset }) => {\n      scrollOffset.value = contentOffset.y;\n    },\n  });\n\n  const lastElementsForSection = sections.reduce((acc, { title: sectionTitle = '', data }) => {\n    const lastElement = data[data.length - 1];\n    return {\n      ...acc,\n      [sectionTitle]: lastElement && !isSectionEntityCluster(lastElement) ? lastElement.attributeKey : '',\n    };\n  }, {} as Record<string, string>);\n\n  return (\n    <>\n      <ContrastingStatusBar backgroundColor={colorScheme.nerdView.background} />\n      <NavigationHeader\n        leftItem={\n          <TouchableOpacity onPress={onClose} testID={concatTestID(testID, 'closeIcon')}>\n            <CloseIcon color={colorScheme.white} />\n          </TouchableOpacity>\n        }\n        style={{\n          backgroundColor: colorScheme.nerdView.background,\n          paddingTop: insets.top,\n        }}\n        title={title}\n        titleColor={colorScheme.white}\n      />\n      <AnimatedSectionList\n        ListHeaderComponent={\n          entityCluster ? (\n            <EntityDetailsWithButtons\n              {...entityCluster}\n              entityType={EntityType.ProofEntity}\n              entityLabels={entityCluster.entityLabels}\n              attributesLabels={labels}\n              style={[\n                styles.entityCluster,\n                {\n                  backgroundColor: colorScheme.nerdView.background,\n                },\n              ]}\n              onCopyToClipboard={onCopyToClipboard}\n              testID={entityCluster.testID ?? concatTestID(testID, 'entityCluster')}\n              textColor={colorScheme.white}\n            />\n          ) : null\n        }\n        onScroll={onScroll}\n        renderItem={({ item, section, index }) => {\n          if (isSectionEntityCluster(item)) {\n            return (\n              <EntityDetailsWithButtons\n                {...item}\n                entityType={EntityType.CredentialEntity}\n                entityLabels={item!.entityLabels}\n                attributesLabels={labels}\n                style={[\n                  styles.entityCluster,\n                  {\n                    backgroundColor: colorScheme.nerdView.background,\n                  },\n                ]}\n                onCopyToClipboard={onCopyToClipboard}\n                testID={item.testID ?? concatTestID(testID, 'sectionEntityCluster', index.toString())}\n                textColor={colorScheme.white}\n              />\n            );\n          } else {\n            return (\n              <NerdModeItem\n                {...item}\n                expandedAttributes={expandedAttributes}\n                labels={labels}\n                last={lastElementsForSection[section.title] === item.attributeKey}\n                onCopyToClipboard={onCopyToClipboard}\n                onExpand={onExpand}\n                scrollOffset={scrollOffset}\n                testID={concatTestID(testID, item.testID)}\n              />\n            );\n          }\n        }}\n        renderSectionHeader={({ section }) => {\n          return section.title ? (\n            <View style={styles.sectionHeaderContainer} testID={concatTestID(testID, section.title)}>\n              <Typography color={colorScheme.white} style={styles.sectionHeaderText}>\n                {section.title}\n              </Typography>\n            </View>\n          ) : null;\n        }}\n        scrollEventThrottle={16}\n        sections={sections}\n        stickySectionHeadersEnabled={false}\n        style={{ backgroundColor: colorScheme.nerdView.background }}\n        testID={testID}\n      />\n    </>\n  );\n};\n\nconst styles = StyleSheet.create({\n  entityCluster: {\n    paddingHorizontal: 24,\n    paddingVertical: 20,\n  },\n  sectionHeaderContainer: {\n    justifyContent: 'center',\n    marginTop: 20,\n    paddingVertical: 16,\n  },\n  sectionHeaderText: {\n    opacity: 0.7,\n    paddingHorizontal: 20,\n  },\n});\n\nexport default NerdModeScreen;\n"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAH,uBAAA,CAAAC,OAAA;AACA,IAAAG,2BAAA,GAAAH,OAAA;AAEA,IAAAI,yBAAA,GAAAC,sBAAA,CAAAL,OAAA;AACA,IAAAM,qBAAA,GAAAD,sBAAA,CAAAL,OAAA;AACA,IAAAO,OAAA,GAAAP,OAAA;AACA,IAAAQ,6BAAA,GAAAR,OAAA;AACA,IAAAS,cAAA,GAAAJ,sBAAA,CAAAL,OAAA;AACA,IAAAU,iBAAA,GAAAL,sBAAA,CAAAL,OAAA;AACA,IAAAW,MAAA,GAAAX,OAAA;AACA,IAAAY,aAAA,GAAAP,sBAAA,CAAAL,OAAA;AACA,IAAAa,WAAA,GAAAR,sBAAA,CAAAL,OAAA;AACA,IAAAc,mBAAA,GAAAd,OAAA;AAAkE,SAAAK,uBAAAU,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,yBAAAH,CAAA,6BAAAI,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAD,wBAAA,YAAAA,CAAAH,CAAA,WAAAA,CAAA,GAAAM,CAAA,GAAAD,CAAA,KAAAL,CAAA;AAAA,SAAAhB,wBAAAgB,CAAA,EAAAK,CAAA,SAAAA,CAAA,IAAAL,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAE,OAAA,EAAAF,CAAA,QAAAM,CAAA,GAAAH,wBAAA,CAAAE,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAP,CAAA,UAAAM,CAAA,CAAAE,GAAA,CAAAR,CAAA,OAAAS,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAf,CAAA,oBAAAe,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAe,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAd,CAAA,EAAAe,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAf,CAAA,CAAAe,CAAA,YAAAN,CAAA,CAAAP,OAAA,GAAAF,CAAA,EAAAM,CAAA,IAAAA,CAAA,CAAAa,GAAA,CAAAnB,CAAA,EAAAS,CAAA,GAAAA,CAAA;AAAA,SAAAW,SAAA,WAAAA,QAAA,GAAAR,MAAA,CAAAS,MAAA,GAAAT,MAAA,CAAAS,MAAA,CAAAC,IAAA,eAAAb,CAAA,aAAAT,CAAA,MAAAA,CAAA,GAAAuB,SAAA,CAAAC,MAAA,EAAAxB,CAAA,UAAAM,CAAA,GAAAiB,SAAA,CAAAvB,CAAA,YAAAK,CAAA,IAAAC,CAAA,OAAAU,cAAA,CAAAC,IAAA,CAAAX,CAAA,EAAAD,CAAA,MAAAI,CAAA,CAAAJ,CAAA,IAAAC,CAAA,CAAAD,CAAA,aAAAI,CAAA,KAAAW,QAAA,CAAAK,KAAA,OAAAF,SAAA;AAAA,IA+CtDG,UAAU,GAAAC,OAAA,CAAAD,UAAA,0BAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAA,OAAVA,UAAU;AAAA;AAKtB,SAASE,sBAAsBA,CAACC,IAAyB,EAAgC;EACvF,OAAQA,IAAI,CAA0BC,GAAG,KAAKC,SAAS;AACzD;AAEA,MAAMC,mBAAmB,GAAGC,8BAAQ,CAACC,uBAAuB,CAACC,wBAAgC,CAAC;AAE9F,MAAMC,cAAsD,GAAGA,CAAC;EAC9DC,QAAQ;EACRC,MAAM;EACNC,OAAO;EACPC,iBAAiB;EACjBC,aAAa;EACbC,MAAM;EACNC;AACF,CAAC,KAAK;EAAA,IAAAC,qBAAA;EACJ,MAAMC,MAAM,GAAG,IAAAC,6CAAiB,EAAC,CAAC;EAClC,MAAMC,WAAW,GAAG,IAAAC,qCAAiB,EAAC,CAAC;EACvC,MAAMC,YAAY,GAAG,IAAAC,qCAAc,EAAC,CAAC,CAAC;EACtC,MAAM,CAACC,kBAAkB,EAAEC,qBAAqB,CAAC,GAAG,IAAAC,eAAQ,EAAC,CAAC,CAAC;;EAE/D;EACA;EACA,MAAMC,QAAQ,GAAIC,QAAiB,IAAK;IACtCH,qBAAqB,CAAEI,IAAI,IAAMD,QAAQ,GAAGC,IAAI,GAAG,CAAC,GAAGA,IAAI,GAAG,CAAE,CAAC;EACnE,CAAC;EAED,MAAMC,QAAQ,GAAG,IAAAC,+CAAwB,EAAC;IACxCD,QAAQ,EAAEA,CAAC;MAAEE;IAAc,CAAC,KAAK;MAC/BV,YAAY,CAACW,KAAK,GAAGD,aAAa,CAACE,CAAC;IACtC;EACF,CAAC,CAAC;EAEF,MAAMC,sBAAsB,GAAGzB,QAAQ,CAAC0B,MAAM,CAAC,CAACC,GAAG,EAAE;IAAErB,KAAK,EAAEsB,YAAY,GAAG,EAAE;IAAEC;EAAK,CAAC,KAAK;IAC1F,MAAMC,WAAW,GAAGD,IAAI,CAACA,IAAI,CAAC1C,MAAM,GAAG,CAAC,CAAC;IACzC,OAAO;MACL,GAAGwC,GAAG;MACN,CAACC,YAAY,GAAGE,WAAW,IAAI,CAACvC,sBAAsB,CAACuC,WAAW,CAAC,GAAGA,WAAW,CAACC,YAAY,GAAG;IACnG,CAAC;EACH,CAAC,EAAE,CAAC,CAA2B,CAAC;EAEhC,oBACErF,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAAAtF,MAAA,CAAAmB,OAAA,CAAAoE,QAAA,qBACEvF,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAAC9E,qBAAA,CAAAW,OAAoB;IAACqE,eAAe,EAAExB,WAAW,CAACyB,QAAQ,CAACC;EAAW,CAAE,CAAC,eAC1E1F,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAAC1E,iBAAA,CAAAO,OAAgB;IACfwE,QAAQ,eACN3F,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAAC5E,6BAAA,CAAAkF,gBAAgB;MAACC,OAAO,EAAErC,OAAQ;MAACG,MAAM,EAAE,IAAAmC,oBAAY,EAACnC,MAAM,EAAE,WAAW;IAAE,gBAC5E3D,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAACzE,MAAA,CAAAkF,SAAS;MAACC,KAAK,EAAEhC,WAAW,CAACiC;IAAM,CAAE,CACtB,CACnB;IACDC,KAAK,EAAE;MACLV,eAAe,EAAExB,WAAW,CAACyB,QAAQ,CAACC,UAAU;MAChDS,UAAU,EAAErC,MAAM,CAACsC;IACrB,CAAE;IACFxC,KAAK,EAAEA,KAAM;IACbyC,UAAU,EAAErC,WAAW,CAACiC;EAAM,CAC/B,CAAC,eACFjG,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAACrC,mBAAmB;IAClBqD,mBAAmB,EACjB5C,aAAa,gBACX1D,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAAChF,yBAAA,CAAAa,OAAwB,EAAAkB,QAAA,KACnBqB,aAAa;MACjB6C,UAAU,EAAE5D,UAAU,CAAC6D,WAAY;MACnCC,YAAY,EAAE/C,aAAa,CAAC+C,YAAa;MACzCC,gBAAgB,EAAEnD,MAAO;MACzB2C,KAAK,EAAE,CACLS,MAAM,CAACjD,aAAa,EACpB;QACE8B,eAAe,EAAExB,WAAW,CAACyB,QAAQ,CAACC;MACxC,CAAC,CACD;MACFjC,iBAAiB,EAAEA,iBAAkB;MACrCE,MAAM,GAAAE,qBAAA,GAAEH,aAAa,CAACC,MAAM,cAAAE,qBAAA,cAAAA,qBAAA,GAAI,IAAAiC,oBAAY,EAACnC,MAAM,EAAE,eAAe,CAAE;MACtEiD,SAAS,EAAE5C,WAAW,CAACiC;IAAM,EAC9B,CAAC,GACA,IACL;IACDvB,QAAQ,EAAEA,QAAS;IACnBmC,UAAU,EAAEA,CAAC;MAAE/D,IAAI;MAAEgE,OAAO;MAAEC;IAAM,CAAC,KAAK;MACxC,IAAIlE,sBAAsB,CAACC,IAAI,CAAC,EAAE;QAAA,IAAAkE,YAAA;QAChC,oBACEhH,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAAChF,yBAAA,CAAAa,OAAwB,EAAAkB,QAAA,KACnBS,IAAI;UACRyD,UAAU,EAAE5D,UAAU,CAACsE,gBAAiB;UACxCR,YAAY,EAAE3D,IAAI,CAAE2D,YAAa;UACjCC,gBAAgB,EAAEnD,MAAO;UACzB2C,KAAK,EAAE,CACLS,MAAM,CAACjD,aAAa,EACpB;YACE8B,eAAe,EAAExB,WAAW,CAACyB,QAAQ,CAACC;UACxC,CAAC,CACD;UACFjC,iBAAiB,EAAEA,iBAAkB;UACrCE,MAAM,GAAAqD,YAAA,GAAElE,IAAI,CAACa,MAAM,cAAAqD,YAAA,cAAAA,YAAA,GAAI,IAAAlB,oBAAY,EAACnC,MAAM,EAAE,sBAAsB,EAAEoD,KAAK,CAACG,QAAQ,CAAC,CAAC,CAAE;UACtFN,SAAS,EAAE5C,WAAW,CAACiC;QAAM,EAC9B,CAAC;MAEN,CAAC,MAAM;QACL,oBACEjG,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAACxE,aAAA,CAAAK,OAAY,EAAAkB,QAAA,KACPS,IAAI;UACRsB,kBAAkB,EAAEA,kBAAmB;UACvCb,MAAM,EAAEA,MAAO;UACf4D,IAAI,EAAEpC,sBAAsB,CAAC+B,OAAO,CAAClD,KAAK,CAAC,KAAKd,IAAI,CAACuC,YAAa;UAClE5B,iBAAiB,EAAEA,iBAAkB;UACrCc,QAAQ,EAAEA,QAAS;UACnBL,YAAY,EAAEA,YAAa;UAC3BP,MAAM,EAAE,IAAAmC,oBAAY,EAACnC,MAAM,EAAEb,IAAI,CAACa,MAAM;QAAE,EAC3C,CAAC;MAEN;IACF,CAAE;IACFyD,mBAAmB,EAAEA,CAAC;MAAEN;IAAQ,CAAC,KAAK;MACpC,OAAOA,OAAO,CAAClD,KAAK,gBAClB5D,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAACnF,YAAA,CAAAkH,IAAI;QAACnB,KAAK,EAAES,MAAM,CAACW,sBAAuB;QAAC3D,MAAM,EAAE,IAAAmC,oBAAY,EAACnC,MAAM,EAAEmD,OAAO,CAAClD,KAAK;MAAE,gBACtF5D,MAAA,CAAAmB,OAAA,CAAAmE,aAAA,CAACvE,WAAA,CAAAI,OAAU;QAAC6E,KAAK,EAAEhC,WAAW,CAACiC,KAAM;QAACC,KAAK,EAAES,MAAM,CAACY;MAAkB,GACnET,OAAO,CAAClD,KACC,CACR,CAAC,GACL,IAAI;IACV,CAAE;IACF4D,mBAAmB,EAAE,EAAG;IACxBlE,QAAQ,EAAEA,QAAS;IACnBmE,2BAA2B,EAAE,KAAM;IACnCvB,KAAK,EAAE;MAAEV,eAAe,EAAExB,WAAW,CAACyB,QAAQ,CAACC;IAAW,CAAE;IAC5D/B,MAAM,EAAEA;EAAO,CAChB,CACD,CAAC;AAEP,CAAC;AAED,MAAMgD,MAAM,GAAGe,uBAAU,CAACC,MAAM,CAAC;EAC/BjE,aAAa,EAAE;IACbkE,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACDP,sBAAsB,EAAE;IACtBQ,cAAc,EAAE,QAAQ;IACxBC,SAAS,EAAE,EAAE;IACbF,eAAe,EAAE;EACnB,CAAC;EACDN,iBAAiB,EAAE;IACjBS,OAAO,EAAE,GAAG;IACZJ,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AAAC,IAAAK,QAAA,GAAArF,OAAA,CAAAzB,OAAA,GAEYkC,cAAc","ignoreList":[]}

package/lib/commonjs/ui-components/screens/qr-code-scanner-screen.js

@@ -0,0 +1,118 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _reactNativeVisionCamera = require("react-native-vision-camera");
+var _utils = require("../../utils");
+var _color = require("../../utils/color");
+var _accessibilityLanguage = require("../accessibility/accessibilityLanguage");
+var _blurView = _interopRequireDefault(require("../blur/blur-view"));
+var _buttons = require("../buttons");
+var _cameraOverlay = _interopRequireDefault(require("../camera/camera-overlay"));
+var _qrCodeScanner = _interopRequireDefault(require("../camera/qr-code-scanner"));
+var _icons = require("../icons");
+var _text = require("../text");
+var _theme = require("../theme");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const QRCodeScannerScreen = ({
+  codeTypes,
+  footer,
+  onQRCodeRead,
+  onClose,
+  overlayStyle,
+  noCameraView = null,
+  title
+}) => {
+  const t = (0, _accessibilityLanguage.useAccessibilityTranslation)();
+  const insets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const colorScheme = (0, _theme.useAppColorScheme)();
+  const footerView = (0, _react.useMemo)(() => {
+    if (!footer) {
+      return undefined;
+    }
+    if (/*#__PURE__*/_react.default.isValidElement(footer)) {
+      return footer;
+    } else {
+      const FooterComponent = footer;
+      return /*#__PURE__*/_react.default.createElement(FooterComponent, null);
+    }
+  }, [footer]);
+  const minBottomBlurViewHeight = _reactNative.Dimensions.get('window').height * 0.15;
+  const device = (0, _reactNativeVisionCamera.useCameraDevice)('back');
+  if (!device) {
+    return noCameraView;
+  }
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.container
+  }, /*#__PURE__*/_react.default.createElement(_qrCodeScanner.default, {
+    cameraOverlay: /*#__PURE__*/_react.default.createElement(_cameraOverlay.default, {
+      style: overlayStyle
+    }),
+    codeTypes: codeTypes,
+    onQRCodeRead: onQRCodeRead,
+    style: _reactNative.StyleSheet.absoluteFill
+  }), /*#__PURE__*/_react.default.createElement(_utils.ContrastingStatusBar, {
+    backgroundColor: colorScheme.black
+  }), /*#__PURE__*/_react.default.createElement(_blurView.default, {
+    darkMode: true,
+    blurStyle: "soft",
+    style: [styles.topBlurView, {
+      backgroundColor: (0, _color.colorWithAlphaComponent)(colorScheme.black, 0.5)
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.headerSection, {
+      top: insets.top
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_buttons.GhostButton, {
+    icon: /*#__PURE__*/_react.default.createElement(_icons.CloseIcon, {
+      color: colorScheme.white
+    }),
+    onPress: onClose,
+    accessibilityLabel: t('accessibility.nav.close')
+  }))), /*#__PURE__*/_react.default.createElement(_blurView.default, {
+    darkMode: true,
+    blurStyle: "soft",
+    style: [styles.bottomBlurView, {
+      backgroundColor: (0, _color.colorWithAlphaComponent)(colorScheme.black, 0.5),
+      minHeight: minBottomBlurViewHeight,
+      paddingBottom: Math.max(insets.bottom, 32)
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_text.Typography, {
+    align: "center",
+    style: styles.title,
+    color: colorScheme.white
+  }, title), footerView));
+};
+const styles = _reactNative.StyleSheet.create({
+  bottomBlurView: {
+    bottom: 0,
+    position: 'absolute',
+    width: '100%'
+  },
+  container: {
+    flex: 1
+  },
+  headerSection: {
+    paddingHorizontal: 22,
+    paddingTop: 16,
+    position: 'absolute'
+  },
+  title: {
+    marginTop: 32
+  },
+  topBlurView: {
+    height: '15%',
+    position: 'absolute',
+    top: 0,
+    width: '100%'
+  }
+});
+var _default = exports.default = /*#__PURE__*/(0, _react.memo)(QRCodeScannerScreen);
+//# sourceMappingURL=qr-code-scanner-screen.js.map

package/lib/commonjs/ui-components/screens/qr-code-scanner-screen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeSafeAreaContext","_reactNativeVisionCamera","_utils","_color","_accessibilityLanguage","_blurView","_interopRequireDefault","_buttons","_cameraOverlay","_qrCodeScanner","_icons","_text","_theme","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","QRCodeScannerScreen","codeTypes","footer","onQRCodeRead","onClose","overlayStyle","noCameraView","title","useAccessibilityTranslation","insets","useSafeAreaInsets","colorScheme","useAppColorScheme","footerView","useMemo","undefined","React","isValidElement","FooterComponent","createElement","minBottomBlurViewHeight","Dimensions","height","device","useCameraDevice","View","style","styles","container","cameraOverlay","StyleSheet","absoluteFill","ContrastingStatusBar","backgroundColor","black","darkMode","blurStyle","topBlurView","colorWithAlphaComponent","headerSection","top","GhostButton","icon","CloseIcon","color","white","onPress","accessibilityLabel","bottomBlurView","minHeight","paddingBottom","Math","max","bottom","Typography","align","create","position","width","flex","paddingHorizontal","paddingTop","marginTop","_default","exports","memo"],"sources":["qr-code-scanner-screen.tsx"],"sourcesContent":["import React, { FunctionComponent, memo, ReactElement, useMemo } from 'react';\nimport { Dimensions, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useCameraDevice } from 'react-native-vision-camera';\n\nimport { ContrastingStatusBar } from '../../utils';\nimport { colorWithAlphaComponent } from '../../utils/color';\nimport { useAccessibilityTranslation } from '../accessibility/accessibilityLanguage';\nimport BlurView from '../blur/blur-view';\nimport { GhostButton } from '../buttons';\nimport CameraOverlay from '../camera/camera-overlay';\nimport QRCodeScanner, { QRCodeScannerProps } from '../camera/qr-code-scanner';\nimport { CloseIcon } from '../icons';\nimport { Typography } from '../text';\nimport { useAppColorScheme } from '../theme';\n\nexport interface QRCodeScannerScreenProps {\n  codeTypes?: QRCodeScannerProps['codeTypes'];\n  footer?: React.ComponentType<any> | React.ReactElement;\n  onQRCodeRead: QRCodeScannerProps['onQRCodeRead'];\n  onClose: () => void;\n  overlayStyle?: StyleProp<ViewStyle>;\n  noCameraView?: JSX.Element;\n  title: ReactElement | string;\n}\n\nconst QRCodeScannerScreen: FunctionComponent<QRCodeScannerScreenProps> = ({\n  codeTypes,\n  footer,\n  onQRCodeRead,\n  onClose,\n  overlayStyle,\n  noCameraView = null,\n  title,\n}) => {\n  const t = useAccessibilityTranslation();\n  const insets = useSafeAreaInsets();\n  const colorScheme = useAppColorScheme();\n\n  const footerView: React.ReactElement | undefined = useMemo(() => {\n    if (!footer) {\n      return undefined;\n    }\n    if (React.isValidElement(footer)) {\n      return footer;\n    } else {\n      const FooterComponent = footer as React.ComponentType<any>;\n      return <FooterComponent />;\n    }\n  }, [footer]);\n\n  const minBottomBlurViewHeight = Dimensions.get('window').height * 0.15;\n\n  const device = useCameraDevice('back');\n  if (!device) {\n    return noCameraView;\n  }\n\n  return (\n    <View style={styles.container}>\n      <QRCodeScanner\n        cameraOverlay={<CameraOverlay style={overlayStyle} />}\n        codeTypes={codeTypes}\n        onQRCodeRead={onQRCodeRead}\n        style={StyleSheet.absoluteFill}\n      />\n      <ContrastingStatusBar backgroundColor={colorScheme.black} />\n      <BlurView\n        darkMode={true}\n        blurStyle=\"soft\"\n        style={[styles.topBlurView, { backgroundColor: colorWithAlphaComponent(colorScheme.black, 0.5) }]}>\n        <View style={[styles.headerSection, { top: insets.top }]}>\n          <GhostButton\n            icon={<CloseIcon color={colorScheme.white} />}\n            onPress={onClose}\n            accessibilityLabel={t('accessibility.nav.close')}\n          />\n        </View>\n      </BlurView>\n      <BlurView\n        darkMode={true}\n        blurStyle=\"soft\"\n        style={[\n          styles.bottomBlurView,\n          {\n            backgroundColor: colorWithAlphaComponent(colorScheme.black, 0.5),\n            minHeight: minBottomBlurViewHeight,\n            paddingBottom: Math.max(insets.bottom, 32),\n          },\n        ]}>\n        <Typography align=\"center\" style={styles.title} color={colorScheme.white}>\n          {title}\n        </Typography>\n        {footerView}\n      </BlurView>\n    </View>\n  );\n};\nconst styles = StyleSheet.create({\n  bottomBlurView: {\n    bottom: 0,\n    position: 'absolute',\n    width: '100%',\n  },\n  container: {\n    flex: 1,\n  },\n  headerSection: {\n    paddingHorizontal: 22,\n    paddingTop: 16,\n    position: 'absolute',\n  },\n  title: {\n    marginTop: 32,\n  },\n  topBlurView: {\n    height: '15%',\n    position: 'absolute',\n    top: 0,\n    width: '100%',\n  },\n});\n\nexport default memo(QRCodeScannerScreen);\n"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/ui-components/screens/scroll-view-screen.js

@@ -0,0 +1,92 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _onScrollHeaderState = require("../../utils/hooks/header/on-scroll-header-state");
+var _listContentInset = require("../../utils/hooks/list/list-content-inset");
+var _testID = require("../../utils/testID");
+var _navigationHeader = _interopRequireDefault(require("../header/navigation-header"));
+var _listTitleHeader = _interopRequireDefault(require("../list/list-title-header"));
+var _colorSchemeContext = require("../theme/color-scheme-context");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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); }
+const ScrollViewScreen = ({
+  children,
+  header,
+  modalPresentation,
+  scrollView,
+  style,
+  testID,
+  ...viewProps
+}) => {
+  const colorScheme = (0, _colorSchemeContext.useAppColorScheme)();
+  const {
+    top
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const contentInsetsStyle = (0, _listContentInset.useListContentInset)({
+    additionalBottomPadding: 24,
+    headerHeight: modalPresentation && _reactNative.Platform.OS === 'ios' ? 63 : 48,
+    modalPresentation
+  });
+  const {
+    titleVisible,
+    onScroll
+  } = (0, _onScrollHeaderState.useOnScrollHeaderState)();
+  const {
+    contentContainerStyle,
+    ...scrollViewProps
+  } = scrollView !== null && scrollView !== void 0 ? scrollView : {};
+  let headerPaddingStyle;
+  if (!modalPresentation || _reactNative.Platform.OS === 'android') {
+    headerPaddingStyle = {
+      paddingTop: top
+    };
+  } else if (modalPresentation && !header.modalHandleVisible && _reactNative.Platform.OS === 'ios') {
+    headerPaddingStyle = styles.modalHeaderWithoutHandle;
+  }
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
+    style: [styles.container, {
+      backgroundColor: colorScheme.background
+    }, style],
+    testID: testID
+  }, viewProps), /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, _extends({
+    contentContainerStyle: [styles.contentContainer, contentInsetsStyle, contentContainerStyle],
+    onScroll: onScroll,
+    scrollEventThrottle: 100
+  }, scrollViewProps), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.content,
+    testID: (0, _testID.concatTestID)(testID, 'content')
+  }, !header.static && /*#__PURE__*/_react.default.createElement(_listTitleHeader.default, {
+    title: header.title
+  }), children)), /*#__PURE__*/_react.default.createElement(_navigationHeader.default, _extends({
+    animate: true,
+    blurred: true,
+    style: [styles.header, headerPaddingStyle],
+    titleVisible: header.static || titleVisible
+  }, header)));
+};
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  content: {
+    flex: 1
+  },
+  contentContainer: {
+    flexGrow: 1
+  },
+  header: {
+    position: 'absolute',
+    width: '100%'
+  },
+  modalHeaderWithoutHandle: {
+    paddingTop: 15
+  }
+});
+var _default = exports.default = ScrollViewScreen;
+//# sourceMappingURL=scroll-view-screen.js.map

package/lib/commonjs/ui-components/screens/scroll-view-screen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_reactNativeSafeAreaContext","_onScrollHeaderState","_listContentInset","_testID","_navigationHeader","_listTitleHeader","_colorSchemeContext","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","ScrollViewScreen","children","header","modalPresentation","scrollView","style","testID","viewProps","colorScheme","useAppColorScheme","top","useSafeAreaInsets","contentInsetsStyle","useListContentInset","additionalBottomPadding","headerHeight","Platform","OS","titleVisible","onScroll","useOnScrollHeaderState","contentContainerStyle","scrollViewProps","headerPaddingStyle","paddingTop","modalHandleVisible","styles","modalHeaderWithoutHandle","createElement","View","container","backgroundColor","background","ScrollView","contentContainer","scrollEventThrottle","content","concatTestID","static","title","animate","blurred","StyleSheet","create","flex","flexGrow","position","width","_default","exports"],"sources":["scroll-view-screen.tsx"],"sourcesContent":["import React, { FC, PropsWithChildren } from 'react';\nimport { Platform, ScrollView, ScrollViewProps, StyleSheet, View, ViewProps, ViewStyle } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { useOnScrollHeaderState } from '../../utils/hooks/header/on-scroll-header-state';\nimport { useListContentInset } from '../../utils/hooks/list/list-content-inset';\nimport { concatTestID } from '../../utils/testID';\nimport NavigationHeader, { NavigationHeaderProps } from '../header/navigation-header';\nimport ListTitleHeader from '../list/list-title-header';\nimport { useAppColorScheme } from '../theme/color-scheme-context';\n\nexport type ScrollViewScreenProps = ViewProps & {\n  header: Omit<NavigationHeaderProps, 'animate' | 'blurred' | 'style' | 'title' | 'titleVisible'> & {\n    static?: boolean;\n    title: string;\n  };\n  modalPresentation?: boolean;\n  scrollView?: Omit<ScrollViewProps, 'onScroll'>;\n};\n\nconst ScrollViewScreen: FC<PropsWithChildren<ScrollViewScreenProps>> = ({\n  children,\n  header,\n  modalPresentation,\n  scrollView,\n  style,\n  testID,\n  ...viewProps\n}) => {\n  const colorScheme = useAppColorScheme();\n  const { top } = useSafeAreaInsets();\n  const contentInsetsStyle = useListContentInset({\n    additionalBottomPadding: 24,\n    headerHeight: modalPresentation && Platform.OS === 'ios' ? 63 : 48,\n    modalPresentation,\n  });\n  const { titleVisible, onScroll } = useOnScrollHeaderState();\n  const { contentContainerStyle, ...scrollViewProps } = scrollView ?? {};\n\n  let headerPaddingStyle: ViewStyle | undefined;\n  if (!modalPresentation || Platform.OS === 'android') {\n    headerPaddingStyle = {\n      paddingTop: top,\n    };\n  } else if (modalPresentation && !header.modalHandleVisible && Platform.OS === 'ios') {\n    headerPaddingStyle = styles.modalHeaderWithoutHandle;\n  }\n\n  return (\n    <View style={[styles.container, { backgroundColor: colorScheme.background }, style]} testID={testID} {...viewProps}>\n      <ScrollView\n        contentContainerStyle={[styles.contentContainer, contentInsetsStyle, contentContainerStyle]}\n        onScroll={onScroll}\n        scrollEventThrottle={100}\n        {...scrollViewProps}>\n        <View style={styles.content} testID={concatTestID(testID, 'content')}>\n          {!header.static && <ListTitleHeader title={header.title} />}\n          {children}\n        </View>\n      </ScrollView>\n      <NavigationHeader\n        animate\n        blurred\n        style={[styles.header, headerPaddingStyle]}\n        titleVisible={header.static || titleVisible}\n        {...header}\n      />\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  content: {\n    flex: 1,\n  },\n  contentContainer: {\n    flexGrow: 1,\n  },\n  header: {\n    position: 'absolute',\n    width: '100%',\n  },\n  modalHeaderWithoutHandle: {\n    paddingTop: 15,\n  },\n});\n\nexport default ScrollViewScreen;\n"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/ui-components/screens/section-list-screen.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _onScrollHeaderState = require("../../utils/hooks/header/on-scroll-header-state");
+var _listContentInset = require("../../utils/hooks/list/list-content-inset");
+var _navigationHeader = _interopRequireDefault(require("../header/navigation-header"));
+var _listTitleHeader = _interopRequireDefault(require("../list/list-title-header"));
+var _colorSchemeContext = require("../theme/color-scheme-context");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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); }
+const SectionListScreen = ({
+  header,
+  list: {
+    contentContainerStyle,
+    stickySectionHeadersEnabled,
+    ...listProps
+  },
+  style,
+  ...viewProps
+}) => {
+  const colorScheme = (0, _colorSchemeContext.useAppColorScheme)();
+  const safeAreaInsets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const contentInsetsStyle = (0, _listContentInset.useListContentInset)();
+  const {
+    titleVisible,
+    onScroll
+  } = (0, _onScrollHeaderState.useOnScrollHeaderState)();
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
+    style: [styles.container, {
+      backgroundColor: colorScheme.background
+    }, style]
+  }, viewProps), /*#__PURE__*/_react.default.createElement(_reactNative.SectionList, _extends({
+    ListHeaderComponent: !header.static ? /*#__PURE__*/_react.default.createElement(_listTitleHeader.default, {
+      title: header.title
+    }) : undefined,
+    contentContainerStyle: [contentInsetsStyle, contentContainerStyle],
+    onScroll: onScroll,
+    scrollEventThrottle: 100,
+    stickySectionHeadersEnabled: stickySectionHeadersEnabled !== null && stickySectionHeadersEnabled !== void 0 ? stickySectionHeadersEnabled : false
+  }, listProps)), /*#__PURE__*/_react.default.createElement(_navigationHeader.default, _extends({
+    animate: true,
+    blurred: true,
+    style: [styles.header, {
+      paddingTop: safeAreaInsets.top
+    }],
+    titleVisible: header.static || titleVisible
+  }, header)));
+};
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  header: {
+    position: 'absolute',
+    width: '100%'
+  }
+});
+var _default = exports.default = SectionListScreen;
+//# sourceMappingURL=section-list-screen.js.map

package/lib/commonjs/ui-components/screens/section-list-screen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_reactNativeSafeAreaContext","_onScrollHeaderState","_listContentInset","_navigationHeader","_listTitleHeader","_colorSchemeContext","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","SectionListScreen","header","list","contentContainerStyle","stickySectionHeadersEnabled","listProps","style","viewProps","colorScheme","useAppColorScheme","safeAreaInsets","useSafeAreaInsets","contentInsetsStyle","useListContentInset","titleVisible","onScroll","useOnScrollHeaderState","createElement","View","styles","container","backgroundColor","background","SectionList","ListHeaderComponent","static","title","undefined","scrollEventThrottle","animate","blurred","paddingTop","top","StyleSheet","create","flex","position","width","_default","exports"],"sources":["section-list-screen.tsx"],"sourcesContent":["import React from 'react';\nimport { SectionList, SectionListProps, StyleSheet, View, ViewProps } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { useOnScrollHeaderState } from '../../utils/hooks/header/on-scroll-header-state';\nimport { useListContentInset } from '../../utils/hooks/list/list-content-inset';\nimport NavigationHeader, { NavigationHeaderProps } from '../header/navigation-header';\nimport ListTitleHeader from '../list/list-title-header';\nimport { useAppColorScheme } from '../theme/color-scheme-context';\n\nexport type SectionListScreenProps<ItemT, SectionT> = ViewProps & {\n  header: Omit<NavigationHeaderProps, 'animate' | 'blurred' | 'style' | 'title' | 'titleVisible'> & {\n    static?: boolean;\n    title: string;\n  };\n  list: Omit<SectionListProps<ItemT, SectionT>, 'ListHeaderComponent' | 'onScroll'>;\n};\n\nconst SectionListScreen = <ItemT, SectionT>({\n  header,\n  list: { contentContainerStyle, stickySectionHeadersEnabled, ...listProps },\n  style,\n  ...viewProps\n}: SectionListScreenProps<ItemT, SectionT>) => {\n  const colorScheme = useAppColorScheme();\n  const safeAreaInsets = useSafeAreaInsets();\n  const contentInsetsStyle = useListContentInset();\n  const { titleVisible, onScroll } = useOnScrollHeaderState();\n\n  return (\n    <View style={[styles.container, { backgroundColor: colorScheme.background }, style]} {...viewProps}>\n      <SectionList<ItemT, SectionT>\n        ListHeaderComponent={!header.static ? <ListTitleHeader title={header.title} /> : undefined}\n        contentContainerStyle={[contentInsetsStyle, contentContainerStyle]}\n        onScroll={onScroll}\n        scrollEventThrottle={100}\n        stickySectionHeadersEnabled={stickySectionHeadersEnabled ?? false}\n        {...listProps}\n      />\n      <NavigationHeader\n        animate\n        blurred\n        style={[styles.header, { paddingTop: safeAreaInsets.top }]}\n        titleVisible={header.static || titleVisible}\n        {...header}\n      />\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  header: {\n    position: 'absolute',\n    width: '100%',\n  },\n});\n\nexport default SectionListScreen;\n"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/ui-components/searchbar/animated-search-bar.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _searchBar = _interopRequireDefault(require("./search-bar"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+// Animated search bar, according to
+// https://www.figma.com/design/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?node-id=1143-40433&m=dev
+
+const AnimatedSearchBar = ({
+  collapsed,
+  rightButtonAlwaysVisible = false,
+  searchBarProps,
+  rightButton
+}) => {
+  const [rightIconFadeAnimation] = (0, _react.useState)(() => new _reactNative.Animated.Value(rightButton && rightButtonAlwaysVisible ? 1.5 : 0));
+  const [searchPaddingAnimation] = (0, _react.useState)(() => new _reactNative.Animated.Value(0));
+  (0, _react.useEffect)(() => {
+    _reactNative.Animated.timing(searchPaddingAnimation, {
+      duration: 250,
+      toValue: collapsed ? 1 : 0,
+      useNativeDriver: false
+    }).start();
+  }, [collapsed, searchPaddingAnimation]);
+  (0, _react.useEffect)(() => {
+    if (rightButtonAlwaysVisible) {
+      return;
+    }
+    _reactNative.Animated.timing(rightIconFadeAnimation, {
+      duration: 250,
+      toValue: collapsed && rightButton ? 1.5 : 0,
+      useNativeDriver: false
+    }).start();
+  }, [rightButtonAlwaysVisible, rightIconFadeAnimation, rightButton, collapsed]);
+  const searchBarContainerAnimatedStyle = {
+    paddingHorizontal: searchPaddingAnimation.interpolate({
+      extrapolate: 'clamp',
+      inputRange: [0, 1],
+      outputRange: [16, 20]
+    })
+  };
+  const optionsIconAnimatedStyle = {
+    opacity: rightIconFadeAnimation.interpolate({
+      extrapolate: 'clamp',
+      inputRange: [1, 1.5],
+      outputRange: [0, 1]
+    })
+  };
+  const searchBarAnimatedStyle = {
+    width: rightIconFadeAnimation.interpolate({
+      extrapolate: 'clamp',
+      inputRange: [0, 1],
+      outputRange: ['100%', '88%']
+    })
+  };
+  const {
+    style: searchBarStyle,
+    ...searchProps
+  } = searchBarProps;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
+    style: [styles.searchBarContainer, searchBarContainerAnimatedStyle, searchBarStyle]
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
+    style: searchBarAnimatedStyle
+  }, /*#__PURE__*/_react.default.createElement(_searchBar.default, searchProps)), rightButton && /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
+    style: [styles.rightButtonWrapper, optionsIconAnimatedStyle]
+  }, rightButton));
+};
+const styles = _reactNative.StyleSheet.create({
+  rightButtonWrapper: {
+    alignItems: 'flex-end',
+    justifyContent: 'center'
+  },
+  searchBarContainer: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingBottom: 12
+  }
+});
+var _default = exports.default = AnimatedSearchBar;
+//# sourceMappingURL=animated-search-bar.js.map

package/lib/commonjs/ui-components/searchbar/animated-search-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_searchBar","_interopRequireDefault","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","AnimatedSearchBar","collapsed","rightButtonAlwaysVisible","searchBarProps","rightButton","rightIconFadeAnimation","useState","Animated","Value","searchPaddingAnimation","useEffect","timing","duration","toValue","useNativeDriver","start","searchBarContainerAnimatedStyle","paddingHorizontal","interpolate","extrapolate","inputRange","outputRange","optionsIconAnimatedStyle","opacity","searchBarAnimatedStyle","width","style","searchBarStyle","searchProps","createElement","View","styles","searchBarContainer","rightButtonWrapper","StyleSheet","create","alignItems","justifyContent","flexDirection","paddingBottom","_default","exports"],"sources":["animated-search-bar.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from 'react';\nimport { Animated, StyleSheet, ViewStyle } from 'react-native';\n\nimport SearchBar, { SearchBarProps } from './search-bar';\n\nexport type AnimatedSearchBarProps = {\n  collapsed: boolean;\n  rightButton?: ReactNode;\n  rightButtonAlwaysVisible?: boolean;\n  searchBarProps: SearchBarProps;\n};\n\n// Animated search bar, according to\n// https://www.figma.com/design/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?node-id=1143-40433&m=dev\n\nconst AnimatedSearchBar = ({\n  collapsed,\n  rightButtonAlwaysVisible = false,\n  searchBarProps,\n  rightButton,\n}: AnimatedSearchBarProps) => {\n  const [rightIconFadeAnimation] = useState(\n    () => new Animated.Value(rightButton && rightButtonAlwaysVisible ? 1.5 : 0),\n  );\n  const [searchPaddingAnimation] = useState(() => new Animated.Value(0));\n\n  useEffect(() => {\n    Animated.timing(searchPaddingAnimation, {\n      duration: 250,\n      toValue: collapsed ? 1 : 0,\n      useNativeDriver: false,\n    }).start();\n  }, [collapsed, searchPaddingAnimation]);\n\n  useEffect(() => {\n    if (rightButtonAlwaysVisible) {\n      return;\n    }\n\n    Animated.timing(rightIconFadeAnimation, {\n      duration: 250,\n      toValue: collapsed && rightButton ? 1.5 : 0,\n      useNativeDriver: false,\n    }).start();\n  }, [rightButtonAlwaysVisible, rightIconFadeAnimation, rightButton, collapsed]);\n\n  const searchBarContainerAnimatedStyle = {\n    paddingHorizontal: searchPaddingAnimation.interpolate({\n      extrapolate: 'clamp',\n      inputRange: [0, 1],\n      outputRange: [16, 20],\n    }),\n  };\n\n  const optionsIconAnimatedStyle: Animated.WithAnimatedObject<ViewStyle> = {\n    opacity: rightIconFadeAnimation.interpolate({\n      extrapolate: 'clamp',\n      inputRange: [1, 1.5],\n      outputRange: [0, 1],\n    }),\n  };\n\n  const searchBarAnimatedStyle = {\n    width: rightIconFadeAnimation.interpolate({\n      extrapolate: 'clamp',\n      inputRange: [0, 1],\n      outputRange: ['100%', '88%'],\n    }),\n  };\n\n  const { style: searchBarStyle, ...searchProps } = searchBarProps;\n  return (\n    <Animated.View style={[styles.searchBarContainer, searchBarContainerAnimatedStyle, searchBarStyle]}>\n      <Animated.View style={searchBarAnimatedStyle}>\n        <SearchBar {...searchProps} />\n      </Animated.View>\n      {rightButton && (\n        <Animated.View style={[styles.rightButtonWrapper, optionsIconAnimatedStyle]}>{rightButton}</Animated.View>\n      )}\n    </Animated.View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  rightButtonWrapper: {\n    alignItems: 'flex-end',\n    justifyContent: 'center',\n  },\n  searchBarContainer: {\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    paddingBottom: 12,\n  },\n});\n\nexport default AnimatedSearchBar;\n"],"mappings":"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","ignoreList":[]}