@rhtml/modifiers 0.0.112 → 0.0.115

package/dist/layout/layout.js

@@ -29,37 +29,36 @@ let Layout = class Layout extends custom_attributes_1.MediaQueryAttribute {
         this.prevValue = this.value;
         this.value = (_a = attribute.value) !== null && _a !== void 0 ? _a : this.value;
         this.modify();
-        this.element.setAttribute('fxlayout', this.value);
     }
     OnExitMediaQuery() {
         var _a;
         this.value = (_a = this.prevValue) !== null && _a !== void 0 ? _a : this.value;
         this.modify();
-        this.element.setAttribute('fxlayout', this.value);
     }
     clean() {
         this.setStyles({
             boxSizing: null,
             flexFlow: null,
-            display: null
+            display: null,
         })(this.element);
     }
     modify() {
         if (!this.value) {
             return;
         }
+        this.element.setAttribute(this.selector, this.value);
         const splitted = this.value.split(' ');
         const [mainAxis, crossAxis] = splitted;
         this.setStyles({
             boxSizing: 'flex',
             flexFlow: splitted.length > 1 ? `${mainAxis} ${crossAxis}` : mainAxis,
-            display: 'flex'
+            display: 'flex',
         })(this.element);
     }
 };
 Layout = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxLayout'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxLayout',
     })
 ], Layout);
 exports.Layout = Layout;

package/dist/layout/layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../src/layout/layout.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAWlC,IAAa,MAAM,GAAnB,MAAa,MAAO,SAAQ,uCAA2B;IAAvD;;QACE,UAAK,GAAG,KAAK,CAAC;IAiDhB,CAAC;IA/CC,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,KAAK,CAAC,MAAM,EAAE,CAAC;IACjB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,KAAK,CAAC,SAAS,EAAE,CAAC;IACpB,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,iBAAiB,CAAC,CAAC,EAAE,SAAS,CAA4B;;QACxD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5B,IAAI,CAAC,KAAK,SAAG,SAAS,CAAC,KAAK,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC3C,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,KAAK,SAAG,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC1C,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;IAED,KAAK;QACH,IAAI,CAAC,SAAS,CAAC;YACb,SAAS,EAAE,IAAI;YACf,QAAQ,EAAE,IAAI;YACd,OAAO,EAAE,IAAI;SACd,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,OAAO;SACR;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACvC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC;QACvC,IAAI,CAAC,SAAS,CAAC;YACb,SAAS,EAAE,MAAM;YACjB,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,QAAQ,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,QAAQ;YACrE,OAAO,EAAE,MAAM;SAChB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAlDY,MAAM;IAHlB,4BAAQ,CAAC;QACR,QAAQ,EAAE,UAAU;KACrB,CAAC;GACW,MAAM,CAkDlB;AAlDY,wBAAM"}
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../src/layout/layout.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAWlC,IAAa,MAAM,GAAnB,MAAa,MAAO,SAAQ,uCAA2B;IAAvD;;QACE,UAAK,GAAG,KAAK,CAAC;IAiDhB,CAAC;IA9CC,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,KAAK,CAAC,MAAM,EAAE,CAAC;IACjB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,KAAK,CAAC,SAAS,EAAE,CAAC;IACpB,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,iBAAiB,CAAC,CAAC,EAAE,SAAS,CAAkB;;QAC9C,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5B,IAAI,CAAC,KAAK,GAAG,MAAA,SAAS,CAAC,KAAK,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC3C,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,KAAK,GAAG,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC1C,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,SAAS,EAAE,IAAI;YACf,QAAQ,EAAE,IAAI;YACd,OAAO,EAAE,IAAI;SACd,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,OAAO;SACR;QACD,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACrD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACvC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC;QACvC,IAAI,CAAC,SAAS,CAAC;YACb,SAAS,EAAE,MAAM;YACjB,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,QAAQ,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,QAAQ;YACrE,OAAO,EAAE,MAAM;SAChB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAlDY,MAAM;IAHlB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,UAAU;KACrB,CAAC;GACW,MAAM,CAkDlB;AAlDY,wBAAM"}

package/dist/layout/registry.js

@@ -11,11 +11,11 @@ const custom_attributes_1 = require("@rhtml/custom-attributes");
 let Registry = class Registry extends custom_attributes_1.Attribute {
 };
 Registry = __decorate([
-    custom_attributes_1.Modifier({
+    (0, custom_attributes_1.Modifier)({
         selector: 'flex-layout-registry',
         registry() {
             return new custom_attributes_1.CustomAttributeRegistry(this);
-        }
+        },
     })
 ], Registry);
 exports.Registry = Registry;

package/dist/layout/registry.js.map

@@ -1 +1 @@
-{"version":3,"file":"registry.js","sourceRoot":"","sources":["../../src/layout/registry.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAQlC,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,6BAAS;CAAG,CAAA;AAA7B,QAAQ;IANpB,4BAAQ,CAAC;QACR,QAAQ,EAAE,sBAAsB;QAChC,QAAQ;YACN,OAAO,IAAI,2CAAuB,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC;KACF,CAAC;GACW,QAAQ,CAAqB;AAA7B,4BAAQ"}
+{"version":3,"file":"registry.js","sourceRoot":"","sources":["../../src/layout/registry.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAQlC,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,6BAAS;CAAG,CAAA;AAA7B,QAAQ;IANpB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,sBAAsB;QAChC,QAAQ;YACN,OAAO,IAAI,2CAAuB,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC;KACF,CAAC;GACW,QAAQ,CAAqB;AAA7B,4BAAQ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rhtml/modifiers",
-  "version": "0.0.112",
+  "version": "0.0.115",
   "description": "Reactive HyperText Markup Language",
   "scripts": {
     "start": "npx parcel ./examples/index.html --out-dir build/examples",
@@ -17,18 +17,9 @@
   },
   "dependencies": {
     "@rxdi/lit-html": "^0.7.133",
-    "@rhtml/custom-attributes": "0.0.112"
-  },
-  "devDependencies": {
-    "eslint": "^6.7.2",
-    "eslint-config-prettier": "^6.7.0",
-    "eslint-plugin-prettier": "^3.1.1",
-    "eslint-plugin-simple-import-sort": "^5.0.0",
-    "@typescript-eslint/eslint-plugin": "^2.10.0",
-    "@typescript-eslint/parser": "^2.10.0",
-    "prettier": "^1.19.1",
-    "ts-jest": "25.2.1"
+    "@rhtml/custom-attributes": "0.0.115"
   },
+  "devDependencies": {},
   "author": "Kristiyan Tachev",
   "license": "MIT",
   "browserslist": [

package/src/angular/if.ts

@@ -3,7 +3,7 @@ interface Styles {
   display: string;
 }
 @Modifier({
-  selector: 'ngIf'
+  selector: 'ngIf',
 })
 export class IfOperator extends Attribute<Styles> {
   OnInit() {

package/src/angular/ng-for.ts

@@ -2,7 +2,7 @@ import { Attribute, Input, Modifier } from '@rhtml/custom-attributes';
 import { html, render, unsafeHTML } from '@rxdi/lit-html';
 
 @Modifier({
-  selector: 'ngFor'
+  selector: 'ngFor',
 })
 export class NgFor extends Attribute {
   @Input()
@@ -23,7 +23,7 @@ export class NgFor extends Attribute {
   }
 
   private interpolate(object, string: string) {
-    return string.replace(this.regexes[2], match =>
+    return string.replace(this.regexes[2], (match) =>
       match
         .slice(2, -1)
         .trim()
@@ -40,7 +40,7 @@ export class NgFor extends Attribute {
       html`
         <r-for .of=${this.parent[items]}>
           <r-let
-            .item=${i => unsafeHTML(this.interpolate(i, template))}
+            .item=${(i) => unsafeHTML(this.interpolate(i, template))}
           ></r-let>
         </r-for>
       `,

package/src/angular/registry.ts

@@ -1,13 +1,13 @@
 import {
   Attribute,
   CustomAttributeRegistry,
-  Modifier
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 @Modifier({
   selector: 'angular-layout-registry',
   registry(this) {
     return new CustomAttributeRegistry(this);
-  }
+  },
 })
 export class Registry extends Attribute {}

package/src/animation/animation.ts

@@ -2,7 +2,7 @@ import {
   Attribute,
   CustomAttributeRegistry,
   Input,
-  Modifier
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 import { Animations } from './animate.css';
@@ -16,7 +16,7 @@ interface Styles {
   selector: 'animated',
   registry(this: HTMLElement) {
     return new CustomAttributeRegistry(this);
-  }
+  },
 })
 export class Animation extends Attribute<Styles> {
   @Input({ observe: true })

package/src/layout/flex-align.ts

@@ -1,7 +1,7 @@
 import {
-  EnterMediaQueryAttributes,
   MediaQueryAttribute,
-  Modifier
+  MediaQueryEvent,
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 interface Styles {
@@ -9,9 +9,11 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxFlexAlign'
+  selector: 'fxFlexAlign',
 })
 export class FlexAlign extends MediaQueryAttribute<Styles> {
+  private prevValue: string;
+
   OnInit() {
     this.modify();
     super.OnInit();
@@ -26,7 +28,7 @@ export class FlexAlign extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes) {
+  OnEnterMediaQuery([, attribute]: MediaQueryEvent) {
     this.prevValue = this.value;
     this.value = attribute.value ?? this.value;
     this.modify();
@@ -37,11 +39,11 @@ export class FlexAlign extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  clean() {
+  private clean() {
     this.setStyles({ alignSelf: null })(this.element);
   }
 
-  modify() {
+  private modify() {
     this.setStyles({ alignSelf: this.value || null })(this.element);
   }
 }

package/src/layout/flex-fill.ts

@@ -9,7 +9,7 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxFlexFill'
+  selector: 'fxFlexFill',
 })
 export class FlexFill extends Attribute<Styles> {
   value = '100%';
@@ -32,7 +32,7 @@ export class FlexFill extends Attribute<Styles> {
       margin: null,
       minHeight: null,
       minWidth: null,
-      width: null
+      width: null,
     })(this.element);
   }
 
@@ -42,7 +42,7 @@ export class FlexFill extends Attribute<Styles> {
       height: this.value,
       minHeight: this.value,
       minWidth: this.value,
-      width: this.value
+      width: this.value,
     })(this.element);
   }
 }

package/src/layout/flex-offset.ts

@@ -5,7 +5,7 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxFlexOffset'
+  selector: 'fxFlexOffset',
 })
 export class FlexOffset extends Attribute<Styles> {
   OnInit() {
@@ -22,13 +22,13 @@ export class FlexOffset extends Attribute<Styles> {
 
   private clean() {
     this.setStyles({
-      marginLeft: null
+      marginLeft: null,
     })(this.element);
   }
 
   private modify() {
     this.setStyles({
-      marginLeft: this.value || null
+      marginLeft: this.value || null,
     })(this.element);
   }
 }

package/src/layout/flex-order.ts

@@ -5,7 +5,7 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxFlexOrder'
+  selector: 'fxFlexOrder',
 })
 export class FlexOrder extends Attribute<Styles> {
   OnInit() {
@@ -22,13 +22,13 @@ export class FlexOrder extends Attribute<Styles> {
 
   private clean() {
     this.setStyles({
-      order: null
+      order: null,
     })(this.element);
   }
 
   private modify() {
     this.setStyles({
-      order: this.value || null
+      order: this.value || null,
     })(this.element);
   }
 }

package/src/layout/flex.ts

@@ -1,7 +1,7 @@
 import {
-  EnterMediaQueryAttributes,
   MediaQueryAttribute,
-  Modifier
+  MediaQueryEvent,
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 interface Styles {
@@ -11,9 +11,11 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxFlex'
+  selector: 'fxFlex',
 })
 export class Flex extends MediaQueryAttribute<Styles> {
+  private prevValue: string;
+
   OnInit() {
     this.modify();
     super.OnInit();
@@ -28,7 +30,7 @@ export class Flex extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes) {
+  OnEnterMediaQuery([, attribute]: MediaQueryEvent) {
     this.prevValue = this.value;
     this.value = attribute.value ?? this.value;
     this.modify();
@@ -39,19 +41,19 @@ export class Flex extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  clean() {
+  private clean() {
     this.setStyles({
       boxSizing: null,
       maxWidth: null,
-      flex: null
+      flex: null,
     })(this.element);
   }
 
-  modify() {
+  private modify() {
     this.setStyles({
       boxSizing: 'border-box',
       maxWidth: this.value || null,
-      flex: '1 1 100%'
+      flex: '1 1 100%',
     })(this.element);
   }
 }

package/src/layout/index.ts

@@ -19,5 +19,5 @@ export const FlexLayout = [
   Flex,
   FlexAlign,
   FlexOffset,
-  FlexOrder
+  FlexOrder,
 ];

package/src/layout/layout-align.ts

@@ -1,7 +1,7 @@
 import {
-  EnterMediaQueryAttributes,
   MediaQueryAttribute,
-  Modifier
+  MediaQueryEvent,
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 interface Styles {
@@ -11,9 +11,11 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxLayoutAlign'
+  selector: 'fxLayoutAlign',
 })
 export class LayoutAlign extends MediaQueryAttribute<Styles> {
+  private prevValue: string;
+
   OnInit() {
     this.modify();
     super.OnInit();
@@ -28,7 +30,7 @@ export class LayoutAlign extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes) {
+  OnEnterMediaQuery([, attribute]: MediaQueryEvent) {
     this.prevValue = this.value;
     this.value = attribute.value ?? this.value;
     this.modify();
@@ -39,22 +41,22 @@ export class LayoutAlign extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  clean() {
+  private clean() {
     this.setStyles({
       alignItems: null,
       placeContent: null,
-      display: null
+      display: null,
     })(this.element);
   }
 
-  modify() {
+  private modify() {
     const [mainAxis, crossAxis] = this.value.split(' ');
     this.setStyles({
       alignItems: crossAxis ? crossAxis : mainAxis,
       placeContent: crossAxis
         ? `${crossAxis} ${mainAxis}`
         : `${mainAxis} ${mainAxis}`,
-      display: 'flex'
+      display: 'flex',
     })(this.element);
   }
 }

package/src/layout/layout-gap.ts

@@ -1,8 +1,8 @@
 import {
   createFiltersFromSelector,
-  EnterMediaQueryAttributes,
   MediaQueryAttribute,
-  Modifier
+  MediaQueryEvent,
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 interface Styles {
@@ -11,26 +11,24 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxLayoutGap'
+  selector: 'fxLayoutGap',
+  observe: {
+    childList: true,
+    subtree: true,
+    attributes: true,
+    attributeFilter: createFiltersFromSelector('fxlayout'),
+  },
 })
 export class LayoutGap extends MediaQueryAttribute<Styles> {
-  private observer: MutationObserver;
+  private prevValue: string;
 
   OnInit() {
     this.modify();
-    this.observer = new MutationObserver(() => this.modify());
-    this.observer.observe(this.element, {
-      childList: true,
-      subtree: true,
-      attributes: true,
-      attributeFilter: createFiltersFromSelector('fxlayout')
-    });
     super.OnInit();
   }
 
   OnDestroy() {
     this.clean();
-    this.observer.disconnect();
     super.OnDestroy();
   }
 
@@ -38,7 +36,11 @@ export class LayoutGap extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes) {
+  OnChange() {
+    this.modify();
+  }
+
+  OnEnterMediaQuery([, attribute]: MediaQueryEvent) {
     this.prevValue = this.value;
     this.value = attribute.value ?? this.value;
     this.modify();
@@ -49,21 +51,17 @@ export class LayoutGap extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  // OnElementAttributeChange() {
-
-  // }
-
-  clean() {
+  private clean() {
     const divs = [...this.element.children] as HTMLElement[];
     for (const div of divs) {
       this.setStyles({
         flex: null,
-        margin: null
+        margin: null,
       })(div);
     }
   }
 
-  modify() {
+  private modify() {
     const layout = this.element.getAttribute('fxlayout');
     let margin = `0px ${this.value} ${this.value} 0px`;
     if (layout === 'row') {
@@ -76,7 +74,7 @@ export class LayoutGap extends MediaQueryAttribute<Styles> {
     for (const div of divs) {
       this.setStyles({
         flex: '1 1 25%',
-        margin
+        margin,
       })(div);
     }
   }

package/src/layout/layout.ts

@@ -1,7 +1,7 @@
 import {
-  EnterMediaQueryAttributes,
   MediaQueryAttribute,
-  Modifier
+  MediaQueryEvent,
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 interface Styles {
@@ -11,10 +11,11 @@ interface Styles {
 }
 
 @Modifier({
-  selector: 'fxLayout'
+  selector: 'fxLayout',
 })
 export class Layout extends MediaQueryAttribute<Styles> {
   value = 'row';
+  private prevValue: string;
 
   OnInit() {
     this.modify();
@@ -30,37 +31,36 @@ export class Layout extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes) {
+  OnEnterMediaQuery([, attribute]: MediaQueryEvent) {
     this.prevValue = this.value;
     this.value = attribute.value ?? this.value;
     this.modify();
-    this.element.setAttribute('fxlayout', this.value);
   }
 
   OnExitMediaQuery() {
     this.value = this.prevValue ?? this.value;
     this.modify();
-    this.element.setAttribute('fxlayout', this.value);
   }
 
-  clean() {
+  private clean() {
     this.setStyles({
       boxSizing: null,
       flexFlow: null,
-      display: null
+      display: null,
     })(this.element);
   }
 
-  modify() {
+  private modify() {
     if (!this.value) {
       return;
     }
+    this.element.setAttribute(this.selector, this.value);
     const splitted = this.value.split(' ');
     const [mainAxis, crossAxis] = splitted;
     this.setStyles({
       boxSizing: 'flex',
       flexFlow: splitted.length > 1 ? `${mainAxis} ${crossAxis}` : mainAxis,
-      display: 'flex'
+      display: 'flex',
     })(this.element);
   }
 }

package/src/layout/registry.ts

@@ -1,13 +1,13 @@
 import {
   Attribute,
   CustomAttributeRegistry,
-  Modifier
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 @Modifier({
   selector: 'flex-layout-registry',
   registry(this) {
     return new CustomAttributeRegistry(this);
-  }
+  },
 })
 export class Registry extends Attribute {}

package/.eslintrc.js

@@ -1,26 +0,0 @@
-module.exports = {
-    // Specifies the ESLint parser
-    parser: "@typescript-eslint/parser",
-    extends: [
-        // Uses the recommended rules from the @typescript-eslint/eslint-plugin
-        "plugin:@typescript-eslint/recommended",
-        // Uses eslint-config-prettier to disable ESLint rules from @typescript-eslint/eslint-plugin that would conflict with prettier
-        "prettier/@typescript-eslint",
-        // Enables eslint-plugin-prettier and eslint-config-prettier. This will display prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
-        "plugin:prettier/recommended"
-    ],
-    parserOptions: {
-        // Allows for the parsing of modern ECMAScript features
-        ecmaVersion: 2018,
-        // Allows for the use of imports
-        sourceType: "module"
-    },
-    rules: {
-        "@typescript-eslint/explicit-function-return-type": 0,
-        "simple-import-sort/sort": "error",
-        "sort-imports": "off",
-        "import/order": "off",
-        "@typescript-eslint/camelcase": 0
-    },
-    plugins: ["simple-import-sort"]
-};

package/.prettierrc

@@ -1,4 +0,0 @@
-{
-    "singleQuote": true,
-    "printWidth": 80
-}

package/jest.config.js

@@ -1,16 +0,0 @@
-module.exports = {
-  testEnvironment: 'node',
-  testPathIgnorePatterns: ['/node_modules/'],
-  coverageReporters: ['lcov', 'html'],
-  rootDir: './',
-  moduleFileExtensions: ['ts', 'tsx', 'js', 'json', 'node'],
-  globals: {
-    __DEV__: true
-  },
-  transform: {
-    '\\.(ts|tsx)$': 'ts-jest'
-  },
-  testRegex: '/src/.*\\.spec.(ts|tsx|js)$',
-  verbose: true,
-  collectCoverage: true
-};