import type { FeatureIntroEyebrow, FeatureIntroItem } from './types';
import type { Snippet } from 'svelte';
type Props = {
    /** Accent chip above the title — names the area or product (e.g. "Content Lab"). */
    eyebrow?: FeatureIntroEyebrow;
    /** Main heading. */
    title: string;
    /** Supporting paragraph beneath the title. */
    description?: string;
    /** Short proof points rendered as a checklist below the hero. */
    highlights?: string[];
    /** Label above the feature list (e.g. a localized "What's included"). Omit to hide it. */
    featuresTitle?: string;
    /** Capabilities to list out. Omit (or pass `[]`) to render the hero alone. */
    features?: FeatureIntroItem[];
    /** Heading level of the title; the features-title and feature headings nest one and two levels below it (each capped at h6). Keep to 2–4 when features are present, or the sub-headings collapse onto the same level. @default 2 */
    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
    /**
     * Hero media — an `<img>`, kit `<Image>`, video, or illustration. Fills the media frame (`object-fit: cover`).
     * Images must carry `alt=""` — the frame is `aria-hidden` and decorative; the meaning lives in the title.
     * Omit for a single-column hero.
     */
    media?: Snippet;
    /** Call-to-action area, typically a kit `<Button type="anchor" href={...}>`. */
    actions?: Snippet;
};
/**
 * Onboarding / feature-introduction surface for any app area — a paneled hero (eyebrow, title, lede, media + CTA snippets, optional highlights checklist) followed by an optional list of capabilities with per-row badges. All copy comes from props, so it carries no built-in strings. Renders at `100%` width; wrap in the consumer's page for background, padding and max-width.
 *
 * ### CSS Custom Properties
 * | Property | Description | Default |
 * |---|---|---|
 * | `--sc-kit--feature-intro--gap` | Gap between the hero and the feature list | `--sc-kit--space--12` |
 * | `--sc-kit--feature-intro--background` | Hero panel background | `--sc-kit--color--bg--panel` |
 * | `--sc-kit--feature-intro--border-color` | Hero / feature card border color | `--sc-kit--color--border` |
 * | `--sc-kit--feature-intro--radius` | Hero / feature card corner radius | `--sc-kit--radius--lg` |
 * | `--sc-kit--feature-intro--padding` | Hero panel padding | `--sc-kit--space--10` |
 * | `--sc-kit--feature-intro--hero--gap` | Gap between media and body columns | `--sc-kit--space--12` |
 * | `--sc-kit--feature-intro--media--width` | Media column width | `18.75rem` (300px) |
 * | `--sc-kit--feature-intro--media--aspect-ratio` | Media frame aspect ratio | `2 / 3` |
 * | `--sc-kit--feature-intro--media--radius` | Media frame corner radius | `--sc-kit--radius--md` |
 * | `--sc-kit--feature-intro--title--font-size` | Title font size | `--sc-kit--font-size--3xl` |
 * | `--sc-kit--feature-intro--title--color` | Title color | `--sc-kit--color--text--primary` |
 * | `--sc-kit--feature-intro--description--color` | Lede color | `--sc-kit--color--text--secondary` |
 */
declare const Cmp: import("svelte").Component<Props, {}, "">;
type Cmp = ReturnType<typeof Cmp>;
export default Cmp;