@revojs/ui 0.2.55 → 0.2.57
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/components/button.d.ts +1 -1
- package/dist/components/select.d.ts +1 -1
- package/dist/components/stack.d.ts +1 -1
- package/dist/components/tabs.d.ts +1 -1
- package/dist/components/toggle-group.d.ts +1 -1
- package/dist/vue/components/button.vue +3 -5
- package/dist/vue/components/collection.vue +4 -0
- package/dist/vue/components/counter.vue +2 -2
- package/dist/vue/components/dialog.vue +1 -1
- package/dist/vue/components/menu-item.vue +1 -1
- package/dist/vue/components/menu.vue +2 -2
- package/dist/vue/components/navigate.vue +1 -1
- package/dist/vue/components/popover.vue +1 -1
- package/dist/vue/components/rating.vue +1 -1
- package/dist/vue/components/select.vue +2 -2
- package/dist/vue/components/sheet.vue +1 -1
- package/dist/vue/components/stack.vue +8 -0
- package/dist/vue/components/tabs.vue +1 -1
- package/dist/vue/components/toggle-group.vue +1 -1
- package/dist/vue/components/upload.vue +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { IconComponent } from "./icon";
|
|
2
2
|
export type ButtonType = "button" | "submit";
|
|
3
|
-
export type ButtonSize = "
|
|
3
|
+
export type ButtonSize = "md" | "sm" | "xs";
|
|
4
4
|
export type ButtonFont = "normal" | "medium" | "semibold";
|
|
5
5
|
export type ButtonLayout = "left" | "center" | "right";
|
|
6
6
|
export type ButtonText = "sm" | "md";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export type SelectValue = string | number;
|
|
2
2
|
export type SelectValueState = "placeholder" | "selected";
|
|
3
3
|
export type SelectText = "sm" | "md";
|
|
4
|
-
export type SelectSize = "
|
|
4
|
+
export type SelectSize = "md" | "sm" | "xs";
|
|
5
5
|
export type SelectVariant = "default" | "ghost";
|
|
6
6
|
export type SelectPlacement = "bottom" | "top";
|
|
7
7
|
export type SelectWidth = "full" | "fit";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export type StackDirection = "vertical" | "horizontal";
|
|
2
|
-
export type StackGap = "0" | "1" | "3" | "5" | "7";
|
|
2
|
+
export type StackGap = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8";
|
|
3
3
|
export type StackAlign = "start" | "center" | "end" | "stretch";
|
|
4
4
|
export type StackJustify = "start" | "center" | "end" | "between";
|
|
5
5
|
export interface StackProps {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { IconComponent } from "./icon";
|
|
2
2
|
export type TabsValue = string | number;
|
|
3
|
-
export type TabsSize = "
|
|
3
|
+
export type TabsSize = "md" | "xs";
|
|
4
4
|
export interface TabsItem<Value extends TabsValue = TabsValue> {
|
|
5
5
|
value: Value;
|
|
6
6
|
label: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { IconComponent } from "./icon";
|
|
2
2
|
export type ToggleGroupValue = string | number;
|
|
3
|
-
export type ToggleGroupSize = "
|
|
3
|
+
export type ToggleGroupSize = "md" | "xs";
|
|
4
4
|
export interface ToggleGroupItem<Value extends ToggleGroupValue = ToggleGroupValue> {
|
|
5
5
|
value: Value;
|
|
6
6
|
label?: string;
|
|
@@ -45,7 +45,7 @@ const {
|
|
|
45
45
|
label,
|
|
46
46
|
font = "semibold",
|
|
47
47
|
layout = "center",
|
|
48
|
-
size = "
|
|
48
|
+
size = "md",
|
|
49
49
|
text = "sm",
|
|
50
50
|
variant = "primary",
|
|
51
51
|
disabled = false,
|
|
@@ -89,8 +89,7 @@ const labelLayouts: Record<ButtonLayout, string> = {
|
|
|
89
89
|
};
|
|
90
90
|
|
|
91
91
|
const sizes: Record<ButtonSize, string> = {
|
|
92
|
-
|
|
93
|
-
icon: "p-3",
|
|
92
|
+
md: "p-3",
|
|
94
93
|
sm: "p-2",
|
|
95
94
|
xs: "p-1",
|
|
96
95
|
};
|
|
@@ -113,8 +112,7 @@ const iconSize: Record<ButtonText, number> = {
|
|
|
113
112
|
const variants: Record<ButtonVariant, string> = {
|
|
114
113
|
primary: "bg-primary text-primary-foreground hover:bg-primary-hover active:bg-primary-active",
|
|
115
114
|
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary-hover active:bg-secondary-active",
|
|
116
|
-
outline:
|
|
117
|
-
"bg-secondary text-secondary-foreground ring-1 ring-border ring-inset hover:bg-secondary-hover active:bg-secondary-active",
|
|
115
|
+
outline: "bg-transparent text-foreground ring-1 ring-border ring-inset hover:bg-ghost-hover active:bg-ghost-active",
|
|
118
116
|
ghost: "bg-transparent text-foreground hover:bg-ghost-hover active:bg-ghost-active",
|
|
119
117
|
destructive: "bg-destructive text-destructive-foreground hover:bg-destructive-hover active:bg-destructive-active",
|
|
120
118
|
};
|
|
@@ -44,8 +44,12 @@ const columnsClass: Record<CollectionColumns, string> = {
|
|
|
44
44
|
const gaps: Record<StackGap, string> = {
|
|
45
45
|
"0": "gap-0",
|
|
46
46
|
"1": "gap-1",
|
|
47
|
+
"2": "gap-2",
|
|
47
48
|
"3": "gap-3",
|
|
49
|
+
"4": "gap-4",
|
|
48
50
|
"5": "gap-5",
|
|
51
|
+
"6": "gap-6",
|
|
49
52
|
"7": "gap-7",
|
|
53
|
+
"8": "gap-8",
|
|
50
54
|
};
|
|
51
55
|
</script>
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
<div class="relative grid grid-cols-[auto_minmax(0,1fr)_auto] items-center overflow-hidden rounded-ui">
|
|
6
6
|
<Button
|
|
7
|
-
size="
|
|
7
|
+
size="md"
|
|
8
8
|
variant="ghost"
|
|
9
9
|
:icon-prefix="MinusIcon"
|
|
10
10
|
:disabled="disabled || modelValue <= min"
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
<output class="px-1 text-center tabular-nums">{{ modelValue }}</output>
|
|
16
16
|
|
|
17
17
|
<Button
|
|
18
|
-
size="
|
|
18
|
+
size="md"
|
|
19
19
|
variant="ghost"
|
|
20
20
|
:icon-prefix="AddIcon"
|
|
21
21
|
:disabled="disabled || modelValue >= max"
|
|
@@ -39,7 +39,7 @@ const {
|
|
|
39
39
|
triggerClass,
|
|
40
40
|
triggerLayout = "center",
|
|
41
41
|
triggerVariant = "ghost",
|
|
42
|
-
triggerSize = "
|
|
42
|
+
triggerSize = "md",
|
|
43
43
|
itemSize = undefined,
|
|
44
44
|
contentClass,
|
|
45
45
|
contentPadding = "1",
|
|
@@ -152,7 +152,7 @@ watch(isOpen, async (value) => {
|
|
|
152
152
|
|
|
153
153
|
provide(
|
|
154
154
|
menuSizeKey,
|
|
155
|
-
computed(() => itemSize ??
|
|
155
|
+
computed(() => itemSize ?? triggerSize),
|
|
156
156
|
);
|
|
157
157
|
|
|
158
158
|
provide(menuCloseKey, async () => {
|
|
@@ -17,5 +17,5 @@
|
|
|
17
17
|
import type { NavigateProps } from "../../components/navigate";
|
|
18
18
|
import Button from "./button.vue";
|
|
19
19
|
|
|
20
|
-
const { href, label, iconPrefix, iconSuffix, active = false, size = "
|
|
20
|
+
const { href, label, iconPrefix, iconSuffix, active = false, size = "md" } = defineProps<NavigateProps>();
|
|
21
21
|
</script>
|
|
@@ -184,7 +184,7 @@ const {
|
|
|
184
184
|
options,
|
|
185
185
|
label,
|
|
186
186
|
text = "sm",
|
|
187
|
-
size = "
|
|
187
|
+
size = "md",
|
|
188
188
|
variant = "default",
|
|
189
189
|
placement = "bottom",
|
|
190
190
|
width = "full",
|
|
@@ -233,7 +233,7 @@ const controlTexts: Record<SelectText, string> = {
|
|
|
233
233
|
};
|
|
234
234
|
|
|
235
235
|
const sizes: Record<SelectSize, string> = {
|
|
236
|
-
|
|
236
|
+
md: "p-3",
|
|
237
237
|
sm: "p-2",
|
|
238
238
|
xs: "p-1",
|
|
239
239
|
};
|
|
@@ -41,17 +41,25 @@ const directions: Record<StackDirection, string> = {
|
|
|
41
41
|
const gaps: Record<StackGap, string> = {
|
|
42
42
|
"0": "gap-0",
|
|
43
43
|
"1": "gap-1",
|
|
44
|
+
"2": "gap-2",
|
|
44
45
|
"3": "gap-3",
|
|
46
|
+
"4": "gap-4",
|
|
45
47
|
"5": "gap-5",
|
|
48
|
+
"6": "gap-6",
|
|
46
49
|
"7": "gap-7",
|
|
50
|
+
"8": "gap-8",
|
|
47
51
|
};
|
|
48
52
|
|
|
49
53
|
const paddings: Record<StackGap, string> = {
|
|
50
54
|
"0": "p-0",
|
|
51
55
|
"1": "p-1",
|
|
56
|
+
"2": "p-2",
|
|
52
57
|
"3": "p-3",
|
|
58
|
+
"4": "p-4",
|
|
53
59
|
"5": "p-5",
|
|
60
|
+
"6": "p-6",
|
|
54
61
|
"7": "p-7",
|
|
62
|
+
"8": "p-8",
|
|
55
63
|
};
|
|
56
64
|
|
|
57
65
|
const aligns: Record<StackAlign, string> = {
|
|
@@ -46,7 +46,7 @@ import type { TabsProps, TabsValue } from "../../components/tabs";
|
|
|
46
46
|
import Button from "./button.vue";
|
|
47
47
|
import Stack from "./stack.vue";
|
|
48
48
|
|
|
49
|
-
const { modelValue, items, label, size = "
|
|
49
|
+
const { modelValue, items, label, size = "md" } = defineProps<TabsProps<Value>>();
|
|
50
50
|
|
|
51
51
|
const emit = defineEmits<{
|
|
52
52
|
"update:modelValue": [value: Value];
|
|
@@ -24,7 +24,7 @@ import type { ToggleGroupProps, ToggleGroupValue } from "../../components/toggle
|
|
|
24
24
|
import Button from "./button.vue";
|
|
25
25
|
import Stack from "./stack.vue";
|
|
26
26
|
|
|
27
|
-
const { modelValue, items, label, size = "
|
|
27
|
+
const { modelValue, items, label, size = "md", wrap = true } = defineProps<ToggleGroupProps<Value>>();
|
|
28
28
|
|
|
29
29
|
const emit = defineEmits<{
|
|
30
30
|
"update:modelValue": [value: Value];
|