itube-specs 0.0.324 → 0.0.325

package/components/ui/s-chips.vue

@@ -21,7 +21,7 @@
     />
     {{ name }}
     <SIcon
-        v-if="(isActive && !withoutClose && item.value !== 'reset' && !mini) || withClose"
+        v-if="(isActive && !mini && item.resetPath) || withClose"
         class="s-chips__close"
         name="close"
         size="16"
@@ -34,83 +34,90 @@ import type { IChipsItem } from '../../types';
 import { convertString } from '../../runtime';
 
 const props = defineProps<{
-  item: IChipsItem
-  allLink?: boolean
-  alphabet?: boolean
-  active?: boolean
-  withoutClose?: boolean
-  withClose?: boolean
-  isLink?: boolean
-  mini?: boolean
-  bright?: boolean
-  notCapitalize?: boolean
-}>()
+  item: IChipsItem;
+  allLink?: boolean;
+  alphabet?: boolean;
+  active?: boolean;
+  withClose?: boolean;
+  isLink?: boolean;
+  mini?: boolean;
+  bright?: boolean;
+  notCapitalize?: boolean;
+}>();
 
 const emit = defineEmits<{
-  (eventName: 'click'): void
-}>()
+  (eventName: 'click'): void;
+}>();
 
-const route = useRoute()
+const route = useRoute();
 
-const { generateLink } = useGenerateLink();
-
-const isActive = computed(() => {
-  if (props.active || props.item.value === 'reset' && !route.params.slug) {
-    return true
-  }
-  return ((convertString().fromSlug(String(route.params.slug))).toLowerCase() === props.item.title.toLowerCase()) && route.path.includes(props.item.prefix || '');
-})
 const component = computed(() => {
   if (props.isLink) {
-    return resolveComponent('NuxtLink')
+    return resolveComponent('NuxtLink');
   }
-  return 'button'
-})
+  return 'button';
+});
+
+const { generateLink } = useGenerateLink();
 
-const link = computed(() => {
+const targetPath = computed(() => {
   if (props.item.value === 'reset') {
-    // клик по popular
-    return `/${props.item.prefix}`
+    return props.item.resetPath ? `/${props.item.resetPath}` : '/';
   }
-  if (props.allLink) {
-    // временно пока не перешли на value
-    return `/${props.item.value}`
+
+  if (props.allLink && props.item.value) {
+    return `/${props.item.value}`;
   }
+
   if (props.item.value && props.item.prefix) {
-    if (route.params.slug === props.item.title) {
-      // возврат, при активном состоянии
-      return props.alphabet ? `/${props.item.prefix}` : '/';
-    }
-    if (props.alphabet) {
-      return `/${props.item.prefix}/letter/${convertString().toSlug(props.item.title)}`;
-    }
-    return `/${props.item.prefix}/${convertString().toSlug(String(props.item.value))}`;
+    return `${props.item.prefix}/${convertString().toSlug(String(props.item.value))}`;
   }
-  return ''
-})
 
-const href = computed(() => {
-  if (props.isLink) {
-    if (convertString().fromSlug(String(route.params.slug)).toLowerCase() === props.item.title.toLowerCase() && route.path.includes(props.item?.prefix || '')) {
-      return generateLink(props.item?.prefix || '')
-    } else if ((props.item.value && props.item.prefix) || props.allLink) {
-      return generateLink(link.value)
-    }
-    return generateLink(`/${props.item?.prefix}/${link.value}`)
+  if (props.item.value === '' && props.item.prefix) {
+    return `${props.item.prefix}`;
+  }
+
+  return '';
+});
+
+const isActive = computed(() => {
+  if (props.active) {
+    return true;
+  }
+  if (!props.isLink || !targetPath.value) {
+    return false;
   }
-  return null
-})
+
+  const current = route.path.replace(/^\/|\/$/g, '');
+  const target = targetPath.value.replace(/^\/|\/$/g, '');
+
+  return current === target;
+});
+
+const href = computed<string | undefined>(() => {
+  if (!props.isLink) return undefined;
+
+  if (isActive.value && props.item.resetPath) {
+    return generateLink(props.item.resetPath ? `/${props.item.resetPath}` : '/');
+  }
+
+  if (targetPath.value) {
+    return generateLink(targetPath.value);
+  }
+
+  return undefined;
+});
 
 function onButtonClick() {
   if (!props.isLink) {
-    emit('click')
+    emit('click');
   }
 }
 
 const name = computed(() => {
   if (props.item?.title.toLowerCase() === 'post') {
-    return '#'
+    return '#';
   }
-  return props.item.title
-})
+  return props.item.title;
+});
 </script>

package/composables/use-convert-string-array-to-chips.ts

@@ -0,0 +1,14 @@
+import type { IChipsItem } from '../types';
+
+export function useConvertStringArrayToChips(array: string[], prefix: string, resetPath: string) {
+  const alphabetItems = computed<IChipsItem[]>(() => {
+    return array.map((item) => ({
+      title: item,
+      value: item,
+      prefix: prefix,
+      resetPath: resetPath,
+    }));
+  });
+
+  return { alphabetItems };
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "itube-specs",
   "type": "module",
-  "version": "0.0.324",
+  "version": "0.0.325",
   "main": "./nuxt.config.ts",
   "types": "./types/index.d.ts",
   "scripts": {