@bagelink/vue 1.5.17 → 1.5.22

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 (133) hide show
  1. package/bin/experimentalGenTypedRoutes.ts +15 -15
  2. package/bin/generateFormSchema.ts +12 -12
  3. package/bin/utils.ts +4 -4
  4. package/dist/components/Dropdown.vue.d.ts.map +1 -1
  5. package/dist/components/calendar/CalendarPopover.vue.d.ts.map +1 -1
  6. package/dist/components/form/BagelForm.vue.d.ts.map +1 -1
  7. package/dist/components/form/FieldArray.vue.d.ts +5 -4
  8. package/dist/components/form/FieldArray.vue.d.ts.map +1 -1
  9. package/dist/components/form/inputs/CheckInput.vue.d.ts.map +1 -1
  10. package/dist/components/form/inputs/RichText/index.vue.d.ts +1 -0
  11. package/dist/components/form/inputs/RichText/index.vue.d.ts.map +1 -1
  12. package/dist/components/form/inputs/SelectInput.vue.d.ts.map +1 -1
  13. package/dist/components/form/inputs/ToggleInput.vue.d.ts.map +1 -1
  14. package/dist/components/form/inputs/Upload/UploadInput.vue.d.ts.map +1 -1
  15. package/dist/composables/useFormField.d.ts.map +1 -1
  16. package/dist/composables/useSchemaField.d.ts.map +1 -1
  17. package/dist/index.cjs +17 -14
  18. package/dist/index.mjs +511 -422
  19. package/dist/style.css +1 -1
  20. package/package.json +1 -1
  21. package/src/components/AccordionItem.vue +2 -2
  22. package/src/components/AddToCalendar.vue +1 -1
  23. package/src/components/BglVideo.vue +8 -8
  24. package/src/components/Btn.vue +9 -9
  25. package/src/components/Card.vue +4 -4
  26. package/src/components/Carousel.vue +44 -44
  27. package/src/components/DataPreview.vue +1 -1
  28. package/src/components/DragOver.vue +6 -6
  29. package/src/components/Dropdown.vue +14 -14
  30. package/src/components/Flag.vue +3 -3
  31. package/src/components/Icon/Icon.vue +13 -13
  32. package/src/components/Image.vue +4 -4
  33. package/src/components/ImportData.vue +79 -79
  34. package/src/components/ListItem.vue +7 -7
  35. package/src/components/MapEmbed/Index.vue +6 -6
  36. package/src/components/Modal.vue +10 -10
  37. package/src/components/ModalForm.vue +4 -4
  38. package/src/components/NavBar.vue +2 -2
  39. package/src/components/Pagination.vue +9 -9
  40. package/src/components/Pill.vue +1 -1
  41. package/src/components/Rating.vue +2 -2
  42. package/src/components/Slider.vue +77 -77
  43. package/src/components/Spreadsheet/Index.vue +34 -34
  44. package/src/components/Spreadsheet/SpreadsheetTable.vue +3 -3
  45. package/src/components/Zoomer.vue +28 -28
  46. package/src/components/analytics/BarChart.vue +6 -6
  47. package/src/components/analytics/KpiCard.vue +2 -2
  48. package/src/components/analytics/LineChart.vue +14 -14
  49. package/src/components/analytics/PieChart.vue +11 -11
  50. package/src/components/calendar/CalendarPopover.vue +1 -1
  51. package/src/components/calendar/Index.vue +1 -1
  52. package/src/components/calendar/views/AgendaView.vue +2 -2
  53. package/src/components/calendar/views/DayView.vue +6 -6
  54. package/src/components/calendar/views/MonthView.vue +2 -2
  55. package/src/components/calendar/views/WeekView.vue +18 -18
  56. package/src/components/dataTable/DataTable.vue +3 -3
  57. package/src/components/dataTable/useSorting.ts +1 -1
  58. package/src/components/dataTable/useTableData.ts +15 -15
  59. package/src/components/dataTable/useTableSelection.ts +8 -8
  60. package/src/components/dataTable/useTableVirtualization.ts +1 -1
  61. package/src/components/draggable/useDraggable.ts +42 -42
  62. package/src/components/form/BagelForm.vue +66 -23
  63. package/src/components/form/BglMultiStepForm.vue +18 -18
  64. package/src/components/form/FieldArray.vue +177 -67
  65. package/src/components/form/inputs/CheckInput.vue +2 -1
  66. package/src/components/form/inputs/CodeEditor/Index.vue +1 -1
  67. package/src/components/form/inputs/CodeEditor/format.ts +7 -7
  68. package/src/components/form/inputs/CodeEditor/useHighlight.ts +6 -6
  69. package/src/components/form/inputs/DateInput.vue +6 -6
  70. package/src/components/form/inputs/DatePicker.vue +19 -19
  71. package/src/components/form/inputs/EmailInput.vue +14 -14
  72. package/src/components/form/inputs/NumberInput.vue +6 -6
  73. package/src/components/form/inputs/OTP.vue +3 -3
  74. package/src/components/form/inputs/RadioGroup.vue +1 -1
  75. package/src/components/form/inputs/RadioPillsInput.vue +8 -8
  76. package/src/components/form/inputs/RichText/components/EditorToolbar.vue +10 -10
  77. package/src/components/form/inputs/RichText/components/TableGridSelector.vue +1 -1
  78. package/src/components/form/inputs/RichText/composables/useCommands.ts +1 -1
  79. package/src/components/form/inputs/RichText/composables/useEditor.ts +12 -12
  80. package/src/components/form/inputs/RichText/composables/useEditorKeyboard.ts +1 -1
  81. package/src/components/form/inputs/RichText/index.vue +143 -134
  82. package/src/components/form/inputs/RichText/utils/commands.ts +69 -69
  83. package/src/components/form/inputs/RichText/utils/debug.ts +1 -1
  84. package/src/components/form/inputs/RichText/utils/formatting.ts +39 -39
  85. package/src/components/form/inputs/RichText/utils/media.ts +6 -6
  86. package/src/components/form/inputs/RichText/utils/selection.ts +28 -28
  87. package/src/components/form/inputs/RichText/utils/table.ts +19 -19
  88. package/src/components/form/inputs/SelectBtn.vue +1 -1
  89. package/src/components/form/inputs/SelectInput.vue +50 -26
  90. package/src/components/form/inputs/SignaturePad.vue +15 -15
  91. package/src/components/form/inputs/TableField.vue +1 -1
  92. package/src/components/form/inputs/TelInput.vue +6 -6
  93. package/src/components/form/inputs/TextInput.vue +5 -5
  94. package/src/components/form/inputs/ToggleInput.vue +2 -1
  95. package/src/components/form/inputs/Upload/UploadInput.vue +155 -102
  96. package/src/components/form/inputs/Upload/upload.ts +1 -1
  97. package/src/components/form/inputs/Upload/useFileUpload.ts +6 -6
  98. package/src/components/form/useBagelFormState.ts +5 -5
  99. package/src/components/layout/AppContent.vue +1 -1
  100. package/src/components/layout/AppLayout.vue +1 -1
  101. package/src/components/layout/Layout.vue +4 -4
  102. package/src/components/layout/TabbedLayout.vue +1 -1
  103. package/src/components/layout/Tabs.vue +2 -2
  104. package/src/components/layout/TabsNav.vue +7 -7
  105. package/src/components/lightbox/Lightbox.vue +8 -8
  106. package/src/components/lightbox/index.ts +8 -8
  107. package/src/composables/index.ts +2 -2
  108. package/src/composables/useAddToCalendar.ts +13 -13
  109. package/src/composables/useDevice.ts +2 -2
  110. package/src/composables/useExcel.ts +6 -6
  111. package/src/composables/useFormField.ts +5 -9
  112. package/src/composables/usePolling.ts +8 -8
  113. package/src/composables/useSchemaField.ts +53 -38
  114. package/src/composables/useTheme.ts +9 -9
  115. package/src/composables/useValidateFieldValue.ts +2 -2
  116. package/src/directives/pattern.ts +25 -25
  117. package/src/directives/ripple.ts +4 -4
  118. package/src/directives/vResize.ts +6 -6
  119. package/src/plugins/bagel.ts +4 -4
  120. package/src/plugins/useModal.ts +3 -3
  121. package/src/styles/layout.css +7 -1
  122. package/src/utils/BagelFormUtils.ts +7 -7
  123. package/src/utils/calendar/Helpers.ts +8 -8
  124. package/src/utils/calendar/dateUtils.ts +22 -22
  125. package/src/utils/calendar/time.ts +25 -25
  126. package/src/utils/calendar/week.ts +25 -25
  127. package/src/utils/elementUtils.ts +27 -27
  128. package/src/utils/index.ts +22 -22
  129. package/src/utils/sizeParsing.ts +2 -2
  130. package/src/utils/strings.ts +5 -5
  131. package/src/utils/tapDetector.ts +11 -11
  132. package/src/utils/useSearch.ts +29 -29
  133. package/vite.config.ts +1 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bagelink/vue",
3
3
  "type": "module",
4
- "version": "1.5.17",
4
+ "version": "1.5.22",
5
5
  "description": "Bagel core sdk packages",
6
6
  "author": {
7
7
  "name": "Neveh Allon",
@@ -32,7 +32,7 @@ const accordionState = inject<AccordionState>('accordionState')
32
32
  const id = props.id || Math.random().toString(36).slice(7)
33
33
 
34
34
  const computedIcon = computed(() => {
35
- return props.iconType === 'plus_minus'
35
+ return 'plus_minus' === props.iconType
36
36
  ? (isOpen ? 'remove' : 'add')
37
37
  : 'expand_more'
38
38
  })
@@ -44,7 +44,7 @@ if (accordionState) {
44
44
  watch(
45
45
  () => accordionState.openItem,
46
46
  (currentOpenId) => {
47
- if (currentOpenId !== id) isOpen = false
47
+ if (currentOpenId !== id) {isOpen = false}
48
48
  },
49
49
  { immediate: true }
50
50
  )
@@ -39,7 +39,7 @@ const calendarProviders = [
39
39
  ]
40
40
 
41
41
  const includedProviders = computed(() => {
42
- if (!props.providers || !props.providers.length) return calendarProviders
42
+ if (!props.providers || !props.providers.length) {return calendarProviders}
43
43
  return calendarProviders.filter(provider => props.providers?.includes(provider.id))
44
44
  })
45
45
 
@@ -26,7 +26,7 @@ const isYoutubeShort = $computed(() => {
26
26
 
27
27
  const aspectRatio = $computed(
28
28
  () => {
29
- if (isYoutubeShort) return '9/16' // Vertical aspect ratio for Shorts
29
+ if (isYoutubeShort) {return '9/16'} // Vertical aspect ratio for Shorts
30
30
  return props.aspectRatio?.replace(':', '/') || '16/9'
31
31
  }
32
32
  )
@@ -42,7 +42,7 @@ function pause() {
42
42
  }
43
43
 
44
44
  // Setup intersection observer for autoplay="visible"
45
- if (props.autoplay === 'visible') {
45
+ if ('visible' === props.autoplay) {
46
46
  useIntersectionObserver(
47
47
  videoContainer,
48
48
  ([{ isIntersecting }]) => {
@@ -57,22 +57,22 @@ if (props.autoplay === 'visible') {
57
57
  }
58
58
 
59
59
  watch(() => props.status, (status) => {
60
- if (status === 'play') play()
61
- if (status === 'pause') pause()
60
+ if ('play' === status) {play()}
61
+ if ('pause' === status) {pause()}
62
62
  })
63
63
 
64
64
  defineExpose({ play, pause })
65
65
 
66
66
  const embedType = $computed<'YouTube' | 'Vimeo' | undefined>(() => {
67
67
  const youtubeRegex = /youtube\.com|youtu\.be/
68
- if (youtubeRegex.test(props.src || '')) return 'YouTube'
68
+ if (youtubeRegex.test(props.src || '')) {return 'YouTube'}
69
69
  const vimeoRegex = /(?:player\.)?vimeo\.com/
70
- if (vimeoRegex.test(props.src || '')) return 'Vimeo'
70
+ if (vimeoRegex.test(props.src || '')) {return 'Vimeo'}
71
71
  })
72
72
 
73
73
  const videoUrl = $computed(() => {
74
74
  if (embedType) {
75
- if (embedType === 'YouTube') {
75
+ if ('YouTube' === embedType) {
76
76
  // Extract video ID from YouTube regular or Shorts URL
77
77
  let videoId = ''
78
78
  if (props.src?.includes('youtube.com/shorts/')) {
@@ -89,7 +89,7 @@ const videoUrl = $computed(() => {
89
89
  })
90
90
  return `https://www.youtube.com/embed/${videoId}?${queryParams}`
91
91
  }
92
- if (embedType === 'Vimeo') {
92
+ if ('Vimeo' === embedType) {
93
93
  // Handle both regular Vimeo URLs and player.vimeo.com embed URLs
94
94
  const playerVimeoRegex = /player\.vimeo\.com\/video\/(\d+)/
95
95
  const regularVimeoRegex = /vimeo\.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|album\/(\d+)\/video\/)?(\d+)(?:$|\/|\?)/
@@ -60,7 +60,7 @@ const emit = defineEmits<{
60
60
  const isMobileScreen = ref(false)
61
61
 
62
62
  function checkMobile() {
63
- isMobileScreen.value = window.innerWidth <= 910
63
+ isMobileScreen.value = 910 >= window.innerWidth
64
64
  }
65
65
 
66
66
  onMounted(() => {
@@ -75,13 +75,13 @@ onUnmounted(() => {
75
75
  async function handleClick(event: MouseEvent) {
76
76
  if (props.confirm) {
77
77
  const { confirmModal } = useModal()
78
- const message = typeof props.confirm === 'string' ? props.confirm : 'Are you sure?'
78
+ const message = 'string' === typeof props.confirm ? props.confirm : 'Are you sure?'
79
79
  const confirmed = await confirmModal({
80
80
  title: 'Confirm',
81
81
  message
82
82
  })
83
83
 
84
- if (!confirmed) return
84
+ if (!confirmed) {return}
85
85
 
86
86
  props.onClick(event)
87
87
  emit('confirmed', event)
@@ -91,7 +91,7 @@ async function handleClick(event: MouseEvent) {
91
91
  }
92
92
 
93
93
  const iconSizeComputed = $computed(() => {
94
- if (props.iconSize !== undefined) return props.iconSize
94
+ if (props.iconSize !== undefined) {return props.iconSize}
95
95
 
96
96
  // Default icon sizes based on button size
97
97
  const sizeMap = {
@@ -115,17 +115,17 @@ const iconSizeComputed = $computed(() => {
115
115
  })
116
116
 
117
117
  const isComponent = $computed(() => {
118
- if (props.disabled) return props.is
119
- if (props.to) return RouterLink
120
- if (props.href) return 'a'
118
+ if (props.disabled) {return props.is}
119
+ if (props.to) {return RouterLink}
120
+ if (props.href) {return 'a'}
121
121
  return props.is
122
122
  })
123
123
 
124
124
  const bind = $computed(() => {
125
125
  const obj: { [key: string]: any } = {}
126
126
  if (!props.disabled) {
127
- if (props.to) obj.to = props.to
128
- else if (props.href) obj.href = props.href
127
+ if (props.to) {obj.to = props.to}
128
+ else if (props.href) {obj.href = props.href}
129
129
  }
130
130
  if (!props.to && !props.href) {
131
131
  obj.role = props.role
@@ -25,14 +25,14 @@ const props = defineProps<{
25
25
 
26
26
  const bind = $computed(() => {
27
27
  const obj: { [key: string]: any } = {}
28
- if (props.href) obj.href = props.href
29
- else if (props.to) obj.to = props.to
28
+ if (props.href) {obj.href = props.href}
29
+ else if (props.to) {obj.to = props.to}
30
30
  return obj
31
31
  })
32
32
 
33
33
  const is = $computed(() => {
34
- if (props.href) return 'a'
35
- if (props.to) return 'router-link'
34
+ if (props.href) {return 'a'}
35
+ if (props.to) {return 'router-link'}
36
36
  return 'div'
37
37
  })
38
38
  </script>
@@ -69,51 +69,51 @@ let velocityTracker = $ref<VelocitySample[]>([])
69
69
  const VELOCITY_SAMPLE_DURATION = 100 // ms to track velocity
70
70
 
71
71
  function getAverageVelocity(): number {
72
- if (velocityTracker.length < 2) return 0
72
+ if (2 > velocityTracker.length) {return 0}
73
73
 
74
74
  const now = Date.now()
75
75
  // Only consider samples within our sample duration
76
76
  const recentSamples = velocityTracker.filter((sample: VelocitySample) => now - sample.time < VELOCITY_SAMPLE_DURATION)
77
77
 
78
- if (recentSamples.length < 2) return 0
78
+ if (2 > recentSamples.length) {return 0}
79
79
 
80
80
  const first = recentSamples[0]
81
81
  const last = recentSamples[recentSamples.length - 1]
82
82
  const timeDelta = last.time - first.time
83
83
 
84
- if (timeDelta === 0) return 0
84
+ if (0 === timeDelta) {return 0}
85
85
 
86
86
  return (last.position - first.position) / timeDelta
87
87
  }
88
88
 
89
89
  // Transform helpers
90
90
  function getCurrentTransform(): number {
91
- if (!bglSlider) return 0
91
+ if (!bglSlider) {return 0}
92
92
  const { transform } = bglSlider.style
93
93
  const value = transform ? Number.parseInt(transform.replace(/[^-\d.]/g, '')) : 0
94
94
  return props.rtl ? -value : value
95
95
  }
96
96
 
97
97
  function setTransform(value: number) {
98
- if (!bglSlider) return
98
+ if (!bglSlider) {return}
99
99
  const rtlValue = props.rtl ? -value : value
100
100
  bglSlider.style.transform = `translateX(${rtlValue}px)`
101
101
  }
102
102
 
103
103
  function easeInOutQuad(t: number) {
104
- return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t
104
+ return 0.5 > t ? 2 * t * t : -1 + (4 - 2 * t) * t
105
105
  }
106
106
 
107
107
  function animateTransform(start: number, end: number, duration: number) {
108
108
  const startTime = performance.now()
109
109
 
110
110
  function animate(currentTime: number) {
111
- if (!isSliderAvailable) return
111
+ if (!isSliderAvailable) {return}
112
112
  const timeElapsed = currentTime - startTime
113
113
  const progress = Math.min(timeElapsed / duration, 1)
114
114
  const currentTransform = start + (end - start) * easeInOutQuad(progress)
115
115
  setTransform(currentTransform)
116
- if (progress < 1) requestAnimationFrame(animate)
116
+ if (1 > progress) {requestAnimationFrame(animate)}
117
117
  }
118
118
 
119
119
  requestAnimationFrame(animate)
@@ -122,7 +122,7 @@ function animateTransform(start: number, end: number, duration: number) {
122
122
  // Navigation
123
123
  function goToSlide(index: number, isTouchNav = false) {
124
124
  countSlides()
125
- if (!isSliderAvailable || !bglSlider || index < 0 || index >= slideCount) return
125
+ if (!isSliderAvailable || !bglSlider || 0 > index || index >= slideCount) {return}
126
126
 
127
127
  const containerWidth = bglSlider.offsetWidth
128
128
  const gapWidth = (containerWidth * GAP_PERCENT) / 100
@@ -136,7 +136,7 @@ function goToSlide(index: number, isTouchNav = false) {
136
136
  const currentTransform = getCurrentTransform()
137
137
  const duration = isTouchNav
138
138
  ? ANIMATION_TIMINGS.TOUCH
139
- : window.innerWidth < 600
139
+ : 600 > window.innerWidth
140
140
  ? ANIMATION_TIMINGS.MOBILE
141
141
  : ANIMATION_TIMINGS.DESKTOP
142
142
 
@@ -146,7 +146,7 @@ function goToSlide(index: number, isTouchNav = false) {
146
146
  }
147
147
 
148
148
  function next() {
149
- if (!isSliderAvailable) return
149
+ if (!isSliderAvailable) {return}
150
150
  countSlides()
151
151
  // In RTL, next and prev are reversed
152
152
  const nextIndex = props.rtl
@@ -156,7 +156,7 @@ function next() {
156
156
  }
157
157
 
158
158
  function prev() {
159
- if (!isSliderAvailable) return
159
+ if (!isSliderAvailable) {return}
160
160
  countSlides()
161
161
  // In RTL, next and prev are reversed
162
162
  const prevIndex = props.rtl
@@ -167,10 +167,10 @@ function prev() {
167
167
 
168
168
  // Height management
169
169
  function calcHeight() {
170
- if (!isSliderAvailable || !bglSlider) return
170
+ if (!isSliderAvailable || !bglSlider) {return}
171
171
  try {
172
172
  const activeSlide = bglSlider.children[activeSlideIndex]
173
- if (!activeSlide) return
173
+ if (!activeSlide) {return}
174
174
  const children = Array.from(activeSlide.children) as HTMLElement[]
175
175
  const totalHeight = children.reduce((sum, el) => sum + el.clientHeight, 0)
176
176
  yHeight = `${totalHeight}px`
@@ -180,13 +180,13 @@ function calcHeight() {
180
180
  }
181
181
 
182
182
  function updateHeight() {
183
- if (!props.autoHeight) return
183
+ if (!props.autoHeight) {return}
184
184
  setTimeout(calcHeight, 200)
185
185
  }
186
186
 
187
187
  // Slide management
188
188
  function countSlides() {
189
- if (!isSliderAvailable || !bglSlider) return
189
+ if (!isSliderAvailable || !bglSlider) {return}
190
190
  slideCount = bglSlider.children.length
191
191
  }
192
192
 
@@ -198,10 +198,10 @@ function handleSlideChange() {
198
198
  }
199
199
 
200
200
  function handleResize() {
201
- if (!isSliderAvailable || !bglSlider) return
202
- itemCount = window.innerWidth < 600
201
+ if (!isSliderAvailable || !bglSlider) {return}
202
+ itemCount = 600 > window.innerWidth
203
203
  ? 1
204
- : window.innerWidth < 991
204
+ : 991 > window.innerWidth
205
205
  ? Math.min(props.items, 2)
206
206
  : props.items
207
207
 
@@ -217,7 +217,7 @@ function handleResize() {
217
217
  }
218
218
 
219
219
  function clearAutoplay() {
220
- if (autoPlayInterval) clearInterval(autoPlayInterval)
220
+ if (autoPlayInterval) {clearInterval(autoPlayInterval)}
221
221
  }
222
222
 
223
223
  // Mouse events
@@ -230,7 +230,7 @@ function preventDefaultClick(e: MouseEvent) {
230
230
 
231
231
  async function disableDrag() {
232
232
  await nextTick()
233
- if (!isSliderAvailable || !bglSlider) return
233
+ if (!isSliderAvailable || !bglSlider) {return}
234
234
 
235
235
  const elements = Array.from(bglSlider.querySelectorAll('img, a')) as HTMLElement[]
236
236
  elements.forEach((el) => {
@@ -252,7 +252,7 @@ async function disableDrag() {
252
252
 
253
253
  function startDrag(e: MouseEvent) {
254
254
  e.stopPropagation()
255
- if (e.button !== 0 || !props.freeDrag || !isSliderAvailable) return
255
+ if (0 !== e.button || !props.freeDrag || !isSliderAvailable) {return}
256
256
 
257
257
  clearAutoplay()
258
258
  startX = e.pageX
@@ -265,12 +265,12 @@ function startDrag(e: MouseEvent) {
265
265
  }
266
266
 
267
267
  function onDrag(e: MouseEvent) {
268
- if (!isSliderAvailable || !bglSlider || !isPressed) return
268
+ if (!isSliderAvailable || !bglSlider || !isPressed) {return}
269
269
 
270
270
  const x = e.pageX
271
271
  const distance = x - startX
272
272
 
273
- if (Math.abs(distance) > THRESHOLDS.DRAG) isDragging = true
273
+ if (Math.abs(distance) > THRESHOLDS.DRAG) {isDragging = true}
274
274
  if (isDragging) {
275
275
  const newTranslate = translateX + (props.rtl ? -distance : distance)
276
276
  const maxTranslate = 0
@@ -291,7 +291,7 @@ function endDrag() {
291
291
  document.removeEventListener('mousemove', onDrag)
292
292
  document.removeEventListener('mouseup', endDrag)
293
293
 
294
- if (!isSliderAvailable || !bglSlider) return
294
+ if (!isSliderAvailable || !bglSlider) {return}
295
295
 
296
296
  const currentTransform = getCurrentTransform()
297
297
  const singleItemWidth = bglSlider.offsetWidth / itemCount
@@ -302,8 +302,8 @@ function endDrag() {
302
302
 
303
303
  let targetPanel = currentPanel
304
304
  if (dragPercentage > THRESHOLDS.SWIPE_PERCENT) {
305
- const distnace = totalDragDistance > 0 ? -1 : 1
306
- targetPanel = Math.floor(currentPanel) + (distnace < 0 ? 0 : 1)
305
+ const distnace = 0 < totalDragDistance ? -1 : 1
306
+ targetPanel = Math.floor(currentPanel) + (0 > distnace ? 0 : 1)
307
307
  } else {
308
308
  targetPanel = Math.round(currentPanel)
309
309
  }
@@ -324,7 +324,7 @@ let hasScrollDirectionLock = $ref(false)
324
324
  let isHorizontalScroll = $ref(false)
325
325
 
326
326
  function onTouchStart(e: TouchEvent) {
327
- if (!props.freeDrag || !isSliderAvailable) return
327
+ if (!props.freeDrag || !isSliderAvailable) {return}
328
328
 
329
329
  const target = e.target as HTMLElement
330
330
  const isInteractive = target.matches('button, a, input, select, textarea, [role="button"]')
@@ -351,7 +351,7 @@ function onTouchStart(e: TouchEvent) {
351
351
  }
352
352
 
353
353
  function onTouchMove(e: TouchEvent) {
354
- if (!isSliderAvailable || !bglSlider || !isPressed) return
354
+ if (!isSliderAvailable || !bglSlider || !isPressed) {return}
355
355
 
356
356
  const touch = e.touches[0]
357
357
  const x = touch.pageX
@@ -362,7 +362,7 @@ function onTouchMove(e: TouchEvent) {
362
362
  // Determine scroll direction if we haven't already
363
363
  if (!hasScrollDirectionLock) {
364
364
  // Only lock in a direction if there's significant movement
365
- if (Math.abs(deltaX) > 5 || Math.abs(deltaY) > 5) {
365
+ if (5 < Math.abs(deltaX) || 5 < Math.abs(deltaY)) {
366
366
  isHorizontalScroll = Math.abs(deltaX) > Math.abs(deltaY)
367
367
  hasScrollDirectionLock = true
368
368
 
@@ -377,7 +377,7 @@ function onTouchMove(e: TouchEvent) {
377
377
  }
378
378
 
379
379
  // If we've determined this is a vertical scroll, don't handle the touch
380
- if (!isHorizontalScroll) return
380
+ if (!isHorizontalScroll) {return}
381
381
 
382
382
  // Update velocity tracking
383
383
  const now = Date.now()
@@ -404,8 +404,8 @@ function onTouchMove(e: TouchEvent) {
404
404
  let newTranslate = translateX + (props.rtl ? -deltaX : deltaX)
405
405
 
406
406
  // Add smooth resistance when pulling beyond bounds
407
- if (newTranslate > 0) {
408
- newTranslate = newTranslate * 0.5 // Softer resistance at start
407
+ if (0 < newTranslate) {
408
+ newTranslate *= 0.5 // Softer resistance at start
409
409
  } else if (newTranslate < -totalWidth + containerWidth) {
410
410
  const overDrag = -totalWidth + containerWidth - newTranslate
411
411
  newTranslate = -totalWidth + containerWidth - (overDrag * 0.5) // Softer resistance at end
@@ -433,7 +433,7 @@ function onTouchEnd() {
433
433
 
434
434
  // Normalize the transform value to handle overscroll
435
435
  let normalizedTransform = currentTransform
436
- if (currentTransform > 0) {
436
+ if (0 < currentTransform) {
437
437
  normalizedTransform = 0
438
438
  } else {
439
439
  const minTransform = -(singleItemWidth * (slideCount - 1) + gapWidth * (slideCount - 1))
@@ -455,14 +455,14 @@ function onTouchEnd() {
455
455
 
456
456
  // Determine direction based on velocity and distance
457
457
  if (Math.abs(finalVelocity) > THRESHOLDS.VELOCITY) {
458
- velocityDirection = finalVelocity < 0 ? 1 : -1
458
+ velocityDirection = 0 > finalVelocity ? 1 : -1
459
459
  }
460
460
 
461
- const isMobile = window.innerWidth < 600
461
+ const isMobile = 600 > window.innerWidth
462
462
 
463
463
  if (swipePercentage > THRESHOLDS.SWIPE_PERCENT || Math.abs(finalVelocity) > THRESHOLDS.VELOCITY) {
464
464
  const direction = swipePercentage > THRESHOLDS.SWIPE_PERCENT
465
- ? (totalSwipeDistance > 0 ? -1 : 1)
465
+ ? (0 < totalSwipeDistance ? -1 : 1)
466
466
  : velocityDirection
467
467
 
468
468
  // Apply RTL correction to direction
@@ -500,7 +500,7 @@ function onTouchEnd() {
500
500
 
501
501
  // Clear transition after animation
502
502
  setTimeout(() => {
503
- if (bglSlider) bglSlider.style.transition = 'none'
503
+ if (bglSlider) {bglSlider.style.transition = 'none'}
504
504
  }, duration)
505
505
 
506
506
  velocityTracker = []
@@ -510,13 +510,13 @@ function onTouchEnd() {
510
510
 
511
511
  // Wheel events
512
512
  function onWheel(e: WheelEvent) {
513
- if (!props.allowScroll || !isSliderAvailable || !bglSlider || isPressed || isDragging) return
513
+ if (!props.allowScroll || !isSliderAvailable || !bglSlider || isPressed || isDragging) {return}
514
514
 
515
515
  const isHorizontal = Math.abs(e.deltaX) > Math.abs(e.deltaY)
516
- if (!isHorizontal) return
516
+ if (!isHorizontal) {return}
517
517
 
518
518
  clearAutoplay()
519
- if (wheelTimeout) clearTimeout(wheelTimeout)
519
+ if (wheelTimeout) {clearTimeout(wheelTimeout)}
520
520
 
521
521
  // Reverse the delta direction for RTL mode
522
522
  accumulatedDeltaX += props.rtl ? -e.deltaX : e.deltaX
@@ -529,7 +529,7 @@ function onWheel(e: WheelEvent) {
529
529
  const moveThreshold = singleItemWidth * THRESHOLDS.WHEEL_PERCENT
530
530
 
531
531
  if (Math.abs(accumulatedDeltaX) > moveThreshold) {
532
- const direction = accumulatedDeltaX > 0 ? 1 : -1
532
+ const direction = 0 < accumulatedDeltaX ? 1 : -1
533
533
  const nextPanel = Math.max(0, Math.min(activeSlideIndex + direction, slideCount - 1))
534
534
 
535
535
  if (nextPanel !== activeSlideIndex) {
@@ -567,8 +567,8 @@ onUnmounted(() => {
567
567
  document.removeEventListener('mousemove', onDrag)
568
568
  document.removeEventListener('mouseup', endDrag)
569
569
  clearAutoplay()
570
- if (timeout) clearTimeout(timeout)
571
- if (wheelTimeout) clearTimeout(wheelTimeout)
570
+ if (timeout) {clearTimeout(timeout)}
571
+ if (wheelTimeout) {clearTimeout(wheelTimeout)}
572
572
  })
573
573
 
574
574
  // Watchers
@@ -41,7 +41,7 @@ const {
41
41
 
42
42
  const firstItem = computed(() => {
43
43
  // Handle empty computedData
44
- if (!computedData.value || computedData.value.length === 0) {
44
+ if (!computedData.value || 0 === computedData.value.length) {
45
45
  return {} as T
46
46
  }
47
47
 
@@ -17,7 +17,7 @@ const isDragging = ref(false)
17
17
  const dragCounter = ref(0)
18
18
 
19
19
  function handleDragEnter(e: DragEvent) {
20
- if (props.disabled) return
20
+ if (props.disabled) {return}
21
21
  e.preventDefault()
22
22
  e.stopPropagation()
23
23
  dragCounter.value++
@@ -25,17 +25,17 @@ function handleDragEnter(e: DragEvent) {
25
25
  }
26
26
 
27
27
  function handleDragOver(e: DragEvent) {
28
- if (props.disabled) return
28
+ if (props.disabled) {return}
29
29
  e.preventDefault()
30
30
  e.stopPropagation()
31
31
  }
32
32
 
33
33
  function handleDragLeave(e: DragEvent) {
34
- if (props.disabled) return
34
+ if (props.disabled) {return}
35
35
  e.preventDefault()
36
36
  e.stopPropagation()
37
37
  dragCounter.value--
38
- if (dragCounter.value === 0) {
38
+ if (0 === dragCounter.value) {
39
39
  isDragging.value = false
40
40
  }
41
41
  }
@@ -60,13 +60,13 @@ function handleClick(e: MouseEvent) {
60
60
  }
61
61
 
62
62
  function handleDrop(e: DragEvent) {
63
- if (props.disabled) return
63
+ if (props.disabled) {return}
64
64
  e.preventDefault()
65
65
  e.stopPropagation()
66
66
  dragCounter.value = 0
67
67
  isDragging.value = false
68
68
 
69
- if (!e.dataTransfer) return
69
+ if (!e.dataTransfer) {return}
70
70
  emit('addFiles', e.dataTransfer.files)
71
71
  }
72
72
  </script>
@@ -90,8 +90,8 @@ const {
90
90
  const emit = defineEmits(['show', 'hide'])
91
91
 
92
92
  const iconSet = $computed(() => {
93
- if (icon) return icon
94
- if (!value) return 'more_vert'
93
+ if (icon) {return icon}
94
+ if (!value) {return 'more_vert'}
95
95
  return undefined
96
96
  })
97
97
 
@@ -116,12 +116,12 @@ const shouldDisablePositioning = $computed(() => {
116
116
  })
117
117
 
118
118
  // Convert hover triggers to click on small screens (tablets and mobile)
119
- const isSmallScreen = $computed(() => innerWidth.value < 910)
119
+ const isSmallScreen = $computed(() => 910 > innerWidth.value)
120
120
 
121
121
  const computedTriggers = $computed((): TriggerEvent[] => {
122
122
  if (isSmallScreen && triggers.includes('hover')) {
123
123
  // Replace hover with click on small screens
124
- return triggers.map(trigger => trigger === 'hover' ? 'click' : trigger) as TriggerEvent[]
124
+ return triggers.map(trigger => 'hover' === trigger ? 'click' : trigger) as TriggerEvent[]
125
125
  }
126
126
  return triggers
127
127
  })
@@ -131,7 +131,7 @@ const computedShowTriggers = $computed((): TriggerEvent[] => {
131
131
  if (showTriggers !== undefined) {
132
132
  // Also convert hover to click in showTriggers on small screens
133
133
  if (isSmallScreen && showTriggers.includes('hover')) {
134
- return showTriggers.map(trigger => trigger === 'hover' ? 'click' : trigger) as TriggerEvent[]
134
+ return showTriggers.map(trigger => 'hover' === trigger ? 'click' : trigger) as TriggerEvent[]
135
135
  }
136
136
  return showTriggers
137
137
  }
@@ -142,12 +142,12 @@ const computedHideTriggers = $computed((): TriggerEvent[] => {
142
142
  if (hideTriggers !== undefined) {
143
143
  // Also convert hover to click in hideTriggers on small screens
144
144
  if (isSmallScreen && hideTriggers.includes('hover')) {
145
- return hideTriggers.map(trigger => trigger === 'hover' ? 'click' : trigger) as TriggerEvent[]
145
+ return hideTriggers.map(trigger => 'hover' === trigger ? 'click' : trigger) as TriggerEvent[]
146
146
  }
147
147
  return hideTriggers
148
148
  }
149
149
  // For click-only dropdowns, only hide on click
150
- if (computedTriggers.length === 1 && computedTriggers[0] === 'click') {
150
+ if (1 === computedTriggers.length && 'click' === computedTriggers[0]) {
151
151
  return ['click'] as TriggerEvent[]
152
152
  }
153
153
  // For hover dropdowns, add click to hide triggers for better UX
@@ -159,7 +159,7 @@ const computedHideTriggers = $computed((): TriggerEvent[] => {
159
159
  })
160
160
 
161
161
  const computedPopperTriggers = $computed((): TriggerEvent[] => {
162
- if (popperTriggers.length > 0) return popperTriggers
162
+ if (0 < popperTriggers.length) {return popperTriggers}
163
163
  // For hover dropdowns, enable hover on popper to keep it open
164
164
  // But on small screens, don't add hover triggers since we convert to click
165
165
  if (triggers.includes('hover') && !isSmallScreen) {
@@ -170,16 +170,16 @@ const computedPopperTriggers = $computed((): TriggerEvent[] => {
170
170
 
171
171
  // Ensure we do not override popper show triggers with an empty array
172
172
  const computedPopperShowTriggers = $computed((): TriggerEvent[] | undefined => {
173
- const hasExplicitShowTriggers = Array.isArray(popperShowTriggers) && popperShowTriggers.length > 0
174
- if (hasExplicitShowTriggers) return popperShowTriggers
173
+ const hasExplicitShowTriggers = Array.isArray(popperShowTriggers) && 0 < popperShowTriggers.length
174
+ if (hasExplicitShowTriggers) {return popperShowTriggers}
175
175
  // Only add hover for popper on large screens
176
- if (triggers.includes('hover') && !isSmallScreen) return ['hover'] as TriggerEvent[]
176
+ if (triggers.includes('hover') && !isSmallScreen) {return ['hover'] as TriggerEvent[]}
177
177
  return undefined
178
178
  })
179
179
 
180
180
  const computedPopperHideTriggers = $computed((): TriggerEvent[] => {
181
- const hasExplicitHideTriggers = Array.isArray(popperHideTriggers) && popperHideTriggers.length > 0
182
- if (hasExplicitHideTriggers) return popperHideTriggers
181
+ const hasExplicitHideTriggers = Array.isArray(popperHideTriggers) && 0 < popperHideTriggers.length
182
+ if (hasExplicitHideTriggers) {return popperHideTriggers}
183
183
  // For hover dropdowns, make sure popper hides on mouseout
184
184
  // But only on large screens where hover is meaningful
185
185
  if (triggers.includes('hover') && !isSmallScreen) {
@@ -191,7 +191,7 @@ const computedPopperHideTriggers = $computed((): TriggerEvent[] => {
191
191
  const computedAutoHide = $computed(() => autoHide)
192
192
 
193
193
  const computedDelay = $computed((): number | { show: number, hide: number } | undefined => {
194
- if (delay !== undefined) return delay
194
+ if (delay !== undefined) {return delay}
195
195
  // For hover dropdowns, add a hide delay (but only on large screens)
196
196
  if (triggers.includes('hover') && !isSmallScreen) {
197
197
  return { show: 0, hide: 10 } // 10ms delay before hiding
@@ -10,16 +10,16 @@ interface FlagProps {
10
10
  const props = defineProps<FlagProps>()
11
11
 
12
12
  const fis = $computed(() => {
13
- if (props.circle || props.square) return true
13
+ if (props.circle || props.square) {return true}
14
14
  return false
15
15
  })
16
16
  const height = $computed(() => `${props.size || 1}rem`)
17
17
 
18
18
  const backgroundImage = $computed(() => {
19
19
  let country = props.country.toLowerCase()
20
- if (country === 'ac') country = 'sh-ac'
20
+ if ('ac' === country) {country = 'sh-ac'}
21
21
  const baseURL = 'https://cdn.jsdelivr.net/gh/lipis/flag-icons@7.0.0/flags'
22
- if (fis) return `url(${baseURL}/1x1/${country.toLowerCase()}.svg)`
22
+ if (fis) {return `url(${baseURL}/1x1/${country.toLowerCase()}.svg)`}
23
23
  return `url(${baseURL}/4x3/${country.toLowerCase()}.svg)`
24
24
  })
25
25
  </script>