@askrjs/themes 0.0.25 → 0.0.28

package/dist/components/footer/footer.js

@@ -3,6 +3,7 @@ import { mergeProps } from "../_internal/merge-props.js";
 import { Block } from "../block/block.js";
 import { jsx } from "@askrjs/askr/jsx-runtime";
 //#region src/components/footer/footer.tsx
+/** Renders a `<footer>`-element {@link Block} with a muted background and top border. */
 function Footer(props) {
 	const { children, ...rest } = props;
 	return /* @__PURE__ */ jsx(Block, {
@@ -14,6 +15,7 @@ function Footer(props) {
 		children
 	});
 }
+/** Renders the main content wrapper of a {@link Footer}. */
 function FooterContent(props) {
 	const { children, class: className, ref, ...rest } = props;
 	const finalProps = mergeProps(rest, {
@@ -26,6 +28,7 @@ function FooterContent(props) {
 		children
 	});
 }
+/** Renders a grouped section within a {@link Footer}. */
 function FooterSection(props) {
 	const { children, class: className, ref, ...rest } = props;
 	const finalProps = mergeProps(rest, {
@@ -38,6 +41,7 @@ function FooterSection(props) {
 		children
 	});
 }
+/** Renders a section title (`<h2>`) within a {@link Footer}. */
 function FooterTitle(props) {
 	const { children, class: className, ref, ...rest } = props;
 	const finalProps = mergeProps(rest, {
@@ -50,6 +54,7 @@ function FooterTitle(props) {
 		children
 	});
 }
+/** Renders supporting description text within a {@link Footer}. */
 function FooterDescription(props) {
 	const { children, class: className, ref, ...rest } = props;
 	const finalProps = mergeProps(rest, {
@@ -62,6 +67,7 @@ function FooterDescription(props) {
 		children
 	});
 }
+/** Renders a `<nav>` wrapper for a group of {@link FooterLink}s. */
 function FooterLinks(props) {
 	const { children, class: className, ref, ...rest } = props;
 	const finalProps = mergeProps(rest, {
@@ -74,6 +80,7 @@ function FooterLinks(props) {
 		children
 	});
 }
+/** Renders a single link within a {@link Footer}. */
 function FooterLink(props) {
 	const { children, class: className, ref, ...rest } = props;
 	const finalProps = mergeProps(rest, {

package/dist/components/footer/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","names":[],"sources":["../../../src/components/footer/footer.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Block } from \"../block\";\nimport { classes } from \"../_internal/classes\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport type {\n  FooterContentProps,\n  FooterDescriptionProps,\n  FooterLinkProps,\n  FooterLinksProps,\n  FooterProps,\n  FooterSectionProps,\n  FooterTitleProps,\n} from \"./footer.types\";\n\nexport function Footer(props: FooterProps): JSX.Element {\n  const { children, ...rest } = props;\n\n  return (\n    <Block as=\"footer\" background=\"muted\" borderTop {...rest} data-slot=\"footer\">\n      {children}\n    </Block>\n  );\n}\n\nexport function FooterContent(props: FooterContentProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-content\", className),\n    \"data-slot\": \"footer-content\",\n  });\n\n  return <div {...finalProps}>{children}</div>;\n}\n\nexport function FooterSection(props: FooterSectionProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-section\", className),\n    \"data-slot\": \"footer-section\",\n  });\n\n  return <div {...finalProps}>{children}</div>;\n}\n\nexport function FooterTitle(props: FooterTitleProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-title\", className),\n    \"data-slot\": \"footer-title\",\n  });\n\n  return <h2 {...finalProps}>{children}</h2>;\n}\n\nexport function FooterDescription(props: FooterDescriptionProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-description\", className),\n    \"data-slot\": \"footer-description\",\n  });\n\n  return <p {...finalProps}>{children}</p>;\n}\n\nexport function FooterLinks(props: FooterLinksProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-links\", className),\n    \"data-slot\": \"footer-links\",\n  });\n\n  return <nav {...finalProps}>{children}</nav>;\n}\n\nexport function FooterLink(props: FooterLinkProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-link\", className),\n    \"data-slot\": \"footer-link\",\n  });\n\n  return <a {...finalProps}>{children}</a>;\n}\n"],"mappings":";;;;;AAcA,SAAgB,OAAO,OAAiC;CACtD,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAAC,OAAD;EAAO,IAAG;EAAS,YAAW;EAAQ,WAAA;EAAU,GAAI;EAAM,aAAU;EACjE;CACI,CAAA;AAEX;AAEA,SAAgB,cAAc,OAAwC;CACpE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,kBAAkB,SAAS;EAC1C,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;CAAc,CAAA;AAC7C;AAEA,SAAgB,cAAc,OAAwC;CACpE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,kBAAkB,SAAS;EAC1C,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;CAAc,CAAA;AAC7C;AAEA,SAAgB,YAAY,OAAsC;CAChE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,gBAAgB,SAAS;EACxC,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,MAAD;EAAI,GAAI;EAAa;CAAa,CAAA;AAC3C;AAEA,SAAgB,kBAAkB,OAA4C;CAC5E,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,sBAAsB,SAAS;EAC9C,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,KAAD;EAAG,GAAI;EAAa;CAAY,CAAA;AACzC;AAEA,SAAgB,YAAY,OAAsC;CAChE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,gBAAgB,SAAS;EACxC,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;CAAc,CAAA;AAC7C;AAEA,SAAgB,WAAW,OAAqC;CAC9D,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,eAAe,SAAS;EACvC,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,KAAD;EAAG,GAAI;EAAa;CAAY,CAAA;AACzC"}
+{"version":3,"file":"footer.js","names":[],"sources":["../../../src/components/footer/footer.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Block } from \"../block\";\nimport { classes } from \"../_internal/classes\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport type {\n  FooterContentProps,\n  FooterDescriptionProps,\n  FooterLinkProps,\n  FooterLinksProps,\n  FooterProps,\n  FooterSectionProps,\n  FooterTitleProps,\n} from \"./footer.types\";\n\n/** Renders a `<footer>`-element {@link Block} with a muted background and top border. */\nexport function Footer(props: FooterProps): JSX.Element {\n  const { children, ...rest } = props;\n\n  return (\n    <Block as=\"footer\" background=\"muted\" borderTop {...rest} data-slot=\"footer\">\n      {children}\n    </Block>\n  );\n}\n\n/** Renders the main content wrapper of a {@link Footer}. */\nexport function FooterContent(props: FooterContentProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-content\", className),\n    \"data-slot\": \"footer-content\",\n  });\n\n  return <div {...finalProps}>{children}</div>;\n}\n\n/** Renders a grouped section within a {@link Footer}. */\nexport function FooterSection(props: FooterSectionProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-section\", className),\n    \"data-slot\": \"footer-section\",\n  });\n\n  return <div {...finalProps}>{children}</div>;\n}\n\n/** Renders a section title (`<h2>`) within a {@link Footer}. */\nexport function FooterTitle(props: FooterTitleProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-title\", className),\n    \"data-slot\": \"footer-title\",\n  });\n\n  return <h2 {...finalProps}>{children}</h2>;\n}\n\n/** Renders supporting description text within a {@link Footer}. */\nexport function FooterDescription(props: FooterDescriptionProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-description\", className),\n    \"data-slot\": \"footer-description\",\n  });\n\n  return <p {...finalProps}>{children}</p>;\n}\n\n/** Renders a `<nav>` wrapper for a group of {@link FooterLink}s. */\nexport function FooterLinks(props: FooterLinksProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-links\", className),\n    \"data-slot\": \"footer-links\",\n  });\n\n  return <nav {...finalProps}>{children}</nav>;\n}\n\n/** Renders a single link within a {@link Footer}. */\nexport function FooterLink(props: FooterLinkProps): JSX.Element {\n  const { children, class: className, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"footer-link\", className),\n    \"data-slot\": \"footer-link\",\n  });\n\n  return <a {...finalProps}>{children}</a>;\n}\n"],"mappings":";;;;;;AAeA,SAAgB,OAAO,OAAiC;CACtD,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAAC,OAAD;EAAO,IAAG;EAAS,YAAW;EAAQ,WAAA;EAAU,GAAI;EAAM,aAAU;EACjE;CACI,CAAA;AAEX;;AAGA,SAAgB,cAAc,OAAwC;CACpE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,kBAAkB,SAAS;EAC1C,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;CAAc,CAAA;AAC7C;;AAGA,SAAgB,cAAc,OAAwC;CACpE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,kBAAkB,SAAS;EAC1C,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;CAAc,CAAA;AAC7C;;AAGA,SAAgB,YAAY,OAAsC;CAChE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,gBAAgB,SAAS;EACxC,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,MAAD;EAAI,GAAI;EAAa;CAAa,CAAA;AAC3C;;AAGA,SAAgB,kBAAkB,OAA4C;CAC5E,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,sBAAsB,SAAS;EAC9C,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,KAAD;EAAG,GAAI;EAAa;CAAY,CAAA;AACzC;;AAGA,SAAgB,YAAY,OAAsC;CAChE,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,gBAAgB,SAAS;EACxC,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;CAAc,CAAA;AAC7C;;AAGA,SAAgB,WAAW,OAAqC;CAC9D,MAAM,EAAE,UAAU,OAAO,WAAW,KAAK,GAAG,SAAS;CACrD,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,eAAe,SAAS;EACvC,aAAa;CACf,CAAC;CAED,OAAO,oBAAC,KAAD;EAAG,GAAI;EAAa;CAAY,CAAA;AACzC"}

package/dist/components/footer/footer.types.d.ts

@@ -3,32 +3,39 @@ import "../block/index.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 import { Ref } from "@askrjs/askr/foundations/utilities";
 //#region src/components/footer/footer.types.d.ts
+/** Props for the {@link Footer} component. */
 type FooterProps = Omit<BlockElementProps<"footer">, "as">;
 type DivProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref">;
 type HeadingProps = Omit<JSX.IntrinsicElements["h2"], "children" | "ref">;
 type ParagraphProps = Omit<JSX.IntrinsicElements["p"], "children" | "ref">;
 type NavProps = Omit<JSX.IntrinsicElements["nav"], "children" | "ref">;
 type AnchorProps = Omit<JSX.IntrinsicElements["a"], "children" | "ref">;
+/** Props for the {@link FooterContent} component. */
 type FooterContentProps = DivProps & {
   children?: unknown;
   ref?: Ref<HTMLDivElement>;
 };
+/** Props for the {@link FooterSection} component. */
 type FooterSectionProps = DivProps & {
   children?: unknown;
   ref?: Ref<HTMLDivElement>;
 };
+/** Props for the {@link FooterTitle} component. */
 type FooterTitleProps = HeadingProps & {
   children?: unknown;
   ref?: Ref<HTMLHeadingElement>;
 };
+/** Props for the {@link FooterDescription} component. */
 type FooterDescriptionProps = ParagraphProps & {
   children?: unknown;
   ref?: Ref<HTMLParagraphElement>;
 };
+/** Props for the {@link FooterLinks} component. */
 type FooterLinksProps = NavProps & {
   children?: unknown;
   ref?: Ref<HTMLElement>;
 };
+/** Props for the {@link FooterLink} component. */
 type FooterLinkProps = AnchorProps & {
   children?: unknown;
   ref?: Ref<HTMLAnchorElement>;

package/dist/components/grid/grid.d.ts

@@ -1,6 +1,7 @@
 import { GridElement, GridProps } from "./grid.types.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/grid/grid.d.ts
+/** CSS grid layout primitive: turns `columns`/`gap`/`align` (each optionally responsive) into generated grid-template styles, rendering as `<div>` by default. */
 declare function Grid<TElement extends GridElement = "div">(props: GridProps<TElement>): JSX.Element;
 //#endregion
 export { Grid };

package/dist/components/grid/grid.js

@@ -17,6 +17,7 @@ function resolveAlign(value) {
 	if (value === "end") return "end";
 	return value;
 }
+/** CSS grid layout primitive: turns `columns`/`gap`/`align` (each optionally responsive) into generated grid-template styles, rendering as `<div>` by default. */
 function Grid(props) {
 	const { as, columns, gap, align, children, class: classProp, className, ref, style: userStyle, ...rest } = props;
 	const styles = {};

package/dist/components/grid/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","names":[],"sources":["../../../src/components/grid/grid.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { classes } from \"../_internal/classes\";\nimport { mergeLayoutStyles, resolveSpaceValue, setResponsiveVar } from \"../_internal/block-layout\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport { intrinsicElement } from \"../_internal/jsx\";\nimport { styleDeclarationsToClass } from \"../_internal/style\";\nimport type { BlockSpace } from \"../_internal/block-layout\";\nimport type { GridAlign, GridColumns, GridElement, GridProps } from \"./grid.types\";\n\nconst DEFAULT_ELEMENT = \"div\";\nfunction resolveColumns(value: GridColumns): string {\n  if (typeof value === \"number\") {\n    return `repeat(${value}, minmax(0, 1fr))`;\n  }\n\n  const trimmed = value.trim();\n  return trimmed || \"minmax(0, 1fr)\";\n}\n\nfunction resolveGap(value: BlockSpace): string {\n  return String(resolveSpaceValue(value));\n}\n\nfunction resolveAlign(value: GridAlign): string {\n  if (value === \"start\") return \"start\";\n  if (value === \"end\") return \"end\";\n  return value;\n}\n\nexport function Grid<TElement extends GridElement = \"div\">(\n  props: GridProps<TElement>,\n): JSX.Element {\n  const {\n    as,\n    columns,\n    gap,\n    align,\n    children,\n    class: classProp,\n    className,\n    ref,\n    style: userStyle,\n    ...rest\n  } = props as GridProps<GridElement> & {\n    class?: unknown;\n    className?: unknown;\n    style?: unknown;\n  };\n\n  const styles: Record<string, string | number> = {};\n  setResponsiveVar(styles, \"grid-columns\", columns, resolveColumns);\n  setResponsiveVar(styles, \"grid-gap\", gap, resolveGap);\n  setResponsiveVar(styles, \"grid-align\", align, resolveAlign);\n\n  const generatedClass = styleDeclarationsToClass(mergeLayoutStyles(styles, userStyle));\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"grid\", classProp, className, generatedClass),\n    \"data-slot\": \"grid\",\n  });\n\n  return intrinsicElement(as ?? DEFAULT_ELEMENT, finalProps, children);\n}\n"],"mappings":";;;;;;AASA,MAAM,kBAAkB;AACxB,SAAS,eAAe,OAA4B;CAClD,IAAI,OAAO,UAAU,UACnB,OAAO,UAAU,MAAM;CAIzB,OADgB,MAAM,KACT,KAAK;AACpB;AAEA,SAAS,WAAW,OAA2B;CAC7C,OAAO,OAAO,kBAAkB,KAAK,CAAC;AACxC;AAEA,SAAS,aAAa,OAA0B;CAC9C,IAAI,UAAU,SAAS,OAAO;CAC9B,IAAI,UAAU,OAAO,OAAO;CAC5B,OAAO;AACT;AAEA,SAAgB,KACd,OACa;CACb,MAAM,EACJ,IACA,SACA,KACA,OACA,UACA,OAAO,WACP,WACA,KACA,OAAO,WACP,GAAG,SACD;CAMJ,MAAM,SAA0C,CAAC;CACjD,iBAAiB,QAAQ,gBAAgB,SAAS,cAAc;CAChE,iBAAiB,QAAQ,YAAY,KAAK,UAAU;CACpD,iBAAiB,QAAQ,cAAc,OAAO,YAAY;CAE1D,MAAM,iBAAiB,yBAAyB,kBAAkB,QAAQ,SAAS,CAAC;CACpF,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,QAAQ,WAAW,WAAW,cAAc;EAC3D,aAAa;CACf,CAAC;CAED,OAAO,iBAAiB,MAAM,iBAAiB,YAAY,QAAQ;AACrE"}
+{"version":3,"file":"grid.js","names":[],"sources":["../../../src/components/grid/grid.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { classes } from \"../_internal/classes\";\nimport { mergeLayoutStyles, resolveSpaceValue, setResponsiveVar } from \"../_internal/block-layout\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport { intrinsicElement } from \"../_internal/jsx\";\nimport { styleDeclarationsToClass } from \"../_internal/style\";\nimport type { BlockSpace } from \"../_internal/block-layout\";\nimport type { GridAlign, GridColumns, GridElement, GridProps } from \"./grid.types\";\n\nconst DEFAULT_ELEMENT = \"div\";\nfunction resolveColumns(value: GridColumns): string {\n  if (typeof value === \"number\") {\n    return `repeat(${value}, minmax(0, 1fr))`;\n  }\n\n  const trimmed = value.trim();\n  return trimmed || \"minmax(0, 1fr)\";\n}\n\nfunction resolveGap(value: BlockSpace): string {\n  return String(resolveSpaceValue(value));\n}\n\nfunction resolveAlign(value: GridAlign): string {\n  if (value === \"start\") return \"start\";\n  if (value === \"end\") return \"end\";\n  return value;\n}\n\n/** CSS grid layout primitive: turns `columns`/`gap`/`align` (each optionally responsive) into generated grid-template styles, rendering as `<div>` by default. */\nexport function Grid<TElement extends GridElement = \"div\">(\n  props: GridProps<TElement>,\n): JSX.Element {\n  const {\n    as,\n    columns,\n    gap,\n    align,\n    children,\n    class: classProp,\n    className,\n    ref,\n    style: userStyle,\n    ...rest\n  } = props as GridProps<GridElement> & {\n    class?: unknown;\n    className?: unknown;\n    style?: unknown;\n  };\n\n  const styles: Record<string, string | number> = {};\n  setResponsiveVar(styles, \"grid-columns\", columns, resolveColumns);\n  setResponsiveVar(styles, \"grid-gap\", gap, resolveGap);\n  setResponsiveVar(styles, \"grid-align\", align, resolveAlign);\n\n  const generatedClass = styleDeclarationsToClass(mergeLayoutStyles(styles, userStyle));\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(\"grid\", classProp, className, generatedClass),\n    \"data-slot\": \"grid\",\n  });\n\n  return intrinsicElement(as ?? DEFAULT_ELEMENT, finalProps, children);\n}\n"],"mappings":";;;;;;AASA,MAAM,kBAAkB;AACxB,SAAS,eAAe,OAA4B;CAClD,IAAI,OAAO,UAAU,UACnB,OAAO,UAAU,MAAM;CAIzB,OADgB,MAAM,KACT,KAAK;AACpB;AAEA,SAAS,WAAW,OAA2B;CAC7C,OAAO,OAAO,kBAAkB,KAAK,CAAC;AACxC;AAEA,SAAS,aAAa,OAA0B;CAC9C,IAAI,UAAU,SAAS,OAAO;CAC9B,IAAI,UAAU,OAAO,OAAO;CAC5B,OAAO;AACT;;AAGA,SAAgB,KACd,OACa;CACb,MAAM,EACJ,IACA,SACA,KACA,OACA,UACA,OAAO,WACP,WACA,KACA,OAAO,WACP,GAAG,SACD;CAMJ,MAAM,SAA0C,CAAC;CACjD,iBAAiB,QAAQ,gBAAgB,SAAS,cAAc;CAChE,iBAAiB,QAAQ,YAAY,KAAK,UAAU;CACpD,iBAAiB,QAAQ,cAAc,OAAO,YAAY;CAE1D,MAAM,iBAAiB,yBAAyB,kBAAkB,QAAQ,SAAS,CAAC;CACpF,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,OAAO,QAAQ,QAAQ,WAAW,WAAW,cAAc;EAC3D,aAAa;CACf,CAAC;CAED,OAAO,iBAAiB,MAAM,iBAAiB,YAAY,QAAQ;AACrE"}

package/dist/components/grid/grid.types.d.ts

@@ -2,10 +2,14 @@ import { BlockSpace, ResponsiveValue } from "../_internal/block-layout.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 import { Ref } from "@askrjs/askr/foundations/utilities";
 //#region src/components/grid/grid.types.d.ts
+/** Element tags {@link Grid} can render as via its `as` prop. */
 type GridElement = "div" | "section" | "ul";
+/** Column definition for {@link Grid}: a track count or a raw `grid-template-columns` string. */
 type GridColumns = number | string;
+/** `align-items` value applied to a {@link Grid}. */
 type GridAlign = "start" | "center" | "end" | "stretch";
 type GridIntrinsicProps<TElement extends GridElement> = Omit<JSX.IntrinsicElements[TElement], "children" | "ref">;
+/** Props for the {@link Grid} component, specialized for a given {@link GridElement} `TElement`. */
 type GridProps<TElement extends GridElement = "div"> = GridIntrinsicProps<TElement> & {
   as?: TElement;
   columns?: ResponsiveValue<GridColumns>;

package/dist/components/header/header.d.ts

@@ -1,6 +1,7 @@
 import { HeaderProps } from "./header.types.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/header/header.d.ts
+/** Renders a `<header>`-element {@link Block} with a surface background and bottom border, optionally sticky-positioned via `position`/`sticky`. */
 declare function Header(props: HeaderProps): JSX.Element;
 //#endregion
 export { Header };

package/dist/components/header/header.js

@@ -1,6 +1,7 @@
 import { Block } from "../block/block.js";
 import { jsx } from "@askrjs/askr/jsx-runtime";
 //#region src/components/header/header.tsx
+/** Renders a `<header>`-element {@link Block} with a surface background and bottom border, optionally sticky-positioned via `position`/`sticky`. */
 function Header(props) {
 	const { children, position, sticky = position === "sticky", ...rest } = props;
 	return /* @__PURE__ */ jsx(Block, {

package/dist/components/header/header.js.map

@@ -1 +1 @@
-{"version":3,"file":"header.js","names":[],"sources":["../../../src/components/header/header.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Block } from \"../block\";\nimport type { HeaderProps } from \"./header.types\";\n\nexport function Header(props: HeaderProps): JSX.Element {\n  const { children, position, sticky = position === \"sticky\", ...rest } = props;\n\n  return (\n    <Block\n      as=\"header\"\n      sticky={sticky}\n      top={sticky ? \"0\" : undefined}\n      zIndex={sticky ? \"header\" : undefined}\n      background=\"surface\"\n      borderBottom\n      {...rest}\n      data-slot=\"header\"\n    >\n      {children}\n    </Block>\n  );\n}\n"],"mappings":";;;AAIA,SAAgB,OAAO,OAAiC;CACtD,MAAM,EAAE,UAAU,UAAU,SAAS,aAAa,UAAU,GAAG,SAAS;CAExE,OACE,oBAAC,OAAD;EACE,IAAG;EACK;EACR,KAAK,SAAS,MAAM,KAAA;EACpB,QAAQ,SAAS,WAAW,KAAA;EAC5B,YAAW;EACX,cAAA;EACA,GAAI;EACJ,aAAU;EAET;CACI,CAAA;AAEX"}
+{"version":3,"file":"header.js","names":[],"sources":["../../../src/components/header/header.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Block } from \"../block\";\nimport type { HeaderProps } from \"./header.types\";\n\n/** Renders a `<header>`-element {@link Block} with a surface background and bottom border, optionally sticky-positioned via `position`/`sticky`. */\nexport function Header(props: HeaderProps): JSX.Element {\n  const { children, position, sticky = position === \"sticky\", ...rest } = props;\n\n  return (\n    <Block\n      as=\"header\"\n      sticky={sticky}\n      top={sticky ? \"0\" : undefined}\n      zIndex={sticky ? \"header\" : undefined}\n      background=\"surface\"\n      borderBottom\n      {...rest}\n      data-slot=\"header\"\n    >\n      {children}\n    </Block>\n  );\n}\n"],"mappings":";;;;AAKA,SAAgB,OAAO,OAAiC;CACtD,MAAM,EAAE,UAAU,UAAU,SAAS,aAAa,UAAU,GAAG,SAAS;CAExE,OACE,oBAAC,OAAD;EACE,IAAG;EACK;EACR,KAAK,SAAS,MAAM,KAAA;EACpB,QAAQ,SAAS,WAAW,KAAA;EAC5B,YAAW;EACX,cAAA;EACA,GAAI;EACJ,aAAU;EAET;CACI,CAAA;AAEX"}

package/dist/components/header/header.types.d.ts

@@ -1,6 +1,7 @@
 import { BlockElementProps } from "../block/block.types.js";
 import "../block/index.js";
 //#region src/components/header/header.types.d.ts
+/** Props for the {@link Header} component. */
 type HeaderProps = Omit<BlockElementProps<"header">, "as" | "sticky"> & {
   position?: "sticky" | "static";
   sticky?: boolean;

package/dist/components/input-group/input-group.d.ts

@@ -1,7 +1,9 @@
 import { InputGroupProps, InputGroupTextAsChildProps, InputGroupTextProps } from "./input-group.types.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/input-group/input-group.d.ts
+/** Groups related inputs/addons together, optionally visually attached, with a horizontal or vertical orientation and `role="group"` by default. */
 declare function InputGroup(props: InputGroupProps): JSX.Element;
+/** Renders static text/label content within an {@link InputGroup}. */
 declare function InputGroupText(props: InputGroupTextProps): JSX.Element;
 declare function InputGroupText(props: InputGroupTextAsChildProps): JSX.Element;
 //#endregion

package/dist/components/input-group/input-group.js

@@ -4,6 +4,7 @@ import { jsx } from "@askrjs/askr/jsx-runtime";
 import { Slot } from "@askrjs/askr/foundations";
 import { mergeProps } from "@askrjs/askr/foundations/utilities";
 //#region src/components/input-group/input-group.tsx
+/** Groups related inputs/addons together, optionally visually attached, with a horizontal or vertical orientation and `role="group"` by default. */
 function InputGroup(props) {
 	const { attached = true, children, class: className, orientation = "horizontal", ref, role, ...rest } = props;
 	return /* @__PURE__ */ jsx("div", {

package/dist/components/input-group/input-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-group.js","names":[],"sources":["../../../src/components/input-group/input-group.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Slot } from \"@askrjs/askr/foundations\";\nimport { mergeProps } from \"@askrjs/askr/foundations/utilities\";\nimport { classes } from \"../_internal/classes\";\nimport { intrinsicElement } from \"../_internal/jsx\";\nimport type {\n  InputGroupProps,\n  InputGroupTextAsChildProps,\n  InputGroupTextProps,\n} from \"./input-group.types\";\n\nexport function InputGroup(props: InputGroupProps): JSX.Element {\n  const {\n    attached = true,\n    children,\n    class: className,\n    orientation = \"horizontal\",\n    ref,\n    role,\n    ...rest\n  } = props;\n\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      class={classes(\n        \"input-group\",\n        orientation === \"vertical\" ? \"input-group-vertical\" : undefined,\n        className,\n      )}\n      data-attached={attached ? \"true\" : \"false\"}\n      data-orientation={orientation}\n      data-slot=\"input-group\"\n      role={(role ?? \"group\") as string}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function InputGroupText(props: InputGroupTextProps): JSX.Element;\nexport function InputGroupText(props: InputGroupTextAsChildProps): JSX.Element;\nexport function InputGroupText(\n  props: InputGroupTextProps | InputGroupTextAsChildProps,\n): JSX.Element {\n  const { asChild, children, ref, class: className, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    class: classes(\"input-group-text\", className),\n    ref,\n    \"data-slot\": \"input-group-text\",\n  });\n\n  if (asChild) {\n    return <Slot asChild {...finalProps} children={children} />;\n  }\n\n  return intrinsicElement(\"span\", finalProps, children);\n}\n"],"mappings":";;;;;;AAWA,SAAgB,WAAW,OAAqC;CAC9D,MAAM,EACJ,WAAW,MACX,UACA,OAAO,WACP,cAAc,cACd,KACA,MACA,GAAG,SACD;CAEJ,OACE,oBAAC,OAAD;EACE,GAAI;EACC;EACL,OAAO,QACL,eACA,gBAAgB,aAAa,yBAAyB,KAAA,GACtD,SACF;EACA,iBAAe,WAAW,SAAS;EACnC,oBAAkB;EAClB,aAAU;EACV,MAAO,QAAQ;EAEd;CACE,CAAA;AAET;AAIA,SAAgB,eACd,OACa;CACb,MAAM,EAAE,SAAS,UAAU,KAAK,OAAO,WAAW,GAAG,SAAS;CAC9D,MAAM,aAAa,WAAW,MAAM;EAClC,OAAO,QAAQ,oBAAoB,SAAS;EAC5C;EACA,aAAa;CACf,CAAC;CAED,IAAI,SACF,OAAO,oBAAC,MAAD;EAAM,SAAA;EAAQ,GAAI;EAAsB;CAAW,CAAA;CAG5D,OAAO,iBAAiB,QAAQ,YAAY,QAAQ;AACtD"}
+{"version":3,"file":"input-group.js","names":[],"sources":["../../../src/components/input-group/input-group.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Slot } from \"@askrjs/askr/foundations\";\nimport { mergeProps } from \"@askrjs/askr/foundations/utilities\";\nimport { classes } from \"../_internal/classes\";\nimport { intrinsicElement } from \"../_internal/jsx\";\nimport type {\n  InputGroupProps,\n  InputGroupTextAsChildProps,\n  InputGroupTextProps,\n} from \"./input-group.types\";\n\n/** Groups related inputs/addons together, optionally visually attached, with a horizontal or vertical orientation and `role=\"group\"` by default. */\nexport function InputGroup(props: InputGroupProps): JSX.Element {\n  const {\n    attached = true,\n    children,\n    class: className,\n    orientation = \"horizontal\",\n    ref,\n    role,\n    ...rest\n  } = props;\n\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      class={classes(\n        \"input-group\",\n        orientation === \"vertical\" ? \"input-group-vertical\" : undefined,\n        className,\n      )}\n      data-attached={attached ? \"true\" : \"false\"}\n      data-orientation={orientation}\n      data-slot=\"input-group\"\n      role={(role ?? \"group\") as string}\n    >\n      {children}\n    </div>\n  );\n}\n\n/** Renders static text/label content within an {@link InputGroup}. */\nexport function InputGroupText(props: InputGroupTextProps): JSX.Element;\nexport function InputGroupText(props: InputGroupTextAsChildProps): JSX.Element;\nexport function InputGroupText(\n  props: InputGroupTextProps | InputGroupTextAsChildProps,\n): JSX.Element {\n  const { asChild, children, ref, class: className, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    class: classes(\"input-group-text\", className),\n    ref,\n    \"data-slot\": \"input-group-text\",\n  });\n\n  if (asChild) {\n    return <Slot asChild {...finalProps} children={children} />;\n  }\n\n  return intrinsicElement(\"span\", finalProps, children);\n}\n"],"mappings":";;;;;;;AAYA,SAAgB,WAAW,OAAqC;CAC9D,MAAM,EACJ,WAAW,MACX,UACA,OAAO,WACP,cAAc,cACd,KACA,MACA,GAAG,SACD;CAEJ,OACE,oBAAC,OAAD;EACE,GAAI;EACC;EACL,OAAO,QACL,eACA,gBAAgB,aAAa,yBAAyB,KAAA,GACtD,SACF;EACA,iBAAe,WAAW,SAAS;EACnC,oBAAkB;EAClB,aAAU;EACV,MAAO,QAAQ;EAEd;CACE,CAAA;AAET;AAKA,SAAgB,eACd,OACa;CACb,MAAM,EAAE,SAAS,UAAU,KAAK,OAAO,WAAW,GAAG,SAAS;CAC9D,MAAM,aAAa,WAAW,MAAM;EAClC,OAAO,QAAQ,oBAAoB,SAAS;EAC5C;EACA,aAAa;CACf,CAAC;CAED,IAAI,SACF,OAAO,oBAAC,MAAD;EAAM,SAAA;EAAQ,GAAI;EAAsB;CAAW,CAAA;CAG5D,OAAO,iBAAiB,QAAQ,YAAY,QAAQ;AACtD"}

package/dist/components/input-group/input-group.types.d.ts

@@ -2,20 +2,24 @@ import { JSX } from "@askrjs/askr/jsx-runtime";
 import { JSXElement } from "@askrjs/askr/foundations";
 import { Ref } from "@askrjs/askr/foundations/utilities";
 //#region src/components/input-group/input-group.types.d.ts
+/** Layout direction of an {@link InputGroup}. */
 type InputGroupOrientation = "horizontal" | "vertical";
 type DivProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref">;
 type SpanProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref">;
+/** Props for the {@link InputGroup} component. */
 type InputGroupProps = DivProps & {
   children?: unknown;
   attached?: boolean;
   orientation?: InputGroupOrientation;
   ref?: Ref<HTMLDivElement>;
 };
+/** Props for {@link InputGroupText} rendered as its default `<span>` element. */
 type InputGroupTextProps = SpanProps & {
   asChild?: false;
   children?: unknown;
   ref?: Ref<HTMLSpanElement>;
 };
+/** Props for {@link InputGroupText} rendered with `asChild`, merging its attributes onto a single child element. */
 type InputGroupTextAsChildProps = SpanProps & {
   asChild: true;
   children: JSXElement;

package/dist/components/main/main.d.ts

@@ -1,6 +1,7 @@
 import { MainProps } from "./main.types.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/main/main.d.ts
+/** Renders a `<main>`-element {@link Block} that grows to fill available space. */
 declare function Main(props: MainProps): JSX.Element;
 //#endregion
 export { Main };

package/dist/components/main/main.js

@@ -1,6 +1,7 @@
 import { Block } from "../block/block.js";
 import { jsx } from "@askrjs/askr/jsx-runtime";
 //#region src/components/main/main.tsx
+/** Renders a `<main>`-element {@link Block} that grows to fill available space. */
 function Main(props) {
 	const { children, ...rest } = props;
 	return /* @__PURE__ */ jsx(Block, {

package/dist/components/main/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","names":[],"sources":["../../../src/components/main/main.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Block } from \"../block\";\nimport type { MainProps } from \"./main.types\";\n\nexport function Main(props: MainProps): JSX.Element {\n  const { children, ...rest } = props;\n\n  return (\n    <Block as=\"main\" grow {...rest} data-slot=\"main\">\n      {children}\n    </Block>\n  );\n}\n"],"mappings":";;;AAIA,SAAgB,KAAK,OAA+B;CAClD,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAAC,OAAD;EAAO,IAAG;EAAO,MAAA;EAAK,GAAI;EAAM,aAAU;EACvC;CACI,CAAA;AAEX"}
+{"version":3,"file":"main.js","names":[],"sources":["../../../src/components/main/main.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Block } from \"../block\";\nimport type { MainProps } from \"./main.types\";\n\n/** Renders a `<main>`-element {@link Block} that grows to fill available space. */\nexport function Main(props: MainProps): JSX.Element {\n  const { children, ...rest } = props;\n\n  return (\n    <Block as=\"main\" grow {...rest} data-slot=\"main\">\n      {children}\n    </Block>\n  );\n}\n"],"mappings":";;;;AAKA,SAAgB,KAAK,OAA+B;CAClD,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAAC,OAAD;EAAO,IAAG;EAAO,MAAA;EAAK,GAAI;EAAM,aAAU;EACvC;CACI,CAAA;AAEX"}

package/dist/components/main/main.types.d.ts

@@ -1,6 +1,7 @@
 import { BlockElementProps } from "../block/block.types.js";
 import "../block/index.js";
 //#region src/components/main/main.types.d.ts
+/** Props for the {@link Main} component. */
 type MainProps = Omit<BlockElementProps<"main">, "as">;
 //#endregion
 export { MainProps };

package/dist/components/nav/nav.d.ts

@@ -1,14 +1,20 @@
 import { NavItemAsChildProps, NavItemProps, NavLinkProps, PillProps, PillsAsChildProps, PillsProps, TabProps, TabsAsChildProps, TabsProps } from "./nav.types.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/nav/nav.d.ts
+/** Renders a `<nav>` wrapper (or, with `asChild`, merges onto a child) for a set of {@link Tab} links. */
 declare function Tabs(props: TabsProps): JSX.Element;
 declare function Tabs(props: TabsAsChildProps): JSX.Element;
+/** Renders a `<nav>` wrapper (or, with `asChild`, merges onto a child) for a set of {@link Pill} links. */
 declare function Pills(props: PillsProps): JSX.Element;
 declare function Pills(props: PillsAsChildProps): JSX.Element;
+/** A router-aware link styled as a tab, auto-marked active by matching the current route (see {@link NavLinkProps.match}). */
 declare function Tab(props: TabProps): JSX.Element;
+/** A router-aware link styled as a pill, auto-marked active by matching the current route, with an active background highlight. */
 declare function Pill(props: PillProps): JSX.Element;
+/** A generic navigation item, rendered as an `<a>` (or, with `asChild`, merged onto a child), highlighted when `active`. */
 declare function NavItem(props: NavItemProps): JSX.Element;
 declare function NavItem(props: NavItemAsChildProps): JSX.Element;
+/** A router-aware navigation link that highlights itself when its route matches the current location. */
 declare function NavLink(props: NavLinkProps): JSX.Element;
 //#endregion
 export { NavItem, NavLink, Pill, Pills, Tab, Tabs };

package/dist/components/nav/nav.js

@@ -106,9 +106,11 @@ function Tabs(props) {
 function Pills(props) {
 	return renderNavSet(props, "pills");
 }
+/** A router-aware link styled as a tab, auto-marked active by matching the current route (see {@link NavLinkProps.match}). */
 function Tab(props) {
 	return renderRoutedLink(props, "tab", { className: "tab" });
 }
+/** A router-aware link styled as a pill, auto-marked active by matching the current route, with an active background highlight. */
 function Pill(props) {
 	return renderRoutedLink(props, "pill", {
 		activeBackground: true,
@@ -144,6 +146,7 @@ function NavItem(props) {
 		children
 	});
 }
+/** A router-aware navigation link that highlights itself when its route matches the current location. */
 function NavLink(props) {
 	return renderRoutedLink(props, "nav-item", {
 		activeBackground: true,

package/dist/components/nav/nav.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav.js","names":[],"sources":["../../../src/components/nav/nav.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Slot } from \"@askrjs/askr/foundations\";\nimport { currentRoute, Link } from \"@askrjs/askr/router\";\nimport { Block } from \"../block\";\nimport { classes } from \"../_internal/classes\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport { intrinsicElement } from \"../_internal/jsx\";\nimport { assertSafeNavigationHref, resolvePathname } from \"../_internal/pathname\";\nimport type {\n  NavItemAsChildProps,\n  NavItemProps,\n  NavLinkProps,\n  PillProps,\n  PillsAsChildProps,\n  PillsProps,\n  TabProps,\n  TabsAsChildProps,\n  TabsProps,\n} from \"./nav.types\";\n\nconst LayoutBlock = Block as (props: Record<string, unknown>) => JSX.Element;\n\nfunction normalizePathname(pathname: string): string {\n  return pathname.endsWith(\"/\") && pathname !== \"/\" ? pathname.slice(0, -1) : pathname;\n}\n\nfunction getCurrentPathname(): string | null {\n  if (typeof window === \"undefined\") {\n    return null;\n  }\n\n  return normalizePathname(window.location.pathname || \"/\");\n}\n\nfunction getReactiveCurrentPathname(): string | null {\n  try {\n    return normalizePathname(currentRoute().path || \"/\");\n  } catch {\n    return getCurrentPathname();\n  }\n}\n\nfunction isActiveNavLink(\n  currentPathname: string,\n  targetPathname: string,\n  match: NavLinkProps[\"match\"] = \"prefix\",\n): boolean {\n  if (targetPathname === \"/\") {\n    return currentPathname === \"/\";\n  }\n\n  if (match === \"exact\") {\n    return currentPathname === targetPathname;\n  }\n\n  return currentPathname === targetPathname || currentPathname.startsWith(`${targetPathname}/`);\n}\n\nfunction renderNavSet(\n  props: TabsProps | TabsAsChildProps | PillsProps | PillsAsChildProps,\n  slot: \"tabs\" | \"pills\",\n): JSX.Element {\n  const className = \"class\" in props ? props.class : undefined;\n  const { asChild, children, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(slot, className),\n    \"data-slot\": slot,\n  });\n\n  if (asChild) {\n    return <Slot asChild {...finalProps} children={children as JSX.Element} />;\n  }\n\n  return intrinsicElement(\"nav\", finalProps, children);\n}\n\nfunction renderRoutedLink(\n  props: NavLinkProps | TabProps | PillProps,\n  slot: \"nav-item\" | \"tab\" | \"pill\",\n  options: { activeBackground?: boolean; className?: string; inheritSlot?: boolean } = {},\n): JSX.Element {\n  const {\n    active,\n    children,\n    href: suppliedHref,\n    to,\n    onPress,\n    onClick,\n    ref,\n    class: className,\n    match = \"prefix\",\n    target,\n    ...rest\n  } = props as NavLinkProps & {\n    onPress?: (event: Event) => void;\n    onClick?: (event: MouseEvent) => void;\n  };\n  const href = to?.href ?? suppliedHref;\n  if (!href) {\n    throw new Error(\"Nav link requires href or to.\");\n  }\n  assertSafeNavigationHref(href);\n  const inheritedSlot =\n    options.inheritSlot && typeof (rest as Record<string, unknown>)[\"data-slot\"] === \"string\"\n      ? String((rest as Record<string, unknown>)[\"data-slot\"])\n      : undefined;\n  const resolvedSlot = (inheritedSlot ?? slot) as \"nav-item\" | \"tab\" | \"pill\";\n  const inheritedNavClass =\n    slot === \"nav-item\" && resolvedSlot !== \"nav-item\" ? \"nav-item\" : undefined;\n  const { \"data-slot\": _dataSlot, ...childRest } = rest as Record<string, unknown>;\n  void _dataSlot;\n  const hasDownload = (rest as Record<string, unknown>).download !== undefined;\n  const currentPathname = getReactiveCurrentPathname();\n  const targetPathname = resolvePathname(href);\n  const routeActive =\n    currentPathname !== null &&\n    targetPathname !== null &&\n    isActiveNavLink(currentPathname, targetPathname, match);\n  const isActive = active ?? routeActive;\n  const activeProps = isActive\n    ? {\n        \"aria-current\": \"page\" as const,\n        \"data-active\": \"true\" as const,\n      }\n    : {\n        \"data-active\": undefined,\n      };\n  const rendersRouterLink = targetPathname !== null && !target && !hasDownload;\n  const childProps: NavLinkProps = to\n    ? ({ ...childRest, to, target, onPress, onClick } as NavLinkProps)\n    : ({ ...childRest, href, target, onPress, onClick } as NavLinkProps);\n  const handleClick = (event: MouseEvent) => {\n    onPress?.(event);\n    if (event.defaultPrevented) return;\n    onClick?.(event);\n  };\n\n  return (\n    <LayoutBlock\n      asChild\n      paddingX=\"sm\"\n      paddingY=\"xs\"\n      radius={resolvedSlot === \"pill\" ? \"round\" : \"md\"}\n      background={isActive && options.activeBackground ? \"selected\" : undefined}\n      ref={ref}\n      className={classes(options.className, inheritedNavClass, className)}\n      data-slot={resolvedSlot}\n      {...activeProps}\n    >\n      {rendersRouterLink ? (\n        <Link {...childProps}>{children}</Link>\n      ) : (\n        <a {...childRest} href={href} target={target} onClick={handleClick}>\n          {children}\n        </a>\n      )}\n    </LayoutBlock>\n  );\n}\n\nexport function Tabs(props: TabsProps): JSX.Element;\nexport function Tabs(props: TabsAsChildProps): JSX.Element;\nexport function Tabs(props: TabsProps | TabsAsChildProps): JSX.Element {\n  return renderNavSet(props, \"tabs\");\n}\n\nexport function Pills(props: PillsProps): JSX.Element;\nexport function Pills(props: PillsAsChildProps): JSX.Element;\nexport function Pills(props: PillsProps | PillsAsChildProps): JSX.Element {\n  return renderNavSet(props, \"pills\");\n}\n\nexport function Tab(props: TabProps): JSX.Element {\n  return renderRoutedLink(props, \"tab\", { className: \"tab\" });\n}\n\nexport function Pill(props: PillProps): JSX.Element {\n  return renderRoutedLink(props, \"pill\", { activeBackground: true, className: \"pill\" });\n}\n\nexport function NavItem(props: NavItemProps): JSX.Element;\nexport function NavItem(props: NavItemAsChildProps): JSX.Element;\nexport function NavItem(props: NavItemProps | NavItemAsChildProps): JSX.Element {\n  const {\n    asChild,\n    active = false,\n    children,\n    ref,\n    class: className,\n    match: _match,\n    ...rest\n  } = props as (NavItemProps | NavItemAsChildProps) & { match?: unknown };\n  void _match;\n\n  if (asChild) {\n    return (\n      <LayoutBlock\n        asChild\n        paddingX=\"sm\"\n        paddingY=\"xs\"\n        radius=\"md\"\n        background={active ? \"selected\" : undefined}\n        {...rest}\n        ref={ref}\n        className={className}\n        data-active={active ? \"true\" : undefined}\n        data-slot=\"nav-item\"\n      >\n        {children}\n      </LayoutBlock>\n    );\n  }\n\n  return (\n    <LayoutBlock\n      as=\"a\"\n      paddingX=\"sm\"\n      paddingY=\"xs\"\n      radius=\"md\"\n      background={active ? \"selected\" : undefined}\n      {...rest}\n      ref={ref}\n      className={className}\n      data-active={active ? \"true\" : undefined}\n      data-slot=\"nav-item\"\n    >\n      {children}\n    </LayoutBlock>\n  );\n}\n\nexport function NavLink(props: NavLinkProps): JSX.Element {\n  return renderRoutedLink(props, \"nav-item\", { activeBackground: true, inheritSlot: true });\n}\n"],"mappings":"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"}
+{"version":3,"file":"nav.js","names":[],"sources":["../../../src/components/nav/nav.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { Slot } from \"@askrjs/askr/foundations\";\nimport { currentRoute, Link } from \"@askrjs/askr/router\";\nimport { Block } from \"../block\";\nimport { classes } from \"../_internal/classes\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport { intrinsicElement } from \"../_internal/jsx\";\nimport { assertSafeNavigationHref, resolvePathname } from \"../_internal/pathname\";\nimport type {\n  NavItemAsChildProps,\n  NavItemProps,\n  NavLinkProps,\n  PillProps,\n  PillsAsChildProps,\n  PillsProps,\n  TabProps,\n  TabsAsChildProps,\n  TabsProps,\n} from \"./nav.types\";\n\nconst LayoutBlock = Block as (props: Record<string, unknown>) => JSX.Element;\n\nfunction normalizePathname(pathname: string): string {\n  return pathname.endsWith(\"/\") && pathname !== \"/\" ? pathname.slice(0, -1) : pathname;\n}\n\nfunction getCurrentPathname(): string | null {\n  if (typeof window === \"undefined\") {\n    return null;\n  }\n\n  return normalizePathname(window.location.pathname || \"/\");\n}\n\nfunction getReactiveCurrentPathname(): string | null {\n  try {\n    return normalizePathname(currentRoute().path || \"/\");\n  } catch {\n    return getCurrentPathname();\n  }\n}\n\nfunction isActiveNavLink(\n  currentPathname: string,\n  targetPathname: string,\n  match: NavLinkProps[\"match\"] = \"prefix\",\n): boolean {\n  if (targetPathname === \"/\") {\n    return currentPathname === \"/\";\n  }\n\n  if (match === \"exact\") {\n    return currentPathname === targetPathname;\n  }\n\n  return currentPathname === targetPathname || currentPathname.startsWith(`${targetPathname}/`);\n}\n\nfunction renderNavSet(\n  props: TabsProps | TabsAsChildProps | PillsProps | PillsAsChildProps,\n  slot: \"tabs\" | \"pills\",\n): JSX.Element {\n  const className = \"class\" in props ? props.class : undefined;\n  const { asChild, children, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    class: classes(slot, className),\n    \"data-slot\": slot,\n  });\n\n  if (asChild) {\n    return <Slot asChild {...finalProps} children={children as JSX.Element} />;\n  }\n\n  return intrinsicElement(\"nav\", finalProps, children);\n}\n\nfunction renderRoutedLink(\n  props: NavLinkProps | TabProps | PillProps,\n  slot: \"nav-item\" | \"tab\" | \"pill\",\n  options: { activeBackground?: boolean; className?: string; inheritSlot?: boolean } = {},\n): JSX.Element {\n  const {\n    active,\n    children,\n    href: suppliedHref,\n    to,\n    onPress,\n    onClick,\n    ref,\n    class: className,\n    match = \"prefix\",\n    target,\n    ...rest\n  } = props as NavLinkProps & {\n    onPress?: (event: Event) => void;\n    onClick?: (event: MouseEvent) => void;\n  };\n  const href = to?.href ?? suppliedHref;\n  if (!href) {\n    throw new Error(\"Nav link requires href or to.\");\n  }\n  assertSafeNavigationHref(href);\n  const inheritedSlot =\n    options.inheritSlot && typeof (rest as Record<string, unknown>)[\"data-slot\"] === \"string\"\n      ? String((rest as Record<string, unknown>)[\"data-slot\"])\n      : undefined;\n  const resolvedSlot = (inheritedSlot ?? slot) as \"nav-item\" | \"tab\" | \"pill\";\n  const inheritedNavClass =\n    slot === \"nav-item\" && resolvedSlot !== \"nav-item\" ? \"nav-item\" : undefined;\n  const { \"data-slot\": _dataSlot, ...childRest } = rest as Record<string, unknown>;\n  void _dataSlot;\n  const hasDownload = (rest as Record<string, unknown>).download !== undefined;\n  const currentPathname = getReactiveCurrentPathname();\n  const targetPathname = resolvePathname(href);\n  const routeActive =\n    currentPathname !== null &&\n    targetPathname !== null &&\n    isActiveNavLink(currentPathname, targetPathname, match);\n  const isActive = active ?? routeActive;\n  const activeProps = isActive\n    ? {\n        \"aria-current\": \"page\" as const,\n        \"data-active\": \"true\" as const,\n      }\n    : {\n        \"data-active\": undefined,\n      };\n  const rendersRouterLink = targetPathname !== null && !target && !hasDownload;\n  const childProps: NavLinkProps = to\n    ? ({ ...childRest, to, target, onPress, onClick } as NavLinkProps)\n    : ({ ...childRest, href, target, onPress, onClick } as NavLinkProps);\n  const handleClick = (event: MouseEvent) => {\n    onPress?.(event);\n    if (event.defaultPrevented) return;\n    onClick?.(event);\n  };\n\n  return (\n    <LayoutBlock\n      asChild\n      paddingX=\"sm\"\n      paddingY=\"xs\"\n      radius={resolvedSlot === \"pill\" ? \"round\" : \"md\"}\n      background={isActive && options.activeBackground ? \"selected\" : undefined}\n      ref={ref}\n      className={classes(options.className, inheritedNavClass, className)}\n      data-slot={resolvedSlot}\n      {...activeProps}\n    >\n      {rendersRouterLink ? (\n        <Link {...childProps}>{children}</Link>\n      ) : (\n        <a {...childRest} href={href} target={target} onClick={handleClick}>\n          {children}\n        </a>\n      )}\n    </LayoutBlock>\n  );\n}\n\n/** Renders a `<nav>` wrapper (or, with `asChild`, merges onto a child) for a set of {@link Tab} links. */\nexport function Tabs(props: TabsProps): JSX.Element;\nexport function Tabs(props: TabsAsChildProps): JSX.Element;\nexport function Tabs(props: TabsProps | TabsAsChildProps): JSX.Element {\n  return renderNavSet(props, \"tabs\");\n}\n\n/** Renders a `<nav>` wrapper (or, with `asChild`, merges onto a child) for a set of {@link Pill} links. */\nexport function Pills(props: PillsProps): JSX.Element;\nexport function Pills(props: PillsAsChildProps): JSX.Element;\nexport function Pills(props: PillsProps | PillsAsChildProps): JSX.Element {\n  return renderNavSet(props, \"pills\");\n}\n\n/** A router-aware link styled as a tab, auto-marked active by matching the current route (see {@link NavLinkProps.match}). */\nexport function Tab(props: TabProps): JSX.Element {\n  return renderRoutedLink(props, \"tab\", { className: \"tab\" });\n}\n\n/** A router-aware link styled as a pill, auto-marked active by matching the current route, with an active background highlight. */\nexport function Pill(props: PillProps): JSX.Element {\n  return renderRoutedLink(props, \"pill\", { activeBackground: true, className: \"pill\" });\n}\n\n/** A generic navigation item, rendered as an `<a>` (or, with `asChild`, merged onto a child), highlighted when `active`. */\nexport function NavItem(props: NavItemProps): JSX.Element;\nexport function NavItem(props: NavItemAsChildProps): JSX.Element;\nexport function NavItem(props: NavItemProps | NavItemAsChildProps): JSX.Element {\n  const {\n    asChild,\n    active = false,\n    children,\n    ref,\n    class: className,\n    match: _match,\n    ...rest\n  } = props as (NavItemProps | NavItemAsChildProps) & { match?: unknown };\n  void _match;\n\n  if (asChild) {\n    return (\n      <LayoutBlock\n        asChild\n        paddingX=\"sm\"\n        paddingY=\"xs\"\n        radius=\"md\"\n        background={active ? \"selected\" : undefined}\n        {...rest}\n        ref={ref}\n        className={className}\n        data-active={active ? \"true\" : undefined}\n        data-slot=\"nav-item\"\n      >\n        {children}\n      </LayoutBlock>\n    );\n  }\n\n  return (\n    <LayoutBlock\n      as=\"a\"\n      paddingX=\"sm\"\n      paddingY=\"xs\"\n      radius=\"md\"\n      background={active ? \"selected\" : undefined}\n      {...rest}\n      ref={ref}\n      className={className}\n      data-active={active ? \"true\" : undefined}\n      data-slot=\"nav-item\"\n    >\n      {children}\n    </LayoutBlock>\n  );\n}\n\n/** A router-aware navigation link that highlights itself when its route matches the current location. */\nexport function NavLink(props: NavLinkProps): JSX.Element {\n  return renderRoutedLink(props, \"nav-item\", { activeBackground: true, inheritSlot: true });\n}\n"],"mappings":"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"}

package/dist/components/nav/nav.types.d.ts

@@ -3,50 +3,64 @@ import { JSXElement } from "@askrjs/askr/foundations";
 import { LinkProps } from "@askrjs/askr/router";
 import { Ref } from "@askrjs/askr/foundations/utilities";
 //#region src/components/nav/nav.types.d.ts
+/** Route-matching strategy for {@link NavLinkProps.match}: `"prefix"` matches sub-routes, `"exact"` requires an identical path. */
 type NavLinkMatch = "prefix" | "exact";
+/** Props shared by both {@link Tabs} call signatures. */
 type TabsOwnProps = {
   children?: unknown;
 };
+/** Props for {@link Tabs} rendered as its default `<nav>` element. */
 type TabsProps = Omit<JSX.IntrinsicElements["nav"], "children" | "ref"> & TabsOwnProps & {
   asChild?: false;
   ref?: Ref<HTMLElement>;
 };
+/** Props for {@link Tabs} rendered with `asChild`, merging onto a single child element. */
 type TabsAsChildProps = Omit<JSX.IntrinsicElements["nav"], "children" | "ref"> & TabsOwnProps & {
   asChild: true;
   children: JSXElement;
   ref?: Ref<unknown>;
 };
+/** Props shared by both {@link Pills} call signatures. */
 type PillsOwnProps = {
   children?: unknown;
 };
+/** Props for {@link Pills} rendered as its default `<nav>` element. */
 type PillsProps = Omit<JSX.IntrinsicElements["nav"], "children" | "ref"> & PillsOwnProps & {
   asChild?: false;
   ref?: Ref<HTMLElement>;
 };
+/** Props for {@link Pills} rendered with `asChild`, merging onto a single child element. */
 type PillsAsChildProps = Omit<JSX.IntrinsicElements["nav"], "children" | "ref"> & PillsOwnProps & {
   asChild: true;
   children: JSXElement;
   ref?: Ref<unknown>;
 };
+/** Props shared by both {@link NavItem} call signatures. */
 type NavItemOwnProps = {
   active?: boolean;
   children?: unknown;
 };
+/** Props for {@link NavItem} rendered as its default `<a>` element. */
 type NavItemProps = Omit<JSX.IntrinsicElements["a"], "children" | "ref"> & NavItemOwnProps & {
   asChild?: false;
   ref?: Ref<HTMLAnchorElement>;
 };
+/** Props for {@link NavItem} rendered with `asChild`, merging onto a single child element. */
 type NavItemAsChildProps = Omit<JSX.IntrinsicElements["a"], "children" | "ref"> & NavItemOwnProps & {
   asChild: true;
   children: JSXElement;
   ref?: Ref<unknown>;
 };
+/** Props shared by {@link NavLink}, {@link Tab}, and {@link Pill}. */
 type NavLinkOwnProps = NavItemOwnProps & {
   match?: NavLinkMatch;
   onPress?: (event: Event) => void;
 };
+/** Props for the {@link NavLink} component. */
 type NavLinkProps = LinkProps & NavLinkOwnProps;
+/** Props for the {@link Tab} component. */
 type TabProps = LinkProps & NavLinkOwnProps;
+/** Props for the {@link Pill} component. */
 type PillProps = LinkProps & NavLinkOwnProps;
 //#endregion
 export { NavItemAsChildProps, NavItemOwnProps, NavItemProps, NavLinkMatch, NavLinkOwnProps, NavLinkProps, PillProps, PillsAsChildProps, PillsOwnProps, PillsProps, TabProps, TabsAsChildProps, TabsOwnProps, TabsProps };

package/dist/components/navbar/navbar.d.ts

@@ -1,9 +1,17 @@
 import { NavBrandProps, NavDropdownProps, NavGroupProps, NavbarProps } from "./navbar.types.js";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/navbar/navbar.d.ts
+/**
+ * Horizontal navigation bar. Below `collapseAt`/`breakpoint`, non-brand
+ * children are grouped behind a collapsible toggle so brand content stays
+ * visible while the rest collapses on small screens.
+ */
 declare function Navbar(props: NavbarProps): JSX.Element;
+/** Renders the brand/logo slot of a {@link Navbar}; excluded from the collapsible section. */
 declare function NavBrand(props: NavBrandProps): JSX.Element;
+/** Groups related {@link Navbar} items under an optional label. */
 declare function NavGroup(props: NavGroupProps): JSX.Element;
+/** Renders a dropdown menu triggered from within a {@link Navbar}. */
 declare function NavDropdown(props: NavDropdownProps): JSX.Element;
 //#endregion
 export { NavBrand, NavDropdown, NavGroup, Navbar };

package/dist/components/navbar/navbar.js

@@ -22,6 +22,11 @@ function hasRenderableChildren(children) {
 		return child !== void 0 && child !== null && typeof child !== "boolean";
 	});
 }
+/**
+* Horizontal navigation bar. Below `collapseAt`/`breakpoint`, non-brand
+* children are grouped behind a collapsible toggle so brand content stays
+* visible while the rest collapses on small screens.
+*/
 function Navbar(props) {
 	const { breakpoint, children, collapseAt = breakpoint ?? false, collapseIcon, collapseLabel = "Menu", ...rest } = props;
 	if (!collapseAt) return /* @__PURE__ */ jsx(LayoutBlock, {
@@ -72,6 +77,7 @@ function Navbar(props) {
 		children: [...brandChildren, collapse]
 	});
 }
+/** Renders the brand/logo slot of a {@link Navbar}; excluded from the collapsible section. */
 function NavBrand(props) {
 	const { children, ...rest } = props;
 	return /* @__PURE__ */ jsx(LayoutBlock, {
@@ -84,6 +90,7 @@ function NavBrand(props) {
 		children
 	});
 }
+/** Groups related {@link Navbar} items under an optional label. */
 function NavGroup(props) {
 	const { align, children, label, title = label, ...rest } = props;
 	return /* @__PURE__ */ jsxs(LayoutBlock, {
@@ -102,6 +109,7 @@ function NavGroup(props) {
 		})]
 	});
 }
+/** Renders a dropdown menu triggered from within a {@link Navbar}. */
 function NavDropdown(props) {
 	const { align = "end", children, label, side = "bottom", sideOffset = 6, ...rest } = props;
 	return /* @__PURE__ */ jsx(LayoutBlock, {

package/dist/components/navbar/navbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar.js","names":["DropdownContent"],"sources":["../../../src/components/navbar/navbar.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n  Dropdown,\n  DropdownTrigger,\n} from \"@askrjs/ui\";\nimport { Block } from \"../block\";\nimport { classes } from \"../_internal/classes\";\nimport { isJsxElement, toChildArray } from \"../_internal/jsx\";\nimport { DropdownContent } from \"../overlays/dropdown-content\";\nimport type { NavBrandProps, NavDropdownProps, NavGroupProps, NavbarProps } from \"./navbar.types\";\n\nconst ASKR_FRAGMENT = Symbol.for(\"askr.fragment\");\nconst LayoutBlock = Block as (props: Record<string, unknown>) => JSX.Element;\n\nfunction flattenNavbarChildren(children: unknown): unknown[] {\n  return toChildArray(children).flatMap((child) => {\n    if (isJsxElement(child) && child.type === ASKR_FRAGMENT) {\n      return flattenNavbarChildren(child.props?.children);\n    }\n\n    return [child];\n  });\n}\n\nfunction isNavBrandChild(child: unknown): boolean {\n  return (\n    isJsxElement(child) && (child.type === NavBrand || child.props?.[\"data-slot\"] === \"nav-brand\")\n  );\n}\n\nfunction hasRenderableChildren(children: readonly unknown[]): boolean {\n  return children.some((child) => {\n    if (Array.isArray(child)) {\n      return hasRenderableChildren(child);\n    }\n\n    return child !== undefined && child !== null && typeof child !== \"boolean\";\n  });\n}\n\nexport function Navbar(props: NavbarProps): JSX.Element {\n  const {\n    breakpoint,\n    children,\n    collapseAt = breakpoint ?? false,\n    collapseIcon,\n    collapseLabel = \"Menu\",\n    ...rest\n  } = props;\n\n  if (!collapseAt) {\n    return (\n      <LayoutBlock\n        as=\"nav\"\n        direction=\"row\"\n        align=\"center\"\n        gap=\"md\"\n        width=\"full\"\n        {...rest}\n        data-slot=\"navbar\"\n      >\n        {children}\n      </LayoutBlock>\n    );\n  }\n\n  const navbarChildren = flattenNavbarChildren(children);\n  const brandChildren = navbarChildren.filter(isNavBrandChild);\n  const navChildren = navbarChildren.filter((child) => !isNavBrandChild(child));\n  const hasNavContent = hasRenderableChildren(navChildren);\n  const content = (\n    <LayoutBlock direction=\"row\" align=\"center\" gap=\"md\" width=\"full\" data-slot=\"navbar-content\">\n      {navChildren}\n    </LayoutBlock>\n  );\n  const collapse = hasNavContent ? (\n    <div data-slot=\"navbar-collapse\">\n      <Collapsible>\n        <CollapsibleTrigger aria-label={collapseLabel} data-slot=\"navbar-toggle\">\n          {collapseIcon}\n          <span data-slot=\"navbar-toggle-label\">{collapseLabel}</span>\n        </CollapsibleTrigger>\n        <CollapsibleContent forceMount asChild data-slot=\"navbar-content\">\n          {content}\n        </CollapsibleContent>\n      </Collapsible>\n    </div>\n  ) : null;\n\n  return (\n    <LayoutBlock\n      as=\"nav\"\n      direction=\"row\"\n      align=\"center\"\n      gap=\"md\"\n      width=\"full\"\n      {...rest}\n      data-collapse-at={collapseAt}\n      data-slot=\"navbar\"\n    >\n      {[...brandChildren, collapse]}\n    </LayoutBlock>\n  );\n}\n\nexport function NavBrand(props: NavBrandProps): JSX.Element {\n  const { children, ...rest } = props;\n\n  return (\n    <LayoutBlock\n      direction=\"row\"\n      align=\"center\"\n      gap=\"sm\"\n      shrink={false}\n      {...rest}\n      data-slot=\"nav-brand\"\n    >\n      {children}\n    </LayoutBlock>\n  );\n}\n\nexport function NavGroup(props: NavGroupProps): JSX.Element {\n  const { align, children, label, title = label, ...rest } = props;\n\n  return (\n    <LayoutBlock align={align} gap=\"sm\" {...rest} data-align={align} data-slot=\"nav-group\">\n      {title !== undefined ? <div data-slot=\"nav-group-label\">{title}</div> : null}\n      <LayoutBlock gap=\"xs\" data-slot=\"nav-group-body\">\n        {children}\n      </LayoutBlock>\n    </LayoutBlock>\n  );\n}\n\nexport function NavDropdown(props: NavDropdownProps): JSX.Element {\n  const { align = \"end\", children, label, side = \"bottom\", sideOffset = 6, ...rest } = props;\n\n  return (\n    <LayoutBlock direction=\"row\" align=\"center\" data-slot=\"nav-dropdown\">\n      <Dropdown {...rest}>\n        <DropdownTrigger class={classes(\"nav-item\")} data-slot=\"nav-dropdown-trigger\">\n          {label}\n        </DropdownTrigger>\n        <DropdownContent\n          align={align}\n          class={classes(\"dropdown-content\")}\n          data-slot=\"nav-dropdown-content\"\n          side={side}\n          sideOffset={sideOffset}\n        >\n          {children}\n        </DropdownContent>\n      </Dropdown>\n    </LayoutBlock>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"navbar.js","names":["DropdownContent"],"sources":["../../../src/components/navbar/navbar.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n  Dropdown,\n  DropdownTrigger,\n} from \"@askrjs/ui\";\nimport { Block } from \"../block\";\nimport { classes } from \"../_internal/classes\";\nimport { isJsxElement, toChildArray } from \"../_internal/jsx\";\nimport { DropdownContent } from \"../overlays/dropdown-content\";\nimport type { NavBrandProps, NavDropdownProps, NavGroupProps, NavbarProps } from \"./navbar.types\";\n\nconst ASKR_FRAGMENT = Symbol.for(\"askr.fragment\");\nconst LayoutBlock = Block as (props: Record<string, unknown>) => JSX.Element;\n\nfunction flattenNavbarChildren(children: unknown): unknown[] {\n  return toChildArray(children).flatMap((child) => {\n    if (isJsxElement(child) && child.type === ASKR_FRAGMENT) {\n      return flattenNavbarChildren(child.props?.children);\n    }\n\n    return [child];\n  });\n}\n\nfunction isNavBrandChild(child: unknown): boolean {\n  return (\n    isJsxElement(child) && (child.type === NavBrand || child.props?.[\"data-slot\"] === \"nav-brand\")\n  );\n}\n\nfunction hasRenderableChildren(children: readonly unknown[]): boolean {\n  return children.some((child) => {\n    if (Array.isArray(child)) {\n      return hasRenderableChildren(child);\n    }\n\n    return child !== undefined && child !== null && typeof child !== \"boolean\";\n  });\n}\n\n/**\n * Horizontal navigation bar. Below `collapseAt`/`breakpoint`, non-brand\n * children are grouped behind a collapsible toggle so brand content stays\n * visible while the rest collapses on small screens.\n */\nexport function Navbar(props: NavbarProps): JSX.Element {\n  const {\n    breakpoint,\n    children,\n    collapseAt = breakpoint ?? false,\n    collapseIcon,\n    collapseLabel = \"Menu\",\n    ...rest\n  } = props;\n\n  if (!collapseAt) {\n    return (\n      <LayoutBlock\n        as=\"nav\"\n        direction=\"row\"\n        align=\"center\"\n        gap=\"md\"\n        width=\"full\"\n        {...rest}\n        data-slot=\"navbar\"\n      >\n        {children}\n      </LayoutBlock>\n    );\n  }\n\n  const navbarChildren = flattenNavbarChildren(children);\n  const brandChildren = navbarChildren.filter(isNavBrandChild);\n  const navChildren = navbarChildren.filter((child) => !isNavBrandChild(child));\n  const hasNavContent = hasRenderableChildren(navChildren);\n  const content = (\n    <LayoutBlock direction=\"row\" align=\"center\" gap=\"md\" width=\"full\" data-slot=\"navbar-content\">\n      {navChildren}\n    </LayoutBlock>\n  );\n  const collapse = hasNavContent ? (\n    <div data-slot=\"navbar-collapse\">\n      <Collapsible>\n        <CollapsibleTrigger aria-label={collapseLabel} data-slot=\"navbar-toggle\">\n          {collapseIcon}\n          <span data-slot=\"navbar-toggle-label\">{collapseLabel}</span>\n        </CollapsibleTrigger>\n        <CollapsibleContent forceMount asChild data-slot=\"navbar-content\">\n          {content}\n        </CollapsibleContent>\n      </Collapsible>\n    </div>\n  ) : null;\n\n  return (\n    <LayoutBlock\n      as=\"nav\"\n      direction=\"row\"\n      align=\"center\"\n      gap=\"md\"\n      width=\"full\"\n      {...rest}\n      data-collapse-at={collapseAt}\n      data-slot=\"navbar\"\n    >\n      {[...brandChildren, collapse]}\n    </LayoutBlock>\n  );\n}\n\n/** Renders the brand/logo slot of a {@link Navbar}; excluded from the collapsible section. */\nexport function NavBrand(props: NavBrandProps): JSX.Element {\n  const { children, ...rest } = props;\n\n  return (\n    <LayoutBlock\n      direction=\"row\"\n      align=\"center\"\n      gap=\"sm\"\n      shrink={false}\n      {...rest}\n      data-slot=\"nav-brand\"\n    >\n      {children}\n    </LayoutBlock>\n  );\n}\n\n/** Groups related {@link Navbar} items under an optional label. */\nexport function NavGroup(props: NavGroupProps): JSX.Element {\n  const { align, children, label, title = label, ...rest } = props;\n\n  return (\n    <LayoutBlock align={align} gap=\"sm\" {...rest} data-align={align} data-slot=\"nav-group\">\n      {title !== undefined ? <div data-slot=\"nav-group-label\">{title}</div> : null}\n      <LayoutBlock gap=\"xs\" data-slot=\"nav-group-body\">\n        {children}\n      </LayoutBlock>\n    </LayoutBlock>\n  );\n}\n\n/** Renders a dropdown menu triggered from within a {@link Navbar}. */\nexport function NavDropdown(props: NavDropdownProps): JSX.Element {\n  const { align = \"end\", children, label, side = \"bottom\", sideOffset = 6, ...rest } = props;\n\n  return (\n    <LayoutBlock direction=\"row\" align=\"center\" data-slot=\"nav-dropdown\">\n      <Dropdown {...rest}>\n        <DropdownTrigger class={classes(\"nav-item\")} data-slot=\"nav-dropdown-trigger\">\n          {label}\n        </DropdownTrigger>\n        <DropdownContent\n          align={align}\n          class={classes(\"dropdown-content\")}\n          data-slot=\"nav-dropdown-content\"\n          side={side}\n          sideOffset={sideOffset}\n        >\n          {children}\n        </DropdownContent>\n      </Dropdown>\n    </LayoutBlock>\n  );\n}\n"],"mappings":"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"}

package/dist/components/navbar/navbar.types.d.ts

@@ -2,18 +2,23 @@ import { BlockAsChildProps, BlockDivProps, BlockElementProps } from "../block/bl
 import "../block/index.js";
 import { DropdownContentOwnProps, DropdownProps } from "@askrjs/ui";
 //#region src/components/navbar/navbar.types.d.ts
+/** Breakpoint at which a {@link Navbar} collapses non-brand content behind a toggle. */
 type NavbarCollapseBreakpoint = "sm" | "md" | "lg" | "xl";
+/** Props for the {@link Navbar} component. */
 type NavbarProps = Omit<BlockElementProps<"nav">, "as" | "direction" | "align"> & {
   breakpoint?: NavbarCollapseBreakpoint | false;
   collapseAt?: NavbarCollapseBreakpoint | false;
   collapseLabel?: string;
   collapseIcon?: unknown;
 };
+/** Props for the {@link NavBrand} component. */
 type NavBrandProps = BlockDivProps | BlockElementProps<"a"> | BlockAsChildProps;
+/** Props for the {@link NavGroup} component. */
 type NavGroupProps = Omit<BlockDivProps, "title"> & {
   label?: unknown;
   title?: unknown;
 };
+/** Props for the {@link NavDropdown} component. */
 type NavDropdownProps = Omit<DropdownProps, "children"> & Pick<DropdownContentOwnProps, "align" | "side" | "sideOffset"> & {
   label: unknown;
   children?: unknown;

package/dist/components/overlays/dropdown-content.d.ts

@@ -1,6 +1,11 @@
 import { DropdownContentAsChildProps, DropdownContentProps } from "@askrjs/ui";
 import { JSX } from "@askrjs/askr/jsx-runtime";
 //#region src/components/overlays/dropdown-content.d.ts
+/**
+ * Dropdown/context-menu content wrapper around `@askrjs/ui`'s `DropdownContent`.
+ * Non-`asChild` usage lazily evaluates `children` inside a body component so
+ * they're only rendered once the dropdown is actually open.
+ */
 declare function DropdownContent$1(props: DropdownContentProps): JSX.Element | null;
 declare function DropdownContent$1(props: DropdownContentAsChildProps): JSX.Element | null;
 //#endregion

package/dist/components/overlays/dropdown-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-content.js","names":["DropdownContent","UiDropdownContent"],"sources":["../../../src/components/overlays/dropdown-content.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { DropdownContent as UiDropdownContent } from \"@askrjs/ui\";\nimport type { DropdownContentAsChildProps, DropdownContentProps } from \"@askrjs/ui\";\n\ntype DropdownContentBodyProps = {\n  render: () => unknown;\n};\n\nfunction DropdownContentBody(props: DropdownContentBodyProps): JSX.Element {\n  return <>{props.render()}</>;\n}\n\nexport function DropdownContent(props: DropdownContentProps): JSX.Element | null;\nexport function DropdownContent(props: DropdownContentAsChildProps): JSX.Element | null;\nexport function DropdownContent(\n  props: DropdownContentProps | DropdownContentAsChildProps,\n): JSX.Element | null {\n  if (\"asChild\" in props && props.asChild) {\n    return <UiDropdownContent {...props} />;\n  }\n\n  const { children, ...rest } = props as DropdownContentProps;\n\n  return (\n    <UiDropdownContent {...rest}>\n      <DropdownContentBody render={() => children} />\n    </UiDropdownContent>\n  );\n}\n"],"mappings":";;;AAQA,SAAS,oBAAoB,OAA8C;CACzE,OAAO,oBAAA,UAAA,EAAA,UAAG,MAAM,OAAO,EAAI,CAAA;AAC7B;AAIA,SAAgBA,kBACd,OACoB;CACpB,IAAI,aAAa,SAAS,MAAM,SAC9B,OAAO,oBAACC,iBAAD,EAAmB,GAAI,MAAQ,CAAA;CAGxC,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAACA,iBAAD;EAAmB,GAAI;EACrB,UAAA,oBAAC,qBAAD,EAAqB,cAAc,SAAW,CAAA;CAC7B,CAAA;AAEvB"}
+{"version":3,"file":"dropdown-content.js","names":["DropdownContent","UiDropdownContent"],"sources":["../../../src/components/overlays/dropdown-content.tsx"],"sourcesContent":["import type { JSX } from \"@askrjs/askr/jsx-runtime\";\nimport { DropdownContent as UiDropdownContent } from \"@askrjs/ui\";\nimport type { DropdownContentAsChildProps, DropdownContentProps } from \"@askrjs/ui\";\n\ntype DropdownContentBodyProps = {\n  render: () => unknown;\n};\n\nfunction DropdownContentBody(props: DropdownContentBodyProps): JSX.Element {\n  return <>{props.render()}</>;\n}\n\n/**\n * Dropdown/context-menu content wrapper around `@askrjs/ui`'s `DropdownContent`.\n * Non-`asChild` usage lazily evaluates `children` inside a body component so\n * they're only rendered once the dropdown is actually open.\n */\nexport function DropdownContent(props: DropdownContentProps): JSX.Element | null;\nexport function DropdownContent(props: DropdownContentAsChildProps): JSX.Element | null;\nexport function DropdownContent(\n  props: DropdownContentProps | DropdownContentAsChildProps,\n): JSX.Element | null {\n  if (\"asChild\" in props && props.asChild) {\n    return <UiDropdownContent {...props} />;\n  }\n\n  const { children, ...rest } = props as DropdownContentProps;\n\n  return (\n    <UiDropdownContent {...rest}>\n      <DropdownContentBody render={() => children} />\n    </UiDropdownContent>\n  );\n}\n"],"mappings":";;;AAQA,SAAS,oBAAoB,OAA8C;CACzE,OAAO,oBAAA,UAAA,EAAA,UAAG,MAAM,OAAO,EAAI,CAAA;AAC7B;AASA,SAAgBA,kBACd,OACoB;CACpB,IAAI,aAAa,SAAS,MAAM,SAC9B,OAAO,oBAACC,iBAAD,EAAmB,GAAI,MAAQ,CAAA;CAGxC,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAACA,iBAAD;EAAmB,GAAI;EACrB,UAAA,oBAAC,qBAAD,EAAqB,cAAc,SAAW,CAAA;CAC7B,CAAA;AAEvB"}