{"_id":"91-easy-email-core","name":"91-easy-email-core","dist-tags":{"latest":"4.11.2-alpha.0"},"versions":{"4.11.2-alpha.0":{"name":"91-easy-email-core","license":"MIT","description":"Email editor","version":"4.11.2-alpha.0","author":{"name":"hsuehpe"},"repository":{"type":"git","url":"git+https://github.com/hsuehpe/easy-email.git"},"keywords":["email editor core"],"main":"lib/index.cjs.js","module":"lib/index.es.js","types":"lib/index.d.ts","scripts":{"dev":"yarn build --watch","typings":"tsc --declaration --emitDeclarationOnly --project tsconfig.lib.json","build":"rimraf lib  && npm run typings && tsc-alias  && vite build --config vite.config.ts","block":"ts-node -r tsconfig-paths/register scripts/generateBlockJSX.ts","format":"eslint --fix  --ext .tsx,.ts,.tsx src/","test":"jest  --coverage"},"husky":{"hooks":{"pre-commit":"yarn test && yarn lint-staged"}},"lint-staged":{"src/*.{js,jsx,ts,tsx}, example/*.{js,jsx,ts,tsx}":["yarn lint"]},"devDependencies":{"@babel/core":"^7.15.0","@babel/preset-env":"^7.15.0","@babel/preset-react":"^7.14.5","@babel/preset-typescript":"^7.15.0","@types/he":"^1.2.0","@types/jest":"^26.0.24","@types/js-beautify":"^1.13.3","@types/jsdom":"^16.2.13","@types/lodash":"^4.14.178","@types/node":"^16.11.7","@types/react":"17.0.2","@types/react-dom":"^17.0.11","@types/uuid":"^8.3.4","@typescript-eslint/eslint-plugin":"^4.28.3","@typescript-eslint/parser":"^4.28.3","babel-jest":"^27.0.6","eslint":"^7.31.0","eslint-config-prettier":"^8.3.0","eslint-loader":"^4.0.2","eslint-plugin-import":"^2.23.4","eslint-plugin-prettier":"^3.4.0","eslint-plugin-react":"^7.24.0","eslint-plugin-react-hooks":"^4.2.0","jest":"^27.0.6","jsdom":"^17.0.0","liquidjs":"^9.40.0","react":"^17.0.2","react-dom":"^17.0.2","rimraf":"^3.0.2","ts-node":"^10.4.0","tsc-alias":"^1.4.1","tsconfig-paths":"^3.11.0","typescript":"^4.4.4","vite":"^2.5.6"},"dependencies":{"he":"^1.2.0","js-beautify":"^1.14.4","lodash":"^4.17.21","uuid":"^8.3.2"},"peerDependencies":{"react":"^17.0.2","react-dom":"^17.0.2"},"gitHead":"0ede8e4c7ac29716e1f18fdb11b7d8bc68c8bf35","bugs":{"url":"https://github.com/hsuehpe/easy-email/issues"},"homepage":"https://github.com/hsuehpe/easy-email#readme","_id":"91-easy-email-core@4.11.2-alpha.0","_nodeVersion":"16.4.2","_npmVersion":"lerna/4.0.0/node@v16.4.2+arm64 (darwin)","dist":{"integrity":"sha512-CHJFbcJybJI8RLnVbybGiqQn+cDKKMViopuQ4YxOJ0MduhQPlcBojhYFwjgB5w17C+acNRPbHDeDQ5/3BbGNXw==","shasum":"a25a57023fec3aa63d15590022f5ca9dc7daccba","tarball":"https://registry.npmjs.org/91-easy-email-core/-/91-easy-email-core-4.11.2-alpha.0.tgz","fileCount":85,"unpackedSize":1778182,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBzrMSUrf8HDNVnIAf9wzyrYeoR8mLpIu6PqRhgXxgyEAiEAlSXZAGYcaOQHMUx6B5hRLsXTqfI2IpTR5cESRfrAdJo="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkMsuvACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoePw//dETTaTF2t/rBdeMmz4Vehu4aXrzMcFXy3DyqzUw8WNWV7BFo\r\nMBYvTbpoYs6DHamgkvyW0OGiGrekzcu6lnKQCxBtO3CFcARFAmnjHbsYNysm\r\nigAieaxyYq4IXM77IPZAVzPRgpHCJxDKD6vgXz45XxMrDrP2xJNDETbISUYW\r\nED3ckpK7wp0DAeGpJmJO9ay30OZQasoQPEthNug2R4kgeIptTomGzfTC8sa4\r\nrET98MCKzHsReeEoN/GpvM5p8lXPNUTtskSoKDjm85ukrT4u7HmRVaGsJfxu\r\nOCr9OatT28PCcMPI6MrPRjBny/y6hx+mBBLJ1LsQxe8RLcVuLo4lyLh9XZxk\r\nQl3DCmfvzCZhHGrx6n0G+pA0ZimqqvkpKLITBUVXv/tal7MXDxefCeF/a0i5\r\npbICfaVls2JW18WwWwKEtPqm8Mvut67wnrxy7h+fsVRJV2VEK46MPaUnyHmo\r\nvL5d7PpeUtoScYaiwLpXOFGzD1bG70Y0CCx0T/1GGrwzN5YjOw4uDvKYkx5e\r\nNq5oKPvdCvdSBeS3gcOOq3jDYwqssVZTsTcMZrFBplA++rcuQ1iKAMN1DqQ/\r\nBvqG1x9kHaOsgBwNFiJPUyoxwQiiW8SeWrrXv9s/PgO0uZMKEOCOhIj0r53S\r\nqYj3g+tlf+FqmYslJINrZ19MahWqwHluMGk=\r\n=nefZ\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"hsuehpe","email":"bewitchsky@gmail.com"},"directories":{},"maintainers":[{"name":"hsuehpe","email":"bewitchsky@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/91-easy-email-core_4.11.2-alpha.0_1681050543410_0.7539199396008471"},"_hasShrinkwrap":false}},"time":{"created":"2023-04-09T14:29:03.409Z","4.11.2-alpha.0":"2023-04-09T14:29:03.564Z","modified":"2023-04-09T14:29:03.726Z"},"maintainers":[{"name":"hsuehpe","email":"bewitchsky@gmail.com"}],"description":"Email editor","homepage":"https://github.com/hsuehpe/easy-email#readme","keywords":["email editor core"],"repository":{"type":"git","url":"git+https://github.com/hsuehpe/easy-email.git"},"author":{"name":"hsuehpe"},"bugs":{"url":"https://github.com/hsuehpe/easy-email/issues"},"license":"MIT","readme":"# Easy-email-core\r\n\r\n## Introduction\r\n\r\nThis is the core easy-email library, composed by the following parts\r\n\r\n- utils\r\n  - JsonToMjml\r\n  - BlockManager\r\n  - createCustomBlock\r\n  - parseReactBlockToBlockData\r\n  - ImageManager (add or overwrite image)\r\n\r\n- blocks\r\n\r\n  - json definition of basic block\r\n\r\n- components\r\n  - React component for basic blocks\r\n\r\n## Usage\r\n\r\n```sh\r\n$ npm install --save easy-email-core\r\n```\r\n\r\nor\r\n\r\n```sh\r\n$ yarn add easy-email-core\r\n```\r\n\r\n## transform json to mjml\r\n\r\n```ts\r\nimport { JsonToMjml } from 'easy-email-core';\r\n\r\nconst xml = JsonToMjml({\r\n  data: json,\r\n  context: null,\r\n  mode: 'production',\r\n});\r\n\r\nconsole.log(xml);\r\n```\r\n\r\n// output\r\n\r\n```html\r\n<mjml>\r\n  <mj-head>\r\n    <mj-html-attributes>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"text-color\"\r\n        text-color=\"#000000\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"font-family\"\r\n        font-family=\"lucida Grande,Verdana,Microsoft YaHei\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"font-size\"\r\n        font-size=\"14px\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"line-height\"\r\n        line-height=\"1.7\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"responsive\"\r\n        responsive=\"true\"\r\n      ></mj-html-attribute>\r\n    </mj-html-attributes>\r\n\r\n    <mj-breakpoint width=\"480px\" />\r\n    <mj-attributes>\r\n      <mj-all font-family=\"lucida Grande,Verdana,Microsoft YaHei\" />\r\n      <mj-text font-size=\"14px\" />\r\n      <mj-text color=\"#000000\" />\r\n      <mj-text line-height=\"1.7\" />\r\n    </mj-attributes>\r\n  </mj-head>\r\n  <mj-body\r\n    background-color=\"#efeeea\"\r\n    width=\"600px\"\r\n    css-class=\"mjml-body\"\r\n  >\r\n    <mj-hero\r\n      padding=\"100px 0px 100px 0px\"\r\n      border=\"none\"\r\n      direction=\"ltr\"\r\n      text-align=\"center\"\r\n      background-color=\"#2a3448\"\r\n      background-position=\"center center\"\r\n      mode=\"fluid-height\"\r\n      vertical-align=\"top\"\r\n      background-url=\"https://cloud.githubusercontent.com/assets/1830348/15354890/1442159a-1cf0-11e6-92b1-b861dadf1750.jpg\"\r\n      background-width=\"600px\"\r\n      background-height=\"469px\"\r\n    >\r\n      <mj-text\r\n        padding=\"20px 20px 20px 20px\"\r\n        align=\"center\"\r\n        color=\"#ffffff\"\r\n        font-size=\"45px\"\r\n        line-height=\"45px\"\r\n        font-family=\"Helvetica\"\r\n        font-weight=\"900\"\r\n      >\r\n        GO TO SPACE\r\n      </mj-text>\r\n\r\n      <mj-button\r\n        align=\"center\"\r\n        background-color=\"#414141\"\r\n        color=\"#ffffff\"\r\n        font-weight=\"normal\"\r\n        border-radius=\"3px\"\r\n        padding=\"10px 25px 10px 25px\"\r\n        inner-padding=\"10px 25px 10px 25px\"\r\n        line-height=\"120%\"\r\n        target=\"_blank\"\r\n        vertical-align=\"middle\"\r\n        border=\"none\"\r\n        text-align=\"center\"\r\n        href=\"https://mjml.io/\"\r\n      >\r\n        ORDER YOUR TICKET NOW\r\n      </mj-button>\r\n    </mj-hero>\r\n  </mj-body>\r\n</mjml>\r\n```\r\n\r\n## parseReactBlockToBlockData\r\n\r\n```tsx\r\nimport { JsonToMjml, components, parseReactBlockToBlockData } from 'easy-email-core';\r\n\r\nconst { Page, Section, Column, Text, Button } = components;\r\n\r\nconst blockData = parseReactBlockToBlockData(\r\n  <Page>\r\n    <Section>\r\n      <Column>\r\n        <Text\r\n          padding='20px'\r\n          color='#ffffff'\r\n          font-family='Helvetica'\r\n          align='center'\r\n          font-size='45px'\r\n          line-height='45px'\r\n          font-weight='900'\r\n        >\r\n          GO TO SPACE\r\n        </Text>\r\n        <Button\r\n          href='https://mjml.io/'\r\n          align='center'\r\n        >\r\n          ORDER YOUR TICKET NOW\r\n        </Button>\r\n      </Column>\r\n    </Section>\r\n  </Page>,\r\n);\r\n\r\nconsole.log(blockData);\r\n```\r\n\r\n// output\r\n\r\n```json\r\n{\r\n  \"type\": \"page\",\r\n  \"data\": {\r\n    \"value\": {\r\n      \"breakpoint\": \"480px\",\r\n      \"headAttributes\": \"\",\r\n      \"font-size\": \"14px\",\r\n      \"line-height\": \"1.7\",\r\n      \"headStyles\": [],\r\n      \"fonts\": [],\r\n      \"responsive\": true,\r\n      \"font-family\": \"lucida Grande,Verdana,Microsoft YaHei\",\r\n      \"text-color\": \"#000000\"\r\n    }\r\n  },\r\n  \"attributes\": {\r\n    \"background-color\": \"#efeeea\",\r\n    \"width\": \"600px\"\r\n  },\r\n  \"children\": [\r\n    {\r\n      \"type\": \"section\",\r\n      \"data\": {\r\n        \"value\": {\r\n          \"noWrap\": false\r\n        }\r\n      },\r\n      \"attributes\": {\r\n        \"padding\": \"20px 0px 20px 0px\",\r\n        \"border\": \"none\",\r\n        \"direction\": \"ltr\",\r\n        \"text-align\": \"center\",\r\n        \"background-repeat\": \"repeat\",\r\n        \"background-size\": \"auto\",\r\n        \"background-position\": \"top center\"\r\n      },\r\n      \"children\": [\r\n        {\r\n          \"type\": \"column\",\r\n          \"data\": {\r\n            \"value\": {}\r\n          },\r\n          \"attributes\": {\r\n            \"padding\": \"0px 0px 0px 0px\",\r\n            \"border\": \"none\",\r\n            \"vertical-align\": \"top\"\r\n          },\r\n          \"children\": [\r\n            {\r\n              \"type\": \"text\",\r\n              \"data\": {\r\n                \"value\": {\r\n                  \"content\": \"GO TO SPACE\"\r\n                }\r\n              },\r\n              \"attributes\": {\r\n                \"padding\": \"20px\",\r\n                \"align\": \"center\",\r\n                \"color\": \"#ffffff\",\r\n                \"font-family\": \"Helvetica\",\r\n                \"font-size\": \"45px\",\r\n                \"line-height\": \"45px\",\r\n                \"font-weight\": \"900\"\r\n              },\r\n              \"children\": []\r\n            },\r\n            {\r\n              \"type\": \"button\",\r\n              \"data\": {\r\n                \"value\": {\r\n                  \"content\": \"ORDER YOUR TICKET NOW\"\r\n                }\r\n              },\r\n              \"attributes\": {\r\n                \"align\": \"center\",\r\n                \"background-color\": \"#414141\",\r\n                \"color\": \"#ffffff\",\r\n                \"font-weight\": \"normal\",\r\n                \"border-radius\": \"3px\",\r\n                \"padding\": \"10px 25px 10px 25px\",\r\n                \"inner-padding\": \"10px 25px 10px 25px\",\r\n                \"line-height\": \"120%\",\r\n                \"target\": \"_blank\",\r\n                \"vertical-align\": \"middle\",\r\n                \"border\": \"none\",\r\n                \"text-align\": \"center\",\r\n                \"href\": \"https://mjml.io/\"\r\n              },\r\n              \"children\": []\r\n            }\r\n          ]\r\n        }\r\n      ]\r\n    }\r\n  ]\r\n}\r\n```\r\n\r\n```tsx\r\n// Then transform to mjml\r\nconsole.log(\r\n  JsonToMjml({\r\n    data: blockData,\r\n    mode: 'production',\r\n  }),\r\n);\r\n```\r\n\r\n// output\r\n\r\n```html\r\n<mjml>\r\n  <mj-head>\r\n    <mj-html-attributes>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"text-color\"\r\n        text-color=\"#000000\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"font-family\"\r\n        font-family=\"lucida Grande,Verdana,Microsoft YaHei\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"font-size\"\r\n        font-size=\"14px\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"line-height\"\r\n        line-height=\"1.7\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"responsive\"\r\n        responsive=\"true\"\r\n      ></mj-html-attribute>\r\n    </mj-html-attributes>\r\n\r\n    <mj-breakpoint width=\"480px\" />\r\n    <mj-attributes>\r\n      <mj-all font-family=\"lucida Grande,Verdana,Microsoft YaHei\" />\r\n      <mj-text font-size=\"14px\" />\r\n      <mj-text color=\"#000000\" />\r\n      <mj-text line-height=\"1.7\" />\r\n    </mj-attributes>\r\n  </mj-head>\r\n  <mj-body\r\n    background-color=\"#efeeea\"\r\n    width=\"600px\"\r\n    css-class=\"mjml-body\"\r\n  >\r\n    <mj-section\r\n      padding=\"20px 0px 20px 0px\"\r\n      border=\"none\"\r\n      direction=\"ltr\"\r\n      text-align=\"center\"\r\n      background-repeat=\"repeat\"\r\n      background-size=\"auto\"\r\n      background-position=\"top center\"\r\n    >\r\n      <mj-column\r\n        padding=\"0px 0px 0px 0px\"\r\n        border=\"none\"\r\n        vertical-align=\"top\"\r\n      >\r\n        <mj-text\r\n          padding=\"20px\"\r\n          align=\"center\"\r\n          color=\"#ffffff\"\r\n          font-family=\"Helvetica\"\r\n          font-size=\"45px\"\r\n          line-height=\"45px\"\r\n          font-weight=\"900\"\r\n        >\r\n          GO TO SPACE\r\n        </mj-text>\r\n\r\n        <mj-button\r\n          align=\"center\"\r\n          background-color=\"#414141\"\r\n          color=\"#ffffff\"\r\n          font-weight=\"normal\"\r\n          border-radius=\"3px\"\r\n          padding=\"10px 25px 10px 25px\"\r\n          inner-padding=\"10px 25px 10px 25px\"\r\n          line-height=\"120%\"\r\n          target=\"_blank\"\r\n          vertical-align=\"middle\"\r\n          border=\"none\"\r\n          text-align=\"center\"\r\n          href=\"https://mjml.io/\"\r\n        >\r\n          ORDER YOUR TICKET NOW\r\n        </mj-button>\r\n      </mj-column>\r\n    </mj-section>\r\n  </mj-body>\r\n</mjml>\r\n```\r\n\r\n## Customize your block\r\n\r\n```tsx\r\nimport { merge } from 'lodash';\r\nimport {\r\n  createCustomBlock,\r\n  IBlockData,\r\n  components,\r\n  BasicType,\r\n  JsonToMjml,\r\n  BasicType,\r\n  BlockManager,\r\n} from 'easy-email-core';\r\nconst { Section, Column, Image, Button } = components;\r\n\r\ntype IMyFirstBlock = IBlockData<\r\n  {\r\n    'background-color': string;\r\n    'text-color': string;\r\n  },\r\n  {\r\n    buttonText: string;\r\n    imageUrl: string;\r\n  }\r\n>;\r\n\r\nconst myFirstBlock = createCustomBlock({\r\n  name: 'My first block',\r\n  type: 'MY_FIRST_BLOCK',\r\n  create(payload) {\r\n    const defaultData: IMyFirstBlock = {\r\n      type: 'MY_FIRST_BLOCK',\r\n      data: {\r\n        value: {\r\n          buttonText: 'Got it',\r\n          imageUrl:\r\n            'http://res.cloudinary.com/dwkp0e1yo/image/upload/v1665841616/pn7npfspxaqfzxiensue.png',\r\n        },\r\n      },\r\n      attributes: {\r\n        'background-color': '#4A90E2',\r\n        'text-color': '#ffffff',\r\n      },\r\n      children: [],\r\n    };\r\n    return merge(defaultData, payload);\r\n  },\r\n  validParentType: [BasicType.PAGE, BasicType.WRAPPER],\r\n  render(\r\n    data: IMyFirstBlock,\r\n    idx: string | null,\r\n    mode: 'testing' | 'production',\r\n    context?: IPage,\r\n    dataSource?: { [key: string]: any },\r\n  ) {\r\n    const { imageUrl, buttonText } = data.data.value;\r\n    const attributes = data.attributes;\r\n\r\n    const instance = (\r\n      <Section padding='20px'>\r\n        <Column>\r\n          <Image\r\n            padding='0px 0px 0px 0px'\r\n            width='100px'\r\n            src={imageUrl}\r\n          />\r\n          <Button\r\n            background-color={attributes['background-color']}\r\n            color={attributes['text-color']}\r\n            href='#'\r\n          >\r\n            {buttonText}\r\n          </Button>\r\n        </Column>\r\n      </Section>\r\n    );\r\n    return instance;\r\n  },\r\n});\r\n\r\nBlockManager.registerBlocks({ myFirstBlock });\r\n\r\nconst pageBlock = BlockManager.getBlockByType(BasicType.PAGE);\r\n\r\nconsole.log(\r\n  JsonToMjml({\r\n    data: pageBlock.create({\r\n      children: [myFirstBlock.create()],\r\n    }),\r\n    mode: 'production',\r\n  }),\r\n);\r\n```\r\n\r\n// output\r\n\r\n```html\r\n<mjml>\r\n  <mj-head>\r\n    <mj-html-attributes>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"text-color\"\r\n        text-color=\"#000000\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"font-family\"\r\n        font-family=\"lucida Grande,Verdana,Microsoft YaHei\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"font-size\"\r\n        font-size=\"14px\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"line-height\"\r\n        line-height=\"1.7\"\r\n      ></mj-html-attribute>\r\n      <mj-html-attribute\r\n        class=\"easy-email\"\r\n        multiple-attributes=\"false\"\r\n        attribute-name=\"responsive\"\r\n        responsive=\"true\"\r\n      ></mj-html-attribute>\r\n    </mj-html-attributes>\r\n\r\n    <mj-breakpoint width=\"480px\" />\r\n    <mj-attributes>\r\n      <mj-all font-family=\"lucida Grande,Verdana,Microsoft YaHei\" />\r\n      <mj-text font-size=\"14px\" />\r\n      <mj-text color=\"#000000\" />\r\n      <mj-text line-height=\"1.7\" />\r\n    </mj-attributes>\r\n  </mj-head>\r\n  <mj-body\r\n    background-color=\"#efeeea\"\r\n    width=\"600px\"\r\n    css-class=\"mjml-body\"\r\n  >\r\n    <mj-section\r\n      padding=\"20px\"\r\n      background-repeat=\"repeat\"\r\n      background-size=\"auto\"\r\n      background-position=\"top center\"\r\n      border=\"none\"\r\n      direction=\"ltr\"\r\n      text-align=\"center\"\r\n    >\r\n      <mj-column\r\n        padding=\"0px 0px 0px 0px\"\r\n        border=\"none\"\r\n        vertical-align=\"top\"\r\n      >\r\n        <mj-image\r\n          align=\"center\"\r\n          height=\"auto\"\r\n          padding=\"0px 0px 0px 0px\"\r\n          src=\"http://res.cloudinary.com/dwkp0e1yo/image/upload/v1665841616/pn7npfspxaqfzxiensue.png\"\r\n          width=\"100px\"\r\n        >\r\n        </mj-image>\r\n\r\n        <mj-button\r\n          align=\"center\"\r\n          background-color=\"#4A90E2\"\r\n          color=\"#ffffff\"\r\n          font-weight=\"normal\"\r\n          border-radius=\"3px\"\r\n          padding=\"10px 25px 10px 25px\"\r\n          inner-padding=\"10px 25px 10px 25px\"\r\n          line-height=\"120%\"\r\n          target=\"_blank\"\r\n          vertical-align=\"middle\"\r\n          border=\"none\"\r\n          text-align=\"center\"\r\n          href=\"#\"\r\n        >\r\n          Got it\r\n        </mj-button>\r\n      </mj-column>\r\n    </mj-section>\r\n  </mj-body>\r\n</mjml>\r\n```\r\n","readmeFilename":"readme.md"}