bfg-common 1.0.21 → 1.0.22

package/components/atoms/alert/Alert.spec.ts

@@ -1,38 +1,38 @@
-// @ts-ignore
-import { describe, test, expect } from 'vitest'
-// @ts-ignore
-import { mount } from '@vue/test-utils'
-import Alert from './Alert.vue'
-
-const factory = () => {
-  return mount(Alert, {
-    props: {
-      status: 'alert-danger',
-      items: ['test1', 'test2']
-    }
-  })
-}
-
-describe('Alert.vue', () => {
-  test('check props', async () => {
-    const wrapper = await factory()
-
-    const alert = wrapper.find('.alert.alert-danger')
-    expect(alert.exists()).toBe(true)
-
-    const alertTexts = wrapper.findAll('.alert-text')
-    expect(alertTexts.at(0).text()).toBe('test1')
-    expect(alertTexts.at(1).text()).toBe('test2')
-
-    const alertIcon = wrapper.find('.alert-icon')
-    expect(alertIcon.attributes().name).toBe('exclamation-circle')
-  })
-
-  test('Remove alert', async () => {
-    const wrapper = await factory()
-
-    const closeBtn = wrapper.find('.close')
-    closeBtn.trigger('click')
-    expect(wrapper.emitted().remove).toBeDefined()
-  })
-})
+// @ts-ignore
+import { describe, test, expect } from 'vitest'
+// @ts-ignore
+import { mount } from '@vue/test-utils'
+import Alert from './Alert.vue'
+
+const factory = () => {
+  return mount(Alert, {
+    props: {
+      status: 'alert-danger',
+      items: ['test1', 'test2']
+    }
+  })
+}
+
+describe('Alert.vue', () => {
+  test('check props', async () => {
+    const wrapper = await factory()
+
+    const alert = wrapper.find('.alert.alert-danger')
+    expect(alert.exists()).toBe(true)
+
+    const alertTexts = wrapper.findAll('.alert-text')
+    expect(alertTexts.at(0).text()).toBe('test1')
+    expect(alertTexts.at(1).text()).toBe('test2')
+
+    const alertIcon = wrapper.find('.alert-icon')
+    expect(alertIcon.attributes().name).toBe('exclamation-circle')
+  })
+
+  test('Remove alert', async () => {
+    const wrapper = await factory()
+
+    const closeBtn = wrapper.find('.close')
+    closeBtn.trigger('click')
+    expect(wrapper.emitted().remove).toBeDefined()
+  })
+})

package/components/atoms/alert/Alert.vue

@@ -1,84 +1,84 @@
-<template>
-  <div :class="['alert', status]">
-    <div class="alert-items">
-      <slot v-if="$slots.headline" name="headline" :icon="iconName" />
-
-      <div v-for="(item, key) in items" :key="key" class="alert-item">
-        <div v-if="!$slots.headline" class="alert-icon-wrapper">
-          <atoms-the-icon :class="['alert-icon', iconName]" :name="iconName" />
-        </div>
-
-        <slot :item="item" :index="key">
-          <span class="alert-text">{{ item }}</span>
-        </slot>
-      </div>
-    </div>
-    <button
-      v-if="!hideCloseIcon"
-      :id="`${props.testId}-close-button`"
-      class="close"
-      @click="removeAlert"
-    >
-      <atoms-the-icon class="alert-icon" name="close" />
-    </button>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { UI_E_IconsByStatus } from '~/components/atoms/alert/models/enums'
-
-const props = withDefaults(
-  defineProps<{
-    testId?: string
-    status: 'alert-danger' | 'alert-warning' | 'alert-info' | 'alert-success'
-    items: string[]
-    hideCloseIcon?: boolean
-  }>(),
-  { testId: 'ui-alert' }
-)
-const emits = defineEmits<{
-  (event: 'remove'): void
-}>()
-
-const removeAlert = (): void => {
-  emits('remove')
-}
-const iconName = computed(() => UI_E_IconsByStatus[props.status])
-</script>
-
-<style scoped lang="scss">
-.alert {
-  &-info {
-    fill: #004d8a;
-  }
-  &-warning {
-    background-color: var(--alert-warning-bg-color);
-    border: 1px solid var(--alert-warning-border-color);
-    fill: var(--alert-warning-icon-color);
-  }
-
-  &-icon {
-    width: 20px;
-    height: 20px;
-  }
-  &-text {
-    color: var(--global-font-color5);
-  }
-
-  button.close:focus {
-    box-shadow: none;
-  }
-}
-</style>
-<style>
-:root {
-  --alert-warning-icon-color: #d28f00;
-  --alert-warning-bg-color: #fef3b5;
-  --alert-warning-border-color: #d28f00;
-}
-:root.dark-theme {
-  --alert-warning-icon-color: currentColor;
-  --alert-warning-bg-color: #816709;
-  --alert-warning-border-color: transparent;
-}
-</style>
+<template>
+  <div :class="['alert', status]">
+    <div class="alert-items">
+      <slot v-if="$slots.headline" name="headline" :icon="iconName" />
+
+      <div v-for="(item, key) in items" :key="key" class="alert-item">
+        <div v-if="!$slots.headline" class="alert-icon-wrapper">
+          <atoms-the-icon :class="['alert-icon', iconName]" :name="iconName" />
+        </div>
+
+        <slot :item="item" :index="key">
+          <span class="alert-text">{{ item }}</span>
+        </slot>
+      </div>
+    </div>
+    <button
+      v-if="!hideCloseIcon"
+      :id="`${props.testId}-close-button`"
+      class="close"
+      @click="removeAlert"
+    >
+      <atoms-the-icon class="alert-icon" name="close" />
+    </button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { UI_E_IconsByStatus } from '~/components/atoms/alert/models/enums'
+
+const props = withDefaults(
+  defineProps<{
+    testId?: string
+    status: 'alert-danger' | 'alert-warning' | 'alert-info' | 'alert-success'
+    items: string[]
+    hideCloseIcon?: boolean
+  }>(),
+  { testId: 'ui-alert' }
+)
+const emits = defineEmits<{
+  (event: 'remove'): void
+}>()
+
+const removeAlert = (): void => {
+  emits('remove')
+}
+const iconName = computed(() => UI_E_IconsByStatus[props.status])
+</script>
+
+<style scoped lang="scss">
+.alert {
+  &-info {
+    fill: #004d8a;
+  }
+  &-warning {
+    background-color: var(--alert-warning-bg-color);
+    border: 1px solid var(--alert-warning-border-color);
+    fill: var(--alert-warning-icon-color);
+  }
+
+  &-icon {
+    width: 20px;
+    height: 20px;
+  }
+  &-text {
+    color: var(--global-font-color5);
+  }
+
+  button.close:focus {
+    box-shadow: none;
+  }
+}
+</style>
+<style>
+:root {
+  --alert-warning-icon-color: #d28f00;
+  --alert-warning-bg-color: #fef3b5;
+  --alert-warning-border-color: #d28f00;
+}
+:root.dark-theme {
+  --alert-warning-icon-color: currentColor;
+  --alert-warning-bg-color: #816709;
+  --alert-warning-border-color: transparent;
+}
+</style>

package/components/atoms/alert/Notification.spec.ts

@@ -1,34 +1,34 @@
-// import { describe, test, expect, vi } from 'vitest'
-// import { mount } from '@vue/test-utils'
-// import Alert from './Notification.vue'
-//
-// vi.stubGlobal('useLocal', () => {
-//   return { closeNotification: '-' }
-// })
-//
-// const factory = () => {
-//   return mount(Alert, {
-//     props: {
-//       show: true,
-//       top: '10px',
-//       title: 'Title',
-//       description: 'Description'
-//     }
-//   })
-// }
-//
-// describe('Notification.vue', () => {
-//   test('check props', async () => {
-//     const wrapper = await factory()
-//
-//     expect(wrapper.find('h4').text()).toBe('Title')
-//     expect(wrapper.find('p.description').text()).toBe('Description')
-//   })
-//   test('check props', async () => {
-//     const wrapper = await factory()
-//
-//     await wrapper.find('button').trigger('click')
-//
-//     expect(wrapper.emitted().hide.length).toBe(1)
-//   })
-// })
+// import { describe, test, expect, vi } from 'vitest'
+// import { mount } from '@vue/test-utils'
+// import Alert from './Notification.vue'
+//
+// vi.stubGlobal('useLocal', () => {
+//   return { closeNotification: '-' }
+// })
+//
+// const factory = () => {
+//   return mount(Alert, {
+//     props: {
+//       show: true,
+//       top: '10px',
+//       title: 'Title',
+//       description: 'Description'
+//     }
+//   })
+// }
+//
+// describe('Notification.vue', () => {
+//   test('check props', async () => {
+//     const wrapper = await factory()
+//
+//     expect(wrapper.find('h4').text()).toBe('Title')
+//     expect(wrapper.find('p.description').text()).toBe('Description')
+//   })
+//   test('check props', async () => {
+//     const wrapper = await factory()
+//
+//     await wrapper.find('button').trigger('click')
+//
+//     expect(wrapper.emitted().hide.length).toBe(1)
+//   })
+// })

package/components/atoms/alert/models/enums.ts

@@ -1,12 +1,12 @@
-export enum UI_E_IconsByStatus {
-  'alert-danger' = 'exclamation-circle',
-  'alert-warning' = 'exclamation-triangle',
-  'alert-info' = 'info-circle',
-  'alert-success' = 'success-circle',
-}
-
-export enum UI_E_IconsByStatusNotification {
-  'success' = 'success-circle',
-  'error' = 'info',
-  'warning' = 'warning',
-}
+export enum UI_E_IconsByStatus {
+  'alert-danger' = 'exclamation-circle',
+  'alert-warning' = 'exclamation-triangle',
+  'alert-info' = 'info-circle',
+  'alert-success' = 'success-circle',
+}
+
+export enum UI_E_IconsByStatusNotification {
+  'success' = 'success-circle',
+  'error' = 'info',
+  'warning' = 'warning',
+}

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

@@ -1,27 +1,27 @@
-import { UI_T_Status } from '~/components/atoms/alert/models/types'
-
-interface UI_I_NotificationMessageItem {
-  title: string
-  descriptions: string[]
-}
-
-export interface UI_I_NotificationMessage {
-  id?: number
-  isShow?: boolean
-  headline: string
-  timeout?: number
-  status: UI_T_Status
-  messages: UI_I_NotificationMessageItem[]
-}
-
-export interface UI_I_NotificationHide {
-  id: number
-  clear?: boolean
-}
-
-export interface UI_I_NotificationMsgBody {
-  // временно потом удалить
-  show: boolean
-  title: string
-  desc: string
-}
+import { UI_T_Status } from '~/components/atoms/alert/models/types'
+
+interface UI_I_NotificationMessageItem {
+  title: string
+  descriptions: string[]
+}
+
+export interface UI_I_NotificationMessage {
+  id?: number
+  isShow?: boolean
+  headline: string
+  timeout?: number
+  status: UI_T_Status
+  messages: UI_I_NotificationMessageItem[]
+}
+
+export interface UI_I_NotificationHide {
+  id: number
+  clear?: boolean
+}
+
+export interface UI_I_NotificationMsgBody {
+  // временно потом удалить
+  show: boolean
+  title: string
+  desc: string
+}

package/components/atoms/alert/models/types.ts

@@ -1,7 +1,7 @@
-export type UI_T_Status = 'success' | 'error' | 'warning'
-
-
-
-
-
-
+export type UI_T_Status = 'success' | 'error' | 'warning'
+
+
+
+
+
+