@opexa/portal-components 0.0.285 → 0.0.286

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,12 @@
1
- import { type BannerEntry, type BannerProps } from './Banner.client';
2
- export declare function Banner(props: BannerProps): Promise<import("react/jsx-runtime").JSX.Element>;
3
- export type { BannerEntry, BannerProps };
1
+ import type { ImageProps } from 'next/image';
2
+ export interface BannerEntry {
3
+ src: ImageProps['src'];
4
+ redirectUrl?: string;
5
+ }
6
+ export interface BannerProps {
7
+ banners: BannerEntry[];
8
+ imageWidth?: number | [mobile: number, desktop: number];
9
+ imageHeight?: number | [mobile: number, desktop: number];
10
+ className?: string;
11
+ }
12
+ export declare function Banner(props: BannerProps): import("react/jsx-runtime").JSX.Element;
@@ -1,8 +1,49 @@
1
- 'use cache';
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { unstable_cacheLife as cacheLife } from 'next/cache';
4
- import { Banner__client, } from './Banner.client.js';
5
- export async function Banner(props) {
6
- cacheLife('days');
7
- return _jsx(Banner__client, { ...props });
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import emblaCarouselAutoplay from 'embla-carousel-autoplay';
4
+ import useEmblaCarousel, {} from 'embla-carousel-react';
5
+ import isMobile from 'is-mobile';
6
+ import Image from 'next/image';
7
+ import Link from 'next/link';
8
+ import { Fragment, useEffect, useState } from 'react';
9
+ import { twMerge } from 'tailwind-merge';
10
+ import { dataAttr } from '../../utils/dataAttr.js';
11
+ export function Banner(props) {
12
+ const [emblaRef, emblaApi] = useEmblaCarousel({
13
+ loop: true,
14
+ align: 'start',
15
+ }, [
16
+ emblaCarouselAutoplay({
17
+ playOnInit: true,
18
+ delay: 5000,
19
+ }),
20
+ ]);
21
+ const [currentIndex, setCurrentIndex] = useState(0);
22
+ useEffect(() => {
23
+ function handler(detail) {
24
+ setCurrentIndex(detail?.selectedScrollSnap() ?? 0);
25
+ }
26
+ emblaApi?.on('scroll', handler);
27
+ emblaApi?.on('init', handler);
28
+ return () => {
29
+ emblaApi?.on('init', handler);
30
+ emblaApi?.off('scroll', handler);
31
+ };
32
+ }, [emblaApi]);
33
+ const imageWidth = !props.imageWidth
34
+ ? [400, 1200]
35
+ : Array.isArray(props.imageWidth)
36
+ ? props.imageWidth
37
+ : [props.imageWidth, props.imageWidth];
38
+ const imageHeight = !props.imageHeight
39
+ ? [225, 300]
40
+ : Array.isArray(props.imageHeight)
41
+ ? props.imageHeight
42
+ : [props.imageHeight, props.imageHeight];
43
+ return (_jsxs("div", { className: twMerge('relative', props.className), children: [_jsx("div", { ref: emblaRef, className: "overflow-hidden", children: _jsx("div", { className: "flex gap-2", children: props.banners.map((banner, index) => {
44
+ const img = (_jsx(Image, { src: banner.src, alt: "", width: isMobile() ? imageWidth[0] : imageWidth[1], height: isMobile() ? imageHeight[0] : imageHeight[1], className: "block h-auto w-full", priority: index === 0 }));
45
+ return (_jsx(Fragment, { children: !banner.redirectUrl ? (_jsx("div", { className: "w-full shrink-0", children: img })) : (_jsx(Link, { href: banner.redirectUrl, className: "block w-full shrink-0", "aria-label": `Open ${banner.redirectUrl}`, children: img })) }, index));
46
+ }) }) }), _jsx("div", { className: "absolute bottom-lg left-1/2 flex w-fit -translate-x-1/2 gap-2", children: props.banners.map((_, index) => (_jsx("button", { type: "button", className: "ui-active:bg-brand-500 bg-gray-300 size-3 shrink-0 rounded-full border border-white transition-all duration-300 ui-active:w-9", onClick: () => {
47
+ emblaApi?.scrollTo(index);
48
+ }, "aria-label": `Go to slide ${index + 1}`, "data-active": dataAttr(index === currentIndex) }, index))) })] }));
8
49
  }
@@ -42,7 +42,6 @@ export const config = {
42
42
  ],
43
43
  },
44
44
  experimental: {
45
- useCache: true,
46
45
  nodeMiddleware: true,
47
46
  },
48
47
  poweredByHeader: false,
@@ -294,7 +294,7 @@ export const createAIOInstapayWithdrawal = async (input, options) => {
294
294
  }
295
295
  };
296
296
  export const createVentajaDisbursementWithdrawal = async (input, transactionPassword, options) => {
297
- const res = await graphqlRequest(WALLET_GRAPHQL_ENDPOINT, CREATE_VENTAJA_WITHDRAWAL, { input, transactionPassword }, options);
297
+ const res = await graphqlRequest(WALLET_GRAPHQL_ENDPOINT, CREATE_VENTAJA_WITHDRAWAL, { input, transactionPassword: await sha256(transactionPassword) }, options);
298
298
  if (res.createVentajaDisbursementWithdrawal) {
299
299
  const error = new Error();
300
300
  error.name = res.createVentajaDisbursementWithdrawal.name;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.285",
3
+ "version": "0.0.286",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",