@allxsmith/bestax-bulma 5.7.0 → 5.8.1

package/dist/types/components/Steps.d.ts

@@ -1,43 +1,99 @@
 import React from 'react';
 import { BulmaClassesProps } from '../helpers/useBulmaClasses';
+/** Available size modifiers for the Steps component. */
 export type StepsSize = 'small' | 'medium' | 'large';
+/** Available color variants for the Steps component. */
 export type StepsColor = 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+/**
+ * Props for individual Step items.
+ */
 export interface StepItemProps {
+    /** Step label/title */
     label?: React.ReactNode;
+    /** Icon for the step marker */
     icon?: React.ReactNode;
+    /**
+     * Icon shown when the step is completed.
+     * @defaultValue '✓'
+     */
     completedIcon?: React.ReactNode;
+    /** Whether this step is clickable */
     clickable?: boolean;
+    /** Additional CSS classes. */
     className?: string;
 }
+/**
+ * Props for the Steps component.
+ * @extraProp {React.ReactNode} [children] - Step children (alternative to items).
+ * @extraProp {string} [className] - Additional CSS classes.
+ */
 export interface StepsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>, Omit<BulmaClassesProps, 'color' | 'backgroundColor' | 'size'> {
+    /** Current active step (0-indexed). */
     value?: number;
+    /** Array of step items. */
     items?: StepItemProps[];
+    /** Size of the steps. */
     size?: StepsSize;
+    /** Color variant. */
     color?: StepsColor;
+    /** Show step markers. Default: true. */
     hasMarker?: boolean;
+    /** Enable animations. Default: true. */
     animated?: boolean;
+    /** Use rounded markers. Default: true. */
     rounded?: boolean;
+    /** Vertical layout. */
     vertical?: boolean;
+    /** Position of labels. */
     labelPosition?: 'bottom' | 'right' | 'left';
+    /** Mobile display mode. */
     mobileMode?: 'minimal' | 'compact' | 'right';
+    /** Displays step numbers in the markers. */
     showStepNumbers?: boolean;
+    /** Shows previous/next navigation buttons. */
     hasNavigation?: boolean;
+    /** Label for the previous button. */
     prevLabel?: string;
+    /** Label for the next button. */
     nextLabel?: string;
+    /** Callback when previous button is clicked. */
     onPrev?: () => void;
+    /** Callback when next button is clicked. */
     onNext?: () => void;
+    /** Callback when a step is clicked. */
     onStepClick?: (step: number) => void;
 }
+/**
+ * Props for the Step subcomponent.
+ */
 export interface StepProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, 'color'>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Whether this step is active */
     isActive?: boolean;
+    /** Whether this step is completed */
     isCompleted?: boolean;
+    /** Step label/title */
     label?: React.ReactNode;
+    /** Icon for the step marker */
     icon?: React.ReactNode;
+    /** Whether this step is clickable */
     clickable?: boolean;
+    /** Click handler */
     onClick?: () => void;
+    /** Step number to display in marker (1-indexed) */
     stepNumber?: number;
+    /**
+     * Icon shown when the step is completed.
+     * @defaultValue '✓'
+     */
     completedIcon?: React.ReactNode;
 }
+/**
+ * Individual Step component for use inside Steps.
+ *
+ * @function
+ * @param {StepProps} props - Props for the Step component.
+ * @returns {JSX.Element} The rendered step segment.
+ */
 export declare const Step: React.FC<StepProps>;
 export declare const Steps: React.FC<StepsProps> & {
     Step: React.FC<StepProps>;

package/dist/types/components/Tabs.d.ts

@@ -1,56 +1,146 @@
 import React from 'react';
 import { BulmaClassesProps } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Tabs component.
+ */
 export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Tab alignment. */
     align?: 'centered' | 'right' | 'left';
+    /** Tab size. */
     size?: 'small' | 'medium' | 'large';
+    /** Tabs expand to fill the horizontal space. */
     fullwidth?: boolean;
+    /** Tabs use the boxed style. */
     boxed?: boolean;
+    /** Tabs use the toggle style. */
     toggle?: boolean;
+    /** Tabs use the rounded toggle style (only with `toggle`). */
     rounded?: boolean;
+    /**
+     * Bulma color for tab underlines and active state (renders `is-<color>`).
+     *
+     * Bulma ships no tabs color CSS, so this prop has never had a visual effect
+     * for any value. Passing it logs a console warning in development.
+     * @deprecated No `.tabs.is-<color>` CSS exists; the prop renders unstyled
+     * and will be removed in the next major version.
+     */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'black' | 'dark' | 'light' | 'white';
+    /** Controlled active tab index. */
     value?: number;
+    /** Callback when active tab changes. */
     onChange?: (index: number) => void;
+    /** Initial active tab index (uncontrolled). */
     defaultValue?: number;
+    /** Renders tabs vertically. */
     vertical?: boolean;
+    /** Side placement when `vertical` is true. */
     side?: 'left' | 'right';
+    /** Makes tabs take up the full width equally. */
     expanded?: boolean;
+    /** Additional CSS classes. */
     className?: string;
+    /** Tab list and tab items. */
     children?: React.ReactNode;
 }
+/**
+ * Props for the TabList component.
+ */
 export interface TabListProps extends React.HTMLAttributes<HTMLUListElement> {
+    /** Additional CSS classes. */
     className?: string;
+    /** Tab elements. */
     children?: React.ReactNode;
 }
+/**
+ * The `<ul>` container for tab items.
+ *
+ * @function
+ * @param {TabListProps} props - Props for the TabList component.
+ * @returns {JSX.Element} The rendered tab list.
+ */
 export declare const TabList: React.FC<TabListProps>;
 type IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';
+/**
+ * Props for the Tab component.
+ */
 export interface TabProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onClick'> {
+    /** **Required.** Tab index for matching with content. */
     index: number;
+    /** Disables the tab. */
     disabled?: boolean;
+    /** Icon name for the tab. */
     icon?: string;
+    /** Icon library to use. */
     iconLibrary?: IconLibrary;
+    /** Icon style variant (e.g., 'solid', 'outlined', 'rounded'). */
     iconVariant?: string;
+    /** Size of the tab icon. */
     iconSize?: 'small' | 'medium' | 'large';
+    /** Additional icon modifiers. */
     iconFeatures?: string | string[];
+    /** Additional CSS classes. */
     className?: string;
+    /** Tab label content. */
     children?: React.ReactNode;
 }
+/**
+ * Individual tab button. Consumes Tabs context for active state management.
+ * Renders `<a>` internally — consumers provide only the label text/children.
+ *
+ * @function
+ * @param {TabProps} props - Props for the Tab component.
+ * @returns {JSX.Element} The rendered tab.
+ */
 export declare const Tab: React.FC<TabProps>;
+/**
+ * Props for the TabItem component (backward-compatible).
+ */
 export interface TabItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    /** Whether the tab is active. */
     active?: boolean;
+    /** Additional CSS classes. */
     className?: string;
+    /** Tab content. */
     children?: React.ReactNode;
+    /** Click handler. */
     onClick?: React.MouseEventHandler<HTMLLIElement>;
 }
+/**
+ * Each tab; accepts `active`, `onClick`, etc.
+ *
+ * @function
+ * @param {TabItemProps} props - Props for the TabItem component.
+ * @returns {JSX.Element} The rendered tab item.
+ * @deprecated Use `Tabs.Tab` with an `index` prop instead.
+ */
 export declare const TabItem: React.FC<TabItemProps>;
+/**
+ * Props for the TabsContent component.
+ */
 export interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Additional CSS classes. */
     className?: string;
+    /** TabContentItem elements. */
     children?: React.ReactNode;
 }
+/**
+ * Props for the TabContentItem component.
+ */
 export interface TabContentItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** **Required.** Tab index for matching with content. */
     index: number;
+    /** Additional CSS classes. */
     className?: string;
+    /** Panel content. */
     children?: React.ReactNode;
 }
+/**
+ * Individual content panel. Shows/hides based on active tab from context.
+ *
+ * @function
+ * @param {TabContentItemProps} props - Props for the TabContentItem component.
+ * @returns {JSX.Element} The rendered tab content panel.
+ */
 export declare const TabContentItem: React.FC<TabContentItemProps>;
 export declare const TabsContent: React.FC<TabsContentProps> & {
     Item: React.FC<TabContentItemProps>;

package/dist/types/components/Toast.d.ts

@@ -1,45 +1,149 @@
 import React from 'react';
 import { BulmaClassesProps } from '../helpers/useBulmaClasses';
+/** Color/style type presets for toast messages. */
 export type ToastType = 'default' | 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+/** Screen positions where toasts can be displayed. */
 export type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+/**
+ * Props for the Toast component.
+ * @extraProp {string} [className] - Additional CSS classes.
+ * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the toast element.
+ */
 export interface ToastProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>, Omit<BulmaClassesProps, 'color'> {
+    /** The message to display (required). */
     message: string;
+    /** Color variant — colors the toast **background**. */
     type?: ToastType;
+    /** Color variant — colors the **action button** text. */
     actionType?: ToastType;
+    /** Position on the screen. Default: 'top-right'. */
     position?: ToastPosition;
+    /** Duration in ms before auto-close. `0` disables auto-close. */
     duration?: number;
+    /** Keeps the toast visible until dismissed. */
     indefinite?: boolean;
+    /** Whether clicking the toast (or outside it) dismisses it. */
     dismissible?: boolean;
+    /** Show an explicit close (X) button. Default: false. */
     closable?: boolean;
+    /** Pill-shaped (rounded corners). */
     rounded?: boolean;
+    /** Pause auto-close timer on hover. Default: false. */
     pauseOnHover?: boolean;
+    /** Whether the toast can be dismissed with Escape. Default: true. */
     cancelable?: boolean;
+    /** Text for an action button (e.g. "Undo"). */
     actionText?: string;
+    /** Text for a cancel button. */
     cancelText?: string;
+    /** Callback when the action button is clicked. */
     onAction?: () => void;
+    /** Callback when toast closes. */
     onClose?: () => void;
+    /** CSS selector or DOM node to mount the toast into. */
     container?: string | HTMLElement;
+    /** Renders inline instead of using a portal. */
     inline?: boolean;
 }
+/**
+ * The `Toast` component provides brief notification messages with optional action and cancel buttons.
+ *
+ * @function
+ * @param {ToastProps} props - Props for the Toast component.
+ * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the toast element.
+ * @returns {JSX.Element | null} The rendered toast component.
+ *
+ * @example
+ * // Basic toast
+ * <Toast message="Operation successful!" type="success" />
+ *
+ * @example
+ * // Toast with action button
+ * <Toast message="Item deleted" actionText="Undo" onAction={handleUndo} />
+ */
 export declare const Toast: React.ForwardRefExoticComponent<ToastProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Options for showing a programmatic toast. Extends ToastProps with a required message.
+ */
 export interface ToastOptions extends Omit<ToastProps, 'message'> {
+    /** The message to display. */
     message: string;
+    /** When true, toasts enter a FIFO queue and display one at a time. Default false. */
     queue?: boolean;
 }
+/**
+ * Internal representation of a toast instance.
+ */
 export interface ToastInstance {
+    /** Unique identifier for this toast. */
     id: string;
+    /** Configuration options for the toast. */
     props: ToastOptions;
 }
+/**
+ * Programmatic toast API for showing, closing, and managing toasts.
+ *
+ * @example
+ * toast.success('Saved!');
+ * toast.show({ message: 'Item deleted', actionText: 'Undo', onAction: handleUndo });
+ */
 export declare const toast: {
+    /**
+     * Show a toast with the given options.
+     * @param {ToastOptions} options - Toast configuration.
+     * @returns {string} The unique ID of the created toast.
+     */
     show: (options: ToastOptions) => string;
+    /**
+     * Show a success toast.
+     * @param {string} message - The message to display.
+     * @param {Partial<ToastOptions>} [options] - Additional options.
+     * @returns {string} The toast ID.
+     */
     success: (message: string, options?: Partial<ToastOptions>) => string;
+    /**
+     * Show a danger toast.
+     * @param {string} message - The message to display.
+     * @param {Partial<ToastOptions>} [options] - Additional options.
+     * @returns {string} The toast ID.
+     */
     danger: (message: string, options?: Partial<ToastOptions>) => string;
+    /**
+     * Show a warning toast.
+     * @param {string} message - The message to display.
+     * @param {Partial<ToastOptions>} [options] - Additional options.
+     * @returns {string} The toast ID.
+     */
     warning: (message: string, options?: Partial<ToastOptions>) => string;
+    /**
+     * Show an info toast.
+     * @param {string} message - The message to display.
+     * @param {Partial<ToastOptions>} [options] - Additional options.
+     * @returns {string} The toast ID.
+     */
     info: (message: string, options?: Partial<ToastOptions>) => string;
+    /**
+     * Close a specific toast by ID.
+     * @param {string} id - The toast ID to close.
+     */
     close: (id: string) => void;
+    /** Close all toasts and clear the queue. */
     closeAll: () => void;
+    /**
+     * Subscribe to toast state changes.
+     * @param {(toasts: ToastInstance[]) => void} listener - Callback invoked on changes.
+     * @returns {() => void} Unsubscribe function.
+     */
     subscribe: (listener: (toasts: ToastInstance[]) => void) => (() => void);
 };
+/**
+ * Container component for rendering programmatic toasts.
+ * Place once at your app root to enable the toast API.
+ *
+ * @function
+ * @param {{ position?: ToastPosition }} props - Container props.
+ * @returns {JSX.Element | null} The rendered toast container, or null if empty.
+ */
 export declare const ToastContainer: React.FC<{
     position?: ToastPosition;
 }>;

package/dist/types/components/Tooltip.d.ts

@@ -1,22 +1,68 @@
 import React from 'react';
 import { BulmaClassesProps } from '../helpers/useBulmaClasses';
+/** Screen positions for the tooltip. */
 export type TooltipPosition = 'top' | 'bottom' | 'left' | 'right' | 'auto';
+/** Color variants for the tooltip. */
 export type TooltipColor = 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'dark' | 'light';
+/** Size variants for the tooltip. */
 export type TooltipSize = 'small' | 'medium' | 'large';
+/**
+ * Props for the Tooltip component.
+ * @extraProp {React.ReactNode} [children] - The element that triggers the tooltip.
+ * @extraProp {string} [className] - Additional CSS classes.
+ */
 export interface TooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color' | 'content'>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** The tooltip text content. */
     label?: string;
+    /** Rich tooltip content (alternative to `label`). */
     content?: React.ReactNode;
+    /** Position of the tooltip. Default: 'top'. */
     position?: TooltipPosition;
+    /** Color variant for the tooltip. */
     color?: TooltipColor;
+    /** Size of the tooltip. */
     size?: TooltipSize;
+    /** Force tooltip to be always visible. */
     active?: boolean;
+    /** Allow tooltip to wrap to multiple lines. */
     multiline?: boolean;
+    /** Enable fade animation. Default: true. */
     animated?: boolean;
+    /** Use square corners instead of rounded. */
     square?: boolean;
+    /** Show dashed underline on trigger. */
     dashed?: boolean;
+    /** Delay before showing tooltip (ms). */
     delay?: number;
+    /** Delay in ms before hiding the tooltip. */
     closeDelay?: number;
+    /** Additional classes for the tooltip element. */
     tooltipClassName?: string;
 }
+/**
+ * The `Tooltip` component displays helpful information when users hover over or focus on an element.
+ *
+ * @function
+ * @param {TooltipProps} props - Props for the Tooltip component.
+ * @returns {JSX.Element} The rendered tooltip wrapper.
+ *
+ * @example
+ * // Basic tooltip
+ * <Tooltip label="This is helpful info">
+ *   <button>Hover me</button>
+ * </Tooltip>
+ *
+ * @example
+ * // Positioned tooltip with color
+ * <Tooltip label="Delete item" position="right" color="danger">
+ *   <Icon icon="fas fa-trash" />
+ * </Tooltip>
+ *
+ * @example
+ * // Multiline tooltip
+ * <Tooltip label="This is a longer tooltip that wraps to multiple lines" multiline>
+ *   <span>?</span>
+ * </Tooltip>
+ */
 export declare const Tooltip: React.FC<TooltipProps>;
 export default Tooltip;

package/dist/types/elements/Block.d.ts

@@ -1,10 +1,31 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Block component.
+ */
 export interface BlockProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
     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 `.block.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';
+    /** Content to render inside the block. */
     children?: React.ReactNode;
 }
+/**
+ * The `Block` component renders a simple container with Bulma's `.block` class, adding vertical margin between sections of content.
+ *
+ * @function
+ * @param {BlockProps} props - Props for the Block component.
+ * @returns {JSX.Element} The rendered block element.
+ * @see {@link https://bulma.io/documentation/elements/block/ | Bulma Block documentation}
+ */
 export declare const Block: React.FC<BlockProps>;

package/dist/types/elements/Box.d.ts

@@ -1,12 +1,36 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
-export interface BoxProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+/**
+ * Props for the Box component.
+ */
+export interface BoxProps
+/** @ignore */
+ extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
     className?: string;
+    /** Text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /**
+     * Text color alias: renders `has-text-<color>`, exactly like `textColor`.
+     * Not a filled box variant (no `.box.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';
+    /** Whether the box has a shadow (default: true). */
     hasShadow?: boolean;
+    /** Content to render inside the box. */
     children?: React.ReactNode;
 }
+/**
+ * The `Box` component renders a bordered, padded container with an optional shadow using Bulma's `.box` class.
+ *
+ * @function
+ * @param {BoxProps} props - Props for the Box component.
+ * @returns {JSX.Element} The rendered box element.
+ * @see {@link https://bulma.io/documentation/elements/box/ | Bulma Box documentation}
+ */
 export declare const Box: React.FC<BoxProps>;
 export default Box;

package/dist/types/elements/Button.d.ts

@@ -1,28 +1,61 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Button component.
+ */
 export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'onClick'>, Omit<BulmaClassesProps, 'color' | 'backgroundColor' | 'size'> {
+    /** Bulma color variant for the button. `ghost` renders a link-like button; `text` renders a minimal text-only button. */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'white' | 'light' | 'dark' | 'black' | 'text' | 'ghost';
+    /** Size of the button. */
     size?: 'small' | 'normal' | 'medium' | 'large';
+    /** Applies a lighter color variant. */
     isLight?: boolean;
+    /** Makes the button rounded. */
     isRounded?: boolean;
+    /** Displays a loading spinner. */
     isLoading?: boolean;
+    /** Makes the button non-interactive. */
     isStatic?: boolean;
+    /** Makes the button full-width. */
     isFullWidth?: boolean;
+    /** Applies outlined styling (requires color). */
     isOutlined?: boolean;
+    /** Applies inverted styling (requires color). */
     isInverted?: boolean;
+    /** Applies focused styling (visual only). */
     isFocused?: boolean;
+    /** Applies active styling (visual only). */
     isActive?: boolean;
+    /** Applies hovered styling (visual only). */
     isHovered?: boolean;
+    /** Applies disabled styling. */
     isDisabled?: boolean;
+    /** Custom class name. */
     className?: string;
+    /** Text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Render as a `<button>`, `<a>`, or a custom component (e.g. a router `Link`). Defaults to `'button'`; anything else (including `'a'`) uses anchor-style prop handling. */
     as?: React.ElementType;
+    /** Href value (if rendering as `<a>`). */
     href?: string;
+    /** Click event handler. */
     onClick?: React.MouseEventHandler<HTMLButtonElement> | React.MouseEventHandler<HTMLAnchorElement>;
+    /** Anchor tag target. */
     target?: string;
+    /** Anchor tag rel. */
     rel?: string;
+    /** Button content. */
     children?: React.ReactNode;
 }
+/**
+ * The `Button` component provides a flexible and highly customizable button for your Bulma React UI.
+ *
+ * @function
+ * @param {ButtonProps} props - Props for the Button component.
+ * @returns {JSX.Element} The rendered button or anchor element.
+ * @see {@link https://bulma.io/documentation/elements/button/ | Bulma Button documentation}
+ */
 export declare const Button: React.FC<ButtonProps>;
 export default Button;

package/dist/types/elements/Buttons.d.ts

@@ -1,13 +1,29 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Buttons component.
+ */
 interface ButtonsProps extends React.HTMLAttributes<HTMLDivElement>, BulmaClassesProps {
+    /** Additional CSS classes to apply. */
     className?: string;
+    /** Text color helper for the button group. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /**
+     * Text color alias: renders `has-text-<color>`, exactly like `textColor`.
+     * Not a filled variant (no `.buttons.is-<color>` CSS exists; color the
+     * individual `Button`s instead). 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 for the button group. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Center the group of buttons. */
     isCentered?: boolean;
+    /** Align the group of buttons to the right. */
     isRight?: boolean;
+    /** Group buttons together as addons (removes spacing between them). */
     hasAddons?: boolean;
+    /** The button elements to render inside the group. */
     children: React.ReactNode;
 }
 export declare const Buttons: React.FC<ButtonsProps> & {

package/dist/types/elements/Code.d.ts

@@ -1,9 +1,23 @@
 import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
+/**
+ * Props for the Code component.
+ */
 export interface CodeProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
     className?: string;
+    /** Text color helper. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color helper. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Code content to render inside the element. */
     children?: React.ReactNode;
 }
+/**
+ * The `Code` component renders a styled `<code>` element with Bulma helper class integration.
+ *
+ * @function
+ * @param {CodeProps} props - Props for the Code component.
+ * @returns {JSX.Element} The rendered code element.
+ */
 export declare const Code: React.FC<CodeProps>;