@triniwiz/nativescript-masonkit 1.0.0-alpha.21 → 1.0.0-alpha.23

package/index.d.ts

@@ -3,19 +3,19 @@ import { CoreTypes } from '@nativescript/core';
 import { TextBase, ViewBase } from './common';
 import { LengthPercentage } from '@nativescript/core/css/parser';
 
-export type Length = CoreTypes.dip | CoreTypes.LengthDipUnit | CoreTypes.LengthPxUnit | CoreTypes.LengthPercentUnit;
+export type Length = CoreTypes.dip | CoreTypes.LengthDipUnit | CoreTypes.LengthPxUnit | CoreTypes.LengthPercentUnit | `${number}px` | `${number}%` | `${number}dip`;
 
-export type LengthAuto = CoreTypes.dip | CoreTypes.LengthDipUnit | CoreTypes.LengthPxUnit | CoreTypes.LengthPercentUnit | 'auto';
+export type LengthAuto = CoreTypes.dip | CoreTypes.LengthDipUnit | CoreTypes.LengthPxUnit | CoreTypes.LengthPercentUnit | 'auto' | `${number}px` | `${number}%` | `${number}dip`;
 
 export type SizeLength = { width: LengthType; height: LengthType };
 
 export type Position = 'absolute' | 'relative';
 
-export type Display = 'none' | 'flex' | 'grid' | 'block';
+export type Display = 'none' | 'flex' | 'grid' | 'block' | 'inline' | 'inline-block' | 'inline-flex' | 'inline-grid';
 
 export type BoxSizing = 'border-box' | 'content-box';
 
-export type Overflow = 'visible' | 'hidden' | 'scroll';
+export type Overflow = 'visible' | 'hidden' | 'scroll' | 'clip' | 'auto';
 
 export type FlexWrap = 'no-wrap' | 'wrap' | 'wrap-reverse';
 
@@ -39,74 +39,82 @@ export type JustifyContent = AlignContent;
 
 export type GridAutoFlow = 'row' | 'column' | 'row dense' | 'column dense' | 'dense';
 
-export class View extends ViewBase {
-  display: Display;
-  position: Position;
-  flexDirection: FlexDirection;
-  flexWrap: FlexWrap;
-  flex: string | 'auto' | 'none' | number | 'initial';
-  flexFlow: string;
-  width: LengthAuto;
-  height: LengthAuto;
-  maxWidth: LengthAuto;
-  maxHeight: LengthAuto;
-  left: Length;
-  right: Length;
-  top: Length;
-  bottom: Length;
-  gridGap: Gap;
-  gap: Gap;
-  rowGap: Length;
-  columnGap: Length;
-  aspectRatio: number;
-  flexBasis: Length;
-  alignItems: AlignItems;
-  alignSelf: AlignSelf;
-  alignContent: AlignContent;
-  justifyItems: JustifyItems;
-  justifySelf: JustifySelf;
-  justifyContent: JustifyContent;
-  gridAutoRows: string;
-  gridAutoColumns: string;
-  gridAutoFlow: GridAutoFlow;
-  gridRowGap: Gap;
-  gridColumnGap: Gap;
-  gridArea: string;
-  gridColumn: string;
-  gridColumnStart: string;
-  gridColumnEnd: string;
-  gridRow: string;
-  gridRowStart: string;
-  gridRowEnd: string;
-  gridTemplateRows: string;
-  gridTemplateColumns: string;
-  overflow: Overflow;
-  overflowX: Overflow;
-  overflowY: Overflow;
-  scrollBarWidth: number | CoreTypes.LengthType;
+declare module '@nativescript/core/ui/styling/style' {
+  interface Style {
+    boxSizing: BoxSizing;
+    display: Display;
+    position: Position;
+    flexDirection: FlexDirection;
+    flexWrap: FlexWrap;
+    flex: string | 'auto' | 'none' | number | 'initial';
+    flexFlow: string;
+    minWidth: LengthAuto;
+    minHeight: LengthAuto;
+    width: LengthAuto;
+    height: LengthAuto;
+    maxWidth: LengthAuto;
+    maxHeight: LengthAuto;
+    left: LengthAuto;
+    right: LengthAuto;
+    top: LengthAuto;
+    bottom: LengthAuto;
+    gridGap: Gap;
+    gap: Gap;
+    rowGap: Length;
+    columnGap: Length;
+    aspectRatio: number;
+    flexBasis: LengthPercentage | string | number;
+    alignItems: AlignItems;
+    alignSelf: AlignSelf;
+    alignContent: AlignContent;
+    justifyItems: JustifyItems;
+    justifySelf: JustifySelf;
+    justifyContent: JustifyContent;
+    gridAutoRows: string;
+    gridAutoColumns: string;
+    gridAutoFlow: GridAutoFlow;
+    gridRowGap: Gap;
+    gridColumnGap: Gap;
+    gridArea: string;
+    gridColumn: string;
+    gridColumnStart: string;
+    gridColumnEnd: string;
+    gridRow: string;
+    gridRowStart: string;
+    gridRowEnd: string;
+    gridTemplateRows: string;
+    gridTemplateColumns: string;
+    overflow: Overflow | `${Overflow} ${Overflow}`;
+    overflowX: Overflow;
+    overflowY: Overflow;
+    scrollBarWidth: Length;
+  }
 }
 
-export class Text extends TextBase {
+interface Style {
+  boxSizing: BoxSizing;
   display: Display;
   position: Position;
   flexDirection: FlexDirection;
   flexWrap: FlexWrap;
   flex: string | 'auto' | 'none' | number | 'initial';
   flexFlow: string;
+  minWidth: LengthAuto;
+  minHeight: LengthAuto;
   width: LengthAuto;
   height: LengthAuto;
   maxWidth: LengthAuto;
   maxHeight: LengthAuto;
-  left: Length;
-  right: Length;
-  top: Length;
-  bottom: Length;
+  left: LengthAuto;
+  right: LengthAuto;
+  top: LengthAuto;
+  bottom: LengthAuto;
   gridGap: Gap;
   gap: Gap;
   rowGap: Length;
   columnGap: Length;
   aspectRatio: number;
-  flexBasis: Length;
+  flexBasis: LengthPercentage | string | number;
   alignItems: AlignItems;
   alignSelf: AlignSelf;
   alignContent: AlignContent;
@@ -127,14 +135,15 @@ export class Text extends TextBase {
   gridRowEnd: string;
   gridTemplateRows: string;
   gridTemplateColumns: string;
-  overflow: Overflow;
+  overflow: Overflow | `${Overflow} ${Overflow}`;
   overflowX: Overflow;
   overflowY: Overflow;
-  scrollBarWidth: number | CoreTypes.LengthType;
+  scrollBarWidth: Length;
 }
 
-export class Img extends ViewBase {
-  src: string;
+interface IViewBase {
+  style: Style;
+  boxSizing: BoxSizing;
   display: Display;
   position: Position;
   flexDirection: FlexDirection;
@@ -181,51 +190,16 @@ export class Img extends ViewBase {
   scrollBarWidth: number | CoreTypes.LengthType;
 }
 
-declare module '@nativescript/core/ui/styling/style' {
-  interface Style {
-    display: Display;
-    position: Position;
-    flexDirection: FlexDirection;
-    flexWrap: FlexWrap;
-    flex: string | 'auto' | 'none' | number | 'initial';
-    flexFlow: string;
-    width: LengthPercentage | string | number;
-    height: LengthPercentage | string | number;
-    maxWidth: LengthPercentage | string | number;
-    maxHeight: LengthPercentage | string | number;
-    left: Length;
-    right: Length;
-    top: Length;
-    bottom: Length;
-    gridGap: Gap;
-    gap: Gap;
-    rowGap: Length;
-    columnGap: Length;
-    aspectRatio: number;
-    flexBasis: LengthPercentage | string | number;
-    alignItems: AlignItems;
-    alignSelf: AlignSelf;
-    alignContent: AlignContent;
-    justifyItems: JustifyItems;
-    justifySelf: JustifySelf;
-    justifyContent: JustifyContent;
-    gridAutoRows: string;
-    gridAutoColumns: string;
-    gridAutoFlow: GridAutoFlow;
-    gridRowGap: Gap;
-    gridColumnGap: Gap;
-    gridArea: string;
-    gridColumn: string;
-    gridColumnStart: string;
-    gridColumnEnd: string;
-    gridRow: string;
-    gridRowStart: string;
-    gridRowEnd: string;
-    gridTemplateRows: string;
-    gridTemplateColumns: string;
-    overflow: Overflow;
-    overflowX: Overflow;
-    overflowY: Overflow;
-    scrollBarWidth: number | CoreTypes.LengthType;
-  }
+class VBase extends ViewBase implements IViewBase {
+  style: Style;
+}
+
+export class View extends VBase {}
+
+export class Text extends VBase {}
+
+export class Img extends VBase {
+  src: string;
 }
+
+export class Scroll extends VBase {}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@triniwiz/nativescript-masonkit",
-  "version": "1.0.0-alpha.21",
+  "version": "1.0.0-alpha.23",
   "description": "Web Inspired Layout",
   "main": "index",
   "typings": "index.d.ts",