@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 10.1 kB
JavaScript
var c=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?c(...e):typeof e=="object"?Object.keys(e).map((a,r)=>e[r]||e[a]&&a||null).filter(a=>a!==null).join(" "):e).filter(e=>!!e).join(" ");var C=(t,e)=>c({[`${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"}),A=(t,e)=>{let{valid:a,invalid:r,hover:l,focus:x,checked:f,active:m,selected:g,disabled:B,indeterminate:v,loading:V,empty:S,readonly:Z,highlighted:ee,...D}=e;return c({"k-valid":a,"k-invalid":r,"k-hover":l,"k-focus":x,"k-checked":f,"k-active":m,"k-selected":g,"k-disabled":B,"k-indeterminate":v&&!f,"k-loading":V,"k-empty":S,"k-readonly":Z,"k-highlighted":ee},Object.keys(D).reduce((_,I)=>(I.startsWith("k-")?_[I]=D[I]:_[`k-${I}`]=D[I],_),{}))};var n={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var k={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},i={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},y={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 K="breadcrumb",G=K;import{jsx as oe}from"react/jsx-runtime";var E="k-breadcrumb",te=[y.focus],re={size:[n.undefined,n.small,n.medium,n.large]},j={collapsing:"auto"},u=t=>{let{size:e,collapsing:a=j.collapsing,focus:r,...l}=t;return oe("nav",{...l,className:c(t.className,E,A(E,{focus:r}),C(E,{size:e}),{"k-breadcrumb-wrap":a==="wrap"}),"aria-label":"Breadcrumb",children:t.children})};u.states=te;u.options=re;u.className=E;u.defaultOptions=j;u.moduleName=K;u.folderName=G;u.ariaSpec={selector:".k-breadcrumb",rules:[{selector:".k-breadcrumb",attribute:"aria-label=Breadcrumb",usage:"Indicates the type of navigation provided by the nav element."},{selector:".k-breadcrumb-item .k-breadcrumb-link,.k-breadcrumb-item .k-breadcrumb-root-link",attribute:"role=link or nodeName=a",usage:'The breadcrumb item should render an <a> element or have role="link".'},{selector:".k-breadcrumb-last-item .k-breadcrumb-link,.k-breadcrumb-last-item .k-breadcrumb-root-link",attribute:"aria-current=page",usage:"The last breadcrumb item points to the active page."},{selector:".k-breadcrumb-last-item .k-breadcrumb-link",attribute:"aria-disabled=true",usage:"The last breadcrumb item is disabled."},{selector:".k-breadcrumb-delimiter-icon",attribute:"aria-hidden=true",usage:"Delimiter icon should not be accessed through assistive technology."}]};import{jsx as ie}from"react/jsx-runtime";var ne="k-breadcrumb-container",ae={collapsing:"auto"},z=t=>{let{collapsing:e=ae.collapsing,...a}=t;return ie("ol",{...a,className:c(t.className,ne,{"!k-flex-wrap":e==="wrap","k-flex-none":e==="none"}),children:t.children})};import{jsx as ce}from"react/jsx-runtime";var se="k-breadcrumb-item",p=t=>{let{root:e,last:a,...r}=t;return ce("li",{...r,className:c(t.className,se,{"k-breadcrumb-root-item":e,"k-breadcrumb-last-item":a}),children:t.children})};import{jsx as me}from"react/jsx-runtime";var le="k-breadcrumb-item-text",h=t=>{let{text:e,...a}=t,r=e||t.children;return me("span",{...a,className:c(t.className,le),children:r})};import{jsx as be}from"react/jsx-runtime";var de="",ue=[y.hover,y.focus,y.disabled],b=t=>{let{root:e,icon:a,icontext:r,hover:l,focus:x,disabled:f,last:m,...g}=t;return be("a",{href:"#",...g,className:c(t.className,A(de,{hover:l,focus:x,disabled:f}),{"k-breadcrumb-link":!e,"k-breadcrumb-root-link":e,"k-breadcrumb-icon-link":a,"k-breadcrumb-icontext-link":r}),...m&&{"aria-current":"page"},...m&&{"aria-disabled":"true"},children:t.children})};b.states=ue;import{Fragment as ke,jsx as q}from"react/jsx-runtime";var H="k-font-icon",pe=[],xe={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[i.undefined,i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info]},fe={},M=t=>{let{size:e,themeColor:a,icon:r,rotate:l,flip:x,...f}=t;return r?q("span",{...f,className:c(t.className,H,C(H,{size:e}),{[`k-i-${r}`]:r,[`k-color-${a}`]:a,[`k-rotate-${l}`]:l,"k-flip-h":x==="h"||x==="both","k-flip-v":x==="v"||x==="both"}),"aria-hidden":"true"}):q(ke,{})};M.states=pe;M.options=xe;M.className=H;M.defaultOptions=fe;var W=M;import{Fragment as ve,jsx as O}from"react/jsx-runtime";var P="k-svg-icon",he=[],ge={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[i.undefined,i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info],variant:[k.outline,k.solid,k.duotone]},$={viewBox:"0 0 24 24",variant:k.outline},T=t=>{let{size:e,themeColor:a,rotate:r,flip:l,viewBox:x=$.viewBox,variant:f=$.variant,icon:m,...g}=t;if(!m)return O(ve,{});if(m==="none")return O("span",{...g,className:c(t.className,P,C("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let B=typeof m=="object"&&m.name&&m.name,v=typeof m=="object"?f&&m.variants?.[f]||m.variants?.outline||m.content:void 0;return O("span",{...g,className:c(t.className,P,C("k-icon",{size:e}),{[`k-svg-i-${B}`]:B,[`k-color-${a}`]:a,[`k-rotate-${r}`]:r,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),"aria-hidden":"true",children:O("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof m=="object"?m.viewBox:x,dangerouslySetInnerHTML:v!==void 0?{__html:v}:void 0,children:m?void 0:t.children})})};T.states=he;T.options=ge;T.className=P;T.defaultOptions=$;var U=T;import*as F from"@progress/kendo-svg-icons";var X="icon",J="icons";import{useContext as Ce}from"react";import{createContext as Be}from"react";var Q=Be({iconsType:"svg"});import{Fragment as Y,jsx as L}from"react/jsx-runtime";var R="k-icon",Ne=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),ye=[],Ie={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[i.undefined,i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info],variant:[k.outline,k.solid,k.duotone]},w={viewBox:"0 0 24 24",type:"svg",variant:k.outline},s=t=>{let{iconsType:e}=Ce(Q),{size:a,themeColor:r,icon:l,type:x=e||w.type,rotate:f,flip:m,viewBox:g=w.viewBox,variant:B=w.variant,...v}=t;if(!l)return L(Y,{});if((e||x)==="svg"){if(l==="none")return L(U,{...v,className:c(t.className,R),icon:l,size:a,variant:B});let S=F[l]?l:Ne(`${l}-icon`);return F[S]?L(U,{...v,className:c(t.className,R),icon:F[S],size:a,themeColor:r,rotate:f,flip:m,viewBox:g,variant:B}):L(Y,{})}return L(W,{...v,className:c(t.className,R),icon:l,size:a,themeColor:r,rotate:f,flip:m})};s.states=ye;s.options=Ie;s.defaultOptions=w;s.className=R;s.moduleName=X;s.folderName=J;s.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."}]};import{jsx as o,jsxs as d}from"react/jsx-runtime";var Me=u.options,Te=u.states,Le={...u.defaultOptions,variant:"text"},Se=[{name:"text",title:"Text"},{name:"icon",title:"Icon"},{name:"icon-and-text",title:"Icon & Text"}],Ae=[],N=t=>{let{variant:e,...a}=t;switch(e){case"icon":return o(u,{...a,children:d(z,{children:[d(p,{root:!0,children:[o(b,{root:!0,icon:!0,onClick:r=>r.preventDefault(),children:o(s,{icon:"cart"})}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),d(p,{children:[o(b,{icon:!0,onClick:r=>r.preventDefault(),children:o(s,{icon:"js"})}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),d(p,{children:[o(b,{icon:!0,onClick:r=>r.preventDefault(),children:o(s,{icon:"truck"})}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),o(p,{last:!0,children:o(b,{icon:!0,onClick:r=>r.preventDefault(),children:o(s,{icon:"wallet"})})})]})});case"icon-and-text":return o(u,{...a,children:d(z,{children:[d(p,{root:!0,children:[d(b,{root:!0,icontext:!0,onClick:r=>r.preventDefault(),children:[o(s,{icon:"cart"}),o(h,{text:"Cart"})]}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),d(p,{children:[d(b,{icontext:!0,onClick:r=>r.preventDefault(),children:[o(s,{icon:"js"}),o(h,{text:"Billing"})]}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),d(p,{children:[d(b,{icontext:!0,onClick:r=>r.preventDefault(),children:[o(s,{icon:"truck"}),o(h,{text:"Shipping"})]}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),o(p,{last:!0,children:d(b,{icontext:!0,onClick:r=>r.preventDefault(),children:[o(s,{icon:"wallet"}),o(h,{text:"Payment"})]})})]})});default:return o(u,{...a,children:d(z,{children:[d(p,{root:!0,children:[o(b,{root:!0,onClick:r=>r.preventDefault(),children:o(h,{text:"Cart"})}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),d(p,{children:[o(b,{onClick:r=>r.preventDefault(),children:o(h,{text:"Billing"})}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),d(p,{children:[o(b,{onClick:r=>r.preventDefault(),children:o(h,{text:"Shipping"})}),o(s,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),o(p,{last:!0,children:o(b,{onClick:r=>r.preventDefault(),children:o(h,{text:"Payment"})})})]})})}};N.options=Me;N.states=Te;N.variants=Se;N.defaultOptions=Le;N.modifiers=Ae;N.className=u.className;var zt=N;export{N as BreadcrumbDemo,zt as default};