"use strict";(self.webpackChunk_grafana_ui=self.webpackChunk_grafana_ui||[]).push([[446],{"./src/components/Slider/Slider.story.tsx":function(M,h,t){t.r(h),t.d(h,{Basic:function(){return D},WithMarks:function(){return R},default:function(){return L}});var e=t("../../node_modules/react/index.js"),n=t("../../node_modules/@emotion/css/dist/emotion-css.esm.js"),_=t("../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js"),a=t("../../node_modules/rc-slider/es/index.js"),s=t("./src/themes/ThemeContext.tsx"),f=t("./src/components/Input/Input.tsx"),c=t("./src/components/Slider/styles.ts");const g=({min:v,max:p,onChange:b,onAfterChange:T,orientation:W="horizontal",reverse:z,step:V,value:j,ariaLabelForHandle:K,marks:C,included:F})=>{const H=W==="horizontal",N=(0,s.of)(c.$,H,!!C),Y=a.A,[$,U]=(0,e.useState)(j??v),G=(0,e.useCallback)(k=>{const P=typeof k=="number"?k:k[0];U(P),b?.(P)},[U,b]),X=(0,e.useCallback)(k=>{let P=+k.target.value;Number.isNaN(P)&&(P=0),U(P),b&&b(P),T&&T(P)},[b,T]),q=(0,e.useCallback)(k=>{const P=+k.target.value;P>p?U(p):P<v&&U(v)},[p,v]),J=(0,e.useCallback)(k=>{const P=typeof k=="number"?k:k[0];T?.(P)},[T]),Q=H?[]:[N.sliderInputVertical],Z=H?[]:[N.sliderInputFieldVertical];return e.createElement("div",{className:(0,n.cx)(N.container,N.slider)},e.createElement(_.mL,{styles:N.tooltip}),e.createElement("div",{className:(0,n.cx)(N.sliderInput,...Q)},e.createElement(Y,{min:v,max:p,step:V,defaultValue:j,value:$,onChange:G,onChangeComplete:J,vertical:!H,reverse:z,ariaLabelForHandle:K,marks:C,included:F}),e.createElement(f.p,{type:"text",className:(0,n.cx)(N.sliderInputField,...Z),value:$,onChange:X,onBlur:q,min:v,max:p})))};g.displayName="Slider";try{g.displayName="Slider",g.__docgenInfo={description:"",displayName:"Slider",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"number"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((value: number) => void)"}},onAfterChange:{defaultValue:null,description:"",name:"onAfterChange",required:!1,type:{name:"((value?: number) => void)"}},formatTooltipResult:{defaultValue:null,description:"",name:"formatTooltipResult",required:!1,type:{name:"((value: number) => number)"}},ariaLabelForHandle:{defaultValue:null,description:"",name:"ariaLabelForHandle",required:!1,type:{name:"string"}},min:{defaultValue:null,description:"",name:"min",required:!0,type:{name:"number"}},max:{defaultValue:null,description:"",name:"max",required:!0,type:{name:"number"}},orientation:{defaultValue:{value:"horizontal"},description:"",name:"orientation",required:!1,type:{name:"enum",value:[{value:'"horizontal"'},{value:'"vertical"'}]}},reverse:{defaultValue:null,description:"Set current positions of handle(s). If only 1 value supplied, only 1 handle displayed.",name:"reverse",required:!1,type:{name:"boolean"}},step:{defaultValue:null,description:"",name:"step",required:!1,type:{name:"number"}},tooltipAlwaysVisible:{defaultValue:null,description:"",name:"tooltipAlwaysVisible",required:!1,type:{name:"boolean"}},marks:{defaultValue:null,description:"Marks on the slider. The key determines the position, and the value determines what will show. If you want to set the style of a specific mark point, the value should be an object which contains style and label properties.",name:"marks",required:!1,type:{name:"SliderMarks"}},included:{defaultValue:null,description:"If the value is true, it means a continuous value interval, otherwise, it is a independent value.",name:"included",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES<"u"&&(STORYBOOK_REACT_CLASSES["src/components/Slider/Slider.tsx#Slider"]={docgenInfo:g.__docgenInfo,name:"Slider",path:"src/components/Slider/Slider.tsx#Slider"})}catch{}var l=Object.defineProperty,y=Object.defineProperties,x=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,A=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,I=(v,p,b)=>p in v?l(v,p,{enumerable:!0,configurable:!0,writable:!0,value:b}):v[p]=b,o=(v,p)=>{for(var b in p||(p={}))A.call(p,b)&&I(v,b,p[b]);if(w)for(var b of w(p))O.call(p,b)&&I(v,b,p[b]);return v},d=(v,p)=>y(v,x(p)),u,E,r,i,m,S;const B={title:"Forms/Slider",component:g,parameters:{controls:{exclude:["formatTooltipResult","onChange","onAfterChange","value","tooltipAlwaysVisible"]},knobs:{disabled:!0}},argTypes:{orientation:{control:{type:"select",options:["horizontal","vertical"]}},step:{control:{type:"number",min:1}}},args:{min:0,max:100,value:10,orientation:"horizontal",reverse:!1,included:!0,step:void 0}},D=v=>e.createElement("div",{style:{width:"300px",height:"300px"}},e.createElement(g,o({},v))),R=v=>e.createElement("div",{style:{width:"300px",height:"300px"}},e.createElement(g,o({},v)));R.args={marks:{0:"0",25:"25",50:"50",75:"75",100:"100"}};var L=B;D.parameters=d(o({},D.parameters),{docs:d(o({},(u=D.parameters)==null?void 0:u.docs),{source:o({originalSource:`args => {
  return <div style={{
    width: '300px',
    height: '300px'
  }}>
      <Slider {...args} />
    </div>;
}`},(r=(E=D.parameters)==null?void 0:E.docs)==null?void 0:r.source)})}),R.parameters=d(o({},R.parameters),{docs:d(o({},(i=R.parameters)==null?void 0:i.docs),{source:o({originalSource:`args => {
  return <div style={{
    width: '300px',
    height: '300px'
  }}>
      <Slider {...args} />
    </div>;
}`},(S=(m=R.parameters)==null?void 0:m.docs)==null?void 0:S.source)})})},"../grafana-data/src/types/dataFrame.ts":function(M,h,t){t.d(h,{Bc:function(){return n},LE:function(){return _},PU:function(){return e}});var e=(s=>(s.time="time",s.number="number",s.string="string",s.boolean="boolean",s.trace="trace",s.geo="geo",s.enum="enum",s.other="other",s.frame="frame",s.nestedFrames="nestedFrames",s))(e||{});const n="Value",_="Time",a="Metric"},"../grafana-data/src/types/icon.ts":function(M,h,t){t.d(h,{Uo:function(){return _},az:function(){return e},n6:function(){return n}});const e={google:!0,microsoft:!0,github:!0,gitlab:!0,okta:!0,discord:!0,hipchat:!0,amazon:!0,"google-hangouts-alt":!0,pagerduty:!0,line:!0,anchor:!0,"adjust-circle":!0,"angle-double-down":!0,"angle-double-right":!0,"angle-double-up":!0,"angle-down":!0,"angle-left":!0,"angle-right":!0,"angle-up":!0,"align-left":!0,"align-right":!0,"application-observability":!0,apps:!0,"archive-alt":!0,arrow:!0,"arrow-down":!0,"arrow-from-right":!0,"arrow-left":!0,"arrow-random":!0,"arrow-right":!0,"arrow-to-right":!0,"arrow-up":!0,"arrows-h":!0,"arrows-v":!0,asserts:!0,"expand-arrows":!0,at:!0,ai:!0,backward:!0,bars:!0,bell:!0,"bell-slash":!0,bolt:!0,book:!0,bookmark:!0,"book-open":!0,"brackets-curly":!0,bug:!0,building:!0,"calculator-alt":!0,"calendar-alt":!0,"calendar-slash":!0,camera:!0,capture:!0,"channel-add":!0,"chart-line":!0,check:!0,"check-circle":!0,"check-square":!0,circle:!0,"circle-mono":!0,"clipboard-alt":!0,"clock-nine":!0,cloud:!0,"cloud-download":!0,"cloud-upload":!0,"code-branch":!0,cog:!0,columns:!0,"comment-alt":!0,"comment-alt-message":!0,"comment-alt-share":!0,"comments-alt":!0,compass:!0,copy:!0,"corner-down-right-alt":!0,"create-dashboard":!0,"credit-card":!0,crosshair:!0,cube:!0,dashboard:!0,database:!0,"dice-three":!0,docker:!0,"document-info":!0,"download-alt":!0,draggabledots:!0,edit:!0,"ellipsis-v":!0,envelope:!0,"exchange-alt":!0,"exclamation-triangle":!0,"exclamation-circle":!0,"external-link-alt":!0,eye:!0,"eye-slash":!0,"ellipsis-h":!0,"fa fa-spinner":!0,favorite:!0,"file-alt":!0,"file-blank":!0,"file-copy-alt":!0,"file-download":!0,"file-edit-alt":!0,"file-landscape-alt":!0,filter:!0,flip:!0,folder:!0,font:!0,fire:!0,"folder-open":!0,"folder-plus":!0,"folder-upload":!0,forward:!0,"frontend-observability":!0,"gf-bar-alignment-after":!0,"gf-bar-alignment-before":!0,"gf-bar-alignment-center":!0,"gf-glue":!0,"gf-grid":!0,"gf-interpolation-linear":!0,"gf-interpolation-smooth":!0,"gf-interpolation-step-after":!0,"gf-interpolation-step-before":!0,"gf-landscape":!0,"gf-layout-simple":!0,"gf-logs":!0,"gf-ml":!0,"gf-movepane-left":!0,"gf-movepane-right":!0,"gf-portrait":!0,"gf-service-account":!0,"gf-show-context":!0,"gf-pin":!0,"gf-prometheus":!0,"gf-traces":!0,globe:!0,grafana:!0,"graph-bar":!0,heart:!0,"heart-rate":!0,"heart-break":!0,history:!0,"history-alt":!0,home:!0,"home-alt":!0,"horizontal-align-center":!0,"horizontal-align-left":!0,"horizontal-align-right":!0,hourglass:!0,import:!0,info:!0,"info-circle":!0,k6:!0,"key-skeleton-alt":!0,keyboard:!0,"layer-group":!0,"layers-alt":!0,"library-panel":!0,"line-alt":!0,link:!0,"list-ui-alt":!0,"list-ul":!0,"list-ol":!0,lock:!0,"map-marker":!0,"map-marker-plus":!0,"map-marker-minus":!0,message:!0,minus:!0,"minus-circle":!0,"mobile-android":!0,monitor:!0,palette:!0,"panel-add":!0,"pathfinder-unite":!0,pause:!0,pen:!0,percentage:!0,play:!0,plug:!0,plus:!0,"plus-circle":!0,"plus-square":!0,power:!0,"presentation-play":!0,process:!0,"question-circle":!0,"record-audio":!0,repeat:!0,rocket:!0,"ruler-combined":!0,save:!0,search:!0,"search-minus":!0,"search-plus":!0,"share-alt":!0,shield:!0,"shield-exclamation":!0,signal:!0,signin:!0,signout:!0,sitemap:!0,slack:!0,"sliders-v-alt":!0,spinner:!0,"sort-amount-down":!0,"sort-amount-up":!0,"square-shape":!0,star:!0,"step-backward":!0,stopwatch:!0,"stopwatch-slash":!0,sync:!0,"sync-slash":!0,table:!0,"tag-alt":!0,"telegram-alt":!0,"text-fields":!0,"thumbs-up":!0,times:!0,"times-circle":!0,"toggle-on":!0,"toggle-off":!0,"trash-alt":!0,unarchive:!0,unlock:!0,upload:!0,user:!0,"users-alt":!0,"user-arrows":!0,"vertical-align-bottom":!0,"vertical-align-center":!0,"vertical-align-top":!0,"web-section-alt":!0,"wrap-text":!0,rss:!0,x:!0};function n(a){return!a||typeof a!="string"?!1:a in e}function _(a){if(n(a))return a}},"./src/components/Forms/commonStyles.ts":function(M,h,t){t.d(h,{SM:function(){return g},Xb:function(){return a},g$:function(){return s},gm:function(){return _},lH:function(){return f}});var e=t("../../node_modules/@emotion/css/dist/emotion-css.esm.js"),n=t("./src/themes/mixins.ts");const _=l=>(0,e.AH)({"&:focus":(0,n.Hi)(l)}),a=(l,y=!1)=>{const x=y?l.colors.error.border:l.components.input.borderColor,w=y?l.colors.error.shade:l.components.input.borderHover,A=l.components.input.background,O=l.components.input.text,I=l.isDark?"#2e2f35":"#bab4ca";return(0,e.cx)(s(l),(0,e.AH)({background:A,lineHeight:l.typography.body.lineHeight,fontSize:l.typography.size.md,color:O,border:`1px solid ${x}`,"&:-webkit-autofill, &:-webkit-autofill:hover":{boxShadow:`inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px ${A}!important`,WebkitTextFillColor:`${O} !important`,borderColor:I},"&:-webkit-autofill:focus":{boxShadow:`0 0 0 2px ${l.colors.background.primary}, 0 0 0px 4px ${l.colors.primary.main}, inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px ${A}!important`,WebkitTextFillColor:`${O} !important`},"&:hover":{borderColor:w},"&:focus":{outline:"none"},"&:disabled":{backgroundColor:l.colors.action.disabledBackground,color:l.colors.action.disabledText,border:`1px solid ${l.colors.action.disabledBackground}`,"&:hover":{borderColor:x}},"&::placeholder":{color:l.colors.text.disabled,opacity:1}}))},s=l=>(0,e.AH)({padding:l.spacing(0,1,0,1)}),f=()=>({sm:(0,e.AH)({width:c("sm")}),md:(0,e.AH)({width:c("md")}),lg:(0,e.AH)({width:c("lg")}),auto:(0,e.AH)({width:c("auto")})}),c=l=>{switch(l){case"sm":return"200px";case"md":return"320px";case"lg":return"580px";case"auto":default:return"auto"}};function g(l,y){switch(l){case"sm":return{padding:1,fontSize:y.typography.size.sm,height:y.components.height.sm};case"lg":return{padding:3,fontSize:y.typography.size.lg,height:y.components.height.lg};case"md":default:return{padding:2,fontSize:y.typography.size.md,height:y.components.height.md}}}},"./src/components/Icon/Icon.tsx":function(M,h,t){t.d(h,{I:function(){return I}});var e=t("../../node_modules/@emotion/css/dist/emotion-css.esm.js"),n=t("../../node_modules/react/index.js"),_=t("../../node_modules/react-inlinesvg/esm/index.js"),a=t("../grafana-data/src/types/icon.ts"),s=t("./src/themes/ThemeContext.tsx"),f=t("./src/components/Icon/utils.ts"),c=Object.defineProperty,g=Object.getOwnPropertySymbols,l=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,x=(o,d,u)=>d in o?c(o,d,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[d]=u,w=(o,d)=>{for(var u in d||(d={}))l.call(d,u)&&x(o,u,d[u]);if(g)for(var u of g(d))y.call(d,u)&&x(o,u,d[u]);return o},A=(o,d)=>{var u={};for(var E in o)l.call(o,E)&&d.indexOf(E)<0&&(u[E]=o[E]);if(o!=null&&g)for(var E of g(o))d.indexOf(E)<0&&y.call(o,E)&&(u[E]=o[E]);return u};const O=o=>({icon:(0,e.AH)({display:"inline-block",fill:"currentColor",flexShrink:0,label:"Icon",lineHeight:0,verticalAlign:"middle"}),orange:(0,e.AH)({fill:o.v1.palette.orange})}),I=n.forwardRef((o,d)=>{var u=o,{size:E="md",type:r="default",name:i,className:m,style:S,title:B=""}=u,D=A(u,["size","type","name","className","style","title"]);const R=(0,s.of)(O);(0,a.n6)(i)||console.warn("Icon component passed an invalid icon name",i);const L=i==="fa fa-spinner"?"spinner":i,v=(0,f.Wj)(),p=(0,f.cs)(E),b=p,T=i.startsWith("gf-bar-align")?16:i.startsWith("gf-interp")?30:p,W=(0,f.Xi)(L,r),z=`${v}${W}/${L}.svg`,V=(0,e.cx)(R.icon,m,r==="mono"?{[R.orange]:i==="favorite"}:"",L==="spinner"&&"fa-spin");return n.createElement(_.A,w({innerRef:d,src:z,width:T,height:b,title:B,className:V,style:S},D))});I.displayName="Icon";try{I.displayName="Icon",I.__docgenInfo={description:"",displayName:"Icon",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"enum",value:[{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{value:'"amazon"'},{value:'"google-hangouts-alt"'},{value:'"pagerduty"'},{value:'"line"'},{value:'"anchor"'},{value:'"adjust-circle"'},{value:'"angle-double-down"'},{value:'"angle-double-right"'},{value:'"angle-double-up"'},{value:'"angle-down"'},{value:'"angle-left"'},{value:'"angle-right"'},{value:'"angle-up"'},{value:'"align-left"'},{value:'"align-right"'},{value:'"application-observability"'},{value:'"apps"'},{value:'"archive-alt"'},{value:'"arrow"'},{value:'"arrow-down"'},{value:'"arrow-from-right"'},{value:'"arrow-left"'},{value:'"arrow-random"'},{value:'"arrow-right"'},{value:'"arrow-to-right"'},{value:'"arrow-up"'},{value:'"arrows-h"'},{value:'"arrows-v"'},{value:'"asserts"'},{value:'"expand-arrows"'},{value:'"at"'},{value:'"ai"'},{value:'"backward"'},{value:'"bars"'},{value:'"bell"'},{value:'"bell-slash"'},{value:'"bolt"'},{value:'"book"'},{value:'"bookmark"'},{value:'"book-open"'},{value:'"brackets-curly"'},{value:'"bug"'},{value:'"building"'},{value:'"calculator-alt"'},{value:'"calendar-alt"'},{value:'"calendar-slash"'},{value:'"camera"'},{value:'"capture"'},{value:'"channel-add"'},{value:'"chart-line"'},{value:'"check"'},{value:'"check-circle"'},{value:'"check-square"'},{value:'"circle"'},{value:'"circle-mono"'},{value:'"clipboard-alt"'},{value:'"clock-nine"'},{value:'"cloud"'},{value:'"cloud-download"'},{value:'"cloud-upload"'},{value:'"code-branch"'},{value:'"cog"'},{value:'"columns"'},{value:'"comment-alt"'},{value:'"comment-alt-message"'},{value:'"comment-alt-share"'},{value:'"comments-alt"'},{value:'"compass"'},{value:'"copy"'},{value:'"corner-down-right-alt"'},{value:'"create-dashboard"'},{value:'"credit-card"'},{value:'"crosshair"'},{value:'"cube"'},{value:'"dashboard"'},{value:'"database"'},{value:'"dice-three"'},{value:'"docker"'},{value:'"document-info"'},{value:'"download-alt"'},{value:'"draggabledots"'},{value:'"edit"'},{value:'"ellipsis-v"'},{value:'"envelope"'},{value:'"exchange-alt"'},{value:'"exclamation-triangle"'},{value:'"exclamation-circle"'},{value:'"external-link-alt"'},{value:'"eye"'},{value:'"eye-slash"'},{value:'"ellipsis-h"'},{value:'"fa fa-spinner"'},{value:'"favorite"'},{value:'"file-alt"'},{value:'"file-blank"'},{value:'"file-copy-alt"'},{value:'"file-download"'},{value:'"file-edit-alt"'},{value:'"file-landscape-alt"'},{value:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{value:'"frontend-observability"'},{value:'"gf-bar-alignment-after"'},{value:'"gf-bar-alignment-before"'},{value:'"gf-bar-alignment-center"'},{value:'"gf-glue"'},{value:'"gf-grid"'},{value:'"gf-interpolation-linear"'},{value:'"gf-interpolation-smooth"'},{value:'"gf-interpolation-step-after"'},{value:'"gf-interpolation-step-before"'},{value:'"gf-landscape"'},{value:'"gf-layout-simple"'},{value:'"gf-logs"'},{value:'"gf-ml"'},{value:'"gf-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"gf-pin"'},{value:'"gf-prometheus"'},{value:'"gf-traces"'},{value:'"globe"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"heart"'},{value:'"heart-rate"'},{value:'"heart-break"'},{value:'"history"'},{value:'"history-alt"'},{value:'"home"'},{value:'"home-alt"'},{value:'"horizontal-align-center"'},{value:'"horizontal-align-left"'},{value:'"horizontal-align-right"'},{value:'"hourglass"'},{value:'"import"'},{value:'"info"'},{value:'"info-circle"'},{value:'"k6"'},{value:'"key-skeleton-alt"'},{value:'"keyboard"'},{value:'"layer-group"'},{value:'"layers-alt"'},{value:'"library-panel"'},{value:'"line-alt"'},{value:'"link"'},{value:'"list-ui-alt"'},{value:'"list-ul"'},{value:'"list-ol"'},{value:'"lock"'},{value:'"map-marker"'},{value:'"map-marker-plus"'},{value:'"map-marker-minus"'},{value:'"message"'},{value:'"minus"'},{value:'"minus-circle"'},{value:'"mobile-android"'},{value:'"monitor"'},{value:'"palette"'},{value:'"panel-add"'},{value:'"pathfinder-unite"'},{value:'"pause"'},{value:'"pen"'},{value:'"percentage"'},{value:'"plug"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"plus-square"'},{value:'"power"'},{value:'"presentation-play"'},{value:'"process"'},{value:'"question-circle"'},{value:'"record-audio"'},{value:'"repeat"'},{value:'"rocket"'},{value:'"ruler-combined"'},{value:'"save"'},{value:'"search"'},{value:'"search-minus"'},{value:'"search-plus"'},{value:'"share-alt"'},{value:'"shield"'},{value:'"shield-exclamation"'},{value:'"signal"'},{value:'"signin"'},{value:'"signout"'},{value:'"sitemap"'},{value:'"slack"'},{value:'"sliders-v-alt"'},{value:'"spinner"'},{value:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{value:'"stopwatch"'},{value:'"stopwatch-slash"'},{value:'"sync"'},{value:'"sync-slash"'},{value:'"table"'},{value:'"tag-alt"'},{value:'"telegram-alt"'},{value:'"text-fields"'},{value:'"thumbs-up"'},{value:'"times"'},{value:'"times-circle"'},{value:'"toggle-on"'},{value:'"toggle-off"'},{value:'"trash-alt"'},{value:'"unarchive"'},{value:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"web-section-alt"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},size:{defaultValue:{value:"md"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"xl"'},{value:'"xxl"'},{value:'"xxxl"'}]}},type:{defaultValue:{value:"default"},description:"",name:"type",required:!1,type:{name:"enum",value:[{value:'"solid"'},{value:'"default"'},{value:'"mono"'}]}},title:{defaultValue:{value:""},description:"",name:"title",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES<"u"&&(STORYBOOK_REACT_CLASSES["src/components/Icon/Icon.tsx#Icon"]={docgenInfo:I.__docgenInfo,name:"Icon",path:"src/components/Icon/Icon.tsx#Icon"})}catch{}},"./src/components/Icon/utils.ts":function(M,h,t){t.d(h,{Wj:function(){return s},Xi:function(){return n},cs:function(){return _}});const e=["grafana","favorite","heart-break","heart","panel-add","library-panel","circle-mono"];function n(f,c){return f?.startsWith("gf-")?"custom":e.includes(f)?"mono":c==="default"?"unicons":c==="solid"?"solid":"mono"}function _(f){switch(f){case"xs":return 12;case"sm":return 14;case"md":return 16;case"lg":return 18;case"xl":return 24;case"xxl":return 36;case"xxxl":return 48}}let a;function s(){if(a)return a;const f=typeof window<"u"&&window.__grafana_public_path__;return f?a=f+"img/icons/":a="public/img/icons/",a}},"./src/components/Input/Input.tsx":function(M,h,t){t.d(h,{n:function(){return E},p:function(){return u}});var e=t("../../node_modules/@emotion/css/dist/emotion-css.esm.js"),n=t("../../node_modules/react/index.js"),_=t("../../node_modules/react-use/lib/useMeasure.js"),a=t("./src/themes/ThemeContext.tsx"),s=t("./src/themes/stylesFactory.ts"),f=t("./src/components/Forms/commonStyles.ts"),c=t("./src/components/Spinner/Spinner.tsx"),g=Object.defineProperty,l=Object.defineProperties,y=Object.getOwnPropertyDescriptors,x=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,A=Object.prototype.propertyIsEnumerable,O=(r,i,m)=>i in r?g(r,i,{enumerable:!0,configurable:!0,writable:!0,value:m}):r[i]=m,I=(r,i)=>{for(var m in i||(i={}))w.call(i,m)&&O(r,m,i[m]);if(x)for(var m of x(i))A.call(i,m)&&O(r,m,i[m]);return r},o=(r,i)=>l(r,y(i)),d=(r,i)=>{var m={};for(var S in r)w.call(r,S)&&i.indexOf(S)<0&&(m[S]=r[S]);if(r!=null&&x)for(var S of x(r))i.indexOf(S)<0&&A.call(r,S)&&(m[S]=r[S]);return m};const u=n.forwardRef((r,i)=>{const m=r,{className:S,addonAfter:B,addonBefore:D,prefix:R,suffix:L,invalid:v,loading:p,width:b=0}=m,T=d(m,["className","addonAfter","addonBefore","prefix","suffix","invalid","loading","width"]),[W,z]=(0,_.A)(),[V,j]=(0,_.A)(),K=(0,a.$j)(),C=E({theme:K,invalid:!!v,width:b});return n.createElement("div",{className:(0,e.cx)(C.wrapper,S),"data-testid":"input-wrapper"},!!D&&n.createElement("div",{className:C.addon},D),n.createElement("div",{className:C.inputWrapper},R&&n.createElement("div",{className:C.prefix,ref:W},R),n.createElement("input",o(I({ref:i,className:C.input},T),{style:{paddingLeft:R?z.width+12:void 0,paddingRight:L||p?j.width+12:void 0}})),(L||p)&&n.createElement("div",{className:C.suffix,ref:V},p&&n.createElement(c.y,{className:C.loadingIndicator,inline:!0}),L)),!!B&&n.createElement("div",{className:C.addon},B))});u.displayName="Input";const E=(0,s.N)(({theme:r,invalid:i=!1,width:m})=>{const S="28px",B=(0,e.AH)({position:"absolute",top:0,zIndex:1,display:"flex",alignItems:"center",justifyContent:"center",flexGrow:0,flexShrink:0,fontSize:r.typography.size.md,height:"100%",minWidth:S,color:r.colors.text.secondary});return{wrapper:(0,e.cx)((0,e.AH)({label:"input-wrapper",display:"flex",width:m?r.spacing(m):"100%",height:r.spacing(r.components.height.md),borderRadius:r.shape.radius.default,"&:hover":{"> .prefix, .suffix, .input":{borderColor:i?r.colors.error.border:r.colors.primary.border},"input[type='number']":{appearance:"textfield"},"input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button":{WebkitAppearance:"inner-spin-button !important",opacity:1}}})),inputWrapper:(0,e.AH)({label:"input-inputWrapper",position:"relative",flexGrow:1,zIndex:1,"&:not(:first-child):last-child":{"> input":{borderLeft:"none",borderTopLeftRadius:0,borderBottomLeftRadius:0}},"&:first-child:not(:last-child)":{"> input":{borderRight:"none",borderTopRightRadius:0,borderBottomRightRadius:0}},"&:not(:first-child):not(:last-child)":{"> input":{borderRight:"none",borderTopRightRadius:0,borderBottomRightRadius:0,borderTopLeftRadius:0,borderBottomLeftRadius:0}},input:{"&:not(:first-child)":{paddingLeft:S},"&:not(:last-child)":{paddingRight:S},"&[readonly]":{cursor:"default"}}}),input:(0,e.cx)((0,f.gm)(r),(0,f.Xb)(r,i),(0,e.AH)({label:"input-input",position:"relative",zIndex:0,flexGrow:1,borderRadius:r.shape.radius.default,height:"100%",width:"100%"})),inputDisabled:(0,e.AH)({backgroundColor:r.colors.action.disabledBackground,color:r.colors.action.disabledText,border:`1px solid ${r.colors.action.disabledBackground}`,"&:focus":{boxShadow:"none"}}),addon:(0,e.AH)({label:"input-addon",display:"flex",justifyContent:"center",alignItems:"center",flexGrow:0,flexShrink:0,position:"relative","&:first-child":{borderTopRightRadius:0,borderBottomRightRadius:0,"> :last-child":{borderTopRightRadius:0,borderBottomRightRadius:0}},"&:last-child":{borderTopLeftRadius:0,borderBottomLeftRadius:0,"> :first-child":{borderTopLeftRadius:0,borderBottomLeftRadius:0}},"> *:focus":{zIndex:2}}),prefix:(0,e.cx)(B,(0,e.AH)({label:"input-prefix",paddingLeft:r.spacing(1),paddingRight:r.spacing(.5),borderRight:"none",borderTopRightRadius:0,borderBottomRightRadius:0})),suffix:(0,e.cx)(B,(0,e.AH)({label:"input-suffix",paddingLeft:r.spacing(1),paddingRight:r.spacing(1),marginBottom:"-2px",borderLeft:"none",borderTopLeftRadius:0,borderBottomLeftRadius:0,right:0})),loadingIndicator:(0,e.AH)({"& + *":{marginLeft:r.spacing(.5)}})}});try{u.displayName="Input",u.__docgenInfo={description:"",displayName:"Input",props:{width:{defaultValue:null,description:"Sets the width to a multiple of 8px. Should only be used with inline forms. Setting width of the container is preferred in other cases.",name:"width",required:!1,type:{name:"number"}},prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},invalid:{defaultValue:null,description:"Show an invalid state around the input",name:"invalid",required:!1,type:{name:"boolean"}},suffix:{defaultValue:null,description:"Show an icon as a suffix in the input",name:"suffix",required:!1,type:{name:"ReactNode"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},addonBefore:{defaultValue:null,description:"Add a component as an addon before the input",name:"addonBefore",required:!1,type:{name:"ReactNode"}},addonAfter:{defaultValue:null,description:"Add a component as an addon after the input",name:"addonAfter",required:!1,type:{name:"ReactNode"}}}},typeof STORYBOOK_REACT_CLASSES<"u"&&(STORYBOOK_REACT_CLASSES["src/components/Input/Input.tsx#Input"]={docgenInfo:u.__docgenInfo,name:"Input",path:"src/components/Input/Input.tsx#Input"})}catch{}},"./src/components/Slider/styles.ts":function(M,h,t){t.d(h,{$:function(){return _}});var e=t("../../node_modules/@emotion/css/dist/emotion-css.esm.js"),n=t("../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js");const _=(a,s,f=!1)=>{const{spacing:c}=a,g=a.colors.border.strong,l=a.colors.primary.main,y=a.colors.primary.main,w=`box-shadow: 0px 0px 0px 6px ${a.colors.primary.transparent}`;return{container:(0,e.AH)({width:"100%",margin:s?"inherit":c(1,3,1,1),paddingBottom:s&&f?a.spacing(1):"inherit",height:s?"auto":"100%"}),slider:(0,e.AH)`
      .rc-slider {
        display: flex;
        flex-grow: 1;
        margin-left: 7px; // half the size of the handle to align handle to the left on 0 value
      }
      .rc-slider-mark {
        top: ${a.spacing(1.75)};
      }
      .rc-slider-mark-text {
        color: ${a.colors.text.disabled};
        font-size: ${a.typography.bodySmall.fontSize};
      }
      .rc-slider-mark-text-active {
        color: ${a.colors.text.primary};
      }
      .rc-slider-handle {
        border: none;
        background-color: ${y};
        box-shadow: ${a.shadows.z1};
        cursor: pointer;
        opacity: 1;
      }

      .rc-slider-handle:hover,
      .rc-slider-handle:active,
      .rc-slider-handle-click-focused:focus {
        ${w};
      }

      // The triple class names is needed because that's the specificity used in the source css :(
      .rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging,
      .rc-slider-handle:focus-visible {
        box-shadow: 0 0 0 5px ${a.colors.text.primary};
      }

      .rc-slider-dot,
      .rc-slider-dot-active {
        background-color: ${a.colors.text.primary};
        border-color: ${a.colors.text.primary};
      }

      .rc-slider-track {
        background-color: ${l};
      }
      .rc-slider-rail {
        background-color: ${g};
        cursor: pointer;
      }
    `,tooltip:(0,n.AH)`
      body {
        .rc-slider-tooltip {
          cursor: grab;
          user-select: none;
          z-index: ${a.zIndex.tooltip};
        }

        .rc-slider-tooltip-inner {
          color: ${a.colors.text.primary};
          background-color: transparent !important;
          border-radius: 0;
          box-shadow: none;
        }

        .rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {
          display: none;
        }

        .rc-slider-tooltip-placement-top {
          padding: 0;
        }
      }
    `,sliderInput:(0,e.AH)({display:"flex",flexDirection:"row",alignItems:"center",width:"100%"}),sliderInputVertical:(0,e.AH)({flexDirection:"column",height:"100%",".rc-slider":{margin:0,order:2}}),sliderInputField:(0,e.AH)({marginLeft:a.spacing(3),width:"60px",input:{textAlign:"center"}}),sliderInputFieldVertical:(0,e.AH)({margin:`0 0 ${a.spacing(3)} 0`,order:1})}}},"./src/components/Spinner/Spinner.tsx":function(M,h,t){t.d(h,{y:function(){return g}});var e=t("../../node_modules/@emotion/css/dist/emotion-css.esm.js"),n=t("../../node_modules/react/index.js"),_=t("../../node_modules/react-inlinesvg/esm/index.js"),a=t("./src/themes/ThemeContext.tsx"),s=t("./src/types/icon.ts"),f=t("./src/components/Icon/Icon.tsx"),c=t("./src/components/Icon/utils.ts");const g=({className:x,inline:w=!1,iconClassName:A,style:O,size:I="md"})=>{const o=(0,a.of)(l),d=(0,a.of)(y,I);if(typeof I!="string"||!(0,s.rJ)(I)){const u=(0,c.Wj)(),E="spinner",r=(0,c.Xi)(E,"default"),i=`${u}${r}/${E}.svg`;return n.createElement("div",{"data-testid":"Spinner",style:O,className:(0,e.cx)({[o.inline]:w},d.wrapper,x)},n.createElement(_.A,{src:i,width:I,height:I,className:(0,e.cx)("fa-spin",d.icon,x),style:O}))}return n.createElement("div",{"data-testid":"Spinner",style:O,className:(0,e.cx)({[o.inline]:w},x)},n.createElement(f.I,{className:(0,e.cx)("fa-spin",A),name:"spinner",size:I,"aria-label":"loading spinner"}))},l=x=>({inline:(0,e.AH)({display:"inline-block"})}),y=(x,w)=>({wrapper:(0,e.AH)({fontSize:typeof w=="string"?w:`${w}px`}),icon:(0,e.AH)({display:"inline-block",fill:"currentColor",flexShrink:0,label:"Icon",lineHeight:0,verticalAlign:"middle"})});try{g.displayName="Spinner",g.__docgenInfo={description:"",displayName:"Spinner",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},style:{defaultValue:null,description:"",name:"style",required:!1,type:{name:"CSSProperties"}},iconClassName:{defaultValue:null,description:"",name:"iconClassName",required:!1,type:{name:"string"}},inline:{defaultValue:{value:"false"},description:"",name:"inline",required:!1,type:{name:"boolean"}},size:{defaultValue:{value:"md"},description:"",name:"size",required:!1,type:{name:"string | number"}}}},typeof STORYBOOK_REACT_CLASSES<"u"&&(STORYBOOK_REACT_CLASSES["src/components/Spinner/Spinner.tsx#Spinner"]={docgenInfo:g.__docgenInfo,name:"Spinner",path:"src/components/Spinner/Spinner.tsx#Spinner"})}catch{}},"./src/themes/stylesFactory.ts":function(M,h,t){t.d(h,{N:function(){return _}});var e=t("../../node_modules/micro-memoize/dist/micro-memoize.js"),n=t.n(e);function _(a){return n()(a)}},"./src/types/icon.ts":function(M,h,t){t.d(h,{GO:function(){return a},SS:function(){return s},rJ:function(){return _}});var e=t("../grafana-data/src/types/icon.ts"),n=t("../grafana-data/src/types/dataFrame.ts");const _=c=>["xs","sm","md","lg","xl","xxl","xxxl"].includes(c),a=()=>Object.keys(e.az);function s(c){return f(c?.type)}function f(c){if(c)switch(c){case n.PU.time:return"clock-nine";case n.PU.string:return"font";case n.PU.number:return"calculator-alt";case n.PU.boolean:return"toggle-on";case n.PU.trace:return"info-circle";case n.PU.enum:return"list-ol";case n.PU.geo:return"map-marker";case n.PU.other:return"brackets-curly"}return"question-circle"}}}]);
