@open-xamu-co/ui-common-types 3.0.0-next.2 → 3.0.0-next.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-xamu-co/ui-common-types",
-  "version": "3.0.0-next.2",
+  "version": "3.0.0-next.21",
   "description": "Xamu shared types",
   "author": "@xamu-co",
   "main": "src/index.ts",
@@ -32,8 +32,8 @@
   },
   "dependencies": {
     "@fortawesome/fontawesome-common-types": "^6.4.0",
-    "@open-xamu-co/ui-common-enums": "^2.0.1-next.1",
-    "sweetalert2": "^11.7.5"
+    "@open-xamu-co/ui-common-enums": "^3.0.0-next.6",
+    "sweetalert2": "^11.11.1"
   },
   "engines": {
     "node": ">=18",

package/src/fetch.ts

@@ -1,6 +1,12 @@
-import type { eOrders } from "@open-xamu-co/ui-common-enums";
+export type tOrder = "desc" | "asc";
 
-export type tOrderBy = [string, ("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;
@@ -21,7 +27,7 @@ export interface iPage<T, C extends string | number = string> {
 	totalCount: number;
 }
 
-export interface iPagination<O extends tOrderBy | Record<string, eOrders> = tOrderBy> {
+export interface iPagination {
 	/**
 	 * Identificador del elemento donde empieza la paginacion
 	 *
@@ -32,21 +38,9 @@ export interface iPagination<O extends tOrderBy | Record<string, eOrders> = tOrd
 	 * 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?: O;
+	orderBy?: tOrderBy[];
 }
 
-/**
- * Hydrate fetch ref (no refresh)
- */
-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

@@ -1,6 +1,6 @@
 import type { IconName } from "@fortawesome/fontawesome-common-types";
 
-import { eFormTypeComplex, eFormTypeSimple } from "@open-xamu-co/ui-common-enums";
+import { eFormTypeBase, eFormTypeComplex, eFormTypeSimple } from "@open-xamu-co/ui-common-enums";
 
 import type { iSelectOption } from "./values.js";
 
@@ -95,43 +95,37 @@ export type iFormIconProps = { brand?: boolean; regular?: boolean };
 
 export type tFormIcon = [IconName | undefined, iFormIconProps];
 
-export type iFormValue = string | number | boolean | File;
+export type iFormValue = string | number | boolean | File | Date;
 
 /**
  * Simple input
  */
-export interface iFormInputDefault<T extends eFormTypeSimple | eFormTypeComplex = eFormTypeSimple> {
+export interface iFormInputDefault<
+	T extends eFormTypeBase | eFormTypeSimple | eFormTypeComplex = eFormTypeSimple,
+> {
 	required?: boolean;
 	type?: T;
-	options?: (string | number | iFormOption)[];
 	/**
 	 * 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;
 }
 
 /**
  * Complex input, sub input support
  */
-export interface iFormInput<V extends iFormValue = iFormValue>
-	extends iFormInputDefault<eFormTypeSimple | eFormTypeComplex> {
+export interface iFormInput<V extends iFormValue = iFormValue, Vk extends V | V[] = V | V[]>
+	extends iFormInputDefault<eFormTypeBase | eFormTypeSimple | eFormTypeComplex> {
 	name: string;
+	options?: (string | number | iFormOption)[];
 	/**
 	 * An array of values to simplify validation
 	 *
 	 * @old value
 	 */
-	values?: (V | V[])[];
+	values?: Vk[];
 	defaults?: [iFormInputDefault, iFormInputDefault, ...iFormInputDefault[]];
 	/**
 	 * Visible over the field, should describe it
@@ -144,12 +138,20 @@ 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, T = any> {
+export interface iFormResponse<R = any> {
 	response?: R;
 	invalidInputs: iInvalidInput[];
 	/**
@@ -169,10 +171,6 @@ export interface iFormResponse<R = any, T = any> {
 	 * 401 will be reported but not failed
 	 */
 	errors?: any;
-	/**
-	 * Swal target
-	 */
-	modalTarget?: T;
 }
 
 export interface iFetchResponse<R = any> {

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,21 +192,27 @@ 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}\"" */
 	table_see_name: string;
 	/** @example "Create new" */
 	table_create_new: string;
+	/** @example "Crear nuevo" */
+	table_create_new_name: string;
 	/** @example "Quantity: {count} */
 	table_quantity: string;
 	/** @example "Modify" */
@@ -221,6 +239,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;
@@ -247,54 +269,29 @@ export interface iLocaleTable {
 		/** @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" */
 	pagination_pages: string;
-	/** @example "Order: relevance" */
-	pagination_order_relevance: string;
-	/** @example "Order: more recent" */
-	pagination_order_recent: string;
-	/** @example "Order: more older" */
-	pagination_order_older: string;
-	/** @example "Order: lower price" */
-	pagination_order_expensive: string;
-	/** @example "Order: high price" */
-	pagination_order_cheaper: string;
-	/** @example "Order: alphabetically (Asc.)" */
-	pagination_order_az: string;
-	/** @example "Order: alphabetically (Desc.)" */
-	pagination_order_za: string;
-	/** @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

@@ -4,6 +4,7 @@ import type { tPluginLocale } from "./locale.js";
 import type { SweetAlertOptions } from "sweetalert2";
 
 export type tComponent = (typeof componentNames)[number];
+export type tLogger = (at: string, ...logs: unknown[]) => any;
 
 export type tSupportedLangs =
 	| "kr"
@@ -98,6 +99,7 @@ export interface iPluginOptions<ComponentType = unknown> {
 		overrides?: SweetAlertOptions;
 		preventOverrides?: SweetAlertOptions;
 		loaderOverrides?: SweetAlertOptions;
+		toastOverrides?: SweetAlertOptions;
 	};
 	/**
 	 * Iso2 code for the default country
@@ -105,6 +107,15 @@ export interface iPluginOptions<ComponentType = unknown> {
 	 * When a country is provided forms will omit that field
 	 */
 	country?: string;
+	/**
+	 * Countries API base endpoint (full URL)
+	 *
+	 * If using nuxt, get better performance with the module
+	 * @see https://www.npmjs.com/package/nuxt-countries-api
+	 *
+	 * @default "https://countries.xamu.com.co/api/v1"
+	 */
+	countriesUrl?: string;
 	/**
 	 * Disable automatic animations
 	 *
@@ -123,4 +134,10 @@ export interface iPluginOptions<ComponentType = unknown> {
 	 * @default 10
 	 */
 	first?: number;
+	/**
+	 * Logger function for debugging purposes
+	 *
+	 * @default console.log
+	 */
+	logger?: tLogger;
 }

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

@@ -1,15 +1,22 @@
 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 = typeof DefaultSwal & {
-	firePrevent: <T = unknown>(
-		options?: SweetAlertOptions
-	) => Promise<SweetAlertResult<Awaited<T>>>;
+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>>>;
+	fireToast: <T = any>(options?: tSwalOptions) => Promise<SweetAlertResult<Awaited<T>>>;
 	firePreventDefaults: SweetAlertOptions;
-	fireLoader: <T = unknown>(options?: SweetAlertOptions) => Promise<SweetAlertResult<Awaited<T>>>;
 	fireLoaderDefaults: SweetAlertOptions;
+	fireToastDefaults: SweetAlertOptions;
 };

package/src/values.ts

@@ -2,23 +2,53 @@ export interface iSelectOption {
 	value: string | number;
 	alias?: string;
 	selected?: boolean;
+	disabled?: boolean;
 }
 
+export type iNodeFnResponse = [boolean?, Event?, (() => void)?];
+
 /**
  * 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>> = (
-	n: T
-) => boolean | undefined | Promise<boolean | undefined>;
+export type iNodeFn<T extends Record<string, any>, Ta extends [T?, ...any[]] = [T]> = (
+	...args: Ta
+) => boolean | undefined | iNodeFnResponse | Promise<boolean | undefined | iNodeFnResponse>;
 
 /**
  * used on FactoryTable and related components
  */
-export interface iProperty<T extends Record<string, any>> extends iSelectOption {
+export interface iProperty<
+	T extends Record<string, any> = Record<string, any>,
+	P extends Record<string, any> = Record<string, any>,
+	ComponentType = unknown,
+> extends iSelectOption {
 	/**
 	 * Function to create a node within the relation
+	 * The parent is given since the node doesn't exist yet
+	 */
+	createNode?: iNodeFn<P, [P?]>;
+	/**
+	 * Conditionally disable creating children for this particular property
+	 */
+	disableCreateNode?: (p: P) => boolean;
+	/**
+	 * Function to clone a node within the relation
+	 */
+	cloneNode?: iNodeFn<T, [T?]>;
+	/**
+	 * Function to update a node within the relation
+	 */
+	updateNode?: iNodeFn<T, [T?, P?]>;
+	/**
+	 * Function to delete a node within the relation
 	 */
-	createNode?: (n?: T) => boolean | undefined | Promise<boolean | undefined>;
+	deleteNode?: iNodeFn<T, [T?]>;
+	/**
+	 * Render using this component instead
+	 */
+	component?: ComponentType;
 }
+
+export type tPropertyOrderFn = (a: [string, any], b: [string, any]) => -1 | 0 | 1;