UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 5.19 kB
var L=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var D=Object.prototype.hasOwnProperty;var q=(t,e)=>{for(var o in e)L(t,o,{get:e[o],enumerable:!0})},I=(t,e,o,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of H(e))!D.call(t,a)&&a!==o&&L(t,a,{get:()=>e[a],enumerable:!(n=_(e,a))||n.enumerable});return t};var F=t=>I(L({},"__esModule",{value:!0}),t);var V={};q(V,{ColorPaletteSelected:()=>X});module.exports=F(V);var s=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?s(...e):typeof e=="object"?Object.keys(e).map((o,n)=>e[n]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var O=(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"}),P=(t,e)=>{let{valid:o,invalid:n,hover:a,focus:d,checked:u,active:c,selected:p,disabled:b,indeterminate:M,loading:h,empty:C,readonly:v,highlighted:E,...g}=e;return s({"k-valid":o,"k-invalid":n,"k-hover":a,"k-focus":d,"k-checked":u,"k-active":c,"k-selected":p,"k-disabled":b,"k-indeterminate":M&&!u,"k-loading":h,"k-empty":C,"k-readonly":v,"k-highlighted":E},Object.keys(g).reduce((A,x)=>(x.startsWith("k-")?A[x]=g[x]:A[`k-${x}`]=g[x],A),{}))};var k={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var m={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 S=require("react/jsx-runtime"),y=t=>(0,S.jsx)("tr",{role:"row",children:t.children});var z=require("react/jsx-runtime"),R="k-colorpalette-tile",j=[m.hover,m.focus,m.selected],B={},l=t=>{let{color:e,tileSize:o,hover:n,focus:a,selected:d,...u}=t,c={backgroundColor:e,width:o?o+"px":"",height:o?o+"px":""};return(0,z.jsx)("td",{...u,role:"gridcell","aria-label":e,"aria-selected":d?"true":void 0,className:s(t.className,R,P(R,{hover:n,focus:a,selected:d})),style:c})};l.states=j;l.options=B;l.className=R;var N="color-palette",w="colorpalette";var f=require("react/jsx-runtime"),T="k-colorpalette",J=[m.disabled],U={size:[k.undefined,k.small,k.medium,k.large]},K={columns:10},i=t=>{let{size:e,palette:o,columns:n=K.columns,tileSize:a,disabled:d,...u}=t,c=[];if(o){let p=n||o.columns,b=o.colors?o.colors:o;Array.isArray(b)&&Array.from({length:Math.ceil(b.length/p)},(M,h)=>{let C=[];b.slice(h*p,(h+1)*p).map((E,g)=>{C.push((0,f.jsx)(l,{color:E,tileSize:a},g))});let v=(0,f.jsx)(y,{children:C},h);c.push(v)})}return(0,f.jsx)("div",{...u,role:"grid","aria-label":"Color palette",tabIndex:0,"aria-disabled":d?"true":void 0,className:s(t.className,T,P(T,{disabled:d}),O(T,{size:e})),children:(0,f.jsx)("table",{className:"k-colorpalette-table",role:"none",children:(0,f.jsx)("tbody",{children:c.length>0?c:t.children})})})};i.states=J;i.options=U;i.className=T;i.defaultOptions=K;i.moduleName=N;i.folderName=w;i.ariaSpec={selector:".k-colorpalette",rules:[{selector:".k-colorpalette",attribute:"role=grid",usage:"The focusable wrapper announces its role as a grid."},{selector:".k-colorpalette",attribute:"aria-label or aria-labelledby",usage:"The component needs an accessible name including the currently selected value."},{selector:".k-colorpalette",attribute:"aria-activedescendant",usage:"Points to the focused cell in the table."},{selector:".k-colorpalette",attribute:"tabindex=0",usage:"The element must be focusable."},{selector:".k-colorpalette.k-disabled",attribute:"aria-disabled=true",usage:"Rendered only when the ColorPalette is disabled."},{selector:".k-colorpalette-table",attribute:"role=none or role=presentation",usage:"Negates the default role of the table element."},{selector:".k-colorpalette-table>tbody>tr",attribute:"role=row",usage:"Required as the semantic role of the parent table has been removed."},{selector:".k-colorpalette-tile",attribute:"role=gridcell",usage:"Required as the semantic role of the parent table has been removed."},{selector:".k-colorpalette-tile",attribute:"aria-label or title",usage:"The text representation of the color value for the current cell."},{selector:".k-colorpalette-tile.k-selected",attribute:"aria-selected=true",usage:"Present on the currently selected cell."}]};var $=i;var r=require("react/jsx-runtime"),X=t=>(0,r.jsxs)($,{...t,children:[(0,r.jsxs)(y,{children:[(0,r.jsx)(l,{color:"#ff0000"}),(0,r.jsx)(l,{color:"#ff5252"}),(0,r.jsx)(l,{color:"#ff6666",selected:!0}),(0,r.jsx)(l,{color:"#ff8080"})]}),(0,r.jsxs)(y,{children:[(0,r.jsx)(l,{color:"#00ff00"}),(0,r.jsx)(l,{color:"#52ff52"}),(0,r.jsx)(l,{color:"#66ff66"}),(0,r.jsx)(l,{color:"#80ff80"})]})]});