@open-xamu-co/ui-common-types 2.1.0 → 3.0.0-next.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-xamu-co/ui-common-types",
-  "version": "2.1.0",
+  "version": "3.0.0-next.10",
   "description": "Xamu shared types",
   "author": "@xamu-co",
   "main": "src/index.ts",
@@ -31,10 +31,8 @@
     "build:legacy": "rimraf dist && tsc --outDir dist --declaration --emitDeclarationOnly"
   },
   "dependencies": {
-    "@open-xamu-co/ui-common-enums": "^2.0.0"
-  },
-  "devDependencies": {
     "@fortawesome/fontawesome-common-types": "^6.4.0",
+    "@open-xamu-co/ui-common-enums": "^3.0.0-next.2",
     "sweetalert2": "^11.7.5"
   },
   "engines": {

package/src/fetch.ts

@@ -1,19 +1,29 @@
-export type tOrderBy = [string, ("desc" | "asc")?];
+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
+ */
+export type tOrderBy = [string, tOrder?];
 
 export interface iPageEdge<T, C extends string | number = string> {
 	cursor: C;
 	node: T;
 }
 
+export interface iPageInfo<C extends string | number = string> {
+	nextCursor?: C;
+	previousCursor?: C;
+	hasNextPage: boolean;
+	hasPreviousPage: boolean;
+	path?: string;
+}
+
 export interface iPage<T, C extends string | number = string> {
 	edges: iPageEdge<T, C>[];
-	pageInfo: {
-		nextCursor?: C;
-		previousCursor?: C;
-		hasNextPage: boolean;
-		hasPreviousPage: boolean;
-		path?: string;
-	};
+	pageInfo: iPageInfo<C>;
 	totalCount: number;
 }
 
@@ -28,13 +38,7 @@ export interface iPagination {
 	 * Cantidad de elementos (limite)
 	 */
 	first?: number;
-	/**
-	 * JSON string
-	 * aplica a cualquiera columna
-	 * ej: ["id", "asc" ], order ascendente de id
-	 * ej: ["id", "desc" ], order descendente de id
-	 */
-	orderBy?: tOrderBy;
+	orderBy?: tOrderBy[];
 }
 
 /**
@@ -43,6 +47,5 @@ export interface iPagination {
 export type tHydrate<T> = (c: T, e?: unknown) => void;
 
 export type iGetPage<T, C extends string | number = string> = (
-	hydrate: tHydrate<iPage<T, C> | null>,
 	params?: iPagination
-) => Promise<iPage<T, C>>;
+) => Promise<iPage<T, C> | undefined>;

package/src/form.ts

@@ -2,10 +2,9 @@ import type { IconName } from "@fortawesome/fontawesome-common-types";
 
 import { eFormTypeComplex, eFormTypeSimple } from "@open-xamu-co/ui-common-enums";
 
-export interface iSelectOption {
-	value: string | number;
-	alias?: string;
-	selected?: boolean;
+import type { iSelectOption } from "./values.js";
+
+export interface iFormOption extends iSelectOption {
 	/**
 	 * Font awesome icon
 	 */
@@ -17,7 +16,7 @@ export interface iSelectOption {
 	placeholder?: string;
 }
 
-export interface iIndicative extends iSelectOption {
+export interface iIndicative extends iFormOption {
 	code: string;
 	number: number;
 }
@@ -104,21 +103,12 @@ export type iFormValue = string | number | boolean | File;
 export interface iFormInputDefault<T extends eFormTypeSimple | eFormTypeComplex = eFormTypeSimple> {
 	required?: boolean;
 	type?: T;
-	options?: (string | number | iSelectOption)[];
 	/**
 	 * String without the dots
 	 */
 	placeholder?: string;
 	icon?: IconName | tFormIcon;
 	autocomplete?: tFormAutocomplete;
-	/**
-	 * if muliple is set to true this optional value would be the required minimun amount of values
-	 */
-	min?: number;
-	/**
-	 * if multiple is set to true this optional value would be the mandatory maximun amount of values
-	 */
-	max?: number;
 }
 
 /**
@@ -127,6 +117,7 @@ export interface iFormInputDefault<T extends eFormTypeSimple | eFormTypeComplex
 export interface iFormInput<V extends iFormValue = iFormValue>
 	extends iFormInputDefault<eFormTypeSimple | eFormTypeComplex> {
 	name: string;
+	options?: (string | number | iFormOption)[];
 	/**
 	 * An array of values to simplify validation
 	 *
@@ -145,4 +136,47 @@ export interface iFormInput<V extends iFormValue = iFormValue>
 	 * Ex: { multiple: true, min:3, max:3 } would make 3 values a requirement
 	 */
 	multiple?: boolean;
+	/**
+	 * if muliple is set to true this optional value would be the required minimun amount of values
+	 */
+	min?: number;
+	/**
+	 * if multiple is set to true this optional value would be the mandatory maximun amount of values
+	 */
+	max?: number;
 }
+
+/**
+ * Sended form values
+ */
+export interface iFormResponse<R = any> {
+	response?: R;
+	invalidInputs: iInvalidInput[];
+	/**
+	 * If the request had any error (validation/request itself).
+	 */
+	withErrors: boolean;
+	/**
+	 * If the request had any error.
+	 */
+	requestHadErrors: boolean;
+	/**
+	 * If the validation had any error.
+	 */
+	validationHadErrors: boolean;
+	/**
+	 * Errors payload,
+	 * 401 will be reported but not failed
+	 */
+	errors?: any;
+}
+
+export interface iFetchResponse<R = any> {
+	data?: R;
+	errors?: any;
+	[x: string]: any;
+}
+
+export type tResponseFn<T, V extends Record<string, any> = Record<string, any>> = (
+	values: V
+) => Promise<iFetchResponse<T>>;

package/src/index.ts

@@ -6,3 +6,5 @@ export * from "./props.js";
 export * from "./locale.js";
 export * from "./plugin.js";
 export * from "./fetch.js";
+export * from "./swal.js";
+export * from "./values.js";

package/src/locale.ts

@@ -3,7 +3,7 @@
  *
  * @localeType
  */
-export interface iLocaleBase {
+export type tLocaleBase = {
 	/** @example "Yes" */
 	yes: string;
 	/** @example "No" */
@@ -46,12 +46,18 @@ export interface iLocaleBase {
 	pick: string;
 	/** @example "Refresh" */
 	refresh: string;
+	/** @example "Couldn't render the contents due to an unknown error" */
+	render_error: string;
 	swal: {
 		/** @example "Cancel" */
 		cancel: string;
 		/** @example "Continue" */
 		continue: string;
-		/** @example "¡Connection error!" */
+		/** @example "Error!" */
+		error: string;
+		/** @example "Something went wrong!" */
+		error_message: string;
+		/** @example "Connection error!" */
 		connection_error: string;
 		/** @example "The server is not responding. Please check your network or try again later" */
 		connection_error_message: string;
@@ -64,14 +70,16 @@ export interface iLocaleBase {
 		/** @example "Don't close this window while we finish the task" */
 		dont_close_window: string;
 	};
-}
+};
 
 /**
  * Input locale
  *
  * @localeType
  */
-export interface iLocaleInput {
+export type tLocaleInput = {
+	/** @example "Selected" */
+	select_selected: string;
 	/** @example "--SELECT--" */
 	select_placeholder: string;
 	/** @example "Restablish field" */
@@ -114,14 +122,14 @@ export interface iLocaleInput {
 		/** @example "There was an error uploding the files, try again later" */
 		file_unknown_error_text: string;
 	};
-}
+};
 
 /**
  * Modal locale
  *
  * @localeType
  */
-export interface iLocaleModal {
+export type tLocaleModal = {
 	/** @example "Taking too long?" */
 	modal_taking_too_long: string;
 	swal: {
@@ -130,18 +138,20 @@ export interface iLocaleModal {
 		/** @example "You are not allowed to perform this action" */
 		modal_unauthorized_text: string;
 	};
-}
+};
 
 /**
  * Form locale
  *
  * @localeType
  */
-export interface iLocaleForm {
+export type tLocaleForm = {
 	/** @example "Options are required" */
 	form_required_options: string;
 	/** @example "No values are required | A value is required | {count} values are required" */
 	form_requires_n_values: string;
+	/** @example "Loading countries..." */
+	form_loading_countries: string;
 	/** @example "Look for country" */
 	form_country: string;
 	/** @example "Look for state" */
@@ -168,7 +178,9 @@ export interface iLocaleForm {
 	form_complete_the_field: string;
 	/** @example "Location" */
 	form_location: string;
-	/** @example "This field is required" */
+	/** @example "This field is invalid, fill it properly" */
+	form_invalid_field: string;
+	/** @example "This field is required and can't be empty" */
 	form_required_field: string;
 	/** @example "You should use a valid E-mail address" */
 	form_use_valid_email: string;
@@ -180,15 +192,19 @@ export interface iLocaleForm {
 	form_unmatching_passwords: string;
 	/** @example "Invalid data" */
 	form_invalid_data: string;
+	/** @example "No values" */
+	form_no_values: string;
+	/** @example "New value" */
+	form_new_value: string;
 	// swal: {};
-}
+};
 
 /**
  * Table locale
  *
  * @localeType
  */
-export interface iLocaleTable {
+export type tLocaleTable = {
 	/** @example "See {name}" */
 	table_see_values: string;
 	/** @example "See: \"{name}\"" */
@@ -221,6 +237,10 @@ export interface iLocaleTable {
 	table_options: string;
 	/** @example "Open URL" */
 	table_open_url: string;
+	/** @example "Hide all" */
+	table_hide_all: string;
+	/** @example "Show all" */
+	table_show_all: string;
 	swal: {
 		/** @example "Are you sure you want to delete this element?" */
 		table_delete_node_title: string;
@@ -238,19 +258,23 @@ export interface iLocaleTable {
 		table_updated: string;
 		/** @example "The item may not have been updated | The items may not have been updated" */
 		table_possibly_not_updated: string;
+		/** @example "Successfull update" */
+		table_created: string;
+		/** @example "The item may not have been created | The items may not have been created" */
+		table_possibly_not_created: string;
 		/** @example "Successfull cloning" */
 		table_cloned: string;
 		/** @example "The item may not have been cloned | The items may not have been cloned" */
 		table_possibly_not_cloned: string;
 	};
-}
+};
 
 /**
  * Pagination locale
  *
  * @localeType
  */
-export interface iLocalePagination {
+export type tLocalePagination = {
 	/** @example "No items | Single item | {count} items" */
 	pagination_items: string;
 	/** @example "No pages | Single page | {count} pages" */
@@ -272,25 +296,16 @@ export interface iLocalePagination {
 	/** @example "Filter by:" */
 	pagination_filter_by: string;
 	// swal: {};
-}
+};
 
 /**
  * Plugin locale
  *
  * @localeType
  */
-export type tPluginLocale = iLocaleBase &
-	iLocaleInput &
-	iLocaleModal &
-	iLocaleForm &
-	iLocaleTable &
-	iLocalePagination;
-
-/**
- * Plugin locale key union
- *
- * @localeType
- */
-export type tPluginLocaleKey =
-	| Exclude<keyof tPluginLocale, "swal">
-	| `swal.${keyof Required<tPluginLocale>["swal"]}`;
+export type tPluginLocale = tLocaleBase &
+	tLocaleInput &
+	tLocaleModal &
+	tLocaleForm &
+	tLocaleTable &
+	tLocalePagination;

package/src/plugin.ts

@@ -105,6 +105,17 @@ export interface iPluginOptions<ComponentType = unknown> {
 	 * When a country is provided forms will omit that field
 	 */
 	country?: string;
+	/**
+	 * Countries API base endpoint
+	 *
+	 * If using nuxt, get better performance with the module
+	 * @see https://www.npmjs.com/package/nuxt-countries-api
+	 *
+	 * Using an absolute path will enable the module
+	 *
+	 * @default "https://countries.xamu.com.co/api/v1"
+	 */
+	countriesUrl?: string;
 	/**
 	 * Disable automatic animations
 	 *

package/src/props.ts

@@ -1,3 +1,5 @@
 export type tProp<T extends string = string> = T | Record<T, boolean>;
 export type tProps<T extends string = string> = tProp<T> | tProp<T>[];
 export type tPropsModifier<T extends string = string> = boolean | tProps<T>;
+
+export type tIndicative = `${string}+${number}`;

package/src/styles.ts

@@ -1,4 +1,4 @@
-import { eColors } from "@open-xamu-co/ui-common-enums";
+import { eSizes, eColors } from "@open-xamu-co/ui-common-enums";
 
 /**
  * Union of supported colors.
@@ -6,3 +6,8 @@ import { eColors } from "@open-xamu-co/ui-common-enums";
  */
 export type tThemeModifier = (typeof eColors)[keyof typeof eColors]; // to union
 export type tThemeTuple = [tThemeModifier, tThemeModifier?];
+
+/**
+ * Allowed sizes
+ */
+export type tSizeModifier = (typeof eSizes)[keyof typeof eSizes]; // to union

package/src/swal.ts

@@ -0,0 +1,20 @@
+import DefaultSwal, { type SweetAlertOptions, type SweetAlertResult } from "sweetalert2";
+
+export type tSwalOptions = Omit<SweetAlertOptions, "target"> & {
+	target?: SweetAlertOptions["target"] | Event;
+};
+
+/**
+ * Extended SweetAlert2 class
+ *
+ * Defaults should use Event as target
+ *
+ * Do not deestructure this
+ */
+export type tSwal = Omit<typeof DefaultSwal, "fire"> & {
+	fire: <T = any>(options?: tSwalOptions) => Promise<SweetAlertResult<Awaited<T>>>;
+	firePrevent: <T = any>(options?: tSwalOptions) => Promise<SweetAlertResult<Awaited<T>>>;
+	fireLoader: <T = any>(options?: tSwalOptions) => Promise<SweetAlertResult<Awaited<T>>>;
+	firePreventDefaults: SweetAlertOptions;
+	fireLoaderDefaults: SweetAlertOptions;
+};

package/src/values.ts

@@ -0,0 +1,37 @@
+export interface iSelectOption {
+	value: string | number;
+	alias?: string;
+	selected?: boolean;
+}
+
+/**
+ * Funtions that uses a node and perform some action
+ *
+ * Useful for table actions like creating, updating and deleting nodes
+ */
+export type iNodeFn<T extends Record<string, any>, Ta extends [T?] = [T]> = (
+	...args: Ta
+) => boolean | undefined | Promise<boolean | undefined>;
+
+/**
+ * used on FactoryTable and related components
+ */
+export interface iProperty<T extends Record<string, any> = Record<string, any>>
+	extends iSelectOption {
+	/**
+	 * Function to create a node within the relation
+	 */
+	createNode?: iNodeFn<T, [T?]>;
+	/**
+	 * Function to clone a node within the relation
+	 */
+	cloneNode?: iNodeFn<T, [T?]>;
+	/**
+	 * Function to update a node within the relation
+	 */
+	updateNode?: iNodeFn<T, [T?]>;
+	/**
+	 * Function to delete a node within the relation
+	 */
+	deleteNode?: iNodeFn<T, [T?]>;
+}