@chayns-components/core 5.0.0-beta.104 → 5.0.0-beta.1040

package/lib/types/components/number-input/NumberInput.d.ts

@@ -0,0 +1,58 @@
+import { FC } from 'react';
+export type NumberInputProps = {
+    /**
+     * Applies rules for decimal input.
+     * Enables the user to input one zero as number before the comma
+     */
+    isDecimalInput?: boolean;
+    /**
+     * Whether the input is disabled
+     */
+    isDisabled?: boolean;
+    /**
+     * Whether the value is invalid.
+     */
+    isInvalid?: boolean;
+    /**
+     * Applies rules for money input.
+     * Rules: only two decimal places, one zero before the comma
+     */
+    isMoneyInput?: boolean;
+    /**
+     * Whether the value should be formatted as a time.
+     */
+    isTimeInput?: boolean;
+    /**
+     * Limits the number to this value
+     */
+    maxNumber?: number;
+    /**
+     * Limits the number to this value
+     */
+    minNumber?: number;
+    /**
+     * Callback function that is called when the input gets out of focus
+     */
+    onBlur?: (newNumber: number | string | null, isInvalid: boolean) => void;
+    /**
+     * Callback function that is called when the input changes
+     * It will pass the text from the input
+     */
+    onChange?: (newValue: string) => void;
+    /**
+     * Placeholder for the input field
+     */
+    placeholder?: string;
+    /**
+     * Whether only the bottom border should be displayed
+     */
+    shouldShowOnlyBottomBorder?: boolean;
+    /**
+     * The value, that should be displayed in the input, when it is in focus.
+     * You can also pass a stringified number as default value.
+     * NOTE: If you pass a stringified number, it will be formatted to the selected format
+     */
+    value?: string;
+};
+declare const NumberInput: FC<NumberInputProps>;
+export default NumberInput;

package/lib/types/components/page-provider/PageProvider.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { type ColorSchemeProviderProps } from '../color-scheme-provider/ColorSchemeProvider';
+interface PageProviderProps extends ColorSchemeProviderProps {
+    /**
+     * Whether the padding should be removed.
+     */
+    shouldRemovePadding?: boolean;
+    /**
+     * Whether the usable height should be used.
+     */
+    shouldUseUsableHeight?: boolean;
+}
+declare const PageProvider: FC<PageProviderProps>;
+export default PageProvider;

package/lib/types/components/page-provider/PageProvider.styles.d.ts

@@ -0,0 +1,7 @@
+import type { CSSProperties } from 'react';
+type StyledPageProviderProps = {
+    $shouldUsePadding?: boolean;
+    $usableHeight?: CSSProperties['height'];
+};
+export declare const StyledPageProvider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledPageProviderProps>> & string;
+export {};

package/lib/types/components/popup/Popup.d.ts

@@ -0,0 +1,46 @@
+import React, { ReactNode } from 'react';
+import { PopupRef } from '../../types/popup';
+export type PopupProps = {
+    /**
+     * The element over which the content of the `ContextMenu` should be displayed.
+     */
+    children?: ReactNode;
+    /**
+     * The element where the content of the `Popup` should be rendered via React Portal.
+     */
+    container?: Element;
+    /**
+     * The content that should be displayed inside the popup.
+     */
+    content: ReactNode;
+    /**
+     * Function to be executed when the content of the Context menu has been hidden.
+     */
+    onHide?: VoidFunction;
+    /**
+     * Function to be executed when the content of the Context menu has been shown.
+     */
+    onShow?: VoidFunction;
+    /**
+     * Whether the tooltip should be hidden after the children is not hovered.
+     */
+    shouldHideOnChildrenLeave?: boolean;
+    /**
+     * Whether the popup should scroll with the content.
+     */
+    shouldScrollWithContent?: boolean;
+    /**
+     * Whether the popup should be opened on hover. If not, the popup will be opened on click.
+     */
+    shouldShowOnHover?: boolean;
+    /**
+     * Whether the width of the children should be used.
+     */
+    shouldUseChildrenWidth?: boolean;
+    /**
+     * The Y offset of the popup to the children.
+     */
+    yOffset?: number;
+};
+declare const Popup: React.ForwardRefExoticComponent<PopupProps & React.RefAttributes<PopupRef>>;
+export default Popup;

package/lib/types/components/popup/Popup.styles.d.ts

@@ -0,0 +1,9 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+type StyledPopupProps = WithTheme<{
+    $shouldUseChildrenWidth: boolean;
+}>;
+export declare const StyledPopup: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledPopupProps>> & string;
+export declare const StyledPopupPseudo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $menuHeight: number;
+}>> & string;
+export {};

package/lib/types/components/popup/popup-content/PopupContent.d.ts

@@ -0,0 +1,12 @@
+import React, { type ReactNode } from 'react';
+type PopupContentProps = {
+    /**
+     * The elements that should be displayed inside the popup content.
+     */
+    children?: ReactNode;
+};
+declare const PopupContent: {
+    ({ children }: PopupContentProps): React.JSX.Element;
+    displayName: string;
+};
+export default PopupContent;

package/lib/types/components/popup/popup-content/PopupContent.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledPopupContent: 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/popup/popup-content-wrapper/PopupContentWrapper.d.ts

@@ -0,0 +1,14 @@
+import React, { ReactNode, type MouseEventHandler } from 'react';
+import { PopupAlignment, PopupCoordinates } from '../../../types/popup';
+type PopupContentProps = {
+    alignment: PopupAlignment;
+    children: ReactNode;
+    offset: number;
+    coordinates: PopupCoordinates;
+    onMouseLeave: MouseEventHandler<HTMLSpanElement>;
+    onMouseEnter: MouseEventHandler<HTMLSpanElement>;
+    shouldScrollWithContent: boolean;
+    width: number;
+};
+declare const PopupContentWrapper: React.ForwardRefExoticComponent<PopupContentProps & React.RefAttributes<HTMLDivElement>>;
+export default PopupContentWrapper;

package/lib/types/components/popup/popup-content-wrapper/PopupContentWrapper.styles.d.ts

@@ -0,0 +1,13 @@
+import { ColorMode } from 'chayns-api';
+import { PopupAlignment } from '../../../types/popup';
+import type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';
+type StyledMotionPopupContentWrapperProps = WithTheme<{
+    $position: PopupAlignment;
+    $colorMode: ColorMode;
+    $offset: number;
+    $shouldScrollWithContent: boolean;
+}>;
+export declare const StyledMotionPopupContentWrapper: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, StyledMotionPopupContentWrapperProps>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export {};

package/lib/types/components/progress-bar/ProgressBar.d.ts

@@ -0,0 +1,17 @@
+import { FC } from 'react';
+export type ProgressBarProps = {
+    /**
+     * The label that should be displayed under the progressbar.
+     */
+    label?: string;
+    /**
+     * The percentage of the progress. Number between 0 and 100.
+     */
+    percentage?: number;
+    /**
+     * Whether the progress should be hide and just display the label.
+     */
+    shouldHideProgress?: boolean;
+};
+declare const ProgressBar: FC<ProgressBarProps>;
+export default ProgressBar;

package/lib/types/components/progress-bar/ProgressBar.styles.d.ts

@@ -0,0 +1,13 @@
+export declare const StyledProgressBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledProgressBarBackground: 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;
+export declare const StyledProgressBarProgressWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledMotionProgressBarProgress: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, {
+    theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledProgressBarLabel: 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;

package/lib/types/components/radio-button/RadioButton.d.ts

@@ -0,0 +1,29 @@
+import { FC, type ReactNode } from 'react';
+export type RadioButtonProps = {
+    /**
+     * The children that should be displayed after the RadioButton is checked.
+     */
+    children?: ReactNode;
+    /**
+     * whether the RadioButton should be shown.
+     */
+    isDisabled?: boolean;
+    /**
+     * The id of the radio button.
+     */
+    id: string;
+    /**
+     * The label that should be displayed next to the radio button.
+     */
+    label?: ReactNode;
+    /**
+     * An element that should be displayed on the right side of the label.
+     */
+    rightElement?: ReactNode;
+    /**
+     * Whether the rightElement should only be displayed when the RadioButton is checked
+     */
+    shouldShowRightElementOnlyOnChecked?: boolean;
+};
+declare const RadioButton: FC<RadioButtonProps>;
+export default RadioButton;

package/lib/types/components/radio-button/RadioButton.styles.d.ts

@@ -0,0 +1,34 @@
+import { RadioButtonRightElementMargin } from '../../types/radioButton';
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+type StyledRadioButtonProps = WithTheme<{
+    $isDisabled: boolean;
+    $radioButtonRightElementMargin: RadioButtonRightElementMargin;
+}>;
+export declare const StyledRadioButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledRadioButtonProps>> & string;
+export declare const StyledRadioButtonWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledRadioButtonCheckBoxProps = WithTheme<{
+    $isDisabled: boolean;
+}>;
+export declare const StyledRadioButtonCheckBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, StyledRadioButtonCheckBoxProps>> & string;
+type StyledRadioButtonPseudoCheckBoxProps = WithTheme<{
+    $isChecked: boolean;
+    $isDisabled: boolean;
+}>;
+export declare const StyledRadioButtonPseudoCheckBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledRadioButtonPseudoCheckBoxProps>> & string;
+type StyledRadioButtonCheckBoxMarkProps = WithTheme<{
+    $isHovered: boolean;
+    $isSelected: boolean;
+    $isDisabled: boolean;
+}>;
+export declare const StyledRadioButtonCheckBoxMark: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledRadioButtonCheckBoxMarkProps>> & string;
+type StyledRadioButtonLabelProps = WithTheme<{
+    $isDisabled: boolean;
+}>;
+export declare const StyledRadioButtonLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, StyledRadioButtonLabelProps>> & string;
+export declare const StyledLabelWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledMotionRadioButtonChildren: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, {
+    theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export {};

package/lib/types/components/radio-button/radio-button-group/RadioButtonGroup.d.ts

@@ -0,0 +1,39 @@
+import React, { ReactNode } from 'react';
+type IUpdateSelectedRadioButtonId = (id: string | undefined) => void;
+type IUpdateHasRightElement = (id: string, hasRightElement: boolean) => void;
+type IRadioButtonRightElements = {
+    id: string;
+    hasRightElement: boolean;
+}[];
+interface IRadioButtonGroupContext {
+    selectedRadioButtonId: string | undefined;
+    updateSelectedRadioButtonId?: IUpdateSelectedRadioButtonId;
+    radioButtonRightElements: IRadioButtonRightElements;
+    updateHasRightElement?: IUpdateHasRightElement;
+    radioButtonsCanBeUnchecked?: boolean;
+}
+export declare const RadioButtonGroupContext: React.Context<IRadioButtonGroupContext>;
+export type RadioButtonGroupRef = {
+    updateSelectedRadioButtonId: IUpdateSelectedRadioButtonId;
+};
+export type RadioButtonGroupProps = {
+    /**
+     * Whether the RadioButtons can be unchecked.
+     */
+    canUncheckRadioButtons?: boolean;
+    /**
+     * The RadioButtons that should be grouped. Radio buttons with the same group are
+     * automatically unchecked when an `RadioButton` of the group is checked.
+     */
+    children: ReactNode;
+    /**
+     * Function to be executed when an id is selected.
+     */
+    onSelect?: (id?: string) => void;
+    /**
+     * The id of the current selected RadioButton.
+     */
+    selectedId?: string;
+};
+declare const RadioButtonGroup: React.ForwardRefExoticComponent<RadioButtonGroupProps & React.RefAttributes<RadioButtonGroupRef>>;
+export default RadioButtonGroup;

package/lib/types/components/scroll-view/ScrollView.d.ts

@@ -0,0 +1,33 @@
+import React, { CSSProperties, ReactNode } from 'react';
+export type ScrollViewProps = {
+    /**
+     * The elements that should be shown inside the scrollview
+     */
+    children: ReactNode;
+    /**
+     * The maximum height of the scroll view.
+     */
+    maxHeight?: CSSProperties['height'] | null;
+    /**
+     * The height of the scroll view.
+     */
+    height?: CSSProperties['height'];
+    /**
+     * The maximum width of the scroll view.
+     */
+    maxWidth?: CSSProperties['width'];
+    /**
+     * The width of the scroll view.
+     */
+    width?: CSSProperties['width'];
+    /**
+     * The overflow-x style of the scroll view.
+     */
+    overflowX?: 'scroll' | 'auto';
+    /**
+     * The overflow-y style of the scroll view.
+     */
+    overflowY?: 'scroll' | 'auto';
+};
+declare const ScrollView: React.ForwardRefExoticComponent<ScrollViewProps & React.RefAttributes<HTMLDivElement>>;
+export default ScrollView;

package/lib/types/components/scroll-view/ScrollView.styles.d.ts

@@ -0,0 +1,14 @@
+import type { CSSProperties } from 'react';
+import { BrowserName } from '../../types/chayns';
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+type StyledScrollViewProps = WithTheme<{
+    $maxHeight?: CSSProperties['height'] | null;
+    $height?: CSSProperties['height'];
+    $maxWidth?: CSSProperties['width'];
+    $width?: CSSProperties['width'];
+    $overflowX: 'scroll' | 'auto';
+    $overflowY: 'scroll' | 'auto';
+    $browser: BrowserName;
+}>;
+export declare const StyledScrollView: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledScrollViewProps>> & string;
+export {};

package/lib/types/components/search-box/SearchBox.d.ts

@@ -0,0 +1,77 @@
+import { ChangeEventHandler, FC, FocusEventHandler, KeyboardEventHandler } from 'react';
+import type { ISearchBoxItem, ISearchBoxItems } from '../../types/searchBox';
+export type SearchBoxRef = {
+    clear: VoidFunction;
+};
+export type SearchBoxProps = {
+    /**
+     * The element where the content of the `ComboBox` should be rendered via React Portal.
+     */
+    container?: Element;
+    /**
+     * If true, the input field is marked as invalid
+     */
+    isInvalid?: boolean;
+    /**
+     * An optional icon that is displayed inside the left side of the input.
+     */
+    leftIcons?: string[];
+    /**
+     * List of groups with items that can be searched. It is possible to give only one list; if multiple lists are provided, the 'group name' parameter becomes mandatory.
+     */
+    lists: ISearchBoxItems[];
+    /**
+     * The placeholder that should be displayed.
+     */
+    placeholder?: string;
+    /**
+     * Function to be executed when the input lost focus.
+     */
+    onBlur?: FocusEventHandler<HTMLInputElement>;
+    /**
+     * Function to be executed when the input is changed.
+     */
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+    /**
+     * Function that is executed when a letter is pressed
+     */
+    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
+    /**
+     * Function to be executed when an item is selected.
+     */
+    onSelect?: (item: ISearchBoxItem) => void;
+    /**
+     * Control the selected item. If you use this prop, make sure to update it when the user selects an item.
+     */
+    selectedId?: string;
+    /**
+     * If true, the value in the Input is displayed in the list.
+     */
+    shouldAddInputToList: boolean;
+    /**
+     * If true, the filter buttons are hidden.
+     */
+    shouldHideFilterButtons?: boolean;
+    /**
+     * Whether the full list of items should be displayed if the input is empty.
+     */
+    shouldShowContentOnEmptyInput?: boolean;
+    /**
+     * If true, the images of the items are displayed in a round shape.
+     */
+    shouldShowRoundImage?: boolean;
+    /**
+     * Whether the icon to open and close the list should be displayed.
+     */
+    shouldShowToggleIcon?: boolean;
+    /**
+     * An optional callback function to filter the elements to be displayed
+     */
+    customFilter?: (item: ISearchBoxItem) => boolean;
+    /**
+     * Set an input for the search box - it is not an item of a list, just a string.
+     */
+    presetValue?: string;
+};
+declare const SearchBox: FC<SearchBoxProps>;
+export default SearchBox;

package/lib/types/components/search-box/SearchBox.styles.d.ts

@@ -0,0 +1,14 @@
+import { BrowserName } from '../../types/chayns';
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+export declare const StyledSearchBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledMotionSearchBoxBodyProps = WithTheme<{
+    $height: number;
+    $width: number;
+    $browser: BrowserName;
+}>;
+export declare const StyledMotionSearchBoxBody: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, StyledMotionSearchBoxBodyProps>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledSearchBoxIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledSearchBoxLeftWrapper: 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/search-box/group-name/GroupName.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+export type GroupNameProps = {
+    name: string;
+};
+declare const GroupName: FC<GroupNameProps>;
+export default GroupName;

package/lib/types/components/search-box/group-name/GroupName.styles.d.ts

@@ -0,0 +1,6 @@
+import type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';
+type StyledGroupNameProps = WithTheme<{
+    $groupName?: string;
+}>;
+export declare const StyledGroupName: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledGroupNameProps>> & string;
+export {};

package/lib/types/components/search-box/search-box-body/SearchBoxBody.d.ts

@@ -0,0 +1,19 @@
+import React, { type ReactNode } from 'react';
+import { BrowserName } from '../../../types/chayns';
+import type { IFilterButtonItem } from '../../../types/filterButtons';
+export type SearchBoxBodyProps = {
+    children: ReactNode;
+    filterButtons?: IFilterButtonItem[];
+    selectedGroups?: string[];
+    height: number;
+    width: number;
+    browser: BrowserName;
+    onGroupSelect?: (keys: string[]) => void;
+    coordinates: {
+        x: number;
+        y: number;
+    };
+    shouldHideFilterButtons?: boolean;
+};
+declare const SearchBoxBody: React.ForwardRefExoticComponent<SearchBoxBodyProps & React.RefAttributes<HTMLDivElement>>;
+export default SearchBoxBody;

package/lib/types/components/search-box/search-box-body/SearchBoxBody.styles.d.ts

@@ -0,0 +1,23 @@
+import { BrowserName } from '../../../types/chayns';
+import type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';
+type StyledMotionSearchBoxBodyProps = WithTheme<{
+    $width: number;
+}>;
+export declare const StyledMotionSearchBoxBody: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, StyledMotionSearchBoxBodyProps>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledSearchBoxBodyHead: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSearchBoxHeadProps>> & string;
+type StyledSearchBoxHeadProps = WithTheme<{
+    $hasScrolled: boolean;
+    $hasGroupName: boolean;
+}>;
+export declare const StyledSearchBoxBodyHeadGroupName: 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 StyledSearchBoxBodyContentProps = WithTheme<{
+    $height: number;
+    $headHeight: number;
+    $browser: BrowserName;
+}>;
+export declare const StyledSearchBoxBodyContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSearchBoxBodyContentProps>> & string;
+export {};

package/lib/types/components/search-box/search-box-item/SearchBoxItem.d.ts

@@ -0,0 +1,12 @@
+import { FC } from 'react';
+import type { ISearchBoxItem, ISearchBoxItems } from '../../../types/searchBox';
+export type SearchBoxItemProps = {
+    onSelect: (item: ISearchBoxItem, groupName?: ISearchBoxItems['groupName']) => void;
+    id: ISearchBoxItem['id'];
+    text: ISearchBoxItem['text'];
+    imageUrl?: ISearchBoxItem['imageUrl'];
+    shouldShowRoundImage?: boolean;
+    groupName?: ISearchBoxItems['groupName'];
+};
+declare const SearchBoxItem: FC<SearchBoxItemProps>;
+export default SearchBoxItem;

package/lib/types/components/search-box/search-box-item/SearchBoxItem.styles.d.ts

@@ -0,0 +1,12 @@
+import type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';
+export declare const StyledSearchBoxItem: 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 StyledSearchBoxItemImageProps = WithTheme<{
+    $shouldShowRoundImage?: boolean;
+}>;
+export declare const StyledSearchBoxItemImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, StyledSearchBoxItemImageProps>> & string;
+export declare const StyledSearchBoxItemText: 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/search-input/SearchInput.d.ts

@@ -0,0 +1,46 @@
+import React, { ChangeEventHandler, CSSProperties, FC } from 'react';
+import { InputSize } from '../input/Input';
+export type SearchInputProps = {
+    /**
+     * Color of the icon
+     */
+    iconColor?: CSSProperties['color'];
+    /**
+     * Force the active state of the input and override the internal state
+     */
+    isActive?: boolean;
+    /**
+     * Function that is executed when the active state of the input changes
+     */
+    onActiveChange?: (isActive: boolean) => void;
+    /**
+     * Function that is executed when the text of the input changes
+     */
+    onChange: ChangeEventHandler<HTMLInputElement>;
+    /**
+     * Function that is executed when a key is pressed
+     */
+    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    /**
+     * Placeholder for the input field
+     */
+    placeholder?: string;
+    /**
+     * Whether the SearchInput should be positioned absolute.
+     */
+    shouldUseAbsolutePositioning?: boolean;
+    /**
+     * The size of the input field
+     */
+    size?: InputSize;
+    /**
+     * Value if the input field should be controlled
+     */
+    value?: string;
+    /**
+     * The width of the parent.
+     */
+    width?: number;
+};
+declare const SearchInput: FC<SearchInputProps>;
+export default SearchInput;

package/lib/types/components/search-input/SearchInput.styles.d.ts

@@ -0,0 +1,21 @@
+import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
+import type { InputSize } from '../input/Input';
+type StyledSearchInputProps = WithTheme<{
+    $size: InputSize;
+    $shouldUseAbsolutePositioning: boolean;
+}>;
+export declare const StyledSearchInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSearchInputProps>> & string;
+export declare const StyledSearchInputPseudoElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type StyledMotionSearchInputContentWrapperProps = {
+    $shouldUseAbsolutePositioning: boolean;
+};
+export declare const StyledMotionSearchInputContentWrapper: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, StyledMotionSearchInputContentWrapperProps>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledMotionSearchInputIconWrapperContent: 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?: ((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]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, {
+    theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
+}>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledMotionSearchInputIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export {};