@frontlit/page-builder 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/server/islands/email-form.d.ts

@@ -0,0 +1,50 @@
+import React__default, { ReactNode } from 'react';
+import { T as ThemeStyle } from '../theme-style-5_AGy-4V.js';
+import { W as WidgetDefaultSettings, P as PageData } from '../widget-YH9BrOwY.js';
+import { TextEditorContent } from '@frontlit/text-editor';
+
+type HorizontalAlignment = "center" | "left" | "right";
+type VerticalAlignment = "top" | "bottom";
+type Alignment = HorizontalAlignment | VerticalAlignment;
+
+/** Heading element a block renders its title as. */
+type HeadingLevel = "h1" | "h2" | "h3";
+/** Per-breakpoint text size in px; unset breakpoints keep the theme size. */
+interface ResponsiveTextSize {
+    mobile?: number;
+    tablet?: number;
+    desktop?: number;
+}
+/** Title options shared by every block with a title. */
+interface TitleSettings {
+    /** Defaults to H1 for the Hero and H2 everywhere else. */
+    titleLevel?: HeadingLevel;
+    titleSize?: ResponsiveTextSize;
+}
+
+interface EmailFormSettings extends WidgetDefaultSettings, TitleSettings {
+    title?: string;
+    description?: TextEditorContent;
+    buttonCaption?: string;
+    successMessage?: string;
+    alignment?: Alignment;
+    layout?: "stacked" | "split" | "inline";
+}
+
+/**
+ * The interactive part of the email-form block: the `<form>` with its fields
+ * and success message. The block's heading is rendered on the server and
+ * passed in as `heading`.
+ */
+declare function EmailForm({ theme: overriddenTheme, layout, alignment, buttonCaption, successMessage, pageData, editing, heading, }: {
+    theme: ThemeStyle;
+    layout: NonNullable<EmailFormSettings["layout"]>;
+    alignment: NonNullable<EmailFormSettings["alignment"]>;
+    buttonCaption: string;
+    successMessage: string;
+    pageData: PageData;
+    editing?: boolean;
+    heading: ReactNode;
+}): React__default.JSX.Element;
+
+export { EmailForm };

package/dist/server/islands/email-form.js

@@ -0,0 +1,406 @@
+"use client";
+"use client";
+
+// src/blocks/email-form/form.tsx
+import { useState } from "react";
+import clsx2 from "clsx";
+
+// src/primitives/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/primitives/components/ui/button.tsx
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-10 px-4 py-2",
+        sm: "h-9 rounded-md px-3",
+        lg: "h-11 rounded-md px-8",
+        icon: "h-10 w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/primitives/button.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Button2 = ({
+  variant = "default",
+  size = "default",
+  disabled = false,
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const buttonStyles = theme?.interactives?.button;
+  const typographyStyles = theme?.typography?.button;
+  const isIcon = size === "icon";
+  const classes = cn(
+    // Base styles
+    "",
+    // Theme typography
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    // Theme interactivity. Icon buttons stay square — CTA padding
+    // would stretch them off the size="icon" box.
+    !isIcon && buttonStyles?.padding?.x,
+    !isIcon && buttonStyles?.padding?.y,
+    buttonStyles?.border?.width,
+    buttonStyles?.border?.radius,
+    buttonStyles?.border?.style,
+    // buttonStyles?.border?.color,
+    buttonStyles?.shadow,
+    // Theme disabled states
+    disabled && buttonStyles?.disabled?.opacity,
+    disabled && buttonStyles?.disabled?.cursor,
+    disabled && buttonStyles?.disabled?.color,
+    disabled && buttonStyles?.disabled?.background,
+    disabled && buttonStyles?.disabled?.border,
+    // User overrides
+    buttonStyles?.custom,
+    className
+  );
+  return /* @__PURE__ */ jsx2(
+    Button,
+    {
+      variant,
+      size,
+      disabled,
+      className: classes,
+      ...props,
+      children
+    }
+  );
+};
+
+// src/primitives/input.tsx
+import React3 from "react";
+
+// src/primitives/components/ui/input.tsx
+import * as React2 from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Input = React2.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsx3(
+      "input",
+      {
+        type,
+        className: cn(
+          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+// src/primitives/input.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Input2 = React3.forwardRef(
+  ({
+    className = "",
+    theme,
+    error = false,
+    /*style = {},*/
+    ...props
+  }, ref) => {
+    const inputStyles = theme?.interactives?.input;
+    const typographyStyles = theme?.typography?.input;
+    const classes = cn(
+      // Base styles
+      // "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+      // Theme typography
+      typographyStyles?.fontFamily,
+      typographyStyles?.fontSize,
+      typographyStyles?.fontWeight,
+      typographyStyles?.lineHeight,
+      typographyStyles?.letterSpacing,
+      typographyStyles?.textTransform,
+      typographyStyles?.textDecoration,
+      typographyStyles?.textOverflow,
+      // Theme interactivity
+      inputStyles?.padding?.x,
+      inputStyles?.padding?.y,
+      inputStyles?.border?.width,
+      inputStyles?.border?.style,
+      inputStyles?.border?.radius,
+      // inputStyles?.border?.color,
+      inputStyles?.shadow,
+      // Theme disabled states
+      props.disabled && inputStyles?.disabled?.opacity,
+      props.disabled && inputStyles?.disabled?.cursor,
+      props.disabled && inputStyles?.disabled?.color,
+      props.disabled && inputStyles?.disabled?.background,
+      props.disabled && inputStyles?.disabled?.border,
+      // Error state
+      error && "border-red-300 focus:border-red-500 focus:ring-red-500",
+      // User overrides
+      inputStyles?.custom,
+      className
+    );
+    return /* @__PURE__ */ jsx4(Input, { ref, className: classes, ...props });
+  }
+);
+Input2.displayName = "Input";
+
+// src/primitives/label.tsx
+import React5 from "react";
+
+// src/primitives/components/ui/label.tsx
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { cva as cva2 } from "class-variance-authority";
+import * as React4 from "react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var labelVariants = cva2(
+  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+);
+var Label = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  LabelPrimitive.Root,
+  {
+    ref,
+    className: cn(labelVariants(), className),
+    ...props
+  }
+));
+Label.displayName = LabelPrimitive.Root.displayName;
+
+// src/primitives/label.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Label2 = React5.forwardRef(
+  ({ className = "", theme, error = false, ...props }, ref) => {
+    const typographyStyles = theme?.typography?.text2;
+    const classes = cn(
+      // Theme typography
+      typographyStyles?.fontFamily,
+      typographyStyles?.fontSize,
+      typographyStyles?.fontWeight,
+      typographyStyles?.lineHeight,
+      typographyStyles?.letterSpacing,
+      typographyStyles?.textTransform,
+      typographyStyles?.textDecoration,
+      typographyStyles?.textOverflow,
+      // Error state
+      error && "text-red-500",
+      className
+    );
+    return /* @__PURE__ */ jsx6(Label, { ref, className: classes, ...props });
+  }
+);
+Label2.displayName = "Label";
+
+// src/primitives/text2.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var Text2 = ({
+  children,
+  className = "",
+  theme,
+  component = "p",
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.text2;
+  const classes = cn(
+    // Base styles
+    "text-sm",
+    // Theme overrides
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    className
+  );
+  return component === "p" ? /* @__PURE__ */ jsx7("p", { className: classes, ...props, children }) : /* @__PURE__ */ jsx7("span", { className: classes, ...props, children });
+};
+
+// src/blocks/email-form/form.tsx
+import { jsx as jsx8, jsxs } from "react/jsx-runtime";
+async function subscribeEmail(email, pageData) {
+  if (!pageData.teamId || !pageData.publicApiBaseUrl) {
+    await new Promise((resolve) => setTimeout(resolve, 600));
+    return { success: Boolean(email) };
+  }
+  try {
+    const res = await fetch(
+      `${pageData.publicApiBaseUrl}/public/${pageData.teamId}/leads`,
+      {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify({
+          email,
+          sourcePath: pageData.pageSlug ? `/${pageData.pageSlug}` : void 0
+        })
+      }
+    );
+    if (!res.ok) return { success: false };
+    const body = await res.json();
+    return { success: body.accepted };
+  } catch {
+    return { success: false };
+  }
+}
+function EmailForm({
+  theme: overriddenTheme,
+  layout,
+  alignment,
+  buttonCaption,
+  successMessage,
+  pageData,
+  editing,
+  heading
+}) {
+  const [email, setEmail] = useState("");
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [success, setSuccess] = useState(false);
+  const isCentered = alignment === "center";
+  const onSubmit = async (e) => {
+    e.preventDefault();
+    if (editing) return;
+    setIsSubmitting(true);
+    try {
+      const result = await subscribeEmail(email, pageData);
+      if (result.success) {
+        setSuccess(true);
+        setEmail("");
+      }
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+  if (layout === "inline") {
+    return /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit,
+        className: "flex flex-col items-start gap-4 md:!flex-row md:items-center md:justify-between",
+        children: [
+          heading,
+          success ? /* @__PURE__ */ jsx8(Text2, { theme: overriddenTheme, children: successMessage }) : /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-2 sm:!flex-row md:w-auto md:shrink-0", children: [
+            /* @__PURE__ */ jsx8(
+              Input2,
+              {
+                theme: overriddenTheme,
+                id: "email",
+                value: email,
+                onChange: (e) => setEmail(e.target.value),
+                placeholder: "Enter your email",
+                type: "email",
+                required: true,
+                className: "md:w-64"
+              }
+            ),
+            /* @__PURE__ */ jsx8(
+              Button2,
+              {
+                theme: overriddenTheme,
+                type: "submit",
+                disabled: !editing && (isSubmitting || !email),
+                children: buttonCaption
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      onSubmit,
+      className: clsx2(
+        "flex gap-4",
+        layout === "split" ? "flex-col md:!flex-row md:items-center md:justify-between md:gap-10" : clsx2("flex-col", isCentered ? "items-center text-center" : "items-start")
+      ),
+      children: [
+        heading,
+        success ? /* @__PURE__ */ jsx8(Text2, { theme: overriddenTheme, children: successMessage }) : /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: clsx2(
+              "flex flex-col md:!flex-row md:!items-end gap-2",
+              layout === "split" ? "md:shrink-0" : "w-full",
+              layout !== "split" && isCentered ? "md:!justify-center" : ""
+            ),
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 items-start", children: [
+                /* @__PURE__ */ jsx8(Label2, { theme: overriddenTheme, htmlFor: "email", children: "Email" }),
+                /* @__PURE__ */ jsx8(
+                  Input2,
+                  {
+                    theme: overriddenTheme,
+                    id: "email",
+                    value: email,
+                    onChange: (e) => setEmail(e.target.value),
+                    placeholder: "Enter your email",
+                    type: "email",
+                    required: true
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx8(
+                Button2,
+                {
+                  theme: overriddenTheme,
+                  type: "submit",
+                  disabled: !editing && (isSubmitting || !email),
+                  children: buttonCaption
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  EmailForm
+};
+//# sourceMappingURL=email-form.js.map

package/dist/server/islands/email-form.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/email-form/form.tsx","../../../src/primitives/lib/utils.ts","../../../src/primitives/components/ui/button.tsx","../../../src/primitives/button.tsx","../../../src/primitives/input.tsx","../../../src/primitives/components/ui/input.tsx","../../../src/primitives/label.tsx","../../../src/primitives/components/ui/label.tsx","../../../src/primitives/text2.tsx"],"sourcesContent":["\"use client\";\n\nimport React, { useState, type ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport type { PageData, ThemeStyle } from \"../../models\";\nimport type { EmailFormSettings } from \"./settings\";\nimport { Button, Input, Label, Text2 } from \"../../primitives\";\n\n/**\n * Captures a lead via FrontLit's public, unauthenticated lead-capture\n * endpoint (architecture.md §10.2), which enqueues a SendLit contact-sync\n * job and returns immediately — capture never depends on SendLit being\n * reachable. Falls back to a local-only success (no network call) when the\n * page isn't wired to a live team/API, e.g. an isolated component preview.\n */\nasync function subscribeEmail(\n  email: string,\n  pageData: PageData,\n): Promise<{ success: boolean }> {\n  if (!pageData.teamId || !pageData.publicApiBaseUrl) {\n    await new Promise((resolve) => setTimeout(resolve, 600));\n    return { success: Boolean(email) };\n  }\n\n  try {\n    const res = await fetch(\n      `${pageData.publicApiBaseUrl}/public/${pageData.teamId}/leads`,\n      {\n        method: \"POST\",\n        headers: { \"content-type\": \"application/json\" },\n        body: JSON.stringify({\n          email,\n          sourcePath: pageData.pageSlug ? `/${pageData.pageSlug}` : undefined,\n        }),\n      },\n    );\n    if (!res.ok) return { success: false };\n    const body = (await res.json()) as { accepted: boolean };\n    return { success: body.accepted };\n  } catch {\n    return { success: false };\n  }\n}\n\n/**\n * The interactive part of the email-form block: the `<form>` with its fields\n * and success message. The block's heading is rendered on the server and\n * passed in as `heading`.\n */\nexport function EmailForm({\n  theme: overriddenTheme,\n  layout,\n  alignment,\n  buttonCaption,\n  successMessage,\n  pageData,\n  editing,\n  heading,\n}: {\n  theme: ThemeStyle;\n  layout: NonNullable<EmailFormSettings[\"layout\"]>;\n  alignment: NonNullable<EmailFormSettings[\"alignment\"]>;\n  buttonCaption: string;\n  successMessage: string;\n  pageData: PageData;\n  editing?: boolean;\n  heading: ReactNode;\n}) {\n  const [email, setEmail] = useState(\"\");\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [success, setSuccess] = useState(false);\n\n  const isCentered = alignment === \"center\";\n\n  const onSubmit = async (e: React.FormEvent) => {\n    e.preventDefault();\n    if (editing) return;\n\n    setIsSubmitting(true);\n    try {\n      const result = await subscribeEmail(email, pageData);\n      if (result.success) {\n        setSuccess(true);\n        setEmail(\"\");\n      }\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  if (layout === \"inline\") {\n    // Single-row minimal prompt — title/description beside a bare\n    // input+button, no label. Common for a compact in-page nudge\n    // rather than a dedicated email section.\n    return (\n      <form\n        onSubmit={onSubmit}\n        className=\"flex flex-col items-start gap-4 md:!flex-row md:items-center md:justify-between\"\n      >\n        {heading}\n        {success ? (\n          <Text2 theme={overriddenTheme}>{successMessage}</Text2>\n        ) : (\n          <div className=\"flex w-full flex-col gap-2 sm:!flex-row md:w-auto md:shrink-0\">\n            <Input\n              theme={overriddenTheme}\n              id=\"email\"\n              value={email}\n              onChange={(e) => setEmail(e.target.value)}\n              placeholder=\"Enter your email\"\n              type=\"email\"\n              required\n              className=\"md:w-64\"\n            />\n            <Button\n              theme={overriddenTheme}\n              type=\"submit\"\n              disabled={!editing && (isSubmitting || !email)}\n            >\n              {buttonCaption}\n            </Button>\n          </div>\n        )}\n      </form>\n    );\n  }\n\n  return (\n    <form\n      onSubmit={onSubmit}\n      className={clsx(\n        \"flex gap-4\",\n        layout === \"split\"\n          ? \"flex-col md:!flex-row md:items-center md:justify-between md:gap-10\"\n          : clsx(\"flex-col\", isCentered ? \"items-center text-center\" : \"items-start\"),\n      )}\n    >\n      {heading}\n      {success ? (\n        <Text2 theme={overriddenTheme}>{successMessage}</Text2>\n      ) : (\n        <div\n          className={clsx(\n            \"flex flex-col md:!flex-row md:!items-end gap-2\",\n            layout === \"split\" ? \"md:shrink-0\" : \"w-full\",\n            layout !== \"split\" && isCentered ? \"md:!justify-center\" : \"\",\n          )}\n        >\n          <div className=\"flex flex-col gap-1 items-start\">\n            <Label theme={overriddenTheme} htmlFor=\"email\">\n              Email\n            </Label>\n            <Input\n              theme={overriddenTheme}\n              id=\"email\"\n              value={email}\n              onChange={(e) => setEmail(e.target.value)}\n              placeholder=\"Enter your email\"\n              type=\"email\"\n              required\n            />\n          </div>\n          <Button\n            theme={overriddenTheme}\n            type=\"submit\"\n            disabled={!editing && (isSubmitting || !email)}\n          >\n            {buttonCaption}\n          </Button>\n        </div>\n      )}\n    </form>\n  );\n}\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","import { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst buttonVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        destructive:\n          \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n        outline:\n          \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n        secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n        ghost: \"hover:bg-accent hover:text-accent-foreground\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-10 px-4 py-2\",\n        sm: \"h-9 rounded-md px-3\",\n        lg: \"h-11 rounded-md px-8\",\n        icon: \"h-10 w-10\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ className, variant, size, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\";\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, className }))}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\n","import type React from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport {\n  Button as ShadcnButton,\n  type ButtonProps as ShadcnButtonProps,\n} from \"./components/ui/button\";\nimport { cn } from \"./lib/utils\";\n\nexport interface ButtonProps extends ShadcnButtonProps {\n  theme?: ThemeStyle;\n}\n\nexport const Button: React.FC<ButtonProps> = ({\n  variant = \"default\",\n  size = \"default\",\n  disabled = false,\n  children,\n  className = \"\",\n  theme,\n  ...props\n}) => {\n  const buttonStyles = theme?.interactives?.button;\n  const typographyStyles = theme?.typography?.button;\n  const isIcon = size === \"icon\";\n\n  const classes = cn(\n    // Base styles\n    \"\",\n    // Theme typography\n    typographyStyles?.fontFamily,\n    typographyStyles?.fontSize,\n    typographyStyles?.fontWeight,\n    typographyStyles?.lineHeight,\n    typographyStyles?.letterSpacing,\n    typographyStyles?.textTransform,\n    typographyStyles?.textDecoration,\n    typographyStyles?.textOverflow,\n    // Theme interactivity. Icon buttons stay square — CTA padding\n    // would stretch them off the size=\"icon\" box.\n    !isIcon && buttonStyles?.padding?.x,\n    !isIcon && buttonStyles?.padding?.y,\n    buttonStyles?.border?.width,\n    buttonStyles?.border?.radius,\n    buttonStyles?.border?.style,\n    // buttonStyles?.border?.color,\n    buttonStyles?.shadow,\n    // Theme disabled states\n    disabled && buttonStyles?.disabled?.opacity,\n    disabled && buttonStyles?.disabled?.cursor,\n    disabled && buttonStyles?.disabled?.color,\n    disabled && buttonStyles?.disabled?.background,\n    disabled && buttonStyles?.disabled?.border,\n    // User overrides\n    buttonStyles?.custom,\n    className,\n  );\n\n  return (\n    <ShadcnButton\n      variant={variant}\n      size={size}\n      disabled={disabled}\n      className={classes}\n      {...props}\n    >\n      {children}\n    </ShadcnButton>\n  );\n};\n","import React from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { Input as ShadcnInput } from \"./components/ui/input\";\nimport { cn } from \"./lib/utils\";\n\nexport interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {\n  theme?: ThemeStyle;\n  error?: boolean;\n  // style?: React.CSSProperties;\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className = \"\", theme, error = false, /*style = {},*/ ...props }, ref) => {\n    const inputStyles = theme?.interactives?.input;\n    const typographyStyles = theme?.typography?.input;\n\n    const classes = cn(\n      // Base styles\n      // \"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n      // Theme typography\n      typographyStyles?.fontFamily,\n      typographyStyles?.fontSize,\n      typographyStyles?.fontWeight,\n      typographyStyles?.lineHeight,\n      typographyStyles?.letterSpacing,\n      typographyStyles?.textTransform,\n      typographyStyles?.textDecoration,\n      typographyStyles?.textOverflow,\n      // Theme interactivity\n      inputStyles?.padding?.x,\n      inputStyles?.padding?.y,\n      inputStyles?.border?.width,\n      inputStyles?.border?.style,\n      inputStyles?.border?.radius,\n      // inputStyles?.border?.color,\n      inputStyles?.shadow,\n      // Theme disabled states\n      props.disabled && inputStyles?.disabled?.opacity,\n      props.disabled && inputStyles?.disabled?.cursor,\n      props.disabled && inputStyles?.disabled?.color,\n      props.disabled && inputStyles?.disabled?.background,\n      props.disabled && inputStyles?.disabled?.border,\n      // Error state\n      error && \"border-red-300 focus:border-red-500 focus:ring-red-500\",\n      // User overrides\n      inputStyles?.custom,\n      className,\n    );\n\n    return <ShadcnInput ref={ref} className={classes} {...props} />;\n  },\n);\n\nInput.displayName = \"Input\";\n","import * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst Input = React.forwardRef<HTMLInputElement, React.ComponentProps<\"input\">>(\n  ({ className, type, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={cn(\n          \"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n          className,\n        )}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\nInput.displayName = \"Input\";\n\nexport { Input };\n","import React from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { Label as ShadcnLabel } from \"./components/ui/label\";\nimport { cn } from \"./lib/utils\";\n\nexport interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  theme?: ThemeStyle;\n  error?: boolean;\n}\n\nexport const Label = React.forwardRef<HTMLLabelElement, LabelProps>(\n  ({ className = \"\", theme, error = false, ...props }, ref) => {\n    const typographyStyles = theme?.typography?.text2;\n\n    const classes = cn(\n      // Theme typography\n      typographyStyles?.fontFamily,\n      typographyStyles?.fontSize,\n      typographyStyles?.fontWeight,\n      typographyStyles?.lineHeight,\n      typographyStyles?.letterSpacing,\n      typographyStyles?.textTransform,\n      typographyStyles?.textDecoration,\n      typographyStyles?.textOverflow,\n      // Error state\n      error && \"text-red-500\",\n      className,\n    );\n\n    return <ShadcnLabel ref={ref} className={classes} {...props} />;\n  },\n);\n\nLabel.displayName = \"Label\";\n","import * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst labelVariants = cva(\n  \"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\",\n);\n\nconst Label = React.forwardRef<\n  React.ElementRef<typeof LabelPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &\n    VariantProps<typeof labelVariants>\n>(({ className, ...props }, ref) => (\n  <LabelPrimitive.Root\n    ref={ref}\n    className={cn(labelVariants(), className)}\n    {...props}\n  />\n));\nLabel.displayName = LabelPrimitive.Root.displayName;\n\nexport { Label };\n","import type React from \"react\";\nimport { cn } from \"./lib/utils\";\nimport type { TypographyProps } from \"./typography\";\n\nexport const Text2: React.FC<TypographyProps & { component?: \"p\" | \"span\" }> = ({\n  children,\n  className = \"\",\n  theme,\n  component = \"p\",\n  ...props\n}) => {\n  const typographyStyles = theme?.typography?.text2;\n  const classes = cn(\n    // Base styles\n    \"text-sm\",\n    // Theme overrides\n    typographyStyles?.fontFamily,\n    typographyStyles?.fontSize,\n    typographyStyles?.fontWeight,\n    typographyStyles?.lineHeight,\n    typographyStyles?.letterSpacing,\n    typographyStyles?.textTransform,\n    typographyStyles?.textDecoration,\n    typographyStyles?.textOverflow,\n    className,\n  );\n\n  return component === \"p\" ? (\n    <p className={classes} {...props}>\n      {children}\n    </p>\n  ) : (\n    <span className={classes} {...props}>\n      {children}\n    </span>\n  );\n};\n"],"mappings":"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","names":["clsx","jsx","Button","React","React","jsx","jsx","Input","React","React","cva","React","jsx","cva","jsx","Label","React","jsx","jsx","Input","Button","clsx","Label"]}

package/dist/server/islands/header-mobile-menu.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { T as ThemeStyle } from '../theme-style-5_AGy-4V.js';
+
+interface HeaderNavLink {
+    id: string;
+    label: string;
+    href: string;
+    isButton?: boolean;
+}
+
+/**
+ * The header's mobile drawer. It is the only interactive part of the header,
+ * so it is the only part sent to the browser on server-rendered pages.
+ */
+declare function HeaderMobileMenu({ links, ctaLabel, ctaHref, theme, }: {
+    links: HeaderNavLink[];
+    ctaLabel?: string;
+    ctaHref?: string;
+    theme: ThemeStyle;
+}): React.JSX.Element;
+
+export { HeaderMobileMenu };