@minimalstuff/ui 0.0.14 → 0.0.17

package/dist/index.d.ts

@@ -1,11 +1,25 @@
+/// <reference types="react" />
+
+import { AnchorHTMLAttributes } from 'react';
 import { ButtonHTMLAttributes } from 'react';
+import { ClassAttributes } from 'react';
 import { Context } from 'react';
+import { CSSProperties } from 'react';
 import { DetailedHTMLProps } from 'react';
 import { ElementType } from 'react';
+import { FormatOptionLabelMeta } from 'react-select';
+import { FormHTMLAttributes } from 'react';
+import { GroupBase } from 'react-select';
 import { HTMLAttributes } from 'react';
+import { IconType } from 'react-icons/lib';
+import { ImgHTMLAttributes } from 'react';
+import { InputHTMLAttributes } from 'react';
 import { JSX as JSX_2 } from 'react';
 import { JSX as JSX_3 } from '@emotion/react/jsx-runtime';
+import { LiHTMLAttributes } from 'react';
+import { OptionsOrGroups } from 'react-select';
 import { PropsWithChildren } from 'react';
+import { ReactNode } from 'react';
 import { StyledComponent } from '@emotion/styled';
 import { Theme } from '@emotion/react';
 
@@ -25,43 +39,158 @@ declare type ButtonProps = {
     secondary?: boolean;
 };
 
-export declare type Colors = typeof lightThemeColors;
+export declare function Checkbox({ name, label, checked, errors, onChange, required, ...props }: InputProps): JSX.Element;
 
-declare type FontSizes = {
-    [key in SizeType]: string;
+export declare type Colors = {
+    font: string;
+    background: string;
+    secondary: string;
+    black: string;
+    white: string;
+    grey: FadedColor;
+    blue: FadedColor;
+    green: FadedColor;
+    red: FadedColor;
+    yellow: FadedColor;
+    boxShadow: string;
 };
 
-declare const lightThemeColors = {
-    font: '#333',
-    background: '#f0eef6',
-    primary: primaryColor,
-    secondary: '#fff',
+export declare function Dropdown({ children, label, className, svgSize, }: DropdownProps): JSX_3.Element;
 
-    black: '#333',
-    white: '#ffffff',
+export declare const DropdownContainer: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+} & ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
+theme?: Theme | undefined;
+} & {
+show: boolean;
+}, {}, {}>;
+
+export declare const DropdownItemButton: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+} & {
+danger?: boolean | undefined;
+} & ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
+theme?: Theme | undefined;
+}, {}, {}>;
 
-    lightGrey: '#dadce0',
-    grey: '#777777',
+export declare const DropdownItemLink: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+} & {
+danger?: boolean | undefined;
+} & ClassAttributes<HTMLAnchorElement> & AnchorHTMLAttributes<HTMLAnchorElement> & {
+theme?: Theme | undefined;
+}, {}, {}>;
 
-    lightestBlue,
-    lightBlue,
-    blue: primaryColor,
-    darkBlue,
-    darkestBlue,
+export declare const DropdownLabel: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
-    green: 'green',
+declare interface DropdownProps {
+    children: ReactNode;
+    label: ReactNode | string;
+    className?: string;
+    svgSize?: number;
+}
 
-    lightRed,
+export declare function ExternalLink({ children, title, ...props }: AnchorHTMLAttributes<HTMLAnchorElement> & PropsWithChildren & {
+    style?: CSSProperties;
+    title?: string;
+    className?: string;
+}): JSX_3.Element;
 
-    yellow: '#FF8A08',
+export declare type FadedColor = {
+    lightest: string;
+    light: string;
+    default: string;
+    dark: string;
+    darkest: string;
+};
 
-    boxShadow: `0 0 1em 0 ${rgba('#aaa', 0.4)}`,
+declare type FontSizes = {
+    [key in SizeType]: string;
 };
 
+export declare const Form: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, {}>;
+
+declare interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
+    label: string;
+    name: string;
+    checked: boolean;
+    errors?: string[];
+    onChange?: (name: string, checked: boolean) => void;
+}
+
+declare interface InputProps_2 extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
+    label: string;
+    name: string;
+    value?: string;
+    errors?: string[];
+    onChange?: (name: string, value: string) => void;
+}
+
 declare type Medias = {
     [key in ScreenType]: string;
 };
 
+export declare function Modal({ title, children, opened, hideCloseBtn, className, close, }: ModalProps): false | JSX_3.Element;
+
+export declare const ModalBody: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+export declare const ModalCloseBtn: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+
+export declare const ModalContainer: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+} & ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
+theme?: Theme | undefined;
+}, {}, {}>;
+
+export declare const ModalHeader: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+
+declare interface ModalProps {
+    title?: string;
+    children: ReactNode;
+    opened: boolean;
+    hideCloseBtn?: boolean;
+    className?: string;
+    close: () => void;
+}
+
+export declare const ModalWrapper: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+declare type Option_2 = {
+    label: string | number;
+    value: string | number;
+};
+
+export declare const RoundedImage: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+} & RoundedImageProps, DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+
+declare interface RoundedImageProps {
+    size?: number;
+}
+
 declare type ScreenType =
 | 'mobile'
 | 'tablet'
@@ -70,10 +199,57 @@ declare type ScreenType =
 | 'large_desktop'
 | 'xlarge_desktop';
 
+export declare function Selector({ name, label, value, options, onChangeCallback, formatOptionLabel, required, ...props }: SelectorProps): JSX.Element;
+
+declare interface SelectorProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
+    label: string;
+    name: string;
+    errors?: string[];
+    options: OptionsOrGroups<Option_2, GroupBase<Option_2>>;
+    value: number | string;
+    onChangeCallback?: (value: number | string) => void;
+    formatOptionLabel?: (data: Option_2, formatOptionLabelMeta: FormatOptionLabelMeta<Option_2>) => ReactNode;
+}
+
 declare type SizeType = 'xs' | 's' | 'm' | 'l' | 'xl';
 
 declare type SpeedType = 'fast' | 'normal' | 'slow';
 
+export declare function StyleReset(): JSX_3.Element;
+
+export declare interface Tab {
+    title: string;
+    content: ReactNode;
+    icon?: IconType;
+    danger?: boolean;
+}
+
+export declare const TabItem: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+} & {
+active?: boolean | undefined;
+danger?: boolean | undefined;
+}, DetailedHTMLProps<LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {}>;
+
+export declare const TabList: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {}>;
+
+export declare const TabPanel: StyledComponent<    {
+theme?: Theme | undefined;
+as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+export declare function Tabs({ tabs }: TabsProps): JSX_3.Element;
+
+export declare interface TabsProps {
+    tabs: Tab[];
+}
+
+export declare function Textbox({ name, label, value, errors, onChange, required, ...props }: InputProps_2): JSX.Element;
+
 export declare const TextEllipsis: StyledComponent<    {
 theme?: Theme | undefined;
 as?: ElementType<any, keyof JSX_2.IntrinsicElements> | undefined;
@@ -88,8 +264,7 @@ isDarkTheme: boolean;
 toggleDarkTheme: (_value: boolean) => void;
 }>;
 
-export declare function ThemeContextProvider({ preferDarkTheme, children, onPreferenceChange, }: {
-    preferDarkTheme?: boolean;
+export declare function ThemeContextProvider({ children, onPreferenceChange, }: {
     onPreferenceChange?: (isDarkTheme: boolean) => void;
 } & PropsWithChildren): JSX_3.Element;