@geoinsight/react-components 0.6.11 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/types/components/accordion/accordion-button.d.ts +4 -0
- package/dist/cjs/types/components/accordion/accordion-content.d.ts +4 -0
- package/dist/cjs/types/components/accordion/accordion-item.d.ts +4 -0
- package/dist/cjs/types/components/accordion/accordion.d.ts +4 -0
- package/dist/cjs/types/components/accordion/index.d.ts +4 -0
- package/dist/cjs/types/components/accordion/index.stories.d.ts +6 -0
- package/dist/cjs/types/components/accordion/index.types.d.ts +34 -0
- package/dist/cjs/types/components/button/index.d.ts +5 -0
- package/dist/cjs/types/components/button/index.stories.d.ts +7 -0
- package/dist/cjs/types/components/button/index.types.d.ts +41 -0
- package/dist/cjs/types/components/form/FormInput.d.ts +4 -0
- package/dist/cjs/types/components/form/FormSelect.d.ts +4 -0
- package/dist/cjs/types/components/form/FormTextArea.d.ts +4 -0
- package/dist/cjs/types/components/form/index.d.ts +4 -0
- package/dist/cjs/types/components/form/index.stories.d.ts +7 -0
- package/dist/cjs/types/components/form/index.types.d.ts +45 -0
- package/dist/cjs/types/components/input/index.d.ts +4 -0
- package/dist/cjs/types/components/input/index.stories.d.ts +8 -0
- package/dist/cjs/types/components/input/index.types.d.ts +40 -0
- package/dist/cjs/types/components/loading/index.d.ts +4 -0
- package/dist/cjs/types/components/loading/index.stories.d.ts +6 -0
- package/dist/cjs/types/components/loading/index.types.d.ts +11 -0
- package/dist/cjs/types/components/modal/index.d.ts +4 -0
- package/dist/cjs/types/components/modal/index.stories.d.ts +6 -0
- package/dist/cjs/types/components/modal/index.types.d.ts +31 -0
- package/dist/cjs/types/components/select/index.d.ts +4 -0
- package/dist/cjs/types/components/select/index.stories.d.ts +7 -0
- package/dist/cjs/types/components/select/index.types.d.ts +30 -0
- package/dist/cjs/types/components/text-area/index.d.ts +5 -0
- package/dist/cjs/types/components/text-area/index.stories.d.ts +7 -0
- package/dist/cjs/types/components/text-area/index.types.d.ts +37 -0
- package/dist/cjs/types/context/accordion/index.d.ts +10 -0
- package/dist/cjs/types/context/loading/index.d.ts +24 -0
- package/dist/cjs/types/context/loading/index.stories.d.ts +8 -0
- package/dist/cjs/types/context/modal/index.d.ts +25 -0
- package/dist/cjs/types/context/modal/index.stories.d.ts +6 -0
- package/dist/cjs/types/context/theme/index.d.ts +18 -0
- package/dist/cjs/types/decorators/withColorScheme.d.ts +7 -0
- package/dist/cjs/types/decorators/withLoading.d.ts +2 -0
- package/dist/cjs/types/decorators/withModal.d.ts +2 -0
- package/dist/cjs/types/decorators/withWrapper.d.ts +2 -0
- package/dist/cjs/types/index.d.ts +15 -0
- package/dist/cjs/types/utils/palette.d.ts +1 -0
- package/dist/cjs/types/utils/recursive.d.ts +6 -0
- package/dist/esm/types/components/accordion/accordion-button.d.ts +4 -0
- package/dist/esm/types/components/accordion/accordion-content.d.ts +4 -0
- package/dist/esm/types/components/accordion/accordion-item.d.ts +4 -0
- package/dist/esm/types/components/accordion/accordion.d.ts +4 -0
- package/dist/esm/types/components/accordion/index.d.ts +4 -0
- package/dist/esm/types/components/accordion/index.stories.d.ts +6 -0
- package/dist/esm/types/components/accordion/index.types.d.ts +34 -0
- package/dist/esm/types/components/button/index.d.ts +5 -0
- package/dist/esm/types/components/button/index.stories.d.ts +7 -0
- package/dist/esm/types/components/button/index.types.d.ts +41 -0
- package/dist/esm/types/components/form/FormInput.d.ts +4 -0
- package/dist/esm/types/components/form/FormSelect.d.ts +4 -0
- package/dist/esm/types/components/form/FormTextArea.d.ts +4 -0
- package/dist/esm/types/components/form/index.d.ts +4 -0
- package/dist/esm/types/components/form/index.stories.d.ts +7 -0
- package/dist/esm/types/components/form/index.types.d.ts +45 -0
- package/dist/esm/types/components/input/index.d.ts +4 -0
- package/dist/esm/types/components/input/index.stories.d.ts +8 -0
- package/dist/esm/types/components/input/index.types.d.ts +40 -0
- package/dist/esm/types/components/loading/index.d.ts +4 -0
- package/dist/esm/types/components/loading/index.stories.d.ts +6 -0
- package/dist/esm/types/components/loading/index.types.d.ts +11 -0
- package/dist/esm/types/components/modal/index.d.ts +4 -0
- package/dist/esm/types/components/modal/index.stories.d.ts +6 -0
- package/dist/esm/types/components/modal/index.types.d.ts +31 -0
- package/dist/esm/types/components/select/index.d.ts +4 -0
- package/dist/esm/types/components/select/index.stories.d.ts +7 -0
- package/dist/esm/types/components/select/index.types.d.ts +30 -0
- package/dist/esm/types/components/text-area/index.d.ts +5 -0
- package/dist/esm/types/components/text-area/index.stories.d.ts +7 -0
- package/dist/esm/types/components/text-area/index.types.d.ts +37 -0
- package/dist/esm/types/context/accordion/index.d.ts +10 -0
- package/dist/esm/types/context/loading/index.d.ts +24 -0
- package/dist/esm/types/context/loading/index.stories.d.ts +8 -0
- package/dist/esm/types/context/modal/index.d.ts +25 -0
- package/dist/esm/types/context/modal/index.stories.d.ts +6 -0
- package/dist/esm/types/context/theme/index.d.ts +18 -0
- package/dist/esm/types/decorators/withColorScheme.d.ts +7 -0
- package/dist/esm/types/decorators/withLoading.d.ts +2 -0
- package/dist/esm/types/decorators/withModal.d.ts +2 -0
- package/dist/esm/types/decorators/withWrapper.d.ts +2 -0
- package/dist/esm/types/index.d.ts +15 -0
- package/dist/esm/types/utils/palette.d.ts +1 -0
- package/dist/esm/types/utils/recursive.d.ts +6 -0
- package/package.json +1 -1
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import "./index.css";
|
|
2
|
+
import { AccordionContent as AccordionContentProps } from "./index.types";
|
|
3
|
+
export declare const AccordionContent: ({ children, label, toggle, }: AccordionContentProps) => false | "" | import("react/jsx-runtime").JSX.Element | undefined;
|
|
4
|
+
export default AccordionContent;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { ReactNode } from "react";
|
|
2
|
+
import { ButtonAsButton, ButtonAsLink } from "../button/index.types";
|
|
3
|
+
export interface Accordion {
|
|
4
|
+
/**
|
|
5
|
+
* Accordion children
|
|
6
|
+
*/
|
|
7
|
+
children: ReactNode | ReactNode[];
|
|
8
|
+
/**
|
|
9
|
+
* Expand all items
|
|
10
|
+
*/
|
|
11
|
+
expanded: "all" | "none" | "custom";
|
|
12
|
+
}
|
|
13
|
+
export interface ToggleArray {
|
|
14
|
+
[key: string]: {
|
|
15
|
+
depth: number;
|
|
16
|
+
isToggle: boolean;
|
|
17
|
+
paddingLeft?: string;
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
export interface AccordionItem {
|
|
21
|
+
children: ReactNode | ReactNode[];
|
|
22
|
+
label?: string;
|
|
23
|
+
isExpanded?: boolean;
|
|
24
|
+
}
|
|
25
|
+
export type AccordionButton = ButtonAsButton & ButtonAsLink & {
|
|
26
|
+
is?: "button" | "link";
|
|
27
|
+
label?: string;
|
|
28
|
+
toggle?: ToggleArray;
|
|
29
|
+
};
|
|
30
|
+
export interface AccordionContent {
|
|
31
|
+
children: ReactNode | ReactNode[];
|
|
32
|
+
label?: string;
|
|
33
|
+
toggle?: ToggleArray;
|
|
34
|
+
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ButtonAsButton, ButtonAsLink } from "./index.types";
|
|
3
|
+
import "./index.css";
|
|
4
|
+
export declare function Button({ children, className, icon, isNewWindow, mode, size, as, CustomAnchor, ...rest }: ButtonAsButton | ButtonAsLink): JSX.Element;
|
|
5
|
+
export default Button;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { StoryObj, Meta } from "@storybook/react";
|
|
2
|
+
import { Button } from "./index";
|
|
3
|
+
declare const meta: Meta<typeof Button>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Button>;
|
|
6
|
+
export declare const Primary: Story;
|
|
7
|
+
export declare const Secondary: Story;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
type Mode = "primary" | "secondary" | "icon";
|
|
3
|
+
type Size = "small" | "medium" | "large";
|
|
4
|
+
export type ButtonAsButton = Base & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof Base> & {
|
|
5
|
+
as?: "button";
|
|
6
|
+
};
|
|
7
|
+
export type ButtonAsLink = Base & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof Base> & {
|
|
8
|
+
as?: "link";
|
|
9
|
+
};
|
|
10
|
+
export interface Base {
|
|
11
|
+
/**
|
|
12
|
+
* What to put inside the button (string or html elements)
|
|
13
|
+
*/
|
|
14
|
+
children?: JSX.Element | string;
|
|
15
|
+
/**
|
|
16
|
+
* Custom css class name
|
|
17
|
+
*/
|
|
18
|
+
className?: string;
|
|
19
|
+
/**
|
|
20
|
+
* If you want to add an icon image next to the children. Needs to be an react html element.
|
|
21
|
+
*/
|
|
22
|
+
icon?: JSX.Element;
|
|
23
|
+
/**
|
|
24
|
+
* If you want to open a new window on the browser when you click the button. Only applies to html anchor elements.
|
|
25
|
+
*/
|
|
26
|
+
isNewWindow?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Css mode used to style the button.
|
|
29
|
+
*/
|
|
30
|
+
mode?: Mode;
|
|
31
|
+
/**
|
|
32
|
+
* Button size.
|
|
33
|
+
*/
|
|
34
|
+
size?: Size;
|
|
35
|
+
/**
|
|
36
|
+
* Button type.
|
|
37
|
+
*/
|
|
38
|
+
as?: "button" | "link";
|
|
39
|
+
CustomAnchor?: React.ComponentClass<any>;
|
|
40
|
+
}
|
|
41
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Form } from "./index";
|
|
3
|
+
declare const meta: Meta<typeof Form>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Form>;
|
|
6
|
+
export declare const InsertForm: Story;
|
|
7
|
+
export declare const UpdateForm: Story;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { Dispatch, JSXElementConstructor, ReactElement, ReactNode, SetStateAction } from "react";
|
|
2
|
+
import { FieldError, FieldErrorsImpl, FieldValues, FormState, Merge } from "react-hook-form";
|
|
3
|
+
import { Input } from "../input/index.types";
|
|
4
|
+
import { TextArea } from "../text-area/index.types";
|
|
5
|
+
import { Select } from "../select/index.types";
|
|
6
|
+
export interface Form {
|
|
7
|
+
/**
|
|
8
|
+
* Custom css class name.
|
|
9
|
+
*/
|
|
10
|
+
className?: string;
|
|
11
|
+
children?: ReactNode | ReactNode[];
|
|
12
|
+
onSubmit: (data: FieldValues, setResult: SetResult) => void;
|
|
13
|
+
submitButton?: {
|
|
14
|
+
label: string;
|
|
15
|
+
};
|
|
16
|
+
initialState?: FormState<FieldValues>;
|
|
17
|
+
}
|
|
18
|
+
export interface ReactNodeControlled extends ReactElement<any, string | JSXElementConstructor<any>> {
|
|
19
|
+
props: ControlledInput;
|
|
20
|
+
}
|
|
21
|
+
export type ControlledInput = Input & TextArea & {
|
|
22
|
+
name: string;
|
|
23
|
+
error: string;
|
|
24
|
+
};
|
|
25
|
+
export type SetResult = Dispatch<SetStateAction<{
|
|
26
|
+
message?: string;
|
|
27
|
+
isSuccess: boolean;
|
|
28
|
+
}>>;
|
|
29
|
+
export interface FormInputs extends Input {
|
|
30
|
+
name: string;
|
|
31
|
+
isRequired?: boolean;
|
|
32
|
+
error?: {
|
|
33
|
+
message?: string | false | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined;
|
|
34
|
+
is?: boolean;
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
export interface FormSelect extends Select {
|
|
38
|
+
name: string;
|
|
39
|
+
isRequired?: boolean;
|
|
40
|
+
error?: {
|
|
41
|
+
message?: string | false | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined;
|
|
42
|
+
is?: boolean;
|
|
43
|
+
};
|
|
44
|
+
fieldsToReset?: string[];
|
|
45
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { Input as InputProps } from "./index.types";
|
|
2
|
+
import "./index.css";
|
|
3
|
+
export declare function Input({ inputClassName, classNameGroup, error, inputRef, styleGroup, placeholder, label, labelClass, icon, ...rest }: InputProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default Input;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Input } from "./index";
|
|
3
|
+
declare const meta: Meta<typeof Input>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Input>;
|
|
6
|
+
export declare const Primary: Story;
|
|
7
|
+
export declare const Error: Story;
|
|
8
|
+
export declare const Search: Story;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { dataTheme } from "data-theme";
|
|
2
|
+
import { CSSProperties, ReactNode, Ref } from "react";
|
|
3
|
+
import { FieldError, FieldErrorsImpl, Merge } from "react-hook-form";
|
|
4
|
+
export interface Input extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
5
|
+
/**
|
|
6
|
+
* Custom css class name.
|
|
7
|
+
*/
|
|
8
|
+
inputClassName?: string;
|
|
9
|
+
/**
|
|
10
|
+
* Custom css class name for group wrapper.
|
|
11
|
+
*/
|
|
12
|
+
classNameGroup?: string;
|
|
13
|
+
/**
|
|
14
|
+
* Data theme for the html. `${themes}`
|
|
15
|
+
*/
|
|
16
|
+
paletteTheme?: dataTheme;
|
|
17
|
+
/**
|
|
18
|
+
* Error message to show when input has an error.
|
|
19
|
+
*/
|
|
20
|
+
error?: {
|
|
21
|
+
message?: string | false | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined;
|
|
22
|
+
is?: boolean;
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* Ref react elemnt to use
|
|
26
|
+
*/
|
|
27
|
+
inputRef?: Ref<HTMLInputElement>;
|
|
28
|
+
/**
|
|
29
|
+
* Style input group wrapper
|
|
30
|
+
*/
|
|
31
|
+
styleGroup?: CSSProperties;
|
|
32
|
+
isRequired?: boolean;
|
|
33
|
+
label?: string;
|
|
34
|
+
labelClass?: string;
|
|
35
|
+
icon?: {
|
|
36
|
+
className?: string;
|
|
37
|
+
element?: ReactNode;
|
|
38
|
+
position?: "right" | "left";
|
|
39
|
+
};
|
|
40
|
+
}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface Modal {
|
|
3
|
+
/**
|
|
4
|
+
* Children
|
|
5
|
+
*/
|
|
6
|
+
children?: React.ReactNode;
|
|
7
|
+
/**
|
|
8
|
+
* Modal footer
|
|
9
|
+
*/
|
|
10
|
+
footer?: React.ReactNode;
|
|
11
|
+
/**
|
|
12
|
+
* Close click function
|
|
13
|
+
*/
|
|
14
|
+
handleClose?: any;
|
|
15
|
+
/**
|
|
16
|
+
* Modal close button
|
|
17
|
+
*/
|
|
18
|
+
hasCloseButton?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Modal body ref
|
|
21
|
+
*/
|
|
22
|
+
modalref?: React.LegacyRef<HTMLDivElement>;
|
|
23
|
+
/**
|
|
24
|
+
* Subtitle of the modal
|
|
25
|
+
*/
|
|
26
|
+
subtitle?: React.ReactNode;
|
|
27
|
+
/**
|
|
28
|
+
* Title of the modal
|
|
29
|
+
*/
|
|
30
|
+
title?: React.ReactNode;
|
|
31
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { Select as SelectProps } from "./index.types";
|
|
2
|
+
import "./index.css";
|
|
3
|
+
export declare function Select({ inputClassName, classNameGroup, options, styleGroup, defaultValue, setFormSelected, clearError, resetForm, onFormBlur, handleSelect, ...rest }: SelectProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default Select;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Select } from "./index";
|
|
3
|
+
declare const meta: Meta<typeof Select>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Select>;
|
|
6
|
+
export declare const Primary: Story;
|
|
7
|
+
export declare const Error: Story;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { CSSProperties } from "react";
|
|
2
|
+
import { dataTheme } from "data-theme";
|
|
3
|
+
export interface Select extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
4
|
+
/**
|
|
5
|
+
* Custom css class name.
|
|
6
|
+
*/
|
|
7
|
+
inputClassName?: string;
|
|
8
|
+
/**
|
|
9
|
+
* Custom css class name for group wrapper.
|
|
10
|
+
*/
|
|
11
|
+
classNameGroup?: string;
|
|
12
|
+
/**
|
|
13
|
+
* Data theme for the html. `${themes}`
|
|
14
|
+
*/
|
|
15
|
+
paletteTheme?: dataTheme;
|
|
16
|
+
/**
|
|
17
|
+
* Error message to show when input has an error.
|
|
18
|
+
*/
|
|
19
|
+
options?: string[];
|
|
20
|
+
/**
|
|
21
|
+
* Style input group wrapper
|
|
22
|
+
*/
|
|
23
|
+
styleGroup?: CSSProperties;
|
|
24
|
+
defaultValue?: string;
|
|
25
|
+
setFormSelected?: any;
|
|
26
|
+
clearError?: any;
|
|
27
|
+
resetForm?: any;
|
|
28
|
+
onFormBlur?: any;
|
|
29
|
+
handleSelect?: any;
|
|
30
|
+
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TextArea as TextAreaProps } from "./index.types";
|
|
3
|
+
import "./index.css";
|
|
4
|
+
export declare function TextArea({ className, disabled, hasToggleButton, hideHeight, placeholder, showHeight, style, textareaClassName, label, labelClass, error, ...rest }: TextAreaProps): JSX.Element;
|
|
5
|
+
export default TextArea;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { TextArea } from "./index";
|
|
3
|
+
declare const meta: Meta<typeof TextArea>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof TextArea>;
|
|
6
|
+
export declare const Active: Story;
|
|
7
|
+
export declare const Disabled: Story;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { CSSProperties } from "react";
|
|
2
|
+
export interface TextArea extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
|
|
3
|
+
/**
|
|
4
|
+
* Custom css class name textarea wrapper.
|
|
5
|
+
*/
|
|
6
|
+
className?: string;
|
|
7
|
+
/**
|
|
8
|
+
* Disable prop
|
|
9
|
+
*/
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Check if there is a toggle button
|
|
13
|
+
*/
|
|
14
|
+
hasToggleButton?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* Minimum height if toggle button is true
|
|
17
|
+
*/
|
|
18
|
+
hideHeight?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Placeholder for textarea html tag
|
|
21
|
+
*/
|
|
22
|
+
placeholder?: string;
|
|
23
|
+
/**
|
|
24
|
+
* Maximum height if toggle button is false
|
|
25
|
+
*/
|
|
26
|
+
showHeight?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Style textarea group wrapper
|
|
29
|
+
*/
|
|
30
|
+
style?: CSSProperties;
|
|
31
|
+
/**
|
|
32
|
+
* Classname of the textarea
|
|
33
|
+
*/
|
|
34
|
+
textareaClassName?: string;
|
|
35
|
+
label?: string;
|
|
36
|
+
labelClass?: string;
|
|
37
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Accordion, ToggleArray } from "../../components/accordion/index.types";
|
|
3
|
+
interface State {
|
|
4
|
+
toggle?: ToggleArray;
|
|
5
|
+
setToggle: (prev: any) => void;
|
|
6
|
+
}
|
|
7
|
+
declare const AccordionContext: React.Context<State | undefined>;
|
|
8
|
+
declare function AccordionProvider({ children, expanded }: Accordion): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
declare function useAccordion(): State;
|
|
10
|
+
export { useAccordion, AccordionContext, AccordionProvider };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React, { ReactNode, RefObject } from "react";
|
|
2
|
+
type State = {
|
|
3
|
+
isLoading: boolean;
|
|
4
|
+
message?: string | React.ReactNode;
|
|
5
|
+
ref?: RefObject<ReactNode>;
|
|
6
|
+
};
|
|
7
|
+
type Context = {
|
|
8
|
+
state: State;
|
|
9
|
+
setRef: (ref: RefObject<ReactNode>) => void;
|
|
10
|
+
setMessage: (message: string) => void;
|
|
11
|
+
startLoading: () => void;
|
|
12
|
+
stopLoading: () => void;
|
|
13
|
+
};
|
|
14
|
+
type LoadingProviderProps = {
|
|
15
|
+
children: React.ReactNode;
|
|
16
|
+
};
|
|
17
|
+
type UseLoadingProps = {
|
|
18
|
+
ref?: RefObject<ReactNode>;
|
|
19
|
+
message?: string;
|
|
20
|
+
};
|
|
21
|
+
declare const LoadingContext: React.Context<Context | undefined>;
|
|
22
|
+
declare function LoadingProvider({ children }: LoadingProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
declare function useLoading({ ref, message }?: UseLoadingProps): Context;
|
|
24
|
+
export { LoadingContext, LoadingProvider, useLoading };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { LoadingProvider } from ".";
|
|
3
|
+
declare const meta: Meta<typeof LoadingProvider>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof LoadingProvider>;
|
|
6
|
+
export declare const Basic: Story;
|
|
7
|
+
export declare const CustomMessage: Story;
|
|
8
|
+
export declare const CustomImage: Story;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import Modal from "../../components/modal";
|
|
3
|
+
type Modal = {
|
|
4
|
+
title?: React.ReactNode;
|
|
5
|
+
subtitle?: React.ReactNode;
|
|
6
|
+
content?: React.ReactNode;
|
|
7
|
+
hasCloseButton?: boolean;
|
|
8
|
+
footer?: React.ReactNode;
|
|
9
|
+
};
|
|
10
|
+
interface State extends Modal {
|
|
11
|
+
isModal: boolean;
|
|
12
|
+
}
|
|
13
|
+
type Context = {
|
|
14
|
+
state: State;
|
|
15
|
+
openModal: (modal?: Modal) => void;
|
|
16
|
+
closeModal: () => void;
|
|
17
|
+
};
|
|
18
|
+
type ModalProviderProps = {
|
|
19
|
+
children: React.ReactNode;
|
|
20
|
+
};
|
|
21
|
+
type UseModalProps = {};
|
|
22
|
+
declare const ModalContext: React.Context<Context | undefined>;
|
|
23
|
+
declare function ModalProvider({ children }: ModalProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
declare function useModal({}?: UseModalProps): Context;
|
|
25
|
+
export { ModalContext, ModalProvider, useModal };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { DataPalette } from "data-palette";
|
|
2
|
+
import React from "react";
|
|
3
|
+
type DataTheme = "light" | "dark";
|
|
4
|
+
type State = {
|
|
5
|
+
dataTheme?: DataTheme;
|
|
6
|
+
switchDataTheme: (mode: DataTheme) => void;
|
|
7
|
+
dataPalette?: DataPalette;
|
|
8
|
+
switchDataPalette: (mode: DataPalette) => void;
|
|
9
|
+
};
|
|
10
|
+
type ThemeProviderProps = {
|
|
11
|
+
children: React.ReactNode;
|
|
12
|
+
dataTheme?: DataTheme;
|
|
13
|
+
dataPalette?: DataPalette;
|
|
14
|
+
};
|
|
15
|
+
declare const ThemeContext: React.Context<State | undefined>;
|
|
16
|
+
declare function ThemeProvider({ children, dataTheme: dataThemeProp, dataPalette: dataPaletteProp, }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
declare function useTheme(): State;
|
|
18
|
+
export { ThemeContext, ThemeProvider, useTheme };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { StoryContext, StoryFn } from "@storybook/react";
|
|
2
|
+
import "../styles/variables.css";
|
|
3
|
+
export declare const withColorScheme: (Story: StoryFn, context: StoryContext) => import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export declare const Wrapped: ({ Story, context, }: {
|
|
5
|
+
Story: StoryFn;
|
|
6
|
+
context: StoryContext;
|
|
7
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import "../src/styles/variables.css";
|
|
2
|
+
export { Accordion, AccordionItem, AccordionButton, AccordionContent } from "./components/accordion";
|
|
3
|
+
export { Button } from "./components/button";
|
|
4
|
+
export { Form } from "./components/form";
|
|
5
|
+
export { FormInput } from "./components/form/FormInput";
|
|
6
|
+
export { FormTextArea } from "./components/form/FormTextArea";
|
|
7
|
+
export { FormSelect } from "./components/form/FormSelect";
|
|
8
|
+
export { Input } from "./components/input";
|
|
9
|
+
export { Loading } from "./components/loading";
|
|
10
|
+
export { Modal } from "./components/modal";
|
|
11
|
+
export { Select } from "./components/select";
|
|
12
|
+
export { TextArea } from "./components/text-area";
|
|
13
|
+
export { LoadingContext, LoadingProvider, useLoading } from "./context/loading";
|
|
14
|
+
export { ModalContext, ModalProvider, useModal } from "./context/modal";
|
|
15
|
+
export { ThemeContext, ThemeProvider, useTheme } from "./context/theme";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const palette: readonly ["forest", "water", "earth"];
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { ReactNode } from "react";
|
|
2
|
+
import { ToggleArray } from "../components/accordion/index.types";
|
|
3
|
+
export declare function recursiveChildren(children: ReactNode | ReactNode[], i?: number): ReactNode;
|
|
4
|
+
export declare function recursiveToggle(children: ReactNode[], toggleArray: ToggleArray | undefined, i: number | undefined, props: {
|
|
5
|
+
expanded: "all" | "none" | "custom";
|
|
6
|
+
}): ToggleArray | undefined;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import "./index.css";
|
|
2
|
+
import { AccordionContent as AccordionContentProps } from "./index.types";
|
|
3
|
+
export declare const AccordionContent: ({ children, label, toggle, }: AccordionContentProps) => false | "" | import("react/jsx-runtime").JSX.Element | undefined;
|
|
4
|
+
export default AccordionContent;
|