@studiocms/wysiwyg 0.1.0-experimental.5 → 0.1.0

package/dist/{wysiwyg/editorPlugins/code/components.js → common/grapesBlocks/components/customCode.js}

@@ -1,9 +1,10 @@
-import { commandNameCustomCode, keyCustomCode, typeCustomCode } from "./utils.js";
-var components_default = (editor, opts = {}) => {
-  const { Components } = editor;
-  const { toolbarBtnCustomCode } = opts;
+import { commandNameCustomCode, keyCustomCode, typeCustomCode } from "../consts.js";
+import { AddComponent } from "./index.js";
+var customCode_default = (editor, opts) => {
+  const addComponent = AddComponent(editor);
   let timedInterval;
-  Components.addType("script", {
+  const { propsCustomCode, toolbarBtnCustomCode, placeholderScript } = opts;
+  addComponent("script", {
     view: {
       onRender() {
         const { model, el } = this;
@@ -12,7 +13,7 @@ var components_default = (editor, opts = {}) => {
       }
     }
   });
-  Components.addType(typeCustomCode, {
+  addComponent(typeCustomCode, {
     model: {
       defaults: {
         name: "Custom Code",
@@ -20,9 +21,9 @@ var components_default = (editor, opts = {}) => {
         components: {
           tagName: "span",
           components: { type: "textnode", content: "Insert here your custom code" }
-          // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+          // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
         },
-        ...opts.propsCustomCode
+        ...propsCustomCode
       },
       /**
        * Initilize the component
@@ -38,8 +39,8 @@ var components_default = (editor, opts = {}) => {
             id,
             command: commandNameCustomCode,
             label: `<svg viewBox="0 0 24 24">
-              <path d="M14.6 16.6l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4m-5.2 0L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4z"></path>
-            </svg>`,
+                  <path d="M14.6 16.6l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4m-5.2 0L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4z"></path>
+                </svg>`,
             ...toolbarBtnCustomCode
           });
         }
@@ -54,7 +55,7 @@ var components_default = (editor, opts = {}) => {
     view: {
       events: {
         dblclick: "onActive"
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       },
       init() {
         this.listenTo(this.model.components(), "add remove reset", this.onComponentsChange);
@@ -64,13 +65,13 @@ var components_default = (editor, opts = {}) => {
        * Things to do once inner components of custom code are changed
        */
       onComponentsChange() {
-        timedInterval && clearInterval(timedInterval);
+        timedInterval && clearTimeout(timedInterval);
         timedInterval = setTimeout(() => {
           const { model, el } = this;
           const content = model.get(keyCustomCode) || "";
           let droppable = true;
-          if (content.indexOf("<script") >= 0 && opts.placeholderScript) {
-            el.innerHTML = opts.placeholderScript;
+          if (content.indexOf("<script") >= 0 && placeholderScript) {
+            el.innerHTML = placeholderScript;
             droppable = false;
           }
           model.set({ droppable });
@@ -84,5 +85,5 @@ var components_default = (editor, opts = {}) => {
   });
 };
 export {
-  components_default as default
+  customCode_default as default
 };

package/dist/common/grapesBlocks/components/forms.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+declare const _default: (editor: Editor) => void;
+export default _default;

package/dist/{wysiwyg/editorPlugins/forms/components.js → common/grapesBlocks/components/forms.js}

@@ -1,14 +1,17 @@
-const typeForm = "form";
-const typeInput = "input";
-const typeTextarea = "textarea";
-const typeSelect = "select";
-const typeCheckbox = "checkbox";
-const typeRadio = "radio";
-const typeButton = "button";
-const typeLabel = "label";
-const typeOption = "option";
-function components_default(editor) {
-  const { Components } = editor;
+import {
+  typeButton,
+  typeCheckbox,
+  typeForm,
+  typeInput,
+  typeLabel,
+  typeOption,
+  typeRadio,
+  typeSelect,
+  typeTextarea
+} from "../consts.js";
+import { AddComponent } from "./index.js";
+var forms_default = (editor) => {
+  const addComponent = AddComponent(editor);
   const idTrait = {
     name: "id"
   };
@@ -40,7 +43,7 @@ function components_default(editor) {
       ev.preventDefault();
     }
   };
-  Components.addType(typeForm, {
+  addComponent(typeForm, {
     isComponent: (el) => el.tagName === "FORM",
     model: {
       defaults: {
@@ -76,11 +79,11 @@ function components_default(editor) {
         // The submit of the form might redirect the user from the editor so
         // we should always prevent the default here.
         submit: (e) => e.preventDefault()
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       }
     }
   });
-  Components.addType(typeInput, {
+  addComponent(typeInput, {
     isComponent: (el) => el.tagName === "INPUT",
     model: {
       defaults: {
@@ -124,7 +127,7 @@ function components_default(editor) {
       }
     }
   });
-  Components.addType(typeTextarea, {
+  addComponent(typeTextarea, {
     extend: typeInput,
     isComponent: (el) => el.tagName === "TEXTAREA",
     model: {
@@ -135,7 +138,7 @@ function components_default(editor) {
       }
     }
   });
-  Components.addType(typeOption, {
+  addComponent(typeOption, {
     isComponent: (el) => el.tagName === "OPTION",
     model: {
       defaults: {
@@ -147,7 +150,7 @@ function components_default(editor) {
       }
     }
   });
-  Components.addType(typeSelect, {
+  addComponent(typeSelect, {
     isComponent: (el) => el.tagName === "SELECT",
     model: {
       defaults: {
@@ -168,11 +171,11 @@ function components_default(editor) {
     view: {
       events: {
         mousedown: checkIfInPreview
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       }
     }
   });
-  Components.addType(typeCheckbox, {
+  addComponent(typeCheckbox, {
     extend: typeInput,
     isComponent: (el) => el.tagName === "INPUT" && el.type === "checkbox",
     model: {
@@ -185,7 +188,7 @@ function components_default(editor) {
     view: {
       events: {
         click: checkIfInPreview
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       },
       init() {
         this.listenTo(this.model, "change:attributes:checked", this.handleChecked);
@@ -195,7 +198,7 @@ function components_default(editor) {
       }
     }
   });
-  Components.addType(typeRadio, {
+  addComponent(typeRadio, {
     extend: typeCheckbox,
     isComponent: (el) => el.tagName === "INPUT" && el.type === "radio",
     model: {
@@ -204,7 +207,7 @@ function components_default(editor) {
       }
     }
   });
-  Components.addType(typeButton, {
+  addComponent(typeButton, {
     extend: typeInput,
     isComponent: (el) => el.tagName === "BUTTON",
     model: {
@@ -253,32 +256,23 @@ function components_default(editor) {
     view: {
       events: {
         click: checkIfInPreview
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       }
     }
   });
-  Components.addType(typeLabel, {
+  addComponent(typeLabel, {
     extend: "text",
     isComponent: (el) => el.tagName === "LABEL",
     model: {
       defaults: {
         tagName: "label",
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
         components: "Label",
         traits: [forTrait]
       }
     }
   });
-}
+};
 export {
-  components_default as default,
-  typeButton,
-  typeCheckbox,
-  typeForm,
-  typeInput,
-  typeLabel,
-  typeOption,
-  typeRadio,
-  typeSelect,
-  typeTextarea
+  forms_default as default
 };

package/dist/common/grapesBlocks/components/index.d.ts

@@ -0,0 +1,5 @@
+import type { AddComponentTypeOptions, Editor } from 'grapesjs';
+import type { RequiredGrapesBlocksOptions } from '../types.js';
+export declare const AddComponent: (editor: Editor) => (id: string, def: AddComponentTypeOptions) => void;
+export declare const loadComponents: (editor: Editor, opts: RequiredGrapesBlocksOptions) => void;
+export default loadComponents;

package/dist/common/grapesBlocks/components/index.js

@@ -0,0 +1,23 @@
+import countdownComponent from "./countdown.js";
+import customCode from "./customCode.js";
+import formsComponents from "./forms.js";
+import tabLoader from "./tabLoader.js";
+import tooltipComponent from "./tooltip.js";
+import typedComponent from "./typed.js";
+const AddComponent = (editor) => (id, def) => {
+  editor.Components.addType(id, def);
+};
+const loadComponents = (editor, opts) => {
+  tooltipComponent(editor, opts.tooltip);
+  typedComponent(editor, opts.typed);
+  countdownComponent(editor, opts.countdown);
+  customCode(editor, opts.customCode);
+  formsComponents(editor);
+  tabLoader(editor, opts.tabOptions);
+};
+var components_default = loadComponents;
+export {
+  AddComponent,
+  components_default as default,
+  loadComponents
+};

package/dist/common/grapesBlocks/components/tabLoader.d.ts

@@ -0,0 +1,4 @@
+import type { Editor } from 'grapesjs';
+import type { RequiredTabsOptions } from '../types.js';
+declare const _default: (editor: Editor, config: RequiredTabsOptions) => void;
+export default _default;

package/dist/{wysiwyg/editorPlugins/tabs/components/index.js → common/grapesBlocks/components/tabLoader.js}

@@ -1,8 +1,8 @@
-import Tab from "./Tab.js";
-import TabContainer from "./TabContainer.js";
-import TabContent from "./TabContent.js";
-import TabContents from "./TabContents.js";
-import Tabs from "./Tabs.js";
+import Tab from "./tabs/Tab.js";
+import TabContainer from "./tabs/TabContainer.js";
+import TabContent from "./tabs/TabContent.js";
+import TabContents from "./tabs/TabContents.js";
+import Tabs from "./tabs/Tabs.js";
 const components = [
   TabContainer,
   // Load container first
@@ -14,7 +14,7 @@ const components = [
   Tabs
   // Finally the main tabs component
 ];
-var components_default = (editor, config) => {
+var tabLoader_default = (editor, config) => {
   const opts = {
     ...config,
     defaultModel: editor.DomComponents.getType("default").model,
@@ -25,5 +25,5 @@ var components_default = (editor, config) => {
   }
 };
 export {
-  components_default as default
+  tabLoader_default as default
 };

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/Tab.d.ts

@@ -1,5 +1,5 @@
 import type { Component, Editor } from 'grapesjs';
-import type { TabConfig } from '../types.js';
+import type { TabConfig } from '../../types.js';
 export interface TabComponent extends Component {
     tabContent?: Component;
     __initTab(index: number): void;

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/Tab.js

@@ -1,4 +1,4 @@
-import { resolveTemplate } from "../options.js";
+import { resolveTemplate } from "../../consts.js";
 var Tab_default = (editor, config) => {
   const { Components } = editor;
   const prevSelectorTab = "data-prev";
@@ -77,7 +77,7 @@ var Tab_default = (editor, config) => {
         )[0];
         return content;
       },
-      // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+      // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       clone(opt = {}, ...args) {
         const fromParent = opt._inner;
         if (fromParent) {

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/TabContainer.d.ts

@@ -1,5 +1,5 @@
 import type { Editor } from 'grapesjs';
-import type { TabContainerConfig } from '../types.js';
+import type { TabContainerConfig } from '../../types.js';
 export declare const role = "tablist";
 declare const _default: (editor: Editor, config: TabContainerConfig) => void;
 export default _default;

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/TabContent.d.ts

@@ -1,5 +1,5 @@
 import type { Editor } from 'grapesjs';
-import type { TabContentConfig } from '../types.js';
+import type { TabContentConfig } from '../../types.js';
 export declare const role = "tabpanel";
 declare const _default: (editor: Editor, config: TabContentConfig) => void;
 export default _default;

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/TabContents.d.ts

@@ -1,4 +1,4 @@
 import type { Editor } from 'grapesjs';
-import type { TabContentsConfig } from '../types.js';
+import type { TabContentsConfig } from '../../types.js';
 declare const _default: (editor: Editor, config: TabContentsConfig) => void;
 export default _default;

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/Tabs.d.ts

@@ -1,4 +1,4 @@
 import type { Editor } from 'grapesjs';
-import type { TabsOptions } from '../types.js';
+import type { TabsOptions } from '../../types.js';
 declare const _default: (editor: Editor, config: TabsOptions) => void;
 export default _default;

package/dist/{wysiwyg/editorPlugins/tabs/components → common/grapesBlocks/components/tabs}/Tabs.js

@@ -1,4 +1,4 @@
-import { resolveTemplate } from "../options.js";
+import { resolveTemplate } from "../../consts.js";
 var Tabs_default = (editor, config) => {
   const { Components } = editor;
   const script = function(props) {
@@ -11,9 +11,9 @@ var Tabs_default = (editor, config) => {
     const roleTab = "[role=tab]";
     const roleTabContent = "[role=tabpanel]";
     const { body, location } = document;
-    const matches = body.matches || // biome-ignore lint/suspicious/noExplicitAny: <explanation>
-    body.webkitMatchesSelector || // biome-ignore lint/suspicious/noExplicitAny: <explanation>
-    body.mozMatchesSelector || // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+    const matches = body.matches || // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
+    body.webkitMatchesSelector || // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
+    body.mozMatchesSelector || // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
     body.msMatchesSelector;
     const each = (items, clb) => {
       Array.from(items).forEach(clb);
@@ -28,7 +28,7 @@ var Tabs_default = (editor, config) => {
     const getAllTabs = () => el.querySelectorAll(roleTab);
     const upTabIdx = (item, val) => {
       if (!_isEditor) {
-        item.tabIndex = Number.parseInt(val);
+        item.tabIndex = Number.parseInt(val, 10);
       }
     };
     const activeTab = (tabEl) => {
@@ -114,7 +114,7 @@ var Tabs_default = (editor, config) => {
         styles: styleText,
         ...config.tabsProps
       },
-      // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+      // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       isTabsComponent(comp) {
         return comp.findTabs !== void 0;
       },
@@ -130,8 +130,8 @@ var Tabs_default = (editor, config) => {
           tab.__initTab?.(tabCount);
         });
       },
-      // biome-ignore lint/suspicious/noExplicitAny: <explanation>
-      __onTab(tab, index, v, opts = {}) {
+      // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
+      __onTab(tab, index, _v, opts = {}) {
         if (!opts.avoidStore && !opts.temporary) {
           tab.__initTab(index);
         }

package/dist/common/grapesBlocks/components/tooltip.d.ts

@@ -0,0 +1,4 @@
+import type { Editor } from 'grapesjs';
+import type { RequiredTooltipOptions } from '../types';
+export declare const tooltipComponent: (editor: Editor, opts: RequiredTooltipOptions) => void;
+export default tooltipComponent;

package/dist/{wysiwyg/editorPlugins → common/grapesBlocks/components}/tooltip.js

@@ -1,96 +1,23 @@
-const plugin = (editor, opts = {}) => {
-  const options = {
-    // The ID used to create tooltip block and component
-    id: "tooltip",
-    // Label of the tooltip. Used for the block and component name
-    labelTooltip: "Tooltip",
-    // Object to extend the default tooltip block, eg. { label: 'Tooltip', category: 'Extra', ... }.
-    // Pass a falsy value to avoid adding the block
-    blockTooltip: {},
-    // Object to extend the default tooltip properties, eg. `{ name: 'Tooltip', droppable: false, ... }`
-    propsTooltip: {},
-    // A function which allows to extend default traits by receiving the original array and returning a new one
-    extendTraits: (traits) => traits,
-    // Tooltip attribute prefix
-    attrTooltip: "data-tooltip",
-    // Tooltip class prefix
-    classTooltip: "tooltip-component",
-    // Custom CSS styles, this will replace the default one
-    style: "",
-    // Additional CSS styles
-    styleAdditional: "",
-    // Make all tooltip relative classes private
-    privateClasses: true,
-    // Indicate if the tooltip can be styled. You can also pass an array
-    // of which properties can be styled. Eg. `['color', 'background-color']`
-    stylableTooltip: [
-      "background-color",
-      "padding",
-      "padding-top",
-      "padding-right",
-      "padding-bottom",
-      "padding-left",
-      "font-family",
-      "font-size",
-      "font-weight",
-      "letter-spacing",
-      "color",
-      "line-height",
-      "text-align",
-      "border-radius",
-      "border-top-left-radius",
-      "border-top-right-radius",
-      "border-bottom-left-radius",
-      "border-bottom-right-radius",
-      "border",
-      "border-width",
-      "border-style",
-      "border-color"
-    ],
-    // If true, force the tooltip to be shown
-    showTooltipOnStyle: true,
-    ...opts
-  };
+const tooltipComponent = (editor, opts) => {
   const {
-    propsTooltip,
+    id: tooltipId,
+    labelTooltip,
     classTooltip,
+    attrTooltip,
     style,
     styleAdditional,
-    privateClasses,
-    stylableTooltip,
+    extendTraits,
     showTooltipOnStyle,
-    blockTooltip,
-    extendTraits
-  } = options;
-  const id = options.id;
-  const labelTooltip = options.labelTooltip;
-  const attrTooltip = options.attrTooltip;
-  if (blockTooltip) {
-    editor.BlockManager.add(id, {
-      media: `<svg viewBox="0 0 24 24">
-          <path d="M4 2h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2h-4l-4 4-4-4H4c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2m0 2v12h4.83L12 19.17 15.17 16H20V4H4z"></path>
-        </svg>`,
-      label: labelTooltip,
-      category: "Extra",
-      select: true,
-      content: { type: id },
-      ...blockTooltip
-    });
-  }
+    propsTooltip,
+    stylableTooltip
+  } = opts;
   const classTooltipBody = `${classTooltip}__body`;
   const classTooltipEmpty = `${classTooltip}--empty`;
   const attrTooltipVis = `${attrTooltip}-visible`;
   const attrTooltipPos = `${attrTooltip}-pos`;
   const attrTooltipLen = `${attrTooltip}-length`;
   const traitIdStyleTooltip = "style-tooltip";
-  if (privateClasses) {
-    editor.SelectorManager.getAll().add([
-      { private: 1, name: classTooltip },
-      { private: 1, name: classTooltipBody },
-      { private: 1, name: classTooltipEmpty }
-    ]);
-  }
-  editor.Components.addType(id, {
+  editor.Components.addType(tooltipId, {
     isComponent: (el) => el.hasAttribute?.(attrTooltip),
     model: {
       defaults: {
@@ -204,7 +131,7 @@ const plugin = (editor, opts = {}) => {
             overflow: visible;
           }
         `) + styleAdditional,
-        // biome-ignore lint/style/noNonNullAssertion: <explanation>
+        // biome-ignore lint/style/noNonNullAssertion: This is the type that was already used in the original code
         traits: extendTraits([
           {
             name: attrTooltip,
@@ -288,7 +215,7 @@ const plugin = (editor, opts = {}) => {
               editor2.StyleManager.select(ruleTooltip);
               if (showTooltipOnStyle) {
                 const selected = editor2.getSelected();
-                if (selected?.is(id)) {
+                if (selected?.is(tooltipId)) {
                   selected.addAttributes({ [attrTooltipVis]: "true" });
                   editor2.once("style:target", () => {
                     selected.addAttributes({ [attrTooltipVis]: "false" });
@@ -298,7 +225,7 @@ const plugin = (editor, opts = {}) => {
             }
           }
         ]),
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
         ...propsTooltip
       },
       init() {
@@ -312,7 +239,8 @@ const plugin = (editor, opts = {}) => {
     }
   });
 };
-var tooltip_default = plugin;
+var tooltip_default = tooltipComponent;
 export {
-  tooltip_default as default
+  tooltip_default as default,
+  tooltipComponent
 };

package/dist/common/grapesBlocks/components/typed.d.ts

@@ -0,0 +1,9 @@
+import type { Editor } from 'grapesjs';
+import type { RequiredTypedOptions } from '../types.js';
+declare global {
+    interface Window {
+        Typed: any;
+    }
+}
+declare const _default: (editor: Editor, opts: RequiredTypedOptions) => void;
+export default _default;

package/dist/{wysiwyg/editorPlugins/typed/components.js → common/grapesBlocks/components/typed.js}

@@ -1,10 +1,10 @@
-import { cmpId, traitStringId } from "./utils.js";
+import { typedId, typedTraitStringId } from "../consts.js";
 const getTraitType = (value) => {
   if (typeof value === "number") return "number";
   if (typeof value === "boolean") return "checkbox";
   return "text";
 };
-var components_default = (editor, opts) => {
+var typed_default = (editor, opts) => {
   const domc = editor.DomComponents;
   const { keys } = Object;
   const typedProps = {
@@ -30,7 +30,7 @@ var components_default = (editor, opts) => {
   const typedPropsKeys = keys(typedProps);
   const traits = typedPropsKeys.filter((item) => ["strings"].indexOf(item) < 0).map((name) => ({
     changeProp: true,
-    // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+    // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
     type: getTraitType(typedProps[name]),
     min: 0,
     name
@@ -38,9 +38,9 @@ var components_default = (editor, opts) => {
   traits.unshift({
     changeProp: true,
     name: "strings",
-    type: traitStringId
+    type: typedTraitStringId
   });
-  domc.addType(cmpId, {
+  domc.addType(typedId, {
     model: {
       defaults: opts.props({
         ...typedProps,
@@ -99,11 +99,11 @@ var components_default = (editor, opts) => {
             init();
           }
         }
-        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        // biome-ignore lint/suspicious/noExplicitAny: This is the type that was already used in the original code
       })
     }
   });
 };
 export {
-  components_default as default
+  typed_default as default
 };

package/dist/common/grapesBlocks/consts.d.ts

@@ -0,0 +1,25 @@
+import type { RequiredGrapesBlocksOptions, TabsOptions, TabTemplate, TabTemplateProps } from './types.js';
+export declare const cmdImport = "gjs-open-import-webpage";
+export declare const cmdDeviceDesktop = "set-device-desktop";
+export declare const cmdDeviceTablet = "set-device-tablet";
+export declare const cmdDeviceMobile = "set-device-mobile";
+export declare const exportTemplate = "export-template";
+export declare const cmdClear = "canvas-clear";
+export declare const cmdSave = "store-data";
+export declare const typedId = "typed";
+export declare const typedTraitStringId = "typed-strings";
+export declare const keyCustomCode = "custom-code-plugin__code";
+export declare const typeCustomCode = "custom-code";
+export declare const commandNameCustomCode = "custom-code:open-modal";
+export declare const typeForm = "form";
+export declare const typeInput = "input";
+export declare const typeTextarea = "textarea";
+export declare const typeSelect = "select";
+export declare const typeCheckbox = "checkbox";
+export declare const typeRadio = "radio";
+export declare const typeButton = "button";
+export declare const typeLabel = "label";
+export declare const typeOption = "option";
+export declare const resolveTemplate: (template: TabTemplate | undefined, props: TabTemplateProps) => string | undefined;
+export declare const mergeStyles: (userStyle?: (config: TabsOptions) => string) => (config: TabsOptions) => string;
+export declare const defaultGrapesBlocksOptions: RequiredGrapesBlocksOptions;