@progress/kendo-themes-html/dist/esm/form/form.spec.mjs

A collection of HTML helpers used for developing Kendo UI themes

var s=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?s(...e):typeof e=="object"?Object.keys(e).map((o,a)=>e[a]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var O=(t,e)=>s({[`${t}-xs`]:e.size==="xsmall",[`${t}-sm`]:e.size==="small",[`${t}-md`]:e.size==="medium",[`${t}-lg`]:e.size==="large",[`${t}-xl`]:e.size==="xlarge",[`${t}-xxl`]:e.size==="xxlarge",[`${t}-xxxl`]:e.size==="xxxlarge"},{[`${t}-${e.fillMode}`]:e.fillMode},{[`${t}-${e.fillMode}-${e.themeColor}`]:e.fillMode&&e.themeColor},{[`${t}-${e.themeColor}`]:e.themeColor&&e.fillMode===void 0},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full"}),z=(t,e)=>{let{valid:o,invalid:a,hover:l,focus:d,checked:r,active:g,selected:i,disabled:p,indeterminate:n,loading:m,empty:f,readonly:h,highlighted:_,...N}=e;return s({"k-valid":o,"k-invalid":a,"k-hover":l,"k-focus":d,"k-checked":r,"k-active":g,"k-selected":i,"k-disabled":p,"k-indeterminate":n&&!r,"k-loading":m,"k-empty":f,"k-readonly":h,"k-highlighted":_},Object.keys(N).reduce((E,x)=>(x.startsWith("k-")?E[x]=N[x]:E[`k-${x}`]=N[x],E),{}))};var k={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var L={open:"open",hover:"hover",focus:"focus",active:"active",selected:"selected",disabled:"disabled",valid:"valid",invalid:"invalid",loading:"loading",required:"required",empty:"empty",indeterminate:"indeterminate",checked:"checked",readonly:"readonly",highlighted:"highlighted",generating:"generating",expanded:"expanded"};import{jsx as y,jsxs as S}from"react/jsx-runtime";var $="k-form-field",D=[L.disabled],c=t=>{let{label:e,orientation:o,optional:a,editor:l,hint:d,error:r,info:g,disabled:i,dir:p,colSpan:n}=t;return S("div",{className:s($,t.className,z($,{disabled:i}),{[`k-col-span-${n}`]:n}),dir:p,children:[e&&S("label",{className:s("k-label","k-form-label"),children:[e,a&&y("span",{className:"k-label-optional",children:"(Optional)"}),g&&y("span",{className:"k-field-info",children:"(field info)"})]}),o==="horizontal"&&!e&&y("span",{className:"k-label k-form-label k-label-empty"}),S("div",{className:"k-form-field-wrap",children:[l,d&&y("div",{className:"k-form-hint",children:d}),r&&y("div",{className:"k-form-error",children:r})]})]})};c.states=D;c.className=$;import{Fragment as C,jsx as A,jsxs as P}from"react/jsx-runtime";var w="k-form-fieldset",v=t=>{let{legend:e,layout:o,cols:a,gutters:l,colSpan:d}=t;return P("fieldset",{className:s(w,{[`k-col-span-${d}`]:d}),children:[e&&A("legend",{className:"k-form-legend",children:e}),o==="grid"?A("div",{className:s("k-form-layout","k-d-grid",{[`k-grid-cols-${a}`]:a}),style:{...typeof l=="string"&&{gap:l},...typeof l=="object"&&l.rows&&{rowGap:l.rows},...typeof l=="object"&&l.cols&&{columnGap:l.cols}},children:t.children}):A(C,{children:t.children})]})};v.className=w;var K="form",T="forms";import{Fragment as J,jsx as b,jsxs as X}from"react/jsx-runtime";import{createElement as R}from"react";var F="k-form",H=[],j={size:[k.small,k.medium,k.large]},M={size:k.medium,layout:"basic",tag:"form"},u=t=>{let{size:e=M.size,orientation:o,layout:a=M.layout,formButtons:l,cols:d,gutters:r,tag:g=M.tag,children:i}=t,p=({tag:m,className:f,children:h})=>m==="form"?b("form",{className:f,children:h}):b("div",{className:f,children:h}),n=[];return i&&(Array.isArray(i)?i.map((m,f)=>{m.type===c?n.push(R(c,{...m.props,orientation:o,key:f})):n.push(m)}):i.type===c?n.push(R(c,{...i.props,orientation:o,key:`${new Date().getTime()}`})):i.type===v&&n.push(R(v,{...i.props,key:`${new Date().getTime()}`}))),X(p,{tag:g,className:s(t.className,F,O(F,{size:e}),{[`${F}-${o}`]:o}),children:[a==="grid"?b("div",{className:s("k-form-layout","k-d-grid",{[`k-grid-cols-${d}`]:d}),style:{...typeof r=="string"&&{gap:r},...typeof r=="object"&&r.rows&&{rowGap:r.rows},...typeof r=="object"&&r.cols&&{columnGap:r.cols}},children:n}):b(J,{children:n}),l&&b("div",{className:"k-form-buttons",children:l})]})};u.states=H;u.options=j;u.className=F;u.defaultOptions=M;u.moduleName=K;u.folderName=T;var de=u;export{F as FORM_CLASSNAME,u as Form,de as default};