wux-weapp/packages/lib/safe-area/index.js

一套组件化、可复用、易扩展的微信小程序 UI 组件库

"use strict";var _baseComponent=_interopRequireDefault(require("../helpers/baseComponent")),_classNames2=_interopRequireDefault(require("../helpers/libs/classNames")),_styleToCssString=_interopRequireDefault(require("../helpers/libs/styleToCssString")),_safeAreaBehavior=_interopRequireDefault(require("../helpers/mixins/safeAreaBehavior")),_useSafeArea=require("../helpers/hooks/useSafeArea");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _defineProperty(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}var cssVarPattern=/^--/;(0,_baseComponent.default)({behaviors:[_safeAreaBehavior.default],properties:{prefixCls:{type:String,value:"wux-safe-area"},multiple:{type:Number,value:1},wrapStyle:{type:[String,Object],value:""},forceRender:{type:Boolean,value:!1},supports:{type:Boolean,value:!1}},data:{extStyle:""},computed:{classes:["prefixCls, forceRender, supports, safeAreaConfig, isIPhoneX",function(e,t,a,r,s){var o;return{wrap:(0,_classNames2.default)(e,(_defineProperty(o={},"".concat(e,"--position-bottom"),(t||s)&&r.bottom),_defineProperty(o,"".concat(e,"--position-top"),(t||s)&&!r.bottom),_defineProperty(o,"".concat(e,"--supports"),(t||s)&&a),o))}}]},observers:_defineProperty({},"safeAreaConfig, safeAreaStyle, isIPhoneX, multiple, wrapStyle, forceRender, supports",function(){for(var e=arguments.length,t=new Array(e),a=0;a<e;a++)t[a]=arguments[a];var r=t[0],s=t[1],o=t[2],n=t[3],i=t[4],l=t[5],p=t[6];this.updateStyle({safeAreaConfig:r,safeAreaStyle:s,isIPhoneX:o,multiple:n,wrapStyle:i,forceRender:l,supports:p})}),methods:{updateStyle:function(e){var t=e.safeAreaConfig,a=e.safeAreaStyle,r=e.isIPhoneX,s=e.multiple,o=e.wrapStyle,n=e.forceRender,i=e.supports,l=t.bottom?"bottom":t.top?"top":"none",p={},u=_defineProperty({},"--safe-area-multiple",s);if((n||r)&&!i&&["bottom","top"].includes(l)){var f=(0,_useSafeArea.getSafeAreaInset)(a),c="bottom"==l?"paddingBottom":"paddingTop";p[c]="calc(".concat(f[l],"PX * ").concat(s,")"),u["--safe-area-inset-".concat(l)]="".concat(f[l],"PX"),u[c]="calc(var(--safe-area-inset-".concat(l,") * var(--safe-area-multiple))")}var d=(0,_styleToCssString.default)((0,_styleToCssString.default)(p)+(0,_styleToCssString.default)(u,{exclude:cssVarPattern})+(0,_styleToCssString.default)(o));d!==this.data.extStyle&&this.setData({extStyle:d})}},attached:function(){this.updateStyle(this.data)}});