@omniharmonic/openspace-cli 0.1.11 → 0.1.12

package/dist/{chunk-FPW2XAQ5.js → chunk-O55O7EA5.js}

@@ -20415,7 +20415,15 @@ var HEADER_VARIANTS = [
   /** Navigation lives in a side drawer opened from the header. */
   "sidebar-drawer",
   /** Header overlays the first section (transparent until scrolled). */
-  "transparent-overlay"
+  "transparent-overlay",
+  /** Navigation on the left, logo centered, buttons and cart on the right. */
+  "nav-left-logo-center",
+  /**
+   * A column down the left on wide screens (logo, title, tagline, the navigation as a list),
+   * the page to its right; a top bar with a menu button on phones. Sidebar themes (WordPress
+   * Twenty Fifteen and the like).
+   */
+  "sidebar-left"
 ];
 var HeaderVariantSchema = external_exports.enum(HEADER_VARIANTS);
 var MOBILE_MENU_STYLES = ["slide", "fullscreen", "dropdown"];
@@ -28277,22 +28285,29 @@ function navFit(input2) {
   if (need(29) <= 1440 - 96) return "wide";
   return "collapse";
 }
-function Brand({ site, className }) {
+function Brand({
+  site,
+  className,
+  withTitle
+}) {
   const { basePath } = useRenderContext();
   const logo = site.logo;
-  return /* @__PURE__ */ jsx9("a", { className: cx("os-header__brand", className), href: `${normalizeBasePath(basePath)}/`, children: logo ? /* @__PURE__ */ jsx9(
-    Img,
-    {
-      src: logo.src,
-      alt: logo.alt || site.title,
-      ...logo.width ? { width: logo.width } : {},
-      ...logo.height ? { height: logo.height } : {},
-      sizes: "240px",
-      treatment: "none",
-      priority: true,
-      className: "os-header__logo"
-    }
-  ) : /* @__PURE__ */ jsx9("span", { className: "os-header__title", children: site.title }) });
+  return /* @__PURE__ */ jsxs6("a", { className: cx("os-header__brand", className), href: `${normalizeBasePath(basePath)}/`, children: [
+    logo ? /* @__PURE__ */ jsx9(
+      Img,
+      {
+        src: logo.src,
+        alt: withTitle ? "" : logo.alt || site.title,
+        ...logo.width ? { width: logo.width } : {},
+        ...logo.height ? { height: logo.height } : {},
+        sizes: "240px",
+        treatment: "none",
+        priority: true,
+        className: "os-header__logo"
+      }
+    ) : null,
+    !logo || withTitle ? /* @__PURE__ */ jsx9("span", { className: "os-header__title", children: site.title }) : null
+  ] });
 }
 function MenuIcon() {
   return /* @__PURE__ */ jsx9(
@@ -28352,7 +28367,8 @@ function Header({ site, page, heroTheme, cart }) {
   );
   const social3 = h.showSocial ? site.social ?? [] : [];
   const theme = h.overlay && heroTheme ? heroTheme : h.colorTheme ?? "light";
-  const fit = DRAWER_VARIANTS.includes(h.variant) ? "fits" : navFit({
+  const sidebar = h.variant === "sidebar-left";
+  const fit = DRAWER_VARIANTS.includes(h.variant) || sidebar ? "fits" : navFit({
     title: site.title,
     logo: site.logo,
     nav: nav.map((i) => ({ label: i.label, kind: i.kind })),
@@ -28396,7 +28412,15 @@ function Header({ site, page, heroTheme, cart }) {
       "data-os-behavior": "menu",
       children: [
         /* @__PURE__ */ jsxs6("div", { className: "os-header__bar", children: [
-          /* @__PURE__ */ jsx9(Brand, { site, className: split ? "os-header__brand--main" : void 0 }),
+          /* @__PURE__ */ jsx9(
+            Brand,
+            {
+              site,
+              ...split ? { className: "os-header__brand--main" } : {},
+              ...sidebar ? { withTitle: true } : {}
+            }
+          ),
+          sidebar && site.tagline ? /* @__PURE__ */ jsx9("p", { className: "os-header__tagline", children: site.tagline }) : null,
           desktopNav,
           actions,
           cart && /* @__PURE__ */ jsx9(CartButton, {}),
@@ -28795,7 +28819,7 @@ ${button("tertiary")}
 .os-header__logo{height:var(--mlogo-h,2rem);width:auto;border-radius:0;background:none}
 .os-header__logo .os-img__img{height:100%;width:auto;object-fit:contain}
 .os-header__title{${typePreset("wordmark")};text-wrap:balance;overflow-wrap:break-word;max-inline-size:30ch}
-.os-header__brand--split,.os-nav{display:none}
+.os-header__brand--split,.os-nav,.os-header__tagline{display:none}
 .os-header__actions{display:none;align-items:center;gap:${v(T.space.xs)}}
 .os-header__actions .os-button{min-height:2.5rem;padding-block:0.5rem}
 .os-header__toggle,.os-header__cart,.os-menu__close{position:relative;display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;padding:0;border:0;border-radius:${v(T.radius.full)};background:transparent;color:inherit}
@@ -28858,6 +28882,24 @@ html:not(.os-js) .os-header__toggle{display:none}
 .os-header.os-header--split-nav .os-nav--split{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(1.5rem,3vw,3rem)}
 .os-header--split-nav .os-nav__list--start{justify-content:flex-end}
 .os-header--split-nav .os-header__brand--split{display:inline-flex;margin:0}
+.os-header--nav-left-logo-center .os-header__bar{position:relative}
+.os-header--nav-left-logo-center .os-header__brand{position:absolute;inset-inline-start:50%;translate:-50% 0;margin:0;max-inline-size:34%}
+[dir=rtl] .os-header--nav-left-logo-center .os-header__brand{translate:50% 0}
+.os-header--nav-left-logo-center .os-nav{order:-1;margin-inline-end:auto;max-inline-size:33%}
+.os-header--nav-left-logo-center .os-nav__list{justify-content:flex-start}
+.os-page:has(>.os-header--sidebar-left){--sidebar-w:clamp(16rem,28vw,28rem);padding-inline-start:var(--sidebar-w)}
+.os-header.os-header--sidebar-left{position:fixed;inset-block:0;inset-inline-start:0;inline-size:var(--sidebar-w);overflow-y:auto;overscroll-behavior:contain}
+.os-header--sidebar-left .os-header__bar{flex-direction:column;align-items:flex-start;gap:${v(T.space.sm)};min-height:0;max-inline-size:none;margin:0;padding:clamp(2rem,4vw,4rem) clamp(1.5rem,3.5vw,3.5rem)}
+.os-header--sidebar-left .os-header__brand{flex-direction:column;align-items:flex-start;gap:0.75rem;margin:0}
+.os-header--sidebar-left .os-header__logo{height:auto;max-inline-size:min(100%,8rem)}
+.os-header.os-header--sidebar-left .os-header__title{white-space:normal;max-inline-size:none}
+.os-header--sidebar-left .os-header__tagline{display:block;margin:0;font-size:${v(T.type.small["font-size"])};line-height:${v(T.type.small["line-height"])};color:${v(c2["text-muted"])}}
+.os-header--sidebar-left .os-nav{inline-size:100%;margin-block-start:${v(T.space.sm)}}
+.os-header--sidebar-left .os-nav__list{flex-direction:column;align-items:stretch;row-gap:0}
+.os-header--sidebar-left .os-nav__link{display:flex;padding-block:0.55rem;border-bottom:1px solid ${v(c2.border)};white-space:normal}
+.os-header--sidebar-left .os-nav__link::after{display:none}
+.os-header--sidebar-left .os-nav .os-nav__sub{position:static;min-width:0;padding:0 0 0 1rem;background:none;box-shadow:none;color:inherit}
+.os-header--sidebar-left .os-header__actions{flex-direction:column;align-items:flex-start}
 .os-header--logo-center-nav-below,.os-header--stacked{--header-row:3rem}
 .os-header--logo-center-nav-below .os-header__bar{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:". brand actions" "nav nav nav";row-gap:0;padding-bottom:0}
 .os-header--logo-center-nav-below .os-header__brand{grid-area:brand;margin:0}
@@ -43276,6 +43318,44 @@ var headerPresets = [
       colorTheme: theme
     })
   }),
+  defineHeaderPreset({
+    category: "header",
+    name: "logo-centered",
+    label: "Logo centred, menu left",
+    description: "The navigation on the left, a centred logo, buttons and cart on the right.",
+    tags: ["boutique", "centered", "shop"],
+    ai: {
+      purpose: "A fashion- and boutique-style header with the brand in the middle.",
+      whenToUse: "Shops and studios whose wordmark should sit centre stage.",
+      avoid: HEADER_AVOID
+    },
+    make: (theme) => ({
+      variant: "nav-left-logo-center",
+      sticky: false,
+      transparentOnHero: false,
+      mobileMenu: "fullscreen",
+      colorTheme: theme
+    })
+  }),
+  defineHeaderPreset({
+    category: "header",
+    name: "sidebar",
+    label: "Sidebar",
+    description: "Logo, title and the menu in a column down the left; the page beside it.",
+    tags: ["blog", "editorial", "sidebar"],
+    ai: {
+      purpose: "A blog- or journal-style layout with the site's identity always in view.",
+      whenToUse: "Writers, journals and foundations with a short menu and a strong colour.",
+      avoid: HEADER_AVOID
+    },
+    make: (theme) => ({
+      variant: "sidebar-left",
+      sticky: false,
+      transparentOnHero: false,
+      mobileMenu: "slide",
+      colorTheme: theme
+    })
+  }),
   defineHeaderPreset({
     category: "header",
     name: "logo-above",
@@ -52899,6 +52979,7 @@ export {
   TYPE_PAIRINGS,
   getPairing,
   pairingFamilies,
+  SPACE_SCALES,
   flattenDtcg,
   compileStyles,
   COMPONENT_PREVIEW_IDS,
@@ -53030,4 +53111,4 @@ lucide/dist/esm/lucide.mjs:
    * See the LICENSE file in the root directory of this source tree.
    *)
 */
-//# sourceMappingURL=chunk-FPW2XAQ5.js.map
+//# sourceMappingURL=chunk-O55O7EA5.js.map