@patternfly/pfe-core 2.0.0-next.5 → 2.0.0-next.6
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.
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var c=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var a=(i,t,e,
|
|
1
|
+
var c=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var a=(i,t,e,o)=>{for(var s=o>1?void 0:o?m(t,e):t,n=i.length-1,r;n>=0;n--)(r=i[n])&&(s=(o?r(t,e,s):r(s))||s);return o&&s&&c(t,e,s),s};import{bound as h}from"../decorators/bound.js";import{Logger as g}from"./logger.js";function u(i){return i.length===1&&typeof i[0]=="object"&&i[0]!==null}var p=i=>t=>i===l.anonymous?!t.hasAttribute("slot"):t.getAttribute("slot")===i,d=class{constructor(t,...e){this.host=t;this.nodes=new Map;this.firstUpdated=!1;this.mo=new MutationObserver(this.onMutation);this.deprecations={};if(this.logger=new g(this.host),u(e)){let[{slots:o,deprecations:s}]=e;this.slotNames=o,this.deprecations=s??{}}else e.length>=1?(this.slotNames=e,this.deprecations={}):this.slotNames=[null];t.addController(this)}hostConnected(){this.host.addEventListener("slotchange",this.onSlotChange),this.firstUpdated=!1,this.mo.observe(this.host,{childList:!0}),this.init()}hostUpdated(){this.firstUpdated||(this.slotNames.forEach(this.initSlot),this.firstUpdated=!0)}hostDisconnected(){this.mo.disconnect()}hasSlotted(...t){return t.length?t.some(e=>this.nodes.get(e)?.hasContent??!1):(this.logger.warn("Please provide at least one slot name for which to search."),!1)}getSlotted(...t){return t.length?t.flatMap(e=>this.nodes.get(e)?.elements??[]):this.nodes.get(d.anonymous)?.elements??[]}onSlotChange(t){let e=t.target.name;this.initSlot(e),this.host.requestUpdate()}async onMutation(t){let e=[];for(let{addedNodes:o,removedNodes:s}of t)for(let n of[...o,...s])n instanceof HTMLElement&&n.slot&&(this.initSlot(n.slot),e.push(n.slot));e.length&&this.host.requestUpdate()}getChildrenForSlot(t){return Array.from(this.host.children).filter(p(t))}initSlot(t){let e=t||d.anonymous,o=this.nodes.get(e)?.slot?.assignedElements?.()??this.getChildrenForSlot(e),s=t?`slot[name="${t}"]`:"slot:not([name])",n=this.host.shadowRoot?.querySelector?.(s)??null,r=!!o.length;this.nodes.set(e,{elements:o,name:t??"",hasContent:r,slot:n}),this.logger.log(t,r)}init(){this.nodes.clear(),this.slotNames.forEach(this.initSlot),Object.values(this.deprecations).forEach(this.initSlot),this.host.requestUpdate()}},l=d;l.anonymous=Symbol("anonymous slot"),a([h],l.prototype,"onSlotChange",1),a([h],l.prototype,"onMutation",1),a([h],l.prototype,"initSlot",1),a([h],l.prototype,"init",1);export{l as SlotController};
|
|
2
2
|
//# sourceMappingURL=slot-controller.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["slot-controller.ts"],
|
|
4
|
-
"sourcesContent": ["import type { ReactiveController, ReactiveElement } from 'lit';\n\nimport { bound } from '../decorators/bound.js';\nimport { Logger } from './logger.js';\n\ninterface AnonymousSlot {\n hasContent: boolean;\n elements: Element[];\n slot: HTMLSlotElement|null;\n}\n\ninterface NamedSlot extends AnonymousSlot {\n name: string;\n initialized: true;\n}\n\nexport type Slot = NamedSlot|AnonymousSlot;\n\nexport interface SlotsConfig {\n slots: (string|null)[];\n /**\n * Object mapping new slot name keys to deprecated slot name values\n * @example `pfe-modal--header` is deprecated in favour of `header`\n * ```js\n * new SlotController(this, {\n * slots: ['header'],\n * deprecations: {\n * 'header': 'pfe-modal--header'\n * }\n * })\n * ```\n */\n deprecations?: Record<string, string>;\n}\n\nfunction isObjectConfigSpread(config: ([SlotsConfig]|(string|null)[])): config is [SlotsConfig] {\n return config.length === 1 && config[0] !== null;\n}\n\n/**\n * If it's a named slot, return its children,\n * for the default slot, look for direct children not assigned to a slot\n */\nconst isSlot =\n <T extends Element = Element>(n: string|typeof SlotController.anonymous) =>\n (child: Element): child is T =>\n n === SlotController.anonymous ? !child.hasAttribute('slot')\n : child.getAttribute('slot') === n;\n\nexport class SlotController implements ReactiveController {\n public static anonymous = Symbol('anonymous slot');\n\n private nodes = new Map<string|typeof SlotController.anonymous, Slot>();\n\n private logger: Logger;\n\n private firstUpdated = false;\n\n private mo = new MutationObserver(this.onMutation);\n\n private slotNames: (string|null)[];\n\n private deprecations: Record<string, string> = {};\n\n constructor(public host: ReactiveElement, ...config: ([SlotsConfig]|(string|null)[])) {\n this.logger = new Logger(this.host);\n\n if (isObjectConfigSpread(config)) {\n const [{ slots, deprecations }] = config;\n this.slotNames = slots;\n this.deprecations = deprecations ?? {};\n } else if (config.length
|
|
5
|
-
"mappings": "wMAEA,+CACA,qCAgCA,WAA8B,EAAkE,CAC9F,MAAO,GAAO,SAAW,GAAK,EAAO,KAAO,
|
|
4
|
+
"sourcesContent": ["import type { ReactiveController, ReactiveElement } from 'lit';\n\nimport { bound } from '../decorators/bound.js';\nimport { Logger } from './logger.js';\n\ninterface AnonymousSlot {\n hasContent: boolean;\n elements: Element[];\n slot: HTMLSlotElement|null;\n}\n\ninterface NamedSlot extends AnonymousSlot {\n name: string;\n initialized: true;\n}\n\nexport type Slot = NamedSlot|AnonymousSlot;\n\nexport interface SlotsConfig {\n slots: (string|null)[];\n /**\n * Object mapping new slot name keys to deprecated slot name values\n * @example `pfe-modal--header` is deprecated in favour of `header`\n * ```js\n * new SlotController(this, {\n * slots: ['header'],\n * deprecations: {\n * 'header': 'pfe-modal--header'\n * }\n * })\n * ```\n */\n deprecations?: Record<string, string>;\n}\n\nfunction isObjectConfigSpread(config: ([SlotsConfig]|(string|null)[])): config is [SlotsConfig] {\n return config.length === 1 && typeof config[0] === 'object' && config[0] !== null;\n}\n\n/**\n * If it's a named slot, return its children,\n * for the default slot, look for direct children not assigned to a slot\n */\nconst isSlot =\n <T extends Element = Element>(n: string|typeof SlotController.anonymous) =>\n (child: Element): child is T =>\n n === SlotController.anonymous ? !child.hasAttribute('slot')\n : child.getAttribute('slot') === n;\n\nexport class SlotController implements ReactiveController {\n public static anonymous = Symbol('anonymous slot');\n\n private nodes = new Map<string|typeof SlotController.anonymous, Slot>();\n\n private logger: Logger;\n\n private firstUpdated = false;\n\n private mo = new MutationObserver(this.onMutation);\n\n private slotNames: (string|null)[];\n\n private deprecations: Record<string, string> = {};\n\n constructor(public host: ReactiveElement, ...config: ([SlotsConfig]|(string|null)[])) {\n this.logger = new Logger(this.host);\n\n if (isObjectConfigSpread(config)) {\n const [{ slots, deprecations }] = config;\n this.slotNames = slots;\n this.deprecations = deprecations ?? {};\n } else if (config.length >= 1) {\n this.slotNames = config;\n this.deprecations = {};\n } else {\n this.slotNames = [null];\n }\n\n\n host.addController(this);\n }\n\n hostConnected() {\n this.host.addEventListener('slotchange', this.onSlotChange as EventListener);\n this.firstUpdated = false;\n this.mo.observe(this.host, { childList: true });\n this.init();\n }\n\n hostUpdated() {\n if (!this.firstUpdated) {\n this.slotNames.forEach(this.initSlot);\n this.firstUpdated = true;\n }\n }\n\n hostDisconnected() {\n this.mo.disconnect();\n }\n\n /**\n * Returns a boolean statement of whether or not any of those slots exists in the light DOM.\n *\n * @param {String|Array} name The slot name.\n * @example this.hasSlotted(\"header\");\n */\n hasSlotted(...names: string[]): boolean {\n if (!names.length) {\n this.logger.warn(`Please provide at least one slot name for which to search.`);\n return false;\n } else {\n return names.some(x =>\n this.nodes.get(x)?.hasContent ?? false);\n }\n }\n\n /**\n * Given a slot name or slot names, returns elements assigned to the requested slots as an array.\n * If no value is provided, it returns all children not assigned to a slot (without a slot attribute).\n *\n * @example Get header-slotted elements\n * ```js\n * this.getSlotted('header')\n * ```\n *\n * @example Get header- and footer-slotted elements\n * ```js\n * this.getSlotted('header', 'footer')\n * ```\n *\n * @example Get default-slotted elements\n * ```js\n * this.getSlotted();\n * ```\n */\n getSlotted<T extends Element = Element>(...slotNames: string[]): T[] {\n if (!slotNames.length) {\n return (this.nodes.get(SlotController.anonymous)?.elements ?? []) as T[];\n } else {\n return slotNames.flatMap(slotName =>\n this.nodes.get(slotName)?.elements ?? []) as T[];\n }\n }\n\n @bound private onSlotChange(event: Event & { target: HTMLSlotElement }) {\n const slotName = event.target.name;\n this.initSlot(slotName);\n this.host.requestUpdate();\n }\n\n @bound private async onMutation(records: MutationRecord[]) {\n const changed = [];\n for (const { addedNodes, removedNodes } of records) {\n for (const node of [...addedNodes, ...removedNodes]) {\n if (node instanceof HTMLElement && node.slot) {\n this.initSlot(node.slot);\n changed.push(node.slot);\n }\n }\n }\n if (changed.length) {\n this.host.requestUpdate();\n }\n }\n\n private getChildrenForSlot<T extends Element = Element>(name: string|typeof SlotController.anonymous): T[] {\n const children = Array.from(this.host.children) as T[];\n return children.filter(isSlot(name));\n }\n\n @bound private initSlot(slotName: string|null) {\n const name = slotName || SlotController.anonymous;\n const elements = this.nodes.get(name)?.slot?.assignedElements?.() ?? this.getChildrenForSlot(name);\n const selector = slotName ? `slot[name=\"${slotName}\"]` : 'slot:not([name])';\n const slot = this.host.shadowRoot?.querySelector?.<HTMLSlotElement>(selector) ?? null;\n const hasContent = !!elements.length;\n this.nodes.set(name, { elements, name: slotName ?? '', hasContent, slot });\n this.logger.log(slotName, hasContent);\n }\n\n /**\n * Maps the defined slots into an object that is easier to query\n */\n @bound private init() {\n this.nodes.clear();\n // Loop over the properties provided by the schema\n this.slotNames.forEach(this.initSlot);\n Object.values(this.deprecations).forEach(this.initSlot);\n this.host.requestUpdate();\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ReactiveElement, PropertyDeclaration } from 'lit';
|
|
2
2
|
export declare type DeprecationDeclaration<K extends PropertyKey> = PropertyDeclaration & {
|
|
3
|
-
alias: K;
|
|
3
|
+
alias: string & K;
|
|
4
4
|
attribute: string;
|
|
5
5
|
};
|
|
6
6
|
/**
|
|
@@ -13,4 +13,4 @@ export declare type DeprecationDeclaration<K extends PropertyKey> = PropertyDecl
|
|
|
13
13
|
* @deprecation('colorPalette') color?: ColorPalette;
|
|
14
14
|
* ```
|
|
15
15
|
*/
|
|
16
|
-
export declare function deprecation<K extends PropertyKey>(options: DeprecationDeclaration<K>): <T extends ReactiveElement, L extends PropertyKey>(proto: Partial<Record<K | L, T>>, key: keyof T) => void;
|
|
16
|
+
export declare function deprecation<K extends PropertyKey>(options: DeprecationDeclaration<K>): <T extends ReactiveElement, L extends PropertyKey>(proto: Partial<Record<K | L, T>>, key: string & keyof T) => void;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["deprecation.ts"],
|
|
4
|
-
"sourcesContent": ["import type { ReactiveElement, PropertyDeclaration, ReactiveController } from 'lit';\n\nimport { Logger } from '../controllers/logger.js';\n\nexport type DeprecationDeclaration<K extends PropertyKey> = PropertyDeclaration & {\n alias: K;\n attribute: string;\n}\n\n/**\n * Aliases the decorated field to an existing property, and logs a warning if it is used\n * @example deprecating an attribute\n * ```ts\n * @property({ reflect: true, attribute: 'color-palette'})\n * colorPalette: ColorPalette = 'base';\n *\n * @deprecation('colorPalette') color?: ColorPalette;\n * ```\n */\nexport function deprecation<K extends PropertyKey>(options: DeprecationDeclaration<K>) {\n return function<T extends ReactiveElement, L extends PropertyKey>(proto: Partial<Record<K | L, T
|
|
5
|
-
"mappings": "AAEA,kDAiBO,WAA4C,EAAoC,CACrF,MAAO,
|
|
4
|
+
"sourcesContent": ["import type { ReactiveElement, PropertyDeclaration, ReactiveController } from 'lit';\n\nimport { Logger } from '../controllers/logger.js';\n\nexport type DeprecationDeclaration<K extends PropertyKey> = PropertyDeclaration & {\n alias: string & K;\n attribute: string;\n}\n\n/**\n * Aliases the decorated field to an existing property, and logs a warning if it is used\n * @example deprecating an attribute\n * ```ts\n * @property({ reflect: true, attribute: 'color-palette'})\n * colorPalette: ColorPalette = 'base';\n *\n * @deprecation('colorPalette') color?: ColorPalette;\n * ```\n */\nexport function deprecation<K extends PropertyKey>(options: DeprecationDeclaration<K>) {\n return function<T extends ReactiveElement, L extends PropertyKey>(\n proto: Partial<Record<K | L, T>>,\n key: string & keyof T\n ) {\n const { alias, ...deprecationOptions } = options;\n const klass = (proto.constructor as typeof ReactiveElement);\n const declaration = klass.getPropertyOptions(alias);\n klass.createProperty(key, { ...declaration, ...deprecationOptions });\n klass.addInitializer(instance => {\n instance.addController(new Deprecation(instance as T, options, key));\n });\n };\n}\n\nclass Deprecation<T extends ReactiveElement, K extends PropertyKey> implements ReactiveController {\n private logger: Logger;\n\n private logged = false;\n\n constructor(\n private host: T,\n private options: DeprecationDeclaration<K>,\n private deprecatedKey: string & keyof T\n ) {\n this.logger = new Logger(host);\n }\n\n hostUpdate() {\n const { deprecatedKey, options: { alias } } = this;\n if (this.host[deprecatedKey]) {\n if (this.host[alias as keyof T] !== this.host[deprecatedKey]) {\n if (!this.logged) {\n this.logger.warn(`${deprecatedKey} is deprecated, use ${alias} instead`);\n this.logged = true;\n }\n this.host[alias as keyof T] = this.host[deprecatedKey];\n }\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "AAEA,kDAiBO,WAA4C,EAAoC,CACrF,MAAO,UACL,EACA,EACA,CACA,GAAM,CAAE,WAAU,GAAuB,EACnC,EAAS,EAAM,YACf,EAAc,EAAM,mBAAmB,CAAK,EAClD,EAAM,eAAe,EAAK,IAAK,KAAgB,CAAmB,CAAC,EACnE,EAAM,eAAe,GAAY,CAC/B,EAAS,cAAc,GAAI,GAAY,EAAe,EAAS,CAAG,CAAC,CACrE,CAAC,CACH,CACF,CAEA,WAAkG,CAKhG,YACU,EACA,EACA,EACR,CAHQ,YACA,eACA,qBALF,YAAS,GAOf,KAAK,OAAS,GAAI,GAAO,CAAI,CAC/B,CAEA,YAAa,CACX,GAAM,CAAE,gBAAe,QAAS,CAAE,UAAY,KAC9C,AAAI,KAAK,KAAK,IACR,KAAK,KAAK,KAAsB,KAAK,KAAK,IACvC,MAAK,QACR,MAAK,OAAO,KAAK,GAAG,wBAAoC,WAAe,EACvE,KAAK,OAAS,IAEhB,KAAK,KAAK,GAAoB,KAAK,KAAK,GAG9C,CACF",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/decorators/observed.d.ts
CHANGED
|
@@ -29,5 +29,5 @@ declare type TypedFieldDecorator<T> = (proto: T, key: string | keyof T) => void;
|
|
|
29
29
|
export declare function observed<T extends ReactiveElement>(methodName: string): TypedFieldDecorator<T>;
|
|
30
30
|
export declare function observed<T extends ReactiveElement>(cb: ChangeCallback<T>): TypedFieldDecorator<T>;
|
|
31
31
|
export declare function observed<T extends ReactiveElement>(proto: T, key: string): void;
|
|
32
|
-
export declare function observeProperty<T extends ReactiveElement>(proto: T, key: string
|
|
32
|
+
export declare function observeProperty<T extends ReactiveElement>(proto: T, key: string & keyof T, callbackOrMethod?: ChangeCallback<T>): void;
|
|
33
33
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["observed.ts"],
|
|
4
|
-
"sourcesContent": ["import type { ReactiveElement } from 'lit';\nimport type {\n ChangeCallback,\n ChangeCallbackName,\n PropertyObserverHost,\n} from '../controllers/property-observer-controller.js';\n\nimport {\n observedController,\n PropertyObserverController,\n} from '../controllers/property-observer-controller.js';\n\ntype TypedFieldDecorator<T> = (proto: T, key: string | keyof T) => void ;\n\n/**\n * Calls a _fooChanged method on the instance when the value changes.\n * Works on any class field. When using on lit observed properties,\n * Make sure `@observed` is to the left (i.e. called after) the `@property`\n * or `@state` decorator.\n *\n * @example observing a lit property\n * ```ts\n * @observed @property() foo = 'bar';\n *\n * protected _fooChanged(oldValue?: string, newValue?: string) {}\n * ```\n *\n * @example using a custom callback\n * ```ts\n * @observed('_myCallback') size = 'lg';\n *\n * _myCallback(_, size) {...}\n * ```\n *\n * @example using an arrow function\n * ```ts\n * @observed((oldVal, newVal) => console.log(`Size changed from ${oldVal} to ${newVal}`))\n * ```\n */\nexport function observed<T extends ReactiveElement>(methodName: string): TypedFieldDecorator<T>\nexport function observed<T extends ReactiveElement>(cb: ChangeCallback<T>): TypedFieldDecorator<T>\nexport function observed<T extends ReactiveElement>(proto: T, key: string): void\nexport function observed<T extends ReactiveElement>(...as: any[]): void|TypedFieldDecorator<T> {\n /** @observed('_myCustomChangeCallback') */\n if (as.length === 1) {\n const [methodNameOrCallback] = as;\n return function(proto, key) {\n (proto.constructor as typeof ReactiveElement)\n .addInitializer(x => new PropertyObserverController(x));\n observeProperty(proto, key, methodNameOrCallback);\n };\n } else {\n const [proto, key] = as;\n (proto.constructor as typeof ReactiveElement)\n .addInitializer(x => new PropertyObserverController(x));\n observeProperty(proto, key);\n }\n}\n\nexport function observeProperty<T extends ReactiveElement>(\n proto: T,\n key: string
|
|
5
|
-
"mappings": "AAOA,oHAmCO,cAAgD,EAAwC,CAE7F,GAAI,EAAG,SAAW,EAAG,CACnB,GAAM,CAAC,GAAwB,EAC/B,MAAO,UAAS,EAAO,EAAK,CAC1B,AAAC,EAAM,YACJ,eAAe,GAAK,GAAI,GAA2B,CAAC,CAAC,EACxD,EAAgB,EAAO,
|
|
4
|
+
"sourcesContent": ["import type { ReactiveElement } from 'lit';\nimport type {\n ChangeCallback,\n ChangeCallbackName,\n PropertyObserverHost,\n} from '../controllers/property-observer-controller.js';\n\nimport {\n observedController,\n PropertyObserverController,\n} from '../controllers/property-observer-controller.js';\n\ntype TypedFieldDecorator<T> = (proto: T, key: string | keyof T) => void ;\n\n/**\n * Calls a _fooChanged method on the instance when the value changes.\n * Works on any class field. When using on lit observed properties,\n * Make sure `@observed` is to the left (i.e. called after) the `@property`\n * or `@state` decorator.\n *\n * @example observing a lit property\n * ```ts\n * @observed @property() foo = 'bar';\n *\n * protected _fooChanged(oldValue?: string, newValue?: string) {}\n * ```\n *\n * @example using a custom callback\n * ```ts\n * @observed('_myCallback') size = 'lg';\n *\n * _myCallback(_, size) {...}\n * ```\n *\n * @example using an arrow function\n * ```ts\n * @observed((oldVal, newVal) => console.log(`Size changed from ${oldVal} to ${newVal}`))\n * ```\n */\nexport function observed<T extends ReactiveElement>(methodName: string): TypedFieldDecorator<T>\nexport function observed<T extends ReactiveElement>(cb: ChangeCallback<T>): TypedFieldDecorator<T>\nexport function observed<T extends ReactiveElement>(proto: T, key: string): void\nexport function observed<T extends ReactiveElement>(...as: any[]): void|TypedFieldDecorator<T> {\n /** @observed('_myCustomChangeCallback') */\n if (as.length === 1) {\n const [methodNameOrCallback] = as;\n return function(proto, key) {\n (proto.constructor as typeof ReactiveElement)\n .addInitializer(x => new PropertyObserverController(x));\n observeProperty(proto, key as string & keyof T, methodNameOrCallback);\n };\n } else {\n const [proto, key] = as;\n (proto.constructor as typeof ReactiveElement)\n .addInitializer(x => new PropertyObserverController(x));\n observeProperty(proto, key);\n }\n}\n\nexport function observeProperty<T extends ReactiveElement>(\n proto: T,\n key: string & keyof T,\n callbackOrMethod?: ChangeCallback<T>\n) {\n const descriptor = Object.getOwnPropertyDescriptor(proto, key);\n Object.defineProperty(proto, key, {\n ...descriptor,\n configurable: true,\n set(this: PropertyObserverHost<T>, newVal: T[keyof T]) {\n const oldVal = this[key as keyof T];\n // first, call any pre-existing setters, e.g. `@property`\n descriptor?.set?.call(this, newVal);\n\n // if the user passed a callback, call it\n // e.g. `@observed((_, newVal) => console.log(newVal))`\n // safe to call before connectedCallback, because it's impossible to get a `this` ref.\n if (typeof callbackOrMethod === 'function') {\n callbackOrMethod.call(this, oldVal, newVal);\n } else {\n // if the user passed a string method name, call it on `this`\n // e.g. `@observed('_renderOptions')`\n // otherwise, use a default method name e.g. `_fooChanged`\n const actualMethodName = callbackOrMethod || `_${key}Changed`;\n\n // if the component has already connected to the DOM, run the callback\n // otherwise, If the component has not yet connected to the DOM,\n // cache the old and new values. See PropertyObserverController above\n if (this.hasUpdated) {\n this[actualMethodName as ChangeCallbackName]?.(oldVal, newVal);\n } else {\n this[observedController].cache(key as string, actualMethodName, oldVal, newVal);\n }\n }\n },\n });\n}\n"],
|
|
5
|
+
"mappings": "AAOA,oHAmCO,cAAgD,EAAwC,CAE7F,GAAI,EAAG,SAAW,EAAG,CACnB,GAAM,CAAC,GAAwB,EAC/B,MAAO,UAAS,EAAO,EAAK,CAC1B,AAAC,EAAM,YACJ,eAAe,GAAK,GAAI,GAA2B,CAAC,CAAC,EACxD,EAAgB,EAAO,EAAyB,CAAoB,CACtE,CACF,KAAO,CACL,GAAM,CAAC,EAAO,GAAO,EACrB,AAAC,EAAM,YACJ,eAAe,GAAK,GAAI,GAA2B,CAAC,CAAC,EACxD,EAAgB,EAAO,CAAG,CAC5B,CACF,CAEO,WACL,EACA,EACA,EACA,CACA,GAAM,GAAa,OAAO,yBAAyB,EAAO,CAAG,EAC7D,OAAO,eAAe,EAAO,EAAK,IAC7B,EACH,aAAc,GACd,IAAmC,EAAoB,CACrD,GAAM,GAAS,KAAK,GAOpB,GALA,GAAY,KAAK,KAAK,KAAM,CAAM,EAK9B,MAAO,IAAqB,WAC9B,EAAiB,KAAK,KAAM,EAAQ,CAAM,MACrC,CAIL,GAAM,GAAmB,GAAoB,IAAI,WAKjD,AAAI,KAAK,WACP,KAAK,KAA0C,EAAQ,CAAM,EAE7D,KAAK,GAAoB,MAAM,EAAe,EAAkB,EAAQ,CAAM,CAElF,CACF,CACF,CAAC,CACH",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|