@cimpress-ui/react 1.25.2 → 1.26.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (191) hide show
  1. package/dist/commonjs/components/app-header/app-header.d.ts +1 -1
  2. package/dist/commonjs/components/app-header/app-header.d.ts.map +1 -1
  3. package/dist/commonjs/components/app-header/app-header.js +5 -1
  4. package/dist/commonjs/components/app-header/app-header.js.map +1 -1
  5. package/dist/commonjs/components/app-header/nav-button.d.ts +2 -2
  6. package/dist/commonjs/components/app-header/nav-button.d.ts.map +1 -1
  7. package/dist/commonjs/components/app-header/nav-button.js +8 -1
  8. package/dist/commonjs/components/app-header/nav-button.js.map +1 -1
  9. package/dist/commonjs/components/app-shell/app-shell-context.d.ts +2 -0
  10. package/dist/commonjs/components/app-shell/app-shell-context.d.ts.map +1 -0
  11. package/dist/commonjs/components/app-shell/app-shell-context.js +7 -0
  12. package/dist/commonjs/components/app-shell/app-shell-context.js.map +1 -0
  13. package/dist/commonjs/components/app-shell/app-shell.d.ts +1 -1
  14. package/dist/commonjs/components/app-shell/app-shell.d.ts.map +1 -1
  15. package/dist/commonjs/components/app-shell/app-shell.js +12 -2
  16. package/dist/commonjs/components/app-shell/app-shell.js.map +1 -1
  17. package/dist/commonjs/components/internal/input/input.d.ts +0 -6
  18. package/dist/commonjs/components/internal/input/input.d.ts.map +1 -1
  19. package/dist/commonjs/components/internal/input/input.js +6 -22
  20. package/dist/commonjs/components/internal/input/input.js.map +1 -1
  21. package/dist/commonjs/components/select/select.d.ts.map +1 -1
  22. package/dist/commonjs/components/select/select.js +11 -2
  23. package/dist/commonjs/components/select/select.js.map +1 -1
  24. package/dist/commonjs/components/{app-header → side-nav}/side-nav.d.ts +12 -1
  25. package/dist/commonjs/components/side-nav/side-nav.d.ts.map +1 -0
  26. package/dist/commonjs/components/side-nav/side-nav.js +56 -0
  27. package/dist/commonjs/components/side-nav/side-nav.js.map +1 -0
  28. package/dist/commonjs/components/slider/slider.d.ts.map +1 -1
  29. package/dist/commonjs/components/slider/slider.js +6 -2
  30. package/dist/commonjs/components/slider/slider.js.map +1 -1
  31. package/dist/commonjs/icons/case-lower.d.ts +8 -0
  32. package/dist/commonjs/icons/case-lower.d.ts.map +1 -0
  33. package/dist/commonjs/icons/case-lower.js +24 -0
  34. package/dist/commonjs/icons/case-lower.js.map +1 -0
  35. package/dist/commonjs/icons/case-normal.d.ts +8 -0
  36. package/dist/commonjs/icons/case-normal.d.ts.map +1 -0
  37. package/dist/commonjs/icons/case-normal.js +24 -0
  38. package/dist/commonjs/icons/case-normal.js.map +1 -0
  39. package/dist/commonjs/icons/case-upper.d.ts +8 -0
  40. package/dist/commonjs/icons/case-upper.d.ts.map +1 -0
  41. package/dist/commonjs/icons/case-upper.js +24 -0
  42. package/dist/commonjs/icons/case-upper.js.map +1 -0
  43. package/dist/commonjs/icons/chevron-double-down.d.ts +8 -0
  44. package/dist/commonjs/icons/chevron-double-down.d.ts.map +1 -0
  45. package/dist/commonjs/icons/chevron-double-down.js +24 -0
  46. package/dist/commonjs/icons/chevron-double-down.js.map +1 -0
  47. package/dist/commonjs/icons/chevron-double-left.d.ts +8 -0
  48. package/dist/commonjs/icons/chevron-double-left.d.ts.map +1 -0
  49. package/dist/commonjs/icons/chevron-double-left.js +24 -0
  50. package/dist/commonjs/icons/chevron-double-left.js.map +1 -0
  51. package/dist/commonjs/icons/chevron-double-right.d.ts +8 -0
  52. package/dist/commonjs/icons/chevron-double-right.d.ts.map +1 -0
  53. package/dist/commonjs/icons/chevron-double-right.js +24 -0
  54. package/dist/commonjs/icons/chevron-double-right.js.map +1 -0
  55. package/dist/commonjs/icons/chevron-double-up.d.ts +8 -0
  56. package/dist/commonjs/icons/chevron-double-up.d.ts.map +1 -0
  57. package/dist/commonjs/icons/chevron-double-up.js +24 -0
  58. package/dist/commonjs/icons/chevron-double-up.js.map +1 -0
  59. package/dist/commonjs/icons/cut.d.ts +8 -0
  60. package/dist/commonjs/icons/cut.d.ts.map +1 -0
  61. package/dist/commonjs/icons/cut.js +24 -0
  62. package/dist/commonjs/icons/cut.js.map +1 -0
  63. package/dist/commonjs/icons/drag-handle.d.ts +8 -0
  64. package/dist/commonjs/icons/drag-handle.d.ts.map +1 -0
  65. package/dist/commonjs/icons/drag-handle.js +24 -0
  66. package/dist/commonjs/icons/drag-handle.js.map +1 -0
  67. package/dist/commonjs/icons/file-text.d.ts +8 -0
  68. package/dist/commonjs/icons/file-text.d.ts.map +1 -0
  69. package/dist/commonjs/icons/file-text.js +24 -0
  70. package/dist/commonjs/icons/file-text.js.map +1 -0
  71. package/dist/commonjs/icons/file.d.ts +8 -0
  72. package/dist/commonjs/icons/file.d.ts.map +1 -0
  73. package/dist/commonjs/icons/file.js +24 -0
  74. package/dist/commonjs/icons/file.js.map +1 -0
  75. package/dist/commonjs/icons/index.d.ts +11 -0
  76. package/dist/commonjs/icons/index.d.ts.map +1 -1
  77. package/dist/commonjs/icons/index.js +27 -5
  78. package/dist/commonjs/icons/index.js.map +1 -1
  79. package/dist/commonjs/index.d.ts +2 -2
  80. package/dist/commonjs/index.d.ts.map +1 -1
  81. package/dist/commonjs/index.js +2 -2
  82. package/dist/commonjs/index.js.map +1 -1
  83. package/dist/commonjs/utils/breakpoints.d.ts +9 -0
  84. package/dist/commonjs/utils/breakpoints.d.ts.map +1 -0
  85. package/dist/commonjs/utils/breakpoints.js +39 -0
  86. package/dist/commonjs/utils/breakpoints.js.map +1 -0
  87. package/dist/commonjs/utils/use-is-mobile.js +2 -2
  88. package/dist/commonjs/utils/use-is-mobile.js.map +1 -1
  89. package/dist/commonjs/utils/use-media-query.d.ts +4 -1
  90. package/dist/commonjs/utils/use-media-query.d.ts.map +1 -1
  91. package/dist/commonjs/utils/use-media-query.js.map +1 -1
  92. package/dist/esm/components/app-header/app-header.d.ts +1 -1
  93. package/dist/esm/components/app-header/app-header.d.ts.map +1 -1
  94. package/dist/esm/components/app-header/app-header.js +5 -1
  95. package/dist/esm/components/app-header/app-header.js.map +1 -1
  96. package/dist/esm/components/app-header/nav-button.d.ts +2 -2
  97. package/dist/esm/components/app-header/nav-button.d.ts.map +1 -1
  98. package/dist/esm/components/app-header/nav-button.js +8 -1
  99. package/dist/esm/components/app-header/nav-button.js.map +1 -1
  100. package/dist/esm/components/app-shell/app-shell-context.d.ts +2 -0
  101. package/dist/esm/components/app-shell/app-shell-context.d.ts.map +1 -0
  102. package/dist/esm/components/app-shell/app-shell-context.js +4 -0
  103. package/dist/esm/components/app-shell/app-shell-context.js.map +1 -0
  104. package/dist/esm/components/app-shell/app-shell.d.ts +1 -1
  105. package/dist/esm/components/app-shell/app-shell.d.ts.map +1 -1
  106. package/dist/esm/components/app-shell/app-shell.js +12 -2
  107. package/dist/esm/components/app-shell/app-shell.js.map +1 -1
  108. package/dist/esm/components/internal/input/input.d.ts +0 -6
  109. package/dist/esm/components/internal/input/input.d.ts.map +1 -1
  110. package/dist/esm/components/internal/input/input.js +6 -22
  111. package/dist/esm/components/internal/input/input.js.map +1 -1
  112. package/dist/esm/components/select/select.d.ts.map +1 -1
  113. package/dist/esm/components/select/select.js +11 -2
  114. package/dist/esm/components/select/select.js.map +1 -1
  115. package/dist/esm/components/{app-header → side-nav}/side-nav.d.ts +12 -1
  116. package/dist/esm/components/side-nav/side-nav.d.ts.map +1 -0
  117. package/dist/esm/components/side-nav/side-nav.js +50 -0
  118. package/dist/esm/components/side-nav/side-nav.js.map +1 -0
  119. package/dist/esm/components/slider/slider.d.ts.map +1 -1
  120. package/dist/esm/components/slider/slider.js +6 -2
  121. package/dist/esm/components/slider/slider.js.map +1 -1
  122. package/dist/esm/icons/case-lower.d.ts +8 -0
  123. package/dist/esm/icons/case-lower.d.ts.map +1 -0
  124. package/dist/esm/icons/case-lower.js +19 -0
  125. package/dist/esm/icons/case-lower.js.map +1 -0
  126. package/dist/esm/icons/case-normal.d.ts +8 -0
  127. package/dist/esm/icons/case-normal.d.ts.map +1 -0
  128. package/dist/esm/icons/case-normal.js +19 -0
  129. package/dist/esm/icons/case-normal.js.map +1 -0
  130. package/dist/esm/icons/case-upper.d.ts +8 -0
  131. package/dist/esm/icons/case-upper.d.ts.map +1 -0
  132. package/dist/esm/icons/case-upper.js +19 -0
  133. package/dist/esm/icons/case-upper.js.map +1 -0
  134. package/dist/esm/icons/chevron-double-down.d.ts +8 -0
  135. package/dist/esm/icons/chevron-double-down.d.ts.map +1 -0
  136. package/dist/esm/icons/chevron-double-down.js +19 -0
  137. package/dist/esm/icons/chevron-double-down.js.map +1 -0
  138. package/dist/esm/icons/chevron-double-left.d.ts +8 -0
  139. package/dist/esm/icons/chevron-double-left.d.ts.map +1 -0
  140. package/dist/esm/icons/chevron-double-left.js +19 -0
  141. package/dist/esm/icons/chevron-double-left.js.map +1 -0
  142. package/dist/esm/icons/chevron-double-right.d.ts +8 -0
  143. package/dist/esm/icons/chevron-double-right.d.ts.map +1 -0
  144. package/dist/esm/icons/chevron-double-right.js +19 -0
  145. package/dist/esm/icons/chevron-double-right.js.map +1 -0
  146. package/dist/esm/icons/chevron-double-up.d.ts +8 -0
  147. package/dist/esm/icons/chevron-double-up.d.ts.map +1 -0
  148. package/dist/esm/icons/chevron-double-up.js +19 -0
  149. package/dist/esm/icons/chevron-double-up.js.map +1 -0
  150. package/dist/esm/icons/cut.d.ts +8 -0
  151. package/dist/esm/icons/cut.d.ts.map +1 -0
  152. package/dist/esm/icons/cut.js +19 -0
  153. package/dist/esm/icons/cut.js.map +1 -0
  154. package/dist/esm/icons/drag-handle.d.ts +8 -0
  155. package/dist/esm/icons/drag-handle.d.ts.map +1 -0
  156. package/dist/esm/icons/drag-handle.js +19 -0
  157. package/dist/esm/icons/drag-handle.js.map +1 -0
  158. package/dist/esm/icons/file-text.d.ts +8 -0
  159. package/dist/esm/icons/file-text.d.ts.map +1 -0
  160. package/dist/esm/icons/file-text.js +19 -0
  161. package/dist/esm/icons/file-text.js.map +1 -0
  162. package/dist/esm/icons/file.d.ts +8 -0
  163. package/dist/esm/icons/file.d.ts.map +1 -0
  164. package/dist/esm/icons/file.js +19 -0
  165. package/dist/esm/icons/file.js.map +1 -0
  166. package/dist/esm/icons/index.d.ts +11 -0
  167. package/dist/esm/icons/index.d.ts.map +1 -1
  168. package/dist/esm/icons/index.js +11 -0
  169. package/dist/esm/icons/index.js.map +1 -1
  170. package/dist/esm/index.d.ts +2 -2
  171. package/dist/esm/index.d.ts.map +1 -1
  172. package/dist/esm/index.js +2 -2
  173. package/dist/esm/index.js.map +1 -1
  174. package/dist/esm/utils/breakpoints.d.ts +9 -0
  175. package/dist/esm/utils/breakpoints.d.ts.map +1 -0
  176. package/dist/esm/utils/breakpoints.js +35 -0
  177. package/dist/esm/utils/breakpoints.js.map +1 -0
  178. package/dist/esm/utils/use-is-mobile.js +2 -2
  179. package/dist/esm/utils/use-is-mobile.js.map +1 -1
  180. package/dist/esm/utils/use-media-query.d.ts +4 -1
  181. package/dist/esm/utils/use-media-query.d.ts.map +1 -1
  182. package/dist/esm/utils/use-media-query.js.map +1 -1
  183. package/dist-styles/core.css +1 -1
  184. package/dist-styles/styles.css +1 -1
  185. package/package.json +1 -1
  186. package/dist/commonjs/components/app-header/side-nav.d.ts.map +0 -1
  187. package/dist/commonjs/components/app-header/side-nav.js +0 -36
  188. package/dist/commonjs/components/app-header/side-nav.js.map +0 -1
  189. package/dist/esm/components/app-header/side-nav.d.ts.map +0 -1
  190. package/dist/esm/components/app-header/side-nav.js +0 -30
  191. package/dist/esm/components/app-header/side-nav.js.map +0 -1
@@ -1,4 +1,4 @@
1
- import type { ReactNode } from 'react';
1
+ import { type ReactNode } from 'react';
2
2
  import type { CommonProps, Href, NavigationProps, WithRequired } from '../types.js';
3
3
  export interface AppHeaderTitleLinkProps extends WithRequired<NavigationProps, 'href'> {
4
4
  }
@@ -1 +1 @@
1
- {"version":3,"file":"app-header.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAOrD,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAKpF,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;AA2DD;;;;GAIG;AACH,QAAA,MAAM,UAAU,+GAAqC,CAAC;AAEtD,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
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"}
@@ -7,19 +7,23 @@ Object.defineProperty(exports, "__esModule", { value: true });
7
7
  exports.AppHeader = void 0;
8
8
  const jsx_runtime_1 = require("react/jsx-runtime");
9
9
  const clsx_1 = __importDefault(require("clsx"));
10
+ const react_1 = require("react");
10
11
  const forward_ref_js_1 = require("../../forward-ref.js");
11
12
  const index_js_1 = require("../../icons/index.js");
12
13
  const use_is_mobile_js_1 = require("../../utils/use-is-mobile.js");
14
+ const app_shell_context_js_1 = require("../app-shell/app-shell-context.js");
13
15
  const icon_button_js_1 = require("../button/icon-button.js");
14
16
  const divider_js_1 = require("../divider/divider.js");
15
17
  const popover_js_1 = require("../popover/popover.js");
16
18
  const link_js_1 = require("../typography/link.js");
17
19
  const text_js_1 = require("../typography/text.js");
18
20
  const cimpress_logo_js_1 = require("./cimpress-logo.js");
21
+ const nav_button_js_1 = require("./nav-button.js");
19
22
  function AppHeader({ title, titleLink, tools, UNSTABLE_navButton: navButton, UNSTABLE_postTitle: postTitle, UNSTABLE_search: search, UNSAFE_className, UNSAFE_style, ...props }, ref) {
20
23
  const isMobile = (0, use_is_mobile_js_1.useIsMobile)();
24
+ const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
21
25
  const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };
22
- return ((0, jsx_runtime_1.jsxs)("header", { ...props, ref: ref, className: (0, clsx_1.default)('cim-app-header', UNSAFE_className), style: UNSAFE_style, children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-app-header-title", children: [navButton, (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) })] }));
26
+ 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) })] }));
23
27
  }
24
28
  /**
25
29
  * Displays a basic application header.
@@ -1 +1 @@
1
- {"version":3,"file":"app-header.js","sourceRoot":"","sources":["../../../../src/components/app-header/app-header.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AAExB,yDAAkD;AAClD,mDAA4D;AAC5D,mEAA2D;AAC3D,6DAAsD;AACtD,sDAAgD;AAChD,sDAA6D;AAE7D,mDAA6C;AAC7C,mDAA6C;AAC7C,yDAAkD;AAgBlD,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;IAE/B,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,uCAAY,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,gBAAgB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,aACnG,iCAAK,SAAS,EAAC,sBAAsB,aAClC,SAAS,EACV,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 type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenuMoreVertical } from '../../icons/index.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.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';\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\n const titleLinkProps = typeof titleLink === 'object' && 'href' in titleLink ? titleLink : { href: titleLink };\n\n return (\n <header {...props} ref={ref} className={clsx('cim-app-header', UNSAFE_className)} style={UNSAFE_style}>\n <div className=\"cim-app-header-title\">\n {navButton}\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"]}
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"]}
@@ -1,7 +1,7 @@
1
1
  import type { CommonProps } from '../types.js';
2
2
  export interface UNSTABLE_AppHeaderNavButtonProps extends CommonProps {
3
- isOpen: boolean;
4
- onPress: () => void;
3
+ isOpen?: boolean;
4
+ onPress?: () => void;
5
5
  }
6
6
  declare const _UNSTABLE_AppHeaderNavButton: (props: UNSTABLE_AppHeaderNavButtonProps & import("react").RefAttributes<HTMLButtonElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
7
7
  export { _UNSTABLE_AppHeaderNavButton as UNSTABLE_AppHeaderNavButton };
@@ -1 +1 @@
1
- {"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,WAAW,gCAAiC,SAAQ,WAAW;IACnE,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAsBD,QAAA,MAAM,4BAA4B,qLAAgF,CAAC;AAEnH,OAAO,EAAE,4BAA4B,IAAI,2BAA2B,EAAE,CAAC"}
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"}
@@ -6,12 +6,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.UNSTABLE_AppHeaderNavButton = void 0;
7
7
  const jsx_runtime_1 = require("react/jsx-runtime");
8
8
  const clsx_1 = __importDefault(require("clsx"));
9
+ const react_1 = require("react");
9
10
  const forward_ref_js_1 = require("../../forward-ref.js");
10
11
  const index_js_1 = require("../../icons/index.js");
11
12
  const with_style_props_js_1 = require("../../with-style-props.js");
13
+ const app_shell_context_js_1 = require("../app-shell/app-shell-context.js");
12
14
  const icon_button_js_1 = require("../button/icon-button.js");
13
15
  function UNSTABLE_AppHeaderNavButton({ isOpen, onPress, UNSAFE_className, UNSAFE_style }, ref) {
14
- return ((0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { "aria-expanded": isOpen, icon: (0, jsx_runtime_1.jsx)(index_js_1.IconMenu, {}), size: "small", "aria-label": "Open menu", variant: "tertiary", onPress: onPress, ref: ref, UNSAFE_className: (0, clsx_1.default)('cim-app-header-nav-toggle', UNSAFE_className), UNSAFE_style: UNSAFE_style }));
16
+ const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
17
+ const handlePress = () => {
18
+ onPress?.();
19
+ appShellContext?.toggleSideNav();
20
+ };
21
+ 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 }));
15
22
  }
16
23
  const _UNSTABLE_AppHeaderNavButton = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UNSTABLE_AppHeaderNavButton, 'AppHeaderNavButton'));
17
24
  exports.UNSTABLE_AppHeaderNavButton = _UNSTABLE_AppHeaderNavButton;
@@ -1 +1 @@
1
- {"version":3,"file":"nav-button.js","sourceRoot":"","sources":["../../../../src/components/app-header/nav-button.tsx"],"names":[],"mappings":";;;;;;;AAAA,gDAAwB;AAExB,yDAAkD;AAClD,mDAAgD;AAChD,mEAA2D;AAC3D,6DAAsD;AAQtD,SAAS,2BAA2B,CAClC,EAAE,MAAM,EAAE,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAoC,EACrF,GAAoC;IAEpC,OAAO,CACL,uBAAC,2BAAU,qBACM,MAAM,EACrB,IAAI,EAAE,uBAAC,mBAAQ,KAAG,EAClB,IAAI,EAAC,OAAO,gBAED,WAAW,EACtB,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,OAAO,EAChB,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 type { ForwardedRef } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconMenu } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.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 return (\n <IconButton\n aria-expanded={isOpen}\n icon={<IconMenu />}\n size=\"small\"\n // TODO\n aria-label=\"Open menu\"\n variant=\"tertiary\"\n onPress={onPress}\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"]}
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"]}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=app-shell-context.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"app-shell-context.d.ts","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell-context.tsx"],"names":[],"mappings":""}
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.AppShellContext = void 0;
4
+ const react_1 = require("react");
5
+ /** @internal */
6
+ exports.AppShellContext = (0, react_1.createContext)(null);
7
+ //# sourceMappingURL=app-shell-context.js.map
@@ -0,0 +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"]}
@@ -1,4 +1,4 @@
1
- import type { ReactNode } from 'react';
1
+ import { type ReactNode } from 'react';
2
2
  import type { CommonProps } from '../types.js';
3
3
  export interface UNSTABLE_AppShellProps extends CommonProps {
4
4
  children: ReactNode;
@@ -1 +1 @@
1
- {"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/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,2CAM/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"}
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"}
@@ -7,10 +7,20 @@ exports.UNSTABLE_AppShell = UNSTABLE_AppShell;
7
7
  exports.UNSTABLE_AppShellBody = UNSTABLE_AppShellBody;
8
8
  const jsx_runtime_1 = require("react/jsx-runtime");
9
9
  const clsx_1 = __importDefault(require("clsx"));
10
+ const react_1 = require("react");
11
+ const use_is_mobile_js_1 = require("../../utils/use-is-mobile.js");
12
+ const app_shell_context_js_1 = require("./app-shell-context.js");
10
13
  function UNSTABLE_AppShell({ children, UNSAFE_className, UNSAFE_style, ...props }) {
11
- return ((0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-app-shell', UNSAFE_className), style: UNSAFE_style, ...props, children: children }));
14
+ const [sideNavIsOpen, setSideNavIsOpen] = (0, react_1.useState)(true);
15
+ const toggleSideNav = (0, react_1.useCallback)((isOpen) => {
16
+ setSideNavIsOpen((prevIsOpen) => isOpen ?? !prevIsOpen);
17
+ }, []);
18
+ 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 }) }));
12
19
  }
13
20
  function UNSTABLE_AppShellBody({ children, UNSAFE_className, UNSAFE_style, ...props }) {
14
- return ((0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-app-shell-body', UNSAFE_className), style: UNSAFE_style, ...props, children: children }));
21
+ const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
22
+ const sideNavIsOpen = appShellContext?.sideNavIsOpen ?? false;
23
+ const isMobile = (0, use_is_mobile_js_1.useIsMobile)();
24
+ 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 }));
15
25
  }
16
26
  //# sourceMappingURL=app-shell.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"app-shell.js","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":";;;;;AAQA,8CAMC;AAMD,sDAWC;;AA/BD,gDAAwB;AAQxB,SAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAA0B;IAC9G,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,cAAI,EAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,KAAM,KAAK,YACpF,QAAQ,GACL,CACP,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 type { ReactNode } from 'react';\nimport type { CommonProps } from '../types.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 return (\n <div className={clsx('cim-app-shell', UNSAFE_className)} style={UNSAFE_style} {...props}>\n {children}\n </div>\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"]}
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"]}
@@ -1,8 +1,2 @@
1
- import { type InputProps as RACInputProps } from 'react-aria-components';
2
- import type { CommonProps } from '../../types.js';
3
- interface InputProps extends CommonProps, Exclude<RACInputProps, 'className' | 'style'> {
4
- width?: 'fit-content' | 'full-width';
5
- }
6
- export declare function Input(props: InputProps): import("react/jsx-runtime").JSX.Element;
7
1
  export {};
8
2
  //# sourceMappingURL=input.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../../src/components/internal/input/input.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,KAAK,UAAU,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC5F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,UAAU,UAAW,SAAQ,WAAW,EAAE,OAAO,CAAC,aAAa,EAAE,WAAW,GAAG,OAAO,CAAC;IACrF,KAAK,CAAC,EAAE,aAAa,GAAG,YAAY,CAAC;CACtC;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,2CAqDtC"}
1
+ {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../../src/components/internal/input/input.tsx"],"names":[],"mappings":""}
@@ -5,32 +5,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.Input = Input;
7
7
  const jsx_runtime_1 = require("react/jsx-runtime");
8
- const utils_1 = require("@react-aria/utils");
9
8
  const clsx_1 = __importDefault(require("clsx"));
10
- const react_1 = require("react");
11
9
  const react_aria_components_1 = require("react-aria-components");
12
10
  const utils_js_1 = require("../../typography/utils.js");
11
+ /**
12
+ * Renders a styled input field.
13
+ * @internal
14
+ */
13
15
  function Input(props) {
14
- const inputRef = (0, react_1.useRef)(null);
15
16
  // TODO: find a better way to extract common props, if a new prop is added to `CommonProps` this will break
16
- const { id, UNSAFE_className, UNSAFE_style, 'data-cim-style-root': dataCimStyleRoot, width, ...inputProps } = props;
17
- // Field sizing based on input length for browsers that don't support `field-sizing: content`
18
- (0, utils_1.useLayoutEffect)(() => {
19
- const input = inputRef.current;
20
- function setInputLengthStyle() {
21
- // Ensure input value changes are flushed before updating input width, especially in Safari
22
- requestAnimationFrame(() => input?.style.setProperty('--cim-input-length', input?.value.length.toString() ?? '0'));
23
- }
24
- if (input != null) {
25
- setInputLengthStyle();
26
- input.addEventListener('input', setInputLengthStyle);
27
- input.addEventListener('change', setInputLengthStyle);
28
- }
29
- return () => {
30
- input?.removeEventListener('input', setInputLengthStyle);
31
- input?.removeEventListener('change', setInputLengthStyle);
32
- };
33
- }, []);
34
- return ((0, jsx_runtime_1.jsx)("div", { id: id, className: (0, clsx_1.default)('cim-input', UNSAFE_className), style: UNSAFE_style, "data-cim-style-root": dataCimStyleRoot, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Input, { ...inputProps, ref: inputRef, className: (0, clsx_1.default)('cim-input-control', (0, utils_js_1.textStyle)({ variant: 'body' })), "data-width": width }) }));
17
+ const { id, UNSAFE_className, UNSAFE_style, 'data-cim-style-root': dataCimStyleRoot, contentWidth, ...inputProps } = props;
18
+ return ((0, jsx_runtime_1.jsx)("div", { id: id, className: (0, clsx_1.default)('cim-input', UNSAFE_className), style: UNSAFE_style, "data-cim-style-root": dataCimStyleRoot, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Input, { ...inputProps, className: (0, clsx_1.default)('cim-input-control', (0, utils_js_1.textStyle)({ variant: 'body' })), style: { '--cim-input-content-width': contentWidth } }) }));
35
19
  }
36
20
  //# sourceMappingURL=input.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"input.js","sourceRoot":"","sources":["../../../../../src/components/internal/input/input.tsx"],"names":[],"mappings":";;;;;AAWA,sBAqDC;;AAhED,6CAAoD;AACpD,gDAAwB;AACxB,iCAA+B;AAC/B,iEAA4F;AAE5F,wDAAsD;AAMtD,SAAgB,KAAK,CAAC,KAAiB;IACrC,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAChD,2GAA2G;IAC3G,MAAM,EACJ,EAAE,EACF,gBAAgB,EAChB,YAAY,EACZ,qBAAqB,EAAE,gBAAgB,EAEvC,KAAK,EAEL,GAAG,UAAU,EACd,GAAG,KAAK,CAAC;IAEV,6FAA6F;IAC7F,IAAA,uBAAe,EAAC,GAAG,EAAE;QACnB,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC;QAE/B,SAAS,mBAAmB;YAC1B,2FAA2F;YAC3F,qBAAqB,CAAC,GAAG,EAAE,CACzB,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAI,GAAG,CAAC,CACtF,CAAC;QACJ,CAAC;QAED,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;YAClB,mBAAmB,EAAE,CAAC;YAEtB,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAAC;YACrD,KAAK,CAAC,gBAAgB,CAAC,QAAQ,EAAE,mBAAmB,CAAC,CAAC;QACxD,CAAC;QAED,OAAO,GAAG,EAAE;YACV,KAAK,EAAE,mBAAmB,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAAC;YACzD,KAAK,EAAE,mBAAmB,CAAC,QAAQ,EAAE,mBAAmB,CAAC,CAAC;QAC5D,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,gCACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,IAAA,cAAI,EAAC,WAAW,EAAE,gBAAgB,CAAC,EAC9C,KAAK,EAAE,YAAY,yBACE,gBAAgB,YAErC,uBAAC,6BAAQ,OACH,UAAU,EACd,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,IAAA,cAAI,EAAC,mBAAmB,EAAE,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,gBACxD,KAAK,GACjB,GACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["import { useLayoutEffect } from '@react-aria/utils';\nimport clsx from 'clsx';\nimport { useRef } from 'react';\nimport { Input as RACInput, type InputProps as RACInputProps } from 'react-aria-components';\nimport type { CommonProps } from '../../types.js';\nimport { textStyle } from '../../typography/utils.js';\n\ninterface InputProps extends CommonProps, Exclude<RACInputProps, 'className' | 'style'> {\n width?: 'fit-content' | 'full-width';\n}\n\nexport function Input(props: InputProps) {\n const inputRef = useRef<HTMLInputElement>(null);\n // TODO: find a better way to extract common props, if a new prop is added to `CommonProps` this will break\n const {\n id,\n UNSAFE_className,\n UNSAFE_style,\n 'data-cim-style-root': dataCimStyleRoot,\n\n width,\n\n ...inputProps\n } = props;\n\n // Field sizing based on input length for browsers that don't support `field-sizing: content`\n useLayoutEffect(() => {\n const input = inputRef.current;\n\n function setInputLengthStyle() {\n // Ensure input value changes are flushed before updating input width, especially in Safari\n requestAnimationFrame(() =>\n input?.style.setProperty('--cim-input-length', input?.value.length.toString() ?? '0'),\n );\n }\n\n if (input != null) {\n setInputLengthStyle();\n\n input.addEventListener('input', setInputLengthStyle);\n input.addEventListener('change', setInputLengthStyle);\n }\n\n return () => {\n input?.removeEventListener('input', setInputLengthStyle);\n input?.removeEventListener('change', setInputLengthStyle);\n };\n }, []);\n\n return (\n <div\n id={id}\n className={clsx('cim-input', UNSAFE_className)}\n style={UNSAFE_style}\n data-cim-style-root={dataCimStyleRoot}\n >\n <RACInput\n {...inputProps}\n ref={inputRef}\n className={clsx('cim-input-control', textStyle({ variant: 'body' }))}\n data-width={width}\n />\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"input.js","sourceRoot":"","sources":["../../../../../src/components/internal/input/input.tsx"],"names":[],"mappings":";;;;;AAcA,sBA2BC;;AAzCD,gDAAwB;AAExB,iEAA4F;AAE5F,wDAAsD;AAMtD;;;GAGG;AACH,SAAgB,KAAK,CAAC,KAAiB;IACrC,2GAA2G;IAC3G,MAAM,EACJ,EAAE,EACF,gBAAgB,EAChB,YAAY,EACZ,qBAAqB,EAAE,gBAAgB,EAEvC,YAAY,EAEZ,GAAG,UAAU,EACd,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,gCACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,IAAA,cAAI,EAAC,WAAW,EAAE,gBAAgB,CAAC,EAC9C,KAAK,EAAE,YAAY,yBACE,gBAAgB,YAErC,uBAAC,6BAAQ,OACH,UAAU,EACd,SAAS,EAAE,IAAA,cAAI,EAAC,mBAAmB,EAAE,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACpE,KAAK,EAAE,EAAE,2BAA2B,EAAE,YAAY,EAAmB,GACrE,GACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["import clsx from 'clsx';\nimport type { CSSProperties } from 'react';\nimport { Input as RACInput, type InputProps as RACInputProps } from 'react-aria-components';\nimport type { CommonProps } from '../../types.js';\nimport { textStyle } from '../../typography/utils.js';\n\ninterface InputProps extends CommonProps, Exclude<RACInputProps, 'className' | 'style'> {\n contentWidth?: CSSProperties['width'];\n}\n\n/**\n * Renders a styled input field.\n * @internal\n */\nexport function Input(props: InputProps) {\n // TODO: find a better way to extract common props, if a new prop is added to `CommonProps` this will break\n const {\n id,\n UNSAFE_className,\n UNSAFE_style,\n 'data-cim-style-root': dataCimStyleRoot,\n\n contentWidth,\n\n ...inputProps\n } = props;\n\n return (\n <div\n id={id}\n className={clsx('cim-input', UNSAFE_className)}\n style={UNSAFE_style}\n data-cim-style-root={dataCimStyleRoot}\n >\n <RACInput\n {...inputProps}\n className={clsx('cim-input-control', textStyle({ variant: 'body' }))}\n style={{ '--cim-input-content-width': contentWidth } as CSSProperties}\n />\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"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"}
@@ -59,12 +59,21 @@ function Select({ children, items, label, description, error, UNSAFE_className,
59
59
  }
60
60
  function SelectPopover({ children }) {
61
61
  const popoverRef = (0, react_1.useRef)(null);
62
+ const interactOutsideTarget = (0, react_1.useRef)(null);
62
63
  const selectState = (0, react_1.useContext)(react_aria_components_1.SelectStateContext);
63
64
  // Popover is non-modal, but we still want to close it when the user interacts outside
64
65
  (0, react_aria_1.useInteractOutside)({
65
66
  ref: popoverRef,
66
- onInteractOutside: () => {
67
- selectState?.close();
67
+ onInteractOutsideStart: (e) => {
68
+ interactOutsideTarget.current = e.target;
69
+ },
70
+ onInteractOutside: (e) => {
71
+ if (interactOutsideTarget.current === e.target) {
72
+ requestAnimationFrame(() => {
73
+ selectState?.close();
74
+ });
75
+ }
76
+ interactOutsideTarget.current = null;
68
77
  },
69
78
  isDisabled: !selectState?.isOpen,
70
79
  });
@@ -1 +1 @@
1
- {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { mergeRefs } from '@react-aria/utils';\nimport clsx from 'clsx';\nimport {\n type ForwardedRef,\n type ReactNode,\n type UIEventHandler,\n useContext,\n useImperativeHandle,\n useMemo,\n useRef,\n} from 'react';\nimport { useFilter, useId, useInteractOutside, usePreventScroll } from 'react-aria';\nimport {\n Autocomplete as RACAutocomplete,\n Button as RACButton,\n Collection as RACCollection,\n Header as RACHeader,\n LabelContext as RACLabelContext,\n ListBox as RACListBox,\n ListBoxItem as RACListBoxItem,\n type ListBoxItemProps as RACListBoxItemProps,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n type ListBoxProps as RACListBoxProps,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Select as RACSelect,\n type SelectProps as RACSelectProps,\n SelectStateContext as RACSelectStateContext,\n SelectValue as RACSelectValue,\n Text as RACText,\n Virtualizer as RACVirtualizer,\n useSlottedContext,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheckBold, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CheckboxIndicator } from '../internal/checkbox-indicator/checkbox-indicator.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport { Spinner } from '../spinner/spinner.js';\nimport { TagGroup } from '../tag/tag-group.js';\nimport { Tag } from '../tag/tag.js';\nimport { SearchField } from '../text-inputs/search-field.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { Text } from '../typography/text.js';\nimport { textStyle } from '../typography/utils.js';\nimport { UNSTABLE_VisuallyHidden } from '../visually-hidden/visually-hidden.js';\n\nexport type UNSTABLE_SelectSelectionMode = 'single' | 'multiple';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n estimatedRowHeight: 40,\n estimatedHeadingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\nexport interface SelectProps<\n T extends CollectionItem = CollectionItem,\n M extends UNSTABLE_SelectSelectionMode = 'single',\n>\n extends\n CommonProps,\n FieldProps<M extends 'single' ? Key : Key[]>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<SelectApi>,\n Pick<\n RACSelectProps<T, M>,\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'autoComplete'\n | 'autoFocus'\n | 'placeholder'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n > {\n /** The currently selected key in the collection (controlled). */\n selectedKey?: Key | null;\n /** The initial selected key in the collection (uncontrolled). */\n defaultSelectedKey?: Key;\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (key: Key | null) => void;\n /**\n * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n */\n isVirtualized?: boolean;\n /** Handler that is called when the list of items is scrolled. */\n onScroll?: UIEventHandler<HTMLDivElement>;\n /**\n * The selection mode of the select.\n * @default 'single'\n */\n UNSTABLE_selectionMode?: M;\n /** The value of the select (controlled). */\n UNSTABLE_value?: M extends 'single' ? Key | null : Key[];\n /** The initial value of the select (uncontrolled). */\n UNSTABLE_defaultValue?: M extends 'single' ? Key : Key[];\n /** Handler that is called when the value changes. */\n UNSTABLE_onChange?: (key: M extends 'single' ? Key | null : Key[]) => void;\n /**\n * How the selected value is displayed.\n * @default 'text'\n */\n UNSTABLE_valueDisplay?: 'text' | 'tags' | 'count';\n /**\n * Whether the list of options should be filterable.\n * @default false\n */\n UNSTABLE_isFilterable?: boolean;\n /** The value of the filter input (controlled). */\n UNSTABLE_filterValue?: string;\n /** The initial value of the filter input (uncontrolled). */\n UNSTABLE_defaultFilterValue?: string;\n /** Handler that is called when the filter value changes. */\n UNSTABLE_onFilterChange?: (value: string) => void;\n /** A custom filter function to use instead of the default filter. */\n UNSTABLE_filter?: ((textValue: string, inputValue: string, node: { key: Key; value: T | null }) => boolean) | null;\n UNSTABLE_isClearable?: boolean;\n}\n\n/** The imperative API exposed by the `Select` component. */\nexport interface SelectApi {\n /** Focuses the trigger button and opens the list of items. */\n focus: () => void;\n}\n\nfunction Select<T extends CollectionItem, M extends UNSTABLE_SelectSelectionMode = 'single'>(\n {\n children,\n items,\n label,\n description,\n error,\n UNSAFE_className,\n UNSAFE_style,\n onScroll,\n isVirtualized = false,\n apiRef,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n UNSTABLE_selectionMode,\n UNSTABLE_value,\n UNSTABLE_defaultValue,\n UNSTABLE_onChange,\n UNSTABLE_valueDisplay: valueDisplay = 'text',\n UNSTABLE_isFilterable: isFilterable = false,\n UNSTABLE_filterValue: filterValue,\n UNSTABLE_defaultFilterValue: defaultFilterValue,\n UNSTABLE_onFilterChange: onFilterChange,\n UNSTABLE_filter: filter,\n UNSTABLE_isClearable: isClearable = false,\n ...props\n }: SelectProps<T, M>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const triggerRef = useRef<HTMLButtonElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('Select requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`Select` requires `children` to be a function when using `items` prop');\n }\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => triggerRef.current?.focus(),\n }),\n [],\n );\n\n const listBox = (\n <SelectListBox items={items} isLoading={isLoading} onLoadMore={onLoadMore} onScroll={onScroll}>\n {children}\n </SelectListBox>\n );\n\n const listBoxWithVirtualizer = isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n );\n\n const listBoxWithFilter = isFilterable ? (\n <SelectFilter\n filterValue={filterValue}\n defaultFilterValue={defaultFilterValue}\n onFilterChange={onFilterChange}\n filter={filter}\n >\n {listBoxWithVirtualizer}\n </SelectFilter>\n ) : (\n listBoxWithVirtualizer\n );\n\n return (\n <RACSelect\n {...props}\n ref={ref}\n className={clsx('cim-select', UNSAFE_className)}\n style={UNSAFE_style}\n selectedKey={selectedKey}\n defaultSelectedKey={defaultSelectedKey}\n onSelectionChange={onSelectionChange}\n value={UNSTABLE_value}\n defaultValue={UNSTABLE_defaultValue}\n onChange={UNSTABLE_onChange}\n selectionMode={UNSTABLE_selectionMode}\n allowsEmptyCollection={isLoading}\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <SelectButton ref={triggerRef} valueDisplay={valueDisplay} isClearable={isClearable} />\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <SelectPopover>{listBoxWithFilter}</SelectPopover>\n {UNSTABLE_selectionMode === 'multiple' && valueDisplay === 'tags' && <SelectTags />}\n </RACSelect>\n );\n}\n\ninterface SelectPopoverProps {\n children: ReactNode;\n}\n\nfunction SelectPopover({ children }: SelectPopoverProps) {\n const popoverRef = useRef<HTMLDivElement>(null);\n const selectState = useContext(RACSelectStateContext);\n\n // Popover is non-modal, but we still want to close it when the user interacts outside\n useInteractOutside({\n ref: popoverRef,\n onInteractOutside: () => {\n selectState?.close();\n },\n isDisabled: !selectState?.isOpen,\n });\n\n // Popover is non-modal, but we still want to prevent scrolling when it is open\n usePreventScroll({ isDisabled: !selectState?.isOpen });\n\n return (\n <CollapsibleList\n ref={popoverRef}\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n // Set to non-modal so that interactions like clicking the clear button can be performed without first having to close the popover\n isNonModal\n >\n {children}\n </CollapsibleList>\n );\n}\n\ninterface SelectButtonProps {\n valueDisplay: SelectProps['UNSTABLE_valueDisplay'];\n isClearable?: SelectProps['UNSTABLE_isClearable'];\n}\n\nconst SelectButton = forwardRef<SelectButtonProps, HTMLButtonElement>(({ valueDisplay, isClearable }, ref) => {\n const triggerRef = useRef<HTMLButtonElement>(null);\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n return (\n <div className=\"cim-select-button\">\n <RACButton ref={mergeRefs(ref, triggerRef)} className=\"cim-select-button-trigger\" />\n <RACSelectValue className={clsx('cim-select-button-value', textStyle({ variant: 'body', alignment: 'start' }))}>\n {({ selectedText, defaultChildren, isPlaceholder, state }) => {\n if ((valueDisplay === 'tags' && state.selectedItems.length > 0) || valueDisplay === 'count') {\n return (\n <Text as=\"span\" variant=\"body\" tone=\"subtle\">\n {collectionMessages.format('itemsSelected', { selectedItemCount: state.selectedItems.length })}\n </Text>\n );\n }\n\n return isPlaceholder ? defaultChildren : selectedText;\n }}\n </RACSelectValue>\n {isClearable && (\n <SelectClearButton\n // Move focus to trigger button, because button will disappear after clearing\n onClear={() => triggerRef.current?.focus()}\n />\n )}\n <IconChevronDown UNSAFE_className=\"cim-select-button-chevron\" />\n </div>\n );\n});\n\nfunction SelectClearButton({ onClear }: { onClear?: () => void }) {\n const selectState = useContext(RACSelectStateContext);\n\n if (!selectState || selectState.selectedItems.length === 0) {\n return null;\n }\n\n return (\n <XButton\n // TODO: i18n once stabilized\n aria-label=\"Clear selection\"\n iconType=\"circled\"\n onPress={() => {\n selectState.setValue(null);\n onClear?.();\n }}\n slot={null}\n UNSAFE_className=\"cim-select-button-clear\"\n />\n );\n}\n\nfunction SelectListBox<T extends CollectionItem>({\n children,\n items,\n isLoading,\n onLoadMore,\n ...props\n}: RACListBoxProps<T> & {\n isLoading?: boolean;\n onLoadMore?: () => void;\n}) {\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n const selectState = useContext(RACSelectStateContext);\n const isEmpty = selectState?.collection.size === 0;\n\n return (\n <RACListBox\n className=\"cim-select-listbox\"\n renderEmptyState={() =>\n !isLoading && (\n // TODO: i18n once stabilized\n <Text\n as=\"p\"\n variant=\"body\"\n tone=\"subtle\"\n marginX={8}\n marginY={8}\n UNSAFE_className=\"cim-select-listbox-empty-state\"\n >\n No results found.\n </Text>\n )\n }\n {...props}\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format(isEmpty ? 'loading' : 'loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\n );\n}\n\nfunction SelectFilter<T extends CollectionItem>({\n children,\n filterValue,\n defaultFilterValue,\n onFilterChange,\n filter,\n}: RACListBoxProps<T> & {\n children: ReactNode;\n filterValue?: string;\n defaultFilterValue?: string;\n onFilterChange?: (value: string) => void;\n filter?: ((textValue: string, inputValue: string, node: { key: Key; value: T | null }) => boolean) | null;\n}) {\n const { contains } = useFilter({ sensitivity: 'base' });\n const filterFn = useMemo(() => {\n if (filter === null) return undefined;\n if (filter == null) return contains;\n\n return (textValue: string, inputValue: string, node: { key: Key; value: T | null }) => {\n return filter(textValue, inputValue, { key: node.key, value: node.value });\n };\n }, [filter, contains]);\n\n return (\n <RACAutocomplete<T>\n filter={filterFn}\n inputValue={filterValue}\n defaultInputValue={defaultFilterValue}\n onInputChange={onFilterChange}\n >\n <SearchField\n // TODO: i18n once stabilized\n aria-label=\"Search\"\n placeholder=\"Search\"\n autoFocus\n marginX={8}\n marginTop={8}\n />\n {children}\n </RACAutocomplete>\n );\n}\n\nfunction SelectTags() {\n const labelContext = useSlottedContext(RACLabelContext);\n const selectedItemsLabelId = useId();\n\n return (\n <RACSelectValue>\n {({ state }) => {\n if (state.selectedItems.length === 0) {\n return <></>;\n }\n\n return (\n <>\n <TagGroup\n aria-labelledby={[labelContext?.id, selectedItemsLabelId].filter(Boolean).join(' ')}\n items={state.selectedItems\n .filter((item) => item != null)\n .map((item) => ({ id: item.key, label: item.textValue }))}\n onRemove={(keys) => {\n if (Array.isArray(state.value)) {\n state.setValue(state.value.filter((k) => !keys.has(k)));\n }\n }}\n marginTop={8}\n >\n {(item) => <Tag>{item.label}</Tag>}\n </TagGroup>\n {/* TODO: i18n once stabilized */}\n <UNSTABLE_VisuallyHidden id={selectedItemsLabelId}>selected items</UNSTABLE_VisuallyHidden>\n </>\n );\n }}\n </RACSelectValue>\n );\n}\n\n/**\n * Allows users to select one item from a collapsible list.\n *\n * See [select usage guidelines](https://ui.cimpress.io/components/select/).\n */\nconst _Select = withStyleProps(forwardRef(Select), 'Select');\n\nexport { _Select as Select };\n\nexport interface SelectItemProps extends Pick<RACListBoxItemProps, 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n /** The ID of the item. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the label. */\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `Select`. */\nexport function SelectItem({ children, ...props }: SelectItemProps) {\n const textValue = stringLikeChildrenToString(children);\n\n return (\n <RACListBoxItem {...props} className=\"cim-select-item\" textValue={textValue}>\n {({ isDisabled, isSelected, selectionMode }) => (\n <>\n {selectionMode === 'single' && <IconCheckBold />}\n {selectionMode === 'multiple' && <CheckboxIndicator isSelected={isSelected} isDisabled={isDisabled} />}\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nSelectItem.displayName = 'SelectItem';\n\nexport interface SelectSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `Select` into a section. */\nexport function SelectSection<T extends CollectionItem>({ title, children, items, ...props }: SelectSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`SelectSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-select-section\">\n <RACHeader\n className={clsx('cim-select-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nSelectSection.displayName = 'SelectSection';\n"]}
1
+ {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { mergeRefs } from '@react-aria/utils';\nimport clsx from 'clsx';\nimport {\n type ForwardedRef,\n type ReactNode,\n type UIEventHandler,\n useContext,\n useImperativeHandle,\n useMemo,\n useRef,\n} from 'react';\nimport { useFilter, useId, useInteractOutside, usePreventScroll } from 'react-aria';\nimport {\n Autocomplete as RACAutocomplete,\n Button as RACButton,\n Collection as RACCollection,\n Header as RACHeader,\n LabelContext as RACLabelContext,\n ListBox as RACListBox,\n ListBoxItem as RACListBoxItem,\n type ListBoxItemProps as RACListBoxItemProps,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n type ListBoxProps as RACListBoxProps,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Select as RACSelect,\n type SelectProps as RACSelectProps,\n SelectStateContext as RACSelectStateContext,\n SelectValue as RACSelectValue,\n Text as RACText,\n Virtualizer as RACVirtualizer,\n useSlottedContext,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheckBold, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CheckboxIndicator } from '../internal/checkbox-indicator/checkbox-indicator.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport { Spinner } from '../spinner/spinner.js';\nimport { TagGroup } from '../tag/tag-group.js';\nimport { Tag } from '../tag/tag.js';\nimport { SearchField } from '../text-inputs/search-field.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { Text } from '../typography/text.js';\nimport { textStyle } from '../typography/utils.js';\nimport { UNSTABLE_VisuallyHidden } from '../visually-hidden/visually-hidden.js';\n\nexport type UNSTABLE_SelectSelectionMode = 'single' | 'multiple';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n estimatedRowHeight: 40,\n estimatedHeadingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\nexport interface SelectProps<\n T extends CollectionItem = CollectionItem,\n M extends UNSTABLE_SelectSelectionMode = 'single',\n>\n extends\n CommonProps,\n FieldProps<M extends 'single' ? Key : Key[]>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<SelectApi>,\n Pick<\n RACSelectProps<T, M>,\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'autoComplete'\n | 'autoFocus'\n | 'placeholder'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n > {\n /** The currently selected key in the collection (controlled). */\n selectedKey?: Key | null;\n /** The initial selected key in the collection (uncontrolled). */\n defaultSelectedKey?: Key;\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (key: Key | null) => void;\n /**\n * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n */\n isVirtualized?: boolean;\n /** Handler that is called when the list of items is scrolled. */\n onScroll?: UIEventHandler<HTMLDivElement>;\n /**\n * The selection mode of the select.\n * @default 'single'\n */\n UNSTABLE_selectionMode?: M;\n /** The value of the select (controlled). */\n UNSTABLE_value?: M extends 'single' ? Key | null : Key[];\n /** The initial value of the select (uncontrolled). */\n UNSTABLE_defaultValue?: M extends 'single' ? Key : Key[];\n /** Handler that is called when the value changes. */\n UNSTABLE_onChange?: (key: M extends 'single' ? Key | null : Key[]) => void;\n /**\n * How the selected value is displayed.\n * @default 'text'\n */\n UNSTABLE_valueDisplay?: 'text' | 'tags' | 'count';\n /**\n * Whether the list of options should be filterable.\n * @default false\n */\n UNSTABLE_isFilterable?: boolean;\n /** The value of the filter input (controlled). */\n UNSTABLE_filterValue?: string;\n /** The initial value of the filter input (uncontrolled). */\n UNSTABLE_defaultFilterValue?: string;\n /** Handler that is called when the filter value changes. */\n UNSTABLE_onFilterChange?: (value: string) => void;\n /** A custom filter function to use instead of the default filter. */\n UNSTABLE_filter?: ((textValue: string, inputValue: string, node: { key: Key; value: T | null }) => boolean) | null;\n UNSTABLE_isClearable?: boolean;\n}\n\n/** The imperative API exposed by the `Select` component. */\nexport interface SelectApi {\n /** Focuses the trigger button and opens the list of items. */\n focus: () => void;\n}\n\nfunction Select<T extends CollectionItem, M extends UNSTABLE_SelectSelectionMode = 'single'>(\n {\n children,\n items,\n label,\n description,\n error,\n UNSAFE_className,\n UNSAFE_style,\n onScroll,\n isVirtualized = false,\n apiRef,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n UNSTABLE_selectionMode,\n UNSTABLE_value,\n UNSTABLE_defaultValue,\n UNSTABLE_onChange,\n UNSTABLE_valueDisplay: valueDisplay = 'text',\n UNSTABLE_isFilterable: isFilterable = false,\n UNSTABLE_filterValue: filterValue,\n UNSTABLE_defaultFilterValue: defaultFilterValue,\n UNSTABLE_onFilterChange: onFilterChange,\n UNSTABLE_filter: filter,\n UNSTABLE_isClearable: isClearable = false,\n ...props\n }: SelectProps<T, M>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const triggerRef = useRef<HTMLButtonElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('Select requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`Select` requires `children` to be a function when using `items` prop');\n }\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => triggerRef.current?.focus(),\n }),\n [],\n );\n\n const listBox = (\n <SelectListBox items={items} isLoading={isLoading} onLoadMore={onLoadMore} onScroll={onScroll}>\n {children}\n </SelectListBox>\n );\n\n const listBoxWithVirtualizer = isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n );\n\n const listBoxWithFilter = isFilterable ? (\n <SelectFilter\n filterValue={filterValue}\n defaultFilterValue={defaultFilterValue}\n onFilterChange={onFilterChange}\n filter={filter}\n >\n {listBoxWithVirtualizer}\n </SelectFilter>\n ) : (\n listBoxWithVirtualizer\n );\n\n return (\n <RACSelect\n {...props}\n ref={ref}\n className={clsx('cim-select', UNSAFE_className)}\n style={UNSAFE_style}\n selectedKey={selectedKey}\n defaultSelectedKey={defaultSelectedKey}\n onSelectionChange={onSelectionChange}\n value={UNSTABLE_value}\n defaultValue={UNSTABLE_defaultValue}\n onChange={UNSTABLE_onChange}\n selectionMode={UNSTABLE_selectionMode}\n allowsEmptyCollection={isLoading}\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <SelectButton ref={triggerRef} valueDisplay={valueDisplay} isClearable={isClearable} />\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <SelectPopover>{listBoxWithFilter}</SelectPopover>\n {UNSTABLE_selectionMode === 'multiple' && valueDisplay === 'tags' && <SelectTags />}\n </RACSelect>\n );\n}\n\ninterface SelectPopoverProps {\n children: ReactNode;\n}\n\nfunction SelectPopover({ children }: SelectPopoverProps) {\n const popoverRef = useRef<HTMLDivElement>(null);\n const interactOutsideTarget = useRef<EventTarget | null>(null);\n const selectState = useContext(RACSelectStateContext);\n\n // Popover is non-modal, but we still want to close it when the user interacts outside\n useInteractOutside({\n ref: popoverRef,\n onInteractOutsideStart: (e) => {\n interactOutsideTarget.current = e.target;\n },\n onInteractOutside: (e) => {\n if (interactOutsideTarget.current === e.target) {\n requestAnimationFrame(() => {\n selectState?.close();\n });\n }\n\n interactOutsideTarget.current = null;\n },\n isDisabled: !selectState?.isOpen,\n });\n\n // Popover is non-modal, but we still want to prevent scrolling when it is open\n usePreventScroll({ isDisabled: !selectState?.isOpen });\n\n return (\n <CollapsibleList\n ref={popoverRef}\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n // Set to non-modal so that interactions like clicking the clear button can be performed without first having to close the popover\n isNonModal\n >\n {children}\n </CollapsibleList>\n );\n}\n\ninterface SelectButtonProps {\n valueDisplay: SelectProps['UNSTABLE_valueDisplay'];\n isClearable?: SelectProps['UNSTABLE_isClearable'];\n}\n\nconst SelectButton = forwardRef<SelectButtonProps, HTMLButtonElement>(({ valueDisplay, isClearable }, ref) => {\n const triggerRef = useRef<HTMLButtonElement>(null);\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n return (\n <div className=\"cim-select-button\">\n <RACButton ref={mergeRefs(ref, triggerRef)} className=\"cim-select-button-trigger\" />\n <RACSelectValue className={clsx('cim-select-button-value', textStyle({ variant: 'body', alignment: 'start' }))}>\n {({ selectedText, defaultChildren, isPlaceholder, state }) => {\n if ((valueDisplay === 'tags' && state.selectedItems.length > 0) || valueDisplay === 'count') {\n return (\n <Text as=\"span\" variant=\"body\" tone=\"subtle\">\n {collectionMessages.format('itemsSelected', { selectedItemCount: state.selectedItems.length })}\n </Text>\n );\n }\n\n return isPlaceholder ? defaultChildren : selectedText;\n }}\n </RACSelectValue>\n {isClearable && (\n <SelectClearButton\n // Move focus to trigger button, because button will disappear after clearing\n onClear={() => triggerRef.current?.focus()}\n />\n )}\n <IconChevronDown UNSAFE_className=\"cim-select-button-chevron\" />\n </div>\n );\n});\n\nfunction SelectClearButton({ onClear }: { onClear?: () => void }) {\n const selectState = useContext(RACSelectStateContext);\n\n if (!selectState || selectState.selectedItems.length === 0) {\n return null;\n }\n\n return (\n <XButton\n // TODO: i18n once stabilized\n aria-label=\"Clear selection\"\n iconType=\"circled\"\n onPress={() => {\n selectState.setValue(null);\n onClear?.();\n }}\n slot={null}\n UNSAFE_className=\"cim-select-button-clear\"\n />\n );\n}\n\nfunction SelectListBox<T extends CollectionItem>({\n children,\n items,\n isLoading,\n onLoadMore,\n ...props\n}: RACListBoxProps<T> & {\n isLoading?: boolean;\n onLoadMore?: () => void;\n}) {\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n const selectState = useContext(RACSelectStateContext);\n const isEmpty = selectState?.collection.size === 0;\n\n return (\n <RACListBox\n className=\"cim-select-listbox\"\n renderEmptyState={() =>\n !isLoading && (\n // TODO: i18n once stabilized\n <Text\n as=\"p\"\n variant=\"body\"\n tone=\"subtle\"\n marginX={8}\n marginY={8}\n UNSAFE_className=\"cim-select-listbox-empty-state\"\n >\n No results found.\n </Text>\n )\n }\n {...props}\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format(isEmpty ? 'loading' : 'loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\n );\n}\n\nfunction SelectFilter<T extends CollectionItem>({\n children,\n filterValue,\n defaultFilterValue,\n onFilterChange,\n filter,\n}: RACListBoxProps<T> & {\n children: ReactNode;\n filterValue?: string;\n defaultFilterValue?: string;\n onFilterChange?: (value: string) => void;\n filter?: ((textValue: string, inputValue: string, node: { key: Key; value: T | null }) => boolean) | null;\n}) {\n const { contains } = useFilter({ sensitivity: 'base' });\n const filterFn = useMemo(() => {\n if (filter === null) return undefined;\n if (filter == null) return contains;\n\n return (textValue: string, inputValue: string, node: { key: Key; value: T | null }) => {\n return filter(textValue, inputValue, { key: node.key, value: node.value });\n };\n }, [filter, contains]);\n\n return (\n <RACAutocomplete<T>\n filter={filterFn}\n inputValue={filterValue}\n defaultInputValue={defaultFilterValue}\n onInputChange={onFilterChange}\n >\n <SearchField\n // TODO: i18n once stabilized\n aria-label=\"Search\"\n placeholder=\"Search\"\n autoFocus\n marginX={8}\n marginTop={8}\n />\n {children}\n </RACAutocomplete>\n );\n}\n\nfunction SelectTags() {\n const labelContext = useSlottedContext(RACLabelContext);\n const selectedItemsLabelId = useId();\n\n return (\n <RACSelectValue>\n {({ state }) => {\n if (state.selectedItems.length === 0) {\n return <></>;\n }\n\n return (\n <>\n <TagGroup\n aria-labelledby={[labelContext?.id, selectedItemsLabelId].filter(Boolean).join(' ')}\n items={state.selectedItems\n .filter((item) => item != null)\n .map((item) => ({ id: item.key, label: item.textValue }))}\n onRemove={(keys) => {\n if (Array.isArray(state.value)) {\n state.setValue(state.value.filter((k) => !keys.has(k)));\n }\n }}\n marginTop={8}\n >\n {(item) => <Tag>{item.label}</Tag>}\n </TagGroup>\n {/* TODO: i18n once stabilized */}\n <UNSTABLE_VisuallyHidden id={selectedItemsLabelId}>selected items</UNSTABLE_VisuallyHidden>\n </>\n );\n }}\n </RACSelectValue>\n );\n}\n\n/**\n * Allows users to select one item from a collapsible list.\n *\n * See [select usage guidelines](https://ui.cimpress.io/components/select/).\n */\nconst _Select = withStyleProps(forwardRef(Select), 'Select');\n\nexport { _Select as Select };\n\nexport interface SelectItemProps extends Pick<RACListBoxItemProps, 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n /** The ID of the item. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the label. */\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `Select`. */\nexport function SelectItem({ children, ...props }: SelectItemProps) {\n const textValue = stringLikeChildrenToString(children);\n\n return (\n <RACListBoxItem {...props} className=\"cim-select-item\" textValue={textValue}>\n {({ isDisabled, isSelected, selectionMode }) => (\n <>\n {selectionMode === 'single' && <IconCheckBold />}\n {selectionMode === 'multiple' && <CheckboxIndicator isSelected={isSelected} isDisabled={isDisabled} />}\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nSelectItem.displayName = 'SelectItem';\n\nexport interface SelectSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `Select` into a section. */\nexport function SelectSection<T extends CollectionItem>({ title, children, items, ...props }: SelectSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`SelectSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-select-section\">\n <RACHeader\n className={clsx('cim-select-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nSelectSection.displayName = 'SelectSection';\n"]}
@@ -2,10 +2,21 @@ import { type ReactNode } from 'react';
2
2
  import type { Href, StringLikeChildren } from '../types.js';
3
3
  export interface UNSTABLE_SideNavProps {
4
4
  children: ReactNode;
5
+ /**
6
+ * Whether the side nav is open. Only needed when the side nav is not controlled by the app shell.
7
+ */
5
8
  isOpen?: boolean;
9
+ /**
10
+ * Callback function that is called when the side nav is opened or closed.
11
+ */
6
12
  onOpenChange?: (isOpen: boolean) => void;
13
+ /**
14
+ * Whether the side nav should be expanded by default. Only affects large viewports.
15
+ * @default true
16
+ */
17
+ defaultIsOpen?: boolean;
7
18
  }
8
- export declare function UNSTABLE_SideNav({ children, isOpen, onOpenChange }: UNSTABLE_SideNavProps): import("react/jsx-runtime").JSX.Element;
19
+ export declare function UNSTABLE_SideNav({ children, isOpen, defaultIsOpen, onOpenChange }: UNSTABLE_SideNavProps): import("react/jsx-runtime").JSX.Element;
9
20
  export interface UNSTABLE_SideNavListProps {
10
21
  children: ReactNode;
11
22
  }
@@ -0,0 +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"}
@@ -0,0 +1,56 @@
1
+ 'use client';
2
+ "use strict";
3
+ Object.defineProperty(exports, "__esModule", { value: true });
4
+ exports.UNSTABLE_SideNav = UNSTABLE_SideNav;
5
+ exports.UNSTABLE_SideNavList = UNSTABLE_SideNavList;
6
+ exports.UNSTABLE_SideNavListItem = UNSTABLE_SideNavListItem;
7
+ exports.UNSTABLE_SideNavListSection = UNSTABLE_SideNavListSection;
8
+ const jsx_runtime_1 = require("react/jsx-runtime");
9
+ const utils_1 = require("@react-aria/utils");
10
+ const react_1 = require("react");
11
+ const react_aria_1 = require("react-aria");
12
+ const react_aria_components_1 = require("react-aria-components");
13
+ const breakpoints_js_1 = require("../../utils/breakpoints.js");
14
+ const string_like_children_to_string_js_1 = require("../../utils/string-like-children-to-string.js");
15
+ const use_is_mobile_js_1 = require("../../utils/use-is-mobile.js");
16
+ const app_shell_context_js_1 = require("../app-shell/app-shell-context.js");
17
+ const tooltip_js_1 = require("../tooltip/tooltip.js");
18
+ const text_js_1 = require("../typography/text.js");
19
+ const SideNavContext = (0, react_1.createContext)({ isOpen: false });
20
+ function UNSTABLE_SideNav({ children, isOpen, defaultIsOpen = true, onOpenChange }) {
21
+ const appShellContext = (0, react_1.useContext)(app_shell_context_js_1.AppShellContext);
22
+ const [isHydrated, setIsHydrated] = (0, react_1.useState)(false);
23
+ const resolvedIsOpen = isOpen ?? (isHydrated ? appShellContext?.sideNavIsOpen : defaultIsOpen);
24
+ const sideNavRef = (0, react_1.useRef)(null);
25
+ const isMobile = (0, use_is_mobile_js_1.useIsMobile)();
26
+ const isOverlaySideNav = (0, breakpoints_js_1.useBreakpoint)({ max: 'md' });
27
+ function handleClose() {
28
+ appShellContext?.toggleSideNav(false);
29
+ onOpenChange?.(false);
30
+ }
31
+ const { overlayProps, underlayProps } = (0, react_aria_1.useOverlay)({
32
+ isDismissable: isOverlaySideNav,
33
+ isOpen: resolvedIsOpen,
34
+ onClose: () => handleClose(),
35
+ }, sideNavRef);
36
+ const resetState = (0, utils_1.useEffectEvent)(() => {
37
+ setIsHydrated(true);
38
+ appShellContext?.toggleSideNav(defaultIsOpen && (0, breakpoints_js_1.matchesBreakpoint)({ min: 'lg' }));
39
+ });
40
+ // Hydrate state and reset when screen size changes to or from overlay mode
41
+ (0, utils_1.useLayoutEffect)(() => {
42
+ resetState();
43
+ }, [isOverlaySideNav]);
44
+ 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 })] }));
45
+ }
46
+ function UNSTABLE_SideNavList({ children }) {
47
+ return (0, jsx_runtime_1.jsx)("nav", { className: "cim-side-nav-list", children: children });
48
+ }
49
+ function UNSTABLE_SideNavListItem({ children, href, isActive, icon }) {
50
+ const { isOpen } = (0, react_1.useContext)(SideNavContext);
51
+ 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 })] }) }));
52
+ }
53
+ function UNSTABLE_SideNavListSection({ children, label }) {
54
+ 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] }));
55
+ }
56
+ //# sourceMappingURL=side-nav.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../../../src/components/side-nav/side-nav.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AAiCb,4CA6DC;AAMD,oDAEC;AASD,4DAaC;AAOD,kEAaC;;AA9ID,6CAAoE;AACpE,iCAAoF;AACpF,2CAAuD;AACvD,iEAAwD;AACxD,+DAA8E;AAC9E,qGAA2F;AAC3F,mEAA2D;AAC3D,4EAAoE;AACpE,sDAAgD;AAEhD,mDAA6C;AAE7C,MAAM,cAAc,GAAG,IAAA,qBAAa,EAAsB,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC;AAmB7E,SAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,aAAa,GAAG,IAAI,EAAE,YAAY,EAAyB;IAC9G,MAAM,eAAe,GAAG,IAAA,kBAAU,EAAC,sCAAe,CAAC,CAAC;IACpD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACpD,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IAC/F,MAAM,UAAU,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,QAAQ,GAAG,IAAA,8BAAW,GAAE,CAAC;IAC/B,MAAM,gBAAgB,GAAG,IAAA,8BAAa,EAAC,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;IAEtD,SAAS,WAAW;QAClB,eAAe,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;QACtC,YAAY,EAAE,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC;IAED,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG,IAAA,uBAAU,EAChD;QACE,aAAa,EAAE,gBAAgB;QAC/B,MAAM,EAAE,cAAc;QACtB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE;KAC7B,EACD,UAAU,CACX,CAAC;IAEF,MAAM,UAAU,GAAG,IAAA,sBAAc,EAAC,GAAG,EAAE;QACrC,aAAa,CAAC,IAAI,CAAC,CAAC;QAEpB,eAAe,EAAE,aAAa,CAAC,aAAa,IAAI,IAAA,kCAAiB,EAAC,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IACpF,CAAC,CAAC,CAAC;IAEH,2EAA2E;IAC3E,IAAA,uBAAe,EAAC,GAAG,EAAE;QACnB,UAAU,EAAE,CAAC;IACf,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,OAAO,CACL,wBAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,cAAc,IAAI,KAAK,EAAE,aAChE,QAAQ,IAAI,CACX,mCACM,aAAa,EACjB,SAAS,EAAC,uBAAuB,iBACpB,CAAC,cAAc,mBACb,cAAc,mBACd,UAAU,IAAI,SAAS,GACtC,CACH,EACA,QAAQ,IAAI,cAAc,IAAI,uBAAC,0BAAa,IAAC,SAAS,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,GAAI,EAChF,mCACM,CAAC,gBAAgB,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAC1C,SAAS,EAAC,cAAc,mBACT,cAAc,mBACd,UAAU,IAAI,SAAS,gBAC3B,iBAAiB,EAC5B,GAAG,EAAE,UAAU,EAIT,KAAK,EAAE,QAAQ,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,YAExD,QAAQ,GACL,IACkB,CAC3B,CAAC;AACJ,CAAC;AAMD,SAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAA6B;IAC1E,OAAO,gCAAK,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAO,CAAC;AAC7D,CAAC;AASD,SAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAiC;IACxG,MAAM,EAAE,MAAM,EAAE,GAAG,IAAA,kBAAU,EAAC,cAAc,CAAC,CAAC;IAE9C,OAAO,CACL,uBAAC,oBAAO,IAAC,KAAK,EAAE,IAAA,8DAA0B,EAAC,QAAQ,CAAC,EAAE,SAAS,EAAC,OAAO,EAAC,UAAU,EAAE,MAAM,YACxF,wBAAC,4BAAO,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,wBAAwB,iBAAc,QAAQ,aAC1E,IAAI,EACL,uBAAC,cAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,QAAQ,EAAC,gBAAgB,EAAC,8BAA8B,YAC7E,QAAQ,GACJ,IACC,GACF,CACX,CAAC;AACJ,CAAC;AAOD,SAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAoC;IAC/F,OAAO,CACL,iCAAK,SAAS,EAAC,2BAA2B,aACvC,KAAK,IAAI,CACR,gCAAK,SAAS,EAAC,kCAAkC,YAC/C,uBAAC,cAAI,IAAC,EAAE,EAAC,GAAG,EAAC,OAAO,EAAC,gBAAgB,EAAC,IAAI,EAAC,QAAQ,EAAC,gBAAgB,EAAC,wCAAwC,YAC1G,KAAK,GACD,GACH,CACP,EACA,QAAQ,IACL,CACP,CAAC;AACJ,CAAC","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"]}
@@ -1 +1 @@
1
- {"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/components/slider/slider.tsx"],"names":[],"mappings":"AAKA,OAAO,EAYL,KAAK,WAAW,IAAI,cAAc,EACnC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAGhE,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,MAAM,CACvE,SACE,WAAW,EACX,eAAe,EACf,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,GAAG,eAAe,CAAC;IAC5F,qGAAqG;IACrG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sCAAsC;IACtC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,wCAAwC;IACxC,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,2DAA2D;IAC3D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IACjC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,MAAM,CAAC;IAC9D;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;SAGK;IACL,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AA+JD;;;;GAIG;AACH,QAAA,MAAM,OAAO,GAlKG,CAAC,SAAS,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,wKAkKS,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC"}
1
+ {"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/components/slider/slider.tsx"],"names":[],"mappings":"AAKA,OAAO,EAYL,KAAK,WAAW,IAAI,cAAc,EACnC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAGhE,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,MAAM,CACvE,SACE,WAAW,EACX,eAAe,EACf,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,GAAG,eAAe,CAAC;IAC5F,qGAAqG;IACrG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sCAAsC;IACtC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,wCAAwC;IACxC,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,2DAA2D;IAC3D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IACjC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,MAAM,CAAC;IAC9D;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;SAGK;IACL,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AA2JD;;;;GAIG;AACH,QAAA,MAAM,OAAO,GA9JG,CAAC,SAAS,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,wKA8JS,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC"}