UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 11.6 kB
var s=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?s(...e):typeof e=="object"?Object.keys(e).map((i,r)=>e[r]||e[i]&&i||null).filter(i=>i!==null).join(" "):e).filter(e=>!!e).join(" ");var T=(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.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"}),R=(t,e)=>{let{valid:i,invalid:r,hover:d,focus:B,checked:h,active:u,selected:g,disabled:N,indeterminate:v,loading:q,empty:z,readonly:re,highlighted:oe,..._}=e;return s({"k-valid":i,"k-invalid":r,"k-hover":d,"k-focus":B,"k-checked":h,"k-active":u,"k-selected":g,"k-disabled":N,"k-indeterminate":v&&!h,"k-loading":q,"k-empty":z,"k-readonly":re,"k-highlighted":oe},Object.keys(_).reduce((H,M)=>(M.startsWith("k-")?H[M]=_[M]:H[`k-${M}`]=_[M],H),{}))};var a={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"},c={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",W=K;import{jsx as ie}from"react/jsx-runtime";var O="k-breadcrumb",ne=[y.focus],ae={size:[a.undefined,a.small,a.medium,a.large]},X={collapsing:"auto"},p=t=>{let{size:e,collapsing:i=X.collapsing,focus:r,...d}=t;return ie("nav",{...d,className:s(t.className,O,R(O,{focus:r}),T(O,{size:e}),{"k-breadcrumb-wrap":i==="wrap"}),"aria-label":"Breadcrumb",children:t.children})};p.states=ne;p.options=ae;p.className=O;p.defaultOptions=X;p.moduleName=K;p.folderName=W;p.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 se}from"react/jsx-runtime";var ce="k-breadcrumb-root-item-container",J=t=>{let{...e}=t;return se("ol",{...e,className:s(t.className,ce),children:t.children})};import{jsx as ot}from"react/jsx-runtime";import{jsx as de}from"react/jsx-runtime";var me="k-breadcrumb-container",le={collapsing:"auto"},I=t=>{let{collapsing:e=le.collapsing,...i}=t;return de("ol",{...i,className:s(t.className,me,{"!k-flex-wrap":e==="wrap","k-flex-none":e==="none"}),children:t.children})};import{jsx as be}from"react/jsx-runtime";var ue="k-breadcrumb-item",l=t=>{let{root:e,last:i,...r}=t;return be("li",{...r,className:s(t.className,ue,{"k-breadcrumb-root-item":e,"k-breadcrumb-last-item":i}),children:t.children})};import{jsx as fe}from"react/jsx-runtime";var pe="",xe=[y.hover,y.focus,y.disabled],m=t=>{let{root:e,icon:i,icontext:r,hover:d,focus:B,disabled:h,last:u,...g}=t;return fe("a",{href:"#",...g,className:s(t.className,R(pe,{hover:d,focus:B,disabled:h}),{"k-breadcrumb-link":!e,"k-breadcrumb-root-link":e,"k-breadcrumb-icon-link":i,"k-breadcrumb-icontext-link":r}),...u&&{"aria-current":"page"},...u&&{"aria-disabled":"true"},children:t.children})};m.states=xe;import{jsx as he}from"react/jsx-runtime";var Be="k-breadcrumb-item-text",x=t=>{let{text:e,...i}=t,r=e||t.children;return he("span",{...i,className:s(t.className,Be),children:r})};import{Fragment as Ie,jsx as Q}from"react/jsx-runtime";var P="k-font-icon",ke=[],ge={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info]},ve={},A=t=>{let{size:e,themeColor:i,icon:r,rotate:d,flip:B,...h}=t;return r?Q("span",{...h,className:s(t.className,P,T(P,{size:e}),{[`k-i-${r}`]:r,[`k-color-${i}`]:i,[`k-rotate-${d}`]:d,"k-flip-h":B==="h"||B==="both","k-flip-v":B==="v"||B==="both"}),"aria-hidden":"true"}):Q(Ie,{})};A.states=ke;A.options=ge;A.className=P;A.defaultOptions=ve;var Y=A;import{Fragment as Te,jsx as D}from"react/jsx-runtime";var F="k-svg-icon",Ce=[],Ne={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info],variant:[k.outline,k.solid,k.duotone]},U={viewBox:"0 0 24 24",variant:k.outline},S=t=>{let{size:e,themeColor:i,rotate:r,flip:d,viewBox:B=U.viewBox,variant:h=U.variant,icon:u,...g}=t;if(!u)return D(Te,{});if(u==="none")return D("span",{...g,className:s(t.className,F,T("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let N=typeof u=="object"&&u.name&&u.name,v=typeof u=="object"?h&&u.variants?.[h]||u.variants?.outline||u.content:void 0;return D("span",{...g,className:s(t.className,F,T("k-icon",{size:e}),{[`k-svg-i-${N}`]:N,[`k-color-${i}`]:i,[`k-rotate-${r}`]:r,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"}),"aria-hidden":"true",children:D("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof u=="object"?u.viewBox:B,dangerouslySetInnerHTML:v!==void 0?{__html:v}:void 0,children:u?void 0:t.children})})};S.states=Ce;S.options=Ne;S.className=F;S.defaultOptions=U;var V=S;import*as G from"@progress/kendo-svg-icons";var Z="icon",j="icons";import{useContext as Le}from"react";import{createContext as ye}from"react";var ee=ye({iconsType:"svg"});import{Fragment as te,jsx as E}from"react/jsx-runtime";var w="k-icon",Me=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Ae=[],Se={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info],variant:[k.outline,k.solid,k.duotone]},$={viewBox:"0 0 24 24",type:"svg",variant:k.outline},n=t=>{let{iconsType:e}=Le(ee),{size:i,themeColor:r,icon:d,type:B=e||$.type,rotate:h,flip:u,viewBox:g=$.viewBox,variant:N=$.variant,...v}=t;if(!d)return E(te,{});if((e||B)==="svg"){if(d==="none")return E(V,{...v,className:s(t.className,w),icon:d,size:i,variant:N});let z=G[d]?d:Me(`${d}-icon`);return G[z]?E(V,{...v,className:s(t.className,w),icon:G[z],size:i,themeColor:r,rotate:h,flip:u,viewBox:g,variant:N}):E(te,{})}return E(Y,{...v,className:s(t.className,w),icon:d,size:i,themeColor:r,rotate:h,flip:u})};n.states=Ae;n.options=Se;n.defaultOptions=$;n.className=w;n.moduleName=Z;n.folderName=j;n.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{Fragment as Ut,jsx as Pt,jsxs as Ft}from"react/jsx-runtime";import{Fragment as Qt,jsx as Xt,jsxs as Jt}from"react/jsx-runtime";import{jsx as o,jsxs as f}from"react/jsx-runtime";var Ee=p.options,ze=p.states,Re={...p.defaultOptions,variant:"text"},Oe=[{name:"text",title:"Text"},{name:"icon",title:"Icon"},{name:"icon-and-text",title:"Icon & Text"}],De=[],L=t=>{let{variant:e,...i}=t;switch(e){case"icon":return o(p,{...i,children:f(I,{children:[f(l,{root:!0,children:[o(m,{root:!0,icon:!0,onClick:r=>r.preventDefault(),children:o(n,{icon:"cart"})}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),f(l,{children:[o(m,{icon:!0,onClick:r=>r.preventDefault(),children:o(n,{icon:"js"})}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),f(l,{children:[o(m,{icon:!0,onClick:r=>r.preventDefault(),children:o(n,{icon:"truck"})}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),o(l,{last:!0,children:o(m,{icon:!0,onClick:r=>r.preventDefault(),children:o(n,{icon:"wallet"})})})]})});case"icon-and-text":return o(p,{...i,children:f(I,{children:[f(l,{root:!0,children:[f(m,{root:!0,icontext:!0,onClick:r=>r.preventDefault(),children:[o(n,{icon:"cart"}),o(x,{text:"Cart"})]}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),f(l,{children:[f(m,{icontext:!0,onClick:r=>r.preventDefault(),children:[o(n,{icon:"js"}),o(x,{text:"Billing"})]}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),f(l,{children:[f(m,{icontext:!0,onClick:r=>r.preventDefault(),children:[o(n,{icon:"truck"}),o(x,{text:"Shipping"})]}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),o(l,{last:!0,children:f(m,{icontext:!0,onClick:r=>r.preventDefault(),children:[o(n,{icon:"wallet"}),o(x,{text:"Payment"})]})})]})});default:return o(p,{...i,children:f(I,{children:[f(l,{root:!0,children:[o(m,{root:!0,onClick:r=>r.preventDefault(),children:o(x,{text:"Cart"})}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),f(l,{children:[o(m,{onClick:r=>r.preventDefault(),children:o(x,{text:"Billing"})}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),f(l,{children:[o(m,{onClick:r=>r.preventDefault(),children:o(x,{text:"Shipping"})}),o(n,{className:"k-breadcrumb-delimiter-icon",icon:"chevron-right",size:"xsmall"})]}),o(l,{last:!0,children:o(m,{onClick:r=>r.preventDefault(),children:o(x,{text:"Payment"})})})]})})}};L.options=Ee;L.states=ze;L.variants=Oe;L.defaultOptions=Re;L.modifiers=De;L.className=p.className;import{Fragment as we,jsx as b,jsxs as C}from"react/jsx-runtime";var vr=({dir:t,...e})=>b(p,{collapsing:"wrap",children:C(we,{children:[b(J,{children:b(l,{root:!0,children:C(m,{root:!0,icontext:!0,children:[b(n,{icon:"home"}),b(x,{text:"Home"})]})})}),C(I,{collapsing:"wrap",children:[C(l,{children:[b(n,{className:"k-breadcrumb-delimiter-icon",icon:`chevron-${t==="rtl"?"left":"right"}`,size:"xsmall"}),b(m,{children:b(x,{text:"First Item"})})]}),C(l,{children:[b(n,{className:"k-breadcrumb-delimiter-icon",icon:`chevron-${t==="rtl"?"left":"right"}`,size:"xsmall"}),b(m,{children:b(x,{text:"Second Item"})})]}),C(l,{children:[b(n,{className:"k-breadcrumb-delimiter-icon",icon:`chevron-${t==="rtl"?"left":"right"}`,size:"xsmall"}),b(m,{children:b(x,{text:"Third Item"})})]}),C(l,{children:[b(n,{className:"k-breadcrumb-delimiter-icon",icon:`chevron-${t==="rtl"?"left":"right"}`,size:"xsmall"}),b(m,{children:b(x,{text:"Fourth Item"})})]}),C(l,{last:!0,children:[b(n,{className:"k-breadcrumb-delimiter-icon",icon:`chevron-${t==="rtl"?"left":"right"}`,size:"xsmall"}),b(m,{last:!0,children:b(x,{text:"Fifth Item"})})]})]})]}),...e});export{vr as BreadcrumbCollapsingWrap};