feat: code format for quarkd

hellof2e · Nov 8, 2022 · fd380b4 · fd380b4
1 parent 6c22936
commit fd380b4
Show file tree

Hide file tree

Showing 48 changed files with 2,020 additions and 1,939 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -28,15 +28,7 @@
                 "@typescript-eslint/explicit-module-boundary-types": 0,
                 "@typescript-eslint/no-explicit-any": 0,
                 "@typescript-eslint/no-empty-function": 0,
-                "@typescript-eslint/no-inferrable-types": 0
-            }
-        },
-        {
-            "files":[
-                "packages/quark-core/src/**/*.ts"
-            ],
-            "rules": {
-                "@typescript-eslint/explicit-module-boundary-types": 0
+                "@typescript-eslint/no-inferrable-types": 2
             }
         },
         {

diff --git a/package.json b/package.json
@@ -13,7 +13,7 @@
     "init": "yarn && yarn run link && cd example && yarn",
     "dev": "cd example && yarn run dev",
     "link": "node ./scripts/link",
-    "codeformat": "prettier --write packages/quark/src/**/*.test.js",
+    "codeformat": "prettier --write *",
     "clean": "lerna clean -y",
     "prepare": "husky install",
     "copydocs": "node ./scripts/copydocs",

diff --git a/packages/quark/src/cell/index.tsx b/packages/quark/src/cell/index.tsx
@@ -1,38 +1,35 @@
-import QuarkElement, {
-  property,
-  customElement,
-} from '@quarkd/core';
-import '@quarkd/icons/lib/arrow-right';
-import cellStyle from './cellStyle.css';
-import cellGroupCss from './cellGroupStyle.css';
+import QuarkElement, { property, customElement } from "@quarkd/core";
+import "@quarkd/icons/lib/arrow-right";
+import cellStyle from "./cellStyle.css";
+import cellGroupCss from "./cellGroupStyle.css";
 export interface Props {
-  title: string
-  desc?: string
+  title: string;
+  desc?: string;
   to?: string;
-  islink?: boolean
-  icon?: string
+  islink?: boolean;
+  icon?: string;
 }
 @customElement({
-  tag: 'quark-cell',
+  tag: "quark-cell",
   style: cellStyle,
 })
 class QuarkCell extends QuarkElement {
   @property()
-  title: string = '';
+  title = "";
 
   @property()
-  icon: string = '';
+  icon = "";
 
   @property()
-  desc: string = '';
+  desc = "";
 
   @property()
-  to: string = '';
+  to = "";
 
   @property({
     type: Boolean,
   })
-  islink: boolean = false;
+  islink = false;
 
   handleNavigation = () => {
     if (this.to) {
@@ -41,8 +38,14 @@ class QuarkCell extends QuarkElement {
   };
 
   renderIcon = () => {
-    if (this.icon && this.icon.includes('http')) {
-      return <img src={this.icon} class="quark-cell-icon" style={{ marginRight: 4 }} />;
+    if (this.icon && this.icon.includes("http")) {
+      return (
+        <img
+          src={this.icon}
+          class="quark-cell-icon"
+          style={{ marginRight: 4 }}
+        />
+      );
     }
     return null;
   };
@@ -70,7 +73,7 @@ class QuarkCell extends QuarkElement {
 export default QuarkCell;
 
 @customElement({
-  tag: 'quark-cell-group',
+  tag: "quark-cell-group",
   style: cellGroupCss,
 })
 class QuarkCellGroup extends QuarkElement {

diff --git a/packages/quark/src/checkbox/index.tsx b/packages/quark/src/checkbox/index.tsx
@@ -1,61 +1,60 @@
-import { classNames } from '../../utils/index';
+import { classNames } from "../../utils/index";
 import QuarkElement, {
   customElement,
   property,
   state,
   createRef,
-} from '@quarkd/core';
-import {slotAssignedElements} from '../../utils/public';
-import { checkFalse } from '../../utils/public';
-import style from './style.css';
+} from "@quarkd/core";
+import { slotAssignedElements } from "../../utils/public";
+import { checkFalse } from "../../utils/public";
+import style from "./style.css";
 export interface Props {
-  shape?: 'round' | 'square'
-  size?: 'normal' | 'big'
+  shape?: "round" | "square";
+  size?: "normal" | "big";
   disabled?: boolean;
-  checked?: boolean
-
+  checked?: boolean;
 }
 export interface CustomEvent {
-  change: (e: {detail: {value: string}}) => void
+  change: (e: { detail: { value: string } }) => void;
 }
 
 export interface GroupProps {
-  value?: string
+  value?: string;
 }
 export interface GroupCustomEvent {
-  change: (e: {detail: {value: string []}}) => void
+  change: (e: { detail: { value: string[] } }) => void;
 }
 @customElement({
-  tag: 'quark-checkbox',
+  tag: "quark-checkbox",
   style,
 })
 class QuarkCheckbox extends QuarkElement {
   @property()
-  shape: string = 'round';
+  shape = "round";
 
   @property()
-  size: string = 'normal';
+  size = "normal";
 
   @property()
-  name: string = '';
+  name = "";
 
   @property({
     type: Boolean,
   })
-  value: boolean = false;
+  value = false;
 
   @property({
-    type: Boolean
+    type: Boolean,
   })
-  disabled: boolean = false;
+  disabled = false;
 
   @property({
     type: Boolean,
   })
-  checked: boolean = false;
+  checked = false;
 
   @state()
-  classNames: string = '';
+  classNames = "";
 
   slotRef: any = createRef();
 
@@ -72,8 +71,8 @@ class QuarkCheckbox extends QuarkElement {
     oldValue: string,
     newValue: string | boolean
   ) {
-    if (propName === 'checked')
-      this.value = typeof newValue === 'boolean' ? newValue : false;
+    if (propName === "checked")
+      this.value = typeof newValue === "boolean" ? newValue : false;
     return true;
   }
 
@@ -91,7 +90,7 @@ class QuarkCheckbox extends QuarkElement {
     }
     this.checked = !this.checked;
     this.value = this.checked;
-    this.$emit('change', {
+    this.$emit("change", {
       detail: {
         value: this.checked,
       },
@@ -121,25 +120,25 @@ class QuarkCheckbox extends QuarkElement {
 export default QuarkCheckbox;
 
 @customElement({
-  tag: 'quark-checkbox-group',
-  style
+  tag: "quark-checkbox-group",
+  style,
 })
 class QuarkCheckboxGroup extends QuarkElement {
   @property()
-  value: string = '';
+  value = "";
 
   slotRef: any = createRef();
 
   componentDidMount(): void {
-    this.$on('change', this.eventListener);
+    this.$on("change", this.eventListener);
   }
 
   shouldComponentUpdate(
     propName: string,
     oldValue: string,
-    newValue: string,
+    newValue: string
   ): boolean {
-    if (propName === 'value' && oldValue !== newValue) {
+    if (propName === "value" && oldValue !== newValue) {
       this.init();
     }
     return true;
@@ -148,7 +147,7 @@ class QuarkCheckboxGroup extends QuarkElement {
   init() {
     const assignedNodes = this.slotRef.current?.assignedNodes();
     const nodes = slotAssignedElements(assignedNodes);
-    const value = this.value ? this.value.split(',') : [];
+    const value = this.value ? this.value.split(",") : [];
     if (nodes?.length) {
       nodes.forEach((item: any) => {
         if (value.includes(item.name)) {
@@ -162,22 +161,22 @@ class QuarkCheckboxGroup extends QuarkElement {
 
   handleSlotChange = () => {
     this.init();
-  }
+  };
 
   eventListener = (ev: any) => {
     if (ev.target === this) {
       return;
     }
-    const value = this.value ? this.value.split(',') : [];
+    const value = this.value ? this.value.split(",") : [];
     if (!checkFalse(ev.target.checked)) {
       value.push(ev.target.name);
     } else {
       value.splice(
         value.findIndex((name) => name === ev.target.name),
-        1,
+        1
       );
     }
-    this.$emit('change', {
+    this.$emit("change", {
       detail: { value },
     });
     ev.stopPropagation();
@@ -186,10 +185,7 @@ class QuarkCheckboxGroup extends QuarkElement {
   render() {
     return (
       <div class="quark-checkbox-group-wrapper">
-        <slot  
-          onslotchange={this.handleSlotChange}
-          ref={this.slotRef}
-          ></slot>
+        <slot onslotchange={this.handleSlotChange} ref={this.slotRef}></slot>
       </div>
     );
   }