@bagelink/vue 1.2.15 → 1.2.20

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.
Files changed (114) hide show
  1. package/dist/components/calendar/CalendarTypes.d.ts +13 -0
  2. package/dist/components/calendar/CalendarTypes.d.ts.map +1 -0
  3. package/dist/components/calendar/Index.vue.d.ts +39 -507
  4. package/dist/components/calendar/Index.vue.d.ts.map +1 -1
  5. package/dist/components/calendar/utils.d.ts +31 -0
  6. package/dist/components/calendar/utils.d.ts.map +1 -0
  7. package/dist/components/calendar/views/AgendaView.vue.d.ts +16 -0
  8. package/dist/components/calendar/views/AgendaView.vue.d.ts.map +1 -0
  9. package/dist/components/calendar/views/DayView.vue.d.ts +50 -0
  10. package/dist/components/calendar/views/DayView.vue.d.ts.map +1 -0
  11. package/dist/components/calendar/views/MonthView.vue.d.ts +20 -0
  12. package/dist/components/calendar/views/MonthView.vue.d.ts.map +1 -0
  13. package/dist/components/calendar/views/WeekView.vue.d.ts +33 -0
  14. package/dist/components/calendar/views/WeekView.vue.d.ts.map +1 -0
  15. package/dist/components/form/BglMultiStepForm.vue.d.ts +63 -0
  16. package/dist/components/form/BglMultiStepForm.vue.d.ts.map +1 -0
  17. package/dist/components/form/index.d.ts +1 -0
  18. package/dist/components/form/index.d.ts.map +1 -1
  19. package/dist/components/form/inputs/CodeEditor/Index.vue.d.ts.map +1 -1
  20. package/dist/components/form/inputs/DateInput.vue.d.ts +3 -3
  21. package/dist/components/form/inputs/DateInput.vue.d.ts.map +1 -1
  22. package/dist/components/form/inputs/DatePicker.vue.d.ts +3 -3
  23. package/dist/components/form/inputs/DatePicker.vue.d.ts.map +1 -1
  24. package/dist/components/form/inputs/SelectInput.vue.d.ts.map +1 -1
  25. package/dist/index.cjs +2241 -3891
  26. package/dist/index.d.ts +1 -1
  27. package/dist/index.d.ts.map +1 -1
  28. package/dist/index.mjs +2242 -3892
  29. package/dist/style.css +567 -633
  30. package/dist/utils/BagelFormUtils.d.ts +4 -2
  31. package/dist/utils/BagelFormUtils.d.ts.map +1 -1
  32. package/dist/utils/calendar/EDate.d.ts +2 -0
  33. package/dist/utils/calendar/EDate.d.ts.map +1 -0
  34. package/dist/utils/calendar/Helpers.d.ts +19 -0
  35. package/dist/utils/calendar/Helpers.d.ts.map +1 -0
  36. package/dist/utils/calendar/constants.d.ts +3 -0
  37. package/dist/utils/calendar/constants.d.ts.map +1 -0
  38. package/dist/utils/calendar/dateUtils.d.ts +30 -0
  39. package/dist/utils/calendar/dateUtils.d.ts.map +1 -0
  40. package/dist/utils/calendar/event.interface.d.ts +32 -0
  41. package/dist/utils/calendar/event.interface.d.ts.map +1 -0
  42. package/dist/utils/calendar/time.d.ts +117 -0
  43. package/dist/utils/calendar/time.d.ts.map +1 -0
  44. package/dist/utils/calendar/types.d.ts +27 -0
  45. package/dist/utils/calendar/types.d.ts.map +1 -0
  46. package/dist/utils/calendar/typings.d.ts +87 -0
  47. package/dist/utils/calendar/typings.d.ts.map +1 -0
  48. package/dist/utils/calendar/week.d.ts +117 -0
  49. package/dist/utils/calendar/week.d.ts.map +1 -0
  50. package/package.json +1 -1
  51. package/src/components/calendar/CalendarTypes.ts +13 -0
  52. package/src/components/calendar/Index.vue +124 -389
  53. package/src/components/calendar/utils.ts +70 -0
  54. package/src/components/calendar/views/AgendaView.vue +263 -0
  55. package/src/components/calendar/views/DayView.vue +373 -0
  56. package/src/components/calendar/views/MonthView.vue +313 -0
  57. package/src/components/calendar/views/WeekView.vue +431 -0
  58. package/src/components/form/BglMultiStepForm.vue +383 -69
  59. package/src/components/form/index.ts +1 -0
  60. package/src/components/form/inputs/CodeEditor/Index.vue +11 -0
  61. package/src/components/form/inputs/DateInput.vue +3 -3
  62. package/src/components/form/inputs/DatePicker.vue +35 -30
  63. package/src/components/form/inputs/SelectInput.vue +2 -0
  64. package/src/components/form/inputs/Upload/upload.types.d.ts +0 -1
  65. package/src/index.ts +2 -2
  66. package/src/styles/inputs.css +138 -137
  67. package/src/styles/layout.css +3 -2
  68. package/src/styles/mobilLayout.css +4 -2
  69. package/src/utils/BagelFormUtils.ts +6 -2
  70. package/src/utils/calendar/EDate.ts +0 -0
  71. package/src/{components/calendar/helpers → utils/calendar}/Helpers.ts +6 -6
  72. package/src/utils/calendar/constants.ts +2 -0
  73. package/src/utils/{timeAgo.ts → calendar/dateUtils.ts} +38 -1
  74. package/src/utils/calendar/event.interface.ts +33 -0
  75. package/src/{components/calendar/helpers/Time.ts → utils/calendar/time.ts} +15 -15
  76. package/src/utils/calendar/types.ts +27 -0
  77. package/src/{components/calendar/typings/config.interface.ts → utils/calendar/typings.ts} +13 -6
  78. package/src/utils/calendar/week.ts +588 -0
  79. package/src/components/calendar/assets/base.css +0 -60
  80. package/src/components/calendar/components/header/Header.vue +0 -153
  81. package/src/components/calendar/components/month/AgendaEventTile.vue +0 -135
  82. package/src/components/calendar/components/month/AgendaEvents.vue +0 -72
  83. package/src/components/calendar/components/month/Day.vue +0 -256
  84. package/src/components/calendar/components/month/Event.vue +0 -164
  85. package/src/components/calendar/components/month/Month.vue +0 -241
  86. package/src/components/calendar/components/month/WeekDay.vue +0 -15
  87. package/src/components/calendar/components/partials/EventFlyout.vue +0 -430
  88. package/src/components/calendar/components/week/Day.vue +0 -198
  89. package/src/components/calendar/components/week/DayEvent.vue +0 -584
  90. package/src/components/calendar/components/week/DayTimeline.vue +0 -80
  91. package/src/components/calendar/components/week/FullDayEvent.vue +0 -121
  92. package/src/components/calendar/components/week/Week.vue +0 -414
  93. package/src/components/calendar/components/week/WeekTimeline.vue +0 -101
  94. package/src/components/calendar/constants.ts +0 -13
  95. package/src/components/calendar/helpers/DayIntervals.ts +0 -48
  96. package/src/components/calendar/helpers/EDate.ts +0 -18
  97. package/src/components/calendar/helpers/Errors.ts +0 -69
  98. package/src/components/calendar/helpers/EventChange.ts +0 -88
  99. package/src/components/calendar/helpers/EventConcurrency.ts +0 -69
  100. package/src/components/calendar/helpers/EventFlyoutPosition.ts +0 -96
  101. package/src/components/calendar/helpers/EventPosition.ts +0 -154
  102. package/src/components/calendar/helpers/EventsFilter.ts +0 -50
  103. package/src/components/calendar/helpers/Week.ts +0 -37
  104. package/src/components/calendar/language/index.ts +0 -41
  105. package/src/components/calendar/language/keys.ts +0 -99
  106. package/src/components/calendar/models/Event.ts +0 -112
  107. package/src/components/calendar/styles/_mixins.css +0 -21
  108. package/src/components/calendar/styles/_variables.css +0 -47
  109. package/src/components/calendar/typings/interfaces/day.interface.ts +0 -10
  110. package/src/components/calendar/typings/interfaces/event.interface.ts +0 -32
  111. package/src/components/calendar/typings/interfaces/full-day-events-week.type.ts +0 -8
  112. package/src/components/calendar/typings/interfaces/period.interface.ts +0 -5
  113. package/src/components/calendar/typings/interfaces/time-modes.ts +0 -11
  114. package/src/components/calendar/typings/types.ts +0 -27
@@ -1,99 +0,0 @@
1
- export const languageKeys = {
2
- /** The following three keys, describe the calendar modes */
3
- week: {
4
- 'it-IT': 'Settimana',
5
- 'en-US': 'Week',
6
- 'de-DE': 'Woche',
7
- 'sv-SE': 'Vecka',
8
- 'zh-CN': '周',
9
- 'pt-BR': 'Semana',
10
- 'fr-FR': 'Semaine',
11
- 'th-TH': 'สัปดาห์',
12
- 'nl-NL': 'Week',
13
- 'ru-RU': 'Неделя',
14
- 'ar-YE': 'إسبوع',
15
- 'es-ES': 'Semana',
16
- 'ja-JP': '週',
17
- 'pl-PL': 'Tydzień',
18
- 'hu-HU': 'Hét',
19
- 'he-IL': 'שבוע',
20
- },
21
- month: {
22
- 'it-IT': 'Mese',
23
- 'en-US': 'Month',
24
- 'de-DE': 'Monat',
25
- 'sv-SE': 'Månad',
26
- 'zh-CN': '月',
27
- 'pt-BR': 'Mês',
28
- 'fr-FR': 'Mois',
29
- 'th-TH': 'เดือน',
30
- 'nl-NL': 'Maand',
31
- 'ru-RU': 'Месяц',
32
- 'ar-YE': 'شهر',
33
- 'es-ES': 'Mes',
34
- 'ja-JP': '月',
35
- 'pl-PL': 'Miesiąc',
36
- 'hu-HU': 'Hónap',
37
- 'he-IL': 'חודש',
38
- },
39
- day: {
40
- 'it-IT': 'Giorno',
41
- 'en-US': 'Day',
42
- 'de-DE': 'Tag',
43
- 'sv-SE': 'Dag',
44
- 'zh-CN': '日',
45
- 'pt-BR': 'Dia',
46
- 'fr-FR': 'Jour',
47
- 'th-TH': 'วัน',
48
- 'nl-NL': 'Dag',
49
- 'ru-RU': 'День',
50
- 'ar-YE': 'يوم',
51
- 'es-ES': 'Día',
52
- 'ja-JP': '日',
53
- 'pl-PL': 'Dzień',
54
- 'hu-HU': 'Nap',
55
- 'he-IL': 'יום',
56
- },
57
- agenda: {
58
- 'en-US': 'Agenda',
59
- 'he-IL': 'סדר יום',
60
- },
61
- /** Other keys */
62
- moreEvents: {
63
- 'it-IT': '+ altri eventi',
64
- 'en-US': '+ more events',
65
- 'de-DE': '+ weitere Ereignisse',
66
- 'sv-SE': '+ fler event',
67
- 'zh-CN': '列出其他结果',
68
- 'pt-BR': '+ mais eventos',
69
- 'fr-FR': '+ d\'autres événements',
70
- 'th-TH': '+ เหตุการณ์เพิ่มเติม',
71
- 'nl-NL': 'meer evenementen',
72
- 'ru-RU': '+ ещё события',
73
- 'ar-YE': '+ المزيد من الأحداث',
74
- 'es-ES': 'más eventos',
75
- 'ja-JP': 'その他イベント',
76
- 'pl-PL': '+ więcej wydarzeń',
77
- 'hu-HU': 'További események',
78
- 'he-IL': '+ עוד אירועים',
79
- },
80
-
81
- noEvent: {
82
- 'it-IT': 'Nessun evento',
83
- 'en-US': 'No events',
84
- 'de-DE': 'Keine Ereignisse',
85
- 'sv-SE': 'Inga event',
86
- 'zh-CN': '沒有活動',
87
- 'pt-BR': 'Sem eventos',
88
- 'fr-FR': 'Aucun Evènement',
89
- 'th-TH': 'ไม่มีกิจกรรม',
90
- 'nl-NL': 'Geen evenementen',
91
- 'ru-RU': 'Нет событий',
92
- 'ar-YE': 'لا أحداث',
93
- 'es-ES': 'No hay eventos',
94
- 'ja-JP': 'イベントなし',
95
- 'pl-PL': 'Brak wydarzeń',
96
- 'hu-HU': 'Nincs esemény',
97
- 'he-IL': 'אין אירועים',
98
- },
99
- }
@@ -1,112 +0,0 @@
1
- import type { EventColor, EventID, EventInterface } from '../typings/interfaces/event.interface'
2
- import type { ModeType } from '../typings/types'
3
-
4
- export class EventImpl implements EventInterface {
5
- title?: string
6
- description?: string
7
- topic?: string
8
- location?: string
9
- with?: string
10
- colorScheme?: string
11
- color?: EventColor
12
- isEditable?: boolean
13
- disableDnD?: ModeType[]
14
- disableResize?: ModeType[]
15
- isCustom?: boolean | ModeType[]
16
-
17
- // Properties that should not be set from outside Calendar
18
- nOfPreviousConcurrentEvents?: number
19
-
20
- constructor(
21
- public time: { start: string, end: string },
22
- public id: EventID,
23
- ) {}
24
- }
25
-
26
- export class EventBuilder {
27
- private eventImpl: EventImpl
28
-
29
- constructor(
30
- public time: { start: string, end: string },
31
- id?: EventID,
32
- ) {
33
- if (!id) id = Math.random().toString(36).substring(2, 9)
34
- this.eventImpl = new EventImpl(time, id)
35
- }
36
-
37
- build() {
38
- return this.eventImpl
39
- }
40
-
41
- withTitle(title: string) {
42
- this.eventImpl.title = title
43
-
44
- return this
45
- }
46
-
47
- withColor(color: EventColor) {
48
- this.eventImpl.color = color
49
-
50
- return this
51
- }
52
-
53
- withColorScheme(colorScheme: string) {
54
- this.eventImpl.colorScheme = colorScheme
55
-
56
- return this
57
- }
58
-
59
- withDescription(description: string) {
60
- this.eventImpl.description = description
61
-
62
- return this
63
- }
64
-
65
- withTopic(topic: string) {
66
- this.eventImpl.topic = topic
67
-
68
- return this
69
- }
70
-
71
- withLocation(location: string) {
72
- this.eventImpl.location = location
73
-
74
- return this
75
- }
76
-
77
- withWith($with: string) {
78
- this.eventImpl.with = $with
79
-
80
- return this
81
- }
82
-
83
- withNOfPreviousConcurrentEvents(nOfPreviousConcurrentEvents: number) {
84
- this.eventImpl.nOfPreviousConcurrentEvents = nOfPreviousConcurrentEvents
85
-
86
- return this
87
- }
88
-
89
- withIsEditable(isEditable: boolean) {
90
- this.eventImpl.isEditable = isEditable
91
-
92
- return this
93
- }
94
-
95
- withIsCustom(isCustom: boolean | ModeType[]) {
96
- this.eventImpl.isCustom = isCustom
97
-
98
- return this
99
- }
100
-
101
- withDisableDnD(disableDnD: ModeType[]) {
102
- this.eventImpl.disableDnD = disableDnD
103
-
104
- return this
105
- }
106
-
107
- withDisableResize(disableResize: ModeType[]) {
108
- this.eventImpl.disableResize = disableResize
109
-
110
- return this
111
- }
112
- }
@@ -1,21 +0,0 @@
1
- @media (min-width: 37.5rem) {
2
- .screen-size-m {
3
- /* Content goes here */
4
- }
5
- }
6
-
7
- @media (hover: hover) {
8
- .hover {
9
- /* Content goes here */
10
- }
11
- }
12
-
13
- @media (prefers-color-scheme: dark) {
14
- .dark-mode {
15
- /* Content goes here */
16
- }
17
- }
18
-
19
- [style*='color-scheme: dark'] {
20
- /* Content goes here */
21
- }
@@ -1,47 +0,0 @@
1
- :root {
2
- /** Color */
3
- --qalendar-gray-quite-dark: rgb(110 110 110);
4
- --qalendar-gray: rgb(180 180 180);
5
- --qalendar-green: rgb(51 182 121);
6
- --qalendar-theme-color: var(--qalendar-blue);
7
- --qalendar-light-gray: rgba(240 236 236 / 76%);
8
- --qalendar-option-hover: var(--qalendar-light-gray);
9
-
10
- --qalendar-dark-mode-elevated-surface: #383838;
11
- --qalendar-dark-mode-lightly-elevated-surface: #2e2e2e;
12
- --qalendar-dark-mode-text-primary: rgba(255 255 255 1);
13
- --qalendar-dark-mode-text-secondary: rgba(255 255 255 0.7);
14
- --qalendar-dark-mode-text-hint: rgba(255 255 255 0.5);
15
- --qalendar-dark-mode-line-color: var(--qalendar-gray);
16
-
17
- /** Borders */
18
- --qalendar-border-gray-thin: 1px solid rgb(224 224 224);
19
- --qalendar-border-dashed-gray-thin: 1px dashed rgb(224 224 224);
20
- --qalendar-border-blue-thin: 1px solid var(--qalendar-theme-color);
21
- --qalendar-border-radius: 8px;
22
-
23
- /** Spacing */
24
- --qalendar-spacing: 10px;
25
- --qalendar-spacing-half: 5px;
26
- --qalendar-spacing-double: 20px;
27
-
28
- /** Miscellaneous */
29
- --qalendar-box-shadow: 0 4px 4px rgba(0 0 0 / 6%), 0 1px 4px rgba(0 0 0 / 18%);
30
- --qalendar-text-transition: color 0.2s ease;
31
- --qalendar-week-padding-left: 56px;
32
-
33
- /** Font */
34
- --qalendar-font-2xs: 10px;
35
- --qalendar-font-xs: 12px;
36
- --qalendar-font-s: 14px;
37
- --qalendar-font-m: 16px;
38
- --qalendar-font-l: 18px;
39
- }
40
-
41
- @media (min-width: 62rem) {
42
- .calendar-root {
43
- --qalendar-spacing: 20px;
44
- --qalendar-spacing-half: 10px;
45
- --qalendar-spacing-double: 40px;
46
- }
47
- }
@@ -1,10 +0,0 @@
1
- import type { EventInterface } from './event.interface'
2
- import type { DayWithFullDayEvents } from './full-day-events-week.type'
3
-
4
- export interface DayInterface {
5
- isTrailingOrLeadingDate?: boolean
6
- dayName: string
7
- dateTimeString: string
8
- events: EventInterface[]
9
- fullDayEvents?: DayWithFullDayEvents
10
- }
@@ -1,32 +0,0 @@
1
- import type { ModeType } from '../types'
2
-
3
- export type EventID = string | number
4
-
5
- export type EVENT_TYPE = 'SINGLE_DAY_TIMED' | 'SINGLE_DAY_FULL_DAY' | 'SINGLE_HYBRID_DAY_TIMED' | 'MULTI_DAY_TIMED' | 'MULTI_DAY_FULL_DAY'
6
-
7
- export type EventColor = 'blue' | 'yellow' | 'green' | 'red' | 'purple'
8
-
9
- export interface EventInterface {
10
- id: EventID
11
- title?: string
12
- time: { start: string, end: string } // YYYY-MM-DD hh:mm
13
- description?: string
14
- topic?: string
15
- location?: string // Name of the event location
16
- with?: string // Names of people
17
- colorScheme?: string
18
- color?: EventColor // Says 'color', but represents CSS-Property background-color
19
- isEditable?: boolean // If true, the event has delete- and edit icons in Event-Flyout. Can also be dragged and dropped.
20
- disableDnD?: ModeType[] // Disable Drag and Drop for this event, in the modes specified
21
- disableResize?: ModeType[] // Disable Resize for this event, in the modes specified
22
- isCustom?: boolean | ModeType[] // If true, the event expects to be displayed using the event slot. It can also be specified as an array, of all modes, where the event should be displayed using the event slot.
23
-
24
- // These are properties that should never be fed into the Calendar
25
- // Instead, they are assigned to events, in order to for example position/style them correctly
26
- zIndex?: number
27
- nOfPreviousConcurrentEvents?: number
28
- totalConcurrentEvents?: number
29
- timeJS?: { start: Date, end: Date }
30
- originalEvent?: Omit<EventInterface, 'originalEvent'>
31
- eventType?: EVENT_TYPE
32
- }
@@ -1,8 +0,0 @@
1
- import type { EventInterface } from './event.interface'
2
-
3
- export interface DayWithFullDayEvents {
4
- date: Date
5
- [key: string]: EventInterface | any | string
6
- }
7
-
8
- export type FullDayEventsWeek = DayWithFullDayEvents[]
@@ -1,5 +0,0 @@
1
- export interface PeriodInterface {
2
- start: Date
3
- end: Date
4
- selectedDate: Date
5
- }
@@ -1,11 +0,0 @@
1
- // ! @natanelyoung PLEASE DON'T USE ENUMS 🙏🏼
2
- // * please see: https://tduyng.medium.com/why-you-might-be-using-enums-in-typescript-wrong-6d9c5742db5a
3
- export enum DAY_MODE {
4
- // a regular day, starting and ending at 0:00 and 24:00
5
- REGULAR = 'regular',
6
- // a day with custom day boundaries, but within an actual calendar day
7
- SHORTENED = 'shortened',
8
- // a day with custom day boundaries, but spanning two actual calendar days,
9
- // for example, a day that starts at 06:00 and ends at 04:00 the day after
10
- FLEXIBLE = 'flexible',
11
- }
@@ -1,27 +0,0 @@
1
- export interface DOMRect {
2
- bottom: number
3
- height: number
4
- left: number
5
- right: number
6
- top: number
7
- width: number
8
- x: number
9
- y: number
10
- }
11
-
12
- export type DateViewMode = 'days' | 'months' | 'years'
13
-
14
- export type ModeType = 'day' | 'week' | 'month' | 'agenda'
15
-
16
- // ! @natanelyoung PLEASE DON'T USE ENUMS 🙏🏼
17
- // * please see: https://tduyng.medium.com/why-you-might-be-using-enums-in-typescript-wrong-6d9c5742db5a
18
- export enum DRAG_N_RESIZE_DIRECTION {
19
- BACKWARDS = 'backwards',
20
- FORWARDS = 'forwards',
21
- }
22
-
23
- export interface DayInfo {
24
- daysTotalN: number
25
- thisDayIndex: number
26
- dateTimeString: string
27
- }