@pixelated-tech/components 3.11.2 → 3.11.4

package/README.md

@@ -85,8 +85,8 @@ Pixelated Components is committed to creating inclusive web experiences. All com
 ## 📦 Installation & Setup
 
 ### Requirements
-- **React**: 18.0 or higher
-- **Next.js**: 13.0 or higher (recommended)
+- **React**: 19.0 or higher
+- **Next.js**: 16.0 or higher
 - **Node.js**: 18.0 or higher
 - **TypeScript**: 4.9 or higher (optional, but recommended)
 
@@ -105,10 +105,10 @@ pnpm add @pixelated-tech/components
 
 ### Peer Dependencies
 
-This library requires the following peer dependencies (install if not already present):
+This library requires the following peer dependencies (install if not already present). Versions in examples match the package's peerDependency policy:
 
 ```bash
-npm install react react-dom prop-types
+npm install react@^19 react-dom@^19 next@^16 prop-types
 ```
 
 ### TypeScript Support
@@ -162,86 +162,12 @@ npm run dev
 
 Visit `http://localhost:3006` to explore the admin interface and see components in action.
 
-### General Components
-Reusable UI components for common patterns:
-- **Accordion** - Expandable content sections using native `<details>` elements
-- **Callout** - Flexible content highlight blocks with image support
-- **CSS** - Dynamic CSS utilities and styling helpers
-- **Image** - Advanced image component with lazy loading and optimization
-- **Loading** - Progress indicators and loading states
-- **MicroInteractions** - Subtle animations and interaction effects
-- **Modal** - Dialog overlays and popups
-- **Semantic** - Semantic HTML structure components
-- **SidePanel** - Slide-out panel component for additional content
-- **Table** - Data display and table components
-
-### CMS Integration
-Headless CMS and content management components:
-- **WordPress** - Blog post integration and display with automatic Photon CDN URL processing
-- **Contentful** - Headless CMS components and utilities with delivery and management APIs
-- **PageBuilder** - Dynamic page construction from JSON
-- **PageEngine** - Advanced page rendering with Contentful integration
-
-### UI Components
-User interface and interaction components:
-- **Carousel** - Image and content sliders (Hero, Reviews, Portfolio)
-- **Forms** - Form builder, validation, and emailer components
-- **FormBuilder** - Advanced form construction and configuration
-- **FormComponents** - Individual form field components and utilities
-- **FormEngine** - Form rendering and processing engine
-- **Menu** - Navigation components (Simple, Accordion, Expando)
-- **Tab** - Tabbed interface component for organizing content
-- **Tiles** - Image grid and tile layouts
-- **FontSelector** - Font selection and Google Fonts integration
-- **CompoundFontSelector** - Advanced font selection with multiple font families
-
-### Development Tools
-Components for development, configuration, and site building:
-- **ComponentPropertiesForm** - Form for editing component properties
-- **ComponentSelector** - Component selection interface
-- **ComponentTree** - Visual component hierarchy display
-- **ConfigBuilder** - Interactive configuration builder for site settings, metadata, routes, and visual design tokens
-- **ConfigEngine** - Configuration processing and validation engine
-- **PageBuilderUI** - User interface for page building
-- **SaveLoadSection** - Save and load functionality for configurations
-
-### SEO & Schema
-Search engine optimization and structured data:
-- **404** - Custom 404 error page component
-- **FAQAccordion** - Interactive FAQ component with schema.org markup and search
-- **GoogleAnalytics** - Google Analytics integration
-- **GoogleMap** - Interactive Google Maps component
-- **GoogleSearch** - Google Custom Search integration
-- **JSON-LD** - Structured data schemas (LocalBusiness, Recipe, BlogPosting, etc.)
-- **Manifest** - Web app manifest generation
-- **MetaTags** - Dynamic meta tag injection
-- **SchemaBlogPosting** - Blog post structured data
-- **SchemaLocalBusiness** - Local business structured data
-- **SchemaRecipe** - Recipe structured data
-- **SchemaServices** - Services structured data
-- **SchemaWebsite** - Website structured data
-- **Sitemap** - XML sitemap generation
-- **Social Cards** - Open Graph and Twitter card generation
-- **BuzzwordBingo** - Interactive buzzword bingo game
-- **Markdown** - Markdown rendering component
-- **Recipe** - Recipe display component
-- **Resume** - Resume/CV display component
-- **Timeline** - Timeline visualization component
-
-### Third-Party Integrations
-External service integrations:
-- **Calendly** - Scheduling and appointment booking
-- **Cloudinary** - Image optimization and delivery
-- **GoogleReviews** - Google business reviews integration
-- **Gravatar** - User avatar integration
-- **HubSpot** - CRM and marketing automation
-- **Instagram** - Social media image integration
-- **Flickr** - Photo sharing integration
-- **PayPal** - Payment processing
-- **ShoppingCart** - E-commerce shopping cart functionality
-- **eBay** - Store listings and shopping cart
-- **NerdJokes** - Entertainment content integration
-- **Yelp** - Business reviews and ratings
+### Component index
+The full component index and API reference live in `docs/components.md` (single source-of-truth). For interactive exploration, run Storybook: `npm run storybook`.
+
+- Quick link: [Component API reference](docs/components.md)
+
+If you want to browse individual components interactively, run Storybook: `npm run storybook`.
 
 
 ### Utilities
@@ -268,28 +194,6 @@ Comprehensive site health monitoring and analytics:
 - **SiteHealthDependencyVulnerabilities** - Dependency security scanning
 
 
-## 🎨 Visual Design Configuration
-
-The ConfigBuilder now includes a **Visual Design** tab that allows users to configure visual design tokens such as colors, fonts, spacing, and other design system variables. These tokens are stored in the `routes.json` file under the `visualdesign` object and can be used throughout your application for consistent theming.
-
-### Features:
-- **Color Management**: Primary, secondary, accent colors with color picker inputs
-- **Typography**: Font family and base font size settings
-- **Spacing & Layout**: Border radius, box shadows, transitions
-- **Form-Based Editing**: User-friendly form interface powered by FormEngine
-- **JSON Storage**: Design tokens stored as flattened key-value pairs in routes.json
-
-### Usage:
-```tsx
-import { ConfigBuilder } from '@pixelated-tech/components';
-
-function MyConfigPage() {
-  return <ConfigBuilder />;
-}
-```
-
-The visual design tokens can be accessed in your components via the config context or directly from the routes.json file.
-
 
 ## � Quick Start
 
@@ -336,6 +240,13 @@ See our detailed [Roadmap](docs/roadmap.md) for planned improvements and refacto
 
 See our comprehensive [Testing Documentation](docs/testing.md) for test coverage, setup, and strategies.
 
+Quick conventions:
+- Unit & integration tests → `src/tests` (filename: `*.test.{ts,tsx}`)
+- Shared harnesses / fixtures → `src/test`
+- Storybook stories & `play()` tests → `src/stories` (run with `npm run storybook`)
+
+Following these locations keeps CI discovery and story-driven QA consistent across the monorepo.
+
 
 <!-- CONTRIBUTING -->
 ## Contributing

package/dist/components/admin/site-health/site-health-axe-core.integration.js

@@ -2,6 +2,7 @@
 import puppeteer from 'puppeteer';
 import fs from 'fs';
 import path from 'path';
+import { getFullPixelatedConfig } from '../../config/config';
 const debug = false;
 export async function performAxeCoreAnalysis(url, runtime_env = 'auto') {
     try {
@@ -66,7 +67,6 @@ export async function performAxeCoreAnalysis(url, runtime_env = 'auto') {
         };
     }
 }
-import { getFullPixelatedConfig } from '../../config/config';
 /**
  * runAxeCoreAnalysis(url, runtime_env)
  *

package/dist/components/admin/site-health/site-health-github.integration.js

@@ -1,7 +1,6 @@
 "use server";
 import { getFullPixelatedConfig } from '../../config/config';
 import path from 'path';
-// Version extraction: we derive a version from commit messages (e.g., v1.2.3) instead of fetching tags and fuzzy-matching.
 // Debug logging is off by default. Set to true/false here (do not use env vars).
 const debug = false;
 /**

package/dist/components/general/tiles.css

@@ -11,12 +11,9 @@
 }
 
 .tile-image {
-    position: relative;
-    aspect-ratio: 1;
     border: 2px solid #CCC;
     /* border-radius: 20px; */
     overflow: hidden;
-    margin: 10px;
 }
 
 .tile-image.clickable { 
@@ -26,23 +23,11 @@
 .tile-image img {
     width: 100%;
     height: 100% !important;
-    position: relative;
-    display: inline-block;
     align-self: start;
     object-fit: cover;
 }
 
 .tile-image-overlay {
-    visibility: hidden;
-    position: absolute;
-    width: 0%;
-    height: 100%;
-    bottom: 0;
-    left: 0;
-    display: inline-block;
-    background: rgba(51, 102, 153, .7);
-    transition: all 0.25s ease-in-out;
-    /* All other styling - see example */
     img {
         vertical-align: top; /* Default is baseline, this fixes a common alignment issue */
     }
@@ -54,27 +39,10 @@
 	cursor: pointer;
 }
 
-.tile-image:hover .tile-image-overlay {
-    visibility: visible;
-    width: 100% !important;
-}
-
 .tile-image-overlay-text {
-    position: absolute;
     padding: 20px;
-    left: 0;
-    bottom: 0;
-    color: white;
     font-size: 20px;
     font-weight: bold;
-    visibility: hidden;
-    transition: visibility 0s ease-in-out;
-    transition-delay: 0s; 
-}
-
-.tile-image:hover .tile-image-overlay-text {
-    visibility: visible;
-    transition-delay: 0.25s; 
 }
 
 .tile-image-overlay-title {
@@ -85,3 +53,135 @@
     font-size: 16px;
     font-weight: initial;
 }
+
+
+
+
+/* ====== OVERLAY VARIANT (CSS-only) ======
+   - Applied by adding `variant="overlay"` to <Tiles/> (adds `.overlay` to each `.tile`)
+*/
+
+.tile.overlay {
+
+	.tile-image {
+		position: relative;
+		aspect-ratio: 1;
+		margin: 10px;
+	}
+
+	.tile-image img {
+		width: 100%;
+		height: 100% !important;
+		position: relative;
+		display: inline-block;
+		align-self: start;
+		object-fit: cover;
+	}
+
+	.tile-image-overlay {
+		visibility: hidden;
+		position: absolute;
+		width: 0%;
+		height: 100%;
+		bottom: 0;
+		left: 0;
+		display: inline-block;
+		background: rgba(51, 102, 153, .7);
+		transition: all 0.25s ease-in-out;
+		/* All other styling - see example */
+		img {
+			vertical-align: top; /* Default is baseline, this fixes a common alignment issue */
+		}
+	}
+
+	.tile-image:hover .tile-image-overlay {
+		visibility: visible;
+		width: 100% !important;
+	}
+
+	.tile-image-overlay-text {
+		position: absolute;
+		padding: 20px;
+		left: 0;
+		bottom: 0;
+		color: white;
+		font-size: 20px;
+		font-weight: bold;
+		visibility: hidden;
+		transition: visibility 0s ease-in-out;
+		transition-delay: 0s; 
+	}
+
+	.tile-image:hover .tile-image-overlay-text {
+		visibility: visible;
+		transition-delay: 0.25s; 
+	}
+
+	.tile-image-overlay-title {
+		margin-bottom: 10px;
+	}
+
+	.tile-image-overlay-body{
+		font-size: 16px;
+		font-weight: initial;
+	}
+}
+
+
+
+
+
+
+/* ====== CAPTION VARIANT (CSS-only) ======
+   - Applied by adding `variant="caption"` to <Tiles/> (adds `.caption` to each `.tile`)
+*/
+.tile.caption {
+	* { 
+		visibility: visible;
+		display: block;
+		position: relative;
+	}
+
+	.tile-image {
+		aspect-ratio: auto;
+		border-radius: 10px;
+	}
+
+	.tile-image img {
+		width: 100%;
+    	height: 100% !important;
+		align-self: start;
+		object-fit: cover;
+		aspect-ratio: 1;
+	}
+
+	.tile-image-overlay {
+		background-color: #EEEEEE;
+		height: 100px !important;
+	}
+
+	.tile-image-overlay, 
+	.tile-image-overlay * {
+		width: 100% !important;
+		height: auto;
+		transition: none;
+	}
+
+	.tile-image-overlay-title {
+		margin-bottom: 0px;
+		color: black;
+	}
+
+	.tile-image-overlay-text {
+		transition: none;
+		color: black;
+		padding: 10px;
+	}
+
+	.tile-image-overlay-body{
+		font-size: var(--font-size-base);
+		font-weight: bold;
+		color: black;
+	}
+
+}

package/dist/components/general/tiles.js

@@ -6,15 +6,21 @@ import { SmartImage } from "./smartimage";
 import { usePixelatedConfig } from '../config/config.client';
 import "../../css/pixelated.grid.scss";
 import "./tiles.css";
+export const TilesVariants = ['caption', 'overlay'];
 Tiles.propTypes = {
     cards: PropTypes.array.isRequired,
     rowCount: PropTypes.number,
     imgClick: PropTypes.func,
+    /**
+     * Optional visual variant. Allowed values are enumerated so consumers get
+     * a discoverable, typed API.
+     */
+    variant: PropTypes.oneOf(TilesVariants),
 };
 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 }) }, 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: "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))) }) }));
     }
     else {
         return (_jsx(Loading, {}));
@@ -29,12 +35,16 @@ Tile.propTypes = {
     imageAlt: PropTypes.string,
     bodyText: PropTypes.string,
     imgClick: PropTypes.func,
+    /** 'caption' - visual caption beneath image (prefers bodyText, falls back to imageAlt) */
+    variant: PropTypes.oneOf(TilesVariants),
 };
 function Tile(props) {
     const config = usePixelatedConfig();
     const imgClick = props.imgClick;
+    const captionText = (props.bodyText && props.bodyText.length > 0) ? props.bodyText : (props.imageAlt ?? "");
     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 })] }) })] });
-    return (_jsx("div", { className: "tile", id: 'tile-' + props.index, children: props.link ?
+    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 })
             :
                 tileBody }));

package/dist/components/sitebuilder/form/formbuilder.js

@@ -3,8 +3,9 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState } from 'react';
 import PropTypes from 'prop-types';
 import * as FC from './formcomponents';
-import { mapTypeToComponent, generateTypeField, debug } from './formutils';
+import { mapTypeToComponent, generateTypeField } from './formutils';
 import { FormEngine } from './formengine';
+const debug = false;
 /* =====  FORM BUILDER =====
 Display all the components for a Form Builder -
 Element Buttons, Element Details, and the Form */

package/dist/components/sitebuilder/form/formextractor.js

@@ -3,8 +3,9 @@ import { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import * as FC from './formcomponents';
 import * as FVF from './formfieldvalidations';
-import { capitalize, attributeMap, debug } from './formutils';
+import { capitalize, attributeMap } from './formutils';
 import { FormEngine } from './formengine';
+const debug = false;
 /*
 ===== FORM EXTRACT =====
 Submit a page URL of a form to extract all form elements and

package/dist/components/sitebuilder/form/formutils.js

@@ -1,6 +1,6 @@
 // Shared utility functions for form components
 import { generateKey, capitalize, attributeMap } from '../../general/utilities';
-export const debug = false;
+const debug = false;
 /**
  * Maps input type to form component name
  */
@@ -18,8 +18,19 @@ export function mapTypeToComponent(myType) {
 }
 /**
  * Generates field JSON for form building
+ *
+ * NOTE: This implementation is currently unused by other modules in-repo and
+ * is exported by the package barrel which previously caused a duplicate
+ * export collision with `componentGeneration.generateFieldJSON` during
+ * Storybook's webpack build. To avoid accidental breakage for external
+ * consumers we are making this implementation internal (non-exported)
+ * and marking it for removal in a future maintenance sweep.
+ *
+ * TODO (cleanup): remove this function and any remaining aliases once
+ * consumers have migrated — see `docs/roadmap.md` (Refactoring & Cleanup).
+ * @deprecated internal-only — slated for removal
  */
-export function generateFieldJSON(component, type) {
+function generateFieldJSON(component, type) {
     const form = {};
     form.fields = [];
     // Common fields for all components

package/dist/config/pixelated.config.json.enc

@@ -1 +1 @@
-pxl:v1:9b93a0054684e42a36e1bf4c:4349f4740c87bf559c74977e3384cc2a:76c5d9a21ff4b084598fe6b4b3a16e882e1791a7684ce0d84c779c1618f3e58b4e313e92ebf9a65343d9d3d6742fdbe39235b350ad2dec57fc4d40e61f763b383e156f194f2e9d4c0722c0888dcc1d72243993f6967bef84e373d6872ba68def35a13bf92be5dea221982ef82d6bb629dd9620bd5fa7021e1947f73e4c781918107eec08cf57c8245ec08f9dcfedf41d7caca6f17e58c51d529b86a2b443e7c75a606c90bff2ae26bc5311741f531b6c02335d65c41b94458c0379470ead213b99569fe8e37d8e390c392792901e1e092e1ccbad533b636f0e0ec22c78856c404f487a85205f1506d7fafc651dd0cf5cb5916a8bd9f245dbf24d4b830beb6788c8d3ac50e547138bed3f814cc7200d6a625af83c7b1cd809d0f586376dd8c324ca702bc7f9c63f6552d7e122d3d0d3fb3b3fa09c222b65079882a3b6ec4e3678c152d98ffbe0d2808c5124c63ed86d64ecfc01a443c7401d28585a0a4344909758ae34f32ca9a773e19706517b3116dd66a70da629cc577cc7d82b268846c6e1afdb4a6e93ed6157345a15508dd15cfab86adc6effb40136b0d427410d25d2e44e477d35b19f599ac247f6e774ed6c5686092a7529b8901e1b925d9302219bed92a395a22090887e333e785ed66be1b5472cd8f673b7aa383be6385d1c8112c49ea85f0829969a11a59d6e52403a8b83e189f64409ca408ee045a9e6f9a6a9b83c69d108b8e6f93fbd417ac80ee8fab2b08183c93582871f155623c0adcd0711df3e8d52b195deeb7581ac4e12be304a1accee35ef8b1ffb32f460b2afba7ff5193b009ed1172c08d111e9ca6d6b7532a5c40ac8dd2316ec7dd4a82ed90837afbc96e6289cf442d9b14ac2183c4aded31bb88adfdc7935289493806e21566abf26f96e82ab633e70ae88b0fbf263d16e2bb97dcf85b7d1ea4254c3037bbbe006060ff415f5021bbd18c94379b7de8346aa91b962637fe2c783a2b314d6b729149be633b1f6ce3b3bc652b86fba4064bda7ec00d32c686fe85cc8552004b409dbfce9bcd266ca7e05d00b93f8c6b6bd9d7fb8c2ed68ecf986d1493528d5f92830c20c813a597342ac630c15830c0e7d786c92351492d11fd86340840c58ecd8086306a46ef4404e5b3bdb1d873395b8d12fe043dac7808b023b9b1109ba3c5a5d78193558f1cff977d2b8ea422818114c52722b1e838dbaa43052ddb7104a5d653142ccec4be43db7b2eb450e25c70a37ae0f7ccccc085f85e698ba60787204ec9f9e26cd6d8bd6e40d2cff06c7b42e3b9449d283e9d55e4954e2a8957fddd59b26338882fcd1126300d073c0cf93a99861fd23dff6ad5c5ed536ca8a9682a2e63bd89c8daf4b8dd9936e3fe2493b05db57e6cd92bcafc9c11343ef1475871f5f57cfedc9bde6a21d06f5113b25c68f5ae85da0cb1010cfd85fad9cea3ee9334c7351b2b8fd71c0a60021284a1b8acbe8c1212755c85dd872ad614618f97e28b6513c9cf0ce670a83ce4107ce20d74152c303b2fb27bddf22baf522832da674dfdfb154269a694cac7cbdc1ade1d924915575ab0613d6aeecd638993f8a9fadfa77e62db0f0caace4c5342849ccff72df1f19700892bb86da51f9ecb02fcce2105802bdf1a22c0c5ef7aace31f19c8ac9472be539f4465827984624a945738879d1edb862cd6be7619128ccf3275c6bcbde10aa85c59376cf1712b2f8ad9942223cf436849918b4e591cb77a18fa0b9c93264d8a621163d15b703d10cd80cd397091fc7b63f3ec12b2c2c88f7dff0a06f8c62c90748c85ac8055e2f412021c3fd991d2a7a4f0f39f90ccb850a55929845983c196b9eb7dea2552beca53eaf87e9a3cf194d70c320143baca93190ef55bdd43894a743f55cd8ee425709e69debff9cb3f5cf48a3431b6aa181e86b081b6c2c7764526f469fc324ddd820db8f874e56dd07bb5c3a06a5285f5983515ea367f405a7f1af09296a43444966d2c94fe554edc2e9afb0d7af1fd08958a3c8ce048afe83e158ec84ce8af8dad0649e1822d1531e75d605bcfad8da2f43b2ebde683d3283ade22e8c7dcc0d4653ff0f8ffd9c5f51887e147270471a15ef036a5bd1725e79b26f2f3905d42b45f422df7f37a99b86df1c6b9c680820d3d9211074b8b1f6ec71c44e272ec082a16a14ef47562b83849998587e5e1623770ff534897a56433d760b96d5ad936028a05f2199981e5a28ee38fce5f24e6a75fc956f485249fff260effaf6866b7ab5a9aef284352da444e87e68aa7f1e4964ecd4ec9572c7b7bdde3afc692e003f519dc1c6d7cee76ec2a113ea87e45b1025a102b65b1e4a874411f4f33c1facb1452fef8da2cce7b4b3074076b3c6ad33f07289e932a5652daa3514b983bf3dc57cbf4da25e53f66db56d8dc70e0660563fb8d427b978b7c3031cea35b6a4c57c51b81a36ab58d2a4b4743c016503eeefbc5df595484e17a2132729a0479c03bdb2d78531de988f1cd3caf532f73ed1a19050ea2c986b1ae8c1c3b9ebbd42d0a20c8ee107f891bcd4a51fdc912336f161dfb7c4528da8a0cc8c9dcd54f6ad856c5107bfe9e343df72a17bdc3bf62869eaf64c9699f16afe8a2b70b8f20a750a434c26f4db07c519cfc6ee003635d83790bfaef377d2b5a5e3337f5a302ff2aac19b04ff089fcfd0da6ee9123295ea7d97a4a89ded9d9d4b2a6a32633c64f93d46226b1c11a4ef4d4826f9b31596120d43174ca7bcd83cec94607b7e3c06acff1c1b5a08de0f7bf7de4c250ed5dbad94f1d6ac6bb456282d14e194b5467837c011c8bbd23d8db2b9e286309d831eadf829642355040fad9a81b02cd6b30fe7852a7095359b69d6cf91331577f7f673a73104a09c8bef95b72421556a324d7631d1b73997ba88d33d5c01669d7cf042b91ebb69be0283604dd4b9056cd9360c3a6dac5d9b49a7650c2aced38f8bf397b1bcf401a4dc6b16c5eddfe05c162136006e451b910aacc1f3298f8cf829bb9265289a16045ea1d8553cfa90ce3b02c0fa6f6cbc43a46a071c74e3c5d19caf4ee5f4377e09212536a79584046893b7df5aa678481cc1369516e71604c272337cb89b3f4e42ab321abcb9337da176f90346f06ff34a19377688ac337ea84e4b736b3c69e26270dc52df45d31e102d60a47c25180fdf4759bd5fbf341db9dfb3799bc4cdf5a64c9249dbd46aad212b64baf9a86ae83774afd995be9ca67c281f1fa9be8faee6594b4be68917069b39170f6b9fe500ccf362f12aa5623503bb8703969bff093450fc56ee9fd81b39fa0809f15fcdc1de3b3f1d498c88979b46f797a9c5190bb43a48a9a55c799d053a770ee6d284ca5dbc30bfc8ed43e6a7db9cecce3c8e2262a910d94a5fc3d9ab175dc30d9416a7e067e71371dd060484ff1271d77553091cebc41770959de3e8007aa1311705e9b6efb202d26b500363bb5968a283c1c9e8db5d622fbe46c0e59c2a12f1e0fce1f8f9bc042c92cfa357204bb7e6b40a5ceacdf8e67fc7dcaf44c315343b61e943bdc2d64f2fb4ff2908b45ba47a538dc0a58b35db969c718c2056c59d920c8a177ec75f9004ce34bc066085774c8ebb591621fd8bc77e008c652843ada84675320dfcefffe9c2b4ba65ca710fd73aa54c825615ced42421778303f50775a478c8c247e963d41129dca9b300a7ee205f20724635a58b7912bb94c8200383cd1beeefd843705d696cc514c104371e6c6df9c10f008d37b849626e37e1f633b10a183722d56142c6c00f1c19a14583250bcc6b1f1b16b5b71ef0da418618ccd9d2a2491936ce8ef72cec3d9307cd7331ad458f5d776a4d3159afdc130674d3a290e7a30f459ded0d55bcd73a96d7d13ddb02fa670e13be0b3aa66177f569f9aed094dfa43b91b3e295127b2eff71aeaffd970d7c234bd2d345620ace82714f90eeb075ae1c5f97805591d42754d0b3ad8ff5c328e1350042e047f473abba89b5418df34641e4e4c1004f54c1c9496eb5dfd058f3b1f2f093b1c5af854b9c6a1af652b72a806dd0babe25c1008b3507a4c894b4cc73d900b18a4ba6ee480d72bbf6bf0a9f9e9605ef810659fa05d03f2730715512b23e026300575bdb3f866484914526d382aed34e69b7b8bf8d1c5b347078183ca58d332e2953977232caf4f819b1fcb4fa1d26f95c97d656541516581bcd52ac32f950c5721a12b5d7e56f64f2280712935bf42656671ed7422cae379783ec8f1101370f33848eecac624b11a761a3a9e224d89b0c59c64742e9bb29af7712692f5d8c9209187c5ea450f232852128c4ccfcb1769df4030b5355245f936605bff1a79b4155d7dd1cd9903d4740edd8a29f070f1d58a8fe8706e71a863dfeb0e268112fdb6df0f105adbb037a5c09a4e1b9ec6df09e2bd06323e99a78dcc4e3e5e16a81e9a989fd752fb649004c89c51175233210518e9eefb8e66427cd42a91b995b35fd70c40f44516154bbe104ea5cc75b2a394f09e0a38155e270828079da80edfbd78cc69cee894063524eff9f920100f5dbe68cde22aa07378824367b3e96af78549c11a992c6f6b902d65b96904fe502d7eadfbb14041215596f214b8c9c5278491401741a1e08691438e121a4dc654444358803f7cc24f71cc108c8b35d44002be7e31d5e6c971dac20035db116dcbb30a525d8006cc8128b8acd8288eb0f4b83b4b8f6863aa8f9e6046e5ad4b7d2d06f7b2f72df2b8931484bad852a4421399c25df3ad77e29be34094de4ecf8e1ad44fb87cb11a04344a96289a4031a6608fa38e735f2d847066be89ee18603f415b450ff64b9308ae4bd1cec7b1736fd2cf8cd2114a2794e89358a6720599c7661f35285b54f35e69f5e09b3994543febb588b5ea700f4f24026c719a71408e4202950aedab90bc3c73d767658e8fa710f682e73eecb3e976a7960acfcf207e4d0901ba7f8df5a1a5814d52a775daac952ebe04930ce7d00e8c4f3e84f9d723b434a6a94a4a7c0a7d63902ec9d2b866c4e1e8914bd30ddfc0bb54c7e0d752679f33764674001a777a97a7bd23c6d16944d0be4f30bd1f3139ad5b90c1e8d85f4350df83471ee8d706473b3ff82d44b283334eae7166265f3b210e2d6e4cc171669b056097ff5d378a238ad1ed9d453a98b981ba20ddcb3dc02e51f139fd3eeee2514ee23f37a70f9aa9abd15
+pxl:v1:b15a24756358d6e6b02272a2:9bfd2086414fa1eaa92153908ed0e15d:ab8b7769a766de9be76c08c748e59ffeb147312bb908995fd88456c5cc76366350bf44d28f9b3ed9ebabb70ca106e4fa9196e559e81ce591b6764abce5415bb5013dc07538d6d0d92a377d46c1a6f2f96327c06d269053672fb532a274bc5b8483bf06b8a9f6e16d9733be3c5033a967d91527ffb53f1e5c65dfd66b983e4e3f2ec086e01ddd68a0a4d85a2b3dc3bef21024e50c11b2c8256c8dd1b2f2c8c71aaba175063b61f5253d05c0c2847ecf4ddb6b40f8aa9af5de027598b1f747b72cdd6ba85025fdf30f35d47f9c10de625209bd28ea11bd73decc15f1de580be1b155032b2857ee9ac8212aeb943c42a773fa75a0867413c455cce15bc77406bf2b5ba0f5da75cd14735f53b3d22962b27c04c418bcb7e241850f64a873649c3a52c67a84db2f9a3c4a7605ec5114ad1f74a0eef57d57b1dd98d87b144336d516b2d48324df0143e5687abdbd5ffbb9a0751e5f91577742fe460c390c519d73b3da3da2c1a4d32a738875106a58c91b6b04016eba50f57a026c9d67312bdfb53992ac025e503ee818aed29959337947e1d0d81e6cccd0d1a921cfe31d225ce744cc82340ce4af6aa308677cee985a7e7ae1d1b7d21274ca8264ee6481e5f001d1d4dea91dc0eb787d2cf1b990d9690e9bb83489d0e354d1071bff8a1668550303f04256f7e60736146a5da09e15b65d467af7194ece67feefc45736d009f8043d76c30b9263e04224977d8b9ce64b5e6317e6f3a604c76b1290ffa410e51dd069258321448675382907f32c6b51dfede27fa6db5244952f883c57b8d6cf9572e6cfa7a4d973f86c1ab3b54a7bf765deee12ea7d381eef24e1424f09dcdddd219930826dcc69d924ccd1937538b4edb8e347da359b638aeb475b38b08307d5ec568b959ac9c4dfd1889bf2c963b7bc0b65bdbef0d89a75b026ca4af6e87641ff604ae2da4b3c19a1c6a3a3f32ad870343f342d609946392d3e540044d7df067b00eb7ec16284a9b42439f853bdd6492163382d1e90d6e24e46b5ff1061cb51e8089ddfa3985775d03551f082cef25b0feeda0a9cc416a25f01d71f4797332b654895ee0766735dc02329e48f56d4583eb5fb9ca9e0f9c71b7ac21b3abecb55edca90731d7d69c16dbd31c0f01f3842fc1b4322383932c70e0131e6a723d95f26adbe8777f9d0bfaa75f310b411d9203689a8e13238328f04ae7ebb34e9212b77edd89b54f6924654a31d17c646a24bff9a096305be689c10a1dad1830199679568f5054616fe18572f44aac4846c3649e6b58509b6096efdbbf5a0bbcec5e97a48fb7497ab2d74376e76f269366b1d5dfd426fbcace4ee5bf775e9c9b804eb87363c8f9394a96c703c84cef79d1a9ae846c537ffcbb5daaaf4efdab9c6cf2ba12f6df46b8ea62acefa01f1201432808758b38643e6154bb74d0b7af6f01461357b58e51c726df49dd59585ed034473469de5f9454aff9794c0f08af4e7a976de871a3e67a7769a2b7d69aea8438767a06dd12815471bfe359c274e8b3e9e9b0419712c85d59b1844034bdf2d486cd9cb94b875672acbcd0dcbb3156e5b52c69a4f0f2339c682183b31a7a0f0757b505fa4c33e31e4554f535d001b441daed3122f7a6d6fd9563ad55d71ef0c361bd908370f52d63c96488f3dd7aa1f480e562fb8275119e5b3c866e4536c5a1dbb6f3e89ccca9ccf44cd7f60ba5e2de6f68b8f22c6fec7ff146bb4eb84230712ea1638b515bfb5e00518fe4ab4c7465c4a0b7b422fa9ecfb3dc7f5ff44915dd3aa982e6f9304e3068446e45dfa4e61eb6c7649cd8b4918ac3c369f42a7d71a9ce69afb63b9a4bd421c6e65e1e781b11aee3d22d85a776f8306a80d00956ca44163c7c7517d8fdb916808f42714bde340d39dc85aa606507f4f8942b28aa596ee67b478eab4439f3f8462d07a37555a8405eface5b4e45fe62c779e818c0e0f2ffb1c8885a2873e08a39e6731a421a4edd82fd0f18b16a3ed249e4a8fe3e41ea1c20e2d886a57ca64115b85c494879f9d1f0538c67c87c32d38225c2516b5d57138a0ac1741b88a076952042c75ea75a344e3154ce7729bfe524afc79ba82b5e80f0cac64d15d9af1e0fc4065415613f72942013db82178e9458d598c1e4c933ff7be954ad45e903fc1c0fa97bd1af49aa9cb6bf5ab4a14e801cfb2f9ebc3a1116ee7ec210cc07e9dd5bbd40b286028f2a4f1859473cdcbfdefd782c4eea8484e238d90081b48b5c6010dd16069a95485095fbe0fbdf5b50ba89dea877fa254d6583958bba61bd01f5edd53b6182678cd5df5c26adecb0427ba8b4763f83d281c93a3fa220528b25b6f14cdd8978d86f2bb402b9d576b390edf2738b243dd7a334951199dc63effb2c826e70257d310e56848a85f2e47042f934a0937d4f0d5ffd8dc06822cd5a3cecd12b628842c3f4e994989a655af25e7170dc9d24bbe3dc244606e3f196d062240defafe6d8276e02cf2da35514fbf93e8a3457631af251b1d4d707986c85b88d34ee81e77f3f9ca8507c00319bacdf1458656d9dc4198d81db75333e232ecb1366c5aa51d0fe2053c33cac284f9be16c9a6994de0227f55fc944ddf6277be6f0fad647ab3f35fbf3a75c0432025d41773dea229c021d508f30f2771e04b37bfb6471ac26ff9ad282cb5454464f6b1d26d02fa86ea2c6727ed637a2f0622d84891324368cefdb4ac6b9726372cfb9be4f05f47ea0005f3d892f8ab4aeabb666001f120b87207801cf279625f94cdc3ae93ce019c631e18d0ea88d70c88464d94274a8ab767c4b959c598c5472b6263358c29599351f74d9c73375e921d2d239f1675dd55b02a0450d99f8d0b5d7a83a3559f133f1af11c21c4f639929cecb7dbf3d97d81b5b19260800977ecf63c2cda31c82960e2c8f20eee1cc803d3613d7b324dfd6c54176f39fcdda99cf4f90ad4366dccf12b35a095de628fb63fa40fe39cd7f87dc85e287c9a9b6636e4444bd47650d85d01b58c06174fe725bc7737b9d3fdf7c61da147fcb2ce39cb74514650a1a7266bd91a8eae5f76149bf6ce4332d235ca5509ff7d53e51480f0e89294ea83edb84d91bbd8deaba4dbc850bab27fdd2d8e01a9e8dc51a1cacb27fb9e6c551ea5c9d0994245384f21ca9b0de3594c7a597ad52bdbddb81b706ffd05dc21ba766bb8cd13a1de888af0217ff9905069c19a7ca0cf1ce3b9a5111caffd50f65a0a0d24982ffda39c7343d73b1992ec3a3c5048c6d96ebd1064be6c3cc65ee4bc843fc552f6b25cc960919c35c41910e354e7aa2fa6c00bbd8b605e666338378794e9ed210ac265e92c1958b4e6eaca420c0e546b135b2cf4cf25a206424a3619f6cd3fef71f6f34960ee36a0236711e8b1b2e4ac03f78d94d54975f798bfa8826e409de8790c0feda76c6f85c0275de2dd08302766147a06e105f48e9e5db0f820110d24ab91561bc3cf4eb27c60d21eaf81d38964fc0ece16418ab2b561c9c0acada88dfd577ff0a3762139efa8edc09a23b6c33fd47b0bb5b52fc7afd09e66cce984452133a15d2c4de8d4779511175c946fca6933b016191f96f7c3ba9f8cbac7fc1267c1f01777817424c38bde51842213e3e1e5d84333fb2d805da2860d57009908a80e0e012b9683808a2e1759b48c0b64b043a04a35bf962e082b041853f5c5d7466ea2f714b8f2422fd6162daeb4a236546e493b06f15edfe0d7869aeffbaafc8bf9a138301fc121783832aef1a5e17dd7e548421115135b26b56bdfc0f0322d99653b7a3bad31e3e34e032e1803b31e46a20c2c1232b10cd2020c06106c8f795b7241c6253d9080498cc60e7c7b93549522c0d0c5c33e3c87e6096096cde13c0233dde2c59d32e40b5f21d8b114f84fbe98df27cacb130353ab81aa531b1884d99fef4e115c60d7b110ef05300a90270d8d7e9d5a761465973b37d1f9c4ae569e80b08e900423aeb5bb839f066de9e687d97a8405482ffb14bc942cc909b1507f0a98b98b2e907cb522078da150d977814e3985359a4eaf4325c2f8f271da8bb7927b35862db461a7c10b88f95be8a1ffbb11c15b6615eecf9a48687c3106aba3245934f5900d3049bd704cc6439919fb085a51d19ec883801fa6156031cc17b1b608f2a9c64a505373b62d90fed060ba14390e9d7a1fcc48ed4c9f15879dc8f827095f73fe6a21558311c4dd4cac91d1f1c128e8e378ecf91b04ac87d92cd3d9026e8b4a9439254c98930a7987f3dc8e8dc84d330ed25f65207822b03896ce43c18ad1cf0d9abe6ca5d092f14a19a202600679353b041a6f9bbdc17791e527a9dcd223b034f983add3c57052ec62ae4b61f6c3b8e5099c3ec0aa8ce5d4f0e1f308ff46803c5c72a5f902d02b65d713101dc83a252dfdb0fd4c36cf14030221a34b993fcb4f3261eb9aa884eb7ebc41fcef9b72765e09b63e2fc818a80f7128b153e763883ef632c6f97b77ea84ab070d85d129eb7cf2bd3d44419fa271ca0531339d9a2470a7ff37dc2c6da56c08b7bbff47d47c9d5cec9f106b3a3f23c98b65128e995dd47251d21acff2566614ca911318ad0416f1658eb8d31956d8f5ff0d22ab4390fee5e3cdf251bbc113b68b847203c3d65edeb7feb7a929ea25f2153837acd99486cf3b368b15cbd2ca3fe377bd95ef17b4fb77d8e633b747adc89f2738741a794a6058b5cf94bbb4a8849d6a3de88de7649155ba279f41f36895ed5b2161710c541c1bcbfd64bde555fd35aa0ed950725d9c595447fb73b52d4ab4b1affc5756babe36a42649d24b121244d9205344ffe6668a097c5c4fc83dff002c3af4ca6f357dd184c864b6cda545301ae0e333cc0ebccdbf00cad40fa4b133f8961751746feb4eb45d1b426e2a02effc5d4eb0f39df08c2aff63db26575df75f827ef33e20db0e1775f3c08d3833812b15348fa8cf8aba7643926ba11a87d11c34981690811019e7d1c109e5ec9863b4c49b65a6df5126e26a2c5867432632bf15389c243af3eba40e75ddbba75b315ab387a4d27c2000c56ec136808505087389b4a81466d08a2e32ee7de86efedd17d5390bb14aa1e79dcbe4103eb1bca793ef5f4a0ccfa3fe60d1210ef26dd955fc0b59180eaf04fd258272b173815596bda4575788156e3408c2aaaecb99293e83b1d85b3857e5432c8e158738d92a11cd783cf4af

package/dist/scripts/config-vault.js

@@ -77,8 +77,8 @@ if (command === 'encrypt' || command === 'decrypt') {
  * - Decrypt in-place and copy plaintext to .next/server/pixelated.config.json
  * - Validate JSON and emit a concise success message
  */
-function decryptPostBuild() {
-    const DEBUG = process.env.PIXELATED_CONFIG_DEBUG === '1';
+function decryptPostBuild(opts = {}) {
+    const debug = opts.debug ?? false;
     const candidates = [
         path.join(process.cwd(), 'src/app/config/pixelated.config.json.enc'),
         path.join(process.cwd(), 'src/config/pixelated.config.json.enc'),
@@ -92,7 +92,7 @@ function decryptPostBuild() {
         }
     }
     if (!foundEnc) {
-        if (DEBUG)
+        if (debug)
             console.log('No encrypted config found; nothing to do.');
         process.exit(0);
     }
@@ -136,7 +136,7 @@ function decryptPostBuild() {
         // Validate JSON
         JSON.parse(decrypted);
         console.log('Config injected into .next/server/pixelated.config.json');
-        if (DEBUG)
+        if (debug)
             console.log(`Decrypted ${path.basename(foundEnc)} -> ${injectPath}`);
         process.exit(0);
     }
@@ -177,7 +177,9 @@ try {
         console.log(`Successfully decrypted ${path.basename(targetPath)} -> ${path.basename(destPath)}`);
     }
     else if (command === 'postbuild' || command === 'post-build' || command === 'inject') {
-        decryptPostBuild();
+        // CLI-only debug opt-in: explicit flag (do NOT use env vars for debug)
+        const cliDebug = process.argv.includes('--debug') || process.argv.some(a => a.startsWith('--debug='));
+        decryptPostBuild({ debug: cliDebug });
     }
     else {
         console.error(`Unknown command: ${command}`);

package/dist/scripts/config-vault.ts

@@ -83,8 +83,8 @@ if (command === 'encrypt' || command === 'decrypt') {
  * - Decrypt in-place and copy plaintext to .next/server/pixelated.config.json
  * - Validate JSON and emit a concise success message
  */
-function decryptPostBuild(): void {
-	const DEBUG = process.env.PIXELATED_CONFIG_DEBUG === '1';
+function decryptPostBuild(opts: { debug?: boolean } = {}): void {
+	const debug = opts.debug ?? false;
 	const candidates = [
 		path.join(process.cwd(), 'src/app/config/pixelated.config.json.enc'),
 		path.join(process.cwd(), 'src/config/pixelated.config.json.enc'),
@@ -100,7 +100,7 @@ function decryptPostBuild(): void {
 	}
 
 	if (!foundEnc) {
-		if (DEBUG) console.log('No encrypted config found; nothing to do.');
+		if (debug) console.log('No encrypted config found; nothing to do.');
 		process.exit(0);
 	}
 
@@ -144,7 +144,7 @@ function decryptPostBuild(): void {
 		// Validate JSON
 		JSON.parse(decrypted);
 		console.log('Config injected into .next/server/pixelated.config.json');
-		if (DEBUG) console.log(`Decrypted ${path.basename(foundEnc)} -> ${injectPath}`);
+		if (debug) console.log(`Decrypted ${path.basename(foundEnc)} -> ${injectPath}`);
 		process.exit(0);
 	} catch (err: any) {
 		console.error(`Post-build decrypt failed: ${err.message}`);
@@ -182,7 +182,9 @@ try {
 		atomicWrite(destPath, decrypted);
 		console.log(`Successfully decrypted ${path.basename(targetPath)} -> ${path.basename(destPath)}`);
 	} else if (command === 'postbuild' || command === 'post-build' || command === 'inject') {
-		decryptPostBuild();
+		// CLI-only debug opt-in: explicit flag (do NOT use env vars for debug)
+		const cliDebug = process.argv.includes('--debug') || process.argv.some(a => a.startsWith('--debug='));
+		decryptPostBuild({ debug: cliDebug });
 	} else {
 		console.error(`Unknown command: ${command}`);
 		process.exit(1);