@dotcms/uve 1.2.1-next.13 → 1.2.1-next.14

package/public.cjs.js

@@ -237,24 +237,10 @@ function getDotContentletAttributes(contentlet, container) {
     'data-dot-inode': contentlet?.inode,
     'data-dot-type': contentlet?.contentType,
     'data-dot-container': container,
-    'data-dot-on-number-of-pages': contentlet?.['onNumberOfPages'] || '1'
-  };
-}
-/**
- * Helper function that returns an object containing analytics-specific data attributes.
- * These attributes are used by the DotCMS Analytics SDK to track content interactions.
- *
- * @param {DotCMSBasicContentlet} contentlet - The contentlet to get the analytics attributes for
- * @returns {DotAnalyticsAttributes} The analytics data attributes
- * @internal
- */
-function getDotAnalyticsAttributes(contentlet) {
-  return {
-    'data-dot-analytics-identifier': contentlet?.identifier,
-    'data-dot-analytics-inode': contentlet?.inode,
-    'data-dot-analytics-basetype': contentlet?.baseType,
-    'data-dot-analytics-contenttype': contentlet?.contentType,
-    'data-dot-analytics-title': contentlet?.['widgetTitle'] || contentlet?.title
+    'data-dot-on-number-of-pages': contentlet?.['onNumberOfPages'] || '1',
+    ...(contentlet?.styleProperties && {
+      'data-dot-style-properties': JSON.stringify(contentlet.styleProperties)
+    })
   };
 }
 /**
@@ -490,7 +476,10 @@ function onContentletHovered(callback) {
       contentType: foundElement.dataset?.['dotType'],
       baseType: foundElement.dataset?.['dotBasetype'],
       widgetTitle: foundElement.dataset?.['dotWidgetTitle'],
-      onNumberOfPages: foundElement.dataset?.['dotOnNumberOfPages']
+      onNumberOfPages: foundElement.dataset?.['dotOnNumberOfPages'],
+      ...(foundElement.dataset?.['dotStyleProperties'] && {
+        styleProperties: JSON.parse(foundElement.dataset['dotStyleProperties'])
+      })
     };
     const vtlFiles = findDotCMSVTLData(foundElement);
     const contentletPayload = {
@@ -614,10 +603,6 @@ const EMPTY_CONTAINER_STYLE_ANGULAR = {
  * @internal
  */
 const CUSTOM_NO_COMPONENT = 'CustomNoComponent';
-// Analytics active flag key
-const ANALYTICS_WINDOWS_ACTIVE_KEY = '__dotAnalyticsActive__';
-// Analytics cleanup function key
-const ANALYTICS_WINDOWS_CLEANUP_KEY = '__dotAnalyticsCleanup';
 
 /**
  * Gets the current state of the Universal Visual Editor (UVE).
@@ -703,57 +688,6 @@ function createUVESubscription(eventType, callback) {
   }
   return eventCallback(callback);
 }
-/**
- * Checks if DotCMS Analytics is active by verifying the global window flag.
- *
- * This function checks for the presence of the `__dotAnalyticsActive__` flag on the window object,
- * which is set by the `@dotcms/analytics` SDK when Analytics is successfully initialized.
- *
- * This utility can be used in any JavaScript framework (React, Angular, Vue, etc.) to conditionally
- * enable analytics-related features or data attributes.
- *
- * @export
- * @returns {boolean} true if Analytics is initialized and active, false otherwise
- *
- * @example
- * ```ts
- * // React example
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * function MyComponent() {
- *   const shouldTrack = isAnalyticsActive();
- *
- *   if (shouldTrack) {
- *     // Add analytics tracking
- *   }
- * }
- * ```
- *
- * @example
- * ```ts
- * // Angular example
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * if (isAnalyticsActive()) {
- *   // Apply analytics attributes to elements
- *   element.setAttribute('data-dot-object', 'contentlet');
- * }
- * ```
- *
- * @example
- * ```ts
- * // Vanilla JavaScript / Any framework
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * if (isAnalyticsActive()) {
- *   console.log('DotCMS Analytics is active');
- * }
- * ```
- */
-function isAnalyticsActive() {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  return typeof window !== 'undefined' && window[ANALYTICS_WINDOWS_ACTIVE_KEY] === true;
-}
 
 /**
  * Sets the bounds of the containers in the editor.
@@ -1176,8 +1110,6 @@ function initUVE(config = {}) {
   };
 }
 
-exports.ANALYTICS_WINDOWS_ACTIVE_KEY = ANALYTICS_WINDOWS_ACTIVE_KEY;
-exports.ANALYTICS_WINDOWS_CLEANUP_KEY = ANALYTICS_WINDOWS_CLEANUP_KEY;
 exports.CUSTOM_NO_COMPONENT = CUSTOM_NO_COMPONENT;
 exports.DEVELOPMENT_MODE = DEVELOPMENT_MODE;
 exports.EMPTY_CONTAINER_STYLE_ANGULAR = EMPTY_CONTAINER_STYLE_ANGULAR;
@@ -1198,7 +1130,6 @@ exports.getClosestDotCMSContainerData = getClosestDotCMSContainerData;
 exports.getColumnPositionClasses = getColumnPositionClasses;
 exports.getContainersData = getContainersData;
 exports.getContentletsInContainer = getContentletsInContainer;
-exports.getDotAnalyticsAttributes = getDotAnalyticsAttributes;
 exports.getDotCMSContainerData = getDotCMSContainerData;
 exports.getDotCMSContentletsBound = getDotCMSContentletsBound;
 exports.getDotCMSPageBounds = getDotCMSPageBounds;
@@ -1207,7 +1138,6 @@ exports.getDotContentletAttributes = getDotContentletAttributes;
 exports.getUVEState = getUVEState;
 exports.initInlineEditing = initInlineEditing;
 exports.initUVE = initUVE;
-exports.isAnalyticsActive = isAnalyticsActive;
 exports.isValidBlocks = isValidBlocks;
 exports.reorderMenu = reorderMenu;
 exports.sendMessageToUVE = sendMessageToUVE;

package/public.esm.js

@@ -235,24 +235,10 @@ function getDotContentletAttributes(contentlet, container) {
     'data-dot-inode': contentlet?.inode,
     'data-dot-type': contentlet?.contentType,
     'data-dot-container': container,
-    'data-dot-on-number-of-pages': contentlet?.['onNumberOfPages'] || '1'
-  };
-}
-/**
- * Helper function that returns an object containing analytics-specific data attributes.
- * These attributes are used by the DotCMS Analytics SDK to track content interactions.
- *
- * @param {DotCMSBasicContentlet} contentlet - The contentlet to get the analytics attributes for
- * @returns {DotAnalyticsAttributes} The analytics data attributes
- * @internal
- */
-function getDotAnalyticsAttributes(contentlet) {
-  return {
-    'data-dot-analytics-identifier': contentlet?.identifier,
-    'data-dot-analytics-inode': contentlet?.inode,
-    'data-dot-analytics-basetype': contentlet?.baseType,
-    'data-dot-analytics-contenttype': contentlet?.contentType,
-    'data-dot-analytics-title': contentlet?.['widgetTitle'] || contentlet?.title
+    'data-dot-on-number-of-pages': contentlet?.['onNumberOfPages'] || '1',
+    ...(contentlet?.styleProperties && {
+      'data-dot-style-properties': JSON.stringify(contentlet.styleProperties)
+    })
   };
 }
 /**
@@ -488,7 +474,10 @@ function onContentletHovered(callback) {
       contentType: foundElement.dataset?.['dotType'],
       baseType: foundElement.dataset?.['dotBasetype'],
       widgetTitle: foundElement.dataset?.['dotWidgetTitle'],
-      onNumberOfPages: foundElement.dataset?.['dotOnNumberOfPages']
+      onNumberOfPages: foundElement.dataset?.['dotOnNumberOfPages'],
+      ...(foundElement.dataset?.['dotStyleProperties'] && {
+        styleProperties: JSON.parse(foundElement.dataset['dotStyleProperties'])
+      })
     };
     const vtlFiles = findDotCMSVTLData(foundElement);
     const contentletPayload = {
@@ -612,10 +601,6 @@ const EMPTY_CONTAINER_STYLE_ANGULAR = {
  * @internal
  */
 const CUSTOM_NO_COMPONENT = 'CustomNoComponent';
-// Analytics active flag key
-const ANALYTICS_WINDOWS_ACTIVE_KEY = '__dotAnalyticsActive__';
-// Analytics cleanup function key
-const ANALYTICS_WINDOWS_CLEANUP_KEY = '__dotAnalyticsCleanup';
 
 /**
  * Gets the current state of the Universal Visual Editor (UVE).
@@ -701,57 +686,6 @@ function createUVESubscription(eventType, callback) {
   }
   return eventCallback(callback);
 }
-/**
- * Checks if DotCMS Analytics is active by verifying the global window flag.
- *
- * This function checks for the presence of the `__dotAnalyticsActive__` flag on the window object,
- * which is set by the `@dotcms/analytics` SDK when Analytics is successfully initialized.
- *
- * This utility can be used in any JavaScript framework (React, Angular, Vue, etc.) to conditionally
- * enable analytics-related features or data attributes.
- *
- * @export
- * @returns {boolean} true if Analytics is initialized and active, false otherwise
- *
- * @example
- * ```ts
- * // React example
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * function MyComponent() {
- *   const shouldTrack = isAnalyticsActive();
- *
- *   if (shouldTrack) {
- *     // Add analytics tracking
- *   }
- * }
- * ```
- *
- * @example
- * ```ts
- * // Angular example
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * if (isAnalyticsActive()) {
- *   // Apply analytics attributes to elements
- *   element.setAttribute('data-dot-object', 'contentlet');
- * }
- * ```
- *
- * @example
- * ```ts
- * // Vanilla JavaScript / Any framework
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * if (isAnalyticsActive()) {
- *   console.log('DotCMS Analytics is active');
- * }
- * ```
- */
-function isAnalyticsActive() {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  return typeof window !== 'undefined' && window[ANALYTICS_WINDOWS_ACTIVE_KEY] === true;
-}
 
 /**
  * Sets the bounds of the containers in the editor.
@@ -1174,4 +1108,4 @@ function initUVE(config = {}) {
   };
 }
 
-export { ANALYTICS_WINDOWS_ACTIVE_KEY as A, getContentletsInContainer as B, CUSTOM_NO_COMPONENT as C, DEVELOPMENT_MODE as D, END_CLASS as E, getDotContainerAttributes as F, setBounds as G, isValidBlocks as H, PRODUCTION_MODE as P, START_CLASS as S, __UVE_EVENTS__ as _, initInlineEditing as a, enableBlockEditorInline as b, createUVESubscription as c, initUVE as d, editContentlet as e, __UVE_EVENT_ERROR_FALLBACK__ as f, getUVEState as g, EMPTY_CONTAINER_STYLE_REACT as h, isAnalyticsActive as i, EMPTY_CONTAINER_STYLE_ANGULAR as j, ANALYTICS_WINDOWS_CLEANUP_KEY as k, getDotCMSPageBounds as l, getDotCMSContentletsBound as m, getDotCMSContainerData as n, getClosestDotCMSContainerData as o, findDotCMSElement as p, findDotCMSVTLData as q, reorderMenu as r, sendMessageToUVE as s, computeScrollIsInBottom as t, updateNavigation as u, combineClasses as v, getColumnPositionClasses as w, getDotContentletAttributes as x, getDotAnalyticsAttributes as y, getContainersData as z };
+export { isValidBlocks as A, CUSTOM_NO_COMPONENT as C, DEVELOPMENT_MODE as D, END_CLASS as E, PRODUCTION_MODE as P, START_CLASS as S, __UVE_EVENTS__ as _, enableBlockEditorInline as a, initUVE as b, createUVESubscription as c, __UVE_EVENT_ERROR_FALLBACK__ as d, editContentlet as e, EMPTY_CONTAINER_STYLE_REACT as f, getUVEState as g, EMPTY_CONTAINER_STYLE_ANGULAR as h, initInlineEditing as i, getDotCMSPageBounds as j, getDotCMSContentletsBound as k, getDotCMSContainerData as l, getClosestDotCMSContainerData as m, findDotCMSElement as n, findDotCMSVTLData as o, computeScrollIsInBottom as p, combineClasses as q, reorderMenu as r, sendMessageToUVE as s, getColumnPositionClasses as t, updateNavigation as u, getDotContentletAttributes as v, getContainersData as w, getContentletsInContainer as x, getDotContainerAttributes as y, setBounds as z };

package/src/internal/constants.d.ts

@@ -74,5 +74,3 @@ export declare const EMPTY_CONTAINER_STYLE_ANGULAR: {
  * @internal
  */
 export declare const CUSTOM_NO_COMPONENT = "CustomNoComponent";
-export declare const ANALYTICS_WINDOWS_ACTIVE_KEY = "__dotAnalyticsActive__";
-export declare const ANALYTICS_WINDOWS_CLEANUP_KEY = "__dotAnalyticsCleanup";

package/src/lib/core/core.utils.d.ts

@@ -47,51 +47,3 @@ export declare function getUVEState(): UVEState | undefined;
  * ```
  */
 export declare function createUVESubscription<T extends UVEEventType>(eventType: T, callback: (payload: UVEEventPayloadMap[T] extends undefined ? void : UVEEventPayloadMap[T]) => void): UVEEventSubscription;
-/**
- * Checks if DotCMS Analytics is active by verifying the global window flag.
- *
- * This function checks for the presence of the `__dotAnalyticsActive__` flag on the window object,
- * which is set by the `@dotcms/analytics` SDK when Analytics is successfully initialized.
- *
- * This utility can be used in any JavaScript framework (React, Angular, Vue, etc.) to conditionally
- * enable analytics-related features or data attributes.
- *
- * @export
- * @returns {boolean} true if Analytics is initialized and active, false otherwise
- *
- * @example
- * ```ts
- * // React example
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * function MyComponent() {
- *   const shouldTrack = isAnalyticsActive();
- *
- *   if (shouldTrack) {
- *     // Add analytics tracking
- *   }
- * }
- * ```
- *
- * @example
- * ```ts
- * // Angular example
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * if (isAnalyticsActive()) {
- *   // Apply analytics attributes to elements
- *   element.setAttribute('data-dot-object', 'contentlet');
- * }
- * ```
- *
- * @example
- * ```ts
- * // Vanilla JavaScript / Any framework
- * import { isAnalyticsActive } from '@dotcms/uve/internal';
- *
- * if (isAnalyticsActive()) {
- *   console.log('DotCMS Analytics is active');
- * }
- * ```
- */
-export declare function isAnalyticsActive(): boolean;

package/src/lib/dom/dom.utils.d.ts

@@ -1,5 +1,5 @@
 import { DotCMSBasicContentlet, DotCMSColumnContainer, DotCMSPageAsset, DotPageAssetLayoutColumn, EditableContainerData } from '@dotcms/types';
-import { DotAnalyticsAttributes, DotCMSContainerBound, DotCMSContentletBound, DotContainerAttributes, DotContentletAttributes } from '@dotcms/types/internal';
+import { DotCMSContainerBound, DotCMSContentletBound, DotContainerAttributes, DotContentletAttributes } from '@dotcms/types/internal';
 /**
  * Calculates the bounding information for each page element within the given containers.
  *
@@ -152,15 +152,6 @@ export declare const getColumnPositionClasses: (column: DotPageAssetLayoutColumn
  * @returns {DotContentletAttributes} The dotCMS data attributes
  */
 export declare function getDotContentletAttributes(contentlet: DotCMSBasicContentlet, container: string): DotContentletAttributes;
-/**
- * Helper function that returns an object containing analytics-specific data attributes.
- * These attributes are used by the DotCMS Analytics SDK to track content interactions.
- *
- * @param {DotCMSBasicContentlet} contentlet - The contentlet to get the analytics attributes for
- * @returns {DotAnalyticsAttributes} The analytics data attributes
- * @internal
- */
-export declare function getDotAnalyticsAttributes(contentlet: DotCMSBasicContentlet): DotAnalyticsAttributes;
 /**
  *
  *

package/src/lib/style-editor/internal.d.ts

@@ -1,4 +1,4 @@
-import { StyleEditorFormSchema, StyleEditorForm } from './types';
+import { StyleEditorForm, StyleEditorFormSchema } from './types';
 /**
  * Normalizes a complete form definition into the schema format expected by UVE.
  *
@@ -32,14 +32,14 @@ import { StyleEditorFormSchema, StyleEditorForm } from './types';
  *     {
  *       title: 'Typography',
  *       fields: [
- *         { type: 'input', label: 'Font Size', inputType: 'number', defaultValue: 16 },
- *         { type: 'dropdown', label: 'Font Family', options: ['Arial', 'Helvetica'] }
+ *         { type: 'input', id: 'font-size', label: 'Font Size', inputType: 'number' },
+ *         { type: 'dropdown', id: 'font-family', label: 'Font Family', options: ['Arial', 'Helvetica'] }
  *       ]
  *     },
  *     {
  *       title: 'Colors',
  *       fields: [
- *         { type: 'input', label: 'Primary Color', inputType: 'text', defaultValue: '#000000' }
+ *         { type: 'input', id: 'primary-color', label: 'Primary Color', inputType: 'text' }
  *       ]
  *     }
  *   ]
@@ -51,8 +51,8 @@ import { StyleEditorFormSchema, StyleEditorForm } from './types';
  * //       title: 'Typography',
  * //       fields: [
  * //         [
- * //           { type: 'input', label: 'Font Size', config: { inputType: 'number', defaultValue: 16 } },
- * //           { type: 'dropdown', label: 'Font Family', config: { options: [...] } }
+ * //           { type: 'input', id: 'font-size', label: 'Font Size', config: { inputType: 'number' } },
+ * //           { type: 'dropdown', id: 'font-family', label: 'Font Family', config: { options: [...] } }
  * //         ]
  * //       ]
  * //     },
@@ -60,7 +60,7 @@ import { StyleEditorFormSchema, StyleEditorForm } from './types';
  * //       title: 'Colors',
  * //       fields: [
  * //         [
- * //           { type: 'input', label: 'Primary Color', config: { inputType: 'text', defaultValue: '#000000' } }
+ * //           { type: 'input', id: 'primary-color', label: 'Primary Color', config: { inputType: 'text' } }
  * //         ]
  * //       ]
  * //     }