@nimbus-ds/patterns 1.35.1-rc.1 → 1.35.1-rc.11

package/dist/index.d.ts

@@ -38,8 +38,17 @@ export interface AppShellChatProperties {
 	 * The overlay auto-detects the parent bounds (respecting menu and header).
 	 */
 	expanded?: boolean;
+	/**
+	 * Width of the chat panel in collapsed (non-expanded) mode.
+	 * Accepts any valid CSS length value (e.g. "300px", "25vw") or a responsive
+	 * object keyed by breakpoint (e.g. `{ xs: "300px", xxl: "378px" }`).
+	 * Useful for consumer-controlled resize interactions such as a drag handle.
+	 * When omitted, defaults to the responsive `{ xs: "300px", xxl: "378px" }`.
+	 */
+	collapsedWidth?: NonNullable<BoxProps["maxWidth"]>;
 }
 export type AppShellChatProps = AppShellChatProperties & Omit<BoxProps, "position">;
+export declare const APPSHELL_CHAT_DEFAULT_WIDTH = "360px";
 declare const AppShellChat: React.FC<AppShellChatProps>;
 export interface AppShellComponents {
 	Header: typeof AppShellHeader;
@@ -124,6 +133,132 @@ export type AppShellMenuContextValue = {
  * @throws If `enforce=true` and used without a provider.
  */
 export declare const useAppShellMenuContext: (enforce?: boolean) => AppShellMenuContextValue;
+export type BottomSheetPadding = "none" | "base";
+/**
+ * A snap point expressed as a viewport-height percentage (e.g. "60%") or the
+ * keyword "full" (which stops just below the status bar, not full-bleed).
+ */
+export type BottomSheetSnapPoint = string;
+/**
+ * Predicate variant of `closeOnOutsidePress`: receives the DOM event and
+ * returns `true` to allow closing, `false` to ignore the press.
+ */
+export type CloseOnOutsidePress = (event: PointerEvent | MouseEvent) => boolean;
+export interface BottomSheetProperties {
+	/**
+	 * Determines if the bottom sheet is shown or not.
+	 * @default false
+	 */
+	open?: boolean;
+	/**
+	 * Callback fired when the component requests to be closed (overlay press,
+	 * close control, Escape, or a downward dismiss gesture).
+	 * () => void;
+	 */
+	onRemove?: () => void;
+	/**
+	 * Ordered list of heights the sheet can snap to. Each entry is a
+	 * viewport-height percentage (e.g. "60%") or the keyword "full".
+	 * @default ["60%", "90%", "full"]
+	 */
+	snapPoints?: BottomSheetSnapPoint[];
+	/**
+	 * Index within `snapPoints` used as the initial snap point.
+	 * @default 0
+	 */
+	defaultSnap?: number;
+	/**
+	 * Content of the sheet. Compose with BottomSheet.Header, BottomSheet.Body
+	 * and BottomSheet.Footer.
+	 * @TJS-type React.ReactNode
+	 */
+	children?: ReactNode;
+	/**
+	 * Controls whether pressing outside should close the sheet.
+	 * - boolean: enable/disable dismissal on outside press
+	 * - function: receive the DOM event and return true to allow closing
+	 * @default true
+	 */
+	closeOnOutsidePress?: boolean | CloseOnOutsidePress;
+	/**
+	 * The attribute name to ignore when checking for outside presses, so
+	 * portaled Popover/Modal content does not close the sheet.
+	 * @default "data-nimbus-outside-press-ignore"
+	 */
+	ignoreAttributeName?: string;
+	/**
+	 * Determines if background scroll is locked while the sheet is open.
+	 * @default true
+	 */
+	needRemoveScroll?: boolean;
+	/**
+	 * Explicit z-index for the sheet layer. Omitted by default: like Nimbus's
+	 * own Sidebar/Modal/Popover, the sheet relies on DOM mount order (its
+	 * portal is appended to document.body, so later-opened overlays paint on
+	 * top of earlier ones) rather than a z-index, so it stacks correctly
+	 * against Popover and other BottomSheet instances. Only set this to force
+	 * a specific stacking order against something outside Nimbus's own
+	 * z-index-less convention.
+	 */
+	zIndex?: number;
+}
+export type BottomSheetProps = BottomSheetProperties & {
+	/**
+	 * Root element where the portal should be mounted. When provided and not
+	 * null, the portal renders inside this element; otherwise it renders into
+	 * document.body. Useful to scope the sheet within a container (e.g.,
+	 * AppShell.Chat).
+	 */
+	root?: HTMLElement | null;
+} & Omit<HTMLAttributes<HTMLDivElement>, "color">;
+export interface BottomSheetHeaderProperties {
+	/**
+	 * The content of the sheet header. Accepts any node (title, actions, icons).
+	 * @TJS-type React.ReactNode
+	 */
+	children?: ReactNode;
+	/**
+	 * The padding around the header content area.
+	 * @default base
+	 */
+	padding?: BottomSheetPadding;
+}
+export type BottomSheetHeaderProps = BottomSheetHeaderProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
+export interface BottomSheetBodyProperties {
+	/**
+	 * The scrollable content of the sheet.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * The padding around the body content area.
+	 * @default base
+	 */
+	padding?: BottomSheetPadding;
+}
+export type BottomSheetBodyProps = BottomSheetBodyProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
+export interface BottomSheetFooterProperties {
+	/**
+	 * The content of the sheet footer.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * The padding around the footer content area.
+	 * @default base
+	 */
+	padding?: BottomSheetPadding;
+}
+export type BottomSheetFooterProps = BottomSheetFooterProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
+declare const BottomSheetBody: React.FC<BottomSheetBodyProps>;
+declare const BottomSheetFooter: React.FC<BottomSheetFooterProps>;
+declare const BottomSheetHeader: React.FC<BottomSheetHeaderProps>;
+declare const BottomSheetBase: React.FC<BottomSheetProps>;
+export declare const BottomSheet: typeof BottomSheetBase & {
+	Header: typeof BottomSheetHeader;
+	Body: typeof BottomSheetBody;
+	Footer: typeof BottomSheetFooter;
+};
 export interface CalloutCardProperties {
 	/**
 	 * CalloutCard color.