Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@arcteryx/components-cart

Package Overview
Dependencies
Maintainers
6
Versions
940
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@arcteryx/components-cart - npm Package Compare versions

Comparing version 1.1.12 to 1.1.13-alpha.5

11

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log

## [1.1.13](http://bitbucket.org/arcteryx/arcteryx-js-helpers/compare/@arcteryx/components-cart@1.1.12...@arcteryx/components-cart@1.1.13) (2020-03-06)
### Bug Fixes
* Change cart item overflow-x to auto preventing useless scrollbars on windows ([085ad09](http://bitbucket.org/arcteryx/arcteryx-js-helpers/commits/085ad09558f21ded3044ffafbc163569461de0f5))
## [1.1.12](http://bitbucket.org/arcteryx/arcteryx-js-helpers/compare/@arcteryx/components-cart@1.1.11...@arcteryx/components-cart@1.1.12) (2020-03-05)

@@ -8,0 +19,0 @@

35

dist/cjs/index.js

@@ -651,7 +651,4 @@ 'use strict';

var CartHeader = function CartHeader(_ref) {
var cart = _ref.cart,
isNarrow = _ref.isNarrow,
isFlyIn = _ref.isFlyIn,
isSidebar = _ref.isSidebar;
var CartCount = function CartCount(_ref) {
var totalItems = _ref.totalItems;

@@ -661,9 +658,25 @@ var _useTranslation = reactI18next.useTranslation(),

return React__default.createElement(React__default.Fragment, null, t("My Cart"), " ", React__default.createElement("span", {
className: "qa-total-items"
}, "(", t("Item", {
count: totalItems
}), ")"));
};
var CartHeader = function CartHeader(_ref2) {
var cart = _ref2.cart,
isNarrow = _ref2.isNarrow,
isFlyIn = _ref2.isFlyIn,
isSidebar = _ref2.isSidebar;
var _useTranslation2 = reactI18next.useTranslation(),
t = _useTranslation2.t;
return React__default.createElement(Header, {
isNarrow: isNarrow
}, isSidebar || isFlyIn ? React__default.createElement(H2, null, t("My Cart"), " ", React__default.createElement("span", {
className: "qa-total-items"
}, "(", cart.totalItems, " ", t("Item"), ")")) : React__default.createElement(H1, null, t("My Cart"), " ", React__default.createElement("span", {
className: "qa-total-items"
}, "(", cart.totalItems, " ", t("Item"), ")")), React__default.createElement(H4, null, t("Quantity")), React__default.createElement(H4, null, t("Price")), React__default.createElement(H4, null, t("Remove")));
}, isSidebar || isFlyIn ? React__default.createElement(H2, null, React__default.createElement(CartCount, {
totalItems: cart.totalItems
})) : React__default.createElement(H1, null, React__default.createElement(CartCount, {
totalItems: cart.totalItems
})), React__default.createElement(H4, null, t("Quantity")), React__default.createElement(H4, null, t("Price")), React__default.createElement(H4, null, t("Remove")));
};

@@ -786,3 +799,3 @@

function _templateObject4$3() {
var data = _taggedTemplateLiteral(["\n padding-bottom: 150px;\n overflow-y: scroll;\n overflow-x: hidden;\n "]);
var data = _taggedTemplateLiteral(["\n padding-bottom: 150px;\n overflow-y: auto;\n overflow-x: hidden;\n "]);

@@ -789,0 +802,0 @@ _templateObject4$3 = function _templateObject4() {

@@ -643,7 +643,4 @@ import React, { useContext } from 'react';

var CartHeader = function CartHeader(_ref) {
var cart = _ref.cart,
isNarrow = _ref.isNarrow,
isFlyIn = _ref.isFlyIn,
isSidebar = _ref.isSidebar;
var CartCount = function CartCount(_ref) {
var totalItems = _ref.totalItems;

@@ -653,9 +650,25 @@ var _useTranslation = useTranslation(),

return React.createElement(React.Fragment, null, t("My Cart"), " ", React.createElement("span", {
className: "qa-total-items"
}, "(", t("Item", {
count: totalItems
}), ")"));
};
var CartHeader = function CartHeader(_ref2) {
var cart = _ref2.cart,
isNarrow = _ref2.isNarrow,
isFlyIn = _ref2.isFlyIn,
isSidebar = _ref2.isSidebar;
var _useTranslation2 = useTranslation(),
t = _useTranslation2.t;
return React.createElement(Header, {
isNarrow: isNarrow
}, isSidebar || isFlyIn ? React.createElement(H2, null, t("My Cart"), " ", React.createElement("span", {
className: "qa-total-items"
}, "(", cart.totalItems, " ", t("Item"), ")")) : React.createElement(H1, null, t("My Cart"), " ", React.createElement("span", {
className: "qa-total-items"
}, "(", cart.totalItems, " ", t("Item"), ")")), React.createElement(H4, null, t("Quantity")), React.createElement(H4, null, t("Price")), React.createElement(H4, null, t("Remove")));
}, isSidebar || isFlyIn ? React.createElement(H2, null, React.createElement(CartCount, {
totalItems: cart.totalItems
})) : React.createElement(H1, null, React.createElement(CartCount, {
totalItems: cart.totalItems
})), React.createElement(H4, null, t("Quantity")), React.createElement(H4, null, t("Price")), React.createElement(H4, null, t("Remove")));
};

@@ -778,3 +791,3 @@

function _templateObject4$3() {
var data = _taggedTemplateLiteral(["\n padding-bottom: 150px;\n overflow-y: scroll;\n overflow-x: hidden;\n "]);
var data = _taggedTemplateLiteral(["\n padding-bottom: 150px;\n overflow-y: auto;\n overflow-x: hidden;\n "]);

@@ -781,0 +794,0 @@ _templateObject4$3 = function _templateObject4() {

@@ -647,7 +647,4 @@ (function (global, factory) {

var CartHeader = function CartHeader(_ref) {
var cart = _ref.cart,
isNarrow = _ref.isNarrow,
isFlyIn = _ref.isFlyIn,
isSidebar = _ref.isSidebar;
var CartCount = function CartCount(_ref) {
var totalItems = _ref.totalItems;

@@ -657,9 +654,25 @@ var _useTranslation = reactI18next.useTranslation(),

return React__default.createElement(React__default.Fragment, null, t("My Cart"), " ", React__default.createElement("span", {
className: "qa-total-items"
}, "(", t("Item", {
count: totalItems
}), ")"));
};
var CartHeader = function CartHeader(_ref2) {
var cart = _ref2.cart,
isNarrow = _ref2.isNarrow,
isFlyIn = _ref2.isFlyIn,
isSidebar = _ref2.isSidebar;
var _useTranslation2 = reactI18next.useTranslation(),
t = _useTranslation2.t;
return React__default.createElement(Header, {
isNarrow: isNarrow
}, isSidebar || isFlyIn ? React__default.createElement(H2, null, t("My Cart"), " ", React__default.createElement("span", {
className: "qa-total-items"
}, "(", cart.totalItems, " ", t("Item"), ")")) : React__default.createElement(H1, null, t("My Cart"), " ", React__default.createElement("span", {
className: "qa-total-items"
}, "(", cart.totalItems, " ", t("Item"), ")")), React__default.createElement(H4, null, t("Quantity")), React__default.createElement(H4, null, t("Price")), React__default.createElement(H4, null, t("Remove")));
}, isSidebar || isFlyIn ? React__default.createElement(H2, null, React__default.createElement(CartCount, {
totalItems: cart.totalItems
})) : React__default.createElement(H1, null, React__default.createElement(CartCount, {
totalItems: cart.totalItems
})), React__default.createElement(H4, null, t("Quantity")), React__default.createElement(H4, null, t("Price")), React__default.createElement(H4, null, t("Remove")));
};

@@ -782,3 +795,3 @@

function _templateObject4$3() {
var data = _taggedTemplateLiteral(["\n padding-bottom: 150px;\n overflow-y: scroll;\n overflow-x: hidden;\n "]);
var data = _taggedTemplateLiteral(["\n padding-bottom: 150px;\n overflow-y: auto;\n overflow-x: hidden;\n "]);

@@ -785,0 +798,0 @@ _templateObject4$3 = function _templateObject4() {

{
"name": "@arcteryx/components-cart",
"version": "1.1.12",
"version": "1.1.13-alpha.5+91f5477",
"description": "Arcteryx Cart",

@@ -18,3 +18,3 @@ "source": "src/index.js",

"license": "ISC",
"gitHead": "e5de3ec4c62ad99f617f71fc5ca27e2d6d65d120",
"gitHead": "91f54779efd37dae232be54a49c5510ce9dd6243",
"peerDependencies": {

@@ -26,3 +26,5 @@ "@arcteryx/components-contexts": "^1.1.0"

"@arcteryx/components-price": "^1.0.6",
"i18next": "^19.0.2"
"i18next": "^19.3.2",
"i18next-fetch-backend": "^2.2.0",
"react-i18next": "^11.3.3"
},

@@ -29,0 +31,0 @@ "files": [

@@ -6,3 +6,2 @@ import React, { useState, useEffect } from "react";

import { Button } from "@arcteryx/components-button";
import { useTranslation } from "react-i18next";

@@ -18,3 +17,3 @@ const label = "Add Product to Cart";

value: 800.0,
currency: "CAD",
currency: "USD",
},

@@ -36,7 +35,7 @@ size: "M",

value: 800.0,
currency: "CAD",
currency: "USD",
},
itemTotalPrice: {
value: 800.0,
currency: "CAD",
currency: "USD",
},

@@ -54,3 +53,3 @@ items: [

value: 1000,
currency: "CAD",
currency: "USD",
},

@@ -71,3 +70,3 @@ size: "M",

value: 170.0,
currency: "CAD",
currency: "USD",
},

@@ -89,3 +88,3 @@ size: "36",

value: 170.0,
currency: "CAD",
currency: "USD",
},

@@ -106,3 +105,3 @@ size: "36",

value: 1300.0,
currency: "CAD",
currency: "USD",
},

@@ -117,18 +116,2 @@ size: "REG",

const Header = styled.div`
display: flex;
text-transform: uppercase;
justify-content: space-between;
width: 100%;
padding: 10px 0px;
border-bottom: 1px solid #ccc;
h3 {
width: 35%;
}
div {
width: 21%;
text-align: center;
}
`;
const Wrap = styled.div`

@@ -161,6 +144,6 @@ max-width: ${props => props.width || "100%"};

export const FlyInCart = () => {
const { t } = useTranslation();
return (
<Wrap width="375px" height="100vh" center noborder nopadding>
<CartShell isFlyIn cart={cart} cta={<Button context="Secure-Checkout">{t("Secure Checkout")}</Button>}>
{/* So for some reason we can't use i18next t() in a story, it breaks things. Just use Lorem Ipsum for now */}
<CartShell isFlyIn cart={cart} cta={<Button context="Secure-Checkout">Lorem Ipsum</Button>}>
{cart.items.map((product, i) => (

@@ -176,7 +159,7 @@ <Item key={i} isFlyIn product={product} canEdit isFlyIn />

const [data, setData] = useState(cart);
const { t } = useTranslation();
return (
<Wrap width="930px" center noborder>
<CartShell cart={data} cta={<Button context="Secure-Checkout">{t("Secure Checkout")}</Button>}>
{/* So for some reason we can't use i18next t() in a story, it breaks things. Just use Lorem Ipsum for now */}
<CartShell cart={data} cta={<Button context="Secure-Checkout">Lorem Ipsum</Button>}>
{data.items.map((product, i) => (

@@ -183,0 +166,0 @@ <Item key={i} product={product} canEdit />

@@ -32,2 +32,11 @@ import React from "react";

const CartCount = ({ totalItems }) => {
const { t } = useTranslation();
return (
<>
{t("My Cart")} <span className="qa-total-items">({t("Item", { count: totalItems })})</span>
</>
);
};
const CartHeader = ({ cart, isNarrow, isFlyIn, isSidebar }) => {

@@ -40,13 +49,7 @@ const { t } = useTranslation();

<H2>
{t("My Cart")}{" "}
<span className="qa-total-items">
({cart.totalItems} {t("Item")})
</span>
<CartCount totalItems={cart.totalItems} />
</H2>
) : (
<H1>
{t("My Cart")}{" "}
<span className="qa-total-items">
({cart.totalItems} {t("Item")})
</span>
<CartCount totalItems={cart.totalItems} />
</H1>

@@ -53,0 +56,0 @@ )}

@@ -22,3 +22,3 @@ import React from "react";

padding-bottom: 150px;
overflow-y: scroll;
overflow-y: auto;
overflow-x: hidden;

@@ -25,0 +25,0 @@ `};

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc