silver-ui 0.1.0

package/dist/chunk-YX7DI3O3.cjs

@@ -0,0 +1,358 @@
+'use strict';
+
+var chunkCR4NB42L_cjs = require('./chunk-CR4NB42L.cjs');
+var chunkQRXMW7MQ_cjs = require('./chunk-QRXMW7MQ.cjs');
+var chunkO5RVLBKN_cjs = require('./chunk-O5RVLBKN.cjs');
+var chunkUZNSGQT3_cjs = require('./chunk-UZNSGQT3.cjs');
+var chunk6SHL7FYO_cjs = require('./chunk-6SHL7FYO.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/internal/sharedResizeObserver.ts
+var observer = null;
+var callbacks = /* @__PURE__ */ new Map();
+function getObserver() {
+  observer ?? (observer = new ResizeObserver((entries) => {
+    for (const entry of entries) {
+      callbacks.get(entry.target)?.(entry);
+    }
+  }));
+  return observer;
+}
+function observeResize(element, callback) {
+  callbacks.set(element, callback);
+  getObserver().observe(element);
+}
+function unobserveResize(element) {
+  callbacks.delete(element);
+  if (observer == null) {
+    return;
+  }
+  observer.unobserve(element);
+  if (callbacks.size === 0) {
+    observer.disconnect();
+    observer = null;
+  }
+}
+function getServerSnapshot() {
+  return false;
+}
+function useMediaQuery(query) {
+  const subscribe = react.useCallback(
+    (onStoreChange) => {
+      const mediaQueryList = window.matchMedia(query);
+      mediaQueryList.addEventListener("change", onStoreChange);
+      return () => mediaQueryList.removeEventListener("change", onStoreChange);
+    },
+    [query]
+  );
+  const getSnapshot = react.useCallback(() => {
+    return window.matchMedia(query).matches;
+  }, [query]);
+  return react.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
+
+// src/components/AppShell/AppShell.recipe.ts
+var appShellRecipe = chunkJAX62FUE_cjs.cva({
+  base: {
+    display: "flex",
+    flexDirection: "column",
+    position: "relative"
+  },
+  variants: {
+    height: {
+      fill: {
+        h: "100dvh"
+      },
+      auto: {
+        minH: "100dvh"
+      }
+    },
+    variant: {
+      default: {
+        bg: "bg.subtle"
+      },
+      section: {
+        bg: "bg"
+      }
+    }
+  },
+  defaultVariants: {
+    height: "fill",
+    variant: "default"
+  }
+});
+function hasChildContent(element) {
+  for (const node of element.childNodes) {
+    if (node.nodeType === Node.ELEMENT_NODE) {
+      return true;
+    }
+    if (node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== "") {
+      return true;
+    }
+  }
+  return false;
+}
+function useSlotPresence(initialValue = false) {
+  const [hasContent, setHasContent] = react.useState(initialValue);
+  const observerRef = react.useRef(null);
+  const ref = react.useCallback((node) => {
+    observerRef.current?.disconnect();
+    observerRef.current = null;
+    if (node == null) {
+      setHasContent(false);
+      return;
+    }
+    setHasContent(hasChildContent(node));
+    const observer2 = new MutationObserver(() => {
+      setHasContent(hasChildContent(node));
+    });
+    observer2.observe(node, { childList: true });
+    observerRef.current = observer2;
+  }, []);
+  react.useEffect(() => {
+    return () => observerRef.current?.disconnect();
+  }, []);
+  return { hasContent, ref };
+}
+var BREAKPOINT_VALUES = {
+  sm: 640,
+  md: 768,
+  lg: 1024,
+  none: 0
+};
+var styles = {
+  skipLink: chunkAZDWQGAX_cjs.css({
+    position: "absolute",
+    top: 0,
+    insetInlineStart: 0,
+    w: "1px",
+    h: "1px",
+    p: 0,
+    m: "-1px",
+    overflow: "hidden",
+    clipPath: "inset(50%)",
+    whiteSpace: "nowrap",
+    borderWidth: 0,
+    zIndex: 9999,
+    bg: "bg",
+    color: "primary",
+    textDecoration: "none",
+    fontWeight: "semibold",
+    _focus: {
+      position: "fixed",
+      top: "2",
+      insetInlineStart: "2",
+      w: "auto",
+      h: "auto",
+      p: "2",
+      m: 0,
+      overflow: "visible",
+      clipPath: "none",
+      whiteSpace: "normal",
+      outlineWidth: "focus",
+      outlineStyle: "solid",
+      outlineColor: "primary",
+      outlineOffset: "focusOffset"
+    }
+  }),
+  headerSticky: chunkAZDWQGAX_cjs.css({
+    position: "sticky",
+    top: 0,
+    zIndex: 1
+  }),
+  banner: chunkAZDWQGAX_cjs.css({
+    flexShrink: 0
+  }),
+  autoMobileTopBar: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    h: "12",
+    px: "2"
+  }),
+  sideNavSticky: chunkAZDWQGAX_cjs.css({
+    flexShrink: 0,
+    overflow: "clip",
+    position: "sticky",
+    top: "var(--appshell-header-height, 0px)",
+    h: "calc(100dvh - var(--appshell-header-height, 0px))",
+    display: "flex",
+    flexDirection: "column"
+  }),
+  elevatedWrapper: chunkAZDWQGAX_cjs.css({
+    position: "relative",
+    display: "flex",
+    flex: 1,
+    minH: 0,
+    h: "100%"
+  }),
+  elevatedBackdrop: chunkAZDWQGAX_cjs.css({
+    position: "absolute",
+    inset: 0,
+    bg: "bg",
+    borderStartStartRadius: "2xl",
+    pointerEvents: "none"
+  }),
+  contentSurface: chunkAZDWQGAX_cjs.css({
+    bg: "bg"
+  }),
+  contentTransparent: chunkAZDWQGAX_cjs.css({
+    bg: "transparent",
+    isolation: "isolate"
+  }),
+  slotContents: chunkAZDWQGAX_cjs.css({
+    display: "contents"
+  })
+};
+function AppShell({
+  banner,
+  children,
+  className,
+  contentPadding,
+  "data-testid": dataTestId,
+  height = "fill",
+  isMobileNavDisabled = false,
+  mobileBreakpoint = "md",
+  ref,
+  sideNav,
+  style,
+  topNav,
+  variant = "default"
+}) {
+  const mainContentId = react.useId();
+  const breakpointQuery = mobileBreakpoint === "none" ? "(max-width: 0px)" : `(max-width: ${BREAKPOINT_VALUES[mobileBreakpoint]}px)`;
+  const isBelowBreakpoint = useMediaQuery(breakpointQuery);
+  const [isMobileNavOpen, setIsMobileNavOpen] = react.useState(false);
+  const setMobileNavOpen = react.useCallback((isOpen) => {
+    setIsMobileNavOpen(isOpen);
+  }, []);
+  const { ref: topNavPresenceRef, hasContent: hasTopNavContent } = useSlotPresence(topNav != null);
+  const { ref: sideNavPresenceRef, hasContent: hasSideNavContent } = useSlotPresence(sideNav != null);
+  const hasTopNav = topNav != null;
+  const hasSideNav = sideNav != null;
+  const hasNavContent = hasTopNavContent || hasSideNavContent;
+  const mobileNavEnabled = !isMobileNavDisabled && hasNavContent;
+  const showSideNavInline = hasSideNav && !isBelowBreakpoint;
+  const isAuto = height === "auto";
+  const isFill = height === "fill";
+  const navHasDividers = variant === "section";
+  const headerRef = react.useRef(null);
+  const shellRef = react.useRef(null);
+  react.useEffect(() => {
+    if (!isAuto || headerRef.current == null || shellRef.current == null) {
+      return;
+    }
+    const headerElement = headerRef.current;
+    const shellElement = shellRef.current;
+    const updateHeight = () => {
+      shellElement.style.setProperty(
+        "--appshell-header-height",
+        `${headerElement.getBoundingClientRect().height}px`
+      );
+    };
+    observeResize(headerElement, updateHeight);
+    return () => unobserveResize(headerElement);
+  }, [isAuto]);
+  const mobileContextValue = react.useMemo(
+    () => ({
+      closeMobileNav: () => setMobileNavOpen(false),
+      hasAutoToggle: true,
+      isMobile: isBelowBreakpoint,
+      isMobileNavEnabled: mobileNavEnabled,
+      isMobileNavOpen,
+      openMobileNav: () => mobileNavEnabled && setMobileNavOpen(true),
+      toggleMobileNav: () => {
+        if (mobileNavEnabled) {
+          setIsMobileNavOpen((prev) => !prev);
+        }
+      }
+    }),
+    [isBelowBreakpoint, isMobileNavOpen, mobileNavEnabled, setMobileNavOpen]
+  );
+  const mobileContentValue = hasSideNavContent ? /* @__PURE__ */ jsxRuntime.jsx(chunkQRXMW7MQ_cjs.SideNavRenderContext, { value: "drawer-content", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.slotContents, ref: sideNavPresenceRef, children: sideNav }) }) : null;
+  const drawerMobileContentValue = hasSideNavContent ? /* @__PURE__ */ jsxRuntime.jsx(chunkQRXMW7MQ_cjs.SideNavRenderContext, { value: "drawer-content", children: sideNav }) : null;
+  const topNavContent = hasTopNav && isBelowBreakpoint && !isMobileNavDisabled ? /* @__PURE__ */ jsxRuntime.jsx(chunkCR4NB42L_cjs.TopNavMobileContentContext, { value: mobileContentValue, children: /* @__PURE__ */ jsxRuntime.jsx(chunkCR4NB42L_cjs.TopNavRenderContext, { value: "mobile-bar", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.slotContents, ref: topNavPresenceRef, children: topNav }) }) }) : topNav;
+  const headerContent = hasTopNav || banner != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkSPDVNY2Z_cjs.cx(isAuto && styles.headerSticky), ref: headerRef, children: /* @__PURE__ */ jsxRuntime.jsxs("header", { style: { flexShrink: 0 }, children: [
+    banner != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.banner, children: banner }) : null,
+    hasTopNav ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.slotContents, ref: topNavPresenceRef, children: topNavContent }) : null
+  ] }) }) : void 0;
+  const autoMobileTopBar = !isMobileNavDisabled && isBelowBreakpoint && !hasTopNavContent && hasSideNav ? /* @__PURE__ */ jsxRuntime.jsx("header", { style: { flexShrink: 0 }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "aria-label": "Mobile navigation",
+      className: styles.autoMobileTopBar,
+      role: "navigation",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(chunkQRXMW7MQ_cjs.SideNavRenderContext, { value: "topbar", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.slotContents, ref: sideNavPresenceRef, children: sideNav }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(chunkO5RVLBKN_cjs.MobileNavToggle, {})
+      ]
+    }
+  ) }) : void 0;
+  const sideNavPanel = showSideNavInline ? /* @__PURE__ */ jsxRuntime.jsx(chunkUZNSGQT3_cjs.LayoutPanel, { isScrollable: isFill, padding: 0, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.slotContents, ref: sideNavPresenceRef, children: sideNav }) }) : void 0;
+  const sideNavContent = sideNavPanel != null && isAuto ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.sideNavSticky, children: sideNavPanel }) : sideNavPanel;
+  const contentClassName = variant === "default" && hasTopNavContent && showSideNavInline ? styles.contentTransparent : variant === "default" ? styles.contentSurface : void 0;
+  const mainInner = /* @__PURE__ */ jsxRuntime.jsx(
+    chunkUZNSGQT3_cjs.LayoutContent,
+    {
+      as: "main",
+      className: contentClassName,
+      id: mainContentId,
+      isScrollable: isFill,
+      padding: contentPadding ?? 0,
+      children
+    }
+  );
+  const shouldElevateWithCorner = variant === "default" && hasTopNavContent && showSideNavInline;
+  const mainContent = shouldElevateWithCorner ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.elevatedWrapper, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.elevatedBackdrop }),
+    mainInner
+  ] }) : mainInner;
+  const rootStyle = { ...style };
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkO5RVLBKN_cjs.AppShellMobileContext, { value: mobileContextValue, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: chunkSPDVNY2Z_cjs.cx(appShellRecipe({ height, variant }), className),
+      "data-testid": dataTestId,
+      ref: chunk6SHL7FYO_cjs.mergeRefs(ref, shellRef),
+      style: rootStyle,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            className: styles.skipLink,
+            "data-testid": "skip-to-content",
+            href: `#${mainContentId}`,
+            children: "Skip to content"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          chunkUZNSGQT3_cjs.Layout,
+          {
+            content: mainContent,
+            hasDividers: navHasDividers,
+            header: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              headerContent,
+              autoMobileTopBar
+            ] }),
+            height,
+            padding: 0,
+            start: sideNavContent
+          }
+        ),
+        isBelowBreakpoint && !isMobileNavDisabled ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          hasSideNav && !hasTopNavContent ? /* @__PURE__ */ jsxRuntime.jsx(chunkQRXMW7MQ_cjs.SideNavRenderContext, { value: "drawer", children: sideNav }) : null,
+          hasTopNav && hasTopNavContent ? /* @__PURE__ */ jsxRuntime.jsx(chunkCR4NB42L_cjs.TopNavMobileContentContext, { value: drawerMobileContentValue, children: /* @__PURE__ */ jsxRuntime.jsx(chunkCR4NB42L_cjs.TopNavRenderContext, { value: "drawer", children: topNav }) }) : null
+        ] }) : null
+      ]
+    }
+  ) });
+}
+AppShell.displayName = "AppShell";
+
+exports.AppShell = AppShell;
+exports.appShellRecipe = appShellRecipe;
+//# sourceMappingURL=chunk-YX7DI3O3.cjs.map
+//# sourceMappingURL=chunk-YX7DI3O3.cjs.map

package/dist/chunk-YX7DI3O3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/internal/sharedResizeObserver.ts","../src/internal/useMediaQuery.ts","../src/components/AppShell/AppShell.recipe.ts","../src/components/AppShell/useSlotPresence.tsx","../src/components/AppShell/AppShell.tsx"],"names":["useCallback","useSyncExternalStore","cva","useState","useRef","observer","useEffect","css","useId","useMemo","jsx","SideNavRenderContext","TopNavMobileContentContext","TopNavRenderContext","cx","jsxs","MobileNavToggle","LayoutPanel","LayoutContent","AppShellMobileContext","mergeRefs","Layout","Fragment"],"mappings":"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","file":"chunk-YX7DI3O3.cjs","sourcesContent":["type ResizeCallback = (entry: ResizeObserverEntry) => void;\n\nlet observer: ResizeObserver | null = null;\nconst callbacks = new Map<Element, ResizeCallback>();\n\nfunction getObserver(): ResizeObserver {\n  observer ??= new ResizeObserver(entries => {\n    for (const entry of entries) {\n      callbacks.get(entry.target)?.(entry);\n    }\n  });\n\n  return observer;\n}\n\nexport function observeResize(\n  element: Element,\n  callback: ResizeCallback,\n): void {\n  callbacks.set(element, callback);\n  getObserver().observe(element);\n}\n\nexport function unobserveResize(element: Element): void {\n  callbacks.delete(element);\n\n  if (observer == null) {\n    return;\n  }\n\n  observer.unobserve(element);\n\n  if (callbacks.size === 0) {\n    observer.disconnect();\n    observer = null;\n  }\n}\n","import {useCallback, useSyncExternalStore} from 'react';\n\nfunction getServerSnapshot(): boolean {\n  return false;\n}\n\n/**\n * Subscribe to a browser media query using React's external-store API.\n */\nexport function useMediaQuery(query: string): boolean {\n  const subscribe = useCallback(\n    (onStoreChange: () => void) => {\n      const mediaQueryList = window.matchMedia(query);\n      mediaQueryList.addEventListener('change', onStoreChange);\n      return () => mediaQueryList.removeEventListener('change', onStoreChange);\n    },\n    [query],\n  );\n\n  const getSnapshot = useCallback(() => {\n    return window.matchMedia(query).matches;\n  }, [query]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n}\n","import {cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const appShellRecipe = cva({\n  base: {\n    display: 'flex',\n    flexDirection: 'column',\n    position: 'relative',\n  },\n  variants: {\n    height: {\n      fill: {\n        h: '100dvh',\n      },\n      auto: {\n        minH: '100dvh',\n      },\n    },\n    variant: {\n      default: {\n        bg: 'bg.subtle',\n      },\n      section: {\n        bg: 'bg',\n      },\n    },\n  },\n  defaultVariants: {\n    height: 'fill',\n    variant: 'default',\n  },\n});\n\nexport type AppShellVariants = RecipeVariantProps<typeof appShellRecipe>;\n","import {useCallback, useEffect, useRef, useState} from 'react';\n\nfunction hasChildContent(element: HTMLElement): boolean {\n  for (const node of element.childNodes) {\n    if (node.nodeType === Node.ELEMENT_NODE) {\n      return true;\n    }\n\n    if (node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== '') {\n      return true;\n    }\n  }\n\n  return false;\n}\n\nexport function useSlotPresence(initialValue = false): {\n  hasContent: boolean;\n  ref: (node: HTMLDivElement | null) => void;\n} {\n  const [hasContent, setHasContent] = useState(initialValue);\n  const observerRef = useRef<MutationObserver | null>(null);\n\n  const ref = useCallback((node: HTMLDivElement | null) => {\n    observerRef.current?.disconnect();\n    observerRef.current = null;\n\n    if (node == null) {\n      setHasContent(false);\n      return;\n    }\n\n    setHasContent(hasChildContent(node));\n\n    const observer = new MutationObserver(() => {\n      setHasContent(hasChildContent(node));\n    });\n    observer.observe(node, {childList: true});\n    observerRef.current = observer;\n  }, []);\n\n  useEffect(() => {\n    return () => observerRef.current?.disconnect();\n  }, []);\n\n  return {hasContent, ref};\n}\n","import type {CSSProperties, ReactNode, Ref} from 'react';\nimport {useCallback, useEffect, useId, useMemo, useRef, useState} from 'react';\nimport {css} from 'styled-system/css';\nimport {MobileNavToggle} from '../../internal/MobileNav';\nimport {cx} from '../../internal/cx';\nimport {mergeRefs} from '../../internal/mergeRefs';\nimport {\n  observeResize,\n  unobserveResize,\n} from '../../internal/sharedResizeObserver';\nimport {useMediaQuery} from '../../internal/useMediaQuery';\nimport {Layout, LayoutContent, LayoutPanel, type SpacingStep} from '../Layout';\nimport {SideNavRenderContext} from '../SideNav';\nimport {TopNavMobileContentContext, TopNavRenderContext} from '../TopNav';\nimport {appShellRecipe} from './AppShell.recipe';\nimport {\n  AppShellMobileContext,\n  type AppShellMobileContextValue,\n} from './AppShellMobileContext';\nimport {useSlotPresence} from './useSlotPresence';\n\nexport type AppShellBreakpoint = 'sm' | 'md' | 'lg' | 'none';\nexport type AppShellVariant = 'default' | 'section';\nexport type AppShellHeight = 'fill' | 'auto';\n\n/**\n * Application-level layout shell with top navigation, side navigation,\n * banner, skip-to-content support, and responsive mobile navigation.\n */\nexport interface AppShellProps {\n  /**\n   * System-wide content rendered above the top navigation.\n   */\n  banner?: ReactNode;\n  /**\n   * Main content rendered inside the shell's `<main>` landmark.\n   */\n  children: ReactNode;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Padding applied to the main content area. Default is `0`.\n   */\n  contentPadding?: SpacingStep;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Height behavior. `fill` keeps scrolling inside the shell; `auto` lets the\n   * page grow with content.\n   */\n  height?: AppShellHeight;\n  /**\n   * Disable generated mobile navigation.\n   */\n  isMobileNavDisabled?: boolean;\n  /**\n   * Breakpoint below which mobile navigation is used.\n   * @default 'md'\n   */\n  mobileBreakpoint?: AppShellBreakpoint;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Side navigation slot, typically a SideNav.\n   */\n  sideNav?: ReactNode;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Top navigation slot, typically a TopNav.\n   */\n  topNav?: ReactNode;\n  /**\n   * Background and divider style for the shell.\n   */\n  variant?: AppShellVariant;\n}\n\nconst BREAKPOINT_VALUES: Record<AppShellBreakpoint, number> = {\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  none: 0,\n};\n\nconst styles = {\n  skipLink: css({\n    position: 'absolute',\n    top: 0,\n    insetInlineStart: 0,\n    w: '1px',\n    h: '1px',\n    p: 0,\n    m: '-1px',\n    overflow: 'hidden',\n    clipPath: 'inset(50%)',\n    whiteSpace: 'nowrap',\n    borderWidth: 0,\n    zIndex: 9999,\n    bg: 'bg',\n    color: 'primary',\n    textDecoration: 'none',\n    fontWeight: 'semibold',\n    _focus: {\n      position: 'fixed',\n      top: '2',\n      insetInlineStart: '2',\n      w: 'auto',\n      h: 'auto',\n      p: '2',\n      m: 0,\n      overflow: 'visible',\n      clipPath: 'none',\n      whiteSpace: 'normal',\n      outlineWidth: 'focus',\n      outlineStyle: 'solid',\n      outlineColor: 'primary',\n      outlineOffset: 'focusOffset',\n    },\n  }),\n  headerSticky: css({\n    position: 'sticky',\n    top: 0,\n    zIndex: 1,\n  }),\n  banner: css({\n    flexShrink: 0,\n  }),\n  autoMobileTopBar: css({\n    display: 'flex',\n    alignItems: 'center',\n    h: '12',\n    px: '2',\n  }),\n  sideNavSticky: css({\n    flexShrink: 0,\n    overflow: 'clip',\n    position: 'sticky',\n    top: 'var(--appshell-header-height, 0px)',\n    h: 'calc(100dvh - var(--appshell-header-height, 0px))',\n    display: 'flex',\n    flexDirection: 'column',\n  }),\n  elevatedWrapper: css({\n    position: 'relative',\n    display: 'flex',\n    flex: 1,\n    minH: 0,\n    h: '100%',\n  }),\n  elevatedBackdrop: css({\n    position: 'absolute',\n    inset: 0,\n    bg: 'bg',\n    borderStartStartRadius: '2xl',\n    pointerEvents: 'none',\n  }),\n  contentSurface: css({\n    bg: 'bg',\n  }),\n  contentTransparent: css({\n    bg: 'transparent',\n    isolation: 'isolate',\n  }),\n  slotContents: css({\n    display: 'contents',\n  }),\n};\n\ntype AppShellRootStyle = CSSProperties & {\n  '--appshell-header-height'?: string;\n};\n\n/**\n * Application-level layout shell with top navigation, side navigation,\n * banner, skip-to-content support, and responsive mobile navigation.\n */\nexport function AppShell({\n  banner,\n  children,\n  className,\n  contentPadding,\n  'data-testid': dataTestId,\n  height = 'fill',\n  isMobileNavDisabled = false,\n  mobileBreakpoint = 'md',\n  ref,\n  sideNav,\n  style,\n  topNav,\n  variant = 'default',\n}: AppShellProps): React.JSX.Element {\n  const mainContentId = useId();\n  const breakpointQuery =\n    mobileBreakpoint === 'none'\n      ? '(max-width: 0px)'\n      : `(max-width: ${BREAKPOINT_VALUES[mobileBreakpoint]}px)`;\n  const isBelowBreakpoint = useMediaQuery(breakpointQuery);\n  const [isMobileNavOpen, setIsMobileNavOpen] = useState(false);\n  const setMobileNavOpen = useCallback((isOpen: boolean) => {\n    setIsMobileNavOpen(isOpen);\n  }, []);\n  const {ref: topNavPresenceRef, hasContent: hasTopNavContent} =\n    useSlotPresence(topNav != null);\n  const {ref: sideNavPresenceRef, hasContent: hasSideNavContent} =\n    useSlotPresence(sideNav != null);\n  const hasTopNav = topNav != null;\n  const hasSideNav = sideNav != null;\n  const hasNavContent = hasTopNavContent || hasSideNavContent;\n  const mobileNavEnabled = !isMobileNavDisabled && hasNavContent;\n  const showSideNavInline = hasSideNav && !isBelowBreakpoint;\n  const isAuto = height === 'auto';\n  const isFill = height === 'fill';\n  const navHasDividers = variant === 'section';\n  const headerRef = useRef<HTMLDivElement>(null);\n  const shellRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!isAuto || headerRef.current == null || shellRef.current == null) {\n      return;\n    }\n\n    const headerElement = headerRef.current;\n    const shellElement = shellRef.current;\n    const updateHeight = () => {\n      shellElement.style.setProperty(\n        '--appshell-header-height',\n        `${headerElement.getBoundingClientRect().height}px`,\n      );\n    };\n\n    observeResize(headerElement, updateHeight);\n    return () => unobserveResize(headerElement);\n  }, [isAuto]);\n\n  const mobileContextValue = useMemo<AppShellMobileContextValue>(\n    () => ({\n      closeMobileNav: () => setMobileNavOpen(false),\n      hasAutoToggle: true,\n      isMobile: isBelowBreakpoint,\n      isMobileNavEnabled: mobileNavEnabled,\n      isMobileNavOpen,\n      openMobileNav: () => mobileNavEnabled && setMobileNavOpen(true),\n      toggleMobileNav: () => {\n        if (mobileNavEnabled) {\n          setIsMobileNavOpen(prev => !prev);\n        }\n      },\n    }),\n    [isBelowBreakpoint, isMobileNavOpen, mobileNavEnabled, setMobileNavOpen],\n  );\n\n  /* eslint-disable @eslint-react/no-unstable-context-value -- sideNav ReactNode prop prevents stable memoization */\n  const mobileContentValue = hasSideNavContent ? (\n    <SideNavRenderContext value=\"drawer-content\">\n      <div className={styles.slotContents} ref={sideNavPresenceRef}>\n        {sideNav}\n      </div>\n    </SideNavRenderContext>\n  ) : null;\n  const drawerMobileContentValue = hasSideNavContent ? (\n    <SideNavRenderContext value=\"drawer-content\">\n      {sideNav}\n    </SideNavRenderContext>\n  ) : null;\n  /* eslint-enable @eslint-react/no-unstable-context-value */\n  const topNavContent =\n    hasTopNav && isBelowBreakpoint && !isMobileNavDisabled ? (\n      <TopNavMobileContentContext value={mobileContentValue}>\n        <TopNavRenderContext value=\"mobile-bar\">\n          <div className={styles.slotContents} ref={topNavPresenceRef}>\n            {topNav}\n          </div>\n        </TopNavRenderContext>\n      </TopNavMobileContentContext>\n    ) : (\n      topNav\n    );\n  const headerContent =\n    hasTopNav || banner != null ? (\n      <div className={cx(isAuto && styles.headerSticky)} ref={headerRef}>\n        <header style={{flexShrink: 0}}>\n          {banner != null ? (\n            <div className={styles.banner}>{banner}</div>\n          ) : null}\n          {hasTopNav ? (\n            <div className={styles.slotContents} ref={topNavPresenceRef}>\n              {topNavContent}\n            </div>\n          ) : null}\n        </header>\n      </div>\n    ) : undefined;\n  const autoMobileTopBar =\n    !isMobileNavDisabled &&\n    isBelowBreakpoint &&\n    !hasTopNavContent &&\n    hasSideNav ? (\n      <header style={{flexShrink: 0}}>\n        <div\n          aria-label=\"Mobile navigation\"\n          className={styles.autoMobileTopBar}\n          role=\"navigation\">\n          <SideNavRenderContext value=\"topbar\">\n            <div className={styles.slotContents} ref={sideNavPresenceRef}>\n              {sideNav}\n            </div>\n          </SideNavRenderContext>\n          <MobileNavToggle />\n        </div>\n      </header>\n    ) : undefined;\n  const sideNavPanel = showSideNavInline ? (\n    <LayoutPanel isScrollable={isFill} padding={0}>\n      <div className={styles.slotContents} ref={sideNavPresenceRef}>\n        {sideNav}\n      </div>\n    </LayoutPanel>\n  ) : undefined;\n  const sideNavContent =\n    sideNavPanel != null && isAuto ? (\n      <div className={styles.sideNavSticky}>{sideNavPanel}</div>\n    ) : (\n      sideNavPanel\n    );\n  const contentClassName =\n    variant === 'default' && hasTopNavContent && showSideNavInline\n      ? styles.contentTransparent\n      : variant === 'default'\n        ? styles.contentSurface\n        : undefined;\n  const mainInner = (\n    <LayoutContent\n      as=\"main\"\n      className={contentClassName}\n      id={mainContentId}\n      isScrollable={isFill}\n      padding={contentPadding ?? 0}>\n      {children}\n    </LayoutContent>\n  );\n  const shouldElevateWithCorner =\n    variant === 'default' && hasTopNavContent && showSideNavInline;\n  const mainContent = shouldElevateWithCorner ? (\n    <div className={styles.elevatedWrapper}>\n      <div className={styles.elevatedBackdrop} />\n      {mainInner}\n    </div>\n  ) : (\n    mainInner\n  );\n  const rootStyle: AppShellRootStyle = {...style};\n\n  return (\n    <AppShellMobileContext value={mobileContextValue}>\n      <div\n        className={cx(appShellRecipe({height, variant}), className)}\n        data-testid={dataTestId}\n        ref={mergeRefs(ref, shellRef)}\n        style={rootStyle}>\n        <a\n          className={styles.skipLink}\n          data-testid=\"skip-to-content\"\n          href={`#${mainContentId}`}>\n          Skip to content\n        </a>\n        <Layout\n          content={mainContent}\n          hasDividers={navHasDividers}\n          header={\n            <>\n              {headerContent}\n              {autoMobileTopBar}\n            </>\n          }\n          height={height}\n          padding={0}\n          start={sideNavContent}\n        />\n        {isBelowBreakpoint && !isMobileNavDisabled ? (\n          <>\n            {hasSideNav && !hasTopNavContent ? (\n              <SideNavRenderContext value=\"drawer\">\n                {sideNav}\n              </SideNavRenderContext>\n            ) : null}\n            {hasTopNav && hasTopNavContent ? (\n              <TopNavMobileContentContext value={drawerMobileContentValue}>\n                <TopNavRenderContext value=\"drawer\">\n                  {topNav}\n                </TopNavRenderContext>\n              </TopNavMobileContentContext>\n            ) : null}\n          </>\n        ) : null}\n      </div>\n    </AppShellMobileContext>\n  );\n}\n\nAppShell.displayName = 'AppShell';\n"]}

package/dist/chunk-YZUBJ2L2.cjs

@@ -0,0 +1,195 @@
+'use strict';
+
+var chunkYMC56K6R_cjs = require('./chunk-YMC56K6R.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');
+
+var ListContext = react.createContext(null);
+ListContext.displayName = "ListContext";
+var styles = {
+  root: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    flexDirection: "column"
+  }),
+  list: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    flexDirection: "column",
+    gap: "0.5",
+    m: 0,
+    p: 0,
+    listStyleType: "none"
+  }),
+  withDividers: chunkAZDWQGAX_cjs.css({
+    gap: 0
+  }),
+  withCounter: chunkAZDWQGAX_cjs.css({
+    counterReset: "silver-list"
+  }),
+  header: chunkAZDWQGAX_cjs.css({
+    mb: "2"
+  })
+};
+function List({
+  children,
+  className,
+  "data-testid": dataTestId,
+  hasDividers = false,
+  header,
+  listStyle = "none",
+  ref,
+  start,
+  style
+}) {
+  const headerId = react.useId();
+  const isOrdered = listStyle === "decimal";
+  const Component = isOrdered ? "ol" : "ul";
+  const counterReset = listStyle !== "none" && start != null && start !== 1 ? `silver-list ${start - 1}` : void 0;
+  const contextValue = react.useMemo(
+    () => ({ hasDividers, listStyle }),
+    [hasDividers, listStyle]
+  );
+  const listElement = /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      "aria-labelledby": header != null ? headerId : void 0,
+      className: chunkSPDVNY2Z_cjs.cx(
+        styles.list,
+        hasDividers ? styles.withDividers : void 0,
+        listStyle !== "none" ? styles.withCounter : void 0,
+        className
+      ),
+      "data-testid": dataTestId,
+      ref,
+      role: listStyle === "none" && !isOrdered ? "list" : void 0,
+      start: isOrdered ? start : void 0,
+      style: { counterReset, ...style },
+      children
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(ListContext, { value: contextValue, children: header == null ? listElement : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.root, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.header, id: headerId, children: header }),
+    listElement
+  ] }) });
+}
+List.displayName = "List";
+var markerSize = "6px";
+var styles2 = {
+  withCounter: chunkAZDWQGAX_cjs.css({
+    counterIncrement: "silver-list"
+  }),
+  withDivider: chunkAZDWQGAX_cjs.css({
+    borderBlockEndWidth: "default",
+    borderBlockEndStyle: "solid",
+    borderBlockEndColor: "border",
+    _last: {
+      borderBlockEndWidth: 0
+    }
+  }),
+  noRadius: chunkAZDWQGAX_cjs.css({
+    borderRadius: 0
+  }),
+  markerContainer: chunkAZDWQGAX_cjs.css({
+    alignSelf: "baseline",
+    boxSizing: "border-box",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+    w: "4",
+    mt: `calc((1em * 1.5 - ${markerSize}) / 2)`
+  }),
+  dot: chunkAZDWQGAX_cjs.css({
+    w: markerSize,
+    h: markerSize,
+    borderRadius: "full",
+    bg: "fg"
+  }),
+  circle: chunkAZDWQGAX_cjs.css({
+    w: markerSize,
+    h: markerSize,
+    borderRadius: "full",
+    borderWidth: "default",
+    borderStyle: "solid",
+    borderColor: "fg",
+    bg: "transparent"
+  }),
+  number: chunkAZDWQGAX_cjs.css({
+    alignSelf: "baseline",
+    flexShrink: 0,
+    color: "fg",
+    fontFamily: "body",
+    fontSize: "md",
+    lineHeight: "1.5",
+    w: "4",
+    _before: {
+      content: 'counter(silver-list) "."'
+    }
+  })
+};
+function Marker({ listStyle }) {
+  if (listStyle === "disc") {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.markerContainer, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.dot }) });
+  }
+  if (listStyle === "circle") {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.markerContainer, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.circle }) });
+  }
+  if (listStyle === "decimal") {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles2.number });
+  }
+  return null;
+}
+function ListItem({
+  className,
+  "data-testid": dataTestId,
+  description,
+  endContent,
+  href,
+  isDisabled = false,
+  isSelected = false,
+  label,
+  onClick,
+  ref,
+  rel,
+  startContent,
+  style,
+  target
+}) {
+  const context = react.use(ListContext);
+  const hasDividers = context?.hasDividers ?? false;
+  const listStyle = context?.listStyle ?? "none";
+  const hasMarkers = listStyle !== "none";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    chunkYMC56K6R_cjs.Item,
+    {
+      as: "li",
+      className: chunkSPDVNY2Z_cjs.cx(
+        hasMarkers ? styles2.withCounter : void 0,
+        hasDividers ? styles2.withDivider : void 0,
+        hasDividers ? styles2.noRadius : void 0,
+        className
+      ),
+      "data-testid": dataTestId,
+      description,
+      endContent,
+      href,
+      isDisabled,
+      isSelected,
+      label,
+      leadingContent: /* @__PURE__ */ jsxRuntime.jsx(Marker, { listStyle }),
+      onClick,
+      ref,
+      rel,
+      startContent,
+      style,
+      target
+    }
+  );
+}
+ListItem.displayName = "ListItem";
+
+exports.List = List;
+exports.ListItem = ListItem;
+//# sourceMappingURL=chunk-YZUBJ2L2.cjs.map
+//# sourceMappingURL=chunk-YZUBJ2L2.cjs.map

package/dist/chunk-YZUBJ2L2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/List/ListContext.tsx","../src/components/List/List.tsx","../src/components/List/ListItem.tsx"],"names":["createContext","css","useId","useMemo","jsx","cx","jsxs","styles","use","Item"],"mappings":"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","file":"chunk-YZUBJ2L2.cjs","sourcesContent":["import {createContext} from 'react';\n\nexport type ListStyle = 'none' | 'disc' | 'decimal' | 'circle';\n\nexport interface ListContextValue {\n  hasDividers: boolean;\n  listStyle: ListStyle;\n}\n\nexport const ListContext = createContext<ListContextValue | null>(null);\nListContext.displayName = 'ListContext';\n","import {\n  useId,\n  useMemo,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport {ListContext, type ListStyle} from './ListContext';\n\nexport type {ListStyle};\n\nexport interface ListProps {\n  /**\n   * List items.\n   */\n  children: ReactNode;\n  /**\n   * Additional CSS class names applied to the list element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the list element.\n   */\n  'data-testid'?: string;\n  /**\n   * Whether to show dividers between list items.\n   * @default false\n   */\n  hasDividers?: boolean;\n  /**\n   * Header content rendered above and associated with the list.\n   */\n  header?: ReactNode;\n  /**\n   * List marker style. `decimal` renders an ordered list.\n   * @default 'none'\n   */\n  listStyle?: ListStyle;\n  /**\n   * Ref forwarded to the list element.\n   */\n  ref?: Ref<HTMLUListElement | HTMLOListElement>;\n  /**\n   * Starting number for ordered lists.\n   * @default 1\n   */\n  start?: number;\n  /**\n   * Inline styles applied to the list element.\n   */\n  style?: CSSProperties;\n}\n\nconst styles = {\n  root: css({\n    display: 'flex',\n    flexDirection: 'column',\n  }),\n  list: css({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '0.5',\n    m: 0,\n    p: 0,\n    listStyleType: 'none',\n  }),\n  withDividers: css({\n    gap: 0,\n  }),\n  withCounter: css({\n    counterReset: 'silver-list',\n  }),\n  header: css({\n    mb: '2',\n  }),\n} as const;\n\n/**\n * Semantic vertical list container with optional dividers, markers, and header.\n */\nexport function List({\n  children,\n  className,\n  'data-testid': dataTestId,\n  hasDividers = false,\n  header,\n  listStyle = 'none',\n  ref,\n  start,\n  style,\n}: ListProps): React.JSX.Element {\n  const headerId = useId();\n  const isOrdered = listStyle === 'decimal';\n  const Component = isOrdered ? 'ol' : 'ul';\n  const counterReset =\n    listStyle !== 'none' && start != null && start !== 1\n      ? `silver-list ${start - 1}`\n      : undefined;\n  const contextValue = useMemo(\n    () => ({hasDividers, listStyle}),\n    [hasDividers, listStyle],\n  );\n\n  const listElement = (\n    <Component\n      aria-labelledby={header != null ? headerId : undefined}\n      className={cx(\n        styles.list,\n        hasDividers ? styles.withDividers : undefined,\n        listStyle !== 'none' ? styles.withCounter : undefined,\n        className,\n      )}\n      data-testid={dataTestId}\n      ref={ref as Ref<HTMLUListElement & HTMLOListElement>}\n      role={listStyle === 'none' && !isOrdered ? 'list' : undefined}\n      start={isOrdered ? start : undefined}\n      style={{counterReset, ...style}}>\n      {children}\n    </Component>\n  );\n\n  return (\n    <ListContext value={contextValue}>\n      {header == null ? (\n        listElement\n      ) : (\n        <div className={styles.root}>\n          <div className={styles.header} id={headerId}>\n            {header}\n          </div>\n          {listElement}\n        </div>\n      )}\n    </ListContext>\n  );\n}\n\nList.displayName = 'List';\n","import {\n  use,\n  type CSSProperties,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport {Item} from '../Item';\nimport {ListContext, type ListStyle} from './ListContext';\n\nexport interface ListItemProps {\n  /**\n   * Additional CSS class names applied to the list item.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the list item.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text shown below the label.\n   */\n  description?: ReactNode;\n  /**\n   * Trailing content rendered after the label area.\n   */\n  endContent?: ReactNode;\n  /**\n   * Link URL. When set, the content area renders as a link.\n   */\n  href?: string;\n  /**\n   * Whether the item is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether the item is selected.\n   * @default false\n   */\n  isSelected?: boolean;\n  /**\n   * Primary item label.\n   */\n  label: ReactNode;\n  /**\n   * Click handler for interactive items.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n  /**\n   * Ref forwarded to the list item.\n   */\n  ref?: Ref<HTMLLIElement>;\n  /**\n   * Link relationship.\n   */\n  rel?: string;\n  /**\n   * Content rendered before the label area.\n   */\n  startContent?: ReactNode;\n  /**\n   * Inline styles applied to the list item.\n   */\n  style?: CSSProperties;\n  /**\n   * Link target.\n   */\n  target?: string;\n}\n\nconst markerSize = '6px';\n\nconst styles = {\n  withCounter: css({\n    counterIncrement: 'silver-list',\n  }),\n  withDivider: css({\n    borderBlockEndWidth: 'default',\n    borderBlockEndStyle: 'solid',\n    borderBlockEndColor: 'border',\n    _last: {\n      borderBlockEndWidth: 0,\n    },\n  }),\n  noRadius: css({\n    borderRadius: 0,\n  }),\n  markerContainer: css({\n    alignSelf: 'baseline',\n    boxSizing: 'border-box',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n    w: '4',\n    mt: `calc((1em * 1.5 - ${markerSize}) / 2)`,\n  }),\n  dot: css({\n    w: markerSize,\n    h: markerSize,\n    borderRadius: 'full',\n    bg: 'fg',\n  }),\n  circle: css({\n    w: markerSize,\n    h: markerSize,\n    borderRadius: 'full',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'fg',\n    bg: 'transparent',\n  }),\n  number: css({\n    alignSelf: 'baseline',\n    flexShrink: 0,\n    color: 'fg',\n    fontFamily: 'body',\n    fontSize: 'md',\n    lineHeight: '1.5',\n    w: '4',\n    _before: {\n      content: 'counter(silver-list) \".\"',\n    },\n  }),\n} as const;\n\nfunction Marker({listStyle}: {listStyle: ListStyle}): React.JSX.Element | null {\n  if (listStyle === 'disc') {\n    return (\n      <span className={styles.markerContainer}>\n        <span className={styles.dot} />\n      </span>\n    );\n  }\n\n  if (listStyle === 'circle') {\n    return (\n      <span className={styles.markerContainer}>\n        <span className={styles.circle} />\n      </span>\n    );\n  }\n\n  if (listStyle === 'decimal') {\n    return <span className={styles.number} />;\n  }\n\n  return null;\n}\n\n/**\n * Structured list item built on the shared `Item` primitive.\n */\nexport function ListItem({\n  className,\n  'data-testid': dataTestId,\n  description,\n  endContent,\n  href,\n  isDisabled = false,\n  isSelected = false,\n  label,\n  onClick,\n  ref,\n  rel,\n  startContent,\n  style,\n  target,\n}: ListItemProps): React.JSX.Element {\n  const context = use(ListContext);\n  const hasDividers = context?.hasDividers ?? false;\n  const listStyle = context?.listStyle ?? 'none';\n  const hasMarkers = listStyle !== 'none';\n\n  return (\n    <Item\n      as=\"li\"\n      className={cx(\n        hasMarkers ? styles.withCounter : undefined,\n        hasDividers ? styles.withDivider : undefined,\n        hasDividers ? styles.noRadius : undefined,\n        className,\n      )}\n      data-testid={dataTestId}\n      description={description}\n      endContent={endContent}\n      href={href}\n      isDisabled={isDisabled}\n      isSelected={isSelected}\n      label={label}\n      leadingContent={<Marker listStyle={listStyle} />}\n      onClick={onClick}\n      ref={ref}\n      rel={rel}\n      startContent={startContent}\n      style={style}\n      target={target}\n    />\n  );\n}\n\nListItem.displayName = 'ListItem';\n"]}