feat: convert js files to ts

Author: MichaelGitArt

package.json

@@ -23,6 +23,7 @@
     "vue": "^3.0.5"
   },
   "devDependencies": {
+    "@types/body-scroll-lock": "^2.6.2",
     "@types/node": "^16.3.1",
     "@vitejs/plugin-vue": "^1.2.4",
     "@vue/compiler-sfc": "^3.0.5",

src/gitart-vue-dialog/composable/stackable.ts

@@ -35,11 +35,10 @@ export const useStackable: (param: IUseStackableParams) => {activeZIndex: Comput
     const index = isActive.value ? getMaxZIndex() + 2 : getZIndex(content.value);
 
     if (index === null) {
-      // return null;
       return 0
     }
 
-    return parseInt(index);
+    return index;
   });
 
   return {

src/gitart-vue-dialog/composable/useScrollbar.js

@@ -0,0 +1,30 @@
+/**
+ *
+ * @param {string | number | null | undefined} str
+ * @param {string} unit
+ * @returns {string | undefined}
+ */
+export const convertToUnit = (str: string | number | null | undefined, unit = 'px') => {
+  if (str == null || str === '') {
+    return undefined;
+  } else if (isNaN(+str)) {
+    return String(str);
+  } else {
+    return `${Number(str)}${unit}`;
+  }
+};
+
+export const getZIndex = (el?: Element): number => {
+  if (!el || el.nodeType !== Node.ELEMENT_NODE) return 0;
+
+  const index = parseInt(window.getComputedStyle(el).getPropertyValue('z-index'));
+
+  if (!index) return getZIndex(el.parentNode as HTMLElement);
+
+  return index;
+};
+
+export default {
+  convertToUnit,
+  getZIndex,
+};

src/gitart-vue-dialog/helper/index.js

@@ -0,0 +1,42 @@
+import { enableBodyScroll, disableBodyScroll } from 'body-scroll-lock';
+
+export const getScrollbarWidth = () => {
+  const container = document.createElement('div');
+  container.style.visibility = 'hidden';
+  container.style.overflow = 'scroll';
+  const inner = document.createElement('div');
+
+  container.appendChild(inner);
+  document.body.appendChild(container);
+  const scrollbarWidth = container.offsetWidth - inner.offsetWidth;
+  document.body.removeChild(container);
+
+  return scrollbarWidth;
+};
+
+/**
+ *
+ * @param {boolean} hideScroll
+ */
+const disableScroll = (hideScroll = false) => {
+  if (hideScroll) {
+    const scrollWidth = getScrollbarWidth();
+    disableBodyScroll(document.body);
+    if (scrollWidth > 0) {
+      document.body.style.paddingRight = scrollWidth + 'px';
+    }
+  } else {
+    disableBodyScroll(document.body);
+  }
+};
+
+const enableScroll = () => {
+  enableBodyScroll(document.body);
+  document.body.style.paddingRight = '0';
+};
+
+export default {
+  getScrollbarWidth,
+  disableScroll,
+  enableScroll,
+};

src/gitart-vue-dialog/helper/index.ts

@@ -20,6 +20,11 @@
     "@babel/helper-validator-identifier" "^7.14.5"
     to-fast-properties "^2.0.0"
 
+"@types/body-scroll-lock@^2.6.2":
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/@types/body-scroll-lock/-/body-scroll-lock-2.6.2.tgz#ce56d17e1bf8383c08a074733c4e9e536a59ae61"
+  integrity sha512-PhoQPbwPYspXqf7lkwtF7aJzAwL88t+9E/e0b2X84tlHpU8ZuS9UNnLtkT0XhyZJYHpET5qRfIdZ0HBIxuc7HQ==
+
 "@types/estree@^0.0.48":
   version "0.0.48"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.48.tgz#18dc8091b285df90db2f25aa7d906cfc394b7f74"