@nocobase/plugin-mobile-client 0.10.1-alpha.1 → 0.11.1-alpha.1

package/lib/client/core/schema/components/page/Page.js

@@ -4,13 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MPage = 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() {
@@ -41,6 +34,8 @@ function _reactRouterDom() {
 }
 var _helpers = require("../../helpers");
 var _Page = require("./Page.Designer");
+var _style = _interopRequireDefault(require("./style"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
@@ -54,20 +49,10 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-const globalActionCSS = (0, _css().css)`
-  #nb-position-container > & {
-    height: 49px;
-    border-top: 1px solid #f0f2f5;
-    margin-bottom: 0px !important;
-    padding: 0 var(--nb-spacing);
-    align-items: center;
-    overflow-x: auto;
-    background: #ffffff;
-    z-index: 100;
-  }
-`;
 const InternalPage = props => {
   var _fieldSchema$properti, _tabsSchema$propertie;
+  const _useStyles = (0, _style.default)(),
+    styles = _useStyles.styles;
   const Designer = (0, _client().useDesigner)();
   const fieldSchema = (0, _react().useFieldSchema)();
   const _useSearchParams = (0, _reactRouterDom().useSearchParams)(),
@@ -80,10 +65,10 @@ const InternalPage = props => {
   let hasGlobalActions = false;
   if (!tabsSchema && fieldSchema.properties) {
     hasGlobalActions = (0, _helpers.countGridCol)(fieldSchema.properties['grid'], 2) === 1;
-  } else if (searchParams.has('tab') && (tabsSchema === null || tabsSchema === void 0 ? void 0 : (_tabsSchema$propertie = tabsSchema.properties) === null || _tabsSchema$propertie === void 0 ? void 0 : _tabsSchema$propertie[searchParams.get('tab')])) {
+  } else if (searchParams.has('tab') && tabsSchema !== null && tabsSchema !== void 0 && (_tabsSchema$propertie = tabsSchema.properties) !== null && _tabsSchema$propertie !== void 0 && _tabsSchema$propertie[searchParams.get('tab')]) {
     var _tabsSchema$propertie2, _tabsSchema$propertie3;
     hasGlobalActions = (0, _helpers.countGridCol)((_tabsSchema$propertie2 = tabsSchema.properties[searchParams.get('tab')]) === null || _tabsSchema$propertie2 === void 0 ? void 0 : (_tabsSchema$propertie3 = _tabsSchema$propertie2.properties) === null || _tabsSchema$propertie3 === void 0 ? void 0 : _tabsSchema$propertie3['grid'], 2) === 1;
-  } else if (tabsSchema === null || tabsSchema === void 0 ? void 0 : tabsSchema.properties) {
+  } else if (tabsSchema !== null && tabsSchema !== void 0 && tabsSchema.properties) {
     const schema = Object.values(tabsSchema.properties).sort((t1, t2) => t1['x-index'] - t2['x-index'])[0];
     if (schema) {
       setTimeout(() => {
@@ -104,7 +89,7 @@ const InternalPage = props => {
         container: (typeof props.active !== 'undefined' ? props.active : true) && onlyInPage ? document.getElementById('nb-position-container') : null,
         forceProps: {
           layout: 'one-column',
-          className: globalActionCSS
+          className: styles.globalActionCSS
         }
       }, props.children));
     }
@@ -112,31 +97,12 @@ const InternalPage = props => {
   }, [hasGlobalActions, onlyInPage]);
   return _react2().default.createElement(_client().SortableItem, {
     eid: "nb-mobile-scroll-wrapper",
-    className: (0, _css().cx)('nb-mobile-page', (0, _css().css)`
-          background: #f0f2f5;
-          display: flex;
-          flex-direction: column;
-          width: 100%;
-          height: 100%;
-          overflow-x: hidden;
-          overflow-y: auto;
-          padding-bottom: var(--nb-spacing);
-        `)
+    className: (0, _client().cx)('nb-mobile-page', styles.mobilePage)
   }, _react2().default.createElement(Designer, _objectSpread({}, fieldSchema === null || fieldSchema === void 0 ? void 0 : fieldSchema['x-designer-props'])), _react2().default.createElement("div", {
     style: {
       paddingBottom: tabsSchema ? null : 'var(--nb-spacing)'
     },
-    className: (0, _css().cx)('nb-mobile-page-header', (0, _css().css)`
-            & > .ant-tabs > .ant-tabs-nav {
-              .ant-tabs-tab {
-                margin: 0 !important;
-                padding: 0 16px !important;
-              }
-              background: #fff;
-            }
-            display: flex;
-            flex-direction: column;
-          `)
+    className: (0, _client().cx)('nb-mobile-page-header', styles.mobilePageHeader)
   }, _react2().default.createElement(_react().RecursionField, {
     schema: fieldSchema,
     filterProperties: s => {

package/lib/client/core/schema/components/page/style.d.ts

@@ -0,0 +1,6 @@
+declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    globalActionCSS: import("antd-style").SerializedStyles;
+    mobilePage: import("antd-style").SerializedStyles;
+    mobilePageHeader: import("antd-style").SerializedStyles;
+}>;
+export default useStyles;

package/lib/client/core/schema/components/page/style.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
+    return data;
+  };
+  return data;
+}
+const useStyles = (0, _client().createStyles)(({
+  token,
+  css
+}) => {
+  return {
+    globalActionCSS: css`
+      #nb-position-container > & {
+        height: ${token.sizeXXL}px;
+        border-top: 1px solid var(--nb-box-bg);
+        margin-bottom: 0px !important;
+        padding: 0 var(--nb-spacing);
+        align-items: center;
+        overflow-x: auto;
+        background: ${token.colorBgContainer};
+        z-index: 100;
+      }
+    `,
+    mobilePage: css`
+      background: var(--nb-box-bg);
+      display: flex;
+      flex-direction: column;
+      width: 100%;
+      height: 100%;
+      overflow-x: hidden;
+      overflow-y: auto;
+      padding-bottom: var(--nb-spacing);
+    `,
+    mobilePageHeader: css`
+      & > .ant-tabs > .ant-tabs-nav {
+        .ant-tabs-tab {
+          margin: 0 !important;
+          padding: 0 ${token.paddingContentHorizontal}px !important;
+        }
+        background: ${token.colorBgContainer};
+      }
+      display: flex;
+      flex-direction: column;
+    `
+  };
+});
+var _default = useStyles;
+exports.default = _default;

package/lib/client/core/schema/components/settings/Settings.js

@@ -4,13 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MSettings = exports.InternalSettings = 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() {
@@ -30,7 +23,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const InternalSettings = () => {
   const Designer = (0, _client().useDesigner)();
   return _react().default.createElement(_client().SortableItem, {
-    className: (0, _css().cx)('nb-mobile-setting', (0, _css().css)`
+    className: (0, _client().cx)('nb-mobile-setting', (0, _client().css)`
           margin-bottom: var(--nb-spacing);
         `)
   }, _react().default.createElement(Designer, null), _react().default.createElement(_client().SettingsMenu, {

package/lib/client/core/schema/components/tab-bar/TabBar.Item.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
 import { TabBarItemProps } from 'antd-mobile';
+import React from 'react';
 export declare const Designer: () => React.JSX.Element;
 export declare const TabBarItem: React.FC<TabBarItemProps> & {
     Designer: typeof Designer;

package/lib/client/core/schema/components/tab-bar/TabBar.Item.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TabBarItem = exports.Designer = void 0;
 function _react() {
-  const data = _interopRequireDefault(require("react"));
+  const data = require("@formily/react");
   _react = function _react() {
     return data;
   };
@@ -18,52 +18,45 @@ function _client() {
   };
   return data;
 }
-var _locale = require("../../../../locale");
 function _react2() {
-  const data = require("@formily/react");
+  const data = _interopRequireDefault(require("react"));
   _react2 = function _react2() {
     return data;
   };
   return data;
 }
+var _locale = require("../../../../locale");
 var _hooks = require("../../hooks");
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
-    return data;
-  };
-  return data;
-}
 var _schema = require("./schema");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const InternalItem = () => {
   // NOTE: nothing to do
   // return <TabBar.Item {...props}></TabBar.Item>;
   const Designer = (0, _client().useDesigner)();
-  return _react().default.createElement(_client().SortableItem, {
-    className: (0, _css().cx)('nb-mobile-tab-bar-item', (0, _css().css)`
+  return _react2().default.createElement(_client().SortableItem, {
+    className: (0, _client().cx)('nb-mobile-tab-bar-item', (0, _client().css)`
           position: absolute !important;
           width: 100%;
           height: 100%;
           top: 0;
           left: 0;
         `)
-  }, _react().default.createElement(Designer, null));
+  }, _react2().default.createElement(Designer, null));
 };
 const Designer = () => {
   const _useTranslation = (0, _locale.useTranslation)(),
     t = _useTranslation.t;
-  const fieldSchema = (0, _react2().useFieldSchema)();
+  const fieldSchema = (0, _react().useFieldSchema)();
   const _useSchemaPatch = (0, _hooks.useSchemaPatch)(),
     onUpdateComponentProps = _useSchemaPatch.onUpdateComponentProps;
-  const field = (0, _react2().useField)();
+  const field = (0, _react().useField)();
   const tabItems = Object.keys(fieldSchema.parent.properties).length;
-  return _react().default.createElement(_client().GeneralSchemaDesigner, null, _react().default.createElement(_client().SchemaSettings.ModalItem, {
+  return _react2().default.createElement(_client().GeneralSchemaDesigner, null, _react2().default.createElement(_client().SchemaSettings.ModalItem, {
     title: t('Edit info'),
     initialValues: field.componentProps,
     schema: _schema.tabItemSchema,
     onSubmit: onUpdateComponentProps
-  }), tabItems > 1 ? _react().default.createElement(_client().SchemaSettings.Remove, {
+  }), tabItems > 1 ? _react2().default.createElement(_client().SchemaSettings.Remove, {
     key: "remove",
     removeParentsIfNoChildren: true,
     confirm: {

package/lib/client/core/schema/components/tab-bar/TabBar.d.ts

@@ -1,5 +1,5 @@
-import { TabBarItem } from './TabBar.Item';
 import React from 'react';
+import { TabBarItem } from './TabBar.Item';
 export declare const InternalTabBar: React.FC;
 export declare const MTabBar: React.FC<{}> & {
     Item: typeof TabBarItem;

package/lib/client/core/schema/components/tab-bar/TabBar.js

@@ -4,24 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MTabBar = exports.InternalTabBar = void 0;
-function _antdMobile() {
-  const data = require("antd-mobile");
-  _antdMobile = function _antdMobile() {
-    return data;
-  };
-  return data;
-}
-var _TabBar = require("./TabBar.Item");
 function _react() {
-  const data = _interopRequireWildcard(require("react"));
+  const data = require("@formily/react");
   _react = function _react() {
     return data;
   };
   return data;
 }
-function _react2() {
-  const data = require("@formily/react");
-  _react2 = function _react2() {
+function _shared() {
+  const data = require("@formily/shared");
+  _shared = function _shared() {
     return data;
   };
   return data;
@@ -33,17 +25,16 @@ function _client() {
   };
   return data;
 }
-var _locale = require("../../../../locale");
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
+function _antdMobile() {
+  const data = require("antd-mobile");
+  _antdMobile = function _antdMobile() {
     return data;
   };
   return data;
 }
-function _shared() {
-  const data = require("@formily/shared");
-  _shared = function _shared() {
+function _react2() {
+  const data = _interopRequireWildcard(require("react"));
+  _react2 = function _react2() {
     return data;
   };
   return data;
@@ -55,8 +46,10 @@ function _reactRouterDom() {
   };
   return data;
 }
-var _schema = require("./schema");
+var _locale = require("../../../../locale");
 var _common = require("../../common");
+var _schema = require("./schema");
+var _TabBar = require("./TabBar.Item");
 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; }
@@ -65,7 +58,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 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 InternalTabBar = props => {
-  const fieldSchema = (0, _react2().useFieldSchema)();
+  const fieldSchema = (0, _react().useFieldSchema)();
   const _useDesignable = (0, _client().useDesignable)(),
     designable = _useDesignable.designable;
   const _useTranslation = (0, _locale.useTranslation)(),
@@ -75,7 +68,7 @@ const InternalTabBar = props => {
   const navigate = (0, _reactRouterDom().useNavigate)();
   const params = (0, _reactRouterDom().useParams)();
   const compile = (0, _client().useCompile)();
-  const onAddTab = (0, _react().useCallback)(values => {
+  const onAddTab = (0, _react2().useCallback)(values => {
     return insertBeforeEnd({
       type: 'void',
       'x-component': 'MTabBar.Item',
@@ -83,17 +76,21 @@ const InternalTabBar = props => {
       'x-designer': 'MTabBar.Item.Designer',
       properties: {
         [(0, _shared().uid)()]: _common.PageSchema
-      }
+      },
+      'x-server-hooks': [{
+        type: 'onSelfSave',
+        method: 'extractTextToLocale'
+      }]
     });
   }, []);
-  return _react().default.createElement(_client().SortableItem, {
-    className: (0, _css().cx)('nb-mobile-tab-bar', (0, _css().css)`
+  return _react2().default.createElement(_client().SortableItem, {
+    className: (0, _client().cx)('nb-mobile-tab-bar', (0, _client().css)`
           position: relative;
           width: 100%;
           display: flex;
           align-items: center;
         `)
-  }, _react().default.createElement(_client().DndContext, null, _react().default.createElement(_antdMobile().TabBar, {
+  }, _react2().default.createElement(_client().DndContext, null, _react2().default.createElement(_antdMobile().TabBar, {
     activeKey: params.name,
     onChange: key => {
       if (key === 'add-tab') {
@@ -102,28 +99,28 @@ const InternalTabBar = props => {
       navigate(`/mobile/${key}`);
     },
     safeArea: true,
-    className: (0, _css().cx)((0, _css().css)`
+    className: (0, _client().cx)((0, _client().css)`
               width: 100%;
             `)
   }, fieldSchema.mapProperties((schema, name) => {
     const cp = schema['x-component-props'];
-    return _react().default.createElement(_antdMobile().TabBar.Item, _objectSpread(_objectSpread({}, cp), {}, {
+    return _react2().default.createElement(_antdMobile().TabBar.Item, _objectSpread(_objectSpread({}, cp), {}, {
       key: `tab_${schema['x-uid']}`,
-      title: _react().default.createElement(_react().default.Fragment, null, compile(cp.title), _react().default.createElement(_client().SchemaComponent, {
+      title: _react2().default.createElement(_react2().default.Fragment, null, t(compile(cp.title)), _react2().default.createElement(_client().SchemaComponent, {
         schema: schema,
         name: name
       })),
-      icon: cp.icon ? _react().default.createElement(_client().Icon, {
+      icon: cp.icon ? _react2().default.createElement(_client().Icon, {
         type: cp.icon
       }) : undefined
     }));
-  }), designable && (!fieldSchema.properties || Object.keys(fieldSchema.properties).length < 5) ? _react().default.createElement(_antdMobile().TabBar.Item, {
-    className: (0, _css().css)`
+  }), designable && (!fieldSchema.properties || Object.keys(fieldSchema.properties).length < 5) ? _react2().default.createElement(_antdMobile().TabBar.Item, {
+    className: (0, _client().css)`
                 .adm-tab-bar-item-icon {
                   height: auto;
                 }
               `,
-    icon: _react().default.createElement(_client().SchemaInitializer.ActionModal, {
+    icon: _react2().default.createElement(_client().SchemaInitializer.ActionModal, {
       title: t('Add tab'),
       onSubmit: onAddTab,
       schema: _schema.tabItemSchema

package/lib/client/core/schema/hooks/useSchemaPatch.js

@@ -18,9 +18,9 @@ function _client() {
   };
   return data;
 }
-function _lodash() {
-  const data = _interopRequireDefault(require("lodash"));
-  _lodash = function _lodash() {
+function _client2() {
+  const data = require("@nocobase/utils/client");
+  _client2 = function _client2() {
     return data;
   };
   return data;
@@ -32,7 +32,6 @@ function _react2() {
   };
   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; }
@@ -44,12 +43,16 @@ const useSchemaPatch = () => {
   const fieldSchema = (0, _react().useFieldSchema)();
   const field = (0, _react().useField)();
   const onUpdateComponentProps = (0, _react2().useCallback)(data => {
-    _lodash().default.set(fieldSchema, 'x-component-props', data);
+    _client2().lodash.set(fieldSchema, 'x-component-props', data);
     field.componentProps = _objectSpread(_objectSpread({}, field.componentProps), data);
     dn.emit('patch', {
       schema: {
         ['x-uid']: fieldSchema['x-uid'],
-        'x-component-props': fieldSchema['x-component-props']
+        'x-component-props': fieldSchema['x-component-props'],
+        'x-server-hooks': [{
+          type: 'onSelfSave',
+          method: 'extractTextToLocale'
+        }]
       }
     });
     dn.refresh();

package/lib/client/core/schema/scopes/grid-card.js

@@ -4,15 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useGridCardBlockProps = exports.useGridCardBlockItemProps = void 0;
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
     return data;
   };
   return data;
 }
 var _InterfaceProvider = require("../../../router/InterfaceProvider");
-const listCss = (0, _css().css)`
+const listCss = (0, _client().css)`
   padding: 0 var(--nb-spacing);
   & > .nb-action-bar {
     padding: unset !important;

package/lib/client/devices/iOS6.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
     return data;
   };
   return data;
@@ -21,7 +21,7 @@ function _react() {
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const iOS6 = props => {
   return _react().default.createElement("div", {
-    className: (0, _css().cx)('nb-mobile-device-ios6', (0, _css().css)(`
+    className: (0, _client().cx)('nb-mobile-device-ios6', (0, _client().css)(`
           display: flex;
           width: 375px;
           height: 667px;

package/lib/client/devices/index.js

@@ -4,21 +4,21 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MobileDevice = void 0;
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function _react() {
+function _client() {
+  const data = require("@nocobase/client");
+  _client = function _client() {
     return data;
   };
   return data;
 }
-var _iOS = _interopRequireDefault(require("./iOS6"));
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
+function _react() {
+  const data = _interopRequireDefault(require("react"));
+  _react = function _react() {
     return data;
   };
   return data;
 }
+var _iOS = _interopRequireDefault(require("./iOS6"));
 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; }
@@ -27,7 +27,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 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 MobileDevice = props => {
   return _react().default.createElement("div", {
-    className: (0, _css().cx)('nb-mobile-device-wrapper', (0, _css().css)`
+    className: (0, _client().cx)('nb-mobile-device-wrapper', (0, _client().css)`
           width: 100%;
           height: 100%;
           display: flex;
@@ -35,7 +35,7 @@ const MobileDevice = props => {
           align-items: center;
         `)
   }, _react().default.createElement(_iOS.default, _objectSpread({
-    className: (0, _css().css)`
+    className: (0, _client().css)`
           box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
         `
   }, props)));

package/lib/client/index.d.ts

@@ -1,3 +1,12 @@
+import { Plugin, RouterManager } from '@nocobase/client';
 import React from 'react';
-declare const _default: React.NamedExoticComponent<object>;
-export default _default;
+export declare class MobileClientPlugin extends Plugin {
+    mobileRouter: RouterManager;
+    load(): Promise<void>;
+    setMobileRouter(): void;
+    getMobileRouterComponent(): React.FC<{
+        BaseLayout?: React.ComponentType;
+    }>;
+    addRoutes(): void;
+}
+export default MobileClientPlugin;