create-prisma-php-app 1.12.0 → 1.12.1

package/dist/src/Lib/FormHandler.php

@@ -311,13 +311,7 @@ class FormHandler
     {
         $attribute = '';
         $ruleParam = $ruleValue;
-        $requestName = null;
-        // $ruleParam = is_array($ruleValue) ? $ruleValue['value'] : $ruleValue;
-
-        if (is_array($ruleValue)) {
-            $ruleParam = $ruleValue['value'];
-            $requestName = $ruleValue['name'] ?? null;
-        }
+        $ruleParam = is_array($ruleValue) ? $ruleValue['value'] : $ruleValue;
 
         switch ($rule) {
             case 'text':
@@ -387,27 +381,6 @@ class FormHandler
             case 'list':
                 $attribute .= " list='$ruleParam'";
                 break;
-            case 'create':
-                $attribute .= " data-url='$ruleParam' data-request-name='$requestName' data-request-type='create' data-type='register'";
-                break;
-            case 'read':
-                $attribute .= " data-url='$ruleParam' data-request-name='$requestName' data-request-type='read' data-type='register'";
-                break;
-            case 'update':
-                $attribute .= " data-url='$ruleParam' data-request-name='$requestName' data-request-type='update' data-type='register'";
-                break;
-            case 'delete':
-                $attribute .= " data-url='$ruleParam' data-request-name='$requestName' data-request-type='delete' data-type='register'";
-                break;
-            case 'event':
-                $attribute .= " data-event='$ruleParam' data-type='register'";
-                break;
-            case 'debounce':
-                $attribute .= " data-debounce='$ruleParam' data-type='register'";
-                break;
-            case 'templateConnect':
-                $attribute .= " data-template-connect='$ruleParam' data-type='register'";
-                break;
             default:
                 // Optionally handle unknown rules or log them
                 break;
@@ -437,126 +410,6 @@ class FormHandler
         $fieldData = $this->data[$field] ?? '';
         return "id='fh-watch-$field' data-watch-value='$fieldData' data-type='watch'";
     }
-
-    /**
-     * Creates a template element for a form field.
-     * 
-     * This function returns an HTML string for a template element with specified data attributes,
-     * useful for creating dynamic content that can be cloned and inserted into the DOM.
-     * 
-     * @param array $params An associative array of parameters.
-     *                      - 'field' (optional): The name of the field to create a template for. If not provided, a generic template is created.
-     *                      - 'readOnLoad' (optional): A flag indicating whether the template should include the `data-read-on-load` attribute. Defaults to `true`.
-     *                      - 'listen' (optional): A string specifying any event the template should listen to. Defaults to an empty string.
-     *                      - 'noCache' (optional): A flag indicating whether the template should include the `data-no-cache` attribute. Defaults to `false`.
-     * 
-     * @return string An HTML string with data attributes for the template. If a field name is provided, 
-     *                it includes the `data-template-field` attribute. Otherwise, it includes the `data-template-general` attribute.
-     * 
-     * @example
-     * Example usage to create a template element for a "user" field:
-     * 
-     * $params = [
-     *     'field' => 'user',
-     *     'readOnLoad' => true,
-     *     'listen' => 'exampleEvent',
-     *     'noCache' => true
-     * ];
-     * echo $form->template($params);
-     * Output: "data-template-field='user' data-read-on-load='1' data-type='template' data-listen='exampleEvent' data-no-cache='1'"
-     * 
-     * Example usage to create a generic template element:
-     * 
-     * $params = [
-     *     'readOnLoad' => true,
-     *     'listen' => 'exampleEvent',
-     *     'noCache' => false
-     * ];
-     * echo $form->template($params);
-     * Output: "data-template-general='true' data-read-on-load='1' data-type='template' data-listen='exampleEvent' data-no-cache='0'"
-     */
-    public function template(array $params = []): string
-    {
-        $field = isset($params['field']) ? Validator::validateString($params['field']) : null;
-        $readOnLoad = isset($params['readOnLoad']) ? Validator::validateBoolean($params['readOnLoad']) : true;
-        $listen = isset($params['listen']) ? Validator::validateString($params['listen']) : '';
-        $noCache = isset($params['noCache']) ? Validator::validateBoolean($params['noCache']) : false;
-        if ($field) {
-            $templateData = "data-template-field='$field' data-read-on-load='$readOnLoad' data-type='template' data-listen='$listen' data-no-cache='$noCache'";
-        } else {
-            $templateData = "data-template-general='true' data-read-on-load='$readOnLoad' data-type='template' data-listen='$listen' data-no-cache='$noCache'";
-        }
-
-        return $templateData;
-    }
-
-    /**
-     * Creates a template placeholder for a form field.
-     * 
-     * This function returns a `data-template-placeholder` attribute with the field name as the value,
-     * 
-     * useful for dynamically populating template elements with field data.
-     * 
-     * @param string $field The name of the field to create a placeholder for.
-     * 
-     * @return string A `data-template-placeholder` attribute with the field name as the value.
-     * 
-     * @example
-     * Example usage to create a placeholder for a "name" field:
-     * echo $form->templatePlaceholder('name');
-     * This will generate: "data-template-placeholder='name'"
-     */
-    public function templatePlaceholder(string $field)
-    {
-        $field = Validator::validateString($field);
-        return "data-template-placeholder='$field' data-type='template-placeholder'";
-    }
-
-    /**
-     * Generates a string containing data attributes for a button element based on input parameters.
-     *
-     * This function accepts an associative array where keys are attribute names (without the 'data-' prefix)
-     * and values are the attribute values. It will only add an attribute if the associated value is not empty.
-     * 
-     * @param array $attributes Associative array with the following keys and their corresponding values:
-     *                          - 'info': Information for the `data-info` attribute.
-     *                          - 'event': Event-handler pairs formatted as a string for the `data-event` attribute.
-     *                          - 'formAction': Actions or operations associated with a form for the `data-form` attribute.
-     *                          - 'connect': Additional connections related to the button for the `data-connect` attribute.
-     *
-     * @return string A string containing the concatenated `data-*` attributes, ready for inclusion in an HTML tag.
-     *
-     * @throws InvalidArgumentException If any value in the array does not pass validation.
-     */
-    public function event(array $attributes)
-    {
-        $dataAttributes = [];
-        $possibleAttributes = ['info', 'event', 'form', 'connect'];
-
-        foreach ($possibleAttributes as $attr) {
-            if (isset($attributes[$attr]) && $attributes[$attr] !== '') {
-                $validatedValue = Validator::validateString($attributes[$attr]);
-                $dataAttributes[] = "data-$attr='$validatedValue' data-type='event'";
-            }
-        }
-
-        return implode(' ', $dataAttributes);
-    }
-
-    public function templateConnect(string $field)
-    {
-        $field = Validator::validateString($field);
-        return "data-template-connect='$field' data-type='template-connect'";
-    }
-
-    public function form(string $field, ...$options)
-    {
-        $field = Validator::validateString($field);
-        $attributes = "id='fh-form-$field' method='post'";
-        $optionsAttributes = json_encode($options);
-        $attributes .= " data-options='$optionsAttributes' data-type='form'";
-        return $attributes;
-    }
 }
 
 ?>
@@ -565,9 +418,7 @@ class FormHandler
     class FormHandler {
         constructor() {
             this.errors = [];
-            this.requestCache = new Map();
             this.dataRulesElements = document.querySelectorAll('[data-rules]');
-            this.dataFormElements = document.querySelectorAll('[data-type="form"]');
             this.init();
         }
 
@@ -575,12 +426,6 @@ class FormHandler
             this.dataRulesElements.forEach(fieldElement => {
                 this.initializeFieldFromDOM(fieldElement);
             });
-
-            this.dataFormElements.forEach(formElement => {
-                this.initializeFormFromDOM(formElement);
-            });
-
-            this.event();
         }
 
         initializeFieldFromDOM(fieldElement) {
@@ -590,26 +435,7 @@ class FormHandler
             }
 
             const fieldName = fieldElement.name;
-            const dataUrl = fieldElement.getAttribute('data-url');
             const rules = JSON.parse(fieldElement.getAttribute('data-rules') || '{}');
-            const event = fieldElement.getAttribute('data-event');
-
-            let debounceTime = fieldElement.getAttribute('data-debounce');
-            if (!debounceTime || debounceTime.length < 1) {
-                debounceTime = 300;
-            }
-
-            const debouncedInputHandler = debounce(async () => {
-                if (dataUrl) {
-                    if (fieldElement.getAttribute('data-type') === 'register') {
-                        if (fieldElement.getAttribute('data-request-type') === 'read') {
-                            await this.read(dataUrl, fieldElement).catch(error => {
-                                console.error("Read failed for field", fieldName, error);
-                            });
-                        }
-                    }
-                }
-            }, debounceTime);
 
             const immediateObserver = (e) => {
                 const target = e.target;
@@ -622,113 +448,7 @@ class FormHandler
                 }
             };
 
-            fieldElement.addEventListener('input', debouncedInputHandler);
             fieldElement.addEventListener('input', immediateObserver);
-
-            if (dataUrl) {
-                if (this.isDataTypeExists(fieldElement, 'register')) {
-                    if (fieldElement.getAttribute('data-request-type') === 'read') {
-                        this.read(dataUrl, fieldElement).catch(error => {
-                            console.error("Initial read failed for field", fieldName, error);
-                        });
-                    }
-                }
-            }
-        }
-
-        initializeFormFromDOM(formElement) {
-            if (!formElement) return;
-
-            formElement.addEventListener('submit', async (e) => {
-                e.preventDefault();
-
-                const formData = new FormData(formElement);
-                const formFields = Object.fromEntries(formData.entries());
-
-                const optionsAttribute = formElement.getAttribute('data-options');
-                if (!optionsAttribute) {
-                    console.error("Missing 'data-options' attribute.");
-                    return;
-                }
-
-                let formOptions;
-                try {
-                    formOptions = JSON.parse(optionsAttribute);
-                } catch (parseError) {
-                    console.error("Failed to parse 'data-options'.", parseError);
-                    return;
-                }
-
-                const formAction = formElement.dataset.action;
-                const url = formOptions[0]?.[formAction];
-                const readFieldName = formOptions[0]?.['read'];
-                const field = document.getElementById(`fh-${readFieldName.name}`);
-                const finishFunctionName = formOptions[0]?.['finishFunction'];
-
-                if (!url) {
-                    console.error(`Invalid form action: ${formAction}`);
-                    return;
-                }
-
-                const handleAction = async (actionFunc, errorMsg) => {
-                    try {
-                        await actionFunc(url, formFields);
-                    } catch (error) {
-                        console.error(errorMsg, error);
-                    }
-                };
-
-                switch (formAction) {
-                    case 'create':
-                        await handleAction(this.create.bind(this), "Create failed");
-                        break;
-                    case 'update':
-                        await handleAction(this.update.bind(this), "Update failed");
-                        break;
-                    case 'delete':
-                        await handleAction(this.delete.bind(this), "Delete failed");
-                        break;
-                    default:
-                        console.error(`Unknown action: ${formAction}`);
-                        break;
-                }
-
-                if (field) {
-                    try {
-                        await this.read(field.dataset.url, field);
-                    } catch (error) {
-                        console.error("Read failed", error);
-                    }
-                } else {
-                    if (readFieldName) {
-                        try {
-                            await this.read(readFieldName.url, {
-                                name: readFieldName,
-                                value: ''
-                            });
-                        } catch (error) {
-                            console.error("Read failed", error);
-                        }
-                    }
-                }
-
-                if (finishFunctionName && typeof window[finishFunctionName] === 'function') {
-                    window[finishFunctionName]();
-                }
-            });
-        }
-
-        isDataTypeExists(element, dataType) {
-            return this.getDataTypes(element).includes(dataType);
-        }
-
-        getDataTypes(element) {
-            const dataTypes = element.getAttribute('data-type');
-            if (dataTypes) {
-                return dataTypes.split(',').map(val => val.trim());
-            } else {
-                return [];
-            }
         }
 
         updateElementDisplay(displayElement, field) {
@@ -771,278 +491,6 @@ class FormHandler
             }
         }
 
-        event() {
-            const eventElements = document.querySelectorAll('[data-event]');
-            eventElements.forEach(element => {
-                const eventAttr = element.getAttribute('data-event');
-                if (eventAttr) {
-                    const events = eventAttr.split(';');
-                    events.forEach(eventFunctionPair => {
-                        const [eventType, functionName] = eventFunctionPair.split(',').map(val => val.trim());
-
-                        if (eventType && functionName && typeof window[functionName] === 'function') {
-                            element.addEventListener(eventType, window[functionName]);
-
-                            element.addEventListener(eventType, (e) => {
-                                const eventForm = element.getAttribute('data-form');
-                                if (eventForm) {
-                                    const formAttributes = eventForm.split(',');
-                                    const formElement = document.getElementById(`fh-form-${formAttributes[0]}`);
-                                    const formAction = formAttributes[1];
-
-                                    if (!formElement) return;
-
-                                    if (['create', 'read', 'update', 'delete'].includes(formAction)) {
-                                        formElement.dataset.action = formAction;
-                                    }
-
-                                    if (formAction === 'create') {
-                                        const templateElements = document.querySelectorAll('[data-template-connect]');
-                                        templateElements.forEach(templateElement => {
-                                            if (templateElement) {
-                                                this.updateElementDisplay(templateElement, {
-                                                    tagName: templateElement.tagName,
-                                                    value: '',
-                                                    textContent: ''
-                                                });
-                                            }
-                                        });
-                                    }
-                                }
-                            });
-                        } else {
-                            console.error(`Invalid event or function: ${eventFunctionPair}`);
-                        }
-                    });
-                }
-            });
-        }
-
-        getTemplateForField(field) {
-            let templates = [];
-            const typeTemplate = document.querySelectorAll('[data-type="template"]');
-
-            if (typeTemplate.length > 0) {
-                templates = Array.from(typeTemplate).filter(template => {
-                    const templateField = template.getAttribute('data-template-field');
-                    const generalTemplate = template.getAttribute('data-template-general');
-                    const listen = template.getAttribute('data-listen');
-                    if (templateField === field.name) {
-                        return true;
-                    }
-
-                    const templateListener = document.querySelector(`[data-template-field="${listen}"]`);
-                    if (templateListener && templateListener.getAttribute('data-listen') !== '') {
-                        return true;
-                    }
-
-                    if (listen === 'read') {
-                        return true;
-                    }
-
-                    if (generalTemplate === 'true') {
-                        return true;
-                    }
-
-                    return false;
-                });
-            }
-            return templates;
-        }
-
-        processDataItems(items, template, tbody) {
-            items.forEach((item) => {
-                const clone = document.importNode(template.content, true);
-
-                Object.keys(item).forEach(key => {
-                    const placeholderElement = clone.querySelector(`[data-template-placeholder="${key}"]`);
-                    if (placeholderElement) {
-                        placeholderElement.textContent = item[key];
-                    }
-                });
-
-                const dataInfoElements = clone.querySelectorAll('[data-info], [data-event], [data-connect]');
-                dataInfoElements.forEach(element => {
-                    this.attachEventHandlers(element, item);
-                });
-
-                tbody.appendChild(clone);
-            });
-        }
-
-        attachEventHandlers(element, item) {
-            const infoKeys = element.getAttribute('data-info');
-            if (infoKeys) {
-                if (infoKeys === 'all') {
-                    const keys = Object.keys(item);
-                    keys.forEach(key => {
-                        if (item[key] !== undefined) {
-                            element.dataset[key] = item[key];
-                        }
-                    });
-                } else {
-                    const keys = infoKeys.split(',').map(key => key.trim());
-                    keys.forEach(key => {
-                        if (item[key] !== undefined) {
-                            element.dataset[key] = item[key];
-                        }
-                    });
-                }
-            }
-
-            const eventAttr = element.getAttribute('data-event');
-            if (eventAttr) {
-                const events = eventAttr.split(';');
-                events.forEach(eventFunctionPair => {
-                    const [eventType, functionName] = eventFunctionPair.split(',').map(val => val.trim());
-
-                    if (eventType && functionName && typeof window[functionName] === 'function') {
-                        element.addEventListener(eventType, window[functionName]);
-
-                        element.addEventListener(eventType, (e) => {
-                            this.handleDataConnectAndFormActions(element, item);
-                        });
-                    } else {
-                        console.error(`Invalid event or function: ${eventFunctionPair}`);
-                    }
-                });
-            }
-        }
-
-        handleDataConnectAndFormActions(element, item) {
-            const eventForm = element.getAttribute('data-form');
-            if (eventForm) {
-                const formAttributes = eventForm.split(',');
-                const formElement = document.getElementById(`fh-form-${formAttributes[0]}`);
-                const formAction = formAttributes[1];
-
-                if (!formElement) return;
-
-                if (['create', 'read', 'update', 'delete'].includes(formAction)) {
-                    formElement.dataset.action = formAction;
-                }
-            }
-
-            const templateConnectValues = element.getAttribute('data-connect');
-            if (templateConnectValues) {
-                const connectValues = templateConnectValues.split(',').map(value => value.trim());
-                connectValues.forEach(connectValue => {
-                    const templateElements = document.querySelectorAll(`[data-template-connect="${connectValue}"]`);
-                    templateElements.forEach(templateElement => {
-                        this.updateElementDisplay(templateElement, {
-                            tagName: templateElement.tagName,
-                            value: item[connectValue],
-                            textContent: item[connectValue]
-                        });
-                    });
-                });
-            }
-        }
-
-        updateTemplates(templates, response, field) {
-            const items = Array.isArray(response) ? response : [response];
-            templates.forEach(template => {
-                let readOnLoad = template.getAttribute('data-read-on-load');
-                let noCache = template.getAttribute('data-no-cache');
-                if (readOnLoad === '' && (field.value === undefined || field.value.length === 0)) {
-                    const tbody = template.parentNode;
-                    tbody.innerHTML = '';
-                    tbody.appendChild(template);
-                    return;
-                }
-
-                const tbody = template.parentNode;
-                tbody.innerHTML = '';
-                tbody.appendChild(template);
-
-                this.processDataItems(items, template, tbody);
-
-                if (noCache !== '') {
-                    this.requestCache.delete(cacheKey);
-                }
-            });
-        }
-
-        clearCache() {
-            this.requestCache.clear();
-        }
-
-        async create(url, data) {
-            if (!url || !data) return;
-
-            try {
-                const response = await api.post(url, data);
-                this.clearCache();
-            } catch (error) {
-                console.error("Create failed", error);
-            }
-        }
-
-        async read(url, field) {
-            if (!url || !field) return;
-
-            let fieldDataName = '';
-            if (field instanceof HTMLElement) {
-                const requestName = field.getAttribute('data-request-name');
-                fieldDataName = requestName && requestName.length > 0 ? requestName : field.name;
-            } else {
-                fieldDataName = field.name ?? '';
-            }
-
-            if (!fieldDataName) return;
-
-            const data = {
-                [fieldDataName]: field.value
-            };
-
-            let templates = this.getTemplateForField(field);
-            if (templates.length === 0) return;
-
-            const cacheKey = `${url}-${JSON.stringify(data)}`;
-            if (this.requestCache.has(cacheKey)) {
-                return this.requestCache.get(cacheKey)
-                    .then(response => {
-                        this.updateTemplates(templates, response, field);
-                    })
-                    .catch(error => {
-                        console.error("🚀 ~ FormHandler ~ read ~ error from cache:", error);
-                    });
-            }
-
-            const requestPromise = api.post(url, data);
-            this.requestCache.set(cacheKey, requestPromise);
-
-            try {
-                const response = await requestPromise;
-                this.updateTemplates(templates, response, field, cacheKey);
-            } catch (error) {
-                console.error("🚀 ~ FormHandler ~ read ~ error from request:", error);
-                this.requestCache.delete(cacheKey);
-            }
-        }
-
-        async update(url, data) {
-            if (!url || !data) return;
-
-            try {
-                const response = await api.put(url, data);
-                this.clearCache();
-            } catch (error) {
-                console.error("Update failed", error);
-            }
-        }
-
-        async delete(url, data) {
-            if (!url || !data) return;
-
-            try {
-                const response = await api.delete(url, data);
-                this.clearCache();
-            } catch (error) {
-                console.error("Delete failed", error);
-            }
-        }
-
         validateField(field, value, rules) {
             if (!rules) return [];
             this.errors = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-prisma-php-app",
-  "version": "1.12.0",
+  "version": "1.12.1",
   "description": "Prisma-PHP: A Revolutionary Library Bridging PHP with Prisma ORM",
   "main": "dist/index.js",
   "type": "module",