svseeds 0.4.4 → 0.4.6
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.
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
validations?: ToggleGroupFieldValidation[];
|
|
17
17
|
status?: string; // bindable <STATE.NEUTRAL>
|
|
18
18
|
style?: SVSStyle;
|
|
19
|
+
name?: string;
|
|
19
20
|
deps?: ToggleGroupFieldDeps;
|
|
20
21
|
[key: string]: unknown | Snippet;
|
|
21
22
|
}
|
|
@@ -40,6 +41,7 @@
|
|
|
40
41
|
validations?: ToggleGroupFieldValidation[];
|
|
41
42
|
status?: string; // bindable <STATE.NEUTRAL>
|
|
42
43
|
style?: SVSStyle;
|
|
44
|
+
name?: string;
|
|
43
45
|
deps?: ToggleGroupFieldDeps;
|
|
44
46
|
[key: string]: unknown | Snippet;
|
|
45
47
|
}
|
|
@@ -60,7 +62,7 @@
|
|
|
60
62
|
</script>
|
|
61
63
|
|
|
62
64
|
<script lang="ts">
|
|
63
|
-
let { options, label, extra, aux, left, right, bottom, descFirst = false, values = $bindable([]), multiple = true, validations = [], status = $bindable(""), style,
|
|
65
|
+
let { options, label, extra, aux, left, right, bottom, descFirst = false, values = $bindable([]), multiple = true, validations = [], status = $bindable(""), style, name, deps, ...rest }: ToggleGroupFieldProps = $props();
|
|
64
66
|
|
|
65
67
|
// *** Initialize *** //
|
|
66
68
|
if (!status) status = STATE.NEUTRAL;
|
|
@@ -131,7 +133,7 @@
|
|
|
131
133
|
{@render desc(descFirst)}
|
|
132
134
|
<div class={cls(PARTS.MIDDLE, status)}>
|
|
133
135
|
{@render side(PARTS.LEFT, left)}
|
|
134
|
-
|
|
136
|
+
{@render fnForm()}
|
|
135
137
|
<ToggleGroup bind:values bind:ariaErrMsgId={idMsg} bind:status={neutral} {options} {multiple} {...svsToggleGroup} />
|
|
136
138
|
{@render side(PARTS.RIGHT, right)}
|
|
137
139
|
</div>
|
|
@@ -159,3 +161,9 @@
|
|
|
159
161
|
<div class={cls(PARTS.BOTTOM, status)} id={idDesc ?? idErr} role={live}>{message}</div>
|
|
160
162
|
{/if}
|
|
161
163
|
{/snippet}
|
|
164
|
+
{#snippet fnForm()}
|
|
165
|
+
<input bind:this={element} style="display: none;" aria-hidden="true" {oninvalid} />
|
|
166
|
+
{#each values as value}
|
|
167
|
+
<input type="hidden" {name} {value} />
|
|
168
|
+
{/each}
|
|
169
|
+
{/snippet}
|
|
@@ -12,6 +12,7 @@ export interface ToggleGroupFieldProps {
|
|
|
12
12
|
validations?: ToggleGroupFieldValidation[];
|
|
13
13
|
status?: string;
|
|
14
14
|
style?: SVSStyle;
|
|
15
|
+
name?: string;
|
|
15
16
|
deps?: ToggleGroupFieldDeps;
|
|
16
17
|
[key: string]: unknown | Snippet;
|
|
17
18
|
}
|
|
@@ -42,6 +43,7 @@ import { type ToggleGroupProps, type ToggleGroupReqdProps, type ToggleGroupBindP
|
|
|
42
43
|
* validations?: ToggleGroupFieldValidation[];
|
|
43
44
|
* status?: string; // bindable <STATE.NEUTRAL>
|
|
44
45
|
* style?: SVSStyle;
|
|
46
|
+
* name?: string;
|
|
45
47
|
* deps?: ToggleGroupFieldDeps;
|
|
46
48
|
* [key: string]: unknown | Snippet;
|
|
47
49
|
* }
|
|
@@ -51,6 +53,6 @@ import { type ToggleGroupProps, type ToggleGroupReqdProps, type ToggleGroupBindP
|
|
|
51
53
|
* type ToggleGroupFieldValidation = (values: string[]) => string;
|
|
52
54
|
* ```
|
|
53
55
|
*/
|
|
54
|
-
declare const ToggleGroupField: import("svelte").Component<ToggleGroupFieldProps, {}, "
|
|
56
|
+
declare const ToggleGroupField: import("svelte").Component<ToggleGroupFieldProps, {}, "status" | "values">;
|
|
55
57
|
type ToggleGroupField = ReturnType<typeof ToggleGroupField>;
|
|
56
58
|
export default ToggleGroupField;
|
package/_svseeds/_Toggle.svelte
CHANGED
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
attributes?: HTMLButtonAttributes;
|
|
15
15
|
action?: Action;
|
|
16
16
|
element?: HTMLButtonElement; // bindable
|
|
17
|
+
children?: Snippet;
|
|
17
18
|
}
|
|
18
19
|
```
|
|
19
20
|
-->
|
|
@@ -30,6 +31,7 @@
|
|
|
30
31
|
attributes?: HTMLButtonAttributes;
|
|
31
32
|
action?: Action;
|
|
32
33
|
element?: HTMLButtonElement; // bindable
|
|
34
|
+
children?: Snippet;
|
|
33
35
|
}
|
|
34
36
|
export type ToggleReqdProps = never;
|
|
35
37
|
export type ToggleBindProps = "value" | "status" | "element";
|
|
@@ -44,7 +46,7 @@
|
|
|
44
46
|
</script>
|
|
45
47
|
|
|
46
48
|
<script lang="ts">
|
|
47
|
-
let { main, left, right, value = $bindable(false), type = "button", ariaLabel, status = $bindable(""), style, attributes, action, element = $bindable() }: ToggleProps = $props();
|
|
49
|
+
let { main, left, right, value = $bindable(false), type = "button", ariaLabel, status = $bindable(""), style, attributes, action, element = $bindable(), children }: ToggleProps = $props();
|
|
48
50
|
|
|
49
51
|
// *** Initialize *** //
|
|
50
52
|
if (!status) status = STATE.NEUTRAL;
|
|
@@ -88,6 +90,8 @@
|
|
|
88
90
|
{#snippet contents()}
|
|
89
91
|
{#if main}
|
|
90
92
|
{@render main(status, value, element)}
|
|
93
|
+
{:else if children}
|
|
94
|
+
{@render children()}
|
|
91
95
|
{/if}
|
|
92
96
|
{/snippet}
|
|
93
97
|
{#snippet button(role: string)}
|
|
@@ -10,6 +10,7 @@ export interface ToggleProps {
|
|
|
10
10
|
attributes?: HTMLButtonAttributes;
|
|
11
11
|
action?: Action;
|
|
12
12
|
element?: HTMLButtonElement;
|
|
13
|
+
children?: Snippet;
|
|
13
14
|
}
|
|
14
15
|
export type ToggleReqdProps = never;
|
|
15
16
|
export type ToggleBindProps = "value" | "status" | "element";
|
|
@@ -32,6 +33,7 @@ import { type SVSStyle } from "./core";
|
|
|
32
33
|
* attributes?: HTMLButtonAttributes;
|
|
33
34
|
* action?: Action;
|
|
34
35
|
* element?: HTMLButtonElement; // bindable
|
|
36
|
+
* children?: Snippet;
|
|
35
37
|
* }
|
|
36
38
|
* ```
|
|
37
39
|
*/
|
package/index.d.ts
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
export { type SVSStyle, BASE, STATE, PARTS, elemId, fnClass, isNeutral, omit, debounce, throttle, UniqueId } from "./_svseeds/core";
|
|
2
|
-
export { default as Badge, type BadgeReqdProps, type BadgeBindProps } from "./_svseeds/_Badge.svelte";
|
|
3
|
-
export { default as Button, type ButtonReqdProps, type ButtonBindProps } from "./_svseeds/_Button.svelte";
|
|
4
|
-
export { default as CheckField, type CheckFieldReqdProps, type CheckFieldBindProps, type CheckFieldValidation } from "./_svseeds/_CheckField.svelte";
|
|
5
|
-
export { default as ColorPicker, type ColorPickerReqdProps, type ColorPickerBindProps, getHex } from "./_svseeds/_ColorPicker.svelte";
|
|
6
|
-
export { default as ComboBox, type ComboBoxReqdProps, type ComboBoxBindProps } from "./_svseeds/_ComboBox.svelte";
|
|
7
|
-
export { default as ContextMenu, type ContextMenuReqdProps, type ContextMenuBindProps } from "./_svseeds/_ContextMenu.svelte";
|
|
8
|
-
export { default as Disclosure, type DisclosureReqdProps, type DisclosureBindProps } from "./_svseeds/_Disclosure.svelte";
|
|
9
|
-
export { default as HotkeyCapture, type HotkeyCaptureReqdProps, type HotkeyCaptureBindProps } from "./_svseeds/_HotkeyCapture.svelte";
|
|
10
|
-
export { default as Modal, type ModalReqdProps, type ModalBindProps } from "./_svseeds/_Modal.svelte";
|
|
11
|
-
export { default as ProgressTracker, type ProgressTrackerReqdProps, type ProgressTrackerBindProps } from "./_svseeds/_ProgressTracker.svelte";
|
|
12
|
-
export { default as SelectField, type SelectFieldReqdProps, type SelectFieldBindProps, type SelectFieldValidation } from "./_svseeds/_SelectField.svelte";
|
|
13
|
-
export { default as Slider, type SliderReqdProps, type SliderBindProps, type Range } from "./_svseeds/_Slider.svelte";
|
|
14
|
-
export { default as Sortable, type SortableReqdProps, type SortableBindProps, SortableItems } from "./_svseeds/_Sortable.svelte";
|
|
15
|
-
export { default as Tabs, type TabsReqdProps, type TabsBindProps } from "./_svseeds/_Tabs.svelte";
|
|
16
|
-
export { default as TextField, type TextFieldReqdProps, type TextFieldBindProps, type TextFieldValidation } from "./_svseeds/_TextField.svelte";
|
|
17
|
-
export { default as Toggle, type ToggleReqdProps, type ToggleBindProps } from "./_svseeds/_Toggle.svelte";
|
|
18
|
-
export { default as ToggleGroup, type ToggleGroupReqdProps, type ToggleGroupBindProps } from "./_svseeds/_ToggleGroup.svelte";
|
|
19
|
-
export { default as Tooltip, type TooltipReqdProps, type TooltipBindProps, type Vector, type Position, type Align, tooltip, tooltipAction } from "./_svseeds/_Tooltip.svelte";
|
|
20
|
-
export { default as Accordion, type AccordionReqdProps, type AccordionBindProps } from "./_svseeds/Accordion.svelte";
|
|
21
|
-
export { default as DarkToggle, type DarkToggleReqdProps, type DarkToggleBindProps, THEME, setThemeToRoot } from "./_svseeds/DarkToggle.svelte";
|
|
22
|
-
export { default as TagsInput, type TagsInputReqdProps, type TagsInputBindProps } from "./_svseeds/TagsInput.svelte";
|
|
23
|
-
export { default as TagsInputField, type TagsInputFieldReqdProps, type TagsInputFieldBindProps, type TagsInputFieldConstraint, type TagsInputFieldValidation, type TagsInputFieldCountValidation } from "./_svseeds/TagsInputField.svelte";
|
|
24
|
-
export { default as ToggleGroupField, type ToggleGroupFieldReqdProps, type ToggleGroupFieldBindProps, type ToggleGroupFieldValidation } from "./_svseeds/ToggleGroupField.svelte";
|
|
2
|
+
export { default as Badge, type BadgeProps, type BadgeReqdProps, type BadgeBindProps } from "./_svseeds/_Badge.svelte";
|
|
3
|
+
export { default as Button, type ButtonProps, type ButtonReqdProps, type ButtonBindProps } from "./_svseeds/_Button.svelte";
|
|
4
|
+
export { default as CheckField, type CheckFieldProps, type CheckFieldReqdProps, type CheckFieldBindProps, type CheckFieldValidation } from "./_svseeds/_CheckField.svelte";
|
|
5
|
+
export { default as ColorPicker, type ColorPickerProps, type ColorPickerReqdProps, type ColorPickerBindProps, getHex } from "./_svseeds/_ColorPicker.svelte";
|
|
6
|
+
export { default as ComboBox, type ComboBoxProps, type ComboBoxReqdProps, type ComboBoxBindProps } from "./_svseeds/_ComboBox.svelte";
|
|
7
|
+
export { default as ContextMenu, type ContextMenuProps, type ContextMenuReqdProps, type ContextMenuBindProps } from "./_svseeds/_ContextMenu.svelte";
|
|
8
|
+
export { default as Disclosure, type DisclosureProps, type DisclosureReqdProps, type DisclosureBindProps } from "./_svseeds/_Disclosure.svelte";
|
|
9
|
+
export { default as HotkeyCapture, type HotkeyCaptureProps, type HotkeyCaptureReqdProps, type HotkeyCaptureBindProps } from "./_svseeds/_HotkeyCapture.svelte";
|
|
10
|
+
export { default as Modal, type ModalProps, type ModalReqdProps, type ModalBindProps } from "./_svseeds/_Modal.svelte";
|
|
11
|
+
export { default as ProgressTracker, type ProgressTrackerProps, type ProgressTrackerReqdProps, type ProgressTrackerBindProps } from "./_svseeds/_ProgressTracker.svelte";
|
|
12
|
+
export { default as SelectField, type SelectFieldProps, type SelectFieldReqdProps, type SelectFieldBindProps, type SelectFieldValidation } from "./_svseeds/_SelectField.svelte";
|
|
13
|
+
export { default as Slider, type SliderProps, type SliderReqdProps, type SliderBindProps, type Range } from "./_svseeds/_Slider.svelte";
|
|
14
|
+
export { default as Sortable, type SortableProps, type SortableReqdProps, type SortableBindProps, SortableItems } from "./_svseeds/_Sortable.svelte";
|
|
15
|
+
export { default as Tabs, type TabsProps, type TabsReqdProps, type TabsBindProps } from "./_svseeds/_Tabs.svelte";
|
|
16
|
+
export { default as TextField, type TextFieldProps, type TextFieldReqdProps, type TextFieldBindProps, type TextFieldValidation } from "./_svseeds/_TextField.svelte";
|
|
17
|
+
export { default as Toggle, type ToggleProps, type ToggleReqdProps, type ToggleBindProps } from "./_svseeds/_Toggle.svelte";
|
|
18
|
+
export { default as ToggleGroup, type ToggleGroupProps, type ToggleGroupReqdProps, type ToggleGroupBindProps } from "./_svseeds/_ToggleGroup.svelte";
|
|
19
|
+
export { default as Tooltip, type TooltipProps, type TooltipReqdProps, type TooltipBindProps, type Vector, type Position, type Align, tooltip, tooltipAction } from "./_svseeds/_Tooltip.svelte";
|
|
20
|
+
export { default as Accordion, type AccordionProps, type AccordionDeps, type AccordionReqdProps, type AccordionBindProps } from "./_svseeds/Accordion.svelte";
|
|
21
|
+
export { default as DarkToggle, type DarkToggleProps, type DarkToggleDeps, type DarkToggleReqdProps, type DarkToggleBindProps, THEME, setThemeToRoot } from "./_svseeds/DarkToggle.svelte";
|
|
22
|
+
export { default as TagsInput, type TagsInputProps, type TagsInputDeps, type TagsInputReqdProps, type TagsInputBindProps, type TagsInputEvents } from "./_svseeds/TagsInput.svelte";
|
|
23
|
+
export { default as TagsInputField, type TagsInputFieldProps, type TagsInputFieldReqdProps, type TagsInputFieldBindProps, type TagsInputFieldConstraint, type TagsInputFieldValidation, type TagsInputFieldCountValidation } from "./_svseeds/TagsInputField.svelte";
|
|
24
|
+
export { default as ToggleGroupField, type ToggleGroupFieldProps, type ToggleGroupFieldDeps, type ToggleGroupFieldReqdProps, type ToggleGroupFieldBindProps, type ToggleGroupFieldValidation } from "./_svseeds/ToggleGroupField.svelte";
|