[DO NOT MERGE] Custom file upload

ui.af.apps/src/main/content/jcr_root/apps/core/fd/af-clientlibs/core-forms-components-runtime-all-xfa/.content.xml

@@ -5,4 +5,4 @@
     cssProcessor="[default:none,min:none]"
     jsProcessor="[default:none,min:none]"
     categories="[core.forms.components.runtime.all.xfa]"
-    embed="[core.forms.components.runtime.base.xfa,core.forms.components.container.v2.runtime,core.forms.components.datePicker.v1.runtime,core.forms.components.textinput.v1.runtime,core.forms.components.numberinput.v1.runtime,core.forms.components.panelcontainer.v1.runtime,core.forms.components.radiobutton.v1.runtime,core.forms.components.text.v1.runtime,core.forms.components.checkboxgroup.v1.runtime,core.forms.components.button.v1.runtime,core.forms.components.image.v1.runtime,core.forms.components.dropdown.v1.runtime,core.forms.components.fileinput.v3.runtime,core.forms.components.accordion.v1.runtime,core.forms.components.tabs.v1.runtime,core.forms.components.wizard.v1.runtime,core.forms.components.verticaltabs.v1.runtime,core.forms.components.recaptcha.v1.runtime,core.forms.components.checkbox.v1.runtime,core.forms.components.fragment.v1.runtime,core.forms.components.switch.v1.runtime,core.forms.components.termsandconditions.v1.runtime, core.forms.components.hcaptcha.v1.runtime,core.forms.components.review.v1.runtime, core.forms.components.turnstile.v1.runtime]"/>
+    embed="[core.forms.components.runtime.base.xfa,core.forms.components.container.v2.runtime,core.forms.components.datePicker.v1.runtime,core.forms.components.textinput.v1.runtime,core.forms.components.numberinput.v1.runtime,core.forms.components.panelcontainer.v1.runtime,core.forms.components.radiobutton.v1.runtime,core.forms.components.text.v1.runtime,core.forms.components.checkboxgroup.v1.runtime,core.forms.components.button.v1.runtime,core.forms.components.image.v1.runtime,core.forms.components.dropdown.v1.runtime,core.forms.components.fileinput.v3.runtime,core.forms.components.accordion.v1.runtime,core.forms.components.tabs.v1.runtime,core.forms.components.wizard.v1.runtime,core.forms.components.verticaltabs.v1.runtime,core.forms.components.recaptcha.v1.runtime,core.forms.components.checkbox.v1.runtime,core.forms.components.fragment.v1.runtime,core.forms.components.switch.v1.runtime,core.forms.components.termsandconditions.v1.runtime, core.forms.components.hcaptcha.v1.runtime,core.forms.components.review.v1.runtime, core.forms.components.turnstile.v1.runtime, core.forms.components.customfileupload.v1.runtime]"/>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/af-clientlibs/core-forms-components-runtime-all/.content.xml

@@ -5,4 +5,4 @@
     cssProcessor="[default:none,min:none]"
     jsProcessor="[default:none,min:none]"
     categories="[core.forms.components.runtime.all]"
-    embed="[core.forms.components.runtime.base,core.forms.components.container.v2.runtime,core.forms.components.datePicker.v1.runtime,core.forms.components.textinput.v1.runtime,core.forms.components.numberinput.v1.runtime,core.forms.components.panelcontainer.v1.runtime,core.forms.components.radiobutton.v1.runtime,core.forms.components.text.v1.runtime,core.forms.components.checkboxgroup.v1.runtime,core.forms.components.button.v1.runtime,core.forms.components.image.v1.runtime,core.forms.components.dropdown.v1.runtime,core.forms.components.fileinput.v3.runtime,core.forms.components.accordion.v1.runtime,core.forms.components.tabs.v1.runtime,core.forms.components.wizard.v1.runtime,core.forms.components.verticaltabs.v1.runtime,core.forms.components.recaptcha.v1.runtime,core.forms.components.checkbox.v1.runtime,core.forms.components.fragment.v1.runtime,core.forms.components.switch.v1.runtime,core.forms.components.termsandconditions.v1.runtime, core.forms.components.hcaptcha.v1.runtime,core.forms.components.review.v1.runtime, core.forms.components.turnstile.v1.runtime]"/>
+    embed="[core.forms.components.runtime.base,core.forms.components.container.v2.runtime,core.forms.components.datePicker.v1.runtime,core.forms.components.textinput.v1.runtime,core.forms.components.numberinput.v1.runtime,core.forms.components.panelcontainer.v1.runtime,core.forms.components.radiobutton.v1.runtime,core.forms.components.text.v1.runtime,core.forms.components.checkboxgroup.v1.runtime,core.forms.components.button.v1.runtime,core.forms.components.image.v1.runtime,core.forms.components.dropdown.v1.runtime,core.forms.components.fileinput.v3.runtime,core.forms.components.accordion.v1.runtime,core.forms.components.tabs.v1.runtime,core.forms.components.wizard.v1.runtime,core.forms.components.verticaltabs.v1.runtime,core.forms.components.recaptcha.v1.runtime,core.forms.components.checkbox.v1.runtime,core.forms.components.fragment.v1.runtime,core.forms.components.switch.v1.runtime,core.forms.components.termsandconditions.v1.runtime, core.forms.components.hcaptcha.v1.runtime,core.forms.components.review.v1.runtime, core.forms.components.turnstile.v1.runtime, core.forms.components.customfileupload.v1.runtime]"/>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/customfileupload/.content.xml

@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+          jcr:primaryType="sling:Folder"/>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/customfileupload/v1/.content.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured">
+    <customfileupload/>
+</jcr:root>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/customfileupload/v1/customfileupload/.content.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+    cq:icon="attach"
+    jcr:primaryType="cq:Component"
+    jcr:title="Adaptive Form Custom File Attachment"
+    jcr:description="Add a button to upload one or more files as form attachment."
+    sling:resourceSuperType="core/fd/components/form/fileinput/v3/fileinput"
+    componentGroup=".core-adaptiveform"/>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/customfileupload/v1/customfileupload/clientlibs/site/.content.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+    jcr:primaryType="cq:ClientLibraryFolder"
+    allowProxy="{Boolean}true"
+    categories="[core.forms.components.customfileupload.v1.runtime]"
+    dependencies="[core.forms.components.fileinput.v3.runtime]"/>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/customfileupload/v1/customfileupload/clientlibs/site/js.txt

@@ -0,0 +1,19 @@
+###############################################################################
+# Copyright 2025 Adobe
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#     http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+###############################################################################
+
+#base=js
+fileinputwidget.js
+fileinputview.js

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/customfileupload/v1/customfileupload/clientlibs/site/js/fileinputview.js

@@ -0,0 +1,153 @@
+/*******************************************************************************
+ * Copyright 2023 Adobe
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ ******************************************************************************/
+(function() {
+
+    "use strict";
+    class FileInputV3 extends FormView.FormFieldBase {
+
+        static NS = FormView.Constants.NS;
+        /**
+         * Each FormField has a data attribute class that is prefixed along with the global namespace to
+         * distinguish between them. If a component wants to put a data-attribute X, the attribute in HTML would be
+         * data-{NS}-{IS}-x=""
+         * @type {string}
+         */
+        static IS = "adaptiveFormCustomFileInput";
+        static bemBlock = 'cmp-adaptiveform-fileinput'
+        static selectors  = {
+            self: "[data-" + this.NS + '-is="' + this.IS + '"]',
+            widget: `.${FileInputV3.bemBlock}__widget`,
+            label: `.${FileInputV3.bemBlock}__label`,
+            description: `.${FileInputV3.bemBlock}__longdescription`,
+            qm: `.${FileInputV3.bemBlock}__questionmark`,
+            errorDiv: `.${FileInputV3.bemBlock}__errormessage`,
+            tooltipDiv: `.${FileInputV3.bemBlock}__shortdescription`,
+            fileListDiv : `.${FileInputV3.bemBlock}__filelist`,
+            attachButtonLabel : `.${FileInputV3.bemBlock}__widgetlabel`,
+            dragArea: `.${FileInputV3.bemBlock}__dragarea`
+        };
+
+        constructor(params) {
+            super(params);
+        }
+        widgetFields = {
+            widget: this.getWidget(),
+            fileListDiv: this.getFileListDiv(),
+            model: () => this._model,
+            dragArea: this.getDragArea()
+        };
+
+        getWidget() {
+            return this.element.querySelector(FileInputV3.selectors.widget);
+        }
+
+        getDragArea() {
+            return this.element.querySelector(FileInputV3.selectors.dragArea);
+        }
+
+        getDescription() {
+            return this.element.querySelector(FileInputV3.selectors.description);
+        }
+
+        getLabel() {
+            return this.element.querySelector(FileInputV3.selectors.label);
+        }
+
+        getErrorDiv() {
+            return this.element.querySelector(FileInputV3.selectors.errorDiv);
+        }
+
+        getTooltipDiv() {
+            return this.element.querySelector(FileInputV3.selectors.tooltipDiv);
+        }
+
+        getQuestionMarkDiv() {
+            return this.element.querySelector(FileInputV3.selectors.qm);
+        }
+
+        getFileListDiv() {
+            return this.element.querySelector(FileInputV3.selectors.fileListDiv);
+        }
+
+        getAttachButtonLabel() {
+            return this.element.querySelector(FileInputV3.selectors.attachButtonLabel);
+        }
+
+        updateEnabled(enabled, state) {
+            if (this.widget) {
+                this.element.setAttribute(FormView.Constants.DATA_ATTRIBUTE_ENABLED, enabled);
+                const isDisabled = !enabled || state.readOnly;
+                if (isDisabled) {
+                    this.widget.setAttribute("disabled", "disabled");
+                } else {
+                    this.widget.removeAttribute("disabled");
+                }
+            }
+        }
+
+        updateValue(value) {
+            if (this.widgetObject == null) {
+                this.widgetObject = new CustomFileInputWidget(this.widgetFields);
+            }
+            this.widgetObject.setValue(value);
+            super.updateEmptyStatus();
+        }
+
+        setModel(model) {
+            super.setModel(model);
+            if (this.widgetObject == null) {
+                this.widgetObject = new CustomFileInputWidget(this.widgetFields);
+            }
+            this.getAttachButtonLabel().addEventListener('focus', () => {
+                this.setActive();
+            })
+            this.getAttachButtonLabel().addEventListener('blur', () => {
+                this.setInactive();
+            })
+        }
+
+        syncWidget() {
+            let widgetElement = this.getWidget ? this.getWidget() : null;
+            if (widgetElement) {
+                widgetElement.id = this.getId() + "__widget";
+                const closestElement = widgetElement?.previousElementSibling;
+                if (closestElement && closestElement.tagName.toLowerCase() === 'label') {
+                    closestElement.setAttribute('for', this.getId() + "__widget");
+                } else {
+                    this.getAttachButtonLabel().removeAttribute('for');
+                }
+            }
+        }
+
+        syncLabel() {
+            let labelElement = typeof this.getLabel === 'function' ? this.getLabel() : null;
+            if (labelElement) {
+                labelElement.setAttribute('for', this.getId());
+            }
+        }
+
+        syncMarkupWithModel() {
+            super.syncMarkupWithModel();
+            this.syncWidget();
+            this.syncLabel();
+        }
+    }
+
+    FormView.Utils.setupField(({element, formContainer}) => {
+        return new FileInputV3({element, formContainer})
+    }, FileInputV3.selectors.self);
+
+})();