import React from "react";
import { Dimensions, ScrollView, StyleSheet, Text, View } from "react-native";
import RenderHtml from "react-native-render-html";
import HTMLView from "react-native-htmlview";
const width = Dimensions.get("window").width;
const height = Dimensions.get("window").height;

const Shop = ({ info }) => {
  // const { info } = route.params;

  // const { width } = useWindowDimensions();

  // const source = `<div> ${info}</div>`;
  const source = {
    html: `
  ${info}`
  };
  console.log(source);

  return (
    <View style={styles1.container}>
      
      <View style={styles1.wrapper}>
      <RenderHtml contentWidth={width} source={source} />
        {/* <HTMLView value={source} stylesheet={styles1} /> */}
      </View>
    </View>
  );
};

const styles1 = StyleSheet.create({
  container: {
    // flex: 1,
    // backgroundColor: "#fff0f0",
    width: "100%",
    height: "100%",
  },
  wrapper: {
    width: "100%",
    alignItems: "center",
    justifyContent: "center",
    padding:15
  },
  div: {
    // height: "auto",
    // flexDirection: "row",
    // minHeight: 1500,
    // justifyContent: "center",
    // alignItems: "center",
    // padding: 10,
  },
  
  // img: {
  //   width: 400,
  //   // height: 200,
  //   // resizeMode: "cover",
  //   borderWidth: 1,
  //   margin: 0,
  //   // borderRadius: 500,
  // },
  // tabs: {
  //   height: 80,
  //   width: "100%",
  //   position: "absolute",
  //   bottom: 100,
  // },
  p: {
    fontSize: 15,
    padding: 10,
  },
  h3: {
    fontSize: 20,
    padding: 10,
    fontWeight: "600",
    margin: 0,
    padding: 0,
  },
  tab: {},
  table: {
    width: "100%",
  },
  th: {
    width: "100%",
  },
  td: {
    width: "100%",
  },
  tr: {
    width: "100%",
  },
  img: {
    // height: 600,
  },
});

export default Shop;