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

package/lib/commonjs/ui-components/buttons/button.js

@@ -0,0 +1,153 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonType = exports.Button = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _utils = require("../../utils");
+var _accessibilityHistoryWrappers = require("../accessibility/accessibilityHistoryWrappers");
+var _text = require("../text");
+var _theme = require("../theme");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+let ButtonType;
+exports.ButtonType = ButtonType;
+(function (ButtonType) {
+  ButtonType["Border"] = "border";
+  ButtonType["Primary"] = "primary";
+  ButtonType["Secondary"] = "secondary";
+  ButtonType["SmallTech"] = "small-tech";
+})(ButtonType || (exports.ButtonType = ButtonType = {}));
+const SLOP_VALUE = 10;
+const hitSlop = {
+  top: SLOP_VALUE,
+  bottom: SLOP_VALUE,
+  left: SLOP_VALUE,
+  right: SLOP_VALUE
+};
+const ACTIVE_OPACITY = {
+  [ButtonType.Primary]: 0.8,
+  [ButtonType.Border]: 1,
+  [ButtonType.Secondary]: 1,
+  [ButtonType.SmallTech]: 0.5
+};
+
+/**
+ * Common button component
+ *
+ * follows design: https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?node-id=419-18389
+ *
+ * for bordered style just override `borderColor` in style
+ */
+const Button = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+  let {
+    style,
+    type = ButtonType.Primary,
+    disabled,
+    title,
+    subtitle,
+    onPressIn,
+    onPressOut,
+    testID,
+    ...props
+  } = _ref;
+  const colorScheme = (0, _theme.useAppColorScheme)();
+  const [secondaryPressed, setSecondaryPressed] = (0, _react.useState)(false);
+  const textColor = (0, _react.useMemo)(() => {
+    switch (type) {
+      case ButtonType.Primary:
+        return colorScheme.accentText;
+      case ButtonType.Border:
+      case ButtonType.Secondary:
+        return colorScheme.text;
+      case ButtonType.SmallTech:
+        return colorScheme.codeAccent;
+    }
+  }, [type, colorScheme]);
+  const backgroundColor = (0, _react.useMemo)(() => {
+    switch (type) {
+      case ButtonType.Primary:
+        return colorScheme.accent;
+      case ButtonType.Border:
+      case ButtonType.Secondary:
+        return secondaryPressed ? colorScheme.background : colorScheme.white;
+      case ButtonType.SmallTech:
+        return 'rgba(255, 255, 255, 0.05)';
+    }
+  }, [type, colorScheme, secondaryPressed]);
+  const borderColor = (0, _react.useMemo)(() => {
+    switch (type) {
+      case ButtonType.Border:
+        return colorScheme.background;
+      default:
+        return backgroundColor;
+    }
+  }, [type, colorScheme.background, backgroundColor]);
+  const secondaryPressIn = (0, _react.useCallback)(event => {
+    setSecondaryPressed(true);
+    onPressIn === null || onPressIn === void 0 ? void 0 : onPressIn(event);
+  }, [onPressIn]);
+  const secondaryPressOut = (0, _react.useCallback)(event => {
+    setSecondaryPressed(false);
+    onPressOut === null || onPressOut === void 0 ? void 0 : onPressOut(event);
+  }, [onPressOut]);
+  return /*#__PURE__*/_react.default.createElement(_accessibilityHistoryWrappers.TouchableOpacity, _extends({
+    accessibilityRole: "button",
+    activeOpacity: ACTIVE_OPACITY[type],
+    hitSlop: hitSlop,
+    ref: ref,
+    style: [styles.button, subtitle ? styles.withSubtitle : undefined, {
+      backgroundColor,
+      borderColor
+    }, type === ButtonType.SmallTech && styles.techSmall, style],
+    disabled: disabled,
+    onPressIn: type === ButtonType.Secondary ? secondaryPressIn : onPressIn,
+    onPressOut: type === ButtonType.Secondary ? secondaryPressOut : onPressOut,
+    testID: testID
+  }, props), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [secondaryPressed && styles.secondaryPressedLabel, disabled && styles.disabled],
+    testID: (0, _utils.concatTestID)(testID, disabled ? 'disabled' : 'enabled')
+  }, /*#__PURE__*/_react.default.createElement(_text.Typography, {
+    preset: type === ButtonType.SmallTech ? 's' : 'regular',
+    color: textColor,
+    align: "center",
+    numberOfLines: 1
+  }, title), subtitle ? /*#__PURE__*/_react.default.createElement(_text.Typography, {
+    preset: "s/line-height-capped",
+    style: styles.subtitle,
+    color: textColor,
+    align: "center",
+    numberOfLines: 1
+  }, subtitle) : null));
+});
+exports.Button = Button;
+Button.displayName = 'Button';
+const styles = _reactNative.StyleSheet.create({
+  button: {
+    borderRadius: 12,
+    borderWidth: 1,
+    paddingHorizontal: 16,
+    paddingVertical: 20
+  },
+  disabled: {
+    opacity: 0.4
+  },
+  secondaryPressedLabel: {
+    opacity: 0.5
+  },
+  subtitle: {
+    opacity: 0.8
+  },
+  techSmall: {
+    borderRadius: 4,
+    paddingVertical: 12
+  },
+  withSubtitle: {
+    paddingBottom: 12,
+    paddingTop: 8
+  }
+});
+//# sourceMappingURL=button.js.map

package/lib/commonjs/ui-components/buttons/button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_utils","_accessibilityHistoryWrappers","_text","_theme","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","ButtonType","exports","SLOP_VALUE","hitSlop","top","bottom","left","right","ACTIVE_OPACITY","Primary","Border","Secondary","SmallTech","Button","React","forwardRef","_ref","ref","style","type","disabled","title","subtitle","onPressIn","onPressOut","testID","props","colorScheme","useAppColorScheme","secondaryPressed","setSecondaryPressed","useState","textColor","useMemo","accentText","text","codeAccent","backgroundColor","accent","background","white","borderColor","secondaryPressIn","useCallback","event","secondaryPressOut","createElement","TouchableOpacity","accessibilityRole","activeOpacity","styles","button","withSubtitle","undefined","techSmall","View","secondaryPressedLabel","concatTestID","Typography","preset","color","align","numberOfLines","displayName","StyleSheet","create","borderRadius","borderWidth","paddingHorizontal","paddingVertical","opacity","paddingBottom","paddingTop"],"sources":["button.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react';\nimport { GestureResponderEvent, Insets, StyleSheet, TouchableOpacityProps, View } from 'react-native';\n\nimport { concatTestID } from '../../utils';\nimport { TouchableOpacity, TouchableOpacityRef } from '../accessibility/accessibilityHistoryWrappers';\nimport { Typography } from '../text';\nimport { useAppColorScheme } from '../theme';\n\nexport enum ButtonType {\n  Border = 'border',\n  Primary = 'primary',\n  Secondary = 'secondary',\n  SmallTech = 'small-tech',\n}\n\nexport interface ButtonProps extends TouchableOpacityProps {\n  type?: ButtonType;\n  title: string;\n  subtitle?: string;\n  disabled?: boolean;\n}\n\nconst SLOP_VALUE = 10;\nconst hitSlop: Insets = {\n  top: SLOP_VALUE,\n  bottom: SLOP_VALUE,\n  left: SLOP_VALUE,\n  right: SLOP_VALUE,\n};\n\nconst ACTIVE_OPACITY: Record<ButtonType, number> = {\n  [ButtonType.Primary]: 0.8,\n  [ButtonType.Border]: 1,\n  [ButtonType.Secondary]: 1,\n  [ButtonType.SmallTech]: 0.5,\n};\n\n/**\n * Common button component\n *\n * follows design: https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?node-id=419-18389\n *\n * for bordered style just override `borderColor` in style\n */\nexport const Button = React.forwardRef<TouchableOpacityRef, ButtonProps>(\n  ({ style, type = ButtonType.Primary, disabled, title, subtitle, onPressIn, onPressOut, testID, ...props }, ref) => {\n    const colorScheme = useAppColorScheme();\n    const [secondaryPressed, setSecondaryPressed] = useState(false);\n\n    const textColor = useMemo(() => {\n      switch (type) {\n        case ButtonType.Primary:\n          return colorScheme.accentText;\n        case ButtonType.Border:\n        case ButtonType.Secondary:\n          return colorScheme.text;\n        case ButtonType.SmallTech:\n          return colorScheme.codeAccent;\n      }\n    }, [type, colorScheme]);\n\n    const backgroundColor = useMemo(() => {\n      switch (type) {\n        case ButtonType.Primary:\n          return colorScheme.accent;\n        case ButtonType.Border:\n        case ButtonType.Secondary:\n          return secondaryPressed ? colorScheme.background : colorScheme.white;\n        case ButtonType.SmallTech:\n          return 'rgba(255, 255, 255, 0.05)';\n      }\n    }, [type, colorScheme, secondaryPressed]);\n\n    const borderColor = useMemo(() => {\n      switch (type) {\n        case ButtonType.Border:\n          return colorScheme.background;\n        default:\n          return backgroundColor;\n      }\n    }, [type, colorScheme.background, backgroundColor]);\n\n    const secondaryPressIn = useCallback(\n      (event: GestureResponderEvent) => {\n        setSecondaryPressed(true);\n        onPressIn?.(event);\n      },\n      [onPressIn],\n    );\n\n    const secondaryPressOut = useCallback(\n      (event: GestureResponderEvent) => {\n        setSecondaryPressed(false);\n        onPressOut?.(event);\n      },\n      [onPressOut],\n    );\n\n    return (\n      <TouchableOpacity\n        accessibilityRole=\"button\"\n        activeOpacity={ACTIVE_OPACITY[type]}\n        hitSlop={hitSlop}\n        ref={ref}\n        style={[\n          styles.button,\n          subtitle ? styles.withSubtitle : undefined,\n          { backgroundColor, borderColor },\n          type === ButtonType.SmallTech && styles.techSmall,\n          style,\n        ]}\n        disabled={disabled}\n        onPressIn={type === ButtonType.Secondary ? secondaryPressIn : onPressIn}\n        onPressOut={type === ButtonType.Secondary ? secondaryPressOut : onPressOut}\n        testID={testID}\n        {...props}>\n        <View\n          style={[secondaryPressed && styles.secondaryPressedLabel, disabled && styles.disabled]}\n          testID={concatTestID(testID, disabled ? 'disabled' : 'enabled')}>\n          <Typography\n            preset={type === ButtonType.SmallTech ? 's' : 'regular'}\n            color={textColor}\n            align=\"center\"\n            numberOfLines={1}>\n            {title}\n          </Typography>\n          {subtitle ? (\n            <Typography\n              preset=\"s/line-height-capped\"\n              style={styles.subtitle}\n              color={textColor}\n              align=\"center\"\n              numberOfLines={1}>\n              {subtitle}\n            </Typography>\n          ) : null}\n        </View>\n      </TouchableOpacity>\n    );\n  },\n);\n\nButton.displayName = 'Button';\n\nconst styles = StyleSheet.create({\n  button: {\n    borderRadius: 12,\n    borderWidth: 1,\n    paddingHorizontal: 16,\n    paddingVertical: 20,\n  },\n  disabled: {\n    opacity: 0.4,\n  },\n  secondaryPressedLabel: {\n    opacity: 0.5,\n  },\n  subtitle: {\n    opacity: 0.8,\n  },\n  techSmall: {\n    borderRadius: 4,\n    paddingVertical: 12,\n  },\n  withSubtitle: {\n    paddingBottom: 12,\n    paddingTop: 8,\n  },\n});\n"],"mappings":"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"}

package/lib/commonjs/ui-components/buttons/connectivity-button.js

@@ -0,0 +1,82 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ConnectivityTransport = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _utils = require("../../utils");
+var _accessibility = require("../accessibility");
+var _connectivity = require("../icons/connectivity");
+var _text = require("../text");
+var _theme = require("../theme");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+let ConnectivityTransport;
+exports.ConnectivityTransport = ConnectivityTransport;
+(function (ConnectivityTransport) {
+  ConnectivityTransport["Internet"] = "Internet";
+  ConnectivityTransport["Bluetooth"] = "Bluetooth";
+  ConnectivityTransport["All"] = "All";
+})(ConnectivityTransport || (exports.ConnectivityTransport = ConnectivityTransport = {}));
+const ConnectivityButton = _ref => {
+  let {
+    available,
+    disabled,
+    onPress,
+    status,
+    title,
+    transport,
+    testID
+  } = _ref;
+  const colorScheme = (0, _theme.useAppColorScheme)();
+  const backgroundColor = status === undefined ? colorScheme.grayDark : colorScheme.white;
+  const opacity = disabled ? 0.7 : 1.0;
+  const icons = /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.icons
+  }, transport !== ConnectivityTransport.Bluetooth && (available ? /*#__PURE__*/_react.default.createElement(_connectivity.ConnectivityInternetOnIcon, {
+    testID: (0, _utils.concatTestID)(testID, 'icon.on')
+  }) : /*#__PURE__*/_react.default.createElement(_connectivity.ConnectivityInternetOffIcon, {
+    testID: (0, _utils.concatTestID)(testID, 'icon.off')
+  })), transport !== ConnectivityTransport.Internet && (available ? /*#__PURE__*/_react.default.createElement(_connectivity.ConnectivityBluetoothOnIcon, {
+    testID: (0, _utils.concatTestID)(testID, 'icon.on')
+  }) : /*#__PURE__*/_react.default.createElement(_connectivity.ConnectivityBluetoothOffIcon, {
+    testID: (0, _utils.concatTestID)(testID, 'icon.off')
+  })));
+  return /*#__PURE__*/_react.default.createElement(_accessibility.TouchableHighlight, {
+    onPress: onPress,
+    style: styles.button
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.container, {
+      backgroundColor,
+      opacity
+    }]
+  }, icons, title && /*#__PURE__*/_react.default.createElement(_text.Typography, {
+    testID: (0, _utils.concatTestID)(testID, 'title'),
+    color: colorScheme.text,
+    preset: "s"
+  }, title), status !== undefined && /*#__PURE__*/_react.default.createElement(_connectivity.ConnectivityStatusIcon, {
+    status: status
+  })));
+};
+const styles = _reactNative.StyleSheet.create({
+  button: {
+    borderRadius: 20,
+    overflow: 'hidden'
+  },
+  container: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    height: 40,
+    paddingHorizontal: 12,
+    paddingVertical: 9
+  },
+  icons: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    gap: 5
+  }
+});
+var _default = ConnectivityButton;
+exports.default = _default;
+//# sourceMappingURL=connectivity-button.js.map

package/lib/commonjs/ui-components/buttons/connectivity-button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_utils","_accessibility","_connectivity","_text","_theme","obj","__esModule","default","ConnectivityTransport","exports","ConnectivityButton","_ref","available","disabled","onPress","status","title","transport","testID","colorScheme","useAppColorScheme","backgroundColor","undefined","grayDark","white","opacity","icons","createElement","View","style","styles","Bluetooth","ConnectivityInternetOnIcon","concatTestID","ConnectivityInternetOffIcon","Internet","ConnectivityBluetoothOnIcon","ConnectivityBluetoothOffIcon","TouchableHighlight","button","container","Typography","color","text","preset","ConnectivityStatusIcon","StyleSheet","create","borderRadius","overflow","alignItems","flexDirection","height","paddingHorizontal","paddingVertical","gap","_default"],"sources":["connectivity-button.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { concatTestID } from '../../utils';\nimport { TouchableHighlight } from '../accessibility';\nimport {\n  ConnectivityBluetoothOffIcon,\n  ConnectivityBluetoothOnIcon,\n  ConnectivityInternetOffIcon,\n  ConnectivityInternetOnIcon,\n  ConnectivityStatusIcon,\n} from '../icons/connectivity';\nimport { Typography } from '../text';\nimport { useAppColorScheme } from '../theme';\n\nexport enum ConnectivityTransport {\n  Internet = 'Internet',\n  Bluetooth = 'Bluetooth',\n  All = 'All',\n}\n\nexport type ConnectivityButtonProps = {\n  available: boolean;\n  disabled?: boolean;\n  onPress?: () => void;\n  status?: boolean;\n  title?: string;\n  transport: ConnectivityTransport;\n  testID?: string;\n};\n\nconst ConnectivityButton: FC<ConnectivityButtonProps> = ({\n  available,\n  disabled,\n  onPress,\n  status,\n  title,\n  transport,\n  testID,\n}) => {\n  const colorScheme = useAppColorScheme();\n\n  const backgroundColor = status === undefined ? colorScheme.grayDark : colorScheme.white;\n  const opacity = disabled ? 0.7 : 1.0;\n  const icons = (\n    <View style={styles.icons}>\n      {transport !== ConnectivityTransport.Bluetooth &&\n        (available ? (\n          <ConnectivityInternetOnIcon testID={concatTestID(testID, 'icon.on')} />\n        ) : (\n          <ConnectivityInternetOffIcon testID={concatTestID(testID, 'icon.off')} />\n        ))}\n      {transport !== ConnectivityTransport.Internet &&\n        (available ? (\n          <ConnectivityBluetoothOnIcon testID={concatTestID(testID, 'icon.on')} />\n        ) : (\n          <ConnectivityBluetoothOffIcon testID={concatTestID(testID, 'icon.off')} />\n        ))}\n    </View>\n  );\n  return (\n    <TouchableHighlight onPress={onPress} style={styles.button}>\n      <View style={[styles.container, { backgroundColor, opacity }]}>\n        {icons}\n        {title && (\n          <Typography testID={concatTestID(testID, 'title')} color={colorScheme.text} preset=\"s\">\n            {title}\n          </Typography>\n        )}\n        {status !== undefined && <ConnectivityStatusIcon status={status} />}\n      </View>\n    </TouchableHighlight>\n  );\n};\n\nconst styles = StyleSheet.create({\n  button: {\n    borderRadius: 20,\n    overflow: 'hidden',\n  },\n  container: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    height: 40,\n    paddingHorizontal: 12,\n    paddingVertical: 9,\n  },\n  icons: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    gap: 5,\n  },\n});\n\nexport default ConnectivityButton;\n"],"mappings":"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"}

package/lib/commonjs/ui-components/credential/card/credential-card.js

@@ -0,0 +1,183 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.CredentialCardShadow = exports.CredentialCardRatio = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _testID = require("../../../utils/testID");
+var _accessibilityHistoryWrappers = require("../../accessibility/accessibilityHistoryWrappers");
+var _blurView = _interopRequireDefault(require("../../blur/blur-view"));
+var _imageOrComponent = _interopRequireDefault(require("../../image/image-or-component"));
+var _typography = _interopRequireDefault(require("../../text/typography"));
+var _colorSchemeContext = require("../../theme/color-scheme-context");
+var _credentialHeader = _interopRequireDefault(require("./credential-header"));
+var _credentialImageCarousel = _interopRequireDefault(require("./credential-image-carousel"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+const CredentialCardShadow = {
+  shadowColor: '#10274226',
+  shadowOffset: {
+    height: 5,
+    width: 0
+  },
+  shadowOpacity: 1,
+  shadowRadius: 7
+};
+exports.CredentialCardShadow = CredentialCardShadow;
+const CredentialCardRatio = 18 / 11;
+exports.CredentialCardRatio = CredentialCardRatio;
+const CredentialCard = _ref => {
+  var _header$color;
+  let {
+    cardCarouselImages = [],
+    cardImage,
+    color = '#5A69F3',
+    credentialId,
+    header,
+    notice,
+    onCardPress,
+    onHeaderPress,
+    style,
+    testID
+  } = _ref;
+  const colorScheme = (0, _colorSchemeContext.useAppColorScheme)();
+  const [tappableHeaderHeight, setTappableHeaderHeight] = (0, _react.useState)();
+  const [cardSize, setCardSize] = (0, _react.useState)();
+  const onCardLayoutChange = (0, _react.useCallback)(event => {
+    const {
+      width,
+      height
+    } = event.nativeEvent.layout;
+    setCardSize({
+      width,
+      height
+    });
+  }, []);
+  const onHeaderLayoutChange = (0, _react.useCallback)(event => {
+    setTappableHeaderHeight(event.nativeEvent.layout.height);
+  }, []);
+  const headerPressHandler = (0, _react.useCallback)(() => {
+    onHeaderPress === null || onHeaderPress === void 0 ? void 0 : onHeaderPress(credentialId);
+  }, [credentialId, onHeaderPress]);
+  const cardPressHandler = (0, _react.useCallback)(() => {
+    onCardPress === null || onCardPress === void 0 ? void 0 : onCardPress(credentialId);
+  }, [credentialId, onCardPress]);
+  const noticeIconView = (0, _react.useMemo)(() => {
+    if (!(notice !== null && notice !== void 0 && notice.noticeIcon)) {
+      return undefined;
+    }
+    if ( /*#__PURE__*/_react.default.isValidElement(notice.noticeIcon)) {
+      return notice.noticeIcon;
+    } else {
+      const NoticeIconComponent = notice.noticeIcon;
+      return /*#__PURE__*/_react.default.createElement(NoticeIconComponent, null);
+    }
+  }, [notice === null || notice === void 0 ? void 0 : notice.noticeIcon]);
+  const shouldShowCarousel = (cardSize === null || cardSize === void 0 ? void 0 : cardSize.width) && cardSize.height;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    onLayout: onCardLayoutChange,
+    style: [styles.card, style],
+    testID: testID
+  }, cardImage ? 'imageSource' in cardImage ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.cardImage
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+    testID: (0, _testID.concatTestID)(testID, 'imageSource'),
+    source: cardImage.imageSource,
+    style: styles.image
+  })) : /*#__PURE__*/_react.default.createElement(_imageOrComponent.default, {
+    testID: (0, _testID.concatTestID)(testID, 'cardImage'),
+    source: cardImage,
+    style: styles.cardImage
+  }) : /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    testID: (0, _testID.concatTestID)(testID, 'cardBackgroundColor', String(color)),
+    style: [styles.cardImage, {
+      backgroundColor: color
+    }]
+  }), onCardPress && /*#__PURE__*/_react.default.createElement(_accessibilityHistoryWrappers.TouchableOpacity, {
+    style: styles.cardButton,
+    onPress: cardPressHandler
+  }), shouldShowCarousel ? /*#__PURE__*/_react.default.createElement(_credentialImageCarousel.default, {
+    style: {
+      marginTop: tappableHeaderHeight !== null && tappableHeaderHeight !== void 0 ? tappableHeaderHeight : 0
+    },
+    imagesToRender: cardCarouselImages !== null && cardCarouselImages !== void 0 ? cardCarouselImages : [],
+    carouselSize: {
+      width: cardSize.width,
+      height: cardSize.height - (tappableHeaderHeight !== null && tappableHeaderHeight !== void 0 ? tappableHeaderHeight : 0)
+    },
+    testID: (0, _testID.concatTestID)(testID, 'carousel')
+  }) : null, /*#__PURE__*/_react.default.createElement(_accessibilityHistoryWrappers.TouchableOpacity, {
+    onLayout: onHeaderLayoutChange,
+    activeOpacity: 0.9,
+    disabled: !onHeaderPress,
+    onPress: headerPressHandler,
+    style: styles.header
+  }, /*#__PURE__*/_react.default.createElement(_credentialHeader.default, _extends({}, header, {
+    color: (_header$color = header.color) !== null && _header$color !== void 0 ? _header$color : color,
+    testID: (0, _testID.concatTestID)(testID, 'header')
+  }))), notice && /*#__PURE__*/_react.default.createElement(_blurView.default, {
+    blurStyle: "soft",
+    style: [styles.notice],
+    testID: (0, _testID.concatTestID)(testID, 'notice')
+  }, noticeIconView && /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.noticeIcon
+  }, noticeIconView), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.noticeTextWrapper
+  }, /*#__PURE__*/_react.default.createElement(_typography.default, {
+    color: colorScheme.text,
+    preset: "xs/line-height-small",
+    style: styles.noticeText,
+    testID: (0, _testID.concatTestID)(testID, 'notice.text')
+  }, notice.text))));
+};
+const styles = _reactNative.StyleSheet.create({
+  card: {
+    borderRadius: 10,
+    overflow: 'hidden'
+  },
+  cardButton: {
+    height: '100%',
+    position: 'absolute',
+    width: '100%'
+  },
+  cardImage: {
+    aspectRatio: CredentialCardRatio,
+    width: '100%'
+  },
+  header: {
+    position: 'absolute',
+    top: 0,
+    width: '100%'
+  },
+  image: {
+    height: '100%',
+    width: '100%'
+  },
+  notice: {
+    bottom: 0,
+    columnGap: 6,
+    flexDirection: 'row',
+    justifyContent: 'flex-start',
+    paddingBottom: 6,
+    paddingHorizontal: 12,
+    paddingTop: 2,
+    position: 'absolute',
+    width: '100%'
+  },
+  noticeIcon: {
+    marginTop: 4
+  },
+  noticeText: {
+    marginVertical: 5
+  },
+  noticeTextWrapper: {
+    flex: 1
+  }
+});
+var _default = CredentialCard;
+exports.default = _default;
+//# sourceMappingURL=credential-card.js.map

package/lib/commonjs/ui-components/credential/card/credential-card.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_testID","_accessibilityHistoryWrappers","_blurView","_interopRequireDefault","_imageOrComponent","_typography","_colorSchemeContext","_credentialHeader","_credentialImageCarousel","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","CredentialCardShadow","shadowColor","shadowOffset","height","width","shadowOpacity","shadowRadius","exports","CredentialCardRatio","CredentialCard","_ref","_header$color","cardCarouselImages","cardImage","color","credentialId","header","notice","onCardPress","onHeaderPress","style","testID","colorScheme","useAppColorScheme","tappableHeaderHeight","setTappableHeaderHeight","useState","cardSize","setCardSize","onCardLayoutChange","useCallback","event","nativeEvent","layout","onHeaderLayoutChange","headerPressHandler","cardPressHandler","noticeIconView","useMemo","noticeIcon","undefined","React","isValidElement","NoticeIconComponent","createElement","shouldShowCarousel","View","onLayout","styles","card","Image","concatTestID","imageSource","image","String","backgroundColor","TouchableOpacity","cardButton","onPress","marginTop","imagesToRender","carouselSize","activeOpacity","disabled","blurStyle","noticeTextWrapper","text","preset","noticeText","StyleSheet","create","borderRadius","overflow","position","aspectRatio","top","bottom","columnGap","flexDirection","justifyContent","paddingBottom","paddingHorizontal","paddingTop","marginVertical","flex","_default"],"sources":["credential-card.tsx"],"sourcesContent":["import React, { FC, useCallback, useMemo, useState } from 'react';\nimport { ColorValue, Image, LayoutChangeEvent, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { concatTestID } from '../../../utils/testID';\nimport { TouchableOpacity } from '../../accessibility/accessibilityHistoryWrappers';\nimport BlurView from '../../blur/blur-view';\nimport ImageOrComponent, { ImageOrComponentSource } from '../../image/image-or-component';\nimport Typography from '../../text/typography';\nimport { useAppColorScheme } from '../../theme/color-scheme-context';\nimport CredentialHeader, { CredentialHeaderProps } from './credential-header';\nimport CarouselComponent, { CarouselImage } from './credential-image-carousel';\n\nexport const CredentialCardShadow: Pick<ViewStyle, 'shadowColor' | 'shadowOffset' | 'shadowOpacity' | 'shadowRadius'> =\n  {\n    shadowColor: '#10274226',\n    shadowOffset: {\n      height: 5,\n      width: 0,\n    },\n    shadowOpacity: 1,\n    shadowRadius: 7,\n  };\n\nexport const CredentialCardRatio = 18 / 11;\n\nexport type CredentialCardNotice = {\n  text: string;\n  noticeIcon?: React.ComponentType<any> | React.ReactElement;\n};\n\nexport type CredentialCardProps = {\n  cardCarouselImages?: CarouselImage[];\n  cardImage?: ImageOrComponentSource;\n  color?: ColorValue;\n  credentialId?: string;\n  header: CredentialHeaderProps;\n  notice?: CredentialCardNotice;\n  onCardPress?: (credentialId?: string) => void;\n  onHeaderPress?: (credentialId?: string) => void;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n};\n\nconst CredentialCard: FC<CredentialCardProps> = ({\n  cardCarouselImages = [],\n  cardImage,\n  color = '#5A69F3',\n  credentialId,\n  header,\n  notice,\n  onCardPress,\n  onHeaderPress,\n  style,\n  testID,\n}) => {\n  const colorScheme = useAppColorScheme();\n  const [tappableHeaderHeight, setTappableHeaderHeight] = useState<number>();\n  const [cardSize, setCardSize] = useState<{ height: number; width: number }>();\n\n  const onCardLayoutChange = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setCardSize({ width, height });\n  }, []);\n\n  const onHeaderLayoutChange = useCallback((event: LayoutChangeEvent) => {\n    setTappableHeaderHeight(event.nativeEvent.layout.height);\n  }, []);\n\n  const headerPressHandler = useCallback(() => {\n    onHeaderPress?.(credentialId);\n  }, [credentialId, onHeaderPress]);\n\n  const cardPressHandler = useCallback(() => {\n    onCardPress?.(credentialId);\n  }, [credentialId, onCardPress]);\n\n  const noticeIconView: React.ReactElement | undefined = useMemo(() => {\n    if (!notice?.noticeIcon) {\n      return undefined;\n    }\n    if (React.isValidElement(notice.noticeIcon)) {\n      return notice.noticeIcon;\n    } else {\n      const NoticeIconComponent = notice.noticeIcon as React.ComponentType<any>;\n      return <NoticeIconComponent />;\n    }\n  }, [notice?.noticeIcon]);\n\n  const shouldShowCarousel = cardSize?.width && cardSize.height;\n  return (\n    <View onLayout={onCardLayoutChange} style={[styles.card, style]} testID={testID}>\n      {cardImage ? (\n        'imageSource' in cardImage ? (\n          <View style={styles.cardImage}>\n            <Image testID={concatTestID(testID, 'imageSource')} source={cardImage.imageSource} style={styles.image} />\n          </View>\n        ) : (\n          <ImageOrComponent testID={concatTestID(testID, 'cardImage')} source={cardImage} style={styles.cardImage} />\n        )\n      ) : (\n        <View\n          testID={concatTestID(testID, 'cardBackgroundColor', String(color))}\n          style={[styles.cardImage, { backgroundColor: color }]}\n        />\n      )}\n      {onCardPress && <TouchableOpacity style={styles.cardButton} onPress={cardPressHandler} />}\n      {shouldShowCarousel ? (\n        <CarouselComponent\n          style={{ marginTop: tappableHeaderHeight ?? 0 }}\n          imagesToRender={cardCarouselImages ?? []}\n          carouselSize={{\n            width: cardSize.width,\n            height: cardSize.height - (tappableHeaderHeight ?? 0),\n          }}\n          testID={concatTestID(testID, 'carousel')}\n        />\n      ) : null}\n      <TouchableOpacity\n        onLayout={onHeaderLayoutChange}\n        activeOpacity={0.9}\n        disabled={!onHeaderPress}\n        onPress={headerPressHandler}\n        style={styles.header}>\n        <CredentialHeader {...header} color={header.color ?? color} testID={concatTestID(testID, 'header')} />\n      </TouchableOpacity>\n      {notice && (\n        <BlurView blurStyle=\"soft\" style={[styles.notice]} testID={concatTestID(testID, 'notice')}>\n          {noticeIconView && <View style={styles.noticeIcon}>{noticeIconView}</View>}\n          <View style={styles.noticeTextWrapper}>\n            <Typography\n              color={colorScheme.text}\n              preset=\"xs/line-height-small\"\n              style={styles.noticeText}\n              testID={concatTestID(testID, 'notice.text')}>\n              {notice.text}\n            </Typography>\n          </View>\n        </BlurView>\n      )}\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  card: {\n    borderRadius: 10,\n    overflow: 'hidden',\n  },\n  cardButton: {\n    height: '100%',\n    position: 'absolute',\n    width: '100%',\n  },\n  cardImage: {\n    aspectRatio: CredentialCardRatio,\n    width: '100%',\n  },\n  header: {\n    position: 'absolute',\n    top: 0,\n    width: '100%',\n  },\n  image: {\n    height: '100%',\n    width: '100%',\n  },\n  notice: {\n    bottom: 0,\n    columnGap: 6,\n    flexDirection: 'row',\n    justifyContent: 'flex-start',\n    paddingBottom: 6,\n    paddingHorizontal: 12,\n    paddingTop: 2,\n    position: 'absolute',\n    width: '100%',\n  },\n  noticeIcon: {\n    marginTop: 4,\n  },\n  noticeText: {\n    marginVertical: 5,\n  },\n  noticeTextWrapper: {\n    flex: 1,\n  },\n});\n\nexport default CredentialCard;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,6BAAA,GAAAH,OAAA;AACA,IAAAI,SAAA,GAAAC,sBAAA,CAAAL,OAAA;AACA,IAAAM,iBAAA,GAAAD,sBAAA,CAAAL,OAAA;AACA,IAAAO,WAAA,GAAAF,sBAAA,CAAAL,OAAA;AACA,IAAAQ,mBAAA,GAAAR,OAAA;AACA,IAAAS,iBAAA,GAAAJ,sBAAA,CAAAL,OAAA;AACA,IAAAU,wBAAA,GAAAL,sBAAA,CAAAL,OAAA;AAA+E,SAAAK,uBAAAM,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAhB,wBAAAY,GAAA,EAAAI,WAAA,SAAAA,WAAA,IAAAJ,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAQ,KAAA,GAAAL,wBAAA,CAAAC,WAAA,OAAAI,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAT,GAAA,YAAAQ,KAAA,CAAAE,GAAA,CAAAV,GAAA,SAAAW,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAhB,GAAA,QAAAgB,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAnB,GAAA,EAAAgB,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAf,GAAA,EAAAgB,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAhB,GAAA,CAAAgB,GAAA,SAAAL,MAAA,CAAAT,OAAA,GAAAF,GAAA,MAAAQ,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAArB,GAAA,EAAAW,MAAA,YAAAA,MAAA;AAAA,SAAAW,SAAA,IAAAA,QAAA,GAAAT,MAAA,CAAAU,MAAA,GAAAV,MAAA,CAAAU,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAV,GAAA,IAAAa,MAAA,QAAAhB,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAU,MAAA,EAAAb,GAAA,KAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,gBAAAS,MAAA,YAAAH,QAAA,CAAAQ,KAAA,OAAAH,SAAA;AAExE,MAAMI,oBAAwG,GACnH;EACEC,WAAW,EAAE,WAAW;EACxBC,YAAY,EAAE;IACZC,MAAM,EAAE,CAAC;IACTC,KAAK,EAAE;EACT,CAAC;EACDC,aAAa,EAAE,CAAC;EAChBC,YAAY,EAAE;AAChB,CAAC;AAACC,OAAA,CAAAP,oBAAA,GAAAA,oBAAA;AAEG,MAAMQ,mBAAmB,GAAG,EAAE,GAAG,EAAE;AAACD,OAAA,CAAAC,mBAAA,GAAAA,mBAAA;AAoB3C,MAAMC,cAAuC,GAAGC,IAAA,IAW1C;EAAA,IAAAC,aAAA;EAAA,IAX2C;IAC/CC,kBAAkB,GAAG,EAAE;IACvBC,SAAS;IACTC,KAAK,GAAG,SAAS;IACjBC,YAAY;IACZC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,aAAa;IACbC,KAAK;IACLC;EACF,CAAC,GAAAX,IAAA;EACC,MAAMY,WAAW,GAAG,IAAAC,qCAAiB,GAAE;EACvC,MAAM,CAACC,oBAAoB,EAAEC,uBAAuB,CAAC,GAAG,IAAAC,eAAQ,GAAU;EAC1E,MAAM,CAACC,QAAQ,EAAEC,WAAW,CAAC,GAAG,IAAAF,eAAQ,GAAqC;EAE7E,MAAMG,kBAAkB,GAAG,IAAAC,kBAAW,EAAEC,KAAwB,IAAK;IACnE,MAAM;MAAE3B,KAAK;MAAED;IAAO,CAAC,GAAG4B,KAAK,CAACC,WAAW,CAACC,MAAM;IAClDL,WAAW,CAAC;MAAExB,KAAK;MAAED;IAAO,CAAC,CAAC;EAChC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAM+B,oBAAoB,GAAG,IAAAJ,kBAAW,EAAEC,KAAwB,IAAK;IACrEN,uBAAuB,CAACM,KAAK,CAACC,WAAW,CAACC,MAAM,CAAC9B,MAAM,CAAC;EAC1D,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMgC,kBAAkB,GAAG,IAAAL,kBAAW,EAAC,MAAM;IAC3CX,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAGJ,YAAY,CAAC;EAC/B,CAAC,EAAE,CAACA,YAAY,EAAEI,aAAa,CAAC,CAAC;EAEjC,MAAMiB,gBAAgB,GAAG,IAAAN,kBAAW,EAAC,MAAM;IACzCZ,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAGH,YAAY,CAAC;EAC7B,CAAC,EAAE,CAACA,YAAY,EAAEG,WAAW,CAAC,CAAC;EAE/B,MAAMmB,cAA8C,GAAG,IAAAC,cAAO,EAAC,MAAM;IACnE,IAAI,EAACrB,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEsB,UAAU,GAAE;MACvB,OAAOC,SAAS;IAClB;IACA,kBAAIC,cAAK,CAACC,cAAc,CAACzB,MAAM,CAACsB,UAAU,CAAC,EAAE;MAC3C,OAAOtB,MAAM,CAACsB,UAAU;IAC1B,CAAC,MAAM;MACL,MAAMI,mBAAmB,GAAG1B,MAAM,CAACsB,UAAsC;MACzE,oBAAOnF,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACD,mBAAmB,OAAG;IAChC;EACF,CAAC,EAAE,CAAC1B,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEsB,UAAU,CAAC,CAAC;EAExB,MAAMM,kBAAkB,GAAG,CAAAlB,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAEvB,KAAK,KAAIuB,QAAQ,CAACxB,MAAM;EAC7D,oBACE/C,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACrF,YAAA,CAAAuF,IAAI;IAACC,QAAQ,EAAElB,kBAAmB;IAACT,KAAK,EAAE,CAAC4B,MAAM,CAACC,IAAI,EAAE7B,KAAK,CAAE;IAACC,MAAM,EAAEA;EAAO,GAC7ER,SAAS,GACR,aAAa,IAAIA,SAAS,gBACxBzD,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACrF,YAAA,CAAAuF,IAAI;IAAC1B,KAAK,EAAE4B,MAAM,CAACnC;EAAU,gBAC5BzD,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACrF,YAAA,CAAA2F,KAAK;IAAC7B,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,aAAa,CAAE;IAACvB,MAAM,EAAEe,SAAS,CAACuC,WAAY;IAAChC,KAAK,EAAE4B,MAAM,CAACK;EAAM,EAAG,CACrG,gBAEPjG,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAAChF,iBAAA,CAAAO,OAAgB;IAACkD,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,WAAW,CAAE;IAACvB,MAAM,EAAEe,SAAU;IAACO,KAAK,EAAE4B,MAAM,CAACnC;EAAU,EACzG,gBAEDzD,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACrF,YAAA,CAAAuF,IAAI;IACHzB,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,qBAAqB,EAAEiC,MAAM,CAACxC,KAAK,CAAC,CAAE;IACnEM,KAAK,EAAE,CAAC4B,MAAM,CAACnC,SAAS,EAAE;MAAE0C,eAAe,EAAEzC;IAAM,CAAC;EAAE,EAEzD,EACAI,WAAW,iBAAI9D,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACnF,6BAAA,CAAA+F,gBAAgB;IAACpC,KAAK,EAAE4B,MAAM,CAACS,UAAW;IAACC,OAAO,EAAEtB;EAAiB,EAAG,EACxFS,kBAAkB,gBACjBzF,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAAC5E,wBAAA,CAAAG,OAAiB;IAChBiD,KAAK,EAAE;MAAEuC,SAAS,EAAEnC,oBAAoB,aAApBA,oBAAoB,cAApBA,oBAAoB,GAAI;IAAE,CAAE;IAChDoC,cAAc,EAAEhD,kBAAkB,aAAlBA,kBAAkB,cAAlBA,kBAAkB,GAAI,EAAG;IACzCiD,YAAY,EAAE;MACZzD,KAAK,EAAEuB,QAAQ,CAACvB,KAAK;MACrBD,MAAM,EAAEwB,QAAQ,CAACxB,MAAM,IAAIqB,oBAAoB,aAApBA,oBAAoB,cAApBA,oBAAoB,GAAI,CAAC;IACtD,CAAE;IACFH,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,UAAU;EAAE,EACzC,GACA,IAAI,eACRjE,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACnF,6BAAA,CAAA+F,gBAAgB;IACfT,QAAQ,EAAEb,oBAAqB;IAC/B4B,aAAa,EAAE,GAAI;IACnBC,QAAQ,EAAE,CAAC5C,aAAc;IACzBuC,OAAO,EAAEvB,kBAAmB;IAC5Bf,KAAK,EAAE4B,MAAM,CAAChC;EAAO,gBACrB5D,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAAC7E,iBAAA,CAAAI,OAAgB,EAAAoB,QAAA,KAAKyB,MAAM;IAAEF,KAAK,GAAAH,aAAA,GAAEK,MAAM,CAACF,KAAK,cAAAH,aAAA,cAAAA,aAAA,GAAIG,KAAM;IAACO,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,QAAQ;EAAE,GAAG,CACrF,EAClBJ,MAAM,iBACL7D,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAAClF,SAAA,CAAAS,OAAQ;IAAC6F,SAAS,EAAC,MAAM;IAAC5C,KAAK,EAAE,CAAC4B,MAAM,CAAC/B,MAAM,CAAE;IAACI,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,QAAQ;EAAE,GACvFgB,cAAc,iBAAIjF,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACrF,YAAA,CAAAuF,IAAI;IAAC1B,KAAK,EAAE4B,MAAM,CAACT;EAAW,GAAEF,cAAc,CAAQ,eAC1EjF,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAACrF,YAAA,CAAAuF,IAAI;IAAC1B,KAAK,EAAE4B,MAAM,CAACiB;EAAkB,gBACpC7G,MAAA,CAAAe,OAAA,CAAAyE,aAAA,CAAC/E,WAAA,CAAAM,OAAU;IACT2C,KAAK,EAAEQ,WAAW,CAAC4C,IAAK;IACxBC,MAAM,EAAC,sBAAsB;IAC7B/C,KAAK,EAAE4B,MAAM,CAACoB,UAAW;IACzB/C,MAAM,EAAE,IAAA8B,oBAAY,EAAC9B,MAAM,EAAE,aAAa;EAAE,GAC3CJ,MAAM,CAACiD,IAAI,CACD,CACR,CAEV,CACI;AAEX,CAAC;AAED,MAAMlB,MAAM,GAAGqB,uBAAU,CAACC,MAAM,CAAC;EAC/BrB,IAAI,EAAE;IACJsB,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDf,UAAU,EAAE;IACVtD,MAAM,EAAE,MAAM;IACdsE,QAAQ,EAAE,UAAU;IACpBrE,KAAK,EAAE;EACT,CAAC;EACDS,SAAS,EAAE;IACT6D,WAAW,EAAElE,mBAAmB;IAChCJ,KAAK,EAAE;EACT,CAAC;EACDY,MAAM,EAAE;IACNyD,QAAQ,EAAE,UAAU;IACpBE,GAAG,EAAE,CAAC;IACNvE,KAAK,EAAE;EACT,CAAC;EACDiD,KAAK,EAAE;IACLlD,MAAM,EAAE,MAAM;IACdC,KAAK,EAAE;EACT,CAAC;EACDa,MAAM,EAAE;IACN2D,MAAM,EAAE,CAAC;IACTC,SAAS,EAAE,CAAC;IACZC,aAAa,EAAE,KAAK;IACpBC,cAAc,EAAE,YAAY;IAC5BC,aAAa,EAAE,CAAC;IAChBC,iBAAiB,EAAE,EAAE;IACrBC,UAAU,EAAE,CAAC;IACbT,QAAQ,EAAE,UAAU;IACpBrE,KAAK,EAAE;EACT,CAAC;EACDmC,UAAU,EAAE;IACVoB,SAAS,EAAE;EACb,CAAC;EACDS,UAAU,EAAE;IACVe,cAAc,EAAE;EAClB,CAAC;EACDlB,iBAAiB,EAAE;IACjBmB,IAAI,EAAE;EACR;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEY5E,cAAc;AAAAF,OAAA,CAAApC,OAAA,GAAAkH,QAAA"}