@pixelated-tech/components 3.3.3 → 3.3.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/README.COMPONENTS.md +17 -0
  2. package/README.md +16 -11
  3. package/dist/components/callout/callout.js +1 -1
  4. package/dist/components/carousel/carousel.js +1 -1
  5. package/dist/components/carousel/tiles.js +1 -1
  6. package/dist/components/cms/contentful.items.components.js +1 -1
  7. package/dist/components/cms/gravatar.components.js +1 -1
  8. package/dist/components/cms/{cloudinary.image.js → smartimage.js} +21 -15
  9. package/dist/components/cms/wordpress.components.js +1 -1
  10. package/dist/components/config/config.client.js +12 -5
  11. package/dist/components/general/accordion.js +2 -1
  12. package/dist/components/general/semantic.js +1 -1
  13. package/dist/components/general/table.js +1 -1
  14. package/dist/components/seo/404.js +3 -2
  15. package/dist/components/shoppingcart/ebay.components.js +1 -1
  16. package/dist/components/shoppingcart/shoppingcart.components.js +1 -1
  17. package/dist/components/sitebuilder/config/ConfigEngine.js +1 -0
  18. package/dist/components/sitebuilder/form/formcomponents.js +4 -3
  19. package/dist/components/structured/markdown.js +1 -1
  20. package/dist/components/structured/recipe.js +1 -1
  21. package/dist/components/structured/resume.js +1 -1
  22. package/dist/components/structured/socialcard.js +1 -1
  23. package/dist/components/structured/timeline.js +1 -1
  24. package/dist/components/utilities/functions.js +26 -0
  25. package/dist/index.js +22 -22
  26. package/dist/types/components/cms/{cloudinary.image.d.ts → smartimage.d.ts} +3 -1
  27. package/dist/types/components/cms/smartimage.d.ts.map +1 -0
  28. package/dist/types/components/config/config.client.d.ts.map +1 -1
  29. package/dist/types/components/general/accordion.d.ts +2 -0
  30. package/dist/types/components/general/accordion.d.ts.map +1 -1
  31. package/dist/types/components/general/semantic.d.ts +3 -3
  32. package/dist/types/components/seo/404.d.ts.map +1 -1
  33. package/dist/types/components/sitebuilder/config/ConfigEngine.d.ts.map +1 -1
  34. package/dist/types/components/sitebuilder/form/formcomponents.d.ts +1 -1
  35. package/dist/types/components/sitebuilder/form/formcomponents.d.ts.map +1 -1
  36. package/dist/types/components/sitebuilder/form/formvalidator.d.ts +1 -1
  37. package/dist/types/components/sitebuilder/form/formvalidator.d.ts.map +1 -1
  38. package/dist/types/components/utilities/functions.d.ts +6 -0
  39. package/dist/types/components/utilities/functions.d.ts.map +1 -1
  40. package/dist/types/index.d.ts +1 -1
  41. package/dist/types/stories/admin/contentful-migration.stories.d.ts +43 -0
  42. package/dist/types/stories/admin/contentful-migration.stories.d.ts.map +1 -0
  43. package/dist/types/stories/general/smartimage.stories.d.ts +71 -0
  44. package/dist/types/stories/general/smartimage.stories.d.ts.map +1 -0
  45. package/dist/types/tests/smartimage.test.d.ts +2 -0
  46. package/dist/types/tests/smartimage.test.d.ts.map +1 -0
  47. package/package.json +3 -3
  48. package/dist/types/components/cms/cloudinary.image.d.ts.map +0 -1
@@ -306,12 +306,27 @@ Optimized image component with lazy loading and responsive features.
306
306
  ```tsx
307
307
  import { SmartImage } from '@pixelated-tech/components';
308
308
 
309
+ // Default Cloudinary variant (with optimizations)
309
310
  <SmartImage
310
311
  src="/path/to/image.jpg"
311
312
  alt="Description"
312
313
  aboveFold={false}
313
314
  sizes="(max-width: 768px) 100vw, 50vw"
314
315
  />
316
+
317
+ // Next.js Image variant (without Cloudinary)
318
+ <SmartImage
319
+ src="/path/to/image.jpg"
320
+ alt="Description"
321
+ variant="nextjs"
322
+ />
323
+
324
+ // Plain img tag variant (config-independent, for error pages)
325
+ <SmartImage
326
+ src="/path/to/image.jpg"
327
+ alt="Description"
328
+ variant="img"
329
+ />
315
330
  ```
316
331
 
317
332
  #### Props
@@ -319,11 +334,13 @@ import { SmartImage } from '@pixelated-tech/components';
319
334
  |------|------|---------|-------------|
320
335
  | `src` | `string` | - | Image source URL |
321
336
  | `alt` | `string` | - | Alt text |
337
+ | `variant` | `'cloudinary' \| 'nextjs' \| 'img'` | `'cloudinary'` | Rendering variant |
322
338
  | `aboveFold` | `boolean` | `false` | Above-the-fold hint for loading |
323
339
  | `sizes` | `string` | - | Responsive sizes attribute |
324
340
  | `loading` | `'lazy' \| 'eager'` | `'lazy'` | Loading strategy |
325
341
  | `width` | `number` | - | Image width |
326
342
  | `height` | `number` | - | Image height |
343
+ | `quality` | `number` | `75` | Image quality (1-100) |
327
344
 
328
345
  ### CSS
329
346
 
package/README.md CHANGED
@@ -317,6 +317,11 @@ npm run storybook
317
317
  - [ ] **API Gateway**: Unified API management for connecting to CRM, email marketing, payment processors, and other business tools
318
318
  - [ ] **Webhook Automation**: Event-driven automation for form submissions, new content, user registrations, and business workflows
319
319
  - [ ] **Third-Party Sync Engine**: Bidirectional sync with tools like HubSpot, Mailchimp, QuickBooks, and project management systems
320
+ - [ ] **Testing Strategy for Config Failure Scenarios**: Comprehensive testing framework for config-dependent components and error handling
321
+ - Test components with missing config providers
322
+ - Test error pages without config dependencies
323
+ - Test app initialization with invalid environment variables
324
+ - Include chaos engineering tests that simulate config failures
320
325
  - [ ] **Documentation Auto-Generator**: Automatically generated API docs, component usage guides, and deployment instructions
321
326
 
322
327
 
@@ -380,12 +385,12 @@ Project Link: [https://github.com/brianwhaley/pixelated-components](https://gith
380
385
 
381
386
  | Metric | Value |
382
387
  |--------|-------|
383
- | Test Files | 67 |
384
- | Total Tests | 2,246 |
385
- | Coverage (Statements) | 76.11% |
386
- | Coverage (Lines) | 78.91% |
387
- | Coverage (Functions) | 77.95% |
388
- | Coverage (Branches) | 66.58% |
388
+ | Test Files | 71 |
389
+ | Total Tests | 2,291 |
390
+ | Coverage (Statements) | 76.09% |
391
+ | Coverage (Lines) | 78.76% |
392
+ | Coverage (Functions) | 77.11% |
393
+ | Coverage (Branches) | 67.37% |
389
394
  | Test Framework | Vitest 4.x |
390
395
  | Testing Library | @testing-library/react + jsdom |
391
396
 
@@ -405,7 +410,6 @@ npm run test:run # Single run (for CI)
405
410
  #### Component Coverage (Sorted by Statement Coverage)
406
411
  - **tiles.tsx**: 100% statements
407
412
  - **google.reviews.functions.ts**: 100% statements
408
- - **config.server.tsx**: 100% statements
409
413
  - **accordion.tsx**: 100% statements
410
414
  - **modal.tsx**: 100% statements
411
415
  - **tab.tsx**: 100% statements
@@ -413,16 +417,17 @@ npm run test:run # Single run (for CI)
413
417
  - **ComponentSelector.tsx**: 100% statements
414
418
  - **ComponentTree.tsx**: 100% statements
415
419
  - **formvalidations.tsx**: 100% statements
416
- - **componentMetadata.tsx**: 100% statements
417
420
  - **googlesearch.tsx**: 100% statements
418
421
  - **schema-localbusiness.tsx**: 100% statements
419
422
  - **schema-recipe.tsx**: 100% statements
420
423
  - **schema-services.tsx**: 100% statements
421
424
  - **schema-website.tsx**: 100% statements
425
+ - **schema-blogposting.tsx**: 100% statements
422
426
  - **buzzwordbingo.tsx**: 100% statements
423
427
  - **markdown.tsx**: 100% statements
424
428
  - **timeline.tsx**: 100% statements
425
429
  - **sidepanel.tsx**: 97.5% statements
430
+ - **config.server.tsx**: 50% statements
426
431
  - **config.ts**: 96.55% statements
427
432
  - **google.reviews.components.tsx**: 95.83% statements
428
433
  - **schema-blogposting.tsx**: 95.24% statements
@@ -432,7 +437,7 @@ npm run test:run # Single run (for CI)
432
437
  - **css.tsx**: 91.43% statements
433
438
  - **functions.ts**: 90.91% statements
434
439
  - **menu-expando.tsx**: 90.12% statements
435
- - **config.client.tsx**: 90% statements
440
+ - **config.client.tsx**: 100% statements
436
441
  - **loading.tsx**: 85.71% statements
437
442
  - **SaveLoadSection.tsx**: 84.85% statements
438
443
  - **table.tsx**: 84.48% statements
@@ -443,12 +448,12 @@ npm run test:run # Single run (for CI)
443
448
  - **shoppingcart.functions.ts**: 81.7% statements
444
449
  - **callout.tsx**: 80% statements
445
450
  - **microinteractions.tsx**: 80% statements
446
- - **cloudinary.image.tsx**: 78.57% statements
451
+ - **smartimage.tsx**: 82.75% statements
447
452
  - **sitemap.ts**: 76.06% statements
448
453
  - **manifest.tsx**: 75% statements
449
454
  - **carousel.tsx**: 71.7% statements
450
455
  - **nerdjoke.tsx**: 69.44% statements
451
- - **menu-accordion.tsx**: 68.13% statements
456
+ - **menu-accordion.tsx**: 68.47% statements
452
457
  - **semantic.tsx**: 63.51% statements
453
458
  - **componentMap.tsx**: 60% statements
454
459
  - **propTypeIntrospection.tsx**: 60% statements
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import PropTypes from 'prop-types';
4
4
  import { usePixelatedConfig } from "../config/config.client";
5
- import { SmartImage } from '../cms/cloudinary.image';
5
+ import { SmartImage } from '../cms/smartimage';
6
6
  import "./callout.scss";
7
7
  /* ==================== NOTES ====================
8
8
  DEFAULT = flexbox layout, no border around callout
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { useState, useEffect, useRef } from 'react';
4
4
  import PropTypes /* , { InferProps } */ from 'prop-types';
5
- import { SmartImage } from '../cms/cloudinary.image';
5
+ import { SmartImage } from '../cms/smartimage';
6
6
  import { usePixelatedConfig } from '../config/config.client';
7
7
  import { DragHandler } from './carousel.drag';
8
8
  import './carousel.css';
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import PropTypes from "prop-types";
4
4
  import { Loading } from "../general/loading";
5
- import { SmartImage } from "../cms/cloudinary.image";
5
+ import { SmartImage } from "../cms/smartimage";
6
6
  import { usePixelatedConfig } from '../config/config.client';
7
7
  import "../../css/pixelated.grid.scss";
8
8
  import "./tiles.css";
@@ -9,7 +9,7 @@ import { AddToShoppingCart } from "../shoppingcart/shoppingcart.functions";
9
9
  import { AddToCartButton, /* GoToCartButton */ ViewItemDetails } from "../shoppingcart/shoppingcart.components";
10
10
  import { getCloudinaryRemoteFetchURL as getImg } from "./cloudinary";
11
11
  // import { Loading, ToggleLoading } from "../general/pixelated.loading";
12
- import { SmartImage } from "./cloudinary.image";
12
+ import { SmartImage } from "./smartimage";
13
13
  import "../../css/pixelated.grid.scss";
14
14
  import "./contentful.items.css";
15
15
  const debug = false;
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
3
  import PropTypes from 'prop-types';
4
4
  // import { type GravatarProfile } from './gravatar.functions';
5
- import { SmartImage } from './cloudinary.image';
5
+ import { SmartImage } from './smartimage';
6
6
  import { usePixelatedConfig } from '../config/config.client';
7
7
  import './gravatar.css';
8
8
  /* export type GravatarCardProps = {
@@ -60,10 +60,11 @@ const SMARTIMAGE_PROP_TYPES = {
60
60
  quality: PropTypes.number,
61
61
  placeholder: PropTypes.oneOf(['blur', 'empty']),
62
62
  blurDataURL: PropTypes.string,
63
+ variant: PropTypes.oneOf(['cloudinary', 'nextjs', 'img']),
63
64
  };
64
65
  SmartImage.propTypes = SMARTIMAGE_PROP_TYPES;
65
66
  export function SmartImage(props) {
66
- const { src, alt, id, name, title, cloudinaryEnv, cloudinaryDomain = CLOUDINARY_DOMAIN, cloudinaryTransforms = CLOUDINARY_TRANSFORMS, quality = 75, width = 500, height = 500, aboveFold = false, fetchPriority = 'auto', loading = 'lazy', decoding = 'async', preload = false, ...imgProps } = props;
67
+ const { src, alt, id, name, title, cloudinaryEnv, cloudinaryDomain = CLOUDINARY_DOMAIN, cloudinaryTransforms = CLOUDINARY_TRANSFORMS, quality = 75, width = 500, height = 500, aboveFold = false, fetchPriority = 'auto', loading = 'lazy', decoding = 'async', preload = false, variant = 'cloudinary', ...imgProps } = props;
67
68
  const newProps = { ...props };
68
69
  const config = usePixelatedConfig();
69
70
  const cloudCfg = config?.cloudinary;
@@ -86,20 +87,19 @@ export function SmartImage(props) {
86
87
  newProps.id = newProps.id || newProps.name || sanitizeString(newProps.title) || sanitizeString(newProps.alt) || sanitizeString(imageName);
87
88
  newProps.name = newProps.name || newProps.id || sanitizeString(newProps.title) || sanitizeString(newProps.alt) || sanitizeString(imageName);
88
89
  newProps.title = newProps.title || newProps.alt || sanitizeString(imageName);
89
- // if(Array.isArray(src))
90
- const finalSrc = newProps.cloudinaryEnv
91
- ? buildCloudinaryUrl({
90
+ let finalSrc = String(newProps.src);
91
+ /* ===== CLOUDINARY VARIANT ===== */
92
+ let responsiveSrcSet;
93
+ let responsiveSizes;
94
+ if (variant === 'cloudinary' && newProps.cloudinaryEnv) {
95
+ finalSrc = buildCloudinaryUrl({
92
96
  src: newProps.src,
93
97
  productEnv: newProps.cloudinaryEnv,
94
98
  cloudinaryDomain: newProps.cloudinaryDomain,
95
99
  quality,
96
100
  width: newProps.width ?? undefined,
97
101
  transforms: newProps.cloudinaryTransforms ?? undefined
98
- })
99
- : String(newProps.src);
100
- let responsiveSrcSet;
101
- let responsiveSizes;
102
- if (newProps.cloudinaryEnv) {
102
+ });
103
103
  if (newProps.width) {
104
104
  const widths = [Math.ceil(newProps.width * 0.5), newProps.width, Math.ceil(newProps.width * 1.5), Math.ceil(newProps.width * 2)];
105
105
  responsiveSrcSet = generateSrcSet(String(newProps.src), newProps.cloudinaryEnv, widths, {
@@ -119,15 +119,21 @@ export function SmartImage(props) {
119
119
  responsiveSizes = '(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw';
120
120
  }
121
121
  }
122
+ /* ===== NEXTJS VARIANT ===== */
123
+ /* variant is not cloudinary and not img (ie nextjs)
124
+ or variant is cloudinary and no cloudinaryEnv */
122
125
  const isDecorative = newProps.alt === '';
123
126
  const decorativeProps = isDecorative ? { 'aria-hidden': true, role: 'presentation' } : {};
124
- try {
125
- return (_jsx(Image, { ...imgProps, ...decorativeProps, src: finalSrc, alt: newProps.alt, id: newProps.id, name: newProps.name, title: newProps.title, width: newProps.width, height: newProps.height, sizes: imgProps.sizes || responsiveSizes, quality: quality, fetchPriority: newProps.fetchPriority, loading: newProps.loading, decoding: newProps.decoding, preload: newProps.preload }));
126
- }
127
- catch (e) {
128
- if (typeof console !== 'undefined')
129
- console.warn('next/image unavailable, falling back to <img>', e);
127
+ if (variant !== 'img') {
128
+ try {
129
+ return (_jsx(Image, { ...imgProps, ...decorativeProps, src: finalSrc, alt: newProps.alt, id: newProps.id, name: newProps.name, title: newProps.title, width: newProps.width, height: newProps.height, sizes: imgProps.sizes || responsiveSizes, quality: quality, fetchPriority: newProps.fetchPriority, loading: newProps.loading, decoding: newProps.decoding, preload: newProps.preload }));
130
+ }
131
+ catch (e) {
132
+ if (typeof console !== 'undefined')
133
+ console.warn('next/image unavailable, falling back to <img>', e);
134
+ }
130
135
  }
136
+ /* ===== IMG VARIANT ===== */
131
137
  const imgRef = React.useRef(null);
132
138
  return (_jsx("img", { ...imgProps, ...decorativeProps, ref: imgRef, src: finalSrc, alt: newProps.alt, id: newProps.id, name: newProps.name, title: newProps.title, width: newProps.width, height: newProps.height, srcSet: responsiveSrcSet || imgProps.srcSet, sizes: imgProps.sizes || responsiveSizes, fetchPriority: newProps.fetchPriority, loading: newProps.loading, decoding: newProps.decoding }));
133
139
  }
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { useEffect, useState } from 'react';
4
4
  import { usePixelatedConfig } from "../config/config.client";
5
- import { SmartImage } from './cloudinary.image';
5
+ import { SmartImage } from './smartimage';
6
6
  import { PageGridItem } from '../general/semantic';
7
7
  import { getWordPressItems } from './wordpress.functions';
8
8
  import { Loading, ToggleLoading } from '../general/loading';
@@ -12,11 +12,18 @@ export const PixelatedClientConfigProvider = ({ config, children, }) => {
12
12
  export const usePixelatedConfig = () => {
13
13
  const ctx = React.useContext(PixelatedConfigContext);
14
14
  if (!ctx) {
15
- if (process.env.NODE_ENV !== 'production') {
16
- throw new Error('PixelatedClientConfigProvider not found. Wrap your app with PixelatedClientConfigProvider.');
17
- }
18
- // In production return an empty object typed as PixelatedConfig to avoid runtime crashes
19
- return {};
15
+ // Always throw error when provider is missing (consistent across dev/prod)
16
+ // Previously had environment-specific behavior:
17
+ // if (process.env.NODE_ENV !== 'production') {
18
+ // throw new Error('PixelatedClientConfigProvider not found. Wrap your app with PixelatedClientConfigProvider.');
19
+ // }
20
+ // // In production return an empty object typed as PixelatedConfig to avoid runtime crashes
21
+ // return {} as PixelatedConfig;
22
+ throw new Error('PixelatedClientConfigProvider not found. Wrap your app with PixelatedClientConfigProvider.');
23
+ }
24
+ // Also throw if config is empty (no environment config loaded)
25
+ if (Object.keys(ctx).length === 0) {
26
+ throw new Error('Pixelated config is empty. Check that PIXELATED_CONFIG_JSON or PIXELATED_CONFIG_B64 environment variables are set.');
20
27
  }
21
28
  return ctx;
22
29
  };
@@ -6,8 +6,9 @@ Accordion.propTypes = {
6
6
  items: PropTypes.arrayOf(PropTypes.shape({
7
7
  title: PropTypes.string.isRequired,
8
8
  content: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
9
+ open: PropTypes.bool,
9
10
  })).isRequired,
10
11
  };
11
12
  export function Accordion({ items }) {
12
- return (_jsx("div", { className: "accordion", children: items?.map((item, index) => (item ? (_jsxs("details", { className: "accordion-item", children: [_jsx("summary", { className: "accordion-title", children: _jsx("h3", { id: `accordion-header-${index}`, children: item.title }) }), _jsx("div", { className: "accordion-content", role: "region", "aria-labelledby": `accordion-header-${index}`, children: typeof item.content === 'string' ? (_jsx("p", { children: item.content })) : (item.content) })] }, index)) : null)) }));
13
+ return (_jsx("div", { className: "accordion", children: items?.map((item, index) => (item ? (_jsxs("details", { className: "accordion-item", open: item.open ?? undefined, children: [_jsx("summary", { className: "accordion-title", children: _jsx("h3", { id: `accordion-header-${index}`, children: item.title }) }), _jsx("div", { className: "accordion-content", role: "region", "aria-labelledby": `accordion-header-${index}`, children: typeof item.content === 'string' ? (_jsx("p", { children: item.content })) : (item.content) })] }, index)) : null)) }));
13
14
  }
@@ -3,7 +3,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
3
3
  import { useLayoutEffect, useRef, useState } from "react";
4
4
  import PropTypes from "prop-types";
5
5
  import { usePixelatedConfig } from "../config/config.client";
6
- import { SmartImage } from "../cms/cloudinary.image";
6
+ import { SmartImage } from "../cms/smartimage";
7
7
  import "../../css/pixelated.grid.scss";
8
8
  import "./semantic.scss";
9
9
  /* ========== LAYOUT COMPONENTS ==========
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useState } from 'react';
3
3
  import PropTypes from 'prop-types';
4
- import { SmartImage } from '../cms/cloudinary.image';
4
+ import { SmartImage } from '../cms/smartimage';
5
5
  import './table.css';
6
6
  function isImageURL(url) {
7
7
  const isImage = /\.(jpeg|jpg|gif|png|webp|svg|bmp)$/i.test(url);
@@ -1,8 +1,9 @@
1
+ "use client";
1
2
  import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
2
3
  import { useState, useEffect } from "react";
3
4
  import PropTypes from 'prop-types';
4
5
  // import { getCloudinaryRemoteFetchURL } from "../cms/cloudinary";
5
- import { SmartImage } from "../cms/cloudinary.image";
6
+ import { SmartImage } from "../cms/smartimage";
6
7
  import { usePixelatedConfig } from "../config/config.client";
7
8
  import "./404.css";
8
9
  FourOhFour.propTypes = {
@@ -24,7 +25,7 @@ export function FourOhFour(props) {
24
25
  if (randomIndex !== null && imageURL /* cloudinaryURL */ !== '') {
25
26
  return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "fof-body-container", children: [_jsxs("h1", { className: "centered text-outline", children: ["404 - ", images[randomIndex].text] }), _jsx("div", { className: "centered-button", children: _jsx("a", { href: "/", target: "_self", rel: "noopener noreferrer", children: "Go Home" }) })] }), _jsx("div", { className: "fof-image-container", children: _jsx("div", { className: "fof-image-wrapper", children: _jsx(SmartImage, { src: imageURL,
26
27
  // src={cloudinaryURL}
27
- title: "Page Not Found - " + images[randomIndex].description, alt: "Page Not Found - " + images[randomIndex].description, cloudinaryEnv: config?.cloudinary?.product_env ?? undefined, cloudinaryDomain: config?.cloudinary?.baseUrl ?? undefined, cloudinaryTransforms: config?.cloudinary?.transforms ?? undefined }) }) })] }));
28
+ title: "Page Not Found - " + images[randomIndex].description, alt: "Page Not Found - " + images[randomIndex].description, variant: "nextjs", cloudinaryEnv: config?.cloudinary?.product_env ?? undefined, cloudinaryDomain: config?.cloudinary?.baseUrl ?? undefined, cloudinaryTransforms: config?.cloudinary?.transforms ?? undefined }) }) })] }));
28
29
  }
29
30
  else {
30
31
  return (_jsx(_Fragment, {}));
@@ -3,7 +3,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
3
3
  import { useState, useEffect } from "react";
4
4
  import PropTypes from "prop-types";
5
5
  import { Carousel } from '../carousel/carousel';
6
- import { SmartImage } from "../cms/cloudinary.image";
6
+ import { SmartImage } from "../cms/smartimage";
7
7
  import { defaultEbayProps, ebaySunglassCategory, getEbayItems, getEbayItem, getShoppingCartItem } from "./ebay.functions";
8
8
  import { AddToShoppingCart } from "./shoppingcart.functions";
9
9
  import { AddToCartButton, /* GoToCartButton */ ViewItemDetails } from "./shoppingcart.components";
@@ -13,7 +13,7 @@ import { Modal, handleModalOpen } from '../general/modal';
13
13
  import { Table } from "../general/table";
14
14
  import { getCart, getShippingInfo, SetShippingInfo, setDiscountCodes, getRemoteDiscountCodes, getCheckoutData, RemoveFromShoppingCart, ClearShoppingCart, formatAsUSD, getCartItemCount } from "./shoppingcart.functions";
15
15
  import { usePixelatedConfig } from '../config/config.client';
16
- import { SmartImage } from '../cms/cloudinary.image';
16
+ import { SmartImage } from '../cms/smartimage';
17
17
  import shippingToData from "../../data/shipping.to.json";
18
18
  import "./shoppingcart.css";
19
19
  const debug = false;
@@ -65,6 +65,7 @@ export function VisualDesignStyles({ visualdesign }) {
65
65
  ' background-color: var(--bg-color) !important;',
66
66
  ' color: var(--text-color);',
67
67
  ' font-family: var(--body-font);',
68
+ ' font-size: var(--font-size4);',
68
69
  '}',
69
70
  'h1, h2, h3, h4, h5, h6 {',
70
71
  ' line-height: 1.1;',
@@ -47,7 +47,8 @@ const useFormComponent = (props) => {
47
47
  // Handle onChange for immediate feedback
48
48
  const handleChange = (event) => {
49
49
  // Determine the value (checkbox vs other)
50
- const value = event.target.type === 'checkbox' ? (event.target.checked ? event.target.value : '') : event.target.value;
50
+ const target = event.target;
51
+ const value = target.type === 'checkbox' ? (target.checked ? target.value : '') : event.target.value;
51
52
  // Call custom onChange handler synchronously so controlled inputs update immediately
52
53
  const customOnChange = props.onChange || (props.parent && props.parent.onChange);
53
54
  if (customOnChange) {
@@ -353,10 +354,10 @@ FormButton.propTypes = {
353
354
  text: PropTypes.string,
354
355
  // ----- for calculations
355
356
  className: PropTypes.string,
356
- onClick: PropTypes.func.isRequired
357
+ onClick: PropTypes.func
357
358
  };
358
359
  export function FormButton(props) {
359
- return (_jsx("div", { children: _jsx("button", { type: props.type, id: props.id, className: props.className || "", onClick: props.onClick, children: props.text }) }));
360
+ return (_jsx("div", { children: _jsx("button", { type: props.type, id: props.id, className: props.className || "", onClick: props.onClick || undefined, children: props.text }) }));
360
361
  }
361
362
  FormDataList.propTypes = {
362
363
  id: PropTypes.string.isRequired,
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import PropTypes from "prop-types";
4
- import { SmartImage } from "../cms/cloudinary.image";
4
+ import { SmartImage } from "../cms/smartimage";
5
5
  import { usePixelatedConfig } from "../config/config.client";
6
6
  import "./markdown.css";
7
7
  /* ========== MARKDOWN ========== */
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { useState, useEffect } from 'react';
4
4
  import PropTypes from 'prop-types';
5
- import { SmartImage } from '../cms/cloudinary.image';
5
+ import { SmartImage } from '../cms/smartimage';
6
6
  import { usePixelatedConfig } from '../config/config.client';
7
7
  import './recipe.css';
8
8
  export function mapSchemaRecipeToDisplay(schemaRecipe) {
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
2
2
  import PropTypes from "prop-types";
3
3
  import { format } from "date-fns";
4
4
  import { usePixelatedConfig } from "../config/config.client";
5
- import { SmartImage } from "../cms/cloudinary.image";
5
+ import { SmartImage } from "../cms/smartimage";
6
6
  import "../../css/pixelated.grid.scss";
7
7
  import "./resume.css";
8
8
  /*
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useState, useEffect } from 'react';
3
3
  import PropTypes from "prop-types";
4
4
  import { mergeDeep } from '../utilities/functions';
5
- import { SmartImage } from '../cms/cloudinary.image';
5
+ import { SmartImage } from '../cms/smartimage';
6
6
  import { usePixelatedConfig } from '../config/config.client';
7
7
  import './socialcard.css';
8
8
  /* ========== NOTES ==========
@@ -2,7 +2,7 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import PropTypes from "prop-types";
4
4
  import { usePixelatedConfig } from '../config/config.client';
5
- import { SmartImage } from '../cms/cloudinary.image';
5
+ import { SmartImage } from '../cms/smartimage';
6
6
  import "../../css/pixelated.grid.scss";
7
7
  import "./timeline.css";
8
8
  // https://www.w3schools.com/howto/howto_css_timeline.asp
@@ -96,3 +96,29 @@ export function attributeMap(oldAttribute) {
96
96
  };
97
97
  return (attributes[oldAttribute] ? attributes[oldAttribute] : oldAttribute);
98
98
  }
99
+ /**
100
+ * Adds a single 'change' event listener to the document and uses event delegation
101
+ * to log the event and the value of the target element when a change occurs
102
+ * on an input, select, or textarea element.
103
+ */
104
+ export function logAllChange() {
105
+ // Attach a single 'change' event listener to the document
106
+ document.addEventListener('change', function (event) {
107
+ // The event.target is the specific element that triggered the event
108
+ const targetElement = event.target;
109
+ // Check if the target element is one that typically has a 'change' event (form controls)
110
+ if (targetElement &&
111
+ (targetElement.tagName === 'INPUT' ||
112
+ targetElement.tagName === 'SELECT' ||
113
+ targetElement.tagName === 'TEXTAREA')) {
114
+ console.log('Change event triggered:', event);
115
+ // For text inputs, the change event only fires when the element loses focus
116
+ // For checkboxes/radio buttons, event.target.checked provides the value
117
+ const inputElement = targetElement;
118
+ const changeValue = inputElement.type === 'checkbox' || inputElement.type === 'radio' ? inputElement.checked : inputElement.value;
119
+ console.log('Changed value:', changeValue);
120
+ }
121
+ });
122
+ }
123
+ // Call the function to activate the listeners once the script is loaded
124
+ // logChangeToAllElements();
package/dist/index.js CHANGED
@@ -3,22 +3,22 @@ export * from './components/carousel/carousel';
3
3
  export * from './components/carousel/carousel.drag';
4
4
  export * from './components/carousel/tiles';
5
5
  export * from './components/cms/calendly';
6
- export * from './components/cms/cloudinary'; // server-side
7
- export * from './components/cms/cloudinary.image';
8
- export * from './components/cms/contentful.delivery'; // server-side
9
- export * from './components/cms/contentful.management'; // server-side
6
+ export * from './components/cms/cloudinary';
7
+ export * from './components/cms/smartimage';
8
+ export * from './components/cms/contentful.delivery';
9
+ export * from './components/cms/contentful.management';
10
10
  export * from './components/cms/contentful.items.components';
11
- export * from './components/cms/flickr'; // server-side
11
+ export * from './components/cms/flickr';
12
12
  export * from './components/cms/google.reviews.components';
13
- export * from './components/cms/google.reviews.functions'; // server-side
14
- export * from './components/cms/gravatar.functions'; // server-side
13
+ export * from './components/cms/google.reviews.functions';
14
+ export * from './components/cms/gravatar.functions';
15
15
  export * from './components/cms/gravatar.components';
16
16
  export * from './components/cms/hubspot.components';
17
- export * from './components/cms/instagram.functions'; // server-side
17
+ export * from './components/cms/instagram.functions';
18
18
  export * from './components/cms/instagram.components';
19
19
  /* export * from './components/linkedin/linkedin'; */
20
20
  export * from './components/cms/wordpress.components';
21
- export * from './components/cms/wordpress.functions'; // server-side
21
+ export * from './components/cms/wordpress.functions';
22
22
  export * from './components/cms/yelp';
23
23
  export * from './components/config/config.client';
24
24
  export * from './components/config/config.server';
@@ -59,15 +59,15 @@ export * from './components/sitebuilder/form/formvalidator';
59
59
  export * from './components/sitebuilder/form/formengine';
60
60
  export * from './components/sitebuilder/form/formbuilder';
61
61
  export * from './components/sitebuilder/form/formextractor';
62
- export * from './components/sitebuilder/page/lib/componentGeneration'; // server-side
63
- export * from './components/sitebuilder/page/lib/componentMap'; // server-side
64
- export * from './components/sitebuilder/page/lib/componentMetadata'; // server-side
65
- export * from './components/sitebuilder/page/lib/pageStorageLocal'; // server-side
66
- export * from './components/sitebuilder/page/lib/pageStorageContentful'; // server-side
67
- export * from './components/sitebuilder/page/lib/pageStorageTypes'; // server-side
68
- export * from './components/sitebuilder/page/lib/propTypeIntrospection'; // server-side
69
- export * from './components/sitebuilder/page/lib/types'; // server-side
70
- export * from './components/sitebuilder/page/lib/usePageBuilder'; // server-side
62
+ export * from './components/sitebuilder/page/lib/componentGeneration';
63
+ export * from './components/sitebuilder/page/lib/componentMap';
64
+ export * from './components/sitebuilder/page/lib/componentMetadata';
65
+ export * from './components/sitebuilder/page/lib/pageStorageLocal';
66
+ export * from './components/sitebuilder/page/lib/pageStorageContentful';
67
+ export * from './components/sitebuilder/page/lib/pageStorageTypes';
68
+ export * from './components/sitebuilder/page/lib/propTypeIntrospection';
69
+ export * from './components/sitebuilder/page/lib/types';
70
+ export * from './components/sitebuilder/page/lib/usePageBuilder';
71
71
  export * from './components/seo/404';
72
72
  export * from './components/seo/googleanalytics';
73
73
  export * from './components/seo/googlemap';
@@ -81,16 +81,16 @@ export * from './components/seo/schema-blogposting.functions';
81
81
  export * from './components/seo/manifest';
82
82
  export * from './components/seo/metadata.functions';
83
83
  export * from './components/seo/metadata.components';
84
- export * from './components/seo/sitemap'; // server-side
84
+ export * from './components/seo/sitemap';
85
85
  export * from './components/shoppingcart/ebay.components';
86
- export * from './components/shoppingcart/ebay.functions'; // server-side
86
+ export * from './components/shoppingcart/ebay.functions';
87
87
  export * from './components/shoppingcart/paypal';
88
88
  export * from './components/shoppingcart/shoppingcart.components';
89
- export * from './components/shoppingcart/shoppingcart.functions'; // server-side
89
+ export * from './components/shoppingcart/shoppingcart.functions';
90
90
  export * from './components/structured/buzzwordbingo';
91
91
  export * from './components/structured/markdown';
92
92
  export * from './components/structured/recipe';
93
93
  export * from './components/structured/resume';
94
94
  export * from './components/structured/socialcard';
95
95
  export * from './components/structured/timeline';
96
- export * from './components/utilities/functions'; // server-side
96
+ export * from './components/utilities/functions';
@@ -23,6 +23,7 @@ declare const SMARTIMAGE_PROP_TYPES: {
23
23
  quality: PropTypes.Requireable<number>;
24
24
  placeholder: PropTypes.Requireable<string>;
25
25
  blurDataURL: PropTypes.Requireable<string>;
26
+ variant: PropTypes.Requireable<string>;
26
27
  };
27
28
  export type SmartImageProps = InferProps<typeof SMARTIMAGE_PROP_TYPES> & React.ImgHTMLAttributes<HTMLImageElement>;
28
29
  export declare function SmartImage(props: SmartImageProps): import("react/jsx-runtime").JSX.Element;
@@ -50,7 +51,8 @@ export declare namespace SmartImage {
50
51
  quality: PropTypes.Requireable<number>;
51
52
  placeholder: PropTypes.Requireable<string>;
52
53
  blurDataURL: PropTypes.Requireable<string>;
54
+ variant: PropTypes.Requireable<string>;
53
55
  };
54
56
  }
55
57
  export {};
56
- //# sourceMappingURL=cloudinary.image.d.ts.map
58
+ //# sourceMappingURL=smartimage.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"smartimage.d.ts","sourceRoot":"","sources":["../../../../src/components/cms/smartimage.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAmDnD,QAAA,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;CAwB1B,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,GAAG,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;AACnH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CA4IhD;yBA5Ie,UAAU"}
@@ -1 +1 @@
1
- {"version":3,"file":"config.client.d.ts","sourceRoot":"","sources":["../../../../src/components/config/config.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,eAAO,MAAM,6BAA6B,GAAI,uBAG3C;IACD,MAAM,EAAE,eAAe,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,4CAEA,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,QAAO,eAUrC,CAAC;AAEF,iEAAiE"}
1
+ {"version":3,"file":"config.client.d.ts","sourceRoot":"","sources":["../../../../src/components/config/config.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,eAAO,MAAM,6BAA6B,GAAI,uBAG3C;IACD,MAAM,EAAE,eAAe,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,4CAEA,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,QAAO,eAiBrC,CAAC;AAEF,iEAAiE"}
@@ -4,6 +4,7 @@ import './accordion.css';
4
4
  export interface AccordionItem {
5
5
  title: string;
6
6
  content: string | React.ReactNode;
7
+ open?: boolean | null;
7
8
  }
8
9
  export type AccordionType = InferProps<typeof Accordion.propTypes>;
9
10
  export declare function Accordion({ items }: AccordionType): import("react/jsx-runtime").JSX.Element;
@@ -12,6 +13,7 @@ export declare namespace Accordion {
12
13
  items: PropTypes.Validator<(PropTypes.InferProps<{
13
14
  title: PropTypes.Validator<string>;
14
15
  content: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike>>>;
16
+ open: PropTypes.Requireable<boolean>;
15
17
  }> | null | undefined)[]>;
16
18
  };
17
19
  }
@@ -1 +1 @@
1
- {"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/general/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;CACnC;AAUD,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,aAAa,2CA2BjD;yBA3Be,SAAS"}
1
+ {"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/general/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;CACvB;AAWD,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,aAAa,2CA2BjD;yBA3Be,SAAS"}
@@ -30,7 +30,7 @@ export declare namespace PageSection {
30
30
  backgroundImage: PropTypes.Requireable<string>;
31
31
  columns: PropTypes.Requireable<number>;
32
32
  autoFlow: PropTypes.Requireable<"row" | "column" | "dense" | "row dense" | "column dense">;
33
- justifyItems: PropTypes.Requireable<"center" | "start" | "end" | "stretch">;
33
+ justifyItems: PropTypes.Requireable<"center" | "end" | "start" | "stretch">;
34
34
  responsive: PropTypes.Requireable<PropTypes.InferProps<{
35
35
  mobile: PropTypes.Requireable<number>;
36
36
  tablet: PropTypes.Requireable<number>;
@@ -38,8 +38,8 @@ export declare namespace PageSection {
38
38
  }>>;
39
39
  direction: PropTypes.Requireable<"row" | "column" | "row-reverse" | "column-reverse">;
40
40
  wrap: PropTypes.Requireable<"nowrap" | "wrap" | "wrap-reverse">;
41
- justifyContent: PropTypes.Requireable<"center" | "start" | "end" | "space-between" | "space-around" | "space-evenly">;
42
- alignItems: PropTypes.Requireable<"center" | "start" | "end" | "stretch" | "baseline">;
41
+ justifyContent: PropTypes.Requireable<"center" | "end" | "start" | "space-between" | "space-around" | "space-evenly">;
42
+ alignItems: PropTypes.Requireable<"center" | "end" | "start" | "stretch" | "baseline">;
43
43
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
44
44
  };
45
45
  }
@@ -1 +1 @@
1
- {"version":3,"file":"404.d.ts","sourceRoot":"","sources":["../../../../src/components/seo/404.tsx"],"names":[],"mappings":"AACA,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAInD,OAAO,WAAW,CAAC;AAKnB,MAAM,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AACrE,wBAAgB,UAAU,CAAE,KAAK,EAAE,cAAc,2CA+ChD;yBA/Ce,UAAU"}
1
+ {"version":3,"file":"404.d.ts","sourceRoot":"","sources":["../../../../src/components/seo/404.tsx"],"names":[],"mappings":"AAGA,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAInD,OAAO,WAAW,CAAC;AAKnB,MAAM,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AACrE,wBAAgB,UAAU,CAAE,KAAK,EAAE,cAAc,2CAgDhD;yBAhDe,UAAU"}
@@ -1 +1 @@
1
- {"version":3,"file":"ConfigEngine.d.ts","sourceRoot":"","sources":["../../../../../src/components/sitebuilder/config/ConfigEngine.tsx"],"names":[],"mappings":"AAIA,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAAE,2CA8G1F;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAAE,kDAyB1F"}
1
+ {"version":3,"file":"ConfigEngine.d.ts","sourceRoot":"","sources":["../../../../../src/components/sitebuilder/config/ConfigEngine.tsx"],"names":[],"mappings":"AAIA,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAAE,2CA+G1F;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAAE,kDAyB1F"}
@@ -183,7 +183,7 @@ export declare namespace FormButton {
183
183
  id: PropTypes.Validator<string>;
184
184
  text: PropTypes.Requireable<string>;
185
185
  className: PropTypes.Requireable<string>;
186
- onClick: PropTypes.Validator<(...args: any[]) => any>;
186
+ onClick: PropTypes.Requireable<(...args: any[]) => any>;
187
187
  };
188
188
  }
189
189
  export type FormDataListType = InferProps<typeof FormDataList.propTypes>;
@@ -1 +1 @@
1
- {"version":3,"file":"formcomponents.d.ts","sourceRoot":"","sources":["../../../../../src/components/sitebuilder/form/formcomponents.tsx"],"names":[],"mappings":"AAIA,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAInD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,YAAY,CAAC;AAsIpB,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,iBAAS,SAAS,CAAC,KAAK,EAAE,aAAa,2CAYtC;kBAZQ,SAAS;;;;;;;;;;;;;AA4BlB,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,SAAS,CAAC,CAAC;AACvE,iBAAS,WAAW,CAAC,KAAK,EAAE,eAAe,kDA2C1C;kBA3CQ,WAAW;;;;;;;;;;;;AAiFpB,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,2CAmB7C;yBAnBe,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoDzB,MAAM,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AACrE,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,2CAc/C;yBAde,UAAU;;;;;;;;;;;;;;;;;;;;;AA6B1B,MAAM,MAAM,oBAAoB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,SAAS,CAAC,CAAC;AACjF,iBAAS,gBAAgB,CAAC,KAAK,EAAE,oBAAoB,2CAUpD;kBAVQ,gBAAgB;;;;;;;AAyCzB,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,2CAWnD;yBAXe,YAAY;;;;;;;;;;;;;;;;;;;;;;AAmC5B,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,2CAY7C;yBAZe,SAAS;;;;;;;;;;;;;;;;AA4BzB,MAAM,MAAM,mBAAmB,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,CAAC;AAC/E,iBAAS,eAAe,CAAC,KAAK,EAAE,mBAAmB,2CAsBlD;kBAtBQ,eAAe;;;;;;;;;AA6CxB,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,2CAYnD;yBAZe,YAAY;;;;;;;;;;;;;;;;AA6B5B,MAAM,MAAM,sBAAsB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,SAAS,CAAC,CAAC;AACrF,iBAAS,kBAAkB,CAAC,KAAK,EAAE,sBAAsB,2CA2BxD;kBA3BQ,kBAAkB;;;;;;;;AA0C3B,MAAM,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AACrE,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,2CAU/C;yBAVe,UAAU;;;;;;;;;AAuB1B,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,2CAWnD;yBAXe,YAAY;;;;;;AAsB5B,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,4CAI3B;yBAJe,YAAY;;;AAO5B,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,CAAC"}
1
+ {"version":3,"file":"formcomponents.d.ts","sourceRoot":"","sources":["../../../../../src/components/sitebuilder/form/formcomponents.tsx"],"names":[],"mappings":"AAIA,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAInD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,YAAY,CAAC;AAuIpB,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,iBAAS,SAAS,CAAC,KAAK,EAAE,aAAa,2CAYtC;kBAZQ,SAAS;;;;;;;;;;;;;AA4BlB,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,SAAS,CAAC,CAAC;AACvE,iBAAS,WAAW,CAAC,KAAK,EAAE,eAAe,kDA2C1C;kBA3CQ,WAAW;;;;;;;;;;;;AAiFpB,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,2CAmB7C;yBAnBe,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoDzB,MAAM,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AACrE,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,2CAc/C;yBAde,UAAU;;;;;;;;;;;;;;;;;;;;;AA6B1B,MAAM,MAAM,oBAAoB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,SAAS,CAAC,CAAC;AACjF,iBAAS,gBAAgB,CAAC,KAAK,EAAE,oBAAoB,2CAUpD;kBAVQ,gBAAgB;;;;;;;AAyCzB,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,2CAWnD;yBAXe,YAAY;;;;;;;;;;;;;;;;;;;;;;AAmC5B,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AACnE,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,2CAY7C;yBAZe,SAAS;;;;;;;;;;;;;;;;AA4BzB,MAAM,MAAM,mBAAmB,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,CAAC;AAC/E,iBAAS,eAAe,CAAC,KAAK,EAAE,mBAAmB,2CAsBlD;kBAtBQ,eAAe;;;;;;;;;AA6CxB,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,2CAYnD;yBAZe,YAAY;;;;;;;;;;;;;;;;AA6B5B,MAAM,MAAM,sBAAsB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,SAAS,CAAC,CAAC;AACrF,iBAAS,kBAAkB,CAAC,KAAK,EAAE,sBAAsB,2CA2BxD;kBA3BQ,kBAAkB;;;;;;;;AA0C3B,MAAM,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AACrE,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,2CAU/C;yBAVe,UAAU;;;;;;;;;AAuB1B,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,2CAWnD;yBAXe,YAAY;;;;;;AAsB5B,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AACzE,wBAAgB,YAAY,4CAI3B;yBAJe,YAAY;;;AAO5B,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,CAAC"}
@@ -3,7 +3,7 @@ import { ValidationResult, FormValidationContextType } from './formtypes';
3
3
  /**
4
4
  * Centralized field validation service
5
5
  */
6
- export declare function validateField(fieldProps: any, event: React.ChangeEvent<HTMLInputElement> | React.FocusEvent<HTMLInputElement>): Promise<ValidationResult>;
6
+ export declare function validateField(fieldProps: any, event: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | React.FocusEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>): Promise<ValidationResult>;
7
7
  export declare function useFormValidation(): FormValidationContextType;
8
8
  export declare function FormValidationProvider({ children }: {
9
9
  children: React.ReactNode;
@@ -1 +1 @@
1
- {"version":3,"file":"formvalidator.d.ts","sourceRoot":"","sources":["../../../../../src/components/sitebuilder/form/formvalidator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAEhF,OAAO,EAAE,gBAAgB,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAE1E;;GAEG;AACH,wBAAsB,aAAa,CAClC,UAAU,EAAE,GAAG,EACf,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAC7E,OAAO,CAAC,gBAAgB,CAAC,CAyC3B;AAOD,wBAAgB,iBAAiB,8BAMhC;AAED,wBAAgB,sBAAsB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,2CAkCjF;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,QAAQ,EAAE,GAAG,GAAG,gBAAgB,CAarE;AAED,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,GAAG,GAAG,gBAAgB,CAatE;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,GAAG,EAAE,gBAAgB,GAAE,CAAC,CAAC,IAAI,EAAE,GAAG,KAAK,gBAAgB,CAAC,EAAO,GAAG,gBAAgB,CAiB7H"}
1
+ {"version":3,"file":"formvalidator.d.ts","sourceRoot":"","sources":["../../../../../src/components/sitebuilder/form/formvalidator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAEhF,OAAO,EAAE,gBAAgB,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAE1E;;GAEG;AACH,wBAAsB,aAAa,CAClC,UAAU,EAAE,GAAG,EACf,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,iBAAiB,GAAG,mBAAmB,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,iBAAiB,GAAG,mBAAmB,CAAC,GACjK,OAAO,CAAC,gBAAgB,CAAC,CAyC3B;AAOD,wBAAgB,iBAAiB,8BAMhC;AAED,wBAAgB,sBAAsB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,2CAkCjF;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,QAAQ,EAAE,GAAG,GAAG,gBAAgB,CAarE;AAED,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,GAAG,GAAG,gBAAgB,CAatE;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,GAAG,EAAE,gBAAgB,GAAE,CAAC,CAAC,IAAI,EAAE,GAAG,KAAK,gBAAgB,CAAC,EAAO,GAAG,gBAAgB,CAiB7H"}
@@ -8,4 +8,10 @@ export declare function generateKey(): string;
8
8
  export declare function generateUUID(): string;
9
9
  export declare function capitalize(str: string): string;
10
10
  export declare function attributeMap(oldAttribute: string): string;
11
+ /**
12
+ * Adds a single 'change' event listener to the document and uses event delegation
13
+ * to log the event and the value of the target element when a change occurs
14
+ * on an input, select, or textarea element.
15
+ */
16
+ export declare function logAllChange(): void;
11
17
  //# sourceMappingURL=functions.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"functions.d.ts","sourceRoot":"","sources":["../../../../src/components/utilities/functions.ts"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,CAAE,GAAG,EAAE,MAAM,oBAUpC;AAGD,wBAAgB,SAAS,CAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG;;EAmBxC;AAED,wBAAgB,wBAAwB,CAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,QAIhF;AAED,wBAAgB,aAAa,CAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,UAOtD;AAED,wBAAgB,WAAW,WAc1B;AAED,wBAAgB,YAAY,WAK3B;AAED,wBAAgB,UAAU,CAAE,GAAG,EAAE,MAAM,UAEtC;AAQD,wBAAgB,YAAY,CAAE,YAAY,EAAE,MAAM,UAgCjD"}
1
+ {"version":3,"file":"functions.d.ts","sourceRoot":"","sources":["../../../../src/components/utilities/functions.ts"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,CAAE,GAAG,EAAE,MAAM,oBAUpC;AAGD,wBAAgB,SAAS,CAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG;;EAmBxC;AAED,wBAAgB,wBAAwB,CAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,QAIhF;AAED,wBAAgB,aAAa,CAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,UAOtD;AAED,wBAAgB,WAAW,WAc1B;AAED,wBAAgB,YAAY,WAK3B;AAED,wBAAgB,UAAU,CAAE,GAAG,EAAE,MAAM,UAEtC;AAQD,wBAAgB,YAAY,CAAE,YAAY,EAAE,MAAM,UAgCjD;AAID;;;;OAII;AACJ,wBAAgB,YAAY,SAoB3B"}
@@ -4,7 +4,7 @@ export * from "./components/carousel/carousel.drag";
4
4
  export * from "./components/carousel/tiles";
5
5
  export * from "./components/cms/calendly";
6
6
  export * from "./components/cms/cloudinary";
7
- export * from "./components/cms/cloudinary.image";
7
+ export * from "./components/cms/smartimage";
8
8
  export * from "./components/cms/contentful.delivery";
9
9
  export * from "./components/cms/contentful.management";
10
10
  export * from "./components/cms/contentful.items.components";
@@ -0,0 +1,43 @@
1
+ declare const _default: {
2
+ title: string;
3
+ component: typeof ContentfulMigrationDemo;
4
+ parameters: {
5
+ layout: string;
6
+ docs: {
7
+ description: {
8
+ component: string;
9
+ };
10
+ };
11
+ };
12
+ argTypes: {
13
+ showSuccess: {
14
+ control: string;
15
+ description: string;
16
+ table: {
17
+ defaultValue: {
18
+ summary: string;
19
+ };
20
+ };
21
+ };
22
+ showError: {
23
+ control: string;
24
+ description: string;
25
+ table: {
26
+ defaultValue: {
27
+ summary: string;
28
+ };
29
+ };
30
+ };
31
+ };
32
+ };
33
+ export default _default;
34
+ declare function ContentfulMigrationDemo({ showSuccess, showError }: {
35
+ showSuccess?: boolean | undefined;
36
+ showError?: boolean | undefined;
37
+ }): import("react/jsx-runtime").JSX.Element;
38
+ export declare const Default: () => import("react/jsx-runtime").JSX.Element;
39
+ export declare const WithSuccess: () => import("react/jsx-runtime").JSX.Element;
40
+ export declare const WithError: () => import("react/jsx-runtime").JSX.Element;
41
+ export declare const Stage2Active: () => import("react/jsx-runtime").JSX.Element;
42
+ export declare const Stage3Active: () => import("react/jsx-runtime").JSX.Element;
43
+ //# sourceMappingURL=contentful-migration.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"contentful-migration.stories.d.ts","sourceRoot":"","sources":["../../../../src/stories/admin/contentful-migration.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAuBE;AAuCF,iBAAS,uBAAuB,CAAC,EAAE,WAAmB,EAAE,SAAiB,EAAE;;;CAAA,2CAqT1E;AAED,eAAO,MAAM,OAAO,+CAAoC,CAAC;AAEzD,eAAO,MAAM,WAAW,+CAEvB,CAAC;AAEF,eAAO,MAAM,SAAS,+CAErB,CAAC;AAEF,eAAO,MAAM,YAAY,+CAGxB,CAAC;AAEF,eAAO,MAAM,YAAY,+CAGxB,CAAC"}
@@ -0,0 +1,71 @@
1
+ import React from 'react';
2
+ import { SmartImage, SmartImageProps } from '@/components/cms/smartimage';
3
+ declare const _default: {
4
+ title: string;
5
+ component: typeof SmartImage;
6
+ argTypes: {
7
+ variant: {
8
+ control: string;
9
+ options: string[];
10
+ description: string;
11
+ table: {
12
+ defaultValue: {
13
+ summary: string;
14
+ };
15
+ };
16
+ };
17
+ src: {
18
+ control: string;
19
+ description: string;
20
+ };
21
+ alt: {
22
+ control: string;
23
+ description: string;
24
+ };
25
+ width: {
26
+ control: string;
27
+ description: string;
28
+ };
29
+ height: {
30
+ control: string;
31
+ description: string;
32
+ };
33
+ aboveFold: {
34
+ control: string;
35
+ description: string;
36
+ table: {
37
+ defaultValue: {
38
+ summary: string;
39
+ };
40
+ };
41
+ };
42
+ quality: {
43
+ control: string;
44
+ min: number;
45
+ max: number;
46
+ description: string;
47
+ };
48
+ loading: {
49
+ control: string;
50
+ options: string[];
51
+ description: string;
52
+ table: {
53
+ defaultValue: {
54
+ summary: string;
55
+ };
56
+ };
57
+ };
58
+ };
59
+ };
60
+ export default _default;
61
+ export declare const SmartImagePlayground: {
62
+ render: React.FC<SmartImageProps>;
63
+ args: {
64
+ src: string;
65
+ alt: string;
66
+ width: number;
67
+ height: number;
68
+ variant: string;
69
+ };
70
+ };
71
+ //# sourceMappingURL=smartimage.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"smartimage.stories.d.ts","sourceRoot":"","sources":["../../../../src/stories/general/smartimage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAI1E,wBA4CE;AAcF,eAAO,MAAM,oBAAoB;;;;;;;;;CAShC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=smartimage.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"smartimage.test.d.ts","sourceRoot":"","sources":["../../../src/tests/smartimage.test.tsx"],"names":[],"mappings":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pixelated-tech/components",
3
- "version": "3.3.3",
3
+ "version": "3.3.5",
4
4
  "private": false,
5
5
  "author": {
6
6
  "name": "Pixelated Technologies",
@@ -103,7 +103,7 @@
103
103
  "@types/prop-types": "^15.7.15",
104
104
  "@types/react": "^19.2.7",
105
105
  "@types/react-dom": "^19.2.3",
106
- "@typescript-eslint/eslint-plugin": "^8.50.0",
106
+ "@typescript-eslint/eslint-plugin": "^8.50.1",
107
107
  "@vitejs/plugin-react": "^5.1.2",
108
108
  "@vitest/coverage-v8": "^4.0.16",
109
109
  "@vitest/ui": "^4.0.16",
@@ -126,7 +126,7 @@
126
126
  "jsdom": "^27.3.0",
127
127
  "less-loader": "^12.3.0",
128
128
  "mini-css-extract-plugin": "^2.9.4",
129
- "next": "^16.1.0",
129
+ "next": "^16.1.1",
130
130
  "null-loader": "^4.0.1",
131
131
  "prop-types": "^15.8.1",
132
132
  "react": "^19.2.3",
@@ -1 +0,0 @@
1
- {"version":3,"file":"cloudinary.image.d.ts","sourceRoot":"","sources":["../../../../src/components/cms/cloudinary.image.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAmDnD,QAAA,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;CAuB1B,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,GAAG,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;AACnH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAkIhD;yBAlIe,UAAU"}