@gem-sdk/plugin-cart-drawer 1.0.0 → 1.5.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/cjs/components/CartFooter.js +3 -2
  2. package/dist/cjs/components/CartLineItem.js +1 -1
  3. package/dist/esm/components/CartFooter.js +4 -3
  4. package/dist/esm/components/CartLineItem.js +1 -1
  5. package/dist/esm/index.js +4 -1
  6. package/dist/types/index.d.ts +8 -8
  7. package/package.json +1 -1
package/dist/cjs/components/CartFooter.js CHANGED
@@ -7,6 +7,7 @@ var core = require('@gem-sdk/core');
7
7
  var react = require('react');
8
8
 
9
9
  const CartFooter = ({ checkoutUrl, price, openMode }) => {
10
+ const urlCheckout = core.useCheckoutUrl(checkoutUrl);
10
11
  const checkoutPopup = react.useRef(null);
11
12
  const money = core.useMoney(price ?? 0);
12
13
  const openCheckout = (w, h) => {
@@ -26,11 +27,11 @@ const CartFooter = ({ checkoutUrl, price, openMode }) => {
26
27
  const systemZoom = width / window.screen.availWidth;
27
28
  const left = (width - w) / 2 / systemZoom + dualScreenLeft;
28
29
  const top = (height - h) / 2 / systemZoom + dualScreenTop;
29
- checkoutPopup.current = window.open(checkoutUrl, 'checkout', `scrollbars=yes, width=${w / systemZoom}, height=${h / systemZoom}, top=${top}, left=${left}`);
30
+ checkoutPopup.current = window.open(urlCheckout, 'checkout', `scrollbars=yes, width=${w / systemZoom}, height=${h / systemZoom}, top=${top}, left=${left}`);
30
31
  checkoutPopup.current?.focus();
31
32
  }
32
33
  else {
33
- window.open(checkoutUrl);
34
+ window.open(urlCheckout);
34
35
  }
35
36
  };
36
37
  return (jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 border-t border-t-g-line-3 bg-g-bg-2 px-6 pt-4 pb-8", children: [jsxRuntime.jsxs("div", { className: "g-paragraph-1 flex justify-between font-semibold", children: [jsxRuntime.jsx("span", { children: "Subtotal:" }), jsxRuntime.jsx("span", { "aria-label": "Total price", children: money.localizedString })] }), jsxRuntime.jsxs("div", { "aria-label": "Checkout", role: "button", "aria-hidden": "true", className: "g-paragraph-1 flex justify-between bg-g-brand py-3 px-4 font-semibold text-g-text-3", onClick: () => openCheckout(600, 600), style: {
package/dist/cjs/components/CartLineItem.js CHANGED
@@ -15,7 +15,7 @@ const CartLineItem = () => {
15
15
  const { isMutating: loading, trigger: removeCartLine } = core.useRemoveCartItem();
16
16
  const money = core.useMoney(line.variant?.price ? line.variant?.price : 0);
17
17
  const compareAtPrice = core.useMoney(line.variant?.listPrice ? line.variant?.listPrice : 0);
18
- return (jsxRuntime.jsxs("div", { className: "flex items-center gap-4 border-b border-b-g-line-2 py-4 last:border-b-transparent", children: [jsxRuntime.jsx("div", { className: "aspect-square w-16", children: line.variant?.image?.url && (jsxRuntime.jsx("img", { className: "h-full w-full object-cover", src: line.variant.image.url, alt: line.variant?.image?.altText ?? '' })) }), jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsxs("p", { className: "line-clamp-2", children: [line.productTitle, " - ", line.variant.name] }), jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 text-sm", children: [jsxRuntime.jsxs("div", { className: "flex gap-2", children: [jsxRuntime.jsx("span", { className: "font-semibold", children: money.localizedString }), line.variant?.listPrice > 0 && (jsxRuntime.jsx("span", { className: "text-[#B4B4B4] line-through", children: compareAtPrice.localizedString }))] }), line.attributes?.map((attribute) => (jsxRuntime.jsxs("div", { children: [attribute.key, ": ", attribute.value] }, attribute.key)))] }), jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [jsxRuntime.jsx(CartLineItemQuantity.default, { size: "medium" }), jsxRuntime.jsx("button", { onClick: () => {
18
+ return (jsxRuntime.jsxs("div", { className: "flex items-center gap-4 border-b border-b-g-line-2 py-4 last:border-b-transparent", children: [jsxRuntime.jsx("div", { className: "aspect-square w-16", children: line.variant?.image?.url && (jsxRuntime.jsx("img", { className: "h-full w-full object-cover", src: line.variant.image.url, alt: line.variant?.image?.altText ?? '' })) }), jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsxs("p", { className: "line-clamp-2", children: [line.productTitle, " ", line.variant.name !== 'Default Title' && ` - ${line.variant.name}`] }), jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 text-sm", children: [jsxRuntime.jsxs("div", { className: "flex gap-2", children: [jsxRuntime.jsx("span", { className: "font-semibold", children: money.localizedString }), line.variant?.listPrice > 0 && (jsxRuntime.jsx("span", { className: "text-[#B4B4B4] line-through", children: compareAtPrice.localizedString }))] }), line.attributes?.map((attribute) => (jsxRuntime.jsxs("div", { children: [attribute.key, ": ", attribute.value] }, attribute.key)))] }), jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [jsxRuntime.jsx(CartLineItemQuantity.default, { size: "medium" }), jsxRuntime.jsx("button", { onClick: () => {
19
19
  components.openConfirm({
20
20
  title: (jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-center gap-4", children: [jsxRuntime.jsx(Trash.default, {}), jsxRuntime.jsx("p", { className: "font-g-body text-xl font-semibold", children: "Are you sure ?" })] })),
21
21
  content: (jsxRuntime.jsxs("div", { className: "text-center", children: [jsxRuntime.jsx("p", { children: "Do you really want to delete these items?" }), jsxRuntime.jsx("p", { children: "This process cannot be undone." })] })),
package/dist/esm/components/CartFooter.js CHANGED
@@ -1,8 +1,9 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { useMoney, composeRadius } from '@gem-sdk/core';
2
+ import { useCheckoutUrl, useMoney, composeRadius } from '@gem-sdk/core';
3
3
  import { useRef } from 'react';
4
4
 
5
5
  const CartFooter = ({ checkoutUrl, price, openMode }) => {
6
+ const urlCheckout = useCheckoutUrl(checkoutUrl);
6
7
  const checkoutPopup = useRef(null);
7
8
  const money = useMoney(price ?? 0);
8
9
  const openCheckout = (w, h) => {
@@ -22,11 +23,11 @@ const CartFooter = ({ checkoutUrl, price, openMode }) => {
22
23
  const systemZoom = width / window.screen.availWidth;
23
24
  const left = (width - w) / 2 / systemZoom + dualScreenLeft;
24
25
  const top = (height - h) / 2 / systemZoom + dualScreenTop;
25
- checkoutPopup.current = window.open(checkoutUrl, 'checkout', `scrollbars=yes, width=${w / systemZoom}, height=${h / systemZoom}, top=${top}, left=${left}`);
26
+ checkoutPopup.current = window.open(urlCheckout, 'checkout', `scrollbars=yes, width=${w / systemZoom}, height=${h / systemZoom}, top=${top}, left=${left}`);
26
27
  checkoutPopup.current?.focus();
27
28
  }
28
29
  else {
29
- window.open(checkoutUrl);
30
+ window.open(urlCheckout);
30
31
  }
31
32
  };
32
33
  return (jsxs("div", { className: "flex flex-col gap-4 border-t border-t-g-line-3 bg-g-bg-2 px-6 pt-4 pb-8", children: [jsxs("div", { className: "g-paragraph-1 flex justify-between font-semibold", children: [jsx("span", { children: "Subtotal:" }), jsx("span", { "aria-label": "Total price", children: money.localizedString })] }), jsxs("div", { "aria-label": "Checkout", role: "button", "aria-hidden": "true", className: "g-paragraph-1 flex justify-between bg-g-brand py-3 px-4 font-semibold text-g-text-3", onClick: () => openCheckout(600, 600), style: {
package/dist/esm/components/CartLineItem.js CHANGED
@@ -11,7 +11,7 @@ const CartLineItem = () => {
11
11
  const { isMutating: loading, trigger: removeCartLine } = useRemoveCartItem();
12
12
  const money = useMoney(line.variant?.price ? line.variant?.price : 0);
13
13
  const compareAtPrice = useMoney(line.variant?.listPrice ? line.variant?.listPrice : 0);
14
- return (jsxs("div", { className: "flex items-center gap-4 border-b border-b-g-line-2 py-4 last:border-b-transparent", children: [jsx("div", { className: "aspect-square w-16", children: line.variant?.image?.url && (jsx("img", { className: "h-full w-full object-cover", src: line.variant.image.url, alt: line.variant?.image?.altText ?? '' })) }), jsxs("div", { className: "flex-1", children: [jsxs("p", { className: "line-clamp-2", children: [line.productTitle, " - ", line.variant.name] }), jsxs("div", { className: "flex flex-col gap-1 text-sm", children: [jsxs("div", { className: "flex gap-2", children: [jsx("span", { className: "font-semibold", children: money.localizedString }), line.variant?.listPrice > 0 && (jsx("span", { className: "text-[#B4B4B4] line-through", children: compareAtPrice.localizedString }))] }), line.attributes?.map((attribute) => (jsxs("div", { children: [attribute.key, ": ", attribute.value] }, attribute.key)))] }), jsxs("div", { className: "flex items-center justify-between", children: [jsx(CartLineItemQuantity, { size: "medium" }), jsx("button", { onClick: () => {
14
+ return (jsxs("div", { className: "flex items-center gap-4 border-b border-b-g-line-2 py-4 last:border-b-transparent", children: [jsx("div", { className: "aspect-square w-16", children: line.variant?.image?.url && (jsx("img", { className: "h-full w-full object-cover", src: line.variant.image.url, alt: line.variant?.image?.altText ?? '' })) }), jsxs("div", { className: "flex-1", children: [jsxs("p", { className: "line-clamp-2", children: [line.productTitle, " ", line.variant.name !== 'Default Title' && ` - ${line.variant.name}`] }), jsxs("div", { className: "flex flex-col gap-1 text-sm", children: [jsxs("div", { className: "flex gap-2", children: [jsx("span", { className: "font-semibold", children: money.localizedString }), line.variant?.listPrice > 0 && (jsx("span", { className: "text-[#B4B4B4] line-through", children: compareAtPrice.localizedString }))] }), line.attributes?.map((attribute) => (jsxs("div", { children: [attribute.key, ": ", attribute.value] }, attribute.key)))] }), jsxs("div", { className: "flex items-center justify-between", children: [jsx(CartLineItemQuantity, { size: "medium" }), jsx("button", { onClick: () => {
15
15
  openConfirm({
16
16
  title: (jsxs("div", { className: "flex w-full flex-col items-center gap-4", children: [jsx(Trash, {}), jsx("p", { className: "font-g-body text-xl font-semibold", children: "Are you sure ?" })] })),
17
17
  content: (jsxs("div", { className: "text-center", children: [jsx("p", { children: "Do you really want to delete these items?" }), jsx("p", { children: "This process cannot be undone." })] })),
package/dist/esm/index.js CHANGED
@@ -1,2 +1,5 @@
1
1
  import CartDrawer from './components/CartDrawer.js';
2
- export { default } from './components/CartDrawer.js';
2
+
3
+
4
+
5
+ export { CartDrawer as default };
package/dist/types/index.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  import { BaseProps } from '@gem-sdk/core';
2
2
 
3
- type CartDrawerProps = BaseProps<{
4
- title?: string;
5
- emptyLabel?: string;
6
- openMode?: 'popup' | 'page';
7
- }> & {
8
- className?: string;
9
- style?: React.CSSProperties;
10
- };
3
+ type CartDrawerProps = BaseProps<{
4
+ title?: string;
5
+ emptyLabel?: string;
6
+ openMode?: 'popup' | 'page';
7
+ }> & {
8
+ className?: string;
9
+ style?: React.CSSProperties;
10
+ };
11
11
  declare const CartDrawer: React.FC<CartDrawerProps>;
12
12
 
13
13
  export { CartDrawer as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/plugin-cart-drawer",
3
- "version": "1.0.0",
3
+ "version": "1.5.15",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",