@redneckz/wildless-cms-uni-blocks 0.3.10 → 0.3.13

package/src/ui-kit/TableArrowScrollControl/TableArrowScrollControlProps.ts

@@ -0,0 +1,7 @@
+export interface TableArrowScrollControlProps {
+  isScrollAvailable?: boolean;
+  onNextClick?: (ev?: MouseEvent) => void;
+  onPrevClick?: (ev?: MouseEvent) => void;
+  showNextButton?: boolean;
+  showPrevButton?: boolean;
+}

package/src/ui-kit/Tabs/Tabs.tsx

@@ -0,0 +1,46 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { Icon } from '../../ui-kit/Icon/Icon';
+import type { Tab, TabClickHandler, TabsProps } from './TabsProps';
+
+const TAB_STYLE = 'px-2 h-14 pb-2 pt-3 border border-b-0 border-main-stroke';
+const ACTIVE_TAB_STYLE = 'px-2 h-16 pt-4 pb-2 text-white bg-primary-main';
+
+export const Tabs = JSX<TabsProps>(({ tabs, currentTabIndex, onTabClick }) => {
+  return (
+    <div className="flex items-end border-b border-main-stroke" role="tablist">
+      {tabs?.map(renderTab(currentTabIndex, onTabClick))}
+    </div>
+  );
+});
+
+const renderTab =
+  (currentTabIndex: number, onTabClick: TabClickHandler) => (tab: Tab, index: number) => {
+    const isActive = currentTabIndex === index;
+    return (
+      <div
+        key={String(index)}
+        className={`flex h-full flex-1 cursor-pointer mr-2 last:mr-0 ${
+          isActive ? ACTIVE_TAB_STYLE : TAB_STYLE
+        }`}
+        role="tab"
+        onClick={() => onTabClick(index)}
+        aria-selected={String(isActive)}
+      >
+        {tab?.icon ? renderIcon(tab, isActive) : null}
+        <div>
+          {tab?.title ? <h3 className="font-medium m-0 text-base">{tab?.title}</h3> : null}
+          {tab?.description ? (
+            <span className={`font-light text-xs ${isActive ? '' : 'text-secondary-text'}`}>
+              {tab?.description}
+            </span>
+          ) : null}
+        </div>
+      </div>
+    );
+  };
+
+const renderIcon = (tab: Tab, isActive: boolean) => (
+  <div className="h-full mt-1" style={isActive ? { filter: 'invert(1)' } : null}>
+    <Icon className="w-5 h-5 mr-3" name={tab?.icon || 'CardIcon'} asSVG={!isActive} />
+  </div>
+);

package/src/ui-kit/Tabs/TabsProps.ts

@@ -0,0 +1,20 @@
+import type { IconName } from '../../icons/IconName';
+
+/**
+ * @title Вкладка
+ */
+export interface Tab {
+  /** @title Имя вкладки */
+  title?: string;
+  /** @title Описание */
+  description?: string;
+  icon?: IconName;
+}
+
+export type TabClickHandler = (value: number) => void;
+
+export interface TabsProps {
+  tabs?: Tab[];
+  currentTabIndex: number;
+  onTabClick: TabClickHandler;
+}

package/dist/hooks/useComparisonTableScroll.d.ts

@@ -1,12 +0,0 @@
-export declare const useComparisonTableScroll: <ColData>({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }: {
-    colData: ColData[];
-    colsLengthForScroll: number;
-    activeCardIndex: number;
-    setActiveCardIndex: (_: number) => void;
-}) => {
-    nextClick: () => void;
-    prevClick: () => void;
-    isScrollAvailable: boolean | 0;
-    showNextButton: boolean | 0;
-    showPrevButton: boolean | 0;
-};

package/dist/hooks/useComparisonTableScroll.js

@@ -1,12 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useComparisonTableScroll = void 0;
-const useComparisonTableScroll = ({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }) => {
-    const nextClick = () => setActiveCardIndex(activeCardIndex + 1);
-    const prevClick = () => setActiveCardIndex(activeCardIndex - 1);
-    const isScrollAvailable = colData?.length && colData.length > colsLengthForScroll;
-    const showNextButton = isScrollAvailable && colData?.length - activeCardIndex > colsLengthForScroll;
-    const showPrevButton = isScrollAvailable && activeCardIndex > 0;
-    return { nextClick, prevClick, isScrollAvailable, showNextButton, showPrevButton };
-};
-exports.useComparisonTableScroll = useComparisonTableScroll;
-//# sourceMappingURL=useComparisonTableScroll.js.map

package/dist/hooks/useComparisonTableScroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComparisonTableScroll.js","sourceRoot":"","sources":["../../src/hooks/useComparisonTableScroll.ts"],"names":[],"mappings":";;AAAO,MAAM,wBAAwB,GAAG,CAAU,EAChD,OAAO,EACP,mBAAmB,EACnB,eAAe,EACf,kBAAkB,GAMnB,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAEhE,MAAM,iBAAiB,GAAG,OAAO,EAAE,MAAM,IAAI,OAAO,CAAC,MAAM,GAAG,mBAAmB,CAAC;IAClF,MAAM,cAAc,GAClB,iBAAiB,IAAI,OAAO,EAAE,MAAM,GAAG,eAAe,GAAG,mBAAmB,CAAC;IAC/E,MAAM,cAAc,GAAG,iBAAiB,IAAI,eAAe,GAAG,CAAC,CAAC;IAEhE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;AACrF,CAAC,CAAC;AApBW,QAAA,wBAAwB,4BAoBnC"}

package/lib/hooks/useComparisonTableScroll.d.ts

@@ -1,12 +0,0 @@
-export declare const useComparisonTableScroll: <ColData>({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }: {
-    colData: ColData[];
-    colsLengthForScroll: number;
-    activeCardIndex: number;
-    setActiveCardIndex: (_: number) => void;
-}) => {
-    nextClick: () => void;
-    prevClick: () => void;
-    isScrollAvailable: boolean | 0;
-    showNextButton: boolean | 0;
-    showPrevButton: boolean | 0;
-};

package/lib/hooks/useComparisonTableScroll.js

@@ -1,9 +0,0 @@
-export const useComparisonTableScroll = ({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }) => {
-    const nextClick = () => setActiveCardIndex(activeCardIndex + 1);
-    const prevClick = () => setActiveCardIndex(activeCardIndex - 1);
-    const isScrollAvailable = colData?.length && colData.length > colsLengthForScroll;
-    const showNextButton = isScrollAvailable && colData?.length - activeCardIndex > colsLengthForScroll;
-    const showPrevButton = isScrollAvailable && activeCardIndex > 0;
-    return { nextClick, prevClick, isScrollAvailable, showNextButton, showPrevButton };
-};
-//# sourceMappingURL=useComparisonTableScroll.js.map

package/lib/hooks/useComparisonTableScroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComparisonTableScroll.js","sourceRoot":"","sources":["../../src/hooks/useComparisonTableScroll.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAU,EAChD,OAAO,EACP,mBAAmB,EACnB,eAAe,EACf,kBAAkB,GAMnB,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAEhE,MAAM,iBAAiB,GAAG,OAAO,EAAE,MAAM,IAAI,OAAO,CAAC,MAAM,GAAG,mBAAmB,CAAC;IAClF,MAAM,cAAc,GAClB,iBAAiB,IAAI,OAAO,EAAE,MAAM,GAAG,eAAe,GAAG,mBAAmB,CAAC;IAC/E,MAAM,cAAc,GAAG,iBAAiB,IAAI,eAAe,GAAG,CAAC,CAAC;IAEhE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;AACrF,CAAC,CAAC"}

package/mobile/dist/hooks/useComparisonTableScroll.d.ts

@@ -1,12 +0,0 @@
-export declare const useComparisonTableScroll: <ColData>({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }: {
-    colData: ColData[];
-    colsLengthForScroll: number;
-    activeCardIndex: number;
-    setActiveCardIndex: (_: number) => void;
-}) => {
-    nextClick: () => void;
-    prevClick: () => void;
-    isScrollAvailable: boolean | 0;
-    showNextButton: boolean | 0;
-    showPrevButton: boolean | 0;
-};

package/mobile/dist/hooks/useComparisonTableScroll.js

@@ -1,12 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useComparisonTableScroll = void 0;
-const useComparisonTableScroll = ({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }) => {
-    const nextClick = () => setActiveCardIndex(activeCardIndex + 1);
-    const prevClick = () => setActiveCardIndex(activeCardIndex - 1);
-    const isScrollAvailable = colData?.length && colData.length > colsLengthForScroll;
-    const showNextButton = isScrollAvailable && colData?.length - activeCardIndex > colsLengthForScroll;
-    const showPrevButton = isScrollAvailable && activeCardIndex > 0;
-    return { nextClick, prevClick, isScrollAvailable, showNextButton, showPrevButton };
-};
-exports.useComparisonTableScroll = useComparisonTableScroll;
-//# sourceMappingURL=useComparisonTableScroll.js.map

package/mobile/dist/hooks/useComparisonTableScroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComparisonTableScroll.js","sourceRoot":"","sources":["../../src/hooks/useComparisonTableScroll.ts"],"names":[],"mappings":";;AAAO,MAAM,wBAAwB,GAAG,CAAU,EAChD,OAAO,EACP,mBAAmB,EACnB,eAAe,EACf,kBAAkB,GAMnB,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAEhE,MAAM,iBAAiB,GAAG,OAAO,EAAE,MAAM,IAAI,OAAO,CAAC,MAAM,GAAG,mBAAmB,CAAC;IAClF,MAAM,cAAc,GAClB,iBAAiB,IAAI,OAAO,EAAE,MAAM,GAAG,eAAe,GAAG,mBAAmB,CAAC;IAC/E,MAAM,cAAc,GAAG,iBAAiB,IAAI,eAAe,GAAG,CAAC,CAAC;IAEhE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;AACrF,CAAC,CAAC;AApBW,QAAA,wBAAwB,4BAoBnC"}

package/mobile/lib/hooks/useComparisonTableScroll.d.ts

@@ -1,12 +0,0 @@
-export declare const useComparisonTableScroll: <ColData>({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }: {
-    colData: ColData[];
-    colsLengthForScroll: number;
-    activeCardIndex: number;
-    setActiveCardIndex: (_: number) => void;
-}) => {
-    nextClick: () => void;
-    prevClick: () => void;
-    isScrollAvailable: boolean | 0;
-    showNextButton: boolean | 0;
-    showPrevButton: boolean | 0;
-};

package/mobile/lib/hooks/useComparisonTableScroll.js

@@ -1,9 +0,0 @@
-export const useComparisonTableScroll = ({ colData, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }) => {
-    const nextClick = () => setActiveCardIndex(activeCardIndex + 1);
-    const prevClick = () => setActiveCardIndex(activeCardIndex - 1);
-    const isScrollAvailable = colData?.length && colData.length > colsLengthForScroll;
-    const showNextButton = isScrollAvailable && colData?.length - activeCardIndex > colsLengthForScroll;
-    const showPrevButton = isScrollAvailable && activeCardIndex > 0;
-    return { nextClick, prevClick, isScrollAvailable, showNextButton, showPrevButton };
-};
-//# sourceMappingURL=useComparisonTableScroll.js.map

package/mobile/lib/hooks/useComparisonTableScroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComparisonTableScroll.js","sourceRoot":"","sources":["../../src/hooks/useComparisonTableScroll.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAU,EAChD,OAAO,EACP,mBAAmB,EACnB,eAAe,EACf,kBAAkB,GAMnB,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAEhE,MAAM,iBAAiB,GAAG,OAAO,EAAE,MAAM,IAAI,OAAO,CAAC,MAAM,GAAG,mBAAmB,CAAC;IAClF,MAAM,cAAc,GAClB,iBAAiB,IAAI,OAAO,EAAE,MAAM,GAAG,eAAe,GAAG,mBAAmB,CAAC;IAC/E,MAAM,cAAc,GAAG,iBAAiB,IAAI,eAAe,GAAG,CAAC,CAAC;IAEhE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;AACrF,CAAC,CAAC"}

package/mobile/src/hooks/useComparisonTableScroll.ts

@@ -1,21 +0,0 @@
-export const useComparisonTableScroll = <ColData>({
-  colData,
-  colsLengthForScroll,
-  activeCardIndex,
-  setActiveCardIndex,
-}: {
-  colData: ColData[];
-  colsLengthForScroll: number;
-  activeCardIndex: number;
-  setActiveCardIndex: (_: number) => void;
-}) => {
-  const nextClick = () => setActiveCardIndex(activeCardIndex + 1);
-  const prevClick = () => setActiveCardIndex(activeCardIndex - 1);
-
-  const isScrollAvailable = colData?.length && colData.length > colsLengthForScroll;
-  const showNextButton =
-    isScrollAvailable && colData?.length - activeCardIndex > colsLengthForScroll;
-  const showPrevButton = isScrollAvailable && activeCardIndex > 0;
-
-  return { nextClick, prevClick, isScrollAvailable, showNextButton, showPrevButton };
-};

package/src/hooks/useComparisonTableScroll.ts

@@ -1,21 +0,0 @@
-export const useComparisonTableScroll = <ColData>({
-  colData,
-  colsLengthForScroll,
-  activeCardIndex,
-  setActiveCardIndex,
-}: {
-  colData: ColData[];
-  colsLengthForScroll: number;
-  activeCardIndex: number;
-  setActiveCardIndex: (_: number) => void;
-}) => {
-  const nextClick = () => setActiveCardIndex(activeCardIndex + 1);
-  const prevClick = () => setActiveCardIndex(activeCardIndex - 1);
-
-  const isScrollAvailable = colData?.length && colData.length > colsLengthForScroll;
-  const showNextButton =
-    isScrollAvailable && colData?.length - activeCardIndex > colsLengthForScroll;
-  const showPrevButton = isScrollAvailable && activeCardIndex > 0;
-
-  return { nextClick, prevClick, isScrollAvailable, showNextButton, showPrevButton };
-};