fix(demo-inputs): wrap input component demos in dees-form containers for consistent form integration

ts_web/elements/00group-input/dees-input-iban/dees-input-iban.demo.ts

@@ -30,7 +30,7 @@ export const demoFunc = () => html`
     
     <div class="demo-container">
       <dees-panel .title=${'Basic IBAN Input'} .subtitle=${'International Bank Account Number with automatic formatting'}>
-        <div class="input-group">
+        <dees-form>
           <dees-input-iban
             .label=${'Bank Account IBAN'}
             .infoText=${'Enter your International Bank Account Number'}
@@ -42,27 +42,29 @@ export const demoFunc = () => html`
             .infoText=${'This IBAN has been verified'}
             .value=${'DE89370400440532013000'}
           ></dees-input-iban>
-        </div>
+        </dees-form>
       </dees-panel>
       
       <dees-panel .title=${'Payment Information'} .subtitle=${'IBAN input with horizontal layout for payment forms'}>
-        <div class="payment-group">
-          <dees-input-text 
-            .label=${'Account Holder'} 
-            .layoutMode=${'horizontal'}
-            .value=${'John Doe'}
-          ></dees-input-text>
-          
-          <dees-input-iban 
-            .label=${'IBAN'} 
-            .layoutMode=${'horizontal'}
-            .value=${'GB82WEST12345698765432'}
-          ></dees-input-iban>
-        </div>
+        <dees-form>
+          <div class="payment-group">
+            <dees-input-text
+              .label=${'Account Holder'}
+              .layoutMode=${'horizontal'}
+              .value=${'John Doe'}
+            ></dees-input-text>
+
+            <dees-input-iban
+              .label=${'IBAN'}
+              .layoutMode=${'horizontal'}
+              .value=${'GB82WEST12345698765432'}
+            ></dees-input-iban>
+          </div>
+        </dees-form>
       </dees-panel>
       
       <dees-panel .title=${'Validation & States'} .subtitle=${'Required fields and disabled states'}>
-        <div class="input-group">
+        <dees-form>
           <dees-input-iban
             .label=${'Payment Account'}
             .infoText=${'Required for processing payments'}
@@ -75,7 +77,7 @@ export const demoFunc = () => html`
             .value=${'FR1420041010050500013M02606'}
             .disabled=${true}
           ></dees-input-iban>
-        </div>
+        </dees-form>
       </dees-panel>
       
       <dees-panel .title=${'Bank Transfer Form'} .subtitle=${'Complete form example with IBAN validation'}>