@k3-universe/react-kit 0.0.1

package/storybook-static/assets/Form.Basic.stories-CJugIYsx.js

@@ -0,0 +1,45 @@
+import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{F as m}from"./FormBuilder-BGgeY8ik.js";import"./iframe-G-6sM9Mt.js";import"./preload-helper-Dp1pzeXC.js";import"./schemas-S_Tg7JYp.js";import"./utils-D-KgF5mV.js";import"./button-BTWmFXop.js";import"./index-1v1lhNFD.js";import"./index-CGrAONsN.js";import"./input-11YRd9gD.js";import"./textarea-Dw2vruMl.js";import"./select-DbLzULCJ.js";import"./index-_crRFOM5.js";import"./index-CZaD3imo.js";import"./index-BdQq_4o_.js";import"./index-DW48STyt.js";import"./index-BDwnENHR.js";import"./index-DvM9azdj.js";import"./index-ClNNG_ys.js";import"./index-7yNAGow7.js";import"./index-DqWzLCH-.js";import"./index-lH-AZpAn.js";import"./Combination-BT_gXe1L.js";import"./index-DhoByIgc.js";import"./index-I343IfOC.js";import"./index-CayhpKmv.js";import"./index-ev1RjzGv.js";import"./index-d_S6mtzU.js";import"./index-CAwQR9Pv.js";import"./index-HghBIZeg.js";import"./index-DNAxNqEO.js";import"./chevron-down-BqLjUn1_.js";import"./createLucideIcon-1ZwIAs_l.js";import"./check-BgWXKGqi.js";import"./checkbox-QlugAqJY.js";import"./index-Bq6UNRVc.js";import"./radio-group-iPL-8jvw.js";import"./index-CMmbDm5O.js";import"./circle-DVJTkDI7.js";import"./label-C5vJTTwH.js";import"./card-BJpPOzP8.js";import"./Autocomplete-DngjqsCM.js";import"./popover-DW1K4QCO.js";import"./command-BERL33lL.js";import"./index-CzJf-yyP.js";import"./dialog-DM9YJ1JD.js";import"./x-DG9mLFAg.js";import"./trash-2-Bt5LMclM.js";import"./grip-vertical-Buja1rv9.js";import"./SectionBuilder-Bav4WrnT.js";import"./separator-DoUX1TNx.js";const or={title:"Kit/Builder/Form",component:m,parameters:{controls:{expanded:!0},backgrounds:{disable:!0}}},r={name:"Basic usage",args:{sections:[{title:"User Info",description:"A minimal configuration using grid layout",variant:"card",layout:"grid",grid:{cols:1,mdCols:2,gap:"gap-4"},fields:[{name:"firstName",label:"First name",type:"text",required:!0},{name:"lastName",label:"Last name",type:"text",required:!0},{name:"email",label:"Email",type:"email",required:!0},{name:"newsletter",label:"Subscribe to newsletter",type:"checkbox",defaultValue:!1,gridCols:2}]}],onSubmit:t=>{console.log("Submit (basic):",t)},showActions:!0},render:t=>e.jsx("div",{className:"max-w-3xl mx-auto p-6",children:e.jsx(m,{...t})})};var i,o,a;r.parameters={...r.parameters,docs:{...(i=r.parameters)==null?void 0:i.docs,source:{originalSource:`{
+  name: 'Basic usage',
+  args: {
+    sections: [{
+      title: 'User Info',
+      description: 'A minimal configuration using grid layout',
+      variant: 'card',
+      layout: 'grid',
+      grid: {
+        cols: 1,
+        mdCols: 2,
+        gap: 'gap-4'
+      },
+      fields: [{
+        name: 'firstName',
+        label: 'First name',
+        type: 'text',
+        required: true
+      }, {
+        name: 'lastName',
+        label: 'Last name',
+        type: 'text',
+        required: true
+      }, {
+        name: 'email',
+        label: 'Email',
+        type: 'email',
+        required: true
+      }, {
+        name: 'newsletter',
+        label: 'Subscribe to newsletter',
+        type: 'checkbox',
+        defaultValue: false,
+        gridCols: 2
+      }]
+    }],
+    onSubmit: (data: unknown) => {
+      console.log('Submit (basic):', data);
+    },
+    showActions: true
+  } satisfies Partial<FormBuilderProps>,
+  render: args => <div className="max-w-3xl mx-auto p-6">
+      <FormBuilder {...args as FormBuilderProps} />
+    </div>
+}`,...(a=(o=r.parameters)==null?void 0:o.docs)==null?void 0:a.source}}};const ar=["BasicUsage"];export{r as BasicUsage,ar as __namedExportsOrder,or as default};

package/storybook-static/assets/Form.Complex.stories-BPogRp6F.js

@@ -0,0 +1,230 @@
+import{j as n}from"./jsx-runtime-D_zvdyIk.js";import{F as f}from"./FormBuilder-BGgeY8ik.js";import{c as o,a as e,b as x}from"./section-factories-CC6eFfbk.js";import{c as a,a as r}from"./dependencies-ctrV69dx.js";import{a as m,b as c}from"./schemas-S_Tg7JYp.js";import"./iframe-G-6sM9Mt.js";import"./preload-helper-Dp1pzeXC.js";import"./utils-D-KgF5mV.js";import"./button-BTWmFXop.js";import"./index-1v1lhNFD.js";import"./index-CGrAONsN.js";import"./input-11YRd9gD.js";import"./textarea-Dw2vruMl.js";import"./select-DbLzULCJ.js";import"./index-_crRFOM5.js";import"./index-CZaD3imo.js";import"./index-BdQq_4o_.js";import"./index-DW48STyt.js";import"./index-BDwnENHR.js";import"./index-DvM9azdj.js";import"./index-ClNNG_ys.js";import"./index-7yNAGow7.js";import"./index-DqWzLCH-.js";import"./index-lH-AZpAn.js";import"./Combination-BT_gXe1L.js";import"./index-DhoByIgc.js";import"./index-I343IfOC.js";import"./index-CayhpKmv.js";import"./index-ev1RjzGv.js";import"./index-d_S6mtzU.js";import"./index-CAwQR9Pv.js";import"./index-HghBIZeg.js";import"./index-DNAxNqEO.js";import"./chevron-down-BqLjUn1_.js";import"./createLucideIcon-1ZwIAs_l.js";import"./check-BgWXKGqi.js";import"./checkbox-QlugAqJY.js";import"./index-Bq6UNRVc.js";import"./radio-group-iPL-8jvw.js";import"./index-CMmbDm5O.js";import"./circle-DVJTkDI7.js";import"./label-C5vJTTwH.js";import"./card-BJpPOzP8.js";import"./Autocomplete-DngjqsCM.js";import"./popover-DW1K4QCO.js";import"./command-BERL33lL.js";import"./index-CzJf-yyP.js";import"./dialog-DM9YJ1JD.js";import"./x-DG9mLFAg.js";import"./trash-2-Bt5LMclM.js";import"./grip-vertical-Buja1rv9.js";import"./SectionBuilder-Bav4WrnT.js";import"./separator-DoUX1TNx.js";const u={when:(t,l)=>c().refine(t,{message:"Condition not met"}).pipe(l),matchField:(t,l)=>d=>d[t]===d[l],minItems:(t,l)=>m(c()).min(t,l||`Must have at least ${t} items`),maxItems:(t,l)=>m(c()).max(t,l||`Must have at most ${t} items`)},xe={title:"Kit/Builder/Form",component:f,parameters:{controls:{expanded:!0},backgrounds:{disable:!0}}},s={name:"Complex example",render:()=>{const t=i=>{console.log("Complex form submitted:",i)},l=(i,v,b)=>{console.log(`Field ${i} changed to:`,v),console.log("All form values:",b)},d=[o.card("Personal Information",[e.text("firstName","First Name",{required:!0,placeholder:"Enter first name"}),e.text("lastName","Last Name",{required:!0,placeholder:"Enter last name"}),e.email("email","Email Address",{required:!0,placeholder:"Enter email address"}),e.date("dateOfBirth","Date of Birth",{required:!0}),e.select("gender","Gender",[{label:"Male",value:"male"},{label:"Female",value:"female"},{label:"Other",value:"other"},{label:"Prefer not to say",value:"not_specified"}],{placeholder:"Select gender"})]),o.card("Address Information",[e.object("address","Primary Address",[e.text("street","Street Address",{required:!0,placeholder:"123 Main St",gridCols:2}),e.text("city","City",{required:!0,placeholder:"New York"}),e.text("state","State/Province",{required:!0,placeholder:"NY"}),e.text("postalCode","Postal Code",{required:!0,placeholder:"10001"}),e.select("country","Country",[{label:"United States",value:"US"},{label:"Canada",value:"CA"},{label:"United Kingdom",value:"UK"},{label:"Australia",value:"AU"}],{required:!0,defaultValue:"US"})],{gridCols:2}),e.checkbox("sameAsShipping","Billing address same as shipping",{defaultValue:!0,gridCols:2}),e.object("billingAddress","Billing Address",[e.text("street","Street Address",{required:!0,placeholder:"123 Main St",gridCols:2}),e.text("city","City",{required:!0,placeholder:"New York"}),e.text("state","State/Province",{required:!0,placeholder:"NY"}),e.text("postalCode","Postal Code",{required:!0,placeholder:"10001"}),e.select("country","Country",[{label:"United States",value:"US"},{label:"Canada",value:"CA"},{label:"United Kingdom",value:"UK"},{label:"Australia",value:"AU"}],{required:!0,defaultValue:"US"})],{gridCols:2,dependencies:[a.showWhen("sameAsShipping",r.isFalse())]})]),o.card("Employment Information",[e.select("employmentStatus","Employment Status",[{label:"Employed",value:"employed"},{label:"Self-employed",value:"self_employed"},{label:"Unemployed",value:"unemployed"},{label:"Student",value:"student"},{label:"Retired",value:"retired"}],{required:!0,placeholder:"Select employment status"}),e.text("company","Company Name",{required:!0,placeholder:"Enter company name",dependencies:[a.showWhen("employmentStatus",r.equals("employed"))]}),e.text("jobTitle","Job Title",{required:!0,placeholder:"Enter job title",dependencies:[a.showWhen("employmentStatus",r.equals("employed"))]}),e.text("businessName","Business Name",{required:!0,placeholder:"Enter business name",dependencies:[a.showWhen("employmentStatus",r.equals("self_employed"))]}),e.text("businessType","Type of Business",{placeholder:"e.g., Consulting, Retail, etc.",dependencies:[a.showWhen("employmentStatus",r.equals("self_employed"))]}),e.text("school","School/University",{required:!0,placeholder:"Enter school name",dependencies:[a.showWhen("employmentStatus",r.equals("student"))]}),e.text("major","Major/Field of Study",{placeholder:"Enter your major",dependencies:[a.showWhen("employmentStatus",r.equals("student"))]}),e.number("annualIncome","Annual Income",{placeholder:"50000",validation:u.minItems(0,"Income must be positive"),dependencies:[a.showWhen("employmentStatus",i=>["employed","self_employed"].includes(i))]})]),o.card("Skills & Experience",[e.array("skills","Skills",[e.text("name","Skill Name",{required:!0,placeholder:"e.g., JavaScript, Project Management"}),e.select("level","Proficiency Level",[{label:"Beginner",value:"beginner"},{label:"Intermediate",value:"intermediate"},{label:"Advanced",value:"advanced"},{label:"Expert",value:"expert"}],{required:!0,placeholder:"Select level"}),e.number("yearsOfExperience","Years of Experience",{placeholder:"2",validation:u.minItems(0,"Years must be positive")})],{gridCols:2,defaultValue:[{name:"",level:"",yearsOfExperience:0}]})]),o.card("Professional References",[e.checkbox("hasReferences","I have professional references",{defaultValue:!1,gridCols:2}),e.array("references","References",[e.text("name","Full Name",{required:!0,placeholder:"John Doe"}),e.text("title","Job Title",{required:!0,placeholder:"Senior Manager"}),e.text("company","Company",{required:!0,placeholder:"ABC Corporation"}),e.email("email","Email",{required:!0,placeholder:"john.doe@company.com"}),e.text("phone","Phone",{validation:x.phone,placeholder:"+1 (555) 123-4567"}),e.select("relationship","Relationship",[{label:"Direct Supervisor",value:"supervisor"},{label:"Colleague",value:"colleague"},{label:"Client",value:"client"},{label:"Other",value:"other"}],{required:!0,placeholder:"Select relationship"})],{gridCols:2,defaultValue:[],dependencies:[a.showWhen("hasReferences",r.isTrue())]})]),o.card("Additional Information",[e.textarea("additionalInfo","Additional Comments",{placeholder:"Any additional information you'd like to share...",gridCols:2}),e.checkbox("agreeToTerms","I agree to the terms and conditions",{required:!0,gridCols:2}),e.checkbox("allowMarketing","I agree to receive marketing communications",{defaultValue:!1,gridCols:2})])];return n.jsxs("div",{className:"max-w-4xl mx-auto p-6",children:[n.jsxs("div",{className:"mb-8",children:[n.jsx("h1",{className:"text-3xl font-bold text-gray-900",children:"Professional Profile"}),n.jsx("p",{className:"text-gray-600 mt-2",children:"Complete your professional profile with detailed information. This form demonstrates complex nested structures and field dependencies."})]}),n.jsx(f,{sections:d,onSubmit:t,onFieldChange:l,className:"space-y-8"})]})}};var p,h,y;s.parameters={...s.parameters,docs:{...(p=s.parameters)==null?void 0:p.docs,source:{originalSource:`{
+  name: 'Complex example',
+  render: () => {
+    const handleSubmit = (data: unknown) => {
+      console.log('Complex form submitted:', data);
+    };
+    const handleFieldChange = (name: string, value: unknown, allValues: Record<string, unknown>) => {
+      console.log(\`Field \${name} changed to:\`, value);
+      console.log('All form values:', allValues);
+    };
+    const sections = [createSection.card('Personal Information', [createField.text('firstName', 'First Name', {
+      required: true,
+      placeholder: 'Enter first name'
+    }), createField.text('lastName', 'Last Name', {
+      required: true,
+      placeholder: 'Enter last name'
+    }), createField.email('email', 'Email Address', {
+      required: true,
+      placeholder: 'Enter email address'
+    }), createField.date('dateOfBirth', 'Date of Birth', {
+      required: true
+    }), createField.select('gender', 'Gender', [{
+      label: 'Male',
+      value: 'male'
+    }, {
+      label: 'Female',
+      value: 'female'
+    }, {
+      label: 'Other',
+      value: 'other'
+    }, {
+      label: 'Prefer not to say',
+      value: 'not_specified'
+    }], {
+      placeholder: 'Select gender'
+    })]), createSection.card('Address Information', [createField.object('address', 'Primary Address', [createField.text('street', 'Street Address', {
+      required: true,
+      placeholder: '123 Main St',
+      gridCols: 2
+    }), createField.text('city', 'City', {
+      required: true,
+      placeholder: 'New York'
+    }), createField.text('state', 'State/Province', {
+      required: true,
+      placeholder: 'NY'
+    }), createField.text('postalCode', 'Postal Code', {
+      required: true,
+      placeholder: '10001'
+    }), createField.select('country', 'Country', [{
+      label: 'United States',
+      value: 'US'
+    }, {
+      label: 'Canada',
+      value: 'CA'
+    }, {
+      label: 'United Kingdom',
+      value: 'UK'
+    }, {
+      label: 'Australia',
+      value: 'AU'
+    }], {
+      required: true,
+      defaultValue: 'US'
+    })], {
+      gridCols: 2
+    }), createField.checkbox('sameAsShipping', 'Billing address same as shipping', {
+      defaultValue: true,
+      gridCols: 2
+    }), createField.object('billingAddress', 'Billing Address', [createField.text('street', 'Street Address', {
+      required: true,
+      placeholder: '123 Main St',
+      gridCols: 2
+    }), createField.text('city', 'City', {
+      required: true,
+      placeholder: 'New York'
+    }), createField.text('state', 'State/Province', {
+      required: true,
+      placeholder: 'NY'
+    }), createField.text('postalCode', 'Postal Code', {
+      required: true,
+      placeholder: '10001'
+    }), createField.select('country', 'Country', [{
+      label: 'United States',
+      value: 'US'
+    }, {
+      label: 'Canada',
+      value: 'CA'
+    }, {
+      label: 'United Kingdom',
+      value: 'UK'
+    }, {
+      label: 'Australia',
+      value: 'AU'
+    }], {
+      required: true,
+      defaultValue: 'US'
+    })], {
+      gridCols: 2,
+      dependencies: [createDependency.showWhen('sameAsShipping', conditions.isFalse())]
+    })]), createSection.card('Employment Information', [createField.select('employmentStatus', 'Employment Status', [{
+      label: 'Employed',
+      value: 'employed'
+    }, {
+      label: 'Self-employed',
+      value: 'self_employed'
+    }, {
+      label: 'Unemployed',
+      value: 'unemployed'
+    }, {
+      label: 'Student',
+      value: 'student'
+    }, {
+      label: 'Retired',
+      value: 'retired'
+    }], {
+      required: true,
+      placeholder: 'Select employment status'
+    }), createField.text('company', 'Company Name', {
+      required: true,
+      placeholder: 'Enter company name',
+      dependencies: [createDependency.showWhen('employmentStatus', conditions.equals('employed'))]
+    }), createField.text('jobTitle', 'Job Title', {
+      required: true,
+      placeholder: 'Enter job title',
+      dependencies: [createDependency.showWhen('employmentStatus', conditions.equals('employed'))]
+    }), createField.text('businessName', 'Business Name', {
+      required: true,
+      placeholder: 'Enter business name',
+      dependencies: [createDependency.showWhen('employmentStatus', conditions.equals('self_employed'))]
+    }), createField.text('businessType', 'Type of Business', {
+      placeholder: 'e.g., Consulting, Retail, etc.',
+      dependencies: [createDependency.showWhen('employmentStatus', conditions.equals('self_employed'))]
+    }), createField.text('school', 'School/University', {
+      required: true,
+      placeholder: 'Enter school name',
+      dependencies: [createDependency.showWhen('employmentStatus', conditions.equals('student'))]
+    }), createField.text('major', 'Major/Field of Study', {
+      placeholder: 'Enter your major',
+      dependencies: [createDependency.showWhen('employmentStatus', conditions.equals('student'))]
+    }), createField.number('annualIncome', 'Annual Income', {
+      placeholder: '50000',
+      validation: validators.minItems(0, 'Income must be positive'),
+      dependencies: [createDependency.showWhen('employmentStatus', value => ['employed', 'self_employed'].includes(value))]
+    })]), createSection.card('Skills & Experience', [createField.array('skills', 'Skills', [createField.text('name', 'Skill Name', {
+      required: true,
+      placeholder: 'e.g., JavaScript, Project Management'
+    }), createField.select('level', 'Proficiency Level', [{
+      label: 'Beginner',
+      value: 'beginner'
+    }, {
+      label: 'Intermediate',
+      value: 'intermediate'
+    }, {
+      label: 'Advanced',
+      value: 'advanced'
+    }, {
+      label: 'Expert',
+      value: 'expert'
+    }], {
+      required: true,
+      placeholder: 'Select level'
+    }), createField.number('yearsOfExperience', 'Years of Experience', {
+      placeholder: '2',
+      validation: validators.minItems(0, 'Years must be positive')
+    })], {
+      gridCols: 2,
+      defaultValue: [{
+        name: '',
+        level: '',
+        yearsOfExperience: 0
+      }]
+    })]), createSection.card('Professional References', [createField.checkbox('hasReferences', 'I have professional references', {
+      defaultValue: false,
+      gridCols: 2
+    }), createField.array('references', 'References', [createField.text('name', 'Full Name', {
+      required: true,
+      placeholder: 'John Doe'
+    }), createField.text('title', 'Job Title', {
+      required: true,
+      placeholder: 'Senior Manager'
+    }), createField.text('company', 'Company', {
+      required: true,
+      placeholder: 'ABC Corporation'
+    }), createField.email('email', 'Email', {
+      required: true,
+      placeholder: 'john.doe@company.com'
+    }), createField.text('phone', 'Phone', {
+      validation: commonValidations.phone,
+      placeholder: '+1 (555) 123-4567'
+    }), createField.select('relationship', 'Relationship', [{
+      label: 'Direct Supervisor',
+      value: 'supervisor'
+    }, {
+      label: 'Colleague',
+      value: 'colleague'
+    }, {
+      label: 'Client',
+      value: 'client'
+    }, {
+      label: 'Other',
+      value: 'other'
+    }], {
+      required: true,
+      placeholder: 'Select relationship'
+    })], {
+      gridCols: 2,
+      defaultValue: [],
+      dependencies: [createDependency.showWhen('hasReferences', conditions.isTrue())]
+    })]), createSection.card('Additional Information', [createField.textarea('additionalInfo', 'Additional Comments', {
+      placeholder: "Any additional information you'd like to share...",
+      gridCols: 2
+    }), createField.checkbox('agreeToTerms', 'I agree to the terms and conditions', {
+      required: true,
+      gridCols: 2
+    }), createField.checkbox('allowMarketing', 'I agree to receive marketing communications', {
+      defaultValue: false,
+      gridCols: 2
+    })])];
+    return <div className="max-w-4xl mx-auto p-6">
+        <div className="mb-8">
+          <h1 className="text-3xl font-bold text-gray-900">Professional Profile</h1>
+          <p className="text-gray-600 mt-2">
+            Complete your professional profile with detailed information. This form demonstrates complex nested structures and field dependencies.
+          </p>
+        </div>
+
+        <FormBuilder sections={sections} onSubmit={handleSubmit} onFieldChange={handleFieldChange} className="space-y-8" />
+      </div>;
+  }
+}`,...(y=(h=s.parameters)==null?void 0:h.docs)==null?void 0:y.source}}};const ge=["ComplexExample"];export{s as ComplexExample,ge as __namedExportsOrder,xe as default};

package/storybook-static/assets/Form.Dynamic.stories-Boway5AK.js

@@ -0,0 +1,247 @@
+import{j as r}from"./jsx-runtime-D_zvdyIk.js";import{F as u}from"./FormBuilder-BGgeY8ik.js";import{c as l,a as e}from"./section-factories-CC6eFfbk.js";import{c as i,a as t}from"./dependencies-ctrV69dx.js";import"./iframe-G-6sM9Mt.js";import"./preload-helper-Dp1pzeXC.js";import"./schemas-S_Tg7JYp.js";import"./utils-D-KgF5mV.js";import"./button-BTWmFXop.js";import"./index-1v1lhNFD.js";import"./index-CGrAONsN.js";import"./input-11YRd9gD.js";import"./textarea-Dw2vruMl.js";import"./select-DbLzULCJ.js";import"./index-_crRFOM5.js";import"./index-CZaD3imo.js";import"./index-BdQq_4o_.js";import"./index-DW48STyt.js";import"./index-BDwnENHR.js";import"./index-DvM9azdj.js";import"./index-ClNNG_ys.js";import"./index-7yNAGow7.js";import"./index-DqWzLCH-.js";import"./index-lH-AZpAn.js";import"./Combination-BT_gXe1L.js";import"./index-DhoByIgc.js";import"./index-I343IfOC.js";import"./index-CayhpKmv.js";import"./index-ev1RjzGv.js";import"./index-d_S6mtzU.js";import"./index-CAwQR9Pv.js";import"./index-HghBIZeg.js";import"./index-DNAxNqEO.js";import"./chevron-down-BqLjUn1_.js";import"./createLucideIcon-1ZwIAs_l.js";import"./check-BgWXKGqi.js";import"./checkbox-QlugAqJY.js";import"./index-Bq6UNRVc.js";import"./radio-group-iPL-8jvw.js";import"./index-CMmbDm5O.js";import"./circle-DVJTkDI7.js";import"./label-C5vJTTwH.js";import"./card-BJpPOzP8.js";import"./Autocomplete-DngjqsCM.js";import"./popover-DW1K4QCO.js";import"./command-BERL33lL.js";import"./index-CzJf-yyP.js";import"./dialog-DM9YJ1JD.js";import"./x-DG9mLFAg.js";import"./trash-2-Bt5LMclM.js";import"./grip-vertical-Buja1rv9.js";import"./SectionBuilder-Bav4WrnT.js";import"./separator-DoUX1TNx.js";const me={title:"Kit/Builder/Form",component:u,parameters:{controls:{expanded:!0},backgrounds:{disable:!0}}},n={name:"Dynamic example",render:()=>{const p=a=>{console.log("Dynamic form submitted:",a)},h=(a,o)=>{console.log(`Field ${a} changed to:`,o),a==="productType"&&o==="subscription"&&console.log("Subscription product selected - additional fields will appear"),a==="hasDiscount"&&o===!0&&console.log("Discount enabled - discount fields will appear")},m=[l.card("Product Configuration",[e.select("productType","Product Type",[{label:"One-time Purchase",value:"onetime"},{label:"Subscription",value:"subscription"},{label:"Bundle",value:"bundle"},{label:"Digital Download",value:"digital"}],{required:!0,placeholder:"Select product type"}),e.text("productName","Product Name",{required:!0,placeholder:"Enter product name"}),e.number("basePrice","Base Price ($)",{required:!0,placeholder:"29.99"}),e.select("billingCycle","Billing Cycle",[{label:"Monthly",value:"monthly"},{label:"Quarterly",value:"quarterly"},{label:"Yearly",value:"yearly"}],{required:!0,placeholder:"Select billing cycle",dependencies:[i.showWhen("productType",t.equals("subscription"))]}),e.number("trialDays","Free Trial Days",{placeholder:"14",defaultValue:0,dependencies:[i.showWhen("productType",t.equals("subscription"))]}),e.array("bundleItems","Bundle Items",[e.text("itemName","Item Name",{required:!0,placeholder:"Item name"}),e.number("itemPrice","Item Price ($)",{required:!0,placeholder:"9.99"}),e.number("quantity","Quantity",{required:!0,defaultValue:1,placeholder:"1"})],{gridCols:2,defaultValue:[{itemName:"",itemPrice:0,quantity:1}],dependencies:[i.showWhen("productType",t.equals("bundle"))]}),e.select("fileFormat","File Format",[{label:"PDF",value:"pdf"},{label:"ZIP Archive",value:"zip"},{label:"Video (MP4)",value:"mp4"},{label:"Audio (MP3)",value:"mp3"},{label:"Software Installer",value:"exe"}],{required:!0,placeholder:"Select file format",dependencies:[i.showWhen("productType",t.equals("digital"))]}),e.number("fileSizeMB","File Size (MB)",{placeholder:"50",dependencies:[i.showWhen("productType",t.equals("digital"))]})]),l.card("Pricing & Discounts",[e.checkbox("hasDiscount","Apply Discount",{defaultValue:!1,gridCols:2}),e.select("discountType","Discount Type",[{label:"Percentage",value:"percentage"},{label:"Fixed Amount",value:"fixed"},{label:"Buy One Get One",value:"bogo"}],{required:!0,placeholder:"Select discount type",dependencies:[i.showWhen("hasDiscount",t.isTrue())]}),e.number("discountValue","Discount Value",{required:!0,placeholder:"10",dependencies:[i.showWhen("hasDiscount",t.isTrue()),i.showWhen("discountType",a=>a!=="bogo")]}),e.date("discountStartDate","Discount Start Date",{dependencies:[i.showWhen("hasDiscount",t.isTrue())]}),e.date("discountEndDate","Discount End Date",{dependencies:[i.showWhen("hasDiscount",t.isTrue())]}),e.number("minimumQuantity","Minimum Quantity for Discount",{placeholder:"2",defaultValue:1,dependencies:[i.showWhen("hasDiscount",t.isTrue())]})]),l.card("Shipping Configuration",[e.checkbox("requiresShipping","Requires Physical Shipping",{defaultValue:!0,gridCols:2,dependencies:[i.setValueWhen("productType",t.equals("digital"),!1),i.disableWhen("productType",t.equals("digital"))]}),e.number("weight","Weight (lbs)",{placeholder:"1.5",dependencies:[i.showWhen("requiresShipping",t.isTrue())]}),e.object("dimensions","Dimensions (inches)",[e.number("length","Length",{required:!0,placeholder:"10"}),e.number("width","Width",{required:!0,placeholder:"8"}),e.number("height","Height",{required:!0,placeholder:"2"})],{dependencies:[i.showWhen("requiresShipping",t.isTrue())]}),e.select("shippingClass","Shipping Class",[{label:"Standard",value:"standard"},{label:"Express",value:"express"},{label:"Overnight",value:"overnight"},{label:"Fragile",value:"fragile"},{label:"Hazardous",value:"hazardous"}],{required:!0,defaultValue:"standard",placeholder:"Select shipping class",dependencies:[i.showWhen("requiresShipping",t.isTrue())]}),e.checkbox("freeShipping","Offer Free Shipping",{defaultValue:!1,dependencies:[i.showWhen("requiresShipping",t.isTrue())]}),e.number("freeShippingThreshold","Free Shipping Threshold ($)",{placeholder:"50",dependencies:[i.showWhen("requiresShipping",t.isTrue()),i.showWhen("freeShipping",t.isTrue())]})]),l.card("Inventory Management",[e.checkbox("trackInventory","Track Inventory",{defaultValue:!0,gridCols:2,dependencies:[i.setValueWhen("productType",t.equals("digital"),!1)]}),e.number("stockQuantity","Stock Quantity",{required:!0,placeholder:"100",dependencies:[i.showWhen("trackInventory",t.isTrue())]}),e.number("lowStockThreshold","Low Stock Alert Threshold",{placeholder:"10",dependencies:[i.showWhen("trackInventory",t.isTrue())]}),e.checkbox("allowBackorders","Allow Backorders",{defaultValue:!1,dependencies:[i.showWhen("trackInventory",t.isTrue())]}),e.text("sku","SKU (Stock Keeping Unit)",{placeholder:"PROD-001",dependencies:[i.showWhen("trackInventory",t.isTrue())]}),e.text("barcode","Barcode",{placeholder:"123456789012",dependencies:[i.showWhen("trackInventory",t.isTrue())]})]),l.card("Marketing & SEO",[e.text("metaTitle","Meta Title",{placeholder:"SEO-friendly title",gridCols:2}),e.textarea("metaDescription","Meta Description",{placeholder:"SEO-friendly description (150-160 characters)",gridCols:2}),e.array("tags","Product Tags",[e.text("tag","Tag",{required:!0,placeholder:"e.g., electronics, gadgets"})],{gridCols:2,defaultValue:[{tag:""}]}),e.checkbox("featured","Featured Product",{defaultValue:!1}),e.checkbox("newProduct","Mark as New",{defaultValue:!1}),e.select("visibility","Product Visibility",[{label:"Public",value:"public"},{label:"Private",value:"private"},{label:"Password Protected",value:"password"},{label:"Coming Soon",value:"coming_soon"}],{required:!0,defaultValue:"public",placeholder:"Select visibility"}),e.text("password","Access Password",{placeholder:"Enter password",dependencies:[i.showWhen("visibility",t.equals("password"))]}),e.date("launchDate","Launch Date",{dependencies:[i.showWhen("visibility",t.equals("coming_soon"))]})])];return r.jsxs("div",{className:"max-w-6xl mx-auto p-6",children:[r.jsxs("div",{className:"mb-8",children:[r.jsx("h1",{className:"text-3xl font-bold text-gray-900",children:"Dynamic Product Configuration"}),r.jsx("p",{className:"text-gray-600 mt-2",children:"This form demonstrates advanced field dependencies and real-time interactions. Watch how fields appear, disappear, and change based on your selections."}),r.jsxs("div",{className:"mt-4 p-4 bg-blue-50 border border-blue-200 rounded-lg",children:[r.jsx("h3",{className:"font-semibold text-blue-900",children:"Try these interactions:"}),r.jsxs("ul",{className:"mt-2 text-sm text-blue-800 space-y-1",children:[r.jsx("li",{children:"• Change Product Type to see different field sets"}),r.jsx("li",{children:'• Enable "Apply Discount" to reveal discount configuration'}),r.jsx("li",{children:'• Toggle "Requires Physical Shipping" for shipping options'}),r.jsx("li",{children:'• Select "Digital Download" to auto-disable shipping'}),r.jsx("li",{children:'• Choose "Password Protected" visibility for password field'})]})]})]}),r.jsx(u,{sections:m,onSubmit:p,onFieldChange:h,submitLabel:"Save Product Configuration",resetLabel:"Reset All",className:"space-y-8"})]})}};var s,d,c;n.parameters={...n.parameters,docs:{...(s=n.parameters)==null?void 0:s.docs,source:{originalSource:`{
+  name: 'Dynamic example',
+  render: () => {
+    const handleSubmit = (data: unknown) => {
+      console.log('Dynamic form submitted:', data);
+    };
+    const handleFieldChange = (name: string, value: unknown) => {
+      console.log(\`Field \${name} changed to:\`, value);
+      if (name === 'productType' && value === 'subscription') {
+        console.log('Subscription product selected - additional fields will appear');
+      }
+      if (name === 'hasDiscount' && value === true) {
+        console.log('Discount enabled - discount fields will appear');
+      }
+    };
+    const sections = [createSection.card('Product Configuration', [createField.select('productType', 'Product Type', [{
+      label: 'One-time Purchase',
+      value: 'onetime'
+    }, {
+      label: 'Subscription',
+      value: 'subscription'
+    }, {
+      label: 'Bundle',
+      value: 'bundle'
+    }, {
+      label: 'Digital Download',
+      value: 'digital'
+    }], {
+      required: true,
+      placeholder: 'Select product type'
+    }), createField.text('productName', 'Product Name', {
+      required: true,
+      placeholder: 'Enter product name'
+    }), createField.number('basePrice', 'Base Price ($)', {
+      required: true,
+      placeholder: '29.99'
+    }), createField.select('billingCycle', 'Billing Cycle', [{
+      label: 'Monthly',
+      value: 'monthly'
+    }, {
+      label: 'Quarterly',
+      value: 'quarterly'
+    }, {
+      label: 'Yearly',
+      value: 'yearly'
+    }], {
+      required: true,
+      placeholder: 'Select billing cycle',
+      dependencies: [createDependency.showWhen('productType', conditions.equals('subscription'))]
+    }), createField.number('trialDays', 'Free Trial Days', {
+      placeholder: '14',
+      defaultValue: 0,
+      dependencies: [createDependency.showWhen('productType', conditions.equals('subscription'))]
+    }), createField.array('bundleItems', 'Bundle Items', [createField.text('itemName', 'Item Name', {
+      required: true,
+      placeholder: 'Item name'
+    }), createField.number('itemPrice', 'Item Price ($)', {
+      required: true,
+      placeholder: '9.99'
+    }), createField.number('quantity', 'Quantity', {
+      required: true,
+      defaultValue: 1,
+      placeholder: '1'
+    })], {
+      gridCols: 2,
+      defaultValue: [{
+        itemName: '',
+        itemPrice: 0,
+        quantity: 1
+      }],
+      dependencies: [createDependency.showWhen('productType', conditions.equals('bundle'))]
+    }), createField.select('fileFormat', 'File Format', [{
+      label: 'PDF',
+      value: 'pdf'
+    }, {
+      label: 'ZIP Archive',
+      value: 'zip'
+    }, {
+      label: 'Video (MP4)',
+      value: 'mp4'
+    }, {
+      label: 'Audio (MP3)',
+      value: 'mp3'
+    }, {
+      label: 'Software Installer',
+      value: 'exe'
+    }], {
+      required: true,
+      placeholder: 'Select file format',
+      dependencies: [createDependency.showWhen('productType', conditions.equals('digital'))]
+    }), createField.number('fileSizeMB', 'File Size (MB)', {
+      placeholder: '50',
+      dependencies: [createDependency.showWhen('productType', conditions.equals('digital'))]
+    })]), createSection.card('Pricing & Discounts', [createField.checkbox('hasDiscount', 'Apply Discount', {
+      defaultValue: false,
+      gridCols: 2
+    }), createField.select('discountType', 'Discount Type', [{
+      label: 'Percentage',
+      value: 'percentage'
+    }, {
+      label: 'Fixed Amount',
+      value: 'fixed'
+    }, {
+      label: 'Buy One Get One',
+      value: 'bogo'
+    }], {
+      required: true,
+      placeholder: 'Select discount type',
+      dependencies: [createDependency.showWhen('hasDiscount', conditions.isTrue())]
+    }), createField.number('discountValue', 'Discount Value', {
+      required: true,
+      placeholder: '10',
+      dependencies: [createDependency.showWhen('hasDiscount', conditions.isTrue()), createDependency.showWhen('discountType', value => value !== 'bogo')]
+    }), createField.date('discountStartDate', 'Discount Start Date', {
+      dependencies: [createDependency.showWhen('hasDiscount', conditions.isTrue())]
+    }), createField.date('discountEndDate', 'Discount End Date', {
+      dependencies: [createDependency.showWhen('hasDiscount', conditions.isTrue())]
+    }), createField.number('minimumQuantity', 'Minimum Quantity for Discount', {
+      placeholder: '2',
+      defaultValue: 1,
+      dependencies: [createDependency.showWhen('hasDiscount', conditions.isTrue())]
+    })]), createSection.card('Shipping Configuration', [createField.checkbox('requiresShipping', 'Requires Physical Shipping', {
+      defaultValue: true,
+      gridCols: 2,
+      dependencies: [createDependency.setValueWhen('productType', conditions.equals('digital'), false), createDependency.disableWhen('productType', conditions.equals('digital'))]
+    }), createField.number('weight', 'Weight (lbs)', {
+      placeholder: '1.5',
+      dependencies: [createDependency.showWhen('requiresShipping', conditions.isTrue())]
+    }), createField.object('dimensions', 'Dimensions (inches)', [createField.number('length', 'Length', {
+      required: true,
+      placeholder: '10'
+    }), createField.number('width', 'Width', {
+      required: true,
+      placeholder: '8'
+    }), createField.number('height', 'Height', {
+      required: true,
+      placeholder: '2'
+    })], {
+      dependencies: [createDependency.showWhen('requiresShipping', conditions.isTrue())]
+    }), createField.select('shippingClass', 'Shipping Class', [{
+      label: 'Standard',
+      value: 'standard'
+    }, {
+      label: 'Express',
+      value: 'express'
+    }, {
+      label: 'Overnight',
+      value: 'overnight'
+    }, {
+      label: 'Fragile',
+      value: 'fragile'
+    }, {
+      label: 'Hazardous',
+      value: 'hazardous'
+    }], {
+      required: true,
+      defaultValue: 'standard',
+      placeholder: 'Select shipping class',
+      dependencies: [createDependency.showWhen('requiresShipping', conditions.isTrue())]
+    }), createField.checkbox('freeShipping', 'Offer Free Shipping', {
+      defaultValue: false,
+      dependencies: [createDependency.showWhen('requiresShipping', conditions.isTrue())]
+    }), createField.number('freeShippingThreshold', 'Free Shipping Threshold ($)', {
+      placeholder: '50',
+      dependencies: [createDependency.showWhen('requiresShipping', conditions.isTrue()), createDependency.showWhen('freeShipping', conditions.isTrue())]
+    })]), createSection.card('Inventory Management', [createField.checkbox('trackInventory', 'Track Inventory', {
+      defaultValue: true,
+      gridCols: 2,
+      dependencies: [createDependency.setValueWhen('productType', conditions.equals('digital'), false)]
+    }), createField.number('stockQuantity', 'Stock Quantity', {
+      required: true,
+      placeholder: '100',
+      dependencies: [createDependency.showWhen('trackInventory', conditions.isTrue())]
+    }), createField.number('lowStockThreshold', 'Low Stock Alert Threshold', {
+      placeholder: '10',
+      dependencies: [createDependency.showWhen('trackInventory', conditions.isTrue())]
+    }), createField.checkbox('allowBackorders', 'Allow Backorders', {
+      defaultValue: false,
+      dependencies: [createDependency.showWhen('trackInventory', conditions.isTrue())]
+    }), createField.text('sku', 'SKU (Stock Keeping Unit)', {
+      placeholder: 'PROD-001',
+      dependencies: [createDependency.showWhen('trackInventory', conditions.isTrue())]
+    }), createField.text('barcode', 'Barcode', {
+      placeholder: '123456789012',
+      dependencies: [createDependency.showWhen('trackInventory', conditions.isTrue())]
+    })]), createSection.card('Marketing & SEO', [createField.text('metaTitle', 'Meta Title', {
+      placeholder: 'SEO-friendly title',
+      gridCols: 2
+    }), createField.textarea('metaDescription', 'Meta Description', {
+      placeholder: 'SEO-friendly description (150-160 characters)',
+      gridCols: 2
+    }), createField.array('tags', 'Product Tags', [createField.text('tag', 'Tag', {
+      required: true,
+      placeholder: 'e.g., electronics, gadgets'
+    })], {
+      gridCols: 2,
+      defaultValue: [{
+        tag: ''
+      }]
+    }), createField.checkbox('featured', 'Featured Product', {
+      defaultValue: false
+    }), createField.checkbox('newProduct', 'Mark as New', {
+      defaultValue: false
+    }), createField.select('visibility', 'Product Visibility', [{
+      label: 'Public',
+      value: 'public'
+    }, {
+      label: 'Private',
+      value: 'private'
+    }, {
+      label: 'Password Protected',
+      value: 'password'
+    }, {
+      label: 'Coming Soon',
+      value: 'coming_soon'
+    }], {
+      required: true,
+      defaultValue: 'public',
+      placeholder: 'Select visibility'
+    }), createField.text('password', 'Access Password', {
+      placeholder: 'Enter password',
+      dependencies: [createDependency.showWhen('visibility', conditions.equals('password'))]
+    }), createField.date('launchDate', 'Launch Date', {
+      dependencies: [createDependency.showWhen('visibility', conditions.equals('coming_soon'))]
+    })])];
+    return <div className="max-w-6xl mx-auto p-6">
+        <div className="mb-8">
+          <h1 className="text-3xl font-bold text-gray-900">Dynamic Product Configuration</h1>
+          <p className="text-gray-600 mt-2">
+            This form demonstrates advanced field dependencies and real-time interactions. Watch how fields appear, disappear, and change based on your selections.
+          </p>
+          <div className="mt-4 p-4 bg-blue-50 border border-blue-200 rounded-lg">
+            <h3 className="font-semibold text-blue-900">Try these interactions:</h3>
+            <ul className="mt-2 text-sm text-blue-800 space-y-1">
+              <li>• Change Product Type to see different field sets</li>
+              <li>• Enable "Apply Discount" to reveal discount configuration</li>
+              <li>• Toggle "Requires Physical Shipping" for shipping options</li>
+              <li>• Select "Digital Download" to auto-disable shipping</li>
+              <li>• Choose "Password Protected" visibility for password field</li>
+            </ul>
+          </div>
+        </div>
+  
+        <FormBuilder sections={sections} onSubmit={handleSubmit} onFieldChange={handleFieldChange} submitLabel="Save Product Configuration" resetLabel="Reset All" className="space-y-8" />
+      </div>;
+  }
+}`,...(c=(d=n.parameters)==null?void 0:d.docs)==null?void 0:c.source}}};const be=["DynamicExample"];export{n as DynamicExample,be as __namedExportsOrder,me as default};

package/storybook-static/assets/Form.Simple.stories-_OXGXXpE.js

@@ -0,0 +1,50 @@
+import{j as r}from"./jsx-runtime-D_zvdyIk.js";import{F as i}from"./FormBuilder-BGgeY8ik.js";import{c as n,a as e,b as c}from"./section-factories-CC6eFfbk.js";import"./iframe-G-6sM9Mt.js";import"./preload-helper-Dp1pzeXC.js";import"./schemas-S_Tg7JYp.js";import"./utils-D-KgF5mV.js";import"./button-BTWmFXop.js";import"./index-1v1lhNFD.js";import"./index-CGrAONsN.js";import"./input-11YRd9gD.js";import"./textarea-Dw2vruMl.js";import"./select-DbLzULCJ.js";import"./index-_crRFOM5.js";import"./index-CZaD3imo.js";import"./index-BdQq_4o_.js";import"./index-DW48STyt.js";import"./index-BDwnENHR.js";import"./index-DvM9azdj.js";import"./index-ClNNG_ys.js";import"./index-7yNAGow7.js";import"./index-DqWzLCH-.js";import"./index-lH-AZpAn.js";import"./Combination-BT_gXe1L.js";import"./index-DhoByIgc.js";import"./index-I343IfOC.js";import"./index-CayhpKmv.js";import"./index-ev1RjzGv.js";import"./index-d_S6mtzU.js";import"./index-CAwQR9Pv.js";import"./index-HghBIZeg.js";import"./index-DNAxNqEO.js";import"./chevron-down-BqLjUn1_.js";import"./createLucideIcon-1ZwIAs_l.js";import"./check-BgWXKGqi.js";import"./checkbox-QlugAqJY.js";import"./index-Bq6UNRVc.js";import"./radio-group-iPL-8jvw.js";import"./index-CMmbDm5O.js";import"./circle-DVJTkDI7.js";import"./label-C5vJTTwH.js";import"./card-BJpPOzP8.js";import"./Autocomplete-DngjqsCM.js";import"./popover-DW1K4QCO.js";import"./command-BERL33lL.js";import"./index-CzJf-yyP.js";import"./dialog-DM9YJ1JD.js";import"./x-DG9mLFAg.js";import"./trash-2-Bt5LMclM.js";import"./grip-vertical-Buja1rv9.js";import"./SectionBuilder-Bav4WrnT.js";import"./separator-DoUX1TNx.js";const ne={title:"Kit/Builder/Form",component:i,parameters:{controls:{expanded:!0},backgrounds:{disable:!0}}},t={name:"Simple example",render:()=>{const s=p=>{console.log("Form submitted:",p)},m=[n.card("Contact Information",[e.text("name","Full Name",{required:!0,placeholder:"Enter your full name"}),e.email("email","Email Address",{required:!0,placeholder:"Enter your email address"}),e.text("phone","Phone Number",{validation:c.phone,placeholder:"+1 (555) 123-4567"}),e.select("subject","Subject",[{label:"General Inquiry",value:"general"},{label:"Technical Support",value:"support"},{label:"Sales Question",value:"sales"},{label:"Partnership",value:"partnership"}],{required:!0,placeholder:"Select a subject"}),e.textarea("message","Message",{required:!0,placeholder:"Enter your message here...",gridCols:2}),e.checkbox("subscribe","Subscribe to newsletter",{defaultValue:!1,gridCols:2})])];return r.jsxs("div",{className:"max-w-2xl mx-auto p-6",children:[r.jsxs("div",{className:"mb-6",children:[r.jsx("h1",{className:"text-2xl font-bold text-gray-900",children:"Contact Us"}),r.jsx("p",{className:"text-gray-600 mt-2",children:"Fill out the form below and we'll get back to you as soon as possible."})]}),r.jsx(i,{sections:m,onSubmit:s,className:"space-y-6"})]})}};var a,o,l;t.parameters={...t.parameters,docs:{...(a=t.parameters)==null?void 0:a.docs,source:{originalSource:`{
+  name: 'Simple example',
+  render: () => {
+    const handleSubmit = (data: unknown) => {
+      console.log('Form submitted:', data);
+    };
+    const sections = [createSection.card('Contact Information', [createField.text('name', 'Full Name', {
+      required: true,
+      placeholder: 'Enter your full name'
+    }), createField.email('email', 'Email Address', {
+      required: true,
+      placeholder: 'Enter your email address'
+    }), createField.text('phone', 'Phone Number', {
+      validation: commonValidations.phone,
+      placeholder: '+1 (555) 123-4567'
+    }), createField.select('subject', 'Subject', [{
+      label: 'General Inquiry',
+      value: 'general'
+    }, {
+      label: 'Technical Support',
+      value: 'support'
+    }, {
+      label: 'Sales Question',
+      value: 'sales'
+    }, {
+      label: 'Partnership',
+      value: 'partnership'
+    }], {
+      required: true,
+      placeholder: 'Select a subject'
+    }), createField.textarea('message', 'Message', {
+      required: true,
+      placeholder: 'Enter your message here...',
+      gridCols: 2
+    }), createField.checkbox('subscribe', 'Subscribe to newsletter', {
+      defaultValue: false,
+      gridCols: 2
+    })])];
+    return <div className="max-w-2xl mx-auto p-6">
+        <div className="mb-6">
+          <h1 className="text-2xl font-bold text-gray-900">Contact Us</h1>
+          <p className="text-gray-600 mt-2">
+            Fill out the form below and we'll get back to you as soon as possible.
+          </p>
+        </div>
+  
+        <FormBuilder sections={sections} onSubmit={handleSubmit} className="space-y-6" />
+      </div>;
+  }
+}`,...(l=(o=t.parameters)==null?void 0:o.docs)==null?void 0:l.source}}};const ce=["SimpleExample"];export{t as SimpleExample,ce as __namedExportsOrder,ne as default};

package/storybook-static/assets/Form.stories-BoHyR8ho.js

@@ -0,0 +1,3 @@
+import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{r as m}from"./iframe-G-6sM9Mt.js";import{S as _}from"./index-1v1lhNFD.js";import{F as v,C,k as w,m as D,o as $,s as h,d as P,e as E}from"./schemas-S_Tg7JYp.js";import{c as d}from"./utils-D-KgF5mV.js";import{L as M}from"./label-C5vJTTwH.js";import{I as F}from"./input-11YRd9gD.js";import{B as V}from"./button-BTWmFXop.js";import{t as L}from"./index-DySHPxMy.js";import"./preload-helper-Dp1pzeXC.js";import"./index-DqWzLCH-.js";import"./index-_crRFOM5.js";import"./index-CZaD3imo.js";import"./index-CGrAONsN.js";const y=v,b=m.createContext({}),l=({...o})=>e.jsx(b.Provider,{value:{name:o.name},children:e.jsx(C,{...o})}),c=()=>{const o=m.useContext(b),r=m.useContext(S),{getFieldState:t}=w(),s=D({name:o.name}),a=t(o.name,s);if(!o)throw new Error("useFormField should be used within <FormField>");const{id:n}=r;return{id:n,name:o.name,formItemId:`${n}-form-item`,formDescriptionId:`${n}-form-item-description`,formMessageId:`${n}-form-item-message`,...a}},S=m.createContext({});function u({className:o,...r}){const t=m.useId();return e.jsx(S.Provider,{value:{id:t},children:e.jsx("div",{"data-slot":"form-item",className:d("grid gap-2",o),...r})})}function p({className:o,...r}){const{error:t,formItemId:s}=c();return e.jsx(M,{"data-slot":"form-label","data-error":!!t,className:d("data-[error=true]:text-destructive",o),htmlFor:s,...r})}function f({...o}){const{error:r,formItemId:t,formDescriptionId:s,formMessageId:a}=c();return e.jsx(_,{"data-slot":"form-control",id:t,"aria-describedby":r?`${s} ${a}`:`${s}`,"aria-invalid":!!r,...o})}function N({className:o,...r}){const{formDescriptionId:t}=c();return e.jsx("p",{"data-slot":"form-description",id:t,className:d("text-muted-foreground text-sm",o),...r})}function x({className:o,...r}){const{error:t,formMessageId:s}=c(),a=t?String((t==null?void 0:t.message)??""):r.children;return a?e.jsx("p",{"data-slot":"form-message",id:s,className:d("text-destructive text-sm",o),...r,children:a}):null}u.__docgenInfo={description:"",methods:[],displayName:"FormItem"};p.__docgenInfo={description:"",methods:[],displayName:"FormLabel"};f.__docgenInfo={description:"",methods:[],displayName:"FormControl"};N.__docgenInfo={description:"",methods:[],displayName:"FormDescription"};x.__docgenInfo={description:"",methods:[],displayName:"FormMessage"};l.__docgenInfo={description:"",methods:[],displayName:"FormField"};const X={title:"Shadcn/UI/Form",component:y};function W(){const o=$({email:h().email("Please enter a valid email"),password:h().min(6,"Password must be at least 6 characters")}),r=P({resolver:E(o),defaultValues:{email:"",password:""},mode:"onTouched"});function t(s){L.success(`Submitted: ${JSON.stringify(s,null,2)}`)}return e.jsx("div",{className:"max-w-md space-y-6",children:e.jsx(y,{...r,children:e.jsxs("form",{onSubmit:r.handleSubmit(t),className:"space-y-4",children:[e.jsx(l,{control:r.control,name:"email",render:({field:s})=>e.jsxs(u,{children:[e.jsx(p,{children:"Email"}),e.jsx(f,{children:e.jsx(F,{type:"email",placeholder:"you@example.com",...s})}),e.jsx(N,{children:"We’ll never share your email."}),e.jsx(x,{})]})}),e.jsx(l,{control:r.control,name:"password",render:({field:s})=>e.jsxs(u,{children:[e.jsx(p,{children:"Password"}),e.jsx(f,{children:e.jsx(F,{type:"password",placeholder:"••••••••",...s})}),e.jsx(x,{})]})}),e.jsx(V,{type:"submit",className:"w-full",children:"Sign in"})]})})})}const i={render:()=>e.jsx(W,{})};var j,I,g;i.parameters={...i.parameters,docs:{...(j=i.parameters)==null?void 0:j.docs,source:{originalSource:`{
+  render: () => <ValidatedFormDemo />
+}`,...(g=(I=i.parameters)==null?void 0:I.docs)==null?void 0:g.source}}};const Y=["WithValidation"];export{i as WithValidation,Y as __namedExportsOrder,X as default};