polythene-core
Advanced tools
Comparing version 1.0.0 to 1.1.0
(function (global, factory) { | ||
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : | ||
typeof define === 'function' && define.amd ? define(['exports'], factory) : | ||
(factory((global.polythene = {}))); | ||
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : | ||
typeof define === 'function' && define.amd ? define(['exports'], factory) : | ||
(factory((global.polythene = {}))); | ||
}(this, (function (exports) { 'use strict'; | ||
var isClient = typeof document !== "undefined"; | ||
var isServer = !isClient; | ||
var isClient = typeof document !== "undefined"; | ||
var isServer = !isClient; | ||
var evts = { | ||
"animation": "animationend", | ||
"OAnimation": "oAnimationEnd", | ||
"MozAnimation": "animationend", | ||
"WebkitAnimation": "webkitAnimationEnd" | ||
}; | ||
var evts = { | ||
"animation": "animationend", | ||
"OAnimation": "oAnimationEnd", | ||
"MozAnimation": "animationend", | ||
"WebkitAnimation": "webkitAnimationEnd" | ||
}; | ||
var getAnimationEndEvent = function getAnimationEndEvent() { | ||
if (isClient) { | ||
var el = document.createElement("fakeelement"); | ||
for (var a in evts) { | ||
if (el.style[a] !== undefined) { | ||
return evts[a]; | ||
var getAnimationEndEvent = function getAnimationEndEvent() { | ||
if (isClient) { | ||
var el = document.createElement("fakeelement"); | ||
for (var a in evts) { | ||
if (el.style[a] !== undefined) { | ||
return evts[a]; | ||
} | ||
} | ||
} | ||
} | ||
}; | ||
}; | ||
var Conditional = { | ||
view: function view(vnode, _ref) { | ||
var h = _ref.renderer; | ||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
var attrs = vnode.attrs; | ||
return attrs.permanent || attrs.show ? h(attrs.instance, attrs) : h("span", { className: attrs.placeholderClassName }); | ||
} | ||
}; | ||
var modes = { | ||
hidden: "hidden", | ||
visible: "visible", | ||
exposing: "exposing", | ||
hiding: "hiding" | ||
}; | ||
Conditional.displayName = "Conditional"; | ||
var Conditional = { | ||
getInitialState: function getInitialState(vnode, createStream) { | ||
var attrs = vnode.attrs; | ||
if (!attrs.didHide) { | ||
return {}; | ||
} | ||
var visible = attrs.permanent || attrs.show; | ||
var mode = createStream(attrs.permanent ? modes.visible : visible ? modes.visible : modes.hidden); | ||
return { | ||
mode: mode, | ||
redrawOnUpdate: createStream.merge([mode]) | ||
}; | ||
}, | ||
onUpdate: function onUpdate(_ref) { | ||
var state = _ref.state, | ||
attrs = _ref.attrs; | ||
var r = function r(acc, p) { | ||
return acc[p] = 1, acc; | ||
}; | ||
if (!attrs.didHide) { | ||
return; | ||
} | ||
var mode = state.mode(); | ||
if (attrs.permanent) { | ||
if (mode === modes.visible && attrs.show) { | ||
state.mode(modes.exposing); | ||
} else if (mode === modes.exposing && !attrs.show) { | ||
state.mode(modes.hiding); | ||
} | ||
} else { | ||
// "normal" type | ||
if (mode === modes.hidden && attrs.show) { | ||
state.mode(modes.visible); | ||
} else if (mode === modes.visible && !attrs.show) { | ||
state.mode(modes.hiding); | ||
} | ||
} | ||
}, | ||
view: function view(_ref2, _ref3) { | ||
var state = _ref2.state, | ||
attrs = _ref2.attrs; | ||
var h = _ref3.renderer; | ||
/* | ||
Separately handled props: | ||
- class | ||
- element | ||
*/ | ||
var placeholder = h("span", { className: attrs.placeholderClassName }); | ||
var defaultAttrs = [ | ||
// Universal | ||
"key", "style", "href", "id", | ||
// No didHide callback passed: use normal visibility evaluation | ||
if (!attrs.didHide) { | ||
return attrs.permanent || attrs.inactive || attrs.show ? h(attrs.instance, attrs) : placeholder; | ||
} | ||
// React | ||
"tabIndex", | ||
// else: use didHide to reset the state after hiding | ||
var mode = state.mode(); | ||
var visible = mode !== modes.hidden; | ||
return visible ? h(attrs.instance, _extends({}, attrs, { | ||
didHide: function didHide(args) { | ||
return attrs.didHide(args), state.mode(attrs.permanent ? modes.visible : modes.hidden); | ||
} | ||
}, mode === modes.hiding && { | ||
show: true, | ||
hide: true | ||
})) : placeholder; | ||
} | ||
}; | ||
// Mithril | ||
"tabindex", "oninit", "oncreate", "onupdate", "onbeforeremove", "onremove", "onbeforeupdate"]; | ||
Conditional.displayName = "Conditional"; | ||
var filterSupportedAttributes = function filterSupportedAttributes(attrs) { | ||
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, | ||
_ref$add = _ref.add, | ||
addAttrs = _ref$add === undefined ? [] : _ref$add, | ||
_ref$remove = _ref.remove, | ||
removeAttrs = _ref$remove === undefined ? [] : _ref$remove; | ||
var r = function r(acc, p) { | ||
return acc[p] = 1, acc; | ||
}; | ||
var removeLookup = removeAttrs.reduce(r, {}); | ||
var supported = defaultAttrs.concat(addAttrs).filter(function (item) { | ||
return !removeLookup[item]; | ||
}).reduce(r, {}); | ||
return Object.keys(attrs).reduce(function (acc, key) { | ||
return supported[key] ? acc[key] = attrs[key] : null, acc; | ||
}, {}); | ||
}; | ||
/* | ||
Separately handled props: | ||
- class | ||
- element | ||
*/ | ||
var unpackAttrs = function unpackAttrs(attrs) { | ||
return typeof attrs === "function" ? attrs() : attrs; | ||
}; | ||
var defaultAttrs = [ | ||
// Universal | ||
"key", "style", "href", "id", | ||
var isTouch = isServer ? false : "ontouchstart" in document.documentElement; | ||
// React | ||
"tabIndex", | ||
var pointerStartEvent = isTouch ? "click" : "mousedown"; | ||
// Mithril | ||
"tabindex", "oninit", "oncreate", "onupdate", "onbeforeremove", "onremove", "onbeforeupdate"]; | ||
var pointerEndEvent = isTouch ? "click" : "mouseup"; | ||
var filterSupportedAttributes = function filterSupportedAttributes(attrs) { | ||
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, | ||
_ref$add = _ref.add, | ||
addAttrs = _ref$add === undefined ? [] : _ref$add, | ||
_ref$remove = _ref.remove, | ||
removeAttrs = _ref$remove === undefined ? [] : _ref$remove; | ||
var pointerStartMoveEvent = isTouch ? "touchstart" : "mousedown"; | ||
var removeLookup = removeAttrs.reduce(r, {}); | ||
var supported = defaultAttrs.concat(addAttrs).filter(function (item) { | ||
return !removeLookup[item]; | ||
}).reduce(r, {}); | ||
return Object.keys(attrs).reduce(function (acc, key) { | ||
return supported[key] ? acc[key] = attrs[key] : null, acc; | ||
}, {}); | ||
}; | ||
var pointerMoveEvent = isTouch ? "touchmove" : "mousemove"; | ||
var unpackAttrs = function unpackAttrs(attrs) { | ||
return typeof attrs === "function" ? attrs() : attrs; | ||
}; | ||
var pointerEndMoveEvent = isTouch ? "touchend" : "mouseup"; | ||
var isTouch = isServer ? false : "ontouchstart" in document.documentElement; | ||
if (isClient) { | ||
document.querySelector("html").classList.add(isTouch ? "pe-touch" : "pe-no-touch"); | ||
} | ||
var pointerStartEvent = isTouch ? "click" : "mousedown"; | ||
var listeners = {}; | ||
var pointerEndEvent = isTouch ? "click" : "mouseup"; | ||
// https://gist.github.com/Eartz/fe651f2fadcc11444549 | ||
var throttle = function throttle(func) { | ||
var s = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0.05; | ||
var context = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : isClient ? window : {}; | ||
var pointerStartMoveEvent = isTouch ? "touchstart" : "mousedown"; | ||
var wait = false; | ||
return function () { | ||
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { | ||
args[_key] = arguments[_key]; | ||
} | ||
var pointerMoveEvent = isTouch ? "touchmove" : "mousemove"; | ||
var later = function later() { | ||
return func.apply(context, args); | ||
}; | ||
if (!wait) { | ||
later(); | ||
wait = true; | ||
setTimeout(function () { | ||
return wait = false; | ||
}, s); | ||
} | ||
}; | ||
}; | ||
var pointerEndMoveEvent = isTouch ? "touchend" : "mouseup"; | ||
var subscribe = function subscribe(eventName, listener, delay) { | ||
listeners[eventName] = listeners[eventName] || []; | ||
listeners[eventName].push(delay ? throttle(listener, delay) : listener); | ||
}; | ||
var unsubscribe = function unsubscribe(eventName, listener) { | ||
if (!listeners[eventName]) { | ||
return; | ||
if (isClient) { | ||
document.querySelector("html").classList.add(isTouch ? "pe-touch" : "pe-no-touch"); | ||
} | ||
var index = listeners[eventName].indexOf(listener); | ||
if (index > -1) { | ||
listeners[eventName].splice(index, 1); | ||
} | ||
}; | ||
var emit = function emit(eventName, event) { | ||
if (!listeners[eventName]) { | ||
return; | ||
} | ||
listeners[eventName].forEach(function (listener) { | ||
return listener(event); | ||
}); | ||
}; | ||
var listeners = {}; | ||
if (isClient) { | ||
window.addEventListener("resize", function (e) { | ||
return emit("resize", e); | ||
}); | ||
window.addEventListener("scroll", function (e) { | ||
return emit("scroll", e); | ||
}); | ||
window.addEventListener("keydown", function (e) { | ||
return emit("keydown", e); | ||
}); | ||
window.addEventListener(pointerEndEvent, function (e) { | ||
return emit(pointerEndEvent, e); | ||
}); | ||
} | ||
// https://gist.github.com/Eartz/fe651f2fadcc11444549 | ||
var throttle = function throttle(func) { | ||
var s = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0.05; | ||
var context = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : isClient ? window : {}; | ||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
var wait = false; | ||
return function () { | ||
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { | ||
args[_key] = arguments[_key]; | ||
} | ||
/* | ||
Helper module to manage multiple items of the same component type. | ||
*/ | ||
var Multi = function Multi(_ref) { | ||
var mOptions = _ref.options, | ||
renderer = _ref.renderer; | ||
var items = []; // This is shared between all instances of a type (Dialog, Notification, ...) | ||
var current = void 0; | ||
var getInitialState = function getInitialState(vnode, createStream) { | ||
current = createStream(null); | ||
return { | ||
current: current, | ||
redrawOnUpdate: createStream.merge([current]) | ||
var later = function later() { | ||
return func.apply(context, args); | ||
}; | ||
if (!wait) { | ||
later(); | ||
wait = true; | ||
setTimeout(function () { | ||
return wait = false; | ||
}, s); | ||
} | ||
}; | ||
}; | ||
/* | ||
@param e: { id, eventName } | ||
*/ | ||
var onChange = function onChange(e) { | ||
if (!current) { | ||
console.error("Cannot set state. Did you set a root element like Dialog to show instances?"); // eslint-disable-line no-console | ||
} | ||
current(e.id); | ||
emit(mOptions.name, e); | ||
var subscribe = function subscribe(eventName, listener, delay) { | ||
listeners[eventName] = listeners[eventName] || []; | ||
listeners[eventName].push(delay ? throttle(listener, delay) : listener); | ||
}; | ||
var itemIndex = function itemIndex(id) { | ||
var item = findItem(id); | ||
return items.indexOf(item); | ||
}; | ||
var removeItem = function removeItem(id) { | ||
var index = itemIndex(id); | ||
if (index !== -1) { | ||
items.splice(index, 1); | ||
onChange({ id: id, name: "removeItem" }); | ||
var unsubscribe = function unsubscribe(eventName, listener) { | ||
if (!listeners[eventName]) { | ||
return; | ||
} | ||
}; | ||
var replaceItem = function replaceItem(id, newItem) { | ||
var index = itemIndex(id); | ||
if (index !== -1) { | ||
items[index] = newItem; | ||
var index = listeners[eventName].indexOf(listener); | ||
if (index > -1) { | ||
listeners[eventName].splice(index, 1); | ||
} | ||
}; | ||
var findItem = function findItem(id) { | ||
// traditional for loop for IE10 | ||
for (var i = 0; i < items.length; i++) { | ||
if (items[i].instanceId === id) { | ||
return items[i]; | ||
} | ||
var emit = function emit(eventName, event) { | ||
if (!listeners[eventName]) { | ||
return; | ||
} | ||
listeners[eventName].forEach(function (listener) { | ||
return listener(event); | ||
}); | ||
}; | ||
var next = function next() { | ||
if (items.length) { | ||
items[0].show = true; | ||
} | ||
onChange({ id: items.length ? items[0].instanceId : null, name: "next" }); | ||
}; | ||
if (isClient) { | ||
window.addEventListener("resize", function (e) { | ||
return emit("resize", e); | ||
}); | ||
window.addEventListener("scroll", function (e) { | ||
return emit("scroll", e); | ||
}); | ||
window.addEventListener("keydown", function (e) { | ||
return emit("keydown", e); | ||
}); | ||
window.addEventListener(pointerEndEvent, function (e) { | ||
return emit(pointerEndEvent, e); | ||
}); | ||
} | ||
var remove = function remove() { | ||
var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId; | ||
var _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
if (mOptions.queue) { | ||
items.shift(); | ||
next(); | ||
} else { | ||
removeItem(instanceId); | ||
} | ||
}; | ||
var Multi = function Multi(_ref) { | ||
var mOptions = _ref.options, | ||
renderer = _ref.renderer; | ||
var removeAll = function removeAll() { | ||
items.length = 0; | ||
onChange({ id: null, name: "removeAll" }); | ||
}; | ||
var setPauseState = function setPauseState(pause, instanceId) { | ||
var item = findItem(instanceId); | ||
if (item) { | ||
item.pause = pause; | ||
item.unpause = !pause; | ||
onChange({ id: instanceId, name: pause ? "pause" : "unpause" }); | ||
} | ||
}; | ||
var items = []; // This is shared between all instances of a type (Dialog, Notification, ...) | ||
var current = void 0; | ||
var createItem = function createItem(itemAttrs, instanceId, spawn) { | ||
var resolveShow = void 0; | ||
var resolveHide = void 0; | ||
var attrs = unpackAttrs(itemAttrs); | ||
var getInitialState = function getInitialState(vnode, createStream) { | ||
current = createStream(null); | ||
return { | ||
current: current, | ||
redrawOnUpdate: createStream.merge([current]) | ||
}; | ||
}; | ||
var didShow = function didShow() { | ||
if (attrs.didShow) { | ||
attrs.didShow(instanceId); | ||
/* | ||
@param e: { id, eventName } | ||
*/ | ||
var onChange = function onChange(e) { | ||
if (!current) { | ||
console.error("Cannot set state. Did you set a root element like Dialog to show instances?"); // eslint-disable-line no-console | ||
} | ||
onChange({ id: instanceId, name: "didShow" }); | ||
return resolveShow(instanceId); | ||
current(e.id); | ||
emit(mOptions.name, e); | ||
}; | ||
var showPromise = new Promise(function (resolve) { | ||
return resolveShow = resolve; | ||
}); | ||
var didHide = function didHide() { | ||
if (attrs.didHide) { | ||
attrs.didHide(instanceId); | ||
var itemIndex = function itemIndex(id) { | ||
var item = findItem(id); | ||
return items.indexOf(item); | ||
}; | ||
var removeItem = function removeItem(id) { | ||
var index = itemIndex(id); | ||
if (index !== -1) { | ||
items.splice(index, 1); | ||
onChange({ id: id, name: "removeItem" }); | ||
} | ||
onChange({ id: instanceId, name: "didHide" }); | ||
remove(instanceId); | ||
return resolveHide(instanceId); | ||
}; | ||
var hidePromise = new Promise(function (resolve) { | ||
return resolveHide = resolve; | ||
}); | ||
var replaceItem = function replaceItem(id, newItem) { | ||
var index = itemIndex(id); | ||
if (index !== -1) { | ||
items[index] = newItem; | ||
} | ||
}; | ||
return _extends({}, mOptions, { | ||
instanceId: instanceId, | ||
spawn: spawn, | ||
attrs: itemAttrs, | ||
show: mOptions.queue ? false : true, | ||
showPromise: showPromise, | ||
hidePromise: hidePromise, | ||
didShow: didShow, | ||
didHide: didHide | ||
}); | ||
}; | ||
var findItem = function findItem(id) { | ||
// traditional for loop for IE10 | ||
for (var i = 0; i < items.length; i++) { | ||
if (items[i].instanceId === id) { | ||
return items[i]; | ||
} | ||
} | ||
}; | ||
var count = function count() { | ||
return items.length; | ||
}; | ||
var pause = function pause() { | ||
var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId; | ||
return setPauseState(true, instanceId); | ||
}; | ||
var unpause = function unpause() { | ||
var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId; | ||
return setPauseState(false, instanceId); | ||
}; | ||
var next = function next() { | ||
if (items.length) { | ||
items[0].show = true; | ||
} | ||
onChange({ id: items.length ? items[0].instanceId : null, name: "next" }); | ||
}; | ||
var show = function show() { | ||
var attrs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
var spawnOpts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
var remove = function remove() { | ||
var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId; | ||
var instanceId = spawnOpts.id || mOptions.defaultId; | ||
var spawn = spawnOpts.spawn || mOptions.defaultId; | ||
var item = createItem(attrs, instanceId, spawn); | ||
onChange({ id: instanceId, name: "show" }); | ||
if (mOptions.queue) { | ||
items.push(item); | ||
if (items.length === 1) { | ||
if (mOptions.queue) { | ||
items.shift(); | ||
next(); | ||
} else { | ||
removeItem(instanceId); | ||
} | ||
} else { | ||
var storedItem = findItem(instanceId); | ||
if (!storedItem) { | ||
}; | ||
var removeAll = function removeAll() { | ||
items.length = 0; | ||
onChange({ id: null, name: "removeAll" }); | ||
}; | ||
var setPauseState = function setPauseState(pause, instanceId) { | ||
var item = findItem(instanceId); | ||
if (item) { | ||
item.pause = pause; | ||
item.unpause = !pause; | ||
onChange({ id: instanceId, name: pause ? "pause" : "unpause" }); | ||
} | ||
}; | ||
var createItem = function createItem(itemAttrs, instanceId, spawn) { | ||
var resolveShow = void 0; | ||
var resolveHide = void 0; | ||
var attrs = unpackAttrs(itemAttrs); | ||
var didShow = function didShow() { | ||
if (attrs.didShow) { | ||
attrs.didShow(instanceId); | ||
} | ||
onChange({ id: instanceId, name: "didShow" }); | ||
return resolveShow(instanceId); | ||
}; | ||
var showPromise = new Promise(function (resolve) { | ||
return resolveShow = resolve; | ||
}); | ||
var didHide = function didHide() { | ||
if (attrs.didHide) { | ||
attrs.didHide(instanceId); | ||
} | ||
onChange({ id: instanceId, name: "didHide" }); | ||
remove(instanceId); | ||
return resolveHide(instanceId); | ||
}; | ||
var hidePromise = new Promise(function (resolve) { | ||
return resolveHide = resolve; | ||
}); | ||
return _extends$1({}, mOptions, { | ||
instanceId: instanceId, | ||
spawn: spawn, | ||
attrs: itemAttrs, | ||
show: mOptions.queue ? false : true, | ||
showPromise: showPromise, | ||
hidePromise: hidePromise, | ||
didShow: didShow, | ||
didHide: didHide | ||
}); | ||
}; | ||
var count = function count() { | ||
return items.length; | ||
}; | ||
var pause = function pause() { | ||
var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId; | ||
return setPauseState(true, instanceId); | ||
}; | ||
var unpause = function unpause() { | ||
var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId; | ||
return setPauseState(false, instanceId); | ||
}; | ||
var show = function show() { | ||
var attrs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
var spawnOpts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
var instanceId = spawnOpts.id || mOptions.defaultId; | ||
var spawn = spawnOpts.spawn || mOptions.defaultId; | ||
var item = createItem(attrs, instanceId, spawn); | ||
onChange({ id: instanceId, name: "show" }); | ||
if (mOptions.queue) { | ||
items.push(item); | ||
if (items.length === 1) { | ||
next(); | ||
} | ||
} else { | ||
replaceItem(instanceId, item); | ||
var storedItem = findItem(instanceId); | ||
if (!storedItem) { | ||
items.push(item); | ||
} else { | ||
replaceItem(instanceId, item); | ||
} | ||
} | ||
} | ||
return item.showPromise; | ||
}; | ||
return item.showPromise; | ||
}; | ||
var hide = function hide() { | ||
var spawnOpts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
var hide = function hide() { | ||
var spawnOpts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
var instanceId = spawnOpts.id || mOptions.defaultId; | ||
var item = mOptions.queue && items.length ? items[0] : findItem(instanceId); | ||
if (item) { | ||
item.hide = true; | ||
} | ||
onChange({ id: instanceId, name: "hide" }); | ||
return item ? item.hidePromise : Promise.resolve(instanceId); | ||
}; | ||
var instanceId = spawnOpts.id || mOptions.defaultId; | ||
var item = mOptions.queue && items.length ? items[0] : findItem(instanceId); | ||
if (item) { | ||
item.hide = true; | ||
} | ||
onChange({ id: instanceId, name: "hide" }); | ||
return item ? item.hidePromise : Promise.resolve(instanceId); | ||
}; | ||
var clear = removeAll; | ||
var clear = removeAll; | ||
var view = function view(_ref2) { | ||
var attrs = _ref2.attrs; | ||
var view = function view(_ref2) { | ||
var attrs = _ref2.attrs; | ||
var spawn = attrs.spawn || mOptions.defaultId; | ||
var candidates = items.filter(function (item) { | ||
return item.show && item.spawn === spawn; | ||
}); | ||
if (mOptions.htmlShowClass && isClient && document.documentElement) { | ||
document.documentElement.classList[candidates.length ? "add" : "remove"](mOptions.htmlShowClass); | ||
} | ||
return !candidates.length ? renderer(mOptions.placeholder) // placeholder because we cannot return null | ||
: renderer(mOptions.holderSelector, { | ||
className: attrs.position === "container" ? "pe-multiple--container" : "pe-multiple--screen" | ||
}, candidates.map(function (itemData) { | ||
return renderer(mOptions.instance, _extends({}, { | ||
key: itemData.key, | ||
instanceId: itemData.instanceId, | ||
transitions: mOptions.transitions, | ||
holderSelector: mOptions.holderSelector, | ||
className: mOptions.className, | ||
showInstance: itemData.show, | ||
hideInstance: itemData.hide, | ||
pauseInstance: itemData.pause, | ||
unpauseInstance: itemData.unpause, | ||
multipleDidShow: itemData.didShow, | ||
multipleDidHide: itemData.didHide, | ||
multipleClear: clear | ||
}, unpackAttrs(itemData.attrs))); | ||
})); | ||
}; | ||
var spawn = attrs.spawn || mOptions.defaultId; | ||
var candidates = items.filter(function (item) { | ||
return item.show && item.spawn === spawn; | ||
}); | ||
if (mOptions.htmlShowClass && isClient && document.documentElement) { | ||
document.documentElement.classList[candidates.length ? "add" : "remove"](mOptions.htmlShowClass); | ||
} | ||
return !candidates.length ? renderer(mOptions.placeholder) // placeholder because we cannot return null | ||
: renderer(mOptions.holderSelector, { | ||
className: attrs.position === "container" ? "pe-multiple--container" : "pe-multiple--screen" | ||
}, candidates.map(function (itemData) { | ||
return renderer(mOptions.instance, _extends$1({}, { | ||
key: itemData.key, | ||
spawnId: spawn, | ||
instanceId: itemData.instanceId, | ||
transitions: mOptions.transitions, | ||
holderSelector: mOptions.holderSelector, | ||
className: mOptions.className, | ||
show: itemData.show, | ||
hide: itemData.hide, | ||
pause: itemData.pause, | ||
unpause: itemData.unpause, | ||
fromMultipleDidShow: itemData.didShow, | ||
fromMultipleDidHide: itemData.didHide, | ||
fromMultipleClear: clear | ||
}, unpackAttrs(itemData.attrs))); | ||
})); | ||
}; | ||
return { | ||
clear: clear, | ||
count: count, | ||
getInitialState: getInitialState, | ||
hide: hide, | ||
pause: pause, | ||
remove: remove, | ||
show: show, | ||
unpause: unpause, | ||
view: view | ||
return { | ||
clear: clear, | ||
count: count, | ||
getInitialState: getInitialState, | ||
hide: hide, | ||
pause: pause, | ||
remove: remove, | ||
show: show, | ||
unpause: unpause, | ||
view: view | ||
}; | ||
}; | ||
}; | ||
Multi.displayName = "Multi"; | ||
Multi.displayName = "Multi"; | ||
/* | ||
Generic show/hide transition module | ||
*/ | ||
var _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
// defaults | ||
var SHOW_DURATION = .220; // default dialog timing | ||
var HIDE_DURATION = .200; // default dialog timing | ||
var SHOW_DELAY = 0; | ||
var HIDE_DELAY = 0; | ||
var TRANSITION = "both"; | ||
// defaults | ||
var DEFAULT_DURATION = .240; | ||
var DEFAULT_DELAY = 0; | ||
// const TRANSITION = "both"; | ||
// See: transition | ||
var show = function show(opts) { | ||
return transition(opts, "show"); | ||
}; | ||
// See: transition | ||
var show = function show(opts) { | ||
return transition(opts, "show"); | ||
}; | ||
var hide = function hide(opts) { | ||
return transition(opts, "hide"); | ||
}; | ||
var hide = function hide(opts) { | ||
return transition(opts, "hide"); | ||
}; | ||
var getTiming = function getTiming(opts, state, showAttr, hideAttr, defaultShowTiming, defaultHideTiming) { | ||
var transition = opts.transition || TRANSITION; | ||
if (transition === "none") { | ||
return 0; | ||
} else if (transition === "show" && state === "hide") { | ||
return 0; | ||
} else if (transition === "hide" && state === "show") { | ||
return 0; | ||
} else { | ||
// both | ||
return state === "show" ? opts[showAttr] !== undefined ? opts[showAttr] : defaultShowTiming : opts[hideAttr] !== undefined ? opts[hideAttr] : defaultHideTiming; | ||
} | ||
}; | ||
var computedStyleDurationToMs = function computedStyleDurationToMs(durationStr) { | ||
var parsed = parseFloat(durationStr) * (durationStr.indexOf("ms") === -1 ? 1000 : 1); | ||
return isNaN(parsed) ? 0 : parsed; | ||
}; | ||
/* | ||
opts: | ||
- transition | ||
- showDuration | ||
- hideDuration | ||
/* | ||
opts: | ||
- el | ||
- duration | ||
- delay | ||
- showClass | ||
- before | ||
- show | ||
- hide | ||
- after | ||
- timingFunction | ||
- state (show, hide) | ||
*/ | ||
var getDuration = function getDuration(opts, state) { | ||
return getTiming(opts, state, "showDuration", "hideDuration", SHOW_DURATION, HIDE_DURATION); | ||
}; | ||
- state (show, hide) | ||
*/ | ||
var transition = function transition(opts, state) { | ||
var el = opts.el; | ||
if (!el) { | ||
return Promise.resolve(); | ||
} else { | ||
return new Promise(function (resolve) { | ||
var style = el.style; | ||
var computedStyle = isClient ? window.getComputedStyle(el) : {}; | ||
var duration = opts.hasDuration ? opts.duration * 1000.0 : computedStyleDurationToMs(computedStyle.transitionDuration); | ||
var delay = opts.hasDelay ? opts.delay * 1000.0 : computedStyleDurationToMs(computedStyle.transitionDelay); | ||
var timingFunction = opts.timingFunction || computedStyle.transitionTimingFunction; | ||
/* | ||
opts: | ||
- transition (show, hide, both) | ||
- showDelay | ||
- hideDelay | ||
var before = opts.before && state === "show" ? function () { | ||
style.transitionDuration = "0ms"; | ||
style.transitionDelay = "0ms"; | ||
opts.before(); | ||
} : opts.before && state === "hide" ? function () { | ||
style.transitionDuration = "0ms"; | ||
style.transitionDelay = "0ms"; | ||
opts.before(); | ||
} : null; | ||
- state (show, hide) | ||
*/ | ||
var getDelay = function getDelay(opts, state) { | ||
return getTiming(opts, state, "showDelay", "hideDelay", SHOW_DELAY, HIDE_DELAY); | ||
}; | ||
var after = opts.after ? function () { | ||
return opts.after(); | ||
} : null; | ||
/* | ||
opts: | ||
- el | ||
- duration | ||
- delay | ||
- showClass | ||
- beforeShow | ||
- show | ||
- hide | ||
- afterHide | ||
- showDelay | ||
- hideDelay | ||
var applyTransition = function applyTransition() { | ||
style.transitionDuration = duration + "ms"; | ||
style.transitionDelay = delay + "ms"; | ||
- state (show, hide) | ||
*/ | ||
var transition = function transition(opts, state) { | ||
var el = opts.el; | ||
if (!el) { | ||
return Promise.resolve(); | ||
} else { | ||
return new Promise(function (resolve) { | ||
var transitionDuration = getDuration(opts, state) * 1000; | ||
var delay = getDelay(opts, state) * 1000; | ||
var style = el.style; | ||
var beforeTransition = opts.beforeShow && state === "show" ? function () { | ||
style.transitionDuration = "0ms"; | ||
style.transitionDelay = "0ms"; | ||
opts.beforeShow(); | ||
} : null; | ||
if (timingFunction) { | ||
style.transitionTimingFunction = timingFunction; | ||
} | ||
if (opts.showClass) { | ||
el.classList[state === "show" ? "add" : "remove"](opts.showClass); | ||
} | ||
if (opts.transition) { | ||
opts.transition(); | ||
} | ||
}; | ||
var afterTransition = opts.afterHide && state === "hide" ? function () { | ||
return opts.afterHide(); | ||
} : null; | ||
var doTransition = function doTransition() { | ||
applyTransition(); | ||
setTimeout(function () { | ||
if (after) { | ||
after(); | ||
} | ||
resolve(); | ||
}, duration + delay); | ||
}; | ||
var applyTransition = function applyTransition() { | ||
style.transitionDuration = transitionDuration + "ms"; | ||
style.transitionDelay = delay + "ms"; | ||
if (opts.showClass) { | ||
el.classList[state === "show" ? "add" : "remove"](opts.showClass); | ||
} | ||
if (opts.show && typeof opts.show === "function" && state === "show") { | ||
opts.show(); | ||
} | ||
if (opts.hide && typeof opts.hide === "function" && state === "hide") { | ||
opts.hide(); | ||
} | ||
}; | ||
var doTransition = function doTransition() { | ||
applyTransition(); | ||
setTimeout(function () { | ||
if (afterTransition) { | ||
afterTransition(); | ||
var maybeDelayTransition = function maybeDelayTransition() { | ||
if (duration === 0) { | ||
doTransition(); | ||
} else { | ||
setTimeout(doTransition, 0); | ||
} | ||
resolve(); | ||
}, transitionDuration + delay); | ||
}; | ||
}; | ||
var maybeDelayTransition = function maybeDelayTransition() { | ||
if (transitionDuration === 0) { | ||
doTransition(); | ||
if (before) { | ||
before(); | ||
el.offsetHeight; // force reflow | ||
setTimeout(function () { | ||
maybeDelayTransition(); | ||
}, 0); | ||
} else { | ||
setTimeout(doTransition, 0); | ||
maybeDelayTransition(); | ||
} | ||
}; | ||
}); | ||
} | ||
}; | ||
if (beforeTransition) { | ||
beforeTransition(); | ||
el.offsetHeight; // force reflow | ||
setTimeout(function () { | ||
maybeDelayTransition(); | ||
}, 0); | ||
} else { | ||
maybeDelayTransition(); | ||
var transitionComponent = function transitionComponent(_ref) { | ||
var isShow = _ref.isShow, | ||
state = _ref.state, | ||
attrs = _ref.attrs, | ||
domElements = _ref.domElements, | ||
beforeTransition = _ref.beforeTransition, | ||
afterTransition = _ref.afterTransition, | ||
showClass = _ref.showClass; | ||
if (state.transitioning()) { | ||
return Promise.resolve(); | ||
} | ||
state.transitioning(true); | ||
state.visible(isShow ? true : false); | ||
if (beforeTransition) { | ||
beforeTransition(); | ||
} | ||
var duration = attrs[isShow ? "showDuration" : "hideDuration"]; | ||
var delay = attrs[isShow ? "showDelay" : "hideDelay"]; | ||
var timingFunction = attrs[isShow ? "showTimingFunction" : "hideTimingFunction"]; | ||
var transitions = attrs.transitions; | ||
var fn = isShow ? show : hide; | ||
var opts1 = _extends$2({}, attrs, domElements, { | ||
showClass: showClass, | ||
duration: duration, | ||
delay: delay, | ||
timingFunction: timingFunction | ||
}); | ||
var opts2 = _extends$2({}, opts1, transitions && transitions[isShow ? "show" : "hide"](opts1)); | ||
var opts3 = _extends$2({}, opts2, { | ||
duration: opts2.duration !== undefined ? opts2.duration : DEFAULT_DURATION, | ||
hasDuration: opts2.duration !== undefined, | ||
delay: opts2.delay !== undefined ? opts2.delay : DEFAULT_DELAY, | ||
hasDelay: opts2.delay !== undefined | ||
}); | ||
return fn(opts3).then(function () { | ||
var id = state.instanceId; | ||
if (attrs[isShow ? "fromMultipleDidShow" : "fromMultipleDidHide"]) { | ||
attrs[isShow ? "fromMultipleDidShow" : "fromMultipleDidHide"](id); // when used with Multiple; this will call attrs.didShow / attrs.didHide | ||
} else if (attrs[isShow ? "didShow" : "didHide"]) { | ||
attrs[isShow ? "didShow" : "didHide"](id); // when used directly | ||
} | ||
if (afterTransition) { | ||
afterTransition(); | ||
} | ||
state.transitioning(false); | ||
}); | ||
} | ||
}; | ||
}; | ||
exports.getAnimationEndEvent = getAnimationEndEvent; | ||
exports.Conditional = Conditional; | ||
exports.filterSupportedAttributes = filterSupportedAttributes; | ||
exports.unpackAttrs = unpackAttrs; | ||
exports.isClient = isClient; | ||
exports.isServer = isServer; | ||
exports.isTouch = isTouch; | ||
exports.pointerStartEvent = pointerStartEvent; | ||
exports.pointerEndEvent = pointerEndEvent; | ||
exports.pointerStartMoveEvent = pointerStartMoveEvent; | ||
exports.pointerMoveEvent = pointerMoveEvent; | ||
exports.pointerEndMoveEvent = pointerEndMoveEvent; | ||
exports.Multi = Multi; | ||
exports.show = show; | ||
exports.hide = hide; | ||
exports.throttle = throttle; | ||
exports.subscribe = subscribe; | ||
exports.unsubscribe = unsubscribe; | ||
exports.emit = emit; | ||
var getStyle = function getStyle(_ref) { | ||
var _ref$element = _ref.element, | ||
element = _ref$element === undefined ? document : _ref$element, | ||
selector = _ref.selector, | ||
prop = _ref.prop; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
var el = selector ? element.querySelector(selector) : element; | ||
if (!el) { | ||
return; | ||
} | ||
return el.currentStyle ? el.currentStyle[prop] : window.getComputedStyle ? document.defaultView.getComputedStyle(el, null).getPropertyValue(prop) : null; | ||
}; | ||
var isRTL = function isRTL(_ref2) { | ||
var _ref2$element = _ref2.element, | ||
element = _ref2$element === undefined ? document : _ref2$element, | ||
selector = _ref2.selector; | ||
return getStyle({ element: element, selector: selector, prop: "direction" }) === "rtl"; | ||
}; | ||
var deprecation = function deprecation(component, deprecatedOption, newOption) { | ||
return console.warn(component + ": option '" + deprecatedOption + "' is deprecated and will be removed in later versions. Use '" + newOption + "' instead."); | ||
}; // eslint-disable-line no-console | ||
exports.getAnimationEndEvent = getAnimationEndEvent; | ||
exports.Conditional = Conditional; | ||
exports.filterSupportedAttributes = filterSupportedAttributes; | ||
exports.unpackAttrs = unpackAttrs; | ||
exports.isClient = isClient; | ||
exports.isServer = isServer; | ||
exports.isTouch = isTouch; | ||
exports.pointerStartEvent = pointerStartEvent; | ||
exports.pointerEndEvent = pointerEndEvent; | ||
exports.pointerStartMoveEvent = pointerStartMoveEvent; | ||
exports.pointerMoveEvent = pointerMoveEvent; | ||
exports.pointerEndMoveEvent = pointerEndMoveEvent; | ||
exports.Multi = Multi; | ||
exports.show = show; | ||
exports.hide = hide; | ||
exports.transitionComponent = transitionComponent; | ||
exports.throttle = throttle; | ||
exports.subscribe = subscribe; | ||
exports.unsubscribe = unsubscribe; | ||
exports.emit = emit; | ||
exports.getStyle = getStyle; | ||
exports.isRTL = isRTL; | ||
exports.deprecation = deprecation; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
}))); | ||
//# sourceMappingURL=polythene-core.js.map |
{ | ||
"name": "polythene-core", | ||
"version": "1.0.0", | ||
"version": "1.1.0", | ||
"description": "", | ||
"main": "dist/polythene-core.js", | ||
"main": "dist/polythene-core", | ||
"module": "dist/polythene-core.mjs", | ||
"scripts": { | ||
"clean": "rm -rf dist && mkdir dist", | ||
"clean": "rm -rf dist/*", | ||
"rollup": "../../node_modules/rollup/bin/rollup -c ../../scripts/rollup.umd.js && ../../node_modules/rollup/bin/rollup -c ../../scripts/rollup.es.js", | ||
"build": "yarn run rollup" | ||
"build": "yarn run clean && yarn run rollup" | ||
}, | ||
@@ -12,0 +12,0 @@ "files": [ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Native code
Supply chain riskContains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
81532
6
1111
1