bfg-common 1.4.730 → 1.4.732

package/components/common/browse/blocks/contents/filesNew/FilesNew.vue

@@ -1,96 +1,96 @@
-<template>
-  <common-browse-blocks-contents-files-new-skeleton v-if="props.browseLoading" />
-
-  <ul
-    v-else-if="props.selectedFolderFiles.length"
-    class="file-view__container"
-  >
-    <template v-for="file in props.selectedFolderFiles" :key="file.name">
-      <li
-        :data-id="file.testId"
-        :class="[
-          'file-view',
-          { active: file.name === props.selectedFile?.name },
-        ]"
-        @click="onSelectFile(file)"
-      >
-        <span class="file-view__icon" :class="file.iconClassName"></span>
-        <span class="file-view__text">{{ file.name }}</span>
-      </li>
-    </template>
-  </ul>
-
-  <div v-else class="not-found-wrap">
-    <ui-not-found :text="localization.common.noItemsFound" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-
-const props = defineProps<{
-  selectedFolderFiles: any[]
-  selectedFile: any
-  browseLoading: boolean
-}>()
-
-const emits = defineEmits<{
-  (event: 'select-file', file: any): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const onSelectFile = (file: any): void => {
-  emits('select-file', file)
-}
-</script>
-
-<style scoped lang="scss">
-.file-view__container {
-  list-style-position: inside;
-  list-style-type: none;
-  padding: 0;
-  margin: 0;
-
-  .file-view {
-    display: flex;
-    align-items: center;
-    padding: 4px 8px;
-    cursor: pointer;
-    border-radius: 4px;
-    height: 26px;
-    margin-bottom: 2px;
-    color: var(--select-file-text-color);
-
-    &:hover {
-      background-color: var(--select-file-hover-bg);
-    }
-    &.active {
-      background-color: var(--select-file-selected-bg);
-      color: var(--select-file-selected-text-color);
-    }
-    span {
-      font-size: 12px;
-      font-weight: 400;
-      line-height: 14.52px;
-
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-    }
-    span:first-of-type {
-      width: 16px;
-      height: 16px;
-      margin-right: 8px;
-    }
-  }
-}
-.not-found-wrap {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  height: 100%;
-  width: 100%;
-}
-</style>
+<template>
+  <common-browse-blocks-contents-files-new-skeleton v-if="props.browseLoading" />
+
+  <ul
+    v-else-if="props.selectedFolderFiles.length"
+    class="file-view__container"
+  >
+    <template v-for="file in props.selectedFolderFiles" :key="file.name">
+      <li
+        :data-id="file.testId"
+        :class="[
+          'file-view',
+          { active: file.name === props.selectedFile?.name },
+        ]"
+        @click="onSelectFile(file)"
+      >
+        <span class="file-view__icon" :class="file.iconClassName"></span>
+        <span class="file-view__text">{{ file.name }}</span>
+      </li>
+    </template>
+  </ul>
+
+  <div v-else class="not-found-wrap">
+    <ui-not-found :text="localization.common.noItemsFound" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+
+const props = defineProps<{
+  selectedFolderFiles: any[]
+  selectedFile: any
+  browseLoading: boolean
+}>()
+
+const emits = defineEmits<{
+  (event: 'select-file', file: any): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const onSelectFile = (file: any): void => {
+  emits('select-file', file)
+}
+</script>
+
+<style scoped lang="scss">
+.file-view__container {
+  list-style-position: inside;
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+
+  .file-view {
+    display: flex;
+    align-items: center;
+    padding: 4px 8px;
+    cursor: pointer;
+    border-radius: 4px;
+    height: 26px;
+    margin-bottom: 2px;
+    color: var(--select-file-text-color);
+
+    &:hover {
+      background-color: var(--select-file-hover-bg);
+    }
+    &.active {
+      background-color: var(--select-file-selected-bg);
+      color: var(--select-file-selected-text-color);
+    }
+    span {
+      font-size: 12px;
+      font-weight: 400;
+      line-height: 14.52px;
+
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+    span:first-of-type {
+      width: 16px;
+      height: 16px;
+      margin-right: 8px;
+    }
+  }
+}
+.not-found-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+}
+</style>

package/components/common/browse/blocks/contents/filesNew/Skeleton.vue

@@ -1,18 +1,18 @@
-<template>
-  <div class="skeleton-wrap">
-    <ui-skeleton-item height="18px" />
-    <ui-skeleton-item height="18px" />
-    <ui-skeleton-item height="18px" />
-    <ui-skeleton-item height="18px" />
-    <ui-skeleton-item height="18px" />
-  </div>
-</template>
-
-<script setup lang="ts"></script>
-
-<style scoped lang="scss">
-.skeleton-wrap {
-  display: grid;
-  grid-gap: 12px;
-}
-</style>
+<template>
+  <div class="skeleton-wrap">
+    <ui-skeleton-item height="18px" />
+    <ui-skeleton-item height="18px" />
+    <ui-skeleton-item height="18px" />
+    <ui-skeleton-item height="18px" />
+    <ui-skeleton-item height="18px" />
+  </div>
+</template>
+
+<script setup lang="ts"></script>
+
+<style scoped lang="scss">
+.skeleton-wrap {
+  display: grid;
+  grid-gap: 12px;
+}
+</style>