n8n-editor-ui 1.115.1 → 1.116.1

package/dist/assets/{NodeCreator-BppRTVIa.js → NodeCreator-D45qQQ4H.js}

@@ -1,4 +1,4 @@
-import { d as defineComponent, bm as reactive, o as onMounted, b_ as useExternalHooks, X as onBeforeUnmount, cB as toRefs, h as createElementBlock, g as openBlock, n as normalizeClass, j as createBaseVNode, f as createCommentVNode, i as createVNode, k as unref, N as N8nIcon, _ as _export_sfc, j2 as REGULAR_NODE_CREATOR_VIEW, F as Fragment, Y as renderSlot, j3 as useViewStacks, r as ref, x as computed, j4 as useInstalledCommunityPackage, ae as useNodeTypesStore, u as useUsersStore, e as createBlock, p as N8nText, w as withCtx, l as createTextVNode, t as toDisplayString, j5 as _sfc_main$b, aa as N8nTooltip, fL as i18n, j6 as captureException, j7 as useKeyboardNavigation, ih as useActions, dM as useNodeCreatorStore, bX as useCalloutHelpers, j8 as CUSTOM_API_CALL_KEY, j9 as TRIGGER_NODE_CREATOR_VIEW, ja as isNodePreviewKey, jb as OPEN_AI_NODE_TYPE, jc as OPEN_AI_NODE_MESSAGE_ASSISTANT_TYPE, al as useTelemetry, jd as getActiveViewCallouts, cL as resolveDirective, je as ItemsRenderer, cJ as createSlots, jf as withMemo, jg as CategorizedItemsRenderer, c as useI18n, z as N8nCallout, b4 as withDirectives, dv as InfoTip, B as withModifiers, jh as CommunityNodeFooter, ji as HTTP_REQUEST_NODE_TYPE, ge as createStaticVNode, C as N8nLink, jj as REQUEST_NODE_FORM_URL, jk as filterAndSearchNodes, jl as getRootSearchCallouts, iL as WEBHOOK_NODE_TYPE, jm as PRE_BUILT_AGENTS_COLLECTION, jn as camelCase, jo as shouldShowCommunityNodeDetails, g3 as isCommunityPackageName, jp as prepareCommunityNodeDetailsViewStack, iQ as getNodeIconSource, jq as transformNodeType, jr as AINodesView, js as AIView, jt as RegularView, ju as TriggerView, jv as flattenCreateElements, jw as HITL_SUBCATEGORY, jx as getHumanInTheLoopActions, jy as AI_OTHERS_NODE_CREATOR_VIEW, jz as AI_NODE_CREATOR_VIEW, f6 as useCommunityNodesStore, a as useToast, cx as NodeIcon, jA as OfficialIcon, q as N8nButton, dN as useCredentialsStore, jB as removePreviewToken, P as useDebounce, bS as onUnmounted, a8 as watch, eM as N8nNotice, cC as normalizeProps, K as mergeProps, ba as Transition, jC as AI_EVALUATION, jD as AI_UNCATEGORIZED_CATEGORY, Q as useUIStore, g0 as useAssistantStore, dQ as useBuilderStore, b$ as onClickOutside, ab as _sfc_main$c, ap as normalizeStyle, jE as SlideTransition, ej as DRAG_EVENT_DATA_KEY, jF as useActionsGenerator } from "./index-MTM6BbvW.js";
+import { d as defineComponent, c$ as reactive, o as onMounted, bs as useExternalHooks, X as onBeforeUnmount, bR as toRefs, h as createElementBlock, g as openBlock, n as normalizeClass, j as createBaseVNode, f as createCommentVNode, i as createVNode, k as unref, N as N8nIcon, _ as _export_sfc, jd as REGULAR_NODE_CREATOR_VIEW, F as Fragment, Y as renderSlot, je as useViewStacks, r as ref, x as computed, jf as useInstalledCommunityPackage, ae as useNodeTypesStore, u as useUsersStore, e as createBlock, p as N8nText, w as withCtx, l as createTextVNode, t as toDisplayString, jg as _sfc_main$b, aa as N8nTooltip, f5 as i18n, jh as captureException, ji as useKeyboardNavigation, iB as useActions, d0 as useNodeCreatorStore, bm as useCalloutHelpers, jj as CUSTOM_API_CALL_KEY, jk as TRIGGER_NODE_CREATOR_VIEW, jl as isNodePreviewKey, jm as OPEN_AI_NODE_TYPE, jn as OPEN_AI_NODE_MESSAGE_ASSISTANT_TYPE, al as useTelemetry, jo as getActiveViewCallouts, c0 as resolveDirective, jp as ItemsRenderer, b_ as createSlots, jq as withMemo, jr as CategorizedItemsRenderer, c as useI18n, z as N8nCallout, b4 as withDirectives, cK as InfoTip, B as withModifiers, js as CommunityNodeFooter, jt as HTTP_REQUEST_NODE_TYPE, gi as createStaticVNode, C as N8nLink, ju as REQUEST_NODE_FORM_URL, jv as filterAndSearchNodes, jw as getRootSearchCallouts, iW as WEBHOOK_NODE_TYPE, jx as PRE_BUILT_AGENTS_COLLECTION, jy as camelCase, jz as shouldShowCommunityNodeDetails, fr as isCommunityPackageName, jA as prepareCommunityNodeDetailsViewStack, i$ as getNodeIconSource, jB as transformNodeType, jC as AINodesView, jD as AIView, jE as RegularView, jF as TriggerView, jG as flattenCreateElements, jH as HITL_SUBCATEGORY, jI as getHumanInTheLoopActions, jJ as AI_OTHERS_NODE_CREATOR_VIEW, jK as AI_NODE_CREATOR_VIEW, er as useCommunityNodesStore, a as useToast, c8 as NodeIcon, jL as OfficialIcon, q as N8nButton, d1 as useCredentialsStore, jM as removePreviewToken, P as useDebounce, bh as onUnmounted, a8 as watch, e5 as N8nNotice, bS as normalizeProps, K as mergeProps, fF as Transition, jN as AI_EVALUATION, jO as AI_UNCATEGORIZED_CATEGORY, Q as useUIStore, iA as useChatPanelStore, bt as onClickOutside, ab as _sfc_main$c, ap as normalizeStyle, jP as SlideTransition, dB as DRAG_EVENT_DATA_KEY, jQ as useActionsGenerator } from "./index-C2iJCVYf.js";
 const _hoisted_1$5 = ["placeholder", "value"];
 const _sfc_main$a = /* @__PURE__ */ defineComponent({
   __name: "SearchBar",
@@ -76,13 +76,13 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const searchContainer = "_searchContainer_w19t7_123";
-const prefix = "_prefix_w19t7_139";
-const active$1 = "_active_w19t7_144";
-const text = "_text_w19t7_148";
-const suffix = "_suffix_w19t7_164";
-const clear = "_clear_w19t7_170";
-const clickable = "_clickable_w19t7_183";
+const searchContainer = "_searchContainer_neuh0_123";
+const prefix = "_prefix_neuh0_139";
+const active$1 = "_active_neuh0_144";
+const text = "_text_neuh0_148";
+const suffix = "_suffix_neuh0_164";
+const clear = "_clear_neuh0_170";
+const clickable = "_clickable_neuh0_183";
 const style0$8 = {
   searchContainer,
   prefix,
@@ -221,7 +221,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         unref(isUpdateCheckAvailable) && unref(installedPackage)?.updateAvailable ? (openBlock(), createBlock(_sfc_main$b, {
           key: 0,
           "data-test-id": "update-available",
-          "package-name": unref(communityNodeDetails)?.packageName
+          "package-name": unref(communityNodeDetails)?.packageName,
+          source: "node creator panel"
         }, null, 8, ["package-name"])) : (openBlock(), createElementBlock("div", {
           key: 1,
           class: normalizeClass(_ctx.$style.separator)
@@ -349,13 +350,13 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const container$3 = "_container_6y5mo_123";
-const nodeIcon$2 = "_nodeIcon_6y5mo_132";
-const description = "_description_6y5mo_137";
-const separator = "_separator_6y5mo_141";
-const info$1 = "_info_6y5mo_147";
-const tooltipIcon = "_tooltipIcon_6y5mo_162";
-const contactOwnerHint = "_contactOwnerHint_6y5mo_168";
+const container$3 = "_container_19qm2_123";
+const nodeIcon$2 = "_nodeIcon_19qm2_132";
+const description = "_description_19qm2_137";
+const separator = "_separator_19qm2_141";
+const info$1 = "_info_19qm2_147";
+const tooltipIcon = "_tooltipIcon_19qm2_162";
+const contactOwnerHint = "_contactOwnerHint_19qm2_168";
 const style0$7 = {
   container: container$3,
   nodeIcon: nodeIcon$2,
@@ -695,12 +696,12 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const container$2 = "_container_ikzr4_123";
-const containerPaddingBottom = "_containerPaddingBottom_ikzr4_129";
-const communityNodeFooter = "_communityNodeFooter_ikzr4_133";
-const resetSearch = "_resetSearch_ikzr4_137";
-const actionsEmpty = "_actionsEmpty_ikzr4_151";
-const apiHint = "_apiHint_ikzr4_159";
+const container$2 = "_container_12w99_123";
+const containerPaddingBottom = "_containerPaddingBottom_12w99_129";
+const communityNodeFooter = "_communityNodeFooter_12w99_133";
+const resetSearch = "_resetSearch_12w99_137";
+const actionsEmpty = "_actionsEmpty_12w99_151";
+const apiHint = "_apiHint_12w99_159";
 const style0$6 = {
   container: container$2,
   containerPaddingBottom,
@@ -811,12 +812,12 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const noResults = "_noResults_17xen_123";
-const title$2 = "_title_17xen_136";
-const action = "_action_17xen_145";
-const request = "_request_17xen_146";
-const icon = "_icon_17xen_162";
-const external = "_external_17xen_168";
+const noResults = "_noResults_1w8hr_123";
+const title$2 = "_title_1w8hr_136";
+const action = "_action_1w8hr_145";
+const request = "_request_1w8hr_146";
+const icon = "_icon_1w8hr_162";
+const external = "_external_1w8hr_168";
 const style0$5 = {
   noResults,
   title: title$2,
@@ -1084,7 +1085,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const items = "_items_1i9xd_123";
+const items = "_items_bf97l_123";
 const style0$4 = {
   items
 };
@@ -1236,13 +1237,13 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const container$1 = "_container_1ut3v_123";
-const header$1 = "_header_1ut3v_131";
-const title$1 = "_title_1ut3v_138";
-const nodeIcon$1 = "_nodeIcon_1ut3v_146";
-const installedIcon = "_installedIcon_1ut3v_151";
-const officialIcon = "_officialIcon_1ut3v_157";
-const installed = "_installed_1ut3v_151";
+const container$1 = "_container_3ir84_123";
+const header$1 = "_header_3ir84_131";
+const title$1 = "_title_3ir84_138";
+const nodeIcon$1 = "_nodeIcon_3ir84_146";
+const installedIcon = "_installedIcon_3ir84_151";
+const officialIcon = "_officialIcon_3ir84_157";
+const installed = "_installed_3ir84_151";
 const style0$3 = {
   container: container$1,
   header: header$1,
@@ -1292,7 +1293,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const container = "_container_x2no6_123";
+const container = "_container_1ms6i_123";
 const style0$2 = {
   container
 };
@@ -1449,8 +1450,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   "icon-source": activeViewStack.value.nodeIcon,
                   circle: false,
                   "show-tooltip": false,
-                  size: 20,
-                  "use-updated-icons": true
+                  size: 20
                 }, null, 8, ["class", "icon-source"])) : createCommentVNode("", true),
                 activeViewStack.value.title ? (openBlock(), createElementBlock("p", {
                   key: 2,
@@ -1503,20 +1503,20 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const info = "_info_cdy1m_145";
-const backButton = "_backButton_cdy1m_149";
-const backButtonIcon = "_backButtonIcon_cdy1m_156";
-const nodeIcon = "_nodeIcon_cdy1m_161";
-const renderedItems = "_renderedItems_cdy1m_166";
-const searchBar = "_searchBar_cdy1m_178";
-const nodesListPanel = "_nodesListPanel_cdy1m_182";
-const footer = "_footer_cdy1m_200";
-const top = "_top_cdy1m_211";
-const header = "_header_cdy1m_216";
-const hasBg = "_hasBg_cdy1m_222";
-const title = "_title_cdy1m_227";
-const subtitle = "_subtitle_cdy1m_238";
-const offsetSubtitle = "_offsetSubtitle_cdy1m_246";
+const info = "_info_dpb67_145";
+const backButton = "_backButton_dpb67_149";
+const backButtonIcon = "_backButtonIcon_dpb67_156";
+const nodeIcon = "_nodeIcon_dpb67_161";
+const renderedItems = "_renderedItems_dpb67_167";
+const searchBar = "_searchBar_dpb67_179";
+const nodesListPanel = "_nodesListPanel_dpb67_183";
+const footer = "_footer_dpb67_201";
+const top = "_top_dpb67_212";
+const header = "_header_dpb67_217";
+const hasBg = "_hasBg_dpb67_223";
+const title = "_title_dpb67_228";
+const subtitle = "_subtitle_dpb67_239";
+const offsetSubtitle = "_offsetSubtitle_dpb67_247";
 const style0$1 = {
   info,
   backButton,
@@ -1554,8 +1554,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const { registerKeyHook } = useKeyboardNavigation();
     const emit = __emit;
     const uiStore = useUIStore();
-    const assistantStore = useAssistantStore();
-    const builderStore = useBuilderStore();
+    const chatPanelStore = useChatPanelStore();
     const { setShowScrim, setActions, setMergeNodes } = useNodeCreatorStore();
     const { generateMergedNodesAndActions } = useActionsGenerator();
     const state = reactive({
@@ -1569,11 +1568,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return { top: `${uiStore.bannersHeight + uiStore.headerHeight}px`, right: `${rightPosition}px` };
     });
     function getRightOffset() {
-      if (assistantStore.isAssistantOpen) {
-        return assistantStore.chatWidth;
-      }
-      if (builderStore.isAssistantOpen) {
-        return builderStore.chatWidth;
+      if (chatPanelStore.isOpen) {
+        return chatPanelStore.width;
       }
       return 0;
     }
@@ -1699,10 +1695,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const nodeCreator = "_nodeCreator_xjjfv_127";
-const nodeCreatorScrim = "_nodeCreatorScrim_xjjfv_139";
-const active = "_active_xjjfv_151";
-const close = "_close_xjjfv_155";
+const nodeCreator = "_nodeCreator_ke2v0_127";
+const nodeCreatorScrim = "_nodeCreatorScrim_ke2v0_139";
+const active = "_active_ke2v0_151";
+const close = "_close_ke2v0_155";
 const style0 = {
   nodeCreator,
   nodeCreatorScrim,

package/dist/assets/{NodeDetailsView-BuhpInfo.js → NodeDetailsView-6bLQaVHT.js}

@@ -1,14 +1,15 @@
-import { d as defineComponent, e as createBlock, g as openBlock, g_ as Draggable, n as normalizeClass, w as withCtx, j as createBaseVNode, h as createElementBlock, f as createCommentVNode, i as createVNode, k as unref, N as N8nIcon, _ as _export_sfc, cX as useThrottleFn, a_ as useNDVStore, Q as useUIStore, r as ref, gq as useSlots, o as onMounted, x as computed, d7 as ndvEventBus, X as onBeforeUnmount, a8 as watch, il as MAIN_NODE_PANEL_WIDTH, bN as useStorage, im as LOCAL_STORAGE_MAIN_PANEL_RELATIVE_WIDTH, ap as normalizeStyle, Y as renderSlot, cT as N8nResizeWrapper, Z as nextTick, cm as useNodeHelpers, fa as storeToRefs, cj as usePinnedData, g4 as useWorkflowActivate, ae as useNodeTypesStore, a2 as useWorkflowsStore, dm as useDeviceSupport, dn as useTelemetryContext, io as getNodeOutputs, cc as NodeConnectionTypes, cq as START_NODE_TYPE, ip as EXECUTABLE_TRIGGER_NODE_TYPES, b2 as STICKY_NODE_TYPE, iq as BASE_NODE_SURVEY_URL, ir as dataPinningEventBus, aa as N8nTooltip, p as N8nText, l as createTextVNode, t as toDisplayString, c as useI18n, cJ as createSlots, is as NodeSettings, aq as createEventBus, it as InputPanel, cU as useStyles, iu as APP_MODALS_ELEMENT_ID, fM as ElDialog, al as useTelemetry, am as useMessage, an as MODAL_CONFIRM, d_ as jsonParse, b_ as useExternalHooks } from "./index-MTM6BbvW.js";
-import { N as NDVFloatingNodes, O as OutputPanel, T as TriggerPanel } from "./TriggerPanel-BS69Ky8P.js";
-import "./RunDataParsedAiContent-Bl49tvwG.js";
-import "./core-HZaYo_tU.js";
-import "./ConsumedTokensDetails.vue_vue_type_script_setup_true_lang-Bv40HGJu.js";
-import "./NodeView-B9LYqx2z.js";
-import "./global-link-actions-DdzlWwjw.js";
-import "./useExecutionDebugging-yUnwhnYk.js";
-import "./useBeforeUnload-DsbgbymL.js";
-import "./readyToRunWorkflows.store-nzu6XNAP.js";
-import "./InfoAccordion-BpibqNsS.js";
+import { d as defineComponent, e as createBlock, g as openBlock, h2 as Draggable, n as normalizeClass, w as withCtx, j as createBaseVNode, h as createElementBlock, f as createCommentVNode, i as createVNode, k as unref, N as N8nIcon, _ as _export_sfc, cJ as useThrottleFn, a_ as useNDVStore, Q as useUIStore, r as ref, gt as useSlots, o as onMounted, x as computed, cm as ndvEventBus, X as onBeforeUnmount, a8 as watch, iF as MAIN_NODE_PANEL_WIDTH, bc as useStorage, iG as LOCAL_STORAGE_MAIN_PANEL_RELATIVE_WIDTH, ap as normalizeStyle, Y as renderSlot, c9 as N8nResizeWrapper, Z as nextTick, bG as useNodeHelpers, ev as storeToRefs, bC as usePinnedData, fs as useWorkflowActivate, ae as useNodeTypesStore, a2 as useWorkflowsStore, cB as useDeviceSupport, cC as useTelemetryContext, dy as getNodeOutputs, g8 as NodeConnectionTypes, bN as START_NODE_TYPE, iH as EXECUTABLE_TRIGGER_NODE_TYPES, b2 as STICKY_NODE_TYPE, iI as BASE_NODE_SURVEY_URL, iJ as dataPinningEventBus, aa as N8nTooltip, p as N8nText, l as createTextVNode, t as toDisplayString, c as useI18n, b_ as createSlots, iK as NodeSettings, aq as createEventBus, iL as InputPanel, ca as useStyles, iM as APP_MODALS_ELEMENT_ID, f6 as ElDialog, al as useTelemetry, am as useMessage, an as MODAL_CONFIRM, dd as jsonParse, bs as useExternalHooks } from "./index-C2iJCVYf.js";
+import { N as NDVFloatingNodes, O as OutputPanel, T as TriggerPanel } from "./TriggerPanel-nPxZrihp.js";
+import "./useLogsTreeExpand-2auAOTOK.js";
+import "./AnimatedSpinner-DFjfUB--.js";
+import "./RunDataParsedAiContent-BkNc-yBy.js";
+import "./core-DsTi4w-I.js";
+import "./NodeView-C9PvNIUz.js";
+import "./global-link-actions-DSKsOCqo.js";
+import "./useExecutionDebugging-DWOhAQo4.js";
+import "./useBeforeUnload-D788NzAs.js";
+import "./readyToRunWorkflows.store-ia-2Nluj.js";
+import "./InfoAccordion-B_T19Esx.js";
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "PanelDragButton",
   props: {
@@ -77,13 +78,13 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const dragContainer = "_dragContainer_16elv_123";
-const dragButton = "_dragButton_16elv_127";
-const leftArrow = "_leftArrow_16elv_141 _arrow_16elv_150";
-const rightArrow = "_rightArrow_16elv_142 _arrow_16elv_150";
-const visible$1 = "_visible_16elv_146";
-const arrow = "_arrow_16elv_150";
-const grid = "_grid_16elv_168";
+const dragContainer = "_dragContainer_1jj9p_123";
+const dragButton = "_dragButton_1jj9p_127";
+const leftArrow = "_leftArrow_1jj9p_141 _arrow_1jj9p_150";
+const rightArrow = "_rightArrow_1jj9p_142 _arrow_1jj9p_150";
+const visible$1 = "_visible_1jj9p_146";
+const arrow = "_arrow_1jj9p_150";
+const grid = "_grid_1jj9p_168";
 const style0$1 = {
   dragContainer,
   dragButton,
@@ -420,15 +421,15 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const dataPanel = "_dataPanel_1hkoo_123";
-const inputPanel = "_inputPanel_1hkoo_132 _dataPanel_1hkoo_123";
-const outputPanel = "_outputPanel_1hkoo_140 _dataPanel_1hkoo_123";
-const mainPanel = "_mainPanel_1hkoo_148";
-const draggable = "_draggable_1hkoo_152";
-const mainPanelInner = "_mainPanelInner_1hkoo_156";
-const dragging = "_dragging_1hkoo_163";
-const dragButtonContainer = "_dragButtonContainer_1hkoo_176";
-const visible = "_visible_1hkoo_192";
+const dataPanel = "_dataPanel_1xgxx_123";
+const inputPanel = "_inputPanel_1xgxx_132 _dataPanel_1xgxx_123";
+const outputPanel = "_outputPanel_1xgxx_140 _dataPanel_1xgxx_123";
+const mainPanel = "_mainPanel_1xgxx_148";
+const draggable = "_draggable_1xgxx_152";
+const mainPanelInner = "_mainPanelInner_1xgxx_156";
+const dragging = "_dragging_1xgxx_163";
+const dragButtonContainer = "_dragButtonContainer_1xgxx_176";
+const visible = "_visible_1xgxx_192";
 const style0 = {
   dataPanel,
   inputPanel,
@@ -437,7 +438,7 @@ const style0 = {
   draggable,
   mainPanelInner,
   dragging,
-  "double-width": "_double-width_1hkoo_172",
+  "double-width": "_double-width_1xgxx_172",
   dragButtonContainer,
   visible
 };
@@ -1117,10 +1118,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const modalBackground = "_modalBackground_6qa0i_123";
-const triggerWarning = "_triggerWarning_6qa0i_128";
-const backToCanvas = "_backToCanvas_6qa0i_132";
-const featureRequest = "_featureRequest_6qa0i_153";
+const modalBackground = "_modalBackground_rmwfp_123";
+const triggerWarning = "_triggerWarning_rmwfp_128";
+const backToCanvas = "_backToCanvas_rmwfp_132";
+const featureRequest = "_featureRequest_rmwfp_153";
 const style1 = {
   modalBackground,
   triggerWarning,

package/dist/assets/{NodeDetailsView-CBYV4Rrz.css → NodeDetailsView-D3QAo3SF.css}

@@ -120,15 +120,15 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._dragContainer_16elv_123 {
+._dragContainer_1jj9p_123 {
   pointer-events: all;
 }
-._dragButton_16elv_127 {
-  background-color: var(--color-background-base);
+._dragButton_1jj9p_127 {
+  background-color: var(--color--background);
   width: 64px;
   height: 21px;
-  border-top-left-radius: var(--border-radius-base);
-  border-top-right-radius: var(--border-radius-base);
+  border-top-left-radius: var(--radius);
+  border-top-right-radius: var(--radius);
   cursor: grab;
   display: flex;
   align-items: center;
@@ -137,40 +137,40 @@
   position: relative;
   z-index: 3;
 }
-._dragButton_16elv_127:hover ._leftArrow_16elv_141,
-._dragButton_16elv_127:hover ._rightArrow_16elv_142 {
+._dragButton_1jj9p_127:hover ._leftArrow_1jj9p_141,
+._dragButton_1jj9p_127:hover ._rightArrow_1jj9p_142 {
   visibility: visible;
 }
-._visible_16elv_146 {
+._visible_1jj9p_146 {
   visibility: visible !important;
 }
-._arrow_16elv_150 {
+._arrow_1jj9p_150 {
   position: absolute;
-  color: var(--color-background-xlight);
-  font-size: var(--font-size-3xs);
+  color: var(--color--background--light-3);
+  font-size: var(--font-size--3xs);
   visibility: hidden;
   top: 0;
 }
-._leftArrow_16elv_141 {
+._leftArrow_1jj9p_141 {
   left: -16px;
 }
-._rightArrow_16elv_142 {
+._rightArrow_1jj9p_142 {
   right: -16px;
 }
-._grid_16elv_168 > div {
+._grid_1jj9p_168 > div {
   display: flex;
 }
-._grid_16elv_168 > div:first-child > div {
+._grid_1jj9p_168 > div:first-child > div {
   margin-bottom: 2px;
 }
-._grid_16elv_168 > div > div {
+._grid_1jj9p_168 > div > div {
   height: 2px;
   width: 2px;
   border-radius: 50%;
-  background-color: var(--color-foreground-xdark);
+  background-color: var(--color--foreground--shade-2);
   margin-right: 4px;
 }
-._grid_16elv_168 > div > div:last-child {
+._grid_1jj9p_168 > div > div:last-child {
   margin-right: 0;
 }/* BEM support Func
  -------------------------- */
@@ -294,51 +294,51 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._dataPanel_1hkoo_123 {
+._dataPanel_1xgxx_123 {
   position: absolute;
-  height: calc(100% - 2 * var(--spacing-l));
+  height: calc(100% - 2 * var(--spacing--lg));
   position: absolute;
-  top: var(--spacing-l);
+  top: var(--spacing--lg);
   z-index: 0;
   min-width: 280px;
 }
-._inputPanel_1hkoo_132 {
-  left: var(--spacing-l);
+._inputPanel_1xgxx_132 {
+  left: var(--spacing--lg);
 }
-._inputPanel_1hkoo_132 > * {
-  border-radius: var(--border-radius-large) 0 0 var(--border-radius-large);
+._inputPanel_1xgxx_132 > * {
+  border-radius: var(--radius--lg) 0 0 var(--radius--lg);
 }
-._outputPanel_1hkoo_140 {
-  right: var(--spacing-l);
+._outputPanel_1xgxx_140 {
+  right: var(--spacing--lg);
 }
-._outputPanel_1hkoo_140 > * {
-  border-radius: 0 var(--border-radius-large) var(--border-radius-large) 0;
+._outputPanel_1xgxx_140 > * {
+  border-radius: 0 var(--radius--lg) var(--radius--lg) 0;
 }
-._mainPanel_1hkoo_148 {
+._mainPanel_1xgxx_148 {
   position: absolute;
   height: 100%;
 }
-._mainPanel_1hkoo_148:hover ._draggable_1hkoo_152 {
+._mainPanel_1xgxx_148:hover ._draggable_1xgxx_152 {
   visibility: visible;
 }
-._mainPanelInner_1hkoo_156 {
+._mainPanelInner_1xgxx_156 {
   height: 100%;
-  border: var(--border-base);
-  border-radius: var(--border-radius-large);
+  border: var(--border);
+  border-radius: var(--radius--lg);
   box-shadow: 0 4px 16px rgba(50, 61, 85, 0.1);
   overflow: hidden;
 }
-._mainPanelInner_1hkoo_156._dragging_1hkoo_163 {
-  border-color: var(--color-primary);
+._mainPanelInner_1xgxx_156._dragging_1xgxx_163 {
+  border-color: var(--color--primary);
   box-shadow: 0 6px 16px rgba(255, 74, 51, 0.15);
 }
-._draggable_1hkoo_152 {
+._draggable_1xgxx_152 {
   visibility: hidden;
 }
-._double-width_1hkoo_172 {
+._double-width_1xgxx_172 {
   left: 90%;
 }
-._dragButtonContainer_1hkoo_176 {
+._dragButtonContainer_1xgxx_176 {
   position: absolute;
   top: -12px;
   width: 100%;
@@ -347,13 +347,13 @@
   justify-content: center;
   pointer-events: none;
 }
-._dragButtonContainer_1hkoo_176 ._draggable_1hkoo_152 {
+._dragButtonContainer_1xgxx_176 ._draggable_1xgxx_152 {
   pointer-events: all;
 }
-._dragButtonContainer_1hkoo_176:hover ._draggable_1hkoo_152 {
+._dragButtonContainer_1xgxx_176:hover ._draggable_1xgxx_152 {
   visibility: visible;
 }
-._visible_1hkoo_192 {
+._visible_1xgxx_192 {
   visibility: visible;
 }/* BEM support Func
  -------------------------- */
@@ -483,8 +483,8 @@
 }
 .data-display-wrapper {
   height: 100%;
-  margin-top: var(--spacing-xl) !important;
-  margin-bottom: var(--spacing-xl) !important;
+  margin-top: var(--spacing--xl) !important;
+  margin-bottom: var(--spacing--xl) !important;
   width: 100%;
   background: none;
   border: none;
@@ -625,41 +625,41 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._modalBackground_6qa0i_123 {
+._modalBackground_rmwfp_123 {
   height: 100%;
   width: 100%;
 }
-._triggerWarning_6qa0i_128 {
+._triggerWarning_rmwfp_128 {
   max-width: 180px;
 }
-._backToCanvas_6qa0i_132 {
+._backToCanvas_rmwfp_132 {
   position: fixed;
-  top: var(--spacing-xs);
-  left: var(--spacing-l);
+  top: var(--spacing--xs);
+  left: var(--spacing--lg);
   display: flex;
   align-items: center;
-  gap: var(--spacing-3xs);
+  gap: var(--spacing--3xs);
 }
-._backToCanvas_6qa0i_132 span {
+._backToCanvas_rmwfp_132 span {
   color: var(--color-ndv-back-font);
 }
-._backToCanvas_6qa0i_132:hover {
+._backToCanvas_rmwfp_132:hover {
   cursor: pointer;
 }
 @media (min-width: 1920px) {
-._backToCanvas_6qa0i_132 {
-    top: var(--spacing-xs);
-    left: var(--spacing-m);
+._backToCanvas_rmwfp_132 {
+    top: var(--spacing--xs);
+    left: var(--spacing--md);
 }
 }
-._featureRequest_6qa0i_153 {
+._featureRequest_rmwfp_153 {
   position: absolute;
-  bottom: var(--spacing-4xs);
-  left: calc(100% + var(--spacing-s));
+  bottom: var(--spacing--4xs);
+  left: calc(100% + var(--spacing--sm));
   color: var(--color-feature-request-font);
-  font-size: var(--font-size-2xs);
+  font-size: var(--font-size--2xs);
   white-space: nowrap;
 }
-._featureRequest_6qa0i_153 * {
-  margin-right: var(--spacing-3xs);
+._featureRequest_rmwfp_153 * {
+  margin-right: var(--spacing--3xs);
 }