@lctafrica/ui 0.0.6 → 0.1.1
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/components/ui/ModalFooter.d.ts +7 -0
- package/dist/components/ui/autosuggest-input/AutoSuggestInput.d.ts +10 -0
- package/dist/components/ui/autosuggest-input/AutoSuggestInput.stories.d.ts +25 -0
- package/dist/components/ui/badge/Badge.stories.d.ts +10 -0
- package/dist/components/ui/button/Button.d.ts +4 -4
- package/dist/components/ui/button/Button.stories.d.ts +18 -0
- package/dist/components/ui/button-group/ButtonGroup.stories.d.ts +10 -0
- package/dist/components/ui/calendar.d.ts +10 -0
- package/dist/components/ui/checkbox/Checkbox.d.ts +2 -2
- package/dist/components/ui/checkbox/Checkbox.stories.d.ts +333 -0
- package/dist/components/ui/confirm-modal/ConfirmModal.d.ts +4 -0
- package/dist/components/ui/confirm-modal/ConfirmModal.stories.d.ts +25 -0
- package/dist/components/ui/data-state-renderer/DataStateRendere.stories.d.ts +102 -0
- package/dist/components/ui/data-state-renderer/DataStateRenderer.d.ts +19 -0
- package/dist/components/ui/date-picker/DatePicker.d.ts +7 -0
- package/dist/components/ui/date-picker/DatePicker.stories.d.ts +30 -0
- package/dist/components/ui/dialog.d.ts +17 -0
- package/dist/components/ui/field/Field.stories.d.ts +10 -0
- package/dist/components/ui/input/Input.d.ts +6 -3
- package/dist/components/ui/input/Input.stories.d.ts +13 -0
- package/dist/components/ui/input-group.d.ts +16 -0
- package/dist/components/ui/loading-state/LoadingIndicator.d.ts +6 -0
- package/dist/components/ui/loading-state/LoadingIndicator.stories.d.ts +6 -0
- package/dist/components/ui/loading-state/loading-animation/LoadingAnimation.d.ts +16 -0
- package/dist/components/ui/main-wrapper/MainWrapper.d.ts +2 -0
- package/dist/components/ui/main-wrapper/MainWrapper.stories.d.ts +19 -0
- package/dist/components/ui/modal/Modal.d.ts +11 -0
- package/dist/components/ui/modal/Modal.stories.d.ts +29 -0
- package/dist/components/ui/popover.d.ts +10 -0
- package/dist/components/ui/prompt-modal/PromptModal.d.ts +8 -0
- package/dist/components/ui/prompt-modal/PromptModal.stories.d.ts +29 -0
- package/dist/components/ui/radio-group/RadioGroup.d.ts +7 -0
- package/dist/components/ui/radio-group/RadioGroup.stories.d.ts +13 -0
- package/dist/components/ui/radio-group/RadioGroup.test.d.ts +1 -0
- package/dist/components/ui/search-input/SearchInput.d.ts +9 -0
- package/dist/components/ui/search-input/SearchInput.stories.d.ts +6 -0
- package/dist/components/ui/searchable-select/SearchableSelect.d.ts +16 -0
- package/dist/components/ui/searchable-select/SearchableSelect.stories.d.ts +25 -0
- package/dist/components/ui/select/Select.d.ts +15 -0
- package/dist/components/ui/select/Select.stories.d.ts +6 -0
- package/dist/components/ui/select/select-components.d.ts +17 -0
- package/dist/components/ui/state-indicator/StateIndicator.d.ts +22 -0
- package/dist/components/ui/state-indicator/StateIndicator.stories.d.ts +33 -0
- package/dist/components/ui/success-modal/SuccessAnimation.d.ts +1 -0
- package/dist/components/ui/success-modal/SuccessModal.d.ts +12 -0
- package/dist/components/ui/success-modal/SuccessModal.stories.d.ts +37 -0
- package/dist/components/ui/success-modal/SuccessTickIcon.d.ts +6 -0
- package/dist/components/ui/switch/Switch.d.ts +6 -0
- package/dist/components/ui/switch/Switch.stories.d.ts +37 -0
- package/dist/components/ui/text/Text.stories.d.ts +9 -0
- package/dist/components/ui/textarea/Textarea.d.ts +3 -0
- package/dist/components/ui/textarea/Textarea.stories.d.ts +29 -0
- package/dist/index.d.ts +9 -0
- package/dist/index.js +12482 -1590
- package/package.json +10 -3
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export type ModalFooter = {
|
|
2
|
+
onCancel?(): void;
|
|
3
|
+
onConfirm?(): void;
|
|
4
|
+
confirmButtonLabel?: string;
|
|
5
|
+
cancelButtonLabel?: string;
|
|
6
|
+
};
|
|
7
|
+
export declare function ModalFooter({ onCancel, cancelButtonLabel, onConfirm, confirmButtonLabel, }: ModalFooter): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
type SearchableSelectProps = {
|
|
2
|
+
options?: string[];
|
|
3
|
+
value?: string | null;
|
|
4
|
+
placeholder?: string;
|
|
5
|
+
onChange?(value: string | null): void;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
name?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare function AutoSuggestInput({ options, placeholder, value, disabled, name, onChange, }: SearchableSelectProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { AutoSuggestInput } from './AutoSuggestInput';
|
|
3
|
+
declare const meta: Meta<typeof AutoSuggestInput>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof AutoSuggestInput>;
|
|
6
|
+
/**
|
|
7
|
+
* Base controlled usage
|
|
8
|
+
*/
|
|
9
|
+
export declare const Default: Story;
|
|
10
|
+
/**
|
|
11
|
+
* Shows filtering behavior while typing
|
|
12
|
+
*/
|
|
13
|
+
export declare const TypingAndFiltering: Story;
|
|
14
|
+
/**
|
|
15
|
+
* Shows selecting a full option
|
|
16
|
+
*/
|
|
17
|
+
export declare const WithSelectedValue: Story;
|
|
18
|
+
/**
|
|
19
|
+
* Demonstrates clear button behavior
|
|
20
|
+
*/
|
|
21
|
+
export declare const WithClearableValue: Story;
|
|
22
|
+
/**
|
|
23
|
+
* Disabled state
|
|
24
|
+
*/
|
|
25
|
+
export declare const Disabled: Story;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { default as Badge } from './Badge';
|
|
3
|
+
declare const meta: Meta<typeof Badge>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Badge>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Sizes: Story;
|
|
8
|
+
export declare const WithIcon: Story;
|
|
9
|
+
export declare const Statuses: Story;
|
|
10
|
+
export declare const Variants: Story;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
import * as React from "react";
|
|
3
|
-
declare const buttonVariants: (props?: ({
|
|
3
|
+
export declare const buttonVariants: (props?: ({
|
|
4
4
|
variant?: "link" | "primary" | "primary-destructive" | "secondary" | "secondary-destructive" | "outline" | "outline-destructive" | "ghost" | "ghost-destructive" | "link-destructive" | null | undefined;
|
|
5
5
|
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "icon-sm" | "icon-md" | "icon-lg" | "icon-xl" | "icon-2xl" | null | undefined;
|
|
6
6
|
defaultVariants?: "size" | "variant" | null | undefined;
|
|
7
7
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
|
-
export
|
|
8
|
+
export type ButtonProps = React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
|
|
9
9
|
asChild?: boolean;
|
|
10
|
-
}
|
|
11
|
-
export {};
|
|
10
|
+
};
|
|
11
|
+
export declare function Button({ className, variant, size, asChild, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { Button } from './Button';
|
|
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;
|
|
8
|
+
export declare const Outline: Story;
|
|
9
|
+
export declare const Ghost: Story;
|
|
10
|
+
export declare const Link: Story;
|
|
11
|
+
export declare const PrimaryDestructive: Story;
|
|
12
|
+
export declare const SecondaryDestructive: Story;
|
|
13
|
+
export declare const OutlineDestructive: Story;
|
|
14
|
+
export declare const GhostDestructive: Story;
|
|
15
|
+
export declare const LinkDestructive: Story;
|
|
16
|
+
export declare const AllSizes: Story;
|
|
17
|
+
export declare const AsChild: Story;
|
|
18
|
+
export declare const Disabled: Story;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ButtonGroup } from './ButtonGroup';
|
|
3
|
+
type Option = string;
|
|
4
|
+
declare const meta: Meta<typeof ButtonGroup<Option>>;
|
|
5
|
+
export default meta;
|
|
6
|
+
type Story = StoryObj<typeof ButtonGroup<Option>>;
|
|
7
|
+
export declare const Default: Story;
|
|
8
|
+
export declare const Selected: Story;
|
|
9
|
+
export declare const TextOnly: Story;
|
|
10
|
+
export declare const ManyOptions: Story;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { DayPicker, DayButton, Locale } from 'react-day-picker';
|
|
2
|
+
import { Button } from './button/Button';
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, locale, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
|
|
5
|
+
buttonVariant?: React.ComponentProps<typeof Button>["variant"];
|
|
6
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
declare function CalendarDayButton({ className, day, modifiers, locale, ...props }: React.ComponentProps<typeof DayButton> & {
|
|
8
|
+
locale?: Partial<Locale>;
|
|
9
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export { Calendar, CalendarDayButton };
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
|
-
import * as React from "react";
|
|
3
2
|
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
declare const checkboxVariants: (props?: ({
|
|
5
5
|
size?: "sm" | "md" | null | undefined;
|
|
6
|
-
variant?: "
|
|
6
|
+
variant?: "circle" | "default" | null | undefined;
|
|
7
7
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
8
|
declare const iconVariants: (props?: ({
|
|
9
9
|
size?: "sm" | "md" | null | undefined;
|
|
@@ -0,0 +1,333 @@
|
|
|
1
|
+
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import('react').ForwardRefExoticComponent<import('./Checkbox').CheckboxProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
5
|
+
decorators: ((Story: import('storybook/internal/csf').PartialStoryFn<import('@storybook/react').ReactRenderer, {
|
|
6
|
+
form?: string | undefined | undefined;
|
|
7
|
+
slot?: string | undefined | undefined;
|
|
8
|
+
style?: import('react').CSSProperties | undefined;
|
|
9
|
+
title?: string | undefined | undefined;
|
|
10
|
+
className?: string | undefined | undefined;
|
|
11
|
+
type?: "submit" | "reset" | "button" | undefined | undefined;
|
|
12
|
+
color?: string | undefined | undefined;
|
|
13
|
+
hidden?: boolean | undefined | undefined;
|
|
14
|
+
key?: import('react').Key | null | undefined;
|
|
15
|
+
checked?: import('@radix-ui/react-checkbox').CheckedState | undefined;
|
|
16
|
+
disabled?: boolean | undefined | undefined;
|
|
17
|
+
formAction?: string | undefined;
|
|
18
|
+
formEncType?: string | undefined | undefined;
|
|
19
|
+
formMethod?: string | undefined | undefined;
|
|
20
|
+
formNoValidate?: boolean | undefined | undefined;
|
|
21
|
+
formTarget?: string | undefined | undefined;
|
|
22
|
+
name?: string | undefined | undefined;
|
|
23
|
+
required?: boolean | undefined;
|
|
24
|
+
value?: string | number | readonly string[] | undefined;
|
|
25
|
+
onChange?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
26
|
+
defaultChecked?: import('@radix-ui/react-checkbox').CheckedState | undefined;
|
|
27
|
+
defaultValue?: string | number | readonly string[] | undefined;
|
|
28
|
+
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
29
|
+
suppressHydrationWarning?: boolean | undefined | undefined;
|
|
30
|
+
accessKey?: string | undefined | undefined;
|
|
31
|
+
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
|
|
32
|
+
autoFocus?: boolean | undefined | undefined;
|
|
33
|
+
contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
|
|
34
|
+
contextMenu?: string | undefined | undefined;
|
|
35
|
+
dir?: string | undefined | undefined;
|
|
36
|
+
draggable?: (boolean | "true" | "false") | undefined;
|
|
37
|
+
enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
38
|
+
id?: string | undefined | undefined;
|
|
39
|
+
lang?: string | undefined | undefined;
|
|
40
|
+
nonce?: string | undefined | undefined;
|
|
41
|
+
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
42
|
+
tabIndex?: number | undefined | undefined;
|
|
43
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
44
|
+
radioGroup?: string | undefined | undefined;
|
|
45
|
+
role?: import('react').AriaRole | undefined;
|
|
46
|
+
about?: string | undefined | undefined;
|
|
47
|
+
content?: string | undefined | undefined;
|
|
48
|
+
datatype?: string | undefined | undefined;
|
|
49
|
+
inlist?: any;
|
|
50
|
+
prefix?: string | undefined | undefined;
|
|
51
|
+
property?: string | undefined | undefined;
|
|
52
|
+
rel?: string | undefined | undefined;
|
|
53
|
+
resource?: string | undefined | undefined;
|
|
54
|
+
rev?: string | undefined | undefined;
|
|
55
|
+
typeof?: string | undefined | undefined;
|
|
56
|
+
vocab?: string | undefined | undefined;
|
|
57
|
+
autoCorrect?: string | undefined | undefined;
|
|
58
|
+
autoSave?: string | undefined | undefined;
|
|
59
|
+
itemProp?: string | undefined | undefined;
|
|
60
|
+
itemScope?: boolean | undefined | undefined;
|
|
61
|
+
itemType?: string | undefined | undefined;
|
|
62
|
+
itemID?: string | undefined | undefined;
|
|
63
|
+
itemRef?: string | undefined | undefined;
|
|
64
|
+
results?: number | undefined | undefined;
|
|
65
|
+
security?: string | undefined | undefined;
|
|
66
|
+
unselectable?: "on" | "off" | undefined | undefined;
|
|
67
|
+
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
|
|
68
|
+
is?: string | undefined | undefined;
|
|
69
|
+
exportparts?: string | undefined | undefined;
|
|
70
|
+
part?: string | undefined | undefined;
|
|
71
|
+
"aria-activedescendant"?: string | undefined | undefined;
|
|
72
|
+
"aria-atomic"?: (boolean | "true" | "false") | undefined;
|
|
73
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
|
|
74
|
+
"aria-braillelabel"?: string | undefined | undefined;
|
|
75
|
+
"aria-brailleroledescription"?: string | undefined | undefined;
|
|
76
|
+
"aria-busy"?: (boolean | "true" | "false") | undefined;
|
|
77
|
+
"aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
78
|
+
"aria-colcount"?: number | undefined | undefined;
|
|
79
|
+
"aria-colindex"?: number | undefined | undefined;
|
|
80
|
+
"aria-colindextext"?: string | undefined | undefined;
|
|
81
|
+
"aria-colspan"?: number | undefined | undefined;
|
|
82
|
+
"aria-controls"?: string | undefined | undefined;
|
|
83
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
|
|
84
|
+
"aria-describedby"?: string | undefined | undefined;
|
|
85
|
+
"aria-description"?: string | undefined | undefined;
|
|
86
|
+
"aria-details"?: string | undefined | undefined;
|
|
87
|
+
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
88
|
+
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
|
|
89
|
+
"aria-errormessage"?: string | undefined | undefined;
|
|
90
|
+
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
91
|
+
"aria-flowto"?: string | undefined | undefined;
|
|
92
|
+
"aria-grabbed"?: (boolean | "true" | "false") | undefined;
|
|
93
|
+
"aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
|
|
94
|
+
"aria-hidden"?: (boolean | "true" | "false") | undefined;
|
|
95
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
|
|
96
|
+
"aria-keyshortcuts"?: string | undefined | undefined;
|
|
97
|
+
"aria-label"?: string | undefined | undefined;
|
|
98
|
+
"aria-labelledby"?: string | undefined | undefined;
|
|
99
|
+
"aria-level"?: number | undefined | undefined;
|
|
100
|
+
"aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
|
|
101
|
+
"aria-modal"?: (boolean | "true" | "false") | undefined;
|
|
102
|
+
"aria-multiline"?: (boolean | "true" | "false") | undefined;
|
|
103
|
+
"aria-multiselectable"?: (boolean | "true" | "false") | undefined;
|
|
104
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
|
|
105
|
+
"aria-owns"?: string | undefined | undefined;
|
|
106
|
+
"aria-placeholder"?: string | undefined | undefined;
|
|
107
|
+
"aria-posinset"?: number | undefined | undefined;
|
|
108
|
+
"aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
109
|
+
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
110
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
|
|
111
|
+
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
112
|
+
"aria-roledescription"?: string | undefined | undefined;
|
|
113
|
+
"aria-rowcount"?: number | undefined | undefined;
|
|
114
|
+
"aria-rowindex"?: number | undefined | undefined;
|
|
115
|
+
"aria-rowindextext"?: string | undefined | undefined;
|
|
116
|
+
"aria-rowspan"?: number | undefined | undefined;
|
|
117
|
+
"aria-selected"?: (boolean | "true" | "false") | undefined;
|
|
118
|
+
"aria-setsize"?: number | undefined | undefined;
|
|
119
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
|
|
120
|
+
"aria-valuemax"?: number | undefined | undefined;
|
|
121
|
+
"aria-valuemin"?: number | undefined | undefined;
|
|
122
|
+
"aria-valuenow"?: number | undefined | undefined;
|
|
123
|
+
"aria-valuetext"?: string | undefined | undefined;
|
|
124
|
+
children?: import('react').ReactNode;
|
|
125
|
+
dangerouslySetInnerHTML?: {
|
|
126
|
+
__html: string | TrustedHTML;
|
|
127
|
+
} | undefined | undefined;
|
|
128
|
+
onCopy?: import('react').ClipboardEventHandler<HTMLButtonElement> | undefined;
|
|
129
|
+
onCopyCapture?: import('react').ClipboardEventHandler<HTMLButtonElement> | undefined;
|
|
130
|
+
onCut?: import('react').ClipboardEventHandler<HTMLButtonElement> | undefined;
|
|
131
|
+
onCutCapture?: import('react').ClipboardEventHandler<HTMLButtonElement> | undefined;
|
|
132
|
+
onPaste?: import('react').ClipboardEventHandler<HTMLButtonElement> | undefined;
|
|
133
|
+
onPasteCapture?: import('react').ClipboardEventHandler<HTMLButtonElement> | undefined;
|
|
134
|
+
onCompositionEnd?: import('react').CompositionEventHandler<HTMLButtonElement> | undefined;
|
|
135
|
+
onCompositionEndCapture?: import('react').CompositionEventHandler<HTMLButtonElement> | undefined;
|
|
136
|
+
onCompositionStart?: import('react').CompositionEventHandler<HTMLButtonElement> | undefined;
|
|
137
|
+
onCompositionStartCapture?: import('react').CompositionEventHandler<HTMLButtonElement> | undefined;
|
|
138
|
+
onCompositionUpdate?: import('react').CompositionEventHandler<HTMLButtonElement> | undefined;
|
|
139
|
+
onCompositionUpdateCapture?: import('react').CompositionEventHandler<HTMLButtonElement> | undefined;
|
|
140
|
+
onFocus?: import('react').FocusEventHandler<HTMLButtonElement> | undefined;
|
|
141
|
+
onFocusCapture?: import('react').FocusEventHandler<HTMLButtonElement> | undefined;
|
|
142
|
+
onBlur?: import('react').FocusEventHandler<HTMLButtonElement> | undefined;
|
|
143
|
+
onBlurCapture?: import('react').FocusEventHandler<HTMLButtonElement> | undefined;
|
|
144
|
+
onChangeCapture?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
145
|
+
onBeforeInput?: import('react').InputEventHandler<HTMLButtonElement> | undefined;
|
|
146
|
+
onBeforeInputCapture?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
147
|
+
onInput?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
148
|
+
onInputCapture?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
149
|
+
onReset?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
150
|
+
onResetCapture?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
151
|
+
onSubmit?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
152
|
+
onSubmitCapture?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
153
|
+
onInvalid?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
154
|
+
onInvalidCapture?: import('react').FormEventHandler<HTMLButtonElement> | undefined;
|
|
155
|
+
onLoad?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
156
|
+
onLoadCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
157
|
+
onError?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
158
|
+
onErrorCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
159
|
+
onKeyDown?: import('react').KeyboardEventHandler<HTMLButtonElement> | undefined;
|
|
160
|
+
onKeyDownCapture?: import('react').KeyboardEventHandler<HTMLButtonElement> | undefined;
|
|
161
|
+
onKeyPress?: import('react').KeyboardEventHandler<HTMLButtonElement> | undefined;
|
|
162
|
+
onKeyPressCapture?: import('react').KeyboardEventHandler<HTMLButtonElement> | undefined;
|
|
163
|
+
onKeyUp?: import('react').KeyboardEventHandler<HTMLButtonElement> | undefined;
|
|
164
|
+
onKeyUpCapture?: import('react').KeyboardEventHandler<HTMLButtonElement> | undefined;
|
|
165
|
+
onAbort?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
166
|
+
onAbortCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
167
|
+
onCanPlay?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
168
|
+
onCanPlayCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
169
|
+
onCanPlayThrough?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
170
|
+
onCanPlayThroughCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
171
|
+
onDurationChange?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
172
|
+
onDurationChangeCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
173
|
+
onEmptied?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
174
|
+
onEmptiedCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
175
|
+
onEncrypted?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
176
|
+
onEncryptedCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
177
|
+
onEnded?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
178
|
+
onEndedCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
179
|
+
onLoadedData?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
180
|
+
onLoadedDataCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
181
|
+
onLoadedMetadata?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
182
|
+
onLoadedMetadataCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
183
|
+
onLoadStart?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
184
|
+
onLoadStartCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
185
|
+
onPause?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
186
|
+
onPauseCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
187
|
+
onPlay?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
188
|
+
onPlayCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
189
|
+
onPlaying?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
190
|
+
onPlayingCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
191
|
+
onProgress?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
192
|
+
onProgressCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
193
|
+
onRateChange?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
194
|
+
onRateChangeCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
195
|
+
onSeeked?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
196
|
+
onSeekedCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
197
|
+
onSeeking?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
198
|
+
onSeekingCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
199
|
+
onStalled?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
200
|
+
onStalledCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
201
|
+
onSuspend?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
202
|
+
onSuspendCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
203
|
+
onTimeUpdate?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
204
|
+
onTimeUpdateCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
205
|
+
onVolumeChange?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
206
|
+
onVolumeChangeCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
207
|
+
onWaiting?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
208
|
+
onWaitingCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
209
|
+
onAuxClick?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
210
|
+
onAuxClickCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
211
|
+
onClick?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
212
|
+
onClickCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
213
|
+
onContextMenu?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
214
|
+
onContextMenuCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
215
|
+
onDoubleClick?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
216
|
+
onDoubleClickCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
217
|
+
onDrag?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
218
|
+
onDragCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
219
|
+
onDragEnd?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
220
|
+
onDragEndCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
221
|
+
onDragEnter?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
222
|
+
onDragEnterCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
223
|
+
onDragExit?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
224
|
+
onDragExitCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
225
|
+
onDragLeave?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
226
|
+
onDragLeaveCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
227
|
+
onDragOver?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
228
|
+
onDragOverCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
229
|
+
onDragStart?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
230
|
+
onDragStartCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
231
|
+
onDrop?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
232
|
+
onDropCapture?: import('react').DragEventHandler<HTMLButtonElement> | undefined;
|
|
233
|
+
onMouseDown?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
234
|
+
onMouseDownCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
235
|
+
onMouseEnter?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
236
|
+
onMouseLeave?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
237
|
+
onMouseMove?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
238
|
+
onMouseMoveCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
239
|
+
onMouseOut?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
240
|
+
onMouseOutCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
241
|
+
onMouseOver?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
242
|
+
onMouseOverCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
243
|
+
onMouseUp?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
244
|
+
onMouseUpCapture?: import('react').MouseEventHandler<HTMLButtonElement> | undefined;
|
|
245
|
+
onSelect?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
246
|
+
onSelectCapture?: import('react').ReactEventHandler<HTMLButtonElement> | undefined;
|
|
247
|
+
onTouchCancel?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
248
|
+
onTouchCancelCapture?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
249
|
+
onTouchEnd?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
250
|
+
onTouchEndCapture?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
251
|
+
onTouchMove?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
252
|
+
onTouchMoveCapture?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
253
|
+
onTouchStart?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
254
|
+
onTouchStartCapture?: import('react').TouchEventHandler<HTMLButtonElement> | undefined;
|
|
255
|
+
onPointerDown?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
256
|
+
onPointerDownCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
257
|
+
onPointerMove?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
258
|
+
onPointerMoveCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
259
|
+
onPointerUp?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
260
|
+
onPointerUpCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
261
|
+
onPointerCancel?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
262
|
+
onPointerCancelCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
263
|
+
onPointerEnter?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
264
|
+
onPointerLeave?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
265
|
+
onPointerOver?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
266
|
+
onPointerOverCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
267
|
+
onPointerOut?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
268
|
+
onPointerOutCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
269
|
+
onGotPointerCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
270
|
+
onGotPointerCaptureCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
271
|
+
onLostPointerCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
272
|
+
onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLButtonElement> | undefined;
|
|
273
|
+
onScroll?: import('react').UIEventHandler<HTMLButtonElement> | undefined;
|
|
274
|
+
onScrollCapture?: import('react').UIEventHandler<HTMLButtonElement> | undefined;
|
|
275
|
+
onWheel?: import('react').WheelEventHandler<HTMLButtonElement> | undefined;
|
|
276
|
+
onWheelCapture?: import('react').WheelEventHandler<HTMLButtonElement> | undefined;
|
|
277
|
+
onAnimationStart?: import('react').AnimationEventHandler<HTMLButtonElement> | undefined;
|
|
278
|
+
onAnimationStartCapture?: import('react').AnimationEventHandler<HTMLButtonElement> | undefined;
|
|
279
|
+
onAnimationEnd?: import('react').AnimationEventHandler<HTMLButtonElement> | undefined;
|
|
280
|
+
onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLButtonElement> | undefined;
|
|
281
|
+
onAnimationIteration?: import('react').AnimationEventHandler<HTMLButtonElement> | undefined;
|
|
282
|
+
onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLButtonElement> | undefined;
|
|
283
|
+
onTransitionEnd?: import('react').TransitionEventHandler<HTMLButtonElement> | undefined;
|
|
284
|
+
onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLButtonElement> | undefined;
|
|
285
|
+
asChild?: boolean | undefined;
|
|
286
|
+
onCheckedChange?: ((checked: import('@radix-ui/react-checkbox').CheckedState) => void) | undefined;
|
|
287
|
+
size?: "sm" | "md" | null | undefined;
|
|
288
|
+
variant?: "circle" | "default" | null | undefined;
|
|
289
|
+
ref?: import('react').LegacyRef<HTMLButtonElement> | undefined;
|
|
290
|
+
}>) => import("react/jsx-runtime").JSX.Element)[];
|
|
291
|
+
parameters: {
|
|
292
|
+
layout: string;
|
|
293
|
+
};
|
|
294
|
+
tags: string[];
|
|
295
|
+
argTypes: {
|
|
296
|
+
size: {
|
|
297
|
+
control: "radio";
|
|
298
|
+
options: string[];
|
|
299
|
+
description: string;
|
|
300
|
+
table: {
|
|
301
|
+
defaultValue: {
|
|
302
|
+
summary: string;
|
|
303
|
+
};
|
|
304
|
+
};
|
|
305
|
+
};
|
|
306
|
+
variant: {
|
|
307
|
+
control: "radio";
|
|
308
|
+
options: string[];
|
|
309
|
+
description: string;
|
|
310
|
+
table: {
|
|
311
|
+
defaultValue: {
|
|
312
|
+
summary: string;
|
|
313
|
+
};
|
|
314
|
+
};
|
|
315
|
+
};
|
|
316
|
+
disabled: {
|
|
317
|
+
control: "boolean";
|
|
318
|
+
description: string;
|
|
319
|
+
};
|
|
320
|
+
defaultChecked: {
|
|
321
|
+
control: "boolean";
|
|
322
|
+
description: string;
|
|
323
|
+
};
|
|
324
|
+
};
|
|
325
|
+
};
|
|
326
|
+
export default meta;
|
|
327
|
+
type Story = StoryObj<typeof meta>;
|
|
328
|
+
export declare const Default: Story;
|
|
329
|
+
export declare const Circle: Story;
|
|
330
|
+
export declare const WithText: Story;
|
|
331
|
+
export declare const Table: Story;
|
|
332
|
+
export declare const Disabled: Story;
|
|
333
|
+
export declare const AllCombinations: Story;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { ModalProps } from '../modal/Modal';
|
|
2
|
+
import { ModalFooter } from '../ModalFooter';
|
|
3
|
+
export type ConfirmModalProps = ModalProps & ModalFooter;
|
|
4
|
+
export default function ConfirmModal({ onCancel, onConfirm, confirmButtonLabel, cancelButtonLabel, children, ...rest }: ConfirmModalProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { default as ConfirmModal } from './ConfirmModal';
|
|
3
|
+
declare const meta: Meta<typeof ConfirmModal>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof ConfirmModal>;
|
|
6
|
+
/**
|
|
7
|
+
* Default confirm modal
|
|
8
|
+
*/
|
|
9
|
+
export declare const Default: Story;
|
|
10
|
+
/**
|
|
11
|
+
* Custom button labels
|
|
12
|
+
*/
|
|
13
|
+
export declare const CustomLabels: Story;
|
|
14
|
+
/**
|
|
15
|
+
* Title only
|
|
16
|
+
*/
|
|
17
|
+
export declare const TitleOnly: Story;
|
|
18
|
+
/**
|
|
19
|
+
* Description only
|
|
20
|
+
*/
|
|
21
|
+
export declare const DescriptionOnly: Story;
|
|
22
|
+
/**
|
|
23
|
+
* Long content inside modal
|
|
24
|
+
*/
|
|
25
|
+
export declare const WithContent: Story;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { default as DataStateRenderer } from './DataStateRenderer';
|
|
3
|
+
/**
|
|
4
|
+
* DataStateRenderer is a utility component that conditionally renders UI
|
|
5
|
+
* based on common data-fetching states:
|
|
6
|
+
*
|
|
7
|
+
* - Loading → displays a loading indicator
|
|
8
|
+
* - Error → displays an error state
|
|
9
|
+
* - Empty → displays an empty state
|
|
10
|
+
* - Success → renders children
|
|
11
|
+
*
|
|
12
|
+
* This helps standardize how async states are handled across the application.
|
|
13
|
+
*
|
|
14
|
+
* ---
|
|
15
|
+
*
|
|
16
|
+
* State Priority
|
|
17
|
+
*
|
|
18
|
+
* When multiple states are true, the following priority is applied:
|
|
19
|
+
*
|
|
20
|
+
* 1. `isLoading`
|
|
21
|
+
* 2. `hasError`
|
|
22
|
+
* 3. `isEmpty`
|
|
23
|
+
* 4. `children` (default/content)
|
|
24
|
+
*
|
|
25
|
+
* Example:
|
|
26
|
+
* If `isLoading` and `hasError` are both true → loading state is shown.
|
|
27
|
+
*
|
|
28
|
+
* ---
|
|
29
|
+
*
|
|
30
|
+
* Customization
|
|
31
|
+
*
|
|
32
|
+
* Each state can be customized via props:
|
|
33
|
+
*
|
|
34
|
+
* - `loadingState` → controls loading container styling
|
|
35
|
+
* - `errorState` → controls error title, description, and styling
|
|
36
|
+
* - `emptyState` → controls empty state title, description, and styling
|
|
37
|
+
*
|
|
38
|
+
* ---
|
|
39
|
+
*
|
|
40
|
+
* Usage
|
|
41
|
+
*
|
|
42
|
+
* ```tsx
|
|
43
|
+
* <DataStateRenderer
|
|
44
|
+
* isLoading={isLoading}
|
|
45
|
+
* hasError={error}
|
|
46
|
+
* isEmpty={!data.length}
|
|
47
|
+
* errorState={{
|
|
48
|
+
* title: "Failed to load data",
|
|
49
|
+
* description: "Please try again later",
|
|
50
|
+
* }}
|
|
51
|
+
* >
|
|
52
|
+
* <DataList data={data} />
|
|
53
|
+
* </DataStateRenderer>
|
|
54
|
+
* ```
|
|
55
|
+
*
|
|
56
|
+
* ---
|
|
57
|
+
*
|
|
58
|
+
* Notes
|
|
59
|
+
*
|
|
60
|
+
* - Designed to reduce repetitive conditional rendering in components
|
|
61
|
+
* - Encourages consistent UX for async states
|
|
62
|
+
* - Works well with data-fetching libraries (e.g. React Query, SWR)
|
|
63
|
+
*/
|
|
64
|
+
declare const meta: Meta<typeof DataStateRenderer>;
|
|
65
|
+
export default meta;
|
|
66
|
+
type Story = StoryObj<typeof DataStateRenderer>;
|
|
67
|
+
/**
|
|
68
|
+
* Default (data available)
|
|
69
|
+
*/
|
|
70
|
+
export declare const Default: Story;
|
|
71
|
+
/**
|
|
72
|
+
* Loading state
|
|
73
|
+
*/
|
|
74
|
+
export declare const Loading: Story;
|
|
75
|
+
/**
|
|
76
|
+
* Error state
|
|
77
|
+
*/
|
|
78
|
+
export declare const Error: Story;
|
|
79
|
+
/**
|
|
80
|
+
* Empty state
|
|
81
|
+
*/
|
|
82
|
+
export declare const Empty: Story;
|
|
83
|
+
/**
|
|
84
|
+
* Priority: Loading overrides everything
|
|
85
|
+
*/
|
|
86
|
+
export declare const LoadingTakesPriority: Story;
|
|
87
|
+
/**
|
|
88
|
+
* Error overrides empty
|
|
89
|
+
*/
|
|
90
|
+
export declare const ErrorOverridesEmpty: Story;
|
|
91
|
+
/**
|
|
92
|
+
* Custom empty state with action
|
|
93
|
+
*/
|
|
94
|
+
export declare const EmptyWithAction: Story;
|
|
95
|
+
/**
|
|
96
|
+
* Custom error styling
|
|
97
|
+
*/
|
|
98
|
+
export declare const CustomErrorStyling: Story;
|
|
99
|
+
/**
|
|
100
|
+
* With real content
|
|
101
|
+
*/
|
|
102
|
+
export declare const WithContent: Story;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { ActionButton } from '../state-indicator/StateIndicator';
|
|
3
|
+
type StateProps = {
|
|
4
|
+
className?: string;
|
|
5
|
+
title?: string;
|
|
6
|
+
description?: string;
|
|
7
|
+
actionButton?: ActionButton;
|
|
8
|
+
};
|
|
9
|
+
type DataStateRendererProps = {
|
|
10
|
+
children?: ReactNode;
|
|
11
|
+
isLoading?: boolean;
|
|
12
|
+
isEmpty?: boolean;
|
|
13
|
+
hasError?: boolean;
|
|
14
|
+
loadingState?: Omit<StateProps, "title" | "description" | "actionButton">;
|
|
15
|
+
emptyState?: StateProps;
|
|
16
|
+
errorState?: StateProps;
|
|
17
|
+
};
|
|
18
|
+
export default function DataStateRenderer({ isLoading, isEmpty, children, emptyState, errorState, hasError, loadingState, }: DataStateRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
type DatePickerProps = {
|
|
2
|
+
value?: Date | undefined;
|
|
3
|
+
onChange?(date: Date | undefined): void;
|
|
4
|
+
placeholder?: string;
|
|
5
|
+
};
|
|
6
|
+
export declare function DatePicker({ value, onChange, placeholder, }: DatePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export {};
|