1fb726d48Sopenharmony_ci/* 2fb726d48Sopenharmony_ci * Copyright (C) 2022 Huawei Device Co., Ltd. 3fb726d48Sopenharmony_ci * Licensed under the Apache License, Version 2.0 (the "License"); 4fb726d48Sopenharmony_ci * you may not use this file except in compliance with the License. 5fb726d48Sopenharmony_ci * You may obtain a copy of the License at 6fb726d48Sopenharmony_ci * 7fb726d48Sopenharmony_ci * http://www.apache.org/licenses/LICENSE-2.0 8fb726d48Sopenharmony_ci * 9fb726d48Sopenharmony_ci * Unless required by applicable law or agreed to in writing, software 10fb726d48Sopenharmony_ci * distributed under the License is distributed on an "AS IS" BASIS, 11fb726d48Sopenharmony_ci * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12fb726d48Sopenharmony_ci * See the License for the specific language governing permissions and 13fb726d48Sopenharmony_ci * limitations under the License. 14fb726d48Sopenharmony_ci */ 15fb726d48Sopenharmony_ci 16fb726d48Sopenharmony_ciimport { BaseElement, element } from '../BaseElement'; 17fb726d48Sopenharmony_ci 18fb726d48Sopenharmony_ci@element('lit-popover-title') 19fb726d48Sopenharmony_ciexport class LitPopoverTitle extends BaseElement { 20fb726d48Sopenharmony_ci private titleText: HTMLElement | null | undefined; 21fb726d48Sopenharmony_ci 22fb726d48Sopenharmony_ci static get observedAttributes(): string[] { 23fb726d48Sopenharmony_ci return ['title']; 24fb726d48Sopenharmony_ci } 25fb726d48Sopenharmony_ci 26fb726d48Sopenharmony_ci initElements(): void { 27fb726d48Sopenharmony_ci this.titleText = this.shadowRoot?.querySelector('.pop-title'); 28fb726d48Sopenharmony_ci } 29fb726d48Sopenharmony_ci 30fb726d48Sopenharmony_ci initHtml(): string { 31fb726d48Sopenharmony_ci return ` 32fb726d48Sopenharmony_ci <style> 33fb726d48Sopenharmony_ci .pop-title{ 34fb726d48Sopenharmony_ci font-family: Helvetica,serif; 35fb726d48Sopenharmony_ci font-size: 14px; 36fb726d48Sopenharmony_ci opacity: 0.6; 37fb726d48Sopenharmony_ci color: #000000; 38fb726d48Sopenharmony_ci text-align: left; 39fb726d48Sopenharmony_ci line-height: 14px; 40fb726d48Sopenharmony_ci font-weight: 400; 41fb726d48Sopenharmony_ci padding-bottom: 5px; 42fb726d48Sopenharmony_ci } 43fb726d48Sopenharmony_ci </style> 44fb726d48Sopenharmony_ci <div class="pop-title"></div> 45fb726d48Sopenharmony_ci `; 46fb726d48Sopenharmony_ci } 47fb726d48Sopenharmony_ci 48fb726d48Sopenharmony_ci attributeChangedCallback(name: string, oldValue: string, newValue: string): void { 49fb726d48Sopenharmony_ci switch (name) { 50fb726d48Sopenharmony_ci case 'title': 51fb726d48Sopenharmony_ci if (this.titleText) { 52fb726d48Sopenharmony_ci this.titleText.textContent = newValue; 53fb726d48Sopenharmony_ci } 54fb726d48Sopenharmony_ci break; 55fb726d48Sopenharmony_ci default: 56fb726d48Sopenharmony_ci break; 57fb726d48Sopenharmony_ci } 58fb726d48Sopenharmony_ci } 59fb726d48Sopenharmony_ci} 60