import { BoxProps, ButtonProps, IconButtonProps, StackProps } from '@hiver/hiver-ui-kit';
import { StyledComponent } from '@emotion/styled';
/**
 * Tab content root for the Slack feature. outlook-ui owns the
 * surrounding tab bar; we paint just the body.
 */
export declare const TabContentRoot: StyledComponent<BoxProps>;
/**
 * Ready-state container — Hiver↔Slack hero illustration + body +
 * Start New CTA. Figma frame 683:664077 centers this in the
 * available area.
 */
export declare const ReadyStateContainer: StyledComponent<StackProps>;
export declare const HeroIllustrationWrapper: StyledComponent<BoxProps>;
/**
 * Ready-state containment — Figma frame 683:663852. The tab content
 * area is a subtle-gray backdrop with 8px padding; the hero + copy +
 * CTA live inside a rounded white card. The card is content-driven
 * (top-anchored), so the gray frame — not the card — takes the flex
 * and shows below the card.
 */
export declare const ReadyStateFrame: StyledComponent<BoxProps>;
export declare const ReadyStateCard: StyledComponent<StackProps>;
/**
 * Primary CTA — matches Figma's blue (#276cf0) primary surface.
 * 8/16 padding, radius 6, Inter Medium 14/20, white text. The
 * 0 2 3 rgba(0,0,0,0.07) drop shadow matches the Send button per
 * Figma 683:667027.
 */
export declare const PrimaryButton: StyledComponent<ButtonProps>;
/**
 * Connect-Slack CTA — Slack brand aubergine (#4a154b) with a leading
 * hash glyph, per Figma 683:660098. Distinct from the blue
 * PrimaryButton; content-sized (NOT full width), radius 6, 8/32 pad.
 */
export declare const ConnectSlackButton: StyledComponent<ButtonProps>;
export declare const SecondaryButton: StyledComponent<ButtonProps>;
/**
 * Centered modal — Figma 683:660097 / 660098. Backdrop dims at
 * rgba(0,0,0,0.4) approx; card is 399 wide × auto tall, radius
 * 12px, white bg with a soft large drop shadow.
 */
export declare const ModalBackdrop: StyledComponent<BoxProps>;
export declare const ModalCard: StyledComponent<BoxProps>;
/**
 * Logo panel inside the Connect modal — lavender wash with the
 * Hiver / swap / Slack icon trio centered. Per Figma 683:660099
 * the inner frame is 383×164 inside the 399×312 modal (i.e. a
 * full-width band that takes the top half).
 */
export declare const ModalLogoPanel: StyledComponent<BoxProps>;
export declare const ModalCloseButton: StyledComponent<IconButtonProps>;
export declare const LogoImage: StyledComponent<React.ImgHTMLAttributes<HTMLImageElement>>;
//# sourceMappingURL=style.d.ts.map