@pixelated-tech/components 3.2.13 → 3.3.0

package/README.md

@@ -182,6 +182,8 @@ npm run storybook
 - [ ] Buffer Integration (or Sendible, Sprout Social, Hootsuite)
 - [ ] Zapier Integration
 - [ ] Hero Banner: headline, subtext, CTA, background image/video, overlay.
+- [ ] Accessibility Enhancer: wrapper component that automatically improves accessibility across Pixelated sites by adding ARIA labels, roles, and states to existing components. Includes color contrast checking, keyboard navigation helpers, and alt-text suggestions for images.
+- [ ] SEO Dashboard with AI Integration: component that analyzes site content, suggests optimizations, integrates with AI for meta descriptions and keyword research.
 
 ### CI / CD Improvements
 - [ ] Add CI workflow to run tests and lints on pull requests.
@@ -202,8 +204,15 @@ npm run storybook
 - [ ] **GoogleReviews Component**: Add API key to config provider instead of hardcoding.
 - [ ] **Instagram Component**: Add accessToken and userId to config provider for centralized API credentials.
 
-
-
+### SSR Fixes
+- [ ] **cloudinary.image.tsx** (`SmartImage`): Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
+- [ ] **wordpress.components.tsx** (`BlogPostList`, etc.): Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts  
+- [ ] **pagebuilder/form/formcomponents.tsx**: Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
+- [ ] **cms/hubspot.components.tsx**: Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
+- [ ] **cms/gravatar.components.tsx**: Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
+- [ ] **structured/recipe.tsx**: Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
+- [ ] **structured/timeline.tsx**: Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
+- [ ] **structured/markdown.tsx**: Add `"use client"` or refactor to avoid `usePixelatedConfig` in server contexts
 
 See the [open issues](https://github.com/brianwhaley/pixelated-components/issues) for a full list of proposed features (and known issues).
 
@@ -261,16 +270,16 @@ Project Link: [https://github.com/brianwhaley/pixelated-components](https://gith
 
 ### Overview
 
-**Current Status**: ✅ 2,184 tests passing across 59 test files
+**Current Status**: ✅ 2,244 tests passing across 67 test files
 
 | Metric | Value |
 |--------|-------|
-| Test Files | 59 |
-| Total Tests | 2,184 |
-| Coverage (Statements) | 79.27% |
-| Coverage (Lines) | 82.74% |
-| Coverage (Functions) | 84.74% |
-| Coverage (Branches) | 67.19% |
+| Test Files | 67 |
+| Total Tests | 2,244 |
+| Coverage (Statements) | 76.59% |
+| Coverage (Lines) | 79.45% |
+| Coverage (Functions) | 78.33% |
+| Coverage (Branches) | 66.79% |
 | Test Framework | Vitest 4.x |
 | Testing Library | @testing-library/react + jsdom |
 
@@ -288,42 +297,60 @@ npm run test:run         # Single run (for CI)
 **Component Coverage Summary**
 
 #### Component Coverage (Sorted by Statement Coverage)
+- **tiles.tsx**: 100% statements
 - **google.reviews.functions.ts**: 100% statements
-- **googlesearch.tsx**: 100% statements
+- **config.server.tsx**: 100% statements
+- **accordion.tsx**: 100% statements
+- **modal.tsx**: 100% statements
+- **tab.tsx**: 100% statements
+- **ComponentPropertiesForm.tsx**: 100% statements
+- **ComponentSelector.tsx**: 100% statements
+- **ComponentTree.tsx**: 100% statements
 - **formvalidations.tsx**: 100% statements
-- **tiles.tsx**: 100% statements
-- **markdown.tsx**: 100% statements
+- **componentMetadata.tsx**: 100% statements
+- **googlesearch.tsx**: 100% statements
+- **schema-localbusiness.tsx**: 100% statements
+- **schema-recipe.tsx**: 100% statements
+- **schema-services.tsx**: 100% statements
+- **schema-website.tsx**: 100% statements
 - **buzzwordbingo.tsx**: 100% statements
+- **markdown.tsx**: 100% statements
 - **timeline.tsx**: 100% statements
-- **config.server.tsx**: 100% statements
-- **modal.tsx**: 100% statements
-- **recipe.tsx**: 98.8% statements
 - **sidepanel.tsx**: 97.5% statements
+- **config.ts**: 96.55% statements
 - **google.reviews.components.tsx**: 95.83% statements
+- **schema-blogposting.tsx**: 95.24% statements
+- **recipe.tsx**: 94.59% statements
 - **resume.tsx**: 94.38% statements
 - **contentful.delivery.ts**: 92.5% statements
-- **css.tsx**: 91.42% statements
-- **functions.ts**: 90.9% statements
+- **css.tsx**: 91.43% statements
+- **functions.ts**: 90.91% statements
+- **menu-expando.tsx**: 90.12% statements
 - **config.client.tsx**: 90% statements
-- **api.ts**: 87.5% statements
 - **loading.tsx**: 85.71% statements
+- **SaveLoadSection.tsx**: 84.85% statements
 - **table.tsx**: 84.48% statements
+- **ConfigBuilder.tsx**: 83.52% statements
 - **cloudinary.ts**: 83.33% statements
-- **shoppingcart.functions.ts**: 81.69% statements
-- **callout.tsx**: 80.00% statements
-- **sitemap.ts**: 76.38% statements
-- **carousel.tsx**: 71.70% statements
-- **nerdjoke.tsx**: 70.58% statements
+- **formcomponents.tsx**: 83.33% statements
+- **form.tsx**: 83.2% statements
+- **shoppingcart.functions.ts**: 81.7% statements
+- **callout.tsx**: 80% statements
+- **microinteractions.tsx**: 80% statements
+- **cloudinary.image.tsx**: 78.57% statements
+- **sitemap.ts**: 76.06% statements
+- **manifest.tsx**: 75% statements
+- **carousel.tsx**: 71.7% statements
+- **nerdjoke.tsx**: 69.44% statements
 - **menu-accordion.tsx**: 68.13% statements
-- **semantic.tsx**: 60.81% statements
-- **config.ts**: 55.17% statements
-- **socialcard.tsx**: 29.5% statements
-- **ComponentPropertiesForm.tsx**: 0% statements (no tests)
-- **ComponentSelector.tsx**: 0% statements (no tests)
-- **ComponentTree.tsx**: 0% statements (no tests)
-- **PageBuilderUI.tsx**: 0% statements (no tests)
-- **PageEngine.tsx**: 0% statements (no tests)
-- **SaveLoadSection.tsx**: 0% statements (no tests)
+- **semantic.tsx**: 63.51% statements
+- **componentMap.tsx**: 60% statements
+- **propTypeIntrospection.tsx**: 60% statements
+- **wordpress.functions.ts**: 51.43% statements
+- **PageEngine.tsx**: 48% statements
+- **componentGeneration.tsx**: 38.89% statements
+- **socialcard.tsx**: 29.51% statements
+- **PageBuilderUI.tsx**: 26.67% statements
 
 ### Testing Next Steps
 

package/dist/components/callout/callout.scss

@@ -149,9 +149,6 @@
 }
 
 
-/* .callout .callout-button a {
-    display: inline-block;
-} */
 
 /* ========================================
 =============  BOXED CALLOUT  =============

package/dist/components/cms/flickr.js

@@ -1,5 +1,4 @@
 import PropTypes from 'prop-types';
-import { generateURL } from '../utilities/api';
 import { mergeDeep } from '../utilities/functions';
 const defaultFlickr = {
     flickr: {
@@ -57,7 +56,14 @@ export function GetFlickrData(props) {
         flickrConfig = mergeDeep(flickrConfig, props.flickr);
     }
     const flickr = flickrConfig;
-    const myURL = generateURL(flickr.baseURL, flickr.urlProps);
+    // Build URL with query parameters
+    let myURL = flickr.baseURL;
+    let queryParams = '';
+    Object.keys(flickr.urlProps).forEach((prop) => {
+        const value = flickr.urlProps[prop];
+        queryParams += (queryParams.length === 0) ? prop + '=' + value : '&' + prop + '=' + value;
+    });
+    myURL += queryParams;
     const fetchFlickrData = async () => {
         try {
             const response = await fetch(myURL);

package/dist/components/cms/google.reviews.components.js

@@ -50,5 +50,5 @@ export function GoogleReviewsCard(props) {
     if (error) {
         return (_jsx("div", { className: "google-reviews-card", children: _jsxs("p", { className: "error", children: ["Error: ", error] }) }));
     }
-    return (_jsxs("div", { className: "google-reviews-card", children: [_jsx("h3", { children: place?.name || 'Reviews' }), place?.formatted_address && (_jsx("p", { className: "address", children: place.formatted_address })), reviews.length === 0 ? (_jsx("p", { className: "no-reviews", children: "No reviews found." })) : (_jsx("ul", { children: reviews.map((r, i) => (_jsxs("li", { children: [_jsxs("div", { className: "review-header", children: [r.profile_photo_url && (_jsx("img", { src: r.profile_photo_url, alt: r.author_name, className: "profile-photo" })), _jsxs("div", { children: [_jsx("div", { className: "author-name", children: r.author_name }), _jsxs("div", { className: "rating", children: ['★'.repeat(r.rating), '☆'.repeat(5 - r.rating), " ", r.rating, "/5", r.relative_time_description && _jsxs("span", { children: [" \u00B7 ", r.relative_time_description] })] })] })] }), r.text && _jsx("div", { className: "review-text", children: r.text })] }, i))) })), place && (_jsx("a", { href: `https://search.google.com/local/writereview?placeid=${place.place_id}`, target: "_blank", rel: "noopener noreferrer", className: "write-review", children: "Write a review on Google \u2192" }))] }));
+    return (_jsxs("div", { className: "google-reviews-card", children: [_jsx("h3", { children: place?.name || 'Reviews' }), place?.formatted_address && (_jsx("p", { className: "address", children: place.formatted_address })), reviews.length === 0 ? (_jsx("p", { className: "no-reviews", children: "No reviews found." })) : (_jsx("ul", { children: reviews.map((r, i) => (_jsxs("li", { children: [_jsxs("div", { className: "review-header", children: [r.profile_photo_url && (_jsx("div", { className: "profile-photo-container", children: _jsx("img", { src: r.profile_photo_url, alt: r.author_name, className: "profile-photo" }) })), _jsxs("div", { children: [_jsx("div", { className: "author-name", children: r.author_name }), _jsxs("div", { className: "rating", children: ['★'.repeat(r.rating), '☆'.repeat(5 - r.rating), " ", r.rating, "/5", r.relative_time_description && _jsxs("span", { children: [" \u00B7 ", r.relative_time_description] })] })] })] }), r.text && _jsx("div", { className: "review-text", children: r.text })] }, i))) })), place && (_jsx("a", { href: `https://search.google.com/local/writereview?placeid=${place.place_id}`, target: "_blank", rel: "noopener noreferrer", className: "write-review", children: "Write a review on Google \u2192" }))] }));
 }

package/dist/components/general/tab.css

@@ -0,0 +1,105 @@
+/* Tab Component Styles */
+
+.tab-container {
+  display: flex;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  overflow: hidden;
+  height: 100%;
+}
+
+.tab-top {
+  flex-direction: column;
+}
+
+.tab-bottom {
+  flex-direction: column-reverse;
+}
+
+.tab-left {
+  flex-direction: row;
+}
+
+.tab-right {
+  flex-direction: row-reverse;
+}
+
+.tab-headers {
+  display: flex;
+  background-color: #f5f5f5;
+}
+
+.tab-top .tab-headers,
+.tab-bottom .tab-headers {
+  flex-direction: row;
+  width: 100%;
+}
+
+.tab-left .tab-headers,
+.tab-right .tab-headers {
+  flex-direction: column;
+  height: 100%;
+}
+
+.tab-header {
+  padding: 10px 20px;
+  border: none;
+  background: none;
+  cursor: pointer;
+  transition: background-color 0.3s;
+  white-space: nowrap;
+  flex-shrink: 0;
+}
+
+.tab-top .tab-header,
+.tab-bottom .tab-header {
+  border-right: 1px solid #ddd;
+  border-bottom: none;
+}
+
+.tab-left .tab-header,
+.tab-right .tab-header {
+  border-right: none;
+  border-bottom: 1px solid #ddd;
+  height: auto;
+  padding: 20px 10px;
+}
+
+.tab-left .tab-header {
+  transform: rotate(-90deg);
+}
+
+.tab-right .tab-header {
+  transform: rotate(90deg);
+}
+
+.tab-header:last-child {
+  border-right: none;
+}
+
+.tab-top .tab-header:last-child,
+.tab-bottom .tab-header:last-child {
+  border-right: none;
+}
+
+.tab-left .tab-header:last-child,
+.tab-right .tab-header:last-child {
+  border-bottom: none;
+}
+
+.tab-header:hover {
+  background-color: #e0e0e0;
+}
+
+.tab-header.active {
+  background-color: #fff;
+  font-weight: bold;
+}
+
+.tab-content {
+  flex: 1;
+  padding: 20px;
+  background-color: #fff;
+  min-height: 200px;
+  overflow: auto;
+}

package/dist/components/general/tab.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import PropTypes from 'prop-types';
+import './tab.css';
+const TabItemPropTypes = {
+    id: PropTypes.string.isRequired,
+    label: PropTypes.string.isRequired, //
+    content: PropTypes.node.isRequired,
+};
+// type TabItemType = InferProps<typeof TabItemPropTypes>;
+Tab.propTypes = {
+    tabs: PropTypes.arrayOf(PropTypes.shape(TabItemPropTypes).isRequired).isRequired,
+    orientation: PropTypes.oneOf(['top', 'bottom', 'left', 'right']),
+    defaultActiveTab: PropTypes.string,
+    onTabChange: PropTypes.func,
+};
+export function Tab({ tabs, orientation = 'top', defaultActiveTab, onTabChange }) {
+    const [activeTab, setActiveTab] = useState(defaultActiveTab || tabs[0]?.id || '');
+    const handleTabClick = (tabId) => {
+        setActiveTab(tabId);
+        onTabChange?.(tabId);
+    };
+    const activeContent = tabs.find(tab => tab.id === activeTab)?.content;
+    const tabClass = `tab-container tab-${orientation}`;
+    return (_jsxs("div", { className: tabClass, children: [_jsx("div", { className: "tab-headers", children: tabs.map(tab => (_jsx("button", { className: `tab-header ${activeTab === tab.id ? 'active' : ''}`, onClick: () => handleTabClick(tab.id), children: tab.label }, tab.id))) }), _jsx("div", { className: "tab-content", children: activeContent })] }));
+}

package/dist/components/menu/menu-expando.js

@@ -136,6 +136,12 @@ export function MenuExpandoButton() {
         if (details)
             details.open = !details.open;
     }
-    return (_jsx("div", { className: "menuExpandoButton", id: "menuExpandoButton", onClick: handleMenuExpandoButtonClick, children: _jsx("img", { src: "/images/icons/mobile-menu2.png", title: "Mobile Menu", alt: "Mobile Menu" }) }));
+    function handleKeyDown(event) {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            handleMenuExpandoButtonClick(event);
+        }
+    }
+    return (_jsx("div", { className: "menuExpandoButton", id: "menuExpandoButton", onClick: handleMenuExpandoButtonClick, onKeyDown: handleKeyDown, tabIndex: 0, role: "button", "aria-label": "Toggle mobile menu", children: _jsx("img", { src: "/images/icons/mobile-menu2.png", title: "Mobile Menu", alt: "Mobile Menu" }) }));
 }
 MenuExpandoButton.propTypes = {};

package/dist/components/nerdjoke/nerdjoke.js

@@ -2,7 +2,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from "react";
 import PropTypes from "prop-types";
-import { getXHRData, generateURL } from "../utilities/api";
 import "../../css/pixelated.grid.scss";
 import "./nerdjoke.css";
 const debug = false;
@@ -36,7 +35,7 @@ export function NerdJoke( /* props: NerdJokeType */) {
             elapsedPath.style.width = myWidth;
         }
     }, [formatTimeLeft]);
-    const loadJoke = useCallback(() => {
+    const loadJoke = useCallback(async () => {
         if (debug)
             console.log("Loading Joke");
         timePassedRef.current = 0;
@@ -52,11 +51,18 @@ export function NerdJoke( /* props: NerdJokeType */) {
         }, TIME_LIMIT * 1000);
         const myURL = "https://vvqyc1xpw6.execute-api.us-east-2.amazonaws.com/prod/nerdjokes?";
         const myURLProps = { command: "%2Fnerdjokes", text: "getjokejson" };
-        const myMethod = "GET";
-        getXHRData(generateURL(myURL, myURLProps), myMethod, (jokeData) => {
-            const myJokeData = jokeData;
-            setJoke(myJokeData);
-        });
+        try {
+            const url = myURL + "command=" + myURLProps.command + "&text=" + myURLProps.text;
+            const response = await fetch(url);
+            if (!response.ok)
+                throw new Error(`HTTP error! status: ${response.status}`);
+            const jokeData = await response.json();
+            setJoke(jokeData);
+        }
+        catch (error) {
+            console.error('Failed to fetch joke:', error);
+            // Optionally set a fallback joke or handle error
+        }
     }, []);
     const startTimer = useCallback(() => {
         if (debug)

package/dist/components/seo/manifest.js

@@ -0,0 +1,40 @@
+/**
+ * Generates a PWA manifest from siteinfo configuration
+ * @param options - Configuration options
+ * @returns Next.js manifest object
+ */
+export function generateManifest(options) {
+    const { siteInfo, customProperties = {} } = options;
+    const baseManifest = {
+        // @ts-expect-error - 'author' is not in standard Manifest type but used by some PWA implementations
+        author: siteInfo.author,
+        background_color: siteInfo.background_color,
+        default_locale: siteInfo.default_locale,
+        description: siteInfo.description,
+        developer: {
+            name: siteInfo.author || "Developer",
+            url: siteInfo.url
+        },
+        display: siteInfo.display || "standalone",
+        homepage_url: siteInfo.url,
+        icons: [{
+                src: siteInfo.favicon || "/favicon.ico",
+                sizes: siteInfo.favicon_sizes || "64x64 32x32 24x24 16x16",
+                type: siteInfo.favicon_type || "image/x-icon"
+            }],
+        name: siteInfo.name,
+        short_name: siteInfo.name,
+        start_url: ".",
+        theme_color: siteInfo.theme_color,
+    };
+    // Merge with custom properties, allowing overrides
+    return { ...baseManifest, ...customProperties };
+}
+/**
+ * Default export for Next.js manifest route
+ * @param options - Configuration options
+ * @returns Next.js manifest object
+ */
+export function Manifest(options) {
+    return generateManifest(options);
+}

package/dist/components/seo/metadata.components.js

@@ -1,23 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import PropTypes from "prop-types";
-// https://gist.github.com/whitingx/3840905
-generateMetaTags.propTypes = {
-    title: PropTypes.string.isRequired,
-    description: PropTypes.string.isRequired,
-    keywords: PropTypes.string.isRequired,
-    site_name: PropTypes.string.isRequired,
-    email: PropTypes.string.isRequired,
-    origin: PropTypes.string.isRequired,
-    url: PropTypes.string.isRequired,
-    image: PropTypes.string.isRequired,
-    image_height: PropTypes.string.isRequired,
-    image_width: PropTypes.string.isRequired,
-    favicon: PropTypes.string.isRequired,
-};
-export function generateMetaTags(props) {
-    const { title, description, keywords, site_name, email, origin, url, image, image_height, image_width, favicon } = props;
-    return (_jsxs(_Fragment, { children: [_jsx("title", { children: title }), _jsx("meta", { charSet: "UTF-8" }), _jsx("meta", { httpEquiv: "content-type", content: "text/html; charset=UTF-8" }), _jsx("meta", { httpEquiv: 'Expires', content: '0' }), _jsx("meta", { httpEquiv: 'Pragma', content: 'no-cache' }), _jsx("meta", { httpEquiv: 'Cache-Control', content: 'no-cache' }), _jsx("meta", { name: "application-name", content: site_name }), _jsx("meta", { name: "author", content: site_name + ", " + email }), _jsx("meta", { name: 'copyright', content: site_name }), _jsx("meta", { name: "creator", content: site_name }), _jsx("meta", { name: "description", content: description }), _jsx("meta", { name: "keywords", content: keywords }), _jsx("meta", { name: 'language', content: 'EN' }), _jsx("meta", { name: 'owner', content: site_name }), _jsx("meta", { name: "publisher", content: site_name }), _jsx("meta", { name: 'rating', content: 'General' }), _jsx("meta", { name: 'reply-to', content: email }), _jsx("meta", { name: "robots", content: "index, follow" }), _jsx("meta", { name: 'url', content: url }), _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1.0, shrink-to-fit=no" }), _jsx("meta", { property: "og:description", content: description }), _jsx("meta", { property: 'og:email', content: email }), _jsx("meta", { property: "og:image", content: image }), _jsx("meta", { property: "og:image:height", content: image_height }), _jsx("meta", { property: "og:image:width", content: image_width }), _jsx("meta", { property: "og:locale", content: "en_US" }), _jsx("meta", { property: "og:site_name", content: site_name }), _jsx("meta", { property: "og:title", content: title }), _jsx("meta", { property: "og:type", content: "website" }), _jsx("meta", { property: "og:url", content: url }), _jsx("meta", { itemProp: "name", content: site_name }), _jsx("meta", { itemProp: "url", content: url }), _jsx("meta", { itemProp: "description", content: description }), _jsx("meta", { itemProp: "thumbnailUrl", content: image }), _jsx("meta", { property: "twitter:domain", content: new URL(origin).hostname }), _jsx("meta", { property: "twitter:url", content: url }), _jsx("meta", { name: "twitter:card", content: "summary_large_image" }), _jsx("meta", { name: "twitter:creator", content: site_name }), _jsx("meta", { name: "twitter:description", content: description }), _jsx("meta", { name: "twitter:image", content: image }), _jsx("meta", { name: "twitter:image:height", content: image_height }), _jsx("meta", { name: "twitter:image:width", content: image_width }), _jsx("meta", { name: "twitter:title", content: title }), _jsx("link", { rel: "author", href: origin }), _jsx("link", { rel: "canonical", href: url }), _jsx("link", { rel: "icon", type: "image/x-icon", href: favicon }), _jsx("link", { rel: "shortcut icon", type: "image/x-icon", href: favicon }), _jsx("link", { rel: "manifest", href: "/manifest.webmanifest" }), _jsx("link", { rel: "preconnect", href: "https://images.ctfassets.net/" }), _jsx("link", { rel: "preconnect", href: "https://res.cloudinary.com/" }), _jsx("link", { rel: "preconnect", href: "https://farm2.static.flickr.com" }), _jsx("link", { rel: "preconnect", href: "https://farm6.static.flickr.com" }), _jsx("link", { rel: "preconnect", href: "https://farm8.static.flickr.com" }), _jsx("link", { rel: "preconnect", href: "https://farm66.static.flickr.com" })] }));
-}
 setClientMetadata.propTypes = {
     title: PropTypes.string.isRequired,
     description: PropTypes.string.isRequired,

package/dist/components/seo/metadata.functions.js

@@ -0,0 +1,111 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export function descriptionToKeywords(descriptionText, numKeywords = 5, customStopWords = []) {
+    if (!descriptionText) {
+        return [];
+    }
+    // Define a default list of common English stop words
+    const defaultStopWords = new Set([
+        'a', 'an', 'and', 'are', 'as', 'at', 'be', 'but', 'by', 'for', 'if', 'in', 'into',
+        'is', 'it', 'no', 'not', 'of', 'on', 'or', 'such', 'that', 'the', 'their',
+        'then', 'there', 'these', 'they', 'this', 'to', 'was', 'will', 'with'
+    ]);
+    const allStopWords = new Set([...defaultStopWords, ...customStopWords]);
+    // Pre-process the text: make lowercase and remove punctuation
+    const cleanedText = descriptionText.toLowerCase().replace(/[.,/#!$%^&*;:{}=\-_`~()]/g, '');
+    // Tokenize the text into individual words
+    const words = cleanedText.split(/\s+/);
+    // Count word frequencies, excluding stop words
+    const wordFrequency = words.reduce((counts, word) => {
+        if (word.length > 2 && !allStopWords.has(word)) {
+            counts[word] = (counts[word] || 0) + 1;
+        }
+        return counts;
+    }, {});
+    // Sort words by frequency and get the top N keywords
+    const sortedKeywords = Object.keys(wordFrequency).sort((a, b) => wordFrequency[b] - wordFrequency[a]);
+    // Return the top N keywords
+    return sortedKeywords.slice(0, numKeywords);
+}
+export function getRouteByKey(obj, key, value) {
+    if (typeof obj !== 'object' || obj === null) {
+        return null;
+    }
+    if (obj[key] && obj[key] === value) {
+        return obj;
+    }
+    for (const prop in obj) {
+        if (obj[prop] && typeof obj[prop] === 'object') {
+            const result = getRouteByKey(obj[prop], key, value);
+            if (result) {
+                return result;
+            }
+        }
+    }
+    return null;
+}
+export function getAllRoutes(routes, key) {
+    const result = [];
+    function traverse(obj) {
+        if (typeof obj !== 'object' || obj === null) {
+            return;
+        }
+        if (Array.isArray(obj)) {
+            obj.forEach(item => traverse(item));
+        }
+        else {
+            if (obj[key]) {
+                traverse(obj[key]);
+            }
+            else {
+                result.push(obj);
+            }
+        }
+    }
+    traverse(routes);
+    return result;
+}
+export const getMetadata = (routes, key = "name", value = "Home") => {
+    const foundObject = getRouteByKey(routes, key, value);
+    if (foundObject) {
+        const metadata = {
+            title: foundObject.title,
+            description: foundObject.description,
+            keywords: foundObject.keywords,
+        };
+        return metadata;
+    }
+    else {
+        const metadata = {
+            title: "",
+            description: "",
+            keywords: "",
+        };
+        return metadata;
+    }
+};
+export function getAccordionMenuData(myRoutes) {
+    const menuItems = myRoutes.map((thisRoute) => (thisRoute.routes
+        ? { [thisRoute.name]: thisRoute.routes.map((subRoute) => ({ [subRoute.name]: subRoute.path })) }
+        : { [thisRoute.name]: thisRoute.path })).reduce((obj, item) => {
+        if (typeof Object.values(item)[0] == "object") {
+            // Nested Object
+            const subitems = Object.values(item)[0];
+            const newSubitems = subitems.reduce((obj2, item2) => {
+                Object.assign(obj2, item2);
+                return obj2;
+            });
+            Object.assign(obj, { [Object.keys(item)[0]]: newSubitems });
+            return obj;
+        }
+        else {
+            // String
+            Object.assign(obj, item);
+            return obj;
+        }
+    });
+    return menuItems;
+}
+export function generateMetaTags(props) {
+    const { title, description, keywords, site_name, email, origin, url, image, image_height, image_width, favicon } = props;
+    return (_jsxs(_Fragment, { children: [_jsx("title", { children: title }), _jsx("meta", { charSet: "UTF-8" }), _jsx("meta", { httpEquiv: "content-type", content: "text/html; charset=UTF-8" }), _jsx("meta", { httpEquiv: 'Expires', content: '0' }), _jsx("meta", { httpEquiv: 'Pragma', content: 'no-cache' }), _jsx("meta", { httpEquiv: 'Cache-Control', content: 'no-cache' }), _jsx("meta", { name: "application-name", content: site_name }), _jsx("meta", { name: "author", content: site_name + ", " + email }), _jsx("meta", { name: 'copyright', content: site_name }), _jsx("meta", { name: "creator", content: site_name }), _jsx("meta", { name: "description", content: description }), _jsx("meta", { name: "keywords", content: keywords }), _jsx("meta", { name: 'language', content: 'EN' }), _jsx("meta", { name: 'owner', content: site_name }), _jsx("meta", { name: "publisher", content: site_name }), _jsx("meta", { name: 'rating', content: 'General' }), _jsx("meta", { name: 'reply-to', content: email }), _jsx("meta", { name: "robots", content: "index, follow" }), _jsx("meta", { name: 'url', content: url }), _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1.0, shrink-to-fit=no" }), _jsx("meta", { property: "og:description", content: description }), _jsx("meta", { property: 'og:email', content: email }), _jsx("meta", { property: "og:image", content: image }), _jsx("meta", { property: "og:image:height", content: image_height }), _jsx("meta", { property: "og:image:width", content: image_width }), _jsx("meta", { property: "og:locale", content: "en_US" }), _jsx("meta", { property: "og:site_name", content: site_name }), _jsx("meta", { property: "og:title", content: title }), _jsx("meta", { property: "og:type", content: "website" }), _jsx("meta", { property: "og:url", content: url }), _jsx("meta", { itemProp: "name", content: site_name }), _jsx("meta", { itemProp: "url", content: url }), _jsx("meta", { itemProp: "description", content: description }), _jsx("meta", { itemProp: "thumbnailUrl", content: image }), _jsx("meta", { property: "twitter:domain", content: new URL(origin).hostname }), _jsx("meta", { property: "twitter:url", content: url }), _jsx("meta", { name: "twitter:card", content: "summary_large_image" }), _jsx("meta", { name: "twitter:creator", content: site_name }), _jsx("meta", { name: "twitter:description", content: description }), _jsx("meta", { name: "twitter:image", content: image }), _jsx("meta", { name: "twitter:image:height", content: image_height }), _jsx("meta", { name: "twitter:image:width", content: image_width }), _jsx("meta", { name: "twitter:title", content: title }), _jsx("link", { rel: "author", href: origin }), _jsx("link", { rel: "canonical", href: url }), _jsx("link", { rel: "icon", type: "image/x-icon", href: favicon }), _jsx("link", { rel: "shortcut icon", type: "image/x-icon", href: favicon }), _jsx("link", { rel: "manifest", href: "/manifest.webmanifest" }), _jsx("link", { rel: "preconnect", href: "https://images.ctfassets.net/" }), _jsx("link", { rel: "preconnect", href: "https://res.cloudinary.com/" }), _jsx("link", { rel: "preconnect", href: "https://farm2.static.flickr.com" }), _jsx("link", { rel: "preconnect", href: "https://farm6.static.flickr.com" }), _jsx("link", { rel: "preconnect", href: "https://farm8.static.flickr.com" }), _jsx("link", { rel: "preconnect", href: "https://farm66.static.flickr.com" })] }));
+}

package/dist/components/seo/schema-blogposting.functions.js

@@ -0,0 +1,42 @@
+import { decode } from 'html-entities';
+/**
+ * Converts WordPress REST API blog post to schema.org BlogPosting format
+ * @param post WordPress blog post
+ * @param includeFullContent Whether to include articleBody (true) or just description (false)
+ */
+export function mapWordPressToBlogPosting(post, includeFullContent = false) {
+    const cleanContent = (content) => {
+        if (!content)
+            return '';
+        // Strip HTML tags and decode all HTML entities
+        const stripped = content.replace(/<[^>]*>/g, '');
+        return decode(stripped).replace(/\[…\]/g, '').trim();
+    };
+    const description = cleanContent(post.excerpt);
+    const articleBody = includeFullContent ? cleanContent(post.content || '') : undefined;
+    const schema = {
+        '@context': 'https://schema.org',
+        '@type': 'BlogPosting',
+        headline: decode(post.title.replace(/<[^>]*>/g, '')),
+        description: description || decode(post.title.replace(/<[^>]*>/g, '')),
+        datePublished: post.date,
+        image: post.featured_image || post.post_thumbnail?.URL,
+        articleSection: Array.isArray(post.categories) && post.categories.length > 0
+            ? post.categories[0]
+            : 'Blog',
+        keywords: Array.isArray(post.categories) ? post.categories : [],
+    };
+    if (articleBody) {
+        schema.articleBody = articleBody;
+    }
+    if (post.modified) {
+        schema.dateModified = post.modified;
+    }
+    if (post.author) {
+        schema.author = {
+            '@type': 'Person',
+            name: post.author,
+        };
+    }
+    return schema;
+}

package/dist/components/seo/schema-blogposting.js

@@ -1,50 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * Converts WordPress REST API blog post to schema.org BlogPosting format
- * @param post WordPress blog post
- * @param includeFullContent Whether to include articleBody (true) or just description (false)
- */
-export function mapWordPressToBlogPosting(post, includeFullContent = false) {
-    const decodeString = (s) => {
-        if (typeof document === 'undefined')
-            return s;
-        const temp = document.createElement('p');
-        temp.innerHTML = s;
-        return temp.textContent || temp.innerText || s;
-    };
-    const cleanContent = (content) => {
-        if (!content)
-            return '';
-        return decodeString(content).replace(/\[…\]/g, '').trim();
-    };
-    const description = cleanContent(post.excerpt);
-    const articleBody = includeFullContent ? cleanContent(post.content || '') : undefined;
-    const schema = {
-        '@context': 'https://schema.org',
-        '@type': 'BlogPosting',
-        headline: decodeString(post.title),
-        description: description || decodeString(post.title),
-        datePublished: post.date,
-        image: post.featured_image || post.post_thumbnail?.URL,
-        articleSection: Array.isArray(post.categories) && post.categories.length > 0
-            ? post.categories[0]
-            : 'Blog',
-        keywords: Array.isArray(post.categories) ? post.categories : [],
-    };
-    if (articleBody) {
-        schema.articleBody = articleBody;
-    }
-    if (post.modified) {
-        schema.dateModified = post.modified;
-    }
-    if (post.author) {
-        schema.author = {
-            '@type': 'Person',
-            name: post.author,
-        };
-    }
-    return schema;
-}
 export function SchemaBlogPosting({ post }) {
     return (_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: {
             __html: JSON.stringify(post),