@rhtml/modifiers 0.0.113 → 0.0.116

package/dist/angular/if.js

@@ -28,8 +28,8 @@ let IfOperator = class IfOperator extends custom_attributes_1.Attribute {
     }
 };
 IfOperator = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'ngIf'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'ngIf',
     })
 ], IfOperator);
 exports.IfOperator = IfOperator;

package/dist/angular/if.js.map

@@ -1 +1 @@
-{"version":3,"file":"if.js","sourceRoot":"","sources":["../../src/angular/if.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAO/D,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,6BAAiB;IAC/C,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;IACpC,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,MAAM;QACZ,IAAI,IAAI,CAAC,KAAK,KAAK,MAAM,EAAE;YACzB,IAAI,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SACjD;aAAM;YACL,IAAI,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SACnD;IACH,CAAC;CACF,CAAA;AApBY,UAAU;IAHtB,4BAAQ,CAAC;QACR,QAAQ,EAAE,MAAM;KACjB,CAAC;GACW,UAAU,CAoBtB;AApBY,gCAAU"}
+{"version":3,"file":"if.js","sourceRoot":"","sources":["../../src/angular/if.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAO/D,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,6BAAiB;IAC/C,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;IACpC,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,MAAM;QACZ,IAAI,IAAI,CAAC,KAAK,KAAK,MAAM,EAAE;YACzB,IAAI,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SACjD;aAAM;YACL,IAAI,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SACnD;IACH,CAAC;CACF,CAAA;AApBY,UAAU;IAHtB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,MAAM;KACjB,CAAC;GACW,UAAU,CAoBtB;AApBY,gCAAU"}

package/dist/angular/index.d.ts

@@ -1,2 +1,3 @@
+import { IfOperator } from './if';
 import { Registry } from './registry';
-export declare const AngularLayout: (typeof Registry)[];
+export declare const AngularLayout: (typeof IfOperator | typeof Registry)[];

package/dist/angular/ng-for.js

@@ -27,7 +27,7 @@ let NgFor = class NgFor extends custom_attributes_1.Attribute {
         this.modify();
     }
     interpolate(object, string) {
-        return string.replace(this.regexes[2], match => match
+        return string.replace(this.regexes[2], (match) => match
             .slice(2, -1)
             .trim()
             .split('.')
@@ -37,22 +37,22 @@ let NgFor = class NgFor extends custom_attributes_1.Attribute {
         const [, , , items] = this.ngFor.split(' ');
         const template = this.element.innerHTML;
         this.element.innerHTML = '';
-        lit_html_1.render(lit_html_1.html `
+        (0, lit_html_1.render)((0, lit_html_1.html) `
         <r-for .of=${this.parent[items]}>
           <r-let
-            .item=${i => lit_html_1.unsafeHTML(this.interpolate(i, template))}
+            .item=${(i) => (0, lit_html_1.unsafeHTML)(this.interpolate(i, template))}
           ></r-let>
         </r-for>
       `, this.element);
     }
 };
 __decorate([
-    custom_attributes_1.Input(),
+    (0, custom_attributes_1.Input)(),
     __metadata("design:type", String)
 ], NgFor.prototype, "ngFor", void 0);
 NgFor = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'ngFor'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'ngFor',
     })
 ], NgFor);
 exports.NgFor = NgFor;

package/dist/angular/ng-for.js.map

@@ -1 +1 @@
-{"version":3,"file":"ng-for.js","sourceRoot":"","sources":["../../src/angular/ng-for.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gEAAsE;AACtE,6CAA0D;AAK1D,IAAa,KAAK,GAAlB,MAAa,KAAM,SAAQ,6BAAS;IAApC;;QAIE,YAAO,GAAG,CAAC,YAAY,EAAE,sBAAsB,EAAE,YAAY,CAAC,CAAC;IAuCjE,CAAC;IArCC,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,EAAE;IACJ,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,WAAW,CAAC,MAAM,EAAE,MAAc;QACxC,OAAO,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,CAC7C,KAAK;aACF,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;aACZ,IAAI,EAAE;aACN,KAAK,CAAC,GAAG,CAAC;aACV,MAAM,CAAC,CAAC,EAAE,EAAE,CAAS,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,CACpD,CAAC;IACJ,CAAC;IAEO,MAAM;QACZ,MAAM,CAAC,EAAE,AAAD,EAAG,AAAD,EAAG,KAAK,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC;QACxC,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,EAAE,CAAC;QAC5B,iBAAM,CACJ,eAAI,CAAA;qBACW,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;;oBAEnB,CAAC,CAAC,EAAE,CAAC,qBAAU,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;;;OAG3D,EACD,IAAI,CAAC,OAAO,CACb,CAAC;IACJ,CAAC;CACF,CAAA;AAzCC;IADC,yBAAK,EAAE;;oCACM;AAFH,KAAK;IAHjB,4BAAQ,CAAC;QACR,QAAQ,EAAE,OAAO;KAClB,CAAC;GACW,KAAK,CA2CjB;AA3CY,sBAAK"}
+{"version":3,"file":"ng-for.js","sourceRoot":"","sources":["../../src/angular/ng-for.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gEAAsE;AACtE,6CAA0D;AAK1D,IAAa,KAAK,GAAlB,MAAa,KAAM,SAAQ,6BAAS;IAApC;;QAIE,YAAO,GAAG,CAAC,YAAY,EAAE,sBAAsB,EAAE,YAAY,CAAC,CAAC;IAuCjE,CAAC;IArCC,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,EAAE;IACJ,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,WAAW,CAAC,MAAM,EAAE,MAAc;QACxC,OAAO,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,CAC/C,KAAK;aACF,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;aACZ,IAAI,EAAE;aACN,KAAK,CAAC,GAAG,CAAC;aACV,MAAM,CAAC,CAAC,EAAE,EAAE,CAAS,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,CACpD,CAAC;IACJ,CAAC;IAEO,MAAM;QACZ,MAAM,CAAC,EAAE,AAAD,EAAG,AAAD,EAAG,KAAK,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC;QACxC,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,EAAE,CAAC;QAC5B,IAAA,iBAAM,EACJ,IAAA,eAAI,EAAA;qBACW,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;;oBAEnB,CAAC,CAAC,EAAE,EAAE,CAAC,IAAA,qBAAU,EAAC,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;;;OAG7D,EACD,IAAI,CAAC,OAAO,CACb,CAAC;IACJ,CAAC;CACF,CAAA;AAzCC;IADC,IAAA,yBAAK,GAAE;;oCACM;AAFH,KAAK;IAHjB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,OAAO;KAClB,CAAC;GACW,KAAK,CA2CjB;AA3CY,sBAAK"}

package/dist/angular/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: 'angular-layout-registry',
         registry() {
             return new custom_attributes_1.CustomAttributeRegistry(this);
-        }
+        },
     })
 ], Registry);
 exports.Registry = Registry;

package/dist/angular/registry.js.map

@@ -1 +1 @@
-{"version":3,"file":"registry.js","sourceRoot":"","sources":["../../src/angular/registry.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAQlC,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,6BAAS;CAAG,CAAA;AAA7B,QAAQ;IANpB,4BAAQ,CAAC;QACR,QAAQ,EAAE,yBAAyB;QACnC,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/angular/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,yBAAyB;QACnC,QAAQ;YACN,OAAO,IAAI,2CAAuB,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC;KACF,CAAC;GACW,QAAQ,CAAqB;AAA7B,4BAAQ"}

package/dist/animation/animation.js

@@ -40,15 +40,15 @@ let Animation = class Animation extends custom_attributes_1.Attribute {
     }
 };
 __decorate([
-    custom_attributes_1.Input({ observe: true }),
+    (0, custom_attributes_1.Input)({ observe: true }),
     __metadata("design:type", String)
 ], Animation.prototype, "delay", void 0);
 Animation = __decorate([
-    custom_attributes_1.Modifier({
+    (0, custom_attributes_1.Modifier)({
         selector: 'animated',
         registry() {
             return new custom_attributes_1.CustomAttributeRegistry(this);
-        }
+        },
     })
 ], Animation);
 exports.Animation = Animation;

package/dist/animation/animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"animation.js","sourceRoot":"","sources":["../../src/animation/animation.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gEAKkC;AAElC,+CAA2C;AAa3C,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,6BAAiB;IAM9C,MAAM;QACJ,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC1B,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACtD,IAAI,CAAC,SAAS,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACzD,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACnD,IAAI,CAAC,SAAS,CAAC,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC/D,CAAC;IAEO,kBAAkB;;QACxB,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC9C,KAAK,CAAC,SAAS,GAAG,wBAAU,CAAC;QAC7B,MAAM,IAAI,SAAG,IAAI,CAAC,MAAM,CAAC,UAAU,mCAAI,IAAI,CAAC,MAAM,CAAC;QACnD,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC;CACF,CAAA;AAjCC;IADC,yBAAK,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;;wCACX;AAFH,SAAS;IANrB,4BAAQ,CAAC;QACR,QAAQ,EAAE,UAAU;QACpB,QAAQ;YACN,OAAO,IAAI,2CAAuB,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC;KACF,CAAC;GACW,SAAS,CAmCrB;AAnCY,8BAAS"}
+{"version":3,"file":"animation.js","sourceRoot":"","sources":["../../src/animation/animation.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gEAKkC;AAElC,+CAA2C;AAa3C,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,6BAAiB;IAM9C,MAAM;QACJ,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC1B,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACtD,IAAI,CAAC,SAAS,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACzD,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACnD,IAAI,CAAC,SAAS,CAAC,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC/D,CAAC;IAEO,kBAAkB;;QACxB,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC9C,KAAK,CAAC,SAAS,GAAG,wBAAU,CAAC;QAC7B,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,MAAM,CAAC,UAAU,mCAAI,IAAI,CAAC,MAAM,CAAC;QACnD,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC;CACF,CAAA;AAjCC;IADC,IAAA,yBAAK,EAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;;wCACX;AAFH,SAAS;IANrB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,UAAU;QACpB,QAAQ;YACN,OAAO,IAAI,2CAAuB,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC;KACF,CAAC;GACW,SAAS,CAmCrB;AAnCY,8BAAS"}

package/dist/animation/index.js

@@ -1,13 +1,17 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./animate.css"), exports);

package/dist/animation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/animation/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gDAA8B;AAC9B,8CAA4B;AAC5B,+CAA6B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/animation/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,8CAA4B;AAC5B,+CAA6B"}

package/dist/index.js

@@ -1,13 +1,17 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./angular"), exports);

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,4CAA0B;AAC1B,2CAAyB;AACzB,8CAA4B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4CAA0B;AAC1B,2CAAyB;AACzB,8CAA4B"}

package/dist/layout/flex-align.d.ts

@@ -1,12 +1,13 @@
-import { EnterMediaQueryAttributes, MediaQueryAttribute } from '@rhtml/custom-attributes';
+import { MediaQueryAttribute, MediaQueryEvent } from '@rhtml/custom-attributes';
 interface Styles {
     alignSelf: string;
 }
 export declare class FlexAlign extends MediaQueryAttribute<Styles> {
+    private prevValue;
     OnInit(): void;
     OnDestroy(): void;
     OnUpdate(): void;
-    OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes): void;
+    OnEnterMediaQuery([, attribute]: MediaQueryEvent): void;
     OnExitMediaQuery(): void;
     private clean;
     private modify;

package/dist/layout/flex-align.js

@@ -39,8 +39,8 @@ let FlexAlign = class FlexAlign extends custom_attributes_1.MediaQueryAttribute
     }
 };
 FlexAlign = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxFlexAlign'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxFlexAlign',
     })
 ], FlexAlign);
 exports.FlexAlign = FlexAlign;

package/dist/layout/flex-align.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex-align.js","sourceRoot":"","sources":["../../src/layout/flex-align.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AASlC,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,uCAA2B;IACxD,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;IAChB,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,KAAK,SAAG,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC1C,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACpD,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClE,CAAC;CACF,CAAA;AAjCY,SAAS;IAHrB,4BAAQ,CAAC;QACR,QAAQ,EAAE,aAAa;KACxB,CAAC;GACW,SAAS,CAiCrB;AAjCY,8BAAS"}
+{"version":3,"file":"flex-align.js","sourceRoot":"","sources":["../../src/layout/flex-align.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AASlC,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,uCAA2B;IAGxD,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,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACpD,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClE,CAAC;CACF,CAAA;AAnCY,SAAS;IAHrB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,aAAa;KACxB,CAAC;GACW,SAAS,CAmCrB;AAnCY,8BAAS"}

package/dist/layout/flex-fill.js

@@ -28,7 +28,7 @@ let FlexFill = class FlexFill extends custom_attributes_1.Attribute {
             margin: null,
             minHeight: null,
             minWidth: null,
-            width: null
+            width: null,
         })(this.element);
     }
     modify() {
@@ -37,13 +37,13 @@ let FlexFill = class FlexFill extends custom_attributes_1.Attribute {
             height: this.value,
             minHeight: this.value,
             minWidth: this.value,
-            width: this.value
+            width: this.value,
         })(this.element);
     }
 };
 FlexFill = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxFlexFill'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxFlexFill',
     })
 ], FlexFill);
 exports.FlexFill = FlexFill;

package/dist/layout/flex-fill.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex-fill.js","sourceRoot":"","sources":["../../src/layout/flex-fill.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAa/D,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,6BAAiB;IAA/C;;QACE,UAAK,GAAG,MAAM,CAAC;IAiCjB,CAAC;IA/BC,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,MAAM,EAAE,IAAI;YACZ,MAAM,EAAE,IAAI;YACZ,SAAS,EAAE,IAAI;YACf,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,IAAI;SACZ,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,MAAM,EAAE,GAAG;YACX,MAAM,EAAE,IAAI,CAAC,KAAK;YAClB,SAAS,EAAE,IAAI,CAAC,KAAK;YACrB,QAAQ,EAAE,IAAI,CAAC,KAAK;YACpB,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAlCY,QAAQ;IAHpB,4BAAQ,CAAC;QACR,QAAQ,EAAE,YAAY;KACvB,CAAC;GACW,QAAQ,CAkCpB;AAlCY,4BAAQ"}
+{"version":3,"file":"flex-fill.js","sourceRoot":"","sources":["../../src/layout/flex-fill.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAa/D,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,6BAAiB;IAA/C;;QACE,UAAK,GAAG,MAAM,CAAC;IAiCjB,CAAC;IA/BC,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,MAAM,EAAE,IAAI;YACZ,MAAM,EAAE,IAAI;YACZ,SAAS,EAAE,IAAI;YACf,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,IAAI;SACZ,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,MAAM,EAAE,GAAG;YACX,MAAM,EAAE,IAAI,CAAC,KAAK;YAClB,SAAS,EAAE,IAAI,CAAC,KAAK;YACrB,QAAQ,EAAE,IAAI,CAAC,KAAK;YACpB,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAlCY,QAAQ;IAHpB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,YAAY;KACvB,CAAC;GACW,QAAQ,CAkCpB;AAlCY,4BAAQ"}

package/dist/layout/flex-offset.js

@@ -20,18 +20,18 @@ let FlexOffset = class FlexOffset extends custom_attributes_1.Attribute {
     }
     clean() {
         this.setStyles({
-            marginLeft: null
+            marginLeft: null,
         })(this.element);
     }
     modify() {
         this.setStyles({
-            marginLeft: this.value || null
+            marginLeft: this.value || null,
         })(this.element);
     }
 };
 FlexOffset = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxFlexOffset'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxFlexOffset',
     })
 ], FlexOffset);
 exports.FlexOffset = FlexOffset;

package/dist/layout/flex-offset.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex-offset.js","sourceRoot":"","sources":["../../src/layout/flex-offset.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAS/D,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,6BAAiB;IAC/C,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;SAC/B,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAxBY,UAAU;IAHtB,4BAAQ,CAAC;QACR,QAAQ,EAAE,cAAc;KACzB,CAAC;GACW,UAAU,CAwBtB;AAxBY,gCAAU"}
+{"version":3,"file":"flex-offset.js","sourceRoot":"","sources":["../../src/layout/flex-offset.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAS/D,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,6BAAiB;IAC/C,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;SAC/B,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAxBY,UAAU;IAHtB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,cAAc;KACzB,CAAC;GACW,UAAU,CAwBtB;AAxBY,gCAAU"}

package/dist/layout/flex-order.js

@@ -20,18 +20,18 @@ let FlexOrder = class FlexOrder extends custom_attributes_1.Attribute {
     }
     clean() {
         this.setStyles({
-            order: null
+            order: null,
         })(this.element);
     }
     modify() {
         this.setStyles({
-            order: this.value || null
+            order: this.value || null,
         })(this.element);
     }
 };
 FlexOrder = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxFlexOrder'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxFlexOrder',
     })
 ], FlexOrder);
 exports.FlexOrder = FlexOrder;

package/dist/layout/flex-order.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex-order.js","sourceRoot":"","sources":["../../src/layout/flex-order.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAS/D,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,6BAAiB;IAC9C,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,KAAK,EAAE,IAAI;SACZ,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;SAC1B,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAxBY,SAAS;IAHrB,4BAAQ,CAAC;QACR,QAAQ,EAAE,aAAa;KACxB,CAAC;GACW,SAAS,CAwBrB;AAxBY,8BAAS"}
+{"version":3,"file":"flex-order.js","sourceRoot":"","sources":["../../src/layout/flex-order.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAA+D;AAS/D,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,6BAAiB;IAC9C,MAAM;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,KAAK,EAAE,IAAI;SACZ,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;SAC1B,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAxBY,SAAS;IAHrB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,aAAa;KACxB,CAAC;GACW,SAAS,CAwBrB;AAxBY,8BAAS"}

package/dist/layout/flex.d.ts

@@ -1,14 +1,15 @@
-import { EnterMediaQueryAttributes, MediaQueryAttribute } from '@rhtml/custom-attributes';
+import { MediaQueryAttribute, MediaQueryEvent } from '@rhtml/custom-attributes';
 interface Styles {
     flex: string;
     boxSizing: string;
     maxWidth: string;
 }
 export declare class Flex extends MediaQueryAttribute<Styles> {
+    private prevValue;
     OnInit(): void;
     OnDestroy(): void;
     OnUpdate(): void;
-    OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes): void;
+    OnEnterMediaQuery([, attribute]: MediaQueryEvent): void;
     OnExitMediaQuery(): void;
     private clean;
     private modify;

package/dist/layout/flex.js

@@ -35,20 +35,20 @@ let Flex = class Flex extends custom_attributes_1.MediaQueryAttribute {
         this.setStyles({
             boxSizing: null,
             maxWidth: null,
-            flex: null
+            flex: null,
         })(this.element);
     }
     modify() {
         this.setStyles({
             boxSizing: 'border-box',
             maxWidth: this.value || null,
-            flex: '1 1 100%'
+            flex: '1 1 100%',
         })(this.element);
     }
 };
 Flex = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxFlex'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxFlex',
     })
 ], Flex);
 exports.Flex = Flex;

package/dist/layout/flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex.js","sourceRoot":"","sources":["../../src/layout/flex.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAWlC,IAAa,IAAI,GAAjB,MAAa,IAAK,SAAQ,uCAA2B;IACnD,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;IAChB,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,KAAK,SAAG,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,IAAI,EAAE,IAAI;SACX,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,SAAS,EAAE,YAAY;YACvB,QAAQ,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;YAC5B,IAAI,EAAE,UAAU;SACjB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AAzCY,IAAI;IAHhB,4BAAQ,CAAC;QACR,QAAQ,EAAE,QAAQ;KACnB,CAAC;GACW,IAAI,CAyChB;AAzCY,oBAAI"}
+{"version":3,"file":"flex.js","sourceRoot":"","sources":["../../src/layout/flex.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAWlC,IAAa,IAAI,GAAjB,MAAa,IAAK,SAAQ,uCAA2B;IAGnD,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,IAAI,EAAE,IAAI;SACX,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,SAAS,EAAE,YAAY;YACvB,QAAQ,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;YAC5B,IAAI,EAAE,UAAU;SACjB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AA3CY,IAAI;IAHhB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,QAAQ;KACnB,CAAC;GACW,IAAI,CA2ChB;AA3CY,oBAAI"}

package/dist/layout/index.d.ts

@@ -1,3 +1,11 @@
+import { Flex } from './flex';
+import { FlexAlign } from './flex-align';
+import { FlexFill } from './flex-fill';
+import { FlexOffset } from './flex-offset';
+import { FlexOrder } from './flex-order';
+import { Layout } from './layout';
+import { LayoutAlign } from './layout-align';
+import { LayoutGap } from './layout-gap';
 import { Registry } from './registry';
 export * from './layout';
-export declare const FlexLayout: (typeof Registry)[];
+export declare const FlexLayout: (typeof Flex | typeof FlexAlign | typeof FlexFill | typeof FlexOffset | typeof FlexOrder | typeof Layout | typeof LayoutAlign | typeof LayoutGap | typeof Registry)[];

package/dist/layout/index.js

@@ -1,13 +1,17 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FlexLayout = void 0;
@@ -30,6 +34,6 @@ exports.FlexLayout = [
     flex_1.Flex,
     flex_align_1.FlexAlign,
     flex_offset_1.FlexOffset,
-    flex_order_1.FlexOrder
+    flex_order_1.FlexOrder,
 ];
 //# sourceMappingURL=index.js.map

package/dist/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/layout/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,iCAA8B;AAC9B,6CAAyC;AACzC,2CAAuC;AACvC,+CAA2C;AAC3C,6CAAyC;AACzC,qCAAkC;AAClC,iDAA6C;AAC7C,6CAAyC;AACzC,yCAAsC;AAEtC,2CAAyB;AAEZ,QAAA,UAAU,GAAG;IACxB,mBAAQ;IACR,eAAM;IACN,0BAAW;IACX,sBAAS;IACT,oBAAQ;IACR,WAAI;IACJ,sBAAS;IACT,wBAAU;IACV,sBAAS;CACV,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/layout/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,iCAA8B;AAC9B,6CAAyC;AACzC,2CAAuC;AACvC,+CAA2C;AAC3C,6CAAyC;AACzC,qCAAkC;AAClC,iDAA6C;AAC7C,6CAAyC;AACzC,yCAAsC;AAEtC,2CAAyB;AAEZ,QAAA,UAAU,GAAG;IACxB,mBAAQ;IACR,eAAM;IACN,0BAAW;IACX,sBAAS;IACT,oBAAQ;IACR,WAAI;IACJ,sBAAS;IACT,wBAAU;IACV,sBAAS;CACV,CAAC"}

package/dist/layout/layout-align.d.ts

@@ -1,14 +1,15 @@
-import { EnterMediaQueryAttributes, MediaQueryAttribute } from '@rhtml/custom-attributes';
+import { MediaQueryAttribute, MediaQueryEvent } from '@rhtml/custom-attributes';
 interface Styles {
     placeContent: string;
     alignItems: string;
     display: string;
 }
 export declare class LayoutAlign extends MediaQueryAttribute<Styles> {
+    private prevValue;
     OnInit(): void;
     OnDestroy(): void;
     OnUpdate(): void;
-    OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes): void;
+    OnEnterMediaQuery([, attribute]: MediaQueryEvent): void;
     OnExitMediaQuery(): void;
     private clean;
     private modify;

package/dist/layout/layout-align.js

@@ -35,7 +35,7 @@ let LayoutAlign = class LayoutAlign extends custom_attributes_1.MediaQueryAttrib
         this.setStyles({
             alignItems: null,
             placeContent: null,
-            display: null
+            display: null,
         })(this.element);
     }
     modify() {
@@ -45,13 +45,13 @@ let LayoutAlign = class LayoutAlign extends custom_attributes_1.MediaQueryAttrib
             placeContent: crossAxis
                 ? `${crossAxis} ${mainAxis}`
                 : `${mainAxis} ${mainAxis}`,
-            display: 'flex'
+            display: 'flex',
         })(this.element);
     }
 };
 LayoutAlign = __decorate([
-    custom_attributes_1.Modifier({
-        selector: 'fxLayoutAlign'
+    (0, custom_attributes_1.Modifier)({
+        selector: 'fxLayoutAlign',
     })
 ], LayoutAlign);
 exports.LayoutAlign = LayoutAlign;

package/dist/layout/layout-align.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout-align.js","sourceRoot":"","sources":["../../src/layout/layout-align.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAWlC,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,uCAA2B;IAC1D,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;IAChB,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,KAAK,SAAG,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC1C,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,IAAI;YAChB,YAAY,EAAE,IAAI;YAClB,OAAO,EAAE,IAAI;SACd,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACpD,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;YAC5C,YAAY,EAAE,SAAS;gBACrB,CAAC,CAAC,GAAG,SAAS,IAAI,QAAQ,EAAE;gBAC5B,CAAC,CAAC,GAAG,QAAQ,IAAI,QAAQ,EAAE;YAC7B,OAAO,EAAE,MAAM;SAChB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AA5CY,WAAW;IAHvB,4BAAQ,CAAC;QACR,QAAQ,EAAE,eAAe;KAC1B,CAAC;GACW,WAAW,CA4CvB;AA5CY,kCAAW"}
+{"version":3,"file":"layout-align.js","sourceRoot":"","sources":["../../src/layout/layout-align.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAIkC;AAWlC,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,uCAA2B;IAG1D,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,UAAU,EAAE,IAAI;YAChB,YAAY,EAAE,IAAI;YAClB,OAAO,EAAE,IAAI;SACd,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEO,MAAM;QACZ,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACpD,IAAI,CAAC,SAAS,CAAC;YACb,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;YAC5C,YAAY,EAAE,SAAS;gBACrB,CAAC,CAAC,GAAG,SAAS,IAAI,QAAQ,EAAE;gBAC5B,CAAC,CAAC,GAAG,QAAQ,IAAI,QAAQ,EAAE;YAC7B,OAAO,EAAE,MAAM;SAChB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;CACF,CAAA;AA9CY,WAAW;IAHvB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,eAAe;KAC1B,CAAC;GACW,WAAW,CA8CvB;AA9CY,kCAAW"}

package/dist/layout/layout-gap.d.ts

@@ -1,14 +1,15 @@
-import { EnterMediaQueryAttributes, MediaQueryAttribute } from '@rhtml/custom-attributes';
+import { MediaQueryAttribute, MediaQueryEvent } from '@rhtml/custom-attributes';
 interface Styles {
     margin: string;
-    flex: string;
+    flex?: string;
 }
 export declare class LayoutGap extends MediaQueryAttribute<Styles> {
+    private prevValue;
     OnInit(): void;
     OnDestroy(): void;
     OnUpdate(): void;
     OnChange(): void;
-    OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes): void;
+    OnEnterMediaQuery([, attribute]: MediaQueryEvent): void;
     OnExitMediaQuery(): void;
     private clean;
     private modify;

package/dist/layout/layout-gap.js

@@ -39,37 +39,45 @@ let LayoutGap = class LayoutGap extends custom_attributes_1.MediaQueryAttribute
         for (const div of divs) {
             this.setStyles({
                 flex: null,
-                margin: null
+                margin: null,
             })(div);
         }
     }
     modify() {
         const layout = this.element.getAttribute('fxlayout');
-        let margin = `0px ${this.value} ${this.value} 0px`;
-        if (layout === 'row') {
-            margin = `0px ${this.value} 0px 0px`;
+        const isRow = layout === 'row';
+        const isColumn = layout === 'column';
+        let margin = [this.value];
+        if (isRow) {
+            margin = [0, this.value, 0, 0];
         }
-        if (layout === 'column') {
-            margin = `0px 0px ${this.value} 0px`;
+        if (isColumn) {
+            margin = [0, 0, this.value, 0];
         }
         const divs = this.element.children;
         for (const div of divs) {
             this.setStyles({
                 flex: '1 1 25%',
-                margin
+                margin: margin.join(' '),
             })(div);
         }
+        const lastElement = this.element.children[this.element.children.length - 1];
+        if (lastElement && isRow) {
+            this.setStyles({
+                margin: null,
+            })(lastElement);
+        }
     }
 };
 LayoutGap = __decorate([
-    custom_attributes_1.Modifier({
+    (0, custom_attributes_1.Modifier)({
         selector: 'fxLayoutGap',
         observe: {
             childList: true,
             subtree: true,
             attributes: true,
-            attributeFilter: custom_attributes_1.createFiltersFromSelector('fxlayout')
-        }
+            attributeFilter: (0, custom_attributes_1.createFiltersFromSelector)('fxlayout'),
+        },
     })
 ], LayoutGap);
 exports.LayoutGap = LayoutGap;

package/dist/layout/layout-gap.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout-gap.js","sourceRoot":"","sources":["../../src/layout/layout-gap.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAKkC;AAgBlC,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,uCAA2B;IACxD,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,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;IAChB,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,KAAK,SAAG,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC;QAC1C,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEO,KAAK;QACX,MAAM,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAkB,CAAC;QACzD,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;YACtB,IAAI,CAAC,SAAS,CAAC;gBACb,IAAI,EAAE,IAAI;gBACV,MAAM,EAAE,IAAI;aACb,CAAC,CAAC,GAAG,CAAC,CAAC;SACT;IACH,CAAC;IAEO,MAAM;QACZ,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QACrD,IAAI,MAAM,GAAG,OAAO,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,MAAM,CAAC;QACnD,IAAI,MAAM,KAAK,KAAK,EAAE;YACpB,MAAM,GAAG,OAAO,IAAI,CAAC,KAAK,UAAU,CAAC;SACtC;QACD,IAAI,MAAM,KAAK,QAAQ,EAAE;YACvB,MAAM,GAAG,WAAW,IAAI,CAAC,KAAK,MAAM,CAAC;SACtC;QACD,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC;QACnC,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;YACtB,IAAI,CAAC,SAAS,CAAC;gBACb,IAAI,EAAE,SAAS;gBACf,MAAM;aACP,CAAC,CAAC,GAAG,CAAC,CAAC;SACT;IACH,CAAC;CACF,CAAA;AAzDY,SAAS;IATrB,4BAAQ,CAAC;QACR,QAAQ,EAAE,aAAa;QACvB,OAAO,EAAE;YACP,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,6CAAyB,CAAC,UAAU,CAAC;SACvD;KACF,CAAC;GACW,SAAS,CAyDrB;AAzDY,8BAAS"}
+{"version":3,"file":"layout-gap.js","sourceRoot":"","sources":["../../src/layout/layout-gap.ts"],"names":[],"mappings":";;;;;;;;;AAAA,gEAKkC;AAgBlC,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,uCAA2B;IAGxD,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,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,MAAM,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAkB,CAAC;QACzD,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;YACtB,IAAI,CAAC,SAAS,CAAC;gBACb,IAAI,EAAE,IAAI;gBACV,MAAM,EAAE,IAAI;aACb,CAAC,CAAC,GAAG,CAAC,CAAC;SACT;IACH,CAAC;IAEO,MAAM;QACZ,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QACrD,MAAM,KAAK,GAAG,MAAM,KAAK,KAAK,CAAC;QAC/B,MAAM,QAAQ,GAAG,MAAM,KAAK,QAAQ,CAAC;QACrC,IAAI,MAAM,GAAwB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/C,IAAI,KAAK,EAAE;YACT,MAAM,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;SAChC;QACD,IAAI,QAAQ,EAAE;YACZ,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;SAChC;QACD,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC;QACnC,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;YACtB,IAAI,CAAC,SAAS,CAAC;gBACb,IAAI,EAAE,SAAS;gBACf,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;aACzB,CAAC,CAAC,GAAG,CAAC,CAAC;SACT;QACD,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC5E,IAAI,WAAW,IAAI,KAAK,EAAE;YACxB,IAAI,CAAC,SAAS,CAAC;gBACb,MAAM,EAAE,IAAI;aACb,CAAC,CAAC,WAAW,CAAC,CAAC;SACjB;IACH,CAAC;CACF,CAAA;AAnEY,SAAS;IATrB,IAAA,4BAAQ,EAAC;QACR,QAAQ,EAAE,aAAa;QACvB,OAAO,EAAE;YACP,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,IAAA,6CAAyB,EAAC,UAAU,CAAC;SACvD;KACF,CAAC;GACW,SAAS,CAmErB;AAnEY,8BAAS"}

package/dist/layout/layout.d.ts

@@ -1,4 +1,4 @@
-import { EnterMediaQueryAttributes, MediaQueryAttribute } from '@rhtml/custom-attributes';
+import { MediaQueryAttribute, MediaQueryEvent } from '@rhtml/custom-attributes';
 interface Styles {
     flexFlow: string;
     boxSizing: string;
@@ -6,10 +6,11 @@ interface Styles {
 }
 export declare class Layout extends MediaQueryAttribute<Styles> {
     value: string;
+    private prevValue;
     OnInit(): void;
     OnDestroy(): void;
     OnUpdate(): void;
-    OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes): void;
+    OnEnterMediaQuery([, attribute]: MediaQueryEvent): void;
     OnExitMediaQuery(): void;
     private clean;
     private modify;

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;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,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.113",
+  "version": "0.0.116",
   "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.113"
-  },
-  "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.116"
   },
+  "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();

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();
@@ -43,7 +45,7 @@ export class Flex extends MediaQueryAttribute<Styles> {
     this.setStyles({
       boxSizing: null,
       maxWidth: null,
-      flex: null
+      flex: null,
     })(this.element);
   }
 
@@ -51,7 +53,7 @@ export class Flex extends MediaQueryAttribute<Styles> {
     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();
@@ -43,7 +45,7 @@ export class LayoutAlign extends MediaQueryAttribute<Styles> {
     this.setStyles({
       alignItems: null,
       placeContent: null,
-      display: null
+      display: null,
     })(this.element);
   }
 
@@ -54,7 +56,7 @@ export class LayoutAlign extends MediaQueryAttribute<Styles> {
       placeContent: crossAxis
         ? `${crossAxis} ${mainAxis}`
         : `${mainAxis} ${mainAxis}`,
-      display: 'flex'
+      display: 'flex',
     })(this.element);
   }
 }

package/src/layout/layout-gap.ts

@@ -1,13 +1,13 @@
 import {
   createFiltersFromSelector,
-  EnterMediaQueryAttributes,
   MediaQueryAttribute,
-  Modifier
+  MediaQueryEvent,
+  Modifier,
 } from '@rhtml/custom-attributes';
 
 interface Styles {
   margin: string;
-  flex: string;
+  flex?: string;
 }
 
 @Modifier({
@@ -16,10 +16,12 @@ interface Styles {
     childList: true,
     subtree: true,
     attributes: true,
-    attributeFilter: createFiltersFromSelector('fxlayout')
-  }
+    attributeFilter: createFiltersFromSelector('fxlayout'),
+  },
 })
 export class LayoutGap extends MediaQueryAttribute<Styles> {
+  private prevValue: string;
+
   OnInit() {
     this.modify();
     super.OnInit();
@@ -38,7 +40,7 @@ export class LayoutGap extends MediaQueryAttribute<Styles> {
     this.modify();
   }
 
-  OnEnterMediaQuery([, attribute]: EnterMediaQueryAttributes) {
+  OnEnterMediaQuery([, attribute]: MediaQueryEvent) {
     this.prevValue = this.value;
     this.value = attribute.value ?? this.value;
     this.modify();
@@ -54,26 +56,34 @@ export class LayoutGap extends MediaQueryAttribute<Styles> {
     for (const div of divs) {
       this.setStyles({
         flex: null,
-        margin: null
+        margin: null,
       })(div);
     }
   }
 
   private modify() {
     const layout = this.element.getAttribute('fxlayout');
-    let margin = `0px ${this.value} ${this.value} 0px`;
-    if (layout === 'row') {
-      margin = `0px ${this.value} 0px 0px`;
+    const isRow = layout === 'row';
+    const isColumn = layout === 'column';
+    let margin: (string | number)[] = [this.value];
+    if (isRow) {
+      margin = [0, this.value, 0, 0];
     }
-    if (layout === 'column') {
-      margin = `0px 0px ${this.value} 0px`;
+    if (isColumn) {
+      margin = [0, 0, this.value, 0];
     }
     const divs = this.element.children;
     for (const div of divs) {
       this.setStyles({
         flex: '1 1 25%',
-        margin
+        margin: margin.join(' '),
       })(div);
     }
+    const lastElement = this.element.children[this.element.children.length - 1];
+    if (lastElement && isRow) {
+      this.setStyles({
+        margin: null,
+      })(lastElement);
+    }
   }
 }

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,24 +31,22 @@ 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);
   }
 
   private clean() {
     this.setStyles({
       boxSizing: null,
       flexFlow: null,
-      display: null
+      display: null,
     })(this.element);
   }
 
@@ -55,12 +54,13 @@ export class Layout extends MediaQueryAttribute<Styles> {
     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
-};