bfg-common 1.2.53 → 1.2.55

package/components/atoms/combobox/Combobox.vue

@@ -1,147 +1,147 @@
-<template>
-  <div
-    tabindex="-1"
-    :class="['tooltip-top-left combobox-container', { isOpen }]"
-  >
-    <atoms-the-icon
-      v-show="!isOpen"
-      class="angle-icon clr-icon"
-      name="angle"
-      @click="onFocusInput"
-    />
-    <input
-      :id="id"
-      v-model="modelValueLocal"
-      type="text"
-      tabindex="-1"
-      :disabled="props.disabled"
-      @focus="showMenu"
-      @blur="hideMenu"
-    />
-    <atoms-the-icon
-      v-show="isOpen"
-      class="close-icon clr-icon"
-      name="close-circle"
-      @mousedown="clear"
-    />
-
-    <Teleport to="body">
-      <div v-show="isOpen" class="dropdown-menu" :style="dropdownMenuStyles">
-        <button
-          v-for="(item, key) in props.items"
-          :key="key"
-          :id="`${id}-${key}`"
-          class="btn btn-link dropdown-item"
-          @mousedown="select(item.value)"
-        >
-          {{ item.text }}
-        </button>
-      </div>
-    </Teleport>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { UI_I_OptionItem } from '~/components/atoms/models/interfaces'
-
-const props = defineProps<{
-  items: UI_I_OptionItem[]
-  modelValue?: string | number
-  disabled?: boolean
-}>()
-const emits = defineEmits<{
-  (event: 'update:model-value', value: string | number): void
-  (event: 'select', value: string | number): void
-}>()
-
-const modelValueLocal = computed<string | number | undefined>({
-  get() {
-    return props.modelValue
-  },
-  set(newValue) {
-    if (newValue === undefined) return
-    emits('update:model-value', newValue)
-  },
-})
-
-const id = `combobox${useUniqueId()}`
-
-const dropdownMenuStyles = ref({})
-const showMenu = (): void => {
-  isOpen.value = true
-
-  const input = document.querySelector(`#${id}`)
-  if (!input) return
-
-  const { top, height, left } = input.getBoundingClientRect()
-
-  dropdownMenuStyles.value = {
-    top: `${top + height}px`,
-    left: `${left}px`,
-  }
-}
-const hideMenu = (): void => {
-  isOpen.value = false
-}
-
-const select = (value: string | number): void => {
-  emits('update:model-value', value)
-  emits('select', value)
-}
-const clear = (): void => {
-  emits('update:model-value', '')
-}
-
-const isOpen = ref(false)
-
-const onFocusInput = (event: Event) => {
-  const target = event.target as HTMLElement
-  target && target.nextSibling && target.nextSibling.focus()
-}
-</script>
-
-<style scoped lang="scss">
-.combobox-container {
-  max-width: 800px;
-  position: relative;
-
-  .close-icon,
-  .angle-icon {
-    fill: #565656;
-    position: absolute;
-    right: 5px;
-    top: 5px;
-    transform: rotate(180deg);
-    cursor: pointer;
-  }
-}
-
-.stack-block-expanded > .stack-block-label {
-  .close-icon,
-  .angle-icon {
-    fill: #ffffff;
-  }
-}
-
-.dropdown-menu {
-  position: fixed;
-  background-color: var(--dropdown-bg-color);
-  border-color: var(--block-border-color);
-  z-index: 1000000000;
-  visibility: unset;
-
-  .dropdown-item {
-    border-bottom: 1px solid transparent;
-    border-radius: 0;
-    color: var(--global-font-color3);
-    &:hover {
-      background-color: var(--row-hover-bg-color);
-      border-color: var(--row-hover-border-color);
-      color: var(--global-font-color3);
-    }
-  }
-  .dropdown-divider {
-    border-color: var(--block-border-color);
-  }
-}
-</style>
+<template>
+  <div
+    tabindex="-1"
+    :class="['tooltip-top-left combobox-container', { isOpen }]"
+  >
+    <atoms-the-icon
+      v-show="!isOpen"
+      class="angle-icon clr-icon"
+      name="angle"
+      @click="onFocusInput"
+    />
+    <input
+      :id="id"
+      v-model="modelValueLocal"
+      type="text"
+      tabindex="-1"
+      :disabled="props.disabled"
+      @focus="showMenu"
+      @blur="hideMenu"
+    />
+    <atoms-the-icon
+      v-show="isOpen"
+      class="close-icon clr-icon"
+      name="close-circle"
+      @mousedown="clear"
+    />
+
+    <Teleport to="body">
+      <div v-show="isOpen" class="dropdown-menu" :style="dropdownMenuStyles">
+        <button
+          v-for="(item, key) in props.items"
+          :key="key"
+          :id="`${id}-${key}`"
+          class="btn btn-link dropdown-item"
+          @mousedown="select(item.value)"
+        >
+          {{ item.text }}
+        </button>
+      </div>
+    </Teleport>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { UI_I_OptionItem } from '~/components/atoms/models/interfaces'
+
+const props = defineProps<{
+  items: UI_I_OptionItem[]
+  modelValue?: string | number
+  disabled?: boolean
+}>()
+const emits = defineEmits<{
+  (event: 'update:model-value', value: string | number): void
+  (event: 'select', value: string | number): void
+}>()
+
+const modelValueLocal = computed<string | number | undefined>({
+  get() {
+    return props.modelValue
+  },
+  set(newValue) {
+    if (newValue === undefined) return
+    emits('update:model-value', newValue)
+  },
+})
+
+const id = `combobox${useUniqueId()}`
+
+const dropdownMenuStyles = ref({})
+const showMenu = (): void => {
+  isOpen.value = true
+
+  const input = document.querySelector(`#${id}`)
+  if (!input) return
+
+  const { top, height, left } = input.getBoundingClientRect()
+
+  dropdownMenuStyles.value = {
+    top: `${top + height}px`,
+    left: `${left}px`,
+  }
+}
+const hideMenu = (): void => {
+  isOpen.value = false
+}
+
+const select = (value: string | number): void => {
+  emits('update:model-value', value)
+  emits('select', value)
+}
+const clear = (): void => {
+  emits('update:model-value', '')
+}
+
+const isOpen = ref(false)
+
+const onFocusInput = (event: Event) => {
+  const target = event.target as HTMLElement
+  target && target.nextSibling && target.nextSibling.focus()
+}
+</script>
+
+<style scoped lang="scss">
+.combobox-container {
+  max-width: 800px;
+  position: relative;
+
+  .close-icon,
+  .angle-icon {
+    fill: #565656;
+    position: absolute;
+    right: 5px;
+    top: 5px;
+    transform: rotate(180deg);
+    cursor: pointer;
+  }
+}
+
+.stack-block-expanded > .stack-block-label {
+  .close-icon,
+  .angle-icon {
+    fill: #ffffff;
+  }
+}
+
+.dropdown-menu {
+  position: fixed;
+  background-color: var(--dropdown-bg-color);
+  border-color: var(--block-border-color);
+  z-index: 1000000000;
+  visibility: unset;
+
+  .dropdown-item {
+    border-bottom: 1px solid transparent;
+    border-radius: 0;
+    color: var(--global-font-color3);
+    &:hover {
+      background-color: var(--row-hover-bg-color);
+      border-color: var(--row-hover-border-color);
+      color: var(--global-font-color3);
+    }
+  }
+  .dropdown-divider {
+    border-color: var(--block-border-color);
+  }
+}
+</style>

package/components/atoms/datepicker/config/allShortMonths.ts

@@ -1,103 +1,103 @@
-import { UI_I_ArbitraryObject } from '~/models/interfaces'
-
-const hyShortMonths: string[] = [
-  'Հնվ',
-  'Փետ',
-  'Մար',
-  'Ապր',
-  'Մայ',
-  'Հուն',
-  'Հուլ',
-  'Օգս',
-  'Սեպ',
-  'Հոկ',
-  'Նոյ',
-  'Դեկ',
-]
-
-const enShortMonths: string[] = [
-  'Jan',
-  'Feb',
-  'Mar',
-  'Apr',
-  'May',
-  'Jun',
-  'Jul',
-  'Aug',
-  'Sep',
-  'Oct',
-  'Nov',
-  'Dec',
-]
-
-const ruShortMonths: string[] = [
-  'янв',
-  'фев',
-  'мар',
-  'апр',
-  'мая',
-  'июн',
-  'июл',
-  'авг',
-  'сен',
-  'окт',
-  'ноя',
-  'дек',
-]
-
-const beShortMonths: string[] = [
-  'сту',
-  'лют',
-  'сак',
-  'кра',
-  'тра',
-  'чэр',
-  'ліп',
-  'жні',
-  'вер',
-  'кас',
-  'ліс',
-  'сне',
-]
-
-const kzShortMonths: string[] = [
-  'қаң',
-  'ақп',
-  'нау',
-  'сәу',
-  'мам',
-  'мау',
-  'шіл',
-  'там',
-  'қыр',
-  'қаз',
-  'қар',
-  'қар',
-]
-
-const chShortMonths: string[] = [
-  '哈月',
-  '阿克鲁月',
-  '纳乌月',
-  '萨乌月',
-  '马穆月',
-  '茉月',
-  '希尔月',
-  '塔穆月',
-  '奎尔月',
-  '哈斯月',
-  '哈尔月',
-  '哲尔月',
-]
-
-const allShortMonths: UI_I_ArbitraryObject<string[]> = {
-  hy_AM: hyShortMonths,
-  en_US: enShortMonths,
-  ru_RU: ruShortMonths,
-  be_BY: beShortMonths,
-  kk_KZ: kzShortMonths,
-  zh_CHS: chShortMonths,
-}
-
-export const getShortMonths = (language: string): string[] =>
-  allShortMonths[language]
+import { UI_I_ArbitraryObject } from '~/models/interfaces'
+
+const hyShortMonths: string[] = [
+  'Հնվ',
+  'Փետ',
+  'Մար',
+  'Ապր',
+  'Մայ',
+  'Հուն',
+  'Հուլ',
+  'Օգս',
+  'Սեպ',
+  'Հոկ',
+  'Նոյ',
+  'Դեկ',
+]
+
+const enShortMonths: string[] = [
+  'Jan',
+  'Feb',
+  'Mar',
+  'Apr',
+  'May',
+  'Jun',
+  'Jul',
+  'Aug',
+  'Sep',
+  'Oct',
+  'Nov',
+  'Dec',
+]
+
+const ruShortMonths: string[] = [
+  'янв',
+  'фев',
+  'мар',
+  'апр',
+  'мая',
+  'июн',
+  'июл',
+  'авг',
+  'сен',
+  'окт',
+  'ноя',
+  'дек',
+]
+
+const beShortMonths: string[] = [
+  'сту',
+  'лют',
+  'сак',
+  'кра',
+  'тра',
+  'чэр',
+  'ліп',
+  'жні',
+  'вер',
+  'кас',
+  'ліс',
+  'сне',
+]
+
+const kzShortMonths: string[] = [
+  'қаң',
+  'ақп',
+  'нау',
+  'сәу',
+  'мам',
+  'мау',
+  'шіл',
+  'там',
+  'қыр',
+  'қаз',
+  'қар',
+  'қар',
+]
+
+const chShortMonths: string[] = [
+  '哈月',
+  '阿克鲁月',
+  '纳乌月',
+  '萨乌月',
+  '马穆月',
+  '茉月',
+  '希尔月',
+  '塔穆月',
+  '奎尔月',
+  '哈斯月',
+  '哈尔月',
+  '哲尔月',
+]
+
+const allShortMonths: UI_I_ArbitraryObject<string[]> = {
+  hy_AM: hyShortMonths,
+  en_US: enShortMonths,
+  ru_RU: ruShortMonths,
+  be_BY: beShortMonths,
+  kk_KZ: kzShortMonths,
+  zh_CHS: chShortMonths,
+}
+
+export const getShortMonths = (language: string): string[] =>
+  allShortMonths[language]

package/components/atoms/datepicker/config/datapicker.ts

@@ -1,43 +1,43 @@
-import { UI_I_Localization } from '~/models/interfaces'
-
-export const getMonthsFunc = (localization: UI_I_Localization): string[] => {
-  return [
-    localization.january,
-    localization.february,
-    localization.march,
-    localization.april,
-    localization.may,
-    localization.june,
-    localization.july,
-    localization.august,
-    localization.september,
-    localization.october,
-    localization.november,
-    localization.december,
-  ]
-}
-
-export const getWeekdaysFunc = (
-  localization: UI_I_Localization,
-  languageCode: string
-): string[] => {
-  let result = [
-    localization.sunday,
-    localization.monday,
-    localization.tuesday,
-    localization.wednesday,
-    localization.thursday,
-    localization.friday,
-    localization.saturday,
-  ]
-  result = result.map((week: string, key: number) =>
-    languageCode === 'hy_AM' && key === 5 ? week[0] + week[1] : week[0]
-  )
-
-  if (languageCode !== 'en_US') {
-    const first = result.shift()
-    first && result.push(first)
-  }
-
-  return result
-}
+import { UI_I_Localization } from '~/models/interfaces'
+
+export const getMonthsFunc = (localization: UI_I_Localization): string[] => {
+  return [
+    localization.january,
+    localization.february,
+    localization.march,
+    localization.april,
+    localization.may,
+    localization.june,
+    localization.july,
+    localization.august,
+    localization.september,
+    localization.october,
+    localization.november,
+    localization.december,
+  ]
+}
+
+export const getWeekdaysFunc = (
+  localization: UI_I_Localization,
+  languageCode: string
+): string[] => {
+  let result = [
+    localization.sunday,
+    localization.monday,
+    localization.tuesday,
+    localization.wednesday,
+    localization.thursday,
+    localization.friday,
+    localization.saturday,
+  ]
+  result = result.map((week: string, key: number) =>
+    languageCode === 'hy_AM' && key === 5 ? week[0] + week[1] : week[0]
+  )
+
+  if (languageCode !== 'en_US') {
+    const first = result.shift()
+    first && result.push(first)
+  }
+
+  return result
+}

package/components/atoms/datepicker/models/interfaces.ts

@@ -1,8 +1,8 @@
-export interface UI_I_Items {
-  text: number | string
-  class: string
-}
-
-export interface UI_I_AllShortMonths {
-  [key: string]: string[]
-}
+export interface UI_I_Items {
+  text: number | string
+  class: string
+}
+
+export interface UI_I_AllShortMonths {
+  [key: string]: string[]
+}

package/components/atoms/dropdown/Portlet.spec.ts

@@ -1,26 +1,26 @@
-import { describe, test, expect } from 'vitest'
-import { mount } from '@vue/test-utils'
-import Portlet from './Portlet.vue'
-
-const factory = () => {
-  return mount(Portlet, {
-    props: {
-      title: 'Title'
-    }
-  })
-}
-
-describe('Portlet.vue', () => {
-  test('test props', async () => {
-    const wrapper = await factory()
-
-    expect(wrapper.find('.titlebar-text').text()).toBe('Title')
-  })
-  test('test portlet collapse', async () => {
-    const wrapper = await factory()
-
-    expect(wrapper.find('.portlet-content').attributes().style).not.toBe('display: none;')
-    await wrapper.find('.portlet-titlebar').trigger('click')
-    expect(wrapper.find('.portlet-content').attributes().style).toBe('display: none;')
-  })
-})
+import { describe, test, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import Portlet from './Portlet.vue'
+
+const factory = () => {
+  return mount(Portlet, {
+    props: {
+      title: 'Title'
+    }
+  })
+}
+
+describe('Portlet.vue', () => {
+  test('test props', async () => {
+    const wrapper = await factory()
+
+    expect(wrapper.find('.titlebar-text').text()).toBe('Title')
+  })
+  test('test portlet collapse', async () => {
+    const wrapper = await factory()
+
+    expect(wrapper.find('.portlet-content').attributes().style).not.toBe('display: none;')
+    await wrapper.find('.portlet-titlebar').trigger('click')
+    expect(wrapper.find('.portlet-content').attributes().style).toBe('display: none;')
+  })
+})