@allxsmith/bestax-bulma 5.16.4 → 5.16.6

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

@@ -0,0 +1,74 @@
+import React from 'react';
+import { type PolymorphicComponent } from '../helpers/polymorphic.js';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * The Button component's own props — everything it adds on top of the
+ * attributes of whatever element `as` renders.
+ */
+export interface ButtonOwnProps extends Omit<BulmaClassesProps, 'color' | 'backgroundColor' | 'size'> {
+    /**
+     * Not accepted under this name. `useBulmaClasses` consumes any
+     * `backgroundColor` key before `rest` is spread, so a custom `as` target
+     * declaring one would never receive it. Use `bgColor`.
+     * @internal
+     */
+    backgroundColor?: never;
+    /** 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;
+    /** Makes the button full-width. @deprecated Use `isFullwidth` instead — `isFullwidth` wins if both are set. */
+    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';
+    /** Button content. */
+    children?: React.ReactNode;
+}
+/**
+ * Props for the Button component. The DOM attributes and the `ref` both follow
+ * `as`: with `as="a"` the anchor attributes are accepted, with `as="div"` they
+ * are not.
+ *
+ * @extraProp {PolymorphicRef<React.ElementType>} [ref] - Ref forwarded to the element `as` renders, typed from `as`: the DOM node for an intrinsic tag, or whatever handle a custom component exposes.
+ */
+export type ButtonProps<T extends React.ElementType = 'button'> = ButtonOwnProps & Omit<React.ComponentPropsWithoutRef<T>, keyof ButtonOwnProps | 'as'> & {
+    /** Render as a `<button>`, `<a>`, or a custom component (e.g. a router `Link`). Defaults to `'button'`; anything else renders through the anchor path, which adds `href`/`target`/`rel` and withholds the submit-override attributes (`formAction` and friends) from an `<a>`. */
+    as?: T;
+};
+/**
+ * The `Button` component provides a flexible and highly customizable button for your Bulma React UI.
+ *
+ * @function
+ * @param {ButtonProps} props - Props for the Button component.
+ * @param {React.Ref} ref - Forwarded ref to the element `as` renders.
+ * @returns {JSX.Element} The rendered button, anchor, or custom element.
+ * @see {@link https://bulma.io/documentation/elements/button/ | Bulma Button documentation}
+ */
+export declare const Button: PolymorphicComponent<ButtonOwnProps, "button">;
+export default Button;

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

@@ -0,0 +1,40 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+declare const validButtonsSizes: readonly ["small", "medium", "large"];
+/**
+ * Valid size values for the Buttons component (Bulma button group sizes).
+ */
+export type ButtonsSize = (typeof validButtonsSizes)[number];
+/**
+ * Props for the Buttons component.
+ */
+interface ButtonsProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'size'> {
+    /** 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;
+    /** Size of the button group. */
+    size?: ButtonsSize;
+    /** The button elements to render inside the group. */
+    children: React.ReactNode;
+}
+export declare const Buttons: React.FC<ButtonsProps> & {
+    Button: import("../index.js").PolymorphicComponent<import("./Button.js").ButtonOwnProps, "button">;
+    LinkButton: import("../index.js").PolymorphicComponent<import("./LinkButton.js").LinkButtonOwnProps, "button">;
+};
+export {};

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

@@ -0,0 +1,23 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * 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>;

package/dist/types-cjs/elements/Content.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * Props for the Content component.
+ */
+interface ContentProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
+    className?: string;
+    /** Text color helper (e.g., `'danger'` for `has-text-danger`). */
+    textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /**
+     * Text color alias: renders `has-text-<color>`, exactly like `textColor`.
+     * Not a filled variant (no `.content.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 (e.g., `'info'` for `has-background-info`). */
+    bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Size modifier for the content. */
+    size?: 'small' | 'normal' | 'medium' | 'large';
+    /** Content to be rendered inside the block. */
+    children?: React.ReactNode;
+}
+/**
+ * The `Content` component applies Bulma’s typographic styles to its children, enhancing the appearance of HTML elements like paragraphs, headings, lists, and tables.
+ *
+ * @function
+ * @param {ContentProps} props - Props for the Content component.
+ * @returns {JSX.Element} The rendered content block.
+ * @see {@link https://bulma.io/documentation/elements/content/ | Bulma Content documentation}
+ */
+export declare const Content: React.FC<ContentProps>;
+export default Content;

package/dist/types-cjs/elements/Delete.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * Props for the Delete component.
+ */
+interface DeleteProps extends React.HTMLAttributes<HTMLButtonElement>, BulmaClassesProps {
+    /** 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 `.delete.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';
+    /** Click handler for the button. */
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    /** Size modifier for the delete button. */
+    size?: 'small' | 'medium' | 'large';
+    /** ARIA label for accessibility (default: 'Close'). */
+    ariaLabel?: string;
+    /** Whether the button is disabled (default: false). */
+    disabled?: boolean;
+}
+/**
+ * The `Delete` component provides a Bulma-styled close/delete button for dismissing modals, notifications, tags, messages, and more.
+ *
+ * @function
+ * @param {DeleteProps} props - Props for the Delete component.
+ * @returns {JSX.Element} The rendered delete button.
+ * @see {@link https://bulma.io/documentation/elements/delete/ | Bulma Delete documentation}
+ */
+export declare const Delete: React.FC<DeleteProps>;
+export {};

package/dist/types-cjs/elements/Divider.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * Props for the Divider component.
+ */
+export interface DividerProps extends React.HTMLAttributes<HTMLHRElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
+    className?: string;
+    /** Background color helper. */
+    bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+}
+/**
+ * The `Divider` component renders a styled horizontal rule (`<hr>`) element with Bulma helper class integration.
+ *
+ * @function
+ * @param {DividerProps} props - Props for the Divider component.
+ * @returns {JSX.Element} The rendered hr element.
+ */
+export declare const Divider: React.FC<DividerProps>;

package/dist/types-cjs/elements/Emphasis.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * Props for the Emphasis component.
+ */
+export interface EmphasisProps 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';
+    /** Content to render inside the em element. */
+    children?: React.ReactNode;
+}
+/**
+ * The `Emphasis` component renders a styled `<em>` element with Bulma helper class integration.
+ *
+ * @function
+ * @param {EmphasisProps} props - Props for the Emphasis component.
+ * @returns {JSX.Element} The rendered em element.
+ */
+export declare const Emphasis: React.FC<EmphasisProps>;

package/dist/types-cjs/elements/Figure.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * Props for the FigureCaption component.
+ */
+export interface FigureCaptionProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
+    className?: string;
+    /** Text color (Bulma color, 'inherit', or 'current'). */
+    textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Background color (Bulma color, 'inherit', or 'current'). */
+    bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Content to be rendered inside the figcaption. */
+    children?: React.ReactNode;
+}
+/**
+ * Props for the Figure component.
+ */
+export interface FigureProps 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';
+    /** Content to render inside the figure. */
+    children?: React.ReactNode;
+}
+/**
+ * Figure component with Caption subcomponent.
+ *
+ * @example
+ * <Figure>
+ *   <img src="image.jpg" alt="Description" />
+ *   <Figure.Caption>Image caption text</Figure.Caption>
+ * </Figure>
+ */
+export declare const Figure: React.FC<FigureProps> & {
+    Caption: React.FC<FigureCaptionProps>;
+};

package/dist/types-cjs/elements/Icon.d.ts

@@ -0,0 +1,138 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+interface IonIconProps extends React.HTMLAttributes<HTMLElement> {
+    name?: string;
+    src?: string;
+    icon?: unknown;
+    size?: string;
+    lazy?: boolean;
+    sanitize?: boolean;
+    color?: string;
+    flipRtl?: boolean;
+    ariaLabel?: string;
+    ariaHidden?: string;
+}
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements {
+            'ion-icon': IonIconProps;
+        }
+    }
+}
+type IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';
+/**
+ * Shared props for the Icon component, independent of whether a class-based `name` or a
+ * custom `children` node supplies the glyph.
+ */
+interface IconBaseProps extends React.HTMLAttributes<HTMLSpanElement>, BulmaClassesProps {
+    /** Additional CSS classes to apply. */
+    className?: string;
+    /** Text color helper. */
+    textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Bulma color modifier for the icon. */
+    color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
+    /** Background color helper. */
+    bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /**
+     * Legacy icon class string (e.g. `'fas fa-star'`). Only its last segment is read, as the
+     * glyph name; the library still comes from `library` or `ConfigProvider`, so
+     * `'mdi mdi-rocket'` renders an `fa` class unless the effective library is already `mdi` —
+     * set it here or on the provider.
+     *
+     * @deprecated Use `name` instead.
+     */
+    icon?: string;
+    /**
+     * The icon library to use ('fa' = Font Awesome, 'mdi' = Material Design Icons, 'ion' = Ionicons Web Components, 'material-icons' = Google Material Icons, 'material-symbols' = Google Material Symbols). Defaults to the value set in ConfigProvider or 'fa' if not configured. Ignored when `children` supplies the glyph instead of `name`.
+     * @defaultValue 'fa'
+     */
+    library?: IconLibrary;
+    /** Icon style variant (e.g. `'solid'`, `'outlined'`, `'rounded'`). Ignored when `children` supplies the glyph instead of `name`. */
+    variant?: string;
+    /** Additional modifiers (e.g. `'fa-lg'`, `'fa-spin'`, `'is-size-1'`). Ignored when `children` supplies the glyph instead of `name`. */
+    features?: string | string[];
+    /**
+     * Additional modifiers in the older combined form, parsed into `variant` and `features`.
+     *
+     * @deprecated Use `variant` and `features` instead.
+     */
+    libraryFeatures?: string | string[];
+    /** Size modifier for the icon container. */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * ARIA label for accessibility. Applied unconditionally to the container span, so an
+     * icon that never sets it still renders `aria-label="icon"`. For an icon-only control,
+     * put the real `aria-label` on the control (e.g. `Button`) and set `aria-hidden` here
+     * instead — otherwise the control's accessible name is announced as just "icon". For a
+     * decorative icon beside visible text, set `aria-hidden` here rather than leaving the
+     * default, so it doesn't add "icon" to the text's accessible name.
+     * @defaultValue 'icon'
+     */
+    ariaLabel?: string;
+    /** Inline style object. */
+    style?: React.CSSProperties;
+    /** Override the default `'icon'` container class (e.g., `'panel-icon'`). */
+    containerClassName?: string;
+}
+/**
+ * Props for `Icon` rendering a class-based glyph from an icon library.
+ */
+export interface IconNameProps extends IconBaseProps {
+    /** The icon name, with or without its library prefix (e.g. `'star'` or `'fa-star'`). Mutually exclusive with `children`. */
+    name: string;
+    /** A custom node (an inline SVG, a `react-icons` component, …) rendered inside the icon container in place of a class-based glyph. Mutually exclusive with `name`. */
+    children?: never;
+}
+/**
+ * Props for `Icon` rendering a custom node (an inline SVG, a `react-icons` component, a Font
+ * Awesome React `<FontAwesomeIcon>`, …) in place of a class-based glyph.
+ */
+export interface IconChildrenProps extends IconBaseProps {
+    /** The icon name, with or without its library prefix (e.g. `'star'` or `'fa-star'`). Mutually exclusive with `children`. */
+    name?: undefined;
+    /** A custom node (an inline SVG, a `react-icons` component, …) rendered inside the icon container in place of a class-based glyph. Mutually exclusive with `name`. */
+    children: Exclude<React.ReactNode, undefined>;
+}
+/**
+ * Props for `Icon` naming its glyph through the deprecated `icon` prop instead of `name`.
+ *
+ * The runtime has always accepted `icon` on its own — it strips a leading library prefix off
+ * the class string and falls through to the `name` path — but the type offered no member without
+ * a `name` or `children`, so every caller still on the deprecated prop got an error the
+ * package could not see — until #663 nothing here type-checked a test or a story, so the
+ * three `Icon.test.tsx` cases exercising this path proved the runtime and said nothing about
+ * the type. Declaring the path is the honest resolution: it is deprecated, not removed, and a
+ * deprecation that does not type-check is a removal announced only to whoever tries it.
+ *
+ * @deprecated Pass `name` instead. This member goes when `icon` does.
+ */
+export interface IconDeprecatedProps extends IconBaseProps {
+    /**
+     * Legacy icon class string (e.g. `'fas fa-star'`). Only its last segment is read, as the
+     * glyph name; the library still comes from `library` or `ConfigProvider`, so
+     * `'mdi mdi-rocket'` renders an `fa` class unless the effective library is already `mdi` —
+     * set it here or on the provider.
+     *
+     * @deprecated Use `name` instead.
+     */
+    icon: string;
+    /** The icon name. Absent on this path — `icon` supplies the glyph. */
+    name?: undefined;
+    /** A custom node. Mutually exclusive with `icon`. */
+    children?: never;
+}
+/**
+ * Props for the Icon component — a discriminated union of a class-based `name`, a custom
+ * `children` node, and the deprecated `icon` class string.
+ */
+export type IconProps = IconNameProps | IconChildrenProps | IconDeprecatedProps;
+/**
+ * The `Icon` component is a Bulma-styled wrapper for displaying icons from various libraries (Font Awesome, Material Design Icons, Ionicons, Google Material Icons, Material Symbols, etc.).
+ *
+ * @function
+ * @param {IconProps} props - Props for the Icon component.
+ * @returns {JSX.Element} The rendered icon element.
+ * @see {@link https://bulma.io/documentation/elements/icon/ | Bulma Icon documentation}
+ */
+export declare const Icon: React.FC<IconProps>;
+export {};

package/dist/types-cjs/elements/IconText.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+import { IconProps } from './Icon.js';
+/**
+ * Represents an item for the IconText component, containing icon props and optional text.
+ */
+interface IconTextItem {
+    /** Props for the Icon component, or a custom node (an inline SVG, a `react-icons` component, …) rendered in place of a class-based glyph. */
+    iconProps: IconProps | React.ReactNode;
+    /** Optional text to display next to the icon. */
+    text?: string;
+}
+/**
+ * Props for the IconText component.
+ */
+interface IconTextProps extends React.HTMLAttributes<HTMLSpanElement>, BulmaClassesProps {
+    /** 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 `.icon-text.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';
+    /** Props for a single Icon component, or a custom node, for single icon mode. */
+    iconProps?: IconProps | React.ReactNode;
+    /** Text for a single icon (for single icon mode). */
+    children?: React.ReactNode;
+    /** Array of icon/text pairs (for multiple icons mode). */
+    items?: IconTextItem[];
+}
+export declare const IconText: React.FC<IconTextProps> & {
+    Icon: React.FC<IconProps>;
+};
+export {};

package/dist/types-cjs/elements/Image.d.ts

@@ -0,0 +1,44 @@
+import React from 'react';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * Props for the Image component.
+ */
+export interface ImageProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /** Additional CSS classes to apply. */
+    className?: string;
+    /** Text color helper for the container. */
+    textColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /**
+     * Text color alias: renders `has-text-<color>`, exactly like `textColor`.
+     * Not a filled variant (no `.image.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 for the container. */
+    bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
+    /** Fixed size or aspect ratio modifier for the image container. */
+    size?: '16x16' | '24x24' | '32x32' | '48x48' | '64x64' | '96x96' | '128x128' | 'square' | '1by1' | '5by4' | '4by3' | '3by2' | '5by3' | '16by9' | '2by1' | '3by1' | '4by5' | '3by4' | '2by3' | '3by5' | '9by16' | '1by2' | '1by3';
+    /** Renders the image with rounded corners. */
+    isRounded?: boolean;
+    /** Uses retina (2x) image source. */
+    isRetina?: boolean;
+    /** Image source URL. */
+    src?: string;
+    /** Alternate text for the image. */
+    alt?: string;
+    /** Arbitrary content (e.g., iframe, custom HTML) inside the image container. */
+    children?: React.ReactNode;
+    /** Container element tag. Defaults to `'figure'` when using aspect-ratio sizes, `'div'` otherwise. */
+    as?: 'figure' | 'div' | 'p';
+}
+/**
+ * The `Image` component wraps images, iframes, or custom content in a Bulma-styled container, supporting fixed sizes, aspect ratios, rounded corners, retina images, and all Bulma helper props for color and spacing.
+ *
+ * @function
+ * @param {ImageProps} props - Props for the Image component.
+ * @returns {JSX.Element} The rendered image element.
+ * @see {@link https://bulma.io/documentation/elements/image/ | Bulma Image documentation}
+ */
+export declare const Image: React.FC<ImageProps>;
+export default Image;

package/dist/types-cjs/elements/Link.d.ts

@@ -0,0 +1,55 @@
+import React from 'react';
+import type { PolymorphicComponent } from '../helpers/polymorphic.js';
+import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses.js';
+/**
+ * The Link component's own props — everything it adds on top of the attributes
+ * of whatever element `as` renders.
+ */
+export interface LinkOwnProps extends Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
+    /**
+     * Not accepted. `color` on this component would be the deprecated
+     * presentational HTML attribute, and `useBulmaClasses` consumes any `color`
+     * key as a Bulma helper before the target could see it — so it is declared
+     * unavailable rather than silently eaten. Use `textColor` / `bgColor`.
+     * @internal
+     */
+    color?: never;
+    /**
+     * Not accepted under this name. `useBulmaClasses` consumes any
+     * `backgroundColor` key before `rest` is spread, so a custom `as` target
+     * declaring one would never receive it. Use `bgColor`.
+     * @internal
+     */
+    backgroundColor?: never;
+    /** 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';
+    /** Whether the link appears active. */
+    isActive?: boolean;
+    /** Content to render inside the link. */
+    children?: React.ReactNode;
+}
+/**
+ * Props for the Link component. The DOM attributes and the `ref` both follow
+ * `as`: with the default `'a'` the anchor attributes (`href`, `target`, `rel`)
+ * are accepted, with `as="span"` they are not.
+ *
+ * @extraProp {PolymorphicRef<React.ElementType>} [ref] - Ref forwarded to the element `as` renders, typed from `as`: the DOM node for an intrinsic tag, or whatever handle a custom component exposes.
+ */
+export type LinkProps<T extends React.ElementType = 'a'> = LinkOwnProps & Omit<React.ComponentPropsWithoutRef<T>, keyof LinkOwnProps | 'as'> & {
+    /** Render as another intrinsic element (`'span'`, `'button'`) or a custom component (e.g. a router `Link`) instead of `<a>`. Defaults to `'a'`. */
+    as?: T;
+};
+/**
+ * The `Link` component renders a styled anchor (`<a>`) element with Bulma helper class integration.
+ *
+ * @function
+ * @param {LinkProps} props - Props for the Link component.
+ * @param {React.Ref} ref - Forwarded ref to the element `as` renders.
+ * @returns {JSX.Element} The rendered anchor, or whatever `as` names.
+ * @see {@link https://bulma.io/documentation/elements/content/ | Bulma Content documentation}
+ */
+export declare const Link: PolymorphicComponent<LinkOwnProps, "a">;

package/dist/types-cjs/elements/LinkButton.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import { ButtonOwnProps } from './Button.js';
+import type { PolymorphicComponent } from '../helpers/polymorphic.js';
+/**
+ * The LinkButton component's own props — everything it adds on top of the
+ * attributes of whatever element `as` renders.
+ */
+export interface LinkButtonOwnProps extends Omit<ButtonOwnProps, 'color' | 'isOutlined' | 'isInverted' | 'isLight'> {
+    /** Display mode. `text` has no underline and highlights its background on hover; `ghost` uses the default text color and underlines on hover; `underline` drops the button chrome entirely (transparent background and border) and underlines on hover or focus. */
+    variant?: 'text' | 'ghost' | 'underline';
+    /** Text color override for the button. */
+    color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'white' | 'light' | 'dark' | 'black';
+    /**
+     * Not available on `LinkButton`, and declared so that a custom `as` target
+     * cannot reintroduce it. `Button` consumes these three for styling variants
+     * `LinkButton` does not offer, and strips them before rendering the target —
+     * so without this a component requiring one would type-check and silently
+     * never receive it.
+     * @internal
+     */
+    isOutlined?: never;
+    /** @internal Not available on `LinkButton` — see `isOutlined`. */
+    isInverted?: never;
+    /** @internal Not available on `LinkButton` — see `isOutlined`. */
+    isLight?: never;
+}
+/**
+ * Props for the LinkButton component. The DOM attributes and the `ref` both
+ * follow `as`, exactly as they do on `Button`.
+ *
+ * @extraProp {PolymorphicRef<React.ElementType>} [ref] - Ref forwarded to the element `as` renders, typed from `as`: the DOM node for an intrinsic tag, or whatever handle a custom component exposes.
+ */
+export type LinkButtonProps<T extends React.ElementType = 'button'> = LinkButtonOwnProps & Omit<React.ComponentPropsWithoutRef<T>, keyof LinkButtonOwnProps | 'as'> & {
+    /**
+     * Render as a `<button>`, `<a>`, or a custom component (e.g. a router `Link`).
+     * @defaultValue 'button'
+     */
+    as?: T;
+};
+/**
+ * The `LinkButton` component renders a `<button>` that visually looks like text or a link.
+ *
+ * @function
+ * @param {LinkButtonProps} props - Props for the LinkButton component.
+ * @param {React.Ref} ref - Forwarded ref to the element `as` renders.
+ * @returns {JSX.Element} The rendered link-styled button element.
+ *
+ * @example
+ * // Text variant (default)
+ * <LinkButton onClick={handleClick}>Click me</LinkButton>
+ *
+ * @example
+ * // Underline variant with color
+ * <LinkButton variant="underline" color="primary">Learn more</LinkButton>
+ */
+export declare const LinkButton: PolymorphicComponent<LinkButtonOwnProps, "button">;
+export default LinkButton;