@open-xamu-co/ui-common-types 4.0.0-next.1 → 4.0.0-next.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-xamu-co/ui-common-types",
-  "version": "4.0.0-next.1",
+  "version": "4.0.0-next.10",
   "description": "Xamu shared types",
   "author": "@xamu-co",
   "main": "src/index.ts",
@@ -31,13 +31,13 @@
     "build:legacy": "rimraf dist && tsc --outDir dist --declaration --emitDeclarationOnly"
   },
   "dependencies": {
-    "@open-xamu-co/ui-common-enums": "^3.1.0-next.1",
+    "@open-xamu-co/ui-common-enums": "^4.0.0-next.4",
     "@fortawesome/fontawesome-common-types": "^6.4.0",
     "sweetalert2": "^11.11.1"
   },
   "engines": {
-    "node": ">=20.19.3",
-    "yarn": ">=1.22.4"
+    "node": ">=22.22.2",
+    "yarn": ">=1.22.22"
   },
   "browserslist": [
     "defaults"

package/src/fetch.ts

@@ -3,28 +3,44 @@ export type tOrder = "desc" | "asc";
 /**
  * Order using column or property
  *
- * @example [["id", "asc" ]], order ascendente de id
- * @example [["id", "desc" ]] or [["id"]], order descendente de id
+ * @example ["id", "asc" ], order ascendente de id
+ * @example ["id", "desc" ] or ["id"], order descendente de id
  */
 export type tOrderBy = [string, tOrder?];
 
 export interface iPageEdge<T, C extends string | number = string> {
 	cursor: C;
+	/** Node data */
 	node: T;
 }
 
 export interface iPageInfo<C extends string | number = string> {
 	nextCursor?: C;
 	previousCursor?: C;
+	/**
+	 * Current page number
+	 * According to the "at" and "first" parameters
+	 */
 	pageNumber?: number;
+	/** There is a next page */
 	hasNextPage: boolean;
+	/** There is a previous page */
 	hasPreviousPage: boolean;
+	/** Current page path */
 	path?: string;
 }
 
 export interface iPage<T, C extends string | number = string> {
+	/**
+	 * List of nodes with cursor data for the current page
+	 * Amount of nodes is limited by the "first" parameter
+	 */
 	edges: iPageEdge<T, C>[];
 	pageInfo: iPageInfo<C>;
+	/**
+	 * Count of nodes matching the path
+	 * Independent of pagination
+	 */
 	totalCount: number;
 }
 
@@ -39,9 +55,16 @@ export interface iPagination {
 	 * Cantidad de elementos por pagina (limite)
 	 */
 	first?: number;
+	/**
+	 * Order using column or property
+	 *
+	 * @example [["id", "asc" ]], order ascendente de id
+	 * @example [["id", "desc" ]] or [["id"]], order descendente de id
+	 */
 	orderBy?: tOrderBy[];
 }
 
 export type iGetPage<T, C extends string | number = string> = (
-	params?: iPagination
+	params?: iPagination,
+	signal?: AbortSignal
 ) => Promise<iPage<T, C> | undefined>;

package/src/files.ts

@@ -1,5 +1,24 @@
+import type { eMimeType } from "@open-xamu-co/ui-common-enums";
+
 export interface iMime {
+	/**
+	 * Mime type
+	 * @example image/jpeg
+	 */
 	mime: string;
+	/**
+	 * Pattern to match
+	 * @example [0xff, 0xd8, 0xff]
+	 */
 	pattern: number[];
+	/**
+	 * Mask to match
+	 * @example [0xff, 0xff, 0xff]
+	 */
 	mask: number[];
+	/**
+	 * Mime type range
+	 * @example eMimeType.IMAGE
+	 */
+	type: eMimeType;
 }

package/src/form/class.ts

@@ -7,11 +7,12 @@ import type {
 import type {
 	iFormInput,
 	iFormInputDefault,
+	iFormOption,
 	iFormValue,
 	tFormAutocomplete,
 	tFormIcon,
+	tOptionsLoaderFn,
 } from "./types";
-import type { iSelectOption } from "../values.js";
 
 export declare abstract class tFormInputDefault<
 	T extends eFormTypeBase | eFormTypeSimple | eFormTypeComplex = eFormTypeSimple,
@@ -31,12 +32,10 @@ export declare abstract class tFormInputDefault<
 	public setRerender(rerender: (fi?: Partial<iFormInputDefault<T>>) => void): this;
 }
 
-export declare class tFormInput<
+export declare abstract class tFormInput<
 	V extends iFormValue | iFormValue[] = iFormValue | iFormValue[],
 	T extends eFormTypeBase | eFormTypeSimple | eFormTypeComplex =
-		| eFormTypeBase
-		| eFormTypeSimple
-		| eFormTypeComplex,
+		eFormTypeBase | eFormTypeSimple | eFormTypeComplex,
 >
 	extends tFormInputDefault<T>
 	implements iFormInput<V, T>
@@ -44,11 +43,13 @@ export declare class tFormInput<
 	// public readonly
 	public readonly name: string;
 	public readonly title?: string;
-	public readonly multiple: boolean;
-	public readonly min: number;
-	public readonly max: number;
+	public readonly optionsFilter?: tOptionsLoaderFn;
 	// public
-	public options: iSelectOption[];
+	public multiple: boolean;
+	public min: number;
+	public max: number;
+	public meta?: Record<string, any>;
+	public options: iFormOption[];
 	public values: V[];
 	public defaults?: [
 		iFormInputDefault<eFormTypeBase | eFormTypeSimple | eFormTypeComplex>,

package/src/form/types.ts

@@ -34,7 +34,17 @@ export interface iFormResults<T = Record<string, unknown>> {
 	invalidInputs: iInvalidInput[];
 }
 
-export type tTextInputType = "text" | "email" | "password" | "search" | "url" | "number" | "tel";
+export type tTextInputType =
+	| "text"
+	| "email"
+	| "password"
+	| "search"
+	| "url"
+	| "number"
+	| "tel"
+	| "date"
+	| "datetime-local"
+	| "time";
 
 export type tFormAutocomplete =
 	| "off"
@@ -113,15 +123,29 @@ export interface iFormInputDefault<
 	autocomplete?: tFormAutocomplete;
 }
 
+export type tOptionsLoaderFn =
+	| ((v?: string | number, signal?: AbortSignal) => iFormOption[])
+	| ((v?: string | number, signal?: AbortSignal) => Promise<iFormOption[]>);
+
+/** If a function is given, it should be responsible of determining if v is a value or an alias (search) */
+export type iFormInputOptions = (string | number | iFormOption)[] | tOptionsLoaderFn;
+
 /**
  * Complex input, sub input support
+ * Used as input for the classes
  */
 export interface iFormInput<
 	V extends iFormValue | iFormValue[],
 	T extends eFormTypeBase | eFormTypeSimple | eFormTypeComplex,
 > extends iFormInputDefault<T> {
 	name: string;
-	options?: (string | number | iFormOption)[];
+	/**
+	 * Options for select, checkbox, radio inputs
+	 * The usage of a function requires a compatible component (SelectFilter)
+	 *
+	 * @values array of options or function that returns options
+	 */
+	options?: iFormInputOptions;
 	/**
 	 * An array of values to simplify validation
 	 *
@@ -152,6 +176,10 @@ export interface iFormInput<
 	 * if multiple is set to true this optional value would be the mandatory maximun amount of values
 	 */
 	max?: number;
+	/**
+	 * Additional input metadata
+	 */
+	meta?: Record<string, any>;
 }
 
 /**
@@ -185,6 +213,13 @@ export interface iFetchResponse<R = any> {
 	[x: string]: any;
 }
 
+/**
+ * Takes the parsed inputs values and perform a request (content creation, update, etc).
+ *
+ * @param values Values of the input
+ * @param fetcher Request function
+ * @returns Response with data and errors if any
+ */
 export type tResponseFn<T, V extends Record<string, any> = Record<string, any>> = (
 	values: V
 ) => Promise<iFetchResponse<T>>;

package/src/locale.ts

@@ -109,10 +109,14 @@ export type tLocaleInput = {
 		file_limit: string;
 		/** @example "This field only allows {amount} file | This field only allows {amount} files" */
 		file_limit_text: string;
+		/** @example "Unsupported format" */
+		file_unsupported_format: string;
+		/** @example "This field only does not allow that file type" */
+		file_unsupported_format_text: string;
 		/** @example "Wrong format" */
-		file_wrong_format_image: string;
-		/** @example "This field only allows image files" */
-		file_wrong_format_image_text: string;
+		file_wrong_format: string;
+		/** @example "This field only allows "{types}" files" */
+		file_wrong_format_text: string;
 		/** @example "File too big" */
 		file_too_big: string;
 		/** @example "The file exceeds the allowed size" */
@@ -176,6 +180,12 @@ export type tLocaleForm = {
 	form_cellphone: string;
 	/** @example "ID number" */
 	form_id_number: string;
+	/** @example "Date" */
+	form_date: string;
+	/** @example "Date & time" */
+	form_datetime: string;
+	/** @example "Time" */
+	form_time: string;
 	/** @example "Complete the field" */
 	form_complete_the_field: string;
 	/** @example "Location" */
@@ -198,6 +208,18 @@ export type tLocaleForm = {
 	form_no_values: string;
 	/** @example "New value" */
 	form_new_value: string;
+	/** @example "Rendered text" */
+	form_editor_preview: string;
+	/** @example "See rendered text" */
+	form_editor_see_preview: string;
+	/** @example "Bold" */
+	form_editor_bold: string;
+	/** @example "Italic" */
+	form_editor_italic: string;
+	/** @example "Link" */
+	form_editor_link: string;
+	/** @example "Add URL" */
+	form_editor_link_add_url: string;
 	// swal: {};
 };
 

package/src/plugin.ts

@@ -7,19 +7,7 @@ export type tComponent = (typeof componentNames)[number];
 export type tLogger = (at: string, ...logs: unknown[]) => any;
 
 export type tSupportedLangs =
-	| "kr"
-	| "pt"
-	| "nl"
-	| "hr"
-	| "fa"
-	| "de"
-	| "es"
-	| "en"
-	| "fr"
-	| "ja"
-	| "it"
-	| "cn"
-	| "tr";
+	"kr" | "pt" | "nl" | "hr" | "fa" | "de" | "es" | "en" | "fr" | "ja" | "it" | "cn" | "tr";
 
 export interface iPluginOptions<ComponentType = unknown> {
 	/**

package/src/values.ts

@@ -11,9 +11,23 @@ export interface iSelectOption {
  *
  * Action result, event and callback
  */
-export type iNodeFnResponse<T extends Record<string, any> = never> = [
-	(boolean | T)?,
-	Event?,
+export type iNodeFnResponse<
+	T extends Record<string, any> = never,
+	E extends Record<string, any> = Record<string, any>,
+> = [(boolean | T)?, (Event & Partial<CustomEvent<E>>)?, (() => void)?];
+
+/**
+ * Stream like response from node functions
+ *
+ * Action result, event and callback
+ * Can accept an stream like array for multiple updates (hydration)
+ */
+export type iNodeFnResponseStream<
+	T extends Record<string, any> = never,
+	E extends Record<string, any> = Record<string, any>,
+> = [
+	(boolean | T | [boolean | T, ...Promise<boolean | T>[]])?,
+	(Event & Partial<CustomEvent<E>>)?,
 	(() => void)?,
 ];
 
@@ -30,6 +44,23 @@ export type iNodeFn<T extends Record<string, any>, Ta extends [T?, ...any[]] = [
 	...args: Ta
 ) => boolean | undefined | iNodeFnResponse<T> | Promise<boolean | undefined | iNodeFnResponse<T>>;
 
+/**
+ * Funtions that uses a node and perform some action
+ *
+ * Useful for table actions like creating, updating and deleting nodes
+ *
+ * Undefined would mean no action was performed
+ * True or an T type object would mean action was performed successfully
+ * False would mean action failed
+ */
+export type iNodeStreamFn<T extends Record<string, any>, Ta extends [T?, ...any[]] = [T]> = (
+	...args: Ta
+) =>
+	| boolean
+	| undefined
+	| iNodeFnResponseStream<T>
+	| Promise<boolean | undefined | iNodeFnResponseStream<T>>;
+
 /**
  * Used on Table and related components
  *
@@ -41,6 +72,11 @@ export interface iProperty<
 	P extends Record<string, any> = Record<string, any>,
 	ComponentType = unknown,
 > extends iSelectOption {
+	/**
+	 * Prefer to use the node's id instead of the value
+	 * Useful for object like properties
+	 */
+	preferId?: boolean;
 	/**
 	 * Function to create a node within the relation
 	 * The parent is given since the node doesn't exist yet
@@ -88,4 +124,7 @@ export interface iProperty<
 	onImageError?: (data?: any) => void;
 }
 
+/**
+ * Function to order properties
+ */
 export type tPropertyOrderFn = (a: [string, any], b: [string, any]) => -1 | 0 | 1;