@dmitriikapustin/ui 0.4.1 → 0.4.2

package/dist/index.d.cts

@@ -201,6 +201,34 @@ interface SkeletonProps {
 }
 declare function Skeleton({ variant, width, height, className }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
+type HeadingTag = 'h1' | 'h2' | 'h3';
+type HeadingAlign = 'left' | 'center';
+interface SectionHeadingProps {
+    children: ReactNode;
+    /** HTML-тег. Default `'h2'` (стандартный section heading). */
+    as?: HeadingTag;
+    /** Выравнивание. Default `'left'`. */
+    align?: HeadingAlign;
+    /** Опциональный subtitle ниже заголовка. */
+    subtitle?: ReactNode;
+    className?: string;
+}
+/**
+ * Единый source для section-h2 типографики во всём пакете и потребителях.
+ * Берёт ту же типографику что у `PromoSplit.heading` / `PromoTestimonials.heading`:
+ * `font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.1; letter-spacing: -0.03em`.
+ *
+ * Закрывает кейс когда потребитель кладёт `FeatureGrid` / `BentoGrid` / `Gallery`
+ * без встроенного title и вынужден захардкоживать ту же типографику в своём `.heading`
+ * — теперь импортирует `<SectionHeading>` и получает единый стиль автоматически.
+ *
+ * ```tsx
+ * <SectionHeading>Почему гости выбирают этот отель</SectionHeading>
+ * <FeatureGrid features={...} verticalPadding="none" />
+ * ```
+ */
+declare function SectionHeading({ children, as, align, subtitle, className, }: SectionHeadingProps): react_jsx_runtime.JSX.Element;
+
 interface TicketButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     children: ReactNode;
     icon?: ReactNode;
@@ -692,9 +720,17 @@ interface HeroSectionProps {
      * На mobile (≤ 768px) всегда стекируется снизу.
      */
     mediaPosition?: 'left' | 'right';
+    /**
+     * Управление вертикальным padding'ом `.inner` обёртки.
+     * - `'default'` (default, BC) — `5rem` mobile / `8rem` md.
+     * - `'none'` — `padding-block: 0`. Использовать когда родитель (consumer)
+     *   контролирует vertical rhythm через свой wrapper и текущий пакетный
+     *   padding создаёт двойной gap.
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function HeroSection({ eyebrow, title, subtitle, actions, media, align, size, mediaPosition, className, }: HeroSectionProps): react_jsx_runtime.JSX.Element;
+declare function HeroSection({ eyebrow, title, subtitle, actions, media, align, size, mediaPosition, verticalPadding, className, }: HeroSectionProps): react_jsx_runtime.JSX.Element;
 
 interface LogoCloudProps {
     label?: string;
@@ -724,9 +760,16 @@ interface CTASectionProps {
     description?: string;
     actions?: ReactNode;
     variant?: 'default' | 'filled' | 'bordered';
+    /**
+     * Управление вертикальным padding'ом для variant=`'default'` (без bg).
+     * - `'default'` (default, BC) — `4rem` mobile / `6rem` md.
+     * - `'none'` — `padding-block: 0`.
+     * **Игнорируется** для `filled` / `bordered` variants — там padding внутренний (отступ от bg-границы до текста).
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function CTASection({ title, description, actions, variant, className, }: CTASectionProps): react_jsx_runtime.JSX.Element;
+declare function CTASection({ title, description, actions, variant, verticalPadding, className, }: CTASectionProps): react_jsx_runtime.JSX.Element;
 
 interface BentoItem {
     title: string;
@@ -739,9 +782,15 @@ interface BentoItem {
 }
 interface BentoGridProps {
     items: BentoItem[];
+    /**
+     * Управление вертикальным padding'ом `.root`.
+     * - `'default'` (default, BC) — `2.5rem` mobile / `3.5rem` md.
+     * - `'none'` — `padding-block: 0` (родитель контролирует rhythm).
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function BentoGrid({ items, className }: BentoGridProps): react_jsx_runtime.JSX.Element;
+declare function BentoGrid({ items, verticalPadding, className }: BentoGridProps): react_jsx_runtime.JSX.Element;
 
 interface FAQItem {
     question: string;
@@ -843,9 +892,16 @@ interface PromoSplitProps {
     }[];
     media?: ReactNode;
     mediaPosition?: 'left' | 'right';
+    /**
+     * Управление вертикальным padding'ом `.root`.
+     * - `'default'` (default, BC) — `4rem` mobile / `6rem` md.
+     * - `'none'` — `padding-block: 0`. Использовать когда родитель
+     *   контролирует vertical rhythm.
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function PromoSplit({ heading, description, features, media, mediaPosition, className, }: PromoSplitProps): react_jsx_runtime.JSX.Element;
+declare function PromoSplit({ heading, description, features, media, mediaPosition, verticalPadding, className, }: PromoSplitProps): react_jsx_runtime.JSX.Element;
 
 interface TrustFeature {
     icon?: ReactNode;
@@ -883,9 +939,15 @@ interface PromoTestimonialsProps {
     subtitle?: string;
     testimonials: Testimonial[];
     media?: ReactNode;
+    /**
+     * Управление вертикальным padding'ом `.root`.
+     * - `'default'` (default, BC) — `4rem` mobile / `6rem` md.
+     * - `'none'` — `padding-block: 0`.
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function PromoTestimonials({ heading, subtitle, testimonials, media, className, }: PromoTestimonialsProps): react_jsx_runtime.JSX.Element;
+declare function PromoTestimonials({ heading, subtitle, testimonials, media, verticalPadding, className, }: PromoTestimonialsProps): react_jsx_runtime.JSX.Element;
 
 interface PromoHeroProps {
     title: ReactNode;
@@ -1164,4 +1226,4 @@ interface LandingLayoutProps {
 }
 declare function LandingLayout({ mode, nav, footer, children, className, }: LandingLayoutProps): react_jsx_runtime.JSX.Element;
 
-export { Alert, AppCard, AppTopLine, ArticleBarChart, type ArticleBarChartProps, ArticleBody, type ArticleBodyProps, ArticleChatBlock, type ArticleChatBlockProps, ArticleFigure, type ArticleFigureProps, ArticleFooter, type ArticleFooterProps, ArticleHeading, type ArticleHeadingProps, ArticleHero, type ArticleHeroProps, ArticleLayout, type ArticleLayoutProps, ArticleLineChart, type ArticleLineChartProps, ArticleLinkButton, type ArticleLinkButtonProps, ArticleList, type ArticleListProps, ArticleNarrow, ArticleNote, type ArticleNoteProps, ArticleScatterChart, type ArticleScatterChartProps, ArticleTable, type ArticleTableColumn, type ArticleTableProps, type ArticleTableRow, ArticleWide, Avatar, Badge, BentoGrid, BottomSheet, Breadcrumbs, Button, CTASection, Card, type ChartSeries, ChatInput, ChatMessage, Checkbox, CodeInput, ComparisonTable, Divider, DropdownMenu, EmptyState, FAQSection, FeatureGrid, Footer, FormField, Gallery, Header, HeroSection, IconBadge, IconButton, IconWithText, IconlyActivity, IconlyAttach, IconlyBook, IconlyCategory, IconlyCheck, IconlyChevronDown, IconlyChevronLeft, IconlyChevronRight, IconlyClock, IconlyClose, IconlyError, IconlyEye, IconlyEyeOff, IconlyFolder, IconlyHeart, IconlyInfo, IconlyInfoCircle, IconlyLink, IconlyLock, IconlyMail, IconlyMenu, IconlyMoon, IconlyQuote, IconlyRoadmap, IconlySandbox, IconlySearch, IconlySend, IconlySetting, IconlyShield, IconlySmile, IconlyStar, IconlySuccess, IconlySun, IconlyWarning, Input, LandingLayout, Logo, LogoCloud, MenuItem, Modal, Pagination, PasswordInput, PricingCard, type PricingFeature, ProfileNav, PromoActionCards, PromoBento, PromoDevicesCTA, PromoHero, PromoHeroForm, PromoPricing, PromoShowcase, PromoSplit, PromoTestimonials, PromoTrustGrid, Radio, type ScatterPoint, SearchBar, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, Sidebar, type SidebarItem, Skeleton, Spinner, StampCard, Stat, StatBadge, StatsBar, Link as StyledLink, Tabs, Tag, TestimonialCard, Textarea, TicketButton, Toast, Toggle, Tooltip, TopPromo };
+export { Alert, AppCard, AppTopLine, ArticleBarChart, type ArticleBarChartProps, ArticleBody, type ArticleBodyProps, ArticleChatBlock, type ArticleChatBlockProps, ArticleFigure, type ArticleFigureProps, ArticleFooter, type ArticleFooterProps, ArticleHeading, type ArticleHeadingProps, ArticleHero, type ArticleHeroProps, ArticleLayout, type ArticleLayoutProps, ArticleLineChart, type ArticleLineChartProps, ArticleLinkButton, type ArticleLinkButtonProps, ArticleList, type ArticleListProps, ArticleNarrow, ArticleNote, type ArticleNoteProps, ArticleScatterChart, type ArticleScatterChartProps, ArticleTable, type ArticleTableColumn, type ArticleTableProps, type ArticleTableRow, ArticleWide, Avatar, Badge, BentoGrid, BottomSheet, Breadcrumbs, Button, CTASection, Card, type ChartSeries, ChatInput, ChatMessage, Checkbox, CodeInput, ComparisonTable, Divider, DropdownMenu, EmptyState, FAQSection, FeatureGrid, Footer, FormField, Gallery, Header, HeroSection, IconBadge, IconButton, IconWithText, IconlyActivity, IconlyAttach, IconlyBook, IconlyCategory, IconlyCheck, IconlyChevronDown, IconlyChevronLeft, IconlyChevronRight, IconlyClock, IconlyClose, IconlyError, IconlyEye, IconlyEyeOff, IconlyFolder, IconlyHeart, IconlyInfo, IconlyInfoCircle, IconlyLink, IconlyLock, IconlyMail, IconlyMenu, IconlyMoon, IconlyQuote, IconlyRoadmap, IconlySandbox, IconlySearch, IconlySend, IconlySetting, IconlyShield, IconlySmile, IconlyStar, IconlySuccess, IconlySun, IconlyWarning, Input, LandingLayout, Logo, LogoCloud, MenuItem, Modal, Pagination, PasswordInput, PricingCard, type PricingFeature, ProfileNav, PromoActionCards, PromoBento, PromoDevicesCTA, PromoHero, PromoHeroForm, PromoPricing, PromoShowcase, PromoSplit, PromoTestimonials, PromoTrustGrid, Radio, type ScatterPoint, SearchBar, SectionHeading, type SectionHeadingProps, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, Sidebar, type SidebarItem, Skeleton, Spinner, StampCard, Stat, StatBadge, StatsBar, Link as StyledLink, Tabs, Tag, TestimonialCard, Textarea, TicketButton, Toast, Toggle, Tooltip, TopPromo };

package/dist/index.d.ts

@@ -201,6 +201,34 @@ interface SkeletonProps {
 }
 declare function Skeleton({ variant, width, height, className }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
+type HeadingTag = 'h1' | 'h2' | 'h3';
+type HeadingAlign = 'left' | 'center';
+interface SectionHeadingProps {
+    children: ReactNode;
+    /** HTML-тег. Default `'h2'` (стандартный section heading). */
+    as?: HeadingTag;
+    /** Выравнивание. Default `'left'`. */
+    align?: HeadingAlign;
+    /** Опциональный subtitle ниже заголовка. */
+    subtitle?: ReactNode;
+    className?: string;
+}
+/**
+ * Единый source для section-h2 типографики во всём пакете и потребителях.
+ * Берёт ту же типографику что у `PromoSplit.heading` / `PromoTestimonials.heading`:
+ * `font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.1; letter-spacing: -0.03em`.
+ *
+ * Закрывает кейс когда потребитель кладёт `FeatureGrid` / `BentoGrid` / `Gallery`
+ * без встроенного title и вынужден захардкоживать ту же типографику в своём `.heading`
+ * — теперь импортирует `<SectionHeading>` и получает единый стиль автоматически.
+ *
+ * ```tsx
+ * <SectionHeading>Почему гости выбирают этот отель</SectionHeading>
+ * <FeatureGrid features={...} verticalPadding="none" />
+ * ```
+ */
+declare function SectionHeading({ children, as, align, subtitle, className, }: SectionHeadingProps): react_jsx_runtime.JSX.Element;
+
 interface TicketButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     children: ReactNode;
     icon?: ReactNode;
@@ -692,9 +720,17 @@ interface HeroSectionProps {
      * На mobile (≤ 768px) всегда стекируется снизу.
      */
     mediaPosition?: 'left' | 'right';
+    /**
+     * Управление вертикальным padding'ом `.inner` обёртки.
+     * - `'default'` (default, BC) — `5rem` mobile / `8rem` md.
+     * - `'none'` — `padding-block: 0`. Использовать когда родитель (consumer)
+     *   контролирует vertical rhythm через свой wrapper и текущий пакетный
+     *   padding создаёт двойной gap.
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function HeroSection({ eyebrow, title, subtitle, actions, media, align, size, mediaPosition, className, }: HeroSectionProps): react_jsx_runtime.JSX.Element;
+declare function HeroSection({ eyebrow, title, subtitle, actions, media, align, size, mediaPosition, verticalPadding, className, }: HeroSectionProps): react_jsx_runtime.JSX.Element;
 
 interface LogoCloudProps {
     label?: string;
@@ -724,9 +760,16 @@ interface CTASectionProps {
     description?: string;
     actions?: ReactNode;
     variant?: 'default' | 'filled' | 'bordered';
+    /**
+     * Управление вертикальным padding'ом для variant=`'default'` (без bg).
+     * - `'default'` (default, BC) — `4rem` mobile / `6rem` md.
+     * - `'none'` — `padding-block: 0`.
+     * **Игнорируется** для `filled` / `bordered` variants — там padding внутренний (отступ от bg-границы до текста).
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function CTASection({ title, description, actions, variant, className, }: CTASectionProps): react_jsx_runtime.JSX.Element;
+declare function CTASection({ title, description, actions, variant, verticalPadding, className, }: CTASectionProps): react_jsx_runtime.JSX.Element;
 
 interface BentoItem {
     title: string;
@@ -739,9 +782,15 @@ interface BentoItem {
 }
 interface BentoGridProps {
     items: BentoItem[];
+    /**
+     * Управление вертикальным padding'ом `.root`.
+     * - `'default'` (default, BC) — `2.5rem` mobile / `3.5rem` md.
+     * - `'none'` — `padding-block: 0` (родитель контролирует rhythm).
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function BentoGrid({ items, className }: BentoGridProps): react_jsx_runtime.JSX.Element;
+declare function BentoGrid({ items, verticalPadding, className }: BentoGridProps): react_jsx_runtime.JSX.Element;
 
 interface FAQItem {
     question: string;
@@ -843,9 +892,16 @@ interface PromoSplitProps {
     }[];
     media?: ReactNode;
     mediaPosition?: 'left' | 'right';
+    /**
+     * Управление вертикальным padding'ом `.root`.
+     * - `'default'` (default, BC) — `4rem` mobile / `6rem` md.
+     * - `'none'` — `padding-block: 0`. Использовать когда родитель
+     *   контролирует vertical rhythm.
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function PromoSplit({ heading, description, features, media, mediaPosition, className, }: PromoSplitProps): react_jsx_runtime.JSX.Element;
+declare function PromoSplit({ heading, description, features, media, mediaPosition, verticalPadding, className, }: PromoSplitProps): react_jsx_runtime.JSX.Element;
 
 interface TrustFeature {
     icon?: ReactNode;
@@ -883,9 +939,15 @@ interface PromoTestimonialsProps {
     subtitle?: string;
     testimonials: Testimonial[];
     media?: ReactNode;
+    /**
+     * Управление вертикальным padding'ом `.root`.
+     * - `'default'` (default, BC) — `4rem` mobile / `6rem` md.
+     * - `'none'` — `padding-block: 0`.
+     */
+    verticalPadding?: 'default' | 'none';
     className?: string;
 }
-declare function PromoTestimonials({ heading, subtitle, testimonials, media, className, }: PromoTestimonialsProps): react_jsx_runtime.JSX.Element;
+declare function PromoTestimonials({ heading, subtitle, testimonials, media, verticalPadding, className, }: PromoTestimonialsProps): react_jsx_runtime.JSX.Element;
 
 interface PromoHeroProps {
     title: ReactNode;
@@ -1164,4 +1226,4 @@ interface LandingLayoutProps {
 }
 declare function LandingLayout({ mode, nav, footer, children, className, }: LandingLayoutProps): react_jsx_runtime.JSX.Element;
 
-export { Alert, AppCard, AppTopLine, ArticleBarChart, type ArticleBarChartProps, ArticleBody, type ArticleBodyProps, ArticleChatBlock, type ArticleChatBlockProps, ArticleFigure, type ArticleFigureProps, ArticleFooter, type ArticleFooterProps, ArticleHeading, type ArticleHeadingProps, ArticleHero, type ArticleHeroProps, ArticleLayout, type ArticleLayoutProps, ArticleLineChart, type ArticleLineChartProps, ArticleLinkButton, type ArticleLinkButtonProps, ArticleList, type ArticleListProps, ArticleNarrow, ArticleNote, type ArticleNoteProps, ArticleScatterChart, type ArticleScatterChartProps, ArticleTable, type ArticleTableColumn, type ArticleTableProps, type ArticleTableRow, ArticleWide, Avatar, Badge, BentoGrid, BottomSheet, Breadcrumbs, Button, CTASection, Card, type ChartSeries, ChatInput, ChatMessage, Checkbox, CodeInput, ComparisonTable, Divider, DropdownMenu, EmptyState, FAQSection, FeatureGrid, Footer, FormField, Gallery, Header, HeroSection, IconBadge, IconButton, IconWithText, IconlyActivity, IconlyAttach, IconlyBook, IconlyCategory, IconlyCheck, IconlyChevronDown, IconlyChevronLeft, IconlyChevronRight, IconlyClock, IconlyClose, IconlyError, IconlyEye, IconlyEyeOff, IconlyFolder, IconlyHeart, IconlyInfo, IconlyInfoCircle, IconlyLink, IconlyLock, IconlyMail, IconlyMenu, IconlyMoon, IconlyQuote, IconlyRoadmap, IconlySandbox, IconlySearch, IconlySend, IconlySetting, IconlyShield, IconlySmile, IconlyStar, IconlySuccess, IconlySun, IconlyWarning, Input, LandingLayout, Logo, LogoCloud, MenuItem, Modal, Pagination, PasswordInput, PricingCard, type PricingFeature, ProfileNav, PromoActionCards, PromoBento, PromoDevicesCTA, PromoHero, PromoHeroForm, PromoPricing, PromoShowcase, PromoSplit, PromoTestimonials, PromoTrustGrid, Radio, type ScatterPoint, SearchBar, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, Sidebar, type SidebarItem, Skeleton, Spinner, StampCard, Stat, StatBadge, StatsBar, Link as StyledLink, Tabs, Tag, TestimonialCard, Textarea, TicketButton, Toast, Toggle, Tooltip, TopPromo };
+export { Alert, AppCard, AppTopLine, ArticleBarChart, type ArticleBarChartProps, ArticleBody, type ArticleBodyProps, ArticleChatBlock, type ArticleChatBlockProps, ArticleFigure, type ArticleFigureProps, ArticleFooter, type ArticleFooterProps, ArticleHeading, type ArticleHeadingProps, ArticleHero, type ArticleHeroProps, ArticleLayout, type ArticleLayoutProps, ArticleLineChart, type ArticleLineChartProps, ArticleLinkButton, type ArticleLinkButtonProps, ArticleList, type ArticleListProps, ArticleNarrow, ArticleNote, type ArticleNoteProps, ArticleScatterChart, type ArticleScatterChartProps, ArticleTable, type ArticleTableColumn, type ArticleTableProps, type ArticleTableRow, ArticleWide, Avatar, Badge, BentoGrid, BottomSheet, Breadcrumbs, Button, CTASection, Card, type ChartSeries, ChatInput, ChatMessage, Checkbox, CodeInput, ComparisonTable, Divider, DropdownMenu, EmptyState, FAQSection, FeatureGrid, Footer, FormField, Gallery, Header, HeroSection, IconBadge, IconButton, IconWithText, IconlyActivity, IconlyAttach, IconlyBook, IconlyCategory, IconlyCheck, IconlyChevronDown, IconlyChevronLeft, IconlyChevronRight, IconlyClock, IconlyClose, IconlyError, IconlyEye, IconlyEyeOff, IconlyFolder, IconlyHeart, IconlyInfo, IconlyInfoCircle, IconlyLink, IconlyLock, IconlyMail, IconlyMenu, IconlyMoon, IconlyQuote, IconlyRoadmap, IconlySandbox, IconlySearch, IconlySend, IconlySetting, IconlyShield, IconlySmile, IconlyStar, IconlySuccess, IconlySun, IconlyWarning, Input, LandingLayout, Logo, LogoCloud, MenuItem, Modal, Pagination, PasswordInput, PricingCard, type PricingFeature, ProfileNav, PromoActionCards, PromoBento, PromoDevicesCTA, PromoHero, PromoHeroForm, PromoPricing, PromoShowcase, PromoSplit, PromoTestimonials, PromoTrustGrid, Radio, type ScatterPoint, SearchBar, SectionHeading, type SectionHeadingProps, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, Sidebar, type SidebarItem, Skeleton, Spinner, StampCard, Stat, StatBadge, StatsBar, Link as StyledLink, Tabs, Tag, TestimonialCard, Textarea, TicketButton, Toast, Toggle, Tooltip, TopPromo };