fuma 1.0.16 → 1.0.17
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/private/Meta.svelte +27 -32
- package/dist/private/Meta.svelte.d.ts +0 -1
- package/dist/private/api.d.ts +1 -1
- package/dist/ui/badge/Badge.svelte +3 -4
- package/dist/ui/button/ButtonCopy.svelte +31 -37
- package/dist/ui/button/ButtonDelete.svelte +21 -23
- package/dist/ui/button/ButtonDelete.svelte.d.ts +0 -1
- package/dist/ui/card/Card.svelte +10 -13
- package/dist/ui/card/Card.svelte.d.ts +0 -1
- package/dist/ui/card/CardBasic.svelte +4 -5
- package/dist/ui/card/CardBasic.svelte.d.ts +0 -1
- package/dist/ui/card/CardCollapse.svelte +31 -35
- package/dist/ui/card/CardCollapse.svelte.d.ts +0 -1
- package/dist/ui/card/CardFullScreen.svelte +6 -8
- package/dist/ui/card/CardFullScreen.svelte.d.ts +0 -3
- package/dist/ui/card/CardLink.svelte +4 -5
- package/dist/ui/card/CardLink.svelte.d.ts +0 -1
- package/dist/ui/dialog/Dialog.svelte +34 -41
- package/dist/ui/dialog/Dialog.svelte.d.ts +0 -1
- package/dist/ui/dialog/DialogConfirm.svelte +4 -6
- package/dist/ui/dialog/DialogConfirm.svelte.d.ts +0 -1
- package/dist/ui/drawer/Drawer.svelte +37 -46
- package/dist/ui/drawer/Drawer.svelte.d.ts +0 -16
- package/dist/ui/form/Form.svelte +82 -100
- package/dist/ui/form/Form.svelte.d.ts +0 -1
- package/dist/ui/form/FormInput.svelte +6 -12
- package/dist/ui/form/FormInput.svelte.d.ts +0 -18
- package/dist/ui/form/FormSection.svelte +16 -23
- package/dist/ui/form/formInput.d.ts +0 -1
- package/dist/ui/icon/Icon.svelte +32 -35
- package/dist/ui/input/FormControl.svelte +32 -38
- package/dist/ui/input/FormControl.svelte.d.ts +0 -3
- package/dist/ui/input/InputBoolean.svelte +8 -13
- package/dist/ui/input/InputBoolean.svelte.d.ts +0 -3
- package/dist/ui/input/InputCheckboxs.svelte +20 -22
- package/dist/ui/input/InputCheckboxs.svelte.d.ts +0 -3
- package/dist/ui/input/InputCheckboxsMenu.svelte +35 -51
- package/dist/ui/input/InputCheckboxsMenu.svelte.d.ts +0 -3
- package/dist/ui/input/InputCheckboxsTree.svelte +6 -9
- package/dist/ui/input/InputCheckboxsTreeNodes.svelte +27 -35
- package/dist/ui/input/InputCombo.svelte +34 -43
- package/dist/ui/input/InputCombo.svelte.d.ts +0 -3
- package/dist/ui/input/InputDate.svelte +17 -22
- package/dist/ui/input/InputDateTime.svelte +18 -23
- package/dist/ui/input/InputImage.svelte +45 -52
- package/dist/ui/input/InputImage.svelte.d.ts +0 -1
- package/dist/ui/input/InputImagePreview.svelte +20 -24
- package/dist/ui/input/InputNumber.svelte +5 -10
- package/dist/ui/input/InputOptionInParam.svelte +10 -12
- package/dist/ui/input/InputOptions.svelte +34 -40
- package/dist/ui/input/InputPassword.svelte +5 -7
- package/dist/ui/input/InputPassword.svelte.d.ts +0 -3
- package/dist/ui/input/InputRadio.svelte +32 -36
- package/dist/ui/input/InputRadio.svelte.d.ts +0 -3
- package/dist/ui/input/InputRelation.svelte +67 -83
- package/dist/ui/input/InputRelation.svelte.d.ts +0 -1
- package/dist/ui/input/InputRelations.svelte +79 -92
- package/dist/ui/input/InputSearch.svelte +10 -13
- package/dist/ui/input/InputSelect.svelte +28 -39
- package/dist/ui/input/InputText.svelte +7 -8
- package/dist/ui/input/InputTextarea.svelte +6 -6
- package/dist/ui/input/InputTime.svelte +23 -29
- package/dist/ui/input/RelationAfter.svelte +9 -13
- package/dist/ui/input/SelectorList.svelte +12 -16
- package/dist/ui/input/SelectorList.svelte.d.ts +0 -4
- package/dist/ui/input/textRich/InputTextRich.svelte +50 -57
- package/dist/ui/input/textRich/InputTextRich.svelte.d.ts +0 -3
- package/dist/ui/input/textRich/SuggesionList.svelte +9 -13
- package/dist/ui/input/textRich/ToolMark.svelte +9 -12
- package/dist/ui/input/textRich/ToolMarkColor.svelte +11 -15
- package/dist/ui/input/textRich/ToolMarkLink.svelte +38 -46
- package/dist/ui/input/textRich/ToolMenu.svelte +19 -34
- package/dist/ui/input/textRich/ToolMenuAlign.svelte +9 -13
- package/dist/ui/input/textRich/ToolMenuInsert.svelte +7 -12
- package/dist/ui/input/textRich/ToolMenuNode.svelte +10 -14
- package/dist/ui/input/textRich/ToolsBar.svelte +11 -15
- package/dist/ui/login/Login.svelte +30 -36
- package/dist/ui/menu/ContextMenu.svelte +31 -37
- package/dist/ui/menu/ContextMenu.svelte.d.ts +0 -1
- package/dist/ui/menu/DropDown.svelte +83 -92
- package/dist/ui/menu/DropDown.svelte.d.ts +0 -1
- package/dist/ui/menu/DropDownMenu.svelte +18 -25
- package/dist/ui/menu/DropDownMenu.svelte.d.ts +0 -1
- package/dist/ui/mode/ToggleMode.svelte +14 -15
- package/dist/ui/mode/ToggleMode.svelte.d.ts +1 -6
- package/dist/ui/pagination/Pagination.svelte +8 -9
- package/dist/ui/placeholder/Placeholder.svelte +3 -4
- package/dist/ui/placeholder/Placeholder.svelte.d.ts +0 -1
- package/dist/ui/placeholder/PlaceholderImage.svelte +4 -6
- package/dist/ui/placeholder/PlaceholderImage.svelte.d.ts +0 -1
- package/dist/ui/range/RangePicker.svelte +62 -75
- package/dist/ui/range/RangePicker.svelte.d.ts +2 -2
- package/dist/ui/range/RangePickerButton.svelte +35 -43
- package/dist/ui/slot/Slot.svelte +25 -42
- package/dist/ui/slot/Span.svelte +1 -2
- package/dist/ui/table/Table.svelte +28 -35
- package/dist/ui/table/TableBody.svelte +12 -18
- package/dist/ui/table/TableCell.svelte +10 -13
- package/dist/ui/table/TableFieldsEdition.svelte +51 -57
- package/dist/ui/table/TableHead.svelte +20 -19
- package/dist/ui/table/TableViewSelect.svelte +37 -50
- package/dist/ui/table/cell/TableCellArray.svelte +3 -5
- package/dist/ui/table/cell/TableCellBoolean.svelte +3 -4
- package/dist/ui/table/cell/TableCellNumber.svelte +1 -2
- package/dist/ui/table/cell/TableCellString.svelte +2 -5
- package/dist/ui/table/head/OrderButtons.svelte +37 -0
- package/dist/ui/table/head/OrderButtons.svelte.d.ts +20 -0
- package/dist/ui/table/head/TableHeadBoolean.svelte +3 -6
- package/dist/ui/table/head/TableHeadDate.svelte +110 -61
- package/dist/ui/table/head/TableHeadDefault.svelte +2 -5
- package/dist/ui/table/head/TableHeadNumber.svelte +76 -67
- package/dist/ui/table/head/TableHeadSelect.svelte +41 -47
- package/dist/ui/table/head/TableHeadString.svelte +8 -14
- package/dist/ui/tabs/Tabs.svelte +5 -8
- package/dist/ui/tabs/TabsIcon.svelte +28 -31
- package/dist/validation/zod.d.ts +12 -0
- package/dist/validation/zod.js +4 -2
- package/package.json +1 -1
|
@@ -1,43 +1,37 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
function onChange(newOrder: string[]) {
|
|
38
|
-
options = newOrder
|
|
39
|
-
value = JSON.stringify(options)
|
|
40
|
-
}
|
|
1
|
+
<script>import { slide } from "svelte/transition";
|
|
2
|
+
import { mdiPlus, mdiTrashCanOutline } from "@mdi/js";
|
|
3
|
+
import { toast } from "svelte-sonner";
|
|
4
|
+
import { Icon } from "../icon/index.js";
|
|
5
|
+
import { listEditable } from "../../action/list/index.js";
|
|
6
|
+
export let key;
|
|
7
|
+
export let value = "[]";
|
|
8
|
+
let options = JSON.parse(value || "[]");
|
|
9
|
+
let newOption = "";
|
|
10
|
+
let optionInput;
|
|
11
|
+
function handleKeyDown(e) {
|
|
12
|
+
if (e.key === "Enter") {
|
|
13
|
+
e.preventDefault();
|
|
14
|
+
createOption();
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
function createOption() {
|
|
18
|
+
if (!newOption)
|
|
19
|
+
return;
|
|
20
|
+
if (options.includes(newOption))
|
|
21
|
+
return toast.warning("Cette option \xE9xiste d\xE9j\xE0 !");
|
|
22
|
+
options = [...options, newOption];
|
|
23
|
+
newOption = "";
|
|
24
|
+
value = JSON.stringify(options);
|
|
25
|
+
optionInput.focus();
|
|
26
|
+
}
|
|
27
|
+
function removeOption(index) {
|
|
28
|
+
options = [...options.slice(0, index), ...options.slice(index + 1)];
|
|
29
|
+
value = JSON.stringify(options);
|
|
30
|
+
}
|
|
31
|
+
function onChange(newOrder) {
|
|
32
|
+
options = newOrder;
|
|
33
|
+
value = JSON.stringify(options);
|
|
34
|
+
}
|
|
41
35
|
</script>
|
|
42
36
|
|
|
43
37
|
<input type="hidden" name={key} {value} />
|
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
export let value = _value
|
|
7
|
-
export let autocomplete = 'current-password'
|
|
1
|
+
<script>import { FormControl } from "./index.js";
|
|
2
|
+
$:
|
|
3
|
+
({ input, value: _value, ...props } = $$props);
|
|
4
|
+
export let value = _value;
|
|
5
|
+
export let autocomplete = "current-password";
|
|
8
6
|
</script>
|
|
9
7
|
|
|
10
8
|
<FormControl {...props} let:key>
|
|
@@ -11,9 +11,6 @@ declare const __propDef: {
|
|
|
11
11
|
prefixFor?: string | number | undefined;
|
|
12
12
|
enhanceDisabled?: boolean | undefined;
|
|
13
13
|
labelPosition?: ("top" | "left" | "right") | undefined;
|
|
14
|
-
children?: import("svelte").Snippet<[{
|
|
15
|
-
key: string;
|
|
16
|
-
}]> | undefined;
|
|
17
14
|
} & {
|
|
18
15
|
input?: import("svelte/elements.js").HTMLInputAttributes | undefined;
|
|
19
16
|
inputElement?: HTMLInputElement | undefined;
|
|
@@ -1,39 +1,35 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return () => {
|
|
34
|
-
inputs.forEach((input) => input.removeEventListener('input', handleInput))
|
|
35
|
-
}
|
|
36
|
-
})
|
|
1
|
+
<script>import { onMount } from "svelte";
|
|
2
|
+
import { slide } from "svelte/transition";
|
|
3
|
+
import { parseOptions } from "../../utils/options.js";
|
|
4
|
+
import { formContext } from "../../validation/form.js";
|
|
5
|
+
import { FormControl, bindValueWithParams } from "./index.js";
|
|
6
|
+
$:
|
|
7
|
+
({
|
|
8
|
+
input,
|
|
9
|
+
value: _value,
|
|
10
|
+
error: _error,
|
|
11
|
+
options,
|
|
12
|
+
optionsClass = "",
|
|
13
|
+
hint,
|
|
14
|
+
class: klass,
|
|
15
|
+
...props
|
|
16
|
+
} = $$props);
|
|
17
|
+
export let value = _value;
|
|
18
|
+
export let error = _error;
|
|
19
|
+
$:
|
|
20
|
+
_options = parseOptions(options);
|
|
21
|
+
let formControl;
|
|
22
|
+
const { setError } = formContext.get();
|
|
23
|
+
onMount(() => {
|
|
24
|
+
if (props.key)
|
|
25
|
+
setError[props.key] = (err) => error = err;
|
|
26
|
+
const inputs = formControl.querySelectorAll("input");
|
|
27
|
+
const handleInput = () => error = "";
|
|
28
|
+
inputs.forEach((input2) => input2.addEventListener("input", handleInput));
|
|
29
|
+
return () => {
|
|
30
|
+
inputs.forEach((input2) => input2.removeEventListener("input", handleInput));
|
|
31
|
+
};
|
|
32
|
+
});
|
|
37
33
|
</script>
|
|
38
34
|
|
|
39
35
|
<div class={klass} bind:this={formControl}>
|
|
@@ -12,9 +12,6 @@ declare const __propDef: {
|
|
|
12
12
|
prefixFor?: string | number | undefined;
|
|
13
13
|
enhanceDisabled?: boolean | undefined;
|
|
14
14
|
labelPosition?: ("top" | "left" | "right") | undefined;
|
|
15
|
-
children?: import("svelte").Snippet<[{
|
|
16
|
-
key: string;
|
|
17
|
-
}]> | undefined;
|
|
18
15
|
} & {
|
|
19
16
|
input?: import("svelte/elements.js").HTMLInputAttributes | undefined;
|
|
20
17
|
inputElement?: HTMLInputElement | undefined;
|
|
@@ -1,86 +1,70 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
toast.error('Erreur')
|
|
69
|
-
isError = true
|
|
70
|
-
console.error(error)
|
|
71
|
-
} finally {
|
|
72
|
-
isLoading = false
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
const searchItemsDebounce = debounce(searchItems, 150)
|
|
77
|
-
|
|
78
|
-
function handleFocus() {
|
|
79
|
-
searchItems()
|
|
80
|
-
}
|
|
81
|
-
async function handleBlur() {
|
|
82
|
-
searchValue = ''
|
|
83
|
-
}
|
|
1
|
+
<script generics="RelationItem extends {id: string}">import { createEventDispatcher, tick } from "svelte";
|
|
2
|
+
import debounce from "debounce";
|
|
3
|
+
import { toast } from "svelte-sonner";
|
|
4
|
+
import { mdiClose } from "@mdi/js";
|
|
5
|
+
import { USE_COERCE_JSON } from "../../utils/constant.js";
|
|
6
|
+
import { Icon } from "../icon/index.js";
|
|
7
|
+
import { Slot } from "../slot/index.js";
|
|
8
|
+
import { DropDown } from "../menu/index.js";
|
|
9
|
+
import { FormControl, SelectorList } from "./index.js";
|
|
10
|
+
import RelationAfter from "./RelationAfter.svelte";
|
|
11
|
+
export let key = Math.random().toString();
|
|
12
|
+
export let label = "";
|
|
13
|
+
export let search;
|
|
14
|
+
export let createUrl = "";
|
|
15
|
+
export let createTitle = "Nouveau";
|
|
16
|
+
export let createIcon = void 0;
|
|
17
|
+
let item = null;
|
|
18
|
+
export { item as value };
|
|
19
|
+
export let error = "";
|
|
20
|
+
export let placeholder = "";
|
|
21
|
+
export let tippyProps = {};
|
|
22
|
+
export let dropdownProps = {};
|
|
23
|
+
export let flatMode = false;
|
|
24
|
+
export let slotItem = null;
|
|
25
|
+
export let slotSuggestion = slotItem;
|
|
26
|
+
export let input = void 0;
|
|
27
|
+
let klass = "";
|
|
28
|
+
export { klass as class };
|
|
29
|
+
export let classList = "";
|
|
30
|
+
let inputElement;
|
|
31
|
+
let proposedItems = [];
|
|
32
|
+
let isLoading = false;
|
|
33
|
+
let isError = false;
|
|
34
|
+
let focusIndex = 0;
|
|
35
|
+
let searchValue = "";
|
|
36
|
+
const dispatch = createEventDispatcher();
|
|
37
|
+
export async function clear() {
|
|
38
|
+
searchValue = "";
|
|
39
|
+
item = null;
|
|
40
|
+
await tick();
|
|
41
|
+
inputElement.focus();
|
|
42
|
+
}
|
|
43
|
+
async function select(index = focusIndex) {
|
|
44
|
+
item = proposedItems[index];
|
|
45
|
+
dispatch("input", { value: item });
|
|
46
|
+
}
|
|
47
|
+
async function searchItems(searchValue2 = "") {
|
|
48
|
+
try {
|
|
49
|
+
isLoading = true;
|
|
50
|
+
isError = false;
|
|
51
|
+
focusIndex = 0;
|
|
52
|
+
proposedItems = await search(searchValue2);
|
|
53
|
+
} catch (error2) {
|
|
54
|
+
toast.error("Erreur");
|
|
55
|
+
isError = true;
|
|
56
|
+
console.error(error2);
|
|
57
|
+
} finally {
|
|
58
|
+
isLoading = false;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
const searchItemsDebounce = debounce(searchItems, 150);
|
|
62
|
+
function handleFocus() {
|
|
63
|
+
searchItems();
|
|
64
|
+
}
|
|
65
|
+
async function handleBlur() {
|
|
66
|
+
searchValue = "";
|
|
67
|
+
}
|
|
84
68
|
</script>
|
|
85
69
|
|
|
86
70
|
<DropDown {tippyProps} disable={flatMode} {...dropdownProps}>
|
|
@@ -31,7 +31,6 @@ declare class __sveltets_Render<RelationItem extends {
|
|
|
31
31
|
hide?: (() => void) | undefined;
|
|
32
32
|
show?: (() => void) | undefined;
|
|
33
33
|
setTippyProps?: ((props: Partial<TippyProps>) => void) | undefined;
|
|
34
|
-
children?: import("svelte").Snippet<[]> | undefined;
|
|
35
34
|
} | undefined;
|
|
36
35
|
flatMode?: boolean | undefined;
|
|
37
36
|
slotItem?: ((item: RelationItem) => string | ComponentAndProps) | null | undefined;
|
|
@@ -1,95 +1,82 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
const searchItemsDebounce = debounce(searchItems, 150)
|
|
84
|
-
|
|
85
|
-
function handleFocus() {
|
|
86
|
-
searchItems()
|
|
87
|
-
// dropdown.show()
|
|
88
|
-
}
|
|
89
|
-
async function handleBlur() {
|
|
90
|
-
// dropdown.hide()
|
|
91
|
-
searchValue = ''
|
|
92
|
-
}
|
|
1
|
+
<script generics="RelationItem extends {id: string}">import { createEventDispatcher, tick } from "svelte";
|
|
2
|
+
import { slide } from "svelte/transition";
|
|
3
|
+
import { toast } from "svelte-sonner";
|
|
4
|
+
import { mdiClose } from "@mdi/js";
|
|
5
|
+
import debounce from "debounce";
|
|
6
|
+
import { USE_COERCE_JSON } from "../../utils/constant.js";
|
|
7
|
+
import { Icon } from "../icon/index.js";
|
|
8
|
+
import { Slot } from "../slot/index.js";
|
|
9
|
+
import { FormControl, SelectorList } from "./index.js";
|
|
10
|
+
import { DropDown } from "../menu/index.js";
|
|
11
|
+
import RelationAfter from "./RelationAfter.svelte";
|
|
12
|
+
export let key = "";
|
|
13
|
+
export let label = "";
|
|
14
|
+
export let search;
|
|
15
|
+
export let createUrl = "";
|
|
16
|
+
export let createTitle = "";
|
|
17
|
+
export let createIcon = void 0;
|
|
18
|
+
export let error = "";
|
|
19
|
+
export let placeholder = "";
|
|
20
|
+
export let flatMode = false;
|
|
21
|
+
export let slotItem = null;
|
|
22
|
+
export let slotSuggestion = slotItem;
|
|
23
|
+
export let input = void 0;
|
|
24
|
+
let klass = "";
|
|
25
|
+
export { klass as class };
|
|
26
|
+
export let classList = "";
|
|
27
|
+
let proposedItems = [];
|
|
28
|
+
let items = null;
|
|
29
|
+
export { items as value };
|
|
30
|
+
let isLoading = false;
|
|
31
|
+
let isError = false;
|
|
32
|
+
let focusIndex = 0;
|
|
33
|
+
let searchValue = "";
|
|
34
|
+
let dropdown;
|
|
35
|
+
const dispatch = createEventDispatcher();
|
|
36
|
+
let inputSearch;
|
|
37
|
+
async function select(index = focusIndex) {
|
|
38
|
+
const proposedItem = proposedItems[index];
|
|
39
|
+
if (!proposedItem)
|
|
40
|
+
return;
|
|
41
|
+
if (!items)
|
|
42
|
+
items = [proposedItem];
|
|
43
|
+
else
|
|
44
|
+
items = [...items, proposedItem];
|
|
45
|
+
dropdown.hide();
|
|
46
|
+
inputSearch.select();
|
|
47
|
+
proposedItems = [...proposedItems.slice(0, index), ...proposedItems.slice(index + 1)];
|
|
48
|
+
dispatch("input", { value: items.map(({ id }) => id), items });
|
|
49
|
+
await tick();
|
|
50
|
+
setTimeout(() => dropdown.show(), 200);
|
|
51
|
+
}
|
|
52
|
+
function remove(index) {
|
|
53
|
+
if (!items?.length)
|
|
54
|
+
return;
|
|
55
|
+
items = [...items.slice(0, index), ...items.slice(index + 1)];
|
|
56
|
+
}
|
|
57
|
+
async function searchItems(searchValue2 = "") {
|
|
58
|
+
try {
|
|
59
|
+
isLoading = true;
|
|
60
|
+
isError = false;
|
|
61
|
+
focusIndex = 0;
|
|
62
|
+
const res = await search(searchValue2);
|
|
63
|
+
const currentIds = items?.map(({ id }) => id) || [];
|
|
64
|
+
proposedItems = res.filter(({ id }) => !currentIds.includes(id));
|
|
65
|
+
} catch (error2) {
|
|
66
|
+
toast.error("Erreur");
|
|
67
|
+
isError = true;
|
|
68
|
+
console.error(error2);
|
|
69
|
+
} finally {
|
|
70
|
+
isLoading = false;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
const searchItemsDebounce = debounce(searchItems, 150);
|
|
74
|
+
function handleFocus() {
|
|
75
|
+
searchItems();
|
|
76
|
+
}
|
|
77
|
+
async function handleBlur() {
|
|
78
|
+
searchValue = "";
|
|
79
|
+
}
|
|
93
80
|
</script>
|
|
94
81
|
|
|
95
82
|
<DropDown bind:this={dropdown} disable={flatMode}>
|
|
@@ -1,16 +1,13 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
export let value = $page.url.searchParams.get(key) || ''
|
|
12
|
-
|
|
13
|
-
let inputElement: HTMLInputElement
|
|
1
|
+
<script>import { mdiClose } from "@mdi/js";
|
|
2
|
+
import { browser } from "$app/environment";
|
|
3
|
+
import { page } from "$app/stores";
|
|
4
|
+
import { Icon } from "../icon/index.js";
|
|
5
|
+
import { InputText } from "./index.js";
|
|
6
|
+
let klass = "";
|
|
7
|
+
export { klass as class };
|
|
8
|
+
export let key = "search";
|
|
9
|
+
export let value = $page.url.searchParams.get(key) || "";
|
|
10
|
+
let inputElement;
|
|
14
11
|
</script>
|
|
15
12
|
|
|
16
13
|
<InputText
|
|
@@ -1,42 +1,31 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
const index = _options.findIndex((opt) => opt.value === value)
|
|
30
|
-
focusIndex = index === -1 ? 0 : index
|
|
31
|
-
})
|
|
32
|
-
|
|
33
|
-
function onSelect(index: number) {
|
|
34
|
-
focusIndex = index
|
|
35
|
-
value = _options[index].value
|
|
36
|
-
dispatch('input', value)
|
|
37
|
-
dispatch('select', value)
|
|
38
|
-
dropDown.hide()
|
|
39
|
-
}
|
|
1
|
+
<script>import { createEventDispatcher, onMount } from "svelte";
|
|
2
|
+
import { mdiUnfoldMoreHorizontal } from "@mdi/js";
|
|
3
|
+
import { Icon } from "../icon/index.js";
|
|
4
|
+
import { DropDown } from "../menu/index.js";
|
|
5
|
+
import { SelectorList, FormControl } from "./index.js";
|
|
6
|
+
import { parseOptions } from "../../utils/options.js";
|
|
7
|
+
$:
|
|
8
|
+
({ value: _value, options, tippyProps, placeholder, ...props } = $$props);
|
|
9
|
+
export let value = _value;
|
|
10
|
+
$:
|
|
11
|
+
_options = parseOptions(options);
|
|
12
|
+
$:
|
|
13
|
+
selectedOption = _options.find((opt) => opt.value === value);
|
|
14
|
+
let dropDown;
|
|
15
|
+
let button;
|
|
16
|
+
const dispatch = createEventDispatcher();
|
|
17
|
+
let focusIndex = 0;
|
|
18
|
+
onMount(() => {
|
|
19
|
+
const index = _options.findIndex((opt) => opt.value === value);
|
|
20
|
+
focusIndex = index === -1 ? 0 : index;
|
|
21
|
+
});
|
|
22
|
+
function onSelect(index) {
|
|
23
|
+
focusIndex = index;
|
|
24
|
+
value = _options[index].value;
|
|
25
|
+
dispatch("input", value);
|
|
26
|
+
dispatch("select", value);
|
|
27
|
+
dropDown.hide();
|
|
28
|
+
}
|
|
40
29
|
</script>
|
|
41
30
|
|
|
42
31
|
<DropDown bind:this={dropDown}>
|