{"version":3,"file":"index.js","sources":["../../../../src/packages/core/lit-element/lit-element.element.ts","../../../../src/packages/core/lit-element/directives/focus.lit-directive.ts","../../../../src/packages/core/lit-element/directives/destroy.lit-directive.ts"],"sourcesContent":["import { LitElement, property } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbElementMixin } from '@umbraco-cms/backoffice/element-api';\r\n\r\n/**\r\n * The base class for all Umbraco LitElement elements.\r\n * @abstract\r\n * @remarks This class is a wrapper around the LitElement class.\r\n * @remarks The `dir` and `lang` properties are defined here as reactive properties so they react to language changes.\r\n */\r\nexport class UmbLitElement extends UmbElementMixin(LitElement) {\r\n\t/**\r\n\t * The direction of the element.\r\n\t * @attr\r\n\t * @remarks This is the direction of the element, not the direction of the backoffice.\r\n\t * @example 'ltr'\r\n\t * @example 'rtl'\r\n\t */\r\n\t@property() override dir: 'rtl' | 'ltr' | '' = '';\r\n\r\n\t/**\r\n\t * The language of the element.\r\n\t * @attr\r\n\t * @remarks This is the language of the element, not the language of the backoffice.\r\n\t * @example 'en-us'\r\n\t * @example 'en'\r\n\t */\r\n\t@property() override lang = '';\r\n}\r\n","import { AsyncDirective, directive, nothing, type ElementPart } from '@umbraco-cms/backoffice/external/lit';\r\n/**\r\n *\r\n * test if a element has focus\r\n * this also returns true if the focused element is a child of the target.\r\n * @param current\r\n * @param target\r\n * @returns bool\r\n */\r\nfunction hasFocus(current: any, target: HTMLElement): boolean {\r\n\tif (current === target) {\r\n\t\treturn true;\r\n\t}\r\n\tif (current.shadowRoot) {\r\n\t\tconst node = current.shadowRoot.activeElement;\r\n\t\tif (node) {\r\n\t\t\treturn hasFocus(node, target);\r\n\t\t}\r\n\t}\r\n\treturn false;\r\n}\r\n\r\n/**\r\n * The `focus` directive sets focus on the given element once its connected to the DOM.\r\n */\r\nclass UmbFocusDirective extends AsyncDirective {\r\n\tstatic #next?: HTMLElement;\r\n\t#el?: HTMLElement;\r\n\t#timeout?: number;\r\n\r\n\toverride render() {\r\n\t\treturn nothing;\r\n\t}\r\n\r\n\toverride update(part: ElementPart) {\r\n\t\tif (this.#el !== part.element) {\r\n\t\t\tUmbFocusDirective.#next = this.#el = part.element as HTMLElement;\r\n\t\t\tthis.#setFocus();\r\n\t\t}\r\n\t\treturn nothing;\r\n\t}\r\n\r\n\t/**\r\n\t * This method tries to set focus, if it did not succeed, it will try again.\r\n\t * It always tests against the latest element, because the directive can be used multiple times in the same render.\r\n\t * This is NOT needed because the elements focus method isn't ready to be called, but due to something with rendering of the DOM.\r\n\t * But I'm not completely sure at this movement why the browser does not accept the focus call.\r\n\t * But I have tested that everything is in place for it to be good, so something else must have an effect,\r\n\t * setting the focus somewhere else, maybe a re-appending of some sort?\r\n\t * cause Lit does not re-render the element but also notice reconnect callback on the directive is not triggered either. [NL]\r\n\t */\r\n\t#setFocus = () => {\r\n\t\t// Make sure we clear the timeout, so we don't get multiple timeouts running.\r\n\t\tif (this.#timeout) {\r\n\t\t\tclearTimeout(this.#timeout);\r\n\t\t\tthis.#timeout = undefined;\r\n\t\t}\r\n\t\t// If this is the next element to focus, then try to focus it.\r\n\t\tif (this.#el && this.#el === UmbFocusDirective.#next) {\r\n\t\t\tthis.#el.focus();\r\n\t\t\tif (hasFocus(document.activeElement, this.#el) === false) {\r\n\t\t\t\tthis.#timeout = setTimeout(this.#setFocus, 100) as unknown as number;\r\n\t\t\t} else {\r\n\t\t\t\tUmbFocusDirective.#next = undefined;\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\r\n\toverride disconnected() {\r\n\t\tif (this.#el === UmbFocusDirective.#next) {\r\n\t\t\tUmbFocusDirective.#next = undefined;\r\n\t\t}\r\n\t\tthis.#el = undefined;\r\n\t}\r\n\r\n\t//override reconnected() {}\r\n}\r\n\r\n/**\r\n * @description\r\n * A Lit directive, which sets focus on the element of scope once its connected to the DOM.\r\n * @example:\r\n * ```js\r\n * html`<input ${umbFocus()}>`;\r\n * ```\r\n */\r\nexport const umbFocus = directive(UmbFocusDirective);\r\n\r\n//export type { UmbFocusDirective };\r\n","import { AsyncDirective, directive, nothing, type ElementPart } from '@umbraco-cms/backoffice/external/lit';\r\n\r\n/**\r\n * The `focus` directive sets focus on the given element once its connected to the DOM.\r\n */\r\nclass UmbDestroyDirective extends AsyncDirective {\r\n\t#el?: HTMLElement & { destroy: () => void };\r\n\r\n\toverride render() {\r\n\t\treturn nothing;\r\n\t}\r\n\r\n\toverride update(part: ElementPart) {\r\n\t\tthis.#el = part.element as any;\r\n\t\treturn nothing;\r\n\t}\r\n\r\n\toverride disconnected() {\r\n\t\tif (this.#el) {\r\n\t\t\tthis.#el.destroy();\r\n\t\t}\r\n\t\tthis.#el = undefined;\r\n\t}\r\n\r\n\t//override reconnected() {}\r\n}\r\n\r\n/**\r\n * @description\r\n * A Lit directive, which destroys the element once its disconnected from the DOM.\r\n * @example:\r\n * ```js\r\n * html`<input ${umbDestroyOnDisconnect()}>`;\r\n * ```\r\n */\r\nexport const umbDestroyOnDisconnect = directive(UmbDestroyDirective);\r\n\r\n//export type { UmbDestroyDirective };\r\n"],"names":["UmbLitElement","UmbElementMixin","LitElement","__decorateClass","property","hasFocus","current","target","node","UmbFocusDirective","AsyncDirective","#next","#el","#timeout","nothing","part","#setFocus","umbFocus","directive","UmbDestroyDirective","umbDestroyOnDisconnect"],"mappings":";;;;;;;AASa,MAAAA,UAAsBC,EAAgBC,CAAU,EAAE;AAAA,EAAxD,cAAA;AAAA,UAAA,GAAA,SAAA,GAQM,KAAS,MAA0B,IASnC,KAAS,OAAO;AAAA,EAAA;AAC7B;AAVsBC,EAAA;AAAA,EAApBC,EAAS;AAAA,GAREJ,EAQS,WAAA,KAAA;AASAG,EAAA;AAAA,EAApBC,EAAS;AAAA,GAjBEJ,EAiBS,WAAA,MAAA;ACjBtB,SAASK,EAASC,GAAcC,GAA8B;AAC7D,MAAID,MAAYC;AACR,WAAA;AAER,MAAID,EAAQ,YAAY;AACjB,UAAAE,IAAOF,EAAQ,WAAW;AAChC,QAAIE;AACI,aAAAH,EAASG,GAAMD,CAAM;AAAA,EAC7B;AAEM,SAAA;AACR;AAKA,MAAME,UAA0BC,EAAe;AAAA,EAC9C,OAAOC;AAAA,EACPC;AAAA,EACAC;AAAA,EAES,SAAS;AACV,WAAAC;AAAA,EAAA;AAAA,EAGC,OAAOC,GAAmB;AAC9B,WAAA,KAAKH,OAAQG,EAAK,YACHN,EAAAE,KAAQ,KAAKC,KAAMG,EAAK,SAC1C,KAAKC,GAAU,IAETF;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYRE,KAAY,MAAM;AAEjB,IAAI,KAAKH,OACR,aAAa,KAAKA,EAAQ,GAC1B,KAAKA,KAAW,SAGb,KAAKD,MAAO,KAAKA,OAAQH,EAAkBE,OAC9C,KAAKC,GAAI,MAAM,GACXP,EAAS,SAAS,eAAe,KAAKO,EAAG,MAAM,KAClD,KAAKC,KAAW,WAAW,KAAKG,IAAW,GAAG,IAE9CP,EAAkBE,KAAQ;AAAA,EAG7B;AAAA,EAES,eAAe;AACnB,IAAA,KAAKC,OAAQH,EAAkBE,OAClCF,EAAkBE,KAAQ,SAE3B,KAAKC,KAAM;AAAA,EAAA;AAAA;AAIb;AAUa,MAAAK,IAAWC,EAAUT,CAAiB;ACjFnD,MAAMU,UAA4BT,EAAe;AAAA,EAChDE;AAAA,EAES,SAAS;AACV,WAAAE;AAAA,EAAA;AAAA,EAGC,OAAOC,GAAmB;AAClC,gBAAKH,KAAMG,EAAK,SACTD;AAAA,EAAA;AAAA,EAGC,eAAe;AACvB,IAAI,KAAKF,MACR,KAAKA,GAAI,QAAQ,GAElB,KAAKA,KAAM;AAAA,EAAA;AAAA;AAIb;AAUa,MAAAQ,IAAyBF,EAAUC,CAAmB;"}