kmod-cli 1.7.1 → 1.7.3

package/README.md

@@ -38,69 +38,70 @@ npx kumod add --all # add all component
 npx kumod add button # add button component
 #...any other command
 ```
-## Components
-
-- access-denied
-- api-service
-- breadcumb
-- button
-- calculate
-- calendar
-- color-by-text
-- column-table
-- config
-- count-down
-- count-input
-- data-table
-- date-input
-- date-range-picker
-- datetime-picker
-- fade-on-scroll
-- feature-config
-- feature-guard
-- gradient-outline
-- gradient-svg
-- grid-layout
-- hash-aes
-- hydrate-guard
-- idb
-- image
-- input
-- keys
-- kookies
-- label
-- lib
-- list-map
-- loader-slash-gradient
-- masonry-gallery
-- modal
-- multi-select
-- non-hydration
-- period-input
-- popover
-- portal
-- query
-- rbac
-- readme
-- refine-provider
-- safe-action
-- segments-circle
-- select
-- simple-validate
-- single-select
-- spam-guard
-- storage
-- stripe-effect
-- stroke-circle
-- switch
-- table
-- text-hover-effect
-- time-picker
-- time-picker-input
-- time-picker-utils
-- timout-loader
-- toast
-- utils
+## Components
+
+- access-denied
+- api-service
+- breadcumb
+- button
+- calculate
+- calendar
+- color-by-text
+- column-table
+- config
+- count-down
+- count-input
+- data-table
+- date-input
+- date-range-picker
+- datetime-picker
+- fade-on-scroll
+- feature-config
+- feature-guard
+- gradient-outline
+- gradient-svg
+- grid-layout
+- hash-aes
+- hydrate-guard
+- idb
+- image
+- input
+- keys
+- kookies
+- label
+- lib
+- list-map
+- loader-slash-gradient
+- masonry-gallery
+- modal
+- multi-select
+- non-hydration
+- period-input
+- popover
+- portal
+- query
+- rbac
+- readme
+- refine-provider
+- safe-action
+- segments-circle
+- select
+- simple-validate
+- single-select
+- spam-guard
+- storage
+- stripe-effect
+- stroke-circle
+- switch
+- table
+- text-hover-effect
+- time-picker
+- time-picker-input
+- time-picker-utils
+- timout-loader
+- toast
+- utils
+
 ## Contributing
 
 Contributions are welcome! Please open issues or pull requests.

package/component-templates/utils/validator/simple-validate.ts

@@ -67,7 +67,7 @@ export const REGEXS = {
    */
   text: /^[a-zA-ZÀ-ỹ0-9\s]+$/,
   /**
-   * /^[a-zA-Z0-9\s.,#\/-]+$/
+   * /^[a-zA-ZÀ-ỹ0-9\s.,#\/-]+$/
    * @example "123 Main St, Anytown, USA"
    */
   address: /^[a-zA-ZÀ-ỹ0-9\s.,#\/-]+$/,
@@ -83,18 +83,19 @@ export const REGEXS = {
   uuid: /[0-9a-fA-F]{8}\-[0-9a-fA-F]{4}\-[0-9a-fA-F]{4}\-[0-9a-fA-F]{4}\-[0-9a-fA-F]{12}/,
 }
 
-interface ValidationRule {
+export interface ValidationRule<V = unknown> {
   required?: boolean;
   pattern?: RegExp;
-  custom?: (value: string) => boolean;
   minLength?: number;
   maxLength?: number;
   errorMessage?: string;
+  custom?: (value: V) => boolean;
 }
 
-export type ValidationRules<T> = {
-  [K in keyof T]: ValidationRule;
-};
+export type ValidationRules<T> = Partial<{
+  [K in keyof T]: ValidationRule<T[K]>;
+}>;
+
 
 type ValidationErrors<T> = {
   [K in keyof T]?: string;
@@ -107,32 +108,48 @@ export const useFormValidator = <T extends Record<string, any>>(
   const [values, setValues] = useState<T>(initialValues);
   const [errors, setErrors] = useState<ValidationErrors<T>>({});
 
-  const validateField = (field: keyof T, value: T[keyof T]): string | undefined => {
-    const rules = validationRules[field];
-    if (!rules) return undefined;
-
-    if (rules.required && !value) {
-      return rules.errorMessage || "This field is required.";
+const validateField = <K extends keyof T>(
+  field: K,
+  value: T[K]
+): string | undefined => {
+  const rules = validationRules[field];
+  if (!rules) return undefined;
+
+  if (rules.required) {
+    if (
+      value === '' ||
+      value === null ||
+      value === undefined
+    ) {
+      return rules.errorMessage || 'This field is required.';
     }
+  }
 
-    if (rules.pattern && !rules.pattern.test(value)) {
-      return rules.errorMessage || "Invalid format.";
+  if (rules.pattern && typeof value === 'string') {
+    if (!rules.pattern.test(value)) {
+      return rules.errorMessage || 'Invalid format.';
     }
+  }
 
-    if (rules.minLength && value.length < rules.minLength) {
+  if (rules.minLength && typeof value === 'string') {
+    if (value.length < rules.minLength) {
       return rules.errorMessage || `Minimum length is ${rules.minLength}.`;
     }
+  }
 
-    if (rules.maxLength && value.length > rules.maxLength) {
+  if (rules.maxLength && typeof value === 'string') {
+    if (value.length > rules.maxLength) {
       return rules.errorMessage || `Maximum length is ${rules.maxLength}.`;
     }
+  }
 
-    if (rules.custom && !rules.custom(value)) {
-      return rules.errorMessage || "Invalid value.";
-    }
+  if (rules.custom && !rules.custom(value)) {
+    return rules.errorMessage || 'Invalid value.';
+  }
+
+  return undefined;
+};
 
-    return undefined;
-  };
 
   const validateAllFields = (): boolean => {
     const newErrors: ValidationErrors<T> = {};
@@ -152,62 +169,37 @@ export const useFormValidator = <T extends Record<string, any>>(
   };
 
   // validate array of fields
-  const validateFields = (fields: Array<keyof T>): boolean => {
-    const newErrors: ValidationErrors<T> = {};
-    let isValid = true;
+const validateFields = (fields: readonly (keyof T)[]): boolean => {
+  const newErrors: ValidationErrors<T> = {};
+  let isValid = true;
 
-    for (const field of fields) {
-      const value = values[field];
-      const error = validateField(field, value);
-      if (error) {
-        isValid = false;
-        newErrors[field] = error;
-      }
+  for (const field of fields) {
+    const value = values[field];
+    const error = validateField(field, value);
+    if (error) {
+      isValid = false;
+      newErrors[field] = error;
     }
+  }
 
-    setErrors({...errors, ...newErrors});
-    return isValid;
-  };
+  setErrors(prev => ({ ...prev, ...newErrors }));
+  return isValid;
+};
+
+
+const handleChange = <K extends keyof T>(field: K, value: T[K]) => {
+  setValues(prev => ({ ...prev, [field]: value }));
+  const error = validateField(field, value);
+  setErrors(prev => ({ ...prev, [field]: error }));
+};
 
-  const handleChange = <K extends keyof T>(field: K, value: T[K]) => {
-    setValues({...values, [field]: value});
-    const error = validateField(field, value);
-    setErrors({...errors, [field]: error});
-  };
 
   return {
-    /**
-     * Form values
-     * - ex: values.email
-     */
     values,
-    /**
-     * Form errors
-     * - ex: errors.email
-     */
     errors,
-    /** 
-     * Update the form values
-     * - ex: handleChange('email', 'a@example.com')
-     */
     handleChange,
-    /**
-     * Validate all form fields
-     * - ex: validateAllFields()
-     * @returns boolean
-     */
     validateAllFields,
-    /**
-     * Update entire the form values
-     * @param newValues
-     * - ex: setValues({ email: 'a@example.com', password: '123456' })
-     */
     setValues,
-    /**
-     * Validate array of fields
-     * - ex: validateFields(['email', 'password'])
-     * @returns boolean
-     */
     validateFields
   };
 };
@@ -231,4 +223,5 @@ export const useFormValidator = <T extends Record<string, any>>(
 //   if (validateAllFields()) {
 //     // proceed with form submission
 //   }
-// };
+// };
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kmod-cli",
-  "version": "1.7.1",
+  "version": "1.7.3",
   "description": "Stack components utilities fast setup in projects",
   "author": "kumo_d",
   "license": "MIT",