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