@chayns-components/core 5.0.0-beta.12 → 5.0.0-beta.1200

package/lib/types/components/signature/Signature.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+export interface SignatureRef {
+    edit: VoidFunction;
+    delete: VoidFunction;
+}
+export type SignatureProps = {
+    /**
+     * The text that should be displayed inside the button.
+     */
+    buttonText: string;
+    /**
+     * Whether the button is disabled.
+     */
+    isDisabled?: boolean;
+    /**
+     * Function to be executed when the signature is edited.
+     */
+    onEdit?: (signatureUrl: string) => void;
+    /**
+     * Function to be executed when the user deletes the signature.
+     */
+    onRemove?: () => void;
+    /**
+     * Function to be executed when the user subscribes.
+     */
+    onSubscribe?: (signatureUrl: string) => void;
+    /**
+     * Function to be executed when the user unsubscribes.
+     */
+    onUnsubscribe?: () => void;
+};
+declare const Signature: React.ForwardRefExoticComponent<SignatureProps & React.RefAttributes<SignatureRef>>;
+export default Signature;

package/lib/types/components/signature/Signature.styles.d.ts

@@ -0,0 +1,6 @@
+export declare const StyledSignature: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledSignatureImageWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledSignatureImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {
+    theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string;
+export declare const StyledSignatureDeleteIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/types/components/slider/Slider.d.ts

@@ -0,0 +1,135 @@
+import { FC } from 'react';
+export interface SliderInterval {
+    maxValue: number;
+    minValue: number;
+}
+export type SliderProps = {
+    /**
+     * The current interval of the slider.
+     * @description
+     * The `interval` prop is used to define a range for the slider, allowing users to select a minimum and maximum value.
+     * This is particularly useful for scenarios where you want to allow users to select a range of values, such as price ranges or date ranges.
+     * When provided, the slider will display two thumbs, one for the minimum value and one for the maximum value.
+     * @example
+     * <Slider interval={{ minValue: 10, maxValue: 50 }} />
+     */
+    interval?: SliderInterval;
+    /**
+     * Disables the slider, preventing user interaction.
+     * @description
+     * The `isDisabled` prop is used to disable the slider, making it unresponsive to user input.
+     * When set to `true`, the slider cannot be moved, and its appearance may change to indicate that it is disabled.
+     * This is useful for scenarios where the slider should not be interacted with, such as when the data it controls is not available or when the user does not have permission to change the value.
+     * @default false
+     * @example
+     * <Slider isDisabled={true} />
+     * @optional
+     */
+    isDisabled?: boolean;
+    /**
+     * The maximum value of the slider.
+     * @description
+     * The `maxValue` prop defines the upper limit of the slider's range. It is used to set the maximum value that can be selected by the user.
+     * This value should be greater than or equal to `minValue`.
+     * @example
+     * <Slider maxValue={200} />
+     */
+    maxValue: number;
+    /**
+     * The minimum value of the slider.
+     * @description
+     * The `minValue` prop defines the lower limit of the slider's range. It is used to set the minimum value that can be selected by the user.
+     * This value should be less than or equal to `maxValue`.
+     * @example
+     * <Slider minValue={0} />
+     */
+    minValue: number;
+    /**
+     * Callback function that is called when the slider value changes.
+     * @description
+     * The `onChange` prop is a callback function that is triggered whenever the slider value changes.
+     * It receives the new value or interval of the slider as an argument, allowing you to update your application state or perform other actions based on the new value.
+     * If the slider is configured as an interval, it will receive an object with `minValue` and `maxValue`.
+     * @example
+     * <Slider onChange={(value, interval) => console.log('Slider changed', { value, interval })} />
+     */
+    onChange?: (value?: number, interval?: SliderInterval) => void;
+    /**
+     * Callback function that is called when the slider selection is finalized.
+     * @description
+     * The `onSelect` prop is a callback function that is triggered when the user finishes interacting with the slider, such as releasing the mouse or touch after dragging the thumb.
+     * It receives the selected value or interval as arguments, allowing you to perform actions based on the final selection.
+     * If the slider is configured as an interval, it will receive an object with `minValue` and `maxValue`.
+     * @example
+     * <Slider onSelect={(value, interval) => console.log('Slider selected', { value, interval })} />
+     */
+    onSelect?: (value?: number, interval?: SliderInterval) => void;
+    /**
+     * Indicates whether the slider should highlight steps.
+     * @description
+     * The `shouldHighlightSteps` prop determines whether the slider should visually indicate the steps between values.
+     * When set to `true`, the slider will show visual markers for each step, making it easier for users to see the increments.
+     * @default false
+     * @example
+     * <Slider shouldHighlightSteps={true} />
+     * @optional
+     */
+    shouldHighlightSteps?: boolean;
+    /**
+     * Indicates whether the slider should show a label on the thumb.
+     * @description
+     * The `shouldShowThumbLabel` prop determines whether the slider should display a label on the thumb that shows the current value.
+     * When set to `true`, a label will be shown above the thumb, providing users with immediate feedback on the selected value.
+     * @default false
+     * @example
+     * <Slider shouldShowThumbLabel={true} />
+     * @optional
+     */
+    shouldShowThumbLabel?: boolean;
+    /**
+     * The step size for the slider.
+     * @description
+     * The `step` prop defines the increment by which the slider value changes when the user interacts with it.
+     * It is used to control the granularity of the slider's movement. For example, if `step` is set to 1, the slider will move in increments of 1.
+     * @default 1
+     * @example
+     * <Slider step={5} />
+     * @optional
+     */
+    step?: number;
+    /**
+     * The step size for the slider.
+     * @description
+     * The `steps` prop defines the increment by which the slider value changes when the user interacts with it.
+     * It is used to control the granularity of the slider's movement. For example, if `step` is set to 1, the slider will move in increments of 1.
+     * @default 1
+     * @example
+     * <Slider steps={5} />
+     * @optional
+     * @deprecated Use `step` instead. This prop will be removed in future versions.
+     */
+    steps?: number;
+    /**
+     * A function to format the thumb label.
+     * @description
+     * The `thumbLabelFormatter` prop is a function that formats the value displayed on the thumb label.
+     * It receives the current value as an argument and should return a string that will be displayed on the thumb label.
+     * This is useful for customizing the appearance of the label, such as adding currency symbols or units.
+     * @example
+     * <Slider thumbLabelFormatter={(value) => `${value} €`} />
+     * @optional
+     */
+    thumbLabelFormatter?: (value: number) => string;
+    /**
+     * The current value of the slider.
+     * @description
+     * The `value` prop is used to set the current value of the slider when it is not configured as an interval.
+     * It should be a number between `minValue` and `maxValue`. If the slider is configured as an interval, this prop will be ignored.
+     * @example
+     * <Slider value={50} />
+     * @optional
+     */
+    value?: number;
+};
+declare const Slider: FC<SliderProps>;
+export default Slider;

package/lib/types/components/slider/Slider.styles.d.ts

@@ -0,0 +1,38 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+type StyledSliderProps = WithTheme<{
+    $isDisabled?: boolean;
+}>;
+export declare const StyledSlider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSliderProps>> & string;
+type StyledSliderInputProps = WithTheme<{
+    $min: number;
+    $max: number;
+    $value: number;
+    $isInterval: boolean;
+    $thumbWidth: number;
+}>;
+export declare const StyledSliderInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<Omit<Omit<import("motion/react").HTMLMotionProps<"input">, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
+}, Omit<Omit<import("motion/react").HTMLMotionProps<"input">, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
+}>, StyledSliderInputProps>, never>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLInputElement, import("motion/react").HTMLMotionProps<"input">>, keyof import("react").Component<any, {}, any>>;
+type StyledSliderThumbProps = WithTheme<{
+    $position: number;
+    $isBigSlider: boolean;
+}>;
+export declare const StyledSliderThumb: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}>, StyledSliderThumbProps>, never>> & string;
+type StyledSliderThumbLabelProps = WithTheme<{
+    $position: number;
+    $width: number;
+    $isBigSlider: boolean;
+}>;
+export declare const StyledSliderThumbLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}>, StyledSliderThumbLabelProps>, never>> & string;
+type StyledHighlightedStepProps = WithTheme<{
+    $isFilled: boolean;
+    $leftPosition: number;
+}>;
+export declare const StyledHighlightedStep: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledHighlightedStepProps>> & string;
+export {};

package/lib/types/components/slider-button/SliderButton.d.ts

@@ -0,0 +1,27 @@
+import { FC } from 'react';
+import type { SliderButtonItem } from '../../types/slider-button';
+export type SliderButtonProps = {
+    /**
+     * Whether the button is disabled and cannot be clicked anymore.
+     */
+    isDisabled?: boolean;
+    /**
+     * Displays the button in the secondary style.
+     */
+    isSecondary?: boolean;
+    /**
+     * The items that should be displayed in the slider button.
+     */
+    items: SliderButtonItem[];
+    /**
+     * Function to be executed when a button is selected. The id of the selected button is passed as an argument.
+     * @param id
+     */
+    onChange?: (id: string) => void;
+    /**
+     * The id of the button that should be selected.
+     */
+    selectedButtonId?: string;
+};
+declare const SliderButton: FC<SliderButtonProps>;
+export default SliderButton;

package/lib/types/components/slider-button/SliderButton.styles.d.ts

@@ -0,0 +1,31 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+type StyledSliderButtonProps = WithTheme<{
+    $isDisabled?: boolean;
+}>;
+export declare const StyledSliderButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSliderButtonProps>> & string;
+type StyledSliderButtonWrapperProps = WithTheme<{
+    $width: number;
+    $isDisabled?: boolean;
+}>;
+export declare const StyledSliderButtonWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSliderButtonWrapperProps>> & string;
+type StyledSliderButtonItemProps = WithTheme<{
+    $isSecondary?: boolean;
+    $width: number;
+}>;
+export declare const StyledSliderButtonItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSliderButtonItemProps>> & string;
+export declare const StyledSliderButtonPopupContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledSliderButtonPopupContentItemProps = WithTheme<{
+    $isSelected?: boolean;
+}>;
+export declare const StyledSliderButtonPopupContentItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSliderButtonPopupContentItemProps>> & string;
+type StyledSliderButtonButtonsWrapperProps = WithTheme<{
+    $isInvisible?: boolean;
+}>;
+export declare const StyledSliderButtonButtonsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSliderButtonButtonsWrapperProps>> & string;
+type StyledMotionSliderButtonThumbProps = WithTheme<{
+    $width: number;
+}>;
+export declare const StyledMotionSliderButtonThumb: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<Omit<import("motion/react").HTMLMotionProps<"div">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}, StyledMotionSliderButtonThumbProps>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export {};

package/lib/types/components/small-wait-cursor/SmallWaitCursor.d.ts

@@ -0,0 +1,34 @@
+import { FC } from 'react';
+export declare enum SmallWaitCursorSize {
+    Small = 16,
+    Medium = 30
+}
+export declare enum SmallWaitCursorSpeed {
+    Slow = 1.5,
+    Medium = 1,
+    Fast = 0.5
+}
+export type SmallWaitCursorProps = {
+    /**
+     * Specifies whether the wait cursor should be displayed with a background.
+     */
+    shouldHideBackground?: boolean;
+    /**
+     * Specifies whether the wait cursor should be displayed.
+     */
+    shouldHideWaitCursor?: boolean;
+    /**
+     * The size of the wait cursor in pixels. Use the SmallWaitCursorSize enum for this prop.
+     */
+    size?: SmallWaitCursorSize | number;
+    /**
+     * The speed of the animation in seconds. Use the SmallWaitCursorSpeed enum for this prop.
+     */
+    speed?: SmallWaitCursorSpeed;
+    /**
+     * The color of the inner circle of the wait cursor.
+     */
+    color?: string;
+};
+declare const SmallWaitCursor: FC<SmallWaitCursorProps>;
+export default SmallWaitCursor;

package/lib/types/components/small-wait-cursor/SmallWaitCursor.styles.d.ts

@@ -0,0 +1,18 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+import type { SmallWaitCursorSize, SmallWaitCursorSpeed } from './SmallWaitCursor';
+type StyledSmallWaitCursorProps = WithTheme<{
+    $shouldShowWaitCursor: boolean;
+    $size: SmallWaitCursorSize | number;
+}>;
+export declare const StyledSmallWaitCursor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSmallWaitCursorProps>> & string;
+export declare const StyledSmallWaitCursorBackground: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string;
+type StyledSmallWaitCursorWaitCursorProps = WithTheme<{
+    $size: SmallWaitCursorSize | number;
+    $speed: SmallWaitCursorSpeed;
+    $shouldHideBackground: boolean;
+    $color?: string;
+}>;
+export declare const StyledSmallWaitCursorWaitCursor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSmallWaitCursorWaitCursorProps>> & string;
+export {};

package/lib/types/components/tag-input/TagInput.d.ts

@@ -0,0 +1,51 @@
+import React, { ChangeEventHandler, ReactNode, FocusEventHandler } from 'react';
+import type { Tag } from '../../types/tagInput';
+export type TagInputProps = {
+    /**
+     * An element that should be displayed on the left side of the input.
+     */
+    leftElement?: ReactNode;
+    /**
+     * Function to be executed when a tag is added.
+     */
+    onAdd?: (tag: Tag) => void;
+    /**
+     * Function to be executed when the input is blurred.
+     */
+    onBlur?: FocusEventHandler;
+    /**
+     * Function to be executed when the value of the input is changed.
+     */
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+    /**
+     * Function to be executed when the input is focused.
+     */
+    onFocus?: FocusEventHandler;
+    /**
+     * Function to be executed when a tag is removed.
+     */
+    onRemove?: (id: string) => void;
+    /**
+     * The placeholder that should be displayed.
+     */
+    placeholder?: string;
+    /**
+     * Whether multiple tags should be allowed.
+     */
+    shouldAllowMultiple?: boolean;
+    /**
+     * Whether the enter key should be prevented.
+     */
+    shouldPreventEnter?: boolean;
+    /**
+     * The tags that should be displayed.
+     */
+    tags?: Tag[];
+};
+export type TagInputRef = {
+    blur: () => void;
+    getUnsavedTagText: Tag['text'] | undefined;
+    resetValue: () => void;
+};
+declare const TagInput: React.ForwardRefExoticComponent<TagInputProps & React.RefAttributes<TagInputRef>>;
+export default TagInput;

package/lib/types/components/tag-input/TagInput.styles.d.ts

@@ -0,0 +1,12 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+type StyledTagInputProps = WithTheme<{
+    $shouldChangeColor: boolean;
+}>;
+export declare const StyledTagInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTagInputProps>> & string;
+export declare const StyledTagInputTagWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledTagInputTagWrapperText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
+export declare const StyledTagInputTagInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {
+    theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string;
+export declare const StyledTagInputIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export {};

package/lib/types/components/text-area/TextArea.d.ts

@@ -0,0 +1,49 @@
+import React, { ChangeEventHandler, CSSProperties, FocusEventHandler, KeyboardEventHandler, ReactElement } from 'react';
+export type TextAreaProps = {
+    /**
+     * Disables the text area so that it cannot be changed.
+     */
+    isDisabled?: boolean;
+    /**
+     * If true, the text area is marked as invalid
+     */
+    isInvalid?: boolean;
+    /**
+     * The maximum height of the text area.
+     */
+    maxHeight?: CSSProperties['maxHeight'];
+    /**
+     * The minimum height of the text area.
+     */
+    minHeight?: CSSProperties['minHeight'];
+    /**
+     * Function that is executed when the text area loses focus.
+     */
+    onBlur?: FocusEventHandler<HTMLTextAreaElement>;
+    /**
+     * Function that is executed when the text of the text area changes.
+     */
+    onChange?: ChangeEventHandler<HTMLTextAreaElement>;
+    /**
+     * Function that is executed when the input field is focused
+     */
+    onFocus?: FocusEventHandler<HTMLTextAreaElement>;
+    /**
+     * Function that is executed when a letter is pressed
+     */
+    onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;
+    /**
+     * Placeholder for the text area field.
+     */
+    placeholder?: string | ReactElement;
+    /**
+     * An element that should be displayed on the right side of the Input.
+     */
+    rightElement?: ReactElement;
+    /**
+     * Value if the text area should be controlled.
+     */
+    value?: string;
+};
+declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
+export default TextArea;

package/lib/types/components/text-area/TextArea.styles.d.ts

@@ -0,0 +1,28 @@
+import type { CSSProperties } from 'react';
+import { BrowserName } from '../../types/chayns';
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+import type { TextAreaProps } from './TextArea';
+type StyledTextAreaProps = WithTheme<{
+    $isDisabled?: boolean;
+}>;
+export declare const StyledTextArea: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTextAreaProps>> & string;
+type StyledTextAreaContentWrapperProps = WithTheme<{
+    $isInvalid: TextAreaProps['isInvalid'];
+    $shouldChangeColor: boolean;
+}>;
+export declare const StyledTextAreaContentWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTextAreaContentWrapperProps>> & string;
+export declare const StyledTextAreaContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledTextAreaInputProps = WithTheme<{
+    $browser: BrowserName;
+    $isInvalid: TextAreaProps['isInvalid'];
+    $isOverflowing: boolean;
+    $maxHeight: CSSProperties['maxHeight'];
+    $minHeight: CSSProperties['minHeight'];
+}>;
+export declare const StyledTextAreaInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, StyledTextAreaInputProps>> & string;
+export declare const StyledTextAreaLabelWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
+type StyledTextAreaLabelProps = WithTheme<{
+    $isInvalid?: TextAreaProps['isInvalid'];
+}>;
+export declare const StyledTextAreaLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, StyledTextAreaLabelProps>> & string;
+export {};

package/lib/types/components/tooltip/Tooltip.d.ts

@@ -0,0 +1,51 @@
+import { FC, ReactNode, type CSSProperties } from 'react';
+import type { PopupAlignment } from '../../types/popup';
+import type { ITooltipItem } from '../../types/tooltip';
+export type TooltipProps = {
+    /**
+     * The alignment of the tooltip. By default, the tooltip will calculate the best alignment.
+     */
+    alignment?: PopupAlignment;
+    /**
+     * The elements that the tooltip should surround.
+     */
+    children: ReactNode;
+    /**
+     * The element where the content of the `Tooltip` should be rendered via React Portal.
+     */
+    container?: Element;
+    /**
+     * The content that should be displayed.
+     */
+    item: ITooltipItem | ReactNode;
+    /**
+     * The width of an item.
+     */
+    itemWidth?: CSSProperties['width'];
+    /**
+     * whether the tooltip should be shown.
+     */
+    isDisabled?: boolean;
+    /**
+     * The max width of the Tooltip.
+     */
+    maxItemWidth?: number;
+    /**
+     * Whether the tooltip should be hidden after the children is not hovered.
+     */
+    shouldHideOnChildrenLeave?: boolean;
+    /**
+     * Whether the width of the children should be used.
+     */
+    shouldUseChildrenWidth?: boolean;
+    /**
+     * Whether the tooltip children should use the full width.
+     */
+    shouldUseFullWidth?: boolean;
+    /**
+     * The Y offset of the tooltip to the children.
+     */
+    yOffset?: number;
+};
+declare const Tooltip: FC<TooltipProps>;
+export default Tooltip;

package/lib/types/components/tooltip/Tooltip.styles.d.ts

@@ -0,0 +1,9 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+export declare const StyledTooltip: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledTooltipChildrenProps = WithTheme<{
+    $isOnlyText: boolean;
+    $shouldUseChildrenWidth: boolean;
+    $shouldUseFullWidth: boolean;
+}>;
+export declare const StyledTooltipChildren: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTooltipChildrenProps>> & string;
+export {};

package/lib/types/components/tooltip/tooltip-item/TooltipItem.d.ts

@@ -0,0 +1,14 @@
+import { FC, type CSSProperties } from 'react';
+export type TooltipProps = {
+    headline?: string;
+    text: string;
+    imageUrl?: string;
+    button?: {
+        text: string;
+        onClick: () => void;
+    };
+    width?: CSSProperties['width'];
+    maxWidth?: number;
+};
+declare const TooltipItem: FC<TooltipProps>;
+export default TooltipItem;

package/lib/types/components/tooltip/tooltip-item/TooltipItem.styles.d.ts

@@ -0,0 +1,16 @@
+import type { CSSProperties } from 'react';
+import type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';
+type StyledTooltipItemProps = WithTheme<{
+    $width?: CSSProperties['width'];
+    $maxWidth?: number;
+}>;
+export declare const StyledTooltipItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTooltipItemProps>> & string;
+export declare const StyledTooltipItemHeadline: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {
+    theme: import("../../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string;
+export declare const StyledTooltipItemImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
+export declare const StyledTooltipItemButtonWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledTooltipItemText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {
+    theme: import("../../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string;
+export {};

package/lib/types/components/truncation/Truncation.d.ts

@@ -0,0 +1,34 @@
+import { FC, MouseEvent, ReactElement } from 'react';
+import { ClampPosition } from '../../types/truncation';
+export type TruncationProps = {
+    /**
+     * The elements that should be expanding or collapsing.
+     */
+    children: ReactElement;
+    /**
+     * The position of the clamp.
+     */
+    clampPosition?: ClampPosition;
+    /**
+     * The height of the children Element in it`s collapsed state.
+     */
+    collapsedHeight?: number;
+    /**
+     * If set to true, the content is exposed.
+     */
+    isOpen?: boolean;
+    /**
+     * A text that should be displayed if the content is expanded.
+     */
+    lessLabel?: string;
+    /**
+     * A text that should be displayed if the content is collapsed.
+     */
+    moreLabel?: string;
+    /**
+     * Function to be executed when the component is expanding or collapsing.
+     */
+    onChange?: (event: MouseEvent<HTMLAnchorElement>, isOpen: boolean) => void;
+};
+declare const Truncation: FC<TruncationProps>;
+export default Truncation;

package/lib/types/components/truncation/Truncation.styles.d.ts

@@ -0,0 +1,13 @@
+import { ClampPosition } from '../../types/truncation';
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+export declare const StyledTruncation: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledMotionTruncationContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("motion/react").HTMLMotionProps<"div">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}, never>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledTruncationPseudoContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledTruncationClampWrapperProps = WithTheme<{
+    $position: ClampPosition;
+}>;
+export declare const StyledTruncationClampWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTruncationClampWrapperProps>> & string;
+export declare const StyledTruncationClamp: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
+export {};

package/lib/types/components/verification-badge/VerificationBadge.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare const VerificationBadge: {
+    (): React.JSX.Element;
+    displayName: string;
+};
+export default VerificationBadge;

package/lib/types/components/verification-badge/VerificationBadge.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledVerificationBadge: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;