@workday/canvas-kit-react/dist/commonjs/button/lib/ExternalHyperlink.d.ts

The parent module that contains all Workday Canvas Kit React components

import { HyperlinkProps } from './Hyperlink';
export interface ExternalHyperlinkProps extends HyperlinkProps {
    /**
     * Informs a screen reader user the link will open in a new window. It is read after the link text.
     * This value will need to be translated.
     */
    iconLabel?: string;
}
export declare const externalHyperlinkStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{
    readonly externalHyperlinkIcon: "external-hyperlink-icon";
}, {}, import("@workday/canvas-kit-styling").Stencil<{
    variant: {
        inverse: {
            color: "--cnvs-sys-color-text-inverse";
            '&:hover, &.hover': {
                color: "--cnvs-sys-color-text-inverse";
                background: string;
            };
            '&:focus, &.focus, &:focus-visible': {
                boxShadow: string;
            };
            '&:active, &.active': {
                color: "--cnvs-sys-color-text-primary-stronger";
                background: "--cnvs-sys-color-bg-alt-soft";
            };
        };
        standalone: {
            textDecoration: string;
        };
        standaloneInverse: {
            textDecoration: string;
            color: "--cnvs-sys-color-text-inverse";
            '&:hover, &.hover': {
                color: "--cnvs-sys-color-text-inverse";
                background: string;
            };
            '&:focus, &.focus, &:focus-visible': {
                boxShadow: string;
            };
            '&:active, &.active': {
                color: "--cnvs-sys-color-text-primary-stronger";
                background: "--cnvs-sys-color-bg-alt-soft";
            };
        };
    };
}, {}, {}, never, never>>, {
    readonly externalHyperlinkIcon: "external-hyperlink-icon";
}, {}, import("@workday/canvas-kit-styling").Stencil<{
    variant: {
        inverse: {
            color: "--cnvs-sys-color-text-inverse";
            '&:hover, &.hover': {
                color: "--cnvs-sys-color-text-inverse";
                background: string;
            };
            '&:focus, &.focus, &:focus-visible': {
                boxShadow: string;
            };
            '&:active, &.active': {
                color: "--cnvs-sys-color-text-primary-stronger";
                background: "--cnvs-sys-color-bg-alt-soft";
            };
        };
        standalone: {
            textDecoration: string;
        };
        standaloneInverse: {
            textDecoration: string;
            color: "--cnvs-sys-color-text-inverse";
            '&:hover, &.hover': {
                color: "--cnvs-sys-color-text-inverse";
                background: string;
            };
            '&:focus, &.focus, &:focus-visible': {
                boxShadow: string;
            };
            '&:active, &.active': {
                color: "--cnvs-sys-color-text-primary-stronger";
                background: "--cnvs-sys-color-bg-alt-soft";
            };
        };
    };
}, {}, {}, never, never>, never>;
/**
 * `ExternalHyperlink`s also have an `inverse` variant. Use this variant when you need to place the
 * link on a dark or colorful background such as `blueberry400`.
 */
export declare const ExternalHyperlink: import("@workday/canvas-kit-react/common").ElementComponent<"a", ExternalHyperlinkProps>;
//# sourceMappingURL=ExternalHyperlink.d.ts.map