@caseparts-org/caseblocks 0.0.141 → 0.0.142

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 (5) hide show
  1. package/dist/molecules/AddToCart/AddToCart.d.ts +2 -1
  2. package/dist/molecules/AddToCart/AddToCart.js +39 -38
  3. package/dist/molecules/Cart/Cart.stories.js +5 -5
  4. package/dist/molecules/Cart/CartSlideInPanel.js +29 -28
  5. package/package.json +1 -1
package/dist/molecules/AddToCart/AddToCart.d.ts CHANGED
@@ -2,6 +2,7 @@ import { default as React } from 'react';
2
2
  import { ButtonVariant } from '../../atoms/Button/buttonClassName';
3
3
  export interface AddToCartProps {
4
4
  itemKey: number;
5
+ disableButton?: boolean;
5
6
  initialQuantity?: number;
6
7
  min?: number;
7
8
  max?: number;
@@ -16,4 +17,4 @@ export interface AddToCartProps {
16
17
  buttonDoneText?: string;
17
18
  size?: "sm" | "md";
18
19
  }
19
- export declare function AddToCart({ itemKey, initialQuantity, min, max, onQuantityChange, onAdd, autoHideDelayMs, showQuantity, className, addButtonClassName, addButtonVariant, buttonText, buttonDoneText, size }: AddToCartProps): React.ReactElement | null;
20
+ export declare function AddToCart({ itemKey, disableButton, initialQuantity, min, max, onQuantityChange, onAdd, autoHideDelayMs, showQuantity, className, addButtonClassName, addButtonVariant, buttonText, buttonDoneText, size }: AddToCartProps): React.ReactElement | null;
package/dist/molecules/AddToCart/AddToCart.js CHANGED
@@ -1,65 +1,66 @@
1
- import { jsxs as j, jsx as d } from "react/jsx-runtime";
1
+ import { jsxs as v, jsx as d } from "react/jsx-runtime";
2
2
  import r from "react";
3
- import { c as v } from "../../clsx-OuTLNxxd.js";
4
- import { StatefulButton as q } from "../StatefulButton/StatefulButton.js";
5
- import { QuantityInput as w } from "../QuantityInput/QuantityInput.js";
6
- import '../../assets/AddToCart.css';const y = "_container_1xk40_1", z = {
7
- container: y
3
+ import { c as q } from "../../clsx-OuTLNxxd.js";
4
+ import { StatefulButton as w } from "../StatefulButton/StatefulButton.js";
5
+ import { QuantityInput as y } from "../QuantityInput/QuantityInput.js";
6
+ import '../../assets/AddToCart.css';const z = "_container_1xk40_1", B = {
7
+ container: z
8
8
  };
9
- function G({
9
+ function H({
10
10
  itemKey: s,
11
- initialQuantity: i = 1,
11
+ disableButton: i,
12
+ initialQuantity: l = 1,
12
13
  min: o = 1,
13
- max: l,
14
+ max: m,
14
15
  onQuantityChange: c,
15
- onAdd: m,
16
- autoHideDelayMs: f = 3e3,
17
- showQuantity: p = !0,
18
- className: x,
19
- addButtonClassName: T,
20
- addButtonVariant: _,
21
- buttonText: b,
22
- buttonDoneText: k,
16
+ onAdd: f,
17
+ autoHideDelayMs: p = 3e3,
18
+ showQuantity: x = !0,
19
+ className: T,
20
+ addButtonClassName: _,
21
+ addButtonVariant: b,
22
+ buttonText: k,
23
+ buttonDoneText: A,
23
24
  size: a
24
25
  }) {
25
- const [u, A] = r.useState(() => {
26
- const e = Number(i) || 1;
26
+ const [u, N] = r.useState(() => {
27
+ const e = Number(l) || 1;
27
28
  return e < o ? o : e;
28
- }), [N, n] = r.useState(!1), t = r.useRef(null);
29
+ }), [R, n] = r.useState(!1), t = r.useRef(null);
29
30
  r.useEffect(() => () => {
30
31
  t.current && clearTimeout(t.current);
31
32
  }, []);
32
- const R = r.useCallback((e) => {
33
- A(e), c == null || c(e);
34
- }, [c]), S = async () => {
35
- s && (await m(s, u), n(!0), t.current && clearTimeout(t.current), t.current = setTimeout(() => n(!1), f));
33
+ const S = r.useCallback((e) => {
34
+ N(e), c == null || c(e);
35
+ }, [c]), j = async () => {
36
+ s && (await f(s, u), n(!0), t.current && clearTimeout(t.current), t.current = setTimeout(() => n(!1), p));
36
37
  };
37
- return /* @__PURE__ */ j("div", { className: v(z.container, x), children: [
38
- p && /* @__PURE__ */ d(
39
- w,
38
+ return /* @__PURE__ */ v("div", { className: q(B.container, T), children: [
39
+ x && /* @__PURE__ */ d(
40
+ y,
40
41
  {
41
42
  quantity: u,
42
- onQuantityChange: R,
43
+ onQuantityChange: S,
43
44
  min: o,
44
- max: l,
45
+ max: m,
45
46
  size: a || "md"
46
47
  }
47
48
  ),
48
49
  /* @__PURE__ */ d(
49
- q,
50
+ w,
50
51
  {
51
52
  size: a || "md",
52
- variant: _ || "cta-primary",
53
- completed: N,
54
- onClick: S,
55
- text: b,
56
- completedText: k,
57
- disabled: !s,
58
- className: T
53
+ variant: b || "cta-primary",
54
+ completed: R,
55
+ onClick: j,
56
+ text: k,
57
+ completedText: A,
58
+ disabled: !s || i,
59
+ className: _
59
60
  }
60
61
  )
61
62
  ] });
62
63
  }
63
64
  export {
64
- G as AddToCart
65
+ H as AddToCart
65
66
  };
package/dist/molecules/Cart/Cart.stories.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsxs as c, Fragment as d, jsx as o } from "react/jsx-runtime";
1
+ import { jsxs as d, Fragment as c, jsx as o } from "react/jsx-runtime";
2
2
  import { useState as s } from "react";
3
3
  import { ShoppingCart as n } from "./Cart.js";
4
4
  import { CartSlideInPanel as m } from "./CartSlideInPanel.js";
@@ -13,7 +13,7 @@ const g = {
13
13
  items: [
14
14
  { id: 1, itemId: "1094-01", description: "Kason Door Closer - Flush", price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" },
15
15
  { id: 2, itemId: "810810", description: "True Door Gasket", price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" },
16
- { id: 3, itemId: "MG064", description: '36" x 79" 3-Sided Dart-to-Dart Gasket', price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" },
16
+ { id: 3, itemId: 'MG064 36" x 79" 3-Sided Dart-to-Dart Gasket', description: "Custom-Molded Snap-In Magnetic Gasket", price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" },
17
17
  { id: 4, itemId: "MG064-B", description: '36" x 79" 3-Sided Dart-to-Dart Gasket', price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" },
18
18
  { id: 5, itemId: "Warmer Wire", description: '228" 7.0 OHMS 115V', price: "$99.99", quantity: 1, imageUrl: a, availability: "", availabilityId: "available" },
19
19
  { id: 6, itemId: "810803", description: "True Door Gasket", price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" },
@@ -32,7 +32,7 @@ const g = {
32
32
  { id: 4, itemId: "MG064-B", description: '36" x 79" 3-Sided Dart-to-Dart Gasket', price: "$99.99", quantity: 1, imageUrl: a, availability: "In Stock", availabilityId: "available" }
33
33
  ]
34
34
  };
35
- function b(i) {
35
+ function I(i) {
36
36
  return `$${i.items.reduce(
37
37
  (t, e) => t + (parseFloat(e.price.replace(/[^0-9.]/g, "")) || 0) * e.quantity,
38
38
  0
@@ -40,7 +40,7 @@ function b(i) {
40
40
  }
41
41
  const r = (i) => {
42
42
  const [l, t] = s(!1);
43
- return /* @__PURE__ */ c(d, { children: [
43
+ return /* @__PURE__ */ d(c, { children: [
44
44
  /* @__PURE__ */ o(
45
45
  n,
46
46
  {
@@ -55,7 +55,7 @@ const r = (i) => {
55
55
  open: l,
56
56
  onClose: () => t(!1),
57
57
  cart: i.cart,
58
- subtotal: b(i.cart),
58
+ subtotal: I(i.cart),
59
59
  itemPriceLabel: "List Price",
60
60
  contactHref: "#",
61
61
  contactLinkBehavior: "new-tab",
package/dist/molecules/Cart/CartSlideInPanel.js CHANGED
@@ -1,17 +1,17 @@
1
- import { jsx as e, jsxs as a } from "react/jsx-runtime";
1
+ import { jsx as e, jsxs as t } from "react/jsx-runtime";
2
2
  import { SlideInPanel as g } from "../../atoms/SlideInPanel/SlideInPanel.js";
3
3
  import { Text as n } from "../../atoms/Text/Text.js";
4
- import { Link as I } from "../../atoms/Link/Link.js";
5
- import { Button as y } from "../../atoms/Button/Button.js";
4
+ import { Link as y } from "../../atoms/Link/Link.js";
5
+ import { Button as I } from "../../atoms/Button/Button.js";
6
6
  import { Pricing as b } from "../Pricing/Pricing.js";
7
7
  import { QuantityInput as N } from "../QuantityInput/QuantityInput.js";
8
8
  import { Availability as z } from "../Availability/Availability.js";
9
- import { Icon as C } from "../../atoms/Icon/Icon.js";
10
- import { s as t } from "../../Cart.module-9txlotpz.js";
11
- function Q({
9
+ import { Icon as k } from "../../atoms/Icon/Icon.js";
10
+ import { s as r } from "../../Cart.module-9txlotpz.js";
11
+ function H({
12
12
  open: s,
13
13
  onClose: o,
14
- cart: r,
14
+ cart: a,
15
15
  subtotal: l,
16
16
  itemPriceLabel: c,
17
17
  contactHref: d,
@@ -21,36 +21,37 @@ function Q({
21
21
  onCheckout: v
22
22
  }) {
23
23
  var m;
24
- return r = r || { items: [] }, /* @__PURE__ */ e(
24
+ return a = a || { items: [] }, /* @__PURE__ */ e(
25
25
  g,
26
26
  {
27
27
  side: "right",
28
28
  open: s,
29
29
  onClose: o,
30
30
  ariaLabel: "Shopping Cart",
31
- children: /* @__PURE__ */ a("div", { id: "cart-panel", className: t.cartContainer, children: [
32
- /* @__PURE__ */ a("div", { className: t.header, children: [
31
+ children: /* @__PURE__ */ t("div", { id: "cart-panel", className: r.cartContainer, children: [
32
+ /* @__PURE__ */ t("div", { className: r.header, children: [
33
33
  /* @__PURE__ */ e(n, { size: "2xl", children: "Cart" }),
34
- /* @__PURE__ */ a(n, { size: "xs", colorToken: "quaternary", children: [
35
- (m = r == null ? void 0 : r.items) == null ? void 0 : m.length,
34
+ /* @__PURE__ */ t(n, { size: "xs", colorToken: "quaternary", children: [
35
+ (m = a == null ? void 0 : a.items) == null ? void 0 : m.length,
36
36
  " items in your cart"
37
37
  ] })
38
38
  ] }),
39
- /* @__PURE__ */ e("div", { className: t.cartItems, children: r.items.length > 0 ? /* @__PURE__ */ e("ul", { children: r.items.map((i) => /* @__PURE__ */ a("li", { className: t.cartItem, children: [
39
+ /* @__PURE__ */ e("div", { className: r.cartItems, children: a.items.length > 0 ? /* @__PURE__ */ e("ul", { children: a.items.map((i) => /* @__PURE__ */ t("li", { className: r.cartItem, children: [
40
40
  /* @__PURE__ */ e("img", { src: i.imageUrl, alt: `${i.itemId} product image` }),
41
- /* @__PURE__ */ a("div", { children: [
42
- /* @__PURE__ */ a("div", { className: t.topRow, children: [
43
- /* @__PURE__ */ a("div", { className: t.itemInfo, children: [
44
- /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: /* @__PURE__ */ e(I, { href: i.itemHref || `/part/${i.itemId}`, children: i.description }) }),
45
- /* @__PURE__ */ a(n, { size: "sm", children: [
46
- "Part # ",
41
+ /* @__PURE__ */ t("div", { children: [
42
+ /* @__PURE__ */ t("div", { className: r.topRow, children: [
43
+ /* @__PURE__ */ t("div", { className: r.itemInfo, children: [
44
+ /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: /* @__PURE__ */ e(y, { href: i.itemHref || `/part/${i.itemId}`, children: i.description }) }),
45
+ /* @__PURE__ */ t(n, { size: "sm", children: [
46
+ /* @__PURE__ */ e(n, { colorToken: "quaternary", size: "xs", children: "Part #" }),
47
+ " ",
47
48
  i.itemId
48
49
  ] })
49
50
  ] }),
50
- /* @__PURE__ */ e("button", { onClick: () => u(i), className: t.removeItem, "aria-label": "Remove item", children: /* @__PURE__ */ e(C, { iconKey: "fa-regular fa-trash", size: "sm" }) })
51
+ /* @__PURE__ */ e("button", { onClick: () => u(i), className: r.removeItem, "aria-label": "Remove item", children: /* @__PURE__ */ e(k, { iconKey: "fa-regular fa-trash", size: "sm" }) })
51
52
  ] }),
52
- /* @__PURE__ */ a("div", { className: t.itemManagement, children: [
53
- /* @__PURE__ */ a("div", { className: t.purchaseInformation, children: [
53
+ /* @__PURE__ */ t("div", { className: r.itemManagement, children: [
54
+ /* @__PURE__ */ t("div", { className: r.purchaseInformation, children: [
54
55
  /* @__PURE__ */ e(
55
56
  z,
56
57
  {
@@ -72,19 +73,19 @@ function Q({
72
73
  )
73
74
  ] })
74
75
  ] })
75
- ] }, i.id)) }) : /* @__PURE__ */ e("div", { className: t.noItems, children: /* @__PURE__ */ e(n, { as: "p", size: "sm", children: "No items in your cart yet" }) }) }),
76
- l && /* @__PURE__ */ a("div", { className: t.subtotal, children: [
76
+ ] }, i.id)) }) : /* @__PURE__ */ e("div", { className: r.noItems, children: /* @__PURE__ */ e(n, { as: "p", size: "sm", children: "No items in your cart yet" }) }) }),
77
+ l && /* @__PURE__ */ t("div", { className: r.subtotal, children: [
77
78
  /* @__PURE__ */ e(n, { size: "md", weight: "semibold", children: "Subtotal" }),
78
79
  /* @__PURE__ */ e(n, { size: "md", weight: "semibold", children: l })
79
80
  ] }),
80
81
  /* @__PURE__ */ e(
81
- y,
82
+ I,
82
83
  {
83
- disabled: r.items.length === 0,
84
+ disabled: a.items.length === 0,
84
85
  onClick: v,
85
86
  variant: "cta-primary",
86
87
  size: "md",
87
- className: t.checkoutButton,
88
+ className: r.checkoutButton,
88
89
  children: "Checkout"
89
90
  }
90
91
  )
@@ -93,5 +94,5 @@ function Q({
93
94
  );
94
95
  }
95
96
  export {
96
- Q as CartSlideInPanel
97
+ H as CartSlideInPanel
97
98
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@caseparts-org/caseblocks",
3
3
  "private": false,
4
- "version": "0.0.141",
4
+ "version": "0.0.142",
5
5
  "type": "module",
6
6
  "module": "dist/main.js",
7
7
  "types": "dist/main.d.ts",