@caseparts-org/caseblocks 0.0.54 → 0.0.56

package/dist/organisms/MainNav/MainNav.js

@@ -1,111 +1,113 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { Text as f } from "../../atoms/Text/Text.js";
-import { Link as p } from "../../atoms/Link/Link.js";
-import { Icon as w } from "../../atoms/Icon/Icon.js";
-import { Flex as a } from "../../atoms/Flex/Flex.js";
-import { Grid as D, Column as I } from "../../atoms/Grid/Grid.js";
-import { Logo as M } from "../../molecules/Logo/Logo.js";
-import { SearchBox as d } from "../../molecules/SearchBox/SearchBox.js";
-import { HamburgerMenu as U } from "../../molecules/HamburgerMenu/HamburgerMenu.js";
-import { ShoppingCart as B } from "../../molecules/Cart/Cart.js";
-import { Account as F } from "../../molecules/Account/Account.js";
-import { CategoryNav as H } from "../../molecules/CategoryNav/CategoryNav.js";
-import { c as P } from "../../clsx-OuTLNxxd.js";
-import '../../assets/MainNav.css';const S = "_main_18fjz_1", G = "_column_18fjz_8", K = "_topNav_18fjz_13", Q = "_operations_18fjz_21", T = "_search_18fjz_28", W = "_siteLink_18fjz_31", q = "_accountArea_18fjz_35", E = "_category_18fjz_47", J = "_menuList_18fjz_69", i = {
-  main: S,
-  column: G,
-  topNav: K,
-  operations: Q,
-  search: T,
-  siteLink: W,
-  accountArea: q,
-  category: E,
-  menuList: J
+import { jsx as e, jsxs as o } from "react/jsx-runtime";
+import { Text as p } from "../../atoms/Text/Text.js";
+import { Link as m } from "../../atoms/Link/Link.js";
+import { Icon as z } from "../../atoms/Icon/Icon.js";
+import { Flex as t } from "../../atoms/Flex/Flex.js";
+import { Grid as I, Column as M } from "../../atoms/Grid/Grid.js";
+import { Logo as U } from "../../molecules/Logo/Logo.js";
+import { SearchBox as f } from "../../molecules/SearchBox/SearchBox.js";
+import { HamburgerMenu as B } from "../../molecules/HamburgerMenu/HamburgerMenu.js";
+import { ShoppingCart as F } from "../../molecules/Cart/Cart.js";
+import { Account as H } from "../../molecules/Account/Account.js";
+import { CategoryNav as P } from "../../molecules/CategoryNav/CategoryNav.js";
+import { c as S } from "../../clsx-OuTLNxxd.js";
+import '../../assets/MainNav.css';const G = "_main_1l043_1", K = "_column_1l043_8", Q = "_topNav_1l043_13", T = "_logo_1l043_21", W = "_operations_1l043_24", q = "_search_1l043_31", E = "_siteLink_1l043_34", J = "_accountArea_1l043_38", O = "_category_1l043_50", V = "_menuList_1l043_72", i = {
+  main: G,
+  column: K,
+  topNav: Q,
+  logo: T,
+  operations: W,
+  search: q,
+  siteLink: E,
+  accountArea: J,
+  category: O,
+  menuList: V
 };
 function ae({
-  account: o,
+  account: l,
   categories: n,
   byModelSerialRoute: c,
-  faqRoute: _,
-  customPartsRoute: m,
-  aboutUsRoute: u,
-  accountRoute: N,
-  contactRoute: s,
+  homeRoute: _,
+  faqRoute: u,
+  customPartsRoute: h,
+  aboutUsRoute: N,
+  accountRoute: g,
+  contactRoute: a,
   cart: v,
-  cartSubtotal: g,
-  cartItemPriceLabel: j,
-  cartContactLinkBehavior: A,
-  onLoginClick: L,
-  onSearch: h,
-  onItemQtyChange: x,
-  onItemDelete: z,
-  onItemEdit: C,
-  onCheckout: k,
-  className: y,
-  ...b
+  cartSubtotal: A,
+  cartItemPriceLabel: L,
+  cartContactLinkBehavior: x,
+  onLoginClick: C,
+  onSearch: d,
+  onItemQtyChange: k,
+  onItemDelete: y,
+  onItemEdit: b,
+  onCheckout: w,
+  className: j,
+  ...D
 }) {
-  return /* @__PURE__ */ e(D, { ...b, gridWrapperClassName: P(i.main, y), children: /* @__PURE__ */ t(I, { span: 12, className: i.column, children: [
-    /* @__PURE__ */ t(
-      a,
+  return /* @__PURE__ */ e(I, { ...D, gridWrapperClassName: S(i.main, j), children: /* @__PURE__ */ o(M, { span: 12, className: i.column, children: [
+    /* @__PURE__ */ o(
+      t,
       {
         flexDirection: "row",
         alignItems: "center",
         justifyContent: "space-between",
         className: i.topNav,
         children: [
-          /* @__PURE__ */ e("div", { className: i.logo, children: /* @__PURE__ */ e(M, {}) }),
-          /* @__PURE__ */ t(
-            a,
+          /* @__PURE__ */ e("div", { className: i.logo, children: /* @__PURE__ */ e(m, { href: _, children: /* @__PURE__ */ e(U, {}) }) }),
+          /* @__PURE__ */ o(
+            t,
             {
               flexDirection: "row",
               alignItems: "center",
               justifyContent: "flex-end",
               className: i.operations,
               children: [
-                /* @__PURE__ */ e(a, { flexDirection: "row", hideAt: ["sm"], className: i.search, children: /* @__PURE__ */ e(d, { onSearch: h, inputName: "cpc-search" }) }),
+                /* @__PURE__ */ e(t, { flexDirection: "row", hideAt: ["sm"], className: i.search, children: /* @__PURE__ */ e(f, { onSearch: d, inputName: "cpc-search" }) }),
                 /* @__PURE__ */ e(r, { href: c, hideAt: ["sm", "md"], children: "Model/Serial" }),
-                /* @__PURE__ */ e(r, { href: m, hideAt: ["sm", "md"], children: "Custom Parts" }),
-                /* @__PURE__ */ e(r, { href: s, hideAt: ["sm", "md"], children: "Contact Us" }),
+                /* @__PURE__ */ e(r, { href: h, hideAt: ["sm", "md"], children: "Custom Parts" }),
+                /* @__PURE__ */ e(r, { href: a, hideAt: ["sm", "md"], children: "Contact Us" }),
                 /* @__PURE__ */ e("div", { className: i.accountArea, children: /* @__PURE__ */ e(
-                  F,
+                  H,
                   {
-                    account: o,
-                    accountRoute: N,
-                    onLoginClick: L,
+                    account: l,
+                    accountRoute: g,
+                    onLoginClick: C,
                     className: i.avatar
                   }
                 ) }),
                 /* @__PURE__ */ e(
-                  B,
+                  F,
                   {
                     cart: v,
-                    onItemDelete: z,
-                    onItemEdit: C,
-                    onItemQtyChange: x,
-                    onCheckout: k,
-                    subtotal: g,
-                    contactHref: s,
-                    contactLinkBehavior: A,
-                    itemPriceLabel: j
+                    onItemDelete: y,
+                    onItemEdit: b,
+                    onItemQtyChange: k,
+                    onCheckout: w,
+                    subtotal: A,
+                    contactHref: a,
+                    contactLinkBehavior: x,
+                    itemPriceLabel: L
                   }
                 ),
-                /* @__PURE__ */ e(U, { hideAt: ["lg"], children: /* @__PURE__ */ t("ul", { className: i.menuList, children: [
+                /* @__PURE__ */ e(B, { hideAt: ["lg"], children: /* @__PURE__ */ o("ul", { className: i.menuList, children: [
                   /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: c, children: "Make/Serial" }) }),
-                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: m, children: "Custom Parts" }) }),
-                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: s, children: "Contact Us" }) }),
-                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: _, children: "FAQ" }) }),
-                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: u, children: "About Us" }) }),
-                  n && n.map((l) => /* @__PURE__ */ e("li", { className: i.category, children: /* @__PURE__ */ t(p, { href: l.route, children: [
-                    /* @__PURE__ */ e(f, { size: "sm", weight: "semibold", children: l.label }),
+                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: h, children: "Custom Parts" }) }),
+                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: a, children: "Contact Us" }) }),
+                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: u, children: "FAQ" }) }),
+                  /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(r, { href: N, children: "About Us" }) }),
+                  n && n.map((s) => /* @__PURE__ */ e("li", { className: i.category, children: /* @__PURE__ */ o(m, { href: s.route, children: [
+                    /* @__PURE__ */ e(p, { size: "sm", weight: "semibold", children: s.label }),
                     /* @__PURE__ */ e(
-                      w,
+                      z,
                       {
                         iconKey: "fa-solid fa-chevron-right",
                         title: "Navigate",
                         size: "sm"
                       }
                     )
-                  ] }) }, l.id))
+                  ] }) }, s.id))
                 ] }) })
               ]
             }
@@ -113,16 +115,16 @@ function ae({
         ]
       }
     ),
-    /* @__PURE__ */ e(a, { flexDirection: "row", hideAt: ["md", "lg"], children: /* @__PURE__ */ e(d, { onSearch: h, inputName: "cpc-search", className: i.search }) }),
-    /* @__PURE__ */ e(H, { categories: n })
+    /* @__PURE__ */ e(t, { flexDirection: "row", hideAt: ["md", "lg"], children: /* @__PURE__ */ e(f, { onSearch: d, inputName: "cpc-search", className: i.search }) }),
+    /* @__PURE__ */ e(P, { categories: n })
   ] }) });
 }
 function r({
-  href: o,
+  href: l,
   children: n,
   ...c
 }) {
-  return /* @__PURE__ */ e(p, { href: o, className: i.siteLink, ...c, children: /* @__PURE__ */ e(f, { size: "md", variant: "display", children: n }) });
+  return /* @__PURE__ */ e(m, { href: l, className: i.siteLink, ...c, children: /* @__PURE__ */ e(p, { size: "md", variant: "display", children: n }) });
 }
 export {
   ae as MainNav

package/dist/organisms/MainNav/MainNav.stories.js

@@ -103,6 +103,7 @@ const r = {
       number: "123456789012"
     },
     cart: i,
+    homeRoute: "/",
     customPartsRoute: "/custom",
     accountRoute: "/account",
     byModelSerialRoute: "/model",
@@ -137,6 +138,7 @@ const r = {
       number: "123456789012"
     },
     cart: i,
+    homeRoute: "/",
     customPartsRoute: "/custom",
     accountRoute: "/account",
     byModelSerialRoute: "/model",
@@ -166,6 +168,7 @@ const r = {
 }, d = {
   args: {
     cart: i,
+    homeRoute: "/",
     customPartsRoute: "/custom",
     accountRoute: "/account",
     byModelSerialRoute: "/model",

package/dist/organisms/NotFound/NotFound.d.ts

@@ -0,0 +1,11 @@
+export interface NotFoundProps {
+    primaryLinkButtonProps: {
+        label: string;
+        href: string;
+    };
+    secondaryLinkButtonProps: {
+        label: string;
+        href: string;
+    };
+}
+export declare function NotFound({ primaryLinkButtonProps, secondaryLinkButtonProps }: NotFoundProps): import("react/jsx-runtime").JSX.Element;

package/dist/organisms/NotFound/NotFound.js

@@ -0,0 +1,34 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { Image as t } from "../../atoms/Image/Image.js";
+import { Text as n } from "../../atoms/Text/Text.js";
+import { LinkButton as l } from "../../atoms/LinkButton/LinkButton.js";
+import { Flex as a } from "../../atoms/Flex/Flex.js";
+import { c } from "../../clsx-OuTLNxxd.js";
+import '../../assets/NotFound.css';const m = "_main_1dfh4_1", d = "_column_1dfh4_10", h = "_description_1dfh4_14", f = "_header_1dfh4_19", _ = "_links_1dfh4_24", i = {
+  main: m,
+  column: d,
+  description: h,
+  header: f,
+  links: _
+};
+function z({ primaryLinkButtonProps: r, secondaryLinkButtonProps: o }) {
+  return /* @__PURE__ */ s(a, { flexDirection: "row", alignItems: "center", justifyContent: "center", className: i.main, children: [
+    /* @__PURE__ */ e("div", { className: i.column, children: /* @__PURE__ */ e(t, { src: "/assets/not-found.png", alt: "Not found image" }) }),
+    /* @__PURE__ */ s("div", { className: c(i.description, i.column), children: [
+      /* @__PURE__ */ e(n, { size: "6xl", variant: "display", as: "h1", className: i.header, children: "404" }),
+      /* @__PURE__ */ s(n, { size: "xl", children: [
+        "Oops! Well this is embarrassing...",
+        /* @__PURE__ */ e("br", {}),
+        "what you're looking for is missing or something is on the fritz."
+      ] }),
+      /* @__PURE__ */ e(n, { size: "xl", children: "Don't worry—for assistance call us at 1-800-421-0271" }),
+      /* @__PURE__ */ s("div", { className: i.links, children: [
+        /* @__PURE__ */ e(l, { variant: "primary", size: "md", href: r.href, children: r.label }),
+        /* @__PURE__ */ e(l, { variant: "secondary", size: "md", href: o.href, children: o.label })
+      ] })
+    ] })
+  ] });
+}
+export {
+  z as NotFound
+};

package/dist/organisms/NotFound/NotFound.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { NotFound } from './NotFound';
+declare const meta: Meta<typeof NotFound>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Playground: Story;
+export declare const SupportFocused: Story;

package/dist/organisms/NotFound/NotFound.stories.js

@@ -0,0 +1,65 @@
+import { NotFound as o } from "./NotFound.js";
+const e = {
+  title: "Case Parts/Organisms/NotFound",
+  component: o,
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: [
+          "A presentational 404 style page section that shows a friendly message,",
+          "an illustration image, and two prominent calls-to-action implemented with",
+          `LinkButton components.
+`,
+          `
+Usage notes:`,
+          `
+- Use this component on routes that are not found or content that is missing.`,
+          `
+- Provide meaningful primary and secondary actions to help the user recover.`,
+          `
+- Keep labels concise (ideally 2–3 words).`
+        ].join(" ")
+      }
+    }
+  },
+  argTypes: {
+    primaryLinkButtonProps: {
+      control: "object",
+      description: "Primary call-to-action link button (e.g., Go Home). Provide a { label, href } object.",
+      table: {
+        type: { summary: "{ label: string; href: string }" }
+      }
+    },
+    secondaryLinkButtonProps: {
+      control: "object",
+      description: "Secondary link button (e.g., Contact Support). Provide a { label, href } object.",
+      table: {
+        type: { summary: "{ label: string; href: string }" }
+      }
+    }
+  },
+  args: {
+    primaryLinkButtonProps: { label: "Return Home to CaseParts.com", href: "/" },
+    secondaryLinkButtonProps: { label: "Sign In or Go to My Account", href: "/account" }
+  }
+}, n = {
+  name: "Playground"
+}, r = {
+  args: {
+    primaryLinkButtonProps: { label: "Search Products", href: "/search" },
+    secondaryLinkButtonProps: { label: "Support", href: "/support" }
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Variant emphasizing a support-oriented recovery path."
+      }
+    }
+  }
+};
+export {
+  n as Playground,
+  r as SupportFocused,
+  e as default
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@caseparts-org/caseblocks",
   "private": false,
-  "version": "0.0.54",
+  "version": "0.0.56",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",

package/dist/assets/Button.css

@@ -1 +0,0 @@
-._button_1fy9r_1{--inset-shadow-color: var(--surface-surface-primary-btn);--inset-shadow-style: 0 0 0, inset 0 0 0 var(--spacing-0-125) var(--inset-shadow-color);transition-property:background-color,border-width,box-shadow,color;transition-duration:.1s;transition-timing-function:ease-in;padding:var(--spacing-1);border:none;cursor:pointer}._button_1fy9r_1:hover{box-shadow:var(--color-neutrals-neutral-2) var(--spacing-0-125) var(--spacing-0-25) var(--spacing-0-5)}._button_1fy9r_1:active{box-shadow:none}._button_1fy9r_1:disabled{background-color:var(--surface-surface-disabled-btn);color:var(--text-text-invert);transition:none;cursor:default}._button_1fy9r_1:disabled:hover{box-shadow:none}._button-primary_1fy9r_36{background-color:var(--surface-surface-primary-btn);color:var(--surface-surface-primary)}._button-primary_1fy9r_36:active{background-color:var(--color-brand-secondary-dark-teal-blue)}._button-primary_1fy9r_36:active:disabled{background-color:var(--surface-surface-disabled-btn);color:var(--text-text-invert)}._button-secondary_1fy9r_50{background-color:var(--surface-surface-secondary-btn);border:1px solid var(--border-border-secondary-btn);color:var(--text-text-links)}._button-secondary_1fy9r_50:active{--inset-shadow-color: var(--surface-surface-secondary);box-shadow:var(--inset-shadow-style)}._button-secondary_1fy9r_50:disabled{background-color:var(--surface-surface-disabled-btn-focus);color:var(--surface-surface-disabled-btn);--inset-shadow-color: var(--surface-surface-disabled-btn);box-shadow:var(--inset-shadow-style)}._button-secondary_1fy9r_50:disabled:hover{box-shadow:var(--inset-shadow-style)}._button-cta-primary_1fy9r_72{background-color:var(--surface-surface-call-to-action-btn);color:var(--surface-surface-primary)}._button-cta-primary_1fy9r_72:active{background-color:var(--surface-surface-call-to-action-btn-focus)}._button-cta-primary_1fy9r_72:active:disabled{background-color:var(--surface-surface-disabled-btn);color:var(--text-text-invert)}._button-tertiary_1fy9r_86{background-color:var(--surface-surface-tertiary-btn);color:var(--surface-surface-tertiary-btn-focus)}._button-tertiary_1fy9r_86:active{color:var(--surface-surface-disabled-btn);background-color:var(--surface-surface-tertiary-btn-focus);--inset-shadow-color: var(--surface-surface-disabled-btn);box-shadow:var(--inset-shadow-style)}._button-tertiary_1fy9r_86:active:disabled{background-color:var(--surface-surface-disabled-btn);color:var(--text-text-invert)}._button-destructive_1fy9r_104{background-color:var(--surface-surface-error-warning-btn);color:var(--surface-surface-primary)}._button-destructive_1fy9r_104:active{color:var(--surface-surface-error-warning-btn);background-color:var(--surface-surface-tertiary-btn-focus);--inset-shadow-color: var(--border-border-error-warning);box-shadow:var(--inset-shadow-style)}._button-destructive_1fy9r_104:active:disabled{background-color:var(--surface-surface-disabled-btn);color:var(--text-text-invert)}._button-size-xxs_1fy9r_122{border-radius:var(--border-radius-xs);padding:var(--spacing-spacing-4xs) var(--spacing-spacing-4xs)}._button-size-xs_1fy9r_126{border-radius:var(--border-radius-xs);padding:calc(var(--spacing-spacing-4xs) - 1px) var(--spacing-spacing-2xs)}._button-size-sm_1fy9r_130{border-radius:var(--border-radius-sm);padding:calc(var(--spacing-spacing-3xs) - 1px) var(--spacing-0-75)}._button-size-md_1fy9r_134,._button-size-lg_1fy9r_138{border-radius:var(--border-radius-sm);padding:calc(var(--spacing-spacing-2xs) - 1px) var(--spacing-spacing-default)}._button-size-xl_1fy9r_142{border-radius:var(--border-radius-sm);padding:var(--spacing-0-75) var(--spacing-spacing-default)}