fix: conflict[WTEL_5282]

docs/.vitepress/routes.js

@@ -2,131 +2,126 @@ import { globbySync } from 'globby';
 import isObject from 'lodash/isObject';
 import path from 'path';
 
-const useDocsPattern = ({
-                          pattern,
-                          children = false,
-                          descendants = true,
-                          filename = ['*.md'], // str or arr
-                        } = {}) => {
-  const generatePattern = () => {
-    const descendantsPattern = descendants ? '/**' : '';
-    const childrenPattern = children ? '/*' : '';
-
-    const filenames = Array.isArray(filename) ? filename : [filename];
-    const filenamesPattern = filenames.map((filename) => `/${filename}`)
-    .join(',');
-
-    return `pages/${pattern}${descendantsPattern}${childrenPattern}${filenamesPattern}`;
-  };
-
-  const fullPattern = generatePattern();
-
-  return globbySync(fullPattern, { cwd: path.resolve(__dirname, '../') });
+const useDocsPattern = (patterns) => {
+  return globbySync(patterns, { cwd: path.resolve(__dirname, '../pages/') });
 };
 
 const navbarNav = [
   { text: 'Home', link: '/' },
   {
     text: 'icons',
-    link: useDocsPattern({
-      pattern: 'webitel-ui/assets/icons',
-      descendants: false,
-    }).pop(),
+    link: useDocsPattern('webitel-ui/assets/icons/**/*.md').pop(),
   },
 ];
 
 const sidebarNav = [
   {
     text: 'FAQ',
-    items: useDocsPattern({ pattern: 'docs/faq' }),
+    items: useDocsPattern('docs/faq/**/*.md'),
     collapsed: false,
   },
   {
     text: 'Architecture, Structures, Design, etc',
-    items: useDocsPattern({ pattern: 'docs/architecture-and-structures' }),
+    items: useDocsPattern('docs/architecture-and-structures/**/*.md'),
     collapsed: true,
   },
   {
     text: 'How To',
-    items: useDocsPattern({ pattern: 'docs/how-to' }),
+    items: useDocsPattern('docs/how-to/**/*.md'),
     collapsed: true,
   },
   {
     text: 'API Tools',
-    items: useDocsPattern({ pattern: 'webitel-ui/api' }),
+    items: useDocsPattern('webitel-ui/api/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Locale',
-    items: useDocsPattern({ pattern: 'webitel-ui/locale' }),
+    items: useDocsPattern('webitel-ui/locale/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Assets',
-    items: useDocsPattern({ pattern: 'webitel-ui/assets' }),
+    items: useDocsPattern('webitel-ui/assets/**/*.md'),
     collapsed: false,
   },
+  {
+    text: 'CSS',
+    items: useDocsPattern('webitel-ui/css/**/*.md'),
+    collapsed: true,
+  },
   {
     text: 'Components',
-    items: useDocsPattern({ pattern: 'webitel-ui/components' }),
+    items: useDocsPattern('webitel-ui/components/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Components/on-demand',
-    items: useDocsPattern({ pattern: 'webitel-ui/components/on-demand' }),
+    items: useDocsPattern('webitel-ui/components/on-demand/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Enums',
-    items: useDocsPattern({ pattern: 'webitel-ui/enums' }),
+    items: [
+      ...useDocsPattern('webitel-ui/enums/index.md'),
+      {
+        text: 'Non-cathegorized',
+        collapsed: false,
+        items: useDocsPattern([
+          'webitel-ui/enums/**/*.md',
+          '!webitel-ui/enums/index.md',
+          '!webitel-ui/enums/WebitelApplications/*.md',
+        ]),
+      },
+      {
+        text: 'WebitelApplications',
+        collapsed: false,
+        items: useDocsPattern('webitel-ui/enums/WebitelApplications/*.md'),
+      },
+    ],
     collapsed: true,
   },
   {
     text: 'Modules',
-    items: useDocsPattern({ pattern: 'webitel-ui/modules' }),
+    items: useDocsPattern([
+      'webitel-ui/modules/**/*.md',
+      '!webitel-ui/modules/ObjectPermissions',
+    ]),
     collapsed: true,
   },
   {
     text: 'Module: Object Permissions',
     collapsed: true,
     items: [
-      ...useDocsPattern({
-        pattern: 'webitel-ui/modules/ObjectPermissions',
-        children: false,
-        descendants: false,
-      }),
+      ...useDocsPattern('webitel-ui/modules/ObjectPermissions/**/*.md'),
       {
         text: 'Components',
-        items: useDocsPattern({
-          pattern: 'webitel-ui/modules/ObjectPermissions/components',
-        }),
+        items: useDocsPattern('webitel-ui/modules/ObjectPermissions/components/**/*.md'),
       },
       {
         text: 'Store',
-        items: useDocsPattern({
-          pattern: 'webitel-ui/modules/ObjectPermissions/store',
-        }),
+        items: useDocsPattern('webitel-ui/modules/ObjectPermissions/store/**/*.md'),
       },
     ],
   },
   {
     text: 'Store',
-    items: useDocsPattern({ pattern: 'webitel-ui/store' }),
+    items: useDocsPattern('webitel-ui/store/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Test utils and Mocks',
-    items: useDocsPattern({ pattern: 'webitel-ui/tests' }),
+    items: useDocsPattern('webitel-ui/tests/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Validators',
-    items: useDocsPattern({ pattern: 'webitel-ui/validators' }),
+    items: useDocsPattern('webitel-ui/validators/**/*.md'),
     collapsed: true,
   },
   {
     text: 'Tests Cookbook',
-    items: useDocsPattern({ pattern: 'docs/tests-cookbook' }),
+    items: useDocsPattern('docs/tests-cookbook/**/*.md'),
     collapsed: true,
   },
 ];
@@ -148,7 +143,7 @@ const linkify = (nav) => {
   if (typeof nav === 'string') {
     const getParentDirName = (nav) => nav.split('/').at(-2);
     const getFilename = (nav) => nav.split('/').pop().replace(/\.md$/, '');
-    const getLink = (nav) => '/'.concat(nav.replace('.md', '.html'));
+    const getLink = (nav) => '/pages/'.concat(nav.replace('.md', '.html'));
 
     const text = nav.endsWith('Readme.md')
       ? getParentDirName(nav)
@@ -164,7 +159,6 @@ const linkify = (nav) => {
 };
 
 const generateSidebar = (sidebarNav) => {
-
   const sb = linkify(sidebarNav);
   // console.info(JSON.stringify(sb, null, 2));
   return sb;
@@ -179,7 +173,4 @@ const generateNav = (navbarNav) => {
 const sidebar = generateSidebar(sidebarNav);
 const nav = generateNav(navbarNav);
 
-export {
-  sidebar,
-  nav,
-};
+export { sidebar, nav };

docs/pages/webitel-ui/assets/icons/icons.md

@@ -1,4 +1,5 @@
 <script setup>
+import IconsTable from './icons-table.vue';
 </script>
 
 # Icons

docs/pages/webitel-ui/components/wt-action-bar/Readme.md

@@ -0,0 +1,31 @@
+<script setup>
+import Specs from './component-specs.vue';
+import ExampleTableActionBar from './examples/example-table-action-bar.vue';
+</script>
+
+# `wt-actions-bar.vue`
+
+> [!TIP]
+> Цей компонент – нова версія [`wt-table-actions`](../wt-table-actions/Readme.md), з переробленим інтерфейсом та новими
+> можливостями.
+> Замість `wt-table-actions` треба використовувати `wt-actions-bar`.
+
+## Specs
+
+<Specs />
+
+## Actions Order, depending on `mode` prop
+
+::: details Code
+<<< ../../../../../src/components/wt-action-bar/WtActionBarActionsOrder.js
+:::
+
+## Example Table Actions Bar (All table actions)
+
+::: raw
+<ExampleTableActionBar />
+:::
+
+::: details Code
+<<< ./examples/example-table-action-bar.vue
+:::

docs/pages/webitel-ui/components/wt-action-bar/component-specs.vue

@@ -0,0 +1,11 @@
+<script setup>
+import Component from '__lib__/components/wt-action-bar/wt-action-bar.vue';
+</script>
+
+<template>
+  <component-info :info="Component.docs" />
+</template>
+
+<style lang="scss" scoped>
+
+</style>

docs/pages/webitel-ui/components/wt-action-bar/examples/example-table-action-bar.vue

@@ -0,0 +1,16 @@
+<template>
+  <wt-action-bar
+    :actions="tableActionsOrder"
+    mode="table"
+  />
+</template>
+
+<script setup>
+import { tableActionsOrder } from '__lib__/components/wt-action-bar/WtActionBarActionsOrder.js';
+</script>
+
+<style lang="scss" scoped>
+.example-table-action-bar {
+
+}
+</style>

docs/pages/webitel-ui/components/wt-dummy/Readme.md

@@ -1,10 +1,12 @@
 <script setup>
-import Docs from './wt-dummy-docs.vue';
-import ExampleDummy from './examples/example-dummy.vue';
 </script>
 
 # WtDummy
 
+> [!CAUTION]
+> Увага, **Застаріле!** Як робитимете шось нове (або перероблятимете старе),
+> то викиньте той `wt-dummy`, і заюзайте [`wt-empty`](../wt-empty/Readme.md).
+
 ## Props
 ::: raw
 <Docs/>

docs/pages/webitel-ui/components/wt-empty/Readme.md

@@ -0,0 +1,38 @@
+<script setup>
+import Specs from './component-specs.vue';
+import ExampleEmpty from './examples/example-empty.vue';
+import ExampleEmptySizes from './examples/example-empty-sizes.vue';
+</script>
+
+# `wt-empty.vue`
+
+> [!TIP]
+> Цей компонент – нова версія `wt-dummy`, з переробленим інтерфейсом та новими можливостями.
+> Замість `wt-dummy` треба використовувати `wt-empty`.
+
+
+Компонент для відображення відсутності даних (наприклад, замість таблички).
+
+## Specs
+
+<Specs />
+
+## Example Empty
+
+::: raw
+<ExampleEmpty />
+:::
+
+::: details Code
+<<< ./examples/example-empty.vue{js}
+:::
+
+## Example Image Sizes
+
+::: raw
+<ExampleEmptySizes />
+:::
+
+::: details Code
+<<< ./examples/example-empty-sizes.vue{js}
+:::

docs/pages/webitel-ui/components/wt-empty/component-specs.vue

@@ -0,0 +1,11 @@
+<script setup>
+import Component from '__lib__/components/wt-empty/wt-empty.vue';
+</script>
+
+<template>
+  <component-info :info="Component.docs" />
+</template>
+
+<style lang="scss" scoped>
+
+</style>

docs/pages/webitel-ui/components/wt-empty/examples/example-empty-sizes.vue

@@ -0,0 +1,35 @@
+<template>
+  <div style="display: flex; gap: var(--spacing-sm); flex-wrap: nowrap;">
+    <wt-table
+      :data="sizes.map(size => ({ size, empty: true }))"
+      :headers="[{ value: 'size', width: '40px' }, { value: 'empty', width: 'auto' }]"
+      :selectable="false"
+    >
+      <template #empty="{ item }">
+        <wt-empty
+          :size="item.size"
+          headline="Component is fully built using props"
+          image="https://via.placeholder.com/150"
+          primary-action-text="primary"
+          secondary-action-text="secondary"
+          text="There is no data to display"
+          title="No data"
+        />
+      </template>
+    </wt-table>
+  </div>
+</template>
+
+<script setup>
+const sizes = [
+  'sm',
+  'md',
+  'lg',
+];
+</script>
+
+<style lang="scss" scoped>
+.example-empty {
+
+}
+</style>

docs/pages/webitel-ui/components/wt-empty/examples/example-empty.vue

@@ -0,0 +1,28 @@
+<template>
+  <wt-empty
+    headline="Component is fully built using props"
+    image="https://via.placeholder.com/150"
+    primary-action-text="alert me"
+    secondary-action-text="me too"
+    text="There is no data to display"
+    title="No data"
+    @click:primary="handleClick('primary')"
+    @click:secondary="handleClick('secondary')"
+  />
+</template>
+
+<script setup>
+const props = defineProps({});
+
+const emit = defineEmits([]);
+
+const handleClick = (action) => {
+  alert(`Clicked ${action}`);
+};
+</script>
+
+<style lang="scss" scoped>
+.example-empty {
+
+}
+</style>