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

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

@@ -66,7 +66,7 @@ export const demoFunc = () => html`
     
     <div class="demo-container">
       <dees-panel .title=${'Basic Quantity Selector'} .subtitle=${'Simple quantity input with increment/decrement buttons'}>
-        <div class="input-group">
+        <dees-form>
           <dees-input-quantityselector
             .label=${'Quantity'}
             .infoText=${'Select the desired quantity'}
@@ -79,7 +79,7 @@ export const demoFunc = () => html`
             .infoText=${'Adjust the quantity of items'}
             .value=${3}
           ></dees-input-quantityselector>
-        </div>
+        </dees-form>
       </dees-panel>
       
       <dees-panel .title=${'Shopping Cart'} .subtitle=${'Modern e-commerce product cards with interactive quantity selectors'} .runAfterRender=${async (elementArg: HTMLElement) => {
@@ -178,7 +178,7 @@ export const demoFunc = () => html`
       </dees-panel>
       
       <dees-panel .title=${'Required & Disabled States'} .subtitle=${'Different states for validation and restrictions'}>
-        <div class="input-group">
+        <dees-form>
           <dees-input-quantityselector
             .label=${'Number of Licenses'}
             .infoText=${'Select how many licenses you need'}
@@ -192,7 +192,7 @@ export const demoFunc = () => html`
             .disabled=${true}
             .value=${5}
           ></dees-input-quantityselector>
-        </div>
+        </dees-form>
       </dees-panel>
       
       <dees-panel .title=${'Order Form'} .subtitle=${'Complete order form with quantity selection'}>