@pixelated-tech/components 3.12.0 → 3.13.1

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

@@ -128,5 +128,5 @@ export function generateMetaTags(props) {
     const image_height = prop_image_height || siteInfo?.image_height;
     const image_width = prop_image_width || siteInfo?.image_width;
     const favicon = prop_favicon || siteInfo?.favicon;
-    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 != null ? String(image_height) : undefined }), _jsx("meta", { property: "og:image:width", content: image_width != null ? String(image_width) : undefined }), _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: newOrigin }), _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 != null ? String(image_height) : undefined }), _jsx("meta", { name: "twitter:image:width", content: image_width != null ? String(image_width) : undefined }), _jsx("meta", { name: "twitter:title", content: title }), _jsx("link", { rel: "author", href: newOrigin }), _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" })] }));
+    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 != null ? String(image_height) : undefined }), _jsx("meta", { property: "og:image:width", content: image_width != null ? String(image_width) : undefined }), _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: newOrigin }), _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 != null ? String(image_height) : undefined }), _jsx("meta", { name: "twitter:image:width", content: image_width != null ? String(image_width) : undefined }), _jsx("meta", { name: "twitter:title", content: title }), _jsx("link", { rel: "author", href: "humans.txt" }), _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/general/microinteractions.css

@@ -43,7 +43,7 @@ body.buttonring {
         box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
     }
 }
-body.cartpulse .pixCart #pixCartButton {
+body.cartpulse .pix-cart #pix-cart-button {
     animation: pulse-glow 2s infinite;
 }
 

package/dist/components/general/nerdjoke.css

@@ -3,12 +3,12 @@
 ===============  NERDJOKE   ===============
 ======================================== */
 
-.nerdJoke {
+.nerd-joke {
 	padding-bottom: 20px;
 	font-size: 24px;
 }
 
-.nerdJoke .jokeText div {
+.nerd-joke .joke-text div {
 	padding-bottom: 15px;
 }
 
@@ -20,7 +20,7 @@
 	font-weight: bold;
 }
 
-.jokeButton {
+.joke-button {
 	/* background-image: url(/images/pix/pix-bg-sm-bw.gif); */
     border: 1px solid #999;
     display: inline-block;
@@ -44,14 +44,14 @@
 }
 
 
-.jokeTimer {
+.joke-timer {
     border: 1px solid #AAA;
 	position: relative;
 	/* height: 25px;
 	width: 100%; */
 }
 
-.jokeTimerSvg {
+.joke-timer-svg {
 	width: 100%;
 	height: 10px;
 	fill: rgb(190,190,190);

package/dist/components/general/nerdjoke.js

@@ -103,7 +103,7 @@ export function NerdJoke(props) {
             }
         };
     }, [loadJoke, startTimer]);
-    return (_jsx("div", { className: "nerdJoke", children: _jsxs("div", { className: "row-12col", children: [_jsx("div", { className: "grid-s1-e5", children: _jsx("div", { className: "left", children: _jsx(JokeButton, { clickFunction: pauseTimer, buttonText: "Pause ||  / Play >" }) }) }), _jsx("div", { className: "grid-s9-e13", children: _jsx("div", { className: "right", children: _jsx(JokeButton, { clickFunction: loadJoke, buttonText: "Next Joke ->" }) }) }), _jsx("div", { className: "jokeTimer grid-s1-e13", children: _jsxs("div", { className: "row-12col", children: [_jsx("div", { className: "grid-s1-e11", children: _jsx("svg", { className: "jokeTimerSvg", xmlns: "http://www.w3.org/2000/svg", children: _jsx("rect", { id: "jokeTimerPathElapsed" }) }) }), _jsx("div", { className: "grid-s11-e13 center", id: "jokeTimerLabel", children: formatTimeLeft(timeLeftRef.current) })] }) }), _jsxs("div", { className: "jokeText grid-s1-e13", children: [_jsxs("div", { children: [_jsx("span", { className: "label", children: "Q: " }), _jsxs("span", { className: "question", children: [" ", joke.question, " "] })] }), _jsxs("div", { children: [_jsx("span", { className: "label", children: "A: " }), _jsxs("span", { className: "answer", children: [" ", joke.answer, " "] })] })] })] }) }));
+    return (_jsx("div", { className: "nerd-joke", children: _jsxs("div", { className: "row-12col", children: [_jsx("div", { className: "grid-s1-e5", children: _jsx("div", { className: "left", children: _jsx(JokeButton, { clickFunction: pauseTimer, buttonText: "Pause ||  / Play >" }) }) }), _jsx("div", { className: "grid-s9-e13", children: _jsx("div", { className: "right", children: _jsx(JokeButton, { clickFunction: loadJoke, buttonText: "Next Joke ->" }) }) }), _jsx("div", { className: "joke-timer grid-s1-e13", children: _jsxs("div", { className: "row-12col", children: [_jsx("div", { className: "grid-s1-e11", children: _jsx("svg", { className: "joke-timer-svg", xmlns: "http://www.w3.org/2000/svg", children: _jsx("rect", { id: "jokeTimerPathElapsed" }) }) }), _jsx("div", { className: "grid-s11-e13 center", id: "jokeTimerLabel", children: formatTimeLeft(timeLeftRef.current) })] }) }), _jsxs("div", { className: "joke-text grid-s1-e13", children: [_jsxs("div", { children: [_jsx("span", { className: "label", children: "Q: " }), _jsxs("span", { className: "question", children: [" ", joke.question, " "] })] }), _jsxs("div", { children: [_jsx("span", { className: "label", children: "A: " }), _jsxs("span", { className: "answer", children: [" ", joke.answer, " "] })] })] })] }) }));
 }
 JokeButton.propTypes = {
     /** Click handler invoked when the button is pressed (e.g., pause or fetch next). */
@@ -115,5 +115,5 @@ function JokeButton(props) {
     /* <div className="jokeButton" onClick={props.clickFunction}>
             {props.buttonText}
         </div> */
-    return (_jsx("button", { className: "jokeButton", onClick: props.clickFunction, children: props.buttonText }));
+    return (_jsx("button", { className: "joke-button", onClick: props.clickFunction, children: props.buttonText }));
 }

package/dist/components/general/recipe.css

@@ -86,7 +86,7 @@
 ==========    BACK TO TOP    ==============
 ======================================== */
 
-.backToTop {
+.back-to-top {
 	background: #FFF;
 	border: 1px solid #CCC;
 	color: #000;

package/dist/components/general/recipe.js

@@ -259,5 +259,5 @@ export function BackToTop() {
         return false;
     }
     const config = usePixelatedConfig();
-    return (_jsx("div", { className: "backToTop", children: _jsxs("a", { href: "#top", onClick: scrollToTop, children: [_jsx("div", { children: _jsx(SmartImage, { src: "/images/icons/up.jpg", title: "Back To Top", alt: "Back To Top", cloudinaryEnv: config?.cloudinary?.product_env ?? undefined, cloudinaryDomain: config?.cloudinary?.baseUrl ?? undefined, cloudinaryTransforms: config?.cloudinary?.transforms ?? undefined }) }), _jsx("div", { children: "Back To Top" })] }) }));
+    return (_jsx("div", { className: "back-to-top", children: _jsxs("a", { href: "#top", onClick: scrollToTop, children: [_jsx("div", { children: _jsx(SmartImage, { src: "/images/icons/up.jpg", title: "Back To Top", alt: "Back To Top", cloudinaryEnv: config?.cloudinary?.product_env ?? undefined, cloudinaryDomain: config?.cloudinary?.baseUrl ?? undefined, cloudinaryTransforms: config?.cloudinary?.transforms ?? undefined }) }), _jsx("div", { children: "Back To Top" })] }) }));
 }

package/dist/components/general/semantic.js

@@ -243,7 +243,7 @@ export function PageGridItem({ id, className, columnSpan, rowSpan, columnStart,
     return (
     /* THIS IS AN OLD STYLE */
     /* <div className={"grid-item" + */
-    _jsx("div", { className: "gridItem" +
+    _jsx("div", { className: "grid-item" +
             (className ? ` ${className}` : '') +
             (columnStart && columnSpan && !columnEnd ? ` grid-s${columnStart}-w${columnSpan}` : '') +
             (columnStart && columnEnd && !columnSpan ? ` grid-s${columnStart}-e${columnEnd}` : ''), id: (id) ? id : undefined, style: itemStyle, children: children }));

package/dist/components/general/sidepanel.css

@@ -110,7 +110,7 @@
 .sidepanel-tab-label { display: none; }
 
 /* Integration overrides for MenuAccordion inside SidePanel */
-.sidepanel-content .accordionMenuWrapper {
+.sidepanel-content .accordion-menu-wrapper {
 	position: relative !important;
 	top: auto !important;
 	left: auto !important;
@@ -123,7 +123,7 @@
 }
 
 /* Ensure the inner list takes full width */
-.sidepanel-content .accordionMenu,
-.sidepanel-content .accordionMenu ul {
+.sidepanel-content .accordion-menu,
+.sidepanel-content .accordion-menu ul {
 	width: 100% !important;
 }

package/dist/components/general/skeleton.css

@@ -8,18 +8,18 @@
   min-height: 0;
 }
 
-.skeleton--animated {
+.skeleton-animated {
   animation: pulse 1.5s ease-in-out infinite;
 }
 
-.skeleton--avatar {
+.skeleton-avatar {
   width: 3rem;
   height: 3rem;
   border-radius: 9999px;
   display: inline-block;
 }
 
-.skeleton--rect {
+.skeleton-rect {
   display: block;
   width: 100%;
   height: 160px;
@@ -44,5 +44,5 @@
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .skeleton--animated { animation: none }
+  .skeleton-animated { animation: none }
 }

package/dist/components/general/skeleton.js

@@ -24,13 +24,13 @@ Skeleton.propTypes = {
     animated: PropTypes.bool,
 };
 export function Skeleton({ variant = 'text', lines = 1, width, height, animated = true, }) {
-    const base = `skeleton ${animated ? 'skeleton--animated' : ''}`;
+    const base = `skeleton ${animated ? 'skeleton-animated' : ''}`;
     if (variant === 'avatar') {
         const avatarStyle = width != null || height != null ? { ...(width != null ? { width } : {}), ...(height != null ? { height } : {}) } : undefined;
-        return _jsx("div", { "aria-hidden": "true", className: `${base} skeleton--avatar`, style: avatarStyle });
+        return _jsx("div", { "aria-hidden": "true", className: `${base} skeleton-avatar`, style: avatarStyle });
     }
     if (variant === 'rect') {
-        return (_jsx("div", { "aria-hidden": "true", className: `${base} skeleton--rect`, style: { width: width ?? '100%', height: height ?? 160 } }));
+        return (_jsx("div", { "aria-hidden": "true", className: `${base} skeleton-rect`, style: { width: width ?? '100%', height: height ?? 160 } }));
     }
     return (_jsx("div", { "aria-hidden": "true", className: "skeleton-text", children: Array.from({ length: Math.max(1, Number(lines || 1)) }).map((_, i) => (_jsx("div", { className: base + ' skeleton-line', style: { width: typeof width === 'number' ? `${width}%` : (width ?? (i === (lines || 1) - 1 ? '60%' : '100%')) } }, i))) }));
 }

package/dist/components/general/styleguide.js

@@ -24,8 +24,8 @@ export function StyleGuideUI(props) {
         const bodyFonts = getComputedStyle(document.documentElement).getPropertyValue("--body-font").trim();
         primaryBodyFont = bodyFonts.split(',')[0].replaceAll('"', '').replaceAll("'", '');
     }
-    return (_jsxs(_Fragment, { children: [_jsx(PageTitleHeader, { title: "Style Guide" }), _jsxs(PageSection, { columns: 1, maxWidth: "1024px", padding: "20px", id: "colors-section", children: [_jsx("h2", { children: "Color Palette" }), _jsxs("div", { style: { display: 'flex', gap: '10px', flexWrap: 'wrap' }, children: [_jsx("div", { style: { backgroundColor: 'var(--primary-color)', color: '#fff' }, className: "colorSwatch", children: "Primary Color" }), _jsx("div", { style: { backgroundColor: 'var(--secondary-color)' }, className: "colorSwatch", children: "Secondary Color" }), _jsx("div", { style: { backgroundColor: 'var(--accent1-color)' }, className: "colorSwatch", children: "Accent 1 Color" }), _jsx("div", { style: { backgroundColor: 'var(--accent2-color)' }, className: "colorSwatch", children: "Accent 2 Color" }), _jsx("div", { style: { backgroundColor: 'var(--bg-color)' }, className: "colorSwatch", children: "Background Color" }), _jsx("div", { style: { backgroundColor: 'var(--text-color)' }, className: "colorSwatch", children: "Text Color" })] })] }), _jsx("style", { children: `
-			.colorSwatch {
+    return (_jsxs(_Fragment, { children: [_jsx(PageTitleHeader, { title: "Style Guide" }), _jsxs(PageSection, { columns: 1, maxWidth: "1024px", padding: "20px", id: "colors-section", children: [_jsx("h2", { children: "Color Palette" }), _jsxs("div", { style: { display: 'flex', gap: '10px', flexWrap: 'wrap' }, children: [_jsx("div", { style: { backgroundColor: 'var(--primary-color)', color: '#fff' }, className: "color-swatch", children: "Primary Color" }), _jsx("div", { style: { backgroundColor: 'var(--secondary-color)' }, className: "color-swatch", children: "Secondary Color" }), _jsx("div", { style: { backgroundColor: 'var(--accent1-color)' }, className: "color-swatch", children: "Accent 1 Color" }), _jsx("div", { style: { backgroundColor: 'var(--accent2-color)' }, className: "color-swatch", children: "Accent 2 Color" }), _jsx("div", { style: { backgroundColor: 'var(--bg-color)' }, className: "color-swatch", children: "Background Color" }), _jsx("div", { style: { backgroundColor: 'var(--text-color)' }, className: "color-swatch", children: "Text Color" })] })] }), _jsx("style", { children: `
+			.color-swatch {
 				color: #000; 
 				border: 1px solid #ccc; 
 				padding: 10px; 

package/dist/components/general/table.css

@@ -1,13 +1,13 @@
-table.pixTable, .pixTable th, .pixTable tr, .pixTable td {
+table.pix-table, .pix-table th, .pix-table tr, .pix-table td {
 	border : 1px solid #ccc ;
 	text-align: left;
 }
 
-table.pixTable {
+table.pix-table {
 	width: 100%
 }
 
-table.pixTable {
+table.pix-table {
 	th {
 		text-transform: uppercase;
 		font-size: 1.2em;
@@ -60,14 +60,14 @@ dialog {
 }
 
 
-.sortArrow {
+.sort-arrow {
 	display: inline-block;
 	margin-left: 5px;
 	font-size: 0.8em;
 }
-.sortArrow.asc::before {
+.sort-arrow.asc::before {
 	content: '▲'; /* Up arrow for ascending */
 }
-.sortArrow.desc::before {
+.sort-arrow.desc::before {
 	content: '▼'; /* Down arrow for descending */
 }

package/dist/components/general/table.js

@@ -38,7 +38,7 @@ export function Table(props) {
     function getHeadings(data) {
         const headings = Object.keys(data[0]).map((key, i) => {
             return (props.sortable && props.sortable == true)
-                ? _jsxs("th", { onClick: () => { sortTable(key); }, children: [_jsx("span", { children: key }), " ", _jsx("span", { className: "sortArrow" })] }, i)
+                ? _jsxs("th", { onClick: () => { sortTable(key); }, children: [_jsx("span", { children: key }), " ", _jsx("span", { className: "sort-arrow" })] }, i)
                 : _jsx("th", { children: _jsx("span", { children: key }) }, i);
         });
         return _jsx("tr", { children: headings });
@@ -96,7 +96,7 @@ export function Table(props) {
         return (myHeader);
     }
     function getDirection(header) {
-        const arrow = header.querySelector('.sortArrow');
+        const arrow = header.querySelector('.sort-arrow');
         let oldDirection = '';
         if (arrow) {
             const oldClassList = arrow.classList;
@@ -113,7 +113,7 @@ export function Table(props) {
         const table = document.getElementById(props.id);
         const headers = table.querySelectorAll('th');
         headers.forEach(header => {
-            const arrow = header.querySelector('.sortArrow');
+            const arrow = header.querySelector('.sort-arrow');
             if (arrow) {
                 arrow.classList.remove('asc', 'desc');
             }
@@ -121,7 +121,7 @@ export function Table(props) {
     }
     function updateArrow(column, oldDirection) {
         const header = getHeader(column);
-        const arrow = header.querySelector('.sortArrow');
+        const arrow = header.querySelector('.sort-arrow');
         if (arrow) {
             if (oldDirection == 'asc') {
                 arrow.classList.add('desc');
@@ -146,6 +146,6 @@ export function Table(props) {
             updateArrow(column, oldDirection);
         }
     }
-    return (_jsx("div", { children: _jsxs("table", { id: props.id ?? undefined, className: "pixTable", children: [_jsx("thead", { children: getHeadings(tableData) }), _jsx("tbody", { children: getRows(tableData) })] }) }));
+    return (_jsx("div", { children: _jsxs("table", { id: props.id ?? undefined, className: "pix-table", children: [_jsx("thead", { children: getHeadings(tableData) }), _jsx("tbody", { children: getRows(tableData) })] }) }));
 }
 ;

package/dist/components/general/tiles.js

@@ -1,3 +1,4 @@
+/* eslint-disable pixelated/class-name-kebab-case */
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import PropTypes from "prop-types";
@@ -32,7 +33,7 @@ Tiles.propTypes = {
 export function Tiles(props) {
     const rowCount = props.rowCount ?? 2;
     if (props.cards && props.cards.length > 0) {
-        return (_jsx("div", { className: "tiles-container", children: _jsx("div", { className: `tile-container row-${rowCount}col`, children: props.cards.map((card, i) => (_jsx("div", { className: "gridItem", children: _jsx(Tile, { index: i, cardLength: props.cards.length, link: card.link, image: card.image, imageAlt: card.imageAlt, bodyText: card.bodyText, imgClick: props.imgClick, variant: (props.variant ?? "overlay") }) }, i))) }) }));
+        return (_jsx("div", { className: "tiles-container", children: _jsx("div", { className: `tile-container row-${rowCount}col`, children: props.cards.map((card, i) => (_jsx("div", { className: "grid-item", children: _jsx(Tile, { index: i, cardLength: props.cards.length, link: card.link, image: card.image, imageAlt: card.imageAlt, bodyText: card.bodyText, imgClick: props.imgClick, variant: (props.variant ?? "overlay") }) }, i))) }) }));
     }
     else {
         return (_jsx(Loading, {}));
@@ -76,7 +77,7 @@ function Tile(props) {
     const tileBody = _jsxs("div", { className: "tile-image" + (imgClick ? " clickable" : ""), children: [_jsx(SmartImage, { src: props.image, title: props?.imageAlt ?? undefined, alt: props?.imageAlt ?? "", onClick: imgClick ? (event) => imgClick(event, props.image) : undefined, cloudinaryEnv: config?.cloudinary?.product_env ?? undefined }), _jsx("div", { className: "tile-image-overlay", children: _jsxs("div", { className: "tile-image-overlay-text", children: [_jsx("div", { className: "tile-image-overlay-title", children: props.imageAlt }), _jsx("div", { className: "tile-image-overlay-body", children: props.bodyText })] }) })] });
     const rootClass = `tile${(props.variant) ? ' ' + props.variant : ''}`;
     return (_jsx("div", { className: rootClass, id: 'tile-' + props.index, children: props.link ?
-            _jsx("a", { href: props.link, className: "tileLink", children: tileBody })
+            _jsx("a", { href: props.link, className: "tile-link", children: tileBody })
             :
                 tileBody }));
 }

package/dist/components/general/well-known.js

@@ -0,0 +1,137 @@
+import PropTypes from 'prop-types';
+import { readFile } from 'fs/promises';
+import crypto from 'crypto';
+import { NextResponse } from 'next/server';
+import { flattenRoutes } from './sitemap';
+/* ===== Shared helpers for .well-known files ===== */
+/**
+ * Read JSON from disk safely — returns null on error. Exported for testing.
+ */
+export async function safeJSON(path) {
+    try {
+        const raw = await readFile(path, 'utf8');
+        return JSON.parse(raw);
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * Normalize a value into a single-line trimmed string (safe for humans.txt / security.txt).
+ * Exported for testing.
+ */
+export function sanitizeString(v) {
+    return v == null ? '' : String(v).replace(/\s+/g, ' ').trim();
+}
+/**
+ * Build a plain-text response payload including ETag and standard headers.
+ * Exported for testing and reuse across .well-known generators.
+ */
+export function createTextResponsePayload(body) {
+    const etag = crypto.createHash('sha1').update(body).digest('hex');
+    const headers = {
+        'Content-Type': 'text/plain; charset=utf-8',
+        'Cache-Control': 'public, max-age=60, stale-while-revalidate=3600',
+        ETag: etag,
+    };
+    return { body, etag, headers };
+}
+/* ========== HUMANS.TXT ========== */
+generateHumansTxt.propTypes = {
+    /** base directory to read package.json / routes.json from (defaults to process.cwd()) */
+    cwd: PropTypes.string,
+    /** optional package.json object (if provided, fs is not used) */
+    pkg: PropTypes.object,
+    /** optional routes.json object (if provided, fs is not used) */
+    routesJson: PropTypes.object,
+    /** limit how many routes to include (default 50) */
+    maxRoutes: PropTypes.number,
+};
+export async function generateHumansTxt(opts = {}) {
+    const cwd = opts.cwd ?? process.cwd();
+    const pkg = opts.pkg ?? (await safeJSON(cwd + '/package.json')) ?? {};
+    const data = opts.routesJson ?? (await safeJSON(cwd + '/src/app/data/routes.json')) ?? {};
+    const site = data.siteInfo ?? {};
+    const routes = Array.isArray(data.routes) ? data.routes : [];
+    const lines = [
+        '/* HUMAN-READABLE SITE INFORMATION - generated at runtime */',
+        '',
+        '/* AUTHOR */',
+        `   Author Name: ${sanitizeString(site.author ?? '')}`,
+        `   Author Address: ${sanitizeString(site.address
+            ? [
+                site.address.streetAddress,
+                site.address.addressLocality,
+                site.address.addressRegion,
+                site.address.postalCode,
+                site.address.addressCountry,
+            ]
+                .filter(Boolean)
+                .join(' ')
+            : '')}`,
+        `   Author Email: ${sanitizeString(site.email ?? '')}`,
+        `   Author Telephone: ${sanitizeString(site.telephone ?? '')}`,
+        '',
+        '/* DEVELOPER */',
+        `   Developer Name: Brian Whaley`,
+        `   Developer Company: Pixelated Technologies LLC`,
+        `   Developer Address: 10 Jade Circle, Denville NJ 07834 USA`,
+        `   Developer Email: brian@pixelated.tech`,
+        `   Developer Website: https://www.pixelated.tech`,
+        `   Developer Telephone: +1 (973) 722-2601`,
+        '',
+        '/* SITE */',
+        `   Site Name: ${sanitizeString(site.name ?? '')}`,
+        `   Site Package Name: ${sanitizeString(pkg.name ?? '')}`,
+        `   Site Package Version: ${sanitizeString(pkg.version ?? '')}`,
+        `   Site URL: ${sanitizeString(site.url ?? '')}`,
+        `   Site Languages: React, Node, NextJS, JavaScript, HTML5, CSS3, SASS `,
+        `   Site Tools: VSCode, GitHub, AWS, Contently, Cloudinary, Wordpress, Google Analytics, Google Search Console`,
+        `   Site Pages: (${routes.length})`,
+    ];
+    const limit = typeof opts.maxRoutes === 'number' ? opts.maxRoutes : 50;
+    for (const r of flattenRoutes(routes).slice(0, limit)) {
+        lines.push(`      - ${sanitizeString(r.path ?? r.pathname ?? r.url ?? '')} - ${sanitizeString(r.title ?? '')}`);
+    }
+    const body = lines.join('\n');
+    return createTextResponsePayload(body);
+}
+/* ========== SECURITY.TXT ========== */
+generateSecurityTxt.propTypes = {
+    routesJson: PropTypes.object,
+};
+export async function generateSecurityTxt(props = {}) {
+    const data = props.routesJson ?? (await safeJSON(process.cwd() + '/src/app/data/routes.json')) ?? {};
+    const siteInfo = data.siteInfo ?? {};
+    const lines = [
+        '# Contact methods for security researchers',
+        `Contact: mailto:${sanitizeString(siteInfo.email ?? '')}`,
+        '',
+        "# Link to your vulnerability disclosure policy",
+        'Policy: ',
+        '',
+        "# Link to your PGP public key for encrypted communication",
+        'Encryption: ',
+        '',
+        "# Languages supported",
+        'Preferred-Languages: en',
+        '',
+        "# Date and time the file should be considered stale",
+        `Expires: ${new Date(new Date().getFullYear(), 11, 31).toISOString()}`,
+    ];
+    const body = lines.join('\n');
+    return createTextResponsePayload(body);
+}
+/* ========== Convenience helper ========== */
+/**
+ * Create a response for a well-known resource.
+ * @param {'humans'|'security'} type - Which resource to generate ('humans' | 'security').
+ */
+export async function createWellKnownResponse(type, req, opts = {}) {
+    const payload = (type === 'humans') ? await generateHumansTxt(opts) : await generateSecurityTxt(opts);
+    const { body, etag, headers } = payload;
+    if (req?.headers?.get && req.headers.get('if-none-match') === etag) {
+        return new NextResponse(null, { status: 304, headers });
+    }
+    return new NextResponse(body, { status: 200, headers });
+}

package/dist/components/integrations/contentful.management.js

@@ -7,11 +7,11 @@
  * List all entries of a specific content type
  */
 export async function listEntries(contentType, config) {
-    const { spaceId, accessToken, environment = 'master' } = config;
+    const { space_id, delivery_access_token, environment = 'master' } = config;
     try {
-        const response = await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries?content_type=${contentType}`, {
+        const response = await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries?content_type=${contentType}`, {
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'Content-Type': 'application/json',
             },
         });
@@ -37,11 +37,11 @@ export async function listEntries(contentType, config) {
  * Get a single entry by ID
  */
 export async function getEntryById(entryId, config) {
-    const { spaceId, accessToken, environment = 'master' } = config;
+    const { space_id, delivery_access_token, environment = 'master' } = config;
     try {
-        const response = await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries/${entryId}`, {
+        const response = await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries/${entryId}`, {
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'Content-Type': 'application/json',
             },
         });
@@ -71,11 +71,11 @@ export async function getEntryById(entryId, config) {
  * Search for entries by field value
  */
 export async function searchEntriesByField(contentType, fieldName, fieldValue, config) {
-    const { spaceId, accessToken, environment = 'master' } = config;
+    const { space_id, delivery_access_token, environment = 'master' } = config;
     try {
-        const response = await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries?content_type=${contentType}&fields.${fieldName}=${encodeURIComponent(fieldValue)}`, {
+        const response = await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries?content_type=${contentType}&fields.${fieldName}=${encodeURIComponent(fieldValue)}`, {
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'Content-Type': 'application/json',
             },
         });
@@ -101,17 +101,17 @@ export async function searchEntriesByField(contentType, fieldName, fieldValue, c
  * Create a new entry
  */
 export async function createEntry(contentType, fields, config, autoPublish = true) {
-    const { spaceId, accessToken, environment = 'master' } = config;
+    const { space_id, delivery_access_token, environment = 'master' } = config;
     try {
         // Convert fields to Contentful format (with 'en-US' locale)
         const contentfulFields = {};
         for (const [key, value] of Object.entries(fields)) {
             contentfulFields[key] = { 'en-US': value };
         }
-        const createResponse = await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries`, {
+        const createResponse = await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries`, {
             method: 'POST',
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'Content-Type': 'application/vnd.contentful.management.v1+json',
                 'X-Contentful-Content-Type': contentType,
             },
@@ -126,10 +126,10 @@ export async function createEntry(contentType, fields, config, autoPublish = tru
         const newEntry = await createResponse.json();
         // Publish if requested
         if (autoPublish) {
-            await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries/${newEntry.sys.id}/published`, {
+            await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries/${newEntry.sys.id}/published`, {
                 method: 'PUT',
                 headers: {
-                    'Authorization': `Bearer ${accessToken}`,
+                    'Authorization': `Bearer ${delivery_access_token}`,
                     'X-Contentful-Version': newEntry.sys.version.toString(),
                 },
             });
@@ -151,7 +151,7 @@ export async function createEntry(contentType, fields, config, autoPublish = tru
  * Update an existing entry
  */
 export async function updateEntry(entryId, fields, config, autoPublish = true) {
-    const { spaceId, accessToken, environment = 'master' } = config;
+    const { space_id, delivery_access_token, environment = 'master' } = config;
     try {
         // Get current entry to get version
         const getResponse = await getEntryById(entryId, config);
@@ -167,10 +167,10 @@ export async function updateEntry(entryId, fields, config, autoPublish = true) {
         for (const [key, value] of Object.entries(fields)) {
             contentfulFields[key] = { 'en-US': value };
         }
-        const updateResponse = await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries/${entryId}`, {
+        const updateResponse = await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries/${entryId}`, {
             method: 'PUT',
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'Content-Type': 'application/vnd.contentful.management.v1+json',
                 'X-Contentful-Version': currentEntry.sys.version.toString(),
             },
@@ -185,10 +185,10 @@ export async function updateEntry(entryId, fields, config, autoPublish = true) {
         const updatedEntry = await updateResponse.json();
         // Publish if requested
         if (autoPublish) {
-            await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries/${entryId}/published`, {
+            await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries/${entryId}/published`, {
                 method: 'PUT',
                 headers: {
-                    'Authorization': `Bearer ${accessToken}`,
+                    'Authorization': `Bearer ${delivery_access_token}`,
                     'X-Contentful-Version': updatedEntry.sys.version.toString(),
                 },
             });
@@ -210,7 +210,7 @@ export async function updateEntry(entryId, fields, config, autoPublish = true) {
  * Delete an entry (unpublish first, then delete)
  */
 export async function deleteEntry(entryId, config) {
-    const { spaceId, accessToken, environment = 'master' } = config;
+    const { space_id, delivery_access_token, environment = 'master' } = config;
     try {
         // Get current entry to get version
         const getResponse = await getEntryById(entryId, config);
@@ -222,18 +222,18 @@ export async function deleteEntry(entryId, config) {
         }
         const entry = getResponse.entry;
         // Unpublish first
-        await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries/${entryId}/published`, {
-            method: 'DELETE',
+        await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries/${entry.sys.id}/published`, {
+            method: 'PUT',
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'X-Contentful-Version': entry.sys.version.toString(),
             },
         });
         // Delete the entry
-        const deleteResponse = await fetch(`https://api.contentful.com/spaces/${spaceId}/environments/${environment}/entries/${entryId}`, {
+        const deleteResponse = await fetch(`https://api.contentful.com/spaces/${space_id}/environments/${environment}/entries/${entryId}`, {
             method: 'DELETE',
             headers: {
-                'Authorization': `Bearer ${accessToken}`,
+                'Authorization': `Bearer ${delivery_access_token}`,
                 'X-Contentful-Version': (entry.sys.version + 1).toString(),
             },
         });