@ebscn/ui 1.0.3-beta.3 → 1.0.3-beta.30

package/cjs/components/toast/toast.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InternalToast = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _icons = require("../icons");
+var _mask = _interopRequireDefault(require("../mask"));
+var _withDefaultProps = require("../../utils/with-default-props");
+var _autoCenter = _interopRequireDefault(require("../auto-center"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var classPrefix = "ebscn-toast";
+var defaultProps = {
+  maskClickable: true,
+  stopPropagation: ['click']
+};
+var InternalToast = function (p) {
+  var props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
+  var maskClickable = props.maskClickable,
+    content = props.content,
+    icon = props.icon,
+    position = props.position;
+  var iconElement = (0, _react.useMemo)(function () {
+    if (icon === null || icon === undefined) return null;
+    switch (icon) {
+      case 'success':
+        return _react.default.createElement(_icons.CheckOnlyIcon, {
+          className: "".concat(classPrefix, "-icon-success")
+        });
+      case 'fail':
+        return _react.default.createElement(_icons.CloseIcon, {
+          className: "".concat(classPrefix, "-icon-fail")
+        });
+      default:
+        return icon;
+    }
+  }, [icon]);
+  var top = (0, _react.useMemo)(function () {
+    switch (position) {
+      case 'top':
+        return '20%';
+      case 'bottom':
+        return '80%';
+      default:
+        return '50%';
+    }
+  }, [position]);
+  return _react.default.createElement(_mask.default, {
+    visible: props.visible,
+    destroyOnClose: true,
+    opacity: 0,
+    disableBodyScroll: !maskClickable,
+    getContainer: props.getContainer,
+    afterClose: props.afterClose,
+    style: __assign({
+      pointerEvents: maskClickable ? 'none' : 'auto'
+    }, props.maskStyle),
+    className: (0, _classnames.default)("".concat(classPrefix, "-mask"), props.maskClassName),
+    stopPropagation: props.stopPropagation
+  }, _react.default.createElement("div", {
+    className: (0, _classnames.default)("".concat(classPrefix, "-wrap"))
+  }, _react.default.createElement("div", {
+    style: {
+      top: top
+    },
+    className: (0, _classnames.default)("".concat(classPrefix, "-main"), icon ? "".concat(classPrefix, "-main-icon") : "".concat(classPrefix, "-main-text"))
+  }, iconElement && _react.default.createElement("div", {
+    className: "".concat(classPrefix, "-icon")
+  }, iconElement), _react.default.createElement(_autoCenter.default, null, content))));
+};
+exports.InternalToast = InternalToast;

package/cjs/components/toast/toast.patch.css

@@ -0,0 +1,11 @@
+.ebscn-toast-mask .ebscn-toast-main {
+  font-size: 15px;
+}
+.ebscn-toast-loading.ebscn-toast-loading {
+  width: 48px;
+  height: 48px;
+  margin: 0 auto 8px;
+}
+.ebscn-toast-loading.ebscn-toast-loading .ebscn-spin-loading-fill {
+  stroke: #ffffff;
+}

package/cjs/global/global.css

@@ -21,7 +21,7 @@
   --ebscn-color-warning: #ff8f1f;
   --ebscn-color-danger: #ff3141;
   --ebscn-color-yellow: #ff9f18;
-  --ebscn-color-wathet: #FDECE9;
+  --ebscn-color-wathet: #fef4f2;
   --ebscn-color-text: #333333;
   --ebscn-color-text-secondary: #666666;
   --ebscn-color-weak: #999999;
@@ -30,7 +30,7 @@
   --ebscn-color-background: #ffffff;
   --ebscn-color-highlight: var(--ebscn-color-danger);
   --ebscn-color-white: #ffffff;
-  --ebscn-color-box: #f5f5f5;
+  --ebscn-color-box: #f8f9fc;
   --ebscn-color-text-light-solid: var(--ebscn-color-white);
   --ebscn-color-text-dark-solid: #000000;
   --ebscn-color-fill-content: var(--ebscn-color-box);
@@ -45,24 +45,39 @@
   --ebscn-color-golden: #b47816;
   --ebscn-color-grey: rgba(0, 0, 0, 0.7);
   --ebscn-color-split-line: #EBEBEB;
+  --ebscn-color-keyboard-bg: #d3d5d8;
+  --ebscn-color-keyboard-key-bg: #fff;
+  --ebscn-color-keyboard-fckey-bg: #adb3bd;
+  --ebscn-color-keyboard-key-bg-active: #e5e5e5;
+  --ebscn-color-keyboard-fckey-bg-active: #9ba1aa;
+  --ebscn-color-keyboard-fckey-border: #888;
+  --ebscn-color-keyboard-key-border: #888;
 }
 html[data-prefers-color-scheme='dark'] {
-  --ebscn-color-primary: #3086ff;
+  --ebscn-color-blue: #4c7cf1;
   --ebscn-color-success: #34b368;
   --ebscn-color-warning: #ffa930;
   --ebscn-color-danger: #ff4a58;
   --ebscn-color-yellow: #ffa930;
   --ebscn-color-orange: #e65a2b;
   --ebscn-color-wathet: #0d2543;
-  --ebscn-color-text: #e6e6e6;
+  --ebscn-color-text: #ebebeb;
   --ebscn-color-text-secondary: #b3b3b3;
-  --ebscn-color-weak: #808080;
+  --ebscn-color-weak: #7a7a7a;
   --ebscn-color-light: #4d4d4d;
   --ebscn-color-border: #2b2b2b;
   --ebscn-color-box: #0a0a0a;
   --ebscn-color-background: #1a1a1a;
   --ebscn-color-background-body: var(--ebscn-color-background);
   --ebscn-border-color: var(--ebscn-color-border);
+  --ebscn-color-split-line: #2B2B2B;
+  --ebscn-color-keyboard-bg: #1a1a1a;
+  --ebscn-color-keyboard-key-bg: #474747;
+  --ebscn-color-keyboard-fckey-bg: #292929;
+  --ebscn-color-keyboard-key-bg-active: #323232;
+  --ebscn-color-keyboard-fckey-bg-active: #252525;
+  --ebscn-color-keyboard-fckey-border: #111;
+  --ebscn-color-keyboard-key-border: #333;
 }
 :root {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

package/cjs/global/theme-dark.css

@@ -1,18 +1,26 @@
 html[data-prefers-color-scheme='dark'] {
-  --ebscn-color-primary: #3086ff;
+  --ebscn-color-blue: #4c7cf1;
   --ebscn-color-success: #34b368;
   --ebscn-color-warning: #ffa930;
   --ebscn-color-danger: #ff4a58;
   --ebscn-color-yellow: #ffa930;
   --ebscn-color-orange: #e65a2b;
   --ebscn-color-wathet: #0d2543;
-  --ebscn-color-text: #e6e6e6;
+  --ebscn-color-text: #ebebeb;
   --ebscn-color-text-secondary: #b3b3b3;
-  --ebscn-color-weak: #808080;
+  --ebscn-color-weak: #7a7a7a;
   --ebscn-color-light: #4d4d4d;
   --ebscn-color-border: #2b2b2b;
   --ebscn-color-box: #0a0a0a;
   --ebscn-color-background: #1a1a1a;
   --ebscn-color-background-body: var(--ebscn-color-background);
   --ebscn-border-color: var(--ebscn-color-border);
+  --ebscn-color-split-line: #2B2B2B;
+  --ebscn-color-keyboard-bg: #1a1a1a;
+  --ebscn-color-keyboard-key-bg: #474747;
+  --ebscn-color-keyboard-fckey-bg: #292929;
+  --ebscn-color-keyboard-key-bg-active: #323232;
+  --ebscn-color-keyboard-fckey-bg-active: #252525;
+  --ebscn-color-keyboard-fckey-border: #111;
+  --ebscn-color-keyboard-key-border: #333;
 }

package/cjs/global/theme-default.css

@@ -21,7 +21,7 @@
   --ebscn-color-warning: #ff8f1f;
   --ebscn-color-danger: #ff3141;
   --ebscn-color-yellow: #ff9f18;
-  --ebscn-color-wathet: #FDECE9;
+  --ebscn-color-wathet: #fef4f2;
   --ebscn-color-text: #333333;
   --ebscn-color-text-secondary: #666666;
   --ebscn-color-weak: #999999;
@@ -30,7 +30,7 @@
   --ebscn-color-background: #ffffff;
   --ebscn-color-highlight: var(--ebscn-color-danger);
   --ebscn-color-white: #ffffff;
-  --ebscn-color-box: #f5f5f5;
+  --ebscn-color-box: #f8f9fc;
   --ebscn-color-text-light-solid: var(--ebscn-color-white);
   --ebscn-color-text-dark-solid: #000000;
   --ebscn-color-fill-content: var(--ebscn-color-box);
@@ -45,4 +45,11 @@
   --ebscn-color-golden: #b47816;
   --ebscn-color-grey: rgba(0, 0, 0, 0.7);
   --ebscn-color-split-line: #EBEBEB;
+  --ebscn-color-keyboard-bg: #d3d5d8;
+  --ebscn-color-keyboard-key-bg: #fff;
+  --ebscn-color-keyboard-fckey-bg: #adb3bd;
+  --ebscn-color-keyboard-key-bg-active: #e5e5e5;
+  --ebscn-color-keyboard-fckey-bg-active: #9ba1aa;
+  --ebscn-color-keyboard-fckey-border: #888;
+  --ebscn-color-keyboard-key-border: #888;
 }

package/cjs/index.d.ts

@@ -20,6 +20,7 @@ export { default as PickerView } from './components/picker-view';
 export { default as Popup } from './components/popup';
 export { default as ProSelector } from './components/pro-selector';
 export { default as Protocal } from './components/protocol';
+export { default as Popover } from './components/popover';
 export { default as PullToRefresh } from './components/pull-to-refresh';
 export { default as Radio } from './components/radio';
 export { default as SafeArea } from './components/safe-area';
@@ -36,3 +37,6 @@ export { default as Tabs } from './components/tabs';
 export { default as Tip } from './components/tip';
 export { default as ToastLoading } from './components/toastLoading';
 export { default as Input } from './components/input';
+export { default as InfiniteScroll } from './components/infinite-scroll';
+export { default as List } from './components/list';
+export { default as Toast } from './components/toast';

package/cjs/index.js

@@ -26,6 +26,7 @@ var _exportNames = {
   Popup: true,
   ProSelector: true,
   Protocal: true,
+  Popover: true,
   PullToRefresh: true,
   Radio: true,
   SafeArea: true,
@@ -41,7 +42,10 @@ var _exportNames = {
   Tabs: true,
   Tip: true,
   ToastLoading: true,
-  Input: true
+  Input: true,
+  InfiniteScroll: true,
+  List: true,
+  Toast: true
 };
 Object.defineProperty(exports, "AlphabetKeyboard", {
   enumerable: true,
@@ -103,12 +107,24 @@ Object.defineProperty(exports, "ImageViewer", {
     return _imageViewer.default;
   }
 });
+Object.defineProperty(exports, "InfiniteScroll", {
+  enumerable: true,
+  get: function () {
+    return _infiniteScroll.default;
+  }
+});
 Object.defineProperty(exports, "Input", {
   enumerable: true,
   get: function () {
     return _input.default;
   }
 });
+Object.defineProperty(exports, "List", {
+  enumerable: true,
+  get: function () {
+    return _list.default;
+  }
+});
 Object.defineProperty(exports, "MarketTag", {
   enumerable: true,
   get: function () {
@@ -157,6 +173,12 @@ Object.defineProperty(exports, "PickerView", {
     return _pickerView.default;
   }
 });
+Object.defineProperty(exports, "Popover", {
+  enumerable: true,
+  get: function () {
+    return _popover.default;
+  }
+});
 Object.defineProperty(exports, "Popup", {
   enumerable: true,
   get: function () {
@@ -265,6 +287,12 @@ Object.defineProperty(exports, "Tip", {
     return _tip.default;
   }
 });
+Object.defineProperty(exports, "Toast", {
+  enumerable: true,
+  get: function () {
+    return _toast.default;
+  }
+});
 Object.defineProperty(exports, "ToastLoading", {
   enumerable: true,
   get: function () {
@@ -304,6 +332,7 @@ var _pickerView = _interopRequireDefault(require("./components/picker-view"));
 var _popup = _interopRequireDefault(require("./components/popup"));
 var _proSelector = _interopRequireDefault(require("./components/pro-selector"));
 var _protocol = _interopRequireDefault(require("./components/protocol"));
+var _popover = _interopRequireDefault(require("./components/popover"));
 var _pullToRefresh = _interopRequireDefault(require("./components/pull-to-refresh"));
 var _radio = _interopRequireDefault(require("./components/radio"));
 var _safeArea = _interopRequireDefault(require("./components/safe-area"));
@@ -320,4 +349,7 @@ var _tabs = _interopRequireDefault(require("./components/tabs"));
 var _tip = _interopRequireDefault(require("./components/tip"));
 var _toastLoading = _interopRequireDefault(require("./components/toastLoading"));
 var _input = _interopRequireDefault(require("./components/input"));
+var _infiniteScroll = _interopRequireDefault(require("./components/infinite-scroll"));
+var _list = _interopRequireDefault(require("./components/list"));
+var _toast = _interopRequireDefault(require("./components/toast"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/es/components/alphabet-keyboard/alphabet-keyboard.css

@@ -1,3 +1,39 @@
+:root {
+  --ebscn-color-keyboard-bg: #d3d5d8;
+  --ebscn-color-keyboard-key-bg: #fff;
+  --ebscn-color-keyboard-fckey-bg: #adb3bd;
+  --ebscn-color-keyboard-key-bg-active: #E5E5E5;
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-keybord {
+  background: url(../../assets/images/keybord_keybord_dark.png) var(--ebscn-color-keyboard-fckey-bg) no-repeat center;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-keybord:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-delete {
+  background: url(../../assets/images/delete_dark.png) var(--ebscn-color-keyboard-fckey-bg) no-repeat center;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-delete:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-shift {
+  background: url(../../assets/images/keybord_shift_dark.png) var(--ebscn-color-keyboard-fckey-bg) no-repeat center;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-shift:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-shift-big {
+  background: url(../../assets/images/keybord_shift2_dark.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
+}
 .ebscn-alphabet-keyboard {
   position: fixed;
   bottom: 0;
@@ -7,35 +43,40 @@
   width: 100%;
   transition: all 0.5s;
   align-content: flex-start;
-  background: #d2d5db;
-}
-.ebscn-alphabet-keyboard-darkkey {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 11.2%;
-  height: 42px;
-  border-radius: 5px;
-  box-shadow: 0px 0.5px 0px 0px #888888;
-  background: #adb3bd;
-  font-size: var(--ebscn-font-size-9);
-}
-.ebscn-alphabet-keyboard-darkkey:active {
-  background: #adb3bd;
+  background-color: #fff;
+  background-color: var(--ebscn-color-keyboard-bg);
 }
 .ebscn-alphabet-keyboard-shift {
   margin-right: 3.73%;
-  background: url(../../assets/images/keybord_shift.png) #adb3bd no-repeat center;
+  background: url(../../assets/images/keybord_shift.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
   background-size: 17px 17px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
+}
+.ebscn-alphabet-keyboard-shift-big {
+  background: url(../../assets/images/keybord_shift2.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
 }
 .ebscn-alphabet-keyboard-delete {
   margin-left: 2.26%;
-  background: url(../../assets/images/delete.png) #adb3bd no-repeat center;
-  background-size: 24px 24px;
+  background: url(../../assets/images/delete.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-keybord {
-  background: url(../../assets/images/keybord_keybord.png) #adb3bd no-repeat center;
-  background-size: 24px 18px;
+  background: url(../../assets/images/keybord_keybord.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 18px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-space {
   display: flex;
@@ -43,12 +84,16 @@
   justify-content: center;
   width: 48.4%;
   height: 42px;
-  background: var(--ebscn-color-white);
   border-radius: 5px;
-  box-shadow: 0px 0.5px 0px 0px #888888;
+  font-size: 16px;
+  background-color: #fff;
+  background: var(--ebscn-color-keyboard-key-bg);
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-space:active {
-  background: var(--ebscn-color-border);
+  background-color: #e5e5e5;
+  background-color: var(--ebscn-color-keyboard-key-bg-active);
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firstline,
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-secondline,
@@ -57,7 +102,7 @@
   display: flex;
   justify-content: space-between;
   width: 100%;
-  padding-top: 3.2%;
+  padding-top: calc(3% - 1px);
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firstline-key,
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-secondline-key,
@@ -66,39 +111,57 @@
   display: flex;
   align-items: center;
   justify-content: center;
+  flex: 1;
   width: 8.4%;
-  height: 42px;
-  background: var(--ebscn-color-white);
+  height: 40px;
+  background-color: #fff;
+  background: var(--ebscn-color-keyboard-key-bg);
   border-radius: 5px;
-  box-shadow: 0px 0.5px 0px 0px #888888;
   font-size: 23px;
   font-weight: 400;
   text-align: center;
+  color: #333;
   color: var(--ebscn-color-text);
-  margin-right: 1.6%;
+  margin: 0 3px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firstline-key:active,
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-secondline-key:active,
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-thirdline-key:active,
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firthline-key:active {
-  background: var(--ebscn-color-border);
+  background-color: #e5e5e5;
+  background-color: var(--ebscn-color-keyboard-key-bg-active);
+}
+.ebscn-alphabet-keyboard-darkkey {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 11.2%;
+  height: 42px;
+  border-radius: 5px;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  font-size: var(--ebscn-font-size-9);
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-fckey-border);
 }
-.ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firstline {
-  padding-left: 0.8%;
-  padding-right: 0.8%;
+.ebscn-alphabet-keyboard-darkkey:active {
+  background-color: #252525;
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-secondline {
   padding-left: 5.73%;
   padding-right: 5.73%;
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-thirdline {
-  padding-left: 0.8%;
-  padding-right: 0.8%;
+  padding-left: 3px;
+  padding-right: 3px;
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firthline {
-  padding-left: 0.8%;
-  padding-right: 0.8%;
-  padding-bottom: 1.06%;
+  padding-left: 3px;
+  padding-right: 3px;
+  padding-bottom: 6px;
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firthline-confirm {
   display: flex;
@@ -106,24 +169,26 @@
   justify-content: center;
   width: 23.46%;
   height: 42px;
-  background: var(--ebscn-color-primary);
+  background-color: #e84225;
+  background-color: var(--ebscn-color-primary);
   border-radius: 5px;
-  box-shadow: 0px 0.5px 0px 0px #888888;
   font-size: 16px;
   font-weight: 400;
   text-align: center;
-  color: var(--ebscn-color-white);
+  color: #fff;
   line-height: 22.5px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firthline-confirm:active {
-  background-color: #D03B21;
+  background-color: #d13c21;
 }
 .ebscn-alphabet-keyboard .ebscn-alphabet-keyboard-firthline img {
   height: 20%;
 }
 @supports (bottom: env(safe-area-inset-bottom)) or (constant(safe-area-inset-bottom)) {
   .ebscn-alphabet-keyboard {
-    height: calc(216px + env(safe-area-inset-bottom));
-    height: calc(216px + constant(safe-area-inset-bottom));
+    height: calc(223px + env(safe-area-inset-bottom));
+    height: calc(223px + constant(safe-area-inset-bottom));
   }
 }

package/es/components/alphabet-keyboard/alphabet-keyboard.js

@@ -1,5 +1,4 @@
-import { useEffect, useRef, useState } from "react";
-import React from "react";
+import React, { useEffect, useRef, useState } from 'react';
 import { withNativeProps } from '../../utils/native-props';
 import { mergeProps } from '../../utils/with-default-props';
 var classPrefix = 'ebscn-alphabet-keyboard';
@@ -107,12 +106,11 @@ export function AlphabetKeyboard(p) {
   }, (isBig == false ? thirdKeys : thirdKeysBig).map(function (item, index) {
     return React.createElement("div", {
       key: item || index,
-      className: item == '↑' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-shift") : item == '×' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-delete") : "".concat(classPrefix, "-thirdline-key"),
+      className: item == '↑' && isBig ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-shift ").concat(classPrefix, "-shift-big") : item == '↑' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-shift") : item == '×' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-delete") : "".concat(classPrefix, "-thirdline-key"),
       onClick: function () {
         if (visible) {
           onKeyPress(item);
         }
-        ;
       }
     }, imgKeys.includes(item) ? '' : item);
   })), React.createElement("div", {

package/es/components/button/selectorButton.css

@@ -3,9 +3,11 @@
   display: flex;
   justify-content: center;
   align-items: center;
+  font-size: 14px;
 }
 .ebscn-selectorbutton-icon {
   margin-left: 4px;
+  font-size: 12px;
   display: flex;
   align-items: center;
   transition: transform 0.5s;

package/es/components/button/selectorButton.js

@@ -141,9 +141,5 @@ export var SelectorButton = function (p) {
     onClick: handleClick
   }, props.children, React.createElement("div", {
     className: classNames("".concat(classPrefix, "-icon"), (_a = {}, _a["".concat(classPrefix, "-icon-active")] = props.active && props.autoRotate, _a))
-  }, props.icon ? props.icon : React.createElement(SelectorIcon, {
-    style: {
-      fontSize: '14px'
-    }
-  }))));
+  }, props.icon ? props.icon : React.createElement(SelectorIcon, null))));
 };

package/es/components/card/card.css

@@ -3,7 +3,7 @@
 }
 .ebscn-card-module {
   border-radius: 16px;
-  padding: 16px;
+  padding: 16px 16px;
   margin: 0 0 12px 0;
 }
 .ebscn-card-block {

package/es/components/card/card.js

@@ -9,7 +9,7 @@ export default function Card(props) {
       return null;
     }
     return React.createElement("div", {
-      className: cns("".concat(classPrefix, "-header"), "".concat(classPrefix, "-").concat(props.type, "-header"), props.headerClassName),
+      className: cns("".concat(classPrefix, "-header"), "".concat(typeClassName, "-header"), props.headerClassName),
       style: props.headerStyle,
       onClick: props.onHeaderClick
     }, React.createElement("div", {
@@ -21,7 +21,7 @@ export default function Card(props) {
       return null;
     }
     return React.createElement("div", {
-      className: cns("".concat(classPrefix, "-body"), "".concat(classPrefix, "-").concat(props.type, "-body"), props.bodyClassName),
+      className: cns("".concat(classPrefix, "-body"), "".concat(typeClassName, "-body"), props.bodyClassName),
       style: props.bodyStyle,
       onClick: props.onBodyClick
     }, props.children);