@allxsmith/bestax-bulma 5.8.0 → 5.8.2

package/dist/types/form/TextAreaBase.d.ts

@@ -2,34 +2,33 @@ import React from 'react';
 import { BulmaClassesProps } from '../helpers/useBulmaClasses';
 /**
  * Props for the TextArea component.
- *
- * @property {'primary'|'link'|'info'|'success'|'warning'|'danger'|'black'|'dark'|'light'|'white'} [color] - Bulma color modifier for the textarea.
- * @property {'small'|'medium'|'large'} [size] - Size modifier for the textarea.
- * @property {boolean} [isRounded] - Renders the textarea with rounded corners.
- * @property {boolean} [isStatic] - Renders the textarea as static text.
- * @property {boolean} [isHovered] - Applies the hovered state.
- * @property {boolean} [isFocused] - Applies the focused state.
- * @property {boolean} [isLoading] - Shows loading indicator.
- * @property {boolean} [isActive] - Applies Bulma's is-active modifier.
- * @property {boolean} [hasFixedSize] - Applies Bulma's has-fixed-size modifier.
- * @property {string} [className] - Additional CSS classes to apply.
- * @property {boolean} [disabled] - Whether the textarea is disabled.
- * @property {boolean} [readOnly] - Whether the textarea is read-only.
- * @property {number} [rows] - Number of visible text lines.
  */
 export interface TextAreaBaseProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'>, Omit<BulmaClassesProps, 'color'> {
+    /** Bulma color modifier for the textarea. */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'black' | 'dark' | 'light' | 'white';
+    /** Size modifier for the textarea. */
     size?: 'small' | 'medium' | 'large';
+    /** Rounded textarea corners. */
     isRounded?: boolean;
+    /** Renders textarea as static (styled readonly). */
     isStatic?: boolean;
+    /** Applies hovered state. */
     isHovered?: boolean;
+    /** Applies focused state. */
     isFocused?: boolean;
+    /** Shows loading indicator on the wrapping Control. */
     isLoading?: boolean;
+    /** Applies Bulma's is-active modifier. */
     isActive?: boolean;
+    /** Fixed textarea size (no resize). */
     hasFixedSize?: boolean;
+    /** Additional CSS classes to apply. */
     className?: string;
+    /** Disables the textarea. */
     disabled?: boolean;
+    /** Read-only textarea. */
     readOnly?: boolean;
+    /** Number of visible text lines. */
     rows?: number;
 }
 /**

package/dist/types/form/TimeInput.d.ts

@@ -5,51 +5,52 @@ import { TimeInputBaseProps } from './TimeInputBase';
 /**
  * Props for the TimeInput convenience wrapper. Extends `TimeInputBaseProps`
  * with Field-level (label, horizontal) and Control-level (icons, loading) props.
- *
- * @property {React.ReactNode} [label] - Field label.
- * @property {FieldProps['labelSize']} [labelSize] - Size for the label.
- * @property {FieldProps['labelProps']} [labelProps] - Props for the label element.
- * @property {boolean} [horizontal] - Render the field with horizontal layout.
- * @property {ControlBaseProps['iconLeft']} [iconLeft] - Icon props for the left icon.
- * @property {ControlBaseProps['iconRight']} [iconRight] - Icon props for the right icon.
- * @property {string} [iconRightName] - Shortcut for the right icon name.
- * @property {ControlBaseProps['iconLeftSize']} [iconLeftSize] - Shortcut for left icon size.
- * @property {ControlBaseProps['iconRightSize']} [iconRightSize] - Shortcut for right icon size.
- * @property {boolean} [hasIconsLeft] - Force the left icon container.
- * @property {boolean} [hasIconsRight] - Force the right icon container.
- * @property {boolean} [isLoading] - Show a loading indicator on the control.
- * @property {boolean} [isExpanded] - Expand the control to fill its container.
- * @property {ControlBaseProps['size']} [controlSize] - Size of the wrapping Control.
- * @property {React.ReactNode} [message] - Help/validation text below the input.
- * @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [messageColor] - Message color.
- * @property {string} [fieldClassName] - Additional CSS classes for the Field wrapper.
- * @property {string} [controlClassName] - Additional CSS classes for the Control wrapper.
+ * @extraProp {string} [name] - Form field name.
+ * @extraProp {string} [form] - Form id the input belongs to.
+ * @extraProp {boolean} [required=false] - Marks the input as required.
+ * @extraProp {string} [className] - Additional CSS classes for the input.
+ * @extraProp {React.Ref<HTMLInputElement>} [ref] - Forwarded to the underlying `<input>`.
  */
 export interface TimeInputProps extends TimeInputBaseProps {
+    /** Field label. Automatically associated with the input via `htmlFor` — uses your `id` when provided, otherwise a generated one. Not wired in `inline` mode (no visible input to label) and dropped inside an outer `Field`. */
     label?: React.ReactNode;
+    /** Size for the label. */
     labelSize?: FieldProps['labelSize'];
+    /** Props for the label element. An explicit `htmlFor` here overrides the automatic association (no id is generated then). */
     labelProps?: FieldProps['labelProps'];
+    /** Render the field with horizontal layout. */
     horizontal?: boolean;
+    /** Icon props for the left icon. */
     iconLeft?: ControlBaseProps['iconLeft'];
+    /** Icon props for the right icon. */
     iconRight?: ControlBaseProps['iconRight'];
+    /** Shortcut for the right icon name. */
     iconRightName?: string;
+    /** Shortcut for left icon size. */
     iconLeftSize?: ControlBaseProps['iconLeftSize'];
+    /** Shortcut for right icon size. */
     iconRightSize?: ControlBaseProps['iconRightSize'];
+    /** Force the left icon container. */
     hasIconsLeft?: boolean;
+    /** Force the right icon container. */
     hasIconsRight?: boolean;
+    /** Show a loading indicator on the control. */
     isLoading?: boolean;
+    /** Expand the control to fill its container. */
     isExpanded?: boolean;
+    /** Size of the wrapping Control. */
     controlSize?: ControlBaseProps['size'];
+    /** Help/validation text below the input. */
     message?: React.ReactNode;
+    /** Color modifier for the help message. */
     messageColor?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+    /** Additional CSS classes for the Field wrapper. */
     fieldClassName?: string;
+    /** Additional CSS classes for the Control wrapper. */
     controlClassName?: string;
 }
 /**
- * TimeInput is a form input that opens a popover spinner for time-of-day
- * selection. Supports 12h/24h, optional seconds, custom step increments,
- * min/max bounds, an unselectable-times predicate, and a native
- * `<input type="time">` fallback for touch devices.
+ * The `TimeInput` component is a form input that opens a popover spinner for time-of-day selection.
  *
  * @function
  * @param {TimeInputProps} props

package/dist/types/form/TimeInputBase.d.ts

@@ -5,103 +5,82 @@ import { DateFormatOption } from './_pickerInternals/formatters';
 /**
  * Props for the raw TimeInput base. Use the higher-level `TimeInput` for
  * Field/Control composition; `TimeInputBase` is the input + popover only.
- *
- * @property {Date | null} [value] - Controlled selected time.
- * @property {Date | null} [defaultValue] - Initial value for uncontrolled usage.
- * @property {(d: Date | null) => void} [onChange] - Fired when the value changes.
- * @property {() => void} [onOpen] - Fired when the popover opens.
- * @property {() => void} [onClose] - Fired when the popover closes.
- * @property {Date} [min] - Earliest selectable time.
- * @property {Date} [max] - Latest selectable time.
- * @property {boolean} [disabled] - Disable the input.
- * @property {boolean} [readOnly] - Make the input read-only.
- * @property {string} [placeholder] - Placeholder text.
- * @property {DateFormatOption} [format] - Token format string or `Intl.DateTimeFormat` options.
- * @property {(s: string) => Date | null} [parse] - Custom parser.
- * @property {string} [locale] - BCP-47 locale tag.
- * @property {boolean} [inline] - Render the spinner inline (no popover).
- * @property {boolean | 'auto'} [mobileNative] - Use native `<input type="time">` on coarse-pointer devices.
- * @property {boolean} [editable] - Allow segmented keyboard typing in the input (type the time directly, auto-advancing across segments). Default `true`.
- * @property {boolean} [popover] - Whether the spinner popover exists. `false` makes the field input-only (segmented typing with no popover). Default `true`.
- * @property {boolean} [openOnFocus] - Open the popover on focus. Default `true`.
- * @property {boolean} [closeOnSelect] - Close after selection. Default `false`.
- * @property {PickerPosition} [position] - Popover anchor position.
- * @property {boolean} [appendToBody] - Render the popover into `document.body` via portal.
- * @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier.
- * @property {'small'|'medium'|'large'} [size] - Size variant.
- * @property {boolean} [isRounded] - Rounded input corners.
- * @property {HourFormat} [hourFormat] - `'12'` or `'24'`. Default `'24'`.
- * @property {boolean} [enableSeconds] - Show a seconds column. Note: iOS Safari's native time picker has no seconds wheel; combine with `mobileNative={false}` if a seconds wheel is required on iOS.
- * @property {number} [incrementHours] - Hour step. Default `1`.
- * @property {number} [incrementMinutes] - Minute step. Default `1`.
- * @property {number} [incrementSeconds] - Second step. Default `1`.
- * @property {(d: Date) => boolean} [unselectableTimes] - Predicate for blocked times (the spinner skips ahead; manual typing rejects them).
- * @property {string} [iconLeftName] - Decorative left icon glyph for the wrapping Control (shown by default; set to '' to hide).
- * @property {boolean} [triggerIcon] - Show a clickable launcher button on the right that toggles the popover. Default `true`.
- * @property {string} [triggerIconName] - Glyph name for the right launcher button. Default `'chevron-down'`.
- * @property {boolean} [audioTick] - Play a short audible tick on each wheel-item crossing. Useful as a substitute for haptic feedback on iOS Safari, which has no web-accessible haptic API. Off by default.
- * @property {boolean} [haptics] - Auto-route platform-appropriate tactile feedback per wheel tick: real vibration on Android (via `navigator.vibrate`) and an audible thunk on iOS (where no haptic API exists). Adds the audio thunk only when vibrate is unavailable, so Android devices aren't subjected to extra sound. The visual band pulse fires regardless. Off by default for backward compat.
  */
 export interface TimeInputBaseProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'size' | 'color' | 'min' | 'max' | 'type' | 'popover'>, Omit<BulmaClassesProps, 'color'> {
+    /** Controlled selected time (date portion is preserved). */
     value?: Date | null;
+    /** Initial value for uncontrolled usage. */
     defaultValue?: Date | null;
+    /** Fired when the value changes. */
     onChange?: (d: Date | null) => void;
+    /** Fired when the popover opens. */
     onOpen?: () => void;
+    /** Fired when the popover closes. */
     onClose?: () => void;
+    /** Earliest selectable time. */
     min?: Date;
+    /** Latest selectable time. */
     max?: Date;
+    /** Disable the input. */
     disabled?: boolean;
+    /** Make the input read-only. */
     readOnly?: boolean;
+    /** Placeholder text for the input. */
     placeholder?: string;
+    /**
+     * Token format string or `Intl.DateTimeFormat` options.
+     * @defaultValue (see below)
+     */
     format?: DateFormatOption;
+    /** Custom parser. */
     parse?: (s: string) => Date | null;
+    /** BCP-47 locale tag for Intl formatting. */
     locale?: string;
+    /** Render the spinner inline (no popover). */
     inline?: boolean;
+    /** Use `<input type="time">` on coarse-pointer + small-viewport devices. */
     mobileNative?: boolean | 'auto';
+    /** Allow segmented keyboard typing in the input (type the time directly, auto-advancing across segments). `false` makes the field picker-only. */
     editable?: boolean;
+    /** Whether the spinner popover exists. `false` makes the field input-only (segmented typing, no popover). */
     popover?: boolean;
+    /** Open the popover when the input is focused. */
     openOnFocus?: boolean;
+    /** Close the popover after a time is selected (off by default). */
     closeOnSelect?: boolean;
+    /** Popover anchor position relative to the input. */
     position?: PickerPosition;
+    /** Render the popover into `document.body` via portal. */
     appendToBody?: boolean;
+    /** Bulma color modifier. */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+    /** Size variant. */
     size?: 'small' | 'medium' | 'large';
+    /** Render the input with rounded corners. */
     isRounded?: boolean;
+    /** Hour format. `'12'` shows an AM/PM toggle. */
     hourFormat?: HourFormat;
+    /** Show a seconds column. Note: iOS Safari's native time picker UI does not include a seconds wheel; pass `mobileNative={false}` if you need one on iOS. */
     enableSeconds?: boolean;
+    /** Hour step for the spinner. */
     incrementHours?: number;
+    /** Minute step. Combine with `min`/`max` for slot-style pickers. */
     incrementMinutes?: number;
+    /** Second step. Default `1`. */
     incrementSeconds?: number;
+    /** Predicate returning `true` for times that should be skipped. Blocked times are also rejected during manual typing. */
     unselectableTimes?: (d: Date) => boolean;
+    /** Decorative left icon glyph for the wrapping `Control` (shown by default). Set `''` to hide. */
     iconLeftName?: string;
+    /** Show a clickable launcher button on the right that toggles the popover. Default `true`. */
     triggerIcon?: boolean;
+    /** Glyph for the right launcher button. */
     triggerIconName?: string;
     /** Optional translatable string overrides. */
     labels?: PickerLabels;
-    /**
-     * Play a short audible tick on each wheel-item crossing. Provides a
-     * substitute for haptic feedback on iOS Safari, which has no web-
-     * accessible haptic API as of May 2026. Off by default to avoid
-     * surprising users with sound; the tick respects the device's silent
-     * switch and is suppressed when no audio device is available.
-     */
+    /** Play a short audible click on each wheel-item crossing. Substitute for haptic feedback on iOS Safari (which has no web haptic API as of May 2026); on Android, `navigator.vibrate(5)` fires automatically regardless. */
     audioTick?: boolean;
-    /**
-     * Auto-route platform-appropriate tactile feedback per wheel tick. When
-     * `true`:
-     *  - On platforms where `navigator.vibrate` is implemented (Android
-     *    Chrome / Firefox Android / Samsung Internet), the existing
-     *    unconditional `navigator.vibrate(5)` carries the haptic — no audio
-     *    is added (don't want to subject Android users to extra sound).
-     *  - On platforms where `navigator.vibrate` is absent (notably iOS
-     *    Safari, which has no web-accessible haptic API as of May 2026),
-     *    the audio thunk is enabled automatically — same as setting
-     *    `audioTick={true}` manually.
-     *  - The visual band pulse fires regardless (gated only by
-     *    `prefers-reduced-motion`).
-     * Off by default for backward compat. If `audioTick` is also set, the
-     * audio fires regardless of detection (manual opt-in wins).
-     */
+    /** Auto-route platform-appropriate feedback: vibrate on Android (already happening), audio thunk on iOS (where vibrate is unavailable). One switch instead of platform-sniffing on the consumer side. `audioTick={true}` always wins. */
     haptics?: boolean;
 }
 /**

package/dist/types/form/fieldProps.d.ts

@@ -5,7 +5,7 @@ import React from 'react';
  * it will automatically render a Field around itself.
  */
 export interface FormFieldProps {
-    /** Field label. */
+    /** Field label, rendered above the widget. */
     label?: React.ReactNode;
     /** Size for the label (used in horizontal layouts). */
     labelSize?: 'small' | 'normal' | 'medium' | 'large';

package/dist/types/form/useAutoLabelId.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { FieldProps } from './Field';
+interface UseAutoLabelIdOptions {
+    /** The convenience `label` prop as passed by the caller. */
+    label: React.ReactNode;
+    /** User-supplied id for the control, if any. */
+    id?: string;
+    /** User-supplied labelProps, if any. */
+    labelProps?: FieldProps['labelProps'];
+    /**
+     * True when this render actually outputs the label wired to a control —
+     * false inside an outer Field (label is dropped), in variants that render
+     * no Field, and in modes with no labellable control (e.g. inline pickers).
+     */
+    rendersLabel: boolean;
+}
+/**
+ * Associates the convenience `label` prop with its control (#368): generates
+ * an id for the control and returns labelProps carrying a matching `htmlFor`.
+ * A user-supplied `id` is used as the target instead of the generated one, and
+ * an explicit `labelProps.htmlFor` disables generation entirely — the user has
+ * taken over the association. Internal; not part of the public API.
+ */
+export declare function useAutoLabelId({ label, id, labelProps, rendersLabel, }: UseAutoLabelIdOptions): {
+    controlId: string | undefined;
+    fieldLabelProps: FieldProps['labelProps'] | undefined;
+};
+export {};

package/dist/types/grid/Cell.d.ts

@@ -6,34 +6,33 @@ import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
 export type CellSpanValue = number;
 /**
  * Props for the Cell component.
- *
- * @property {number} [colStart] - Which column the cell starts at (Bulma: is-col-start-x).
- * @property {number} [colFromEnd] - Which column the cell ends at, counting from the end (Bulma: is-col-from-end-x).
- * @property {CellSpanValue} [colSpan] - How many columns the cell will span (Bulma: is-col-span-x).
- * @property {number} [rowStart] - Which row the cell starts at (Bulma: is-row-start-x).
- * @property {number} [rowFromEnd] - Which row the cell ends at, counting from the end (Bulma: is-row-from-end-x).
- * @property {CellSpanValue} [rowSpan] - How many rows the cell will span (Bulma: is-row-span-x).
- * @property {string} [className] - Additional CSS class names.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color (Bulma color, 'inherit', or 'current').
- * @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier for the cell.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color (Bulma color, 'inherit', or 'current').
- * @property {React.ReactNode} [children] - Children to render inside the cell.
  */
 export interface CellProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Which column the cell starts at (Bulma: `is-col-start-x`). */
     colStart?: number;
+    /** Which column the cell ends at, counting from the end (Bulma: `is-col-from-end-x`). */
     colFromEnd?: number;
+    /** How many columns the cell will span (Bulma: `is-col-span-x`). */
     colSpan?: CellSpanValue;
+    /** Which row the cell starts at (Bulma: `is-row-start-x`). */
     rowStart?: number;
+    /** Which row the cell ends at, counting from the end (Bulma: `is-row-from-end-x`). */
     rowFromEnd?: number;
+    /** How many rows the cell will span (Bulma: `is-row-span-x`). */
     rowSpan?: CellSpanValue;
+    /** Additional CSS class names. */
     className?: string;
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma color modifier for the cell. */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Content to render inside the cell. */
     children?: React.ReactNode;
 }
 /**
- * Bulma Cell component for CSS Grid layouts.
+ * The `Cell` component provides a single Bulma grid cell for use inside the [`Grid`](./grid.md) component.
  *
  * @function
  * @param {CellProps} props - Props for the Cell component.

package/dist/types/grid/Grid.d.ts

@@ -19,40 +19,39 @@ export type BulmaFixedGridCols = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11
 export type BulmaFixedGridColsProp = BulmaFixedGridCols | 'auto';
 /**
  * Props for the Grid component.
- *
- * @property {boolean} [isFixed] - Use a fixed grid layout (Bulma's .fixed-grid > .grid).
- * @property {BulmaGapValue} [gap] - Main gap for grid (applies is-gap-X, 0-8).
- * @property {BulmaGapValue} [columnGap] - Column gap for grid (applies is-column-gap-X, 0-8).
- * @property {BulmaGapValue} [rowGap] - Row gap for grid (applies is-row-gap-X, 0-8).
- * @property {BulmaMinColValue} [minCol] - Minimum column width for the grid (applies is-col-min-X, 1-32).
- * @property {BulmaFixedGridColsProp} [fixedCols] - For fixed grid only: explicit column count (applies has-X-cols, 0-12), or 'auto' for has-auto-count.
- * @property {BulmaFixedGridCols} [fixedColsMobile] - For fixed grid only: explicit column count for mobile.
- * @property {BulmaFixedGridCols} [fixedColsTablet] - For fixed grid only: explicit column count for tablet.
- * @property {BulmaFixedGridCols} [fixedColsDesktop] - For fixed grid only: explicit column count for desktop.
- * @property {BulmaFixedGridCols} [fixedColsWidescreen] - For fixed grid only: explicit column count for widescreen.
- * @property {BulmaFixedGridCols} [fixedColsFullhd] - For fixed grid only: explicit column count for fullhd.
- * @property {string} [className] - Additional CSS class names.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color (Bulma color, 'inherit', or 'current').
- * @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier for the grid.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color (Bulma color, 'inherit', or 'current').
- * @property {React.ReactNode} [children] - Children to render inside the grid.
  */
 export interface GridProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Use a fixed grid layout (`.fixed-grid > .grid`). */
     isFixed?: boolean;
+    /** Main gap for grid (Bulma `is-gap-X`). */
     gap?: BulmaGapValue;
+    /** Column gap for grid (`is-column-gap-X`). */
     columnGap?: BulmaGapValue;
+    /** Row gap for grid (`is-row-gap-X`). */
     rowGap?: BulmaGapValue;
+    /** Minimum column width for the grid (`is-col-min-X`). */
     minCol?: BulmaMinColValue;
+    /** For fixed grids: explicit column count (`has-X-cols`), or `'auto'` for auto-count. */
     fixedCols?: BulmaFixedGridColsProp;
+    /** For fixed grids: explicit column count for mobile. */
     fixedColsMobile?: BulmaFixedGridCols;
+    /** For fixed grids: explicit column count for tablet. */
     fixedColsTablet?: BulmaFixedGridCols;
+    /** For fixed grids: explicit column count for desktop. */
     fixedColsDesktop?: BulmaFixedGridCols;
+    /** For fixed grids: explicit column count for widescreen. */
     fixedColsWidescreen?: BulmaFixedGridCols;
+    /** For fixed grids: explicit column count for fullhd. */
     fixedColsFullhd?: BulmaFixedGridCols;
+    /** Additional CSS classes for the grid. */
     className?: string;
+    /** Text color. */
     textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma color modifier for the grid. */
     color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+    /** Background color. */
     bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Children to render inside the grid (usually `Cell` components). */
     children?: React.ReactNode;
 }
 export declare const Grid: React.FC<GridProps> & {

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

@@ -0,0 +1,17 @@
+/**
+ * Color values that emit an `is-<color>` modifier no shipped Bulma 1.0.4 rule
+ * matches on `.progress`/`.notification`/`.hero`. The `has-text-*` and
+ * `has-background-*` helpers DO cover these values — only the
+ * component-modifier form is dead.
+ */
+export declare const UNSTYLED_MODIFIER_COLORS: readonly ["black-bis", "black-ter", "grey-darker", "grey-dark", "grey", "grey-light", "grey-lighter"];
+/** Test-only: re-arm the warn-once registry. */
+export declare const resetColorDeprecationWarnings: () => void;
+/**
+ * Dev warning for a `color` value whose `is-<color>` modifier has no shipped
+ * CSS. `extraUnstyled` covers per-component dead values beyond the shared
+ * list (e.g. Hero's `inherit`/`current`).
+ */
+export declare const warnUnstyledColor: (component: string, value: string | undefined, extraUnstyled?: readonly string[]) => void;
+/** Dev warning for a `color` prop that has no shipped CSS for any value. */
+export declare const warnDeprecatedColorProp: (component: string, value: string | undefined, hint: string) => void;

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

@@ -6,33 +6,36 @@ import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
 export type ContainerBreakpoint = 'tablet' | 'desktop' | 'widescreen';
 /**
  * Props for the Container component.
- *
- * @property {string} [className] - Additional CSS classes.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
- * @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
- * @property {boolean} [fluid] - Full-width container.
- * @property {boolean} [widescreen] - Container is widescreen.
- * @property {boolean} [fullhd] - Container is fullhd.
- * @property {ContainerBreakpoint} [breakpoint] - Responsive breakpoint.
- * @property {boolean} [isMax] - Use is-max-* class for breakpoint.
- * @property {React.ReactNode} [children] - Content inside the container.
  */
 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;
 }
 /**
- * Container component for Bulma.
- * Adds optional responsive, fluid, and color support, including is-max-* and breakpoint classes.
+ * The `Container` component provides a responsive and flexible layout wrapper for your Bulma React UI.
  *
  * @function
  * @param {ContainerProps} props - Props for the Container component.

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

@@ -2,24 +2,23 @@ import React from 'react';
 import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
 /**
  * Props for the Footer component.
- *
- * @property {'footer'|'div'} [as] - The HTML tag to render as.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [color] - Bulma color modifier.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
- * @property {string} [className] - Additional CSS classes.
- * @property {React.ReactNode} [children] - Content inside the footer.
  */
 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;
 }
 /**
- * Bulma Footer component.
+ * The `Footer` component provides a semantic and accessible site footer for your Bulma React UI.
  *
  * @function
  * @param {FooterProps} props - Props for the Footer component.

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

@@ -6,40 +6,48 @@ import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
 export type HeroSize = 'small' | 'medium' | 'large' | 'fullheight' | 'fullheight-with-navbar';
 /**
  * Props for the Hero component.
- *
- * @property {string} [className] - Additional CSS classes.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [color] - Bulma color modifier.
- * @property {HeroSize} [size] - Hero size.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
- * @property {boolean} [fullheightWithNavbar] - Use fullheight with navbar.
- * @property {React.ReactNode} [children] - Content inside the hero.
  */
 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.
- *
- * @property {string} [className] - Additional CSS classes.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [color] - Bulma color modifier for text.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
- * @property {React.ReactNode} [children] - Content.
  */
 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;
 }
 /**
- * Bulma Hero head section.
+ * Top bar for navigation or branding.
  *
  * @function
  * @param {HeroHeadProps} props - Props for the HeroHead component.
@@ -48,22 +56,21 @@ export interface HeroHeadProps extends React.HTMLAttributes<HTMLDivElement>, Omi
 export declare const HeroHead: React.FC<HeroHeadProps>;
 /**
  * Props for the HeroBody component.
- *
- * @property {string} [className] - Additional CSS classes.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [color] - Bulma color modifier for text.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
- * @property {React.ReactNode} [children] - Content.
  */
 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;
 }
 /**
- * Bulma Hero body section.
+ * Main content area, vertically centered by default.
  *
  * @function
  * @param {HeroBodyProps} props - Props for the HeroBody component.
@@ -72,22 +79,21 @@ export interface HeroBodyProps extends React.HTMLAttributes<HTMLDivElement>, Omi
 export declare const HeroBody: React.FC<HeroBodyProps>;
 /**
  * Props for the HeroFoot component.
- *
- * @property {string} [className] - Additional CSS classes.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [color] - Bulma color modifier for text.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
- * @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
- * @property {React.ReactNode} [children] - Content.
  */
 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;
 }
 /**
- * Bulma Hero foot section.
+ * Bottom bar for tabs or actions.
  *
  * @function
  * @param {HeroFootProps} props - Props for the HeroFoot component.