@contentstack/live-preview-utils 3.0.1 → 3.1.0

package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs

@@ -32,6 +32,7 @@ var FieldRevertComponent_exports = {};
 __export(FieldRevertComponent_exports, {
   BASE_VARIANT_STATUS: () => BASE_VARIANT_STATUS,
   FieldRevertComponent: () => FieldRevertComponent,
+  VariantRevertDropdown: () => VariantRevertDropdown,
   getFieldVariantStatus: () => getFieldVariantStatus
 });
 module.exports = __toCommonJS(FieldRevertComponent_exports);
@@ -39,6 +40,9 @@ var import_classnames = __toESM(require("classnames"), 1);
 var import_compat = require("preact/compat");
 var import_visualBuilder = require("../../visualBuilder.style.cjs");
 var import_visualBuilderPostMessage = __toESM(require("../../utils/visualBuilderPostMessage.cjs"), 1);
+var import_variant = require("../icons/variant.cjs");
+var import_icons = require("../icons/index.cjs");
+var import_useHandleOutsideClick = __toESM(require("./useHandleOutsideClick.cjs"), 1);
 var import_jsx_runtime = require("preact/jsx-runtime");
 var BASE_VARIANT_STATUS = {
   isAddedInstances: false,
@@ -47,12 +51,12 @@ var BASE_VARIANT_STATUS = {
   isOrderChanged: false,
   fieldLevelCustomizations: false
 };
-async function getFieldVariantStatus(fieldPathWithIndex) {
+async function getFieldVariantStatus(fieldMetadata) {
   var _a;
   try {
     const result = await ((_a = import_visualBuilderPostMessage.default) == null ? void 0 : _a.send(
       "get-field-variant-status",
-      fieldPathWithIndex
+      fieldMetadata
     ));
     return result;
   } catch (error) {
@@ -67,18 +71,6 @@ var FieldRevertComponent = (props) => {
     isOpen,
     closeDropdown
   } = props;
-  const dropdownRef = (0, import_compat.useRef)(null);
-  (0, import_compat.useEffect)(() => {
-    const handleClickOutside = (event) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-        closeDropdown();
-      }
-    };
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
-  }, []);
   const getDropdownItems = () => {
     const {
       isAddedInstances,
@@ -154,11 +146,11 @@ var FieldRevertComponent = (props) => {
         "variant-field-revert-component",
         (0, import_visualBuilder.visualBuilderStyles)()["variant-field-revert-component"]
       ),
-      ref: dropdownRef,
       onClick: (e) => e.stopPropagation(),
       children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "div",
         {
+          "data-testid": "variant-field-revert-component__dropdown-content",
           className: (0, import_classnames.default)(
             "variant-field-revert-component__dropdown-content",
             (0, import_visualBuilder.visualBuilderStyles)()["variant-field-revert-component__dropdown-content"]
@@ -185,10 +177,65 @@ var FieldRevertComponent = (props) => {
     }
   );
 };
+var VariantRevertDropdown = (props) => {
+  const {
+    closeDropdown,
+    invertTooltipPosition,
+    toggleVariantDropdown,
+    variantStatus = BASE_VARIANT_STATUS
+  } = props;
+  const dropdownRef = (0, import_compat.useRef)(null);
+  (0, import_useHandleOutsideClick.default)(dropdownRef, closeDropdown);
+  const hasDropdownItems = Object.values(variantStatus).some(
+    (value) => value
+  );
+  const buttonClassNames = (0, import_classnames.default)(
+    "visual-builder__button visual-builder__button--secondary",
+    (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__button"],
+    (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__button--secondary"],
+    (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__tooltip"],
+    {
+      "visual-builder__tooltip--bottom": invertTooltipPosition,
+      [(0, import_visualBuilder.visualBuilderStyles)()["visual-builder__tooltip--bottom"]]: invertTooltipPosition
+    }
+  );
+  if (!hasDropdownItems) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "button",
+      {
+        className: (0, import_classnames.default)(buttonClassNames),
+        style: { padding: "6px" },
+        "data-tooltip": "Variant",
+        "data-testid": `visual-builder-canvas-variant-icon`,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_variant.VariantIcon, {})
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: dropdownRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "button",
+      {
+        className: (0, import_classnames.default)(
+          buttonClassNames,
+          (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__variant-button"]
+        ),
+        "data-tooltip": "Variant Revert",
+        "data-testid": `visual-builder-canvas-variant-revert`,
+        onClick: toggleVariantDropdown,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_variant.VariantIcon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CaretIcon, { open: props.isOpen })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldRevertComponent, { ...props })
+  ] });
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   BASE_VARIANT_STATUS,
   FieldRevertComponent,
+  VariantRevertDropdown,
   getFieldVariantStatus
 });
 //# sourceMappingURL=FieldRevertComponent.cjs.map

package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/visualBuilder/components/FieldRevert/FieldRevertComponent.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport React, { useRef, useEffect } from \"preact/compat\";\nimport { visualBuilderStyles } from \"../../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../../utils/visualBuilderPostMessage\";\nimport { CslpData } from \"../../../cslp/types/cslp.types\";\n\nexport interface IVariantStatus {\n    fieldLevelCustomizations: boolean;\n    isBaseModified: boolean;\n    isAddedInstances: boolean;\n    isDeletedInstances: boolean;\n    isOrderChanged: boolean;\n}\n\nexport type TFieldRevertActionCallback =\n    | \"revert_to_base_entry_value\"\n    | \"revert_added_instances\"\n    | \"restore_deleted_instances\"\n    | \"reset_field_level_customizations\"\n    | \"restore_sorted_instances\";\n\ninterface FieldRevertComponentProps {\n    fieldDataName: string;\n    fieldMetadata: CslpData;\n    isOpen: boolean;\n    closeDropdown: () => void;\n    variantStatus?: IVariantStatus;\n}\n\ninterface IItem {\n    label: string;\n    action: TFieldRevertActionCallback;\n    id: string;\n    testId: string;\n    fieldDataName: string;\n}\n\nexport const BASE_VARIANT_STATUS: IVariantStatus = {\n    isAddedInstances: false,\n    isBaseModified: false,\n    isDeletedInstances: false,\n    isOrderChanged: false,\n    fieldLevelCustomizations: false,\n};\n\nexport async function getFieldVariantStatus(\n    fieldPathWithIndex: string\n): Promise<IVariantStatus | undefined> {\n    try {\n        const result = await visualBuilderPostMessage?.send<IVariantStatus>(\n            \"get-field-variant-status\",\n            fieldPathWithIndex\n        );\n        return result;\n    } catch (error) {\n        console.error(\"Failed to get field variant status:\", error);\n    }\n}\n\nexport const FieldRevertComponent = (props: FieldRevertComponentProps) => {\n    const {\n        fieldDataName,\n        fieldMetadata,\n        variantStatus = BASE_VARIANT_STATUS,\n        isOpen,\n        closeDropdown,\n    } = props;\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (\n                dropdownRef.current &&\n                !dropdownRef.current.contains(event.target as Node)\n            ) {\n                closeDropdown();\n            }\n        };\n\n        document.addEventListener(\"mousedown\", handleClickOutside);\n        return () => {\n            document.removeEventListener(\"mousedown\", handleClickOutside);\n        };\n    }, []);\n\n    const getDropdownItems = () => {\n        const {\n            isAddedInstances,\n            isDeletedInstances,\n            isBaseModified,\n            isOrderChanged,\n            fieldLevelCustomizations,\n        } = variantStatus;\n\n        const dropdownItems: IItem[] = [];\n\n        if (isBaseModified) {\n            dropdownItems.push({\n                label: \"Revert to base entry value\",\n                action: \"revert_to_base_entry_value\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                fieldDataName,\n            });\n        }\n\n        if (isAddedInstances) {\n            dropdownItems.push({\n                label: \"Revert added instances\",\n                action: \"revert_added_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (isDeletedInstances) {\n            dropdownItems.push({\n                label: \"Restore deleted instances\",\n                action: \"restore_deleted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (fieldLevelCustomizations) {\n            dropdownItems.push({\n                label: \"Reset field-level customizations\",\n                action: \"reset_field_level_customizations\",\n                id: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                fieldDataName,\n            });\n        }\n\n        if (isOrderChanged) {\n            dropdownItems.push({\n                label: \"Restore sorted instances\",\n                action: \"restore_sorted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                fieldDataName,\n            });\n        }\n\n        return dropdownItems;\n    };\n\n    const dropdownItems = getDropdownItems();\n\n    function handleOnClick(item: IItem) {\n        const { fieldDataName, action } = item;\n        visualBuilderPostMessage?.send(\"send-variant-revert-action-trigger\", {\n            fieldDataName,\n            action,\n            euid: fieldMetadata.entry_uid,\n            ct_uid: fieldMetadata.content_type_uid,\n            locale: fieldMetadata.locale,\n        });\n    }\n\n    return (\n        <div\n            className={classNames(\n                \"variant-field-revert-component\",\n                visualBuilderStyles()[\"variant-field-revert-component\"]\n            )}\n            ref={dropdownRef}\n            onClick={(e) => e.stopPropagation()}\n        >\n            {isOpen && (\n                <div\n                    className={classNames(\n                        \"variant-field-revert-component__dropdown-content\",\n                        visualBuilderStyles()[\n                            \"variant-field-revert-component__dropdown-content\"\n                        ]\n                    )}\n                >\n                    {dropdownItems.map((item) => (\n                        <div\n                            className={classNames(\n                                \"variant-field-revert-component__dropdown-content__list-item\",\n                                visualBuilderStyles()[\n                                    \"variant-field-revert-component__dropdown-content__list-item\"\n                                ]\n                            )}\n                            onClick={(e) => {\n                                e.preventDefault();\n                                handleOnClick(item);\n                                closeDropdown();\n                            }}\n                            key={item.id}\n                            data-testid={item.testId}\n                        >\n                            <span>{item.label}</span>\n                        </div>\n                    ))}\n                </div>\n            )}\n        </div>\n    );\n};\n"],"mappings":"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","names":["visualBuilderPostMessage","dropdownItems","fieldDataName","classNames"]}
+{"version":3,"sources":["../../../../../src/visualBuilder/components/FieldRevert/FieldRevertComponent.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport React, { useRef, useEffect } from \"preact/compat\";\nimport { visualBuilderStyles } from \"../../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../../utils/visualBuilderPostMessage\";\nimport { CslpData } from \"../../../cslp/types/cslp.types\";\nimport { VariantIcon } from \"../icons/variant\";\nimport { CaretIcon } from \"../icons\";\nimport useHandleOutsideClick from \"./useHandleOutsideClick\";\n\nexport interface IVariantStatus {\n    fieldLevelCustomizations: boolean;\n    isBaseModified: boolean;\n    isAddedInstances: boolean;\n    isDeletedInstances: boolean;\n    isOrderChanged: boolean;\n}\n\nexport type TFieldRevertActionCallback =\n    | \"revert_to_base_entry_value\"\n    | \"revert_added_instances\"\n    | \"restore_deleted_instances\"\n    | \"reset_field_level_customizations\"\n    | \"restore_sorted_instances\";\n\ninterface FieldRevertComponentProps {\n    fieldDataName: string;\n    fieldMetadata: CslpData;\n    isOpen: boolean;\n    closeDropdown: () => void;\n    variantStatus?: IVariantStatus;\n}\n\ninterface IItem {\n    label: string;\n    action: TFieldRevertActionCallback;\n    id: string;\n    testId: string;\n    fieldDataName: string;\n}\n\nexport const BASE_VARIANT_STATUS: IVariantStatus = {\n    isAddedInstances: false,\n    isBaseModified: false,\n    isDeletedInstances: false,\n    isOrderChanged: false,\n    fieldLevelCustomizations: false,\n};\n\nexport async function getFieldVariantStatus(\n    fieldMetadata: CslpData\n): Promise<IVariantStatus | undefined> {\n    try {\n        const result = await visualBuilderPostMessage?.send<IVariantStatus>(\n            \"get-field-variant-status\",\n            fieldMetadata\n        );\n        return result;\n    } catch (error) {\n        console.error(\"Failed to get field variant status:\", error);\n    }\n}\n\nexport const FieldRevertComponent = (props: FieldRevertComponentProps) => {\n    const {\n        fieldDataName,\n        fieldMetadata,\n        variantStatus = BASE_VARIANT_STATUS,\n        isOpen,\n        closeDropdown,\n    } = props;\n\n    const getDropdownItems = () => {\n        const {\n            isAddedInstances,\n            isDeletedInstances,\n            isBaseModified,\n            isOrderChanged,\n            fieldLevelCustomizations,\n        } = variantStatus;\n\n        const dropdownItems: IItem[] = [];\n\n        if (isBaseModified) {\n            dropdownItems.push({\n                label: \"Revert to base entry value\",\n                action: \"revert_to_base_entry_value\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                fieldDataName,\n            });\n        }\n\n        if (isAddedInstances) {\n            dropdownItems.push({\n                label: \"Revert added instances\",\n                action: \"revert_added_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (isDeletedInstances) {\n            dropdownItems.push({\n                label: \"Restore deleted instances\",\n                action: \"restore_deleted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (fieldLevelCustomizations) {\n            dropdownItems.push({\n                label: \"Reset field-level customizations\",\n                action: \"reset_field_level_customizations\",\n                id: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                fieldDataName,\n            });\n        }\n\n        if (isOrderChanged) {\n            dropdownItems.push({\n                label: \"Restore sorted instances\",\n                action: \"restore_sorted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                fieldDataName,\n            });\n        }\n\n        return dropdownItems;\n    };\n\n    const dropdownItems = getDropdownItems();\n\n    function handleOnClick(item: IItem) {\n        const { fieldDataName, action } = item;\n        visualBuilderPostMessage?.send(\"send-variant-revert-action-trigger\", {\n            fieldDataName,\n            action,\n            euid: fieldMetadata.entry_uid,\n            ct_uid: fieldMetadata.content_type_uid,\n            locale: fieldMetadata.locale,\n        });\n    }\n\n    return (\n        <div\n            className={classNames(\n                \"variant-field-revert-component\",\n                visualBuilderStyles()[\"variant-field-revert-component\"]\n            )}\n            onClick={(e) => e.stopPropagation()}\n        >\n            {isOpen && (\n                <div\n                    data-testid=\"variant-field-revert-component__dropdown-content\"\n                    className={classNames(\n                        \"variant-field-revert-component__dropdown-content\",\n                        visualBuilderStyles()[\n                            \"variant-field-revert-component__dropdown-content\"\n                        ]\n                    )}\n                >\n                    {dropdownItems.map((item) => (\n                        <div\n                            className={classNames(\n                                \"variant-field-revert-component__dropdown-content__list-item\",\n                                visualBuilderStyles()[\n                                    \"variant-field-revert-component__dropdown-content__list-item\"\n                                ]\n                            )}\n                            onClick={(e) => {\n                                e.preventDefault();\n                                handleOnClick(item);\n                                closeDropdown();\n                            }}\n                            key={item.id}\n                            data-testid={item.testId}\n                        >\n                            <span>{item.label}</span>\n                        </div>\n                    ))}\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport const VariantRevertDropdown = (props: any) => {\n    const {\n        closeDropdown,\n        invertTooltipPosition,\n        toggleVariantDropdown,\n        variantStatus = BASE_VARIANT_STATUS,\n    } = props;\n    const dropdownRef = useRef<HTMLDivElement>(null);\n    useHandleOutsideClick(dropdownRef, closeDropdown);\n    const hasDropdownItems = Object.values(variantStatus).some(\n        (value) => value\n    );\n\n    const buttonClassNames = classNames(\n        \"visual-builder__button visual-builder__button--secondary\",\n        visualBuilderStyles()[\"visual-builder__button\"],\n        visualBuilderStyles()[\"visual-builder__button--secondary\"],\n        visualBuilderStyles()[\"visual-builder__tooltip\"],\n        {\n            \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n            [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n                invertTooltipPosition,\n        }\n    );\n\n    if (!hasDropdownItems) {\n        return (\n            <button\n                className={classNames(buttonClassNames)}\n                style={{ padding: \"6px\" }}\n                data-tooltip={\"Variant\"}\n                data-testid={`visual-builder-canvas-variant-icon`}\n            >\n                <VariantIcon />\n            </button>\n        );\n    }\n    return (\n        <div ref={dropdownRef}>\n            <button\n                className={classNames(\n                    buttonClassNames,\n                    visualBuilderStyles()[\"visual-builder__variant-button\"]\n                )}\n                data-tooltip={\"Variant Revert\"}\n                data-testid={`visual-builder-canvas-variant-revert`}\n                onClick={toggleVariantDropdown}\n            >\n                <VariantIcon />\n                <CaretIcon open={props.isOpen} />\n            </button>\n            <FieldRevertComponent {...props} />\n        </div>\n    );\n};\n"],"mappings":"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","names":["visualBuilderPostMessage","dropdownItems","fieldDataName","classNames","useHandleOutsideClick"]}

package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.d.cts

@@ -17,7 +17,8 @@ interface FieldRevertComponentProps {
     variantStatus?: IVariantStatus;
 }
 declare const BASE_VARIANT_STATUS: IVariantStatus;
-declare function getFieldVariantStatus(fieldPathWithIndex: string): Promise<IVariantStatus | undefined>;
+declare function getFieldVariantStatus(fieldMetadata: CslpData): Promise<IVariantStatus | undefined>;
 declare const FieldRevertComponent: (props: FieldRevertComponentProps) => react_jsx_runtime.JSX.Element;
+declare const VariantRevertDropdown: (props: any) => react_jsx_runtime.JSX.Element;
 
-export { BASE_VARIANT_STATUS, FieldRevertComponent, type IVariantStatus, type TFieldRevertActionCallback, getFieldVariantStatus };
+export { BASE_VARIANT_STATUS, FieldRevertComponent, type IVariantStatus, type TFieldRevertActionCallback, VariantRevertDropdown, getFieldVariantStatus };

package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.d.ts

@@ -17,7 +17,8 @@ interface FieldRevertComponentProps {
     variantStatus?: IVariantStatus;
 }
 declare const BASE_VARIANT_STATUS: IVariantStatus;
-declare function getFieldVariantStatus(fieldPathWithIndex: string): Promise<IVariantStatus | undefined>;
+declare function getFieldVariantStatus(fieldMetadata: CslpData): Promise<IVariantStatus | undefined>;
 declare const FieldRevertComponent: (props: FieldRevertComponentProps) => react_jsx_runtime.JSX.Element;
+declare const VariantRevertDropdown: (props: any) => react_jsx_runtime.JSX.Element;
 
-export { BASE_VARIANT_STATUS, FieldRevertComponent, type IVariantStatus, type TFieldRevertActionCallback, getFieldVariantStatus };
+export { BASE_VARIANT_STATUS, FieldRevertComponent, type IVariantStatus, type TFieldRevertActionCallback, VariantRevertDropdown, getFieldVariantStatus };

package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js

@@ -2,10 +2,13 @@ import "../../../chunk-5WRI5ZAA.js";
 
 // src/visualBuilder/components/FieldRevert/FieldRevertComponent.tsx
 import classNames from "classnames";
-import { useRef, useEffect } from "preact/compat";
+import { useRef } from "preact/compat";
 import { visualBuilderStyles } from "../../visualBuilder.style.js";
 import visualBuilderPostMessage from "../../utils/visualBuilderPostMessage.js";
-import { jsx } from "preact/jsx-runtime";
+import { VariantIcon } from "../icons/variant.js";
+import { CaretIcon } from "../icons/index.js";
+import useHandleOutsideClick from "./useHandleOutsideClick.js";
+import { jsx, jsxs } from "preact/jsx-runtime";
 var BASE_VARIANT_STATUS = {
   isAddedInstances: false,
   isBaseModified: false,
@@ -13,12 +16,12 @@ var BASE_VARIANT_STATUS = {
   isOrderChanged: false,
   fieldLevelCustomizations: false
 };
-async function getFieldVariantStatus(fieldPathWithIndex) {
+async function getFieldVariantStatus(fieldMetadata) {
   var _a;
   try {
     const result = await ((_a = visualBuilderPostMessage) == null ? void 0 : _a.send(
       "get-field-variant-status",
-      fieldPathWithIndex
+      fieldMetadata
     ));
     return result;
   } catch (error) {
@@ -33,18 +36,6 @@ var FieldRevertComponent = (props) => {
     isOpen,
     closeDropdown
   } = props;
-  const dropdownRef = useRef(null);
-  useEffect(() => {
-    const handleClickOutside = (event) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-        closeDropdown();
-      }
-    };
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
-  }, []);
   const getDropdownItems = () => {
     const {
       isAddedInstances,
@@ -120,11 +111,11 @@ var FieldRevertComponent = (props) => {
         "variant-field-revert-component",
         visualBuilderStyles()["variant-field-revert-component"]
       ),
-      ref: dropdownRef,
       onClick: (e) => e.stopPropagation(),
       children: isOpen && /* @__PURE__ */ jsx(
         "div",
         {
+          "data-testid": "variant-field-revert-component__dropdown-content",
           className: classNames(
             "variant-field-revert-component__dropdown-content",
             visualBuilderStyles()["variant-field-revert-component__dropdown-content"]
@@ -151,9 +142,64 @@ var FieldRevertComponent = (props) => {
     }
   );
 };
+var VariantRevertDropdown = (props) => {
+  const {
+    closeDropdown,
+    invertTooltipPosition,
+    toggleVariantDropdown,
+    variantStatus = BASE_VARIANT_STATUS
+  } = props;
+  const dropdownRef = useRef(null);
+  useHandleOutsideClick(dropdownRef, closeDropdown);
+  const hasDropdownItems = Object.values(variantStatus).some(
+    (value) => value
+  );
+  const buttonClassNames = classNames(
+    "visual-builder__button visual-builder__button--secondary",
+    visualBuilderStyles()["visual-builder__button"],
+    visualBuilderStyles()["visual-builder__button--secondary"],
+    visualBuilderStyles()["visual-builder__tooltip"],
+    {
+      "visual-builder__tooltip--bottom": invertTooltipPosition,
+      [visualBuilderStyles()["visual-builder__tooltip--bottom"]]: invertTooltipPosition
+    }
+  );
+  if (!hasDropdownItems) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: classNames(buttonClassNames),
+        style: { padding: "6px" },
+        "data-tooltip": "Variant",
+        "data-testid": `visual-builder-canvas-variant-icon`,
+        children: /* @__PURE__ */ jsx(VariantIcon, {})
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: classNames(
+          buttonClassNames,
+          visualBuilderStyles()["visual-builder__variant-button"]
+        ),
+        "data-tooltip": "Variant Revert",
+        "data-testid": `visual-builder-canvas-variant-revert`,
+        onClick: toggleVariantDropdown,
+        children: [
+          /* @__PURE__ */ jsx(VariantIcon, {}),
+          /* @__PURE__ */ jsx(CaretIcon, { open: props.isOpen })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(FieldRevertComponent, { ...props })
+  ] });
+};
 export {
   BASE_VARIANT_STATUS,
   FieldRevertComponent,
+  VariantRevertDropdown,
   getFieldVariantStatus
 };
 //# sourceMappingURL=FieldRevertComponent.js.map

package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/visualBuilder/components/FieldRevert/FieldRevertComponent.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport React, { useRef, useEffect } from \"preact/compat\";\nimport { visualBuilderStyles } from \"../../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../../utils/visualBuilderPostMessage\";\nimport { CslpData } from \"../../../cslp/types/cslp.types\";\n\nexport interface IVariantStatus {\n    fieldLevelCustomizations: boolean;\n    isBaseModified: boolean;\n    isAddedInstances: boolean;\n    isDeletedInstances: boolean;\n    isOrderChanged: boolean;\n}\n\nexport type TFieldRevertActionCallback =\n    | \"revert_to_base_entry_value\"\n    | \"revert_added_instances\"\n    | \"restore_deleted_instances\"\n    | \"reset_field_level_customizations\"\n    | \"restore_sorted_instances\";\n\ninterface FieldRevertComponentProps {\n    fieldDataName: string;\n    fieldMetadata: CslpData;\n    isOpen: boolean;\n    closeDropdown: () => void;\n    variantStatus?: IVariantStatus;\n}\n\ninterface IItem {\n    label: string;\n    action: TFieldRevertActionCallback;\n    id: string;\n    testId: string;\n    fieldDataName: string;\n}\n\nexport const BASE_VARIANT_STATUS: IVariantStatus = {\n    isAddedInstances: false,\n    isBaseModified: false,\n    isDeletedInstances: false,\n    isOrderChanged: false,\n    fieldLevelCustomizations: false,\n};\n\nexport async function getFieldVariantStatus(\n    fieldPathWithIndex: string\n): Promise<IVariantStatus | undefined> {\n    try {\n        const result = await visualBuilderPostMessage?.send<IVariantStatus>(\n            \"get-field-variant-status\",\n            fieldPathWithIndex\n        );\n        return result;\n    } catch (error) {\n        console.error(\"Failed to get field variant status:\", error);\n    }\n}\n\nexport const FieldRevertComponent = (props: FieldRevertComponentProps) => {\n    const {\n        fieldDataName,\n        fieldMetadata,\n        variantStatus = BASE_VARIANT_STATUS,\n        isOpen,\n        closeDropdown,\n    } = props;\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (\n                dropdownRef.current &&\n                !dropdownRef.current.contains(event.target as Node)\n            ) {\n                closeDropdown();\n            }\n        };\n\n        document.addEventListener(\"mousedown\", handleClickOutside);\n        return () => {\n            document.removeEventListener(\"mousedown\", handleClickOutside);\n        };\n    }, []);\n\n    const getDropdownItems = () => {\n        const {\n            isAddedInstances,\n            isDeletedInstances,\n            isBaseModified,\n            isOrderChanged,\n            fieldLevelCustomizations,\n        } = variantStatus;\n\n        const dropdownItems: IItem[] = [];\n\n        if (isBaseModified) {\n            dropdownItems.push({\n                label: \"Revert to base entry value\",\n                action: \"revert_to_base_entry_value\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                fieldDataName,\n            });\n        }\n\n        if (isAddedInstances) {\n            dropdownItems.push({\n                label: \"Revert added instances\",\n                action: \"revert_added_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (isDeletedInstances) {\n            dropdownItems.push({\n                label: \"Restore deleted instances\",\n                action: \"restore_deleted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (fieldLevelCustomizations) {\n            dropdownItems.push({\n                label: \"Reset field-level customizations\",\n                action: \"reset_field_level_customizations\",\n                id: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                fieldDataName,\n            });\n        }\n\n        if (isOrderChanged) {\n            dropdownItems.push({\n                label: \"Restore sorted instances\",\n                action: \"restore_sorted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                fieldDataName,\n            });\n        }\n\n        return dropdownItems;\n    };\n\n    const dropdownItems = getDropdownItems();\n\n    function handleOnClick(item: IItem) {\n        const { fieldDataName, action } = item;\n        visualBuilderPostMessage?.send(\"send-variant-revert-action-trigger\", {\n            fieldDataName,\n            action,\n            euid: fieldMetadata.entry_uid,\n            ct_uid: fieldMetadata.content_type_uid,\n            locale: fieldMetadata.locale,\n        });\n    }\n\n    return (\n        <div\n            className={classNames(\n                \"variant-field-revert-component\",\n                visualBuilderStyles()[\"variant-field-revert-component\"]\n            )}\n            ref={dropdownRef}\n            onClick={(e) => e.stopPropagation()}\n        >\n            {isOpen && (\n                <div\n                    className={classNames(\n                        \"variant-field-revert-component__dropdown-content\",\n                        visualBuilderStyles()[\n                            \"variant-field-revert-component__dropdown-content\"\n                        ]\n                    )}\n                >\n                    {dropdownItems.map((item) => (\n                        <div\n                            className={classNames(\n                                \"variant-field-revert-component__dropdown-content__list-item\",\n                                visualBuilderStyles()[\n                                    \"variant-field-revert-component__dropdown-content__list-item\"\n                                ]\n                            )}\n                            onClick={(e) => {\n                                e.preventDefault();\n                                handleOnClick(item);\n                                closeDropdown();\n                            }}\n                            key={item.id}\n                            data-testid={item.testId}\n                        >\n                            <span>{item.label}</span>\n                        </div>\n                    ))}\n                </div>\n            )}\n        </div>\n    );\n};\n"],"mappings":"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","names":["dropdownItems","fieldDataName"]}
+{"version":3,"sources":["../../../../../src/visualBuilder/components/FieldRevert/FieldRevertComponent.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport React, { useRef, useEffect } from \"preact/compat\";\nimport { visualBuilderStyles } from \"../../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../../utils/visualBuilderPostMessage\";\nimport { CslpData } from \"../../../cslp/types/cslp.types\";\nimport { VariantIcon } from \"../icons/variant\";\nimport { CaretIcon } from \"../icons\";\nimport useHandleOutsideClick from \"./useHandleOutsideClick\";\n\nexport interface IVariantStatus {\n    fieldLevelCustomizations: boolean;\n    isBaseModified: boolean;\n    isAddedInstances: boolean;\n    isDeletedInstances: boolean;\n    isOrderChanged: boolean;\n}\n\nexport type TFieldRevertActionCallback =\n    | \"revert_to_base_entry_value\"\n    | \"revert_added_instances\"\n    | \"restore_deleted_instances\"\n    | \"reset_field_level_customizations\"\n    | \"restore_sorted_instances\";\n\ninterface FieldRevertComponentProps {\n    fieldDataName: string;\n    fieldMetadata: CslpData;\n    isOpen: boolean;\n    closeDropdown: () => void;\n    variantStatus?: IVariantStatus;\n}\n\ninterface IItem {\n    label: string;\n    action: TFieldRevertActionCallback;\n    id: string;\n    testId: string;\n    fieldDataName: string;\n}\n\nexport const BASE_VARIANT_STATUS: IVariantStatus = {\n    isAddedInstances: false,\n    isBaseModified: false,\n    isDeletedInstances: false,\n    isOrderChanged: false,\n    fieldLevelCustomizations: false,\n};\n\nexport async function getFieldVariantStatus(\n    fieldMetadata: CslpData\n): Promise<IVariantStatus | undefined> {\n    try {\n        const result = await visualBuilderPostMessage?.send<IVariantStatus>(\n            \"get-field-variant-status\",\n            fieldMetadata\n        );\n        return result;\n    } catch (error) {\n        console.error(\"Failed to get field variant status:\", error);\n    }\n}\n\nexport const FieldRevertComponent = (props: FieldRevertComponentProps) => {\n    const {\n        fieldDataName,\n        fieldMetadata,\n        variantStatus = BASE_VARIANT_STATUS,\n        isOpen,\n        closeDropdown,\n    } = props;\n\n    const getDropdownItems = () => {\n        const {\n            isAddedInstances,\n            isDeletedInstances,\n            isBaseModified,\n            isOrderChanged,\n            fieldLevelCustomizations,\n        } = variantStatus;\n\n        const dropdownItems: IItem[] = [];\n\n        if (isBaseModified) {\n            dropdownItems.push({\n                label: \"Revert to base entry value\",\n                action: \"revert_to_base_entry_value\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert`,\n                fieldDataName,\n            });\n        }\n\n        if (isAddedInstances) {\n            dropdownItems.push({\n                label: \"Revert added instances\",\n                action: \"revert_added_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-revert-added-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (isDeletedInstances) {\n            dropdownItems.push({\n                label: \"Restore deleted instances\",\n                action: \"restore_deleted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-deleted-instances`,\n                fieldDataName,\n            });\n        }\n\n        if (fieldLevelCustomizations) {\n            dropdownItems.push({\n                label: \"Reset field-level customizations\",\n                action: \"reset_field_level_customizations\",\n                id: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-reset-field-level-customizations`,\n                fieldDataName,\n            });\n        }\n\n        if (isOrderChanged) {\n            dropdownItems.push({\n                label: \"Restore sorted instances\",\n                action: \"restore_sorted_instances\",\n                id: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                testId: `iframe-cs-variant-field-${fieldDataName}-restore-sorted-instances`,\n                fieldDataName,\n            });\n        }\n\n        return dropdownItems;\n    };\n\n    const dropdownItems = getDropdownItems();\n\n    function handleOnClick(item: IItem) {\n        const { fieldDataName, action } = item;\n        visualBuilderPostMessage?.send(\"send-variant-revert-action-trigger\", {\n            fieldDataName,\n            action,\n            euid: fieldMetadata.entry_uid,\n            ct_uid: fieldMetadata.content_type_uid,\n            locale: fieldMetadata.locale,\n        });\n    }\n\n    return (\n        <div\n            className={classNames(\n                \"variant-field-revert-component\",\n                visualBuilderStyles()[\"variant-field-revert-component\"]\n            )}\n            onClick={(e) => e.stopPropagation()}\n        >\n            {isOpen && (\n                <div\n                    data-testid=\"variant-field-revert-component__dropdown-content\"\n                    className={classNames(\n                        \"variant-field-revert-component__dropdown-content\",\n                        visualBuilderStyles()[\n                            \"variant-field-revert-component__dropdown-content\"\n                        ]\n                    )}\n                >\n                    {dropdownItems.map((item) => (\n                        <div\n                            className={classNames(\n                                \"variant-field-revert-component__dropdown-content__list-item\",\n                                visualBuilderStyles()[\n                                    \"variant-field-revert-component__dropdown-content__list-item\"\n                                ]\n                            )}\n                            onClick={(e) => {\n                                e.preventDefault();\n                                handleOnClick(item);\n                                closeDropdown();\n                            }}\n                            key={item.id}\n                            data-testid={item.testId}\n                        >\n                            <span>{item.label}</span>\n                        </div>\n                    ))}\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport const VariantRevertDropdown = (props: any) => {\n    const {\n        closeDropdown,\n        invertTooltipPosition,\n        toggleVariantDropdown,\n        variantStatus = BASE_VARIANT_STATUS,\n    } = props;\n    const dropdownRef = useRef<HTMLDivElement>(null);\n    useHandleOutsideClick(dropdownRef, closeDropdown);\n    const hasDropdownItems = Object.values(variantStatus).some(\n        (value) => value\n    );\n\n    const buttonClassNames = classNames(\n        \"visual-builder__button visual-builder__button--secondary\",\n        visualBuilderStyles()[\"visual-builder__button\"],\n        visualBuilderStyles()[\"visual-builder__button--secondary\"],\n        visualBuilderStyles()[\"visual-builder__tooltip\"],\n        {\n            \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n            [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n                invertTooltipPosition,\n        }\n    );\n\n    if (!hasDropdownItems) {\n        return (\n            <button\n                className={classNames(buttonClassNames)}\n                style={{ padding: \"6px\" }}\n                data-tooltip={\"Variant\"}\n                data-testid={`visual-builder-canvas-variant-icon`}\n            >\n                <VariantIcon />\n            </button>\n        );\n    }\n    return (\n        <div ref={dropdownRef}>\n            <button\n                className={classNames(\n                    buttonClassNames,\n                    visualBuilderStyles()[\"visual-builder__variant-button\"]\n                )}\n                data-tooltip={\"Variant Revert\"}\n                data-testid={`visual-builder-canvas-variant-revert`}\n                onClick={toggleVariantDropdown}\n            >\n                <VariantIcon />\n                <CaretIcon open={props.isOpen} />\n            </button>\n            <FieldRevertComponent {...props} />\n        </div>\n    );\n};\n"],"mappings":"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","names":["dropdownItems","fieldDataName"]}

package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.cjs

@@ -0,0 +1,41 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/visualBuilder/components/FieldRevert/useHandleOutsideClick.ts
+var useHandleOutsideClick_exports = {};
+__export(useHandleOutsideClick_exports, {
+  default: () => useHandleOutsideClick_default
+});
+module.exports = __toCommonJS(useHandleOutsideClick_exports);
+var import_compat = require("preact/compat");
+var useHandleOutsideClick = (ref, callback) => {
+  (0, import_compat.useEffect)(() => {
+    const handleClickOutside = (event) => {
+      if (ref.current && !ref.current.contains(event.target)) {
+        callback();
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [ref, callback]);
+};
+var useHandleOutsideClick_default = useHandleOutsideClick;
+//# sourceMappingURL=useHandleOutsideClick.cjs.map

package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/visualBuilder/components/FieldRevert/useHandleOutsideClick.ts"],"sourcesContent":["import { useEffect } from \"preact/compat\";\n\nconst useHandleOutsideClick = (\n    ref: React.RefObject<HTMLElement>,\n    callback: () => void\n) => {\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (ref.current && !ref.current.contains(event.target as Node)) {\n                callback();\n            }\n        };\n\n        document.addEventListener(\"mousedown\", handleClickOutside);\n        return () => {\n            document.removeEventListener(\"mousedown\", handleClickOutside);\n        };\n    }, [ref, callback]);\n};\n\nexport default useHandleOutsideClick;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA0B;AAE1B,IAAM,wBAAwB,CAC1B,KACA,aACC;AACD,+BAAU,MAAM;AACZ,UAAM,qBAAqB,CAAC,UAAsB;AAC9C,UAAI,IAAI,WAAW,CAAC,IAAI,QAAQ,SAAS,MAAM,MAAc,GAAG;AAC5D,iBAAS;AAAA,MACb;AAAA,IACJ;AAEA,aAAS,iBAAiB,aAAa,kBAAkB;AACzD,WAAO,MAAM;AACT,eAAS,oBAAoB,aAAa,kBAAkB;AAAA,IAChE;AAAA,EACJ,GAAG,CAAC,KAAK,QAAQ,CAAC;AACtB;AAEA,IAAO,gCAAQ;","names":[]}

package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.d.cts

@@ -0,0 +1,3 @@
+declare const useHandleOutsideClick: (ref: React.RefObject<HTMLElement>, callback: () => void) => void;
+
+export { useHandleOutsideClick as default };

package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.d.ts

@@ -0,0 +1,3 @@
+declare const useHandleOutsideClick: (ref: React.RefObject<HTMLElement>, callback: () => void) => void;
+
+export { useHandleOutsideClick as default };

package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.js

@@ -0,0 +1,22 @@
+import "../../../chunk-5WRI5ZAA.js";
+
+// src/visualBuilder/components/FieldRevert/useHandleOutsideClick.ts
+import { useEffect } from "preact/compat";
+var useHandleOutsideClick = (ref, callback) => {
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      if (ref.current && !ref.current.contains(event.target)) {
+        callback();
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [ref, callback]);
+};
+var useHandleOutsideClick_default = useHandleOutsideClick;
+export {
+  useHandleOutsideClick_default as default
+};
+//# sourceMappingURL=useHandleOutsideClick.js.map

package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/visualBuilder/components/FieldRevert/useHandleOutsideClick.ts"],"sourcesContent":["import { useEffect } from \"preact/compat\";\n\nconst useHandleOutsideClick = (\n    ref: React.RefObject<HTMLElement>,\n    callback: () => void\n) => {\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (ref.current && !ref.current.contains(event.target as Node)) {\n                callback();\n            }\n        };\n\n        document.addEventListener(\"mousedown\", handleClickOutside);\n        return () => {\n            document.removeEventListener(\"mousedown\", handleClickOutside);\n        };\n    }, [ref, callback]);\n};\n\nexport default useHandleOutsideClick;\n"],"mappings":";;;AAAA,SAAS,iBAAiB;AAE1B,IAAM,wBAAwB,CAC1B,KACA,aACC;AACD,YAAU,MAAM;AACZ,UAAM,qBAAqB,CAAC,UAAsB;AAC9C,UAAI,IAAI,WAAW,CAAC,IAAI,QAAQ,SAAS,MAAM,MAAc,GAAG;AAC5D,iBAAS;AAAA,MACb;AAAA,IACJ;AAEA,aAAS,iBAAiB,aAAa,kBAAkB;AACzD,WAAO,MAAM;AACT,eAAS,oBAAoB,aAAa,kBAAkB;AAAA,IAChE;AAAA,EACJ,GAAG,CAAC,KAAK,QAAQ,CAAC;AACtB;AAEA,IAAO,gCAAQ;","names":[]}