@angelscmf/front 1.0.28 → 1.0.29
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/AngelsCore.cjs +44 -1
- package/dist/AngelsCore.cjs.map +1 -1
- package/dist/AngelsCore.js +44 -1
- package/dist/AngelsCore.js.map +1 -1
- package/dist/AngelsElement.cjs +67 -0
- package/dist/AngelsElement.cjs.map +1 -0
- package/dist/AngelsElement.d.cts +11 -0
- package/dist/AngelsElement.d.ts +11 -0
- package/dist/AngelsElement.js +42 -0
- package/dist/AngelsElement.js.map +1 -0
- package/dist/AngelsFrontAnimationLibrary.cjs +83 -35
- package/dist/AngelsFrontAnimationLibrary.cjs.map +1 -1
- package/dist/AngelsFrontAnimationLibrary.d.cts +4 -4
- package/dist/AngelsFrontAnimationLibrary.d.ts +4 -4
- package/dist/AngelsFrontAnimationLibrary.js +80 -32
- package/dist/AngelsFrontAnimationLibrary.js.map +1 -1
- package/dist/AngelsFrontDOMLibrary.cjs +85 -6
- package/dist/AngelsFrontDOMLibrary.cjs.map +1 -1
- package/dist/AngelsFrontDOMLibrary.d.cts +8 -2
- package/dist/AngelsFrontDOMLibrary.d.ts +8 -2
- package/dist/AngelsFrontDOMLibrary.js +78 -5
- package/dist/AngelsFrontDOMLibrary.js.map +1 -1
- package/dist/{AngelsFrontLibrary.cjs → AngelsFrontLoader.cjs} +103 -30
- package/dist/AngelsFrontLoader.cjs.map +1 -0
- package/dist/{AngelsFrontLibrary.js → AngelsFrontLoader.js} +103 -30
- package/dist/AngelsFrontLoader.js.map +1 -0
- package/package.json +1 -1
- package/sass/AngelsDesign.scss +1 -0
- package/sass/angelsMessages/_AngelsAlert.scss +20 -10
- package/sass/angelsMessages/_AngelsDebug.scss +15 -10
- package/sass/angelsMessages/_AngelsDone.scss +15 -10
- package/sass/angelsMessages/_AngelsError.scss +15 -10
- package/sass/angelsMessages/_AngelsInfo.scss +15 -10
- package/sass/angelsMessages/_AngelsTip.scss +15 -10
- package/sass/angelsMessages/_AngelsWarn.scss +15 -10
- package/sass/angelsTags/_a-state.scss +10 -0
- package/sass/angelsTags/_a-table.scss +48 -19
- package/dist/AngelsFrontLibrary.cjs.map +0 -1
- package/dist/AngelsFrontLibrary.js.map +0 -1
- /package/dist/{AngelsFrontLibrary.d.cts → AngelsFrontLoader.d.cts} +0 -0
- /package/dist/{AngelsFrontLibrary.d.ts → AngelsFrontLoader.d.ts} +0 -0
package/dist/AngelsCore.cjs
CHANGED
|
@@ -196,8 +196,51 @@ function registerAngelsBoard(options) {
|
|
|
196
196
|
return customElements.get("a-board");
|
|
197
197
|
}
|
|
198
198
|
|
|
199
|
+
// src/AngelsWebComponents/AngelsStateWebComponent.ts
|
|
200
|
+
var AngelsStateWebComponent = class extends HTMLElement {
|
|
201
|
+
aStateAlert(message) {
|
|
202
|
+
this.aStateSet("a-alert", message);
|
|
203
|
+
}
|
|
204
|
+
aStateClear() {
|
|
205
|
+
this.classList.remove("a-alert", "a-debug", "a-done", "a-error", "a-info", "a-tip", "a-warn");
|
|
206
|
+
this.textContent = "";
|
|
207
|
+
this.hidden = true;
|
|
208
|
+
}
|
|
209
|
+
aStateDebug(message) {
|
|
210
|
+
this.aStateSet("a-debug", message);
|
|
211
|
+
}
|
|
212
|
+
aStateDone(message) {
|
|
213
|
+
this.aStateSet("a-done", message);
|
|
214
|
+
}
|
|
215
|
+
aStateError(message) {
|
|
216
|
+
this.aStateSet("a-error", message);
|
|
217
|
+
}
|
|
218
|
+
aStateInfo(message) {
|
|
219
|
+
this.aStateSet("a-info", message);
|
|
220
|
+
}
|
|
221
|
+
aStateTip(message) {
|
|
222
|
+
this.aStateSet("a-tip", message);
|
|
223
|
+
}
|
|
224
|
+
aStateWarn(message) {
|
|
225
|
+
this.aStateSet("a-info", message);
|
|
226
|
+
}
|
|
227
|
+
aStateSet(className, message) {
|
|
228
|
+
this.classList.remove("a-alert", "a-debug", "a-done", "a-error", "a-info", "a-tip", "a-warn");
|
|
229
|
+
this.classList.add(className);
|
|
230
|
+
this.textContent = message;
|
|
231
|
+
this.hidden = false;
|
|
232
|
+
}
|
|
233
|
+
};
|
|
234
|
+
function registerAngelsState() {
|
|
235
|
+
if (!customElements.get("a-state")) {
|
|
236
|
+
customElements.define("a-state", AngelsStateWebComponent);
|
|
237
|
+
}
|
|
238
|
+
return customElements.get("a-state");
|
|
239
|
+
}
|
|
240
|
+
|
|
199
241
|
// src/AngelsCore.ts
|
|
200
242
|
registerAngelsBoard({
|
|
201
|
-
displayHandler:
|
|
243
|
+
displayHandler: aEngageElement
|
|
202
244
|
});
|
|
245
|
+
registerAngelsState();
|
|
203
246
|
//# sourceMappingURL=AngelsCore.cjs.map
|
package/dist/AngelsCore.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/AngelsWebComponents/AngelsBoardWebComponent.ts","../src/AngelsCore.ts"],"sourcesContent":["export type AngelsBoardItemKey = string;\nexport type DisplayHandler = (el: HTMLElement, show: boolean) => Promise<void> | void;\n\n/**\n * Custom web component <a-board> that automatically shows or hides itself\n * based on the visibility of its direct children and the presence of text nodes.\n * Supports a global displayHandler set during registration.\n */\nexport default class AngelsBoardWebComponent extends HTMLElement {\n private static globalDisplayHandler?: DisplayHandler;\n\n private mutationObserver?: MutationObserver;\n private mutationTimeout?: number;\n\n /**\n * Use the global displayHandler if set\n */\n private get displayHandler(): DisplayHandler | undefined {\n return AngelsBoardWebComponent.globalDisplayHandler;\n }\n\n /**\n * Switch the visible child by key\n */\n aBoardSwitch(aBoardItemKey: AngelsBoardItemKey) {\n this.setAttribute('a-board-show', aBoardItemKey);\n }\n\n /**\n * Update visibility based on children/text\n */\n aBoardUpdateDisplaying() {\n const children = Array.from(this.children) as HTMLElement[];\n const hasVisibleChildren = children.some(el => !el.hidden);\n const hasNonWhitespaceText = Array.from(this.childNodes).some(\n node => node.nodeType === Node.TEXT_NODE && node.textContent!.trim() !== ''\n );\n this.hidden = !hasVisibleChildren && !hasNonWhitespaceText;\n this.toggleAttribute('a-board-auto-hidden', this.hidden);\n }\n\n aBoardShowKey(): string {\n return this.getAttribute('a-board-show') || '';\n }\n\n connectedCallback() {\n this.initContent();\n this.observeMutations();\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n\n static get observedAttributes() {\n return ['a-board-show'];\n }\n\n attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n switch (name) {\n case 'a-board-show':\n if (oldValue !== newValue) {\n this.updateContent();\n }\n }\n }\n\n /**\n * Update which child is visible\n */\n async initContent() {\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n if (activeItem) {\n activeItem.hidden = false;\n }\n\n this.aBoardUpdateDisplaying();\n }\n\n /**\n * Update which child is visible\n */\n async updateContent() {\n this.mutationObserver?.disconnect();\n\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n // --- FREEZE LAYOUT START ---\n const rect = this.getBoundingClientRect();\n const prevWidth = this.style.width;\n const prevHeight = this.style.height;\n const prevOverflow = this.style.overflow;\n\n this.style.width = rect.width + 'px';\n this.style.height = rect.height + 'px';\n this.style.overflow = 'hidden';\n // --- /FREEZE LAYOUT START ---\n\n if (this.displayHandler) {\n const promises: Array<Promise<void>> = [];\n items.filter(el => el !== activeItem).forEach(el => {\n const displayHandlerResult = this.displayHandler!(el, false);\n if (displayHandlerResult instanceof Promise) {\n promises.push(displayHandlerResult);\n }\n });\n await Promise.all(promises);\n\n let targetHeight = 0;\n console.log('targetHeight', targetHeight);\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;\n activeItem.classList.remove('a-technical-transparent');\n }\n console.log('targetHeight', targetHeight);\n\n // Animate board height from old → new\n const heightAnimation = this.animate([\n { height: rect.height + 'px' },\n { height: targetHeight + 'px' }\n ], {\n duration: 300,\n easing: 'ease-in-out'\n });\n await new Promise(resolve => {\n heightAnimation.addEventListener('finish', resolve);\n });\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n await this.displayHandler(activeItem, true);\n }\n } else {\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n\n let targetHeight = 0;\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;;\n activeItem.classList.remove('a-technical-transparent');\n }\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n activeItem.hidden = false;\n }\n }\n\n // --- FREEZE LAYOUT END ---\n this.style.height = '';\n this.style.width = prevWidth;\n this.style.overflow = prevOverflow;\n // --- /FREEZE LAYOUT END ---\n\n this.aBoardUpdateDisplaying();\n this.observeMutations();\n }\n\n /**\n * Observe direct children and text nodes only, with debounce\n */\n private observeMutations() {\n if (this.mutationObserver) this.mutationObserver.disconnect();\n\n this.mutationObserver = new MutationObserver(() => {\n clearTimeout(this.mutationTimeout);\n this.mutationTimeout = window.setTimeout(() => {\n this.aBoardUpdateDisplaying();\n }, 50);\n });\n\n this.mutationObserver.observe(this, {\n childList: true,\n characterData: true,\n attributes: true,\n subtree: false,\n attributeFilter: ['hidden', 'style', 'class'],\n });\n }\n\n /**\n * Set global display handler for all <a-board> instances\n */\n static setGlobalDisplayHandler(handler: DisplayHandler) {\n AngelsBoardWebComponent.globalDisplayHandler = handler;\n }\n}\n\n/**\n * Options for registering a-board\n */\nexport interface AngelsBoardRegistrationOptions {\n displayHandler?: DisplayHandler;\n}\n\n/**\n * Register the <a-board> custom element and optionally set a global displayHandler\n */\nexport function registerAngelsBoard(options?: AngelsBoardRegistrationOptions) {\n if (!customElements.get('a-board')) {\n if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n customElements.define('a-board', AngelsBoardWebComponent);\n } else if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n return customElements.get('a-board')!;\n}\n\n","import { registerAngelsBoard } from \"./AngelsWebComponents/AngelsBoardWebComponent\";\n\nregisterAngelsBoard({\n displayHandler: aToggleElement\n});\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../src/AngelsWebComponents/AngelsBoardWebComponent.ts","../src/AngelsWebComponents/AngelsStateWebComponent.ts","../src/AngelsCore.ts"],"sourcesContent":["export type AngelsBoardItemKey = string;\nexport type DisplayHandler = (el: HTMLElement, show: boolean) => Promise<void> | void;\n\n/**\n * Custom web component <a-board> that automatically shows or hides itself\n * based on the visibility of its direct children and the presence of text nodes.\n * Supports a global displayHandler set during registration.\n */\nexport default class AngelsBoardWebComponent extends HTMLElement {\n private static globalDisplayHandler?: DisplayHandler;\n\n private mutationObserver?: MutationObserver;\n private mutationTimeout?: number;\n\n /**\n * Use the global displayHandler if set\n */\n private get displayHandler(): DisplayHandler | undefined {\n return AngelsBoardWebComponent.globalDisplayHandler;\n }\n\n /**\n * Switch the visible child by key\n */\n aBoardSwitch(aBoardItemKey: AngelsBoardItemKey) {\n this.setAttribute('a-board-show', aBoardItemKey);\n }\n\n /**\n * Update visibility based on children/text\n */\n aBoardUpdateDisplaying() {\n const children = Array.from(this.children) as HTMLElement[];\n const hasVisibleChildren = children.some(el => !el.hidden);\n const hasNonWhitespaceText = Array.from(this.childNodes).some(\n node => node.nodeType === Node.TEXT_NODE && node.textContent!.trim() !== ''\n );\n this.hidden = !hasVisibleChildren && !hasNonWhitespaceText;\n this.toggleAttribute('a-board-auto-hidden', this.hidden);\n }\n\n aBoardShowKey(): string {\n return this.getAttribute('a-board-show') || '';\n }\n\n connectedCallback() {\n this.initContent();\n this.observeMutations();\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n\n static get observedAttributes() {\n return ['a-board-show'];\n }\n\n attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n switch (name) {\n case 'a-board-show':\n if (oldValue !== newValue) {\n this.updateContent();\n }\n }\n }\n\n /**\n * Update which child is visible\n */\n async initContent() {\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n if (activeItem) {\n activeItem.hidden = false;\n }\n\n this.aBoardUpdateDisplaying();\n }\n\n /**\n * Update which child is visible\n */\n async updateContent() {\n this.mutationObserver?.disconnect();\n\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n // --- FREEZE LAYOUT START ---\n const rect = this.getBoundingClientRect();\n const prevWidth = this.style.width;\n const prevHeight = this.style.height;\n const prevOverflow = this.style.overflow;\n\n this.style.width = rect.width + 'px';\n this.style.height = rect.height + 'px';\n this.style.overflow = 'hidden';\n // --- /FREEZE LAYOUT START ---\n\n if (this.displayHandler) {\n const promises: Array<Promise<void>> = [];\n items.filter(el => el !== activeItem).forEach(el => {\n const displayHandlerResult = this.displayHandler!(el, false);\n if (displayHandlerResult instanceof Promise) {\n promises.push(displayHandlerResult);\n }\n });\n await Promise.all(promises);\n\n let targetHeight = 0;\n console.log('targetHeight', targetHeight);\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;\n activeItem.classList.remove('a-technical-transparent');\n }\n console.log('targetHeight', targetHeight);\n\n // Animate board height from old → new\n const heightAnimation = this.animate([\n { height: rect.height + 'px' },\n { height: targetHeight + 'px' }\n ], {\n duration: 300,\n easing: 'ease-in-out'\n });\n await new Promise(resolve => {\n heightAnimation.addEventListener('finish', resolve);\n });\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n await this.displayHandler(activeItem, true);\n }\n } else {\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n\n let targetHeight = 0;\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;;\n activeItem.classList.remove('a-technical-transparent');\n }\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n activeItem.hidden = false;\n }\n }\n\n // --- FREEZE LAYOUT END ---\n this.style.height = '';\n this.style.width = prevWidth;\n this.style.overflow = prevOverflow;\n // --- /FREEZE LAYOUT END ---\n\n this.aBoardUpdateDisplaying();\n this.observeMutations();\n }\n\n /**\n * Observe direct children and text nodes only, with debounce\n */\n private observeMutations() {\n if (this.mutationObserver) this.mutationObserver.disconnect();\n\n this.mutationObserver = new MutationObserver(() => {\n clearTimeout(this.mutationTimeout);\n this.mutationTimeout = window.setTimeout(() => {\n this.aBoardUpdateDisplaying();\n }, 50);\n });\n\n this.mutationObserver.observe(this, {\n childList: true,\n characterData: true,\n attributes: true,\n subtree: false,\n attributeFilter: ['hidden', 'style', 'class'],\n });\n }\n\n /**\n * Set global display handler for all <a-board> instances\n */\n static setGlobalDisplayHandler(handler: DisplayHandler) {\n AngelsBoardWebComponent.globalDisplayHandler = handler;\n }\n}\n\n/**\n * Options for registering a-board\n */\nexport interface AngelsBoardRegistrationOptions {\n displayHandler?: DisplayHandler;\n}\n\n/**\n * Register the <a-board> custom element and optionally set a global displayHandler\n */\nexport function registerAngelsBoard(options?: AngelsBoardRegistrationOptions) {\n if (!customElements.get('a-board')) {\n if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n customElements.define('a-board', AngelsBoardWebComponent);\n } else if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n return customElements.get('a-board')!;\n}\n\n","export type AngelsStateClassType = 'a-alert' | 'a-debug' | 'a-done' | 'a-error' | 'a-info' | 'a-tip' | 'a-warn';\n\n/**\n * Custom web component <a-state> that shows different messages.\n */\nexport default class AngelsStateWebComponent extends HTMLElement {\n\n aStateAlert(message: string) {\n this.aStateSet('a-alert', message);\n }\n\n aStateClear() {\n this.classList.remove('a-alert', 'a-debug', 'a-done', 'a-error', 'a-info', 'a-tip', 'a-warn');\n this.textContent = '';\n this.hidden = true;\n }\n\n aStateDebug(message: string) {\n this.aStateSet('a-debug', message);\n }\n\n aStateDone(message: string) {\n this.aStateSet('a-done', message);\n }\n\n aStateError(message: string) {\n this.aStateSet('a-error', message);\n }\n\n aStateInfo(message: string) {\n this.aStateSet('a-info', message);\n }\n\n aStateTip(message: string) {\n this.aStateSet('a-tip', message);\n }\n\n aStateWarn(message: string) {\n this.aStateSet('a-info', message);\n }\n\n aStateSet(className: AngelsStateClassType, message: string) {\n this.classList.remove('a-alert', 'a-debug', 'a-done', 'a-error', 'a-info', 'a-tip', 'a-warn');\n this.classList.add(className);\n this.textContent = message;\n this.hidden = false;\n }\n}\n\n/**\n * Register the <a-state> custom element and optionally set a global displayHandler\n */\nexport function registerAngelsState() {\n if (!customElements.get('a-state')) {\n customElements.define('a-state', AngelsStateWebComponent);\n }\n return customElements.get('a-state')!;\n}\n\n","import { registerAngelsBoard } from \"./AngelsWebComponents/AngelsBoardWebComponent\";\nimport { registerAngelsState } from \"./AngelsWebComponents/AngelsStateWebComponent\";\n\nregisterAngelsBoard({\n displayHandler: aEngageElement\n});\nregisterAngelsState();\n"],"mappings":"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","names":[]}
|
package/dist/AngelsCore.js
CHANGED
|
@@ -195,8 +195,51 @@ function registerAngelsBoard(options) {
|
|
|
195
195
|
return customElements.get("a-board");
|
|
196
196
|
}
|
|
197
197
|
|
|
198
|
+
// src/AngelsWebComponents/AngelsStateWebComponent.ts
|
|
199
|
+
var AngelsStateWebComponent = class extends HTMLElement {
|
|
200
|
+
aStateAlert(message) {
|
|
201
|
+
this.aStateSet("a-alert", message);
|
|
202
|
+
}
|
|
203
|
+
aStateClear() {
|
|
204
|
+
this.classList.remove("a-alert", "a-debug", "a-done", "a-error", "a-info", "a-tip", "a-warn");
|
|
205
|
+
this.textContent = "";
|
|
206
|
+
this.hidden = true;
|
|
207
|
+
}
|
|
208
|
+
aStateDebug(message) {
|
|
209
|
+
this.aStateSet("a-debug", message);
|
|
210
|
+
}
|
|
211
|
+
aStateDone(message) {
|
|
212
|
+
this.aStateSet("a-done", message);
|
|
213
|
+
}
|
|
214
|
+
aStateError(message) {
|
|
215
|
+
this.aStateSet("a-error", message);
|
|
216
|
+
}
|
|
217
|
+
aStateInfo(message) {
|
|
218
|
+
this.aStateSet("a-info", message);
|
|
219
|
+
}
|
|
220
|
+
aStateTip(message) {
|
|
221
|
+
this.aStateSet("a-tip", message);
|
|
222
|
+
}
|
|
223
|
+
aStateWarn(message) {
|
|
224
|
+
this.aStateSet("a-info", message);
|
|
225
|
+
}
|
|
226
|
+
aStateSet(className, message) {
|
|
227
|
+
this.classList.remove("a-alert", "a-debug", "a-done", "a-error", "a-info", "a-tip", "a-warn");
|
|
228
|
+
this.classList.add(className);
|
|
229
|
+
this.textContent = message;
|
|
230
|
+
this.hidden = false;
|
|
231
|
+
}
|
|
232
|
+
};
|
|
233
|
+
function registerAngelsState() {
|
|
234
|
+
if (!customElements.get("a-state")) {
|
|
235
|
+
customElements.define("a-state", AngelsStateWebComponent);
|
|
236
|
+
}
|
|
237
|
+
return customElements.get("a-state");
|
|
238
|
+
}
|
|
239
|
+
|
|
198
240
|
// src/AngelsCore.ts
|
|
199
241
|
registerAngelsBoard({
|
|
200
|
-
displayHandler:
|
|
242
|
+
displayHandler: aEngageElement
|
|
201
243
|
});
|
|
244
|
+
registerAngelsState();
|
|
202
245
|
//# sourceMappingURL=AngelsCore.js.map
|
package/dist/AngelsCore.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/AngelsWebComponents/AngelsBoardWebComponent.ts","../src/AngelsCore.ts"],"sourcesContent":["export type AngelsBoardItemKey = string;\nexport type DisplayHandler = (el: HTMLElement, show: boolean) => Promise<void> | void;\n\n/**\n * Custom web component <a-board> that automatically shows or hides itself\n * based on the visibility of its direct children and the presence of text nodes.\n * Supports a global displayHandler set during registration.\n */\nexport default class AngelsBoardWebComponent extends HTMLElement {\n private static globalDisplayHandler?: DisplayHandler;\n\n private mutationObserver?: MutationObserver;\n private mutationTimeout?: number;\n\n /**\n * Use the global displayHandler if set\n */\n private get displayHandler(): DisplayHandler | undefined {\n return AngelsBoardWebComponent.globalDisplayHandler;\n }\n\n /**\n * Switch the visible child by key\n */\n aBoardSwitch(aBoardItemKey: AngelsBoardItemKey) {\n this.setAttribute('a-board-show', aBoardItemKey);\n }\n\n /**\n * Update visibility based on children/text\n */\n aBoardUpdateDisplaying() {\n const children = Array.from(this.children) as HTMLElement[];\n const hasVisibleChildren = children.some(el => !el.hidden);\n const hasNonWhitespaceText = Array.from(this.childNodes).some(\n node => node.nodeType === Node.TEXT_NODE && node.textContent!.trim() !== ''\n );\n this.hidden = !hasVisibleChildren && !hasNonWhitespaceText;\n this.toggleAttribute('a-board-auto-hidden', this.hidden);\n }\n\n aBoardShowKey(): string {\n return this.getAttribute('a-board-show') || '';\n }\n\n connectedCallback() {\n this.initContent();\n this.observeMutations();\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n\n static get observedAttributes() {\n return ['a-board-show'];\n }\n\n attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n switch (name) {\n case 'a-board-show':\n if (oldValue !== newValue) {\n this.updateContent();\n }\n }\n }\n\n /**\n * Update which child is visible\n */\n async initContent() {\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n if (activeItem) {\n activeItem.hidden = false;\n }\n\n this.aBoardUpdateDisplaying();\n }\n\n /**\n * Update which child is visible\n */\n async updateContent() {\n this.mutationObserver?.disconnect();\n\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n // --- FREEZE LAYOUT START ---\n const rect = this.getBoundingClientRect();\n const prevWidth = this.style.width;\n const prevHeight = this.style.height;\n const prevOverflow = this.style.overflow;\n\n this.style.width = rect.width + 'px';\n this.style.height = rect.height + 'px';\n this.style.overflow = 'hidden';\n // --- /FREEZE LAYOUT START ---\n\n if (this.displayHandler) {\n const promises: Array<Promise<void>> = [];\n items.filter(el => el !== activeItem).forEach(el => {\n const displayHandlerResult = this.displayHandler!(el, false);\n if (displayHandlerResult instanceof Promise) {\n promises.push(displayHandlerResult);\n }\n });\n await Promise.all(promises);\n\n let targetHeight = 0;\n console.log('targetHeight', targetHeight);\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;\n activeItem.classList.remove('a-technical-transparent');\n }\n console.log('targetHeight', targetHeight);\n\n // Animate board height from old → new\n const heightAnimation = this.animate([\n { height: rect.height + 'px' },\n { height: targetHeight + 'px' }\n ], {\n duration: 300,\n easing: 'ease-in-out'\n });\n await new Promise(resolve => {\n heightAnimation.addEventListener('finish', resolve);\n });\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n await this.displayHandler(activeItem, true);\n }\n } else {\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n\n let targetHeight = 0;\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;;\n activeItem.classList.remove('a-technical-transparent');\n }\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n activeItem.hidden = false;\n }\n }\n\n // --- FREEZE LAYOUT END ---\n this.style.height = '';\n this.style.width = prevWidth;\n this.style.overflow = prevOverflow;\n // --- /FREEZE LAYOUT END ---\n\n this.aBoardUpdateDisplaying();\n this.observeMutations();\n }\n\n /**\n * Observe direct children and text nodes only, with debounce\n */\n private observeMutations() {\n if (this.mutationObserver) this.mutationObserver.disconnect();\n\n this.mutationObserver = new MutationObserver(() => {\n clearTimeout(this.mutationTimeout);\n this.mutationTimeout = window.setTimeout(() => {\n this.aBoardUpdateDisplaying();\n }, 50);\n });\n\n this.mutationObserver.observe(this, {\n childList: true,\n characterData: true,\n attributes: true,\n subtree: false,\n attributeFilter: ['hidden', 'style', 'class'],\n });\n }\n\n /**\n * Set global display handler for all <a-board> instances\n */\n static setGlobalDisplayHandler(handler: DisplayHandler) {\n AngelsBoardWebComponent.globalDisplayHandler = handler;\n }\n}\n\n/**\n * Options for registering a-board\n */\nexport interface AngelsBoardRegistrationOptions {\n displayHandler?: DisplayHandler;\n}\n\n/**\n * Register the <a-board> custom element and optionally set a global displayHandler\n */\nexport function registerAngelsBoard(options?: AngelsBoardRegistrationOptions) {\n if (!customElements.get('a-board')) {\n if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n customElements.define('a-board', AngelsBoardWebComponent);\n } else if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n return customElements.get('a-board')!;\n}\n\n","import { registerAngelsBoard } from \"./AngelsWebComponents/AngelsBoardWebComponent\";\n\nregisterAngelsBoard({\n displayHandler: aToggleElement\n});\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../src/AngelsWebComponents/AngelsBoardWebComponent.ts","../src/AngelsWebComponents/AngelsStateWebComponent.ts","../src/AngelsCore.ts"],"sourcesContent":["export type AngelsBoardItemKey = string;\nexport type DisplayHandler = (el: HTMLElement, show: boolean) => Promise<void> | void;\n\n/**\n * Custom web component <a-board> that automatically shows or hides itself\n * based on the visibility of its direct children and the presence of text nodes.\n * Supports a global displayHandler set during registration.\n */\nexport default class AngelsBoardWebComponent extends HTMLElement {\n private static globalDisplayHandler?: DisplayHandler;\n\n private mutationObserver?: MutationObserver;\n private mutationTimeout?: number;\n\n /**\n * Use the global displayHandler if set\n */\n private get displayHandler(): DisplayHandler | undefined {\n return AngelsBoardWebComponent.globalDisplayHandler;\n }\n\n /**\n * Switch the visible child by key\n */\n aBoardSwitch(aBoardItemKey: AngelsBoardItemKey) {\n this.setAttribute('a-board-show', aBoardItemKey);\n }\n\n /**\n * Update visibility based on children/text\n */\n aBoardUpdateDisplaying() {\n const children = Array.from(this.children) as HTMLElement[];\n const hasVisibleChildren = children.some(el => !el.hidden);\n const hasNonWhitespaceText = Array.from(this.childNodes).some(\n node => node.nodeType === Node.TEXT_NODE && node.textContent!.trim() !== ''\n );\n this.hidden = !hasVisibleChildren && !hasNonWhitespaceText;\n this.toggleAttribute('a-board-auto-hidden', this.hidden);\n }\n\n aBoardShowKey(): string {\n return this.getAttribute('a-board-show') || '';\n }\n\n connectedCallback() {\n this.initContent();\n this.observeMutations();\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n\n static get observedAttributes() {\n return ['a-board-show'];\n }\n\n attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n switch (name) {\n case 'a-board-show':\n if (oldValue !== newValue) {\n this.updateContent();\n }\n }\n }\n\n /**\n * Update which child is visible\n */\n async initContent() {\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n if (activeItem) {\n activeItem.hidden = false;\n }\n\n this.aBoardUpdateDisplaying();\n }\n\n /**\n * Update which child is visible\n */\n async updateContent() {\n this.mutationObserver?.disconnect();\n\n const key = this.aBoardShowKey();\n const items = Array.from(this.querySelectorAll<HTMLElement>(`:scope > [a-board-key]`));\n const activeItem = items.find(el => el.getAttribute('a-board-key') === key);\n\n // --- FREEZE LAYOUT START ---\n const rect = this.getBoundingClientRect();\n const prevWidth = this.style.width;\n const prevHeight = this.style.height;\n const prevOverflow = this.style.overflow;\n\n this.style.width = rect.width + 'px';\n this.style.height = rect.height + 'px';\n this.style.overflow = 'hidden';\n // --- /FREEZE LAYOUT START ---\n\n if (this.displayHandler) {\n const promises: Array<Promise<void>> = [];\n items.filter(el => el !== activeItem).forEach(el => {\n const displayHandlerResult = this.displayHandler!(el, false);\n if (displayHandlerResult instanceof Promise) {\n promises.push(displayHandlerResult);\n }\n });\n await Promise.all(promises);\n\n let targetHeight = 0;\n console.log('targetHeight', targetHeight);\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;\n activeItem.classList.remove('a-technical-transparent');\n }\n console.log('targetHeight', targetHeight);\n\n // Animate board height from old → new\n const heightAnimation = this.animate([\n { height: rect.height + 'px' },\n { height: targetHeight + 'px' }\n ], {\n duration: 300,\n easing: 'ease-in-out'\n });\n await new Promise(resolve => {\n heightAnimation.addEventListener('finish', resolve);\n });\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n await this.displayHandler(activeItem, true);\n }\n } else {\n items.filter(el => el !== activeItem).forEach(el => {\n const show = el === activeItem;\n el.hidden = true;\n });\n\n let targetHeight = 0;\n if (activeItem) {\n activeItem.classList.add('a-technical-transparent');\n targetHeight = activeItem.scrollHeight;;\n activeItem.classList.remove('a-technical-transparent');\n }\n\n this.style.height = targetHeight + 'px';\n\n if (activeItem) {\n activeItem.hidden = false;\n }\n }\n\n // --- FREEZE LAYOUT END ---\n this.style.height = '';\n this.style.width = prevWidth;\n this.style.overflow = prevOverflow;\n // --- /FREEZE LAYOUT END ---\n\n this.aBoardUpdateDisplaying();\n this.observeMutations();\n }\n\n /**\n * Observe direct children and text nodes only, with debounce\n */\n private observeMutations() {\n if (this.mutationObserver) this.mutationObserver.disconnect();\n\n this.mutationObserver = new MutationObserver(() => {\n clearTimeout(this.mutationTimeout);\n this.mutationTimeout = window.setTimeout(() => {\n this.aBoardUpdateDisplaying();\n }, 50);\n });\n\n this.mutationObserver.observe(this, {\n childList: true,\n characterData: true,\n attributes: true,\n subtree: false,\n attributeFilter: ['hidden', 'style', 'class'],\n });\n }\n\n /**\n * Set global display handler for all <a-board> instances\n */\n static setGlobalDisplayHandler(handler: DisplayHandler) {\n AngelsBoardWebComponent.globalDisplayHandler = handler;\n }\n}\n\n/**\n * Options for registering a-board\n */\nexport interface AngelsBoardRegistrationOptions {\n displayHandler?: DisplayHandler;\n}\n\n/**\n * Register the <a-board> custom element and optionally set a global displayHandler\n */\nexport function registerAngelsBoard(options?: AngelsBoardRegistrationOptions) {\n if (!customElements.get('a-board')) {\n if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n customElements.define('a-board', AngelsBoardWebComponent);\n } else if (options?.displayHandler) {\n AngelsBoardWebComponent.setGlobalDisplayHandler(options.displayHandler);\n }\n return customElements.get('a-board')!;\n}\n\n","export type AngelsStateClassType = 'a-alert' | 'a-debug' | 'a-done' | 'a-error' | 'a-info' | 'a-tip' | 'a-warn';\n\n/**\n * Custom web component <a-state> that shows different messages.\n */\nexport default class AngelsStateWebComponent extends HTMLElement {\n\n aStateAlert(message: string) {\n this.aStateSet('a-alert', message);\n }\n\n aStateClear() {\n this.classList.remove('a-alert', 'a-debug', 'a-done', 'a-error', 'a-info', 'a-tip', 'a-warn');\n this.textContent = '';\n this.hidden = true;\n }\n\n aStateDebug(message: string) {\n this.aStateSet('a-debug', message);\n }\n\n aStateDone(message: string) {\n this.aStateSet('a-done', message);\n }\n\n aStateError(message: string) {\n this.aStateSet('a-error', message);\n }\n\n aStateInfo(message: string) {\n this.aStateSet('a-info', message);\n }\n\n aStateTip(message: string) {\n this.aStateSet('a-tip', message);\n }\n\n aStateWarn(message: string) {\n this.aStateSet('a-info', message);\n }\n\n aStateSet(className: AngelsStateClassType, message: string) {\n this.classList.remove('a-alert', 'a-debug', 'a-done', 'a-error', 'a-info', 'a-tip', 'a-warn');\n this.classList.add(className);\n this.textContent = message;\n this.hidden = false;\n }\n}\n\n/**\n * Register the <a-state> custom element and optionally set a global displayHandler\n */\nexport function registerAngelsState() {\n if (!customElements.get('a-state')) {\n customElements.define('a-state', AngelsStateWebComponent);\n }\n return customElements.get('a-state')!;\n}\n\n","import { registerAngelsBoard } from \"./AngelsWebComponents/AngelsBoardWebComponent\";\nimport { registerAngelsState } from \"./AngelsWebComponents/AngelsStateWebComponent\";\n\nregisterAngelsBoard({\n displayHandler: aEngageElement\n});\nregisterAngelsState();\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/AngelsElement.ts
|
|
21
|
+
var AngelsElement_exports = {};
|
|
22
|
+
__export(AngelsElement_exports, {
|
|
23
|
+
AngelsElementClass: () => AngelsElementClass
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(AngelsElement_exports);
|
|
26
|
+
var AngelsElementClass = class {
|
|
27
|
+
constructor(element) {
|
|
28
|
+
this.originalElement = element;
|
|
29
|
+
return new Proxy(this, {
|
|
30
|
+
get(target, prop, receiver) {
|
|
31
|
+
if (prop in target) {
|
|
32
|
+
return target[prop];
|
|
33
|
+
}
|
|
34
|
+
return target.originalElement[prop];
|
|
35
|
+
},
|
|
36
|
+
set(target, prop, newValue, receiver) {
|
|
37
|
+
if (prop in target) {
|
|
38
|
+
target[prop] = newValue;
|
|
39
|
+
} else {
|
|
40
|
+
target.originalElement[prop] = newValue;
|
|
41
|
+
}
|
|
42
|
+
return true;
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
aHideElement() {
|
|
47
|
+
this.originalElement.hidden = true;
|
|
48
|
+
return this;
|
|
49
|
+
}
|
|
50
|
+
aShowElement() {
|
|
51
|
+
this.originalElement.hidden = false;
|
|
52
|
+
return this;
|
|
53
|
+
}
|
|
54
|
+
aTextContent(content = void 0) {
|
|
55
|
+
var _a;
|
|
56
|
+
if (content === void 0) {
|
|
57
|
+
return (_a = this.originalElement.textContent) != null ? _a : ``;
|
|
58
|
+
}
|
|
59
|
+
this.originalElement.textContent = content.toString();
|
|
60
|
+
return this;
|
|
61
|
+
}
|
|
62
|
+
};
|
|
63
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
64
|
+
0 && (module.exports = {
|
|
65
|
+
AngelsElementClass
|
|
66
|
+
});
|
|
67
|
+
//# sourceMappingURL=AngelsElement.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/AngelsElement.ts"],"sourcesContent":["export type AngelsElement<TElement extends HTMLElement = HTMLElement> = AngelsElementClass<TElement> & TElement;\n\nexport class AngelsElementClass<TElement extends HTMLElement = HTMLElement> {\n\n protected originalElement: TElement;\n\n constructor(element: TElement) {\n\n this.originalElement = element;\n\n return new Proxy(this, {\n get(target: any, prop: string | symbol, receiver: any) {\n if (prop in target) {\n return target[prop];\n }\n return target.originalElement[prop];\n },\n\n set(target: any, prop: string | symbol, newValue: any, receiver: any) {\n if (prop in target) {\n target[prop] = newValue;\n } else {\n target.originalElement[prop] = newValue;\n }\n return true;\n }\n });\n }\n\n aHideElement(): this {\n this.originalElement.hidden = true;\n return this;\n }\n\n aShowElement(): this {\n this.originalElement.hidden = false;\n return this;\n }\n\n aTextContent(): string;\n aTextContent(content: string): this;\n aTextContent(content: string | undefined = undefined): this | string {\n if (content === undefined) {\n return this.originalElement.textContent ?? ``;\n }\n this.originalElement.textContent = content.toString();\n return this;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEO,IAAM,qBAAN,MAAqE;AAAA,EAIxE,YAAY,SAAmB;AAE3B,SAAK,kBAAkB;AAEvB,WAAO,IAAI,MAAM,MAAM;AAAA,MACnB,IAAI,QAAa,MAAuB,UAAe;AACnD,YAAI,QAAQ,QAAQ;AAChB,iBAAO,OAAO,IAAI;AAAA,QACtB;AACA,eAAO,OAAO,gBAAgB,IAAI;AAAA,MACtC;AAAA,MAEA,IAAI,QAAa,MAAuB,UAAe,UAAe;AAClE,YAAI,QAAQ,QAAQ;AAChB,iBAAO,IAAI,IAAI;AAAA,QACnB,OAAO;AACH,iBAAO,gBAAgB,IAAI,IAAI;AAAA,QACnC;AACA,eAAO;AAAA,MACX;AAAA,IACJ,CAAC;AAAA,EACL;AAAA,EAEA,eAAqB;AACjB,SAAK,gBAAgB,SAAS;AAC9B,WAAO;AAAA,EACX;AAAA,EAEA,eAAqB;AACjB,SAAK,gBAAgB,SAAS;AAC9B,WAAO;AAAA,EACX;AAAA,EAIA,aAAa,UAA8B,QAA0B;AAzCzE;AA0CQ,QAAI,YAAY,QAAW;AACvB,cAAO,UAAK,gBAAgB,gBAArB,YAAoC;AAAA,IAC/C;AACA,SAAK,gBAAgB,cAAc,QAAQ,SAAS;AACpD,WAAO;AAAA,EACX;AACJ;","names":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
type AngelsElement<TElement extends HTMLElement = HTMLElement> = AngelsElementClass<TElement> & TElement;
|
|
2
|
+
declare class AngelsElementClass<TElement extends HTMLElement = HTMLElement> {
|
|
3
|
+
protected originalElement: TElement;
|
|
4
|
+
constructor(element: TElement);
|
|
5
|
+
aHideElement(): this;
|
|
6
|
+
aShowElement(): this;
|
|
7
|
+
aTextContent(): string;
|
|
8
|
+
aTextContent(content: string): this;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export { type AngelsElement, AngelsElementClass };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
type AngelsElement<TElement extends HTMLElement = HTMLElement> = AngelsElementClass<TElement> & TElement;
|
|
2
|
+
declare class AngelsElementClass<TElement extends HTMLElement = HTMLElement> {
|
|
3
|
+
protected originalElement: TElement;
|
|
4
|
+
constructor(element: TElement);
|
|
5
|
+
aHideElement(): this;
|
|
6
|
+
aShowElement(): this;
|
|
7
|
+
aTextContent(): string;
|
|
8
|
+
aTextContent(content: string): this;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export { type AngelsElement, AngelsElementClass };
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
// src/AngelsElement.ts
|
|
2
|
+
var AngelsElementClass = class {
|
|
3
|
+
constructor(element) {
|
|
4
|
+
this.originalElement = element;
|
|
5
|
+
return new Proxy(this, {
|
|
6
|
+
get(target, prop, receiver) {
|
|
7
|
+
if (prop in target) {
|
|
8
|
+
return target[prop];
|
|
9
|
+
}
|
|
10
|
+
return target.originalElement[prop];
|
|
11
|
+
},
|
|
12
|
+
set(target, prop, newValue, receiver) {
|
|
13
|
+
if (prop in target) {
|
|
14
|
+
target[prop] = newValue;
|
|
15
|
+
} else {
|
|
16
|
+
target.originalElement[prop] = newValue;
|
|
17
|
+
}
|
|
18
|
+
return true;
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
aHideElement() {
|
|
23
|
+
this.originalElement.hidden = true;
|
|
24
|
+
return this;
|
|
25
|
+
}
|
|
26
|
+
aShowElement() {
|
|
27
|
+
this.originalElement.hidden = false;
|
|
28
|
+
return this;
|
|
29
|
+
}
|
|
30
|
+
aTextContent(content = void 0) {
|
|
31
|
+
var _a;
|
|
32
|
+
if (content === void 0) {
|
|
33
|
+
return (_a = this.originalElement.textContent) != null ? _a : ``;
|
|
34
|
+
}
|
|
35
|
+
this.originalElement.textContent = content.toString();
|
|
36
|
+
return this;
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
export {
|
|
40
|
+
AngelsElementClass
|
|
41
|
+
};
|
|
42
|
+
//# sourceMappingURL=AngelsElement.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/AngelsElement.ts"],"sourcesContent":["export type AngelsElement<TElement extends HTMLElement = HTMLElement> = AngelsElementClass<TElement> & TElement;\n\nexport class AngelsElementClass<TElement extends HTMLElement = HTMLElement> {\n\n protected originalElement: TElement;\n\n constructor(element: TElement) {\n\n this.originalElement = element;\n\n return new Proxy(this, {\n get(target: any, prop: string | symbol, receiver: any) {\n if (prop in target) {\n return target[prop];\n }\n return target.originalElement[prop];\n },\n\n set(target: any, prop: string | symbol, newValue: any, receiver: any) {\n if (prop in target) {\n target[prop] = newValue;\n } else {\n target.originalElement[prop] = newValue;\n }\n return true;\n }\n });\n }\n\n aHideElement(): this {\n this.originalElement.hidden = true;\n return this;\n }\n\n aShowElement(): this {\n this.originalElement.hidden = false;\n return this;\n }\n\n aTextContent(): string;\n aTextContent(content: string): this;\n aTextContent(content: string | undefined = undefined): this | string {\n if (content === undefined) {\n return this.originalElement.textContent ?? ``;\n }\n this.originalElement.textContent = content.toString();\n return this;\n }\n}\n"],"mappings":";AAEO,IAAM,qBAAN,MAAqE;AAAA,EAIxE,YAAY,SAAmB;AAE3B,SAAK,kBAAkB;AAEvB,WAAO,IAAI,MAAM,MAAM;AAAA,MACnB,IAAI,QAAa,MAAuB,UAAe;AACnD,YAAI,QAAQ,QAAQ;AAChB,iBAAO,OAAO,IAAI;AAAA,QACtB;AACA,eAAO,OAAO,gBAAgB,IAAI;AAAA,MACtC;AAAA,MAEA,IAAI,QAAa,MAAuB,UAAe,UAAe;AAClE,YAAI,QAAQ,QAAQ;AAChB,iBAAO,IAAI,IAAI;AAAA,QACnB,OAAO;AACH,iBAAO,gBAAgB,IAAI,IAAI;AAAA,QACnC;AACA,eAAO;AAAA,MACX;AAAA,IACJ,CAAC;AAAA,EACL;AAAA,EAEA,eAAqB;AACjB,SAAK,gBAAgB,SAAS;AAC9B,WAAO;AAAA,EACX;AAAA,EAEA,eAAqB;AACjB,SAAK,gBAAgB,SAAS;AAC9B,WAAO;AAAA,EACX;AAAA,EAIA,aAAa,UAA8B,QAA0B;AAzCzE;AA0CQ,QAAI,YAAY,QAAW;AACvB,cAAO,UAAK,gBAAgB,gBAArB,YAAoC;AAAA,IAC/C;AACA,SAAK,gBAAgB,cAAc,QAAQ,SAAS;AACpD,WAAO;AAAA,EACX;AACJ;","names":[]}
|
|
@@ -40,41 +40,102 @@ var __async = (__this, __arguments, generator) => {
|
|
|
40
40
|
// src/AngelsFrontAnimationLibrary.ts
|
|
41
41
|
var AngelsFrontAnimationLibrary_exports = {};
|
|
42
42
|
__export(AngelsFrontAnimationLibrary_exports, {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
aLibConcealElement: () => aLibConcealElement,
|
|
44
|
+
aLibEngageElement: () => aLibEngageElement,
|
|
45
|
+
aLibRevealElement: () => aLibRevealElement
|
|
46
46
|
});
|
|
47
47
|
module.exports = __toCommonJS(AngelsFrontAnimationLibrary_exports);
|
|
48
48
|
|
|
49
|
+
// src/AngelsElement.ts
|
|
50
|
+
var AngelsElementClass = class {
|
|
51
|
+
constructor(element) {
|
|
52
|
+
this.originalElement = element;
|
|
53
|
+
return new Proxy(this, {
|
|
54
|
+
get(target, prop, receiver) {
|
|
55
|
+
if (prop in target) {
|
|
56
|
+
return target[prop];
|
|
57
|
+
}
|
|
58
|
+
return target.originalElement[prop];
|
|
59
|
+
},
|
|
60
|
+
set(target, prop, newValue, receiver) {
|
|
61
|
+
if (prop in target) {
|
|
62
|
+
target[prop] = newValue;
|
|
63
|
+
} else {
|
|
64
|
+
target.originalElement[prop] = newValue;
|
|
65
|
+
}
|
|
66
|
+
return true;
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
aHideElement() {
|
|
71
|
+
this.originalElement.hidden = true;
|
|
72
|
+
return this;
|
|
73
|
+
}
|
|
74
|
+
aShowElement() {
|
|
75
|
+
this.originalElement.hidden = false;
|
|
76
|
+
return this;
|
|
77
|
+
}
|
|
78
|
+
aTextContent(content = void 0) {
|
|
79
|
+
var _a;
|
|
80
|
+
if (content === void 0) {
|
|
81
|
+
return (_a = this.originalElement.textContent) != null ? _a : ``;
|
|
82
|
+
}
|
|
83
|
+
this.originalElement.textContent = content.toString();
|
|
84
|
+
return this;
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
|
|
49
88
|
// src/AngelsFrontDOMLibrary.ts
|
|
50
|
-
function
|
|
89
|
+
function aLibFindElement(selector) {
|
|
51
90
|
let element;
|
|
52
91
|
if (typeof selector === "undefined") {
|
|
53
|
-
|
|
92
|
+
return null;
|
|
54
93
|
} else if (selector === null) {
|
|
55
|
-
|
|
94
|
+
return null;
|
|
56
95
|
} else if (typeof selector === "string") {
|
|
57
96
|
const findElement = document.querySelector(selector);
|
|
58
97
|
if (!findElement) {
|
|
59
|
-
|
|
98
|
+
return null;
|
|
60
99
|
}
|
|
61
100
|
element = findElement;
|
|
62
101
|
} else if (selector instanceof HTMLElement) {
|
|
63
102
|
element = selector;
|
|
64
103
|
} else if (selector instanceof Element) {
|
|
65
104
|
element = selector;
|
|
105
|
+
} else if (selector instanceof AngelsElementClass) {
|
|
106
|
+
return selector;
|
|
66
107
|
} else {
|
|
67
108
|
element = selector;
|
|
68
109
|
}
|
|
69
|
-
return element;
|
|
110
|
+
return new AngelsElementClass(element);
|
|
111
|
+
}
|
|
112
|
+
function aLibRequireElement(selector) {
|
|
113
|
+
const element = aLibFindElement(selector);
|
|
114
|
+
if (element) {
|
|
115
|
+
return element;
|
|
116
|
+
}
|
|
117
|
+
throw Error(`Element not found by '${selector}' selector.`);
|
|
70
118
|
}
|
|
71
119
|
|
|
72
120
|
// src/AngelsFrontAnimationLibrary.ts
|
|
73
|
-
function
|
|
121
|
+
function aLibEngageElement(originalElement, switcher = void 0) {
|
|
122
|
+
return __async(this, null, function* () {
|
|
123
|
+
const innerElement = aLibRequireElement(originalElement);
|
|
124
|
+
if (switcher === void 0) {
|
|
125
|
+
switcher = !innerElement.hidden;
|
|
126
|
+
}
|
|
127
|
+
if (switcher) {
|
|
128
|
+
return yield aLibRevealElement(innerElement);
|
|
129
|
+
} else {
|
|
130
|
+
return yield aLibConcealElement(innerElement);
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
function aLibConcealElement(originalElement) {
|
|
74
135
|
return __async(this, null, function* () {
|
|
75
136
|
const innerElement = aLibRequireElement(originalElement);
|
|
76
137
|
const promise = new Promise((resolve) => {
|
|
77
|
-
if (
|
|
138
|
+
if (innerElement.hidden) {
|
|
78
139
|
resolve();
|
|
79
140
|
return;
|
|
80
141
|
}
|
|
@@ -82,42 +143,34 @@ function aLibShowElement(originalElement) {
|
|
|
82
143
|
const animationHandler = () => {
|
|
83
144
|
clearTimeout(timeout);
|
|
84
145
|
innerElement.removeEventListener("animationend", animationHandler);
|
|
146
|
+
innerElement.hidden = true;
|
|
147
|
+
innerElement.classList.remove("a-out-animation");
|
|
85
148
|
resolve();
|
|
86
149
|
};
|
|
87
|
-
innerElement.
|
|
150
|
+
innerElement.classList.add("a-out-animation");
|
|
88
151
|
const animations = innerElement.getAnimations();
|
|
89
152
|
if (animations.length > 0) {
|
|
90
153
|
timeout = setTimeout(() => {
|
|
91
154
|
innerElement.removeEventListener("animationend", animationHandler);
|
|
155
|
+
innerElement.hidden = true;
|
|
156
|
+
innerElement.classList.remove("a-out-animation");
|
|
92
157
|
console.warn("Animation timeout");
|
|
93
158
|
resolve();
|
|
94
159
|
}, 5e3);
|
|
95
160
|
innerElement.addEventListener("animationend", animationHandler);
|
|
96
161
|
} else {
|
|
162
|
+
innerElement.hidden = true;
|
|
97
163
|
resolve();
|
|
98
164
|
}
|
|
99
165
|
});
|
|
100
166
|
return promise;
|
|
101
167
|
});
|
|
102
168
|
}
|
|
103
|
-
function
|
|
104
|
-
return __async(this, null, function* () {
|
|
105
|
-
const innerElement = aLibRequireElement(originalElement);
|
|
106
|
-
if (switcher === void 0) {
|
|
107
|
-
switcher = !innerElement.hidden;
|
|
108
|
-
}
|
|
109
|
-
if (switcher) {
|
|
110
|
-
return yield aLibShowElement(innerElement);
|
|
111
|
-
} else {
|
|
112
|
-
return yield aLibHideElement(innerElement);
|
|
113
|
-
}
|
|
114
|
-
});
|
|
115
|
-
}
|
|
116
|
-
function aLibHideElement(originalElement) {
|
|
169
|
+
function aLibRevealElement(originalElement) {
|
|
117
170
|
return __async(this, null, function* () {
|
|
118
171
|
const innerElement = aLibRequireElement(originalElement);
|
|
119
172
|
const promise = new Promise((resolve) => {
|
|
120
|
-
if (innerElement.hidden) {
|
|
173
|
+
if (!innerElement.hidden) {
|
|
121
174
|
resolve();
|
|
122
175
|
return;
|
|
123
176
|
}
|
|
@@ -125,23 +178,18 @@ function aLibHideElement(originalElement) {
|
|
|
125
178
|
const animationHandler = () => {
|
|
126
179
|
clearTimeout(timeout);
|
|
127
180
|
innerElement.removeEventListener("animationend", animationHandler);
|
|
128
|
-
innerElement.hidden = true;
|
|
129
|
-
innerElement.classList.remove("a-out-animation");
|
|
130
181
|
resolve();
|
|
131
182
|
};
|
|
132
|
-
innerElement.
|
|
183
|
+
innerElement.hidden = false;
|
|
133
184
|
const animations = innerElement.getAnimations();
|
|
134
185
|
if (animations.length > 0) {
|
|
135
186
|
timeout = setTimeout(() => {
|
|
136
187
|
innerElement.removeEventListener("animationend", animationHandler);
|
|
137
|
-
innerElement.hidden = true;
|
|
138
|
-
innerElement.classList.remove("a-out-animation");
|
|
139
188
|
console.warn("Animation timeout");
|
|
140
189
|
resolve();
|
|
141
190
|
}, 5e3);
|
|
142
191
|
innerElement.addEventListener("animationend", animationHandler);
|
|
143
192
|
} else {
|
|
144
|
-
innerElement.hidden = true;
|
|
145
193
|
resolve();
|
|
146
194
|
}
|
|
147
195
|
});
|
|
@@ -150,8 +198,8 @@ function aLibHideElement(originalElement) {
|
|
|
150
198
|
}
|
|
151
199
|
// Annotate the CommonJS export names for ESM import in node:
|
|
152
200
|
0 && (module.exports = {
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
201
|
+
aLibConcealElement,
|
|
202
|
+
aLibEngageElement,
|
|
203
|
+
aLibRevealElement
|
|
156
204
|
});
|
|
157
205
|
//# sourceMappingURL=AngelsFrontAnimationLibrary.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/AngelsFrontAnimationLibrary.ts","../src/AngelsFrontDOMLibrary.ts"],"sourcesContent":["import { aLibRequireElement } from \"./AngelsFrontDOMLibrary\";\n\nexport async function
|
|
1
|
+
{"version":3,"sources":["../src/AngelsFrontAnimationLibrary.ts","../src/AngelsElement.ts","../src/AngelsFrontDOMLibrary.ts"],"sourcesContent":["import { aLibRequireElement } from \"./AngelsFrontDOMLibrary\";\n\nexport async function aLibEngageElement(originalElement: AngelsSelectorType, switcher: boolean | undefined = undefined) {\n const innerElement = aLibRequireElement(originalElement);\n if (switcher === undefined) {\n switcher = !innerElement.hidden;\n }\n if (switcher) {\n return await aLibRevealElement(innerElement);\n } else {\n return await aLibConcealElement(innerElement);\n }\n}\n\nexport async function aLibConcealElement(originalElement: AngelsSelectorType) {\n const innerElement = aLibRequireElement(originalElement);\n const promise = new Promise<void>((resolve) => {\n\n if (innerElement.hidden) {\n resolve();\n return;\n }\n\n let timeout: NodeJS.Timeout | undefined;\n\n const animationHandler = () => {\n clearTimeout(timeout);\n innerElement.removeEventListener('animationend', animationHandler);\n innerElement.hidden = true;\n innerElement.classList.remove('a-out-animation');\n resolve();\n }\n\n innerElement.classList.add('a-out-animation');\n\n const animations = innerElement.getAnimations();\n if (animations.length > 0) {\n timeout = setTimeout(() => {\n innerElement.removeEventListener('animationend', animationHandler);\n innerElement.hidden = true;\n innerElement.classList.remove('a-out-animation');\n console.warn('Animation timeout');\n resolve();\n }, 5000); // 5 seconds timeout\n innerElement.addEventListener('animationend', animationHandler);\n } else {\n innerElement.hidden = true;\n resolve();\n }\n });\n\n return promise;\n}\n\nexport async function aLibRevealElement(originalElement: AngelsSelectorType) {\n const innerElement = aLibRequireElement(originalElement);\n const promise = new Promise<void>((resolve) => {\n\n if (!innerElement.hidden) {\n resolve();\n return;\n }\n\n let timeout: NodeJS.Timeout | undefined;\n\n const animationHandler = () => {\n clearTimeout(timeout);\n innerElement.removeEventListener('animationend', animationHandler);\n resolve();\n }\n\n innerElement.hidden = false;\n\n const animations = innerElement.getAnimations();\n if (animations.length > 0) {\n timeout = setTimeout(() => {\n innerElement.removeEventListener('animationend', animationHandler);\n console.warn('Animation timeout');\n resolve();\n }, 5000); // 5 seconds timeout\n innerElement.addEventListener('animationend', animationHandler);\n } else {\n resolve();\n }\n });\n\n return promise;\n}\n","export type AngelsElement<TElement extends HTMLElement = HTMLElement> = AngelsElementClass<TElement> & TElement;\n\nexport class AngelsElementClass<TElement extends HTMLElement = HTMLElement> {\n\n protected originalElement: TElement;\n\n constructor(element: TElement) {\n\n this.originalElement = element;\n\n return new Proxy(this, {\n get(target: any, prop: string | symbol, receiver: any) {\n if (prop in target) {\n return target[prop];\n }\n return target.originalElement[prop];\n },\n\n set(target: any, prop: string | symbol, newValue: any, receiver: any) {\n if (prop in target) {\n target[prop] = newValue;\n } else {\n target.originalElement[prop] = newValue;\n }\n return true;\n }\n });\n }\n\n aHideElement(): this {\n this.originalElement.hidden = true;\n return this;\n }\n\n aShowElement(): this {\n this.originalElement.hidden = false;\n return this;\n }\n\n aTextContent(): string;\n aTextContent(content: string): this;\n aTextContent(content: string | undefined = undefined): this | string {\n if (content === undefined) {\n return this.originalElement.textContent ?? ``;\n }\n this.originalElement.textContent = content.toString();\n return this;\n }\n}\n","import { AngelsElement, AngelsElementClass } from \"./AngelsElement\";\n\nexport function aLibFindElement<THTMLElement extends HTMLElement>(selector: AngelsSelectorType<THTMLElement>): AngelsElement<THTMLElement> | null {\n\n let element: THTMLElement;\n if (typeof selector === 'undefined') {\n return null;\n } else if (selector === null) {\n return null;\n } else if (typeof selector === 'string') {\n const findElement = document.querySelector<THTMLElement>(selector);\n if (!findElement) {\n return null;\n }\n element = findElement;\n } else if (selector instanceof HTMLElement) {\n element = selector as THTMLElement;\n } else if (selector instanceof Element) {\n element = selector as THTMLElement;\n } else if (selector instanceof AngelsElementClass) {\n return selector as AngelsElement<THTMLElement>;\n } else {\n element = selector;\n }\n return new AngelsElementClass(element) as AngelsElement<THTMLElement>;\n}\n\nexport function aLibRequireElement<THTMLElement extends HTMLElement>(selector: AngelsSelectorType): AngelsElement<THTMLElement> {\n const element = aLibFindElement<THTMLElement>(selector);\n if (element) {\n return element;\n }\n throw Error(`Element not found by '${selector}' selector.`);\n}\n\nexport function aLibHideElement<THTMLElement extends HTMLElement>(selector: AngelsSelectorType): AngelsElement<THTMLElement> {\n const element = aLibRequireElement<THTMLElement>(selector);\n element.hidden = true;\n return element;\n}\n\nexport function aLibShowElement<THTMLElement extends HTMLElement>(selector: AngelsSelectorType): AngelsElement<THTMLElement> {\n const element = aLibRequireElement<THTMLElement>(selector);\n element.hidden = false;\n return element;\n}\n\nexport function aLibToggleElement(originalElement: AngelsSelectorType, switcher: boolean | undefined = undefined) {\n const innerElement = aLibRequireElement(originalElement);\n if (switcher === undefined) {\n switcher = !innerElement.hidden;\n }\n if (switcher) {\n return aLibShowElement(innerElement);\n } else {\n return aLibHideElement(innerElement);\n }\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
declare function
|
|
2
|
-
declare function
|
|
3
|
-
declare function
|
|
1
|
+
declare function aLibEngageElement(originalElement: AngelsSelectorType, switcher?: boolean | undefined): Promise<void>;
|
|
2
|
+
declare function aLibConcealElement(originalElement: AngelsSelectorType): Promise<void>;
|
|
3
|
+
declare function aLibRevealElement(originalElement: AngelsSelectorType): Promise<void>;
|
|
4
4
|
|
|
5
|
-
export {
|
|
5
|
+
export { aLibConcealElement, aLibEngageElement, aLibRevealElement };
|