ab9264962c96c01978c59adfaf162697.json 12.1 KB
{"ast":null,"code":"var _interopRequireWildcard=require(\"@babel/runtime/helpers/interopRequireWildcard\");var _interopRequireDefault=require(\"@babel/runtime/helpers/interopRequireDefault\");Object.defineProperty(exports,\"__esModule\",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require(\"@babel/runtime/helpers/extends\"));var _objectWithoutProperties2=_interopRequireDefault(require(\"@babel/runtime/helpers/objectWithoutProperties\"));var _classCallCheck2=_interopRequireDefault(require(\"@babel/runtime/helpers/classCallCheck\"));var _createClass2=_interopRequireDefault(require(\"@babel/runtime/helpers/createClass\"));var _possibleConstructorReturn2=_interopRequireDefault(require(\"@babel/runtime/helpers/possibleConstructorReturn\"));var _getPrototypeOf3=_interopRequireDefault(require(\"@babel/runtime/helpers/getPrototypeOf\"));var _inherits2=_interopRequireDefault(require(\"@babel/runtime/helpers/inherits\"));var React=_interopRequireWildcard(require(\"react\"));var _StyleSheet=_interopRequireDefault(require(\"react-native-web/dist/exports/StyleSheet\"));var _Animated=_interopRequireDefault(require(\"react-native-web/dist/exports/Animated\"));var _TouchableWithoutFeedback=_interopRequireDefault(require(\"react-native-web/dist/exports/TouchableWithoutFeedback\"));var _View=_interopRequireDefault(require(\"react-native-web/dist/exports/View\"));var _CardContent=_interopRequireDefault(require(\"./CardContent\"));var _CardActions=_interopRequireDefault(require(\"./CardActions\"));var _CardCover=_interopRequireDefault(require(\"./CardCover\"));var _CardTitle=_interopRequireDefault(require(\"./CardTitle\"));var _Surface=_interopRequireDefault(require(\"../Surface\"));var _theming=require(\"../../core/theming\");var _jsxFileName=\"/Users/satya/Workspace/Callstack/react-native-paper/src/components/Card/Card.tsx\";var Card=function(_React$Component){(0,_inherits2.default)(Card,_React$Component);function Card(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Card);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Card)).call.apply(_getPrototypeOf2,[this].concat(args)));_this.state={elevation:new _Animated.default.Value(_this.props.elevation)};_this.handlePressIn=function(){_Animated.default.timing(_this.state.elevation,{toValue:8,duration:150}).start();};_this.handlePressOut=function(){_Animated.default.timing(_this.state.elevation,{toValue:_this.props.elevation,duration:150}).start();};return _this;}(0,_createClass2.default)(Card,[{key:\"render\",value:function render(){var _this$props=this.props,children=_this$props.children,cardElevation=_this$props.elevation,onLongPress=_this$props.onLongPress,onPress=_this$props.onPress,style=_this$props.style,theme=_this$props.theme,testID=_this$props.testID,accessible=_this$props.accessible,rest=(0,_objectWithoutProperties2.default)(_this$props,[\"children\",\"elevation\",\"onLongPress\",\"onPress\",\"style\",\"theme\",\"testID\",\"accessible\"]);var elevation=this.state.elevation;var roundness=theme.roundness;var total=React.Children.count(children);var siblings=React.Children.map(children,function(child){return React.isValidElement(child)&&child.type?child.type.displayName:null;});return React.createElement(_Surface.default,(0,_extends2.default)({style:[{borderRadius:roundness,elevation:elevation},style]},rest,{__source:{fileName:_jsxFileName,lineNumber:143}}),React.createElement(_TouchableWithoutFeedback.default,{delayPressIn:0,disabled:!(onPress||onLongPress),onLongPress:onLongPress,onPress:onPress,onPressIn:onPress?this.handlePressIn:undefined,onPressOut:onPress?this.handlePressOut:undefined,testID:testID,accessible:accessible,__source:{fileName:_jsxFileName,lineNumber:147}},React.createElement(_View.default,{style:styles.innerContainer,__source:{fileName:_jsxFileName,lineNumber:157}},React.Children.map(children,function(child,index){return React.isValidElement(child)?React.cloneElement(child,{index:index,total:total,siblings:siblings}):child;}))));}}]);return Card;}(React.Component);Card.Content=_CardContent.default;Card.Actions=_CardActions.default;Card.Cover=_CardCover.default;Card.Title=_CardTitle.default;Card.defaultProps={elevation:1};var styles=_StyleSheet.default.create({innerContainer:{flexGrow:1}});var _default=(0,_theming.withTheme)(Card);exports.default=_default;","map":{"version":3,"sources":["Card.tsx"],"names":["Card","React","Component","Content","CardContent","Actions","CardActions","Cover","CardCover","Title","CardTitle","defaultProps","elevation","state","Animated","handlePressIn","toValue","duration","handlePressOut","children","cardElevation","onLongPress","onPress","style","theme","testID","accessible","rest","roundness","total","siblings","child","borderRadius","styles","index","StyleSheet","innerContainer","flexGrow","withTheme"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n  StyleProp,\n  StyleSheet,\n  Animated,\n  TouchableWithoutFeedback,\n  View,\n  ViewStyle,\n} from 'react-native';\nimport CardContent from './CardContent';\nimport CardActions from './CardActions';\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport CardCover, { CardCover as _CardCover } from './CardCover';\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport CardTitle, { CardTitle as _CardTitle } from './CardTitle';\nimport Surface from '../Surface';\nimport { withTheme } from '../../core/theming';\nimport { Theme } from '../../types';\n\ntype Props = React.ComponentProps<typeof Surface> & {\n  /**\n   * Resting elevation of the card which controls the drop shadow.\n   */\n  elevation?: number;\n  /**\n   * Function to execute on long press.\n   */\n  onLongPress?: () => void;\n  /**\n   * Function to execute on press.\n   */\n  onPress?: () => void;\n  /**\n   * Content of the `Card`.\n   */\n  children: React.ReactNode;\n  style?: StyleProp<ViewStyle>;\n  /**\n   * @optional\n   */\n  theme: Theme;\n  /**\n   * Pass down testID from card props to touchable\n   */\n  testID?: string;\n  /**\n   * Pass down accessible from card props to touchable\n   */\n  accessible?: boolean;\n};\n\ntype State = {\n  elevation: Animated.Value;\n};\n\n/**\n * A card is a sheet of material that serves as an entry point to more detailed information.\n *\n * <div class=\"screenshots\">\n *   <img class=\"medium\" src=\"screenshots/card-1.png\" />\n *   <img class=\"medium\" src=\"screenshots/card-2.png\" />\n * </div>\n *\n * ## Usage\n * ```js\n * import * as React from 'react';\n * import { Avatar, Button, Card, Title, Paragraph } from 'react-native-paper';\n *\n * const MyComponent = () => (\n *   <Card>\n *     <Card.Title title=\"Card Title\" subtitle=\"Card Subtitle\" left={(props) => <Avatar.Icon {...props} icon=\"folder\" />} />\n *     <Card.Content>\n *       <Title>Card title</Title>\n *       <Paragraph>Card content</Paragraph>\n *     </Card.Content>\n *     <Card.Cover source={{ uri: 'https://picsum.photos/700' }} />\n *     <Card.Actions>\n *       <Button>Cancel</Button>\n *       <Button>Ok</Button>\n *     </Card.Actions>\n *   </Card>\n * );\n *\n * export default MyComponent;\n * ```\n */\nclass Card extends React.Component<Props, State> {\n  // @component ./CardContent.tsx\n  static Content = CardContent;\n  // @component ./CardActions.tsx\n  static Actions = CardActions;\n  // @component ./CardCover.tsx\n  static Cover = CardCover;\n  // @component ./CardTitle.tsx\n  static Title = CardTitle;\n\n  static defaultProps = {\n    elevation: 1,\n  };\n\n  state = {\n    // @ts-ignore\n    elevation: new Animated.Value(this.props.elevation),\n  };\n\n  private handlePressIn = () => {\n    Animated.timing(this.state.elevation, {\n      toValue: 8,\n      duration: 150,\n    }).start();\n  };\n\n  private handlePressOut = () => {\n    Animated.timing(this.state.elevation, {\n      // @ts-ignore\n      toValue: this.props.elevation,\n      duration: 150,\n    }).start();\n  };\n\n  render() {\n    const {\n      children,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      elevation: cardElevation,\n      onLongPress,\n      onPress,\n      style,\n      theme,\n      testID,\n      accessible,\n      ...rest\n    } = this.props;\n    const { elevation } = this.state;\n    const { roundness } = theme;\n    const total = React.Children.count(children);\n    const siblings = React.Children.map(children, child =>\n      React.isValidElement(child) && child.type\n        ? (child.type as any).displayName\n        : null\n    );\n    return (\n      <Surface\n        style={[{ borderRadius: roundness, elevation }, style]}\n        {...rest}\n      >\n        <TouchableWithoutFeedback\n          delayPressIn={0}\n          disabled={!(onPress || onLongPress)}\n          onLongPress={onLongPress}\n          onPress={onPress}\n          onPressIn={onPress ? this.handlePressIn : undefined}\n          onPressOut={onPress ? this.handlePressOut : undefined}\n          testID={testID}\n          accessible={accessible}\n        >\n          <View style={styles.innerContainer}>\n            {React.Children.map(children, (child, index) =>\n              React.isValidElement(child)\n                ? React.cloneElement(child, {\n                    index,\n                    total,\n                    siblings,\n                  })\n                : child\n            )}\n          </View>\n        </TouchableWithoutFeedback>\n      </Surface>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  innerContainer: {\n    flexGrow: 1,\n  },\n});\n\nexport default withTheme(Card);\n"]},"metadata":{},"sourceType":"script"}