@bitrix24/b24ui-nuxt 0.5.8 → 0.5.10
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/.nuxt/b24ui/navigation-menu.ts +0 -2
- package/.nuxt/b24ui/popover.ts +1 -1
- package/.nuxt/b24ui/textarea.ts +43 -0
- package/dist/meta.d.mts +5090 -4900
- package/dist/meta.mjs +5090 -4900
- package/dist/module.json +5 -5
- package/dist/module.mjs +11 -7
- package/dist/runtime/components/Advice.vue +47 -54
- package/dist/runtime/components/Advice.vue.d.ts +170 -0
- package/dist/runtime/components/Alert.vue +71 -96
- package/dist/runtime/components/Alert.vue.d.ts +464 -0
- package/dist/runtime/components/App.vue +37 -34
- package/dist/runtime/components/App.vue.d.ts +23 -0
- package/dist/runtime/components/Avatar.vue +69 -81
- package/dist/runtime/components/Avatar.vue.d.ts +281 -0
- package/dist/runtime/components/AvatarGroup.vue +53 -76
- package/dist/runtime/components/AvatarGroup.vue.d.ts +204 -0
- package/dist/runtime/components/Badge.vue +83 -83
- package/dist/runtime/components/Badge.vue.d.ts +517 -0
- package/dist/runtime/components/Button.vue +219 -149
- package/dist/runtime/components/Button.vue.d.ts +640 -0
- package/dist/runtime/components/ButtonGroup.vue +35 -51
- package/dist/runtime/components/ButtonGroup.vue.d.ts +116 -0
- package/dist/runtime/components/Calendar.vue +186 -152
- package/dist/runtime/components/Calendar.vue.d.ts +437 -0
- package/dist/runtime/components/Checkbox.vue +84 -73
- package/dist/runtime/components/Checkbox.vue.d.ts +354 -0
- package/dist/runtime/components/Chip.vue +59 -74
- package/dist/runtime/components/Chip.vue.d.ts +271 -0
- package/dist/runtime/components/Collapsible.vue +44 -41
- package/dist/runtime/components/Collapsible.vue.d.ts +118 -0
- package/dist/runtime/components/Container.vue +18 -27
- package/dist/runtime/components/Container.vue.d.ts +27 -0
- package/dist/runtime/components/Countdown.vue +198 -378
- package/dist/runtime/components/Countdown.vue.d.ts +356 -0
- package/dist/runtime/components/DescriptionList.vue +102 -149
- package/dist/runtime/components/DescriptionList.vue.d.ts +379 -0
- package/dist/runtime/components/DropdownMenu.vue +83 -139
- package/dist/runtime/components/DropdownMenu.vue.d.ts +533 -0
- package/dist/runtime/components/DropdownMenuContent.vue +137 -81
- package/dist/runtime/components/DropdownMenuContent.vue.d.ts +228 -0
- package/dist/runtime/components/Form.vue +162 -216
- package/dist/runtime/components/Form.vue.d.ts +55 -0
- package/dist/runtime/components/FormField.vue +76 -80
- package/dist/runtime/components/FormField.vue.d.ts +282 -0
- package/dist/runtime/components/Input.vue +166 -185
- package/dist/runtime/components/Input.vue.d.ts +755 -0
- package/dist/runtime/components/InputMenu.vue +300 -381
- package/dist/runtime/components/InputMenu.vue.d.ts +1504 -0
- package/dist/runtime/components/InputNumber.vue +180 -177
- package/dist/runtime/components/InputNumber.vue.d.ts +658 -0
- package/dist/runtime/components/Kbd.vue +33 -45
- package/dist/runtime/components/Kbd.vue.d.ts +109 -0
- package/dist/runtime/components/Link.vue +179 -173
- package/dist/runtime/components/Link.vue.d.ts +129 -0
- package/dist/runtime/components/LinkBase.vue +64 -42
- package/dist/runtime/components/LinkBase.vue.d.ts +48 -0
- package/dist/runtime/components/Modal.vue +105 -127
- package/dist/runtime/components/Modal.vue.d.ts +327 -0
- package/dist/runtime/components/ModalDialogClose.vue +4 -8
- package/dist/runtime/components/ModalDialogClose.vue.d.ts +10 -0
- package/dist/runtime/components/Navbar.vue +24 -33
- package/dist/runtime/components/Navbar.vue.d.ts +101 -0
- package/dist/runtime/components/NavbarDivider.vue +24 -33
- package/dist/runtime/components/NavbarDivider.vue.d.ts +101 -0
- package/dist/runtime/components/NavbarSection.vue +24 -33
- package/dist/runtime/components/NavbarSection.vue.d.ts +101 -0
- package/dist/runtime/components/NavbarSpacer.vue +24 -33
- package/dist/runtime/components/NavbarSpacer.vue.d.ts +101 -0
- package/dist/runtime/components/NavigationMenu.vue +152 -216
- package/dist/runtime/components/NavigationMenu.vue.d.ts +824 -0
- package/dist/runtime/components/OverlayProvider.vue +13 -17
- package/dist/runtime/components/OverlayProvider.vue.d.ts +2 -0
- package/dist/runtime/components/Popover.vue +81 -81
- package/dist/runtime/components/Popover.vue.d.ts +147 -0
- package/dist/runtime/components/Progress.vue +109 -136
- package/dist/runtime/components/Progress.vue.d.ts +592 -0
- package/dist/runtime/components/RadioGroup.vue +120 -134
- package/dist/runtime/components/RadioGroup.vue.d.ts +723 -0
- package/dist/runtime/components/Range.vue +94 -85
- package/dist/runtime/components/Range.vue.d.ts +417 -0
- package/dist/runtime/components/Select.vue +212 -260
- package/dist/runtime/components/Select.vue.d.ts +1200 -0
- package/dist/runtime/components/SelectMenu.vue +272 -366
- package/dist/runtime/components/SelectMenu.vue.d.ts +1298 -0
- package/dist/runtime/components/Separator.vue +61 -71
- package/dist/runtime/components/Separator.vue.d.ts +400 -0
- package/dist/runtime/components/Sidebar.vue +24 -33
- package/dist/runtime/components/Sidebar.vue.d.ts +101 -0
- package/dist/runtime/components/SidebarBody.vue +30 -38
- package/dist/runtime/components/SidebarBody.vue.d.ts +90 -0
- package/dist/runtime/components/SidebarFooter.vue +24 -33
- package/dist/runtime/components/SidebarFooter.vue.d.ts +101 -0
- package/dist/runtime/components/SidebarHeader.vue +24 -33
- package/dist/runtime/components/SidebarHeader.vue.d.ts +101 -0
- package/dist/runtime/components/SidebarHeading.vue +24 -33
- package/dist/runtime/components/SidebarHeading.vue.d.ts +101 -0
- package/dist/runtime/components/SidebarLayout.vue +40 -70
- package/dist/runtime/components/SidebarLayout.vue.d.ts +222 -0
- package/dist/runtime/components/SidebarSection.vue +24 -33
- package/dist/runtime/components/SidebarSection.vue.d.ts +101 -0
- package/dist/runtime/components/SidebarSpacer.vue +24 -33
- package/dist/runtime/components/SidebarSpacer.vue.d.ts +101 -0
- package/dist/runtime/components/Skeleton.vue +17 -22
- package/dist/runtime/components/Skeleton.vue.d.ts +26 -0
- package/dist/runtime/components/Slideover.vue +108 -131
- package/dist/runtime/components/Slideover.vue.d.ts +360 -0
- package/dist/runtime/components/StackedLayout.vue +40 -73
- package/dist/runtime/components/StackedLayout.vue.d.ts +192 -0
- package/dist/runtime/components/Switch.vue +100 -95
- package/dist/runtime/components/Switch.vue.d.ts +587 -0
- package/dist/runtime/components/Tabs.vue +83 -105
- package/dist/runtime/components/Tabs.vue.d.ts +453 -0
- package/dist/runtime/components/Textarea.vue +215 -203
- package/dist/runtime/components/Textarea.vue.d.ts +601 -0
- package/dist/runtime/components/Toast.vue +94 -105
- package/dist/runtime/components/Toast.vue.d.ts +438 -0
- package/dist/runtime/components/Toaster.vue +94 -111
- package/dist/runtime/components/Toaster.vue.d.ts +219 -0
- package/dist/runtime/components/Tooltip.vue +78 -64
- package/dist/runtime/components/Tooltip.vue.d.ts +186 -0
- package/dist/runtime/components/content/TableWrapper.vue +58 -70
- package/dist/runtime/components/content/TableWrapper.vue.d.ts +237 -0
- package/dist/runtime/composables/useAvatarGroup.d.ts +1 -1
- package/dist/runtime/composables/useButtonGroup.d.ts +2 -2
- package/dist/runtime/composables/useComponentIcons.d.ts +3 -3
- package/dist/runtime/composables/useFormField.d.ts +1 -1
- package/dist/runtime/prose/A.vue +18 -23
- package/dist/runtime/prose/A.vue.d.ts +84 -0
- package/dist/runtime/prose/Blockquote.vue +18 -23
- package/dist/runtime/prose/Blockquote.vue.d.ts +84 -0
- package/dist/runtime/prose/Code.vue +23 -31
- package/dist/runtime/prose/Code.vue.d.ts +97 -0
- package/dist/runtime/prose/Em.vue +18 -23
- package/dist/runtime/prose/Em.vue.d.ts +84 -0
- package/dist/runtime/prose/H1.vue +18 -23
- package/dist/runtime/prose/H1.vue.d.ts +97 -0
- package/dist/runtime/prose/H2.vue +18 -23
- package/dist/runtime/prose/H2.vue.d.ts +123 -0
- package/dist/runtime/prose/H3.vue +18 -23
- package/dist/runtime/prose/H3.vue.d.ts +123 -0
- package/dist/runtime/prose/H4.vue +18 -23
- package/dist/runtime/prose/H4.vue.d.ts +123 -0
- package/dist/runtime/prose/H5.vue +18 -23
- package/dist/runtime/prose/H5.vue.d.ts +123 -0
- package/dist/runtime/prose/H6.vue +18 -23
- package/dist/runtime/prose/H6.vue.d.ts +123 -0
- package/dist/runtime/prose/Hr.vue +18 -19
- package/dist/runtime/prose/Hr.vue.d.ts +74 -0
- package/dist/runtime/prose/Img.vue +18 -23
- package/dist/runtime/prose/Img.vue.d.ts +77 -0
- package/dist/runtime/prose/Li.vue +18 -23
- package/dist/runtime/prose/Li.vue.d.ts +84 -0
- package/dist/runtime/prose/Ol.vue +18 -23
- package/dist/runtime/prose/Ol.vue.d.ts +84 -0
- package/dist/runtime/prose/P.vue +18 -23
- package/dist/runtime/prose/P.vue.d.ts +84 -0
- package/dist/runtime/prose/Pre.vue +28 -33
- package/dist/runtime/prose/Pre.vue.d.ts +117 -0
- package/dist/runtime/prose/Strong.vue +18 -23
- package/dist/runtime/prose/Strong.vue.d.ts +84 -0
- package/dist/runtime/prose/Table.vue +44 -54
- package/dist/runtime/prose/Table.vue.d.ts +144 -0
- package/dist/runtime/prose/Tbody.vue +18 -23
- package/dist/runtime/prose/Tbody.vue.d.ts +84 -0
- package/dist/runtime/prose/Td.vue +18 -23
- package/dist/runtime/prose/Td.vue.d.ts +84 -0
- package/dist/runtime/prose/Th.vue +18 -23
- package/dist/runtime/prose/Th.vue.d.ts +84 -0
- package/dist/runtime/prose/Thead.vue +18 -23
- package/dist/runtime/prose/Thead.vue.d.ts +84 -0
- package/dist/runtime/prose/Tr.vue +18 -23
- package/dist/runtime/prose/Tr.vue.d.ts +84 -0
- package/dist/runtime/prose/Ul.vue +18 -23
- package/dist/runtime/prose/Ul.vue.d.ts +84 -0
- package/dist/runtime/vue/components/Link.vue +201 -202
- package/dist/runtime/vue/components/Link.vue.d.ts +129 -0
- package/dist/runtime/vue/stubs.d.ts +2 -2
- package/dist/shared/{b24ui-nuxt.DBFS6LH7.mjs → b24ui-nuxt.CS9Lf0os.mjs} +54 -4
- package/dist/types.d.mts +3 -5
- package/dist/unplugin.mjs +1 -1
- package/dist/vite.mjs +1 -1
- package/package.json +62 -35
- package/dist/meta.cjs +0 -71922
- package/dist/meta.d.cts +0 -71920
- package/dist/meta.d.ts +0 -71920
- package/dist/module.cjs +0 -59
- package/dist/module.d.cts +0 -15
- package/dist/module.d.ts +0 -15
- package/dist/shared/b24ui-nuxt.B9fPD5yO.cjs +0 -7671
- package/dist/types.d.ts +0 -7
- package/dist/unplugin.cjs +0 -236
- package/dist/unplugin.d.cts +0 -33
- package/dist/unplugin.d.ts +0 -33
- package/dist/vite.cjs +0 -21
- package/dist/vite.d.cts +0 -14
- package/dist/vite.d.ts +0 -14
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
import type { VariantProps } from 'tailwind-variants';
|
|
2
|
+
declare const buttonGroup: import("tailwind-variants").TVReturnType<{
|
|
3
|
+
size: {
|
|
4
|
+
xs: string;
|
|
5
|
+
sm: string;
|
|
6
|
+
md: string;
|
|
7
|
+
lg: string;
|
|
8
|
+
};
|
|
9
|
+
orientation: {
|
|
10
|
+
horizontal: string;
|
|
11
|
+
vertical: string;
|
|
12
|
+
};
|
|
13
|
+
}, undefined, string, {
|
|
14
|
+
size: {
|
|
15
|
+
xs: string;
|
|
16
|
+
sm: string;
|
|
17
|
+
md: string;
|
|
18
|
+
lg: string;
|
|
19
|
+
};
|
|
20
|
+
orientation: {
|
|
21
|
+
horizontal: string;
|
|
22
|
+
vertical: string;
|
|
23
|
+
};
|
|
24
|
+
}, undefined, import("tailwind-variants").TVReturnType<{
|
|
25
|
+
size: {
|
|
26
|
+
xs: string;
|
|
27
|
+
sm: string;
|
|
28
|
+
md: string;
|
|
29
|
+
lg: string;
|
|
30
|
+
};
|
|
31
|
+
orientation: {
|
|
32
|
+
horizontal: string;
|
|
33
|
+
vertical: string;
|
|
34
|
+
};
|
|
35
|
+
}, undefined, string, {
|
|
36
|
+
size: {
|
|
37
|
+
xs: string;
|
|
38
|
+
sm: string;
|
|
39
|
+
md: string;
|
|
40
|
+
lg: string;
|
|
41
|
+
};
|
|
42
|
+
orientation: {
|
|
43
|
+
horizontal: string;
|
|
44
|
+
vertical: string;
|
|
45
|
+
};
|
|
46
|
+
}, undefined, import("tailwind-variants").TVReturnType<{
|
|
47
|
+
size: {
|
|
48
|
+
xs: string;
|
|
49
|
+
sm: string;
|
|
50
|
+
md: string;
|
|
51
|
+
lg: string;
|
|
52
|
+
};
|
|
53
|
+
orientation: {
|
|
54
|
+
horizontal: string;
|
|
55
|
+
vertical: string;
|
|
56
|
+
};
|
|
57
|
+
}, undefined, string, unknown, unknown, undefined>>>;
|
|
58
|
+
type ButtonGroupVariants = VariantProps<typeof buttonGroup>;
|
|
59
|
+
export interface ButtonGroupProps {
|
|
60
|
+
/**
|
|
61
|
+
* The element or component this component should render as.
|
|
62
|
+
* @defaultValue 'div'
|
|
63
|
+
*/
|
|
64
|
+
as?: any;
|
|
65
|
+
/**
|
|
66
|
+
* @defaultValue 'md'
|
|
67
|
+
*/
|
|
68
|
+
size?: ButtonGroupVariants['size'];
|
|
69
|
+
/**
|
|
70
|
+
* The orientation the buttons are laid out.
|
|
71
|
+
* @defaultValue 'horizontal'
|
|
72
|
+
*/
|
|
73
|
+
orientation?: ButtonGroupVariants['orientation'];
|
|
74
|
+
/**
|
|
75
|
+
* Disable show split
|
|
76
|
+
* @defaultValue false
|
|
77
|
+
*/
|
|
78
|
+
noSplit?: boolean;
|
|
79
|
+
class?: any;
|
|
80
|
+
}
|
|
81
|
+
export interface ButtonGroupSlots {
|
|
82
|
+
default(props?: {}): any;
|
|
83
|
+
}
|
|
84
|
+
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<ButtonGroupProps>, {
|
|
85
|
+
orientation: string;
|
|
86
|
+
noSplit: boolean;
|
|
87
|
+
}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<ButtonGroupProps>, {
|
|
88
|
+
orientation: string;
|
|
89
|
+
noSplit: boolean;
|
|
90
|
+
}>>> & Readonly<{}>, {
|
|
91
|
+
orientation: "horizontal" | "vertical";
|
|
92
|
+
noSplit: boolean;
|
|
93
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, Readonly<ButtonGroupSlots> & ButtonGroupSlots>;
|
|
94
|
+
export default _default;
|
|
95
|
+
type __VLS_WithDefaults<P, D> = {
|
|
96
|
+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_PrettifyLocal<P[K] & {
|
|
97
|
+
default: D[K];
|
|
98
|
+
}> : P[K];
|
|
99
|
+
};
|
|
100
|
+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
101
|
+
type __VLS_TypePropsToOption<T> = {
|
|
102
|
+
[K in keyof T]-?: {} extends Pick<T, K> ? {
|
|
103
|
+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
|
|
104
|
+
} : {
|
|
105
|
+
type: import('vue').PropType<T[K]>;
|
|
106
|
+
required: true;
|
|
107
|
+
};
|
|
108
|
+
};
|
|
109
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
110
|
+
new (): {
|
|
111
|
+
$slots: S;
|
|
112
|
+
};
|
|
113
|
+
};
|
|
114
|
+
type __VLS_PrettifyLocal<T> = {
|
|
115
|
+
[K in keyof T]: T[K];
|
|
116
|
+
} & {};
|
|
@@ -1,164 +1,198 @@
|
|
|
1
|
-
<script
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
import _appConfig from '#build/app.config'
|
|
8
|
-
import theme from '#build/b24ui/calendar'
|
|
9
|
-
import { tv } from '../utils/tv'
|
|
10
|
-
import type { PartialString } from '../types/utils'
|
|
11
|
-
|
|
12
|
-
const appConfigCalendar = _appConfig as AppConfig & { b24ui: { calendar: Partial<typeof theme> } }
|
|
13
|
-
|
|
14
|
-
const calendar = tv({ extend: tv(theme), ...(appConfigCalendar.b24ui?.calendar || {}) })
|
|
15
|
-
|
|
16
|
-
type CalendarVariants = VariantProps<typeof calendar>
|
|
17
|
-
|
|
18
|
-
type CalendarDefaultValue<R extends boolean = false, M extends boolean = false> = R extends true
|
|
19
|
-
? DateRange
|
|
20
|
-
: M extends true
|
|
21
|
-
? DateValue[]
|
|
22
|
-
: DateValue
|
|
23
|
-
type CalendarModelValue<R extends boolean = false, M extends boolean = false> = R extends true
|
|
24
|
-
? (DateRange | null)
|
|
25
|
-
: M extends true
|
|
26
|
-
? (DateValue[] | undefined)
|
|
27
|
-
: (DateValue | undefined)
|
|
28
|
-
|
|
29
|
-
type _CalendarRootProps = Omit<CalendarRootProps, 'as' | 'asChild' | 'modelValue' | 'defaultValue' | 'dir' | 'locale' | 'calendarLabel' | 'multiple'>
|
|
30
|
-
type _RangeCalendarRootProps = Omit<RangeCalendarRootProps, 'as' | 'asChild' | 'modelValue' | 'defaultValue' | 'dir' | 'locale' | 'calendarLabel' | 'multiple'>
|
|
31
|
-
|
|
32
|
-
export interface CalendarProps<R extends boolean = false, M extends boolean = false> extends _RangeCalendarRootProps, _CalendarRootProps {
|
|
33
|
-
/**
|
|
34
|
-
* The element or component this component should render as.
|
|
35
|
-
* @defaultValue 'div'
|
|
36
|
-
*/
|
|
37
|
-
as?: any
|
|
38
|
-
/**
|
|
39
|
-
* The icon to use for the next year control.
|
|
40
|
-
* @defaultValue icons.chevronDoubleRight
|
|
41
|
-
* @IconComponent
|
|
42
|
-
*/
|
|
43
|
-
nextYearIcon?: IconComponent
|
|
44
|
-
/**
|
|
45
|
-
* Configure the next year button.
|
|
46
|
-
* `{ color: 'link' }`{lang="ts"}
|
|
47
|
-
*/
|
|
48
|
-
nextYear?: ButtonProps
|
|
49
|
-
/**
|
|
50
|
-
* The icon to use for the next month control.
|
|
51
|
-
* @defaultValue icons.chevronRight
|
|
52
|
-
* @IconComponent
|
|
53
|
-
*/
|
|
54
|
-
nextMonthIcon?: IconComponent
|
|
55
|
-
/**
|
|
56
|
-
* Configure the next month button.
|
|
57
|
-
* `{ color: 'link' }`{lang="ts"}
|
|
58
|
-
*/
|
|
59
|
-
nextMonth?: ButtonProps
|
|
60
|
-
/**
|
|
61
|
-
* The icon to use for the previous year control.
|
|
62
|
-
* @defaultValue icons.chevronDoubleLeft
|
|
63
|
-
* @IconComponent
|
|
64
|
-
*/
|
|
65
|
-
prevYearIcon?: IconComponent
|
|
66
|
-
/**
|
|
67
|
-
* Configure the prev year button.
|
|
68
|
-
* `{ color: 'link' }`{lang="ts"}
|
|
69
|
-
*/
|
|
70
|
-
prevYear?: ButtonProps
|
|
71
|
-
/**
|
|
72
|
-
* The icon to use for the previous month control.
|
|
73
|
-
* @defaultValue icons.chevronLeft
|
|
74
|
-
* @IconComponent
|
|
75
|
-
*/
|
|
76
|
-
prevMonthIcon?: IconComponent
|
|
77
|
-
/**
|
|
78
|
-
* Configure the prev month button.
|
|
79
|
-
* `{ color: 'link' }`{lang="ts"}
|
|
80
|
-
*/
|
|
81
|
-
prevMonth?: ButtonProps
|
|
82
|
-
/**
|
|
83
|
-
* @defaultValue 'primary'
|
|
84
|
-
*/
|
|
85
|
-
color?: CalendarVariants['color']
|
|
86
|
-
/**
|
|
87
|
-
* @defaultValue 'md'
|
|
88
|
-
*/
|
|
89
|
-
size?: CalendarVariants['size']
|
|
90
|
-
/** Whether a range of dates can be selected */
|
|
91
|
-
range?: R & boolean
|
|
92
|
-
/** Whether multiple dates can be selected */
|
|
93
|
-
multiple?: M & boolean
|
|
94
|
-
/** Show month controls */
|
|
95
|
-
monthControls?: boolean
|
|
96
|
-
/** Show year controls */
|
|
97
|
-
yearControls?: boolean
|
|
98
|
-
defaultValue?: CalendarDefaultValue<R, M>
|
|
99
|
-
modelValue?: CalendarModelValue<R, M>
|
|
100
|
-
class?: any
|
|
101
|
-
b24ui?: PartialString<typeof calendar.slots>
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
export interface CalendarEmits<R extends boolean, M extends boolean> extends Omit<CalendarRootEmits & RangeCalendarRootEmits, 'update:modelValue'> {
|
|
105
|
-
'update:modelValue': [date: CalendarModelValue<R, M>]
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
export interface CalendarSlots {
|
|
109
|
-
'heading': (props: { value: string }) => any
|
|
110
|
-
'day': (props: Pick<CalendarCellTriggerProps, 'day'>) => any
|
|
111
|
-
'week-day': (props: { day: string }) => any
|
|
112
|
-
}
|
|
1
|
+
<script>
|
|
2
|
+
import _appConfig from "#build/app.config";
|
|
3
|
+
import theme from "#build/b24ui/calendar";
|
|
4
|
+
import { tv } from "../utils/tv";
|
|
5
|
+
const appConfigCalendar = _appConfig;
|
|
6
|
+
const calendar = tv({ extend: tv(theme), ...appConfigCalendar.b24ui?.calendar || {} });
|
|
113
7
|
</script>
|
|
114
8
|
|
|
115
|
-
<script setup
|
|
116
|
-
import { computed } from
|
|
117
|
-
import { useForwardPropsEmits } from
|
|
118
|
-
import { Calendar as SingleCalendar, RangeCalendar } from
|
|
119
|
-
import { reactiveOmit } from
|
|
120
|
-
import { useLocale } from
|
|
121
|
-
import icons from
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
9
|
+
<script setup>
|
|
10
|
+
import { computed } from "vue";
|
|
11
|
+
import { useForwardPropsEmits } from "reka-ui";
|
|
12
|
+
import { Calendar as SingleCalendar, RangeCalendar } from "reka-ui/namespaced";
|
|
13
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
14
|
+
import { useLocale } from "../composables/useLocale";
|
|
15
|
+
import icons from "../dictionary/icons";
|
|
16
|
+
const props = defineProps({
|
|
17
|
+
as: {
|
|
18
|
+
type: null,
|
|
19
|
+
required: false
|
|
20
|
+
},
|
|
21
|
+
nextYearIcon: {
|
|
22
|
+
type: [Function, Object],
|
|
23
|
+
required: false
|
|
24
|
+
},
|
|
25
|
+
nextYear: {
|
|
26
|
+
type: Object,
|
|
27
|
+
required: false
|
|
28
|
+
},
|
|
29
|
+
nextMonthIcon: {
|
|
30
|
+
type: [Function, Object],
|
|
31
|
+
required: false
|
|
32
|
+
},
|
|
33
|
+
nextMonth: {
|
|
34
|
+
type: Object,
|
|
35
|
+
required: false
|
|
36
|
+
},
|
|
37
|
+
prevYearIcon: {
|
|
38
|
+
type: [Function, Object],
|
|
39
|
+
required: false
|
|
40
|
+
},
|
|
41
|
+
prevYear: {
|
|
42
|
+
type: Object,
|
|
43
|
+
required: false
|
|
44
|
+
},
|
|
45
|
+
prevMonthIcon: {
|
|
46
|
+
type: [Function, Object],
|
|
47
|
+
required: false
|
|
48
|
+
},
|
|
49
|
+
prevMonth: {
|
|
50
|
+
type: Object,
|
|
51
|
+
required: false
|
|
52
|
+
},
|
|
53
|
+
color: {
|
|
54
|
+
type: null,
|
|
55
|
+
required: false
|
|
56
|
+
},
|
|
57
|
+
size: {
|
|
58
|
+
type: null,
|
|
59
|
+
required: false
|
|
60
|
+
},
|
|
61
|
+
range: {
|
|
62
|
+
type: Boolean,
|
|
63
|
+
required: false
|
|
64
|
+
},
|
|
65
|
+
multiple: {
|
|
66
|
+
type: Boolean,
|
|
67
|
+
required: false
|
|
68
|
+
},
|
|
69
|
+
monthControls: {
|
|
70
|
+
type: Boolean,
|
|
71
|
+
required: false,
|
|
72
|
+
default: true
|
|
73
|
+
},
|
|
74
|
+
yearControls: {
|
|
75
|
+
type: Boolean,
|
|
76
|
+
required: false,
|
|
77
|
+
default: true
|
|
78
|
+
},
|
|
79
|
+
defaultValue: {
|
|
80
|
+
type: null,
|
|
81
|
+
required: false
|
|
82
|
+
},
|
|
83
|
+
modelValue: {
|
|
84
|
+
type: null,
|
|
85
|
+
required: false
|
|
86
|
+
},
|
|
87
|
+
class: {
|
|
88
|
+
type: null,
|
|
89
|
+
required: false
|
|
90
|
+
},
|
|
91
|
+
b24ui: {
|
|
92
|
+
type: null,
|
|
93
|
+
required: false
|
|
94
|
+
},
|
|
95
|
+
defaultPlaceholder: {
|
|
96
|
+
type: null,
|
|
97
|
+
required: false
|
|
98
|
+
},
|
|
99
|
+
placeholder: {
|
|
100
|
+
type: null,
|
|
101
|
+
required: false
|
|
102
|
+
},
|
|
103
|
+
allowNonContiguousRanges: {
|
|
104
|
+
type: Boolean,
|
|
105
|
+
required: false
|
|
106
|
+
},
|
|
107
|
+
pagedNavigation: {
|
|
108
|
+
type: Boolean,
|
|
109
|
+
required: false
|
|
110
|
+
},
|
|
111
|
+
preventDeselect: {
|
|
112
|
+
type: Boolean,
|
|
113
|
+
required: false
|
|
114
|
+
},
|
|
115
|
+
weekStartsOn: {
|
|
116
|
+
type: Number,
|
|
117
|
+
required: false
|
|
118
|
+
},
|
|
119
|
+
weekdayFormat: {
|
|
120
|
+
type: String,
|
|
121
|
+
required: false
|
|
122
|
+
},
|
|
123
|
+
fixedWeeks: {
|
|
124
|
+
type: Boolean,
|
|
125
|
+
required: false,
|
|
126
|
+
default: true
|
|
127
|
+
},
|
|
128
|
+
maxValue: {
|
|
129
|
+
type: null,
|
|
130
|
+
required: false
|
|
131
|
+
},
|
|
132
|
+
minValue: {
|
|
133
|
+
type: null,
|
|
134
|
+
required: false
|
|
135
|
+
},
|
|
136
|
+
numberOfMonths: {
|
|
137
|
+
type: Number,
|
|
138
|
+
required: false
|
|
139
|
+
},
|
|
140
|
+
disabled: {
|
|
141
|
+
type: Boolean,
|
|
142
|
+
required: false
|
|
143
|
+
},
|
|
144
|
+
readonly: {
|
|
145
|
+
type: Boolean,
|
|
146
|
+
required: false
|
|
147
|
+
},
|
|
148
|
+
initialFocus: {
|
|
149
|
+
type: Boolean,
|
|
150
|
+
required: false
|
|
151
|
+
},
|
|
152
|
+
isDateDisabled: {
|
|
153
|
+
type: Function,
|
|
154
|
+
required: false
|
|
155
|
+
},
|
|
156
|
+
isDateUnavailable: {
|
|
157
|
+
type: Function,
|
|
158
|
+
required: false
|
|
159
|
+
},
|
|
160
|
+
nextPage: {
|
|
161
|
+
type: Function,
|
|
162
|
+
required: false
|
|
163
|
+
},
|
|
164
|
+
prevPage: {
|
|
165
|
+
type: Function,
|
|
166
|
+
required: false
|
|
167
|
+
}
|
|
168
|
+
});
|
|
169
|
+
const emits = defineEmits(["update:modelValue", "update:placeholder", "update:startValue"]);
|
|
170
|
+
defineSlots();
|
|
171
|
+
const { code: locale, dir, t } = useLocale();
|
|
172
|
+
const rootProps = useForwardPropsEmits(reactiveOmit(props, "range", "modelValue", "defaultValue", "color", "size", "monthControls", "yearControls", "class", "b24ui"), emits);
|
|
173
|
+
const nextYearIcon = computed(() => props.nextYearIcon || (dir.value === "rtl" ? icons.chevronDoubleLeft : icons.chevronDoubleRight));
|
|
174
|
+
const nextMonthIcon = computed(() => props.nextMonthIcon || (dir.value === "rtl" ? icons.chevronLeft : icons.chevronRight));
|
|
175
|
+
const prevYearIcon = computed(() => props.prevYearIcon || (dir.value === "rtl" ? icons.chevronDoubleRight : icons.chevronDoubleLeft));
|
|
176
|
+
const prevMonthIcon = computed(() => props.prevMonthIcon || (dir.value === "rtl" ? icons.chevronRight : icons.chevronLeft));
|
|
141
177
|
const b24ui = computed(() => calendar({
|
|
142
178
|
color: props.color,
|
|
143
179
|
size: props.size
|
|
144
|
-
}))
|
|
145
|
-
|
|
146
|
-
function paginateYear(date: DateValue, sign: -1 | 1) {
|
|
180
|
+
}));
|
|
181
|
+
function paginateYear(date, sign) {
|
|
147
182
|
if (sign === -1) {
|
|
148
|
-
return date.subtract({ years: 1 })
|
|
183
|
+
return date.subtract({ years: 1 });
|
|
149
184
|
}
|
|
150
|
-
|
|
151
|
-
return date.add({ years: 1 })
|
|
185
|
+
return date.add({ years: 1 });
|
|
152
186
|
}
|
|
153
|
-
|
|
154
|
-
const Calendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
|
|
155
|
-
|
|
187
|
+
const Calendar = computed(() => props.range ? RangeCalendar : SingleCalendar);
|
|
156
188
|
const btnSize = computed(() => {
|
|
157
189
|
switch (props.size) {
|
|
158
|
-
case
|
|
159
|
-
|
|
190
|
+
case "lg":
|
|
191
|
+
return "sm";
|
|
192
|
+
default:
|
|
193
|
+
return "xs";
|
|
160
194
|
}
|
|
161
|
-
})
|
|
195
|
+
});
|
|
162
196
|
</script>
|
|
163
197
|
|
|
164
198
|
<template>
|
|
@@ -172,7 +206,7 @@ const btnSize = computed(() => {
|
|
|
172
206
|
:class="b24ui.root({ class: [props.class, props.b24ui?.root] })"
|
|
173
207
|
>
|
|
174
208
|
<Calendar.Header :class="b24ui.header({ class: props.b24ui?.header })">
|
|
175
|
-
<Calendar.Prev v-if="props.yearControls" :prev-page="(date
|
|
209
|
+
<Calendar.Prev v-if="props.yearControls" :prev-page="(date) => paginateYear(date, -1)" :aria-label="t('calendar.prevYear')" as-child>
|
|
176
210
|
<B24Button :icon="prevYearIcon" :size="btnSize" color="link" v-bind="props.prevYear" />
|
|
177
211
|
</Calendar.Prev>
|
|
178
212
|
<Calendar.Prev v-if="props.monthControls" :aria-label="t('calendar.prevMonth')" as-child>
|
|
@@ -186,7 +220,7 @@ const btnSize = computed(() => {
|
|
|
186
220
|
<Calendar.Next v-if="props.monthControls" :aria-label="t('calendar.nextMonth')" as-child>
|
|
187
221
|
<B24Button :icon="nextMonthIcon" :size="btnSize" color="link" v-bind="props.nextMonth" />
|
|
188
222
|
</Calendar.Next>
|
|
189
|
-
<Calendar.Next v-if="props.yearControls" :next-page="(date
|
|
223
|
+
<Calendar.Next v-if="props.yearControls" :next-page="(date) => paginateYear(date, 1)" :aria-label="t('calendar.nextYear')" as-child>
|
|
190
224
|
<B24Button :icon="nextYearIcon" :size="btnSize" color="link" v-bind="props.nextYear" />
|
|
191
225
|
</Calendar.Next>
|
|
192
226
|
</Calendar.Header>
|