TYPO3 v15 dev-main snapshot ()

Resources/Public/JavaScript/form-engine/element/suggest/result-container.js

@@ -0,0 +1,13 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+import{property as p,customElement as f}from"lit/decorators.js";import{LitElement as m,html as r,css as g}from"lit";import"@typo3/backend/form-engine/element/suggest/result-item.js";import h from"~labels/backend.alt_doc";var a=function(s,e,t,l){var o=arguments.length,n=o<3?e:l===null?l=Object.getOwnPropertyDescriptor(e,t):l,i;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")n=Reflect.decorate(s,e,t,l);else for(var u=s.length-1;u>=0;u--)(i=s[u])&&(n=(o<3?i(n):o>3?i(e,t,n):i(e,t))||n);return o>3&&n&&Object.defineProperty(e,t,n),n};let c=class extends m{constructor(){super(...arguments),this.results=null}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeyDown),super.disconnectedCallback()}createRenderRoot(){return this}render(){let e;return this.results!==null&&(this.results.length===0?e=r`<div class="alert alert-info">${h.get("search.no_records_found")}</div>`:e=r`${this.results.map(t=>this.renderResultItem(t))}`),r`<typo3-backend-formengine-suggest-result-list>${e}</typo3-backend-formengine-suggest-result-list>`}renderResultItem(e){return r`<typo3-backend-formengine-suggest-result-item tabindex=1 icon=${JSON.stringify(e.icon)} uid=${e.uid} table=${e.table} label=${e.label} path=${e.path}></typo3-backend-formengine-suggest-result-item>`}handleKeyDown(e){if(e.preventDefault(),e.key==="Escape"){this.closest(".t3-form-suggest-container").querySelector('input[type="search"]').focus(),this.hidden=!0;return}if(!["ArrowDown","ArrowUp"].includes(e.key)||document.activeElement.tagName.toLowerCase()!=="typo3-backend-formengine-suggest-result-item")return;let t;e.key==="ArrowDown"?t=document.activeElement.nextElementSibling:(t=document.activeElement.previousElementSibling,t===null&&(t=this.closest(".t3-form-suggest-container").querySelector('input[type="search"]'))),t!==null&&t.focus()}};a([p({type:Object})],c.prototype,"results",void 0),c=a([f("typo3-backend-formengine-suggest-result-container")],c);let d=class extends m{static{this.styles=g`:host{display:block}`}render(){return r`<slot></slot>`}};d=a([f("typo3-backend-formengine-suggest-result-list")],d);export{c as ResultContainer,d as ResultList};

Resources/Public/JavaScript/form-engine/element/suggest/result-item.js

@@ -0,0 +1,13 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+import{html as u}from"lit";import{property as l,customElement as m}from"lit/decorators.js";import{PseudoButtonLitElement as d}from"@typo3/backend/element/pseudo-button.js";import"@typo3/backend/element/icon-element.js";var s=function(c,e,t,n){var r=arguments.length,o=r<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,t):n,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(c,e,t,n);else for(var p=c.length-1;p>=0;p--)(a=c[p])&&(o=(r<3?a(o):r>3?a(e,t,o):a(e,t))||o);return r>3&&o&&Object.defineProperty(e,t,o),o};let i=class extends d{constructor(){super(),this.addEventListener("blur",this.onBlur)}buttonActivated(e){this.dispatchItemChosenEvent(e.currentTarget)}createRenderRoot(){return this}render(){return u`<div class=formengine-suggest-result-item-icon><typo3-backend-icon title=${this.icon.title} identifier=${this.icon.identifier} overlay=${this.icon.overlay} size=small></typo3-backend-icon></div><div class=formengine-suggest-result-item-label>${this.label} <small>[${this.uid}] ${this.path}</small></div>`}onBlur(e){let t=!0;const n=e.relatedTarget,r=this.closest("typo3-backend-formengine-suggest-result-container");n?.tagName.toLowerCase()==="typo3-backend-formengine-suggest-result-item"&&(t=!1),n?.matches('input[type="search"]')&&r.contains(n)&&(t=!1),r.hidden=t}dispatchItemChosenEvent(e){e.closest("typo3-backend-formengine-suggest-result-container").dispatchEvent(new CustomEvent("typo3:formengine:suggest-item-chosen",{detail:{element:e}}))}};s([l({type:Object})],i.prototype,"icon",void 0),s([l({type:Number})],i.prototype,"uid",void 0),s([l({type:String})],i.prototype,"table",void 0),s([l({type:String})],i.prototype,"label",void 0),s([l({type:String})],i.prototype,"path",void 0),i=s([m("typo3-backend-formengine-suggest-result-item")],i);export{i as ResultItem};