components-vtex-legacy v0.4.0

Installation

npm:

npm i components-vtex-legacy

Yarn:

yarn add components-vtex-legacy

Usage

import React from "react";
import ReactDOM from "react-dom";
import { Minicart } from "components-vtex-legacy";

const closeIcon = `<svg width="11" height="18" viewBox="0 0 11 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.19999 0L0 2.24998L6.65644 8.99998L0 15.75L2.19999 18L11 9.00002L2.19999 0Z" fill="#fff"/></svg>`;

const removeIcon = `<svg width="51" height="51" viewBox="0 0 51 51" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M51 6.00973L44.9903 0L25.4999 19.4902L6.00973 0L0 6.00973L19.4902 25.4999L0 44.9903L6.00973 51L25.4999 31.5098L44.9901 51L50.9999 44.9903L31.5098 25.4999L51 6.00973Z" fill="#000"/></svg>`

function Header() {
  ReactDOM.render(
    <Minicart 
      triggerElementSelector=".minicart-icon" 
      title="MINHA SACOLA" 
      closeIcon={closeIcon} 
      removeIcon={removeIcon} 
      buyButtonText="FINALIZAR COMPRA" 
      emptyMessage="Sua sacola está vazia!" 
      keepBuyingButtonText="CONTINUAR COMPRANDO"/>, 
    document.getElementById("minicartContainer"));
}

Attribution

Browser testing provided by

License

MIT © Leonardo Oliveira