@decaf-ts/ui-decorators 0.5.27 → 0.5.29

package/lib/ui/decorators.d.ts

@@ -1,5 +1,5 @@
 import "reflect-metadata";
-import { CrudOperationKeys } from "./types";
+import { CrudOperationKeys, UILayoutCol } from "./types";
 /**
  * @description Decorator that hides a property during specific CRUD operations
  * @summary Controls property visibility based on operation type
@@ -247,7 +247,7 @@ export declare function uichild(clazz: string, tag: string, props?: Record<strin
  * @description Decorator that maps a model property to a list item component
  * @summary Specifies how a property should be rendered in a list context
  * This decorator allows you to define how a model property containing a list
- * should be rendered. It requires the class to be decorated with @uilistitem.
+ * should be rendered. It requires the class to be decorated with @uilistmodel.
  *
  * @param {string} [propName] The name of the property to pass to the list component (defaults to the property key)
  * @param {Record<string, any>} [props] Additional properties to pass to the list container
@@ -268,7 +268,7 @@ export declare function uichild(clazz: string, tag: string, props?: Record<strin
  *   items: TodoItem[];
  * }
  *
- * @uilistitem('li', { class: 'todo-item' })
+ * @uilistmodel('li', { class: 'todo-item' })
  * class TodoItem extends Model {
  *   @attribute()
  *   text: string;
@@ -289,7 +289,7 @@ export declare function uichild(clazz: string, tag: string, props?: Record<strin
  *   RenderingEngine->>Model: Get list prop metadata
  *   Model->>RenderingEngine: Return prop name and container props
  *   RenderingEngine->>ListContainer: Create container with props
- *   RenderingEngine->>ListItems: Render each item using @uilistitem
+ *   RenderingEngine->>ListItems: Render each item using @uilistmodel
  *   ListContainer->>RenderingEngine: Return rendered list
  */
 export declare function uilistprop(propName?: string | undefined, props?: Record<string, any>): (target: any, propertyKey: string) => void;
@@ -305,41 +305,104 @@ export declare function uilistprop(propName?: string | undefined, props?: Record
  * @param {Record<string, any>} [props={}] Additional properties to pass to the layout item
  * @return {Function} A property decorator function
  *
- * @function uilayoutitem
+ * @function uilayoutprop
  * @category Property Decorators
  *
  * @example
  * // Position properties in a grid layout
- * @uimodel('user-form')
+ * @uilayout('user-form', 2, 3) // 2 columns, 3 rows
+ * @model()
  * class UserForm {
  *   @attribute()
- *   @uilayoutitem(1, 1) // First column, first row
+ *   @uilayoutprop(1, 1) // One column, first row
  *   firstName: string;
  *
  *   @attribute()
- *   @uilayoutitem(2, 1) // Second column, first row
+ *   @uilayoutprop(2, 1) // One column, first row
  *   lastName: string;
  *
  *   @attribute()
- *   @uilayoutitem(1, 2, { colspan: 2 }) // First column, second row, spans 2 columns
+ *   @uilayoutprop(1, 2) // One column, second row
  *   email: string;
  *
  *   @attribute()
- *   @uilayoutitem(1, 3, { class: 'full-width' }) // First column, third row with custom class
+ *   @uilayoutprop(2, 3) // All columns, third row
  *   bio: string;
  * }
  *
  * @mermaid
  * sequenceDiagram
  *   participant Model
- *   participant uilayoutitem
+ *   participant uilayoutprop
  *   participant RenderingEngine
  *   participant LayoutContainer
- *   Model->>uilayoutitem: Apply to property
- *   uilayoutitem->>Model: Add layout item metadata
+ *   Model->>uilayoutprop: Apply to property
+ *   uilayoutprop->>Model: Add layout item metadata
  *   RenderingEngine->>Model: Get layout item metadata
  *   Model->>RenderingEngine: Return column, row, and props
  *   RenderingEngine->>LayoutContainer: Position element at grid coordinates
  *   LayoutContainer->>RenderingEngine: Return positioned element
  */
-export declare function uilayoutitem(col: number, row?: number, props?: Record<string, any>): (target: any, propertyKey: string) => void;
+export declare function uilayoutprop(col?: UILayoutCol, row?: number): (target: any, propertyKey: string) => void;
+/**
+ * @description Decorator that assigns a property to a specific page in multi-page forms
+ * @summary Specifies which page a property should appear on in paginated UI layouts
+ * This decorator applies metadata to the property, indicating which page number it belongs to
+ * in a multi-page form or wizard. Properties with the same page number are grouped together
+ * and rendered on the same page. This is typically used in conjunction with @uisteppedmodel to
+ * organize large forms into manageable sections.
+ *
+ * @param {number} [page=1] The page number where the property should appear (default is 1)
+ * @return {Function} A property decorator function
+ *
+ * @function uipageprop
+ * @category Property Decorators
+ *
+ * @example
+ * // Create a multi-step registration form with page-based layout
+ * @uisteppedmodel('registration-form', 2, true)
+ * @model()
+ * class RegistrationForm {
+ *   // Page 1: Personal Information
+ *   @attribute()
+ *   @uipageprop(1)
+ *   firstName: string;
+ *
+ *   @attribute()
+ *   @uipageprop(1)
+ *   lastName: string;
+ *
+ *   @attribute()
+ *   @uipageprop(1)
+ *   dateOfBirth: Date;
+ *
+ *   // Page 2: Contact Information
+ *   @attribute()
+ *   @uipageprop(2)
+ *   email: string;
+ *
+ *   @attribute()
+ *   @uipageprop(2)
+ *   phone: string;
+ *
+ *   // Page 3: Confirmation
+ *   @attribute()
+ *   @uipageprop(3)
+ *   acceptTerms: boolean;
+ * }
+ *
+ * @mermaid
+ * sequenceDiagram
+ *   participant Model
+ *   participant uipageprop
+ *   participant RenderingEngine
+ *   participant PaginationController
+ *   participant UI
+ *   Model->>uipageprop: Apply to property
+ *   uipageprop->>Model: Add page metadata
+ *   RenderingEngine->>Model: Get page metadata
+ *   Model->>RenderingEngine: Return page number
+ *   RenderingEngine->>PaginationController: Group properties by page
+ *   PaginationController->>UI: Render current page properties
+ */
+export declare function uipageprop(page?: number): (target: object, propertyKey?: string | symbol | unknown, descriptor?: PropertyDescriptor) => void;

package/lib/ui/decorators.js.map

@@ -1 +1 @@
-{"version":3,"file":"decorators.js","sourceRoot":"","sources":["../../src/ui/decorators.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"decorators.js","sourceRoot":"","sources":["../../src/ui/decorators.ts"],"names":[],"mappings":"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"}

package/lib/ui/interfaces.d.ts

@@ -28,3 +28,37 @@ export interface CrudFormField extends FieldProperties {
      */
     operation: CrudOperations;
 }
+/**
+ * @description Interface for defining a page/step in a multi-step form or wizard
+ * @summary Provides metadata for individual pages in stepped model forms
+ * This interface represents a single page or step in a multi-step form workflow.
+ * It allows defining optional title and description metadata for each page,
+ * which can be used to display step indicators, progress bars, or navigation labels.
+ * Used in conjunction with the @uisteppedmodel decorator.
+ *
+ * @interface IPagedComponentProperties
+ * @memberOf module:ui-decorators
+ *
+ * @property {string} [title] - Optional title for the page/step (e.g., "Personal Information")
+ * @property {string} [description] - Optional description providing additional context for the page
+ *
+ * @example
+ * // Define pages for a multi-step wizard
+ * const wizardPages: IPagedComponentProperties[] = [
+ *   { title: 'Personal Info', description: 'Enter your basic details' },
+ *   { title: 'Contact', description: 'Provide your contact information' },
+ *   { title: 'Review', description: 'Review and confirm your information' }
+ * ];
+ *
+ * @uisteppedmodel('div', wizardPages, true)
+ * class RegistrationWizard extends Model {
+ *   // Properties with @uipageprop decorators
+ * }
+ */
+export interface IPagedComponentProperties {
+    title?: string;
+    description?: string;
+    pages?: number | IPagedComponentProperties[];
+    rows?: number | string[];
+    cols?: number | string[];
+}

package/lib/ui/types.d.ts

@@ -86,7 +86,8 @@ export interface FieldProperties {
     multiple?: boolean;
     customTypes?: string | string[];
     options?: Record<string, unknown>[];
-    pages?: number;
+    row?: number;
+    col?: number;
     page?: number;
     [UIKeys.EQUALS]?: string;
     [UIKeys.DIFF]?: string;
@@ -131,10 +132,10 @@ export type UIListPropMetadata = {
     props: Record<string, any>;
 };
 /**
- * @typedef UIListItemModelMetadata
+ * @typedef UIListModelMetadata
  * @memberOf module:ui-decorators
  */
-export type UIListItemModelMetadata = {
+export type UIListModelMetadata = {
     item: UIListItemElementMetadata;
 };
 /**
@@ -152,8 +153,8 @@ export type UIListItemElementMetadata = {
  */
 export type UILayoutMetadata = {
     props: {
-        cols?: number | string[];
-        rows?: number;
+        cols?: number;
+        rows?: number | string[];
         props?: Record<string, any>;
     };
 };
@@ -161,16 +162,22 @@ export type UILayoutMetadata = {
  * @typedef UIClassMetadata
  * @memberOf module:ui-decorators
  */
-export type UIClassMetadata = UILayoutMetadata | UIModelMetadata | UIListItemModelMetadata;
+export type UIClassMetadata = UILayoutMetadata | UIModelMetadata | UIListModelMetadata;
 /**
- * @typedef UILayoutItemMetadata
+ * @typedef UILayoutCol
  * @memberOf ui-decorators.ui.decorators
  */
-export type UILayoutItemMetadata = {
+export type UILayoutCol = number | 'half' | 'full' | 'auto' | 'expand';
+/**
+ * @typedef UILayoutPropMetadata
+ * @memberOf ui-decorators.ui.decorators
+ */
+export type UILayoutPropMetadata = {
     name: string;
-    props: Record<string, any>;
-    col: number | string[];
-    row: number | string[];
+    props: Record<string, any> & {
+        col: UILayoutCol;
+        row: number | string[];
+    };
 };
 /**
  * @typedef UIMediaBreakPoints

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decaf-ts/ui-decorators",
-  "version": "0.5.27",
+  "version": "0.5.29",
   "description": "Extension of decorator validation to ui elements to allow for web integration",
   "type": "module",
   "exports": {
@@ -63,8 +63,16 @@
     "components",
     "forms",
     "validation",
+    "layouts",
+    "response",
+    "automatic",
     "react",
     "angular",
+    "vue",
+    "ionic",
+    "nextjs",
+    "web",
+    "mobile",
     "dynamic-ui"
   ],
   "author": "Tiago Venceslau and Contributors",
@@ -74,39 +82,12 @@
   },
   "homepage": "https://github.com/decaf-ts/ui-decorators#readme",
   "devDependencies": {
-    "@decaf-ts/logging": "latest",
-    "@decaf-ts/utils": "latest",
-    "@eslint/js": "^9.25.1",
-    "@stylistic/eslint-plugin": "^4.2.0",
-    "@types/jest": "^29.5.14",
-    "clean-publish": "^5.1.0",
-    "dpdm": "^3.14.0",
-    "eslint": "^9.25.1",
-    "eslint-config-prettier": "^10.1.2",
-    "eslint-plugin-prettier": "^5.2.6",
-    "globals": "^16.0.0",
-    "jest": "^29.7.0",
-    "jest-html-reporters": "^3.1.7",
-    "jest-junit": "^16.0.0",
-    "jsdoc": "^4.0.4",
-    "jsdoc-mermaid": "^1.0.0",
-    "markdown-include": "^0.4.3",
-    "minimist": "^1.2.8",
-    "nodemon": "^3.1.9",
-    "npm-check-updates": "^18.0.0",
-    "prettier": "3.5.3",
-    "rimraf": "^6.0.1",
-    "ts-jest": "^29.3.2",
-    "ts-loader": "^9.5.2",
-    "ts-node": "^10.9.2",
-    "typescript": "^5.8.3",
-    "typescript-eslint": "^8.31.0"
+    "@decaf-ts/utils": "latest"
   },
-  "peerDependencies": {
+  "dependencies": {
     "@decaf-ts/db-decorators": "latest",
     "@decaf-ts/decoration": "latest",
     "@decaf-ts/decorator-validation": "latest",
-    "@decaf-ts/reflection": "latest",
-    "reflect-metadata": "^0.2.1"
+    "@decaf-ts/reflection": "latest"
   }
 }