@bagelink/vue 1.2.33 → 1.2.41
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/calendar/CalendarPopover.vue.d.ts +179 -0
- package/dist/components/calendar/CalendarPopover.vue.d.ts.map +1 -0
- package/dist/components/calendar/CalendarTypes.d.ts +15 -0
- package/dist/components/calendar/CalendarTypes.d.ts.map +1 -1
- package/dist/components/calendar/Index.vue.d.ts +21 -12
- package/dist/components/calendar/Index.vue.d.ts.map +1 -1
- package/dist/components/calendar/views/AgendaView.vue.d.ts +8 -0
- package/dist/components/calendar/views/AgendaView.vue.d.ts.map +1 -1
- package/dist/components/calendar/views/CalendarPopover.vue.d.ts +175 -0
- package/dist/components/calendar/views/CalendarPopover.vue.d.ts.map +1 -0
- package/dist/components/calendar/views/DayView.vue.d.ts +10 -32
- package/dist/components/calendar/views/DayView.vue.d.ts.map +1 -1
- package/dist/components/calendar/views/MonthView.vue.d.ts +10 -170
- package/dist/components/calendar/views/MonthView.vue.d.ts.map +1 -1
- package/dist/components/calendar/views/WeekView.vue.d.ts +12 -168
- package/dist/components/calendar/views/WeekView.vue.d.ts.map +1 -1
- package/dist/components/form/inputs/DateInput.vue.d.ts.map +1 -1
- package/dist/components/form/inputs/DatePicker.vue.d.ts.map +1 -1
- package/dist/composables/useDevice.d.ts +3 -0
- package/dist/composables/useDevice.d.ts.map +1 -1
- package/dist/index.cjs +446 -309
- package/dist/index.mjs +446 -309
- package/dist/style.css +231 -179
- package/dist/types/BagelForm.d.ts +14 -11
- package/dist/types/BagelForm.d.ts.map +1 -1
- package/dist/utils/BagelFormUtils.d.ts +10 -10
- package/dist/utils/BagelFormUtils.d.ts.map +1 -1
- package/dist/utils/calendar/dateUtils.d.ts +10 -10
- package/dist/utils/calendar/dateUtils.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/calendar/CalendarPopover.vue +102 -0
- package/src/components/calendar/CalendarTypes.ts +14 -0
- package/src/components/calendar/Index.vue +77 -35
- package/src/components/calendar/views/AgendaView.vue +26 -2
- package/src/components/calendar/views/DayView.vue +83 -104
- package/src/components/calendar/views/MonthView.vue +39 -67
- package/src/components/calendar/views/WeekView.vue +229 -136
- package/src/components/form/inputs/DateInput.vue +14 -3
- package/src/components/form/inputs/DatePicker.vue +7 -0
- package/src/composables/useDevice.ts +13 -2
- package/src/styles/layout.css +14 -0
- package/src/styles/mobilLayout.css +12 -0
- package/src/types/BagelForm.ts +30 -53
- package/src/utils/BagelFormUtils.ts +11 -10
- package/src/utils/calendar/dateUtils.ts +42 -45
- package/src/components/calendar/utils.ts +0 -70
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BagelForm.d.ts","sourceRoot":"","sources":["../../src/types/BagelForm.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAC3D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,CAAA;AAChC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAElE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,CAAA;AAEvG,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,KAAK,cAAc,CAAA;AAEpE,MAAM,WAAW,UAAU,CAAC,CAAC;IAC5B,CAAC,GAAG,EAAE,MAAM,GAAG,cAAc,GAAG,WAAW,CAAC,CAAC,CAAC,CAAA;CAC9C;AAED,MAAM,MAAM,iBAAiB,CAAC,CAAC,IAAI,CAClC,MAAM,GACJ,CACD;IACC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;CACtB,GACC,MAAM,GACN,MAAM,GACN,OAAO,GACP;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,CACxB,EAAE,GACD,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC,CACnC,CAAA;AAED,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"BagelForm.d.ts","sourceRoot":"","sources":["../../src/types/BagelForm.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ArrayFieldVal, BaseBagelField, BglFormSchemaT, Field, IconType, InputBagelField, Option, Path, SchemaChildrenT, SelectBagelField, VIfType } from '..';
|
|
2
2
|
import { UploadInputProps } from '../components/form/inputs/Upload/upload.types';
|
|
3
|
-
interface InputOptions<T, K
|
|
3
|
+
interface InputOptions<T, K extends Path<T>> {
|
|
4
4
|
required?: boolean;
|
|
5
5
|
placeholder?: string;
|
|
6
6
|
class?: string;
|
|
@@ -10,13 +10,13 @@ interface InputOptions<T, K> {
|
|
|
10
10
|
autocomplete?: string;
|
|
11
11
|
vIf?: VIfType<T, K>;
|
|
12
12
|
}
|
|
13
|
-
interface DateOptions<T, K
|
|
13
|
+
interface DateOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
14
14
|
enableTime?: boolean;
|
|
15
15
|
mode?: 'day' | 'month' | 'year';
|
|
16
16
|
locale?: string;
|
|
17
17
|
timezone?: string;
|
|
18
18
|
}
|
|
19
|
-
interface TextInputOptions<T, K
|
|
19
|
+
interface TextInputOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
20
20
|
type?: 'text' | 'tel' | 'email' | 'time';
|
|
21
21
|
pattern?: string;
|
|
22
22
|
multiline?: boolean;
|
|
@@ -26,13 +26,13 @@ interface TextInputOptions<T, K> extends InputOptions<T, K> {
|
|
|
26
26
|
icon?: IconType;
|
|
27
27
|
iconStart?: IconType;
|
|
28
28
|
}
|
|
29
|
-
interface SlctInputOptions<T, K
|
|
29
|
+
interface SlctInputOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
30
30
|
searchable?: boolean;
|
|
31
31
|
multiselect?: boolean;
|
|
32
32
|
clearable?: boolean;
|
|
33
33
|
onSearch?: (search: string) => any;
|
|
34
34
|
}
|
|
35
|
-
interface NumFieldOptions<T, K
|
|
35
|
+
interface NumFieldOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
36
36
|
max?: number;
|
|
37
37
|
min?: number;
|
|
38
38
|
step?: number;
|
|
@@ -41,22 +41,22 @@ interface NumFieldOptions<T, K> extends InputOptions<T, K> {
|
|
|
41
41
|
center?: boolean;
|
|
42
42
|
useGrouping?: boolean;
|
|
43
43
|
}
|
|
44
|
-
type RichTextOptions<T, K
|
|
44
|
+
type RichTextOptions<T, K extends Path<T>> = InputOptions<T, K>;
|
|
45
45
|
export declare function getBaseField<T, P extends Path<T>>(id?: P, labelOrRest?: string | Partial<BaseBagelField<T, P>>, rest?: Partial<BaseBagelField<T, P>>): BaseBagelField<T, P>;
|
|
46
46
|
export declare function richText<T, P extends Path<T>>(id: P, label?: string, options?: RichTextOptions<T, P>): BaseBagelField<T, P>;
|
|
47
47
|
export declare function txtField<T, P extends Path<T>>(id: P, label?: string, options?: TextInputOptions<T, P> & Partial<BaseBagelField<T, P>>): BaseBagelField<T, P> | InputBagelField<T>;
|
|
48
48
|
export declare function selectField<T, P extends Path<T>>(id: P, label?: string, options?: Option[] | (() => Option[]), config?: SlctInputOptions<T, P>): BaseBagelField<T, P> | SelectBagelField<T>;
|
|
49
49
|
export declare const slctField: typeof selectField;
|
|
50
|
-
interface CheckInputOptions<T, K
|
|
50
|
+
interface CheckInputOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
51
51
|
value?: string;
|
|
52
52
|
}
|
|
53
53
|
export declare function checkField<T, P extends Path<T>>(id: P, label?: string, options?: CheckInputOptions<T, P>): BaseBagelField<T, P>;
|
|
54
54
|
export declare function dateField<T, P extends Path<T>>(id: P, label?: string, options?: DateOptions<T, P>): BaseBagelField<T, P>;
|
|
55
55
|
export declare function numField<T, P extends Path<T>>(id: P, label?: string, options?: NumFieldOptions<T, P>): BaseBagelField<T, P>;
|
|
56
56
|
export declare function frmRow<T>(...children: SchemaChildrenT<T>): Field<T>;
|
|
57
|
-
export type UploadOptions<T, K
|
|
57
|
+
export type UploadOptions<T, K extends Path<T>> = InputOptions<T, K> & UploadInputProps;
|
|
58
58
|
export declare function uploadField<T, P extends Path<T>>(id: P, label?: string, options?: UploadOptions<T, P>): BaseBagelField<T, P>;
|
|
59
|
-
interface RangeOptions<T, K
|
|
59
|
+
interface RangeOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
60
60
|
min?: number;
|
|
61
61
|
max?: number;
|
|
62
62
|
step?: number;
|
|
@@ -85,7 +85,7 @@ export declare function colorField<T, P extends Path<T>>(id: P, label?: string,
|
|
|
85
85
|
[key: string]: any;
|
|
86
86
|
}): BaseBagelField<T, P>;
|
|
87
87
|
export declare function findBglFieldById<T>(id: string, _schema: BglFormSchemaT<T>): Field<T> | undefined;
|
|
88
|
-
export interface ArrayFieldOptions<T, K
|
|
88
|
+
export interface ArrayFieldOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
89
89
|
delete?: boolean;
|
|
90
90
|
add?: boolean;
|
|
91
91
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAc,cAAc,EAAE,cAAc,EAAE,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAC1L,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,+CAA+C,CAAA;AAErF,UAAU,YAAY,CAAC,CAAC,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAc,cAAc,EAAE,cAAc,EAAE,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAC1L,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,+CAA+C,CAAA;AAErF,UAAU,YAAY,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,GAAG,CAAC,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;CACnB;AAED,UAAU,WAAW,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IACrE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,MAAM,CAAA;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,UAAU,gBAAgB,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAC1E,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAA;IACxC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,SAAS,CAAC,EAAE,QAAQ,CAAA;CACpB;AAED,UAAU,gBAAgB,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAC1E,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,GAAG,CAAA;CAClC;AAED,UAAU,eAAe,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IACzE,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,YAAY,CAAA;IAC9C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,IAAI,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;AAE/D,wBAAgB,YAAY,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAChD,EAAE,CAAC,EAAE,CAAC,EACN,WAAW,GAAE,MAAM,GAAG,OAAO,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAAM,EACxD,IAAI,GAAE,OAAO,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAAM,GACtC,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAGtB;AAED,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC5C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAC7B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAatB;AAED,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC5C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,OAAO,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAC9D,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,eAAe,CAAC,CAAC,CAAC,CAyB3C;AAED,wBAAgB,WAAW,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC/C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,MAAM,EAAE,CAAC,EACrC,MAAM,CAAC,EAAE,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC7B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAoB5C;AAED,eAAO,MAAM,SAAS,oBAAc,CAAA;AAEpC,UAAU,iBAAiB,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAA;CACd;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC9C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC/B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAWtB;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC7C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,GACzB,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAmBtB;AAED,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC5C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAC7B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAuBtB;AAGD,wBAAgB,MAAM,CAAC,CAAC,EAAE,GAAG,QAAQ,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAMnE;AAED,MAAM,MAAM,aAAa,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,IAAI,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,gBAAgB,CAAA;AAEvF,wBAAgB,WAAW,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAU5H;AAED,UAAU,YAAY,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IACtE,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACvC;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC9C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,YAAY,CAAE,CAAC,EAAE,CAAC,CAAC,GAC3B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAgBtB;AAED,wBAAgB,OAAO,CAAC,CAAC,EAAE,SAAS,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE;;;;;;;;;;;;EAgB9E;AAED,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC5C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,GAC9B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAStB;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC9C,EAAE,EAAE,CAAC,EACL,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,GAC9B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAStB;AAED,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,SAAS,CAYhG;AAED,MAAM,WAAW,iBAAiB,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAClF,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,GAAG,CAAC,EAAE,OAAO,CAAA;CACb;AAED,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAA;AAEzC,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,EAC5C,EAAE,EAAE,CAAC,EACL,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,cAAc,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,SAAS,EAC7D,OAAO,CAAC,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC/B,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAiBtB;AAqBD,wBAAgB,OAAO,IAAI;IAC1B,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,WAAW,EAAE,OAAO,WAAW,CAAA;IAC/B,UAAU,EAAE,OAAO,UAAU,CAAA;IAC7B,SAAS,EAAE,OAAO,SAAS,CAAA;IAC3B,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,MAAM,EAAE,OAAO,MAAM,CAAA;IACrB,WAAW,EAAE,OAAO,WAAW,CAAA;IAC/B,UAAU,EAAE,OAAO,UAAU,CAAA;IAC7B,OAAO,EAAE,OAAO,OAAO,CAAA;IACvB,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,UAAU,EAAE,OAAO,UAAU,CAAA;IAC7B,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,gBAAgB,EAAE,OAAO,gBAAgB,CAAA;CACzC,CAiBA"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { DateLike } from '@vueuse/core';
|
|
2
2
|
import { AvailableTimeLanguages, DateTimeAcceptedFormats } from '../../types/timeAgoT';
|
|
3
3
|
interface TimeDeltaOptions {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
4
|
+
Day?: number;
|
|
5
|
+
Hour?: number;
|
|
6
|
+
Minute?: number;
|
|
7
|
+
Second?: number;
|
|
8
|
+
Week?: number;
|
|
9
|
+
Month?: number;
|
|
10
|
+
Year?: number;
|
|
11
11
|
}
|
|
12
12
|
export declare function timeDelta(date: string | Date, options: TimeDeltaOptions): Date;
|
|
13
13
|
export declare function timeAgo(date: string | Date, lang?: AvailableTimeLanguages): string;
|
|
@@ -17,8 +17,8 @@ export declare function timeAgo(date: string | Date, lang?: AvailableTimeLanguag
|
|
|
17
17
|
* @param timeZone The timezone to use (e.g., 'UTC', 'America/New_York')
|
|
18
18
|
* @returns Date parts with timezone adjustment applied
|
|
19
19
|
*/
|
|
20
|
-
export declare function handleTimezone(date: Date,
|
|
21
|
-
export declare function getDatePartsMap(date: Date, locale: Intl.LocalesArgument,
|
|
20
|
+
export declare function handleTimezone(date: Date, locale: Intl.LocalesArgument, intFmtOpt: Intl.DateTimeFormatOptions): Date;
|
|
21
|
+
export declare function getDatePartsMap(date: Date, locale: Intl.LocalesArgument, intFmtOpt?: Intl.DateTimeFormatOptions): {
|
|
22
22
|
AmPm: string;
|
|
23
23
|
DD: string;
|
|
24
24
|
DDD: string;
|
|
@@ -33,7 +33,7 @@ export declare function getDatePartsMap(date: Date, locale: Intl.LocalesArgument
|
|
|
33
33
|
YY: string;
|
|
34
34
|
YYYY: string;
|
|
35
35
|
};
|
|
36
|
-
export interface FormatDateOptions {
|
|
36
|
+
export interface FormatDateOptions extends Partial<Pick<Intl.DateTimeFormatOptions, 'hour12'>> {
|
|
37
37
|
fmt?: DateTimeAcceptedFormats;
|
|
38
38
|
locale?: Intl.LocalesArgument;
|
|
39
39
|
tz?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateUtils.d.ts","sourceRoot":"","sources":["../../../src/utils/calendar/dateUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAC5C,OAAO,KAAK,EAAE,sBAAsB,EAAE,uBAAuB,EAAkC,MAAM,sBAAsB,CAAA;AAE3H,UAAU,gBAAgB;IACzB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,OAAO,EAAE,gBAAgB,QAyBvE;AAqDD,wBAAgB,OAAO,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,IAAI,GAAE,sBAA6B,UAsD/E;AASD;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,
|
|
1
|
+
{"version":3,"file":"dateUtils.d.ts","sourceRoot":"","sources":["../../../src/utils/calendar/dateUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAC5C,OAAO,KAAK,EAAE,sBAAsB,EAAE,uBAAuB,EAAkC,MAAM,sBAAsB,CAAA;AAE3H,UAAU,gBAAgB;IACzB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,OAAO,EAAE,gBAAgB,QAyBvE;AAqDD,wBAAgB,OAAO,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,IAAI,GAAE,sBAA6B,UAsD/E;AASD;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,eAAe,EAAE,SAAS,EAAE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAuCpH;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,EAAE,IAAI,CAAC,qBAAqB;;;;;;;;;;;;;;EAqB/G;AAcD,MAAM,WAAW,iBAAkB,SAAQ,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,QAAQ,CAAC,CAAC;IAC7F,GAAG,CAAC,EAAE,uBAAuB,CAAA;IAC7B,MAAM,CAAC,EAAE,IAAI,CAAC,eAAe,CAAA;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAA;CACX;AACD;;;;;;;;GAQG;AACH,wBAAgB,UAAU,CACzB,IAAI,CAAC,EAAE,QAAQ,EACf,IAAI,GAAE,iBAAsB,GAC1B,MAAM,CAuER;AACD,eAAO,MAAM,OAAO,mBAAa,CAAA"}
|
package/package.json
CHANGED
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { CalendarEvent } from './CalendarTypes'
|
|
3
|
+
import { Card, useDevice } from '@bagelink/vue'
|
|
4
|
+
import { ref, computed } from 'vue'
|
|
5
|
+
|
|
6
|
+
const props = defineProps<{
|
|
7
|
+
event?: CalendarEvent
|
|
8
|
+
targetElement?: HTMLElement
|
|
9
|
+
position?: { top: number, left: number }
|
|
10
|
+
show: boolean
|
|
11
|
+
hasEventContentSlot: boolean
|
|
12
|
+
}>()
|
|
13
|
+
const emit = defineEmits<{
|
|
14
|
+
(e: 'close'): void
|
|
15
|
+
(e: 'eventClick', event: CalendarEvent): void
|
|
16
|
+
}>()
|
|
17
|
+
const { scrollY, scrollX, innerHeight, innerWidth } = useDevice()
|
|
18
|
+
const popoverRef = ref<HTMLElement>()
|
|
19
|
+
|
|
20
|
+
const popoverPosition = computed(() => {
|
|
21
|
+
const popoverWidth = 400
|
|
22
|
+
const margin = 10
|
|
23
|
+
|
|
24
|
+
if (props.position) {
|
|
25
|
+
// If position is directly provided, use it
|
|
26
|
+
let { top, left } = props.position
|
|
27
|
+
top -= 80
|
|
28
|
+
|
|
29
|
+
// Keep popover within viewport bounds
|
|
30
|
+
top = Math.max(scrollY.value + margin, Math.min(top, innerHeight.value + scrollY.value - 150 - 10))
|
|
31
|
+
left = Math.max(scrollX.value + margin, Math.min(left, innerWidth.value + scrollX.value - popoverWidth - margin))
|
|
32
|
+
|
|
33
|
+
return { top, left, width: popoverWidth, height: 150 }
|
|
34
|
+
} else if (props.targetElement && props.show) {
|
|
35
|
+
// Position relative to target element
|
|
36
|
+
const target = props.targetElement
|
|
37
|
+
const rect = target.getBoundingClientRect()
|
|
38
|
+
|
|
39
|
+
let top = rect.top + scrollY.value + (rect.height / 2) - (150 / 2)
|
|
40
|
+
let left = rect.left + scrollX.value + rect.width + margin
|
|
41
|
+
|
|
42
|
+
// Keep popover within viewport bounds
|
|
43
|
+
top = Math.max(scrollY.value + margin, Math.min(top, innerHeight.value + scrollY.value - 150 - 10))
|
|
44
|
+
|
|
45
|
+
// If it would go off right side, position to the left instead
|
|
46
|
+
if (left + popoverWidth > innerWidth.value + scrollX.value) {
|
|
47
|
+
left = rect.left + scrollX.value - popoverWidth + rect.width - margin
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
if (left < scrollX.value) left = rect.right + scrollX.value + margin
|
|
51
|
+
|
|
52
|
+
return { top, left, width: popoverWidth, height: 150 }
|
|
53
|
+
}
|
|
54
|
+
return { top: 0, left: 0, width: popoverWidth, height: 150 }
|
|
55
|
+
})
|
|
56
|
+
|
|
57
|
+
function closePopover() {
|
|
58
|
+
emit('close')
|
|
59
|
+
}
|
|
60
|
+
</script>
|
|
61
|
+
|
|
62
|
+
<template>
|
|
63
|
+
<Card
|
|
64
|
+
v-if="show && event"
|
|
65
|
+
ref="popoverRef"
|
|
66
|
+
v-click-outside="closePopover"
|
|
67
|
+
thin
|
|
68
|
+
class="custom-popover"
|
|
69
|
+
:style="{
|
|
70
|
+
top: `${popoverPosition.top}px`,
|
|
71
|
+
left: `${popoverPosition.left}px`,
|
|
72
|
+
maxWidth: `${popoverPosition.width}px`,
|
|
73
|
+
}"
|
|
74
|
+
>
|
|
75
|
+
<slot name="eventContent" :event="event" />
|
|
76
|
+
</Card>
|
|
77
|
+
</template>
|
|
78
|
+
|
|
79
|
+
<style scoped>
|
|
80
|
+
.custom-popover {
|
|
81
|
+
position: fixed;
|
|
82
|
+
z-index: 1000;
|
|
83
|
+
min-width: 250px;
|
|
84
|
+
max-width: 350px;
|
|
85
|
+
background-color: white;
|
|
86
|
+
border-radius: var(--btn-border-radius);
|
|
87
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
|
88
|
+
animation: fadeIn 0.2s ease;
|
|
89
|
+
transform-origin: center left;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
@keyframes fadeIn {
|
|
93
|
+
from {
|
|
94
|
+
opacity: 0;
|
|
95
|
+
transform: scale(0.95);
|
|
96
|
+
}
|
|
97
|
+
to {
|
|
98
|
+
opacity: 1;
|
|
99
|
+
transform: scale(1);
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
</style>
|
|
@@ -11,3 +11,17 @@ export interface CalendarEvent {
|
|
|
11
11
|
export type CalendarView = 'Week' | 'Month' | 'Day' | 'Agenda'
|
|
12
12
|
|
|
13
13
|
export type WeekStart = 'Sunday' | 'Monday'
|
|
14
|
+
|
|
15
|
+
export interface CalendarProps {
|
|
16
|
+
events?: CalendarEvent[]
|
|
17
|
+
startDate?: Date
|
|
18
|
+
view?: CalendarView
|
|
19
|
+
weekStart?: WeekStart
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export interface CalendarViewState {
|
|
23
|
+
currentView?: CalendarView
|
|
24
|
+
weekStart?: WeekStart
|
|
25
|
+
visibleDateRange?: { start: Date, end: Date }
|
|
26
|
+
currentDate?: Date
|
|
27
|
+
}
|
|
@@ -1,24 +1,19 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
2
|
import type { Component } from 'vue'
|
|
3
|
-
import type { CalendarEvent, CalendarView,
|
|
3
|
+
import type { CalendarEvent, CalendarProps, CalendarView, CalendarViewState } from './CalendarTypes'
|
|
4
4
|
import { timeDelta, Btn, ListItem, Dropdown, fmtDate } from '@bagelink/vue'
|
|
5
|
-
import { ref, computed } from 'vue'
|
|
5
|
+
import { ref, computed, onMounted } from 'vue'
|
|
6
|
+
import CalendarPopover from './CalendarPopover.vue'
|
|
6
7
|
import AgendaView from './views/AgendaView.vue'
|
|
7
8
|
import DayView from './views/DayView.vue'
|
|
8
9
|
import MonthView from './views/MonthView.vue'
|
|
9
10
|
import WeekView from './views/WeekView.vue'
|
|
10
11
|
|
|
11
|
-
interface CalendarProps {
|
|
12
|
-
events: CalendarEvent[]
|
|
13
|
-
startDate?: Date
|
|
14
|
-
view?: CalendarView
|
|
15
|
-
weekStart?: WeekStart
|
|
16
|
-
}
|
|
17
|
-
|
|
18
12
|
const props = withDefaults(defineProps<CalendarProps>(), {
|
|
19
13
|
startDate: () => new Date(),
|
|
20
14
|
view: 'Week',
|
|
21
|
-
weekStart: 'Sunday'
|
|
15
|
+
weekStart: 'Sunday',
|
|
16
|
+
events: () => []
|
|
22
17
|
})
|
|
23
18
|
|
|
24
19
|
const emit = defineEmits<{
|
|
@@ -26,15 +21,17 @@ const emit = defineEmits<{
|
|
|
26
21
|
(e: 'eventCreate', event: { start_time: Date, end_time: Date }): void
|
|
27
22
|
(e: 'eventUpdate', event: CalendarEvent): void
|
|
28
23
|
(e: 'eventDelete', eventId: string): void
|
|
29
|
-
(e: 'dateChange',
|
|
30
|
-
(e: 'viewChange',
|
|
24
|
+
(e: 'dateChange', changeEvent: CalendarViewState): void
|
|
25
|
+
(e: 'viewChange', changeEvent: CalendarViewState): void
|
|
26
|
+
(e: 'ready', changeEvent: CalendarViewState): void
|
|
31
27
|
}>()
|
|
32
28
|
|
|
33
|
-
// State
|
|
34
29
|
const currentDate = ref(new Date(props.startDate))
|
|
35
30
|
const currentView = ref(props.view)
|
|
31
|
+
const activeEvent = ref<CalendarEvent>()
|
|
32
|
+
const showPopover = ref(false)
|
|
33
|
+
const popoverPosition = ref<{ top: number, left: number }>()
|
|
36
34
|
|
|
37
|
-
// Available view components
|
|
38
35
|
const views: Record<CalendarView, Component> = {
|
|
39
36
|
Week: WeekView,
|
|
40
37
|
Month: MonthView,
|
|
@@ -42,27 +39,46 @@ const views: Record<CalendarView, Component> = {
|
|
|
42
39
|
Agenda: AgendaView
|
|
43
40
|
}
|
|
44
41
|
|
|
45
|
-
// Calculate visible date range based on current view
|
|
46
42
|
const visibleDateRange = computed(() => {
|
|
47
43
|
const start = new Date(currentDate.value)
|
|
48
44
|
let end = new Date(currentDate.value)
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
45
|
+
const addSunday = props.weekStart === 'Sunday' ? 0 : 1
|
|
46
|
+
switch (currentView.value) {
|
|
47
|
+
case 'Week':
|
|
48
|
+
start.setDate(start.getDate() - start.getDay() + addSunday)
|
|
49
|
+
end.setDate(start.getDate() + 6)
|
|
50
|
+
break
|
|
51
|
+
case 'Month':
|
|
52
|
+
case 'Agenda':
|
|
53
|
+
start.setDate(-6)
|
|
54
|
+
end = new Date(start.getFullYear(), start.getMonth() + 2, 7)
|
|
55
|
+
break
|
|
56
|
+
case 'Day':
|
|
57
|
+
end.setDate(end.getDate() + 1)
|
|
58
|
+
break
|
|
59
|
+
default:
|
|
60
|
+
console.error(`Invalid view: ${currentView.value}`)
|
|
62
61
|
}
|
|
63
62
|
return { start, end }
|
|
64
63
|
})
|
|
65
64
|
|
|
65
|
+
const state = computed<CalendarViewState>(() => ({
|
|
66
|
+
visibleDateRange: visibleDateRange.value,
|
|
67
|
+
currentDate: currentDate.value,
|
|
68
|
+
currentView: currentView.value
|
|
69
|
+
}))
|
|
70
|
+
|
|
71
|
+
function handleDateChange(date: Date) {
|
|
72
|
+
console.log('handleDateChange', date)
|
|
73
|
+
currentDate.value = new Date(date)
|
|
74
|
+
emit('dateChange', state.value)
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
function handleViewChange(view: CalendarView) {
|
|
78
|
+
currentView.value = view
|
|
79
|
+
emit('viewChange', state.value)
|
|
80
|
+
}
|
|
81
|
+
|
|
66
82
|
// Event handlers
|
|
67
83
|
function handleEventClick(event: CalendarEvent) {
|
|
68
84
|
emit('eventClick', event)
|
|
@@ -80,17 +96,28 @@ function handleEventDelete(eventId: string) {
|
|
|
80
96
|
emit('eventDelete', eventId)
|
|
81
97
|
}
|
|
82
98
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
99
|
+
// Popover handling
|
|
100
|
+
function openPopover(event: CalendarEvent, position?: { top: number, left: number }) {
|
|
101
|
+
activeEvent.value = event
|
|
102
|
+
popoverPosition.value = position
|
|
103
|
+
showPopover.value = true
|
|
86
104
|
}
|
|
87
105
|
|
|
88
|
-
function
|
|
89
|
-
|
|
90
|
-
|
|
106
|
+
function closePopover() {
|
|
107
|
+
showPopover.value = false
|
|
108
|
+
activeEvent.value = undefined
|
|
109
|
+
popoverPosition.value = undefined
|
|
91
110
|
}
|
|
92
111
|
|
|
93
|
-
defineExpose({
|
|
112
|
+
defineExpose({
|
|
113
|
+
visibleDateRange,
|
|
114
|
+
currentView,
|
|
115
|
+
currentDate,
|
|
116
|
+
openPopover,
|
|
117
|
+
closePopover
|
|
118
|
+
})
|
|
119
|
+
|
|
120
|
+
onMounted(() => { emit('ready', state.value) })
|
|
94
121
|
</script>
|
|
95
122
|
|
|
96
123
|
<template>
|
|
@@ -134,11 +161,26 @@ defineExpose({ visibleDateRange })
|
|
|
134
161
|
@event-update="handleEventUpdate"
|
|
135
162
|
@event-delete="handleEventDelete"
|
|
136
163
|
@date-change="handleDateChange"
|
|
164
|
+
@open-popover="openPopover"
|
|
137
165
|
>
|
|
138
166
|
<template #eventContent="{ event }">
|
|
139
167
|
<slot name="eventContent" :event="event" />
|
|
140
168
|
</template>
|
|
141
169
|
</component>
|
|
170
|
+
|
|
171
|
+
<!-- Global Popover -->
|
|
172
|
+
<CalendarPopover
|
|
173
|
+
:event="activeEvent"
|
|
174
|
+
:position="popoverPosition"
|
|
175
|
+
:show="showPopover"
|
|
176
|
+
:has-event-content-slot="!!$slots.eventContent"
|
|
177
|
+
@close="closePopover"
|
|
178
|
+
@event-click="handleEventClick"
|
|
179
|
+
>
|
|
180
|
+
<template #eventContent="{ event }">
|
|
181
|
+
<slot name="eventContent" :event="event" />
|
|
182
|
+
</template>
|
|
183
|
+
</CalendarPopover>
|
|
142
184
|
</div>
|
|
143
185
|
</template>
|
|
144
186
|
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
+
import type { SetupContext } from 'vue'
|
|
2
3
|
import type { CalendarEvent } from '../CalendarTypes'
|
|
3
4
|
import { formatDate } from '@bagelink/vue'
|
|
4
|
-
import { ref, computed, onMounted, onUnmounted } from 'vue'
|
|
5
|
+
import { ref, computed, onMounted, onUnmounted, useSlots } from 'vue'
|
|
5
6
|
|
|
6
7
|
interface AgendaViewEvent extends CalendarEvent {
|
|
7
8
|
dayLabel: string
|
|
@@ -17,8 +18,11 @@ const props = defineProps<{
|
|
|
17
18
|
const emit = defineEmits<{
|
|
18
19
|
(e: 'eventClick', event: CalendarEvent): void
|
|
19
20
|
(e: 'dateChange', date: Date): void
|
|
21
|
+
(e: 'openPopover', event: CalendarEvent, position?: { top: number, left: number }): void
|
|
20
22
|
}>()
|
|
21
23
|
|
|
24
|
+
const slots: SetupContext['slots'] = useSlots()
|
|
25
|
+
|
|
22
26
|
// UI references
|
|
23
27
|
const containerRef = ref<HTMLElement | null>(null)
|
|
24
28
|
const currentDate = ref<Date | null>(null)
|
|
@@ -103,6 +107,26 @@ function handleScroll() {
|
|
|
103
107
|
}
|
|
104
108
|
}
|
|
105
109
|
|
|
110
|
+
// Update event handling to emit the openPopover event
|
|
111
|
+
function handleEventSelection(event: CalendarEvent, domEvent?: MouseEvent) {
|
|
112
|
+
if (!slots.eventContent) {
|
|
113
|
+
emit('eventClick', event)
|
|
114
|
+
return
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
// Calculate position from DOM event if available
|
|
118
|
+
if (domEvent) {
|
|
119
|
+
const rect = (domEvent.currentTarget as HTMLElement).getBoundingClientRect()
|
|
120
|
+
const position = {
|
|
121
|
+
top: rect.top + window.scrollY + (rect.height / 2),
|
|
122
|
+
left: rect.left + window.scrollX + rect.width + 10
|
|
123
|
+
}
|
|
124
|
+
emit('openPopover', event, position)
|
|
125
|
+
} else {
|
|
126
|
+
emit('openPopover', event)
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
|
|
106
130
|
// Lifecycle hooks
|
|
107
131
|
onMounted(() => {
|
|
108
132
|
if (containerRef.value) {
|
|
@@ -137,7 +161,7 @@ onUnmounted(() => {
|
|
|
137
161
|
backgroundColor: event.color || 'var(--bgl-primary)',
|
|
138
162
|
}"
|
|
139
163
|
:data-date="event.start_time"
|
|
140
|
-
@click.stop="
|
|
164
|
+
@click.stop="handleEventSelection(event, $event)"
|
|
141
165
|
>
|
|
142
166
|
<div class="event-content">
|
|
143
167
|
<div class="event-time">
|