Refactor autosize and input mask plugins to use window scope (#2208)

.changeset/stale-lions-talk.md

@@ -0,0 +1,6 @@
+---
+"@tabler/core": patch
+"preview": patch
+---
+
+Fix `autosize` and `input mask` plugins to use window scope

core/js/src/autosize.js

@@ -1,10 +1,7 @@
 // Autosize plugin
-
-import autosize from 'autosize';
-
 const elements = document.querySelectorAll('[data-bs-toggle="autosize"]');
 if (elements.length) {
 	elements.forEach(function (element) {
-		autosize && autosize(element);
+		window.autosize && window.autosize(element);
 	});
 }

core/js/src/input-mask.js

@@ -1,10 +1,8 @@
 // Input mask plugin
 
-import IMask from 'imask';
-
 var maskElementList = [].slice.call(document.querySelectorAll('[data-mask]'));
 maskElementList.map(function (maskEl) {
-	IMask && new IMask(maskEl, {
+	window.IMask && new window.IMask(maskEl, {
 		mask: maskEl.dataset.mask,
 		lazy: maskEl.dataset['mask-visible'] === 'true'
 	})

preview/pages/_data/libs.json

@@ -6,6 +6,8 @@
     "nouislider": "nouislider"
   },
   "js": {
+    "imask": "imask/dist/imask.min.js",
+    "autosize": "autosize/dist/autosize.min.js",
     "apexcharts": "apexcharts/dist/apexcharts.min.js",
     "nouislider": "nouislider/dist/nouislider.min.js",
     "countup": "countup.js/dist/countUp.umd.js",

preview/pages/form-elements.html

@@ -2,7 +2,7 @@
 title: Form elements
 page-header: Form elements
 page-menu: forms
-page-libs: [nouislider, autosize, tabler-flags, tabler-payments, litepicker, tom-select]
+page-libs: [nouislider, autosize, tabler-flags, tabler-payments, litepicker, tom-select, imask]
 layout: default
 permalink: form-elements.html
 ---