consistent display: none

DevExpress · Jun 13, 2024 · 142172a · 142172a
1 parent 2099278
commit 142172a
Showing 1 changed file with 21 additions and 19 deletions.
diff --git a/packages/devextreme/js/__internal/core/license/trial_panel.client.ts b/packages/devextreme/js/__internal/core/license/trial_panel.client.ts
@@ -14,6 +14,16 @@ export interface CustomTrialPanelStyles {
   buttonStyles?: StylesMap;
 }
 
+function createImportantStyles(defaultStyles: StylesMap, customStyles?: StylesMap): string {
+  const styles = customStyles ? { ...defaultStyles, ...customStyles } : defaultStyles;
+
+  return Object.keys(styles)
+    .reduce(
+      (cssString, currentKey) => `${cssString}${[currentKey, `${styles[currentKey]} !important;`].join(': ')}`,
+      '',
+    );
+}
+
 const SafeHTMLElement = typeof HTMLElement !== 'undefined'
   ? HTMLElement
   // eslint-disable-next-line max-len
@@ -100,35 +110,25 @@ class DxLicense extends SafeHTMLElement {
   constructor() {
     super();
 
-    this._spanStyles = this._createImportantStyles(textStyles, DxLicense.customStyles?.textStyles);
-    this._linkStyles = this._createImportantStyles(textStyles, DxLicense.customStyles?.linkStyles);
+    this._spanStyles = createImportantStyles(textStyles, DxLicense.customStyles?.textStyles);
+    this._linkStyles = createImportantStyles(textStyles, DxLicense.customStyles?.linkStyles);
 
-    this._containerStyles = this._createImportantStyles(
+    this._containerStyles = createImportantStyles(
       containerStyles,
       DxLicense.customStyles?.containerStyles,
     );
 
-    this._contentStyles = this._createImportantStyles(
+    this._contentStyles = createImportantStyles(
       contentStyles,
       DxLicense.customStyles?.contentStyles,
     );
 
-    this._buttonStyles = this._createImportantStyles(
+    this._buttonStyles = createImportantStyles(
       buttonStyles,
       DxLicense.customStyles?.contentStyles,
     );
   }
 
-  private _createImportantStyles(defaultStyles: StylesMap, customStyles?: StylesMap): string {
-    const styles = customStyles ? { ...defaultStyles, ...customStyles } : defaultStyles;
-
-    return Object.keys(styles)
-      .reduce(
-        (cssString, currentKey) => `${cssString}${[currentKey, `${styles[currentKey]} !important;`].join(': ')}`,
-        '',
-      );
-  }
-
   private _createSpan(text: string): HTMLSpanElement {
     const span = document.createElement('span');
     span.innerText = text;
@@ -153,7 +153,7 @@ class DxLicense extends SafeHTMLElement {
     const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
 
     polygon.setAttribute('points', '13.4 12.7 8.7 8 13.4 3.4 12.6 2.6 8 7.3 3.4 2.6 2.6 3.4 7.3 8 2.6 12.6 3.4 13.4 8 8.7 12.7 13.4 13.4 12.7');
-    polygon.style.cssText = this._createImportantStyles({
+    polygon.style.cssText = createImportantStyles({
       fill: '#fff',
       opacity: '.5',
       'stroke-width': '0px',
@@ -163,7 +163,7 @@ class DxLicense extends SafeHTMLElement {
     svg.setAttribute('data-name', 'Layer 1');
     svg.setAttribute('version', '1.1');
     svg.setAttribute('viewBox', '0 0 16 16');
-    svg.style.cssText = this._createImportantStyles({
+    svg.style.cssText = createImportantStyles({
       'vertical-align': 'baseline',
     });
 
@@ -172,7 +172,7 @@ class DxLicense extends SafeHTMLElement {
 
     button.onclick = (): void => {
       this._hidden = true;
-      this.style.cssText = this._createImportantStyles({
+      this.style.cssText = createImportantStyles({
         display: 'none',
       });
     };
@@ -234,7 +234,9 @@ class DxLicense extends SafeHTMLElement {
 }
 class DxLicenseTrigger extends SafeHTMLElement {
   public connectedCallback(): void {
-    this.style.display = 'none';
+    this.style.cssText = createImportantStyles({
+      display: 'none',
+    });
 
     const licensePanel = document.getElementsByTagName(componentNames.panel);
     if (!licensePanel.length) {