Comparing version 1.2.2 to 1.3.0
@@ -6,2 +6,11 @@ # Change Log | ||
## [1.2.2](https://github.com/daybrush/keycon/compare/keycon@1.2.1...keycon@1.2.2) (2022-07-23) | ||
### :bug: Bug Fix | ||
* add files field ([b8592ae](https://github.com/daybrush/keycon/commit/b8592ae169b8e7fd627551eaabcce81ec2bf4867)) | ||
## [1.2.1](https://github.com/daybrush/keycon/compare/keycon@1.2.0...keycon@1.2.1) (2022-07-23) | ||
@@ -8,0 +17,0 @@ |
import keycon from "./KeyController"; | ||
export * from "./KeyController"; | ||
export * from "./reactive"; | ||
export default keycon; |
@@ -15,5 +15,15 @@ import EventEmitter, { EmitterParam } from "@scena/event-emitter"; | ||
} | ||
declare class KeyController extends EventEmitter<{ | ||
blur: {}; | ||
[key: string]: object; | ||
export interface OnKeydown extends KeyControllerEvent { | ||
} | ||
export interface OnKeyup extends KeyControllerEvent { | ||
} | ||
export interface OnBlur { | ||
} | ||
export interface KeyconEvents { | ||
keydown: OnKeydown; | ||
keyup: OnKeyup; | ||
blur: OnBlur; | ||
} | ||
declare class KeyController extends EventEmitter<KeyconEvents & { | ||
[text: string]: any; | ||
}> { | ||
@@ -20,0 +30,0 @@ private container; |
@@ -7,4 +7,7 @@ /* | ||
repository: git+https://github.com/daybrush/keycon.git | ||
version: 1.2.2 | ||
version: 1.3.0 | ||
*/ | ||
import EventEmitter from '@scena/event-emitter'; | ||
import { removeEvent, isArray, isString, addEvent } from '@daybrush/utils'; | ||
/****************************************************************************** | ||
@@ -49,428 +52,2 @@ Copyright (c) Microsoft Corporation. | ||
/* | ||
Copyright (c) 2018 Daybrush | ||
@name: @daybrush/utils | ||
license: MIT | ||
author: Daybrush | ||
repository: https://github.com/daybrush/utils | ||
@version 1.7.1 | ||
*/ | ||
/** | ||
* get string "object" | ||
* @memberof Consts | ||
* @example | ||
import {OBJECT} from "@daybrush/utils"; | ||
console.log(OBJECT); // "object" | ||
*/ | ||
var OBJECT = "object"; | ||
/** | ||
* get string "string" | ||
* @memberof Consts | ||
* @example | ||
import {STRING} from "@daybrush/utils"; | ||
console.log(STRING); // "string" | ||
*/ | ||
var STRING = "string"; | ||
/** | ||
* Check the type that the value is object. | ||
* @memberof Utils | ||
* @param {string} value - Value to check the type | ||
* @return {} true if the type is correct, false otherwise | ||
* @example | ||
import {isObject} from "@daybrush/utils"; | ||
console.log(isObject({})); // true | ||
console.log(isObject(undefined)); // false | ||
console.log(isObject("")); // false | ||
console.log(isObject(null)); // false | ||
*/ | ||
function isObject(value) { | ||
return value && typeof value === OBJECT; | ||
} | ||
/** | ||
* Check the type that the value is isArray. | ||
* @memberof Utils | ||
* @param {string} value - Value to check the type | ||
* @return {} true if the type is correct, false otherwise | ||
* @example | ||
import {isArray} from "@daybrush/utils"; | ||
console.log(isArray([])); // true | ||
console.log(isArray({})); // false | ||
console.log(isArray(undefined)); // false | ||
console.log(isArray(null)); // false | ||
*/ | ||
function isArray(value) { | ||
return Array.isArray(value); | ||
} | ||
/** | ||
* Check the type that the value is string. | ||
* @memberof Utils | ||
* @param {string} value - Value to check the type | ||
* @return {} true if the type is correct, false otherwise | ||
* @example | ||
import {isString} from "@daybrush/utils"; | ||
console.log(isString("1234")); // true | ||
console.log(isString(undefined)); // false | ||
console.log(isString(1)); // false | ||
console.log(isString(null)); // false | ||
*/ | ||
function isString(value) { | ||
return typeof value === STRING; | ||
} | ||
/** | ||
* Returns the index of the first element in the array that satisfies the provided testing function. | ||
* @function | ||
* @memberof CrossBrowser | ||
* @param - The array `findIndex` was called upon. | ||
* @param - A function to execute on each value in the array until the function returns true, indicating that the satisfying element was found. | ||
* @param - Returns defaultIndex if not found by the function. | ||
* @example | ||
import { findIndex } from "@daybrush/utils"; | ||
findIndex([{a: 1}, {a: 2}, {a: 3}, {a: 4}], ({ a }) => a === 2); // 1 | ||
*/ | ||
function findIndex(arr, callback, defaultIndex) { | ||
if (defaultIndex === void 0) { | ||
defaultIndex = -1; | ||
} | ||
var length = arr.length; | ||
for (var i = 0; i < length; ++i) { | ||
if (callback(arr[i], i, arr)) { | ||
return i; | ||
} | ||
} | ||
return defaultIndex; | ||
} | ||
/** | ||
* Sets up a function that will be called whenever the specified event is delivered to the target | ||
* @memberof DOM | ||
* @param - event target | ||
* @param - A case-sensitive string representing the event type to listen for. | ||
* @param - The object which receives a notification (an object that implements the Event interface) when an event of the specified type occurs | ||
* @param - An options object that specifies characteristics about the event listener. | ||
* @example | ||
import {addEvent} from "@daybrush/utils"; | ||
addEvent(el, "click", e => { | ||
console.log(e); | ||
}); | ||
*/ | ||
function addEvent(el, type, listener, options) { | ||
el.addEventListener(type, listener, options); | ||
} | ||
/** | ||
* removes from the EventTarget an event listener previously registered with EventTarget.addEventListener() | ||
* @memberof DOM | ||
* @param - event target | ||
* @param - A case-sensitive string representing the event type to listen for. | ||
* @param - The EventListener function of the event handler to remove from the event target. | ||
* @param - An options object that specifies characteristics about the event listener. | ||
* @example | ||
import {addEvent, removeEvent} from "@daybrush/utils"; | ||
const listener = e => { | ||
console.log(e); | ||
}; | ||
addEvent(el, "click", listener); | ||
removeEvent(el, "click", listener); | ||
*/ | ||
function removeEvent(el, type, listener, options) { | ||
el.removeEventListener(type, listener, options); | ||
} | ||
/* | ||
Copyright (c) 2019 Daybrush | ||
name: @scena/event-emitter | ||
license: MIT | ||
author: Daybrush | ||
repository: git+https://github.com/daybrush/gesture.git | ||
version: 1.0.5 | ||
*/ | ||
/*! ***************************************************************************** | ||
Copyright (c) Microsoft Corporation. | ||
Permission to use, copy, modify, and/or distribute this software for any | ||
purpose with or without fee is hereby granted. | ||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH | ||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY | ||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, | ||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM | ||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR | ||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR | ||
PERFORMANCE OF THIS SOFTWARE. | ||
***************************************************************************** */ | ||
var __assign = function () { | ||
__assign = Object.assign || function __assign(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); | ||
}; | ||
function __spreadArrays() { | ||
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; | ||
for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; | ||
return r; | ||
} | ||
/** | ||
* Implement EventEmitter on object or component. | ||
*/ | ||
var EventEmitter = | ||
/*#__PURE__*/ | ||
function () { | ||
function EventEmitter() { | ||
this._events = {}; | ||
} | ||
/** | ||
* Add a listener to the registered event. | ||
* @param - Name of the event to be added | ||
* @param - listener function of the event to be added | ||
* @example | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* cosnt emitter = new EventEmitter(); | ||
* | ||
* // Add listener in "a" event | ||
* emitter.on("a", () => { | ||
* }); | ||
* // Add listeners | ||
* emitter.on({ | ||
* a: () => {}, | ||
* b: () => {}, | ||
* }); | ||
*/ | ||
var __proto = EventEmitter.prototype; | ||
__proto.on = function (eventName, listener) { | ||
if (isObject(eventName)) { | ||
for (var name in eventName) { | ||
this.on(name, eventName[name]); | ||
} | ||
} else { | ||
this._addEvent(eventName, listener, {}); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Remove listeners registered in the event target. | ||
* @param - Name of the event to be removed | ||
* @param - listener function of the event to be removed | ||
* @example | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* cosnt emitter = new EventEmitter(); | ||
* | ||
* // Remove all listeners. | ||
* emitter.off(); | ||
* | ||
* // Remove all listeners in "A" event. | ||
* emitter.off("a"); | ||
* | ||
* | ||
* // Remove "listener" listener in "a" event. | ||
* emitter.off("a", listener); | ||
*/ | ||
__proto.off = function (eventName, listener) { | ||
if (!eventName) { | ||
this._events = {}; | ||
} else if (isObject(eventName)) { | ||
for (var name in eventName) { | ||
this.off(name); | ||
} | ||
} else if (!listener) { | ||
this._events[eventName] = []; | ||
} else { | ||
var events = this._events[eventName]; | ||
if (events) { | ||
var index = findIndex(events, function (e) { | ||
return e.listener === listener; | ||
}); | ||
if (index > -1) { | ||
events.splice(index, 1); | ||
} | ||
} | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Add a disposable listener and Use promise to the registered event. | ||
* @param - Name of the event to be added | ||
* @param - disposable listener function of the event to be added | ||
* @example | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* cosnt emitter = new EventEmitter(); | ||
* | ||
* // Add a disposable listener in "a" event | ||
* emitter.once("a", () => { | ||
* }); | ||
* | ||
* // Use Promise | ||
* emitter.once("a").then(e => { | ||
* }); | ||
*/ | ||
__proto.once = function (eventName, listener) { | ||
var _this = this; | ||
if (listener) { | ||
this._addEvent(eventName, listener, { | ||
once: true | ||
}); | ||
} | ||
return new Promise(function (resolve) { | ||
_this._addEvent(eventName, resolve, { | ||
once: true | ||
}); | ||
}); | ||
}; | ||
/** | ||
* Fires an event to call listeners. | ||
* @param - Event name | ||
* @param - Event parameter | ||
* @return If false, stop the event. | ||
* @example | ||
* | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* | ||
* | ||
* const emitter = new EventEmitter(); | ||
* | ||
* emitter.on("a", e => { | ||
* }); | ||
* | ||
* | ||
* emitter.emit("a", { | ||
* a: 1, | ||
* }); | ||
*/ | ||
__proto.emit = function (eventName, param) { | ||
var _this = this; | ||
if (param === void 0) { | ||
param = {}; | ||
} | ||
var events = this._events[eventName]; | ||
if (!eventName || !events) { | ||
return true; | ||
} | ||
var isStop = false; | ||
param.eventType = eventName; | ||
param.stop = function () { | ||
isStop = true; | ||
}; | ||
param.currentTarget = this; | ||
__spreadArrays(events).forEach(function (info) { | ||
info.listener(param); | ||
if (info.once) { | ||
_this.off(eventName, info.listener); | ||
} | ||
}); | ||
return !isStop; | ||
}; | ||
/** | ||
* Fires an event to call listeners. | ||
* @param - Event name | ||
* @param - Event parameter | ||
* @return If false, stop the event. | ||
* @example | ||
* | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* | ||
* | ||
* const emitter = new EventEmitter(); | ||
* | ||
* emitter.on("a", e => { | ||
* }); | ||
* | ||
* | ||
* emitter.emit("a", { | ||
* a: 1, | ||
* }); | ||
*/ | ||
/** | ||
* Fires an event to call listeners. | ||
* @param - Event name | ||
* @param - Event parameter | ||
* @return If false, stop the event. | ||
* @example | ||
* | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* | ||
* | ||
* const emitter = new EventEmitter(); | ||
* | ||
* emitter.on("a", e => { | ||
* }); | ||
* | ||
* // emit | ||
* emitter.trigger("a", { | ||
* a: 1, | ||
* }); | ||
*/ | ||
__proto.trigger = function (eventName, param) { | ||
if (param === void 0) { | ||
param = {}; | ||
} | ||
return this.emit(eventName, param); | ||
}; | ||
__proto._addEvent = function (eventName, listener, options) { | ||
var events = this._events; | ||
events[eventName] = events[eventName] || []; | ||
var listeners = events[eventName]; | ||
listeners.push(__assign({ | ||
listener: listener | ||
}, options)); | ||
}; | ||
return EventEmitter; | ||
}(); | ||
function createCommonjsModule(fn, module) { | ||
@@ -851,5 +428,5 @@ return module = { | ||
if (isArray(comb)) { | ||
this.on(type + "." + getArrangeCombi(comb).join("."), callback); | ||
this.on("".concat(type, ".").concat(getArrangeCombi(comb).join(".")), callback); | ||
} else if (isString(comb)) { | ||
this.on(type + "." + comb, callback); | ||
this.on("".concat(type, ".").concat(comb), callback); | ||
} else { | ||
@@ -864,5 +441,5 @@ this.on(type, comb); | ||
if (isArray(comb)) { | ||
this.off(type + "." + getArrangeCombi(comb).join("."), callback); | ||
this.off("".concat(type, ".").concat(getArrangeCombi(comb).join(".")), callback); | ||
} else if (isString(comb)) { | ||
this.off(type + "." + comb, callback); | ||
this.off("".concat(type, ".").concat(comb), callback); | ||
} else { | ||
@@ -893,5 +470,5 @@ this.off(type, comb); | ||
this.trigger(type, param); | ||
this.trigger(type + "." + key, param); | ||
this.trigger("".concat(type, ".").concat(key), param); | ||
var combi = getCombi(e, key); | ||
combi.length > 1 && this.trigger(type + "." + combi.join("."), param); | ||
combi.length > 1 && this.trigger("".concat(type, ".").concat(combi.join(".")), param); | ||
}; | ||
@@ -902,4 +479,668 @@ | ||
/* | ||
Copyright (c) NAVER Corp. | ||
name: @egjs/component | ||
license: MIT | ||
author: NAVER Corp. | ||
repository: https://github.com/naver/egjs-component | ||
version: 3.0.2 | ||
*/ | ||
/*! ***************************************************************************** | ||
Copyright (c) Microsoft Corporation. | ||
Permission to use, copy, modify, and/or distribute this software for any | ||
purpose with or without fee is hereby granted. | ||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH | ||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY | ||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, | ||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM | ||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR | ||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR | ||
PERFORMANCE OF THIS SOFTWARE. | ||
***************************************************************************** */ | ||
function __values(o) { | ||
var s = typeof Symbol === "function" && Symbol.iterator, | ||
m = s && o[s], | ||
i = 0; | ||
if (m) return m.call(o); | ||
if (o && typeof o.length === "number") return { | ||
next: function () { | ||
if (o && i >= o.length) o = void 0; | ||
return { | ||
value: o && o[i++], | ||
done: !o | ||
}; | ||
} | ||
}; | ||
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); | ||
} | ||
function __read(o, n) { | ||
var m = typeof Symbol === "function" && o[Symbol.iterator]; | ||
if (!m) return o; | ||
var i = m.call(o), | ||
r, | ||
ar = [], | ||
e; | ||
try { | ||
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); | ||
} catch (error) { | ||
e = { | ||
error: error | ||
}; | ||
} finally { | ||
try { | ||
if (r && !r.done && (m = i["return"])) m.call(i); | ||
} finally { | ||
if (e) throw e.error; | ||
} | ||
} | ||
return ar; | ||
} | ||
function __spread() { | ||
for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); | ||
return ar; | ||
} | ||
/* | ||
* Copyright (c) 2015 NAVER Corp. | ||
* egjs projects are licensed under the MIT license | ||
*/ | ||
var isUndefined = function (value) { | ||
return typeof value === "undefined"; | ||
}; | ||
/** | ||
* Event class to provide additional properties | ||
* @ko Component에서 추가적인 프로퍼티를 제공하는 이벤트 클래스 | ||
*/ | ||
var ComponentEvent = | ||
/*#__PURE__*/ | ||
function () { | ||
/** | ||
* Create a new instance of ComponentEvent. | ||
* @ko ComponentEvent의 새로운 인스턴스를 생성한다. | ||
* @param eventType The name of the event.<ko>이벤트 이름.</ko> | ||
* @param props An object that contains additional event properties.<ko>추가적인 이벤트 프로퍼티 오브젝트.</ko> | ||
*/ | ||
function ComponentEvent(eventType, props) { | ||
var e_1, _a; | ||
this._canceled = false; | ||
if (props) { | ||
try { | ||
for (var _b = __values(Object.keys(props)), _c = _b.next(); !_c.done; _c = _b.next()) { | ||
var key = _c.value; // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment | ||
this[key] = props[key]; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (_c && !_c.done && (_a = _b.return)) _a.call(_b); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
this.eventType = eventType; | ||
} | ||
/** | ||
* Stop the event. {@link ComponentEvent#isCanceled} will return `true` after. | ||
* @ko 이벤트를 중단한다. 이후 {@link ComponentEvent#isCanceled}가 `true`를 반환한다. | ||
*/ | ||
var __proto = ComponentEvent.prototype; | ||
__proto.stop = function () { | ||
this._canceled = true; | ||
}; | ||
/** | ||
* Returns a boolean value that indicates whether {@link ComponentEvent#stop} is called before. | ||
* @ko {@link ComponentEvent#stop}이 호출되었는지 여부를 반환한다. | ||
* @return {boolean} A boolean value that indicates whether {@link ComponentEvent#stop} is called before.<ko>이전에 {@link ComponentEvent#stop}이 불려졌는지 여부를 반환한다.</ko> | ||
*/ | ||
__proto.isCanceled = function () { | ||
return this._canceled; | ||
}; | ||
return ComponentEvent; | ||
}(); | ||
/** | ||
* A class used to manage events in a component | ||
* @ko 컴포넌트의 이벤트을 관리할 수 있게 하는 클래스 | ||
*/ | ||
var Component = | ||
/*#__PURE__*/ | ||
function () { | ||
/** | ||
* @support {"ie": "7+", "ch" : "latest", "ff" : "latest", "sf" : "latest", "edge" : "latest", "ios" : "7+", "an" : "2.1+ (except 3.x)"} | ||
*/ | ||
function Component() { | ||
this._eventHandler = {}; | ||
} | ||
/** | ||
* Trigger a custom event. | ||
* @ko 커스텀 이벤트를 발생시킨다 | ||
* @param {string | ComponentEvent} event The name of the custom event to be triggered or an instance of the ComponentEvent<ko>발생할 커스텀 이벤트의 이름 또는 ComponentEvent의 인스턴스</ko> | ||
* @param {any[]} params Event data to be sent when triggering a custom event <ko>커스텀 이벤트가 발생할 때 전달할 데이터</ko> | ||
* @return An instance of the component itself<ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* beforeHi: ComponentEvent<{ foo: number; bar: string }>; | ||
* hi: { foo: { a: number; b: boolean } }; | ||
* someEvent: (foo: number, bar: string) => void; | ||
* someOtherEvent: void; // When there's no event argument | ||
* }> { | ||
* some(){ | ||
* if(this.trigger("beforeHi")){ // When event call to stop return false. | ||
* this.trigger("hi");// fire hi event. | ||
* } | ||
* } | ||
* } | ||
* | ||
* const some = new Some(); | ||
* some.on("beforeHi", e => { | ||
* if(condition){ | ||
* e.stop(); // When event call to stop, `hi` event not call. | ||
* } | ||
* // `currentTarget` is component instance. | ||
* console.log(some === e.currentTarget); // true | ||
* | ||
* typeof e.foo; // number | ||
* typeof e.bar; // string | ||
* }); | ||
* some.on("hi", e => { | ||
* typeof e.foo.b; // boolean | ||
* }); | ||
* // If you want to more know event design. You can see article. | ||
* // https://github.com/naver/egjs-component/wiki/How-to-make-Component-event-design%3F | ||
* ``` | ||
*/ | ||
var __proto = Component.prototype; | ||
__proto.trigger = function (event) { | ||
var params = []; | ||
for (var _i = 1; _i < arguments.length; _i++) { | ||
params[_i - 1] = arguments[_i]; | ||
} | ||
var eventName = event instanceof ComponentEvent ? event.eventType : event; | ||
var handlers = __spread(this._eventHandler[eventName] || []); | ||
if (handlers.length <= 0) { | ||
return this; | ||
} | ||
if (event instanceof ComponentEvent) { | ||
event.currentTarget = this; | ||
handlers.forEach(function (handler) { | ||
handler(event); | ||
}); | ||
} else { | ||
handlers.forEach(function (handler) { | ||
// eslint-disable-next-line @typescript-eslint/no-unsafe-call | ||
handler.apply(void 0, __spread(params)); | ||
}); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Executed event just one time. | ||
* @ko 이벤트가 한번만 실행된다. | ||
* @param {string} eventName The name of the event to be attached or an event name - event handler mapped object.<ko>등록할 이벤트의 이름 또는 이벤트 이름-핸들러 오브젝트</ko> | ||
* @param {function} handlerToAttach The handler function of the event to be attached <ko>등록할 이벤트의 핸들러 함수</ko> | ||
* @return An instance of the component itself<ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: ComponentEvent; | ||
* }> { | ||
* hi() { | ||
* alert("hi"); | ||
* } | ||
* thing() { | ||
* this.once("hi", this.hi); | ||
* } | ||
* } | ||
* | ||
* var some = new Some(); | ||
* some.thing(); | ||
* some.trigger(new ComponentEvent("hi")); | ||
* // fire alert("hi"); | ||
* some.trigger(new ComponentEvent("hi")); | ||
* // Nothing happens | ||
* ``` | ||
*/ | ||
__proto.once = function (eventName, handlerToAttach) { | ||
var _this = this; | ||
if (typeof eventName === "object" && isUndefined(handlerToAttach)) { | ||
var eventHash = eventName; | ||
for (var key in eventHash) { | ||
this.once(key, eventHash[key]); | ||
} | ||
return this; | ||
} else if (typeof eventName === "string" && typeof handlerToAttach === "function") { | ||
var listener_1 = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} // eslint-disable-next-line @typescript-eslint/no-unsafe-call | ||
handlerToAttach.apply(void 0, __spread(args)); | ||
_this.off(eventName, listener_1); | ||
}; | ||
this.on(eventName, listener_1); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Checks whether an event has been attached to a component. | ||
* @ko 컴포넌트에 이벤트가 등록됐는지 확인한다. | ||
* @param {string} eventName The name of the event to be attached <ko>등록 여부를 확인할 이벤트의 이름</ko> | ||
* @return {boolean} Indicates whether the event is attached. <ko>이벤트 등록 여부</ko> | ||
* @example | ||
* ```ts | ||
* import Component from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: void; | ||
* }> { | ||
* some() { | ||
* this.hasOn("hi");// check hi event. | ||
* } | ||
* } | ||
* ``` | ||
*/ | ||
__proto.hasOn = function (eventName) { | ||
return !!this._eventHandler[eventName]; | ||
}; | ||
/** | ||
* Attaches an event to a component. | ||
* @ko 컴포넌트에 이벤트를 등록한다. | ||
* @param {string} eventName The name of the event to be attached or an event name - event handler mapped object.<ko>등록할 이벤트의 이름 또는 이벤트 이름-핸들러 오브젝트</ko> | ||
* @param {function} handlerToAttach The handler function of the event to be attached <ko>등록할 이벤트의 핸들러 함수</ko> | ||
* @return An instance of a component itself<ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: void; | ||
* }> { | ||
* hi() { | ||
* console.log("hi"); | ||
* } | ||
* some() { | ||
* this.on("hi",this.hi); //attach event | ||
* } | ||
* } | ||
* ``` | ||
*/ | ||
__proto.on = function (eventName, handlerToAttach) { | ||
if (typeof eventName === "object" && isUndefined(handlerToAttach)) { | ||
var eventHash = eventName; | ||
for (var name in eventHash) { | ||
this.on(name, eventHash[name]); | ||
} | ||
return this; | ||
} else if (typeof eventName === "string" && typeof handlerToAttach === "function") { | ||
var handlerList = this._eventHandler[eventName]; | ||
if (isUndefined(handlerList)) { | ||
this._eventHandler[eventName] = []; | ||
handlerList = this._eventHandler[eventName]; | ||
} | ||
handlerList.push(handlerToAttach); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Detaches an event from the component.<br/>If the `eventName` is not given this will detach all event handlers attached.<br/>If the `handlerToDetach` is not given, this will detach all event handlers for `eventName`. | ||
* @ko 컴포넌트에 등록된 이벤트를 해제한다.<br/>`eventName`이 주어지지 않았을 경우 모든 이벤트 핸들러를 제거한다.<br/>`handlerToAttach`가 주어지지 않았을 경우 `eventName`에 해당하는 모든 이벤트 핸들러를 제거한다. | ||
* @param {string?} eventName The name of the event to be detached <ko>해제할 이벤트의 이름</ko> | ||
* @param {function?} handlerToDetach The handler function of the event to be detached <ko>해제할 이벤트의 핸들러 함수</ko> | ||
* @return An instance of a component itself <ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: void; | ||
* }> { | ||
* hi() { | ||
* console.log("hi"); | ||
* } | ||
* some() { | ||
* this.off("hi",this.hi); //detach event | ||
* } | ||
* } | ||
* ``` | ||
*/ | ||
__proto.off = function (eventName, handlerToDetach) { | ||
var e_1, _a; // Detach all event handlers. | ||
if (isUndefined(eventName)) { | ||
this._eventHandler = {}; | ||
return this; | ||
} // Detach all handlers for eventname or detach event handlers by object. | ||
if (isUndefined(handlerToDetach)) { | ||
if (typeof eventName === "string") { | ||
delete this._eventHandler[eventName]; | ||
return this; | ||
} else { | ||
var eventHash = eventName; | ||
for (var name in eventHash) { | ||
this.off(name, eventHash[name]); | ||
} | ||
return this; | ||
} | ||
} // Detach single event handler | ||
var handlerList = this._eventHandler[eventName]; | ||
if (handlerList) { | ||
var idx = 0; | ||
try { | ||
for (var handlerList_1 = __values(handlerList), handlerList_1_1 = handlerList_1.next(); !handlerList_1_1.done; handlerList_1_1 = handlerList_1.next()) { | ||
var handlerFunction = handlerList_1_1.value; | ||
if (handlerFunction === handlerToDetach) { | ||
handlerList.splice(idx, 1); | ||
if (handlerList.length <= 0) { | ||
delete this._eventHandler[eventName]; | ||
} | ||
break; | ||
} | ||
idx++; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (handlerList_1_1 && !handlerList_1_1.done && (_a = handlerList_1.return)) _a.call(handlerList_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Version info string | ||
* @ko 버전정보 문자열 | ||
* @name VERSION | ||
* @static | ||
* @example | ||
* Component.VERSION; // ex) 3.0.0 | ||
* @memberof Component | ||
*/ | ||
Component.VERSION = "3.0.2"; | ||
return Component; | ||
}(); | ||
/* | ||
Copyright (c) NAVER Crop. | ||
name: @cfcs/core | ||
license: MIT | ||
author: NAVER Crop. | ||
repository: https://github.com/naver/cfcs | ||
version: 0.0.4 | ||
*/ | ||
/** | ||
* cfcs | ||
* Copyright (c) 2022-present NAVER Corp. | ||
* MIT license | ||
*/ | ||
function keys(obj) { | ||
return Object.keys(obj); | ||
} | ||
function isFunction(val) { | ||
return typeof val === "function"; | ||
} | ||
var OBSERVERS_PATH = "__observers__"; | ||
var Observer = | ||
/*#__PURE__*/ | ||
function () { | ||
function Observer(value) { | ||
this._emitter = new Component(); | ||
this._current = value; | ||
} | ||
var __proto = Observer.prototype; | ||
Object.defineProperty(__proto, "current", { | ||
get: function () { | ||
return this._current; | ||
}, | ||
set: function (value) { | ||
var isUpdate = value !== this._current; | ||
this._current = value; | ||
if (isUpdate) { | ||
this._emitter.trigger("update", value); | ||
} | ||
}, | ||
enumerable: false, | ||
configurable: true | ||
}); | ||
__proto.subscribe = function (callback) { | ||
this._emitter.on("update", callback); | ||
}; | ||
__proto.unsubscribe = function (callback) { | ||
this._emitter.off("update", callback); | ||
}; | ||
return Observer; | ||
}(); | ||
function observe(defaultValue) { | ||
return new Observer(defaultValue); | ||
} | ||
function getObservers(instance) { | ||
if (!instance[OBSERVERS_PATH]) { | ||
instance[OBSERVERS_PATH] = {}; | ||
} | ||
return instance[OBSERVERS_PATH]; | ||
} | ||
function getObserver(instance, name, defaultValue) { | ||
var observers = getObservers(instance); | ||
if (!observers[name]) { | ||
observers[name] = observe(defaultValue); | ||
} | ||
return observers[name]; | ||
} | ||
function setObserver(instance, name, observer) { | ||
var observers = getObservers(instance); | ||
observers[name] = observer; | ||
} | ||
function isObserver(val) { | ||
return val && "current" in val && "subscribe" in val && "unsubscribe" in val; | ||
} | ||
function Reactive(name) { | ||
return function (prototype, memberName) { | ||
var publicName = name || memberName; | ||
Object.defineProperty(prototype, memberName, { | ||
get: function () { | ||
return getObserver(this, publicName).current; | ||
}, | ||
set: function (value) { | ||
getObserver(this, publicName, value).current = value; | ||
} | ||
}); | ||
if (publicName !== memberName) { | ||
Object.defineProperty(prototype, publicName, { | ||
get: function () { | ||
return getObserver(this, publicName).current; | ||
} | ||
}); | ||
} | ||
}; | ||
} | ||
function injectReactiveSubscribe(object) { | ||
object["subscribe"] = function (name, callback) { | ||
getObserver(this, name).subscribe(callback); | ||
}; | ||
object["unsubscribe"] = function (name, callback) { | ||
var _this = this; | ||
if (!name) { | ||
keys(getObservers(this)).forEach(function (observerName) { | ||
_this.unsubscribe(observerName); | ||
}); | ||
return; | ||
} | ||
if (!(name in this)) { | ||
return; | ||
} | ||
getObserver(this, name).unsubscribe(callback); | ||
}; | ||
} | ||
function reactive(setup) { | ||
var result = isFunction(setup) ? setup() : setup; | ||
var reactiveObject = {}; | ||
keys(result).forEach(function (name) { | ||
var value = result[name]; | ||
if (isObserver(value)) { | ||
setObserver(reactiveObject, name, value); | ||
Reactive(name)(reactiveObject, name); | ||
} else { | ||
reactiveObject[name] = value; | ||
} | ||
}); | ||
injectReactiveSubscribe(reactiveObject); | ||
return reactiveObject; | ||
} | ||
var REACTIVE = { | ||
events: ["keydown", "keyup", "blur"], | ||
state: { | ||
isKeydown: false | ||
}, | ||
mounted: function (data) { | ||
var _a, _b; | ||
var keys = data.keys; | ||
var keycon = new KeyController((_b = (_a = data.ref) === null || _a === void 0 ? void 0 : _a.current) !== null && _b !== void 0 ? _b : window); | ||
var isKeydown = observe(false); | ||
keycon.keydown(keys, function () { | ||
isKeydown.current = true; | ||
}); | ||
keycon.keyup(keys, function () { | ||
isKeydown.current = false; | ||
}); | ||
keycon.on("blur", function () { | ||
isKeydown.current = false; | ||
}); | ||
return reactive({ | ||
inst: keycon, | ||
keys: keys, | ||
destroy: function () { | ||
return keycon.destroy(); | ||
}, | ||
isKeydown: isKeydown | ||
}); | ||
}, | ||
destroy: function (inst) { | ||
inst.destroy(); | ||
}, | ||
on: function (inst, name, callback) { | ||
var keycon = inst.inst; | ||
if (name === "keydown") { | ||
keycon.keydown(inst.keys, callback); | ||
} else if (name === "keyup") { | ||
keycon.keyup(inst.keys, callback); | ||
} else { | ||
keycon.on(name, callback); | ||
} | ||
}, | ||
off: function (inst, name, callback) { | ||
var keycon = inst.inst; | ||
if (name === "keydown") { | ||
keycon.offKeydown(inst.keys, callback); | ||
} else if (name === "keyup") { | ||
keycon.offKeyup(inst.keys, callback); | ||
} else { | ||
keycon.off(name, callback); | ||
} | ||
} | ||
}; | ||
export default KeyController; | ||
export { getCombi, getKey, getModifierCombi }; | ||
export { REACTIVE, getCombi, getKey, getModifierCombi }; | ||
//# sourceMappingURL=keycon.esm.js.map |
1579
dist/keycon.js
@@ -7,5 +7,1580 @@ /* | ||
repository: git+https://github.com/daybrush/keycon.git | ||
version: 1.2.2 | ||
version: 1.3.0 | ||
*/ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("@daybrush/utils")):"function"==typeof define&&define.amd?define(["@daybrush/utils"],t):(e=e||self).keycon=t(e.utils)}(this,function(i){"use strict";var s=function(e,t){return(s=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)};var o=function(){return(o=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e}).apply(this,arguments)};var e=function(){function e(){this._events={}}var t=e.prototype;return t.on=function(e,t){if(i.isObject(e))for(var n in e)this.on(n,e[n]);else this._addEvent(e,t,{});return this},t.off=function(e,t){if(e)if(i.isObject(e))for(var n in e)this.off(n);else{var r,o;t?(r=this._events[e])&&-1<(o=i.findIndex(r,function(e){return e.listener===t}))&&r.splice(o,1):this._events[e]=[]}else this._events={};return this},t.once=function(t,e){var n=this;return e&&this._addEvent(t,e,{once:!0}),new Promise(function(e){n._addEvent(t,e,{once:!0})})},t.emit=function(t,n){var r=this,e=(void 0===n&&(n={}),this._events[t]);if(!t||!e)return!0;var o=!1;return n.eventType=t,n.stop=function(){o=!0},n.currentTarget=this,function(){for(var e=0,t=0,n=arguments.length;t<n;t++)e+=arguments[t].length;for(var r=Array(e),o=0,t=0;t<n;t++)for(var i=arguments[t],s=0,a=i.length;s<a;s++,o++)r[o]=i[s];return r}(e).forEach(function(e){e.listener(n),e.once&&r.off(t,e.listener)}),!o},t.trigger=function(e,t){return this.emit(e,t=void 0===t?{}:t)},t._addEvent=function(e,t,n){var r=this._events;r[e]=r[e]||[],r[e].push(o({listener:t},n))},e}();(function(e,t){function n(e){if(!e||"object"!=typeof e||(t=e.which||e.keyCode||e.charCode)&&(e=t),"number"==typeof e)return a[e];var t=String(e),e=r[t.toLowerCase()];return e||((e=o[t.toLowerCase()])?e:1===t.length?t.charCodeAt(0):void 0)}n.isEventKey=function(e,t){if(e&&"object"==typeof e){e=e.which||e.keyCode||e.charCode;if(null!=e)if("string"==typeof t){var n=r[t.toLowerCase()];if(n)return n===e;if(n=o[t.toLowerCase()])return n===e}else if("number"==typeof t)return t===e;return!1}};for(var r=(t=e.exports=n).code=t.codes={backspace:8,tab:9,enter:13,shift:16,ctrl:17,alt:18,"pause/break":19,"caps lock":20,esc:27,space:32,"page up":33,"page down":34,end:35,home:36,left:37,up:38,right:39,down:40,insert:45,delete:46,command:91,"left command":91,"right command":93,"numpad *":106,"numpad +":107,"numpad -":109,"numpad .":110,"numpad /":111,"num lock":144,"scroll lock":145,"my computer":182,"my calculator":183,";":186,"=":187,",":188,"-":189,".":190,"/":191,"`":192,"[":219,"\\":220,"]":221,"'":222},o=t.aliases={windows:91,"⇧":16,"⌥":18,"⌃":17,"⌘":91,ctl:17,control:17,option:18,pause:19,break:19,caps:20,return:13,escape:27,spc:32,spacebar:32,pgup:33,pgdn:34,ins:45,del:46,cmd:91},i=97;i<123;i++)r[String.fromCharCode(i)]=i-32;for(var i=48;i<58;i++)r[i-48]=i;for(i=1;i<13;i++)r["f"+i]=i+111;for(i=0;i<10;i++)r["numpad "+i]=i+96;var s,a=t.names=t.title={};for(i in r)a[r[i]]=i;for(s in o)r[s]=o[s]})(t={exports:{}},t.exports);var a,t=t.exports,u=(t.code,t.codes,t.aliases,t.names),f=(t.title,{"+":"plus","left command":"meta","right command":"meta"}),n={shift:1,ctrl:2,alt:3,meta:4};function c(e,t){var n,r=(u[e]||t||"").toLowerCase();for(n in f)r=r.replace(n,f[n]);return r.replace(/\s/g,"")}function l(e,t){void 0===t&&(t=c(e.keyCode,e.key));e=r(e);return-1===e.indexOf(t)&&e.push(t),e.filter(Boolean)}function r(e){return[e.shiftKey&&"shift",e.ctrlKey&&"ctrl",e.altKey&&"alt",e.metaKey&&"meta"].filter(Boolean)}function y(e){e=e.slice();return e.sort(function(e,t){return(n[e]||5)-(n[t]||5)}),e}var d,h=function(n){var e=o,t=n;if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}function o(e){void 0===e&&(e=window);var t=n.call(this)||this;return t.container=e,t.ctrlKey=!1,t.altKey=!1,t.shiftKey=!1,t.metaKey=!1,t.clear=function(){return t.ctrlKey=!1,t.altKey=!1,t.shiftKey=!1,t.metaKey=!1,t},t.keydownEvent=function(e){t.triggerEvent("keydown",e)},t.keyupEvent=function(e){t.triggerEvent("keyup",e)},t.blur=function(){t.clear(),t.trigger("blur")},i.addEvent(e,"blur",t.blur),i.addEvent(e,"keydown",t.keydownEvent),i.addEvent(e,"keyup",t.keyupEvent),t}s(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r);t=o.prototype;return Object.defineProperty(o,"global",{get:function(){return a=a||new o},enumerable:!1,configurable:!0}),o.setGlobal=function(){return this.global},t.destroy=function(){var e=this.container;this.clear(),this.off(),i.removeEvent(e,"blur",this.blur),i.removeEvent(e,"keydown",this.keydownEvent),i.removeEvent(e,"keyup",this.keyupEvent)},t.keydown=function(e,t){return this.addEvent("keydown",e,t)},t.offKeydown=function(e,t){return this.removeEvent("keydown",e,t)},t.offKeyup=function(e,t){return this.removeEvent("keyup",e,t)},t.keyup=function(e,t){return this.addEvent("keyup",e,t)},t.addEvent=function(e,t,n){return i.isArray(t)?this.on(e+"."+y(t).join("."),n):i.isString(t)?this.on(e+"."+t,n):this.on(e,t),this},t.removeEvent=function(e,t,n){return i.isArray(t)?this.off(e+"."+y(t).join("."),n):i.isString(t)?this.off(e+"."+t,n):this.off(e,t),this},t.triggerEvent=function(e,t){this.ctrlKey=t.ctrlKey,this.shiftKey=t.shiftKey,this.altKey=t.altKey,this.metaKey=t.metaKey;var n=c(t.keyCode,t.key),r={key:n,isToggle:"ctrl"===n||"shift"===n||"meta"===n||"alt"===n,inputEvent:t,keyCode:t.keyCode,ctrlKey:t.ctrlKey,altKey:t.altKey,shiftKey:t.shiftKey,metaKey:t.metaKey},t=(this.trigger(e,r),this.trigger(e+"."+n,r),l(t,n));1<t.length&&this.trigger(e+"."+t.join("."),r)},o}(e),p={__proto__:null,default:h,getKey:c,getCombi:l,getModifierCombi:r};for(d in p)h[d]=p[d];return h}); | ||
(function (global, factory) { | ||
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : | ||
typeof define === 'function' && define.amd ? define(factory) : | ||
(global = global || self, global.keycon = factory()); | ||
}(this, (function () { 'use strict'; | ||
/****************************************************************************** | ||
Copyright (c) Microsoft Corporation. | ||
Permission to use, copy, modify, and/or distribute this software for any | ||
purpose with or without fee is hereby granted. | ||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH | ||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY | ||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, | ||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM | ||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR | ||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR | ||
PERFORMANCE OF THIS SOFTWARE. | ||
***************************************************************************** */ | ||
/* global Reflect, Promise */ | ||
var extendStatics = function (d, b) { | ||
extendStatics = Object.setPrototypeOf || { | ||
__proto__: [] | ||
} instanceof Array && function (d, b) { | ||
d.__proto__ = b; | ||
} || function (d, b) { | ||
for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; | ||
}; | ||
return extendStatics(d, b); | ||
}; | ||
function __extends(d, b) { | ||
if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); | ||
extendStatics(d, b); | ||
function __() { | ||
this.constructor = d; | ||
} | ||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); | ||
} | ||
/* | ||
Copyright (c) 2018 Daybrush | ||
@name: @daybrush/utils | ||
license: MIT | ||
author: Daybrush | ||
repository: https://github.com/daybrush/utils | ||
@version 1.7.1 | ||
*/ | ||
/** | ||
* get string "object" | ||
* @memberof Consts | ||
* @example | ||
import {OBJECT} from "@daybrush/utils"; | ||
console.log(OBJECT); // "object" | ||
*/ | ||
var OBJECT = "object"; | ||
/** | ||
* get string "string" | ||
* @memberof Consts | ||
* @example | ||
import {STRING} from "@daybrush/utils"; | ||
console.log(STRING); // "string" | ||
*/ | ||
var STRING = "string"; | ||
/** | ||
* Check the type that the value is object. | ||
* @memberof Utils | ||
* @param {string} value - Value to check the type | ||
* @return {} true if the type is correct, false otherwise | ||
* @example | ||
import {isObject} from "@daybrush/utils"; | ||
console.log(isObject({})); // true | ||
console.log(isObject(undefined)); // false | ||
console.log(isObject("")); // false | ||
console.log(isObject(null)); // false | ||
*/ | ||
function isObject(value) { | ||
return value && typeof value === OBJECT; | ||
} | ||
/** | ||
* Check the type that the value is isArray. | ||
* @memberof Utils | ||
* @param {string} value - Value to check the type | ||
* @return {} true if the type is correct, false otherwise | ||
* @example | ||
import {isArray} from "@daybrush/utils"; | ||
console.log(isArray([])); // true | ||
console.log(isArray({})); // false | ||
console.log(isArray(undefined)); // false | ||
console.log(isArray(null)); // false | ||
*/ | ||
function isArray(value) { | ||
return Array.isArray(value); | ||
} | ||
/** | ||
* Check the type that the value is string. | ||
* @memberof Utils | ||
* @param {string} value - Value to check the type | ||
* @return {} true if the type is correct, false otherwise | ||
* @example | ||
import {isString} from "@daybrush/utils"; | ||
console.log(isString("1234")); // true | ||
console.log(isString(undefined)); // false | ||
console.log(isString(1)); // false | ||
console.log(isString(null)); // false | ||
*/ | ||
function isString(value) { | ||
return typeof value === STRING; | ||
} | ||
/** | ||
* Returns the index of the first element in the array that satisfies the provided testing function. | ||
* @function | ||
* @memberof CrossBrowser | ||
* @param - The array `findIndex` was called upon. | ||
* @param - A function to execute on each value in the array until the function returns true, indicating that the satisfying element was found. | ||
* @param - Returns defaultIndex if not found by the function. | ||
* @example | ||
import { findIndex } from "@daybrush/utils"; | ||
findIndex([{a: 1}, {a: 2}, {a: 3}, {a: 4}], ({ a }) => a === 2); // 1 | ||
*/ | ||
function findIndex(arr, callback, defaultIndex) { | ||
if (defaultIndex === void 0) { | ||
defaultIndex = -1; | ||
} | ||
var length = arr.length; | ||
for (var i = 0; i < length; ++i) { | ||
if (callback(arr[i], i, arr)) { | ||
return i; | ||
} | ||
} | ||
return defaultIndex; | ||
} | ||
/** | ||
* Sets up a function that will be called whenever the specified event is delivered to the target | ||
* @memberof DOM | ||
* @param - event target | ||
* @param - A case-sensitive string representing the event type to listen for. | ||
* @param - The object which receives a notification (an object that implements the Event interface) when an event of the specified type occurs | ||
* @param - An options object that specifies characteristics about the event listener. | ||
* @example | ||
import {addEvent} from "@daybrush/utils"; | ||
addEvent(el, "click", e => { | ||
console.log(e); | ||
}); | ||
*/ | ||
function addEvent(el, type, listener, options) { | ||
el.addEventListener(type, listener, options); | ||
} | ||
/** | ||
* removes from the EventTarget an event listener previously registered with EventTarget.addEventListener() | ||
* @memberof DOM | ||
* @param - event target | ||
* @param - A case-sensitive string representing the event type to listen for. | ||
* @param - The EventListener function of the event handler to remove from the event target. | ||
* @param - An options object that specifies characteristics about the event listener. | ||
* @example | ||
import {addEvent, removeEvent} from "@daybrush/utils"; | ||
const listener = e => { | ||
console.log(e); | ||
}; | ||
addEvent(el, "click", listener); | ||
removeEvent(el, "click", listener); | ||
*/ | ||
function removeEvent(el, type, listener, options) { | ||
el.removeEventListener(type, listener, options); | ||
} | ||
/* | ||
Copyright (c) 2019 Daybrush | ||
name: @scena/event-emitter | ||
license: MIT | ||
author: Daybrush | ||
repository: git+https://github.com/daybrush/gesture.git | ||
version: 1.0.5 | ||
*/ | ||
/*! ***************************************************************************** | ||
Copyright (c) Microsoft Corporation. | ||
Permission to use, copy, modify, and/or distribute this software for any | ||
purpose with or without fee is hereby granted. | ||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH | ||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY | ||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, | ||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM | ||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR | ||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR | ||
PERFORMANCE OF THIS SOFTWARE. | ||
***************************************************************************** */ | ||
var __assign = function () { | ||
__assign = Object.assign || function __assign(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); | ||
}; | ||
function __spreadArrays() { | ||
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; | ||
for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; | ||
return r; | ||
} | ||
/** | ||
* Implement EventEmitter on object or component. | ||
*/ | ||
var EventEmitter = | ||
/*#__PURE__*/ | ||
function () { | ||
function EventEmitter() { | ||
this._events = {}; | ||
} | ||
/** | ||
* Add a listener to the registered event. | ||
* @param - Name of the event to be added | ||
* @param - listener function of the event to be added | ||
* @example | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* cosnt emitter = new EventEmitter(); | ||
* | ||
* // Add listener in "a" event | ||
* emitter.on("a", () => { | ||
* }); | ||
* // Add listeners | ||
* emitter.on({ | ||
* a: () => {}, | ||
* b: () => {}, | ||
* }); | ||
*/ | ||
var __proto = EventEmitter.prototype; | ||
__proto.on = function (eventName, listener) { | ||
if (isObject(eventName)) { | ||
for (var name in eventName) { | ||
this.on(name, eventName[name]); | ||
} | ||
} else { | ||
this._addEvent(eventName, listener, {}); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Remove listeners registered in the event target. | ||
* @param - Name of the event to be removed | ||
* @param - listener function of the event to be removed | ||
* @example | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* cosnt emitter = new EventEmitter(); | ||
* | ||
* // Remove all listeners. | ||
* emitter.off(); | ||
* | ||
* // Remove all listeners in "A" event. | ||
* emitter.off("a"); | ||
* | ||
* | ||
* // Remove "listener" listener in "a" event. | ||
* emitter.off("a", listener); | ||
*/ | ||
__proto.off = function (eventName, listener) { | ||
if (!eventName) { | ||
this._events = {}; | ||
} else if (isObject(eventName)) { | ||
for (var name in eventName) { | ||
this.off(name); | ||
} | ||
} else if (!listener) { | ||
this._events[eventName] = []; | ||
} else { | ||
var events = this._events[eventName]; | ||
if (events) { | ||
var index = findIndex(events, function (e) { | ||
return e.listener === listener; | ||
}); | ||
if (index > -1) { | ||
events.splice(index, 1); | ||
} | ||
} | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Add a disposable listener and Use promise to the registered event. | ||
* @param - Name of the event to be added | ||
* @param - disposable listener function of the event to be added | ||
* @example | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* cosnt emitter = new EventEmitter(); | ||
* | ||
* // Add a disposable listener in "a" event | ||
* emitter.once("a", () => { | ||
* }); | ||
* | ||
* // Use Promise | ||
* emitter.once("a").then(e => { | ||
* }); | ||
*/ | ||
__proto.once = function (eventName, listener) { | ||
var _this = this; | ||
if (listener) { | ||
this._addEvent(eventName, listener, { | ||
once: true | ||
}); | ||
} | ||
return new Promise(function (resolve) { | ||
_this._addEvent(eventName, resolve, { | ||
once: true | ||
}); | ||
}); | ||
}; | ||
/** | ||
* Fires an event to call listeners. | ||
* @param - Event name | ||
* @param - Event parameter | ||
* @return If false, stop the event. | ||
* @example | ||
* | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* | ||
* | ||
* const emitter = new EventEmitter(); | ||
* | ||
* emitter.on("a", e => { | ||
* }); | ||
* | ||
* | ||
* emitter.emit("a", { | ||
* a: 1, | ||
* }); | ||
*/ | ||
__proto.emit = function (eventName, param) { | ||
var _this = this; | ||
if (param === void 0) { | ||
param = {}; | ||
} | ||
var events = this._events[eventName]; | ||
if (!eventName || !events) { | ||
return true; | ||
} | ||
var isStop = false; | ||
param.eventType = eventName; | ||
param.stop = function () { | ||
isStop = true; | ||
}; | ||
param.currentTarget = this; | ||
__spreadArrays(events).forEach(function (info) { | ||
info.listener(param); | ||
if (info.once) { | ||
_this.off(eventName, info.listener); | ||
} | ||
}); | ||
return !isStop; | ||
}; | ||
/** | ||
* Fires an event to call listeners. | ||
* @param - Event name | ||
* @param - Event parameter | ||
* @return If false, stop the event. | ||
* @example | ||
* | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* | ||
* | ||
* const emitter = new EventEmitter(); | ||
* | ||
* emitter.on("a", e => { | ||
* }); | ||
* | ||
* | ||
* emitter.emit("a", { | ||
* a: 1, | ||
* }); | ||
*/ | ||
/** | ||
* Fires an event to call listeners. | ||
* @param - Event name | ||
* @param - Event parameter | ||
* @return If false, stop the event. | ||
* @example | ||
* | ||
* import EventEmitter from "@scena/event-emitter"; | ||
* | ||
* | ||
* const emitter = new EventEmitter(); | ||
* | ||
* emitter.on("a", e => { | ||
* }); | ||
* | ||
* // emit | ||
* emitter.trigger("a", { | ||
* a: 1, | ||
* }); | ||
*/ | ||
__proto.trigger = function (eventName, param) { | ||
if (param === void 0) { | ||
param = {}; | ||
} | ||
return this.emit(eventName, param); | ||
}; | ||
__proto._addEvent = function (eventName, listener, options) { | ||
var events = this._events; | ||
events[eventName] = events[eventName] || []; | ||
var listeners = events[eventName]; | ||
listeners.push(__assign({ | ||
listener: listener | ||
}, options)); | ||
}; | ||
return EventEmitter; | ||
}(); | ||
function createCommonjsModule(fn, module) { | ||
return module = { | ||
exports: {} | ||
}, fn(module, module.exports), module.exports; | ||
} | ||
var keycode = createCommonjsModule(function (module, exports) { | ||
// Source: http://jsfiddle.net/vWx8V/ | ||
// http://stackoverflow.com/questions/5603195/full-list-of-javascript-keycodes | ||
/** | ||
* Conenience method returns corresponding value for given keyName or keyCode. | ||
* | ||
* @param {Mixed} keyCode {Number} or keyName {String} | ||
* @return {Mixed} | ||
* @api public | ||
*/ | ||
function keyCode(searchInput) { | ||
// Keyboard Events | ||
if (searchInput && 'object' === typeof searchInput) { | ||
var hasKeyCode = searchInput.which || searchInput.keyCode || searchInput.charCode; | ||
if (hasKeyCode) searchInput = hasKeyCode; | ||
} | ||
// Numbers | ||
if ('number' === typeof searchInput) return names[searchInput] | ||
// Everything else (cast to string) | ||
var search = String(searchInput); | ||
// check codes | ||
var foundNamedKey = codes[search.toLowerCase()]; | ||
if (foundNamedKey) return foundNamedKey | ||
// check aliases | ||
var foundNamedKey = aliases[search.toLowerCase()]; | ||
if (foundNamedKey) return foundNamedKey | ||
// weird character? | ||
if (search.length === 1) return search.charCodeAt(0) | ||
return undefined | ||
} | ||
/** | ||
* Compares a keyboard event with a given keyCode or keyName. | ||
* | ||
* @param {Event} event Keyboard event that should be tested | ||
* @param {Mixed} keyCode {Number} or keyName {String} | ||
* @return {Boolean} | ||
* @api public | ||
*/ | ||
keyCode.isEventKey = function isEventKey(event, nameOrCode) { | ||
if (event && 'object' === typeof event) { | ||
var keyCode = event.which || event.keyCode || event.charCode; | ||
if (keyCode === null || keyCode === undefined) { return false; } | ||
if (typeof nameOrCode === 'string') { | ||
// check codes | ||
var foundNamedKey = codes[nameOrCode.toLowerCase()]; | ||
if (foundNamedKey) { return foundNamedKey === keyCode; } | ||
// check aliases | ||
var foundNamedKey = aliases[nameOrCode.toLowerCase()]; | ||
if (foundNamedKey) { return foundNamedKey === keyCode; } | ||
} else if (typeof nameOrCode === 'number') { | ||
return nameOrCode === keyCode; | ||
} | ||
return false; | ||
} | ||
}; | ||
exports = module.exports = keyCode; | ||
/** | ||
* Get by name | ||
* | ||
* exports.code['enter'] // => 13 | ||
*/ | ||
var codes = exports.code = exports.codes = { | ||
'backspace': 8, | ||
'tab': 9, | ||
'enter': 13, | ||
'shift': 16, | ||
'ctrl': 17, | ||
'alt': 18, | ||
'pause/break': 19, | ||
'caps lock': 20, | ||
'esc': 27, | ||
'space': 32, | ||
'page up': 33, | ||
'page down': 34, | ||
'end': 35, | ||
'home': 36, | ||
'left': 37, | ||
'up': 38, | ||
'right': 39, | ||
'down': 40, | ||
'insert': 45, | ||
'delete': 46, | ||
'command': 91, | ||
'left command': 91, | ||
'right command': 93, | ||
'numpad *': 106, | ||
'numpad +': 107, | ||
'numpad -': 109, | ||
'numpad .': 110, | ||
'numpad /': 111, | ||
'num lock': 144, | ||
'scroll lock': 145, | ||
'my computer': 182, | ||
'my calculator': 183, | ||
';': 186, | ||
'=': 187, | ||
',': 188, | ||
'-': 189, | ||
'.': 190, | ||
'/': 191, | ||
'`': 192, | ||
'[': 219, | ||
'\\': 220, | ||
']': 221, | ||
"'": 222 | ||
}; | ||
// Helper aliases | ||
var aliases = exports.aliases = { | ||
'windows': 91, | ||
'⇧': 16, | ||
'⌥': 18, | ||
'⌃': 17, | ||
'⌘': 91, | ||
'ctl': 17, | ||
'control': 17, | ||
'option': 18, | ||
'pause': 19, | ||
'break': 19, | ||
'caps': 20, | ||
'return': 13, | ||
'escape': 27, | ||
'spc': 32, | ||
'spacebar': 32, | ||
'pgup': 33, | ||
'pgdn': 34, | ||
'ins': 45, | ||
'del': 46, | ||
'cmd': 91 | ||
}; | ||
/*! | ||
* Programatically add the following | ||
*/ | ||
// lower case chars | ||
for (i = 97; i < 123; i++) codes[String.fromCharCode(i)] = i - 32; | ||
// numbers | ||
for (var i = 48; i < 58; i++) codes[i - 48] = i; | ||
// function keys | ||
for (i = 1; i < 13; i++) codes['f'+i] = i + 111; | ||
// numpad keys | ||
for (i = 0; i < 10; i++) codes['numpad '+i] = i + 96; | ||
/** | ||
* Get by code | ||
* | ||
* exports.name[13] // => 'Enter' | ||
*/ | ||
var names = exports.names = exports.title = {}; // title for backward compat | ||
// Create reverse mapping | ||
for (i in codes) names[codes[i]] = i; | ||
// Add aliases | ||
for (var alias in aliases) { | ||
codes[alias] = aliases[alias]; | ||
} | ||
}); | ||
var keycode_1 = keycode.code; | ||
var keycode_2 = keycode.codes; | ||
var keycode_3 = keycode.aliases; | ||
var keycode_4 = keycode.names; | ||
var keycode_5 = keycode.title; | ||
var codeData = { | ||
"+": "plus", | ||
"left command": "meta", | ||
"right command": "meta" | ||
}; | ||
var keysSort = { | ||
shift: 1, | ||
ctrl: 2, | ||
alt: 3, | ||
meta: 4 | ||
}; | ||
/** | ||
* @memberof KeyController | ||
*/ | ||
function getKey(keyCode, keyName) { | ||
var key = (keycode_4[keyCode] || keyName || "").toLowerCase(); | ||
for (var name in codeData) { | ||
key = key.replace(name, codeData[name]); | ||
} | ||
return key.replace(/\s/g, ""); | ||
} | ||
/** | ||
* @memberof KeyController | ||
*/ | ||
function getCombi(e, key) { | ||
if (key === void 0) { | ||
key = getKey(e.keyCode, e.key); | ||
} | ||
var keys = getModifierCombi(e); | ||
keys.indexOf(key) === -1 && keys.push(key); | ||
return keys.filter(Boolean); | ||
} | ||
/** | ||
* @memberof KeyController | ||
*/ | ||
function getModifierCombi(e) { | ||
var keys = [e.shiftKey && "shift", e.ctrlKey && "ctrl", e.altKey && "alt", e.metaKey && "meta"]; | ||
return keys.filter(Boolean); | ||
} | ||
function getArrangeCombi(keys) { | ||
var arrangeKeys = keys.slice(); | ||
arrangeKeys.sort(function (prev, next) { | ||
var prevScore = keysSort[prev] || 5; | ||
var nextScore = keysSort[next] || 5; | ||
return prevScore - nextScore; | ||
}); | ||
return arrangeKeys; | ||
} | ||
var globalKeyController; | ||
/** | ||
*/ | ||
var KeyController = | ||
/*#__PURE__*/ | ||
function (_super) { | ||
__extends(KeyController, _super); | ||
/** | ||
* | ||
*/ | ||
function KeyController(container) { | ||
if (container === void 0) { | ||
container = window; | ||
} | ||
var _this = _super.call(this) || this; | ||
_this.container = container; | ||
/** | ||
*/ | ||
_this.ctrlKey = false; | ||
/** | ||
*/ | ||
_this.altKey = false; | ||
/** | ||
* | ||
*/ | ||
_this.shiftKey = false; | ||
/** | ||
* | ||
*/ | ||
_this.metaKey = false; | ||
_this.clear = function () { | ||
_this.ctrlKey = false; | ||
_this.altKey = false; | ||
_this.shiftKey = false; | ||
_this.metaKey = false; | ||
return _this; | ||
}; | ||
_this.keydownEvent = function (e) { | ||
_this.triggerEvent("keydown", e); | ||
}; | ||
_this.keyupEvent = function (e) { | ||
_this.triggerEvent("keyup", e); | ||
}; | ||
_this.blur = function () { | ||
_this.clear(); | ||
_this.trigger("blur"); | ||
}; | ||
addEvent(container, "blur", _this.blur); | ||
addEvent(container, "keydown", _this.keydownEvent); | ||
addEvent(container, "keyup", _this.keyupEvent); | ||
return _this; | ||
} | ||
var __proto = KeyController.prototype; | ||
Object.defineProperty(KeyController, "global", { | ||
/** | ||
*/ | ||
get: function () { | ||
return globalKeyController || (globalKeyController = new KeyController()); | ||
}, | ||
enumerable: false, | ||
configurable: true | ||
}); | ||
KeyController.setGlobal = function () { | ||
return this.global; | ||
}; | ||
/** | ||
* | ||
*/ | ||
__proto.destroy = function () { | ||
var container = this.container; | ||
this.clear(); | ||
this.off(); | ||
removeEvent(container, "blur", this.blur); | ||
removeEvent(container, "keydown", this.keydownEvent); | ||
removeEvent(container, "keyup", this.keyupEvent); | ||
}; | ||
/** | ||
* | ||
*/ | ||
__proto.keydown = function (comb, callback) { | ||
return this.addEvent("keydown", comb, callback); | ||
}; | ||
/** | ||
* | ||
*/ | ||
__proto.offKeydown = function (comb, callback) { | ||
return this.removeEvent("keydown", comb, callback); | ||
}; | ||
/** | ||
* | ||
*/ | ||
__proto.offKeyup = function (comb, callback) { | ||
return this.removeEvent("keyup", comb, callback); | ||
}; | ||
/** | ||
* | ||
*/ | ||
__proto.keyup = function (comb, callback) { | ||
return this.addEvent("keyup", comb, callback); | ||
}; | ||
__proto.addEvent = function (type, comb, callback) { | ||
if (isArray(comb)) { | ||
this.on("".concat(type, ".").concat(getArrangeCombi(comb).join(".")), callback); | ||
} else if (isString(comb)) { | ||
this.on("".concat(type, ".").concat(comb), callback); | ||
} else { | ||
this.on(type, comb); | ||
} | ||
return this; | ||
}; | ||
__proto.removeEvent = function (type, comb, callback) { | ||
if (isArray(comb)) { | ||
this.off("".concat(type, ".").concat(getArrangeCombi(comb).join(".")), callback); | ||
} else if (isString(comb)) { | ||
this.off("".concat(type, ".").concat(comb), callback); | ||
} else { | ||
this.off(type, comb); | ||
} | ||
return this; | ||
}; | ||
__proto.triggerEvent = function (type, e) { | ||
this.ctrlKey = e.ctrlKey; | ||
this.shiftKey = e.shiftKey; | ||
this.altKey = e.altKey; | ||
this.metaKey = e.metaKey; | ||
var key = getKey(e.keyCode, e.key); | ||
var isToggle = key === "ctrl" || key === "shift" || key === "meta" || key === "alt"; | ||
var param = { | ||
key: key, | ||
isToggle: isToggle, | ||
inputEvent: e, | ||
keyCode: e.keyCode, | ||
ctrlKey: e.ctrlKey, | ||
altKey: e.altKey, | ||
shiftKey: e.shiftKey, | ||
metaKey: e.metaKey | ||
}; | ||
this.trigger(type, param); | ||
this.trigger("".concat(type, ".").concat(key), param); | ||
var combi = getCombi(e, key); | ||
combi.length > 1 && this.trigger("".concat(type, ".").concat(combi.join(".")), param); | ||
}; | ||
return KeyController; | ||
}(EventEmitter); | ||
/* | ||
Copyright (c) NAVER Corp. | ||
name: @egjs/component | ||
license: MIT | ||
author: NAVER Corp. | ||
repository: https://github.com/naver/egjs-component | ||
version: 3.0.2 | ||
*/ | ||
/*! ***************************************************************************** | ||
Copyright (c) Microsoft Corporation. | ||
Permission to use, copy, modify, and/or distribute this software for any | ||
purpose with or without fee is hereby granted. | ||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH | ||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY | ||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, | ||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM | ||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR | ||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR | ||
PERFORMANCE OF THIS SOFTWARE. | ||
***************************************************************************** */ | ||
function __values(o) { | ||
var s = typeof Symbol === "function" && Symbol.iterator, | ||
m = s && o[s], | ||
i = 0; | ||
if (m) return m.call(o); | ||
if (o && typeof o.length === "number") return { | ||
next: function () { | ||
if (o && i >= o.length) o = void 0; | ||
return { | ||
value: o && o[i++], | ||
done: !o | ||
}; | ||
} | ||
}; | ||
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); | ||
} | ||
function __read(o, n) { | ||
var m = typeof Symbol === "function" && o[Symbol.iterator]; | ||
if (!m) return o; | ||
var i = m.call(o), | ||
r, | ||
ar = [], | ||
e; | ||
try { | ||
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); | ||
} catch (error) { | ||
e = { | ||
error: error | ||
}; | ||
} finally { | ||
try { | ||
if (r && !r.done && (m = i["return"])) m.call(i); | ||
} finally { | ||
if (e) throw e.error; | ||
} | ||
} | ||
return ar; | ||
} | ||
function __spread() { | ||
for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); | ||
return ar; | ||
} | ||
/* | ||
* Copyright (c) 2015 NAVER Corp. | ||
* egjs projects are licensed under the MIT license | ||
*/ | ||
var isUndefined = function (value) { | ||
return typeof value === "undefined"; | ||
}; | ||
/** | ||
* Event class to provide additional properties | ||
* @ko Component에서 추가적인 프로퍼티를 제공하는 이벤트 클래스 | ||
*/ | ||
var ComponentEvent = | ||
/*#__PURE__*/ | ||
function () { | ||
/** | ||
* Create a new instance of ComponentEvent. | ||
* @ko ComponentEvent의 새로운 인스턴스를 생성한다. | ||
* @param eventType The name of the event.<ko>이벤트 이름.</ko> | ||
* @param props An object that contains additional event properties.<ko>추가적인 이벤트 프로퍼티 오브젝트.</ko> | ||
*/ | ||
function ComponentEvent(eventType, props) { | ||
var e_1, _a; | ||
this._canceled = false; | ||
if (props) { | ||
try { | ||
for (var _b = __values(Object.keys(props)), _c = _b.next(); !_c.done; _c = _b.next()) { | ||
var key = _c.value; // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment | ||
this[key] = props[key]; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (_c && !_c.done && (_a = _b.return)) _a.call(_b); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
this.eventType = eventType; | ||
} | ||
/** | ||
* Stop the event. {@link ComponentEvent#isCanceled} will return `true` after. | ||
* @ko 이벤트를 중단한다. 이후 {@link ComponentEvent#isCanceled}가 `true`를 반환한다. | ||
*/ | ||
var __proto = ComponentEvent.prototype; | ||
__proto.stop = function () { | ||
this._canceled = true; | ||
}; | ||
/** | ||
* Returns a boolean value that indicates whether {@link ComponentEvent#stop} is called before. | ||
* @ko {@link ComponentEvent#stop}이 호출되었는지 여부를 반환한다. | ||
* @return {boolean} A boolean value that indicates whether {@link ComponentEvent#stop} is called before.<ko>이전에 {@link ComponentEvent#stop}이 불려졌는지 여부를 반환한다.</ko> | ||
*/ | ||
__proto.isCanceled = function () { | ||
return this._canceled; | ||
}; | ||
return ComponentEvent; | ||
}(); | ||
/** | ||
* A class used to manage events in a component | ||
* @ko 컴포넌트의 이벤트을 관리할 수 있게 하는 클래스 | ||
*/ | ||
var Component = | ||
/*#__PURE__*/ | ||
function () { | ||
/** | ||
* @support {"ie": "7+", "ch" : "latest", "ff" : "latest", "sf" : "latest", "edge" : "latest", "ios" : "7+", "an" : "2.1+ (except 3.x)"} | ||
*/ | ||
function Component() { | ||
this._eventHandler = {}; | ||
} | ||
/** | ||
* Trigger a custom event. | ||
* @ko 커스텀 이벤트를 발생시킨다 | ||
* @param {string | ComponentEvent} event The name of the custom event to be triggered or an instance of the ComponentEvent<ko>발생할 커스텀 이벤트의 이름 또는 ComponentEvent의 인스턴스</ko> | ||
* @param {any[]} params Event data to be sent when triggering a custom event <ko>커스텀 이벤트가 발생할 때 전달할 데이터</ko> | ||
* @return An instance of the component itself<ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* beforeHi: ComponentEvent<{ foo: number; bar: string }>; | ||
* hi: { foo: { a: number; b: boolean } }; | ||
* someEvent: (foo: number, bar: string) => void; | ||
* someOtherEvent: void; // When there's no event argument | ||
* }> { | ||
* some(){ | ||
* if(this.trigger("beforeHi")){ // When event call to stop return false. | ||
* this.trigger("hi");// fire hi event. | ||
* } | ||
* } | ||
* } | ||
* | ||
* const some = new Some(); | ||
* some.on("beforeHi", e => { | ||
* if(condition){ | ||
* e.stop(); // When event call to stop, `hi` event not call. | ||
* } | ||
* // `currentTarget` is component instance. | ||
* console.log(some === e.currentTarget); // true | ||
* | ||
* typeof e.foo; // number | ||
* typeof e.bar; // string | ||
* }); | ||
* some.on("hi", e => { | ||
* typeof e.foo.b; // boolean | ||
* }); | ||
* // If you want to more know event design. You can see article. | ||
* // https://github.com/naver/egjs-component/wiki/How-to-make-Component-event-design%3F | ||
* ``` | ||
*/ | ||
var __proto = Component.prototype; | ||
__proto.trigger = function (event) { | ||
var params = []; | ||
for (var _i = 1; _i < arguments.length; _i++) { | ||
params[_i - 1] = arguments[_i]; | ||
} | ||
var eventName = event instanceof ComponentEvent ? event.eventType : event; | ||
var handlers = __spread(this._eventHandler[eventName] || []); | ||
if (handlers.length <= 0) { | ||
return this; | ||
} | ||
if (event instanceof ComponentEvent) { | ||
event.currentTarget = this; | ||
handlers.forEach(function (handler) { | ||
handler(event); | ||
}); | ||
} else { | ||
handlers.forEach(function (handler) { | ||
// eslint-disable-next-line @typescript-eslint/no-unsafe-call | ||
handler.apply(void 0, __spread(params)); | ||
}); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Executed event just one time. | ||
* @ko 이벤트가 한번만 실행된다. | ||
* @param {string} eventName The name of the event to be attached or an event name - event handler mapped object.<ko>등록할 이벤트의 이름 또는 이벤트 이름-핸들러 오브젝트</ko> | ||
* @param {function} handlerToAttach The handler function of the event to be attached <ko>등록할 이벤트의 핸들러 함수</ko> | ||
* @return An instance of the component itself<ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: ComponentEvent; | ||
* }> { | ||
* hi() { | ||
* alert("hi"); | ||
* } | ||
* thing() { | ||
* this.once("hi", this.hi); | ||
* } | ||
* } | ||
* | ||
* var some = new Some(); | ||
* some.thing(); | ||
* some.trigger(new ComponentEvent("hi")); | ||
* // fire alert("hi"); | ||
* some.trigger(new ComponentEvent("hi")); | ||
* // Nothing happens | ||
* ``` | ||
*/ | ||
__proto.once = function (eventName, handlerToAttach) { | ||
var _this = this; | ||
if (typeof eventName === "object" && isUndefined(handlerToAttach)) { | ||
var eventHash = eventName; | ||
for (var key in eventHash) { | ||
this.once(key, eventHash[key]); | ||
} | ||
return this; | ||
} else if (typeof eventName === "string" && typeof handlerToAttach === "function") { | ||
var listener_1 = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} // eslint-disable-next-line @typescript-eslint/no-unsafe-call | ||
handlerToAttach.apply(void 0, __spread(args)); | ||
_this.off(eventName, listener_1); | ||
}; | ||
this.on(eventName, listener_1); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Checks whether an event has been attached to a component. | ||
* @ko 컴포넌트에 이벤트가 등록됐는지 확인한다. | ||
* @param {string} eventName The name of the event to be attached <ko>등록 여부를 확인할 이벤트의 이름</ko> | ||
* @return {boolean} Indicates whether the event is attached. <ko>이벤트 등록 여부</ko> | ||
* @example | ||
* ```ts | ||
* import Component from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: void; | ||
* }> { | ||
* some() { | ||
* this.hasOn("hi");// check hi event. | ||
* } | ||
* } | ||
* ``` | ||
*/ | ||
__proto.hasOn = function (eventName) { | ||
return !!this._eventHandler[eventName]; | ||
}; | ||
/** | ||
* Attaches an event to a component. | ||
* @ko 컴포넌트에 이벤트를 등록한다. | ||
* @param {string} eventName The name of the event to be attached or an event name - event handler mapped object.<ko>등록할 이벤트의 이름 또는 이벤트 이름-핸들러 오브젝트</ko> | ||
* @param {function} handlerToAttach The handler function of the event to be attached <ko>등록할 이벤트의 핸들러 함수</ko> | ||
* @return An instance of a component itself<ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: void; | ||
* }> { | ||
* hi() { | ||
* console.log("hi"); | ||
* } | ||
* some() { | ||
* this.on("hi",this.hi); //attach event | ||
* } | ||
* } | ||
* ``` | ||
*/ | ||
__proto.on = function (eventName, handlerToAttach) { | ||
if (typeof eventName === "object" && isUndefined(handlerToAttach)) { | ||
var eventHash = eventName; | ||
for (var name in eventHash) { | ||
this.on(name, eventHash[name]); | ||
} | ||
return this; | ||
} else if (typeof eventName === "string" && typeof handlerToAttach === "function") { | ||
var handlerList = this._eventHandler[eventName]; | ||
if (isUndefined(handlerList)) { | ||
this._eventHandler[eventName] = []; | ||
handlerList = this._eventHandler[eventName]; | ||
} | ||
handlerList.push(handlerToAttach); | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Detaches an event from the component.<br/>If the `eventName` is not given this will detach all event handlers attached.<br/>If the `handlerToDetach` is not given, this will detach all event handlers for `eventName`. | ||
* @ko 컴포넌트에 등록된 이벤트를 해제한다.<br/>`eventName`이 주어지지 않았을 경우 모든 이벤트 핸들러를 제거한다.<br/>`handlerToAttach`가 주어지지 않았을 경우 `eventName`에 해당하는 모든 이벤트 핸들러를 제거한다. | ||
* @param {string?} eventName The name of the event to be detached <ko>해제할 이벤트의 이름</ko> | ||
* @param {function?} handlerToDetach The handler function of the event to be detached <ko>해제할 이벤트의 핸들러 함수</ko> | ||
* @return An instance of a component itself <ko>컴포넌트 자신의 인스턴스</ko> | ||
* @example | ||
* ```ts | ||
* import Component, { ComponentEvent } from "@egjs/component"; | ||
* | ||
* class Some extends Component<{ | ||
* hi: void; | ||
* }> { | ||
* hi() { | ||
* console.log("hi"); | ||
* } | ||
* some() { | ||
* this.off("hi",this.hi); //detach event | ||
* } | ||
* } | ||
* ``` | ||
*/ | ||
__proto.off = function (eventName, handlerToDetach) { | ||
var e_1, _a; // Detach all event handlers. | ||
if (isUndefined(eventName)) { | ||
this._eventHandler = {}; | ||
return this; | ||
} // Detach all handlers for eventname or detach event handlers by object. | ||
if (isUndefined(handlerToDetach)) { | ||
if (typeof eventName === "string") { | ||
delete this._eventHandler[eventName]; | ||
return this; | ||
} else { | ||
var eventHash = eventName; | ||
for (var name in eventHash) { | ||
this.off(name, eventHash[name]); | ||
} | ||
return this; | ||
} | ||
} // Detach single event handler | ||
var handlerList = this._eventHandler[eventName]; | ||
if (handlerList) { | ||
var idx = 0; | ||
try { | ||
for (var handlerList_1 = __values(handlerList), handlerList_1_1 = handlerList_1.next(); !handlerList_1_1.done; handlerList_1_1 = handlerList_1.next()) { | ||
var handlerFunction = handlerList_1_1.value; | ||
if (handlerFunction === handlerToDetach) { | ||
handlerList.splice(idx, 1); | ||
if (handlerList.length <= 0) { | ||
delete this._eventHandler[eventName]; | ||
} | ||
break; | ||
} | ||
idx++; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (handlerList_1_1 && !handlerList_1_1.done && (_a = handlerList_1.return)) _a.call(handlerList_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
return this; | ||
}; | ||
/** | ||
* Version info string | ||
* @ko 버전정보 문자열 | ||
* @name VERSION | ||
* @static | ||
* @example | ||
* Component.VERSION; // ex) 3.0.0 | ||
* @memberof Component | ||
*/ | ||
Component.VERSION = "3.0.2"; | ||
return Component; | ||
}(); | ||
/* | ||
Copyright (c) NAVER Crop. | ||
name: @cfcs/core | ||
license: MIT | ||
author: NAVER Crop. | ||
repository: https://github.com/naver/cfcs | ||
version: 0.0.4 | ||
*/ | ||
/** | ||
* cfcs | ||
* Copyright (c) 2022-present NAVER Corp. | ||
* MIT license | ||
*/ | ||
function keys(obj) { | ||
return Object.keys(obj); | ||
} | ||
function isFunction(val) { | ||
return typeof val === "function"; | ||
} | ||
var OBSERVERS_PATH = "__observers__"; | ||
var Observer = | ||
/*#__PURE__*/ | ||
function () { | ||
function Observer(value) { | ||
this._emitter = new Component(); | ||
this._current = value; | ||
} | ||
var __proto = Observer.prototype; | ||
Object.defineProperty(__proto, "current", { | ||
get: function () { | ||
return this._current; | ||
}, | ||
set: function (value) { | ||
var isUpdate = value !== this._current; | ||
this._current = value; | ||
if (isUpdate) { | ||
this._emitter.trigger("update", value); | ||
} | ||
}, | ||
enumerable: false, | ||
configurable: true | ||
}); | ||
__proto.subscribe = function (callback) { | ||
this._emitter.on("update", callback); | ||
}; | ||
__proto.unsubscribe = function (callback) { | ||
this._emitter.off("update", callback); | ||
}; | ||
return Observer; | ||
}(); | ||
function observe(defaultValue) { | ||
return new Observer(defaultValue); | ||
} | ||
function getObservers(instance) { | ||
if (!instance[OBSERVERS_PATH]) { | ||
instance[OBSERVERS_PATH] = {}; | ||
} | ||
return instance[OBSERVERS_PATH]; | ||
} | ||
function getObserver(instance, name, defaultValue) { | ||
var observers = getObservers(instance); | ||
if (!observers[name]) { | ||
observers[name] = observe(defaultValue); | ||
} | ||
return observers[name]; | ||
} | ||
function setObserver(instance, name, observer) { | ||
var observers = getObservers(instance); | ||
observers[name] = observer; | ||
} | ||
function isObserver(val) { | ||
return val && "current" in val && "subscribe" in val && "unsubscribe" in val; | ||
} | ||
function Reactive(name) { | ||
return function (prototype, memberName) { | ||
var publicName = name || memberName; | ||
Object.defineProperty(prototype, memberName, { | ||
get: function () { | ||
return getObserver(this, publicName).current; | ||
}, | ||
set: function (value) { | ||
getObserver(this, publicName, value).current = value; | ||
} | ||
}); | ||
if (publicName !== memberName) { | ||
Object.defineProperty(prototype, publicName, { | ||
get: function () { | ||
return getObserver(this, publicName).current; | ||
} | ||
}); | ||
} | ||
}; | ||
} | ||
function injectReactiveSubscribe(object) { | ||
object["subscribe"] = function (name, callback) { | ||
getObserver(this, name).subscribe(callback); | ||
}; | ||
object["unsubscribe"] = function (name, callback) { | ||
var _this = this; | ||
if (!name) { | ||
keys(getObservers(this)).forEach(function (observerName) { | ||
_this.unsubscribe(observerName); | ||
}); | ||
return; | ||
} | ||
if (!(name in this)) { | ||
return; | ||
} | ||
getObserver(this, name).unsubscribe(callback); | ||
}; | ||
} | ||
function reactive(setup) { | ||
var result = isFunction(setup) ? setup() : setup; | ||
var reactiveObject = {}; | ||
keys(result).forEach(function (name) { | ||
var value = result[name]; | ||
if (isObserver(value)) { | ||
setObserver(reactiveObject, name, value); | ||
Reactive(name)(reactiveObject, name); | ||
} else { | ||
reactiveObject[name] = value; | ||
} | ||
}); | ||
injectReactiveSubscribe(reactiveObject); | ||
return reactiveObject; | ||
} | ||
var REACTIVE = { | ||
events: ["keydown", "keyup", "blur"], | ||
state: { | ||
isKeydown: false | ||
}, | ||
mounted: function (data) { | ||
var _a, _b; | ||
var keys = data.keys; | ||
var keycon = new KeyController((_b = (_a = data.ref) === null || _a === void 0 ? void 0 : _a.current) !== null && _b !== void 0 ? _b : window); | ||
var isKeydown = observe(false); | ||
keycon.keydown(keys, function () { | ||
isKeydown.current = true; | ||
}); | ||
keycon.keyup(keys, function () { | ||
isKeydown.current = false; | ||
}); | ||
keycon.on("blur", function () { | ||
isKeydown.current = false; | ||
}); | ||
return reactive({ | ||
inst: keycon, | ||
keys: keys, | ||
destroy: function () { | ||
return keycon.destroy(); | ||
}, | ||
isKeydown: isKeydown | ||
}); | ||
}, | ||
destroy: function (inst) { | ||
inst.destroy(); | ||
}, | ||
on: function (inst, name, callback) { | ||
var keycon = inst.inst; | ||
if (name === "keydown") { | ||
keycon.keydown(inst.keys, callback); | ||
} else if (name === "keyup") { | ||
keycon.keyup(inst.keys, callback); | ||
} else { | ||
keycon.on(name, callback); | ||
} | ||
}, | ||
off: function (inst, name, callback) { | ||
var keycon = inst.inst; | ||
if (name === "keydown") { | ||
keycon.offKeydown(inst.keys, callback); | ||
} else if (name === "keyup") { | ||
keycon.offKeyup(inst.keys, callback); | ||
} else { | ||
keycon.off(name, callback); | ||
} | ||
} | ||
}; | ||
var others = { | ||
__proto__: null, | ||
'default': KeyController, | ||
getKey: getKey, | ||
getCombi: getCombi, | ||
getModifierCombi: getModifierCombi, | ||
REACTIVE: REACTIVE | ||
}; | ||
for (var name in others) { | ||
KeyController[name] = others[name]; | ||
} | ||
return KeyController; | ||
}))); | ||
//# sourceMappingURL=keycon.js.map |
{ | ||
"name": "keycon", | ||
"version": "1.2.2", | ||
"version": "1.3.0", | ||
"description": "Keyboard Controller", | ||
"main": "./dist/keycon.js", | ||
"main": "./dist/keycon.cjs.js", | ||
"module": "./dist/keycon.esm.js", | ||
"sideEffects": false, | ||
"types": "declaration/KeyController.d.ts", | ||
"types": "declaration/index.d.ts", | ||
"keywords": [ | ||
@@ -17,3 +17,4 @@ "key", | ||
"files": [ | ||
"./*" | ||
"./*", | ||
"./dist/*" | ||
], | ||
@@ -38,6 +39,7 @@ "scripts": { | ||
"@scena/event-emitter": "^1.0.2", | ||
"@cfcs/core": "^0.0.4", | ||
"keycode": "^2.2.0" | ||
}, | ||
"devDependencies": { | ||
"@daybrush/builder": "^0.1.1", | ||
"@daybrush/builder": "^0.1.2", | ||
"@daybrush/jsdoc": "^0.3.7", | ||
@@ -44,0 +46,0 @@ "daybrush-jsdoc-template": "^1.5.3", |
@@ -13,3 +13,3 @@ # keycon [![npm version](https://badge.fury.io/js/keycon.svg)](https://badge.fury.io/js/keycon) | ||
```html | ||
<script src="https://daybrush.com/keycon/release/latest/dist/keycon.pkgd.min.js"></script> | ||
<script src="https://daybrush.com/keycon/release/latest/dist/keycon.min.js"></script> | ||
``` | ||
@@ -16,0 +16,0 @@ |
@@ -10,6 +10,2 @@ import builder from "@daybrush/builder"; | ||
commonjs: true, | ||
external: { | ||
"@daybrush/utils": "utils", | ||
"@egjs/component": "eg.Component", | ||
}, | ||
}, | ||
@@ -19,16 +15,5 @@ { | ||
input: "src/index.umd.ts", | ||
output: "./dist/keycon.js", | ||
output: "./dist/keycon.min.js", | ||
resolve: true, | ||
commonjs: true, | ||
uglify: true, | ||
external: { | ||
"@daybrush/utils": "utils", | ||
"@egjs/component": "eg.Component", | ||
}, | ||
}, | ||
{ | ||
name: "keycon", | ||
input: "src/index.umd.ts", | ||
output: "./dist/keycon.pkgd.js", | ||
resolve: true, | ||
commonjs: true, | ||
@@ -38,11 +23,16 @@ }, | ||
name: "keycon", | ||
input: "src/index.umd.ts", | ||
output: "./dist/keycon.pkgd.min.js", | ||
input: "src/index.cjs.ts", | ||
output: "./dist/keycon.cjs.js", | ||
resolve: true, | ||
uglify: true, | ||
commonjs: true, | ||
exports: "named", | ||
format: "cjs", | ||
external: { | ||
"@daybrush/utils": "@daybrush/utils", | ||
"@scena/event-emitter": "@scena/event-emitter", | ||
}, | ||
}, | ||
{ | ||
name: "keycon", | ||
input: "src/KeyController.ts", | ||
input: "src/index.ts", | ||
output: "./dist/keycon.esm.js", | ||
@@ -54,5 +44,6 @@ exports: "named", | ||
external: { | ||
"@egjs/component": "eg.Component", | ||
"@daybrush/utils": "@daybrush/utils", | ||
"@scena/event-emitter": "@scena/event-emitter", | ||
}, | ||
}, | ||
]); |
@@ -5,2 +5,3 @@ import keycon from "./KeyController"; | ||
export * from "./KeyController"; | ||
export * from "./reactive"; | ||
export default keycon; |
@@ -72,2 +72,17 @@ import EventEmitter, { EmitterParam, TargetParam } from "@scena/event-emitter"; | ||
} | ||
export interface OnKeydown extends KeyControllerEvent { | ||
} | ||
export interface OnKeyup extends KeyControllerEvent { | ||
} | ||
export interface OnBlur { | ||
} | ||
export interface KeyconEvents { | ||
keydown: OnKeydown; | ||
keyup: OnKeyup; | ||
blur: OnBlur; | ||
} | ||
let globalKeyController!: KeyController; | ||
@@ -77,6 +92,3 @@ | ||
*/ | ||
class KeyController extends EventEmitter<{ | ||
blur: {}, | ||
[key: string]: object, | ||
}> { | ||
class KeyController extends EventEmitter<KeyconEvents & { [text: string]: any }> { | ||
/** | ||
@@ -83,0 +95,0 @@ */ |
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
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
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
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
200802
29
3877
0
4
+ Added@cfcs/core@^0.0.4
+ Added@cfcs/core@0.0.4(transitive)
+ Added@egjs/component@3.0.5(transitive)