@allxsmith/bestax-bulma 5.7.0 → 5.8.1

package/dist/types/helpers/useFlexboxClasses.d.ts

@@ -1,12 +1,46 @@
 import { validFlexDirections, validFlexWraps, validJustifyContents, validAlignContents, validAlignItems, validAlignSelfs, validFlexGrowShrink, BulmaDisplayProps } from './bulmaClassHelpers';
+/**
+ * Props for applying Bulma flexbox helper classes. The display props are read
+ * only to gate the flex container helpers; this hook never emits display
+ * classes itself.
+ */
 export interface BulmaFlexboxProps extends BulmaDisplayProps {
+    /** Flex direction (e.g., 'row', 'column'). */
     flexDirection?: (typeof validFlexDirections)[number];
+    /** Flex wrap (e.g., 'wrap', 'nowrap'). */
     flexWrap?: (typeof validFlexWraps)[number];
+    /** Justify content (e.g., 'center', 'space-between'). */
     justifyContent?: (typeof validJustifyContents)[number];
+    /** Align content (e.g., 'center', 'stretch'). */
     alignContent?: (typeof validAlignContents)[number];
+    /** Align items (e.g., 'center', 'flex-start'). */
     alignItems?: (typeof validAlignItems)[number];
+    /** Align self (e.g., 'auto', 'center'). */
     alignSelf?: (typeof validAlignSelfs)[number];
+    /** Flex grow value (e.g., '0', '1', '2', '3', '4', '5'). */
     flexGrow?: (typeof validFlexGrowShrink)[number];
+    /** Flex shrink value (e.g., '0', '1', '2', '3', '4', '5'). */
     flexShrink?: (typeof validFlexGrowShrink)[number];
 }
+/**
+ * A hook that generates Bulma flexbox helper classes. Flex container helpers
+ * (direction, wrap, justify/align content, align items) are only emitted when
+ * one of the display props indicates a flex display; flex item helpers
+ * (align self, grow, shrink) are always emitted.
+ *
+ * Note: this hook reads the display props purely as a gate and never emits
+ * display classes — `is-flex` and friends come from useVisibilityClasses (or
+ * the useBulmaClasses aggregate).
+ *
+ * @function useFlexboxClasses
+ * @param props - Flexbox-related Bulma helper props.
+ * @returns A space-separated string of flexbox helper classes.
+ * @example
+ * const flexboxClasses = useFlexboxClasses({
+ *   display: 'flex', // gates the container helpers, but emits no 'is-flex'
+ *   justifyContent: 'center',
+ * });
+ * // flexboxClasses: 'is-justify-content-center'
+ * // ('is-flex' itself comes from useVisibilityClasses/useBulmaClasses)
+ */
 export declare const useFlexboxClasses: (props: BulmaFlexboxProps) => string;

package/dist/types/helpers/useOtherClasses.d.ts

@@ -1,15 +1,42 @@
+/**
+ * Props for applying miscellaneous Bulma helper classes.
+ */
 export interface BulmaOtherProps {
+    /** Float direction (e.g., 'left', 'right'). */
     float?: 'left' | 'right';
+    /** Overflow behavior (e.g., 'clipped'). */
     overflow?: 'clipped';
+    /** Applies overlay styling if true. */
     overlay?: boolean;
+    /** Interaction behavior (e.g., 'unselectable', 'clickable'). */
     interaction?: 'unselectable' | 'clickable';
+    /** Cursor style (e.g., 'pointer', 'help'). */
     cursor?: 'pointer' | 'help';
+    /** Border radius style (e.g., 'radiusless'). */
     radius?: 'radiusless';
+    /** Shadow style (e.g., 'shadowless'). */
     shadow?: 'shadowless';
+    /** Responsive behavior (e.g., 'mobile', 'narrow'). */
     responsive?: 'mobile' | 'narrow';
+    /** Add Bulma skeleton class if true. */
     skeleton?: boolean;
+    /** Applies clearfix to fix floating children if true. */
     clearfix?: boolean;
+    /** Applies position: relative if true. */
     relative?: boolean;
+    /** Applies height: 100% if true. */
     fullHeight?: boolean;
 }
+/**
+ * A hook that generates miscellaneous Bulma helper classes (float, overflow,
+ * overlay, interaction, cursor, radius, shadow, responsive, skeleton,
+ * clearfix, relative, and full height).
+ *
+ * @function useOtherClasses
+ * @param props - Miscellaneous Bulma helper props.
+ * @returns A space-separated string of helper classes.
+ * @example
+ * const otherClasses = useOtherClasses({ float: 'left', skeleton: true });
+ * // otherClasses: 'is-pulled-left is-skeleton'
+ */
 export declare const useOtherClasses: (props: BulmaOtherProps) => string;

package/dist/types/helpers/useSpacingClasses.d.ts

@@ -1,18 +1,45 @@
 import { validSizes } from './bulmaClassHelpers';
+/**
+ * Props for applying Bulma margin and padding helper classes.
+ */
 export interface BulmaSpacingProps {
+    /** Margin (e.g., '0', '1'). */
     m?: (typeof validSizes)[number];
+    /** Margin top. */
     mt?: (typeof validSizes)[number];
+    /** Margin right. */
     mr?: (typeof validSizes)[number];
+    /** Margin bottom. */
     mb?: (typeof validSizes)[number];
+    /** Margin left. */
     ml?: (typeof validSizes)[number];
+    /** Margin horizontal (left and right). */
     mx?: (typeof validSizes)[number];
+    /** Margin vertical (top and bottom). */
     my?: (typeof validSizes)[number];
+    /** Padding (e.g., '0', '1'). */
     p?: (typeof validSizes)[number];
+    /** Padding top. */
     pt?: (typeof validSizes)[number];
+    /** Padding right. */
     pr?: (typeof validSizes)[number];
+    /** Padding bottom. */
     pb?: (typeof validSizes)[number];
+    /** Padding left. */
     pl?: (typeof validSizes)[number];
+    /** Padding horizontal (left and right). */
     px?: (typeof validSizes)[number];
+    /** Padding vertical (top and bottom). */
     py?: (typeof validSizes)[number];
 }
+/**
+ * A hook that generates Bulma margin and padding helper classes.
+ *
+ * @function useSpacingClasses
+ * @param props - Spacing-related Bulma helper props.
+ * @returns A space-separated string of spacing helper classes.
+ * @example
+ * const spacingClasses = useSpacingClasses({ m: '2', px: '4' });
+ * // spacingClasses: 'm-2 px-4'
+ */
 export declare const useSpacingClasses: (props: BulmaSpacingProps) => string;

package/dist/types/helpers/useTypographyClasses.d.ts

@@ -1,19 +1,51 @@
 import { validTextSizes, validAlignments, validTextTransforms, validTextWeights, validFontFamilies, BulmaViewportProps } from './bulmaClassHelpers';
+/**
+ * Props for applying Bulma typography helper classes.
+ */
 export interface BulmaTypographyProps extends BulmaViewportProps {
+    /** Text size (e.g., '1', '2'). */
     textSize?: (typeof validTextSizes)[number];
+    /** Text alignment (e.g., 'centered', 'left'). */
     textAlign?: (typeof validAlignments)[number];
+    /** Text transformation (e.g., 'uppercase', 'italic'). */
     textTransform?: (typeof validTextTransforms)[number];
+    /** Text weight (e.g., 'light', 'bold'). */
     textWeight?: (typeof validTextWeights)[number];
+    /** Font family (e.g., 'sans-serif', 'code'). */
     fontFamily?: (typeof validFontFamilies)[number];
+    /** Text size for mobile viewport (up to 768px). */
     textSizeMobile?: (typeof validTextSizes)[number];
+    /** Text size for tablet viewport (769px - 1023px). */
     textSizeTablet?: (typeof validTextSizes)[number];
+    /** Text size for desktop viewport (1024px - 1215px). */
     textSizeDesktop?: (typeof validTextSizes)[number];
+    /** Text size for widescreen viewport (1216px - 1407px). */
     textSizeWidescreen?: (typeof validTextSizes)[number];
+    /** Text size for fullhd viewport (1408px and above). */
     textSizeFullhd?: (typeof validTextSizes)[number];
+    /** Text alignment for mobile viewport (up to 768px). */
     textAlignMobile?: (typeof validAlignments)[number];
+    /** Text alignment for tablet viewport (769px - 1023px). */
     textAlignTablet?: (typeof validAlignments)[number];
+    /** Text alignment for desktop viewport (1024px - 1215px). */
     textAlignDesktop?: (typeof validAlignments)[number];
+    /** Text alignment for widescreen viewport (1216px - 1407px). */
     textAlignWidescreen?: (typeof validAlignments)[number];
+    /** Text alignment for fullhd viewport (1408px and above). */
     textAlignFullhd?: (typeof validAlignments)[number];
 }
+/**
+ * A hook that generates Bulma typography helper classes, including
+ * viewport-specific text size and alignment variants.
+ *
+ * @function useTypographyClasses
+ * @param props - Typography-related Bulma helper props.
+ * @returns A space-separated string of typography helper classes.
+ * @example
+ * const typographyClasses = useTypographyClasses({
+ *   textSize: '3',
+ *   textWeight: 'bold',
+ * });
+ * // typographyClasses: 'is-size-3 has-text-weight-bold'
+ */
 export declare const useTypographyClasses: (props: BulmaTypographyProps) => string;

package/dist/types/helpers/useVisibilityClasses.d.ts

@@ -1,10 +1,35 @@
 import { validVisibilities, BulmaViewportProps, BulmaDisplayProps } from './bulmaClassHelpers';
+/**
+ * Props for applying Bulma visibility and display helper classes.
+ */
 export interface BulmaVisibilityProps extends BulmaViewportProps, BulmaDisplayProps {
+    /** Visibility (e.g., 'hidden', 'sr-only'). */
     visibility?: (typeof validVisibilities)[number];
+    /** Visibility for mobile viewport (up to 768px). */
     visibilityMobile?: (typeof validVisibilities)[number];
+    /** Visibility for tablet viewport (769px - 1023px). */
     visibilityTablet?: (typeof validVisibilities)[number];
+    /** Visibility for desktop viewport (1024px - 1215px). */
     visibilityDesktop?: (typeof validVisibilities)[number];
+    /** Visibility for widescreen viewport (1216px - 1407px). */
     visibilityWidescreen?: (typeof validVisibilities)[number];
+    /** Visibility for fullhd viewport (1408px and above). */
     visibilityFullhd?: (typeof validVisibilities)[number];
 }
+/**
+ * A hook that generates Bulma visibility and display helper classes. This hook
+ * owns all display class emission, including viewport-specific display props,
+ * the legacy display/viewport combination, and `display: 'none'` mapping to
+ * `is-hidden`.
+ *
+ * @function useVisibilityClasses
+ * @param props - Visibility- and display-related Bulma helper props.
+ * @returns A space-separated string of visibility and display helper classes.
+ * @example
+ * const visibilityClasses = useVisibilityClasses({
+ *   display: 'flex',
+ *   visibilityMobile: 'hidden',
+ * });
+ * // visibilityClasses: 'is-hidden-mobile is-flex'
+ */
 export declare const useVisibilityClasses: (props: BulmaVisibilityProps) => string;

package/dist/types/helpers/withSubComponents.d.ts

@@ -1,3 +1,16 @@
+/**
+ * Attaches compound sub-components as statics on a base component and
+ * optionally sets the parent's displayName.
+ *
+ * Internal helper — it MUST mutate and return the same function object
+ * (`Object.assign`), never wrap the base in a new function: identity checks
+ * like `child.type === ModalCard` (Modal) and Field's displayName-based
+ * child detection rely on the attached component being the same object as
+ * the separately exported one.
+ *
+ * displayName is only ever set on the parent (and only when provided) —
+ * sub-components keep whatever displayName they declare themselves.
+ */
 export declare function withSubComponents<Base extends {
     displayName?: string;
 }, Subs extends Record<string, unknown>>(base: Base, subs: Subs, displayName?: string): Base & Subs;

package/dist/types/layout/Container.d.ts

@@ -1,17 +1,46 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Bulma container breakpoints.
+ */
 export type ContainerBreakpoint = 'tablet' | 'desktop' | 'widescreen';
+/**
+ * Props for the Container component.
+ */
 export interface ContainerProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes. */
     className?: string;
+    /** Text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /**
+     * Text color alias: renders `has-text-<color>`, exactly like `textColor`.
+     * Not a filled variant (no `.container.is-<color>` CSS exists). Prefer
+     * `textColor`, which takes precedence when both are set; use `bgColor` for
+     * a colored surface.
+     */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+    /** Background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Makes the container full-width with a 32px gap on each side. */
     fluid?: boolean;
+    /** Makes the container full-width until the `widescreen` breakpoint. */
     widescreen?: boolean;
+    /** Makes the container full-width until the `fullhd` breakpoint. */
     fullhd?: boolean;
+    /** Responsive breakpoint for container (`is-tablet`, `is-desktop`, `is-widescreen`). */
     breakpoint?: ContainerBreakpoint;
+    /** Uses Bulma's `is-max-*` class for the specified breakpoint, limiting max width. */
     isMax?: boolean;
+    /** Content inside the container. */
     children?: React.ReactNode;
 }
+/**
+ * The `Container` component provides a responsive and flexible layout wrapper for your Bulma React UI.
+ *
+ * @function
+ * @param {ContainerProps} props - Props for the Container component.
+ * @returns {JSX.Element} The rendered container.
+ * @see {@link https://bulma.io/documentation/layout/container/ | Bulma Container documentation}
+ */
 export declare const Container: React.FC<ContainerProps>;
 export default Container;

package/dist/types/layout/Footer.d.ts

@@ -1,12 +1,34 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Footer component.
+ */
 export interface FooterProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** The HTML tag to render as. */
     as?: 'footer' | 'div';
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content inside the footer. */
     children?: React.ReactNode;
 }
+/**
+ * The `Footer` component provides a semantic and accessible site footer for your Bulma React UI.
+ *
+ * @function
+ * @param {FooterProps} props - Props for the Footer component.
+ * @returns {JSX.Element} The rendered footer element.
+ * @see {@link https://bulma.io/documentation/layout/footer/ | Bulma Footer documentation}
+ *
+ * @example
+ * <Footer>
+ *   <div className="content has-text-centered">...</div>
+ * </Footer>
+ */
 export declare const Footer: React.FC<FooterProps>;
 export default Footer;

package/dist/types/layout/Hero.d.ts

@@ -1,37 +1,104 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Possible values for Bulma hero size.
+ */
 export type HeroSize = 'small' | 'medium' | 'large' | 'fullheight' | 'fullheight-with-navbar';
+/**
+ * Props for the Hero component.
+ */
 export interface HeroProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes. */
     className?: string;
+    /**
+     * Bulma color modifier for the hero section (renders `is-<color>`).
+     *
+     * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,
+     * `white`, `light`, and `dark` have shipped CSS for `.hero`. The other
+     * accepted values (`black-bis`, `black-ter`, `grey-darker`, `grey-dark`,
+     * `grey`, `grey-light`, `grey-lighter`, `inherit`, `current`) emit a class
+     * no CSS rule matches, so the hero renders unstyled; they log a console
+     * warning in development and will be removed from this union in the next
+     * major version.
+     */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Hero size. */
     size?: HeroSize;
+    /** Bulma background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Use fullheight hero with a navbar offset. */
     fullheightWithNavbar?: boolean;
+    /** Hero content (often includes `Hero.Head`, `Hero.Body`, `Hero.Foot`). */
     children?: React.ReactNode;
 }
+/**
+ * Props for the HeroHead component.
+ */
 export interface HeroHeadProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes. */
     className?: string;
+    /** Bulma color modifier for text. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Top bar for navigation or branding.
+ *
+ * @function
+ * @param {HeroHeadProps} props - Props for the HeroHead component.
+ * @returns {JSX.Element} The rendered hero head.
+ */
 export declare const HeroHead: React.FC<HeroHeadProps>;
+/**
+ * Props for the HeroBody component.
+ */
 export interface HeroBodyProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes. */
     className?: string;
+    /** Bulma color modifier for text. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Main content area, vertically centered by default.
+ *
+ * @function
+ * @param {HeroBodyProps} props - Props for the HeroBody component.
+ * @returns {JSX.Element} The rendered hero body.
+ */
 export declare const HeroBody: React.FC<HeroBodyProps>;
+/**
+ * Props for the HeroFoot component.
+ */
 export interface HeroFootProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes. */
     className?: string;
+    /** Bulma color modifier for text. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Bottom bar for tabs or actions.
+ *
+ * @function
+ * @param {HeroFootProps} props - Props for the HeroFoot component.
+ * @returns {JSX.Element} The rendered hero foot.
+ */
 export declare const HeroFoot: React.FC<HeroFootProps>;
 export declare const Hero: React.FC<HeroProps> & {
     Head: React.FC<HeroHeadProps>;

package/dist/types/layout/Level.d.ts

@@ -1,41 +1,101 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Level component.
+ */
 export interface LevelProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Keeps the level horizontal on mobile (Bulma `is-mobile`). Without it
+     * the level stacks vertically below tablet. */
     isMobile?: boolean;
+    /** Bulma color modifier for the level. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Level content (`Level.Left`, `Level.Right`, `Level.Item`). */
     children?: React.ReactNode;
 }
+/**
+ * Props for the LevelLeft component.
+ */
 export interface LevelLeftProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Left-aligned content.
+ *
+ * @function
+ * @param {LevelLeftProps} props - Props for the LevelLeft component.
+ * @returns {JSX.Element} The rendered level left section.
+ */
 export declare const LevelLeft: React.FC<LevelLeftProps>;
+/**
+ * Props for the LevelRight component.
+ */
 export interface LevelRightProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Right-aligned content.
+ *
+ * @function
+ * @param {LevelRightProps} props - Props for the LevelRight component.
+ * @returns {JSX.Element} The rendered level right section.
+ */
 export declare const LevelRight: React.FC<LevelRightProps>;
+/**
+ * Props for the LevelItem component.
+ */
 export interface LevelItemProps extends React.HTMLAttributes<HTMLDivElement | HTMLParagraphElement | HTMLAnchorElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Element type to render. */
     as?: 'div' | 'p' | 'a';
+    /** Center the text in the item. */
     hasTextCentered?: boolean;
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content. */
     children?: React.ReactNode;
+    /** Href for "a" tag. */
     href?: string;
+    /** Target for "a" tag */
     target?: string;
+    /** Rel for "a" tag */
     rel?: string;
 }
+/**
+ * Individual item, can be rendered as `div`, `p`, or `a`.
+ *
+ * @function
+ * @param {LevelItemProps} props - Props for the LevelItem component.
+ * @returns {JSX.Element} The rendered level item.
+ */
 export declare const LevelItem: React.FC<LevelItemProps>;
 export declare const Level: React.FC<LevelProps> & {
     Left: React.FC<LevelLeftProps>;

package/dist/types/layout/Media.d.ts

@@ -1,38 +1,94 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Media component.
+ */
 export interface MediaProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Element type for the root Media container. */
     as?: 'article' | 'div';
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content inside the media container. */
     children?: React.ReactNode;
 }
+/**
+ * Props for the MediaLeft component.
+ */
 export interface MediaLeftProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Element type to render. */
     as?: 'figure' | 'div';
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * For avatars, thumbnails, icons (renders as `figure` or `div`)
+ *
+ * @function
+ * @param {MediaLeftProps} props - Props for the MediaLeft component.
+ * @returns {JSX.Element} The rendered media left section.
+ */
 export declare const MediaLeft: React.FC<MediaLeftProps>;
+/**
+ * Props for the MediaContent component.
+ */
 export interface MediaContentProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Main content (renders as `div`)
+ *
+ * @function
+ * @param {MediaContentProps} props - Props for the MediaContent component.
+ * @returns {JSX.Element} The rendered media content section.
+ */
 export declare const MediaContent: React.FC<MediaContentProps>;
+/**
+ * Props for the MediaRight component.
+ */
 export interface MediaRightProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Bulma color modifier. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Additional CSS classes. */
     className?: string;
+    /** Content. */
     children?: React.ReactNode;
 }
+/**
+ * Actions or controls (renders as `div`)
+ *
+ * @function
+ * @param {MediaRightProps} props - Props for the MediaRight component.
+ * @returns {JSX.Element} The rendered media right section.
+ */
 export declare const MediaRight: React.FC<MediaRightProps>;
+/** Media component with Left, Content, and Right sub-components. */
 export declare const Media: React.FC<MediaProps> & {
     Left: React.FC<MediaLeftProps>;
     Content: React.FC<MediaContentProps>;

package/dist/types/layout/Section.d.ts

@@ -1,13 +1,33 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Section size values for Bulma.
+ */
 type SectionSize = 'medium' | 'large';
+/**
+ * Props for the Section component.
+ */
 export interface SectionProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'backgroundColor' | 'color'> {
+    /** Bulma color modifier for text. */
     color?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Section size for extra vertical spacing. */
     size?: SectionSize;
+    /** Additional CSS classes. */
     className?: string;
+    /** Section content. */
     children?: React.ReactNode;
 }
+/**
+ * The `Section` component provides vertical spacing and visual separation for your Bulma React UI.
+ *
+ * @function
+ * @param {SectionProps} props - Props for the Section component.
+ * @returns {JSX.Element} The rendered section.
+ * @see {@link https://bulma.io/documentation/layout/section/ | Bulma Section documentation}
+ */
 export declare const Section: React.FC<SectionProps>;
 export {};