native-document 1.0.165 → 1.0.166

package/src/components/stacks/HStack.js

@@ -1,7 +1,14 @@
-import Stack from "./Stack";
-import DebugManager from "../../core/utils/debug-manager";
-import BaseComponent from "../BaseComponent";
+import Stack from './Stack';
+import DebugManager from '../../core/utils/debug-manager';
+import BaseComponent from '../BaseComponent';
 
+/**
+ *
+ *
+ * @constructor
+ * @param {NdChild} content
+ * @param {GlobalAttributes} [props={}]
+ */
 export default function HStack(content, props = {}) {
     if (!(this instanceof HStack)) {
         return new HStack(content, props);
@@ -14,10 +21,21 @@ export default function HStack(content, props = {}) {
 BaseComponent.extends(HStack,  Stack);
 
 HStack.defaultTemplate = null;
+
+/**
+ * Registers the render template for HStack.
+ * @param {(description: {
+ *     [key: string]: *
+ * }, instance: HStack) => NdChild} template
+ */
 HStack.use = function(template) {
     HStack.defaultTemplate = template;
 };
 
+/**
+ * @param {string} name
+ * @param {(s: HStack) => HStack} callback
+ */
 HStack.preset = function(name, callback) {
     if (HStack.prototype[name] || HStack[name]) {
         DebugManager.warn(`Warning: the ${name} method already exists in HStack.`);
@@ -26,6 +44,9 @@ HStack.preset = function(name, callback) {
     HStack[name] = (content, props) => callback(new HStack(content, props));
 };
 
+/**
+ * @param {Record<string, (s: HStack) => HStack>} presets
+ */
 HStack.presets = function(presets) {
     for (const name in presets) {
         HStack.preset(name, presets[name]);

package/src/components/stacks/PositionStack.js

@@ -1,5 +1,19 @@
-import BaseComponent from "../BaseComponent";
-
+import BaseComponent from '../BaseComponent';
+
+/**
+ * Positioned flex container (base for AbsoluteStack, FixedStack, RelativeStack). Adds top/right/bottom/left/zIndex control.
+ *
+ *
+ * @example
+ * const overlay = new AbsoluteStack(Spinner())
+ *     .fill()
+ *     .center()
+ *     .zIndex(10);
+ *
+ * @constructor
+ * @param {NdChild} content
+ * @param {GlobalAttributes} [props={}]
+ */
 export default function PositionStack(content, props = {}) {
     if(!(this instanceof PositionStack)) {
         return new PositionStack(content, props);
@@ -18,51 +32,97 @@ export default function PositionStack(content, props = {}) {
         height: null,
         zIndex: null,
         anchor: null,
-        props
+        props,
     };
 }
 
 BaseComponent.extends(PositionStack);
 
 PositionStack.defaultTemplate = null;
+
+/**
+ * Registers the render template for PositionStack.
+ * @param {(description: {
+ *     position: 'absolute'|'fixed'|'relative',
+ *     content: NdChild,
+ *     top: string|number|null,
+ *     right: string|number|null,
+ *     bottom: string|number|null,
+ *     left: string|number|null,
+ *     width: string|number|null,
+ *     height: string|number|null,
+ *     zIndex: number|null,
+ *     anchor: string|null,
+ *     props: GlobalAttributes,
+ * }, instance: PositionStack) => NdChild} template
+ */
 PositionStack.use = function(template) {
     PositionStack.defaultTemplate = template;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.top = function(value) {
     this.$description.top = value;
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.right = function(value) {
     this.$description.right = value;
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.bottom = function(value) {
     this.$description.bottom = value;
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.left = function(value) {
     this.$description.left = value;
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.fill = function() {
     this.$description.anchor = 'fill';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.topLeading = function() {
     this.$description.anchor = 'top-leading';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atTopCenter = function() {
     this.$description.anchor = 'top-center';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atTopTrailing = function() {
     this.$description.anchor = 'top-trailing';
     return this;
@@ -73,73 +133,121 @@ PositionStack.prototype.atCenterLeading = function() {
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atCenter = function() {
     this.$description.anchor = 'center';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atCenterTrailing = function() {
     this.$description.anchor = 'center-trailing';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atBottomLeading = function() {
     this.$description.anchor = 'bottom-leading';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atBottomCenter = function() {
     this.$description.anchor = 'bottom-center';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.atBottomTrailing = function() {
     this.$description.anchor = 'bottom-trailing';
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.width = function(value) {
     this.$description.width = value;
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.height = function(value) {
     this.$description.height = value;
     return this;
 };
 
+/**
+ * @param {number} width
+ * @param {number} height
+ * @returns {this}
+ */
 PositionStack.prototype.size = function(width, height) {
     this.$description.width  = width;
     this.$description.height = height ?? width;
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.fullWidth = function() {
     this.$description.width = '100%';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.fullHeight = function() {
     this.$description.height = '100%';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.fullSize = function() {
     this.$description.width  = '100%';
     this.$description.height = '100%';
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 PositionStack.prototype.zIndex = function(value) {
     this.$description.zIndex = value;
     return this;
 };
 
+/**
+ * @param {number} [zIndex]
+ * @returns {this}
+ */
 PositionStack.prototype.above = function(zIndex = 100) {
     this.$description.zIndex = zIndex;
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 PositionStack.prototype.below = function() {
     this.$description.zIndex = -1;
     return this;

package/src/components/stacks/RelativeStack.js

@@ -1,7 +1,14 @@
-import BaseComponent from "../BaseComponent";
-import PositionStack from "./PositionStack";
-import DebugManager from "../../core/utils/debug-manager";
+import BaseComponent from '../BaseComponent';
+import PositionStack from './PositionStack';
+import DebugManager from '../../core/utils/debug-manager';
 
+/**
+ *
+ *
+ * @constructor
+ * @param {NdChild} content
+ * @param {GlobalAttributes} [props={}]
+ */
 export default function RelativeStack(content, props = {}) {
     if(!(this instanceof RelativeStack)) {
         return new RelativeStack(content, props);
@@ -14,10 +21,20 @@ BaseComponent.extends(RelativeStack, PositionStack);
 
 RelativeStack.defaultTemplate = null;
 
+/**
+ * Registers the render template for RelativeStack.
+ * @param {(description: {
+ *     [key: string]: *
+ * }, instance: RelativeStack) => NdChild} template
+ */
 RelativeStack.use = function(template) {
     RelativeStack.defaultTemplate = template;
 };
 
+/**
+ * @param {string} name
+ * @param {(s: RelativeStack) => RelativeStack} callback
+ */
 RelativeStack.preset = function(name, callback) {
     if(RelativeStack.prototype[name] || RelativeStack[name]) {
         DebugManager.warn(`Warning: the ${name} method already exists in RelativeStack.`);
@@ -26,6 +43,9 @@ RelativeStack.preset = function(name, callback) {
     RelativeStack[name] = (content, props) => callback(new RelativeStack(content, props));
 };
 
+/**
+ * @param {Record<string, (s: RelativeStack) => RelativeStack>} presets
+ */
 RelativeStack.presets = function(presets) {
     for(const name in presets) {
         RelativeStack.preset(name, presets[name]);

package/src/components/stacks/Stack.js

@@ -1,7 +1,22 @@
 
 
-import BaseComponent from "../BaseComponent";
+import BaseComponent from '../BaseComponent';
 
+/**
+ * Flex container (base for HStack/VStack). Controls wrap, grow, spacing, alignment and justify.
+ *
+ *
+ * @example
+ * const stack = new Stack(VStack(item1, item2, item3))
+ *     .spacing(16)
+ *     .alignCenter()
+ *     .justifyBetween()
+ *     .wrap(true);
+ *
+ * @constructor
+ * @param {NdChild} content
+ * @param {GlobalAttributes} [props={}]
+ */
 export default function Stack(content, props = {}) {
     if (!(this instanceof Stack)) {
         return new Stack(content, props);
@@ -25,70 +40,126 @@ export default function Stack(content, props = {}) {
 
 BaseComponent.extends(Stack);
 
-
+/**
+ * @param {*} [enabled]
+ * @returns {this}
+ */
 Stack.prototype.wrap = function(enabled = true) {
     this.$description.wrap = enabled;
     return this;
 };
 
+/**
+ * @param {*} [enabled]
+ * @returns {this}
+ */
 Stack.prototype.grow = function(enabled = true) {
     this.$description.grow = enabled;
     return this;
 };
 
+/**
+ * @param {*} [enabled]
+ * @returns {this}
+ */
 Stack.prototype.reverse = function(enabled = true) {
     this.$description.reverse = enabled;
     return this;
 };
 
+/**
+ * @param {*} [enabled]
+ * @returns {this}
+ */
 Stack.prototype.shrink = function(enabled = true) {
     this.$description.shrink = enabled;
     return this;
 };
 
+/**
+ * @param {number} value
+ * @returns {this}
+ */
 Stack.prototype.spacing = function(value) {
     this.$description.spacing = value;
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 Stack.prototype.alignLeading = function() {
     this.$description.alignment = 'leading';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.alignCenter = function() {
     this.$description.alignment = 'center';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.alignTrailing = function() {
     this.$description.alignment = 'trailing';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.alignStretch = function() {
     this.$description.alignment = 'stretch';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 Stack.prototype.justifyStart = function() {
     this.$description.justifyContent = 'start';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.justifyCenter = function() {
     this.$description.justifyContent = 'center';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.justifyEnd = function() {
     this.$description.justifyContent = 'end';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.justifyBetween = function() {
     this.$description.justifyContent = 'between';
     return this;
 };
+
+/**
+ * @returns {this}
+ */
 Stack.prototype.justifyAround = function() {
     this.$description.justifyContent = 'around';
     return this;
 };
 
+/**
+ * @returns {this}
+ */
 Stack.prototype.center = function() {
     this.alignCenter().justifyCenter();
     return this;

package/src/components/stacks/VStack.js

@@ -1,8 +1,14 @@
-import Stack from "./Stack";
-import DebugManager from "../../core/utils/debug-manager";
-import BaseComponent from "../BaseComponent";
-
+import Stack from './Stack';
+import DebugManager from '../../core/utils/debug-manager';
+import BaseComponent from '../BaseComponent';
 
+/**
+ *
+ *
+ * @constructor
+ * @param {NdChild} content
+ * @param {GlobalAttributes} [props={}]
+ */
 export default function VStack(content, props = {}) {
     if (!(this instanceof VStack)) {
         return new VStack(content, props);
@@ -16,10 +22,21 @@ export default function VStack(content, props = {}) {
 BaseComponent.extends(VStack, Stack);
 
 VStack.defaultTemplate = null;
+
+/**
+ * Registers the render template for VStack.
+ * @param {(description: {
+ *     [key: string]: *
+ * }, instance: VStack) => NdChild} template
+ */
 VStack.use = function(template) {
     VStack.defaultTemplate = template;
 };
 
+/**
+ * @param {string} name
+ * @param {(s: VStack) => VStack} callback
+ */
 VStack.preset = function(name, callback) {
     if (VStack.prototype[name] || VStack[name]) {
         DebugManager.warn(`Warning: the ${name} method already exists in VStack.`);
@@ -28,6 +45,9 @@ VStack.preset = function(name, callback) {
     VStack[name] = (content, props) => callback(new VStack(content, props));
 };
 
+/**
+ * @param {Record<string, (s: VStack) => VStack>} presets
+ */
 VStack.presets = function(presets) {
     for (const name in presets) {
         VStack.preset(name, presets[name]);

package/src/components/stacks/index.js

@@ -1,9 +1,9 @@
-import Stack from "./Stack";
-import VStack from "./VStack";
-import FixedStack from "./FixedStack";
-import HStack from "./HStack";
-import AbsoluteStack from "./AbsoluteStack";
-import RelativeStack from "./RelativeStack";
+import Stack from './Stack';
+import VStack from './VStack';
+import FixedStack from './FixedStack';
+import HStack from './HStack';
+import AbsoluteStack from './AbsoluteStack';
+import RelativeStack from './RelativeStack';
 
 
 const Row = HStack;
@@ -18,4 +18,4 @@ export {
     AbsoluteStack,
     Row,
     Col,
-}
+};

package/src/components/stacks/types/AbsoluteStack.d.ts

@@ -0,0 +1,16 @@
+import type { ValidChild } from '../../../../types/elements';
+import type { PositionStackInterface, PositionStackDescription } from './PositionStack';
+
+export interface AbsoluteStackInterface extends PositionStackInterface {}
+
+
+export declare function AbsoluteStack(content: ValidChild, props?: Record<string, unknown>): AbsoluteStackInterface;
+export declare namespace AbsoluteStack {
+
+
+    function use(template: (description: PositionStackDescription, instance: AbsoluteStackInterface) => ValidChild): void;
+    function preset(name: string, callback: (instance: AbsoluteStackInterface) => AbsoluteStackInterface): void;
+    function presets(presets: Record<string, (instance: AbsoluteStackInterface) => AbsoluteStackInterface>): void;
+
+
+}

package/src/components/stacks/types/FixedStack.d.ts

@@ -0,0 +1,16 @@
+import type { ValidChild } from '../../../../types/elements';
+import type { PositionStackInterface, PositionStackDescription } from './PositionStack';
+
+export interface FixedStackInterface extends PositionStackInterface {}
+
+
+export declare function FixedStack(content: ValidChild, props?: Record<string, unknown>): FixedStackInterface;
+export declare namespace FixedStack {
+
+
+    function use(template: (description: PositionStackDescription, instance: FixedStackInterface) => ValidChild): void;
+    function preset(name: string, callback: (instance: FixedStackInterface) => FixedStackInterface): void;
+    function presets(presets: Record<string, (instance: FixedStackInterface) => FixedStackInterface>): void;
+
+
+}

package/src/components/stacks/types/HStack.d.ts

@@ -0,0 +1,16 @@
+import type { ValidChild } from '../../../../types/elements';
+import type {StackDescription, StackInterface} from './Stack';
+
+export interface HStackInterface extends StackInterface {}
+
+
+export declare function HStack(content: ValidChild, props?: Record<string, unknown>): HStackInterface;
+export declare namespace HStack {
+
+
+    function use(template: (description: StackDescription, instance: HStackInterface) => ValidChild): void;
+    function preset(name: string, callback: (instance: HStackInterface) => HStackInterface): void;
+    function presets(presets: Record<string, (instance: HStackInterface) => HStackInterface>): void;
+
+
+}

package/src/components/stacks/types/PositionStack.d.ts

@@ -0,0 +1,54 @@
+import type { ValidChild } from '../../../../types/elements';
+import type { StackInterface } from './Stack';
+import type { GlobalAttributes } from '../../../../types/globals';
+
+export type PositionStackDescription = {
+        position: 'absolute' | 'fixed' | 'relative';
+        content: ValidChild;
+        top: string | number | null;
+        right: string | number | null;
+        bottom: string | number | null;
+        left: string | number | null;
+        width: string | number | null;
+        height: string | number | null;
+        zIndex: number | null;
+        anchor: string | null;
+        props: GlobalAttributes;
+    };
+
+export interface PositionStackInterface extends Omit<StackInterface, 'render'> {
+    top(value: string | number): this;
+    right(value: string | number): this;
+    bottom(value: string | number): this;
+    left(value: string | number): this;
+    fill(): this;
+    topLeading(): this;
+    atTopCenter(): this;
+    atTopTrailing(): this;
+    atCenterLeading(): this;
+    atCenter(): this;
+    atCenterTrailing(): this;
+    atBottomLeading(): this;
+    atBottomCenter(): this;
+    atBottomTrailing(): this;
+    width(value: string | number): this;
+    height(value: string | number): this;
+    size(width: string | number, height?: string | number): this;
+    fullWidth(): this;
+    fullHeight(): this;
+    fullSize(): this;
+    zIndex(value: number): this;
+    above(zIndex?: number): this;
+    below(): this;
+    render(renderFn: (description: PositionStackDescription, instance: PositionStackInterface) => ValidChild): this;
+}
+
+
+export declare function PositionStack(content: ValidChild, props?: Record<string, unknown>): PositionStackInterface;
+export declare namespace PositionStack {
+
+
+    function use(template: (description: PositionStackDescription, instance: PositionStackInterface) => ValidChild): void;
+
+
+}

package/src/components/stacks/types/RelativeStack.d.ts

@@ -0,0 +1,17 @@
+import type { ValidChild } from '../../../../types/elements';
+import type { PositionStackInterface, PositionStackDescription } from './PositionStack';
+import {StackDescription} from "./Stack";
+
+export interface RelativeStackInterface extends PositionStackInterface {}
+
+
+export declare function RelativeStack(content: ValidChild, props?: Record<string, unknown>): RelativeStackInterface;
+export declare namespace RelativeStack {
+
+
+    function use(template: (description: PositionStackDescription, instance: RelativeStackInterface) => ValidChild): void;
+    function preset(name: string, callback: (instance: RelativeStackInterface) => RelativeStackInterface): void;
+    function presets(presets: Record<string, (instance: RelativeStackInterface) => RelativeStackInterface>): void;
+
+
+}