n8n-editor-ui
Version:
Workflow Editor UI for n8n
1,427 lines • 89.8 kB
JavaScript
;
(function () {
System.register(["./chunk-legacy-Re9CbdfL.js", "./vue.runtime.esm-bundler-legacy--Sn1h8On.js", "./_MapCache-legacy-DlYNX_X1.js", "./src-legacy-uZTNWMC0.js", "./en-legacy-DJK4SpPN.js", "./preload-helper-legacy-CXRjoQ0T.js", "./_plugin-vue_export-helper-legacy-DZMI5HPp.js", "./truncate-legacy-BGje52Or.js", "./icon-legacy-CqVXaCIS.js", "./empty-legacy-CA9D6itE.js", "./useTelemetry-legacy-B3pzzkAE.js", "./useToast-legacy-C4Vu5mt9.js", "./sanitize-html-legacy-DLqXJu-U.js", "./CalendarDate-legacy-BUvNgcoo.js", "./path-browserify-legacy-C6ml8BkF.js", "./constants-legacy-TKxWCqvM.js", "./merge-legacy-8xjIc_ts.js", "./_baseOrderBy-legacy-CB2Dh5d_.js", "./dateformat-legacy-C4HUJTCr.js", "./useDebounce-legacy-CqZ-fJEm.js", "./useExternalHooks-legacy-8pg6K3ln.js", "./useStyles-legacy-E8NPEyeD.js", "./cloudPlan.store-legacy-U_Bztyyz.js", "./templates.store-legacy-BBcmaAs_.js", "./nodeIcon-legacy-D1wFvzkX.js", "./NodeIcon-legacy-D0j2KPV5.js", "./TimeAgo-legacy-okNrPxgf.js", "./orderBy-legacy-BzJ3mIT5.js", "./TemplatesView-legacy-CbrENwGz.js", "./TemplateList-legacy-Bf76BC5f.js"], function (_export, _context) {
"use strict";
var __toESM, __commonJS, computed, toDisplayString, createElementBlock, createCommentVNode, nextTick, unref, ref, createVNode, defineComponent, createBlock, mergeProps, onMounted, Fragment, watch, renderSlot, normalizeStyle, withCtx, openBlock, renderList, createTextVNode, createSlots, vShow, onBeforeMount, resolveDirective, normalizeClass, createBaseVNode, withDirectives, require_isObject, useI18n, N8nButton_default, ElCheckbox, N8nText_default, N8nIcon_default, N8nCard_default, N8nLoading_default, N8nInput_default, N8nHeading_default, __plugin_vue_export_helper_default, onBeforeRouteLeave, useRoute, useRouter, useSettingsStore, useDocumentTitle, useUsersStore, useTelemetry, useToast, VIEWS, CREATOR_HUB_URL, require_debounce, useDebounce, useTemplatesStore, require_orderBy, TemplatesView_default, NodeList_default, TemplateList_default, __vite_style__, _hoisted_1$3, CollectionWorkflowCard_vue_vue_type_script_setup_true_lang_default, card, title$1, CollectionWorkflowCard_vue_vue_type_style_index_0_lang_module_default, cssModules$3, CollectionWorkflowCard_default, TemplatesInfoCard_vue_vue_type_script_setup_true_lang_default, TemplatesInfoCard_default, mixin$6, handlers_default, mixin$5, helpers_default, mixin$4, methods_default, mixin$3, preparations_default, import_orderBy, mixin$2, settings_default, require_throttle, import_throttle, mixin$1, throttle_default, mixin, watchers_default, _sfc_main, _hoisted_1$2, _hoisted_2$1, _hoisted_3, _hoisted_4, _hoisted_5, _hoisted_6, _hoisted_7, _hoisted_8, _hoisted_9, _hoisted_10, Agile_default, TemplatesInfoCarousel_vue_vue_type_script_setup_true_lang_default, container, button$1, leftButton, rightButton, TemplatesInfoCarousel_vue_vue_type_style_index_0_lang_module_default, cssModules$2, TemplatesInfoCarousel_default, _hoisted_1$1, _hoisted_2, TemplateFilters_vue_vue_type_script_setup_true_lang_default, title, categories, item, button, TemplateFilters_vue_vue_type_style_index_0_lang_module_default, cssModules$1, TemplateFilters_default, _hoisted_1, TemplatesSearchView_vue_vue_type_script_setup_true_lang_default, wrapper, contentWrapper, filters, search, header, TemplatesSearchView_vue_vue_type_style_index_0_lang_module_default, cssModules, TemplatesSearchView_default;
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return openBlock(), createElementBlock("div", {
class: normalizeClass([{
"agile--ssr": $data.isSSR,
"agile--auto-play": _ctx.settings.autoplay,
"agile--disabled": _ctx.settings.unagile,
"agile--fade": _ctx.settings.fade && !_ctx.settings.unagile,
"agile--rtl": _ctx.settings.rtl,
"agile--no-nav-buttons": !_ctx.settings.navButtons
}, "agile"]),
onTouchstart: () => {}
}, [createBaseVNode("div", _hoisted_1$2, [createBaseVNode("div", {
ref: "track",
style: normalizeStyle({
transform: `translate(${$data.translateX + $options.marginX}px)`,
transition: `transform ${_ctx.settings.timing} ${$data.transitionDelay}ms`
}),
class: "agile__track",
onMouseout: _cache[0] || (_cache[0] = $event => _ctx.handleMouseOut("track")),
onMouseover: _cache[1] || (_cache[1] = $event => _ctx.handleMouseOver("track"))
}, [withDirectives(createBaseVNode("div", _hoisted_2$1, [renderSlot(_ctx.$slots, "default")], 512), [[vShow, $options.slidesCloned]]), createBaseVNode("div", _hoisted_3, [renderSlot(_ctx.$slots, "default")], 512), withDirectives(createBaseVNode("div", _hoisted_4, [renderSlot(_ctx.$slots, "default")], 512), [[vShow, $options.slidesCloned]])], 36)], 512), _ctx.$slots.caption ? (openBlock(), createElementBlock("div", _hoisted_5, [renderSlot(_ctx.$slots, "caption")])) : createCommentVNode("", true), !_ctx.settings.unagile && (_ctx.settings.navButtons || _ctx.settings.dots) ? (openBlock(), createElementBlock("div", _hoisted_6, [_ctx.settings.navButtons && !_ctx.settings.unagile ? (openBlock(), createElementBlock("button", {
key: 0,
ref: "prevButton",
disabled: !$options.canGoToPrev,
"aria-label": "Previous",
class: "agile__nav-button agile__nav-button--prev",
type: "button",
onClick: _cache[2] || (_cache[2] = $event => ($options.goToPrev(), _ctx.restartAutoPlay()))
}, [renderSlot(_ctx.$slots, "prevButton", {}, () => [_cache[6] || (_cache[6] = createTextVNode(" ← "))])], 8, _hoisted_7)) : createCommentVNode("", true), _ctx.settings.dots && !_ctx.settings.unagile ? (openBlock(), createElementBlock("ul", _hoisted_8, [(openBlock(true), createElementBlock(Fragment, null, renderList($options.countSlides, n => {
return openBlock(), createElementBlock("li", {
key: n,
class: normalizeClass([{
"agile__dot--current": n - 1 === $data.currentSlide
}, "agile__dot"]),
onMouseout: _cache[3] || (_cache[3] = $event => _ctx.handleMouseOut("dot")),
onMouseover: _cache[4] || (_cache[4] = $event => _ctx.handleMouseOver("dot"))
}, [createBaseVNode("button", {
type: "button",
onClick: $event => ($options.goTo(n - 1), _ctx.restartAutoPlay())
}, toDisplayString(n), 9, _hoisted_9)], 34);
}), 128))], 512)) : createCommentVNode("", true), _ctx.settings.navButtons && !_ctx.settings.unagile ? (openBlock(), createElementBlock("button", {
key: 2,
ref: "nextButton",
disabled: !$options.canGoToNext,
"aria-label": "Next",
class: "agile__nav-button agile__nav-button--next",
type: "button",
onClick: _cache[5] || (_cache[5] = $event => ($options.goToNext(), _ctx.restartAutoPlay()))
}, [renderSlot(_ctx.$slots, "nextButton", {}, () => [_cache[7] || (_cache[7] = createTextVNode(" → "))])], 8, _hoisted_10)) : createCommentVNode("", true)])) : createCommentVNode("", true)], 34);
}
return {
setters: [function (_chunkLegacy001Js) {
__toESM = _chunkLegacy001Js.o;
__commonJS = _chunkLegacy001Js.t;
}, function (_vueRuntimeEsmBundlerLegacy003Js) {
computed = _vueRuntimeEsmBundlerLegacy003Js.C;
toDisplayString = _vueRuntimeEsmBundlerLegacy003Js.Cn;
createElementBlock = _vueRuntimeEsmBundlerLegacy003Js.D;
createCommentVNode = _vueRuntimeEsmBundlerLegacy003Js.E;
nextTick = _vueRuntimeEsmBundlerLegacy003Js.G;
unref = _vueRuntimeEsmBundlerLegacy003Js.Gt;
ref = _vueRuntimeEsmBundlerLegacy003Js.It;
createVNode = _vueRuntimeEsmBundlerLegacy003Js.M;
defineComponent = _vueRuntimeEsmBundlerLegacy003Js.P;
createBlock = _vueRuntimeEsmBundlerLegacy003Js.T;
mergeProps = _vueRuntimeEsmBundlerLegacy003Js.W;
onMounted = _vueRuntimeEsmBundlerLegacy003Js.Z;
Fragment = _vueRuntimeEsmBundlerLegacy003Js._;
watch = _vueRuntimeEsmBundlerLegacy003Js._t;
renderSlot = _vueRuntimeEsmBundlerLegacy003Js.at;
normalizeStyle = _vueRuntimeEsmBundlerLegacy003Js.bn;
withCtx = _vueRuntimeEsmBundlerLegacy003Js.bt;
openBlock = _vueRuntimeEsmBundlerLegacy003Js.et;
renderList = _vueRuntimeEsmBundlerLegacy003Js.it;
createTextVNode = _vueRuntimeEsmBundlerLegacy003Js.j;
createSlots = _vueRuntimeEsmBundlerLegacy003Js.k;
vShow = _vueRuntimeEsmBundlerLegacy003Js.p;
onBeforeMount = _vueRuntimeEsmBundlerLegacy003Js.q;
resolveDirective = _vueRuntimeEsmBundlerLegacy003Js.st;
normalizeClass = _vueRuntimeEsmBundlerLegacy003Js.vn;
createBaseVNode = _vueRuntimeEsmBundlerLegacy003Js.w;
withDirectives = _vueRuntimeEsmBundlerLegacy003Js.xt;
}, function (_MapCacheLegacy005Js) {
require_isObject = _MapCacheLegacy005Js.c;
useI18n = _MapCacheLegacy005Js.gt;
}, function (_srcLegacy007Js) {
N8nButton_default = _srcLegacy007Js.Hn;
ElCheckbox = _srcLegacy007Js.Lt;
N8nText_default = _srcLegacy007Js.Vn;
N8nIcon_default = _srcLegacy007Js.Wn;
N8nCard_default = _srcLegacy007Js.Z;
N8nLoading_default = _srcLegacy007Js.tt;
N8nInput_default = _srcLegacy007Js.yt;
N8nHeading_default = _srcLegacy007Js.zn;
}, function (_enLegacy00bJs) {}, function (_preloadHelperLegacy00dJs) {}, function (_pluginVue_exportHelperLegacy00fJs) {
__plugin_vue_export_helper_default = _pluginVue_exportHelperLegacy00fJs.t;
}, function (_truncateLegacy00hJs) {
onBeforeRouteLeave = _truncateLegacy00hJs._;
useRoute = _truncateLegacy00hJs.v;
useRouter = _truncateLegacy00hJs.y;
}, function (_iconLegacy00nJs) {}, function (_emptyLegacy00vJs) {}, function (_useTelemetryLegacy00HJs) {
useSettingsStore = _useTelemetryLegacy00HJs.Ho;
useDocumentTitle = _useTelemetryLegacy00HJs.Tn;
useUsersStore = _useTelemetryLegacy00HJs.nr;
useTelemetry = _useTelemetryLegacy00HJs.t;
}, function (_useToastLegacy00JJs) {
useToast = _useToastLegacy00JJs.t;
}, function (_sanitizeHtmlLegacy00LJs) {}, function (_CalendarDateLegacy00NJs) {}, function (_pathBrowserifyLegacy00RJs) {}, function (_constantsLegacy00TJs) {
VIEWS = _constantsLegacy00TJs.Io;
CREATOR_HUB_URL = _constantsLegacy00TJs.d;
}, function (_mergeLegacy00VJs) {}, function (_baseOrderByLegacy00ZJs) {}, function (_dateformatLegacy00$Js) {}, function (_useDebounceLegacy011Js) {
require_debounce = _useDebounceLegacy011Js.n;
useDebounce = _useDebounceLegacy011Js.t;
}, function (_useExternalHooksLegacy013Js) {}, function (_useStylesLegacy015Js) {}, function (_cloudPlanStoreLegacy01dJs) {}, function (_templatesStoreLegacy01fJs) {
useTemplatesStore = _templatesStoreLegacy01fJs.t;
}, function (_nodeIconLegacy01vJs) {}, function (_NodeIconLegacy01FJs) {}, function (_TimeAgoLegacy02TJs) {}, function (_orderByLegacy02VJs) {
require_orderBy = _orderByLegacy02VJs.t;
}, function (_TemplatesViewLegacy07VJs) {
TemplatesView_default = _TemplatesViewLegacy07VJs.t;
}, function (_TemplateListLegacy07$Js) {
NodeList_default = _TemplateListLegacy07$Js.n;
TemplateList_default = _TemplateListLegacy07$Js.t;
}],
execute: function () {
__vite_style__ = document.createElement('style');
__vite_style__.textContent = "/* BEM support Func\n -------------------------- */\n/* Transition\n-------------------------- */\n/* Color\n-------------------------- */\n/* Link\n-------------------------- */\n/* Border\n-------------------------- */\n/* Outline\n-------------------------- */\n/* Box shadow\n-------------------------- */\n/* Fill\n-------------------------- */\n/* Typography\n-------------------------- */\n/* z-index\n-------------------------- */\n/* Disable base\n-------------------------- */\n/* Icon\n-------------------------- */\n/* Checkbox\n-------------------------- */\n/* Radio\n-------------------------- */\n/* Select\n-------------------------- */\n/* Alert\n-------------------------- */\n/* MessageBox\n-------------------------- */\n/* Message\n-------------------------- */\n/* Notification\n-------------------------- */\n/* Input\n-------------------------- */\n/* Cascader\n-------------------------- */\n/* Group\n-------------------------- */\n/* Tab\n-------------------------- */\n/* Button\n-------------------------- */\n/* cascader\n-------------------------- */\n/* Switch\n-------------------------- */\n/* Dialog\n-------------------------- */\n/* Table\n-------------------------- */\n/* Pagination\n-------------------------- */\n/* Popup\n-------------------------- */\n/* Popover\n-------------------------- */\n/* Tooltip\n-------------------------- */\n/* Tag\n-------------------------- */\n/* Tree\n-------------------------- */\n/* Dropdown\n-------------------------- */\n/* Badge\n-------------------------- */\n/* Card\n--------------------------*/\n/* Slider\n--------------------------*/\n/* Steps\n--------------------------*/\n/* Menu\n--------------------------*/\n/* Rate\n--------------------------*/\n/* DatePicker\n--------------------------*/\n/* Loading\n--------------------------*/\n/* Scrollbar\n--------------------------*/\n/* Carousel\n--------------------------*/\n/* Collapse\n--------------------------*/\n/* Transfer\n--------------------------*/\n/* Header\n --------------------------*/\n/* Footer\n--------------------------*/\n/* Main\n--------------------------*/\n/* Timeline\n--------------------------*/\n/* Backtop\n--------------------------*/\n/* Link\n--------------------------*/\n/* Calendar\n--------------------------*/\n/* Form\n-------------------------- */\n/* Avatar\n--------------------------*/\n/* Break-point\n--------------------------*/\n/* Break-points\n -------------------------- */\n/* Scrollbar\n -------------------------- */\n/* Placeholder\n -------------------------- */\n/* BEM\n -------------------------- */\n._card_1goyo_123 {\n min-width: 235px;\n height: 140px;\n margin-right: var(--spacing--2xs);\n cursor: pointer;\n}\n._card_1goyo_123:last-child {\n margin-right: var(--spacing--5xs);\n}\n._card_1goyo_123:hover {\n box-shadow: 0 2px 4px rgba(68, 28, 23, 0.07);\n}\n._card_1goyo_123 > div {\n height: 100%;\n}\n._title_1goyo_139 {\n display: -webkit-box;\n -webkit-line-clamp: 4;\n -webkit-box-orient: vertical;\n font-size: var(--font-size--sm);\n line-height: var(--line-height--md);\n font-weight: var(--font-weight--bold);\n overflow: hidden;\n white-space: normal;\n}\n.agile {\n position: relative;\n}\n.agile--ssr .agile__slides--cloned {\n display: none\n}\n.agile--ssr .agile__slides > * {\n overflow: hidden;\n width: 0\n}\n.agile--ssr .agile__slides > *:first-child {\n width: 100%\n}\n.agile--rtl .agile__track,\n .agile--rtl .agile__slides,\n .agile--rtl .agile__actions,\n .agile--rtl .agile__dots {\n flex-direction: row-reverse;\n}\n.agile:focus, .agile:active, .agile *:focus, .agile *:active {\n outline: none;\n}\n.agile__list {\n display: block;\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n.agile__track {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n}\n.agile__actions {\n display: flex;\n justify-content: space-between;\n}\n.agile--no-nav-buttons .agile__actions {\n justify-content: center;\n}\n.agile__slides {\n align-items: center;\n display: flex;\n flex-direction: row;\n flex-grow: 1;\n flex-shrink: unset;\n flex-wrap: nowrap;\n justify-content: flex-start;\n}\n.agile--disabled .agile__slides {\n display: block;\n width: 100%;\n}\n.agile__slide {\n display: block;\n flex-grow: 1;\n flex-shrink: 0;\n}\n.agile__slide,\n .agile__slide * {\n -webkit-user-drag: none;\n}\n.agile--fade .agile__slide {\n opacity: 0;\n position: relative;\n z-index: 0;\n}\n.agile--fade .agile__slide--active {\n opacity: 1;\n z-index: 2;\n}\n.agile--fade .agile__slide--expiring {\n opacity: 1;\n transition-duration: 0s;\n z-index: 1;\n}\n.agile__nav-button[disabled] {\n cursor: default;\n}\n.agile__dots {\n align-items: center;\n display: flex;\n list-style: none;\n padding: 0;\n white-space: nowrap;\n}\n.agile__dot button {\n cursor: pointer;\n display: block;\n font-size: 0;\n line-height: 0;\n}\n/* BEM support Func\n -------------------------- */\n/* Transition\n-------------------------- */\n/* Color\n-------------------------- */\n/* Link\n-------------------------- */\n/* Border\n-------------------------- */\n/* Outline\n-------------------------- */\n/* Box shadow\n-------------------------- */\n/* Fill\n-------------------------- */\n/* Typography\n-------------------------- */\n/* z-index\n-------------------------- */\n/* Disable base\n-------------------------- */\n/* Icon\n-------------------------- */\n/* Checkbox\n-------------------------- */\n/* Radio\n-------------------------- */\n/* Select\n-------------------------- */\n/* Alert\n-------------------------- */\n/* MessageBox\n-------------------------- */\n/* Message\n-------------------------- */\n/* Notification\n-------------------------- */\n/* Input\n-------------------------- */\n/* Cascader\n-------------------------- */\n/* Group\n-------------------------- */\n/* Tab\n-------------------------- */\n/* Button\n-------------------------- */\n/* cascader\n-------------------------- */\n/* Switch\n-------------------------- */\n/* Dialog\n-------------------------- */\n/* Table\n-------------------------- */\n/* Pagination\n-------------------------- */\n/* Popup\n-------------------------- */\n/* Popover\n-------------------------- */\n/* Tooltip\n-------------------------- */\n/* Tag\n-------------------------- */\n/* Tree\n-------------------------- */\n/* Dropdown\n-------------------------- */\n/* Badge\n-------------------------- */\n/* Card\n--------------------------*/\n/* Slider\n--------------------------*/\n/* Steps\n--------------------------*/\n/* Menu\n--------------------------*/\n/* Rate\n--------------------------*/\n/* DatePicker\n--------------------------*/\n/* Loading\n--------------------------*/\n/* Scrollbar\n--------------------------*/\n/* Carousel\n--------------------------*/\n/* Collapse\n--------------------------*/\n/* Transfer\n--------------------------*/\n/* Header\n --------------------------*/\n/* Footer\n--------------------------*/\n/* Main\n--------------------------*/\n/* Timeline\n--------------------------*/\n/* Backtop\n--------------------------*/\n/* Link\n--------------------------*/\n/* Calendar\n--------------------------*/\n/* Form\n-------------------------- */\n/* Avatar\n--------------------------*/\n/* Break-point\n--------------------------*/\n/* Break-points\n -------------------------- */\n/* Scrollbar\n -------------------------- */\n/* Placeholder\n -------------------------- */\n/* BEM\n -------------------------- */\n._container_3t1vn_123 {\n position: relative;\n}\n._button_3t1vn_127 {\n width: 28px;\n height: 37px;\n position: absolute;\n top: 35%;\n border-radius: var(--radius--lg);\n border: var(--border);\n background-color: #fbfcfe;\n cursor: pointer;\n}\n._button_3t1vn_127:after {\n content: \"\";\n width: 40px;\n height: 140px;\n top: -55px;\n position: absolute;\n}\n._button_3t1vn_127 svg {\n color: var(--color--foreground--shade-2);\n}\n._leftButton_3t1vn_148 {\n left: -30px;\n}\n._leftButton_3t1vn_148:after {\n left: 27px;\n background: linear-gradient(270deg, color-mix(in srgb, transparent 50%, var(--color--background--light-2)), var(--color--background--light-2));\n}\n._rightButton_3t1vn_157 {\n right: -30px;\n}\n._rightButton_3t1vn_157:after {\n right: 27px;\n background: linear-gradient(90deg, color-mix(in srgb, transparent 50%, var(--color--background--light-2)), var(--color--background--light-2));\n}/* BEM support Func\n -------------------------- */\n/* Transition\n-------------------------- */\n/* Color\n-------------------------- */\n/* Link\n-------------------------- */\n/* Border\n-------------------------- */\n/* Outline\n-------------------------- */\n/* Box shadow\n-------------------------- */\n/* Fill\n-------------------------- */\n/* Typography\n-------------------------- */\n/* z-index\n-------------------------- */\n/* Disable base\n-------------------------- */\n/* Icon\n-------------------------- */\n/* Checkbox\n-------------------------- */\n/* Radio\n-------------------------- */\n/* Select\n-------------------------- */\n/* Alert\n-------------------------- */\n/* MessageBox\n-------------------------- */\n/* Message\n-------------------------- */\n/* Notification\n-------------------------- */\n/* Input\n-------------------------- */\n/* Cascader\n-------------------------- */\n/* Group\n-------------------------- */\n/* Tab\n-------------------------- */\n/* Button\n-------------------------- */\n/* cascader\n-------------------------- */\n/* Switch\n-------------------------- */\n/* Dialog\n-------------------------- */\n/* Table\n-------------------------- */\n/* Pagination\n-------------------------- */\n/* Popup\n-------------------------- */\n/* Popover\n-------------------------- */\n/* Tooltip\n-------------------------- */\n/* Tag\n-------------------------- */\n/* Tree\n-------------------------- */\n/* Dropdown\n-------------------------- */\n/* Badge\n-------------------------- */\n/* Card\n--------------------------*/\n/* Slider\n--------------------------*/\n/* Steps\n--------------------------*/\n/* Menu\n--------------------------*/\n/* Rate\n--------------------------*/\n/* DatePicker\n--------------------------*/\n/* Loading\n--------------------------*/\n/* Scrollbar\n--------------------------*/\n/* Carousel\n--------------------------*/\n/* Collapse\n--------------------------*/\n/* Transfer\n--------------------------*/\n/* Header\n --------------------------*/\n/* Footer\n--------------------------*/\n/* Main\n--------------------------*/\n/* Timeline\n--------------------------*/\n/* Backtop\n--------------------------*/\n/* Link\n--------------------------*/\n/* Calendar\n--------------------------*/\n/* Form\n-------------------------- */\n/* Avatar\n--------------------------*/\n/* Break-point\n--------------------------*/\n/* Break-points\n -------------------------- */\n/* Scrollbar\n -------------------------- */\n/* Placeholder\n -------------------------- */\n/* BEM\n -------------------------- */\n.agile__list {\n width: 100%;\n padding-bottom: var(--spacing--2xs);\n overflow-x: auto;\n transition: all 1s ease-in-out;\n}\n.agile__track {\n width: 50px;\n}/* BEM support Func\n -------------------------- */\n/* Transition\n-------------------------- */\n/* Color\n-------------------------- */\n/* Link\n-------------------------- */\n/* Border\n-------------------------- */\n/* Outline\n-------------------------- */\n/* Box shadow\n-------------------------- */\n/* Fill\n-------------------------- */\n/* Typography\n-------------------------- */\n/* z-index\n-------------------------- */\n/* Disable base\n-------------------------- */\n/* Icon\n-------------------------- */\n/* Checkbox\n-------------------------- */\n/* Radio\n-------------------------- */\n/* Select\n-------------------------- */\n/* Alert\n-------------------------- */\n/* MessageBox\n-------------------------- */\n/* Message\n-------------------------- */\n/* Notification\n-------------------------- */\n/* Input\n-------------------------- */\n/* Cascader\n-------------------------- */\n/* Group\n-------------------------- */\n/* Tab\n-------------------------- */\n/* Button\n-------------------------- */\n/* cascader\n-------------------------- */\n/* Switch\n-------------------------- */\n/* Dialog\n-------------------------- */\n/* Table\n-------------------------- */\n/* Pagination\n-------------------------- */\n/* Popup\n-------------------------- */\n/* Popover\n-------------------------- */\n/* Tooltip\n-------------------------- */\n/* Tag\n-------------------------- */\n/* Tree\n-------------------------- */\n/* Dropdown\n-------------------------- */\n/* Badge\n-------------------------- */\n/* Card\n--------------------------*/\n/* Slider\n--------------------------*/\n/* Steps\n--------------------------*/\n/* Menu\n--------------------------*/\n/* Rate\n--------------------------*/\n/* DatePicker\n--------------------------*/\n/* Loading\n--------------------------*/\n/* Scrollbar\n--------------------------*/\n/* Carousel\n--------------------------*/\n/* Collapse\n--------------------------*/\n/* Transfer\n--------------------------*/\n/* Header\n --------------------------*/\n/* Footer\n--------------------------*/\n/* Main\n--------------------------*/\n/* Timeline\n--------------------------*/\n/* Backtop\n--------------------------*/\n/* Link\n--------------------------*/\n/* Calendar\n--------------------------*/\n/* Form\n-------------------------- */\n/* Avatar\n--------------------------*/\n/* Break-point\n--------------------------*/\n/* Break-points\n -------------------------- */\n/* Scrollbar\n -------------------------- */\n/* Placeholder\n -------------------------- */\n/* BEM\n -------------------------- */\n._title_jr0i7_123 {\n font-size: var(--font-size--2xs);\n color: var(--color--text);\n}\n._categories_jr0i7_128 {\n padding-top: var(--spacing--xs);\n list-style-type: none;\n}\n._item_jr0i7_133 {\n margin-top: var(--spacing--xs);\n}\n._item_jr0i7_133:nth-child(1) {\n margin-top: 0;\n}\n._button_jr0i7_140 {\n padding-top: var(--spacing--2xs);\n cursor: pointer;\n}/* BEM support Func\n -------------------------- */\n/* Transition\n-------------------------- */\n/* Color\n-------------------------- */\n/* Link\n-------------------------- */\n/* Border\n-------------------------- */\n/* Outline\n-------------------------- */\n/* Box shadow\n-------------------------- */\n/* Fill\n-------------------------- */\n/* Typography\n-------------------------- */\n/* z-index\n-------------------------- */\n/* Disable base\n-------------------------- */\n/* Icon\n-------------------------- */\n/* Checkbox\n-------------------------- */\n/* Radio\n-------------------------- */\n/* Select\n-------------------------- */\n/* Alert\n-------------------------- */\n/* MessageBox\n-------------------------- */\n/* Message\n-------------------------- */\n/* Notification\n-------------------------- */\n/* Input\n-------------------------- */\n/* Cascader\n-------------------------- */\n/* Group\n-------------------------- */\n/* Tab\n-------------------------- */\n/* Button\n-------------------------- */\n/* cascader\n-------------------------- */\n/* Switch\n-------------------------- */\n/* Dialog\n-------------------------- */\n/* Table\n-------------------------- */\n/* Pagination\n-------------------------- */\n/* Popup\n-------------------------- */\n/* Popover\n-------------------------- */\n/* Tooltip\n-------------------------- */\n/* Tag\n-------------------------- */\n/* Tree\n-------------------------- */\n/* Dropdown\n-------------------------- */\n/* Badge\n-------------------------- */\n/* Card\n--------------------------*/\n/* Slider\n--------------------------*/\n/* Steps\n--------------------------*/\n/* Menu\n--------------------------*/\n/* Rate\n--------------------------*/\n/* DatePicker\n--------------------------*/\n/* Loading\n--------------------------*/\n/* Scrollbar\n--------------------------*/\n/* Carousel\n--------------------------*/\n/* Collapse\n--------------------------*/\n/* Transfer\n--------------------------*/\n/* Header\n --------------------------*/\n/* Footer\n--------------------------*/\n/* Main\n--------------------------*/\n/* Timeline\n--------------------------*/\n/* Backtop\n--------------------------*/\n/* Link\n--------------------------*/\n/* Calendar\n--------------------------*/\n/* Form\n-------------------------- */\n/* Avatar\n--------------------------*/\n/* Break-point\n--------------------------*/\n/* Break-points\n -------------------------- */\n/* Scrollbar\n -------------------------- */\n/* Placeholder\n -------------------------- */\n/* BEM\n -------------------------- */\n.template-filters .el-checkbox {\n display: flex;\n white-space: unset;\n}\n.template-filters .el-checkbox__label {\n top: -2px;\n position: relative;\n font-size: var(--font-size--xs);\n line-height: var(--line-height--lg);\n color: var(--color--text--shade-1);\n padding-left: var(--spacing--2xs);\n}/* BEM support Func\n -------------------------- */\n/* Transition\n-------------------------- */\n/* Color\n-------------------------- */\n/* Link\n-------------------------- */\n/* Border\n-------------------------- */\n/* Outline\n-------------------------- */\n/* Box shadow\n-------------------------- */\n/* Fill\n-------------------------- */\n/* Typography\n-------------------------- */\n/* z-index\n-------------------------- */\n/* Disable base\n-------------------------- */\n/* Icon\n-------------------------- */\n/* Checkbox\n-------------------------- */\n/* Radio\n-------------------------- */\n/* Select\n-------------------------- */\n/* Alert\n-------------------------- */\n/* MessageBox\n-------------------------- */\n/* Message\n-------------------------- */\n/* Notification\n-------------------------- */\n/* Input\n-------------------------- */\n/* Cascader\n-------------------------- */\n/* Group\n-------------------------- */\n/* Tab\n-------------------------- */\n/* Button\n-------------------------- */\n/* cascader\n-------------------------- */\n/* Switch\n-------------------------- */\n/* Dialog\n-------------------------- */\n/* Table\n-------------------------- */\n/* Pagination\n-------------------------- */\n/* Popup\n-------------------------- */\n/* Popover\n-------------------------- */\n/* Tooltip\n-------------------------- */\n/* Tag\n-------------------------- */\n/* Tree\n-------------------------- */\n/* Dropdown\n-------------------------- */\n/* Badge\n-------------------------- */\n/* Card\n--------------------------*/\n/* Slider\n--------------------------*/\n/* Steps\n--------------------------*/\n/* Menu\n--------------------------*/\n/* Rate\n--------------------------*/\n/* DatePicker\n--------------------------*/\n/* Loading\n--------------------------*/\n/* Scrollbar\n--------------------------*/\n/* Carousel\n--------------------------*/\n/* Collapse\n--------------------------*/\n/* Transfer\n--------------------------*/\n/* Header\n --------------------------*/\n/* Footer\n--------------------------*/\n/* Main\n--------------------------*/\n/* Timeline\n--------------------------*/\n/* Backtop\n--------------------------*/\n/* Link\n--------------------------*/\n/* Calendar\n--------------------------*/\n/* Form\n-------------------------- */\n/* Avatar\n--------------------------*/\n/* Break-point\n--------------------------*/\n/* Break-points\n -------------------------- */\n/* Scrollbar\n -------------------------- */\n/* Placeholder\n -------------------------- */\n/* BEM\n -------------------------- */\n._wrapper_xumc9_123 {\n display: flex;\n justify-content: space-between;\n}\n._contentWrapper_xumc9_128 {\n display: flex;\n justify-content: space-between;\n}\n@media (max-width: 768px) {\n._contentWrapper_xumc9_128 {\n flex-direction: column;\n}\n}\n._filters_xumc9_138 {\n width: 200px;\n margin-bottom: var(--spacing--xl);\n margin-right: var(--spacing--2xl);\n}\n._search_xumc9_144 {\n width: 100%;\n}\n._search_xumc9_144 > * {\n margin-bottom: var(--spacing--lg);\n}\n@media (max-width: 768px) {\n._search_xumc9_144 {\n padding-left: 0;\n}\n}\n._header_xumc9_156 {\n margin-bottom: var(--spacing--2xs);\n}/*$vite$:1*/";
document.head.appendChild(__vite_style__);
//#region src/app/components/CollectionWorkflowCard.vue?vue&type=script&setup=true&lang.ts
_hoisted_1$3 = ["textContent"];
CollectionWorkflowCard_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */defineComponent({
__name: "CollectionWorkflowCard",
props: {
loading: {
type: Boolean
},
title: {}
},
setup(__props) {
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(N8nCard_default), mergeProps({
class: _ctx.$style.card
}, _ctx.$attrs), createSlots({
default: withCtx(() => [createVNode(unref(N8nLoading_default), {
loading: _ctx.loading,
rows: 3,
variant: "p"
}, null, 8, ["loading"])]),
_: 2
}, [!_ctx.loading && _ctx.title ? {
name: "header",
fn: withCtx(() => [createBaseVNode("span", {
class: normalizeClass(_ctx.$style.title),
textContent: toDisplayString(_ctx.title)
}, null, 10, _hoisted_1$3)]),
key: "0"
} : void 0, !_ctx.loading ? {
name: "footer",
fn: withCtx(() => [renderSlot(_ctx.$slots, "footer")]),
key: "1"
} : void 0]), 1040, ["class"]);
};
}
}); //#endregion
//#region src/app/components/CollectionWorkflowCard.vue?vue&type=style&index=0&lang.module.scss
card = "_card_1goyo_123";
title$1 = "_title_1goyo_139";
CollectionWorkflowCard_vue_vue_type_style_index_0_lang_module_default = {
card,
title: title$1
}; //#endregion
//#region src/app/components/CollectionWorkflowCard.vue
cssModules$3 = {
"$style": CollectionWorkflowCard_vue_vue_type_style_index_0_lang_module_default
};
CollectionWorkflowCard_default = /* @__PURE__ */__plugin_vue_export_helper_default(CollectionWorkflowCard_vue_vue_type_script_setup_true_lang_default, [["__cssModules", cssModules$3]]); //#endregion
//#region src/features/workflows/templates/components/TemplatesInfoCard.vue?vue&type=script&setup=true&lang.ts
TemplatesInfoCard_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */defineComponent({
__name: "TemplatesInfoCard",
props: {
collection: {},
loading: {
type: Boolean,
default: false
},
showItemCount: {
type: Boolean,
default: true
},
width: {}
},
setup(__props) {
const i18n = useI18n();
return (_ctx, _cache) => {
return openBlock(), createBlock(CollectionWorkflowCard_default, {
loading: _ctx.loading,
title: _ctx.collection.name,
style: normalizeStyle({
width: _ctx.width
})
}, {
footer: withCtx(() => [createBaseVNode("span", null, [withDirectives(createVNode(unref(N8nText_default), {
size: "small",
color: "text-light"
}, {
default: withCtx(() => [createTextVNode(toDisplayString(_ctx.collection.workflows.length) + " " + toDisplayString(unref(i18n).baseText("templates.workflows")), 1)]),
_: 1
}, 512), [[vShow, _ctx.showItemCount]])]), createVNode(NodeList_default, {
nodes: _ctx.collection.nodes,
"show-more": false
}, null, 8, ["nodes"])]),
_: 1
}, 8, ["loading", "title", "style"]);
};
}
}); //#endregion
//#region src/features/workflows/templates/components/TemplatesInfoCard.vue
TemplatesInfoCard_default = TemplatesInfoCard_vue_vue_type_script_setup_true_lang_default; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/handlers.js
/**
* Handlers methods for mouse/touch events
*/
mixin$6 = {
methods: {
handleMouseDown(e) {
this.isMouseDown = true;
if (e.type.indexOf("touch") !== -1) {
this.dragStartX = e.touches[0].clientX;
this.dragStartY = e.touches[0].clientY;
}
if (e.type.indexOf("mouse") !== -1) {
this.dragStartX = e.clientX;
this.dragStartY = e.clientY;
}
},
handleMouseMove(e) {
let positionX;
let positionY;
if (e.type.indexOf("touch") !== -1) {
positionX = e.touches[0].clientX;
positionY = e.touches[0].clientY;
}
if (e.type.indexOf("mouse") !== -1) {
positionX = e.clientX;
positionY = e.clientY;
}
if (Math.abs(positionX - this.dragStartX) > 3 * Math.abs(positionY - this.dragStartY)) {
this.disableScroll();
this.dragDistance = positionX - this.dragStartX;
}
},
handleMouseUp() {
this.isMouseDown = false;
this.enableScroll();
},
handleMouseOver(element) {
if (this.settings.autoplay) {
if (element === "dot" && this.settings.pauseOnDotsHover || element === "track" && this.settings.pauseOnHover) this.isAutoplayPaused = true;
}
},
handleMouseOut(element) {
if (this.settings.autoplay) {
if (element === "dot" && this.settings.pauseOnDotsHover || element === "track" && this.settings.pauseOnHover) this.isAutoplayPaused = false;
}
}
}
};
handlers_default = mixin$6; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/helpers.js
/**
* Helpers methods
*/
mixin$5 = {
methods: {
getWidth() {
if (this.isSSR) return false;
this.widthWindow = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
this.widthContainer = this.$refs.list.clientWidth;
},
htmlCollectionToArray(collection) {
return Array.prototype.slice.call(collection, 0);
}
}
};
helpers_default = mixin$5; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/methods.js
/**
* All not public methods doesn't classified elsewhere
*/
mixin$4 = {
methods: {
clearAutoPlayPause() {
clearTimeout(this.autoplayTimeout);
this.autoplayRemaining = null;
},
disableAutoPlay() {
clearInterval(this.autoplayInterval);
this.autoplayInterval = null;
},
disableScroll() {
document.ontouchmove = e => e.preventDefault();
},
enableScroll() {
document.ontouchmove = () => true;
},
restartAutoPlay() {
this.disableAutoPlay();
this.toggleAutoPlay();
},
toggleAutoPlay() {
const enabled = !this.settings.unagile && this.settings.autoplay;
if (!this.autoplayInterval && enabled) this.autoplayInterval = setInterval(() => {
if (!document.hidden) if (!this.canGoToNext) this.disableAutoPlay();else this.goToNext();
}, this.settings.autoplaySpeed);else this.disableAutoPlay();
},
toggleFade() {
const enabled = !this.settings.unagile && this.settings.fade;
for (let i = 0; i < this.countSlides; i++) {
this.slides[i].style.transition = enabled ? "opacity " + this.settings.timing + " " + this.settings.speed + "ms" : "none";
this.slides[i].style.transform = enabled ? `translate(-${i * this.widthSlide}px)` : "none";
}
}
}
};
methods_default = mixin$4; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/preparations.js
/**
* Carousel preparation methods
*/
mixin$3 = {
methods: {
prepareSlides() {
this.slides = this.htmlCollectionToArray(this.$refs.slides.children);
if (this.slidesCloned) {
this.slidesClonedBefore = this.htmlCollectionToArray(this.$refs.slidesClonedBefore.children);
this.slidesClonedAfter = this.htmlCollectionToArray(this.$refs.slidesClonedAfter.children);
}
for (const slide of this.slidesAll) slide.classList.add("agile__slide");
},
prepareSlidesClasses() {
if (this.currentSlide === null) return false;
for (let i = 0; i < this.countSlides; i++) {
this.slides[i].classList.remove("agile__slide--active");
this.slides[i].classList.remove("agile__slide--current");
}
setTimeout(() => this.slides[this.currentSlide].classList.add("agile__slide--active"), this.changeDelay);
let start = this.slidesCloned ? this.countSlides + this.currentSlide : this.currentSlide;
if (this.centerMode) start -= Math.floor(this.settings.slidesToShow / 2) - +(this.settings.slidesToShow % 2 === 0);
for (let i = Math.max(start, 0); i < Math.min(start + this.settings.slidesToShow, this.countSlides); i++) this.slidesAll[i].classList.add("agile__slide--current");
},
prepareCarousel() {
if (this.settings.unagile) this.translateX = 0;else {
if (this.currentSlide === null && this.countSlides) this.currentSlide = this.settings.initialSlide;
if (this.currentSlide > this.countSlides) this.currentSlide = this.countSlides - 1;
this.goTo(this.currentSlide, false, false);
}
}
}
};
preparations_default = mixin$3; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/settings.js
import_orderBy = /* @__PURE__ */__toESM(require_orderBy());
mixin$2 = {
props: {
asNavFor: {
type: Array,
default: function () {
return [];
}
},
autoplay: {
type: Boolean,
default: false
},
autoplaySpeed: {
type: Number,
default: 3e3
},
centerMode: {
type: Boolean,
default: false
},
centerPadding: {
type: String,
default: "15%"
},
changeDelay: {
type: Number,
default: 0
},
dots: {
type: Boolean,
default: true
},
fade: {
type: Boolean,
default: false
},
infinite: {
type: Boolean,
default: true
},
initialSlide: {
type: Number,
default: 0
},
mobileFirst: {
type: Boolean,
default: true
},
navButtons: {
type: Boolean,
default: true
},
options: {
type: Object,
default: () => null
},
pauseOnDotsHover: {
type: Boolean,
default: false
},
pauseOnHover: {
type: Boolean,
default: true
},
responsive: {
type: Array,
default: () => null
},
rtl: {
type: Boolean,
default: false
},
slidesToScroll: {
type: Number,
default: 1
},
slidesToShow: {
type: Number,
default: 1
},
speed: {
type: Number,
default: 300
},
swipeDistance: {
type: Number,
default: 50
},
throttleDelay: {
type: Number,
default: 500
},
timing: {
type: String,
default: "ease",
validator: value => {
return ["ease", "linear", "ease-in", "ease-out", "ease-in-out"].indexOf(value) !== -1;
}
},
unagile: {
type: Boolean,
default: false
}
},
computed: {
initialSettings: function () {
let {
options,
...initialSettings
} = this.$props;
if (options) initialSettings = {
...initialSettings,
...options
};
if (initialSettings.responsive) initialSettings.responsive = (0, import_orderBy.default)(initialSettings.responsive, "breakpoint");
return initialSettings;
},
settings: function () {
const {
responsive,
...settings
} = this.initialSettings;
if (responsive) responsive.forEach(option => {
if (settings.mobileFirst ? option.breakpoint < this.widthWindow : option.breakpoint > this.widthWindow) for (const key in option.settings) settings[key] = option.settings[key];
});
return settings;
}
}
};
settings_default = mixin$2; //#endregion
//#region ../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/throttle.js
require_throttle = /* @__PURE__ */__commonJS({
"../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/throttle.js": (exports, module) => {
var debounce = require_debounce(),
isObject = require_isObject();
/** Error message constants. */
var FUNC_ERROR_TEXT = "Expected a function";
/**
* Creates a throttled function that only invokes `func` at most once per
* every `wait` milliseconds. The throttled function comes with a `cancel`
* method to cancel delayed `func` invocations and a `flush` method to
* immediately invoke them. Provide `options` to indicate whether `func`
* should be invoked on the leading and/or trailing edge of the `wait`
* timeout. The `func` is invoked with the last arguments provided to the
* throttled function. Subsequent calls to the throttled function return the
* result of the last `func` invocation.
*
* **Note:** If `leading` and `trailing` options are `true`, `func` is
* invoked on the trailing edge of the timeout only if the throttled function
* is invoked more than once during the `wait` timeout.
*
* If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
* until to the next tick, similar to `setTimeout` with a timeout of `0`.
*
* See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
* for details over the differences between `_.throttle` and `_.debounce`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Function
* @param {Function} func The function to throttle.
* @param {number} [wait=0] The number of milliseconds to throttle invocations to.
* @param {Object} [options={}] The options object.
* @param {boolean} [options.leading=true]
* Specify invoking on the leading edge of the timeout.
* @param {boolean} [options.trailing=true]
* Specify invoking on the trailing edge of the timeout.
* @returns {Function} Returns the new throttled function.
* @example
*
* // Avoid excessively updating the position while scrolling.
* jQuery(window).on('scroll', _.throttle(updatePosition, 100));
*
* // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
* var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
* jQuery(element).on('click', throttled);
*
* // Cancel the trailing throttled invocation.
* jQuery(window).on('popstate', throttled.cancel);
*/
function throttle$1(func, wait, options) {
var leading = true,
trailing = true;
if (typeof func != "function") throw new TypeError(FUNC_ERROR_TEXT);
if (isObject(options)) {
leading = "leading" in options ? !!options.leading : leading;
trailing = "trailing" in options ? !!options.trailing : trailing;
}
return debounce(func, wait, {
"leading": leading,
"maxWait": wait,
"trailing": trailing
});
}
module.exports = throttle$1;
}
}); //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/throttle.js
import_throttle = /* @__PURE__ */__toESM(require_throttle());
mixin$1 = {
created() {
this.goTo = (0, import_throttle.default)(this.goTo, this.throttleDelay);
this.getWidth = (0, import_throttle.default)(this.getWidth, 500);
}
};
throttle_default = mixin$1; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/mixins/watchers.js
/**
* Component watchers
*/
mixin = {
watch: {
currentBreakpoint() {
this.$emit("breakpoint", {
breakpoint: this.currentBreakpoint
});
},
currentSlide() {
this.prepareSlidesClasses();
this.autoplayStartTimestamp = this.settings.autoplay ? + /* @__PURE__ */new Date() : null;
this.$emit("after-change", {
currentSlide: this.currentSlide
});
},
dragDistance() {
if (this.isMouseDown) {
const {
rtl
} = this.settings;
const dragDistance = this.dragDistance * (rtl ? -1 : 1);
if (dragDistance > this.swipeDistance && this.canGoToPrev) {
this.goToPrev();
this.handleMouseUp();
}
if (dragDistance < -1 * this.swipeDistance && this.canGoToNext) {
this.goToNext();
this.handleMouseUp();
}
}
},
isAutoplayPaused(nevValue) {
if (nevValue) {
this.remaining = this.settings.autoplaySpeed - (+ /* @__PURE__ */new Date() - this.autoplayStartTimestamp);
this.disableAutoPlay();
this.clearAutoPlayPause();
} else this.autoplayTimeout = setTimeout(() => {
this.clearAutoPlayPause();
this.goToNext();
this.toggleAutoPlay();
}, this.remaining);
},
"settings.autoplay"() {
this.toggleAutoPlay();
},
"settings.fade"() {
this.toggleFade();
},
"settings.unagile"() {},
widthSlide() {
for (let i = 0; i < this.countSlidesAll; i++) this.slidesAll[i].style.width = `${this.widthSlide}${this.widthSlide !== "auto" ? "px" : ""}`;
},
widthWindow(newValue, oldValue) {
if (oldValue) {
this.prepareCarousel();
this.toggleFade();
}
}
}
};
watchers_default = mixin; //#endregion
//#region ../../../node_modules/.pnpm/vue-agile@2.0.0/node_modules/vue-agile/src/Agile.vue
_sfc_main = {
name: "agile",
mixins: [handlers_default, helpers_default, methods_default, preparations_default, settings_default, throttle_default, watchers_default],
emits: ["before-change", "after-change", "breakpoint"],
data() {
return {
autoplayInterval: null,
autoplayRemaining: null,
autoplayStartTimestamp: null,
autoplayTimeout: null,
currentSlide: null,
dragDistance: 0,
dragStartX: 0,
dragStartY: 0,
isAutoplayPaused: false,
isMouseDown: false,
slides: [],
slidesClonedAfter: [],
slidesClonedBefore: [],
isSSR: typeof window === "undefined",
transitionDelay: 0,
translateX: 0,
widthWindow: 0,
widthContainer: 0
};
},
computed: {
breakpoints: function () {
return !this.initialSettings.responsive ? [] : this.initialSettings.responsive.map(item$1 => item$1.breakpoint);
},
canGoToPrev: function () {
return this.settings.infinite || this.currentSlide > 0;
},
canGoToNext: function () {
return this.settings.infinite || this.currentSlide < this.countSlides - 1;
},
countSlides: function () {
return this.isSSR ? this.htmlCollectionToArray(this.$slots.default).length : this.slides.length;
},
countSlidesAll: function () {
return this.slidesAll.length;
},
currentBreakpoint: function () {
const breakpoints = this.breakpoints.map(item$1 => item$1).reverse();
return this.initialSettings.mobileFirst ? breakpoints.find(item$1 => item$1 < this.widthWindow) || 0 : breakpoints.find(item$1 => item$1 > this.widthWindow) || null;
},
marginX: function () {
if (this.settings.unagile) return 0;
let marginX = this.slidesCloned ? this.countSlides * this.widthSlide : 0;
if (this.settings.centerMode) marginX -= (Math.floor(this.settings.slidesToShow / 2) - +(this.settings.slidesToShow % 2 === 0)) * this.widthSlide;
return this.settings.rtl ? marginX : -1 * marginX;
},
slidesCloned: function () {
return !this.settings.unagile && !this.settings.fade && this.settings.infinite;
},
slidesAll: function () {
return this.slidesCloned ? [...this.slidesClonedBefore, ...this.slides, ...this.slidesClonedAfter] : this.slides;
},
widthSlide: function () {
return !this.settings.unagile ? this.widthContainer / this.settings.slidesToShow : "auto";
}
},
mounted() {
window.addEventListener("resize", this.getWidth);
this.$refs.track.addEventListener("touchstart", this.handleMouseDown);
this.$refs.track.addEventListener("touchend", this.handleMouseUp);
this.$refs.track.addEventListener("touchmove", this.handleMouseMove);
this.$refs.track.addEventListener("mousedown", this.handleMouseDown);
this.$refs.track.addEventListener("mouseup", this.handleMouseUp);
this.$refs.track.addEventListener("mousemove", this.handleMouseMove);
this.isSSR = false;
this.reload();
},
beforeUnmount() {
this.destroy();
},
methods: {
destroy() {
window.removeEventListener("resize", this.getWidth);
this.$refs.track.removeEventListener("touchstart", this.handleMouseDown);
this.$refs.track.removeEventListener("touchend", this.handleMouseUp);
this.$refs.track.removeEventListener("touchmove", this.handleMouseMove);
this.$refs.track.removeEventListener("mousedown", this.handleMouseDown);
this.$refs.track.removeEventListener("mouseup", this.handleMouseUp);
this.$refs.track.removeEventListener("mousemove", this.handleMouseMove);
this.disableAutoPlay();
},
getCurrentBreakpoint() {
return this.currentBreakpoint;
},
getCurrentSettings() {
return this.settings;
},
getCurrentSlide() {
return this.currentSlide;
},
getInitialSettings() {
return this.initialSettings;
},
goTo(n, transition = true, asNav = false) {
if (this.settings.unagile) return false;
if (!asNav) this.settings.asNavFor.forEach(carousel => {
if (carousel) carousel.goTo(n, transition, true);
});
let slideNextReal = n;
if (transition) {
if (this.settings.infinite && n < 0) slideNextReal = this.countSlides - 1;else if (n >= this.countSlides) slideNextReal = 0;
this.$emit("before-change", {
currentSlide: this.currentSlide,
nextSlide: slideNextReal
});
this.currentSlide = slideNextReal;
if (n !== slideNextReal) setTimeout(() => {
this.goTo(slideNextReal, false);
}, this.settings.speed);
}
const translateX = !this.settings.fade ? n * this.widthSlide * this.settings.slidesToScroll : 0;
this.transitionDelay = transition ? this.speed : 0;
if (this.infinite || this.currentSlide + this.slidesToShow <= this.countSlides) this.translateX = this.settings.rtl ? translateX : -1 * translateX;
},
goToNext() {
if (this.canGoToNext) this.goTo(this.currentSlide + 1);
},
goToPrev() {
if (this.canGoToPrev) this.goTo(this.currentSlide - 1);
},
reload() {
this.getWidth();
this.prepareSlides();
this.prepareCarousel();
this.toggleFade();
this.toggleAutoPlay();
}
}
};
_hoisted_1$2 = {
ref: "list",
class: "agile__list"
};
_hoisted_2$1 = {
ref: "slidesClonedBefore",
class: "agile__slides agile__slides--cloned"
};
_hoisted_3 = {
ref: "slides",
class: "agile__slides agile__slides--regular"
};
_hoisted_4 = {
ref: "slidesClonedAfter",
class: "agile__slides agile__slides--cloned"
};
_hoisted_5 = {
key: 0,
class: "agile__caption"
};
_hoisted_6 = {
key: 1,
class: "agile__actions"
};
_hoisted_7 = ["disabled"];
_hoisted_8 = {
key: 1,
ref: "dots",
class: "agile__dots"
};
_hoisted_9 = ["onClick"];
_hoisted_10 = ["disabled"];
Agile_default = /* @__PURE__ */__plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]); //#endregion
//#region src/features/workflows/templates/components/TemplatesInfoCarousel.vue?vue&type=script&setup=true&lang.ts
TemplatesInfoCarousel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */defineComponent({
__name: "TemplatesInfoCarousel",
props: {
collections: {},
loading: {
type: Boolean,
default: false
},
showItemCount: {
type: Boolean,
default: true
},
showNavigation: {
type: Boolean,
default: true
},
cardsWidth: {
default: "240px"
}
},
emits: ["openCollection"],
setup(__props, {
emit: __emit
}) {
const props = __props;
const emit = __emit;
const carouselScrollPosition = ref(0);
const cardWidth = ref(parseInt(props.cardsWidth, 10));
const scrollEnd = ref(false);
const listElement = ref(null);
const sliderRef = ref(null);
const updateCarouselScroll = () => {
if (listElement.value) {
carouselScrollPosition.value = Number(listElement.value.scrollLeft.toFixed());
const width = listElement.value.clientWidth;
const scrollWidth = listElement.value.scrollWidth;
const scrollLeft$1 = carouselScrollPosition.value;
scrollEnd.value = scrollWidth - width <= scrollLeft$1 + 7;
}
};
const onCardClick = (event, id) => {
emit("openCollection", {
event,
id
});
};
const scrollLeft = () => {
if (listElement.value) listElement.value.scrollBy({
left: -(cardWidth.value * 2),
top: 0,
behavior: "smooth"
});
};
const scrollRight = () => {
if (listElement.value) listElement.value.scrollBy({
left: cardWidth.value * 2,
top: 0,
behavior: "smooth"
});
};
watch(() => props.collections, () => {
setTimeout(() => {
updateCarouselScroll();
}, 0);
});
watch(() => props.loading, () => {
setTimeout(() => {
updateCarouselScroll();
}, 0);
});
onMounted(async () => {
await nextTick();
if (!sliderRef.value) return;
listElement.value = sliderRef.value.$el.querySelector(".agile__list");
if (listElement.value) listElement.value.addEventListener("scroll", updateCarouselScroll);
});
onBeforeMount(() => {
if (sliderRef.value) sliderRef.value.destroy();
window.addEventListener("scroll", updateCarouselScroll);
});
return (_ctx, _cache) => {
return withDirectives((openBlock(), createElementBlock("div", {
class: normalizeClass(_ctx.$style.container)
}, [createVNode(unref(Agile_default), {
ref_key: "sliderRef",
ref: sliderRef,
dots: false,
"nav-buttons": false,
infinite: false,
"slides-to-show": 4,
onAfterChange: updateCarouselScroll
}, {
default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.loading ? 4 : 0, n => {
return openBlock(), createBlock(CollectionWorkflowCard_default, {
key: `loading-${n}`,
loading: _ctx.loading
}, null, 8, ["loading"]);
}), 128)), (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.loading ? [] : _ctx.collections, collection => {
return openBlock(), createBlock(TemplatesInfoCard_default, {
key: collection.id,
"data-test-id": "templates-info-card",
collection,
"show-item-count": _ctx.showItemCount,
width: _ctx.cardsWidth,
onClick: e => onCardClick(e, collection.id)
}, null, 8, ["collection", "show-item-count", "width", "onClick"]);
}), 128))]),
_: 1
}, 512), withDirectives(createBaseVNode("button", {
class: normalizeClass({
[_ctx.$style.leftButton]: true
}),
onClick: scrollLeft
}, [createVNode(unref(N8nIcon_default), {
icon: "chevron-left"
})], 2), [[vShow, _ctx.showNavigation && carouselScrollPosition.value > 0]]), withDirectives(createBaseVNode("button", {
class: normalizeClass({
[_ctx.$style.rightButton]: true
}),
onClick: scrollRight
}, [createVNode(unref(N8nIcon_default), {
icon: "chevron-right"
})], 2), [[vShow, _ctx.showNavigation && !scrollEnd.value]])], 2)), [[vShow, _ctx.loading || _ctx.collections.length]]);
};
}
}); //#endregion
//#region src/features/workflows/templates/components/TemplatesInfoCarousel.vue?vue&type=style&index=0&lang.module.scss
container = "_container_3t1vn_123";
button$1 = "_button_3t1vn_127";
leftButton = "_leftButton_3t1vn_148 _button_3t1vn_127";
rightButton = "_rightButton_3t1vn_157 _button_3t1vn_127";
TemplatesInfoCarousel_vue_vue_type_style_index_0_lang_module_default = {
container,
button: button$1,
leftButton,
rightButton
}; //#endregion
//#region src/features/workflows/templates/components/TemplatesInfoCarousel.vue
cssModules$2 = {
"$style": TemplatesInfoCarousel_vue_vue_type_style_index_0_lang_module_default
};
TemplatesInfoCarousel_default = /* @__PURE__ */__plugin_vue_export_helper_default(TemplatesInfoCarousel_vue_vue_type_script_setup_true_lang_default, [["__cssModules", cssModules$2]]); //#endregion
//#region src/features/workflows/templates/components/TemplateFilters.vue?vue&type=script&setup=true&lang.ts
_hoisted_1$1 = ["textContent"];
_hoisted_2 = ["data-test-id"];
TemplateFilters_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */defineComponent({
__name: "TemplateFilters",
props: {
categories: {
default: () => []
},
sortOnPopulate: {
type: Boolean,
default: false
},
expandLimit: {
default: 12
},
loading: {
type: Boolean,
default: false
},
selected: {
default: () => []
}
},
emits: ["clearAll", "select", "clear"],
setup(__props, {
emit: __emit
}) {
const props = __props;
const emit = __emit;
const i18n = useI18n();
const collapsed = ref(true);
const sortedCategories = ref([]);
const allSelected = computed(() => {
return props.selected.length === 0;
});
function sortCategories() {
if (!props.sortOnPopulate) sortedCategories.value = props.categories;else {
const selected = props.selected || [];
const selectedCategories = props.categories.filter(cat => selected.includes(cat));
const notSelectedCategories = props.categories.filter(cat => !selected.includes(cat));
sortedCategories.value = selectedCategories.concat(notSelectedCategories);
}
}
function collapseAction() {
collapsed.value = false;
}
function handleCheckboxChanged(value, selectedCategory) {
if (value) emit("select", selectedCategory);else emit("clear", selectedCategory);
}
function isSelected(category) {
return props.selected.includes(category);
}
function resetCategories() {
emit("clearAll");
}
watch(() => props.sortOnPopulate, value => {
if (value) sortCategories();
}, {
immediate: true
});
watch(() => props.categories, categories$1 => {
if (categories$1.length > 0) sortCategories();
}, {
immediate: true
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
class: normalizeClass([_ctx.$style.filters, "template-filters"]),
"data-test-id": "templates-filter-container"
}, [createBaseVNode("div", {
class: normalizeClass(_ctx.$style.title),
textContent: toDisplayString(unref(i18n).baseText("templates.categoriesHeading"))
}, null, 10, _hoisted_1$1), _ctx.loading ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(_ctx.$style.list)
}, [createVNode(unref(N8nLoading_default), {
loading: _ctx.loading,
rows: _ctx.expandLimit
}, null, 8, ["loading", "rows"])], 2)) : createCommentVNode("", true), !_ctx.loading ? (openBlock(), createElementBlock("ul", {
key: 1,
class: normalizeClass(_ctx.$style.categories)
}, [createBaseVNode("li", {
class: normalizeClass(_ctx.$style.item),
"data-test-id": "template-filter-all-categories"
}, [createVNode(unref(ElCheckbox), {
"model-value": allSelected.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = () => resetCategories())
}, {
default: withCtx(() => [createTextVNode(toDisplayString(unref(i18n).baseText("templates.allCategories")), 1)]),
_: 1
}, 8, ["model-value"])], 2), (openBlock(true), createElementBlock(Fragment, null, renderList(collapsed.value ? sortedCategories.value.slice(0, _ctx.expandLimit) : sortedCategories.value, (category, index) => {
return openBlock(), createElementBlock("li", {
key: index,
class: normalizeClass(_ctx.$style.item),
"data-test-id": `template-filter-${category.name.toLowerCase().replaceAll(" ", "-")}`
}, [createVNode(unref(ElCheckbox), {
"model-value": isSelected(category),
"onUpdate:modelValue": value => handleCheckboxChanged(typeof value === "boolean" ? value : Boolean(value), category)
}, {
default: withCtx(() => [createTextVNode(toDisplayString(category.name), 1)]),
_: 2
}, 1032, ["model-value", "onUpdate:modelValue"])], 10, _hoisted_2);
}), 128))], 2)) : createCommentVNode("", true), sortedCategories.value.length > _ctx.expandLimit && collapsed.value && !_ctx.loading ? (openBlock(), createElementBlock("div", {
key: 2,
class: normalizeClass(_ctx.$style.button),
"data-test-id": "expand-categories-button",
onClick: collapseAction
}, [createVNode(unref(N8nText_default), {
size: "small",
color: "primary"
}, {
default: withCtx(() => [createTextVNode(" + " + toDisplayString(`${sortedCategories.value.length - _ctx.expandLimit} more`), 1)]),
_: 1
})], 2)) : createCommentVNode("", true)], 2);
};
}
}); //#endregion
//#region src/features/workflows/templates/components/TemplateFilters.vue?vue&type=style&index=0&lang.module.scss
title = "_title_jr0i7_123";
categories = "_categories_jr0i7_128";
item = "_item_jr0i7_133";
button = "_button_jr0i7_140";
TemplateFilters_vue_vue_type_style_index_0_lang_module_default = {
title,
categories,
item,
button
}; //#endregion
//#region src/features/workflows/templates/components/TemplateFilters.vue
cssModules$1 = {
"$style": TemplateFilters_vue_vue_type_style_index_0_lang_module_default
};
TemplateFilters_default = /* @__PURE__ */__plugin_vue_export_helper_default(TemplateFilters_vue_vue_type_script_setup_true_lang_default, [["__cssModules", cssModules$1]]); //#endregion
//#region src/features/workflows/templates/views/TemplatesSearchView.vue?vue&type=script&setup=true&lang.ts
_hoisted_1 = ["textContent"];
TemplatesSearchView_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */defineComponent({
__name: "TemplatesSearchView",
setup(__props) {
const areCategoriesPrepopulated = ref(false);
const categories$1 = ref([]);
const loadingCategories = ref(true);
const loadingCollections = ref(true);
const loadingWorkflows = ref(true);
const search$1 = ref("");
const searchEventToTrack = ref(null);
const errorLoadingWorkflows = ref(false);
const {
callDebounced
} = useDebounce();
const toast = useToast();
const documentTitle = useDocumentTitle();
const settingsStore = useSettingsStore();
const templatesStore = useTemplatesStore();
const usersStore = useUsersStore();
const i18n = useI18n();
const route = useRoute();
const router = useRouter();
const telemetry = useTelemetry();
const createQueryObject = categoryId => {
return {
categories: categories$1.value.map(category => categoryId === "name" ? category.name : String(category.id)),
search: search$1.value
};
};
const totalWorkflows = computed(() => templatesStore.getSearchedWorkflowsTotal(createQueryObject("name")));
const workflows = computed(() => templatesStore.getSearchedWorkflows(createQueryObject("name")) ?? []);
const collections = computed(() => templatesStore.getSearchedCollections(createQueryObject("id")) ?? []);
const endOfSearchMessage = computed(() => {
if (loadingWorkflows.value) return null;
if (!loadingCollections.value && workflows.value.length === 0 && collections.value.length === 0) {
if (!settingsStore.isTemplatesEndpointReachable && errorLoadingWorkflows.value) return i18n.baseText("templates.connectionWarning");
return i18n.baseText("templates.noSearchResults");
}
return null;
});
const updateQueryParam = (search$2, category) => {
const query = Object.assign({}, route.query);
if (category.length) query.categories = category;else delete query.categories;
if (search$2.length) query.search = search$2;else delete query.search;
router.replace({
query
});
};
const updateSearch = () => {
updateQueryParam(search$1.value, categories$1.value.map(category => category.id).join(","));
loadWorkflowsAndCollections(false);
};
const loadWorkflows = async () => {
try {
loadingWorkflows.value = true;
await templatesStore.getWorkflows({
search: search$1.value,
categories: categories$1.value.map(category => category.name)
});
errorLoadingWorkflows.value = false;
} catch (e) {
errorLoadingWorkflows.value = true;
}
loadingWorkflows.value = false;
};
const loadCollections = async () => {
try {
loadingCollections.value = true;
await templatesStore.getCollections({
categories: categories$1.value.map(category => String(category.id)),
search: search$1.value
});
} catch (e) {}
loadingCollections.value = false;
};
const updateSearchTracking = (search$2, categories$2) => {
if (!search$2) return;
if (searchEventToTrack.value && searchEventToTrack.value.search_string.length > search$2.length) return;
searchEventToTrack.value = {
search_string: search$2,
workflow_results_count: workflows.value.length,
collection_results_count: collections.value.length,
categories_applied: categories$2.map(categoryId => templatesStore.getCategoryById(categoryId.toString())),
wf_template_repo_session_id: templatesStore.currentSessionId
};
};
const trackCategories = () => {
if (categories$1.value.length) telemetry.track("User changed template filters", {
search_string: search$1.value,
categories_applied: categories$1.value,
wf_template_repo_session_id: templatesStore.currentSessionId
});
};
const loadWorkflowsAndCollections = async initialLoad => {
const _categories = [...categories$1.value];
const _search = search$1.value;
await Promise.all([loadWorkflows(), loadCollections()]);
if (!initialLoad) updateSearchTracking(_search, _categories.map(category => category.id));
};
const navigateTo = (e, page, id) => {
if (e.metaKey || e.ctrlKey) {
const route$1 = router.resolve({
name: page,
params: {
id
}
});
window.open(route$1.href, "_blank");
return;
} else router.push({
name: page,
params: {
id
}
});
};
const onOpenCollection = ({
event,
id
}) => {
navigateTo(event, VIEWS.COLLECTION, id);
};
const onOpenTemplate = ({
event,
id
}) => {
navigateTo(event, VIEWS.TEMPLATE, id);
};
const trackSearch = () => {
if (searchEventToTrack.value) {
telemetry.track("User searched workflow templates", searchEventToTrack.value);
searchEventToTrack.value = null;
}
};
const onSearchInput = searchText => {
loadingWorkflows.value = true;
loadingCollections.value = true;
search$1.value = searchText;
callDebounced(updateSearch, {
debounceTime: 500,
trailing: true
});
if (searchText.length === 0) trackSearch();
};
const onCategorySelected = selected => {
categories$1.value = categories$1.value.concat(selected);
updateSearch();
trackCategories();
};
const onCategoryUnselected = selected => {
categories$1.value = categories$1.value.filter(category => category.id !== selected.id);
updateSearch();
trackCategories();
};
const onCategoriesCleared = () => {
categories$1.value = [];
updateSearch();
};
const onLoadMore = async () => {
if (workflows.value.length >= totalWorkflows.value) return;
try {
loadingWorkflows.value = true;
await templatesStore.getMoreWorkflows({
categories: categories$1.value.map(category => category.name),
search: search$1.value
});
} catch (e) {
toast.showMessage({
title: "Error",
message: "Could not load more workflows",
type: "error"
});
} finally {
loadingWorkflows.value = false;
}
};
const loadCategories = async () => {
try {
await templatesStore.getCategories();
} catch (e) {}
loadingCategories.value = false;
};
const scrollTo = (position, behavior = "smooth") => {
setTimeout(() => {
const contentArea = document.getElementById("content");
if (contentArea) contentArea.scrollTo({
top: position,
behavior
});
}, 0);
};
const restoreSearchFromRoute = () => {
let shouldUpdateSearch = false;
if (route.query.search && typeof route.query.search === "string") {
search$1.value = route.query.search;
shouldUpdateSearch = true;
}
if (typeof route.query.categories === "string" && route.query.categories.length) {
const categoriesFromURL = route.query.categories.split(",");
categories$1.value = templatesStore.allCategories.filter(category => categoriesFromURL.includes(category.id.toString()));
shouldUpdateSearch = true;
}
if (shouldUpdateSearch) {
updateSearch();
trackCategories();
areCategoriesPrepopulated.value = true;
}
};
onMounted(async () => {
documentTitle.set("Templates");
await loadCategories();
loadWorkflowsAndCollections(true);
usersStore.showPersonalizationSurvey();
restoreSearchFromRoute();
if (settingsStore.isTemplatesEnabled) settingsStore.testTemplatesEndpoint().catch(() => {});
setTimeout(() => {
const scrollOffset = route.meta?.scrollOffset;
if (typeof scrollOffset === "number" && scrollOffset > 0) scrollTo(scrollOffset, "auto");
}, 100);
});
onBeforeRouteLeave((_to, _from, next) => {
const contentArea = document.getElementById("content");
if (contentArea) route.meta?.setScrollPosition?.(contentArea.scrollTop);
trackSearch();
next();
});
watch(workflows, newWorkflows => {
if (newWorkflows.length === 0) window.scrollTo(0, 0);
});
return (_ctx, _cache) => {
const _directive_n8n_html = resolveDirective("n8n-html");
return openBlock(), createBlock(TemplatesView_default, null, {
header: withCtx(() => [createBaseVNode("div", {
class: normalizeClass(_ctx.$style.wrapper)
}, [createBaseVNode("div", {
class: normalizeClass(_ctx.$style.title)
}, [createVNode(unref(N8nHeading_default), {
tag: "h1",
size: "2xlarge"
}, {
default: withCtx(() => [createTextVNode(toDisplayString(unref(i18n).baseText("templates.heading")), 1)]),
_: 1
})], 2), createBaseVNode("div", {
class: normalizeClass(_ctx.$style.button)
}, [createVNode(unref(N8nButton_default), {
size: "large",
type: "secondary",
element: "a",
href: unref(CREATOR_HUB_URL),
label: unref(i18n).baseText("templates.shareWorkflow"),
target: "_blank"
}, null, 8, ["href", "label"])], 2)], 2)]),
content: withCtx(() => [createBaseVNode("div", {
class: normalizeClass(_ctx.$style.contentWrapper)
}, [createBaseVNode("div", {
class: normalizeClass(_ctx.$style.filters)
}, [createVNode(TemplateFilters_default, {
categories: unref(templatesStore).allCategories,
"sort-on-populate": areCategoriesPrepopulated.value,
selected: categories$1.value,
loading: loadingCategories.value,
onClear: onCategoryUnselected,
onClearAll: onCategoriesCleared,
onSelect: onCategorySelected
}, null, 8, ["categories", "sort-on-populate", "selected", "loading"])], 2), createBaseVNode("div", {
class: normalizeClass(_ctx.$style.search)
}, [createVNode(unref(N8nInput_default), {
"model-value": search$1.value,
placeholder: unref(i18n).baseText("templates.searchPlaceholder"),
clearable: "",
"data-test-id": "template-search-input",
"onUpdate:modelValue": onSearchInput,
onBlur: trackSearch
}, {
prefix: withCtx(() => [createVNode(unref(N8nIcon_default), {
icon: "search"
})]),
_: 1
}, 8, ["model-value", "placeholder"]), withDirectives(createBaseVNode("div", {
class: normalizeClass(_ctx.$style.carouselContainer)
}, [createBaseVNode("div", {
class: normalizeClass(_ctx.$style.header)
}, [createVNode(unref(N8nHeading_default), {
bold: true,
size: "medium",
color: "text-light"
}, {
default: withCtx(() => [createTextVNode(toDisplayString(unref(i18n).baseText("templates.collections")) + " ", 1), !loadingCollections.value ? (openBlock(), createElementBlock("span", {
key: 0,
"data-test-id": "collection-count-label",
textContent: toDisplayString(`(${collections.value.length})`)
}, null, 8, _hoisted_1)) : createCommentVNode("", true)]),
_: 1
})], 2), createVNode(TemplatesInfoCarousel_default, {
collections: collections.value,
loading: loadingCollections.value,
onOpenCollection
}, null, 8, ["collections", "loading"])], 2), [[vShow, collections.value.length || loadingCollections.value]]), createVNode(TemplateList_default, {
"infinite-scroll-enabled": true,
loading: loadingWorkflows.value,
workflows: workflows.value,
"total-count": totalWorkflows.value,
onLoadMore,
onOpenTemplate
}, null, 8, ["loading", "workflows", "total-count"]), endOfSearchMessage.value ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(_ctx.$style.endText)
}, [createVNode(unref(N8nText_default), {
size: "medium",
color: "text-base"
}, {
default: withCtx(() => [withDirectives(createBaseVNode("span", null, null, 512), [[_directive_n8n_html, endOfSearchMessage.value]])]),
_: 1
})], 2)) : createCommentVNode("", true)], 2)], 2)]),
_: 1
});
};
}
}); //#endregion
//#region src/features/workflows/templates/views/TemplatesSearchView.vue?vue&type=style&index=0&lang.module.scss
wrapper = "_wrapper_xumc9_123";
contentWrapper = "_contentWrapper_xumc9_128";
filters = "_filters_xumc9_138";
search = "_search_xumc9_144";
header = "_header_xumc9_156";
TemplatesSearchView_vue_vue_type_style_index_0_lang_module_default = {
wrapper,
contentWrapper,
filters,
search,
header
}; //#endregion
//#region src/features/workflows/templates/views/TemplatesSearchView.vue
cssModules = {
"$style": TemplatesSearchView_vue_vue_type_style_index_0_lang_module_default
};
_export("default", TemplatesSearchView_default = /* @__PURE__ */__plugin_vue_export_helper_default(TemplatesSearchView_vue_vue_type_script_setup_true_lang_default, [["__cssModules", cssModules]])); //#endregion
}
};
});
})();