@dooboostore/simple-web-component 1.0.24 → 1.0.26
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/README.md +162 -33
- package/dist/cjs/decorators/addEventListener.js +1 -1
- package/dist/cjs/decorators/addEventListener.js.map +2 -2
- package/dist/cjs/decorators/applyAttribute.js +148 -0
- package/dist/cjs/decorators/applyAttribute.js.map +7 -0
- package/dist/cjs/decorators/applyClass.js +164 -0
- package/dist/cjs/decorators/applyClass.js.map +7 -0
- package/dist/cjs/decorators/applyNode.js +87 -194
- package/dist/cjs/decorators/applyNode.js.map +2 -2
- package/dist/cjs/decorators/{style.js → applyStyle.js} +50 -60
- package/dist/cjs/decorators/applyStyle.js.map +7 -0
- package/dist/cjs/decorators/attribute.js +10 -16
- package/dist/cjs/decorators/attribute.js.map +2 -2
- package/dist/cjs/decorators/changedAttributeHost.js +1 -1
- package/dist/cjs/decorators/changedAttributeHost.js.map +2 -2
- package/dist/cjs/decorators/elementDefine.js +14 -23
- package/dist/cjs/decorators/elementDefine.js.map +2 -2
- package/dist/cjs/decorators/emitCustomEvent.js +5 -2
- package/dist/cjs/decorators/emitCustomEvent.js.map +2 -2
- package/dist/cjs/decorators/index.js +3 -3
- package/dist/cjs/decorators/index.js.map +2 -2
- package/dist/cjs/decorators/lifecycles.js +9 -9
- package/dist/cjs/decorators/lifecycles.js.map +2 -2
- package/dist/cjs/decorators/query.js +1 -1
- package/dist/cjs/decorators/query.js.map +2 -2
- package/dist/cjs/decorators/queryAll.js +1 -1
- package/dist/cjs/decorators/queryAll.js.map +2 -2
- package/dist/cjs/elements/SwcAppEngine.js +19 -4
- package/dist/cjs/elements/SwcAppEngine.js.map +2 -2
- package/dist/cjs/elements/SwcAppMixin.js +2 -0
- package/dist/cjs/elements/SwcAppMixin.js.map +2 -2
- package/dist/cjs/utils/Utils.js +1 -1
- package/dist/cjs/utils/Utils.js.map +2 -2
- package/dist/esm/decorators/addEventListener.js +1 -1
- package/dist/esm/decorators/addEventListener.js.map +2 -2
- package/dist/esm/decorators/applyAttribute.js +129 -0
- package/dist/esm/decorators/applyAttribute.js.map +7 -0
- package/dist/esm/decorators/applyClass.js +145 -0
- package/dist/esm/decorators/applyClass.js.map +7 -0
- package/dist/esm/decorators/applyNode.js +87 -194
- package/dist/esm/decorators/applyNode.js.map +2 -2
- package/dist/esm/decorators/{style.js → applyStyle.js} +47 -57
- package/dist/esm/decorators/applyStyle.js.map +7 -0
- package/dist/esm/decorators/attribute.js +10 -16
- package/dist/esm/decorators/attribute.js.map +2 -2
- package/dist/esm/decorators/changedAttributeHost.js +1 -1
- package/dist/esm/decorators/changedAttributeHost.js.map +2 -2
- package/dist/esm/decorators/elementDefine.js +14 -23
- package/dist/esm/decorators/elementDefine.js.map +2 -2
- package/dist/esm/decorators/emitCustomEvent.js +5 -2
- package/dist/esm/decorators/emitCustomEvent.js.map +2 -2
- package/dist/esm/decorators/index.js +3 -3
- package/dist/esm/decorators/index.js.map +1 -1
- package/dist/esm/decorators/lifecycles.js +9 -9
- package/dist/esm/decorators/lifecycles.js.map +2 -2
- package/dist/esm/decorators/query.js +1 -1
- package/dist/esm/decorators/query.js.map +2 -2
- package/dist/esm/decorators/queryAll.js +1 -1
- package/dist/esm/decorators/queryAll.js.map +2 -2
- package/dist/esm/elements/SwcAppEngine.js +19 -4
- package/dist/esm/elements/SwcAppEngine.js.map +2 -2
- package/dist/esm/elements/SwcAppMixin.js +2 -0
- package/dist/esm/elements/SwcAppMixin.js.map +2 -2
- package/dist/esm/utils/Utils.js +1 -1
- package/dist/esm/utils/Utils.js.map +2 -2
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +2853 -574
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +4 -4
- package/dist/types/decorators/addEventListener.d.ts.map +1 -1
- package/dist/types/decorators/applyAttribute.d.ts +22 -0
- package/dist/types/decorators/applyAttribute.d.ts.map +1 -0
- package/dist/types/decorators/applyClass.d.ts +65 -0
- package/dist/types/decorators/applyClass.d.ts.map +1 -0
- package/dist/types/decorators/applyNode.d.ts +15 -123
- package/dist/types/decorators/applyNode.d.ts.map +1 -1
- package/dist/types/decorators/applyStyle.d.ts +21 -0
- package/dist/types/decorators/applyStyle.d.ts.map +1 -0
- package/dist/types/decorators/attribute.d.ts +10 -19
- package/dist/types/decorators/attribute.d.ts.map +1 -1
- package/dist/types/decorators/changedAttributeHost.d.ts.map +1 -1
- package/dist/types/decorators/elementDefine.d.ts.map +1 -1
- package/dist/types/decorators/emitCustomEvent.d.ts +1 -1
- package/dist/types/decorators/emitCustomEvent.d.ts.map +1 -1
- package/dist/types/decorators/index.d.ts +3 -3
- package/dist/types/decorators/index.d.ts.map +1 -1
- package/dist/types/decorators/lifecycles.d.ts.map +1 -1
- package/dist/types/decorators/query.d.ts.map +1 -1
- package/dist/types/decorators/queryAll.d.ts.map +1 -1
- package/dist/types/elements/SwcAppEngine.d.ts +7 -0
- package/dist/types/elements/SwcAppEngine.d.ts.map +1 -1
- package/dist/types/elements/SwcAppMixin.d.ts +1 -1
- package/dist/types/elements/SwcAppMixin.d.ts.map +1 -1
- package/dist/types/utils/Utils.d.ts.map +1 -1
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js +2853 -574
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +4 -4
- package/package.json +2 -2
- package/src/decorators/addEventListener.ts +1 -1
- package/src/decorators/applyAttribute.ts +147 -0
- package/src/decorators/applyClass.ts +158 -0
- package/src/decorators/applyNode.ts +112 -330
- package/src/decorators/applyStyle.ts +128 -0
- package/src/decorators/attribute.ts +21 -55
- package/src/decorators/changedAttributeHost.ts +1 -1
- package/src/decorators/elementDefine.ts +18 -39
- package/src/decorators/emitCustomEvent.ts +6 -3
- package/src/decorators/index.ts +3 -3
- package/src/decorators/lifecycles.ts +9 -11
- package/src/decorators/query.ts +1 -1
- package/src/decorators/queryAll.ts +1 -1
- package/src/elements/SwcAppEngine.ts +32 -4
- package/src/elements/SwcAppMixin.ts +2 -0
- package/src/utils/Utils.ts +2 -1
- package/dist/cjs/decorators/classList.js +0 -177
- package/dist/cjs/decorators/classList.js.map +0 -7
- package/dist/cjs/decorators/setAttribute.js +0 -111
- package/dist/cjs/decorators/setAttribute.js.map +0 -7
- package/dist/cjs/decorators/style.js.map +0 -7
- package/dist/esm/decorators/classList.js +0 -158
- package/dist/esm/decorators/classList.js.map +0 -7
- package/dist/esm/decorators/setAttribute.js +0 -92
- package/dist/esm/decorators/setAttribute.js.map +0 -7
- package/dist/esm/decorators/style.js.map +0 -7
- package/dist/types/decorators/classList.d.ts +0 -71
- package/dist/types/decorators/classList.d.ts.map +0 -1
- package/dist/types/decorators/setAttribute.d.ts +0 -23
- package/dist/types/decorators/setAttribute.d.ts.map +0 -1
- package/dist/types/decorators/style.d.ts +0 -58
- package/dist/types/decorators/style.d.ts.map +0 -1
- package/src/decorators/classList.ts +0 -234
- package/src/decorators/setAttribute.ts +0 -114
- package/src/decorators/style.ts +0 -185
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/applyNode.ts"],
|
|
4
|
-
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\nimport { SwcRootType } from '../types';\nimport {SwcUtils} from \"../utils/Utils\";\n\nexport type ApplyNodePosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd' | 'replace' | 'replaceChildren' | 'innerHtml' | 'innerText' | 'remove';\n\nexport interface ApplyNodeOptions {\n position?: ApplyNodePosition;\n root?: SwcRootType;\n}\n\nexport interface ApplyNodeMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: ApplyNodeOptions;\n}\n\nexport const APPLY_NODE_METADATA_KEY = Symbol('simple-web-component:apply-node');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n const items = Array.isArray(res) ? res : [res];\n return items.map(it => {\n if (it instanceof Node) return it;\n return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n });\n};\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n * \n * Usage examples:\n * @applyNode('#list') addItem() { return '<li>New Item</li>'; } // append at end\n * @applyNode('#header', { position: 'afterBegin' }) prependItem() { return '<h1>Title</h1>'; } // prepend at start\n * @applyNode('#item', { position: 'replace' }) replaceItem() { return '<div>Replaced</div>'; } // replace element\n * @applyNode('#list', { position: 'replaceChildren' }) updateList() { return [item1, item2]; } // replace all children\n * @applyNode('#notification', { position: 'remove' }) dismissNotification() { return shouldDismiss; } // remove if truthy\n * @applyNode('.items', { position: 'remove', root: 'shadow' }) clearItems() { return true; } // remove shadow DOM elements\n * \n * Positions:\n * - 'beforeEnd' (default): Append at end of target\n * - 'afterBegin': Prepend at start of target\n * - 'beforeBegin': Insert before target\n * - 'afterEnd': Insert after target\n * - 'replace': Replace the entire target element\n * - 'replaceChildren': Replace all children of target element\n * - 'innerHtml': Set target's innerHTML\n * - 'innerText': Set target's innerText\n * - 'remove': Remove target element if returned value is truthy\n * \n * Root Options:\n * - 'auto' (default): Search shadow DOM first, then light DOM\n * - 'shadow': Search only in shadow DOM\n * - 'light': Search only in light DOM\n * - 'all': Use both (shadow preferred for query, both for remove)\n */\nexport function applyNode(selector: string, options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = target.constructor;\n let metaList = ReflectUtils.getOwnMetadata(APPLY_NODE_METADATA_KEY, constructor) as Map<string | symbol, ApplyNodeMetadata>;\n if (!metaList) {\n metaList = new Map<string | symbol, ApplyNodeMetadata>();\n ReflectUtils.defineMetadata(APPLY_NODE_METADATA_KEY, metaList, constructor);\n }\n metaList.set(propertyKey, { propertyKey, selector, options });\n\n const original = descriptor.value;\n descriptor.value = async function (...args: any[]) {\n ensureInit(this);\n const res = await original.apply(this, args);\n if (res !== undefined) {\n const conf = getElementConfig(this);\n const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n const currentDoc = currentWin.document;\n\n const pos = options.position || 'beforeEnd';\n const r = options.root || 'auto';\n const applyRoot = (t: any) => {\n if (!t || !(t instanceof HTMLElement)) return t;\n if (r === 'auto') return t.shadowRoot || t;\n if (r === 'shadow') return t.shadowRoot;\n if (r === 'light') return t;\n if (r === 'all') return t.shadowRoot || t; // query only returns one, so shadow preferred\n return t;\n };\n\n const hostSet = SwcUtils.getHostSet(this);\n // const getTargetRoot = () => {\n // if (r === 'shadow') return this.shadowRoot;\n // if (r === 'light') return this as any;\n // if (r === 'all') return this.shadowRoot || (this as any);\n // return this.shadowRoot || (this as any); // auto\n // };\n\n if (pos === 'remove') {\n // Remove element(s) if returned value is truthy\n if (res) {\n if (selector === ':host' || !selector) {\n if (r === 'shadow' && this.shadowRoot) {\n // Remove all children from shadow DOM\n this.shadowRoot.replaceChildren();\n } else {\n // Remove the component itself\n (this as any).remove();\n }\n } else {\n const targetRoot = applyRoot(this);\n if (targetRoot) {\n const targets = targetRoot.querySelectorAll(selector);\n targets.forEach((el: Element) => el.remove());\n }\n }\n }\n } else {\n let targetEl: any = null;\n\n if (selector === ':host') {\n targetEl = applyRoot(this)\n } else if (selector === ':parentHost') {\n targetEl = applyRoot(hostSet.$parentHost)\n } else if (selector === ':appHost') {\n targetEl = applyRoot(hostSet.$appHost)\n } else if (selector === ':firstHost') {\n targetEl = applyRoot(hostSet.$firstHost)\n } else if (selector === ':lastHost') {\n targetEl = applyRoot(hostSet.$lastHost)\n } else if (selector === ':firstAppHost') {\n targetEl = applyRoot(hostSet.$firstHost)\n } else if (selector === ':lastAppHost') {\n targetEl = applyRoot(hostSet.$lastAppHost);\n } else {\n const targetRoot = applyRoot(this);\n targetEl = targetRoot ? targetRoot.querySelector(selector) : null;\n }\n\n if (targetEl) {\n const isShadowRoot = targetEl instanceof ShadowRoot;\n const nodes = normalizeNodes(res, currentDoc);\n\n if (pos === 'replace') {\n // ShadowRoot doesn't support replaceWith\n if (!isShadowRoot) {\n targetEl.replaceWith(...nodes);\n }\n } else if (pos === 'replaceChildren') {\n // Replace all children of target element\n targetEl.replaceChildren(...nodes);\n } else if (pos === 'innerHtml') {\n // Set innerHTML\n targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n } else if (pos === 'innerText') {\n // Set innerText\n if (targetEl.innerText !== undefined) {\n targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n }\n } else {\n /*\n <!-- beforebegin -->\n <p>\n <!-- afterbegin -->\n foo\n <!-- beforeend -->\n </p>\n <!-- afterend -->\n */\n if (pos === 'beforeEnd') targetEl.append(...nodes);\n else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n else if (pos === 'beforeBegin' && !isShadowRoot) targetEl.before(...nodes);\n else if (pos === 'afterEnd' && !isShadowRoot) targetEl.after(...nodes);\n }\n }\n }\n }\n return res;\n };\n };\n}\n\nexport const findAllApplyNodeMetadata = (target: any): Map<string | symbol, ApplyNodeMetadata> => {\n const result = new Map<string | symbol, ApplyNodeMetadata>();\n const maps = ReflectUtils.findAllMetadata<Map<string | symbol, ApplyNodeMetadata>>(APPLY_NODE_METADATA_KEY, target);\n maps.forEach(map => {\n if (map instanceof Map) {\n map.forEach((v, k) => result.set(k, v));\n }\n });\n return result;\n};\n\n/**\n * @applyNodeHost decorator - simplified version of @applyNode for :host selector\n * Usage: @applyNodeHost addItem() { return '<li>New Item</li>'; }\n * Usage: @applyNodeHost() addItem() { return '<li>New Item</li>'; }\n * Usage: @applyNodeHost({ position: 'afterBegin' }) prependItem() { return '<h1>Title</h1>'; }\n */\nexport function applyNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyNodeHost(): MethodDecorator;\nexport function applyNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n // Direct decorator usage: @applyNodeHost (no parentheses)\n console.log('vvvvv')\n if (propertyKey !== undefined && typeof propertyKey === 'string' || typeof propertyKey === 'symbol') {\n return applyNode(':host', { position: 'beforeEnd' })(targetOrOptions, propertyKey, descriptor);\n }\n\n // @applyNodeHost() or @applyNodeHost(options)\n if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {\n const options = targetOrOptions as ApplyNodeOptions;\n return applyNode(':host', { ...options, position: options.position || 'beforeEnd' });\n } else {\n // @applyNodeHost() - use default position\n return applyNode(':host', { position: 'beforeEnd' });\n }\n}\n\n// Convenience decorators for specific positions\n\n/**\n * @applyBeforeBeginNode - Insert before target element\n */\nexport function applyBeforeBeginNode(selector: string): MethodDecorator;\nexport function applyBeforeBeginNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeBeginNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'beforeBegin' });\n}\n\n/**\n * @applyAfterBeginNode - Prepend to target element\n */\nexport function applyAfterBeginNode(selector: string): MethodDecorator;\nexport function applyAfterBeginNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterBeginNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'afterBegin' });\n}\n\n/**\n * @applyBeforeEndNode - Append to target element (default)\n */\nexport function applyBeforeEndNode(selector: string): MethodDecorator;\nexport function applyBeforeEndNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeEndNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'beforeEnd' });\n}\n\n/**\n * @applyAfterEndNode - Insert after target element\n */\nexport function applyAfterEndNode(selector: string): MethodDecorator;\nexport function applyAfterEndNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterEndNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'afterEnd' });\n}\n\n/**\n * @applyReplaceNode - Replace entire target element\n */\nexport function applyReplaceNode(selector: string): MethodDecorator;\nexport function applyReplaceNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'replace' });\n}\n\n/**\n * @applyReplaceChildrenNode - Replace all children of target element\n */\nexport function applyReplaceChildrenNode(selector: string): MethodDecorator;\nexport function applyReplaceChildrenNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceChildrenNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'replaceChildren' });\n}\n\n/**\n * @applyInnerHtmlNode - Set target's innerHTML\n */\nexport function applyInnerHtmlNode(selector: string): MethodDecorator;\nexport function applyInnerHtmlNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerHtmlNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'innerHtml' });\n}\n\n/**\n * @applyInnerTextNode - Set target's innerText\n */\nexport function applyInnerTextNode(selector: string): MethodDecorator;\nexport function applyInnerTextNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerTextNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'innerText' });\n}\n\n/**\n * @applyRemoveNode - Remove target element if truthy\n */\nexport function applyRemoveNode(selector: string): MethodDecorator;\nexport function applyRemoveNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyRemoveNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'remove' });\n}\n\n// Host versions\n\n/**\n * @applyBeforeBeginNodeHost - Insert before :host\n */\nexport function applyBeforeBeginNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;\nexport function applyBeforeBeginNodeHost(): MethodDecorator;\nexport function applyBeforeBeginNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeBeginNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'beforeBegin' });\n return decorator(targetOrOptions, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(targetOrOptions as ApplyNodeOptions || {}), position: 'beforeBegin' });\n}\n\n/**\n * @applyAfterBeginNodeHost - Prepend to :host\n */export function applyAfterBeginNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyAfterBeginNodeHost(): MethodDecorator;\nexport function applyAfterBeginNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterBeginNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'afterBegin' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'afterBegin' });\n}\n\n/**\n * @applyBeforeEndNodeHost - Append to :host\n */export function applyBeforeEndNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyBeforeEndNodeHost(): MethodDecorator;\nexport function applyBeforeEndNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeEndNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'beforeEnd' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'beforeEnd' });\n}\n\n/**\n * @applyAfterEndNodeHost - Insert after :host\n */export function applyAfterEndNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyAfterEndNodeHost(): MethodDecorator;\nexport function applyAfterEndNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterEndNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'afterEnd' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'afterEnd' });\n}\n\n/**\n * @applyReplaceNodeHost - Replace :host\n */export function applyReplaceNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyReplaceNodeHost(): MethodDecorator;\nexport function applyReplaceNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'replace' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'replace' });\n}\n\n/**\n * @applyReplaceChildrenNodeHost - Replace children of :host\n */export function applyReplaceChildrenNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyReplaceChildrenNodeHost(): MethodDecorator;\nexport function applyReplaceChildrenNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceChildrenNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'replaceChildren' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'replaceChildren' });\n}\n\n/**\n * @applyInnerHtmlNodeHost - Set :host innerHTML\n */export function applyInnerHtmlNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyInnerHtmlNodeHost(): MethodDecorator;\nexport function applyInnerHtmlNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerHtmlNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'innerHtml' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'innerHtml' });\n}\n\n/**\n * @applyInnerTextNodeHost - Set :host innerText\n */export function applyInnerTextNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyInnerTextNodeHost(): MethodDecorator;\nexport function applyInnerTextNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerTextNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'innerText' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'innerText' });\n}\n\n/**\n * @applyRemoveNodeHost - Remove :host if truthy\n */export function applyRemoveNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyRemoveNodeHost(): MethodDecorator;\nexport function applyRemoveNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyRemoveNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'remove' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'remove' });\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA
|
|
4
|
+
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\nimport { HelperHostSet, SwcRootType } from '../types';\nimport { SwcUtils } from \"../utils/Utils\";\n\nexport type ApplyNodePosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd' | 'replace' | 'replaceChildren' | 'innerHtml' | 'innerText' | 'remove';\n\nexport interface ApplyNodeOptions {\n position?: ApplyNodePosition;\n root?: SwcRootType;\n /**\n * Filter function to determine whether to perform DOM operation.\n * If it returns false, the operation is skipped.\n */\n filter?: (target: HTMLElement | ShadowRoot, newValue: any, helper: HelperHostSet) => boolean;\n /**\n * Optional loading content to display while an async method is executing.\n */\n loading?: (helper: HelperHostSet) => any;\n}\n\nexport interface ApplyNodeMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: ApplyNodeOptions;\n}\n\nexport const APPLY_NODE_METADATA_KEY = Symbol.for('simple-web-component:apply-node');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n const items = Array.isArray(res) ? res : [res];\n return items.map(it => {\n if (it instanceof Node) return it;\n return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n });\n};\n\nconst applyToDom = (targetEl: any, res: any, pos: ApplyNodePosition, doc: Document) => {\n if (!targetEl) return;\n \n if (pos === 'innerHtml') {\n targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n return;\n }\n \n if (pos === 'innerText') {\n if (targetEl.innerText !== undefined) {\n targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n }\n return;\n }\n\n const isShadowRoot = targetEl instanceof ShadowRoot;\n const nodes = normalizeNodes(res, doc);\n if (pos === 'replace') {\n if (!isShadowRoot) targetEl.replaceWith(...nodes);\n } else if (pos === 'replaceChildren') {\n targetEl.replaceChildren(...nodes);\n } else {\n if (pos === 'beforeEnd') targetEl.append(...nodes);\n else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n else if (pos === 'beforeBegin' && !isShadowRoot) targetEl.before(...nodes);\n else if (pos === 'afterEnd' && !isShadowRoot) targetEl.after(...nodes);\n }\n};\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n */\nexport function applyNode(selector: string, options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = targetObj.constructor;\n let metaList = ReflectUtils.getOwnMetadata(APPLY_NODE_METADATA_KEY, constructor) as Map<string | symbol, ApplyNodeMetadata>;\n if (!metaList) {\n metaList = new Map<string | symbol, ApplyNodeMetadata>();\n ReflectUtils.defineMetadata(APPLY_NODE_METADATA_KEY, metaList, constructor);\n }\n metaList.set(propertyKey, { propertyKey, selector, options });\n\n const original = descriptor.value;\n descriptor.value = function (...args: any[]) {\n ensureInit(this);\n \n const conf = getElementConfig(this);\n const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n const currentDoc = currentWin.document;\n const hostSet = SwcUtils.getHelperAndHostSet(currentWin, this);\n \n const getTarget = () => {\n const r = options.root || 'auto';\n const applyRoot = (t: any) => {\n if (!t) return t;\n if (r === 'auto') return t.shadowRoot || t;\n if (r === 'shadow') return t.shadowRoot;\n if (r === 'light') return t;\n if (r === 'all') return t.shadowRoot || t;\n return t;\n };\n\n if (selector === ':host') return applyRoot(this);\n if (selector === ':parentHost') return applyRoot(hostSet.$parentHost);\n if (selector === ':appHost') return applyRoot(hostSet.$appHost);\n if (selector === ':firstHost') return applyRoot(hostSet.$firstHost);\n if (selector === ':lastHost') return applyRoot(hostSet.$lastHost);\n \n const targetRoot = applyRoot(this);\n return targetRoot ? targetRoot.querySelector(selector) : null;\n };\n\n const targetEl = getTarget();\n const res = original.apply(this, args);\n\n const runApply = (target: any, val: any) => {\n const pos = options.position || 'beforeEnd';\n \n // Intelligent Default Filter\n const defaultFilter = (t: any, v: any) => {\n if (v instanceof Node) return !t.contains(v);\n if (pos === 'innerHtml' && typeof v === 'string') return t.innerHTML !== v;\n if (pos === 'replaceChildren' && v instanceof Node) return !t.contains(v);\n return true;\n };\n \n const activeFilter = options.filter || defaultFilter;\n \n if (activeFilter(target, val, hostSet)) {\n applyToDom(target, val, pos, currentDoc);\n }\n };\n\n if (res instanceof Promise) {\n // \uBE44\uB3D9\uAE30\uC77C \uB54C\uB9CC \uB85C\uB529 \uD45C\uC2DC\n if (targetEl && options.loading) {\n const loadingRes = options.loading.call(this, hostSet);\n applyToDom(targetEl, loadingRes, options.position || 'beforeEnd', currentDoc);\n }\n\n return res.then(finalRes => {\n if (finalRes !== undefined && targetEl) runApply(targetEl, finalRes);\n return finalRes;\n });\n } else {\n if (res !== undefined && targetEl) runApply(targetEl, res);\n return res;\n }\n };\n };\n}\n\nexport const findAllApplyNodeMetadata = (target: any): Map<string | symbol, ApplyNodeMetadata> => {\n const result = new Map<string | symbol, ApplyNodeMetadata>();\n const maps = ReflectUtils.findAllMetadata<Map<string | symbol, ApplyNodeMetadata>>(APPLY_NODE_METADATA_KEY, target);\n maps.forEach(map => {\n if (map instanceof Map) {\n map.forEach((v, k) => result.set(k, v));\n }\n });\n return result;\n};\n\nexport function applyNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) return applyNode(':host', { position: 'beforeEnd' })(targetOrOptions, propertyKey, descriptor);\n const opt = targetOrOptions || {};\n return applyNode(':host', { position: 'beforeEnd', ...opt });\n}\n\nexport function applyReplaceChildrenNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceChildrenNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyReplaceChildrenNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) return applyNode(':host', { position: 'replaceChildren' })(targetOrOptions, propertyKey, descriptor);\n const opt = targetOrOptions || {};\n return applyNode(':host', { position: 'replaceChildren', ...opt });\n}\n\nexport function applyInnerHtmlNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerHtmlNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyInnerHtmlNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) return applyNode(':host', { position: 'innerHtml' })(targetOrOptions, propertyKey, descriptor);\n const opt = targetOrOptions || {};\n return applyNode(':host', { position: 'innerHtml', ...opt });\n}\n\nexport function applyReplaceChildrenNode(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n return applyNode(selector, { ...options, position: 'replaceChildren' });\n}\n\nexport function applyInnerHtmlNode(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n return applyNode(selector, { ...options, position: 'innerHtml' });\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -15,9 +15,11 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
15
15
|
return to;
|
|
16
16
|
};
|
|
17
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
-
var
|
|
19
|
-
__export(
|
|
18
|
+
var applyStyle_exports = {};
|
|
19
|
+
__export(applyStyle_exports, {
|
|
20
20
|
STYLE_METADATA_KEY: () => STYLE_METADATA_KEY,
|
|
21
|
+
applyStyle: () => applyStyle,
|
|
22
|
+
applyStyleHost: () => applyStyleHost,
|
|
21
23
|
findAllStyleMetadata: () => findAllStyleMetadata,
|
|
22
24
|
removeStyle: () => removeStyle,
|
|
23
25
|
removeStyleHost: () => removeStyleHost,
|
|
@@ -26,11 +28,11 @@ __export(style_exports, {
|
|
|
26
28
|
updateStyle: () => updateStyle,
|
|
27
29
|
updateStyleHost: () => updateStyleHost
|
|
28
30
|
});
|
|
29
|
-
module.exports = __toCommonJS(
|
|
31
|
+
module.exports = __toCommonJS(applyStyle_exports);
|
|
30
32
|
var import_core = require("@dooboostore/core");
|
|
31
33
|
var import_elementDefine = require("./elementDefine");
|
|
32
34
|
var import_Utils = require("../utils/Utils");
|
|
33
|
-
const STYLE_METADATA_KEY = Symbol("simple-web-component:style");
|
|
35
|
+
const STYLE_METADATA_KEY = Symbol.for("simple-web-component:style");
|
|
34
36
|
function createStyleDecorator(action) {
|
|
35
37
|
return (selector, options = {}) => {
|
|
36
38
|
return (target, propertyKey, descriptor) => {
|
|
@@ -46,18 +48,14 @@ function createStyleDecorator(action) {
|
|
|
46
48
|
(0, import_elementDefine.ensureInit)(this);
|
|
47
49
|
const res = await original.apply(this, args);
|
|
48
50
|
if (res !== void 0) {
|
|
51
|
+
const win = this.ownerDocument?.defaultView || window;
|
|
52
|
+
const host = this;
|
|
53
|
+
const hostSet = { ...import_Utils.SwcUtils.getHelperAndHostSet(win, host), $this: this };
|
|
49
54
|
const r = options.root || "auto";
|
|
50
|
-
const hostSet = import_Utils.SwcUtils.getHostSet(this);
|
|
51
55
|
const targetEls = [];
|
|
52
56
|
const applyRoot = (t) => {
|
|
53
|
-
if (!t || !(t instanceof HTMLElement)) return;
|
|
54
|
-
|
|
55
|
-
targetEls.push(t);
|
|
56
|
-
} else {
|
|
57
|
-
if (r === "light" || r === "all") targetEls.push(t);
|
|
58
|
-
if ((r === "shadow" || r === "all") && t.shadowRoot) {
|
|
59
|
-
}
|
|
60
|
-
}
|
|
57
|
+
if (!t || !(t instanceof win.HTMLElement)) return;
|
|
58
|
+
targetEls.push(t);
|
|
61
59
|
};
|
|
62
60
|
if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
|
|
63
61
|
else if (selector === ":appHost") applyRoot(hostSet.$appHost);
|
|
@@ -67,71 +65,63 @@ function createStyleDecorator(action) {
|
|
|
67
65
|
else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
|
|
68
66
|
else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
|
|
69
67
|
else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
|
|
70
|
-
else if (selector === ":host" || !selector) applyRoot(
|
|
68
|
+
else if (selector === ":host" || !selector) applyRoot(host);
|
|
71
69
|
else {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
} else if (r === "light") {
|
|
76
|
-
const found = this.querySelectorAll(selector);
|
|
77
|
-
if (found) targetEls.push(...Array.from(found));
|
|
78
|
-
} else if (r === "all") {
|
|
79
|
-
const sFound = this.shadowRoot?.querySelectorAll(selector);
|
|
80
|
-
const lFound = this.querySelectorAll(selector);
|
|
81
|
-
if (sFound) targetEls.push(...Array.from(sFound));
|
|
82
|
-
if (lFound) targetEls.push(...Array.from(lFound));
|
|
83
|
-
} else {
|
|
84
|
-
const found = (this.shadowRoot || this).querySelectorAll(selector);
|
|
70
|
+
const targetRoot = r === "auto" ? host.shadowRoot || host : r === "shadow" ? host.shadowRoot : host;
|
|
71
|
+
if (targetRoot) {
|
|
72
|
+
const found = targetRoot.querySelectorAll(selector);
|
|
85
73
|
if (found) targetEls.push(...Array.from(found));
|
|
86
74
|
}
|
|
87
75
|
}
|
|
88
76
|
targetEls.forEach((targetEl) => {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
if (
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
77
|
+
const resolvedRes = typeof res === "function" ? res(targetEl, hostSet) : res;
|
|
78
|
+
if (action === "set" || action === "update") {
|
|
79
|
+
if (action === "set") targetEl.style.cssText = "";
|
|
80
|
+
if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
|
|
81
|
+
Object.entries(resolvedRes).forEach(([prop, val]) => {
|
|
82
|
+
const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
|
|
83
|
+
if (finalVal === null || finalVal === void 0) {
|
|
84
|
+
targetEl.style.removeProperty(prop);
|
|
85
|
+
} else {
|
|
86
|
+
targetEl.style[prop] = String(finalVal);
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
} else if (typeof resolvedRes === "string") {
|
|
90
|
+
targetEl.style.cssText = resolvedRes;
|
|
99
91
|
}
|
|
100
92
|
} else if (action === "remove") {
|
|
101
|
-
|
|
102
|
-
|
|
93
|
+
if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
|
|
94
|
+
Object.entries(resolvedRes).forEach(([prop, val]) => {
|
|
95
|
+
const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
|
|
96
|
+
if (shouldRemove) {
|
|
97
|
+
targetEl.style.removeProperty(prop);
|
|
98
|
+
}
|
|
99
|
+
});
|
|
100
|
+
} else {
|
|
101
|
+
const props = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];
|
|
102
|
+
props.forEach((p) => targetEl.style.removeProperty(String(p)));
|
|
103
|
+
}
|
|
103
104
|
}
|
|
104
105
|
});
|
|
105
106
|
}
|
|
106
107
|
return res;
|
|
107
108
|
};
|
|
109
|
+
return descriptor;
|
|
108
110
|
};
|
|
109
111
|
};
|
|
110
112
|
}
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
if (propertyKey !== void 0) {
|
|
114
|
-
const decorator = createStyleDecorator("set")(":host", {});
|
|
115
|
-
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
116
|
-
}
|
|
117
|
-
return createStyleDecorator("set")(":host", targetOrOptions || {});
|
|
113
|
+
function applyStyle(selector, action = "update", options = {}) {
|
|
114
|
+
return createStyleDecorator(action)(selector, options);
|
|
118
115
|
}
|
|
116
|
+
const setStyle = (selector, options = {}) => createStyleDecorator("set")(selector, options);
|
|
119
117
|
const updateStyle = (selector, options = {}) => createStyleDecorator("update")(selector, options);
|
|
120
|
-
function updateStyleHost(targetOrOptions, propertyKey, descriptor) {
|
|
121
|
-
if (propertyKey !== void 0) {
|
|
122
|
-
const decorator = createStyleDecorator("update")(":host", {});
|
|
123
|
-
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
124
|
-
}
|
|
125
|
-
return createStyleDecorator("update")(":host", targetOrOptions || {});
|
|
126
|
-
}
|
|
127
118
|
const removeStyle = (selector, options = {}) => createStyleDecorator("remove")(selector, options);
|
|
128
|
-
function
|
|
129
|
-
|
|
130
|
-
const decorator = createStyleDecorator("remove")(":host", {});
|
|
131
|
-
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
132
|
-
}
|
|
133
|
-
return createStyleDecorator("remove")(":host", targetOrOptions || {});
|
|
119
|
+
function applyStyleHost(action = "update", options = {}) {
|
|
120
|
+
return createStyleDecorator(action)(":host", options);
|
|
134
121
|
}
|
|
122
|
+
const setStyleHost = (options = {}) => createStyleDecorator("set")(":host", options);
|
|
123
|
+
const updateStyleHost = (options = {}) => createStyleDecorator("update")(":host", options);
|
|
124
|
+
const removeStyleHost = (options = {}) => createStyleDecorator("remove")(":host", options);
|
|
135
125
|
const findAllStyleMetadata = (target) => {
|
|
136
126
|
const result = /* @__PURE__ */ new Map();
|
|
137
127
|
const maps = import_core.ReflectUtils.findAllMetadata(STYLE_METADATA_KEY, target);
|
|
@@ -142,4 +132,4 @@ const findAllStyleMetadata = (target) => {
|
|
|
142
132
|
});
|
|
143
133
|
return result;
|
|
144
134
|
};
|
|
145
|
-
//# sourceMappingURL=
|
|
135
|
+
//# sourceMappingURL=applyStyle.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/decorators/applyStyle.ts"],
|
|
4
|
+
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit } from './elementDefine';\nimport { SwcUtils } from '../utils/Utils';\nimport { SwcQueryOptions, HelperHostSet } from '../types';\n\nexport type StyleAction = 'set' | 'update' | 'remove';\n\nexport interface StyleApplyOptions extends SwcQueryOptions {}\n\nexport interface StyleApplyMetadata {\n propertyKey: string | symbol;\n selector: string;\n action: StyleAction;\n options: StyleApplyOptions;\n}\n\nexport const STYLE_METADATA_KEY = Symbol.for('simple-web-component:style');\n\nfunction createStyleDecorator(action: StyleAction) {\n return (selector: string, options: StyleApplyOptions = {}): MethodDecorator => {\n return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = target.constructor;\n let metaList = ReflectUtils.getOwnMetadata(STYLE_METADATA_KEY, constructor) as Map<string | symbol, StyleApplyMetadata>;\n if (!metaList) {\n metaList = new Map<string | symbol, StyleApplyMetadata>();\n ReflectUtils.defineMetadata(STYLE_METADATA_KEY, metaList, constructor);\n }\n metaList.set(propertyKey, { propertyKey, selector, action, options });\n\n const original = descriptor.value;\n descriptor.value = async function (...args: any[]) {\n ensureInit(this);\n const res = await (original as any).apply(this, args);\n if (res !== undefined) {\n const win = (this as any).ownerDocument?.defaultView || window;\n const host = this as unknown as HTMLElement;\n const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host), $this: this };\n const r = options.root || 'auto';\n const targetEls: HTMLElement[] = [];\n\n const applyRoot = (t: any) => {\n if (!t || !(t instanceof win.HTMLElement)) return;\n targetEls.push(t);\n };\n\n if (selector === ':parentHost') applyRoot(hostSet.$parentHost);\n else if (selector === ':appHost') applyRoot(hostSet.$appHost);\n else if (selector === ':firstHost') applyRoot(hostSet.$firstHost);\n else if (selector === ':lastHost') applyRoot(hostSet.$lastHost);\n else if (selector === ':firstAppHost') applyRoot(hostSet.$firstAppHost);\n else if (selector === ':lastAppHost') applyRoot(hostSet.$lastAppHost);\n else if (selector === ':hosts') hostSet.$hosts.forEach(applyRoot);\n else if (selector === ':appHosts') hostSet.$appHosts.forEach(applyRoot);\n else if (selector === ':host' || !selector) applyRoot(host);\n else {\n const targetRoot = r === 'auto' ? (host.shadowRoot || host) : (r === 'shadow' ? host.shadowRoot : host);\n if (targetRoot) {\n const found = targetRoot.querySelectorAll(selector);\n if (found) targetEls.push(...(Array.from(found) as HTMLElement[]));\n }\n }\n\n targetEls.forEach(targetEl => {\n const resolvedRes = typeof res === 'function' ? (res as any)(targetEl, hostSet) : res;\n\n if (action === 'set' || action === 'update') {\n if (action === 'set') targetEl.style.cssText = '';\n \n if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n Object.entries(resolvedRes as any).forEach(([prop, val]) => {\n const finalVal = typeof val === 'function' ? val(targetEl, hostSet) : val;\n if (finalVal === null || finalVal === undefined) {\n targetEl.style.removeProperty(prop);\n } else {\n targetEl.style[prop as any] = String(finalVal);\n }\n });\n } else if (typeof resolvedRes === 'string') {\n targetEl.style.cssText = resolvedRes;\n }\n } else if (action === 'remove') {\n if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n Object.entries(resolvedRes as any).forEach(([prop, val]) => {\n const shouldRemove = typeof val === 'function' ? val(targetEl, hostSet) : !!val;\n if (shouldRemove) {\n targetEl.style.removeProperty(prop);\n }\n });\n } else {\n const props = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];\n props.forEach(p => targetEl.style.removeProperty(String(p)));\n }\n }\n });\n }\n return res;\n };\n return descriptor;\n };\n };\n}\n\nexport function applyStyle(selector: string, action: StyleAction = 'update', options: StyleApplyOptions = {}): MethodDecorator {\n return createStyleDecorator(action)(selector, options);\n}\n\nexport const setStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('set')(selector, options);\nexport const updateStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('update')(selector, options);\nexport const removeStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('remove')(selector, options);\n\n// Host versions\nexport function applyStyleHost(action: StyleAction = 'update', options: StyleApplyOptions = {}): MethodDecorator {\n return createStyleDecorator(action)(':host', options);\n}\nexport const setStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('set')(':host', options);\nexport const updateStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('update')(':host', options);\nexport const removeStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('remove')(':host', options);\n\nexport const findAllStyleMetadata = (target: any): Map<string | symbol, StyleApplyMetadata> => {\n const result = new Map<string | symbol, StyleApplyMetadata>();\n const maps = ReflectUtils.findAllMetadata<Map<string | symbol, StyleApplyMetadata>>(STYLE_METADATA_KEY, target);\n maps.forEach(map => {\n if (map instanceof Map) {\n map.forEach((v, k) => result.set(k, v));\n }\n });\n return result;\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
18
|
var attribute_exports = {};
|
|
19
19
|
__export(attribute_exports, {
|
|
20
|
-
|
|
20
|
+
ATTRIBUTE_FIELD_METADATA_KEY: () => ATTRIBUTE_FIELD_METADATA_KEY,
|
|
21
21
|
attribute: () => attribute,
|
|
22
22
|
attributeHost: () => attributeHost,
|
|
23
23
|
findAllAttributeMetadata: () => findAllAttributeMetadata,
|
|
@@ -27,7 +27,7 @@ module.exports = __toCommonJS(attribute_exports);
|
|
|
27
27
|
var import_core = require("@dooboostore/core");
|
|
28
28
|
var import_elementDefine = require("./elementDefine");
|
|
29
29
|
var import_Utils = require("../utils/Utils");
|
|
30
|
-
const
|
|
30
|
+
const ATTRIBUTE_FIELD_METADATA_KEY = Symbol.for("simple-web-component:attribute-field");
|
|
31
31
|
const convertValue = (val, type) => {
|
|
32
32
|
if (val === null || val === void 0) return val;
|
|
33
33
|
if (type === Number) return Number(val);
|
|
@@ -85,15 +85,14 @@ function attribute(selector, options = {}) {
|
|
|
85
85
|
const constructor = target.constructor;
|
|
86
86
|
const privateKey = Symbol(String(propertyKey));
|
|
87
87
|
const designType = Reflect.getMetadata("design:type", target, propertyKey);
|
|
88
|
-
let metaList = import_core.ReflectUtils.getOwnMetadata(
|
|
88
|
+
let metaList = import_core.ReflectUtils.getOwnMetadata(ATTRIBUTE_FIELD_METADATA_KEY, constructor);
|
|
89
89
|
if (!metaList) {
|
|
90
90
|
metaList = [];
|
|
91
|
-
import_core.ReflectUtils.defineMetadata(
|
|
91
|
+
import_core.ReflectUtils.defineMetadata(ATTRIBUTE_FIELD_METADATA_KEY, metaList, constructor);
|
|
92
92
|
}
|
|
93
93
|
metaList.push({ propertyKey, selector, options, privateKey });
|
|
94
94
|
const applySetAttribute = (inst, targets, attrName, nv) => {
|
|
95
95
|
targets.forEach((it) => {
|
|
96
|
-
console.log("----->", it);
|
|
97
96
|
if (it && typeof it.setAttribute === "function") {
|
|
98
97
|
if (nv === null) {
|
|
99
98
|
it.removeAttribute(attrName);
|
|
@@ -111,7 +110,6 @@ function attribute(selector, options = {}) {
|
|
|
111
110
|
const conf = (0, import_elementDefine.getElementConfig)(this);
|
|
112
111
|
const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
|
|
113
112
|
const targetType = options.type || designType;
|
|
114
|
-
console.log("type-->", propertyKey, targetType);
|
|
115
113
|
if (this.__swc_syncing_init || options.connectedInitialize && !this.__swc_connected) {
|
|
116
114
|
return convertValue(this[privateKey], targetType);
|
|
117
115
|
}
|
|
@@ -127,7 +125,6 @@ function attribute(selector, options = {}) {
|
|
|
127
125
|
return convertValue(this[privateKey], targetType);
|
|
128
126
|
},
|
|
129
127
|
set(nv) {
|
|
130
|
-
const targetType = options.type || designType;
|
|
131
128
|
const attrName = options.name || String(propertyKey);
|
|
132
129
|
const conf = (0, import_elementDefine.getElementConfig)(this);
|
|
133
130
|
const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
|
|
@@ -152,13 +149,9 @@ function attribute(selector, options = {}) {
|
|
|
152
149
|
});
|
|
153
150
|
};
|
|
154
151
|
}
|
|
155
|
-
const findAllAttributeMetadata = (target) => {
|
|
156
|
-
return import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_METADATA_KEY, target).flat();
|
|
157
|
-
};
|
|
158
152
|
function attributeHost(targetOrAttrOrOptions, propertyKeyOrOptions) {
|
|
159
153
|
if (propertyKeyOrOptions !== void 0 && (typeof propertyKeyOrOptions === "string" || typeof propertyKeyOrOptions === "symbol")) {
|
|
160
|
-
|
|
161
|
-
return attribute(":host", { name: fieldName })(targetOrAttrOrOptions, propertyKeyOrOptions);
|
|
154
|
+
return attribute(":host", { name: String(propertyKeyOrOptions) })(targetOrAttrOrOptions, propertyKeyOrOptions);
|
|
162
155
|
}
|
|
163
156
|
if (typeof targetOrAttrOrOptions === "string") {
|
|
164
157
|
const attrName = targetOrAttrOrOptions;
|
|
@@ -167,14 +160,15 @@ function attributeHost(targetOrAttrOrOptions, propertyKeyOrOptions) {
|
|
|
167
160
|
} else if (typeof targetOrAttrOrOptions === "object") {
|
|
168
161
|
const options = targetOrAttrOrOptions;
|
|
169
162
|
return (target, propertyKey) => {
|
|
170
|
-
|
|
171
|
-
return attribute(":host", { ...options, name: fieldName })(target, propertyKey);
|
|
163
|
+
return attribute(":host", { ...options, name: String(propertyKey) })(target, propertyKey);
|
|
172
164
|
};
|
|
173
165
|
} else {
|
|
174
166
|
return (target, propertyKey) => {
|
|
175
|
-
|
|
176
|
-
return attribute(":host", { name: fieldName })(target, propertyKey);
|
|
167
|
+
return attribute(":host", { name: String(propertyKey) })(target, propertyKey);
|
|
177
168
|
};
|
|
178
169
|
}
|
|
179
170
|
}
|
|
171
|
+
const findAllAttributeMetadata = (target) => {
|
|
172
|
+
return import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_FIELD_METADATA_KEY, target).flat();
|
|
173
|
+
};
|
|
180
174
|
//# sourceMappingURL=attribute.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/attribute.ts"],
|
|
4
|
-
"sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\nimport {ensureInit, getElementConfig} from './elementDefine';\nimport {SwcUtils} from '../utils/Utils';\nimport {SpecialSelector, SwcQueryOptions} from '../types';\n\nexport interface
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2B;AAC3B,2BAA2C;AAC3C,mBAAuB;AAgBhB,MAAM,
|
|
4
|
+
"sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\nimport {ensureInit, getElementConfig} from './elementDefine';\nimport {SwcUtils} from '../utils/Utils';\nimport {SpecialSelector, SwcQueryOptions} from '../types';\n\nexport interface AttributeFieldOptions extends SwcQueryOptions {\n name?: string;\n connectedInitialize?: boolean;\n type?: typeof Number | typeof Boolean | typeof String;\n}\n\nexport interface AttributeFieldMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: AttributeFieldOptions;\n privateKey: symbol;\n}\n\nexport const ATTRIBUTE_FIELD_METADATA_KEY = Symbol.for('simple-web-component:attribute-field');\n\nconst convertValue = (val: string | null, type: any): any => {\n if (val === null || val === undefined) return val;\n if (type === Number) return Number(val);\n if (type === Boolean) return val === 'false' || val === '0' ? false : true;\n return val;\n};\n\nexport const resolveTargetEls = (inst: any, selector: string, options: AttributeFieldOptions, currentWin: any): HTMLElement[] => {\n const r = options.root || 'auto';\n const results: HTMLElement[] = [];\n\n const applyRoot = (target: any) => {\n if (!target) return;\n if (r === 'auto') {\n results.push(target);\n } else {\n if (r === 'light' || r === 'all') results.push(target);\n if ((r === 'shadow' || r === 'all') && target.shadowRoot) results.push(target.shadowRoot);\n }\n };\n\n if (selector === ':host' || !selector) {\n applyRoot(inst);\n } else if (selector === ':window') {\n results.push(currentWin);\n } else if (selector === ':document') {\n results.push(currentWin.document);\n } else {\n const hostSet = SwcUtils.getHostSet(inst);\n if (selector === ':parentHost') applyRoot(hostSet.$parentHost);\n else if (selector === ':appHost') applyRoot(hostSet.$appHost as any);\n else if (selector === ':firstHost') applyRoot(hostSet.$firstHost);\n else if (selector === ':lastHost') applyRoot(hostSet.$lastHost);\n else if (selector === ':firstAppHost') applyRoot(hostSet.$firstAppHost as any);\n else if (selector === ':lastAppHost') applyRoot(hostSet.$lastAppHost as any);\n else {\n if (r === 'shadow') {\n const found = inst.shadowRoot?.querySelectorAll(selector);\n if (found) results.push(...found);\n } else if (r === 'light') {\n const found = inst.querySelectorAll(selector);\n if (found) results.push(...found);\n } else if (r === 'all') {\n const sMatch = inst.shadowRoot?.querySelectorAll(selector);\n const lMatch = inst.querySelectorAll(selector);\n if (sMatch) results.push(...sMatch);\n if (lMatch) results.push(...lMatch);\n } else {\n const found = (inst.shadowRoot || inst).querySelectorAll(selector);\n if (found) results.push(...found);\n }\n }\n }\n return results;\n};\n\n/**\n * @attribute decorator to sync a field value with an element's attribute.\n */\nexport function attribute(selector: string, options: AttributeFieldOptions = {}): PropertyDecorator {\n return (target: Object, propertyKey: string | symbol) => {\n const constructor = target.constructor;\n const privateKey = Symbol(String(propertyKey));\n\n const designType = (Reflect as any).getMetadata('design:type', target, propertyKey);\n\n let metaList = ReflectUtils.getOwnMetadata(ATTRIBUTE_FIELD_METADATA_KEY, constructor) as AttributeFieldMetadata[];\n if (!metaList) {\n metaList = [];\n ReflectUtils.defineMetadata(ATTRIBUTE_FIELD_METADATA_KEY, metaList, constructor);\n }\n metaList.push({propertyKey, selector, options, privateKey});\n\n const applySetAttribute = (inst: any, targets: HTMLElement[], attrName: string, nv: any) => {\n targets.forEach(it => {\n if (it && typeof (it as any).setAttribute === 'function') {\n if (nv === null) {\n (it as any).removeAttribute(attrName);\n } else {\n (it as any).setAttribute(attrName, String(nv));\n }\n } else {\n inst[privateKey] = nv;\n }\n });\n };\n\n Object.defineProperty(target, propertyKey, {\n get(this: any) {\n const attrName = options.name || String(propertyKey);\n const conf = getElementConfig(this);\n const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n const targetType = options.type || designType;\n\n if (this.__swc_syncing_init || (options.connectedInitialize && !this.__swc_connected)) {\n return convertValue(this[privateKey], targetType);\n }\n\n const targets = resolveTargetEls(this, selector, options, currentWin);\n const primaryTarget = targets[0];\n\n if (primaryTarget && typeof (primaryTarget as any).hasAttribute === 'function') {\n if ((primaryTarget as any).hasAttribute(attrName)) {\n const domVal = (primaryTarget as any).getAttribute(attrName);\n return convertValue(domVal, targetType);\n }\n return null;\n }\n\n return convertValue(this[privateKey], targetType);\n },\n set(this: any, nv: any) {\n const attrName = options.name || String(propertyKey);\n const conf = getElementConfig(this);\n const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n\n if (this.__swc_syncing_init) {\n if (options.connectedInitialize === true) {\n const targets = resolveTargetEls(this, selector, options, currentWin);\n applySetAttribute(this, targets, attrName, nv);\n } else {\n this[privateKey] = nv;\n }\n return;\n }\n\n if (!this.__swc_connected) {\n this[privateKey] = nv;\n return;\n }\n\n const targets = resolveTargetEls(this, selector, options, currentWin);\n applySetAttribute(this, targets, attrName, nv);\n },\n enumerable: true,\n configurable: true\n });\n };\n}\n\n/**\n * @attributeHost decorator to sync a field value with the :host element's attribute.\n */\nexport function attributeHost(target: Object, propertyKey: string | symbol): void;\nexport function attributeHost(options: AttributeFieldOptions): PropertyDecorator;\nexport function attributeHost(attrName: string): PropertyDecorator;\nexport function attributeHost(attrName: string, options: AttributeFieldOptions): PropertyDecorator;\nexport function attributeHost(targetOrAttrOrOptions?: any, propertyKeyOrOptions?: any): any {\n if (propertyKeyOrOptions !== undefined && (typeof propertyKeyOrOptions === 'string' || typeof propertyKeyOrOptions === 'symbol')) {\n return attribute(':host', { name: String(propertyKeyOrOptions) })(targetOrAttrOrOptions, propertyKeyOrOptions);\n }\n\n if (typeof targetOrAttrOrOptions === 'string') {\n const attrName = targetOrAttrOrOptions;\n const options = (typeof propertyKeyOrOptions === 'object' ? propertyKeyOrOptions : {}) as AttributeFieldOptions;\n return attribute(':host', { ...options, name: attrName });\n } else if (typeof targetOrAttrOrOptions === 'object') {\n const options = targetOrAttrOrOptions as AttributeFieldOptions;\n return (target: Object, propertyKey: string | symbol) => {\n return attribute(':host', { ...options, name: String(propertyKey) })(target, propertyKey);\n };\n } else {\n return (target: Object, propertyKey: string | symbol) => {\n return attribute(':host', { name: String(propertyKey) })(target, propertyKey);\n };\n }\n}\n\nexport const findAllAttributeMetadata = (target: any): AttributeFieldMetadata[] => {\n return ReflectUtils.findAllMetadata<AttributeFieldMetadata[]>(ATTRIBUTE_FIELD_METADATA_KEY, target).flat();\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["targets"]
|
|
7
7
|
}
|
|
@@ -24,7 +24,7 @@ __export(changedAttributeHost_exports, {
|
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(changedAttributeHost_exports);
|
|
26
26
|
var import_core = require("@dooboostore/core");
|
|
27
|
-
const ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol("simple-web-component:on-attribute-changed");
|
|
27
|
+
const ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol.for("simple-web-component:on-attribute-changed");
|
|
28
28
|
function changedAttributeHost(attributeName) {
|
|
29
29
|
return (target, propertyKey) => {
|
|
30
30
|
const constructor = target.constructor;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/changedAttributeHost.ts"],
|
|
4
|
-
"sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\n\nexport const ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol('simple-web-component:on-attribute-changed');\n\n/**\n * @changedAttributeHost decorator - fires when any attribute on :host changes\n * Usage: @changedAttributeHost('data-product-id')\n */\nexport function changedAttributeHost(attributeName?: string): MethodDecorator {\n return (target: Object, propertyKey: string | symbol) => {\n const constructor = target.constructor;\n let meta = ReflectUtils.getOwnMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor) as Map<string, (string | symbol)[]>;\n if (!meta) {\n meta = new Map<string, (string | symbol)[]>();\n ReflectUtils.defineMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, meta, constructor);\n }\n\n const name = attributeName || String(propertyKey);\n let methods = meta.get(name);\n if (!methods) {\n methods = [];\n meta.set(name, methods);\n }\n if (!methods.includes(propertyKey)) methods.push(propertyKey);\n };\n}\n\nexport const getChangedAttributeMetadata = (target: any): Map<string, (string | symbol)[]> | undefined => {\n const constructor = target instanceof Function ? target : target.constructor;\n return ReflectUtils.getMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor);\n};\n\nexport const findAllAttributeChangedMetadata = (target: any): Map<string, (string | symbol)[]> => {\n return ReflectUtils.findAllMapMetadata<string, string | symbol>(ON_ATTRIBUTE_CHANGED_METADATA_KEY, target);\n};\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2B;AAEpB,MAAM,oCAAoC,OAAO,2CAA2C;
|
|
4
|
+
"sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\n\nexport const ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol.for('simple-web-component:on-attribute-changed');\n\n/**\n * @changedAttributeHost decorator - fires when any attribute on :host changes\n * Usage: @changedAttributeHost('data-product-id')\n */\nexport function changedAttributeHost(attributeName?: string): MethodDecorator {\n return (target: Object, propertyKey: string | symbol) => {\n const constructor = target.constructor;\n let meta = ReflectUtils.getOwnMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor) as Map<string, (string | symbol)[]>;\n if (!meta) {\n meta = new Map<string, (string | symbol)[]>();\n ReflectUtils.defineMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, meta, constructor);\n }\n\n const name = attributeName || String(propertyKey);\n let methods = meta.get(name);\n if (!methods) {\n methods = [];\n meta.set(name, methods);\n }\n if (!methods.includes(propertyKey)) methods.push(propertyKey);\n };\n}\n\nexport const getChangedAttributeMetadata = (target: any): Map<string, (string | symbol)[]> | undefined => {\n const constructor = target instanceof Function ? target : target.constructor;\n return ReflectUtils.getMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor);\n};\n\nexport const findAllAttributeChangedMetadata = (target: any): Map<string, (string | symbol)[]> => {\n return ReflectUtils.findAllMapMetadata<string, string | symbol>(ON_ATTRIBUTE_CHANGED_METADATA_KEY, target);\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2B;AAEpB,MAAM,oCAAoC,OAAO,IAAI,2CAA2C;AAMhG,SAAS,qBAAqB,eAAyC;AAC5E,SAAO,CAAC,QAAgB,gBAAiC;AACvD,UAAM,cAAc,OAAO;AAC3B,QAAI,OAAO,yBAAa,eAAe,mCAAmC,WAAW;AACrF,QAAI,CAAC,MAAM;AACT,aAAO,oBAAI,IAAiC;AAC5C,+BAAa,eAAe,mCAAmC,MAAM,WAAW;AAAA,IAClF;AAEA,UAAM,OAAO,iBAAiB,OAAO,WAAW;AAChD,QAAI,UAAU,KAAK,IAAI,IAAI;AAC3B,QAAI,CAAC,SAAS;AACZ,gBAAU,CAAC;AACX,WAAK,IAAI,MAAM,OAAO;AAAA,IACxB;AACA,QAAI,CAAC,QAAQ,SAAS,WAAW,EAAG,SAAQ,KAAK,WAAW;AAAA,EAC9D;AACF;AAEO,MAAM,8BAA8B,CAAC,WAA8D;AACxG,QAAM,cAAc,kBAAkB,WAAW,SAAS,OAAO;AACjE,SAAO,yBAAa,YAAY,mCAAmC,WAAW;AAChF;AAEO,MAAM,kCAAkC,CAAC,WAAkD;AAChG,SAAO,yBAAa,mBAA4C,mCAAmC,MAAM;AAC3G;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -29,13 +29,13 @@ var import_addEventListener = require("./addEventListener");
|
|
|
29
29
|
var import_lifecycles = require("./lifecycles");
|
|
30
30
|
var import_emitCustomEvent = require("./emitCustomEvent");
|
|
31
31
|
var import_changedAttributeHost = require("./changedAttributeHost");
|
|
32
|
-
var
|
|
32
|
+
var import_applyAttribute = require("./applyAttribute");
|
|
33
33
|
var import_attribute = require("./attribute");
|
|
34
34
|
var import_Utils = require("../utils/Utils");
|
|
35
35
|
var import_config = require("../config/config");
|
|
36
36
|
var import_Inject = require("@dooboostore/simple-boot/decorators/inject/Inject");
|
|
37
37
|
var import_types = require("../types");
|
|
38
|
-
const ELEMENT_CONFIG_KEY = Symbol("simple-web-component:element-config");
|
|
38
|
+
const ELEMENT_CONFIG_KEY = Symbol.for("simple-web-component:element-config");
|
|
39
39
|
const getElementConfig = (target) => {
|
|
40
40
|
const constructor = target instanceof Function ? target : target.constructor;
|
|
41
41
|
return import_core.ReflectUtils.getMetadata(ELEMENT_CONFIG_KEY, constructor);
|
|
@@ -150,7 +150,6 @@ const setupPrototype = (proto) => {
|
|
|
150
150
|
const oldHandler = handlers.get(attrName);
|
|
151
151
|
if (oldHandler) el.removeEventListener(eventName, oldHandler);
|
|
152
152
|
const handler = async (event) => {
|
|
153
|
-
console.log("execute handler", event);
|
|
154
153
|
const parent = import_Utils.SwcUtils.findNearestSwcHost(el);
|
|
155
154
|
const hostSet = import_Utils.SwcUtils.getHostSet(parent || el);
|
|
156
155
|
const conf = getElementConfig(this);
|
|
@@ -171,7 +170,6 @@ const setupPrototype = (proto) => {
|
|
|
171
170
|
};
|
|
172
171
|
proto.__swc_executeAttributeEvent = async function(el, attrName, script, event) {
|
|
173
172
|
ensureInit(this);
|
|
174
|
-
console.log("execute handler2", event);
|
|
175
173
|
const parent = import_Utils.SwcUtils.findNearestSwcHost(el);
|
|
176
174
|
const hostSet = import_Utils.SwcUtils.getHostSet(parent || el);
|
|
177
175
|
const conf = getElementConfig(this);
|
|
@@ -211,12 +209,22 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
211
209
|
const emitCustomEventList = (0, import_emitCustomEvent.getEmitCustomEventMetadataList)(constructor) || [];
|
|
212
210
|
const emitHostCustomEventList = emitCustomEventList.filter((meta) => meta.selector === ":host" || meta.selector === "");
|
|
213
211
|
const addEventListenerList = (0, import_addEventListener.getAddEventListenerMetadata)(constructor) || [];
|
|
214
|
-
const addHostEventListenerList = addEventListenerList.filter((meta) => meta.selector === ":host" || meta.selector === "");
|
|
215
212
|
const attrChangeMap = (0, import_changedAttributeHost.findAllAttributeChangedMetadata)(constructor);
|
|
216
213
|
const attributeList = (0, import_attribute.findAllAttributeMetadata)(constructor);
|
|
214
|
+
const applyAttributeMap = (0, import_applyAttribute.findAllAttributeApplyMetadata)(constructor);
|
|
217
215
|
const swcLifecycleAttributes = ["swc-on-constructor", "swc-on-connected", "swc-on-disconnected", "swc-on-before-connected", "swc-on-after-connected", "swc-on-before-disconnected", "swc-on-after-disconnected", "swc-on-before-adopted", "swc-on-after-adopted", "swc-on-attribute-changed"];
|
|
218
216
|
const swcOnEvents = import_config.DOM_EVENT_NAMES.map((e) => `swc-on-${e}`);
|
|
219
|
-
const
|
|
217
|
+
const attributeApplyNames = Array.from(applyAttributeMap.values()).map((it) => it.options.name).filter(Boolean);
|
|
218
|
+
const attributeListNames = attributeList.map((it) => it.options.name || String(it.propertyKey));
|
|
219
|
+
const mergedObservedAttributes = [.../* @__PURE__ */ new Set([
|
|
220
|
+
...metadata.observedAttributes ?? [],
|
|
221
|
+
...attrChangeMap.keys(),
|
|
222
|
+
...attributeApplyNames,
|
|
223
|
+
...attributeListNames,
|
|
224
|
+
...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean),
|
|
225
|
+
...swcLifecycleAttributes,
|
|
226
|
+
...swcOnEvents
|
|
227
|
+
])];
|
|
220
228
|
const connectedInnerHtmlList = (0, import_lifecycles.getOnConnectedInnerHtmlMetadata)(constructor) || [];
|
|
221
229
|
const proto = constructor.prototype;
|
|
222
230
|
setupPrototype(proto);
|
|
@@ -235,7 +243,6 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
235
243
|
for (const m of bMethods) this._invokeLifecycleMethod(m, hostSet);
|
|
236
244
|
}
|
|
237
245
|
attributeList.forEach((meta) => {
|
|
238
|
-
const attrName = meta.options.name || String(meta.propertyKey);
|
|
239
246
|
if (meta.options.connectedInitialize === true) {
|
|
240
247
|
this.__swc_syncing_init = true;
|
|
241
248
|
try {
|
|
@@ -375,22 +382,6 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
375
382
|
}
|
|
376
383
|
});
|
|
377
384
|
});
|
|
378
|
-
addHostEventListenerList.forEach((meta) => {
|
|
379
|
-
const { type, options } = meta;
|
|
380
|
-
const opts = { capture: options.capture, once: options.once, passive: options.passive };
|
|
381
|
-
const handler = async (event) => {
|
|
382
|
-
if (options.stopPropagation) event.stopPropagation();
|
|
383
|
-
if (options.stopImmediatePropagation) event.stopImmediatePropagation();
|
|
384
|
-
if (options.preventDefault) event.preventDefault();
|
|
385
|
-
const currentHostSet = import_Utils.SwcUtils.getHostSet(this);
|
|
386
|
-
const args = { event, ...currentHostSet, $el: this, $root: this.getRootNode() };
|
|
387
|
-
await this[meta.propertyKey](event, currentHostSet, args);
|
|
388
|
-
};
|
|
389
|
-
this.addEventListener(type, handler, opts);
|
|
390
|
-
if (options.removeOnDisconnected === true) {
|
|
391
|
-
this._boundListeners.push({ target: this, type, handler, options: opts });
|
|
392
|
-
}
|
|
393
|
-
});
|
|
394
385
|
if (originalConnected) originalConnected.apply(this);
|
|
395
386
|
const aMethods = (0, import_lifecycles.findAllLifecycleMetadata)(this, import_lifecycles.ON_AFTER_CONNECTED_METADATA_KEY);
|
|
396
387
|
if (aMethods) {
|