@contentstack/live-preview-utils 4.0.1 → 4.1.0

package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/visualBuilder/utils/isFieldDisabled.ts"],"sourcesContent":["import Config from \"../../configManager/configManager\";\nimport { ISchemaFieldMap } from \"./types/index.types\";\nimport { VisualBuilder } from \"..\";\nimport { FieldDetails } from \"../components/FieldToolbar\";\nimport { EntryPermissions } from \"./getEntryPermissions\";\nimport { WorkflowStageDetails } from \"./getWorkflowStageDetails\";\n\nconst DisableReason = {\n    ReadOnly: \"You have only read access to this field\",\n    LocalizedEntry: \"Editing this field is restricted in localized entries\",\n    UnlinkedVariant:\n        \"This field is not editable as it is not linked to the selected variant\",\n    AudienceMode: \"Open an Experience from Audience widget to start editing\",\n    DisabledVariant:\n        \"This field is not editable as it doesn't match the selected variant\",\n    UnlocalizedVariant: \"This field is not editable as it is not localized\",\n    None: \"\",\n    EntryUpdateRestricted: \"You do not have permission to edit this entry\",\n    WorkflowStagePermission: ({ stageName }: { stageName: string }) =>\n        `You do not have Edit access to this entry on the '${stageName}' workflow stage`,\n    EntryUpdateRestrictedRoleAndWorkflowStage: ({\n        stageName,\n    }: {\n        stageName: string;\n    }) =>\n        `Editing is restricted for your role or by the rules for the '${stageName}' stage. Contact your admin for edit access.`,\n} as const;\n\ninterface FieldDisableState {\n    isDisabled: boolean;\n    reason: string;\n}\n\nconst getDisableReason = (\n    flags: Record<string, boolean>,\n    params?: Record<string, any>\n) => {\n    if (flags.updateRestrictDueToRole) return DisableReason.ReadOnly;\n    if (flags.updateRestrictDueToNonLocalizableFields)\n        return DisableReason.LocalizedEntry;\n    if (flags.updateRestrictDueToUnlocalizedVariant)\n        return DisableReason.UnlocalizedVariant;\n    if (flags.updateRestrictDueToUnlinkVariant)\n        return DisableReason.UnlinkedVariant;\n    if (flags.updateRestrictDueToAudienceMode)\n        return DisableReason.AudienceMode;\n    if (flags.updateRestrictDueToDisabledVariant)\n        return DisableReason.DisabledVariant;\n    if (\n        flags.updateRestrictDueToEntryUpdateRestriction &&\n        flags.updateRestrictDueToWorkflowStagePermission\n    ) {\n        return DisableReason.EntryUpdateRestrictedRoleAndWorkflowStage({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    if (flags.updateRestrictDueToEntryUpdateRestriction) {\n        return DisableReason.EntryUpdateRestricted;\n    }\n    if (flags.updateRestrictDueToWorkflowStagePermission) {\n        return DisableReason.WorkflowStagePermission({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    return DisableReason.None;\n};\n\nexport const isFieldDisabled = (\n    fieldSchemaMap: ISchemaFieldMap,\n    eventFieldDetails: FieldDetails,\n    entryPermissions?: EntryPermissions,\n    entryWorkflowStageDetails?: WorkflowStageDetails\n): FieldDisableState => {\n    const { editableElement, fieldMetadata } = eventFieldDetails;\n    const masterLocale = Config.get().stackDetails.masterLocale || \"en-us\";\n    const { locale: cmsLocale, variant } =\n        VisualBuilder.VisualBuilderGlobalState.value;\n\n    const flags: Record<string, boolean> = {\n        updateRestrictDueToRole: Boolean(\n            fieldSchemaMap?.field_metadata?.updateRestrict\n        ),\n        updateRestrictDueToUnlinkVariant: Boolean(\n            fieldSchemaMap?.field_metadata?.isUnlinkedVariant\n        ),\n        updateRestrictDueToUnlocalizedVariant: Boolean(\n            variant && fieldMetadata.locale !== cmsLocale\n        ),\n        updateRestrictDueToNonLocalizableFields: Boolean(\n            fieldSchemaMap?.non_localizable &&\n                masterLocale !== fieldMetadata.locale\n        ),\n        updateRestrictDueToAudienceMode: false,\n        updateRestrictDueToDisabledVariant: false,\n    };\n\n    if (entryPermissions && !entryPermissions.update) {\n        flags.updateRestrictDueToEntryUpdateRestriction = true;\n    }\n\n    if (\n        entryWorkflowStageDetails &&\n        !entryWorkflowStageDetails.permissions.entry.update\n    ) {\n        flags.updateRestrictDueToWorkflowStagePermission = true;\n    }\n\n    if (\n        VisualBuilder.VisualBuilderGlobalState.value.audienceMode &&\n        !editableElement.classList.contains(\"visual-builder__variant-field\") &&\n        !editableElement.classList.contains(\"visual-builder__base-field\")\n    ) {\n        if (\n            editableElement.classList.contains(\n                \"visual-builder__disabled-variant-field\"\n            )\n        ) {\n            flags.updateRestrictDueToDisabledVariant = true;\n        } else {\n            flags.updateRestrictDueToAudienceMode = true;\n        }\n    }\n\n    const isDisabled = Object.values(flags).some(Boolean);\n    const reason = getDisableReason(flags, {\n        stageName: entryWorkflowStageDetails?.stage?.name,\n    });\n\n    return { isDisabled, reason };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAmB;AAEnB,eAA8B;AAK9B,IAAM,gBAAgB;AAAA,EAClB,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,iBACI;AAAA,EACJ,cAAc;AAAA,EACd,iBACI;AAAA,EACJ,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,uBAAuB;AAAA,EACvB,yBAAyB,CAAC,EAAE,UAAU,MAClC,qDAAqD,SAAS;AAAA,EAClE,2CAA2C,CAAC;AAAA,IACxC;AAAA,EACJ,MAGI,gEAAgE,SAAS;AACjF;AAOA,IAAM,mBAAmB,CACrB,OACA,WACC;AACD,MAAI,MAAM,wBAAyB,QAAO,cAAc;AACxD,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MACI,MAAM,6CACN,MAAM,4CACR;AACE,WAAO,cAAc,0CAA0C;AAAA,MAC3D,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,MAAI,MAAM,2CAA2C;AACjD,WAAO,cAAc;AAAA,EACzB;AACA,MAAI,MAAM,4CAA4C;AAClD,WAAO,cAAc,wBAAwB;AAAA,MACzC,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,SAAO,cAAc;AACzB;AAEO,IAAM,kBAAkB,CAC3B,gBACA,mBACA,kBACA,8BACoB;AACpB,QAAM,EAAE,iBAAiB,cAAc,IAAI;AAC3C,QAAM,eAAe,qBAAAA,QAAO,IAAI,EAAE,aAAa,gBAAgB;AAC/D,QAAM,EAAE,QAAQ,WAAW,QAAQ,IAC/B,uBAAc,yBAAyB;AAE3C,QAAM,QAAiC;AAAA,IACnC,yBAAyB;AAAA,MACrB,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,kCAAkC;AAAA,MAC9B,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,uCAAuC;AAAA,MACnC,WAAW,cAAc,WAAW;AAAA,IACxC;AAAA,IACA,yCAAyC;AAAA,MACrC,gBAAgB,mBACZ,iBAAiB,cAAc;AAAA,IACvC;AAAA,IACA,iCAAiC;AAAA,IACjC,oCAAoC;AAAA,EACxC;AAEA,MAAI,oBAAoB,CAAC,iBAAiB,QAAQ;AAC9C,UAAM,4CAA4C;AAAA,EACtD;AAEA,MACI,6BACA,CAAC,0BAA0B,YAAY,MAAM,QAC/C;AACE,UAAM,6CAA6C;AAAA,EACvD;AAEA,MACI,uBAAc,yBAAyB,MAAM,gBAC7C,CAAC,gBAAgB,UAAU,SAAS,+BAA+B,KACnE,CAAC,gBAAgB,UAAU,SAAS,4BAA4B,GAClE;AACE,QACI,gBAAgB,UAAU;AAAA,MACtB;AAAA,IACJ,GACF;AACE,YAAM,qCAAqC;AAAA,IAC/C,OAAO;AACH,YAAM,kCAAkC;AAAA,IAC5C;AAAA,EACJ;AAEA,QAAM,aAAa,OAAO,OAAO,KAAK,EAAE,KAAK,OAAO;AACpD,QAAM,SAAS,iBAAiB,OAAO;AAAA,IACnC,WAAW,2BAA2B,OAAO;AAAA,EACjD,CAAC;AAED,SAAO,EAAE,YAAY,OAAO;AAChC;","names":["Config"]}
+{"version":3,"sources":["../../../../src/visualBuilder/utils/isFieldDisabled.ts"],"sourcesContent":["import Config from \"../../configManager/configManager\";\nimport { ISchemaFieldMap } from \"./types/index.types\";\nimport { VisualBuilder } from \"..\";\nimport { FieldDetails } from \"../components/FieldToolbar\";\nimport { EntryPermissions } from \"./getEntryPermissions\";\nimport { WorkflowStageDetails } from \"./getWorkflowStageDetails\";\n\nconst DisableReason = {\n    ReadOnly: \"You have only read access to this field\",\n    LocalizedEntry: \"Editing this field is restricted in localized entries\",\n    UnlinkedVariant:\n        \"This field is not editable as it is not linked to the selected variant\",\n    AudienceMode: \"To edit an experience, open the Audience widget and click the Edit icon.\",\n    DisabledVariant:\n        \"This field is not editable as it doesn't match the selected variant\",\n    UnlocalizedVariant: \"This field is not editable as it is not localized\",\n    None: \"\",\n    EntryUpdateRestricted: \"You do not have permission to edit this entry\",\n    WorkflowStagePermission: ({ stageName }: { stageName: string }) =>\n        `You do not have Edit access to this entry on the '${stageName}' workflow stage`,\n    EntryUpdateRestrictedRoleAndWorkflowStage: ({\n        stageName,\n    }: {\n        stageName: string;\n    }) =>\n        `Editing is restricted for your role or by the rules for the '${stageName}' stage. Contact your admin for edit access.`,\n} as const;\n\ninterface FieldDisableState {\n    isDisabled: boolean;\n    reason: string;\n}\n\nconst getDisableReason = (\n    flags: Record<string, boolean>,\n    params?: Record<string, any>\n) => {\n    if (flags.updateRestrictDueToRole) return DisableReason.ReadOnly;\n    if (flags.updateRestrictDueToNonLocalizableFields)\n        return DisableReason.LocalizedEntry;\n    if (flags.updateRestrictDueToUnlocalizedVariant)\n        return DisableReason.UnlocalizedVariant;\n    if (flags.updateRestrictDueToUnlinkVariant)\n        return DisableReason.UnlinkedVariant;\n    if (flags.updateRestrictDueToAudienceMode)\n        return DisableReason.AudienceMode;\n    if (flags.updateRestrictDueToDisabledVariant)\n        return DisableReason.DisabledVariant;\n    if (\n        flags.updateRestrictDueToEntryUpdateRestriction &&\n        flags.updateRestrictDueToWorkflowStagePermission\n    ) {\n        return DisableReason.EntryUpdateRestrictedRoleAndWorkflowStage({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    if (flags.updateRestrictDueToEntryUpdateRestriction) {\n        return DisableReason.EntryUpdateRestricted;\n    }\n    if (flags.updateRestrictDueToWorkflowStagePermission) {\n        return DisableReason.WorkflowStagePermission({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    return DisableReason.None;\n};\n\nexport const isFieldDisabled = (\n    fieldSchemaMap: ISchemaFieldMap,\n    eventFieldDetails: FieldDetails,\n    entryPermissions?: EntryPermissions,\n    entryWorkflowStageDetails?: WorkflowStageDetails\n): FieldDisableState => {\n    const { editableElement, fieldMetadata } = eventFieldDetails;\n    const masterLocale = Config.get().stackDetails.masterLocale || \"en-us\";\n    const { locale: cmsLocale, variant } =\n        VisualBuilder.VisualBuilderGlobalState.value;\n\n    const flags: Record<string, boolean> = {\n        updateRestrictDueToRole: Boolean(\n            fieldSchemaMap?.field_metadata?.updateRestrict\n        ),\n        updateRestrictDueToUnlinkVariant: Boolean(\n            fieldSchemaMap?.field_metadata?.isUnlinkedVariant\n        ),\n        updateRestrictDueToUnlocalizedVariant: Boolean(\n            variant && fieldMetadata.locale !== cmsLocale\n        ),\n        updateRestrictDueToNonLocalizableFields: Boolean(\n            fieldSchemaMap?.non_localizable &&\n                masterLocale !== fieldMetadata.locale\n        ),\n        updateRestrictDueToAudienceMode: false,\n        updateRestrictDueToDisabledVariant: false,\n    };\n\n    if (entryPermissions && !entryPermissions.update) {\n        flags.updateRestrictDueToEntryUpdateRestriction = true;\n    }\n\n    if (\n        entryWorkflowStageDetails &&\n        !entryWorkflowStageDetails.permissions.entry.update\n    ) {\n        flags.updateRestrictDueToWorkflowStagePermission = true;\n    }\n\n    if (\n        VisualBuilder.VisualBuilderGlobalState.value.audienceMode &&\n        !editableElement.classList.contains(\"visual-builder__variant-field\") &&\n        !editableElement.classList.contains(\"visual-builder__base-field\")\n    ) {\n        if (\n            editableElement.classList.contains(\n                \"visual-builder__disabled-variant-field\"\n            )\n        ) {\n            flags.updateRestrictDueToDisabledVariant = true;\n        } else {\n            flags.updateRestrictDueToAudienceMode = true;\n        }\n    }\n\n    const isDisabled = Object.values(flags).some(Boolean);\n    const reason = getDisableReason(flags, {\n        stageName: entryWorkflowStageDetails?.stage?.name,\n    });\n\n    return { isDisabled, reason };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAmB;AAEnB,eAA8B;AAK9B,IAAM,gBAAgB;AAAA,EAClB,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,iBACI;AAAA,EACJ,cAAc;AAAA,EACd,iBACI;AAAA,EACJ,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,uBAAuB;AAAA,EACvB,yBAAyB,CAAC,EAAE,UAAU,MAClC,qDAAqD,SAAS;AAAA,EAClE,2CAA2C,CAAC;AAAA,IACxC;AAAA,EACJ,MAGI,gEAAgE,SAAS;AACjF;AAOA,IAAM,mBAAmB,CACrB,OACA,WACC;AACD,MAAI,MAAM,wBAAyB,QAAO,cAAc;AACxD,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MACI,MAAM,6CACN,MAAM,4CACR;AACE,WAAO,cAAc,0CAA0C;AAAA,MAC3D,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,MAAI,MAAM,2CAA2C;AACjD,WAAO,cAAc;AAAA,EACzB;AACA,MAAI,MAAM,4CAA4C;AAClD,WAAO,cAAc,wBAAwB;AAAA,MACzC,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,SAAO,cAAc;AACzB;AAEO,IAAM,kBAAkB,CAC3B,gBACA,mBACA,kBACA,8BACoB;AACpB,QAAM,EAAE,iBAAiB,cAAc,IAAI;AAC3C,QAAM,eAAe,qBAAAA,QAAO,IAAI,EAAE,aAAa,gBAAgB;AAC/D,QAAM,EAAE,QAAQ,WAAW,QAAQ,IAC/B,uBAAc,yBAAyB;AAE3C,QAAM,QAAiC;AAAA,IACnC,yBAAyB;AAAA,MACrB,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,kCAAkC;AAAA,MAC9B,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,uCAAuC;AAAA,MACnC,WAAW,cAAc,WAAW;AAAA,IACxC;AAAA,IACA,yCAAyC;AAAA,MACrC,gBAAgB,mBACZ,iBAAiB,cAAc;AAAA,IACvC;AAAA,IACA,iCAAiC;AAAA,IACjC,oCAAoC;AAAA,EACxC;AAEA,MAAI,oBAAoB,CAAC,iBAAiB,QAAQ;AAC9C,UAAM,4CAA4C;AAAA,EACtD;AAEA,MACI,6BACA,CAAC,0BAA0B,YAAY,MAAM,QAC/C;AACE,UAAM,6CAA6C;AAAA,EACvD;AAEA,MACI,uBAAc,yBAAyB,MAAM,gBAC7C,CAAC,gBAAgB,UAAU,SAAS,+BAA+B,KACnE,CAAC,gBAAgB,UAAU,SAAS,4BAA4B,GAClE;AACE,QACI,gBAAgB,UAAU;AAAA,MACtB;AAAA,IACJ,GACF;AACE,YAAM,qCAAqC;AAAA,IAC/C,OAAO;AACH,YAAM,kCAAkC;AAAA,IAC5C;AAAA,EACJ;AAEA,QAAM,aAAa,OAAO,OAAO,KAAK,EAAE,KAAK,OAAO;AACpD,QAAM,SAAS,iBAAiB,OAAO;AAAA,IACnC,WAAW,2BAA2B,OAAO;AAAA,EACjD,CAAC;AAED,SAAO,EAAE,YAAY,OAAO;AAChC;","names":["Config"]}

package/dist/modern/visualBuilder/utils/isFieldDisabled.js

@@ -7,7 +7,7 @@ var DisableReason = {
   ReadOnly: "You have only read access to this field",
   LocalizedEntry: "Editing this field is restricted in localized entries",
   UnlinkedVariant: "This field is not editable as it is not linked to the selected variant",
-  AudienceMode: "Open an Experience from Audience widget to start editing",
+  AudienceMode: "To edit an experience, open the Audience widget and click the Edit icon.",
   DisabledVariant: "This field is not editable as it doesn't match the selected variant",
   UnlocalizedVariant: "This field is not editable as it is not localized",
   None: "",

package/dist/modern/visualBuilder/utils/isFieldDisabled.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/visualBuilder/utils/isFieldDisabled.ts"],"sourcesContent":["import Config from \"../../configManager/configManager\";\nimport { ISchemaFieldMap } from \"./types/index.types\";\nimport { VisualBuilder } from \"..\";\nimport { FieldDetails } from \"../components/FieldToolbar\";\nimport { EntryPermissions } from \"./getEntryPermissions\";\nimport { WorkflowStageDetails } from \"./getWorkflowStageDetails\";\n\nconst DisableReason = {\n    ReadOnly: \"You have only read access to this field\",\n    LocalizedEntry: \"Editing this field is restricted in localized entries\",\n    UnlinkedVariant:\n        \"This field is not editable as it is not linked to the selected variant\",\n    AudienceMode: \"Open an Experience from Audience widget to start editing\",\n    DisabledVariant:\n        \"This field is not editable as it doesn't match the selected variant\",\n    UnlocalizedVariant: \"This field is not editable as it is not localized\",\n    None: \"\",\n    EntryUpdateRestricted: \"You do not have permission to edit this entry\",\n    WorkflowStagePermission: ({ stageName }: { stageName: string }) =>\n        `You do not have Edit access to this entry on the '${stageName}' workflow stage`,\n    EntryUpdateRestrictedRoleAndWorkflowStage: ({\n        stageName,\n    }: {\n        stageName: string;\n    }) =>\n        `Editing is restricted for your role or by the rules for the '${stageName}' stage. Contact your admin for edit access.`,\n} as const;\n\ninterface FieldDisableState {\n    isDisabled: boolean;\n    reason: string;\n}\n\nconst getDisableReason = (\n    flags: Record<string, boolean>,\n    params?: Record<string, any>\n) => {\n    if (flags.updateRestrictDueToRole) return DisableReason.ReadOnly;\n    if (flags.updateRestrictDueToNonLocalizableFields)\n        return DisableReason.LocalizedEntry;\n    if (flags.updateRestrictDueToUnlocalizedVariant)\n        return DisableReason.UnlocalizedVariant;\n    if (flags.updateRestrictDueToUnlinkVariant)\n        return DisableReason.UnlinkedVariant;\n    if (flags.updateRestrictDueToAudienceMode)\n        return DisableReason.AudienceMode;\n    if (flags.updateRestrictDueToDisabledVariant)\n        return DisableReason.DisabledVariant;\n    if (\n        flags.updateRestrictDueToEntryUpdateRestriction &&\n        flags.updateRestrictDueToWorkflowStagePermission\n    ) {\n        return DisableReason.EntryUpdateRestrictedRoleAndWorkflowStage({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    if (flags.updateRestrictDueToEntryUpdateRestriction) {\n        return DisableReason.EntryUpdateRestricted;\n    }\n    if (flags.updateRestrictDueToWorkflowStagePermission) {\n        return DisableReason.WorkflowStagePermission({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    return DisableReason.None;\n};\n\nexport const isFieldDisabled = (\n    fieldSchemaMap: ISchemaFieldMap,\n    eventFieldDetails: FieldDetails,\n    entryPermissions?: EntryPermissions,\n    entryWorkflowStageDetails?: WorkflowStageDetails\n): FieldDisableState => {\n    const { editableElement, fieldMetadata } = eventFieldDetails;\n    const masterLocale = Config.get().stackDetails.masterLocale || \"en-us\";\n    const { locale: cmsLocale, variant } =\n        VisualBuilder.VisualBuilderGlobalState.value;\n\n    const flags: Record<string, boolean> = {\n        updateRestrictDueToRole: Boolean(\n            fieldSchemaMap?.field_metadata?.updateRestrict\n        ),\n        updateRestrictDueToUnlinkVariant: Boolean(\n            fieldSchemaMap?.field_metadata?.isUnlinkedVariant\n        ),\n        updateRestrictDueToUnlocalizedVariant: Boolean(\n            variant && fieldMetadata.locale !== cmsLocale\n        ),\n        updateRestrictDueToNonLocalizableFields: Boolean(\n            fieldSchemaMap?.non_localizable &&\n                masterLocale !== fieldMetadata.locale\n        ),\n        updateRestrictDueToAudienceMode: false,\n        updateRestrictDueToDisabledVariant: false,\n    };\n\n    if (entryPermissions && !entryPermissions.update) {\n        flags.updateRestrictDueToEntryUpdateRestriction = true;\n    }\n\n    if (\n        entryWorkflowStageDetails &&\n        !entryWorkflowStageDetails.permissions.entry.update\n    ) {\n        flags.updateRestrictDueToWorkflowStagePermission = true;\n    }\n\n    if (\n        VisualBuilder.VisualBuilderGlobalState.value.audienceMode &&\n        !editableElement.classList.contains(\"visual-builder__variant-field\") &&\n        !editableElement.classList.contains(\"visual-builder__base-field\")\n    ) {\n        if (\n            editableElement.classList.contains(\n                \"visual-builder__disabled-variant-field\"\n            )\n        ) {\n            flags.updateRestrictDueToDisabledVariant = true;\n        } else {\n            flags.updateRestrictDueToAudienceMode = true;\n        }\n    }\n\n    const isDisabled = Object.values(flags).some(Boolean);\n    const reason = getDisableReason(flags, {\n        stageName: entryWorkflowStageDetails?.stage?.name,\n    });\n\n    return { isDisabled, reason };\n};\n"],"mappings":";;;AAAA,OAAO,YAAY;AAEnB,SAAS,qBAAqB;AAK9B,IAAM,gBAAgB;AAAA,EAClB,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,iBACI;AAAA,EACJ,cAAc;AAAA,EACd,iBACI;AAAA,EACJ,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,uBAAuB;AAAA,EACvB,yBAAyB,CAAC,EAAE,UAAU,MAClC,qDAAqD,SAAS;AAAA,EAClE,2CAA2C,CAAC;AAAA,IACxC;AAAA,EACJ,MAGI,gEAAgE,SAAS;AACjF;AAOA,IAAM,mBAAmB,CACrB,OACA,WACC;AACD,MAAI,MAAM,wBAAyB,QAAO,cAAc;AACxD,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MACI,MAAM,6CACN,MAAM,4CACR;AACE,WAAO,cAAc,0CAA0C;AAAA,MAC3D,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,MAAI,MAAM,2CAA2C;AACjD,WAAO,cAAc;AAAA,EACzB;AACA,MAAI,MAAM,4CAA4C;AAClD,WAAO,cAAc,wBAAwB;AAAA,MACzC,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,SAAO,cAAc;AACzB;AAEO,IAAM,kBAAkB,CAC3B,gBACA,mBACA,kBACA,8BACoB;AACpB,QAAM,EAAE,iBAAiB,cAAc,IAAI;AAC3C,QAAM,eAAe,OAAO,IAAI,EAAE,aAAa,gBAAgB;AAC/D,QAAM,EAAE,QAAQ,WAAW,QAAQ,IAC/B,cAAc,yBAAyB;AAE3C,QAAM,QAAiC;AAAA,IACnC,yBAAyB;AAAA,MACrB,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,kCAAkC;AAAA,MAC9B,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,uCAAuC;AAAA,MACnC,WAAW,cAAc,WAAW;AAAA,IACxC;AAAA,IACA,yCAAyC;AAAA,MACrC,gBAAgB,mBACZ,iBAAiB,cAAc;AAAA,IACvC;AAAA,IACA,iCAAiC;AAAA,IACjC,oCAAoC;AAAA,EACxC;AAEA,MAAI,oBAAoB,CAAC,iBAAiB,QAAQ;AAC9C,UAAM,4CAA4C;AAAA,EACtD;AAEA,MACI,6BACA,CAAC,0BAA0B,YAAY,MAAM,QAC/C;AACE,UAAM,6CAA6C;AAAA,EACvD;AAEA,MACI,cAAc,yBAAyB,MAAM,gBAC7C,CAAC,gBAAgB,UAAU,SAAS,+BAA+B,KACnE,CAAC,gBAAgB,UAAU,SAAS,4BAA4B,GAClE;AACE,QACI,gBAAgB,UAAU;AAAA,MACtB;AAAA,IACJ,GACF;AACE,YAAM,qCAAqC;AAAA,IAC/C,OAAO;AACH,YAAM,kCAAkC;AAAA,IAC5C;AAAA,EACJ;AAEA,QAAM,aAAa,OAAO,OAAO,KAAK,EAAE,KAAK,OAAO;AACpD,QAAM,SAAS,iBAAiB,OAAO;AAAA,IACnC,WAAW,2BAA2B,OAAO;AAAA,EACjD,CAAC;AAED,SAAO,EAAE,YAAY,OAAO;AAChC;","names":[]}
+{"version":3,"sources":["../../../../src/visualBuilder/utils/isFieldDisabled.ts"],"sourcesContent":["import Config from \"../../configManager/configManager\";\nimport { ISchemaFieldMap } from \"./types/index.types\";\nimport { VisualBuilder } from \"..\";\nimport { FieldDetails } from \"../components/FieldToolbar\";\nimport { EntryPermissions } from \"./getEntryPermissions\";\nimport { WorkflowStageDetails } from \"./getWorkflowStageDetails\";\n\nconst DisableReason = {\n    ReadOnly: \"You have only read access to this field\",\n    LocalizedEntry: \"Editing this field is restricted in localized entries\",\n    UnlinkedVariant:\n        \"This field is not editable as it is not linked to the selected variant\",\n    AudienceMode: \"To edit an experience, open the Audience widget and click the Edit icon.\",\n    DisabledVariant:\n        \"This field is not editable as it doesn't match the selected variant\",\n    UnlocalizedVariant: \"This field is not editable as it is not localized\",\n    None: \"\",\n    EntryUpdateRestricted: \"You do not have permission to edit this entry\",\n    WorkflowStagePermission: ({ stageName }: { stageName: string }) =>\n        `You do not have Edit access to this entry on the '${stageName}' workflow stage`,\n    EntryUpdateRestrictedRoleAndWorkflowStage: ({\n        stageName,\n    }: {\n        stageName: string;\n    }) =>\n        `Editing is restricted for your role or by the rules for the '${stageName}' stage. Contact your admin for edit access.`,\n} as const;\n\ninterface FieldDisableState {\n    isDisabled: boolean;\n    reason: string;\n}\n\nconst getDisableReason = (\n    flags: Record<string, boolean>,\n    params?: Record<string, any>\n) => {\n    if (flags.updateRestrictDueToRole) return DisableReason.ReadOnly;\n    if (flags.updateRestrictDueToNonLocalizableFields)\n        return DisableReason.LocalizedEntry;\n    if (flags.updateRestrictDueToUnlocalizedVariant)\n        return DisableReason.UnlocalizedVariant;\n    if (flags.updateRestrictDueToUnlinkVariant)\n        return DisableReason.UnlinkedVariant;\n    if (flags.updateRestrictDueToAudienceMode)\n        return DisableReason.AudienceMode;\n    if (flags.updateRestrictDueToDisabledVariant)\n        return DisableReason.DisabledVariant;\n    if (\n        flags.updateRestrictDueToEntryUpdateRestriction &&\n        flags.updateRestrictDueToWorkflowStagePermission\n    ) {\n        return DisableReason.EntryUpdateRestrictedRoleAndWorkflowStage({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    if (flags.updateRestrictDueToEntryUpdateRestriction) {\n        return DisableReason.EntryUpdateRestricted;\n    }\n    if (flags.updateRestrictDueToWorkflowStagePermission) {\n        return DisableReason.WorkflowStagePermission({\n            stageName: params?.stageName ? params.stageName : \"Unknown\",\n        });\n    }\n    return DisableReason.None;\n};\n\nexport const isFieldDisabled = (\n    fieldSchemaMap: ISchemaFieldMap,\n    eventFieldDetails: FieldDetails,\n    entryPermissions?: EntryPermissions,\n    entryWorkflowStageDetails?: WorkflowStageDetails\n): FieldDisableState => {\n    const { editableElement, fieldMetadata } = eventFieldDetails;\n    const masterLocale = Config.get().stackDetails.masterLocale || \"en-us\";\n    const { locale: cmsLocale, variant } =\n        VisualBuilder.VisualBuilderGlobalState.value;\n\n    const flags: Record<string, boolean> = {\n        updateRestrictDueToRole: Boolean(\n            fieldSchemaMap?.field_metadata?.updateRestrict\n        ),\n        updateRestrictDueToUnlinkVariant: Boolean(\n            fieldSchemaMap?.field_metadata?.isUnlinkedVariant\n        ),\n        updateRestrictDueToUnlocalizedVariant: Boolean(\n            variant && fieldMetadata.locale !== cmsLocale\n        ),\n        updateRestrictDueToNonLocalizableFields: Boolean(\n            fieldSchemaMap?.non_localizable &&\n                masterLocale !== fieldMetadata.locale\n        ),\n        updateRestrictDueToAudienceMode: false,\n        updateRestrictDueToDisabledVariant: false,\n    };\n\n    if (entryPermissions && !entryPermissions.update) {\n        flags.updateRestrictDueToEntryUpdateRestriction = true;\n    }\n\n    if (\n        entryWorkflowStageDetails &&\n        !entryWorkflowStageDetails.permissions.entry.update\n    ) {\n        flags.updateRestrictDueToWorkflowStagePermission = true;\n    }\n\n    if (\n        VisualBuilder.VisualBuilderGlobalState.value.audienceMode &&\n        !editableElement.classList.contains(\"visual-builder__variant-field\") &&\n        !editableElement.classList.contains(\"visual-builder__base-field\")\n    ) {\n        if (\n            editableElement.classList.contains(\n                \"visual-builder__disabled-variant-field\"\n            )\n        ) {\n            flags.updateRestrictDueToDisabledVariant = true;\n        } else {\n            flags.updateRestrictDueToAudienceMode = true;\n        }\n    }\n\n    const isDisabled = Object.values(flags).some(Boolean);\n    const reason = getDisableReason(flags, {\n        stageName: entryWorkflowStageDetails?.stage?.name,\n    });\n\n    return { isDisabled, reason };\n};\n"],"mappings":";;;AAAA,OAAO,YAAY;AAEnB,SAAS,qBAAqB;AAK9B,IAAM,gBAAgB;AAAA,EAClB,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,iBACI;AAAA,EACJ,cAAc;AAAA,EACd,iBACI;AAAA,EACJ,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,uBAAuB;AAAA,EACvB,yBAAyB,CAAC,EAAE,UAAU,MAClC,qDAAqD,SAAS;AAAA,EAClE,2CAA2C,CAAC;AAAA,IACxC;AAAA,EACJ,MAGI,gEAAgE,SAAS;AACjF;AAOA,IAAM,mBAAmB,CACrB,OACA,WACC;AACD,MAAI,MAAM,wBAAyB,QAAO,cAAc;AACxD,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MAAI,MAAM;AACN,WAAO,cAAc;AACzB,MACI,MAAM,6CACN,MAAM,4CACR;AACE,WAAO,cAAc,0CAA0C;AAAA,MAC3D,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,MAAI,MAAM,2CAA2C;AACjD,WAAO,cAAc;AAAA,EACzB;AACA,MAAI,MAAM,4CAA4C;AAClD,WAAO,cAAc,wBAAwB;AAAA,MACzC,WAAW,QAAQ,YAAY,OAAO,YAAY;AAAA,IACtD,CAAC;AAAA,EACL;AACA,SAAO,cAAc;AACzB;AAEO,IAAM,kBAAkB,CAC3B,gBACA,mBACA,kBACA,8BACoB;AACpB,QAAM,EAAE,iBAAiB,cAAc,IAAI;AAC3C,QAAM,eAAe,OAAO,IAAI,EAAE,aAAa,gBAAgB;AAC/D,QAAM,EAAE,QAAQ,WAAW,QAAQ,IAC/B,cAAc,yBAAyB;AAE3C,QAAM,QAAiC;AAAA,IACnC,yBAAyB;AAAA,MACrB,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,kCAAkC;AAAA,MAC9B,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,uCAAuC;AAAA,MACnC,WAAW,cAAc,WAAW;AAAA,IACxC;AAAA,IACA,yCAAyC;AAAA,MACrC,gBAAgB,mBACZ,iBAAiB,cAAc;AAAA,IACvC;AAAA,IACA,iCAAiC;AAAA,IACjC,oCAAoC;AAAA,EACxC;AAEA,MAAI,oBAAoB,CAAC,iBAAiB,QAAQ;AAC9C,UAAM,4CAA4C;AAAA,EACtD;AAEA,MACI,6BACA,CAAC,0BAA0B,YAAY,MAAM,QAC/C;AACE,UAAM,6CAA6C;AAAA,EACvD;AAEA,MACI,cAAc,yBAAyB,MAAM,gBAC7C,CAAC,gBAAgB,UAAU,SAAS,+BAA+B,KACnE,CAAC,gBAAgB,UAAU,SAAS,4BAA4B,GAClE;AACE,QACI,gBAAgB,UAAU;AAAA,MACtB;AAAA,IACJ,GACF;AACE,YAAM,qCAAqC;AAAA,IAC/C,OAAO;AACH,YAAM,kCAAkC;AAAA,IAC5C;AAAA,EACJ;AAEA,QAAM,aAAa,OAAO,OAAO,KAAK,EAAE,KAAK,OAAO;AACpD,QAAM,SAAS,iBAAiB,OAAO;AAAA,IACnC,WAAW,2BAA2B,OAAO;AAAA,EACjD,CAAC;AAED,SAAO,EAAE,YAAY,OAAO;AAChC;","names":[]}

package/dist/modern/visualBuilder/visualBuilder.style.cjs

@@ -315,6 +315,21 @@ function visualBuilderStyles() {
     "visual-builder__cursor-icon--loader": import_goober.css`
             animation: visual-builder__spinner 1s linear infinite;
         `,
+    "visual-builder__variant-indicator": import_goober.css`
+            height: calc(100% - 1px);
+            aspect-ratio: 1;
+            background: white;
+            border-radius: 2px;
+            border-width: 2px;
+            border-style: solid;
+            align-content: center;
+            text-align: center;
+            border-color: #BD59FA;
+
+            svg {
+                color: #BD59FA;
+            }
+        `,
     "visual-builder__focused-toolbar": import_goober.css`
             position: absolute;
             transform: translateY(-100%);
@@ -371,10 +386,11 @@ function visualBuilderStyles() {
             display: flex;
             flex-direction: column-reverse;
             position: relative;
+            margin-right: 0.5rem;
         `,
     "visual-builder__focused-toolbar__field-label-container": import_goober.css`
             display: flex;
-            column-gap: 0.5rem;
+            height: 1.75rem;
             align-items: center;
         `,
     "visual-builder__button": import_goober.css`
@@ -538,6 +554,12 @@ function visualBuilderStyles() {
                 background: #909090;
             }
         `,
+    "visual-builder__focused-toolbar--variant": import_goober.css`
+            .visual-builder__focused-toolbar__field-label-wrapper__current-field {
+                background: #BD59FA;
+            }
+
+        `,
     "visual-builder__cursor-disabled": import_goober.css`
             .visual-builder__cursor-icon {
                 background: #909090;
@@ -635,6 +657,9 @@ function visualBuilderStyles() {
     "visual-builder__hover-outline--disabled": import_goober.css`
             outline: 2px dashed #909090;
         `,
+    "visual-builder__hover-outline--variant": import_goober.css`
+            outline: 2px dashed #BD59FA;
+        `,
     "visual-builder__default-cursor--disabled": import_goober.css`
             cursor: none;
         `,

package/dist/modern/visualBuilder/visualBuilder.style.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/visualBuilder/visualBuilder.style.ts"],"sourcesContent":["import { css } from \"goober\";\n\nconst tooltipBaseStyle = `\n    pointer-events: all;\n    svg {\n        pointer-events: none;\n    }\n    &:before {\n        content: attr(data-tooltip);\n        position: absolute;\n        bottom: 20px;\n        margin-bottom: 24px;\n        padding: 12px;\n        border-radius: 4px;\n        width: max-content;\n        max-width: 200px;\n        color: #fff;\n        font-family: Inter;\n        font-size: 0.75rem;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 132%; /* 0.99rem */\n        letter-spacing: 0.015rem;\n        background: #767676;\n    }\n    &:after {\n        content: \"\";\n        position: absolute;\n        bottom: 28px;\n        /* the arrow */\n        border: 10px solid #000;\n        border-color: #767676 transparent transparent transparent;\n    }\n`;\n\nexport function visualBuilderStyles() {\n    return {\n        \"visual-builder__container\": css`\n            --outline-transition: all 0.15s ease-in;\n            font-family: \"Inter\", sans-serif;\n        `,\n        \"visual-builder__cursor\": css`\n            visibility: hidden;\n            height: 0;\n\n            &.visible {\n                visibility: visible;\n                position: fixed;\n                top: 0;\n                left: 0;\n                z-index: 2147483647 !important;\n\n                color: #fff;\n\n                height: auto;\n                padding: 0 10px;\n\n                display: flex;\n                align-items: center;\n                justify-content: center;\n\n                pointer-events: none !important;\n                position: fixed !important;\n                cursor: none;\n            }\n        `,\n        \"tooltip-container\": css`\n            position: absolute;\n            background-color: #767676;\n            color: white;\n            padding: 12px;\n            border-radius: 4px;\n            font-size: 12px;\n            line-height: 1.4;\n            z-index: 1000;\n            pointer-events: none;\n            max-width: 250px;\n            text-align: center;\n        `,\n        \"tooltip-arrow\": css`\n            position: absolute;\n            background: #767676;\n            width: 8px;\n            height: 8px;\n            transform: rotate(45deg);\n        `,\n        \"toolbar-tooltip-content\": css`\n            display: flex;\n            flex-direction: column;\n            gap: 4px;\n        `,\n        \"toolbar-tooltip-content-item\": css`\n            display: flex;\n            align-items: center;\n            justify-content: start;\n            gap: 4px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            p {\n                margin: 0;\n                color: #fff;\n                overflow: hidden;\n                text-overflow: ellipsis;\n                max-width: 100%;\n            }\n        `,\n        \"visual-builder__overlay__wrapper\": css`\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100vh;\n            visibility: hidden;\n            z-index: 99999;\n\n            pointer-events: none;\n\n            &.visible {\n                visibility: visible;\n            }\n        `,\n        \"visual-builder__empty-block-plus-icon\": css`\n            font-size: 22px;\n            font-weight: 300;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__overlay--outline\": css`\n            position: absolute;\n            outline: 4px solid #715cdd;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__overlay\": css`\n            background: rgba(0, 0, 0, 0.3);\n            box-sizing: content-box;\n            pointer-events: all;\n            position: absolute;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__add-button\": css`\n            position: absolute;\n            pointer-events: all;\n\n            background: #ffffff;\n            color: #475161;\n\n            border-radius: 4px;\n            border: 1px solid #6c5ce7;\n\n            height: 32px;\n            min-width: 32px;\n            max-width: 180px;\n            padding: 8px 6px;\n            transform: translate(-50%, -50%);\n\n            font-weight: 600;\n            color: #6c5ce7;\n            overflow: hidden;\n\n            z-index: 2147483646 !important;\n\n            display: grid;\n            grid-template-columns: min-content 0fr;\n            align-content: center;\n            gap: 0;\n\n            transition:\n                grid-template-columns 0.25s,\n                left 0.15s ease-in,\n                top 0.15s ease-in,\n                gap 0.15s ease-in;\n\n            &:has(.visual-builder__add-button-label):hover {\n                grid-template-columns: min-content 1fr;\n                gap: 8px;\n                padding: 8px 16px;\n            }\n\n            svg {\n                fill: #6c5ce7;\n            }\n\n            &:disabled {\n                border-color: #bbbec3;\n                cursor: not-allowed;\n            }\n\n            &:disabled svg {\n                fill: #bbbec3;\n            }\n        `,\n        \"visual-builder__add-button-label\": css`\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        `,\n        \"visual-builder__add-button--loading\": css`\n            cursor: wait;\n            /* we have not-allowed on disabled, so we need this */\n            &:disabled {\n                cursor: wait;\n            }\n        `,\n        \"visual-builder__start-editing-btn\": css`\n            z-index: 1000;\n            text-decoration: none;\n            position: fixed;\n            box-shadow:\n                0px 4px 15px 0px rgba(108, 92, 231, 0.2),\n                0px 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0px 8px 10px 1px rgba(0, 0, 0, 0.14);\n            display: inline-flex;\n            padding: 0.5rem 1rem;\n            justify-content: center;\n            align-items: center;\n            gap: 0.5rem;\n\n            border-radius: 4px;\n            border: 1px solid transparent;\n            background: #6c5ce7;\n            transition:\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out,\n                -webkit-box-shadow 0.15s ease-in-out;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n            &:focus {\n                outline: none;\n                box-shadow: 0 0 0 2px #ada4f4;\n            }\n            & > span {\n                color: #fff;\n                /* Body/P1 Bold */\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n\n            & > svg {\n                color: #fff;\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n        `,\n        \"visual-builder__start-editing-btn__bottom-right\": css`\n            bottom: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__bottom-left\": css`\n            bottom: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-right\": css`\n            top: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-left\": css`\n            top: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__cursor-icon\": css`\n            height: 40px;\n            width: 40px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            background: #5d50be;\n            border-radius: 50%;\n            position: absolute;\n            top: 0;\n            left: 0;\n        `,\n        \"visual-builder__cursor-pointer\": css`\n            position: absolute;\n            top: -8px;\n            left: -8px;\n        `,\n        \"visual-builder__cursor-icon--loader\": css`\n            animation: visual-builder__spinner 1s linear infinite;\n        `,\n        \"visual-builder__focused-toolbar\": css`\n            position: absolute;\n            transform: translateY(-100%);\n            z-index: 100000;\n            gap: 8px;\n            width: 0;\n            display: flex;\n            align-items: end;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__current-field\": css`\n            padding: 4px 8px !important;\n            background: #6c5ce7;\n            color: #fff;\n            z-index: 1;\n            border-radius: 2px !important;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            width: fit-content;\n\n            &:disabled {\n                filter: contrast(0.7);\n            }\n\n            .visual-builder__focused-toolbar__text {\n                padding-right: 3px;\n                height: 16px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__parent-field\": css`\n            pointer-events: none;\n            color: #5d50be;\n            padding: 4px !important;\n            margin-bottom: 3px;\n            display: none;\n            width: fit-content;\n            position: absolute;\n            z-index: 100000;\n        `,\n        \"field-label-dropdown-open\": css`\n            .visual-builder__focused-toolbar__field-label-wrapper__parent-field {\n                pointer-events: all;\n                visibility: visible;\n                display: initial;\n            }\n\n            .visual-builder__button--secondary:hover {\n                background-color: #6c5ce7;\n                color: #f9f8ff;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            position: relative;\n        `,\n        \"visual-builder__focused-toolbar__field-label-container\": css`\n            display: flex;\n            column-gap: 0.5rem;\n            align-items: center;\n        `,\n        \"visual-builder__button\": css`\n            background-color: transparent;\n            border: 1px solid transparent;\n            border-radius: 4px;\n            font-size: 16px;\n            font-weight: 600;\n            line-height: 100%;\n            padding: 8px 16px;\n            text-align: center;\n            z-index: 2147483647 !important;\n            transition:\n                color 0.15s ease-in-out,\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out;\n            // vertical-align: middle;\n            &:disabled {\n                cursor: not-allowed;\n                svg {\n                    fill: #999;\n                    path {\n                        fill: #999;\n                    }\n                }\n            }\n        `,\n        \"visual-builder__button--primary\": css`\n            background-color: #6c5ce7;\n            color: #fff;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n        `,\n        \"visual-builder__button--secondary\": css`\n            background-color: #f9f8ff;\n            border: 1px solid #6c5ce7;\n            color: #6c5ce7;\n        `,\n        \"visual-builder__button--edit\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__button-loader\": css`\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #ffffff;\n                }\n            }\n        `,\n        \"visual-builder__button--comment-loader\": css`\n            cursor: wait !important;\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__field-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__content-type-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__caret-right-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n            }\n        `,\n        \"visual-builder__reference-icon-container\": css`\n            display: flex;\n            align-items: center;\n\n            .visual-builder__field-icon {\n                svg {\n                    margin-right: 0px;\n                }\n            }\n        `,\n        \"visual-builder__focused-toolbar__button-group\": css`\n            display: flex;\n            background: #fff;\n            border-radius: 2px;\n            height: 100%;\n            padding: 4px !important;\n            z-index: 2147483647 !important;\n\n            &:has(.visual-builder__button) {\n                padding: 2px;\n                gap: 8px;\n            }\n\n            .visual-builder__button:enabled:hover {\n                background-color: #f5f5f5;\n\n                svg {\n                    color: #5d50be;\n                }\n            }\n\n            .visual-builder__button {\n                background-color: #fff;\n                border-color: transparent;\n                color: #475161;\n                padding: 4px;\n                min-width: 32px;\n                min-height: 32px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__text\": css`\n            font-family: Inter, \"sans-serif\";\n            font-size: 0.75rem;\n            font-style: normal;\n            font-weight: 400;\n            line-height: 150%;\n            letter-spacing: 0.015rem;\n            max-width: 150px;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            text-wrap: nowrap;\n        `,\n        \"visual-builder__focused-toolbar__multiple-field-toolbar\": css`\n            height: 40px;\n            z-index: 2147483647 !important;\n\n            svg {\n                height: 100%;\n                width: 100%;\n            }\n        `,\n        \"visual-builder__rotate--90\": css`\n            transform: rotate(90deg);\n        `,\n        \"visual-builder__focused-toolbar--field-disabled\": css`\n            pointer-events: none;\n            cursor: not-allowed;\n            .visual-builder__focused-toolbar__field-label-wrapper__current-field {\n                background: #909090;\n            }\n        `,\n        \"visual-builder__cursor-disabled\": css`\n            .visual-builder__cursor-icon {\n                background: #909090;\n            }\n\n            .visual-builder__cursor-pointer path {\n                fill: #909090;\n            }\n        `,\n        \"visual-builder__tooltip\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: none;\n            }\n\n            &:hover:before,\n            &:hover:after {\n                display: block;\n                z-index: 2147483647 !important;\n            }\n\n            &:after {\n                display: none;\n            }\n        `,\n        \"visual-builder__tooltip--bottom\": css`\n            &:before {\n                bottom: -66px;\n            }\n            &:after {\n                bottom: -6px;\n                transform: rotate(180deg);\n            }\n        `,\n\n        \"visual-builder__tooltip--persistent\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: block;\n            }\n\n            &:after {\n                display: block;\n            }\n        `,\n        \"visual-builder__empty-block\": css`\n            width: 100%;\n            height: 100%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex-direction: column;\n            gap: 1rem;\n            min-height: 100px;\n        `,\n        \"visual-builder__empty-block-title\": css`\n            font-size: 0.95rem;\n            font-family: Inter;\n            font-weight: 400;\n            line-height: 100%;\n            color: #647696;\n        `,\n        \"visual-builder__empty-block-field-name\": css`\n            font-weight: 700;\n        `,\n        \"visual-builder__empty-block-add-button\": css`\n            height: 32px;\n            border-radius: 4px;\n            background: #f9f8ff;\n            border-color: #6c5ce7;\n            border-width: 1px;\n            padding: 0 16px;\n            font-size: 0.9rem;\n            font-family: Inter;\n            font-weight: 600;\n            color: #6c5ce7;\n            letter-spacing: 0.01rem;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__hover-outline\": css`\n            position: absolute;\n            outline: 2px dashed #6c5ce7;\n            transition: var(--outline-transition);\n            z-index: 2147483646 !important;\n        `,\n        \"visual-builder__hover-outline--hidden\": css`\n            visibility: hidden;\n        `,\n        \"visual-builder__hover-outline--unclickable\": css`\n            pointer-events: none;\n        `,\n        \"visual-builder__hover-outline--disabled\": css`\n            outline: 2px dashed #909090;\n        `,\n        \"visual-builder__default-cursor--disabled\": css`\n            cursor: none;\n        `,\n        \"visual-builder__draft-field\": css`\n            outline: 2px dashed #eb5646;\n        `,\n        \"visual-builder__variant-field\": css`\n            outline: 2px solid #bd59fa;\n            outline-offset: -2px;\n        `,\n        \"visual-builder__pseudo-editable-element\": css`\n            z-index: 99999 !important;\n        `,\n        // cslp error styles\n        \"visual-builder__button-error\": css`\n            background-color: #ffeeeb;\n            padding: 0px !important;\n            &:hover {\n                background-color: #ffeeeb;\n            }\n        `,\n        \"visual-builder__focused-toolbar__error\": css`\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            column-gap: 3px;\n            padding: 4px 8px;\n        `,\n        \"visual-builder__focused-toolbar__error-text\": css`\n            font-weight: 400;\n            font-size: 12px;\n            line-height: 18px;\n            color: #a31b00;\n        `,\n        \"visual-builder__focused-toolbar__error-toolip\": css`\n            position: absolute;\n            width: 400px;\n            background-color: red;\n            left: 0;\n            top: -7px;\n            transform: translateY(-100%);\n            background-color: #767676;\n            border-radius: 4px;\n            box-shadow:\n                0px 1px 10px 0px #6c5ce733,\n                0px 5px 5px 0px #0000001f,\n                0px 2px 4px 0px #00000024;\n            padding: 12px;\n            text-align: left;\n\n            &:before {\n                content: \"\";\n                position: absolute;\n                bottom: -3px;\n                left: 4%;\n                transform: translateX(-50%) rotate(45deg);\n                width: 10px;\n                height: 10px;\n                background-color: #767676;\n            }\n\n            > p {\n                margin: 0;\n                color: #ffffff;\n                font-size: 14px;\n                font-weight: 600;\n                line-height: 21px;\n                margin-bottom: 4px;\n            }\n\n            > span {\n                color: #ffffff;\n                font-size: 12px;\n                font-weight: 400;\n                line-height: 18px;\n            }\n        `,\n        \"variant-field-revert-component\": css`\n            position: relative;\n            display: inline-block;\n            z-index: 2147483647 !important;\n        `,\n        \"variant-field-revert-component__dropdown-content\": css`\n            position: absolute;\n            top: -12px;\n            left: -4px;\n            background-color: #ffffff;\n            min-width: max-content;\n            box-shadow:\n                0 4px 15px 0 rgba(108, 92, 231, 0.2),\n                0 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0 8px 10px 1px rgba(0, 0, 0, 0.14);\n            z-index: 2147483647 !important;\n            margin-top: 4px;\n            padding: 4px 0px;\n            border-radius: 2px;\n        `,\n        \"variant-field-revert-component__dropdown-content__list-item\": css`\n            color: black;\n            font-weight: 400;\n            padding: 9.6px 16px;\n            text-decoration: none;\n            display: block;\n            font-size: 0.75rem;\n            height: 32px;\n            line-height: 2rem;\n            display: flex;\n            align-items: center;\n            z-index: 2147483647 !important;\n            cursor: pointer;\n            &:hover {\n                background-color: #f1f1f1;\n            }\n            &:hover > span {\n                color: #5d50be;\n            }\n            & > span {\n                margin-top: 4px;\n                margin-bottom: 4px;\n            }\n        `,\n        \"visual-builder__no-cursor-style\": css`\n            cursor: none !important;\n        `,\n        \"visual-builder__field-toolbar-container\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            z-index: 2147483647 !important;\n            position: relative;\n        `,\n        \"visual-builder__variant-button\": css`\n            display: flex;\n            min-width: 3rem !important;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            display: flex;\n            & svg path {\n                fill: #475161;\n            }\n        `,\n        \"visual-builder__field-location-icons-container\": css`\n            display: flex;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            margin-left: 0.25rem;\n        `,\n        \"visual-builder__field-location-icons-container__divider\": css`\n            height: 32px !important;\n            width: 1px;\n            border-radius: 2px;\n            background-color: #8a8f99;\n        `,\n        \"visual-builder__field-location-icons-container__app-icon\": css`\n            width: 24px;\n            height: 24px;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list\": css`\n            position: absolute;\n            top: 0;\n            background: #fff;\n            border: 1px solid #e0e0e0;\n            border-radius: 8px;\n            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n            z-index: 1000;\n            min-width: 230px;\n            max-height: 250px;\n            min-height: 250px;\n            overflow-y: auto;\n            display: flex;\n            flex-direction: column;\n        `,\n        \"visual-builder__field-location-app-list--left\": css`\n            right: 100%;\n            margin-right: 8px;\n        `,\n        \"visual-builder__field-location-app-list--right\": css`\n            left: 100%;\n            margin-left: 8px;\n        `,\n        \"visual-builder__field-location-app-list__search-container\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px 0px 16px;\n            border: none;\n            border-bottom: 1px solid #f0f0f0;\n        `,\n        \"visual-builder__field-location-app-list__search-input\": css`\n            width: 100%;\n            padding: 10px 12px;\n            font-size: 14px;\n            outline: none;\n            box-sizing: border-box;\n            border: none;\n        `,\n        \"visual-builder__field-location-app-list__search-icon\": css`\n            width: 14px;\n            height: 14px;\n        `,\n        \"visual-builder__field-location-app-list__content\": css`\n            flex: 1;\n            overflow-y: auto;\n        `,\n        \"visual-builder__field-location-app-list__no-results\": css`\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            height: 100%;\n            width: 100%;\n            text-align: center;\n        `,\n        \"visual-builder__field-location-app-list__no-results-text\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n        \"visual-builder__field-location-app-list__item\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px;\n            cursor: pointer;\n            font-size: 14px;\n        `,\n        \"visual-builder__field-location-app-list__item-icon-container\": css`\n            width: 24px;\n            height: 24px;\n            margin-right: 12px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__field-location-app-list__item-icon\": css`\n            width: 24px;\n            height: 24px;\n            border-radius: 50%;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list__item-title\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n    };\n}\n\nexport const VisualBuilderGlobalStyles = `\n       @import url(\"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap\");\n\n       [data-cslp] [contenteditable=\"true\"] {\n            outline: none;\n        }\n\n        @keyframes visual-builder__spinner {\n            0% {\n                transform: rotate(0deg);\n            }\n            100% {\n                transform: rotate(360deg);\n            }\n        }\n\n`;\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/visualBuilder/visualBuilder.style.ts"],"sourcesContent":["import { css } from \"goober\";\n\nconst tooltipBaseStyle = `\n    pointer-events: all;\n    svg {\n        pointer-events: none;\n    }\n    &:before {\n        content: attr(data-tooltip);\n        position: absolute;\n        bottom: 20px;\n        margin-bottom: 24px;\n        padding: 12px;\n        border-radius: 4px;\n        width: max-content;\n        max-width: 200px;\n        color: #fff;\n        font-family: Inter;\n        font-size: 0.75rem;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 132%; /* 0.99rem */\n        letter-spacing: 0.015rem;\n        background: #767676;\n    }\n    &:after {\n        content: \"\";\n        position: absolute;\n        bottom: 28px;\n        /* the arrow */\n        border: 10px solid #000;\n        border-color: #767676 transparent transparent transparent;\n    }\n`;\n\nexport function visualBuilderStyles() {\n    return {\n        \"visual-builder__container\": css`\n            --outline-transition: all 0.15s ease-in;\n            font-family: \"Inter\", sans-serif;\n        `,\n        \"visual-builder__cursor\": css`\n            visibility: hidden;\n            height: 0;\n\n            &.visible {\n                visibility: visible;\n                position: fixed;\n                top: 0;\n                left: 0;\n                z-index: 2147483647 !important;\n\n                color: #fff;\n\n                height: auto;\n                padding: 0 10px;\n\n                display: flex;\n                align-items: center;\n                justify-content: center;\n\n                pointer-events: none !important;\n                position: fixed !important;\n                cursor: none;\n            }\n        `,\n        \"tooltip-container\": css`\n            position: absolute;\n            background-color: #767676;\n            color: white;\n            padding: 12px;\n            border-radius: 4px;\n            font-size: 12px;\n            line-height: 1.4;\n            z-index: 1000;\n            pointer-events: none;\n            max-width: 250px;\n            text-align: center;\n        `,\n        \"tooltip-arrow\": css`\n            position: absolute;\n            background: #767676;\n            width: 8px;\n            height: 8px;\n            transform: rotate(45deg);\n        `,\n        \"toolbar-tooltip-content\": css`\n            display: flex;\n            flex-direction: column;\n            gap: 4px;\n        `,\n        \"toolbar-tooltip-content-item\": css`\n            display: flex;\n            align-items: center;\n            justify-content: start;\n            gap: 4px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            p {\n                margin: 0;\n                color: #fff;\n                overflow: hidden;\n                text-overflow: ellipsis;\n                max-width: 100%;\n            }\n        `,\n        \"visual-builder__overlay__wrapper\": css`\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100vh;\n            visibility: hidden;\n            z-index: 99999;\n\n            pointer-events: none;\n\n            &.visible {\n                visibility: visible;\n            }\n        `,\n        \"visual-builder__empty-block-plus-icon\": css`\n            font-size: 22px;\n            font-weight: 300;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__overlay--outline\": css`\n            position: absolute;\n            outline: 4px solid #715cdd;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__overlay\": css`\n            background: rgba(0, 0, 0, 0.3);\n            box-sizing: content-box;\n            pointer-events: all;\n            position: absolute;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__add-button\": css`\n            position: absolute;\n            pointer-events: all;\n\n            background: #ffffff;\n            color: #475161;\n\n            border-radius: 4px;\n            border: 1px solid #6c5ce7;\n\n            height: 32px;\n            min-width: 32px;\n            max-width: 180px;\n            padding: 8px 6px;\n            transform: translate(-50%, -50%);\n\n            font-weight: 600;\n            color: #6c5ce7;\n            overflow: hidden;\n\n            z-index: 2147483646 !important;\n\n            display: grid;\n            grid-template-columns: min-content 0fr;\n            align-content: center;\n            gap: 0;\n\n            transition:\n                grid-template-columns 0.25s,\n                left 0.15s ease-in,\n                top 0.15s ease-in,\n                gap 0.15s ease-in;\n\n            &:has(.visual-builder__add-button-label):hover {\n                grid-template-columns: min-content 1fr;\n                gap: 8px;\n                padding: 8px 16px;\n            }\n\n            svg {\n                fill: #6c5ce7;\n            }\n\n            &:disabled {\n                border-color: #bbbec3;\n                cursor: not-allowed;\n            }\n\n            &:disabled svg {\n                fill: #bbbec3;\n            }\n        `,\n        \"visual-builder__add-button-label\": css`\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        `,\n        \"visual-builder__add-button--loading\": css`\n            cursor: wait;\n            /* we have not-allowed on disabled, so we need this */\n            &:disabled {\n                cursor: wait;\n            }\n        `,\n        \"visual-builder__start-editing-btn\": css`\n            z-index: 1000;\n            text-decoration: none;\n            position: fixed;\n            box-shadow:\n                0px 4px 15px 0px rgba(108, 92, 231, 0.2),\n                0px 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0px 8px 10px 1px rgba(0, 0, 0, 0.14);\n            display: inline-flex;\n            padding: 0.5rem 1rem;\n            justify-content: center;\n            align-items: center;\n            gap: 0.5rem;\n\n            border-radius: 4px;\n            border: 1px solid transparent;\n            background: #6c5ce7;\n            transition:\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out,\n                -webkit-box-shadow 0.15s ease-in-out;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n            &:focus {\n                outline: none;\n                box-shadow: 0 0 0 2px #ada4f4;\n            }\n            & > span {\n                color: #fff;\n                /* Body/P1 Bold */\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n\n            & > svg {\n                color: #fff;\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n        `,\n        \"visual-builder__start-editing-btn__bottom-right\": css`\n            bottom: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__bottom-left\": css`\n            bottom: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-right\": css`\n            top: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-left\": css`\n            top: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__cursor-icon\": css`\n            height: 40px;\n            width: 40px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            background: #5d50be;\n            border-radius: 50%;\n            position: absolute;\n            top: 0;\n            left: 0;\n        `,\n        \"visual-builder__cursor-pointer\": css`\n            position: absolute;\n            top: -8px;\n            left: -8px;\n        `,\n        \"visual-builder__cursor-icon--loader\": css`\n            animation: visual-builder__spinner 1s linear infinite;\n        `,\n        \"visual-builder__variant-indicator\": css`\n            height: calc(100% - 1px);\n            aspect-ratio: 1;\n            background: white;\n            border-radius: 2px;\n            border-width: 2px;\n            border-style: solid;\n            align-content: center;\n            text-align: center;\n            border-color: #BD59FA;\n\n            svg {\n                color: #BD59FA;\n            }\n        `,\n        \"visual-builder__focused-toolbar\": css`\n            position: absolute;\n            transform: translateY(-100%);\n            z-index: 100000;\n            gap: 8px;\n            width: 0;\n            display: flex;\n            align-items: end;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__current-field\": css`\n            padding: 4px 8px !important;\n            background: #6c5ce7;\n            color: #fff;\n            z-index: 1;\n            border-radius: 2px !important;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            width: fit-content;\n\n            &:disabled {\n                filter: contrast(0.7);\n            }\n\n            .visual-builder__focused-toolbar__text {\n                padding-right: 3px;\n                height: 16px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__parent-field\": css`\n            pointer-events: none;\n            color: #5d50be;\n            padding: 4px !important;\n            margin-bottom: 3px;\n            display: none;\n            width: fit-content;\n            position: absolute;\n            z-index: 100000;\n        `,\n        \"field-label-dropdown-open\": css`\n            .visual-builder__focused-toolbar__field-label-wrapper__parent-field {\n                pointer-events: all;\n                visibility: visible;\n                display: initial;\n            }\n\n            .visual-builder__button--secondary:hover {\n                background-color: #6c5ce7;\n                color: #f9f8ff;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            position: relative;\n            margin-right: 0.5rem;\n        `,\n        \"visual-builder__focused-toolbar__field-label-container\": css`\n            display: flex;\n            height: 1.75rem;\n            align-items: center;\n        `,\n        \"visual-builder__button\": css`\n            background-color: transparent;\n            border: 1px solid transparent;\n            border-radius: 4px;\n            font-size: 16px;\n            font-weight: 600;\n            line-height: 100%;\n            padding: 8px 16px;\n            text-align: center;\n            z-index: 2147483647 !important;\n            transition:\n                color 0.15s ease-in-out,\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out;\n            // vertical-align: middle;\n            &:disabled {\n                cursor: not-allowed;\n                svg {\n                    fill: #999;\n                    path {\n                        fill: #999;\n                    }\n                }\n            }\n        `,\n        \"visual-builder__button--primary\": css`\n            background-color: #6c5ce7;\n            color: #fff;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n        `,\n        \"visual-builder__button--secondary\": css`\n            background-color: #f9f8ff;\n            border: 1px solid #6c5ce7;\n            color: #6c5ce7;\n        `,\n        \"visual-builder__button--edit\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__button-loader\": css`\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #ffffff;\n                }\n            }\n        `,\n        \"visual-builder__button--comment-loader\": css`\n            cursor: wait !important;\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__field-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__content-type-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__caret-right-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n            }\n        `,\n        \"visual-builder__reference-icon-container\": css`\n            display: flex;\n            align-items: center;\n\n            .visual-builder__field-icon {\n                svg {\n                    margin-right: 0px;\n                }\n            }\n        `,\n        \"visual-builder__focused-toolbar__button-group\": css`\n            display: flex;\n            background: #fff;\n            border-radius: 2px;\n            height: 100%;\n            padding: 4px !important;\n            z-index: 2147483647 !important;\n\n            &:has(.visual-builder__button) {\n                padding: 2px;\n                gap: 8px;\n            }\n\n            .visual-builder__button:enabled:hover {\n                background-color: #f5f5f5;\n\n                svg {\n                    color: #5d50be;\n                }\n            }\n\n            .visual-builder__button {\n                background-color: #fff;\n                border-color: transparent;\n                color: #475161;\n                padding: 4px;\n                min-width: 32px;\n                min-height: 32px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__text\": css`\n            font-family: Inter, \"sans-serif\";\n            font-size: 0.75rem;\n            font-style: normal;\n            font-weight: 400;\n            line-height: 150%;\n            letter-spacing: 0.015rem;\n            max-width: 150px;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            text-wrap: nowrap;\n        `,\n        \"visual-builder__focused-toolbar__multiple-field-toolbar\": css`\n            height: 40px;\n            z-index: 2147483647 !important;\n\n            svg {\n                height: 100%;\n                width: 100%;\n            }\n        `,\n        \"visual-builder__rotate--90\": css`\n            transform: rotate(90deg);\n        `,\n        \"visual-builder__focused-toolbar--field-disabled\": css`\n            pointer-events: none;\n            cursor: not-allowed;\n            .visual-builder__focused-toolbar__field-label-wrapper__current-field {\n                background: #909090;\n            }\n        `,\n        \"visual-builder__focused-toolbar--variant\": css`\n            .visual-builder__focused-toolbar__field-label-wrapper__current-field {\n                background: #BD59FA;\n            }\n\n        `,\n        \"visual-builder__cursor-disabled\": css`\n            .visual-builder__cursor-icon {\n                background: #909090;\n            }\n\n            .visual-builder__cursor-pointer path {\n                fill: #909090;\n            }\n        `,\n        \"visual-builder__tooltip\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: none;\n            }\n\n            &:hover:before,\n            &:hover:after {\n                display: block;\n                z-index: 2147483647 !important;\n            }\n\n            &:after {\n                display: none;\n            }\n        `,\n        \"visual-builder__tooltip--bottom\": css`\n            &:before {\n                bottom: -66px;\n            }\n            &:after {\n                bottom: -6px;\n                transform: rotate(180deg);\n            }\n        `,\n\n        \"visual-builder__tooltip--persistent\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: block;\n            }\n\n            &:after {\n                display: block;\n            }\n        `,\n        \"visual-builder__empty-block\": css`\n            width: 100%;\n            height: 100%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex-direction: column;\n            gap: 1rem;\n            min-height: 100px;\n        `,\n        \"visual-builder__empty-block-title\": css`\n            font-size: 0.95rem;\n            font-family: Inter;\n            font-weight: 400;\n            line-height: 100%;\n            color: #647696;\n        `,\n        \"visual-builder__empty-block-field-name\": css`\n            font-weight: 700;\n        `,\n        \"visual-builder__empty-block-add-button\": css`\n            height: 32px;\n            border-radius: 4px;\n            background: #f9f8ff;\n            border-color: #6c5ce7;\n            border-width: 1px;\n            padding: 0 16px;\n            font-size: 0.9rem;\n            font-family: Inter;\n            font-weight: 600;\n            color: #6c5ce7;\n            letter-spacing: 0.01rem;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__hover-outline\": css`\n            position: absolute;\n            outline: 2px dashed #6c5ce7;\n            transition: var(--outline-transition);\n            z-index: 2147483646 !important;\n        `,\n        \"visual-builder__hover-outline--hidden\": css`\n            visibility: hidden;\n        `,\n        \"visual-builder__hover-outline--unclickable\": css`\n            pointer-events: none;\n        `,\n        \"visual-builder__hover-outline--disabled\": css`\n            outline: 2px dashed #909090;\n        `,\n        \"visual-builder__hover-outline--variant\": css`\n            outline: 2px dashed #BD59FA;\n        `,\n        \"visual-builder__default-cursor--disabled\": css`\n            cursor: none;\n        `,\n        \"visual-builder__draft-field\": css`\n            outline: 2px dashed #eb5646;\n        `,\n        \"visual-builder__variant-field\": css`\n            outline: 2px solid #bd59fa;\n            outline-offset: -2px;\n        `,\n        \"visual-builder__pseudo-editable-element\": css`\n            z-index: 99999 !important;\n        `,\n        // cslp error styles\n        \"visual-builder__button-error\": css`\n            background-color: #ffeeeb;\n            padding: 0px !important;\n            &:hover {\n                background-color: #ffeeeb;\n            }\n        `,\n        \"visual-builder__focused-toolbar__error\": css`\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            column-gap: 3px;\n            padding: 4px 8px;\n        `,\n        \"visual-builder__focused-toolbar__error-text\": css`\n            font-weight: 400;\n            font-size: 12px;\n            line-height: 18px;\n            color: #a31b00;\n        `,\n        \"visual-builder__focused-toolbar__error-toolip\": css`\n            position: absolute;\n            width: 400px;\n            background-color: red;\n            left: 0;\n            top: -7px;\n            transform: translateY(-100%);\n            background-color: #767676;\n            border-radius: 4px;\n            box-shadow:\n                0px 1px 10px 0px #6c5ce733,\n                0px 5px 5px 0px #0000001f,\n                0px 2px 4px 0px #00000024;\n            padding: 12px;\n            text-align: left;\n\n            &:before {\n                content: \"\";\n                position: absolute;\n                bottom: -3px;\n                left: 4%;\n                transform: translateX(-50%) rotate(45deg);\n                width: 10px;\n                height: 10px;\n                background-color: #767676;\n            }\n\n            > p {\n                margin: 0;\n                color: #ffffff;\n                font-size: 14px;\n                font-weight: 600;\n                line-height: 21px;\n                margin-bottom: 4px;\n            }\n\n            > span {\n                color: #ffffff;\n                font-size: 12px;\n                font-weight: 400;\n                line-height: 18px;\n            }\n        `,\n        \"variant-field-revert-component\": css`\n            position: relative;\n            display: inline-block;\n            z-index: 2147483647 !important;\n        `,\n        \"variant-field-revert-component__dropdown-content\": css`\n            position: absolute;\n            top: -12px;\n            left: -4px;\n            background-color: #ffffff;\n            min-width: max-content;\n            box-shadow:\n                0 4px 15px 0 rgba(108, 92, 231, 0.2),\n                0 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0 8px 10px 1px rgba(0, 0, 0, 0.14);\n            z-index: 2147483647 !important;\n            margin-top: 4px;\n            padding: 4px 0px;\n            border-radius: 2px;\n        `,\n        \"variant-field-revert-component__dropdown-content__list-item\": css`\n            color: black;\n            font-weight: 400;\n            padding: 9.6px 16px;\n            text-decoration: none;\n            display: block;\n            font-size: 0.75rem;\n            height: 32px;\n            line-height: 2rem;\n            display: flex;\n            align-items: center;\n            z-index: 2147483647 !important;\n            cursor: pointer;\n            &:hover {\n                background-color: #f1f1f1;\n            }\n            &:hover > span {\n                color: #5d50be;\n            }\n            & > span {\n                margin-top: 4px;\n                margin-bottom: 4px;\n            }\n        `,\n        \"visual-builder__no-cursor-style\": css`\n            cursor: none !important;\n        `,\n        \"visual-builder__field-toolbar-container\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            z-index: 2147483647 !important;\n            position: relative;\n        `,\n        \"visual-builder__variant-button\": css`\n            display: flex;\n            min-width: 3rem !important;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            display: flex;\n            & svg path {\n                fill: #475161;\n            }\n        `,\n        \"visual-builder__field-location-icons-container\": css`\n            display: flex;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            margin-left: 0.25rem;\n        `,\n        \"visual-builder__field-location-icons-container__divider\": css`\n            height: 32px !important;\n            width: 1px;\n            border-radius: 2px;\n            background-color: #8a8f99;\n        `,\n        \"visual-builder__field-location-icons-container__app-icon\": css`\n            width: 24px;\n            height: 24px;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list\": css`\n            position: absolute;\n            top: 0;\n            background: #fff;\n            border: 1px solid #e0e0e0;\n            border-radius: 8px;\n            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n            z-index: 1000;\n            min-width: 230px;\n            max-height: 250px;\n            min-height: 250px;\n            overflow-y: auto;\n            display: flex;\n            flex-direction: column;\n        `,\n        \"visual-builder__field-location-app-list--left\": css`\n            right: 100%;\n            margin-right: 8px;\n        `,\n        \"visual-builder__field-location-app-list--right\": css`\n            left: 100%;\n            margin-left: 8px;\n        `,\n        \"visual-builder__field-location-app-list__search-container\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px 0px 16px;\n            border: none;\n            border-bottom: 1px solid #f0f0f0;\n        `,\n        \"visual-builder__field-location-app-list__search-input\": css`\n            width: 100%;\n            padding: 10px 12px;\n            font-size: 14px;\n            outline: none;\n            box-sizing: border-box;\n            border: none;\n        `,\n        \"visual-builder__field-location-app-list__search-icon\": css`\n            width: 14px;\n            height: 14px;\n        `,\n        \"visual-builder__field-location-app-list__content\": css`\n            flex: 1;\n            overflow-y: auto;\n        `,\n        \"visual-builder__field-location-app-list__no-results\": css`\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            height: 100%;\n            width: 100%;\n            text-align: center;\n        `,\n        \"visual-builder__field-location-app-list__no-results-text\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n        \"visual-builder__field-location-app-list__item\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px;\n            cursor: pointer;\n            font-size: 14px;\n        `,\n        \"visual-builder__field-location-app-list__item-icon-container\": css`\n            width: 24px;\n            height: 24px;\n            margin-right: 12px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__field-location-app-list__item-icon\": css`\n            width: 24px;\n            height: 24px;\n            border-radius: 50%;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list__item-title\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n    };\n}\n\nexport const VisualBuilderGlobalStyles = `\n       @import url(\"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap\");\n\n       [data-cslp] [contenteditable=\"true\"] {\n            outline: none;\n        }\n\n        @keyframes visual-builder__spinner {\n            0% {\n                transform: rotate(0deg);\n            }\n            100% {\n                transform: rotate(360deg);\n            }\n        }\n\n`;\n"],"mappings":"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","names":[]}

package/dist/modern/visualBuilder/visualBuilder.style.d.cts

@@ -20,6 +20,7 @@ declare function visualBuilderStyles(): {
     "visual-builder__cursor-icon": string;
     "visual-builder__cursor-pointer": string;
     "visual-builder__cursor-icon--loader": string;
+    "visual-builder__variant-indicator": string;
     "visual-builder__focused-toolbar": string;
     "visual-builder__focused-toolbar__field-label-wrapper__current-field": string;
     "visual-builder__focused-toolbar__field-label-wrapper__parent-field": string;
@@ -41,6 +42,7 @@ declare function visualBuilderStyles(): {
     "visual-builder__focused-toolbar__multiple-field-toolbar": string;
     "visual-builder__rotate--90": string;
     "visual-builder__focused-toolbar--field-disabled": string;
+    "visual-builder__focused-toolbar--variant": string;
     "visual-builder__cursor-disabled": string;
     "visual-builder__tooltip": string;
     "visual-builder__tooltip--bottom": string;
@@ -53,6 +55,7 @@ declare function visualBuilderStyles(): {
     "visual-builder__hover-outline--hidden": string;
     "visual-builder__hover-outline--unclickable": string;
     "visual-builder__hover-outline--disabled": string;
+    "visual-builder__hover-outline--variant": string;
     "visual-builder__default-cursor--disabled": string;
     "visual-builder__draft-field": string;
     "visual-builder__variant-field": string;

package/dist/modern/visualBuilder/visualBuilder.style.d.ts

@@ -20,6 +20,7 @@ declare function visualBuilderStyles(): {
     "visual-builder__cursor-icon": string;
     "visual-builder__cursor-pointer": string;
     "visual-builder__cursor-icon--loader": string;
+    "visual-builder__variant-indicator": string;
     "visual-builder__focused-toolbar": string;
     "visual-builder__focused-toolbar__field-label-wrapper__current-field": string;
     "visual-builder__focused-toolbar__field-label-wrapper__parent-field": string;
@@ -41,6 +42,7 @@ declare function visualBuilderStyles(): {
     "visual-builder__focused-toolbar__multiple-field-toolbar": string;
     "visual-builder__rotate--90": string;
     "visual-builder__focused-toolbar--field-disabled": string;
+    "visual-builder__focused-toolbar--variant": string;
     "visual-builder__cursor-disabled": string;
     "visual-builder__tooltip": string;
     "visual-builder__tooltip--bottom": string;
@@ -53,6 +55,7 @@ declare function visualBuilderStyles(): {
     "visual-builder__hover-outline--hidden": string;
     "visual-builder__hover-outline--unclickable": string;
     "visual-builder__hover-outline--disabled": string;
+    "visual-builder__hover-outline--variant": string;
     "visual-builder__default-cursor--disabled": string;
     "visual-builder__draft-field": string;
     "visual-builder__variant-field": string;

package/dist/modern/visualBuilder/visualBuilder.style.js

@@ -292,6 +292,21 @@ function visualBuilderStyles() {
     "visual-builder__cursor-icon--loader": css`
             animation: visual-builder__spinner 1s linear infinite;
         `,
+    "visual-builder__variant-indicator": css`
+            height: calc(100% - 1px);
+            aspect-ratio: 1;
+            background: white;
+            border-radius: 2px;
+            border-width: 2px;
+            border-style: solid;
+            align-content: center;
+            text-align: center;
+            border-color: #BD59FA;
+
+            svg {
+                color: #BD59FA;
+            }
+        `,
     "visual-builder__focused-toolbar": css`
             position: absolute;
             transform: translateY(-100%);
@@ -348,10 +363,11 @@ function visualBuilderStyles() {
             display: flex;
             flex-direction: column-reverse;
             position: relative;
+            margin-right: 0.5rem;
         `,
     "visual-builder__focused-toolbar__field-label-container": css`
             display: flex;
-            column-gap: 0.5rem;
+            height: 1.75rem;
             align-items: center;
         `,
     "visual-builder__button": css`
@@ -515,6 +531,12 @@ function visualBuilderStyles() {
                 background: #909090;
             }
         `,
+    "visual-builder__focused-toolbar--variant": css`
+            .visual-builder__focused-toolbar__field-label-wrapper__current-field {
+                background: #BD59FA;
+            }
+
+        `,
     "visual-builder__cursor-disabled": css`
             .visual-builder__cursor-icon {
                 background: #909090;
@@ -612,6 +634,9 @@ function visualBuilderStyles() {
     "visual-builder__hover-outline--disabled": css`
             outline: 2px dashed #909090;
         `,
+    "visual-builder__hover-outline--variant": css`
+            outline: 2px dashed #BD59FA;
+        `,
     "visual-builder__default-cursor--disabled": css`
             cursor: none;
         `,

package/dist/modern/visualBuilder/visualBuilder.style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/visualBuilder/visualBuilder.style.ts"],"sourcesContent":["import { css } from \"goober\";\n\nconst tooltipBaseStyle = `\n    pointer-events: all;\n    svg {\n        pointer-events: none;\n    }\n    &:before {\n        content: attr(data-tooltip);\n        position: absolute;\n        bottom: 20px;\n        margin-bottom: 24px;\n        padding: 12px;\n        border-radius: 4px;\n        width: max-content;\n        max-width: 200px;\n        color: #fff;\n        font-family: Inter;\n        font-size: 0.75rem;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 132%; /* 0.99rem */\n        letter-spacing: 0.015rem;\n        background: #767676;\n    }\n    &:after {\n        content: \"\";\n        position: absolute;\n        bottom: 28px;\n        /* the arrow */\n        border: 10px solid #000;\n        border-color: #767676 transparent transparent transparent;\n    }\n`;\n\nexport function visualBuilderStyles() {\n    return {\n        \"visual-builder__container\": css`\n            --outline-transition: all 0.15s ease-in;\n            font-family: \"Inter\", sans-serif;\n        `,\n        \"visual-builder__cursor\": css`\n            visibility: hidden;\n            height: 0;\n\n            &.visible {\n                visibility: visible;\n                position: fixed;\n                top: 0;\n                left: 0;\n                z-index: 2147483647 !important;\n\n                color: #fff;\n\n                height: auto;\n                padding: 0 10px;\n\n                display: flex;\n                align-items: center;\n                justify-content: center;\n\n                pointer-events: none !important;\n                position: fixed !important;\n                cursor: none;\n            }\n        `,\n        \"tooltip-container\": css`\n            position: absolute;\n            background-color: #767676;\n            color: white;\n            padding: 12px;\n            border-radius: 4px;\n            font-size: 12px;\n            line-height: 1.4;\n            z-index: 1000;\n            pointer-events: none;\n            max-width: 250px;\n            text-align: center;\n        `,\n        \"tooltip-arrow\": css`\n            position: absolute;\n            background: #767676;\n            width: 8px;\n            height: 8px;\n            transform: rotate(45deg);\n        `,\n        \"toolbar-tooltip-content\": css`\n            display: flex;\n            flex-direction: column;\n            gap: 4px;\n        `,\n        \"toolbar-tooltip-content-item\": css`\n            display: flex;\n            align-items: center;\n            justify-content: start;\n            gap: 4px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            p {\n                margin: 0;\n                color: #fff;\n                overflow: hidden;\n                text-overflow: ellipsis;\n                max-width: 100%;\n            }\n        `,\n        \"visual-builder__overlay__wrapper\": css`\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100vh;\n            visibility: hidden;\n            z-index: 99999;\n\n            pointer-events: none;\n\n            &.visible {\n                visibility: visible;\n            }\n        `,\n        \"visual-builder__empty-block-plus-icon\": css`\n            font-size: 22px;\n            font-weight: 300;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__overlay--outline\": css`\n            position: absolute;\n            outline: 4px solid #715cdd;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__overlay\": css`\n            background: rgba(0, 0, 0, 0.3);\n            box-sizing: content-box;\n            pointer-events: all;\n            position: absolute;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__add-button\": css`\n            position: absolute;\n            pointer-events: all;\n\n            background: #ffffff;\n            color: #475161;\n\n            border-radius: 4px;\n            border: 1px solid #6c5ce7;\n\n            height: 32px;\n            min-width: 32px;\n            max-width: 180px;\n            padding: 8px 6px;\n            transform: translate(-50%, -50%);\n\n            font-weight: 600;\n            color: #6c5ce7;\n            overflow: hidden;\n\n            z-index: 2147483646 !important;\n\n            display: grid;\n            grid-template-columns: min-content 0fr;\n            align-content: center;\n            gap: 0;\n\n            transition:\n                grid-template-columns 0.25s,\n                left 0.15s ease-in,\n                top 0.15s ease-in,\n                gap 0.15s ease-in;\n\n            &:has(.visual-builder__add-button-label):hover {\n                grid-template-columns: min-content 1fr;\n                gap: 8px;\n                padding: 8px 16px;\n            }\n\n            svg {\n                fill: #6c5ce7;\n            }\n\n            &:disabled {\n                border-color: #bbbec3;\n                cursor: not-allowed;\n            }\n\n            &:disabled svg {\n                fill: #bbbec3;\n            }\n        `,\n        \"visual-builder__add-button-label\": css`\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        `,\n        \"visual-builder__add-button--loading\": css`\n            cursor: wait;\n            /* we have not-allowed on disabled, so we need this */\n            &:disabled {\n                cursor: wait;\n            }\n        `,\n        \"visual-builder__start-editing-btn\": css`\n            z-index: 1000;\n            text-decoration: none;\n            position: fixed;\n            box-shadow:\n                0px 4px 15px 0px rgba(108, 92, 231, 0.2),\n                0px 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0px 8px 10px 1px rgba(0, 0, 0, 0.14);\n            display: inline-flex;\n            padding: 0.5rem 1rem;\n            justify-content: center;\n            align-items: center;\n            gap: 0.5rem;\n\n            border-radius: 4px;\n            border: 1px solid transparent;\n            background: #6c5ce7;\n            transition:\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out,\n                -webkit-box-shadow 0.15s ease-in-out;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n            &:focus {\n                outline: none;\n                box-shadow: 0 0 0 2px #ada4f4;\n            }\n            & > span {\n                color: #fff;\n                /* Body/P1 Bold */\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n\n            & > svg {\n                color: #fff;\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n        `,\n        \"visual-builder__start-editing-btn__bottom-right\": css`\n            bottom: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__bottom-left\": css`\n            bottom: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-right\": css`\n            top: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-left\": css`\n            top: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__cursor-icon\": css`\n            height: 40px;\n            width: 40px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            background: #5d50be;\n            border-radius: 50%;\n            position: absolute;\n            top: 0;\n            left: 0;\n        `,\n        \"visual-builder__cursor-pointer\": css`\n            position: absolute;\n            top: -8px;\n            left: -8px;\n        `,\n        \"visual-builder__cursor-icon--loader\": css`\n            animation: visual-builder__spinner 1s linear infinite;\n        `,\n        \"visual-builder__focused-toolbar\": css`\n            position: absolute;\n            transform: translateY(-100%);\n            z-index: 100000;\n            gap: 8px;\n            width: 0;\n            display: flex;\n            align-items: end;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__current-field\": css`\n            padding: 4px 8px !important;\n            background: #6c5ce7;\n            color: #fff;\n            z-index: 1;\n            border-radius: 2px !important;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            width: fit-content;\n\n            &:disabled {\n                filter: contrast(0.7);\n            }\n\n            .visual-builder__focused-toolbar__text {\n                padding-right: 3px;\n                height: 16px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__parent-field\": css`\n            pointer-events: none;\n            color: #5d50be;\n            padding: 4px !important;\n            margin-bottom: 3px;\n            display: none;\n            width: fit-content;\n            position: absolute;\n            z-index: 100000;\n        `,\n        \"field-label-dropdown-open\": css`\n            .visual-builder__focused-toolbar__field-label-wrapper__parent-field {\n                pointer-events: all;\n                visibility: visible;\n                display: initial;\n            }\n\n            .visual-builder__button--secondary:hover {\n                background-color: #6c5ce7;\n                color: #f9f8ff;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            position: relative;\n        `,\n        \"visual-builder__focused-toolbar__field-label-container\": css`\n            display: flex;\n            column-gap: 0.5rem;\n            align-items: center;\n        `,\n        \"visual-builder__button\": css`\n            background-color: transparent;\n            border: 1px solid transparent;\n            border-radius: 4px;\n            font-size: 16px;\n            font-weight: 600;\n            line-height: 100%;\n            padding: 8px 16px;\n            text-align: center;\n            z-index: 2147483647 !important;\n            transition:\n                color 0.15s ease-in-out,\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out;\n            // vertical-align: middle;\n            &:disabled {\n                cursor: not-allowed;\n                svg {\n                    fill: #999;\n                    path {\n                        fill: #999;\n                    }\n                }\n            }\n        `,\n        \"visual-builder__button--primary\": css`\n            background-color: #6c5ce7;\n            color: #fff;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n        `,\n        \"visual-builder__button--secondary\": css`\n            background-color: #f9f8ff;\n            border: 1px solid #6c5ce7;\n            color: #6c5ce7;\n        `,\n        \"visual-builder__button--edit\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__button-loader\": css`\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #ffffff;\n                }\n            }\n        `,\n        \"visual-builder__button--comment-loader\": css`\n            cursor: wait !important;\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__field-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__content-type-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__caret-right-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n            }\n        `,\n        \"visual-builder__reference-icon-container\": css`\n            display: flex;\n            align-items: center;\n\n            .visual-builder__field-icon {\n                svg {\n                    margin-right: 0px;\n                }\n            }\n        `,\n        \"visual-builder__focused-toolbar__button-group\": css`\n            display: flex;\n            background: #fff;\n            border-radius: 2px;\n            height: 100%;\n            padding: 4px !important;\n            z-index: 2147483647 !important;\n\n            &:has(.visual-builder__button) {\n                padding: 2px;\n                gap: 8px;\n            }\n\n            .visual-builder__button:enabled:hover {\n                background-color: #f5f5f5;\n\n                svg {\n                    color: #5d50be;\n                }\n            }\n\n            .visual-builder__button {\n                background-color: #fff;\n                border-color: transparent;\n                color: #475161;\n                padding: 4px;\n                min-width: 32px;\n                min-height: 32px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__text\": css`\n            font-family: Inter, \"sans-serif\";\n            font-size: 0.75rem;\n            font-style: normal;\n            font-weight: 400;\n            line-height: 150%;\n            letter-spacing: 0.015rem;\n            max-width: 150px;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            text-wrap: nowrap;\n        `,\n        \"visual-builder__focused-toolbar__multiple-field-toolbar\": css`\n            height: 40px;\n            z-index: 2147483647 !important;\n\n            svg {\n                height: 100%;\n                width: 100%;\n            }\n        `,\n        \"visual-builder__rotate--90\": css`\n            transform: rotate(90deg);\n        `,\n        \"visual-builder__focused-toolbar--field-disabled\": css`\n            pointer-events: none;\n            cursor: not-allowed;\n            .visual-builder__focused-toolbar__field-label-wrapper__current-field {\n                background: #909090;\n            }\n        `,\n        \"visual-builder__cursor-disabled\": css`\n            .visual-builder__cursor-icon {\n                background: #909090;\n            }\n\n            .visual-builder__cursor-pointer path {\n                fill: #909090;\n            }\n        `,\n        \"visual-builder__tooltip\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: none;\n            }\n\n            &:hover:before,\n            &:hover:after {\n                display: block;\n                z-index: 2147483647 !important;\n            }\n\n            &:after {\n                display: none;\n            }\n        `,\n        \"visual-builder__tooltip--bottom\": css`\n            &:before {\n                bottom: -66px;\n            }\n            &:after {\n                bottom: -6px;\n                transform: rotate(180deg);\n            }\n        `,\n\n        \"visual-builder__tooltip--persistent\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: block;\n            }\n\n            &:after {\n                display: block;\n            }\n        `,\n        \"visual-builder__empty-block\": css`\n            width: 100%;\n            height: 100%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex-direction: column;\n            gap: 1rem;\n            min-height: 100px;\n        `,\n        \"visual-builder__empty-block-title\": css`\n            font-size: 0.95rem;\n            font-family: Inter;\n            font-weight: 400;\n            line-height: 100%;\n            color: #647696;\n        `,\n        \"visual-builder__empty-block-field-name\": css`\n            font-weight: 700;\n        `,\n        \"visual-builder__empty-block-add-button\": css`\n            height: 32px;\n            border-radius: 4px;\n            background: #f9f8ff;\n            border-color: #6c5ce7;\n            border-width: 1px;\n            padding: 0 16px;\n            font-size: 0.9rem;\n            font-family: Inter;\n            font-weight: 600;\n            color: #6c5ce7;\n            letter-spacing: 0.01rem;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__hover-outline\": css`\n            position: absolute;\n            outline: 2px dashed #6c5ce7;\n            transition: var(--outline-transition);\n            z-index: 2147483646 !important;\n        `,\n        \"visual-builder__hover-outline--hidden\": css`\n            visibility: hidden;\n        `,\n        \"visual-builder__hover-outline--unclickable\": css`\n            pointer-events: none;\n        `,\n        \"visual-builder__hover-outline--disabled\": css`\n            outline: 2px dashed #909090;\n        `,\n        \"visual-builder__default-cursor--disabled\": css`\n            cursor: none;\n        `,\n        \"visual-builder__draft-field\": css`\n            outline: 2px dashed #eb5646;\n        `,\n        \"visual-builder__variant-field\": css`\n            outline: 2px solid #bd59fa;\n            outline-offset: -2px;\n        `,\n        \"visual-builder__pseudo-editable-element\": css`\n            z-index: 99999 !important;\n        `,\n        // cslp error styles\n        \"visual-builder__button-error\": css`\n            background-color: #ffeeeb;\n            padding: 0px !important;\n            &:hover {\n                background-color: #ffeeeb;\n            }\n        `,\n        \"visual-builder__focused-toolbar__error\": css`\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            column-gap: 3px;\n            padding: 4px 8px;\n        `,\n        \"visual-builder__focused-toolbar__error-text\": css`\n            font-weight: 400;\n            font-size: 12px;\n            line-height: 18px;\n            color: #a31b00;\n        `,\n        \"visual-builder__focused-toolbar__error-toolip\": css`\n            position: absolute;\n            width: 400px;\n            background-color: red;\n            left: 0;\n            top: -7px;\n            transform: translateY(-100%);\n            background-color: #767676;\n            border-radius: 4px;\n            box-shadow:\n                0px 1px 10px 0px #6c5ce733,\n                0px 5px 5px 0px #0000001f,\n                0px 2px 4px 0px #00000024;\n            padding: 12px;\n            text-align: left;\n\n            &:before {\n                content: \"\";\n                position: absolute;\n                bottom: -3px;\n                left: 4%;\n                transform: translateX(-50%) rotate(45deg);\n                width: 10px;\n                height: 10px;\n                background-color: #767676;\n            }\n\n            > p {\n                margin: 0;\n                color: #ffffff;\n                font-size: 14px;\n                font-weight: 600;\n                line-height: 21px;\n                margin-bottom: 4px;\n            }\n\n            > span {\n                color: #ffffff;\n                font-size: 12px;\n                font-weight: 400;\n                line-height: 18px;\n            }\n        `,\n        \"variant-field-revert-component\": css`\n            position: relative;\n            display: inline-block;\n            z-index: 2147483647 !important;\n        `,\n        \"variant-field-revert-component__dropdown-content\": css`\n            position: absolute;\n            top: -12px;\n            left: -4px;\n            background-color: #ffffff;\n            min-width: max-content;\n            box-shadow:\n                0 4px 15px 0 rgba(108, 92, 231, 0.2),\n                0 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0 8px 10px 1px rgba(0, 0, 0, 0.14);\n            z-index: 2147483647 !important;\n            margin-top: 4px;\n            padding: 4px 0px;\n            border-radius: 2px;\n        `,\n        \"variant-field-revert-component__dropdown-content__list-item\": css`\n            color: black;\n            font-weight: 400;\n            padding: 9.6px 16px;\n            text-decoration: none;\n            display: block;\n            font-size: 0.75rem;\n            height: 32px;\n            line-height: 2rem;\n            display: flex;\n            align-items: center;\n            z-index: 2147483647 !important;\n            cursor: pointer;\n            &:hover {\n                background-color: #f1f1f1;\n            }\n            &:hover > span {\n                color: #5d50be;\n            }\n            & > span {\n                margin-top: 4px;\n                margin-bottom: 4px;\n            }\n        `,\n        \"visual-builder__no-cursor-style\": css`\n            cursor: none !important;\n        `,\n        \"visual-builder__field-toolbar-container\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            z-index: 2147483647 !important;\n            position: relative;\n        `,\n        \"visual-builder__variant-button\": css`\n            display: flex;\n            min-width: 3rem !important;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            display: flex;\n            & svg path {\n                fill: #475161;\n            }\n        `,\n        \"visual-builder__field-location-icons-container\": css`\n            display: flex;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            margin-left: 0.25rem;\n        `,\n        \"visual-builder__field-location-icons-container__divider\": css`\n            height: 32px !important;\n            width: 1px;\n            border-radius: 2px;\n            background-color: #8a8f99;\n        `,\n        \"visual-builder__field-location-icons-container__app-icon\": css`\n            width: 24px;\n            height: 24px;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list\": css`\n            position: absolute;\n            top: 0;\n            background: #fff;\n            border: 1px solid #e0e0e0;\n            border-radius: 8px;\n            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n            z-index: 1000;\n            min-width: 230px;\n            max-height: 250px;\n            min-height: 250px;\n            overflow-y: auto;\n            display: flex;\n            flex-direction: column;\n        `,\n        \"visual-builder__field-location-app-list--left\": css`\n            right: 100%;\n            margin-right: 8px;\n        `,\n        \"visual-builder__field-location-app-list--right\": css`\n            left: 100%;\n            margin-left: 8px;\n        `,\n        \"visual-builder__field-location-app-list__search-container\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px 0px 16px;\n            border: none;\n            border-bottom: 1px solid #f0f0f0;\n        `,\n        \"visual-builder__field-location-app-list__search-input\": css`\n            width: 100%;\n            padding: 10px 12px;\n            font-size: 14px;\n            outline: none;\n            box-sizing: border-box;\n            border: none;\n        `,\n        \"visual-builder__field-location-app-list__search-icon\": css`\n            width: 14px;\n            height: 14px;\n        `,\n        \"visual-builder__field-location-app-list__content\": css`\n            flex: 1;\n            overflow-y: auto;\n        `,\n        \"visual-builder__field-location-app-list__no-results\": css`\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            height: 100%;\n            width: 100%;\n            text-align: center;\n        `,\n        \"visual-builder__field-location-app-list__no-results-text\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n        \"visual-builder__field-location-app-list__item\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px;\n            cursor: pointer;\n            font-size: 14px;\n        `,\n        \"visual-builder__field-location-app-list__item-icon-container\": css`\n            width: 24px;\n            height: 24px;\n            margin-right: 12px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__field-location-app-list__item-icon\": css`\n            width: 24px;\n            height: 24px;\n            border-radius: 50%;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list__item-title\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n    };\n}\n\nexport const VisualBuilderGlobalStyles = `\n       @import url(\"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap\");\n\n       [data-cslp] [contenteditable=\"true\"] {\n            outline: none;\n        }\n\n        @keyframes visual-builder__spinner {\n            0% {\n                transform: rotate(0deg);\n            }\n            100% {\n                transform: rotate(360deg);\n            }\n        }\n\n`;\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/visualBuilder/visualBuilder.style.ts"],"sourcesContent":["import { css } from \"goober\";\n\nconst tooltipBaseStyle = `\n    pointer-events: all;\n    svg {\n        pointer-events: none;\n    }\n    &:before {\n        content: attr(data-tooltip);\n        position: absolute;\n        bottom: 20px;\n        margin-bottom: 24px;\n        padding: 12px;\n        border-radius: 4px;\n        width: max-content;\n        max-width: 200px;\n        color: #fff;\n        font-family: Inter;\n        font-size: 0.75rem;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 132%; /* 0.99rem */\n        letter-spacing: 0.015rem;\n        background: #767676;\n    }\n    &:after {\n        content: \"\";\n        position: absolute;\n        bottom: 28px;\n        /* the arrow */\n        border: 10px solid #000;\n        border-color: #767676 transparent transparent transparent;\n    }\n`;\n\nexport function visualBuilderStyles() {\n    return {\n        \"visual-builder__container\": css`\n            --outline-transition: all 0.15s ease-in;\n            font-family: \"Inter\", sans-serif;\n        `,\n        \"visual-builder__cursor\": css`\n            visibility: hidden;\n            height: 0;\n\n            &.visible {\n                visibility: visible;\n                position: fixed;\n                top: 0;\n                left: 0;\n                z-index: 2147483647 !important;\n\n                color: #fff;\n\n                height: auto;\n                padding: 0 10px;\n\n                display: flex;\n                align-items: center;\n                justify-content: center;\n\n                pointer-events: none !important;\n                position: fixed !important;\n                cursor: none;\n            }\n        `,\n        \"tooltip-container\": css`\n            position: absolute;\n            background-color: #767676;\n            color: white;\n            padding: 12px;\n            border-radius: 4px;\n            font-size: 12px;\n            line-height: 1.4;\n            z-index: 1000;\n            pointer-events: none;\n            max-width: 250px;\n            text-align: center;\n        `,\n        \"tooltip-arrow\": css`\n            position: absolute;\n            background: #767676;\n            width: 8px;\n            height: 8px;\n            transform: rotate(45deg);\n        `,\n        \"toolbar-tooltip-content\": css`\n            display: flex;\n            flex-direction: column;\n            gap: 4px;\n        `,\n        \"toolbar-tooltip-content-item\": css`\n            display: flex;\n            align-items: center;\n            justify-content: start;\n            gap: 4px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            p {\n                margin: 0;\n                color: #fff;\n                overflow: hidden;\n                text-overflow: ellipsis;\n                max-width: 100%;\n            }\n        `,\n        \"visual-builder__overlay__wrapper\": css`\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100vh;\n            visibility: hidden;\n            z-index: 99999;\n\n            pointer-events: none;\n\n            &.visible {\n                visibility: visible;\n            }\n        `,\n        \"visual-builder__empty-block-plus-icon\": css`\n            font-size: 22px;\n            font-weight: 300;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__overlay--outline\": css`\n            position: absolute;\n            outline: 4px solid #715cdd;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__overlay\": css`\n            background: rgba(0, 0, 0, 0.3);\n            box-sizing: content-box;\n            pointer-events: all;\n            position: absolute;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__add-button\": css`\n            position: absolute;\n            pointer-events: all;\n\n            background: #ffffff;\n            color: #475161;\n\n            border-radius: 4px;\n            border: 1px solid #6c5ce7;\n\n            height: 32px;\n            min-width: 32px;\n            max-width: 180px;\n            padding: 8px 6px;\n            transform: translate(-50%, -50%);\n\n            font-weight: 600;\n            color: #6c5ce7;\n            overflow: hidden;\n\n            z-index: 2147483646 !important;\n\n            display: grid;\n            grid-template-columns: min-content 0fr;\n            align-content: center;\n            gap: 0;\n\n            transition:\n                grid-template-columns 0.25s,\n                left 0.15s ease-in,\n                top 0.15s ease-in,\n                gap 0.15s ease-in;\n\n            &:has(.visual-builder__add-button-label):hover {\n                grid-template-columns: min-content 1fr;\n                gap: 8px;\n                padding: 8px 16px;\n            }\n\n            svg {\n                fill: #6c5ce7;\n            }\n\n            &:disabled {\n                border-color: #bbbec3;\n                cursor: not-allowed;\n            }\n\n            &:disabled svg {\n                fill: #bbbec3;\n            }\n        `,\n        \"visual-builder__add-button-label\": css`\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        `,\n        \"visual-builder__add-button--loading\": css`\n            cursor: wait;\n            /* we have not-allowed on disabled, so we need this */\n            &:disabled {\n                cursor: wait;\n            }\n        `,\n        \"visual-builder__start-editing-btn\": css`\n            z-index: 1000;\n            text-decoration: none;\n            position: fixed;\n            box-shadow:\n                0px 4px 15px 0px rgba(108, 92, 231, 0.2),\n                0px 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0px 8px 10px 1px rgba(0, 0, 0, 0.14);\n            display: inline-flex;\n            padding: 0.5rem 1rem;\n            justify-content: center;\n            align-items: center;\n            gap: 0.5rem;\n\n            border-radius: 4px;\n            border: 1px solid transparent;\n            background: #6c5ce7;\n            transition:\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out,\n                -webkit-box-shadow 0.15s ease-in-out;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n            &:focus {\n                outline: none;\n                box-shadow: 0 0 0 2px #ada4f4;\n            }\n            & > span {\n                color: #fff;\n                /* Body/P1 Bold */\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n\n            & > svg {\n                color: #fff;\n                font-size: 1rem;\n                font-family: Inter;\n                font-weight: 600;\n                line-height: 150%;\n                letter-spacing: 0.01rem;\n                text-transform: capitalize;\n            }\n        `,\n        \"visual-builder__start-editing-btn__bottom-right\": css`\n            bottom: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__bottom-left\": css`\n            bottom: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-right\": css`\n            top: 30px;\n            right: 30px;\n        `,\n        \"visual-builder__start-editing-btn__top-left\": css`\n            top: 30px;\n            left: 30px;\n        `,\n        \"visual-builder__cursor-icon\": css`\n            height: 40px;\n            width: 40px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            background: #5d50be;\n            border-radius: 50%;\n            position: absolute;\n            top: 0;\n            left: 0;\n        `,\n        \"visual-builder__cursor-pointer\": css`\n            position: absolute;\n            top: -8px;\n            left: -8px;\n        `,\n        \"visual-builder__cursor-icon--loader\": css`\n            animation: visual-builder__spinner 1s linear infinite;\n        `,\n        \"visual-builder__variant-indicator\": css`\n            height: calc(100% - 1px);\n            aspect-ratio: 1;\n            background: white;\n            border-radius: 2px;\n            border-width: 2px;\n            border-style: solid;\n            align-content: center;\n            text-align: center;\n            border-color: #BD59FA;\n\n            svg {\n                color: #BD59FA;\n            }\n        `,\n        \"visual-builder__focused-toolbar\": css`\n            position: absolute;\n            transform: translateY(-100%);\n            z-index: 100000;\n            gap: 8px;\n            width: 0;\n            display: flex;\n            align-items: end;\n            transition: var(--outline-transition);\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__current-field\": css`\n            padding: 4px 8px !important;\n            background: #6c5ce7;\n            color: #fff;\n            z-index: 1;\n            border-radius: 2px !important;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            width: fit-content;\n\n            &:disabled {\n                filter: contrast(0.7);\n            }\n\n            .visual-builder__focused-toolbar__text {\n                padding-right: 3px;\n                height: 16px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper__parent-field\": css`\n            pointer-events: none;\n            color: #5d50be;\n            padding: 4px !important;\n            margin-bottom: 3px;\n            display: none;\n            width: fit-content;\n            position: absolute;\n            z-index: 100000;\n        `,\n        \"field-label-dropdown-open\": css`\n            .visual-builder__focused-toolbar__field-label-wrapper__parent-field {\n                pointer-events: all;\n                visibility: visible;\n                display: initial;\n            }\n\n            .visual-builder__button--secondary:hover {\n                background-color: #6c5ce7;\n                color: #f9f8ff;\n            }\n        `,\n        \"visual-builder__focused-toolbar__field-label-wrapper\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            position: relative;\n            margin-right: 0.5rem;\n        `,\n        \"visual-builder__focused-toolbar__field-label-container\": css`\n            display: flex;\n            height: 1.75rem;\n            align-items: center;\n        `,\n        \"visual-builder__button\": css`\n            background-color: transparent;\n            border: 1px solid transparent;\n            border-radius: 4px;\n            font-size: 16px;\n            font-weight: 600;\n            line-height: 100%;\n            padding: 8px 16px;\n            text-align: center;\n            z-index: 2147483647 !important;\n            transition:\n                color 0.15s ease-in-out,\n                background-color 0.15s ease-in-out,\n                border-color 0.15s ease-in-out,\n                box-shadow 0.15s ease-in-out;\n            // vertical-align: middle;\n            &:disabled {\n                cursor: not-allowed;\n                svg {\n                    fill: #999;\n                    path {\n                        fill: #999;\n                    }\n                }\n            }\n        `,\n        \"visual-builder__button--primary\": css`\n            background-color: #6c5ce7;\n            color: #fff;\n\n            &:hover {\n                background-color: #5d50be;\n            }\n        `,\n        \"visual-builder__button--secondary\": css`\n            background-color: #f9f8ff;\n            border: 1px solid #6c5ce7;\n            color: #6c5ce7;\n        `,\n        \"visual-builder__button--edit\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__button-loader\": css`\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #ffffff;\n                }\n            }\n        `,\n        \"visual-builder__button--comment-loader\": css`\n            cursor: wait !important;\n            svg.loader {\n                height: 16px;\n                width: 16px;\n\n                path {\n                    fill: #475161;\n                }\n            }\n        `,\n        \"visual-builder__field-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__content-type-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n                margin-right: 3px;\n            }\n        `,\n        \"visual-builder__caret-right-icon\": css`\n            svg {\n                height: 16px;\n                width: 16px;\n            }\n        `,\n        \"visual-builder__reference-icon-container\": css`\n            display: flex;\n            align-items: center;\n\n            .visual-builder__field-icon {\n                svg {\n                    margin-right: 0px;\n                }\n            }\n        `,\n        \"visual-builder__focused-toolbar__button-group\": css`\n            display: flex;\n            background: #fff;\n            border-radius: 2px;\n            height: 100%;\n            padding: 4px !important;\n            z-index: 2147483647 !important;\n\n            &:has(.visual-builder__button) {\n                padding: 2px;\n                gap: 8px;\n            }\n\n            .visual-builder__button:enabled:hover {\n                background-color: #f5f5f5;\n\n                svg {\n                    color: #5d50be;\n                }\n            }\n\n            .visual-builder__button {\n                background-color: #fff;\n                border-color: transparent;\n                color: #475161;\n                padding: 4px;\n                min-width: 32px;\n                min-height: 32px;\n            }\n        `,\n        \"visual-builder__focused-toolbar__text\": css`\n            font-family: Inter, \"sans-serif\";\n            font-size: 0.75rem;\n            font-style: normal;\n            font-weight: 400;\n            line-height: 150%;\n            letter-spacing: 0.015rem;\n            max-width: 150px;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            text-wrap: nowrap;\n        `,\n        \"visual-builder__focused-toolbar__multiple-field-toolbar\": css`\n            height: 40px;\n            z-index: 2147483647 !important;\n\n            svg {\n                height: 100%;\n                width: 100%;\n            }\n        `,\n        \"visual-builder__rotate--90\": css`\n            transform: rotate(90deg);\n        `,\n        \"visual-builder__focused-toolbar--field-disabled\": css`\n            pointer-events: none;\n            cursor: not-allowed;\n            .visual-builder__focused-toolbar__field-label-wrapper__current-field {\n                background: #909090;\n            }\n        `,\n        \"visual-builder__focused-toolbar--variant\": css`\n            .visual-builder__focused-toolbar__field-label-wrapper__current-field {\n                background: #BD59FA;\n            }\n\n        `,\n        \"visual-builder__cursor-disabled\": css`\n            .visual-builder__cursor-icon {\n                background: #909090;\n            }\n\n            .visual-builder__cursor-pointer path {\n                fill: #909090;\n            }\n        `,\n        \"visual-builder__tooltip\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: none;\n            }\n\n            &:hover:before,\n            &:hover:after {\n                display: block;\n                z-index: 2147483647 !important;\n            }\n\n            &:after {\n                display: none;\n            }\n        `,\n        \"visual-builder__tooltip--bottom\": css`\n            &:before {\n                bottom: -66px;\n            }\n            &:after {\n                bottom: -6px;\n                transform: rotate(180deg);\n            }\n        `,\n\n        \"visual-builder__tooltip--persistent\": css`\n            ${tooltipBaseStyle}\n\n            &:before {\n                display: block;\n            }\n\n            &:after {\n                display: block;\n            }\n        `,\n        \"visual-builder__empty-block\": css`\n            width: 100%;\n            height: 100%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex-direction: column;\n            gap: 1rem;\n            min-height: 100px;\n        `,\n        \"visual-builder__empty-block-title\": css`\n            font-size: 0.95rem;\n            font-family: Inter;\n            font-weight: 400;\n            line-height: 100%;\n            color: #647696;\n        `,\n        \"visual-builder__empty-block-field-name\": css`\n            font-weight: 700;\n        `,\n        \"visual-builder__empty-block-add-button\": css`\n            height: 32px;\n            border-radius: 4px;\n            background: #f9f8ff;\n            border-color: #6c5ce7;\n            border-width: 1px;\n            padding: 0 16px;\n            font-size: 0.9rem;\n            font-family: Inter;\n            font-weight: 600;\n            color: #6c5ce7;\n            letter-spacing: 0.01rem;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__hover-outline\": css`\n            position: absolute;\n            outline: 2px dashed #6c5ce7;\n            transition: var(--outline-transition);\n            z-index: 2147483646 !important;\n        `,\n        \"visual-builder__hover-outline--hidden\": css`\n            visibility: hidden;\n        `,\n        \"visual-builder__hover-outline--unclickable\": css`\n            pointer-events: none;\n        `,\n        \"visual-builder__hover-outline--disabled\": css`\n            outline: 2px dashed #909090;\n        `,\n        \"visual-builder__hover-outline--variant\": css`\n            outline: 2px dashed #BD59FA;\n        `,\n        \"visual-builder__default-cursor--disabled\": css`\n            cursor: none;\n        `,\n        \"visual-builder__draft-field\": css`\n            outline: 2px dashed #eb5646;\n        `,\n        \"visual-builder__variant-field\": css`\n            outline: 2px solid #bd59fa;\n            outline-offset: -2px;\n        `,\n        \"visual-builder__pseudo-editable-element\": css`\n            z-index: 99999 !important;\n        `,\n        // cslp error styles\n        \"visual-builder__button-error\": css`\n            background-color: #ffeeeb;\n            padding: 0px !important;\n            &:hover {\n                background-color: #ffeeeb;\n            }\n        `,\n        \"visual-builder__focused-toolbar__error\": css`\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            column-gap: 3px;\n            padding: 4px 8px;\n        `,\n        \"visual-builder__focused-toolbar__error-text\": css`\n            font-weight: 400;\n            font-size: 12px;\n            line-height: 18px;\n            color: #a31b00;\n        `,\n        \"visual-builder__focused-toolbar__error-toolip\": css`\n            position: absolute;\n            width: 400px;\n            background-color: red;\n            left: 0;\n            top: -7px;\n            transform: translateY(-100%);\n            background-color: #767676;\n            border-radius: 4px;\n            box-shadow:\n                0px 1px 10px 0px #6c5ce733,\n                0px 5px 5px 0px #0000001f,\n                0px 2px 4px 0px #00000024;\n            padding: 12px;\n            text-align: left;\n\n            &:before {\n                content: \"\";\n                position: absolute;\n                bottom: -3px;\n                left: 4%;\n                transform: translateX(-50%) rotate(45deg);\n                width: 10px;\n                height: 10px;\n                background-color: #767676;\n            }\n\n            > p {\n                margin: 0;\n                color: #ffffff;\n                font-size: 14px;\n                font-weight: 600;\n                line-height: 21px;\n                margin-bottom: 4px;\n            }\n\n            > span {\n                color: #ffffff;\n                font-size: 12px;\n                font-weight: 400;\n                line-height: 18px;\n            }\n        `,\n        \"variant-field-revert-component\": css`\n            position: relative;\n            display: inline-block;\n            z-index: 2147483647 !important;\n        `,\n        \"variant-field-revert-component__dropdown-content\": css`\n            position: absolute;\n            top: -12px;\n            left: -4px;\n            background-color: #ffffff;\n            min-width: max-content;\n            box-shadow:\n                0 4px 15px 0 rgba(108, 92, 231, 0.2),\n                0 3px 14px 3px rgba(0, 0, 0, 0.12),\n                0 8px 10px 1px rgba(0, 0, 0, 0.14);\n            z-index: 2147483647 !important;\n            margin-top: 4px;\n            padding: 4px 0px;\n            border-radius: 2px;\n        `,\n        \"variant-field-revert-component__dropdown-content__list-item\": css`\n            color: black;\n            font-weight: 400;\n            padding: 9.6px 16px;\n            text-decoration: none;\n            display: block;\n            font-size: 0.75rem;\n            height: 32px;\n            line-height: 2rem;\n            display: flex;\n            align-items: center;\n            z-index: 2147483647 !important;\n            cursor: pointer;\n            &:hover {\n                background-color: #f1f1f1;\n            }\n            &:hover > span {\n                color: #5d50be;\n            }\n            & > span {\n                margin-top: 4px;\n                margin-bottom: 4px;\n            }\n        `,\n        \"visual-builder__no-cursor-style\": css`\n            cursor: none !important;\n        `,\n        \"visual-builder__field-toolbar-container\": css`\n            display: flex;\n            flex-direction: column-reverse;\n            z-index: 2147483647 !important;\n            position: relative;\n        `,\n        \"visual-builder__variant-button\": css`\n            display: flex;\n            min-width: 3rem !important;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            display: flex;\n            & svg path {\n                fill: #475161;\n            }\n        `,\n        \"visual-builder__field-location-icons-container\": css`\n            display: flex;\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            margin-left: 0.25rem;\n        `,\n        \"visual-builder__field-location-icons-container__divider\": css`\n            height: 32px !important;\n            width: 1px;\n            border-radius: 2px;\n            background-color: #8a8f99;\n        `,\n        \"visual-builder__field-location-icons-container__app-icon\": css`\n            width: 24px;\n            height: 24px;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list\": css`\n            position: absolute;\n            top: 0;\n            background: #fff;\n            border: 1px solid #e0e0e0;\n            border-radius: 8px;\n            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n            z-index: 1000;\n            min-width: 230px;\n            max-height: 250px;\n            min-height: 250px;\n            overflow-y: auto;\n            display: flex;\n            flex-direction: column;\n        `,\n        \"visual-builder__field-location-app-list--left\": css`\n            right: 100%;\n            margin-right: 8px;\n        `,\n        \"visual-builder__field-location-app-list--right\": css`\n            left: 100%;\n            margin-left: 8px;\n        `,\n        \"visual-builder__field-location-app-list__search-container\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px 0px 16px;\n            border: none;\n            border-bottom: 1px solid #f0f0f0;\n        `,\n        \"visual-builder__field-location-app-list__search-input\": css`\n            width: 100%;\n            padding: 10px 12px;\n            font-size: 14px;\n            outline: none;\n            box-sizing: border-box;\n            border: none;\n        `,\n        \"visual-builder__field-location-app-list__search-icon\": css`\n            width: 14px;\n            height: 14px;\n        `,\n        \"visual-builder__field-location-app-list__content\": css`\n            flex: 1;\n            overflow-y: auto;\n        `,\n        \"visual-builder__field-location-app-list__no-results\": css`\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            height: 100%;\n            width: 100%;\n            text-align: center;\n        `,\n        \"visual-builder__field-location-app-list__no-results-text\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n        \"visual-builder__field-location-app-list__item\": css`\n            display: flex;\n            align-items: center;\n            padding: 10px 16px;\n            cursor: pointer;\n            font-size: 14px;\n        `,\n        \"visual-builder__field-location-app-list__item-icon-container\": css`\n            width: 24px;\n            height: 24px;\n            margin-right: 12px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        `,\n        \"visual-builder__field-location-app-list__item-icon\": css`\n            width: 24px;\n            height: 24px;\n            border-radius: 50%;\n            object-fit: cover;\n        `,\n        \"visual-builder__field-location-app-list__item-title\": css`\n            color: #373b40;\n            font-weight: 400;\n        `,\n    };\n}\n\nexport const VisualBuilderGlobalStyles = `\n       @import url(\"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap\");\n\n       [data-cslp] [contenteditable=\"true\"] {\n            outline: none;\n        }\n\n        @keyframes visual-builder__spinner {\n            0% {\n                transform: rotate(0deg);\n            }\n            100% {\n                transform: rotate(360deg);\n            }\n        }\n\n`;\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@contentstack/live-preview-utils",
-    "version": "4.0.1",
+    "version": "4.1.0",
     "description": "Contentstack provides the Live Preview SDK to establish a communication channel between the various Contentstack SDKs and your website, transmitting  live changes to the preview pane.",
     "type": "module",
     "types": "dist/legacy/index.d.ts",
@@ -56,7 +56,6 @@
         "@types/mustache": "^4.2.2",
         "@types/react": "^18.2.57",
         "@types/react-dom": "^18.2.19",
-        "@types/ssri": "^7.1.5",
         "@types/uuid": "^8.3.1",
         "@vitest/coverage-v8": "^2.1.2",
         "@vitest/ui": "^2.1.2",
@@ -71,7 +70,6 @@
         "jsdom": "^25.0.0",
         "prettier": "^3.3.3",
         "prettier-eslint": "^15.0.1",
-        "ssri": "^11.0.0",
         "ts-node": "^10.9.2",
         "tsc": "^2.0.4",
         "tsup": "^8.0.1",