@luck-design-biz/luckda 0.0.24-1 → 0.0.25-1

package/es/lowcode/engine/tools/usePromiseState.js

@@ -1,15 +1,17 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useRef, useCallback } from 'react';
-import { useSafeState, useDeepCompareEffect } from 'ahooks';
+import { useResetState, useDeepCompareEffect } from 'ahooks';
 var usePromiseState = function usePromiseState(initialState) {
-  var _useSafeState = useSafeState(initialState),
-    _useSafeState2 = _slicedToArray(_useSafeState, 2),
-    state = _useSafeState2[0],
-    setState = _useSafeState2[1];
+  var _useResetState = useResetState(initialState),
+    _useResetState2 = _slicedToArray(_useResetState, 3),
+    state = _useResetState2[0],
+    setState = _useResetState2[1],
+    resetState = _useResetState2[2];
   var promiseRef = useRef(null);
   var setStatePromise = useCallback(function (_state) {
     return new Promise(function (resolve) {
       promiseRef.current = resolve;
+      console.log('_state', _state);
       setState(_state);
     });
   }, []);
@@ -19,6 +21,6 @@ var usePromiseState = function usePromiseState(initialState) {
       promiseRef.current = null;
     }
   }, [state]);
-  return [state, setStatePromise];
+  return [state, setStatePromise, resetState];
 };
 export default usePromiseState;

package/es/lowcode/engine/tools/useTodo.js

@@ -0,0 +1,78 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+var _excluded = ["datasetCode"];
+import { useBoolean, useMemoizedFn } from 'ahooks';
+import { message } from 'luck-design/antd';
+import { keys, isNil } from 'lodash';
+import { executeCode } from "./helper";
+import { fetchCallBehavior } from "../../constants/api-url";
+var useTodo = function useTodo() {
+  var _useBoolean = useBoolean(),
+    _useBoolean2 = _slicedToArray(_useBoolean, 2),
+    loading = _useBoolean2[0],
+    _useBoolean2$ = _useBoolean2[1],
+    setTrue = _useBoolean2$.setTrue,
+    setFalse = _useBoolean2$.setFalse;
+  var callBehavior = useMemoizedFn(function (_ref, params, data) {
+    var moduleCode = _ref.moduleCode,
+      datasetCode = _ref.datasetCode,
+      behaviorKey = _ref.behaviorKey;
+    return fetchCallBehavior(_objectSpread({
+      moduleCode: moduleCode,
+      datasetCode: datasetCode,
+      behaviorKey: behaviorKey
+    }, params), data);
+  });
+  var todo = useMemoizedFn(function (ctx, actionPool) {
+    var argsMap = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    if (isNil(actionPool)) {
+      return;
+    }
+    var dsCode = argsMap.datasetCode,
+      args = _objectWithoutProperties(argsMap, _excluded);
+    var argsName = keys(args);
+    var _args = argsName.map(function (n) {
+      return args[n];
+    });
+    if (actionPool.length > 0) {
+      setTrue();
+      var tasks = actionPool.map(function (_ref2) {
+        var _ref3 = _slicedToArray(_ref2, 2),
+          actionKey = _ref3[0],
+          info = _ref3[1];
+        switch (info.category) {
+          case 'custom':
+            return Promise.resolve(executeCode.apply(void 0, [ctx, info.code, argsName].concat(_toConsumableArray(_args))));
+          case 'page-action':
+            {
+              var _JSON$parse = JSON.parse(info.code || '{}'),
+                moduleCode = _JSON$parse.moduleCode,
+                datasetCode = _JSON$parse.datasetCode,
+                params = _JSON$parse.params,
+                data = _JSON$parse.data;
+              var _dscode = datasetCode || dsCode;
+              if (!moduleCode || !_dscode) {
+                message.warning('接口重要参数（模块编码或数据集编码）丢失');
+                return;
+              }
+              return callBehavior({
+                datasetCode: _dscode,
+                moduleCode: moduleCode,
+                behaviorKey: actionKey
+              }, params, data);
+            }
+          case 'trigger':
+            return Promise.resolve();
+          default:
+            break;
+        }
+      });
+      return Promise.all(tasks).finally(setFalse);
+    }
+    return Promise.resolve();
+  });
+  return [todo, callBehavior, loading];
+};
+export default useTodo;

package/es/lowcode/index.js

@@ -1,3 +1,6 @@
 export { default as Painter } from "./painter";
 export { default as View } from "./view";
-// export * as dataProcess  from './engine/tools/dataProcess';
+export { default as Preview } from "./preview";
+// export * as dataProcess  from './engine/tools/dataProcess';
+
+export default function launcher() {}

package/es/lowcode/painter/Components.js

@@ -1,12 +1,15 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useState } from 'react';
 import { Icon, Input, Tabs } from 'luck-design/antd';
 import { useMemoizedFn, useCreation } from 'ahooks';
 import { formatMessage } from '@luck-design-biz/base/utils';
-import { useLDContext } from "../engine/provider/ContextProvider";
+import { useContext } from "../engine/provider/ContextProvider";
+import { useDraggable } from '@dnd-kit/core';
 import styles from "./style/components.less";
 import data from "../engine/meta/components-list.json";
+import { Action } from "./components/DragDrop/DragDropContext";
 var TabPane = Tabs.TabPane;
 var Search = Input.Search;
 var BaseCom = function BaseCom(_ref) {
@@ -28,7 +31,7 @@ var BaseCom = function BaseCom(_ref) {
     }).filter(function (group) {
       return group.components.length > 0;
     });
-  }, [data]);
+  }, [searchTerm]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: styles['components-search']
   }, /*#__PURE__*/React.createElement(Search, {
@@ -44,30 +47,53 @@ var BaseCom = function BaseCom(_ref) {
       key: group.group,
       className: styles['components-wrapper']
     }, /*#__PURE__*/React.createElement("h3", null, group.groupName), group.components.map(function (item) {
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React.createElement(CompItem, {
         key: item.component,
-        className: styles['components-item'],
-        onClick: function onClick() {
-          return onComponentClick(item);
-        }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: styles['icon-wrapper']
-      }, /*#__PURE__*/React.createElement(Icon, {
-        type: item.icon || 'home'
-      })), /*#__PURE__*/React.createElement("div", {
-        className: styles['text-content']
-      }, /*#__PURE__*/React.createElement("span", null, item.name)));
+        item: item,
+        onComponentClick: onComponentClick
+      });
     }));
   })));
 };
+var CompItem = function CompItem(_ref2) {
+  var item = _ref2.item,
+    onComponentClick = _ref2.onComponentClick;
+  // console.log('CompItem', item.component);
+  var _useDraggable = useDraggable({
+      id: 'comlist-' + item.component,
+      data: {
+        component: item,
+        action: Action.ADD
+      }
+    }),
+    attributes = _useDraggable.attributes,
+    listeners = _useDraggable.listeners,
+    transform = _useDraggable.transform,
+    setNodeRef = _useDraggable.setNodeRef;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: setNodeRef
+  }, listeners, attributes, {
+    key: item.component,
+    className: styles['components-item'],
+    onClick: function onClick() {
+      return onComponentClick(item);
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles['icon-wrapper']
+  }, /*#__PURE__*/React.createElement(Icon, {
+    type: item.icon || 'home'
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles['text-content']
+  }, /*#__PURE__*/React.createElement("span", null, item.name)));
+};
 
 /**
  * 组件清单
  */
-var Components = function Components(_ref2) {
-  var _ref2$dataset = _ref2.dataset,
-    dataset = _ref2$dataset === void 0 ? 'test' : _ref2$dataset;
-  var context = useLDContext();
+var Components = function Components(_ref3) {
+  var _ref3$dataset = _ref3.dataset,
+    dataset = _ref3$dataset === void 0 ? 'test' : _ref3$dataset;
+  var context = useContext();
   var onComponentClick = useMemoizedFn(function (data) {
     context.$publisher(context.topics.COMPONENT_SETTING_CLICK, {
       data: data
@@ -95,10 +121,10 @@ var Components = function Components(_ref2) {
     onComponentClick: onComponentClick
   })), /*#__PURE__*/React.createElement(TabPane, {
     tab: formatMessage({
-      id: 'ccm.dev.page.set.components.dataset',
-      label: '数据集字段'
+      id: 'ccm.dev.page.set.components.custom',
+      label: '自定义组件'
     }),
     key: "dataset"
-  })));
+  }, "\u656C\u8BF7\u671F\u5F85")));
 };
 export default Components;

package/es/lowcode/painter/Design.js

@@ -1,328 +1,51 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useRef, useEffect, useState } from 'react';
-import moment from 'moment';
-import classNames from 'classnames';
-import { last, initial } from 'lodash';
+import React, { useRef, useState } from 'react';
 import { RawIntlProvider, getLocale, getIntl, localeInfo } from 'umi';
-import { useEventListener, useSetState, useMemoizedFn, useCreation, useSize } from 'ahooks';
-import { Select, Button, Icon, Divider, ConfigProvider, Dropdown, message } from 'luck-design/antd';
-import { cloneDeep, reverse } from 'lodash';
-import { suid } from '@luck-design-biz/base/utils';
-import { useLDContext } from "../engine/provider/ContextProvider";
+import { useMemoizedFn } from 'ahooks';
+import moment from 'moment';
+import { ConfigProvider } from 'luck-design/antd';
+import DesignToolbar from "./DesignToolbar";
+import DesignOperator from "./DesignOperator";
 import Page from "../view/Page";
-import { add } from "../engine/tools/dataProcess";
-import { CELL_KEY, CELL_CLASS_NAME } from "../constants";
 import styles from "./style/design.less";
-var getOperatorStyle = function getOperatorStyle(page, cellNode) {
-  var _page$getBoundingClie = page.getBoundingClientRect(),
-    pageLeft = _page$getBoundingClie.left,
-    pageTop = _page$getBoundingClie.top;
-  var _cellNode$getBounding = cellNode.getBoundingClientRect(),
-    cellNodeLeft = _cellNode$getBounding.left,
-    cellNodeTop = _cellNode$getBounding.top;
-  return {
-    left: "".concat(cellNodeLeft - pageLeft, "px"),
-    top: "".concat(cellNodeTop - pageTop, "px"),
-    width: "".concat(cellNode.offsetWidth, "px"),
-    height: "".concat(cellNode.offsetHeight, "px")
-  };
-};
 var Design = function Design() {
-  var _selectorRef$current, _localeInfo$locale2;
-  var context = useLDContext();
-  var selectorRef = useRef(null);
+  var _localeInfo$locale;
   var simulatorRef = useRef(null);
-  var size = useSize(simulatorRef);
-  var _useSetState = useSetState({
-      selector: null,
-      detector: null
+  var _useState = useState(function () {
+      return getLocale();
     }),
-    _useSetState2 = _slicedToArray(_useSetState, 2),
-    operatorId = _useSetState2[0],
-    setOperatorId = _useSetState2[1];
-  var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2),
-    langList = _useState2[0],
-    setLangList = _useState2[1];
+    locale = _useState2[0],
+    setLocale = _useState2[1];
   var _useState3 = useState(function () {
-      return getLocale();
+      return getIntl(getLocale(), true);
     }),
     _useState4 = _slicedToArray(_useState3, 2),
-    locale = _useState4[0],
-    setLocale = _useState4[1];
-  var _useState5 = useState(function () {
-      return getIntl(locale, true);
-    }),
-    _useState6 = _slicedToArray(_useState5, 2),
-    intl = _useState6[0],
-    setContainerIntl = _useState6[1];
-  var _useState7 = useState('pc'),
-    _useState8 = _slicedToArray(_useState7, 2),
-    activedTarget = _useState8[0],
-    setActivedTarget = _useState8[1];
-  useEventListener('mousemove', function (event) {
-    var elem = event.target;
-    var targetCell = elem.closest(".".concat(CELL_CLASS_NAME));
-    var targetCellId = targetCell === null || targetCell === void 0 ? void 0 : targetCell.id;
-    if (targetCellId && targetCellId !== operatorId.detector && targetCellId !== operatorId.selector) {
-      setOperatorId({
-        detector: targetCellId
-      });
-      context.$publisher(context.topics.COMPONENT_HOVER, {
-        id: targetCellId
-      });
-    } else if (!targetCell || targetCellId === operatorId.selector) {
-      setOperatorId({
-        detector: null
-      });
-      context.$publisher(context.topics.COMPONENT_HOVER, null);
-    }
-  }, {
-    target: simulatorRef
-  });
-  useEventListener('mouseleave', function () {
-    if (operatorId.detector) {
-      setOperatorId({
-        detector: null
-      });
-      context.$publisher(context.topics.COMPONENT_HOVER, null);
-    }
-  }, {
-    target: simulatorRef
-  });
-  useEventListener('click', function (event) {
-    var elem = event.target;
-    var targetCell = elem.closest(".".concat(CELL_CLASS_NAME));
-    var targetCellId = targetCell === null || targetCell === void 0 ? void 0 : targetCell.id;
-    if (!targetCellId || targetCellId === operatorId.selector) return;
-    context.$publisher(context.topics.COMPONENT_HOVER, null);
-    context.$publisher(context.topics.COMPONENT_ACTIVE, {
-      id: targetCell.id
-    });
-  }, {
-    target: simulatorRef
-  });
-  useEffect(function () {
-    var hcid = context.$subscriber(context.topics.COMPONENT_HOVER).on(function (payload) {
-      if (payload.id) setOperatorId({
-        detector: payload.id
-      });else setOperatorId({
-        detector: null
-      });
-    }).watch();
-    var acid = context.$subscriber(context.topics.COMPONENT_ACTIVE).on(function (payload) {
-      if (payload.id) {
-        setOperatorId({
-          selector: payload.id,
-          detector: null
-        });
-      } else {
-        setOperatorId({
-          selector: null
-        });
-      }
-    }).watch();
-    return function () {
-      context.$unsubscriber(context.topics.COMPONENT_HOVER, hcid);
-      context.$unsubscriber(context.topics.COMPONENT_ACTIVE, acid);
-    };
-  }, [context.pageData]);
-  useEffect(function () {
-    var moid = context.$subscriber(context.topics.MODAL_OPEN).on(function () {
-      simulatorRef.current.style.setProperty('overflow', 'hidden');
-    }).watch();
-    var mcid = context.$subscriber(context.topics.MODAL_CLOSE).on(function () {
-      simulatorRef.current.style.removeProperty('overflow');
-    }).watch();
-    var laid = context.$subscriber(context.topics.LANG_SETTING_SELECT).on(function (_ref) {
-      var _langList = _ref.langList;
-      return setLangList(_langList);
-    }).watch();
-    return function () {
-      context.$unsubscriber(context.topics.MODAL_OPEN, moid);
-      context.$unsubscriber(context.topics.MODAL_CLOSE, mcid);
-      context.$unsubscriber(context.topics.LANG_SETTING_SELECT, laid);
-    };
-  }, []);
-  useEffect(function () {
-    var csid = context.$subscriber(context.topics.COMPONENT_SETTING_CLICK).on(function (_ref2) {
-      var data = _ref2.data;
-      if (!operatorId.selector) {
-        message.info('请在右侧画布选择节点');
-        return;
-      }
-      if (context.componentMap.get(operatorId.selector).dom.getAttribute('name') !== 'box') {
-        message.info('该节点不支持添加子节点');
-        return;
-      }
-      var json = require("../engine/meta/".concat(data.component.toLowerCase(), ".props.default.json"));
-      var _id = "".concat(data.component.toLowerCase(), "_").concat(suid());
-      var cloneData = cloneDeep(context.pageData);
-      add(cloneData, operatorId.selector, _id, json);
-      context._setPageData(cloneData).then(function (newData) {
-        context.$publisher(context.topics.COMPONENT_APPEND, {
-          id: _id,
-          pageData: newData
-        });
-      });
-    }).watch();
-    return function () {
-      return context.$unsubscriber(context.topics.COMPONENT_SETTING_CLICK, csid);
-    };
-  }, [context.pageData]);
-  var getDomById = useMemoizedFn(function (id) {
-    return context.componentMap.get(id).dom;
-  });
-  var handleLangChange = useMemoizedFn(function (locale) {
+    intl = _useState4[0],
+    setIntl = _useState4[1];
+  var handleLangChange = useMemoizedFn(function (_locale) {
     if (moment !== null && moment !== void 0 && moment.locale) {
-      var _localeInfo$locale;
-      moment.locale(((_localeInfo$locale = localeInfo[locale]) === null || _localeInfo$locale === void 0 ? void 0 : _localeInfo$locale.momentLocale) || 'en');
-    }
-    setLocale(locale);
-    setContainerIntl(getIntl(locale));
-  });
-  var acticeProps = useCreation(function () {
-    if (operatorId.selector) {
-      var levelNodes = context.componentMap.get(operatorId.selector).api.getLevelNodes();
-      return {
-        props: last(levelNodes),
-        menu: /*#__PURE__*/React.createElement("div", {
-          className: styles['next-overlay-wrapper'],
-          onMouseLeave: function onMouseLeave() {
-            return handleHover();
-          }
-        }, reverse(initial(levelNodes)).map(function (m) {
-          return /*#__PURE__*/React.createElement("div", {
-            key: m.id
-          }, /*#__PURE__*/React.createElement("span", {
-            onClick: function onClick() {
-              return handleSelect(m.id);
-            },
-            onMouseOver: function onMouseOver() {
-              return handleHover(m.id);
-            }
-          }, m.name));
-        }))
-      };
+      var _localeInfo$_locale;
+      moment.locale(((_localeInfo$_locale = localeInfo[_locale]) === null || _localeInfo$_locale === void 0 ? void 0 : _localeInfo$_locale.momentLocale) || 'en');
     }
-    return null;
-  }, [operatorId.selector]);
-  var handleSelect = useMemoizedFn(function (_key) {
-    context.$publisher(context.topics.COMPONENT_ACTIVE, _key ? {
-      id: _key
-    } : null);
-  });
-  var handleHover = useMemoizedFn(function (_key) {
-    context.$publisher(context.topics.COMPONENT_HOVER, _key ? {
-      id: _key
-    } : null);
-  });
-  var handleDelete = useMemoizedFn(function (_key) {
-    context.$publisher(context.topics.COMPONENT_DELETE, _key ? {
-      id: _key
-    } : null);
+    setLocale(_locale);
+    setIntl(getIntl(_locale));
   });
   return /*#__PURE__*/React.createElement("div", {
     className: styles['lc-painter-design']
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles['lc-painter-design-toolbar']
-  }, /*#__PURE__*/React.createElement(Select, {
-    size: "small",
-    value: langList ? locale : undefined,
-    className: styles['i18n-selecter'],
-    style: {
-      fontSize: 12
-    },
-    onSelect: handleLangChange
-  }, langList === null || langList === void 0 ? void 0 : langList.map(function (item) {
-    return /*#__PURE__*/React.createElement(Select.Option, {
-      key: item.field,
-      value: item.field
-    }, item.title);
-  })), /*#__PURE__*/React.createElement("span", {
-    className: classNames(styles['toolbar-item'], _defineProperty({}, styles.actived, activedTarget === 'pc')),
-    onClick: function onClick() {
-      return setActivedTarget('pc');
-    }
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "laptop"
-  })), /*#__PURE__*/React.createElement("span", {
-    className: classNames(styles['toolbar-item'], _defineProperty({}, styles.actived, activedTarget === 'mobile')),
-    onClick: function onClick() {
-      return setActivedTarget('mobile');
-    }
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "mobile"
-  })), /*#__PURE__*/React.createElement(Divider, {
-    type: "vertical"
-  }), /*#__PURE__*/React.createElement("span", {
-    style: {
-      width: 'auto',
-      fontSize: 12
-    },
-    className: styles['toolbar-item'],
-    onClick: function onClick() {
-      context.$publisher(context.topics.COMPONENT_ACTIVE, {
-        id: CELL_KEY.PAGE_ROOT
-      });
-    }
-  }, "\u9875\u9762\u5C5E\u6027"), /*#__PURE__*/React.createElement(Divider, {
-    type: "vertical"
-  }), /*#__PURE__*/React.createElement(Button, {
-    size: "small",
-    style: {
-      fontSize: 12,
-      margin: '0 2px'
-    }
-  }, "\u9884\u89C8"), /*#__PURE__*/React.createElement(Divider, {
-    type: "vertical"
-  }), /*#__PURE__*/React.createElement(Button, {
-    size: "small",
-    type: "primary",
-    style: {
-      fontSize: 12,
-      margin: '0 0 0 2px'
-    }
-  }, "\u4FDD\u5B58")), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(DesignToolbar, {
+    locale: locale,
+    onLangChange: handleLangChange
+  }), /*#__PURE__*/React.createElement("div", {
     className: styles['lc-painter-design-workspace']
-  }, operatorId.detector && /*#__PURE__*/React.createElement("div", {
-    id: "lc-detector",
-    className: styles['lc-painter-design-detector'],
-    style: getOperatorStyle(simulatorRef.current, getDomById(operatorId.detector))
-  }), operatorId.selector && /*#__PURE__*/React.createElement("div", {
-    id: "lc-selector",
-    ref: selectorRef,
-    key: "".concat((size === null || size === void 0 ? void 0 : size.width) || 0, "-").concat((size === null || size === void 0 ? void 0 : size.height) || 0),
-    className: styles['lc-painter-design-selector'],
-    style: getOperatorStyle(simulatorRef.current, getDomById(operatorId.selector))
-  }, acticeProps && /*#__PURE__*/React.createElement("div", {
-    className: styles['lc-borders-actions'],
-    style: acticeProps.props.id === CELL_KEY.PAGE_ROOT ? {
-      top: 0
-    } : ((_selectorRef$current = selectorRef.current) === null || _selectorRef$current === void 0 ? void 0 : _selectorRef$current.offsetTop) < 23 ? {
-      bottom: '-23px'
-    } : {
-      top: '-23px'
-    }
-  }, /*#__PURE__*/React.createElement(Dropdown, {
-    overlay: acticeProps.menu,
-    placement: "bottomLeft"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "instance-node-selector"
-  }, acticeProps.props.name)), /*#__PURE__*/React.createElement("div", {
-    onClick: function onClick() {
-      return handleDelete(acticeProps.props);
-    }
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "delete"
-  })))), /*#__PURE__*/React.createElement(ConfigProvider, {
-    locale: ((_localeInfo$locale2 = localeInfo[locale]) === null || _localeInfo$locale2 === void 0 ? void 0 : _localeInfo$locale2.antd) || {}
+  }, /*#__PURE__*/React.createElement(DesignOperator, {
+    target: simulatorRef
+  }), /*#__PURE__*/React.createElement(ConfigProvider, {
+    locale: ((_localeInfo$locale = localeInfo[locale]) === null || _localeInfo$locale === void 0 ? void 0 : _localeInfo$locale.antd) || {}
   }, /*#__PURE__*/React.createElement(RawIntlProvider, {
     value: intl
   }, /*#__PURE__*/React.createElement(Page, {
     ref: simulatorRef,
-    pageCode: "mk2i87qb",
     className: styles['lc-painter-design-simulator']
   })))));
 };