silver-ui 0.1.0

package/dist/chunk-CR4NB42L.cjs

@@ -0,0 +1,375 @@
+'use strict';
+
+var chunkO5RVLBKN_cjs = require('./chunk-O5RVLBKN.cjs');
+var chunkYOWRLFMF_cjs = require('./chunk-YOWRLFMF.cjs');
+var chunk47BELFYO_cjs = require('./chunk-47BELFYO.cjs');
+var chunkOA4KIVLO_cjs = require('./chunk-OA4KIVLO.cjs');
+var chunkPHFEQG4E_cjs = require('./chunk-PHFEQG4E.cjs');
+var chunkJAX62FUE_cjs = require('./chunk-JAX62FUE.cjs');
+var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
+var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/TopNav/TopNav.recipe.ts
+var topNavRecipe = chunkJAX62FUE_cjs.cva({
+  base: {
+    alignItems: "center",
+    w: "100%",
+    p: "2",
+    boxSizing: "border-box"
+  },
+  variants: {
+    layout: {
+      flex: {
+        display: "flex"
+      },
+      grid: {
+        display: "grid",
+        gridTemplateColumns: "1fr auto 1fr"
+      },
+      mobile: {
+        display: "flex"
+      }
+    }
+  },
+  defaultVariants: {
+    layout: "flex"
+  }
+});
+var TopNavRenderContext = react.createContext("default");
+TopNavRenderContext.displayName = "TopNavRenderContext";
+var TopNavMobileContentContext = react.createContext(null);
+TopNavMobileContentContext.displayName = "TopNavMobileContentContext";
+var TopNavSlotContext = react.createContext("start");
+TopNavSlotContext.displayName = "TopNavSlotContext";
+function useTopNavRenderMode() {
+  return react.use(TopNavRenderContext);
+}
+function useTopNavMobileContent() {
+  return react.use(TopNavMobileContentContext);
+}
+var styles = {
+  leftSection: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    gap: "4",
+    flex: "1 1 0%",
+    minW: 0
+  }),
+  heading: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    flexShrink: 0
+  }),
+  startContent: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    gap: "1"
+  }),
+  centerContent: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: "1"
+  }),
+  rightSection: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "flex-end",
+    gap: "1"
+  }),
+  endContent: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    gap: "1",
+    flexShrink: 0,
+    ms: "auto"
+  }),
+  mobileEnd: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    gap: "1",
+    ms: "auto"
+  }),
+  drawerItems: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    flexDirection: "column",
+    gap: "0.5"
+  }),
+  drawerDivider: chunkAZDWQGAX_cjs.css({
+    my: "2"
+  })
+};
+function TopNav({
+  centerContent,
+  children,
+  className,
+  "data-testid": dataTestId,
+  endContent,
+  heading,
+  label = "Top navigation",
+  ref,
+  startContent,
+  style
+}) {
+  const renderMode = useTopNavRenderMode();
+  const mobileContent = useTopNavMobileContent();
+  const { hasAutoToggle } = chunkO5RVLBKN_cjs.useAppShellMobile();
+  const resolvedStartContent = startContent ?? children;
+  const hasCenterContent = centerContent != null;
+  const hasCollapsibleContent = resolvedStartContent != null || centerContent != null;
+  const hasMobileDrawerContent = hasCollapsibleContent || mobileContent != null;
+  if (renderMode === "mobile-bar") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "nav",
+      {
+        "aria-label": label,
+        className: chunkSPDVNY2Z_cjs.cx(topNavRecipe({ layout: "mobile" }), className),
+        "data-testid": dataTestId,
+        ref,
+        style,
+        children: [
+          heading != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.heading, children: heading }) : null,
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.mobileEnd, children: [
+            endContent,
+            hasMobileDrawerContent && hasAutoToggle ? /* @__PURE__ */ jsxRuntime.jsx(chunkO5RVLBKN_cjs.MobileNavToggle, {}) : null
+          ] })
+        ]
+      }
+    );
+  }
+  if (renderMode === "drawer") {
+    if (!hasCollapsibleContent && mobileContent == null) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(chunkO5RVLBKN_cjs.MobileNav, { header: heading, children: [
+      hasCollapsibleContent ? /* @__PURE__ */ jsxRuntime.jsx(TopNavSlotContext, { value: "start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.drawerItems, children: [
+        resolvedStartContent,
+        centerContent
+      ] }) }) : null,
+      hasCollapsibleContent && mobileContent != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.drawerDivider, children: /* @__PURE__ */ jsxRuntime.jsx(chunkYOWRLFMF_cjs.Divider, {}) }) : null,
+      mobileContent
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "nav",
+    {
+      "aria-label": label,
+      className: chunkSPDVNY2Z_cjs.cx(
+        topNavRecipe({ layout: hasCenterContent ? "grid" : "flex" }),
+        className
+      ),
+      "data-testid": dataTestId,
+      ref,
+      style,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.leftSection, children: [
+          heading != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.heading, children: heading }) : null,
+          resolvedStartContent != null ? /* @__PURE__ */ jsxRuntime.jsx(TopNavSlotContext, { value: "start", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.startContent, children: resolvedStartContent }) }) : null
+        ] }),
+        hasCenterContent ? /* @__PURE__ */ jsxRuntime.jsx(TopNavSlotContext, { value: "center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.centerContent, children: centerContent }) }) : null,
+        hasCenterContent ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.rightSection, children: /* @__PURE__ */ jsxRuntime.jsx(TopNavSlotContext, { value: "end", children: endContent }) }) : endContent != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.endContent, children: /* @__PURE__ */ jsxRuntime.jsx(TopNavSlotContext, { value: "end", children: endContent }) }) : null
+      ]
+    }
+  );
+}
+TopNav.displayName = "TopNav";
+var styles2 = {
+  root: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    gap: "2",
+    minH: "8",
+    px: "2",
+    color: "fg",
+    textDecoration: "none"
+  }),
+  logo: chunkAZDWQGAX_cjs.css({
+    flexShrink: 0,
+    display: "inline-flex",
+    alignItems: "center"
+  }),
+  text: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    flexDirection: "column",
+    minW: 0
+  }),
+  endContent: chunkAZDWQGAX_cjs.css({
+    ms: "auto",
+    flexShrink: 0
+  })
+};
+function TopNavHeading({
+  "aria-label": ariaLabel,
+  as,
+  className,
+  "data-testid": dataTestId,
+  headerEndContent,
+  heading,
+  headingHref,
+  href,
+  logo,
+  ref,
+  style,
+  subheading,
+  superheading
+}) {
+  const LinkComponent = chunkOA4KIVLO_cjs.useLinkComponent(as);
+  const resolvedHref = headingHref ?? href;
+  const Element = resolvedHref != null ? LinkComponent : "div";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Element,
+    {
+      "aria-label": ariaLabel,
+      className: chunkSPDVNY2Z_cjs.cx(styles2.root, className),
+      "data-testid": dataTestId,
+      href: resolvedHref,
+      ref,
+      style,
+      to: Element === "a" ? void 0 : resolvedHref,
+      children: [
+        logo != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.logo, children: logo }) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: styles2.text, children: [
+          superheading != null ? /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Text, { color: "secondary", type: "supporting", children: superheading }) : null,
+          heading != null ? /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Text, { type: "large", weight: "semibold", children: heading }) : null,
+          subheading != null ? /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Text, { color: "secondary", type: "supporting", children: subheading }) : null
+        ] }),
+        headerEndContent != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.endContent, children: headerEndContent }) : null
+      ]
+    }
+  );
+}
+TopNavHeading.displayName = "TopNavHeading";
+
+// src/components/TopNav/TopNavItem.recipe.ts
+var topNavItemRecipe = chunkJAX62FUE_cjs.cva({
+  base: {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: "2",
+    minH: "8",
+    px: "3",
+    py: "1.5",
+    borderRadius: "md",
+    color: "fg.muted",
+    textDecoration: "none",
+    fontFamily: "body",
+    fontSize: "md",
+    fontWeight: "medium",
+    cursor: "pointer",
+    _hover: { bg: "bg.hover" },
+    _focusVisible: {
+      outlineWidth: "focus",
+      outlineStyle: "solid",
+      outlineColor: "primary",
+      outlineOffset: "focusOffset"
+    }
+  },
+  variants: {
+    isSelected: {
+      true: {
+        bg: "bg.hover",
+        color: "fg",
+        fontWeight: "semibold"
+      },
+      false: {}
+    },
+    isDisabled: {
+      true: {
+        opacity: 0.5,
+        cursor: "not-allowed",
+        pointerEvents: "none"
+      },
+      false: {}
+    },
+    isIconOnly: {
+      true: {
+        px: "2",
+        aspectRatio: "square"
+      },
+      false: {}
+    },
+    isDrawer: {
+      true: {
+        display: "flex",
+        w: "100%"
+      },
+      false: {}
+    }
+  },
+  defaultVariants: {
+    isSelected: false,
+    isDisabled: false,
+    isIconOnly: false,
+    isDrawer: false
+  }
+});
+function TopNavItem({
+  as,
+  children,
+  className,
+  "data-testid": dataTestId,
+  href,
+  icon,
+  isDisabled = false,
+  isIconOnly = false,
+  isSelected = false,
+  label,
+  onClick,
+  ref,
+  rel,
+  style,
+  target
+}) {
+  const LinkComponent = chunkOA4KIVLO_cjs.useLinkComponent(as);
+  const renderMode = useTopNavRenderMode();
+  const { closeMobileNav } = chunkO5RVLBKN_cjs.useAppShellMobile();
+  const isDrawer = renderMode === "drawer";
+  const labelContent = children ?? /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Text, { color: "inherit", size: "md", type: "body", weight: "inherit", children: label });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    LinkComponent,
+    {
+      "aria-current": isSelected ? "page" : void 0,
+      "aria-disabled": isDisabled || void 0,
+      "aria-label": isIconOnly ? label : void 0,
+      className: chunkSPDVNY2Z_cjs.cx(
+        topNavItemRecipe({ isSelected, isDisabled, isIconOnly, isDrawer }),
+        className
+      ),
+      "data-testid": dataTestId,
+      href,
+      onClick: (event) => {
+        if (isDisabled) {
+          event.preventDefault();
+          return;
+        }
+        onClick?.(event);
+        if (isDrawer) {
+          closeMobileNav();
+        }
+      },
+      ref,
+      rel,
+      style,
+      tabIndex: isDisabled ? -1 : void 0,
+      target,
+      to: LinkComponent === "a" ? void 0 : href,
+      children: [
+        icon != null ? /* @__PURE__ */ jsxRuntime.jsx(chunkPHFEQG4E_cjs.Icon, { "aria-hidden": "true", color: "inherit", icon, size: "md" }) : null,
+        !isIconOnly ? labelContent : null
+      ]
+    }
+  );
+}
+TopNavItem.displayName = "TopNavItem";
+
+exports.TopNav = TopNav;
+exports.TopNavHeading = TopNavHeading;
+exports.TopNavItem = TopNavItem;
+exports.TopNavMobileContentContext = TopNavMobileContentContext;
+exports.TopNavRenderContext = TopNavRenderContext;
+exports.TopNavSlotContext = TopNavSlotContext;
+exports.topNavRecipe = topNavRecipe;
+//# sourceMappingURL=chunk-CR4NB42L.cjs.map
+//# sourceMappingURL=chunk-CR4NB42L.cjs.map

package/dist/chunk-CR4NB42L.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TopNav/TopNav.recipe.ts","../src/components/TopNav/TopNavContext.ts","../src/components/TopNav/TopNav.tsx","../src/components/TopNav/TopNavHeading.tsx","../src/components/TopNav/TopNavItem.recipe.ts","../src/components/TopNav/TopNavItem.tsx"],"names":["cva","createContext","use","css","useAppShellMobile","jsxs","cx","jsx","MobileNavToggle","MobileNav","Divider","styles","useLinkComponent","Text","Icon"],"mappings":"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","file":"chunk-CR4NB42L.cjs","sourcesContent":["import {cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const topNavRecipe = cva({\n  base: {\n    alignItems: 'center',\n    w: '100%',\n    p: '2',\n    boxSizing: 'border-box',\n  },\n  variants: {\n    layout: {\n      flex: {\n        display: 'flex',\n      },\n      grid: {\n        display: 'grid',\n        gridTemplateColumns: '1fr auto 1fr',\n      },\n      mobile: {\n        display: 'flex',\n      },\n    },\n  },\n  defaultVariants: {\n    layout: 'flex',\n  },\n});\n\nexport type TopNavVariants = RecipeVariantProps<typeof topNavRecipe>;\n","import {createContext, use, type ReactNode} from 'react';\n\nexport type TopNavRenderMode = 'default' | 'mobile-bar' | 'drawer';\nexport type TopNavSlot = 'start' | 'center' | 'end';\n\nexport const TopNavRenderContext = createContext<TopNavRenderMode>('default');\nTopNavRenderContext.displayName = 'TopNavRenderContext';\nexport const TopNavMobileContentContext = createContext<ReactNode>(null);\nTopNavMobileContentContext.displayName = 'TopNavMobileContentContext';\nexport const TopNavSlotContext = createContext<TopNavSlot>('start');\nTopNavSlotContext.displayName = 'TopNavSlotContext';\n\nexport function useTopNavRenderMode(): TopNavRenderMode {\n  return use(TopNavRenderContext);\n}\n\nexport function useTopNavMobileContent(): ReactNode {\n  return use(TopNavMobileContentContext);\n}\n","import type {CSSProperties, ReactNode, Ref} from 'react';\nimport {css} from 'styled-system/css';\nimport {MobileNav, MobileNavToggle} from '../../internal/MobileNav';\nimport {cx} from '../../internal/cx';\nimport {useAppShellMobile} from '../AppShell/AppShellMobileContext';\nimport {Divider} from '../Divider';\nimport {topNavRecipe} from './TopNav.recipe';\nimport {\n  TopNavSlotContext,\n  useTopNavMobileContent,\n  useTopNavRenderMode,\n} from './TopNavContext';\n\nexport interface TopNavProps {\n  /**\n   * Content rendered in the center section of the navigation bar.\n   */\n  centerContent?: ReactNode;\n  /**\n   * Shorthand for `startContent`. Rendered in the start section when\n   * `startContent` is not provided.\n   */\n  children?: ReactNode;\n  /**\n   * Additional CSS class names applied to the nav element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the nav element.\n   */\n  'data-testid'?: string;\n  /**\n   * Content rendered in the end (right) section of the navigation bar.\n   */\n  endContent?: ReactNode;\n  /**\n   * Branding or title content rendered at the start of the bar.\n   */\n  heading?: ReactNode;\n  /**\n   * Accessible label for the navigation landmark.\n   * @default 'Top navigation'\n   */\n  label?: string;\n  /**\n   * Ref forwarded to the nav element.\n   */\n  ref?: Ref<HTMLElement>;\n  /**\n   * Content rendered in the start (left) section after the heading.\n   */\n  startContent?: ReactNode;\n  /**\n   * Inline styles applied to the nav element.\n   */\n  style?: CSSProperties;\n}\n\nconst styles = {\n  leftSection: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: '4',\n    flex: '1 1 0%',\n    minW: 0,\n  }),\n  heading: css({\n    display: 'flex',\n    alignItems: 'center',\n    flexShrink: 0,\n  }),\n  startContent: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: '1',\n  }),\n  centerContent: css({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    gap: '1',\n  }),\n  rightSection: css({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    gap: '1',\n  }),\n  endContent: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: '1',\n    flexShrink: 0,\n    ms: 'auto',\n  }),\n  mobileEnd: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: '1',\n    ms: 'auto',\n  }),\n  drawerItems: css({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '0.5',\n  }),\n  drawerDivider: css({\n    my: '2',\n  }),\n};\n\n/**\n * Horizontal top navigation bar with heading, start, center, and end\n * content slots. Adapts to mobile layouts when rendered inside AppShell.\n */\nexport function TopNav({\n  centerContent,\n  children,\n  className,\n  'data-testid': dataTestId,\n  endContent,\n  heading,\n  label = 'Top navigation',\n  ref,\n  startContent,\n  style,\n}: TopNavProps): React.JSX.Element | null {\n  const renderMode = useTopNavRenderMode();\n  const mobileContent = useTopNavMobileContent();\n  const {hasAutoToggle} = useAppShellMobile();\n  const resolvedStartContent = startContent ?? children;\n  const hasCenterContent = centerContent != null;\n  const hasCollapsibleContent =\n    resolvedStartContent != null || centerContent != null;\n  const hasMobileDrawerContent = hasCollapsibleContent || mobileContent != null;\n\n  if (renderMode === 'mobile-bar') {\n    return (\n      <nav\n        aria-label={label}\n        className={cx(topNavRecipe({layout: 'mobile'}), className)}\n        data-testid={dataTestId}\n        ref={ref}\n        style={style}>\n        {heading != null ? (\n          <div className={styles.heading}>{heading}</div>\n        ) : null}\n        <div className={styles.mobileEnd}>\n          {endContent}\n          {hasMobileDrawerContent && hasAutoToggle ? <MobileNavToggle /> : null}\n        </div>\n      </nav>\n    );\n  }\n\n  if (renderMode === 'drawer') {\n    if (!hasCollapsibleContent && mobileContent == null) {\n      return null;\n    }\n\n    return (\n      <MobileNav header={heading}>\n        {hasCollapsibleContent ? (\n          <TopNavSlotContext value=\"start\">\n            <div className={styles.drawerItems}>\n              {resolvedStartContent}\n              {centerContent}\n            </div>\n          </TopNavSlotContext>\n        ) : null}\n        {hasCollapsibleContent && mobileContent != null ? (\n          <div className={styles.drawerDivider}>\n            <Divider />\n          </div>\n        ) : null}\n        {mobileContent}\n      </MobileNav>\n    );\n  }\n\n  return (\n    <nav\n      aria-label={label}\n      className={cx(\n        topNavRecipe({layout: hasCenterContent ? 'grid' : 'flex'}),\n        className,\n      )}\n      data-testid={dataTestId}\n      ref={ref}\n      style={style}>\n      <div className={styles.leftSection}>\n        {heading != null ? (\n          <div className={styles.heading}>{heading}</div>\n        ) : null}\n        {resolvedStartContent != null ? (\n          <TopNavSlotContext value=\"start\">\n            <div className={styles.startContent}>{resolvedStartContent}</div>\n          </TopNavSlotContext>\n        ) : null}\n      </div>\n      {hasCenterContent ? (\n        <TopNavSlotContext value=\"center\">\n          <div className={styles.centerContent}>{centerContent}</div>\n        </TopNavSlotContext>\n      ) : null}\n      {hasCenterContent ? (\n        <div className={styles.rightSection}>\n          <TopNavSlotContext value=\"end\">{endContent}</TopNavSlotContext>\n        </div>\n      ) : endContent != null ? (\n        <div className={styles.endContent}>\n          <TopNavSlotContext value=\"end\">{endContent}</TopNavSlotContext>\n        </div>\n      ) : null}\n    </nav>\n  );\n}\n\nTopNav.displayName = 'TopNav';\n","/* eslint-disable @eslint-react/static-components -- intentional polymorphism via as prop */\n\nimport type {CSSProperties, ReactNode, Ref} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport type {LinkComponent} from '../Link';\nimport {useLinkComponent} from '../Link';\nimport {Text} from '../Text';\n\nexport interface TopNavHeadingProps {\n  /**\n   * Accessible label for the heading link. Use when `heading` text is absent\n   * (e.g., logo-only headings) to ensure the link has an accessible name.\n   */\n  'aria-label'?: string;\n  as?: LinkComponent;\n  className?: string;\n  'data-testid'?: string;\n  headerEndContent?: ReactNode;\n  heading?: string;\n  headingHref?: string;\n  href?: string;\n  logo?: ReactNode;\n  ref?: Ref<HTMLElement>;\n  style?: CSSProperties;\n  subheading?: string;\n  superheading?: string;\n}\n\nconst styles = {\n  root: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: '2',\n    minH: '8',\n    px: '2',\n    color: 'fg',\n    textDecoration: 'none',\n  }),\n  logo: css({\n    flexShrink: 0,\n    display: 'inline-flex',\n    alignItems: 'center',\n  }),\n  text: css({\n    display: 'flex',\n    flexDirection: 'column',\n    minW: 0,\n  }),\n  endContent: css({\n    ms: 'auto',\n    flexShrink: 0,\n  }),\n};\n\nexport function TopNavHeading({\n  'aria-label': ariaLabel,\n  as,\n  className,\n  'data-testid': dataTestId,\n  headerEndContent,\n  heading,\n  headingHref,\n  href,\n  logo,\n  ref,\n  style,\n  subheading,\n  superheading,\n}: TopNavHeadingProps): React.JSX.Element {\n  const LinkComponent = useLinkComponent(as);\n  const resolvedHref = headingHref ?? href;\n  const Element = resolvedHref != null ? LinkComponent : 'div';\n\n  return (\n    <Element\n      aria-label={ariaLabel}\n      className={cx(styles.root, className)}\n      data-testid={dataTestId}\n      href={resolvedHref}\n      ref={ref as Ref<HTMLAnchorElement & HTMLDivElement>}\n      style={style}\n      to={Element === 'a' ? undefined : resolvedHref}>\n      {logo != null ? <span className={styles.logo}>{logo}</span> : null}\n      <span className={styles.text}>\n        {superheading != null ? (\n          <Text color=\"secondary\" type=\"supporting\">\n            {superheading}\n          </Text>\n        ) : null}\n        {heading != null ? (\n          <Text type=\"large\" weight=\"semibold\">\n            {heading}\n          </Text>\n        ) : null}\n        {subheading != null ? (\n          <Text color=\"secondary\" type=\"supporting\">\n            {subheading}\n          </Text>\n        ) : null}\n      </span>\n      {headerEndContent != null ? (\n        <span className={styles.endContent}>{headerEndContent}</span>\n      ) : null}\n    </Element>\n  );\n}\n\nTopNavHeading.displayName = 'TopNavHeading';\n","import {cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const topNavItemRecipe = cva({\n  base: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '2',\n    minH: '8',\n    px: '3',\n    py: '1.5',\n    borderRadius: 'md',\n    color: 'fg.muted',\n    textDecoration: 'none',\n    fontFamily: 'body',\n    fontSize: 'md',\n    fontWeight: 'medium',\n    cursor: 'pointer',\n    _hover: {bg: 'bg.hover'},\n    _focusVisible: {\n      outlineWidth: 'focus',\n      outlineStyle: 'solid',\n      outlineColor: 'primary',\n      outlineOffset: 'focusOffset',\n    },\n  },\n  variants: {\n    isSelected: {\n      true: {\n        bg: 'bg.hover',\n        color: 'fg',\n        fontWeight: 'semibold',\n      },\n      false: {},\n    },\n    isDisabled: {\n      true: {\n        opacity: 0.5,\n        cursor: 'not-allowed',\n        pointerEvents: 'none',\n      },\n      false: {},\n    },\n    isIconOnly: {\n      true: {\n        px: '2',\n        aspectRatio: 'square',\n      },\n      false: {},\n    },\n    isDrawer: {\n      true: {\n        display: 'flex',\n        w: '100%',\n      },\n      false: {},\n    },\n  },\n  defaultVariants: {\n    isSelected: false,\n    isDisabled: false,\n    isIconOnly: false,\n    isDrawer: false,\n  },\n});\n\nexport type TopNavItemVariants = RecipeVariantProps<typeof topNavItemRecipe>;\n","/* eslint-disable @eslint-react/static-components -- intentional polymorphism via as prop */\n\nimport type {CSSProperties, MouseEventHandler, ReactNode, Ref} from 'react';\nimport {cx} from '../../internal/cx';\nimport {useAppShellMobile} from '../AppShell/AppShellMobileContext';\nimport {Icon, type IconComponent} from '../Icon';\nimport type {LinkComponent} from '../Link';\nimport {useLinkComponent} from '../Link';\nimport {Text} from '../Text';\nimport {useTopNavRenderMode} from './TopNavContext';\nimport {topNavItemRecipe} from './TopNavItem.recipe';\n\nexport interface TopNavItemProps {\n  /**\n   * Custom link component used for routing.\n   */\n  as?: LinkComponent;\n  /**\n   * Custom label content. Falls back to the `label` prop text.\n   */\n  children?: ReactNode;\n  /**\n   * Additional CSS class names applied to the item.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the item.\n   */\n  'data-testid'?: string;\n  /**\n   * Link destination.\n   */\n  href: string;\n  /**\n   * Icon rendered before the label.\n   */\n  icon?: IconComponent;\n  /**\n   * Whether the item is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether only the icon is visible (label used for accessibility).\n   * @default false\n   */\n  isIconOnly?: boolean;\n  /**\n   * Whether the item is currently selected.\n   * @default false\n   */\n  isSelected?: boolean;\n  /**\n   * Accessible item label, also used as visible text when children are omitted.\n   */\n  label: string;\n  /**\n   * Click handler called when the item is clicked.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n  /**\n   * Ref forwarded to the anchor element.\n   */\n  ref?: Ref<HTMLAnchorElement>;\n  /**\n   * The `rel` attribute for the anchor element.\n   */\n  rel?: string;\n  /**\n   * Inline styles applied to the item.\n   */\n  style?: CSSProperties;\n  /**\n   * The `target` attribute for the anchor element.\n   */\n  target?: string;\n}\n\n/**\n * A single navigation link inside a TopNav. Supports icons, selected\n * state, and adapts to drawer layout on mobile.\n */\nexport function TopNavItem({\n  as,\n  children,\n  className,\n  'data-testid': dataTestId,\n  href,\n  icon,\n  isDisabled = false,\n  isIconOnly = false,\n  isSelected = false,\n  label,\n  onClick,\n  ref,\n  rel,\n  style,\n  target,\n}: TopNavItemProps): React.JSX.Element {\n  const LinkComponent = useLinkComponent(as);\n  const renderMode = useTopNavRenderMode();\n  const {closeMobileNav} = useAppShellMobile();\n  const isDrawer = renderMode === 'drawer';\n  const labelContent = children ?? (\n    <Text color=\"inherit\" size=\"md\" type=\"body\" weight=\"inherit\">\n      {label}\n    </Text>\n  );\n\n  return (\n    <LinkComponent\n      aria-current={isSelected ? 'page' : undefined}\n      aria-disabled={isDisabled || undefined}\n      aria-label={isIconOnly ? label : undefined}\n      className={cx(\n        topNavItemRecipe({isSelected, isDisabled, isIconOnly, isDrawer}),\n        className,\n      )}\n      data-testid={dataTestId}\n      href={href}\n      onClick={event => {\n        if (isDisabled) {\n          event.preventDefault();\n          return;\n        }\n\n        onClick?.(event);\n\n        if (isDrawer) {\n          closeMobileNav();\n        }\n      }}\n      ref={ref}\n      rel={rel}\n      style={style}\n      tabIndex={isDisabled ? -1 : undefined}\n      target={target}\n      to={LinkComponent === 'a' ? undefined : href}>\n      {icon != null ? (\n        <Icon aria-hidden=\"true\" color=\"inherit\" icon={icon} size=\"md\" />\n      ) : null}\n      {!isIconOnly ? labelContent : null}\n    </LinkComponent>\n  );\n}\n\nTopNavItem.displayName = 'TopNavItem';\n"]}

package/dist/chunk-CVH6X6ND.js

@@ -0,0 +1,125 @@
+import { cva } from './chunk-NAELQLZN.js';
+import { cx } from './chunk-PPNETWIP.js';
+import { css } from './chunk-UHQRL4OA.js';
+import { useId } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+// src/components/Divider/Divider.recipe.ts
+var dividerRecipe = cva({
+  base: {
+    color: "fg.muted"
+  },
+  variants: {
+    orientation: {
+      horizontal: {
+        display: "flex",
+        alignItems: "center",
+        w: "100%"
+      },
+      vertical: {
+        display: "inline-flex",
+        flexDirection: "column",
+        alignItems: "center",
+        h: "100%"
+      }
+    },
+    variant: {
+      subtle: {},
+      strong: {}
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    variant: "subtle"
+  }
+});
+var styles = {
+  line: css({
+    bg: "border"
+  }),
+  lineStrong: css({
+    bg: "border.emphasized"
+  }),
+  horizontalLine: css({
+    h: "1px",
+    flex: 1
+  }),
+  verticalLine: css({
+    w: "1px",
+    flex: 1
+  }),
+  label: css({
+    flexShrink: 0,
+    px: "3",
+    fontFamily: "body",
+    fontSize: "sm",
+    color: "fg.muted"
+  }),
+  verticalLabel: css({
+    px: 0,
+    py: "3"
+  }),
+  fullBleedHorizontal: css({
+    mx: "calc(-1 * var(--card-padding, 0px))",
+    w: "calc(100% + var(--card-padding, 0px) * 2)"
+  }),
+  fullBleedVertical: css({
+    my: "calc(-1 * var(--card-padding, 0px))",
+    h: "calc(100% + var(--card-padding, 0px) * 2)"
+  })
+};
+function Divider({
+  "aria-label": ariaLabel,
+  className,
+  "data-testid": dataTestId,
+  isFullBleed = false,
+  label,
+  orientation = "horizontal",
+  ref,
+  style,
+  variant = "subtle"
+}) {
+  const isHorizontal = orientation === "horizontal";
+  const labelId = useId();
+  const lineClassName = cx(
+    styles.line,
+    variant === "strong" && styles.lineStrong,
+    isHorizontal ? styles.horizontalLine : styles.verticalLine
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-label": ariaLabel,
+      "aria-labelledby": label != null && ariaLabel == null ? labelId : void 0,
+      "aria-orientation": orientation,
+      className: cx(
+        dividerRecipe({ orientation, variant }),
+        isFullBleed && (isHorizontal ? styles.fullBleedHorizontal : styles.fullBleedVertical),
+        className
+      ),
+      "data-testid": dataTestId,
+      ref,
+      role: "separator",
+      style,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: lineClassName }),
+        label != null ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cx(styles.label, !isHorizontal && styles.verticalLabel),
+              id: labelId,
+              children: label
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: lineClassName })
+        ] }) : null
+      ]
+    }
+  );
+}
+Divider.displayName = "Divider";
+
+export { Divider, dividerRecipe };
+//# sourceMappingURL=chunk-CVH6X6ND.js.map
+//# sourceMappingURL=chunk-CVH6X6ND.js.map

package/dist/chunk-CVH6X6ND.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Divider/Divider.recipe.ts","../src/components/Divider/Divider.tsx"],"names":[],"mappings":"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","file":"chunk-CVH6X6ND.js","sourcesContent":["import {cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const dividerRecipe = cva({\n  base: {\n    color: 'fg.muted',\n  },\n  variants: {\n    orientation: {\n      horizontal: {\n        display: 'flex',\n        alignItems: 'center',\n        w: '100%',\n      },\n      vertical: {\n        display: 'inline-flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        h: '100%',\n      },\n    },\n    variant: {\n      subtle: {},\n      strong: {},\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n    variant: 'subtle',\n  },\n});\n\nexport type DividerVariants = RecipeVariantProps<typeof dividerRecipe>;\n","import {useId, type CSSProperties, type ReactNode, type Ref} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport {dividerRecipe} from './Divider.recipe';\n\nexport type DividerOrientation = 'horizontal' | 'vertical';\nexport type DividerVariant = 'subtle' | 'strong';\n\n/**\n * Visual separator for grouping content.\n */\nexport interface DividerProps {\n  /**\n   * Accessible label for the separator. Use when the divider conveys\n   * meaning beyond a visual break (e.g., separating named sections).\n   */\n  'aria-label'?: string;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Whether the divider should escape container padding.\n   */\n  isFullBleed?: boolean;\n  /**\n   * Optional label rendered in the divider.\n   */\n  label?: ReactNode;\n  /**\n   * Divider orientation. Default is `horizontal`.\n   */\n  orientation?: DividerOrientation;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Visual weight of the divider. Default is `subtle`.\n   */\n  variant?: DividerVariant;\n}\n\nconst styles = {\n  line: css({\n    bg: 'border',\n  }),\n  lineStrong: css({\n    bg: 'border.emphasized',\n  }),\n  horizontalLine: css({\n    h: '1px',\n    flex: 1,\n  }),\n  verticalLine: css({\n    w: '1px',\n    flex: 1,\n  }),\n  label: css({\n    flexShrink: 0,\n    px: '3',\n    fontFamily: 'body',\n    fontSize: 'sm',\n    color: 'fg.muted',\n  }),\n  verticalLabel: css({\n    px: 0,\n    py: '3',\n  }),\n  fullBleedHorizontal: css({\n    mx: 'calc(-1 * var(--card-padding, 0px))',\n    w: 'calc(100% + var(--card-padding, 0px) * 2)',\n  }),\n  fullBleedVertical: css({\n    my: 'calc(-1 * var(--card-padding, 0px))',\n    h: 'calc(100% + var(--card-padding, 0px) * 2)',\n  }),\n};\n\nexport function Divider({\n  'aria-label': ariaLabel,\n  className,\n  'data-testid': dataTestId,\n  isFullBleed = false,\n  label,\n  orientation = 'horizontal',\n  ref,\n  style,\n  variant = 'subtle',\n}: DividerProps): React.JSX.Element {\n  const isHorizontal = orientation === 'horizontal';\n  const labelId = useId();\n  const lineClassName = cx(\n    styles.line,\n    variant === 'strong' && styles.lineStrong,\n    isHorizontal ? styles.horizontalLine : styles.verticalLine,\n  );\n\n  return (\n    <div\n      aria-label={ariaLabel}\n      aria-labelledby={label != null && ariaLabel == null ? labelId : undefined}\n      aria-orientation={orientation}\n      className={cx(\n        dividerRecipe({orientation, variant}),\n        isFullBleed &&\n          (isHorizontal\n            ? styles.fullBleedHorizontal\n            : styles.fullBleedVertical),\n        className,\n      )}\n      data-testid={dataTestId}\n      ref={ref}\n      role=\"separator\"\n      style={style}>\n      <div className={lineClassName} />\n      {label != null ? (\n        <>\n          <div\n            className={cx(styles.label, !isHorizontal && styles.verticalLabel)}\n            id={labelId}>\n            {label}\n          </div>\n          <div className={lineClassName} />\n        </>\n      ) : null}\n    </div>\n  );\n}\n\nDivider.displayName = 'Divider';\n"]}