@pixelated-tech/components 3.1.4

package/dist/components/carousel/carousel.js

@@ -0,0 +1,124 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from 'react';
+import PropTypes /* , { InferProps } */ from 'prop-types';
+import { DragHandler } from './carousel.drag';
+import './carousel.css';
+import { SmartImage } from '../cms/cloudinary.image';
+import { usePixelatedConfig } from '../config/config.client';
+function capitalize(str) {
+    return str && String(str[0]).toUpperCase() + String(str).slice(1);
+}
+/* ========== CAROUSEL ========== */
+Carousel.propTypes = {
+    cards: PropTypes.array.isRequired,
+    draggable: PropTypes.bool,
+    imgFit: PropTypes.oneOf(['contain', 'cover', 'fill'])
+};
+// export type CarouselType = InferProps<typeof Carousel.propTypes>;
+export function Carousel(props) {
+    const debug = false;
+    let timer = useRef(null);
+    const [cardIndex, setcardIndex] = useState(0);
+    function startTimer() {
+        if (timer.current)
+            clearTimeout(timer.current);
+        timer.current = setTimeout(nextCard, 5000);
+    }
+    function stopTimer() {
+        if (timer.current)
+            clearTimeout(timer.current);
+    }
+    function previousCard() {
+        if (debug)
+            console.log("Going to Previous card : ", cardIndex, " => ", cardIndex - 1);
+        if (cardIndex === 0) {
+            setcardIndex(props.cards.length - 1);
+        }
+        else {
+            setcardIndex(cardIndex - 1);
+        }
+        startTimer();
+    }
+    ;
+    function nextCard() {
+        if (debug)
+            console.log("Going to Next card : ", cardIndex, " => ", cardIndex + 1);
+        if (cardIndex === props.cards.length - 1) {
+            setcardIndex(0);
+        }
+        else {
+            setcardIndex(cardIndex + 1);
+        }
+        startTimer();
+    }
+    ;
+    useEffect(() => {
+        if (typeof document !== 'undefined') {
+            startTimer();
+        }
+    }, [cardIndex]);
+    /* ========== DRAGGABLE HANDLER ========== */
+    if (props.draggable && props.draggable === true) {
+        if (debug)
+            console.log('CarouselSimple: Dragging enabled');
+        DragHandler({
+            activeIndex: cardIndex,
+            targetDiv: 'carouselCardWrapper',
+            nextImage: nextCard,
+            previousImage: previousCard
+        });
+    }
+    else {
+        if (debug)
+            console.log('CarouselSimple: Dragging disabled');
+    }
+    if (props.cards && props.cards.length > 0) {
+        return (_jsxs("div", { className: "carouselContainer", children: [_jsx("div", { className: "carouselCardsContainer", children: props.cards.map((card, i) => (_jsx(CarouselCard, { index: i, cardIndex: cardIndex, cardLength: props.cards.length, link: card.link, linkTarget: card.linkTarget || '_self', image: card.image, imageAlt: card.imageAlt, imgFit: props.imgFit ? props.imgFit : 'fill', headerText: card.headerText, subHeaderText: card.subHeaderText, bodyText: card.bodyText }, i))) }), _jsxs("div", { className: "carouselButtons", children: [_jsx(CarouselButton, { clickFunction: previousCard, glyph: '\u25C0' }), _jsx(CarouselButton, { clickFunction: stopTimer, glyph: '\u23F8' }), _jsx(CarouselButton, { clickFunction: nextCard, glyph: '\u25B6' })] })] }));
+    }
+    else {
+        return (_jsx("div", { className: 'section-container', children: _jsx("div", { className: "carouselContainer", children: _jsx(CarouselLoading, {}) }) }));
+    }
+}
+/* ========== CAROUSEL CARD ========== */
+function CarouselCard(props) {
+    const myZindex = props.cardLength - props.index;
+    const styles = {
+        zIndex: myZindex
+    };
+    styles.transition = 'all 1.0s ease 0.1s';
+    if (props.index > props.cardIndex) {
+        styles.transform = 'translateX(100%)';
+    }
+    else if (props.index === props.cardIndex) {
+        styles.transform = 'translateX(0%)';
+    }
+    else if (props.index < props.cardIndex) {
+        styles.transform = 'translateX(-100%)';
+    }
+    const imgFit = props.imgFit ? "img" + capitalize(props.imgFit) : 'imgFill';
+    const config = usePixelatedConfig();
+    const cardBody = (_jsxs("div", { draggable: 'false', children: [(props.link) ? _jsx("div", { draggable: 'false', className: "carouselCardLink" }) : null, (props.image) ? _jsx("div", { draggable: 'false', className: "carouselCardImage", children: _jsx(SmartImage, { draggable: false, src: props.image, title: props?.imageAlt, alt: props?.imageAlt || "", className: imgFit, cloudinaryEnv: config?.cloudinary?.product_env ?? undefined, cloudinaryDomain: config?.cloudinary?.baseUrl ?? undefined, cloudinaryTransforms: config?.cloudinary?.transforms ?? undefined }) }) : null, (props.headerText) ? _jsx("div", { draggable: 'false', className: "carouselCardHeader", children: _jsx("h3", { draggable: 'false', children: props.headerText }) }) : null, (props.subHeaderText) ? _jsx("div", { draggable: 'false', className: "carouselCardSubHeader", children: _jsx("h4", { draggable: 'false', children: props.subHeaderText }) }) : null, (props.bodyText) ? _jsx("div", { draggable: 'false', className: "carouselCardBody", children: props.bodyText }) : null] }));
+    return (_jsx("div", { draggable: 'true', id: 'c-' + props.index, className: "carouselCardWrapper", style: styles, children: _jsx("div", { draggable: 'false', className: "carouselCard", children: (props.link) ? _jsx("a", { draggable: 'false', href: props.link, target: props.linkTarget, children: cardBody }) : cardBody }) }));
+}
+// REMOVED PROPTYPE AS TYPESCRIPT TYPE COVERS THIS
+/* ========== CAROUSEL  ARROW ========== */
+CarouselButton.propTypes = {
+    clickFunction: PropTypes.func.isRequired,
+    glyph: PropTypes.string.isRequired
+};
+function CarouselButton(props) {
+    return (_jsx("div", { className: `carouselButton textOutline`, onClick: props.clickFunction, children: props.glyph }));
+}
+CarouselArrow.propTypes = {
+    direction: PropTypes.string.isRequired,
+    clickFunction: PropTypes.func.isRequired,
+    glyph: PropTypes.string.isRequired
+};
+function CarouselArrow(props) {
+    return (_jsx("div", { className: `carouselButton${capitalize(props.direction)} textOutline`, onClick: props.clickFunction, children: props.glyph }));
+}
+/* ========== CAROUSEL LOADING ========== */
+function CarouselLoading() {
+    return (_jsx("div", { className: "carouselLoading horizontal-centered vertical-centered centered", children: _jsx("div", { children: "Loading..." }) }));
+}

package/dist/components/cms/calendly.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import PropTypes from 'prop-types';
+Calendly.propTypes = {
+    url: PropTypes.string.isRequired,
+    width: PropTypes.string.isRequired,
+    height: PropTypes.string.isRequired,
+};
+export function Calendly({ url, width, height }) {
+    useEffect(() => {
+        const head = document.querySelector("head");
+        const script = document.createElement("script");
+        script.setAttribute("src", "https://assets.calendly.com/assets/external/widget.js");
+        script.setAttribute("type", "text/javascript");
+        script.setAttribute("async", "true");
+        if (head)
+            head.appendChild(script);
+    }, []);
+    return (_jsx("div", { className: "calendly-inline-widget", "data-url": url, style: { minWidth: width || "320px", height: height || "700px" }, "data-resize": "true", suppressHydrationWarning: true }));
+}

package/dist/components/cms/cloudinary.image.js

@@ -0,0 +1,132 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import Image from 'next/image';
+import { buildCloudinaryUrl } from './cloudinary';
+import { usePixelatedConfig } from '../config/config.client';
+const CLOUDINARY_DOMAIN = 'https://res.cloudinary.com/';
+const CLOUDINARY_TRANSFORMS = 'f_auto,c_limit,q_auto,dpr_auto';
+function parseNumber(v) {
+    if (typeof v === 'number')
+        return v > 0 ? v : undefined;
+    if (typeof v === 'string') {
+        const n = parseInt(v, 10);
+        return Number.isFinite(n) && n > 0 ? n : undefined;
+    }
+    return undefined;
+}
+function safeString(str) {
+    return (str === undefined || str === null)
+        ? undefined
+        : String(str);
+}
+function sanitizeString(str) {
+    return (str === undefined || str === null)
+        ? undefined
+        : String(str).toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '');
+}
+function generateSrcSet(src, productEnv, widths, opts) {
+    if (!productEnv)
+        return '';
+    return widths.map(w => `${buildCloudinaryUrl({
+        src, productEnv,
+        width: w,
+        quality: opts.quality ?? 75,
+        transforms: opts.transforms ?? undefined,
+        cloudinaryDomain: opts.cloudinaryDomain
+    })} ${w}w`).join(', ');
+}
+const SMARTIMAGE_PROP_TYPES = {
+    cloudinaryEnv: PropTypes.string,
+    cloudinaryDomain: PropTypes.string,
+    cloudinaryTransforms: PropTypes.string,
+    src: PropTypes.string.isRequired,
+    alt: PropTypes.string.isRequired,
+    width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+    height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+    aboveFold: PropTypes.bool,
+    loading: PropTypes.oneOf(['lazy', 'eager']),
+    preload: PropTypes.bool,
+    decoding: PropTypes.oneOf(['async', 'auto', 'sync']),
+    fetchPriority: PropTypes.oneOf(['high', 'low', 'auto']),
+    sizes: PropTypes.string,
+    srcSet: PropTypes.string,
+    className: PropTypes.string,
+    style: PropTypes.object,
+    id: PropTypes.string,
+    name: PropTypes.string,
+    title: PropTypes.string,
+    quality: PropTypes.number,
+    placeholder: PropTypes.oneOf(['blur', 'empty']),
+    blurDataURL: PropTypes.string,
+};
+SmartImage.propTypes = SMARTIMAGE_PROP_TYPES;
+export function SmartImage(props) {
+    const { src, alt, id, name, title, cloudinaryEnv, cloudinaryDomain = CLOUDINARY_DOMAIN, cloudinaryTransforms = CLOUDINARY_TRANSFORMS, quality = 75, width = 500, height = 500, aboveFold = false, fetchPriority = 'auto', loading = 'lazy', decoding = 'async', preload = false, ...imgProps } = props;
+    const newProps = { ...props };
+    const config = usePixelatedConfig();
+    const cloudCfg = config?.cloudinary;
+    newProps.cloudinaryEnv = safeString(cloudinaryEnv ?? cloudCfg?.product_env);
+    newProps.cloudinaryDomain = safeString(cloudCfg?.baseUrl ?? cloudinaryDomain);
+    newProps.cloudinaryTransforms = safeString(cloudinaryTransforms ?? cloudCfg?.transforms);
+    newProps.fetchPriority = aboveFold ? 'high' : fetchPriority;
+    newProps.loading = aboveFold ? 'eager' : loading;
+    newProps.decoding = aboveFold ? 'sync' : decoding;
+    newProps.preload = aboveFold ? true : preload;
+    newProps.src = safeString(src) ?? src ?? undefined;
+    newProps.id = safeString(id);
+    newProps.name = safeString(name);
+    newProps.title = safeString(title);
+    newProps.alt = safeString(alt) ?? '';
+    newProps.width = parseNumber(width) || 500;
+    newProps.height = parseNumber(height) || 500;
+    const filename = (newProps.src).split('/').pop()?.split('?')[0] || '';
+    const imageName = filename.replace(/\.[^.]+$/, '');
+    newProps.id = newProps.id || newProps.name || sanitizeString(newProps.title) || sanitizeString(newProps.alt) || sanitizeString(imageName);
+    newProps.name = newProps.name || newProps.id || sanitizeString(newProps.title) || sanitizeString(newProps.alt) || sanitizeString(imageName);
+    newProps.title = newProps.title || newProps.alt || sanitizeString(imageName);
+    // if(Array.isArray(src))
+    const finalSrc = newProps.cloudinaryEnv
+        ? buildCloudinaryUrl({
+            src: src,
+            productEnv: newProps.cloudinaryEnv,
+            cloudinaryDomain: newProps.cloudinaryDomain,
+            quality,
+            width: newProps.width ?? undefined,
+            transforms: newProps.cloudinaryTransforms ?? undefined
+        })
+        : String(src);
+    let responsiveSrcSet;
+    let responsiveSizes;
+    if (newProps.cloudinaryEnv) {
+        if (newProps.width) {
+            const widths = [Math.ceil(newProps.width * 0.5), newProps.width, Math.ceil(newProps.width * 1.5), Math.ceil(newProps.width * 2)];
+            responsiveSrcSet = generateSrcSet(String(src), newProps.cloudinaryEnv, widths, {
+                quality,
+                transforms: newProps.cloudinaryTransforms ?? undefined,
+                cloudinaryDomain: newProps.cloudinaryDomain
+            });
+            responsiveSizes = `${newProps.width}px`;
+        }
+        else {
+            const breakpoints = [320, 640, 768, 1024, 1280, 1536];
+            responsiveSrcSet = generateSrcSet(String(src), newProps.cloudinaryEnv, breakpoints, {
+                quality,
+                transforms: newProps.cloudinaryTransforms ?? undefined,
+                cloudinaryDomain: newProps.cloudinaryDomain
+            });
+            responsiveSizes = '(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw';
+        }
+    }
+    const isDecorative = newProps.alt === '';
+    const decorativeProps = isDecorative ? { 'aria-hidden': true, role: 'presentation' } : {};
+    try {
+        return (_jsx(Image, { ...imgProps, ...decorativeProps, src: finalSrc, alt: newProps.alt, id: newProps.id, name: newProps.name, title: newProps.title, width: newProps.width, height: newProps.height, sizes: imgProps.sizes || responsiveSizes, quality: quality, fetchPriority: newProps.fetchPriority, loading: newProps.loading, decoding: newProps.decoding, preload: newProps.preload }));
+    }
+    catch (e) {
+        if (typeof console !== 'undefined')
+            console.warn('next/image unavailable, falling back to <img>', e);
+    }
+    const imgRef = React.useRef(null);
+    return (_jsx("img", { ...imgProps, ...decorativeProps, ref: imgRef, src: finalSrc, alt: newProps.alt, id: newProps.id, name: newProps.name, title: newProps.title, width: newProps.width, height: newProps.height, srcSet: responsiveSrcSet || imgProps.srcSet, sizes: imgProps.sizes || responsiveSizes, fetchPriority: newProps.fetchPriority, loading: newProps.loading, decoding: newProps.decoding }));
+}

package/dist/components/cms/cloudinary.js

@@ -0,0 +1,106 @@
+import PropTypes from 'prop-types';
+/*
+https://cloudinary.com/blog/transparent_webp_format_cdn_delivery_based_on_visitors_browsers
+https://cloudinary.com/blog/delivering_all_your_websites_images_through_a_cdn
+*/
+const cloudinary_domain = "https://res.cloudinary.com";
+// const cloudinary_product_env = "dlbon7tpq";
+// const cloudinary_props = "/image/fetch/f_auto,c_limit,q_auto,dpr_auto";
+const cloudinary_props = "/image/fetch/f_auto,c_limit,dpr_auto";
+function joinWithSlash(a, b) {
+    return `${a.replace(/\/+$/, '')}/${b.replace(/^\/+/, '')}`;
+}
+export function buildCloudinaryUrl(params) {
+    const { src, productEnv, cloudinaryDomain = cloudinary_domain, quality = 75, width, transforms } = params;
+    if (typeof window === 'undefined')
+        return src; // SSR - leave as-is
+    const origin = window.location.origin;
+    // Don't fetch from cloudinary during local dev
+    if (origin.includes("localhost") || origin.includes("127.0.0.1") || origin.includes("192.168"))
+        return src;
+    // Must have cloudinary product env to build URL
+    if (!productEnv)
+        return src;
+    // Resolve non-absolute src to absolute URL in client runtime. Leave alone during SSR.
+    let url = src;
+    if (!/^https?:\/\//i.test(src)) {
+        url = src.startsWith('/') ? `${origin}${src}` : `${origin}/${src}`;
+    }
+    // Don't fetch from cloudinary during local dev
+    // if (url.includes('localhost') || url.includes('127.0.0.1') || url.includes('192.168')) return src;
+    const q = typeof quality === 'number' ? quality : 75;
+    const parts = ['f_auto', 'c_limit', `q_${q}`, 'dpr_auto'];
+    if (typeof width === 'number' && Number.isFinite(width))
+        parts.push(`w_${width}`);
+    // split transforms by comma and clean empty and whitespace
+    const transformArray = transforms ? transforms.split(',').map(s => s.trim()).filter(Boolean) : [];
+    for (const transform of transformArray) {
+        if (!transform)
+            continue;
+        // If the exact transform already exists, nothing to do.
+        if (parts.includes(transform))
+            continue;
+        // Check for a prefix match (anything before and including the first underscore).
+        const underscoreIndex = transform.indexOf('_');
+        if (underscoreIndex !== -1) {
+            const prefix = transform.slice(0, underscoreIndex + 1); // e.g. 'q_' or 'w_'
+            const prefixIdx = parts.findIndex(p => p.startsWith(prefix));
+            if (prefixIdx !== -1) {
+                // Replace the existing part that shares the same prefix.
+                parts[prefixIdx] = transform;
+                continue;
+            }
+        }
+        // No exact or prefix match found — append.
+        parts.push(transform);
+    }
+    const t = parts.length ? parts.join(',') : '';
+    const domainAndCloud = productEnv ? joinWithSlash(cloudinaryDomain, productEnv) : cloudinaryDomain;
+    const encodedUrl = url.includes("?") ? encodeURIComponent(url) : url;
+    return `${domainAndCloud}/image/fetch/${t}/${encodedUrl}`;
+}
+getCloudinaryRemoteFetchURL.propTypes = {
+    url: PropTypes.string.isRequired,
+    product_env: PropTypes.string.isRequired
+};
+export function getCloudinaryRemoteFetchURL(props) {
+    const domainAndCloud = joinWithSlash(cloudinary_domain, props.product_env);
+    const cloudinary_prefix = domainAndCloud + cloudinary_props;
+    const result = cloudinary_prefix + '/' + props.url;
+    return result;
+}
+export function userIsMobile() {
+    let match = false;
+    if (typeof window !== 'undefined') {
+        const mediaQuery = window.matchMedia('(max-width: 768px)'); // Example breakpoint
+        match = mediaQuery.matches;
+    }
+    return match;
+}
+loadAllImagesFromCloudinary.propTypes = {
+    origin: PropTypes.string,
+    product_env: PropTypes.string.isRequired
+};
+export function loadAllImagesFromCloudinary(props) {
+    const origin = document.location.origin;
+    if (origin && origin.includes("localhost")) {
+        return;
+    } // do nothing in local dev 
+    const images = document.querySelectorAll('img');
+    images.forEach(img => {
+        const currentSrc = img.getAttribute('src') || '';
+        if (!currentSrc)
+            return;
+        // Use the shared builder so all Cloudinary URLs are consistent.
+        const built = buildCloudinaryUrl({
+            src: currentSrc,
+            productEnv: props.product_env,
+            cloudinaryDomain: cloudinary_domain,
+            // keep other options default (quality/width/transforms) for now
+        });
+        // If builder returned a new URL, update the image src.
+        if (built && built !== currentSrc) {
+            img.setAttribute('src', built);
+        }
+    });
+}

package/dist/components/cms/contentful.delivery.js

@@ -0,0 +1,247 @@
+import PropTypes from "prop-types";
+const debug = false;
+const ctfQSParams = "?fm=webp&q=50";
+/* ========== CALL CONTENTFUL DELIVERY API ========== */
+callContentfulDeliveryAPI.propTypes = {
+    full_url: PropTypes.string.isRequired,
+};
+export async function callContentfulDeliveryAPI(props) {
+    if (debug)
+        console.log("Calling Contentful Delivery API:", props.full_url);
+    try {
+        const response = await fetch(props.full_url);
+        if (!response.ok) {
+            throw new Error(`Response status: ${response.status}`);
+        }
+        const json = await response.json();
+        return json;
+    }
+    catch (error) {
+        if (error instanceof Error) {
+            console.error(error.message);
+        }
+        else {
+            console.error(error);
+        }
+    }
+    return null;
+}
+/* ========== GET CONTENTFUL CARDS ========== */
+getContentfulEntries.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        delivery_access_token: PropTypes.string.isRequired,
+    }).isRequired,
+};
+export async function getContentfulEntries(props) {
+    const { base_url, space_id, environment, delivery_access_token } = props.apiProps;
+    // const full_url = base_url + "/spaces/" + space_id + "/environments/" + environment + "/content_types/" + contentType + "?access_token=" + access_token ;
+    const full_url = base_url +
+        "/spaces/" + space_id +
+        "/environments/" + environment +
+        "/entries?access_token=" + delivery_access_token;
+    return await callContentfulDeliveryAPI({ full_url });
+}
+/*
+https://www.contentful.com/developers/docs/references/content-delivery-api/#/reference/entries/entries-collection/get-all-entries-of-a-space/console/js-plain
+*/
+/* ========== GET CONTENTFUL CARDS BY TYPE ========== */
+getContentfulEntriesByType.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        delivery_access_token: PropTypes.string.isRequired,
+    }).isRequired,
+    contentType: PropTypes.string.isRequired,
+};
+export async function getContentfulEntriesByType(props) {
+    const allEntries = await getContentfulEntries({ apiProps: props.apiProps });
+    const typeEntries = [];
+    for (const item of allEntries.items) {
+        if (item.sys.contentType.sys.id == props.contentType) {
+            typeEntries.push(item);
+        }
+    }
+    allEntries.items = typeEntries;
+    return allEntries;
+}
+/* ========== GET CONTENTFUL CARDS BY TYPE ========== */
+getContentfulContentType.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        access_token: PropTypes.string.isRequired,
+    }).isRequired,
+    contentType: PropTypes.string.isRequired,
+};
+export async function getContentfulContentType(props) {
+    const { base_url, space_id, environment, access_token } = props.apiProps;
+    const full_url = base_url +
+        "/spaces/" + space_id +
+        "/environments/" + environment +
+        "/content_types/" + props.contentType +
+        "?access_token=" + access_token;
+    return await callContentfulDeliveryAPI({ full_url });
+}
+/* ========== GET CONTENTFUL ENTRY BY ENTRY ID ========== */
+getContentfulEntryByEntryID.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        delivery_access_token: PropTypes.string.isRequired,
+    }).isRequired,
+    entry_id: PropTypes.string.isRequired,
+};
+export async function getContentfulEntryByEntryID(props) {
+    const { base_url, space_id, environment, delivery_access_token } = props.apiProps;
+    const full_url = base_url +
+        "/spaces/" + space_id +
+        "/environments/" + environment +
+        "/entries/" + props.entry_id +
+        "?access_token=" + delivery_access_token;
+    return await callContentfulDeliveryAPI({ full_url });
+}
+/* ========== GET CONTENTFUL CARD BY FIELD ========== */
+export async function getContentfulEntryByField(params) {
+    // const cards: any = await getContentfulEntriesData();
+    const searchVal = decodeURIComponent(params.searchVal);
+    for (const item of params.cards.items) {
+        if (item?.fields[params.searchField]?.toLowerCase() == searchVal.toLowerCase()) {
+            return item;
+        }
+    }
+    return null;
+}
+/* ========== GET CONTENTFUL CARD TITLES ========== */
+getContentfulFieldValues.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        delivery_access_token: PropTypes.string.isRequired,
+    }).isRequired,
+    contentType: PropTypes.string.isRequired,
+    field: PropTypes.string.isRequired,
+};
+export async function getContentfulFieldValues(props) {
+    const cards = await getContentfulEntriesByType({
+        apiProps: props.apiProps,
+        contentType: props.contentType,
+    });
+    const fieldVals = cards.items.map(function (card) {
+        return card.fields[props.field];
+    });
+    return fieldVals;
+}
+/* ========== GET CONTENTFUL IMAGES FROM CARDS ========== */
+getContentfulImagesFromEntries.propTypes = {
+    images: PropTypes.any.isRequired,
+    assets: PropTypes.any.isRequired,
+};
+export async function getContentfulImagesFromEntries(props) {
+    const imageURLs = [];
+    for (const image of props.images) {
+        for (const asset of props.assets) {
+            if (image.sys.id == asset.sys.id) {
+                imageURLs.push({
+                    image: asset.fields.file.url + ctfQSParams,
+                    imageAlt: asset.fields.description,
+                });
+            }
+        }
+    }
+    return imageURLs;
+}
+/* ========== GET CONTENTFUL ASSETS ========== */
+getContentfulAssets.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        access_token: PropTypes.string.isRequired,
+    }).isRequired,
+};
+export async function getContentfulAssets(props) {
+    const { base_url, space_id, environment, access_token } = props.apiProps;
+    const full_url = base_url +
+        "/spaces/" + space_id +
+        "/environments/" + environment +
+        "/assets?access_token=" + access_token;
+    return await callContentfulDeliveryAPI({ full_url });
+}
+/* ========== GET CONTENTFUL ASSET URLS ========== */
+getContentfulAssetURLs.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        access_token: PropTypes.string.isRequired,
+    }).isRequired,
+};
+export async function getContentfulAssetURLs(props) {
+    const assetURLs = [];
+    const assets = await getContentfulAssets(props);
+    for (const asset of assets.items) {
+        assetURLs.push({
+            image: asset.fields.file.url + ctfQSParams,
+            imageAlt: asset.fields.description,
+        });
+    }
+    if (debug)
+        console.log("Asset URLs: ", assetURLs);
+    return assetURLs;
+}
+/* ========== GET CONTENTFUL DISCOUNT CODES ========== */
+getContentfulDiscountCodes.propTypes = {
+    apiProps: PropTypes.shape({
+        proxyURL: PropTypes.string,
+        base_url: PropTypes.string.isRequired,
+        space_id: PropTypes.string.isRequired,
+        environment: PropTypes.string.isRequired,
+        delivery_access_token: PropTypes.string.isRequired,
+    }).isRequired,
+    contentType: PropTypes.string.isRequired,
+};
+export async function getContentfulDiscountCodes(props) {
+    const contentType = "discountCodes";
+    try {
+        if (debug)
+            console.log("Fetching Discount Codes");
+        const response = await getContentfulEntriesByType({
+            apiProps: props.apiProps,
+            contentType: props.contentType
+        });
+        if (!response || !response.items) {
+            console.error(`HTTP error! status: ${response.status}`);
+            return [];
+        }
+        const filteredItems = response.items.filter((item) => {
+            return item.sys.contentType.sys.id === contentType;
+        });
+        const discountCodes = filteredItems.map((item) => ({
+            codeName: item.fields.codeName,
+            codeDescription: item.fields.codeDescription,
+            codeType: item.fields.codeType,
+            codeStart: item.fields.codeStart,
+            codeEnd: item.fields.codeEnd,
+            codeValue: item.fields.codeValue,
+        }));
+        return discountCodes;
+    }
+    catch (error) {
+        console.error('Error fetching token:', error);
+        return [];
+    }
+}