@stimulus-library/utilities 0.9.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/arrays.d.ts +1 -0
- package/dist/arrays.js +3 -0
- package/dist/baseController.d.ts +11 -0
- package/dist/baseController.js +59 -0
- package/dist/base_controller.d.ts +11 -0
- package/dist/base_controller.js +59 -0
- package/dist/debounce.d.ts +1 -0
- package/dist/debounce.js +19 -0
- package/dist/easingFunctions.d.ts +34 -0
- package/dist/easingFunctions.js +143 -0
- package/dist/elements.d.ts +48 -0
- package/dist/elements.js +102 -0
- package/dist/ephemeralController.d.ts +5 -0
- package/dist/ephemeralController.js +40 -0
- package/dist/ephemeral_controller.d.ts +5 -0
- package/dist/ephemeral_controller.js +40 -0
- package/dist/eventBus.d.ts +3 -0
- package/dist/eventBus.js +2 -0
- package/dist/event_bus.d.ts +1 -0
- package/dist/event_bus.js +2 -0
- package/dist/events.d.ts +2 -0
- package/dist/events.js +10 -0
- package/dist/fetchRetry.d.ts +1 -0
- package/dist/fetchRetry.js +11 -0
- package/dist/getSet.d.ts +3 -0
- package/dist/getSet.js +223 -0
- package/dist/get_set.d.ts +3 -0
- package/dist/get_set.js +223 -0
- package/dist/index.d.ts +18 -0
- package/dist/index.js +18 -0
- package/dist/logging.d.ts +5 -0
- package/dist/logging.js +90 -0
- package/dist/numbers.d.ts +1 -0
- package/dist/numbers.js +3 -0
- package/dist/reactive.d.ts +1 -0
- package/dist/reactive.js +23 -0
- package/dist/requestSubmit.d.ts +2 -0
- package/dist/requestSubmit.js +20 -0
- package/dist/request_submit.d.ts +2 -0
- package/dist/request_submit.js +20 -0
- package/dist/scroll.d.ts +10 -0
- package/dist/scroll.js +51 -0
- package/dist/stimulus.d.ts +2 -0
- package/dist/stimulus.js +13 -0
- package/dist/strings.d.ts +4 -0
- package/dist/strings.js +12 -0
- package/dist/turbo.d.ts +5 -0
- package/dist/turbo.js +3 -0
- package/package.json +50 -0
package/dist/arrays.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function wrapArray<T>(x: T | Array<T>): Array<T>;
|
package/dist/arrays.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Context, Controller } from "@hotwired/stimulus";
|
|
2
|
+
export declare class BaseController extends Controller {
|
|
3
|
+
constructor(context: Context);
|
|
4
|
+
get el(): HTMLElement;
|
|
5
|
+
get isTurboPreview(): boolean;
|
|
6
|
+
get isTurbolinksPreview(): boolean;
|
|
7
|
+
get csrfToken(): string | null;
|
|
8
|
+
metaValue(name: string): string | null;
|
|
9
|
+
eventName(eventName: string): string;
|
|
10
|
+
dispatchEvent(element: HTMLElement, eventName: string, options?: CustomEventInit): void;
|
|
11
|
+
}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { Controller } from "@hotwired/stimulus";
|
|
2
|
+
import { log, logProperty } from "./logging";
|
|
3
|
+
import { dispatchEvent } from "./events";
|
|
4
|
+
export class BaseController extends Controller {
|
|
5
|
+
constructor(context) {
|
|
6
|
+
super(context);
|
|
7
|
+
// @ts-ignore
|
|
8
|
+
if (!this.application.debug) {
|
|
9
|
+
return this;
|
|
10
|
+
}
|
|
11
|
+
return new Proxy(this, {
|
|
12
|
+
get: (obj, prop) => {
|
|
13
|
+
let returnVal = Reflect.get(obj, prop);
|
|
14
|
+
let self = this;
|
|
15
|
+
if ("logFormattedMessage" in this.application) {
|
|
16
|
+
return returnVal;
|
|
17
|
+
}
|
|
18
|
+
if (logProperty(prop.toString())) {
|
|
19
|
+
if (typeof returnVal == "function") {
|
|
20
|
+
return new Proxy(returnVal, {
|
|
21
|
+
apply(target, thisArg, argArray) {
|
|
22
|
+
log(self, prop.toString(), {
|
|
23
|
+
args: argArray,
|
|
24
|
+
});
|
|
25
|
+
return Reflect.apply(target, thisArg, argArray);
|
|
26
|
+
},
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
else {
|
|
30
|
+
log(this, prop.toString());
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
return returnVal;
|
|
34
|
+
},
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
get el() {
|
|
38
|
+
return this.element;
|
|
39
|
+
}
|
|
40
|
+
get isTurboPreview() {
|
|
41
|
+
return document.documentElement.hasAttribute('data-turbo-preview') || document.documentElement.hasAttribute('data-turbolinks-preview');
|
|
42
|
+
}
|
|
43
|
+
get isTurbolinksPreview() {
|
|
44
|
+
return this.isTurboPreview;
|
|
45
|
+
}
|
|
46
|
+
get csrfToken() {
|
|
47
|
+
return this.metaValue('csrf-token');
|
|
48
|
+
}
|
|
49
|
+
metaValue(name) {
|
|
50
|
+
const element = document.head.querySelector(`meta[name="${name}"]`);
|
|
51
|
+
return element?.getAttribute('content') || null;
|
|
52
|
+
}
|
|
53
|
+
eventName(eventName) {
|
|
54
|
+
return `${this.identifier}:${eventName}`;
|
|
55
|
+
}
|
|
56
|
+
dispatchEvent(element, eventName, options = {}) {
|
|
57
|
+
dispatchEvent(this, element, eventName, options);
|
|
58
|
+
}
|
|
59
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Context, Controller } from "@hotwired/stimulus";
|
|
2
|
+
export declare class BaseController extends Controller {
|
|
3
|
+
constructor(context: Context);
|
|
4
|
+
get el(): HTMLElement;
|
|
5
|
+
get isTurboPreview(): boolean;
|
|
6
|
+
get isTurbolinksPreview(): boolean;
|
|
7
|
+
get csrfToken(): string | null;
|
|
8
|
+
metaValue(name: string): string | null;
|
|
9
|
+
eventName(eventName: string): string;
|
|
10
|
+
dispatchEvent(element: HTMLElement, eventName: string, options?: CustomEventInit): void;
|
|
11
|
+
}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { Controller } from "@hotwired/stimulus";
|
|
2
|
+
import { log, logProperty } from "./logging";
|
|
3
|
+
import { dispatchEvent } from "./events";
|
|
4
|
+
export class BaseController extends Controller {
|
|
5
|
+
constructor(context) {
|
|
6
|
+
super(context);
|
|
7
|
+
// @ts-ignore
|
|
8
|
+
if (!this.application.debug) {
|
|
9
|
+
return this;
|
|
10
|
+
}
|
|
11
|
+
return new Proxy(this, {
|
|
12
|
+
get: (obj, prop) => {
|
|
13
|
+
let returnVal = Reflect.get(obj, prop);
|
|
14
|
+
let self = this;
|
|
15
|
+
if ("logFormattedMessage" in this.application) {
|
|
16
|
+
return returnVal;
|
|
17
|
+
}
|
|
18
|
+
if (logProperty(prop.toString())) {
|
|
19
|
+
if (typeof returnVal == "function") {
|
|
20
|
+
return new Proxy(returnVal, {
|
|
21
|
+
apply(target, thisArg, argArray) {
|
|
22
|
+
log(self, prop.toString(), {
|
|
23
|
+
args: argArray,
|
|
24
|
+
});
|
|
25
|
+
return Reflect.apply(target, thisArg, argArray);
|
|
26
|
+
},
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
else {
|
|
30
|
+
log(this, prop.toString());
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
return returnVal;
|
|
34
|
+
},
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
get el() {
|
|
38
|
+
return this.element;
|
|
39
|
+
}
|
|
40
|
+
get isTurboPreview() {
|
|
41
|
+
return document.documentElement.hasAttribute('data-turbo-preview') || document.documentElement.hasAttribute('data-turbolinks-preview');
|
|
42
|
+
}
|
|
43
|
+
get isTurbolinksPreview() {
|
|
44
|
+
return this.isTurboPreview;
|
|
45
|
+
}
|
|
46
|
+
get csrfToken() {
|
|
47
|
+
return this.metaValue('csrf-token');
|
|
48
|
+
}
|
|
49
|
+
metaValue(name) {
|
|
50
|
+
const element = document.head.querySelector(`meta[name="${name}"]`);
|
|
51
|
+
return element?.getAttribute('content') || null;
|
|
52
|
+
}
|
|
53
|
+
eventName(eventName) {
|
|
54
|
+
return `${this.identifier}:${eventName}`;
|
|
55
|
+
}
|
|
56
|
+
dispatchEvent(element, eventName, options = {}) {
|
|
57
|
+
dispatchEvent(this, element, eventName, options);
|
|
58
|
+
}
|
|
59
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function debounce<T extends (...args: any[]) => any>(func: T, wait: number, immediate?: boolean): T;
|
package/dist/debounce.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export function debounce(func, wait, immediate = false) {
|
|
2
|
+
let timeout;
|
|
3
|
+
return function (...args) {
|
|
4
|
+
const later = () => {
|
|
5
|
+
timeout = null;
|
|
6
|
+
if (!immediate) {
|
|
7
|
+
func.apply(this, args);
|
|
8
|
+
}
|
|
9
|
+
};
|
|
10
|
+
const callNow = immediate && !timeout;
|
|
11
|
+
if (timeout) {
|
|
12
|
+
clearTimeout(timeout);
|
|
13
|
+
}
|
|
14
|
+
timeout = setTimeout(later, wait);
|
|
15
|
+
if (callNow) {
|
|
16
|
+
func.apply(this, args);
|
|
17
|
+
}
|
|
18
|
+
};
|
|
19
|
+
}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
export type EasingFunction = (progress: number) => number;
|
|
2
|
+
export declare const EasingFunctions: {
|
|
3
|
+
linear: (x: number) => number;
|
|
4
|
+
easeInQuad: (x: number) => number;
|
|
5
|
+
easeOutQuad: (x: number) => number;
|
|
6
|
+
easeInOutQuad: (x: number) => number;
|
|
7
|
+
easeInCubic: (x: number) => number;
|
|
8
|
+
easeOutCubic: (x: number) => number;
|
|
9
|
+
easeInOutCubic: (x: number) => number;
|
|
10
|
+
easeInQuart: (x: number) => number;
|
|
11
|
+
easeOutQuart: (x: number) => number;
|
|
12
|
+
easeInOutQuart: (x: number) => number;
|
|
13
|
+
easeInQuint: (x: number) => number;
|
|
14
|
+
easeOutQuint: (x: number) => number;
|
|
15
|
+
easeInOutQuint: (x: number) => number;
|
|
16
|
+
easeInSine: (x: number) => number;
|
|
17
|
+
easeOutSine: (x: number) => number;
|
|
18
|
+
easeInOutSine: (x: number) => number;
|
|
19
|
+
easeInExpo: (x: number) => number;
|
|
20
|
+
easeOutExpo: (x: number) => number;
|
|
21
|
+
easeInOutExpo: (x: number) => number;
|
|
22
|
+
easeInCirc: (x: number) => number;
|
|
23
|
+
easeOutCirc: (x: number) => number;
|
|
24
|
+
easeInOutCirc: (x: number) => number;
|
|
25
|
+
easeInBack: (x: number) => number;
|
|
26
|
+
easeOutBack: (x: number) => number;
|
|
27
|
+
easeInOutBack: (x: number) => number;
|
|
28
|
+
easeInElastic: (x: number) => number;
|
|
29
|
+
easeOutElastic: (x: number) => number;
|
|
30
|
+
easeInOutElastic: (x: number) => number;
|
|
31
|
+
easeInBounce: (x: number) => number;
|
|
32
|
+
easeOutBounce: EasingFunction;
|
|
33
|
+
easeInOutBounce: (x: number) => number;
|
|
34
|
+
};
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
const pow = Math.pow;
|
|
2
|
+
const sqrt = Math.sqrt;
|
|
3
|
+
const sin = Math.sin;
|
|
4
|
+
const cos = Math.cos;
|
|
5
|
+
const PI = Math.PI;
|
|
6
|
+
const c1 = 1.70158;
|
|
7
|
+
const c2 = c1 * 1.525;
|
|
8
|
+
const c3 = c1 + 1;
|
|
9
|
+
const c4 = (2 * PI) / 3;
|
|
10
|
+
const c5 = (2 * PI) / 4.5;
|
|
11
|
+
const bounceOut = function (x) {
|
|
12
|
+
const n1 = 7.5625;
|
|
13
|
+
const d1 = 2.75;
|
|
14
|
+
if (x < 1 / d1) {
|
|
15
|
+
return n1 * x * x;
|
|
16
|
+
}
|
|
17
|
+
else if (x < 2 / d1) {
|
|
18
|
+
return n1 * (x -= 1.5 / d1) * x + 0.75;
|
|
19
|
+
}
|
|
20
|
+
else if (x < 2.5 / d1) {
|
|
21
|
+
return n1 * (x -= 2.25 / d1) * x + 0.9375;
|
|
22
|
+
}
|
|
23
|
+
else {
|
|
24
|
+
return n1 * (x -= 2.625 / d1) * x + 0.984375;
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
export const EasingFunctions = {
|
|
28
|
+
linear: (x) => x,
|
|
29
|
+
easeInQuad: function (x) {
|
|
30
|
+
return x * x;
|
|
31
|
+
},
|
|
32
|
+
easeOutQuad: function (x) {
|
|
33
|
+
return 1 - (1 - x) * (1 - x);
|
|
34
|
+
},
|
|
35
|
+
easeInOutQuad: function (x) {
|
|
36
|
+
return x < 0.5 ? 2 * x * x : 1 - pow(-2 * x + 2, 2) / 2;
|
|
37
|
+
},
|
|
38
|
+
easeInCubic: function (x) {
|
|
39
|
+
return x * x * x;
|
|
40
|
+
},
|
|
41
|
+
easeOutCubic: function (x) {
|
|
42
|
+
return 1 - pow(1 - x, 3);
|
|
43
|
+
},
|
|
44
|
+
easeInOutCubic: function (x) {
|
|
45
|
+
return x < 0.5 ? 4 * x * x * x : 1 - pow(-2 * x + 2, 3) / 2;
|
|
46
|
+
},
|
|
47
|
+
easeInQuart: function (x) {
|
|
48
|
+
return x * x * x * x;
|
|
49
|
+
},
|
|
50
|
+
easeOutQuart: function (x) {
|
|
51
|
+
return 1 - pow(1 - x, 4);
|
|
52
|
+
},
|
|
53
|
+
easeInOutQuart: function (x) {
|
|
54
|
+
return x < 0.5 ? 8 * x * x * x * x : 1 - pow(-2 * x + 2, 4) / 2;
|
|
55
|
+
},
|
|
56
|
+
easeInQuint: function (x) {
|
|
57
|
+
return x * x * x * x * x;
|
|
58
|
+
},
|
|
59
|
+
easeOutQuint: function (x) {
|
|
60
|
+
return 1 - pow(1 - x, 5);
|
|
61
|
+
},
|
|
62
|
+
easeInOutQuint: function (x) {
|
|
63
|
+
return x < 0.5 ? 16 * x * x * x * x * x : 1 - pow(-2 * x + 2, 5) / 2;
|
|
64
|
+
},
|
|
65
|
+
easeInSine: function (x) {
|
|
66
|
+
return 1 - cos((x * PI) / 2);
|
|
67
|
+
},
|
|
68
|
+
easeOutSine: function (x) {
|
|
69
|
+
return sin((x * PI) / 2);
|
|
70
|
+
},
|
|
71
|
+
easeInOutSine: function (x) {
|
|
72
|
+
return -(cos(PI * x) - 1) / 2;
|
|
73
|
+
},
|
|
74
|
+
easeInExpo: function (x) {
|
|
75
|
+
return x === 0 ? 0 : pow(2, 10 * x - 10);
|
|
76
|
+
},
|
|
77
|
+
easeOutExpo: function (x) {
|
|
78
|
+
return x === 1 ? 1 : 1 - pow(2, -10 * x);
|
|
79
|
+
},
|
|
80
|
+
easeInOutExpo: function (x) {
|
|
81
|
+
return x === 0
|
|
82
|
+
? 0
|
|
83
|
+
: x === 1
|
|
84
|
+
? 1
|
|
85
|
+
: x < 0.5
|
|
86
|
+
? pow(2, 20 * x - 10) / 2
|
|
87
|
+
: (2 - pow(2, -20 * x + 10)) / 2;
|
|
88
|
+
},
|
|
89
|
+
easeInCirc: function (x) {
|
|
90
|
+
return 1 - sqrt(1 - pow(x, 2));
|
|
91
|
+
},
|
|
92
|
+
easeOutCirc: function (x) {
|
|
93
|
+
return sqrt(1 - pow(x - 1, 2));
|
|
94
|
+
},
|
|
95
|
+
easeInOutCirc: function (x) {
|
|
96
|
+
return x < 0.5
|
|
97
|
+
? (1 - sqrt(1 - pow(2 * x, 2))) / 2
|
|
98
|
+
: (sqrt(1 - pow(-2 * x + 2, 2)) + 1) / 2;
|
|
99
|
+
},
|
|
100
|
+
easeInBack: function (x) {
|
|
101
|
+
return c3 * x * x * x - c1 * x * x;
|
|
102
|
+
},
|
|
103
|
+
easeOutBack: function (x) {
|
|
104
|
+
return 1 + c3 * pow(x - 1, 3) + c1 * pow(x - 1, 2);
|
|
105
|
+
},
|
|
106
|
+
easeInOutBack: function (x) {
|
|
107
|
+
return x < 0.5
|
|
108
|
+
? (pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2)) / 2
|
|
109
|
+
: (pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2;
|
|
110
|
+
},
|
|
111
|
+
easeInElastic: function (x) {
|
|
112
|
+
return x === 0
|
|
113
|
+
? 0
|
|
114
|
+
: x === 1
|
|
115
|
+
? 1
|
|
116
|
+
: -pow(2, 10 * x - 10) * sin((x * 10 - 10.75) * c4);
|
|
117
|
+
},
|
|
118
|
+
easeOutElastic: function (x) {
|
|
119
|
+
return x === 0
|
|
120
|
+
? 0
|
|
121
|
+
: x === 1
|
|
122
|
+
? 1
|
|
123
|
+
: pow(2, -10 * x) * sin((x * 10 - 0.75) * c4) + 1;
|
|
124
|
+
},
|
|
125
|
+
easeInOutElastic: function (x) {
|
|
126
|
+
return x === 0
|
|
127
|
+
? 0
|
|
128
|
+
: x === 1
|
|
129
|
+
? 1
|
|
130
|
+
: x < 0.5
|
|
131
|
+
? -(pow(2, 20 * x - 10) * sin((20 * x - 11.125) * c5)) / 2
|
|
132
|
+
: (pow(2, -20 * x + 10) * sin((20 * x - 11.125) * c5)) / 2 + 1;
|
|
133
|
+
},
|
|
134
|
+
easeInBounce: function (x) {
|
|
135
|
+
return 1 - bounceOut(1 - x);
|
|
136
|
+
},
|
|
137
|
+
easeOutBounce: bounceOut,
|
|
138
|
+
easeInOutBounce: function (x) {
|
|
139
|
+
return x < 0.5
|
|
140
|
+
? (1 - bounceOut(1 - 2 * x)) / 2
|
|
141
|
+
: (1 + bounceOut(2 * x - 1)) / 2;
|
|
142
|
+
},
|
|
143
|
+
};
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
export declare function isHTMLLinkElement(element: Element): element is HTMLLinkElement;
|
|
2
|
+
export declare function isHTMLAnchorElement(element: Element): element is HTMLAnchorElement;
|
|
3
|
+
export declare function isHTMLFormElement(element: Element): element is HTMLFormElement;
|
|
4
|
+
export declare function isHTMLInputElement(element: Element): element is HTMLInputElement;
|
|
5
|
+
export declare function isHTMLLabelElement(element: Element): element is HTMLLabelElement;
|
|
6
|
+
export declare function isHTMLTextAreaElement(element: Element): element is HTMLTextAreaElement;
|
|
7
|
+
export declare function isHTMLButtonElement(element: Element): element is HTMLButtonElement;
|
|
8
|
+
export declare function isHTMLSelectElement(element: Element): element is HTMLSelectElement;
|
|
9
|
+
export declare function isHTMLImageElement(element: Element): element is HTMLImageElement;
|
|
10
|
+
export declare function isHTMLButtonInputElement(element: Element): element is HTMLInputElement & {
|
|
11
|
+
type: "button";
|
|
12
|
+
};
|
|
13
|
+
export declare function isHTMLSubmitInputElement(element: Element): element is HTMLInputElement & {
|
|
14
|
+
type: "submit";
|
|
15
|
+
};
|
|
16
|
+
export declare function isHTMLResetInputElement(element: Element): element is HTMLInputElement & {
|
|
17
|
+
type: "reset";
|
|
18
|
+
};
|
|
19
|
+
export declare function isHTMLButtonButtonElement(element: Element): element is HTMLButtonElement & {
|
|
20
|
+
type: "button";
|
|
21
|
+
};
|
|
22
|
+
export declare function isHTMLSubmitButtonElement(element: Element): element is HTMLButtonElement & {
|
|
23
|
+
type: "submit";
|
|
24
|
+
};
|
|
25
|
+
export declare function isHTMLResetButtonElement(element: Element): element is HTMLButtonElement & {
|
|
26
|
+
type: "reset";
|
|
27
|
+
};
|
|
28
|
+
export declare function isTypeOfResetButtonElement(element: Element): element is (HTMLButtonElement | HTMLInputElement) & {
|
|
29
|
+
type: "reset";
|
|
30
|
+
};
|
|
31
|
+
export declare function isTypeOfSubmitButtonElement(element: Element): element is (HTMLButtonElement | HTMLInputElement) & {
|
|
32
|
+
type: "submit";
|
|
33
|
+
};
|
|
34
|
+
export declare function isTypeOfButtonableElement(element: Element): element is HTMLButtonElement | (HTMLInputElement & {
|
|
35
|
+
type: "submit" | "reset";
|
|
36
|
+
});
|
|
37
|
+
export declare function isElementCheckable(element: Element): element is HTMLInputElement & {
|
|
38
|
+
checked: boolean;
|
|
39
|
+
};
|
|
40
|
+
export declare function isTypeOfFormInputElement(element: Element): element is (HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement);
|
|
41
|
+
export declare function createHiddenButton(type: "submit" | "reset"): HTMLButtonElement;
|
|
42
|
+
export declare function createHiddenInput(name: string, value: string): HTMLInputElement;
|
|
43
|
+
export declare function insertElement<T extends Element>(targetElement: Element, insertPosition: InsertPosition, element: T): T;
|
|
44
|
+
export declare function insertHiddenInput(name: string, value: string, targetElement: Element, insertPosition: InsertPosition): HTMLInputElement;
|
|
45
|
+
export declare function insertHiddenButton(type: "submit" | "reset", targetElement: Element, insertPosition: InsertPosition): HTMLButtonElement;
|
|
46
|
+
export declare function getAllRadiosInGroup(radio: HTMLInputElement): HTMLInputElement[];
|
|
47
|
+
export declare function getOtherRadiosInGroup(radio: HTMLInputElement): HTMLInputElement[];
|
|
48
|
+
export declare function isElementInViewport(el: Element): boolean;
|
package/dist/elements.js
ADDED
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
export function isHTMLLinkElement(element) {
|
|
2
|
+
return element.nodeName == "LINK";
|
|
3
|
+
}
|
|
4
|
+
export function isHTMLAnchorElement(element) {
|
|
5
|
+
return element.nodeName == "A";
|
|
6
|
+
}
|
|
7
|
+
export function isHTMLFormElement(element) {
|
|
8
|
+
return element.nodeName == "FORM";
|
|
9
|
+
}
|
|
10
|
+
export function isHTMLInputElement(element) {
|
|
11
|
+
return element.nodeName == "INPUT";
|
|
12
|
+
}
|
|
13
|
+
export function isHTMLLabelElement(element) {
|
|
14
|
+
return element.nodeName == "LABEL";
|
|
15
|
+
}
|
|
16
|
+
export function isHTMLTextAreaElement(element) {
|
|
17
|
+
return element.nodeName == "TEXTAREA";
|
|
18
|
+
}
|
|
19
|
+
export function isHTMLButtonElement(element) {
|
|
20
|
+
return element.nodeName == "BUTTON";
|
|
21
|
+
}
|
|
22
|
+
export function isHTMLSelectElement(element) {
|
|
23
|
+
return element.nodeName == "SELECT";
|
|
24
|
+
}
|
|
25
|
+
export function isHTMLImageElement(element) {
|
|
26
|
+
return element.nodeName == "IMG";
|
|
27
|
+
}
|
|
28
|
+
export function isHTMLButtonInputElement(element) {
|
|
29
|
+
return element.nodeName == "INPUT" && element.type == "button";
|
|
30
|
+
}
|
|
31
|
+
export function isHTMLSubmitInputElement(element) {
|
|
32
|
+
return element.nodeName == "INPUT" && element.type == "submit";
|
|
33
|
+
}
|
|
34
|
+
export function isHTMLResetInputElement(element) {
|
|
35
|
+
return element.nodeName == "INPUT" && element.type == "reset";
|
|
36
|
+
}
|
|
37
|
+
export function isHTMLButtonButtonElement(element) {
|
|
38
|
+
return element.nodeName == "BUTTON" && element.type == "button";
|
|
39
|
+
}
|
|
40
|
+
export function isHTMLSubmitButtonElement(element) {
|
|
41
|
+
return element.nodeName == "BUTTON" && element.type == "submit";
|
|
42
|
+
}
|
|
43
|
+
export function isHTMLResetButtonElement(element) {
|
|
44
|
+
return element.nodeName == "BUTTON" && element.type == "reset";
|
|
45
|
+
}
|
|
46
|
+
export function isTypeOfResetButtonElement(element) {
|
|
47
|
+
return isHTMLResetButtonElement(element) || isHTMLResetInputElement(element);
|
|
48
|
+
}
|
|
49
|
+
export function isTypeOfSubmitButtonElement(element) {
|
|
50
|
+
return isHTMLSubmitButtonElement(element) || isHTMLSubmitInputElement(element);
|
|
51
|
+
}
|
|
52
|
+
export function isTypeOfButtonableElement(element) {
|
|
53
|
+
return isTypeOfResetButtonElement(element) || isTypeOfSubmitButtonElement(element) || isHTMLButtonButtonElement(element);
|
|
54
|
+
}
|
|
55
|
+
export function isElementCheckable(element) {
|
|
56
|
+
return isHTMLInputElement(element) && (element.type === "radio" || element.type === "checkbox");
|
|
57
|
+
}
|
|
58
|
+
export function isTypeOfFormInputElement(element) {
|
|
59
|
+
return isHTMLInputElement(element) || isHTMLSelectElement(element) || isHTMLTextAreaElement(element);
|
|
60
|
+
}
|
|
61
|
+
export function createHiddenButton(type) {
|
|
62
|
+
let button = document.createElement('button');
|
|
63
|
+
button.type = type;
|
|
64
|
+
button.style.display = 'none';
|
|
65
|
+
button.dataset.sythentic = 'true';
|
|
66
|
+
return button;
|
|
67
|
+
}
|
|
68
|
+
export function createHiddenInput(name, value) {
|
|
69
|
+
let input = document.createElement('input');
|
|
70
|
+
input.type = 'hidden';
|
|
71
|
+
input.name = name;
|
|
72
|
+
input.value = value;
|
|
73
|
+
return input;
|
|
74
|
+
}
|
|
75
|
+
export function insertElement(targetElement, insertPosition, element) {
|
|
76
|
+
let createdElement = targetElement.insertAdjacentElement(insertPosition, element);
|
|
77
|
+
if (!createdElement) {
|
|
78
|
+
throw new Error(`Failed to insert element ${element.nodeName} into ${targetElement.nodeName}`);
|
|
79
|
+
}
|
|
80
|
+
return createdElement;
|
|
81
|
+
}
|
|
82
|
+
export function insertHiddenInput(name, value, targetElement, insertPosition) {
|
|
83
|
+
return insertElement(targetElement, insertPosition, createHiddenInput(name, value));
|
|
84
|
+
}
|
|
85
|
+
export function insertHiddenButton(type, targetElement, insertPosition) {
|
|
86
|
+
return insertElement(targetElement, insertPosition, createHiddenButton(type));
|
|
87
|
+
}
|
|
88
|
+
export function getAllRadiosInGroup(radio) {
|
|
89
|
+
let parent = radio.form || document;
|
|
90
|
+
return Array.from(parent.querySelectorAll(`input[type="radio"][name="${radio.name}"]`));
|
|
91
|
+
}
|
|
92
|
+
export function getOtherRadiosInGroup(radio) {
|
|
93
|
+
return getAllRadiosInGroup(radio).filter((r) => r !== radio);
|
|
94
|
+
}
|
|
95
|
+
export function isElementInViewport(el) {
|
|
96
|
+
const rect = el.getBoundingClientRect();
|
|
97
|
+
const windowHeight = window.innerHeight || document.documentElement.clientHeight;
|
|
98
|
+
const windowWidth = window.innerWidth || document.documentElement.clientWidth;
|
|
99
|
+
const vertInView = rect.top <= windowHeight && rect.top + rect.height >= 0;
|
|
100
|
+
const horInView = rect.left <= windowWidth && rect.left + rect.width >= 0;
|
|
101
|
+
return vertInView && horInView;
|
|
102
|
+
}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { camelCase } from "./strings";
|
|
2
|
+
import { BaseController } from "./baseController";
|
|
3
|
+
export class EphemeralController extends BaseController {
|
|
4
|
+
_cleanupSelf() {
|
|
5
|
+
this.cleanup(this.el);
|
|
6
|
+
}
|
|
7
|
+
cleanup(element) {
|
|
8
|
+
// @ts-ignore
|
|
9
|
+
element.dataset.controller = element.dataset.controller?.replaceAll(new RegExp(`(\\s|^)${this.identifier}(\\s|$)`, "g"), "") || "";
|
|
10
|
+
if (element.dataset.controller == "") {
|
|
11
|
+
// If there are no controllers left, remove the attribute
|
|
12
|
+
delete element.dataset.controller;
|
|
13
|
+
}
|
|
14
|
+
let substringIdentifierValueRegex = new RegExp(`(\\s|^)${this.identifier}\\..+?(\\s|$)`, "g");
|
|
15
|
+
// @ts-ignore
|
|
16
|
+
element.dataset.target = element.dataset.target?.replaceAll(substringIdentifierValueRegex, "") || "";
|
|
17
|
+
delete element.dataset[camelCase(`${this.identifier}-target`)];
|
|
18
|
+
if (element.dataset.target == "") {
|
|
19
|
+
// If there are no targets left, remove the attribute
|
|
20
|
+
delete element.dataset.target;
|
|
21
|
+
}
|
|
22
|
+
// @ts-ignore
|
|
23
|
+
element.dataset.action = element.dataset.target?.replaceAll(substringIdentifierValueRegex, "") || "";
|
|
24
|
+
delete element.dataset[camelCase(`${this.identifier}-action`)];
|
|
25
|
+
if (element.dataset.action == "") {
|
|
26
|
+
// If there are no actions left, remove the attribute
|
|
27
|
+
delete element.dataset.action;
|
|
28
|
+
}
|
|
29
|
+
// @ts-ignore
|
|
30
|
+
let values = this.constructor.values;
|
|
31
|
+
if (values) {
|
|
32
|
+
Object.keys(values).forEach(val => delete element.dataset[camelCase(`${this.identifier}-${val}-value`)]);
|
|
33
|
+
}
|
|
34
|
+
// @ts-ignore
|
|
35
|
+
let classes = this.constructor.classes;
|
|
36
|
+
if (classes) {
|
|
37
|
+
Object.keys(classes).forEach(val => delete element.dataset[camelCase(`${this.identifier}-${val}-class`)]);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { camelCase } from "./strings";
|
|
2
|
+
import { BaseController } from "./base_controller";
|
|
3
|
+
export class EphemeralController extends BaseController {
|
|
4
|
+
_cleanupSelf() {
|
|
5
|
+
this.cleanup(this.el);
|
|
6
|
+
}
|
|
7
|
+
cleanup(element) {
|
|
8
|
+
// @ts-ignore
|
|
9
|
+
element.dataset.controller = element.dataset.controller?.replaceAll(new RegExp(`(\\s|^)${this.identifier}(\\s|$)`, "g"), "") || "";
|
|
10
|
+
if (element.dataset.controller == "") {
|
|
11
|
+
// If there are no controllers left, remove the attribute
|
|
12
|
+
delete element.dataset.controller;
|
|
13
|
+
}
|
|
14
|
+
let substringIdentifierValueRegex = new RegExp(`(\\s|^)${this.identifier}\\..+?(\\s|$)`, "g");
|
|
15
|
+
// @ts-ignore
|
|
16
|
+
element.dataset.target = element.dataset.target?.replaceAll(substringIdentifierValueRegex, "") || "";
|
|
17
|
+
delete element.dataset[camelCase(`${this.identifier}-target`)];
|
|
18
|
+
if (element.dataset.target == "") {
|
|
19
|
+
// If there are no targets left, remove the attribute
|
|
20
|
+
delete element.dataset.target;
|
|
21
|
+
}
|
|
22
|
+
// @ts-ignore
|
|
23
|
+
element.dataset.action = element.dataset.target?.replaceAll(substringIdentifierValueRegex, "") || "";
|
|
24
|
+
delete element.dataset[camelCase(`${this.identifier}-action`)];
|
|
25
|
+
if (element.dataset.action == "") {
|
|
26
|
+
// If there are no actions left, remove the attribute
|
|
27
|
+
delete element.dataset.action;
|
|
28
|
+
}
|
|
29
|
+
// @ts-ignore
|
|
30
|
+
let values = this.constructor.values;
|
|
31
|
+
if (values) {
|
|
32
|
+
Object.keys(values).forEach(val => delete element.dataset[camelCase(`${this.identifier}-${val}-value`)]);
|
|
33
|
+
}
|
|
34
|
+
// @ts-ignore
|
|
35
|
+
let classes = this.constructor.classes;
|
|
36
|
+
if (classes) {
|
|
37
|
+
Object.keys(classes).forEach(val => delete element.dataset[camelCase(`${this.identifier}-${val}-class`)]);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
package/dist/eventBus.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const EventBus: any;
|
package/dist/events.d.ts
ADDED
package/dist/events.js
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { logEvent } from "./logging";
|
|
2
|
+
export function dispatchEvent(controller, element, eventName, options = {}) {
|
|
3
|
+
let mergedOptions = Object.assign({}, { bubbles: true, cancelable: true, detail: { target: element } }, options);
|
|
4
|
+
if (!mergedOptions.detail.target) {
|
|
5
|
+
mergedOptions.detail.target = element;
|
|
6
|
+
}
|
|
7
|
+
let event = new CustomEvent(eventName, mergedOptions);
|
|
8
|
+
logEvent(controller, eventName, event, element);
|
|
9
|
+
element.dispatchEvent(event);
|
|
10
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function fetchRetry(n: number, input: RequestInfo, init?: RequestInit): Promise<Response>;
|
package/dist/getSet.d.ts
ADDED