@finsweet/webflow-apps-utils 1.0.1

package/dist/utils/constants.js

@@ -0,0 +1,73 @@
+/**
+ * Wized
+ */
+export const WIZED = 'wized';
+export const WIZED_LEGACY = 'w-el';
+export const WIZED_ELEMENTS_SITEMAPS = 'wized-elements-sitemaps';
+export const WIZED_ATTRIBUTES_ENDPOINT = 'https://server.wized.com/v2/site/attributes';
+export const WIZED_ATTRIBUTES_ENDPOINT_STAGING = 'https://ss.wized.com/v2/site/attributes';
+export const WIZED_REVERSE_PROXY_URL = 'https://server.wized.com/v2/page/proxy?url=';
+export const FINSWEET_REVERSE_PROXY_URL = 'https://api.finsweet.com/cors?url=';
+export const WIZED_V2_SITE_CONFIGURATION_ENDPOINT = 'https://server.wized.com/v2/extensions/configuration';
+export const WIZED_V2_SITE_CONFIGURATION_ENDPOINT_STAGING = 'https://ss.wized.com/v2/extensions/configuration';
+export const FINSWEET_SUBSCRIPTIONS_ENDPOINT = 'https://accounts.finsweet.com/v1/subscriptions';
+export const FINSWEET_SUBSCRIPTIONS_ENDPOINT_STAGING = 'https://test-accounts.finsweet.com/v1/subscriptions';
+export const WIZED_PROD_SUBSCRIPTIONS_API = 'http://accounts.finsweet.com';
+export const WIZED_DEV_SUBSCRIPTIONS_API = 'http://test-accounts.finsweet.com';
+export const WIZED_PROD_SUBSCRIPTION_PAGE_URL = 'https://my.finsweet.com/subscriptions/create?product=finsweet-community';
+export const WIZED_APP_CONFIGURATOR_STAGING = 'https://sa.wized.com/configurator';
+export const WIZED_APP_CONFIGURATOR_PROD = 'https://app.wized.com/configurator';
+/**
+ * Finsweet Components
+ */
+export const ACCOUNTS_API_PRODUCTION = 'https://accounts.finsweet.com/v1/components/verify?';
+export const ACCOUNTS_API_DEV = 'https://test-accounts.finsweet.com/v1/components/verify?';
+export const COMPONENTS_SUBSCRIPTIONS_ENDPOINT_DEV = 'https://test-my.finsweet.com/subscriptions/create';
+export const COMPONENTS_SUBSCRIPTIONS_ENDPOINT_PROD = 'https://my.finsweet.com/subscriptions/create';
+export const PROD_FINSWEEET_ACCOUNTS_ORIGIN = 'https://accounts.finsweet.com';
+export const AUTH0_DOMAIN = 'finsweet.auth0.com';
+export const AUTH0_CLIENT_ID = '5xTAnXb3mwUby3YGJRKJpVaNCMWqXtb1';
+export const AUTH0_REDIRECT_URL = 'https://accounts.finsweet.com/v1/auth0/oauth2/fs-components';
+export const AUTH0_SCOPE = 'openid profile email offline_access';
+export const AUTH0_AUDIENCE = 'https://sso.finsweet.com';
+export const AUTH0_LOGIN_URL = 'https://sso.finsweet.com/authorize';
+/**
+ * Finsweet Components Server
+ */
+export const COMPONENTS_SERVER_DEV_ENDPOINT = 'https://fs-components-api-dev.finsweet.workers.dev/v1/';
+export const COMPONENTS_SERVER_PROD_ENDPOINT = 'https://fs-components-api-prod.finsweet.workers.dev/v1/';
+export const COMPONENTS_CORE_SCRIPT = 'https://cdn.jsdelivr.net/npm/@finsweet/fs-components@2/fs-components.js';
+/**
+ * Finsweet Components Local
+ */
+export const COMPONENTS_SERVER_DEV_ENDPOINT_LOCAL = 'http://localhost:8787/v1/';
+export const COMPONENTS_CORE_SCRIPT_LOCAL = 'http://localhost:3000/fs-components.js';
+/**
+ * Finsweet Components Brand
+ */
+export const BRAND = {
+    FINSWEET: 'Finsweet',
+    COMPONENT: 'Component',
+    COMPONENTS: 'Components',
+    FULL: {
+        SINGULAR: 'Finsweet Component',
+        PLURAL: 'Finsweet Components'
+    }
+};
+/**
+ * Webflow App Origins
+ */
+export const FINSWEET_COMPONENTS_WEBFLOW_APP_ORIGINS = [
+    'http://localhost:1337',
+    'https://6544eda5f000985a163a8687.webflow-ext.com',
+    'https://64b2e4cfe025c96ef1c8baf4.webflow-ext.com',
+    'https://654d8ce9d9b49c7fd929a451.webflow-ext.com'
+];
+export const ACCEPTED_WEBFLOW_ELEMENTS_FOR_INSERTION = [
+    'Body',
+    'Block',
+    'DOM',
+    'Section',
+    'Container',
+    'BlockContainer'
+];

package/dist/utils/custom-code/api.d.ts

@@ -0,0 +1,17 @@
+import type { CustomCodeBlock } from '../../types';
+/**
+ * A utility function for getting stored Custom Code based on id.
+ * @param {string} id - The Custom Code block ID identifier. If not provided, all stored configs will be returned.
+ * @returns {CustomCodeBlock | null} The stored configs, or null if not found.
+ */
+export declare const getCustomCode: (id?: string) => Promise<Array<CustomCodeBlock>>;
+/**
+ * A utility function for setting a value in Custom Code.
+ * @param {CustomCodeBlock} customCodeBlock - The custom code block to be stored.
+ * @returns {Promise<void>} A promise that resolves when the operation is complete.
+ */
+export declare const setCustomCode: (customCodeBlock: Array<CustomCodeBlock>) => Promise<void>;
+/**
+ * A utility function for removing Custom Code block.
+ */
+export declare const removeCustomCode: () => boolean;

package/dist/utils/custom-code/api.js

@@ -0,0 +1,41 @@
+import { getLogger } from '../logger';
+const logger = getLogger('webflow-apps-ui-utils');
+/**
+ * A utility function for getting stored Custom Code based on id.
+ * @param {string} id - The Custom Code block ID identifier. If not provided, all stored configs will be returned.
+ * @returns {CustomCodeBlock | null} The stored configs, or null if not found.
+ */
+export const getCustomCode = async (id) => {
+    //TODO: update this when typings are available plus any other place we have disabled this warning.
+    //@ts-expect-error - not available in typings for now
+    const customCodeBlock = (await webflow.getSiteCustomCode());
+    if (!customCodeBlock || customCodeBlock.length === 0)
+        return [];
+    if (!id)
+        return customCodeBlock;
+    const storedConfigs = customCodeBlock.filter((block) => block.id === id);
+    if (storedConfigs)
+        return storedConfigs;
+    return [];
+};
+/**
+ * A utility function for setting a value in Custom Code.
+ * @param {CustomCodeBlock} customCodeBlock - The custom code block to be stored.
+ * @returns {Promise<void>} A promise that resolves when the operation is complete.
+ */
+export const setCustomCode = async (customCodeBlock) => {
+    try {
+        //@ts-expect-error - not available in typings for now
+        await webflow.setSiteCustomCode(customCodeBlock);
+    }
+    catch (error) {
+        logger.error({}, 'Failed to save custom code block', error, customCodeBlock);
+    }
+};
+/**
+ * A utility function for removing Custom Code block.
+ */
+export const removeCustomCode = () => {
+    //TODO: implement when available
+    return true;
+};

package/dist/utils/custom-code/index.d.ts

@@ -0,0 +1 @@
+export * from './api';

package/dist/utils/custom-code/index.js

@@ -0,0 +1 @@
+export * from './api';

package/dist/utils/helpers/cleanupTooltipMessage.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Handle fullstop at the end of the message.
+ * @param message
+ */
+export declare const cleanupTooltipMessage: (message: string) => string;

package/dist/utils/helpers/cleanupTooltipMessage.js

@@ -0,0 +1,25 @@
+/**
+ * Handle fullstop at the end of the message.
+ * @param message
+ */
+export const cleanupTooltipMessage = (message) => {
+    if (!message?.trim())
+        return message;
+    const trimmed = message.trim();
+    if (!trimmed)
+        return message;
+    // Check if there's any period anywhere in the text
+    const hasPeriod = trimmed.includes('.');
+    if (hasPeriod) {
+        // If there's a period somewhere, ensure it ends with a period
+        if (!trimmed.endsWith('.')) {
+            return trimmed + '.';
+        }
+        return trimmed;
+    }
+    // If there's no period anywhere, remove any trailing period
+    if (trimmed.endsWith('.')) {
+        return trimmed.slice(0, -1);
+    }
+    return trimmed;
+};

package/dist/utils/helpers/goto.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Navigate to a new path. This uses the current hash from the router store.
+ * It then users svelte-routing's navigate function to navigate to the new path.
+ * @param path - The path to navigate to. Defaults to '/'.
+ * @param state - The state to pass to the new path. Read more about state here: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
+ */
+export declare const goto: (path?: string, state?: Record<string, unknown>) => void;

package/dist/utils/helpers/goto.js

@@ -0,0 +1,35 @@
+import { get } from 'svelte/store';
+import { navigate } from 'svelte-routing';
+import { routerStore } from '../../stores';
+import { getLogger } from '../logger';
+const logger = getLogger('webflow-apps-ui-utils');
+/**
+ * Normalize a URL path to ensure it starts with a single slash and is parsed correctly by the URL constructor.
+ * @param path
+ * @returns
+ */
+const normalizeUrlPath = (path, hash) => {
+    const safePath = path.replace(/([^:]\/)\/+/g, '$1');
+    const parts = safePath.split(hash);
+    const prefix = parts[0];
+    const suffix = parts[parts.length - 1];
+    const final = prefix + hash + suffix;
+    const url = new URL(final, window.location.origin);
+    return url;
+};
+/**
+ * Navigate to a new path. This uses the current hash from the router store.
+ * It then users svelte-routing's navigate function to navigate to the new path.
+ * @param path - The path to navigate to. Defaults to '/'.
+ * @param state - The state to pass to the new path. Read more about state here: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
+ */
+export const goto = (path = '/', state = {}) => {
+    const { hash = '' } = get(routerStore);
+    if (!hash) {
+        logger.error({}, 'goto method found no router hash in the router store. Contact Finsweet support.');
+        return;
+    }
+    const url = normalizeUrlPath(`/${hash}/${path}`, hash);
+    navigate(url.pathname, { state: { ...state } });
+    routerStore.update((state) => ({ ...state, url }));
+};

package/dist/utils/helpers/index.d.ts

@@ -0,0 +1,5 @@
+export * from './cleanupTooltipMessage';
+export * from './goto';
+export * from './noop';
+export * from './numbers';
+export * from './trimText';

package/dist/utils/helpers/index.js

@@ -0,0 +1,5 @@
+export * from './cleanupTooltipMessage';
+export * from './goto';
+export * from './noop';
+export * from './numbers';
+export * from './trimText';

package/dist/utils/helpers/noop.d.ts

@@ -0,0 +1,4 @@
+/**
+ * It literally does nothing.
+ */
+export declare const noop: (value?: unknown) => unknown;

package/dist/utils/helpers/noop.js

@@ -0,0 +1,7 @@
+/**
+ * It literally does nothing.
+ */
+export const noop = (value) => {
+    // No operation.
+    return value;
+};

package/dist/utils/helpers/numbers.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Converts a string to a number, removing any invalid symbols like `$` or `,`.
+ * @param value A string number.
+ * @returns The valid number value.
+ */
+export declare const normalizeNumber: (value: string) => number | undefined;
+/**
+ * Parses a numeric Attribute string.
+ * @param rawValue The raw string. Example: "20", "-25.3"...
+ * @param fallback A value to fall back to when the parsed value is not valid.
+ */
+export declare function parseNumericAttribute(rawValue: string | number | null | undefined, fallback: number): number;
+export declare function parseNumericAttribute(rawValue: string | number | null | undefined, fallback?: number | null): number | null;
+/**
+ * Calculates the amount of decimals that a float number has.
+ * @param value A number.
+ */
+export declare const getDecimalPrecision: (value: number) => number;
+/**
+ * Adjusts a numeric value to a step factor.
+ * @param value The numeric value to adjust.
+ * @param step The increment step.
+ * @param precision The step's decimal precision. If not provided, it will be calculated.
+ * @param minRange A minimum range value, used for offsetting.
+ * @returns The adjusted value.
+ */
+export declare const adjustValueToStep: (value: number, step: number, precision?: number, minRange?: number) => number;

package/dist/utils/helpers/numbers.js

@@ -0,0 +1,61 @@
+/**
+ * Converts a string to a number, removing any invalid symbols like `$` or `,`.
+ * @param value A string number.
+ * @returns The valid number value.
+ */
+export const normalizeNumber = (value) => {
+    if (!value)
+        return;
+    return parseFloat(value.replace(/[^0-9.-]+/g, ''));
+};
+export function parseNumericAttribute(rawValue, fallback) {
+    if (!rawValue)
+        return fallback ?? null;
+    const value = Number(rawValue);
+    if (!isNaN(value))
+        return value;
+    if (fallback)
+        return fallback;
+    return null;
+}
+/**
+ * Calculates the amount of decimals that a float number has.
+ * @param value A number.
+ */
+export const getDecimalPrecision = (value) => {
+    if (!isFinite(value))
+        return 0;
+    let exponential = 1;
+    let precision = 0;
+    while (Math.round(value * exponential) / exponential !== value) {
+        exponential *= 10;
+        precision += 1;
+    }
+    return precision;
+};
+/**
+ * Ensures a decimal precision on a number.
+ * @param value The number to handle.
+ * @param precision The amount of decimals.
+ */
+const setDecimalPrecision = (value, precision) => {
+    const pow = Math.pow(10, precision);
+    return Math.round(value * pow) / pow;
+};
+/**
+ * Adjusts a numeric value to a step factor.
+ * @param value The numeric value to adjust.
+ * @param step The increment step.
+ * @param precision The step's decimal precision. If not provided, it will be calculated.
+ * @param minRange A minimum range value, used for offsetting.
+ * @returns The adjusted value.
+ */
+export const adjustValueToStep = (value, step, precision, minRange = 0) => {
+    precision ??= getDecimalPrecision(step);
+    const offset = minRange > 1 ? minRange % step : 0;
+    const remainder = value % step;
+    const floor = offset + value - remainder;
+    if (remainder > step / 2)
+        return setDecimalPrecision(floor + step, precision);
+    return setDecimalPrecision(floor, precision);
+};

package/dist/utils/helpers/objectsToModuleExports.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Converts an array of objects to a single string containing multiple module export statements.
+ * @param exportsArray - Array of objects with variable names and objects.
+ * @returns The combined module export string.
+ */
+export declare const objectsToModuleExports: (exportsArray: Array<{
+    moduleName: string;
+    data: object;
+}>) => string;

package/dist/utils/helpers/objectsToModuleExports.js

@@ -0,0 +1,13 @@
+/**
+ * Converts an array of objects to a single string containing multiple module export statements.
+ * @param exportsArray - Array of objects with variable names and objects.
+ * @returns The combined module export string.
+ */
+export const objectsToModuleExports = (exportsArray) => {
+    return exportsArray
+        .map(({ moduleName, data }) => {
+        const jsonString = JSON.stringify(data, null, 2);
+        return `export const ${moduleName} = ${jsonString};`;
+    })
+        .join('\n\n');
+};

package/dist/utils/helpers/trimText.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Trims the given text in the middle and adds ellipsis if it exceeds the specified maximum length.
+ *
+ * @param text - The input text to be trimmed.
+ * @param maxLength - The maximum length of the trimmed text. Default is 40.
+ * @returns The trimmed text with ellipsis in the middle, if applicable.
+ */
+export declare const trimText: (text: string, maxLength?: number) => string | undefined;
+/**
+ * Trims whitespaces and extra spaces in a given text.
+ *
+ * @param text - The input text to be trimmed.
+ * @returns The trimmed text with removed extra spaces.
+ */
+export declare const trimExtraSpaces: (text: string) => string | undefined;

package/dist/utils/helpers/trimText.js

@@ -0,0 +1,33 @@
+/**
+ * Trims the given text in the middle and adds ellipsis if it exceeds the specified maximum length.
+ *
+ * @param text - The input text to be trimmed.
+ * @param maxLength - The maximum length of the trimmed text. Default is 40.
+ * @returns The trimmed text with ellipsis in the middle, if applicable.
+ */
+export const trimText = (text, maxLength = 40) => {
+    if (!text)
+        return;
+    if (text.length <= maxLength) {
+        return text;
+    }
+    const mid = Math.floor(maxLength / 2);
+    const start = text.slice(0, mid - 1);
+    const end = text.slice(text.length - mid + 2);
+    return `${start}...${end}`;
+};
+/**
+ * Trims whitespaces and extra spaces in a given text.
+ *
+ * @param text - The input text to be trimmed.
+ * @returns The trimmed text with removed extra spaces.
+ */
+export const trimExtraSpaces = (text) => {
+    if (!text)
+        return;
+    // Remove leading and trailing whitespaces
+    const trimmedText = text.trim();
+    // Replace multiple consecutive spaces with a single space
+    const normalizedText = trimmedText.replace(/\s+/g, ' ');
+    return normalizedText;
+};

package/dist/utils/index.d.ts

@@ -0,0 +1,4 @@
+export * from './auth';
+export * from './constants';
+export * from './helpers';
+export * from './logger';

package/dist/utils/index.js

@@ -0,0 +1,4 @@
+export * from './auth';
+export * from './constants';
+export * from './helpers';
+export * from './logger';

package/dist/utils/logger/index.d.ts

@@ -0,0 +1,19 @@
+export type PredefinedLoggerContext = 'finsweet-components' | 'webflow-apps-ui-utils' | 'fast-search' | 'fs-cmp';
+export type LoggerContext = PredefinedLoggerContext | (string & Record<never, never>);
+export interface LogData {
+    [key: string]: any;
+}
+export type LogLevel = 'error' | 'warn' | 'info' | 'log' | 'debug';
+export interface Logger {
+    error: (context: LogData, message: string, ...args: any[]) => void;
+    warn: (context: LogData, message: string, ...args: any[]) => void;
+    info: (context: LogData, message: string, ...args: any[]) => void;
+    log: (context: LogData, message: string, ...args: any[]) => void;
+    debug: (context: LogData, message: string, ...args: any[]) => void;
+}
+/**
+ * Create a logger instance for the given context
+ * @param context - The context/identity for this logger instance
+ * @returns Logger instance with all log methods
+ */
+export declare function getLogger(context: LoggerContext): Logger;

package/dist/utils/logger/index.js

@@ -0,0 +1,41 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { getFinsweetComponentsEnvironment } from '../api';
+/**
+ * Create a logger instance for the given context
+ * @param context - The context/identity for this logger instance
+ * @returns Logger instance with all log methods
+ */
+export function getLogger(context) {
+    const createLogMethod = (level) => {
+        return (logContext, message, ...args) => {
+            const { development } = getFinsweetComponentsEnvironment();
+            if (development) {
+                const contextPrefix = `[${context}]`;
+                const consoleMethod = level === 'log' ? 'log' : level;
+                if (typeof console[consoleMethod] === 'function') {
+                    console[consoleMethod](contextPrefix, message, logContext, ...args);
+                }
+                else {
+                    console.log(contextPrefix, message, logContext, ...args);
+                }
+            }
+            // In production, show warnings in console
+            if (!development && level === 'warn') {
+                const contextPrefix = `[${context}]`;
+                console.warn(contextPrefix, message, logContext, ...args);
+            }
+            // In production, only send errors to LogRocket
+            if (!development && level === 'error') {
+                const contextPrefix = `[${context}]`;
+                console.error(contextPrefix, message, logContext, ...args);
+            }
+        };
+    };
+    return {
+        error: createLogMethod('error'),
+        warn: createLogMethod('warn'),
+        info: createLogMethod('info'),
+        log: createLogMethod('log'),
+        debug: createLogMethod('debug')
+    };
+}

package/dist/utils/webflow-canvas/attributes/getAllWebflowElementAttributes.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Retrieves all custom attributes from a Webflow element.
+ * @param {AnyElement} params.element - The data object of the element.
+ * @returns
+ */
+export declare const getAllWebflowElementAttributes: (element: AnyElement) => Promise<NamedValue[] | null>;

package/dist/utils/webflow-canvas/attributes/getAllWebflowElementAttributes.js

@@ -0,0 +1,19 @@
+import { getLogger } from '../../logger';
+const logger = getLogger('webflow-apps-ui-utils');
+/**
+ * Retrieves all custom attributes from a Webflow element.
+ * @param {AnyElement} params.element - The data object of the element.
+ * @returns
+ */
+export const getAllWebflowElementAttributes = async (element) => {
+    try {
+        if (element?.customAttributes) {
+            return await element?.getAllCustomAttributes();
+        }
+        return null;
+    }
+    catch (error) {
+        logger.error({}, 'Error in getAllWebflowElementAttributes:', error);
+        return null;
+    }
+};

package/dist/utils/webflow-canvas/attributes/getInstanceNamesFromObject.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Get the instance names from an object
+ * @param obj - The object to get the instance names from
+ * @param component - The component key
+ * @param hasInstances - Whether the object has instances
+ * @returns The instance names
+ */
+export declare const getInstanceNamesFromObject: (obj: Record<string, any>, component: string, hasInstances?: boolean) => string[];

package/dist/utils/webflow-canvas/attributes/getInstanceNamesFromObject.js

@@ -0,0 +1,21 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/**
+ * Get the instance names from an object
+ * @param obj - The object to get the instance names from
+ * @param component - The component key
+ * @param hasInstances - Whether the object has instances
+ * @returns The instance names
+ */
+export const getInstanceNamesFromObject = (obj, component, hasInstances) => {
+    if (!obj || typeof obj !== 'object')
+        return [];
+    let target = obj;
+    if (hasInstances) {
+        target = obj?.instances || obj;
+    }
+    return Object.keys(target)
+        ?.map((key) => {
+        return key;
+    })
+        ?.filter(Boolean);
+};

package/dist/utils/webflow-canvas/attributes/getWebflowElementAttribute.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Retrieves the value of a custom attribute on a Webflow element.
+ * @param {AnyElement} params.element - The data object of the element.
+ * @param {String} params.attributeName - The name of the custom attribute to set.
+ * @returns
+ */
+export declare const getWebflowElementAttribute: (element: AnyElement, attributeName: string) => Promise<string | null>;

package/dist/utils/webflow-canvas/attributes/getWebflowElementAttribute.js

@@ -0,0 +1,25 @@
+import { getLogger } from '../../logger';
+const logger = getLogger('webflow-apps-ui-utils');
+/**
+ * Retrieves the value of a custom attribute on a Webflow element.
+ * @param {AnyElement} params.element - The data object of the element.
+ * @param {String} params.attributeName - The name of the custom attribute to set.
+ * @returns
+ */
+export const getWebflowElementAttribute = async (element, attributeName) => {
+    try {
+        if (element?.customAttributes) {
+            return await element?.getCustomAttribute(attributeName);
+        }
+        // @ts-expect-error - getAttribute is not typed
+        if (element?.getAttribute) {
+            // @ts-expect-error - getAttribute is not typed
+            return await element?.getAttribute(attributeName);
+        }
+        return null;
+    }
+    catch (error) {
+        logger.error({}, 'Error in getWebflowElementAttribute:', error);
+        return null;
+    }
+};

package/dist/utils/webflow-canvas/attributes/getWebflowElementTextContent.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Get the text content of the webflow element
+ * @param el
+ * @returns
+ */
+export declare const getWebflowElementTextContent: (selectedElement: AnyElement) => Promise<string>;

package/dist/utils/webflow-canvas/attributes/getWebflowElementTextContent.js

@@ -0,0 +1,26 @@
+/**
+ * Get the text content of the webflow element
+ * @param el
+ * @returns
+ */
+export const getWebflowElementTextContent = async (selectedElement) => {
+    const textContent = [];
+    if (selectedElement?.textContent && selectedElement?.children) {
+        // Get Child Elements
+        const children = await selectedElement.getChildren();
+        // Filter string elements from children
+        const strings = children.filter((child) => child.type === 'String');
+        // Initialize an array to hold text content
+        // Loop over string elements to get text
+        for (const myString of strings) {
+            if (myString.type === 'String') {
+                const text = await myString.getText();
+                if (text)
+                    textContent.push(text);
+            }
+        }
+    }
+    if (textContent.length === 0)
+        return '';
+    return textContent.join(' ');
+};

package/dist/utils/webflow-canvas/attributes/index.d.ts

@@ -0,0 +1,7 @@
+export * from './getAllWebflowElementAttributes';
+export * from './getInstanceNamesFromObject';
+export * from './getWebflowElementAttribute';
+export * from './getWebflowElementTextContent';
+export * from './removeWebflowElementAttribute';
+export * from './setStyles';
+export * from './setWebflowElementAttribute';

package/dist/utils/webflow-canvas/attributes/index.js

@@ -0,0 +1,7 @@
+export * from './getAllWebflowElementAttributes';
+export * from './getInstanceNamesFromObject';
+export * from './getWebflowElementAttribute';
+export * from './getWebflowElementTextContent';
+export * from './removeWebflowElementAttribute';
+export * from './setStyles';
+export * from './setWebflowElementAttribute';

package/dist/utils/webflow-canvas/attributes/removeWebflowElementAttribute.d.ts

@@ -0,0 +1,7 @@
+/**
+ *  Removes the specified attribute from the DOMElement.
+ *  @param {AnyElement} params.element - The data object of the element.
+ *  @param {String} params.attributeName - The name of the custom attribute to remove.
+ *  @param {Boolean} params.notify - Whether to show a notification after the attribute is removed.
+ */
+export declare const removeWebflowElementAttribute: (element: AnyElement, attributeName: string, notify?: boolean) => Promise<null | undefined>;