@cimpress-ui/react 1.28.0 → 1.30.0

package/dist/commonjs/components/app-header/app-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"app-header.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQtE,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAMpF,MAAM,WAAW,uBAAwB,SAAQ,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;CAAG;AAEzF,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,sGAAsG;IACtG,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,SAAS,EAAE,IAAI,GAAG,uBAAuB,CAAC;IAC1C,oDAAoD;IACpD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B;AAiED;;;;GAIG;AACH,QAAA,MAAM,UAAU,+GAAqC,CAAC;AAEtD,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
+{"version":3,"file":"app-header.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQtE,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAMpF,MAAM,WAAW,uBAAwB,SAAQ,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;CAAG;AAEzF,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,sGAAsG;IACtG,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,SAAS,EAAE,IAAI,GAAG,uBAAuB,CAAC;IAC1C,oDAAoD;IACpD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B;AAqED;;;;GAIG;AACH,QAAA,MAAM,UAAU,+GAAqC,CAAC;AAEtD,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}

package/dist/commonjs/components/app-header/app-header.js

@@ -23,7 +23,7 @@ function AppHeader({ title, titleLink, tools, UNSTABLE_navButton: navButton, UNS
     const isMobile = (0, use_is_mobile_js_1.useIsMobile)();
     const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
     const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };
-    return ((0, jsx_runtime_1.jsxs)("header", { ...props, ref: ref, className: (0, clsx_1.default)('cim-app-header', UNSAFE_className), style: UNSAFE_style, "data-react-aria-top-layer": appShellContext?.sideNavIsOpen || undefined, children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-app-header-title", children: [navButton !== undefined ? navButton : appShellContext ? (0, jsx_runtime_1.jsx)(nav_button_js_1.UNSTABLE_AppHeaderNavButton, {}) : null, (0, jsx_runtime_1.jsx)(cimpress_logo_js_1.CimpressLogo, { height: 24 }), (0, jsx_runtime_1.jsx)(divider_js_1.Divider, { orientation: "vertical" }), (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "h1", variant: "title-5", tone: "base", children: (0, jsx_runtime_1.jsx)(link_js_1.Link, { ...titleLinkProps, UNSAFE_className: "cim-app-header-title-link", children: title }) }), postTitle] }), search && (0, jsx_runtime_1.jsx)("div", { className: "cim-app-header-search", children: search }), (0, jsx_runtime_1.jsx)("div", { className: "cim-app-header-tools", children: isMobile && tools ? ((0, jsx_runtime_1.jsxs)(popover_js_1.PopoverRoot, { children: [(0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { icon: (0, jsx_runtime_1.jsx)(index_js_1.IconMenuMoreVertical, {}), "aria-label": "Expand/collapse header", variant: "tertiary", size: "small" }), (0, jsx_runtime_1.jsx)(popover_js_1.Popover, { "aria-label": "Expanded header", placement: "bottom end", children: (0, jsx_runtime_1.jsx)("div", { className: "cim-app-header-tools-collapsed", children: tools }) })] })) : (tools) })] }));
+    return ((0, jsx_runtime_1.jsxs)("header", { ...props, ref: ref, className: (0, clsx_1.default)('cim-app-header', UNSAFE_className), style: UNSAFE_style, "data-react-aria-top-layer": appShellContext?.mobileNavIsOpen || undefined, children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-app-header-title", children: [navButton !== undefined ? (navButton) : appShellContext ? ((0, jsx_runtime_1.jsx)(nav_button_js_1.UNSTABLE_AppHeaderNavButton, { "data-app-shell-controlled": true })) : null, (0, jsx_runtime_1.jsx)(cimpress_logo_js_1.CimpressLogo, { height: 24 }), (0, jsx_runtime_1.jsx)(divider_js_1.Divider, { orientation: "vertical" }), (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "h1", variant: "title-5", tone: "base", children: (0, jsx_runtime_1.jsx)(link_js_1.Link, { ...titleLinkProps, UNSAFE_className: "cim-app-header-title-link", children: title }) }), postTitle] }), search && (0, jsx_runtime_1.jsx)("div", { className: "cim-app-header-search", children: search }), (0, jsx_runtime_1.jsx)("div", { className: "cim-app-header-tools", children: isMobile && tools ? ((0, jsx_runtime_1.jsxs)(popover_js_1.PopoverRoot, { children: [(0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { icon: (0, jsx_runtime_1.jsx)(index_js_1.IconMenuMoreVertical, {}), "aria-label": "Expand/collapse header", variant: "tertiary", size: "small" }), (0, jsx_runtime_1.jsx)(popover_js_1.Popover, { "aria-label": "Expanded header", placement: "bottom end", children: (0, jsx_runtime_1.jsx)("div", { className: "cim-app-header-tools-collapsed", children: tools }) })] })) : (tools) })] }));
 }
 /**
  * Displays a basic application header.

package/dist/commonjs/components/app-header/app-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-header.js","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAsE;AACtE,yDAAkD;AAClD,mDAA4D;AAC5D,mEAA2D;AAC3D,4EAAoE;AACpE,6DAAsD;AACtD,sDAAgD;AAChD,sDAA6D;AAE7D,mDAA6C;AAC7C,mDAA6C;AAC7C,yDAAkD;AAClD,mDAAoF;AAgBpF,SAAS,SAAS,CAChB,EACE,KAAK,EACL,SAAS,EACT,KAAK,EACL,kBAAkB,EAAE,SAAS,EAC7B,kBAAkB,EAAE,SAAS,EAC7B,eAAe,EAAE,MAAM,EACvB,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACO,EACjB,GAAiC;IAEjC,MAAM,QAAQ,GAAG,IAAA,8BAAW,GAAE,CAAC;IAC/B,MAAM,eAAe,GAAG,IAAA,kBAAU,EAAC,sCAAe,CAAC,CAAC;IACpD,MAAM,cAAc,GAAG,OAAO,SAAS,KAAK,QAAQ,IAAI,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;IAE9G,OAAO,CACL,uCACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,gBAAgB,EAAE,gBAAgB,CAAC,EACnD,KAAK,EAAE,YAAY,+BACQ,eAAe,EAAE,aAAa,IAAI,SAAS,aAEtE,iCAAK,SAAS,EAAC,sBAAsB,aAClC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,uBAAC,2CAAkB,KAAG,CAAC,CAAC,CAAC,IAAI,EACtF,uBAAC,+BAAY,IAAC,MAAM,EAAE,EAAE,GAAI,EAC5B,uBAAC,oBAAO,IAAC,WAAW,EAAC,UAAU,GAAG,EAClC,uBAAC,cAAI,IAAC,EAAE,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,YACzC,uBAAC,cAAI,OAAK,cAAc,EAAE,gBAAgB,EAAC,2BAA2B,YACnE,KAAK,GACD,GACF,EAEN,SAAS,IACN,EAEL,MAAM,IAAI,gCAAK,SAAS,EAAC,uBAAuB,YAAE,MAAM,GAAO,EAEhE,gCAAK,SAAS,EAAC,sBAAsB,YAClC,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC,CACnB,wBAAC,wBAAW,eACV,uBAAC,2BAAU,IACT,IAAI,EAAE,uBAAC,+BAAoB,KAAG,gBAEnB,wBAAwB,EACnC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,EACF,uBAAC,oBAAO,kBAAY,iBAAiB,EAAC,SAAS,EAAC,YAAY,YAC1D,gCAAK,SAAS,EAAC,gCAAgC,YAAE,KAAK,GAAO,GACrD,IACE,CACf,CAAC,CAAC,CAAC,CACF,KAAK,CACN,GACG,IACC,CACV,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,GAAG,IAAA,2BAAU,EAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAE/B,+BAAS","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenuMoreVertical } from '../../icons/index.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { Divider } from '../divider/divider.js';\nimport { Popover, PopoverRoot } from '../popover/popover.js';\nimport type { CommonProps, Href, NavigationProps, WithRequired } from '../types.js';\nimport { Link } from '../typography/link.js';\nimport { Text } from '../typography/text.js';\nimport { CimpressLogo } from './cimpress-logo.js';\nimport { UNSTABLE_AppHeaderNavButton as AppHeaderNavButton } from './nav-button.js';\n\nexport interface AppHeaderTitleLinkProps extends WithRequired<NavigationProps, 'href'> {}\n\nexport interface AppHeaderProps extends CommonProps {\n  /** The title displayed in the header, usually the application name. Rendered as an `<h1>` element. */\n  title: string;\n  /** The props of the link that is rendered around the header title. */\n  titleLink: Href | AppHeaderTitleLinkProps;\n  /** The tools to render at the end of the header. */\n  tools?: ReactNode;\n  UNSTABLE_navButton?: ReactNode;\n  UNSTABLE_postTitle?: ReactNode;\n  UNSTABLE_search?: ReactNode;\n}\n\nfunction AppHeader(\n  {\n    title,\n    titleLink,\n    tools,\n    UNSTABLE_navButton: navButton,\n    UNSTABLE_postTitle: postTitle,\n    UNSTABLE_search: search,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: AppHeaderProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const isMobile = useIsMobile();\n  const appShellContext = useContext(AppShellContext);\n  const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };\n\n  return (\n    <header\n      {...props}\n      ref={ref}\n      className={clsx('cim-app-header', UNSAFE_className)}\n      style={UNSAFE_style}\n      data-react-aria-top-layer={appShellContext?.sideNavIsOpen || undefined}\n    >\n      <div className=\"cim-app-header-title\">\n        {navButton !== undefined ? navButton : appShellContext ? <AppHeaderNavButton /> : null}\n        <CimpressLogo height={24} />\n        <Divider orientation=\"vertical\" />\n        <Text as=\"h1\" variant=\"title-5\" tone=\"base\">\n          <Link {...titleLinkProps} UNSAFE_className=\"cim-app-header-title-link\">\n            {title}\n          </Link>\n        </Text>\n\n        {postTitle}\n      </div>\n\n      {search && <div className=\"cim-app-header-search\">{search}</div>}\n\n      <div className=\"cim-app-header-tools\">\n        {isMobile && tools ? (\n          <PopoverRoot>\n            <IconButton\n              icon={<IconMenuMoreVertical />}\n              // TODO: i18n\n              aria-label=\"Expand/collapse header\"\n              variant=\"tertiary\"\n              size=\"small\"\n            />\n            <Popover aria-label=\"Expanded header\" placement=\"bottom end\">\n              <div className=\"cim-app-header-tools-collapsed\">{tools}</div>\n            </Popover>\n          </PopoverRoot>\n        ) : (\n          tools\n        )}\n      </div>\n    </header>\n  );\n}\n\n/**\n * Displays a basic application header.\n *\n * See [app header usage guidelines](https://ui.cimpress.io/components/app-header/).\n */\nconst _AppHeader = forwardRef(AppHeader, 'AppHeader');\n\nexport { _AppHeader as AppHeader };\n"]}
+{"version":3,"file":"app-header.js","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAsE;AACtE,yDAAkD;AAClD,mDAA4D;AAC5D,mEAA2D;AAC3D,4EAAoE;AACpE,6DAAsD;AACtD,sDAAgD;AAChD,sDAA6D;AAE7D,mDAA6C;AAC7C,mDAA6C;AAC7C,yDAAkD;AAClD,mDAAoF;AAgBpF,SAAS,SAAS,CAChB,EACE,KAAK,EACL,SAAS,EACT,KAAK,EACL,kBAAkB,EAAE,SAAS,EAC7B,kBAAkB,EAAE,SAAS,EAC7B,eAAe,EAAE,MAAM,EACvB,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACO,EACjB,GAAiC;IAEjC,MAAM,QAAQ,GAAG,IAAA,8BAAW,GAAE,CAAC;IAC/B,MAAM,eAAe,GAAG,IAAA,kBAAU,EAAC,sCAAe,CAAC,CAAC;IACpD,MAAM,cAAc,GAAG,OAAO,SAAS,KAAK,QAAQ,IAAI,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;IAE9G,OAAO,CACL,uCACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,gBAAgB,EAAE,gBAAgB,CAAC,EACnD,KAAK,EAAE,YAAY,+BACQ,eAAe,EAAE,eAAe,IAAI,SAAS,aAExE,iCAAK,SAAS,EAAC,sBAAsB,aAClC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,SAAS,CACV,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CACpB,uBAAC,2CAAkB,wCAA6B,CACjD,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,+BAAY,IAAC,MAAM,EAAE,EAAE,GAAI,EAC5B,uBAAC,oBAAO,IAAC,WAAW,EAAC,UAAU,GAAG,EAClC,uBAAC,cAAI,IAAC,EAAE,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,YACzC,uBAAC,cAAI,OAAK,cAAc,EAAE,gBAAgB,EAAC,2BAA2B,YACnE,KAAK,GACD,GACF,EAEN,SAAS,IACN,EAEL,MAAM,IAAI,gCAAK,SAAS,EAAC,uBAAuB,YAAE,MAAM,GAAO,EAEhE,gCAAK,SAAS,EAAC,sBAAsB,YAClC,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC,CACnB,wBAAC,wBAAW,eACV,uBAAC,2BAAU,IACT,IAAI,EAAE,uBAAC,+BAAoB,KAAG,gBAEnB,wBAAwB,EACnC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,EACF,uBAAC,oBAAO,kBAAY,iBAAiB,EAAC,SAAS,EAAC,YAAY,YAC1D,gCAAK,SAAS,EAAC,gCAAgC,YAAE,KAAK,GAAO,GACrD,IACE,CACf,CAAC,CAAC,CAAC,CACF,KAAK,CACN,GACG,IACC,CACV,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,GAAG,IAAA,2BAAU,EAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAE/B,+BAAS","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenuMoreVertical } from '../../icons/index.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { Divider } from '../divider/divider.js';\nimport { Popover, PopoverRoot } from '../popover/popover.js';\nimport type { CommonProps, Href, NavigationProps, WithRequired } from '../types.js';\nimport { Link } from '../typography/link.js';\nimport { Text } from '../typography/text.js';\nimport { CimpressLogo } from './cimpress-logo.js';\nimport { UNSTABLE_AppHeaderNavButton as AppHeaderNavButton } from './nav-button.js';\n\nexport interface AppHeaderTitleLinkProps extends WithRequired<NavigationProps, 'href'> {}\n\nexport interface AppHeaderProps extends CommonProps {\n  /** The title displayed in the header, usually the application name. Rendered as an `<h1>` element. */\n  title: string;\n  /** The props of the link that is rendered around the header title. */\n  titleLink: Href | AppHeaderTitleLinkProps;\n  /** The tools to render at the end of the header. */\n  tools?: ReactNode;\n  UNSTABLE_navButton?: ReactNode;\n  UNSTABLE_postTitle?: ReactNode;\n  UNSTABLE_search?: ReactNode;\n}\n\nfunction AppHeader(\n  {\n    title,\n    titleLink,\n    tools,\n    UNSTABLE_navButton: navButton,\n    UNSTABLE_postTitle: postTitle,\n    UNSTABLE_search: search,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: AppHeaderProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const isMobile = useIsMobile();\n  const appShellContext = useContext(AppShellContext);\n  const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };\n\n  return (\n    <header\n      {...props}\n      ref={ref}\n      className={clsx('cim-app-header', UNSAFE_className)}\n      style={UNSAFE_style}\n      data-react-aria-top-layer={appShellContext?.mobileNavIsOpen || undefined}\n    >\n      <div className=\"cim-app-header-title\">\n        {navButton !== undefined ? (\n          navButton\n        ) : appShellContext ? (\n          <AppHeaderNavButton data-app-shell-controlled />\n        ) : null}\n        <CimpressLogo height={24} />\n        <Divider orientation=\"vertical\" />\n        <Text as=\"h1\" variant=\"title-5\" tone=\"base\">\n          <Link {...titleLinkProps} UNSAFE_className=\"cim-app-header-title-link\">\n            {title}\n          </Link>\n        </Text>\n\n        {postTitle}\n      </div>\n\n      {search && <div className=\"cim-app-header-search\">{search}</div>}\n\n      <div className=\"cim-app-header-tools\">\n        {isMobile && tools ? (\n          <PopoverRoot>\n            <IconButton\n              icon={<IconMenuMoreVertical />}\n              // TODO: i18n\n              aria-label=\"Expand/collapse header\"\n              variant=\"tertiary\"\n              size=\"small\"\n            />\n            <Popover aria-label=\"Expanded header\" placement=\"bottom end\">\n              <div className=\"cim-app-header-tools-collapsed\">{tools}</div>\n            </Popover>\n          </PopoverRoot>\n        ) : (\n          tools\n        )}\n      </div>\n    </header>\n  );\n}\n\n/**\n * Displays a basic application header.\n *\n * See [app header usage guidelines](https://ui.cimpress.io/components/app-header/).\n */\nconst _AppHeader = forwardRef(AppHeader, 'AppHeader');\n\nexport { _AppHeader as AppHeader };\n"]}

package/dist/commonjs/components/app-header/nav-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,WAAW,gCAAiC,SAAQ,WAAW;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA4BD,QAAA,MAAM,4BAA4B,qLAAgF,CAAC;AAEnH,OAAO,EAAE,4BAA4B,IAAI,2BAA2B,EAAE,CAAC"}
+{"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,WAAW,gCAAiC,SAAQ,WAAW;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA6BD,QAAA,MAAM,4BAA4B,qLAAgF,CAAC;AAEnH,OAAO,EAAE,4BAA4B,IAAI,2BAA2B,EAAE,CAAC"}

package/dist/commonjs/components/app-header/nav-button.js

@@ -12,13 +12,13 @@ const index_js_1 = require("../../icons/index.js");
 const with_style_props_js_1 = require("../../with-style-props.js");
 const app_shell_context_js_1 = require("../app-shell/app-shell-context.js");
 const icon_button_js_1 = require("../button/icon-button.js");
-function UNSTABLE_AppHeaderNavButton({ isOpen, onPress, UNSAFE_className, UNSAFE_style }, ref) {
+function UNSTABLE_AppHeaderNavButton({ isOpen, onPress, UNSAFE_className, UNSAFE_style, ...props }, ref) {
     const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
     const handlePress = () => {
         onPress?.();
         appShellContext?.toggleSideNav();
     };
-    return ((0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { "aria-expanded": isOpen ?? appShellContext?.sideNavIsOpen, icon: (0, jsx_runtime_1.jsx)(index_js_1.IconMenu, {}), "aria-label": "Open menu", variant: "tertiary", onPress: handlePress, ref: ref, UNSAFE_className: (0, clsx_1.default)('cim-app-header-nav-toggle', UNSAFE_className), UNSAFE_style: UNSAFE_style }));
+    return ((0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { ...props, "aria-expanded": isOpen ?? appShellContext?.mobileNavIsOpen, icon: (0, jsx_runtime_1.jsx)(index_js_1.IconMenu, {}), "aria-label": "Open menu", variant: "tertiary", onPress: handlePress, ref: ref, UNSAFE_className: (0, clsx_1.default)('cim-app-header-nav-toggle', UNSAFE_className), UNSAFE_style: UNSAFE_style }));
 }
 const _UNSTABLE_AppHeaderNavButton = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UNSTABLE_AppHeaderNavButton, 'AppHeaderNavButton'));
 exports.UNSTABLE_AppHeaderNavButton = _UNSTABLE_AppHeaderNavButton;

package/dist/commonjs/components/app-header/nav-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav-button.js","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":";;;;;;;AAAA,gDAAwB;AACxB,iCAAsD;AACtD,yDAAkD;AAClD,mDAAgD;AAChD,mEAA2D;AAC3D,4EAAoE;AACpE,6DAAsD;AAQtD,SAAS,2BAA2B,CAClC,EAAE,MAAM,EAAE,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAoC,EACrF,GAAoC;IAEpC,MAAM,eAAe,GAAG,IAAA,kBAAU,EAAC,sCAAe,CAAC,CAAC;IAEpD,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,OAAO,EAAE,EAAE,CAAC;QACZ,eAAe,EAAE,aAAa,EAAE,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,2BAAU,qBACM,MAAM,IAAI,eAAe,EAAE,aAAa,EACvD,IAAI,EAAE,uBAAC,mBAAQ,KAAG,gBAEP,WAAW,EACtB,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,GAAG,EAAE,GAAG,EACR,gBAAgB,EAAE,IAAA,cAAI,EAAC,2BAA2B,EAAE,gBAAgB,CAAC,EACrE,YAAY,EAAE,YAAY,GAC1B,CACH,CAAC;AACJ,CAAC;AAED,MAAM,4BAA4B,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,2BAA2B,EAAE,oBAAoB,CAAC,CAAC,CAAC;AAE1E,mEAA2B","sourcesContent":["import clsx from 'clsx';\nimport { useContext, type ForwardedRef } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenu } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { IconButton } from '../button/icon-button.js';\nimport type { CommonProps } from '../types.js';\n\nexport interface UNSTABLE_AppHeaderNavButtonProps extends CommonProps {\n  isOpen?: boolean;\n  onPress?: () => void;\n}\n\nfunction UNSTABLE_AppHeaderNavButton(\n  { isOpen, onPress, UNSAFE_className, UNSAFE_style }: UNSTABLE_AppHeaderNavButtonProps,\n  ref: ForwardedRef<HTMLButtonElement>,\n) {\n  const appShellContext = useContext(AppShellContext);\n\n  const handlePress = () => {\n    onPress?.();\n    appShellContext?.toggleSideNav();\n  };\n\n  return (\n    <IconButton\n      aria-expanded={isOpen ?? appShellContext?.sideNavIsOpen}\n      icon={<IconMenu />}\n      // TODO\n      aria-label=\"Open menu\"\n      variant=\"tertiary\"\n      onPress={handlePress}\n      ref={ref}\n      UNSAFE_className={clsx('cim-app-header-nav-toggle', UNSAFE_className)}\n      UNSAFE_style={UNSAFE_style}\n    />\n  );\n}\n\nconst _UNSTABLE_AppHeaderNavButton = withStyleProps(forwardRef(UNSTABLE_AppHeaderNavButton, 'AppHeaderNavButton'));\n\nexport { _UNSTABLE_AppHeaderNavButton as UNSTABLE_AppHeaderNavButton };\n"]}
+{"version":3,"file":"nav-button.js","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":";;;;;;;AAAA,gDAAwB;AACxB,iCAAsD;AACtD,yDAAkD;AAClD,mDAAgD;AAChD,mEAA2D;AAC3D,4EAAoE;AACpE,6DAAsD;AAQtD,SAAS,2BAA2B,CAClC,EAAE,MAAM,EAAE,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAoC,EAC/F,GAAoC;IAEpC,MAAM,eAAe,GAAG,IAAA,kBAAU,EAAC,sCAAe,CAAC,CAAC;IAEpD,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,OAAO,EAAE,EAAE,CAAC;QACZ,eAAe,EAAE,aAAa,EAAE,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,2BAAU,OACL,KAAK,mBACM,MAAM,IAAI,eAAe,EAAE,eAAe,EACzD,IAAI,EAAE,uBAAC,mBAAQ,KAAG,gBAEP,WAAW,EACtB,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,GAAG,EAAE,GAAG,EACR,gBAAgB,EAAE,IAAA,cAAI,EAAC,2BAA2B,EAAE,gBAAgB,CAAC,EACrE,YAAY,EAAE,YAAY,GAC1B,CACH,CAAC;AACJ,CAAC;AAED,MAAM,4BAA4B,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,2BAA2B,EAAE,oBAAoB,CAAC,CAAC,CAAC;AAE1E,mEAA2B","sourcesContent":["import clsx from 'clsx';\nimport { useContext, type ForwardedRef } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenu } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { IconButton } from '../button/icon-button.js';\nimport type { CommonProps } from '../types.js';\n\nexport interface UNSTABLE_AppHeaderNavButtonProps extends CommonProps {\n  isOpen?: boolean;\n  onPress?: () => void;\n}\n\nfunction UNSTABLE_AppHeaderNavButton(\n  { isOpen, onPress, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_AppHeaderNavButtonProps,\n  ref: ForwardedRef<HTMLButtonElement>,\n) {\n  const appShellContext = useContext(AppShellContext);\n\n  const handlePress = () => {\n    onPress?.();\n    appShellContext?.toggleSideNav();\n  };\n\n  return (\n    <IconButton\n      {...props}\n      aria-expanded={isOpen ?? appShellContext?.mobileNavIsOpen}\n      icon={<IconMenu />}\n      // TODO\n      aria-label=\"Open menu\"\n      variant=\"tertiary\"\n      onPress={handlePress}\n      ref={ref}\n      UNSAFE_className={clsx('cim-app-header-nav-toggle', UNSAFE_className)}\n      UNSAFE_style={UNSAFE_style}\n    />\n  );\n}\n\nconst _UNSTABLE_AppHeaderNavButton = withStyleProps(forwardRef(UNSTABLE_AppHeaderNavButton, 'AppHeaderNavButton'));\n\nexport { _UNSTABLE_AppHeaderNavButton as UNSTABLE_AppHeaderNavButton };\n"]}

package/dist/commonjs/components/app-shell/app-shell-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-shell-context.js","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell-context.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AAEtC,gBAAgB;AACH,QAAA,eAAe,GAAG,IAAA,qBAAa,EAGlC,IAAI,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\n/** @internal */\nexport const AppShellContext = createContext<{\n  sideNavIsOpen: boolean;\n  toggleSideNav: (isOpen?: boolean) => void;\n} | null>(null);\n"]}
+{"version":3,"file":"app-shell-context.js","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell-context.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AAEtC,gBAAgB;AACH,QAAA,eAAe,GAAG,IAAA,qBAAa,EAQlC,IAAI,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\n/** @internal */\nexport const AppShellContext = createContext<{\n  mobileNavIsOpen: boolean;\n  toggleMobileNav: (isOpen?: boolean) => void;\n  sideNavIsCollapsed: boolean | undefined;\n  toggleSideNavCollapse: (isCollapsed?: boolean) => void;\n  sideNavIsCollapsible: boolean;\n  setSideNavIsCollapsible: (isCollapsible: boolean) => void;\n  toggleSideNav: () => void;\n} | null>(null);\n"]}

package/dist/commonjs/components/app-shell/app-shell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,sBAAuB,SAAQ,WAAW;IACzD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAa/G;AAED,MAAM,WAAW,0BAA2B,SAAQ,WAAW;IAC7D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,0BAA0B,2CAkB5B"}
+{"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAyB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,sBAAuB,SAAQ,WAAW;IACzD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAmC/G;AAED,MAAM,WAAW,0BAA2B,SAAQ,WAAW;IAC7D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,0BAA0B,2CAM5B"}

package/dist/commonjs/components/app-shell/app-shell.js

@@ -8,19 +8,37 @@ exports.UNSTABLE_AppShellBody = UNSTABLE_AppShellBody;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const clsx_1 = __importDefault(require("clsx"));
 const react_1 = require("react");
-const use_is_mobile_js_1 = require("../../utils/use-is-mobile.js");
+const breakpoints_js_1 = require("../../utils/breakpoints.js");
 const app_shell_context_js_1 = require("./app-shell-context.js");
 function UNSTABLE_AppShell({ children, UNSAFE_className, UNSAFE_style, ...props }) {
-    const [sideNavIsOpen, setSideNavIsOpen] = (0, react_1.useState)(true);
-    const toggleSideNav = (0, react_1.useCallback)((isOpen) => {
-        setSideNavIsOpen((prevIsOpen) => isOpen ?? !prevIsOpen);
+    const [sideNavIsCollapsible, setSideNavIsCollapsible] = (0, react_1.useState)(false);
+    const [mobileNavIsOpen, setMobileNavIsOpen] = (0, react_1.useState)(false);
+    const toggleMobileNav = (0, react_1.useCallback)((isOpen) => {
+        setMobileNavIsOpen((prevIsOpen) => isOpen ?? !prevIsOpen);
     }, []);
-    return ((0, jsx_runtime_1.jsx)(app_shell_context_js_1.AppShellContext.Provider, { value: { sideNavIsOpen, toggleSideNav }, children: (0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-app-shell', UNSAFE_className), style: UNSAFE_style, ...props, children: children }) }));
+    const [sideNavIsCollapsed, setSideNavIsCollapsed] = (0, react_1.useState)(undefined);
+    const toggleSideNavCollapse = (0, react_1.useCallback)((isCollapsed) => {
+        setSideNavIsCollapsed((prevIsCollapsed) => isCollapsed ?? !prevIsCollapsed);
+    }, []);
+    const toggleSideNav = (0, react_1.useCallback)(() => {
+        if (sideNavIsCollapsible && (0, breakpoints_js_1.matchesBreakpoint)({ min: 'md' })) {
+            toggleSideNavCollapse();
+        }
+        else {
+            toggleMobileNav();
+        }
+    }, [sideNavIsCollapsible, toggleMobileNav, toggleSideNavCollapse]);
+    return ((0, jsx_runtime_1.jsx)(app_shell_context_js_1.AppShellContext.Provider, { value: {
+            sideNavIsCollapsible,
+            setSideNavIsCollapsible,
+            mobileNavIsOpen,
+            toggleMobileNav,
+            sideNavIsCollapsed,
+            toggleSideNavCollapse,
+            toggleSideNav,
+        }, children: (0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-app-shell', UNSAFE_className), style: UNSAFE_style, ...props, children: children }) }));
 }
 function UNSTABLE_AppShellBody({ children, UNSAFE_className, UNSAFE_style, ...props }) {
-    const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
-    const sideNavIsOpen = appShellContext?.sideNavIsOpen ?? false;
-    const isMobile = (0, use_is_mobile_js_1.useIsMobile)();
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-app-shell-body', UNSAFE_className), style: UNSAFE_style, inert: isMobile && sideNavIsOpen ? '' : undefined, ...props, children: children }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-app-shell-body', UNSAFE_className), style: UNSAFE_style, ...props, children: children }));
 }
 //# sourceMappingURL=app-shell.js.map

package/dist/commonjs/components/app-shell/app-shell.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-shell.js","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":";;;;;AAUA,8CAaC;AAMD,sDAuBC;;AApDD,gDAAwB;AACxB,iCAA0E;AAC1E,mEAA2D;AAE3D,iEAAyD;AAMzD,SAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAA0B;IAC9G,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IACzD,MAAM,aAAa,GAAG,IAAA,mBAAW,EAAC,CAAC,MAAgB,EAAE,EAAE;QACrD,gBAAgB,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,MAAM,IAAI,CAAC,UAAU,CAAC,CAAC;IAC1D,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,uBAAC,sCAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,YAC/D,gCAAK,SAAS,EAAE,IAAA,cAAI,EAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,KAAM,KAAK,YACpF,QAAQ,GACL,GACmB,CAC5B,CAAC;AACJ,CAAC;AAMD,SAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACmB;IAC3B,MAAM,eAAe,GAAG,IAAA,kBAAU,EAAC,sCAAe,CAAC,CAAC;IACpD,MAAM,aAAa,GAAG,eAAe,EAAE,aAAa,IAAI,KAAK,CAAC;IAC9D,MAAM,QAAQ,GAAG,IAAA,8BAAW,GAAE,CAAC;IAE/B,OAAO,CACL,gCACE,SAAS,EAAE,IAAA,cAAI,EAAC,oBAAoB,EAAE,gBAAgB,CAAC,EACvD,KAAK,EAAE,YAAY,EAIb,KAAK,EAAE,QAAQ,IAAI,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KACnD,KAAK,YAER,QAAQ,GACL,CACP,CAAC;AACJ,CAAC","sourcesContent":["import clsx from 'clsx';\nimport { useCallback, useContext, useState, type ReactNode } from 'react';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport type { CommonProps } from '../types.js';\nimport { AppShellContext } from './app-shell-context.js';\n\nexport interface UNSTABLE_AppShellProps extends CommonProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_AppShell({ children, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_AppShellProps) {\n  const [sideNavIsOpen, setSideNavIsOpen] = useState(true);\n  const toggleSideNav = useCallback((isOpen?: boolean) => {\n    setSideNavIsOpen((prevIsOpen) => isOpen ?? !prevIsOpen);\n  }, []);\n\n  return (\n    <AppShellContext.Provider value={{ sideNavIsOpen, toggleSideNav }}>\n      <div className={clsx('cim-app-shell', UNSAFE_className)} style={UNSAFE_style} {...props}>\n        {children}\n      </div>\n    </AppShellContext.Provider>\n  );\n}\n\nexport interface UNSTABLE_AppShellBodyProps extends CommonProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_AppShellBody({\n  children,\n  UNSAFE_className,\n  UNSAFE_style,\n  ...props\n}: UNSTABLE_AppShellBodyProps) {\n  const appShellContext = useContext(AppShellContext);\n  const sideNavIsOpen = appShellContext?.sideNavIsOpen ?? false;\n  const isMobile = useIsMobile();\n\n  return (\n    <div\n      className={clsx('cim-app-shell-body', UNSAFE_className)}\n      style={UNSAFE_style}\n      // Make the body inert when the side nav is open on mobile so that tabbing is contained to app header and side nav\n      // Workaround for React not having type definitions for the `inert` attribute\n      // eslint-disable-next-line internal/no-extra-props-in-spread\n      {...{ inert: isMobile && sideNavIsOpen ? '' : undefined }}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"app-shell.js","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":";;;;;AAUA,8CAmCC;AAMD,sDAWC;;AA9DD,gDAAwB;AACxB,iCAA8D;AAC9D,+DAA+D;AAE/D,iEAAyD;AAMzD,SAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAA0B;IAC9G,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACxE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC9D,MAAM,eAAe,GAAG,IAAA,mBAAW,EAAC,CAAC,MAAgB,EAAE,EAAE;QACvD,kBAAkB,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,MAAM,IAAI,CAAC,UAAU,CAAC,CAAC;IAC5D,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,IAAA,gBAAQ,EAAsB,SAAS,CAAC,CAAC;IAC7F,MAAM,qBAAqB,GAAG,IAAA,mBAAW,EAAC,CAAC,WAAqB,EAAE,EAAE;QAClE,qBAAqB,CAAC,CAAC,eAAe,EAAE,EAAE,CAAC,WAAW,IAAI,CAAC,eAAe,CAAC,CAAC;IAC9E,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,MAAM,aAAa,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACrC,IAAI,oBAAoB,IAAI,IAAA,kCAAiB,EAAC,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC;YAC7D,qBAAqB,EAAE,CAAC;QAC1B,CAAC;aAAM,CAAC;YACN,eAAe,EAAE,CAAC;QACpB,CAAC;IACH,CAAC,EAAE,CAAC,oBAAoB,EAAE,eAAe,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEnE,OAAO,CACL,uBAAC,sCAAe,CAAC,QAAQ,IACvB,KAAK,EAAE;YACL,oBAAoB;YACpB,uBAAuB;YACvB,eAAe;YACf,eAAe;YACf,kBAAkB;YAClB,qBAAqB;YACrB,aAAa;SACd,YAED,gCAAK,SAAS,EAAE,IAAA,cAAI,EAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,KAAM,KAAK,YACpF,QAAQ,GACL,GACmB,CAC5B,CAAC;AACJ,CAAC;AAMD,SAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACmB;IAC3B,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,cAAI,EAAC,oBAAoB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,KAAM,KAAK,YACzF,QAAQ,GACL,CACP,CAAC;AACJ,CAAC","sourcesContent":["import clsx from 'clsx';\nimport { useCallback, useState, type ReactNode } from 'react';\nimport { matchesBreakpoint } from '../../utils/breakpoints.js';\nimport type { CommonProps } from '../types.js';\nimport { AppShellContext } from './app-shell-context.js';\n\nexport interface UNSTABLE_AppShellProps extends CommonProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_AppShell({ children, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_AppShellProps) {\n  const [sideNavIsCollapsible, setSideNavIsCollapsible] = useState(false);\n  const [mobileNavIsOpen, setMobileNavIsOpen] = useState(false);\n  const toggleMobileNav = useCallback((isOpen?: boolean) => {\n    setMobileNavIsOpen((prevIsOpen) => isOpen ?? !prevIsOpen);\n  }, []);\n  const [sideNavIsCollapsed, setSideNavIsCollapsed] = useState<boolean | undefined>(undefined);\n  const toggleSideNavCollapse = useCallback((isCollapsed?: boolean) => {\n    setSideNavIsCollapsed((prevIsCollapsed) => isCollapsed ?? !prevIsCollapsed);\n  }, []);\n  const toggleSideNav = useCallback(() => {\n    if (sideNavIsCollapsible && matchesBreakpoint({ min: 'md' })) {\n      toggleSideNavCollapse();\n    } else {\n      toggleMobileNav();\n    }\n  }, [sideNavIsCollapsible, toggleMobileNav, toggleSideNavCollapse]);\n\n  return (\n    <AppShellContext.Provider\n      value={{\n        sideNavIsCollapsible,\n        setSideNavIsCollapsible,\n        mobileNavIsOpen,\n        toggleMobileNav,\n        sideNavIsCollapsed,\n        toggleSideNavCollapse,\n        toggleSideNav,\n      }}\n    >\n      <div className={clsx('cim-app-shell', UNSAFE_className)} style={UNSAFE_style} {...props}>\n        {children}\n      </div>\n    </AppShellContext.Provider>\n  );\n}\n\nexport interface UNSTABLE_AppShellBodyProps extends CommonProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_AppShellBody({\n  children,\n  UNSAFE_className,\n  UNSAFE_style,\n  ...props\n}: UNSTABLE_AppShellBodyProps) {\n  return (\n    <div className={clsx('cim-app-shell-body', UNSAFE_className)} style={UNSAFE_style} {...props}>\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/commonjs/components/mobile-nav/mobile-nav.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from 'react';
+export interface UNSTABLE_MobileNavProps {
+    children: ReactNode;
+    isOpen?: boolean;
+    onOpenChange?: (isOpen: boolean) => void;
+}
+export declare function UNSTABLE_MobileNav({ children, isOpen, onOpenChange }: UNSTABLE_MobileNavProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace UNSTABLE_MobileNav {
+    var displayName: string;
+}
+//# sourceMappingURL=mobile-nav.d.ts.map

package/dist/commonjs/components/mobile-nav/mobile-nav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/mobile-nav/mobile-nav.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,uBAAuB,2CAoB7F;yBApBe,kBAAkB"}

package/dist/commonjs/components/mobile-nav/mobile-nav.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UNSTABLE_MobileNav = UNSTABLE_MobileNav;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_aria_components_1 = require("react-aria-components");
+const focusable_container_js_1 = require("../internal/focusable-container/focusable-container.js");
+function UNSTABLE_MobileNav({ children, isOpen, onOpenChange }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: "cim-mobile-nav", children: (0, jsx_runtime_1.jsx)(react_aria_components_1.ModalOverlay, { isOpen: isOpen, onOpenChange: onOpenChange, isDismissable: true, className: "cim-mobile-nav-drawer-overlay", "data-cim-style-root": true, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Modal, { className: "cim-mobile-nav-drawer", children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Dialog, { className: "cim-mobile-nav-drawer-dialog", "aria-label": "Navigation", children: (0, jsx_runtime_1.jsx)(focusable_container_js_1.FocusableContainer, { scrollDirection: "vertical", className: "cim-mobile-nav-drawer-body", children: children }) }) }) }) }));
+}
+UNSTABLE_MobileNav.displayName = 'UNSTABLE_MobileNav';
+//# sourceMappingURL=mobile-nav.js.map

package/dist/commonjs/components/mobile-nav/mobile-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile-nav.js","sourceRoot":"","sources":["../../../../src/components/mobile-nav/mobile-nav.tsx"],"names":[],"mappings":";;AAUA,gDAoBC;;AA7BD,iEAAgH;AAChH,mGAA4F;AAQ5F,SAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAA2B;IAC5F,OAAO,CACL,gCAAK,SAAS,EAAC,gBAAgB,YAC7B,uBAAC,oCAAe,IACd,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,YAAY,EAC1B,aAAa,QACb,SAAS,EAAC,+BAA+B,yCAGzC,uBAAC,6BAAQ,IAAC,SAAS,EAAC,uBAAuB,YACzC,uBAAC,8BAAS,IAAC,SAAS,EAAC,8BAA8B,gBAAY,YAAY,YACzE,uBAAC,2CAAkB,IAAC,eAAe,EAAC,UAAU,EAAC,SAAS,EAAC,4BAA4B,YAClF,QAAQ,GACU,GACX,GACH,GACK,GACd,CACP,CAAC;AACJ,CAAC;AAED,kBAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAC","sourcesContent":["import type { ReactNode } from 'react';\nimport { Dialog as RACDialog, Modal as RACModal, ModalOverlay as RACModalOverlay } from 'react-aria-components';\nimport { FocusableContainer } from '../internal/focusable-container/focusable-container.js';\n\nexport interface UNSTABLE_MobileNavProps {\n  children: ReactNode;\n  isOpen?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function UNSTABLE_MobileNav({ children, isOpen, onOpenChange }: UNSTABLE_MobileNavProps) {\n  return (\n    <div className=\"cim-mobile-nav\">\n      <RACModalOverlay\n        isOpen={isOpen}\n        onOpenChange={onOpenChange}\n        isDismissable\n        className=\"cim-mobile-nav-drawer-overlay\"\n        data-cim-style-root\n      >\n        <RACModal className=\"cim-mobile-nav-drawer\">\n          <RACDialog className=\"cim-mobile-nav-drawer-dialog\" aria-label=\"Navigation\">\n            <FocusableContainer scrollDirection=\"vertical\" className=\"cim-mobile-nav-drawer-body\">\n              {children}\n            </FocusableContainer>\n          </RACDialog>\n        </RACModal>\n      </RACModalOverlay>\n    </div>\n  );\n}\n\nUNSTABLE_MobileNav.displayName = 'UNSTABLE_MobileNav';\n"]}

package/dist/commonjs/components/side-nav/side-nav.d.ts

@@ -3,20 +3,20 @@ import type { Href, StringLikeChildren } from '../types.js';
 export interface UNSTABLE_SideNavProps {
     children: ReactNode;
     /**
-     * Whether the side nav is open. Only needed when the side nav is not controlled by the app shell.
+     * Determines if the side navigation can be collapsed down to an icon-only rail, allowing for more screen space when needed.
+     *
+     * Setting to `true` will enable collapsibility. Passing an object allows for more advanced configuration, including fully controlled usage outside app shell context.
      */
-    isOpen?: boolean;
-    /**
-     * Callback function that is called when the side nav is opened or closed.
-     */
-    onOpenChange?: (isOpen: boolean) => void;
-    /**
-     * Whether the side nav should be expanded by default. Only affects large viewports.
-     * @default true
-     */
-    defaultIsOpen?: boolean;
+    UNSTABLE_isCollapsible?: boolean | {
+        /** Whether the side nav should be collapsed by default. Only affects large viewports. */
+        defaultCollapsed?: true;
+        /** Whether the side nav is currently collapsed. Only needed when the side nav is not controlled by the app shell. */
+        isCollapsed?: boolean;
+        /** Callback function that is called when the side nav is collapsed or expanded. */
+        onCollapseChange?: (isCollapsed: boolean) => void;
+    };
 }
-export declare function UNSTABLE_SideNav({ children, isOpen, defaultIsOpen, onOpenChange }: UNSTABLE_SideNavProps): import("react/jsx-runtime").JSX.Element;
+export declare function UNSTABLE_SideNav({ children, UNSTABLE_isCollapsible: isCollapsible }: UNSTABLE_SideNavProps): import("react/jsx-runtime").JSX.Element;
 export interface UNSTABLE_SideNavListProps {
     children: ReactNode;
 }

package/dist/commonjs/components/side-nav/side-nav.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"side-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/side-nav/side-nav.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA+C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQpF,OAAO,KAAK,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAK5D,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,aAAoB,EAAE,YAAY,EAAE,EAAE,qBAAqB,2CA6D/G;AAED,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,yBAAyB,2CAE3E;AAED,MAAM,WAAW,6BAA6B;IAC5C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,6BAA6B,2CAazG;AAED,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,gCAAgC,2CAahG"}
+{"version":3,"file":"side-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/side-nav/side-nav.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQ1E,OAAO,KAAK,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAK5D,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,sBAAsB,CAAC,EACnB,OAAO,GACP;QACE,yFAAyF;QACzF,gBAAgB,CAAC,EAAE,IAAI,CAAC;QACxB,qHAAqH;QACrH,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,mFAAmF;QACnF,gBAAgB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;KACnD,CAAC;CACP;AAED,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,sBAAsB,EAAE,aAAa,EAAE,EAAE,qBAAqB,2CAiB1G;AA6DD,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,yBAAyB,2CAE3E;AAED,MAAM,WAAW,6BAA6B;IAC5C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,6BAA6B,2CAazG;AAED,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,gCAAgC,2CAahG"}

package/dist/commonjs/components/side-nav/side-nav.js

@@ -12,43 +12,59 @@ const react_aria_1 = require("react-aria");
 const react_aria_components_1 = require("react-aria-components");
 const breakpoints_js_1 = require("../../utils/breakpoints.js");
 const string_like_children_to_string_js_1 = require("../../utils/string-like-children-to-string.js");
-const use_is_mobile_js_1 = require("../../utils/use-is-mobile.js");
 const app_shell_context_js_1 = require("../app-shell/app-shell-context.js");
+const mobile_nav_js_1 = require("../mobile-nav/mobile-nav.js");
 const tooltip_js_1 = require("../tooltip/tooltip.js");
 const text_js_1 = require("../typography/text.js");
-const SideNavContext = (0, react_1.createContext)({ isOpen: false });
-function UNSTABLE_SideNav({ children, isOpen, defaultIsOpen = true, onOpenChange }) {
+const SideNavContext = (0, react_1.createContext)({ isCollapsed: false });
+function UNSTABLE_SideNav({ children, UNSTABLE_isCollapsible: isCollapsible }) {
+    const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
+    (0, utils_1.useLayoutEffect)(() => {
+        appShellContext?.setSideNavIsCollapsible(typeof isCollapsible === 'object' || isCollapsible || false);
+    }, [isCollapsible, appShellContext]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SideNavInner, { UNSTABLE_isCollapsible: isCollapsible, children: children }), appShellContext && ((0, jsx_runtime_1.jsx)(mobile_nav_js_1.UNSTABLE_MobileNav, { isOpen: appShellContext.mobileNavIsOpen, onOpenChange: () => appShellContext.toggleMobileNav(false), children: children }))] }));
+}
+function SideNavInner({ children, UNSTABLE_isCollapsible: isCollapsible }) {
     const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
-    const [isHydrated, setIsHydrated] = (0, react_1.useState)(false);
-    const resolvedIsOpen = isOpen ?? (isHydrated ? appShellContext?.sideNavIsOpen : defaultIsOpen);
     const sideNavRef = (0, react_1.useRef)(null);
-    const isMobile = (0, use_is_mobile_js_1.useIsMobile)();
-    const isOverlaySideNav = (0, breakpoints_js_1.useBreakpoint)({ max: 'md' });
+    const isOverlaySideNav = (0, breakpoints_js_1.useBreakpoint)({ max: 'md' }) && isCollapsible !== false;
+    const isCollapsed = typeof isCollapsible === 'object'
+        ? (isCollapsible.isCollapsed ?? appShellContext?.sideNavIsCollapsed ?? isCollapsible.defaultCollapsed)
+        : isCollapsible
+            ? appShellContext?.sideNavIsCollapsed
+            : undefined;
     function handleClose() {
-        appShellContext?.toggleSideNav(false);
-        onOpenChange?.(false);
+        appShellContext?.toggleSideNavCollapse(true);
+        if (typeof isCollapsible === 'object') {
+            isCollapsible.onCollapseChange?.(true);
+        }
     }
-    const { overlayProps, underlayProps } = (0, react_aria_1.useOverlay)({
+    const { overlayProps } = (0, react_aria_1.useOverlay)({
         isDismissable: isOverlaySideNav,
-        isOpen: resolvedIsOpen,
+        isOpen: isOverlaySideNav && isCollapsed !== undefined ? !isCollapsed : undefined,
         onClose: () => handleClose(),
     }, sideNavRef);
     const resetState = (0, utils_1.useEffectEvent)(() => {
-        setIsHydrated(true);
-        appShellContext?.toggleSideNav(defaultIsOpen && (0, breakpoints_js_1.matchesBreakpoint)({ min: 'lg' }));
+        if (typeof isCollapsible === 'object' || isCollapsible) {
+            const defaultIsCollapsed = typeof isCollapsible === 'object' ? isCollapsible.defaultCollapsed : false;
+            appShellContext?.toggleSideNavCollapse(defaultIsCollapsed || (0, breakpoints_js_1.matchesBreakpoint)({ max: 'md' }));
+            if (typeof isCollapsible === 'object') {
+                isCollapsible.onCollapseChange?.(defaultIsCollapsed || (0, breakpoints_js_1.matchesBreakpoint)({ max: 'md' }));
+            }
+        }
     });
     // Hydrate state and reset when screen size changes to or from overlay mode
     (0, utils_1.useLayoutEffect)(() => {
         resetState();
     }, [isOverlaySideNav]);
-    return ((0, jsx_runtime_1.jsxs)(SideNavContext.Provider, { value: { isOpen: resolvedIsOpen ?? false }, children: [isMobile && ((0, jsx_runtime_1.jsx)("div", { ...underlayProps, className: "cim-side-nav-backdrop", "aria-hidden": !resolvedIsOpen, "data-expanded": resolvedIsOpen, "data-hydrated": isHydrated || undefined })), isMobile && resolvedIsOpen && (0, jsx_runtime_1.jsx)(react_aria_1.DismissButton, { onDismiss: () => handleClose() }), (0, jsx_runtime_1.jsx)("div", { ...(isOverlaySideNav ? overlayProps : {}), className: "cim-side-nav", "data-expanded": resolvedIsOpen, "data-hydrated": isHydrated || undefined, "aria-label": "Side navigation", ref: sideNavRef, inert: isMobile && !resolvedIsOpen ? '' : undefined, children: children })] }));
+    return ((0, jsx_runtime_1.jsx)(SideNavContext.Provider, { value: { isCollapsed: isCollapsed ?? false }, children: (0, jsx_runtime_1.jsx)("div", { ...(isOverlaySideNav ? overlayProps : {}), className: "cim-side-nav", "data-collapsible": typeof isCollapsible === 'object' ? true : isCollapsible || false, "data-collapsed": isCollapsed, "aria-label": "Side navigation", ref: sideNavRef, children: (0, jsx_runtime_1.jsx)("div", { className: "cim-side-nav-panel", children: children }) }) }));
 }
 function UNSTABLE_SideNavList({ children }) {
     return (0, jsx_runtime_1.jsx)("nav", { className: "cim-side-nav-list", children: children });
 }
 function UNSTABLE_SideNavListItem({ children, href, isActive, icon }) {
-    const { isOpen } = (0, react_1.useContext)(SideNavContext);
-    return ((0, jsx_runtime_1.jsx)(tooltip_js_1.Tooltip, { label: (0, string_like_children_to_string_js_1.stringLikeChildrenToString)(children), placement: "right", isDisabled: isOpen, children: (0, jsx_runtime_1.jsxs)(react_aria_components_1.Link, { href: href, className: "cim-side-nav-list-item", "data-active": isActive, children: [icon, (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "span", variant: "medium", UNSAFE_className: "cim-side-nav-list-item-label", children: children })] }) }));
+    const { isCollapsed } = (0, react_1.useContext)(SideNavContext);
+    return ((0, jsx_runtime_1.jsx)(tooltip_js_1.Tooltip, { label: (0, string_like_children_to_string_js_1.stringLikeChildrenToString)(children), placement: "right", isDisabled: !isCollapsed, children: (0, jsx_runtime_1.jsxs)(react_aria_components_1.Link, { href: href, className: "cim-side-nav-list-item", "data-active": isActive, children: [icon, (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "span", variant: "medium", UNSAFE_className: "cim-side-nav-list-item-label", children: children })] }) }));
 }
 function UNSTABLE_SideNavListSection({ children, label }) {
     return ((0, jsx_runtime_1.jsxs)("div", { className: "cim-side-nav-list-section", children: [label && ((0, jsx_runtime_1.jsx)("div", { className: "cim-side-nav-list-section-header", children: (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "p", variant: "small-semibold", tone: "subtle", UNSAFE_className: "cim-side-nav-list-section-header-label", children: label }) })), children] }));

package/dist/commonjs/components/side-nav/side-nav.js.map

@@ -1 +1 @@
-{"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../../../src/components/side-nav/side-nav.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useEffectEvent, useLayoutEffect } from '@react-aria/utils';\nimport { createContext, useContext, useRef, useState, type ReactNode } from 'react';\nimport { DismissButton, useOverlay } from 'react-aria';\nimport { Link as RACLink } from 'react-aria-components';\nimport { matchesBreakpoint, useBreakpoint } from '../../utils/breakpoints.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { Tooltip } from '../tooltip/tooltip.js';\nimport type { Href, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nconst SideNavContext = createContext<{ isOpen: boolean }>({ isOpen: false });\n\nexport interface UNSTABLE_SideNavProps {\n  children: ReactNode;\n  /**\n   * Whether the side nav is open. Only needed when the side nav is not controlled by the app shell.\n   */\n  isOpen?: boolean;\n  /**\n   * Callback function that is called when the side nav is opened or closed.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * Whether the side nav should be expanded by default. Only affects large viewports.\n   * @default true\n   */\n  defaultIsOpen?: boolean;\n}\n\nexport function UNSTABLE_SideNav({ children, isOpen, defaultIsOpen = true, onOpenChange }: UNSTABLE_SideNavProps) {\n  const appShellContext = useContext(AppShellContext);\n  const [isHydrated, setIsHydrated] = useState(false);\n  const resolvedIsOpen = isOpen ?? (isHydrated ? appShellContext?.sideNavIsOpen : defaultIsOpen);\n  const sideNavRef = useRef<HTMLDivElement>(null);\n  const isMobile = useIsMobile();\n  const isOverlaySideNav = useBreakpoint({ max: 'md' });\n\n  function handleClose() {\n    appShellContext?.toggleSideNav(false);\n    onOpenChange?.(false);\n  }\n\n  const { overlayProps, underlayProps } = useOverlay(\n    {\n      isDismissable: isOverlaySideNav,\n      isOpen: resolvedIsOpen,\n      onClose: () => handleClose(),\n    },\n    sideNavRef,\n  );\n\n  const resetState = useEffectEvent(() => {\n    setIsHydrated(true);\n\n    appShellContext?.toggleSideNav(defaultIsOpen && matchesBreakpoint({ min: 'lg' }));\n  });\n\n  // Hydrate state and reset when screen size changes to or from overlay mode\n  useLayoutEffect(() => {\n    resetState();\n  }, [isOverlaySideNav]);\n\n  return (\n    <SideNavContext.Provider value={{ isOpen: resolvedIsOpen ?? false }}>\n      {isMobile && (\n        <div\n          {...underlayProps}\n          className=\"cim-side-nav-backdrop\"\n          aria-hidden={!resolvedIsOpen}\n          data-expanded={resolvedIsOpen}\n          data-hydrated={isHydrated || undefined}\n        />\n      )}\n      {isMobile && resolvedIsOpen && <DismissButton onDismiss={() => handleClose()} />}\n      <div\n        {...(isOverlaySideNav ? overlayProps : {})}\n        className=\"cim-side-nav\"\n        data-expanded={resolvedIsOpen}\n        data-hydrated={isHydrated || undefined}\n        aria-label=\"Side navigation\"\n        ref={sideNavRef}\n        // Make the side nav rail inert when hidden on mobile devices to prevent user interaction and assistive technology focus\n        // Workaround for React not having type definitions for the `inert` attribute\n        // eslint-disable-next-line internal/no-extra-props-in-spread\n        {...{ inert: isMobile && !resolvedIsOpen ? '' : undefined }}\n      >\n        {children}\n      </div>\n    </SideNavContext.Provider>\n  );\n}\n\nexport interface UNSTABLE_SideNavListProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_SideNavList({ children }: UNSTABLE_SideNavListProps) {\n  return <nav className=\"cim-side-nav-list\">{children}</nav>;\n}\n\nexport interface UNSTABLE_SideNavListItemProps {\n  children: StringLikeChildren;\n  href: Href;\n  isActive?: boolean;\n  icon?: ReactNode;\n}\n\nexport function UNSTABLE_SideNavListItem({ children, href, isActive, icon }: UNSTABLE_SideNavListItemProps) {\n  const { isOpen } = useContext(SideNavContext);\n\n  return (\n    <Tooltip label={stringLikeChildrenToString(children)} placement=\"right\" isDisabled={isOpen}>\n      <RACLink href={href} className=\"cim-side-nav-list-item\" data-active={isActive}>\n        {icon}\n        <Text as=\"span\" variant=\"medium\" UNSAFE_className=\"cim-side-nav-list-item-label\">\n          {children}\n        </Text>\n      </RACLink>\n    </Tooltip>\n  );\n}\n\nexport interface UNSTABLE_SideNavListSectionProps {\n  children: ReactNode;\n  label?: string;\n}\n\nexport function UNSTABLE_SideNavListSection({ children, label }: UNSTABLE_SideNavListSectionProps) {\n  return (\n    <div className=\"cim-side-nav-list-section\">\n      {label && (\n        <div className=\"cim-side-nav-list-section-header\">\n          <Text as=\"p\" variant=\"small-semibold\" tone=\"subtle\" UNSAFE_className=\"cim-side-nav-list-section-header-label\">\n            {label}\n          </Text>\n        </div>\n      )}\n      {children}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../../../src/components/side-nav/side-nav.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useEffectEvent, useLayoutEffect } from '@react-aria/utils';\nimport { createContext, useContext, useRef, type ReactNode } from 'react';\nimport { useOverlay } from 'react-aria';\nimport { Link as RACLink } from 'react-aria-components';\nimport { matchesBreakpoint, useBreakpoint } from '../../utils/breakpoints.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { UNSTABLE_MobileNav as MobileNav } from '../mobile-nav/mobile-nav.js';\nimport { Tooltip } from '../tooltip/tooltip.js';\nimport type { Href, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nconst SideNavContext = createContext<{ isCollapsed: boolean }>({ isCollapsed: false });\n\nexport interface UNSTABLE_SideNavProps {\n  children: ReactNode;\n  /**\n   * Determines if the side navigation can be collapsed down to an icon-only rail, allowing for more screen space when needed.\n   *\n   * Setting to `true` will enable collapsibility. Passing an object allows for more advanced configuration, including fully controlled usage outside app shell context.\n   */\n  UNSTABLE_isCollapsible?:\n    | boolean\n    | {\n        /** Whether the side nav should be collapsed by default. Only affects large viewports. */\n        defaultCollapsed?: true;\n        /** Whether the side nav is currently collapsed. Only needed when the side nav is not controlled by the app shell. */\n        isCollapsed?: boolean;\n        /** Callback function that is called when the side nav is collapsed or expanded. */\n        onCollapseChange?: (isCollapsed: boolean) => void;\n      };\n}\n\nexport function UNSTABLE_SideNav({ children, UNSTABLE_isCollapsible: isCollapsible }: UNSTABLE_SideNavProps) {\n  const appShellContext = useContext(AppShellContext);\n\n  useLayoutEffect(() => {\n    appShellContext?.setSideNavIsCollapsible(typeof isCollapsible === 'object' || isCollapsible || false);\n  }, [isCollapsible, appShellContext]);\n\n  return (\n    <>\n      <SideNavInner UNSTABLE_isCollapsible={isCollapsible}>{children}</SideNavInner>\n      {appShellContext && (\n        <MobileNav isOpen={appShellContext.mobileNavIsOpen} onOpenChange={() => appShellContext.toggleMobileNav(false)}>\n          {children}\n        </MobileNav>\n      )}\n    </>\n  );\n}\n\nfunction SideNavInner({ children, UNSTABLE_isCollapsible: isCollapsible }: UNSTABLE_SideNavProps) {\n  const appShellContext = useContext(AppShellContext);\n  const sideNavRef = useRef<HTMLDivElement>(null);\n  const isOverlaySideNav = useBreakpoint({ max: 'md' }) && isCollapsible !== false;\n  const isCollapsed =\n    typeof isCollapsible === 'object'\n      ? (isCollapsible.isCollapsed ?? appShellContext?.sideNavIsCollapsed ?? isCollapsible.defaultCollapsed)\n      : isCollapsible\n        ? appShellContext?.sideNavIsCollapsed\n        : undefined;\n\n  function handleClose() {\n    appShellContext?.toggleSideNavCollapse(true);\n\n    if (typeof isCollapsible === 'object') {\n      isCollapsible.onCollapseChange?.(true);\n    }\n  }\n\n  const { overlayProps } = useOverlay(\n    {\n      isDismissable: isOverlaySideNav,\n      isOpen: isOverlaySideNav && isCollapsed !== undefined ? !isCollapsed : undefined,\n      onClose: () => handleClose(),\n    },\n    sideNavRef,\n  );\n\n  const resetState = useEffectEvent(() => {\n    if (typeof isCollapsible === 'object' || isCollapsible) {\n      const defaultIsCollapsed = typeof isCollapsible === 'object' ? isCollapsible.defaultCollapsed : false;\n      appShellContext?.toggleSideNavCollapse(defaultIsCollapsed || matchesBreakpoint({ max: 'md' }));\n      if (typeof isCollapsible === 'object') {\n        isCollapsible.onCollapseChange?.(defaultIsCollapsed || matchesBreakpoint({ max: 'md' }));\n      }\n    }\n  });\n\n  // Hydrate state and reset when screen size changes to or from overlay mode\n  useLayoutEffect(() => {\n    resetState();\n  }, [isOverlaySideNav]);\n\n  return (\n    <SideNavContext.Provider value={{ isCollapsed: isCollapsed ?? false }}>\n      <div\n        {...(isOverlaySideNav ? overlayProps : {})}\n        className=\"cim-side-nav\"\n        data-collapsible={typeof isCollapsible === 'object' ? true : isCollapsible || false}\n        data-collapsed={isCollapsed}\n        aria-label=\"Side navigation\"\n        ref={sideNavRef}\n      >\n        <div className=\"cim-side-nav-panel\">{children}</div>\n      </div>\n    </SideNavContext.Provider>\n  );\n}\n\nexport interface UNSTABLE_SideNavListProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_SideNavList({ children }: UNSTABLE_SideNavListProps) {\n  return <nav className=\"cim-side-nav-list\">{children}</nav>;\n}\n\nexport interface UNSTABLE_SideNavListItemProps {\n  children: StringLikeChildren;\n  href: Href;\n  isActive?: boolean;\n  icon?: ReactNode;\n}\n\nexport function UNSTABLE_SideNavListItem({ children, href, isActive, icon }: UNSTABLE_SideNavListItemProps) {\n  const { isCollapsed } = useContext(SideNavContext);\n\n  return (\n    <Tooltip label={stringLikeChildrenToString(children)} placement=\"right\" isDisabled={!isCollapsed}>\n      <RACLink href={href} className=\"cim-side-nav-list-item\" data-active={isActive}>\n        {icon}\n        <Text as=\"span\" variant=\"medium\" UNSAFE_className=\"cim-side-nav-list-item-label\">\n          {children}\n        </Text>\n      </RACLink>\n    </Tooltip>\n  );\n}\n\nexport interface UNSTABLE_SideNavListSectionProps {\n  children: ReactNode;\n  label?: string;\n}\n\nexport function UNSTABLE_SideNavListSection({ children, label }: UNSTABLE_SideNavListSectionProps) {\n  return (\n    <div className=\"cim-side-nav-list-section\">\n      {label && (\n        <div className=\"cim-side-nav-list-section-header\">\n          <Text as=\"p\" variant=\"small-semibold\" tone=\"subtle\" UNSAFE_className=\"cim-side-nav-list-section-header-label\">\n            {label}\n          </Text>\n        </div>\n      )}\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/commonjs/index.d.ts

@@ -92,4 +92,5 @@ export * from './components/top-nav/top-nav.js';
 export * from './components/page-layout/page-layout.js';
 export * from './components/nav-list/nav-list.js';
 export * from './components/app-header/nav-button.js';
+export * from './components/mobile-nav/mobile-nav.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/commonjs/index.d.ts.map

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

package/dist/commonjs/index.js

@@ -102,4 +102,5 @@ __exportStar(require("./components/top-nav/top-nav.js"), exports);
 __exportStar(require("./components/page-layout/page-layout.js"), exports);
 __exportStar(require("./components/nav-list/nav-list.js"), exports);
 __exportStar(require("./components/app-header/nav-button.js"), exports);
+__exportStar(require("./components/mobile-nav/mobile-nav.js"), exports);
 //# sourceMappingURL=index.js.map

package/dist/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8DAA4C;AAC5C,4EAA0D;AAC1D,wEAAsD;AACtD,8EAA4D;AAC5D,8DAA4C;AAC5C,gEAA8C;AAC9C,qEAAmD;AACnD,qEAAmD;AACnD,0EAAwD;AACxD,kEAAgD;AAChD,4DAA0C;AAC1C,oEAAkD;AAClD,0EAAwD;AACxD,sEAAoD;AACpD,4DAA0C;AAC1C,wEAAsD;AACtD,mEAAiD;AACjD,mEAAiD;AACjD,0EAAwD;AACxD,0EAAwD;AACxD,wEAAsD;AACtD,8EAA4D;AAE5D,kEAAgD;AAChD,gEAA8C;AAC9C,4DAA0C;AAC1C,sEAAoD;AACpD,4DAA0C;AAC1C,4EAA0D;AAC1D,4EAA0D;AAC1D,wEAAsD;AACtD,4EAA0D;AAC1D,8DAA4C;AAC5C,oEAAkD;AAClD,gEAA8C;AAC9C,gEAA8C;AAC9C,kEAAgD;AAChD,2EAAyD;AACzD,yEAAuD;AACvD,wEAAsD;AACtD,0EAAwD;AACxD,kEAAgD;AAChD,kEAAgD;AAChD,gEAA8C;AAC9C,wEAAsD;AACtD,8DAA4C;AAC5C,qEAAmD;AACnD,yEAAuD;AACvD,0EAAwD;AACxD,mEAAiD;AACjD,uEAAqD;AACrD,wEAAsD;AACtD,2EAAyD;AACzD,gFAA8D;AAC9D,0EAAwD;AAGxD,4DAA0C;AAC1C,0DAAwC;AACxC,gEAA8C;AAC9C,sEAAoD;AACpD,qEAAmD;AACnD,oEAAgF;AAAvE,4GAAA,UAAU,OAAA;AAEnB,8EAA4D;AAC5D,mFAAiE;AACjE,oFAAkE;AAClE,+DAA6C;AAE7C,kEAAgD;AAChD,sEAAoD;AAEpD,kEAAgD;AAChD,kEAAgD;AAChD,kEAAgD;AAoBhD,kEAAgD;AAChD,wEAAsD;AAEtD,6EAA2D;AAE3D,2DAAyC;AAEzC,2BAA2B;AAC3B,kFAAgE;AAChE,0EAAwD;AACxD,sEAAoD;AACpD,kEAAgD;AAChD,uEAAqD;AAErD,sEAAoD;AACpD,oEAAkD;AAClD,gEAA8C;AAC9C,kEAAgD;AAChD,0EAAwD;AACxD,oEAAkD;AAClD,wEAAsD","sourcesContent":["export * from './components/alert/alert.js';\nexport * from './components/alert-dialog/alert-dialog.js';\nexport * from './components/app-header/app-header.js';\nexport * from './components/app-header/simple-auth-tool.js';\nexport * from './components/badge/badge.js';\nexport * from './components/button/button.js';\nexport * from './components/button/link-button.js';\nexport * from './components/button/icon-button.js';\nexport * from './components/button/icon-link-button.js';\nexport * from './components/callout/callout.js';\nexport * from './components/card/card.js';\nexport * from './components/checkbox/checkbox.js';\nexport * from './components/checkbox/checkbox-group.js';\nexport * from './components/combo-box/combo-box.js';\nexport * from './components/code/code.js';\nexport * from './components/code-block/code-block.js';\nexport * from './components/copy/copy-button.js';\nexport * from './components/copy/copy-inline.js';\nexport * from './components/date-picker/date-picker.js';\nexport * from './components/dialog-root/dialog-root.js';\nexport * from './components/disclosure/disclosure.js';\nexport * from './components/disclosure/disclosure-group.js';\nexport type { DisclosureSize, DisclosureVariant } from './components/disclosure/context.js';\nexport * from './components/divider/divider.js';\nexport * from './components/drawer/drawer.js';\nexport * from './components/form/form.js';\nexport * from './components/link-tabs/link-tabs.js';\nexport * from './components/menu/menu.js';\nexport * from './components/modal-dialog/modal-dialog.js';\nexport * from './components/number-field/number-field.js';\nexport * from './components/pagination/pagination.js';\nexport * from './components/progress-bar/progress-bar.js';\nexport * from './components/radio/radio.js';\nexport * from './components/radio/radio-group.js';\nexport * from './components/select/select.js';\nexport * from './components/slider/slider.js';\nexport * from './components/spinner/spinner.js';\nexport * from './components/text-inputs/search-field.js';\nexport * from './components/text-inputs/text-field.js';\nexport * from './components/text-inputs/text-area.js';\nexport * from './components/breadcrumbs/breadcrumbs.js';\nexport * from './components/tooltip/tooltip.js';\nexport * from './components/popover/popover.js';\nexport * from './components/switch/switch.js';\nexport * from './components/table/table-container.js';\nexport * from './components/table/table.js';\nexport * from './components/table/table-header.js';\nexport * from './components/table/table-header-row.js';\nexport * from './components/table/table-header-cell.js';\nexport * from './components/table/table-body.js';\nexport * from './components/table/table-body-row.js';\nexport * from './components/table/table-body-cell.js';\nexport * from './components/table/table-row-selector.js';\nexport * from './components/table/table-all-rows-selector.js';\nexport * from './components/table/table-empty-state.js';\nexport type { RowSelectionMode as TableRowSelectionMode } from './components/table/contexts/table-state.js';\nexport type { ColumnContentAlignment as TableColumnContentAlignment } from './components/table/contexts/column-collection.js';\nexport * from './components/tabs/tabs.js';\nexport * from './components/tag/tag.js';\nexport * from './components/tag/tag-group.js';\nexport * from './components/tag-field/tag-field.js';\nexport * from './components/toast/toast-region.js';\nexport { toastQueue, type ToastQueue } from './components/toast/toast-queue.js';\nexport type { ToastOptions } from './components/toast/types.js';\nexport * from './components/toggle-button/toggle-button.js';\nexport * from './components/toggle-button/toggle-icon-button.js';\nexport * from './components/toggle-button/toggle-button-group.js';\nexport * from './components/file-trigger.js';\n\nexport * from './components/spacing/box/box.js';\nexport * from './components/spacing/stack/stack.js';\n\nexport * from './components/typography/text.js';\nexport * from './components/typography/link.js';\nexport * from './components/typography/list.js';\n\nexport type { ForegroundTone } from './utils/style/types.js';\n\nexport type {\n  CollectionItem,\n  Direction,\n  FieldError,\n  HoverEvent,\n  Key,\n  Selection,\n  PressEvent,\n  RouterConfig,\n  Href,\n  RouterOptions,\n  ValidationResult,\n} from './components/types.js';\nexport type { Spacing, Responsive } from './components/spacing/types.js';\nexport type { StyleProps } from './with-style-props.js';\n\nexport * from './providers/ssr/ssr-provider.js';\nexport * from './providers/router/router-provider.js';\n\nexport * from './components/internal/x-button/x-button.js';\n\nexport * from './utils/use-is-mobile.js';\n\n// Unfinished exports below\nexport * from './components/visually-hidden/visually-hidden.js';\nexport * from './components/file-picker/file-picker.js';\nexport * from './components/container/container.js';\nexport * from './components/stepper/stepper.js';\nexport * from './components/stepper/stepper-item.js';\nexport type { StepperStatus } from './components/stepper/types.js';\nexport * from './components/app-shell/app-shell.js';\nexport * from './components/side-nav/side-nav.js';\nexport * from './components/hidden/hidden.js';\nexport * from './components/top-nav/top-nav.js';\nexport * from './components/page-layout/page-layout.js';\nexport * from './components/nav-list/nav-list.js';\nexport * from './components/app-header/nav-button.js';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8DAA4C;AAC5C,4EAA0D;AAC1D,wEAAsD;AACtD,8EAA4D;AAC5D,8DAA4C;AAC5C,gEAA8C;AAC9C,qEAAmD;AACnD,qEAAmD;AACnD,0EAAwD;AACxD,kEAAgD;AAChD,4DAA0C;AAC1C,oEAAkD;AAClD,0EAAwD;AACxD,sEAAoD;AACpD,4DAA0C;AAC1C,wEAAsD;AACtD,mEAAiD;AACjD,mEAAiD;AACjD,0EAAwD;AACxD,0EAAwD;AACxD,wEAAsD;AACtD,8EAA4D;AAE5D,kEAAgD;AAChD,gEAA8C;AAC9C,4DAA0C;AAC1C,sEAAoD;AACpD,4DAA0C;AAC1C,4EAA0D;AAC1D,4EAA0D;AAC1D,wEAAsD;AACtD,4EAA0D;AAC1D,8DAA4C;AAC5C,oEAAkD;AAClD,gEAA8C;AAC9C,gEAA8C;AAC9C,kEAAgD;AAChD,2EAAyD;AACzD,yEAAuD;AACvD,wEAAsD;AACtD,0EAAwD;AACxD,kEAAgD;AAChD,kEAAgD;AAChD,gEAA8C;AAC9C,wEAAsD;AACtD,8DAA4C;AAC5C,qEAAmD;AACnD,yEAAuD;AACvD,0EAAwD;AACxD,mEAAiD;AACjD,uEAAqD;AACrD,wEAAsD;AACtD,2EAAyD;AACzD,gFAA8D;AAC9D,0EAAwD;AAGxD,4DAA0C;AAC1C,0DAAwC;AACxC,gEAA8C;AAC9C,sEAAoD;AACpD,qEAAmD;AACnD,oEAAgF;AAAvE,4GAAA,UAAU,OAAA;AAEnB,8EAA4D;AAC5D,mFAAiE;AACjE,oFAAkE;AAClE,+DAA6C;AAE7C,kEAAgD;AAChD,sEAAoD;AAEpD,kEAAgD;AAChD,kEAAgD;AAChD,kEAAgD;AAoBhD,kEAAgD;AAChD,wEAAsD;AAEtD,6EAA2D;AAE3D,2DAAyC;AAEzC,2BAA2B;AAC3B,kFAAgE;AAChE,0EAAwD;AACxD,sEAAoD;AACpD,kEAAgD;AAChD,uEAAqD;AAErD,sEAAoD;AACpD,oEAAkD;AAClD,gEAA8C;AAC9C,kEAAgD;AAChD,0EAAwD;AACxD,oEAAkD;AAClD,wEAAsD;AACtD,wEAAsD","sourcesContent":["export * from './components/alert/alert.js';\nexport * from './components/alert-dialog/alert-dialog.js';\nexport * from './components/app-header/app-header.js';\nexport * from './components/app-header/simple-auth-tool.js';\nexport * from './components/badge/badge.js';\nexport * from './components/button/button.js';\nexport * from './components/button/link-button.js';\nexport * from './components/button/icon-button.js';\nexport * from './components/button/icon-link-button.js';\nexport * from './components/callout/callout.js';\nexport * from './components/card/card.js';\nexport * from './components/checkbox/checkbox.js';\nexport * from './components/checkbox/checkbox-group.js';\nexport * from './components/combo-box/combo-box.js';\nexport * from './components/code/code.js';\nexport * from './components/code-block/code-block.js';\nexport * from './components/copy/copy-button.js';\nexport * from './components/copy/copy-inline.js';\nexport * from './components/date-picker/date-picker.js';\nexport * from './components/dialog-root/dialog-root.js';\nexport * from './components/disclosure/disclosure.js';\nexport * from './components/disclosure/disclosure-group.js';\nexport type { DisclosureSize, DisclosureVariant } from './components/disclosure/context.js';\nexport * from './components/divider/divider.js';\nexport * from './components/drawer/drawer.js';\nexport * from './components/form/form.js';\nexport * from './components/link-tabs/link-tabs.js';\nexport * from './components/menu/menu.js';\nexport * from './components/modal-dialog/modal-dialog.js';\nexport * from './components/number-field/number-field.js';\nexport * from './components/pagination/pagination.js';\nexport * from './components/progress-bar/progress-bar.js';\nexport * from './components/radio/radio.js';\nexport * from './components/radio/radio-group.js';\nexport * from './components/select/select.js';\nexport * from './components/slider/slider.js';\nexport * from './components/spinner/spinner.js';\nexport * from './components/text-inputs/search-field.js';\nexport * from './components/text-inputs/text-field.js';\nexport * from './components/text-inputs/text-area.js';\nexport * from './components/breadcrumbs/breadcrumbs.js';\nexport * from './components/tooltip/tooltip.js';\nexport * from './components/popover/popover.js';\nexport * from './components/switch/switch.js';\nexport * from './components/table/table-container.js';\nexport * from './components/table/table.js';\nexport * from './components/table/table-header.js';\nexport * from './components/table/table-header-row.js';\nexport * from './components/table/table-header-cell.js';\nexport * from './components/table/table-body.js';\nexport * from './components/table/table-body-row.js';\nexport * from './components/table/table-body-cell.js';\nexport * from './components/table/table-row-selector.js';\nexport * from './components/table/table-all-rows-selector.js';\nexport * from './components/table/table-empty-state.js';\nexport type { RowSelectionMode as TableRowSelectionMode } from './components/table/contexts/table-state.js';\nexport type { ColumnContentAlignment as TableColumnContentAlignment } from './components/table/contexts/column-collection.js';\nexport * from './components/tabs/tabs.js';\nexport * from './components/tag/tag.js';\nexport * from './components/tag/tag-group.js';\nexport * from './components/tag-field/tag-field.js';\nexport * from './components/toast/toast-region.js';\nexport { toastQueue, type ToastQueue } from './components/toast/toast-queue.js';\nexport type { ToastOptions } from './components/toast/types.js';\nexport * from './components/toggle-button/toggle-button.js';\nexport * from './components/toggle-button/toggle-icon-button.js';\nexport * from './components/toggle-button/toggle-button-group.js';\nexport * from './components/file-trigger.js';\n\nexport * from './components/spacing/box/box.js';\nexport * from './components/spacing/stack/stack.js';\n\nexport * from './components/typography/text.js';\nexport * from './components/typography/link.js';\nexport * from './components/typography/list.js';\n\nexport type { ForegroundTone } from './utils/style/types.js';\n\nexport type {\n  CollectionItem,\n  Direction,\n  FieldError,\n  HoverEvent,\n  Key,\n  Selection,\n  PressEvent,\n  RouterConfig,\n  Href,\n  RouterOptions,\n  ValidationResult,\n} from './components/types.js';\nexport type { Spacing, Responsive } from './components/spacing/types.js';\nexport type { StyleProps } from './with-style-props.js';\n\nexport * from './providers/ssr/ssr-provider.js';\nexport * from './providers/router/router-provider.js';\n\nexport * from './components/internal/x-button/x-button.js';\n\nexport * from './utils/use-is-mobile.js';\n\n// Unfinished exports below\nexport * from './components/visually-hidden/visually-hidden.js';\nexport * from './components/file-picker/file-picker.js';\nexport * from './components/container/container.js';\nexport * from './components/stepper/stepper.js';\nexport * from './components/stepper/stepper-item.js';\nexport type { StepperStatus } from './components/stepper/types.js';\nexport * from './components/app-shell/app-shell.js';\nexport * from './components/side-nav/side-nav.js';\nexport * from './components/hidden/hidden.js';\nexport * from './components/top-nav/top-nav.js';\nexport * from './components/page-layout/page-layout.js';\nexport * from './components/nav-list/nav-list.js';\nexport * from './components/app-header/nav-button.js';\nexport * from './components/mobile-nav/mobile-nav.js';\n"]}

package/dist/esm/components/app-header/app-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"app-header.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQtE,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAMpF,MAAM,WAAW,uBAAwB,SAAQ,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;CAAG;AAEzF,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,sGAAsG;IACtG,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,SAAS,EAAE,IAAI,GAAG,uBAAuB,CAAC;IAC1C,oDAAoD;IACpD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B;AAiED;;;;GAIG;AACH,QAAA,MAAM,UAAU,+GAAqC,CAAC;AAEtD,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
+{"version":3,"file":"app-header.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQtE,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAMpF,MAAM,WAAW,uBAAwB,SAAQ,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;CAAG;AAEzF,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,sGAAsG;IACtG,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,SAAS,EAAE,IAAI,GAAG,uBAAuB,CAAC;IAC1C,oDAAoD;IACpD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B;AAqED;;;;GAIG;AACH,QAAA,MAAM,UAAU,+GAAqC,CAAC;AAEtD,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}

package/dist/esm/components/app-header/app-header.js

@@ -17,7 +17,7 @@ function AppHeader({ title, titleLink, tools, UNSTABLE_navButton: navButton, UNS
     const isMobile = useIsMobile();
     const appShellContext = useContext(AppShellContext);
     const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };
-    return (_jsxs("header", { ...props, ref: ref, className: clsx('cim-app-header', UNSAFE_className), style: UNSAFE_style, "data-react-aria-top-layer": appShellContext?.sideNavIsOpen || undefined, children: [_jsxs("div", { className: "cim-app-header-title", children: [navButton !== undefined ? navButton : appShellContext ? _jsx(AppHeaderNavButton, {}) : null, _jsx(CimpressLogo, { height: 24 }), _jsx(Divider, { orientation: "vertical" }), _jsx(Text, { as: "h1", variant: "title-5", tone: "base", children: _jsx(Link, { ...titleLinkProps, UNSAFE_className: "cim-app-header-title-link", children: title }) }), postTitle] }), search && _jsx("div", { className: "cim-app-header-search", children: search }), _jsx("div", { className: "cim-app-header-tools", children: isMobile && tools ? (_jsxs(PopoverRoot, { children: [_jsx(IconButton, { icon: _jsx(IconMenuMoreVertical, {}), "aria-label": "Expand/collapse header", variant: "tertiary", size: "small" }), _jsx(Popover, { "aria-label": "Expanded header", placement: "bottom end", children: _jsx("div", { className: "cim-app-header-tools-collapsed", children: tools }) })] })) : (tools) })] }));
+    return (_jsxs("header", { ...props, ref: ref, className: clsx('cim-app-header', UNSAFE_className), style: UNSAFE_style, "data-react-aria-top-layer": appShellContext?.mobileNavIsOpen || undefined, children: [_jsxs("div", { className: "cim-app-header-title", children: [navButton !== undefined ? (navButton) : appShellContext ? (_jsx(AppHeaderNavButton, { "data-app-shell-controlled": true })) : null, _jsx(CimpressLogo, { height: 24 }), _jsx(Divider, { orientation: "vertical" }), _jsx(Text, { as: "h1", variant: "title-5", tone: "base", children: _jsx(Link, { ...titleLinkProps, UNSAFE_className: "cim-app-header-title-link", children: title }) }), postTitle] }), search && _jsx("div", { className: "cim-app-header-search", children: search }), _jsx("div", { className: "cim-app-header-tools", children: isMobile && tools ? (_jsxs(PopoverRoot, { children: [_jsx(IconButton, { icon: _jsx(IconMenuMoreVertical, {}), "aria-label": "Expand/collapse header", variant: "tertiary", size: "small" }), _jsx(Popover, { "aria-label": "Expanded header", placement: "bottom end", children: _jsx("div", { className: "cim-app-header-tools-collapsed", children: tools }) })] })) : (tools) })] }));
 }
 /**
  * Displays a basic application header.

package/dist/esm/components/app-header/app-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-header.js","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenuMoreVertical } from '../../icons/index.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { Divider } from '../divider/divider.js';\nimport { Popover, PopoverRoot } from '../popover/popover.js';\nimport type { CommonProps, Href, NavigationProps, WithRequired } from '../types.js';\nimport { Link } from '../typography/link.js';\nimport { Text } from '../typography/text.js';\nimport { CimpressLogo } from './cimpress-logo.js';\nimport { UNSTABLE_AppHeaderNavButton as AppHeaderNavButton } from './nav-button.js';\n\nexport interface AppHeaderTitleLinkProps extends WithRequired<NavigationProps, 'href'> {}\n\nexport interface AppHeaderProps extends CommonProps {\n  /** The title displayed in the header, usually the application name. Rendered as an `<h1>` element. */\n  title: string;\n  /** The props of the link that is rendered around the header title. */\n  titleLink: Href | AppHeaderTitleLinkProps;\n  /** The tools to render at the end of the header. */\n  tools?: ReactNode;\n  UNSTABLE_navButton?: ReactNode;\n  UNSTABLE_postTitle?: ReactNode;\n  UNSTABLE_search?: ReactNode;\n}\n\nfunction AppHeader(\n  {\n    title,\n    titleLink,\n    tools,\n    UNSTABLE_navButton: navButton,\n    UNSTABLE_postTitle: postTitle,\n    UNSTABLE_search: search,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: AppHeaderProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const isMobile = useIsMobile();\n  const appShellContext = useContext(AppShellContext);\n  const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };\n\n  return (\n    <header\n      {...props}\n      ref={ref}\n      className={clsx('cim-app-header', UNSAFE_className)}\n      style={UNSAFE_style}\n      data-react-aria-top-layer={appShellContext?.sideNavIsOpen || undefined}\n    >\n      <div className=\"cim-app-header-title\">\n        {navButton !== undefined ? navButton : appShellContext ? <AppHeaderNavButton /> : null}\n        <CimpressLogo height={24} />\n        <Divider orientation=\"vertical\" />\n        <Text as=\"h1\" variant=\"title-5\" tone=\"base\">\n          <Link {...titleLinkProps} UNSAFE_className=\"cim-app-header-title-link\">\n            {title}\n          </Link>\n        </Text>\n\n        {postTitle}\n      </div>\n\n      {search && <div className=\"cim-app-header-search\">{search}</div>}\n\n      <div className=\"cim-app-header-tools\">\n        {isMobile && tools ? (\n          <PopoverRoot>\n            <IconButton\n              icon={<IconMenuMoreVertical />}\n              // TODO: i18n\n              aria-label=\"Expand/collapse header\"\n              variant=\"tertiary\"\n              size=\"small\"\n            />\n            <Popover aria-label=\"Expanded header\" placement=\"bottom end\">\n              <div className=\"cim-app-header-tools-collapsed\">{tools}</div>\n            </Popover>\n          </PopoverRoot>\n        ) : (\n          tools\n        )}\n      </div>\n    </header>\n  );\n}\n\n/**\n * Displays a basic application header.\n *\n * See [app header usage guidelines](https://ui.cimpress.io/components/app-header/).\n */\nconst _AppHeader = forwardRef(AppHeader, 'AppHeader');\n\nexport { _AppHeader as AppHeader };\n"]}
+{"version":3,"file":"app-header.js","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,UAAU,EAAqC,MAAM,OAAO,CAAC;AACtE,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAE7D,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,2BAA2B,IAAI,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAgBpF,SAAS,SAAS,CAChB,EACE,KAAK,EACL,SAAS,EACT,KAAK,EACL,kBAAkB,EAAE,SAAS,EAC7B,kBAAkB,EAAE,SAAS,EAC7B,eAAe,EAAE,MAAM,EACvB,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACO,EACjB,GAAiC;IAEjC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,eAAe,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IACpD,MAAM,cAAc,GAAG,OAAO,SAAS,KAAK,QAAQ,IAAI,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;IAE9G,OAAO,CACL,qBACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,EACnD,KAAK,EAAE,YAAY,+BACQ,eAAe,EAAE,eAAe,IAAI,SAAS,aAExE,eAAK,SAAS,EAAC,sBAAsB,aAClC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,SAAS,CACV,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CACpB,KAAC,kBAAkB,wCAA6B,CACjD,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,YAAY,IAAC,MAAM,EAAE,EAAE,GAAI,EAC5B,KAAC,OAAO,IAAC,WAAW,EAAC,UAAU,GAAG,EAClC,KAAC,IAAI,IAAC,EAAE,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,YACzC,KAAC,IAAI,OAAK,cAAc,EAAE,gBAAgB,EAAC,2BAA2B,YACnE,KAAK,GACD,GACF,EAEN,SAAS,IACN,EAEL,MAAM,IAAI,cAAK,SAAS,EAAC,uBAAuB,YAAE,MAAM,GAAO,EAEhE,cAAK,SAAS,EAAC,sBAAsB,YAClC,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC,CACnB,MAAC,WAAW,eACV,KAAC,UAAU,IACT,IAAI,EAAE,KAAC,oBAAoB,KAAG,gBAEnB,wBAAwB,EACnC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,EACF,KAAC,OAAO,kBAAY,iBAAiB,EAAC,SAAS,EAAC,YAAY,YAC1D,cAAK,SAAS,EAAC,gCAAgC,YAAE,KAAK,GAAO,GACrD,IACE,CACf,CAAC,CAAC,CAAC,CACF,KAAK,CACN,GACG,IACC,CACV,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,GAAG,UAAU,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAEtD,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenuMoreVertical } from '../../icons/index.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { AppShellContext } from '../app-shell/app-shell-context.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { Divider } from '../divider/divider.js';\nimport { Popover, PopoverRoot } from '../popover/popover.js';\nimport type { CommonProps, Href, NavigationProps, WithRequired } from '../types.js';\nimport { Link } from '../typography/link.js';\nimport { Text } from '../typography/text.js';\nimport { CimpressLogo } from './cimpress-logo.js';\nimport { UNSTABLE_AppHeaderNavButton as AppHeaderNavButton } from './nav-button.js';\n\nexport interface AppHeaderTitleLinkProps extends WithRequired<NavigationProps, 'href'> {}\n\nexport interface AppHeaderProps extends CommonProps {\n  /** The title displayed in the header, usually the application name. Rendered as an `<h1>` element. */\n  title: string;\n  /** The props of the link that is rendered around the header title. */\n  titleLink: Href | AppHeaderTitleLinkProps;\n  /** The tools to render at the end of the header. */\n  tools?: ReactNode;\n  UNSTABLE_navButton?: ReactNode;\n  UNSTABLE_postTitle?: ReactNode;\n  UNSTABLE_search?: ReactNode;\n}\n\nfunction AppHeader(\n  {\n    title,\n    titleLink,\n    tools,\n    UNSTABLE_navButton: navButton,\n    UNSTABLE_postTitle: postTitle,\n    UNSTABLE_search: search,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: AppHeaderProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const isMobile = useIsMobile();\n  const appShellContext = useContext(AppShellContext);\n  const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };\n\n  return (\n    <header\n      {...props}\n      ref={ref}\n      className={clsx('cim-app-header', UNSAFE_className)}\n      style={UNSAFE_style}\n      data-react-aria-top-layer={appShellContext?.mobileNavIsOpen || undefined}\n    >\n      <div className=\"cim-app-header-title\">\n        {navButton !== undefined ? (\n          navButton\n        ) : appShellContext ? (\n          <AppHeaderNavButton data-app-shell-controlled />\n        ) : null}\n        <CimpressLogo height={24} />\n        <Divider orientation=\"vertical\" />\n        <Text as=\"h1\" variant=\"title-5\" tone=\"base\">\n          <Link {...titleLinkProps} UNSAFE_className=\"cim-app-header-title-link\">\n            {title}\n          </Link>\n        </Text>\n\n        {postTitle}\n      </div>\n\n      {search && <div className=\"cim-app-header-search\">{search}</div>}\n\n      <div className=\"cim-app-header-tools\">\n        {isMobile && tools ? (\n          <PopoverRoot>\n            <IconButton\n              icon={<IconMenuMoreVertical />}\n              // TODO: i18n\n              aria-label=\"Expand/collapse header\"\n              variant=\"tertiary\"\n              size=\"small\"\n            />\n            <Popover aria-label=\"Expanded header\" placement=\"bottom end\">\n              <div className=\"cim-app-header-tools-collapsed\">{tools}</div>\n            </Popover>\n          </PopoverRoot>\n        ) : (\n          tools\n        )}\n      </div>\n    </header>\n  );\n}\n\n/**\n * Displays a basic application header.\n *\n * See [app header usage guidelines](https://ui.cimpress.io/components/app-header/).\n */\nconst _AppHeader = forwardRef(AppHeader, 'AppHeader');\n\nexport { _AppHeader as AppHeader };\n"]}

package/dist/esm/components/app-header/nav-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,WAAW,gCAAiC,SAAQ,WAAW;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA4BD,QAAA,MAAM,4BAA4B,qLAAgF,CAAC;AAEnH,OAAO,EAAE,4BAA4B,IAAI,2BAA2B,EAAE,CAAC"}
+{"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,WAAW,gCAAiC,SAAQ,WAAW;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA6BD,QAAA,MAAM,4BAA4B,qLAAgF,CAAC;AAEnH,OAAO,EAAE,4BAA4B,IAAI,2BAA2B,EAAE,CAAC"}

package/dist/esm/components/app-header/nav-button.js

@@ -6,13 +6,13 @@ import { IconMenu } from '../../icons/index.js';
 import { withStyleProps } from '../../with-style-props.js';
 import { AppShellContext } from '../app-shell/app-shell-context.js';
 import { IconButton } from '../button/icon-button.js';
-function UNSTABLE_AppHeaderNavButton({ isOpen, onPress, UNSAFE_className, UNSAFE_style }, ref) {
+function UNSTABLE_AppHeaderNavButton({ isOpen, onPress, UNSAFE_className, UNSAFE_style, ...props }, ref) {
     const appShellContext = useContext(AppShellContext);
     const handlePress = () => {
         onPress?.();
         appShellContext?.toggleSideNav();
     };
-    return (_jsx(IconButton, { "aria-expanded": isOpen ?? appShellContext?.sideNavIsOpen, icon: _jsx(IconMenu, {}), "aria-label": "Open menu", variant: "tertiary", onPress: handlePress, ref: ref, UNSAFE_className: clsx('cim-app-header-nav-toggle', UNSAFE_className), UNSAFE_style: UNSAFE_style }));
+    return (_jsx(IconButton, { ...props, "aria-expanded": isOpen ?? appShellContext?.mobileNavIsOpen, icon: _jsx(IconMenu, {}), "aria-label": "Open menu", variant: "tertiary", onPress: handlePress, ref: ref, UNSAFE_className: clsx('cim-app-header-nav-toggle', UNSAFE_className), UNSAFE_style: UNSAFE_style }));
 }
 const _UNSTABLE_AppHeaderNavButton = withStyleProps(forwardRef(UNSTABLE_AppHeaderNavButton, 'AppHeaderNavButton'));
 export { _UNSTABLE_AppHeaderNavButton as UNSTABLE_AppHeaderNavButton };