@stfrigerio/sito-template 0.1.0 → 0.1.2
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/App.d.ts +6 -0
- package/dist/App.d.ts.map +1 -0
- package/dist/components/atoms/AllAtoms.stories.d.ts +7 -0
- package/dist/components/atoms/AllAtoms.stories.d.ts.map +1 -0
- package/dist/components/atoms/ArrayInput/ArrayInput.d.ts +61 -0
- package/dist/components/atoms/ArrayInput/ArrayInput.d.ts.map +1 -0
- package/dist/components/atoms/ArrayInput/ArrayInput.stories.d.ts +42 -0
- package/dist/components/atoms/ArrayInput/ArrayInput.stories.d.ts.map +1 -0
- package/dist/components/atoms/ArrayInput/index.d.ts +3 -0
- package/dist/components/atoms/ArrayInput/index.d.ts.map +1 -0
- package/dist/components/atoms/Button/Button.d.ts +14 -0
- package/dist/components/atoms/Button/Button.d.ts.map +1 -0
- package/dist/components/atoms/Button/Button.stories.d.ts +59 -0
- package/dist/components/atoms/Button/Button.stories.d.ts.map +1 -0
- package/dist/components/atoms/Button/index.d.ts +3 -0
- package/dist/components/atoms/Button/index.d.ts.map +1 -0
- package/dist/components/atoms/Card/Card.d.ts +18 -0
- package/dist/components/atoms/Card/Card.d.ts.map +1 -0
- package/dist/components/atoms/Card/Card.stories.d.ts +52 -0
- package/dist/components/atoms/Card/Card.stories.d.ts.map +1 -0
- package/dist/components/atoms/Card/index.d.ts +3 -0
- package/dist/components/atoms/Card/index.d.ts.map +1 -0
- package/dist/components/atoms/Checkbox/Checkbox.d.ts +48 -0
- package/dist/components/atoms/Checkbox/Checkbox.d.ts.map +1 -0
- package/dist/components/atoms/Checkbox/Checkbox.stories.d.ts +41 -0
- package/dist/components/atoms/Checkbox/Checkbox.stories.d.ts.map +1 -0
- package/dist/components/atoms/Checkbox/index.d.ts +3 -0
- package/dist/components/atoms/Checkbox/index.d.ts.map +1 -0
- package/dist/components/atoms/DateInput/DateInput.d.ts +49 -0
- package/dist/components/atoms/DateInput/DateInput.d.ts.map +1 -0
- package/dist/components/atoms/DateInput/DateInput.stories.d.ts +47 -0
- package/dist/components/atoms/DateInput/DateInput.stories.d.ts.map +1 -0
- package/dist/components/atoms/DateInput/index.d.ts +3 -0
- package/dist/components/atoms/DateInput/index.d.ts.map +1 -0
- package/dist/components/atoms/SearchableDropdown/SearchableDropdown.d.ts +58 -0
- package/dist/components/atoms/SearchableDropdown/SearchableDropdown.d.ts.map +1 -0
- package/dist/components/atoms/SearchableDropdown/SearchableDropdown.stories.d.ts +47 -0
- package/dist/components/atoms/SearchableDropdown/SearchableDropdown.stories.d.ts.map +1 -0
- package/dist/components/atoms/SearchableDropdown/index.d.ts +3 -0
- package/dist/components/atoms/SearchableDropdown/index.d.ts.map +1 -0
- package/dist/components/atoms/SelectInput/SelectInput.d.ts +52 -0
- package/dist/components/atoms/SelectInput/SelectInput.d.ts.map +1 -0
- package/dist/components/atoms/SelectInput/SelectInput.stories.d.ts +41 -0
- package/dist/components/atoms/SelectInput/SelectInput.stories.d.ts.map +1 -0
- package/dist/components/atoms/SelectInput/index.d.ts +3 -0
- package/dist/components/atoms/SelectInput/index.d.ts.map +1 -0
- package/dist/components/atoms/TextArea/TextArea.d.ts +46 -0
- package/dist/components/atoms/TextArea/TextArea.d.ts.map +1 -0
- package/dist/components/atoms/TextArea/TextArea.stories.d.ts +58 -0
- package/dist/components/atoms/TextArea/TextArea.stories.d.ts.map +1 -0
- package/dist/components/atoms/TextArea/index.d.ts +3 -0
- package/dist/components/atoms/TextArea/index.d.ts.map +1 -0
- package/dist/components/atoms/TextInput/TextInput.d.ts +54 -0
- package/dist/components/atoms/TextInput/TextInput.d.ts.map +1 -0
- package/dist/components/atoms/TextInput/TextInput.stories.d.ts +64 -0
- package/dist/components/atoms/TextInput/TextInput.stories.d.ts.map +1 -0
- package/dist/components/atoms/TextInput/index.d.ts +3 -0
- package/dist/components/atoms/TextInput/index.d.ts.map +1 -0
- package/dist/components/atoms/Toggle/Toggle.d.ts +11 -0
- package/dist/components/atoms/Toggle/Toggle.d.ts.map +1 -0
- package/dist/components/atoms/Toggle/Toggle.stories.d.ts +43 -0
- package/dist/components/atoms/Toggle/Toggle.stories.d.ts.map +1 -0
- package/dist/components/atoms/Toggle/index.d.ts +3 -0
- package/dist/components/atoms/Toggle/index.d.ts.map +1 -0
- package/dist/components/atoms/index.d.ts +21 -0
- package/dist/components/atoms/index.d.ts.map +1 -0
- package/dist/components/index.d.ts +4 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/molecules/EditFAB/EditFAB.d.ts +17 -0
- package/dist/components/molecules/EditFAB/EditFAB.d.ts.map +1 -0
- package/dist/components/molecules/EditFAB/EditFAB.stories.d.ts +54 -0
- package/dist/components/molecules/EditFAB/EditFAB.stories.d.ts.map +1 -0
- package/dist/components/molecules/EditFAB/index.d.ts +3 -0
- package/dist/components/molecules/EditFAB/index.d.ts.map +1 -0
- package/dist/components/molecules/SearchBar/SearchBar.d.ts +22 -0
- package/dist/components/molecules/SearchBar/SearchBar.d.ts.map +1 -0
- package/dist/components/molecules/SearchBar/SearchBar.stories.d.ts +18 -0
- package/dist/components/molecules/SearchBar/SearchBar.stories.d.ts.map +1 -0
- package/dist/components/molecules/SearchBar/index.d.ts +3 -0
- package/dist/components/molecules/SearchBar/index.d.ts.map +1 -0
- package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.d.ts +9 -0
- package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.d.ts.map +1 -0
- package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.stories.d.ts +13 -0
- package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.stories.d.ts.map +1 -0
- package/dist/components/molecules/TimeInput/TimeInput.d.ts +15 -0
- package/dist/components/molecules/TimeInput/TimeInput.d.ts.map +1 -0
- package/dist/components/molecules/TimeInput/TimeInput.stories.d.ts +13 -0
- package/dist/components/molecules/TimeInput/TimeInput.stories.d.ts.map +1 -0
- package/dist/components/molecules/TimeInput/TimePickerModal.d.ts +9 -0
- package/dist/components/molecules/TimeInput/TimePickerModal.d.ts.map +1 -0
- package/dist/components/molecules/TimeInput/index.d.ts +4 -0
- package/dist/components/molecules/TimeInput/index.d.ts.map +1 -0
- package/dist/components/molecules/index.d.ts +9 -0
- package/dist/components/molecules/index.d.ts.map +1 -0
- package/dist/components/organisms/Navbar/Navbar.d.ts +28 -0
- package/dist/components/organisms/Navbar/Navbar.d.ts.map +1 -0
- package/dist/components/organisms/Navbar/Navbar.stories.d.ts +15 -0
- package/dist/components/organisms/Navbar/Navbar.stories.d.ts.map +1 -0
- package/dist/components/organisms/ThemeProvider/ThemeProvider.d.ts +16 -0
- package/dist/components/organisms/ThemeProvider/ThemeProvider.d.ts.map +1 -0
- package/dist/components/organisms/animations/AnimationPlayer.d.ts +3 -0
- package/dist/components/organisms/animations/AnimationPlayer.d.ts.map +1 -0
- package/dist/components/organisms/animations/AnimationPlayer.stories.d.ts +23 -0
- package/dist/components/organisms/animations/AnimationPlayer.stories.d.ts.map +1 -0
- package/dist/components/organisms/animations/animationRegistry.d.ts +5 -0
- package/dist/components/organisms/animations/animationRegistry.d.ts.map +1 -0
- package/dist/components/organisms/animations/dna/DNAAnimations.d.ts +7 -0
- package/dist/components/organisms/animations/dna/DNAAnimations.d.ts.map +1 -0
- package/dist/components/organisms/animations/dna/DNAHelix.d.ts +10 -0
- package/dist/components/organisms/animations/dna/DNAHelix.d.ts.map +1 -0
- package/dist/components/organisms/animations/index.d.ts +4 -0
- package/dist/components/organisms/animations/index.d.ts.map +1 -0
- package/dist/components/organisms/animations/tree/ParticleTree.d.ts +8 -0
- package/dist/components/organisms/animations/tree/ParticleTree.d.ts.map +1 -0
- package/dist/components/organisms/animations/tree/TreeAnimations.d.ts +7 -0
- package/dist/components/organisms/animations/tree/TreeAnimations.d.ts.map +1 -0
- package/dist/components/organisms/animations/types.d.ts +12 -0
- package/dist/components/organisms/animations/types.d.ts.map +1 -0
- package/dist/components/organisms/charts/BooleansHeatmap/BooleansHeatmap.d.ts +14 -0
- package/dist/components/organisms/charts/BooleansHeatmap/BooleansHeatmap.d.ts.map +1 -0
- package/dist/components/organisms/charts/BooleansHeatmap/BooleansHeatmap.stories.d.ts +12 -0
- package/dist/components/organisms/charts/BooleansHeatmap/BooleansHeatmap.stories.d.ts.map +1 -0
- package/dist/components/organisms/charts/MoodChart/MoodChart.d.ts +15 -0
- package/dist/components/organisms/charts/MoodChart/MoodChart.d.ts.map +1 -0
- package/dist/components/organisms/charts/MoodChart/MoodChart.stories.d.ts +10 -0
- package/dist/components/organisms/charts/MoodChart/MoodChart.stories.d.ts.map +1 -0
- package/dist/components/organisms/charts/PieChart/PieChart.d.ts +16 -0
- package/dist/components/organisms/charts/PieChart/PieChart.d.ts.map +1 -0
- package/dist/components/organisms/charts/PieChart/PieChart.stories.d.ts +13 -0
- package/dist/components/organisms/charts/PieChart/PieChart.stories.d.ts.map +1 -0
- package/dist/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.d.ts +22 -0
- package/dist/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.d.ts.map +1 -0
- package/dist/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.stories.d.ts +10 -0
- package/dist/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.stories.d.ts.map +1 -0
- package/dist/components/organisms/charts/SleepChart/SleepChart.d.ts +15 -0
- package/dist/components/organisms/charts/SleepChart/SleepChart.d.ts.map +1 -0
- package/dist/components/organisms/charts/SleepChart/SleepChart.stories.d.ts +11 -0
- package/dist/components/organisms/charts/SleepChart/SleepChart.stories.d.ts.map +1 -0
- package/dist/components/organisms/charts/SunburstChart/SunburstChart.d.ts +16 -0
- package/dist/components/organisms/charts/SunburstChart/SunburstChart.d.ts.map +1 -0
- package/dist/components/organisms/charts/SunburstChart/SunburstChart.stories.d.ts +10 -0
- package/dist/components/organisms/charts/SunburstChart/SunburstChart.stories.d.ts.map +1 -0
- package/dist/components/organisms/charts/index.d.ts +8 -0
- package/dist/components/organisms/charts/index.d.ts.map +1 -0
- package/dist/components/organisms/index.d.ts +14 -0
- package/dist/components/organisms/index.d.ts.map +1 -0
- package/dist/contexts/ThemeContext.d.ts.map +1 -1
- package/dist/index.d.ts +1 -8
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +2025 -77
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +2067 -83
- package/dist/index.js.map +1 -1
- package/dist/main.d.ts +2 -0
- package/dist/main.d.ts.map +1 -0
- package/dist/stories/utils.d.ts +5 -0
- package/dist/stories/utils.d.ts.map +1 -0
- package/dist/utils/formUtils.d.ts +8 -0
- package/dist/utils/formUtils.d.ts.map +1 -0
- package/package.json +41 -11
package/dist/App.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,sBAAsB,CAAC;AAC9B,OAAO,WAAW,CAAC;AAEnB,iBAAS,GAAG,SAEX;AAED,eAAe,GAAG,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: Meta;
|
|
3
|
+
export default meta;
|
|
4
|
+
type Story = StoryObj<typeof meta>;
|
|
5
|
+
export declare const AllAtomsShowcase: Story;
|
|
6
|
+
export declare const CompactView: Story;
|
|
7
|
+
//# sourceMappingURL=AllAtoms.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AllAtoms.stories.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/AllAtoms.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAevD,QAAA,MAAM,IAAI,EAAE,IAUX,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAwnBnC,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KA6GzB,CAAC"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
export interface FieldConfig {
|
|
2
|
+
name: string;
|
|
3
|
+
label: string;
|
|
4
|
+
type?: string;
|
|
5
|
+
placeholder?: string;
|
|
6
|
+
}
|
|
7
|
+
interface BaseArrayInputProps {
|
|
8
|
+
label: string;
|
|
9
|
+
}
|
|
10
|
+
interface SimpleArrayInputProps extends BaseArrayInputProps {
|
|
11
|
+
type?: 'simple';
|
|
12
|
+
values: string[];
|
|
13
|
+
onChange: (values: string[]) => void;
|
|
14
|
+
placeholder?: string;
|
|
15
|
+
}
|
|
16
|
+
interface ComplexArrayInputProps<T extends Record<string, any>> extends BaseArrayInputProps {
|
|
17
|
+
type: 'complex';
|
|
18
|
+
values: T[];
|
|
19
|
+
onChange: (values: T[]) => void;
|
|
20
|
+
fields: FieldConfig[];
|
|
21
|
+
getKey?: (item: T, index: number) => string;
|
|
22
|
+
}
|
|
23
|
+
export type ArrayInputProps<T extends Record<string, any> = Record<string, any>> = SimpleArrayInputProps | ComplexArrayInputProps<T>;
|
|
24
|
+
/**
|
|
25
|
+
* ArrayInput component - Versatile dynamic list manager
|
|
26
|
+
*
|
|
27
|
+
* @component
|
|
28
|
+
* @description
|
|
29
|
+
* A flexible component that can handle both simple string arrays and complex object arrays.
|
|
30
|
+
* Users can add, remove, and edit items dynamically. Supports custom field configurations
|
|
31
|
+
* for complex data structures.
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
* // Simple string array
|
|
35
|
+
* <ArrayInput
|
|
36
|
+
* label="Tags"
|
|
37
|
+
* values={tags}
|
|
38
|
+
* onChange={setTags}
|
|
39
|
+
* placeholder="Enter tag"
|
|
40
|
+
* />
|
|
41
|
+
*
|
|
42
|
+
* @example
|
|
43
|
+
* // Complex object array
|
|
44
|
+
* <ArrayInput
|
|
45
|
+
* type="complex"
|
|
46
|
+
* label="Social Links"
|
|
47
|
+
* values={links}
|
|
48
|
+
* onChange={setLinks}
|
|
49
|
+
* fields={[
|
|
50
|
+
* { name: 'label', label: 'Label', placeholder: 'GitHub' },
|
|
51
|
+
* { name: 'url', label: 'URL', type: 'url', placeholder: 'https://github.com/...' }
|
|
52
|
+
* ]}
|
|
53
|
+
* />
|
|
54
|
+
*/
|
|
55
|
+
export declare function ArrayInput<T extends Record<string, any> = Record<string, any>>(props: Readonly<ArrayInputProps<T>>): import("react/jsx-runtime").JSX.Element;
|
|
56
|
+
export interface LabeledLink {
|
|
57
|
+
label: string;
|
|
58
|
+
url: string;
|
|
59
|
+
}
|
|
60
|
+
export {};
|
|
61
|
+
//# sourceMappingURL=ArrayInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ArrayInput.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/ArrayInput/ArrayInput.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,WAAW;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB;AAGD,UAAU,mBAAmB;IACzB,KAAK,EAAE,MAAM,CAAC;CACjB;AAGD,UAAU,qBAAsB,SAAQ,mBAAmB;IACvD,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB;AAGD,UAAU,sBAAsB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAE,SAAQ,mBAAmB;IACvF,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,EAAE,CAAC,EAAE,CAAC;IACZ,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IAChC,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IACzE,qBAAqB,GACrB,sBAAsB,CAAC,CAAC,CAAC,CAAC;AAEhC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC1E,KAAK,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,2CAOtC;AAoID,MAAM,WAAW,WAAW;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACf"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { ArrayInput } from './ArrayInput';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: typeof ArrayInput;
|
|
6
|
+
parameters: {
|
|
7
|
+
layout: string;
|
|
8
|
+
docs: {
|
|
9
|
+
description: {
|
|
10
|
+
component: string;
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
tags: string[];
|
|
15
|
+
argTypes: {
|
|
16
|
+
label: {
|
|
17
|
+
control: "text";
|
|
18
|
+
description: string;
|
|
19
|
+
};
|
|
20
|
+
values: {
|
|
21
|
+
control: "object";
|
|
22
|
+
description: string;
|
|
23
|
+
};
|
|
24
|
+
placeholder: {
|
|
25
|
+
control: "text";
|
|
26
|
+
description: string;
|
|
27
|
+
};
|
|
28
|
+
onChange: {
|
|
29
|
+
action: string;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
export default meta;
|
|
34
|
+
type Story = StoryObj<typeof meta>;
|
|
35
|
+
export declare const Default: Story;
|
|
36
|
+
export declare const WithInitialValues: Story;
|
|
37
|
+
export declare const EmptyState: Story;
|
|
38
|
+
export declare const Interactive: Story;
|
|
39
|
+
export declare const TodoList: Story;
|
|
40
|
+
export declare const TeamMembers: Story;
|
|
41
|
+
export declare const IngredientsList: Story;
|
|
42
|
+
//# sourceMappingURL=ArrayInput.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ArrayInput.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/ArrayInput/ArrayInput.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ByB,CAAC;AAEpC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAOxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAiCzB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAyBtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAkCzB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAqC7B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/ArrayInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React, { ButtonHTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { HTMLMotionProps } from 'framer-motion';
|
|
3
|
+
export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onAnimationStart' | 'onDragStart' | 'onDragEnd' | 'onDrag'> {
|
|
4
|
+
variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger';
|
|
5
|
+
size?: 'small' | 'medium' | 'large';
|
|
6
|
+
fullWidth?: boolean;
|
|
7
|
+
loading?: boolean;
|
|
8
|
+
iconLeft?: ReactNode;
|
|
9
|
+
iconRight?: ReactNode;
|
|
10
|
+
children?: ReactNode;
|
|
11
|
+
motionProps?: HTMLMotionProps<"button">;
|
|
12
|
+
}
|
|
13
|
+
export declare const Button: React.FC<ButtonProps>;
|
|
14
|
+
//# sourceMappingURL=Button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAU,eAAe,EAAE,MAAM,eAAe,CAAC;AAGxD,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,kBAAkB,GAAG,aAAa,GAAG,WAAW,GAAG,QAAQ,CAAC;IAC9I,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;IACnE,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,WAAW,CAAC,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAsCxC,CAAC"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import("react").FC<import("./Button").ButtonProps>;
|
|
5
|
+
parameters: {
|
|
6
|
+
layout: string;
|
|
7
|
+
docs: {
|
|
8
|
+
description: {
|
|
9
|
+
component: string;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
tags: string[];
|
|
14
|
+
argTypes: {
|
|
15
|
+
variant: {
|
|
16
|
+
control: "select";
|
|
17
|
+
options: string[];
|
|
18
|
+
description: string;
|
|
19
|
+
};
|
|
20
|
+
size: {
|
|
21
|
+
control: "select";
|
|
22
|
+
options: string[];
|
|
23
|
+
description: string;
|
|
24
|
+
};
|
|
25
|
+
fullWidth: {
|
|
26
|
+
control: "boolean";
|
|
27
|
+
description: string;
|
|
28
|
+
};
|
|
29
|
+
loading: {
|
|
30
|
+
control: "boolean";
|
|
31
|
+
description: string;
|
|
32
|
+
};
|
|
33
|
+
disabled: {
|
|
34
|
+
control: "boolean";
|
|
35
|
+
description: string;
|
|
36
|
+
};
|
|
37
|
+
onClick: {
|
|
38
|
+
action: string;
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
};
|
|
42
|
+
export default meta;
|
|
43
|
+
type Story = StoryObj<typeof meta>;
|
|
44
|
+
export declare const Default: Story;
|
|
45
|
+
export declare const Primary: Story;
|
|
46
|
+
export declare const Secondary: Story;
|
|
47
|
+
export declare const Outline: Story;
|
|
48
|
+
export declare const Ghost: Story;
|
|
49
|
+
export declare const Small: Story;
|
|
50
|
+
export declare const Large: Story;
|
|
51
|
+
export declare const FullWidth: Story;
|
|
52
|
+
export declare const Loading: Story;
|
|
53
|
+
export declare const Disabled: Story;
|
|
54
|
+
export declare const WithIconLeft: Story;
|
|
55
|
+
export declare const WithIconRight: Story;
|
|
56
|
+
export declare const WithBothIcons: Story;
|
|
57
|
+
export declare const IconOnly: Story;
|
|
58
|
+
export declare const AllVariants: Story;
|
|
59
|
+
//# sourceMappingURL=Button.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqCqB,CAAC;AAEhC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAKvB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAK1B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAwBzB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { HTMLMotionProps } from 'framer-motion';
|
|
3
|
+
export interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onAnimationStart' | 'onDragStart' | 'onDragEnd' | 'onDrag'> {
|
|
4
|
+
variant?: 'elevated' | 'outlined' | 'flat';
|
|
5
|
+
hoverable?: boolean;
|
|
6
|
+
clickable?: boolean;
|
|
7
|
+
padding?: boolean;
|
|
8
|
+
image?: string;
|
|
9
|
+
imageAlt?: string;
|
|
10
|
+
title?: string;
|
|
11
|
+
subtitle?: string;
|
|
12
|
+
header?: ReactNode;
|
|
13
|
+
footer?: ReactNode;
|
|
14
|
+
children?: ReactNode;
|
|
15
|
+
motionProps?: HTMLMotionProps<"div">;
|
|
16
|
+
}
|
|
17
|
+
export declare const Card: React.FC<CardProps>;
|
|
18
|
+
//# sourceMappingURL=Card.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAU,eAAe,EAAE,MAAM,eAAe,CAAC;AAGxD,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,kBAAkB,GAAG,aAAa,GAAG,WAAW,GAAG,QAAQ,CAAC;IACnI,OAAO,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,MAAM,CAAC;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,WAAW,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;CACrC;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA6DpC,CAAC"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import("react").FC<import("./Card").CardProps>;
|
|
5
|
+
parameters: {
|
|
6
|
+
layout: string;
|
|
7
|
+
docs: {
|
|
8
|
+
description: {
|
|
9
|
+
component: string;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
tags: string[];
|
|
14
|
+
argTypes: {
|
|
15
|
+
variant: {
|
|
16
|
+
control: "select";
|
|
17
|
+
options: string[];
|
|
18
|
+
description: string;
|
|
19
|
+
};
|
|
20
|
+
padding: {
|
|
21
|
+
control: "boolean";
|
|
22
|
+
description: string;
|
|
23
|
+
};
|
|
24
|
+
hoverable: {
|
|
25
|
+
control: "boolean";
|
|
26
|
+
description: string;
|
|
27
|
+
};
|
|
28
|
+
clickable: {
|
|
29
|
+
control: "boolean";
|
|
30
|
+
description: string;
|
|
31
|
+
};
|
|
32
|
+
className: {
|
|
33
|
+
control: "text";
|
|
34
|
+
description: string;
|
|
35
|
+
};
|
|
36
|
+
onClick: {
|
|
37
|
+
action: string;
|
|
38
|
+
};
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
export default meta;
|
|
42
|
+
type Story = StoryObj<typeof meta>;
|
|
43
|
+
export declare const Default: Story;
|
|
44
|
+
export declare const Outlined: Story;
|
|
45
|
+
export declare const Elevated: Story;
|
|
46
|
+
export declare const Flat: Story;
|
|
47
|
+
export declare const Hoverable: Story;
|
|
48
|
+
export declare const Clickable: Story;
|
|
49
|
+
export declare const NoPadding: Story;
|
|
50
|
+
export declare const ComplexContent: Story;
|
|
51
|
+
export declare const GridOfCards: Story;
|
|
52
|
+
//# sourceMappingURL=Card.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Card/Card.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCmB,CAAC;AAE9B,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAUlB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAUvB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAWvB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAkBvB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAsB5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KA6BzB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface CheckboxProps {
|
|
3
|
+
checked: boolean;
|
|
4
|
+
onChange: (checked: boolean) => void;
|
|
5
|
+
label?: string;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
indeterminate?: boolean;
|
|
8
|
+
id?: string;
|
|
9
|
+
name?: string;
|
|
10
|
+
value?: string;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Checkbox component - Modern interactive checkbox with animations
|
|
14
|
+
*
|
|
15
|
+
* @component
|
|
16
|
+
* @description
|
|
17
|
+
* A customizable checkbox component with smooth animations, hover effects,
|
|
18
|
+
* and support for checked, unchecked, and indeterminate states. Features
|
|
19
|
+
* gradient backgrounds, bounce animations, and accessible focus states.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* // Basic usage
|
|
23
|
+
* <Checkbox
|
|
24
|
+
* checked={isChecked}
|
|
25
|
+
* onChange={setIsChecked}
|
|
26
|
+
* label="Accept terms and conditions"
|
|
27
|
+
* />
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* // Indeterminate state
|
|
31
|
+
* <Checkbox
|
|
32
|
+
* checked={false}
|
|
33
|
+
* indeterminate={true}
|
|
34
|
+
* onChange={handleChange}
|
|
35
|
+
* label="Select all"
|
|
36
|
+
* />
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* // Disabled state
|
|
40
|
+
* <Checkbox
|
|
41
|
+
* checked={true}
|
|
42
|
+
* onChange={handleChange}
|
|
43
|
+
* label="Premium feature"
|
|
44
|
+
* disabled={true}
|
|
45
|
+
* />
|
|
46
|
+
*/
|
|
47
|
+
export declare const Checkbox: React.FC<CheckboxProps>;
|
|
48
|
+
//# sourceMappingURL=Checkbox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,aAAa;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAmC5C,CAAC"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import("react").FC<import("./Checkbox").CheckboxProps>;
|
|
5
|
+
parameters: {
|
|
6
|
+
layout: string;
|
|
7
|
+
docs: {
|
|
8
|
+
description: {
|
|
9
|
+
component: string;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
tags: string[];
|
|
14
|
+
argTypes: {
|
|
15
|
+
checked: {
|
|
16
|
+
control: "boolean";
|
|
17
|
+
description: string;
|
|
18
|
+
};
|
|
19
|
+
label: {
|
|
20
|
+
control: "text";
|
|
21
|
+
description: string;
|
|
22
|
+
};
|
|
23
|
+
disabled: {
|
|
24
|
+
control: "boolean";
|
|
25
|
+
description: string;
|
|
26
|
+
};
|
|
27
|
+
onChange: {
|
|
28
|
+
action: string;
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
export default meta;
|
|
33
|
+
type Story = StoryObj<typeof meta>;
|
|
34
|
+
export declare const Default: Story;
|
|
35
|
+
export declare const Checked: Story;
|
|
36
|
+
export declare const WithoutLabel: Story;
|
|
37
|
+
export declare const Disabled: Story;
|
|
38
|
+
export declare const DisabledChecked: Story;
|
|
39
|
+
export declare const Interactive: Story;
|
|
40
|
+
export declare const MultipleCheckboxes: Story;
|
|
41
|
+
//# sourceMappingURL=Checkbox.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BuB,CAAC;AAElC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAK1B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAO7B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAgBzB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KA2ChC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
export interface DateInputProps {
|
|
2
|
+
label: string;
|
|
3
|
+
value: string;
|
|
4
|
+
onChange: (newValue: string) => void;
|
|
5
|
+
placeholder?: string;
|
|
6
|
+
onFocus?: () => void;
|
|
7
|
+
onBlur?: () => void;
|
|
8
|
+
error?: boolean;
|
|
9
|
+
success?: boolean;
|
|
10
|
+
loading?: boolean;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* DateInput component - European format date picker with manual input support
|
|
15
|
+
*
|
|
16
|
+
* @component
|
|
17
|
+
* @description
|
|
18
|
+
* A date input component that supports both manual text entry in DD/MM/YYYY format
|
|
19
|
+
* and native calendar picker selection. Automatically formats dates as users type,
|
|
20
|
+
* adding slashes at appropriate positions. Stores dates internally in ISO format
|
|
21
|
+
* while displaying them in European format for better UX in European contexts.
|
|
22
|
+
*
|
|
23
|
+
* Features:
|
|
24
|
+
* - Auto-formatting while typing (adds slashes automatically)
|
|
25
|
+
* - Calendar icon for native date picker access
|
|
26
|
+
* - Seamless conversion between European display and ISO storage formats
|
|
27
|
+
* - Mobile-optimized with proper touch targets
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* // Basic usage
|
|
31
|
+
* <DateInput
|
|
32
|
+
* label="Date of Birth"
|
|
33
|
+
* value={birthDate}
|
|
34
|
+
* onChange={setBirthDate}
|
|
35
|
+
* placeholder="31/12/2000"
|
|
36
|
+
* />
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* // With focus handlers
|
|
40
|
+
* <DateInput
|
|
41
|
+
* label="Event Date"
|
|
42
|
+
* value={eventDate}
|
|
43
|
+
* onChange={setEventDate}
|
|
44
|
+
* onFocus={() => console.log('Focused')}
|
|
45
|
+
* onBlur={() => validateDate(eventDate)}
|
|
46
|
+
* />
|
|
47
|
+
*/
|
|
48
|
+
export declare function DateInput({ label, value, onChange, placeholder, onFocus, onBlur, error, success, loading, disabled }: Readonly<DateInputProps>): import("react/jsx-runtime").JSX.Element;
|
|
49
|
+
//# sourceMappingURL=DateInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/DateInput/DateInput.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,cAAc;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,wBAAgB,SAAS,CAAC,EACtB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,WAA0B,EAC1B,OAAO,EACP,MAAM,EACN,KAAa,EACb,OAAe,EACf,OAAe,EACf,QAAgB,EACnB,EAAE,QAAQ,CAAC,cAAc,CAAC,2CAiG1B"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { DateInput } from './DateInput';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: typeof DateInput;
|
|
6
|
+
parameters: {
|
|
7
|
+
layout: string;
|
|
8
|
+
docs: {
|
|
9
|
+
description: {
|
|
10
|
+
component: string;
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
tags: string[];
|
|
15
|
+
argTypes: {
|
|
16
|
+
label: {
|
|
17
|
+
control: "text";
|
|
18
|
+
description: string;
|
|
19
|
+
};
|
|
20
|
+
value: {
|
|
21
|
+
control: "text";
|
|
22
|
+
description: string;
|
|
23
|
+
};
|
|
24
|
+
placeholder: {
|
|
25
|
+
control: "text";
|
|
26
|
+
description: string;
|
|
27
|
+
};
|
|
28
|
+
onChange: {
|
|
29
|
+
action: string;
|
|
30
|
+
};
|
|
31
|
+
onFocus: {
|
|
32
|
+
action: string;
|
|
33
|
+
};
|
|
34
|
+
onBlur: {
|
|
35
|
+
action: string;
|
|
36
|
+
};
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
export default meta;
|
|
40
|
+
type Story = StoryObj<typeof meta>;
|
|
41
|
+
export declare const Default: Story;
|
|
42
|
+
export declare const WithValue: Story;
|
|
43
|
+
export declare const CustomPlaceholder: Story;
|
|
44
|
+
export declare const Interactive: Story;
|
|
45
|
+
export declare const MultipleDateInputs: Story;
|
|
46
|
+
export declare const DateRangePicker: Story;
|
|
47
|
+
//# sourceMappingURL=DateInput.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateInput.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/DateInput/DateInput.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BwB,CAAC;AAEnC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAuBzB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAiChC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA6C7B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/DateInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
type Option = {
|
|
2
|
+
label: string;
|
|
3
|
+
value: string;
|
|
4
|
+
};
|
|
5
|
+
export interface SearchableDropdownProps {
|
|
6
|
+
label: string;
|
|
7
|
+
value: string;
|
|
8
|
+
onChange: (value: string) => void;
|
|
9
|
+
options: Option[];
|
|
10
|
+
placeholder?: string;
|
|
11
|
+
allowEmpty?: boolean;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
loading?: boolean;
|
|
14
|
+
error?: boolean;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* SearchableDropdown component - Modern filterable dropdown with animations
|
|
18
|
+
*
|
|
19
|
+
* @component
|
|
20
|
+
* @description
|
|
21
|
+
* A sophisticated dropdown component with real-time search filtering, smooth animations,
|
|
22
|
+
* and keyboard navigation support. Features gradient backgrounds, slide-in animations
|
|
23
|
+
* for options, and a sliding indicator on hover. The dropdown menu includes a search
|
|
24
|
+
* field that filters options as you type.
|
|
25
|
+
*
|
|
26
|
+
* Features:
|
|
27
|
+
* - Real-time search filtering
|
|
28
|
+
* - Smooth animations with Framer Motion
|
|
29
|
+
* - Keyboard navigation (Arrow keys, Enter, Escape)
|
|
30
|
+
* - Custom scrollbar styling
|
|
31
|
+
* - Mobile-optimized with modal-like behavior on small screens
|
|
32
|
+
* - Loading and error states
|
|
33
|
+
* - Selected item highlighting with gradient background
|
|
34
|
+
*
|
|
35
|
+
* @example
|
|
36
|
+
* // Basic usage
|
|
37
|
+
* <SearchableDropdown
|
|
38
|
+
* label="Select Country"
|
|
39
|
+
* value={selectedCountry}
|
|
40
|
+
* onChange={setSelectedCountry}
|
|
41
|
+
* options={countryOptions}
|
|
42
|
+
* placeholder="Choose a country..."
|
|
43
|
+
* />
|
|
44
|
+
*
|
|
45
|
+
* @example
|
|
46
|
+
* // With empty option disabled
|
|
47
|
+
* <SearchableDropdown
|
|
48
|
+
* label="Required Field"
|
|
49
|
+
* value={requiredValue}
|
|
50
|
+
* onChange={setRequiredValue}
|
|
51
|
+
* options={options}
|
|
52
|
+
* allowEmpty={false}
|
|
53
|
+
* error={!requiredValue}
|
|
54
|
+
* />
|
|
55
|
+
*/
|
|
56
|
+
export declare function SearchableDropdown({ label, value, onChange, options, placeholder, allowEmpty, disabled, loading, error }: Readonly<SearchableDropdownProps>): import("react/jsx-runtime").JSX.Element;
|
|
57
|
+
export {};
|
|
58
|
+
//# sourceMappingURL=SearchableDropdown.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchableDropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/SearchableDropdown/SearchableDropdown.tsx"],"names":[],"mappings":"AAKA,KAAK,MAAM,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAE/C,MAAM,WAAW,uBAAuB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,wBAAgB,kBAAkB,CAAC,EAC/B,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,EACP,WAAyB,EACzB,UAAiB,EACjB,QAAgB,EAChB,OAAe,EACf,KAAa,EAChB,EAAE,QAAQ,CAAC,uBAAuB,CAAC,2CAmKnC"}
|