@redneckz/wildless-cms-uni-blocks 0.7.5 → 0.7.6

package/src/components/Tabs/tabItemClasses.ts

@@ -2,6 +2,70 @@ export const LINK_CLASSES = 'h-12 flex-1 flex items-center justify-center cursor
 export const ACTIVE_LINK_CLASSES = 'bg-primary-main';
 export const INACTIVE_LINK_CLASSES = 'group/btn bg-white';
 
-export const TEXT_CLASSES = 'font-sans text-m';
+export const SCROLLABLE_ACTIVE_LINK_CLASSES = 'bg-white text-primary-main';
+export const WIDESCREEN_ACTIVE_LINK_CLASSES = 'bg-primary-main text-white';
+
+export const TEXT_CLASSES = 'font-sans text-m text-center';
 export const ACTIVE_TEXT_CLASSES = 'text-white';
 export const INACTIVE_TEXT_CLASSES = 'text-secondary-text group-hover/btn:text-primary-main';
+
+export const WHITE_ACTIVE_TEXT_CLASSES = 'text-primary-main';
+
+const GROUP_TAB_CLASSES = {
+  div: {
+    scrollable: {
+      active: `inline-flex px-4 grow whitespace-nowrap ${LINK_CLASSES} ${SCROLLABLE_ACTIVE_LINK_CLASSES}`,
+      default: `inline-flex px-4 grow whitespace-nowrap ${LINK_CLASSES} ${INACTIVE_LINK_CLASSES}`,
+    },
+    default: {
+      active: `${LINK_CLASSES} ${WIDESCREEN_ACTIVE_LINK_CLASSES} whitespace-nowrap`,
+      default: `${LINK_CLASSES} ${INACTIVE_LINK_CLASSES} whitespace-nowrap`,
+    },
+  },
+  text: {
+    scrollable: {
+      active: `h-full border-0 border-b-2`,
+      default: ``,
+    },
+    default: {
+      active: '',
+      default: '',
+    },
+  },
+};
+const LINK_TAB_CLASSES = {
+  link: {
+    scrollable: {
+      active: `inline-flex px-4 grow whitespace-nowrap ${LINK_CLASSES} ${SCROLLABLE_ACTIVE_LINK_CLASSES}`,
+      default: `inline-flex px-4 grow whitespace-nowrap ${LINK_CLASSES} ${INACTIVE_LINK_CLASSES}`,
+    },
+    default: {
+      active: `${LINK_CLASSES} ${WIDESCREEN_ACTIVE_LINK_CLASSES}`,
+      default: `${LINK_CLASSES} ${INACTIVE_LINK_CLASSES}`,
+    },
+  },
+  text: {
+    scrollable: {
+      active: `${TEXT_CLASSES} flex items-center h-full border-0 border-b-2 ${WHITE_ACTIVE_TEXT_CLASSES}`,
+      default: `${TEXT_CLASSES} ${INACTIVE_TEXT_CLASSES}`,
+    },
+    default: {
+      active: `${TEXT_CLASSES} ${ACTIVE_TEXT_CLASSES}`,
+      default: `${TEXT_CLASSES} ${INACTIVE_TEXT_CLASSES}`,
+    },
+  },
+};
+
+export const getGroupTabClassName = (type: string, active: boolean, isScrollable: boolean) => {
+  const styleType = isScrollable ? 'scrollable' : 'default';
+  const styleActive = active ? 'active' : 'default';
+
+  return GROUP_TAB_CLASSES[type][styleType][styleActive];
+};
+
+export const getLinkTabClassName = (type: string, active: boolean, isScrollable: boolean) => {
+  const styleType = isScrollable ? 'scrollable' : 'default';
+  const styleActive = active ? 'active' : 'default';
+
+  return LINK_TAB_CLASSES[type][styleType][styleActive];
+};

package/src/setup-fixture.ts

@@ -27,6 +27,5 @@ useRouter.setup(() => {
 
 handlerDecorator.setup((handler, targetContent): any => (ev) => {
   ev.preventDefault();
-  console.log(ev.target, ev, targetContent);
   handler(ev);
 });