gantri-components 2.262.0 → 2.264.0

package/dist/components/modal/modal.styles.d.ts

@@ -42,6 +42,7 @@ export declare const StyledDynamicGlow: import("styled-components/dist/types").I
 }>> & string;
 export declare const StyledDynamicCloseButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
 export declare const StyledModalFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {
+    $dynamic?: boolean | undefined;
     $floating?: boolean | undefined;
     $fullWidth?: boolean | undefined;
     $hasBorder: boolean;

package/dist/components/modal/modal.types.d.ts

@@ -19,6 +19,19 @@ export type ModalSurface = 'solid' | 'dynamic';
  *       with `flex: 1` each.
  */
 export type ModalFooterLayout = 'auto' | 'fullWidth';
+/**
+ * Where the footer sits relative to the scrollable content. Only meaningful
+ * for the dynamic (glass) surface — the solid surface always renders its
+ * footer in flow.
+ *
+ * - `'floating'` (default): the footer floats over the bottom of the content
+ *   (the "liquid glass" look). Content gets extra bottom padding so the last
+ *   item clears the floating action.
+ * - `'fixed'`: the footer is pinned at the bottom of the modal in the normal
+ *   layout flow, so it never overlaps the content. The content scrolls above
+ *   it and a divider separates the two.
+ */
+export type ModalFooterPlacement = 'floating' | 'fixed';
 export interface ModalProps {
     /**
      * Internal: lets compound components (e.g. `ConfirmationModal`) override
@@ -43,6 +56,17 @@ export interface ModalProps {
      * to stretch a single primary action across the modal width.
      */
     footerLayout?: ModalFooterLayout;
+    /**
+     * Where the footer sits relative to the content on the dynamic (glass)
+     * surface. Defaults to `'floating'` (the footer floats over the content).
+     * Use `'fixed'` to pin the footer at the bottom in normal flow so it never
+     * overlaps the content. No-op on the solid surface (always in flow).
+     *
+     * Can also be defaulted per-theme via
+     * `createTheme({ defaults: { modal: { footerPlacement: 'fixed' } } })`.
+     * An explicit prop always wins over the theme default.
+     */
+    footerPlacement?: ModalFooterPlacement;
     header?: ReactNode;
     headerBorderBottom?: Property.Border;
     headerStyle?: CSSProperties;