@caseparts-org/caseblocks 0.0.119 → 0.0.121

package/dist/atoms/Popover/Popover.d.ts

@@ -7,7 +7,7 @@ export type PopoverAPI = {
 type PositionKeyword = "top" | "right" | "bottom" | "left";
 type Position = "top left" | "top center" | "top right" | "right top" | "right center" | "right bottom" | "bottom left" | "bottom center" | "bottom right" | "left top" | "left center" | "left bottom" | PositionKeyword;
 export type PopoverProps = {
-    trigger: React.ReactElement;
+    trigger: React.ReactElement<any>;
     children: React.ReactNode | ((_api: PopoverAPI) => React.ReactNode);
     position?: Position;
     popoverClassName?: string;

package/dist/atoms/Popover/Popover.js

@@ -1,6 +1,6 @@
 import { jsxs as F, Fragment as H, jsx as k } from "react/jsx-runtime";
 import * as f from "react";
-import { r as N } from "../../index-B4KbmMH3.js";
+import { r as N } from "../../index-BkF-BQ3Q.js";
 import { c as z } from "../../clsx-OuTLNxxd.js";
 import '../../assets/Popover.css';const W = "_popover_vlr81_1", q = "_content_vlr81_7", P = {
   popover: W,

package/dist/atoms/Root/Root.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ReactNode, ReactElement } from 'react';
 export declare function Root({ children }: {
     children: ReactNode;
-}): JSX.Element;
+}): ReactElement;

package/dist/atoms/SlideInPanel/SlideInPanel.js

@@ -1,6 +1,6 @@
 import { jsxs as k, jsx as u } from "react/jsx-runtime";
 import * as r from "react";
-import { r as A } from "../../index-B4KbmMH3.js";
+import { r as A } from "../../index-BkF-BQ3Q.js";
 import { c } from "../../clsx-OuTLNxxd.js";
 import { getHideAtStyles as N } from "../HideAt.js";
 import '../../assets/SlideInPanel.css';const q = "_root_12lt6_1", P = "_overlay_12lt6_8", R = "_panel_12lt6_16", j = "_active_12lt6_52", o = {

package/dist/atoms/Text/Text.d.ts

@@ -1,4 +1,5 @@
 import { HideAtProps } from '../HideAt';
+import { JSX } from 'react';
 type ElementType = keyof Pick<JSX.IntrinsicElements, "span" | "p" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div">;
 /** A text element. */
 export type TextProps<T extends ElementType = "span"> = HideAtProps & {

package/dist/atoms/Tooltip/Tooltip.d.ts

@@ -3,7 +3,7 @@ type PositionKeyword = "top" | "right" | "bottom" | "left";
 type Position = "top left" | "top center" | "top right" | "right top" | "right center" | "right bottom" | "bottom left" | "bottom center" | "bottom right" | "left top" | "left center" | "left bottom" | PositionKeyword;
 export type TooltipProps = {
     children: React.ReactNode;
-    trigger: React.ReactElement;
+    trigger: React.ReactElement<any>;
     tooltipClassName?: string;
     contentClassName?: string;
     position?: Position;

package/dist/atoms/Tooltip/Tooltip.js

@@ -1,7 +1,7 @@
 import { jsxs as W, Fragment as X, jsx as O } from "react/jsx-runtime";
 import * as r from "react";
 import { c as S } from "../../clsx-OuTLNxxd.js";
-import { r as Y } from "../../index-B4KbmMH3.js";
+import { r as Y } from "../../index-BkF-BQ3Q.js";
 import '../../assets/Tooltip.css';const A = "_tooltip_17o7a_1", D = "_content_17o7a_11", j = {
   tooltip: A,
   content: D

package/dist/{index-B4KbmMH3.js → index-BkF-BQ3Q.js}

@@ -140,7 +140,7 @@ function R() {
     return y.H.useFormState(n, r, a);
   }, c.useFormStatus = function() {
     return y.H.useHostTransitionStatus();
-  }, c.version = "19.1.1", c;
+  }, c.version = "19.2.3", c;
 }
 var s = {};
 /**
@@ -362,7 +362,7 @@ See https://react.dev/link/invalid-hook-call for tips about how to debug and fix
       return y().useFormState(t, e, i);
     }, s.useFormStatus = function() {
       return y().useHostTransitionStatus();
-    }, s.version = "19.1.1", typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
+    }, s.version = "19.2.3", typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
   }()), s;
 }
 function E() {

package/dist/main-client.d.ts

@@ -24,6 +24,8 @@ export { AddToCart } from './molecules/AddToCart/AddToCart';
 export type { CategoryWithChildren as MainCategory, Category } from './molecules/CategoryNav/CategoryNav';
 export { Modal } from './molecules/Modal/Modal';
 export type { ModalProps } from './molecules/Modal/Modal';
+export { ImageViewer } from './molecules/ImageViewer/ImageViewer';
+export type { ImageViewerProps } from './molecules/ImageViewer/ImageViewer';
 export { MainNav } from './organisms/MainNav/MainNav';
 export type { MainNavProps } from './organisms/MainNav/MainNav';
 export { ChipSelector } from './organisms/ChipSelector/ChipSelector';
@@ -34,3 +36,5 @@ export { Carousel } from './organisms/Carousel/Carousel';
 export type { CarouselProps } from './organisms/Carousel/Carousel';
 export { Footer } from './organisms/Footer/Footer';
 export type { FooterProps } from './organisms/Footer/Footer';
+export { SpinZoomViewer } from './organisms/SpinZoomViewer/SpinZoomViewer';
+export type { SpinZoomViewerProps } from './organisms/SpinZoomViewer/SpinZoomViewer';

package/dist/main-client.js

@@ -5,23 +5,23 @@ import { Head as n } from "./atoms/Root/Head.js";
 import { Icon as l } from "./atoms/Icon/Icon.js";
 import { Root as d } from "./atoms/Root/Root.js";
 import { Separator as C } from "./atoms/Separator/Separator.js";
-import { Text as k } from "./atoms/Text/Text.js";
-import { Input as B } from "./atoms/Input/Input.js";
-import { Link as v } from "./atoms/Link/Link.js";
-import { linkClassName as L } from "./atoms/Link/linkClassName.js";
-import { configureLink as h, routerOverride as s } from "./atoms/Link/configureLink.js";
-import { LinkButton as F } from "./atoms/LinkButton/LinkButton.js";
-import { configureImage as N } from "./atoms/Image/configureImage.js";
-import { Logo as y } from "./molecules/Logo/Logo.js";
-import { SearchBox as w } from "./molecules/SearchBox/SearchBox.js";
-import { QuantityInput as G } from "./molecules/QuantityInput/QuantityInput.js";
-import { Pricing as Q } from "./molecules/Pricing/Pricing.js";
-import { Availability as V } from "./molecules/Availability/Availability.js";
-import { Avatar as q } from "./molecules/Avatar/Avatar.js";
-import { BannerCard as E } from "./molecules/BannerCard/BannerCard.js";
-import { CardLink as K } from "./molecules/CardLink/CardLink.js";
-import { Breadcrumbs as W } from "./molecules/Breadcrumbs/Breadcrumbs.js";
-import { NotFound as Y } from "./organisms/NotFound/NotFound.js";
+import { Text as S } from "./atoms/Text/Text.js";
+import { Input as I } from "./atoms/Input/Input.js";
+import { Link as s } from "./atoms/Link/Link.js";
+import { linkClassName as A } from "./atoms/Link/linkClassName.js";
+import { configureLink as P, routerOverride as h } from "./atoms/Link/configureLink.js";
+import { LinkButton as w } from "./atoms/LinkButton/LinkButton.js";
+import { configureImage as M } from "./atoms/Image/configureImage.js";
+import { Logo as V } from "./molecules/Logo/Logo.js";
+import { SearchBox as y } from "./molecules/SearchBox/SearchBox.js";
+import { QuantityInput as z } from "./molecules/QuantityInput/QuantityInput.js";
+import { Pricing as O } from "./molecules/Pricing/Pricing.js";
+import { Availability as R } from "./molecules/Availability/Availability.js";
+import { Avatar as j } from "./molecules/Avatar/Avatar.js";
+import { BannerCard as D } from "./molecules/BannerCard/BannerCard.js";
+import { CardLink as J } from "./molecules/CardLink/CardLink.js";
+import { Breadcrumbs as U } from "./molecules/Breadcrumbs/Breadcrumbs.js";
+import { NotFound as X } from "./organisms/NotFound/NotFound.js";
 import { HorizontalScroll as _ } from "./atoms/HorizontalScroll/HorizontalScroll.js";
 import { SlideInPanel as oo } from "./atoms/SlideInPanel/SlideInPanel.js";
 import { Tooltip as eo } from "./atoms/Tooltip/Tooltip.js";
@@ -31,28 +31,30 @@ import { Chip as ao } from "./molecules/Chip/Chip.js";
 import { ToggleView as io } from "./molecules/ToggleView/ToggleView.js";
 import { CartSlideInPanel as uo } from "./molecules/Cart/CartSlideInPanel.js";
 import { StatefulButton as Co } from "./molecules/StatefulButton/StatefulButton.js";
-import { AnimatedCheckMark as ko } from "./molecules/StatefulButton/AnimatedCheckmark.js";
-import { AddToCart as Bo } from "./molecules/AddToCart/AddToCart.js";
-import { Modal as vo } from "./molecules/Modal/Modal.js";
-import { MainNav as Lo } from "./organisms/MainNav/MainNav.js";
-import { ChipSelector as ho } from "./organisms/ChipSelector/ChipSelector.js";
-import { Product as To } from "./organisms/Product/Product.js";
-import { Carousel as Mo } from "./organisms/Carousel/Carousel.js";
+import { AnimatedCheckMark as So } from "./molecules/StatefulButton/AnimatedCheckmark.js";
+import { AddToCart as Io } from "./molecules/AddToCart/AddToCart.js";
+import { Modal as so } from "./molecules/Modal/Modal.js";
+import { ImageViewer as Ao } from "./molecules/ImageViewer/ImageViewer.js";
+import { MainNav as Po } from "./organisms/MainNav/MainNav.js";
+import { ChipSelector as To } from "./organisms/ChipSelector/ChipSelector.js";
+import { Product as Fo } from "./organisms/Product/Product.js";
+import { Carousel as No } from "./organisms/Carousel/Carousel.js";
 import { Footer as bo } from "./organisms/Footer/Footer.js";
+import { default as Ho } from "./organisms/SpinZoomViewer/SpinZoomViewer.js";
 export {
   fo as Account,
-  Bo as AddToCart,
-  ko as AnimatedCheckMark,
-  V as Availability,
-  q as Avatar,
-  E as BannerCard,
-  W as Breadcrumbs,
+  Io as AddToCart,
+  So as AnimatedCheckMark,
+  R as Availability,
+  j as Avatar,
+  D as BannerCard,
+  U as Breadcrumbs,
   e as Button,
-  K as CardLink,
-  Mo as Carousel,
+  J as CardLink,
+  No as Carousel,
   uo as CartSlideInPanel,
   ao as Chip,
-  ho as ChipSelector,
+  To as ChipSelector,
   f as Column,
   p as Flex,
   bo as Footer,
@@ -60,27 +62,29 @@ export {
   n as Head,
   _ as HorizontalScroll,
   l as Icon,
-  B as Input,
-  v as Link,
-  F as LinkButton,
-  y as Logo,
-  Lo as MainNav,
-  vo as Modal,
-  Y as NotFound,
+  Ao as ImageViewer,
+  I as Input,
+  s as Link,
+  w as LinkButton,
+  V as Logo,
+  Po as MainNav,
+  so as Modal,
+  X as NotFound,
   po as Popover,
-  Q as Pricing,
-  To as Product,
-  G as QuantityInput,
+  O as Pricing,
+  Fo as Product,
+  z as QuantityInput,
   d as Root,
-  w as SearchBox,
+  y as SearchBox,
   C as Separator,
   oo as SlideInPanel,
+  Ho as SpinZoomViewer,
   Co as StatefulButton,
-  k as Text,
+  S as Text,
   io as ToggleView,
   eo as Tooltip,
-  N as configureImage,
-  h as configureLink,
-  L as linkClassName,
-  s as routerOverride
+  M as configureImage,
+  P as configureLink,
+  A as linkClassName,
+  h as routerOverride
 };

package/dist/molecules/Account/Account.js

@@ -1,4 +1,4 @@
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { jsx as n, jsxs as t } from "react/jsx-runtime";
 import { getHideAtStyles as m } from "../../atoms/HideAt.js";
 import { Icon as f } from "../../atoms/Icon/Icon.js";
 import { Text as c } from "../../atoms/Text/Text.js";
@@ -16,7 +16,7 @@ function y(i) {
   return i.account !== void 0;
 }
 function j(i) {
-  return i.isAccountLoading ? /* @__PURE__ */ t("div", { className: o.placeholder }) : y(i) ? /* @__PURE__ */ t(_, { ...i }) : /* @__PURE__ */ t(N, { ...i });
+  return i.isAccountLoading ? /* @__PURE__ */ n("div", { className: o.placeholder }) : y(i) ? /* @__PURE__ */ n(_, { ...i }) : /* @__PURE__ */ n(N, { ...i });
 }
 function _(i) {
   const {
@@ -27,17 +27,17 @@ function _(i) {
     isAccountLoading: h,
     ...l
   } = i;
-  return a ? /* @__PURE__ */ t(
+  return a ? /* @__PURE__ */ n(
     A,
     {
       position: "bottom right",
-      trigger: /* @__PURE__ */ n(
+      trigger: /* @__PURE__ */ t(
         "div",
         {
           className: g(o.loggedIn, m(s), r),
           ...l,
           children: [
-            /* @__PURE__ */ n(
+            /* @__PURE__ */ t(
               d,
               {
                 flexDirection: "column",
@@ -45,30 +45,30 @@ function _(i) {
                 hideAt: ["sm", "md"],
                 className: o.customer,
                 children: [
-                  /* @__PURE__ */ n(c, { size: "xxs", children: [
+                  /* @__PURE__ */ t(c, { size: "xxs", children: [
                     "Acct: ",
                     e == null ? void 0 : e.number
                   ] }),
-                  /* @__PURE__ */ n(c, { size: "sm", variant: "display", colorToken: "links", children: [
+                  /* @__PURE__ */ t(c, { size: "sm", variant: "display", colorToken: "links", children: [
                     "Hello ",
                     e == null ? void 0 : e.name
                   ] })
                 ]
               }
             ),
-            e.avatar ?? (e.initials ? /* @__PURE__ */ t(u, { initials: e.initials }) : null)
+            e.avatar ?? (e.initials ? /* @__PURE__ */ n(u, { initials: e.initials }) : null)
           ]
         }
       ),
       children: a
     }
-  ) : /* @__PURE__ */ n(
+  ) : /* @__PURE__ */ t(
     "div",
     {
       className: g(o.loggedIn, m(s), r),
       ...l,
       children: [
-        /* @__PURE__ */ n(
+        /* @__PURE__ */ t(
           d,
           {
             flexDirection: "column",
@@ -76,18 +76,15 @@ function _(i) {
             hideAt: ["sm", "md"],
             className: o.customer,
             children: [
-              /* @__PURE__ */ n(c, { size: "xxs", children: [
-                "Acct: ",
-                e == null ? void 0 : e.number
-              ] }),
-              /* @__PURE__ */ n(c, { size: "sm", variant: "display", colorToken: "links", children: [
+              /* @__PURE__ */ n(c, { size: "xxs", children: e == null ? void 0 : e.number }),
+              /* @__PURE__ */ t(c, { size: "sm", variant: "display", colorToken: "links", children: [
                 "Hello ",
                 e == null ? void 0 : e.name
               ] })
             ]
           }
         ),
-        e.avatar ?? (e.initials ? /* @__PURE__ */ t(u, { initials: e.initials }) : null)
+        e.avatar ?? (e.initials ? /* @__PURE__ */ n(u, { initials: e.initials }) : null)
       ]
     }
   );
@@ -101,7 +98,7 @@ function N(i) {
     isAccountLoading: h,
     ...l
   } = i;
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ t(
     d,
     {
       flexDirection: "row",
@@ -113,7 +110,7 @@ function N(i) {
         r
       ),
       children: [
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ n(
           p,
           {
             onClick: e,
@@ -123,7 +120,7 @@ function N(i) {
             children: "Sign In / Register"
           }
         ),
-        /* @__PURE__ */ t(f, { iconKey: "fa-kit fa-user-anon", size: "lg", hideAt: "lg" })
+        /* @__PURE__ */ n(f, { iconKey: "fa-kit fa-user-anon", size: "lg", hideAt: "lg" })
       ]
     }
   );

package/dist/molecules/ImageViewer/ImageViewer.d.ts

@@ -0,0 +1,8 @@
+export interface ImageViewerProps {
+    imgSrc: string;
+    zoomFactor?: number;
+    minZoomScale?: number;
+    maxZoomScale?: number;
+}
+export declare function ImageViewer({ imgSrc, zoomFactor, // Default 10% per wheel notch
+minZoomScale, maxZoomScale, }: ImageViewerProps): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/ImageViewer/ImageViewer.js

@@ -0,0 +1,123 @@
+import { jsx as U } from "react/jsx-runtime";
+import { useRef as o, useEffect as Q } from "react";
+function Z({
+  imgSrc: j,
+  zoomFactor: O = 1.1,
+  // Default 10% per wheel notch
+  minZoomScale: x = 1,
+  maxZoomScale: z = 5
+  // 500%
+}) {
+  const D = o(null), a = o(null), d = o(null), h = o(1), g = o(0), p = o(0), P = o(null), y = o(!1), A = o(0), b = o(0), W = o(0), B = o(0), R = o(!1), u = o(/* @__PURE__ */ new Map()), T = o(0), q = o(1), L = o({ x: 0, y: 0 });
+  Q(() => {
+    const t = a.current, n = D.current;
+    if (!t || !n) return;
+    const s = () => {
+      const e = n.getBoundingClientRect();
+      t.height = e.height, t.width = e.width;
+      const c = t.getContext("2d");
+      c && (c.setTransform(1, 0, 0, 1, 0, 0), d.current = c, k());
+    };
+    s();
+    const r = new ResizeObserver(s);
+    return r.observe(n), s(), () => r.disconnect();
+  }, []);
+  const k = () => {
+    const t = a.current;
+    if (!d.current || !t) return;
+    d.current.clearRect(0, 0, t.width, t.height);
+    const n = new Image();
+    n.crossOrigin = "anonymous", n.src = j, n.onload = () => {
+      P.current = n, Y();
+    };
+  }, Y = () => {
+    const t = a.current, n = P.current;
+    if (!d.current || !t || !n) return;
+    const s = n.width / 2, r = n.height / 2, e = t.width / 2, c = t.height / 2, i = e - s, f = c - r;
+    h.current = 1, g.current = i, p.current = f, v();
+  }, E = (t) => {
+    const n = a.current;
+    if (!d.current || !n) return;
+    const s = t.deltaY < 0 ? O : 1 / O, r = h.current;
+    let e = r * s;
+    if (e = Math.max(x, Math.min(z, e)), h.current = e, e === x) {
+      Y();
+      return;
+    }
+    const { x: c, y: i } = X(t, n), f = (c - g.current) / r, w = (i - p.current) / r, m = c - f * e, l = i - w * e;
+    g.current = m, p.current = l, v();
+  }, H = (t) => {
+    var r;
+    const n = a.current;
+    if (!d.current || !n) return;
+    (r = a.current) == null || r.setPointerCapture(t.pointerId);
+    const s = X(t, n);
+    if (u.current.set(t.pointerId, s), u.current.size === 2) {
+      R.current = !0, y.current = !1;
+      const [e, c] = Array.from(u.current.values()), i = e.x - c.x, f = e.y - c.y, w = Math.sqrt(i * i + f * f);
+      T.current = w, q.current = h.current;
+      const m = (e.x + c.x) / 2, l = (e.y + c.y) / 2, M = (m - g.current) / h.current, C = (l - p.current) / h.current;
+      L.current = { x: M, y: C }, R.current = !0;
+    } else if (u.current.size === 1) {
+      const [e] = Array.from(u.current.values());
+      A.current = e.x, b.current = e.y, W.current = g.current, B.current = p.current, y.current = !0;
+    }
+  }, S = (t) => {
+    const n = a.current;
+    if (!d.current || !n) return;
+    const s = X(t, n);
+    if (u.current.has(t.pointerId)) {
+      if (u.current.set(t.pointerId, s), R.current && u.current.size === 2) {
+        const [r, e] = Array.from(u.current.values()), c = r.x - e.x, i = r.y - e.y, f = Math.sqrt(c * c + i * i), w = T.current;
+        if (w === 0) return;
+        const m = f / w;
+        let l = q.current * m;
+        if (l = Math.max(x, Math.min(z, l)), l === x) {
+          Y();
+          return;
+        }
+        const M = (r.x + e.x) / 2, C = (r.y + e.y) / 2, { x: G, y: J } = L.current, K = M - G * l, N = C - J * l;
+        h.current = l, g.current = K, p.current = N, v();
+      } else if (y.current && u.current.size === 1) {
+        const r = n.getBoundingClientRect(), e = t.clientX - r.left, c = t.clientY - r.top, i = e - A.current, f = c - b.current;
+        g.current = W.current + i, p.current = B.current + f, v();
+      }
+    }
+  }, I = (t) => {
+    u.current.delete(t.pointerId), u.current.size < 2 && (R.current = !1), u.current.size === 0 && (y.current = !1);
+    const n = a.current;
+    !d.current || !n || n.releasePointerCapture(t.pointerId);
+  }, V = I, F = I, X = (t, n) => {
+    const s = n.getBoundingClientRect();
+    return {
+      x: t.clientX - s.left,
+      y: t.clientY - s.top
+    };
+  }, v = () => {
+    const t = a.current, n = d.current, s = P.current;
+    !t || !n || !s || (n.setTransform(1, 0, 0, 1, 0, 0), n.clearRect(0, 0, t.width, t.height), n.setTransform(
+      h.current,
+      0,
+      0,
+      h.current,
+      g.current,
+      p.current
+    ), n.drawImage(s, 0, 0));
+  };
+  return /* @__PURE__ */ U("div", { ref: D, style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ U(
+    "canvas",
+    {
+      ref: a,
+      style: { width: "100%", height: "100%", display: "block", touchAction: "none" },
+      onWheel: E,
+      onPointerDown: H,
+      onPointerMove: S,
+      onPointerUp: I,
+      onPointerLeave: V,
+      onPointerCancel: F
+    }
+  ) });
+}
+export {
+  Z as ImageViewer
+};

package/dist/molecules/ImageViewer/ImageViewer.stories.d.ts

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

package/dist/molecules/ImageViewer/ImageViewer.stories.js

@@ -0,0 +1,30 @@
+import { jsx as e } from "react/jsx-runtime";
+import { ImageViewer as o } from "./ImageViewer.js";
+const r = {
+  title: "Case Parts/Molecules/ImageViewer",
+  component: o,
+  parameters: {
+    layout: "fullscreen"
+  },
+  argTypes: {
+    imgSrc: { control: "text" },
+    zoomFactor: { control: { type: "number", min: 1, max: 2, step: 0.01 } },
+    minZoomScale: { control: { type: "number", min: 0.1, max: 2, step: 0.1 } },
+    maxZoomScale: { control: { type: "number", min: 2, max: 10, step: 0.5 } }
+  },
+  decorators: [
+    (t) => /* @__PURE__ */ e("div", { style: { height: "90dvh", width: "100%" }, children: /* @__PURE__ */ e(t, {}) })
+  ]
+}, c = {
+  name: "Default",
+  args: {
+    imgSrc: "https://cdnimg.webstaurantstore.com/images/products/large/573147/2989461.jpg",
+    zoomFactor: 1.1,
+    minZoomScale: 1,
+    maxZoomScale: 5
+  }
+};
+export {
+  c as Default,
+  r as default
+};

package/dist/molecules/Logo/Logo.stories.d.ts

@@ -59,6 +59,10 @@ declare const meta: {
         results?: number | undefined;
         security?: string | undefined;
         unselectable?: "on" | "off" | undefined;
+        popover?: "" | "auto" | "manual" | "hint" | undefined;
+        popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+        popoverTarget?: string | undefined;
+        inert?: boolean | undefined;
         inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
         is?: string | undefined;
         exportparts?: string | undefined;
@@ -268,6 +272,8 @@ declare const meta: {
         onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
         onScroll?: import('react').UIEventHandler<HTMLDivElement> | undefined;
         onScrollCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollEnd?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollEndCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
         onWheel?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
         onWheelCapture?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
         onAnimationStart?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
@@ -276,8 +282,16 @@ declare const meta: {
         onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
         onAnimationIteration?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
         onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
+        onBeforeToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
+        onTransitionCancel?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionCancelCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
         onTransitionEnd?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
         onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionRun?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionRunCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionStart?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionStartCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
     }>, context: import('storybook/internal/csf').StoryContext<import('@storybook/react').ReactRenderer, {
         variant?: ("color" | "white") | undefined;
         defaultChecked?: boolean | undefined;
@@ -327,6 +341,10 @@ declare const meta: {
         results?: number | undefined;
         security?: string | undefined;
         unselectable?: "on" | "off" | undefined;
+        popover?: "" | "auto" | "manual" | "hint" | undefined;
+        popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+        popoverTarget?: string | undefined;
+        inert?: boolean | undefined;
         inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
         is?: string | undefined;
         exportparts?: string | undefined;
@@ -536,6 +554,8 @@ declare const meta: {
         onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
         onScroll?: import('react').UIEventHandler<HTMLDivElement> | undefined;
         onScrollCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollEnd?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollEndCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
         onWheel?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
         onWheelCapture?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
         onAnimationStart?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
@@ -544,8 +564,16 @@ declare const meta: {
         onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
         onAnimationIteration?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
         onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
+        onBeforeToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
+        onTransitionCancel?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionCancelCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
         onTransitionEnd?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
         onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionRun?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionRunCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionStart?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionStartCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];
 };
 export default meta;

package/dist/molecules/ToggleView/ToggleView.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 import { HideAtProps } from '../../atoms/HideAt';
-export interface ToggleViewProps extends React.HTMLAttributes<HTMLDivElement>, HideAtProps {
+export interface ToggleViewProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onToggle">, HideAtProps {
     selectedId: string | number;
     onToggle: (id: string | number) => void;
     className?: string;

package/dist/organisms/SpinZoomViewer/SpinZoomViewer.d.ts

@@ -1,5 +1,5 @@
 import { default as React, CSSProperties, ComponentType } from 'react';
-type SpinZoom360Props = {
+export type SpinZoomViewerProps = {
     images: string[];
     defaultIndex?: number;
     disableSpin?: boolean;
@@ -16,5 +16,6 @@ type SpinZoom360Props = {
         src: string;
     }) => void;
 };
-declare const SpinZoomViewer: React.FC<SpinZoom360Props>;
+declare const SpinZoomViewer: React.FC<SpinZoomViewerProps>;
 export default SpinZoomViewer;
+export { SpinZoomViewer };

package/dist/organisms/SpinZoomViewer/SpinZoomViewer.js

@@ -288,5 +288,6 @@ const ut = 4, dt = ({
   );
 };
 export {
+  dt as SpinZoomViewer,
   dt as default
 };