UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 3.7 kB
var d=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?d(...e):typeof e=="object"?Object.keys(e).map((o,s)=>e[s]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var A=(t,e)=>d({[`${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.themeColor}`]:e.themeColor},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full","k-rounded-none":e.rounded==="none"}),B=(t,e)=>{let{valid:o,invalid:s,hover:h,focus:m,checked:l,active:x,selected:b,disabled:p,indeterminate:g,loading:L,empty:w,readonly:E,highlighted:_,...k}=e;return d({"k-valid":o,"k-invalid":s,"k-hover":h,"k-focus":m,"k-checked":l,"k-active":x,"k-selected":b,"k-disabled":p,"k-indeterminate":g&&!l,"k-loading":L,"k-empty":w,"k-readonly":E,"k-highlighted":_},Object.keys(k).reduce((v,u)=>(u.startsWith("k-")?v[u]=k[u]:v[`k-${u}`]=k[u],v),{}))};var c={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var i={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"};var y={};function O(t){return y[t]=(y[t]||0)+1,`k-${t}-${y[t]}`}var R="radio",M=R;import{jsx as N}from"react/jsx-runtime";var f="k-radio",D=[i.hover,i.focus,i.valid,i.invalid,i.required,i.disabled,i.checked],I={size:[c.undefined,c.small,c.medium,c.large]},S={},n=t=>{let{id:e,checked:o,hover:s,focus:h,disabled:m,invalid:l,valid:x,required:b,size:p,...g}=t;return N("span",{className:"k-radio-wrap",children:N("input",{...g,id:e,type:"radio",checked:o,required:b,disabled:m||void 0,"aria-invalid":l?"true":void 0,className:d(t.className,f,A(f,{size:p}),B(f,{hover:s,focus:h,disabled:m,invalid:l,valid:x,checked:o}))})})};n.states=D;n.options=I;n.className=f;n.defaultOptions=S;n.moduleName=R;n.folderName=M;n.ariaSpec={selector:".k-radio",rules:[{selector:".k-radio",attribute:"type=radio",usage:"Announces the radio type of the input."},{selector:".k-radio",attribute:"label for or aria-label or aria-labelledby (when has accessible name)",usage:"The input requires an accessible name to which it will be assigned."},{selector:".k-radio",attribute:"checked (when checked)",usage:"Boolean attribute that announces the checked state of the radio button."},{selector:".k-radio",attribute:"aria-describedby (when has hint or error)",usage:"Points to the hint or error message for the radio."},{selector:".k-radio",attribute:"disabled=disabled or aria-disabled=true (when disabled)",usage:"Rendered only when the radio input is disabled."},{selector:".k-invalid, .ng-invalid",attribute:"aria-invalid=true (when invalid)",usage:"Rendered only when the radio button is in a form and announces the invalid state."}]};var a=n;import{Fragment as T,jsx as $,jsxs as q}from"react/jsx-runtime";var z=({children:t,id:e,...o})=>q(T,{children:[$(a,{...o,id:e}),$("label",{className:"k-radio-label",htmlFor:e,children:t})]});import{jsx as j}from"react/jsx-runtime";var P=a.options,C=a.states,F=a.defaultOptions,H=[],W=[],r=t=>j(z,{id:O("radio"),name:"value",...t,children:"Label"});r.options=P;r.states=C;r.variants=H;r.defaultOptions=F;r.modifiers=W;r.className=a.className;var fe=r;export{r as RadioButtonDemo,fe as default};