@useinsider/guido 2.0.0-beta.bf65edd → 2.0.0-beta.c0d8594

package/dist/package.json.js

@@ -1,4 +1,4 @@
-const o = { stripo: { version: "2.47.0" } }, s = {
+const o = { stripo: { version: "2.52.0" } }, s = {
   guido: o
 };
 export {

package/dist/services/stripoApi.js

@@ -1,8 +1,8 @@
 import { useHttp as m } from "../composables/useHttp.js";
-import { useToaster as u } from "../composables/useToaster.js";
-import { MAX_DEFAULT_TEMPLATE_ID as i } from "../enums/defaults.js";
+import { useToaster as i } from "../composables/useToaster.js";
+import { MAX_DEFAULT_TEMPLATE_ID as p } from "../enums/defaults.js";
 const y = () => {
-  const { get: r } = m(), { handleError: o } = u();
+  const { get: r } = m(), { handleError: o } = i();
   return {
     getToken: async () => {
       try {
@@ -26,17 +26,13 @@ const y = () => {
     getDefaultTemplate: async () => {
       const t = {
         html: "",
-        css: "",
-        forceRecreate: !0
+        css: ""
       };
       try {
-        const c = new URLSearchParams(window.location.search).get("default-template"), s = c ? parseInt(c) : 0, l = s >= 1 && s <= i ? s : 0, { data: n } = await r(
+        const c = new URLSearchParams(window.location.search).get("default-template"), s = c ? parseInt(c) : 0, l = s >= 1 && s <= p ? s : 0, { data: n } = await r(
           `/stripo/default-template/${l}`
         ), a = typeof n == "string" ? JSON.parse(n) : n;
-        return !a || typeof a != "object" || !("html" in a) || !("css" in a) ? t : {
-          ...a,
-          forceRecreate: !0
-        };
+        return !a || typeof a != "object" || !("html" in a) || !("css" in a) ? t : a;
       } catch (e) {
         return o(e, "Failed to fetch default template"), t;
       }

package/dist/src/@types/config/schemas.d.ts

@@ -90,6 +90,8 @@ export declare const TemplateSchema: v.ObjectSchema<{
     }, undefined>, undefined>, readonly []>;
     /** Selected unsubscribe page IDs */
     readonly selectedUnsubscribePages: v.OptionalSchema<v.ArraySchema<v.NumberSchema<undefined>, undefined>, readonly []>;
+    /** Force recreate template in Stripo storage (use true when updating externally modified templates) */
+    readonly forceRecreate: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
 }, undefined>;
 /**
  * Email header configuration (sender name and subject)
@@ -400,6 +402,8 @@ export declare const GuidoConfigSchema: v.ObjectSchema<{
         }, undefined>, undefined>, readonly []>;
         /** Selected unsubscribe page IDs */
         readonly selectedUnsubscribePages: v.OptionalSchema<v.ArraySchema<v.NumberSchema<undefined>, undefined>, readonly []>;
+        /** Force recreate template in Stripo storage (use true when updating externally modified templates) */
+        readonly forceRecreate: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
     }, undefined>, {}>;
     /** Editor settings */
     readonly editor: v.OptionalSchema<v.ObjectSchema<{

package/dist/src/composables/useConfig.d.ts

@@ -31,6 +31,7 @@ export declare const useConfig: () => {
                 } | undefined;
             }[];
             selectedUnsubscribePages: number[];
+            forceRecreate: boolean;
         };
         editor: {
             locale: string;
@@ -116,6 +117,7 @@ export declare const useConfig: () => {
             } | undefined;
         }[];
         selectedUnsubscribePages: number[];
+        forceRecreate: boolean;
     } | null>;
     editor: import("vue").ComputedRef<{
         locale: string;

package/dist/src/config/migrator/itemsBlockMigrator.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Migrates legacy ItemsBlock templates to v2 format
+ * @param html - HTML string containing legacy items blocks
+ * @returns Migrated HTML with replaced variables and cleaned conditionals
+ */
+export declare function migrateItemsBlock(html: string): string;

package/dist/src/extensions/Blocks/CouponBlock/constants.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Control IDs used in the CouponBlock Extension
+ * These IDs are returned by the getId() method of each control
+ */
+export declare enum CouponControlId {
+    TEXT_ALIGN = "coupon-block-text-align-control",
+    TEXT_COLOR = "coupon-block-text-color-control",
+    TEXT_SIZE = "coupon-block-text-size-control",
+    TEXT_STYLE = "coupon-block-text-style-control",
+    TEXT_FONT_FAMILY = "coupon-block-text-font-family-control",
+    TEXT_BACKGROUND = "coupon-block-text-background-control",
+    TEXT_PADDINGS = "coupon-block-text-paddings-control",
+    TEXT_LINE_SPACING = "coupon-block-text-line-spacing-control"
+}

package/dist/src/extensions/Blocks/CouponBlock/controls/index.d.ts

@@ -0,0 +1,108 @@
+/**
+ * CouponBlock Control Instances
+ *
+ * This file generates all control instances for the CouponBlock
+ * using the reusable factory functions from controlFactories.ts
+ *
+ * Note: Factory-generated controls use runtime class generation which TypeScript
+ * cannot fully type-check. The controls are type-safe at runtime.
+ *
+ * These controls apply directly to the selected root element (no targetBlockId/containerSelector)
+ * to ensure styles are applied correctly regardless of nested element structure.
+ */
+export declare const TextAlignControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextColorControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextSizeControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextStyleControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextFontFamilyControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextBackgroundControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextPaddingsControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};
+export declare const TextLineSpacingControl: {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};

package/dist/src/extensions/Blocks/CouponBlock/template.d.ts

@@ -1,3 +1,3 @@
-declare const migrationTemplate = "\n    <td \n        class=\"coupon-block coupon-block-v2 ins-coupon-code esd-block-text esd-extension-block\" \n        esd-extension-block-id=\"coupon-block\"\n    >\n        <p class=\"ins-title\" contenteditable=\"false\">{@COUPON_CODE}</p>\n    </td>\n";
+declare const migrationTemplate = "\n    <td\n        class=\"coupon-block coupon-block-v2 ins-coupon-code esd-block-text esd-extension-block\"\n        esd-extension-block-id=\"coupon-block\"\n    >\n        <p class=\"ins-title\" contenteditable=\"false\">{@COUPON_CODE}</p>\n    </td>\n";
 export declare function getDefaultTemplate(): string;
 export default migrationTemplate;

package/dist/src/extensions/Blocks/Items/controls/button/link.d.ts

@@ -8,7 +8,5 @@ export declare class ButtonLinkControl extends CommonControl {
     getTemplate(): string;
     onRender(): void;
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
-    _listenToFormUpdates(): void;
-    _onLinkChange(value: string): void;
     _getLink(): string;
 }

package/dist/src/extensions/Blocks/Items/controls/image/link.d.ts

@@ -8,7 +8,5 @@ export declare class ImageLinkControl extends CommonControl {
     getTemplate(): string;
     onRender(): void;
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
-    _listenToFormUpdates(): void;
-    _onLinkChange(value: string): void;
     _getLink(): string;
 }

package/dist/src/extensions/Blocks/Items/controls/price/priceOrientation.d.ts

@@ -9,7 +9,7 @@ export declare class PriceOrientationControl extends CommonControl {
     onRender(): void;
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
     _onPriceOrientationChange(value: string): void;
-    private _updateHorizontalLayout;
     private _updateVerticalLayout;
+    private _updateHorizontalLayout;
     _getPriceOrientation(): string;
 }

package/dist/src/extensions/Blocks/Items/controls/settingsControl.d.ts

@@ -31,10 +31,6 @@ export declare class ItemsBlockControl extends CommonControl {
     _updatePrice(price: string): void;
     _updateOriginalPrice(originalPrice: string): void;
     _updateQuantity(quantity: string): void;
-    /**
-     * @todo Optimize template reordering for performance.
-     * @description Reorders the template structure based on current orientation and visibility settings.
-     */
     _reOrderTemplate(): void;
     _updateDataTypeAttributes(itemsType: ProductType): void;
     _updateDataNumberAttributes(itemId: string): void;

package/dist/src/extensions/Blocks/Items/template.d.ts

@@ -1,6 +1,8 @@
+import type { ItemsBlockConfig } from './utils/nodeConfigUtils';
 declare const migrationTemplate = "ADD YOUR MIGRATION HERE";
 type ProductType = 'CART_ITEMS' | 'BROWSED_ITEMS' | 'PURCHASED_ITEMS';
 type OrientationType = 'vertical' | 'horizontal';
+type PriceOrientationType = 'vertical' | 'horizontal';
 type TemplateParameters = {
     orientation: OrientationType;
     itemsType: ProductType;
@@ -8,6 +10,23 @@ type TemplateParameters = {
     currencySymbol?: string;
     currencyLocation?: string;
     formattedPrice?: boolean;
+    migrate?: boolean;
+    /** Legacy config format (data-* attributes from esd-config-block) */
+    configBlockAttributes?: Record<string, string>;
+    /** New config format (Stripo V2 nodeConfig from esd-ext-config) */
+    nodeConfig?: Partial<ItemsBlockConfig>;
+    /** Extracted styles from a[product-attr="name"] for migration */
+    nameStyles?: string;
+    /** Extracted styles from a.es-button for migration */
+    buttonStyles?: string;
+    /** Extracted styles from p[product-attr="price"] for migration */
+    priceStyles?: string;
+    /** Extracted styles from p[product-attr="originalPrice"] for migration */
+    originalPriceStyles?: string;
+    /** Extracted styles from p[product-attr="quantity"] for migration */
+    quantityStyles?: string;
+    /** Price orientation within the card ('vertical' = stacked, 'horizontal' = side-by-side) */
+    priceOrientation?: PriceOrientationType;
 };
 /**
  * Generates the default template for the Items Block.
@@ -20,5 +39,5 @@ type TemplateParameters = {
  * @param params.formattedPrice - Whether to use formatted price display
  * @returns HTML template string for the Items Block
  */
-export declare function getDefaultTemplate({ orientation, itemsType, itemId, currencySymbol, currencyLocation, formattedPrice, }: TemplateParameters): string;
+export declare function getDefaultTemplate({ orientation, itemsType, itemId, currencySymbol, currencyLocation, migrate, formattedPrice, configBlockAttributes, nodeConfig, nameStyles, buttonStyles, priceStyles, originalPriceStyles, quantityStyles, priceOrientation, }: TemplateParameters): string;
 export default migrationTemplate;

package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts

@@ -0,0 +1,71 @@
+import { OrientationType, ProductType } from '@@/Types/extensions/items';
+import { ImmutableHtmlNode, ImmutableHtmlElementNode, ControlApi, BlockApi } from '@stripoinc/ui-editor-extensions';
+/**
+ * Typed configuration object for Items Block.
+ * Replaces the deprecated esd-config-block data-* attributes approach.
+ * Configuration is stored directly on the block node using Stripo V2's getNodeConfig/setNodeConfig API.
+ */
+export interface ItemsBlockConfig {
+    initialized: boolean;
+    blockInstanceId: string;
+    source: ProductType;
+    type: ProductType;
+    itemsSelectValue: string;
+    orientation: OrientationType;
+    nameTrimming: boolean;
+    nameControlEnabled: boolean;
+    priceHideDiscount: boolean;
+    priceFormatted: boolean;
+    priceCurrencySymbol: string;
+    priceCurrencyLocation: string;
+    priceControlOpened: boolean;
+    priceOrientation: 'vertical' | 'horizontal';
+    quantityControlEnabled: boolean;
+    buttonLink: string;
+    imageLink: string;
+    buttonLabel: string;
+    imageVisible: boolean;
+    nameVisible: boolean;
+    quantityVisible: boolean;
+    priceVisible: boolean;
+    originalPriceVisible: boolean;
+    buttonVisible: boolean;
+}
+/**
+ * Generates a unique block instance ID.
+ */
+export declare function generateBlockInstanceId(): string;
+/**
+ * Returns default ItemsBlockConfig values.
+ * These are used when initializing a new block or when migrating from legacy format.
+ */
+export declare function getDefaultItemsBlockConfig(): ItemsBlockConfig;
+/**
+ * Gets the Items block container element from the current node.
+ * The container is identified by the `.items-block-v2` class (new) or `.esd-cart-items-block` (legacy).
+ * @param currentNode - The current node from the control (usually this.currentNode)
+ * @returns The container element or null if not found
+ */
+export declare function getItemsBlockContainer(currentNode: ImmutableHtmlNode | undefined): ImmutableHtmlElementNode | null;
+/**
+ * Gets the node configuration from the Items block.
+ * Uses Stripo V2's getNodeConfig() API.
+ * Falls back to migrating from legacy esd-config-block if nodeConfig is empty.
+ * @param currentNode - The current node from the control
+ * @returns The ItemsBlockConfig object or null if not found
+ */
+export declare function getItemsBlockConfig(currentNode: ImmutableHtmlNode | undefined): ItemsBlockConfig | null;
+/**
+ * Sets the node configuration on the Items block.
+ * Uses Stripo V2's setNodeConfig() API.
+ * @param currentNode - The current node from the control
+ * @param api - The API object (ControlApi or BlockApi)
+ * @param config - The configuration to set (partial update supported)
+ */
+export declare function setItemsBlockConfig(currentNode: ImmutableHtmlNode | undefined, api: ControlApi | BlockApi, config: Partial<ItemsBlockConfig>): void;
+/**
+ * Gets the block instance ID from the node config.
+ * @param currentNode - The current node from the control
+ * @returns The block instance ID or null if not found
+ */
+export declare function getBlockInstanceIdFromConfig(currentNode: ImmutableHtmlNode | undefined): string | null;

package/dist/src/extensions/Blocks/common-control.d.ts

@@ -56,25 +56,30 @@ export declare abstract class CommonControl extends Control {
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
     onDestroy(): void;
     /**
-     * Gets the config block element from the current node.
+     * Gets the Items block container element from the current node.
+     * @returns The container element or null if not found
+     */
+    protected getItemsBlockContainer(): ImmutableHtmlElementNode | null;
+    /**
+     * Gets the config block element from the current node (legacy support).
+     * @deprecated Use getNodeConfig() from nodeConfigUtils instead for Stripo V2
      * @returns The config block element or null if not found
      */
     protected getConfigBlock(): ImmutableHtmlElementNode | null;
     /**
-     * Gets the current block instance ID from the config block.
-     * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
+     * Gets the current block instance ID from the node config (Stripo V2) or legacy config block.
      * @returns The block instance ID or null if not found
      */
-    protected getBlockInstanceId(blockInstanceIdAttribute?: string): string | null;
+    protected getBlockInstanceId(): string | null;
     /**
      * Handles block instance change detection and syncing.
-     * This is a helper method for controls that need to sync attributes when switching between block instances.
-     * @param syncFunction - Function to call when block instance changes (to sync from attributes)
+     * This is a helper method for controls that need to sync config when switching between block instances.
+     * Uses Stripo V2 nodeConfig API for block instance tracking.
+     * @param syncFunction - Function to call when block instance changes (to sync from node config)
      * @param updateUI - Function to call to update the UI (called both on change and when same block)
-     * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
      * @returns true if block instance changed, false otherwise
      */
-    protected handleBlockInstanceChange(syncFunction: (node: ImmutableHtmlNode) => void, updateUI: () => void, blockInstanceIdAttribute?: string): boolean;
+    protected handleBlockInstanceChange(syncFunction: (node: ImmutableHtmlNode) => void, updateUI: () => void): boolean;
     _GuLabel({ text, name, position }: LabelProps): string;
     _GuToggle(name: string): string;
     _GuSelectItem({ text, value }: {

package/dist/src/extensions/Blocks/controlFactories.d.ts

@@ -12,8 +12,9 @@
 import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
 /**
  * Factory function to create text align controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createTextAlignControl(controlId: string, targetBlockId: string, containerSelector: string): {
+export declare function createTextAlignControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -27,8 +28,9 @@ export declare function createTextAlignControl(controlId: string, targetBlockId:
 };
 /**
  * Factory function to create text color controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createTextColorControl(controlId: string, targetBlockId: string, containerSelector?: string): {
+export declare function createTextColorControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -42,8 +44,9 @@ export declare function createTextColorControl(controlId: string, targetBlockId:
 };
 /**
  * Factory function to create text size controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createTextSizeControl(controlId: string, targetBlockId: string, containerSelector?: string): {
+export declare function createTextSizeControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -57,8 +60,9 @@ export declare function createTextSizeControl(controlId: string, targetBlockId:
 };
 /**
  * Factory function to create text style controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createTextStyleControl(controlId: string, targetBlockId: string, containerSelector?: string): {
+export declare function createTextStyleControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -72,8 +76,9 @@ export declare function createTextStyleControl(controlId: string, targetBlockId:
 };
 /**
  * Factory function to create text font family controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createTextFontFamilyControl(controlId: string, targetBlockId: string, containerSelector?: string): {
+export declare function createTextFontFamilyControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -87,8 +92,9 @@ export declare function createTextFontFamilyControl(controlId: string, targetBlo
 };
 /**
  * Factory function to create text background color controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createTextBackgroundColorControl(controlId: string, targetBlockId: string, containerSelector?: string): {
+export declare function createTextBackgroundColorControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -102,8 +108,25 @@ export declare function createTextBackgroundColorControl(controlId: string, targ
 };
 /**
  * Factory function to create paddings controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
  */
-export declare function createPaddingsControl(controlId: string, targetBlockId: string, containerSelector?: string): {
+export declare function createPaddingsControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
+    new (): {
+        getId(): string;
+        getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        getAdditionalModifications(_root: ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        isVisible(_node: ImmutableHtmlNode): boolean;
+    };
+};
+/**
+ * Factory function to create text line spacing controls for different block elements
+ * When targetBlockId and containerSelector are not provided, applies directly to root
+ */
+export declare function createTextLineSpacingControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
     new (): {
         getId(): string;
         getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];

package/dist/src/stores/config.d.ts

@@ -36,6 +36,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -127,6 +128,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -218,6 +220,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -309,6 +312,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -400,6 +404,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -491,6 +496,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -582,6 +588,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -673,6 +680,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -764,6 +772,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -855,6 +864,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -946,6 +956,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -1037,6 +1048,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -1128,6 +1140,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -1219,6 +1232,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -1310,6 +1324,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -1401,6 +1416,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;
@@ -1492,6 +1508,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     } | undefined;
                 }[];
                 selectedUnsubscribePages: number[];
+                forceRecreate: boolean;
             };
             editor: {
                 locale: string;