@ilo-org/twig 0.2.11 → 0.2.13

package/src/patterns/components/readmore/readmore.wingsuit.yml

@@ -1,5 +1,5 @@
 readmore:
-  use: '@components/readmore/readmore.twig'
+  use: "@components/readmore/readmore.twig"
   label: Read More
   description: A component for displaying rich text as entered in a WYSIWYG editor.
   fields:
@@ -15,13 +15,13 @@ readmore:
       type: string
       label: Excerpt
       description: HTML content
-      preview: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
+      preview: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
       required: true
     fulltext:
       type: string
       label: Full Text
       description: HTML content
-      preview: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
+      preview: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
       required: true
   settings:
     openatstart:
@@ -29,7 +29,7 @@ readmore:
       label: Open At Start
       description: should the read more be open at page load?
       options:
-        true: 'true'
+        true: "true"
         false: false
       preview: false
       required: true

package/src/patterns/components/richtext/index.js

@@ -2,5 +2,5 @@
  * rich text
  */
 // Module template
-import './richtext.twig';
-import './richtext.wingsuit.yml';
+import "./richtext.twig";
+import "./richtext.wingsuit.yml";

package/src/patterns/components/richtext/richtext.stories.jsx

@@ -1,7 +1,10 @@
-import './index';
+import "./index";
 
-const patternDefinition = require('./richtext.wingsuit.yml');
+export default {};
+const patternDefinition = require("./richtext.wingsuit.yml");
 
+/* eslint-disable-next-line */
+/* eslint-disable-next-line */
 export const wingsuit = {
   patternDefinition,
 };

package/src/patterns/components/richtext/richtext.wingsuit.yml

@@ -1,5 +1,5 @@
 richtext:
-  use: '@components/richtext/richtext.twig'
+  use: "@components/richtext/richtext.twig"
   label: Rich Text
   description: A component for displaying rich text as entered in a WYSIWYG editor.
   fields:

package/src/patterns/components/searchfield/index.js

@@ -2,5 +2,5 @@
  * Search Field
  */
 // Module template
-import './searchfield.twig';
-import './searchfield.wingsuit.yml';
+import "./searchfield.twig";
+import "./searchfield.wingsuit.yml";

package/src/patterns/components/searchfield/searchfield.stories.jsx

@@ -1,7 +1,10 @@
-import './index';
+import "./index";
 
-const patternDefinition = require('./searchfield.wingsuit.yml');
+export default {};
+const patternDefinition = require("./searchfield.wingsuit.yml");
 
+/* eslint-disable-next-line */
+/* eslint-disable-next-line */
 export const wingsuit = {
   patternDefinition,
 };

package/src/patterns/components/searchfield/searchfield.wingsuit.yml

@@ -1,5 +1,5 @@
 searchfield:
-  use: '@components/searchfield/searchfield.twig'
+  use: "@components/searchfield/searchfield.twig"
   label: Search Field
   description: A component for displaying a search field.
   fields:

package/src/patterns/components/table/index.js

@@ -2,6 +2,6 @@
  * Table
  */
 // Module template
-import './table.twig';
-import './table.wingsuit.yml';
-import './table.behavior.js';
+import "./table.twig";
+import "./table.wingsuit.yml";
+import "./table.behavior.js";

package/src/patterns/components/table/table.behavior.js

@@ -1,4 +1,4 @@
-import Table from './table';
+import Table from "./table";
 
 Drupal.behaviors.table = {
   attach() {
@@ -6,7 +6,7 @@ Drupal.behaviors.table = {
       document.querySelectorAll(`[data-loadcomponent="Table"]`),
       (element) => {
         // eslint-disable-next-line no-console
-        console.log('loading Table component....');
+        console.log("loading Table component....");
         new Table(element);
       }
     );

package/src/patterns/components/table/table.js

@@ -1,4 +1,4 @@
-import { EVENTS, ARIA, MISC } from '@ilo-org/utils';
+import { EVENTS, ARIA, MISC } from "@ilo-org/utils";
 
 /**
  * The Table module which handles rendering field labels inline on a form.
@@ -54,11 +54,19 @@ export default class Table {
      * The button for toggling Read More state
      * @type {Object}
      */
-    this.thCells = this.element.querySelectorAll(`.${this.prefix}--table--head--cell`);
-    this.tdCells = this.element.querySelectorAll(`.${this.prefix}--table--body--cell`);
+    this.thCells = this.element.querySelectorAll(
+      `.${this.prefix}--table--head--cell`
+    );
+    this.tdCells = this.element.querySelectorAll(
+      `.${this.prefix}--table--body--cell`
+    );
     this.rows = this.element.querySelectorAll(`[class~="--row"]`);
-    this.thRows = this.element.querySelectorAll(`.${this.prefix}--table--head--row`);
-    this.tdRows = this.element.querySelectorAll(`.${this.prefix}--table--body--row`);
+    this.thRows = this.element.querySelectorAll(
+      `.${this.prefix}--table--head--row`
+    );
+    this.tdRows = this.element.querySelectorAll(
+      `.${this.prefix}--table--body--row`
+    );
     this.tBody = this.element.querySelector(`.${this.prefix}--table--body`);
 
     return this;
@@ -85,27 +93,39 @@ export default class Table {
    */
   setUpSorting() {
     Array.from(this.tdRows).forEach((tdrow) => {
-      Array.from(tdrow.querySelectorAll(`.${this.prefix}--table--body--cell`)).forEach(
-        (cell, index) => {
-          const sortablecontent = cell.textContent.toLowerCase();
-          if (typeof this.sortlist[index] === 'undefined') {
-            this.sortlist[index] = [];
-          }
-          if (cell.classList.contains('numeric')) {
-            if (this.isDate(sortablecontent)) {
-              this.sortlist[index].push({ value: sortablecontent, node: tdrow, type: 'date' });
-            } else {
-              this.sortlist[index].push({ value: sortablecontent, node: tdrow, type: 'numeric' });
-            }
-          } else if (cell.innerHTML.match(/^([^0-9]*)$/)) {
-            this.sortlist[index].push({ value: sortablecontent, node: tdrow, type: 'string' });
+      Array.from(
+        tdrow.querySelectorAll(`.${this.prefix}--table--body--cell`)
+      ).forEach((cell, index) => {
+        const sortablecontent = cell.textContent.toLowerCase();
+        if (typeof this.sortlist[index] === "undefined") {
+          this.sortlist[index] = [];
+        }
+        if (cell.classList.contains("numeric")) {
+          if (this.isDate(sortablecontent)) {
+            this.sortlist[index].push({
+              value: sortablecontent,
+              node: tdrow,
+              type: "date",
+            });
+          } else {
+            this.sortlist[index].push({
+              value: sortablecontent,
+              node: tdrow,
+              type: "numeric",
+            });
           }
+        } else if (cell.innerHTML.match(/^([^0-9]*)$/)) {
+          this.sortlist[index].push({
+            value: sortablecontent,
+            node: tdrow,
+            type: "string",
+          });
         }
-      );
+      });
     });
     this.sortlist.forEach((column, index) => {
       if (this.sortlist[index].length === this.tdRows.length) {
-        this.thCells[index].classList.add('sortable');
+        this.thCells[index].classList.add("sortable");
       }
     });
 
@@ -119,7 +139,7 @@ export default class Table {
    * @chainable
    */
   enable() {
-    this.element.classList.add('table--js');
+    this.element.classList.add("table--js");
 
     Array.from(this.thCells).forEach((thcell) => {
       thcell.addEventListener(EVENTS.CLICK, (e) => this.ClickThHandler(e));
@@ -144,7 +164,7 @@ export default class Table {
       // set/remove aria-sort attribute
       if (thcell === e.target) {
         if (
-          typeof thcell.getAttribute(ARIA.SORT) === 'undefined' ||
+          typeof thcell.getAttribute(ARIA.SORT) === "undefined" ||
           thcell.getAttribute(ARIA.SORT) === MISC.DESCENDING
         ) {
           thcell.setAttribute(ARIA.SORT, MISC.ASCENDING);
@@ -172,37 +192,39 @@ export default class Table {
     let currentindex = null;
 
     Array.from(this.tdRows).forEach((tdrow) => {
-      tdrow.classList.remove('selected');
+      tdrow.classList.remove("selected");
     });
 
-    e.target.parentElement.classList.add('selected');
+    e.target.parentElement.classList.add("selected");
 
     Array.from(this.tdCells).forEach((tdcell) => {
-      tdcell.classList.remove('selected');
-      tdcell.classList.remove('column--selected');
+      tdcell.classList.remove("selected");
+      tdcell.classList.remove("column--selected");
     });
 
     Array.from(
-      e.target.parentElement.querySelectorAll(`.${this.prefix}--table--body--cell`)
+      e.target.parentElement.querySelectorAll(
+        `.${this.prefix}--table--body--cell`
+      )
     ).forEach((tdcell, index) => {
       if (tdcell === e.target) {
-        tdcell.classList.add('selected');
+        tdcell.classList.add("selected");
         currentindex = index;
       }
     });
 
     Array.from(this.tdRows).forEach((tdrow) => {
-      Array.from(tdrow.querySelectorAll(`.${this.prefix}--table--body--cell`)).forEach(
-        (tdcell, index) => {
-          if (index === currentindex && tdcell !== e.target) {
-            tdcell.classList.add('column--selected');
-          }
+      Array.from(
+        tdrow.querySelectorAll(`.${this.prefix}--table--body--cell`)
+      ).forEach((tdcell, index) => {
+        if (index === currentindex && tdcell !== e.target) {
+          tdcell.classList.add("column--selected");
         }
-      );
+      });
     });
 
-    if (e.target.hasAttribute('href')) {
-      window.location.href = e.target.getAttribute('href');
+    if (e.target.hasAttribute("href")) {
+      window.location.href = e.target.getAttribute("href");
     }
 
     return this;
@@ -239,9 +261,9 @@ export default class Table {
         if (a.value === b.value) {
           return 0;
         } else {
-          if (a.type === 'numeric') {
+          if (a.type === "numeric") {
             return a.value - b.value;
-          } else if (a.type === 'date') {
+          } else if (a.type === "date") {
             return new Date(a.value) - new Date(b.value);
           } else {
             return a.value < b.value ? -1 : 1;
@@ -251,9 +273,9 @@ export default class Table {
         if (a.value === b.value) {
           return 0;
         } else {
-          if (a.type === 'numeric') {
+          if (a.type === "numeric") {
             return b.value - a.value;
-          } else if (a.type === 'date') {
+          } else if (a.type === "date") {
             return new Date(b.value) - new Date(a.value);
           } else {
             return a.value > b.value ? -1 : 1;
@@ -269,15 +291,15 @@ export default class Table {
    *
    * @return {Boolean} is it a date?
    */
-  isDate = function (date) {
+  isDate(date) {
     let isdate = false;
     if (date.match(/^[0-3]?[0-9]\/[0-3]?[0-9]\/(?:[0-9]{2})?[0-9]{2}$/)) {
       isdate = true;
     }
-    if (date.match(/^[0-3]?[0-9]\-[0-3]?[0-9]\-(?:[0-9]{2})?[0-9]{2}$/)) {
+    if (date.match(/^[0-3]?[0-9]-[0-3]?[0-9]-(?:[0-9]{2})?[0-9]{2}$/)) {
       isdate = true;
     }
 
     return isdate;
-  };
+  }
 }

package/src/patterns/components/table/table.stories.jsx

@@ -1,7 +1,10 @@
-import './index';
+import "./index";
 
-const patternDefinition = require('./table.wingsuit.yml');
+export default {};
+const patternDefinition = require("./table.wingsuit.yml");
 
+/* eslint-disable-next-line */
+/* eslint-disable-next-line */
 export const wingsuit = {
   patternDefinition,
 };

package/src/patterns/components/table/table.wingsuit.yml

@@ -1,5 +1,5 @@
 table:
-  use: '@components/table/table.twig'
+  use: "@components/table/table.twig"
   label: Table
   description: A component for displaying data in a table
   fields:
@@ -39,62 +39,52 @@ table:
       label: Table Data
       description: The data of the table proper. Cells can include plain text or plain text with anchor tags.
       preview:
-        -
-          - "table cell text one"
+        - - "table cell text one"
           - "table cell text 1"
           - "table cell <a href='http://www.ilo.org'>text one</a>"
           - "1-20"
           - "11/05/2022"
-        -
-          - "table cell text two"
+        - - "table cell text two"
           - "table cell text 2"
           - "table cell <a href='http://www.ilo.org'>text two<a>"
           - "3"
           - "7/19/2022"
-        -
-          - "table cell text three"
+        - - "table cell text three"
           - "table cell text 3"
           - "table cell <a href='http://www.ilo.org'>text three</a>"
           - "75"
           - "01/01/1975"
-        -
-          - "table cell text four"
+        - - "table cell text four"
           - "table cell text 4"
           - "table cell <a href='http://www.ilo.org'>text four</a>"
           - "10-15"
           - "01/01/2022"
-        -
-          - "table cell text five"
+        - - "table cell text five"
           - "table cell text 5"
           - "table cell <a href='http://www.ilo.org'>text five</a>"
           - "5"
           - "10/31/2022"
-        -
-          - "table cell text six"
+        - - "table cell text six"
           - "table cell text 6"
           - "table cell <a href='http://www.ilo.org'>text six</a>"
           - "6"
           - "08/13/2016"
-        -
-          - "table cell text seven"
+        - - "table cell text seven"
           - "table cell text 7"
           - "table cell <a href='http://www.ilo.org'>text seven</a>"
           - "7"
           - "11/18/2013"
-        -
-          - "table cell text eight"
+        - - "table cell text eight"
           - "table cell text 8"
           - "table cell <a href='http://www.ilo.org'>text eight</a>"
           - "8"
           - "12/31/1"
-        -
-          - "table cell text nine"
+        - - "table cell text nine"
           - "table cell text 9"
           - "table cell <a href='http://www.ilo.org'>text nine</a>"
           - "9"
           - "01/01/1970"
-        -
-          - "table cell text ten"
+        - - "table cell text ten"
           - "table cell text 10"
           - "table cell <a href='http://www.ilo.org'>text ten</a>"
           - "10"

package/src/patterns/components/tableofcontents/index.js

@@ -2,6 +2,6 @@
  * table of contents
  */
 // Module template
-import './tableofcontents.twig';
-import './tableofcontents.wingsuit.yml';
-import './tableofcontents.behavior';
+import "./tableofcontents.twig";
+import "./tableofcontents.wingsuit.yml";
+import "./tableofcontents.behavior";

package/src/patterns/components/tableofcontents/tableofcontents.behavior.js

@@ -1,4 +1,4 @@
-import TableOfContents from './tableofcontents';
+import TableOfContents from "./tableofcontents";
 
 Drupal.behaviors.tableofcontents = {
   attach() {
@@ -6,7 +6,7 @@ Drupal.behaviors.tableofcontents = {
       document.querySelectorAll(`[data-loadcomponent="TableOfContents"]`),
       (element) => {
         // eslint-disable-next-line no-console
-        console.log('loading TableOfContents component....');
+        console.log("loading TableOfContents component....");
         new TableOfContents(element);
       }
     );

package/src/patterns/components/tableofcontents/tableofcontents.js

@@ -1,4 +1,4 @@
-import { EVENTS } from '@ilo-org/utils';
+import { EVENTS } from "@ilo-org/utils";
 
 /**
  * The TableOfContents module which handles control and display of a TableOfContents dialog
@@ -54,10 +54,16 @@ export default class TableOfContents {
      */
     this.OpenButton = this.element.querySelector(`.toc--modal--open`);
     this.CloseButton = this.element.querySelector(`.toc--modal--close`);
-    this.trigger = this.element.querySelector(`.${this.prefix}--table-of-contents--trigger`);
-    this.modalUx = this.element.querySelector(`.${this.prefix}--table-of-contents--modal`);
+    this.trigger = this.element.querySelector(
+      `.${this.prefix}--table-of-contents--trigger`
+    );
+    this.modalUx = this.element.querySelector(
+      `.${this.prefix}--table-of-contents--modal`
+    );
     this.toc = this.element.querySelector(`.${this.prefix}--table-of-contents`);
-    this.tocItems = this.element.querySelectorAll(`.${this.prefix}--table-of-contents--link`);
+    this.tocItems = this.element.querySelectorAll(
+      `.${this.prefix}--table-of-contents--link`
+    );
 
     return this;
   }
@@ -84,11 +90,13 @@ export default class TableOfContents {
    * @chainable
    */
   enable() {
-    this.OpenButton.addEventListener(EVENTS.CLICK, () => this.OpenButtonHandler());
+    this.OpenButton.addEventListener(EVENTS.CLICK, () =>
+      this.OpenButtonHandler()
+    );
     this.CloseButton.addEventListener(EVENTS.CLICK, () => this.CloseHandler());
 
     if (this.tocItems.length > 0) {
-      this.tocItems.forEach((link, i) => {
+      this.tocItems.forEach((link) => {
         link.addEventListener(EVENTS.CLICK, () => this.linkClickHandler());
       });
     }
@@ -103,13 +111,13 @@ export default class TableOfContents {
    * @chainable
    */
   openButtonClick() {
-    this.trigger.classList.add('hide');
-    this.element.classList.add('show');
-    this.modalUx.classList.add('show');
-    this.toc.classList.add('show');
+    this.trigger.classList.add("hide");
+    this.element.classList.add("show");
+    this.modalUx.classList.add("show");
+    this.toc.classList.add("show");
     setTimeout(() => {
-      this.modalUx.classList.add('fadein');
-      this.toc.classList.add('fadein');
+      this.modalUx.classList.add("fadein");
+      this.toc.classList.add("fadein");
     }, 125);
     window.addEventListener(EVENTS.KEY_DOWN, (e) => this.KeyPressHandler(e));
 
@@ -123,13 +131,13 @@ export default class TableOfContents {
    * @chainable
    */
   closeButtonClick() {
-    this.modalUx.classList.remove('fadein');
-    this.toc.classList.remove('fadein');
+    this.modalUx.classList.remove("fadein");
+    this.toc.classList.remove("fadein");
     setTimeout(() => {
-      this.modalUx.classList.remove('show');
-      this.toc.classList.remove('show');
-      this.element.classList.remove('show');
-      this.trigger.classList.remove('hide');
+      this.modalUx.classList.remove("show");
+      this.toc.classList.remove("show");
+      this.element.classList.remove("show");
+      this.trigger.classList.remove("hide");
     }, 125);
     window.removeEventListener(EVENTS.KEY_DOWN, (e) => this.KeyPressHandler(e));
 
@@ -155,7 +163,7 @@ export default class TableOfContents {
    * @chainable
    */
   keyPress(e) {
-    if (e.key === 'Escape') {
+    if (e.key === "Escape") {
       this.closeButtonClick();
     }
 

package/src/patterns/components/tableofcontents/tableofcontents.stories.jsx

@@ -1,7 +1,10 @@
-import './index';
+import "./index";
 
-const patternDefinition = require('./tableofcontents.wingsuit.yml');
+export default {};
+const patternDefinition = require("./tableofcontents.wingsuit.yml");
 
+/* eslint-disable-next-line */
+/* eslint-disable-next-line */
 export const wingsuit = {
   patternDefinition,
 };

package/src/patterns/components/tableofcontents/tableofcontents.wingsuit.yml

@@ -1,5 +1,5 @@
 tableofcontents:
-  use: '@components/tableofcontents/tableofcontents.twig'
+  use: "@components/tableofcontents/tableofcontents.twig"
   label: Table Of Contents
   description: A component for displaying links internal to a page
   fields:
@@ -8,10 +8,10 @@ tableofcontents:
       label: Open Button
       description: The label and settings for the button that will show the table of contents at small breakpoints
       preview:
-        size: 'medium'
-        type: 'secondary'
-        label: 'Open Button'
-        className: 'toc--modal--open'
+        size: "medium"
+        type: "secondary"
+        label: "Open Button"
+        className: "toc--modal--open"
         opensmodal: true
       required: true
     closebutton:
@@ -19,13 +19,13 @@ tableofcontents:
       label: Close Button
       description: Label and settings for the "close" button
       preview:
-        size: 'large'
-        type: 'tertiary'
-        label: 'Close Button'
+        size: "large"
+        type: "tertiary"
+        label: "Close Button"
         icon: close
         iconPos: center
         icononly: true
-        className: 'toc--modal--close'
+        className: "toc--modal--close"
     headline:
       type: string
       label: Headline
@@ -39,13 +39,13 @@ tableofcontents:
       required: true
       preview:
         - label: "Item One"
-          href: '#example'
+          href: "#example"
         - label: "Item Two"
-          href: '#example'
+          href: "#example"
         - label: "Item Three"
-          href: '#example'
+          href: "#example"
         - label: "Item Four"
-          href: '#example'
+          href: "#example"
         - label: "Item Five"
-          href: '#example'
+          href: "#example"
   visibility: storybook

package/src/patterns/components/tabs/index.js

@@ -2,6 +2,6 @@
  * Tabs
  */
 // Module template
-import './tabs.twig';
-import './tabs.wingsuit.yml';
-import './tabs.behavior.js';
+import "./tabs.twig";
+import "./tabs.wingsuit.yml";
+import "./tabs.behavior.js";

package/src/patterns/components/tabs/tabs.behavior.js

@@ -1,5 +1,5 @@
-import Tabs from './tabs';
-import Tooltip from '../tooltip/tooltip';
+import Tabs from "./tabs";
+import Tooltip from "../tooltip/tooltip";
 
 Drupal.behaviors.tabs = {
   attach() {
@@ -7,7 +7,7 @@ Drupal.behaviors.tabs = {
       document.querySelectorAll(`[data-loadcomponent="Tabs"]`),
       (element) => {
         // eslint-disable-next-line no-console
-        console.log('loading Tabs component....');
+        console.log("loading Tabs component....");
         new Tabs(element);
       }
     );
@@ -15,7 +15,7 @@ Drupal.behaviors.tabs = {
       document.querySelectorAll(`[data-loadcomponent="Tooltip"]`),
       (element) => {
         // eslint-disable-next-line no-console
-        console.log('loading Tooltip component....');
+        console.log("loading Tooltip component....");
         new Tooltip(element);
       }
     );