@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 15.8 kB
JavaScript
var $e=Object.create;var J=Object.defineProperty;var De=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var Fe=Object.getPrototypeOf,Xe=Object.prototype.hasOwnProperty;var Ve=(e,t)=>{for(var o in t)J(e,o,{get:t[o],enumerable:!0})},de=(e,t,o,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of Ue(t))!Xe.call(e,a)&&a!==o&&J(e,a,{get:()=>t[a],enumerable:!(r=De(t,a))||r.enumerable});return e};var Ge=(e,t,o)=>(o=e!=null?$e(Fe(e)):{},de(t||!e||!e.__esModule?J(o,"default",{value:e,enumerable:!0}):o,e)),Je=e=>de(J({},"__esModule",{value:!0}),e);var Et={};Ve(Et,{PromptBoxDemo:()=>P,default:()=>Mt});module.exports=Je(Et);var l=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?l(...t):typeof t=="object"?Object.keys(t).map((o,r)=>t[r]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var k=(e,t)=>l({[`${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"}),ue=(e,t)=>{let{valid:o,invalid:r,hover:a,focus:p,checked:u,active:d,selected:O,disabled:b,indeterminate:h,loading:g,empty:T,readonly:L,highlighted:H,...C}=t;return l({"k-valid":o,"k-invalid":r,"k-hover":a,"k-focus":p,"k-checked":u,"k-active":d,"k-selected":O,"k-disabled":b,"k-indeterminate":h&&!u,"k-loading":g,"k-empty":T,"k-readonly":L,"k-highlighted":H},Object.keys(C).reduce((m,_)=>(_.startsWith("k-")?m[_]=C[_]:m[`k-${_}`]=C[_],m),{}))};function ce(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(r=>[`k-${r}`,!0]))}var s={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},w={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},N={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},S={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"},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 me=require("react/jsx-runtime"),Z="k-input-inner",qe=[],We={},q={type:"text",autocomplete:"off",value:"",placeholder:""},$=e=>{let{value:t=q.value,type:o=q.type,placeholder:r=q.placeholder,autocomplete:a=q.autocomplete,disabled:p,readOnly:u,...d}=e;return(0,me.jsx)("input",{...d,type:o,className:l(e.className,Z,k(Z,e)),placeholder:r,autoComplete:a,defaultValue:t,disabled:p||void 0,readOnly:u||void 0})};$.states=qe;$.options=We;$.className=Z;var xe=require("react/jsx-runtime"),j="k-input-inner",Qe=[],Ye={},fe={value:"",placeholder:""},D=e=>{let{value:t=fe.value,placeholder:o=fe.placeholder,rows:r,disabled:a,...p}=e;return(0,xe.jsx)("textarea",{...p,className:l(e.className,j,k(j,e)),placeholder:o,rows:r,defaultValue:t,disabled:a||void 0})};D.states=Qe;D.options=Ye;D.className=j;var ee="prompt-box",be=ee;var U=require("react/jsx-runtime"),te="k-font-icon",Ze=[],je={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},et={},F=e=>{let{size:t,themeColor:o,icon:r,rotate:a,flip:p,...u}=e;return r?(0,U.jsx)("span",{...u,className:l(e.className,te,k(te,{size:t}),{[`k-i-${r}`]:r,[`k-color-${o}`]:o,[`k-rotate-${a}`]:a,"k-flip-h":p==="h"||p==="both","k-flip-v":p==="v"||p==="both"}),"aria-hidden":"true"}):(0,U.jsx)(U.Fragment,{})};F.states=Ze;F.options=je;F.className=te;F.defaultOptions=et;var he=F;var K=require("react/jsx-runtime"),oe="k-svg-icon",tt=[],ot={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[S.outline,S.solid,S.duotone]},ne={viewBox:"0 0 24 24",variant:S.outline},X=e=>{var g,T;let{size:t,themeColor:o,rotate:r,flip:a,viewBox:p=ne.viewBox,variant:u=ne.variant,icon:d,...O}=e;if(!d)return(0,K.jsx)(K.Fragment,{});if(d==="none")return(0,K.jsx)("span",{...O,className:l(e.className,oe,k("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let b=typeof d=="object"&&d.name&&d.name,h=typeof d=="object"?u&&((g=d.variants)==null?void 0:g[u])||((T=d.variants)==null?void 0:T.outline)||d.content:void 0;return(0,K.jsx)("span",{...O,className:l(e.className,oe,k("k-icon",{size:t}),{[`k-svg-i-${b}`]:b,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":a==="h"||a==="both","k-flip-v":a==="v"||a==="both"}),"aria-hidden":"true",children:(0,K.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof d=="object"?d.viewBox:p,dangerouslySetInnerHTML:h!==void 0?{__html:h}:void 0,children:d?void 0:e.children})})};X.states=tt;X.options=ot;X.className=oe;X.defaultOptions=ne;var ae=X;var re=Ge(require("@progress/kendo-svg-icons"));var ge="icon",ve="icons";var ke=require("react");var Te=require("react"),Ne=(0,Te.createContext)({iconsType:"svg"});var I=require("react/jsx-runtime"),W="k-icon",nt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),at=[],rt={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[S.outline,S.solid,S.duotone]},Q={viewBox:"0 0 24 24",type:"svg",variant:S.outline},M=e=>{let{iconsType:t}=(0,ke.useContext)(Ne),{size:o,themeColor:r,icon:a,type:p=t||Q.type,rotate:u,flip:d,viewBox:O=Q.viewBox,variant:b=Q.variant,...h}=e;if(!a)return(0,I.jsx)(I.Fragment,{});if((t||p)==="svg"){if(a==="none")return(0,I.jsx)(ae,{...h,className:l(e.className,W),icon:a,size:o,variant:b});let T=re[a]?a:nt(`${a}-icon`);return re[T]?(0,I.jsx)(ae,{...h,className:l(e.className,W),icon:re[T],size:o,themeColor:r,rotate:u,flip:d,viewBox:O,variant:b}):(0,I.jsx)(I.Fragment,{})}return(0,I.jsx)(he,{...h,className:l(e.className,W),icon:a,size:o,themeColor:r,rotate:u,flip:d})};M.states=at;M.options=rt;M.defaultOptions=Q;M.className=W;M.moduleName=ge;M.folderName=ve;M.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 se="button",ye=se;var v=require("react/jsx-runtime"),V="k-button",st=["icon-button"],it=[y.hover,y.focus,y.active,y.selected,y.disabled,y.generating],lt={size:[s.undefined,s.xsmall,s.small,s.medium,s.large],rounded:[w.undefined,w.none,w.small,w.medium,w.large,w.full],fillMode:[N.undefined,N.solid,N.flat,N.outline,N.clear,N.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},ie={showArrow:!1,arrowIconName:"chevron-down"},i=e=>{let{as:t="button",size:o,rounded:r,fillMode:a,themeColor:p,showArrow:u=ie.showArrow,arrowIconName:d=ie.arrowIconName,variant:O,hover:b,focus:h,active:g,selected:T,disabled:L,togglable:H,ariaDisabled:C,icon:m,iconSize:_,text:G,iconClassName:Ke,className:Le,...ze}=e,Re=m!=null,He=e.children!==void 0;return(0,v.jsxs)(t,{className:l(Le,V,ce(V,O),k(V,{size:o,rounded:r,fillMode:a,themeColor:p}),ue(V,{hover:b,focus:h,active:g,disabled:L||C,selected:T}),{"k-icon-button":!G&&!He&&Re}),"aria-pressed":H?T?"true":"false":void 0,...ze,"aria-disabled":C?"true":void 0,disabled:L||void 0,children:[typeof m=="string"&&m&&(0,v.jsx)(M,{className:l(Ke,"k-button-icon"),icon:m,size:_}),m&&typeof m!="string"&&(0,v.jsx)(v.Fragment,{children:m}),G?(0,v.jsxs)(v.Fragment,{children:[G&&(0,v.jsx)("span",{className:"k-button-text",children:G}),e.children]}):e.children&&(0,v.jsx)("span",{className:"k-button-text",children:e.children}),u&&(0,v.jsx)("span",{className:"k-menu-button-arrow k-button-arrow",children:(0,v.jsx)(M,{icon:d})})]})};i.states=it;i.options=lt;i.variants=st;i.className=V;i.defaultOptions=ie;i.moduleName=se;i.folderName=ye;i.ariaSpec={selector:".k-button",rules:[{selector:".k-button",attribute:"role=button or nodeName=button",usage:"The button role is implicit from the native <button> element."},{selector:".k-button",attribute:"aria-label (when icon-only)",usage:"Required for icon-only buttons that have no visible text."},{selector:".k-button",attribute:"aria-pressed (when togglable)",usage:"Indicates the pressed state of a toggle button."},{selector:".k-button",attribute:"disabled (when disabled)",usage:"Rendered when the button is disabled."}]};var Be=require("react/jsx-runtime"),A=e=>(0,Be.jsx)(i,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});var Se=require("react/jsx-runtime"),Oe=e=>(0,Se.jsx)(i,{icon:"folder",children:"Button",...e});var Ee=require("react/jsx-runtime"),Me=e=>(0,Ee.jsx)(i,{children:"Button",...e});var Y=require("react/jsx-runtime"),pt=i.options,dt=i.states,ut={...i.defaultOptions,variant:"text"},ct=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],mt=[],z=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return(0,Y.jsx)(A,{...o,icon:"star"});case"icon-and-text":return(0,Y.jsx)(Oe,{...o,icon:"star",children:"Button"});default:return(0,Y.jsx)(Me,{...o,children:"Button"})}};z.options=pt;z.states=dt;z.variants=ct;z.defaultOptions=ut;z.modifiers=mt;z.className=i.className;var le="speech-to-text-button",Ie=le;var Pe=require("react/jsx-runtime"),Ce="k-speech-to-text-button",Ae={icon:"microphone"},f=e=>{let{listening:t=!1,icon:o=Ae.icon,...r}=e;return(0,Pe.jsx)(i,{...r,icon:t?"stop":o,className:l(e.className,Ce,{"k-listening":t}),"aria-pressed":t?"true":"false","aria-label":t?"Stop listening":"Start listening"})};f.states=i.states;f.options=i.options;f.className=Ce;f.defaultOptions=Ae;f.moduleName=le;f.folderName=Ie;f.ariaSpec={selector:".k-speech-to-text-button",rules:[{selector:".k-button.k-speech-to-text-button",attribute:"role=button or nodeName=button",usage:"If the used element is not <button>, explicitly set its role to button."},{selector:".k-button.k-speech-to-text-button",attribute:"aria-pressed",usage:"Announces the toggle behaviour of the button."},{selector:".k-button.k-speech-to-text-button",attribute:"aria-label",usage:"Accessible name for the speech-to-text button."}]};var ft=require("react/jsx-runtime");var xt=require("react/jsx-runtime");var we=require("react/jsx-runtime"),bt=i.states,_e={...i.defaultOptions,variant:"normal"},ht={...i.options,fillMode:i.options.fillMode.filter(e=>e!=="clear"&&e!=="link")},gt=[],vt=[{name:"normal",title:"Normal"},{name:"listening",title:"Listening"}],R=e=>{let{variant:t,...o}={..._e,...e},r={};return t==="listening"&&(r.listening=!0),(0,we.jsx)(f,{...o,...r})};R.options=ht;R.states=bt;R.variants=vt;R.defaultOptions=_e;R.modifiers=gt;R.className=f.className;var B=require("react/jsx-runtime"),E="k-prompt-box",Tt=[y.hover,y.focus,y.disabled],Nt={fillMode:[N.undefined,N.solid,N.flat,N.outline]},pe={lineMode:"auto",isExpanded:!1},x=e=>{let{fillMode:t,lineMode:o=pe.lineMode,startAffix:r,endAffix:a,header:p,isExpanded:u=pe.isExpanded,className:d,children:O,value:b,placeholder:h,generating:g,hover:T,focus:L,disabled:H,...C}=e,m=o==="multi"||o==="auto"&&u;return(0,B.jsxs)("div",{...C,className:l(d,"k-input",E,{[`${E}-singleline`]:o==="single",[`${E}-multiline`]:m,[`k-input-${t}`]:t,"k-hover":T,"k-focus":L,"k-disabled":H}),children:[p&&(0,B.jsx)("div",{className:`${E}-header`,children:p}),(0,B.jsxs)("div",{className:`${E}-content`,children:[r&&(0,B.jsx)("div",{className:`${E}-affix`,children:r}),o==="single"?(0,B.jsx)($,{value:b,placeholder:h,className:`${E}-input`,type:"text","aria-label":"Prompt input"}):(0,B.jsx)(D,{value:b,placeholder:h,className:`${E}-textarea`,rows:o==="multi"||u?3:1,"aria-label":"Prompt input","aria-multiline":"true"}),(0,B.jsxs)("div",{className:`${E}-affix`,children:[a,(0,B.jsx)(f,{size:"small",fillMode:"flat",rounded:"full"}),(0,B.jsx)(A,{icon:g?"stop":"arrow-up",size:"small",rounded:"full",active:g,disabled:!b&&!g,className:l({"k-generating":g}),"aria-label":g?"Stop generating":"Send prompt","aria-live":"polite"})]})]}),O]})};x.states=Tt;x.options=Nt;x.className=E;x.defaultOptions=pe;x.moduleName=ee;x.folderName=be;x.ariaSpec={selector:".k-prompt-box",rules:[{selector:".k-prompt-box-singleline .k-prompt-box-input",attribute:"nodeName=input",usage:"Ensures the input field has the proper textbox role."},{selector:".k-prompt-box-singleline .k-prompt-box-input",attribute:"aria-label",usage:"Provides an accessible label for the single-line input."},{selector:".k-prompt-box-multiline .k-prompt-box-textarea",attribute:"nodeName=textarea",usage:"Ensures the textarea has the proper textbox role."},{selector:".k-prompt-box-multiline .k-prompt-box-textarea",attribute:"aria-label",usage:"Provides an accessible label for the textarea."},{selector:".k-prompt-box-multiline .k-prompt-box-textarea",attribute:"aria-multiline=true",usage:"Indicates the textarea supports multiple lines of text."},{selector:".k-prompt-box:not(.k-prompt-box-singleline):not(.k-prompt-box-multiline) .k-prompt-box-textarea",attribute:"nodeName=textarea",usage:"Ensures the auto-mode textarea has the proper textbox role."},{selector:".k-prompt-box:not(.k-prompt-box-singleline):not(.k-prompt-box-multiline) .k-prompt-box-textarea",attribute:"aria-label",usage:"Provides an accessible label for the auto-mode textarea."},{selector:".k-prompt-box:not(.k-prompt-box-singleline):not(.k-prompt-box-multiline) .k-prompt-box-textarea",attribute:"aria-multiline=true",usage:"Indicates the auto-mode textarea supports multiple lines of text."},{selector:".k-prompt-box-affix .k-button:not(.k-speech-to-text-button)",attribute:"aria-label",usage:"The send/stop button is labelled to indicate its current action."},{selector:".k-prompt-box-affix .k-button:not(.k-speech-to-text-button)",attribute:"aria-live=polite",usage:"Announces the change in status of the send/stop button."}]};var c=require("react/jsx-runtime"),kt=x.options,yt=x.states,Bt={...x.defaultOptions,variant:"Single"},Ot=[{name:"Single",title:"Singleline"},{name:"Multi",title:"Multiline"}],St=[{name:"header",title:"Header"},{name:"endAffix",title:"End Affix"},{name:"startAffix",title:"Start Affix"}],P=e=>{let{variant:t,modifiers:o,...r}=e,a={},p=(0,c.jsx)(c.Fragment,{children:(0,c.jsx)(A,{size:"small",icon:"send",fillMode:"flat"})});return Object.keys(o||{}).forEach(u=>{switch(u){case"header":a.header=o!=null&&o[u]?(0,c.jsx)(i,{children:"Button in header"}):void 0;break;case"endAffix":o!=null&&o[u]&&(a.endAffix=(0,c.jsxs)(c.Fragment,{children:[p,(0,c.jsx)(A,{icon:"paperclip",size:"small",fillMode:"flat"})]}));break;case"startAffix":a.startAffix=o!=null&&o[u]?(0,c.jsx)(c.Fragment,{children:(0,c.jsx)(A,{icon:"plus",size:"small",fillMode:"flat"})}):void 0;break;default:break}}),t==="Multi"?(0,c.jsx)(x,{style:{width:300},lineMode:"multi",endAffix:p,placeholder:"Enter your prompt...",...r,...a}):(0,c.jsx)(x,{style:{width:300},lineMode:"single",endAffix:p,placeholder:"Enter your prompt...",...r,...a})};P.options=kt;P.states=yt;P.variants=Ot;P.defaultOptions=Bt;P.modifiers=St;P.className=x.className;var Mt=P;