@12-apps/ui 6.46.1 → 6.48.0

package/dist/navigation/SectionNav.js

@@ -1,25 +1,25 @@
 import "../chunk-R26KYJHK.js";
 import {
   SectionNav
-} from "../chunk-BWXPO2SE.js";
-import "../chunk-HC2AO3RT.js";
+} from "../chunk-S22XIXLL.js";
+import "../chunk-J44PPGBF.js";
 import {
   sectionNavBarInset
-} from "../chunk-ZCEXSYAJ.js";
-import "../chunk-CJPP4OUK.js";
+} from "../chunk-CGL7R37P.js";
+import "../chunk-2YKTB2IZ.js";
 import {
   RaisedActionButton
-} from "../chunk-AA7QTFMB.js";
-import "../chunk-LUPHXDEU.js";
+} from "../chunk-HGRC635A.js";
+import "../chunk-FVKBP3UX.js";
 import "../chunk-VHVI3D4R.js";
 import "../chunk-TMSWLFL4.js";
 import "../chunk-KIHGTL2D.js";
 import "../chunk-5AK2EZG5.js";
-import "../chunk-LV2SZFXK.js";
+import "../chunk-GMC3F43L.js";
+import "../chunk-6C5D6O3D.js";
 import "../chunk-WDQRQIT7.js";
 import "../chunk-ZCXVTFYQ.js";
 import "../chunk-M5ZXL52T.js";
-import "../chunk-6C5D6O3D.js";
 import "../chunk-3UIDKLML.js";
 import "../chunk-PYC4CWCQ.js";
 import "../chunk-TYJR4GOF.js";

package/dist/types/components/feedback/StackedModal/StackedModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackedModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/StackedModal.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAMhC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAwH9D,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAO9C,CAAC;AAIF,OAAO,EACL,kBAAkB,EAClB,kBAAkB,IAAI,oBAAoB,EAC1C,aAAa,EACb,aAAa,IAAI,eAAe,GACjC,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"StackedModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/StackedModal.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAMhC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAyH9D,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAO9C,CAAC;AAIF,OAAO,EACL,kBAAkB,EAClB,kBAAkB,IAAI,oBAAoB,EAC1C,aAAa,EACb,aAAa,IAAI,eAAe,GACjC,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/types/components/feedback/StackedModal/StackedModal.styles.d.ts

@@ -1,5 +1,5 @@
 import type { CSSObject, Theme } from '@mui/material/styles/index.js';
-import type { ModalPanelRole, PanelMaxWidth } from './StackedModal.types';
+import type { ModalPanelRole, PanelMaxWidth, PanelSize } from './StackedModal.types';
 /** Props that drive the panel's look but must not reach the DOM. */
 export interface PanelStyleProps {
     modalRole?: ModalPanelRole;
@@ -7,6 +7,7 @@ export interface PanelStyleProps {
     glass?: boolean;
     rtl?: boolean;
     customMaxWidth?: PanelMaxWidth;
+    panelSize?: PanelSize;
 }
 /** Style-only props, filtered out before they can land on a DOM node. */
 export declare const STYLE_ONLY_PROPS: string[];

package/dist/types/components/feedback/StackedModal/StackedModal.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackedModal.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/StackedModal.styles.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAItE,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAE1E,oEAAoE;AACpE,MAAM,WAAW,eAAe;IAC9B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC;AAED,yEAAyE;AACzE,eAAO,MAAM,gBAAgB,UAAiE,CAAC;AA4H/F,6DAA6D;AAC7D,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,EAAE,OAAO,eAAe,KAAG,SAMtE,CAAC;AAEH,eAAO,MAAM,WAAW,GAAI,OAAO,KAAK,EAAE,MAAM,OAAO,KAAG,SAOxD,CAAC;AAEH,eAAO,MAAM,eAAe,GAAI,OAAO,KAAK,KAAG,SAK7C,CAAC;AAEH,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,KAAG,SAI9C,CAAC;AAEH,eAAO,MAAM,oBAAoB,GAAI,OAAO,KAAK,KAAG,SAYlD,CAAC;AAEH,eAAO,MAAM,kBAAkB,GAAI,OAAO,KAAK,KAAG,SAUhD,CAAC"}
+{"version":3,"file":"StackedModal.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/StackedModal.styles.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAItE,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAErF,oEAAoE;AACpE,MAAM,WAAW,eAAe;IAC9B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAED,yEAAyE;AACzE,eAAO,MAAM,gBAAgB,UAA8E,CAAC;AA+J5G,6DAA6D;AAC7D,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,EAAE,OAAO,eAAe,KAAG,SAMtE,CAAC;AAEH,eAAO,MAAM,WAAW,GAAI,OAAO,KAAK,EAAE,MAAM,OAAO,KAAG,SAOxD,CAAC;AAEH,eAAO,MAAM,eAAe,GAAI,OAAO,KAAK,KAAG,SAK7C,CAAC;AAEH,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,KAAG,SAI9C,CAAC;AAEH,eAAO,MAAM,oBAAoB,GAAI,OAAO,KAAK,KAAG,SAYlD,CAAC;AAEH,eAAO,MAAM,kBAAkB,GAAI,OAAO,KAAK,KAAG,SAUhD,CAAC"}

package/dist/types/components/feedback/StackedModal/StackedModal.types.d.ts

@@ -3,6 +3,12 @@ import type { ReactNode } from 'react';
 export type ModalPanelRole = 'primary' | 'secondary' | 'background';
 /** The breakpoint the panel's width is capped at, or `false` for uncapped. */
 export type PanelMaxWidth = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
+/**
+ * How much of the viewport the top panel takes from `sm` up. `wide` is for a
+ * dense editor that lays out two columns inside the panel, which the default
+ * 60vw starves on a laptop.
+ */
+export type PanelSize = 'default' | 'wide';
 export interface StackedModalProps {
     /** The back arrow's accessible name — it carries a glyph only. REQUIRED. */
     backLabel: string;
@@ -40,6 +46,8 @@ export interface StackedModalProps {
     fullScreen?: boolean;
     /** Maximum width of the modal */
     maxWidth?: PanelMaxWidth;
+    /** Viewport share of the top panel — `wide` gives a dense editor more room */
+    size?: PanelSize;
     /** Disable the backdrop click behavior */
     disableBackdrop?: boolean;
     /** Disable focus trap functionality */

package/dist/types/components/feedback/StackedModal/StackedModal.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackedModal.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/StackedModal.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,oFAAoF;AACpF,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,WAAW,GAAG,YAAY,CAAC;AAEpE,8EAA8E;AAC9E,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAErE,MAAM,WAAW,iBAAiB;IAChC,4EAA4E;IAC5E,SAAS,EAAE,MAAM,CAAC;IAClB,2CAA2C;IAC3C,IAAI,EAAE,OAAO,CAAC;IACd,8DAA8D;IAC9D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,mCAAmC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kDAAkD;IAClD,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0EAA0E;IAC1E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iEAAiE;IACjE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oCAAoC;IACpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,2CAA2C;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6BAA6B;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,0CAA0C;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iCAAiC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,4CAA4C;IAC5C,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,gGAAgG;IAChG,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,SAAS;IACxB,sCAAsC;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,iCAAiC;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,MAAM,WAAW,sBAAsB;IACrC,0BAA0B;IAC1B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,+BAA+B;IAC/B,SAAS,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,oCAAoC;IACpC,QAAQ,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,sCAAsC;IACtC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,uCAAuC;IACvC,YAAY,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAC7C,2CAA2C;IAC3C,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,cAAc,GAAG,IAAI,CAAC;CAC1D"}
+{"version":3,"file":"StackedModal.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/StackedModal.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,oFAAoF;AACpF,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,WAAW,GAAG,YAAY,CAAC;AAEpE,8EAA8E;AAC9E,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAErE;;;;GAIG;AACH,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAE3C,MAAM,WAAW,iBAAiB;IAChC,4EAA4E;IAC5E,SAAS,EAAE,MAAM,CAAC;IAClB,2CAA2C;IAC3C,IAAI,EAAE,OAAO,CAAC;IACd,8DAA8D;IAC9D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,mCAAmC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kDAAkD;IAClD,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0EAA0E;IAC1E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iEAAiE;IACjE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oCAAoC;IACpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,2CAA2C;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6BAA6B;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0CAA0C;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iCAAiC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,4CAA4C;IAC5C,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,gGAAgG;IAChG,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,SAAS;IACxB,sCAAsC;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,iCAAiC;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,MAAM,WAAW,sBAAsB;IACrC,0BAA0B;IAC1B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,+BAA+B;IAC/B,SAAS,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,oCAAoC;IACpC,QAAQ,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,sCAAsC;IACtC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,uCAAuC;IACvC,YAAY,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAC7C,2CAA2C;IAC3C,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,cAAc,GAAG,IAAI,CAAC;CAC1D"}

package/dist/types/components/feedback/StackedModal/index.d.ts

@@ -1,3 +1,3 @@
 export { ModalStackProvider, StackedModal, StackedModalActions as StackedModalActions, StackedModalContent as StackedModalContent, ModalStackProvider as StackedModalProvider, useModalStack, useModalStack as useStackedModal, } from './StackedModal';
-export type { StackedModalProps } from './StackedModal.types';
+export type { PanelSize, StackedModalProps } from './StackedModal.types';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/feedback/StackedModal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,YAAY,EACZ,mBAAmB,IAAI,mBAAmB,EAC1C,mBAAmB,IAAI,mBAAmB,EAC1C,kBAAkB,IAAI,oBAAoB,EAC1C,aAAa,EACb,aAAa,IAAI,eAAe,GACjC,MAAM,gBAAgB,CAAC;AAExB,YAAY,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/StackedModal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,YAAY,EACZ,mBAAmB,IAAI,mBAAmB,EAC1C,mBAAmB,IAAI,mBAAmB,EAC1C,kBAAkB,IAAI,oBAAoB,EAC1C,aAAa,EACb,aAAa,IAAI,eAAe,GACjC,MAAM,gBAAgB,CAAC;AAExB,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/types/components/form/Select/Select.base.d.ts

@@ -71,5 +71,20 @@ export interface SelectBaseProps {
     disabled?: boolean;
     testID?: string;
     dataTestId?: string;
+    /**
+     * Draw the field as a search box that filters the options as you type,
+     * with a list of bounded height.
+     *
+     * Left unset, it follows the option count: a list longer than
+     * five options searches (`SEARCHABLE_MIN_OPTIONS`), a shorter one opens
+     * as a plain menu. `multiple` and `renderValue` always keep the menu.
+     */
+    searchable?: boolean;
+    /**
+     * What the searchable list says when nothing matches the typed text. The
+     * host's sentence: this library ships no copy. Unset, the empty list shows
+     * no message.
+     */
+    noOptionsText?: string;
 }
 //# sourceMappingURL=Select.base.d.ts.map

package/dist/types/components/form/Select/Select.base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAC;AAE7D,2FAA2F;AAC3F,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAE1C,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB"}
+{"version":3,"file":"Select.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAC;AAE7D,2FAA2F;AAC3F,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAE1C,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB"}

package/dist/types/components/form/Select/Select.d.ts

@@ -1,4 +1,9 @@
 import React from 'react';
 import type { SelectProps } from './Select.types';
+/**
+ * The house select. Up to five options it opens a menu; from six on it is a
+ * search box over a list of bounded height (`Select.searchable.tsx`), with the
+ * same props, events and test ids either way. `searchable` overrides the count.
+ */
 export declare const Select: React.ForwardRefExoticComponent<Omit<SelectProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=Select.d.ts.map

package/dist/types/components/form/Select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AA6LlD,eAAO,MAAM,MAAM,iGAiFlB,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AA0HlD;;;;GAIG;AACH,eAAO,MAAM,MAAM,iGAKjB,CAAC"}

package/dist/types/components/form/Select/Select.metrics.d.ts

@@ -69,4 +69,24 @@ export declare const selectedWashAlpha: (theme: UiTheme) => number;
  * would come to disagree about what an outlined field looks like.
  */
 export { INPUT_BORDER as SELECT_BORDER, INPUT_GLASS as SELECT_GLASS, INPUT_GLOW as SELECT_GLOW, INPUT_GRADIENT as SELECT_GRADIENT, INPUT_PULSE as SELECT_PULSE, } from '../Input/Input.metrics';
+/**
+ * WHEN A `Select` BECOMES A SEARCH BOX, AND HOW TALL ITS LIST MAY GROW.
+ *
+ * Past five options a menu stops being scannable at a glance and starts being
+ * scrolled — and MUI's menu grows to the viewport's height to show them all, so
+ * a staff picker covered the whole screen. From six options on the field turns
+ * into the searchable dropdown (`CreatableSelect`'s engine, MUI `Autocomplete`)
+ * and its list stops at {@link SELECT_SEARCH.listMaxHeight}: about six rows,
+ * the seventh cut in half so the list reads as scrollable.
+ */
+export declare const SEARCHABLE_MIN_OPTIONS = 6;
+export declare const SELECT_SEARCH: {
+    /** px — six 40px rows and half of the seventh. */
+    readonly listMaxHeight: 260;
+    /**
+     * px — what a field that does not fill its row adds to its longest label:
+     * the input's inline padding and the arrow's slot.
+     */
+    readonly fieldChrome: 72;
+};
 //# sourceMappingURL=Select.metrics.d.ts.map

package/dist/types/components/form/Select/Select.metrics.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;;;;GASG;AAEH,2EAA2E;AAC3E,eAAO,MAAM,eAAe,GAAI,SAAS,aAAa,KAAG,YACX,CAAC;AAE/C;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,MAAM,SAAS,GAAG,SAAS,KAAG,IAAI,GAAG,IACxC,CAAC;AAE9B;;;;GAIG;AACH,eAAO,MAAM,WAAW;;;;;CAKd,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,QAC4C,CAAC;AAEzE,2EAA2E;AAC3E,eAAO,MAAM,yBAAyB,KAAK,CAAC;AAE5C;;;;;;GAMG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;IAOtB,8DAA8D;;CAEtD,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,wGAAuB,CAAC;AAEpD,4DAA4D;AAC5D,eAAO,MAAM,iBAAiB,GAAI,OAAO,OAAO,KAAG,MACuC,CAAC;AAE3F;;;;;GAKG;AACH,OAAO,EACL,YAAY,IAAI,aAAa,EAC7B,WAAW,IAAI,YAAY,EAC3B,UAAU,IAAI,WAAW,EACzB,cAAc,IAAI,eAAe,EACjC,WAAW,IAAI,YAAY,GAC5B,MAAM,wBAAwB,CAAC"}
+{"version":3,"file":"Select.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;;;;GASG;AAEH,2EAA2E;AAC3E,eAAO,MAAM,eAAe,GAAI,SAAS,aAAa,KAAG,YACX,CAAC;AAE/C;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,MAAM,SAAS,GAAG,SAAS,KAAG,IAAI,GAAG,IACxC,CAAC;AAE9B;;;;GAIG;AACH,eAAO,MAAM,WAAW;;;;;CAKd,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,QAC4C,CAAC;AAEzE,2EAA2E;AAC3E,eAAO,MAAM,yBAAyB,KAAK,CAAC;AAE5C;;;;;;GAMG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;IAOtB,8DAA8D;;CAEtD,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,wGAAuB,CAAC;AAEpD,4DAA4D;AAC5D,eAAO,MAAM,iBAAiB,GAAI,OAAO,OAAO,KAAG,MACuC,CAAC;AAE3F;;;;;GAKG;AACH,OAAO,EACL,YAAY,IAAI,aAAa,EAC7B,WAAW,IAAI,YAAY,EAC3B,UAAU,IAAI,WAAW,EACzB,cAAc,IAAI,eAAe,EACjC,WAAW,IAAI,YAAY,GAC5B,MAAM,wBAAwB,CAAC;AAEhC;;;;;;;;;GASG;AACH,eAAO,MAAM,sBAAsB,IAAI,CAAC;AAExC,eAAO,MAAM,aAAa;IACxB,kDAAkD;;IAElD;;;OAGG;;CAEK,CAAC"}

package/dist/types/components/form/Select/Select.searchable.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import type { SelectProps } from './Select.types';
+/**
+ * THE SELECT, PAST FIVE OPTIONS: a search box over a list of bounded height.
+ *
+ * Same engine as `CreatableSelect` — MUI `Autocomplete` — so every searchable
+ * dropdown in the library types, filters and scrolls the same way. What it
+ * keeps from `Select` is the whole CONTRACT, so a call site cannot tell which
+ * one it got until it opens it:
+ *
+ * - the field chrome ({@link SelectFieldControl}: variant, size, glow, pulse);
+ * - the floating label, placeholder, helper text and error;
+ * - `onChange(event)` with `event.target.value` — the option's value, a number
+ *   staying a number, exactly what MUI's `Select` hands its handlers;
+ * - disabled options, and the `-select` / `-option-<value>` test ids.
+ *
+ * It cannot be cleared (a `Select` has no "none" either — its placeholder is
+ * disabled), and it never accepts text that is not an option.
+ */
+/** Whether `props` should render as a search box. */
+export declare function shouldSearch(props: SelectProps): boolean;
+export declare const SearchableSelect: React.ForwardRefExoticComponent<Omit<SelectProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Select.searchable.d.ts.map

package/dist/types/components/form/Select/Select.searchable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.searchable.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.searchable.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAgB,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAOhE;;;;;;;;;;;;;;;;GAgBG;AAEH,qDAAqD;AACrD,wBAAgB,YAAY,CAAC,KAAK,EAAE,WAAW,GAAG,OAAO,CAIxD;AAiGD,eAAO,MAAM,gBAAgB,iGA+D3B,CAAC"}

package/dist/types/components/form/Select/Select.styles.d.ts

@@ -0,0 +1,27 @@
+import { type FormControlProps } from '@mui/material/FormControl/index.js';
+import React from 'react';
+import type { SelectProps } from './Select.types';
+import type { SizeValue } from '../../../tokens/vocabulary';
+/** What {@link SelectFieldControl} takes: a FormControl, plus the four look switches. */
+export interface SelectFieldControlProps extends FormControlProps {
+    customVariant?: SelectProps['variant'];
+    fieldSize: SizeValue;
+    glow?: boolean;
+    pulse?: boolean;
+    'data-testid'?: string;
+}
+/**
+ * The styled FormControl, behind a component with a NAMED type: a `styled()`
+ * export's inferred type reaches into `@mui/system`'s pnpm path, which the
+ * declaration build refuses to write (TS2742).
+ */
+export declare const SelectFieldControl: React.ForwardRefExoticComponent<Omit<SelectFieldControlProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * The house scale as a FormControl size.
+ *
+ * Not `muiSize`: that collapses five onto MUI's three, and a FormControl takes
+ * only two. This component's scale is already narrowed to `sm | md`, so the map
+ * is exact rather than lossy.
+ */
+export declare const formControlSize: (size: SelectProps["size"]) => "small" | "medium" | undefined;
+//# sourceMappingURL=Select.styles.d.ts.map

package/dist/types/components/form/Select/Select.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.styles.tsx"],"names":[],"mappings":"AAAA,OAAoB,EAAE,KAAK,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAExF,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAIlD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAmJ5D,yFAAyF;AACzF,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB;IAC/D,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACvC,SAAS,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,6GAE9B,CAAC;AAIF;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,GAAI,MAAM,WAAW,CAAC,MAAM,CAAC,KAAG,OAAO,GAAG,QAAQ,GAAG,SAGhF,CAAC"}

package/dist/types-native/components/form/Select/Select.base.d.ts

@@ -71,5 +71,20 @@ export interface SelectBaseProps {
     disabled?: boolean;
     testID?: string;
     dataTestId?: string;
+    /**
+     * Draw the field as a search box that filters the options as you type,
+     * with a list of bounded height.
+     *
+     * Left unset, it follows the option count: a list longer than
+     * five options searches (`SEARCHABLE_MIN_OPTIONS`), a shorter one opens
+     * as a plain menu. `multiple` and `renderValue` always keep the menu.
+     */
+    searchable?: boolean;
+    /**
+     * What the searchable list says when nothing matches the typed text. The
+     * host's sentence: this library ships no copy. Unset, the empty list shows
+     * no message.
+     */
+    noOptionsText?: string;
 }
 //# sourceMappingURL=Select.base.d.ts.map

package/dist/types-native/components/form/Select/Select.base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAC;AAE7D,2FAA2F;AAC3F,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAE1C,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB"}
+{"version":3,"file":"Select.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAC;AAE7D,2FAA2F;AAC3F,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAE1C,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB"}

package/dist/types-native/components/form/Select/Select.metrics.d.ts

@@ -69,4 +69,24 @@ export declare const selectedWashAlpha: (theme: UiTheme) => number;
  * would come to disagree about what an outlined field looks like.
  */
 export { INPUT_BORDER as SELECT_BORDER, INPUT_GLASS as SELECT_GLASS, INPUT_GLOW as SELECT_GLOW, INPUT_GRADIENT as SELECT_GRADIENT, INPUT_PULSE as SELECT_PULSE, } from '../Input/Input.metrics';
+/**
+ * WHEN A `Select` BECOMES A SEARCH BOX, AND HOW TALL ITS LIST MAY GROW.
+ *
+ * Past five options a menu stops being scannable at a glance and starts being
+ * scrolled — and MUI's menu grows to the viewport's height to show them all, so
+ * a staff picker covered the whole screen. From six options on the field turns
+ * into the searchable dropdown (`CreatableSelect`'s engine, MUI `Autocomplete`)
+ * and its list stops at {@link SELECT_SEARCH.listMaxHeight}: about six rows,
+ * the seventh cut in half so the list reads as scrollable.
+ */
+export declare const SEARCHABLE_MIN_OPTIONS = 6;
+export declare const SELECT_SEARCH: {
+    /** px — six 40px rows and half of the seventh. */
+    readonly listMaxHeight: 260;
+    /**
+     * px — what a field that does not fill its row adds to its longest label:
+     * the input's inline padding and the arrow's slot.
+     */
+    readonly fieldChrome: 72;
+};
 //# sourceMappingURL=Select.metrics.d.ts.map

package/dist/types-native/components/form/Select/Select.metrics.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;;;;GASG;AAEH,2EAA2E;AAC3E,eAAO,MAAM,eAAe,GAAI,SAAS,aAAa,KAAG,YACX,CAAC;AAE/C;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,MAAM,SAAS,GAAG,SAAS,KAAG,IAAI,GAAG,IACxC,CAAC;AAE9B;;;;GAIG;AACH,eAAO,MAAM,WAAW;;;;;CAKd,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,QAC4C,CAAC;AAEzE,2EAA2E;AAC3E,eAAO,MAAM,yBAAyB,KAAK,CAAC;AAE5C;;;;;;GAMG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;IAOtB,8DAA8D;;CAEtD,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,wGAAuB,CAAC;AAEpD,4DAA4D;AAC5D,eAAO,MAAM,iBAAiB,GAAI,OAAO,OAAO,KAAG,MACuC,CAAC;AAE3F;;;;;GAKG;AACH,OAAO,EACL,YAAY,IAAI,aAAa,EAC7B,WAAW,IAAI,YAAY,EAC3B,UAAU,IAAI,WAAW,EACzB,cAAc,IAAI,eAAe,EACjC,WAAW,IAAI,YAAY,GAC5B,MAAM,wBAAwB,CAAC"}
+{"version":3,"file":"Select.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Select/Select.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;;;;GASG;AAEH,2EAA2E;AAC3E,eAAO,MAAM,eAAe,GAAI,SAAS,aAAa,KAAG,YACX,CAAC;AAE/C;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,MAAM,SAAS,GAAG,SAAS,KAAG,IAAI,GAAG,IACxC,CAAC;AAE9B;;;;GAIG;AACH,eAAO,MAAM,WAAW;;;;;CAKd,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,QAC4C,CAAC;AAEzE,2EAA2E;AAC3E,eAAO,MAAM,yBAAyB,KAAK,CAAC;AAE5C;;;;;;GAMG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;IAOtB,8DAA8D;;CAEtD,CAAC;AAEX,uEAAuE;AACvE,eAAO,MAAM,eAAe,wGAAuB,CAAC;AAEpD,4DAA4D;AAC5D,eAAO,MAAM,iBAAiB,GAAI,OAAO,OAAO,KAAG,MACuC,CAAC;AAE3F;;;;;GAKG;AACH,OAAO,EACL,YAAY,IAAI,aAAa,EAC7B,WAAW,IAAI,YAAY,EAC3B,UAAU,IAAI,WAAW,EACzB,cAAc,IAAI,eAAe,EACjC,WAAW,IAAI,YAAY,GAC5B,MAAM,wBAAwB,CAAC;AAEhC;;;;;;;;;GASG;AACH,eAAO,MAAM,sBAAsB,IAAI,CAAC;AAExC,eAAO,MAAM,aAAa;IACxB,kDAAkD;;IAElD;;;OAGG;;CAEK,CAAC"}

package/dist/user-avatar.js

@@ -1,13 +1,13 @@
 import {
   UserAvatar,
   UserMenu
-} from "./chunk-UUJ7J7NE.js";
+} from "./chunk-PP7CDKO4.js";
 import "./chunk-UDQSIRAP.js";
-import "./chunk-PGPPN63I.js";
-import "./chunk-TNQDSTIA.js";
+import "./chunk-EMEXXAQI.js";
+import "./chunk-Y6C4MYZE.js";
+import "./chunk-MTEQEPNY.js";
 import "./chunk-6ZZGK5DT.js";
 import "./chunk-3ZVUNSFF.js";
-import "./chunk-MTEQEPNY.js";
 import "./chunk-VUHLNYAE.js";
 import "./chunk-2GSIEDGN.js";
 import "./chunk-OP5JR5Q5.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@12-apps/ui",
-  "version": "6.46.1",
+  "version": "6.48.0",
   "license": "MIT",
   "packageManager": "pnpm@10.34.5",
   "type": "module",

package/src/components/feedback/StackedModal/StackedModal.md

@@ -135,6 +135,7 @@ new component that portals should too.
 | `loadingText` | `string` | `'Loading...'` | Text shown during loading state |
 | `fullScreen` | `boolean` | `false` | Full screen mode |
 | `maxWidth` | `'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| false` | `'md'` | Maximum modal width |
+| `size` | `'default' \| 'wide'` | `'default'` | Viewport share of the top panel: default is 80vw (`sm`–`lg`), 60vw (`lg`+), 40vw (≥2200px); `wide` is 90vw up to `xl`, 75vw above, 60vw ≥2200px — for a dense two-column editor |
 | `disableBackdrop` | `boolean` | `false` | Hide backdrop |
 | `disableFocusTrap` | `boolean` | `false` | Disable focus trapping |
 | `keepMounted` | `boolean` | `false` | Keep modal mounted when closed |

package/src/components/feedback/StackedModal/StackedModal.styles.ts

@@ -3,7 +3,7 @@ import type { CSSObject, Theme } from '@mui/material/styles/index.js';
 import { scrim } from '../../../tokens/ink';
 import { rem } from '../../../tokens/relative';
 import { dynamicViewportHeight } from '../../../utils/viewport';
-import type { ModalPanelRole, PanelMaxWidth } from './StackedModal.types';
+import type { ModalPanelRole, PanelMaxWidth, PanelSize } from './StackedModal.types';
 
 /** Props that drive the panel's look but must not reach the DOM. */
 export interface PanelStyleProps {
@@ -12,10 +12,11 @@ export interface PanelStyleProps {
   glass?: boolean;
   rtl?: boolean;
   customMaxWidth?: PanelMaxWidth;
+  panelSize?: PanelSize;
 }
 
 /** Style-only props, filtered out before they can land on a DOM node. */
-export const STYLE_ONLY_PROPS = ['modalRole', 'isAnimating', 'glass', 'rtl', 'customMaxWidth'];
+export const STYLE_ONLY_PROPS = ['modalRole', 'isAnimating', 'glass', 'rtl', 'customMaxWidth', 'panelSize'];
 
 /** MUI breakpoint names mapped to the pixel width they cap the panel at. */
 const MAX_WIDTH_PX: Record<Exclude<PanelMaxWidth, false>, number> = {
@@ -37,6 +38,12 @@ const ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {
   primary: 'contractModal 300ms ease-in-out forwards',
 };
 
+/** A wide panel settles at 90vw, so its keyframes must end there too, or it snaps. */
+const WIDE_ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {
+  secondary: 'expandModalWide 300ms ease-in-out forwards',
+  primary: 'contractModalWide 300ms ease-in-out forwards',
+};
+
 // Animation endpoints use the common lg width (60vw); the role styles set the
 // exact per-breakpoint width once the animation settles.
 const KEYFRAMES: CSSObject = {
@@ -48,6 +55,14 @@ const KEYFRAMES: CSSObject = {
     from: { width: '100vw', transform: 'translateX(0)' },
     to: { width: '60vw', transform: 'translateX(0)' },
   },
+  '@keyframes expandModalWide': {
+    from: { width: '90vw', transform: 'translateX(0)' },
+    to: { width: '100vw', transform: 'translateX(0)' },
+  },
+  '@keyframes contractModalWide': {
+    from: { width: '100vw', transform: 'translateX(0)' },
+    to: { width: '90vw', transform: 'translateX(0)' },
+  },
 };
 
 const cap = (customMaxWidth?: PanelMaxWidth): number | null =>
@@ -79,6 +94,18 @@ const primaryPanelStyles = (theme: Theme, capPx: number | null): CSSObject => ({
   [theme.breakpoints.up(2200)]: panelWidth(theme, '40vw', capPx),
 });
 
+/**
+ * `size="wide"`: 90vw up to `xl`, 75vw above it, 60vw on ultra-wide screens.
+ * At 1280 that is ~1150px instead of 768px — room for a form column beside a
+ * fixed ~350px sidebar — while a sliver of the page behind stays visible.
+ */
+const widePrimaryPanelStyles = (theme: Theme, capPx: number | null): CSSObject => ({
+  [theme.breakpoints.down('sm')]: panelWidth(theme, '100%', capPx),
+  [theme.breakpoints.between('sm', 'xl')]: panelWidth(theme, '90vw', capPx),
+  [theme.breakpoints.up('xl')]: panelWidth(theme, '75vw', capPx),
+  [theme.breakpoints.up(2200)]: panelWidth(theme, '60vw', capPx),
+});
+
 /** Panels below the top one expand to full width, producing the GTM stacking effect. */
 const secondaryPanelStyles = (): CSSObject => ({
   width: '100vw !important',
@@ -91,8 +118,15 @@ const secondaryPanelStyles = (): CSSObject => ({
   transform: 'scale(1)',
 });
 
-const rolePanelStyles = (theme: Theme, role: ModalPanelRole | undefined, capPx: number | null): CSSObject => {
-  if (role === 'primary') return primaryPanelStyles(theme, capPx);
+const rolePanelStyles = (
+  theme: Theme,
+  role: ModalPanelRole | undefined,
+  capPx: number | null,
+  size?: PanelSize,
+): CSSObject => {
+  if (role === 'primary') {
+    return size === 'wide' ? widePrimaryPanelStyles(theme, capPx) : primaryPanelStyles(theme, capPx);
+  }
   if (role === 'secondary') return secondaryPanelStyles();
   // Background modals stay mounted but hidden, for performance.
   if (role === 'background') return { display: 'none' };
@@ -109,8 +143,10 @@ const glassStyles = (theme: Theme, glass?: boolean, role?: ModalPanelRole): CSSO
       }
     : {};
 
-const animationStyles = (isAnimating?: boolean, role?: ModalPanelRole): CSSObject =>
-  isAnimating ? { animation: (role && ANIMATION_BY_ROLE[role]) ?? 'none' } : {};
+const animationStyles = (isAnimating?: boolean, role?: ModalPanelRole, size?: PanelSize): CSSObject => {
+  const byRole = size === 'wide' ? WIDE_ANIMATION_BY_ROLE : ANIMATION_BY_ROLE;
+  return isAnimating ? { animation: (role && byRole[role]) ?? 'none' } : {};
+};
 
 const panelBaseStyles = (theme: Theme): CSSObject => ({
   margin: 0,
@@ -133,9 +169,9 @@ const panelStyles = (theme: Theme, props: PanelStyleProps): CSSObject => {
   const capPx = cap(props.customMaxWidth);
   return {
     ...panelBaseStyles(theme),
-    ...rolePanelStyles(theme, props.modalRole, capPx),
+    ...rolePanelStyles(theme, props.modalRole, capPx, props.panelSize),
     ...glassStyles(theme, props.glass, props.modalRole),
-    ...animationStyles(props.isAnimating, props.modalRole),
+    ...animationStyles(props.isAnimating, props.modalRole, props.panelSize),
   };
 };
 

package/src/components/feedback/StackedModal/StackedModal.tsx

@@ -62,7 +62,7 @@ type ResolvedProps = StackedModalProps & { modalId: string };
 const StackedModalPanel: FC<ResolvedProps> = (props) => {
   const {
     open, onClose, glass, navigationTitle, backLabel, hideClose, children, actions, modalId,
-    closeOnClickOutside, closeOnEsc, loading, loadingText, fullScreen, maxWidth, disableBackdrop,
+    closeOnClickOutside, closeOnEsc, loading, loadingText, fullScreen, maxWidth, size, disableBackdrop,
     disableFocusTrap, keepMounted, rtl, dataTestId,
     'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, ...otherProps
   } = props;
@@ -95,6 +95,7 @@ const StackedModalPanel: FC<ResolvedProps> = (props) => {
       glass={glass}
       rtl={rtl}
       customMaxWidth={maxWidth}
+      panelSize={size}
       TransitionComponent={SlideTransition}
       maxWidth={maxWidth}
       disableEscapeKeyDown={!closeOnEsc}

package/src/components/feedback/StackedModal/StackedModal.types.ts

@@ -6,6 +6,13 @@ export type ModalPanelRole = 'primary' | 'secondary' | 'background';
 /** The breakpoint the panel's width is capped at, or `false` for uncapped. */
 export type PanelMaxWidth = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
 
+/**
+ * How much of the viewport the top panel takes from `sm` up. `wide` is for a
+ * dense editor that lays out two columns inside the panel, which the default
+ * 60vw starves on a laptop.
+ */
+export type PanelSize = 'default' | 'wide';
+
 export interface StackedModalProps {
   /** The back arrow's accessible name — it carries a glyph only. REQUIRED. */
   backLabel: string;
@@ -43,6 +50,8 @@ export interface StackedModalProps {
   fullScreen?: boolean;
   /** Maximum width of the modal */
   maxWidth?: PanelMaxWidth;
+  /** Viewport share of the top panel — `wide` gives a dense editor more room */
+  size?: PanelSize;
   /** Disable the backdrop click behavior */
   disableBackdrop?: boolean;
   /** Disable focus trap functionality */

package/src/components/feedback/StackedModal/index.ts

@@ -8,4 +8,4 @@ export {
   useModalStack as useStackedModal,
 } from './StackedModal';
 
-export type { StackedModalProps } from './StackedModal.types';
+export type { PanelSize, StackedModalProps } from './StackedModal.types';

package/src/components/form/Select/Select.base.ts

@@ -75,4 +75,19 @@ export interface SelectBaseProps {
   disabled?: boolean;
   testID?: string;
   dataTestId?: string;
+  /**
+   * Draw the field as a search box that filters the options as you type,
+   * with a list of bounded height.
+   *
+   * Left unset, it follows the option count: a list longer than
+   * five options searches (`SEARCHABLE_MIN_OPTIONS`), a shorter one opens
+   * as a plain menu. `multiple` and `renderValue` always keep the menu.
+   */
+  searchable?: boolean;
+  /**
+   * What the searchable list says when nothing matches the typed text. The
+   * host's sentence: this library ships no copy. Unset, the empty list shows
+   * no message.
+   */
+  noOptionsText?: string;
 }

package/src/components/form/Select/Select.md

@@ -50,6 +50,36 @@ function MyComponent() {
 - `glow`: Whether to show glow effect on hover/focus
 - `pulse`: Whether to show pulse animation
 - `fullWidth`: Whether select should take full width of container
+- `searchable`: Force the search box on (`true`) or the menu on (`false`); unset, it follows the option count (see below)
+- `noOptionsText`: The host's sentence the search box shows when nothing matches the typed text
+
+## Six options or more: a search box
+
+Up to **five** options the select opens a menu. From **six** on it becomes the
+searchable dropdown — the same engine as `CreatableSelect` (MUI `Autocomplete`):
+the field is a text box that filters the options as you type, and the list
+stops at `SELECT_SEARCH.listMaxHeight` (about six rows) and scrolls, instead of
+growing to the height of the viewport.
+
+The props stay the same: `options`, `value`/`defaultValue`, `label`,
+`placeholder`, `helperText`, `error`, `name`, `required`, disabled options,
+variants and sizes. `onChange` still receives `{ target: { value, name } }` with
+the option's value in its own type. The test ids keep their spelling.
+
+**What does change — and breaks tests written against the menu:**
+
+- `{dataTestId}-select` (and `role="combobox"`) is now the search `<input>`,
+  not the menu's display `<div>`. The selected label is its VALUE, not its
+  text: assert with `toHaveValue('Garçom')` / `input.value`, not `toHaveText`.
+- `onChange`'s event is a plain `{ target }` object (no `preventDefault`), and
+  its second argument is `null` rather than the clicked `MenuItem`.
+- Opening it with a click or `mouseDown` on the combobox still works; typing
+  filters only while the input has real focus.
+
+- `searchable` overrides the count either way.
+- `multiple` and `renderValue` always keep the menu: a search box holds one value.
+- Pass `noOptionsText` — the library ships no copy, so unset means an empty list
+  says nothing.
 
 ## Visual Variants
 
@@ -138,7 +168,7 @@ The Select component includes `data-testid` attributes for reliable testing:
 | Test ID | Element | Description |
 |---------|---------|-------------|
 | `{dataTestId}` | FormControl | Root FormControl wrapper element |
-| `{dataTestId}-select` | Select element | The MUI Select component |
+| `{dataTestId}-select` | Select element | The MUI Select component (the search `<input>` from six options on) |
 | `{dataTestId}-option-{value}` | Menu items | Individual option elements (one per option) |
 
 **Default Test IDs (when no dataTestId prop provided):**

package/src/components/form/Select/Select.metrics.ts

@@ -88,3 +88,25 @@ export {
   INPUT_GRADIENT as SELECT_GRADIENT,
   INPUT_PULSE as SELECT_PULSE,
 } from '../Input/Input.metrics';
+
+/**
+ * WHEN A `Select` BECOMES A SEARCH BOX, AND HOW TALL ITS LIST MAY GROW.
+ *
+ * Past five options a menu stops being scannable at a glance and starts being
+ * scrolled — and MUI's menu grows to the viewport's height to show them all, so
+ * a staff picker covered the whole screen. From six options on the field turns
+ * into the searchable dropdown (`CreatableSelect`'s engine, MUI `Autocomplete`)
+ * and its list stops at {@link SELECT_SEARCH.listMaxHeight}: about six rows,
+ * the seventh cut in half so the list reads as scrollable.
+ */
+export const SEARCHABLE_MIN_OPTIONS = 6;
+
+export const SELECT_SEARCH = {
+  /** px — six 40px rows and half of the seventh. */
+  listMaxHeight: 260,
+  /**
+   * px — what a field that does not fill its row adds to its longest label:
+   * the input's inline padding and the arrow's slot.
+   */
+  fieldChrome: 72,
+} as const;