UNPKG

@spark-web/text

Version:

--- title: Text storybookPath: typography-text--default isExperimentalPackage: false ---

36 lines (35 loc) 3.31 kB
import type { BoxProps } from '@spark-web/box'; import type { DataAttributeMap } from '@spark-web/utils/internal'; import type { CSSProperties, ReactNode } from 'react'; import type { TextOverflowStrategy } from './use-overflow-strategy'; import type { UseTextProps } from './use-text'; declare type InlineProps = { align?: never; /** Display as an inline element. */ inline?: boolean; overflowStrategy?: never; }; declare type BlockProps = { /** The horizontal alignment. */ align?: 'left' | 'center' | 'right'; inline?: never; /** Manage how text behaves with regard to overflow. */ overflowStrategy?: TextOverflowStrategy; }; export declare type TextProps = Partial<UseTextProps> & { /** The text content. */ children?: ReactNode; /** Sets data attributes on the component. */ data?: DataAttributeMap; /** An identifier which must be unique in the whole document. */ id?: BoxProps['id']; /** When enabled, numbers will be the same width. Similar to a monospaced font. */ tabularNumbers?: boolean; /** Transform the text casing. */ transform?: CSSProperties['textTransform']; } & (InlineProps | BlockProps); export declare const Text: <Comp extends import("react").ElementType<any> = "div">(props: { as?: Comp | undefined; ref?: import("react").Ref<Comp extends "symbol" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "set" | keyof HTMLElementTagNameMap ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "set">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined; } & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<Comp>>, "as"> & TextProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>; export {};