@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 6.36 kB
JavaScript
var n=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?n(...e):typeof e=="object"?Object.keys(e).map((o,b)=>e[b]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var w=(t,e)=>n({[`${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"}),O=(t,e)=>{let{valid:o,invalid:b,hover:L,focus:v,checked:h,active:k,selected:y,disabled:K,indeterminate:I,loading:S,empty:H,readonly:_,highlighted:F,...z}=e;return n({"k-valid":o,"k-invalid":b,"k-hover":L,"k-focus":v,"k-checked":h,"k-active":k,"k-selected":y,"k-disabled":K,"k-indeterminate":I&&!h,"k-loading":S,"k-empty":H,"k-readonly":_,"k-highlighted":F},Object.keys(z).reduce((T,g)=>(g.startsWith("k-")?T[g]=z[g]:T[`k-${g}`]=z[g],T),{}))};var N={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},u={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"};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 R={};function d(t){return R[t]=(R[t]||0)+1,`k-${t}-${R[t]}`}var x="checkbox",p=x;import{jsx as B}from"react/jsx-runtime";var E="k-checkbox",U=[i.hover,i.focus,i.valid,i.invalid,i.required,i.disabled,i.checked,i.indeterminate],q={size:[N.undefined,N.small,N.medium,N.large],rounded:[u.undefined,u.none,u.small,u.medium,u.large,u.full]},V={},l=t=>{let{id:e,checked:o,indeterminate:b,hover:L,focus:v,disabled:h,invalid:k,valid:y,required:K,size:I,rounded:S,wrapperRole:H,..._}=t;return B("span",{className:"k-checkbox-wrap",role:H,children:B("input",{..._,id:e,type:"checkbox",defaultChecked:o,required:K,disabled:h||void 0,"aria-invalid":k?"true":void 0,className:n(t.className,E,w(E,{size:I,rounded:S}),O(E,{hover:L,focus:v,disabled:h,invalid:k,valid:y,indeterminate:b,checked:o}))})})};l.states=U;l.options=q;l.className=E;l.defaultOptions=V;l.moduleName=x;l.folderName=p;l.ariaSpec={selector:".k-checkbox",rules:[{selector:".k-checkbox",attribute:"role=checkbox or type=checkbox",usage:"Announces the checkbox role of the element."},{selector:".k-checkbox",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-checkbox",attribute:"aria-checked=true/false/mixed or checked",usage:"For native checkboxes the checked state is handled by the browser. aria-checked is used for custom implementations."},{selector:".k-checkbox",attribute:"aria-describedby (when has hint or error)",usage:"Points to the hint or error message for the checkbox."},{selector:".k-checkbox",attribute:"disabled or aria-disabled=true (when disabled)",usage:"For native checkboxes use the HTML disabled attribute. aria-disabled for custom implementations."},{selector:".k-invalid, .ng-invalid",attribute:"aria-invalid=true (when invalid)",usage:"Rendered only when the CheckBox is in a form and announces the invalid state."}]};var c=l;import{jsx as Y}from"react/jsx-runtime";var G="k-checkbox-list",J=[],Q={},P={layout:"vertical"},a=t=>{let{layout:e=P.layout,...o}=t;return Y("ul",{...o,className:n(t.className,G,{[`k-list-${e}`]:e}),children:t.children})};a.states=J;a.options=Q;a.className=G;a.defaultOptions=P;a.moduleName=x;a.folderName=p;import{jsx as te}from"react/jsx-runtime";var W="k-checkbox-list-item",Z=[],j={},ee={},r=t=>{let{...e}=t;return te("li",{...e,className:n(t.className,W),children:t.children})};r.states=Z;r.options=j;r.className=W;r.defaultOptions=ee;r.moduleName=x;r.folderName=p;import{Fragment as oe,jsx as D,jsxs as ae}from"react/jsx-runtime";var m=({children:t="Label",id:e="cb-label-after",...o})=>ae(oe,{children:[D(c,{id:e,...o}),D("label",{className:"k-checkbox-label",htmlFor:e,children:t})]});import{Fragment as Ve,jsx as qe,jsxs as Je}from"react/jsx-runtime";import{Fragment as et,jsx as je,jsxs as tt}from"react/jsx-runtime";import{Fragment as it,jsx as nt,jsxs as lt}from"react/jsx-runtime";import{jsx as mt}from"react/jsx-runtime";import{jsx as xt}from"react/jsx-runtime";import{jsx as Ct}from"react/jsx-runtime";import{jsx as s,jsxs as X}from"react/jsx-runtime";var re=a.options,ne=a.states,ie={...a.defaultOptions,variant:"vertical"},le=[{name:"vertical",title:"Vertical"},{name:"horizontal",title:"Horizontal"}],se=[],f=t=>{let{variant:e,...o}=t;return e==="horizontal"?X(a,{layout:"horizontal",...o,children:[s(r,{children:s(m,{id:d("cb"),defaultChecked:!0,children:"Label"})}),s(r,{children:s(m,{id:d("cb"),children:"Label"})}),s(r,{children:s(m,{id:d("cb"),children:"Label"})})]}):X(a,{...o,children:[s(r,{children:s(m,{id:d("cb"),defaultChecked:!0,children:"Label"})}),s(r,{children:s(m,{id:d("cb"),children:"Label"})}),s(r,{children:s(m,{id:d("cb"),children:"Label"})})]})};f.options=re;f.states=ne;f.variants=le;f.defaultOptions=ie;f.modifiers=se;f.className=a.className;import{jsx as ue}from"react/jsx-runtime";var ce=c.options,de=c.states,me=c.defaultOptions,be=[],he=[],C=t=>ue(m,{id:d("checkbox"),...t,defaultChecked:!0,children:"Label"});C.options=ce;C.states=de;C.variants=be;C.defaultOptions=me;C.modifiers=he;C.className=c.className;import{jsx as $,jsxs as fe}from"react/jsx-runtime";var M="k-list-sticky-header",xe=[i.hover,i.focus,i.selected],ke={},pe={},A=t=>{let{label:e="Select all",showCheckbox:o=!0,checked:b,indeterminate:L,hover:v,focus:h,selected:k,...y}=t;return $("div",{...y,className:n(M,t.className),children:fe("div",{className:n(`${M}-item`,O(`${M}-item`,{hover:v,focus:h,selected:k})),children:[o&&$(l,{checked:b,indeterminate:L,"aria-label":e}),$("span",{className:"k-list-item-text",children:e})]})})};A.states=xe;A.options=ke;A.className=M;A.defaultOptions=pe;var Jt=A;export{A as ListSelectAll,Jt as default};