@navikt/ds-react/esm/copybutton/CopyButton.d.ts

React components from the Norwegian Labour and Welfare Administration.

import React, { ButtonHTMLAttributes } from "react";
import type { AkselStatusColorRole } from "@navikt/ds-tokens/types";
import { ButtonProps } from "../button/index.js";
import type { AkselColor } from "../types/theme";
export interface CopyButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children">, Pick<ButtonProps, "iconPosition" | "size"> {
    /**
     * @deprecated Use `data-color` attribute instead.
     */
    variant?: "action" | "neutral";
    /**
     * Overrides color.
     *
     * We recommend only using `accent` and `neutral`. We have disallowed status-colors.
     * @default "neutral"
     * @see 🏷️ {@link AkselColor}
     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
     */
    "data-color"?: Exclude<AkselColor, AkselStatusColorRole>;
    /**
     * Text to copy to clipboard.
     */
    copyText: string;
    /**
     *  Optional text in button.
     */
    text?: string;
    /**
     * Text shown when button is clicked.
     * Will be used as accessible label (title) if `text`-prop is not set.
     * @default "Kopiert!"
     */
    activeText?: string;
    /**
     * Callback that is called when internal copy-state changes.
     *
     * @param state `true` when copy-state is activated, `false` when copy-state is deactivated.
     */
    onActiveChange?: (state: boolean) => void;
    /**
     * Icon shown when button is not clicked.
     * @default <FilesIcon />
     */
    icon?: React.ReactNode;
    /**
     * Icon shown when active.
     * @default <CheckmarkIcon />
     */
    activeIcon?: React.ReactNode;
    /**
     * Timeout duration in milliseconds.
     * @default 2000
     */
    activeDuration?: number;
    /**
     * Accessible label for icon (ignored if text is set).
     * @default "Kopier"
     */
    title?: string;
}
/**
 * A button component that copies text to the clipboard when clicked.
 *
 * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/copybutton)
 * @see 🏷️ {@link CopyButtonProps}
 *
 * @example
 * ```jsx
      <CopyButton copyText="3.14" />
 * ```
 */
export declare const CopyButton: React.ForwardRefExoticComponent<CopyButtonProps & React.RefAttributes<HTMLButtonElement>>;
export default CopyButton;