@nocobase/plugin-mobile-client 0.10.0-alpha.2

package/lib/client/core/schema/components/container/Container.js

@@ -0,0 +1,150 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MContainer = void 0;
+function _css() {
+  const data = require("@emotion/css");
+  _css = function _css() {
+    return data;
+  };
+  return data;
+}
+function _react() {
+  const data = require("@formily/react");
+  _react = function _react() {
+    return data;
+  };
+  return data;
+}
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
+    return data;
+  };
+  return data;
+}
+function _react2() {
+  const data = _interopRequireWildcard(require("react"));
+  _react2 = function _react2() {
+    return data;
+  };
+  return data;
+}
+function _reactRouterDom() {
+  const data = require("react-router-dom");
+  _reactRouterDom = function _reactRouterDom() {
+    return data;
+  };
+  return data;
+}
+var _Container = require("./Container.Designer");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const findGrid = (schema, uid) => {
+  return schema.reduceProperties((final, next) => {
+    if (final) return final;
+    if (next['x-component'] === 'MTabBar') {
+      return findGrid(next, uid);
+    }
+    if (next['x-component'] === 'MTabBar.Item' && uid === next['x-uid']) {
+      return next;
+    }
+  });
+};
+const TabContentComponent = () => {
+  const _useParams = (0, _reactRouterDom().useParams)(),
+    name = _useParams.name;
+  const fieldSchema = (0, _react().useFieldSchema)();
+  if (!name) return _react2().default.createElement(_react2().default.Fragment, null);
+  const gridSchema = findGrid(fieldSchema.properties['tabBar'], name.replace('tab_', ''));
+  if (!gridSchema) {
+    return _react2().default.createElement(_reactRouterDom().Navigate, {
+      replace: true,
+      to: "../"
+    });
+  }
+  return _react2().default.createElement(_client().SchemaComponent, {
+    schema: gridSchema
+  });
+};
+const InternalContainer = props => {
+  var _fieldSchema$properti;
+  const Designer = (0, _client().useDesigner)();
+  const fieldSchema = (0, _react().useFieldSchema)();
+  const params = (0, _reactRouterDom().useParams)();
+  const location = (0, _reactRouterDom().useLocation)();
+  const tabBarSchema = fieldSchema === null || fieldSchema === void 0 ? void 0 : (_fieldSchema$properti = fieldSchema.properties) === null || _fieldSchema$properti === void 0 ? void 0 : _fieldSchema$properti['tabBar'];
+  const tabBarCurrentFirstKey = (tabBarSchema === null || tabBarSchema === void 0 ? void 0 : tabBarSchema.properties) ? Object.keys(tabBarSchema.properties)[0] : null;
+  let redirectToUid = null;
+  if (tabBarCurrentFirstKey) {
+    var _tabBarSchema$propert;
+    redirectToUid = tabBarSchema === null || tabBarSchema === void 0 ? void 0 : (_tabBarSchema$propert = tabBarSchema.properties[tabBarCurrentFirstKey]) === null || _tabBarSchema$propert === void 0 ? void 0 : _tabBarSchema$propert['x-uid'];
+  }
+  const tabRoutes = (0, _react2().useMemo)(() => {
+    if (!redirectToUid) {
+      return [];
+    }
+    const locationPath = location.pathname.endsWith('/') ? location.pathname.slice(0, -1) : location.pathname;
+    return [!params.name ? {
+      type: 'redirect',
+      to: `${locationPath}/tab_${redirectToUid}`,
+      from: location.pathname
+    } : null, {
+      type: 'route',
+      path: location.pathname,
+      component: TabContentComponent
+    }].filter(Boolean);
+  }, [redirectToUid, params.name, location.pathname]);
+  return _react2().default.createElement(_client().SortableItem, {
+    eid: "nb-mobile-scroll-wrapper",
+    className: (0, _css().cx)('nb-mobile-container', (0, _css().css)`
+          & > .general-schema-designer > .general-schema-designer-icons {
+            right: unset;
+            left: 2px;
+          }
+          background: #f0f2f5;
+          display: flex;
+          flex-direction: column;
+          width: 100%;
+          height: 100%;
+          overflow-y: scroll;
+          position: initial !important;
+        `)
+  }, _react2().default.createElement(Designer, null), _react2().default.createElement("div", {
+    style: {
+      paddingBottom: tabRoutes.length ? '50px' : '0px'
+    },
+    className: (0, _css().cx)('nb-mobile-container-content')
+  }, tabRoutes.length ? _react2().default.createElement(_client().RouteSwitch, {
+    routes: tabRoutes
+  }) : _react2().default.createElement(_client().SchemaComponent, {
+    filterProperties: schema => {
+      return schema['x-component'] !== 'MTabBar';
+    },
+    schema: fieldSchema
+  })), _react2().default.createElement("div", {
+    className: (0, _css().cx)('nb-mobile-container-tab-bar', (0, _css().css)`
+            & > .general-schema-designer {
+              --nb-designer-top: 20px;
+            }
+            position: absolute;
+            background: #ffffff;
+            width: 100%;
+            bottom: 0;
+            left: 0;
+            z-index: 1000;
+          `)
+  }, _react2().default.createElement(_client().SchemaComponent, {
+    onlyRenderProperties: true,
+    filterProperties: schema => {
+      return schema['x-component'] === 'MTabBar';
+    },
+    schema: fieldSchema
+  })));
+};
+const MContainer = InternalContainer;
+exports.MContainer = MContainer;
+MContainer.Designer = _Container.ContainerDesigner;
+MContainer.displayName = 'MContainer';

package/lib/client/core/schema/components/container/index.d.ts

@@ -0,0 +1 @@
+export * from './Container';

package/lib/client/core/schema/components/container/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Container = require("./Container");
+Object.keys(_Container).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Container[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Container[key];
+    }
+  });
+});

package/lib/client/core/schema/components/header/Header.Designer.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const HeaderDesigner: () => React.JSX.Element;

package/lib/client/core/schema/components/header/Header.Designer.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HeaderDesigner = void 0;
+function _react() {
+  const data = require("@formily/react");
+  _react = function _react() {
+    return data;
+  };
+  return data;
+}
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
+    return data;
+  };
+  return data;
+}
+function _react2() {
+  const data = _interopRequireDefault(require("react"));
+  _react2 = function _react2() {
+    return data;
+  };
+  return data;
+}
+function _antd() {
+  const data = require("@formily/antd");
+  _antd = function _antd() {
+    return data;
+  };
+  return data;
+}
+var _locale = require("../../../../locale");
+var _hooks = require("../../hooks");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const HeaderDesigner = () => {
+  const field = (0, _react().useField)();
+  const _useSchemaPatch = (0, _hooks.useSchemaPatch)(),
+    onUpdateComponentProps = _useSchemaPatch.onUpdateComponentProps;
+  const _useTranslation = (0, _locale.useTranslation)(),
+    t = _useTranslation.t;
+  return _react2().default.createElement(_client().GeneralSchemaDesigner, {
+    draggable: false
+  }, _react2().default.createElement(_client().SchemaSettings.ModalItem, {
+    title: t('Edit info'),
+    components: {
+      Switch: _antd().Switch
+    },
+    initialValues: field.componentProps,
+    schema: {
+      properties: {
+        title: {
+          type: 'string',
+          title: t('Title'),
+          required: true,
+          'x-component': 'Input',
+          'x-decorator': 'FormItem'
+        },
+        showBack: {
+          type: 'boolean',
+          title: t('Display back button'),
+          'x-component': 'Switch',
+          'x-decorator': 'FormItem'
+        }
+      }
+    },
+    onSubmit: onUpdateComponentProps
+  }));
+};
+exports.HeaderDesigner = HeaderDesigner;

package/lib/client/core/schema/components/header/Header.d.ts

@@ -0,0 +1,10 @@
+import { NavBarProps } from 'antd-mobile';
+import React from 'react';
+import { HeaderDesigner } from './Header.Designer';
+export interface HeaderProps extends NavBarProps {
+    title?: string;
+    showBack?: boolean;
+}
+export declare const MHeader: ((props: HeaderProps) => React.JSX.Element) & {
+    Designer: typeof HeaderDesigner;
+};

package/lib/client/core/schema/components/header/Header.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MHeader = void 0;
+function _css() {
+  const data = require("@emotion/css");
+  _css = function _css() {
+    return data;
+  };
+  return data;
+}
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
+    return data;
+  };
+  return data;
+}
+function _antdMobile() {
+  const data = require("antd-mobile");
+  _antdMobile = function _antdMobile() {
+    return data;
+  };
+  return data;
+}
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+  _react = function _react() {
+    return data;
+  };
+  return data;
+}
+function _reactRouterDom() {
+  const data = require("react-router-dom");
+  _reactRouterDom = function _reactRouterDom() {
+    return data;
+  };
+  return data;
+}
+var _Header = require("./Header.Designer");
+function _react2() {
+  const data = require("@formily/react");
+  _react2 = function _react2() {
+    return data;
+  };
+  return data;
+}
+var _locale = require("../../../../locale");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const InternalHeader = props => {
+  const field = (0, _react2().useField)();
+  const _props$field$componen = _objectSpread(_objectSpread({}, props), field === null || field === void 0 ? void 0 : field.componentProps),
+    _props$field$componen2 = _props$field$componen.title,
+    title = _props$field$componen2 === void 0 ? (0, _locale.generateNTemplate)('Untitled') : _props$field$componen2,
+    _props$field$componen3 = _props$field$componen.showBack,
+    showBack = _props$field$componen3 === void 0 ? false : _props$field$componen3;
+  const Designer = (0, _client().useDesigner)();
+  const compile = (0, _client().useCompile)();
+  const compiledTitle = compile(title);
+  const navigate = (0, _reactRouterDom().useNavigate)();
+  (0, _react().useEffect)(() => {
+    // sync title
+    document.title = `${compiledTitle} - NocoBase`;
+  }, [compiledTitle]);
+  return _react().default.createElement(_client().SortableItem, {
+    className: (0, _css().cx)('nb-mobile-header', (0, _css().css)`
+          width: 100%;
+          background: #fff;
+        `)
+  }, _react().default.createElement(_antdMobile().NavBar, {
+    backArrow: showBack,
+    onBack: () => navigate(-1)
+  }, compiledTitle), _react().default.createElement(Designer, null));
+};
+const MHeader = InternalHeader;
+exports.MHeader = MHeader;
+MHeader.Designer = _Header.HeaderDesigner;

package/lib/client/core/schema/components/header/index.d.ts

@@ -0,0 +1 @@
+export * from './Header';

package/lib/client/core/schema/components/header/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Header = require("./Header");
+Object.keys(_Header).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Header[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Header[key];
+    }
+  });
+});

package/lib/client/core/schema/components/index.d.ts

@@ -0,0 +1,6 @@
+export * from './menu';
+export * from './container';
+export * from './tab-bar';
+export * from './page';
+export * from './header';
+export * from './settings';

package/lib/client/core/schema/components/index.js

@@ -0,0 +1,71 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _menu = require("./menu");
+Object.keys(_menu).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _menu[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _menu[key];
+    }
+  });
+});
+var _container = require("./container");
+Object.keys(_container).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _container[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _container[key];
+    }
+  });
+});
+var _tabBar = require("./tab-bar");
+Object.keys(_tabBar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _tabBar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _tabBar[key];
+    }
+  });
+});
+var _page = require("./page");
+Object.keys(_page).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _page[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _page[key];
+    }
+  });
+});
+var _header = require("./header");
+Object.keys(_header).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _header[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _header[key];
+    }
+  });
+});
+var _settings = require("./settings");
+Object.keys(_settings).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _settings[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _settings[key];
+    }
+  });
+});

package/lib/client/core/schema/components/menu/Menu.Designer.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const MenuDesigner: React.FC;

package/lib/client/core/schema/components/menu/Menu.Designer.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuDesigner = void 0;
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
+    return data;
+  };
+  return data;
+}
+function _icons() {
+  const data = require("@ant-design/icons");
+  _icons = function _icons() {
+    return data;
+  };
+  return data;
+}
+function _react() {
+  const data = _interopRequireDefault(require("react"));
+  _react = function _react() {
+    return data;
+  };
+  return data;
+}
+var _locale = require("../../../../locale");
+function _antd() {
+  const data = require("antd");
+  _antd = function _antd() {
+    return data;
+  };
+  return data;
+}
+function _react2() {
+  const data = require("@formily/react");
+  _react2 = function _react2() {
+    return data;
+  };
+  return data;
+}
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const MenuDesigner = props => {
+  const _useTranslation = (0, _locale.useTranslation)(),
+    t = _useTranslation.t;
+  const fieldSchema = (0, _react2().useFieldSchema)();
+  const _useDesignable = (0, _client().useDesignable)(),
+    dn = _useDesignable.dn;
+  const field = (0, _react2().useField)();
+  const schemaSettingsProps = {
+    dn,
+    field,
+    fieldSchema
+  };
+  return _react().default.createElement(_client().SchemaSettings, _objectSpread({
+    title: _react().default.createElement(_antd().Button, {
+      style: {
+        borderColor: 'rgb(241, 139, 98)',
+        color: 'rgb(241, 139, 98)'
+      },
+      icon: _react().default.createElement(_icons().MenuOutlined, null),
+      type: "dashed"
+    }, t('Menu configuration'))
+  }, schemaSettingsProps), _react().default.createElement(_client().SchemaSettings.Remove, {
+    key: "remove",
+    removeParentsIfNoChildren: true,
+    confirm: {
+      title: t('Delete menu block')
+    },
+    breakRemoveOn: {
+      'x-component': 'Grid'
+    }
+  }));
+};
+exports.MenuDesigner = MenuDesigner;

package/lib/client/core/schema/components/menu/Menu.Item.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare const MenuItemDesigner: React.FC;
+export declare const MenuItem: {
+    Designer: typeof MenuItemDesigner;
+};
+export {};

package/lib/client/core/schema/components/menu/Menu.Item.js

@@ -0,0 +1,129 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuItem = void 0;
+function _css() {
+  const data = require("@emotion/css");
+  _css = function _css() {
+    return data;
+  };
+  return data;
+}
+function _react() {
+  const data = require("@formily/react");
+  _react = function _react() {
+    return data;
+  };
+  return data;
+}
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
+    return data;
+  };
+  return data;
+}
+function _antdMobile() {
+  const data = require("antd-mobile");
+  _antdMobile = function _antdMobile() {
+    return data;
+  };
+  return data;
+}
+function _react2() {
+  const data = _interopRequireDefault(require("react"));
+  _react2 = function _react2() {
+    return data;
+  };
+  return data;
+}
+function _reactRouterDom() {
+  const data = require("react-router-dom");
+  _reactRouterDom = function _reactRouterDom() {
+    return data;
+  };
+  return data;
+}
+var _locale = require("../../../../locale");
+var _hooks = require("../../hooks");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const InternalMenuItem = props => {
+  const icon = props.icon,
+    name = props.name;
+  const Designer = (0, _client().useDesigner)();
+  const navigate = (0, _reactRouterDom().useNavigate)();
+  const location = (0, _reactRouterDom().useLocation)();
+  const fieldSchema = (0, _react().useFieldSchema)();
+  const compile = (0, _client().useCompile)();
+  const params = (0, _reactRouterDom().useParams)();
+  const onToPage = () => {
+    const locationPath = location.pathname.endsWith('/') ? location.pathname.slice(0, -1) : location.pathname;
+    navigate(params.name ? `/mobile/${fieldSchema['x-uid']}` : `${locationPath}/${fieldSchema['x-uid']}`);
+  };
+  return _react2().default.createElement(_client().SortableItem, {
+    className: (0, _css().cx)('nb-mobile-menu-item', (0, _css().css)`
+          width: 100%;
+          background: var(--adm-color-background);
+          > .adm-list-item {
+            background: inherit;
+          }
+        `)
+  }, _react2().default.createElement(_antdMobile().List.Item, _objectSpread(_objectSpread({
+    arrow: true,
+    clickable: true
+  }, props), {}, {
+    prefix: _react2().default.createElement(_client().Icon, {
+      type: icon
+    }),
+    onClick: onToPage
+  }), compile(name)), _react2().default.createElement(Designer, null));
+};
+const MenuItemDesigner = () => {
+  const _useTranslation = (0, _locale.useTranslation)(),
+    t = _useTranslation.t;
+  const _useSchemaPatch = (0, _hooks.useSchemaPatch)(),
+    onUpdateComponentProps = _useSchemaPatch.onUpdateComponentProps;
+  const field = (0, _react().useField)();
+  return _react2().default.createElement(_client().GeneralSchemaDesigner, null, _react2().default.createElement(_client().SchemaSettings.ModalItem, {
+    title: t('Edit menu info'),
+    initialValues: field.componentProps,
+    schema: {
+      properties: {
+        name: {
+          type: 'string',
+          title: t('Menu name'),
+          required: true,
+          'x-component': 'Input',
+          'x-decorator': 'FormItem'
+        },
+        icon: {
+          required: true,
+          'x-decorator': 'FormItem',
+          'x-component': 'IconPicker',
+          title: t('Icon'),
+          'x-component-props': {}
+        }
+      }
+    },
+    onSubmit: onUpdateComponentProps
+  }), _react2().default.createElement(_client().SchemaSettings.Remove, {
+    key: "remove",
+    removeParentsIfNoChildren: true,
+    confirm: {
+      title: t('Delete menu item?')
+    },
+    breakRemoveOn: {
+      'x-component': 'MMenu'
+    }
+  }));
+};
+const MenuItem = InternalMenuItem;
+exports.MenuItem = MenuItem;
+MenuItem.Designer = MenuItemDesigner;

package/lib/client/core/schema/components/menu/Menu.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { MenuItem } from './Menu.Item';
+import { MenuDesigner } from './Menu.Designer';
+export declare const MMenu: React.FC<{}> & {
+    Item: typeof MenuItem;
+    Designer: typeof MenuDesigner;
+};