@rkosafo/cai.components 0.0.5 → 0.0.7
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/README.md +8 -8
- package/dist/baseEditor/index.svelte +32 -32
- package/dist/builders/filters/FilterBuilder.svelte +638 -638
- package/dist/forms/FormCheckbox/FormCheckbox.svelte +53 -53
- package/dist/forms/FormDatepicker/FormDatepicker.svelte +159 -159
- package/dist/forms/FormInput/FormInput.svelte +87 -87
- package/dist/forms/FormRadio/FormRadio.svelte +53 -53
- package/dist/forms/FormSelect/FormSelect.svelte +86 -86
- package/dist/forms/FormTextarea/FormTextarea.svelte +77 -77
- package/dist/forms/checkbox/Checkbox.svelte +82 -82
- package/dist/forms/checkbox/CheckboxButton.svelte +92 -92
- package/dist/forms/datepicker/Datepicker.svelte +706 -706
- package/dist/forms/form/Form.svelte +69 -69
- package/dist/forms/input/Input.svelte +363 -363
- package/dist/forms/label/Label.svelte +38 -38
- package/dist/forms/radio/Radio.svelte +48 -48
- package/dist/forms/radio/RadioButton.svelte +22 -22
- package/dist/forms/select/Select.svelte +50 -50
- package/dist/forms/textarea/Textarea.svelte +165 -165
- package/dist/layout/TF/Content/Content.svelte +28 -28
- package/dist/layout/TF/Header/Header.svelte +159 -159
- package/dist/layout/TF/Sidebar/Sidebar.svelte +52 -74
- package/dist/layout/TF/Sidebar/Sidebar.svelte.d.ts +1 -20
- package/dist/layout/TF/Wrapper/Wrapper.svelte +17 -17
- package/dist/themes/ThemeProvider.svelte +20 -20
- package/dist/types/index.d.ts +19 -0
- package/dist/typography/heading/Heading.svelte +35 -35
- package/dist/ui/accordion/Accordion.svelte +49 -49
- package/dist/ui/accordion/AccordionItem.svelte +173 -173
- package/dist/ui/alert/Alert.svelte +83 -83
- package/dist/ui/alertDialog/AlertDialog.svelte +40 -40
- package/dist/ui/avatar/Avatar.svelte +77 -77
- package/dist/ui/buttons/Button.svelte +102 -102
- package/dist/ui/buttons/GradientButton.svelte +59 -59
- package/dist/ui/datatable/Datatable.svelte +516 -516
- package/dist/ui/drawer/Drawer.svelte +280 -280
- package/dist/ui/dropdown/Dropdown.svelte +36 -36
- package/dist/ui/dropdown/DropdownDivider.svelte +11 -11
- package/dist/ui/dropdown/DropdownGroup.svelte +14 -14
- package/dist/ui/dropdown/DropdownHeader.svelte +14 -14
- package/dist/ui/dropdown/DropdownItem.svelte +52 -52
- package/dist/ui/footer/Footer.svelte +15 -15
- package/dist/ui/footer/FooterBrand.svelte +37 -37
- package/dist/ui/footer/FooterCopyright.svelte +45 -45
- package/dist/ui/footer/FooterIcon.svelte +22 -22
- package/dist/ui/footer/FooterLink.svelte +33 -33
- package/dist/ui/footer/FooterLinkGroup.svelte +13 -13
- package/dist/ui/indicator/Indicator.svelte +42 -42
- package/dist/ui/modal/Modal.svelte +265 -265
- package/dist/ui/notificationList/NotificationList.svelte +123 -123
- package/dist/ui/pageLoader/PageLoader.svelte +10 -10
- package/dist/ui/paginate/Paginate.svelte +96 -96
- package/dist/ui/tab/Tab.svelte +65 -65
- package/dist/ui/table/Table.svelte +385 -385
- package/dist/ui/tableLoader/TableLoader.svelte +24 -24
- package/dist/ui/toolbar/Toolbar.svelte +59 -59
- package/dist/ui/toolbar/ToolbarButton.svelte +56 -56
- package/dist/ui/toolbar/ToolbarGroup.svelte +43 -43
- package/dist/utils/Popper.svelte +257 -257
- package/dist/utils/closeButton/CloseButton.svelte +88 -88
- package/dist/utils/singleSelection.svelte.js +48 -48
- package/dist/youtube/index.svelte +12 -12
- package/package.json +2 -2
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
import { createForm } from 'felte';
|
|
3
|
-
import { setContext } from 'svelte';
|
|
4
|
-
import { key } from './index.js';
|
|
5
|
-
import type { FormProps } from '../../index.js';
|
|
6
|
-
import { validator } from '@felte/validator-zod';
|
|
7
|
-
import * as z from 'zod';
|
|
8
|
-
|
|
9
|
-
let {
|
|
10
|
-
transform = (values: any) => values,
|
|
11
|
-
initialValues = {},
|
|
12
|
-
validators = [],
|
|
13
|
-
contextKey = null,
|
|
14
|
-
onSubmit,
|
|
15
|
-
onChange,
|
|
16
|
-
children,
|
|
17
|
-
schema = z.object({}),
|
|
18
|
-
...restProps
|
|
19
|
-
}: FormProps = $props();
|
|
20
|
-
|
|
21
|
-
// Initialize form and data using the provided props
|
|
22
|
-
const formInfo = createForm({
|
|
23
|
-
onSubmit: (values: any, context: any) => {
|
|
24
|
-
if (onSubmit) onSubmit({ values, context });
|
|
25
|
-
},
|
|
26
|
-
extend: [validator({ schema })],
|
|
27
|
-
transform,
|
|
28
|
-
initialValues,
|
|
29
|
-
// onChange
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
// Set the formInfo context
|
|
33
|
-
setContext(key, formInfo);
|
|
34
|
-
if (contextKey) {
|
|
35
|
-
setContext(contextKey, formInfo);
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
// Extract form elements from formInfo
|
|
39
|
-
const { form, data, setFields, isValid } = formInfo;
|
|
40
|
-
|
|
41
|
-
// Reactive subscription to data changes
|
|
42
|
-
$effect(() => {
|
|
43
|
-
const currentValues = $data;
|
|
44
|
-
if (onChange) {
|
|
45
|
-
onChange({
|
|
46
|
-
values: currentValues,
|
|
47
|
-
isValid: $isValid,
|
|
48
|
-
form: formInfo
|
|
49
|
-
});
|
|
50
|
-
}
|
|
51
|
-
});
|
|
52
|
-
|
|
53
|
-
// // Dispatch 'ready' event when component mounts
|
|
54
|
-
// $effect.pre(() => {
|
|
55
|
-
// dispatch('ready', formInfo);
|
|
56
|
-
// });
|
|
57
|
-
|
|
58
|
-
// Define the updateWith function
|
|
59
|
-
export const updateWith = (newData: any) => {
|
|
60
|
-
Object.keys(newData).forEach((k) => {
|
|
61
|
-
setFields(k, newData[k]);
|
|
62
|
-
});
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
</script>
|
|
66
|
-
|
|
67
|
-
<form use:form {...restProps}>
|
|
68
|
-
{@render children({ initialValues, isValid: $isValid, values: $data })}
|
|
69
|
-
</form>
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { createForm } from 'felte';
|
|
3
|
+
import { setContext } from 'svelte';
|
|
4
|
+
import { key } from './index.js';
|
|
5
|
+
import type { FormProps } from '../../index.js';
|
|
6
|
+
import { validator } from '@felte/validator-zod';
|
|
7
|
+
import * as z from 'zod';
|
|
8
|
+
|
|
9
|
+
let {
|
|
10
|
+
transform = (values: any) => values,
|
|
11
|
+
initialValues = {},
|
|
12
|
+
validators = [],
|
|
13
|
+
contextKey = null,
|
|
14
|
+
onSubmit,
|
|
15
|
+
onChange,
|
|
16
|
+
children,
|
|
17
|
+
schema = z.object({}),
|
|
18
|
+
...restProps
|
|
19
|
+
}: FormProps = $props();
|
|
20
|
+
|
|
21
|
+
// Initialize form and data using the provided props
|
|
22
|
+
const formInfo = createForm({
|
|
23
|
+
onSubmit: (values: any, context: any) => {
|
|
24
|
+
if (onSubmit) onSubmit({ values, context });
|
|
25
|
+
},
|
|
26
|
+
extend: [validator({ schema })],
|
|
27
|
+
transform,
|
|
28
|
+
initialValues,
|
|
29
|
+
// onChange
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
// Set the formInfo context
|
|
33
|
+
setContext(key, formInfo);
|
|
34
|
+
if (contextKey) {
|
|
35
|
+
setContext(contextKey, formInfo);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
// Extract form elements from formInfo
|
|
39
|
+
const { form, data, setFields, isValid } = formInfo;
|
|
40
|
+
|
|
41
|
+
// Reactive subscription to data changes
|
|
42
|
+
$effect(() => {
|
|
43
|
+
const currentValues = $data;
|
|
44
|
+
if (onChange) {
|
|
45
|
+
onChange({
|
|
46
|
+
values: currentValues,
|
|
47
|
+
isValid: $isValid,
|
|
48
|
+
form: formInfo
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
|
|
53
|
+
// // Dispatch 'ready' event when component mounts
|
|
54
|
+
// $effect.pre(() => {
|
|
55
|
+
// dispatch('ready', formInfo);
|
|
56
|
+
// });
|
|
57
|
+
|
|
58
|
+
// Define the updateWith function
|
|
59
|
+
export const updateWith = (newData: any) => {
|
|
60
|
+
Object.keys(newData).forEach((k) => {
|
|
61
|
+
setFields(k, newData[k]);
|
|
62
|
+
});
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
</script>
|
|
66
|
+
|
|
67
|
+
<form use:form {...restProps}>
|
|
68
|
+
{@render children({ initialValues, isValid: $isValid, values: $data })}
|
|
69
|
+
</form>
|