@vkzstudio/muza-ui 1.2.0 → 1.4.0

package/dist/components/OfferCard/OfferCard.js

@@ -0,0 +1,423 @@
+import { jsx as e, jsxs as r, Fragment as D } from "react/jsx-runtime";
+import * as w from "react";
+import { cva as z } from "class-variance-authority";
+import { HeartButton as Q } from "../HeartButton/HeartButton.js";
+import { Rating as U } from "../Rating/Rating.js";
+import { cn as s } from "../../utils/cn.js";
+import { Typography as n } from "../Typography/Typography.js";
+import { disabledLinkProps as X } from "../../utils/disabledLinkProps.js";
+import { Tag as Z } from "../Tag/Tag.js";
+import { Flex as f } from "../Flex/Flex.js";
+import { DotDivider as ee } from "../DotDivider/DotDivider.js";
+import { Skeleton as o } from "../Skeleton/Skeleton.js";
+const ae = z(
+  "group relative inline-flex border border-solid transition-colors focus-visible:outline-none data-[disabled=true]:pointer-events-none",
+  {
+    variants: {
+      variant: {
+        compact: "flex-col overflow-hidden rounded-comp-offer-card-compact-radius border-comp-offer-card-stroke-default has-[a:focus-visible]:border-comp-offer-card-stroke-focused has-[a:hover]:border-comp-offer-card-stroke-hover data-[disabled=true]:border-comp-offer-card-stroke-disabled",
+        search: "flex-row gap-comp-offer-card-search-gap border-transparent"
+      },
+      type: {
+        default: "",
+        promo: ""
+      }
+    },
+    compoundVariants: [
+      {
+        variant: "compact",
+        type: "default",
+        class: "bg-comp-offer-card-fill-def-default has-[a:focus-visible]:bg-comp-offer-card-fill-def-focused has-[a:hover]:bg-comp-offer-card-fill-def-hover data-[disabled=true]:bg-comp-offer-card-fill-def-disabled"
+      },
+      {
+        variant: "compact",
+        type: "promo",
+        class: "bg-comp-offer-card-fill-promo-default has-[a:focus-visible]:bg-comp-offer-card-fill-promo-focused has-[a:hover]:bg-comp-offer-card-fill-promo-hover data-[disabled=true]:bg-comp-offer-card-fill-promo-disabled"
+      }
+    ],
+    defaultVariants: { variant: "compact", type: "default" }
+  }
+), re = z("", {
+  variants: {
+    variant: {
+      compact: "text-text-dark-primary-def group-has-[a:focus-visible]:text-text-brand-focused group-has-[a:hover]:text-text-brand-hover group-data-[disabled=true]:text-text-dark-disabled",
+      search: "text-text-dark-primary-def group-has-[a:focus-visible]:text-text-brand-focused group-has-[a:hover]:text-text-brand-hover group-data-[disabled=true]:text-text-dark-disabled"
+    }
+  },
+  defaultVariants: { variant: "compact" }
+}), oe = z("", {
+  variants: {
+    variant: {
+      compact: "mt-auto line-clamp-1 text-text-dark-secondary group-has-[a:focus-visible]:text-text-brand-focused group-data-[disabled=true]:text-text-dark-disabled",
+      search: "line-clamp-1 text-text-dark-secondary group-has-[a:focus-visible]:text-text-brand-focused group-data-[disabled=true]:text-text-dark-disabled"
+    }
+  },
+  defaultVariants: { variant: "compact" }
+}), k = ({ rating: c, ratingCount: a, disabled: t }) => /* @__PURE__ */ r(f, { align: "center", gap: "2xs", children: [
+  /* @__PURE__ */ e(U, { value: c, allowHalf: !0, disabled: t }),
+  a != null && /* @__PURE__ */ r(
+    n,
+    {
+      component: "span",
+      variant: "body",
+      size: "sm",
+      weight: "regular",
+      fixY: !0,
+      className: s(
+        t ? "text-text-dark-disabled" : "text-text-dark-primary-def"
+      ),
+      children: [
+        "(",
+        a,
+        ")"
+      ]
+    }
+  )
+] });
+k.displayName = "OfferCard.RatingRow";
+const E = ({
+  variant: c = "compact",
+  color: a = "default",
+  type: t = "default",
+  className: l,
+  ...m
+}) => c === "compact" ? /* @__PURE__ */ r(
+  "div",
+  {
+    className: s(
+      "inline-flex flex-col overflow-hidden rounded-comp-offer-card-compact-radius border border-solid border-comp-offer-card-stroke-default",
+      t === "promo" ? "bg-comp-offer-card-fill-promo-default" : "bg-comp-offer-card-fill-def-default",
+      l
+    ),
+    ...m,
+    children: [
+      /* @__PURE__ */ r("div", { className: "relative aspect-[288/162] w-full shrink-0 overflow-hidden", children: [
+        /* @__PURE__ */ e(
+          o,
+          {
+            color: a,
+            className: "absolute inset-0 size-full rounded-none"
+          }
+        ),
+        /* @__PURE__ */ r("div", { className: "absolute top-comp-offer-card-compact-p-img right-comp-offer-card-compact-p-img left-comp-offer-card-compact-p-img flex items-center justify-between", children: [
+          /* @__PURE__ */ e(
+            o,
+            {
+              color: a,
+              className: "h-comp-tag-h-def w-16 rounded-full"
+            }
+          ),
+          /* @__PURE__ */ e(
+            o,
+            {
+              color: a,
+              className: "size-comp-button-h-xs rounded-full"
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ r(
+        f,
+        {
+          direction: "column",
+          flex: 1,
+          gap: "2xs",
+          className: "px-comp-offer-card-compact-p pt-comp-offer-card-compact-p-top pb-comp-offer-card-compact-p",
+          children: [
+            /* @__PURE__ */ e(o, { color: a, className: "h-5 w-full" }),
+            /* @__PURE__ */ e(o, { color: a, className: "h-5 w-3/4" }),
+            /* @__PURE__ */ e(o, { color: a, className: "mt-2xs h-4 w-32" }),
+            /* @__PURE__ */ e(o, { color: a, className: "mt-2xs h-4 w-24" })
+          ]
+        }
+      )
+    ]
+  }
+) : /* @__PURE__ */ r(
+  "div",
+  {
+    className: s(
+      "inline-flex flex-row gap-comp-offer-card-search-gap",
+      l
+    ),
+    ...m,
+    children: [
+      /* @__PURE__ */ r("div", { className: "relative h-comp-offer-card-search-h-img w-comp-offer-card-search-w-img shrink-0 overflow-hidden rounded-comp-offer-card-search-radius-img", children: [
+        /* @__PURE__ */ e(
+          o,
+          {
+            color: a,
+            className: "absolute inset-0 size-full rounded-none"
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "absolute top-comp-offer-card-search-p-img left-comp-offer-card-search-p-img", children: /* @__PURE__ */ e(
+          o,
+          {
+            color: a,
+            className: "size-comp-button-h-xs rounded-full"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ r(
+        f,
+        {
+          direction: "column",
+          flex: 1,
+          gap: "sm",
+          className: "min-w-0 gap-comp-offer-card-search-gap-text pt-comp-offer-card-search-p-top-text",
+          children: [
+            /* @__PURE__ */ e(o, { color: a, className: "h-5 w-full" }),
+            /* @__PURE__ */ e(o, { color: a, className: "h-4 w-40" }),
+            /* @__PURE__ */ e(o, { color: a, className: "h-4 w-32" })
+          ]
+        }
+      )
+    ]
+  }
+);
+E.displayName = "OfferCard.Skeleton";
+const y = ({
+  image: c,
+  alt: a,
+  wrapperClassName: t,
+  children: l
+}) => /* @__PURE__ */ r("div", { className: t, children: [
+  /* @__PURE__ */ e(
+    "div",
+    {
+      className: s(
+        "absolute inset-0 overflow-hidden",
+        "[&>img]:size-full [&>img]:object-cover",
+        "transition-transform duration-300 ease-out group-hover:scale-110",
+        "group-data-[disabled=true]:opacity-50",
+        "group-data-[disabled=true]:grayscale",
+        "group-data-[disabled=true]:group-hover:scale-100"
+      ),
+      children: typeof c == "string" ? /* @__PURE__ */ e("img", { src: c, alt: a }) : c
+    }
+  ),
+  l
+] });
+y.displayName = "OfferCard.ImageSlot";
+const L = w.forwardRef(
+  (c, a) => {
+    const {
+      name: t,
+      image: l,
+      imageAlt: m,
+      logo: i,
+      logoAlt: T,
+      category: C,
+      description: p,
+      vendor: u,
+      rating: b,
+      ratingCount: j,
+      favorite: B,
+      defaultFavorite: O,
+      onFavoriteChange: h,
+      favoriteAriaLabel: H,
+      showFavorite: P = !0,
+      variant: g = "compact",
+      type: W = "default",
+      disabled: d = !1,
+      asChild: _ = !1,
+      href: $,
+      className: q,
+      children: v,
+      ...G
+    } = c, R = m ?? t, V = T ?? `${u ?? t} logo`, J = re({ variant: g }), S = oe({ variant: g }), x = b != null, K = s(
+      ae({ variant: g, type: W }),
+      q
+    ), A = 'outline-none after:absolute after:inset-0 after:rounded-[inherit] after:content-[""] focus-visible:outline-none', F = /* @__PURE__ */ e(
+      n,
+      {
+        component: "h3",
+        variant: "title",
+        size: "base",
+        weight: "medium",
+        className: s("line-clamp-2", J),
+        children: t
+      }
+    ), I = _ && w.isValidElement(v) ? w.cloneElement(
+      v,
+      {
+        className: s(A, v.props.className),
+        ...d ? X : null
+      },
+      F
+    ) : /* @__PURE__ */ e("a", { href: d ? void 0 : $, className: A, children: F }), Y = P && /* @__PURE__ */ e(
+      Q,
+      {
+        active: B,
+        defaultActive: O,
+        onClick: h !== void 0 || O !== void 0 ? (se, M) => h == null ? void 0 : h(M) : void 0,
+        "aria-label": H,
+        disabled: d,
+        className: "relative z-10"
+      }
+    );
+    let N = null;
+    return g === "compact" ? N = /* @__PURE__ */ r(D, { children: [
+      /* @__PURE__ */ r("div", { className: "relative w-full shrink-0", children: [
+        /* @__PURE__ */ r(
+          y,
+          {
+            image: l,
+            alt: R,
+            wrapperClassName: "relative aspect-[288/162] w-full overflow-hidden",
+            children: [
+              /* @__PURE__ */ e(
+                "div",
+                {
+                  "aria-hidden": "true",
+                  className: "absolute inset-0 bg-gradient-to-t from-black/0 from-50% to-black/70"
+                }
+              ),
+              /* @__PURE__ */ r("div", { className: "absolute top-comp-offer-card-compact-p-img right-comp-offer-card-compact-p-img left-comp-offer-card-compact-p-img flex items-start justify-between gap-sm", children: [
+                C ? /* @__PURE__ */ e(
+                  Z,
+                  {
+                    variant: "invert",
+                    className: "min-w-[50px] shrink overflow-hidden",
+                    children: C
+                  }
+                ) : /* @__PURE__ */ e("span", {}),
+                Y
+              ] })
+            ]
+          }
+        ),
+        i && /* @__PURE__ */ e(
+          "div",
+          {
+            className: s(
+              "pointer-events-none absolute bottom-comp-offer-card-compact-logo-y left-comp-offer-card-compact-logo-x z-10 size-comp-offer-card-compact-logo-size overflow-hidden rounded-full border-2 border-stroke-base-secondary bg-comp-offer-card-fill-def-default",
+              "[&>img]:size-full [&>img]:object-cover",
+              "group-data-[disabled=true]:grayscale"
+            ),
+            children: typeof i == "string" ? /* @__PURE__ */ e("img", { src: i, alt: V }) : i
+          }
+        )
+      ] }),
+      /* @__PURE__ */ r(
+        f,
+        {
+          direction: "column",
+          flex: 1,
+          gap: "2xs",
+          className: "px-comp-offer-card-compact-p pt-comp-offer-card-compact-p-top pb-comp-offer-card-compact-p",
+          children: [
+            I,
+            x && /* @__PURE__ */ e(
+              k,
+              {
+                rating: b,
+                ratingCount: j,
+                disabled: d
+              }
+            ),
+            p && /* @__PURE__ */ e(
+              n,
+              {
+                component: "span",
+                variant: "body",
+                size: "sm",
+                weight: "regular",
+                fixY: !0,
+                className: S,
+                children: p
+              }
+            )
+          ]
+        }
+      )
+    ] }) : N = /* @__PURE__ */ r(D, { children: [
+      /* @__PURE__ */ r(
+        y,
+        {
+          image: l,
+          alt: R,
+          wrapperClassName: "relative shrink-0 overflow-hidden rounded-comp-offer-card-search-radius-img h-comp-offer-card-search-h-img w-comp-offer-card-search-w-img",
+          children: [
+            /* @__PURE__ */ e(
+              "div",
+              {
+                "aria-hidden": "true",
+                className: "absolute inset-0 bg-gradient-to-b from-black/50 to-black/0 to-50%"
+              }
+            ),
+            i && /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-surface-base-overlay", children: /* @__PURE__ */ e("div", { className: "size-comp-offer-card-search-logo-size overflow-hidden rounded-full border-(length:--spacing-comp-offer-card-search-logo-stroke) border-solid border-stroke-base-secondary group-data-[disabled=true]:grayscale [&>img]:size-full [&>img]:object-cover", children: typeof i == "string" ? /* @__PURE__ */ e("img", { src: i, alt: V }) : i }) }),
+            /* @__PURE__ */ e("div", { className: "absolute top-comp-offer-card-search-p-img left-comp-offer-card-search-p-img", children: Y })
+          ]
+        }
+      ),
+      /* @__PURE__ */ r(
+        f,
+        {
+          direction: "column",
+          flex: 1,
+          className: "min-w-0 gap-comp-offer-card-search-gap-text pt-comp-offer-card-search-p-top-text",
+          children: [
+            I,
+            /* @__PURE__ */ r(f, { align: "center", gap: "sm", wrap: "wrap", children: [
+              u && /* @__PURE__ */ e(
+                n,
+                {
+                  component: "span",
+                  variant: "body",
+                  size: "base",
+                  weight: "regular",
+                  fixY: !0,
+                  className: s(
+                    d ? "text-text-dark-disabled" : "text-text-dark-primary-def"
+                  ),
+                  children: u
+                }
+              ),
+              u && x && /* @__PURE__ */ e(ee, {}),
+              x && /* @__PURE__ */ e(
+                k,
+                {
+                  rating: b,
+                  ratingCount: j,
+                  disabled: d
+                }
+              )
+            ] }),
+            p && /* @__PURE__ */ e(
+              n,
+              {
+                component: "span",
+                variant: "body",
+                size: "sm",
+                weight: "regular",
+                fixY: !0,
+                className: S,
+                children: p
+              }
+            )
+          ]
+        }
+      )
+    ] }), /* @__PURE__ */ e(
+      "div",
+      {
+        ref: a,
+        className: K,
+        "data-disabled": d || void 0,
+        "aria-disabled": d || void 0,
+        ...G,
+        children: N
+      }
+    );
+  }
+);
+L.displayName = "OfferCard";
+const te = L;
+te.Skeleton = E;
+export {
+  te as OfferCard,
+  oe as offerCardDescriptionVariants,
+  re as offerCardTitleVariants,
+  ae as offerCardVariants
+};

package/dist/components/OfferCard/OfferCard.stories.d.ts

@@ -0,0 +1,15 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { OfferCard } from './OfferCard';
+declare const meta: Meta<typeof OfferCard>;
+export default meta;
+type Story = StoryObj<typeof OfferCard>;
+export declare const Compact: Story;
+export declare const CompactSkeleton: Story;
+export declare const CompactPromo: Story;
+export declare const CompactPromoSkeleton: Story;
+export declare const Search: Story;
+export declare const SearchSkeleton: Story;
+export declare const WithFavoriteControlled: Story;
+export declare const WithFavoriteNonInteractive: Story;
+export declare const AsChildLink: Story;
+//# sourceMappingURL=OfferCard.stories.d.ts.map

package/dist/components/OfferCard/OfferCard.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OfferCard.stories.d.ts","sourceRoot":"","sources":["../../../src/components/OfferCard/OfferCard.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAyIvC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAiDhC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,SAAS,CAAC,CAAA;AAEvC,eAAO,MAAM,OAAO,EAAE,KA0BrB,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAgB7B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KA2B1B,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAgBlC,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KA4BpB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAgB5B,CAAA;AAED,eAAO,MAAM,sBAAsB,EAAE,KAyBpC,CAAA;AAED,eAAO,MAAM,0BAA0B,EAAE,KAmBxC,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAuBzB,CAAA"}

package/dist/components/OfferCard/index.d.ts

@@ -0,0 +1,2 @@
+export * from './OfferCard';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/OfferCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/OfferCard/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}

package/dist/components/PageContainer/PageContainer.d.ts

@@ -0,0 +1,53 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+/**
+ * Stepped responsive widths for the shared page column, matching
+ * `UniversalFooter`:
+ * - `< lg` (mobile/tablet): gutters to the standard page padding so the column
+ *   never touches the viewport edge.
+ * - `< xl` (small desktop): 936px (`58.5rem`)
+ * - `< 2xl` (desktop): 1200px (`75rem`)
+ * - `≥ 2xl` (wide): 1500px (`93.75rem`)
+ *
+ * `spacingType` decides *how* the column is realised:
+ * - `margin` (default) — a centered, capped column (`max-w-*` + `mx-auto`).
+ *   Nest it inside a separate full-width band whose background/border spans the
+ *   viewport.
+ * - `padding` — the element spans full width itself and insets its content to
+ *   the same column via symmetric horizontal padding. Use it when one element
+ *   must be *both* the full-width band and the column — e.g. a header bar that
+ *   draws its own bottom border — instead of nesting a centered column inside a
+ *   separate wrapper.
+ *
+ * Each variant spells every utility out literally: Tailwind 4's scanner only
+ * emits utilities it sees verbatim in source, so the widths can't be factored
+ * into shared constants — keep the two `spacingType`s' steps in sync by hand.
+ */
+export declare const pageContainerVariants: (props?: ({
+    spacingType?: "padding" | "margin" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/**
+ * Props for {@link PageContainer} — the shared stepped-width page column.
+ * Extends the native `div` attributes (forwarded to the rendered element) and
+ * the `spacingType` cva variant documented on {@link pageContainerVariants}.
+ */
+export interface PageContainerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof pageContainerVariants> {
+    /**
+     * Element to render. Use a semantic element (`header`, `nav`, `main`) when
+     * the container *is* a page landmark — especially with `spacingType="padding"`,
+     * where the container is the band itself.
+     *
+     * @default 'div'
+     */
+    component?: 'div' | 'main' | 'header' | 'nav' | 'section' | 'footer';
+}
+/**
+ * Aligns content to the shared stepped-width page column so every page band
+ * (header nav, coloured sections, footer) lines up to the same gutters at every
+ * breakpoint. Pick `spacingType` by whether the element is nested inside a
+ * full-width band (`margin`) or *is* the band itself (`padding`). Add layout
+ * utilities (e.g. `flex`, `gap-*`) via `className`.
+ */
+declare const PageContainer: React.ForwardRefExoticComponent<PageContainerProps & React.RefAttributes<HTMLElement>>;
+export { PageContainer };
+//# sourceMappingURL=PageContainer.d.ts.map

package/dist/components/PageContainer/PageContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageContainer.d.ts","sourceRoot":"","sources":["../../../src/components/PageContainer/PageContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAGjE;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,qBAAqB;;8EAuBhC,CAAA;AAEF;;;;GAIG;AACH,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,qBAAqB,CAAC;IAC5C;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,QAAQ,CAAA;CACrE;AAED;;;;;;GAMG;AACH,QAAA,MAAM,aAAa,wFASlB,CAAA;AAGD,OAAO,EAAE,aAAa,EAAE,CAAA"}

package/dist/components/PageContainer/PageContainer.js

@@ -0,0 +1,49 @@
+import * as a from "react";
+import { cva as o } from "class-variance-authority";
+import { cn as c } from "../../utils/cn.js";
+const p = o("", {
+  variants: {
+    spacingType: {
+      // Centered, capped column — one `max-w` step per breakpoint.
+      margin: [
+        "mx-auto w-full",
+        "max-lg:max-w-[calc(100%-2*var(--spacing-layout-p-standard))]",
+        // < lg: gutter
+        "max-xl:max-w-[58.5rem]",
+        // < xl: 936px
+        "max-w-[75rem]",
+        // < 2xl: 1200px
+        "2xl:max-w-[93.75rem]"
+        // ≥ 2xl: 1500px
+      ],
+      // Full-width band that pads its content to the same column — one
+      // symmetric `px` step per breakpoint, mirroring the `margin` widths.
+      padding: [
+        "w-full overflow-x-hidden",
+        "max-lg:px-layout-p-standard",
+        // < lg: gutter
+        "max-xl:px-[calc((100%-58.5rem)/2)]",
+        // < xl: 936px centered
+        "px-[calc((100%-75rem)/2)]",
+        // < 2xl: 1200px centered
+        "2xl:px-[calc((100%-93.75rem)/2)]"
+        // ≥ 2xl: 1500px centered
+      ]
+    }
+  },
+  defaultVariants: { spacingType: "margin" }
+}), x = a.forwardRef(
+  ({ className: r, spacingType: e, component: m, ...n }, t) => {
+    const l = m ?? "div";
+    return a.createElement(l, {
+      ref: t,
+      className: c(p({ spacingType: e }), r),
+      ...n
+    });
+  }
+);
+x.displayName = "PageContainer";
+export {
+  x as PageContainer,
+  p as pageContainerVariants
+};

package/dist/components/PageContainer/PageContainer.stories.d.ts

@@ -0,0 +1,14 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { PageContainer } from './PageContainer';
+declare const meta: Meta<typeof PageContainer>;
+export default meta;
+type Story = StoryObj<typeof PageContainer>;
+export declare const Aligned: Story;
+/**
+ * Full storefront page — the `MarketNav` and `CarouselSection` examples plus the
+ * library `UniversalFooter`, stacked. All three route their content through the
+ * shared stepped-width column, so the nav logo, the section heading and the
+ * footer content all line up to the same gutters at every breakpoint.
+ */
+export declare const FullPage: Story;
+//# sourceMappingURL=PageContainer.stories.d.ts.map

package/dist/components/PageContainer/PageContainer.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageContainer.stories.d.ts","sourceRoot":"","sources":["../../../src/components/PageContainer/PageContainer.stories.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAwC3D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CA6BpC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAA;AAE3C,eAAO,MAAM,OAAO,EAAE,KAarB,CAAA;AAuHD;;;;;GAKG;AACH,eAAO,MAAM,QAAQ,EAAE,KA+BtB,CAAA"}

package/dist/components/PageContainer/index.d.ts

@@ -0,0 +1,2 @@
+export * from './PageContainer';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/PageContainer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageContainer/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}