UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 18.1 kB
var ot=Object.create;var se=Object.defineProperty;var it=Object.getOwnPropertyDescriptor;var st=Object.getOwnPropertyNames;var rt=Object.getPrototypeOf,at=Object.prototype.hasOwnProperty;var nt=(e,t)=>{for(var o in t)se(e,o,{get:t[o],enumerable:!0})},_e=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of st(t))!at.call(e,r)&&r!==o&&se(e,r,{get:()=>t[r],enumerable:!(i=it(t,r))||i.enumerable});return e};var ze=(e,t,o)=>(o=e!=null?ot(rt(e)):{},_e(t||!e||!e.__esModule?se(o,"default",{value:e,enumerable:!0}):o,e)),lt=e=>_e(se({},"__esModule",{value:!0}),e);var co={};nt(co,{ListVirtualizationGrouping:()=>tt,VirtualListWithGrouping:()=>lo});module.exports=lt(co);var re=ze(require("react"));var s=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?s(...t):typeof t=="object"?Object.keys(t).map((o,i)=>t[i]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var E=(e,t)=>s({[`${e}-xs`]:t.size==="xsmall",[`${e}-sm`]:t.size==="small",[`${e}-md`]:t.size==="medium",[`${e}-lg`]:t.size==="large",[`${e}-xl`]:t.size==="xlarge",[`${e}-xxl`]:t.size==="xxlarge",[`${e}-xxxl`]:t.size==="xxxlarge"},{[`${e}-${t.fillMode}`]:t.fillMode},{[`${e}-${t.themeColor}`]:t.themeColor},{"k-rounded-sm":t.rounded==="small","k-rounded-md":t.rounded==="medium","k-rounded-lg":t.rounded==="large","k-rounded-full":t.rounded==="full","k-rounded-none":t.rounded==="none"}),M=(e,t)=>{let{valid:o,invalid:i,hover:r,focus:m,checked:d,active:c,selected:h,disabled:g,indeterminate:L,loading:I,empty:b,readonly:H,highlighted:U,...Z}=t;return s({"k-valid":o,"k-invalid":i,"k-hover":r,"k-focus":m,"k-checked":d,"k-active":c,"k-selected":h,"k-disabled":g,"k-indeterminate":L&&!d,"k-loading":I,"k-empty":b,"k-readonly":H,"k-highlighted":U},Object.keys(Z).reduce((j,B)=>(B.startsWith("k-")?j[B]=Z[B]:j[`k-${B}`]=Z[B],j),{}))};var a={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},_={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"};var A={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},n={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},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"};var ue={};function p(e){return ue[e]=(ue[e]||0)+1,`k-${e}-${ue[e]}`}var be=require("react/jsx-runtime"),ct="k-list-group-sticky-header",fe=e=>(0,be.jsx)("div",{className:s(ct,e.className),children:(0,be.jsx)("div",{className:"k-list-header-text",children:e.children})});var we=require("react/jsx-runtime"),mt="k-no-data",xe=e=>{let{live:t,...o}=e;return(0,we.jsx)("span",{...o,className:s(mt,e.className),"aria-live":t?"polite":void 0,children:e.children})};var z="list",F=z;var $=require("react/jsx-runtime"),he="k-list",dt=[],pt={size:[a.undefined,a.small,a.medium,a.large]},ut={},v=e=>{var U;let{size:t,virtualization:o,children:i,header:r,selectAll:m,optionLabel:d,customValue:c,noData:h,screenReaders:g,...L}=e,b=re.default.Children.toArray(i)[0],H=(U=b==null?void 0:b.props)!=null&&U.children?re.default.Children.count(b.props.children):re.default.Children.count(i);return(0,$.jsxs)("div",{...L,className:s(e.className,he,E(he,{size:t}),{"k-virtual-list":o}),children:[d,m,c,r&&(0,$.jsx)(fe,{children:r}),i||(h!==void 0?h:(0,$.jsx)(xe,{live:!0,children:"No data found."})),g&&i&&(0,$.jsxs)(xe,{className:"k-sr-only",live:!0,children:[H," items found."]})]})};v.states=dt;v.options=pt;v.className=he;v.defaultOptions=ut;v.moduleName=z;v.folderName=F;v.ariaSpec={selector:".k-list",rules:[{selector:".k-list .k-no-data",attribute:"aria-live=polite",usage:'Announces "No data found" to screen readers.'}]};var Pe=require("react/jsx-runtime"),De="k-list-container",bt=[],ft={},xt={},V=e=>{let{...t}=e;return(0,Pe.jsx)("div",{...t,className:s(e.className,De),children:e.children})};V.states=bt;V.options=ft;V.className=De;V.defaultOptions=xt;V.moduleName=z;V.folderName=F;var w="checkbox",W=w;var Le=require("react/jsx-runtime"),ae="k-checkbox",ht=[l.hover,l.focus,l.valid,l.invalid,l.required,l.disabled,l.checked,l.indeterminate],Lt={size:[a.undefined,a.small,a.medium,a.large],rounded:[_.undefined,_.none,_.small,_.medium,_.large,_.full]},kt={},N=e=>{let{id:t,checked:o,indeterminate:i,hover:r,focus:m,disabled:d,invalid:c,valid:h,required:g,size:L,rounded:I,wrapperRole:b,...H}=e;return(0,Le.jsx)("span",{className:"k-checkbox-wrap",role:b,children:(0,Le.jsx)("input",{...H,id:t,type:"checkbox",defaultChecked:o,required:g,disabled:d||void 0,"aria-invalid":c?"true":void 0,className:s(e.className,ae,E(ae,{size:L,rounded:I}),M(ae,{hover:r,focus:m,disabled:d,invalid:c,valid:h,indeterminate:i,checked:o}))})})};N.states=ht;N.options=Lt;N.className=ae;N.defaultOptions=kt;N.moduleName=w;N.folderName=W;N.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 y=N;var Be=require("react/jsx-runtime"),Ge="k-checkbox-list",Ct=[],gt={},Ue={layout:"vertical"},k=e=>{let{layout:t=Ue.layout,...o}=e;return(0,Be.jsx)("ul",{...o,className:s(e.className,Ge,{[`k-list-${t}`]:t}),children:e.children})};k.states=Ct;k.options=gt;k.className=Ge;k.defaultOptions=Ue;k.moduleName=w;k.folderName=W;var $e=require("react/jsx-runtime"),Fe="k-checkbox-list-item",vt=[],Nt={},It={},C=e=>{let{...t}=e;return(0,$e.jsx)("li",{...t,className:s(e.className,Fe),children:e.children})};C.states=vt;C.options=Nt;C.className=Fe;C.defaultOptions=It;C.moduleName=w;C.folderName=W;var D=require("react/jsx-runtime"),T=({children:e="Label",id:t="cb-label-after",...o})=>(0,D.jsxs)(D.Fragment,{children:[(0,D.jsx)(y,{id:t,...o}),(0,D.jsx)("label",{className:"k-checkbox-label",htmlFor:t,children:e})]});var ke=require("react/jsx-runtime");var Ce=require("react/jsx-runtime");var ge=require("react/jsx-runtime");var yt=require("react/jsx-runtime");var Ot=require("react/jsx-runtime");var Mt=require("react/jsx-runtime");var x=require("react/jsx-runtime"),At=k.options,St=k.states,Et={...k.defaultOptions,variant:"vertical"},Tt=[{name:"vertical",title:"Vertical"},{name:"horizontal",title:"Horizontal"}],Kt=[],X=e=>{let{variant:t,...o}=e;return t==="horizontal"?(0,x.jsxs)(k,{layout:"horizontal",...o,children:[(0,x.jsx)(C,{children:(0,x.jsx)(T,{id:p("cb"),defaultChecked:!0,children:"Label"})}),(0,x.jsx)(C,{children:(0,x.jsx)(T,{id:p("cb"),children:"Label"})}),(0,x.jsx)(C,{children:(0,x.jsx)(T,{id:p("cb"),children:"Label"})})]}):(0,x.jsxs)(k,{...o,children:[(0,x.jsx)(C,{children:(0,x.jsx)(T,{id:p("cb"),defaultChecked:!0,children:"Label"})}),(0,x.jsx)(C,{children:(0,x.jsx)(T,{id:p("cb"),children:"Label"})}),(0,x.jsx)(C,{children:(0,x.jsx)(T,{id:p("cb"),children:"Label"})})]})};X.options=At;X.states=St;X.variants=Tt;X.defaultOptions=Et;X.modifiers=Kt;X.className=k.className;var Ve=require("react/jsx-runtime"),Ht=y.options,Rt=y.states,_t=y.defaultOptions,zt=[],wt=[],q=e=>(0,Ve.jsx)(T,{id:p("checkbox"),...e,defaultChecked:!0,children:"Label"});q.options=Ht;q.states=Rt;q.variants=zt;q.defaultOptions=_t;q.modifiers=wt;q.className=y.className;var ee=require("react/jsx-runtime"),ve="k-font-icon",Dt=[],Pt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},Gt={},te=e=>{let{size:t,themeColor:o,icon:i,rotate:r,flip:m,...d}=e;return i?(0,ee.jsx)("span",{...d,className:s(e.className,ve,E(ve,{size:t}),{[`k-i-${i}`]:i,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),"aria-hidden":"true"}):(0,ee.jsx)(ee.Fragment,{})};te.states=Dt;te.options=Pt;te.className=ve;te.defaultOptions=Gt;var We=te;var P=require("react/jsx-runtime"),Ne="k-svg-icon",Ut=[],Bt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[A.outline,A.solid,A.duotone]},Ie={viewBox:"0 0 24 24",variant:A.outline},oe=e=>{var I,b;let{size:t,themeColor:o,rotate:i,flip:r,viewBox:m=Ie.viewBox,variant:d=Ie.variant,icon:c,...h}=e;if(!c)return(0,P.jsx)(P.Fragment,{});if(c==="none")return(0,P.jsx)("span",{...h,className:s(e.className,Ne,E("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let g=typeof c=="object"&&c.name&&c.name,L=typeof c=="object"?d&&((I=c.variants)==null?void 0:I[d])||((b=c.variants)==null?void 0:b.outline)||c.content:void 0;return(0,P.jsx)("span",{...h,className:s(e.className,Ne,E("k-icon",{size:t}),{[`k-svg-i-${g}`]:g,[`k-color-${o}`]:o,[`k-rotate-${i}`]:i,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true",children:(0,P.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof c=="object"?c.viewBox:m,dangerouslySetInnerHTML:L!==void 0?{__html:L}:void 0,children:c?void 0:e.children})})};oe.states=Ut;oe.options=Bt;oe.className=Ne;oe.defaultOptions=Ie;var ye=oe;var Oe=ze(require("@progress/kendo-svg-icons"));var Xe="icon",qe="icons";var Ye=require("react");var Je=require("react"),Qe=(0,Je.createContext)({iconsType:"svg"});var K=require("react/jsx-runtime"),ne="k-icon",Ft=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),$t=[],Vt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[A.outline,A.solid,A.duotone]},le={viewBox:"0 0 24 24",type:"svg",variant:A.outline},O=e=>{let{iconsType:t}=(0,Ye.useContext)(Qe),{size:o,themeColor:i,icon:r,type:m=t||le.type,rotate:d,flip:c,viewBox:h=le.viewBox,variant:g=le.variant,...L}=e;if(!r)return(0,K.jsx)(K.Fragment,{});if((t||m)==="svg"){if(r==="none")return(0,K.jsx)(ye,{...L,className:s(e.className,ne),icon:r,size:o,variant:g});let b=Oe[r]?r:Ft(`${r}-icon`);return Oe[b]?(0,K.jsx)(ye,{...L,className:s(e.className,ne),icon:Oe[b],size:o,themeColor:i,rotate:d,flip:c,viewBox:h,variant:g}):(0,K.jsx)(K.Fragment,{})}return(0,K.jsx)(We,{...L,className:s(e.className,ne),icon:r,size:o,themeColor:i,rotate:d,flip:c})};O.states=$t;O.options=Vt;O.defaultOptions=le;O.className=ne;O.moduleName=Xe;O.folderName=qe;O.ariaSpec={selector:".k-icon, .k-svg-icon",rules:[{selector:".k-icon, .k-svg-icon",attribute:"aria-hidden=true",usage:"Hides the icon element and all its children from assistive technologies."}]};var S=require("react/jsx-runtime"),Me="k-list-item",Wt=[l.hover,l.focus,l.selected,l.disabled],Xt={},qt={},u=e=>{let{text:t,groupLabel:o,group:i,iconName:r,iconClassName:m,showCheckbox:d,checked:c,hover:h,focus:g,selected:L,disabled:I,actions:b,description:H,id:U,...Z}=e,j=t||e.children;return(0,S.jsxs)("li",{...Z,id:U,role:i?"presentation":"option",tabIndex:i?void 0:g?0:-1,"aria-selected":!i&&L?"true":i?void 0:"false","aria-disabled":!i&&I?"true":void 0,className:s(e.className,i?"k-list-group-item":Me,M(Me,{hover:h,focus:g,disabled:I,selected:L})),children:[d&&(0,S.jsx)(N,{checked:c}),r&&(0,S.jsx)("span",{className:"k-list-item-icon-wrapper",children:(0,S.jsx)(O,{icon:r,className:s("k-list-item-icon",m)})}),(0,S.jsx)("span",{className:"k-list-item-text",children:j}),b&&(0,S.jsx)("div",{className:"k-list-item-actions",children:b}),H&&(0,S.jsx)("span",{className:"k-list-item-description",children:H}),o&&o!==""&&(0,S.jsx)("div",{className:"k-list-item-group-label",children:o})]})};u.states=Wt;u.options=Xt;u.className=Me;u.defaultOptions=qt;u.moduleName=z;u.folderName=F;u.ariaSpec={selector:".k-list-item",rules:[{selector:".k-list-item",attribute:"role=option",usage:"Each list item is an option in the listbox."},{selector:".k-list-item",attribute:"id",usage:"ID for aria-activedescendant reference."},{selector:".k-list-item",attribute:"aria-selected (when selectable)",usage:"Indicates the selected state of the option."},{selector:".k-list-group-item",attribute:"role=presentation",usage:"Group headers are presentational, not selectable options."},{selector:".k-list-item-icon",attribute:"aria-hidden=true",usage:"Decorative icons are hidden from assistive technology."}]};var Ze=require("react/jsx-runtime"),Jt="k-list-ul",G=e=>{let{children:t,role:o,id:i,...r}=e;return(0,Ze.jsx)("ul",{...r,id:i,role:o,className:s(Jt,e.className),children:t})};G.ariaSpec={selector:".k-list-ul",rules:[{selector:'.k-list-ul[role="listbox"]',attribute:"role=listbox",usage:"For ungrouped lists, the UL has the listbox role."},{selector:'.k-list-ul[role="listbox"]',attribute:"aria-label or aria-labelledby (when has accessible name)",usage:"Accessible name for the listbox."},{selector:'.k-list-ul[role="group"]',attribute:"role=group",usage:"For grouped sublists under a group header."},{selector:'.k-list-ul[role="group"]',attribute:"aria-labelledby (when grouped)",usage:"References the group header ID."}]};var J=require("react/jsx-runtime"),Qt="k-list-content",R=e=>{let{virtualization:t,grouping:o,"aria-label":i,"aria-labelledby":r,listboxId:m,...d}=e;return(0,J.jsxs)("div",{...d,className:s(Qt,e.className),role:o?"listbox":void 0,id:o?m:void 0,"aria-label":o?i:void 0,"aria-labelledby":o?r:void 0,children:[o?e.children:(0,J.jsx)(G,{role:"listbox",id:m,"aria-label":i,"aria-labelledby":r,children:e.children}),t&&(0,J.jsx)("div",{className:"k-height-container",children:(0,J.jsx)("div",{})})]})};R.ariaSpec={selector:".k-list-content",rules:[{selector:'.k-list-content[role="listbox"]',attribute:"role=listbox",usage:"For grouped lists, the list content container has the listbox role."},{selector:'.k-list-content[role="listbox"]',attribute:"aria-label or aria-labelledby (when has accessible name)",usage:"Accessible name for the listbox."}]};var Q=require("react/jsx-runtime"),ce="k-list-sticky-header",Yt=[l.hover,l.focus,l.selected],Zt={},jt={},me=e=>{let{label:t="Select all",showCheckbox:o=!0,checked:i,indeterminate:r,hover:m,focus:d,selected:c,...h}=e;return(0,Q.jsx)("div",{...h,className:s(ce,e.className),children:(0,Q.jsxs)("div",{className:s(`${ce}-item`,M(`${ce}-item`,{hover:m,focus:d,selected:c})),children:[o&&(0,Q.jsx)(N,{checked:i,indeterminate:r,"aria-label":t}),(0,Q.jsx)("span",{className:"k-list-item-text",children:t})]})})};me.states=Yt;me.options=Zt;me.className=ce;me.defaultOptions=jt;var Ae=require("react/jsx-runtime");var Y=require("react/jsx-runtime"),eo="k-list-group-item",ie=e=>{let{groupIconName:t,...o}=e;return(0,Y.jsxs)("li",{...o,role:"presentation",className:s(eo,e.className),children:[t&&(0,Y.jsx)("span",{className:"k-list-item-icon-wrapper",children:(0,Y.jsx)(O,{icon:t,className:"k-list-item-icon"})}),(0,Y.jsx)("span",{className:"k-list-item-text",children:e.children})]})};ie.ariaSpec={selector:".k-list-group-item",rules:[{selector:".k-list-group-item",attribute:"role=presentation",usage:"Group headers are presentational, not selectable options."},{selector:".k-list-group-item",attribute:"id (when referenced)",usage:"ID for aria-labelledby on the parent group UL."}]};var je=require("react/jsx-runtime"),Se="k-list-optionlabel",to=[l.hover,l.focus,l.selected,l.disabled],oo={},io={},de=e=>{let{text:t,hover:o,focus:i,selected:r,disabled:m,...d}=e;return(0,je.jsx)("div",{...d,className:s(Se,M(Se,{hover:o,focus:i,selected:r,disabled:m})),children:t})};de.states=to;de.options=oo;de.className=Se;de.defaultOptions=io;var et=require("react/jsx-runtime"),Ee="k-list-custom-value",so=[l.hover,l.focus,l.selected,l.disabled],ro={},ao={},pe=e=>{let{text:t,hover:o,focus:i,selected:r,disabled:m,...d}=e;return(0,et.jsx)("div",{...d,className:s(Ee,M(Ee,{hover:o,focus:i,selected:r,disabled:m})),children:t})};pe.states=so;pe.options=ro;pe.className=Ee;pe.defaultOptions=ao;var Te=require("react/jsx-runtime");var Ke=require("react/jsx-runtime");var He=require("react/jsx-runtime");var no=require("react/jsx-runtime");var Re=require("react/jsx-runtime");var f=require("react/jsx-runtime"),tt=({children:e,...t})=>{let o=p("list-virt-grp-group"),i=p("list-virt-grp-group");return(0,f.jsx)(v,{header:"Group 1",...t,virtualization:!0,children:(0,f.jsx)(R,{grouping:!0,virtualization:!0,listboxId:"list-virt-grp-listbox","aria-label":"Options",children:e||(0,f.jsxs)(f.Fragment,{children:[(0,f.jsxs)(G,{role:"group","aria-labelledby":o,children:[(0,f.jsx)(ie,{id:o,children:"Group 1"}),(0,f.jsx)(u,{id:p("list-virt-grp-item"),children:"List item 1.1"}),(0,f.jsx)(u,{id:p("list-virt-grp-item"),children:"List item 1.2"}),(0,f.jsx)(u,{id:p("list-virt-grp-item"),children:"List item 1.3"})]}),(0,f.jsxs)(G,{role:"group","aria-labelledby":i,children:[(0,f.jsx)(ie,{id:i,children:"Group 2"}),(0,f.jsx)(u,{id:p("list-virt-grp-item"),children:"List item 2.1"}),(0,f.jsx)(u,{id:p("list-virt-grp-item"),children:"List item 2.2"}),(0,f.jsx)(u,{id:p("list-virt-grp-item"),children:"List item 2.3"})]})]})})})},lo=tt;