@frontlit/page-builder 0.1.0-alpha.6 → 0.1.0-alpha.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/blocks/index.js +2 -2
  2. package/dist/builder/index.js +5 -5
  3. package/dist/{chunk-PQTDUFKU.js → chunk-HEKBPKGS.js} +6 -6
  4. package/dist/{chunk-PQTDUFKU.js.map → chunk-HEKBPKGS.js.map} +1 -1
  5. package/dist/{chunk-YXLOVEQZ.js → chunk-I2LRKHSL.js} +5 -5
  6. package/dist/{chunk-YXLOVEQZ.js.map → chunk-I2LRKHSL.js.map} +1 -1
  7. package/dist/{chunk-OEQJQ4OA.js → chunk-KRQWGGAJ.js} +244 -6
  8. package/dist/chunk-KRQWGGAJ.js.map +1 -0
  9. package/dist/{chunk-BWOGREWJ.js → chunk-LL6CG6KH.js} +3 -3
  10. package/dist/{chunk-BWOGREWJ.js.map → chunk-LL6CG6KH.js.map} +1 -1
  11. package/dist/{chunk-FZBLE44D.js → chunk-XQE4RVNO.js} +4 -4
  12. package/dist/chunk-XQE4RVNO.js.map +1 -0
  13. package/dist/components/index.js +2 -2
  14. package/dist/index.js +5 -5
  15. package/dist/primitives/index.d.ts +68 -1
  16. package/dist/primitives/index.js +1 -1
  17. package/dist/renderer/index.js +4 -4
  18. package/dist/server/index.js +4 -2
  19. package/dist/server/index.js.map +1 -1
  20. package/dist/server/islands/code-snippet.js +1 -1
  21. package/dist/server/islands/code-snippet.js.map +1 -1
  22. package/dist/server/islands/header-mobile-menu.js +1 -1
  23. package/dist/server/islands/header-mobile-menu.js.map +1 -1
  24. package/dist/server/islands/tabs.d.ts +23 -0
  25. package/dist/server/islands/tabs.js +86 -0
  26. package/dist/server/islands/tabs.js.map +1 -0
  27. package/dist/server/primitives.d.ts +81 -1
  28. package/dist/server/primitives.js +231 -36
  29. package/dist/server/primitives.js.map +1 -1
  30. package/dist/styles.css +78 -0
  31. package/package.json +1 -1
  32. package/dist/chunk-FZBLE44D.js.map +0 -1
  33. package/dist/chunk-OEQJQ4OA.js.map +0 -1
@@ -36,7 +36,7 @@ function CodeSnippet({ code, prompt, theme, className }) {
36
36
  "pre",
37
37
  {
38
38
  className: cn(
39
- "min-w-0 flex-1 overflow-x-auto whitespace-pre px-4 py-3 text-left",
39
+ "min-w-0 flex-1 overflow-x-auto whitespace-pre px-4 py-3 text-left [scrollbar-color:var(--border)_transparent] [scrollbar-width:thin]",
40
40
  typography?.fontFamily ?? "font-jetbrains-mono",
41
41
  typography?.fontSize ?? "text-sm",
42
42
  typography?.fontWeight,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/primitives/code-snippet.tsx","../../../src/primitives/lib/utils.ts"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { Check, Copy } from \"lucide-react\";\nimport type { ThemeStyle } from \"../models\";\nimport { cn } from \"./lib/utils\";\n\nexport interface CodeSnippetProps {\n code: string;\n /** Prefix shown before the first line, e.g. \"$\". Not copied. */\n prompt?: string;\n theme?: ThemeStyle;\n className?: string;\n}\n\n/**\n * A command or short code sample in a bordered monospace box with a copy\n * button — the `curl … | sh` install box of developer-tool landing pages.\n */\nexport function CodeSnippet({ code, prompt, theme, className }: CodeSnippetProps) {\n const [copied, setCopied] = React.useState(false);\n const typography = theme?.typography?.code;\n const card = theme?.interactives?.card;\n\n React.useEffect(() => {\n if (!copied) return;\n const timeout = setTimeout(() => setCopied(false), 2000);\n return () => clearTimeout(timeout);\n }, [copied]);\n\n return (\n <div\n className={cn(\n \"flex w-full min-w-0 items-start gap-3 border border-border bg-card text-card-foreground\",\n card?.border?.radius ?? \"rounded-md\",\n className,\n )}\n >\n <pre\n className={cn(\n \"min-w-0 flex-1 overflow-x-auto whitespace-pre px-4 py-3 text-left\",\n typography?.fontFamily ?? \"font-jetbrains-mono\",\n typography?.fontSize ?? \"text-sm\",\n typography?.fontWeight,\n typography?.lineHeight ?? \"leading-relaxed\",\n typography?.letterSpacing,\n )}\n >\n {prompt && (\n <span className=\"mr-2 select-none text-muted-foreground\" aria-hidden=\"true\">\n {prompt}\n </span>\n )}\n <code>{code}</code>\n </pre>\n <button\n type=\"button\"\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n title={copied ? \"Copied\" : \"Copy\"}\n className=\"m-1.5 inline-flex h-8 w-8 shrink-0 items-center justify-center text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n onClick={() => {\n void navigator.clipboard?.writeText(code).then(() => setCopied(true));\n }}\n >\n {copied ? (\n <Check className=\"h-4 w-4\" aria-hidden=\"true\" />\n ) : (\n <Copy className=\"h-4 w-4\" aria-hidden=\"true\" />\n )}\n </button>\n </div>\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"],"mappings":";;;;AAEA,OAAO,WAAW;AAClB,SAAS,OAAO,YAAY;;;ACH5B,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADiCM,SAWI,KAXJ;AAnBC,SAAS,YAAY,EAAE,MAAM,QAAQ,OAAO,UAAU,GAAqB;AAChF,QAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAS,KAAK;AAChD,QAAM,aAAa,OAAO,YAAY;AACtC,QAAM,OAAO,OAAO,cAAc;AAElC,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,OAAQ;AACb,UAAM,UAAU,WAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AACvD,WAAO,MAAM,aAAa,OAAO;AAAA,EACnC,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,MAAM,QAAQ,UAAU;AAAA,QACxB;AAAA,MACF;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA,YAAY,cAAc;AAAA,cAC1B,YAAY,YAAY;AAAA,cACxB,YAAY;AAAA,cACZ,YAAY,cAAc;AAAA,cAC1B,YAAY;AAAA,YACd;AAAA,YAEC;AAAA,wBACC,oBAAC,UAAK,WAAU,0CAAyC,eAAY,QAClE,kBACH;AAAA,cAEF,oBAAC,UAAM,gBAAK;AAAA;AAAA;AAAA,QACd;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY,SAAS,WAAW;AAAA,YAChC,OAAO,SAAS,WAAW;AAAA,YAC3B,WAAU;AAAA,YACV,SAAS,MAAM;AACb,mBAAK,UAAU,WAAW,UAAU,IAAI,EAAE,KAAK,MAAM,UAAU,IAAI,CAAC;AAAA,YACtE;AAAA,YAEC,mBACC,oBAAC,SAAM,WAAU,WAAU,eAAY,QAAO,IAE9C,oBAAC,QAAK,WAAU,WAAU,eAAY,QAAO;AAAA;AAAA,QAEjD;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../src/primitives/code-snippet.tsx","../../../src/primitives/lib/utils.ts"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { Check, Copy } from \"lucide-react\";\nimport type { ThemeStyle } from \"../models\";\nimport { cn } from \"./lib/utils\";\n\nexport interface CodeSnippetProps {\n code: string;\n /** Prefix shown before the first line, e.g. \"$\". Not copied. */\n prompt?: string;\n theme?: ThemeStyle;\n className?: string;\n}\n\n/**\n * A command or short code sample in a bordered monospace box with a copy\n * button — the `curl … | sh` install box of developer-tool landing pages.\n */\nexport function CodeSnippet({ code, prompt, theme, className }: CodeSnippetProps) {\n const [copied, setCopied] = React.useState(false);\n const typography = theme?.typography?.code;\n const card = theme?.interactives?.card;\n\n React.useEffect(() => {\n if (!copied) return;\n const timeout = setTimeout(() => setCopied(false), 2000);\n return () => clearTimeout(timeout);\n }, [copied]);\n\n return (\n <div\n className={cn(\n \"flex w-full min-w-0 items-start gap-3 border border-border bg-card text-card-foreground\",\n card?.border?.radius ?? \"rounded-md\",\n className,\n )}\n >\n <pre\n className={cn(\n \"min-w-0 flex-1 overflow-x-auto whitespace-pre px-4 py-3 text-left [scrollbar-color:var(--border)_transparent] [scrollbar-width:thin]\",\n typography?.fontFamily ?? \"font-jetbrains-mono\",\n typography?.fontSize ?? \"text-sm\",\n typography?.fontWeight,\n typography?.lineHeight ?? \"leading-relaxed\",\n typography?.letterSpacing,\n )}\n >\n {prompt && (\n <span className=\"mr-2 select-none text-muted-foreground\" aria-hidden=\"true\">\n {prompt}\n </span>\n )}\n <code>{code}</code>\n </pre>\n <button\n type=\"button\"\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n title={copied ? \"Copied\" : \"Copy\"}\n className=\"m-1.5 inline-flex h-8 w-8 shrink-0 items-center justify-center text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n onClick={() => {\n void navigator.clipboard?.writeText(code).then(() => setCopied(true));\n }}\n >\n {copied ? (\n <Check className=\"h-4 w-4\" aria-hidden=\"true\" />\n ) : (\n <Copy className=\"h-4 w-4\" aria-hidden=\"true\" />\n )}\n </button>\n </div>\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"],"mappings":";;;;AAEA,OAAO,WAAW;AAClB,SAAS,OAAO,YAAY;;;ACH5B,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADiCM,SAWI,KAXJ;AAnBC,SAAS,YAAY,EAAE,MAAM,QAAQ,OAAO,UAAU,GAAqB;AAChF,QAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAS,KAAK;AAChD,QAAM,aAAa,OAAO,YAAY;AACtC,QAAM,OAAO,OAAO,cAAc;AAElC,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,OAAQ;AACb,UAAM,UAAU,WAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AACvD,WAAO,MAAM,aAAa,OAAO;AAAA,EACnC,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,MAAM,QAAQ,UAAU;AAAA,QACxB;AAAA,MACF;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA,YAAY,cAAc;AAAA,cAC1B,YAAY,YAAY;AAAA,cACxB,YAAY;AAAA,cACZ,YAAY,cAAc;AAAA,cAC1B,YAAY;AAAA,YACd;AAAA,YAEC;AAAA,wBACC,oBAAC,UAAK,WAAU,0CAAyC,eAAY,QAClE,kBACH;AAAA,cAEF,oBAAC,UAAM,gBAAK;AAAA;AAAA;AAAA,QACd;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY,SAAS,WAAW;AAAA,YAChC,OAAO,SAAS,WAAW;AAAA,YAC3B,WAAU;AAAA,YACV,SAAS,MAAM;AACb,mBAAK,UAAU,WAAW,UAAU,IAAI,EAAE,KAAK,MAAM,UAAU,IAAI,CAAC;AAAA,YACtE;AAAA,YAEC,mBACC,oBAAC,SAAM,WAAU,WAAU,eAAY,QAAO,IAE9C,oBAAC,QAAK,WAAU,WAAU,eAAY,QAAO;AAAA;AAAA,QAEjD;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -286,7 +286,7 @@ function Drawer({
286
286
  setContainer(root ?? null);
287
287
  }, []);
288
288
  return /* @__PURE__ */ jsxs2(Sheet, { open, onOpenChange: setOpen, children: [
289
- /* @__PURE__ */ jsx5(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsx5("span", { ref: triggerWrapRef, children: trigger }) }),
289
+ /* @__PURE__ */ jsx5("span", { ref: triggerWrapRef, className: "contents", children: /* @__PURE__ */ jsx5(SheetTrigger, { asChild: true, children: trigger }) }),
290
290
  /* @__PURE__ */ jsx5(
291
291
  SheetContent,
292
292
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/blocks/header/mobile-menu.tsx","../../../src/components/nav-link.tsx","../../../src/primitives/lib/utils.ts","../../../src/primitives/components/ui/button.tsx","../../../src/primitives/button.tsx","../../../src/primitives/drawer.tsx","../../../src/primitives/components/ui/sheet.tsx","../../../src/primitives/link.tsx","../../../src/blocks/header/header-link.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { MenuIcon } from \"lucide-react\";\nimport type { ThemeStyle } from \"../../models\";\nimport type { HeaderNavLink } from \"./settings\";\nimport { NavLink } from \"../../components/nav-link\";\nimport { Button, Drawer } from \"../../primitives\";\nimport { HeaderLink } from \"./header-link\";\n\n/**\n * The header's mobile drawer. It is the only interactive part of the header,\n * so it is the only part sent to the browser on server-rendered pages.\n */\nexport function HeaderMobileMenu({\n links,\n ctaLabel,\n ctaHref,\n theme,\n}: {\n links: HeaderNavLink[];\n ctaLabel?: string;\n ctaHref?: string;\n theme: ThemeStyle;\n}) {\n const [open, setOpen] = useState(false);\n\n return (\n <Drawer\n open={open}\n setOpen={setOpen}\n side=\"right\"\n theme={theme}\n trigger={\n <Button variant=\"outline\" size=\"sm\" theme={theme}>\n <MenuIcon className=\"h-4 w-4\" />\n <span className=\"sr-only\">Toggle menu</span>\n </Button>\n }\n >\n <div className=\"mt-6 flex flex-col gap-4\">\n {links.map((link) => (\n <HeaderLink\n key={link.id}\n link={link}\n theme={theme}\n onClick={() => setOpen(false)}\n fullWidth\n />\n ))}\n {ctaLabel && ctaHref && (\n <NavLink href={ctaHref} onClick={() => setOpen(false)}>\n <Button theme={theme} className=\"w-full\">\n {ctaLabel}\n </Button>\n </NavLink>\n )}\n </div>\n </Drawer>\n );\n}\n","\"use client\";\n\nimport * as React from \"react\";\n\nexport interface PageBuilderLinkProps {\n href: string;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n target?: string;\n rel?: string;\n}\n\n/**\n * Optional host-supplied link. Next.js apps can pass `next/link`; Vite / Remix\n * / plain React hosts can omit it and NavLink will render a native `<a>`.\n */\nexport type PageBuilderLinkComponent = React.ComponentType<PageBuilderLinkProps>;\n\n// Server-rendered pages load this module more than once (each client island is\n// bundled on its own), so the context is shared through the global registry\n// rather than created per copy. Otherwise a provider from one copy would be\n// invisible to a NavLink from another.\nconst LINK_CONTEXT_KEY = Symbol.for(\"@frontlit/page-builder/link-context\");\nconst globalRegistry = globalThis as typeof globalThis & {\n [LINK_CONTEXT_KEY]?: React.Context<PageBuilderLinkComponent | null>;\n};\nconst PageBuilderLinkContext = (globalRegistry[LINK_CONTEXT_KEY] ??=\n React.createContext<PageBuilderLinkComponent | null>(null));\n\nexport function PageBuilderLinkProvider({\n component,\n children,\n}: {\n component?: PageBuilderLinkComponent | null;\n children: React.ReactNode;\n}) {\n return (\n <PageBuilderLinkContext.Provider value={component ?? null}>\n {children}\n </PageBuilderLinkContext.Provider>\n );\n}\n\nexport function usePageBuilderLinkComponent() {\n return React.useContext(PageBuilderLinkContext);\n}\n\ninterface NavLinkProps {\n href: string;\n children?: React.ReactNode;\n openInSameTab?: boolean;\n style?: React.CSSProperties;\n className?: string;\n onClick?: () => void;\n}\n\n/**\n * A navigation-aware link used inside block widgets. In-page anchors scroll\n * to the target. Internal paths (`/...`) use the host `linkComponent` when\n * one is provided (e.g. Next.js `Link`); everything else is a native `<a>`.\n */\nexport function NavLink({\n href,\n children,\n openInSameTab = true,\n style,\n className = \"\",\n onClick,\n}: NavLinkProps) {\n const LinkComponent = usePageBuilderLinkComponent();\n const isInternal = Boolean(href && href.startsWith(\"/\"));\n const isInPageNavigation = Boolean(href && href.startsWith(\"#\"));\n const target = openInSameTab ? undefined : \"_blank\";\n const rel = target === \"_blank\" ? \"noopener noreferrer\" : undefined;\n const handleClick: React.MouseEventHandler<HTMLAnchorElement> = () => {\n onClick?.();\n };\n\n if (!isInPageNavigation && isInternal && LinkComponent) {\n return (\n <LinkComponent\n href={href}\n style={style}\n className={className}\n onClick={handleClick}\n target={target}\n rel={rel}\n >\n {children}\n </LinkComponent>\n );\n }\n\n return (\n <a\n href={href}\n style={style}\n className={className}\n target={target}\n rel={rel}\n onClick={handleClick}\n >\n {children}\n </a>\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","\"use client\";\n\nimport { type ReactNode, useLayoutEffect, useRef, useState } from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { Sheet, SheetContent, SheetTrigger } from \"./components/ui/sheet\";\nimport { cn } from \"./lib/utils\";\n\ninterface DrawerProps {\n trigger: ReactNode;\n children: ReactNode;\n side?: \"left\" | \"right\" | \"top\" | \"bottom\";\n open: boolean;\n setOpen: (open: boolean) => void;\n style?: React.CSSProperties;\n className?: string;\n theme?: ThemeStyle;\n}\n\nexport function Drawer({\n trigger,\n children,\n side = \"left\",\n open,\n setOpen,\n style,\n className = \"\",\n theme: _theme,\n}: DrawerProps) {\n const triggerWrapRef = useRef<HTMLSpanElement>(null);\n const [container, setContainer] = useState<HTMLElement | null>(null);\n\n useLayoutEffect(() => {\n const root = triggerWrapRef.current?.closest<HTMLElement>(\n \"[data-pb-theme], .pb-theme\",\n );\n // Not `instanceof HTMLElement`: inside the builder's preview iframe the\n // root belongs to the iframe's realm, so that check always fails and the\n // sheet would open over the whole editor instead of the preview.\n setContainer(root ?? null);\n }, []);\n\n return (\n <Sheet open={open} onOpenChange={setOpen}>\n <SheetTrigger asChild>\n <span ref={triggerWrapRef}>{trigger}</span>\n </SheetTrigger>\n <SheetContent\n side={side}\n style={style}\n container={container}\n className={cn(\n \"bg-background text-foreground\",\n !container && \"pb-theme\",\n className,\n )}\n >\n {children}\n </SheetContent>\n </Sheet>\n );\n}\n","import * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst Sheet = SheetPrimitive.Root;\n\nconst SheetTrigger = SheetPrimitive.Trigger;\n\nconst SheetClose = SheetPrimitive.Close;\n\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Overlay\n className={cn(\n \"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n className,\n )}\n {...props}\n ref={ref}\n />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\n \"fixed z-50 gap-4 bg-background p-6 text-foreground shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n {\n variants: {\n side: {\n top: \"inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n bottom:\n \"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n right:\n \"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n },\n },\n defaultVariants: {\n side: \"right\",\n },\n },\n);\n\ninterface SheetContentProps\n extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n VariantProps<typeof sheetVariants> {\n /** Mount the overlay and panel here so scoped theme tokens still apply. */\n container?: HTMLElement | null;\n}\n\nconst SheetContent = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Content>,\n SheetContentProps\n>(({ side = \"right\", className, children, container, ...props }, ref) => (\n <SheetPortal container={container ?? undefined}>\n <SheetOverlay />\n <SheetPrimitive.Content\n ref={ref}\n className={cn(sheetVariants({ side }), className)}\n {...props}\n >\n {children}\n <SheetPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\">\n <X className=\"h-4 w-4\" />\n <span className=\"sr-only\">Close</span>\n </SheetPrimitive.Close>\n </SheetPrimitive.Content>\n </SheetPortal>\n));\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\"flex flex-col space-y-2 text-center sm:text-left\", className)}\n {...props}\n />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n className,\n )}\n {...props}\n />\n);\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Title\n ref={ref}\n className={cn(\"text-lg font-semibold text-foreground\", className)}\n {...props}\n />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Description\n ref={ref}\n className={cn(\"text-sm text-muted-foreground\", className)}\n {...props}\n />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n Sheet,\n SheetClose,\n SheetContent,\n SheetDescription,\n SheetFooter,\n SheetHeader,\n SheetOverlay,\n SheetPortal,\n SheetTitle,\n SheetTrigger,\n};\n","import type React from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { cn } from \"./lib/utils\";\n\nexport interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n children: React.ReactNode;\n className?: string;\n theme?: ThemeStyle;\n disabled?: boolean;\n style?: React.CSSProperties;\n}\n\nexport const Link: React.FC<LinkProps> = ({\n children,\n className = \"\",\n theme,\n disabled = false,\n style,\n ...props\n}) => {\n const typographyStyles = theme?.typography?.link;\n const linkStyles = theme?.interactives?.link;\n const classes = cn(\n // Base styles\n \"font-medium cursor-pointer\",\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 linkStyles?.padding?.x,\n linkStyles?.padding?.y,\n linkStyles?.border?.width,\n linkStyles?.border?.radius,\n linkStyles?.border?.style,\n // Theme disabled states\n disabled && linkStyles?.disabled?.color,\n disabled && linkStyles?.disabled?.background,\n disabled && linkStyles?.disabled?.border,\n disabled && linkStyles?.disabled?.opacity,\n disabled && linkStyles?.disabled?.cursor,\n // User overrides\n linkStyles?.custom,\n className,\n );\n\n return (\n <span\n className={classes}\n style={{\n ...style,\n textShadow: linkStyles?.textShadow || undefined,\n }}\n {...props}\n >\n {children}\n </span>\n );\n};\n","import type { ThemeStyle } from \"../../models\";\nimport type { HeaderNavLink } from \"./settings\";\nimport { NavLink } from \"../../components/nav-link\";\nimport { Button, Link as PrimitiveLink } from \"../../primitives\";\n\nexport function HeaderLink({\n link,\n theme,\n onClick,\n fullWidth = false,\n}: {\n link: HeaderNavLink;\n theme?: ThemeStyle;\n onClick?: () => void;\n /** Mobile menu: button links span the sheet, like the CTA. */\n fullWidth?: boolean;\n}) {\n if (link.isButton) {\n return (\n <NavLink href={link.href} onClick={onClick}>\n <Button\n size={fullWidth ? undefined : \"sm\"}\n theme={theme}\n className={fullWidth ? \"w-full\" : undefined}\n >\n {link.label}\n </Button>\n </NavLink>\n );\n }\n\n return (\n <NavLink href={link.href} onClick={onClick} className=\"no-underline\">\n <PrimitiveLink theme={theme} className=\"no-underline\">\n {link.label}\n </PrimitiveLink>\n </NavLink>\n );\n}\n"],"mappings":"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","names":["useState","React","jsx","jsx","Button","cva","React","jsx","jsx","cva","jsx","jsxs","jsx","jsx","Button","jsx","jsxs","useState","Button"]}
1
+ {"version":3,"sources":["../../../src/blocks/header/mobile-menu.tsx","../../../src/components/nav-link.tsx","../../../src/primitives/lib/utils.ts","../../../src/primitives/components/ui/button.tsx","../../../src/primitives/button.tsx","../../../src/primitives/drawer.tsx","../../../src/primitives/components/ui/sheet.tsx","../../../src/primitives/link.tsx","../../../src/blocks/header/header-link.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { MenuIcon } from \"lucide-react\";\nimport type { ThemeStyle } from \"../../models\";\nimport type { HeaderNavLink } from \"./settings\";\nimport { NavLink } from \"../../components/nav-link\";\nimport { Button, Drawer } from \"../../primitives\";\nimport { HeaderLink } from \"./header-link\";\n\n/**\n * The header's mobile drawer. It is the only interactive part of the header,\n * so it is the only part sent to the browser on server-rendered pages.\n */\nexport function HeaderMobileMenu({\n links,\n ctaLabel,\n ctaHref,\n theme,\n}: {\n links: HeaderNavLink[];\n ctaLabel?: string;\n ctaHref?: string;\n theme: ThemeStyle;\n}) {\n const [open, setOpen] = useState(false);\n\n return (\n <Drawer\n open={open}\n setOpen={setOpen}\n side=\"right\"\n theme={theme}\n trigger={\n <Button variant=\"outline\" size=\"sm\" theme={theme}>\n <MenuIcon className=\"h-4 w-4\" />\n <span className=\"sr-only\">Toggle menu</span>\n </Button>\n }\n >\n <div className=\"mt-6 flex flex-col gap-4\">\n {links.map((link) => (\n <HeaderLink\n key={link.id}\n link={link}\n theme={theme}\n onClick={() => setOpen(false)}\n fullWidth\n />\n ))}\n {ctaLabel && ctaHref && (\n <NavLink href={ctaHref} onClick={() => setOpen(false)}>\n <Button theme={theme} className=\"w-full\">\n {ctaLabel}\n </Button>\n </NavLink>\n )}\n </div>\n </Drawer>\n );\n}\n","\"use client\";\n\nimport * as React from \"react\";\n\nexport interface PageBuilderLinkProps {\n href: string;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n target?: string;\n rel?: string;\n}\n\n/**\n * Optional host-supplied link. Next.js apps can pass `next/link`; Vite / Remix\n * / plain React hosts can omit it and NavLink will render a native `<a>`.\n */\nexport type PageBuilderLinkComponent = React.ComponentType<PageBuilderLinkProps>;\n\n// Server-rendered pages load this module more than once (each client island is\n// bundled on its own), so the context is shared through the global registry\n// rather than created per copy. Otherwise a provider from one copy would be\n// invisible to a NavLink from another.\nconst LINK_CONTEXT_KEY = Symbol.for(\"@frontlit/page-builder/link-context\");\nconst globalRegistry = globalThis as typeof globalThis & {\n [LINK_CONTEXT_KEY]?: React.Context<PageBuilderLinkComponent | null>;\n};\nconst PageBuilderLinkContext = (globalRegistry[LINK_CONTEXT_KEY] ??=\n React.createContext<PageBuilderLinkComponent | null>(null));\n\nexport function PageBuilderLinkProvider({\n component,\n children,\n}: {\n component?: PageBuilderLinkComponent | null;\n children: React.ReactNode;\n}) {\n return (\n <PageBuilderLinkContext.Provider value={component ?? null}>\n {children}\n </PageBuilderLinkContext.Provider>\n );\n}\n\nexport function usePageBuilderLinkComponent() {\n return React.useContext(PageBuilderLinkContext);\n}\n\ninterface NavLinkProps {\n href: string;\n children?: React.ReactNode;\n openInSameTab?: boolean;\n style?: React.CSSProperties;\n className?: string;\n onClick?: () => void;\n}\n\n/**\n * A navigation-aware link used inside block widgets. In-page anchors scroll\n * to the target. Internal paths (`/...`) use the host `linkComponent` when\n * one is provided (e.g. Next.js `Link`); everything else is a native `<a>`.\n */\nexport function NavLink({\n href,\n children,\n openInSameTab = true,\n style,\n className = \"\",\n onClick,\n}: NavLinkProps) {\n const LinkComponent = usePageBuilderLinkComponent();\n const isInternal = Boolean(href && href.startsWith(\"/\"));\n const isInPageNavigation = Boolean(href && href.startsWith(\"#\"));\n const target = openInSameTab ? undefined : \"_blank\";\n const rel = target === \"_blank\" ? \"noopener noreferrer\" : undefined;\n const handleClick: React.MouseEventHandler<HTMLAnchorElement> = () => {\n onClick?.();\n };\n\n if (!isInPageNavigation && isInternal && LinkComponent) {\n return (\n <LinkComponent\n href={href}\n style={style}\n className={className}\n onClick={handleClick}\n target={target}\n rel={rel}\n >\n {children}\n </LinkComponent>\n );\n }\n\n return (\n <a\n href={href}\n style={style}\n className={className}\n target={target}\n rel={rel}\n onClick={handleClick}\n >\n {children}\n </a>\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","\"use client\";\n\nimport { type ReactNode, useLayoutEffect, useRef, useState } from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { Sheet, SheetContent, SheetTrigger } from \"./components/ui/sheet\";\nimport { cn } from \"./lib/utils\";\n\ninterface DrawerProps {\n trigger: ReactNode;\n children: ReactNode;\n side?: \"left\" | \"right\" | \"top\" | \"bottom\";\n open: boolean;\n setOpen: (open: boolean) => void;\n style?: React.CSSProperties;\n className?: string;\n theme?: ThemeStyle;\n}\n\nexport function Drawer({\n trigger,\n children,\n side = \"left\",\n open,\n setOpen,\n style,\n className = \"\",\n theme: _theme,\n}: DrawerProps) {\n const triggerWrapRef = useRef<HTMLSpanElement>(null);\n const [container, setContainer] = useState<HTMLElement | null>(null);\n\n useLayoutEffect(() => {\n const root = triggerWrapRef.current?.closest<HTMLElement>(\n \"[data-pb-theme], .pb-theme\",\n );\n // Not `instanceof HTMLElement`: inside the builder's preview iframe the\n // root belongs to the iframe's realm, so that check always fails and the\n // sheet would open over the whole editor instead of the preview.\n setContainer(root ?? null);\n }, []);\n\n return (\n <Sheet open={open} onOpenChange={setOpen}>\n {/* The trigger itself gets the trigger props (a span with\n type=\"button\" around a button is invalid ARIA); the span only\n finds the theme root. */}\n <span ref={triggerWrapRef} className=\"contents\">\n <SheetTrigger asChild>{trigger}</SheetTrigger>\n </span>\n <SheetContent\n side={side}\n style={style}\n container={container}\n className={cn(\n \"bg-background text-foreground\",\n !container && \"pb-theme\",\n className,\n )}\n >\n {children}\n </SheetContent>\n </Sheet>\n );\n}\n","import * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst Sheet = SheetPrimitive.Root;\n\nconst SheetTrigger = SheetPrimitive.Trigger;\n\nconst SheetClose = SheetPrimitive.Close;\n\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Overlay\n className={cn(\n \"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n className,\n )}\n {...props}\n ref={ref}\n />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\n \"fixed z-50 gap-4 bg-background p-6 text-foreground shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n {\n variants: {\n side: {\n top: \"inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n bottom:\n \"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n right:\n \"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n },\n },\n defaultVariants: {\n side: \"right\",\n },\n },\n);\n\ninterface SheetContentProps\n extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n VariantProps<typeof sheetVariants> {\n /** Mount the overlay and panel here so scoped theme tokens still apply. */\n container?: HTMLElement | null;\n}\n\nconst SheetContent = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Content>,\n SheetContentProps\n>(({ side = \"right\", className, children, container, ...props }, ref) => (\n <SheetPortal container={container ?? undefined}>\n <SheetOverlay />\n <SheetPrimitive.Content\n ref={ref}\n className={cn(sheetVariants({ side }), className)}\n {...props}\n >\n {children}\n <SheetPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\">\n <X className=\"h-4 w-4\" />\n <span className=\"sr-only\">Close</span>\n </SheetPrimitive.Close>\n </SheetPrimitive.Content>\n </SheetPortal>\n));\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\"flex flex-col space-y-2 text-center sm:text-left\", className)}\n {...props}\n />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n className,\n )}\n {...props}\n />\n);\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Title\n ref={ref}\n className={cn(\"text-lg font-semibold text-foreground\", className)}\n {...props}\n />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Description\n ref={ref}\n className={cn(\"text-sm text-muted-foreground\", className)}\n {...props}\n />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n Sheet,\n SheetClose,\n SheetContent,\n SheetDescription,\n SheetFooter,\n SheetHeader,\n SheetOverlay,\n SheetPortal,\n SheetTitle,\n SheetTrigger,\n};\n","import type React from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { cn } from \"./lib/utils\";\n\nexport interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n children: React.ReactNode;\n className?: string;\n theme?: ThemeStyle;\n disabled?: boolean;\n style?: React.CSSProperties;\n}\n\nexport const Link: React.FC<LinkProps> = ({\n children,\n className = \"\",\n theme,\n disabled = false,\n style,\n ...props\n}) => {\n const typographyStyles = theme?.typography?.link;\n const linkStyles = theme?.interactives?.link;\n const classes = cn(\n // Base styles\n \"font-medium cursor-pointer\",\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 linkStyles?.padding?.x,\n linkStyles?.padding?.y,\n linkStyles?.border?.width,\n linkStyles?.border?.radius,\n linkStyles?.border?.style,\n // Theme disabled states\n disabled && linkStyles?.disabled?.color,\n disabled && linkStyles?.disabled?.background,\n disabled && linkStyles?.disabled?.border,\n disabled && linkStyles?.disabled?.opacity,\n disabled && linkStyles?.disabled?.cursor,\n // User overrides\n linkStyles?.custom,\n className,\n );\n\n return (\n <span\n className={classes}\n style={{\n ...style,\n textShadow: linkStyles?.textShadow || undefined,\n }}\n {...props}\n >\n {children}\n </span>\n );\n};\n","import type { ThemeStyle } from \"../../models\";\nimport type { HeaderNavLink } from \"./settings\";\nimport { NavLink } from \"../../components/nav-link\";\nimport { Button, Link as PrimitiveLink } from \"../../primitives\";\n\nexport function HeaderLink({\n link,\n theme,\n onClick,\n fullWidth = false,\n}: {\n link: HeaderNavLink;\n theme?: ThemeStyle;\n onClick?: () => void;\n /** Mobile menu: button links span the sheet, like the CTA. */\n fullWidth?: boolean;\n}) {\n if (link.isButton) {\n return (\n <NavLink href={link.href} onClick={onClick}>\n <Button\n size={fullWidth ? undefined : \"sm\"}\n theme={theme}\n className={fullWidth ? \"w-full\" : undefined}\n >\n {link.label}\n </Button>\n </NavLink>\n );\n }\n\n return (\n <NavLink href={link.href} onClick={onClick} className=\"no-underline\">\n <PrimitiveLink theme={theme} className=\"no-underline\">\n {link.label}\n </PrimitiveLink>\n </NavLink>\n );\n}\n"],"mappings":"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","names":["useState","React","jsx","jsx","Button","cva","React","jsx","jsx","cva","jsx","jsxs","jsx","jsx","Button","jsx","jsxs","useState","Button"]}
@@ -0,0 +1,23 @@
1
+ import React__default from 'react';
2
+ import { T as ThemeStyle } from '../theme-style-5_AGy-4V.js';
3
+
4
+ interface TabsItem {
5
+ label: React__default.ReactNode;
6
+ content: React__default.ReactNode;
7
+ }
8
+ interface TabsProps {
9
+ items: TabsItem[];
10
+ /** Accessible name of the tab list. */
11
+ label: string;
12
+ defaultIndex?: number;
13
+ theme?: ThemeStyle;
14
+ className?: string;
15
+ }
16
+ /**
17
+ * Accessible tabs (WAI-ARIA tab pattern with arrow-key navigation). Every
18
+ * panel is rendered, inactive ones `hidden`, so server-rendered content is
19
+ * in the HTML before hydration.
20
+ */
21
+ declare function Tabs({ items, label, defaultIndex, theme, className }: TabsProps): React__default.JSX.Element;
22
+
23
+ export { Tabs, type TabsItem, type TabsProps };
@@ -0,0 +1,86 @@
1
+ "use client";
2
+ "use client";
3
+
4
+ // src/primitives/tabs.tsx
5
+ import React from "react";
6
+
7
+ // src/primitives/lib/utils.ts
8
+ import { clsx } from "clsx";
9
+ import { twMerge } from "tailwind-merge";
10
+ function cn(...inputs) {
11
+ return twMerge(clsx(inputs));
12
+ }
13
+
14
+ // src/primitives/tabs.tsx
15
+ import { jsx, jsxs } from "react/jsx-runtime";
16
+ function Tabs({ items, label, defaultIndex = 0, theme, className }) {
17
+ const [active, setActive] = React.useState(
18
+ Math.min(Math.max(defaultIndex, 0), Math.max(items.length - 1, 0))
19
+ );
20
+ const id = React.useId();
21
+ const tabs = React.useRef([]);
22
+ const typography = theme?.typography?.text2;
23
+ const select = (index) => {
24
+ const next = (index + items.length) % items.length;
25
+ setActive(next);
26
+ tabs.current[next]?.focus();
27
+ };
28
+ return /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 flex-col gap-3", className), children: [
29
+ /* @__PURE__ */ jsx(
30
+ "div",
31
+ {
32
+ role: "tablist",
33
+ "aria-label": label,
34
+ className: "flex min-w-0 gap-1 overflow-x-auto overflow-y-hidden border-b border-border [scrollbar-width:none]",
35
+ onKeyDown: (event) => {
36
+ if (event.key === "ArrowRight") select(active + 1);
37
+ else if (event.key === "ArrowLeft") select(active - 1);
38
+ else if (event.key === "Home") select(0);
39
+ else if (event.key === "End") select(items.length - 1);
40
+ else return;
41
+ event.preventDefault();
42
+ },
43
+ children: items.map((item, index) => /* @__PURE__ */ jsx(
44
+ "button",
45
+ {
46
+ ref: (element) => {
47
+ tabs.current[index] = element;
48
+ },
49
+ type: "button",
50
+ role: "tab",
51
+ id: `${id}-tab-${index}`,
52
+ "aria-selected": index === active,
53
+ "aria-controls": `${id}-panel-${index}`,
54
+ tabIndex: index === active ? 0 : -1,
55
+ onClick: () => setActive(index),
56
+ className: cn(
57
+ "shrink-0 whitespace-nowrap border-b-2 px-2 py-1.5 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
58
+ typography?.fontFamily,
59
+ typography?.fontSize ?? "text-sm",
60
+ typography?.letterSpacing,
61
+ index === active ? "border-primary font-medium text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
62
+ ),
63
+ children: item.label
64
+ },
65
+ index
66
+ ))
67
+ }
68
+ ),
69
+ items.map((item, index) => /* @__PURE__ */ jsx(
70
+ "div",
71
+ {
72
+ role: "tabpanel",
73
+ id: `${id}-panel-${index}`,
74
+ "aria-labelledby": `${id}-tab-${index}`,
75
+ hidden: index !== active,
76
+ className: "min-w-0",
77
+ children: item.content
78
+ },
79
+ index
80
+ ))
81
+ ] });
82
+ }
83
+ export {
84
+ Tabs
85
+ };
86
+ //# sourceMappingURL=tabs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/primitives/tabs.tsx","../../../src/primitives/lib/utils.ts"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport type { ThemeStyle } from \"../models\";\nimport { cn } from \"./lib/utils\";\n\nexport interface TabsItem {\n label: React.ReactNode;\n content: React.ReactNode;\n}\n\nexport interface TabsProps {\n items: TabsItem[];\n /** Accessible name of the tab list. */\n label: string;\n defaultIndex?: number;\n theme?: ThemeStyle;\n className?: string;\n}\n\n/**\n * Accessible tabs (WAI-ARIA tab pattern with arrow-key navigation). Every\n * panel is rendered, inactive ones `hidden`, so server-rendered content is\n * in the HTML before hydration.\n */\nexport function Tabs({ items, label, defaultIndex = 0, theme, className }: TabsProps) {\n const [active, setActive] = React.useState(\n Math.min(Math.max(defaultIndex, 0), Math.max(items.length - 1, 0)),\n );\n const id = React.useId();\n const tabs = React.useRef<(HTMLButtonElement | null)[]>([]);\n const typography = theme?.typography?.text2;\n\n const select = (index: number) => {\n const next = (index + items.length) % items.length;\n setActive(next);\n tabs.current[next]?.focus();\n };\n\n return (\n <div className={cn(\"flex min-w-0 flex-col gap-3\", className)}>\n <div\n role=\"tablist\"\n aria-label={label}\n className=\"flex min-w-0 gap-1 overflow-x-auto overflow-y-hidden border-b border-border [scrollbar-width:none]\"\n onKeyDown={(event) => {\n if (event.key === \"ArrowRight\") select(active + 1);\n else if (event.key === \"ArrowLeft\") select(active - 1);\n else if (event.key === \"Home\") select(0);\n else if (event.key === \"End\") select(items.length - 1);\n else return;\n event.preventDefault();\n }}\n >\n {items.map((item, index) => (\n <button\n key={index}\n ref={(element) => {\n tabs.current[index] = element;\n }}\n type=\"button\"\n role=\"tab\"\n id={`${id}-tab-${index}`}\n aria-selected={index === active}\n aria-controls={`${id}-panel-${index}`}\n tabIndex={index === active ? 0 : -1}\n onClick={() => setActive(index)}\n className={cn(\n \"shrink-0 whitespace-nowrap border-b-2 px-2 py-1.5 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring\",\n typography?.fontFamily,\n typography?.fontSize ?? \"text-sm\",\n typography?.letterSpacing,\n index === active\n ? \"border-primary font-medium text-foreground\"\n : \"border-transparent text-muted-foreground hover:text-foreground\",\n )}\n >\n {item.label}\n </button>\n ))}\n </div>\n {items.map((item, index) => (\n <div\n key={index}\n role=\"tabpanel\"\n id={`${id}-panel-${index}`}\n aria-labelledby={`${id}-tab-${index}`}\n hidden={index !== active}\n className=\"min-w-0\"\n >\n {item.content}\n </div>\n ))}\n </div>\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"],"mappings":";;;;AAEA,OAAO,WAAW;;;ACFlB,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADmCI,SAeM,KAfN;AAfG,SAAS,KAAK,EAAE,OAAO,OAAO,eAAe,GAAG,OAAO,UAAU,GAAc;AACpF,QAAM,CAAC,QAAQ,SAAS,IAAI,MAAM;AAAA,IAChC,KAAK,IAAI,KAAK,IAAI,cAAc,CAAC,GAAG,KAAK,IAAI,MAAM,SAAS,GAAG,CAAC,CAAC;AAAA,EACnE;AACA,QAAM,KAAK,MAAM,MAAM;AACvB,QAAM,OAAO,MAAM,OAAqC,CAAC,CAAC;AAC1D,QAAM,aAAa,OAAO,YAAY;AAEtC,QAAM,SAAS,CAAC,UAAkB;AAChC,UAAM,QAAQ,QAAQ,MAAM,UAAU,MAAM;AAC5C,cAAU,IAAI;AACd,SAAK,QAAQ,IAAI,GAAG,MAAM;AAAA,EAC5B;AAEA,SACE,qBAAC,SAAI,WAAW,GAAG,+BAA+B,SAAS,GACzD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,WAAW,CAAC,UAAU;AACpB,cAAI,MAAM,QAAQ,aAAc,QAAO,SAAS,CAAC;AAAA,mBACxC,MAAM,QAAQ,YAAa,QAAO,SAAS,CAAC;AAAA,mBAC5C,MAAM,QAAQ,OAAQ,QAAO,CAAC;AAAA,mBAC9B,MAAM,QAAQ,MAAO,QAAO,MAAM,SAAS,CAAC;AAAA,cAChD;AACL,gBAAM,eAAe;AAAA,QACvB;AAAA,QAEC,gBAAM,IAAI,CAAC,MAAM,UAChB;AAAA,UAAC;AAAA;AAAA,YAEC,KAAK,CAAC,YAAY;AAChB,mBAAK,QAAQ,KAAK,IAAI;AAAA,YACxB;AAAA,YACA,MAAK;AAAA,YACL,MAAK;AAAA,YACL,IAAI,GAAG,EAAE,QAAQ,KAAK;AAAA,YACtB,iBAAe,UAAU;AAAA,YACzB,iBAAe,GAAG,EAAE,UAAU,KAAK;AAAA,YACnC,UAAU,UAAU,SAAS,IAAI;AAAA,YACjC,SAAS,MAAM,UAAU,KAAK;AAAA,YAC9B,WAAW;AAAA,cACT;AAAA,cACA,YAAY;AAAA,cACZ,YAAY,YAAY;AAAA,cACxB,YAAY;AAAA,cACZ,UAAU,SACN,+CACA;AAAA,YACN;AAAA,YAEC,eAAK;AAAA;AAAA,UArBD;AAAA,QAsBP,CACD;AAAA;AAAA,IACH;AAAA,IACC,MAAM,IAAI,CAAC,MAAM,UAChB;AAAA,MAAC;AAAA;AAAA,QAEC,MAAK;AAAA,QACL,IAAI,GAAG,EAAE,UAAU,KAAK;AAAA,QACxB,mBAAiB,GAAG,EAAE,QAAQ,KAAK;AAAA,QACnC,QAAQ,UAAU;AAAA,QAClB,WAAU;AAAA,QAET,eAAK;AAAA;AAAA,MAPD;AAAA,IAQP,CACD;AAAA,KACH;AAEJ;","names":[]}
@@ -106,6 +106,32 @@ declare const PageCardImage: React__default.FC<PageCardImageProps>;
106
106
  declare const PageCardContent: React__default.FC<PageCardContentProps>;
107
107
  declare const PageCardHeader: React__default.FC<PageCardHeaderProps>;
108
108
 
109
+ interface CodeSnippetProps {
110
+ code: string;
111
+ /** Prefix shown before the first line, e.g. "$". Not copied. */
112
+ prompt?: string;
113
+ theme?: ThemeStyle;
114
+ className?: string;
115
+ }
116
+ /**
117
+ * A command or short code sample in a bordered monospace box with a copy
118
+ * button — the `curl … | sh` install box of developer-tool landing pages.
119
+ */
120
+ declare function CodeSnippet({ code, prompt, theme, className }: CodeSnippetProps): React__default.JSX.Element;
121
+
122
+ interface CollapsibleProps {
123
+ summary: React__default.ReactNode;
124
+ children: React__default.ReactNode;
125
+ defaultOpen?: boolean;
126
+ /** `bordered` draws a card-like box; `plain` only the toggle row. */
127
+ variant?: "bordered" | "plain";
128
+ id?: string;
129
+ theme?: ThemeStyle;
130
+ className?: string;
131
+ }
132
+ /** A disclosure built on native `<details>`: works without JavaScript. */
133
+ declare function Collapsible({ summary, children, defaultOpen, variant, id, theme, className, }: CollapsibleProps): React__default.JSX.Element;
134
+
109
135
  type HeadingTag = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | "div";
110
136
  interface HeadingProps extends TypographyProps {
111
137
  /** Element to render. Lets a block pick its heading level independently of its look. */
@@ -147,6 +173,15 @@ interface ImageProps extends React__default.ImgHTMLAttributes<HTMLImageElement>
147
173
  }
148
174
  declare const Image: React__default.FC<ImageProps>;
149
175
 
176
+ interface InlineCodeProps extends React__default.HTMLAttributes<HTMLElement> {
177
+ children: React__default.ReactNode;
178
+ theme?: ThemeStyle;
179
+ /** `muted` drops the background, for secondary details like types. */
180
+ variant?: "default" | "muted";
181
+ }
182
+ /** Code inside running text: identifiers, paths, field names and values. */
183
+ declare function InlineCode({ children, theme, variant, className, ...props }: InlineCodeProps): React__default.JSX.Element;
184
+
150
185
  interface InputProps extends React__default.InputHTMLAttributes<HTMLInputElement> {
151
186
  theme?: ThemeStyle;
152
187
  error?: boolean;
@@ -168,6 +203,15 @@ interface LinkProps extends React__default.AnchorHTMLAttributes<HTMLAnchorElemen
168
203
  }
169
204
  declare const Link: React__default.FC<LinkProps>;
170
205
 
206
+ interface NativeSelectProps extends React__default.SelectHTMLAttributes<HTMLSelectElement> {
207
+ theme?: ThemeStyle;
208
+ }
209
+ /**
210
+ * A themed native `<select>`. Use it where a page must stay light (it ships
211
+ * no JavaScript); `Select` is the richer Radix-based control.
212
+ */
213
+ declare const NativeSelect: React__default.ForwardRefExoticComponent<NativeSelectProps & React__default.RefAttributes<HTMLSelectElement>>;
214
+
171
215
  declare const Preheader: React__default.FC<TypographyProps>;
172
216
 
173
217
  interface SectionProps extends React__default.HTMLAttributes<HTMLElement> {
@@ -185,6 +229,42 @@ declare const Subheader1: React__default.FC<TypographyProps & {
185
229
 
186
230
  declare const Subheader2: React__default.FC<TypographyProps>;
187
231
 
232
+ interface TableColumn {
233
+ key: string;
234
+ label: string;
235
+ className?: string;
236
+ }
237
+ interface TableProps {
238
+ columns: TableColumn[];
239
+ rows: Record<string, React__default.ReactNode>[];
240
+ theme?: ThemeStyle;
241
+ className?: string;
242
+ }
243
+ /**
244
+ * A themed data table. On narrow screens each row stacks into a block, with
245
+ * the column name shown before every value.
246
+ */
247
+ declare function Table({ columns, rows, theme, className }: TableProps): React__default.JSX.Element;
248
+
249
+ interface TabsItem {
250
+ label: React__default.ReactNode;
251
+ content: React__default.ReactNode;
252
+ }
253
+ interface TabsProps {
254
+ items: TabsItem[];
255
+ /** Accessible name of the tab list. */
256
+ label: string;
257
+ defaultIndex?: number;
258
+ theme?: ThemeStyle;
259
+ className?: string;
260
+ }
261
+ /**
262
+ * Accessible tabs (WAI-ARIA tab pattern with arrow-key navigation). Every
263
+ * panel is rendered, inactive ones `hidden`, so server-rendered content is
264
+ * in the HTML before hydration.
265
+ */
266
+ declare function Tabs({ items, label, defaultIndex, theme, className }: TabsProps): React__default.JSX.Element;
267
+
188
268
  declare const Text1: React__default.FC<TypographyProps & {
189
269
  component?: "p" | "span";
190
270
  }>;
@@ -199,4 +279,4 @@ interface TextareaProps extends React__default.TextareaHTMLAttributes<HTMLTextAr
199
279
  }
200
280
  declare const Textarea: React__default.ForwardRefExoticComponent<TextareaProps & React__default.RefAttributes<HTMLTextAreaElement>>;
201
281
 
202
- export { Badge, type BadgeProps, Button, type ButtonProps, Caption, Display, Header1, Header2, Header3, Header4, type HeadingProps, type HeadingTag, Image, type ImageProps, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, PageCard, PageCardContent, type PageCardContentProps, PageCardHeader, type PageCardHeaderProps, PageCardImage, type PageCardImageProps, type PageCardProps, Preheader, Section, Subheader1, Subheader2, TAILWIND_TEXT_PX, Text1, Text2, Textarea, type TextareaProps, createHeading, fluidFontSize };
282
+ export { Badge, type BadgeProps, Button, type ButtonProps, Caption, CodeSnippet, type CodeSnippetProps, Collapsible, type CollapsibleProps, Display, Header1, Header2, Header3, Header4, type HeadingProps, type HeadingTag, Image, type ImageProps, InlineCode, type InlineCodeProps, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, NativeSelect, type NativeSelectProps, PageCard, PageCardContent, type PageCardContentProps, PageCardHeader, type PageCardHeaderProps, PageCardImage, type PageCardImageProps, type PageCardProps, Preheader, Section, Subheader1, Subheader2, TAILWIND_TEXT_PX, Table, type TableColumn, type TableProps, Tabs, type TabsItem, type TabsProps, Text1, Text2, Textarea, type TextareaProps, createHeading, fluidFontSize };