@soave/ui 0.2.1 → 0.2.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/adapters/types.d.ts +1 -1
- package/dist/components/ui/Toaster.vue +2 -2
- package/dist/components/ui/Tooltip.vue +4 -5
- package/dist/components/ui/TooltipContent.vue +1 -1
- package/dist/components/ui/TooltipTrigger.vue +1 -1
- package/dist/composables/useForm.mjs +2 -2
- package/dist/composables/useToast.mjs +1 -1
- package/dist/env.d.ts +11 -0
- package/dist/types/composables.d.ts +21 -21
- package/dist/types/config.d.ts +1 -0
- package/dist/types/form.d.ts +5 -5
- package/dist/types/textarea.d.ts +2 -0
- package/dist/types/toast.d.ts +2 -2
- package/dist/types/tooltip.d.ts +3 -0
- package/dist/types/tooltip.mjs +1 -0
- package/package.json +1 -1
package/dist/adapters/types.d.ts
CHANGED
|
@@ -30,7 +30,7 @@ import { computed, ref, watchEffect } from "vue"
|
|
|
30
30
|
import { useStyleAdapter } from "../../composables"
|
|
31
31
|
import { useToast } from "../../composables/useToast"
|
|
32
32
|
import Toast from "./Toast.vue"
|
|
33
|
-
import type { ToastPosition,
|
|
33
|
+
import type { ToastPosition, ToastItem } from "../../types/toast"
|
|
34
34
|
|
|
35
35
|
export interface Props {
|
|
36
36
|
position?: ToastPosition
|
|
@@ -50,7 +50,7 @@ const props = withDefaults(defineProps<Props>(), {
|
|
|
50
50
|
const { toasts, dismiss } = useToast()
|
|
51
51
|
const style_adapter = useStyleAdapter()
|
|
52
52
|
|
|
53
|
-
const internal_toasts = ref<
|
|
53
|
+
const internal_toasts = ref<ToastItem[]>([])
|
|
54
54
|
|
|
55
55
|
watchEffect(() => {
|
|
56
56
|
internal_toasts.value = [...toasts]
|
|
@@ -5,11 +5,12 @@
|
|
|
5
5
|
</template>
|
|
6
6
|
|
|
7
7
|
<script setup lang="ts">
|
|
8
|
-
import { provide, ref,
|
|
9
|
-
import { useTooltip
|
|
8
|
+
import { provide, ref, type Ref } from "vue"
|
|
9
|
+
import { useTooltip } from "../../composables/useTooltip"
|
|
10
10
|
import type { TooltipSide, TooltipAlign } from "../../types/tooltip"
|
|
11
|
+
import { TOOLTIP_CONTEXT_KEY } from "../../types/tooltip"
|
|
11
12
|
|
|
12
|
-
|
|
13
|
+
interface Props {
|
|
13
14
|
side?: TooltipSide
|
|
14
15
|
align?: TooltipAlign
|
|
15
16
|
delay_duration?: number
|
|
@@ -26,8 +27,6 @@ const props = withDefaults(defineProps<Props>(), {
|
|
|
26
27
|
disabled: false
|
|
27
28
|
})
|
|
28
29
|
|
|
29
|
-
export const TOOLTIP_CONTEXT_KEY: InjectionKey<UseTooltipReturn> = Symbol("tooltip-context")
|
|
30
|
-
|
|
31
30
|
const tooltip_props = ref({
|
|
32
31
|
side: props.side,
|
|
33
32
|
align: props.align,
|
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
<script setup lang="ts">
|
|
19
19
|
import { inject, ref, computed, watchEffect } from "vue"
|
|
20
20
|
import { useStyleAdapter } from "../../composables"
|
|
21
|
-
import { TOOLTIP_CONTEXT_KEY } from "./Tooltip.vue"
|
|
22
21
|
import type { TooltipContentProps } from "../../types/tooltip"
|
|
22
|
+
import { TOOLTIP_CONTEXT_KEY } from "../../types/tooltip"
|
|
23
23
|
import type { TooltipState } from "../../types/composables"
|
|
24
24
|
|
|
25
25
|
const props = withDefaults(defineProps<TooltipContentProps>(), {
|
|
@@ -146,8 +146,8 @@ export const useForm = (schema) => {
|
|
|
146
146
|
errors: readonly(form_state.errors),
|
|
147
147
|
touched: readonly(form_state.touched),
|
|
148
148
|
is_valid,
|
|
149
|
-
is_submitting:
|
|
150
|
-
is_dirty:
|
|
149
|
+
is_submitting: computed(() => form_state.is_submitting),
|
|
150
|
+
is_dirty: computed(() => form_state.is_dirty),
|
|
151
151
|
validateField,
|
|
152
152
|
validateAll,
|
|
153
153
|
reset,
|
package/dist/env.d.ts
ADDED
|
@@ -1,8 +1,14 @@
|
|
|
1
1
|
import type { Ref } from "vue";
|
|
2
|
+
/**
|
|
3
|
+
* 汎用的なコンポーネント状態(基底型)
|
|
4
|
+
*/
|
|
5
|
+
export interface ComponentState {
|
|
6
|
+
[key: string]: unknown;
|
|
7
|
+
}
|
|
2
8
|
/**
|
|
3
9
|
* Button の状態
|
|
4
10
|
*/
|
|
5
|
-
export interface ButtonState {
|
|
11
|
+
export interface ButtonState extends ComponentState {
|
|
6
12
|
variant: "primary" | "secondary" | "ghost" | "outline" | "destructive";
|
|
7
13
|
size: "sm" | "md" | "lg";
|
|
8
14
|
disabled: boolean;
|
|
@@ -11,7 +17,7 @@ export interface ButtonState {
|
|
|
11
17
|
/**
|
|
12
18
|
* Input の状態
|
|
13
19
|
*/
|
|
14
|
-
export interface InputState {
|
|
20
|
+
export interface InputState extends ComponentState {
|
|
15
21
|
size: "sm" | "md" | "lg";
|
|
16
22
|
disabled: boolean;
|
|
17
23
|
readonly: boolean;
|
|
@@ -20,19 +26,19 @@ export interface InputState {
|
|
|
20
26
|
/**
|
|
21
27
|
* Dialog の状態
|
|
22
28
|
*/
|
|
23
|
-
export interface DialogState {
|
|
29
|
+
export interface DialogState extends ComponentState {
|
|
24
30
|
is_open: boolean;
|
|
25
31
|
}
|
|
26
32
|
/**
|
|
27
33
|
* Card の状態
|
|
28
34
|
*/
|
|
29
|
-
export interface CardState {
|
|
35
|
+
export interface CardState extends ComponentState {
|
|
30
36
|
padding: "sm" | "md" | "lg" | "none";
|
|
31
37
|
}
|
|
32
38
|
/**
|
|
33
39
|
* Checkbox の状態
|
|
34
40
|
*/
|
|
35
|
-
export interface CheckboxState {
|
|
41
|
+
export interface CheckboxState extends ComponentState {
|
|
36
42
|
checked: boolean;
|
|
37
43
|
disabled: boolean;
|
|
38
44
|
indeterminate: boolean;
|
|
@@ -40,21 +46,21 @@ export interface CheckboxState {
|
|
|
40
46
|
/**
|
|
41
47
|
* Radio の状態
|
|
42
48
|
*/
|
|
43
|
-
export interface RadioState {
|
|
49
|
+
export interface RadioState extends ComponentState {
|
|
44
50
|
checked: boolean;
|
|
45
51
|
disabled: boolean;
|
|
46
52
|
}
|
|
47
53
|
/**
|
|
48
54
|
* Switch の状態
|
|
49
55
|
*/
|
|
50
|
-
export interface SwitchState {
|
|
56
|
+
export interface SwitchState extends ComponentState {
|
|
51
57
|
checked: boolean;
|
|
52
58
|
disabled: boolean;
|
|
53
59
|
}
|
|
54
60
|
/**
|
|
55
61
|
* Textarea の状態
|
|
56
62
|
*/
|
|
57
|
-
export interface TextareaState {
|
|
63
|
+
export interface TextareaState extends ComponentState {
|
|
58
64
|
size: "sm" | "md" | "lg";
|
|
59
65
|
disabled: boolean;
|
|
60
66
|
readonly: boolean;
|
|
@@ -63,7 +69,7 @@ export interface TextareaState {
|
|
|
63
69
|
/**
|
|
64
70
|
* Select の状態
|
|
65
71
|
*/
|
|
66
|
-
export interface SelectState {
|
|
72
|
+
export interface SelectState extends ComponentState {
|
|
67
73
|
size: "sm" | "md" | "lg";
|
|
68
74
|
disabled: boolean;
|
|
69
75
|
is_open: boolean;
|
|
@@ -71,47 +77,41 @@ export interface SelectState {
|
|
|
71
77
|
/**
|
|
72
78
|
* Toast の状態
|
|
73
79
|
*/
|
|
74
|
-
export interface ToastState {
|
|
80
|
+
export interface ToastState extends ComponentState {
|
|
75
81
|
variant: "default" | "success" | "error" | "warning" | "info";
|
|
76
82
|
}
|
|
77
83
|
/**
|
|
78
84
|
* Tooltip の状態
|
|
79
85
|
*/
|
|
80
|
-
export interface TooltipState {
|
|
86
|
+
export interface TooltipState extends ComponentState {
|
|
81
87
|
is_open: boolean;
|
|
82
88
|
side: "top" | "right" | "bottom" | "left";
|
|
83
89
|
}
|
|
84
90
|
/**
|
|
85
91
|
* Popover の状態
|
|
86
92
|
*/
|
|
87
|
-
export interface PopoverState {
|
|
93
|
+
export interface PopoverState extends ComponentState {
|
|
88
94
|
is_open: boolean;
|
|
89
95
|
}
|
|
90
96
|
/**
|
|
91
97
|
* Dropdown の状態
|
|
92
98
|
*/
|
|
93
|
-
export interface DropdownState {
|
|
99
|
+
export interface DropdownState extends ComponentState {
|
|
94
100
|
is_open: boolean;
|
|
95
101
|
}
|
|
96
102
|
/**
|
|
97
103
|
* Sheet の状態
|
|
98
104
|
*/
|
|
99
|
-
export interface SheetState {
|
|
105
|
+
export interface SheetState extends ComponentState {
|
|
100
106
|
is_open: boolean;
|
|
101
107
|
side: "top" | "right" | "bottom" | "left";
|
|
102
108
|
}
|
|
103
109
|
/**
|
|
104
110
|
* Alert の状態
|
|
105
111
|
*/
|
|
106
|
-
export interface AlertState {
|
|
112
|
+
export interface AlertState extends ComponentState {
|
|
107
113
|
variant: "default" | "info" | "success" | "warning" | "destructive";
|
|
108
114
|
}
|
|
109
|
-
/**
|
|
110
|
-
* 汎用的なコンポーネント状態
|
|
111
|
-
*/
|
|
112
|
-
export interface ComponentState {
|
|
113
|
-
[key: string]: unknown;
|
|
114
|
-
}
|
|
115
115
|
/**
|
|
116
116
|
* Headless Composable の戻り値型
|
|
117
117
|
* ロジック情報のみを返し、スタイル情報は返さない
|
package/dist/types/config.d.ts
CHANGED
package/dist/types/form.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ComputedRef
|
|
1
|
+
import type { ComputedRef } from "vue";
|
|
2
2
|
export interface FormState<T> {
|
|
3
3
|
values: T;
|
|
4
4
|
errors: Partial<Record<keyof T, string>>;
|
|
@@ -37,11 +37,11 @@ export interface FileFieldOptions {
|
|
|
37
37
|
}
|
|
38
38
|
export interface FormReturn<T> {
|
|
39
39
|
values: T;
|
|
40
|
-
errors:
|
|
41
|
-
touched:
|
|
40
|
+
errors: Readonly<Partial<Record<keyof T, string>>>;
|
|
41
|
+
touched: Readonly<Partial<Record<keyof T, boolean>>>;
|
|
42
42
|
is_valid: ComputedRef<boolean>;
|
|
43
|
-
is_submitting:
|
|
44
|
-
is_dirty:
|
|
43
|
+
is_submitting: ComputedRef<boolean>;
|
|
44
|
+
is_dirty: ComputedRef<boolean>;
|
|
45
45
|
validateField: (field: keyof T) => void;
|
|
46
46
|
validateAll: () => boolean;
|
|
47
47
|
reset: () => void;
|
package/dist/types/textarea.d.ts
CHANGED
package/dist/types/toast.d.ts
CHANGED
|
@@ -15,7 +15,7 @@ export interface ToastAction {
|
|
|
15
15
|
label: string;
|
|
16
16
|
onClick: () => void;
|
|
17
17
|
}
|
|
18
|
-
export interface
|
|
18
|
+
export interface ToastItem extends Required<Pick<ToastProps, "id" | "variant" | "duration" | "dismissible">> {
|
|
19
19
|
title?: string;
|
|
20
20
|
description?: string;
|
|
21
21
|
action?: ToastAction;
|
|
@@ -27,7 +27,7 @@ export interface ToasterProps {
|
|
|
27
27
|
gap?: number;
|
|
28
28
|
}
|
|
29
29
|
export interface ToastReturn {
|
|
30
|
-
toasts:
|
|
30
|
+
toasts: ToastItem[];
|
|
31
31
|
add: (props: ToastProps) => string;
|
|
32
32
|
dismiss: (id: string) => void;
|
|
33
33
|
dismissAll: () => void;
|
package/dist/types/tooltip.d.ts
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import type { InjectionKey } from "vue";
|
|
2
|
+
import type { UseTooltipReturn } from "../composables/useTooltip";
|
|
1
3
|
export type TooltipSide = "top" | "right" | "bottom" | "left";
|
|
2
4
|
export type TooltipAlign = "start" | "center" | "end";
|
|
3
5
|
export interface TooltipProps {
|
|
@@ -29,3 +31,4 @@ export interface TooltipAriaAttributes {
|
|
|
29
31
|
export interface TooltipTriggerAriaAttributes {
|
|
30
32
|
"aria-describedby": string;
|
|
31
33
|
}
|
|
34
|
+
export declare const TOOLTIP_CONTEXT_KEY: InjectionKey<UseTooltipReturn>;
|
package/dist/types/tooltip.mjs
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export const TOOLTIP_CONTEXT_KEY = Symbol("tooltip-context");
|