@multiplatform.one/components 7.79.0 → 7.80.0

package/src/layouts/page.tsx

@@ -67,6 +67,7 @@ import {
   ScreenScrollScope,
   TopBarSlot,
   useLargeTitle,
+  useReportScreenScroll,
   useScreenScroll,
   useScreenScrollController,
   useTopBarSlot,
@@ -97,6 +98,12 @@ function negateSpaceToken(token: string): `$-${string}` {
  */
 export const CONTENT_MAX_WIDTH = layoutBreakpoints.xl;
 
+/**
+ * The readable column an app shell centres its content in at regular width
+ * (UIKit's readableContentGuide): the two-pane budget breakpoint.
+ */
+export const READABLE_MAX_WIDTH = layoutBreakpoints.expanded;
+
 export interface ScreenProps extends YStackProps {
   /** Wrap content in a ScrollView. Default: true. */
   scroll?: boolean;
@@ -271,6 +278,7 @@ function PageShell({
 }: ScreenProps) {
   const { knobProps } = useResolvedKnobs({ component: "Screen" });
   const scrollState = useScreenScrollController();
+  useReportScreenScroll(scrollState.state, Boolean(topBar));
   const [accessories] = useState(createBottomAccessoryStore);
   const chromeInset = useBottomChromeInset();
   const inset = noPadding ? null : (knobProps.panelPadding.padding as string);

package/src/layouts/screenScroll.tsx

@@ -308,6 +308,77 @@ export function useTopBarSlot(): TopBarSlotValue | null {
   return useContext(TopBarSlotContext);
 }
 
+/**
+ * What the outermost Screen under an app shell tells the shell's nav bar
+ * (LC-157 under `AppShell`): its scroll state, and whether the page pins a
+ * top bar of its own, in which case that bar is the nav bar and the shell
+ * draws none.
+ */
+export interface ShellScrollReport extends ScreenScrollState {
+  ownTopBar: boolean;
+}
+
+type ShellScrollReporter = (id: string, report: ShellScrollReport | null) => void;
+
+const ShellScrollReportContext = createContext<ShellScrollReporter | null>(null);
+
+/** The shell's half: the latest report, and the scope its content sits in. */
+export function useShellScrollReports(): {
+  report: ShellScrollReport | null;
+  reporter: ShellScrollReporter;
+} {
+  const [entry, setEntry] = useState<{ id: string; report: ShellScrollReport } | null>(null);
+  const reporter = useCallback<ShellScrollReporter>((id, report) => {
+    setEntry((prev) => {
+      if (!report) return prev?.id === id ? null : prev;
+      if (
+        prev?.id === id &&
+        prev.report.scrolled === report.scrolled &&
+        prev.report.collapsed === report.collapsed &&
+        prev.report.title === report.title &&
+        prev.report.ownTopBar === report.ownTopBar
+      ) {
+        return prev;
+      }
+      return { id, report };
+    });
+  }, []);
+  return { report: entry?.report ?? null, reporter };
+}
+
+export function ShellScrollReportScope({
+  reporter,
+  children,
+}: {
+  reporter: ShellScrollReporter;
+  children: ReactNode;
+}) {
+  return (
+    <ShellScrollReportContext.Provider value={reporter}>
+      {children}
+    </ShellScrollReportContext.Provider>
+  );
+}
+
+/**
+ * The Screen's half: the outermost Screen under a shell reports its state;
+ * a Screen nested in another stays quiet, so the page's own wins.
+ */
+export function useReportScreenScroll(state: ScreenScrollState, ownTopBar: boolean) {
+  const reporter = useContext(ShellScrollReportContext);
+  const nested = useContext(ScreenScrollActionsContext) !== null;
+  const id = useId();
+  const live = reporter && !nested ? reporter : null;
+  const { scrolled, collapsed, title } = state;
+  useEffect(() => {
+    live?.(id, { scrolled, collapsed, title, ownTopBar });
+  }, [live, id, scrolled, collapsed, title, ownTopBar]);
+  useEffect(() => {
+    if (!live) return;
+    return () => live(id, null);
+  }, [live, id]);
+}
+
 const inertTitle = () => () => undefined;
 const inertTitleBottom = () => undefined;
 

package/src/layouts/sidebar.tsx

@@ -5,6 +5,7 @@ import {
   getGroupPosition,
   hairline,
   hairlineWidth,
+  normalizeToHex,
   stackRadiusProps,
   useResolvedKnobs,
   wasKeyboardFocus,
@@ -12,7 +13,16 @@ import {
 } from "@multiplatform.one/theme";
 import type React from "react";
 import { Fragment, useId, useState } from "react";
-import { Label, Separator, Text as TamaguiText, XStack, YStack, isWeb } from "tamagui";
+import {
+  Label,
+  Separator,
+  Text as TamaguiText,
+  XStack,
+  YStack,
+  isWeb,
+  useTheme,
+  useThemeName,
+} from "tamagui";
 import { ScrollView } from "../ScrollView";
 import { componentColors } from "../componentColors";
 import { Text } from "../Text";
@@ -76,6 +86,46 @@ export interface SidebarProps {
    */
   footer?: React.ReactNode;
   testID?: string;
+  /** Pinned above the rows, outside their scroll (an app's name in a shell rail). */
+  header?: React.ReactNode;
+  /** Stacked under the sections inside the same scroll (a page's panel, LC-101). */
+  children?: React.ReactNode;
+  /**
+   * Paint the column in the translucent sidebar material instead of the card
+   * surface (the HIG source list): an app shell's sidebar.
+   */
+  material?: boolean;
+}
+
+/**
+ * The ramp step the sidebar material paints: darker than the page in light,
+ * lighter in dark, as the HIG sidebar reads against its content. The dark
+ * ramp climbs slower at its low end, so it takes one step more.
+ */
+export const sidebarMaterial = { light: "$color3", dark: "$color4" } as const;
+/**
+ * How much of the page shows through the material. The shell's column sits
+ * beside its content, never over it, so the page ground is all that is
+ * behind it and a blur would paint nothing (LC-206).
+ */
+export const sidebarMaterialOpacity = 0.72;
+/**
+ * A material rail's inset from its edges. Its rows are inset pills with no
+ * rule between them (the HIG source list); a header or footer lines up with
+ * the rows by it.
+ */
+export const sidebarRailInset = "$2";
+
+function useSidebarMaterial(enabled: boolean) {
+  const theme = useTheme() as unknown as Record<string, { val?: unknown } | undefined>;
+  const step = useThemeName().startsWith("dark") ? sidebarMaterial.dark : sidebarMaterial.light;
+  if (!enabled) return null;
+  const base = theme[step.slice(1)]?.val;
+  const hex = typeof base === "string" ? normalizeToHex(base) : null;
+  const backgroundColor = hex
+    ? `rgba(${[1, 3, 5].map((i) => parseInt(hex.slice(i, i + 2), 16)).join(", ")}, ${sidebarMaterialOpacity})`
+    : step;
+  return { backgroundColor };
 }
 
 export function Sidebar({
@@ -86,8 +136,12 @@ export function Sidebar({
   divider = true,
   footer,
   testID,
+  header,
+  children,
+  material = false,
 }: SidebarProps) {
   const { knobProps } = useResolvedKnobs();
+  const materialProps = useSidebarMaterial(material);
   const headingId = useId();
   // LC-05: active row labels and metadata share the selection ink.
   // SP-EDGE: rows own the horizontal inset (the panelPadding role via the
@@ -112,6 +166,7 @@ export function Sidebar({
       // SF-CARD fill without a four-side control border (R-NONE). The end
       // hairline is the panel divider (Axiom 15), stretched to the rail height.
       {...knobProps.surface}
+      {...(materialProps as object)}
       borderWidth={0}
       borderColor="$borderColor"
       {...(!divider
@@ -125,8 +180,21 @@ export function Sidebar({
           : { borderEndWidth: hairlineWidth })}
       testID={testID}
     >
+      {header ? (
+        <YStack
+          flexShrink={0}
+          {...(material ? { paddingHorizontal: sidebarRailInset } : null)}
+          data-sidebar-header=""
+        >
+          {header}
+        </YStack>
+      ) : null}
       <ScrollView flex={1}>
-        <YStack {...knobProps.panelPadding} paddingHorizontal={0} {...knobProps.gapLg}>
+        <YStack
+          {...knobProps.panelPadding}
+          paddingHorizontal={material ? sidebarRailInset : 0}
+          {...knobProps.gapLg}
+        >
           {sections.map((section, sectionIdx) => {
             const titleId = section.title ? `${headingId}-${sectionIdx}` : undefined;
             return (
@@ -183,7 +251,9 @@ export function Sidebar({
                 <YStack width="100%" data-sidebar-group="">
                   {section.items.map((item, itemIdx, items) => {
                     const position = getGroupPosition(itemIdx, items.length);
-                    const corners = stackRadiusProps(position, knobProps.borderRadius.borderRadius);
+                    const corners = material
+                      ? { borderRadius: knobProps.borderRadius.borderRadius }
+                      : stackRadiusProps(position, knobProps.borderRadius.borderRadius);
                     const itemKey = `${sectionIdx}:${String(item.value ?? item.label)}`;
                     const ink = item.active
                       ? componentColors.selection.ink
@@ -202,7 +272,7 @@ export function Sidebar({
                       : null;
                     return (
                       <Fragment key={itemKey}>
-                        {itemIdx > 0 ? (
+                        {itemIdx > 0 && !material ? (
                           <YStack alignSelf="stretch" paddingStart={rowPad}>
                             <Separator alignSelf="stretch" {...hairline.line} />
                           </YStack>
@@ -325,10 +395,18 @@ export function Sidebar({
               </YStack>
             );
           })}
+          {children}
         </YStack>
       </ScrollView>
       {footer != null && footer !== false ? (
-        <YStack flexShrink={1} minHeight={0} maxHeight="50%" width="100%" data-sidebar-footer="">
+        <YStack
+          flexShrink={1}
+          minHeight={0}
+          maxHeight="50%"
+          width="100%"
+          {...(material ? { paddingHorizontal: sidebarRailInset } : null)}
+          data-sidebar-footer=""
+        >
           <Separator width="100%" alignSelf="stretch" {...hairline.line} />
           {footer}
         </YStack>

package/types/appShell/AppShell.d.ts

@@ -0,0 +1,47 @@
+import { type ReactNode } from "react";
+import type { TabBarIcon, TabBarItem } from "./TabBar";
+export interface AppShellDestination {
+    /** The destination's route; a path under it keeps it selected. */
+    key: string;
+    /** One short word: it is the tab caption and the back label. */
+    label: string;
+    icon: TabBarIcon;
+    /** The SF Symbol the iOS system tab bar draws for this destination. */
+    nativeIcon?: TabBarItem["nativeIcon"];
+    /**
+     * `tab` (default) sits in the phone's tab bar; `more` opens from the bar's
+     * pull-down. Every destination sits in the regular-width sidebar.
+     */
+    placement?: "tab" | "more";
+    /** Runs instead of `onNavigate(key)`, e.g. an external link. */
+    onPress?: () => void;
+}
+export interface AppShellProps {
+    destinations: readonly AppShellDestination[];
+    /** The current route path. */
+    path: string;
+    onNavigate: (key: string) => void;
+    /** The app's name: the sidebar's title and the home control's label. */
+    title: string;
+    /** The app's mark, leading the bar on a phone and the name in the sidebar. */
+    logo?: ReactNode;
+    /** Pressing the name or mark. Default: the first destination. */
+    onTitlePress?: () => void;
+    /** Trailing bar actions (theme, account). */
+    actions?: ReactNode;
+    /** Shows a tinted back on a route pushed below its destination (its key). */
+    onBack?: (destinationKey: string) => void;
+    /** The phone's bottom accessory (LC-174), handed to the tab bar or pinned to the bottom edge. */
+    accessory?: ReactNode;
+    /** Route prefixes that mount their own chrome; the shell draws none there. */
+    ownChrome?: readonly string[];
+    children?: ReactNode;
+    testID?: string;
+}
+/** The destination that owns `path` (the longest key it sits under). */
+export declare function appShellRoute(destinations: readonly AppShellDestination[], path: string): {
+    destination: AppShellDestination | undefined;
+    pushed: boolean;
+};
+export declare function AppShell({ destinations, path, onNavigate, title, logo, onTitlePress, actions, onBack, accessory, ownChrome, children, testID, }: AppShellProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AppShell.d.ts.map

package/types/appShell/AppShell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/appShell/AppShell.tsx"],"names":[],"mappings":"AAiCA,OAAO,EAA+C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAepF,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAIvD,MAAM,WAAW,mBAAmB;IAClC,kEAAkE;IAClE,GAAG,EAAE,MAAM,CAAC;IACZ,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,UAAU,CAAC;IACjB,uEAAuE;IACvE,UAAU,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;IACtC;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAC3B,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,aAAa;IAC5B,YAAY,EAAE,SAAS,mBAAmB,EAAE,CAAC;IAC7C,8BAA8B;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,wEAAwE;IACxE,KAAK,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,iEAAiE;IACjE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,6CAA6C;IAC7C,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,6EAA6E;IAC7E,MAAM,CAAC,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,iGAAiG;IACjG,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAOD,wEAAwE;AACxE,wBAAgB,aAAa,CAC3B,YAAY,EAAE,SAAS,mBAAmB,EAAE,EAC5C,IAAI,EAAE,MAAM,GACX;IAAE,WAAW,EAAE,mBAAmB,GAAG,SAAS,CAAC;IAAC,MAAM,EAAE,OAAO,CAAA;CAAE,CAQnE;AAiKD,wBAAgB,QAAQ,CAAC,EACvB,YAAY,EACZ,IAAI,EACJ,UAAU,EACV,KAAK,EACL,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAc,EACd,QAAQ,EACR,MAAoB,GACrB,EAAE,aAAa,2CAkPf"}

package/types/appShell/index.d.ts

@@ -6,5 +6,6 @@ export { TabHost, type TabHostProps } from "./TabHost";
 export * from "./Springboard";
 export type { AppEntry } from "./appTile";
 export * from "./SettingsSplit";
+export * from "./AppShell";
 export { useBottomChromeInset } from "./bottomChrome";
 //# sourceMappingURL=index.d.ts.map

package/types/appShell/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/appShell/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AACvD,cAAc,eAAe,CAAC;AAC9B,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/appShell/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AACvD,cAAc,eAAe,CAAC;AAC9B,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC"}

package/types/layouts/page.d.ts

@@ -24,6 +24,11 @@ import { type PageHeadingLevel } from "./pageHeadingScope";
  * (DG-LAY-01: layout primitives consume breakpoint tokens, not raw pixels).
  */
 export declare const CONTENT_MAX_WIDTH: 1280;
+/**
+ * The readable column an app shell centres its content in at regular width
+ * (UIKit's readableContentGuide): the two-pane budget breakpoint.
+ */
+export declare const READABLE_MAX_WIDTH: 860;
 export interface ScreenProps extends YStackProps {
     /** Wrap content in a ScrollView. Default: true. */
     scroll?: boolean;

package/types/layouts/page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../src/layouts/page.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../src/layouts/page.tsx"],"names":[],"mappings":"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"}

package/types/layouts/screenScroll.d.ts

@@ -112,6 +112,30 @@ export declare function TopBarSlot({ children, ...value }: TopBarSlotValue & {
 }): import("react/jsx-runtime").JSX.Element;
 /** The pinned top bar's slot, or null when a toolbar sits in the page flow. */
 export declare function useTopBarSlot(): TopBarSlotValue | null;
+/**
+ * What the outermost Screen under an app shell tells the shell's nav bar
+ * (LC-157 under `AppShell`): its scroll state, and whether the page pins a
+ * top bar of its own, in which case that bar is the nav bar and the shell
+ * draws none.
+ */
+export interface ShellScrollReport extends ScreenScrollState {
+    ownTopBar: boolean;
+}
+type ShellScrollReporter = (id: string, report: ShellScrollReport | null) => void;
+/** The shell's half: the latest report, and the scope its content sits in. */
+export declare function useShellScrollReports(): {
+    report: ShellScrollReport | null;
+    reporter: ShellScrollReporter;
+};
+export declare function ShellScrollReportScope({ reporter, children, }: {
+    reporter: ShellScrollReporter;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * The Screen's half: the outermost Screen under a shell reports its state;
+ * a Screen nested in another stays quiet, so the page's own wins.
+ */
+export declare function useReportScreenScroll(state: ScreenScrollState, ownTopBar: boolean): void;
 /**
  * A nested Screen's content scrolls in its parent's scroll view, so it reads
  * the parent's scroll actions, but its own large title stays a heading in the

package/types/layouts/screenScroll.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screenScroll.d.ts","sourceRoot":"","sources":["../../src/layouts/screenScroll.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAclD,MAAM,WAAW,iBAAiB;IAChC,8CAA8C;IAC9C,QAAQ,EAAE,OAAO,CAAC;IAClB,qEAAqE;IACrE,SAAS,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,UAAU,mBAAmB;IAC3B,WAAW,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAChC,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC7B,iDAAiD;IACjD,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,uEAAuE;IACvE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,IAAI,CAAC;IAC7C,0EAA0E;IAC1E,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAYD,UAAU,eAAe;IACvB,WAAW,CAAC,EAAE;QAAE,aAAa,CAAC,EAAE;YAAE,CAAC,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAC;IACjD,MAAM,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAChC,aAAa,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACxC;AAED,6EAA6E;AAC7E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,eAAe,GAAG,MAAM,CAOhE;AAED,MAAM,WAAW,sBAAsB;IACrC,yCAAyC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,wEAAwE;IACxE,WAAW,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAChC,qEAAqE;IACrE,QAAQ,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC7B,KAAK,EAAE,iBAAiB,CAAC;IACzB,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,IAAI,sBAAsB,CAmDlE;AAED,6EAA6E;AAC7E,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,QAAQ,GACT,EAAE;IACD,UAAU,EAAE,sBAAsB,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;CACrB,2CAQA;AAED,8EAA8E;AAC9E,wBAAgB,eAAe,IAAI,iBAAiB,CAEnD;AAyBD;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,OAAO,UAAO;iBA+BrC,OAAO;;;;;;;EAKxC;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAEvE;AAOD;;;;;;;GAOG;AACH,wBAAgB,YAAY;iBAGM,OAAO;;EA6BxC;AAED,UAAU,eAAe;IACvB,uDAAuD;IACvD,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,6EAA6E;IAC7E,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB;AAID,oDAAoD;AACpD,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAM3F;AAED,+EAA+E;AAC/E,wBAAgB,aAAa,IAAI,eAAe,GAAG,IAAI,CAEtD;AAKD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAatE"}
+{"version":3,"file":"screenScroll.d.ts","sourceRoot":"","sources":["../../src/layouts/screenScroll.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAclD,MAAM,WAAW,iBAAiB;IAChC,8CAA8C;IAC9C,QAAQ,EAAE,OAAO,CAAC;IAClB,qEAAqE;IACrE,SAAS,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,UAAU,mBAAmB;IAC3B,WAAW,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAChC,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC7B,iDAAiD;IACjD,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,uEAAuE;IACvE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,IAAI,CAAC;IAC7C,0EAA0E;IAC1E,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAYD,UAAU,eAAe;IACvB,WAAW,CAAC,EAAE;QAAE,aAAa,CAAC,EAAE;YAAE,CAAC,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAC;IACjD,MAAM,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAChC,aAAa,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACxC;AAED,6EAA6E;AAC7E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,eAAe,GAAG,MAAM,CAOhE;AAED,MAAM,WAAW,sBAAsB;IACrC,yCAAyC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,wEAAwE;IACxE,WAAW,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAChC,qEAAqE;IACrE,QAAQ,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC7B,KAAK,EAAE,iBAAiB,CAAC;IACzB,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,IAAI,sBAAsB,CAmDlE;AAED,6EAA6E;AAC7E,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,QAAQ,GACT,EAAE;IACD,UAAU,EAAE,sBAAsB,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;CACrB,2CAQA;AAED,8EAA8E;AAC9E,wBAAgB,eAAe,IAAI,iBAAiB,CAEnD;AAyBD;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,OAAO,UAAO;iBA+BrC,OAAO;;;;;;;EAKxC;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAEvE;AAOD;;;;;;;GAOG;AACH,wBAAgB,YAAY;iBAGM,OAAO;;EA6BxC;AAED,UAAU,eAAe;IACvB,uDAAuD;IACvD,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,6EAA6E;IAC7E,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB;AAID,oDAAoD;AACpD,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAM3F;AAED,+EAA+E;AAC/E,wBAAgB,aAAa,IAAI,eAAe,GAAG,IAAI,CAEtD;AAED;;;;;GAKG;AACH,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IAC1D,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,mBAAmB,GAAG,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;AAIlF,8EAA8E;AAC9E,wBAAgB,qBAAqB,IAAI;IACvC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACjC,QAAQ,EAAE,mBAAmB,CAAC;CAC/B,CAkBA;AAED,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,QAAQ,EAAE,SAAS,CAAC;CACrB,2CAMA;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,OAAO,QAajF;AAKD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAatE"}

package/types/layouts/sidebar.d.ts

@@ -56,6 +56,36 @@ export interface SidebarProps {
      */
     footer?: React.ReactNode;
     testID?: string;
+    /** Pinned above the rows, outside their scroll (an app's name in a shell rail). */
+    header?: React.ReactNode;
+    /** Stacked under the sections inside the same scroll (a page's panel, LC-101). */
+    children?: React.ReactNode;
+    /**
+     * Paint the column in the translucent sidebar material instead of the card
+     * surface (the HIG source list): an app shell's sidebar.
+     */
+    material?: boolean;
 }
-export declare function Sidebar({ sections, width, "aria-label": ariaLabel, role, divider, footer, testID, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * The ramp step the sidebar material paints: darker than the page in light,
+ * lighter in dark, as the HIG sidebar reads against its content. The dark
+ * ramp climbs slower at its low end, so it takes one step more.
+ */
+export declare const sidebarMaterial: {
+    readonly light: "$color3";
+    readonly dark: "$color4";
+};
+/**
+ * How much of the page shows through the material. The shell's column sits
+ * beside its content, never over it, so the page ground is all that is
+ * behind it and a blur would paint nothing (LC-206).
+ */
+export declare const sidebarMaterialOpacity = 0.72;
+/**
+ * A material rail's inset from its edges. Its rows are inset pills with no
+ * rule between them (the HIG source list); a header or footer lines up with
+ * the rows by it.
+ */
+export declare const sidebarRailInset = "$2";
+export declare function Sidebar({ sections, width, "aria-label": ariaLabel, role, divider, footer, testID, header, children, material, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=sidebar.d.ts.map

package/types/layouts/sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../src/layouts/sidebar.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,8DAA8D;IAC9D,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,2FAA2F;IAC3F,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,wCAAwC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,YAAY,GAAG,eAAe,CAAC;IACtC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,KAAW,EACX,YAAY,EAAE,SAAqB,EACnC,IAAmB,EACnB,OAAc,EACd,MAAM,EACN,MAAM,GACP,EAAE,YAAY,2CAyPd"}
+{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../src/layouts/sidebar.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,8DAA8D;IAC9D,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,2FAA2F;IAC3F,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,wCAAwC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,YAAY,GAAG,eAAe,CAAC;IACtC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mFAAmF;IACnF,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,eAAe;;;CAAiD,CAAC;AAC9E;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,OAAO,CAAC;AAC3C;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,OAAO,CAAC;AAcrC,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,KAAW,EACX,YAAY,EAAE,SAAqB,EACnC,IAAmB,EACnB,OAAc,EACd,MAAM,EACN,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAgB,GACjB,EAAE,YAAY,2CAkRd"}