@12-apps/ui 6.67.0 → 6.69.0

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 { PanelSize, StackedModalProps } from './StackedModal.types';
+export type { PanelSize, PanelWidth, 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,SAAS,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,UAAU,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/types/components/navigation/Tabs/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/Tabs/Tabs.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAW,SAAS,EAAE,MAAM,cAAc,CAAC;AA6PvD,eAAO,MAAM,IAAI,+FA+ChB,CAAC"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/Tabs/Tabs.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAqB,SAAS,EAAE,MAAM,cAAc,CAAC;AA0RjE,eAAO,MAAM,IAAI,+FA+ChB,CAAC"}

package/dist/types/components/navigation/Tabs/Tabs.types.d.ts

@@ -1,6 +1,12 @@
 import type { ColorValue, SizeValue } from '../../../tokens/scales';
 import type { TabsProps as MuiTabsProps } from '@mui/material/Tabs/index.js';
 import type { ReactNode } from 'react';
+/** A tab's inline count — see `TabItem.count`. */
+export interface TabCount {
+    value: string | number;
+    /** `warning` asks for attention, `danger` for action; neutral otherwise. */
+    tone?: 'neutral' | 'warning' | 'danger';
+}
 export interface TabItem {
     /**
      * Unique identifier for the tab
@@ -26,6 +32,12 @@ export interface TabItem {
      * Badge content to show on the tab
      */
     badge?: string | number;
+    /**
+     * A count said INSIDE the tab, after its label, as a small pill: how many
+     * lines, events or charges the pane holds. `tone` marks one that asks for
+     * action. Unlike `badge` it never floats over the label.
+     */
+    count?: TabCount;
     /**
      * Custom className for the tab
      */

package/dist/types/components/navigation/Tabs/Tabs.types.d.ts.map

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

package/dist/types/components/navigation/Tabs/index.d.ts

@@ -1,3 +1,3 @@
 export { Tabs } from './Tabs';
-export type { TabItem, TabPanelProps, TabsProps } from './Tabs.types';
+export type { TabCount, TabItem, TabPanelProps, TabsProps } from './Tabs.types';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/navigation/Tabs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/Tabs/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,OAAO,EAAE,aAAa,EAAC,SAAS,EAAE,MAAM,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/Tabs/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC"}

package/dist/types-native/components/data-display/Chip/Chip.base.d.ts

@@ -7,7 +7,11 @@ import type { ColorValue, SizeValue } from '../../../tokens/vocabulary';
  * declaration outputs (`dist/types` and `dist/types-native`), and a native
  * consumer has no `@mui/material` to resolve a type import against.
  */
-export type ChipVariant = 'filled' | 'outlined';
+/**
+ * `soft` is a status chip's look: the colour's tint for a ground and its dark
+ * step for ink, so a row of states reads without a row of solid blocks.
+ */
+export type ChipVariant = 'filled' | 'outlined' | 'soft';
 /**
  * The house size scale, abbreviated like every other component's.
  *

package/dist/types-native/components/data-display/Chip/Chip.base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/Chip/Chip.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAExE;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEhD;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,QAAQ,GAAG,SAAS,CAAC;AAEjC;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,SAAS,GAAG,UAAU,CAAC;AAEnC,MAAM,WAAW,aAAa;IAC5B,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IAEd,2BAA2B;IAC3B,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,uBAAuB;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,qDAAqD;IACrD,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB,oCAAoC;IACpC,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}
+{"version":3,"file":"Chip.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/Chip/Chip.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAExE;;;;;;GAMG;AACH;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAEzD;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,QAAQ,GAAG,SAAS,CAAC;AAEjC;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,SAAS,GAAG,UAAU,CAAC;AAEnC,MAAM,WAAW,aAAa;IAC5B,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IAEd,2BAA2B;IAC3B,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,uBAAuB;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,qDAAqD;IACrD,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB,oCAAoC;IACpC,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/types-native/components/data-display/Chip/Chip.look.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.look.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/Chip/Chip.look.native.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAErE,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1D,OAAO,EASL,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,gBAAgB,CAAC;AAExB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAKrD,MAAM,WAAW,SAAS;IACxB,SAAS,EAAE,SAAS,CAAC;IACrB,uEAAuE;IACvE,OAAO,EAAE,SAAS,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;CACrB;AA8CD;;;;GAIG;AACH,wBAAgB,SAAS,CACvB,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,OAAO,GAChB,SAAS,CAOX;AAED,6EAA6E;AAC7E,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,OAAO,GAAG,SAAS,CAWzF;AAED,iFAAiF;AACjF,wBAAgB,cAAc,CAC5B,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE,WAAW,GACnB,SAAS,CASX;AAED,oFAAoF;AACpF,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,MAAM,GAAG,QAAQ,GACtB,SAAS,CAYX;AAED,gFAAgF;AAChF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,WAAW,GAAG,SAAS,CAQ7F;AAED,yDAAyD;AACzD,wBAAgB,eAAe,CAAC,OAAO,EAAE,eAAe,GAAG,UAAU,CAOpE;AAED,eAAO,MAAM,WAAW,GAAI,MAAM,WAAW,KAAG,eAAmC,CAAC"}
+{"version":3,"file":"Chip.look.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/Chip/Chip.look.native.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAErE,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1D,OAAO,EAWL,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,gBAAgB,CAAC;AAExB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAKrD,MAAM,WAAW,SAAS;IACxB,SAAS,EAAE,SAAS,CAAC;IACrB,uEAAuE;IACvE,OAAO,EAAE,SAAS,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;CACrB;AAgED;;;;GAIG;AACH,wBAAgB,SAAS,CACvB,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,OAAO,GAChB,SAAS,CAQX;AAED,6EAA6E;AAC7E,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,OAAO,GAAG,SAAS,CAWzF;AAED,iFAAiF;AACjF,wBAAgB,cAAc,CAC5B,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE,WAAW,GACnB,SAAS,CASX;AAED,oFAAoF;AACpF,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,MAAM,GAAG,QAAQ,GACtB,SAAS,CAYX;AAED,gFAAgF;AAChF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,WAAW,GAAG,SAAS,CAQ7F;AAED,yDAAyD;AACzD,wBAAgB,eAAe,CAAC,OAAO,EAAE,eAAe,GAAG,UAAU,CAOpE;AAED,eAAO,MAAM,WAAW,GAAI,MAAM,WAAW,KAAG,eAAmC,CAAC"}

package/dist/types-native/components/data-display/Chip/Chip.metrics.d.ts

@@ -58,4 +58,8 @@ export declare const HOVER_SHADOW: {
 };
 export declare const CHIP_TRANSITION_MS = 200;
 export declare const CHIP_TRANSITION_EASING = "cubic-bezier(0.4, 0, 0.2, 1)";
+/** A soft chip's ground: the colour at this alpha over the page. */
+export declare const SOFT_GROUND_ALPHA = 0.14;
+/** A soft chip's hover ground. */
+export declare const SOFT_HOVER_ALPHA = 0.22;
 //# sourceMappingURL=Chip.metrics.d.ts.map

package/dist/types-native/components/data-display/Chip/Chip.metrics.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/Chip/Chip.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C;;;;;;;;;GASG;AAEH,2EAA2E;AAC3E,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE7C,eAAO,MAAM,WAAW,GAAI,MAAM,QAAQ,KAAG,WACQ,CAAC;AAEtD,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,mFAAmF;IACnF,YAAY,EAAE,MAAM,CAAC;IACrB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oEAAoE;IACpE,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,CAAC;IACvB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,qDAAqD;IACrD,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,wBAAwB,EAAE,MAAM,CAAC;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,+CAA+C;IAC/C,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,yBAAyB,EAAE,MAAM,CAAC;CACnC;AAED,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,WAAW,EAAE,eAAe,CAqC3D,CAAC;AAEF,uFAAuF;AACvF,eAAO,MAAM,WAAW,KAAK,CAAC;AAC9B,oFAAoF;AACpF,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,8CAA8C;AAC9C,eAAO,MAAM,qBAAqB,OAAO,CAAC;AAC1C,mFAAmF;AACnF,eAAO,MAAM,qBAAqB,MAAM,CAAC;AACzC,yEAAyE;AACzE,eAAO,MAAM,iBAAiB,OAAO,CAAC;AACtC,eAAO,MAAM,0BAA0B,MAAM,CAAC;AAC9C,6EAA6E;AAC7E,eAAO,MAAM,oBAAoB,OAAO,CAAC;AAIzC,yEAAyE;AACzE,eAAO,MAAM,aAAa,IAAI,CAAC;AAC/B,eAAO,MAAM,YAAY;;;;;CAAsE,CAAC;AAChG,eAAO,MAAM,kBAAkB,MAAM,CAAC;AACtC,eAAO,MAAM,sBAAsB,iCAAiC,CAAC"}
+{"version":3,"file":"Chip.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/Chip/Chip.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C;;;;;;;;;GASG;AAEH,2EAA2E;AAC3E,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE7C,eAAO,MAAM,WAAW,GAAI,MAAM,QAAQ,KAAG,WACQ,CAAC;AAEtD,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,mFAAmF;IACnF,YAAY,EAAE,MAAM,CAAC;IACrB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oEAAoE;IACpE,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,CAAC;IACvB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,qDAAqD;IACrD,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,wBAAwB,EAAE,MAAM,CAAC;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,+CAA+C;IAC/C,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,yBAAyB,EAAE,MAAM,CAAC;CACnC;AAED,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,WAAW,EAAE,eAAe,CAqC3D,CAAC;AAEF,uFAAuF;AACvF,eAAO,MAAM,WAAW,KAAK,CAAC;AAC9B,oFAAoF;AACpF,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,8CAA8C;AAC9C,eAAO,MAAM,qBAAqB,OAAO,CAAC;AAC1C,mFAAmF;AACnF,eAAO,MAAM,qBAAqB,MAAM,CAAC;AACzC,yEAAyE;AACzE,eAAO,MAAM,iBAAiB,OAAO,CAAC;AACtC,eAAO,MAAM,0BAA0B,MAAM,CAAC;AAC9C,6EAA6E;AAC7E,eAAO,MAAM,oBAAoB,OAAO,CAAC;AAIzC,yEAAyE;AACzE,eAAO,MAAM,aAAa,IAAI,CAAC;AAC/B,eAAO,MAAM,YAAY;;;;;CAAsE,CAAC;AAChG,eAAO,MAAM,kBAAkB,MAAM,CAAC;AACtC,eAAO,MAAM,sBAAsB,iCAAiC,CAAC;AAErE,oEAAoE;AACpE,eAAO,MAAM,iBAAiB,OAAO,CAAC;AACtC,kCAAkC;AAClC,eAAO,MAAM,gBAAgB,OAAO,CAAC"}

package/package.json

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

package/src/components/data-display/Chip/Chip.base.ts

@@ -9,7 +9,11 @@ import type { ColorValue, SizeValue } from '../../../tokens/vocabulary';
  * declaration outputs (`dist/types` and `dist/types-native`), and a native
  * consumer has no `@mui/material` to resolve a type import against.
  */
-export type ChipVariant = 'filled' | 'outlined';
+/**
+ * `soft` is a status chip's look: the colour's tint for a ground and its dark
+ * step for ink, so a row of states reads without a row of solid blocks.
+ */
+export type ChipVariant = 'filled' | 'outlined' | 'soft';
 
 /**
  * The house size scale, abbreviated like every other component's.

package/src/components/data-display/Chip/Chip.look.native.ts

@@ -10,6 +10,8 @@ import {
   DELETE_ICON_ON_COLOR_ALPHA,
   OUTLINED_BORDER_ALPHA,
   OUTLINED_HOVER_ALPHA,
+  SOFT_GROUND_ALPHA,
+  SOFT_HOVER_ALPHA,
   type ChipMuiSize,
   type ChipSizeMetrics,
 } from './Chip.metrics';
@@ -52,6 +54,24 @@ function filledPaint(theme: UiTheme, color: ChipColor): ChipPaint {
   };
 }
 
+function softPaint(theme: UiTheme, color: ChipColor): ChipPaint {
+  if (!isAccented(color)) {
+    return {
+      container: { backgroundColor: theme.palette.action.selected },
+      pressed: { backgroundColor: theme.palette.action.hover },
+      label: { color: theme.palette.text.secondary, fontWeight: '600' },
+      deleteColor: alpha(theme.palette.text.secondary, DELETE_ICON_ALPHA),
+    };
+  }
+  const accent = theme.palette[color];
+  return {
+    container: { backgroundColor: alpha(accent.main, SOFT_GROUND_ALPHA) },
+    pressed: { backgroundColor: alpha(accent.main, SOFT_HOVER_ALPHA) },
+    label: { color: accent.dark, fontWeight: '600' },
+    deleteColor: alpha(accent.dark, DELETE_ICON_ALPHA),
+  };
+}
+
 function outlinedPaint(theme: UiTheme, color: ChipColor): ChipPaint {
   const border: ViewStyle = { backgroundColor: 'transparent', borderWidth: 1, borderStyle: 'solid' };
   if (!isAccented(color)) {
@@ -82,7 +102,8 @@ export function chipPaint(
   color: ChipColor,
   selected: boolean,
 ): ChipPaint {
-  const paint = variant === 'outlined' ? outlinedPaint(theme, color) : filledPaint(theme, color);
+  const paint =
+    variant === 'outlined' ? outlinedPaint(theme, color) : variant === 'soft' ? softPaint(theme, color) : filledPaint(theme, color);
   if (variant !== 'outlined' || !selected) return paint;
   return {
     ...paint,

package/src/components/data-display/Chip/Chip.metrics.ts

@@ -100,3 +100,8 @@ export const HOVER_LIFT_PX = 1;
 export const HOVER_SHADOW = { offsetY: 4, blur: 12, alphaLight: 0.15, alphaDark: 0.3 } as const;
 export const CHIP_TRANSITION_MS = 200;
 export const CHIP_TRANSITION_EASING = 'cubic-bezier(0.4, 0, 0.2, 1)';
+
+/** A soft chip's ground: the colour at this alpha over the page. */
+export const SOFT_GROUND_ALPHA = 0.14;
+/** A soft chip's hover ground. */
+export const SOFT_HOVER_ALPHA = 0.22;

package/src/components/data-display/Chip/Chip.styles.tsx

@@ -4,7 +4,17 @@ import type { KeyboardEvent, ReactElement } from 'react';
 import React from 'react';
 
 import { chipKeyAction, type ChipKeyArgs } from './Chip.helpers';
-import { CHIP_SIZES, CHIP_TRANSITION_EASING, CHIP_TRANSITION_MS, HOVER_LIFT_PX, HOVER_SHADOW } from './Chip.metrics';
+import { alpha } from '@mui/material/styles/index.js';
+
+import {
+  CHIP_SIZES,
+  CHIP_TRANSITION_EASING,
+  CHIP_TRANSITION_MS,
+  HOVER_LIFT_PX,
+  HOVER_SHADOW,
+  SOFT_GROUND_ALPHA,
+  SOFT_HOVER_ALPHA,
+} from './Chip.metrics';
 import type { ChipProps } from './Chip.types';
 import { shadowInk } from '../../../tokens/ink';
 import { rem, rems, sxRem } from '../../../tokens/relative';
@@ -43,6 +53,7 @@ export const avatarFor = (
 
 interface ChipStyleArgs {
   variant: ChipProps['variant'];
+  color?: ChipProps['color'];
   selected?: boolean;
   clickable?: boolean;
   disabled?: boolean;
@@ -61,8 +72,33 @@ const hoverShadow = (theme: Theme): string =>
  * state); an outlined selected chip gets a subtle theme-driven `action.selected`
  * tint so it reads as active without muddying the fill.
  */
+/** The palette entry a colour paints with; `neutral` has none and takes the ink. */
+const paletteKey = (color: NonNullable<ChipProps['color']>): 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | null => {
+  if (color === 'neutral') return null;
+  return color === 'danger' ? 'error' : color;
+};
+
+/** `soft`: the colour's tint for a ground, its dark step for ink (and the icon). */
+const softStyles = (color: NonNullable<ChipProps['color']>): SxProps<Theme> => {
+  const key = paletteKey(color);
+  const ground = (theme: Theme): string =>
+    key ? alpha(theme.palette[key].main, SOFT_GROUND_ALPHA) : theme.palette.action.selected;
+  const ink = (theme: Theme): string => (key ? theme.palette[key].dark : theme.palette.text.secondary);
+  return {
+    backgroundColor: ground,
+    color: ink,
+    // A state is read at a glance: the label is set semibold.
+    fontWeight: 600,
+    '& .MuiChip-icon': { color: ink },
+    '&.MuiChip-clickable:hover': {
+      backgroundColor: (theme: Theme) => (key ? alpha(theme.palette[key].main, SOFT_HOVER_ALPHA) : theme.palette.action.hover),
+    },
+  };
+};
+
 export const chipStyles = ({
   variant,
+  color = 'primary',
   selected,
   clickable,
   disabled,
@@ -70,6 +106,7 @@ export const chipStyles = ({
   const lifts = clickable && !disabled;
 
   return {
+    ...(variant === 'soft' ? (softStyles(color) as object) : {}),
     // Enhanced styling for outlined variant
     ...(variant === 'outlined' && {
       borderWidth: '1px',

package/src/components/data-display/Chip/Chip.tsx

@@ -37,6 +37,10 @@ const muiColorFor = (color: NonNullable<ChipProps['color']>): MuiChipColor => {
   return color === 'neutral' ? 'default' : color;
 };
 
+/** `soft` is ours: MUI has two variants, so it paints as `filled` and `chipStyles` tints it. */
+const muiVariantFor = (variant: NonNullable<ChipProps['variant']>): 'filled' | 'outlined' =>
+  variant === 'soft' ? 'filled' : variant;
+
 export const Chip = forwardRef<HTMLDivElement, ChipProps>(({
   label,
   variant = 'filled',
@@ -66,7 +70,7 @@ export const Chip = forwardRef<HTMLDivElement, ChipProps>(({
     <MuiChip
       ref={ref}
       label={<span data-testid={testId('label')}>{label}</span>}
-      variant={variant}
+      variant={muiVariantFor(variant)}
       size={chipMuiSize(size)}
       color={muiColorFor(color)}
       avatar={avatarFor(avatar, avatarSrc)}
@@ -81,7 +85,7 @@ export const Chip = forwardRef<HTMLDivElement, ChipProps>(({
       role={chipRole(selectable, onClick)}
       aria-selected={selectable ? selected : undefined}
       data-testid={chipId || 'chip'}
-      sx={chipStyles({ variant, selected, clickable, disabled })}
+      sx={chipStyles({ variant, color, selected, clickable, disabled })}
       {...props}
     />
   );

package/src/components/data-display/Chip/chip.md

@@ -5,7 +5,7 @@
 ```ts
 interface ChipProps {
   label: string;
-  variant?: 'filled' | 'outlined';
+  variant?: 'filled' | 'outlined' | 'soft';
   size?: SizeValue; // all five stops; MUI's two heights, xs/sm small and md up medium
   /**
    * The house vocabulary, identical to Button's. `danger` and `neutral` are
@@ -28,7 +28,7 @@ interface ChipProps {
 
 **Features**
 
-- Filled/Outlined variants; optional avatar or icon.
+- Filled/Outlined/Soft variants; optional avatar or icon. `soft` is a status chip: the colour's tint for a ground and its dark step for ink.
 - Selectable (toggle) and/or deletable (× button).
 - Keyboard: Space/Enter activates; Delete/Backspace triggers remove when focused.
 

package/src/components/data-display/DataViews/DataViewsGrid.tsx

@@ -199,6 +199,13 @@ interface DataViewsGridProps<T extends Record<string, unknown>> {
    * rather than relying on `position: sticky` (see `useStickyTableHead`).
    */
   stickyToolbar?: boolean;
+  /**
+   * Show the "N de N" counter (default `true`). `false` removes it from the
+   * bar AND from the ladder's budget, so nothing is shed to make room for it —
+   * for a list whose rows are not all records (section headings handed in as
+   * rows would be counted as results).
+   */
+  showCounter?: boolean;
   /** Server-mode wiring; when set the grid is backend-driven (no client filter/sort/paginate). */
   server?: DataViewServer;
 }

package/src/components/data-display/DataViews/DataViewsTableBase.tsx

@@ -120,6 +120,8 @@ export interface DataViewsTableBaseProps<T extends Record<string, unknown>> {
   quickFilters?: QuickFilterConfig[];
   /** Pin the toolbar and the table header while the page scrolls — see `DataViewsGrid`. */
   stickyToolbar?: boolean;
+  /** Show the "N de N" counter (default `true`) — see `DataViewsGrid`. */
+  showCounter?: boolean;
   /** Server-mode wiring (FUT-180): backend-driven rows/total + re-fetch. Omit for client mode. */
   server?: DataViewServer;
   /** Seed the initial view state (search/pills/ranges/sort) from the URL when no saved view applies. */

package/src/components/data-display/DataViews/RESPONSIVE-BEHAVIOUR.md

@@ -142,6 +142,16 @@ but not without a way to search.
 
 ---
 
+### A host without the counter (`showCounter={false}`)
+
+A list whose rows are not all records — section headings handed in as rows —
+cannot use the counter: it counts every row it is given, so six items under
+three headings read "9 de 9". `showCounter={false}` takes it off the bar AND
+out of the ladder's budget (it is priced at 0 at every rung), so nothing is shed
+and no gap is left for a control that is not there. Hiding it from the outside
+with CSS does neither: the ladder still pays for it. Pinned in
+`__tests__/data-views-show-counter.test.tsx`.
+
 ## Behaviour by class
 
 Read this as "what the Pedidos table does", not "what the code hard-codes".

package/src/components/data-display/DataViews/data-views-grid-parts.tsx

@@ -105,6 +105,8 @@ interface GridShellFiltersArgs<T extends Record<string, unknown>> {
   /** Is "Exportar" on the bar? Half the right cluster's cost when it is not. */
   hasExport: boolean;
   quickFilters: QuickFilterConfig[];
+  /** Is the "N de N" counter on the bar? Priced at 0 when it is not. */
+  showCounter: boolean;
 }
 
 function useGridShellFilters<T extends Record<string, unknown>>({
@@ -116,12 +118,15 @@ function useGridShellFilters<T extends Record<string, unknown>>({
   alwaysShowSearch,
   hasExport,
   quickFilters,
+  showCounter,
 }: GridShellFiltersArgs<T>): {
   showInline: boolean;
   useModal: boolean;
   inlineVisible: boolean;
   filterProps: FilterSurfaceProps<T>;
   split: OverflowSplit<T>;
+  /** The counter is off: the host turned it off, or the ladder shed it. */
+  counterHidden: boolean;
   onControlOpenChange: (open: boolean) => void;
 } {
   const { state } = c;
@@ -137,6 +142,7 @@ function useGridShellFilters<T extends Record<string, unknown>>({
     c.ranges,
     openControls > 0,
     hasExport,
+    showCounter,
   );
   // THE BAR RENDERS AT EVERY WIDTH. It used to be swapped for a full-screen
   // filter MODAL below `lg`, which was the responsive strategy before the
@@ -178,6 +184,7 @@ function useGridShellFilters<T extends Record<string, unknown>>({
     inlineVisible,
     filterProps,
     split,
+    counterHidden: !showCounter || (showInline && split.counterHidden),
     onControlOpenChange: (open) =>
       setOpenControls((count) => Math.max(0, count + (open ? 1 : -1))),
   };
@@ -253,6 +260,8 @@ interface GridShellProps<T extends Record<string, unknown>> {
   quickFilters?: QuickFilterConfig[];
   /** Pin the toolbar and the table header while the page scrolls. */
   stickyToolbar?: boolean;
+  /** Hide the "N de N" counter — see `DataViewsGrid`. */
+  showCounter?: boolean;
 }
 
 /** The scrollable content region: scope tabs, toolbar, filter bar, body, pager. */
@@ -298,7 +307,7 @@ function ShellStack<T extends Record<string, unknown>>({
           allOnPageSelected={allOnPageSelected(c, props.getRowId)}
           toolbarRightSlot={props.toolbarRightSlot}
           compactControls={showInline && split.compactControls}
-          counterHidden={showInline && split.counterHidden}
+          counterHidden={filters.counterHidden}
           showInline={showInline}
           sticky={props.stickyToolbar === true}
         />
@@ -355,6 +364,7 @@ export function GridShell<T extends Record<string, unknown>>(props: GridShellPro
     alwaysShowSearch,
     hasExport: props.exportConfig !== undefined,
     quickFilters: props.quickFilters ?? [],
+    showCounter: props.showCounter !== false,
   });
   return (
     <DataViewsLayoutProvider

package/src/components/data-display/DataViews/data-views-overflow-costs.ts

@@ -153,10 +153,15 @@ export const RESERVED = {
 /** {@link RESERVED} at a theme's type scale — the px the measured bar is in. */
 export type Prices = Record<keyof typeof RESERVED, number>;
 
-/** Price the furniture for `theme`: every {@link RESERVED} entry through `remPx`. */
-export function pricesFor(theme: Theme): Prices {
+/**
+ * Price the furniture for `theme`: every {@link RESERVED} entry through `remPx`.
+ * A counter the host turned off costs nothing at any rung: pricing it anyway
+ * left a gap where it would have been, and shed controls for it.
+ */
+export function pricesFor(theme: Theme, showCounter = true): Prices {
   const entries = Object.entries(RESERVED).map(([key, px]) => [key, remPx(theme, px)]);
-  return Object.fromEntries(entries) as Prices;
+  const prices = Object.fromEntries(entries) as Prices;
+  return showCounter ? prices : { ...prices, counter: 0 };
 }
 
 /** What the right-hand cluster costs, given what the host actually renders. */

package/src/components/data-display/DataViews/data-views-overflow.ts

@@ -235,6 +235,7 @@ function computeSplit<T extends Record<string, unknown>>(
   /** Does the host render "Exportar" beside "Exibir"? Half the cluster if not. */
   hasExport: boolean,
   theme: Theme,
+  showCounter = true, // the host shows the "N de N" counter — priced at 0 when not
 ): Omit<OverflowSplit<T>, "barRef"> {
   // Unmeasured (SSR, or jsdom without a ResizeObserver) ⇒ degrade nothing.
   if (width === 0) {
@@ -248,7 +249,7 @@ function computeSplit<T extends Record<string, unknown>>(
       searchTakeover: false,
     };
   }
-  const price = pricesFor(theme);
+  const price = pricesFor(theme, showCounter);
   // Pass 1 prices the furniture at its widest — no rung has been taken yet.
   let budget = furnitureCost(price, UNCOLLAPSED, hasExport);
   let split = splitFilters(all, pills, ranges, width, budget, false, theme);
@@ -360,6 +361,7 @@ export function useFilterOverflow<T extends Record<string, unknown>>(
   frozen = false,
   /** Whether "Exportar" is on the bar — see `rightClusterCost`. */
   hasExport = true,
+  showCounter = true, // whether the "N de N" counter is on the bar — see `computeSplit`
 ): OverflowSplit<T> {
   // The measurement is `useMeasuredWidth` (`utility/Overflow`): the same
   // ResizeObserver every collapsing cluster in the design system reads, so
@@ -370,18 +372,18 @@ export function useFilterOverflow<T extends Record<string, unknown>>(
   // The prices follow the theme's type scale, so the answer does too.
   const theme = useTheme();
   const signature = JSON.stringify({
-    // A chip's count and a field's `inMore` change its price or its place
-    // without changing its id, so both are part of the key.
+    // A chip's count and `inMore` move its price or place, not its id: both key.
     ids: all.map((field) => [field.id, field.quick?.count ?? null, field.pinned === true]),
     pills,
     ranges,
     width,
     hasExport,
+    showCounter,
     scale: remPx(theme, 1),
   });
   const cache = useRef<{ signature: string; split: ReturnType<typeof computeSplit<T>> } | null>(null);
   if (cache.current === null || (!frozen && cache.current.signature !== signature)) {
-    cache.current = { signature, split: computeSplit(all, pills, ranges, width, hasExport, theme) };
+    cache.current = { signature, split: computeSplit(all, pills, ranges, width, hasExport, theme, showCounter) };
   }
   // The cache holds the ARRANGEMENT — which ids sit on the bar, which in "Mais"
   // — never the fields themselves. The signature keys on ids, so a field whose

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

@@ -138,6 +138,7 @@ new component that portals should too.
 | `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 |
+| `panelWidth` | `{ share: string; maxPx: number; fullBelowPx?: number }` | - | An exact width for the top panel: `min(share, maxPx)` of the viewport, the whole screen under `fullBelowPx`. Replaces `size` and `maxWidth`. Viewport only — nothing inside the panel feeds back into it |
 | `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, PanelSize } from './StackedModal.types';
+import type { ModalPanelRole, PanelMaxWidth, PanelSize, PanelWidth } from './StackedModal.types';
 
 /** Props that drive the panel's look but must not reach the DOM. */
 export interface PanelStyleProps {
@@ -13,10 +13,11 @@ export interface PanelStyleProps {
   rtl?: boolean;
   customMaxWidth?: PanelMaxWidth;
   panelSize?: PanelSize;
+  panelWidth?: PanelWidth;
 }
 
 /** Style-only props, filtered out before they can land on a DOM node. */
-export const STYLE_ONLY_PROPS = ['modalRole', 'isAnimating', 'glass', 'rtl', 'customMaxWidth', 'panelSize'];
+export const STYLE_ONLY_PROPS = ['modalRole', 'isAnimating', 'glass', 'rtl', 'customMaxWidth', 'panelSize', 'panelWidth'];
 
 /** MUI breakpoint names mapped to the pixel width they cap the panel at. */
 const MAX_WIDTH_PX: Record<Exclude<PanelMaxWidth, false>, number> = {
@@ -38,6 +39,15 @@ const ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {
   primary: 'contractModal 300ms ease-in-out forwards',
 };
 
+/** The custom property an exact-width panel's width and keyframes share. */
+const EXACT_WIDTH_VAR = '--stacked-modal-width';
+
+/** An exact-width panel settles at its own width, so its keyframes read it too. */
+const EXACT_ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {
+  secondary: 'expandModalExact 300ms ease-in-out forwards',
+  primary: 'contractModalExact 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',
@@ -63,6 +73,15 @@ const KEYFRAMES: CSSObject = {
     from: { width: '100vw', transform: 'translateX(0)' },
     to: { width: '90vw', transform: 'translateX(0)' },
   },
+  // An exact-width panel settles at its own width, carried by the custom property.
+  '@keyframes expandModalExact': {
+    from: { width: `var(${EXACT_WIDTH_VAR})`, transform: 'translateX(0)' },
+    to: { width: '100vw', transform: 'translateX(0)' },
+  },
+  '@keyframes contractModalExact': {
+    from: { width: '100vw', transform: 'translateX(0)' },
+    to: { width: `var(${EXACT_WIDTH_VAR})`, transform: 'translateX(0)' },
+  },
 };
 
 const cap = (customMaxWidth?: PanelMaxWidth): number | null =>
@@ -106,6 +125,22 @@ const widePrimaryPanelStyles = (theme: Theme, capPx: number | null): CSSObject =
   [theme.breakpoints.up(2200)]: panelWidth(theme, '60vw', capPx),
 });
 
+/**
+ * `panelWidth`: `min(share, maxPx)` from `sm` up, the whole screen under `sm`
+ * and under `fullBelowPx`. Viewport media queries only — never the panel's size.
+ */
+const exactPrimaryPanelStyles = (theme: Theme, exact: PanelWidth): CSSObject => {
+  const width = `min(${exact.share}, ${rem(theme, exact.maxPx)})`;
+  const full = { [EXACT_WIDTH_VAR]: '100%', width: '100%', maxWidth: '100%' };
+  return {
+    [EXACT_WIDTH_VAR]: width,
+    width: `var(${EXACT_WIDTH_VAR})`,
+    maxWidth: `var(${EXACT_WIDTH_VAR})`,
+    [theme.breakpoints.down('sm')]: full,
+    ...(exact.fullBelowPx ? { [theme.breakpoints.down(exact.fullBelowPx)]: full } : {}),
+  };
+};
+
 /** Panels below the top one expand to full width, producing the GTM stacking effect. */
 const secondaryPanelStyles = (): CSSObject => ({
   width: '100vw !important',
@@ -123,8 +158,10 @@ const rolePanelStyles = (
   role: ModalPanelRole | undefined,
   capPx: number | null,
   size?: PanelSize,
+  exact?: PanelWidth,
 ): CSSObject => {
   if (role === 'primary') {
+    if (exact) return exactPrimaryPanelStyles(theme, exact);
     return size === 'wide' ? widePrimaryPanelStyles(theme, capPx) : primaryPanelStyles(theme, capPx);
   }
   if (role === 'secondary') return secondaryPanelStyles();
@@ -143,8 +180,18 @@ const glassStyles = (theme: Theme, glass?: boolean, role?: ModalPanelRole): CSSO
       }
     : {};
 
-const animationStyles = (isAnimating?: boolean, role?: ModalPanelRole, size?: PanelSize): CSSObject => {
-  const byRole = size === 'wide' ? WIDE_ANIMATION_BY_ROLE : ANIMATION_BY_ROLE;
+const animationByRole = (size?: PanelSize, exact?: PanelWidth): Partial<Record<ModalPanelRole, string>> => {
+  if (exact) return EXACT_ANIMATION_BY_ROLE;
+  return size === 'wide' ? WIDE_ANIMATION_BY_ROLE : ANIMATION_BY_ROLE;
+};
+
+const animationStyles = (
+  isAnimating?: boolean,
+  role?: ModalPanelRole,
+  size?: PanelSize,
+  exact?: PanelWidth,
+): CSSObject => {
+  const byRole = animationByRole(size, exact);
   return isAnimating ? { animation: (role && byRole[role]) ?? 'none' } : {};
 };
 
@@ -169,9 +216,9 @@ const panelStyles = (theme: Theme, props: PanelStyleProps): CSSObject => {
   const capPx = cap(props.customMaxWidth);
   return {
     ...panelBaseStyles(theme),
-    ...rolePanelStyles(theme, props.modalRole, capPx, props.panelSize),
+    ...rolePanelStyles(theme, props.modalRole, capPx, props.panelSize, props.panelWidth),
     ...glassStyles(theme, props.glass, props.modalRole),
-    ...animationStyles(props.isAnimating, props.modalRole, props.panelSize),
+    ...animationStyles(props.isAnimating, props.modalRole, props.panelSize, props.panelWidth),
   };
 };
 

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

@@ -79,7 +79,7 @@ const useUnnamedDialogWarning = (unnamed: boolean): void => {
 const StackedModalPanel: FC<ResolvedProps> = (props) => {
   const {
     open, onClose, glass, navigationTitle, backLabel, hideClose, hideHeader, children, actions, modalId,
-    closeOnClickOutside, closeOnEsc, loading, loadingText, fullScreen, maxWidth, size, disableBackdrop,
+    closeOnClickOutside, closeOnEsc, loading, loadingText, fullScreen, maxWidth, size, panelWidth, disableBackdrop,
     disableFocusTrap, keepMounted, rtl, dataTestId,
     'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, ...otherProps
   } = props;
@@ -114,6 +114,7 @@ const StackedModalPanel: FC<ResolvedProps> = (props) => {
       rtl={rtl}
       customMaxWidth={maxWidth}
       panelSize={size}
+      panelWidth={panelWidth}
       TransitionComponent={SlideTransition}
       maxWidth={maxWidth}
       disableEscapeKeyDown={!closeOnEsc}