amssui 1.0.19 → 1.0.22

package/es/index.d.ts

@@ -1,2 +1,4 @@
 export type { ButtonModalProps } from './button-modal';
 export { default as ButtonModal } from './button-modal';
+export type { MenuNavIconProps } from './menu-nav-icon-button';
+export { default as MenuNavIconButton } from './menu-nav-icon-button';

package/es/index.js

@@ -1 +1,2 @@
-export { default as ButtonModal } from './button-modal';
+export { default as ButtonModal } from './button-modal';
+export { default as MenuNavIconButton } from './menu-nav-icon-button';

package/es/menu-nav-icon-button/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare type MenuNavIconProps = {
+    onChange?: (status: boolean) => void;
+    onClick?: () => void;
+    status?: boolean;
+};
+declare const MenuNavIconButton: React.FC<MenuNavIconProps>;
+export default MenuNavIconButton;

package/es/menu-nav-icon-button/index.js

@@ -0,0 +1,61 @@
+var __read = this && this.__read || function (o, n) {
+  var m = typeof Symbol === "function" && o[Symbol.iterator];
+  if (!m) return o;
+  var i = m.call(o),
+      r,
+      ar = [],
+      e;
+
+  try {
+    while ((n === void 0 || n-- > 0) && !(r = i.next()).done) {
+      ar.push(r.value);
+    }
+  } catch (error) {
+    e = {
+      error: error
+    };
+  } finally {
+    try {
+      if (r && !r.done && (m = i["return"])) m.call(i);
+    } finally {
+      if (e) throw e.error;
+    }
+  }
+
+  return ar;
+};
+
+import { useControllableValue } from 'ahooks';
+import classNames from 'classnames';
+import React from 'react';
+
+var MenuNavIconButton = function MenuNavIconButton(props) {
+  var _onClick = props.onClick;
+
+  var _a = __read(useControllableValue(props, {
+    valuePropName: 'status'
+  }), 2),
+      status = _a[0],
+      setStatus = _a[1];
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames('menu-nav-icon', {
+      open: status
+    }),
+    onClick: function onClick() {
+      var nextStatus = !status;
+      setStatus(nextStatus);
+      _onClick === null || _onClick === void 0 ? void 0 : _onClick();
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "menu-nav-icon-wrap"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "menu-nav-icon-bar"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "menu-nav-icon-bar"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "menu-nav-icon-bar"
+  })));
+};
+
+export default MenuNavIconButton;

package/es/menu-nav-icon-button/style/index.css

@@ -0,0 +1,33 @@
+.menu-nav-icon-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 44px;
+  padding: 9px 10px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+.menu-nav-icon-bar {
+  display: inline-block;
+  width: 22px;
+  height: 2px;
+  margin-top: 4px;
+  background-color: #fff;
+  border-radius: 1px;
+}
+.menu-nav-icon span {
+  display: block;
+  transform: rotate(0deg);
+  transition: 0.25s ease-in-out;
+}
+.menu-nav-icon.open span:nth-child(1) {
+  position: relative;
+  top: 6px;
+  transform: rotate(45deg);
+}
+.menu-nav-icon.open span:nth-child(2) {
+  transform: rotate(-45deg);
+}
+.menu-nav-icon.open span:nth-child(3) {
+  width: 0;
+}

package/es/menu-nav-icon-button/style/index.d.ts

@@ -0,0 +1 @@
+import './index.less';

package/es/menu-nav-icon-button/style/index.js

@@ -0,0 +1 @@
+import './index.less';

package/es/menu-nav-icon-button/style/index.less

@@ -0,0 +1,38 @@
+.menu-nav-icon-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 44px;
+  padding: 9px 10px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+
+.menu-nav-icon-bar {
+  display: inline-block;
+  width: 22px;
+  height: 2px;
+  margin-top: 4px;
+  background-color: #fff;
+  border-radius: 1px;
+}
+
+.menu-nav-icon span {
+  display: block;
+  transform: rotate(0deg);
+  transition: 0.25s ease-in-out;
+}
+
+.menu-nav-icon.open span:nth-child(1) {
+  position: relative;
+  top: 6px;
+  transform: rotate(45deg);
+}
+
+.menu-nav-icon.open span:nth-child(2) {
+  transform: rotate(-45deg);
+}
+
+.menu-nav-icon.open span:nth-child(3) {
+  width: 0;
+}

package/lib/index.d.ts

@@ -1,2 +1,4 @@
 export type { ButtonModalProps } from './button-modal';
 export { default as ButtonModal } from './button-modal';
+export type { MenuNavIconProps } from './menu-nav-icon-button';
+export { default as MenuNavIconButton } from './menu-nav-icon-button';

package/lib/index.js

@@ -9,7 +9,7 @@ var __importDefault = this && this.__importDefault || function (mod) {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ButtonModal = void 0;
+exports.MenuNavIconButton = exports.ButtonModal = void 0;
 
 var button_modal_1 = require("./button-modal");
 
@@ -18,4 +18,13 @@ Object.defineProperty(exports, "ButtonModal", {
   get: function get() {
     return __importDefault(button_modal_1)["default"];
   }
+});
+
+var menu_nav_icon_button_1 = require("./menu-nav-icon-button");
+
+Object.defineProperty(exports, "MenuNavIconButton", {
+  enumerable: true,
+  get: function get() {
+    return __importDefault(menu_nav_icon_button_1)["default"];
+  }
 });

package/lib/menu-nav-icon-button/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare type MenuNavIconProps = {
+    onChange?: (status: boolean) => void;
+    onClick?: () => void;
+    status?: boolean;
+};
+declare const MenuNavIconButton: React.FC<MenuNavIconProps>;
+export default MenuNavIconButton;

package/lib/menu-nav-icon-button/index.js

@@ -0,0 +1,75 @@
+"use strict";
+
+var __read = this && this.__read || function (o, n) {
+  var m = typeof Symbol === "function" && o[Symbol.iterator];
+  if (!m) return o;
+  var i = m.call(o),
+      r,
+      ar = [],
+      e;
+
+  try {
+    while ((n === void 0 || n-- > 0) && !(r = i.next()).done) {
+      ar.push(r.value);
+    }
+  } catch (error) {
+    e = {
+      error: error
+    };
+  } finally {
+    try {
+      if (r && !r.done && (m = i["return"])) m.call(i);
+    } finally {
+      if (e) throw e.error;
+    }
+  }
+
+  return ar;
+};
+
+var __importDefault = this && this.__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var ahooks_1 = require("ahooks");
+
+var classnames_1 = __importDefault(require("classnames"));
+
+var react_1 = __importDefault(require("react"));
+
+var MenuNavIconButton = function MenuNavIconButton(props) {
+  var _onClick = props.onClick;
+
+  var _a = __read((0, ahooks_1.useControllableValue)(props, {
+    valuePropName: 'status'
+  }), 2),
+      status = _a[0],
+      setStatus = _a[1];
+
+  return react_1["default"].createElement("div", {
+    className: (0, classnames_1["default"])('menu-nav-icon', {
+      open: status
+    }),
+    onClick: function onClick() {
+      var nextStatus = !status;
+      setStatus(nextStatus);
+      _onClick === null || _onClick === void 0 ? void 0 : _onClick();
+    }
+  }, react_1["default"].createElement("div", {
+    className: "menu-nav-icon-wrap"
+  }, react_1["default"].createElement("span", {
+    className: "menu-nav-icon-bar"
+  }), react_1["default"].createElement("span", {
+    className: "menu-nav-icon-bar"
+  }), react_1["default"].createElement("span", {
+    className: "menu-nav-icon-bar"
+  })));
+};
+
+exports["default"] = MenuNavIconButton;

package/lib/menu-nav-icon-button/style/index.css

@@ -0,0 +1,33 @@
+.menu-nav-icon-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 44px;
+  padding: 9px 10px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+.menu-nav-icon-bar {
+  display: inline-block;
+  width: 22px;
+  height: 2px;
+  margin-top: 4px;
+  background-color: #fff;
+  border-radius: 1px;
+}
+.menu-nav-icon span {
+  display: block;
+  transform: rotate(0deg);
+  transition: 0.25s ease-in-out;
+}
+.menu-nav-icon.open span:nth-child(1) {
+  position: relative;
+  top: 6px;
+  transform: rotate(45deg);
+}
+.menu-nav-icon.open span:nth-child(2) {
+  transform: rotate(-45deg);
+}
+.menu-nav-icon.open span:nth-child(3) {
+  width: 0;
+}

package/lib/menu-nav-icon-button/style/index.d.ts

@@ -0,0 +1 @@
+import './index.less';

package/lib/menu-nav-icon-button/style/index.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+require("./index.less");

package/lib/menu-nav-icon-button/style/index.less

@@ -0,0 +1,38 @@
+.menu-nav-icon-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 44px;
+  padding: 9px 10px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+
+.menu-nav-icon-bar {
+  display: inline-block;
+  width: 22px;
+  height: 2px;
+  margin-top: 4px;
+  background-color: #fff;
+  border-radius: 1px;
+}
+
+.menu-nav-icon span {
+  display: block;
+  transform: rotate(0deg);
+  transition: 0.25s ease-in-out;
+}
+
+.menu-nav-icon.open span:nth-child(1) {
+  position: relative;
+  top: 6px;
+  transform: rotate(45deg);
+}
+
+.menu-nav-icon.open span:nth-child(2) {
+  transform: rotate(-45deg);
+}
+
+.menu-nav-icon.open span:nth-child(3) {
+  width: 0;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amssui",
-  "version": "1.0.19",
+  "version": "1.0.22",
   "description": "react ui library",
   "author": "jason <usochen@gmail.com>",
   "main": "./lib/index.js",
@@ -31,13 +31,13 @@
   ],
   "dependencies": {
     "@ahooksjs/use-url-state": "^2.5.8",
-    "a-icons": "^1.0.81",
+    "a-icons": "^1.0.83",
     "aa-utils": "^2.0.35",
     "ahooks": "^3.0.8"
   },
   "peerDependencies": {
     "react": "^16.8.6 || ^17.0 || ^18.0",
-    "react-vant": "^2.0.0-alpha.41"
+    "react-vant": "^2.0.0-alpha.41 || ^3.0.0"
   },
   "devDependencies": {
     "@types/enzyme": "^3.10.5",
@@ -48,5 +48,5 @@
     "node": ">=10.0.0"
   },
   "license": "MIT",
-  "gitHead": "b0a0e42e40dc05d01770b43640169dd051bd60f3"
+  "gitHead": "9fdda4197f9bfd225a2fd786ad4c178fe16937a5"
 }