@luscii-healthtech/web-ui 0.0.0-alpha.01cea45

package/dist/components/Section/SectionItem.d.ts

@@ -0,0 +1,9 @@
+import React, { SyntheticEvent } from "react";
+import "./SectionItem.scss";
+export interface SectionItemProps {
+    className?: string;
+    onClick?: (event: SyntheticEvent) => void;
+    children?: React.ReactNode;
+}
+export declare const SectionItem: React.FC<SectionItemProps>;
+export default SectionItem;

package/dist/components/Section/SectionItemWithContent.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { SectionItemProps } from "./SectionItem";
+interface SectionItemWithContentProps extends Omit<SectionItemProps, "children"> {
+    text: string;
+    icon?: string;
+    iconClass?: string;
+}
+declare function SectionItemWithContent(props: SectionItemWithContentProps): JSX.Element;
+export default SectionItemWithContent;

package/dist/components/Section/subcomponents/SectionActions.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+/**
+ * Use in the aside of a header section. Spaces out the action
+ * components correctly in relation to the styling of the Section component.
+ *
+ * @usage
+ * ```tsx
+ * <Section
+ *   title="My section title"
+ *   headerAside={
+ *     <SectionActions>
+ *       <PrimaryButton />
+ *       <SecondaryButton />
+ *     </SectionActions>
+ *   }
+ * >
+ *   <Text>Content that is shown in the expandable "body" of the section.</Text>
+ * </Section>
+ * ```
+ */
+export declare const SectionActions: React.FC<React.PropsWithChildren>;

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,46 @@
+import { GroupBase, Props } from "react-select";
+import React from "react";
+/**
+ * Exceptional case for this file:
+ * We use postcss-url to inline and base64 our image assets.
+ * But the library can only see as far as css files.
+ * When javascript gets in the way (react-select uses a package called `emotion` for styles), postcss-url cannot
+ * bundle the svg assets used here, and we end up with some broken style.
+ */
+import "./Select.scss";
+import { FormFieldWidth } from "../Form/form.types";
+interface OptionMinimal {
+    value: any;
+    label?: string;
+}
+export interface SelectProps<Option extends OptionMinimal = OptionMinimal, IsMulti extends boolean = any, Group extends GroupBase<Option> = GroupBase<Option>> extends Props<Option, IsMulti, Group> {
+    /**
+     * Whether to show the component in error state.
+     */
+    isError?: boolean;
+    /**
+     * The maximum width the component will take.
+     */
+    width?: FormFieldWidth;
+    /**
+     * REASON: this could be a ticket to fix later on, but react-select has some tricky types to navigate
+     * imo there's little to no value spending time on fixing it properly since it already works.
+     *
+     * This change is protected by policy: https://app.glassfrog.com/organizations/13950/orgnav/policies/12870328
+     */
+    value?: any;
+}
+/**
+ * A wrapper around react-select to style it according to our design specification.
+ *
+ * In addition, the value is taken out of the option instead of returning the complete option.
+ *
+ * Care when using grouped options: The value of the options spanning all groups needs to be unique!
+ * For instance, if you have an option with value "chocolate" in both the groups "flavor" and "dip", then you get unforeseen errors.
+ * This is a problem within react-select itself, not our wrapper.
+ *
+ * Care when using defaultValue: this still requires the complete Option (instead of the value of the Option).
+ * So far there wasn't a use case for this.
+ */
+export declare const Select: React.ForwardRefExoticComponent<SelectProps<OptionMinimal, boolean, GroupBase<OptionMinimal>> & React.RefAttributes<unknown>>;
+export {};

package/dist/components/Select/SelectDropdownIndicator.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DropdownIndicatorProps } from "react-select";
+export declare const SelectDropdownIndicator: (props: DropdownIndicatorProps) => JSX.Element;

package/dist/components/Select/SelectLoadingIndicator.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { LoadingIndicatorProps } from "react-select";
+export declare const SelectLoadingIndicator: (props: LoadingIndicatorProps) => JSX.Element;

package/dist/components/SettingsMenuButton/SettingsMenuButton.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import { IconProps } from "../Icons/types/IconProps.type";
+interface ConfigurationItem<ExtraDataType extends object> {
+    itemId: string;
+    itemName: string;
+    on: boolean;
+    /** Additional info that can be used by the parent component */
+    extra?: ExtraDataType;
+}
+export interface SettingsMenuButtonProps<ExtraDataType extends object = Record<string, unknown>> {
+    configuration: ConfigurationItem<ExtraDataType>[];
+    onConfigurationChange: (newConfig: ConfigurationItem<ExtraDataType>) => void;
+    shiftMenuTo?: "right" | "right-md" | "left" | "left-md";
+    buttonTitle?: string;
+    menuTitle?: string;
+    iconComponent: React.FunctionComponent<IconProps>;
+}
+export declare const SettingsMenuButton: <ExtraDataType extends object = Record<string, unknown>>(props: SettingsMenuButtonProps<ExtraDataType>) => React.ReactElement;
+export {};

package/dist/components/Spinner/Spinner.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface SpinnerProps {
+    className?: string;
+}
+export declare const Spinner: (props: SpinnerProps) => React.JSX.Element;
+export {};

package/dist/components/Steps/Step.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export interface StepProps {
+    title: string;
+    stepNumber: number;
+    active: boolean;
+    localization: {
+        step: string;
+    };
+}
+export declare const Step: ({ title, stepNumber, active, localization, }: StepProps) => JSX.Element;

package/dist/components/Steps/Steps.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export interface StepsProps {
+    orderedStepTitles: Array<string>;
+    currentStep: number;
+    className?: string;
+    localization: {
+        step: string;
+    };
+}
+export declare const Steps: ({ orderedStepTitles, currentStep, className, localization, }: StepsProps) => JSX.Element;

package/dist/components/Tabbar/Tabbar.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { TabItemDetails } from "./TabbarItem";
+export interface TabbarProps<T extends object = Record<string, unknown>> {
+    tabs?: TabItemDetails<T>[];
+    selectedIndex?: number;
+    onSelect?: (params: {
+        index: number;
+        selectedTab: TabItemDetails<T>;
+    }) => void;
+    className?: string;
+    /**
+     * If this component is being used on a container that will handle spacing, this option disables the padding, allowing the container to take over spacing.
+     */
+    withoutPadding?: boolean;
+}
+export { TabItemDetails };
+export declare const Tabbar: <T extends object = Record<string, unknown>>({ tabs, selectedIndex, onSelect, className, withoutPadding, }: TabbarProps<T>) => JSX.Element;
+export default Tabbar;

package/dist/components/Tabbar/TabbarItem.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+export interface TabItemDetails<T extends object = Record<string, unknown>> {
+    title: string | JSX.Element;
+    badgeCount?: number;
+    isLoading?: boolean;
+    dataTestId?: string;
+    extra?: T;
+}
+export interface TabbarItemProps<T extends object = Record<string, unknown>> extends TabItemDetails<T> {
+    index: number;
+    isSelected?: boolean;
+    onSelect?: (index: number) => void;
+    className?: string;
+}
+declare const TabbarItem: <T extends object = Record<string, unknown>>({ title, index, isSelected, onSelect, className, badgeCount, isLoading, dataTestId, }: TabbarItemProps<T>) => JSX.Element;
+export default TabbarItem;

package/dist/components/Table/Table.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import { PaginationMenuProps } from "../PaginationMenu/PaginationMenu.types";
+import { TableFieldConfig } from "./Table.types";
+export interface TableProps<Item> extends React.HTMLAttributes<HTMLTableElement> {
+    items?: Item[];
+    fieldConfigurations: TableFieldConfig<Item>[];
+    emptyRowsText: string;
+    emptyFieldContentText?: string;
+    isLoading?: boolean;
+    showHeader?: boolean;
+    paginationMenuProps?: PaginationMenuProps;
+    onRowClick?: (item: Item) => void;
+    className?: string;
+    dataTestId?: string;
+}
+export declare function Table<Item>({ items, fieldConfigurations, emptyRowsText, emptyFieldContentText, isLoading, showHeader, paginationMenuProps, onRowClick, className, dataTestId, ...otherAttributes }: TableProps<Item>): JSX.Element;

package/dist/components/Table/Table.types.d.ts

@@ -0,0 +1,42 @@
+/// <reference types="react" />
+import { BaseButtonProps } from "../ButtonV2/ButtonProps.type";
+type TableFieldConfigBase = {
+    key: string;
+    headerText?: string;
+    onlyShowContentOnHovering?: boolean;
+};
+type TableFieldConfigWithContent<Item> = TableFieldConfigBase & {
+    content: (item: Item) => TableFieldContent<Item>;
+    render?: never;
+};
+type TableFieldConfigWithComponent<Item> = TableFieldConfigBase & {
+    render: (item: Item) => JSX.Element;
+    content?: never;
+};
+/**
+ * By adding the `content` property, it will use an opinionated layout with the <Text /> and optionally the <Tag /> component.
+ * By adding the `render` property, it will render any component returned in the function, based on the item (with type) passed.
+ */
+export type TableFieldConfig<Item> = TableFieldConfigWithComponent<Item> | TableFieldConfigWithContent<Item>;
+export type TableFieldContent<Item> = TableFieldText | [TableFieldAction<Item>?, TableFieldAction<Item>?];
+export interface TableFieldText {
+    text: string;
+    description?: {
+        content: string;
+        breakAllWord?: boolean;
+    };
+    breakAllWord?: boolean;
+    tag?: {
+        text: string;
+        color: "red" | "amber" | "green" | "gray" | "blue";
+    };
+}
+export type TableFieldAction<Item> = Pick<BaseButtonProps, "isDisabled" | "title" | "icon"> & {
+    key: string;
+    /**
+     * @param item - the data in the row when this clicked
+     * @returns void
+     */
+    handleClick: (item: Item) => void;
+};
+export {};

package/dist/components/Table/Table.utils.d.ts

@@ -0,0 +1,3 @@
+import { TableFieldText, TableFieldAction, TableFieldContent } from "./Table.types";
+export declare function isTableFieldText<Item>(content: TableFieldContent<Item>): content is TableFieldText;
+export declare function isTableFieldAction<Item>(content: TableFieldContent<Item>): content is [TableFieldAction<Item>?, TableFieldAction<Item>?];

package/dist/components/Table/TableBody.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { TableFieldConfig } from "./Table.types";
+export interface TableBody<Item> {
+    items?: Item[];
+    fieldConfigurations: TableFieldConfig<Item>[];
+    emptyItemsText: string;
+    emptyFieldContentText?: string;
+    isLoading: boolean;
+    showEmptyView: boolean;
+    onRowClick?: (item: Item) => void;
+    className?: string;
+}
+export declare function TableBody<Item>(props: TableBody<Item>): JSX.Element;

package/dist/components/Table/TableBodyRow.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { TableFieldConfig } from "./Table.types";
+export interface TableBodyRowProps<Item> {
+    item: Item;
+    fieldConfigurations: TableFieldConfig<Item>[];
+    emptyFieldContentText?: string;
+    onClick?: (item: Item) => void;
+    className?: string;
+}
+export declare function TableBodyRow<Item>(props: TableBodyRowProps<Item>): JSX.Element;

package/dist/components/Table/TableBodyRowDataCell.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { TableFieldConfig } from "./Table.types";
+export interface TableBodyRowDataCellProps<Item> {
+    item: Item;
+    fieldConfig: TableFieldConfig<Item>;
+    emptyFieldContentText?: string;
+}
+export declare function TableBodyRowDataCell<Item>(props: TableBodyRowDataCellProps<Item>): JSX.Element;

package/dist/components/Table/TableFooter.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { PaginationMenuProps } from "../PaginationMenu/PaginationMenu.types";
+interface TableFooterProps {
+    colSpan: number;
+    paginationMenuProps: PaginationMenuProps;
+}
+export declare const TableFooter: (props: TableFooterProps) => JSX.Element;
+export {};

package/dist/components/Table/TableHeader.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { TableFieldConfig } from "./Table.types";
+export interface TableHeaderProps<Item> {
+    fieldConfigurations: TableFieldConfig<Item>[];
+    className?: string;
+}
+export declare function TableHeader<Item>(props: TableHeaderProps<Item>): JSX.Element;

package/dist/components/Tag/Tag.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+type Color = "red" | "amber" | "green" | "gray" | "blue";
+type Size = "base" | "small";
+interface TagPropsShared extends React.ComponentPropsWithoutRef<"span"> {
+    colorTheme?: Color;
+    children?: string;
+    size?: Size;
+    className?: string;
+}
+interface PropsWithChildren extends TagPropsShared {
+    children?: string;
+    /**
+     * @deprecated Use `children` instead
+     */
+    text?: never;
+}
+interface PropsWithText extends TagPropsShared {
+    children?: never;
+    /**
+     * @deprecated Use `children` instead
+     */
+    text: string;
+}
+export type Props = PropsWithChildren | PropsWithText;
+export declare const Tag: ({ text, colorTheme, className, size, children, ...rest }: Props) => React.JSX.Element;
+export {};

package/dist/components/Tag/TagGroup.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+import { type Props as TagProps } from "./Tag";
+interface PropsWithTags {
+    /**
+     * @deprecated Use `children` instead
+     */
+    tags?: TagProps[];
+    /**
+     * @deprecated Size of each tag rendered as a child is dictated by this child itself.
+     */
+    tagSize?: TagProps["size"];
+    children?: never;
+}
+interface PropsWithChildren {
+    tags?: never;
+    tagSize?: never;
+    children?: React.ReactNode;
+}
+type Props = (PropsWithTags | PropsWithChildren) & {
+    className?: string;
+};
+export declare const TagGroup: ({ children, tags, tagSize, className, }: Props) => React.JSX.Element;
+export {};

package/dist/components/Text/Text.d.ts

@@ -0,0 +1,115 @@
+import React from "react";
+import { RestPropped } from "../../types/general.types";
+import "./Text.css";
+/**
+ * One might argue that we're duplicating strings in this file.
+ * That's how tailwind expects to detect used classes, so please do not make
+ * anything dynamic or try to string concat class names.
+ * https://v1.tailwindcss.com/docs/controlling-file-size
+ */
+declare const allowedTextStyles: {
+    readonly sm: "ui-text-xs ui-font-medium";
+    readonly "sm-strong": "ui-text-xs ui-font-semibold ui-antialiased";
+    readonly base: "ui-text-sm";
+    readonly strong: "ui-text-sm ui-font-semibold ui-antialiased";
+    readonly lg: "";
+    readonly "lg-strong": "ui-font-semibold ui-antialiased";
+    readonly xl: "ui-text-lg";
+    readonly "xl-strong": "ui-font-semibold ui-text-lg ui-antialiased";
+};
+export declare const allowedColors: {
+    readonly base: "ui-text-slate-800";
+    readonly "slate-500": "ui-text-slate-500";
+    readonly "slate-200": "ui-text-slate-200";
+    readonly red: "ui-text-red-700";
+    readonly green: "ui-text-green-700";
+    readonly amber: "ui-text-yellow-700";
+    readonly white: "ui-text-white";
+    readonly "blue-800": "ui-text-primary";
+    readonly current: "ui-text-current";
+};
+declare const allowedHoverColors: {
+    readonly "blue-900": "hover:ui-text-primary-dark";
+    readonly white: "hover:ui-text-white";
+};
+export type TextColor = keyof typeof allowedColors;
+export type TextHoverColor = keyof typeof allowedHoverColors;
+export type TextStyle = keyof typeof allowedTextStyles;
+export interface TextProps extends RestPropped, React.ComponentPropsWithoutRef<"p"> {
+    /**
+     * @deprecated
+     * Use `children` instead, as you would with a regular `<p>` tag.
+     */
+    text?: string;
+    /**
+     * @deprecated
+     * Use `variant` instead. "type" is a word that is too ambiguous and
+     * is also often used as an attribute name in HTML.
+     *
+     * @default "base"
+     */
+    type?: TextStyle;
+    /**
+     * The styling variant of the text.
+     *
+     * @default "base"
+     */
+    variant?: TextStyle;
+    /**
+     * Changes the component to be rendered inline. This is useful for
+     * using this component inside of itself, for example, when you want
+     * to render bold text inside of a paragraph rendered by this same component.
+     *
+     * @default false
+     */
+    inline?: boolean;
+    /**
+     * @default "base"
+     */
+    color?: TextColor;
+    /**
+     * @default "base"
+     */
+    hoverColor?: TextHoverColor;
+    /**
+     * Tailwind class modifier that allows you to apply hover styles on this component
+     * based on the styles of its parent.
+     * https://tailwindcss.com/docs/hover-focus-and-other-states#styling-based-on-parent-state
+     *
+     * @deprecated
+     * Since this is a Tailwind specific feature we should not expose this to the consumer. We
+     * should only use group-hover styles in the components in WebUI instead.
+     */
+    hoverInGroup?: boolean;
+    className?: string;
+    /**
+     * Interpret an HTML string as regular markup, instead of rendering it as a string.
+     *
+     * @default false
+     */
+    containsDangerousHtml?: boolean;
+    /**
+     * With this prop enabled, text won't wrap to the next line but instead
+     * will be truncated with an ellipsis.
+     *
+     * @default false
+     */
+    truncate?: boolean;
+    /**
+     * When `true` will work together with the `truncate` prop
+     * and allow a max of two lines when breaking text before applying
+     * ellipsis.
+     *
+     * @default false
+     */
+    clampLines?: boolean;
+    "data-test-id"?: string;
+}
+export declare const Text: {
+    (props: TextProps): JSX.Element;
+    defaultProps: {
+        variant: "base";
+        color: "base";
+    };
+};
+export default Text;

package/dist/components/TextEditor/TextEditor.d.ts

@@ -0,0 +1,53 @@
+import React from "react";
+import { ReactQuillProps } from "react-quill";
+import "react-quill/dist/quill.snow.css";
+import "./TextEditor.scss";
+type TextEditorProps = Pick<ReactQuillProps, "defaultValue" | "placeholder"> & {
+    onValueChange: ReactQuillProps["onChange"];
+    /**
+     * Which formats to allow in the editor, like "bold" and "italic".
+     *
+     * This is different from the buttons that are shown in the toolbar,
+     * because a user could paste in text that has bold formatting without
+     * having a bold button in the toolbar. This prop determines if that is
+     * allowed or not.
+     *
+     * @default
+     *
+     * ["bold", "italic", "underline", "strike", "list", "link"]
+     *
+     * @example
+     *
+     * ["bold", "italic, "color", "code"]
+     *
+     * See: https://github.com/zenoamaro/react-quill#custom-formats
+     */
+    formats: TextEditorFormat[];
+    /**
+     * Which buttons to show in the toolbar, like "bold" and "italic".
+     *
+     * @default
+     * [
+     *   ["bold", "italic", "underline", "strike"],
+     *   [{ list: "ordered" }, { list: "bullet" }],
+     *   ["link"],
+     * ]
+     *
+     * @example
+     *
+     * [
+     *   ["bold", "italic", "underline", "strike"],
+     *   ["link", "video"],
+     * ]
+     * See: https://github.com/zenoamaro/react-quill#custom-toolbar
+     */
+    toolbar: TextEditorToolbarOption[][];
+};
+type TextEditorToolbarOption = "bold" | "italic" | "underline" | "strike" | "link" | "video" | {
+    list: "ordered";
+} | {
+    list: "bullet";
+};
+type TextEditorFormat = "background" | "bold" | "color" | "font" | "code" | "italic" | "link" | "size" | "strike" | "script" | "underline" | "blockquote" | "header" | "list" | "align";
+export declare const TextEditor: React.FC<TextEditorProps>;
+export default TextEditor;

package/dist/components/TextLink/TextLink.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export interface TextLinkProps {
+    text: string;
+    enabled?: boolean;
+    href?: string;
+    rel?: string;
+    target?: string;
+    onClick?: () => void;
+    className?: string;
+}
+/**
+ * @deprecated Use `Link`.
+ */
+export declare const TextLink: (props: TextLinkProps) => JSX.Element;

package/dist/components/Textarea/Textarea.d.ts

@@ -0,0 +1,33 @@
+import React, { ChangeEvent, FocusEvent, KeyboardEvent } from "react";
+import "./Textarea.scss";
+declare const resizeTypes: {
+    readonly NONE: "none";
+    readonly BOTH: "both";
+    readonly HORIZONTAL: "horizontal";
+    readonly VERTICAL: "vertical";
+};
+export type ResizeTypes = (typeof resizeTypes)[keyof typeof resizeTypes];
+export interface TextareaProps {
+    className?: string;
+    value?: string;
+    name?: string;
+    placeholder?: string;
+    maxLength?: number;
+    rows?: number;
+    resizable?: ResizeTypes;
+    isDisabled?: boolean;
+    icon?: string;
+    onChange: (event: ChangeEvent) => void;
+    onBlur?: (event: FocusEvent<HTMLTextAreaElement>) => void;
+    onFocus?: (event: FocusEvent<HTMLTextAreaElement>) => void;
+    onKeyPress?: (event: KeyboardEvent<HTMLTextAreaElement>) => void;
+    onKeyDown?: (event: KeyboardEvent<HTMLTextAreaElement>) => void;
+    onCtrlEnter?: () => void;
+    /**
+     * @deprecated
+     * This prop is currently unused. It might be removed in the future.
+     */
+    isError?: boolean;
+}
+export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+export {};

package/dist/components/Timeline/Timeline.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { BaseButtonProps } from "../ButtonV2/ButtonProps.type";
+import { CenteredHeroProps } from "../CenteredHero/CenteredHero";
+import { TimelineStepProps } from "./TimelineStep";
+import { TimelineHeaderProps } from "./TimelineHeader";
+export interface TimelineProps {
+    headerProps?: TimelineHeaderProps;
+    steps: TimelineStepProps[];
+    loadMoreButtonProps?: BaseButtonProps;
+    dataTestId?: string;
+    emptyHeroProps?: CenteredHeroProps;
+}
+export declare const Timeline: ({ headerProps, steps, loadMoreButtonProps, dataTestId, emptyHeroProps, }: TimelineProps) => JSX.Element;
+export default Timeline;

package/dist/components/Timeline/TimelineHeader.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { ButtonDefinitionWithKey, ButtonProps } from "../ButtonV2/ButtonProps.type";
+import { type TitleProps } from "../Title/Title";
+export type TimelineHeaderProps = {
+    title?: string | TitleProps;
+    buttons?: ButtonDefinitionWithKey<ButtonProps>[];
+    withBorder?: boolean;
+};
+export declare const TimelineHeader: React.FC<TimelineHeaderProps>;
+export default TimelineHeader;

package/dist/components/Timeline/TimelineStep.d.ts

@@ -0,0 +1,10 @@
+import React, { RefAttributes } from "react";
+import { TextProps } from "../Text/Text";
+export interface TimelineStepProps extends RefAttributes<HTMLDivElement> {
+    key: string | number;
+    type?: "wide" | "base" | "withoutDot" | "emptyDot";
+    title?: string | TextProps;
+    content: React.ReactNode;
+    dataTestId?: string | number;
+}
+export declare const TimelineStep: React.ForwardRefExoticComponent<Omit<TimelineStepProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Title/Title.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import "./Title.scss";
+import { TextColor } from "../Text/Text";
+export type TitleStyle = "xs" | "sm" | "base" | "lg" | "xl" | "2xl";
+type SharedProps = {
+    type?: TitleStyle;
+    color?: TextColor;
+    className?: string;
+    ref?: React.ForwardedRef<HTMLHeadingElement>;
+};
+type WithChildrenProp = React.PropsWithChildren<SharedProps> & {
+    /**
+     * @deprecated Use children instead
+     */
+    text?: never;
+};
+type WithTextProp = SharedProps & {
+    /**
+     * @deprecated Use children instead
+     */
+    text: string;
+    children?: never;
+};
+export type TitleProps = WithChildrenProp | WithTextProp;
+export declare const Title: {
+    (props: TitleProps): JSX.Element;
+    defaultProps: {
+        type: "base";
+    };
+};
+export {};