tntd
Version:
tntd是基于 TNT Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。
70 lines (69 loc) • 3.06 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.responsiveMap = exports.responsiveArray = exports["default"] = void 0;
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var responsiveArray = exports.responsiveArray = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];
var responsiveMap = exports.responsiveMap = {
xs: '(max-width: 575px)',
sm: '(min-width: 576px)',
md: '(min-width: 768px)',
lg: '(min-width: 992px)',
xl: '(min-width: 1200px)',
xxl: '(min-width: 1600px)'
};
var subscribers = new Map();
var subUid = -1;
var screens = {};
var responsiveObserve = {
matchHandlers: {},
dispatch: function dispatch(pointMap) {
screens = pointMap;
subscribers.forEach(function (func) {
return func(screens);
});
return subscribers.size >= 1;
},
subscribe: function subscribe(func) {
if (!subscribers.size) this.register();
subUid += 1;
subscribers.set(subUid, func);
func(screens);
return subUid;
},
unsubscribe: function unsubscribe(token) {
subscribers["delete"](token);
if (!subscribers.size) this.unregister();
},
unregister: function unregister() {
var _this = this;
Object.keys(responsiveMap).forEach(function (screen) {
var matchMediaQuery = responsiveMap[screen];
var handler = _this.matchHandlers[matchMediaQuery];
handler === null || handler === void 0 ? void 0 : handler.mql.removeListener(handler === null || handler === void 0 ? void 0 : handler.listener);
});
subscribers.clear();
},
register: function register() {
var _this2 = this;
Object.keys(responsiveMap).forEach(function (screen) {
var matchMediaQuery = responsiveMap[screen];
var listener = function listener(_ref) {
var matches = _ref.matches;
_this2.dispatch(Object.assign(Object.assign({}, screens), _defineProperty({}, screen, matches)));
};
var mql = window.matchMedia(matchMediaQuery);
mql.addListener(listener);
_this2.matchHandlers[matchMediaQuery] = {
mql: mql,
listener: listener
};
listener(mql);
});
}
};
var _default = exports["default"] = responsiveObserve;