@12-apps/ui 6.74.2 → 6.76.0

package/dist/_internal/components/form/Textarea/Textarea.js

@@ -1,6 +1,6 @@
 import {
   Textarea
-} from "../../../../chunk-X47MWURD.js";
+} from "../../../../chunk-Q6MZHT2F.js";
 import "../../../../chunk-IPC426NS.js";
 import "../../../../chunk-RGVNXES5.js";
 import "../../../../chunk-GDN2LUTZ.js";

package/dist/_internal/components/form/index.js

@@ -2,7 +2,7 @@ import "../../../chunk-BOWS4U6W.js";
 import "../../../chunk-BH5GSBR3.js";
 import {
   Textarea
-} from "../../../chunk-X47MWURD.js";
+} from "../../../chunk-Q6MZHT2F.js";
 import "../../../chunk-IPC426NS.js";
 import "../../../chunk-6I3TYKE2.js";
 import {

package/dist/_internal/components/index.js

@@ -130,13 +130,13 @@ import "../../chunk-3AIRFAI3.js";
 import "../../chunk-R26KYJHK.js";
 import {
   SectionNav
-} from "../../chunk-27F2VXS4.js";
+} from "../../chunk-7IXXASQ6.js";
 import "../../chunk-SNWCT6JN.js";
 import "../../chunk-ILJ3FXIC.js";
 import {
   sectionNavBarInset
-} from "../../chunk-URSYEHPU.js";
-import "../../chunk-NM46HQSW.js";
+} from "../../chunk-PMRLFNBT.js";
+import "../../chunk-J26ZWYQI.js";
 import {
   RaisedActionButton
 } from "../../chunk-UKUGSU3Y.js";
@@ -201,7 +201,7 @@ import {
   Drawer,
   DrawerContent,
   DrawerHeader
-} from "../../chunk-UALPKKAY.js";
+} from "../../chunk-F742IMLQ.js";
 import "../../chunk-ENORM6S2.js";
 import {
   Resizable
@@ -219,7 +219,7 @@ import "../../chunk-QUWK7SYN.js";
 import "../../chunk-BH5GSBR3.js";
 import {
   Textarea
-} from "../../chunk-X47MWURD.js";
+} from "../../chunk-Q6MZHT2F.js";
 import "../../chunk-IPC426NS.js";
 import "../../chunk-6I3TYKE2.js";
 import {

package/dist/_internal/components/layout/Drawer/Drawer.js

@@ -2,7 +2,7 @@ import {
   Drawer,
   DrawerContent,
   DrawerHeader
-} from "../../../../chunk-UALPKKAY.js";
+} from "../../../../chunk-F742IMLQ.js";
 import "../../../../chunk-XJAD6E3V.js";
 import "../../../../chunk-F5H2ZXST.js";
 import "../../../../chunk-N3GAFIXG.js";

package/dist/_internal/components/layout/SettingsLayout/SettingsLayout.items.js

@@ -2,9 +2,9 @@
 import {
   SettingsRailGroup,
   SettingsRailItem
-} from "../../../../chunk-V5EWCJBT.js";
-import "../../../../chunk-DBFRCTI5.js";
-import "../../../../chunk-NYFNF7I5.js";
+} from "../../../../chunk-4BLVVMY7.js";
+import "../../../../chunk-7Y2VWMGS.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {

package/dist/_internal/components/layout/SettingsLayout/SettingsLayout.js

@@ -1,16 +1,16 @@
 "use client";
 import {
   SettingsLayout
-} from "../../../../chunk-OKYYHBGS.js";
+} from "../../../../chunk-6KM3TL4Q.js";
 import "../../../../chunk-BXC6GRLE.js";
-import "../../../../chunk-KKVM723A.js";
-import "../../../../chunk-F3Q4CMRB.js";
+import "../../../../chunk-LY5I3ZSV.js";
+import "../../../../chunk-GBVNY2LG.js";
 import "../../../../chunk-AJUSBPWG.js";
-import "../../../../chunk-TNYKM4UU.js";
-import "../../../../chunk-V5EWCJBT.js";
-import "../../../../chunk-DBFRCTI5.js";
-import "../../../../chunk-6KEXHOIF.js";
-import "../../../../chunk-NYFNF7I5.js";
+import "../../../../chunk-SWQXAUUG.js";
+import "../../../../chunk-4BLVVMY7.js";
+import "../../../../chunk-7Y2VWMGS.js";
+import "../../../../chunk-WOXNVM52.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-HPK33ACY.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";

package/dist/_internal/components/layout/SettingsLayout/SettingsLayout.rail.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   SettingsRail
-} from "../../../../chunk-TNYKM4UU.js";
-import "../../../../chunk-V5EWCJBT.js";
-import "../../../../chunk-DBFRCTI5.js";
-import "../../../../chunk-NYFNF7I5.js";
+} from "../../../../chunk-SWQXAUUG.js";
+import "../../../../chunk-4BLVVMY7.js";
+import "../../../../chunk-7Y2VWMGS.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {

package/dist/_internal/components/layout/SettingsLayout/SettingsLayout.styles.js

@@ -4,8 +4,9 @@ import {
   TOUCH_TARGET,
   atLeastRail,
   displayAcrossRail,
+  railCardWidth,
   railWidth
-} from "../../../../chunk-NYFNF7I5.js";
+} from "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {
@@ -14,6 +15,7 @@ export {
   TOUCH_TARGET,
   atLeastRail,
   displayAcrossRail,
+  railCardWidth,
   railWidth
 };
 //# sourceMappingURL=SettingsLayout.styles.js.map

package/dist/_internal/components/layout/SettingsLayout/SettingsPanel.js

@@ -1,12 +1,12 @@
 "use client";
 import {
   SettingsPanel
-} from "../../../../chunk-KKVM723A.js";
-import "../../../../chunk-F3Q4CMRB.js";
+} from "../../../../chunk-LY5I3ZSV.js";
+import "../../../../chunk-GBVNY2LG.js";
 import "../../../../chunk-AJUSBPWG.js";
-import "../../../../chunk-DBFRCTI5.js";
-import "../../../../chunk-6KEXHOIF.js";
-import "../../../../chunk-NYFNF7I5.js";
+import "../../../../chunk-7Y2VWMGS.js";
+import "../../../../chunk-WOXNVM52.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {

package/dist/_internal/components/layout/SettingsLayout/SettingsSectionChips.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   SettingsSectionChips
-} from "../../../../chunk-F3Q4CMRB.js";
+} from "../../../../chunk-GBVNY2LG.js";
 import "../../../../chunk-AJUSBPWG.js";
-import "../../../../chunk-DBFRCTI5.js";
-import "../../../../chunk-NYFNF7I5.js";
+import "../../../../chunk-7Y2VWMGS.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {

package/dist/_internal/components/layout/SettingsLayout/SettingsSectionHeader.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   SettingsSectionHeader
-} from "../../../../chunk-6KEXHOIF.js";
-import "../../../../chunk-NYFNF7I5.js";
+} from "../../../../chunk-WOXNVM52.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {

package/dist/_internal/components/layout/SettingsLayout/SettingsStatusMarker.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   SettingsStatusMarker
-} from "../../../../chunk-DBFRCTI5.js";
-import "../../../../chunk-NYFNF7I5.js";
+} from "../../../../chunk-7Y2VWMGS.js";
+import "../../../../chunk-NK4T624E.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {

package/dist/_internal/components/layout/index.js

@@ -58,7 +58,7 @@ import {
   Drawer,
   DrawerContent,
   DrawerHeader
-} from "../../../chunk-UALPKKAY.js";
+} from "../../../chunk-F742IMLQ.js";
 import "../../../chunk-ENORM6S2.js";
 import {
   Resizable

package/dist/_internal/components/navigation/SectionNav/SectionNav.bar.js

@@ -2,13 +2,13 @@ import {
   SectionNavBar,
   sectionNavBarInset,
   sectionNavSheetOffset
-} from "../../../../chunk-URSYEHPU.js";
-import "../../../../chunk-NM46HQSW.js";
+} from "../../../../chunk-PMRLFNBT.js";
+import "../../../../chunk-J26ZWYQI.js";
 import "../../../../chunk-UKUGSU3Y.js";
 import "../../../../chunk-24HHUCWB.js";
 import "../../../../chunk-YCCWJ5XQ.js";
 import "../../../../chunk-TMSWLFL4.js";
-import "../../../../chunk-UALPKKAY.js";
+import "../../../../chunk-F742IMLQ.js";
 import "../../../../chunk-PUFA7FQ7.js";
 import "../../../../chunk-5AK2EZG5.js";
 import "../../../../chunk-N5PVD4J5.js";

package/dist/_internal/components/navigation/SectionNav/SectionNav.js

@@ -1,15 +1,15 @@
 import {
   SectionNav
-} from "../../../../chunk-27F2VXS4.js";
+} from "../../../../chunk-7IXXASQ6.js";
 import "../../../../chunk-SNWCT6JN.js";
 import "../../../../chunk-ILJ3FXIC.js";
-import "../../../../chunk-URSYEHPU.js";
-import "../../../../chunk-NM46HQSW.js";
+import "../../../../chunk-PMRLFNBT.js";
+import "../../../../chunk-J26ZWYQI.js";
 import "../../../../chunk-UKUGSU3Y.js";
 import "../../../../chunk-24HHUCWB.js";
 import "../../../../chunk-YCCWJ5XQ.js";
 import "../../../../chunk-TMSWLFL4.js";
-import "../../../../chunk-UALPKKAY.js";
+import "../../../../chunk-F742IMLQ.js";
 import "../../../../chunk-PUFA7FQ7.js";
 import "../../../../chunk-5AK2EZG5.js";
 import "../../../../chunk-N5PVD4J5.js";

package/dist/_internal/components/navigation/SectionNav/SectionNav.sheet.js

@@ -1,10 +1,10 @@
 import {
   SectionNavSheet
-} from "../../../../chunk-NM46HQSW.js";
+} from "../../../../chunk-J26ZWYQI.js";
 import "../../../../chunk-24HHUCWB.js";
 import "../../../../chunk-YCCWJ5XQ.js";
 import "../../../../chunk-TMSWLFL4.js";
-import "../../../../chunk-UALPKKAY.js";
+import "../../../../chunk-F742IMLQ.js";
 import "../../../../chunk-PUFA7FQ7.js";
 import "../../../../chunk-5AK2EZG5.js";
 import "../../../../chunk-N5PVD4J5.js";

package/dist/_internal/components/navigation/index.js

@@ -54,20 +54,20 @@ import "../../../chunk-3AIRFAI3.js";
 import "../../../chunk-R26KYJHK.js";
 import {
   SectionNav
-} from "../../../chunk-27F2VXS4.js";
+} from "../../../chunk-7IXXASQ6.js";
 import "../../../chunk-SNWCT6JN.js";
 import "../../../chunk-ILJ3FXIC.js";
 import {
   sectionNavBarInset
-} from "../../../chunk-URSYEHPU.js";
-import "../../../chunk-NM46HQSW.js";
+} from "../../../chunk-PMRLFNBT.js";
+import "../../../chunk-J26ZWYQI.js";
 import {
   RaisedActionButton
 } from "../../../chunk-UKUGSU3Y.js";
 import "../../../chunk-24HHUCWB.js";
 import "../../../chunk-YCCWJ5XQ.js";
 import "../../../chunk-TMSWLFL4.js";
-import "../../../chunk-UALPKKAY.js";
+import "../../../chunk-F742IMLQ.js";
 import "../../../chunk-7K23NEZO.js";
 import "../../../chunk-5MMAV7XK.js";
 import "../../../chunk-3ROCD7XF.js";

package/dist/{chunk-V5EWCJBT.js → chunk-4BLVVMY7.js}

@@ -1,10 +1,10 @@
 import {
   SettingsStatusMarker
-} from "./chunk-DBFRCTI5.js";
+} from "./chunk-7Y2VWMGS.js";
 import {
   TOUCH_TARGET,
   atLeastRail
-} from "./chunk-NYFNF7I5.js";
+} from "./chunk-NK4T624E.js";
 import {
   rem
 } from "./chunk-YKCAJ2TN.js";
@@ -169,4 +169,4 @@ export {
   SettingsRailItem,
   SettingsRailGroup
 };
-//# sourceMappingURL=chunk-V5EWCJBT.js.map
+//# sourceMappingURL=chunk-4BLVVMY7.js.map

package/dist/{chunk-OKYYHBGS.js → chunk-6KM3TL4Q.js}

@@ -4,13 +4,13 @@ import {
 } from "./chunk-BXC6GRLE.js";
 import {
   SettingsPanel
-} from "./chunk-KKVM723A.js";
+} from "./chunk-LY5I3ZSV.js";
 import {
   SettingsRail
-} from "./chunk-TNYKM4UU.js";
+} from "./chunk-SWQXAUUG.js";
 import {
   atLeastRail
-} from "./chunk-NYFNF7I5.js";
+} from "./chunk-NK4T624E.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -29,6 +29,12 @@ var DEFAULTS = {
   atIndex: false,
   backLabel: "Back"
 };
+function railLookOf({
+  searchable = true,
+  railVariant = "divided"
+}) {
+  return { searchable, railVariant };
+}
 function shellSx(breakpoint, fillHeight) {
   return (theme) => ({
     display: "flex",
@@ -101,6 +107,7 @@ var SettingsLayout = (props) => {
             onNavigate: () => setNavOpen(false),
             testIdPrefix,
             variant: navVariant,
+            ...railLookOf(props),
             breakpoint: railBreakpoint,
             atIndex,
             fillHeight
@@ -135,4 +142,4 @@ SettingsLayout.displayName = "SettingsLayout";
 export {
   SettingsLayout
 };
-//# sourceMappingURL=chunk-OKYYHBGS.js.map
+//# sourceMappingURL=chunk-6KM3TL4Q.js.map

package/dist/chunk-6KM3TL4Q.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/SettingsLayout/SettingsLayout.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\nimport type { SxProps, Theme } from '@mui/material/styles/index.js';\nimport React, { useMemo, useState } from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\nimport { activeItemLabel, filterGroups } from './SettingsLayout.filters';\nimport { SettingsRail } from './SettingsLayout.rail';\nimport { atLeastRail } from './SettingsLayout.styles';\nimport { SettingsPanel } from './SettingsPanel';\nimport type { SettingsLayoutProps } from './SettingsLayout.types';\n\n/**\n * The props with every default already applied.\n *\n * A table through `withDefaults` rather than a `= default` per destructured\n * prop: each of those is a branch, and seven of them put the component over the\n * complexity bar before it renders anything. The single cast is what buys the\n * body non-optional values — without it every use site would restate the\n * default as a `??`, which is the same default written twice and free to drift.\n */\ntype ResolvedProps = SettingsLayoutProps &\n  Required<\n    Pick<\n      SettingsLayoutProps,\n      | 'searchPlaceholder'\n      | 'defaultQuery'\n      | 'emptySearchLabel'\n      | 'testIdPrefix'\n      | 'railBreakpoint'\n      | 'navVariant'\n      | 'atIndex'\n      | 'backLabel'\n    >\n  >;\n\nconst DEFAULTS = {\n  searchPlaceholder: 'Search settings',\n  defaultQuery: '',\n  emptySearchLabel: 'No settings match your search.',\n  testIdPrefix: 'settings',\n  railBreakpoint: 'md',\n  navVariant: 'switcher',\n  atIndex: false,\n  backLabel: 'Back',\n} satisfies Partial<SettingsLayoutProps>;\n\n/**\n * How the rail looks: its search field, and its frame from the breakpoint up.\n * Both default to the shape every consumer had before they existed.\n */\nfunction railLookOf({\n  searchable = true,\n  railVariant = 'divided',\n}: SettingsLayoutProps): Required<Pick<SettingsLayoutProps, 'searchable' | 'railVariant'>> {\n  return { searchable, railVariant };\n}\n\n/** Stacked below the rail's breakpoint, two columns at and above it. */\nfunction shellSx(breakpoint: SettingsLayoutProps['railBreakpoint'], fillHeight: boolean): SxProps<Theme> {\n  return (theme: Theme) => ({\n    display: 'flex',\n    flexDirection: 'column' as const,\n    alignItems: 'stretch',\n    gap: 1.5,\n    width: '100%',\n    minWidth: 0,\n    // Only ever at the wide shape. Narrow, the rail is a disclosure or the page\n    // itself, and two independent scrollbars on a phone is a trap rather than a\n    // convenience.\n    [atLeastRail(theme, breakpoint ?? 'md')]: {\n      flexDirection: 'row',\n      gap: 3,\n      ...(fillHeight ? { height: '100%', minHeight: 0 } : {}),\n    },\n  });\n}\n\n/**\n * A reusable, agnostic Facebook-style settings shell: a searchable left rail of\n * grouped categories/subcategories and a central panel that renders the selected\n * configuration screen (`children`). Navigation is data-driven via `groups`; the\n * host owns routing (pass `linkComponent` + item `href`, or handle `onSelectItem`).\n *\n * ## Two narrow-width shapes\n *\n * `navVariant=\"switcher\"` (the default) folds the rail into a disclosure above\n * the panel. `navVariant=\"drilldown\"` gives the phone shape instead: at the\n * area's index the LIST is the page, and inside a section the panel is the page\n * with a back link and a scrollable strip of sibling sections above it.\n *\n * ## Why the width decision is CSS and not JavaScript\n *\n * Every part that changes between the two shapes does it through a `display`\n * pair keyed on `railBreakpoint`. Nothing here asks a media query in JS and\n * renders one branch.\n *\n * That is not a performance preference. A layout that RENDERS one navigation and\n * not the other can offer the narrow width less than the wide one, and no test\n * or review catches it — the missing control simply is not in the tree to be\n * asserted about. With both forms always mounted, \"the narrow width reaches\n * everything the wide one does\" holds by construction, and an audit that counts\n * controls per width gets the same answer at both.\n */\nexport const SettingsLayout: React.FC<SettingsLayoutProps> = (props) => {\n  const {\n    title,\n    groups,\n    activeItemId,\n    onSelectItem,\n    searchPlaceholder,\n    defaultQuery,\n    emptySearchLabel,\n    emptySearchAction,\n    linkComponent,\n    children,\n    testIdPrefix,\n    railBreakpoint,\n    fillHeight = false,\n    navVariant,\n    atIndex,\n    indexHref,\n    backLabel,\n    sectionChips,\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n  const [query, setQuery] = useState(defaultQuery);\n  const [navOpen, setNavOpen] = useState(false);\n  const filteredGroups = useMemo(() => filterGroups(groups, query), [groups, query]);\n  const activeLabel = useMemo(() => activeItemLabel(groups, activeItemId), [groups, activeItemId]);\n\n  const drilldown = navVariant === 'drilldown';\n  const ariaLabel = typeof title === 'string' ? title : 'Settings';\n\n  return (\n    <Box\n      data-testid={testIdPrefix}\n      data-nav-variant={navVariant}\n      data-at-index={atIndex ? 'true' : 'false'}\n      sx={shellSx(railBreakpoint, fillHeight)}\n    >\n      <SettingsRail\n        title={title}\n        activeLabel={activeLabel}\n        navOpen={navOpen}\n        onToggleNav={() => setNavOpen((open) => !open)}\n        query={query}\n        onQueryChange={setQuery}\n        searchPlaceholder={searchPlaceholder}\n        emptySearchLabel={emptySearchLabel}\n        emptySearchAction={emptySearchAction}\n        filteredGroups={filteredGroups}\n        activeItemId={activeItemId}\n        linkComponent={linkComponent}\n        onSelectItem={onSelectItem}\n        onNavigate={() => setNavOpen(false)}\n        testIdPrefix={testIdPrefix}\n        variant={navVariant}\n        {...railLookOf(props)}\n        breakpoint={railBreakpoint}\n        atIndex={atIndex}\n        fillHeight={fillHeight}\n      />\n\n      <SettingsPanel\n        inSection={drilldown && !atIndex}\n        hideOnNarrow={drilldown && atIndex}\n        breakpoint={railBreakpoint}\n        indexHref={indexHref}\n        sectionTitle={props.sectionTitle}\n        sectionDescription={props.sectionDescription}\n        backLabel={backLabel}\n        ariaLabel={ariaLabel}\n        sectionChips={sectionChips}\n        activeItemId={activeItemId}\n        linkComponent={linkComponent}\n        onSelectItem={onSelectItem}\n        testIdPrefix={testIdPrefix}\n        fillHeight={fillHeight}\n      >\n        {children}\n      </SettingsPanel>\n    </Box>\n  );\n};\n\nSettingsLayout.displayName = 'SettingsLayout';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAEA,OAAO,SAAS;AAEhB,SAAgB,SAAS,gBAAgB;AAmIrC,SAME,KANF;AAlGJ,IAAM,WAAW;AAAA,EACf,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AACb;AAMA,SAAS,WAAW;AAAA,EAClB,aAAa;AAAA,EACb,cAAc;AAChB,GAA2F;AACzF,SAAO,EAAE,YAAY,YAAY;AACnC;AAGA,SAAS,QAAQ,YAAmD,YAAqC;AACvG,SAAO,CAAC,WAAkB;AAAA,IACxB,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,OAAO;AAAA,IACP,UAAU;AAAA;AAAA;AAAA;AAAA,IAIV,CAAC,YAAY,OAAO,cAAc,IAAI,CAAC,GAAG;AAAA,MACxC,eAAe;AAAA,MACf,KAAK;AAAA,MACL,GAAI,aAAa,EAAE,QAAQ,QAAQ,WAAW,EAAE,IAAI,CAAC;AAAA,IACvD;AAAA,EACF;AACF;AA4BO,IAAM,iBAAgD,CAAC,UAAU;AACtE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,aAAa,OAAO,QAAQ;AAChC,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,YAAY;AAC/C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,iBAAiB,QAAQ,MAAM,aAAa,QAAQ,KAAK,GAAG,CAAC,QAAQ,KAAK,CAAC;AACjF,QAAM,cAAc,QAAQ,MAAM,gBAAgB,QAAQ,YAAY,GAAG,CAAC,QAAQ,YAAY,CAAC;AAE/F,QAAM,YAAY,eAAe;AACjC,QAAM,YAAY,OAAO,UAAU,WAAW,QAAQ;AAEtD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACb,oBAAkB;AAAA,MAClB,iBAAe,UAAU,SAAS;AAAA,MAClC,IAAI,QAAQ,gBAAgB,UAAU;AAAA,MAEtC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,aAAa,MAAM,WAAW,CAAC,SAAS,CAAC,IAAI;AAAA,YAC7C;AAAA,YACA,eAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,YAAY,MAAM,WAAW,KAAK;AAAA,YAClC;AAAA,YACA,SAAS;AAAA,YACR,GAAG,WAAW,KAAK;AAAA,YACpB,YAAY;AAAA,YACZ;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,aAAa,CAAC;AAAA,YACzB,cAAc,aAAa;AAAA,YAC3B,YAAY;AAAA,YACZ;AAAA,YACA,cAAc,MAAM;AAAA,YACpB,oBAAoB,MAAM;AAAA,YAC1B;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;","names":[]}

package/dist/{chunk-27F2VXS4.js → chunk-7IXXASQ6.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-SNWCT6JN.js";
 import {
   SectionNavBar
-} from "./chunk-URSYEHPU.js";
+} from "./chunk-PMRLFNBT.js";
 
 // src/components/navigation/SectionNav/SectionNav.tsx
 import { jsx } from "react/jsx-runtime";
@@ -55,4 +55,4 @@ function SectionNav({
 export {
   SectionNav
 };
-//# sourceMappingURL=chunk-27F2VXS4.js.map
+//# sourceMappingURL=chunk-7IXXASQ6.js.map

package/dist/{chunk-DBFRCTI5.js → chunk-7Y2VWMGS.js}

@@ -1,7 +1,7 @@
 import {
   SR_ONLY_SX,
   STATUS_COLOR
-} from "./chunk-NYFNF7I5.js";
+} from "./chunk-NK4T624E.js";
 import {
   sxRem
 } from "./chunk-YKCAJ2TN.js";
@@ -62,4 +62,4 @@ SettingsStatusMarker.displayName = "SettingsStatusMarker";
 export {
   SettingsStatusMarker
 };
-//# sourceMappingURL=chunk-DBFRCTI5.js.map
+//# sourceMappingURL=chunk-7Y2VWMGS.js.map

package/dist/{chunk-UALPKKAY.js → chunk-F742IMLQ.js}

@@ -122,7 +122,10 @@ var DrawerHeader = ({
       sx: {
         display: "flex",
         alignItems: "center",
-        padding: theme.spacing(2),
+        // 12px above and below: the close button is 40px tall, so the header lands on
+        // its own 64px minimum instead of 72 — the height of the page header beside
+        // a docked drawer (FUT-3476).
+        padding: theme.spacing(1.5, 2),
         borderBottom: `1px solid ${theme.palette.divider}`,
         minHeight: rem(theme, 64),
         justifyContent: "space-between"
@@ -164,4 +167,4 @@ export {
   DrawerHeader,
   DrawerContent
 };
-//# sourceMappingURL=chunk-UALPKKAY.js.map
+//# sourceMappingURL=chunk-F742IMLQ.js.map

package/dist/{chunk-UALPKKAY.js.map → chunk-F742IMLQ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/layout/Drawer/Drawer.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport MuiDrawer from '@mui/material/Drawer/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type { DrawerContentProps,DrawerHeaderProps, DrawerProps } from './Drawer.types';\nimport { shadowInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\n\ntype DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';\n\n/**\n * A `width`/`height` prop as CSS. `sx` reads a number of 1 or less as a\n * fraction of the parent, and that stays so; any other number is design px,\n * through the type scale; a string is as given.\n */\nconst drawerLength = (theme: Theme, value: number | string | undefined): string | undefined => {\n  if (typeof value !== 'number') return value;\n  return value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);\n};\n\n// `variant` doubles as a position preset, but an explicit `anchor` always wins.\nconst resolveAnchor = (\n  anchor: DrawerProps['anchor'],\n  variant: DrawerProps['variant'],\n): DrawerAnchor => {\n  if (anchor) return anchor;\n\n  // Map variant to anchor position\n  switch (variant) {\n    case 'right':\n      return 'right';\n    case 'top':\n      return 'top';\n    case 'bottom':\n      return 'bottom';\n    case 'glass':\n      return 'right';\n    case 'left':\n    default:\n      return 'left';\n  }\n};\n\nconst buildDrawerStyles = (\n  theme: Theme,\n  anchor: DrawerAnchor,\n  variant: DrawerProps['variant'],\n  width: DrawerProps['width'],\n  height: DrawerProps['height'],\n  // Merged LAST into the surface's own rules, so a caller can shape the sliding\n  // surface itself (rounded corners on a bottom sheet, a docked panel's offset)\n  // without reaching for the MUI paper class from outside. Undefined by default:\n  // omit it and the drawer styles exactly as it always has.\n  paperSx?: DrawerProps['paperSx'],\n) => {\n  const widthCss = drawerLength(theme, width);\n  const heightCss = drawerLength(theme, height);\n  const baseStyles = {\n    width: ['left', 'right'].includes(anchor) ? widthCss : '100%',\n    height: ['top', 'bottom'].includes(anchor) ? heightCss : '100%',\n    flexShrink: 0,\n  };\n\n  if (variant === 'glass') {\n    return {\n      ...baseStyles,\n      '& .MuiDrawer-paper': {\n        width: widthCss,\n        height: '100%',\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: `blur(${rem(theme, 20)})`,\n        border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n        boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.1)}`,\n        ...paperSx,\n      },\n    };\n  }\n\n  return {\n    ...baseStyles,\n    '& .MuiDrawer-paper': {\n      width: ['left', 'right'].includes(anchor) ? widthCss : '100%',\n      height: ['top', 'bottom'].includes(anchor) ? heightCss : '100%',\n      boxSizing: 'border-box',\n      ...paperSx,\n    },\n  };\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n  children,\n  open,\n  onClose,\n  variant = 'left',\n  anchor,\n  width,\n  height = '100%',\n  persistent = false,\n  backdrop = true,\n  hideBackdrop = false,\n  keepMounted = false,\n  paperSx,\n  className,\n  dataTestId,\n  ...rest\n}) => {\n  const theme = useTheme();\n  const drawerAnchor = resolveAnchor(anchor, variant);\n\n  return (\n    <MuiDrawer\n      anchor={drawerAnchor}\n      open={open}\n      onClose={onClose}\n      variant={persistent ? 'persistent' : 'temporary'}\n      ModalProps={{\n        keepMounted,\n        hideBackdrop,\n        BackdropProps: {\n          invisible: !backdrop,\n        },\n      }}\n      sx={buildDrawerStyles(theme, drawerAnchor, variant, width ?? 280, height, paperSx)}\n      className={className}\n      data-testid={dataTestId || 'drawer'}\n      {...rest}\n    >\n      {children}\n    </MuiDrawer>\n  );\n};\n\nexport const DrawerHeader: React.FC<DrawerHeaderProps> = ({\n  children,\n  onClose,\n  showCloseButton = true,\n  closeLabel,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-header'}\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        padding: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        minHeight: rem(theme, 64),\n        justifyContent: 'space-between',\n      }}\n    >\n      <Box sx={{ flex: 1 }} data-testid={dataTestId ? `${dataTestId}-title` : 'drawer-title'}>\n        {typeof children === 'string' ? <Typography variant=\"h6\">{children}</Typography> : children}\n      </Box>\n      {showCloseButton && onClose && (\n        <IconButton\n          onClick={onClose}\n          edge=\"end\"\n          aria-label={closeLabel ?? 'Close drawer'}\n          data-testid={dataTestId ? `${dataTestId}-close` : 'drawer-close'}\n        >\n          <Close />\n        </IconButton>\n      )}\n    </Box>\n  );\n};\n\nexport const DrawerContent: React.FC<DrawerContentProps> = ({ children, padding = true, dataTestId }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-content'}\n      sx={{\n        flex: 1,\n        overflow: 'auto',\n        padding: padding ? theme.spacing(2) : 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/components/layout/Drawer/Drawer.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport MuiDrawer from '@mui/material/Drawer/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type { DrawerContentProps,DrawerHeaderProps, DrawerProps } from './Drawer.types';\nimport { shadowInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\n\ntype DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';\n\n/**\n * A `width`/`height` prop as CSS. `sx` reads a number of 1 or less as a\n * fraction of the parent, and that stays so; any other number is design px,\n * through the type scale; a string is as given.\n */\nconst drawerLength = (theme: Theme, value: number | string | undefined): string | undefined => {\n  if (typeof value !== 'number') return value;\n  return value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);\n};\n\n// `variant` doubles as a position preset, but an explicit `anchor` always wins.\nconst resolveAnchor = (\n  anchor: DrawerProps['anchor'],\n  variant: DrawerProps['variant'],\n): DrawerAnchor => {\n  if (anchor) return anchor;\n\n  // Map variant to anchor position\n  switch (variant) {\n    case 'right':\n      return 'right';\n    case 'top':\n      return 'top';\n    case 'bottom':\n      return 'bottom';\n    case 'glass':\n      return 'right';\n    case 'left':\n    default:\n      return 'left';\n  }\n};\n\nconst buildDrawerStyles = (\n  theme: Theme,\n  anchor: DrawerAnchor,\n  variant: DrawerProps['variant'],\n  width: DrawerProps['width'],\n  height: DrawerProps['height'],\n  // Merged LAST into the surface's own rules, so a caller can shape the sliding\n  // surface itself (rounded corners on a bottom sheet, a docked panel's offset)\n  // without reaching for the MUI paper class from outside. Undefined by default:\n  // omit it and the drawer styles exactly as it always has.\n  paperSx?: DrawerProps['paperSx'],\n) => {\n  const widthCss = drawerLength(theme, width);\n  const heightCss = drawerLength(theme, height);\n  const baseStyles = {\n    width: ['left', 'right'].includes(anchor) ? widthCss : '100%',\n    height: ['top', 'bottom'].includes(anchor) ? heightCss : '100%',\n    flexShrink: 0,\n  };\n\n  if (variant === 'glass') {\n    return {\n      ...baseStyles,\n      '& .MuiDrawer-paper': {\n        width: widthCss,\n        height: '100%',\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: `blur(${rem(theme, 20)})`,\n        border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n        boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.1)}`,\n        ...paperSx,\n      },\n    };\n  }\n\n  return {\n    ...baseStyles,\n    '& .MuiDrawer-paper': {\n      width: ['left', 'right'].includes(anchor) ? widthCss : '100%',\n      height: ['top', 'bottom'].includes(anchor) ? heightCss : '100%',\n      boxSizing: 'border-box',\n      ...paperSx,\n    },\n  };\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n  children,\n  open,\n  onClose,\n  variant = 'left',\n  anchor,\n  width,\n  height = '100%',\n  persistent = false,\n  backdrop = true,\n  hideBackdrop = false,\n  keepMounted = false,\n  paperSx,\n  className,\n  dataTestId,\n  ...rest\n}) => {\n  const theme = useTheme();\n  const drawerAnchor = resolveAnchor(anchor, variant);\n\n  return (\n    <MuiDrawer\n      anchor={drawerAnchor}\n      open={open}\n      onClose={onClose}\n      variant={persistent ? 'persistent' : 'temporary'}\n      ModalProps={{\n        keepMounted,\n        hideBackdrop,\n        BackdropProps: {\n          invisible: !backdrop,\n        },\n      }}\n      sx={buildDrawerStyles(theme, drawerAnchor, variant, width ?? 280, height, paperSx)}\n      className={className}\n      data-testid={dataTestId || 'drawer'}\n      {...rest}\n    >\n      {children}\n    </MuiDrawer>\n  );\n};\n\nexport const DrawerHeader: React.FC<DrawerHeaderProps> = ({\n  children,\n  onClose,\n  showCloseButton = true,\n  closeLabel,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-header'}\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        // 12px above and below: the close button is 40px tall, so the header lands on\n        // its own 64px minimum instead of 72 — the height of the page header beside\n        // a docked drawer (FUT-3476).\n        padding: theme.spacing(1.5, 2),\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        minHeight: rem(theme, 64),\n        justifyContent: 'space-between',\n      }}\n    >\n      <Box sx={{ flex: 1 }} data-testid={dataTestId ? `${dataTestId}-title` : 'drawer-title'}>\n        {typeof children === 'string' ? <Typography variant=\"h6\">{children}</Typography> : children}\n      </Box>\n      {showCloseButton && onClose && (\n        <IconButton\n          onClick={onClose}\n          edge=\"end\"\n          aria-label={closeLabel ?? 'Close drawer'}\n          data-testid={dataTestId ? `${dataTestId}-close` : 'drawer-close'}\n        >\n          <Close />\n        </IconButton>\n      )}\n    </Box>\n  );\n};\n\nexport const DrawerContent: React.FC<DrawerContentProps> = ({ children, padding = true, dataTestId }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-content'}\n      sx={{\n        flex: 1,\n        overflow: 'auto',\n        padding: padding ? theme.spacing(2) : 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-F3Q4CMRB.js → chunk-GBVNY2LG.js}

@@ -5,10 +5,10 @@ import {
 } from "./chunk-AJUSBPWG.js";
 import {
   SettingsStatusMarker
-} from "./chunk-DBFRCTI5.js";
+} from "./chunk-7Y2VWMGS.js";
 import {
   TOUCH_TARGET
-} from "./chunk-NYFNF7I5.js";
+} from "./chunk-NK4T624E.js";
 import {
   rem,
   sxRem
@@ -186,4 +186,4 @@ SettingsSectionChips.displayName = "SettingsSectionChips";
 export {
   SettingsSectionChips
 };
-//# sourceMappingURL=chunk-F3Q4CMRB.js.map
+//# sourceMappingURL=chunk-GBVNY2LG.js.map

package/dist/{chunk-NM46HQSW.js → chunk-J26ZWYQI.js}

@@ -9,7 +9,7 @@ import {
   Drawer,
   DrawerContent,
   DrawerHeader
-} from "./chunk-UALPKKAY.js";
+} from "./chunk-F742IMLQ.js";
 import {
   rem
 } from "./chunk-YKCAJ2TN.js";
@@ -175,4 +175,4 @@ function SectionNavSheet({
 export {
   SectionNavSheet
 };
-//# sourceMappingURL=chunk-NM46HQSW.js.map
+//# sourceMappingURL=chunk-J26ZWYQI.js.map

package/dist/{chunk-KKVM723A.js → chunk-LY5I3ZSV.js}

@@ -1,14 +1,14 @@
 import {
   SettingsSectionChips
-} from "./chunk-F3Q4CMRB.js";
+} from "./chunk-GBVNY2LG.js";
 import {
   SettingsSectionHeader
-} from "./chunk-6KEXHOIF.js";
+} from "./chunk-WOXNVM52.js";
 import {
   TOUCH_TARGET,
   atLeastRail,
   displayAcrossRail
-} from "./chunk-NYFNF7I5.js";
+} from "./chunk-NK4T624E.js";
 import {
   rem
 } from "./chunk-YKCAJ2TN.js";
@@ -167,4 +167,4 @@ function SettingsPanel({
 export {
   SettingsPanel
 };
-//# sourceMappingURL=chunk-KKVM723A.js.map
+//# sourceMappingURL=chunk-LY5I3ZSV.js.map

package/dist/{chunk-NYFNF7I5.js → chunk-NK4T624E.js}

@@ -5,6 +5,7 @@ import {
 
 // src/components/layout/SettingsLayout/SettingsLayout.styles.ts
 var railWidth = (theme) => rem(theme, 300);
+var railCardWidth = (theme) => rem(theme, 200);
 var SR_ONLY_SX = {
   position: "absolute",
   width: sxRem(1),
@@ -31,10 +32,11 @@ var STATUS_COLOR = {
 
 export {
   railWidth,
+  railCardWidth,
   SR_ONLY_SX,
   atLeastRail,
   displayAcrossRail,
   TOUCH_TARGET,
   STATUS_COLOR
 };
-//# sourceMappingURL=chunk-NYFNF7I5.js.map
+//# sourceMappingURL=chunk-NK4T624E.js.map

package/dist/chunk-NK4T624E.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/SettingsLayout/SettingsLayout.styles.ts"],"sourcesContent":["import type { CSSObject, SxProps, Theme } from '@mui/material/styles/index.js';\n\nimport { rem, sxRem } from '../../../tokens/relative';\n\nimport type { SettingsNavStatus, SettingsRailBreakpoint } from './SettingsLayout.types';\n\n/** Fixed width of the left navigation rail once it has its own column (300 design px). */\nexport const railWidth = (theme: Theme): string => rem(theme, 300);\n\n/** Width of the rail drawn as a card (`railVariant=\"card\"`, 200 design px). */\nexport const railCardWidth = (theme: Theme): string => rem(theme, 200);\n\n/** Visually hidden, still read aloud — for text a marker's colour cannot carry. */\nexport const SR_ONLY_SX: SxProps<Theme> = {\n  position: 'absolute',\n  width: sxRem(1),\n  height: sxRem(1),\n  padding: 0,\n  margin: sxRem(-1),\n  overflow: 'hidden',\n  clip: 'rect(0, 0, 0, 0)',\n  whiteSpace: 'nowrap',\n  border: 0,\n};\n\n/**\n * The media query for \"the rail has its own column\".\n *\n * `theme.breakpoints.up` takes a NUMBER as happily as a name, which is why\n * `railBreakpoint` accepts one: a settings area whose structural switch is at\n * 1024px has no MUI breakpoint to name (the default `lg` is 1200), and rounding\n * the design to the nearest named breakpoint moves 176px of behaviour to keep a\n * string tidy.\n */\nexport function atLeastRail(theme: Theme, breakpoint: SettingsRailBreakpoint): string {\n  return theme.breakpoints.up(breakpoint);\n}\n\n/**\n * A `display` pair across that query: `narrow` below it, `wide` at and above.\n *\n * Everything that changes shape between the two navigation modes goes through\n * this, so \"which width am I?\" is answered once, in CSS, for every part at\n * once — rather than by each part asking a media query in JavaScript and\n * answering slightly differently.\n */\nexport function displayAcrossRail(\n  theme: Theme,\n  breakpoint: SettingsRailBreakpoint,\n  narrow: string,\n  wide: string,\n): CSSObject {\n  return { display: narrow, [atLeastRail(theme, breakpoint)]: { display: wide } };\n}\n\n/** Minimum touch target, in px. Held down to 320px-wide phones, deliberately. */\nexport const TOUCH_TARGET = 44;\n\n/**\n * Palette role per situation.\n *\n * Returned as theme keys rather than hex so a marker follows the host's theme —\n * and so light and dark do not need two copies of this table.\n */\nexport const STATUS_COLOR: Record<Exclude<SettingsNavStatus, 'locked'>, string> = {\n  ok: 'success.main',\n  off: 'text.disabled',\n  new: 'error.main',\n};\n"],"mappings":";;;;;;AAOO,IAAM,YAAY,CAAC,UAAyB,IAAI,OAAO,GAAG;AAG1D,IAAM,gBAAgB,CAAC,UAAyB,IAAI,OAAO,GAAG;AAG9D,IAAM,aAA6B;AAAA,EACxC,UAAU;AAAA,EACV,OAAO,MAAM,CAAC;AAAA,EACd,QAAQ,MAAM,CAAC;AAAA,EACf,SAAS;AAAA,EACT,QAAQ,MAAM,EAAE;AAAA,EAChB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,QAAQ;AACV;AAWO,SAAS,YAAY,OAAc,YAA4C;AACpF,SAAO,MAAM,YAAY,GAAG,UAAU;AACxC;AAUO,SAAS,kBACd,OACA,YACA,QACA,MACW;AACX,SAAO,EAAE,SAAS,QAAQ,CAAC,YAAY,OAAO,UAAU,CAAC,GAAG,EAAE,SAAS,KAAK,EAAE;AAChF;AAGO,IAAM,eAAe;AAQrB,IAAM,eAAqE;AAAA,EAChF,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,KAAK;AACP;","names":[]}

package/dist/{chunk-URSYEHPU.js → chunk-PMRLFNBT.js}

@@ -1,6 +1,6 @@
 import {
   SectionNavSheet
-} from "./chunk-NM46HQSW.js";
+} from "./chunk-J26ZWYQI.js";
 import {
   RaisedActionButton,
   raisedLift
@@ -327,4 +327,4 @@ export {
   sectionNavSheetOffset,
   SectionNavBar
 };
-//# sourceMappingURL=chunk-URSYEHPU.js.map
+//# sourceMappingURL=chunk-PMRLFNBT.js.map

package/dist/{chunk-X47MWURD.js → chunk-Q6MZHT2F.js}

@@ -49,11 +49,11 @@ var StyledTextarea = styled(TextareaAutosize, {
   const colorPalette = getColorFromTheme(theme, customColor);
   const errorColor = theme.palette.error;
   const sizeMap = {
-    xs: { padding: rems(theme, 6, 8), fontSize: rem(theme, 12), minHeight: rem(theme, 60) },
-    sm: { padding: rems(theme, 8, 10), fontSize: rem(theme, 14), minHeight: rem(theme, 80) },
-    md: { padding: rems(theme, 10, 12), fontSize: rem(theme, 16), minHeight: rem(theme, 100) },
-    lg: { padding: rems(theme, 12, 14), fontSize: rem(theme, 18), minHeight: rem(theme, 120) },
-    xl: { padding: rems(theme, 14, 16), fontSize: rem(theme, 20), minHeight: rem(theme, 140) }
+    xs: { padding: rems(theme, 6, 8), fontSize: rem(theme, 12) },
+    sm: { padding: rems(theme, 8, 10), fontSize: rem(theme, 14) },
+    md: { padding: rems(theme, 10, 12), fontSize: rem(theme, 16) },
+    lg: { padding: rems(theme, 12, 14), fontSize: rem(theme, 18) },
+    xl: { padding: rems(theme, 14, 16), fontSize: rem(theme, 20) }
   };
   const baseStyles = {
     width: "100%",
@@ -112,7 +112,9 @@ var TEXTAREA_DEFAULTS = {
   glass: false,
   gradient: false,
   iconPosition: "start",
-  minRows: 3
+  // Four lines of its own text, whatever the variant or size (FUT-3534); a
+  // screen that wants another height passes `minRows`.
+  minRows: 4
 };
 var definedProps = (props) => Object.fromEntries(
   Object.entries(props).filter(([, value]) => value !== void 0)
@@ -210,7 +212,7 @@ var Textarea = (textareaProps) => {
         glass,
         gradient,
         error,
-        minRows: variant === "autosize" ? minRows : void 0,
+        minRows,
         maxRows: variant === "autosize" ? maxRows : void 0,
         style: textareaStyle,
         "aria-label": label || props["aria-label"],
@@ -225,4 +227,4 @@ Textarea.displayName = "Textarea";
 export {
   Textarea
 };
-//# sourceMappingURL=chunk-X47MWURD.js.map
+//# sourceMappingURL=chunk-Q6MZHT2F.js.map