@varlet/ui 2.10.1 → 2.10.2-alpha.1683284670321

package/lib/varlet.cjs.js

@@ -1029,6 +1029,14 @@ var props$1a = {
     type: Boolean,
     default: true
   },
+  safeArea: {
+    type: Boolean,
+    default: false
+  },
+  safeAreaTop: {
+    type: Boolean,
+    default: false
+  },
   teleport: {
     type: String
   },
@@ -1190,7 +1198,7 @@ const Popup = vue.defineComponent({
     };
     var renderContent = () => {
       return vue.createVNode("div", vue.mergeProps({
-        "class": classes$14(n$1h("content"), n$1h("--" + props2.position), [props2.defaultStyle, n$1h("--content-background-color")], [props2.defaultStyle, n$1h("$-elevation--3")]),
+        "class": classes$14(n$1h("content"), n$1h("--" + props2.position), [props2.defaultStyle, n$1h("--content-background-color")], [props2.defaultStyle, n$1h("$-elevation--3")], [props2.safeArea, n$1h("--safe-area")], [props2.safeAreaTop, n$1h("--safe-area-top")]),
         "style": {
           zIndex: zIndex.value
         }
@@ -1405,6 +1413,7 @@ var props$18 = _extends$m({
   "overlayStyle",
   "lockScroll",
   "closeOnClickOverlay",
+  "safeArea",
   "teleport",
   "onOpen",
   "onClose",
@@ -1705,13 +1714,14 @@ function __render__$1f(_ctx, _cache) {
     vue.mergeProps({
       class: _ctx.n("popup-radius"),
       position: "bottom",
+      show: _ctx.popupShow,
       overlay: _ctx.overlay,
       "overlay-class": _ctx.overlayClass,
       "overlay-style": _ctx.overlayStyle,
       "lock-scroll": _ctx.lockScroll,
       "close-on-click-overlay": _ctx.closeOnClickOverlay,
       teleport: _ctx.teleport,
-      show: _ctx.popupShow
+      "safe-area": _ctx.safeArea
     }, {
       "onUpdate:show": _ctx.handlePopupUpdateShow
     }, {
@@ -1786,7 +1796,7 @@ function __render__$1f(_ctx, _cache) {
       /* FORWARDED */
     },
     16,
-    ["class", "overlay", "overlay-class", "overlay-style", "lock-scroll", "close-on-click-overlay", "teleport", "show", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]
+    ["class", "show", "overlay", "overlay-class", "overlay-style", "lock-scroll", "close-on-click-overlay", "teleport", "safe-area", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]
   );
 }
 var __sfc__$1g = vue.defineComponent({
@@ -15998,7 +16008,7 @@ function _extends$5() {
   return _extends$5.apply(this, arguments);
 }
 function typeValidator$3(type) {
-  return ["text", "password", "number"].includes(type);
+  return ["text", "password", "number", "tel", "email"].includes(type);
 }
 var props$x = _extends$5({
   modelValue: {
@@ -16043,6 +16053,9 @@ var props$x = _extends$5({
   rules: {
     type: Array
   },
+  enterkeyhint: {
+    type: String
+  },
   onFocus: defineListenerProp(),
   onBlur: defineListenerProp(),
   onInput: defineListenerProp(),
@@ -16054,9 +16067,9 @@ var {
   n: n$z,
   classes: classes$t
 } = createNamespace("input");
-var _hoisted_1$e = ["placeholder"];
-var _hoisted_2$9 = ["id", "disabled", "type", "value", "placeholder", "maxlength", "rows"];
-var _hoisted_3$7 = ["id", "disabled", "type", "value", "placeholder", "maxlength"];
+var _hoisted_1$e = ["placeholder", "enterkeyhint"];
+var _hoisted_2$9 = ["id", "disabled", "type", "value", "placeholder", "maxlength", "rows", "enterkeyhint", "inputmode"];
+var _hoisted_3$7 = ["id", "disabled", "type", "value", "placeholder", "maxlength", "enterkeyhint", "inputmode"];
 function __render__$A(_ctx, _cache) {
   var _component_var_field_decorator = vue.resolveComponent("var-field-decorator");
   var _component_var_form_details = vue.resolveComponent("var-form-details");
@@ -16095,7 +16108,7 @@ function __render__$A(_ctx, _cache) {
       {
         "prepend-icon": vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "prepend-icon")]),
         "append-icon": vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "append-icon")]),
-        default: vue.withCtx(() => [_ctx.type === "password" ? (vue.openBlock(), vue.createElementBlock(
+        default: vue.withCtx(() => [_ctx.normalizedType === "password" ? (vue.openBlock(), vue.createElementBlock(
           "input",
           {
             key: 0,
@@ -16103,7 +16116,8 @@ function __render__$A(_ctx, _cache) {
             placeholder: !_ctx.hint ? _ctx.placeholder : void 0,
             style: vue.normalizeStyle({
               "--input-placeholder-color": _ctx.placeholderColor
-            })
+            }),
+            enterkeyhint: _ctx.enterkeyhint
           },
           null,
           14,
@@ -16117,11 +16131,13 @@ function __render__$A(_ctx, _cache) {
             autocomplete: "new-password",
             id: _ctx.id,
             disabled: _ctx.formDisabled || _ctx.disabled || _ctx.formReadonly || _ctx.readonly,
-            type: _ctx.type,
+            type: _ctx.normalizedType,
             value: _ctx.modelValue,
             placeholder: !_ctx.hint ? _ctx.placeholder : void 0,
             maxlength: _ctx.maxlength,
             rows: _ctx.rows,
+            enterkeyhint: _ctx.enterkeyhint,
+            inputmode: _ctx.type === "number" ? "numeric" : void 0,
             style: vue.normalizeStyle({
               color: !_ctx.errorMessage ? _ctx.textColor : void 0,
               caretColor: !_ctx.errorMessage ? _ctx.focusColor : void 0,
@@ -16162,10 +16178,12 @@ function __render__$A(_ctx, _cache) {
             autocomplete: "new-password",
             id: _ctx.id,
             disabled: _ctx.formDisabled || _ctx.disabled || _ctx.formReadonly || _ctx.readonly,
-            type: _ctx.type,
+            type: _ctx.normalizedType,
             value: _ctx.modelValue,
             placeholder: !_ctx.hint ? _ctx.placeholder : void 0,
             maxlength: _ctx.maxlength,
+            enterkeyhint: _ctx.enterkeyhint,
+            inputmode: _ctx.type === "number" ? "numeric" : void 0,
             style: vue.normalizeStyle({
               color: !_ctx.errorMessage ? _ctx.textColor : void 0,
               caretColor: !_ctx.errorMessage ? _ctx.focusColor : void 0,
@@ -16230,7 +16248,7 @@ var __sfc__$B = vue.defineComponent({
     var el = vue.ref(null);
     var isFocus = vue.ref(false);
     var isComposing = vue.ref(false);
-    var type = vue.computed(() => {
+    var normalizedType = vue.computed(() => {
       if (props2.type === "number") {
         return "text";
       }
@@ -16420,7 +16438,7 @@ var __sfc__$B = vue.defineComponent({
       isComposing,
       errorMessage,
       placeholderColor,
-      type,
+      normalizedType,
       cursor,
       maxlengthText,
       formDisabled: form == null ? void 0 : form.disabled,
@@ -17948,7 +17966,7 @@ var props$n = _extends$4({
   onChange: defineListenerProp(),
   onConfirm: defineListenerProp(),
   onCancel: defineListenerProp()
-}, pickProps(props$1a, ["show", "onUpdate:show", "closeOnClickOverlay", "teleport", "onOpen", "onClose", "onOpened", "onClosed", "onClickOverlay", "onRouteChange"]));
+}, pickProps(props$1a, ["show", "onUpdate:show", "closeOnClickOverlay", "teleport", "safeArea", "onOpen", "onClose", "onOpened", "onClosed", "onClickOverlay", "onRouteChange"]));
 var {
   n: n$q,
   classes: classes$l
@@ -17972,6 +17990,7 @@ function __render__$t(_ctx, _cache) {
       closeOnClickOverlay: _ctx.closeOnClickOverlay,
       teleport: _ctx.teleport,
       show: _ctx.show,
+      safeArea: _ctx.safeArea,
       "onUpdate:show": _ctx.handlePopupUpdateShow,
       position: "bottom",
       class: _ctx.n("popup")
@@ -25383,7 +25402,7 @@ const TimePickerSfc = "";
 const TooltipSfc = "";
 const uploader = "";
 const UploaderSfc = "";
-const version = "2.10.1";
+const version = "2.10.2-alpha.1683284670321";
 function install(app) {
   ActionSheet.install && app.use(ActionSheet);
   AppBar.install && app.use(AppBar);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "2.10.1",
+  "version": "2.10.2-alpha.1683284670321",
   "description": "A material like components library",
   "main": "lib/varlet.cjs.js",
   "module": "es/index.mjs",
@@ -46,9 +46,9 @@
     "@popperjs/core": "^2.11.6",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1",
-    "@varlet/icons": "2.10.1",
-    "@varlet/shared": "2.10.1",
-    "@varlet/use": "2.10.1"
+    "@varlet/icons": "2.10.2-alpha.1683284670321",
+    "@varlet/shared": "2.10.2-alpha.1683284670321",
+    "@varlet/use": "2.10.2-alpha.1683284670321"
   },
   "devDependencies": {
     "@types/jest": "^26.0.15",
@@ -63,8 +63,8 @@
     "typescript": "^4.4.4",
     "vue": "3.2.47",
     "vue-router": "4.1.6",
-    "@varlet/cli": "2.10.1",
-    "@varlet/touch-emulator": "2.10.1"
+    "@varlet/cli": "2.10.2-alpha.1683284670321",
+    "@varlet/touch-emulator": "2.10.2-alpha.1683284670321"
   },
   "browserslist": [
     "Chrome >= 54",

package/types/actionSheet.d.ts

@@ -13,6 +13,7 @@ export interface ActionSheetProps extends BasicAttributes {
   lockScroll?: boolean
   closeOnClickAction?: boolean
   closeOnClickOverlay?: boolean
+  safeArea?: boolean
   teleport?: TeleportProps['to']
   onOpen?: ListenerProp<() => void>
   onOpened?: ListenerProp<() => void>
@@ -41,6 +42,7 @@ export interface ActionSheetOptions {
   lockScroll?: boolean
   closeOnClickAction?: boolean
   closeOnClickOverlay?: boolean
+  safeArea?: boolean
   onOpen?: () => void
   onOpened?: () => void
   onClose?: () => void

package/types/input.d.ts

@@ -29,6 +29,7 @@ export interface InputProps extends BasicAttributes {
   autofocus?: boolean
   validateTrigger?: InputValidateTrigger[]
   rules?: Array<(v: string) => any>
+  enterkeyhint?: string
   onFocus?: ListenerProp<(e: Event) => void>
   onBlur?: ListenerProp<(e: Event) => void>
   onClick?: ListenerProp<(e: Event) => void>

package/types/picker.d.ts

@@ -71,6 +71,7 @@ export interface PickerOptions {
   confirmButtonTextColor?: string
   cancelButtonTextColor?: string
   textFormatter?: (text: any, columnIndex: number) => any
+  safeArea?: boolean
   onOpen?: () => void
   onOpened?: () => void
   onClose?: () => void

package/types/popup.d.ts

@@ -14,6 +14,8 @@ export interface PopupProps extends BasicAttributes {
   lockScroll?: boolean
   closeOnClickOverlay?: boolean
   defaultStyle?: boolean
+  safeArea?: boolean
+  safeAreaTop?: boolean
   teleport?: TeleportProps['to']
   onOpen?: ListenerProp<() => void>
   onOpened?: ListenerProp<() => void>