bfg-common 1.5.431 → 1.5.433

package/components/atoms/wizard/step/Step.vue

@@ -34,7 +34,7 @@
 import type {
   UI_I_WizardStepNavigation,
   UI_I_WizardSchemeData,
-} from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
+} from '~/components/atoms/wizard/lib/models/interfaces'
 
 const props = withDefaults(
   defineProps<{

package/components/common/backup/storage/actions/add/Add.vue

@@ -36,18 +36,18 @@
 </template>
 
 <script setup lang="ts">
-import type {
-  UI_I_ValidationReturn,
-  UI_I_WizardStep,
-} from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
-import Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
 import type { UI_T_Project } from '~/lib/models/types'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
 import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type {
+  UI_I_ValidationReturn,
+  UI_I_WizardStep,
+} from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_T_DatastoreTypeCode } from '~/components/common/backup/storage/actions/add/lib/models/types'
 // TODO use from uikit
+import Wizard from '~/components/atoms/wizard/lib/utils/utils'
 import {
   stepsFunc,
   stepsSchemeInitial,

package/components/common/backup/storage/actions/add/Old.vue

@@ -73,8 +73,8 @@
 </template>
 
 <script setup lang="ts">
-import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
+import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_T_Project } from '~/lib/models/types'
 import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'

package/components/common/backup/storage/actions/add/lib/config/steps.ts

@@ -1,9 +1,9 @@
-import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
-import { UI_E_WIZARD_STATUS } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/enums'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_T_Project } from '~/lib/models/types'
+import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_ChangeStepsSchemes } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 import type { UI_T_DatastoreTypeCode } from '~/components/common/backup/storage/actions/add/lib/models/types'
+import { UI_E_WIZARD_STATUS } from '~/components/atoms/wizard/lib/models/enums'
 
 export const dynamicSteps = {
   type: 0,

package/components/common/backup/storage/actions/add/lib/validations.ts

@@ -1,11 +1,11 @@
+import type Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
+import type { UI_T_Project } from '~/lib/models/types'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type {
   UI_I_AsyncCheckReturn,
   UI_I_ValidationReturn,
   UI_I_WizardStep,
-} from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
-import type Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
-import type { UI_T_Project } from '~/lib/models/types'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
+} from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 import { checkValidityName } from '~/components/common/backup/storage/actions/add/lib/utils'
 import { dynamicSteps } from '~/components/common/backup/storage/actions/add/lib/config/steps'

package/components/common/backup/storage/actions/add/steps/name/Name.vue

@@ -17,9 +17,9 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_ErrorFields } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type { UI_T_Project } from '~/lib/models/types'
 import type { UI_I_ArbitraryObject } from '~/lib/models/interfaces'
+import type { UI_I_ErrorFields } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 
 const formModel = defineModel<UI_I_CreateDatastoreForm>({ required: true })

package/components/common/backup/storage/actions/add/steps/name/New.vue

@@ -21,11 +21,11 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_ErrorFields } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type {
   UI_I_Localization,
   UI_I_ArbitraryObject,
 } from '~/lib/models/interfaces'
+import type { UI_I_ErrorFields } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 
 const formModelLocal = defineModel<UI_I_CreateDatastoreForm>({ required: true })

package/components/common/backup/storage/actions/add/steps/name/Old.vue

@@ -36,11 +36,11 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_ErrorFields } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type {
   UI_I_Localization,
   UI_I_ArbitraryObject,
 } from '~/lib/models/interfaces'
+import type { UI_I_ErrorFields } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 import { dynamicSteps } from '~/components/common/backup/storage/actions/add/lib/config/steps'
 

package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigure.vue

@@ -19,7 +19,7 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
+import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 
 const formModel = defineModel<UI_I_CreateDatastoreForm>({ required: true })

package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureNew.vue

@@ -133,8 +133,8 @@
 </template>
 
 <script setup lang="ts">
-import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 
 const formModelLocal = defineModel<UI_I_CreateDatastoreForm>({ required: true })

package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureOld.vue

@@ -172,8 +172,8 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_InitialValidationFields } from '~/components/common/backup/storage/actions/add/steps/nameAndConfigure/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
 import type { UI_T_InitialValidationFields } from '~/components/common/backup/storage/actions/add/steps/nameAndConfigure/lib/models/types'

package/components/common/browse/BrowseNew.vue

@@ -261,6 +261,7 @@ const selectedFileTypeLocal = computed<any>({
     height: 100%;
 
     .columns-block {
+      position: relative;
       width: 816px;
     }
 

package/components/common/browse/blocks/Container.vue

@@ -1,235 +1,235 @@
-<template>
-  <div
-    ref="containerBlock"
-    :class="[
-      `title-block__${props.type}-container`,
-      {
-        'title-block__new-view': isNewView,
-      },
-    ]"
-  >
-    <slot name="firstBlock"></slot>
-    <div
-      ref="moveSeperator"
-      :class="[
-        'move-separator',
-        {
-          'move-separator-new-view': isNewView,
-          'move-separator-new-view_selected':
-            sectionSelected && sectionSelectedName === 'first',
-        },
-      ]"
-      :data-id="`${props.testId}-first`"
-      :style="seperatorStyles"
-      @mousedown="onMouseDown($event, 'first')"
-    >
-      <div :style="moveSeperatorBeforeStyles"></div>
-    </div>
-    <slot name="secondBlock"></slot>
-    <div
-      ref="secondMoveSeperator"
-      :class="[
-        'move-separator',
-        {
-          'move-separator-new-view': isNewView,
-          'move-separator-new-view_selected':
-            sectionSelected && sectionSelectedName === 'second',
-        },
-      ]"
-      :data-id="`${props.testId}-second`"
-      :style="secondSeperatorStyles"
-      @mousedown="onMouseDown($event, 'second')"
-    >
-      <div :style="secondMoveSeperatorBeforeStyles"></div>
-    </div>
-    <slot name="thirdBlock"></slot>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useElementSize } from '@vueuse/core'
-import type { UI_T_BlocksWidth } from '~/components/common/browse/blocks/lib/models/types'
-
-const props = withDefaults(
-  defineProps<{
-    type: 'horizontal' | 'vertical'
-    blocksWidth: UI_T_BlocksWidth
-    testId?: string
-  }>(),
-  {
-    testId: '',
-  }
-)
-
-const emits = defineEmits<{
-  (event: 'change-widths', width: number, index: number): void
-}>()
-
-const { $store }: any = useNuxtApp()
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const sectionSelected = ref<boolean>(false)
-const sectionSelectedName = ref<string>('')
-
-const positionOnDown = ref<number>(0)
-
-const containerBlock = ref<HTMLElement | null>(null)
-const { height: heightContainerBlock } = useElementSize(containerBlock)
-
-const moveSeperator = ref<HTMLElement | null>(null)
-const { height: heightMoveSeperator } = useElementSize(moveSeperator)
-const moveSeperatorBeforeStyles = ref<any>({})
-watch(
-  heightMoveSeperator,
-  (newValue) => {
-    if (!newValue) return
-
-    moveSeperatorBeforeStyles.value.top = newValue / 2 + 'px'
-  },
-  { immediate: true, deep: true }
-)
-
-const secondMoveSeperator = ref<HTMLElement | null>(null)
-const { height: heightSecondMoveSeperator } =
-  useElementSize(secondMoveSeperator)
-const secondMoveSeperatorBeforeStyles = ref<any>({})
-watch(
-  heightSecondMoveSeperator,
-  (newValue) => {
-    if (!newValue) return
-
-    secondMoveSeperatorBeforeStyles.value.top = newValue / 2 + 'px'
-  },
-  { immediate: true, deep: true }
-)
-
-// const translation1 = computed<number>(() => (isNewView.value ? 31 : 28))
-// const translation2 = computed<number>(() => (isNewView.value ? 47 : 28))
-const translation = computed<number>(() => (isNewView.value ? 31 : 28))
-
-const seperatorStyles = computed(() => ({
-  // left: `${props.blocksWidth[0] + translation1.value}px`,
-  left: `${props.blocksWidth[0] + translation.value}px`,
-  height: `${heightContainerBlock.value}px`,
-}))
-const secondSeperatorStyles = computed(() => ({
-  // right: `${props.blocksWidth[2] + translation2.value}px`,
-  left: `${props.blocksWidth[0] + props.blocksWidth[1] + translation.value}px`,
-  height: `${heightContainerBlock.value}px`,
-}))
-
-const onMouseDown = (event: MouseEvent, section: string): void => {
-  sectionSelected.value = true
-  sectionSelectedName.value = section
-  positionOnDown.value = (
-    event.target as HTMLDivElement
-  ).getBoundingClientRect().x
-}
-
-const onMouseMove = (event: MouseEvent): void => {
-  if (!sectionSelected.value) return
-  event.stopPropagation()
-  event.preventDefault()
-  event.cancelBubble = true
-
-  getSeparatorPosition(event, 0, 1, 'first')
-  getSeparatorPosition(event, 1, 2, 'second')
-}
-const onMouseUp = (): void => {
-  sectionSelected.value = false
-}
-
-const minWidth = computed<number>(() => (isNewView.value ? 120 : 30))
-
-const getSeparatorPosition = (
-  event: MouseEvent,
-  firstBlock: number,
-  secondBlock: number,
-  separator: string
-): void => {
-  if (sectionSelected.value && sectionSelectedName.value === separator) {
-    const blockWidth0 =
-      props.blocksWidth[firstBlock] - (positionOnDown.value - event.x)
-    const blockWidth1 =
-      props.blocksWidth[secondBlock] + (positionOnDown.value - event.x)
-    if (blockWidth0 < minWidth.value || blockWidth1 < minWidth.value) return
-    blockWidth0 >= minWidth.value &&
-      emits('change-widths', blockWidth0, firstBlock)
-    blockWidth1 >= minWidth.value &&
-      emits('change-widths', blockWidth1, secondBlock)
-    positionOnDown.value = event.x
-  }
-}
-
-onMounted(() => {
-  document.addEventListener('mousemove', onMouseMove)
-  document.addEventListener('mouseup', onMouseUp)
-})
-onUnmounted(() => {
-  document.removeEventListener('mousemove', onMouseMove)
-  document.removeEventListener('mouseup', onMouseUp)
-})
-</script>
-
-<style scoped lang="scss">
-.title-block__horizontal-container {
-  display: flex;
-  flex-direction: row;
-  gap: 5px;
-}
-
-.title-block__horizontal-container.title-block__new-view {
-  gap: 0;
-  height: inherit;
-}
-.move-separator {
-  position: absolute;
-  width: 3px;
-  height: inherit;
-  background-color: var(--modal-bg-color);
-  cursor: col-resize;
-  z-index: var(--z-fixed);
-
-  &-new-view {
-    width: 3px;
-    background: linear-gradient(
-      to right,
-      transparent 0,
-      transparent 1px,
-      var(--select-file-sprt-color) 1px,
-      var(--select-file-sprt-color) 2px,
-      transparent 2px,
-      transparent 100%
-    );
-
-    div {
-      position: relative;
-
-      &::before {
-        content: '';
-        width: 2px;
-        height: 16px;
-        background-color: var(--select-file-sprt-handler-color);
-        position: absolute;
-        left: 0.5px;
-        border-radius: 2px;
-      }
-    }
-
-    &:hover {
-      div::before {
-        background-color: var(--select-file-sprt-handler-hover-color);
-      }
-    }
-
-    &_selected {
-      div::before {
-        background-color: var(
-          --select-file-sprt-handler-selected-color
-        ) !important;
-      }
-    }
-  }
-}
-</style>
+<template>
+  <div
+    ref="containerBlock"
+    :class="[
+      `title-block__${props.type}-container`,
+      {
+        'title-block__new-view': isNewView,
+      },
+    ]"
+  >
+    <slot name="firstBlock"></slot>
+    <div
+      ref="moveSeperator"
+      :class="[
+        'move-separator',
+        {
+          'move-separator-new-view': isNewView,
+          'move-separator-new-view_selected':
+            sectionSelected && sectionSelectedName === 'first',
+        },
+      ]"
+      :data-id="`${props.testId}-first`"
+      :style="seperatorStyles"
+      @mousedown.prevent="onMouseDown($event, 'first')"
+    >
+      <div :style="moveSeperatorBeforeStyles"></div>
+    </div>
+    <slot name="secondBlock"></slot>
+    <div
+      ref="secondMoveSeperator"
+      :class="[
+        'move-separator',
+        {
+          'move-separator-new-view': isNewView,
+          'move-separator-new-view_selected':
+            sectionSelected && sectionSelectedName === 'second',
+        },
+      ]"
+      :data-id="`${props.testId}-second`"
+      :style="secondSeperatorStyles"
+      @mousedown.prevent="onMouseDown($event, 'second')"
+    >
+      <div :style="secondMoveSeperatorBeforeStyles"></div>
+    </div>
+    <slot name="thirdBlock"></slot>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useElementSize } from '@vueuse/core'
+import type { UI_T_BlocksWidth } from '~/components/common/browse/blocks/lib/models/types'
+
+const props = withDefaults(
+  defineProps<{
+    type: 'horizontal' | 'vertical'
+    blocksWidth: UI_T_BlocksWidth
+    testId?: string
+  }>(),
+  {
+    testId: '',
+  }
+)
+
+const emits = defineEmits<{
+  (event: 'change-widths', width: number, index: number): void
+}>()
+
+const { $store }: any = useNuxtApp()
+
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+
+const sectionSelected = ref<boolean>(false)
+const sectionSelectedName = ref<string>('')
+
+const positionOnDown = ref<number>(0)
+
+const containerBlock = ref<HTMLElement | null>(null)
+const { height: heightContainerBlock } = useElementSize(containerBlock)
+
+const moveSeperator = ref<HTMLElement | null>(null)
+const { height: heightMoveSeperator } = useElementSize(moveSeperator)
+const moveSeperatorBeforeStyles = ref<any>({})
+watch(
+  heightMoveSeperator,
+  (newValue) => {
+    if (!newValue) return
+
+    moveSeperatorBeforeStyles.value.top = newValue / 2 + 'px'
+  },
+  { immediate: true, deep: true }
+)
+
+const secondMoveSeperator = ref<HTMLElement | null>(null)
+const { height: heightSecondMoveSeperator } =
+  useElementSize(secondMoveSeperator)
+const secondMoveSeperatorBeforeStyles = ref<any>({})
+watch(
+  heightSecondMoveSeperator,
+  (newValue) => {
+    if (!newValue) return
+
+    secondMoveSeperatorBeforeStyles.value.top = newValue / 2 + 'px'
+  },
+  { immediate: true, deep: true }
+)
+
+// const translation1 = computed<number>(() => (isNewView.value ? 31 : 28))
+// const translation2 = computed<number>(() => (isNewView.value ? 47 : 28))
+// const translation = computed<number>(() => (isNewView.value ? 31 : 28))
+
+const seperatorStyles = computed(() => ({
+  // left: `${props.blocksWidth[0] + translation1.value}px`,
+  left: `${props.blocksWidth[0]}px`,
+  height: `${heightContainerBlock.value}px`,
+}))
+const secondSeperatorStyles = computed(() => ({
+  // right: `${props.blocksWidth[2] + translation2.value}px`,
+  left: `${props.blocksWidth[0] + props.blocksWidth[1]}px`,
+  height: `${heightContainerBlock.value}px`,
+}))
+
+const onMouseDown = (event: MouseEvent, section: string): void => {
+  sectionSelected.value = true
+  sectionSelectedName.value = section
+  positionOnDown.value = (
+    event.target as HTMLDivElement
+  ).getBoundingClientRect().x
+}
+
+const onMouseMove = (event: MouseEvent): void => {
+  if (!sectionSelected.value) return
+  event.stopPropagation()
+  event.preventDefault()
+  event.cancelBubble = true
+
+  getSeparatorPosition(event, 0, 1, 'first')
+  getSeparatorPosition(event, 1, 2, 'second')
+}
+const onMouseUp = (): void => {
+  sectionSelected.value = false
+}
+
+const minWidth = computed<number>(() => (isNewView.value ? 120 : 30))
+
+const getSeparatorPosition = (
+  event: MouseEvent,
+  firstBlock: number,
+  secondBlock: number,
+  separator: string
+): void => {
+  if (sectionSelected.value && sectionSelectedName.value === separator) {
+    const blockWidth0 =
+      props.blocksWidth[firstBlock] - (positionOnDown.value - event.x)
+    const blockWidth1 =
+      props.blocksWidth[secondBlock] + (positionOnDown.value - event.x)
+    if (blockWidth0 < minWidth.value || blockWidth1 < minWidth.value) return
+    blockWidth0 >= minWidth.value &&
+      emits('change-widths', blockWidth0, firstBlock)
+    blockWidth1 >= minWidth.value &&
+      emits('change-widths', blockWidth1, secondBlock)
+    positionOnDown.value = event.x
+  }
+}
+
+onMounted(() => {
+  document.addEventListener('mousemove', onMouseMove)
+  document.addEventListener('mouseup', onMouseUp)
+})
+onUnmounted(() => {
+  document.removeEventListener('mousemove', onMouseMove)
+  document.removeEventListener('mouseup', onMouseUp)
+})
+</script>
+
+<style scoped lang="scss">
+.title-block__horizontal-container {
+  display: flex;
+  flex-direction: row;
+  gap: 5px;
+}
+
+.title-block__horizontal-container.title-block__new-view {
+  gap: 0;
+  height: inherit;
+}
+.move-separator {
+  position: absolute;
+  width: 3px;
+  height: inherit;
+  background-color: var(--modal-bg-color);
+  cursor: col-resize;
+  z-index: var(--z-fixed);
+
+  &-new-view {
+    width: 3px;
+    background: linear-gradient(
+      to right,
+      transparent 0,
+      transparent 1px,
+      var(--select-file-sprt-color) 1px,
+      var(--select-file-sprt-color) 2px,
+      transparent 2px,
+      transparent 100%
+    );
+
+    div {
+      position: relative;
+
+      &::before {
+        content: '';
+        width: 2px;
+        height: 16px;
+        background-color: var(--select-file-sprt-handler-color);
+        position: absolute;
+        left: 0.5px;
+        border-radius: 2px;
+      }
+    }
+
+    &:hover {
+      div::before {
+        background-color: var(--select-file-sprt-handler-hover-color);
+      }
+    }
+
+    &_selected {
+      div::before {
+        background-color: var(
+          --select-file-sprt-handler-selected-color
+        ) !important;
+      }
+    }
+  }
+}
+</style>